#dolly{--logo:url(logo-11.png);--ar:2116 / 428;--grade:52%;--lw:min(56vw,780px);--cutH:40vh;
--noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
--clump:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .05' numOctaves='4' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1.2 -.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
--s1:#6f7f8c;--s2:#c9a27a;--s3:#e9b77f;--sunY:70%;--sunA:1;--night:0;--lamp:0}
#dolly *{box-sizing:border-box;margin:0}
.dh-track{height:460vh}
#dolly{position:sticky;top:0;height:100vh;overflow:hidden;background:#000}
#dolly .scene{position:absolute;inset:0;transform-origin:50% 70%;will-change:transform}
#dolly .sky{position:absolute;inset:0;background:linear-gradient(var(--s1) 0%,var(--s2) calc(var(--grade) - 12%),var(--s3) var(--grade))}
#dolly .sun{position:absolute;left:68%;top:var(--sunY);width:46vmin;height:46vmin;transform:translate(-50%,-50%);border-radius:50%;opacity:var(--sunA);background:radial-gradient(rgba(255,226,170,.95) 0 3%,rgba(255,190,120,.45) 9%,rgba(255,160,90,.12) 30%,transparent 62%)}
#dolly .stars{position:absolute;inset:0 0 50% 0;opacity:calc(var(--night)*.8);background-image:radial-gradient(1px 1px at 12% 20%,#fff,transparent),radial-gradient(1px 1px at 33% 12%,#fff,transparent),radial-gradient(1px 1px at 58% 25%,#fff,transparent),radial-gradient(1px 1px at 80% 8%,#fff,transparent),radial-gradient(1px 1px at 91% 30%,#fff,transparent),radial-gradient(1px 1px at 45% 6%,#fff,transparent)}
#dolly .hz{position:absolute;left:-5%;right:-5%;bottom:calc(100% - var(--grade));height:20vh;filter:blur(.6px)}
#dolly .hz svg{width:100%;height:100%}
#dolly .hz.far{opacity:.32}
#dolly .hz.near{opacity:.55;height:14vh}
#dolly .haze{position:absolute;left:0;right:0;bottom:calc(100% - var(--grade) - 2vh);height:12vh;background:linear-gradient(transparent,rgba(233,190,140,.35) 70%,transparent);mix-blend-mode:screen}
#dolly .ground{position:absolute;left:0;right:0;top:var(--grade);height:120vh;background:linear-gradient(#3b3026 0 3%,#4a3a2c 3% 14%,#5d4834 14% 15%,#6a5640 15% 33%,#8b7556 33% 35%,#a08a68 35% 52%,#7d6c57 52% 70%,#5a4e44 70% 100%)}
#dolly .ground:before{content:"";position:absolute;inset:0;background:var(--clump);background-size:600px 300px;opacity:.55;mix-blend-mode:multiply}
#dolly .ground:after,#dolly .tex:after{content:"";position:absolute;inset:0;background:var(--noise);opacity:.35;mix-blend-mode:overlay;pointer-events:none}
#dolly .grass{position:absolute;left:0;right:0;top:calc(var(--grade) - 4px);height:8px;background:linear-gradient(#3c3a24,#2d2a1d);filter:blur(.5px)}
#dolly .lbl{position:absolute;left:18px;font:500 10px/1 "SF Mono",Menlo,monospace;letter-spacing:.14em;color:rgba(255,240,220,.5);text-transform:uppercase}
#dolly .cutw{position:absolute;left:50%;top:var(--grade);transform:translateX(-50%);width:calc(var(--lw)*1.28);height:var(--cutH)}
#dolly .cut{position:absolute;inset:0;background:linear-gradient(#1c1612,#2b2119 30%,#3a2d22 46%,#b8a17c 46%,#9f8a69);clip-path:polygon(0 0,100% 0,94% 26%,97% 26%,90% 100%,10% 100%,3% 26%,6% 26%)}
#dolly .cut:after{content:"";position:absolute;inset:0;background:var(--noise);opacity:.5;mix-blend-mode:overlay}
#dolly .cut .sh{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55),transparent 25%,transparent 70%,rgba(0,0,0,.35)),linear-gradient(transparent 46%,rgba(0,0,0,.45) 50%,transparent 62%)}
#dolly .lpos{position:absolute;z-index:2;left:50%;top:calc(var(--grade) + var(--cutH)*.73);transform:translate(-50%,-50%);width:var(--lw);aspect-ratio:var(--ar)}
#dolly .m{position:absolute;inset:0;-webkit-mask:var(--logo) center/100% 100% no-repeat;mask:var(--logo) center/100% 100% no-repeat}
#dolly .voidw{position:absolute;inset:0;filter:drop-shadow(0 -1px 0 rgba(255,230,190,.35)) drop-shadow(0 4px 4px rgba(0,0,0,.7))}
#dolly .void{background:radial-gradient(ellipse at 50% 0%,#2a2018,#0a0806 65%)}
#dolly .formw{position:absolute;inset:0;filter:drop-shadow(4px 0 0 #8d6a42) drop-shadow(-4px 0 0 #8d6a42) drop-shadow(0 4px 0 #7a5a37) drop-shadow(0 -4px 0 #a07c50) drop-shadow(0 2px 3px rgba(0,0,0,.6))}
#dolly .fs{background:#000}
#dolly .rebar{background:repeating-linear-gradient(0deg,transparent 0 11px,rgba(92,52,30,.95) 11px 13px),repeating-linear-gradient(90deg,transparent 0 11px,rgba(110,62,36,.95) 11px 13px)}
#dolly .wet{background:linear-gradient(#77736c,#5f5b55)}
#dolly .wet:after,#dolly .conc:after{content:"";position:absolute;inset:0;background:var(--noise);opacity:.5;mix-blend-mode:overlay}
#dolly .conc{background:linear-gradient(#cdc8be,#aaa59b)}
#dolly .logo{position:absolute;inset:0;background:var(--logo) center/100% 100% no-repeat;filter:drop-shadow(0 1px 0 rgba(255,255,255,.15))}
#dolly .mach{position:absolute;bottom:calc(100% - var(--grade) - 3px);filter:drop-shadow(0 6px 6px rgba(0,0,0,.45))}
#dolly #exc{width:clamp(150px,19vw,280px)}
#dolly #truck{width:clamp(220px,30vw,430px);overflow:visible}
#dolly #worker{width:clamp(22px,2.6vw,38px)}
#dolly .pour{position:absolute;width:9px;border-radius:4px;background:linear-gradient(90deg,#55524c,#9a958c 45%,#6a665f);filter:blur(.4px)}
#dolly .pour:after{content:"";position:absolute;left:-14px;right:-14px;bottom:-8px;height:16px;border-radius:50%;background:radial-gradient(#8a857c,transparent 70%)}
#dolly .grade{position:absolute;left:0;right:0;top:var(--grade);height:1px;background:rgba(255,200,150,.35)}
#dolly .grade span{position:absolute;right:18px;top:-16px;font:500 10px Menlo,monospace;letter-spacing:.2em;color:rgba(255,220,180,.7)}
#dolly .dusk{position:absolute;z-index:1;inset:0;background:#0b1424;opacity:calc(var(--night)*.55);mix-blend-mode:multiply;pointer-events:none}
#dolly .lights{position:absolute;inset:0;pointer-events:none;opacity:var(--lamp)}
#dolly .vig{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 55%,transparent 45%,rgba(0,0,0,.55));pointer-events:none}
#dolly .grain{position:absolute;inset:-50%;background:var(--noise);opacity:.12;pointer-events:none;animation:dhg 1s steps(4) infinite}
@keyframes dhg{0%{transform:translate(0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-1%,-2%)}}
#dolly .copy{position:absolute;left:5vw;top:calc(58px + 3vh);max-width:min(760px,90vw);z-index:5;text-shadow:0 1px 12px rgba(0,0,0,.35)}
#dolly .eb{font:600 11px Menlo,monospace;letter-spacing:.28em;color:#f0a35e;text-transform:uppercase}
#dolly h1{font-size:clamp(28px,4.4vw,64px);line-height:1;font-weight:700;letter-spacing:-.02em;margin:.3em 0;color:#fbf6ee}
#dolly .copy h2{font-size:clamp(16px,1.7vw,24px);font-weight:500;color:#f0c79a;margin:.1em 0 .5em;letter-spacing:-.01em}
#dolly .cap{font:600 11px Menlo,monospace;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,240,220,.75);min-height:1.2em}
#dolly .copy p{font-size:clamp(13px,1.15vw,16px);line-height:1.5;color:rgba(255,245,230,.82)}
#dolly .cta-row{margin-top:18px;display:flex;gap:10px}
#dolly .cta-row a{font-size:13px;font-weight:600;padding:11px 18px;border-radius:2px;text-decoration:none}
#dolly .cta-row .a1{background:#e1661f;color:#fff}
#dolly .cta-row .a2{border:1px solid rgba(255,255,255,.6);color:#fff}
#dolly .bar{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;gap:4px;z-index:9;background:rgba(10,8,6,.55);padding:5px;border-radius:999px;backdrop-filter:blur(8px)}
#dolly .bar button{font:600 10px Menlo,monospace;letter-spacing:.12em;border:0;border-radius:999px;padding:8px 12px;background:transparent;color:#ddd;cursor:pointer;text-transform:uppercase}
#dolly .bar button.on{background:#e1661f;color:#fff}
#dolly .tag{display:none;position:absolute;right:18px;top:62px;z-index:9;font:500 10px Menlo,monospace;letter-spacing:.18em;color:rgba(255,255,255,.55)}
#dolly .ruler{position:absolute;right:18px;top:var(--grade);height:var(--cutH);width:40px;border-right:1px solid rgba(255,230,200,.45);font:500 10px Menlo,monospace;color:rgba(255,230,200,.7);text-align:right;padding-right:6px;display:flex;flex-direction:column;justify-content:space-between}
@media (max-width:760px){#dolly{--lw:88vw;--cutH:30vh;--grade:54%}
#dolly .copy{left:6vw;right:6vw;top:66px}
#dolly .cta-row,#dolly .lbl,#dolly .ruler{display:none}
#dolly .bar button{padding:7px 7px;font-size:9px}}
@media (prefers-reduced-motion:reduce){#dolly *{transition:none!important;animation:none!important}}
#dolly{position:sticky;top:0;height:100vh;overflow:hidden;background:linear-gradient(#5d6c78,#6f7f8c);font-family:var(--body,"Helvetica Neue",Arial,sans-serif)}
.dh-track{height:100vh;position:relative}
.dh-track.scroll{height:640vh}
#dolly .copy{max-width:min(800px,90vw);top:calc(70px + 2vh)}
#dolly h1{font-family:var(--display,"Big Shoulders Display","Arial Narrow",sans-serif);font-weight:800;text-transform:uppercase;letter-spacing:.005em;line-height:.92;font-size:clamp(32px,3.9vw,62px)}
#dolly .copy h2{font-family:var(--body,inherit)}
#dolly .eb,#dolly .cap,#dolly .bar button{font-family:var(--mono,Menlo,monospace)}
#dolly .cta-row a{border-radius:999px;padding:12px 20px;font-size:14px}
#dolly .cta-row .a1{background:#e37125;color:#121210}
#dolly .bar button.on{background:#e37125;color:#121210}
#dolly .replay{position:absolute;right:18px;bottom:22px;z-index:9;font:600 10px var(--mono,Menlo,monospace);letter-spacing:.12em;text-transform:uppercase;background:rgba(10,8,6,.55);color:#ddd;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:8px 12px;cursor:pointer}
@media (max-width:760px){#dolly .replay{display:none}}

#dolly .copy h2{text-transform:none;font-family:var(--body,inherit)}
