

:root {
  
  --paper: #ffffff;        
  --mist: #f1f4fc;         
  --mist-2: #e2e8f9;       
  --ink: #0c1440;          
  --ink-2: #434c6e;        
  --blue: #2443eb;         
  --blue-deep: #182fb4;    
  --on-blue: #ffffff;      
  --on-blue-2: #dfe5ff;    
  --lime: #d8f85a;         
  --lime-deep: #c4e83c;    
  --line: #d3d9ea;         
  --field: #6f7aa3;        
  --pass: #0a7a4a;         
  --fail: #bf3327;         
  --navy: #0c1440;         

  
  --font-display: "Bricolage Grotesque", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --font-text: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-code: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --size-display: clamp(2.75rem, 5.6vw, 5.25rem);
  --size-h2: clamp(2.125rem, 4vw, 3.5rem);
  --size-h3: clamp(1.5rem, 2vw, 1.75rem);
  --size-lead: clamp(1.1875rem, 1.5vw, 1.375rem);
  --size-body: 1.125rem;   
  --size-small: 0.9375rem; 

  
  --gutter: clamp(20px, 4vw, 56px);
  --section: clamp(72px, 9vw, 136px);
  --wrap: 1200px;

  
  --radius-sheet: 6px;     
  --radius-ui: 14px;       
  --radius-well: 22px;     
  --radius-pill: 999px;    
  --shadow-sheet: 0 1px 0 rgba(12, 20, 64, .06), 0 30px 56px -22px rgba(6, 12, 60, .55);
}


*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-text);
  font-size: var(--size-body);
  line-height: 1.6;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.page { overflow-x: clip; }
img, svg { max-width: 100%; }
p { margin: 0 0 1em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
a { color: var(--blue); text-underline-offset: .18em; text-decoration-thickness: .08em; }
a:hover { color: var(--blue-deep); }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; border-radius: 4px; }
.on-blue :focus-visible, .on-navy :focus-visible { outline-color: var(--lime); }
::selection { background: var(--lime); color: var(--ink); }

.wrap { width: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; }
.section { padding-block: var(--section); }
.section--tight { padding-block: calc(var(--section) * .6); }
.section--flush-top { padding-top: 0; }


.band--mist { background: var(--mist); }
.band--blue {
  color: var(--on-blue);
  background-color: var(--blue);
  
  background-image:
    linear-gradient(rgba(255, 255, 255, .11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .11) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 160px 160px, 160px 160px, 32px 32px, 32px 32px;
  background-position: center top;
}
.band--blue a { color: var(--on-blue); }
.band--navy { background: var(--navy); color: var(--on-blue); }
.band--navy a { color: var(--on-blue); }


.display, .h2, .h3 {
  font-family: var(--font-display);
  font-stretch: 88%;
  margin: 0;
  text-wrap: balance;
}
.display { font-size: var(--size-display); font-weight: 700; line-height: .98; letter-spacing: -.035em; }
.display--xl { font-size: clamp(3.125rem, 7.2vw, 6.625rem); line-height: .94; letter-spacing: -.04em; }
.h2 { font-size: var(--size-h2); font-weight: 700; line-height: 1.02; letter-spacing: -.03em; }
.h3 { font-size: var(--size-h3); font-weight: 650; line-height: 1.12; letter-spacing: -.02em; }
.lead { font-size: var(--size-lead); line-height: 1.5; }
.small { font-size: var(--size-small); line-height: 1.5; }
.muted { color: var(--ink-2); }
.on-blue .muted, .on-navy .muted { color: var(--on-blue-2); }
.label { font-size: 1.0625rem; font-weight: 600; color: var(--blue); margin: 0 0 18px; }
.on-blue .label { color: var(--on-blue-2); }
.hl { background: var(--lime); color: var(--ink); padding: .04em .28em; border-radius: .18em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.code { font-family: var(--font-code); font-size: .9em; }


.pen { fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.pen--blue { color: var(--blue); }
.pen--pass { color: var(--pass); }
.icon { fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }


.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 52px; padding: 0 26px;
  border: 1.5px solid var(--ink); border-radius: var(--radius-pill);
  font-family: var(--font-text); font-size: 1.0625rem; font-weight: 650; line-height: 1.1;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color .15s ease, transform .15s ease;
}
.btn:active { transform: translateY(1px); }
.btn--primary, .band--blue a.btn--primary, .band--navy a.btn--primary { background: var(--lime); color: var(--ink); }
.btn--primary:hover { background: var(--lime-deep); color: var(--ink); }
.btn--quiet { background: transparent; color: var(--ink); }
.btn--quiet:hover { background: var(--mist); color: var(--ink); }
.on-blue .btn--quiet { color: var(--on-blue); border-color: rgba(255, 255, 255, .7); }
.on-blue .btn--quiet:hover { background: rgba(255, 255, 255, .12); color: var(--on-blue); }
.btn--lg { min-height: 62px; padding: 0 34px; font-size: 1.1875rem; }
.btn--sm { min-height: 44px; padding: 0 20px; font-size: 1rem; }
.btn--block { width: 100%; }

.link { font-weight: 650; }
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 36px; }
.cta-row__note { font-size: var(--size-small); }

.tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 11px; border-radius: var(--radius-pill);
  font-size: .875rem; font-weight: 650; line-height: 1.4; white-space: nowrap;
  border: 1.5px solid currentColor;
}
.tag--pass { color: var(--pass); }
.tag--fail { color: var(--fail); }
.tag--lime { background: var(--lime); color: var(--ink); border-color: var(--ink); }
.tag--blue { background: var(--blue); color: var(--on-blue); border-color: var(--blue); }


.nav { display: flex; align-items: center; gap: 28px; padding-block: 22px; position: relative; }
.nav__brand {
  font-family: var(--font-display); font-stretch: 90%; font-weight: 800; font-size: 1.75rem;
  letter-spacing: -.04em; line-height: 1; text-decoration: none; color: inherit;
}
.band--blue a.nav__brand { color: var(--on-blue); }
.nav__links { display: flex; gap: 30px; margin-left: auto; font-size: 1rem; font-weight: 500; }
.nav__links a { color: inherit; text-decoration: none; padding-block: 10px; border-bottom: 2px solid transparent; }
.nav__links a:hover { border-bottom-color: currentColor; }
.nav__links a[aria-current="page"] { border-bottom-color: var(--lime); }
.nav--paper .nav__links a[aria-current="page"] { border-bottom-color: var(--blue); }
.nav__menu { display: none; margin-left: auto; }
.nav__menu summary {
  list-style: none; cursor: pointer; min-height: 44px; padding: 0 18px;
  display: inline-flex; align-items: center; border: 1.5px solid currentColor; border-radius: var(--radius-pill);
  font-weight: 650; font-size: 1rem;
}
.nav__menu summary::-webkit-details-marker { display: none; }
.nav__menu-panel {
  position: absolute; left: 0; right: 0; top: 100%; z-index: 20;
  display: grid; gap: 2px; padding: 12px;
  background: var(--paper); color: var(--ink); border-radius: var(--radius-ui); box-shadow: var(--shadow-sheet);
}
.nav__menu-panel a, .band--blue .nav__menu-panel a { color: var(--ink); text-decoration: none; font-weight: 600; padding: 12px 14px; border-radius: 10px; }
.nav__menu-panel a:hover { background: var(--mist); }
@media (max-width: 1000px) {
  .nav__links { display: none; }
  .nav__menu { display: block; }
}
@media (max-width: 520px) { .nav > .btn { display: none; } }


