/* Saturday site. Colours are theme tokens. Default THEME=signal (the :root blocks below). Other themes override the tokens under html[data-theme="<name>"] at the end of this file. DM Sans. */
@font-face{font-family:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url(/assets/fonts/dm-sans-latin-var.woff2) format("woff2")}
@font-face{font-family:"DM Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/dm-mono-latin-400.woff2) format("woff2")}

:root{
  --bg:#FFFFFF; --ink:#111417; --text:#2E2925; --muted:#5A514B; --faint:#6B6159;
  --line:#EDE5DE; --line-2:#DFD4CB; --field:#8A7F77;
  --surface:#FAF6F3; --surface-2:#F3EEEA;
  --dot:#FF5A1F; --accent:#C2410C; --tint:#FFF2EB;
  /* theme tokens added 2026-11-02 (palettes); values here are THEME=signal */
  --fill:#FF5A1F; --on-fill:#111417; --fill-hover:#FF7A45; --stop:#FF5A1F; --btn-dot:#FF5A1F;
  --main-bg:var(--ink); --main-text:#fff; --main-hover:#000; --main-dot:var(--dot);
  --accent-rgb:194,65,12; --glow-rgb:255,90,31;
  --glow2a-rgb:255,170,120; --glow2b-rgb:255,160,110; --glow3a-rgb:255,200,160; --glow3b-rgb:255,196,150; --glow3c-rgb:255,190,150;
  --shade-rgb:70,35,15; --shade2-rgb:90,40,10; --shade3-rgb:120,45,10; --on-ink-accent-rgb:255,138,76;
  --header-bg:rgba(255,252,249,.9);
  --chrome-1:#FFFCFA; --chrome-2:#F8F1EC; --tl:#E7DAD0; --tl-1:#FF8A5C;
  --tint-line:#F6D5C3; --accent-line:#F3C9B2; --shot-bg-1:#FCFAF8; --shot-bg-2:#F7F3F0;
  --card-line:#EFE6DF; --track:#F1E7E0; --bar-from:#FFB08A; --bar-lo:#D9CCC2; --skel:#EFE7E1;
  --code-bg:#111417; --code-text:#F1ECE8; --code-muted:#B5AAA1; --code-line:#2C221C; --code-prompt:#FF7A3D; --code-key:#F3C7A6;
  --ok:#166534; --ok-tint:#E3F8EA; --warn:#7A5600; --warn-tint:#FEF3C7; --err:#BE123C; --err-tint:#FFF1F3;
  --sans:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --r-sm:6px; --r:10px; --r-lg:16px;
  --shadow-1:0 1px 2px rgba(17,20,23,.05);
  --shadow-2:0 1px 2px rgba(17,20,23,.04),0 12px 32px -12px rgba(17,20,23,.14);
  --shadow-3:0 1px 2px rgba(17,20,23,.05),0 24px 48px -20px rgba(17,20,23,.22);
  --wrap:1200px; --gutter:40px;
}
@media (max-width:720px){:root{--gutter:20px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:17px;line-height:1.6;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media (max-width:720px){body{font-size:17px}}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4{color:var(--ink);margin:0;font-weight:650;letter-spacing:-.02em;line-height:1.1;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:inherit}
code,kbd,.mono{font-family:var(--mono);font-size:.92em}
ul,ol{margin:0;padding:0}
.wrap{max-width:calc(var(--wrap) + var(--gutter)*2);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--ink);color:#fff;padding:10px 14px;border-radius:var(--r-sm);text-decoration:none;font-weight:600;font-size:15px}
.skip:focus{top:12px}

/* Wordmark: Saturday with the Flo orange dot as its full stop */
.mark{display:inline-flex;align-items:baseline;gap:0;text-decoration:none;color:var(--ink);font-weight:650;font-size:20px;letter-spacing:-.03em;line-height:1}
.mark i{display:inline-block;width:.3em;height:.3em;border-radius:50%;background:var(--dot);margin-left:.08em}

/* Header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:24px}
.nav{display:flex;align-items:center;gap:28px}
.nav a{font-size:15px;font-weight:400;color:var(--muted);text-decoration:none;padding:6px 0}
.nav a:hover{color:var(--ink)}
.nav a[aria-current=page]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink)}
.nav .btn{margin-left:4px}
.nav a.btn{color:#fff;padding:0 16px;box-shadow:none}
@media (max-width:720px){
  .site-header .wrap{height:60px}
  .nav{gap:20px}
  .nav .hide-sm{display:none}
}

/* Button: the only CTA. Ink fill, orange dot. */
.btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 20px;border-radius:var(--r);background:var(--ink);color:#fff;font:inherit;font-size:17px;font-weight:600;letter-spacing:-.005em;text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:background-color .16s cubic-bezier(.2,0,0,1),transform .16s cubic-bezier(.2,0,0,1)}
.btn::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--btn-dot);flex:none}
.btn:hover{background:#000}
/* The one filled CTA per page (home hero, waitlist submit, nav elsewhere). Signal keeps it ink; other themes fill it with the accent. */
.btn.btn-main,.nav a.btn.btn-main{background:var(--main-bg);color:var(--main-text)}
.btn.btn-main::before{background:var(--main-dot)}
.btn.btn-main:hover{background:var(--main-hover)}
/* CTA edge: palettes whose fill is under 3:1 against the ground get a darker 1px ring (--main-edge); none by default */
.btn.btn-main,.nav a.btn.btn-main{box-shadow:inset 0 0 0 1px var(--main-edge,transparent)}
.btn:active{transform:translateY(1px)}
.btn-sm{height:40px;font-size:15px;padding:0 16px}
.btn-lg{height:56px;font-size:17px;padding:0 24px}
.btn[disabled]{opacity:.6;cursor:progress}
@media (max-width:720px){.btn-block-sm{width:100%;justify-content:center}}

.link{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:4px;text-decoration-thickness:1.5px}
.link:hover{text-decoration-color:var(--ink)}
/* Drawn chevron: the latin font subset has no U+2192, so the glyph fell back to Arimo. */
.arrow::after{content:"";display:inline-block;width:6px;height:6px;margin-left:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);vertical-align:.12em}

.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--dot)}
.lead{font-size:20px;line-height:1.55;color:var(--text);max-width:34ch}
@media (max-width:720px){.lead{font-size:17px}}
.muted{color:var(--muted)}
.accent{color:var(--accent)}

/* Sections */
section{scroll-margin-top:80px}
.section{padding:120px 0}
.section-tight{padding:88px 0}
.band{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.h2{font-size:clamp(2rem,1.2rem + 2.4vw,3.25rem);letter-spacing:-.03em;line-height:1.05}
.h3{font-size:20px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.sec-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end;margin-bottom:64px}
.sec-head p{color:var(--muted);font-size:17px;max-width:44ch}
@media (max-width:900px){.section{padding:80px 0}.section-tight{padding:64px 0}.sec-head{grid-template-columns:1fr;gap:20px;margin-bottom:40px}}

/* Hero */
.hero{padding:56px 0 0}
.hero h1{font-size:clamp(2.6rem,1rem + 5.2vw,5.75rem);letter-spacing:-.045em;line-height:.98;margin:28px 0 0}
.hero h1 .l{display:block}
@media (max-width:1000px){.hero h1 .l{display:inline}}
.hero h1 .stop{color:var(--stop)}
.hero-row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:56px;margin-top:44px;align-items:start}
.hero-copy{display:flex;flex-direction:column;gap:28px;padding-top:8px}
@media (max-width:1000px){.hero{padding-top:48px}.hero-row{grid-template-columns:1fr;gap:40px;margin-top:28px}.hero h1{margin-top:20px}}

