/* ============================================================
   LIMESTONE v5 layer — exhibits, proof, CTA, responsive
   Loads AFTER site.css. Tokens mirror limestonebranding.
   ============================================================ */
:root{
  --lms-charcoal:#333333; --lms-ink:#1F1D1B; --lms-gold:#E4CC8E; --lms-gold-dk:#8A7B45;
  --lms-patina:#7A8C6E; --lms-taupe:#787065; --lms-dark:#141312;
  --lms-paper:#F5F5F5; --lms-paper-warm:#FBFAF7; --lms-tint:#F3EEE3;
  --lms-hair:#E4DDCD; --lms-hair-2:#C9C0AE;
  --lms-sp-1:8px; --lms-sp-2:16px; --lms-sp-3:24px; --lms-sp-4:32px;
  --lms-sp-6:48px; --lms-sp-8:64px; --lms-sp-12:96px;
}

/* ---------- EXHIBITS (inline, scale-safe, never a shrunk PNG) ---------- */
.ex{
  margin:var(--lms-sp-6) 0; padding:var(--lms-sp-4);
  background:var(--lms-paper-warm); border:1px solid var(--lms-hair);
  border-radius:2px;
}
.ex-eyebrow{
  font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--lms-gold-dk); margin-bottom:10px;
}

/* ---------- 12px FLOOR (brand checklist: no text below 12px) ----------
   v4's site.css sets tracked uppercase labels at 9-11px. Each selector below
   matches an actual offending rule in site.css, at equal or higher specificity
   so it wins without !important. Verified in-browser, not assumed. */
