/* Andy AI — shared site stylesheet.
   Single source of truth for brand tokens, typography, header/nav, footer,
   buttons, sections and the How Andy Works module.
   Edit here, not in per-page <style> blocks. Bump ASSET_VER in build.js
   after editing so the immutable cache picks up the change. */

:root{
    --paper:#ffffff;--cream:#FBFFFD;--ink:#111e29;--body:#111111;--slate:#545963;--slate-2:#8a929e;
    --blue:#0f80fb;--blue-deep:#0a63d6;--mint:#4ce0b5;--mint-soft:#def7f0;--green:#24b26b;--amber:#f5b301;
    --clin:#e9f1fd;--pat:#f1efe9;--hair:#e9e7e0;--hair-2:#eceef1;
    --r-card:18px;--r-ctrl:12px;--r-pill:999px;
    --serif:"Newsreader",Georgia,"Times New Roman",serif;
    --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    --mono:ui-monospace,"SF Mono","Menlo","JetBrains Mono",monospace;
    --shadow:0 1px 2px rgba(17,30,41,.05),0 10px 30px rgba(17,30,41,.07);
    --grad:linear-gradient(120deg,var(--blue),var(--blue-deep));
  }

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{margin:0;background:var(--paper);color:var(--body);font-family:var(--sans);line-height:1.55;
    -webkit-font-smoothing:antialiased}

.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

.narrow{max-width:760px;margin:0 auto}

h1,h2,h3{margin:0}

h1 em,h2 em{font-style:italic;color:var(--blue)}

section{padding:clamp(60px,8vw,110px) 0}

.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;
    letter-spacing:.14em;text-transform:uppercase;color:#2a2f37;margin:0 0 16px}

.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mint)}

.h1{font-family:var(--serif);font-weight:500;font-size:clamp(33px,5.2vw,58px);line-height:1.08;
    letter-spacing:-.015em;color:var(--ink)}

.h2{font-family:var(--serif);font-weight:500;font-size:clamp(27px,3.6vw,42px);line-height:1.12;
    letter-spacing:-.01em;color:var(--ink)}

.lead{font-size:clamp(15px,1.6vw,18px);color:var(--body)}

.btn{display:inline-flex;align-items:center;gap:8px;background:var(--grad);color:#fff;border:0;
    font:inherit;font-weight:600;font-size:15px;padding:14px 24px;border-radius:var(--r-pill);
    cursor:pointer;text-decoration:none;transition:filter .18s ease}

.btn:hover{filter:brightness(1.06)}

.btn svg{width:16px;height:16px}

a{color:var(--blue)}

/* header */
  .site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.85);backdrop-filter:blur(10px);
    border-bottom:1px solid var(--hair-2)}

.nav{display:flex;align-items:center;gap:24px;height:64px}

.logo{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:20px;color:var(--ink);
    text-decoration:none;letter-spacing:-.01em}

.logo-mark{width:45px;height:45px;border-radius:50%;background:var(--mint-soft);flex:none;display:block}

.nav-links{display:flex;gap:22px;margin-left:14px}

.nav-links a{color:var(--ink);text-decoration:none;font-size:14.5px;font-weight:500}

.nav-links a:hover{color:var(--blue)}

.nav .btn{margin-left:auto;padding:9px 18px;font-size:14px}

/* hero */
  .hero{position:relative;text-align:center;overflow:hidden;
    background:radial-gradient(120% 120% at 80% 120%,rgba(71,163,255,.35) 0%,#edf5ff 34%,#FBFFFD 66%)}

.badge{display:inline-flex;align-items:center;gap:8px;background:var(--paper);border:1px solid var(--hair-2);
    border-radius:var(--r-pill);padding:8px 16px;font-size:13.5px;font-weight:500;color:var(--ink);
    box-shadow:0 1px 2px rgba(17,30,41,.05);margin-bottom:26px}

.badge::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mint)}

.hero .h1{max-width:16ch;margin:0 auto 18px}

.hero .lead{max-width:56ch;margin:0 auto 30px;color:var(--slate)}

.hero-phone{margin:52px auto 0;width:300px;max-width:100%}

