/* ============================================================
   Reva - Editorial Science design system (shared across all pages)
   Warm neutral palette · Archivo / Newsreader / JetBrains Mono
   Accessibility: marks are shape + word + source, never colour alone.
   ============================================================ */
:root{
  --paper:#F4EFE4; --paper-2:#EBE3D3; --paper-3:#E2D9C6; --card:#FBF8F0;
  --ink:#1A1611; --ink-2:#494234; --ink-3:#6B6353;
  --line:#DCD3C0; --line-2:#CBC1AC;
  --clear:#1A1611; --watch:#B07D22; --unknown:#7F7767; --amber:#B07D22; --amber-deep:#8A6119; --green:#3F6034;
  --fd:"Archivo",system-ui,sans-serif; --fe:"Newsreader",Georgia,serif; --fm:"JetBrains Mono",ui-monospace,monospace;
  --ease:cubic-bezier(.22,1,.36,1); --spring:cubic-bezier(.34,1.4,.5,1); --wrap:1220px;
}
*{box-sizing:border-box;}
h1,h2,h3,h4,h5,p,figure,blockquote,ul{margin:0;}
ul{padding:0;list-style:none;}
html{scroll-behavior:smooth;scroll-padding-top:80px;}
body{margin:0;font-family:var(--fd);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-width:100%;display:block;}
a{color:inherit;}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.04;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 30px;}
.wrap--narrow{max-width:880px;}
.sec{position:relative;z-index:2;padding:96px 0;}
.sec--sm{padding:64px 0;}
.p1{background:var(--paper);}.p2{background:var(--paper-2);}.p3{background:var(--paper-3);}
.dark{background:var(--ink);color:var(--paper);}
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.split>*{min-width:0;}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:36px;}}

.kick{font-family:var(--fm);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);display:inline-flex;align-items:center;gap:10px;}
.kick::before{content:"";width:26px;height:1px;background:var(--ink-3);}
.dark .kick{color:rgba(244,239,228,.55);}.dark .kick::before{background:rgba(244,239,228,.5);}
.display{font-family:var(--fd);font-weight:800;font-size:clamp(2.8rem,7.5vw,6rem);line-height:.94;letter-spacing:-.035em;}
.h1{font-family:var(--fd);font-weight:800;font-size:clamp(2.1rem,4.6vw,3.7rem);line-height:1;letter-spacing:-.03em;}
.h2{font-family:var(--fd);font-weight:700;font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.05;letter-spacing:-.02em;}
em.ed{font-family:var(--fe);font-style:italic;font-weight:400;letter-spacing:-.01em;}
.lead{font-size:clamp(1.05rem,1.4vw,1.24rem);line-height:1.55;color:var(--ink-2);max-width:54ch;}
.dark .lead{color:rgba(244,239,228,.82);}
.body{font-size:1.04rem;line-height:1.6;color:var(--ink-2);max-width:62ch;}
.dark .body{color:rgba(244,239,228,.78);}
.hw>*+*{margin-top:18px;}

.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--fm);font-size:.78rem;font-weight:700;letter-spacing:.02em;padding:14px 22px;border-radius:0;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;text-decoration:none;transition:transform .15s var(--ease),background .2s,color .2s;}
.btn:active{transform:translateY(1px);}
.btn:hover{background:transparent;color:var(--ink);}
.btn--ghost{background:transparent;color:var(--ink);}
.btn--ghost:hover{background:var(--ink);color:var(--paper);}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px;}
.dark .btn{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.dark .btn:hover{background:transparent;color:var(--paper);}
.ctarow{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}

/* app-store buttons */
.store{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:var(--paper);border:1.5px solid var(--ink);padding:9px 16px;text-decoration:none;transition:background .2s,color .2s;}
.store:hover{background:transparent;color:var(--ink);}
.dark .store{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.store b{font-family:var(--fd);font-weight:700;font-size:.92rem;line-height:1;display:block;}
.store span{font-family:var(--fm);font-size:.56rem;letter-spacing:.06em;text-transform:uppercase;opacity:.7;display:block;margin-bottom:2px;}

/* nav */
.nav{position:sticky;top:0;z-index:40;background:rgba(244,239,228,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 30px;max-width:1360px;margin:0 auto;}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--fd);font-weight:800;font-size:1.35rem;letter-spacing:-.03em;text-decoration:none;color:var(--ink);}
/* the mark resolves into focus on load (the reveal) */
@keyframes markResolve{from{filter:blur(3px);opacity:0;transform:translateX(-5px) scale(1.05);}to{filter:blur(0);opacity:1;transform:none;}}
.brand svg{animation:markResolve .85s cubic-bezier(.22,1,.36,1) both;}
.brand svg circle:last-child{transform-box:fill-box;transform-origin:center;animation:amberPop .7s cubic-bezier(.34,1.42,.5,1) .5s both;}
@keyframes amberPop{0%{transform:scale(.2);}60%{transform:scale(1.15);}100%{transform:scale(1);}}
.nav__links{display:flex;align-items:center;gap:30px;}
.nav__links a{font-family:var(--fm);font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;text-decoration:none;color:var(--ink-2);transition:color .2s;}
.nav__links a:hover,.nav__links a:focus-visible,.nav__links a[aria-current]{color:var(--ink);}
.nav__actions{display:flex;align-items:center;gap:12px;flex:none;}
.nav__cta{padding:10px 18px !important;color:var(--paper) !important;}
.nav__cta:hover,.nav__cta:focus-visible{color:var(--ink) !important;}
.nav__burger{display:none;align-items:center;justify-content:center;background:none;border:1px solid var(--line-2);cursor:pointer;padding:9px;color:var(--ink);inline-size:44px;block-size:44px;flex:none;touch-action:manipulation;}
.nav__burger svg{display:block;transition:transform .2s var(--ease);}
.nav.open .nav__burger{background:var(--ink);color:var(--paper);border-color:var(--ink);}
@media(max-width:860px){
  .nav__burger{display:inline-flex;}
  .nav__links{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:4px 0;box-shadow:0 24px 44px -24px rgba(26,22,17,.4);display:none;}
  .nav.open .nav__links{display:flex;}
  .nav__links a{display:block;padding:15px 30px;border-bottom:1px solid var(--line);font-size:.9rem;color:var(--ink);}
  .nav__links a:last-child{border-bottom:none;}
  .nav__links a[aria-current]{border-left:3px solid var(--ink);padding-left:27px;}
}

/* reader */
.reader{display:flex;border:1.5px solid var(--ink);background:var(--card);max-width:500px;}
.reader input{flex:1;background:none;border:none;color:var(--ink);font-family:var(--fm);font-size:.86rem;padding:15px 16px;outline:none;min-width:0;}
.reader input::placeholder{color:var(--ink-3);}
.reader button{border:none;border-left:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--fm);font-weight:700;font-size:.78rem;padding:0 22px;cursor:pointer;transition:background .2s,color .2s;}
.reader button:hover{background:var(--paper);color:var(--ink);}
.reader:focus-within{box-shadow:0 0 0 3px rgba(26,22,17,.12);}

/* sourced-from strip */
.sourced{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap;margin-top:38px;padding-top:26px;border-top:1px solid var(--line);}
.sourced__l{flex-basis:100%;font-family:var(--fm);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);}
.sourced__i{font-family:var(--fd);font-weight:700;font-size:1rem;color:var(--ink-2);letter-spacing:-.01em;}

