:root{--ease:cubic-bezier(.16,1,.3,1);--motion-time:720ms}
.hero-title-line{display:block;transform:translateX(var(--ink-offset,0px));text-align:left}
.story-image{display:block}
.story-image:focus-visible{outline-offset:-4px}
.card-rail{--visible-cards:4;display:block;overflow:clip;scroll-snap-type:none;scrollbar-width:none;padding-bottom:0;overscroll-behavior:auto;touch-action:pan-y}
.card-track{display:flex;gap:3px;width:100%;min-width:0;align-items:stretch;transition:transform .85s var(--ease)}
.card-track>.story-card{flex:0 0 calc((100% - (var(--visible-cards) - 1)*3px)/var(--visible-cards));min-width:0;scroll-snap-align:none}
@media(max-width:1049px){.card-rail{--visible-cards:3}
}
@media(max-width:800px){.card-rail{--visible-cards:2}
}
@media(max-width:599px){.card-rail{--visible-cards:1}
}
@media(max-width:1000px) and (min-width:801px){
}
@media(max-width:800px){
}
@media(max-width:480px){.impact-stat:nth-child(3) strong{font-size:clamp(15px,4vw,21px)}
.impact-stat:nth-child(5) strong{font-size:clamp(17px,4.55vw,24px)!important}
}
.inline-motion-link{display:inline-flex;align-items:center;gap:10px}
.inline-motion-link>span{display:inline-flex;align-items:center;justify-content:center;transition:transform .7s var(--ease)}
.inline-motion-link .icon{width:18px;height:18px}
.inline-motion-link:hover>span,.inline-motion-link:focus-visible>span{transform:translateX(5px)}
.story-cta>span{display:inline-flex;align-items:center;justify-content:center;line-height:1}
.popup-link .icon,.story-cta .icon{width:18px;height:18px}
.hero-bottom{right:24px;bottom:27px}
.hero-bottom-actions>.button.orbit-button{--disc:43px;min-height:43px}
.hero-bottom-actions>.orbit-button .orbit-label{min-width:120px}
.hero-backgrounds{z-index:0}
.hero-shade{z-index:1}
.hero-copy{z-index:2}
.hero-bottom{z-index:3}
.hero-scene{transition:none;will-change:auto;transform-origin:center;pointer-events:none}
.hero-scene.active{z-index:1}
.hero-scene>img,.hero-scene>video{transform:scale(1.016);animation:scene-drift 22s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:60% 45%}
.hero-scene.active>img{animation-play-state:running}
.hero-scene.has-video>img{animation-play-state:paused}
.hero.media-paused .hero-scene>img,.hero[data-transitioning] .hero-scene>img{animation-play-state:paused}
.hero[data-transitioning] .hero-scene{will-change:transform,opacity}
.hero-copy{transition:opacity .65s var(--ease),transform .85s var(--ease);transform:translate3d(0,0,0);animation:hero-soft-in 1.1s var(--ease) .12s backwards}
.hero-bottom{animation:hero-soft-in 1.1s var(--ease) .4s backwards}
.hero-copy.changing{transform:translate3d(0,22px,0);opacity:0}
.hotspot{transition:left 1.1s var(--ease),top 1.1s var(--ease),transform .6s var(--ease),opacity .5s var(--ease),box-shadow .6s var(--ease)}
.hotspot .hotspot-icon{width:20px;height:20px;transform:rotate(0deg);transform-origin:50% 50%;transition:transform .65s var(--ease)}
.hotspot[aria-expanded="true"] .hotspot-icon{transform:rotate(45deg)}
.hotspot:hover{box-shadow:0 0 0 7px #ffffff22,0 8px 25px #0001;transform:translate(-50%,-50%) scale(1.08)}
.hero[data-transitioning] .hotspot{opacity:0;pointer-events:none}
.product-popup{animation:popup-soft-in .6s var(--ease);transition:opacity .3s var(--ease),transform .45s var(--ease)}
.product-popup.closing{opacity:0;transform:translateY(9px);pointer-events:none}
.popup-link{transition:background-color .55s var(--ease),transform .65s var(--ease),box-shadow .65s var(--ease)}
.popup-link:hover{transform:translateY(-1px);box-shadow:0 7px 20px #00000008}
.scene-nav{gap:15px}
.scene-nav button{transition:color .7s var(--ease),opacity .7s var(--ease)}
.scene-nav button:before{transition:background-color .7s var(--ease),width .7s var(--ease)}
.scene-nav button .scene-name{display:inline-block;max-width:0;overflow:hidden;opacity:0;white-space:nowrap;transition:max-width .8s var(--ease),opacity .65s var(--ease)}
.scene-nav button[aria-current] .scene-name{max-width:115px;opacity:1}
.scene-nav button:hover{opacity:.75}
.scene-nav button[aria-current]:before{width:19px}
.street-pole{display:none}
.street-art>img{max-width:86%;width:86%;max-height:140px;transform:scaleX(-1) rotate(-3deg)}
.tile-art>.led-chip{width:190px;max-width:80%;max-height:160px;filter:drop-shadow(0 8px 5px #00000006)}
.product-tile:before{transition:opacity .8s var(--ease)}
.tile-art>img{transition:transform .95s var(--ease),filter .95s var(--ease)}
.product-tile>b{transition:opacity .65s var(--ease),transform .85s var(--ease)}
.product-tile:hover .tile-art>img,.product-tile:focus-visible .tile-art>img{transform:translateY(-4px) scale(1.025)}
.product-tile:hover .street-art>img,.product-tile:focus-visible .street-art>img{transform:translateY(-4px) scale(-1.025,1.025) rotate(-3deg)}
.story-image:after{transition:opacity .85s var(--ease)}
.story-image img{transition:transform 1.15s var(--ease)}
.story-card:hover .story-image img{transform:scale(1.025)}
.story-cta{transition:color .55s var(--ease),opacity .55s var(--ease)}
.story-cta span{transition:transform .7s var(--ease)}
.story-cta:hover span{transform:translateX(5px)}
.rail-buttons button{display:grid;place-items:center;transition:background-color .65s var(--ease),border-color .65s var(--ease),opacity .65s var(--ease),transform .65s var(--ease)}
.rail-buttons button:hover:enabled{transform:scale(1.055)}
.section-tag{transition:background-color .65s var(--ease),border-color .65s var(--ease)}
.section-tag:hover{background-color:#d4fb0322;border-color:#90aa08}
.js-ready .reveal{transition:opacity 1s var(--ease),transform 1.15s var(--ease);transform:translateY(24px);transition-delay:var(--reveal-delay,0ms)}
.js-ready .reveal.in-view{transform:translateY(0)}
.impact{min-height:700px;height:100svh;max-height:950px;display:grid;place-items:center;overflow:clip;background:#f5f5f5}
.earth-stage{position:absolute;z-index:0;top:50%;left:50%;width:min(680px,88svh,76vw);aspect-ratio:1;opacity:0;transform:translate(-50%,-50%) translate3d(0,200px,0) scale(.94);transition:transform 1.7s var(--ease),opacity 1.15s var(--ease);will-change:auto}
.impact.in-view .earth-stage{opacity:.87;transform:translate(-50%,-50%) translate3d(0,0,0) scale(1)}
.earth-stage #earth{position:static;top:auto;left:auto;width:100%;height:100%;transform:none;opacity:1;filter:none}
.earth-fallback{border-radius:50%;background:url('../assets/images/site/earth.jpg') center/200% 100%;box-shadow:inset -20px -10px 55px #0002;filter:grayscale(1)}
.impact-stats{width:max-content;max-width:96%;grid-template-columns:repeat(3,auto);gap:30px 0;padding:0;margin:0;align-items:center;justify-content:center}
.impact-stat{padding:0 25px;opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease),transform 1.25s var(--ease);transition-delay:calc(.18s + var(--delay,0s))}
.impact-stat:nth-child(3n+2),.impact-stat:nth-child(3n+3){border-left:1px solid #1c272d77}
.impact-stat strong{font-size:clamp(32px,3.8vw,55px);font-weight:300;line-height:1.05;color:#0b1013;letter-spacing:-.035em}
.impact-stat span{margin-top:8px;font-size:14px;color:#253137}
@keyframes scene-drift{from{transform:scale(1.016) translate3d(-.15%,0,0)}to{transform:scale(1.032) translate3d(.25%,-.15%,0)}}
@keyframes popup-soft-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes hero-soft-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.impact-stat{padding:0 18px}
.impact-stat strong{font-size:clamp(29px,4.1vw,43px)}
}
@media(max-width:800px){.hero-bottom{right:6%}
.hero-bottom-actions .button{display:inline-flex}
.hero-bottom-actions>.button.orbit-button{--disc:38px;min-height:38px}
.hero-bottom-actions .orbit-label{min-width:0;font-size:12px!important;padding:0 18px!important}
.impact{min-height:620px;height:88svh}
.earth-stage{width:min(650px,86svh,88vw)}
.impact-stats{gap:26px 0}
.impact-stat{padding:0 12px}
.impact-stat strong{font-size:clamp(24px,4.5vw,35px)}
.impact-stat span{font-size:12px}
.scene-nav{gap:10px}
.scene-nav button{gap:5px}
}
@media(max-width:480px){.hero-bottom{left:18px;right:18px;bottom:23px;gap:8px}
.hero-bottom-actions{gap:4px}
.hero-bottom-actions>.button.orbit-button{--disc:34px;min-height:34px}
.hero-bottom-actions .orbit-label{font-size:11px!important;padding:0 12px!important;min-width:0}
.scene-nav{gap:9px}
.scene-nav button{font-size:11px;gap:4px}
.scene-nav button .scene-name{display:none}
.scene-nav button:before{width:8px}
.scene-nav button[aria-current]:before{width:12px}
.hero-actions>.orbit-button{--disc:45px;padding:0 var(--disc) 0 0!important}
.hero-actions>.orbit-button .orbit-label{padding:0 14px;font-size:12px}
.hero-actions>.orbit-button .orbit-circle{font-size:22px}
.street-art>img{max-width:100%;width:100%;max-height:120px}
.tile-art>.led-chip{width:150px;max-width:95%}
.impact{min-height:560px;height:76svh;max-height:690px;margin:12px 4% 0}
.earth-stage{width:110%;max-width:560px}
.impact-stats{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:100%;padding:0 8px;gap:22px 0}
.impact-stat{padding:0 4px;border:0!important}
.impact-stat:nth-child(3n+2),.impact-stat:nth-child(3n+3){border-left:1px solid #1c272d55!important}
.impact-stat strong{font-size:clamp(17px,4.55vw,24px);white-space:nowrap}
.impact-stat span{font-size:9px;margin-top:6px;line-height:1.3}
}
:root.is-page-scrolling{scroll-behavior:auto!important}
@media(max-width:480px) and (max-height:750px){.hero{min-height:100svh}
.hero-copy{top:25%}
.hero h1{font-size:clamp(38px,6svh,45px);margin-bottom:20px}
.hero-description{font-size:15px;margin-bottom:14px}
.eyebrow{font-size:14px;margin-bottom:12px}
.hero-specs{font-size:12px;margin-bottom:20px}
}
@media(max-width:480px){.scene-nav button[aria-current] .scene-name{display:none}
.hero-bottom-actions>.button.orbit-button .orbit-label{min-width:0}
.impact-stat:nth-child(5) strong{font-size:clamp(15px,4vw,21px)}
}