.hero__grid {
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 56px; align-items: center;
  padding-block: clamp(36px, 5vw, 76px) clamp(48px, 6vw, 84px);
}
.hero__copy .lead { max-width: 33em; margin-top: 26px; }
.hero__side { min-width: 0; }
.hero__note { text-align: right; margin-top: 18px; }
.hero__side--stack { display: flex; justify-content: flex-end; padding: 20px 14px 28px 0; }
.hero__art { position: relative; display: flex; justify-content: flex-end; align-items: flex-end; }
@media (max-width: 1240px) { .hero__chat { width: 232px; } .phone { width: min(296px, 84vw); } }
@media (max-width: 1180px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .hero__art { justify-content: center; }
  .hero__note { text-align: center; }
  .hero__side--stack { justify-content: center; padding-right: 0; }
}

.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 1px solid rgba(255, 255, 255, .45); }
.facts__item { padding: 20px 20px 30px 0; }
.facts__item + .facts__item { padding-left: 24px; border-left: 1px solid rgba(255, 255, 255, .25); }
.facts dt { font-size: var(--size-small); color: var(--on-blue-2); }
.facts__more { display: block; font-family: var(--font-text); font-stretch: 100%; font-size: var(--size-small); font-weight: 400; letter-spacing: 0; line-height: 1.4; color: var(--on-blue-2); margin-top: 4px; }
.facts dd { margin: 4px 0 0; font-family: var(--font-display); font-stretch: 90%; font-size: 1.375rem; font-weight: 650; line-height: 1.2; letter-spacing: -.01em; }
@media (max-width: 860px) {
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .facts__item:nth-child(3) { padding-left: 0; border-left: 0; }
  .facts__item:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .25); }
}
@media (max-width: 340px) {
  .facts { grid-template-columns: minmax(0, 1fr); }
  .facts__item + .facts__item { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .25); }
}


.sheet {
  position: relative; background: var(--paper); color: var(--ink);
  border-radius: var(--radius-sheet); padding: 28px; box-shadow: var(--shadow-sheet);
}
.sheet a { color: var(--blue); }
.on-blue .sheet .muted { color: var(--ink-2); }
.stack { position: relative; width: min(100%, 492px); }
.stack .sheet { padding: 32px; }
.stack__back { position: absolute; inset: 0; border-radius: var(--radius-sheet); }
.stack__back--1 { background: #c9d2ff; transform: rotate(-3.2deg) translate(-14px, 12px); }
.stack__back--2 { background: #e6eaff; transform: rotate(2.4deg) translate(12px, 4px); }
.sheet__kind { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.sheet__title { font-family: var(--font-display); font-stretch: 88%; font-size: 1.75rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: 0; }
.sheet__sub { font-size: var(--size-small); color: var(--ink-2); margin: 6px 0 18px; }
.checkrows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.checkrow { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 1rem; line-height: 1.35; }
.checkrow__text { flex: 1; }
.checkrow__text small { display: block; font-size: .875rem; color: var(--ink-2); }
.titleblock { display: grid; grid-template-columns: auto minmax(0, 1fr); margin: 20px 0 0; border: 1.5px solid var(--ink); font-size: .9375rem; line-height: 1.4; }
.titleblock dt { padding: 8px 12px; color: var(--ink-2); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.titleblock dd { margin: 0; padding: 8px 12px; font-weight: 600; border-bottom: 1px solid var(--ink); position: relative; }
.titleblock dt:last-of-type, .titleblock dd:last-of-type { border-bottom: 0; }
.titleblock dd .pen { vertical-align: -3px; margin-left: 8px; }


.head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 20px 64px; align-items: end; margin-bottom: clamp(40px, 5vw, 72px); }
.head--stack { grid-template-columns: minmax(0, 1fr); max-width: 840px; }
.head .lead { color: var(--ink-2); margin: 0; }
.on-blue .head .lead { color: var(--on-blue-2); }
@media (max-width: 900px) { .head { grid-template-columns: minmax(0, 1fr); } }


.well { background: var(--mist); border-radius: var(--radius-well); padding: clamp(20px, 2.6vw, 32px); display: flex; flex-direction: column; justify-content: center; }
.band--mist .well { background: var(--paper); }
.ui { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-ui); padding: 18px 20px; font-size: 1rem; line-height: 1.45; color: var(--ink); }
.ui__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; font-size: .875rem; color: var(--ink-2); }
.ui__head b { color: var(--ink); font-size: 1rem; }
.ui__foot { margin: 12px 0 0; font-size: .875rem; color: var(--ink-2); }
.chat { display: flex; flex-direction: column; gap: 10px; }
.bubble { max-width: 90%; padding: 12px 16px; border-radius: 18px; font-size: 1rem; line-height: 1.4; }
.bubble__who { display: block; font-size: .8125rem; font-weight: 650; margin-bottom: 2px; }
.bubble--you { align-self: flex-end; background: var(--blue); color: var(--on-blue); border-bottom-right-radius: 5px; }
.bubble--you .bubble__who { color: var(--on-blue-2); }
.bubble--ai { align-self: flex-start; background: var(--paper); border: 1px solid var(--line); border-bottom-left-radius: 5px; }
.well > .chat > .bubble--ai, .hero__chat .bubble--ai { background: var(--paper); }
.bubble--ai .bubble__who { color: var(--blue); }
.saved { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; font-size: .875rem; font-weight: 650; color: var(--pass); }
.mini-table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.mini-table th { text-align: left; font-size: .8125rem; font-weight: 650; color: var(--ink-2); padding: 0 10px 8px 0; border-bottom: 1px solid var(--line); }
.mini-table td { padding: 10px 10px 10px 0; border-bottom: 1px solid var(--line); }
.mini-table tr:last-child td { border-bottom: 0; padding-bottom: 2px; }
.mini-table td:first-child { font-weight: 650; }
.rule { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--ink); margin-top: 18px; }
.rule__item { position: relative; padding: 12px 8px 0 0; font-size: .8125rem; line-height: 1.35; color: var(--ink-2); }
.rule__item::before { content: ""; position: absolute; left: 0; top: -7px; width: 2px; height: 12px; background: var(--ink); }
.rule__item b { display: block; font-family: var(--font-display); font-stretch: 90%; font-size: 1.0625rem; font-weight: 650; color: var(--ink); }
.figures { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 14px 0 12px; }
.figure { min-width: 0; background: var(--mist); border-radius: 10px; padding: 10px clamp(8px, 2.4vw, 12px); font-size: .8125rem; line-height: 1.3; color: var(--ink-2); }
.figure b { display: block; font-family: var(--font-display); font-stretch: 86%; font-size: clamp(.9375rem, 4vw, 1.1875rem); font-weight: 650; color: var(--ink); }
.figure--pick { background: var(--lime); color: var(--ink); }
.example-note { margin-top: 28px; font-size: var(--size-small); color: var(--ink-2); }
.on-blue .example-note { color: var(--on-blue-2); }