/* PHONE MOCKUP + app ui */
.phone{width:296px;background:#131110;border-radius:46px;padding:10px;box-shadow:0 44px 90px -34px rgba(26,22,17,.55);flex:none;-webkit-user-select:none;user-select:none;}
.phone__scr{background:var(--paper);border-radius:36px;overflow:hidden;position:relative;aspect-ratio:9 / 19.5;}
.phone__scr::after{content:"";position:absolute;left:50%;bottom:9px;transform:translateX(-50%);width:33%;height:5px;border-radius:3px;background:var(--ink);opacity:.8;z-index:7;pointer-events:none;}
.phone__notch{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:33%;max-width:108px;height:26px;background:#131110;border-radius:16px;z-index:8;}
.phone__sb{position:relative;z-index:7;display:flex;justify-content:space-between;align-items:center;padding:16px 24px 0;font-family:var(--fm);font-weight:700;font-size:11px;color:var(--ink);}
.phone__sb svg{display:block;width:44px;height:auto;}
.appui{padding:14px 16px 28px;overflow:hidden;-webkit-user-select:none;user-select:none;}
.au-kick{font-family:var(--fm);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:11px;}
.au-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:0 0 12px;}

/* mock app headings are simulated UI, not document structure */
.au-hd .au-hd__t{font-family:var(--fd);font-weight:700;font-size:1.15rem;line-height:1.05;letter-spacing:-.02em;margin:0;}
/* card titles keep their look after moving up a heading level */
.rescard .cardtitle,.chcard__b .cardtitle,.rfeat__t .cardtitle{font:inherit;font-family:var(--fd);font-weight:700;margin:0;}
.au-hd h4{font-family:var(--fd);font-weight:700;font-size:1.15rem;line-height:1.05;letter-spacing:-.02em;}
.au-chip{font-family:var(--fm);font-size:.56rem;letter-spacing:.05em;text-transform:uppercase;font-weight:700;background:var(--ink);color:var(--paper);padding:4px 7px;flex:none;}
.au-read{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-family:var(--fm);font-size:.72rem;padding:11px 14px;border:1px solid var(--line);background:var(--card);margin-bottom:12px;}
.au-read svg{flex:none;}
.au-read b{color:var(--ink);flex:1 0 auto;}.au-read span{color:var(--ink-3);text-align:right;}
.au-rows{border:1px solid var(--line);background:var(--card);}
.au-row{display:flex;align-items:center;gap:9px;padding:11px 12px;border-bottom:1px solid var(--line);}
.au-row:last-child{border-bottom:none;}
.au-row svg{flex:none;}
.au-row b{font-family:var(--fm);font-size:.7rem;font-weight:400;letter-spacing:.01em;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.au-row span{font-family:var(--fm);font-size:.58rem;color:var(--ink-3);white-space:nowrap;}
.au-cta{margin-top:14px;text-align:center;font-family:var(--fm);font-weight:700;font-size:.72rem;letter-spacing:.03em;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:13px;}
.au-tab{position:absolute;left:0;right:0;bottom:0;height:52px;border-top:1px solid var(--line);display:flex;background:var(--paper);}
.au-tab i{flex:1;display:flex;align-items:center;justify-content:center;color:var(--ink-3);}
.au-tab i.on{color:var(--ink);}
.au-tab{display:none;} /* slices use the iPhone home indicator, no bottom bar */
.au-mood{display:flex;gap:11px;align-items:center;padding:12px;border:1px solid var(--line);background:var(--card);margin-bottom:12px;}
.au-mood .f{width:44px;height:44px;background:var(--paper-3);display:grid;place-content:center;font-size:22px;flex:none;}
.au-mood p{font-size:.74rem;line-height:1.35;}
.au-meter{margin:11px 0;}
.au-meter .t{display:flex;justify-content:space-between;font-family:var(--fm);font-size:.62rem;color:var(--ink-2);margin-bottom:6px;}
.au-meter .t b{font-weight:400;color:var(--ink);}
.au-meter .bar{position:relative;height:7px;background:var(--paper-3);border-radius:5px;overflow:hidden;}
.au-meter .bar .band{position:absolute;top:0;bottom:0;background:rgba(110,101,82,.16);}
.au-meter .bar i{position:absolute;left:0;top:0;bottom:0;height:100%;background:var(--ink);border-radius:5px;}
.au-meter .bar i.w{background:var(--watch);}
.au-note{font-size:.7rem;color:var(--ink-2);line-height:1.4;}
/* ---- the real app mock, embedded as a device (app-full.html?embed=1) ---- */
.appframe{position:relative;width:min(420px,92vw);aspect-ratio:505 / 1030;}
/* ============================================================
   appload — the phone assembling itself while the demo loads
   Three beats, no spinner and no percentage: the bezel strokes
   in, the screen washes to paper, then hairline blocks settle
   into the positions the real UI will occupy. It reads as the
   product arriving rather than as software loading, and it
   holds the exact geometry the iframe resolves into, so
   nothing shifts at the handover.
   ============================================================ */
.appload{position:absolute;inset:0;z-index:20;pointer-events:none;opacity:1;transition:opacity .55s var(--ease);}
.appframe.is-ready .appload{opacity:0;}
.appload svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}

/* 1 - the bezel draws itself, one continuous stroke */
.appload__bezel{fill:none;stroke:var(--ink);stroke-width:9;stroke-linecap:round;
  stroke-dasharray:var(--len,2600);stroke-dashoffset:var(--len,2600);
  animation:appDraw .95s var(--ease) forwards;}
@keyframes appDraw{to{stroke-dashoffset:0;}}

/* 2 - the glass fills with warm paper, from the bottom up */
.appload__glass{fill:var(--paper);transform-origin:50% 100%;transform:scaleY(0);
  animation:appWash .42s var(--ease) .72s forwards;}
@keyframes appWash{to{transform:scaleY(1);}}

/* 3 - the furniture settles: each block rises a few px into place */
.appload__b{fill:var(--ink);opacity:0;transform:translateY(7px);
  animation:appSettle .42s var(--spring) forwards;}
.appload__b--soft{fill:var(--ink-3);}
.appload__b--line{fill:var(--line-2);}
@keyframes appSettle{to{opacity:1;transform:none;}}

/* the caption keeps its own quiet pace, no percentage, no spinner */
.appload__cap{position:absolute;left:0;right:0;bottom:-30px;text-align:center;font-family:var(--fm);
  font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);
  opacity:0;animation:appCap .5s var(--ease) 2.4s forwards;}
@keyframes appCap{to{opacity:.75;}}
/* it only admits to being slow if it actually is */
.appload__cap span{opacity:0;animation:appCap .6s var(--ease) 5.5s forwards;}

@media(prefers-reduced-motion:reduce){
  .appload__bezel{animation:none;stroke-dashoffset:0;}
  .appload__glass{animation:none;transform:none;}
  .appload__b{animation:none;opacity:1;transform:none;}
  .appload__cap,.appload__cap span{animation:none;opacity:.75;}
}
.appframe__f{position:absolute;top:0;left:0;width:505px;height:1030px;border:0;display:block;background:transparent;transform-origin:top left;}


