:root {
  /* Color roles */
  --pq-cream: #F8F7F4;
  --pq-bone: #F2EFEB;
  --pq-paper: #FEFCF7;
  --pq-frost: #F9F9FF;
  --pq-navy: #0E1E5C;
  --pq-blue: #1B45B8;
  --pq-periwinkle: #9DB4FF;
  --pq-burnt-orange: #A45718;
  --pq-ink: #0B1020;
  --pq-muted: #45495A;
  --pq-line: rgba(14, 30, 92, .14);
  --pq-line-dark: rgba(254, 252, 247, .22);

  /* Type */
  --pq-display: "Instrument Serif", Georgia, serif;
  --pq-body: "DM Sans", Arial, sans-serif;
  --pq-mono: "JetBrains Mono", ui-monospace, monospace;
  --pq-text: 16px;
  --pq-small: 14px;
  --pq-label: 12px;
  --pq-h1: clamp(3.5rem, 7vw, 5.75rem);
  --pq-h2: clamp(2.75rem, 4.8vw, 4.75rem);
  --pq-h3: clamp(1.5rem, 2.2vw, 2.25rem);
  --pq-stat: clamp(4rem, 6vw, 4.75rem);
  --pq-shadow: none;

  /* Geometry */
  --pq-wrap: 1100px;
  --pq-wrap-narrow: 820px;
  --pq-gutter: clamp(1rem, 3vw, 2rem);
  --pq-room: clamp(6.25rem, 10vw, 8.75rem);
  --pq-room-tight: clamp(3rem, 5vw, 4rem);
  --pq-gap-lg: clamp(2.75rem, 5vw, 4rem);
  --pq-gap: clamp(1.25rem, 2vw, 1.75rem);
  --pq-gap-sm: .75rem;
  --pq-rule: 1px;
  --pq-radius-control: 4px;
  --pq-radius-panel: 8px;
  --pq-radius-sharp: 0;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { min-width: 0; margin: 0; background: var(--pq-cream); color: var(--pq-ink); font: var(--pq-text)/1.6 var(--pq-body); }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
::selection { background: var(--pq-navy); color: var(--pq-paper); }
:focus-visible { outline: 2px solid var(--pq-blue); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

.pq-wrap { width: min(var(--pq-wrap), calc(100% - 64px)); margin-inline: auto; }
/* LB measurement: centered breather statements sat in a 520–720px content column.
 * This 760px cap preserves that distinct, quieter movement on this wider route.
 */
.pq-wrap--narrow { width: min(760px, calc(100% - 48px)); margin-inline: auto; }
.pq-wrap--mid { width: min(900px, calc(100% - 48px)); margin-inline: auto; }
/* LB measurement: old-way / new-way passages used an ~840px column beginning
 * about 340px from the left edge, rather than the site-wide full wrap.
 */
.pq-wrap--indent-left { width: min(880px, calc(100% - 48px)); margin-left: clamp(2rem, 22vw, 22rem); margin-right: auto; }
/* LB measurement: dark chapter-break rooms held 700–1100px of vertical space.
 * 88svh creates that pause while remaining safe on mobile browser chrome.
 */
.pq-room--tall { min-height: 88svh; display: flex; flex-direction: column; justify-content: center; }
/* LB measurement: sparse light movements leave 150–400px between a heading
 * movement and its supporting material, rather than using a uniform section gap.
 */
.pq-air-lg { margin-top: clamp(6rem, 10vw, 10rem); }
/* LB measurement: centered statements occupy roughly 520–720px and use a calm,
 * enlarged display face as a short breather between denser editorial passages.
 */
.pq-statement { font-family: var(--pq-display); font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.25; max-width: 28ch; }
/* PQ room rhythm
 * R1: Never use more than two consecutive light rooms. A light pair must use
 *     different tones: cream, paper, bone, or frost.
 * R2: Every route has one navy or burnt-orange room in its middle third.
 * R3: The final conversion CTA is navy or ink.
 * R4: A hero opens either navy or cream; use one explicit room tone.
 * R5: At most one orange room per route. Keep a light room between orange and navy.
 * R6: Frost (#F9F9FF) is a separate light tone and breaks a bone run.
 */
.pq-room { padding-block: var(--pq-room); background: var(--pq-cream); }
.pq-room--contained { max-width: 1200px; margin-inline: auto; }
.pq-room--tight { padding-block: var(--pq-room-tight); }
.pq-room--cream { background: var(--pq-cream); }
.pq-room--bone { background: var(--pq-bone); }
.pq-room--paper { background: var(--pq-paper); }
.pq-room--frost { background: var(--pq-frost); }
.pq-room--dark { background: var(--pq-navy); color: var(--pq-paper); }
.pq-room--orange { background: var(--pq-burnt-orange); color: var(--pq-paper); }
.pq-room--ink { background: var(--pq-ink); color: var(--pq-paper); }
.pq-room-divider { border-top: 1px solid var(--pq-line); }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.pq-display, .pq-h2, .pq-h3 { margin: 0; font-family: var(--pq-display); font-weight: 400; letter-spacing: -.035em; }
.pq-display { font-size: var(--pq-h1); line-height: .98; }
.pq-h2 { font-size: var(--pq-h2); line-height: 1.04; }
.pq-h3 { font-size: var(--pq-h3); line-height: 1.16; }
.pq-intro { max-width: 72ch; color: var(--pq-muted); font-size: clamp(1.125rem, 1.5vw, 1.3125rem); line-height: 1.6; }
.pq-label, .pq-data { font-family: var(--pq-mono); font-size: var(--pq-label); }
.pq-label { font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.pq-muted-text { color: var(--pq-muted); }
.pq-accent { color: var(--pq-blue); }
.pq-room--dark .pq-accent, .pq-room--orange .pq-accent, .pq-room--ink .pq-accent { color: var(--pq-periwinkle); }
.pq-room--dark .pq-intro, .pq-room--dark .pq-muted-text, .pq-room--ink .pq-intro, .pq-room--ink .pq-muted-text { color: var(--pq-paper); }
.pq-room--orange .pq-intro, .pq-room--orange .pq-muted-text { color: rgba(255, 255, 255, .8); }

.pq-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 28px; border: var(--pq-rule) solid var(--pq-navy); border-radius: var(--pq-radius-control); background: var(--pq-navy); color: var(--pq-paper); font-weight: 700; text-align: center; text-decoration: none; }
.pq-btn--blue { border-color: var(--pq-blue); background: var(--pq-blue); }
.pq-btn--cream { border-color: var(--pq-paper); background: var(--pq-paper); color: var(--pq-navy); }
.pq-btn--outline { background: transparent; color: var(--pq-navy); }
.pq-room--dark .pq-btn--outline, .pq-room--orange .pq-btn--outline, .pq-room--ink .pq-btn--outline { border-color: var(--pq-line-dark); color: var(--pq-paper); }
.pq-rule { height: var(--pq-rule); border: 0; margin: 0; background: var(--pq-line); }
.pq-room--dark .pq-rule, .pq-room--orange .pq-rule, .pq-room--ink .pq-rule { background: var(--pq-line-dark); }
.pq-room--dark .pq-room-divider, .pq-room--orange .pq-room-divider, .pq-room--ink .pq-room-divider { border-color: var(--pq-line-dark); }
.pq-panel { padding: var(--pq-gap-lg); border: var(--pq-rule) solid var(--pq-line); border-radius: var(--pq-radius-panel); background: var(--pq-paper); color: var(--pq-ink); }
.pq-panel, .pq-document, .pq-card, .pq-button, .pq-form-surface, .pq-panel--raised { box-shadow: none; }
.pq-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 4px 8px; border: var(--pq-rule) solid var(--pq-navy); border-radius: var(--pq-radius-sharp); background: var(--pq-navy); color: var(--pq-paper); font: 600 10px/1 var(--pq-mono); letter-spacing: .08em; text-transform: uppercase; }

label { display: block; margin-bottom: var(--pq-gap-sm); color: var(--pq-muted); font: 600 var(--pq-label)/1.2 var(--pq-mono); letter-spacing: .12em; text-transform: uppercase; }
input, select, textarea { width: 100%; min-height: 46px; padding: 10px 12px; border: var(--pq-rule) solid var(--pq-line); border-radius: var(--pq-radius-control); background: var(--pq-paper); color: var(--pq-ink); }
textarea { min-height: 120px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--pq-muted); }