/* Product mock (example data, decorative) */
.mock{margin:0;position:relative;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:20px;overflow:hidden}
.mock-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 6px 18px;font-size:13px;color:var(--muted)}
.mock-tabs{display:flex;gap:18px}
.mock-tabs b{color:var(--ink);font-weight:600}
.meter{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.meter-track{width:72px;height:6px;border-radius:6px;background:var(--line-2);overflow:hidden}
.meter-track span{display:block;height:100%;width:50%;background:var(--ink);border-radius:6px}
.bar-r{display:flex;align-items:center;gap:16px}
.tag-example{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);background:#fff;border:1px solid var(--line);padding:3px 8px;border-radius:999px}
.mock-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:14px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-2)}
.decide{padding:24px 24px 20px}
.decide .k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.decide h3{font-size:22px;letter-spacing:-.02em;line-height:1.2;margin:10px 0 10px}
.metaline{font-size:14px;color:var(--muted);line-height:1.6}
.metaline .mono{font-size:13px;color:var(--text)}
.fit{display:flex;gap:12px;align-items:flex-start;margin:18px 0 20px;padding:14px;border-radius:10px;background:var(--surface)}
.fit p{font-size:15px;line-height:1.5;color:var(--text)}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;flex:none}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.chip-ok{background:var(--ok-tint);color:var(--ok)}
.chip-warn{background:var(--warn-tint);color:var(--warn)}
.chip-plain{background:var(--surface-2);color:var(--text)}
.chip-plain::before{display:none}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.fake-btn{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:8px;font-size:14px;font-weight:600}
.fake-btn.p{background:var(--ink);color:#fff}
.fake-btn.s{background:#fff;color:var(--ink);border:1px solid var(--line-2)}
.fake-link{font-size:14px;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.side{display:flex;flex-direction:column;gap:14px}
.working{padding:18px 18px 16px}
.working .k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.working h4{font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.3;margin:8px 0 14px}
.spine{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-bottom:8px}
.spine span{height:4px;border-radius:4px;background:var(--line-2)}
.spine span.done{background:var(--ink)}
.spine span.now{background:var(--dot)}
.spine-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);gap:4px}
.spine-labels b{color:var(--ink);font-weight:600}
.pkg{padding:16px 18px}
.pkg .k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.pkg dl{display:grid;grid-template-columns:1fr auto;gap:7px 12px;margin:0;font-size:14px}
.pkg dt{color:var(--muted)}
.pkg dd{margin:0;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.pkg dd.warn{color:var(--warn)}
@media (max-width:1000px){.mock-grid{grid-template-columns:1fr}}
@media (max-width:560px){.mock{padding:12px;border-radius:16px}.mock-bar{padding:6px 6px 14px}.mock-tabs{display:none}.decide{padding:18px}.decide h3{font-size:20px}.meter{display:none}}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;position:relative;counter-reset:s}
.steps::before{content:"";position:absolute;left:0;right:0;top:5px;height:1px;background:var(--line-2)}
.step{position:relative;padding-top:36px;display:grid;grid-row:span 4;grid-template-rows:subgrid;grid-template-columns:minmax(0,1fr);row-gap:12px;align-content:start}
.step::before{content:"";position:absolute;left:0;top:0;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid var(--ink)}
.step .num{font-family:var(--mono);font-size:13px;color:var(--accent)}
.step p{color:var(--muted);font-size:17px;line-height:1.55}
.mini{margin-top:8px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;font-size:13px;min-height:176px;display:flex;flex-direction:column;gap:8px}
.mini-row{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:9px 10px}
.mini-row{min-width:0}
.mini-row span:first-child{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mini .chip{height:22px;font-size:12px;padding:0 8px}
.q{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:600}
.q::before{content:"";width:16px;height:16px;border-radius:50%;flex:none;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.q small{margin-left:auto;color:var(--muted);font-weight:400;font-size:13px}
.crumb{display:flex;flex-wrap:wrap;gap:6px}
.crumb span{padding:4px 8px;border-radius:6px;background:#fff;border:1px solid var(--line);color:var(--muted);font-weight:600;font-size:13px}
.crumb span.done{color:var(--ink)}
.crumb span.now{background:var(--ink);border-color:var(--ink);color:#fff}
.mini .k{font-size:12px;color:var(--muted)}
.file{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:13px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 10px;overflow-wrap:anywhere;min-width:0}
.file::before{content:"";width:10px;height:12px;border-radius:2px;border:1.5px solid var(--faint);flex:none}
@media (max-width:1000px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 24px}.steps::before{display:none}}
@media (max-width:620px){.steps{grid-template-columns:minmax(0,1fr);gap:48px}.step{padding-top:0}.step::before{display:none}}

/* Split: Saturday does / you do */
.split{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.panel{border:1px solid var(--line);border-radius:var(--r-lg);padding:36px}
.panel.alt{background:var(--surface)}
.panel h3{font-size:22px;letter-spacing:-.02em;margin-bottom:22px;display:flex;align-items:center;gap:10px}
.ticks{list-style:none;display:flex;flex-direction:column}
.ticks li{position:relative;padding:14px 0 14px 32px;border-top:1px solid var(--line);font-size:17px;line-height:1.5;color:var(--text)}
.ticks li:first-child{border-top:0;padding-top:0}
.ticks li::before{content:"";position:absolute;left:0;top:17px;width:18px;height:18px;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.ticks li:first-child::before{top:3px}
.ticks.you li::before{background:#fff;border:1.5px solid var(--ink)}
.ticks code{background:#fff;border:1px solid var(--line);padding:1px 5px;border-radius:4px;font-size:.85em;color:var(--ink)}
@media (max-width:900px){.split{grid-template-columns:1fr}.panel{padding:24px}}

/* Three up */
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}
.three > div{border-top:1px solid var(--ink);padding-top:22px;display:flex;flex-direction:column;gap:10px}
.three p{color:var(--muted);font-size:17px}
@media (max-width:900px){.three{grid-template-columns:1fr;gap:32px}}

/* Agents band */
.agents-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.agents-grid .h2{margin:18px 0 20px}
.agents-grid > div > p{color:var(--muted);font-size:17px;max-width:42ch}
.bullets{list-style:none;margin:28px 0 32px;display:flex;flex-direction:column;gap:12px}
.bullets li{display:flex;gap:12px;font-size:17px;color:var(--text)}
.bullets li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ink);margin-top:.62em;flex:none}
.term{background:var(--ink-w);color:var(--code-text);border-radius:var(--r-lg);box-shadow:var(--shadow-3);overflow:hidden;font-family:var(--mono);font-size:14px;line-height:1.7}
.term-top{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--code-line)}
.term-top span{color:var(--code-muted);font-size:12px}
.term pre{font-family:inherit;margin:0;padding:20px 22px;overflow-x:auto;white-space:pre}
.term .p{color:var(--code-prompt)}
.term .c{color:var(--code-muted)}
.term .s{color:#7DD3A6}
.term .k{color:var(--code-key)}
@media (max-width:1000px){.agents-grid{grid-template-columns:1fr;gap:40px}}
@media (max-width:560px){.term{font-size:12px}.term pre{padding:16px}}

/* Footer: three columns, no link farm */
.site-footer{border-top:1px solid var(--line);padding:56px 0 48px;margin-top:0}
.site-footer .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:32px 48px;align-items:start}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.foot-h{font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;line-height:1.4}
.foot-cols ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.foot-cols a,.foot-cols span{font-size:15px;color:var(--text);text-decoration:none;line-height:1.4}
.foot-cols span{color:var(--muted)}
.foot-cols a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.copy{grid-column:1/-1;font-size:13px;color:var(--muted);padding-top:24px;border-top:1px solid var(--line);margin-top:8px}
@media (max-width:720px){.site-footer .wrap{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.foot-cols{gap:12px}.foot-cols a,.foot-cols span{font-size:14px}}

/* Page head (inner pages) */
.page-head{padding:96px 0 56px}
.page-head h1{font-size:clamp(2.6rem,1.2rem + 4vw,4.5rem);letter-spacing:-.04em;line-height:1;margin:22px 0 22px}
.page-head .lead{max-width:48ch}
@media (max-width:720px){.page-head{padding:56px 0 36px}}

/* Pricing */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.plan{position:relative;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 24px 28px;display:flex;flex-direction:column;background:#fff}
.plan.featured{border-color:var(--ink);box-shadow:var(--shadow-2)}
/* Bar follows the 16px corner (Slopes P1-2): a 16px box with a 4px hard-stop gradient instead of a 4px box whose radius gets clamped. */
.plan.featured::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:16px;border-radius:16px 16px 0 0;background:linear-gradient(var(--dot) 4px,transparent 4px)}
.plan h2{font-size:20px;letter-spacing:-.015em;font-weight:650}
.plan .who{color:var(--muted);font-size:15px;line-height:1.5;margin-top:8px;min-height:3em}
.badge{display:inline-flex;font-size:12px;font-weight:600;color:var(--accent);background:var(--tint);border-radius:999px;padding:3px 9px}
.badge.ghost{color:var(--muted);background:var(--surface)}
.price{display:flex;align-items:baseline;gap:6px;margin-top:24px;color:var(--ink)}
.price b{font-size:48px;font-weight:650;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.price span{color:var(--muted);font-size:15px}
.then{font-size:14px;color:var(--muted);margin-top:8px;min-height:1.5em}
@media (max-width:620px){.then-pad{display:none}}
.then strong{color:var(--ink);font-weight:600}
.quota{margin:22px 0 0;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-weight:600;color:var(--ink);font-size:17px}
.quota small{display:block;font-weight:400;color:var(--muted);font-size:14px;margin-top:2px}
.plan ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:10px}
.plan li{position:relative;padding-left:22px;font-size:15px;line-height:1.45;color:var(--text)}
.plan li::before{content:"";position:absolute;left:2px;top:.55em;width:7px;height:7px;border-radius:50%;border:1.5px solid var(--ink)}
.plans-cta{margin-top:40px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:28px 32px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line)}
.plans-cta p{font-size:17px;color:var(--text);max-width:52ch}
.plans-cta p strong{color:var(--ink)}
@media (max-width:1100px){.plans{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.plans{grid-template-columns:1fr}.plan .who{min-height:0}.plans-cta{padding:22px}}
.incl{display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px;list-style:none}
.incl li{padding:18px 0;border-top:1px solid var(--line);font-size:17px;color:var(--text);line-height:1.5}
.incl li b{display:block;color:var(--ink);font-weight:600;margin-bottom:2px}
@media (max-width:900px){.incl{grid-template-columns:1fr}}
.faq{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 56px;margin:0}
.faq div{display:flex;flex-direction:column;gap:8px}
.faq dt{font-weight:600;color:var(--ink);font-size:17px;letter-spacing:-.01em}
.faq dd{margin:0;color:var(--muted)}
@media (max-width:900px){.faq{grid-template-columns:1fr;gap:28px}}

/* Prose (privacy, agents) */
.prose-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;align-items:start;padding-bottom:120px}
.toc{position:sticky;top:100px;display:flex;flex-direction:column;gap:2px;list-style:none;font-size:15px}
.toc a{display:block;padding:6px 0 6px 14px;border-left:1px solid var(--line);color:var(--muted);text-decoration:none}
.toc a:hover{color:var(--ink);border-left-color:var(--ink)}
.prose{max-width:68ch}
.prose h2{font-size:26px;letter-spacing:-.02em;margin:56px 0 14px;scroll-margin-top:96px}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{color:var(--text);font-size:17px;line-height:1.65}
.prose p+p,.prose ul+p{margin-top:14px}
.prose ul{margin:12px 0 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.prose ul li{position:relative;padding-left:20px}
.prose ul li::before{content:"";position:absolute;left:2px;top:.68em;width:6px;height:6px;border-radius:50%;background:var(--ink)}
.prose a{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:4px}
.prose a:hover{text-decoration-color:var(--ink)}
.prose code{background:var(--surface);border:1px solid var(--line);border-radius:4px;padding:1px 5px;font-size:.84em;color:var(--ink);word-break:break-word}
.summary-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 28px;margin-bottom:8px}
.summary-box p{font-size:17px;color:var(--ink)}
.for-agents{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:12px;background:var(--tint);color:var(--ink);font-size:15px;line-height:1.5;margin-bottom:8px}
.for-agents b{color:var(--accent)}
.codeblock{margin:16px 0 0;background:var(--code-bg);color:var(--code-text);border-radius:12px;padding:18px 20px;font-family:var(--mono);font-size:13px;line-height:1.7;overflow-x:auto;white-space:pre}
.codeblock .c{color:var(--code-muted)}
.kv{width:100%;border-collapse:collapse;margin-top:14px;font-size:15px}
.kv th,.kv td{text-align:left;padding:12px 12px 12px 0;border-top:1px solid var(--line);vertical-align:top}
.kv th{font-weight:600;color:var(--ink);width:120px}
.kv td code{font-size:13px}
.prose .tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;list-style:none;margin-top:16px!important}
.prose .tools li{padding:9px 12px;border:1px solid var(--line);border-radius:8px;font-family:var(--mono);font-size:13px;color:var(--ink);background:#fff}
.prose .tools li::before{display:none}
@media (max-width:900px){.prose-grid{grid-template-columns:minmax(0,1fr);gap:24px;padding-bottom:80px}.toc{display:none}.prose .tools{grid-template-columns:1fr 1fr}}
@media (max-width:360px){.prose .tools{grid-template-columns:1fr}}

/* Waitlist */
.wl{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-areas:"intro card" "next card";grid-template-rows:auto 1fr;column-gap:72px;align-items:start;padding:88px 0 120px}
.wl-intro{grid-area:intro}
.wl .form-card{grid-area:card}
.wl > .next{grid-area:next}
#wl-title:focus{outline:none}
.wl-intro h1{font-size:clamp(2.5rem,1.2rem + 3.6vw,4rem);letter-spacing:-.04em;line-height:1.02;margin:22px 0 20px}
.next{list-style:none;margin-top:40px;display:flex;flex-direction:column;counter-reset:n}
.next li{counter-increment:n;display:grid;grid-template-columns:36px 1fr;gap:4px;padding:16px 0;border-top:1px solid var(--line);font-size:17px;color:var(--text)}
.next li::before{content:"0" counter(n);font-family:var(--mono);font-size:13px;color:var(--accent);padding-top:3px}
.next li b{display:block;color:var(--ink);font-weight:600}
.form-card{border:1px solid var(--line);border-radius:20px;padding:40px;box-shadow:var(--shadow-2);background:#fff}
.form-card h2{font-size:24px;letter-spacing:-.02em}
.form-card .sub{color:var(--muted);font-size:15px;margin:8px 0 28px}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
.field label,.field legend{font-size:15px;font-weight:600;color:var(--ink)}
.field .opt{font-weight:400;color:var(--muted)}
.hint{font-size:14px;color:var(--muted);margin-top:-2px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
input[type=text],input[type=email],select,textarea{font:inherit;font-size:17px;color:var(--ink);background:#fff;border:1px solid var(--field);border-radius:8px;height:48px;padding:0 14px;width:100%;transition:border-color .16s,box-shadow .16s;-webkit-appearance:none;appearance:none}
textarea{height:auto;min-height:104px;padding:12px 14px;resize:vertical;line-height:1.5}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23111417' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px 8px;padding-right:40px}
input:hover,select:hover,textarea:hover{border-color:var(--ink)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--ink);border-radius:8px}
[aria-invalid=true]{border-color:var(--err)!important;box-shadow:inset 0 0 0 1px var(--err)}
.err{display:none;align-items:flex-start;gap:8px;font-size:14px;font-weight:600;color:var(--err);line-height:1.4}
.err::before{content:"!";flex:none;width:16px;height:16px;margin-top:1px;border-radius:50%;background:var(--err);color:#fff;font-size:12px;font-weight:650;display:inline-flex;align-items:center;justify-content:center}
.field.invalid .err{display:flex}
.ts-wrap{min-height:65px}
#f-ts{margin-bottom:20px}
.consent{font-size:14px;color:var(--muted);margin:0 0 24px}
.consent a{color:var(--ink);font-weight:600;text-underline-offset:3px}
.err-summary{border:0;border-left:4px solid var(--err);background:var(--err-tint);border-radius:10px;padding:18px 20px;margin-bottom:28px}
.err-summary h2{font-size:17px;color:var(--err);letter-spacing:-.01em;margin-bottom:8px}
.err-summary ul{list-style:none;display:flex;flex-direction:column;gap:4px}
.err-summary a{color:var(--err);font-weight:600;font-size:15px;text-underline-offset:3px}
.err-summary:focus{outline:2px solid var(--err);outline-offset:2px}
.status{font-size:15px}
.status:empty{display:none}
.status.server{border:1px solid #F5C2CD;background:var(--err-tint);color:var(--err);border-radius:10px;padding:14px 16px;margin-bottom:20px;font-weight:600}
.success{text-align:left}
.success .check{width:48px;height:48px;border-radius:50%;background:var(--ok-tint);display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.success .check::before{content:"";width:22px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%2315803D' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/22px no-repeat}
.success p{color:var(--text);font-size:17px}
.success .back{margin-top:28px;display:inline-block}
[hidden]{display:none!important}
@media (max-width:1000px){.wl{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "card" "next";grid-template-rows:auto;row-gap:32px;padding:40px 0 72px}.wl > .next{margin-top:8px}.wl-intro h1{margin:16px 0 14px}}
@media (max-width:560px){.form-card{padding:24px 20px;border-radius:16px}.row2{grid-template-columns:1fr}}

.pt-0{padding-top:0}.pt-40{padding-top:40px}.pb-88{padding-bottom:88px}.pb-120{padding-bottom:120px}
.plan .badge{position:absolute;top:-12px;left:20px;margin:0;height:24px;align-items:center;padding:0 10px;background:var(--fill);color:var(--on-fill);font-weight:650}
.fit-if{margin-top:18px;font-size:15px;line-height:1.5;color:var(--text)}
.plans-note{margin-top:20px;font-size:15px;color:var(--muted)}
/* 404 */
.nf{padding:140px var(--gutter)}
.nf h1{font-size:56px;letter-spacing:-.04em;margin:20px 0 16px}

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

/* Turnstile needs 300px. Under 400px the card goes edge to edge so it always fits, down to 320px. */
@media (max-width:400px){.form-card{margin-inline:calc(var(--gutter)*-1);border-radius:0;border-inline:0;border-bottom:0;box-shadow:none;padding-inline:clamp(10px,calc((100vw - 300px)/2),20px)}}

/* Fix round 1 */
.show-sm{display:none}
@media (max-width:720px){.nav a.show-sm{display:inline-flex;height:36px;padding:0 14px}}
@media (max-width:480px){.nav .hide-xs{display:none}.nav{gap:16px}}
.ticks li{text-wrap:pretty}
.after-steps{margin-top:48px}
.plans{align-items:start}
/* Endpoints: stack label over URL on small screens (Slopes P1-3) */
@media (max-width:560px){.kv tr{display:block;border-top:1px solid var(--line);padding:12px 0}.kv th,.kv td{display:block;width:auto;border-top:0;padding:0}.kv td{margin-top:6px}}
/* Mobile home budget: keep step text, drop the step mocks and the facts strip */
@media (max-width:620px){.steps .mini{display:none}.steps{gap:32px}}
@media (max-width:420px){.codeblock{font-size:12px}}
.wl.is-done .wl-intro .lead{display:none}

/* Fix round 2 */
b,strong{font-weight:600}
.btn.no-dot::before{display:none}
.balance{text-wrap:balance}
@media (max-width:400px){.kv td code{font-size:12px}}
@media (max-width:400px){.nav{gap:12px}.nav a.show-sm{padding:0 12px;gap:8px}}
@media (max-width:350px){.nav a.show-sm::before{display:none}.nav{gap:8px}.nav a{font-size:14px}.nav a.show-sm{padding:0 8px}}

/* Round hg (inspiration addendum, Saturday identity) */
/* 1. Hero: subhead, then the audience line */
.sub-pair{display:flex;flex-direction:column;gap:16px}
.for-line{font-size:15px;line-height:1.5;color:var(--text);font-weight:500;padding-left:14px;border-left:2px solid var(--dot);max-width:34ch}

/* 2. Big-number band: static, DM Sans numbers, mono labels */
.nums{padding:88px 0 0}
.bignums{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));list-style:none;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.bignums li{display:flex;flex-direction:column;gap:14px;padding:28px 24px 32px;border-left:1px solid var(--line);min-width:0}
.bignums li:first-child{border-left:0;padding-left:0}
.bignums .n{font-size:clamp(3rem,1.6rem + 3vw,4.5rem);font-weight:650;letter-spacing:-.045em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.bignums .n small{font-size:.34em;font-weight:600;letter-spacing:-.01em}
.bignums .l{font-family:var(--mono);font-size:13px;line-height:1.45;color:var(--muted)}
@media (max-width:900px){
  .nums{padding-top:56px}
  .bignums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bignums li{border-left:0;border-top:1px solid var(--line);padding:22px 16px 24px 0}
  .bignums li:nth-child(even){border-left:1px solid var(--line);padding-left:16px}
  .bignums li:nth-child(-n+2){border-top:0}
  .bignums li:last-child{grid-column:1/-1}
}

/* 3. Second product screen beside "It writes from your own work." */
.own-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.own-copy .h2{margin-bottom:20px}
.own-lead{color:var(--muted);font-size:17px;max-width:44ch}
.own-list{list-style:none;margin-top:32px;display:flex;flex-direction:column}
.own-list li{border-top:1px solid var(--line);padding:18px 0;display:flex;flex-direction:column;gap:6px}
.own-list li:last-child{padding-bottom:0}
.own-list p{color:var(--muted);font-size:16px;line-height:1.55}
.pkg-view{padding:24px}
.pv-head .k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.pv-head h3{font-size:22px;letter-spacing:-.02em;line-height:1.2;margin:10px 0 8px}
.pv-files{list-style:none;margin:20px 0 16px;display:flex;flex-direction:column;gap:8px}
.pv-files li{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-width:0}
.fn{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:13px;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fn::before{content:"";width:10px;height:12px;border-radius:2px;border:1.5px solid var(--faint);flex:none}
.fm{font-size:13px;color:var(--muted);white-space:nowrap;flex:none}
.fm .mono{font-size:12px;color:var(--ink)}
.pv-flag{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:10px;background:var(--surface)}
.pv-flag p{font-size:15px;line-height:1.5;color:var(--text)}
.pv-flag b{color:var(--ink)}
@media (max-width:1000px){.own-grid{grid-template-columns:minmax(0,1fr);gap:40px}}
@media (max-width:560px){.pkg-view{padding:18px}.pv-head h3{font-size:20px}}
@media (max-width:480px){.pv-files li{flex-direction:column;align-items:flex-start;gap:2px}.fm{padding-left:20px}.pv-flag{flex-direction:column;gap:8px}}

/* 5. Who it is for */
.who-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none}
.who-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:12px;background:#fff}
.who-card p{color:var(--muted);font-size:16px;line-height:1.55;flex:1}
.who-card .link{margin-top:8px;align-self:flex-start}
.pill{align-self:flex-start;display:inline-flex;align-items:center;font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.06em;line-height:1.4;text-transform:uppercase;color:var(--ink);background:var(--surface);border:1px solid var(--line-2);border-radius:999px;padding:3px 10px}
@media (max-width:900px){.who-cards{grid-template-columns:minmax(0,1fr)}.who-card{padding:24px}}

/* 4. Closing band, same on every page */
.closing{padding:104px 0}
.closing-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end}
.closing-h{font-size:clamp(2.25rem,1rem + 3.6vw,4.25rem);letter-spacing:-.04em;line-height:1.02}
.closing .stop{color:var(--dot)}
.closing p{font-size:17px;margin-bottom:28px;max-width:38ch}
@media (max-width:900px){.closing{padding:80px 0}.closing-in{grid-template-columns:minmax(0,1fr);gap:20px}}
@media (max-width:480px){.closing{padding:64px 0}.closing-h{font-size:40px}}

/* 6. Pricing header band: surface gray, cards overlap its bottom edge */
.price-band{background:var(--surface);border-bottom:1px solid var(--line);padding-bottom:128px}
.price-band .page-head{padding:88px 0 0}
.plans-wrap{position:relative;margin-top:-88px}
.plan h2.pill{font-size:12px;font-weight:400;letter-spacing:.06em;line-height:1.4;color:var(--ink)}
.plan.featured h2.pill{margin-top:6px}
.plan .price{margin-top:20px}
.price b{font-size:56px}
.plan .quota{margin:12px 0 0;padding:0;border:0;font-size:18px;font-weight:650;letter-spacing:-.01em}
.plan .then{margin-top:4px;min-height:0}
.plan .who{margin-top:18px;padding-top:18px;border-top:1px solid var(--line);min-height:0;color:var(--text)}
@media (max-width:720px){.price-band{padding-bottom:96px}.price-band .page-head{padding-top:56px}.plans-wrap{margin-top:-64px}}

/* CL P2s */
@media (max-width:340px){.kv td code{font-size:11px}}
@media (min-width:621px){.plan .then{min-height:3em}}

/* Fix round HG (Creative Lead fix round 1 on round hg) */
/* P1-1: closing band off ink on every page (surface ground, ink button) */
.closing{background:var(--surface);color:var(--ink);border-top:1px solid var(--line)}
.closing-h{color:var(--ink)}
.closing p{color:var(--muted)}
.closing :focus-visible{outline-color:var(--accent)}
.closing-h--sub{font-size:clamp(2rem,1rem + 2.6vw,3.25rem)}
@media (max-width:480px){.closing-h--sub{font-size:32px}}
/* P1-2: number band on the type scale, below the hero H1 at every width */
.bignums{grid-template-columns:1fr 1fr 1.25fr 1fr 1fr}
.bignums .n{font-size:64px}
.bignums .n small{font-size:24px}
.bignums .l{text-wrap:balance}
@media (max-width:900px){.bignums{grid-template-columns:repeat(2,minmax(0,1fr))}.bignums .n{font-size:36px}.bignums .n small{font-size:15px}}
/* 3: mobile length: compact number list, no agent who card (agent band follows) */
@media (max-width:620px){
  .nums{padding-top:40px}
  .bignums li{gap:4px;padding:14px 12px 14px 0}
  .bignums li:nth-child(even){padding-left:12px}
  .bignums .l{font-size:12px}
  .who-agent{display:none}
}
/* Package mock: hairline rows instead of a third nested box */
.pv-files{gap:0;margin:16px 0 14px}
.pv-files li{border:0;border-top:1px solid var(--line);border-radius:0;padding:10px 0;background:none}
.pv-files li:last-child{border-bottom:1px solid var(--line)}
/* 8, 9: type scale */
.own-list p,.who-card p{font-size:15px}
.who-card p{text-wrap:pretty}
.plan .quota{font-size:17px}
.for-line{font-weight:400}
/* 7, 10: footer tagline under the logo, plain text; 24px link targets */
.foot-brand{display:flex;flex-direction:column;gap:10px}
.foot-tag{font-size:14px;color:var(--muted)}
.foot-cols ul{gap:4px}
.foot-cols a{display:inline-block;padding:3px 0;min-height:24px}
@media (max-width:480px){.closing-h:not(.closing-h--sub){font-size:36px}}

/* ===================== Visual pass (L-20261102-0021): warm color, depth, framed screens ===================== */
:root{
  --cream:#FFF8F2; --peach:#FFEEE3; --warm-line:#F0E2D7; --warm-line-2:#E6D3C5;
  --ink-w:#111417; --ink-w-2:#1F1B18; --on-ink:#F7F2EE; --on-ink-muted:#CBBFB6; --orange-on-ink:#FF8A4C;
  --shadow-card:0 0 0 1px rgba(var(--shade-rgb),.05),0 1px 2px rgba(var(--shade-rgb),.05),0 10px 24px -12px rgba(var(--shade2-rgb),.16);
  --shadow-lift:0 0 0 1px rgba(var(--shade-rgb),.06),0 2px 4px rgba(var(--shade-rgb),.05),0 18px 36px -14px rgba(var(--shade3-rgb),.26);
  --shadow-shot:0 0 0 1px rgba(var(--shade-rgb),.07),0 1px 2px rgba(var(--shade-rgb),.06),0 8px 16px -6px rgba(var(--shade-rgb),.10),0 30px 60px -18px rgba(var(--shade3-rgb),.24),0 70px 120px -50px rgba(var(--accent-rgb),.30);
}
.ic{width:20px;height:20px;flex:none}
.ic-xs{width:14px;height:14px}

/* Header: warm hairline */
.site-header{background:var(--header-bg);border-bottom-color:var(--warm-line)}

/* Hero: warm wash, orange glow behind the product shot, light dot texture */
.hero{position:relative;overflow:hidden;padding-bottom:120px;background:linear-gradient(180deg,var(--bg) 0%,var(--cream) 62%,var(--bg) 100%)}
.hero > .wrap{position:relative;z-index:1}
.hero-glow{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(42% 46% at 72% 64%,rgba(var(--glow-rgb),.26),rgba(var(--glow-rgb),0) 70%),
    radial-gradient(30% 34% at 96% 30%,rgba(var(--glow2a-rgb),.30),rgba(var(--glow2a-rgb),0) 70%),
    radial-gradient(36% 40% at 40% 100%,rgba(var(--glow3a-rgb),.30),rgba(var(--glow3a-rgb),0) 70%)}
.hero-glow::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(var(--accent-rgb),.16) 1px,transparent 1.3px);background-size:22px 22px;
  -webkit-mask-image:radial-gradient(60% 70% at 70% 50%,#000 20%,transparent 75%);mask-image:radial-gradient(60% 70% at 70% 50%,#000 20%,transparent 75%)}
.for-line{border-left-color:var(--dot)}

/* Framed screenshot component */
.shot{margin:0;position:relative;background:#fff;border-radius:16px;box-shadow:var(--shadow-shot);overflow:hidden;isolation:isolate}
.shot-chrome{display:flex;align-items:center;gap:12px;height:40px;padding:0 14px;background:linear-gradient(180deg,var(--chrome-1),var(--chrome-2));border-bottom:1px solid var(--warm-line)}
.shot-chrome .tl{display:flex;gap:6px;flex:none}
.shot-chrome .tl i{width:10px;height:10px;border-radius:50%;background:var(--tl)}
.shot-chrome .tl i:first-child{background:var(--tl-1)}
.shot-chrome .url{flex:1;min-width:0;max-width:360px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:6px;height:24px;padding:0 10px;border-radius:7px;background:#fff;border:1px solid var(--warm-line);font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shot-chrome .url .ic{color:var(--muted)}
.shot-chrome .tag-example{flex:none;background:var(--tint);border-color:var(--tint-line);color:var(--accent)}
.shot-body{background:linear-gradient(180deg,var(--shot-bg-1),var(--shot-bg-2));padding:18px}
.shot-img img{width:100%;height:auto;display:block}
.shot-pair{position:relative}
.shot-over{position:absolute;z-index:2;width:58%;box-shadow:var(--shadow-shot)}
.shot-over .shot-chrome{height:34px}
.shot-over .shot-chrome .tl i{width:8px;height:8px}
.shot-over .shot-chrome .url{display:none}
.shot-over .shot-body{padding:14px}
.shot-over-l{left:-44px;bottom:-84px}
.shot-over-r{right:-28px;top:-48px;width:52%}
.hero-shots .shot-main{transform:none}
.hero-row{align-items:center}
.app-mark{font-weight:650;letter-spacing:-.03em;color:var(--ink);font-size:14px;margin-right:6px}
.app-mark i{display:inline-block;width:.3em;height:.3em;border-radius:50%;background:var(--dot);margin-left:.08em}
.mock-bar{padding:2px 4px 16px}
.mock-tabs b{background:var(--tint);color:var(--accent);padding:2px 8px;border-radius:6px;margin:-2px 0}
.meter-track span{background:var(--dot)}
.card{border-color:var(--card-line)}
@media (max-width:1000px){.shot-over-l{left:auto;right:-12px;bottom:-72px;width:62%}}
@media (max-width:620px){
  .shot-over{display:none}
  .hero{padding-bottom:72px}
  .shot-body{padding:12px}
  .shot-chrome .url{display:none}
  .shot-chrome{justify-content:space-between}
}

/* Browse mock (fit bars) */
.bw{display:flex;flex-direction:column;gap:8px;font-size:13px}
.bw-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-bottom:4px}
.bw-top b{color:var(--ink);font-size:15px}
.bw-count{color:var(--accent);font-weight:600}
.bw-filter{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;color:var(--muted);background:#fff;border:1px solid var(--warm-line);border-radius:6px;padding:2px 8px}
.bw-row{display:grid;grid-template-columns:minmax(0,1fr) 72px auto;align-items:center;gap:12px;background:#fff;border:1px solid var(--card-line);border-radius:10px;padding:10px 12px}
.bw-t{display:flex;flex-direction:column;min-width:0}
.bw-t b{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bw-t span{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fitbar{height:6px;border-radius:6px;background:var(--track);overflow:hidden}
.fitbar i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--bar-from),var(--dot))}
.fitbar .f-hi{width:88%}.fitbar .f-mid{width:58%}.fitbar .f-lo{width:26%;background:var(--bar-lo)}

/* Number band: cream ground */
.nums{padding:72px 0 76px;background:var(--cream);border-top:1px solid var(--warm-line);border-bottom:1px solid var(--warm-line)}
.bignums{border-top-color:var(--ink);border-bottom-color:var(--warm-line-2)}
.bignums li{border-left-color:var(--warm-line-2)}
.bignums .n small{color:var(--accent)}
@media (max-width:620px){.nums{padding:40px 0 44px}}

/* Six steps: ink section with orange glow (light warm tint when INK_BAND=0) */
.how-ink{position:relative;overflow:hidden;background:
  radial-gradient(50% 44% at 50% 0%,rgba(var(--glow-rgb),.16),rgba(var(--glow-rgb),0) 70%),var(--peach)}
.how-ink > .wrap{position:relative}
.flow{display:flex;align-items:center;gap:16px;margin:8px 0 56px}
.flow-cap{flex:none;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:6px 12px;border-radius:999px;border:1px solid var(--accent-line);background:#fff;color:var(--accent)}
.flow-end{background:var(--fill);border-color:var(--fill);color:var(--on-fill)}
.flow-steps{flex:1;list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));position:relative}
.flow-steps::before{content:"";position:absolute;left:-16px;right:-16px;top:27px;height:2px;background:linear-gradient(90deg,rgba(var(--glow-rgb),.25),var(--dot) 50%,rgba(var(--glow-rgb),.25))}
.flow-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.flow-steps .fi{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:#fff;color:var(--accent);border:1px solid var(--accent-line);box-shadow:0 8px 20px -8px rgba(var(--accent-rgb),.35)}
.flow-steps .fi .ic{width:24px;height:24px}
.flow-steps b{font-size:15px;font-weight:600;color:var(--ink)}
.flow-steps small{font-family:var(--mono);font-size:12px;color:var(--muted)}
.how-ink .steps::before,.how-ink .step::before{display:none}
.how-ink .step{padding:24px;border-radius:18px;background:#fff;box-shadow:var(--shadow-card)}
.step .num{display:inline-flex;align-items:center;gap:10px}
.step .si{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--tint);color:var(--accent)}
.step .si .ic{width:20px;height:20px}
.how-ink .mini{background:var(--cream);border-color:var(--warm-line)}
@media (max-width:900px){
  .flow{flex-direction:column;align-items:flex-start;gap:12px}
  .flow-steps{grid-template-columns:minmax(0,1fr);gap:12px;width:100%;padding-left:4px}
  .flow-steps::before{left:31px;right:auto;top:-12px;bottom:-12px;width:2px;height:auto;background:linear-gradient(180deg,rgba(var(--glow-rgb),.25),var(--dot) 50%,rgba(var(--glow-rgb),.25))}
  .flow-steps li{flex-direction:row;text-align:left;gap:14px}
  .flow-steps .fi{width:56px;height:44px;border-radius:12px}
  .flow-steps small{margin-left:auto}
}
@media (max-width:620px){.flow-steps .fi{width:56px;height:40px}.flow{margin-bottom:40px}}

/* Ink mode (default) */
.ink-on .how-ink{color:var(--on-ink);background:
  radial-gradient(46% 52% at 50% -6%,rgba(var(--glow-rgb),.40),rgba(var(--glow-rgb),0) 72%),
  radial-gradient(34% 40% at 100% 100%,rgba(var(--glow-rgb),.20),rgba(var(--glow-rgb),0) 70%),
  radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.3px) 0 0/24px 24px,
  var(--ink-w)}
.ink-on .how-ink .h2{color:#fff}
.ink-on .how-ink .sec-head p{color:var(--on-ink-muted)}
.ink-on .how-ink .flow-cap{background:rgba(255,255,255,.06);border-color:rgba(var(--on-ink-accent-rgb),.45);color:var(--orange-on-ink)}
.ink-on .how-ink .flow-end{background:var(--fill);border-color:var(--fill);color:var(--on-fill)}
.ink-on .how-ink .flow-steps .fi{background:var(--ink-w-2);color:var(--orange-on-ink);border-color:rgba(var(--on-ink-accent-rgb),.40);box-shadow:0 0 0 6px rgba(var(--glow-rgb),.06),0 10px 30px -8px rgba(var(--glow-rgb),.45)}
.ink-on .how-ink .flow-steps b{color:#fff}
.ink-on .how-ink .flow-steps small{color:var(--on-ink-muted)}
.ink-on .how-ink .step{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 24px 48px -20px rgba(0,0,0,.6)}
.ink-on .how-ink :focus-visible{outline-color:var(--orange-on-ink)}
/* one filled orange button per page: the closing band; the #how button is light on ink */
.ink-on .how-ink .btn{background:var(--on-ink);color:var(--ink)}
.ink-on .how-ink .btn:hover{background:#fff}

/* Split: writer screen beside the two panels */
.split-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:start}
.split-grid .split{grid-template-columns:minmax(0,1fr);gap:16px}
.split-grid .panel{padding:28px}
.panel{background:#fff;border-color:var(--warm-line);box-shadow:var(--shadow-card)}
.panel.alt{background:var(--cream)}
@media (max-width:1000px){.split-grid{grid-template-columns:minmax(0,1fr)}.split-grid .split{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.split-grid .split{grid-template-columns:minmax(0,1fr)}}
.wr{display:grid;grid-template-columns:150px minmax(0,1fr) 110px;gap:14px;font-size:13px}
.wr .k{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.wr-out ol{list-style:none;display:flex;flex-direction:column;gap:4px}
.wr-out li{padding:6px 8px;border-radius:7px;color:var(--muted);overflow-wrap:anywhere}
.wr-out li.d{color:var(--ink)}
.wr-out li.d::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ok);margin-right:7px;vertical-align:middle}
.wr-out li.now{background:var(--tint);color:var(--accent);font-weight:600}
.wr-doc{background:#fff;border:1px solid var(--card-line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:9px;box-shadow:var(--shadow-card)}
.wr-doc h4{font-size:17px;margin-top:4px}
.wr-p{color:var(--text);font-size:13px;line-height:1.5}
.wr .ln{display:block;height:7px;border-radius:4px;background:var(--skel)}
.wr .w92{width:92%}.wr .w80{width:80%}.wr .w88{width:88%}.wr .w64{width:64%}
.wr-src{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:12px;color:var(--accent);background:var(--tint);border-radius:7px;padding:6px 8px}
.wr-side .pg{color:var(--muted);margin-bottom:6px}
.wr-side .pg b{font-size:20px;color:var(--ink)}
.wr-side .meter-track{display:block;width:100%;margin-bottom:16px}
.wr-side .meter-track .m72{width:72%}
@media (max-width:620px){.wr{grid-template-columns:minmax(0,1fr)}.wr-out,.wr-side{display:none}}

/* Own work: peach ground, package plus review screens */
.own-sec{background:linear-gradient(180deg,var(--peach),var(--cream));border-top:1px solid var(--warm-line);border-bottom:1px solid var(--warm-line);padding:104px 0}
.own-shots{margin-top:8px}
.own-shots .shot-main{margin-right:32px}
/* B51: review-criticals is a second main-size frame under the deliver frame, stepped right (no overlap: at overlap size its text would fall under 9px). B53: not placed (package + health card instead), rule kept for a swap back. */
.own-shots .shot-review{margin:20px 0 0 32px}
.rvw{font-size:13px}
.rvw-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.rvw-top b{font-size:15px;color:var(--ink)}
.rvw-top span{font-family:var(--mono);font-size:11px;color:var(--muted)}
.rvw ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.rvw li{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#fff;border:1px solid var(--card-line);border-radius:9px;padding:8px 10px;color:var(--ink)}
.pv-head .k{color:var(--accent)}
@media (max-width:1000px){.own-shots{margin-top:56px}.own-shots .shot-main{margin-right:0}.own-shots .shot-review{margin-left:0}.shot-over-r{right:-8px;top:-40px}}
@media (max-width:620px){.own-sec{padding:72px 0}.own-shots{margin-top:0}}

/* Pills and badges */
.pill-o{background:var(--tint);border-color:var(--tint-line);color:var(--accent)}
.pill-p{background:var(--surface-2);border-color:var(--warm-line-2);color:var(--ink)}
.pill-i{background:var(--surface-2);border-color:var(--warm-line-2);color:var(--ink)}
.plan h2.pill.pill-o{color:var(--accent)}
.plan h2.pill.pill-p{color:var(--ink)}

/* Cards lift on hover */
.who-card,.plan,.panel,.how-ink .step{transition:transform .22s cubic-bezier(.2,0,0,1),box-shadow .22s cubic-bezier(.2,0,0,1)}
.who-card{border-color:var(--warm-line);box-shadow:var(--shadow-card)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .who-card:hover,.plan:hover,.panel:hover,.how-ink .step:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
}

/* Agent band and trust icons */
.band-warm{background:linear-gradient(180deg,var(--cream),#fff);border-color:var(--warm-line)}
.term{box-shadow:var(--shadow-shot);background:var(--ink-w)}
.term-top{border-bottom-color:var(--code-line)}
.three > div{border-top-color:var(--warm-line-2)}
.ti{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--tint);color:var(--accent);margin-bottom:6px}

/* Closing band: ink with orange glow by default; warm light when INK_BAND=0 */
.closing{position:relative;overflow:hidden;background:
  radial-gradient(40% 70% at 85% 100%,rgba(var(--glow-rgb),.18),rgba(var(--glow-rgb),0) 70%),var(--cream);border-top:1px solid var(--warm-line)}
.closing > .wrap{position:relative}
.ink-on .closing{border-top:0;color:var(--on-ink);background:
  radial-gradient(44% 80% at 82% 110%,rgba(var(--glow-rgb),.46),rgba(var(--glow-rgb),0) 70%),
  radial-gradient(30% 60% at 0% 0%,rgba(var(--glow-rgb),.14),rgba(var(--glow-rgb),0) 70%),
  radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.3px) 0 0/24px 24px,
  var(--ink-w)}
/* Light default (2026-11-02): the closing period sits on cream, where the signal dot is 2.96:1; use the accent text colour there */
.ink-off .closing .stop{color:var(--accent)}
.ink-on .closing-h{color:#fff}
.ink-on .closing p{color:var(--on-ink-muted)}
.ink-on .closing :focus-visible{outline-color:var(--orange-on-ink)}
.ink-on .btn-close{background:var(--fill);color:var(--ink)}
.ink-on .btn-close::before{background:var(--ink)}
.ink-on .btn-close:hover{background:var(--fill-hover)}

/* Pricing and inner pages: warm header wash */
.price-band{background:
  radial-gradient(40% 70% at 85% 0%,rgba(var(--glow-rgb),.16),rgba(var(--glow-rgb),0) 70%),
  radial-gradient(30% 60% at 10% 100%,rgba(var(--glow3c-rgb),.28),rgba(var(--glow3c-rgb),0) 70%),var(--cream);border-bottom-color:var(--warm-line)}
.plan{border-color:var(--warm-line);box-shadow:var(--shadow-card)}
.plan.featured{border-color:var(--dot);box-shadow:0 0 0 1px var(--dot),var(--shadow-lift)}
.plan li::before{border-color:var(--accent)}
.plans-cta{background:var(--cream);border-color:var(--warm-line)}
.page-head{position:relative}
main > .wrap > .page-head:first-child,.agents-head,.privacy-head{background:none}

/* Fade-up on scroll (motion.js adds .rv only below the fold; none under reduced motion) */
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.2,0,0,1),transform .6s cubic-bezier(.2,0,0,1)}
  .rv.in{opacity:1;transform:none}
}
/* Visual pass, tuning after first look */
.hero-glow{background:
  radial-gradient(46% 52% at 72% 66%,rgba(var(--glow-rgb),.34),rgba(var(--glow-rgb),0) 70%),
  radial-gradient(32% 40% at 98% 26%,rgba(var(--glow2b-rgb),.38),rgba(var(--glow2b-rgb),0) 70%),
  radial-gradient(40% 44% at 30% 104%,rgba(var(--glow3b-rgb),.42),rgba(var(--glow3b-rgb),0) 70%)}
.hero{padding-bottom:200px}
.shot-over-l{left:-96px;bottom:-200px;width:50%}
@media (max-width:1000px){.hero{padding-bottom:180px}.shot-over-l{left:auto;right:-12px;bottom:-150px;width:62%}}
@media (max-width:620px){.hero{padding-bottom:64px}}
.split-grid{align-items:stretch}
.shot-writer{display:flex;flex-direction:column}
.shot-writer .shot-body{flex:1;display:flex}
.shot-writer .shot-body > div{flex:1;display:flex}
.shot-writer .wr{flex:1;align-items:stretch}
.shot-writer:has(.shot-img){align-self:start}
.wr-doc h5{font-size:14px;color:var(--ink);margin-top:10px}
.wr .w72{width:72%}.wr .w48{width:48%}
.wr-srcs{list-style:none;display:flex;flex-direction:column;gap:6px}
.wr-srcs li{font-size:12px;color:var(--accent);background:var(--tint);border-radius:6px;padding:4px 7px;line-height:1.35}
@media (max-width:1000px){.wr-more{display:none}}
.shot-over-r{top:-120px;right:-40px}
@media (max-width:1000px){.shot-over-r{top:-64px;right:-8px}}
/* B54: own work = package-deliver (Safety stamp, top) + package (main, full column width) + health card overlap.
   The card sits on the stamp's blank right side; its bottom stays 9px above the first file row of the package frame
   (it covers only the package chrome and the blank right of the Volumes header row), so no file time is covered.
   top scales with the stack: own-shots height H = 92px + 0.7525 W (W = frame width), card bottom limit = 83px + 0.2194 W,
   so top = 29.16% minus (card height + 9px slack minus 26.8px): 216.8px for the 232px card (273px tall), 183.8px for 200px (240px tall).
   The ET times need the frames at least 668px wide at 1440 (11px effective text): no right step, own grid gap 40px on desktop. */
.own-shots .shot-main{margin-right:0}
.own-shots .shot-deliver + .shot-main{margin-top:12px}
.shot-health{width:232px;top:calc(29.16% - 216.8px);right:-40px}
@media (min-width:1001px){.own-grid{gap:40px}.own-shots{margin-top:0}.section-tight.own-sec{padding:72px 0 40px}}
@media (max-width:1000px){.own-shots{margin-top:56px}.shot-health{width:200px;top:calc(29.16% - 183.8px);right:-8px}}
.hero-row{align-items:start}
@media (min-width:1001px){.shot-over-l{left:-350px;bottom:-176px;width:50%}}
@media (max-width:1000px){.wr .wr-more{display:none}}
@media (max-width:620px){
  .shot-writer{display:none}
  .split-grid{display:block}
  .how-ink .step{padding:20px}
  .how-ink .steps{gap:16px}
  .flow-steps{gap:8px}
  .flow-steps .fi{height:36px;width:48px}
  .flow-steps::before{left:27px}
}
.incl li{border-top-color:var(--warm-line-2)}
.incl b::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--dot);margin-right:9px;vertical-align:.1em}
/* Real app stills in the frames */
.shot-img{display:block}
.shot-img img{display:block;width:100%;height:auto}
.how-shot{max-width:960px;margin:56px auto 8px;position:relative}
@media (max-width:620px){.how-shot{display:none}}
@media (min-width:1001px){.hero-shots .shot-over-l{left:-330px;bottom:-60px;width:44%}}
@media (min-width:1001px){.hero{padding-bottom:120px}}
.how-shot{margin-bottom:56px}
/* Warm head band on Privacy and Agents (and any page-head not inside the pricing band) */
main{overflow-x:clip}
.wrap > .page-head{isolation:isolate}
.wrap > .page-head::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;left:50%;transform:translateX(-50%);
  background:radial-gradient(40% 80% at 85% 0%,rgba(var(--glow-rgb),.14),rgba(var(--glow-rgb),0) 70%),radial-gradient(30% 70% at 5% 100%,rgba(var(--glow3c-rgb),.26),rgba(var(--glow3c-rgb),0) 70%),linear-gradient(var(--cream),var(--cream));
  border-bottom:1px solid var(--warm-line)}
.wrap > .page-head{margin-bottom:40px}
.price-band .page-head::before{content:none}
.price-band .page-head{margin-bottom:0}

/* ===================== CL fix round (L-20261102-0021-ppc-uiguy-visual-cl-fix1) ===================== */
/* 6: no tilts anywhere; hero = decide card (main) with browse rows overlapping lower left, desktop only */
.shot,.shot-over,.shot-main{transform:none}
@media (min-width:1001px){
  .hero-shots{padding-bottom:150px}
  .hero-shots .shot-over-l{left:-140px;bottom:0;width:54%}
}
@media (max-width:1000px){.hero{padding-bottom:72px}.hero-shots .shot-over-l{left:auto;right:-12px;bottom:-110px;width:56%}.hero-shots{margin-bottom:96px}}
@media (max-width:620px){.hero-shots{margin-bottom:0}.hero{padding-bottom:48px}}
.shot-img{background:#fff}
/* 10: pull the orange back toward the HG level: softer hero glow, no dot texture */
.hero-glow{background:
  radial-gradient(40% 46% at 74% 62%,rgba(var(--glow-rgb),.16),rgba(var(--glow-rgb),0) 70%),
  radial-gradient(36% 40% at 30% 104%,rgba(var(--glow3b-rgb),.24),rgba(var(--glow3b-rgb),0) 70%)}
.hero-glow::after{content:none}
.ink-on .how-ink{background:
  radial-gradient(46% 52% at 50% -6%,rgba(var(--glow-rgb),.26),rgba(var(--glow-rgb),0) 72%),
  var(--ink-w)}
/* 7: cards only (no flow, no browse shot in #how), no step numbers; the icon badge stays */
.step .num{gap:0}
/* 8: Writing chip in the orange tint */
.chip-tint{background:var(--tint);color:var(--accent)}
/* 11: step mock labels wrap instead of truncating */
.mini-row span:first-child{white-space:normal;overflow:visible;text-overflow:clip}
.mini{min-height:0}
/* 12: claim chip under "Claims get checked" */
.own-chip{align-self:flex-start;margin-top:4px}
/* 2: 404 band headline 40px, below the 56px H1 */
.closing-h.closing-h--nf{font-size:40px}
/* 7: mobile length: hide the package frame, the agent code block and the Agent card; tighter sections */
@media (max-width:620px){
  .own-shots,.term,.who-agent{display:none}
  .agents-grid{display:block}
  .section{padding:64px 0}
  .section-tight{padding:56px 0}
  .own-sec{padding:56px 0}
  .closing{padding:56px 0}
}
/* length: desktop home within 7 screens at 900, mobile within 8 at 844 */
@media (min-width:901px){.section{padding:96px 0}.section-tight{padding:72px 0}.own-sec{padding:72px 0}.closing{padding:88px 0}}
@media (min-width:1001px){.hero-shots{padding-bottom:110px}}
@media (max-width:620px){.how-ink .mini{display:none}.how-ink .steps{gap:12px}.after-steps{margin-top:28px}}
/* mobile hero frame nearly full bleed so the app text reads at about 10px */
/* mobile length: icon beside the heading in step and trust cards, tighter lists and heads */
@media (max-width:620px){
  .how-ink .step{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:14px;row-gap:6px;align-items:center}
  .how-ink .step .num{grid-row:1;grid-column:1}
  .how-ink .step h3{grid-row:1;grid-column:2}
  .how-ink .step p{grid-column:1/-1}
  .three{gap:24px}
  .three > div{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;row-gap:6px;align-items:center;padding-top:18px}
  .three .ti{margin:0}
  .three p{grid-column:1/-1}
  .ticks li{padding:10px 0 10px 32px}
  .split-grid .panel{padding:22px}
  .sec-head{margin-bottom:28px}
  .own-list li{padding:14px 0}
  .who-cards{gap:16px}
  .who-card{padding:22px}
  .section{padding:56px 0}
  .section-tight{padding:48px 0}
  .own-sec{padding:48px 0}
}
@media (max-width:620px){
  .section{padding:48px 0}
  .section-tight,.own-sec{padding:40px 0}
  .closing{padding:48px 0}
  .site-footer{padding:40px 0 32px}
  .bignums li{padding-top:14px;padding-bottom:16px;gap:8px}
  .hero{padding-top:36px}
  .ticks li{font-size:16px}
  .after-steps{margin-top:20px}
}
@media (max-width:620px){.nums{padding:48px 0 48px}}
@media (max-width:620px){.closing{padding:40px 0}}
/* hero, desktop: browse rows sit below the decide card, offset right, overlapping only its bottom margin */
@media (min-width:1001px){
  .hero{padding-bottom:56px}
  .hero-shots{padding-bottom:291px}
  .hero-shots .shot-over-l{left:auto;right:-40px;bottom:0;width:60%}
  .section{padding:88px 0}.section-tight,.own-sec{padding:64px 0}
  .nums{padding:60px 0 60px}
}

/* P2 (CL sign, UXPro trims): mobile only. Desktop copy and layout unchanged. */
@media (max-width:620px){
  .split .panel-does{display:none}
  .split{grid-template-columns:1fr}
  .bignums .nm-hide{display:none}
  .bignums{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bignums li,.bignums li:nth-child(even){border-top:0;border-left:1px solid var(--warm-line-2);padding:14px 10px 16px}
  .bignums li:first-child{border-left:0;padding-left:0}
  .bignums .l{font-size:12px}
  .steps .step p .more{display:none}
}

/* ===================== THEMES:BEGIN (generated by _tools/themes.py; edit there) ===================== */
html[data-theme="saffron"]{
  --bg:#FFFBF0;
  --ink:#1C1A14;
  --text:#2F2C23;
  --muted:#5C5647;
  --faint:#595344;
  --line:#EBEBE9;
  --line-2:#DEDDDA;
  --field:#807B6F;
  --surface:#FFF8E3;
  --surface-2:#F4EFE4;
  --dot:#F2A900;
  --accent:#8A5A00;
  --tint:#FFF1CC;
  --fill:#F2A900;
  --on-fill:#1A1407;
  --fill-hover:#F4B626;
  --stop:#B27C00;
  --btn-dot:#F2A900;
  --main-bg:#F2A900;
  --main-text:#1A1407;
  --main-edge:#B88205;
  --main-hover:#D89802;
  --main-dot:#1A1407;
  --accent-rgb:138,90,0;
  --glow-rgb:242,169,0;
  --glow2a-rgb:247,199,89;
  --glow2b-rgb:246,195,76;
  --glow3a-rgb:251,219,143;
  --glow3b-rgb:250,216,133;
  --glow3c-rgb:250,216,133;
  --shade-rgb:58,44,14;
  --shade2-rgb:88,61,9;
  --shade3-rgb:88,61,9;
  --on-ink-accent-rgb:242,193,78;
  --orange-on-ink:#F2C14E;
  --header-bg:rgba(255,251,240,.9);
  --cream:#FFF6DC;
  --peach:#FFF1CC;
  --warm-line:#EFE2BF;
  --warm-line-2:#E2D5B4;
  --chrome-1:#FFFDF6;
  --chrome-2:#FFF6E0;
  --tl:#E2D5B4;
  --tl-1:#F2A900;
  --tint-line:#EAD6A7;
  --accent-line:#DEC793;
  --shot-bg-1:#FFFCF4;
  --shot-bg-2:#F8F4E9;
  --card-line:#F2E8CC;
  --track:#F5E8C4;
  --bar-from:#F8D073;
  --bar-lo:#CECCC8;
  --skel:#F7E9C5;
  --code-bg:#1C1A14;
  --code-text:#FFF9EB;
  --code-muted:#A5A29A;
  --code-line:#373530;
  --code-prompt:#F2C14E;
  --code-key:#F8E0A6;
  --ink-w:#1C1A14;
  --ink-w-2:#2C2A24;
}
html[data-theme="spruce"]{
  --bg:#F6FAF8;
  --ink:#10201C;
  --text:#23332E;
  --muted:#4F5E59;
  --faint:#4C5B56;
  --line:#EAECEB;
  --line-2:#DCDFDE;
  --field:#76817E;
  --surface:#EFF7F4;
  --surface-2:#EAEFED;
  --dot:#0F7B6C;
  --accent:#0B6357;
  --tint:#E3F1EC;
  --fill:#0F7B6C;
  --on-fill:#FFFFFF;
  --fill-hover:#338F82;
  --stop:#0F7B6C;
  --btn-dot:#3FC1A9;
  --main-bg:#0F7B6C;
  --main-text:#FFFFFF;
  --main-edge:transparent;
  --main-hover:#0F7062;
  --main-dot:#FFFFFF;
  --accent-rgb:11,99,87;
  --glow-rgb:15,123,108;
  --glow2a-rgb:99,169,159;
  --glow2b-rgb:87,163,152;
  --glow3a-rgb:163,206,198;
  --glow3b-rgb:153,200,191;
  --glow3c-rgb:153,200,191;
  --shade-rgb:14,50,44;
  --shade2-rgb:13,69,60;
  --shade3-rgb:13,69,60;
  --on-ink-accent-rgb:94,211,189;
  --orange-on-ink:#5ED3BD;
  --header-bg:rgba(246,250,248,.9);
  --cream:#ECF5F1;
  --peach:#E3F1EC;
  --warm-line:#D4E2DD;
  --warm-line-2:#C8D7D2;
  --chrome-1:#FAFCFB;
  --chrome-2:#EDF6F3;
  --tl:#C8D7D2;
  --tl-1:#0F7B6C;
  --tint-line:#BCD7D1;
  --accent-line:#A7C9C2;
  --shot-bg-1:#F9FCFA;
  --shot-bg-2:#EFF4F2;
  --card-line:#DDE8E4;
  --track:#DAE8E3;
  --bar-from:#7BB6AE;
  --bar-lo:#CACFCD;
  --skel:#DCEAE5;
  --code-bg:#10201C;
  --code-text:#F4F9F7;
  --code-muted:#9EA6A4;
  --code-line:#2D3B37;
  --code-prompt:#5ED3BD;
  --code-key:#AEE9DE;
  --ink-w:#10201C;
  --ink-w-2:#21302C;
}
html[data-theme="volt"]{
  --bg:#FAFAF5;
  --ink:#0E0F0C;
  --text:#232520;
  --muted:#55574F;
  --faint:#51534C;
  --line:#EBEBEA;
  --line-2:#DDDDDC;
  --field:#7A7C76;
  --surface:#F7FAE8;
  --surface-2:#EEEFE9;
  --dot:#8DB600;
  --accent:#4D6B00;
  --tint:#F1FBD0;
  --fill:#D4FF3A;
  --on-fill:#0E0F0C;
  --fill-hover:#DAFF58;
  --stop:#5E8500;
  --btn-dot:#D4FF3A;
  --main-bg:#D4FF3A;
  --main-text:#0E0F0C;
  --main-edge:#7F9826;
  --main-hover:#BCE234;
  --main-dot:#0E0F0C;
  --accent-rgb:77,107,0;
  --glow-rgb:212,255,58;
  --glow2a-rgb:227,255,127;
  --glow2b-rgb:225,255,117;
  --glow3a-rgb:232,252,163;
  --glow3b-rgb:231,252,156;
  --glow3c-rgb:231,252,156;
  --shade-rgb:32,40,8;
  --shade2-rgb:49,66,5;
  --shade3-rgb:49,66,5;
  --on-ink-accent-rgb:212,255,58;
  --orange-on-ink:#D4FF3A;
  --header-bg:rgba(250,250,245,.9);
  --cream:#F5FBE1;
  --peach:#F1FBD0;
  --warm-line:#E1EBC3;
  --warm-line-2:#D5DDB9;
  --chrome-1:#FCFCF9;
  --chrome-2:#F6FAE4;
  --tl:#D5DDB9;
  --tl-1:#8DB600;
  --tint-line:#D3E1AB;
  --accent-line:#C3D396;
  --shot-bg-1:#FCFCF8;
  --shot-bg-2:#F3F3EE;
  --card-line:#E7EFCF;
  --track:#E8F1C8;
  --bar-from:#C0D773;
  --bar-lo:#CCCDCA;
  --skel:#E9F3CA;
  --code-bg:#0E0F0C;
  --code-text:#F9FDEC;
  --code-muted:#A2A39E;
  --code-line:#2B2C29;
  --code-prompt:#D4FF3A;
  --code-key:#EAFF9C;
  --ink-w:#0E0F0C;
  --ink-w-2:#1F201D;
}
html[data-theme="moss"]{
  --bg:#F7F5EF;
  --ink:#23211C;
  --text:#35322C;
  --muted:#5F5A50;
  --faint:#5C574D;
  --line:#ECEBEA;
  --line-2:#DFDEDC;
  --field:#827E76;
  --surface:#F3F0E8;
  --surface-2:#ECEAE4;
  --dot:#5E6B3A;
  --accent:#4E5A2F;
  --tint:#ECE8DC;
  --fill:#5E6B3A;
  --on-fill:#FFFFFF;
  --fill-hover:#768158;
  --stop:#5E6B3A;
  --btn-dot:#A9B77A;
  --main-bg:#5E6B3A;
  --main-text:#FFFFFF;
  --main-edge:transparent;
  --main-hover:#576236;
  --main-dot:#FFFFFF;
  --accent-rgb:78,90,47;
  --glow-rgb:94,107,58;
  --glow2a-rgb:150,159,127;
  --glow2b-rgb:142,151,117;
  --glow3a-rgb:193,194,171;
  --glow3b-rgb:186,188,163;
  --glow3c-rgb:186,188,163;
  --shade-rgb:47,48,33;
  --shade2-rgb:59,64,38;
  --shade3-rgb:59,64,38;
  --on-ink-accent-rgb:195,207,146;
  --orange-on-ink:#C3CF92;
  --header-bg:rgba(247,245,239,.9);
  --cream:#F1EEE5;
  --peach:#ECE8DC;
  --warm-line:#DEDACE;
  --warm-line-2:#D3CEC3;
  --chrome-1:#FAF9F5;
  --chrome-2:#F2EFE6;
  --tl:#D3CEC3;
  --tl-1:#5E6B3A;
  --tint-line:#D0CEBD;
  --accent-line:#C0C0AC;
  --shot-bg-1:#F9F8F4;
  --shot-bg-2:#F1EFE9;
  --card-line:#E5E1D8;
  --track:#E4DFD4;
  --bar-from:#A6AE93;
  --bar-lo:#CFCECA;
  --skel:#E5E1D5;
  --code-bg:#23211C;
  --code-text:#F7F6F1;
  --code-muted:#A7A49F;
  --code-line:#3D3C37;
  --code-prompt:#C3CF92;
  --code-key:#E1E7C8;
  --ink-w:#23211C;
  --ink-w-2:#32312C;
}
html[data-theme="indigo"]{
  --bg:#F8F8FC;
  --ink:#111827;
  --text:#252C3B;
  --muted:#545A6A;
  --faint:#515767;
  --line:#EAEBED;
  --line-2:#DDDEE1;
  --field:#7A7E8B;
  --surface:#F4F6FD;
  --surface-2:#EDEDF2;
  --dot:#4F46E5;
  --accent:#4338CA;
  --tint:#EEF2FF;
  --fill:#3730A3;
  --on-fill:#FFFFFF;
  --fill-hover:#554FB1;
  --stop:#4F46E5;
  --btn-dot:#A5B4FC;
  --main-bg:#3730A3;
  --main-text:#FFFFFF;
  --main-edge:transparent;
  --main-hover:#322D94;
  --main-dot:#FFFFFF;
  --accent-rgb:67,56,202;
  --glow-rgb:55,48,163;
  --glow2a-rgb:125,120,195;
  --glow2b-rgb:115,110,191;
  --glow3a-rgb:183,184,227;
  --glow3b-rgb:174,174,223;
  --glow3c-rgb:174,174,223;
  --shade-rgb:30,33,84;
  --shade2-rgb:44,42,129;
  --shade3-rgb:44,42,129;
  --on-ink-accent-rgb:165,180,252;
  --orange-on-ink:#A5B4FC;
  --header-bg:rgba(248,248,252,.9);
  --cream:#F2F5FE;
  --peach:#EEF2FF;
  --warm-line:#DFE3F0;
  --warm-line-2:#D2D7E4;
  --chrome-1:#FBFBFD;
  --chrome-2:#F4F5FD;
  --tl:#D2D7E4;
  --tl-1:#4F46E5;
  --tint-line:#CFD1F5;
  --accent-line:#BEBEF0;
  --shot-bg-1:#FAFAFD;
  --shot-bg-2:#F1F2F6;
  --card-line:#E5E9F3;
  --track:#E5E9F6;
  --bar-from:#9E99F1;
  --bar-lo:#CCCED2;
  --skel:#E6EAF8;
  --code-bg:#111827;
  --code-text:#F8FAFF;
  --code-muted:#A1A4AD;
  --code-line:#2E3441;
  --code-prompt:#A5B4FC;
  --code-key:#D2DAFE;
  --ink-w:#111827;
  --ink-w-2:#222836;
}
html[data-theme="violet"]{
  --bg:#FBF9FD;
  --ink:#1A1424;
  --text:#2E2838;
  --muted:#5C5566;
  --faint:#595263;
  --line:#EBEBED;
  --line-2:#DEDDE0;
  --field:#807A88;
  --surface:#F8F3FD;
  --surface-2:#F0EEF2;
  --dot:#9333C4;
  --accent:#5E1480;
  --tint:#F3E8FD;
  --fill:#7A1C9E;
  --on-fill:#FFFFFF;
  --fill-hover:#8E3EAD;
  --stop:#7A1C9E;
  --btn-dot:#D8B4FE;
  --main-bg:#7A1C9E;
  --main-text:#FFFFFF;
  --main-edge:transparent;
  --main-hover:#6E1B8F;
  --main-dot:#FFFFFF;
  --accent-rgb:94,20,128;
  --glow-rgb:122,28,158;
  --glow2a-rgb:169,107,192;
  --glow2b-rgb:162,96,187;
  --glow3a-rgb:207,171,224;
  --glow3b-rgb:201,161,220;
  --glow3c-rgb:201,161,220;
  --shade-rgb:44,20,62;
  --shade2-rgb:63,20,87;
  --shade3-rgb:63,20,87;
  --on-ink-accent-rgb:216,180,254;
  --orange-on-ink:#D8B4FE;
  --header-bg:rgba(251,249,253,.9);
  --cream:#F7F0FD;
  --peach:#F3E8FD;
  --warm-line:#E4D9EE;
  --warm-line-2:#D8CEE2;
  --chrome-1:#FDFBFE;
  --chrome-2:#F7F1FD;
  --tl:#D8CEE2;
  --tl-1:#9333C4;
  --tint-line:#D8C2E6;
  --accent-line:#C9ADDA;
  --shot-bg-1:#FCFBFE;
  --shot-bg-2:#F5F2F7;
  --card-line:#E9E1F1;
  --track:#EADFF4;
  --bar-from:#C48FDF;
  --bar-lo:#CECCD1;
  --skel:#EBE1F5;
  --code-bg:#1A1424;
  --code-text:#FAF6FE;
  --code-muted:#A5A2AB;
  --code-line:#35303E;
  --code-prompt:#D8B4FE;
  --code-key:#ECDAFE;
  --ink-w:#1A1424;
  --ink-w-2:#2A2433;
}
html[data-theme="cyan"]{
  --bg:#F7FAFC;
  --ink:#0F172A;
  --text:#222B3C;
  --muted:#4F5A66;
  --faint:#4C5763;
  --line:#EAEBED;
  --line-2:#DCDEE0;
  --field:#767E88;
  --surface:#F1F9FB;
  --surface-2:#EBEFF2;
  --dot:#06B6D4;
  --accent:#0E7490;
  --tint:#E6F6FA;
  --fill:#4F46E5;
  --on-fill:#FFFFFF;
  --fill-hover:#6962E9;
  --stop:#0891B2;
  --btn-dot:#22D3EE;
  --main-bg:#4F46E5;
  --main-text:#FFFFFF;
  --main-edge:transparent;
  --main-hover:#4740CF;
  --main-dot:#FFFFFF;
  --accent-rgb:14,116,144;
  --glow-rgb:6,182,212;
  --glow2a-rgb:93,208,227;
  --glow2b-rgb:81,204,225;
  --glow3a-rgb:163,227,239;
  --glow3b-rgb:152,224,237;
  --glow3c-rgb:152,224,237;
  --shade-rgb:14,48,70;
  --shade2-rgb:14,74,98;
  --shade3-rgb:14,74,98;
  --on-ink-accent-rgb:103,232,249;
  --orange-on-ink:#67E8F9;
  --header-bg:rgba(247,250,252,.9);
  --cream:#EEF8FB;
  --peach:#E6F6FA;
  --warm-line:#D7E6EB;
  --warm-line-2:#CBDADF;
  --chrome-1:#FAFCFD;
  --chrome-2:#EFF8FB;
  --tl:#CBDADF;
  --tl-1:#06B6D4;
  --tint-line:#BFDFE7;
  --accent-line:#AAD2DC;
  --shot-bg-1:#F9FCFD;
  --shot-bg-2:#F0F4F6;
  --card-line:#DFEBEF;
  --track:#DDEDF1;
  --bar-from:#76D7E7;
  --bar-lo:#CACED1;
  --skel:#DEEEF3;
  --code-bg:#0F172A;
  --code-text:#F5FBFD;
  --code-muted:#9EA4AB;
  --code-line:#2C3344;
  --code-prompt:#67E8F9;
  --code-key:#B3F4FC;
  --ink-w:#0F172A;
  --ink-w-2:#202739;
}
html[data-pop="cyan"]{--pop:#06B6D4;--pop-lg:#0B98B3;--pop-text:#107890;}
html[data-pop="warm"]{--pop:#F59E0B;--pop-lg:#C8780C;--pop-text:#A55B0E;}
html[data-pop="green"]{--pop:#84CC16;--pop-lg:#649A15;--pop-text:#4F7A15;}
/* hero glow follows the theme: soften saturated fills a bit */
html[data-theme="volt"] .hero-glow{opacity:.85}
/* THEMES:END */

/* POP accent (L-20261102-1030-ppc-indigo-default). One pop per build, POP=cyan|warm|green|none; values in the THEMES block.
   Marks only: --pop (raw) is decoration, --pop-lg is the only text use (large numerals, 3:1). Never body text, CTA or button fill.
   With POP=none the variables are unset and every placement falls back to the pre-pop look. */
.pop-u{text-decoration:underline;text-decoration-color:var(--pop,transparent);text-decoration-thickness:.085em;text-underline-offset:.12em;text-decoration-skip-ink:auto}
.bignums .pop-n{color:var(--pop-lg,inherit)}
.pop-rule{position:relative}
.pop-rule::before{content:"";position:absolute;left:0;top:-24px;width:48px;height:4px;border-radius:2px;background:var(--pop,transparent)}
@media (max-width:900px){.pop-rule::before{top:-18px;width:40px}}
.eyebrow-pop::before{background:var(--pop,var(--dot))}
.plan.featured::before{background:linear-gradient(var(--pop,var(--dot)) 4px,transparent 4px)}