.ewdt-scene { --scene-far: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22640%22 height=%22150%22 viewBox=%220 0 640 150%22%3E%3Cg fill=%22%232a3036%22%3E%3Crect x=%220%22 y=%2280%22 width=%2260%22 height=%2270%22/%3E%3Crect x=%2260%22 y=%2245%22 width=%2240%22 height=%22105%22/%3E%3Crect x=%22100%22 y=%2290%22 width=%2270%22 height=%2260%22/%3E%3Crect x=%22170%22 y=%2230%22 width=%2236%22 height=%22120%22/%3E%3Crect x=%22206%22 y=%2270%22 width=%2250%22 height=%2280%22/%3E%3Crect x=%22256%22 y=%22100%22 width=%2290%22 height=%2250%22/%3E%3Crect x=%22346%22 y=%2250%22 width=%2234%22 height=%22100%22/%3E%3Crect x=%22380%22 y=%2280%22 width=%2256%22 height=%2270%22/%3E%3Crect x=%22436%22 y=%2220%22 width=%2230%22 height=%22130%22/%3E%3Crect x=%22466%22 y=%2260%22 width=%2264%22 height=%2290%22/%3E%3Crect x=%22530%22 y=%2290%22 width=%2244%22 height=%2260%22/%3E%3Crect x=%22574%22 y=%2266%22 width=%2266%22 height=%2284%22/%3E%3Crect x=%22440%22 y=%2210%22 width=%224%22 height=%2230%22/%3E%3Crect x=%22420%22 y=%2226%22 width=%2246%22 height=%224%22/%3E%3Cpath d=%22M0 150V140%22 /%3E%3C/g%3E%3Cg fill=%22%23F47721%22 opacity=%22.5%22%3E%3Crect x=%2272%22 y=%2260%22 width=%225%22 height=%224%22/%3E%3Crect x=%22180%22 y=%2252%22 width=%225%22 height=%224%22/%3E%3Crect x=%22354%22 y=%2270%22 width=%225%22 height=%224%22/%3E%3Crect x=%22448%22 y=%2264%22 width=%225%22 height=%224%22/%3E%3C/g%3E%3C/svg%3E"); --scene-near: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22420%22 height=%22110%22 viewBox=%220 0 420 110%22%3E%3Cg fill=%22%23171a1d%22%3E%3Crect x=%2240%22 y=%2210%22 width=%226%22 height=%22100%22/%3E%3Crect x=%2240%22 y=%2210%22 width=%2240%22 height=%225%22/%3E%3Crect x=%22250%22 y=%2220%22 width=%226%22 height=%2290%22/%3E%3Crect x=%22250%22 y=%2220%22 width=%2236%22 height=%225%22/%3E%3Crect x=%220%22 y=%2286%22 width=%22420%22 height=%224%22/%3E%3Crect x=%220%22 y=%2274%22 width=%22420%22 height=%223%22/%3E%3Crect x=%220%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%2228%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%2256%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%2284%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22112%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22140%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22168%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22196%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22224%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22252%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22280%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22308%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22336%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22364%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3Crect x=%22392%22 y=%2272%22 width=%223%22 height=%2238%22/%3E%3C/g%3E%3Cg fill=%22%23F47721%22%3E%3Crect x=%2274%22 y=%2215%22 width=%2210%22 height=%225%22 rx=%222%22/%3E%3Crect x=%22280%22 y=%2225%22 width=%2210%22 height=%225%22 rx=%222%22/%3E%3C/g%3E%3C/svg%3E"); }
/* Home hero road scene. Pure CSS, transform/opacity only. Visible with JavaScript off.
   Applied by ewdt_hero_scene_filter() (inc/scene.php) to the home hero. */