/* ---- hero: read a label (input + sample products + inline readout) ---- */
.tryit{max-width:560px;margin-top:8px;padding:17px 18px 15px;border:1.5px solid var(--ink);background:var(--card);box-shadow:0 20px 44px -34px rgba(26,22,17,.6);}
.tryit__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px;}
.tryit__k{font-family:var(--fm);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);}
.tryit__free{font-family:var(--fm);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--green);}
.tryit__field{display:flex;border:1.5px solid var(--ink);background:var(--paper);}
.tryit__field:focus-within{box-shadow:0 0 0 3px rgba(26,22,17,.12);}
.tryit__field input{flex:1;min-width:0;background:none;border:none;color:var(--ink);font-family:var(--fm);font-size:.82rem;padding:14px 15px;outline:none;text-overflow:ellipsis;}
.tryit__field input::placeholder{color:var(--ink-3);}
.tryit__go{flex:none;border:none;border-left:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--fm);font-weight:700;font-size:.78rem;padding:0 22px;cursor:pointer;transition:background .2s,color .2s;}
.tryit__go:hover{background:var(--paper);color:var(--ink);}
.tryit__or{margin-top:13px;}
.tryit__orl{display:block;font-family:var(--fm);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:9px;}
.tryit__chips{display:flex;flex-wrap:wrap;gap:8px;}
.tchip{font-family:var(--fd);font-size:.78rem;line-height:1.2;padding:9px 14px;border:1px solid var(--line-2);border-radius:999px;background:var(--paper);color:var(--ink-3);cursor:pointer;transition:border-color .18s var(--ease),background .18s var(--ease),color .18s var(--ease),transform .12s var(--spring);}
.tchip em{font-style:normal;font-weight:700;color:var(--ink);}
.tchip:hover{border-color:var(--ink);}
.tchip:active{transform:scale(.97);}
.tchip.on{background:var(--ink);border-color:var(--ink);color:rgba(244,239,228,.62);}
.tchip.on em{color:var(--paper);}
.tryit__note{font-family:var(--fm);font-size:.58rem;line-height:1.6;color:var(--ink-3);margin-top:12px;}
/* the readout */
.tryout{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);animation:tryoutIn .4s var(--ease);}
@keyframes tryoutIn{from{opacity:0;transform:translateY(-5px);}to{opacity:1;transform:none;}}
.tryout__hd{display:flex;align-items:center;gap:9px;margin-bottom:4px;}
.tryout__hd svg{flex:none;}
.tryout__v{font-family:var(--fd);font-weight:700;font-size:1rem;letter-spacing:-.01em;}
.tryout__cov{margin-left:auto;font-family:var(--fm);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;}
.tryout__note{font-size:.82rem;line-height:1.45;color:var(--ink-2);margin-bottom:10px;}
.trow{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);}
.trow svg{flex:none;}
.trow b{font-family:var(--fm);font-size:.7rem;font-weight:400;letter-spacing:.02em;text-transform:uppercase;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.trow span{font-family:var(--fm);font-size:.6rem;color:var(--ink-3);white-space:nowrap;}
.tryout__cta{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font-family:var(--fm);font-size:.68rem;letter-spacing:.03em;color:var(--amber-deep);text-decoration:none;border-bottom:1px solid var(--amber);padding-bottom:2px;transition:gap .16s var(--ease);}
.tryout__cta:hover{gap:11px;}
.foot__tm{display:block;max-width:none;margin-bottom:10px;color:rgba(244,239,228,.58);}
@media(max-width:520px){.tryit__field{flex-wrap:wrap;}.tryit__go{width:100%;border-left:none;border-top:1.5px solid var(--ink);padding:13px;}}

/* ---- notifications showcase (the real cards, on a night counter) ---- */
.notif{position:relative;overflow:hidden;background:#141210;padding:clamp(64px,8vw,104px) 0;}
.notif__bg{position:absolute;inset:0;background-size:cover;background-position:center right;overflow:hidden;}
.notif__film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center right;pointer-events:none;}
@media(prefers-reduced-motion:reduce){.notif__film{display:none;}}
.notif__grad{position:absolute;inset:0;background:linear-gradient(100deg,rgba(14,11,8,.94) 22%,rgba(16,13,9,.72) 55%,rgba(16,13,9,.5));}
.notif__in{position:relative;z-index:2;}
.notif .kick{color:rgba(244,239,228,.72);}
.notif .kick::before{background:rgba(244,239,228,.55);}
.notif .h1{color:var(--paper);text-wrap:balance;}
.notif .body{color:rgba(244,239,228,.8);}
.notif__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 22px;margin-top:clamp(38px,5vw,58px);}
@media(max-width:1040px){.notif__grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.notif__grid{grid-template-columns:1fr;gap:22px;}}
.nnote{margin:0;}
.nnote__lbl{font-family:var(--fm);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,239,228,.6);margin-bottom:10px;display:flex;align-items:center;gap:9px;}
.nnote__lbl::before{content:"";width:16px;height:1px;background:rgba(244,239,228,.45);flex:none;}
/* the notification card itself, as the app draws it */
.notif .note{background:rgba(251,248,240,.92);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5);border-radius:20px;padding:14px 16px;box-shadow:0 22px 44px -20px rgba(0,0,0,.62);color:var(--ink);}
.notif .note__top{display:flex;align-items:center;gap:8px;margin-bottom:7px;}
.notif .note__logo{width:20px;height:20px;border-radius:5px;background:var(--ink);display:grid;place-content:center;flex:none;}
.notif .note__app{font-family:var(--fm);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);flex:1;}
.notif .note__time{font-family:var(--fm);font-size:9.5px;color:var(--ink-3);}
.notif .note__t{font-size:14.5px;font-weight:700;letter-spacing:-.01em;display:flex;align-items:center;gap:7px;line-height:1.25;}
.notif .note__t svg{flex:none;}
.notif .note__d{font-size:12.5px;color:var(--ink-2);line-height:1.45;margin-top:4px;}
.notif .note__actions{display:flex;gap:8px;margin-top:12px;}
.notif .note__actions span{flex:1;text-align:center;font-family:var(--fm);font-weight:700;font-size:11px;padding:9px;border-radius:11px;border:1px solid var(--ink);color:var(--ink);}
.notif .note__actions span.pri{background:var(--ink);color:var(--paper);}
/* ---- companion play-button showcase ---- */
.showcase{position:relative;display:inline-block;}
.showcase__cover{position:absolute;inset:0;border-radius:40px;border:none;padding:0;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:linear-gradient(158deg,rgba(36,30,21,.16),rgba(20,16,11,.4));-webkit-backdrop-filter:blur(2.5px) saturate(112%);backdrop-filter:blur(2.5px) saturate(112%);z-index:30;transition:opacity .6s var(--ease),transform .6s var(--ease);}
.showcase__cover.gone{opacity:0;transform:scale(1.04);pointer-events:none;}
.showcase__glow{position:absolute;top:calc(50% - 56px);width:132px;height:132px;border-radius:50%;background:radial-gradient(circle,rgba(176,125,34,.55),transparent 68%);filter:blur(2px);}
.showcase__play{position:relative;width:68px;height:68px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-content:center;box-shadow:0 16px 40px -12px rgba(0,0,0,.55);transition:transform .3s var(--spring);}
.showcase__play svg{width:30px;height:30px;margin-left:-1.7px;}
.showcase__cover:hover .showcase__play{transform:scale(1.07);}
.showcase__cover:active .showcase__play{transform:scale(.94);}
.showcase__cover.gone .showcase__play{transform:scale(.62);}
.showcase__play::after{content:"";position:absolute;inset:0;border-radius:50%;border:2.5px solid var(--paper);opacity:0;}
.showcase__cover.gone .showcase__play::after{animation:playRipple .65s var(--ease);}
@keyframes playRipple{0%{opacity:.85;transform:scale(1);}100%{opacity:0;transform:scale(1.9);}}
.showcase__cap{position:relative;font-family:var(--fm);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,239,228,.92);}

