/* fonts: self-hosted latin subsets shared with the rest of the site (assets/fonts) */
@font-face{font-family:Onest;src:url(../fonts/Onest-Variable-latin.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/Inter-Variable-latin.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(../fonts/IBMPlexMono-Regular-latin.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(../fonts/IBMPlexMono-Medium-latin.woff2) format("woff2");font-weight:500;font-display:swap}
:root{
  --canvas:#F8F6F1;--band:#EBE6DB;--track:#E2DBCD;--mist:#F4F6F8;--mist100:#EBEFF2;--surface:#FFFFFF;--muted:#DFE4E9;
  --ink:#0E1218;--t2:#4F5864;--t3:#5E6875;
  --brand:#0D6E6E;--brand-h:#0A5A5A;--brand-s:#E3F2F0;--brand-25:#F2F9F8;--spruce-400:#2A8E86;--spruce-700:#084646;--spruce-800:#053030;
  --ai:#6553D9;--ai-s:#F2F0FE;
  --line:#DFE4E9;--line-2:#CDD4DB;
  --warn:#8F611C;--warn-s:#FCECD5;--ok:#176F45;--ok-s:#D4F1E3;
  --e-out:cubic-bezier(.215,.61,.355,1);--e-brand:cubic-bezier(.22,1,.36,1);--e-spring:cubic-bezier(.34,1.56,.64,1);
  /* type: Onest headings and figures, Inter text, sizes in rem, unitless leading, tracking in em (BRAND-GUIDE 4) */
  --caps:.06em;
  --gut:max(16px,env(safe-area-inset-left,0px));--gut-r:max(16px,env(safe-area-inset-right,0px));
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--canvas);color:var(--ink);font:400 1rem/1.5 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;font-feature-settings:"cv11","ss01"}
img{display:block;max-width:100%}
a{color:inherit;text-underline-position:from-font}
p,li,dd{text-wrap:pretty}
button{font:inherit;color:inherit}
/* touch: no grey tap flash (every control has its own :active), no double-tap wait, no text selection on a long-pressed control */
html{-webkit-tap-highlight-color:transparent}
a,button{touch-action:manipulation}
.btn,.tab,.burger,.acc button,.qa button{-webkit-user-select:none;user-select:none}
:focus-visible{outline:2px solid var(--spruce-400);outline-offset:2px;border-radius:4px}
.wrap{max-width:1312px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut-r)}
.sec{padding:120px 0}
.band{background:var(--band)}
.fade-band{background:linear-gradient(var(--canvas),var(--band))}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace;font-feature-settings:normal}


