:root { --purple:#7350df; --purple-dark:#5134b4; --lilac:#eee8ff; --ink:#111114; --white:#fff; --line:#ded9ec; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:"Nunito",system-ui,sans-serif; font-size:18px; line-height:1.55; }
img { display:block; max-width:100%; }
a { color:inherit; }
.site-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:1rem max(5vw,24px); border-bottom:1px solid rgba(17,17,20,.08); background:rgba(255,255,255,.92); backdrop-filter:blur(12px); }
.wordmark { text-decoration:none; font-size:1.45rem; font-weight:900; letter-spacing:-.05em; }
.wordmark span { color:var(--purple); }
nav { display:flex; gap:2rem; }
nav a { font-size:.9rem; font-weight:800; text-decoration:none; }
.button { display:inline-flex; justify-content:center; align-items:center; padding:.85rem 1.35rem; border-radius:999px; background:var(--ink); color:#fff; font-weight:900; text-decoration:none; box-shadow:0 6px 0 var(--purple); transition:transform .18s ease, box-shadow .18s ease; }
.button:hover { transform:translateY(-2px); box-shadow:0 8px 0 var(--purple); }
.button-small { padding:.62rem 1rem; font-size:.85rem; box-shadow:none; background:var(--purple); }
.hero { min-height:calc(100vh - 76px); display:grid; grid-template-columns:1.05fr .95fr; align-items:center; overflow:hidden; padding:3rem max(6vw,28px) 2rem; background:radial-gradient(circle at 82% 38%,#f1ecff 0 21%,transparent 44%); }
.hero-copy { max-width:690px; position:relative; z-index:2; }
.eyebrow { color:var(--purple-dark); font-size:.78rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:.5rem; font-size:clamp(3rem,6vw,6.2rem); line-height:.94; letter-spacing:-.065em; }
.hero-lede { margin-bottom:1.2rem; color:var(--purple); font-size:clamp(1.6rem,3vw,2.8rem); font-weight:900; line-height:1.05; }
.intro { max-width:610px; font-size:1.12rem; }
.hero-actions { display:flex; align-items:center; gap:1.4rem; margin-top:2rem; }
.text-link { font-weight:900; text-decoration-thickness:2px; text-underline-offset:4px; }
.hero-art { position:relative; min-width:0; height:calc(100vh - 130px); display:flex; align-items:center; justify-content:center; }
.hero-art img { width:auto; max-width:100%; max-height:100%; margin:auto; object-fit:contain; filter:drop-shadow(0 28px 18px rgba(72,47,147,.14)); }
.question { position:absolute; color:var(--purple); font-weight:900; line-height:1; }
.question-one { top:8%; right:2%; font-size:7rem; transform:rotate(12deg); }
.question-two { top:47%; left:-3%; font-size:4rem; transform:rotate(-15deg); }
.book-section { padding:7rem max(6vw,28px); background:var(--ink); color:#fff; }
.book-wrap { max-width:1180px; margin:auto; display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,8vw,7rem); align-items:center; }
.cover-stage { position:relative; padding:1rem; border-radius:30px; background:var(--purple); transform:rotate(-2deg); box-shadow:22px 24px 0 #fff; }
.cover-stage img { width:100%; border-radius:16px; }
.book-copy h2,.section-heading h2,.grownups h2,.about h2 { font-size:clamp(2.2rem,4vw,4.4rem); line-height:1; letter-spacing:-.045em; }
.book-copy p { max-width:650px; color:#e7e4ee; }
.launch-card { margin-top:2rem; padding:1.25rem 1.4rem; display:grid; gap:.2rem; border:2px solid var(--purple); border-radius:18px; background:#211e29; }
.launch-card strong { color:#b9a4ff; font-size:1.15rem; }
.launch-card span { font-size:.9rem; color:#d8d3e2; }
.button-buy { justify-self:start; margin-top:1rem; background:#fff; color:var(--ink); box-shadow:0 6px 0 var(--purple); }
.lessons { padding:7rem max(6vw,28px); }
.section-heading { max-width:1050px; margin:0 auto 3rem; text-align:center; }
.lesson-grid { max-width:1180px; margin:auto; display:grid; grid-template-columns:repeat(4,1fr); border:2px solid var(--ink); border-radius:24px; overflow:hidden; box-shadow:10px 10px 0 var(--lilac); }
.lesson-grid article { min-height:310px; padding:1.6rem; border-right:2px solid var(--ink); }
.lesson-grid article:last-child { border-right:0; }
.lesson-grid article:nth-child(even) { background:var(--lilac); }
.lesson-grid span { color:var(--purple); font-size:.9rem; font-weight:900; }
.lesson-grid h3 { margin:2.6rem 0 .8rem; font-size:1.35rem; line-height:1.05; }
.lesson-grid p { font-size:.93rem; }
.grownups { padding:7rem max(6vw,28px); display:grid; grid-template-columns:1fr 1fr; gap:5rem; background:var(--lilac); }
.grownups > div { max-width:650px; }
.grownup-copy > p:first-child { font-size:1.15rem; }
.pull-quote { margin-top:2rem; padding-left:1.4rem; border-left:8px solid var(--purple); font-size:1.5rem; font-weight:900; line-height:1.15; }
.about { max-width:1050px; margin:6rem auto; padding:4rem clamp(2rem,6vw,5rem); border-radius:32px; background:var(--purple); color:#fff; box-shadow:14px 14px 0 var(--ink); }
.about .eyebrow { color:#e7deff; }
.about-quote { max-width:900px; margin-bottom:2rem; font-size:clamp(1.8rem,3.8vw,3.4rem); font-weight:900; line-height:1.08; letter-spacing:-.035em; }
.about-byline { margin-bottom:0; color:#eee9ff; font-size:1rem; }
footer { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:2rem max(5vw,24px); border-top:1px solid var(--line); font-size:.84rem; }
footer p { margin:0; }
.header-actions { display:flex; align-items:center; gap:.6rem; }
.social-icon { width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:var(--lilac); color:var(--purple-dark); transition:background .18s ease, color .18s ease, transform .18s ease; }
.social-icon svg { width:20px; height:20px; }
.social-icon:hover { background:var(--purple); color:#fff; transform:translateY(-2px); }
.hero-follow { margin-top:2.2rem; display:flex; align-items:center; flex-wrap:wrap; gap:.9rem 1.2rem; font-size:.95rem; }
.hero-follow strong { color:var(--purple-dark); }
.social-pills { display:flex; flex-wrap:wrap; gap:.6rem; }
.social-pill { display:inline-flex; align-items:center; gap:.5rem; padding:.55rem 1rem; border:2px solid var(--ink); border-radius:999px; font-size:.9rem; font-weight:900; text-decoration:none; background:#fff; transition:background .18s ease, color .18s ease, transform .18s ease; }
.social-pill svg { width:18px; height:18px; }
.social-pill:hover { background:var(--ink); color:#fff; transform:translateY(-2px); }
.follow { max-width:1050px; margin:0 auto 6rem; padding:0 max(6vw,28px); text-align:center; }
.follow h2 { margin-bottom:.8rem; font-size:clamp(2.2rem,4.4vw,4.4rem); line-height:1; letter-spacing:-.045em; }
.follow h2 span { color:var(--purple); }
.follow-sub { max-width:560px; margin:0 auto 2rem; }
.social-pills-big { justify-content:center; gap:1rem; }
.social-pills-big .social-pill { padding:1rem 1.8rem; font-size:1.1rem; box-shadow:0 6px 0 var(--purple); }
.social-pills-big .social-pill svg { width:24px; height:24px; }
.footer-social { display:flex; gap:.5rem; }
@media (max-width:900px) {
  nav { display:none; }
  .hero { min-height:auto; grid-template-columns:1fr; padding-top:3rem; }
  .hero-art { width:min(620px,100%); height:auto; margin:2rem auto 0; }
  .hero-art img { width:100%; max-height:none; }
  .book-wrap,.grownups { grid-template-columns:1fr; }
  .cover-stage { width:min(470px,90%); margin:auto; }
  .lesson-grid { grid-template-columns:1fr 1fr; }
  .lesson-grid article { border-bottom:2px solid var(--ink); }
  .lesson-grid article:nth-child(2) { border-right:0; }
  .lesson-grid article:nth-child(3),.lesson-grid article:nth-child(4) { border-bottom:0; }
}
@media (max-width:560px) {
  .header-actions { gap:.4rem; }
  .social-icon { width:34px; height:34px; }
  .social-icon svg { width:17px; height:17px; }
  .wordmark { font-size:1.2rem; }
  .social-pills-big { flex-direction:column; align-items:stretch; }
  .button-buy { justify-self:stretch; }
  body { font-size:16px; }
  .site-header { padding:.8rem 18px; }
  .button-small { font-size:.78rem; }
  .hero { padding:3rem 20px 0; }
  h1 { font-size:3.3rem; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .book-section,.lessons,.grownups { padding:5rem 20px; }
  .lesson-grid { grid-template-columns:1fr; }
  .lesson-grid article { min-height:230px; border-right:0; border-bottom:2px solid var(--ink)!important; }
  .lesson-grid article:last-child { border-bottom:0!important; }
  .about { width:calc(100% - 40px); margin:4rem auto; padding:3rem 1.5rem; border-radius:24px; box-shadow:8px 8px 0 var(--ink); }
  footer { align-items:flex-start; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } }

/* Halloween banner */
.spooky-banner { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.4rem .8rem; padding:.7rem max(5vw,18px); background:linear-gradient(90deg,#241650,#3b2a78); color:#fff; font-size:.95rem; font-weight:700; text-align:center; text-decoration:none; }
.spooky-banner strong { color:#ffb347; font-weight:900; }
.spooky-cta { display:inline-flex; align-items:center; gap:.3rem; padding:.25rem .8rem; border-radius:999px; background:#ff8a2a; color:#1b0f3a; font-weight:900; font-size:.85rem; transition:transform .18s ease; }
.spooky-banner:hover .spooky-cta { transform:translateY(-1px); }
@media (max-width:640px) { .spooky-banner { font-size:.85rem; } }