/* EMR band */
  .band{background:var(--ink);color:#fff;text-align:center;padding:22px 0}

.band span{font-size:13.5px;font-weight:600;letter-spacing:.14em;opacity:.92}

/* generic section bg */
  .sec-cream{background:var(--cream)}

.sec-white{background:var(--paper)}

/* value triad */
  .triad{text-align:center}

.triad .h2{margin:14px auto 22px;max-width:20ch}

.triad p{color:var(--body);margin:0 auto 16px;max-width:60ch}

.triad .chiprow{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}

/* dual promise */
  .promise-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center}

.promise-media img{display:block;width:100%;height:auto;border-radius:var(--r-card);border:1px solid var(--hair-2)}

.promise .h2{margin:0 0 20px;max-width:22ch;line-height:1.14}

.promise p{color:var(--body);margin:0;max-width:52ch}

/* benefit grid */
  .bhead{max-width:60ch}

.bhead .h2{margin:14px 0 14px}

.bhead p{color:var(--body);margin:0 0 44px}

.bgrid{display:grid;grid-template-columns:1fr 1fr;gap:28px}

.bcard{background:var(--paper);border:1px solid var(--hair-2);border-radius:var(--r-card);
    padding:30px;box-shadow:var(--shadow)}

.sec-white .bcard{background:#F4F9FF;border-color:#dce9fb}

.bcard-head{display:flex;align-items:center;gap:18px;margin-bottom:18px}

.tile{width:58px;height:58px;border-radius:14px;background:var(--mint-soft);color:var(--ink);
    display:flex;align-items:center;justify-content:center;flex:none}

.tile svg{width:30px;height:30px}

.bcard h3{font-size:18px;font-weight:600;color:var(--ink);line-height:1.3}

.bcard h3 span{display:block;font-weight:400;color:var(--slate);font-size:14.5px;margin-top:3px}

.bcard p{margin:0;font-size:14.5px;color:var(--body)}

/* testimonials */
  .thead{text-align:center;margin-bottom:44px}

.tcarousel{position:relative}

/* Scroll snapping is applied by assets/nav.js one frame after paint, via .snap.
   A scroll-snap container present at first paint stops Chrome recording Largest
   Contentful Paint for the whole document — that is what made PageSpeed report
   NO_LCP. Do not move scroll-snap-type back onto the base .ttrack rule.
   Snapping matters below 860px, where cards are 86% wide and the arrows would
   otherwise drift and leave cards part-cut. */
.ttrack{display:flex;gap:24px;overflow-x:auto;scroll-behavior:smooth;
    padding:6px 2px 10px;scrollbar-width:none}

.ttrack.snap{scroll-snap-type:x mandatory}

.ttrack::-webkit-scrollbar{display:none}

.tcard{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;background:var(--paper);
    border:1px solid var(--hair-2);border-radius:var(--r-card);padding:32px;box-shadow:var(--shadow);
    display:flex;flex-direction:column;min-height:236px}

.tcard q{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.42;color:var(--ink);
    quotes:none;flex:1}

.tcard q::before,.tcard q::after{content:""}

.tcard .who{display:flex;align-items:center;gap:12px;margin-top:26px}

.tcard .ava{width:42px;height:42px;border-radius:50%;background:var(--mint-soft);color:#12876a;
    font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center;flex:none}

.tcard .who-t b{display:block;font-size:14px;color:var(--ink);font-weight:600}

.tcard .who-t span{font-size:13px;color:var(--slate)}

.tnav{display:flex;gap:10px;justify-content:center;margin-top:28px}

.tnav-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--hair);background:var(--paper);
    color:var(--ink);font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;
    justify-content:center;transition:all .18s ease}

.tnav-btn:hover{border-color:var(--blue);color:var(--blue)}