.ewdt-hero--scene { background: var(--ink); display: flex; flex-direction: column; justify-content: center; align-items: stretch; }
.ewdt-hero--scene::before { display: block; background: linear-gradient(180deg, #2a2f34 0%, var(--ink) 78%); }
.ewdt-hero--scene::after { display: block; z-index: 0; background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .035) 0 2px, transparent 2px 26px); pointer-events: none; }
.ewdt-hero--scene { min-height: clamp(560px, 94svh, 940px); }
.ewdt-hero--scene .ewdt-hero__media, .ewdt-hero--scene .ewdt-hero__art, .ewdt-hero--scene .ewdt-hero__bg { display: none; }
.ewdt-hero--scene > :not(.ewdt-scene):not(.ewdt-hero__media) { position: relative; z-index: 2; }
.ewdt-hero--scene .ewdt-hero__grid { display: block; }
/* Direct children keep the site container (left gutter) even when they are flex items */
.ewdt-hero--scene > :not(.ewdt-scene):not(.ewdt-hero__media) { width: min(100% - 40px, var(--wrap)); margin-inline: auto; box-sizing: border-box; }
/* Stat boxes: left, under the buttons, same width as the copy column */
.ewdt-hero--scene .ewdt-stats { grid-template-columns: repeat(3, 1fr); width: min(100% - 40px, 520px); max-width: 520px; margin: 8px 0 64px; margin-left: max(20px, calc((100% - var(--wrap)) / 2)); margin-right: auto; border-radius: var(--radius); transform: none; position: relative; z-index: 2; }
.ewdt-hero--scene > :not(.ewdt-scene).ewdt-stats { width: min(100% - 40px, 520px); margin-left: max(20px, calc((100% - var(--wrap)) / 2)); margin-right: auto; }
.ewdt-hero--scene .ewdt-hero__grid .ewdt-stats, .ewdt-hero--scene .ewdt-hero__in .ewdt-stats { margin: 28px 0 0; }
.ewdt-hero--scene .ewdt-stats li, .ewdt-hero--scene .ewdt-stats > .ewdt-stat { padding: 16px 16px; }
.ewdt-hero--scene .ewdt-stats strong { font-size: 2.3rem; }
.ewdt-hero--scene .ewdt-stats span { font-size: .84rem; line-height: 1.35; }
.ewdt-hero--scene .ewdt-hero__in { position: relative; z-index: 2; }
.ewdt-hero--scene .ewdt-hero__copy { max-width: 590px; }
.ewdt-hero--scene .ewdt-hero__title { font-size: clamp(2.6rem, 4.6vw, 4.5rem); }

.ewdt-scene { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; width: 56%; overflow: hidden; pointer-events: none; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24%); mask-image: linear-gradient(90deg, transparent 0, #000 24%); }
.ewdt-scene__glow { position: absolute; inset: 0; background: radial-gradient(60% 55% at 66% 62%, rgba(244, 119, 33, .30), rgba(244, 119, 33, .08) 55%, transparent 75%), radial-gradient(50% 40% at 80% 20%, rgba(120, 150, 180, .12), transparent 70%); animation: ewdt-glow 6s ease-in-out infinite alternate; }
@keyframes ewdt-glow { from { opacity: .75; } to { opacity: 1; } }

/* Parallax skyline layers (slow far, faster near) */
.ewdt-scene__layer { position: absolute; left: 0; right: 0; overflow: hidden; }
.ewdt-scene__layer i { position: absolute; left: 0; top: 0; bottom: 0; width: calc(100% + 700px); background-repeat: repeat-x; background-position: left bottom; will-change: transform; }
.ewdt-scene__layer--far { bottom: 30%; height: 38%; opacity: .55; }
.ewdt-scene__layer--far i { background-image: var(--scene-far); background-size: 640px 100%; animation: ewdt-pan-far 70s linear infinite; }
.ewdt-scene__layer--near { bottom: 29%; height: 22%; opacity: .95; }
.ewdt-scene__layer--near i { background-image: var(--scene-near); background-size: 420px 100%; animation: ewdt-pan-near 4.4s linear infinite; }
@keyframes ewdt-pan-far { to { transform: translate3d(-640px, 0, 0); } }
@keyframes ewdt-pan-near { to { transform: translate3d(-420px, 0, 0); } }

/* Road: perspective plane, lane dashes move on the compositor */
.ewdt-scene__road { position: absolute; left: 0; right: 0; bottom: 0; height: 31%; perspective: 480px; perspective-origin: 50% -20%; overflow: hidden; }
.ewdt-road { position: absolute; inset: 0; transform-origin: 50% 0; transform: rotateX(34deg) scale(1.1, 1.25); background: linear-gradient(180deg, #202326 0%, #131517 55%, #0d0e0f 100%); box-shadow: inset 0 14px 22px -10px rgba(0, 0, 0, .8); }
.ewdt-road::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .025) 0 3px, transparent 3px 9px), radial-gradient(70% 90% at 60% 0%, rgba(244, 119, 33, .18), transparent 70%); }
.ewdt-road__edge { position: absolute; left: 0; right: 0; overflow: hidden; }
.ewdt-road__edge--top { top: 7%; height: 3.5%; background: #e9b52a; opacity: .85; }
.ewdt-road__edge--bottom { top: 90%; height: 2.4%; background: transparent; }
.ewdt-road__edge--bottom i, .ewdt-road__lane i { position: absolute; left: 0; top: 0; bottom: 0; width: calc(100% + 280px); will-change: transform; }
.ewdt-road__edge--bottom i { background: repeating-linear-gradient(90deg, rgba(240, 240, 235, .55) 0 140px, transparent 140px 280px); animation: ewdt-lane .62s linear infinite; }
.ewdt-road__lane { position: absolute; left: 0; right: 0; top: 46%; height: 6%; overflow: hidden; }
.ewdt-road__lane i { background: repeating-linear-gradient(90deg, #f3f2ec 0 120px, transparent 120px 280px); animation: ewdt-lane .62s linear infinite; }
@keyframes ewdt-lane { to { transform: translate3d(-280px, 0, 0); } }
.ewdt-road__sheen { position: absolute; left: 24%; right: 2%; top: 10%; height: 80%; background: radial-gradient(ellipse at 55% 30%, rgba(244, 119, 33, .42), transparent 68%); animation: ewdt-sheen 3.4s ease-in-out infinite alternate; }
@keyframes ewdt-sheen { from { opacity: .55; } to { opacity: 1; } }

/* Truck */
.ewdt-scene__truck { position: absolute; right: 2%; bottom: 6%; width: min(100%, 760px); animation: ewdt-drive-in 2.1s cubic-bezier(.16, 1, .3, 1) both; }
@keyframes ewdt-drive-in { from { transform: translate3d(-115%, 0, 0); } to { transform: none; } }
.ewdt-truck { display: block; width: 100%; height: auto; overflow: visible; filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .55)); }
.ewdt-wheel { transform-origin: 0 0; animation: ewdt-spin .58s linear infinite; }
@keyframes ewdt-spin { to { transform: rotate(360deg); } }
.ewdt-truck__rig { animation: ewdt-bob .5s ease-in-out infinite alternate; }
@keyframes ewdt-bob { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, -2.4px, 0); } }
.ewdt-truck__cab { transform-origin: 600px 238px; animation: ewdt-pitch 1.3s ease-in-out infinite alternate; }
@keyframes ewdt-pitch { from { transform: rotate(-.22deg); } to { transform: rotate(.28deg); } }
.ewdt-truck__box { transform-origin: 250px 238px; animation: ewdt-sway .9s ease-in-out infinite alternate; }
@keyframes ewdt-sway { from { transform: rotate(.08deg); } to { transform: rotate(-.14deg) translate3d(0, .8px, 0); } }
.ewdt-truck__beam { animation: ewdt-beam 2.6s ease-in-out infinite alternate; }
@keyframes ewdt-beam { from { opacity: .55; } to { opacity: .95; } }
.ewdt-truck__lamp { animation: ewdt-beam 2.6s ease-in-out infinite alternate; }
.ewdt-truck__shadow { transform-origin: 425px 318px; animation: ewdt-shadow .5s ease-in-out infinite alternate; }
@keyframes ewdt-shadow { from { transform: scaleX(1); opacity: .6; } to { transform: scaleX(.985); opacity: .5; } }
.ewdt-puff { opacity: 0; transform-origin: 513px 22px; animation: ewdt-puff 2.4s ease-out infinite; }
.ewdt-puff--2 { animation-delay: .8s; }
.ewdt-puff--3 { animation-delay: 1.6s; }
@keyframes ewdt-puff { 0% { opacity: 0; transform: translate3d(0, 0, 0) scale(.6); } 15% { opacity: .35; } 100% { opacity: 0; transform: translate3d(-34px, -40px, 0) scale(2.6); } }