.eyebrow, .section-eyebrow, .page-eyebrow,
.nav-sub, .footer-brand-sub, .footer-col-title,
.ex-source, .floor, .proof, .n{
  font-size:12px;
}
/* these carry higher specificity in site.css, so match it */
.nav-dropdown-menu.mega .mega-col .mega-col-title,
.nav-dropdown-menu.mega .mega-col-title,
.nav-links > a.btn-nav, .btn-nav{ font-size:12px; }
.nav-dropdown-trigger::after{ font-size:12px; }
@media (max-width:860px){ .btn-nav{ font-size:12px; } }
.ex-title{
  font-size:clamp(19px,2.1vw,25px); line-height:1.25; font-weight:700;
  color:var(--lms-charcoal); margin:0 0 10px; letter-spacing:-.008em; max-width:62ch;
}
.ex-kicker{
  font-size:14px; line-height:1.6; color:var(--lms-taupe);
  margin:0 0 var(--lms-sp-3); max-width:76ch;
}
/* the canvas scrolls on its own rather than letting the page scroll sideways */
.ex-canvas{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ex-canvas svg{ display:block; width:100%; height:auto; min-width:680px; }
.ex-source{
  margin-top:var(--lms-sp-3); padding-top:10px; border-top:1px solid var(--lms-hair);
  font-size:12px; line-height:1.5; color:var(--lms-taupe);
}
/* HTML-built exhibits: give them a floor width so their grids don't collapse */
.ex-canvas > div, .ex-canvas > table{ min-width:640px; }

/* ---------- PROOF: sits BESIDE the CTA (25% CTR lift), not in a silo ---------- */
.proof-cta{
  display:grid; grid-template-columns:1.15fr .85fr; gap:var(--lms-sp-6);
  align-items:center; margin:var(--lms-sp-8) 0;
  padding:var(--lms-sp-6); background:var(--lms-dark); border-radius:2px;
}
.proof-cta h2{ color:#fff; font-size:clamp(21px,2.4vw,30px); line-height:1.22; margin:0 0 12px; }
.proof-cta p{ color:#CFC9BF; font-size:15px; line-height:1.65; margin:0 0 var(--lms-sp-3); }
.quote{ border-left:2px solid var(--lms-gold); padding:2px 0 2px 16px; margin:0 0 var(--lms-sp-3); }
.quote p{ color:#EDE7DC; font-size:14px; line-height:1.6; margin:0 0 6px; }
.quote cite{ color:var(--lms-gold); font-size:12px; font-style:normal; letter-spacing:.04em; }

/* ---------- CTA: one action, min 48px target, 16px breathing room ---------- */
.btn{
  display:inline-block; min-height:48px; padding:14px 26px; margin:8px 16px 8px 0;
  font-size:15px; font-weight:600; letter-spacing:.01em; border-radius:2px;
  text-decoration:none; border:1.5px solid transparent; cursor:pointer;
}
.btn-primary{ background:var(--lms-gold); color:var(--lms-ink); border-color:var(--lms-gold); }
.btn-primary:hover{ background:#EFD9A6; }
.btn-ghost{ background:transparent; color:var(--lms-gold); border-color:var(--lms-gold-dk); }
.btn-onlight{ background:var(--lms-charcoal); color:#fff; border-color:var(--lms-charcoal); }

/* ---------- SCOPE TABLE (tiers, no prices except the one floor) ---------- */
.scope{ width:100%; border-collapse:collapse; margin:var(--lms-sp-4) 0; font-size:14px; }
.scope thead th{
  background:var(--lms-charcoal); color:#EFE6CF; text-align:left; padding:11px 13px;
  font-size:12px; font-weight:600; letter-spacing:.04em;
}
.scope td{ padding:11px 13px; border-bottom:1px solid var(--lms-hair); vertical-align:top; color:var(--lms-charcoal); }
.scope tbody tr:nth-child(even) td{ background:var(--lms-paper-warm); }
.scope .yes{ color:var(--lms-patina); font-weight:700; }
.scope .no{ color:var(--lms-hair-2); }
.floor{ font-size:13px; color:var(--lms-taupe); margin-top:10px; }

/* ---------- ESTIMATOR ---------- */
.est{ background:var(--lms-paper-warm); border:1px solid var(--lms-hair); border-radius:2px; padding:var(--lms-sp-4); margin:var(--lms-sp-6) 0; }
.est fieldset{ border:0; padding:0; margin:0 0 var(--lms-sp-3); }
.est legend{ font-size:14px; font-weight:700; color:var(--lms-charcoal); margin-bottom:10px; padding:0; }
.est .opts{ display:flex; flex-wrap:wrap; gap:10px; }
.est .opt{
  border:1px solid var(--lms-hair-2); background:#fff; border-radius:2px;
  padding:11px 15px; font-size:14px; cursor:pointer; min-height:44px;
}
.est .opt[aria-pressed="true"]{ background:var(--lms-charcoal); color:#fff; border-color:var(--lms-charcoal); }
.est-result{ margin-top:var(--lms-sp-3); padding-top:var(--lms-sp-3); border-top:1px solid var(--lms-hair); }
.est-tier{ font-size:20px; font-weight:700; color:var(--lms-charcoal); margin:0 0 6px; }
.est-why{ font-size:14px; color:var(--lms-taupe); line-height:1.6; margin:0 0 var(--lms-sp-3); }
.est input[type=email]{
  width:100%; max-width:380px; min-height:48px; padding:12px 14px; font-size:15px;
  border:1px solid var(--lms-hair-2); border-radius:2px; background:#fff;
}

/* ---------- VIDEO SLOT (poster fallback so it looks finished unfilmed) ---------- */
.vid{ position:relative; aspect-ratio:16/9; background:var(--lms-dark); border-radius:2px; overflow:hidden; margin:var(--lms-sp-6) 0; }
.vid .vid-meta{ position:absolute; left:0; bottom:0; padding:var(--lms-sp-3); }
.vid .vid-eyebrow{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--lms-gold); margin-bottom:6px; }
.vid .vid-title{ color:#fff; font-size:clamp(17px,2vw,22px); font-weight:700; margin:0; max-width:34ch; }
.vid iframe,.vid video{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* ---------- IN-PROSE SERVICE LINKS (the internal link graph) ---------- */
.xlink{
  color:inherit; text-decoration:none;
  border-bottom:1px solid var(--lms-gold); padding-bottom:1px;
}
.xlink:hover{ border-bottom-color:var(--lms-gold-dk); color:var(--lms-gold-dk); }
.section-dark .xlink, .proof-cta .xlink{ border-bottom-color:var(--lms-gold); }
.section-dark .xlink:hover, .proof-cta .xlink:hover{ color:var(--lms-gold); }

/* ---------- RELATED RAIL (every page reaches its mapped destinations) ---------- */
.rel-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:var(--lms-sp-2); margin-top:var(--lms-sp-4);
}
.rel{
  display:block; padding:var(--lms-sp-3); text-decoration:none;
  background:var(--lms-paper-warm); border:1px solid var(--lms-hair);
  border-left:2px solid var(--lms-gold); border-radius:2px;
}
.rel:hover{ background:var(--lms-tint); border-left-color:var(--lms-gold-dk); }
.rel-t{
  display:block; font-size:15px; font-weight:700; color:var(--lms-charcoal);
  margin-bottom:6px; line-height:1.3;
}
.rel-d{ display:block; font-size:13px; line-height:1.55; color:var(--lms-taupe); }

/* ---------- NAP FOOTER ---------- */
.nap{ font-size:13px; line-height:1.7; color:#8E877C; }
.nap a{ color:#CFC9BF; text-decoration:none; }
.nap strong{ color:#CFC9BF; font-weight:600; }

/* ---------- RESPONSIVE: three real breakpoints ---------- */
@media (max-width:1100px){
  .proof-cta{ grid-template-columns:1fr; gap:var(--lms-sp-4); }
}
@media (max-width:820px){
  .ex{ padding:var(--lms-sp-3); }
  .ex-canvas svg{ min-width:600px; }
  .scope{ display:block; overflow-x:auto; }
  .btn{ display:block; width:100%; margin:8px 0; text-align:center; }
}
@media (max-width:560px){
  .ex-title{ font-size:18px; }
  .ex-kicker{ font-size:13px; }
  .ex-canvas svg,.ex-canvas > div,.ex-canvas > table{ min-width:520px; }
  .ex-canvas::after{
    content:"Scroll to see the full exhibit"; display:block; margin-top:8px;
    font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--lms-hair-2);
  }
  .proof-cta{ padding:var(--lms-sp-3); }
}
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } }