@font-face{font-family:"Fredoka";src:url("fonts/Fredoka-var-latin.woff2") format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/Nunito-var-latin.woff2") format("woff2");font-weight:200 1000;font-display:swap}
:root{--ink:#2b1d14;--brown:#5a3825;--deep:#16202d;--night:#1d2a3a;--cream:#fff6e6;--paper:#fffbf4;--orange:#e07b39;--orange-d:#b4541a;--lava:#ff8a3d;--grass:#4f9a3d;--glass:#e3f3f4;--water:#6db6c2;--sand:#f2c47e;--muted:#5f4c3e;--radius:20px;--shadow:0 18px 40px -18px rgba(43,29,20,.45)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:64px}
body{margin:0;font-family:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:1.0625rem;line-height:1.65;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:"Fredoka","Nunito",system-ui,sans-serif;line-height:1.1;margin:0 0 .5em;font-weight:600;color:var(--brown)}
a{color:var(--orange-d)}
img{max-width:100%}
:focus-visible{outline:3px solid var(--lava);outline-offset:3px;border-radius:6px}
.wrap{max-width:1140px;margin:0 auto;padding:0 1.25rem}
.skip{position:absolute;left:-999px;top:0}.skip:focus{left:1rem;top:1rem;background:#fff;color:var(--ink);padding:.5rem 1rem;z-index:99;border-radius:8px}

/* top bar */
.topbar{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s}
.topbar-in{display:flex;align-items:center;justify-content:space-between;height:60px;gap:1rem}
.topbar .mark{font-family:"Fredoka",sans-serif;font-weight:700;font-size:1.45rem;color:#fff;text-decoration:none;letter-spacing:.01em;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.topbar ul{display:flex;gap:.25rem;list-style:none;margin:0;padding:0}
.topbar ul a{color:#fff;text-decoration:none;font-weight:800;font-size:.95rem;padding:.4rem .75rem;border-radius:999px;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.topbar ul a:hover{background:rgba(255,255,255,.16)}
.topbar.solid{background:rgba(22,32,45,.92);box-shadow:0 6px 20px rgba(0,0,0,.25);backdrop-filter:blur(8px)}

/* hero */
.hero{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden;background:var(--night)}
.hero-bg,.hero-bg img{position:absolute;inset:0;width:100%;height:100%}
.hero-bg{z-index:-2}
.hero-bg img{object-fit:cover;object-position:center 40%;transform:scale(1.06);animation:drift 24s ease-in-out infinite alternate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
 radial-gradient(ellipse 70% 55% at 50% 45%,rgba(22,32,45,.15),rgba(22,32,45,.65) 70%),
 linear-gradient(180deg,rgba(22,32,45,.55) 0%,rgba(22,32,45,.2) 30%,rgba(43,29,20,.55) 72%,var(--paper) 100%)}
.hero-glow{position:absolute;inset:auto -10% -30% -10%;height:60%;z-index:-1;background:radial-gradient(ellipse at 50% 100%,rgba(255,138,61,.35),transparent 65%);pointer-events:none}
.hero-in{padding:6.5rem 1.25rem 7rem;max-width:960px}
.status{display:inline-flex;align-items:center;gap:.5rem;background:rgba(227,243,244,.95);color:#174c53;border-radius:999px;padding:.35rem 1rem;font-weight:900;font-size:.9rem;letter-spacing:.02em;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.status .dot{width:.55rem;height:.55rem;border-radius:50%;background:var(--grass);box-shadow:0 0 0 0 rgba(79,154,61,.6);animation:pulse 2s infinite}
.title{margin:1.1rem 0 .3rem;font-size:clamp(4rem,15vw,10.5rem);font-weight:700;line-height:.92;letter-spacing:-.01em;color:var(--cream)}
.title-text{display:inline-block;background:linear-gradient(180deg,#fffaf0 0%,#ffe7b8 45%,#f2c47e 70%,#e07b39 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 0 #5a3825) drop-shadow(0 14px 22px rgba(0,0,0,.55));padding:0 .05em .08em}
.tagline{font-family:"Fredoka",sans-serif;font-weight:500;font-size:clamp(1.25rem,3vw,1.9rem);margin:0 0 1rem;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.lede{font-size:clamp(1rem,2vw,1.15rem);max-width:44rem;margin:0 auto 1.8rem;font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,.8);background:rgba(22,32,45,.35);border-radius:16px;padding:.6rem 1rem}
.cta-row{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;align-items:center}
.btn{display:inline-block;font-family:"Fredoka",sans-serif;font-weight:600;font-size:1.1rem;line-height:1.2;padding:.8rem 1.5rem;border-radius:999px;text-decoration:none;background:var(--orange);color:#fff;border:3px solid var(--brown);box-shadow:0 5px 0 var(--brown);text-shadow:0 1px 0 rgba(90,56,37,.6)}
.btn[aria-disabled="true"]{cursor:not-allowed;background:#c96a2c}
.btn small{display:block;font-family:"Nunito",sans-serif;font-weight:800;font-size:.78rem;opacity:.95}
.btn.ghost{background:rgba(255,255,255,.12);border-color:#fff;box-shadow:none;backdrop-filter:blur(4px);transition:background .2s,transform .2s}
.btn.ghost:hover{background:rgba(255,255,255,.25);transform:translateY(-2px)}
.ea-note{max-width:40rem;margin:1.6rem auto 0;font-size:.95rem;font-weight:700;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.byline{margin:.8rem 0 0;font-weight:900;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;text-shadow:0 2px 6px rgba(0,0,0,.8)}
.scroll-cue{position:absolute;bottom:1.4rem;left:50%;width:30px;height:48px;margin-left:-15px;border:3px solid var(--brown);border-radius:16px;opacity:.75}
.scroll-cue span{position:absolute;left:50%;top:8px;width:5px;height:9px;margin-left:-2.5px;border-radius:3px;background:var(--brown);animation:cue 1.8s infinite}

/* sections */
section{padding:5.5rem 0;position:relative}
.kicker{display:inline-block;font-weight:900;text-transform:uppercase;letter-spacing:.14em;font-size:.82rem;color:var(--orange-d);margin:0 0 .5rem;padding-left:2.2rem;position:relative}
.kicker::before{content:"";position:absolute;left:0;top:50%;width:1.6rem;height:3px;border-radius:2px;background:currentColor}
section h2{font-size:clamp(2.1rem,5.2vw,3.6rem);font-weight:700;letter-spacing:-.01em}
.intro{max-width:46rem;font-size:1.15rem;margin:0 0 2.4rem}

/* trailer */
.trailer{padding-top:2rem;text-align:center}
.trailer .kicker{padding-left:0}.trailer .kicker::before{display:none}
.video-frame{position:relative;max-width:980px;margin:1.6rem auto 0;border-radius:26px;padding:10px;background:linear-gradient(135deg,var(--water),var(--glass) 40%,var(--sand) 75%,var(--orange));box-shadow:0 30px 60px -25px rgba(22,32,45,.6)}
.video-frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:18px;background:var(--night);object-fit:cover}
.video-soon{position:absolute;inset:10px;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;color:#fff;background:linear-gradient(180deg,rgba(22,32,45,.15),rgba(22,32,45,.7));pointer-events:none;transition:opacity .4s}
.video-soon.gone{opacity:0;visibility:hidden}
.play-ring{width:clamp(64px,10vw,96px);height:clamp(64px,10vw,96px);border-radius:50%;border:3px solid rgba(255,255,255,.9);background:rgba(255,255,255,.14);backdrop-filter:blur(4px);position:relative;margin-bottom:.6rem}
.play-ring::after{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:14px 0 14px 23px;border-color:transparent transparent transparent #fff;opacity:.9}
.soon-big{font-family:"Fredoka",sans-serif;font-weight:700;font-size:clamp(1.6rem,4vw,2.6rem);margin:0;text-shadow:0 3px 14px rgba(0,0,0,.7)}
.soon-small{margin:0;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.8)}
.video-note{font-size:.9rem;color:var(--muted);margin:1rem 0 0}

/* features */
.features{display:grid;grid-template-columns:repeat(2,1fr);gap:1.4rem}
.feature{position:relative;background:#fff;border:3px solid var(--brown);border-radius:var(--radius);padding:1.6rem 1.6rem 1.5rem;box-shadow:0 7px 0 #e9d6bb;transition:transform .25s,box-shadow .25s}
.feature:hover{transform:translateY(-4px);box-shadow:0 11px 0 #e9d6bb}
.feature h3{font-size:1.5rem}
.feature ul{margin:0;padding-left:1.2rem}
.feature li{margin-bottom:.4rem}
.feature li::marker{color:var(--orange)}
.feature p{margin:0}
.ficon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;margin-bottom:.9rem;border:3px solid var(--brown);background:var(--sand)}
.ficon svg{width:28px;height:28px;fill:none;stroke:var(--brown);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.f-village .ficon{background:#bfe3a8}.f-time .ficon{background:var(--glass)}.f-ages .ficon{background:#ffc9a3}.f-desk .ficon{background:#d9ccf2}
.feature.wide{grid-column:1/-1;display:flex;gap:1.3rem;align-items:center}
.feature.wide .ficon{flex:none;margin:0}

/* gallery */
.shots{background:linear-gradient(180deg,var(--night),var(--deep));color:#f3ece2}
.shots h2{color:#fff}.shots .kicker{color:var(--sand)}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:0;padding:0;list-style:none}
.gallery li.big{grid-column:span 2;grid-row:span 2}
.gallery figure{margin:0;height:100%;display:flex;flex-direction:column}
.gallery a{position:relative;display:block;flex:1;border-radius:16px;overflow:hidden;background:#24364a;box-shadow:0 0 0 2px rgba(255,255,255,.12),0 14px 30px -14px rgba(0,0,0,.7)}
.gallery picture,.gallery img{display:block;width:100%;height:100%}
.gallery img{object-fit:cover;aspect-ratio:16/9;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.gallery a:hover img,.gallery a:focus-visible img{transform:scale(1.06)}
.gallery a::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(22,32,45,.55));opacity:0;transition:opacity .3s}
.gallery a:hover::after,.gallery a:focus-visible::after{opacity:1}
.zoom{position:absolute;right:.7rem;bottom:.7rem;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);z-index:1;opacity:0;transform:scale(.8);transition:opacity .3s,transform .3s}
.zoom::before{content:"";position:absolute;left:10px;top:10px;width:12px;height:12px;border:3px solid var(--brown);border-radius:50%}
.zoom::after{content:"";position:absolute;left:23px;top:22px;width:3px;height:9px;background:var(--brown);transform:rotate(-45deg);border-radius:2px}
.gallery a:hover .zoom,.gallery a:focus-visible .zoom{opacity:1;transform:none}
.gallery figcaption{font-size:.88rem;color:#d7cfc4;margin-top:.45rem;line-height:1.4}

/* eras timeline */
.eras{background:radial-gradient(ellipse at 10% 0%,#fdebd0,transparent 50%),radial-gradient(ellipse at 90% 100%,#e3f3f4,transparent 50%),var(--paper)}
.timeline{list-style:none;margin:0;padding:0;position:relative}
.timeline::before{content:"";position:absolute;left:50%;top:10px;bottom:10px;width:6px;margin-left:-3px;border-radius:3px;background:linear-gradient(180deg,#9c8b7a,var(--orange) 30%,#7f8b96 52%,var(--brown) 60%,rgba(90,56,37,.2))}
.era{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:0 4.5rem;margin-bottom:2.6rem}
.era-marker{position:absolute;left:50%;top:1.4rem;width:52px;height:52px;margin-left:-26px;border-radius:50%;display:grid;place-items:center;font-family:"Fredoka",sans-serif;font-weight:700;font-size:1.35rem;color:#fff;background:var(--brown);border:4px solid var(--paper);box-shadow:0 0 0 3px var(--brown);z-index:1}
.era-flint .era-marker{background:#7d6d5e}.era-copper .era-marker{background:#c4612a}.era-iron .era-marker{background:#56606b}
.era-card{grid-column:1;background:#fff;border:3px solid var(--brown);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.era:nth-child(even) .era-card{grid-column:2}
.era-pic{display:block;overflow:hidden;aspect-ratio:16/9}
.era-pic picture,.era-pic img{display:block;width:100%;height:100%}
.era-pic img{object-fit:cover;transition:transform .5s}
.era-pic:hover img{transform:scale(1.05)}
.era-text{padding:1.1rem 1.4rem 1.3rem}
.era-text h3{font-size:1.9rem;margin-bottom:.25rem}
.era-text p{margin:0}
.era-no{font-weight:900;font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:.3rem!important}
.era-flint .era-card{border-top:10px solid #7d6d5e}.era-copper .era-card{border-top:10px solid #c4612a}.era-iron .era-card{border-top:10px solid #56606b}
.era-soon .era-marker{background:var(--paper);color:var(--brown);border-color:var(--paper);box-shadow:0 0 0 3px var(--brown) inset,0 0 0 3px var(--paper);border-style:dashed}
.soon-card{border-style:dashed;background:rgba(255,255,255,.7);box-shadow:none;display:flex;align-items:stretch}
.soon-art{flex:0 0 34%;display:grid;place-items:center;background:repeating-linear-gradient(135deg,#f4e6cf 0 14px,#efdcbf 14px 28px);border-right:3px dashed var(--brown)}
.soon-art span{font-family:"Fredoka",sans-serif;font-weight:700;font-size:2.8rem;color:var(--brown);opacity:.55}
.soon-badge{display:inline-block;margin-top:.5rem!important;font-weight:900;font-size:.85rem;color:#174c53;background:var(--glass);border:2px solid #7cc0c9;border-radius:999px;padding:.15rem .75rem}

/* early access */
.ea-sec{background:linear-gradient(135deg,#5a3825,#3a2418);color:var(--cream);overflow:hidden}
.ea-sec::before{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,138,61,.35),transparent 70%)}
.ea-sec h2{color:#fff}.ea-sec .kicker{color:var(--sand)}
.ea{max-width:52rem;position:relative}
.ea-box{background:rgba(255,246,230,.06);border:2px solid rgba(242,196,126,.45);border-radius:var(--radius);padding:1.8rem 1.8rem 1.6rem;font-size:1.1rem}
.ea-box p{margin-top:0}
.price-card{margin:1.4rem 0;padding:1.2rem 1.4rem;border-radius:16px;background:var(--cream);color:var(--ink);border:3px dashed var(--orange)}
.price{font-family:"Fredoka","Nunito",sans-serif;font-weight:700;font-size:clamp(1.35rem,3vw,1.9rem);color:var(--brown);margin:0 0 .2rem!important;line-height:1.2}
.small-note{font-size:.95rem;color:var(--muted);margin:0!important;font-weight:800}
.mb0{margin-bottom:0}

/* footer */
footer.site{background:var(--deep);color:#e9e1d6;padding:2.6rem 0;font-size:.95rem}
footer.site a{color:#ffd9a8}
footer.site p{margin:.2rem 0}
.foot-in{display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.foot-in > div:last-child{text-align:right}
.foot-mark{font-family:"Fredoka",sans-serif;font-weight:700;font-size:1.6rem;color:#fff}

/* lightbox */
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;margin:0}
.lightbox[open]{display:flex;align-items:center;justify-content:center}
.lightbox::backdrop{background:rgba(10,14,20,.9);backdrop-filter:blur(4px)}
.lightbox figure{margin:0;width:min(92vw,1280px);text-align:center}
.lightbox img{display:block;max-width:100%;max-height:80vh;width:auto;height:auto;margin:0 auto;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lightbox figcaption{color:#fff;margin-top:.8rem;font-weight:700}
.lb-btn{position:fixed;width:52px;height:52px;border-radius:50%;border:2px solid rgba(255,255,255,.7);background:rgba(255,255,255,.12);color:#fff;font-size:2rem;line-height:1;cursor:pointer;display:grid;place-items:center}
.lb-btn:hover{background:rgba(255,255,255,.28)}
.lb-close{top:1rem;right:1rem}
.lb-prev{left:1rem;top:50%;margin-top:-26px}.lb-next{right:1rem;top:50%;margin-top:-26px}

/* reveal: only hidden when JS is running and motion is allowed */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}
.js .era.reveal:nth-child(odd){transform:translate(-30px,10px)}.js .era.reveal:nth-child(even){transform:translate(30px,10px)}
.js .era.reveal.in{transform:none}

@keyframes drift{from{transform:scale(1.06) translate(0,0)}to{transform:scale(1.12) translate(-1.5%,-1%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(79,154,61,.7)}70%{box-shadow:0 0 0 9px rgba(79,154,61,0)}100%{box-shadow:0 0 0 0 rgba(79,154,61,0)}}
@keyframes cue{0%{transform:translateY(0);opacity:1}70%{transform:translateY(14px);opacity:0}100%{opacity:0}}

@media (max-width:980px){.gallery{grid-template-columns:repeat(2,1fr)}}
@media (max-width:860px){
 .features{grid-template-columns:1fr}
 .timeline::before{left:24px}
 .era{grid-template-columns:1fr;padding-left:68px;margin-bottom:1.8rem}
 .era-marker{left:24px;top:1rem;width:46px;height:46px;margin-left:-23px;font-size:1.15rem}
 .era-card,.era:nth-child(even) .era-card{grid-column:1}
 .js .era.reveal:nth-child(n){transform:translateY(20px)}
}
@media (max-width:640px){
 section{padding:3.8rem 0}
 .topbar ul{display:none}
 .hero-in{padding:5rem 1rem 5.5rem}
 .gallery{grid-template-columns:1fr}
 .gallery li.big{grid-column:auto;grid-row:auto}
 .feature.wide{display:block}.feature.wide .ficon{margin-bottom:.9rem}
 .soon-card{flex-direction:column}.soon-art{flex:none;height:70px;border-right:0;border-bottom:3px dashed var(--brown)}
 .foot-in > div:last-child{text-align:left}
 .lb-prev,.lb-next{top:auto;bottom:1rem;margin:0}
 .lb-prev{left:calc(50% - 64px)}.lb-next{right:calc(50% - 64px)}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .js .reveal,.js .era.reveal:nth-child(n){opacity:1;transform:none}
 .hero-bg img{transform:none}
}

/* sub pages */
.subhero{position:relative;isolation:isolate;overflow:hidden;color:#fff;text-align:center;padding:5.5rem 0 3.5rem;background:var(--night)}
.subhero .hero-bg img{object-fit:cover;object-position:center 40%}
.subhero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(22,32,45,.65),rgba(43,29,20,.7))}
.subhero .title{font-size:clamp(3rem,9vw,5.5rem);margin:0}
.subhero .title a{text-decoration:none}
.subhero .byline{margin-top:.4rem}
.prose{max-width:46rem}
.prose h1{font-size:clamp(2.2rem,5vw,3rem)}
.prose h2{font-size:1.55rem;margin-top:1.8em}
.back{margin-top:2.2rem}
.prose .btn{color:#fff}

/* layout refinements */
.gallery li.wide{grid-column:span 2}
.gallery li.wide img{aspect-ratio:auto}
@media (min-width:861px){
 .era + .era{margin-top:-11rem}
 .era-soon + .era-soon{margin-top:-4.5rem}
 .era-iron + .era-soon{margin-top:-6rem}
}
@media (max-width:640px){.gallery li.wide{grid-column:auto}.gallery li.wide img{aspect-ratio:16/9}.soon-small{font-size:.85rem}.video-soon{gap:0}.play-ring{margin-bottom:.3rem}}