/* Bridge: lets legacy style.css / landing.css components (unlocked-library cards,
   sample quiz, FAQ blocks) sit inside the premium shell. It only re-points the
   legacy tokens at the new palette and fixes the few collisions — no legacy
   component is rewritten here. Remove once those components are rebuilt. */
body.cp {
  --navy: #0E1F3F; --navy-light: #152D50; --navy-dark: #081326;
  --gold: #DDA63B; --gold-light: #E6B656; --gold-dark: #805600;
  --off-white: #F5F3EE; --gray-50: #F5F3EE; --gray-100: #DADFE5; --gray-500: #526176; --gray-700: #26354B;
  --radius: 8px; --radius-lg: 12px;
}
body.cp .btn { border-radius: 8px; font-weight: 600; color: #0E1F3F; text-decoration: none; }
body.cp .btn.btn-navy, body.cp .btn.btn-secondary { color: #fff; }
body.cp .section-eyebrow { color: #805600; letter-spacing: .14em; font-size: .75rem; font-weight: 600; }
body.cp .section-header h2, body.cp #testList h2 { font-family: "Source Serif 4", Georgia, serif; font-weight: 400; letter-spacing: -.03em; color: #0E1F3F; }
body.cp .book-card-unlocked { border-radius: 12px; border: 1px solid #DADFE5; box-shadow: none; }
body.cp .gold { color: #DDA63B; }

/* Landing pages: editorial headline, calmer hero */
body.cp .lp-hero { background: #0E1F3F; }
body.cp .lp-hero h1 { font-family: "Source Serif 4", Georgia, serif; font-weight: 400; letter-spacing: -.035em; font-size: clamp(2.375rem, 4.4vw, 3.75rem); line-height: 1.06; }
body.cp .lp-hero h1 .gold { color: #E8BA62; font-style: italic; }
body.cp .lp-hero-cover img { transform: rotate(-4deg); border-radius: 3px 8px 8px 3px; }
body.cp .lp-section h2, body.cp .lp-quiz-head h2 { font-family: "Source Serif 4", Georgia, serif; font-weight: 400; letter-spacing: -.03em; }

/* Access panel: undo the legacy centred, uppercase form-card treatment */
body.cp .cp-access-panel { text-align: left; max-width: none; }
body.cp .cp-access-panel .btn { text-transform: none; letter-spacing: 0; display: flex; justify-content: center; align-items: center; box-shadow: none; }
body.cp .cp-access-panel .hint span { white-space: nowrap; }
body.cp #testList .section-header { text-align: left; }
body.cp #testList .btn { color: #0E1F3F; }