/* Syraxis marketing.
   Light shell, near-black type, gold only on Start free + one hero accent.
   Display: Barlow Condensed. Body: Inter. One frame system: bare PNG in a hairline rounded card; shadow only on the hero. */

/* Width-matched stand-in so condensed headings (the featured tabs especially)
   do not wrap onto a second line while Barlow Condensed is still loading. */
@font-face{
  font-family:"Head Fallback";
  src:local("Arial"),local("Helvetica Neue"),local("Roboto"),local("Liberation Sans"),local("Nimbus Sans");
  font-style:normal;
  font-weight:100 900;
  size-adjust:73.5%;
  ascent-override:92%;
  descent-override:22%;
  line-gap-override:0%;
}
:root{
  --bg:#FBFBF9; --white:#FFFFFF; --stage:#F1F0EC; --stage-2:#EAE9E4;
  --ink:#121314; --ink-2:#3A3C40; --muted:#6E7076; --faint:#A2A4A9;
  --line:#E6E5E0; --line-2:#D6D5CF; --hair:rgba(18,19,20,.12);
  --gold:#D4AA3A; --gold-hover:#C79D2D;
  --night:#0F0F0F; --night-2:#1A1A1A; --night-line:rgba(255,255,255,.12); --night-ink:#F4F4F2; --night-muted:#A6A7AA;
  --head:"Barlow Condensed","Head Fallback","Arial Narrow",sans-serif; --body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1240px; --gut:40px; --band:112px; --r:12px; --r-phone:24px;
  --hero-shadow:0 1px 1px rgba(18,19,20,.04),0 8px 16px -6px rgba(18,19,20,.08),0 32px 64px -16px rgba(18,19,20,.20),0 72px 120px -48px rgba(18,19,20,.22);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"cv11","ss01"}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
