:root{--cream:#f8f3e7;--paper:#fffaf0;--forest:#0b3e32;--green:#397e5d;--sage:#dcebd8;--gold:#ffc966;--ink:#153d34;--muted:#61766e}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:ui-rounded,"SF Pro Rounded","Avenir Next",system-ui,-apple-system,sans-serif;line-height:1.55}
a{color:inherit}
img{max-width:100%}
.skip-link{position:absolute;left:12px;top:-80px;z-index:10;padding:10px 16px;background:#fff;border-radius:10px}
.skip-link:focus{top:12px}
.site-nav{width:min(1180px,calc(100% - 48px));margin:auto;min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #d9dfcf}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;font-size:1.06rem;font-weight:950;letter-spacing:.045em}
.brand img{border-radius:12px;box-shadow:0 3px 10px #123d3022}
nav{display:flex;gap:clamp(16px,2.5vw,34px);align-items:center}
nav a{text-decoration:none;font-size:.91rem;font-weight:800}
nav a:hover,footer a:hover{text-decoration:underline;text-underline-offset:5px}
.hero,.story-section,.companion-section,.closing{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.hero{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:clamp(35px,6vw,86px);padding:76px 0 92px}
.eyebrow{margin:0 0 16px;color:var(--green);font-size:.76rem;font-weight:950;letter-spacing:.22em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.08}
h1{font-size:clamp(3.9rem,7vw,6.5rem);letter-spacing:-.065em;margin-bottom:28px;font-weight:950}
h1 em{font-style:normal;color:var(--green)}
.hero-lede{max-width:550px;color:#516c61;font-size:clamp(1.12rem,1.8vw,1.33rem);line-height:1.62}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:36px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:58px;padding:0 25px;border-radius:999px;text-decoration:none;font-weight:950;transition:transform .16s ease,box-shadow .16s ease}
.button:hover{transform:translateY(-3px);box-shadow:0 8px 22px #0b3e3225}
.button-primary{background:var(--gold);color:var(--forest);border:1px solid #f3af38}
.availability{color:var(--muted);font-size:.88rem;font-weight:750}
.hero-art{position:relative;aspect-ratio:4/5;min-height:470px;overflow:hidden;border:8px solid #fffdf3;border-radius:36px;box-shadow:0 22px 58px #214d3c24;background:#a9d7d5}
.hero-landscape{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 57%}
.hero-otter,.hero-fox{position:absolute;bottom:7%;width:57%;height:auto;filter:drop-shadow(0 10px 6px #183d2c44)}
.hero-otter{left:0;width:62%}
.hero-fox{right:-3%;bottom:5%}
.hero-art-caption{position:absolute;left:50%;bottom:3%;translate:-50% 0;white-space:nowrap;background:#fffaf0ed;padding:8px 15px;border-radius:999px;color:var(--forest);font-size:.75rem;font-weight:900;letter-spacing:.03em}
.meadow-divider{display:flex;justify-content:center;gap:30px;color:#92af79;font-size:1.25rem;opacity:.75}
.story-section{padding:92px 0 110px}
.section-heading{text-align:center;max-width:730px;margin:0 auto 45px}
h2{font-size:clamp(2.6rem,5vw,4.4rem);letter-spacing:-.05em;margin-bottom:19px;font-weight:950}
.section-heading>p:last-child,.companion-copy>p:not(.eyebrow){color:#526c60;font-size:1.09rem}
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.story-card{min-height:330px;padding:30px;border-radius:28px;background:var(--paper);border:1px solid #e8e1cf;box-shadow:0 8px 22px #214d3c0b}
.story-card:nth-child(2){background:#e3f0dd}
.story-index{color:var(--green);font-size:.75rem;letter-spacing:.15em;font-weight:950}
.arrow-mark,.paw-mark,.leaf-mark{height:115px;display:flex;align-items:center;justify-content:center;color:var(--forest);font-size:3.4rem;font-weight:900}
.arrow-mark span{color:#6eab77;margin:0 10px}.paw-mark{font-size:2rem;color:#c77c42}.leaf-mark{color:#77a66e;font-size:5rem}
.story-card h3{font-size:1.42rem;letter-spacing:-.025em;margin-bottom:11px}
.story-card p{color:#60736a;font-size:.98rem;margin-bottom:0}
.companion-section{display:grid;grid-template-columns:.9fr 1fr;gap:clamp(45px,8vw,120px);align-items:center;padding:25px 0 130px}
.companion-art{position:relative;display:grid;place-items:center;min-height:440px}
.companion-circle{position:absolute;width:min(96%,490px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 45% 35%,#d9eac9,#a8cfae 74%)}
.companion-art img{position:relative;display:block;width:min(100%,510px);height:auto;filter:drop-shadow(0 14px 12px #214d3c24)}
.companion-copy p:last-child{margin-bottom:0}
.closing{margin-bottom:88px;padding:clamp(44px,7vw,80px);text-align:center;border-radius:38px;background:var(--forest);color:#fffaf0}
.closing .eyebrow{color:#eac978}.closing h2{max-width:750px;margin-inline:auto}.closing p:not(.eyebrow){color:#d5e8d9;font-size:1.1rem}
.button-light{margin-top:16px;background:var(--gold);color:var(--forest)}
footer{background:#e9efdf;padding:34px 0;color:#526c60;font-size:.87rem}
.footer-inner{width:min(1180px,calc(100% - 48px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.footer-brand{text-decoration:none;font-weight:950;letter-spacing:.06em;color:var(--forest)}
footer .footer-inner div{display:flex;gap:24px}footer a{text-decoration:none;font-weight:800}
@media(max-width:850px){.hero{grid-template-columns:1fr;padding-top:55px}.hero-art{width:min(520px,100%);margin:auto}.story-grid{grid-template-columns:1fr}.story-card{min-height:230px}.arrow-mark,.paw-mark,.leaf-mark{height:80px}.companion-section{grid-template-columns:1fr;gap:10px}.companion-art{min-height:350px;max-width:500px;margin:auto}.companion-copy{text-align:center}}
@media(max-width:600px){.site-nav,.hero,.story-section,.companion-section,.closing,.footer-inner{width:calc(100% - 36px)}.site-nav{min-height:76px}.brand{font-size:.95rem}.brand img{width:38px;height:38px}nav{gap:13px}nav a{font-size:.77rem}nav a:first-child{display:none}h1{font-size:clamp(3.3rem,13vw,4.6rem)}.hero{gap:35px;padding:51px 0 66px}.hero-art{min-height:370px}.hero-actions{gap:12px}.story-section{padding:72px 0 82px}.story-card{padding:26px}.companion-section{padding:0 0 85px}.closing{padding:48px 22px;margin-bottom:55px}.footer-inner{flex-wrap:wrap}.footer-inner>span{order:3;width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}