/* readout marks (legend + steps) */
.legend{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);margin-top:44px;}
@media(max-width:760px){.legend{grid-template-columns:1fr;}}
.mk{background:var(--card);padding:24px;}
.mk__t{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.mk__w{font-family:var(--fm);font-weight:700;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;}
.mk p{font-size:.94rem;line-height:1.5;color:var(--ink-2);}

/* how it works / numbered steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);margin-top:46px;}
@media(max-width:820px){.steps{grid-template-columns:1fr;}}
.step{background:var(--card);padding:30px 26px;}
.step__n{font-family:var(--fm);font-size:.72rem;letter-spacing:.1em;color:var(--ink-3);}
.step h3{font-family:var(--fd);font-weight:700;font-size:1.35rem;letter-spacing:-.01em;margin:12px 0 8px;}
.step p{font-size:.96rem;color:var(--ink-2);line-height:1.5;}
.step__ui{margin-top:20px;border:1px solid var(--line);background:var(--paper);padding:14px;min-height:96px;}
.step__ui .mono{font-family:var(--fm);font-size:.68rem;color:var(--ink-3);}
.step__ui .ln{display:flex;align-items:center;gap:8px;font-family:var(--fm);font-size:.68rem;padding:6px 0;border-bottom:1px solid var(--line);}
.step__ui .ln:last-child{border:none;}
.step__ui .ln span{margin-left:auto;color:var(--ink-3);font-size:.6rem;}

/* app section (photo backdrop + phones) */
.appwrap{position:relative;border:1px solid var(--line-2);overflow:hidden;background:#000;}
.appwrap__bg{position:absolute;inset:0;background-size:cover;background-position:center;}
.appwrap__grad{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,16,12,.6),rgba(20,16,12,.12) 62%);}
.appwrap__in{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;padding:clamp(28px,5vw,64px);}
@media(max-width:860px){.appwrap__in{grid-template-columns:1fr;}}
.appwrap__copy h2{color:#fff;}
.appwrap__copy .body{color:rgba(255,255,255,.86);}
.appwrap__copy .kick{color:rgba(255,255,255,.75);}
.appwrap__copy .kick::before{background:rgba(255,255,255,.6);}
.applist{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0;}
.applist li{font-family:var(--fm);font-size:.66rem;letter-spacing:.03em;text-transform:uppercase;color:#fff;border:1px solid rgba(255,255,255,.35);padding:7px 11px;}
.phones{display:flex;justify-content:center;gap:20px;}
.phones .phone:nth-child(2){transform:translateY(28px);}
@media(max-width:520px){.phones .phone:nth-child(2){display:none;}}

/* capabilities / feature grid */
.caps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);margin-top:46px;}
@media(max-width:820px){.caps{grid-template-columns:1fr;}}
.cap{background:var(--card);padding:26px;}

.cap .cap__title{font-family:var(--fd);font-weight:700;font-size:1.1rem;letter-spacing:-.01em;margin:0 0 8px;display:flex;align-items:center;gap:10px;}
.cap .cap__title svg{flex:none;color:var(--ink);}
.cap h4{font-family:var(--fd);font-weight:700;font-size:1.1rem;letter-spacing:-.01em;margin:0 0 8px;display:flex;align-items:center;gap:10px;}
.cap h4 svg{flex:none;color:var(--ink);}
.cap p{font-size:.92rem;color:var(--ink-2);line-height:1.5;}
.caps--2{grid-template-columns:repeat(2,1fr);}
@media(max-width:820px){.caps--2{grid-template-columns:1fr;}}

/* metric tiles */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line-2);border:1px solid var(--line-2);margin-top:44px;}
@media(max-width:820px){.grid3{grid-template-columns:1fr;}}
.tile{background:var(--card);padding:30px;position:relative;}
.tile__ind{position:absolute;top:22px;right:22px;}
.tile .num{font-family:var(--fd);font-weight:800;font-size:3rem;letter-spacing:-.03em;line-height:1;}
.tile .lab{font-size:.96rem;color:var(--ink-2);margin-top:12px;line-height:1.45;}
.tile .cite{font-family:var(--fm);font-size:.62rem;color:var(--ink-3);margin-top:14px;letter-spacing:.04em;text-transform:uppercase;}

/* framed image + provenance receipt + stat strip */
.frame{border:1px solid var(--line-2);overflow:hidden;aspect-ratio:1/1;background:var(--paper-3);}
.frame img{width:100%;height:100%;object-fit:cover;}
.statline__note{flex-basis:100%;font-size:.62rem;color:var(--ink-3);text-transform:none;letter-spacing:.02em;}
.statline{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:24px;font-family:var(--fm);font-size:.7rem;letter-spacing:.03em;color:var(--ink-2);}
.statline b{color:var(--ink);font-weight:700;}
.receipt{border:1.5px solid var(--ink);background:var(--card);padding:26px;}
.receipt__hd{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px;}
.receipt__hd b{font-family:var(--fd);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;}
.receipt__vf{font-family:var(--fm);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--ink);padding:5px 9px;color:var(--ink);cursor:default;background:none;}
.receipt__row{display:flex;justify-content:space-between;gap:16px;font-family:var(--fm);font-size:.78rem;padding:11px 0;border-bottom:1px solid var(--line);}
.receipt__row:last-child{border-bottom:none;}
.receipt__row span:first-child{color:var(--ink-3);letter-spacing:.03em;text-transform:uppercase;font-size:.64rem;align-self:center;}
.receipt__row span:last-child{color:var(--ink);font-weight:700;text-align:right;}
.receipt__row.sig span:last-child{font-weight:400;color:var(--ink-2);font-size:.68rem;}
button.receipt__vf{cursor:pointer;transition:background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);}
button.receipt__vf:hover{background:var(--ink);color:var(--paper);}
.receipt__vf.ok,.receipt__vf.ok:hover{background:var(--green);border-color:var(--green);color:var(--paper);cursor:default;}
.receipt.verified .receipt__row.sig span:last-child{color:var(--green);}

/* API product panel */
.apipanel{border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);}
.apipanel__codewrap{position:relative;}
.apipanel__code{font-family:var(--fm);font-size:.8rem;line-height:1.75;padding:22px;white-space:pre;overflow-x:auto;margin:0;}
.apipanel__code code{font:inherit;color:inherit;background:none;padding:0;}
.apipanel__code:focus-visible{outline:2px solid var(--amber);outline-offset:-2px;}
/* a fading right edge only while there is more code off-screen */
.apipanel__codewrap::after{content:"";position:absolute;top:0;right:0;bottom:0;width:44px;pointer-events:none;background:linear-gradient(to right,rgba(26,22,17,0),rgba(26,22,17,.92));opacity:0;transition:opacity .2s var(--ease);}
.apipanel__codewrap.more::after{opacity:1;}
.apipanel__copy{position:absolute;top:10px;right:10px;z-index:2;font-family:var(--fm);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--paper);background:rgba(244,239,228,.1);border:1px solid rgba(244,239,228,.28);padding:5px 9px;cursor:pointer;transition:background .18s var(--ease);}
.apipanel__copy:hover{background:rgba(244,239,228,.2);}
.apipanel__copy:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}
@media(max-width:560px){.apipanel__code{font-size:.74rem;padding:20px 16px;}}
.apipanel__code .c{color:rgba(244,239,228,.58);}.apipanel__code .k{color:#fff;font-weight:700;}.apipanel__code .s{color:#E6C88A;}.apipanel__code .p{color:#C9B79A;}
.apipanel__foot{display:flex;gap:8px;flex-wrap:wrap;padding:14px 22px;border-top:1px solid rgba(244,239,228,.14);}
.chip{font-family:var(--fm);font-size:.66rem;color:rgba(244,239,228,.8);border:1px solid rgba(244,239,228,.22);padding:6px 10px;}
.ep__state{min-width:62px;text-align:center;font-family:var(--fm);font-size:.56rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line-2);border-radius:999px;padding:2px 8px;flex:none;}
.ep__state--live{color:var(--green);border-color:var(--green);}
.endpoints{display:flex;flex-direction:column;gap:8px;margin-top:26px;}
.ep{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-family:var(--fm);font-size:.78rem;border:1px solid var(--line);background:var(--card);padding:12px 14px;}
.ep b{color:var(--ink);font-weight:700;overflow-wrap:anywhere;min-width:0;}.ep .m{font-size:.6rem;letter-spacing:.06em;padding:3px 7px;background:var(--ink);color:var(--paper);flex:none;display:inline-block;min-width:44px;text-align:center;box-sizing:border-box;}.ep span:last-child{margin-left:auto;color:var(--ink-3);font-size:.66rem;text-align:right;}

