/* Decorative transforms and pin refreshes must not widen the document. Clip
   preserves the viewport scroll container used by sticky headers and GSAP. */
body{overflow-x:clip}
main,section,header,footer{min-width:0;max-width:100%}
.hero-copy,.benefit-intro,.benefit-grid,.section-head>*,.eco-title,.eco-tabs,#eco-panel,#eco-panel>div,.contact>*,.footer-top>*{min-width:0}
.hero{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.steps,.use-cases{grid-template-columns:repeat(3,minmax(0,1fr))}
.benefits{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.eco-shell{grid-template-columns:minmax(0,1fr) minmax(0,1.8fr)}
.contact{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.form-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.reviews{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}
.footer-top{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)}
img,canvas{max-width:100%}
.hero-actions,.store-buttons,.rating{flex-wrap:wrap}
.store{max-width:100%}
.eco-tabs button span,.eco-tabs button small,.review-person cite,footer a{overflow-wrap:anywhere}
#eco-panel img{flex-shrink:0}
.floating-controls{position:fixed;right:20px;bottom:18px;z-index:25;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.floating-controls .motion-toggle{position:static}
.back-to-top{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--navy);color:var(--yellow);border:1px solid #829cc355;box-shadow:0 4px 20px #00132d20;font-size:24px;transition:background .2s,transform .2s}
.back-to-top:hover{background:var(--blue);transform:translateY(-2px)}
.back-to-top[hidden]{display:none}
@media(min-width:901px){
 .scroll-story-enabled .label-top{right:90px;max-width:calc(100% - 100px)}
 .scroll-story-enabled .journey-caption{bottom:12px}
}
@media(max-width:1100px){.reviews{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}}
@media(min-width:901px) and (max-width:1100px){
 .scroll-story-enabled .label-top{right:90px;max-width:calc(100% - 100px)}
 .scroll-story-enabled .hero-actions .button{font-size:13px;padding:12px 16px;min-height:46px;gap:12px}
 .scroll-story-enabled .hero-actions .text-link{font-size:12px}
}
@media(min-width:901px) and (max-height:740px){
 .scroll-story-enabled .hero h1{font-size:52px}
 .scroll-story-enabled .hero-copy>p{font-size:13px}
 .scroll-story-enabled .hero-actions .button{font-size:13px;padding:12px 16px;min-height:46px;gap:12px}
 .scroll-story-enabled .hero-actions .text-link{font-size:12px}
 .scroll-story-enabled .journey-caption{bottom:10px}
}
@media(max-width:900px){
 .hero{display:flex}
 .steps,.use-cases,.benefits,.contact,.reviews,.eco-shell,.form-row{grid-template-columns:minmax(0,1fr)}
 .eco-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
 .footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}
 .floating-controls{right:12px;bottom:12px}
 .back-to-top{width:40px;height:40px;font-size:22px}
}
@media(max-width:380px){
 header{gap:8px;padding-left:4%;padding-right:4%}
 header .brand img{width:62px;height:50px}
 header>.button{padding:8px 10px;font-size:10px;gap:7px}
 .menu{font-size:22px;padding:5px}
 .hero h1,.scroll-story-enabled .hero h1{font-size:clamp(40px,13vw,49px)}
 .hero .desktop{display:none}
 .eyebrow{letter-spacing:1.2px}
 .benefit-grid{grid-template-columns:minmax(0,1fr)}
 .eco-tabs{display:flex;flex-direction:column;gap:4px;padding:8px}
 .eco-tabs button{display:grid;grid-template-columns:24px minmax(0,1fr);gap:4px 10px;min-height:64px;padding:12px}
 .eco-tabs button span{margin:0;font-size:12px}
 .eco-tabs button small{grid-column:2;margin:0;font-size:10px}
 .eco-tabs button[aria-selected=true]{border-bottom:0;border-left:3px solid var(--blue)}
 .section-head h2,.contact h2,.reviews h2{font-size:32px}
 .store-buttons{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){html:not(.motion-full) .back-to-top{transition:none}}
.motion-reduced .back-to-top{transition:none}
