:root { --ink:#171d38; --muted:rgba(23,29,56,.68); --navy:#171d38; --blue:#2878a8; --teal:#168c86; --leaf:#557f54; --gold:#f0c449; --coral:#e9664d; --paper:#fff6dc; --cream:#fffdf8; --sky:#eaf4fa; }
body { background:linear-gradient(180deg,#fffdf8 0%,#eaf4fa 48%,#fff6dc 100%); }.guide-header { background:rgba(255,253,248,.88); }.hero { grid-template-columns:minmax(0,1fr) minmax(380px,.65fr); }.hero h1 { font-size:clamp(3.4rem,8vw,7.4rem); line-height:.84; }.hero h1 span { color:var(--coral); }.button.primary { background:var(--navy); }.button.secondary { background:var(--gold); }
h1,h2,h3,strong { overflow-wrap:normal; word-break:normal; }
.hero h1 span { display:block; }
.argument-map { display:grid; gap:18px; border-radius:8px; padding:clamp(22px,4vw,36px); background:var(--navy); color:white; box-shadow:var(--shadow); }.map-main { display:grid; grid-template-columns:1fr auto 1fr; gap:14px; align-items:center; }.map-main > i { color:var(--gold); font-size:2rem; font-style:normal; }.map-box { display:grid; min-width:0; border:1px solid rgba(255,255,255,.18); border-radius:8px; padding:16px; background:rgba(255,255,255,.08); }.map-box small { color:rgba(255,255,255,.52); font-size:.67rem; }.map-box b { margin-top:8px; color:var(--gold); font-size:.84rem; letter-spacing:.1em; }.map-box span { margin-top:6px; color:rgba(255,255,255,.72); font-size:.72rem; line-height:1.4; }.map-bridge,.map-base { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.map-bridge { margin:0 8%; }.map-base { margin:0 16%; }.warrant { border-color:rgba(22,140,134,.7); }.claim { border-color:rgba(233,102,77,.72); }.rebuttal { border-color:rgba(85,127,84,.75); }
.snap-strip article:nth-child(1) { border-top:5px solid var(--blue); }.snap-strip article:nth-child(2) { border-top:5px solid var(--teal); }.snap-strip article:nth-child(3) { border-top:5px solid var(--gold); }.snap-strip article:nth-child(4) { border-top:5px solid var(--coral); }
.component-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:36px; }.component-grid article { border:1px solid var(--line); border-top:5px solid var(--accent); border-radius:8px; padding:24px; background:white; box-shadow:0 14px 36px rgba(23,29,56,.06); }.component-grid span { color:var(--accent); font-size:.7rem; font-weight:950; letter-spacing:.08em; }.component-grid h3 { margin-top:24px; font-size:1.4rem; }.component-grid p { color:var(--muted); line-height:1.55; }.component-grid b { display:block; margin-top:20px; color:var(--accent); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }.component-grid b + p { margin-top:6px; }
.test-lane { display:grid; gap:10px; margin-top:36px; }.test-lane article { display:grid; grid-template-columns:92px minmax(0,1fr) auto; gap:18px; align-items:center; border:1px solid var(--line); border-radius:8px; padding:18px 22px; background:white; }.test-lane article > span { color:var(--coral); font-size:.72rem; font-weight:950; letter-spacing:.08em; }.test-lane h3 { font-size:1.15rem; }.test-lane p { margin:5px 0 0; color:var(--muted); line-height:1.45; }.test-lane strong { color:var(--teal); font-size:.75rem; }
.dialogue-flow { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:36px; }.dialogue-flow article { border:1px solid var(--line); border-radius:8px; padding:24px; background:white; }.dialogue-flow span { color:var(--coral); font-size:.74rem; font-weight:950; }.dialogue-flow h3 { margin-top:24px; font-size:1.22rem; line-height:1.15; }.dialogue-flow p { color:var(--muted); line-height:1.52; }
.example-case { margin-top:22px; border-radius:8px; padding:clamp(22px,4vw,34px); background:var(--navy); color:white; }.example-case .eyebrow { color:var(--gold); }.case-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }.case-grid div { display:grid; gap:7px; border:1px solid rgba(255,255,255,.16); border-radius:8px; padding:15px; background:rgba(255,255,255,.06); }.case-grid b { color:var(--gold); font-size:.7rem; letter-spacing:.1em; }.case-grid span { color:rgba(255,255,255,.75); line-height:1.45; }
.workout-section { background:linear-gradient(135deg,var(--navy),#31477c); }
@media (max-width:980px) { .component-grid,.dialogue-flow { grid-template-columns:repeat(2,1fr); } }
@media (max-width:680px) {
  .guide-brand > span:last-child { display:none; }
  .guide-header { gap:8px; }
  .header-actions { gap:7px; }
  .icon-button { min-height:36px; padding:0 12px; }
  .hero { grid-template-columns:1fr; }
  .hero h1 { display:flex; gap:.24em; align-items:baseline; font-size:clamp(1.65rem,7.35vw,3rem); line-height:1; white-space:nowrap; }
  .hero h1 span { display:inline; white-space:nowrap; }
  .hero-copy > p:not(.eyebrow) { margin-top:20px; font-size:1rem; line-height:1.58; }
  .argument-map { gap:14px; padding:18px 14px; }
  .map-main { grid-template-columns:1fr; }
  .map-main > i { justify-self:center; transform:rotate(90deg); }
  .map-bridge,.map-base { grid-template-columns:1fr; margin:0; }
  .map-box { padding:15px; }
  .component-grid,.dialogue-flow,.case-grid { grid-template-columns:1fr; }
  .test-lane article { grid-template-columns:78px minmax(0,1fr); padding:15px; }
  .test-lane strong { grid-column:2; }
}

@media (max-width:380px) {
  .hero h1 { font-size:7.2vw; }
  .premium-access-badge { max-width:150px; font-size:.68rem; text-align:center; }
}