.tnav-btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* CTA */
  .cta{background:linear-gradient(180deg,#eaf3fd,#f3f8fe);text-align:center}

.cta .h2{max-width:22ch;margin:0 auto 16px}

.cta p{max-width:52ch;margin:0 auto 28px;color:var(--body)}

/* FAQ */
  .faqwrap{max-width:820px;margin:0 auto;padding:0 24px}

.faqhead{text-align:center;margin-bottom:36px}

.faq-item{border-bottom:1px solid var(--hair)}

.faq-q{width:100%;text-align:left;background:transparent;border:0;font:inherit;cursor:pointer;
    display:flex;align-items:center;gap:16px;padding:22px 4px;color:var(--ink);font-size:17px;font-weight:500}

.faq-q:hover{color:var(--blue)}

.faq-q:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:6px}

.faq-ic{margin-left:auto;flex:none;width:22px;height:22px;display:flex;align-items:center;justify-content:center;
    color:var(--slate-2);transition:transform .22s ease}

.faq-q[aria-expanded="true"] .faq-ic{transform:rotate(45deg);color:var(--blue)}

.faq-a{max-height:0;overflow:hidden;transition:max-height .28s ease}

.faq-a p{margin:0;padding:0 4px 24px;color:var(--body);font-size:15.5px;max-width:70ch}

/* footer */
  .site-footer{background:var(--ink);color:#cfd6de;padding:56px 0 40px}

.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:24px;font-size:13.5px;line-height:1.7}

.footer-grid .logo-f{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:20px;color:#fff}

.footer-grid p{margin:10px 0 0;max-width:34ch;color:#9aa4af}

.footer-grid a{color:#cfd6de;text-decoration:none}

.footer-grid a:hover{color:#fff}

/* ===== module (reused, branded) ===== */
  .module .eyebrow{margin-bottom:16px}

.mod-title{font-family:var(--serif);font-weight:500;font-size:clamp(27px,3.6vw,42px);line-height:1.14;
    letter-spacing:-.01em;margin:0 0 14px;max-width:34ch;color:var(--ink)}

.mod-title em{font-style:italic;color:var(--blue)}

.mod-sub{font-size:clamp(15px,1.6vw,18px);color:var(--body);margin:0 0 34px;max-width:64ch}

.mod-body{display:grid;grid-template-columns:0.9fr 1.1fr;gap:clamp(24px,4vw,52px);align-items:start}

.media{position:sticky;top:88px;display:flex;justify-content:center}

.device{width:300px;max-width:100%;position:relative;border-radius:52px;padding:12px;background:linear-gradient(150deg,#d9dde2 0%,#a9b0b8 22%,#71787f 50%,#a9b0b8 78%,#c9ced4 100%);box-shadow:0 1px 1px rgba(255,255,255,.6) inset,0 0 0 1px rgba(17,30,41,.10),0 2px 4px rgba(17,30,41,.06),0 22px 50px rgba(17,30,41,.16)}

.device::before{content:"";position:absolute;inset:6px;border-radius:46px;background:#0b0e12;z-index:0}

.device::after{content:"";position:absolute;right:-2px;top:150px;width:3px;height:64px;border-radius:2px;background:linear-gradient(90deg,#8b9299,#c3c8ce);box-shadow:0 1px 2px rgba(0,0,0,.25)}

.vbtn{position:absolute;left:-2px;width:3px;border-radius:2px;background:linear-gradient(90deg,#c3c8ce,#8b9299);box-shadow:0 1px 2px rgba(0,0,0,.25);z-index:4}

.island{position:absolute;top:24px;left:50%;transform:translateX(-50%);width:66px;height:20px;background:#05070a;border-radius:999px;z-index:3;box-shadow:0 0 0 1px rgba(0,0,0,.4)}

.island::after{content:"";position:absolute;right:9px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2a3340,#05070a 70%)}

.screen{position:relative;z-index:1;background:var(--paper);border-radius:42px;overflow:hidden;aspect-ratio:1/2.16;display:flex;flex-direction:column}

.scr-fade{animation:fade .3s ease}

@keyframes fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

.statusbar{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 8px;font-size:12px;font-weight:600;color:var(--ink)}

.scr-in{padding:8px 18px 18px;flex:1;overflow:hidden}

.chat-head{display:flex;align-items:center;gap:10px;padding:6px 0 14px;border-bottom:1px solid var(--hair-2);margin-bottom:14px}

.chat-av{width:34px;height:34px;border-radius:50%;background:var(--mint-soft);color:var(--ink);display:flex;align-items:center;justify-content:center;flex:none}

.chat-head b{font-size:14px;display:block;color:var(--ink)}

.chat-head span{font-size:12px;color:var(--slate-2)}

.bub{border-radius:14px;padding:9px 12px;margin-bottom:9px;max-width:86%;font-size:12.5px;line-height:1.45;color:var(--ink)}

.bub b{display:block;font-size:9.5px;letter-spacing:.06em;font-weight:600;color:var(--slate-2);margin-bottom:2px}

.bub.clin{background:var(--clin)}

.bub.pat{background:var(--pat);margin-left:auto}

.scr-h{display:flex;justify-content:space-between;align-items:baseline;padding:4px 2px 12px}

.scr-h b{font-size:14px;font-weight:600;color:var(--ink)}

.scr-h span{font-family:var(--mono);font-size:11px;color:var(--slate-2)}

.lrow{display:flex;align-items:center;gap:10px;padding:11px 2px;border-bottom:1px solid var(--hair-2);font-size:13px;color:var(--ink)}

.lrow:last-child{border-bottom:0}

.ck{flex:none;display:flex;color:var(--green)}

.ck.prog{color:var(--amber)}

.scr-title{font-size:15px;font-weight:600;padding:4px 2px 12px;color:var(--ink)}

.shield-note{display:flex;align-items:center;gap:8px;background:var(--mint-soft);color:#0f7d5f;border-radius:10px;padding:9px 11px;font-size:12px;font-weight:500;margin-bottom:14px}

.approve{margin-top:14px;background:var(--grad);color:#fff;border:0;border-radius:var(--r-pill);padding:12px;font:inherit;font-weight:600;font-size:13.5px;width:100%;display:flex;align-items:center;justify-content:center;gap:6px}

.sync-mid{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:20px}

.sync-badge{width:60px;height:60px;border-radius:50%;background:var(--mint-soft);color:var(--green);display:flex;align-items:center;justify-content:center}

.sync-mid b{font-size:15px;color:var(--ink)}

.sync-mid p{margin:0;font-size:13px;color:var(--slate)}

.rail{list-style:none;margin:0;padding:0;position:relative}

.rail::before{content:"";position:absolute;left:15px;top:24px;bottom:24px;width:2px;background:var(--hair)}

.rail-fill{position:absolute;left:15px;top:24px;width:2px;background:var(--mint);height:0;transition:height .32s ease}

.step{position:relative;display:block;width:100%;text-align:left;border:0;background:transparent;font:inherit;cursor:pointer;padding:13px 10px 13px 46px;border-radius:12px;transition:background .18s ease}

.step:hover{background:rgba(255,255,255,.6)}

.step:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

.step .dot{position:absolute;left:8px;top:15px;width:16px;height:16px;border-radius:50%;background:var(--cream);border:2px solid #cfcabc;transition:all .2s ease}

.step[aria-selected="true"] .dot{border-color:var(--mint);background:var(--mint);box-shadow:0 0 0 4px var(--mint-soft)}

.step .lbl{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-2);margin-right:12px}

.step .ttl{font-size:16px;font-weight:500;color:var(--slate)}

.step[aria-selected="true"] .ttl{color:var(--ink)}

.step .shield{display:none;align-items:center;gap:5px;margin-left:10px;font-size:11.5px;color:#0f9c76;font-weight:600}

.step[data-compliance="true"] .shield{display:inline-flex}

.detail{margin-top:20px;padding:22px 24px;background:var(--paper);border:1px solid var(--hair-2);border-radius:var(--r-card);box-shadow:var(--shadow)}

.detail p{margin:0 0 16px;font-size:16px;line-height:1.55;color:var(--body)}

.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}

.chip{display:inline-flex;align-items:center;gap:6px;background:var(--cream);border:1px solid var(--hair);border-radius:var(--r-pill);padding:7px 13px;font-size:12.5px;color:var(--slate);font-weight:500}

.sec-white .chip{background:var(--paper)}

.chip svg{color:var(--mint);flex:none}

.proof{display:flex;align-items:center;gap:12px;margin-top:34px;padding-top:24px;border-top:1px solid var(--hair)}

.proof .spark{color:var(--mint);flex:none;display:flex}

.proof .k{font-size:clamp(17px,2vw,21px);font-weight:600;letter-spacing:-.01em;color:var(--ink)}

@media (max-width:860px){
    .nav-links{display:none}
    .promise-grid{grid-template-columns:1fr;gap:32px}
    .promise-copy{text-align:center}
    .promise-copy .h2{margin:0 auto 20px}
    .promise-copy p{margin:0 auto}
    .bgrid{grid-template-columns:1fr}
    .tcard{flex:0 0 86%}
    .footer-grid{grid-template-columns:1fr;gap:24px}
    .mod-body{grid-template-columns:1fr;gap:26px}
    .media{position:static;order:-1}
    .step:hover{background:transparent}
  }

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}

/* nav dropdowns */
  .navdd{position:relative;display:flex;align-items:center}

.navdd-top{display:inline-flex;align-items:center;gap:5px;background:transparent;border:0;font:inherit;
    cursor:pointer;color:var(--ink);font-size:14.5px;font-weight:500;padding:0;transition:color .18s ease}

.navdd-top .chev{width:11px;height:11px;flex:none;color:var(--slate-2);transition:transform .22s ease,color .18s ease}

.navdd-top:hover,.navdd:focus-within .navdd-top{color:var(--blue)}

.navdd:hover .chev,.navdd:focus-within .chev{transform:rotate(180deg);color:var(--blue)}

.navdd-top.active{color:var(--blue)}

.navdd-menu{position:absolute;top:calc(100% + 18px);left:50%;background:var(--paper);
    border:1px solid var(--hair-2);border-radius:16px;padding:12px;min-width:244px;
    display:flex;flex-direction:column;gap:2px;z-index:30;
    box-shadow:0 6px 16px rgba(17,30,41,.06),0 24px 60px rgba(17,30,41,.14);
    opacity:0;visibility:hidden;transform:translate(-50%,10px);
    transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s}

.navdd:hover .navdd-menu,.navdd:focus-within .navdd-menu{opacity:1;visibility:visible;
    transform:translate(-50%,0);transition:opacity .22s ease,transform .22s ease,visibility 0s}

.navdd-menu::after{content:"";position:absolute;top:-20px;left:0;right:0;height:20px}

.navdd-menu::before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%) rotate(45deg);
    width:11px;height:11px;background:var(--paper);border-left:1px solid var(--hair-2);border-top:1px solid var(--hair-2)}

.navdd-menu a{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:9px;font-size:14px;
    white-space:nowrap;color:var(--ink);transition:background .15s ease,color .15s ease}

.navdd-menu a::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mint);flex:none;
    opacity:0;transform:scale(.4);transition:opacity .18s ease,transform .18s ease}

.navdd-menu a:hover{background:var(--cream);color:var(--blue)}

.navdd-menu a:hover::before{opacity:1;transform:scale(1)}

.nav-links>a{position:relative}

.nav-links>a::after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:2px;
    background:var(--blue);border-radius:2px;transition:right .22s ease}

.nav-links>a:hover::after,.nav-links>a.active::after{right:0}

.nav-links>a.active{color:var(--blue)}

.site-header{transition:box-shadow .25s ease}

.site-header.scrolled{box-shadow:0 1px 0 var(--hair-2),0 10px 28px rgba(17,30,41,.07)}

/* footer sitemap */
  .footer-grid b{display:block;color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.03em;margin-bottom:12px}

.footer-grid .fcol a{display:block;margin-bottom:8px}

/* mobile nav */
  .nav-toggle{display:none;background:transparent;border:0;cursor:pointer;
    padding:0;margin-left:4px;width:40px;height:40px;flex-direction:column;
    align-items:center;justify-content:center;gap:5px;border-radius:10px}

.nav-toggle:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

.nt-bar{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;
    transition:transform .28s cubic-bezier(.4,0,.2,1),opacity .2s ease}

.nav-toggle.open .nt-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}

.nav-toggle.open .nt-bar:nth-child(2){opacity:0;transform:scaleX(.4)}

.nav-toggle.open .nt-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:860px){
    .nav-toggle{display:flex}
    .nav-links{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;
      border-bottom:1px solid var(--hair-2);box-shadow:0 24px 48px rgba(17,30,41,.12);flex-direction:column;
      align-items:flex-start;gap:0;margin-left:0;padding:10px 24px 22px;
      max-height:calc(100vh - 64px);overflow-y:auto}
    .nav-links.open{display:flex;animation:navdrop .28s ease}
    .nav-links.open>*{animation:navitem .34s ease backwards}
    .nav-links.open>*:nth-child(1){animation-delay:.04s}
    .nav-links.open>*:nth-child(2){animation-delay:.09s}
    .nav-links.open>*:nth-child(3){animation-delay:.14s}
    .nav-links.open>*:nth-child(4){animation-delay:.18s}
    .nav-links>*+*{border-top:1px solid var(--hair-2)}
    .nav-links > a{padding:14px 0;width:100%;font-size:15.5px;font-weight:600}
    .nav-links>a::after{display:none}
    .navdd{flex-direction:column;align-items:flex-start;width:100%;padding:6px 0 2px}
    .navdd-top{padding:10px 0 6px;width:100%;text-align:left;font-size:12px;font-weight:600;
      letter-spacing:.12em;text-transform:uppercase;color:var(--slate);gap:8px}
    .navdd-top::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint);flex:none}
    .navdd-top .chev{display:none}
    .navdd-menu{position:static;opacity:1;visibility:visible;transform:none;transition:none;
      margin:0 0 8px;border:0;box-shadow:none;padding:0 0 0 15px;min-width:0;background:transparent;border-radius:0}
    .navdd-menu::before,.navdd-menu::after{display:none}
    .navdd-menu a{padding:10px 0 10px 12px;font-size:15px;border-radius:8px}
  }

@keyframes navdrop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

@keyframes navitem{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}

/* How Andy Works — scroll story (mobile only), module-scoped */
  @media (max-width:860px){
    .has-scrollstory .story-track{height:380vh}
    .has-scrollstory .story-pin{position:sticky;top:0;min-height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:14px 0 18px}
    .has-scrollstory .module{padding:0}
    .has-scrollstory .module .eyebrow{margin-bottom:8px}
    .has-scrollstory .mod-title{font-size:clamp(27px,3.6vw,42px);max-width:none;margin-bottom:6px}
    .has-scrollstory .mod-sub{display:none}
    .has-scrollstory .mod-body{gap:12px}
    .has-scrollstory .module .device{width:212px;border-radius:38px;padding:9px;margin:0 auto}
    .has-scrollstory .module .device::before{inset:5px;border-radius:33px}
    .has-scrollstory .module .screen{border-radius:30px;aspect-ratio:1/2;height:auto}
    .has-scrollstory .module .island{top:16px;width:48px;height:14px}
    .has-scrollstory .module .statusbar{padding:13px 17px 4px;font-size:10px}
    .has-scrollstory .rail{display:flex;justify-content:center;gap:6px;margin-top:12px;flex-wrap:wrap}
    .has-scrollstory .rail::before, .has-scrollstory .rail-fill{display:none}
    .has-scrollstory .rail li{flex:0 1 auto}
    .has-scrollstory .step{padding:7px 11px;border:1px solid var(--hair);border-radius:999px;background:var(--paper);width:auto}
    .has-scrollstory .step .dot, .has-scrollstory .step .ttl{display:none}
    .has-scrollstory .step .shield{display:none!important}
    .has-scrollstory .step .lbl{margin:0;font-size:10.5px;color:var(--slate)}
    .has-scrollstory .step[aria-selected="true"]{background:var(--ink);border-color:var(--ink)}
    .has-scrollstory .step[aria-selected="true"] .lbl{color:#fff}
    .has-scrollstory .detail{margin-top:10px;min-height:132px;padding:14px 16px}
    .has-scrollstory .detail p{font-size:13.5px;margin-bottom:10px}
    .has-scrollstory .detail .d-title{display:block;font-weight:600;color:var(--ink);font-size:14.5px;margin:0 0 5px}
    .has-scrollstory .chip{padding:5px 10px;font-size:11.5px}
    .has-scrollstory .module .proof{display:none}
    .has-scrollstory .scroll-cue{display:block;text-align:center;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-2);margin-top:10px}
  }

@media (min-width:861px){ .story-track{height:auto} .story-pin{position:static} .scroll-cue{display:none} }