@font-face{font-family:Andika;src:url('./Andika-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Andika;src:url('./Andika-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:light;--ink:#29273d;--plum:#593a69;--paper:#fcf9f2;--cotton:#fff5dc;--clay:#e9aa8e;--lilac:#d7c3e5;--mint:#cde0c8;--rule:#dfd7ce;--muted:#5f5666;--white:#fffdfa;--serif:Georgia,'Times New Roman',serif;--sans:Andika,system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.65 var(--sans);text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:var(--plum);text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
button,input{font:inherit}
:focus-visible{outline:3px solid #753d91;outline-offset:4px}
.skip{position:fixed;z-index:9;top:10px;left:10px;transform:translateY(-200%);background:white;padding:.55rem .9rem}
.skip:focus{transform:translateY(0)}
.wrap{width:min(1180px,calc(100% - 96px));margin-inline:auto}
.top{background:var(--paper);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;min-height:78px;gap:1.4rem}
.brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink);font-weight:700;text-decoration:none;font-size:1.08rem;line-height:1.25;white-space:nowrap}
.brand img{width:40px;height:40px}
.nav{display:flex;align-items:center;gap:1.45rem;margin-left:auto}
.nav>a:not(.button){color:var(--ink);text-decoration:none;white-space:nowrap;font-size:.92rem}
.nav>a:not(.button):hover,.nav>a[aria-current=page]:not(.button){color:var(--plum);text-decoration:underline}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;padding:.55rem 1.05rem;background:var(--plum);border:1px solid var(--plum);border-radius:8px;color:white;text-decoration:none;font-weight:700;line-height:1.3;cursor:pointer;text-align:center}
.button:hover{background:#472c57;color:white;text-decoration:none}
.button.secondary{background:transparent;color:var(--plum);border-color:#a28ca8}
.button.secondary:hover{background:#eee3f1}
.button.small{min-height:42px;padding:.5rem .85rem;font-size:.88rem}
.eyebrow,.index-label{font-weight:700;text-transform:uppercase;letter-spacing:.11em;font-size:.76rem;color:var(--plum);margin:0 0 .8rem}
h1,h2,h3{margin:0;color:var(--ink)}
h1,h2{font-family:var(--serif);font-weight:700;line-height:1.07;letter-spacing:-.038em}
h1{font-size:clamp(2.8rem,6.5vw,5.5rem)}
h2{font-size:clamp(2.05rem,3.5vw,3.05rem)}
h3{font-size:1.15rem;line-height:1.3}
p{margin:.8rem 0 0}
.lead{font-size:clamp(1.05rem,1.6vw,1.26rem);color:var(--muted);max-width:49ch}
.subtle{color:var(--muted);font-size:.9rem}
.accent{color:var(--plum)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;margin-top:1.35rem}
.hero{padding:66px 0 70px}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.hero .lead{margin-top:1.25rem}
.note{font-size:.85rem;color:var(--muted);margin-top:.85rem}
.art-stage{position:relative;min-height:455px;display:grid;place-items:center;isolation:isolate;overflow:hidden;border-radius:24px;border:1px solid #e2d4c5;background:radial-gradient(circle at 20% 20%,#fff4dd 0,transparent 58%),#f3e3d1}
.art-stage::before{position:absolute;inset:0;z-index:-1;content:'';background-image:radial-gradient(#a17e62 .55px,transparent .6px);background-size:6px 6px;opacity:.16}
.cover{position:relative;z-index:2;display:flex;flex-direction:column;width:min(54%,268px);aspect-ratio:4/5;padding:6% 6% 4%;border:1px solid #ad887a;border-left:8px solid #be775f;border-radius:4px 12px 12px 4px;background:#fff4d9;box-shadow:5px 7px 0 #f1dec1,6px 8px 0 #ad887a,14px 22px 28px #7c564437;transform:rotate(-8deg);line-height:1.05}
.cover-kicker{font-size:clamp(.5rem,.83vw,.72rem);text-transform:uppercase;font-weight:700;letter-spacing:.13em;color:var(--plum)}
.cover-title{font:700 clamp(1.35rem,3.05vw,2.54rem)/.98 var(--serif);letter-spacing:-.045em;margin-top:.6rem}
.cover img{width:80%;max-height:58%;object-fit:contain;margin:.15rem auto 0}
.cover.actual{display:block;padding:0;aspect-ratio:8.5/11;overflow:hidden}
.cover.actual img{width:100%;height:100%;max-height:none;margin:0;object-fit:cover}
.cover-author{font-size:clamp(.56rem,.95vw,.78rem);font-weight:700;margin-top:auto;color:var(--plum)}
.letter-tile{position:absolute;display:grid;place-items:center;z-index:3;font:700 clamp(1.7rem,3.5vw,2.85rem)/1 var(--sans);border:1px solid #9b879c;border-radius:8px;background:var(--lilac);width:clamp(60px,8vw,92px);aspect-ratio:1;box-shadow:4px 5px 0 #b497bc75;transform:rotate(13deg);right:8%;bottom:15%;color:var(--plum)}
.art-star,.art-dot{position:absolute;color:var(--plum);line-height:1;font-family:Georgia,serif}
.art-star{font-size:2.3rem;right:13%;top:12%;transform:rotate(10deg)}
.art-dot{font-size:2.05rem;left:10%;bottom:14%;color:#85482f}
.art-stage figcaption{position:absolute;bottom:.65rem;right:.9rem;font-size:.72rem;color:#604e53}
.crayon-apple{width:min(75%,360px);margin:24px auto 38px}
figure{margin:0}
.section{padding:60px 0;border-top:1px solid var(--rule)}
.section.washed{background:#f5f0e9}
.section-title{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:1.65rem}
.section-title .lead{font-size:1rem;max-width:38ch;margin:0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{display:flex;flex-direction:column;align-items:start;gap:.4rem;padding:1.3rem;border:1px solid var(--rule);border-radius:14px;background:var(--white)}
.card>p{margin:.18rem 0 .55rem}
.card>a:last-child{margin-top:auto;font-weight:700}
.number{display:grid;place-items:center;width:42px;height:42px;border:1px solid #9a839e;border-radius:9px;background:var(--lilac);color:var(--plum);font-weight:700;margin-bottom:.45rem;transform:rotate(-5deg)}
.card:nth-child(2) .number{background:var(--mint);border-color:#8f9f88;transform:rotate(4deg)}
.card:nth-child(3) .number{background:#f4caba;border-color:#bf8f7d}
.callout{border:1px solid #c2aeca;background:#efe4f3;border-radius:18px;padding:1.5rem 1.7rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.callout .lead{font-size:1rem}
.callout .button{flex-shrink:0}
.page{padding:57px 0 70px;min-height:65vh}
.page h1{font-size:clamp(2.6rem,5.7vw,4.45rem)}
.page-head{margin-bottom:2rem;max-width:780px}
.page-head .lead{max-width:60ch}
.columns{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:start}
.columns .art-stage{min-height:360px}
.prose{max-width:700px}
.prose h2{font-size:2rem;margin-top:2.1rem}
.prose h3{margin-top:1.5rem}
.prose li+li{margin-top:.45rem}
.prose li::marker{color:var(--plum)}
.form{background:var(--white);border:1px solid var(--rule);border-radius:15px;padding:clamp(1.1rem,4vw,1.8rem);margin-top:1.6rem;max-width:35rem}
.form label:not(.consent){display:block;font-weight:700;margin:.85rem 0 .35rem}
.form input[type=email]{width:100%;min-height:46px;background:white;border:1px solid #8b798f;border-radius:7px;padding:.5rem .65rem;color:var(--ink)}
.consent{display:grid;grid-template-columns:1.2rem 1fr;gap:.65rem;margin:1rem 0;font-size:.92rem}
.consent input{width:1rem;height:1rem;margin-top:.34rem;accent-color:var(--plum)}
.form .button{width:100%}
.signup-panel{margin-top:1.6rem;max-width:35rem}
.signup-panel>.subtle{padding:0 .75rem}
.preview-note{padding:.55rem .75rem;border-radius:6px;background:#f1e5c8;color:#4c3f27;font-size:.83rem;margin-top:1rem}
.stack{display:grid;gap:1rem}
.book-card{display:grid;grid-template-columns:110px 1fr;gap:1.15rem;padding:1.2rem;border:1px solid var(--rule);border-radius:14px;background:var(--white)}
.book-icon{background:var(--cotton);min-height:112px;border:1px solid #c89f89;border-left:5px solid #be775f;border-radius:4px 10px 10px 4px;display:grid;place-items:center;color:var(--plum);font-weight:700;font-size:2rem;align-self:start;transform:rotate(-4deg)}
.book-icon.mint{background:var(--mint);border-color:#7e9878}
.status{display:inline-block;padding:.16rem .6rem;margin:0 0 .6rem;background:#e6eddf;color:#304c33;border-radius:99px;font-size:.76rem;font-weight:700}
.exercise{padding:1.2rem 1.35rem;border:1px solid var(--rule);border-radius:12px;background:var(--white);scroll-margin:1rem}
.exercise .index-label{margin-bottom:.3rem}
.sound-tiles{display:inline-flex;gap:.28rem;margin:.8rem 0 0}
.sound-tiles span{display:inline-grid;place-items:center;width:2.3rem;height:2.3rem;font-weight:700;font-size:1.2rem;background:var(--mint);border-radius:5px;border:1px solid #92a48a}
details{border-top:1px solid var(--rule);padding:.9rem 0}
summary{font-weight:700;cursor:pointer}
.foot{background:#efe8df;border-top:1px solid var(--rule);padding:35px 0 27px}
.foot-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:24px}
.foot-links{display:flex;flex-wrap:wrap;align-content:start;justify-content:end;gap:.4rem 1.2rem;font-size:.9rem}
.foot .subtle{max-width:44ch}
.foot .fine{margin-top:1.5rem;border-top:1px solid #d9cfc3;padding-top:.8rem;font-size:.79rem;color:var(--muted)}
@media(max-width:930px){.wrap{width:min(100% - 56px,1180px)}.top .wrap{gap:.8rem}.nav{gap:.85rem}.hero-grid{gap:28px}.art-stage{min-height:370px}}
@media(max-width:740px){.wrap{width:calc(100% - 36px)}.top .wrap{padding:.72rem 0;flex-wrap:wrap;min-height:auto}.brand{font-size:1rem}.brand img{width:34px;height:34px}.nav{width:100%;justify-content:space-between;gap:.45rem;flex-wrap:wrap}.nav>a:not(.button){font-size:.82rem}.nav .button{min-height:39px;font-size:.78rem;padding:.4rem .55rem}.hero,.page{padding:42px 0 48px}.hero-grid,.columns{grid-template-columns:1fr;gap:28px}.art-stage{min-height:345px}.cover{width:min(55%,240px);padding:1rem 1.05rem .75rem}.cover-title{font-size:clamp(1.6rem,6vw,2.35rem)}.cover-kicker,.cover-author{font-size:.66rem}.letter-tile{width:70px}.section{padding:42px 0}.section-title{display:block}.section-title .lead{margin:.75rem 0 0}.cards{grid-template-columns:1fr;gap:10px}.card{padding:1.12rem}.callout{align-items:start;flex-direction:column;padding:1.25rem;gap:1rem}.foot-grid{grid-template-columns:1fr;gap:12px}.foot-links{justify-content:start}.book-card{grid-template-columns:70px 1fr}.book-icon{min-height:86px;font-size:1.4rem}.columns .art-stage{min-height:320px}}
@media(max-width:740px){
  .top .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.55rem .6rem}
  .top .brand{white-space:normal}
  .top .brand img{flex:none}
  .header-cta{grid-area:1/2;min-height:39px;font-size:.78rem;padding:.4rem .55rem}
  .nav{grid-column:1/-1;margin:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}