:root { --cream:#fff8e8; --paper:#fffdf8; --ink:#4b2b21; --muted:#74594d; --coral:#f36c67; --coral-dark:#d95050; --gold:#f8c94c; --gold-soft:#ffe99b; --blue:#2d6eaa; --blue-soft:#dceff5; --teal:#2f8b91; --line:#efdcb9; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:"Trebuchet MS","Arial Rounded MT Bold",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
img { display:block; max-width:100%; }

.site-header { position:relative; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:2rem; min-height:84px; padding:0 5vw; background:rgba(255,253,248,.97); border-bottom:4px solid var(--gold); }
.brand { display:flex; align-items:center; gap:.8rem; }
.brand strong { display:block; font-size:1rem; letter-spacing:-.02em; }
.brand small { display:block; margin-top:.12rem; color:var(--coral-dark); font-size:.76rem; font-weight:800; }
.brand-blocks { display:flex; align-items:flex-end; }
.brand-blocks i { display:grid; place-items:center; width:29px; height:29px; margin-left:-5px; border:2px solid var(--paper); border-radius:8px; box-shadow:0 3px 0 rgba(75,43,33,.12); color:white; font-size:.7rem; font-style:normal; font-weight:900; transform:rotate(-5deg); }
.brand-blocks i:first-child { margin-left:0; background:var(--coral); }
.brand-blocks i:nth-child(2) { background:var(--blue); transform:rotate(4deg); }
.brand-blocks i:last-child { background:var(--gold); color:var(--ink); transform:rotate(-2deg); }
nav { display:flex; align-items:center; gap:2rem; font-size:.88rem; font-weight:900; }
nav a:not(.nav-button) { padding:.5rem 0; border-bottom:2px solid transparent; }
nav a:not(.nav-button):hover,nav a:not(.nav-button):focus-visible { color:var(--coral-dark); border-color:var(--coral); }
.nav-button { padding:.82rem 1.25rem; border:2px solid white; border-radius:999px; background:var(--coral); box-shadow:0 5px 0 #d95755; color:white; }

.hero { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,.92fr) minmax(420px,.78fr); align-items:center; gap:clamp(3rem,7vw,7rem); min-height:690px; overflow:hidden; padding:clamp(4.25rem,7vw,7rem) 6vw; background:radial-gradient(circle at 8% 18%,rgba(255,255,255,.7) 0 2px,transparent 3px),linear-gradient(120deg,#fde9c4 0%,#fff7e7 48%,#dceff5 100%); }
.hero::before { content:""; position:absolute; inset:auto -8% -120px 38%; z-index:-1; height:300px; border-radius:50% 45% 0 0; background:rgba(248,201,76,.32); transform:rotate(-4deg); }
.hero-copy { max-width:700px; }
.eyebrow { display:inline-flex; align-items:center; gap:.5rem; padding:.58rem .95rem; border:2px solid var(--ink); border-radius:999px; background:var(--gold-soft); box-shadow:4px 4px 0 var(--ink); font-size:.75rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; transform:rotate(-2deg); }
.eyebrow span { color:var(--coral-dark); }
.series-kicker,.section-kicker { margin:2rem 0 .55rem; color:var(--coral-dark); font-size:.82rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.hero h1 { max-width:720px; margin:0; color:var(--blue); font-family:ui-rounded,"Arial Rounded MT Bold","Trebuchet MS",sans-serif; font-size:clamp(4.7rem,7.6vw,8.4rem); font-weight:1000; letter-spacing:-.075em; line-height:.8; text-shadow:0 5px 0 rgba(255,255,255,.8); }
.hero h1 span { display:block; color:var(--ink); font-size:.46em; letter-spacing:-.04em; line-height:1.3; }
.hero-lede { max-width:610px; margin:2rem 0 .75rem; font-size:clamp(1.18rem,2vw,1.5rem); font-weight:900; line-height:1.45; }
.hero-support { max-width:560px; margin:0; color:var(--muted); font-family:Georgia,serif; font-size:1.05rem; line-height:1.75; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:52px; padding:.85rem 1.45rem; border:2px solid var(--ink); border-radius:999px; cursor:pointer; font-weight:900; transition:transform .18s ease,box-shadow .18s ease; }
.button:hover,.button:focus-visible { transform:translateY(-2px); }
.button-primary { background:var(--coral); box-shadow:5px 5px 0 var(--ink); color:white; }
.button-secondary { background:var(--paper); box-shadow:5px 5px 0 var(--gold); }
.published-by { margin:1.65rem 0 0; color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; }
.published-by strong { color:var(--ink); }
.hero-art { position:relative; justify-self:center; width:min(100%,530px); }
.cover-card { position:relative; z-index:2; margin:0; padding:12px 12px 14px; border:3px solid var(--paper); border-radius:28px; background:var(--paper); box-shadow:0 28px 60px rgba(67,51,29,.24),10px 10px 0 var(--blue); transform:rotate(2.2deg); }
.cover-window { aspect-ratio:1.11; overflow:hidden; border-radius:20px; }
.cover-window img { width:100%; height:111%; object-fit:cover; object-position:top center; }
.cover-card figcaption { padding:.9rem .2rem .2rem; color:var(--blue); text-align:center; font-family:Georgia,serif; font-size:1rem; font-weight:800; }
.book-badge { position:absolute; z-index:3; right:-2rem; bottom:1.2rem; padding:.8rem 1.25rem; border:3px solid white; border-radius:999px; background:var(--gold); box-shadow:0 8px 18px rgba(75,43,33,.2); font-size:.85rem; font-weight:900; transform:rotate(-4deg); }
.book-badge span { color:var(--coral-dark); }
.art-star { position:absolute; z-index:4; color:var(--gold); filter:drop-shadow(2px 2px 0 white); font-size:2.5rem; }
.art-star-one { left:-1.4rem; top:1.5rem; transform:rotate(-15deg); }
.art-star-two { right:-1.3rem; top:-1.1rem; color:var(--coral); font-size:1.75rem; }
.hero-scribble { position:absolute; z-index:-1; border:5px solid rgba(47,139,145,.2); border-radius:50%; }
.hero-scribble-one { left:-90px; bottom:80px; width:190px; height:90px; transform:rotate(18deg); }
.hero-scribble-two { right:34%; top:80px; width:80px; height:42px; transform:rotate(-22deg); }

.story-section { padding:clamp(5rem,8vw,8rem) 6vw; background:var(--paper); }
.section-heading { max-width:800px; margin:0 auto 3rem; text-align:center; }
.section-heading .section-kicker { margin-top:0; }
.section-heading h2,.max-copy h2,.updates-copy h2 { margin:0; font-family:ui-rounded,"Arial Rounded MT Bold","Trebuchet MS",sans-serif; font-size:clamp(2.35rem,4.6vw,4.5rem); letter-spacing:-.055em; line-height:1.02; }
.section-heading h2 em { color:var(--coral); font-style:normal; }
.section-heading>p:last-child { max-width:640px; margin:1.25rem auto 0; color:var(--muted); font-family:Georgia,serif; line-height:1.7; }
.story-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:2rem; max-width:1220px; margin:0 auto; }
.story-card { position:relative; display:flex; flex-direction:column; justify-content:center; overflow:hidden; padding:clamp(2rem,4vw,3.2rem); border:2px solid var(--ink); border-radius:34px; background:#fff1c7; box-shadow:8px 8px 0 var(--ink); }
.story-card>p { position:relative; z-index:1; margin:0; font-family:Georgia,serif; font-size:1.06rem; line-height:1.75; }
.story-card blockquote { position:relative; z-index:1; margin:clamp(1.5rem,3vw,2rem) 0 0; padding:1.3rem 1.5rem; border-left:5px solid var(--coral); border-radius:0 16px 16px 0; background:rgba(255,255,255,.68); color:var(--blue); font-size:1.25rem; font-weight:900; line-height:1.45; }
.toy-trail { position:absolute; right:-1.2rem; top:-1rem; display:flex; gap:.55rem; color:rgba(243,108,103,.17); font-size:4.2rem; transform:rotate(18deg); }
.detail-grid { display:grid; gap:1rem; }
.detail-card { display:flex; align-items:center; gap:1.35rem; padding:1.5rem; border:1px solid var(--line); border-radius:28px; background:white; box-shadow:0 12px 28px rgba(75,43,33,.08); }
.detail-icon { display:grid; flex:0 0 auto; place-items:center; width:64px; height:64px; border-radius:20px; color:white; font-size:1.4rem; font-weight:1000; transform:rotate(-4deg); }
.detail-icon.coral { background:var(--coral); }.detail-icon.blue { background:var(--blue); }.detail-icon.gold { background:var(--gold); color:var(--ink); }
.detail-card h3 { margin:0 0 .35rem; font-size:1.12rem; }
.detail-card p { margin:0; color:var(--muted); font-family:Georgia,serif; font-size:.96rem; line-height:1.6; }

.max-section { display:grid; grid-template-columns:minmax(330px,.8fr) minmax(0,1fr); align-items:center; gap:clamp(3rem,8vw,8rem); padding:clamp(5rem,8vw,8rem) 7vw; background:linear-gradient(135deg,#dceff5 0%,#edf7f5 100%); }
.max-portrait { position:relative; justify-self:end; width:min(100%,500px); aspect-ratio:.88; overflow:hidden; border:12px solid white; border-radius:46% 46% 32px 32px; box-shadow:12px 12px 0 var(--teal); transform:rotate(-2deg); }
.max-portrait img { width:100%; height:125%; object-fit:cover; object-position:63% 71%; transform:scale(1.06); }
.portrait-label { position:absolute; left:50%; bottom:1.3rem; padding:.7rem 1.2rem; border:2px solid var(--ink); border-radius:999px; background:var(--gold); box-shadow:4px 4px 0 var(--ink); font-size:.9rem; font-weight:900; transform:translateX(-50%) rotate(2deg); }
.max-copy { max-width:680px; }.max-copy .section-kicker { margin-top:0; }.max-copy h2 span { color:var(--blue); }
.max-copy>p:not(.section-kicker) { margin:1.5rem 0 0; color:var(--muted); font-family:Georgia,serif; font-size:1.08rem; line-height:1.8; }
.series-note { display:flex; align-items:flex-start; gap:1rem; margin-top:2.1rem; padding:1.35rem; border:1px solid rgba(47,139,145,.25); border-radius:24px; background:rgba(255,255,255,.72); }
.press-mark { display:grid; flex:0 0 auto; place-items:center; width:54px; height:54px; border-radius:17px; background:var(--coral); color:white; font-size:.75rem; font-weight:1000; letter-spacing:.06em; }
.series-note h3 { margin:.2rem 0 .4rem; }.series-note p { margin:0; color:var(--muted); font-family:Georgia,serif; font-size:.92rem; line-height:1.6; }.series-note .series-label { color:var(--coral-dark); font-family:inherit; font-size:.72rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }

.updates-section { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:clamp(2rem,6vw,6rem); padding:clamp(4.5rem,8vw,7rem) 7vw; background:var(--coral); color:white; }
.updates-copy .section-kicker { margin-top:0; color:var(--gold-soft); }
.updates-copy p:last-child { max-width:550px; margin:1.2rem 0 0; font-family:Georgia,serif; line-height:1.7; }
.signup-form { min-height:228px; padding:2rem; border:2px solid var(--ink); border-radius:30px; background:var(--paper); box-shadow:9px 9px 0 var(--ink); color:var(--ink); }
.field-row { display:grid; grid-template-columns:.8fr 1.2fr; gap:.8rem; }
.signup-form label span { display:block; margin:0 0 .45rem .15rem; font-size:.75rem; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
.signup-form input { width:100%; height:54px; padding:0 1rem; border:2px solid var(--line); border-radius:15px; background:white; outline:none; }
.signup-form input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(45,110,170,.15); }
.signup-form .button { width:100%; margin-top:1rem; }.signup-form>small { display:block; margin-top:.9rem; color:var(--muted); text-align:center; }
.form-honeypot { position:absolute; left:-10000px; width:1px!important; height:1px!important; overflow:hidden; }
.signup-form .button:disabled { cursor:wait; opacity:.72; transform:none; }
.form-message { min-height:1.4em; margin:.7rem 0 0; color:var(--muted); font-family:Georgia,serif; font-size:.92rem; line-height:1.4; text-align:center; }

footer { padding:2.5rem 6vw; background:var(--ink); color:white; text-align:center; }.footer-brand strong { display:block; color:var(--gold-soft); font-size:1.05rem; }.footer-brand span { display:block; margin-top:.4rem; color:#dbc8be; font-family:Georgia,serif; font-size:.9rem; line-height:1.5; }.footer-links { display:flex; flex-wrap:wrap; justify-content:center; gap:1.5rem; margin:1.5rem 0; font-size:.88rem; font-weight:800; }.footer-links a:hover,.footer-links a:focus-visible { color:var(--gold); }footer>p { margin:0; color:#c3aaa0; font-size:.82rem; line-height:1.5; }
:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }

@media (max-width:980px) { nav a:not(.nav-button){display:none}.hero{grid-template-columns:1fr 1fr;gap:2.5rem;padding-left:5vw;padding-right:5vw}.hero h1{font-size:clamp(4rem,8.5vw,6rem)}.book-badge{right:-1rem}.story-layout,.max-section,.updates-section{gap:2.5rem}.story-card blockquote{padding:1.15rem 1.25rem;font-size:1.1rem} }
@media (max-width:760px) { .site-header{min-height:72px;padding:.75rem 5vw}.brand strong{font-size:.9rem}.brand small{font-size:.68rem}.brand-blocks i{width:25px;height:25px;border-radius:7px}nav{gap:0}.nav-button{padding:.7rem .95rem;font-size:.76rem}.hero{grid-template-columns:1fr;gap:3.5rem;padding:3.6rem 6vw 5rem;text-align:center}.hero-copy{margin:0 auto}.hero h1{font-size:clamp(4.3rem,20vw,7rem)}.hero-support,.hero-lede{margin-left:auto;margin-right:auto}.hero-actions{justify-content:center}.hero-art{width:min(88vw,530px)}.story-layout,.max-section,.updates-section{grid-template-columns:1fr}.max-portrait{justify-self:center;width:min(88vw,500px)}.max-copy{text-align:center}.series-note{text-align:left}.updates-copy{text-align:center} }
@media (max-width:520px) { .site-header{align-items:center}.brand-blocks{display:none}.brand strong{max-width:130px;line-height:1.05}.nav-button{box-shadow:0 4px 0 #d95755}.hero{min-height:0;padding-top:3rem}.series-kicker{margin-top:1.6rem}.hero h1{font-size:clamp(4.15rem,19vw,5.8rem)}.hero-lede{font-size:1.12rem}.hero-actions{display:grid}.button{width:100%}.book-badge{right:-.35rem;bottom:.8rem;font-size:.72rem}.art-star-one{left:-.4rem}.art-star-two{right:-.25rem}.story-section,.max-section,.updates-section{padding-left:5vw;padding-right:5vw}.section-heading h2,.max-copy h2,.updates-copy h2{font-size:2.35rem}.story-card{padding:1.6rem;border-radius:25px}.detail-card{align-items:flex-start;padding:1.2rem}.detail-icon{width:52px;height:52px;border-radius:16px;font-size:1rem}.series-note{display:block}.press-mark{margin-bottom:.8rem}.signup-form{padding:1.3rem}.field-row{grid-template-columns:1fr}.footer-links{gap:1rem} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important} }