/* ════════════════════════════════════════════════════════════
   Shared calculator styles — /tools/ pages. Mobile-first.
   Design system: bone bg, olive accent, near-black result card.
   ════════════════════════════════════════════════════════════ */

.calc-hero { background: var(--near-black); padding: clamp(56px,9vw,104px) 0 clamp(36px,6vw,72px); text-align: center; }
.calc-hero__eyebrow { display:inline-block; font-size:0.72rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--olive); margin-bottom:16px; }
.calc-hero h1 { font-family:var(--font-display); font-size:clamp(1.55rem,5.2vw,3.1rem); font-weight:400; color:var(--bone); line-height:1.15; margin-bottom:16px; overflow-wrap:break-word; padding:0 6px; }
.calc-hero p { font-size:clamp(0.98rem,2vw,1.12rem); color:rgba(245,241,234,0.65); max-width:560px; margin:0 auto; line-height:1.6; padding:0 4px; }

.calc-wrap { max-width:760px; margin:0 auto; padding:clamp(32px,6vw,72px) 0; }
.calc-card { background:#fff; border:1px solid rgba(28,28,25,0.1); border-radius:var(--radius-lg,16px); padding:clamp(18px,4vw,36px); box-shadow:0 10px 40px rgba(28,28,25,0.06); }

.calc-row { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; align-items:end; margin-bottom:12px; }
.calc-field { min-width:0; }                 /* prevents grid blowout on mobile */
.calc-field label { display:block; font-size:0.76rem; font-weight:600; color:var(--near-black); margin-bottom:6px; }
.calc-field input, .calc-field select {
  width:100%; padding:12px 13px;
  font-family:var(--font-body,Inter,sans-serif);
  font-size:16px;                            /* 16px stops iOS zoom-on-focus */
  border:1.5px solid rgba(28,28,25,0.18); border-radius:9px;
  background:var(--bone); color:var(--near-black);
  -webkit-appearance:none; appearance:none;
}
.calc-field input:focus, .calc-field select:focus { outline:none; border-color:var(--olive); }
.calc-field select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7B3A' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; padding-right:34px; }

.calc-remove { background:none; border:none; color:rgba(28,28,25,0.4); font-size:1.5rem; cursor:pointer; padding:0 6px; line-height:1; min-height:44px; min-width:34px; align-self:end; }
.calc-remove:hover { color:#a14242; }
.calc-add { background:none; border:1.5px dashed rgba(28,28,25,0.25); color:var(--near-black); font-family:var(--font-body); font-size:0.85rem; font-weight:600; padding:11px 16px; border-radius:9px; cursor:pointer; margin-top:4px; min-height:44px; transition:border-color .2s,color .2s; }
.calc-add:hover { border-color:var(--olive); color:var(--olive); }

.calc-controls { display:flex; flex-wrap:wrap; gap:14px 18px; align-items:end; margin-top:20px; padding-top:20px; border-top:1px solid rgba(28,28,25,0.1); }
.calc-controls .calc-field { flex:1 1 160px; }

.calc-result { margin-top:24px; background:var(--near-black); border-radius:var(--radius-lg,16px); padding:clamp(20px,4vw,32px); color:var(--bone); }
.calc-result__headline { font-family:var(--font-display); font-size:clamp(1.4rem,5vw,2.1rem); color:var(--bone); margin-bottom:4px; line-height:1.2; }
.calc-result__headline span { color:var(--olive); }
.calc-result__sub { font-size:0.88rem; color:rgba(245,241,234,0.55); margin-bottom:18px; }
.calc-result__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(104px,1fr)); gap:12px; }
.calc-stat { background:rgba(245,241,234,0.06); border:1px solid rgba(245,241,234,0.1); border-radius:11px; padding:13px 15px; }
.calc-stat__num { font-size:clamp(1.3rem,4.5vw,1.5rem); font-weight:600; color:var(--bone); line-height:1.1; word-break:break-word; }
.calc-stat__label { font-size:0.72rem; color:rgba(245,241,234,0.5); margin-top:4px; }
.calc-note { font-size:0.8rem; color:rgba(245,241,234,0.55); margin-top:18px; line-height:1.55; }

.calc-prose { max-width:760px; margin:0 auto; padding:0 0 clamp(40px,7vw,80px); }
.calc-prose h2 { font-family:var(--font-display); font-size:clamp(1.35rem,3.5vw,1.9rem); color:var(--near-black); margin:32px 0 12px; }
.calc-prose h3 { font-size:1.02rem; color:var(--near-black); margin:20px 0 6px; }
.calc-prose p { color:var(--stone,#5a564e); line-height:1.7; margin-bottom:12px; }
.calc-prose ul { color:var(--stone,#5a564e); line-height:1.7; margin:0 0 12px 1.1rem; }

.calc-cta { background:var(--olive); border-radius:var(--radius-lg,16px); padding:clamp(24px,5vw,40px); text-align:center; margin-top:8px; }
.calc-cta h2 { font-family:var(--font-display); color:var(--bone); font-size:clamp(1.3rem,4vw,1.9rem); margin-bottom:10px; }
.calc-cta p { color:rgba(245,241,234,0.85); margin-bottom:20px; }
.calc-cta a { display:inline-block; background:var(--bone); color:var(--near-black); font-weight:600; padding:14px 26px; border-radius:9px; text-decoration:none; min-height:44px; }
.calc-link { text-align:center; margin-top:18px; font-size:0.9rem; }
.calc-link a { color:var(--olive); font-weight:600; text-decoration:none; }

/* Tools hub cards */
.tools-hero { background: var(--near-black); padding: clamp(56px,9vw,112px) 0 clamp(40px,7vw,80px); text-align: center; }
.tools-hero__eyebrow { display:inline-block; font-size:0.72rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--olive); margin-bottom:16px; }
.tools-hero h1 { font-family:var(--font-display); font-size:clamp(1.7rem,5.6vw,3.4rem); font-weight:400; color:var(--bone); line-height:1.15; margin-bottom:16px; overflow-wrap:break-word; padding:0 6px; }
.tools-hero p { font-size:clamp(0.98rem,2vw,1.15rem); color:rgba(245,241,234,0.65); max-width:580px; margin:0 auto; line-height:1.6; padding:0 4px; }
.tools-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; padding:clamp(32px,6vw,72px) 0; }
.tool-card { display:flex; flex-direction:column; gap:9px; background:#fff; border:1px solid rgba(28,28,25,0.1); border-radius:var(--radius-lg,16px); padding:26px 24px; text-decoration:none; transition:transform .2s,box-shadow .2s; }
.tool-card:hover { transform:translateY(-3px); box-shadow:0 14px 40px rgba(28,28,25,0.08); }
.tool-card__tag { font-size:0.66rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--olive); }
.tool-card h2 { font-family:var(--font-display); font-size:1.35rem; font-weight:400; color:var(--near-black); }
.tool-card p { font-size:0.9rem; color:var(--stone,#5a564e); line-height:1.6; }
.tool-card__go { font-size:0.84rem; font-weight:600; color:var(--olive); margin-top:auto; }
.tool-card--soon { opacity:0.6; }
.tool-card--soon .tool-card__go { color:rgba(28,28,25,0.4); }

/* Narrow phones: keep length/width side-by-side, drop the × under width */
@media (max-width:520px) {
  .calc-row { grid-template-columns:1fr 1fr; gap:10px 10px; }
  .calc-remove { grid-column:2; justify-self:end; margin-top:-4px; min-height:32px; }
  .calc-controls .calc-field { flex:1 1 100%; }
}