/* pricing tier cards */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line-2);border:1px solid var(--line-2);margin-top:46px;}
@media(max-width:820px){.prices{grid-template-columns:1fr;}}
.price{background:var(--card);padding:30px;display:flex;flex-direction:column;}
.price--mid{background:var(--ink);color:var(--paper);}
.price h3,.price .price__name{font-family:var(--fd);font-weight:700;font-size:1.3rem;letter-spacing:-.01em;}
.price .who{font-size:.9rem;color:var(--ink-3);margin-top:4px;}
.price--mid .who{color:rgba(244,239,228,.6);}
.price .amt{font-family:var(--fd);font-weight:800;font-size:2.6rem;letter-spacing:-.03em;margin:10px 0 4px;}
.price .amt small{font-family:var(--fm);font-size:.8rem;font-weight:400;letter-spacing:0;color:var(--ink-3);}
.price--mid .amt small{color:rgba(244,239,228,.6);}
.price ul{margin:16px 0 22px;display:flex;flex-direction:column;gap:9px;}
.price li{font-size:.9rem;color:var(--ink-2);display:flex;gap:9px;}
.price--mid li{color:rgba(244,239,228,.82);}
.price li::before{content:"";width:14px;height:14px;margin-top:3px;flex:none;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1611' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");}
.price--mid li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4EFE4' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");}
.price .btn{margin-top:auto;justify-content:center;}
.price--mid .btn{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.price--mid .btn:hover{background:transparent;color:var(--paper);}

/* pricing comparison table */
.ctable-hint{font-family:var(--fm);font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin:46px 0 10px;display:none;}
@media(max-width:820px){.ctable-hint{display:block;}}
.ctable-wrap:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.ctable-wrap{overflow-x:auto;margin-top:46px;border:1px solid var(--line-2);
  background:
    linear-gradient(to right, var(--card), rgba(251,248,240,0)) 0 0/28px 100% no-repeat,
    linear-gradient(to left, var(--card), rgba(251,248,240,0)) 100% 0/28px 100% no-repeat,
    linear-gradient(to right, rgba(26,22,17,.10), rgba(26,22,17,0)) 0 0/13px 100% no-repeat,
    linear-gradient(to left, rgba(26,22,17,.10), rgba(26,22,17,0)) 100% 0/13px 100% no-repeat;
  background-attachment:local,local,scroll,scroll;}
@media(max-width:820px){
  .ctable-wrap{margin-top:0;}
  /* tighter columns so a whole plan, not a sliver of one, is on screen */
  .ctable{min-width:520px;font-size:.86rem;}
  .ctable th,.ctable td{padding:12px 10px;}
  .ctable th:first-child,.ctable td:first-child{width:auto;min-width:150px;max-width:150px;}
  .ctable thead th{font-size:.94rem;}
}
.ctable{width:100%;min-width:640px;border-collapse:collapse;font-size:.92rem;background:var(--card);}
.ctable th,.ctable td{text-align:center;padding:15px 18px;border-bottom:1px solid var(--line);}
.ctable th:first-child,.ctable td:first-child{text-align:left;color:var(--ink-2);width:40%;}
.ctable tbody th[scope="row"]{font:inherit;font-weight:400;color:var(--ink-2);}
/* the first column stays put, so a feature keeps its name while you scroll across */
.ctable tbody th[scope="row"],.ctable thead th:first-child{position:sticky;left:0;z-index:1;background:var(--card);}
.ctable .grp th{position:sticky;left:0;}
.ctable thead th{font-family:var(--fd);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;border-bottom:1.5px solid var(--ink);vertical-align:bottom;}
.ctable thead th small{display:block;font-family:var(--fm);font-weight:400;font-size:.66rem;letter-spacing:.03em;color:var(--ink-3);text-transform:none;margin-top:4px;}
.ctable .grp th{font-family:var(--fm);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);background:var(--paper-2);padding:20px 18px 10px;text-align:left;font-weight:400;}
.ctable td .yes,.ctable td .no{width:18px;height:18px;display:inline-block;vertical-align:middle;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1611' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");}
.ctable td.no{color:var(--ink-3);}
.ctable td .val{font-family:var(--fm);font-size:.78rem;color:var(--ink);}
.ctable .midcol{background:var(--paper);}

/* FAQ accordion */
.faq{border-top:1px solid var(--line);margin-top:44px;max-width:820px;}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{cursor:pointer;list-style:none;padding:22px 2px;display:flex;justify-content:space-between;gap:20px;font-family:var(--fd);font-weight:700;font-size:1.08rem;letter-spacing:-.01em;align-items:center;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--fm);font-weight:400;color:var(--ink-3);font-size:1.2rem;transition:transform .2s;}
.faq details[open] summary::after{content:"–";}
.faq summary:hover{color:var(--ink-2);}
.faq p{padding:0 2px 24px;font-size:.98rem;line-height:1.6;color:var(--ink-2);max-width:70ch;}

/* interior page header */
.phead{padding:70px 0 52px;}
/* heading left, lead beside it, so the header uses the width it has */
.phead .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:10px 60px;align-items:start;}
.phead .crumbs{grid-column:1 / -1;margin-bottom:8px;}
.phead h1{font-family:var(--fd);font-weight:800;font-size:clamp(2.4rem,4.6vw,3.9rem);line-height:.98;letter-spacing:-.035em;max-width:none;}
.phead .lead{margin-top:9px;max-width:50ch;}
@media(max-width:900px){.phead .wrap{grid-template-columns:1fr;gap:0;}.phead .lead{margin-top:20px;}}
.crumbs{font-family:var(--fm);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:22px;}
.crumbs a{text-decoration:none;color:var(--ink-3);}.crumbs a:hover{color:var(--ink);}
.crumbs span{margin:0 8px;opacity:.5;}

/* long-form prose */
.prose{max-width:70ch;}
.prose>*+*{margin-top:20px;}
.prose h2{font-family:var(--fd);font-weight:700;font-size:1.55rem;letter-spacing:-.02em;margin-top:52px;scroll-margin-top:90px;}
.prose h3{font-family:var(--fd);font-weight:700;font-size:1.15rem;letter-spacing:-.01em;margin-top:34px;}
.prose p,.prose li{font-size:1.04rem;line-height:1.62;color:var(--ink-2);}
.prose ul,.prose ol{display:flex;flex-direction:column;gap:9px;padding-left:0;}
.prose ul li{position:relative;padding-left:22px;list-style:none;}
.prose ul li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:1px;background:var(--ink);}
.prose ol{list-style:decimal;padding-left:1.3em;}
.prose ol li{padding-left:6px;}
.prose a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2);}
.prose a:hover{text-decoration-color:var(--ink);}
.prose strong{color:var(--ink);font-weight:700;}
.prose blockquote{border-left:2px solid var(--ink);padding-left:22px;font-family:var(--fe);font-style:italic;font-size:1.3rem;line-height:1.35;color:var(--ink);}
.prose code{font-family:var(--fm);font-size:.88em;background:var(--paper-2);padding:2px 6px;}

/* legal layout with sticky ToC */
.legal{display:grid;grid-template-columns:230px 1fr;gap:56px;align-items:start;}
@media(max-width:860px){.legal{grid-template-columns:1fr;gap:0;}}
.toc{position:sticky;top:96px;font-family:var(--fm);font-size:.72rem;}
.toc .toc__l{letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px;}
.toc a{display:block;color:var(--ink-3);text-decoration:none;padding:7px 0 7px 14px;border-left:1px solid var(--line);transition:color .2s,border-color .2s;}
.toc a:hover{color:var(--ink);border-color:var(--ink);}
@media(max-width:860px){.toc{display:none;}}

