:root{
    /* Lunovus 360 brand palette, sampled from the logo mark and wordmark.
       Deep #00246c-#053e8f through mid #1b6db6-#238ccd to highlight #5ebaeb.
       Amber stays as the action colour: it is the complement of the brand
       blue, so it separates a call to action without competing with it. */
    --ink:#0c2246;
    --ink-soft:#48586e;
    --white:#ffffff;
    --bone:#f5f7f6;
    --navy:#0c2246;
    --navy-2:#123a72;
    --teal:#0d51a0;
    --teal-bright:#2a90d6;
    --teal-deep:#0c2246;
    --amber:#0d7d68;
    --amber-deep:#0a5f4d;
    --amber-bright:#38c19b;
    --rust:#c63f23;
    --line:#dde3e0;
    --shadow-sm:0 1px 2px rgba(17,33,31,.05),0 4px 14px rgba(17,33,31,.05);
    --shadow-md:0 10px 40px rgba(17,33,31,.10);
    --shadow-teal:0 16px 50px rgba(11,110,99,.22);
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:'Archivo',sans-serif;background:var(--white);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  .wrap{max-width:1160px;margin:0 auto;padding:0 28px}
  h1,h2,h3{font-family:'Fraunces',serif;font-weight:600;line-height:1.04;letter-spacing:-.015em}
  .eyebrow{font-family:'Archivo',sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--teal-bright)}

  nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .navin{display:flex;align-items:center;justify-content:space-between;padding:15px 28px;max-width:1160px;margin:0 auto}
  .logo{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}
  .logo-text{display:flex;flex-direction:column;font-family:'Fraunces',serif;font-size:1.42rem;font-weight:600;letter-spacing:-.02em;line-height:1}
  .logo-text small{font-family:'Archivo',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-bright);margin-top:3px}
  .eye{width:34px;height:34px;flex:none}
  .mark{width:38px;height:38px;flex:none;display:block}
  .footlogo{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:14px}
  .footlogo-optisite{font-family:'Fraunces',serif;font-size:1.8rem;font-weight:600;letter-spacing:-.02em;color:var(--ink);line-height:1}
  .footlogo-by{font-family:'Archivo',sans-serif;font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute);margin-top:6px}
  .footlogo img{width:190px;height:auto;display:block;margin-top:2px}
  .navlinks{display:flex;gap:30px;align-items:center}
  .navlinks a{color:var(--ink-soft);text-decoration:none;font-size:.92rem;font-weight:500;transition:color .2s}
  .navlinks a:hover{color:var(--teal)}
  .btn{display:inline-flex;align-items:center;gap:8px;background:var(--navy);color:#fff;padding:13px 24px;border-radius:40px;text-decoration:none;font-weight:600;font-size:.92rem;border:none;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s}
  
  .btn:hover{background:var(--navy-2);transform:translateY(-2px);box-shadow:var(--shadow-teal)}
  .btn-amber{background:var(--amber);color:#fff}
  .btn-amber:hover{background:var(--amber-deep)}
  @media(max-width:780px){.navlinks a:not(.btn){display:none}}

  header{position:relative;padding:78px 0 64px;overflow:hidden}
  .blob{position:absolute;border-radius:50%;filter:blur(70px);z-index:0;opacity:.5}
  .blob-1{width:520px;height:520px;background:radial-gradient(circle,#bfeee6,transparent 70%);top:-160px;right:-120px}
  .blob-2{width:420px;height:420px;background:radial-gradient(circle,#d5e7dd,transparent 70%);bottom:-180px;left:-140px;opacity:.4}
  .iris{position:absolute;z-index:0;right:-90px;top:40px;width:440px;height:440px;opacity:.16;transform:rotate(18deg)}
  @keyframes spin{to{transform:rotate(360deg)}}
  .hero{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
  .pill{display:inline-flex;align-items:center;gap:8px;background:var(--bone);border:1px solid var(--line);border-radius:30px;padding:7px 15px;font-size:.78rem;font-weight:600;color:var(--teal-deep);margin-bottom:22px}
  .pill .dot{width:8px;height:8px;border-radius:50%;background:var(--rust);box-shadow:0 0 0 0 rgba(198,63,35,.5);animation:pulse 2s 2}
  @keyframes pulse{70%{box-shadow:0 0 0 7px rgba(198,63,35,0)}100%{box-shadow:0 0 0 0 rgba(198,63,35,0)}}
  .hero h1{font-size:clamp(2.5rem,5.4vw,4.1rem);margin:0 0 22px}
  .hero h1 em{font-style:italic;color:var(--teal)}
  .lede{font-size:1.18rem;color:var(--ink-soft);max-width:36ch;margin-bottom:30px}
  .herocta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
  .price-tag{font-size:.86rem;color:var(--ink-soft);margin-top:18px}
  .price-tag b{color:var(--ink);font-weight:700}

  .scan{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:var(--shadow-md)}
  .scan-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
  .scan-dot{width:10px;height:10px;border-radius:50%;background:var(--rust);box-shadow:18px 0 0 var(--amber),36px 0 0 var(--teal-bright)}
  .scan-label{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
  .scan h3{font-size:1.1rem;margin:6px 0 14px}
  .scanrow{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px dashed var(--line)}
  .scanrow:last-of-type{border-bottom:none}
  .badge{width:26px;height:26px;border-radius:8px;flex:none;display:grid;place-items:center;font-weight:800;font-size:.9rem;color:#fff}
  .ok{background:var(--teal)}
  .warn{background:var(--rust)}
  .scanrow span{font-size:.92rem;font-weight:500}
  .scanrow small{margin-left:auto;font-size:.68rem;color:var(--ink-soft);font-weight:700;letter-spacing:.06em}
  .scanbar{margin-top:18px;height:9px;border-radius:6px;background:var(--bone);overflow:hidden}
  .scanbar i{display:block;height:100%;width:97%;background:linear-gradient(90deg,var(--teal),var(--teal-bright));border-radius:6px;animation:fill 1.7s ease-out}
  @keyframes fill{from{width:0}}

  .strip{background:var(--ink);color:var(--bone)}
  .stripin{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 36px;font-size:.86rem;font-weight:500;align-items:center;padding:18px 28px}
  .stripin b{color:var(--amber);font-family:'Fraunces',serif;font-weight:600}

  section{padding:88px 0}
  .sec-head{max-width:680px;margin-bottom:50px}
  .sec-head h2{font-size:clamp(2rem,4.2vw,3rem);margin:14px 0 16px}
  .sec-head p{font-size:1.08rem;color:var(--ink-soft)}
  .center{margin-left:auto;margin-right:auto;text-align:center}

  .stats{background:var(--teal-deep);color:var(--bone);position:relative;overflow:hidden}
  .stats .blob-3{width:600px;height:600px;background:radial-gradient(circle,rgba(19,162,147,.35),transparent 70%);top:-200px;left:-150px;filter:blur(80px)}
  .stats .eyebrow{color:var(--amber)}
  .stats h2{color:#fff}
  .stats .sec-head p{color:#a9cfc9}
  .statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative;z-index:2}
  .stat{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:28px 22px;transition:transform .2s,background .2s}
  .stat:hover{transform:translateY(-5px);background:rgba(255,255,255,.09)}
  .stat .num{font-family:'Fraunces',serif;font-size:2.7rem;font-weight:700;color:var(--amber);line-height:1}
  .stat .num.teal{color:#6cc5f0}
  .stat p{font-size:.9rem;color:#cfe0dd;margin-top:10px;line-height:1.4}
  .stat cite{display:block;font-style:normal;font-size:.68rem;color:#6f8c87;margin-top:10px;letter-spacing:.03em}
  @media(max-width:880px){.statgrid{grid-template-columns:repeat(2,1fr)}}

  .case{background:linear-gradient(120deg,var(--bone),#fff);border:1px solid var(--line);border-left:5px solid var(--amber);border-radius:0 18px 18px 0;padding:36px 40px;display:flex;gap:32px;align-items:center;flex-wrap:wrap;box-shadow:var(--shadow-sm)}
  .case .big{font-family:'Fraunces',serif;font-size:3.6rem;font-weight:700;color:var(--rust);line-height:1;flex:none}
  .case p{font-size:1.05rem;color:var(--ink-soft);max-width:60ch}
  .case p b{color:var(--ink)}

  .mind{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
  .mcard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s}
  .mcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
  .mtag{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--rust);margin-bottom:13px;display:block}
  .mcard .quote{font-family:'Fraunces',serif;font-style:italic;font-size:1.22rem;color:var(--ink);line-height:1.3;margin-bottom:14px}
  .mcard .quote::before{content:"\201C";color:var(--amber);font-size:1.3em;line-height:0;vertical-align:-.3em;margin-right:2px}
  .mcard .resp{font-size:.95rem;color:var(--ink-soft)}
  .mcard .resp b{color:var(--teal);font-weight:700}

  .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  .pillar{background:#fff;border:1px solid var(--line);border-radius:20px;padding:32px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
  .pillar:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
  .pillar::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--teal)}
  .pillar:nth-child(2)::before{background:var(--amber)}
  .pillar:nth-child(3)::before{background:var(--teal-bright)}
  .picon{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin-bottom:20px;background:var(--bone)}
  .pillar .sub{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-bright);margin-bottom:6px}
  .pillar h3{font-size:1.42rem;margin-bottom:12px}
  .pillar>p{font-size:.95rem;color:var(--ink-soft);margin-bottom:18px}
  .pillar ul{list-style:none;display:flex;flex-direction:column;gap:10px}
  .pillar li{font-size:.9rem;display:flex;gap:9px;align-items:flex-start;color:var(--ink)}
  .pillar li svg{flex:none;margin-top:3px}
  .pnum{position:absolute;top:22px;right:24px;font-family:'Fraunces',serif;font-size:2.4rem;color:var(--bone);font-weight:700}

  .offer{background:var(--ink);color:var(--bone);position:relative;overflow:hidden}
  .offer .blob-4{width:500px;height:500px;background:radial-gradient(circle,rgba(240,161,58,.3),transparent 70%);bottom:-200px;right:-120px;filter:blur(80px)}
  .offerwrap{position:relative;z-index:2;display:grid;grid-template-columns:1fr .85fr;gap:50px;align-items:center}
  .offer .eyebrow{color:var(--amber)}
  .offer h2{color:#fff;font-size:clamp(2rem,4vw,2.9rem);margin:14px 0 18px}
  .offer .sub{font-size:1.08rem;color:#bcc9c6;margin-bottom:26px;max-width:44ch}
  .assurances{display:flex;flex-direction:column;gap:14px;margin-bottom:30px}
  .srow{display:flex;gap:13px;align-items:flex-start;font-size:1rem;color:#e6eeec}
  .srow svg{flex:none;margin-top:2px}
  .srow b{color:#fff}

  .pcard{background:#fff;color:var(--ink);border-radius:22px;padding:36px;box-shadow:var(--shadow-md);position:relative;overflow:hidden}
  .pcard .ribbon{position:absolute;top:20px;right:-44px;background:var(--rust);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.12em;padding:6px 50px;transform:rotate(45deg)}
  .pcard .plabel{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-bright)}
  .pcard .amt{font-family:'Fraunces',serif;font-size:4rem;font-weight:700;color:var(--ink);line-height:1;margin:6px 0 2px}
  .pcard .amt span{font-size:1.1rem;color:var(--ink-soft);font-family:'Archivo';font-weight:600}
.setup-waive{display:flex;align-items:center;gap:10px;margin-bottom:10px}
  .sw-strike{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:600;color:var(--ink-soft);text-decoration:line-through;text-decoration-color:var(--rust);text-decoration-thickness:2px}
  .sw-free{font-size:.72rem;font-weight:800;letter-spacing:.08em;color:#fff;background:var(--teal);border-radius:6px;padding:3px 9px}
  .pcard .nofee{display:inline-block;background:#e8f2fd;color:var(--teal);font-weight:700;font-size:.8rem;padding:5px 12px;border-radius:20px;margin-bottom:20px}
  .pcard ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:26px}
  .pcard li{font-size:.93rem;display:flex;gap:10px;align-items:flex-start}
  .pcard li svg{flex:none;margin-top:3px}
  .pcard .btn{width:100%;justify-content:center;font-size:1rem;padding:15px}
  .seats{margin-top:14px;text-align:center;font-size:.78rem;color:var(--ink-soft)}
  .seatbar{height:9px;border-radius:6px;background:var(--bone);overflow:hidden;margin-top:8px}
  .seatbar i{display:block;height:100%;width:85%;background:linear-gradient(90deg,var(--amber),var(--rust));border-radius:6px}
  @media(max-width:880px){.offerwrap{grid-template-columns:1fr;gap:36px}}

  .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
  .steps.proc{grid-template-columns:repeat(3,1fr)}
  @media(max-width:760px){.steps.proc{grid-template-columns:1fr}}
  .step{position:relative;padding-top:16px}
  .step::before{counter-increment:s;content:"0" counter(s);font-family:'Fraunces',serif;font-size:1.05rem;font-weight:700;color:var(--teal);background:#fff;border:1px solid var(--line);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;margin-bottom:16px}
  .step h3{font-size:1.12rem;margin-bottom:8px}
  .step p{font-size:.9rem;color:var(--ink-soft)}

  .faq{max-width:760px;margin:0 auto}
  details{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden;transition:box-shadow .2s}
  details[open]{box-shadow:var(--shadow-sm)}
  summary{cursor:pointer;padding:20px 24px;font-family:'Fraunces',serif;font-size:1.12rem;font-weight:600;color:var(--ink);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
  summary::-webkit-details-marker{display:none}
  summary::after{content:"+";font-family:'Archivo';font-weight:700;font-size:1.4rem;color:var(--teal);transition:transform .2s;flex:none}
  details[open] summary::after{transform:rotate(45deg)}
  details p{padding:0 24px 22px;font-size:.96rem;color:var(--ink-soft)}

  .final{background:linear-gradient(135deg,var(--teal),var(--teal-deep));color:#fff;border-radius:26px;padding:62px;text-align:center;position:relative;overflow:hidden}
  .final::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 22%,rgba(255,255,255,.1),transparent 45%),radial-gradient(circle at 85% 78%,rgba(240,161,58,.22),transparent 45%)}
  .final>*{position:relative;z-index:2}
  .final h2{color:#fff;font-size:clamp(2rem,4vw,2.9rem);margin-bottom:16px}
  .final p{font-size:1.12rem;color:#d6ece8;max-width:50ch;margin:0 auto 30px}
  .final .btn-amber{font-size:1.05rem;padding:17px 38px}
  .finbullets{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;margin-top:26px;font-size:.85rem;color:#cfe6e1}
  .finbullets span{display:flex;gap:7px;align-items:center}

  footer{padding:26px 0 20px;text-align:center;background:var(--bone)}
  footer .logo{justify-content:center;margin-bottom:8px}
  .disc{font-size:.74rem;color:var(--ink-soft);max-width:74ch;margin:22px auto 0;line-height:1.65;opacity:.9;text-align:left}

  @media(max-width:880px){
    .hero,.offerwrap{grid-template-columns:1fr}
    .hero{gap:40px}
    .mind,.pillars{grid-template-columns:1fr}
    .steps{grid-template-columns:repeat(2,1fr)}
    .final{padding:42px 24px}
    .iris{display:none}
  }
  @media(max-width:560px){.steps{grid-template-columns:1fr}}


  /* ===== WIDGET MYTH + COVERAGE + COST (added) ===== */
  .myth{background:#fff;border:1px solid var(--line);border-radius:20px;padding:0;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;box-shadow:var(--shadow-sm)}
  .myth-col{padding:34px 36px}
  .myth-col.bad{background:linear-gradient(180deg,#fdf1ee,#fff);border-right:1px solid var(--line)}
  .myth-tag{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px}
  .myth-tag.bad{color:var(--rust)}
  .myth-tag.good{color:var(--teal)}
  .myth-col h3{font-size:1.4rem;margin-bottom:12px}
  .myth-col p{font-size:.96rem;color:var(--ink-soft);margin-bottom:14px}
  .widget-demo{display:inline-flex;align-items:center;gap:9px;background:#1b3a8a;color:#fff;border-radius:30px;padding:9px 15px;font-size:.82rem;font-weight:600;box-shadow:var(--shadow-sm)}
  .widget-demo .ico{width:22px;height:22px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none}
  .strike{position:relative;display:inline-block;margin-top:10px}
  .strike::after{content:"";position:absolute;left:-6px;right:-6px;top:50%;height:2.5px;background:var(--rust);transform:rotate(-7deg)}
  @media(max-width:760px){.myth{grid-template-columns:1fr}.myth-col.bad{border-right:none;border-bottom:1px solid var(--line)}}

  .coverage{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center}
  .meter-wrap{display:flex;justify-content:center}
  .meter{position:relative;width:230px;height:230px}
  .meter svg{transform:rotate(-90deg)}
  .meter .label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
  .meter .num{font-family:'Fraunces',serif;font-size:3.4rem;font-weight:700;color:var(--teal);line-height:1}
  .meter .num small{font-size:1.2rem;color:var(--ink-soft)}
  .meter .cap{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-top:4px}
  .cov-list{list-style:none;display:flex;flex-direction:column;gap:12px}
  .cov-list li{display:flex;gap:12px;align-items:flex-start;font-size:.96rem}
  .cov-list li svg{flex:none;margin-top:3px}
  .cov-list b{font-weight:700}

  @media(max-width:760px){.coverage{grid-template-columns:1fr;gap:28px}}


  /* ===== BOOKING CALENDAR (added) ===== */
  .book{background:linear-gradient(160deg,#fff,var(--bone))}
  .bookgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:start}
  .calcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--shadow-md)}
  .calhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
  .calhead h3{font-size:1.25rem}
  .seatcount{font-size:.82rem;font-weight:700;color:var(--teal)}
  .seatcount b{font-family:'Fraunces',serif;font-size:1.15rem}
  .seatcount.low{color:var(--rust)}
  .calsub{font-size:.84rem;color:var(--ink-soft);margin-bottom:18px}
  .dow{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px}
  .dow span{text-align:center;font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);padding:4px 0}
  .cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
  .day{aspect-ratio:1;border:1px solid var(--line);border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.92rem;font-weight:600;cursor:pointer;background:#fff;transition:transform .12s,border-color .15s,background .15s;position:relative}
  .day .dot{width:5px;height:5px;border-radius:50%;background:var(--teal);margin-top:3px}
  .day.empty{border:none;cursor:default;background:transparent}
  .day.past{color:#c9c4b6;background:var(--bone);cursor:not-allowed;border-color:transparent}
  .day.taken{color:#a2ada7;background:repeating-linear-gradient(135deg,#ebeeeb,#ebeeeb 5px,#dde3e0 5px,#dde3e0 10px);cursor:not-allowed}
  .day.taken .dot{background:#c63f23;opacity:.4}
  .day.open:hover{border-color:var(--teal);transform:translateY(-2px);background:#eff6fd}
  .day.sel{background:var(--navy);color:#fff;border-color:var(--teal)}
  .day.sel .dot{background:#fff}

  .day .slotleft{position:absolute;bottom:5px;font-size:.56rem;font-weight:700;letter-spacing:.02em;color:var(--teal);text-transform:uppercase}
  .day.lastone{border-color:var(--amber)}
  .day.lastone .slotleft{color:var(--amber-deep)}
  .day.sel .slotleft{color:#fff}

  .callegend{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;font-size:.76rem;color:var(--ink-soft)}
  .callegend span{display:flex;align-items:center;gap:6px}
  .lg{width:13px;height:13px;border-radius:4px;flex:none}
  .lg.open{background:#fff;border:1px solid var(--teal)}
  .lg.taken{background:repeating-linear-gradient(135deg,#ebeeeb,#ebeeeb 4px,#dde3e0 4px,#dde3e0 8px);border:1px solid var(--line)}
  .lg.sel{background:var(--teal)}


  .cal-nav{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--navy);font-size:1.1rem;line-height:1;cursor:pointer;transition:background .15s,border-color .15s}
  .cal-nav:hover:not(:disabled){background:var(--bone);border-color:var(--navy)}
  .cal-nav:disabled{opacity:.35;cursor:not-allowed}
  .timeline-note{margin-top:16px;display:flex;gap:9px;align-items:flex-start;font-size:.82rem;color:var(--ink-soft);background:#eef6f9;border:1px solid #d3e7ef;border-radius:11px;padding:11px 13px}
  .timeline-note svg{flex:none;margin-top:1px}
  .timeline-note b{color:var(--navy)}

  .bookform{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--shadow-sm)}
  .bookform h3{font-size:1.25rem;margin-bottom:4px}
  .bf-sub{font-size:.86rem;color:var(--ink-soft);margin-bottom:20px}
  .picked{background:#eff6fd;border:1px solid #bfe6df;border-radius:12px;padding:13px 16px;font-size:.9rem;color:var(--teal-deep);margin-bottom:18px;display:flex;align-items:center;gap:10px}
  .picked.none{background:var(--bone);border-color:var(--line);color:var(--ink-soft)}
  .picked b{color:var(--teal);font-weight:700}
  .field{margin-bottom:14px}
  .field label{display:block;font-size:.78rem;font-weight:700;color:var(--ink);margin-bottom:5px;letter-spacing:.02em}
  .field input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:.94rem;color:var(--ink);background:#fff;transition:border-color .15s}
  .field input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(11,110,99,.12)}
.bf-consent{display:flex;gap:9px;align-items:flex-start;font-size:.78rem;color:var(--ink-soft);line-height:1.45;margin:4px 0 14px;cursor:pointer}
  .bf-consent input{margin-top:2px;flex:none;width:15px;height:15px;accent-color:var(--navy);cursor:pointer}
  .bf-consent a{color:var(--teal);font-weight:600;text-decoration:underline}
  .bookform .btn{width:100%;justify-content:center;font-size:1rem;padding:15px;margin-top:6px}
  .bookform .btn:disabled{background:var(--line);color:var(--ink-soft);cursor:not-allowed;transform:none;box-shadow:none}
  .formnote{font-size:.74rem;color:var(--ink-soft);text-align:center;margin-top:12px}
  .success{text-align:center;padding:18px 6px}
  .success .ck{width:62px;height:62px;border-radius:50%;background:#e8f2fd;display:grid;place-items:center;margin:0 auto 16px}
  .success h3{font-size:1.5rem;margin-bottom:10px}
  .success p{font-size:.96rem;color:var(--ink-soft);max-width:34ch;margin:0 auto}
  @media(max-width:880px){.bookgrid{grid-template-columns:1fr;gap:28px}}
  /* --- meeting scheduler: time slots --- */
  .cal-badge{font-size:.78rem;font-weight:700;letter-spacing:.04em;color:var(--teal);background:#eff6fd;border:1px solid #d3e7ef;border-radius:30px;padding:5px 13px}
  .slotwrap{margin-top:20px;border-top:1px solid var(--line);padding-top:18px}
  .slotwrap[hidden]{display:none}
  .slotwrap h3{font-size:1.02rem;margin-bottom:3px}
  .slot-sub{font-size:.79rem;color:var(--ink-soft);margin-bottom:13px}
  .slot-sub b{color:var(--ink)}
  .slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(102px,1fr));gap:8px;max-height:262px;overflow-y:auto;padding:2px 4px 2px 2px}
  .slot{min-height:46px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 6px;font-family:inherit;font-size:.86rem;font-weight:600;color:var(--ink);cursor:pointer;text-align:center;line-height:1.2;transition:transform .12s,border-color .15s,background .15s}
  .slot small{display:block;font-size:.62rem;font-weight:600;color:var(--ink-soft);margin-top:3px}
  .slot:hover:not([disabled]){border-color:var(--teal);background:#eff6fd;transform:translateY(-2px)}
  .slot:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px}
  .slot.sel,.slot.sel:hover{background:var(--navy);color:#fff;border-color:var(--teal);transform:none}
  .slot.sel small,.slot.sel:hover small{color:#c9def5}
  .slot[disabled]{background:var(--bone);color:#a2ada7;cursor:not-allowed;border-color:transparent}
  .slot-empty{grid-column:1/-1;font-size:.84rem;color:var(--ink-soft);padding:6px 0}
  .lbl-note{font-weight:500;color:var(--ink-soft);letter-spacing:0}
  .bf-err{margin-top:12px;font-size:.82rem;color:#8a2c16;background:#fdefeb;border:1px solid #f2cec3;border-radius:10px;padding:10px 12px}
  .bf-err[hidden]{display:none}
  .bf-err a{color:#8a2c16;font-weight:700}
  .btn-ics{margin-top:18px}
  .btn-ics[hidden]{display:none}
  .success .btn-ics{width:auto;justify-content:center}
  @media(max-width:560px){.slots{grid-template-columns:repeat(auto-fill,minmax(94px,1fr));max-height:none}}

  /* ===== HOTSPOT MAP (added) ===== */
  .mapwrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
  .usmap{width:100%;height:auto}
  .usmap path{fill:#eceeec;stroke:#fff;stroke-width:1.4;transition:fill .2s}
  .usmap path.hot1{fill:#c63f23}
  .usmap path.hot2{fill:#e0773f}
  .usmap path.hot3{fill:#e88a5a}
  .usmap path:hover{fill:var(--teal-bright)}
  .maplegend{display:flex;flex-direction:column;gap:12px;margin-top:18px}
  .maplegend .row{display:flex;align-items:center;gap:11px;font-size:.94rem}
  .maplegend .sw{width:18px;height:18px;border-radius:5px;flex:none}
  .maplegend b{font-weight:700}
  @media(max-width:760px){.mapwrap{grid-template-columns:1fr;gap:26px}}


  /* ===== LUNOVUS PULSE (added) ===== */
  .pulse{background:var(--navy);color:#eaf0f6;position:relative;overflow:hidden}
  .pulse .blob-5{width:560px;height:560px;background:radial-gradient(circle,rgba(31,143,176,.35),transparent 70%);top:-180px;right:-160px;filter:blur(80px)}
  .pulse .eyebrow{color:var(--teal-bright)}
  .pulse h2{color:#fff}
  .pulse .sec-head p{color:#aebfd0}
  .pulse-top{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center;position:relative;z-index:2}
  .pulse-badge{display:inline-flex;align-items:center;gap:9px;background:rgba(31,143,176,.18);border:1px solid rgba(31,143,176,.4);border-radius:30px;padding:7px 15px;font-size:.76rem;font-weight:700;letter-spacing:.06em;color:#7cc7ef;margin-bottom:18px}
  .pulse-feat{list-style:none;display:flex;flex-direction:column;gap:13px;margin-top:8px}
  .pulse-feat li{display:flex;gap:12px;align-items:flex-start;font-size:1rem;color:#dce6f0}
  .pulse-feat li svg{flex:none;margin-top:3px}
  .pulse-feat b{color:#fff;font-weight:700}

  .ideas{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .idea{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:13px;padding:16px 15px;transition:transform .18s,background .18s,border-color .18s;cursor:default}
  .idea:hover{transform:translateY(-4px);background:rgba(31,143,176,.16);border-color:rgba(31,143,176,.5)}
  .idea .ico{font-size:1.25rem;margin-bottom:8px;display:block}
  .idea h4{font-family:'Fraunces',serif;font-size:.98rem;font-weight:600;color:#fff;margin-bottom:4px;line-height:1.15}
  .idea p{font-size:.78rem;color:#9fb3c7;line-height:1.35}
  @media(max-width:760px){.pulse-top{grid-template-columns:1fr;gap:30px}.ideas{grid-template-columns:repeat(2,1fr)}}

  .social-strip{margin-top:42px;position:relative;z-index:2;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:28px 32px;display:flex;gap:26px;align-items:center;flex-wrap:wrap}
  .social-strip .si{width:58px;height:58px;border-radius:15px;background:linear-gradient(135deg,var(--teal-bright),#0d51a0);display:grid;place-items:center;flex:none}
  .social-strip h3{font-size:1.3rem;color:#fff;margin-bottom:6px}
  .social-strip p{font-size:.95rem;color:#bccfe0;max-width:60ch}
  .social-strip .opts{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
  .social-strip .opt{font-size:.78rem;font-weight:600;color:#cfe0ee;background:rgba(31,143,176,.18);border:1px solid rgba(31,143,176,.4);border-radius:20px;padding:6px 13px}


  /* ===== NEW RULES SECTION (added) ===== */
  .rules{background:#fff}
  .rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:8px}
  .rcard{border:1px solid var(--line);border-radius:18px;padding:30px;background:linear-gradient(180deg,#fff,var(--bone));box-shadow:var(--shadow-sm)}
  .rcard .rk{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-bright);margin-bottom:14px;display:block}
  .rcard h3{font-size:1.5rem;margin-bottom:10px}
  .rcard p{font-size:.96rem;color:var(--ink-soft);margin-bottom:18px}
  .gauge{display:flex;align-items:center;gap:20px}
  .gauge svg{flex:none}
  .gauge .gtext .gp{font-family:'Fraunces',serif;font-size:2.1rem;font-weight:700;line-height:1}
  .gauge .gtext .gl{font-size:.82rem;color:var(--ink-soft);margin-top:2px}
  .gnum-red{color:var(--rust)}
  .gnum-amber{color:var(--amber-deep)}
  @media(max-width:760px){.rules-grid{grid-template-columns:1fr}}
  .myth-banner{margin-top:26px;background:var(--navy);color:#eaf0f6;border-radius:16px;padding:24px 28px;display:flex;gap:16px;align-items:flex-start}
  .myth-banner svg{flex:none;margin-top:2px}
  .myth-banner b{color:#fff}


  /* sticky mobile CTA */
  .mobile-cta{display:none}
  @media(max-width:780px){
    .mobile-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:11px 16px;gap:12px;align-items:center;justify-content:space-between;box-shadow:0 -6px 24px rgba(10,30,53,.10)}
    .mobile-cta .mc-price{font-size:.82rem;font-weight:700;color:var(--navy);line-height:1.1}
    .mobile-cta .mc-price small{display:block;font-weight:500;color:var(--ink-soft);font-size:.7rem}
    .mobile-cta .btn{padding:12px 20px;font-size:.9rem}
    footer{padding-bottom:96px}
    #book{padding-bottom:90px}
  }


  /* ===== FOUNDING MEMBER + FORMULA (added) ===== */
  .founding{background:linear-gradient(160deg,var(--bone),#fff)}
  .fm-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
  .fm-badge{display:inline-flex;align-items:center;gap:9px;background:var(--navy);color:#fff;border-radius:30px;padding:8px 16px;font-size:.74rem;font-weight:700;letter-spacing:.08em;margin-bottom:18px}
  .fm-list{list-style:none;display:flex;flex-direction:column;gap:16px;margin-top:6px}
  .fm-list li{display:flex;gap:14px;align-items:flex-start}
  .fm-list .ic{width:40px;height:40px;border-radius:11px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;flex:none}
  .fm-list h4{font-family:'Fraunces',serif;font-size:1.08rem;font-weight:600;margin-bottom:3px}
  .fm-list p{font-size:.9rem;color:var(--ink-soft);margin:0}
  .fm-proof{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:var(--shadow-md)}
  .fm-proof .pl{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-bright);margin-bottom:16px;display:block}
  .fm-proof .badges{display:flex;flex-direction:column;gap:12px}
  .fm-proof .pb{display:flex;gap:12px;align-items:center;padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:var(--bone)}
  .fm-proof .pb svg{flex:none}
  .fm-proof .pb span{font-size:.9rem;font-weight:600;color:var(--ink)}
  .fm-proof .pb small{display:block;font-weight:500;color:var(--ink-soft);font-size:.78rem;margin-top:1px}
  @media(max-width:780px){.fm-grid{grid-template-columns:1fr;gap:30px}}

  .formula{background:#fff}
  .fx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:8px}
  .fx{border:1px solid var(--line);border-radius:18px;padding:28px;text-align:center;background:linear-gradient(180deg,#fff,var(--bone))}
  .fx .fxi{width:56px;height:56px;border-radius:14px;background:var(--navy);display:grid;place-items:center;margin:0 auto 16px}
  .fx h3{font-size:1.18rem;margin-bottom:8px}
  .fx p{font-size:.9rem;color:var(--ink-soft)}
  .fx-vs{margin-top:30px;background:var(--navy);color:#eaf0f6;border-radius:18px;padding:30px 34px;display:grid;grid-template-columns:1fr auto 1fr;gap:26px;align-items:center}
  .fx-vs .side h4{font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px}
  .fx-vs .side.old h4{color:#e08a72}
  .fx-vs .side.new h4{color:#7cc7ef}
  .fx-vs .side p{font-size:.92rem;color:#c4d2e0;margin:0;line-height:1.5}
  .fx-vs .vs{font-family:'Fraunces',serif;font-style:italic;font-size:1.3rem;color:#8aa0b6}
  @media(max-width:780px){.fx-grid{grid-template-columns:1fr}.fx-vs{grid-template-columns:1fr;gap:16px;text-align:center}}


  /* ===== COST OF WAITING (added) ===== */
  .waiting{background:linear-gradient(135deg,#c63f23,#9c3219);color:#fff}
  .waitwrap{display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center}
  .waitwrap .wico{width:64px;height:64px;border-radius:16px;background:rgba(255,255,255,.14);display:grid;place-items:center;flex:none}
  .waitwrap h2{color:#fff;font-size:clamp(1.5rem,3vw,2rem);margin-bottom:8px}
  .waitwrap p{color:#d5e7dd;font-size:1rem;margin:0;max-width:62ch}
  .waitwrap .btn{white-space:nowrap}
  .waitstats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.2);border-radius:14px;overflow:hidden;margin-top:26px}
  .waitstats div{background:#bb3a20;padding:18px 16px;text-align:center}
  .waitstats .wn{font-family:'Fraunces',serif;font-size:1.7rem;font-weight:700;color:#fff}
  .waitstats .wl{font-size:.8rem;color:#b8d4c3;margin-top:4px}
  @media(max-width:780px){.waitwrap{grid-template-columns:1fr;text-align:center;gap:18px}.waitwrap .wico{margin:0 auto}.waitstats{grid-template-columns:1fr}}

  /* hero audit hook */
  .audit-hook{margin-top:16px;display:inline-flex;align-items:center;gap:10px;font-size:.86rem;color:var(--ink-soft)}
  .audit-hook a{color:var(--teal);font-weight:700;text-decoration:none;border-bottom:1.5px solid var(--teal-bright)}
  .audit-hook a:hover{color:var(--navy)}


  /* ===== 3-STEP FLOW (added) ===== */
  .flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:14px;align-items:stretch}
  .flow-step{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px 26px;box-shadow:var(--shadow-sm);position:relative;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
  .flow-step:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
  .fs-num{width:46px;height:46px;border-radius:50%;background:var(--navy);color:#fff;font-family:'Fraunces',serif;font-size:1.4rem;font-weight:700;display:grid;place-items:center;margin-bottom:16px}
  .flow-step:nth-child(3) .fs-num{background:var(--teal)}
  .flow-step:nth-child(5) .fs-num{background:var(--teal-bright)}
  .fs-body h3{font-size:1.55rem;margin-bottom:8px}
  .fs-lead{font-size:.96rem;color:var(--ink-soft);margin-bottom:16px}
  .fs-donefor{margin-top:auto;background:#f3f7fb;border:1px solid #dde8f0;border-radius:13px;padding:15px 16px}
  .fs-donefor.light{background:#eefaf4;border-color:#cdeede}
  .fs-donefor .dfl{font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);display:block;margin-bottom:10px}
  .fs-donefor ul{list-style:none;display:flex;flex-direction:column;gap:8px}
  .fs-donefor li{display:flex;gap:9px;align-items:flex-start;font-size:.86rem;color:var(--ink)}
  .fs-donefor li svg{flex:none;margin-top:3px}
  .flow-arrow{display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:var(--line);font-weight:700}
  .flow-foot{margin-top:34px;display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap}
  .ff-time{display:inline-flex;align-items:center;gap:9px;font-size:.95rem;color:var(--ink-soft)}
  .ff-time b{color:var(--navy)}
  @media(max-width:880px){
    .flow{grid-template-columns:1fr;gap:12px}
    .flow-arrow{transform:rotate(90deg);padding:2px 0}
  }


  /* ===== INSTANT AUDIT (added) ===== */
  .audit-box{margin-top:22px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow-sm);max-width:460px}
  .audit-box .abl{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-bright);margin-bottom:10px;display:flex;align-items:center;gap:7px}
  .audit-input{display:flex;gap:8px}
  .audit-input input{flex:1;padding:13px 14px;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:.94rem;color:var(--ink);min-width:0}
  .audit-input input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(11,110,99,.12)}
  .audit-input button{white-space:nowrap;border:none;cursor:pointer}
  .audit-mini{font-size:.74rem;color:var(--ink-soft);margin-top:9px}
  .audit-status{display:none;margin-top:12px;font-size:.86rem;color:var(--navy);align-items:center;gap:9px}
  .audit-status.show{display:flex}
  .spinner{width:16px;height:16px;border:2.5px solid var(--line);border-top-color:var(--teal);border-radius:50%;animation:spin 0.8s linear infinite;flex:none}

  /* results section */
  .results{background:linear-gradient(160deg,#fff,var(--bone));display:none}
  .results.show{display:block}
  .res-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px;box-shadow:var(--shadow-md);max-width:880px;margin:0 auto}
  .res-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:24px}
  .res-head .rh-url{font-family:'Fraunces',serif;font-size:1.3rem;font-weight:600;color:var(--ink);word-break:break-all}
  .res-head .rh-sub{font-size:.86rem;color:var(--ink-soft);margin-top:4px}
  .res-overall{text-align:center;flex:none}
  .res-overall .ro-num{font-family:'Fraunces',serif;font-size:2.6rem;font-weight:700;line-height:1}
  .res-overall .ro-lab{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
  .score-bad{color:var(--rust)} .score-mid{color:var(--amber-deep)} .score-good{color:var(--teal)}
  .res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .res-pillar{border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--bone)}
  .res-pillar .rp-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
  .res-pillar .rp-name{font-weight:700;font-size:.95rem}
  .res-pillar .rp-score{font-family:'Fraunces',serif;font-weight:700;font-size:1.3rem}
  .res-bar{height:7px;border-radius:5px;background:#dde3e0;overflow:hidden;margin-bottom:14px}
  .res-bar i{display:block;height:100%;border-radius:5px;transition:width 1s ease-out}
  .res-pillar ul{list-style:none;display:flex;flex-direction:column;gap:7px}
  .res-pillar li{font-size:.82rem;color:var(--ink-soft);display:flex;gap:7px;align-items:flex-start}
  .res-pillar li svg{flex:none;margin-top:2px}
  .res-cta{text-align:center;margin-top:26px}
  .res-cta p{font-size:.95rem;color:var(--ink-soft);margin-bottom:16px}
  .res-disc{font-size:.72rem;color:var(--ink-soft);text-align:center;margin-top:18px;opacity:.8}
  @media(max-width:760px){.res-grid{grid-template-columns:1fr}}


  /* ===== BEFORE / AFTER SHOWCASE (added) ===== */
  .showcase{background:linear-gradient(180deg,#fff,var(--bone))}
  .ba-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:22px;align-items:center}
  .ba-col{display:flex;flex-direction:column}
  .ba-tag{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
  .ba-tag.before{color:var(--rust)}
  .ba-tag.after{color:var(--teal)}
  .browser{border:1px solid var(--line);border-radius:13px;overflow:hidden;box-shadow:var(--shadow-md);background:#fff}
  .browser-bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#eceeec;border-bottom:1px solid var(--line)}
  .browser-bar i{width:9px;height:9px;border-radius:50%;background:#cfcabb;display:block}
  .browser-bar .url{margin-left:10px;font-size:.66rem;color:#8a8675;background:#fff;border-radius:5px;padding:3px 9px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .screen{height:300px;overflow:hidden;position:relative}

  /* BEFORE mock — dated, cramped */
  .old-site{background:#e9e7df;padding:14px;height:100%;font-family:Georgia,serif}
  .old-hd{background:#5a6e8c;color:#fff;padding:10px;text-align:center;font-size:.8rem;font-weight:bold;letter-spacing:.02em}
  .old-nav{background:#7d8ba0;display:flex;gap:1px;font-size:.56rem}
  .old-nav span{background:#9aa6b8;color:#fff;padding:4px 6px;flex:1;text-align:center}
  .old-body{background:#fff;border:1px solid #cfc;padding:10px;margin-top:8px}
  .old-body .h{font-size:.78rem;color:#5a6e8c;font-weight:bold;margin-bottom:6px}
  .old-img{height:54px;background:repeating-linear-gradient(45deg,#d8d4c8,#d8d4c8 8px,#cfcabb 8px,#cfcabb 16px);display:grid;place-items:center;color:#8a8675;font-size:.6rem;margin-bottom:7px}
  .old-txt{height:6px;background:#ddd;border-radius:2px;margin-bottom:5px}
  .old-txt.s{width:60%}
  .old-flags{position:absolute;bottom:8px;left:8px;right:8px;display:flex;flex-direction:column;gap:3px}
  .old-flag{background:rgba(198,63,35,.94);color:#fff;font-size:.56rem;font-family:'Archivo',sans-serif;font-weight:600;padding:3px 7px;border-radius:4px;display:flex;align-items:center;gap:5px}

  /* AFTER mock — clean, modern OptiSite */
  .new-site{height:100%;background:#fff;font-family:'Archivo',sans-serif;display:flex;flex-direction:column}
  .new-hd{background:var(--navy);color:#fff;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
  .new-hd .lg{font-family:'Fraunces',serif;font-weight:600;font-size:.7rem;display:flex;align-items:center;gap:5px;white-space:nowrap}
  .new-hd .lg b{width:13px;height:13px;border-radius:50%;background:var(--teal-bright);display:inline-block}
  .new-hd .cta{background:var(--amber);color:#fff;font-size:.54rem;font-weight:700;padding:3px 8px;border-radius:20px}
  .new-hero{padding:14px 12px;background:linear-gradient(135deg,#f3f7fb,#eafaf4)}
  .new-hero .h{font-family:'Fraunces',serif;font-size:.92rem;color:var(--navy);font-weight:600;line-height:1.1;margin-bottom:5px}
  .new-hero .sub{font-size:.58rem;color:var(--ink-soft);margin-bottom:8px;line-height:1.3}
  .new-hero .b{display:inline-block;background:var(--teal);color:#fff;font-size:.56rem;font-weight:700;padding:5px 11px;border-radius:20px}
  .new-row{display:flex;gap:7px;padding:10px 12px}
  .new-card{flex:1;border:1px solid var(--line);border-radius:7px;padding:7px}
  .new-card .ci{width:16px;height:16px;border-radius:5px;background:var(--teal-bright);opacity:.18;margin-bottom:5px}
  .new-card .ct{height:4px;background:#dfe6ea;border-radius:2px;margin-bottom:3px}
  .new-card .ct.s{width:65%}
  .new-badges{margin-top:auto;display:flex;gap:5px;padding:9px 12px;border-top:1px solid var(--line)}
  .new-badge{font-size:.5rem;font-weight:700;color:var(--teal);background:#eafaf4;border:1px solid #cdeede;border-radius:4px;padding:2px 6px}

  .ba-arrow{display:grid;place-items:center}
  .ba-arrow div{width:46px;height:46px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:1.3rem}
  .ba-caption{font-size:.86rem;color:var(--ink-soft);margin-top:14px;line-height:1.5}
  .ba-caption b{color:var(--ink)}
  .ba-note{text-align:center;font-size:.74rem;color:var(--ink-soft);margin-top:18px;opacity:.85}
  @media(max-width:880px){
    .ba-grid{grid-template-columns:1fr;gap:16px}
    .ba-arrow div{transform:rotate(90deg)}
  }

  .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}

  /* --- REAL AUDIT EVIDENCE (v1.2) --- */
  .ev-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:8px 0 40px}
  .ev-num{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:22px 20px;box-shadow:var(--shadow-sm)}
  .ev-num b{display:block;font-family:'Fraunces',serif;font-size:2.5rem;line-height:1;letter-spacing:-.03em;color:var(--ink)}
  .ev-num b.red{color:var(--rust)}
  .ev-num span{display:block;margin-top:9px;font-size:.83rem;color:var(--ink-soft);line-height:1.4}
  .ev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .ev-col{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:26px 24px;box-shadow:var(--shadow-sm)}
  .ev-col h3{font-size:1.12rem;margin-bottom:4px}
  .ev-col .ev-pill{display:inline-block;font-size:.64rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-bright);margin-bottom:12px}
  .ev-col ul{list-style:none;margin-top:14px}
  .ev-col li{display:flex;gap:11px;padding:11px 0;border-top:1px solid var(--line);font-size:.9rem;color:var(--ink-soft);line-height:1.45}
  .ev-col li:first-child{border-top:none;padding-top:4px}
  .ev-col li b{color:var(--ink);font-weight:700}
  .ev-dot{flex:none;width:9px;height:9px;border-radius:50%;margin-top:6px;background:var(--amber)}
  .ev-dot.hi{background:var(--rust)}
  .ev-hipaa{margin-top:22px;background:var(--navy);color:#dbe6ef;border-radius:18px;padding:30px 32px}
  .ev-hipaa-tag{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#7cc7ef;margin-bottom:12px}
  .ev-hipaa p{font-size:.97rem;line-height:1.65;margin:0}
  .ev-hipaa b{color:#fff}
  .ev-note{margin-top:22px;border-left:3px solid var(--teal-bright);background:var(--white);border-radius:0 14px 14px 0;padding:22px 26px}
  .ev-note h4{font-family:'Fraunces',serif;font-size:1.05rem;font-weight:600;margin-bottom:8px}
  .ev-note p{font-size:.9rem;color:var(--ink-soft);line-height:1.6;margin:0}
  .ev-bridge{margin-top:26px;text-align:center;font-size:1.02rem;color:var(--ink)}
  .ev-bridge b{font-weight:700}
  .proofstrip{margin-top:26px;display:flex;gap:16px;align-items:flex-start;background:#fdf3ef;border:1px solid #f0d3c8;border-radius:16px;padding:22px 24px}
  .proofstrip svg{flex:none;margin-top:2px}
  .proofstrip p{margin:0;font-size:.94rem;line-height:1.6;color:var(--ink-soft)}
  .proofstrip b{color:var(--ink)}
  .vstamp{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#5f6b74;margin-top:18px}
  @media(max-width:900px){.ev-nums{grid-template-columns:repeat(2,1fr)}.ev-grid{grid-template-columns:1fr}}
  @media(max-width:520px){.ev-num b{font-size:2rem}}

  /* --- v1.3: REAL CASE STUDY / CHECKS GRID / STEPS / MONTHLY PLAN --- */
  .case-real{background:var(--navy);color:#dbe6ef}
  .case-real .sec-head h2{color:#fff}
  .case-real .sec-head p{color:#a8c0d4}
  .case-real .eyebrow{color:#7cc7ef}
  .cs-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}
  .cs-chip{font-size:.76rem;font-weight:600;letter-spacing:.02em;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#cfe0ee;padding:7px 14px;border-radius:30px}
  .cs-pair{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
  .cs-side{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:18px}
  .cs-tag{display:inline-flex;align-items:center;gap:7px;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px}
  .cs-tag.b{color:#e88a5a}
  .cs-tag.a{color:#6cc5f0}
  .cs-shot{display:block;width:100%;height:auto;border-radius:11px;border:1px solid rgba(255,255,255,.14);background:#fff}
  .cs-cap{margin-top:13px;font-size:.86rem;line-height:1.55;color:#a8c0d4}
  .cs-cap b{color:#fff}
  .cs-scores{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:26px}
  .cs-score{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:18px 16px;text-align:center}
  .cs-score b{display:block;font-family:'Fraunces',serif;font-size:1.75rem;line-height:1;color:#fff}
  .cs-score b em{font-style:normal;color:#6cc5f0}
  .cs-score span{display:block;margin-top:8px;font-size:.76rem;color:#a8c0d4;line-height:1.4}
  .cs-note{margin-top:22px;font-size:.8rem;color:#8ba4b8;line-height:1.6;max-width:80ch}

  .checks-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:8px}
  .chk{background:var(--white);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-sm);align-self:start}
  .chk > summary{display:block;list-style:none;cursor:pointer;padding:18px 34px 18px 17px;border-radius:14px;position:relative}
  .chk > summary::-webkit-details-marker{display:none}
  .chk > summary::after{content:"";position:absolute;top:20px;right:16px;width:9px;height:9px;border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(45deg);transition:transform .18s}
  .chk[open] > summary::after{transform:rotate(-135deg)}
  .chk > summary:hover{background:#f7fafd}
  .chk > summary:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px}
  .chk b{display:block;font-family:'Fraunces',serif;font-size:1.55rem;line-height:1;color:var(--teal)}
  .chk span{display:block;margin-top:9px;font-size:.85rem;font-weight:600;color:var(--ink);line-height:1.35;padding-right:22px}
  .chk small{display:block;margin-top:5px;font-size:.72rem;color:var(--ink-soft);padding-right:22px}
  .chk[open]{grid-column:1 / -1;background:var(--bone)}
  .chk-body{padding:2px 20px 20px}
  .chk-body .ck-list{list-style:none;margin:0;padding:12px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:4px 22px;border-top:1px solid var(--line)}
  .chk-body .ck-list li{font-size:.85rem;line-height:1.45;color:var(--ink-soft);padding:5px 0 5px 20px;position:relative;border-bottom:1px solid #f1efe9}
  .chk-body .ck-list li::before{content:"";position:absolute;left:2px;top:11px;width:7px;height:7px;border-radius:50%;background:#cfe0ef}
  .chk-body .ck-list .ck-sc{display:inline-block;font-family:'Archivo',sans-serif;font-weight:700;font-size:.72rem;color:var(--teal);min-width:4.2em}
  @media (prefers-reduced-motion: reduce){.chk > summary::after{transition:none}}
  @media(max-width:760px){.chk-body .ck-list{grid-template-columns:1fr}}
  .checks-total{display:flex;flex-wrap:wrap;gap:26px;align-items:baseline;justify-content:center;margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
  .checks-total div{text-align:center}
  .checks-total b{display:block;font-family:'Fraunces',serif;font-size:2.1rem;line-height:1;color:var(--ink)}
  .checks-total span{display:block;font-size:.79rem;color:var(--ink-soft);margin-top:6px}

  .steps7{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  .st{position:relative;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:20px 18px}
  .st.yours{background:#f2fbf9;border-color:#bfe3dc}
  .st .stn{font-family:'Archivo',sans-serif;font-size:.68rem;font-weight:700;letter-spacing:.16em;color:var(--ink-soft)}
  .st.yours .stn{color:var(--teal)}
  .st h3{font-size:1.02rem;margin:9px 0 7px;line-height:1.2}
  .st p{font-size:.85rem;color:var(--ink-soft);line-height:1.5}
  .st .whose{position:absolute;top:16px;right:16px;font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);background:#dbe9fa;padding:4px 9px;border-radius:20px}
  .keeps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
  .keep{background:var(--bone);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
  .keep b{display:block;font-size:.94rem;margin-bottom:5px}
  .keep span{font-size:.85rem;color:var(--ink-soft);line-height:1.5}

  .mplan{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .mcol{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:26px 24px;box-shadow:var(--shadow-sm)}
  .mcol h3{font-size:1.08rem;margin-bottom:14px}
  .mcol ul{list-style:none}
  .mcol li{padding:12px 0;border-top:1px solid var(--line);font-size:.87rem;color:var(--ink-soft);line-height:1.45}
  .mcol li:first-child{border-top:none;padding-top:2px}
  .mcol li b{display:block;color:var(--ink);font-size:.93rem;margin-bottom:2px}
  .was-price{display:block;font-size:.86rem;color:var(--ink-soft);margin-top:-4px;margin-bottom:8px}
  .was-price s{opacity:.7}

  @media(max-width:1000px){.checks-grid{grid-template-columns:repeat(2,1fr)}.steps7{grid-template-columns:repeat(2,1fr)}.mplan{grid-template-columns:1fr}.keeps{grid-template-columns:1fr}.cs-scores{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:760px){.cs-pair{grid-template-columns:1fr}}

  /* =====================================================================
     v1.4 — LIGHT MODE. Every full-width dark panel converted to a light
     wash. Definition now comes from washes, hairline borders and accent
     rules rather than inverted panels. Dark fills survive only on small
     UI chips (buttons, step numerals, selected calendar day).
     ===================================================================== */
  :root{
    --wash-teal:#eef4fb;
    --wash-teal-2:#e2eefb;
    --wash-amber:#e6f5f1;
    --wash-rust:#fdf1ec;
    --line-teal:#cddef2;
    --line-amber:#b8dcd0;
    --line-rust:#f2d6cb;
  }
  /* kill the glow blobs — they were lit for dark panels */
  .stats .blob-3,.offer .blob-4,.pulse .blob-5{display:none}

  /* --- stat ticker under the hero --- */
  .strip{background:var(--wash-teal);color:var(--ink);border-top:1px solid var(--line-teal);border-bottom:1px solid var(--line-teal)}
  .strip .stripin b{color:var(--teal)}

  /* --- the risk section --- */
  .stats{background:var(--wash-teal);color:var(--ink);border-top:1px solid var(--line-teal);border-bottom:1px solid var(--line-teal)}
  .stats .eyebrow{color:var(--teal)}
  .stats h2{color:var(--ink)}
  .stats .sec-head p{color:var(--ink-soft)}
  .stats .stat{background:#fff;border:1px solid var(--line-teal);box-shadow:var(--shadow-sm)}
  .stats .stat:hover{background:#fff;box-shadow:var(--shadow-md)}
  .stats .stat .num{color:var(--amber-deep)}
  .stats .stat .num.teal{color:var(--teal)}
  .stats .stat p{color:var(--ink-soft)}
  .stats .stat cite{color:#8b9a97}
  .stats .risk-patient{background:#fff !important;border:1px solid var(--line-teal) !important}
  .stats .risk-patient .eyebrow{color:var(--teal) !important}
  .stats .risk-patient h3{color:var(--ink) !important}
  .stats .risk-patient .rp-lede{color:var(--ink-soft) !important}
  .stats .risk-patient .rp-limit{color:#71827f !important}
  .stats .stats-foot{color:#71827f !important}

  /* --- cost of waiting --- */
  .waiting{background:var(--wash-rust);color:var(--ink);border-top:1px solid var(--line-rust);border-bottom:1px solid var(--line-rust)}
  .waitwrap .wico{background:#fff;border:1px solid var(--line-rust)}
  .waitwrap .wico svg circle,.waitwrap .wico svg path{stroke:var(--rust)}
  .waitwrap h2{color:var(--ink)}
  .waitwrap p{color:var(--ink-soft)}
  .waitstats{background:var(--line-rust)}
  .waitstats div{background:#fff}
  .waitstats .wn{color:var(--rust)}
  .waitstats .wl{color:var(--ink-soft)}

  /* --- widget-myth banner --- */
  .myth-banner{background:var(--wash-teal);color:var(--ink);border:1px solid var(--line-teal)}
  .myth-banner b{color:var(--ink)}
  .myth-banner svg circle{stroke:var(--teal)}
  .myth-banner svg path{stroke:var(--teal)}
  .myth-banner svg circle[fill]{fill:var(--teal)}

  /* --- HIPAA band inside the evidence section --- */
  .ev-hipaa{background:var(--wash-amber);color:var(--ink);border:1px solid var(--line-amber);border-left:4px solid var(--amber-deep)}
  .ev-hipaa-tag{color:var(--amber-deep)}
  .ev-hipaa p{color:var(--ink-soft)}
  .ev-hipaa b{color:var(--ink)}

  /* --- formula: agency vs OptiSite --- */
  .fx-vs{background:var(--bone);color:var(--ink);border:1px solid var(--line)}
  .fx-vs .side.old h4{color:var(--rust)}
  .fx-vs .side.new h4{color:var(--teal)}
  .fx-vs .side p{color:var(--ink-soft)}
  .fx-vs .vs{color:var(--ink-mute)}
  .fx .fxi{background:var(--wash-teal);border:1px solid var(--line-teal)}
  .fx .fxi svg path,.fx .fxi svg circle,.fx .fxi svg rect{stroke:var(--teal)}
  .fx .fxi svg [fill="#fff"],.fx .fxi svg [fill="#ffffff"]{fill:var(--teal)}

  /* --- the offer / pricing --- */
  .offer{background:var(--wash-amber);color:var(--ink);border-top:1px solid var(--line-amber);border-bottom:1px solid var(--line-amber)}
  .offer .eyebrow{color:var(--amber-deep)}
  .offer h2{color:var(--ink)}
  .offer .sub{color:var(--ink-soft)}
  .offer .srow{color:var(--ink-soft)}
  .offer .srow b{color:var(--ink)}
  .pcard{border:1px solid var(--line)}

  /* --- Lunovus Pulse --- */
  .pulse{background:var(--wash-teal);color:var(--ink);border-top:1px solid var(--line-teal);border-bottom:1px solid var(--line-teal)}
  .pulse h2{color:var(--ink)}
  .pulse .sec-head p{color:var(--ink-soft)}
  .pulse .eyebrow{color:var(--teal)}
  .pulse-badge{background:#fff;border-color:var(--line-teal);color:var(--teal)}
  .pulse-feat li{color:var(--ink-soft)}
  .pulse-feat li b{color:var(--ink)}
  .pulse-feat li svg path,.pulse-feat li svg circle{stroke:var(--teal)}

  /* --- real case study --- */
  .case-real{background:var(--bone);color:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .case-real .sec-head h2{color:var(--ink)}
  .case-real .sec-head p{color:var(--ink-soft)}
  .case-real .eyebrow{color:var(--teal)}
  .cs-chip{background:#fff;border-color:var(--line);color:var(--ink-soft)}
  .cs-side{background:#fff;border-color:var(--line);box-shadow:var(--shadow-sm)}
  .cs-tag.b{color:var(--amber-deep)}
  .cs-tag.a{color:var(--teal)}
  .cs-shot{border-color:var(--line)}
  .cs-cap{color:var(--ink-soft)}
  .cs-cap b{color:var(--ink)}
  .cs-score{background:#fff;border-color:var(--line);box-shadow:var(--shadow-sm)}
  .cs-score b{color:var(--ink)}
  .cs-score b em{color:var(--teal)}
  .cs-score span{color:var(--ink-soft)}
  .cs-note{color:#7d8b89}

  /* --- closing CTA panel --- */
  .final{background:var(--wash-teal);color:var(--ink);border:1px solid var(--line-teal);box-shadow:var(--shadow-sm)}
  .final::after{display:none}
  .final h2{color:var(--ink)}
  .final p{color:var(--ink-soft)}
  .final .eyebrow{color:var(--teal) !important}
  .final .finbullets span{color:var(--ink-soft)}
  .final .finbullets svg path{stroke:var(--teal)}

  /* --- CONTRAST REMEDIATION -------------------------------------------
     This page sells WCAG 2.2 AA. It has to pass its own contrast check.
     A new token, --teal-ink, replaces --teal-bright everywhere it carried
     small text; --teal-bright survives on strokes and fills, where the
     4.5:1 text rule does not apply. Measured against #fff, --bone,
     --wash-teal and --wash-amber; lowest ratio in the set is 5.07:1. --- */
  :root{ --teal-ink:#15619c; --ink-mute:#57677d; --cite:#5d6d80; --amber-ink:#083d33; }
  .eyebrow{color:var(--teal-ink)}
  .stats .stat cite{color:var(--cite)}
  .stats .stats-foot,.stats .risk-patient .rp-limit{color:var(--ink-mute) !important}
  .ev-hipaa-tag{color:var(--amber-ink)}
  .ev-num span,.chk small,.cs-note,.ba-note,.seats,.audit-mini{color:var(--ink-mute)}
  .cs-chip{color:var(--ink-mute)}
  .pcard .plabel,.logo-text small{color:var(--teal-ink)}
  .pulse-badge{color:var(--teal-ink)}
  .stats .eyebrow,.pulse .eyebrow,.case-real .eyebrow,.final .eyebrow{color:var(--teal-ink) !important}
  .offer .eyebrow{color:var(--amber-ink) !important}
  .cs-tag.b{color:var(--amber-ink)}
  .ev-col .ev-pill{color:var(--teal-ink)}
  /* decorative watermark numerals are aria-hidden; nudge them up anyway */
  .pnum{color:#eceae2}

  /* nav CTA: .navlinks a (0,1,1) was beating .btn (0,1,0) and painting the
     button's own label --ink-soft on navy. Pre-existing, 2.38:1. */
  .navlinks a.btn{color:#fff}

  /* remaining small-text uses of --teal-bright */
  .rcard .rk,.fm-proof .pl,.pillar .sub,.audit-box .abl{color:var(--teal-ink)}
  header .hero span[style*="--teal-bright"]{color:var(--teal-ink) !important}

  /* Pulse idea cards were translucent-white for a dark panel */
  .idea{background:#fff;border-color:var(--line-teal);box-shadow:var(--shadow-sm)}
  .idea h4{color:var(--ink)}
  .idea p{color:var(--ink-soft)}

  /* Pulse social strip + the "example ideas" caption */
  .social-strip{background:#fff;border-color:var(--line-teal);box-shadow:var(--shadow-sm)}
  .social-strip h3{color:var(--ink)}
  .social-strip p{color:var(--ink-soft)}
  .social-strip .opt{color:var(--teal-ink);background:var(--wash-teal);border-color:var(--line-teal)}
  .pulse .ideas-note,.pulse-top .note{color:var(--ink-mute) !important}

  /* calendar: past and taken days stay muted but readable */
  .day.past{color:#6e6a5c}
  .day.taken{color:#6b6759}

  /* --- security pillar sits in a 2x2 grid now --- */
  .pillars{grid-template-columns:repeat(2,1fr)}
  @media(max-width:820px){.pillars{grid-template-columns:1fr}}

  /* =====================================================================
     v1.5 — PHOTOGRAPHY. Real eye-care photography placed where a picture
     does work text can't: what a low-vision patient faces, what the four
     jobs look like in a practice, who does what in the build.
     Every image is decorative-adjacent but captioned in alt text, lazy
     loaded below the fold, and width/height set so nothing shifts (CLS).
     ===================================================================== */
  .pillar-photo{display:block;width:100%;height:150px;object-fit:cover;border-radius:13px;margin-bottom:18px;background:var(--bone)}
  .photo-frame{display:block;width:100%;height:auto;border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadow-sm);background:var(--bone)}
  .split{display:grid;grid-template-columns:1fr .78fr;gap:46px;align-items:center}
  .split.flip{grid-template-columns:.78fr 1fr}
  .split.flip .split-media{order:-1}
  .split-media{position:relative}
  .split-cap{margin-top:12px;font-size:.78rem;color:var(--ink-mute);line-height:1.5}
  .split-media .photo-frame{max-height:420px;width:auto;max-width:100%;margin-inline:auto}
  @media(max-width:860px){.split,.split.flip{grid-template-columns:1fr;gap:28px}.split.flip .split-media{order:0}.split-media .photo-frame{max-height:320px}}

  /* the photo carries the card now; the watermark numeral just sat on top of it */
  .pillars .pnum{display:none}

  /* the 7 steps use an ordered list for semantics; the STEP n label is the visible
     marker, so the browser's own numerals were doubling it */
  .steps7{list-style:none;padding-left:0}

  /* =====================================================================
     v1.6 — THE DEADLINE, THE ACUITY SIMULATOR, THE SECOND SCOREBOARD
     ===================================================================== */
  .deadline{background:var(--wash-amber);border-top:1px solid var(--line-amber);border-bottom:1px solid var(--line-amber)}
  .deadline .eyebrow{color:var(--amber-ink)}
  .dl-clocks{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:6px 0 26px}
  .dl-clock{background:#fff;border:1px solid var(--line-amber);border-radius:18px;padding:26px 24px;box-shadow:var(--shadow-sm)}
  .dl-clock .who{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--amber-ink)}
  .dl-clock .days{font-family:'Fraunces',serif;font-size:3.1rem;font-weight:700;line-height:1;margin:10px 0 2px;color:var(--ink)}
  .dl-clock .days small{font-family:'Archivo',sans-serif;font-size:.95rem;font-weight:600;color:var(--ink-soft);margin-left:6px}
  .dl-clock .when{font-size:.92rem;color:var(--ink-soft)}
  .dl-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .dl-fact{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 20px}
  .dl-fact h4{font-family:'Fraunces',serif;font-size:1.02rem;font-weight:600;margin-bottom:7px}
  .dl-fact p{font-size:.87rem;color:var(--ink-soft);line-height:1.55;margin:0}
  .dl-legal{margin-top:22px;border-left:3px solid var(--amber-deep);background:#fff;border-radius:0 14px 14px 0;padding:20px 24px;font-size:.88rem;color:var(--ink-soft);line-height:1.6}
  .dl-legal b{color:var(--ink)}
  @media(max-width:820px){.dl-clocks,.dl-facts{grid-template-columns:1fr}}

  /* --- acuity simulator --- */
  .acuity-wrap{display:grid;grid-template-columns:1fr .9fr;gap:44px;align-items:center}
  .sim{background:#fff;border:1px solid var(--line);border-radius:20px;padding:0;overflow:hidden;box-shadow:var(--shadow-md)}
  .sim-bar{display:flex;align-items:center;gap:7px;padding:11px 15px;background:var(--bone);border-bottom:1px solid var(--line)}
  .sim-bar i{width:9px;height:9px;border-radius:50%;background:#cfcabb;display:block}
  .sim-bar .u{margin-left:9px;font-size:.66rem;color:var(--ink-mute);background:#fff;border-radius:5px;padding:3px 10px;flex:1}
  .sim-stage{padding:28px 26px;transition:filter .45s ease}
  .sim.on .sim-stage{filter:contrast(.24) blur(1.5px)}
  .sim-h{font-family:'Fraunces',serif;font-size:1.5rem;font-weight:600;line-height:1.15;margin-bottom:9px}
  .sim-p{font-size:.93rem;color:var(--ink-soft);line-height:1.55;margin-bottom:16px}
  .sim-row{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:16px}
  .sim-btn{font-size:.83rem;font-weight:600;padding:9px 16px;border-radius:30px;background:var(--navy);color:#fff}
  .sim-btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
  .sim-meta{font-size:.8rem;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:13px;line-height:1.6}
  .sim-toggle{margin-top:20px;display:inline-flex;align-items:center;gap:10px;font-size:.95rem;font-weight:600;padding:13px 24px;border-radius:40px;border:1.5px solid var(--teal);background:#fff;color:var(--teal);cursor:pointer;transition:background .18s,color .18s}
  .sim-toggle[aria-pressed="true"]{background:var(--teal);color:#fff}
  .sim-note{margin-top:14px;font-size:.79rem;color:var(--ink-mute);line-height:1.55;max-width:52ch}
  @media(prefers-reduced-motion:reduce){.sim-stage{transition:none}}
  @media(max-width:900px){.acuity-wrap{grid-template-columns:1fr;gap:30px}}

  /* --- settlement: two bands --- */
  .bands{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
  .band{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;box-shadow:var(--shadow-sm)}
  .band .bnum{font-family:'Fraunces',serif;font-size:2.2rem;font-weight:700;line-height:1;color:var(--ink)}
  .band .bwho{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink);margin-bottom:10px}
  .band p{font-size:.89rem;color:var(--ink-soft);line-height:1.55;margin-top:11px}
  .band cite{display:block;font-style:normal;font-size:.7rem;color:var(--cite);margin-top:12px}
  @media(max-width:760px){.bands{grid-template-columns:1fr}}

  /* --- second scoreboard --- */
  .scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
  .sb{border-radius:18px;padding:28px 26px;border:1px solid var(--line);background:#fff}
  .sb.now{background:var(--wash-teal);border-color:var(--line-teal)}
  .sb h3{font-size:1.2rem;margin-bottom:8px}
  .sb p{font-size:.92rem;color:var(--ink-soft);line-height:1.6}
  .sb .sbstat{font-family:'Fraunces',serif;font-size:2.4rem;font-weight:700;line-height:1;color:var(--teal);margin:14px 0 6px}
  .sb .sbcap{font-size:.82rem;color:var(--ink-soft)}
  @media(max-width:760px){.scoreboard{grid-template-columns:1fr}}

/* ============================================================
   MULTI-PAGE ADDITIONS (v2.0.0)
   The one-page build became nine pages. Everything below exists
   only to support that: h1 styling on interior pages, the active
   nav state, a real mobile menu, and the home page card grid.
   ============================================================ */

/* Interior pages lead with an <h1> where the one-pager used an <h2>.
   These aliases mirror the existing h2 rules so nothing shifts. */
  h1,h1,h3{font-family:'Fraunces',serif;font-weight:600;line-height:1.04;letter-spacing:-.015em}
  .sec-head h1{font-size:clamp(2rem,4.2vw,3rem);margin:14px 0 16px}
  .stats h1{color:#fff}
  .offer h1{color:#fff;font-size:clamp(2rem,4vw,2.9rem);margin:14px 0 18px}
  .final h1{color:#fff;font-size:clamp(2rem,4vw,2.9rem);margin-bottom:16px}
  .pulse h1{color:#fff}
  .waitwrap h1{color:#fff;font-size:clamp(1.5rem,3vw,2rem);margin-bottom:8px}
  .case-real .sec-head h1{color:#fff}
  .stats h1{color:var(--ink)}
  .waitwrap h1{color:var(--ink)}
  .offer h1{color:var(--ink)}
  .pulse h1{color:var(--ink)}
  .case-real .sec-head h1{color:var(--ink)}
  .final h1{color:var(--ink)}

  /* interior pages open right under the sticky bar — give the first
     section a little more air so the headline isn't jammed to the nav */
  .page-top{padding-top:104px}
  @media(max-width:780px){.page-top{padding-top:72px}}

  /* ---- active nav state ---- */
  .navlinks a[aria-current="page"]{color:var(--teal);font-weight:700}
  .navlinks a.btn[aria-current="page"]{color:#fff}
  .navlinks a[aria-current="page"]:not(.btn)::after{content:"";display:block;height:2px;border-radius:2px;background:var(--teal);margin-top:4px}

  /* ---- mobile menu ----
     The one-pager simply hid the nav links under 780px, which was fine when
     every link was an anchor on the page you were already reading. With real
     pages that would strand phone users, so there is now a proper menu. */
  .navtoggle{display:none;width:42px;height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;align-items:center;justify-content:center;flex:none;margin-left:10px}
  .navtoggle span{display:block;width:18px;height:2px;background:var(--navy);border-radius:2px;position:relative}
  .navtoggle span::before,.navtoggle span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--navy);border-radius:2px;transition:transform .2s,top .2s}
  .navtoggle span::before{top:-6px}
  .navtoggle span::after{top:6px}
  .navtoggle[aria-expanded="true"] span{background:transparent}
  .navtoggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
  .navtoggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
  @media(max-width:780px){
    .navtoggle{display:flex}
    .navlinks{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-md);flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 20px;display:none}
    .navlinks.open{display:flex}
    .navlinks a:not(.btn){display:block;padding:13px 4px;border-bottom:1px solid var(--line);font-size:1rem}
    .navlinks a[aria-current="page"]:not(.btn)::after{display:none}
    .navlinks a.btn{margin-top:14px;justify-content:center}
    nav{position:sticky}
  }

  /* ---- home page section map ---- */
  .map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
  @media(max-width:900px){.map-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.map-grid{grid-template-columns:1fr}}
  .map-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;box-shadow:var(--shadow-sm);transition:transform .18s,box-shadow .18s,border-color .18s}
  .map-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--teal-bright)}
  .map-card .mc-eyebrow{font-family:'Archivo',sans-serif;font-weight:700;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-bright)}
  .map-card h3{font-family:'Fraunces',serif;font-size:1.32rem;margin:10px 0 8px;color:var(--ink)}
  .map-card p{font-size:.94rem;color:var(--ink-soft);line-height:1.6}
  .map-card .mc-go{display:inline-block;margin-top:auto;padding-top:14px;font-size:.86rem;font-weight:700;color:var(--teal)}

  /* ---- previous / next page footer links ---- */
  .pagenav{border-top:1px solid var(--line);background:#fff}
  .pagenav .wrap{display:flex;justify-content:space-between;gap:20px;padding-top:30px;padding-bottom:30px;flex-wrap:wrap}
  .pagenav a{text-decoration:none;color:var(--ink-soft);font-size:.92rem;font-weight:600;transition:color .2s}
  .pagenav a:hover{color:var(--teal)}
  .pagenav a small{display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-bright);font-weight:700;margin-bottom:4px}
  .pagenav a.nx{text-align:right;margin-left:auto}

  .skip-link{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:12px 20px;border-radius:0 0 10px 0;z-index:200;text-decoration:none;font-weight:600}
  .skip-link:focus{left:0}


  /* ---- home: four-pillar quick band (v2.1.0) ---- */
  .quick{background:var(--bone);padding:72px 0}
  .qgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  @media(max-width:980px){.qgrid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:700px){.qgrid{grid-template-columns:1fr}}
  .qcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px 28px 26px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column}
  .qcard-lead{grid-column:1 / -1;border-color:var(--line-teal);border-left:4px solid var(--amber)}
  @media(max-width:700px){.qcard-lead{grid-column:auto}}
  .qcard-lead>p{max-width:82ch}
  .qtag{font-family:'Archivo',sans-serif;font-weight:700;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-ink)}
  .qcard-lead .qtag{color:var(--amber-ink)}
  .qcard h3{font-family:'Fraunces',serif;font-size:1.42rem;margin:10px 0 10px;color:var(--ink);line-height:1.25}
  .qcard-lead h3{font-size:1.75rem}
  .qcard p{font-size:.95rem;color:var(--ink-soft);line-height:1.62}
  .qcard ul{list-style:none;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px}
  .qcard li{font-size:.8rem;font-weight:600;color:var(--teal-ink,#0d51a0);background:var(--wash-teal,#eef5fb);border:1px solid var(--line-teal,#d6e6f4);border-radius:20px;padding:6px 13px}
  .qlink{margin-top:auto;padding-top:16px;font-size:.87rem;font-weight:700;color:var(--teal);text-decoration:none}
  .qlink:hover{text-decoration:underline}

  /* ---- collapsible depth (v2.1.0) ----
     Pages got long because every supporting proof was set at full height.
     The proof is all still here; it just isn't in the way any more. */
  .more{border:1px solid var(--line);border-radius:14px;background:#fff;margin-top:24px;box-shadow:var(--shadow-sm)}
  .more>summary{cursor:pointer;list-style:none;padding:16px 22px;font-family:'Archivo',sans-serif;font-weight:700;font-size:.9rem;color:var(--teal);display:flex;align-items:center;gap:12px}
  .more>summary::-webkit-details-marker{display:none}
  .more>summary::after{content:"+";margin-left:auto;font-size:1.35rem;line-height:1;font-weight:400;color:var(--ink-soft)}
  .more[open]>summary::after{content:"\2013"}
  .more>summary:hover{color:var(--navy)}
  .more>summary:focus-visible{outline:2px solid var(--teal-bright);outline-offset:2px;border-radius:14px}
  .more>.more-in{padding:2px 22px 24px}
  .more>.more-in>*{margin-top:0}

  /* closing CTA as a single band — it repeats on eight pages */
  .final.closer{display:flex;align-items:center;justify-content:space-between;gap:28px;text-align:left;padding:26px 32px;border-radius:20px;flex-wrap:wrap}
  .final.closer h2{font-size:clamp(1.25rem,2.2vw,1.6rem);margin:6px 0 6px;line-height:1.25}
  .final.closer p{font-size:.86rem;color:var(--ink-soft);margin:0;max-width:none}
  .final.closer .eyebrow{font-size:.66rem}
  .final.closer .btn-amber{flex:none;font-size:.98rem;padding:14px 30px}
  .closer-actions{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:9px}
  .closer-alt{font-size:.83rem;font-weight:600;color:var(--teal);text-decoration:none}
  .closer-alt:hover{text-decoration:underline}
  @media(max-width:720px){.closer-actions{align-items:stretch;width:100%}.closer-alt{text-align:center}}
  @media(max-width:720px){
    .final.closer{flex-direction:column;align-items:stretch;text-align:center;padding:26px 22px}
    .final.closer .btn-amber{justify-content:center}
  }
  main > section:last-of-type{padding-top:48px;padding-bottom:56px}

  /* shorter map cards on the home page */
  .map-card p{font-size:.9rem}

  /* ---- keep the supplied photography visible (v2.3.0) ---- */
  .pillar-photo-slim{height:112px}
  .photo-band{margin-top:26px;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);background:var(--bone)}
  .photo-band-img{display:block;width:100%;height:190px;object-fit:cover}
  @media(max-width:700px){.photo-band-img{height:150px}}
  .photo-band + .more{margin-top:12px}

  .eyechart-band{padding:64px 0;background:#fff}
  .ec-in{display:grid;grid-template-columns:0.85fr 1.15fr;gap:40px;align-items:center}
  @media(max-width:820px){.ec-in{grid-template-columns:1fr;gap:26px}}
  .ec-img{display:block;width:100%;height:280px;object-fit:cover;border-radius:20px;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
  @media(max-width:820px){.ec-img{height:200px}}
  .eyechart-band h2{font-size:clamp(1.6rem,3.2vw,2.3rem);margin:12px 0 14px}
  .eyechart-band p{font-size:1rem;color:var(--ink-soft);line-height:1.65;margin-bottom:20px;max-width:62ch}

  .cs-mobile{margin-top:34px}
  .cs-mobile-head{font-size:.95rem;color:var(--ink-soft);margin-bottom:16px}
  .cs-mobile-head b{color:var(--ink)}
  .cs-mobile-pair{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:620px}
  .cs-mobile-pair figure{margin:0}
  .cs-mobile-pair img{display:block;width:100%;height:300px;object-fit:cover;object-position:top center;border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow-sm);background:var(--bone)}
  .cs-mobile-pair figcaption{margin-top:9px;font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
  @media(max-width:560px){.cs-mobile-pair img{height:220px}}

  /* ---- headings demoted for correct document outline keep their look ---- */
  h2.h3-look,h3.h4-look{font-size:1.42rem;font-family:'Fraunces',serif;margin-bottom:12px}
  .scan h2.h3-look{font-size:1.05rem;margin-bottom:14px}
  .pillar h2.h3-look{font-size:1.42rem;margin-bottom:12px}
  .map-card h2.h3-look,.qcard h2.h3-look{font-size:1.32rem;margin:10px 0 8px}
  .qcard-lead h2.h3-look{font-size:1.75rem}
  .contact-card h2.h3-look{font-size:1.6rem;color:#fff;margin:10px 0 4px}
  .contact-form-wrap h2.h3-look{font-size:1.45rem;margin-bottom:6px}

  /* ---- nav fits nine destinations without wrapping (v3.0.0) ---- */
  .navlinks{gap:19px}
  .navlinks a{white-space:nowrap;font-size:.87rem}
  .navlinks a.btn{padding:12px 20px}
  @media(max-width:1120px){.navlinks{gap:14px}.navlinks a{font-size:.83rem}}
  @media(max-width:980px){.navin{padding:13px 20px}.navlinks a.btn{padding:11px 16px;font-size:.82rem}}
  @media(max-width:900px){.navlinks a:not(.btn){display:none}.navtoggle{display:flex}}
  @media(max-width:900px){
    .navlinks{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-md);flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 20px;display:none}
    .navlinks.open{display:flex}
    .navlinks.open a:not(.btn){display:block;padding:13px 4px;border-bottom:1px solid var(--line);font-size:1rem}
    .navlinks a.btn{margin-top:14px;justify-content:center;width:100%}
  }
  .cc-photo{margin-top:22px;border-color:rgba(255,255,255,.18);background:transparent}
  .cc-photo img{height:180px;object-fit:cover}

  /* ---- header contact bar (v3.0.0) ---- */
  .topbar{background:var(--navy);color:#cfe0ee;font-size:.82rem}
  .topbar-in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 28px;flex-wrap:wrap}
  .tb-lead{font-weight:500;color:#9fbcd8}
  .tb-links{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
  .topbar a{color:#e6f0f9;text-decoration:none;display:inline-flex;align-items:center;gap:7px;font-weight:500;transition:color .18s}
  .topbar a:hover{color:#fff;text-decoration:underline}
  .topbar a b{font-weight:700}
  .topbar svg{flex:none;opacity:.75}
  .tb-cta{font-weight:700;color:var(--amber-bright)!important}
  @media(max-width:880px){
    .topbar-in{justify-content:center;gap:10px 18px;padding:9px 18px;text-align:center}
    .tb-lead{display:none}
    .tb-links{gap:14px;justify-content:center}
  }
  @media(max-width:520px){.topbar a:not([href^="tel"]):not(.tb-cta){display:none}}

  .trackrec{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0 0 30px}
  @media(max-width:700px){.trackrec{grid-template-columns:1fr}}
  .trackrec .tr-item{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:var(--shadow-sm)}
  .trackrec b{display:block;font-family:'Fraunces',serif;font-size:2rem;color:var(--teal);line-height:1.05}
  .trackrec span{display:block;font-size:.86rem;color:var(--ink-soft);margin-top:6px;line-height:1.5}

  /* ---- footer contact block ---- */

  /* ---- contact page ---- */
  .contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;align-items:start}
  @media(max-width:880px){.contact-grid{grid-template-columns:1fr;gap:26px}}
  .contact-card{background:var(--navy);color:#dbe6ef;border-radius:20px;padding:30px 28px}
  .contact-card .eyebrow{color:var(--amber-bright)}
  .contact-card h3{font-family:'Fraunces',serif;font-size:1.6rem;color:#fff;margin:10px 0 4px}
  .cc-role{font-size:.86rem;color:#9fbcd8;margin-bottom:20px}
  .cc-line{display:block;text-decoration:none;padding:12px 0;border-top:1px solid rgba(255,255,255,.14)}
  .cc-line b{display:block;color:#fff;font-size:1.02rem;font-weight:700}
  .cc-line small{display:block;font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:#8fb0cd;margin-top:3px}
  .cc-line:hover b{color:var(--amber)}
  .cc-note{font-size:.8rem;color:#9fbcd8;line-height:1.6;margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}

  .contact-form-wrap{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px 30px 26px;box-shadow:var(--shadow-sm)}
  .contact-form-wrap h3{font-family:'Fraunces',serif;font-size:1.45rem;margin-bottom:6px}
  .cf-sub{font-size:.9rem;color:var(--ink-soft);margin-bottom:22px}
  .cf-hp{position:absolute;left:-9999px}
  .cf-row{margin-bottom:15px}
  .cf-two{display:grid;grid-template-columns:1fr 1fr;gap:15px}
  @media(max-width:560px){.cf-two{grid-template-columns:1fr;gap:0}}
  .cform label{display:block;font-size:.83rem;font-weight:700;color:var(--ink);margin-bottom:6px}
  .cform label span{color:var(--rust)}
  .cform input,.cform select,.cform textarea{width:100%;font-family:'Archivo',sans-serif;font-size:.95rem;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:11px;padding:12px 14px;transition:border-color .15s,box-shadow .15s}
  .cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--teal-bright);box-shadow:0 0 0 3px rgba(42,144,214,.16)}
  .cform textarea{resize:vertical;line-height:1.55}
  .cf-consent{display:flex!important;align-items:flex-start;gap:10px;font-size:.85rem!important;font-weight:500!important;color:var(--ink-soft)!important;margin:6px 0 18px}
  .cf-consent input{width:auto;flex:none;margin-top:2px}
  .cform .btn{width:100%;justify-content:center;font-size:1rem;padding:15px}
  .cf-fine{font-size:.78rem;color:var(--ink-soft);line-height:1.55;margin-top:12px;text-align:center}
  .cform-done{text-align:center;padding:20px 0}
  .cform-done h3{margin-bottom:10px}
  .cform-done p{font-size:.95rem;color:var(--ink-soft);margin-bottom:18px}

  /* ---- audit box now links out to WebReady360 (v2.6.0) ---- */
  .audit-box .btn{margin-top:14px}
  .audit-box .audit-mini{margin-top:8px}

  /* ---- new photography (v2.4.0) ---- */
  .photo-figure{margin:26px 0 0;max-width:540px;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);background:var(--bone)}
  .photo-figure.center{margin-left:auto;margin-right:auto}
  .photo-figure img{display:block;width:100%;height:auto}
  .photo-figure figcaption{font-size:.85rem;color:var(--ink-soft);padding:13px 18px 15px;background:#fff;border-top:1px solid var(--line);line-height:1.5}
  .sec-head + .photo-figure{margin-top:8px;margin-bottom:34px}

  .qcard-photo{display:block;width:100%;height:132px;object-fit:cover;border-radius:14px;margin-bottom:16px;background:var(--bone)}
  @media(max-width:700px){.qcard-photo{height:150px}}

  .qcard-media{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center}
  @media(max-width:880px){.qcard-media{grid-template-columns:1fr;gap:20px}}
  .qc-copy{display:flex;flex-direction:column}
  .qc-media img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--line)}

  /* ============================================================
     WCAG 2.2 AA CONTRAST OVERRIDES (1.4.3)
     --teal-bright #2a90d6 is 3.47:1 on white and --amber-deep #c9761a is
     3.45:1 — both fine as graphic accents, both failing as text. Every
     place they were used for small copy now uses the ink variants
     (#15619c = 6.52:1, #8a5210 = 6.37:1). Verified with axe-core.
     Do not put --teal-bright or --amber-deep on text again.
     ============================================================ */
  .map-card .mc-eyebrow,
  .mc-eyebrow,
  .pagenav a small,
  .qtag,
  .cf-sub,
  .contact-card .eyebrow{color:var(--teal-ink)}
  .qcard-lead .qtag,
  .contact-card .eyebrow{color:var(--amber-ink)}
  .contact-card .eyebrow{color:var(--amber-bright)}
  .photo-figure figcaption{color:var(--ink-soft)}

  /* ============================================================
     WCAG 2.2 CONFORMANCE PASS (v3.1.0) — verified with axe-core
     ============================================================ */

  /* 2.4.7 Focus Visible + 2.4.11 Focus Not Obscured.
     The browser default was a 1px auto outline, and the sticky header
     could sit on top of whatever had just been focused. */
  :focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px;border-radius:4px}
  .btn:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
  .topbar a:focus-visible,.contact-card a:focus-visible{outline:3px solid var(--amber-bright);outline-offset:3px}
  :target,a,button,summary,input,select,textarea,[tabindex]{scroll-margin-top:150px}

  /* 2.5.8 Target Size (Minimum) — 24x24 CSS px on every control.
     The contact links were 20-22px tall and the checkboxes 13-15px. */
  .topbar a,.closer-alt,.cc-line,.qlink,.mc-go,.pagenav a{min-height:24px;display:inline-flex;align-items:center}
  .fc-lines a{min-height:44px}
  .closer-alt{padding:3px 0}
  .cform input[type="checkbox"],.bookform input[type="checkbox"]{width:24px;height:24px;min-width:24px;accent-color:var(--teal)}
  .cf-consent,.bookform label.consent{align-items:center}
  /* .day is aspect-ratio:1, so a min-height would force the width too and
     blow the 7-column calendar past a 320px viewport. Constrain width only. */
  .day{min-width:24px}

  /* 1.4.10 Reflow at 320px. Grid children default to min-width:auto, which
     stops them shrinking below their content and pushed .rcard off-screen. */
  [class*="grid"] > *{min-width:0}
  .wrap,.navin,.topbar-in{overflow-wrap:break-word}
  @media(max-width:380px){.wrap{padding-left:18px;padding-right:18px}}

  /* 1.4.4 Resize Text. Breakpoints in em respond to a raised browser default
     font size, so the nav collapses to the menu instead of overflowing. */
  @media(max-width:56.25em){
    .navlinks a:not(.btn){display:none}
    .navtoggle{display:flex}
  }

  /* ============================================================
     WHITE-FIRST PALETTE (v3.3.0)
     Every section background is white. Colour is now reserved for
     things that are meant to be looked at: callout cards, the contact
     bar, the closing CTA, stat chips, badges and buttons.
     Section separation comes from a hairline rule instead of a tint.
     ============================================================ */
  body,
  main > section,
  section.quick,
  section.stats,
  section.pulse,
  section.offer,
  section.deadline,
  section.case-real,
  section#evidence,
  section#checks,
  section#faq,
  section#risk,
  section#pricing,
  section#deadline,
  section#case,
  footer{background:#fff}

  main > section + section{border-top:1px solid var(--line)}
  footer{border-top:1px solid var(--line)}
  .pagenav{border-top:1px solid var(--line);background:#fff}

  /* the stat strip keeps its emphasis, as a bordered band rather than a tint */
  .strip{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .strip .stripin b{color:var(--teal)}

  /* anything that was a white card on a tinted section now needs its own edge */
  .statgrid > *,
  .ev-nums > *,
  .checks-grid > *,
  .cs-scores > *,
  .mplan > *,
  .rcard,
  .pcard,
  .fm-grid > *,
  .keeps > *,
  .bands > *,
  .scoreboard > *,
  .myth-col,
  .faq details{border:1px solid var(--line)}
  .faq details{border-radius:14px;margin-bottom:10px;background:#fff}
  .faq details > summary{padding-left:18px;padding-right:18px}

  /* callouts keep their colour — that is the point of them now */
  .final.closer{background:var(--wash-teal);border:1px solid var(--line-teal)}
  .ev-hipaa{background:var(--wash-amber)}
  .contact-card{background:var(--navy)}
  .topbar{background:var(--navy)}
  .photo-band,.photo-figure{background:#fff}
  .more{background:#fff}
  .trackrec .tr-item,.map-card,.qcard,.contact-form-wrap{background:#fff}

  /* ---- footer disclaimer, folded ---- */
  .disc-gist{font-size:.8rem;line-height:1.6;color:var(--ink-soft);max-width:78ch;margin:26px auto 0}
  .more-foot{max-width:none;margin:14px 0 0;background:transparent;border-color:var(--line);box-shadow:none}
  .more-foot>summary{padding:12px 20px;font-size:.8rem;justify-content:flex-start}
  .more-foot>summary::after{margin-left:12px;font-size:1.1rem}
  .more-foot>.more-in{padding:0 20px 18px}
  .more-foot .disc{margin-top:0;max-width:none;text-align:left}
  .more-foot .disc b{color:var(--ink)}
  footer{padding:26px 0 20px}
  @media(max-width:880px){footer{padding-bottom:80px}}


  /* ============================================================
     ANSWER-FIRST + PER-PAGE Q&A (v3.4.0)
     Assistants quote a passage when the page asks the question and
     answers it immediately in a self-contained paragraph. Schema
     describes the page; this is the part they actually lift.
     ============================================================ */
  .answer-first{border:1px solid var(--line-teal);border-left:4px solid var(--teal-bright);
    border-radius:18px;padding:26px 30px 28px;margin:0 0 40px;max-width:820px;background:#fff;
    box-shadow:var(--shadow-sm)}
  .af-tag{display:inline-block;font-family:'Archivo',sans-serif;font-weight:700;font-size:.66rem;
    letter-spacing:.22em;text-transform:uppercase;color:var(--teal-ink);margin-bottom:10px}
  .answer-first h2.af-q{font-family:'Fraunces',serif;font-size:clamp(1.3rem,2.4vw,1.65rem);
    line-height:1.28;margin:0 0 12px;color:var(--ink)}
  .af-a{font-size:1.02rem;line-height:1.68;color:var(--ink);margin:0 0 16px;max-width:70ch}
  .af-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;padding:0}
  .af-facts li{font-size:.82rem;font-weight:600;color:var(--teal-ink);background:var(--wash-teal);
    border:1px solid var(--line-teal);border-radius:20px;padding:7px 14px}
  .af-cta{font-size:.95rem}
  @media(max-width:600px){.answer-first{padding:22px 20px 24px}.af-cta{width:100%;justify-content:center}}

  .page-faq .sec-head{margin-bottom:26px}
  .faq.pf details{border:1px solid var(--line);border-radius:14px;margin-bottom:10px;background:#fff}
  .faq.pf summary{cursor:pointer;list-style:none;padding:16px 20px;font-family:'Archivo',sans-serif;
    font-weight:700;font-size:.98rem;color:var(--ink);display:flex;align-items:center;gap:12px;min-height:24px}
  .faq.pf summary::-webkit-details-marker{display:none}
  .faq.pf summary::after{content:"+";margin-left:auto;font-size:1.35rem;line-height:1;font-weight:400;color:var(--ink-soft)}
  .faq.pf details[open] summary::after{content:"\2013"}
  .faq.pf .fa{padding:0 20px 20px;font-size:.96rem;line-height:1.68;color:var(--ink-soft);max-width:76ch}

  /* ==========================================================================
     REDUCED MOTION — WCAG 2.2.2 (Pause, Stop, Hide) and 2.3.3 (Animation
     from Interactions). Vestibular disorders, migraine and some seizure
     conditions are triggered by movement. If the visitor has asked their
     operating system for less motion, every animation on this site stops:
     the infinite spin and pulse loops, the scroll reveals, the smooth
     scrolling, and every transition. Content stays fully visible - the
     reveal animations are neutralised to their finished state, never left
     stuck at opacity 0.
     ========================================================================== */
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto !important}
    *,*::before,*::after{
      animation-duration:.001ms !important;
      animation-iteration-count:1 !important;
      transition-duration:.001ms !important;
      scroll-behavior:auto !important
    }
    .reveal,.reveal.in{opacity:1 !important;transform:none !important}
    .pill .dot,.blob,.scanbar i,.spin{animation:none !important}
    .scanbar i{width:97%}
  }


  /* ---- legal / document pages ---- */
  .legal{max-width:74ch}
  .legal h2{font-size:1.45rem;margin:38px 0 10px;scroll-margin-top:90px}
  .legal h3{font-size:1.06rem;margin:24px 0 6px}
  .legal p,.legal li{font-size:1rem;color:var(--ink-soft);line-height:1.68}
  .legal p{margin-bottom:13px}
  .legal ul,.legal ol{margin:0 0 15px 22px}
  .legal li{margin-bottom:7px}
  .legal a{color:var(--teal);font-weight:600}
  .legal strong{color:var(--ink)}
  .legal-meta{display:flex;flex-wrap:wrap;gap:8px 10px;margin:0 0 8px}
  .lm-chip{font-size:.76rem;font-weight:700;letter-spacing:.03em;color:var(--teal-deep);background:var(--bone);border:1px solid var(--line);border-radius:30px;padding:5px 13px}
  .legal-callout{background:#eff6fd;border:1px solid #d3e7ef;border-left:4px solid var(--teal-bright);border-radius:0 12px 12px 0;padding:18px 22px;margin:22px 0}
  .legal-callout p:last-child{margin-bottom:0}
  .legal-callout h3{margin-top:0}

  /* ==========================================================================
     BEFORE / AFTER COMPARISON VIEWER
     The reveal is a native <input type="range">, not a custom drag widget.
     That is deliberate: arrow keys, Home and End work for free, it announces
     itself correctly, and it does not depend on a pointer. The three jump
     buttons exist for anyone who finds dragging or fine control difficult -
     you can reach either state in one click without ever moving a slider.
     ========================================================================== */
  /* display:flex on .cmp-empty and .cmp-foot outranks the hidden attribute's
     UA display:none, so state it explicitly rather than relying on it */
  .cmp [hidden],.cmp-empty[hidden],.cmp-foot[hidden],.cmp-frame[hidden],.cmp-cap[hidden]{display:none!important}
  .cmp{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-md);overflow:hidden;margin-top:8px}
  .cmp-bar{display:flex;flex-wrap:wrap;gap:12px 18px;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--bone)}
  .cmp-tabs{display:flex;gap:6px}
  .cmp-tab{font-family:inherit;font-size:.9rem;font-weight:700;color:var(--ink-soft);background:transparent;border:1px solid transparent;border-radius:30px;padding:9px 18px;min-height:40px;cursor:pointer;transition:background .15s,color .15s}
  .cmp-tab:hover{color:var(--teal);background:#fff}
  .cmp-tab.is-on{background:var(--navy);color:#fff}
  .cmp-tab:focus-visible,.cmp-chip:focus-visible,.cmp-jbtn:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px}
  .cmp-dev{display:flex;gap:6px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:3px}
  .cmp-chip{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:.82rem;font-weight:700;color:var(--ink-soft);background:transparent;border:none;border-radius:30px;padding:8px 15px;min-height:38px;cursor:pointer;transition:background .15s,color .15s}
  .cmp-chip:hover{color:var(--teal)}
  .cmp-chip.is-on{background:var(--teal);color:#fff}
  .cmp-stage{padding:20px;background:#f2f4f7}
  .cmp-stage:focus-visible{outline:3px solid var(--teal-bright);outline-offset:-3px}
  .cmp-frame{position:relative;margin:0 auto;max-width:100%;line-height:0;border-radius:12px;overflow:hidden;box-shadow:0 6px 26px rgba(17,33,31,.14);background:#fff;--split:50%}
  .cmp-frame.is-mobile{max-width:390px}
  .cmp-img{display:block;width:100%;height:auto}
  .cmp-clip{position:absolute;inset:0;clip-path:inset(0 0 0 var(--split));transition:clip-path .05s linear}
  .cmp-clip .cmp-img{position:absolute;inset:0;width:100%;height:100%}
  .cmp-labels{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 auto 10px;max-width:100%}
  .cmp-badge{font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#fff;padding:6px 12px;border-radius:30px;line-height:1.3;white-space:nowrap}
  .cmp-badge.b{background:rgba(198,63,35,.94)}
  .cmp-badge.a{background:rgba(12,34,70,.94)}
  @media(max-width:520px){
    .cmp-labels{gap:8px}
    .cmp-badge{font-size:.56rem;padding:4px 8px;letter-spacing:.06em}
  }
  .cmp-handle{position:absolute;top:0;bottom:0;left:var(--split);width:3px;background:#fff;box-shadow:0 0 0 1px rgba(12,34,70,.28);transform:translateX(-1.5px);z-index:4;pointer-events:none}
  .cmp-grip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;box-shadow:0 3px 14px rgba(12,34,70,.34)}
  .cmp-range{position:absolute;inset:0;z-index:5;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;background:transparent}
  .cmp-range::-webkit-slider-thumb{-webkit-appearance:none;width:46px;height:100%;cursor:ew-resize}
  .cmp-range::-moz-range-thumb{width:46px;height:400px;border:0;background:transparent;cursor:ew-resize}
  .cmp-range:focus-visible+.x,.cmp-frame:has(.cmp-range:focus-visible){outline:3px solid var(--teal-bright);outline-offset:3px}
  .cmp-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:52px 26px;background:#fff;border:1px dashed var(--line);border-radius:12px;color:var(--ink-soft)}
  .cmp-empty svg{color:var(--teal-bright)}
  .cmp-empty h3{font-size:1.18rem;color:var(--ink);margin-top:6px}
  .cmp-empty p{font-size:.92rem;max-width:52ch;line-height:1.6}
  .cmp-empty-cta a{color:var(--teal);font-weight:700}
  .cmp-foot{display:flex;flex-wrap:wrap;gap:12px 20px;justify-content:space-between;align-items:center;padding:14px 18px;border-top:1px solid var(--line)}
  .cmp-jump{display:flex;flex-wrap:wrap;gap:7px}
  .cmp-jbtn{font-family:inherit;font-size:.8rem;font-weight:700;color:var(--ink-soft);background:#fff;border:1px solid var(--line);border-radius:30px;padding:8px 15px;min-height:38px;cursor:pointer;transition:border-color .15s,color .15s,background .15s}
  .cmp-jbtn:hover{border-color:var(--teal);color:var(--teal);background:#eff6fd}
  .cmp-jbtn.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
  .cmp-live{font-size:.82rem;color:var(--ink-soft)}
  .cmp-live a{color:var(--teal);font-weight:600}
  .cmp-cap{font-size:.92rem;line-height:1.65;color:var(--ink-soft);padding:0 18px 20px}
  .cmp-cap b{color:var(--ink)}
  @media(max-width:640px){
    .cmp-bar,.cmp-foot{flex-direction:column;align-items:stretch}
    .cmp-tabs,.cmp-dev{justify-content:center}
    .cmp-stage{padding:12px}
    .cmp-badge{font-size:.6rem;padding:5px 9px}
    .cmp-grip{width:40px;height:40px}
  }
  @media (prefers-reduced-motion: reduce){.cmp-clip{transition:none}}

  /* --- legal documents: progressive disclosure -------------------------
     Every word stays in the DOM, so the documents are still published,
     still crawled and still quotable. What changes is what a person meets
     on arrival: a scannable list of headings instead of 1,200 words. The
     sections people actually come for stay open.
     -------------------------------------------------------------------- */
  .legal-sec{border-bottom:1px solid var(--line)}
  .legal-sec > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:15px 2px;min-height:44px}
  .legal-sec > summary::-webkit-details-marker{display:none}
  .legal-sec > summary h2{font-size:1.12rem;margin:0;flex:1;font-family:'Fraunces',serif;font-weight:600;line-height:1.35}
  .legal-sec > summary::after{content:"";flex:none;width:11px;height:11px;border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(45deg);margin-right:6px;transition:transform .18s}
  .legal-sec[open] > summary::after{transform:rotate(-135deg)}
  .legal-sec > summary:hover h2{color:var(--teal)}
  .legal-sec > summary:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px;border-radius:6px}
  .legal-sec-in{padding:2px 0 20px}
  .legal-sec-in > :first-child{margin-top:0}
  .legal .legal-sec h3{font-size:1rem;margin:20px 0 6px}
  @media (prefers-reduced-motion: reduce){.legal-sec > summary::after{transition:none}}

  .legal-tools{display:flex;justify-content:flex-end;margin:2px 0 4px;max-width:74ch}
  .legal-toggle{font-family:inherit;font-size:.8rem;font-weight:700;color:var(--teal);background:#fff;border:1px solid var(--line);border-radius:30px;padding:8px 16px;min-height:38px;cursor:pointer;transition:border-color .15s,background .15s}
  .legal-toggle:hover{border-color:var(--teal);background:#eff6fd}
  .legal-toggle:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px}
  @media print{.legal-sec{border:none}.legal-sec > summary::after{display:none}.legal-tools{display:none}.legal-sec-in{display:block!important}}

  /* --- the full check register (audit.html) -----------------------------
     244 lines is a lot to meet at once, so each area is its own disclosure.
     The WCAG criterion numbers are shown because a total nobody can inspect
     is just a number; a reader can check ours against the WCAG index.
     --------------------------------------------------------------------- */

  /* --- product shot: a real build, in a browser frame -------------------- */
  .shot{margin:0;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-md)}
  .shot-chrome{display:flex;align-items:center;gap:7px;padding:10px 14px;background:var(--bone);border-bottom:1px solid var(--line)}
  .sc-dot{width:9px;height:9px;border-radius:50%;background:#d8d4c8;flex:none}
  .sc-url{margin-left:10px;font-size:.72rem;color:var(--ink-soft);background:#fff;border:1px solid var(--line);border-radius:20px;padding:3px 12px}
  .shot img{display:block;width:100%;height:auto}
  .shot-cap{padding:14px 18px 16px;font-size:.86rem;line-height:1.6;color:var(--ink-soft);text-align:left}
  .shot-cap b{color:var(--ink)}
  .shot-cap a{color:var(--teal);font-weight:600;white-space:nowrap}

  /* --- the before-state, moved out of the hero --------------------------- */
  .beforestrip{background:var(--bone);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:38px 0}
  .bs-head{margin-bottom:18px}
  .bs-head h2{margin-top:6px}
  .bs-rows{display:grid;grid-template-columns:1fr 1fr;gap:0 34px;max-width:900px}
  .beforestrip .scanrow{border-bottom:1px dashed var(--line)}
  .bs-note{font-size:.84rem;color:var(--ink-soft);margin-top:16px}
  .bs-note a{color:var(--teal);font-weight:600}
  @media(max-width:760px){.bs-rows{grid-template-columns:1fr}}

  /* --- phone shot, used on What You Get ---------------------------------- */
  .phoneshot{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
  .phoneshot .pf-frame{border:9px solid var(--navy);border-radius:30px;overflow:hidden;box-shadow:var(--shadow-md);line-height:0;max-width:300px}
  .phoneshot img{display:block;width:100%;height:auto}
  .phoneshot figcaption{font-size:.84rem;color:var(--ink-soft);text-align:center;max-width:38ch;line-height:1.6}
  .phoneshot figcaption b{color:var(--ink)}

  /* the shot is the point of the hero, so let it break the wrap on wide screens */


  /* --- What You Get: the product, shown before it is described ---------- */
  .whatshot{display:grid;grid-template-columns:330px 1fr;gap:44px;align-items:start;margin:34px 0 8px}
  .whatshot-txt h2{margin-bottom:10px}
  .whatshot-txt > p{font-size:1rem;color:var(--ink-soft);margin-bottom:18px;max-width:52ch}
  .ws-list{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:11px}
  .ws-list li{font-size:.95rem;line-height:1.55;color:var(--ink-soft);padding-left:26px;position:relative}
  .ws-list li b{color:var(--ink)}
  .ws-list li::before{content:"";position:absolute;left:0;top:7px;width:13px;height:8px;border-left:2.4px solid var(--teal);border-bottom:2.4px solid var(--teal);transform:rotate(-45deg)}
  @media(max-width:880px){.whatshot{grid-template-columns:1fr;gap:30px}.phoneshot{order:-1}}

  /* A 1280px-wide screenshot is unreadable in a 390px column, and a phone
     visitor relates to the phone view anyway. display:none also removes the
     hidden one from the accessibility tree, so only one alt is announced. */
  /* .shot img already sets display:block at (0,1,1); these selectors have to
     outrank it, so they are scoped to .shot img rather than the class alone. */
  .shot img.shot-phone{display:none}
  @media(max-width:900px){
    .shot{max-width:330px;margin:0 auto;border-radius:22px}
    .shot .shot-chrome{display:none}
    .shot img.shot-desk{display:none}
    .shot img.shot-phone{display:block}
    .shot-cap{padding:12px 14px 14px;text-align:center}
  }

  /* --- live-build demo module -------------------------------------------
     Deliberately small. A <details> so the live link is revealed on select
     and the whole thing is keyboard-operable with no script.
     ---------------------------------------------------------------------- */
  .demo-mod{max-width:340px}
  .dm{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-sm);overflow:hidden;transition:box-shadow .18s,border-color .18s}
  .dm[open]{border-color:var(--teal);box-shadow:var(--shadow-md)}
  .dm > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:13px;padding:11px;min-height:44px}
  .dm > summary::-webkit-details-marker{display:none}
  .dm > summary:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px;border-radius:14px}
  .dm-thumb{flex:none;width:88px;height:56px;border-radius:8px;overflow:hidden;border:1px solid var(--line);line-height:0;background:var(--bone)}
  .dm-thumb img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
  .dm-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
  .dm-txt b{font-size:.9rem;color:var(--ink);line-height:1.25}
  .dm-txt small{font-size:.74rem;color:var(--ink-soft)}
  .dm > summary::after{content:"";margin-left:auto;flex:none;width:9px;height:9px;border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(45deg);transition:transform .18s}
  .dm[open] > summary::after{transform:rotate(-135deg)}
  .dm-open{display:flex;flex-direction:column;gap:8px;padding:2px 12px 13px 12px;border-top:1px solid var(--line);margin-top:2px}
  .dm-live{display:inline-flex;align-items:center;justify-content:center;min-height:42px;background:var(--navy);color:#fff;border-radius:30px;text-decoration:none;font-weight:700;font-size:.86rem;padding:9px 16px}
  .dm-live:hover{background:var(--navy-2)}
  .dm-alt{font-size:.8rem;color:var(--teal);font-weight:600;text-decoration:none;text-align:center;min-height:32px;display:inline-flex;align-items:center;justify-content:center}
  .dm-alt:hover{text-decoration:underline}
  @media (prefers-reduced-motion: reduce){.dm,.dm > summary::after{transition:none}}
  @media(max-width:900px){.demo-mod{max-width:100%;margin:6px auto 0}}

  .heromods{display:flex;flex-direction:column;gap:16px;max-width:360px}
  .heromods .demo-mod{max-width:none}
  .heromods .audit-box{margin-top:0}
  @media(max-width:900px){.heromods{max-width:100%;margin-top:6px}}

  /* ==========================================================================
     FOOTER
     Four columns on ONE baseline (align-items:start), each a plain text
     column so nothing floats in a box of its own. Column widths are set to
     the content rather than fractions, so the nav lists do not stretch.
     Then a full-width legal band, then a bottom bar.
     ========================================================================== */
  .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  footer{background:var(--bone);border-top:1px solid var(--line);text-align:left;padding:34px 0 20px}
  .footgrid{display:grid;grid-template-columns:1.5fr 1fr 1.25fr 1.2fr;gap:30px;align-items:start}
  .footcol{min-width:0}

  .fb-logo{display:inline-block;text-decoration:none}
  .footbrand .footlogo-optisite{font-family:'Fraunces',serif;font-size:1.5rem;font-weight:600;letter-spacing:-.02em;color:var(--ink);line-height:1}
  .fb-by{display:flex;align-items:center;gap:9px;font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin:6px 0 8px}
  .fb-by img{width:96px;height:auto;flex:none}
  .fb-desc{font-size:.85rem;color:var(--ink-soft);line-height:1.5;max-width:34ch;margin-bottom:8px}
  .fb-addr{font-style:normal;font-size:.78rem;color:var(--ink-soft);line-height:1.5}

  /* the two footer link groups are <nav> landmarks, so the sticky site-header
     rule nav{position:sticky;background:rgba(255,255,255,.88);...} was
     applying to them: a white panel behind each column, and sticky
     positioning inside the footer. Reset it here rather than narrowing the
     header rule, which the topbar also depends on. */
  footer nav{position:static;background:none;backdrop-filter:none;border-bottom:0;z-index:auto}
  .fn-head{font-family:'Archivo',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);margin:0 0 8px}
  .footnav ul{list-style:none;margin:0;padding:0}
  .footnav li{margin:0}
  .footnav a{display:inline-flex;align-items:center;min-height:26px;font-size:.85rem;color:var(--ink-soft);text-decoration:none;font-weight:500}
  .footnav a:hover{color:var(--teal);text-decoration:underline}
  .footnav a:focus-visible,.fc-lines a:focus-visible{outline:3px solid var(--teal-bright);outline-offset:2px;border-radius:4px}
  .fn-a11y{display:flex;gap:7px;align-items:center;font-size:.74rem;line-height:1.4;color:var(--ink-soft);margin-top:10px;padding-top:8px;border-top:1px solid var(--line)}
  .fn-a11y svg{flex:none;color:var(--teal)}

  .footcontact .fc-sub{font-size:.85rem;color:var(--ink);font-weight:600;margin:-4px 0 8px}
  .fc-lines{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:7px}
  .fc-lines a{display:flex;flex-direction:column;gap:1px;text-decoration:none;min-height:32px}
  .fc-lines b{font-size:.85rem;color:var(--ink);font-weight:700}
  .fc-lines span{font-size:.78rem;color:var(--ink-soft)}
  .fc-lines a:hover b{color:var(--teal)}
  .fc-lines a:hover span{text-decoration:underline}
  .fc-cta{width:100%;justify-content:center;font-size:.9rem;padding:10px 18px}

  .footlegal{margin-top:22px;padding-top:16px;border-top:1px solid var(--line)}
  footer .disc-gist{font-size:.78rem;line-height:1.55;color:var(--ink-soft);max-width:none;margin:0 0 8px}
  footer .more-foot{text-align:left;max-width:none;margin-top:8px}

  .footbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 24px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
  .fbar-c{font-size:.76rem;color:var(--ink-soft);margin:0}
  .footbar .vstamp{margin:0;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft)}

  @media(max-width:1040px){.footgrid{grid-template-columns:1fr 1fr;gap:26px 32px}}
  @media(max-width:600px){
    footer{padding:26px 0 18px}
    .footgrid{grid-template-columns:1fr;gap:22px}
    .footbar{flex-direction:column;align-items:flex-start}
  }

  /* ==========================================================================
     v3.5.6 — LAYOUT BALANCE
     Fixes blocks that sat in a narrow left-hand column with dead white space
     to their right. Three patterns:
       .pt-band      page-top headline + a media column beside it
       .answer-first now spans the container and splits internally
       .photo-figure a caption column beside the image instead of under it
     ========================================================================== */

  /* --- page-top: headline left, image right ------------------------------ */
  .pt-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.72fr);
    gap:44px;align-items:center;margin-bottom:38px}
  .pt-band .sec-head{max-width:none;margin-bottom:0}
  .pt-media{margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--line);
    box-shadow:var(--shadow-sm);background:var(--bone);line-height:0}
  .pt-media img{display:block;width:100%;height:100%;aspect-ratio:4/3;object-fit:cover}
  .pt-media figcaption{font-size:.82rem;line-height:1.5;color:var(--ink-soft);
    background:#fff;border-top:1px solid var(--line);padding:12px 16px 14px}
  .case-real .pt-media,.stats .pt-media{border-color:rgba(255,255,255,.18)}
  @media(max-width:900px){
    .pt-band{grid-template-columns:1fr;gap:26px;margin-bottom:30px}
    .pt-media{max-width:560px}
  }

  /* --- answer-first: full width, two columns ------------------------------ */
  .answer-first{max-width:none}
  .af-main{display:flex;flex-direction:column;align-items:flex-start}
  @media(min-width:940px){
    .answer-first{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
      gap:38px;align-items:start;padding:30px 34px 32px}
    .af-a{max-width:62ch}
    .af-facts{flex-direction:column;align-items:stretch;gap:9px;margin:0}
    .af-facts li{width:100%;border-radius:12px;padding:11px 15px;line-height:1.45}
    .af-cta{margin-top:4px}
  }

  /* --- photo-figure: caption beside the image, block spans the column ----- */
  .photo-figure:not(.center){max-width:none;display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:stretch}
  .photo-figure:not(.center) img{height:100%;object-fit:cover;aspect-ratio:4/3}
  .photo-figure:not(.center) figcaption{display:flex;align-items:center;
    border-top:0;border-left:1px solid var(--line);font-size:1rem;line-height:1.6;
    padding:22px 26px;color:var(--ink)}
  @media(max-width:820px){
    .photo-figure:not(.center){grid-template-columns:1fr}
    .photo-figure:not(.center) img{aspect-ratio:16/10}
    .photo-figure:not(.center) figcaption{border-left:0;border-top:1px solid var(--line);
      font-size:.85rem;padding:13px 18px 15px;color:var(--ink-soft)}
  }
  .photo-figure.center{max-width:660px}

  /* --- centred blocks that were sitting hard left ------------------------- */
  .page-faq .sec-head{margin-left:auto;margin-right:auto;text-align:center}
  .cs-note{margin-left:auto;margin-right:auto;max-width:none;text-align:center}

  /* --- what.html: image where the demo module used to sit ----------------- */
  .whatshot-media{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);
    box-shadow:var(--shadow-sm);line-height:0;background:var(--bone)}
  .whatshot-media img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}

  /* --- form field help text ---------------------------------------------- */
  .fld-hint{display:block;font-size:.78rem;color:var(--ink-soft);margin-top:5px;line-height:1.45}
  .cf-row .fld-hint,.field .fld-hint{margin-top:6px}

  /* --- index hero: media above the audit box (v3.5.6) --------------------- */
  .heromods{max-width:440px}
  .hero-media{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);
    box-shadow:var(--shadow-md);line-height:0;background:var(--bone)}
  .hero-media img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
  @media(max-width:900px){.heromods{max-width:100%}}

  /* --- photo-figure caption reads as a pull quote, not a footnote --------- */
  .photo-figure:not(.center){grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
  .photo-figure:not(.center) figcaption{flex-direction:column;justify-content:center;
    align-items:flex-start;gap:14px;font-family:'Fraunces',serif;font-size:1.12rem;
    line-height:1.5;padding:26px 30px}
  .photo-figure:not(.center) figcaption::before{content:"";display:block;width:46px;height:3px;
    border-radius:2px;background:var(--teal-bright);flex:none}
  @media(max-width:820px){
    .photo-figure:not(.center) figcaption{font-family:'Archivo',sans-serif;font-size:.85rem;
      flex-direction:row;padding:13px 18px 15px}
    .photo-figure:not(.center) figcaption::before{display:none}
  }

  /* --- booking flow: keep anchored scrolls clear of the sticky nav -------- */
  #book-now,#slotwrap,#form-live{scroll-margin-top:96px}
  @media(max-width:780px){#book-now,#slotwrap,#form-live{scroll-margin-top:76px}}

  /* --- reserve.html: tighter vertical rhythm (v3.5.7) --------------------- */
  .page-top.book{padding-top:76px}
  .page-top.book .sec-head{margin-bottom:26px}
  .page-top.book .bookgrid{margin-top:0}
  .page-top.book .answer-first{margin:34px 0 0}
  #how .sec-head{margin-bottom:30px}
  #how .steps7{margin-bottom:26px}
  #how .photo-band{margin-top:24px}
  @media(max-width:780px){.page-top.book{padding-top:56px}}

  /* ==========================================================================
     v3.5.8 — MOBILE FIRST
     Audited at 390px. No horizontal scroll anywhere, so this is about the two
     things the audit did surface: type that had drifted below a comfortable
     floor, and a calendar whose day cells were smaller than a thumb.
     The buyer here sells eyewear for a living. Small type is the wrong look.
     ========================================================================== */
  @media(max-width:780px){

    /* --- readable floor. Nothing that carries meaning below 13px. --------- */
    .audit-mini,.formnote,.cf-fine,.fbar-c,.fld-hint,.lbl-note,
    .bf-sub,.cf-sub,.calsub,.slot-sub,.cs-note,.bs-note,.seats,
    .disc-gist,.footlegal p,.cc-note{font-size:.83rem;line-height:1.6}
    .field label,.cf-row label,.bf-consent,.cf-consent{font-size:.9rem}
    .af-facts li{font-size:.85rem}
    .fn-head{font-size:.76rem}
    .eyebrow,.af-tag,.qtag,.mc-eyebrow,.plabel,.sub,.rk,.who,
    .ev-hipaa-tag,.cs-chip{font-size:.74rem}
    .vstamp{font-size:.7rem}
    .topbar{font-size:.8rem}

    /* --- top bar: one line, phone only. The CTA already lives in the ------
       sticky bar at the bottom of the screen, so repeating it here just
       pushed the headline down. */
    .tb-lead{display:none}
    .tb-cta{display:none}
    .topbar-in{padding:7px 16px}

    /* --- calendar: bigger day cells ------------------------------------- */
    .calcard{padding:18px 14px}
    .cal,.dow{gap:5px}
    .day{border-radius:10px;font-size:1rem}
    .calhead{flex-wrap:wrap;gap:8px;margin-bottom:10px}
    .calhead h2,.calhead h3{font-size:1.08rem;white-space:nowrap}
    .cal-nav{width:38px;height:38px;font-size:1.2rem}
    .cal-badge{font-size:.74rem;padding:5px 11px}
    .slot{min-height:52px;font-size:.9rem}
  }

  /* Day cells are the primary control on the booking page — give them a real
     target on the narrowest phones rather than letting the grid shrink them. */
  @media(max-width:420px){
    .calcard{padding:16px 10px}
    .cal,.dow{gap:4px}
  }

  /* Micro-labels: several carried their own smaller size that beat the block
     above on specificity. Named explicitly so the 12px floor actually holds. */
  @media(max-width:780px){
    .final.closer .eyebrow,.map-card .mc-eyebrow,.qtag,.af-tag,
    .ev-hipaa-tag,.cmp-badge,.st .stn,.pagenav a small,
    .scanrow small,.stat cite,.band cite,.dow span{font-size:.75rem}
    .mobile-cta .mc-price{font-size:.86rem}
    .mobile-cta .mc-price small{font-size:.75rem}
    .logo-text small{font-size:.66rem;letter-spacing:.1em}
    .vstamp{font-size:.72rem}
  }

/* ---- pitch band (v3.8.2): the one-line positioning statement ---- */
.pitchband{background:linear-gradient(135deg,var(--navy) 0%,var(--teal) 100%);color:#fff;padding:44px 0;text-align:center}
.pitchband .pb-lead{font-family:'Archivo',sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:#9fd0f2;margin:0 0 14px}
.pitchband .pb-line{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(1.5rem,4.2vw,2.5rem);line-height:1.2;margin:0 auto;max-width:20ch}
.pitchband .pb-line span{display:inline-block}
.pitchband .pb-line span:nth-child(2){color:#7cc7ef}
.pitchband .pb-sub{font-size:1rem;color:#cfe3f5;line-height:1.6;max-width:56ch;margin:16px auto 0}
@media(max-width:560px){.pitchband{padding:34px 0}.pitchband .pb-line{max-width:16ch}}

/* --- v3.9.3: beside-caption photo figures stack on small screens --------- */
@media(max-width:820px){
  .photo-figure:not(.center){grid-template-columns:1fr}
  .photo-figure:not(.center) img{aspect-ratio:16/10;height:auto}
  .photo-figure:not(.center) figcaption{flex-direction:row;align-items:center;
    border-left:0;border-top:1px solid var(--line);font-family:'Archivo',sans-serif;
    font-size:.85rem;line-height:1.5;padding:13px 18px 15px;color:var(--ink-soft)}
  .photo-figure:not(.center) figcaption::before{display:none}
}

/* --- v3.9.4: images sit beside the section copy, not on their own --------- */
.info-media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:44px;align-items:center;margin:0 0 40px}
.info-media .sec-head,.info-media .sec-head.center{text-align:left;margin:0;max-width:none}
.info-media .sec-head h2{margin-left:0;margin-right:0;max-width:20ch}
.info-media .sec-head p{margin-left:0;margin-right:0;max-width:46ch}
.info-media .im-fig{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);
  box-shadow:var(--shadow-sm);background:var(--bone)}
.info-media .im-fig img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.info-media .im-fig figcaption{font-size:.85rem;color:var(--ink-soft);line-height:1.5;
  padding:13px 18px 15px;background:#fff;border-top:1px solid var(--line)}
@media(max-width:900px){
  .info-media{grid-template-columns:1fr;gap:24px;margin-bottom:30px}
  .info-media .sec-head h2,.info-media .sec-head p{max-width:none}
  .info-media .im-fig img{aspect-ratio:16/10}
}

/* ============ Section 44 tax-credit band (v3.11.0) ============ */
.rcard .rlist{list-style:none;margin:0 0 18px;padding:0}
.rcard .rlist li{position:relative;padding:9px 0 9px 22px;border-top:1px solid var(--line);font-size:.94rem;color:var(--ink-soft);line-height:1.5}
.rcard .rlist li:first-child{border-top:none}
.rcard .rlist li::before{content:"";position:absolute;left:2px;top:17px;width:7px;height:7px;border-radius:50%;background:var(--teal-bright)}
.rcard .rlist li b{color:var(--ink);font-weight:700}
.rcard p.tc-math,.ev-col p.tc-math{font-family:'Fraunces',serif;font-size:1.28rem;line-height:1.35;color:var(--ink);background:var(--bone);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:18px}
.rcard p.tc-math b,.ev-col p.tc-math b{color:var(--amber-ink)}
@media(max-width:560px){.rcard p.tc-math,.ev-col p.tc-math{font-size:1.08rem;padding:14px 15px}}