.phone {
  flex: none; width: min(318px, 84vw); position: relative; z-index: 1;
  border: 10px solid var(--ink); border-radius: 46px; background: var(--paper); color: var(--ink);
  padding: 30px 18px 22px; box-shadow: 0 40px 64px -26px rgba(5, 10, 50, .7);
}
.brief__title { font-family: var(--font-display); font-stretch: 88%; font-size: 1.625rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: 0; }
.brief__date { font-size: .875rem; color: var(--ink-2); margin: 2px 0 16px; }
.brief__group { border-top: 1px solid var(--line); padding: 11px 0; }
.brief__bar { display: flex; justify-content: space-between; align-items: center; font-weight: 650; font-size: 1rem; }
.brief__count { min-width: 26px; height: 26px; padding: 0 8px; border-radius: 13px; background: var(--mist-2); display: inline-grid; place-items: center; font-size: .875rem; font-weight: 650; }
.brief__count--hot { background: var(--lime); }
.brief__item { margin-top: 10px; font-size: .9375rem; line-height: 1.35; }
.brief__item b { display: block; }
.brief__item span { color: var(--ink-2); font-size: .875rem; }
.hero__chat { position: relative; z-index: 2; flex: none; width: 268px; margin: 0 -22px 54px 0; padding: 16px; border-radius: 20px; }
.hero__chat .bubble { max-width: 100%; font-size: .9375rem; padding: 10px 14px; }
@media (max-width: 620px) {
  .hero__art { flex-direction: column-reverse; align-items: center; gap: 20px; }
  .hero__chat { margin: 0; width: min(318px, 84vw); }
}