/* resource cards */
.rescards{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);margin-top:44px;}
@media(max-width:900px){.rescards{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.rescards{grid-template-columns:1fr;}}
.rescard{background:var(--card);padding:26px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;transition:background .2s;min-height:180px;}
.rescard:hover{background:var(--paper);}
.rescard__ic{color:var(--ink);}
.rescard h4{font-family:var(--fd);font-weight:700;font-size:1.08rem;letter-spacing:-.01em;}
.rescard p{font-size:.9rem;color:var(--ink-2);line-height:1.5;}
.rescard .go{margin-top:auto;font-family:var(--fm);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}
.rescard:hover .go{color:var(--ink);}

/* forms */
.form{display:grid;gap:18px;max-width:540px;}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media(max-width:560px){.form .row{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:7px;}
.field label{font-family:var(--fm);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);}
.field input,.field textarea,.field select{font-family:var(--fd);font-size:.98rem;padding:13px 14px;border:1.5px solid var(--line-2);background:var(--card);color:var(--ink);outline:none;width:100%;transition:border-color .2s,box-shadow .2s;}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-3);}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(26,22,17,.1);}
.field textarea{resize:vertical;min-height:130px;}

/* contact detail rows */
.contacts{display:flex;flex-direction:column;gap:2px;background:var(--line-2);border:1px solid var(--line-2);}
.contacts a,.contacts div{background:var(--card);padding:20px 22px;display:flex;flex-direction:column;gap:4px;text-decoration:none;color:inherit;}
.contacts a:hover{background:var(--paper);}
.contacts .l{font-family:var(--fm);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}
.contacts .v{font-family:var(--fd);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;}

/* status page */
.status-banner{border:1.5px solid var(--ink);background:var(--card);padding:24px 26px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:40px;}
.status-banner svg{flex:none;}
.status-banner b{font-family:var(--fd);font-weight:800;font-size:1.4rem;letter-spacing:-.02em;}
.status-banner span{font-family:var(--fm);font-size:.72rem;color:var(--ink-3);margin-left:auto;letter-spacing:.03em;}
.srows{margin-top:2px;border:1px solid var(--line-2);}
.srow{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:1px solid var(--line);background:var(--card);}
.srow:last-child{border-bottom:none;}
.srow svg{flex:none;}
.srow b{font-family:var(--fd);font-weight:600;font-size:1rem;}
.srow b{flex:1;min-width:0;}
.srow__state{font-family:var(--fm);font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);border:1px solid var(--line-2);padding:2px 7px;flex:none;}
.srow .uptime{margin-left:auto;display:flex;align-items:center;gap:2px;flex:none;}
.srow .uptime i{width:4px;height:20px;background:var(--ink);display:block;opacity:.85;}
.srow .uptime i.d{background:var(--watch);}
.srow .pct{font-family:var(--fm);font-size:.72rem;color:var(--ink-3);margin-left:14px;min-width:52px;text-align:right;flex:none;}
@media(max-width:600px){.srow .uptime{display:none;}}
@media(max-width:560px){.srows--stack .srow{flex-wrap:wrap;row-gap:3px;}.srows--stack .srow>b{flex:1 1 100%;}.srows--stack .srow>span{margin-left:0 !important;flex-basis:100%;text-align:left !important;}}

/* ingredient record (glossary detail) */
.record{border:1px solid var(--line-2);background:var(--card);margin-top:2px;}
.record__grid{display:grid;grid-template-columns:repeat(2,1fr);}
@media(max-width:640px){.record__grid{grid-template-columns:1fr;}}
.rf{padding:18px 22px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);}
.record__grid .rf:nth-child(2n){border-right:none;}
.rf .l{font-family:var(--fm);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px;}
.rf .v{font-size:1rem;color:var(--ink);line-height:1.4;}
.rf .v small{font-family:var(--fm);font-size:.66rem;color:var(--ink-3);display:block;margin-top:4px;}

/* glossary index list */
.glist{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-2);border:1px solid var(--line-2);margin-top:2px;}
@media(max-width:700px){.glist{grid-template-columns:1fr;}}
.gitem{background:var(--card);padding:20px 22px;text-decoration:none;color:inherit;display:flex;align-items:center;gap:12px;transition:background .2s;}
.gitem:hover{background:var(--paper);}
.gitem svg{flex:none;}
.gitem b{font-family:var(--fm);font-size:.86rem;font-weight:400;letter-spacing:.02em;text-transform:uppercase;flex:1;}
.gitem span{font-family:var(--fm);font-size:.62rem;color:var(--ink-3);}

/* reusable CTA band */
.cta-band{text-align:center;max-width:700px;margin:0 auto;}
.cta-band .body{margin:0 auto 30px;}

/* roadmap - changelog strip */
.chlog{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px;}
@media(max-width:900px){.chlog{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.chlog{grid-template-columns:1fr;}}
/* five releases in a four-column grid orphaned the last one; it spans instead */
@media(min-width:901px){
  .chlog>.chcard:nth-child(5){grid-column:1 / -1;display:grid;grid-template-columns:minmax(220px,.8fr) 3fr;align-items:stretch;max-height:172px;overflow:hidden;}
  .chlog>.chcard:nth-child(5) .chcard__img{aspect-ratio:auto;height:100%;min-height:150px;}
  .chlog>.chcard:nth-child(5) .chcard__b{display:flex;flex-direction:column;justify-content:center;padding:20px 24px;max-width:70ch;}
}
.chcard{border:1px solid var(--line-2);background:var(--card);overflow:hidden;display:flex;flex-direction:column;}
.chcard__img{aspect-ratio:16/10;background-position:center;background-size:cover;background-color:var(--paper-3);}
.chcard__b{padding:15px 16px 17px;}
.chcard__d{font-family:var(--fm);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);display:flex;align-items:center;gap:7px;}
.chcard h4{font-family:var(--fd);font-weight:700;font-size:1.02rem;letter-spacing:-.01em;margin:8px 0 5px;}
.chcard p{font-size:.86rem;color:var(--ink-2);line-height:1.45;}

/* roadmap - horizon columns */
.horizons{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line-2);border:1px solid var(--line-2);margin-top:44px;}
@media(max-width:920px){.horizons{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.horizons{grid-template-columns:1fr;}}
.horizon{background:var(--card);padding:22px 18px;}
.horizon__h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:14px;padding-bottom:12px;border-bottom:1.5px solid var(--ink);}
.horizon__h b{font-family:var(--fd);font-weight:800;font-size:1.15rem;letter-spacing:-.02em;}
.horizon__h span{font-family:var(--fm);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}
.rfeat{padding:12px 0;border-bottom:1px solid var(--line);}
.rfeat:last-child{border-bottom:none;}
.rfeat__t{display:flex;align-items:flex-start;gap:8px;}
.rfeat__t svg{flex:none;margin-top:2px;}
.rfeat h4{font-family:var(--fd);font-weight:700;font-size:.96rem;letter-spacing:-.01em;flex:1;line-height:1.2;}
.rfeat p{font-size:.83rem;color:var(--ink-2);line-height:1.42;margin-top:5px;padding-left:22px;}
/* one column on mobile, so the detail gets a readable size rather than a dense one */
@media(max-width:560px){
  .rfeat p{font-size:1rem;line-height:1.5;}
  .rfeat h4,.rfeat .cardtitle{font-size:1.05rem;}
  .rtag{font-size:.7rem;}
  .horizon__h span{font-size:.7rem;}
}
.rtag{font-family:var(--fm);font-size:.62rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line-2);padding:2px 6px;margin:6px 0 0 22px;display:inline-block;}
.rtag i{font-style:normal;}
.rtag i::before{content:"\00a0\00b7\00a0";}
/* the status word is the accessible carrier; the shape beside it is redundant */
.rfeat--shipped .rtag i,.rtag i{color:var(--ink-2);}
.rtag--api{color:#8A6119;border-color:var(--watch);}

/* macro photo band */
.band{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
@media(max-width:700px){.band{grid-template-columns:1fr;}}
.macro{position:relative;overflow:hidden;min-height:230px;display:flex;align-items:flex-end;}
.macro__cap{position:relative;z-index:2;font-family:var(--fm);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.92);padding:14px 16px;text-shadow:0 1px 6px rgba(0,0,0,.5);margin-top:auto;}

/* manifesto */
.manifesto{text-align:center;max-width:900px;margin:0 auto;}
.manifesto blockquote{font-family:var(--fe);font-style:italic;font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.14;}
.manifesto .by{font-family:var(--fm);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,239,228,.5);margin-top:22px;}

