:root{--gold:#F5B700;--gold-d:#C98F00;--red:#E63946;--blue:#1D7FE0;--green:#2BB673;--orange:#FF8A00;--purple:#7B4FD6;--ink:#1E2235;--muted:#5A607A;--bg:#FFFDF6;--card:#fff;--line:#EDE7D6;--r:18px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Nunito","Trebuchet MS",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);line-height:1.55;font-size:17px}
img,svg{max-width:100%;display:block}a{color:var(--blue)}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.preview-bar{background:var(--ink);color:#fff;text-align:center;font-size:13px;padding:7px 12px;letter-spacing:.02em}
.preview-bar b{color:var(--gold)}
header.site{background:#fff;border-bottom:4px solid var(--gold);position:sticky;top:0;z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:900;font-size:22px;letter-spacing:-.01em}
.logo span.c{color:var(--red)}.logo span.k{color:var(--blue);font-size:15px;font-weight:800;margin-left:2px}
.crayon-stripe{height:6px;background:linear-gradient(90deg,var(--red) 0 20%,var(--orange) 20% 40%,var(--gold) 40% 60%,var(--green) 60% 80%,var(--blue) 80% 100%)}
nav.links{display:flex;gap:4px;flex-wrap:nowrap;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}nav.links::-webkit-scrollbar{display:none}@media(max-width:899px){header.site{position:static}}
nav.links a{text-decoration:none;color:var(--ink);font-weight:800;font-size:14px;padding:7px 11px;border-radius:999px;white-space:nowrap}
nav.links a:hover{background:#FFF3C4}nav.links a.on{background:var(--gold);color:var(--ink)}
@media(min-width:900px){nav.links{width:auto}}
.hero{padding:40px 0 30px;background:radial-gradient(circle at 85% 20%,#FFF1B8 0,transparent 45%),radial-gradient(circle at 10% 90%,#DDF4FF 0,transparent 40%)}
.hero-grid{display:grid;gap:28px;align-items:center}
@media(min-width:860px){.hero-grid{grid-template-columns:1.15fr .85fr}.hero{padding:64px 0 48px}}
.eyebrow{display:inline-block;background:var(--red);color:#fff;font-weight:900;font-size:13px;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px;transform:rotate(-2deg)}
h1,h2,h3{line-height:1.12;letter-spacing:-.015em;margin:.3em 0 .4em;font-weight:900}
h1{font-size:clamp(34px,7vw,58px)}h2{font-size:clamp(26px,4.6vw,38px)}h3{font-size:21px}
.hl{background:linear-gradient(transparent 60%,#FFE170 60%);padding:0 4px}
.lead{font-size:19px;color:var(--muted);max-width:40em}
.btn{display:inline-block;font-weight:900;text-decoration:none;padding:14px 22px;border-radius:14px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);transition:transform .08s;margin:6px 8px 6px 0;font-size:16px;cursor:pointer;font-family:inherit}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn.gold{background:var(--gold);color:var(--ink)}.btn.white{background:#fff;color:var(--ink)}.btn.blue{background:var(--blue);color:#fff}
.btn[aria-disabled=true]{opacity:.75;cursor:not-allowed}
section{padding:44px 0}section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.grid{display:grid;gap:18px}
@media(min-width:640px){.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:1fr 1fr}.g4{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}}
.card{background:var(--card);border:3px solid var(--ink);border-radius:var(--r);padding:22px;box-shadow:5px 5px 0 rgba(30,34,53,.12);position:relative}
.card.top-red{border-top:10px solid var(--red)}.card.top-blue{border-top:10px solid var(--blue)}.card.top-green{border-top:10px solid var(--green)}.card.top-gold{border-top:10px solid var(--gold)}.card.top-orange{border-top:10px solid var(--orange)}.card.top-purple{border-top:10px solid var(--purple)}
.card p{margin:.4em 0}.card .icon{width:56px;height:56px;margin-bottom:8px}
.tag{display:inline-block;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px;border-radius:999px;background:#EEF1F8;color:var(--muted)}
.tag.soon{background:#FFF3C4;color:#7A5A00}.tag.live{background:var(--green);color:#fff}.tag.free{background:var(--blue);color:#fff}
.price{font-size:30px;font-weight:900}
.book-cover{background:#fff;border:4px solid var(--ink);border-radius:10px;aspect-ratio:8.5/11;max-width:330px;margin:0 auto;box-shadow:10px 10px 0 var(--gold);display:flex;flex-direction:column;overflow:hidden}
.book-cover .bc-top{background:var(--red);color:#fff;text-align:center;padding:10px 8px 6px;font-weight:900;font-size:13px;letter-spacing:.1em}
.book-cover .bc-title{text-align:center;padding:10px 12px 0}
.book-cover .bc-title .t1{font-size:40px;font-weight:900;color:var(--green);line-height:1;-webkit-text-stroke:1.5px var(--ink);letter-spacing:.01em}
.book-cover .bc-title .t2{font-size:15px;font-weight:900;margin-top:4px}
.book-cover .bc-art{flex:1;display:flex;align-items:center;justify-content:center;padding:6px}
.book-cover .bc-age{background:var(--gold);text-align:center;font-weight:900;font-size:20px;padding:10px;border-top:4px solid var(--ink)}
.cover-note{text-align:center;font-size:13px;color:var(--muted);margin-top:14px}
ul.check{list-style:none;padding:0;margin:10px 0}ul.check li{padding-left:32px;position:relative;margin:8px 0}
ul.check li:before{content:"★";position:absolute;left:0;top:-2px;color:var(--gold);font-size:22px;-webkit-text-stroke:1px var(--gold-d)}
.steps{counter-reset:s;display:grid;gap:14px}@media(min-width:760px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{background:#fff;border:3px solid var(--ink);border-radius:var(--r);padding:18px;position:relative}
.step:before{counter-increment:s;content:counter(s);position:absolute;top:-16px;left:16px;background:var(--gold);border:3px solid var(--ink);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900}
.step h3{margin-top:10px}
.notice{background:#EAF4FF;border:2px dashed var(--blue);border-radius:14px;padding:14px 18px;font-size:15px}
.notice.warn{background:#FFF7DD;border-color:var(--gold-d)}
.quote-big{font-size:clamp(22px,4vw,30px);font-weight:900;line-height:1.25}
table.t{width:100%;border-collapse:collapse;background:#fff;border:3px solid var(--ink);border-radius:12px;overflow:hidden;font-size:15px}
table.t th,table.t td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
table.t th{background:#FFF3C4}
.board{font-variant-numeric:tabular-nums}
.board .ex{font-style:italic;color:var(--muted)}
form.preview{display:grid;gap:12px;max-width:520px}
form.preview label{font-weight:800;font-size:15px}
form.preview input,form.preview select{width:100%;padding:12px;border:2px solid var(--ink);border-radius:10px;font-size:16px;font-family:inherit;background:#fff}
form.preview .chk{display:flex;gap:10px;align-items:flex-start;font-weight:600}
form.preview .chk input{width:auto;margin-top:5px}
.upload{border:3px dashed var(--muted);border-radius:14px;padding:22px;text-align:center;color:var(--muted);background:#FAFAFC}
.cite{font-size:14px;color:var(--muted)}.cite a{color:var(--muted)}
.offer-num{position:absolute;top:-18px;right:16px;background:var(--ink);color:var(--gold);font-weight:900;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px}
.age-sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.age-sizes div{border:2px solid var(--line);border-radius:12px;padding:10px 6px;text-align:center;font-size:13px;font-weight:700}
.age-sizes b{display:block;font-size:20px}
footer.site{background:var(--ink);color:#D7DBEA;padding:36px 0 28px;margin-top:20px;font-size:15px}
footer.site a{color:#fff;text-decoration:none;font-weight:700}
.fgrid{display:grid;gap:18px}@media(min-width:760px){.fgrid{grid-template-columns:1.4fr 1fr 1fr}}
footer.site .small{font-size:13px;color:#9AA0B8;margin-top:22px;border-top:1px solid #333a55;padding-top:16px}
.center{text-align:center}.mt0{margin-top:0}.mb0{margin-bottom:0}
.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.pill{border:2px solid var(--ink);border-radius:999px;padding:6px 14px;font-weight:800;font-size:14px;background:#fff}
.deadline{background:#FFF8DC;border-left:5px solid var(--gold);border-radius:10px;padding:8px 12px;font-size:15px;margin:10px 0 12px}