@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Fraunces:opsz,wght,SOFT,WONK@9..144,600,20,1;9..144,700,20,1&display=swap');
:root{--ink:#102b3a;--deep:#092b36;--cream:#fff8e9;--gold:#f8d375;--blue:#84c7e5;--leaf:#a0c7a0;--pink:#f3b6b0}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font:400 1rem/1.65 'DM Sans',Arial,sans-serif}a{color:inherit}button{font:inherit}.wrap{width:min(1180px,calc(100% - 44px));margin:auto}.skip{position:absolute;left:-9999px;top:0;background:white;padding:10px;z-index:30}.skip:focus{left:10px}a:focus-visible,button:focus-visible{outline:3px solid #f5ad43;outline-offset:4px}.site-header{position:absolute;inset:0 0 auto;z-index:10;color:#fff}.nav{height:84px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;font:700 1.7rem/1 Georgia,serif;letter-spacing:-.035em;white-space:nowrap;text-shadow:0 2px 10px #07212a80}.brand span{color:#ffe397}.nav-links{display:flex;align-items:center;gap:26px}.nav-links a{text-decoration:none;font-size:.91rem;font-weight:800;text-shadow:0 1px 6px #07212ab0}.nav-links a:hover{text-decoration:underline;text-underline-offset:5px}.nav-buy{border:1px solid #ffffffb5;padding:8px 18px;border-radius:30px;background:#102b3a66}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;letter-spacing:-.035em}.eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.19em;font-size:.75rem;color:#ffe397}.eyebrow.dark{color:#377d80}.sparkle{font-size:1.1rem;margin-right:6px}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:13px 24px;border-radius:100px;text-decoration:none;font-weight:800;border:2px solid transparent;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px)}.button.gold{background:var(--gold);color:var(--ink);box-shadow:0 8px 0 #ad8d46}.button.gold:hover{box-shadow:0 5px 0 #ad8d46}.button.ghost{border-color:#fff;color:#fff;background:#102b3a55}.button.ink{background:var(--ink);color:#fff;box-shadow:0 7px 0 #9c7552}.button.ink:hover{box-shadow:0 4px 0 #9c7552}
.hero{position:relative;min-height:min(850px,100svh);height:750px;color:#fff;background:#377e9f url('cerpre-meadow.jpg') center center/cover no-repeat;isolation:isolate}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#092b36ed 0%,#103b48c7 29%,#123a4938 57%,transparent 82%),linear-gradient(0deg,#072d31ad,transparent 35%);z-index:0}.hero-inner{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-top:72px;padding-bottom:80px}.hero h1{font-size:clamp(3.6rem,6.6vw,7rem);line-height:1.02;max-width:680px;margin:13px 0 22px;text-shadow:0 3px 20px #05212d8a}.hero h1 em{display:block;font-style:normal;color:#ffe09d}.hero-lede{font-size:clamp(1.14rem,1.75vw,1.38rem);font-weight:600;line-height:1.55;max-width:530px;margin:0;text-shadow:0 2px 12px #05212dc4}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:31px 0 28px}.hero-note{font-size:.84rem;text-transform:uppercase;letter-spacing:.17em;font-weight:800;color:#fbe8bd}.scroll-cue{position:absolute;z-index:1;bottom:22px;left:50%;transform:translateX(-50%);text-decoration:none;font-weight:800;font-size:.83rem;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}.scroll-cue span{display:inline-block;margin-left:6px;font-size:1.25rem;animation:bob 1.8s ease-in-out infinite}@keyframes bob{50%{transform:translateY(5px)}}
.marquee{background:#123c46;color:#fbe3a2;padding:17px 16px;display:flex;justify-content:center;gap:28px;align-items:center;font-size:.78rem;font-weight:800;letter-spacing:.17em;text-align:center}.marquee b{font-size:1.25rem}
.story-section{padding:106px 0;background:radial-gradient(circle at 83% 15%,#f8dfaa,transparent 30%),#fff7e7}.story-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:8%;align-items:center}.story-intro h2,.wonder-section h2,.magic-section h2{font-size:clamp(2.9rem,4.6vw,5rem);line-height:1.08;margin:13px 0 23px}.story-intro>p:not(.eyebrow){font-size:1.1rem;max-width:460px}.trail-controls{display:grid;gap:11px;margin-top:29px}.trail-stop{display:flex;align-items:center;gap:18px;text-align:left;border:2px solid #85a59c;background:#fffef9;padding:13px 18px;border-radius:15px;color:var(--ink);font-weight:800;cursor:pointer;transition:transform .2s,background .2s}.trail-stop span{font:700 1.5rem Georgia,serif;color:#438382}.trail-stop:hover{transform:translateX(5px)}.trail-stop.active{background:#dce9d5;border-color:#317b78;box-shadow:4px 4px 0 #317b78}.trail-scene{min-height:555px;border:8px solid #fff;border-radius:180px 180px 20px 20px;box-shadow:0 20px 0 #c2d5c1,0 25px 35px #122b3c3d;background:linear-gradient(0deg,#082d39ef,#0e354050 58%,#072c3c33),url('cerpre-meadow.jpg') 69% center/cover no-repeat;color:white;display:flex;flex-direction:column;justify-content:space-between;padding:28px;transition:background-position .4s}.trail-scene[data-scene="1"]{background-position:center,78% center}.trail-scene[data-scene="2"]{background-position:center,88% center}.scene-count{align-self:flex-end;background:#fff8e9e6;color:var(--ink);border-radius:30px;padding:5px 14px;font-weight:800;font-size:.8rem;letter-spacing:.1em}.scene-copy{max-width:470px;padding:20px 5px 7px;text-shadow:0 2px 12px #0d2738}.scene-copy h3{font-size:clamp(2.9rem,4vw,4.5rem);line-height:1.04;margin:10px 0}.scene-copy p:not(.eyebrow){font-size:1.1rem;line-height:1.65;font-weight:600}.scene-next{background:var(--gold);border:0;border-radius:40px;padding:10px 19px;font-weight:800;color:var(--ink);cursor:pointer}.scene-next:hover{background:#ffe7a8}
.wonder-section{background:#0d3842;color:#fff;padding:105px 0}.wonder-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:8%;align-items:center}.wonder-section h2{color:#ffe1a3}.wonder-grid>div>p:not(.eyebrow){font-size:1.15rem;max-width:485px}.friend-tags{display:grid;gap:12px;margin-top:30px}.friend-tags span{width:max-content;max-width:100%;border:1px solid #e7d8aa;border-radius:30px;padding:8px 17px;background:#ffffff12;font-weight:700}.wonder-frame{min-height:470px;border:8px solid #fff7e8;border-radius:24px;background:url('cerpre-meadow.jpg') 80% center/cover no-repeat;box-shadow:14px 16px 0 #ffe0a0;position:relative}.frame-caption{position:absolute;bottom:14px;left:15px;background:#082b37d8;color:white;border-radius:100px;padding:8px 15px;font-weight:700;font-size:.84rem}
.magic-section{padding:96px 0;background:#cfebdf}.magic-grid{display:grid;grid-template-columns:.83fr 1.17fr;gap:8%;align-items:center}.magic-grid>div>p:not(.eyebrow){font-size:1.1rem;max-width:450px}.magic-result{font-weight:800;min-height:3em;color:#1d6665}.magic-meadow{position:relative;height:370px;border-radius:30px;background:linear-gradient(0deg,#143a43a6,transparent 55%),url('cerpre-meadow.jpg') center bottom/cover no-repeat;border:6px solid white;box-shadow:9px 10px 0 #81b6a6}.glimmer{position:absolute;border:0;background:#ffdf79;color:#fff;width:54px;height:54px;border-radius:50%;font-size:2rem;line-height:1;box-shadow:0 0 0 9px #ffeebc57,0 0 34px 13px #fff1a4;cursor:pointer;animation:float 3s ease-in-out infinite;transition:transform .2s,opacity .3s}.glimmer:hover{transform:scale(1.15)}.glimmer.found{opacity:.3;cursor:default;animation:none}.glimmer-one{top:25%;left:21%}.glimmer-two{top:45%;right:25%;animation-delay:.8s}.glimmer-three{bottom:22%;left:43%;animation-delay:1.4s}@keyframes float{50%{translate:0 -8px}}.magic-count{position:absolute;right:18px;bottom:16px;background:#fff8e9;color:var(--ink);border-radius:30px;padding:5px 13px;font-weight:800;font-size:.8rem}
.book-section{padding:100px 0 110px;background:#fff7e7}.book-grid{display:grid;grid-template-columns:.82fr 1.18fr;align-items:center;gap:11%}.book-cover{width:min(100%,390px);justify-self:center;transform:rotate(-4deg);border:7px solid white;border-radius:8px;box-shadow:15px 18px 0 #173e46,0 25px 35px #173e4655}.book-cover img{width:100%;height:auto;display:block}.book-copy h2{font-size:clamp(3.6rem,6vw,6.4rem);line-height:1.02;margin:12px 0 25px}.book-copy>p:not(.eyebrow){font-size:1.19rem;max-width:620px}.reading-note{border-left:4px solid #b48a48;padding-left:18px;color:#42606a}.book-copy .button{margin:19px 0 20px}.more-stories{display:block;font-weight:800;color:#4d7977}
footer{background:#082c36;color:#fff;padding:30px 0}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}.footer-inner div{display:flex;flex-direction:column}.footer-inner strong{font:700 1.35rem Georgia,serif;color:#ffe0a0}footer a{text-underline-offset:5px;font-weight:700}
@media(max-width:930px){.hero{background-position:61% center}.story-grid,.wonder-grid,.magic-grid,.book-grid{grid-template-columns:1fr;gap:48px}.trail-scene{min-height:480px}.wonder-frame{min-height:430px}.book-cover{max-width:320px}.book-grid .book-cover{grid-row:2}}
@media(max-width:620px){.wrap{width:min(100% - 32px,1180px)}.nav{height:70px}.brand{font-size:1.3rem}.nav-links{gap:10px}.nav-links a:not(.nav-buy){display:none}.nav-buy{padding:6px 12px}.hero{height:760px;min-height:100svh;background-position:69% center}.hero-shade{background:linear-gradient(0deg,#092b36f2 2%,#103b48d4 41%,#123a4945 85%),linear-gradient(90deg,#092b368a,transparent 70%)}.hero-inner{justify-content:flex-end;padding-top:130px;padding-bottom:105px}.hero h1{font-size:clamp(3.25rem,11vw,5rem)}.hero-lede{font-size:1.06rem}.hero-actions{gap:10px}.button{padding:11px 18px;font-size:.9rem}.scroll-cue{bottom:19px}.marquee{gap:9px;font-size:.6rem;letter-spacing:.08em}.marquee b{font-size:.9rem}.story-section,.wonder-section,.magic-section,.book-section{padding:70px 0}.story-intro h2,.wonder-section h2,.magic-section h2{font-size:clamp(2.6rem,10vw,4rem)}.trail-scene{min-height:460px;border-radius:100px 100px 18px 18px;padding:19px}.scene-copy h3{font-size:2.8rem}.scene-copy p:not(.eyebrow){font-size:1rem}.wonder-frame{min-height:330px;box-shadow:8px 9px 0 #ffe0a0}.magic-meadow{height:320px}.book-copy h2{font-size:clamp(3rem,12vw,4.6rem)}.book-cover{max-width:260px}.footer-inner{align-items:start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}