/* /divisions/smart/ : page-scoped components from saniservice-smart V2.html, mapped to the
   theme tokens (the master already uses them verbatim). Global chrome (nav/footer/buttons),
   reset, body, .wrap, .eyebrow/.serif base and headings come from style.css; only the page's
   own section vocabulary lives here. The master's unused .covers block is intentionally
   omitted (no matching markup). Loaded only on this page. */

  /* Hero (flat --night, radial scrim; mobile relaxation inherited from responsive.css, as
     on the sibling division/service pages). */
  .ac-hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--night);}
  .ac-hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;}
  .ac-hero .scrim{position:absolute;inset:0;background:radial-gradient(120% 120% at 72% 8%,rgba(107,79,46,.32) 0%,rgba(33,26,18,.66) 46%,rgba(33,26,18,.96) 100%);}
  .ac-hero .inner{position:relative;padding-bottom:74px;width:100%;}
  .crumb{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:26px;}
  .crumb a{color:rgba(255,255,255,.7);text-decoration:none;}
  .crumb a:hover{color:#e8c79a;}
  .ac-hero h1{color:#fff;font-size:clamp(2.6rem,6vw,5rem);max-width:18ch;margin-bottom:24px;}
  .ac-hero h1 em{font-family:'Fraunces';font-style:italic;color:#e8c79a;font-size:1.04em;}
  .ac-hero .sub{color:rgba(255,255,255,.9);font-size:1.2rem;max-width:55ch;margin-bottom:18px;}
  .ac-hero .servesline{color:rgba(255,255,255,.62);font-size:.92rem;letter-spacing:.04em;}
  .ac-hero .cta-row{margin-top:34px;display:flex;gap:18px;flex-wrap:wrap;align-items:center;}

  /* Stats band (Fraunces-italic value treatment, like membership / the-lab). */
  .stats{background:var(--night);color:var(--night-text);padding:40px 0;border-top:1px solid rgba(179,167,143,.18);}
  .stats .row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;}
  .stat{flex:1;min-width:160px;}
  /* Stat value: size converged to the established Fraunces stat-band scale (hygienization)
     so it shrinks on phone instead of holding a fixed 1.7rem. FAMILY left Fraunces per the
     master (flagged for Ninad: sibling service pages use Archivo; only hygienization shares
     this Fraunces treatment). */
  .stat .n{font-family:'Fraunces';font-style:italic;font-weight:400;font-size:clamp(1.35rem, 1.05rem + 1.3vw, 1.7rem);color:#efe4d2;letter-spacing:-.02em;line-height:1.1;}
  .stat .t{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;margin-top:8px;}

  .sec{padding:120px 0;}
  .sec-head{max-width:48ch;margin-bottom:60px;}
  .sec-head h2{font-size:clamp(2rem,4.2vw,3.2rem);margin:18px 0;}
  .sec-head h2 em{font-family:'Fraunces';font-style:italic;color:var(--accent);font-size:1.12em;}
  .sec-head p{color:var(--ink-soft);font-size:1.1rem;}

  /* The contractor-lottery problem (calm). */
  .calm{background:var(--paper-deep);}
  .calm .eyebrow{color:var(--accent);}
  /* Aligned to .diff h2 (= service.css .diff h2) so SMART's two light-section statement
     H2s read at one size (master had 2.8; theme scale + internal consistency -> 3rem). */
  .calm h2{font-size:clamp(1.9rem,3.8vw,3rem);margin:18px 0;max-width:26ch;}
  .calm h2 em{font-family:'Fraunces';font-style:italic;color:var(--accent);font-size:1.12em;}
  .calm .lede{max-width:62ch;color:var(--ink-soft);font-size:1.12rem;}
  .calm .lede + .lede{margin-top:20px;}
  .principle{margin-top:40px;border-left:2px solid var(--accent);padding:6px 0 6px 26px;max-width:56ch;}
  .principle .serif{font-size:1.4rem;color:var(--ink);}

  /* The difference: contractor lottery vs SMART. */
  .diff{background:var(--paper);}
  .diff h2{color:var(--ink);font-size:clamp(1.9rem,3.8vw,3rem);margin:18px 0;max-width:26ch;}
  .diff h2 em{font-family:'Fraunces';font-style:italic;color:var(--accent);font-size:1.12em;}
  .compare{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:50px;}
  .compare>div{background:var(--paper);padding:38px 36px;}
  .compare .them{background:var(--paper-deep);}
  .compare h4{font-family:'Archivo';font-weight:600;font-size:.84rem;letter-spacing:.18em;text-transform:uppercase;margin-bottom:22px;}
  .compare .them h4{color:var(--ink-soft);}
  .compare .us h4{color:var(--accent);}
  .compare .us h4::before{content:"";display:inline-block;width:22px;height:2px;background:var(--accent);vertical-align:middle;margin-right:10px;}
  .compare ul{list-style:none;}
  .compare li{padding:11px 0;border-top:1px solid var(--line);font-size:.98rem;color:var(--ink-soft);}
  .compare .us li{color:var(--ink);}
  @media(max-width:680px){.compare{grid-template-columns:1fr;}}

  /* Range / mastery. */
  .range{background:var(--paper-deep);}
  .range-scale{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:50px;}
  .range-scale>div{background:var(--paper);padding:36px 34px;}
  .range-scale .rk{font-family:'Fraunces';font-style:italic;color:var(--accent);font-size:.95rem;margin-bottom:12px;}
  .range-scale h3{font-size:1.4rem;font-weight:400;margin-bottom:10px;}
  .range-scale p{color:var(--ink-soft);font-size:.98rem;}
  @media(max-width:760px){
    .range-scale{grid-template-columns:1fr;}
    /* keep the far-right subject in frame on phones (subject right, black left half); header.ac-hero img.bg is 0,2,2, beating the 0,2,1 base */
    header.ac-hero img.bg{ object-position:right center; }
  }
  .range-note{margin-top:40px;border-left:2px solid var(--accent);padding:6px 0 6px 26px;max-width:60ch;}
  .range-note .serif{font-size:1.4rem;color:var(--ink);}

  /* Why in-house: the standard connection (dark). */
  .why{background:var(--night);color:var(--night-text);}
  .why .sec-head h2{color:#efe4d2;}
  .why .sec-head h2 em{color:#d9b783;}
  .why .sec-head p{color:#a89c84;}
  .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:10px;}
  .why-card{border-top:1px solid rgba(179,167,143,.3);padding-top:22px;}
  .why-card h4{color:#efe4d2;font-weight:400;font-size:1.15rem;margin-bottom:10px;}
  .why-card p{color:#a89c84;font-size:.96rem;}
  @media(max-width:760px){.why-grid{grid-template-columns:1fr;}}

  /* Reserved / the access frame (bordered band). */
  .reserved{background:var(--paper-deep);}
  .reserved .inner-band{border:1px solid var(--line);background:var(--paper);padding:54px 50px;max-width:920px;margin:0 auto;text-align:center;}
  .reserved .eyebrow{color:var(--accent);}
  .reserved h2{font-size:clamp(1.8rem,3.6vw,2.6rem);margin:18px auto 18px;max-width:24ch;}
  .reserved h2 em{font-family:'Fraunces';font-style:italic;color:var(--accent);}
  .reserved p{color:var(--ink-soft);font-size:1.08rem;max-width:58ch;margin:0 auto;}

  /* Final CTA (base; style.css section.final unifies h2/p sizing site-wide). */
  .final{background:var(--night);color:var(--night-text);text-align:center;padding:120px 0;}
  .final .eyebrow{color:#c79a5e;}
  .final h2{color:#efe4d2;font-size:clamp(2rem,4.4vw,3.4rem);margin:22px auto;max-width:24ch;}
  .final h2 em{font-family:'Fraunces';font-style:italic;color:#d9b783;font-size:1.12em;}
  .final p{color:#a89c84;max-width:52ch;margin:0 auto 30px;}

  .reveal{opacity:0;transform:translateY(28px);transition:opacity 1s cubic-bezier(.2,.7,.3,1),transform 1s cubic-bezier(.2,.7,.3,1);}
  .reveal.in{opacity:1;transform:none;}
