/* Homepage v2.1. Layout stays here so the shared site and motion layers can evolve independently. */
.page--home {
  --band-ink:#0a0a0a;
  --band-raised:#121212;
  --band-text:#fff;
  --band-muted:#c9cbd0;
  --band-secondary:#a2a5aa;
  --band-line:rgb(255 255 255 / .12);
  --paper:#f5f4f1;
  --paper-line:#d9d9d6;
  --paper-muted:#55585e;
  --fs-display:clamp(3.5rem,2rem + 6vw,7rem);
  --fs-h2:clamp(2.25rem,1.5rem + 2.6vw,3.5rem);
  --gutter:clamp(16px,4vw,32px);
  background:var(--band-ink);
  color:var(--band-text);
  font:400 17px/1.6 var(--font);
  -webkit-font-smoothing:antialiased;
}
.page--home .wrap { width:100%; max-width:1280px; margin:0 auto; padding-inline:var(--gutter) }
.page--home h1,.page--home h2 { font-weight:500; font-variation-settings:"opsz" 144; text-wrap:initial }
.page--home h2 { font-size:var(--fs-h2); line-height:1.05; letter-spacing:-.02em; max-width:18ch }
.page--home .eyebrow { font:600 12px/1.4 var(--font); letter-spacing:.12em; text-transform:uppercase; color:var(--band-muted); margin:0 }
.page--home .lede { font:400 clamp(1.1rem,1rem + .6vw,1.35rem)/1.5 var(--font); color:var(--band-muted); max-width:52ch; margin-top:28px }
.page--home .btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 22px; border-radius:999px; font:600 15px/1 var(--font); text-decoration:none; cursor:pointer; white-space:nowrap }
.page--home .btn-solid,.page--home .btn-primary { border:0; background:linear-gradient(180deg,#fff,#dcdde0); color:#0a0a0a; box-shadow:0 1px 0 rgb(255 255 255 / .6) inset,0 10px 30px -12px rgb(255 255 255 / .35) }
.page--home .btn-ink { border:0; background:#0a0a0a; color:#fff }
.page--home .masthead { --bg:#0a0a0a; --surface:#121212; --surface-2:#1a1a1a; --ink:#fff; --ink-muted:#c9cbd0; --line:#383838; --line-ui:#8a8d93; background:rgb(10 10 10 / .88); backdrop-filter:blur(14px); border-bottom:1px solid var(--line) }
.page--home .masthead-inner { min-height:64px }
.page--home .masthead .btn { min-height:40px; padding-inline:18px; font-size:14px }
.page--home .site-footer { background:var(--band-ink) }
.page--home .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0 }

/* Image, scrim, copy, then a full-width paper stage: one uninterrupted hero. */
.page--home .hero { position:relative; isolation:isolate; overflow:hidden; padding:0; background:var(--band-ink) }
.page--home .hero-bg { position:absolute; inset:0 0 auto; height:1000px; z-index:-3; display:block }
.page--home .hero-bg img { width:100%; height:100%; object-fit:cover; object-position:72% 50%; opacity:.9 }
.page--home .hero-scrim { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(10,10,10,.96) 0%,rgba(10,10,10,.9) 45%,rgba(10,10,10,.35) 78%,rgba(10,10,10,.15)),linear-gradient(180deg,rgba(10,10,10,.2),rgba(10,10,10,0) 30%,#0a0a0a 1000px) }
.page--home .grain { position:absolute; inset:0; z-index:-1; opacity:.02; pointer-events:none; background-image:repeating-linear-gradient(23deg,#fff 0 1px,transparent 1px 4px),repeating-linear-gradient(113deg,#fff 0 1px,transparent 1px 5px) }
.page--home .hero>.wrap { padding-top:clamp(56px,9vh,112px); padding-bottom:0 }
.page--home .hero-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; align-items:start }
.page--home .hero-copy { grid-column:1/10; padding:0; min-width:0 }
.page--home .hero h1 { font:500 var(--fs-display)/.98 var(--font-display); font-variation-settings:"opsz" 144; letter-spacing:-.025em; max-width:16ch; margin-top:20px }
.page--home .hero .lede { max-width:56ch; margin-top:28px }
.page--home .start { margin-top:32px; display:flex; gap:10px; max-width:640px; padding:6px; border-radius:999px; background:rgb(255 255 255 / .06); border:1px solid var(--band-secondary); backdrop-filter:blur(8px) }
.page--home .start input { flex:1; min-width:0; width:100%; height:48px; border:0; border-radius:999px; background:transparent; color:var(--band-text); font:400 16px var(--font); padding:0 18px }
.page--home .start input::placeholder { color:var(--band-secondary); opacity:1 }
.page--home .start:focus-within { outline:2px solid currentColor; outline-offset:4px }
.page--home .note { margin-top:14px; font-size:14px; color:var(--band-secondary); max-width:64ch }
.page--home .stage { grid-column:1/-1; margin:clamp(32px,5vh,56px) 0 0; min-width:0; scroll-margin-top:88px }
.page--home .hero-demo,.page--home .paper {
  --ink:#0a0a0a; --ink-muted:#55585e; --bg:#fff; --surface:#f5f4f1; --surface-2:#e9e9e6;
  --line:#d9d9d6; --line-ui:#76767f; --action:#0a0a0a; --action-ink:#fff;
  --ok:#2a2c30; --ok-tint:#fff; --warn:#2a2c30; --warn-tint:#fff;
  color-scheme:light; color:var(--ink);
}
.page--home .hero-demo { position:relative; background:var(--paper); border-radius:24px; border:1px solid var(--paper-line); box-shadow:0 40px 100px -40px rgb(0 0 0 / .8),0 1px 0 rgb(255 255 255 / .4) inset; overflow:hidden; min-height:640px; display:flex; flex-direction:column }
.page--home .demo-rail { display:flex; flex:none; gap:4px; padding:10px 108px 10px 10px; border-bottom:1px solid var(--paper-line); background:#fff; position:relative; overflow-x:auto }
.page--home .demo-rail label { flex:1; min-width:0; min-height:44px; padding:8px 10px; border-radius:999px; display:flex; flex-direction:row; align-items:center; justify-content:center; gap:10px; font:500 15px/1.2 var(--font); color:#55585e; white-space:nowrap; border:0 }
.page--home .demo-rail .step-number { font:500 13px var(--font-display); color:inherit }
.page--home .hero-demo:has(#demo-1:checked) label[for=demo-1],
.page--home .hero-demo:has(#demo-2:checked) label[for=demo-2],
.page--home .hero-demo:has(#demo-3:checked) label[for=demo-3],
.page--home .hero-demo:has(#demo-4:checked) label[for=demo-4] { background:#0a0a0a; color:#fff }
.page--home .hero-demo .demo-toggle { top:10px; right:10px; min-height:44px; padding-inline:12px; background:#fff; font-size:12px }
.page--home .hero-demo .rail-indicator { background:#55585e }
.page--home .hero-demo .rail-fill { background:#fff }
.page--home .demo-panels { flex:1; min-height:510px }
.page--home .hero-demo .demo-panel { padding:0; border:0; display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); min-width:0 }
.page--home .hero-demo:has(#demo-1:checked) .panel-1,
.page--home .hero-demo:has(#demo-2:checked) .panel-2,
.page--home .hero-demo:has(#demo-3:checked) .panel-3,
.page--home .hero-demo:has(#demo-4:checked) .panel-4 { display:grid }
.page--home .stage-chat { position:relative; isolation:isolate; padding:40px 44px; border-right:1px solid var(--paper-line); min-width:0 }
.page--home .demo-panel p { font-size:17px; line-height:1.55; max-width:62ch }
.page--home .demo-panel .speaker { font:600 12px/1 var(--font); letter-spacing:.1em; color:#55585e; margin-bottom:8px }
.page--home .demo-panel .speaker.mt { margin-top:28px }
.page--home .demo-panel .speaker:first-of-type+p { font:500 22px/1.3 var(--font-display); letter-spacing:-.01em }
.page--home .demo-chips { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px }
.page--home .hero-demo .pill { font:500 13px/1 var(--font); letter-spacing:0; text-transform:none; padding:8px 12px; border-radius:999px; background:#fff; border:1px solid var(--paper-line); color:#2a2c30 }
.page--home .hero-demo .pill--warn { margin-top:24px }
.page--home .demo-panel .draft-title { border-left:2px solid #0a0a0a; padding-left:18px; font:500 24px/1.2 var(--font-display); margin-top:18px; letter-spacing:-.01em }
.page--home .demo-panel .draft-title+.muted { padding-left:20px; margin-top:6px; font-size:15px }
.page--home .demo-panel .demo-foot { font-size:13px; color:#55585e; border:0; margin-top:22px; padding:0 }
.page--home .demo-panel .mono { overflow-wrap:anywhere }
.page--home .stage-number { position:absolute; bottom:-6px; right:12px; font:500 200px/1 var(--font-display); letter-spacing:-.04em; color:rgb(10 10 10 / .055); pointer-events:none; z-index:-1 }
.page--home .stage-rail { padding:40px 32px; background:#fff; display:flex; flex-direction:column; gap:24px; min-width:0 }
.page--home .stage-rail dl { margin:0 }
.page--home .stage-rail dt { font:600 12px/1 var(--font); letter-spacing:.1em; text-transform:uppercase; color:#55585e }
.page--home .stage-rail dd { margin:6px 0 18px; font-size:15px; color:#2a2c30; padding-bottom:16px; border-bottom:1px solid var(--paper-line) }
.page--home .stage-rail .mock-actions { margin-top:auto; display:flex; flex-direction:column; gap:10px }
.page--home .stage-rail .mock-action { display:flex; justify-content:center; align-items:center; min-height:48px; border-radius:999px; font:600 15px/1.3 var(--font); text-align:center }
.page--home .stage-status { margin-top:auto; color:#55585e; font-size:14px }
.page--home .stage-caption { max-width:none; background:var(--paper); padding:14px 44px; border-top:1px solid var(--paper-line); font-size:12px; color:#55585e }

/* Alternating surfaces organize the page without a stack of bordered boxes. */
.page--home .band { padding:clamp(72px,9vw,136px) 0; position:relative }
.page--home .band.paper { background:var(--paper); color:#0a0a0a }
.page--home .band.ink { background:var(--band-ink); color:var(--band-text) }
.page--home .band .eyebrow { color:var(--band-secondary); margin-bottom:12px }
.page--home .paper .eyebrow { color:#55585e }
.page--home .band .lede { margin-top:18px; max-width:58ch }
.page--home .paper .lede { color:#55585e }
.page--home .rule { border:0; border-top:1px solid var(--paper-line); margin:40px 0 0 }
.page--home .num { font:500 clamp(96px,6vw + 2rem,128px)/1 var(--font-display); letter-spacing:-.04em; color:currentColor; opacity:.25 }
.page--home .band-heading { display:flex; align-items:center; justify-content:space-between; gap:32px }
.page--home .band-heading>.num { font-size:128px; flex:none }
.page--home .cols3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:48px; margin-top:40px }
.page--home .cols3 h3 { font:500 24px/1.25 var(--font-display); margin-top:12px; letter-spacing:-.01em }
.page--home .cols3 p { margin-top:10px; max-width:32ch; color:#55585e; font-size:16px }
.page--home .section-link { margin-top:32px }

/* Six image-led families. The large tile and five companions fill one bento. */
.page--home .bento { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-auto-rows:240px; gap:16px; margin-top:48px }
.page--home .tile { position:relative; isolation:isolate; border-radius:20px; overflow:hidden; background:var(--band-raised); box-shadow:0 1px 0 rgb(255 255 255 / .06) inset; text-decoration:none; color:var(--band-text) }
.page--home .tile picture { position:absolute; inset:0 }
.page--home .tile img { width:100%; height:100%; object-fit:cover; opacity:.85 }
.page--home .tile .t { position:absolute; left:24px; right:24px; bottom:22px; z-index:1 }
.page--home .tile .t::before { content:""; position:absolute; inset:-100px -24px -22px; background:linear-gradient(180deg,rgba(10,10,10,0),rgba(10,10,10,.96) 70%); z-index:-1 }
.page--home .tile h3 { font:500 22px/1.2 var(--font-display); letter-spacing:-.01em }
.page--home .tile p { font-size:14px; color:var(--band-muted); margin-top:6px; max-width:34ch }
.page--home .tile .k { font:500 13px var(--font-display); color:var(--band-muted); position:absolute; left:24px; top:20px; z-index:1 }
.page--home .tile--feature { grid-column:span 6; grid-row:span 2 }
.page--home .tile--feature h3 { font-size:34px }
.page--home .tile--feature p { font-size:16px; max-width:44ch }
.page--home .tile--small { grid-column:span 3 }
.page--home .tile--wide { grid-column:span 12 }
.page--home .tile--wide p { max-width:52ch }
.page--home .tile:hover h3 { text-decoration:underline; text-underline-offset:4px }
.page--home .tile:focus-visible { outline-offset:4px }

.page--home .walk { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center; margin-top:72px }
.page--home .walk:first-of-type { margin-top:48px }
.page--home .walk img { width:100%; height:auto; border-radius:20px; box-shadow:0 30px 80px -40px rgb(0 0 0 / .5) }
.page--home .walk.flip img { order:2 }
.page--home .walk h3 { font:500 32px/1.15 var(--font-display); letter-spacing:-.015em; max-width:16ch }
.page--home .walk p { margin-top:14px; color:#55585e; max-width:46ch }
.page--home .walk dl { margin-top:22px; display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px 20px; font-size:15px }
.page--home .walk dt { color:#55585e }
.page--home .walk dd { margin:0; color:#0a0a0a; overflow-wrap:anywhere }
.page--home .small { font-size:12px; color:#55585e; margin-top:14px }
.page--home .statement { font:500 clamp(2rem,1.2rem + 3vw,3.75rem)/1.1 var(--font-display); letter-spacing:-.02em; max-width:22ch }
.page--home .list3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-top:56px }
.page--home .list3 h4 { font:600 12px/1 var(--font); letter-spacing:.12em; text-transform:uppercase; color:var(--band-secondary); padding-bottom:14px; border-bottom:1px solid var(--band-line) }
.page--home .list3 li { list-style:none; padding:12px 0; border-bottom:1px solid var(--band-line); font-size:16px; color:var(--band-muted) }
.page--home .list3 ul { padding:0; margin:0 }
.page--home .comparison-scroll { margin-top:40px; overflow-x:auto }
.table-hint { display:none; margin-top:32px; color:#55585e; font-size:13px; line-height:1.5 }
.page--home table.cmp { width:100%; border-collapse:collapse; font-size:16px; background:transparent }
.page--home .cmp caption { text-align:left; font-size:12px; color:#55585e; padding:0 0 20px }
.page--home .cmp th,.page--home .cmp td { text-align:left; padding:18px 16px; border-bottom:1px solid var(--paper-line); vertical-align:top }
.page--home .cmp thead th { font:600 12px/1.4 var(--font); letter-spacing:.1em; text-transform:uppercase; color:#55585e }
.page--home .cmp tbody th { font:500 16px/1.6 var(--font); width:28% }
.page--home .cmp tr.win>* { background:#fff }
.page--home .strip { display:grid; grid-template-columns:1fr 1.3fr 1fr 1fr 1fr 1fr; margin-top:48px; border-top:1px solid var(--band-line) }
.page--home .strip>div { padding:28px 12px; border-right:1px solid var(--band-line); min-width:0 }
.page--home .strip>div:first-child { padding-left:0 }
.page--home .strip>div:last-child { border-right:0 }
.page--home .strip .plan { font:600 12px/1 var(--font); letter-spacing:.1em; text-transform:uppercase; color:var(--band-secondary) }
.page--home .strip .price { font:500 40px/1 var(--font-display); letter-spacing:-.02em; margin-top:14px; white-space:nowrap }
.page--home .strip .hi .price { font-size:52px }
.page--home .strip .per { font-size:13px; color:var(--band-secondary); margin-top:8px }
.page--home .strip .what { font-size:14px; color:var(--band-muted); margin-top:14px; max-width:18ch }
.page--home .blog { display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; margin-top:48px }
.page--home .feat>a { text-decoration:none }
.page--home .feat>a:hover h3 { text-decoration:underline; text-underline-offset:4px }
.page--home .feat img { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:20px }
.page--home .feat h3 { font:500 34px/1.15 var(--font-display); letter-spacing:-.015em; margin-top:22px; max-width:20ch }
.page--home .feat p { color:#55585e; margin-top:10px; max-width:52ch }
.page--home .meta { font-size:13px; color:#55585e; margin-top:10px }
.page--home .posts { display:flex; flex-direction:column }
.page--home .posts a { text-decoration:none; color:inherit; padding:22px 0; border-top:1px solid var(--paper-line) }
.page--home .posts a:hover h4 { text-decoration:underline; text-underline-offset:4px }
.page--home .posts a:last-child { border-bottom:1px solid var(--paper-line) }
.page--home .posts h4 { font:500 21px/1.25 var(--font-display); letter-spacing:-.01em }
.page--home .posts p { font-size:14px; color:#55585e; margin-top:6px }
.page--home .faq { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 64px; margin-top:40px; align-items:start }
.page--home .faq .faq-item { border:0; border-top:1px solid var(--band-line); padding:22px 0; margin:0 }
.page--home .faq summary { list-style:none; cursor:pointer; font:500 20px/1.3 var(--font-display); display:flex; align-items:start; gap:18px; padding:0; min-height:44px }
.page--home .faq summary b { font:500 14px var(--font-display); color:var(--band-secondary); min-width:28px; padding-top:4px }
.page--home .faq summary span { flex:1 }
.page--home .faq summary::after { margin-left:auto }
.page--home .faq .body { padding:0 0 0 46px }
.page--home .faq .body p { margin-top:12px; color:var(--band-muted); max-width:48ch; font-size:16px }
.page--home .final { position:relative; isolation:isolate; overflow:hidden; background:var(--paper); color:#0a0a0a; padding:clamp(96px,12vw,180px) 0 }
.page--home .final-bg { position:absolute; inset:0; z-index:-2 }
.page--home .final img { width:100%; height:100%; object-fit:cover; object-position:70% 50% }
.page--home .final::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(245,244,241,.98),rgba(245,244,241,.92) 45%,rgba(245,244,241,.3)) }
.page--home .final h2 { font-size:clamp(2.5rem,1.6rem + 3.6vw,4.5rem) }
.page--home .final .start { background:#fff; border-color:#76767f }
.page--home .final .start input { color:#0a0a0a }
.page--home .final .start input::placeholder,.page--home .final .note { color:#55585e }

@media(prefers-color-scheme:light) {
  .page--home { --band-ink:#fff; --band-raised:#e9e9e6; --band-text:#0a0a0a; --band-muted:#55585e; --band-secondary:#55585e; --band-line:#d9d9d6 }
  .page--home .hero-scrim { background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,.9) 45%,rgba(255,255,255,.35) 78%,rgba(255,255,255,.15)),linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,0) 30%,#fff 1000px) }
  .page--home .grain { filter:invert(1) }
  .page--home .btn-solid,.page--home .btn-primary { background:#0a0a0a; color:#fff; box-shadow:none }
  .page--home .hero-demo { box-shadow:0 24px 64px -24px rgb(0 0 0 / .35) }
  .page--home .tile .t::before { background:linear-gradient(180deg,rgba(245,244,241,0),rgba(245,244,241,.98) 70%) }
}
@media(max-width:1100px) {
  .page--home .hero-copy { grid-column:1/-1 }
  .page--home .demo-rail label { font-size:13px; gap:6px }
  .page--home .stage-chat { padding:32px }
  .page--home .stage-rail { padding:32px 24px }
  .page--home .strip .price { font-size:32px }
  .page--home .strip .hi .price { font-size:40px }
}
@media(max-width:860px) {
  .page--home .hero h1 { max-width:13ch }
  .page--home .hero h1 br { display:none }
  .page--home .start { flex-direction:column; border-radius:24px }
  .page--home .start input { flex:auto; height:44px }
  .page--home .demo-rail { padding-right:10px; padding-top:64px }
  .page--home .demo-rail label { min-width:120px; font-size:13px; white-space:normal; text-align:left }
  .page--home .hero-demo .demo-panel { grid-template-columns:minmax(0,1fr) }
  .page--home .stage-chat { border-right:0; border-bottom:1px solid var(--paper-line); padding:28px 22px }
  .page--home .stage-rail { padding:24px 22px }
  .page--home .stage-caption { padding:14px 22px }
  .page--home .stage-number { font-size:144px }
  .page--home .cols3,.page--home .list3,.page--home .faq,.page--home .blog,.page--home .walk { grid-template-columns:minmax(0,1fr) }
  .page--home .cols3 { gap:40px }
  .page--home .cols3 p { max-width:46ch }
  .page--home .walk { gap:24px }
  .page--home .walk.flip img { order:0 }
  .page--home .bento { grid-auto-rows:260px }
  .page--home .tile--feature,.page--home .tile--small,.page--home .tile--wide { grid-column:span 12; grid-row:span 1 }
  .page--home .tile--feature { grid-row:span 2 }
  .page--home .strip { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .page--home .strip>div { padding:28px 12px 28px 0; border-right:0; border-bottom:1px solid var(--band-line) }
  .page--home .strip .price { font-size:40px }
  .page--home .strip .hi .price { font-size:48px }
  .page--home .cmp { min-width:740px }
  .page--home .band-heading { gap:16px; align-items:start }
  .page--home .band-heading>.num { font-size:96px }
}
@media(max-width:639px) {
  .page--home .masthead .btn { min-height:44px; padding-inline:10px; font-size:12px }
  .page--home .masthead-inner { min-height:64px }
  .page--home .hero>.wrap { padding-top:48px }
  .page--home .hero h1 { font-size:56px; width:310px; max-width:100% }
  .page--home .hero .lede { font-size:18px; line-height:1.5; margin-top:24px }
  .page--home .hero-grid { gap:16px }
  .page--home .stage { margin-top:32px }
  .page--home .hero-demo { border-radius:24px }
  .page--home .start { margin-top:24px }
  .page--home .band-heading { flex-wrap:wrap }
  .page--home .band-heading h2 { flex-basis:75% }
  .page--home .band-heading>.num { margin-left:auto }
  .page--home .tile--feature { grid-row:span 1 }
  .page--home .tile--feature h3 { font-size:26px }
  .page--home .tile--feature p { font-size:14px }
}
@media print {
  .page--home .hero-demo .demo-panel { visibility:visible; opacity:1; pointer-events:auto; grid-area:auto; transform:none }
  .page--home .hero-demo .demo-panels { display:block }
  .page--home .demo-rail { display:none }
}

/* Keep text contrast predictable over the tighter mobile image crop. */
@media(max-width:639px) {
  .page--home .hero-scrim { background:linear-gradient(90deg,rgba(10,10,10,.9),rgba(10,10,10,.8)),linear-gradient(180deg,transparent,#0a0a0a 1000px) }
}
@media(max-width:639px) and (prefers-color-scheme:light) {
  .page--home .hero-scrim { background:linear-gradient(90deg,rgba(255,255,255,.9),rgba(255,255,255,.8)),linear-gradient(180deg,transparent,#fff 1000px) }
}

/* Round 3: the same ink, paper, image and type system on every inner route. */
:root { --signal:#f2b33d; --signal-deep:#8a5a00 }
/* Signal is reserved for approval, the Stage selection, and held/live states. */
.page--home .signal-approve,.page--home .hero-demo .signal-state { background:var(--signal-deep); color:#fff; border-color:transparent; box-shadow:none }
.page--home .hero-demo:has(#demo-1:checked) label[for=demo-1],
.page--home .hero-demo:has(#demo-2:checked) label[for=demo-2],
.page--home .hero-demo:has(#demo-3:checked) label[for=demo-3],
.page--home .hero-demo:has(#demo-4:checked) label[for=demo-4] { background:var(--signal-deep); color:#fff }
.page--home .hero-demo .rail-indicator,.page--home .hero-demo.is-autoplay .rail-indicator { background:var(--signal-deep) }
.page--home .hero-demo .rail-fill { background:var(--signal-deep) }

.page--inner {
  --bg:#0a0a0a; --surface:#121212; --surface-2:#1a1a1a;
  --ink:#fff; --ink-muted:#c9cbd0; --line:#383838; --line-ui:#8a8d93;
  --action:#fff; --action-ink:#0a0a0a; --action-fill:linear-gradient(180deg,#fff,#dcdde0);
  --ok:#c9cbd0; --ok-tint:#1a1a1a; --warn:#c9cbd0; --warn-tint:#1a1a1a;
  --gutter:clamp(20px,4vw,32px); --section-y:clamp(72px,8vw,120px);
  --fs-h2:clamp(2.25rem,1.5rem + 2.6vw,3.5rem);
  background:var(--bg); color:var(--ink); font:400 17px/1.6 var(--font); -webkit-font-smoothing:antialiased;
}
.page--inner .wrap { width:100%; max-width:1280px; padding-inline:var(--gutter); margin-inline:auto }
.page--inner h1,.page--inner h2 { font-weight:500; font-variation-settings:"opsz" 144; text-wrap:initial; letter-spacing:-.025em }
.page--inner h2 { font-size:var(--fs-h2); line-height:1.08; max-width:20ch }
.page--inner h3 { font:500 28px/1.2 var(--font-display); letter-spacing:-.015em }
.page--inner .eyebrow { font:600 12px/1.4 var(--font); letter-spacing:.12em; color:var(--ink-muted); text-transform:uppercase }
.page--inner .lede { font:400 21px/1.5 var(--font); color:var(--ink-muted); max-width:58ch }
.page--inner .btn { min-height:48px; border-radius:999px; padding:12px 22px; font-size:15px }
.page--inner .btn-primary { background:var(--action-fill); color:var(--action-ink); border:0 }
.page--inner .masthead { background:rgb(10 10 10 / .88); color:#fff; --ink:#fff; --ink-muted:#c9cbd0; --bg:#0a0a0a; --surface:#121212; --line:#383838; --line-ui:#8a8d93; border-bottom:1px solid #383838; backdrop-filter:blur(14px) }
.page--inner .masthead-inner { min-height:64px }
.page--inner .masthead .btn { min-height:40px; padding:10px 18px; font-size:14px }
.page--inner .breadcrumbs { padding-block:12px 0; font-size:12px; gap:10px }
.page--inner .breadcrumbs a,.page--inner .breadcrumbs span { min-height:36px }
.page--inner .inner-hero { position:relative; isolation:isolate; overflow:hidden; padding:72px 0 96px; background:var(--bg) }
.page--inner .inner-art { position:absolute; inset:0; z-index:-2; display:block; border-radius:0; background:#0a0a0a; width:100%; height:100%; aspect-ratio:auto }
.page--inner .inner-art img { display:block; width:100%; height:100%; object-fit:cover; object-position:80% 50% }
.page--inner .inner-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#0a0a0a 0%,rgb(10 10 10 / .97) 30%,rgb(10 10 10 / .8) 58%,rgb(10 10 10 / .15)),linear-gradient(0deg,#0a0a0a,transparent 40%) }
.page--inner .inner-hero::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.02; background-image:repeating-linear-gradient(23deg,#fff 0 1px,transparent 1px 4px),repeating-linear-gradient(113deg,#fff 0 1px,transparent 1px 5px) }
.page--inner .page-hero-grid { display:block }
.page--inner .inner-hero .prose { max-width:none }
.page--inner .inner-hero h1 { font:500 clamp(3.5rem,2rem + 4vw,5.5rem)/1.02 var(--font-display); letter-spacing:-.03em; max-width:22ch; margin-top:20px }
.page--inner .inner-hero .lede { margin-top:28px }
.page--inner .band { padding-block:var(--section-y); position:relative; background-image:none }
.page--inner .band--paper,.page--inner .reading-paper {
  --bg:#f5f4f1; --surface:#fff; --surface-2:#e9e9e6; --ink:#0a0a0a; --ink-muted:#55585e;
  --line:#d9d9d6; --line-ui:#76767f; --action:#0a0a0a; --action-ink:#fff; --action-fill:#0a0a0a;
  --ok:#2a2c30; --ok-tint:#e9e9e6; --warn:#2a2c30; --warn-tint:#e9e9e6;
  background:#f5f4f1; color:#0a0a0a; color-scheme:light;
}
.page--inner .band--ink { --bg:#0a0a0a; --surface:#121212; --surface-2:#1a1a1a; --ink:#fff; --ink-muted:#c9cbd0; --line:#383838; --line-ui:#8a8d93; --action:#fff; --action-ink:#0a0a0a; --action-fill:linear-gradient(180deg,#fff,#dcdde0); background:#0a0a0a; color:#fff; color-scheme:dark }
.page--inner .band--paper .btn-primary,.page--inner .reading-paper .btn-primary { background:#0a0a0a; color:#fff }
.page--inner .band-number { display:block; font:500 clamp(96px,8vw,128px)/.95 var(--font-display); letter-spacing:-.05em; margin:0 0 32px; color:var(--ink); opacity:.28 }
.page--inner .band>.wrap>.band-number { float:right; margin-left:56px }
.page--inner .card,.page--inner .family-card,.page--inner .editorial-panel { border:0; border-top:1px solid var(--line); border-radius:0; box-shadow:none; background:transparent; padding:28px 0 0 }
.page--inner .card p,.page--inner .editorial-panel p { color:var(--ink-muted) }
.page--inner .grid { gap:48px 32px }
.page--inner .section-head { margin-bottom:48px }
.page--inner .notice { background:transparent; border:0; border-left:1px solid var(--line-ui); border-radius:0; padding:0 0 0 24px; color:var(--ink-muted) }
.page--inner .evidence-card,.page--inner .limits { border:0; border-radius:0; background:var(--surface); box-shadow:none; padding:32px }
.page--inner .pill { background:var(--surface-2); color:var(--ink); border:0; font-size:11px }
.page--inner .prompt { font:500 25px/1.4 var(--font-display); border:0; border-left:1px solid var(--line-ui); padding:0 0 0 24px; border-radius:0 }
.page--inner .block { border:0; border-left:2px solid var(--line-ui); border-radius:0; background:var(--surface-2); padding:24px; white-space:pre-wrap; overflow-wrap:anywhere }
.page--inner .table-scroll { border:0; border-radius:0; margin-top:40px }
.page--inner table { background:transparent; border:0; border-collapse:collapse; font-size:15px; line-height:1.6 }
.page--inner th,.page--inner td { padding:22px 20px; border:0; border-bottom:1px solid var(--line); text-align:left; vertical-align:top }
.page--inner th { background:transparent }
.page--inner thead th { font:600 12px/1.5 var(--font); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-muted) }
.page--inner tbody th { font-weight:500 }
.page--inner caption { padding:0 0 20px; text-align:left; font-size:13px; color:var(--ink-muted) }
.page--inner .source-date { color:var(--ink-muted) }
.page--inner .faq-item { border:0; border-top:1px solid var(--line); border-radius:0; margin:0; padding:16px 0; background:transparent }
.page--inner .faq-item summary { padding:8px 0; font:500 23px/1.3 var(--font-display) }
.page--inner .faq-item .body { padding:0 0 12px }
.page--inner .faq-item .body p { color:var(--ink-muted) }
.page--inner .anchor-rail { background:var(--bg); border-bottom:1px solid var(--line); color:var(--ink); position:relative; top:auto }
.page--inner .anchor-rail .wrap { gap:36px }
.page--inner .anchor-rail a { min-height:64px; text-decoration:none; border-bottom:1px solid transparent }
.page--inner .anchor-rail a:hover { border-color:currentColor }
.page--inner .cta-band { text-align:left; display:block }
.page--inner .cta-band .wrap { display:block }
.page--inner .cta-band h2 { font-size:clamp(44px,5vw,72px); max-width:20ch }
.page--inner .cta-band .cta-row { justify-content:flex-start; margin-top:28px }
.page--inner .site-footer { --bg:#0a0a0a; --surface:#121212; --ink:#fff; --ink-muted:#c9cbd0; --line:#383838; --line-ui:#8a8d93; background:#0a0a0a; color:#fff; font-size:15px }
.page--inner .site-footer .section-link { color:#fff }

/* Capabilities: six substantial photographic chapters, then the exact scope. */
.page--features-inner .inner-hero { padding-bottom:64px }
.page--features-inner .inner-hero h1 { max-width:20ch }
.page--inner .family-switcher { margin-top:56px; padding:0; border:0; border-top:1px solid var(--line); border-radius:0 }
.page--inner .family-rail { padding:12px 0; border-color:var(--line) }
.page--inner .family-rail label { font-size:14px; padding:12px 18px }
.page--inner .family-panel { padding-top:20px }
.page--inner .family-panel .family-image { display:block; border-radius:0; height:380px; aspect-ratio:auto }
.page--inner .family-panel .family-image img { object-position:50% 54% }
.page--inner .family-panel p { max-width:none; font-size:17px }
.page--inner .family-panel .planned-line { font-size:13px }
.page--inner .family-intro { grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:64px; margin-bottom:56px; align-items:center }
.page--inner .family-intro h2 { font-size:clamp(36px,3.5vw,52px); max-width:19ch }
.page--inner .family-intro .family-image { display:block; aspect-ratio:4/4.2; border-radius:0; box-shadow:0 24px 64px -24px rgb(0 0 0 / .35) }
.page--inner .family-intro .family-image img { display:block; object-fit:cover }
.page--inner .family-walk--flip .family-intro>picture { order:-1 }
.page--inner .family-intro .section-lede { margin-top:24px; color:var(--ink-muted); font-size:19px; max-width:40ch }
.page--inner .family-intro .band-number { margin-bottom:24px }
.page--inner .family-bottom { margin-top:48px; gap:64px }
.page--inner .family-bottom .prompt { border:0; border-left:1px solid var(--line-ui); font-size:24px }
.page--inner .illustration-caption { margin-top:32px; font-size:12px; color:var(--ink-muted) }

/* A catalog strip in the first screen; plan details are editorial columns. */
.page--pricing-inner .inner-hero { padding-block:36px 48px }
.page--pricing-inner .inner-hero h1 { max-width:20ch }
.page--pricing-inner .inner-hero::before { background:linear-gradient(90deg,#0a0a0a,rgb(10 10 10 / .92) 50%,rgb(10 10 10 / .65)) }
.page--pricing-inner .inner-hero .lede { font-size:19px; max-width:72ch; margin-top:20px }
.page--inner .catalog-notice { font-size:13px; max-width:90ch; margin-top:20px; padding:0; border:0; line-height:1.6 }
.page--inner .price-strip { display:grid; grid-template-columns:1fr 1.4fr 1fr 1fr 1fr 1.1fr; margin-top:40px; border-top:1px solid var(--line) }
.page--inner .strip-plan { display:flex; flex-direction:column; gap:12px; padding:26px 18px 0; border-right:1px solid var(--line); text-decoration:none; min-width:0 }
.page--inner .strip-plan:first-child { padding-left:0 }
.page--inner .strip-plan:last-child { border:0 }
.page--inner .strip-name { font:600 12px/1.4 var(--font); text-transform:uppercase; letter-spacing:.1em; color:var(--ink-muted) }
.page--inner .strip-price { font:500 40px/1.1 var(--font-display); letter-spacing:-.04em; white-space:nowrap }
.page--inner .strip-plan--focus .strip-price { font-size:52px }
.page--inner .strip-period { color:var(--ink-muted); font-size:13px }
.page--inner .strip-plan:hover .strip-name { text-decoration:underline; text-underline-offset:6px }
.page--inner .scope-guide { margin:0 0 64px }
.page--inner .scope-guide .card { padding-top:20px }
.page--inner .scope-guide h3 { font-size:25px }
.page--inner .billing-options { border:1px solid var(--line-ui); border-radius:999px }
.page--inner .billing-note { margin-top:20px; margin-bottom:40px }
.page--inner .plans { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:56px 40px }
.page--inner .plan-card { display:flex; flex-direction:column; align-items:stretch; gap:20px; padding:28px 0 0; border:0; border-top:1px solid var(--line-ui); border-radius:0; box-shadow:none }
.page--inner .plan-card--featured::before { display:none }
.page--inner .plan-card h3 { font:500 32px/1.2 var(--font-display) }
.page--inner .plan-card h3 .pill { margin-left:8px; font:500 12px/1.4 var(--font); vertical-align:middle }
.page--inner .plan-for { min-height:0; font-size:15px }
.page--inner .billing-toggle .plan-price { display:block; font:500 48px/1.15 var(--font-display) }
.page--inner .billing-toggle .plan-price>.price-monthly,.page--inner .billing-toggle .plan-price>.price-annual { grid-area:auto; display:inline }
.page--inner .billing-toggle:has(#monthly:checked) .plan-price>.price-annual,
.page--inner .billing-toggle:has(#annual:checked) .plan-price>.price-monthly { display:none }
.page--inner .plan-price-period { display:block; font:400 13px/1.4 var(--font); margin-top:8px }
.page--inner .plan-annual { min-height:0; font-size:13px; margin:0 }
.page--inner .plan-cta { margin-top:auto; width:fit-content; font-size:14px; background:transparent; color:var(--ink) }
.page--inner .plan-divider { display:none }
.page--inner .plan-spec { padding-block:14px; font-size:13px }
.page--inner .plan-specs { margin-top:4px }
.page--inner .plan-reason { margin:0 }

/* The comparison gives the evidence the space; only supported wins are lifted. */
.page--inner .editorial-panels { gap:64px }
.page--inner .comparison-table { min-width:900px }
.page--inner .comparison-table th:first-child { width:23% }
.page--inner .comparison-table td:last-child { width:20% }
.page--inner .comparison-win>* { background:#e1e1de; color:#0a0a0a }
.page--inner .comparison-win td:last-child { font-weight:600 }
.page--inner .band--table { --ink:#0a0a0a; --ink-muted:#55585e; --line:#d9d9d6; --surface:#fff; background:#f5f4f1; color:#0a0a0a; color-scheme:light }

/* The journal has a lead story, category rail, then unboxed image grids. */
.page--blog-inner .inner-hero { padding-bottom:72px }
.page--blog-inner .inner-hero h1 { max-width:20ch }
.page--inner .post-card { padding:0; border:0; gap:24px }
.page--inner .post-card h3 { font:500 28px/1.18 var(--font-display); max-width:25ch; margin-top:14px }
.page--inner .post-card h3 a { text-decoration:none }
.page--inner .post-card h3 a:hover { text-decoration:underline; text-underline-offset:5px }
.page--inner .post-image { border-radius:0; display:block; box-shadow:0 24px 64px -40px rgb(0 0 0 / .35) }
.page--inner .post-image img { display:block; width:100%; object-fit:cover; aspect-ratio:16/10 }
.page--inner .post-card p:not(.eyebrow) { margin-top:16px; font-size:16px }
.page--inner .post-card .small { font-size:12px }
.page--inner .post-card .pill { display:inline-block; margin-top:16px; padding:0; background:transparent; color:var(--ink-muted); text-transform:none; letter-spacing:0; line-height:1.5; font-size:12px }
.page--inner .featured-story { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); align-items:center; gap:56px }
.page--inner .featured-story .post-image img { aspect-ratio:4/3 }
.page--inner .featured-story h3 { font-size:42px }
.page--blog-inner main>section:has(.featured-story) { padding-block:72px }
.page--blog-inner .band h2 { margin-bottom:48px }

/* Reading is always paper: calm measure, real type size, and a quiet index. */
.page--inner .reading-layout { position:relative; max-width:none; width:100%; padding:80px max(32px,calc((100vw - 1216px)/2)) 112px; display:grid; grid-template-columns:240px minmax(0,1fr); gap:80px; align-items:start }
.page--inner .reading-body { min-width:0; max-width:100% }
.page--inner .reading-body>.prose,.page--inner .article-copy { max-width:68ch }
.page--inner .reading-body,.page--inner .legal-copy { font-size:19px; line-height:1.75 }
.page--inner .reading-body p,.page--inner .reading-body li { max-width:68ch }
.page--inner .reading-body h2 { font-size:clamp(32px,3vw,44px); max-width:24ch; line-height:1.16 }
.page--inner .reading-body h3 { font-size:27px; line-height:1.25 }
.page--inner .reading-toc { position:sticky; top:96px; max-height:calc(100dvh - 128px); overflow-y:auto; border:0; border-top:1px solid var(--line-ui); border-radius:0; padding:24px 0 0; font-size:13px; background:transparent }
.page--inner .reading-toc .footer-label { color:var(--ink-muted); font:600 11px/1.5 var(--font); letter-spacing:.1em }
.page--inner .reading-toc a { min-height:44px; padding:9px 0; line-height:1.5; text-decoration:none }
.page--inner .reading-toc a:hover { text-decoration:underline }
.page--inner .reading-section { margin-top:64px; padding-block:0 }
.page--inner .reading-section:first-child { margin-top:0 }
.page--inner .reading-section.evidence-card,.page--inner .reading-section.limits { padding:32px }
.page--inner .reading-section.evidence-card .band-number { font-size:96px; margin-bottom:20px }
.page--inner .article-copy { margin-top:64px }
.page--inner .article-copy h2 { margin-top:72px }
.page--inner .article-copy h2:first-child { margin-top:0 }
.page--inner .article-copy p { margin-top:24px }
.page--inner .article-copy ul { margin-block:24px }
.page--inner .article-copy .block { margin-block:32px; font-size:14px; line-height:1.7 }
.page--inner .article-meta { font-size:13px; color:var(--ink-muted); margin-top:28px; line-height:1.8 }
.page--inner .post-hero { padding-block:72px 56px }
.page--inner .post-hero::before,.page--inner .post-hero::after { display:none }
.page--inner .post-hero h1 { font-size:clamp(56px,2rem + 4vw,88px); max-width:25ch }
.page--inner .post-hero .lede { max-width:65ch }
.page--inner .post-hero .small { margin-top:16px; font-size:13px }
.page--inner .article-hero { margin-top:48px }
.page--inner .article-hero img { display:block; border-radius:0; width:100%; aspect-ratio:2.2/1; object-fit:cover }
.page--inner .article-hero figcaption { margin-top:12px; color:var(--ink-muted); font-size:12px }
.page--inner .author-box { border-top:1px solid var(--line-ui); padding-top:32px; gap:24px }
.page--inner .author-box h2 { font-size:28px }
.page--inner .author-box p { font-size:16px; margin-top:16px }
.page--inner .monogram { background:transparent; border:1px solid var(--line-ui); border-radius:50%; font:500 24px var(--font-display) }
.page--inner .doc-body>section { margin-top:72px; padding-top:48px; border-top:1px solid var(--line) }
.page--inner .doc-body>section:first-child { padding-top:0; margin-top:0; border:0 }
.page--inner .doc-body .band-number { font-size:96px; margin-bottom:24px }
.page--inner .doc-body .grid { gap:32px }
.page--inner .doc-body .card { font-size:16px }
.page--inner .legal-copy h2 { margin-top:64px }
.page--inner .legal-copy h2:first-child { margin-top:0 }
.page--inner .legal-copy p { margin-top:24px }
.page--legal .inner-hero { padding-bottom:80px }
.page--inner .error-page { text-align:left }
.page--inner .error-page .prose { margin-inline:0 }
.page--inner .error-page .cta-row { justify-content:flex-start; margin-top:32px }
.page--inner .error-page .error-number { font:500 clamp(128px,16vw,240px)/.9 var(--font-display); letter-spacing:-.06em; color:var(--ink); opacity:.35 }
.page--inner .error-page h1 { font-size:clamp(56px,6vw,88px); max-width:19ch; margin-top:36px }
.page--inner .error-page .inner-hero { min-height:720px }

@media(prefers-color-scheme:light) {
  .page--inner { --bg:#fff; --surface:#f5f4f1; --surface-2:#e9e9e6; --ink:#0a0a0a; --ink-muted:#55585e; --line:#d9d9d6; --line-ui:#76767f; --action:#0a0a0a; --action-ink:#fff; --action-fill:#0a0a0a; background:#fff; color:#0a0a0a }
  .page--home .masthead,.page--inner .masthead { --bg:#fff; --surface:#f5f4f1; --surface-2:#e9e9e6; --ink:#0a0a0a; --ink-muted:#55585e; --line:#d9d9d6; --line-ui:#76767f; background:rgb(255 255 255 / .9); color:#0a0a0a; border-color:#d9d9d6 }
  .page--inner .inner-hero::before { background:linear-gradient(90deg,#fff,rgb(255 255 255 / .97) 30%,rgb(255 255 255 / .86) 58%,rgb(255 255 255 / .4)),linear-gradient(0deg,#fff,transparent 40%) }
  .page--pricing-inner .inner-hero::before { background:linear-gradient(90deg,#fff,rgb(255 255 255 / .95) 50%,rgb(255 255 255 / .8)) }
}
@media(max-width:1119px) {
  .page--inner .reading-layout { grid-template-columns:200px minmax(0,1fr); gap:40px }
  .page--inner .family-intro { gap:40px }
  .page--inner .strip-price { font-size:30px }
  .page--inner .strip-plan--focus .strip-price { font-size:40px }
  .page--inner .strip-plan { padding-inline:12px }
}
@media(max-width:1119px) and (min-width:860px) {
  .nav-signin { display:inline-flex }
  .desktop-nav .menu[open] .menu-close { display:none }
}
@media(max-width:859px) {
  .page--home .table-hint { display:block }
  .page--home .table-hint+.comparison-scroll { margin-top:12px }
  .page--home .cmp th:first-child,.page--inner .comparison-table th:first-child { position:sticky; left:0; z-index:1; width:176px; min-width:176px; background:#f5f4f1; box-shadow:1px 0 0 #d9d9d6 }
  .page--home .cmp tr.win>th,.page--inner .comparison-table .comparison-win>th { background:#e1e1de }
  .page--inner .inner-hero { padding-block:56px 64px }
  .page--inner .inner-hero h1 { font-size:64px }
  .page--inner .inner-hero::before { background:linear-gradient(90deg,rgb(10 10 10 / .98),rgb(10 10 10 / .84)),linear-gradient(0deg,#0a0a0a,transparent) }
  .page--inner .family-intro,.page--inner .family-bottom,.page--inner .featured-story { grid-template-columns:1fr; gap:32px }
  .page--inner .family-intro .family-image { aspect-ratio:4/3 }
  .page--inner .family-walk--flip .family-intro>picture { order:initial }
  .page--inner .plans { grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 28px }
  .page--inner .price-strip { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 0 }
  .page--inner .strip-plan { padding-top:24px; border:0; border-right:1px solid var(--line) }
  .page--inner .strip-plan:nth-child(3n) { border-right:0 }
  .page--inner .strip-plan:nth-child(4) { padding-left:0 }
  .page--inner .reading-layout { grid-template-columns:1fr; gap:48px; padding:48px var(--gutter) 72px }
  .page--inner .reading-toc { position:static; max-height:none; padding-top:20px }
  .page--inner .reading-toc ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px }
  .page--inner .post-hero h1 { font-size:60px }
  .page--inner .band>.wrap>.band-number { float:none; margin:0 0 32px }
  .page--inner .featured-story h3 { font-size:36px }
  .page--inner .family-panel .family-image { height:300px }
  .page--inner .error-page .inner-hero { min-height:680px }
}
@media(max-width:959px) {
  .page--inner .table-hint { display:block }
  .page--inner .table-hint+.table-scroll { margin-top:12px }
}
@media(max-width:639px) {
  .page--inner { --gutter:20px; --section-y:64px }
  .page--inner .masthead .btn { min-height:44px; padding-inline:10px; font-size:12px }
  .page--inner .masthead-inner { min-height:64px; gap:12px }
  .page--inner .breadcrumbs { padding-top:12px }
  .page--inner .breadcrumbs a,.page--inner .breadcrumbs span { min-height:32px }
  .page--inner .inner-hero { padding-block:40px 56px }
  .page--inner .inner-hero h1 { font-size:52px; line-height:1.04; letter-spacing:-.035em; margin-top:20px }
  .page--inner .inner-hero .lede { font-size:18px; margin-top:24px }
  .page--inner h2 { font-size:36px; max-width:20ch }
  .page--inner h3 { font-size:26px }
  .page--inner .band-number { font-size:96px }
  .page--inner .anchor-rail .wrap { gap:24px }
  .page--inner .anchor-rail a { min-height:56px; font-size:13px }
  .page--inner .grid,.page--inner .plans,.page--inner .editorial-panels { grid-template-columns:1fr }
  .page--inner .grid { gap:40px }
  .page--inner .family-switcher { margin-top:40px }
  .page--inner .family-rail { gap:8px }
  .page--inner .family-rail label { padding:10px; font-size:13px }
  .page--inner .family-panel .family-image { height:260px }
  .page--inner .family-intro { gap:32px; margin-bottom:40px }
  .page--inner .family-intro h2 { font-size:36px }
  .page--inner .family-bottom { gap:32px; margin-top:32px }
  .page--inner .family-bottom .prompt { font-size:22px }
  .page--inner .price-strip { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 0; margin-top:32px }
  .page--inner .strip-plan { padding:20px 12px 0; border-right:0; border-top:1px solid var(--line) }
  .page--inner .strip-plan:nth-child(odd) { padding-left:0; border-right:1px solid var(--line) }
  .page--inner .strip-plan:nth-child(even) { padding-left:20px }
  .page--inner .strip-price { font-size:36px }
  .page--inner .strip-plan--focus .strip-price { font-size:40px }
  .page--pricing-inner .inner-hero { padding-bottom:40px }
  .page--inner .catalog-notice { font-size:12px }
  .page--inner .scope-guide { margin-bottom:48px }
  .page--inner .plans { gap:48px }
  .page--inner .plan-card { gap:16px }
  .page--inner .plan-for { margin:0 }
  .page--inner .plan-cta { width:100% }
  .page--inner .featured-story { gap:28px }
  .page--inner .featured-story h3 { font-size:34px }
  .page--inner .post-card h3 { font-size:28px }
  .page--inner .reading-layout { padding-inline:20px }
  .page--inner .reading-toc ul { grid-template-columns:1fr }
  .page--inner .reading-toc { font-size:14px }
  .page--inner .reading-body { font-size:19px; line-height:1.7 }
  .page--inner .reading-body h2 { font-size:32px }
  .page--inner .reading-section.evidence-card,.page--inner .reading-section.limits { padding:24px 20px }
  .page--inner .reading-section { margin-top:48px }
  .page--inner .article-copy { margin-top:48px }
  .page--inner .article-copy h2 { margin-top:56px }
  .page--inner .post-hero h1 { font-size:48px }
  .page--inner .article-hero { margin-top:32px }
  .page--inner .article-hero img { aspect-ratio:4/3 }
  .page--inner .author-box { grid-template-columns:1fr }
  .page--inner .doc-body>section { margin-top:48px }
  .page--inner .error-page .error-number { font-size:160px }
  .page--inner .error-page h1 { font-size:52px }
  .page--inner .error-page .inner-hero { min-height:680px }
  .page--inner .error-page .cta-row { align-items:stretch; flex-direction:column }
}
@media(max-width:859px) and (prefers-color-scheme:light) {
  .page--inner .inner-hero::before { background:linear-gradient(90deg,rgb(255 255 255 / .98),rgb(255 255 255 / .88)) }
}
@media print {
  .page--inner .inner-art,.page--inner .reading-toc { display:none }
  .page--inner .reading-layout { display:block; padding:24px }
  .page--inner .inner-hero h1 { font-size:48px }
}

/* A long comparison title reads as a deliberate two-line statement. */
@media(min-width:1120px) {
  .page--compare-inner .inner-hero h1 { font-size:72px; max-width:26ch; text-wrap:balance }
}
/* On a phone, show the catalog before the supporting explanation. */
@media(max-width:639px) {
  .page--pricing-inner .inner-hero { padding-top:24px }
  .page--pricing-inner .inner-hero>.wrap { display:flex; flex-direction:column }
  .page--pricing-inner .page-hero-grid,.page--pricing-inner .page-hero-grid>div { display:contents }
  .page--pricing-inner .inner-hero .eyebrow { order:0 }
  .page--pricing-inner .inner-hero h1 { order:1; font-size:48px; margin-top:16px }
  .page--pricing-inner .price-strip { order:2; margin-top:24px; gap:16px 0 }
  .page--pricing-inner .strip-plan { gap:8px; padding-top:16px }
  .page--pricing-inner .strip-price { font-size:34px }
  .page--pricing-inner .strip-plan--focus .strip-price { font-size:38px }
  .page--pricing-inner .catalog-notice { order:3; margin-top:32px }
  .page--pricing-inner .inner-hero .lede { order:4 }
}
/* Two broad columns give each journal category an intentional image rhythm. */
@media(min-width:640px) {
  .page--blog-inner .band>.wrap>.grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:64px 40px }
}

/* Numerals are focal type, rather than low-contrast watermarks. */
.page--inner .band-number { opacity:1; color:transparent; background:linear-gradient(180deg,var(--ink),var(--ink-muted)); background-clip:text; -webkit-background-clip:text; width:fit-content }
.page--home .num { opacity:1; color:transparent; background:linear-gradient(180deg,var(--band-text),var(--band-muted)); background-clip:text; -webkit-background-clip:text; width:fit-content }
.page--home .paper .num { background-image:linear-gradient(180deg,#0a0a0a,#55585e) }
/* Light mode still has real ink bands; paper remains paper. */
@media(prefers-color-scheme:light) {
  .page--home .band.ink,.page--home .site-footer {
    --bg:#0a0a0a; --surface:#121212; --surface-2:#1a1a1a; --ink:#fff; --ink-muted:#c9cbd0; --line:#383838;
    --action:#fff; --action-ink:#0a0a0a; --band-ink:#0a0a0a; --band-raised:#121212; --band-text:#fff;
    --band-muted:#c9cbd0; --band-secondary:#c9cbd0; --band-line:#383838;
    background:#0a0a0a; color:#fff; color-scheme:dark;
  }
  .page--home .band.ink .tile .t::before { background:linear-gradient(180deg,rgb(10 10 10 / 0),rgb(10 10 10 / .94) 70%) }
}

/* Round 4: quiet masthead, focal numerals and a compact stage control. */
.brand { gap:8px; font:600 22px/1 var(--font); letter-spacing:-.3px }
.brand .brand-mark { display:block; width:40px; height:40px; flex:none }
.page--home .masthead .btn,.page--inner .masthead .btn { height:44px; min-height:44px; padding-block:0 }
.page--home .masthead .btn-primary,.page--inner .masthead .btn-primary { background:transparent; color:var(--ink); border:1px solid var(--line-ui); box-shadow:none; line-height:1 }
.page--home .hero .lede { max-width:66ch }
.page--home .num,.page--inner .band-number { opacity:.5 }
.page--home .paper .num,.page--inner .band--paper .band-number,.page--inner .reading-paper .band-number { opacity:.36 }
.page--home .cmp tr.win>* { background:#e1e1de }
.page--home .demo-rail { padding:10px }
.page--home .hero-demo .demo-toggle { position:static; align-self:flex-end; margin:8px 16px; font-size:12px; flex:none }
.page--inner .plan-card h3 .pill { font-size:12px }
.page--home .tile--wide p { max-width:76ch }
@media(max-width:639px) {
  .brand { font-size:18px; gap:5px }
  .brand .brand-mark { width:32px; height:32px }
  .page--home .demo-rail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)) }
  .page--home .demo-rail label { min-width:0; justify-content:flex-start }
  .page--home .hero .lede { font-size:16px; line-height:1.5 }
  .page--home .tile--wide { min-height:310px }
}
/* Inline references and breadcrumbs retain a full touch area. */
main p a,main li a,.breadcrumbs a,.post-meta a { display:inline-flex; align-items:center; min-height:44px; min-width:44px; max-width:100% }
.family-links a { min-width:44px }
.page--inner .breadcrumbs a { min-height:44px }
.page--inner .anchor-rail a { min-width:44px }
.page--inner .anchor-rail a { flex:none }
@media(max-width:639px) {
  .page--pricing-inner .catalog-notice { order:2 }
  .page--pricing-inner .price-strip { order:3 }
}
