/* Poppy Agent Ready beta landing, v3. Brand values resolve from POPPY BRAND EXPRESSION v1 (poppy-design-v2).
   Founder-directed exceptions for this page (P068 V3 brief): near-subconscious grain on flat surfaces, restrained motion. */

@font-face { font-family: "Poppins"; font-weight: 400; font-style: normal; font-display: swap; src: url("/assets/fonts/Poppins-Regular.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 500; font-style: normal; font-display: swap; src: url("/assets/fonts/Poppins-Medium.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 600; font-style: normal; font-display: swap; src: url("/assets/fonts/Poppins-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 700; font-style: normal; font-display: swap; src: url("/assets/fonts/Poppins-Bold.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-weight: 500; font-style: italic; font-display: swap; src: url("/assets/fonts/Lora-MediumItalic.woff2") format("woff2"); }

:root {
  --poppy: #6B5CFF; --poppy-ink: #4B3FCF; --violet: #8B7CFF; --lilac: #DCD5FF;
  --charcoal: #1F1F1F; --ink-2: #5E5E66; --slate: #6B6B6B; --ivory: #F6F4EF;
  --mist: #EFECFF; --hair-dark: #3A3A3A; --chrome-dark: #B9B3A6; --white: #FFFFFF;
  --paper: #FAF8F4;
  --rule: rgba(31, 31, 31, 0.14);
  --rule-dark: rgba(246, 244, 239, 0.16);
  --rule-light: rgba(255, 255, 255, 0.3);
  --lift: 0 1px 2px rgba(31, 31, 31, 0.05), 0 28px 60px -34px rgba(31, 31, 31, 0.28);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --wrap: 1160px; --gutter: 24px;
  --noise-dark: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --noise-light: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

* { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  background: var(--ivory); color: var(--charcoal);
  font-family: "Poppins", system-ui, sans-serif; font-weight: 400;
  font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: var(--poppy-ink); }
ul, ol { list-style: none; }
h1, h2, h3 { font-weight: 600; line-height: 1.12; letter-spacing: -0.015em; text-wrap: balance; }
p { text-wrap: pretty; }
.accent { font-family: "Lora", Georgia, serif; font-style: italic; font-weight: 500; color: var(--poppy-ink); letter-spacing: 0; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
section { position: relative; scroll-margin-top: 16px; }

/* Material: near-subconscious grain. Light surfaces darken a hair; dark surfaces lift a hair. */
.grain, .grain-dark { position: relative; isolation: isolate; }
.grain::after, .grain-dark::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-size: 200px 200px;
}
.grain::after { background-image: var(--noise-dark); opacity: 0.045; mix-blend-mode: multiply; }
.grain-dark::after { background-image: var(--noise-light); opacity: 0.05; mix-blend-mode: screen; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 56px; padding: 16px 30px; border-radius: 999px; border: 0;
  background: var(--poppy); color: var(--white);
  font: 600 17px/1.2 "Poppins", system-ui, sans-serif; text-decoration: none; cursor: pointer;
  transition: background-color 180ms ease, transform 180ms ease;
}
.btn:hover { background: var(--poppy-ink); }
.btn-light { background: var(--ivory); color: var(--charcoal); }
.btn-light:hover { background: var(--white); }
.btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--lilac); outline-offset: 3px;
}
.btn[disabled] { background: #D9D5CC; color: var(--ink-2); cursor: not-allowed; }

.review-ribbon { background: #000; color: #FFF; text-align: center; font: 500 14px/1.4 system-ui, sans-serif; padding: 7px var(--gutter); }

/* Header */
.head-row { display: flex; align-items: center; justify-content: space-between; min-height: 96px; }
.brand img { width: 152px; height: auto; }
.head-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--charcoal); font-weight: 600; font-size: 16px; text-decoration: none; }
.head-link:hover { color: var(--poppy-ink); }

/* ================= HERO ================= */
.hero {
  display: grid;
  grid-template-columns: minmax(var(--gutter), 1fr) minmax(0, 580px) minmax(0, 532px) minmax(var(--gutter), 1fr);
  align-items: stretch; padding-bottom: 0;
}
.hero-copy { grid-column: 2; padding: 40px 72px 120px 0; align-self: center; }
.product-line { font-size: 16px; line-height: 1.5; margin-bottom: 32px; }
.product-name { font-weight: 600; }
.product-desc { color: var(--ink-2); font-weight: 500; }
.product-desc::before { content: "\00B7"; margin: 0 8px 0 2px; color: var(--slate); }
h1 { font-weight: 700; font-size: clamp(44px, 6.6vw, 92px); line-height: 1.0; letter-spacing: -0.038em; }
h1 .l { display: block; }
.lede { margin-top: 30px; font-size: clamp(18px, 1.6vw, 21px); line-height: 1.55; color: var(--ink-2); max-width: 29em; }
.hero-actions { margin-top: 40px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.price-line { font-size: 17px; color: var(--ink-2); }
.price-line strong { color: var(--charcoal); font-weight: 600; font-size: 18px; }

.exhibit {
  grid-column: 3 / 5; background: var(--charcoal); color: var(--ivory);
  padding: 80px var(--gutter) 88px 64px; display: flex; flex-direction: column; justify-content: center;
}
.exhibit > * { max-width: 468px; }
.exhibit-cap { display: flex; flex-direction: column; gap: 2px; margin-bottom: 44px; }
.exhibit-title { font-size: 19px; font-weight: 600; }
.exhibit-note { font-size: 15px; color: var(--chrome-dark); }
.trail { position: relative; }
.trail::before { /* the evidence trail: a functional connector from question to result */
  content: ""; position: absolute; left: 5px; top: 10px; bottom: 60px; width: 1px; background: #4A4A4A; transform-origin: top;
}
.trail-row { position: relative; padding: 0 0 28px 34px; }
.trail-row::before {
  content: ""; position: absolute; left: 0; top: 7px; width: 11px; height: 11px; border-radius: 50%;
  background: var(--charcoal); border: 1.5px solid var(--chrome-dark);
}
.trail dt { font-size: 15px; font-weight: 500; color: var(--chrome-dark); }
.trail dd { margin-top: 3px; font-size: 18px; line-height: 1.45; }
.trail-wrong s {
  text-decoration: none; background: linear-gradient(var(--violet), var(--violet)) no-repeat 0 58% / 100% 2px;
}
/* Business truth: a paper correction slip laid over the evidence field, crossing its edge */
.trail-truth {
  margin: 4px 0 30px -104px; padding: 20px 24px 22px; background: var(--paper); color: var(--charcoal);
  border-radius: 4px; box-shadow: 0 1px 1px rgba(0,0,0,.2), 0 26px 50px -24px rgba(0,0,0,.55);
}
.trail-truth::before { display: none; }
.trail-truth dt { color: var(--slate); }
.trail-truth dd { font-weight: 600; font-size: 19px; color: var(--charcoal); }
.trail-result { padding-bottom: 0; }
.trail-result::before { background: var(--violet); border-color: var(--violet); }
.trail-result dd { margin-top: 6px; font-size: clamp(30px, 3.1vw, 44px); font-weight: 700; line-height: 1.05; color: var(--violet); letter-spacing: -0.025em; }
.trail-result dd span { display: block; }

/* ================= 01 PROBLEM ================= */
.problem { padding: 144px 0 0; z-index: 2; }
.problem-top { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: end; }
.problem-top h2 { font-size: clamp(32px, 3.8vw, 50px); }
.problem-top p { font-size: 18px; color: var(--ink-2); max-width: 32em; }
/* The failure sheet: a paper plane that bleeds off the right edge */
.failure-sheet {
  position: relative; margin: 88px 0 0 max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter)));
  padding: 72px 64px 64px; background: var(--paper); border-radius: 6px 0 0 6px; box-shadow: var(--lift);
  transform: translateY(72px); z-index: 2;
}
.litany { font-size: clamp(32px, 5vw, 68px); font-weight: 600; line-height: 1.12; letter-spacing: -0.03em; max-width: 18.6em; }
.litany .f { white-space: nowrap; color: var(--charcoal); }
.litany .f:nth-child(even) { color: #4A4A52; }
.litany .f-last { color: var(--poppy-ink); }
.litany-note { margin-top: 40px; font-size: 16px; color: var(--slate); max-width: 40em; }

/* ================= 02 QUESTIONS ================= */
.test { background: var(--mist); padding: 200px 0 128px; z-index: 1; }
.test-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 48px; align-items: end; margin-bottom: 72px; }
.big-number { font-size: clamp(96px, 15vw, 212px); font-weight: 700; line-height: 0.78; letter-spacing: -0.06em; white-space: nowrap; color: var(--charcoal); }
.test-intro h2 { font-size: clamp(26px, 2.6vw, 36px); max-width: 15em; }
.test-intro p { margin-top: 16px; font-size: 17px; color: var(--ink-2); max-width: 34em; }
.questions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 40px; }
.questions li { display: flex; flex-direction: column; gap: 6px; padding: 22px 0 30px; }
.q-area { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: var(--slate); }
.q { font-size: clamp(19px, 1.6vw, 22px); font-weight: 500; line-height: 1.35; letter-spacing: -0.005em; }
.questions li:nth-child(3n+2) { transform: translateY(28px); }