.pq-grid-2, .pq-grid-3, .pq-grid-4, .pq-split, .pq-faq-split { display: grid; gap: var(--pq-gap-lg); }
.pq-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pq-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pq-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pq-split { grid-template-columns: minmax(0, 54fr) minmax(0, 46fr); align-items: center; }
.pq-stat-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pq-gap); }
.pq-stat-strip > * { border-top: var(--pq-rule) solid var(--pq-line); padding-top: var(--pq-gap); }
.pq-faq-split { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; }
.pq-faq-split > :first-child { position: sticky; top: var(--pq-gap-lg); }
.pq-data { overflow-wrap: anywhere; }

.pq-movement { display: grid; grid-template-columns: repeat(var(--pq-columns, 3), minmax(0, 1fr)); border-top: 1px solid var(--pq-line); }
.pq-movement > * { min-width: 0; padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1rem, 2.5vw, 2rem); border-bottom: 1px solid var(--pq-line); }
.pq-movement > * + * { border-left: 1px solid var(--pq-line); }
.pq-stat-number { color: var(--pq-navy); font-family: var(--pq-display); font-size: var(--pq-stat); font-weight: 400; letter-spacing: -.04em; line-height: .88; }
.pq-room--dark .pq-stat-number, .pq-room--orange .pq-stat-number, .pq-room--ink .pq-stat-number { color: var(--pq-periwinkle); }