/* type */
.over{font:500 15px/20px Inter,sans-serif;color:var(--brand);margin:0 0 14px}
.h1,.h2,.h3,.h4{font-family:Onest,sans-serif;font-weight:600;margin:0;color:var(--ink);text-wrap:balance}
.h1{font-size:3.75rem;line-height:1.067;letter-spacing:-.02em}
.h2{font-size:2.75rem;line-height:1.136;letter-spacing:-.02em}
.h4{font-size:1.25rem;line-height:1.4;letter-spacing:-.01em}
.aside{font:400 1.375rem/1.364 Onest,sans-serif;letter-spacing:-.01em;color:var(--t2);margin:10px 0 0;text-wrap:balance}
.lead{font-size:1.125rem;line-height:1.556;color:var(--t2);margin:20px 0 0;max-width:68ch;text-wrap:pretty}
.body{color:var(--t2);margin:8px 0 0;text-wrap:pretty}
.small{font-size:.875rem;line-height:1.429}
.cap{font-size:.75rem;line-height:1.333;color:var(--t3)}
.center{text-align:center}.center .lead,.center .aside{margin-left:auto;margin-right:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px 0 18px;border-radius:10px;font:600 15px/20px Inter,sans-serif;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background-color .2s var(--e-brand),border-color .2s var(--e-brand),transform .12s}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--brand);color:#fff}.btn-p:active{background:var(--brand-h)}
.btn-s{background:var(--surface);color:var(--ink);border-color:var(--line-2)}.btn-s:active{border-color:#6E7885}
.btn-w{background:#fff;color:var(--spruce-700)}.btn-w:active{background:var(--brand-25)}
.btn-sm{height:40px;font-size:14px;padding:0 14px 0 16px}
.btn .ar{width:16px;height:16px;flex:none;transition:transform .45s var(--e-spring)}
.btn .pl{transition:transform .45s var(--e-spring)}
/* hover effects only for a precise pointer: on touch a tap would leave them stuck on */
@media (hover:hover) and (pointer:fine){
  .btn-p:hover{background:var(--brand-h)}.btn-s:hover{border-color:#6E7885}.btn-w:hover{background:var(--brand-25)}
  .btn:hover .ar{transform:translateX(3px)}.btn:hover .pl{transform:rotate(90deg)}
  .nav-i:hover{background:rgb(14 18 24 / .06)}
  .hdr.dk .nav-i:hover{background:rgb(255 255 255 / .12)}
  .mg-tab:hover{color:var(--ink)}
  .mg-a:hover{color:var(--brand)}.mg-a:hover .ar{opacity:1;transform:none}
  .mg-foot a:hover,.mm-sub .mg-foot a:hover{color:var(--brand-h)}
  .mq:hover .mq-t{animation-play-state:paused}
  .ftr ul a:hover{color:#fff;text-decoration:underline}
}
.acc button:active,.qa button:active{opacity:.72}

/* bar + header */
.bar{background:var(--brand-s);color:var(--spruce-700);font:500 14px/20px Inter,sans-serif;text-align:center;padding:10px var(--gut-r) 10px var(--gut)}
.bar b{font-weight:600}
.bar-pill{display:inline-block;vertical-align:1px;margin-right:10px;padding:0 9px;border-radius:999px;background:var(--ai-s);border:1px solid #CBC3FB;color:var(--ai);font:600 12px/20px Inter,sans-serif}
.bar a{color:var(--spruce-700);font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap;margin-left:4px}
.hdr{position:sticky;top:0;z-index:40;color:var(--ink);background:rgba(248,246,241,.86);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;transition:border-color .2s,background-color .35s var(--e-out),color .35s var(--e-out)}
/* over a dark section the bar turns dark with it */
.hdr.dk{color:#fff;background:rgba(14,18,24,.78)}
.hdr.dk.sc{border-bottom-color:rgb(255 255 255 / .1)}
.hdr.sc{border-bottom-color:var(--line)}
.hdr .wrap{display:flex;align-items:center;height:72px;gap:24px}
.logo{display:grid;align-items:center;flex:none}
.logo img{height:32px;width:auto;grid-area:1/1;transition:opacity .35s var(--e-out)}
.logo .lg-d{opacity:0}
.hdr.dk .lg-l{opacity:0}.hdr.dk .lg-d{opacity:1}
.ftr .logo img{grid-area:auto}
.nav{margin:0 auto}
.nav>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav-sol{position:relative}
.nav-i{display:flex;align-items:center;gap:6px;height:40px;padding:0 14px;border:0;border-radius:999px;background:none;font:500 14px/20px Inter,sans-serif;color:inherit;text-decoration:none;cursor:pointer;transition:background-color .2s var(--e-out)}
.nav-i .chev{width:12px;height:12px;transition:transform .25s var(--e-brand)}
.nav-i[aria-expanded=true]{background:rgb(14 18 24 / .06)}
.hdr.dk .nav-i[aria-expanded=true]{background:rgb(255 255 255 / .12)}
.nav-i[aria-expanded=true] .chev{transform:rotate(180deg)}
.nav-i:focus-visible,.mg-tab:focus-visible,.mg-a:focus-visible,.mg-foot a:focus-visible,.mm-r:focus-visible,.mm-a:focus-visible,.mm-back:focus-visible,.burger:focus-visible,.logo:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.hdr.dk .nav-i:focus-visible,.hdr.dk .logo:focus-visible{outline-color:#8FCBC4}

/* Solutions panel: frosted, under its trigger; tabs on the left, the chosen list on the right */
.mega{position:absolute;left:-8px;top:calc(100% + 14px);width:640px;padding:12px;border-radius:20px;color:var(--ink);background:var(--canvas);border:1px solid var(--line);box-shadow:0 1px 2px rgb(14 18 24 / .06),0 24px 48px -16px rgb(14 18 24 / .22);
  opacity:0;visibility:hidden;transform:translateY(-6px) scale(.98);transform-origin:24px 0;transition:opacity .14s var(--e-out),transform .14s var(--e-out),visibility 0s .14s}
.mega::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.mega.open{opacity:1;visibility:visible;transform:none;transition:opacity .18s var(--e-out),transform .24s var(--e-brand)}
.mg-in{display:grid;grid-template-columns:200px 1fr;gap:12px}
.mg-tabs{position:relative;display:flex;flex-direction:column;gap:4px;padding:4px 12px 4px 0;border-right:1px solid var(--line)}
.mg-pill{position:absolute;left:0;right:12px;top:4px;height:44px;border-radius:999px;background:rgb(255 255 255 / .9);box-shadow:0 1px 2px rgb(14 18 24 / .08);transform:translateY(var(--y,0px));transition:transform .28s var(--e-brand)}
.mg-tab{position:relative;display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 12px 0 16px;border:0;border-radius:999px;background:none;font:500 15px/20px Inter,sans-serif;color:var(--t3);text-align:left;cursor:pointer;transition:color .2s var(--e-out)}
.mg-tab[aria-selected=true]{color:var(--ink)}
.mg-tab .cr{width:14px;height:14px;opacity:.6}
.mg-panes{display:grid;min-width:0}
.mg-list{grid-area:1/1;list-style:none;margin:0;padding:4px 8px;display:flex;flex-direction:column;gap:2px}
.mg-list[hidden]{display:none}
.mg-list.in{animation:mg-in .26s var(--e-brand) both}
@keyframes mg-in{from{opacity:0;transform:translateX(8px)}}
.mg-a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 8px;border-radius:10px;font:500 18px/26px Onest,sans-serif;letter-spacing:-.01em;color:var(--ink);text-decoration:none;transition:color .2s var(--e-out)}
.mg-a .ar{width:16px;height:16px;flex:none;opacity:0;transform:translateX(-4px);transition:opacity .2s var(--e-out),transform .25s var(--e-brand)}
.mg-a:focus-visible .ar{opacity:1;transform:none}
.mg-foot{margin:10px 0 0;padding:12px 16px 4px;border-top:1px solid var(--line);font:400 14px/20px Inter,sans-serif;color:var(--t3)}
.mg-foot a{white-space:nowrap;color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.scrim{display:none}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line-2);border-radius:10px;background:#fff;color:var(--ink);align-items:center;justify-content:center;cursor:pointer}
.burger path{transition:transform .3s var(--e-brand);transform-origin:9px 9px}
.burger[aria-expanded=true] .l1{transform:rotate(45deg) translateY(3px)}
.burger[aria-expanded=true] .l2{transform:rotate(-45deg) translateY(-3px)}
.sheet,.dock{display:none}
/* phone: the primary actions sit at the bottom, in thumb reach, once the hero's own buttons have scrolled away; gone again at the briefing */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:38;gap:10px;padding:10px var(--gut-r) max(10px,env(safe-area-inset-bottom,0px)) var(--gut);background:rgba(248,246,241,.96);border-top:1px solid var(--line);transform:translateY(110%);visibility:hidden;transition:transform .35s var(--e-brand),visibility 0s .35s}
.dock.on{transform:none;visibility:visible;transition:transform .35s var(--e-brand)}
.dock .btn{flex:1 1 0;justify-content:center;height:48px;padding:0 12px;white-space:nowrap}
html.menu-on{overflow:hidden}

/* hero */
.hero{padding:72px 0 0}
.hero .h1{max-width:820px;margin:24px auto 0}
.hero .lead{max-width:640px}
.ctas{display:flex;gap:12px;justify-content:center;margin-top:32px;flex-wrap:wrap}
.phone{position:relative;border-radius:42px;background:#0E1218;padding:7px;box-shadow:0 0 0 1px rgba(14,18,24,.08),0 40px 70px -24px rgba(5,48,48,.55),0 14px 28px -14px rgba(5,48,48,.35)}
.phone img,.phone video{display:block;border-radius:35px;width:100%;height:auto;background:#fff}
.vbtn{position:absolute;left:calc(100% + 12px);bottom:28px;display:grid;place-items:center;width:40px;height:40px;border-radius:999px;border:1px solid rgb(255 255 255 / .22);background:rgb(255 255 255 / .1);color:#fff;cursor:pointer;transition:transform .12s var(--e-out),background-color .2s}
@media (hover:hover) and (pointer:fine){.vbtn:hover{background:rgb(255 255 255 / .18)}}
.vbtn:active{transform:scale(.94)}
.vbtn:focus-visible{outline:2px solid var(--spruce-400);outline-offset:2px}
.vbtn svg{width:14px;height:14px}
.vbtn .i-play,.vbtn[aria-pressed=true] .i-pause{display:none}
.vbtn[aria-pressed=true] .i-play{display:block}
/* on a light surface the button sits under its phone */
.vbtn.lt{left:50%;bottom:auto;top:calc(100% + 12px);margin-left:-20px;border-color:var(--line-2);background:#fff;color:var(--ink)}
@media (hover:hover) and (pointer:fine){.vbtn.lt:hover{background:var(--brand-25)}}
.step{font:500 11px/16px "IBM Plex Mono",monospace;color:var(--t3);font-variant-numeric:tabular-nums;white-space:nowrap}

/* hero: the intro card. One photo; an after-hours call plays over it as Sona's own cards (hx-*).
   Without JS, or with reduced motion, the markup is the poster: the visit booked. html.hero-motion turns the loop on. */
.hx-eyebrow{margin:0;font:500 15px/20px Inter,sans-serif;color:var(--brand)}
.hx-stage{margin-left:0;margin-right:0}
:where(.hx-stage,.hx-under) p{margin:0}
.hx-stage{--glass:rgb(255 255 255 / .8);--glass-edge:rgb(255 255 255 / .75);--faint:rgb(14 18 24 / .26);--ease-out:cubic-bezier(0.23,1,0.32,1)}
/* ---------- The intro card ---------- */
.hx-stage { position: relative; margin-top: 64px; height: clamp(560px, 46vw, 660px); border-radius: 28px; overflow: hidden; background: #C9C4B5; isolation: isolate; }
.hx-photo { position: absolute; inset: 0; overflow: hidden; }
.hx-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 40% 22%; transform-origin: 44% 30%; }
.hx-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgb(20 16 10 / .14), transparent 30%, transparent 62%, rgb(20 16 10 / .16)), linear-gradient(0deg, rgb(20 16 10 / .18), transparent 30%); }

.hx-glass { background: var(--glass); -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); border: 1px solid var(--glass-edge); box-shadow: 0 1px 2px rgb(14 18 24 / .06), 0 16px 40px -12px rgb(40 30 10 / .3); }
.hx-ico { flex: none; display: block; }
.hx-card { position: absolute; z-index: 2; border-radius: 20px; padding: 18px; }
.hx-head { display: flex; align-items: center; gap: 8px; height: 20px; font: 500 15px/20px Inter, sans-serif; }
.hx-head small { font-size: 15px; color: var(--t3); font-weight: 400; }
.hx-line { margin-top: 10px; font: 500 17px/1.4 Inter, sans-serif; text-wrap: balance; }
.hx-line span { color: var(--ink); }
.hx-en { margin-top: 4px; font-size: 15px; line-height: 1.45; color: var(--t3); }

/* caller, top left */
.hx-caller { left: 28px; top: 28px; width: 340px; }
.hx-caller .hx-head { color: var(--brand); }
.hx-caller .hx-head b { font-weight: 600; color: var(--ink); }

/* Sona, top right; lavender marks the agent */
.hx-col { position: absolute; z-index: 2; right: 28px; top: 28px; bottom: 28px; width: 380px; display: flex; flex-direction: column; justify-content: space-between; gap: 12px; }
.hx-col .hx-card { position: relative; inset: auto; }
.hx-sona .hx-head { color: var(--ai); }
.hx-chips { display: flex; gap: 8px; margin-top: 14px; }
.hx-chip { flex: 1; height: 40px; border-radius: 999px; background: rgb(255 255 255 / .8); border: 1px solid var(--line); color: var(--ink); font: 500 15px/1 Inter, sans-serif; font-variant-numeric: tabular-nums; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.hx-chip.hx-is-picked { background: var(--brand); border-color: var(--brand); color: #fff; }
.hx-chip:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .hx-chip:not(.hx-is-picked):hover { background: #fff; border-color: rgb(13 110 110 / .45); } }

/* Dr Lim's day, bottom right */
.hx-sched .hx-head { height: auto; align-items: flex-start; gap: 10px; color: var(--brand); }
.hx-sched .hx-head b { display: block; font-weight: 600; color: var(--ink); line-height: 20px; }
.hx-sched .hx-head small { display: block; line-height: 20px; }
.hx-rows { display: grid; gap: 6px; margin-top: 14px; }
.hx-slot { display: grid; grid-template-columns: 76px 1fr; align-items: center; height: 40px; padding: 0 12px; border-radius: 12px; background: rgb(255 255 255 / .6); font-size: 15px; transition: background-color .45s var(--ease-out); }
.hx-slot time { color: var(--t3); font-variant-numeric: tabular-nums; }
.hx-slot .hx-bar { display: block; width: 52%; height: 8px; border-radius: 4px; background: rgb(14 18 24 / .1); }
.hx-slot__open, .hx-slot__who { grid-column: 2; grid-row: 1; transition: opacity .35s var(--ease-out), transform .45s var(--ease-out); }
.hx-slot__open { color: var(--t3); }
.hx-slot__who { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 20px; line-height: 20px; opacity: 0; }
.hx-slot__who b { font-weight: 600; }
.hx-slot__who .hx-ico { color: var(--brand); }
.hx-slot.hx-is-booked { background: var(--brand-s); }
.hx-slot.hx-is-booked .hx-slot__who { opacity: 1; }
.hx-slot.hx-is-booked .hx-slot__open { opacity: 0; }
.hx-remind { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-left: 12px; font-size: 15px; line-height: 20px; color: var(--t3); transition: opacity .45s var(--ease-out), transform .45s var(--ease-out); }

/* the live call, bottom left */
.hx-call { position: absolute; z-index: 2; left: 28px; bottom: 28px; display: flex; align-items: center; gap: 12px; padding: 8px 20px 8px 8px; border-radius: 999px; }
.hx-call__icon { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 999px; background: var(--brand); color: #fff; }
.hx-call__who b { display: block; font: 600 15px/20px Inter, sans-serif; }
.hx-call__who small { display: block; font-size: 14px; line-height: 20px; color: var(--t3); }
.hx-timer { margin-left: 4px; font: 500 14px/20px "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; color: var(--t3); }
.hx-timer--in { display: none; }
.hx-timer--in .hx-timer { margin: 0; font-size: 13px; }
.hx-wave { display: flex; align-items: center; gap: 3px; height: 22px; }
.hx-wave i { width: 3px; height: 22px; border-radius: 2px; background: var(--brand); transform: scaleY(var(--h, .5)); transition: background-color .3s ease; }
.hx-wave i:nth-child(1) { --h: .4; } .hx-wave i:nth-child(2) { --h: .85; } .hx-wave i:nth-child(3) { --h: .6; } .hx-wave i:nth-child(4) { --h: 1; } .hx-wave i:nth-child(5) { --h: .45; }

.hx-ghost { position: absolute; z-index: 5; display: grid; place-items: center; border-radius: 999px; background: var(--brand); color: #fff; font: 500 15px/1 Inter, sans-serif; pointer-events: none; will-change: transform; }

.hx-under { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 14px; font-size: 14px; color: var(--t3); }
.hx-hint { display: none; }
.hx-has-js .hx-hint { display: inline; }
.hx-pause { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px 0 10px; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--ink); font: 500 14px/1 Inter, sans-serif; cursor: pointer; white-space: nowrap; transition: background-color .2s ease; }
.hx-pause:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.hx-pause[hidden] { display: none; }
.hx-pause .hx-i-play { display: none; }
.hx-pause[aria-pressed="true"] .hx-i-play { display: block; }
.hx-pause[aria-pressed="true"] .hx-i-pause { display: none; }
@media (hover: hover) and (pointer: fine) { .hx-pause:hover { background: rgb(255 255 255 / .7); } }

/* ---------- Motion. Without JS or with reduced motion the markup is the poster: the visit booked. ---------- */
.hero-motion .hx-photo img { animation: hx-drift 20s ease-in-out infinite alternate; }
@keyframes hx-drift { from { transform: scale(1.01); } to { transform: scale(1.05) translate(-0.5%, 0.3%); } }
.hero-motion .hx-caller, .hero-motion .hx-sona, .hero-motion .hx-sched, .hero-motion .hx-call { transition: opacity .55s var(--ease-out), transform .55s var(--ease-out); }
.hero-motion .hx-sched { transition-delay: .12s; }
.hero-motion .hx-caller, .hero-motion .hx-sona, .hero-motion .hx-sched, .hero-motion .hx-call, .hero-motion .hx-chip, .hero-motion .hx-slot__who, .hero-motion .hx-remind { will-change: transform; }
.hero-motion .hx-stage:not(.b-call) .hx-call { opacity: 0; transform: translateY(10px) scale(.97); }
.hero-motion .hx-stage:not(.b-cards) .hx-caller, .hero-motion .hx-stage:not(.b-cards) .hx-sched { opacity: 0; transform: translateY(10px) scale(.98); }
.hero-motion .hx-stage:not(.b-sona) .hx-sona { opacity: 0; transform: translateY(10px) scale(.98); }
.hero-motion .hx-caller { transform-origin: 0 0; } .hero-motion .hx-sona, .hero-motion .hx-sched { transform-origin: 100% 0; } .hero-motion .hx-call { transform-origin: 0 100%; }
.hero-motion .hx-stage.b-out .hx-caller, .hero-motion .hx-stage.b-out .hx-sona, .hero-motion .hx-stage.b-out .hx-sched, .hero-motion .hx-stage.b-out .hx-call { opacity: 0; transform: none; transition-duration: .7s; transition-delay: 0s; }

/* words are read aloud: each one darkens as it is said, so the cards never change size */
.hero-motion .hx-line span { transition: color .3s ease; }
.hero-motion .hx-stage.b-c1 .hx-t1 span, .hero-motion .hx-stage.b-s1 .hx-t2 span { transition-delay: calc(var(--i) * 150ms); }
.hero-motion .hx-stage:not(.b-c1) .hx-t1 span, .hero-motion .hx-stage:not(.b-s1) .hx-t2 span { color: var(--faint); transition-delay: 0s; }
.hero-motion .hx-en { transition: opacity .45s var(--ease-out); }
.hero-motion .hx-stage:not(.b-c1en) .hx-t1 + .hx-en, .hero-motion .hx-stage:not(.b-s1en) .hx-t2 + .hx-en { opacity: 0; transition-duration: 0s; }

.hero-motion .hx-chip { transition: opacity .4s var(--ease-out), transform .4s var(--ease-out), background-color .25s ease, color .25s ease, border-color .25s ease; }
.hero-motion .hx-stage.b-slots .hx-chip { transition-delay: calc(var(--c, 0) * 70ms), calc(var(--c, 0) * 70ms), 0s, 0s, 0s; }
.hero-motion .hx-stage:not(.b-slots) .hx-chip { opacity: 0; transform: translateY(6px) scale(.96); pointer-events: none; }
.hero-motion .hx-stage:not(.b-pick) .hx-chip.hx-is-picked { background: rgb(255 255 255 / .8); border-color: var(--line); color: var(--ink); }
.hx-chip.hx-is-pressed { transform: scale(.95) !important; transition-duration: .12s !important; }

.hero-motion .hx-stage:not(.b-filled) .hx-slot.hx-is-booked { background: rgb(255 255 255 / .6); }
.hero-motion .hx-stage:not(.b-filled) .hx-slot.hx-is-booked .hx-slot__who { opacity: 0; transform: translateX(-6px); }
.hero-motion .hx-stage:not(.b-filled) .hx-slot.hx-is-booked .hx-slot__open { opacity: 1; }
.hero-motion .hx-stage.b-filled .hx-slot.hx-is-booked .hx-slot__who { transition-delay: .1s; }
.hero-motion .hx-stage:not(.b-remind) .hx-remind { opacity: 0; transform: translateY(4px); }

.hero-motion .hx-stage.b-live.b-talk-c .hx-wave i, .hero-motion .hx-stage.b-live.b-talk-s .hx-wave i { animation: hx-talk 1.05s ease-in-out infinite; }
.hero-motion .hx-stage.b-talk-s .hx-call .hx-wave i { background: var(--ai); }
.hero-motion .hx-stage:not(.b-talk-c):not(.b-talk-s) .hx-call .hx-wave i, .hero-motion .hx-stage:not(.b-live) .hx-call .hx-wave i { transform: scaleY(.18); }
.hx-wave i:nth-child(2) { animation-delay: -.3s !important; } .hx-wave i:nth-child(3) { animation-delay: -.6s !important; }
.hx-wave i:nth-child(4) { animation-delay: -.15s !important; } .hx-wave i:nth-child(5) { animation-delay: -.45s !important; }
@keyframes hx-talk { 0%, 100% { transform: scaleY(.25); } 50% { transform: scaleY(1); } }
.hx-stage.hx-is-paused .hx-photo img, .hx-stage.hx-is-paused .hx-wave i { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .hx-photo img, .hx-wave i { animation: none !important; } }

/* ---------- Tablet ---------- */
@media (max-width: 1100px) {
  .hx-stage { height: 600px; }
  .hx-caller { left: 20px; top: 20px; width: 280px; }
  .hx-col { right: 20px; top: 20px; bottom: 20px; width: 344px; }
  .hx-call { left: 20px; bottom: 20px; }
  .hx-line { font-size: 16px; }
}
/* ---------- Phone and small tablet: the photo on top, the cards laid out under it on a warm tray ---------- */
@media (max-width: 900px) {
  .hx-stage { height: auto; display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "photo photo" "caller sched" "sona sched"; gap: 12px; padding: 0 14px 14px; background: var(--band); border-radius: 24px; align-items: start; }
  .hx-photo { position: relative; grid-area: photo; margin: 0 -14px 2px; height: min(52vw, 400px); }
  .hx-photo img { object-position: 42% 24%; }
  .hx-shade { inset: 0 0 auto; height: min(52vw, 400px); background: linear-gradient(0deg, rgb(20 16 10 / .28), transparent 45%); }
  .hx-col { display: contents; }
  .hx-card, .hx-col .hx-card { position: relative; inset: auto; width: auto; }
  .hx-caller { grid-area: caller; } .hx-sona { grid-area: sona; } .hx-sched { grid-area: sched; }
  .hx-call { left: 14px; bottom: auto; top: calc(min(52vw, 400px) - 76px); }
  .hx-glass { background: rgb(255 255 255 / .86); }
  .hero-motion .hx-photo img { animation: none; transform: none; }
}
@media (max-width: 600px) {
  .hx-stage { margin-top: 36px; grid-template-columns: 1fr; grid-template-areas: "photo" "caller" "sona" "sched"; gap: 10px; padding: 0 12px 12px; border-radius: 22px; }
  .hx-photo { margin: 0 -12px 2px; height: 280px; }
  .hx-shade { height: 280px; }
  .hx-call { left: 12px; top: 212px; gap: 10px; padding: 6px 16px 6px 6px; }
  .hx-call__icon { width: 44px; height: 44px; }
  .hx-call__who b { font-size: 14px; white-space: nowrap; }
  .hx-call__who small { font-size: 13px; white-space: nowrap; }
  .hx-long, .hx-timer--wide { display: none; }
  .hx-timer--in { display: inline; }
  .hx-card { padding: 16px; border-radius: 18px; }
  .hx-chip { font-size: 14px; }
  .hx-under { align-items: flex-start; flex-direction: column; gap: 10px; }
}
@media (max-width: 360px) { .hx-call .hx-wave { display: none; } .hx-slot { grid-template-columns: 68px 1fr; } }

/* proof marquee */
.proof{padding:96px 0 104px}
.proof .h4{font-weight:500;color:var(--ink);text-align:center;font-size:22px;line-height:30px}
.mq{margin-top:36px;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mq-t{display:flex;gap:12px;width:max-content;animation:mq 60s linear infinite}
.mq-t span{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px;border-radius:999px;background:#fff;border:1px solid var(--line);font:500 14px/20px Inter,sans-serif;color:var(--t2);white-space:nowrap}
.mq-t span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--spruce-400)}
@keyframes mq{to{transform:translateX(-50%)}}

/* why: accordion with progress */
.why .grid{display:grid;grid-template-columns:400px 1fr 340px;gap:56px;align-items:start}
.why-vis{position:relative;height:552px;border-radius:16px;background:radial-gradient(120% 120% at 100% 0%,#0F7676 0%,#0D6E6E 50%,#0A5A5A 100%);overflow:hidden}
.why-vis figure{position:absolute;inset:28px 28px 0;margin:0;border-radius:14px 14px 0 0;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.16),0 30px 50px -20px rgba(5,48,48,.6);opacity:0;transition:opacity .5s var(--e-brand),transform .6s var(--e-brand);transform:scale(.985)}
.why-vis figure.on{opacity:1;transform:none}
.why-vis img{width:100%;height:100%;object-fit:cover;object-position:top}
.chat{position:absolute;inset:0;padding:20px;display:flex;flex-direction:column;gap:12px;background:#fff}
.chat-h{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.chat-h img{width:28px;height:28px}
.chat-h b{font:600 14px/18px Onest,sans-serif}
.bub{max-width:86%;padding:10px 12px;font-size:14px;line-height:21px}
.bub.p{align-self:flex-end;background:var(--brand);color:#fff;border-radius:14px 14px 4px 14px}
.bub.s{background:#fff;border:1px solid var(--line);border-radius:14px 14px 14px 4px}
.bub small{display:block;font-size:12px;line-height:16px;margin-top:4px;opacity:.82}
.bub.s small{color:var(--t3);opacity:1}
.chat .cap{margin-top:auto}
.acc{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.acc li{border-bottom:1px solid var(--line-2);position:relative}
.acc button{all:unset;box-sizing:border-box;text-wrap:balance;display:flex;gap:14px;align-items:center;width:100%;padding:20px 0;cursor:pointer;font:600 18px/26px Onest,sans-serif;letter-spacing:-.01em;color:var(--t3);transition:color .3s}
.acc li.on button{color:var(--ink)}
.acc .ic{width:36px;height:36px;border-radius:10px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;flex:none;color:var(--brand)}
.acc .ic svg{width:18px;height:18px}
.acc .pnl{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s cubic-bezier(.65,0,.35,1)}
.acc li.on .pnl{grid-template-rows:1fr}
.acc .pnl>div{overflow:hidden}
.acc .pnl p{margin:0 0 22px 50px;color:var(--t2);font-size:15px;line-height:23px}
.acc .prog{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--brand);transform-origin:left;transform:scaleX(0)}

/* platform diagram */
.pf-head{display:grid;grid-template-columns:1fr 448px;gap:56px;align-items:end}
.pf-head .lead{margin:0}
/* platform diagram: channels -> Sona card -> destinations, joined by dotted traced connectors (src/flow.ts draws the SVG) */
.dia>*{min-width:0}
.dia{position:relative;margin-top:56px;display:grid;grid-template-columns:240px minmax(0,520px) 240px;justify-content:space-between;column-gap:96px;align-items:center;background:var(--band);border-radius:20px;padding:40px 36px}
.dia>.side,.dia>.core{position:relative;z-index:1}
.flow{position:absolute;left:0;top:0;pointer-events:none;overflow:visible}
.flow path{fill:none;stroke:rgba(14,18,24,.4);stroke-width:1.75;stroke-dasharray:0 6.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s ease,stroke-width .3s ease}
.flow path.on{stroke:rgba(13,110,110,.7)}
.flow path.hl{stroke:var(--brand);stroke-width:2.25}
.flow .rv{stroke:#fff;stroke-width:10;stroke-dasharray:none;transition:none}
.flow .pk{fill:var(--brand)}
.flow g path{animation:flow-march 1.1s linear infinite paused}
.flow.run g path{animation-play-state:running}
@keyframes flow-march{to{stroke-dashoffset:-6.5}}
.flow .pk-h{fill:rgba(13,110,110,.18)}
.col-t{font:600 13px/18px Onest,sans-serif;color:var(--ink);margin:0}
.col-s{font-size:12px;line-height:16px;color:var(--t2);margin:2px 0 14px}
.nodes{display:flex;flex-direction:column;gap:14px}
.node{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;border-radius:10px;background:#fff;border:1px solid var(--line);font:500 13px/18px Inter,sans-serif;transition:background-color .35s var(--e-brand),color .35s,border-color .35s}
.node svg{width:16px;height:16px;flex:none;color:var(--t3);transition:color .35s}
.node.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.node.on svg{color:#fff}
@media (hover:hover) and (pointer:fine){.node:not(.on):hover{border-color:#8FCBC4}}
.node small{margin-left:auto;font:500 11px/14px Inter,sans-serif;color:var(--warn);background:var(--warn-s);padding:2px 6px;border-radius:6px;white-space:nowrap}
.node.on small{color:var(--warn);background:var(--warn-s)}
.core{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 1px 2px rgba(14,18,24,.04),0 16px 40px -24px rgba(13,110,110,.35)}
.core-h{display:flex;align-items:center;gap:12px}
.core-h img{width:32px;height:32px}
.core-h b{display:block;font:600 17px/22px Onest,sans-serif}
.core-h span{display:block;font-size:12.5px;line-height:17px;color:var(--t2)}
.act{display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px 14px;border-radius:14px;background:var(--canvas);border:1px solid var(--line)}
.av{width:36px;height:36px;border-radius:50%;flex:none;display:grid;place-items:center;font:600 13px/1 Onest,sans-serif;color:#fff;background:var(--brand);transition:background-color .35s ease}
.act .who{min-width:0;flex:1}
.act .who b{display:block;font:600 14px/20px Inter,sans-serif;color:var(--ink)}
.act .who span{display:block;margin-top:2px;font-size:12px;line-height:16px;color:var(--t2)}
.act-r{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.dots{display:flex;gap:4px;align-items:center}
.dots i{width:14px;height:4px;border-radius:2px;background:var(--line-2);transition:background-color .35s}
.dots i.on{background:var(--brand)}
.grp{margin-top:18px}
.grp h5{margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--line-2);font:500 13px/16px Inter,sans-serif;color:var(--t3)}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:10px;min-height:74px;padding:12px;border-radius:12px;border:1px solid var(--line);background:#fff;font:500 13px/17px Inter,sans-serif;color:var(--ink);transition:background-color .35s var(--e-brand),border-color .35s,color .35s}
.tile>svg{width:16px;height:16px;flex:none;color:var(--t3);transition:color .35s}
.tile .ck{position:absolute;top:10px;right:10px;width:16px;height:16px;border-radius:5px;border:1.5px solid var(--line-2);background:#fff;display:grid;place-items:center;transition:background-color .3s,border-color .3s}
.tile .ck svg{width:10px;height:10px;color:#fff;opacity:0;transform:scale(.6);transition:opacity .25s,transform .45s var(--e-spring)}
.tile.on{background:var(--brand-s);border-color:#8FCBC4;color:var(--spruce-700)}
.tile.on>svg{color:var(--spruce-700)}
.tile.on .ck{background:var(--brand);border-color:var(--brand)}
.tile.on .ck svg{opacity:1;transform:none}
.feat3{display:grid;grid-template-columns:repeat(3,1fr);gap:56px;margin-top:56px;padding:0 36px}
.feat3 .ico{width:24px;height:24px;color:var(--brand);margin-bottom:14px}

/* product tabs */
.tabs{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:var(--track);margin-top:36px}
.tab{position:relative;all:unset;box-sizing:border-box;position:relative;height:40px;padding:0 18px;border-radius:9px;font:600 14px/40px Inter,sans-serif;color:var(--t2);cursor:pointer;overflow:hidden;transition:background-color .25s,color .25s}
.tab[aria-selected=true]{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(14,18,24,.08)}
.tab .tp{position:absolute;left:10px;right:10px;bottom:5px;height:2px;border-radius:1px;background:var(--brand);transform:scaleX(0);transform-origin:left}
.screen{position:relative;margin:40px auto 0;max-width:1120px;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(14,18,24,.07),0 2px 4px rgba(14,18,24,.04),0 40px 80px -40px rgba(14,18,24,.28)}
/* one shot per tab: a recorded clip (wide, and a closer square cut for phones) or a still */
.screen .shot{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s var(--e-brand),visibility 0s .6s}
.screen .shot.on{opacity:1;visibility:visible;transition:opacity .6s var(--e-brand)}
.screen .shot>*{display:block;width:100%;height:100%;object-fit:cover;object-position:top left}
.screen .shot>.v-sm{display:none}
.scr-under{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;max-width:1120px;margin:20px auto 0;text-align:left}
.scr-under .hx-pause{flex:none;border-color:var(--line-2);background:rgb(255 255 255 / .55)}
.tcap{max-width:640px;margin:0;min-height:48px;color:var(--t2);font-size:16px;line-height:24px}

/* split sections */
.split{display:grid;grid-template-columns:1fr 1fr;gap:96px;align-items:center}
.list{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}
.list li{display:flex;gap:12px;align-items:flex-start;color:var(--t2)}
.list svg{width:20px;height:20px;flex:none;color:var(--brand);margin-top:2px}
.price-inline{display:inline-flex;align-items:baseline;gap:6px;margin-top:28px;padding:10px 14px;border-radius:10px;background:#fff;border:1px solid var(--line);font-size:14px;color:var(--t2)}
.price-inline b{font:600 18px/24px Onest,sans-serif;color:var(--ink)}
.scribe-vis{display:grid;place-items:center;padding:48px 0 80px;border-radius:20px;background:var(--band)}
.scribe-vis .phone{width:270px}
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:6px;font:600 11px/16px Inter,sans-serif}
.badge.w{background:var(--warn-s);color:var(--warn)}
.badge.ai{background:var(--ai-s);color:var(--ai)}
.badge.ok{background:var(--ok-s);color:var(--ok)}
.t-med{color:#176F45;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.t-cond{color:#8F611C;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.t-lab{color:#4F5864;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.code{font:500 12px/20px "IBM Plex Mono",monospace;padding:0 7px;border-radius:6px;background:var(--mist);border:1px solid var(--line);color:var(--t2)}

/* patients */
.pt-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:80px;align-items:center}
.phones{position:relative;height:640px}
.phones .phone{position:absolute;width:268px}
.phones .p1{left:8%;top:0}
.phones .p2{left:48%;top:72px}
.langs{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.lang{height:36px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font:500 15px/34px Inter,sans-serif;color:var(--ink)}
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}
.card .h4{font-size:18px;line-height:26px}
.card p{margin:8px 0 0;font-size:14px;line-height:21px;color:var(--t2)}
.rule{margin-top:12px!important;padding:10px 12px;border-radius:10px;background:var(--mist);border:1px solid var(--line)}
.card .badge{margin-top:10px}

/* safety */
.safe4{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
.safe4 .card{padding:24px}
.safe4 .ico,.deid .ico{width:40px;height:40px;border-radius:10px;background:var(--brand-s);color:var(--brand);display:grid;place-items:center;margin-bottom:20px}
.safe4 .ico svg,.deid .ico svg{width:20px;height:20px}
/* one message, two views: as written, and with the name, IC and phone swapped for the product's own labels.
   Plain radios, so it works without script and by keyboard. */
.deid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;margin-top:56px;padding:40px;border-radius:20px;background:var(--band)}
.deid .ico{background:#fff}
.deid .body{max-width:42ch}
.deid-card{display:flex;flex-wrap:wrap;align-content:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 1px 2px rgba(14,18,24,.04),0 16px 40px -24px rgba(13,110,110,.35)}
.deid-card input{position:absolute;width:1px;height:1px;margin:-1px;opacity:0;pointer-events:none}
.deid-card label{padding:4px 2px;background:var(--track);cursor:pointer;-webkit-user-select:none;user-select:none}
.deid-card label:first-of-type{padding-left:4px;border-radius:12px 0 0 12px}
.deid-card label:last-of-type{padding-right:4px;border-radius:0 12px 12px 0}
.deid-card label span{display:block;height:40px;padding:0 16px;border-radius:9px;font:600 14px/40px Inter,sans-serif;color:var(--t2);white-space:nowrap;transition:background-color .25s,color .25s}
.deid-card input:checked+label span{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(14,18,24,.08)}
.deid-card input:focus-visible+label span{outline:2px solid var(--spruce-400);outline-offset:2px}
.deid-msg{flex:1 1 100%;margin:20px 0 0;min-height:108px;font:500 17px/36px Inter,sans-serif;color:var(--ink)}
.dd-w{padding:3px 6px;border-radius:6px;background:var(--mist100);white-space:nowrap}
.dd-c{display:none;vertical-align:middle;height:26px;padding:0 9px;border-radius:7px;border:1px solid;font:600 13px/24px Inter,sans-serif;white-space:nowrap}
.dd-n .dd-c{background:#E8EFFB;border-color:#B9CDEE;color:#1F4E9C}
.dd-i .dd-c{background:#E0F0F3;border-color:#A8D0D8;color:#0F5F6E}
.dd-p .dd-c{background:#FBE7EE;border-color:#EBB9CB;color:#9B1C4B}
#dv-m:checked~.deid-msg .dd-w{display:none}
#dv-m:checked~.deid-msg .dd-c{display:inline-block;animation:dd-in .32s var(--e-out) both}
#dv-m:checked~.deid-msg .dd-i .dd-c{animation-delay:70ms}
#dv-m:checked~.deid-msg .dd-p .dd-c{animation-delay:.14s}
@keyframes dd-in{from{opacity:0;transform:scale(.9)}}
.deid-st{flex:1 1 100%;margin:8px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:14px;line-height:20px;color:var(--t2)}
.deid-st .st-m{display:none;align-items:center;gap:6px;color:var(--ok);font-weight:500}
.deid-st svg{width:16px;height:16px;flex:none}
#dv-m:checked~.deid-st .st-w{display:none}
#dv-m:checked~.deid-st .st-m{display:flex}
.notclaim{margin-top:20px;display:flex;gap:14px;align-items:flex-start;padding:18px 22px;border-radius:16px;border:1px solid var(--line-2);background:transparent;color:var(--t2);font-size:15px;line-height:23px}
.notclaim b{color:var(--ink);font-weight:600;white-space:nowrap}
.notclaim span{max-width:72ch}

/* numbers: the one dark band */
.dark{background:#0E1218;color:#fff}
.num-head,.num-grid{position:relative;z-index:1}
/* the ribbon sits between heading and stats and sticks at the viewport's vertical centre while the band scrolls past */
.gz{position:sticky;top:calc(50vh - 170px);top:calc(50svh - 170px);z-index:0;height:340px;margin:16px 0;-webkit-mask:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);mask:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}
.dark .over{color:#8FCBC4}
.dark .h2{color:#fff}
.dark .aside{color:#B3BCC6}
.num-grid{display:grid;grid-template-columns:440px 1fr;gap:96px;align-items:center}
.dark .phone{width:320px;margin:0 auto;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 40px 80px -30px rgba(0,0,0,.8)}
.stats{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:56px 48px}
/* ink under the stats (ribbon at most ~0.12 behind text), feathered at the edges */
.stats::before{content:"";position:absolute;inset:-48px -56px;z-index:-1;pointer-events:none;background:rgba(14,18,24,.88);-webkit-mask:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent),linear-gradient(transparent,#000 40px,#000 calc(100% - 40px),transparent);-webkit-mask-composite:source-in;mask:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent),linear-gradient(transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-composite:intersect}
.stat{border-left:2px solid var(--spruce-400);padding-left:24px}
.fig{font:300 72px/72px Onest,sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums;display:flex;align-items:flex-end;height:72px;overflow:hidden}
.fig .u{font-size:28px;line-height:36px;letter-spacing:-.01em;margin-left:6px;font-weight:400;color:#DFE4E9}
.odo{display:inline-flex;align-items:flex-start;height:72px;overflow:hidden;vertical-align:bottom}
.odo i{font-style:normal}
.odo span{display:block;transition:transform 1.6s cubic-bezier(.16,1,.3,1)}
.odo span b{display:block;height:72px;font-weight:300}
.stat p{margin:14px 0 0;color:#CDD4DB;font-size:16px;line-height:24px}
.stat p small{display:block;color:#95A0AC;font-size:13px;line-height:18px;margin-top:4px}

/* prices */
.pr-head{display:grid;grid-template-columns:1fr 420px;gap:56px;align-items:end}
.pr-head .lead{margin:0}
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px}
.tier{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px 24px 24px;display:flex;flex-direction:column}
.tier.core{border:1.5px solid var(--ink)}
.tier .tag{position:absolute;top:-12px;left:24px;height:24px;padding:0 10px;border-radius:6px;background:var(--ink);color:#fff;font:600 12px/24px Inter,sans-serif}
.tier .h4{font-size:18px;line-height:26px}
.price{display:flex;align-items:baseline;gap:6px;margin-top:18px}
.price b{font:600 40px/44px Onest,sans-serif;letter-spacing:-.02em}
.price .rm{font:500 18px/24px Onest,sans-serif;color:var(--t2)}
.price span{font-size:14px;color:var(--t3)}
.tier p{margin:14px 0 0;font-size:14px;line-height:21px;color:var(--t2)}
.tier .badge{align-self:flex-start;margin-top:auto}
.tier .incl{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;line-height:19px;color:var(--t3)}
.bundle{margin-top:16px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px 28px}
.bundle .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.bundle .chips span{height:30px;padding:0 12px;border-radius:999px;background:var(--brand-s);color:var(--spruce-700);font:500 13px/30px Inter,sans-serif}
.fine{margin-top:20px;font-size:13px;line-height:20px;color:var(--t3)}

/* faq */
.faq-grid{display:grid;grid-template-columns:1fr 620px;gap:96px;align-items:start}
.faq-l{position:sticky;top:120px}
.faq-l .btn{margin-top:32px}
.qa{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.qa li{border-bottom:1px solid var(--line-2)}
.qa button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:36px 1fr 24px;align-items:center;width:100%;padding:22px 0;cursor:pointer;font:500 18px/26px Inter,sans-serif;letter-spacing:-.01em;color:var(--ink)}
.qa .n{font:500 13px/26px "IBM Plex Mono",monospace;color:var(--t3)}
.qa .x{width:20px;height:20px;position:relative;justify-self:end}
.qa .x::before,.qa .x::after{content:"";position:absolute;left:3px;right:3px;top:9px;height:1.5px;background:var(--ink);border-radius:1px;transition:transform .45s var(--e-spring)}
.qa .x::after{transform:rotate(90deg)}
.qa li.on .x::before{transform:rotate(45deg)}.qa li.on .x::after{transform:rotate(135deg)}
.qa .a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.65,0,.35,1)}
.qa li.on .a{grid-template-rows:1fr}
.qa .a>div{overflow:hidden}
.qa .a p{margin:0 24px 24px 36px;color:var(--t2);font-size:16px;line-height:25px}

/* footer: briefing + links on spruce, Data Pixel Arc band at the foot */
.ftr{position:relative;isolation:isolate;background:#0E1218;color:#fff;padding:120px 0 380px;overflow:hidden}
.ftr>.wrap{position:relative;z-index:1}
.bloom{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.ftr-cta{text-align:center;padding-bottom:96px}
.ftr-cta .h2{color:#fff;font-size:3.5rem;line-height:1.071;max-width:760px;margin:0 auto}
.ftr-cta .lead{color:#F2F9F8;max-width:560px;margin-left:auto;margin-right:auto}
.ftr-cta .btn{margin-top:32px}
.cta-note{margin:14px 0 0;font-size:13px;line-height:18px;color:#F2F9F8;min-height:18px}
.cta-note[hidden]{display:block;visibility:hidden}
.ftr-g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-top:56px;border-top:1px solid rgba(255,255,255,.22)}
.logo.plate{display:inline-flex;padding:8px 14px 8px 10px;background:#fff;border-radius:12px}
.ftr .logo img{height:36px}
.ftr p.t{margin:16px 0 0;color:#F2F9F8;font-size:15px;line-height:23px;max-width:320px}
.ftr h6{margin:0 0 14px;font:600 13px/18px Onest,sans-serif;color:#fff}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ftr ul a{text-decoration:none;color:#F2F9F8;font-size:14px;line-height:20px}
.ftr :focus-visible{outline-color:#fff}
.legal{margin-top:56px;padding-top:24px;border-top:1px solid rgba(255,255,255,.22);display:flex;justify-content:space-between;gap:24px;font-size:13px;line-height:20px;color:#E3F2F0}
.legal p{margin:0;max-width:760px}

/* motion: reveals (JS adds .js on body) */
.js .wd{display:inline-block;opacity:0;filter:blur(6px);transform:translateY(.35em);transition:opacity .8s var(--e-out),filter .8s var(--e-out),transform .8s var(--e-out);transition-delay:var(--d,0s)}
.js .split-in .wd{opacity:1;filter:none;transform:none}
.js [data-rv]{opacity:0;transform:translateY(16px);transition:opacity .65s var(--e-out),transform .65s var(--e-out);transition-delay:var(--d,0s)}
.js [data-media]{opacity:0;transform:translateY(28px) scale(.97);transition:opacity 1s var(--e-brand),transform 1s cubic-bezier(.455,.03,.515,.955)}
.js .in[data-rv],.js .in[data-media]{opacity:1;transform:none}

/* tablet */
@media (max-width:1180px){
  .why .grid{grid-template-columns:1fr 1fr;gap:40px}
  .why .grid>.intro{grid-column:1/-1}
  .dia{grid-template-columns:minmax(0,600px);justify-content:center;row-gap:64px;padding:28px}
  .pf-head .lead,.pr-head .lead{max-width:640px}
  .dia .side .nodes{flex-direction:row;flex-wrap:wrap}
  .dia .side .node{flex:1 1 180px}
  .tiers{grid-template-columns:1fr 1fr}
  .deid{gap:40px;padding:28px}
}
@media (max-width:1100px){
  .nav{display:none}
  .burger{display:inline-flex;margin-left:8px}
  .hdr .btn-sm{margin-left:auto}
  /* phone and tablet menu: a frosted card under the bar; Solutions drills in */
  .scrim{display:block;position:fixed;inset:0;z-index:38;background:rgb(14 18 24 / .28);opacity:0;visibility:hidden;transition:opacity .25s var(--e-out),visibility 0s .25s}
  .scrim.open{opacity:1;visibility:visible;transition:opacity .25s var(--e-out)}
  .sheet{display:block;position:fixed;z-index:39;top:calc(var(--sheet-top,123px) + 8px);left:var(--gut);right:var(--gut-r);max-height:calc(100dvh - var(--sheet-top,123px) - 16px - env(safe-area-inset-bottom,0px));overflow:hidden auto;overscroll-behavior:contain;border-radius:20px;background:rgba(248,246,241,.9);-webkit-backdrop-filter:blur(24px) saturate(1.5);backdrop-filter:blur(24px) saturate(1.5);border:1px solid rgb(255 255 255 / .7);box-shadow:0 24px 48px -16px rgb(14 18 24 / .3);
    opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transform-origin:100% 0;transition:opacity .16s var(--e-out),transform .16s var(--e-out),visibility 0s .16s}
  .sheet.open{opacity:1;visibility:visible;transform:none;transition:opacity .2s var(--e-out),transform .3s var(--e-brand)}
  .mm-track{display:grid;overflow:hidden;transition:height .32s var(--e-brand)}
  .mm-pane{grid-area:1/1;align-self:start;padding:8px;transition:transform .32s var(--e-brand),opacity .2s var(--e-out)}
  .mm-sub{visibility:hidden;transition:transform .32s var(--e-brand),opacity .2s var(--e-out),visibility 0s .32s}
  .sheet.sub .mm-sub{visibility:visible;transition:transform .32s var(--e-brand),opacity .2s var(--e-out) .06s}
  @media (min-width:761px){.sheet{left:auto;width:400px}}
  .sheet.sub #mm-main{transform:translateX(-24%);opacity:0;visibility:hidden;transition:transform .32s var(--e-brand),opacity .2s var(--e-out),visibility 0s .32s}
  .mm-sub{transform:translateX(24%);opacity:0}
  .sheet.sub .mm-sub{transform:none;opacity:1}
  .mm-rows{list-style:none;margin:0;padding:0}
  .mm-rows li+li{border-top:1px solid var(--line)}
  .mm-r{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:56px;padding:0 16px;border:0;border-radius:14px;background:none;font:500 18px/24px Onest,sans-serif;color:var(--ink);text-align:left;text-decoration:none;cursor:pointer}
  .mm-r .cr{width:16px;height:16px;color:var(--t3)}
  .mm-r:active,.mm-a:active,.mm-back:active{background:rgb(14 18 24 / .05)}
  .mm-cta{display:flex;justify-content:center;width:100%;height:52px;margin-top:8px;font-size:16px}
  .mm-back{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 12px 0 8px;border:0;border-radius:999px;background:none;font:500 15px/20px Inter,sans-serif;color:var(--t2);cursor:pointer}
  .mm-back svg{width:16px;height:16px}
  .mm-grp{padding:8px 0 4px}
  .mm-grp+.mm-grp{border-top:1px solid var(--line);margin-top:4px}
  .mm-h{margin:0;padding:8px 16px 4px;font:500 14px/20px Inter,sans-serif;color:var(--t3)}
  .mm-grp ul{list-style:none;margin:0;padding:0}
  .mm-a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:0 16px;border-radius:14px;font:500 18px/24px Onest,sans-serif;color:var(--ink);text-decoration:none}
  .mm-a .ar{width:16px;height:16px;flex:none;color:var(--t3)}
  .mm-sub .mg-foot{margin:4px 0 0}
  .stats::before{inset:-32px -16px}
  .split,.pt-grid,.num-grid,.faq-grid,.pf-head,.pr-head{grid-template-columns:1fr;gap:48px}
  .deid{grid-template-columns:1fr;gap:28px}
  .num-grid>[data-media]{order:2}
  .faq-l{position:static}
}
/* phone, portrait or landscape */
@media (max-width:760px),(max-width:1100px) and (max-height:500px){
  .sec{padding:72px 0}
  .bar{font-size:13px;line-height:18px;padding-top:9px;padding-bottom:9px}
  .bar-x{display:none}
  .bar-pill{margin-right:6px}
  .hdr .wrap{height:64px;gap:8px}
  .logo img{height:28px}
  .logo{min-height:44px}
  .hdr .btn-sm{display:none}
  .burger{margin-left:auto}
  .dock{display:flex}
  .step,.node small,.badge{font-size:12px}
  .h1{font-size:2.375rem;line-height:1.158;letter-spacing:-.02em}
  .h2{font-size:1.875rem;line-height:1.2;letter-spacing:-.02em}
  .aside{font-size:1.125rem;line-height:1.444}
  .hero{padding-top:32px}
  /* one line: the full line needs 371 px at 11 px, so narrower phones get the short one */
  .hero .h1{font-size:clamp(31px,9.4vw,38px);line-height:1.16;margin-top:20px}
  .lead{font-size:1.0625rem;line-height:1.529}
  .ctas{margin-top:24px}
  .ctas .btn{flex:1 1 auto;justify-content:center}
  .proof{padding:64px 0 72px}
  .proof .h4{font-size:19px;line-height:27px}
  .why .grid{grid-template-columns:1fr;gap:32px}
  .why-vis{height:440px;order:2}
  .acc{order:1}
  .dia{padding:20px 16px;row-gap:56px}
  .core{padding:16px}
  .node{height:auto;min-height:40px;padding:8px 12px;flex-wrap:wrap;row-gap:4px}
  .act{flex-wrap:wrap;row-gap:8px}
  .act-r{flex-direction:row;align-items:center;justify-content:space-between;width:100%;padding-left:48px}
  .tiles{gap:6px}
  .tile{min-height:70px;padding:10px;font-size:12.5px;line-height:16px}
  .tile .ck{top:8px;right:8px}
  .feat3{grid-template-columns:1fr;gap:32px;padding:0;margin-top:40px}
  .tabs{display:flex;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:none;height:44px;line-height:44px;padding:0 14px;white-space:nowrap}
  .screen{border-radius:14px}
  .scr-under{flex-direction:column;gap:12px}
  .tcap{min-height:72px}
  .scribe-vis{padding:36px 0 72px}
  .scribe-vis .phone{width:240px}
  .phones{height:548px}
  .phones .phone{width:206px}
  .phones .p1{left:0}.phones .p2{left:auto;right:0;top:56px}
  .cards2{grid-template-columns:1fr}
  .safe4{grid-template-columns:1fr;gap:12px;margin-top:12px}
  .deid{margin-top:40px;padding:20px 16px;gap:24px}
  .deid-card{padding:16px}
  .deid-card label span{padding:0 12px;font-size:13.5px}
  .deid-msg{font-size:16px;line-height:34px;min-height:136px}
  .notclaim{flex-direction:column;gap:4px}
  .stats{gap:40px 20px}
  .stats::before{inset:-32px -16px;-webkit-mask:linear-gradient(transparent,#000 32px,#000 calc(100% - 32px),transparent);mask:linear-gradient(transparent,#000 32px,#000 calc(100% - 32px),transparent)}
  .fig,.odo,.odo span b{font-size:52px;height:56px;line-height:56px}
  .fig .u{font-size:20px;line-height:28px}
  .stat{padding-left:16px}
  .dark .phone{width:240px}
  .tiers{grid-template-columns:minmax(0,1fr);margin-top:40px}
  .bundle{grid-template-columns:1fr;padding:22px}
  .qa button{font-size:16px;line-height:24px;grid-template-columns:32px 1fr 24px}
  .qa .a p{margin-left:32px;margin-right:0}
  .ftr{padding:72px 0 260px}
  .ftr-cta{padding-bottom:64px}
  .ftr-cta .h2{font-size:2.125rem;line-height:1.176}
  .gz{height:240px;margin:8px 0;top:calc(50vh - 120px);top:calc(50svh - 120px)}
  .ftr-g{grid-template-columns:1fr 1fr}
  .ftr-g>div:first-child{grid-column:1/-1}
  .legal{flex-direction:column}
}
/* phone, portrait: the product clips switch to their closer square cuts */
@media (max-width:760px){
  .screen{aspect-ratio:1/1}
  .screen .shot>.v-lg{display:none}
  .screen .shot>.v-sm{display:block}
  .screen img{object-position:22% 0;transform:scale(1.7);transform-origin:36% 6%}
}
/* the narrowest phones, and any phone at 200% text size */
@media (max-width:359px){
  .act-r{padding-left:0}
  .phones .phone{width:min(206px,62%)}
  .dock .btn-s{display:none}
  .dark .phone{width:min(240px,100%)}
  .stats{grid-template-columns:1fr}
}
/* a phone on its side: the sticky header gives back height */
@media (max-width:1100px) and (max-height:500px){.hdr .wrap{height:56px}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mega,.mega.open,.sheet,.sheet.open,.mm-pane,.mm-track,.mg-pill,.nav-i .chev{transform:none!important;transition-property:opacity,visibility!important}
  .sheet.sub #mm-main,.mm-sub{transform:none!important}
  .mq-t{animation:none;flex-wrap:wrap;justify-content:center;width:auto}
  .mq-t span:nth-child(n+8){display:none}
  .mq{-webkit-mask:none;mask:none}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .flow g path{animation:none!important}
}
/* footer F: the briefing CTA stays above the dithered footer */
.ftr.ftr-f{padding-bottom:0}
.ftr.ftr-f .ftr-cta{padding-bottom:88px}
/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-outline-style:solid}}}@layer theme{:root,:host{--color-emerald-500:oklch(69.6% .17 162.48);--color-black:#000;--spacing:.25rem;--container-xs:20rem;--container-3xl:48rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--font-weight-semibold:600;--radius-sm:.25rem;--radius-md:.375rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1)}}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.relative{position:relative}.inset-x-0{inset-inline:calc(var(--spacing)*0)}.bottom-0{bottom:calc(var(--spacing)*0)}.isolate{isolation:isolate}.col-span-2{grid-column:span 2/span 2}.mx-2{margin-inline:calc(var(--spacing)*2)}.mx-auto{margin-inline:auto}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.-mr-1{margin-right:calc(var(--spacing)*-1)}.-mb-\[0\.06em\]{margin-bottom:-.06em}.mb-4{margin-bottom:calc(var(--spacing)*4)}.-ml-\[0\.05em\]{margin-left:-.05em}.flex{display:flex}.grid{display:grid}.inline{display:inline}.inline-flex{display:inline-flex}.h-1\.5{height:calc(var(--spacing)*1.5)}.h-3\.5{height:calc(var(--spacing)*3.5)}.h-4{height:calc(var(--spacing)*4)}.h-9{height:calc(var(--spacing)*9)}.h-\[clamp\(11rem\,19vw\,17rem\)\]{height:clamp(11rem,19vw,17rem)}.w-1\.5{width:calc(var(--spacing)*1.5)}.w-3\.5{width:calc(var(--spacing)*3.5)}.w-9{width:calc(var(--spacing)*9)}.w-px{width:1px}.max-w-3xl{max-width:var(--container-3xl)}.max-w-\[1312px\]{max-width:1312px}.max-w-xs{max-width:var(--container-xs)}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))}.gap-x-5{column-gap:calc(var(--spacing)*5)}.gap-x-6{column-gap:calc(var(--spacing)*6)}.gap-y-2{row-gap:calc(var(--spacing)*2)}.gap-y-12{row-gap:calc(var(--spacing)*12)}.overflow-hidden{overflow:hidden}.rounded-full{border-radius:3.40282e38px}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-border{border-color:#ffffff29}.bg-background{background-color:#0e1218}.bg-border{background-color:#ffffff29}.bg-emerald-500{background-color:var(--color-emerald-500)}.px-1{padding-inline:calc(var(--spacing)*1)}.pt-5{padding-top:calc(var(--spacing)*5)}.pt-16{padding-top:calc(var(--spacing)*16)}.pb-16{padding-bottom:calc(var(--spacing)*16)}.font-display{font-family:Onest,Inter,system-ui,sans-serif}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.text-\[clamp\(6\.5rem\,21vw\,17rem\)\]{font-size:clamp(6.5rem,21vw,17rem)}.leading-5{--tw-leading:calc(var(--spacing)*5);line-height:calc(var(--spacing)*5)}.leading-\[0\.8\]{--tw-leading:.8;line-height:.8}.leading-\[1\.533\]{--tw-leading:1.533;line-height:1.533}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[-0\.03em\]{--tw-tracking:-.03em;letter-spacing:-.03em}.tracking-\[-0\.05em\]{--tw-tracking:-.05em;letter-spacing:-.05em}.text-black{color:var(--color-black)}.text-foreground{color:#fff}.text-muted-foreground{color:#b3bcc6}.opacity-\[0\.72\]{opacity:.72}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.hover\:bg-foreground\/5:hover{background-color:oklab(100% 0 5.96046e-8/.05)}.hover\:text-foreground:hover{color:#fff}}.focus-visible\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-\[var\(--df-accent\)\]:focus-visible{outline-color:var(--df-accent)}@media (min-width:40rem){.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-x-10{column-gap:calc(var(--spacing)*10)}}@media (min-width:48rem){.md\:col-span-1{grid-column:span 1/span 1}.md\:grid-cols-\[minmax\(0\,1\.6fr\)_repeat\(3\,minmax\(0\,1fr\)\)\]{grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr))}}@media (pointer:coarse){.\[\@media\(pointer\:coarse\)\]\:inline-flex{display:inline-flex}.\[\@media\(pointer\:coarse\)\]\:h-11{height:calc(var(--spacing)*11)}.\[\@media\(pointer\:coarse\)\]\:min-h-11{min-height:calc(var(--spacing)*11)}.\[\@media\(pointer\:coarse\)\]\:w-11{width:calc(var(--spacing)*11)}.\[\@media\(pointer\:coarse\)\]\:items-center{align-items:center}:where(.\[\@media\(pointer\:coarse\)\]\:space-y-0>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*0)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*0)*calc(1 - var(--tw-space-y-reverse)))}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}
@media (max-width:360px){.mm-a,.mm-r{font-size:16px;line-height:22px}}