/* ================= 03 FINDINGS ================= */
.get { padding: 160px 0 144px; }
.get-title { font-size: clamp(40px, 5.6vw, 80px); font-weight: 700; line-height: 1.02; letter-spacing: -0.035em; max-width: 12em; }
.get-title .soft { color: #8A8A90; }
.get-body { margin-top: 88px; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 80px; align-items: start; }
.lead-finding { position: relative; padding: 40px 40px 44px; background: var(--charcoal); color: var(--ivory); border-radius: 4px; }
.lf-intro { font-size: 15px; color: var(--chrome-dark); margin-bottom: 64px; max-width: 26em; }
.lead-finding h3 { font-size: clamp(28px, 2.8vw, 38px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.08; color: var(--ivory); }
.lead-finding h3 + p { margin-top: 14px; font-size: 17px; color: var(--chrome-dark); }
.findings > div { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px; padding: 26px 0 28px; }
.findings > div::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: rgba(31, 31, 31, 0.22); transform-origin: left; }
.findings > div:last-child::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: rgba(31, 31, 31, 0.22); }
.findings dt { font-size: 19px; font-weight: 600; line-height: 1.3; letter-spacing: -0.01em; }
.findings dd { font-size: 16px; color: var(--ink-2); }

/* ================= 04 THESIS ================= */
.angle { background: var(--charcoal); color: var(--ivory); padding: 160px 0 176px; }
.angle h2 { font-size: clamp(44px, 7.4vw, 108px); font-weight: 700; line-height: 0.98; letter-spacing: -0.042em; max-width: 11.5em; color: var(--ivory); }
.angle .accent { color: var(--violet); font-size: 1.04em; }
.angle-body { margin: 72px 0 0 auto; max-width: 500px; }
.angle-body p { font-size: 18px; color: var(--chrome-dark); }
.angle-body p + p { margin-top: 14px; color: var(--ivory); font-weight: 500; }

