:root {
  --ink: #1f1728;
  --muted: #706879;
  --paper: #fbfaf7;
  --page: #efeaf2;
  --line: #dfdae4;
  --violet: #7657d8;
  --violet-soft: #eee9ff;
  --night: #21152e;
  --night-2: #2b1d39;
  --lime: #d7ff63;
  --white: #fff;
  --blush: #eee9ff;
  --sienna: #59476d;
  --serif: "Playfair Display", Georgia, serif;
  --sans: "Golos Text", system-ui, sans-serif;
}

body { font-size: 18px; line-height: 1.2; }
.brand { font-family: var(--serif); font-size: 18px; font-weight: 500; letter-spacing: -.02em; text-transform: none; }
.brand i { color: var(--lime); font-style: italic; }
.languages a { min-width: auto; padding-inline: 14px; color: var(--white); font-size: 12px; }
.languages a:hover { background: rgba(255,255,255,.1); }
.hero { color: var(--ink); background: var(--blush); }
.hero .eyebrow { color: var(--violet); }
h1 { max-width: 760px; font-size: clamp(40px, 4.4vw, 56px); line-height: 1.05; letter-spacing: -.03em; }
.standfirst { color: var(--sienna); font-size: 24px; line-height: 1.2; }
.byline { color: var(--muted); font-size: 15px; }
.article h2 { font-size: clamp(30px, 3.2vw, 42px); line-height: 1.1; letter-spacing: -.02em; }
.article h3 { line-height: 1.1; letter-spacing: -.01em; }
.problem-lead { border-left-color: var(--violet); }
.gear-center small, .transition-step b, .decision-step b { color: var(--blush); }
.diagnostic-result { background: var(--violet); }
.practice { background: var(--blush); }
.practice .eyebrow { color: var(--violet) !important; }
.situations-grid { grid-template-columns: 1fr; }
.situation { min-height: 0; }
.cta { color: var(--white); background: var(--violet); }
.cta .eyebrow, .cta p { color: #f0ebff; }
.button { min-height: 52px; color: var(--ink); border: 1.5px solid var(--lime); background: var(--lime); font-weight: 700; }
.button:hover { color: var(--ink); border-color: var(--white); background: var(--white); }
.reading,
.gear-map,
.diagnostic,
.situations,
.transition,
.practice,
.cta-wrap .wide,
.sources { width: min(760px, calc(100% - 80px)); margin-left: auto; margin-right: auto; }
.article p,
.article li,
.article figcaption,
.article strong { line-height: 1.2; }

@media (max-width: 860px) {
  .reading,
  .gear-map,
  .diagnostic,
  .situations,
  .transition,
  .practice,
  .cta-wrap .wide,
  .sources { width: min(760px, calc(100% - 44px)); margin-left: auto; margin-right: auto; }
  .practice, .cta { border-radius: 24px; }
}

@media (max-width: 600px) {
  body { font-size: 14px; line-height: 1.2; }
  .brand { font-size: 16px; }
  .languages a { padding-inline: 10px; font-size: 11px; }
  h1 { font-size: 34px; line-height: 1.06; }
  .standfirst { font-size: 17px; line-height: 1.2; }
  .article h2, .cta h2 { font-size: 25px; line-height: 1.1; }
  .article h3 { font-size: 20px; line-height: 1.1; }
  .reading,
  .gear-map,
  .diagnostic,
  .situations,
  .transition,
  .practice,
  .cta-wrap .wide,
  .sources { width: calc(100% - 28px); }
  .practice, .cta { border-radius: 20px; }
  .article p, .article li, .article figcaption, .article strong { font-size: 14px; line-height: 1.2; }
  .button { min-height: 46px; font-size: 15px; line-height: 1; }
}