/* Loss-aversion movement: a single editorial ledger between problem and solution. */
.loss-movement { padding-block: clamp(4.5rem, 8vw, 7.5rem); }
.loss-movement__head { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.loss-movement__head .pq-h2 { max-width: 19ch; }
.loss-movement__rows { border-top: 1px solid var(--pq-line); }
.loss-movement__row { display: grid; grid-template-columns: minmax(2.5rem, 8%, 4.5rem) minmax(0, 1fr); gap: var(--pq-gap); align-items: baseline; padding: clamp(1.2rem, 2.5vw, 1.8rem) 0; border-bottom: 1px solid var(--pq-line); color: var(--pq-ink); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.4; }
.loss-movement__number { color: var(--pq-burnt-orange); font: 500 var(--pq-label)/1 var(--pq-mono); letter-spacing: .1em; }
.loss-movement__punchline { max-width: 30ch; margin: clamp(2rem, 4vw, 3.5rem) 0 0; color: #A45718; font: italic clamp(2rem, 3.6vw, 3.3rem)/1.05 var(--pq-display); letter-spacing: -.025em; }

.pq-room--dark .loss-movement__rows { border-color: var(--pq-line-dark); }
.pq-room--dark .loss-movement__row { border-color: var(--pq-line-dark); color: var(--pq-paper); }

@media (max-width: 980px) {
  .pq-wrap--narrow, .pq-wrap--mid, .pq-wrap--indent-left { width: min(var(--pq-wrap), calc(100% - 64px)); margin-inline: auto; }
  .pq-room--tall { min-height: auto; padding-block: clamp(6.25rem, 14vw, 8.75rem); }
  .pq-grid-3, .pq-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pq-split, .pq-faq-split { grid-template-columns: 1fr; }
  .pq-faq-split > :first-child { position: static; }
}

@media (max-width: 560px) {
  .pq-wrap { width: calc(100% - 32px); }
  .pq-grid-2, .pq-grid-3, .pq-grid-4, .pq-stat-strip { grid-template-columns: 1fr; }
  .pq-btn { width: 100%; }
}

@media (max-width: 760px) {
  .pq-movement { grid-template-columns: 1fr; }
  .pq-movement > * + * { border-left: 0; }
  .loss-movement__row { grid-template-columns: 2.5rem minmax(0, 1fr); }
}