/* Native-sized, proportionate artwork. Clear mobile composition. */
.race-page{max-width:793px;background:#fff2dc;color:#30231d}
.race-page>section{isolation:isolate}
.race-page .sketch-scene-art{position:absolute!important;top:auto!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;height:calc(100cqw * var(--reference-height) / 793)!important;max-height:none;overflow:hidden;opacity:1!important;z-index:-1;mask-image:linear-gradient(transparent,#000 24%)}
.race-page>.hero .sketch-scene-art{top:0!important;bottom:auto!important;mask-image:none}
.race-page>.hero{background:#716555;padding:22px 0 26px;min-height:0}
.car-stage{width:92%}.car-art{aspect-ratio:3/1;height:auto!important;object-fit:contain!important}
.car-copy h1{font-size:clamp(27px,4.6cqw,38px)}.car-copy p{font-size:18px}.date-control{font-size:17px}
#music-toggle{background:#fff5e4ef;font-size:16px}
.race-page h2{font-size:32px;line-height:1.18;margin-bottom:20px}
.race-page p{font-size:18px;line-height:1.6}
.intro{padding:42px 25% 95px 22%;min-height:300px}.intro p{line-height:1.6}.helmet-art{width:23%;right:2%;bottom:0;top:auto;margin:0;height:auto;max-width:none}
.date-scene{padding:22px 18% 48px;min-height:120px}.date-display strong{font:700 30px/1.3 Georgia}.date-display{margin:0}
.venue{padding:8px 0 45px;background:#fff2dc;min-height:0}
.garage{aspect-ratio:2/1;margin:0;overflow:visible}.garage-art{object-fit:contain!important;width:100%;height:100%;aspect-ratio:2/1}.garage h2{top:14%;font-size:34px;margin:0}.venue-photo{left:17.5%;top:34%;width:65%;height:49%;object-fit:cover}.photo-edit{top:58%}
.venue-copy{margin:0;padding:6px 13% 0;grid-template-columns:1fr auto;gap:10px 18px;background:none}.venue-copy h3{font-size:19px;line-height:1.4}.venue-copy p{font-size:17px;line-height:1.55}.venue-copy #map-link{min-height:46px;padding:10px 22px}
.program{padding:40px 18% 100px;min-height:0}.schedule{gap:16px;margin-top:22px}.schedule>div+div{padding-left:16px}.schedule strong{font-size:28px}.schedule p{font-size:17px;line-height:1.5}
.outfit{padding:38px 18% 100px 32%;min-height:0}.outfit p{max-width:none}.suit-art{width:28%;left:1%;bottom:8px;top:auto;height:auto}
.gallery-section{padding:38px 18% 70px;min-height:0}.public-gallery{margin:22px 0;gap:18px}.public-gallery figure{padding:0;background:none;box-shadow:none}.public-gallery img{border-radius:8px;height:auto}.gallery-tools button{font-size:16px}
.invitation-details{padding:42px 19% 95px 25%;min-height:0}.invitation-details h3{margin-top:24px}.invitation-details p{font-size:18px;line-height:1.6}.invitation-details p+p{margin-top:20px}
.invitation-rsvp{padding:42px 20% 100px;min-height:0}.invitation-rsvp h2{margin-bottom:18px}.rsvp-disclosure{margin-top:24px;max-width:100%;min-width:0}.rsvp-disclosure summary{font-size:18px;line-height:1.4;min-height:50px;padding:14px 24px}.rsvp-disclosure[open]{background:#fff5e6;padding:0 16px 16px}.rsvp-disclosure__panel{padding-top:20px}
.closing{padding:28px 12% 0;min-height:0;background:linear-gradient(#fff2dc,#f2d3a0)}.closing .sketch-scene-art{display:none}.closing>img{display:block!important;width:calc(100% + 32%);max-width:none;height:auto;margin:15px -16% 0;aspect-ratio:3/1}.closing h2{background:none;text-shadow:none;position:relative}.finish-checker{margin:18px auto 0}
footer{background:#fff6e8;padding:48px 16px 28px}
.editing [data-field]{outline-color:#a7402840}
@media(max-width:760px){
 .race-page{box-shadow:none}.hero{padding-top:52px!important;padding-bottom:24px!important}
 .race-page h2{font-size:29px;line-height:1.17;letter-spacing:0}
 .car-stage{width:100%}.car-art{width:100%;max-width:100%}
 .car-copy h1{font-size:clamp(20px,5.9vw,34px);width:45%;left:29%;top:calc(var(--car-height) * .51);line-height:1.05}
 .car-copy p{font:600 18px/1.45 Georgia;width:86%;margin:16px auto 0;padding:12px 16px 4px;background:#fff2dc;border-radius:18px 18px 0 0}
 .car-copy .date-control{width:86%;margin:0 auto;background:#fff2dc;padding:6px 12px 14px;border-radius:0 0 18px 18px;font-size:17px}
 .intro{padding:36px 24px 96px;min-height:0}.intro h2{max-width:245px;margin-inline:auto}.intro p{font-size:18px;max-width:285px;line-height:1.65;text-align:justify!important}.helmet-art{width:96px;right:14px;bottom:0;z-index:2}
 .date-scene{padding:24px 24px 40px;min-height:0}.date-display strong{font-size:27px}
 .venue{padding:6px 0 38px}.garage{aspect-ratio:2/1}.garage h2{font-size:clamp(22px,6.8vw,34px);top:14.5%}.garage-art{object-fit:contain!important}.venue-photo{left:17.5%;top:34%;width:65%;height:49%}.photo-edit{font-size:16px;padding:6px 10px;min-height:42px}.venue-copy{display:block;padding:8px 26px 0;text-align:center;margin:0}.venue-copy h3{font-size:20px}.venue-copy p{font-size:17px;margin:10px 0 18px}.venue-copy #map-link{font-size:17px}
 .program{padding:34px 28px 65px}.schedule{margin:24px 0 0;gap:20px;text-align:start}.schedule>div{grid-template-columns:68px minmax(0,1fr);gap:12px}.schedule>div+div{padding:20px 0 0}.schedule strong{font-size:25px;margin:0}.schedule p{font-size:18px;line-height:1.5}.schedule .step{display:none}
 .outfit{padding:34px 28px 108px;min-height:0}.outfit h2{font-size:29px}.outfit p{max-width:290px;font-size:18px;line-height:1.65}.suit-art{width:106px;left:14px;bottom:0;right:auto;height:auto}
 .gallery-section{padding:34px 24px 55px;min-height:0}.gallery-section h2{font-size:29px;max-width:250px;margin-inline:auto}.public-gallery{margin:22px 0;gap:14px}.public-gallery figure{border-radius:8px}.public-gallery img{border-radius:8px}.gallery-tools{gap:6px}
 .invitation-details{padding:36px 28px 62px;min-height:0}.invitation-details h2{font-size:29px}.invitation-details p{font-size:18px;line-height:1.65}.invitation-details h3{font-size:20px;margin-top:26px}.invitation-details p+p{margin-top:24px}
 .invitation-rsvp{padding:36px 28px 72px;min-height:0}.invitation-rsvp h2{font-size:29px}.invitation-rsvp #deadline-text{font-size:17px;line-height:1.6}.rsvp-disclosure{width:100%;margin-top:24px}.rsvp-disclosure summary{font-size:18px;padding:14px 20px}.rsvp-disclosure[open]{padding-inline:12px}
 .closing{padding:28px 24px 0;min-height:0}.closing h2{font-size:29px;margin:0 auto;max-width:270px}.closing>img{width:calc(100% + 48px);max-width:none;margin:22px -24px 0;aspect-ratio:3/1;height:auto}.finish-checker{margin-top:20px}
 .race-page .venue-ground{height:calc(100cqw * 70 / 793)!important;opacity:1!important}
}
/* Continuous textured circuit replaces the enlarged raster scene fragments. */
.race-page:before{display:block!important;content:'';position:absolute;inset:230px 0 0;background:url("assets/landscape.a5236929fb6e.webp") center top/100% auto no-repeat;z-index:0;pointer-events:none;opacity:.72;mask-image:linear-gradient(#000 85%,transparent)}
.race-page>section,.race-page>footer{position:relative;z-index:2}
.race-page>.intro,.race-page>.outfit{z-index:3}
.circuit-background{position:absolute;inset:0;z-index:1;pointer-events:none;width:100%;height:auto;overflow:visible}
.circuit-background path{fill:none;stroke-linejoin:round;stroke-linecap:round}
.circuit-background .track-shadow{stroke:#6d4d2929;stroke-width:var(--shadow-width)}
.circuit-background .track-shoulder{stroke:#fff5df;stroke-width:var(--shoulder-width)}
.circuit-background .track-curb{stroke:#b53f2a;stroke-width:var(--curb-width);stroke-dasharray:24 24;stroke-linecap:butt}
.circuit-background .track-surface{stroke:url(#asphalt-photo);stroke-width:var(--road-width);filter:none}
.circuit-background .track-edge{display:none}
.race-page>.hero{background:url("assets/asphalt.aa194468beb9.webp") center/320px 320px;padding-top:36px;padding-bottom:22px}
.hero:after{content:'';position:absolute;inset:auto 0 0;height:6px;background:repeating-linear-gradient(90deg,#b8402b 0 28px,#fff0d9 28px 56px);pointer-events:none}
.intro{padding-top:58px;padding-bottom:85px}.date-scene{padding-top:42px;padding-bottom:42px}
.program{padding-top:55px;padding-bottom:75px}.outfit{padding-top:50px;padding-bottom:65px}.gallery-section{padding-top:55px;padding-bottom:65px}
.invitation-details{padding-top:55px;padding-bottom:65px}.invitation-rsvp{padding-top:55px;padding-bottom:70px}
.venue{padding-top:18px;padding-bottom:50px;background:transparent}.venue-copy{position:relative;background:radial-gradient(ellipse,#fff2dc 65%,transparent 74%)}
.closing{padding-top:55px;background:linear-gradient(#fff2dc00,#fff2dc 22%,#f2d3a0)}
@media(max-width:760px){
 .race-page:before{background-size:100% auto;inset:220px 0 0;opacity:.35}
 .race-page>.hero{padding-top:52px;padding-bottom:24px}
 .intro{padding:52px 30px 112px}.helmet-art{bottom:4px;right:12px;width:100px}
 .date-scene{padding:35px 30px 43px}.date-display strong{font-size:27px}
 .venue{padding:12px 0 55px}.venue-copy{padding-top:10px;padding-inline:30px}
 .program{padding:50px 30px 60px}.outfit{padding:50px 30px 116px}.suit-art{bottom:4px;left:12px;width:106px}
 .gallery-section{padding:50px 28px 55px}.invitation-details{padding:50px 30px 60px}.invitation-rsvp{padding:52px 30px 65px}.closing{padding-top:48px}
}
.race-page>.hero{background-size:160px 160px}

/* The start straight and the circuit share one asphalt surface. */
.race-page>.hero{background:transparent}
.hero:after{display:none}
.circuit-background .track-apron{fill:url(#asphalt-photo);stroke:none}
.intro{padding-top:80px}
.date-scene{padding-top:58px;padding-bottom:58px}
@media(max-width:760px){
 .intro{padding-top:72px;padding-inline:38px}
 .date-scene{padding:52px 38px 58px}
 .program,.gallery-section,.invitation-details,.invitation-rsvp{padding-inline:38px;padding-top:64px;padding-bottom:76px}
 .outfit{padding-inline:38px;padding-top:64px}
}
/* Refinements from the annotated preview: larger props and centred programme. */
.race-page:before{background-size:100% 100%;bottom:220px;mask-image:linear-gradient(transparent,#000 5%,#000 92%,transparent)}
.helmet-art{width:clamp(140px,27cqw,225px);right:2%;bottom:2px}
.suit-art{width:clamp(148px,29cqw,240px);left:2%;bottom:2px}
.intro{padding-bottom:clamp(150px,21cqw,180px)}
.outfit{padding-bottom:clamp(150px,22cqw,185px)}
.schedule{text-align:center}
.schedule>div{justify-items:center;text-align:center}
.schedule p{text-align:center!important;hyphens:none}
.closing>img{margin-top:-24px}
.finish-checker{position:relative;z-index:2;margin-top:12px}
@media(max-width:760px){
 .schedule{width:min(100%,380px);margin-inline:auto}
 .schedule>div{grid-template-columns:minmax(0,1fr);gap:8px}
 .schedule strong,.schedule p{margin:0;text-align:center}
 .closing>img{margin-top:-18px}
}

/* Four distinct painted landscape sections, all at their natural proportions. */
.race-page:before{display:none!important}
.landscape-continuation{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.42}
.landscape-panel{position:absolute;left:0;width:100%;overflow:hidden;mask-image:linear-gradient(transparent,#000 45px,#000 calc(100% - 45px),transparent)}
.landscape-panel img{display:block;width:100%;height:auto;max-width:none}
@media(max-width:760px){.landscape-continuation{opacity:.35}}

/* Painted starting-grid box beneath the car, scaled without distortion. */
.starting-grid{position:absolute;left:0;top:-16px;width:100%;height:auto;aspect-ratio:5/2;color:#fff5df;opacity:.72;pointer-events:none;z-index:0}
.car-art{z-index:1}
.car-copy{z-index:2}
@media(max-width:760px){.starting-grid{top:-12px}}
.car-copy h1{z-index:2}
/* Clear space inside the wider circuit, including its tighter date bend. */
.race-page>.infield{padding-top:max(76px,10cqw)}
.race-page>.infield:not(.intro):not(.outfit){padding-bottom:max(90px,12cqw)}
.race-page>.date-scene{padding-block:max(76px,11cqw)}
.race-page>.venue{padding-bottom:max(74px,10cqw)}
.race-page>.closing{padding-top:max(65px,9cqw)}
@media(max-width:760px){.race-page>.infield{padding-inline:max(38px,8cqw)}}

.circuit-background .track-markings{stroke:#fff6df;stroke-width:3;stroke-dasharray:22 20;stroke-linecap:butt;opacity:.85}

/* Bring the opening together; turns continue outside the invitation canvas. */
.race-page{overflow:hidden}
.race-page>.hero{padding-bottom:0!important}
.race-page>.intro{padding-top:56px}
.race-page>.outfit{padding-bottom:58px}
.outfit .suit-art{position:relative;display:block;left:auto;right:auto;top:auto;bottom:auto;width:clamp(190px,42cqw,320px);height:auto;max-width:100%;margin:14px 0 0}

@media(max-width:760px){.car-copy .date-control{margin-top:12px;padding:12px;border-radius:18px}}
/* Slightly raise the canopy title. */
.garage h2{top:11.5%}
/* A single wave opens two large flags, with short poles at the outer sides. */
.opening-flags{position:absolute;inset:0 0 auto;height:var(--car-height);z-index:5;pointer-events:none;visibility:hidden;perspective:800px}
.opening-flag{position:absolute;width:66%;top:-24%;filter:drop-shadow(0 7px 5px #0004)}
.opening-flag svg{display:block;width:100%;height:auto;overflow:visible;transform-origin:50% 50%}
.opening-flag--left{left:-3%;transform-origin:5% 65%}
.opening-flag--right{right:-3%;transform-origin:95% 65%}
.opening-flag--left svg{transform:rotate(7deg)}
.opening-flag--right svg{transform:scaleX(-1) rotate(7deg)}
.flag-cloth{transform-origin:8% 35%}
.flags-opening .opening-flags{visibility:visible}
.flags-opening .opening-flag{animation:flag-sweep 2s cubic-bezier(.4,0,.2,1) both}
.flags-opening .opening-flag--right{animation-name:flag-sweep-right}
.flags-opening .flag-cloth{animation:flag-ripple 2s ease-in-out both}
.flags-opening .car-art,.flags-opening .car-copy h1{animation:car-unveil 2s ease-out both}
@keyframes flag-sweep{0%,12%{transform:translateX(0) rotate(0);opacity:1}32%{transform:translateX(2%) rotate(8deg);opacity:1}78%{opacity:1}100%{transform:translateX(-110%) rotate(-48deg);opacity:0}}
@keyframes flag-sweep-right{0%,12%{transform:translateX(0) rotate(0);opacity:1}32%{transform:translateX(-2%) rotate(-8deg);opacity:1}78%{opacity:1}100%{transform:translateX(110%) rotate(48deg);opacity:0}}
@keyframes flag-ripple{0%,100%{transform:skewY(0) scaleX(1)}32%{transform:skewY(-7deg) scaleX(.92)}65%{transform:skewY(6deg) scaleX(1.03)}}
@keyframes car-unveil{0%,22%{opacity:0}68%,100%{opacity:1}}
@media(prefers-reduced-motion:reduce){.opening-flags{display:none!important}.flags-opening .car-art,.flags-opening .car-copy h1{animation:none!important;opacity:1}}
/* Rolling garage shutter, clipped behind the painted canopy and posts. */
.pitstop-shutter-frame{position:absolute;left:17.5%;top:34%;width:65%;height:49%;overflow:hidden;z-index:1;pointer-events:none}
.pitstop-shutter{position:absolute;inset:0;transform:translateY(0);background:linear-gradient(90deg,#291b17a0,transparent 17%,#ffdaa621 48%,transparent 85%,#211810a0),repeating-linear-gradient(0deg,#746a5e 0px,#a79a87 3px,#c1b29b 5px,#918373 17px,#4e463e 19px,#3c3731 21px);border-bottom:6px solid #3c342c;box-shadow:0 8px 10px #130c0860;transition:transform 1.65s cubic-bezier(.4,0,.2,1);will-change:transform}
.pitstop-shutter-handle{position:absolute;bottom:9%;left:44%;width:12%;height:5%;min-height:4px;background:#322a24;border-radius:3px;box-shadow:0 1px 1px #e3d4b3}
.door-open .pitstop-shutter{transform:translateY(-105%)}
@media(prefers-reduced-motion:reduce){.pitstop-shutter-frame{display:none}.pitstop-shutter{transition:none}}
/* Two quiet side accents burst once as the closing enters view. */
.closing .closing-celebration{position:absolute;inset:0;z-index:3;pointer-events:none;transition:none!important;opacity:1!important;translate:none!important}
.closing-popper{position:absolute;top:145px;width:0;height:0}
.closing-popper--left{left:5%}
.closing-popper--right{right:5%}
.popper-tube{position:absolute;left:-10px;top:0;width:20px;height:42px;border-radius:3px 3px 6px 6px;background:repeating-linear-gradient(135deg,#a91f1b 0 9px,#ebbd60 9px 15px);border-top:4px solid #4e3423;box-shadow:2px 3px 5px #4c291d33;transform:rotate(28deg);transform-origin:50% 0}
.closing-popper--right .popper-tube{transform:rotate(-28deg)}
.confetti-piece{position:absolute;left:0;top:-5px;width:7px;height:11px;background:var(--color);opacity:0;border-radius:1px}
.confetti-ribbon{width:4px;height:22px;border-radius:40%}
.confetti-fired .confetti-piece{animation:closing-burst 4.8s var(--delay) linear both,confetti-sway 1.2s var(--delay) ease-in-out 4 alternate}
@keyframes closing-burst{
 0%{opacity:0;transform:translate(0,0) rotate(0);animation-timing-function:cubic-bezier(.15,.65,.35,1)}
 5%{opacity:1}
 20%{opacity:1;transform:translate(var(--x),var(--rise)) rotate(calc(var(--spin)*.35));animation-timing-function:cubic-bezier(.35,0,.65,1)}
 80%{opacity:1}
 100%{opacity:0;transform:translate(calc(var(--x)*1.3),var(--fall)) rotate(var(--spin))}
}
@keyframes confetti-sway{from{translate:-5px 0}to{translate:5px 0}}
@media(min-width:761px){.closing-popper{top:160px}.closing-popper--left{left:8%}.closing-popper--right{right:8%}}
@media(prefers-reduced-motion:reduce){.confetti-piece{display:none}.confetti-fired .confetti-piece{animation:none}}
/* Longer party-popper tubes with the same burst origin. */
.popper-tube{height:82px;transform:rotate(14deg)}
.closing-popper--right .popper-tube{transform:rotate(-14deg)}
/* Aim inward; the lower ends disappear beyond the page edges. */
.closing-popper--left{left:22px}
.closing-popper--right{right:22px}
.popper-tube{transform:rotate(32deg)}
.closing-popper--right .popper-tube{transform:rotate(-32deg)}