/* ================= 05 SMALLEST FIX ================= */
.after { padding: 160px 0 160px; }
.after-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 80px; align-items: start; }
.after-copy h2 { font-size: clamp(32px, 3.8vw, 50px); }
.after-copy p { margin-top: 20px; font-size: 18px; color: var(--ink-2); max-width: 30em; }
.scale figcaption { font-size: 15px; color: var(--slate); margin-bottom: 24px; }
.scale ol { display: flex; flex-direction: column; gap: 14px; }
.scale li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.s-label { font-size: 17px; font-weight: 600; letter-spacing: -0.005em; }
.s-bar { display: block; height: 10px; border-radius: 2px; background: rgba(31, 31, 31, 0.16); transform-origin: left; }
.s1 .s-bar { width: 8%; background: var(--poppy-ink); } .s1 .s-label { color: var(--poppy-ink); }
.s2 .s-bar { width: 18%; } .s3 .s-bar { width: 30%; } .s4 .s-bar { width: 44%; }
.s5 .s-bar { width: 60%; } .s6 .s-bar { width: 78%; } .s7 .s-bar { width: 100%; }

/* ================= 06 THE AUDIT: purple brief (singular surface) ================= */
.offer { background: var(--poppy); color: var(--white); padding: 120px 0 128px; }
.brief {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 72px;
  padding: 0;
}
.offer-tag { font-size: 16px; font-weight: 600; color: var(--white); }
.offer h2 { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; color: var(--white); }
.offer-name { font-size: clamp(32px, 3.4vw, 46px); font-weight: 700; letter-spacing: -0.025em; }
.offer-desc { font-size: 20px; font-weight: 500; letter-spacing: 0; }
.offer-price { margin-top: 48px; font-size: clamp(88px, 12vw, 176px); font-weight: 700; line-height: 0.86; letter-spacing: -0.055em; font-variant-numeric: tabular-nums; }
.offer-price span { margin-left: 16px; font-size: 24px; font-weight: 500; letter-spacing: 0; }
.offer-cap { margin: 32px 0 40px; font-size: 18px; max-width: 26em; }
.brief-scope { padding-top: 6px; }
.brief-scope h3 { font-size: 20px; color: var(--white); }
.brief-scope ol { margin-top: 22px; }
.brief-scope li { display: grid; grid-template-columns: 30px 1fr; gap: 12px; align-items: baseline; padding: 18px 0; border-top: 1px solid var(--rule-light); }
.brief-scope li:last-child { border-bottom: 1px solid var(--rule-light); }
.brief-scope .n { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.brief-scope li p { font-size: 18px; font-weight: 500; line-height: 1.4; }
.offer-note { margin-top: 26px; font-size: 16px; }

/* ================= 07 FOUNDER: portrait bleeds left, judgment on charcoal ================= */
.founder { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: var(--charcoal); color: var(--ivory); min-height: 760px; }
.founder-photo-wrap { position: relative; overflow: hidden; }
.founder-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.founder-copy { align-self: center; padding: 120px max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter))) 120px 80px; }
.founder blockquote p { font-size: clamp(30px, 3.2vw, 46px); font-weight: 600; line-height: 1.16; letter-spacing: -0.022em; color: var(--ivory); text-wrap: balance; text-indent: -0.42em; }
.founder .accent { color: var(--violet); font-size: 1.04em; }
.byline { margin-top: 32px; font-size: 16px; font-weight: 600; color: var(--ivory); }
.founder-facts { margin-top: 12px; font-size: 17px; color: var(--chrome-dark); max-width: 32em; }