.phone.mb { padding: 0; overflow: hidden; background: #f5f4f2; color: #20242b; font-size: .875rem; line-height: 1.4; }
.mb__top { background: #22334d; color: #fff; padding: 26px 16px 14px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.mb__date { font-weight: 700; font-size: 1.375rem; line-height: 1.15; margin: 0; }
.mb__stamp { margin: 0; font-size: .8125rem; line-height: 1.35; color: #d6deea; }
.mb__stamp b { color: #fff; margin-right: 8px; }
.mb__body { padding: 2px 12px 16px; }
.mb__sec { display: flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 10px; padding: 6px 12px; border-radius: 14px; background: var(--t); color: var(--c); font-weight: 650; }
.mb__sec b { font-size: 1rem; font-weight: 700; }
.mb__count { margin-left: auto; font-size: .875rem; }
.mb__ico { flex: none; width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; background: var(--c); color: #fff; }
.mb__ico svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mb--today { --c: #7a5200; --t: #f5e9cf; } .mb--act { --c: #963a4e; --t: #f7e2e6; } .mb--soon { --c: #33557e; --t: #dfe7f2; }
.mb--tasks { --c: #4c6a1c; --t: #e5eed5; } .mb--unsure { --c: #614a8e; --t: #e9e3f4; } .mb--deal { --c: #2a6857; --t: #dbeee6; }
.mb__sec--open { border-radius: 14px 14px 0 0; }
.mb__box { background: #fff; border: 1px solid #e3e1dd; border-top: 0; border-radius: 0 0 14px 14px; padding: 12px 14px 14px; }
.mb__row { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.mb__row + .mb__row { margin-top: 3px; color: #5a5f66; }
.mb__status { font-size: .8125rem; font-weight: 650; border-radius: 6px; padding: 1px 7px; color: var(--c); background: var(--t); white-space: nowrap; }
.mb__side { font-size: .8125rem; font-weight: 600; color: #5a5f66; border: 1px solid #e3e1dd; border-radius: 6px; padding: 0 6px; white-space: nowrap; }
.mb__price { margin-top: 3px; color: #5a5f66; }
.mb__price b, .mb__next b { color: var(--c); }
.mb__bar { height: 8px; border-radius: 999px; background: #e3e1dd; overflow: hidden; margin-top: 10px; }
.mb__bar i { display: block; height: 100%; border-radius: 999px; background: var(--c); }
.mb__ends { display: flex; justify-content: space-between; gap: 6px; font-size: .8125rem; color: #5a5f66; margin-top: 5px; }
.mb__ends b { color: #20242b; }
.mb__next { margin-top: 8px; }


.dash { padding: 0; overflow: hidden; border: 1.5px solid var(--ink); }
.dash__banner { background: var(--mist-2); padding: 10px 22px; font-size: .875rem; font-weight: 600; color: var(--ink-2); }
.dash__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stat { padding: 24px 22px 28px; border-top: 1px solid var(--line); }
.stat:nth-child(odd) { border-right: 1px solid var(--line); }
.stat span { display: block; font-size: .9375rem; font-weight: 600; color: var(--ink-2); }
.stat b { display: block; font-family: var(--font-display); font-stretch: 86%; font-size: clamp(2.25rem, 4.2vw, 3.5rem); font-weight: 700; letter-spacing: -.03em; line-height: 1; margin-top: 10px; }
.stat--pick b { color: var(--blue); }


.crew { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
.crew__item { display: grid; grid-template-rows: subgrid; grid-row: span 2; gap: 26px; margin-bottom: 64px; }
.crew__item:nth-last-child(-n+2) { margin-bottom: 0; }
.crew__item .well { min-height: 316px; }
.crew__job { font-family: var(--font-display); font-stretch: 90%; font-size: 1.3125rem; font-weight: 600; line-height: 1.25; margin: 8px 0 10px; color: var(--blue); }
.crew__body { color: var(--ink-2); max-width: 34em; }
@media (max-width: 860px) { .crew { grid-template-columns: minmax(0, 1fr); } .crew__item, .crew__item:nth-last-child(-n+2) { margin-bottom: 48px; } .crew__item:last-child { margin-bottom: 0; } .crew__item .well { min-height: 0; } }


.day { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
.day__item { position: relative; padding: 30px 32px 0 0; }
.day__item::before { content: ""; position: absolute; left: 0; top: -9px; width: 2px; height: 16px; background: var(--ink); }
.day__time { font-family: var(--font-display); font-stretch: 86%; font-size: clamp(1.625rem, 2.3vw, 2.125rem); font-weight: 700; letter-spacing: -.02em; line-height: 1; color: var(--blue); }
.day__what { font-family: var(--font-display); font-stretch: 90%; font-size: 1.3125rem; font-weight: 650; line-height: 1.2; margin: 12px 0 8px; }
.day__body { color: var(--ink-2); font-size: 1.0625rem; }
@media (max-width: 960px) {
  .day { grid-template-columns: minmax(0, 1fr); border-top: 0; border-left: 2px solid var(--ink); }
  .day__item { padding: 0 0 36px 28px; }
  .day__item:last-child { padding-bottom: 0; }
  .day__item::before { left: -9px; top: 0; width: 16px; height: 2px; }
}
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px 64px; align-items: center; }
.split--wide-left { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.split--wide-right { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.split--top { align-items: start; }
@media (max-width: 900px) { .split, .split--wide-left, .split--wide-right { grid-template-columns: minmax(0, 1fr); } }

.video {
  position: relative; display: flex; align-items: flex-end; aspect-ratio: 16 / 9; overflow: hidden;
  padding: 24px 28px; border-radius: var(--radius-well); text-decoration: none;
}
.video__play { position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%); width: 84px; height: 84px; border-radius: 50%; background: var(--lime); color: var(--ink); display: grid; place-items: center; border: 1.5px solid var(--ink); }
.video__title { font-family: var(--font-display); font-stretch: 90%; font-weight: 650; font-size: 1.25rem; line-height: 1.2; max-width: 22em; }
.video__title small { display: block; font-family: var(--font-text); font-weight: 400; font-size: .9375rem; color: var(--on-blue-2); margin-top: 4px; }


.trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.trio__item { padding: 32px 36px 0 0; }
.trio__item + .trio__item { padding-left: 36px; border-left: 1px solid var(--line); }
.trio__item .icon { color: var(--blue); margin-bottom: 18px; }
.trio__item .h3 { margin-bottom: 10px; }
.trio__item p { color: var(--ink-2); }
@media (max-width: 860px) {
  .trio { grid-template-columns: minmax(0, 1fr); border-top: 0; }
  .trio__item, .trio__item + .trio__item { padding: 28px 0; border-left: 0; border-top: 1px solid var(--line); }
}


.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 48px; }
.step { position: relative; }
.step__num { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--blue); color: var(--on-blue); font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; position: relative; z-index: 1; }
.step::before { content: ""; position: absolute; top: 26px; left: 54px; right: -48px; height: 2px; background: var(--line); }
.step:last-child::before { display: none; }
.step .h3 { margin: 22px 0 10px; }
.step p { color: var(--ink-2); }
.on-blue .step p { color: var(--on-blue-2); }
@media (max-width: 860px) { .steps { grid-template-columns: minmax(0, 1fr); } .step::before { display: none; } }

.checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.checks li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 14px; align-items: start; }
.checks .pen { margin-top: 3px; color: var(--blue); }
.on-blue .checks .pen { color: var(--lime); }
.checks b { display: block; }
.checks li span { display: block; }
.checks--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 48px; }
@media (max-width: 860px) { .checks--3 { grid-template-columns: minmax(0, 1fr); } }


.own { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.own__col { border-radius: var(--radius-well); padding: clamp(24px, 3vw, 40px); background: var(--paper); }
.own__col--yours { background: var(--blue); color: var(--on-blue); }
.own__col .h3 { margin-bottom: 20px; }
.own__list { list-style: none; margin: 0; padding: 0; }
.own__list li { padding: 14px 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; }
.own__list li span { color: var(--ink-2); text-align: right; }
.own__col--yours .own__list li { border-top-color: rgba(255, 255, 255, .3); }
.own__col--yours .own__list li span { color: var(--on-blue-2); }
.notebox { margin-top: 24px; border: 1.5px dashed var(--ink); border-radius: var(--radius-ui); padding: 20px 24px; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 20px; align-items: baseline; }
.notebox b { font-family: var(--font-display); font-stretch: 90%; font-size: 1.1875rem; }
@media (max-width: 760px) { .own { grid-template-columns: minmax(0, 1fr); } .notebox { grid-template-columns: minmax(0, 1fr); } }


.photo { position: relative; overflow: hidden; border-radius: var(--radius-well); background: var(--mist-2); aspect-ratio: 4 / 5; display: grid; place-items: center; }
.photo--wide { aspect-ratio: 16 / 10; }
.photo--round { aspect-ratio: 1; border-radius: 50%; width: 72px; }
.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.photo__label { padding: 16px; text-align: center; font-size: .875rem; font-weight: 600; color: var(--ink-2); }
.placeholder {
  border: 1.5px dashed var(--blue); border-radius: var(--radius-ui); padding: 22px 24px; color: var(--ink);
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(36, 67, 235, .06) 10px 20px);
}
.placeholder__flag { display: inline-block; font-size: .8125rem; font-weight: 700; color: var(--blue); margin-bottom: 6px; }
.quote { font-family: var(--font-display); font-stretch: 90%; font-size: clamp(1.5rem, 2.5vw, 2.125rem); font-weight: 600; line-height: 1.18; letter-spacing: -.02em; margin: 0 0 20px; text-wrap: balance; }
.ledger { margin: 28px 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr); border-top: 1.5px solid var(--ink); }
.ledger dt { padding: 14px 28px 14px 0; font-family: var(--font-display); font-stretch: 90%; font-weight: 650; font-size: 1.1875rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ledger dd { margin: 0; padding: 14px 0; color: var(--ink-2); border-bottom: 1px solid var(--line); }
@media (max-width: 520px) { .ledger { grid-template-columns: minmax(0, 1fr); } .ledger dt { border-bottom: 0; padding-bottom: 0; } .ledger dd { padding-top: 4px; } }


.price { background: var(--paper); border-radius: var(--radius-well); padding: clamp(28px, 3.4vw, 44px); border: 1.5px solid var(--ink); }
.price__free { font-family: var(--font-display); font-stretch: 84%; font-size: clamp(4.5rem, 8vw, 7rem); font-weight: 800; line-height: 1; letter-spacing: -.04em; margin: 0 0 28px; }
.price__free .hl { display: inline-block; padding: .02em .14em .08em; border-radius: .08em; margin-left: -.06em; }
.price__then { margin-top: 26px; padding-top: 22px; border-top: 1.5px solid var(--ink); }
.price__amount { font-family: var(--font-display); font-stretch: 88%; font-size: 2.25rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.price__amount small { display: block; font-family: var(--font-text); font-size: 1.0625rem; font-weight: 400; letter-spacing: 0; line-height: 1.5; color: var(--ink-2); margin-top: 4px; }


.form { display: grid; gap: 20px; }
.form__title { font-family: var(--font-display); font-stretch: 88%; font-size: 1.625rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: 0; }
.fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.fieldset legend, .field label { display: block; padding: 0; font-weight: 650; font-size: 1rem; margin-bottom: 8px; }
.choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.choice { position: relative; display: block; }
.choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.choice__box { display: block; border: 1.5px solid var(--field); border-radius: var(--radius-ui); padding: 12px 16px; line-height: 1.3; }
.choice__box b { display: block; font-family: var(--font-display); font-stretch: 90%; font-size: 1.25rem; font-weight: 650; }
.choice__box span { font-size: .875rem; color: var(--ink-2); }
.choice input:checked + .choice__box { border-color: var(--blue); background: var(--mist); box-shadow: inset 0 0 0 1.5px var(--blue); }
.choice input:focus-visible + .choice__box { outline: 3px solid var(--blue); outline-offset: 3px; }
.input { width: 100%; min-height: 54px; padding: 0 16px; border: 1.5px solid var(--field); border-radius: var(--radius-ui); background: var(--paper); color: var(--ink); font: inherit; }
.input::placeholder { color: var(--ink-2); opacity: 1; }
.input:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-color: var(--blue); }
.form__fine { font-size: var(--size-small); color: var(--ink-2); margin: 0; }
.inline-form { display: flex; flex-wrap: wrap; gap: 10px; }
.inline-form .input { flex: 1 1 220px; width: auto; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }


.faq { border-top: 1.5px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: baseline; gap: 24px;
  padding: 22px 0; font-family: var(--font-display); font-stretch: 90%; font-size: 1.3125rem; font-weight: 650; line-height: 1.25;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; font-weight: 400; font-size: 1.75rem; line-height: .8; color: var(--blue); }
.faq details[open] summary::after { content: "\2212"; }
.faq__a { padding: 0 48px 26px 0; max-width: 44em; color: var(--ink-2); }


.rows { list-style: none; margin: 0; padding: 0; border-top: 1.5px solid var(--ink); }
.row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 8px 64px; align-items: baseline; padding: 26px 0; border-bottom: 1px solid var(--line); }
.row__name { font-family: var(--font-display); font-stretch: 88%; font-size: clamp(1.5rem, 2.6vw, 2.25rem); font-weight: 650; letter-spacing: -.025em; line-height: 1.08; margin: 0; }
.row__what { font-size: var(--size-lead); color: var(--ink-2); margin: 0; }
@media (max-width: 760px) { .row { grid-template-columns: minmax(0, 1fr); } }

.work { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.work__item { grid-column: span 4; display: flex; flex-direction: column; gap: 20px; }
.work__item--lead { grid-column: span 7; background: var(--mist); border-radius: var(--radius-well); padding: clamp(24px, 3vw, 40px); gap: 28px; }
.work__item--blue { grid-column: span 5; border-radius: var(--radius-well); padding: clamp(24px, 3vw, 40px); gap: 24px; }
.work__item--plain { padding-top: 28px; border-top: 1.5px solid var(--ink); margin-top: 24px; }
.work__item p { color: var(--ink-2); }
.work__item--blue p { color: var(--on-blue-2); }
.work__item .link { margin-top: auto; }
.work__stat { font-family: var(--font-display); font-stretch: 84%; font-size: clamp(4rem, 7vw, 6rem); font-weight: 800; line-height: .9; letter-spacing: -.04em; color: var(--blue); }
.work__stat small { display: block; font-family: var(--font-text); font-size: 1.0625rem; font-weight: 600; letter-spacing: 0; line-height: 1.4; color: var(--ink); margin-top: 8px; }
.work__visual { height: 214px; display: flex; flex-direction: column; justify-content: flex-end; }
.work__visual .photo { aspect-ratio: auto; height: 100%; }
.work__more { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--line); color: var(--ink-2); }
@media (max-width: 960px) { .work__item, .work__item--lead, .work__item--blue { grid-column: 1 / -1; } .work__visual { height: auto; } .work__visual .photo { aspect-ratio: 16 / 10; height: auto; } }
.chain { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.chain__step { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-ui); padding: 12px 16px; flex: 1 1 150px; font-size: .9375rem; line-height: 1.35; color: var(--ink-2); }
.chain__step b { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 1.0625rem; color: var(--ink); margin-bottom: 2px; }
.toolcalls { display: grid; gap: 8px; }
.toolcall { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; font-size: .875rem; color: var(--ink-2); }
.toolcall .code { color: var(--blue); font-weight: 600; }
.toolcall b { color: var(--ink); font-size: 1rem; }
.places { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.places li { background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .3); border-radius: var(--radius-ui); padding: 12px 14px; font-weight: 650; line-height: 1.25; }

.ladder { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1.5px solid var(--ink); }
.ladder__step { padding: 28px 36px 0 0; display: flex; flex-direction: column; }
.ladder__step + .ladder__step { padding-left: 36px; border-left: 1px solid var(--line); }
.ladder__name { display: flex; align-items: center; gap: 12px; font-weight: 650; font-size: 1.125rem; }
.ladder__num { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--blue); color: var(--on-blue); font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; }
.ladder__price { font-family: var(--font-display); font-stretch: 86%; font-size: clamp(2.25rem, 4vw, 3.5rem); font-weight: 700; letter-spacing: -.03em; line-height: 1; margin: 22px 0 6px; }
.ladder__price .hl { display: inline-block; padding: .04em .16em .08em; margin-left: -.06em; border-radius: .12em; }
.ladder__terms { font-size: var(--size-small); color: var(--ink-2); margin-bottom: 18px; min-height: 1.5em; }
.ladder__step p { color: var(--ink-2); }
.ladder__step .ladder__cta { margin-top: auto; padding-top: 22px; }
@media (max-width: 860px) {
  .ladder { grid-template-columns: minmax(0, 1fr); border-top: 0; }
  .ladder__step, .ladder__step + .ladder__step { padding: 28px 0 32px; border-left: 0; border-top: 1.5px solid var(--ink); }
}
.who { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 10px; }
.who li { font-family: var(--font-display); font-stretch: 90%; font-size: clamp(1.1875rem, 1.8vw, 1.5rem); font-weight: 600; line-height: 1.2; padding: 12px 20px; border: 1.5px solid var(--ink); border-radius: var(--radius-pill); }
.who li.who__ready { background: var(--lime); padding: 0; }
.who li.who__ready a { display: block; padding: 12px 20px; color: var(--ink); text-decoration: none; }
.who li.who__ready small { font-family: var(--font-text); font-size: .875rem; font-weight: 600; margin-left: 6px; }
.links { list-style: none; margin: 0; padding: 0; border-top: 1.5px solid var(--ink); }
.links li { border-bottom: 1px solid var(--line); }
.links a { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr) 104px; gap: 8px 32px; align-items: baseline; padding: 22px 0; text-decoration: none; color: var(--ink); }
.links a:hover .links__name { color: var(--blue); text-decoration: underline; text-underline-offset: .18em; }
.links__name { font-family: var(--font-display); font-stretch: 90%; font-size: 1.375rem; font-weight: 650; line-height: 1.2; }
.links__what { color: var(--ink-2); }
.links .tag { justify-self: end; }
@media (max-width: 760px) { .links a { grid-template-columns: minmax(0, 1fr); } .links .tag { justify-self: start; } }


.contact { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px 64px; align-items: end; }
.contact__ways { display: grid; gap: 6px; font-family: var(--font-display); font-stretch: 88%; font-size: clamp(1.625rem, 3vw, 2.5rem); font-weight: 650; letter-spacing: -.02em; line-height: 1.15; }
.contact__ways a { text-decoration-thickness: 2px; }
@media (max-width: 860px) { .contact { grid-template-columns: minmax(0, 1fr); align-items: start; } }

.footer { padding-block: 64px 28px; font-size: 1rem; }
.footer__block { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 3fr) minmax(0, 4fr); border: 1px solid rgba(255, 255, 255, .35); }
.footer__cell { padding: 28px 32px 32px; }
.footer__cell + .footer__cell { border-left: 1px solid rgba(255, 255, 255, .35); }
.footer__cell h2 { font-family: var(--font-text); font-size: .875rem; font-weight: 600; color: var(--on-blue-2); margin: 0 0 12px; }
.footer__brand { font-family: var(--font-display); font-stretch: 90%; font-weight: 800; font-size: 2rem; letter-spacing: -.04em; line-height: 1; margin: 0 0 10px; }
.footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.footer__list a { text-decoration: none; display: inline-block; padding-block: 9px; }
.footer__list a:hover { text-decoration: underline; }
.footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-top: 20px; font-size: .875rem; color: var(--on-blue-2); }
.footer__legal a { color: var(--on-blue-2); }
@media (max-width: 860px) {
  .footer__block { grid-template-columns: minmax(0, 1fr); }
  .footer__cell + .footer__cell { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .35); }
}


.sticky-cta { display: none; }
@media (max-width: 760px) {
  .sticky-cta {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--navy); color: var(--on-blue); font-size: .9375rem; line-height: 1.25;
  }
  .sticky-cta b { display: block; }
  .page--sticky { padding-bottom: 68px; }
}


.bar { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; padding-block: 20px; }
.bar__name { font-size: 1rem; font-weight: 600; margin-left: 12px; }
.bar__side { display: flex; align-items: center; gap: 8px 22px; flex-wrap: wrap; font-size: 1rem; font-weight: 600; }
.q { display: grid; gap: 16px; }
.q__count { font-size: var(--size-small); font-weight: 650; color: var(--blue); margin: 0; }
.q__text { font-family: var(--font-display); font-stretch: 88%; font-size: clamp(1.5rem, 2.5vw, 2.125rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.1; margin: 0; text-wrap: balance; }
.q__text--lg { font-size: clamp(1.75rem, 3.6vw, 3rem); }
.q__help { font-size: var(--size-small); color: var(--ink-2); margin: 0; }
.opts { display: grid; gap: 10px; }
.opts--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.opt {
  display: flex; align-items: center; gap: 14px; width: 100%; min-height: 60px; padding: 10px 18px;
  border: 1.5px solid var(--ink); border-radius: var(--radius-ui); background: var(--paper); color: var(--ink);
  font-family: var(--font-text); font-size: 1.125rem; font-weight: 650; line-height: 1.25; text-align: left; cursor: pointer;
}
.opt:hover { background: var(--mist); }
.opt__key { flex: none; width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--ink); display: grid; place-items: center; }
.opt--picked, .opt--picked:hover { background: var(--lime); }
.opt--picked .opt__key { background: var(--ink); color: var(--lime); }
.q__fine { font-size: var(--size-small); color: var(--ink-2); margin: 0; }
.q__nav { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.meter { height: 8px; border-radius: 4px; background: var(--mist-2); overflow: hidden; }
.meter__fill { height: 100%; border-radius: 4px; background: var(--blue); }
.parts { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0 12px; font-size: .875rem; line-height: 1.3; color: var(--ink-2); }
.parts li { display: flex; gap: 6px; align-items: flex-start; }
.parts .pen { color: var(--pass); margin-top: 1px; }
.parts__now { color: var(--ink); font-weight: 650; }
@media (max-width: 860px) { .parts li { display: none; } .parts .parts__now { display: flex; grid-column: 1 / -1; } .opts--2 { grid-template-columns: minmax(0, 1fr); } }

.hero__grid--check { align-items: start; }
@media (max-width: 760px) { .hero__grid--check { gap: 26px; padding-top: 14px; } .hero__grid--check .label { margin-bottom: 12px; } }


.gap { border: 1.5px solid var(--ink); border-radius: var(--radius-ui); background: var(--paper); color: var(--ink); padding: 22px 24px 8px; }
.gap + .gap { margin-top: 14px; }
.gap__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 16px; flex-wrap: wrap; }
.gap__title { font-family: var(--font-display); font-stretch: 90%; font-size: 1.375rem; font-weight: 650; letter-spacing: -.015em; line-height: 1.2; margin: 0; }
.fields { display: grid; grid-template-columns: auto minmax(0, 1fr); margin: 14px 0 0; border-top: 1px solid var(--line); font-size: 1rem; line-height: 1.45; }
.fields dt { padding: 12px 22px 12px 0; font-size: .875rem; font-weight: 650; color: var(--ink-2); border-bottom: 1px solid var(--line); white-space: nowrap; }
.fields dd { margin: 0; padding: 11px 0; border-bottom: 1px solid var(--line); }
.fields dt:last-of-type, .fields dd:last-of-type { border-bottom: 0; }
@media (max-width: 520px) { .fields { grid-template-columns: minmax(0, 1fr); } .fields dt { border-bottom: 0; padding-bottom: 0; } .fields dd { padding-top: 2px; } }
.gaprow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); font-weight: 650; }
.gaprow span:last-child { flex: none; }
.group-title { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; padding-bottom: 12px; border-bottom: 1.5px solid var(--ink); margin: 0 0 16px; font-family: var(--font-display); font-stretch: 90%; font-size: 1.375rem; font-weight: 650; }
.group-title small { font-family: var(--font-text); font-size: .9375rem; font-weight: 400; color: var(--ink-2); }
.range { font-family: var(--font-display); font-stretch: 86%; font-size: clamp(2rem, 3.4vw, 2.75rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; }

.checks--row { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 30px; }
.checks--row li { display: flex; gap: 10px; align-items: center; font-weight: 650; }
.checks--row .pen { margin-top: 0; }
.checks--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 32px; }
@media (max-width: 520px) { .checks--2 { grid-template-columns: minmax(0, 1fr); } }
.only-phone { display: none; }
@media (max-width: 760px) { .only-wide { display: none; } .only-phone { display: block; } }


.screen { width: 390px; height: 844px; overflow: hidden; display: flex; flex-direction: column; }
.screen__pad { padding: 0 20px; }


.swatches { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr)); gap: 16px; }
.swatch { border: 1px solid var(--line); border-radius: var(--radius-ui); overflow: hidden; font-size: .875rem; line-height: 1.4; background: var(--paper); }
.swatch__chip { height: 96px; border-bottom: 1px solid var(--line); }
.swatch__body { padding: 12px 14px 14px; color: var(--ink-2); }
.swatch__body b { display: block; color: var(--ink); font-size: 1rem; }
.spec { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: 12px 48px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--line); }
.spec__meta { font-size: .875rem; color: var(--ink-2); }
.spec__meta b { display: block; color: var(--ink); font-size: 1rem; }
.kit { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
@media (max-width: 760px) { .spec { grid-template-columns: minmax(0, 1fr); } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .btn { transition: none; }
}


.skip { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--blue); color: #fff; padding: 10px 16px; border-radius: 10px; font-weight: 650; }
.skip:focus { top: 12px; }
.ladder__name { margin-bottom: 18px; font-size: 1.1875rem; line-height: 1.35; align-items: flex-start; }
.ladder__name .ladder__num { flex: none; }
.footer__brand a { color: inherit; text-decoration: none; }
.page-head { background: var(--paper); border-bottom: 1px solid var(--line); }
@media (max-width: 520px) { .stack { width: min(100% - 18px, 492px); } }
@media (max-width: 400px) { .btn--lg { padding: 0 22px; white-space: normal; text-align: center; } }

.trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#waitlist-form > label { display: block; font-weight: 650; margin-bottom: 8px; }
#waitlist-form .row { display: flex; flex-wrap: wrap; gap: 10px; }
#waitlist-form input[type=email] { flex: 1 1 220px; min-height: 54px; padding: 0 16px; border: 1.5px solid var(--field); border-radius: var(--radius-ui); background: var(--paper); color: var(--ink); font: inherit; }
#waitlist-form input[type=email]::placeholder { color: var(--ink-2); opacity: 1; }
#waitlist-form input[type=email]:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-color: var(--blue); }
#waitlist-form button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px; border: 1.5px solid var(--ink); border-radius: var(--radius-pill); background: transparent; color: var(--ink); font-family: var(--font-text); font-size: 1.0625rem; font-weight: 650; line-height: 1.1; cursor: pointer; white-space: nowrap; }
#waitlist-form button:hover { background: var(--mist); }
#waitlist-form .note { font-size: var(--size-small); color: var(--ink-2); margin: 12px 0 0; }
.price__line { font-weight: 650; margin-top: 4px; }


.nb { white-space: nowrap; }
.hero__grid--about { grid-template-columns: minmax(0, 1fr); }
.hero__grid--about .display { max-width: 15em; }
.hero__grid--about .lead { max-width: 30em; }
.ev-teach { display: flex; align-items: center; gap: 16px; margin-top: 36px; max-width: 34em; }
.ev-teach .photo--round { flex: none; }
.ev-teach .photo img { object-position: 50% 28%; }
.ev-teach__line { margin: 0; color: var(--on-blue-2); }
.ev-shot { padding: 0; overflow: hidden; aspect-ratio: 390 / 600; }
.ev-shot img { display: block; width: 100%; height: auto; }
.ev-video { margin: 0; min-width: 0; }
.ev-vframe { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--radius-well); background: var(--ink); }
.ev-vframe iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ev-video .example-note { margin-top: 16px; }
.ev-more { margin-top: 24px; }
.ev-sign__lead { margin: 24px 0 36px; max-width: 28em; }
.ev-steps { grid-template-columns: minmax(0, 1fr); gap: 0; }
.ev-steps .step { display: grid; grid-template-columns: 54px minmax(0, 1fr); column-gap: 28px; padding-bottom: 36px; }
.ev-steps .step:last-child { padding-bottom: 0; }
.ev-steps .step__num { grid-row: 1 / span 2; }
.ev-steps .step > :not(.step__num) { grid-column: 2; }
.ev-steps .step .h3 { margin: 12px 0 8px; }
.ev-steps .step::before { top: 54px; bottom: 0; left: 26px; right: auto; width: 2px; height: auto; }
.ev-go p + p { margin-top: 14px; margin-bottom: 0; }
.ev-go .lead { margin-bottom: 24px; }
.ev-go a { font-weight: 650; }
.ev-office { margin-top: 28px; }
.ev-ledger { margin-top: 0; }
.ev-ways { margin-top: 32px; }
.ev-tel-note { margin-top: 14px; }
.ev-sheet { padding: 36px; }
.ev-sheet .form__title { margin-bottom: 20px; }
@media (max-width: 520px) { .ev-sheet { padding: 24px 20px; } .ev-steps .step { column-gap: 18px; } }
#class-form, #seminar-form { display: grid; gap: 20px; }
#class-form .sess, #seminar-form .sess { border: 0; margin: 0; padding: 0; min-width: 0; }
#class-form .sess legend, #seminar-form .sess legend { display: block; padding: 0; font-weight: 650; font-size: 1rem; margin-bottom: 8px; }
#class-form .sess-none, #seminar-form .sess-none { margin: 0; }
#class-form .sess-opt, #seminar-form .sess-opt { position: relative; display: inline-block; vertical-align: top; width: calc(50% - 6px); cursor: pointer; }
#class-form .sess-opt + .sess-opt, #seminar-form .sess-opt + .sess-opt { margin-left: 10px; }
#class-form .sess-opt input, #seminar-form .sess-opt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
#class-form .sess-opt span, #seminar-form .sess-opt span { display: block; border: 1.5px solid var(--field); border-radius: var(--radius-ui); padding: 12px 16px; font-family: var(--font-display); font-stretch: 90%; font-size: 1.125rem; font-weight: 650; line-height: 1.3; }
#class-form .sess-opt input:checked + span, #seminar-form .sess-opt input:checked + span { border-color: var(--blue); background: var(--mist); box-shadow: inset 0 0 0 1.5px var(--blue); }
#class-form .sess-opt input:focus-visible + span, #seminar-form .sess-opt input:focus-visible + span { outline: 3px solid var(--blue); outline-offset: 3px; }
@media (max-width: 520px) { #class-form .sess-opt, #seminar-form .sess-opt { display: block; width: auto; } #class-form .sess-opt + .sess-opt, #seminar-form .sess-opt + .sess-opt { margin: 10px 0 0; } }
#class-form .field input, #seminar-form .field input { display: block; width: 100%; min-height: 54px; padding: 0 16px; border: 1.5px solid var(--field); border-radius: var(--radius-ui); background: var(--paper); color: var(--ink); font: inherit; }
#class-form .field input:focus-visible, #seminar-form .field input:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-color: var(--blue); }
#class-form button[type="submit"], #seminar-form button[type="submit"] { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 62px; padding: 0 34px; border: 1.5px solid var(--ink); border-radius: var(--radius-pill); background: var(--lime); color: var(--ink); font-family: var(--font-text); font-size: 1.1875rem; font-weight: 650; line-height: 1.1; cursor: pointer; }
#class-form button[type="submit"]:hover, #seminar-form button[type="submit"]:hover { background: var(--lime-deep); }
#class-form button[type="submit"]:focus-visible, #seminar-form button[type="submit"]:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
#class-form .note, #class-form .sess-wait, #seminar-form .note, #seminar-form .sess-wait { margin: 0; font-size: var(--size-small); color: var(--ink-2); }


.wk-intro .head, .ed-intro .head { margin-bottom: 0; }
.wk-item { border-top: 1px solid var(--line); }
.wk-item .h2 { font-size: clamp(1.875rem, 3.2vw, 2.75rem); margin-bottom: 20px; }
.wk-text > p { max-width: 34em; }
.wk-item .nb { white-space: nowrap; }
.wk-item .work__stat { margin-top: 28px; }
.wk-links { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 24px; }
.wk-watch { margin-top: 24px; }
.wk-watch a { display: inline-flex; align-items: flex-start; gap: 10px; }
.wk-watch svg { flex: none; margin-top: 2px; }
@media (min-width: 901px) { .wk-item--flip .split > .well { order: -1; } }
.wk-embed, .ed-embed { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius-ui); overflow: hidden; background: var(--ink); }
.wk-embed iframe, .ed-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ed-embed--tall { aspect-ratio: 9 / 16; width: min(280px, 100%); }
.wk-frames { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.wk-frames img { display: block; width: 100%; height: auto; border-radius: 10px; }
.wk-site { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-ui); overflow: hidden; }
.wk-site__bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--line); font-size: .8125rem; color: var(--ink-2); }
.wk-site__bar i { width: 10px; height: 10px; border-radius: 50%; background: var(--mist-2); }
.wk-site__bar span { margin-left: 8px; }
.wk-site img { display: block; width: 100%; height: auto; }
.wk-note { margin: 16px 0 0; font-size: var(--size-small); color: var(--ink-2); }
.wk-item .toolcall { flex-direction: column; gap: 2px; background: var(--paper); font-size: .9375rem; }
.wk-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.wk-tiles li { display: flex; align-items: center; gap: 14px; background: var(--paper); border: 1px solid var(--line); border-radius: 10px; padding: 12px 16px; font-weight: 600; line-height: 1.35; }
.wk-tiles svg { width: 36px; height: 36px; flex: none; fill: none; stroke: var(--blue); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; color: var(--blue); }
.wk-next .cta-row { margin-top: 28px; }
.wk-next .btn svg { width: 20px; height: 20px; }
.ed-full { margin: 0; }
.ed-full figcaption { margin-top: 12px; font-size: var(--size-small); color: var(--ink-2); }
.ed-go { display: block; margin-top: 6px; font-weight: 650; color: var(--blue); }
.ed-latest { border-top: 1px solid var(--line); }
.ed-latest .h2 { margin-bottom: 32px; }
.ed-list { list-style: none; margin: 0; padding: 0; }
.ed-kind { font-size: var(--size-small); font-weight: 600; color: var(--blue); margin-bottom: 10px; }
.ed-item .h3 { margin-bottom: 12px; }
.ed-item .well { align-items: center; }