/* footer */
.foot{background:var(--ink);color:var(--paper);padding:60px 0 38px;position:relative;z-index:2;}
.foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;}
@media(max-width:760px){.foot__grid{grid-template-columns:1fr 1fr;}}
.foot h4,.foot .foot__h{font-family:var(--fm);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,239,228,.5);margin-bottom:14px;}
.foot a{display:block;font-size:.9rem;color:rgba(244,239,228,.8);text-decoration:none;margin-bottom:9px;}
.foot a:hover{color:var(--paper);}
.foot .brand{display:inline-flex;}
.foot__stores{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap;}
.foot .store{background:var(--paper);color:var(--ink);border-color:var(--paper);margin-bottom:0;}
.foot .store:hover{background:transparent;color:var(--paper);}
.foot .store b,.foot .store span{margin:0;}
.foot__legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:44px;padding-top:22px;border-top:1px solid rgba(244,239,228,.14);font-family:var(--fm);font-size:.64rem;color:rgba(244,239,228,.55);text-transform:uppercase;letter-spacing:.04em;}

/* scroll reveal */
.js .rv{opacity:0;transform:translateY(20px);}
/* the deadline fired, or the reveal script never ran: show everything */
.rv-fallback .rv,.rv-fallback .rv--img{opacity:1 !important;transform:none !important;}
.rv.in{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease);}
.rv--img{transform:scale(1.05);}

/* micro-interactions */
.caps .cap,.grid3 .tile,.steps .step,.legend .mk,.gitem,.rescard{transition:background .25s var(--ease),transform .25s var(--ease);}
.grid3 .tile:hover,.steps .step:hover,.legend .mk:hover{background:var(--paper);}
.frame img{transition:transform .7s var(--ease);}
a.frame:hover img,a .frame:hover img{transform:scale(1.03);}
[data-magnetic]{transition:transform .25s var(--ease);}
/* hover elevation on grid cells (shadow, not lift - preserves the hairline grid) */
.grid3 .tile:hover,.steps .step:hover,.legend .mk:hover{box-shadow:0 12px 32px -20px rgba(26,22,17,.5);position:relative;z-index:1;}
/* standalone cards lift */
.rescard,.chcard,.gitem{transition:background .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);}
.rescard:hover{transform:translateY(-3px);box-shadow:0 16px 36px -22px rgba(26,22,17,.42);}
.gitem:hover{transform:translateX(3px);}
/* nav-link animated underline (desktop) */
.nav__links a:not(.nav__cta){position:relative;}
.nav__links a:not(.nav__cta)::after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left center;transition:transform .3s var(--ease);}
.nav__links a:not(.nav__cta):hover::after,.nav__links a:not(.nav__cta)[aria-current]::after{transform:scaleX(1);}
.nav__cta{transition:transform .18s var(--spring),background .2s,color .2s !important;}
.nav__cta:hover{transform:translateY(-1px);}
.nav__burger svg{transition:transform .3s var(--spring);}
.nav.open .nav__burger svg{transform:rotate(90deg);}
/* footer links slide + brand-agnostic */
.foot a{transition:color .2s var(--ease),transform .2s var(--ease);}
.foot a:not(.brand):hover{transform:translateX(3px);}
/* store buttons lift */
.store{transition:background .2s,color .2s,transform .2s var(--ease);}
.store:hover{transform:translateY(-1px);}
/* endpoint path nudge */
.ep b{transition:transform .2s var(--ease);}

/* primary buttons: press spring already; add a whisper of lift on solid btns in bands */
.cta-band .btn:hover,.hw .btn:hover{transform:translateY(-1px);}
/* prose + inline links: underline sweep */
.prose a,.link{transition:color .2s var(--ease);}
/* scroll progress bar (injected by editorial.js) */
.scrollprog{position:fixed;top:0;left:0;height:2px;background:var(--ink);width:0;z-index:60;pointer-events:none;transition:width .08s linear;}

/* interior figures (landscape image rows) */
.figrow{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin-top:44px;}
@media(max-width:700px){.figrow{grid-template-columns:1fr;}}
.fig{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--paper-3);display:flex;align-items:flex-end;}
.fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease);}

.fig__cap{position:relative;z-index:2;font-family:var(--fm);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.94);padding:14px 16px;text-shadow:0 1px 6px rgba(0,0,0,.55);}
.fig--tall{aspect-ratio:4/5;}
/* a lead figure that pushes the page's actual content past a whole desktop
   viewport is decoration in the way; keep the 16:10 crop where it earns its
   height (mobile) and pan it down to a band on a wide screen. */
.fig--lead{aspect-ratio:16/10;}
@media(min-width:900px){.fig--lead{aspect-ratio:2.4/1;max-height:420px;}}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.001ms!important;}.rv{opacity:1;transform:none;}}