/* ================= 08 APPLY: private intake on paper ================= */
.apply { background: var(--paper); padding: 144px 0 152px; }
.intake { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 96px; align-items: start; }
.apply-intro { position: sticky; top: 40px; }
.apply-intro h2 { font-size: clamp(34px, 3.8vw, 52px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.04; }
.apply-sub { margin-top: 18px; font-size: 18px; color: var(--ink-2); }
.steps { margin-top: 48px; }
.steps li { display: grid; grid-template-columns: 32px 1fr; gap: 10px; padding: 14px 0; }
.step-n { font-size: 16px; font-weight: 600; color: var(--poppy-ink); line-height: 1.55; }
.steps h3 { font-size: 17px; line-height: 1.45; }
.steps p { margin-top: 2px; font-size: 16px; color: var(--ink-2); }

.form { display: flex; flex-direction: column; }
.fgroup { display: flex; flex-direction: column; gap: 36px; padding: 40px 0; border-top: 1px solid var(--rule); }
.fgroup:first-child { padding-top: 8px; border-top: 0; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 32px; }
.field { display: flex; flex-direction: column; gap: 4px; }
.field label, .choice legend { font-size: 15px; font-weight: 600; color: var(--charcoal); line-height: 1.4; }
.opt { font-weight: 400; color: var(--slate); }
input[type="text"], input[type="email"], input[type="tel"], input[type="url"], textarea, select {
  width: 100%; min-height: 48px; padding: 10px 0; border: 0; border-bottom: 1px solid rgba(31, 31, 31, 0.28);
  border-radius: 0; background: transparent; color: var(--charcoal);
  font: 400 18px/1.4 "Poppins", system-ui, sans-serif; transition: border-color 160ms ease;
}
input:hover, textarea:hover, select:hover { border-bottom-color: var(--charcoal); }
input:focus-visible, textarea:focus-visible, select:focus-visible { outline: none; border-bottom: 2px solid var(--poppy-ink); padding-bottom: 9px; }
textarea { resize: vertical; min-height: 88px; }
select { appearance: none; -webkit-appearance: none; padding-right: 32px; cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--charcoal) 50%), linear-gradient(135deg, var(--charcoal) 50%, transparent 50%);
  background-position: calc(100% - 12px) 22px, calc(100% - 7px) 22px; background-size: 5px 5px; background-repeat: no-repeat; }
