:root{--sky:#8EC9FF;--ink:#24124A;--pink:#FF4F9A;--sun:#FFC83D;--lilac:#B9A6FF;--pine:#1E8F6E;--snow:#FFFFFF;--px:"Pixelify Sans",system-ui,sans-serif;--sans:"Figtree",system-ui,sans-serif}
*{box-sizing:border-box}
body{overflow-x:clip;min-height:100vh;display:flex;flex-direction:column;margin:0;background:var(--snow);color:var(--ink);font:400 1.125rem/1.6 var(--sans)}
a{color:inherit}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px}
h1,h2,h3{font-family:var(--px);font-weight:600;line-height:1.05;margin:0 0 .5em}
h2{font-size:clamp(2rem,5vw,3rem)}
.wrap{max-width:68rem;margin:0 auto;padding:0 1rem}
.nav{position:absolute;inset:0 0 auto;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:1rem clamp(1rem,4vw,2.5rem)}
.logo{font:600 1.5rem var(--px);text-decoration:none;display:flex;gap:.5rem;align-items:center}
.logo svg{width:28px;height:28px}
.nav .go{font:500 1.1rem var(--px);text-decoration:none;background:var(--ink);color:var(--snow);padding:.4rem .9rem;box-shadow:4px 4px 0 var(--pink)}
.hero{position:relative;min-height:min(92vh,56rem);overflow:hidden;background:var(--sky)}
.hill{position:absolute;inset:0;width:100%;height:100%}
.hero-copy{position:relative;z-index:1;max-width:62rem;padding:clamp(5.5rem,12vh,8rem) clamp(1rem,4vw,2.5rem) 0}
.hero h1{text-wrap:balance;font-size:clamp(2.75rem,7vw,5rem);letter-spacing:-.01em;margin:0 0 .3em;text-shadow:4px 4px 0 var(--snow)}
.hero p{font-size:1.25rem;max-width:30rem;margin:0;text-shadow:0 0 3px var(--snow),0 0 8px var(--snow),0 0 14px var(--snow)}
section{padding:clamp(4rem,10vw,7rem) 0}
.lore{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.lore .body{max-width:36rem}
.day{background:var(--ink);color:var(--snow)}
.day ol{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.day li{padding:1.5rem 1.25rem 0 0;border-top:4px dashed var(--lilac);position:relative}
.day li::before{content:"";position:absolute;top:-14px;left:0;width:12px;height:12px;background:var(--sun);box-shadow:4px 4px 0 var(--pink)}
.day li:last-child::before{background:var(--pink);box-shadow:4px 4px 0 var(--sun)}
.day time{display:block;font:600 1.75rem var(--px);color:var(--sun);margin-bottom:.3rem}
.day h3{font-size:1.25rem;margin-bottom:.35rem}
.day p{margin:0;font-size:1rem;color:#DCD3FF}
.runs ul{list-style:none;padding:0;margin:2.5rem 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:2rem 3rem}
.runs li{display:grid;grid-template-columns:3rem 1fr;gap:1rem;align-items:start}
.runs h3{font-size:1.4rem;margin:0 0 .25rem}
.runs p{margin:0;font-size:1rem}
.runs svg{width:3rem;height:3rem}
.runs .lead{max-width:36rem}
.brief{background:var(--sky);position:relative}
.brief .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(2rem,6vw,5rem)}
.brief form{display:grid;grid-template-columns:1fr 1fr;gap:1rem;background:var(--snow);padding:1.5rem;box-shadow:8px 8px 0 var(--ink)}
.brief label{display:grid;gap:.3rem;font-weight:600;font-size:.95rem}
.brief .full{grid-column:1/-1}
.brief input,.brief textarea,.brief select{width:100%;min-width:0;font:inherit;font-weight:400;padding:.6rem .7rem;border:2px solid var(--ink);border-radius:0;background:var(--snow);color:var(--ink)}
.brief button{grid-column:1/-1;justify-self:start;font:600 1.3rem var(--px);background:var(--pink);color:var(--snow);border:0;padding:.7rem 1.4rem;box-shadow:4px 4px 0 var(--ink);cursor:pointer}
.brief button:active{transform:translate(4px,4px);box-shadow:none}
.page{max-width:40rem;margin:0 auto;padding:9rem 1rem 6rem}
.page h1{font-size:clamp(2.5rem,7vw,4.5rem)}
footer{background:var(--ink);color:#DCD3FF;padding:2rem 0;font-size:.9rem}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}
@media (max-width:52rem){.lore,.brief .wrap{grid-template-columns:1fr}.day ol{grid-template-columns:1fr;border-left:4px dashed var(--lilac);margin-left:6px}.day li{border-top:0;padding:0 0 2rem 1.75rem}.day li::before{top:.55rem;left:-10px}.hero-copy{padding-top:6rem}}
@media (max-width:30rem){.brief form{grid-template-columns:1fr}}
main{flex:1}
.cloud{animation:drift 40s ease-in-out infinite alternate}
.cloud:nth-of-type(2){animation-duration:55s;animation-direction:alternate-reverse}
@keyframes drift{to{transform:translateX(10px)}}
.flake{animation:fall 11s steps(96) infinite}
@keyframes fall{to{transform:translate(5px,96px)}}
@media (prefers-reduced-motion:reduce){.cloud,.flake{animation:none}.flake{display:none}}

.rider{position:absolute;top:0;left:0;z-index:3;pointer-events:none;will-change:transform}
.rider svg{display:block;width:100%;height:100%}
.rider.small svg{filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff)}
.page h2{font-size:1.5rem;margin-top:2.2rem}