.page--how-i-work .howi-hero { padding-block: clamp(28px, 4vw, 64px) clamp(56px, 7vw, 104px); }
.page--how-i-work .howi-hero .head { margin-bottom: 28px; }
.page--how-i-work .howi-links { list-style: none; margin: 0 0 clamp(40px, 5vw, 64px); padding: 0; display: flex; flex-wrap: wrap; gap: 8px 36px; }
.page--how-i-work .ladder__name { margin-top: 0; }
.page--how-i-work .ladder__terms { min-height: 0; }
.page--how-i-work .on-blue .ladder { border-top-color: var(--on-blue-2); }
.page--how-i-work .on-blue .ladder__step + .ladder__step { border-left-color: var(--on-blue-2); }
.page--how-i-work .on-blue .ladder__step p, .page--how-i-work .on-blue .ladder__terms { color: var(--on-blue-2); }
.page--how-i-work .on-blue .ladder__num { background: var(--paper); color: var(--blue); }
@media (max-width: 860px) { .page--how-i-work .on-blue .ladder__step, .page--how-i-work .on-blue .ladder__step + .ladder__step { border-top-color: var(--on-blue-2); } }

.page--how-i-work .howi-checks { gap: 28px 64px; }
.page--how-i-work .howi-words .h2 { margin-bottom: 28px; }
.page--how-i-work .howi-slip .sheet__kind { margin-bottom: 18px; }
.page--how-i-work .howi-fail { color: var(--fail); font-weight: 650; }
.page--how-i-work .howi-verdict { margin: 18px 0 0; }
.page--how-i-work .howi-brief { margin: 0; max-width: 300px; }
.page--how-i-work .howi-brief__crop { aspect-ratio: 390 / 617; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-ui); background: var(--paper); }
.page--how-i-work .howi-brief__crop img { display: block; width: 100%; height: auto; }
.page--how-i-work .howi-brief .example-note { margin-top: 14px; }
.page--how-i-work .howi-first { margin-top: 24px; }
.page--how-i-work .howi-note { font-family: var(--font-display); font-stretch: 90%; font-size: 1.1875rem; font-weight: 700; line-height: 1.3; margin: 0; }