select:invalid { color: var(--slate); }
::placeholder { color: #8A8A8A; }
.hint { font-size: 14px; color: var(--slate); }
.choice { border: 0; }
.choice legend { margin-bottom: 14px; padding: 0; }
.pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pills label { position: relative; cursor: pointer; }
.pills input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pills span {
  display: inline-flex; align-items: center; min-height: 46px; padding: 10px 18px;
  border: 1px solid rgba(31, 31, 31, 0.18); border-radius: 10px; background: var(--white);
  font-size: 15px; font-weight: 500; line-height: 1.3; transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
}
.pills label:hover span { border-color: var(--charcoal); }
.pills input:checked + span { background: var(--charcoal); border-color: var(--charcoal); color: var(--ivory); }
.pills input:focus-visible + span { outline: 3px solid var(--lilac); outline-offset: 2px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-foot { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 36px; border-top: 1px solid var(--rule); }
.form-status { font-size: 15px; color: var(--ink-2); }
.form-status.is-error { color: #A3261B; }
.is-invalid input, .is-invalid textarea, .is-invalid select { border-bottom-color: #A3261B; }
.is-invalid .pills span { border-color: #A3261B; }
.field-error { margin-top: 6px; font-size: 14px; color: #A3261B; }
.privacy-note { font-size: 14px; color: var(--slate); max-width: 34em; }
.privacy-note a { color: var(--ink-2); }
.apply-success { padding: 40px 0 8px; outline: none; }
.apply-success h3 { font-size: clamp(28px, 3vw, 38px); font-weight: 700; letter-spacing: -0.02em; }
.apply-success p { margin: 14px 0 28px; font-size: 18px; color: var(--ink-2); max-width: 30em; }

/* ================= CLOSING + FOOTER ================= */
.closing { position: relative; background: var(--charcoal); color: var(--ivory); padding: 136px 0 0; overflow: hidden; }
.close-top { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 48px; align-items: end; }
.closing h2 { font-size: clamp(44px, 7vw, 100px); font-weight: 700; line-height: 0.98; letter-spacing: -0.042em; color: var(--ivory); }
.close-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding-bottom: 8px; }
.closing .price-line { color: var(--chrome-dark); }
.closing .price-line strong { color: var(--ivory); }


.foot-grid { margin-top: 112px; padding-top: 40px; border-top: 1px solid var(--rule-dark); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: start; }
.foot-brand img { width: 152px; height: auto; }
.foot-brand p { margin-top: 14px; font-size: 15px; color: var(--chrome-dark); }
.foot-contact { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.foot-contact a { display: inline-flex; align-items: center; min-height: 36px; color: var(--ivory); text-decoration: none; font-size: 16px; }
.foot-contact a:hover { color: var(--violet); }
.legal { display: flex; justify-content: space-between; gap: 16px; margin-top: 40px; font-size: 14px; color: var(--chrome-dark); }
.giant {
  margin: 48px 0 0; font-size: clamp(60px, 14.2vw, 236px); font-weight: 700; line-height: 0.72; letter-spacing: -0.06em;
  color: #2B2B2B; white-space: nowrap; text-align: center; transform: translateY(0.14em); user-select: none;
}

/* ================= MOTION (only when html.motion is set; content is fully visible otherwise) ================= */
@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes scan { 0% { color: inherit; } 35% { color: var(--poppy-ink); } 100% { color: inherit; } }

html.motion .hero .rise { animation: rise 760ms var(--ease) both; }
html.motion .hero .product-line { animation-delay: 60ms; }
html.motion .hero h1 .l:nth-child(1) { animation-delay: 140ms; }
html.motion .hero h1 .l:nth-child(2) { animation-delay: 220ms; }
html.motion .hero h1 .l:nth-child(3) { animation-delay: 300ms; }
html.motion .hero .lede { animation-delay: 420ms; }
html.motion .hero .hero-actions { animation-delay: 520ms; }

html.motion [data-seq] .step { opacity: 0; transform: translateY(14px); transition: opacity 560ms ease, transform 640ms var(--ease); transition-delay: calc(var(--i, 0) * 80ms); }
html.motion [data-seq].in .step { opacity: 1; transform: none; }
html.motion .questions li.step:nth-child(3n+2) { transform: translateY(42px); }
html.motion .questions.in li.step:nth-child(3n+2) { transform: translateY(28px); }

/* Hero evidence trail: steps arrive in order, the line draws, the wrong answer is struck, the slip lands */
html.motion .exhibit .step { transition-delay: calc(700ms + var(--i, 0) * 300ms); }
html.motion .exhibit .trail::before { transform: scaleY(0); transition: transform 1500ms var(--ease) 700ms; }
html.motion .exhibit.in .trail::before { transform: scaleY(1); }
html.motion .trail-wrong s { background-size: 0 2px; transition: background-size 420ms ease 1300ms; }
html.motion .exhibit.in .trail-wrong s { background-size: 100% 2px; }
html.motion .exhibit .trail-truth { transform: translate(24px, 10px); }
html.motion .exhibit.in .trail-truth { transform: none; }

/* Failure sheet: a single purple pass scans the list and settles on the last item */
html.motion .failure-sheet.in .f { animation: scan 700ms ease both; animation-delay: calc(300ms + var(--i, 0) * 120ms); }
html.motion .failure-sheet.in .f-last { animation: none; }
html.motion .failure-sheet .f-last { color: var(--charcoal); transition: color 400ms ease 1260ms; }
html.motion .failure-sheet.in .f-last { color: var(--poppy-ink); }


/* Findings: fine lines trace in */
html.motion .findings > div::before { transform: scaleX(0); transition: transform 700ms var(--ease); transition-delay: calc(var(--i, 0) * 80ms); }
html.motion .get-body.in .findings > div::before { transform: scaleX(1); }

/* Smallest fix: the scale resolves from the smallest bar to the largest */
html.motion .scale .s-bar { transform: scaleX(0); transition: transform 700ms var(--ease); transition-delay: calc(200ms + var(--i, 0) * 110ms); }
html.motion .scale.in .s-bar { transform: scaleX(1); }

/* Founder: restrained portrait reveal */
html.motion .founder-photo-wrap .founder-photo { clip-path: inset(0 0 100% 0); transform: scale(1.04); transition: clip-path 1100ms var(--ease), transform 1600ms var(--ease); }
html.motion .founder-photo-wrap.in .founder-photo { clip-path: inset(0 0 0 0); transform: none; }
html.motion .rise-on-view { opacity: 0; transform: translateY(18px); transition: opacity 700ms ease, transform 800ms var(--ease); }
html.motion .rise-on-view.in { opacity: 1; transform: none; }


/* Failsafe: if the observer never ran, show everything */
html.motion-done [data-seq] .step, html.motion-done .rise-on-view { opacity: 1 !important; transform: none !important; }
html.motion-done .founder-photo { clip-path: none !important; }

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

/* ================= TABLET ================= */
@media (max-width: 980px) {
  .hero { grid-template-columns: minmax(var(--gutter), 1fr) minmax(0, 720px) minmax(var(--gutter), 1fr); }
  .hero-copy { grid-column: 2; padding: 32px 0 72px; }
  .exhibit { grid-column: 1 / -1; padding: 72px max(var(--gutter), calc((100vw - 720px) / 2)); }
  .exhibit > * { max-width: 560px; }
  .trail-truth { margin-left: -12px; }
  .problem-top, .after-grid, .get-body, .intake, .close-top { grid-template-columns: 1fr; gap: 36px; }
  .test-head { grid-template-columns: 1fr; gap: 28px; }
  .questions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .questions li:nth-child(3n+2), html.motion .questions.in li.step:nth-child(3n+2) { transform: none; }
  .brief { grid-template-columns: 1fr; gap: 48px; }
  .founder { grid-template-columns: 1fr; }
  .founder-photo-wrap { aspect-ratio: 4 / 3; }
  .founder-copy { padding: 72px var(--gutter) 88px; max-width: 720px; margin: 0 auto; }
  .apply-intro { position: static; }
  .angle-body { margin-left: 0; }
  .failure-sheet { margin-left: var(--gutter); }
}

/* ================= PHONE ================= */
@media (max-width: 600px) {
  :root { --gutter: 16px; }
  body { font-size: 16px; }
  .head-row { min-height: 80px; }
  .hero-copy { padding: 16px 0 52px; }
  .product-line { margin-bottom: 20px; font-size: 15px; }
  .product-desc { display: block; }
  .product-desc::before { content: none; }
  h1 { font-size: clamp(40px, 12vw, 48px); }
  .lede { margin-top: 18px; font-size: 17px; }
  .hero-actions { margin-top: 28px; }
  .hero-actions .btn { width: 100%; }
  .exhibit { padding: 56px var(--gutter) 64px; }
  .exhibit-cap { margin-bottom: 32px; }
  .trail dd { font-size: 17px; }
  .trail-truth { margin-left: -4px; margin-right: -4px; }
  .problem { padding-top: 96px; }
  .failure-sheet { margin: 56px 0 0 var(--gutter); padding: 44px 24px 40px; transform: translateY(48px); }
  .litany { font-size: clamp(24px, 7.4vw, 30px); }
  .test { padding: 136px 0 88px; }
  .test-head { margin-bottom: 40px; }
  .questions { grid-template-columns: 1fr; }
  .questions li { padding: 12px 0 16px; gap: 2px; }
  .get, .after { padding: 104px 0; }
  .get-body { margin-top: 48px; }
  .lead-finding { padding: 30px 24px 32px; }
  .lf-intro { margin-bottom: 36px; }
  .findings > div { grid-template-columns: 1fr; gap: 6px; }
  .angle { padding: 104px 0 112px; }
  .angle-body { margin-top: 44px; }
  .offer { padding: 88px 0; }
  .brief { padding: 0; }
  .offer-price { font-size: clamp(64px, 20vw, 88px); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
  .offer-price span { margin-left: 0; }
  .brief .btn { width: 100%; }
  .founder-photo-wrap { aspect-ratio: 4 / 4.4; }
  .founder-copy { padding: 56px var(--gutter) 72px; }
  .apply { padding: 96px 0 104px; }
  .field-row { grid-template-columns: 1fr; }
  .form-foot .btn { width: 100%; }
  .closing { padding-top: 96px; }
  .close-actions, .close-actions .btn { width: 100%; }
  .foot-grid { grid-template-columns: 1fr; margin-top: 72px; }
  .foot-contact { align-items: flex-start; }
  .foot-contact a { min-height: 44px; }
  .legal { flex-direction: column; }
}