p,h1,h2,h3,h4,dl,dd,ul,ol,figure{margin:0}
ul,ol{padding:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.wrap{max-width:calc(var(--wrap) + var(--gut)*2);margin:0 auto;padding:0 var(--gut)}

/* ---------- type: three display steps, one body, one meta ---------- */
.d1{font:600 88px/.94 var(--head);letter-spacing:-.018em;text-wrap:balance}
.d1--hero{font-size:104px;line-height:.9;letter-spacing:-.022em}
.d1--close{font-size:88px}
.d2{font:600 60px/.98 var(--head);letter-spacing:-.014em;text-wrap:balance}
.d2--xl{font-size:84px;line-height:.92;letter-spacing:-.02em}
.d3{font:600 40px/1 var(--head);letter-spacing:-.01em}
.lead{font-size:20px;line-height:1.55;color:var(--ink-2);max-width:34em;text-wrap:pretty}
.intro{font-size:18px;line-height:1.6;color:var(--muted);max-width:32em;text-wrap:pretty}
.meta{font:500 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.fine{font-size:13.5px;line-height:1.5;color:var(--muted)}
.more{display:inline-flex;align-items:center;gap:8px;font:500 15.5px/1 var(--body);color:var(--ink);text-decoration:none;padding:6px 0;border-bottom:1px solid var(--line-2);transition:border-color .15s,gap .15s}
.more:hover{border-color:var(--ink);gap:11px}
.arr{flex:none}
code{font-size:.9em}
strong{font-weight:600;color:var(--ink)}

/* ---------- buttons ---------- */
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:9px;font:600 15px/1 var(--body);text-decoration:none;white-space:nowrap;transition:background .15s,box-shadow .15s,color .15s}
.btn--primary{background:var(--gold);color:var(--ink)}
.btn--primary:hover{background:var(--gold-hover)}
.btn--secondary{background:var(--white);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn--secondary:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.btn--sm{height:36px;padding:0 15px;font-size:14px;border-radius:8px}
.btn--lg{height:52px;padding:0 26px;font-size:16px;border-radius:10px}
.btn--block{width:100%}
a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:30;background:rgba(251,251,249,.78);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s,background .2s}
.nav--scrolled{border-bottom-color:var(--line);background:rgba(251,251,249,.9)}
.nav-in{display:flex;align-items:center;height:68px;gap:48px}
.wordmark{font:700 21px/1 var(--head);letter-spacing:.26em;text-decoration:none;color:var(--ink)}
/* Header mark only. Letters rise in once on load. */
.nav .wordmark[data-reveal="on"]{display:inline-block}
.nav .wordmark .wm-ch{display:inline-block;animation:wm-ch .95s cubic-bezier(.16,1,.3,1) both}
.nav .wordmark .wm-ch:nth-child(1){animation-delay:.06s}
.nav .wordmark .wm-ch:nth-child(2){animation-delay:.14s}
.nav .wordmark .wm-ch:nth-child(3){animation-delay:.22s}
.nav .wordmark .wm-ch:nth-child(4){animation-delay:.30s}
.nav .wordmark .wm-ch:nth-child(5){animation-delay:.38s}
.nav .wordmark .wm-ch:nth-child(6){animation-delay:.46s}
.nav .wordmark .wm-ch:nth-child(7){animation-delay:.54s}
@keyframes wm-ch{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .nav .wordmark .wm-ch{animation:none}
}
.nav-links{display:flex;gap:32px;flex:1}
.nav-links a,.nav-login{font-size:14.5px;font-weight:500;color:var(--muted);text-decoration:none;transition:color .15s}
.nav-links a:hover,.nav-login:hover,.nav-links a[aria-current]{color:var(--ink)}
.nav-cta{display:flex;align-items:center;gap:24px}
.nav-toggle{display:none;align-items:center;justify-content:center;flex:none;width:44px;height:44px;border-radius:8px;color:var(--ink)}
.nav-toggle:hover{background:var(--stage)}
.nav-toggle-bars{position:relative;display:block;width:18px;height:14px}
.nav-toggle-bars::before,.nav-toggle-bars::after{content:"";position:absolute;left:0;top:6px;width:18px;height:2px;background:currentColor;border-radius:1px}
.nav-toggle-bars::before{box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::before{box-shadow:none;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bars::after{transform:rotate(-45deg)}
@media (prefers-reduced-motion:no-preference){
  .nav-toggle-bars::before,.nav-toggle-bars::after{transition:transform .16s ease,box-shadow .16s ease}
}
/* Covers the page under the bar, including .cmp thead th (z-index:2). */
.nav-panel{display:none;position:absolute;z-index:40;top:100%;left:0;right:0;height:calc(100vh - 69px);height:calc(100dvh - 69px);overflow:auto;overscroll-behavior:contain;background:rgba(18,19,20,.28)}
.nav-panel-links{display:flex;flex-direction:column;padding:8px var(--gut) 28px;background:var(--bg);border-top:1px solid var(--line);box-shadow:0 18px 40px -28px rgba(18,19,20,.45)}
.nav-panel-links a:not(.btn){display:flex;align-items:center;min-height:48px;padding:12px 0;border-bottom:1px solid var(--line);font-size:17px;font-weight:500;color:var(--ink);text-decoration:none}
.nav-panel-links a:not(.btn)[aria-current]{font-weight:600}
.nav-panel-links a.btn{margin-top:20px}
.nav-toggle:focus-visible,.nav-panel-links a:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* Fixed, not overflow:hidden on the document: that breaks sticky and jumps the bar off screen. */
html.nav-lock body{position:fixed;left:0;right:0;width:100%;overflow:hidden;padding-top:69px}
html.nav-lock .nav{position:fixed;top:0;left:0;right:0}

/* ---------- frames ---------- */
.frame{position:relative;overflow:hidden;border-radius:var(--r);background:var(--night);box-shadow:0 0 0 1px var(--hair)}
.frame img{width:100%}
.frame--phone{border-radius:var(--r-phone)}
.frame--hero{box-shadow:0 0 0 1px var(--hair),var(--hero-shadow)}
.frame--empty{background:var(--white);box-shadow:none;border:1px dashed var(--line-2)}
.frame--empty.frame--desk{aspect-ratio:16/10}
.frame--empty.frame--phone{aspect-ratio:780/1688}
.ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px}
.ph-k{font:500 11px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.ph-c{font:600 26px/1.1 var(--head);color:var(--muted)}
.ph-d{font-size:13px;color:var(--faint)}

/* stage: calm neutral surface a single large shot sits on */
.stage{position:relative;border-radius:20px;background:var(--stage);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.stage--desk{padding:56px}
.stage--phone{height:760px;display:flex;justify-content:center;align-items:flex-start;padding-top:64px;min-width:0;max-width:100%}
.stage--phone .frame{width:min(440px,100%);flex:none;max-width:100%;min-width:0}
.stage--phone .frame--empty{width:320px}
.stage--phone .frame:not(.frame--empty){border-bottom-left-radius:0;border-bottom-right-radius:0}

/* two-places composite: desk home + phone due today, both hairline cards */
.stage--duo{position:relative;padding:48px 48px 0;height:640px;margin-bottom:40px}
.duo-desk{width:82%}
.duo-desk .frame{border-bottom-left-radius:0;border-bottom-right-radius:0}
.duo-phone{position:absolute;right:64px;top:120px;width:300px}
.duo-phone .frame{box-shadow:0 0 0 1px var(--hair),0 0 0 8px var(--stage)}
.second{padding:8px 0 48px}
.stage--second.stage--phone{height:640px}
.stage--second.stage--phone .frame{width:360px}

/* ---------- hero ---------- */
.hero{padding:40px 0 72px;background:linear-gradient(180deg,var(--bg) 0%,var(--bg) 55%,#F5F4F0 100%)}
.hero-in{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:72px;align-items:start}
.hero-copy{max-width:640px;padding-top:28px}
.accent{display:block;width:44px;height:3px;border-radius:2px;background:var(--gold);margin-bottom:20px}
.hero-sub{font-size:20px;line-height:1.55;color:var(--ink-2);max-width:31em;margin-top:16px;text-wrap:pretty}
.hero .ctas{margin-top:24px}
.hero .fine{margin-top:12px}
.hero-visual{display:flex;justify-content:flex-end}
.hero-visual .frame{width:440px}

/* ---------- product showcase (tabs) ---------- */
.show{padding:var(--band) 0 calc(var(--band) - 16px);border-top:1px solid var(--line)}
.show-head{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
.tabs{display:flex;flex-wrap:nowrap;gap:4px 44px;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{position:relative;flex:none;font:600 60px/1 var(--head);letter-spacing:-.014em;color:#C4C4C0;padding-bottom:14px;white-space:nowrap;transition:color .2s}
.tab:hover{color:var(--ink-2)}
.tab[aria-selected="true"]{color:var(--ink)}
.tab::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.tab[aria-selected="true"]::after{transform:scaleX(1)}
.panel-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;margin-bottom:28px}
.panel-body{font-size:20px;line-height:1.55;color:var(--ink-2);max-width:40em;text-wrap:pretty}
/* globals.css paints every .panel as a near-black card. Showcase copy stays on the paper. */
.show .panel{background:transparent;border:0;border-radius:0;color:inherit;box-shadow:none}
.panel .stage--phone{height:auto;aspect-ratio:1240/958;padding-top:56px}
.panel .stage--phone .frame{width:min(440px,100%)}

/* ---------- offline: full-bleed dark band, one large phone ---------- */
.ink{background:var(--night);color:var(--night-ink);padding:96px 0;overflow:hidden}
.ink-in{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:72px;align-items:center}
.ink-copy{max-width:560px}
.ink-body{font-size:19px;line-height:1.6;color:var(--night-muted);margin:16px 0 24px;text-wrap:pretty}
.ink .more{color:var(--night-ink);border-color:rgba(255,255,255,.28)}
.ink .more:hover{border-color:var(--night-ink)}
.ink .frame{box-shadow:0 0 0 1px var(--night-line);background:var(--night-2)}
.ink .frame--empty{background:transparent;border-color:var(--night-line)}
.ink-visual .frame{width:420px}

/* ---------- generic bands ---------- */
.band{padding:var(--band) 0}
.band--rule{border-top:1px solid var(--line)}
.band--flush{padding-top:8px}
.head2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:end;margin-bottom:48px}
.head2 .intro{justify-self:end}
.safety-files{display:flex;flex-direction:column;gap:16px}
.safety-files>.stage{margin-top:32px}

.places{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)}
.place{padding:28px 48px 0 0}
.place + .place{padding:28px 0 0 48px;border-left:1px solid var(--line)}
.place p{margin-top:12px;font-size:19px;line-height:1.65;color:var(--ink-2);max-width:30em}

.fits{display:grid;grid-template-columns:400px minmax(0,1fr);gap:64px;align-items:start}
.fits-head{position:sticky;top:120px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.fits-list{list-style:none;border-top:1px solid var(--line)}
.fits-list li{display:grid;grid-template-columns:56px 1fr;gap:16px;padding:26px 0;border-bottom:1px solid var(--line)}
.fits-list .n{font:500 13px/2 var(--body);color:var(--faint);font-variant-numeric:tabular-nums}
.fits-list p{font-size:19px;line-height:1.55;color:var(--ink-2)}

.start{max-width:980px}
.statement{font:500 38px/1.22 var(--body);letter-spacing:-.02em;color:var(--ink);margin-top:16px;text-wrap:pretty}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.chip{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 18px;border-radius:999px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line-2);font:500 15px/1 var(--body);text-decoration:none;color:var(--ink);transition:box-shadow .15s}
.chip:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.chips--sm{margin-top:20px;gap:8px}
.chips--sm .chip{height:32px;padding:0 13px;font-size:13.5px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:72px;padding-top:32px;border-top:1px solid var(--line)}
.duo > div > p:not(.meta){margin-top:12px;color:var(--ink-2);max-width:30em}
.duo .more{margin-top:20px}
.tier-mini{list-style:none;margin-top:24px;border-top:1px solid var(--line);max-width:30em}
.tier-mini li{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.tier-mini li span:first-child{font-weight:600}
.tier-mini li span:last-child{color:var(--muted);font-variant-numeric:tabular-nums}

/* ---------- closing ---------- */
.close{background:var(--stage);border-top:1px solid var(--line);padding:96px 0}
.close-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.close .d1{max-width:12em}
.close .ctas{margin-top:28px;justify-content:center}
.close .fine{margin-top:12px}

/* ---------- page heads ---------- */
.phead{padding:64px 0 48px}
.phead-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:end}
.phead-in .lead{justify-self:end}
.phead--center{text-align:center}
.phead--center .lead{margin:16px auto 0}

/* ---------- modules index ---------- */
.modgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mod{position:relative;display:flex;flex-direction:column;min-height:280px;padding:32px 32px 28px;border-radius:16px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line);text-decoration:none;color:inherit;transition:box-shadow .18s,transform .18s}
a.mod:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.mod-n{font:500 12.5px/1 var(--body);color:var(--faint);font-variant-numeric:tabular-nums}
.mod-name{display:flex;align-items:center;gap:12px;font:600 40px/1 var(--head);letter-spacing:-.01em;margin-top:28px}
.mod-line{margin-top:14px;font-size:16px;line-height:1.55;color:var(--ink-2);text-wrap:pretty}
.mod-where{margin-top:auto;padding-top:24px;font-size:13px;color:var(--muted)}
.mod--start{background:var(--stage);box-shadow:inset 0 0 0 1px var(--line)}
.mod--start .mod-line{margin:20px 0 28px}
.mod--start .btn{align-self:flex-start;margin-top:auto}
.tag{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2);font:600 11px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.tag--lg{height:28px;padding:0 12px;font-size:12px;margin-left:20px;vertical-align:middle;position:relative;top:-14px}
.under{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;border-top:1px solid var(--line)}
.under > div{padding:24px 0;border-bottom:1px solid var(--line)}
.under dt{font:600 26px/1.1 var(--head)}
.under dd{margin-top:8px;color:var(--ink-2);font-size:16px}

/* ---------- module detail ---------- */
.mhead{padding:40px 0 40px}
.crumbs{display:flex;gap:10px;font-size:14px;color:var(--muted);margin-bottom:28px}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--ink)}
.mhead-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:end}
.mhead-side .ctas{margin-top:20px}
.mshot{padding-bottom:24px}
.stage--page.stage--desk{padding:64px}
.stage--page.stage--phone{height:800px}
.stage--page.stage--phone .frame{width:420px}
.band--doc{padding-top:72px}
.row{display:grid;grid-template-columns:400px minmax(0,1fr);gap:64px;padding:32px 0;border-top:1px solid var(--line)}
.row:first-child{border-top-color:var(--ink)}
.row-h{font:600 36px/1.02 var(--head);letter-spacing:-.008em}
.prose{max-width:38em;color:var(--ink-2);font-size:17.5px;line-height:1.65}
.prose p + p,.prose p + ul,.prose p + ol,.prose ul + p,.prose ol + p{margin-top:16px}
.prose ul,.prose ol{list-style:none;display:grid;gap:12px}
.prose ul li{position:relative;padding-left:22px}
.prose ul li::before{content:"";position:absolute;left:2px;top:.72em;width:7px;height:1.5px;background:var(--ink)}
.prose ol{counter-reset:o}
.prose ol li{position:relative;padding-left:36px;counter-increment:o}
.prose ol li::before{content:counter(o,decimal-leading-zero);position:absolute;left:0;top:.18em;font:500 13px/1.6 var(--body);color:var(--faint);font-variant-numeric:tabular-nums}
.prose a{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.prose--sm{font-size:15.5px;line-height:1.6}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px;padding-top:28px;border-top:1px solid var(--ink)}
.facts:has(.fact:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
.facts:has(.fact:only-child){grid-template-columns:minmax(0,40em)}
.fact .prose{margin-top:16px}
.pn{border-top:1px solid var(--line)}
.pn-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;padding-top:40px;padding-bottom:40px}
.pn a{text-decoration:none}
.pn-prev,.pn-next{display:flex;flex-direction:column;gap:12px}
.pn-next{text-align:right;align-items:flex-end}
.pn-name{font:600 34px/1 var(--head);transition:color .15s}
.pn-prev:hover .pn-name,.pn-next:hover .pn-name{color:var(--muted)}
.pn-all{font-size:14.5px;font-weight:500;color:var(--muted)}
.pn-all:hover{color:var(--ink)}

/* ---------- pricing ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.tier{display:flex;flex-direction:column;padding:36px 32px 32px;border-radius:18px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
.tier--rec{box-shadow:inset 0 0 0 1.5px var(--ink)}
.tier-top{display:flex;align-items:center;justify-content:space-between;min-height:28px;gap:12px}
.tier-name{font:600 32px/1 var(--head);letter-spacing:-.005em}
.badge{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:var(--gold);font:600 11.5px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.price{display:flex;align-items:baseline;gap:10px;margin-top:28px;flex-wrap:wrap}
.amt{font:600 72px/.9 var(--head);letter-spacing:-.02em}
.per{font-size:14.5px;color:var(--muted);max-width:9em}
.annual{margin-top:8px;font-size:13.5px;color:var(--muted);min-height:1.4em}
.tier-who{margin-top:20px;padding-top:20px;border-top:1px solid var(--line);font-size:15.5px;line-height:1.5;color:var(--ink-2);text-wrap:pretty}
.tier-block{margin-top:24px}
.tier-block .meta{margin-bottom:12px}
.ticks{list-style:none;display:grid;gap:11px}
.ticks li{position:relative;padding-left:26px;font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.ticks li::before{content:"";position:absolute;left:2px;top:.42em;width:10px;height:5.5px;border-left:1.6px solid var(--ink);border-bottom:1.6px solid var(--ink);transform:rotate(-45deg)}
.tier-block--limits{margin-top:28px;padding:20px 18px 18px;border-radius:12px;background:var(--stage);box-shadow:inset 0 0 0 1px var(--line)}
.limits{list-style:none;display:grid;gap:8px;margin-top:4px}
.limits li{display:flex;justify-content:space-between;gap:16px;align-items:baseline;font-size:14px;line-height:1.4}
.limits .lim-k{color:var(--ink-2)}
.limits .lim-v{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.limits .lim-full{color:var(--ink-2);font-weight:500}
.notinc{margin-top:24px}
.notinc .meta{margin-bottom:10px}
.notinc-list{list-style:none;display:grid;gap:8px}
.notinc-list li{font-size:13.5px;line-height:1.5;color:var(--muted)}
.tier-cta{display:grid;gap:10px;margin-top:auto;padding-top:28px}
.tier-note{margin-top:16px;font-size:12.5px;line-height:1.5;color:var(--muted);text-wrap:pretty}
.tier-limits-note{margin-top:12px;font-size:12.5px;line-height:1.45;color:var(--muted);text-wrap:pretty}
.cmp-note{margin-top:14px;font-size:13.5px;line-height:1.5;color:var(--muted);max-width:52em;text-wrap:pretty}
.cmp-note a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* comparison tables */
.cmp-head{margin-bottom:32px}
.cmp-stack{display:grid;gap:40px}
.cmp-group{min-width:0}
.cmp-label{font:600 22px/1.1 var(--head);letter-spacing:-.005em;margin-bottom:14px;color:var(--ink)}
/* clip, not auto: overflow-x:auto would also scroll on y and become the sticky
   scrollport, so top would shove each header down over the first data row. */
.cmp-scroll{overflow:clip;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);background:var(--white)}
.cmp{width:100%;border-collapse:collapse;min-width:640px;font-size:14.5px;table-layout:fixed}
.cmp thead th{position:sticky;top:69px;z-index:2;background:var(--stage);font:500 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:left;padding:14px 18px;border-bottom:1px solid var(--line)}
.cmp thead th.cmp-feat{width:32%;background:var(--stage)}
.cmp thead th:not(.cmp-feat){width:22.6667%}
.cmp thead th.cmp-pro{color:var(--ink);font-weight:600}
.cmp tbody th{font-weight:500;color:var(--ink);text-align:left;padding:14px 18px;border-bottom:1px solid var(--line);width:32%;vertical-align:top}
.cmp tbody td{padding:14px 18px;border-bottom:1px solid var(--line);color:var(--ink-2);font-variant-numeric:tabular-nums;vertical-align:top}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp .cmp-pro{font-weight:600;color:var(--ink);box-shadow:inset 1px 0 0 var(--line)}
.cmp-cell--out{color:var(--faint)}
.cmp-cell--in{color:var(--ink)}
.cmp-cell--dash{color:var(--faint)}

.faq{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;border-top:1px solid var(--line)}
.faq > div{padding:28px 0;border-bottom:1px solid var(--line)}
.faq dt{font-weight:600;font-size:17.5px}
.faq dd{margin-top:8px;color:var(--ink-2)}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--line);padding:64px 0 32px;background:var(--bg)}
.foot-in{display:grid;grid-template-columns:1.35fr .9fr .9fr .8fr .75fr;gap:32px}
.foot-brand p{margin-top:20px;font-size:14.5px;line-height:1.6;color:var(--muted);max-width:26em}
.foot-col h4{font:500 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:20px}
.foot-col ul{list-style:none;display:grid;gap:11px}
.foot-col a{font-size:14.5px;color:var(--ink-2);text-decoration:none}
.foot-col a:hover{color:var(--ink)}
.foot-stores{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:40px;padding-top:28px;border-top:1px solid var(--line)}
.foot-stores a{display:inline-flex;line-height:0}
.foot-stores img{display:block;height:40px;width:auto}
.foot-stores .store-play{height:60px}
/* ---------- responsive ---------- */
@media (max-width:1180px){
  :root{--band:88px;--gut:32px}
  .d1--hero{font-size:84px}.d1,.d1--close{font-size:72px}.d2--xl{font-size:68px}.d2{font-size:52px}.tab{font-size:48px}
  .hero-in{grid-template-columns:minmax(0,1fr) 360px;gap:56px}.hero-visual .frame{width:360px}
  .ink-in{grid-template-columns:minmax(0,1fr) 360px;gap:64px}.ink-visual .frame{width:360px}
  .fits,.row{grid-template-columns:300px minmax(0,1fr);gap:56px}
}
@media (max-width:900px){
  :root{--band:72px;--gut:24px}
  .d1--hero{font-size:68px}.d1,.d1--close{font-size:60px}.d2--xl{font-size:56px}.d2{font-size:44px}.tab{font-size:38px}.statement{font-size:28px}
  .hero-in,.ink-in,.head2,.phead-in,.mhead-in,.fits,.row,.duo,.places,.tiers,.faq,.under{grid-template-columns:1fr}
  .cmp thead th{position:static}
  .cmp-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .hero-visual,.ink-visual{justify-content:center}.hero-visual .frame,.ink-visual .frame{width:min(380px,100%)}
  .head2 .intro,.phead-in .lead{justify-self:start}
  .place,.place + .place{padding:32px 0 0;border-left:0}
  .fits-head{position:static}
  .modgrid{grid-template-columns:1fr 1fr}
  .panel-copy{grid-template-columns:1fr;gap:20px}
  .stage--desk,.stage--page.stage--desk{padding:20px}
  .stage--phone,.panel .stage--phone,.stage--page.stage--phone{height:560px}
  .stage--phone .frame,.panel .stage--phone .frame,.stage--page.stage--phone .frame{width:min(300px,100%)}
  .panel .stage--phone{height:auto;aspect-ratio:auto;padding:32px 16px 40px}
  .panel .stage--phone .frame{border-bottom-left-radius:var(--r-phone);border-bottom-right-radius:var(--r-phone)}
  .facts{grid-template-columns:1fr}
  .stage--duo{height:auto;padding:20px 20px 0}.duo-desk{width:100%}.duo-phone{display:none}
  .foot-in{grid-template-columns:1fr 1fr;align-items:start}
  .foot-brand{grid-column:1 / -1}
  .nav-links{display:none}
  .nav-in{gap:16px}
  .nav-cta{margin-left:auto;flex:none}
  .nav .wordmark{flex:none}
  .nav-toggle{display:inline-flex}
  .nav.is-open .nav-panel{display:block}
}
@media (max-width:600px){
  .d1--hero{font-size:54px}.d1,.d1--close{font-size:50px}
  .tab{font-size:clamp(21px,5.2vw,30px)}
  .tabs{gap:4px clamp(8px,2vw,16px)}
  .modgrid{grid-template-columns:1fr}
  .nav-login{display:none}
  .nav-cta{gap:12px}
}

.faq a{text-decoration:underline;text-underline-offset:3px}