.page--how-it-works .howd-top { padding-top: clamp(40px, 5vw, 72px); }
.page--how-it-works .day--steps { max-width: 46rem; grid-template-columns: minmax(0, 1fr); border-top: 0; border-left: 2px solid var(--ink); }
.page--how-it-works .day--steps .day__item { padding: 0 0 40px 28px; }
.page--how-it-works .day--steps .day__item:last-child { padding-bottom: 0; }
.page--how-it-works .day--steps .day__item::before { left: -9px; top: 0; width: 16px; height: 2px; }

.page--start .start-field { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "intro sheet" "next sheet"; grid-template-rows: auto 1fr; gap: 40px 64px; align-items: start; padding-block: clamp(28px, 4vw, 56px) var(--section); }
.page--start .start-field__intro { grid-area: intro; }
.page--start .start-field__intro .lead { margin-top: 24px; max-width: 30em; }
.page--start .start-field__sheet { grid-area: sheet; padding: clamp(24px, 3vw, 36px); }
.page--start .start-field__next { grid-area: next; }
.page--start .start-field__free { margin: 0 0 22px; font-weight: 650; }
.page--start .start-field__next .h3 { margin-bottom: 18px; }
.page--start .start-field__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: next; }
.page--start .start-field__steps li { counter-increment: next; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px; align-items: start; }
.page--start .start-field__steps li::before { content: counter(next); display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--paper); color: var(--blue); font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; line-height: 1; }
@media (max-width: 900px) { .page--start .start-field { grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "sheet" "next"; grid-template-rows: none; } }

