.dc-hero{padding-block:clamp(48px,7vw,96px) 0;overflow:hidden}
.dc-hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:end}
.dc-hero__copy{padding-bottom:clamp(32px,5vw,72px)}
.dc-hero h1{margin:0 0 22px;max-width:12ch}
.dc-hero__lead{font-size:clamp(1.04rem,1.35vw,1.18rem);max-width:50ch;margin:0}
.dc-trackbox{margin-top:36px;max-width:520px;padding:18px;background:color-mix(in srgb,var(--fg) 6%,transparent);border-left:4px solid var(--dc-signal)}
.dc-trackbox label{display:block;margin-bottom:10px;font:600 .74rem var(--dc-f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg)}
.dc-trackbox__row{display:flex}
.dc-trackbox input{flex:1;min-width:0;min-height:52px;padding:0 16px;border:1px solid var(--rule);border-right:0;border-radius:var(--dc-btn-radius) 0 0 var(--dc-btn-radius);background:var(--dc-surface);color:var(--dc-heading);font:500 .95rem var(--dc-f-mono);letter-spacing:.04em}
.dc-trackbox input[aria-invalid="true"]{outline:2px solid var(--dc-primary)}
.dc-trackbox .dc-btn{width:auto;flex:none;min-height:52px;padding:0 18px;border-radius:0 var(--dc-btn-radius) var(--dc-btn-radius) 0}
.dc-trackbox .dc-btn svg{width:20px;height:20px}
.dc-hero__visual{position:relative;align-self:end}
.dc-hero__image{aspect-ratio:15/13}
.dc-stack{width:100%;height:auto;display:block;overflow:visible}
.dc-stack__ground{fill:color-mix(in srgb,var(--fg) 30%,transparent)}
.dc-box rect:first-child{fill:var(--box)}
.dc-box__door{fill:none;stroke:rgba(0,0,0,.28);stroke-width:2}
.dc-box text{font:500 9px var(--dc-f-mono);fill:rgba(255,255,255,.85);letter-spacing:.04em}
.dc-box--c1{--box:var(--dc-primary)}.dc-box--c2{--box:var(--dc-blue)}.dc-box--c3{--box:var(--dc-green)}.dc-box--c4{--box:var(--dc-signal)}
.dc-box--c4 text{fill:rgba(0,0,0,.6)}
.dc-truck__wheels circle{fill:#1B1F24;stroke:color-mix(in srgb,var(--fg) 60%,transparent);stroke-width:4}
.dc-truck__cab{fill:var(--dc-blue)}
.dc-truck__glass{fill:color-mix(in srgb,var(--bg) 70%,#9fb4c8)}
.dc-truck__chassis{fill:color-mix(in srgb,var(--fg) 55%,transparent)}
.dc-crane__leg,.dc-crane__boom{fill:var(--dc-signal)}
.dc-crane__cabin{fill:color-mix(in srgb,var(--dc-signal) 70%,#000)}
.dc-crane__brace{fill:none;stroke:var(--dc-signal);stroke-width:4}
.dc-trolley__body{fill:color-mix(in srgb,var(--dc-signal) 65%,#000)}
.dc-trolley circle{fill:var(--fg)}
.dc-cable{fill:color-mix(in srgb,var(--fg) 75%,transparent);transform-box:fill-box;transform-origin:top}
.dc-spreader rect{fill:var(--dc-signal)}
/* Static pose (reduced motion or animations off): container hanging over the stack */
.dc-trolley{transform:translateX(280px)}
.dc-cable{transform:scaleY(200)}
.dc-spreader{transform:translateY(200px)}
.dc-move{transform:translate(440px,278px)}
{% if theme.effects.animations %}@media (prefers-reduced-motion:no-preference){
  .dc-trolley,.dc-cable,.dc-spreader,.dc-move{animation:12s cubic-bezier(.45,0,.55,1) infinite alternate both}
  .dc-trolley{animation-name:dc-trolley}
  .dc-cable{animation-name:dc-cable}
  .dc-spreader{animation-name:dc-spreader}
  .dc-move{animation-name:dc-move}
}
@keyframes dc-trolley{0%,26%{transform:translateX(0)}50%,100%{transform:translateX(280px)}}
@keyframes dc-cable{0%,8%{transform:scaleY(326)}26%,50%{transform:scaleY(42)}68%,76%{transform:scaleY(256)}92%,100%{transform:scaleY(180)}}
@keyframes dc-spreader{0%,8%{transform:translateY(326px)}26%,50%{transform:translateY(42px)}68%,76%{transform:translateY(256px)}92%,100%{transform:translateY(180px)}}
@keyframes dc-move{0%,8%{transform:translate(160px,404px)}26%{transform:translate(160px,120px)}50%{transform:translate(440px,120px)}68%,100%{transform:translate(440px,334px)}}{% endif %}
.dc-hero__proof{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));margin:0;border-top:1px solid var(--rule)}
.dc-hero__proof{--n:3}
.dc-hero__proof div{display:flex;flex-direction:column-reverse;padding:22px 24px 26px;border-right:1px solid var(--rule);position:relative}
.dc-hero__proof div::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:4px;background:var(--edge)}
.dc-hero__proof div:last-child{border-right:0}
.dc-hero__proof dd{margin:0;font:800 clamp(1.8rem,3vw,2.6rem)/1 var(--dc-f-head);letter-spacing:-.02em;color:var(--fg)}
.dc-hero__proof dt{margin-top:8px;font:500 .74rem var(--dc-f-mono);letter-spacing:.08em;text-transform:uppercase}
@media (max-width:1023px){.dc-hero__grid{grid-template-columns:1fr}.dc-hero__copy{padding-bottom:0}.dc-hero__visual{max-width:640px}}
@media (max-width:600px){.dc-hero__proof{grid-template-columns:1fr}.dc-hero__proof div{border-right:0;border-bottom:1px solid var(--rule)}}
