/* Studio Pitch: warm cream with cobalt and coral blocks, chunky rounded cards, a full-color cover. */
:root {
  --bg: #fff5ea;
  --surface: #ffffff;
  --ink: #1b1534;
  --muted: #625b78;
  --line: #ecdcc8;
  --accent: #ff5b3a;
  --accent-ink: #ffffff;
  --accent-2: #2b45d4;
  --ok: #1f9d6b;
  --bad: #e5482a;
  --font-display: "Deck Grotesk", var(--cjk), system-ui, sans-serif;
  --font-body: "Deck Sans", var(--cjk), system-ui, sans-serif;
  --radius: 34px;
  --pad: 130px;
  --chart-colors: #2b45d4, #ff5b3a, #ffb547, #1f9d6b, #8d84ad;
  --outer: #140f28;
}
section h1, section h2 { font-weight: 700; letter-spacing: -0.035em; line-height: 1; }
section h1 { font-size: 150px; }
section h2 { font-size: 92px; }
section .kicker { color: var(--accent-2); font-family: var(--font-body); font-weight: 700; letter-spacing: 0.08em; }
section em { color: var(--accent); font-style: normal; }
section[data-layout="cover"], section[data-layout="end"] { background: var(--accent-2); color: #fff; }
section[data-layout="cover"] { background: radial-gradient(circle 330px at calc(100% - 170px) 170px, var(--accent) 99.5%, transparent 100%), var(--accent-2); }
section[data-layout="cover"] h1, section[data-layout="end"] h1 { color: #fff; }
section[data-layout="cover"] .kicker, section[data-layout="end"] .kicker { color: #ffd2c6; }
section[data-layout="cover"] .sub, section[data-layout="end"] .sub, section[data-layout="end"] .quiz-score { color: rgb(255 255 255 / 0.8); }
section[data-layout="cover"] em, section[data-layout="end"] em { color: #ffb547; }
.stats .stat { border: 0; border-radius: var(--radius); padding: 40px 44px; background: var(--surface); box-shadow: 0 2px 0 var(--line); }
.stats .stat:nth-child(2) { background: var(--accent-2); color: #fff; }
.stats .stat:nth-child(2) b, .stats .stat:nth-child(2) span { color: #fff; }
.stat b { font-family: var(--font-display); font-weight: 700; letter-spacing: -0.05em; }
section[data-layout="bullets"] li::before { width: 22px; height: 22px; border-radius: 50%; top: 0.42em; background: var(--accent); }
section[data-layout="compare"] .col { border: 0; box-shadow: 0 2px 0 var(--line); }
section[data-layout="compare"] .col:last-child { background: var(--accent-2); color: #fff; }
section[data-layout="compare"] .col:last-child li { border-color: rgb(255 255 255 / 0.25); }
.match .item { background: var(--accent-2); }