#intake-form { display: grid; gap: 20px; }
#intake-form .opt { display: inline; width: auto; min-height: 0; margin-left: 6px; padding: 0; border: 0; border-radius: 0; background: none; color: var(--ink-2); font-family: var(--font-text); font-size: .875rem; font-weight: 400; line-height: inherit; text-align: inherit; cursor: inherit; }
#intake-form .opt:hover { background: none; }
#intake-form .field input, #intake-form .field textarea { display: block; width: 100%; min-height: 54px; padding: 12px 16px; border: 1.5px solid var(--field); border-radius: var(--radius-ui); background: var(--paper); color: var(--ink); font: inherit; }
#intake-form .field textarea { resize: vertical; line-height: 1.5; }
#intake-form .field input:focus-visible, #intake-form .field textarea:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-color: var(--blue); }
#intake-form .notice { margin: 0; padding: 14px 18px; border: 1.5px dashed var(--ink); border-radius: var(--radius-ui); font-size: var(--size-small); }
#intake-form button[type=submit] { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 62px; padding: 0 34px; border: 1.5px solid var(--ink); border-radius: var(--radius-pill); background: var(--lime); color: var(--ink); font-family: var(--font-text); font-size: 1.1875rem; font-weight: 650; line-height: 1.1; cursor: pointer; }
#intake-form button[type=submit]:hover { background: var(--lime-deep); }
#intake-form button[type=submit]:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
#intake-form .note, #intake-form .sess-wait { margin: 0; font-size: var(--size-small); color: var(--ink-2); }