/* ---------- citations: marker + popover ---------- */
.cite[data-cite]{display:inline-flex;align-items:center;justify-content:center;vertical-align:super;font-size:.58em;line-height:1;margin:0 1px 0 2px;width:1.5em;height:1.5em;padding:0;border-radius:50%;flex:none;border:1px solid var(--line-2);background:var(--card);color:var(--amber-deep);font-family:var(--fm);font-weight:600;cursor:pointer;transition:background .16s var(--ease),border-color .16s var(--ease),color .16s var(--ease),transform .12s var(--spring);position:relative;top:-.35em;-webkit-tap-highlight-color:transparent;}
.cite[data-cite]::before{content:attr(data-n);}
/* the visible circle stays small; the hit area is a full target */
.cite[data-cite]::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%);border-radius:50%;}
.cite[data-cite]:hover{background:var(--amber);border-color:var(--amber);color:var(--ink);}
.cite[data-cite]:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}
.cite[data-cite][aria-expanded="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper);transform:translateY(-1px);}

.citepop:focus{outline:2px solid var(--ink);outline-offset:3px;}
.citepop{position:fixed;z-index:200;width:min(340px,calc(100vw - 28px));background:var(--card);border:1px solid var(--line);border-radius:15px;box-shadow:0 24px 56px -20px rgba(26,22,17,.5),0 3px 10px rgba(26,22,17,.07);padding:17px 19px 18px;opacity:0;transform:translateY(7px) scale(.985);transition:opacity .22s var(--ease),transform .3s var(--spring);pointer-events:none;}
.citepop.on{opacity:1;transform:none;pointer-events:auto;}
.citepop__arrow{position:absolute;width:12px;height:12px;background:var(--card);border:1px solid var(--line);transform:rotate(45deg);}
.citepop__k{display:flex;align-items:center;gap:6px;font-family:var(--fm);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0;}
.citepop__k svg{color:var(--ink);flex:none;}
.citepop__q{font-family:var(--fe);font-style:italic;font-size:1.02rem;line-height:1.5;color:var(--ink);margin:11px 0 12px;quotes:none;border:none;padding:0;}
.citepop__src{font-size:.82rem;color:var(--ink-2);line-height:1.45;margin:0;}
.citepop__link{display:inline-flex;align-items:center;gap:5px;margin-top:13px;font-family:var(--fm);font-size:.72rem;letter-spacing:.02em;color:var(--amber-deep);text-decoration:none;border-bottom:1px solid var(--amber);padding-bottom:1px;transition:gap .15s var(--ease);}
.citepop__link:hover{gap:8px;}


/* ============================================================
   mobile readability floor
   At one column there is room for the real size, so the
   evidence stops being the smallest text on the page.
   ============================================================ */
.cap__src{font-family:var(--fm);font-size:.62rem;letter-spacing:.04em;color:var(--ink-3);margin-top:14px;text-transform:uppercase;line-height:1.5;}
@media(max-width:820px){
  .cap p,.cap__b p{font-size:1rem;line-height:1.55;}
  .cap__src{font-size:.75rem;line-height:1.55;letter-spacing:.05em;}
  .au-read{font-size:.8rem;}
  .au-row b{font-size:.78rem;}
  .au-row span{font-size:.72rem;}
  .au-note,.au-mood p{font-size:.82rem;line-height:1.5;}
  .receipt__row{font-size:.875rem;}
  .receipt__row span:first-child{font-size:.75rem;}
  .receipt__row.sig span:last-child{font-size:.75rem;}
  .receipt__vf{font-size:.7rem;}
  .statline{font-size:.78rem;}
  .statline__note{font-size:.72rem;}
  .tile .lab{font-size:1rem;line-height:1.5;}
  .tile .cite{font-size:.72rem;}
  .gitem span{font-size:.74rem;}
  .chcard p{font-size:.95rem;line-height:1.5;}
  .chcard__d{font-size:.7rem;}
  .fig__cap{font-size:.72rem;}
  .foot__legal{font-size:.75rem;line-height:1.55;text-transform:none;letter-spacing:.01em;}
  .mk p{font-size:1rem;line-height:1.5;}
  .rescard p{font-size:.98rem;line-height:1.5;}
  .price li{font-size:.98rem;}
  .contacts .l,.rf .l{font-size:.72rem;}
}

/* a paper-coloured focus ring, so it is visible against the dark bands */
.dark .btn:focus-visible,.dark .store:focus-visible,.dark a:focus-visible{outline-color:var(--paper);}

/* the mark vocabulary and the medical caveat, next to the advice they qualify */
.recnote{font-size:.95rem;line-height:1.55;color:var(--ink-2);max-width:64ch;margin:14px 0 0;border-left:2px solid var(--watch);padding-left:14px;}
.recnote b{color:var(--ink);font-weight:600;}
@media(max-width:820px){.recnote{font-size:1rem;}}

/* investor tier strip: the same three prices, plus the economics that make them mean something */
.tiers{width:100%;border-collapse:collapse;font-family:var(--fm);font-size:.82rem;background:var(--card);border:1px solid var(--line-2);}
.tiers caption{caption-side:top;text-align:left;font-family:var(--fm);font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);padding:0 0 10px;}
.tiers th,.tiers td{padding:11px 12px;text-align:right;border-bottom:1px solid var(--line);}
.tiers thead th{font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500;border-bottom:1.5px solid var(--ink);}
.tiers th:first-child,.tiers td:first-child,.tiers tbody th{text-align:left;}
.tiers tbody th{font-family:var(--fd);font-weight:700;font-size:.95rem;color:var(--ink);}
.tiers tbody tr:last-child th,.tiers tbody tr:last-child td{border-bottom:none;}
.tiers__mid{background:var(--paper);}
.tiers__note{font-size:.86rem;line-height:1.55;color:var(--ink-2);margin-top:14px;}
.tiers__more{display:inline-block;margin-left:6px;font-family:var(--fm);font-size:.72rem;color:var(--amber-deep);border-bottom:1px solid var(--amber);text-decoration:none;}
@media(max-width:560px){.tiers{font-size:.78rem;}.tiers th,.tiers td{padding:9px 8px;}.tiers__note{font-size:.92rem;}}

/* visually hidden, still announced */
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;}
.terms{font-size:.88rem;line-height:1.6;color:var(--ink-3);margin-top:20px;max-width:78ch;}
.terms code{font-family:var(--fm);font-size:.82em;color:var(--ink-2);}
@media(max-width:820px){.terms{font-size:.95rem;}}

/* skip link: first thing a keyboard reaches, invisible until it is focused */
.skip{position:absolute;left:14px;top:-60px;z-index:400;background:var(--ink);color:var(--paper);font-family:var(--fm);font-size:.72rem;letter-spacing:.06em;padding:11px 16px;text-decoration:none;transition:top .18s var(--ease);}
.skip:focus{top:14px;outline:2px solid var(--amber);outline-offset:2px;}

/* contact form: the honest note, the error summary, and required markers */
.form__note{font-size:.88rem;line-height:1.6;color:var(--ink-3);margin-top:14px;}
.form__note a{color:var(--amber-deep);border-bottom:1px solid var(--amber);text-decoration:none;}
.form__err{font-size:.92rem;line-height:1.55;color:var(--ink);background:var(--paper-2);border-left:2px solid var(--amber-deep);padding:12px 14px;margin:0 0 18px;}
.form__err a{color:var(--amber-deep);text-decoration:underline;text-underline-offset:2px;}
.form__err:focus{outline:2px solid var(--ink);outline-offset:2px;}
.req{font-family:var(--fm);font-size:.85em;color:var(--ink-3);text-transform:none;letter-spacing:.02em;}
[aria-invalid="true"]{border-color:var(--amber-deep) !important;}

/* the legal contents list becomes a scrollable chip row on mobile rather than vanishing */
@media(max-width:860px){
  .toc{position:static;display:flex;align-items:center;gap:8px;overflow-x:auto;padding:0 0 12px;margin-bottom:24px;border-bottom:1px solid var(--line);scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .toc::-webkit-scrollbar{display:none;}
  .toc .toc__l{flex:none;margin:0 4px 0 0;}
  .toc a{flex:none;white-space:nowrap;border-left:none;border:1px solid var(--line);padding:7px 11px;}
}

/* status metric cards are readouts, not links, so they stop reacting like links */
.status-metrics .tile:hover{background:var(--card);box-shadow:none;}
@media(max-width:560px){.srow__state{font-size:.68rem;}}

/* ============================================================
   vfilm — a film that plays once and holds its last frame
   The poster IS the final frame, so the still state and the
   ended state are the same image. Nothing loops: every one of
   these is an argument about a single event in time.
   ============================================================ */
.vfilm{position:relative;margin:0;background:var(--paper-3);overflow:hidden;}
.vfilm video{display:block;width:100%;height:100%;object-fit:cover;}
.vfilm__cap{display:block;font-family:var(--fm);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-top:10px;line-height:1.5;}
.vfilm__cap b{color:var(--ink-2);font-weight:400;}
@media(max-width:820px){.vfilm__cap{font-size:.72rem;}}
/* replay: only offered once the film has ended, never a loop */
.vfilm__replay{position:absolute;right:12px;bottom:12px;z-index:3;display:none;align-items:center;gap:6px;font-family:var(--fm);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--paper);background:rgba(26,22,17,.62);border:1px solid rgba(244,239,228,.3);padding:7px 11px;cursor:pointer;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);}
.vfilm.is-ended .vfilm__replay{display:inline-flex;}
.vfilm__replay:hover{background:rgba(26,22,17,.8);}
.vfilm__replay:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}
/* a film is not a control: it never invites a click it will not honour */
.vfilm video{pointer-events:none;}

/* the science margin-of-safety band */
.vfilm--band{aspect-ratio:16/9;}
@media(min-width:900px){.vfilm--band{aspect-ratio:2.4/1;}}
/* the receipts header band */
.vfilm--lead{aspect-ratio:16/10;}
@media(min-width:900px){.vfilm--lead{aspect-ratio:2.4/1;max-height:420px;}}
/* the held-read film, sitting in a column beside its receipt */
.vfilm--inline{aspect-ratio:16/9;border:1px solid var(--line-2);}

/* reduced motion: serve the poster, never the film */
@media(prefers-reduced-motion:reduce){
  .vfilm video{display:none;}
  .vfilm{background-size:cover;background-position:center;}
  .vfilm__replay{display:none !important;}
}