/* Dust kicked up behind the rear wheels */
.ewdt-scene__dust { position: absolute; right: calc(2% + min(100%, 760px) * .87); bottom: calc(6% + 8px); width: 0; height: 0; }
.ewdt-scene__dust i { position: absolute; left: 0; bottom: 0; width: 22px; height: 22px; border-radius: 50%; background: radial-gradient(circle, rgba(200, 190, 175, .4), transparent 70%); opacity: 0; animation: ewdt-dust 2.1s ease-out infinite; }
.ewdt-scene__dust i:nth-child(2) { animation-delay: .35s; }
.ewdt-scene__dust i:nth-child(3) { animation-delay: .7s; }
.ewdt-scene__dust i:nth-child(4) { animation-delay: 1.05s; }
.ewdt-scene__dust i:nth-child(5) { animation-delay: 1.4s; }
.ewdt-scene__dust i:nth-child(6) { animation-delay: 1.75s; }
@keyframes ewdt-dust { 0% { opacity: 0; transform: translate3d(0, 0, 0) scale(.5); } 20% { opacity: .8; } 100% { opacity: 0; transform: translate3d(-120px, -22px, 0) scale(3); } }

.ewdt-scene.is-paused, .ewdt-scene.is-paused * { animation-play-state: paused !important; }

/* Older hero markup (grid wrapper) keeps clear of the transparent header */
.mo.mo-overlap .ewdt-hero--scene .ewdt-hero__grid { padding-top: calc(var(--hh) + 64px); padding-bottom: 24px; }

/* Tablet */
@media (max-width: 1100px) {
	.ewdt-hero--scene .ewdt-hero__copy { max-width: 480px; }
	.ewdt-hero--scene .ewdt-hero__title { font-size: clamp(2.3rem, 4.8vw, 3.2rem); }
	.ewdt-scene { width: 52%; }
	.ewdt-scene__truck { width: 98%; right: 1%; }
}

/* Mobile: copy first, smaller scene beneath */
@media (max-width: 860px) {
	.ewdt-hero--scene { display: flex; flex-direction: column; align-items: stretch; }
	.ewdt-hero--scene > :not(.ewdt-scene) { order: 1; }
	.ewdt-hero--scene > :not(.ewdt-scene).ewdt-stats { margin-left: 16px; margin-right: 16px; margin-bottom: 8px; width: calc(100% - 32px); max-width: none; }
	.ewdt-hero--scene .ewdt-hero__copy { max-width: none; }
	.ewdt-hero--scene, .ewdt-hero--home.ewdt-hero--scene { min-height: 0; }
	.ewdt-hero--scene .ewdt-hero__in, .mo .ewdt-hero--scene .ewdt-hero__in { padding: 44px 0 4px; }
	.mo.mo-overlap .ewdt-hero--scene .ewdt-hero__in, .mo.mo-overlap .ewdt-hero--scene .ewdt-hero__grid { padding-top: calc(var(--hh) + 26px); padding-bottom: 4px; }
	.ewdt-hero--scene .ewdt-hero__grid { padding: 44px 0 4px; }
	.ewdt-scene { order: 2; position: relative; z-index: 1; width: 100%; height: 215px; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%); mask-image: linear-gradient(180deg, transparent 0, #000 22%); }
	.ewdt-scene__truck { width: min(88%, 420px); right: 6%; bottom: 8%; }
	.ewdt-scene__layer--far { height: 50%; }
	.ewdt-scene__layer--near, .ewdt-scene__dust i:nth-child(n+4) { display: none; }
	.ewdt-scene__dust { right: calc(6% + min(88%, 420px) * .87); }
	.ewdt-scene__road { height: 34%; }
}
@media (prefers-reduced-motion: reduce) {
	.ewdt-scene, .ewdt-scene * { animation: none !important; }
	.ewdt-scene__truck { transform: none; }
	.ewdt-scene__dust, .ewdt-puff { display: none; }
}
