/* Shared content width and non-modal cart presentation; never payment logic. */
body[class]{--shell:min(1640px,88%);--envelope:var(--shell);--site-cart-width:min(465px,36vw);--site-cart-bottom:0px;transition:padding-right .4s var(--ease)}
body[class][data-site-width="medium"]{--shell:min(960px,calc(100% - 48px));--envelope:var(--shell)}
body[class][data-site-width="small"]{--shell:calc(100% - 32px);--envelope:var(--shell)}
body[class] main{container-type:inline-size;container-name:site-content}
body[class] .site-header .header-shell,body[class] .site-footer .footer-main,body[class] .site-footer .footer-bottom{width:var(--shell)}
body.ge-account-page .ge-account-main{width:var(--shell);max-width:none}
.solutions-page-v3 .solution-orientator-section>.section-shell{width:var(--envelope)}
:is(.home-page,.solutions-page-v3) .builders-section{--envelope:inherit;width:var(--envelope)}
body[class].drawer-open{padding-right:var(--site-cart-width);overflow-y:auto;overflow-x:clip}
body[class].modal-open{overflow:hidden}
body[class] .drawer-backdrop{display:none!important;pointer-events:none!important;backdrop-filter:none!important;background:none!important}
body[class] .cart-drawer{width:var(--site-cart-width)}
body[class] .site-header{right:0;transition:height .3s,background .3s,box-shadow .3s,right .4s var(--ease)}
body[class].drawer-open .site-header{right:var(--site-cart-width);width:auto;max-width:100%}
body[class].drawer-open .site-header .header-shell{grid-template-columns:clamp(160px,16vw,230px) minmax(0,1fr) auto;gap:14px}
body[class].drawer-open .site-header .brand img{width:clamp(155px,15vw,220px)}
body[class].drawer-open .site-header .main-nav{gap:clamp(12px,1.5vw,28px)}
body[class].drawer-open .site-header :is(.nav-group>.nav-primary-link,.main-nav>.nav-direct){font-size:.83rem}
body[class].drawer-open .site-header .header-actions{gap:8px}
body[class].drawer-open .site-header .icon-button{width:42px;height:42px}
body[class].drawer-open .site-header .icon-button svg{width:24px;height:24px}
body[class].drawer-open .site-header .whatsapp-button{height:44px;min-height:44px;padding:0 14px;font-size:.82rem}
body[class].drawer-open .site-header .whatsapp-button svg{width:21px;height:21px}
/* Header and footer adapt to their remaining area, not the full viewport. */
body[class][data-site-width="medium"] .site-header .header-shell,body[class][data-site-width="small"] .site-header .header-shell{grid-template-columns:minmax(0,1fr) auto auto;gap:8px}
body[class][data-site-width="medium"] .site-header .brand img{width:185px}
body[class][data-site-width="small"] .site-header .brand img{width:120px}
body[class].drawer-open[data-site-nav="inline"][data-site-width="medium"] .site-header .header-shell{grid-template-columns:155px minmax(0,1fr) auto;gap:12px}
body[class].drawer-open[data-site-nav="inline"][data-site-width="medium"] .site-header .brand img{width:155px}
body[class].drawer-open[data-site-nav="inline"][data-site-width="medium"] .site-header .main-nav{gap:14px}
body[class].drawer-open[data-site-nav="inline"][data-site-width="medium"] .site-header .icon-button{width:36px;height:40px}
body[class].drawer-open[data-site-nav="inline"][data-site-width="medium"] .site-header .whatsapp-button{padding-inline:11px;font-size:.77rem}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-toggle{display:block}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .main-nav{position:absolute;top:100%;right:0;left:0;display:flex;max-height:0;overflow:auto;align-items:stretch;justify-content:flex-start;flex-direction:column;gap:0;padding:0 20px;background:#0e151d;box-shadow:0 20px 40px #0003}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .main-nav.is-open{max-height:calc(100dvh - 106px);padding:12px 20px 24px}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-group{display:grid;height:auto;grid-template-columns:1fr auto}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-group>.nav-primary-link{height:auto;padding:13px 12px;border-bottom:1px solid #ffffff1a;color:#fff!important;font-size:.86rem}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-direct{padding:12px;border-bottom:1px solid #ffffff1a;color:#fff!important}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-dropdown-toggle{width:48px;height:100%;border-bottom:1px solid #ffffff1a;color:#fff}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-dropdown{position:static;display:none;min-width:0!important;grid-template-columns:1fr!important;gap:2px;padding:7px 8px 11px;border:0;border-radius:0;background:#ffffff0b;box-shadow:none;opacity:1;pointer-events:auto;transform:none!important}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-group.is-open>.nav-dropdown{display:grid;grid-column:1/-1}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header .nav-dropdown a{color:#d7e0e9}
body[class][data-site-width="small"] .site-header .header-actions{gap:3px}
body[class][data-site-width="small"] .site-header :is(.icon-button,.whatsapp-button){display:grid;width:38px;min-width:38px;height:38px;min-height:38px;place-items:center;padding:0}
body[class][data-site-width="small"] .site-header .whatsapp-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
body[class][data-site-width="medium"] .site-footer .footer-main{grid-template-columns:1fr 2fr;gap:45px}
body[class][data-site-width="medium"] .site-footer .footer-connect{grid-column:1/-1;padding:25px 0 0;border:0;border-top:1px solid #ffffff26}
body[class][data-site-width="small"] .site-footer .footer-main{grid-template-columns:1fr;gap:36px}
body[class][data-site-width="small"] .site-footer .footer-nav{grid-template-columns:1fr 1fr;gap:20px}
body[class][data-site-width="small"] .site-footer .footer-connect{grid-column:auto}
body[class][data-site-width="small"] .site-footer .footer-nav>div:last-child{grid-column:1/-1}
.catalog-results{container-type:inline-size;container-name:catalog-results}
.product-purchase-v2{container-type:inline-size;container-name:product-purchase}
.product-actions-v2 .button{min-width:0;width:100%;max-width:100%}
@container product-purchase (max-width:480px){
 .product-actions-v2{grid-template-columns:minmax(0,1.35fr) minmax(116px,.65fr);grid-template-areas:"quantity quantity" "add doubt"}
 .product-actions-v2 [data-product-add]{font-size:.74rem;padding-inline:12px;white-space:normal}
}
@container product-purchase (max-width:340px){
 .product-actions-v2{grid-template-columns:minmax(0,1fr);grid-template-areas:"quantity" "add" "doubt"}
}
.catalog-v2 .catalog-results>.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@container catalog-results (min-width:720px){.catalog-v2 .catalog-results>.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container catalog-results (min-width:1080px){.catalog-v2 .catalog-results>.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@container catalog-results (max-width:479px){.catalog-v2 .catalog-results>.catalog-grid{grid-template-columns:1fr}}
/* Keep the asymmetric featured cards only while their purchasing controls fit. */
@container site-content (max-width:1250px){
 .home-page .featured-grid{grid-template-columns:1fr 1fr;grid-template-rows:320px 320px;grid-auto-rows:320px}
 .home-page :is(.featured-card-main,.featured-card-medium,.featured-card-small){grid-row:auto;grid-column:auto;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 168px;height:auto}
 .home-page .featured-envelope{--featured-buy-width:100%}
 .home-page :is(.featured-card-small:nth-of-type(3),.featured-card-small:nth-of-type(4)){grid-row:auto;grid-column:auto;height:auto}
}
/* Wide pages automatically reflow after the cart reserves its space. */
@container site-content (max-width:1100px){
 .product-hero-v2{grid-template-columns:minmax(0,1fr) minmax(360px,.92fr);gap:38px}
 .related-section-v2 .related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 :is(.home-page,.solutions-page-v3) .builders-content{padding-left:55%;padding-right:30px}
 :is(.home-page,.solutions-page-v3) .builders-content .button{min-width:min(310px,100%)}
}
@container site-content (max-width:1000px){
 .solutions-page-v3 .ge-guided-band{grid-template-columns:repeat(2,minmax(0,1fr))}
 .solutions-page-v3 .ge-guided-info{grid-column:1/-1;height:auto;max-height:270px}
 .solutions-page-v3 .ge-guided-info-scroll{max-height:140px}
 .solutions-page-v3 .ge-guided-extra{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container site-content (max-width:900px){
 .product-hero-v2{grid-template-columns:1fr}.product-purchase-v2{max-width:none}
 .catalog-workspace{grid-template-columns:1fr}
 .catalog-filters{position:relative;top:auto;max-height:none}
 .solutions-page-v3 .ge-project-summary-hero{grid-template-columns:180px minmax(0,1fr)}
 .solutions-page-v3 .ge-project-selections{grid-column:1/-1}
 .solutions-page-v3 .ge-choices-project,.home-guided-scope .ge-choices-project{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@container site-content (max-width:700px){
 .home-page .featured-envelope{padding:22px 16px 20px}
 .home-page .featured-grid{grid-template-rows:none;grid-auto-rows:auto;gap:10px}
 .home-page :is(.featured-card-main,.featured-card-medium,.featured-card-small){grid-template-rows:auto 224px}
 .home-page .featured-card .featured-visual{height:auto!important;aspect-ratio:8/5}
 .home-page .featured-card .product-actions{grid-template-columns:minmax(0,1fr);gap:6px}
 .home-page .featured-card .quantity-stepper{justify-self:center}
 :is(.home-page,.solutions-page-v3) .builders-section{height:auto;min-height:560px;margin-bottom:35px}
 :is(.home-page,.solutions-page-v3) .builders-media{width:100%;height:295px}
 :is(.home-page,.solutions-page-v3) .builders-shade{background:linear-gradient(180deg,transparent 0px,#0d192333 220px,#0f1d28 295px,#0f1d28 100%)}
 :is(.home-page,.solutions-page-v3) .builders-content{padding:295px 22px 24px;gap:0}
 :is(.home-page,.solutions-page-v3) .builders-content h2{font-size:2rem}
 :is(.home-page,.solutions-page-v3) .builders-content>div>span{font-size:.9rem}
 :is(.home-page,.solutions-page-v3) .builders-content .button{width:100%;min-width:0;margin-top:24px}
}
@container site-content (max-width:600px){
 .solutions-page-v3 .ge-guided-band,.solutions-page-v3 .ge-guided-extra{grid-template-columns:1fr}
 .solutions-page-v3 .ge-project-summary-hero{grid-template-columns:1fr}
}
@container site-content (max-width:560px){
 .solutions-page-v3 .ge-choices-project,.home-guided-scope .ge-choices-project{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Phones keep browsing above a compact bottom cart, not behind a dark overlay. */
@media(max-width:979px){
 body[class]{--site-cart-bottom:min(55dvh,480px)}
 body[class].drawer-open{padding-right:0!important;padding-bottom:var(--site-cart-bottom)}
 body[class].drawer-open .site-header{right:0}
 body[class] .cart-drawer{top:auto;bottom:0;width:100%;height:var(--site-cart-bottom);border-radius:22px 22px 0 0;transform:translateY(105%);box-shadow:0 -12px 38px #0003}
 body[class] .cart-drawer.is-open{transform:none}
}
@media(prefers-reduced-motion:reduce){body[class],body[class] .site-header{transition:none}}
/* Uniform 75% white background only; logo, controls and text stay fully opaque. */
.site-header:not(.site-header-home),.solutions-page-v3 .site-header:not(.site-header-home).is-scrolled{background:rgba(241,244,247,.79);border-bottom:1px solid rgba(19,33,48,.09);box-shadow:0 5px 22px rgba(11,25,40,.09);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%)}
.site-header.site-header-home:not(.is-scrolled){box-shadow:none}
.site-header.site-header-home.is-scrolled{box-shadow:0 5px 22px rgba(0,7,16,.18)}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header:not(.site-header-home) .main-nav{background:rgba(241,244,247,.96);backdrop-filter:blur(22px) saturate(145%);box-shadow:0 12px 26px #11233814}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header:not(.site-header-home) :is(.nav-group>.nav-primary-link,.nav-direct,.nav-dropdown-toggle){color:#24313e!important;border-bottom-color:#18344e16}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header:not(.site-header-home) .nav-dropdown{background:#fff6}
body[class]:is([data-site-width="medium"],[data-site-width="small"]):not([data-site-nav="inline"]) .site-header:not(.site-header-home) .nav-dropdown a{color:#42536b}
/* Extend that SAME photograph under the translucent header without moving its focal point. */
.solutions-page-v3 .solutions-continuous-scene{--scene-image-height:max(66.667vw,calc((var(--scene-hero-height) * .5 + var(--scene-fade-depth) + 2px) / .57),calc((var(--solutions-header-height) + var(--scene-hero-height) * .5 + 1px) / .43));top:0;height:calc(var(--solutions-header-height) + var(--scene-hero-height) + var(--scene-fade-depth) + 2px);mask-image:linear-gradient(180deg,#000 0px,#000 calc(var(--solutions-header-height) + var(--scene-hero-height) - 10px),transparent calc(var(--solutions-header-height) + var(--scene-hero-height) + var(--scene-fade-depth)));-webkit-mask-image:linear-gradient(180deg,#000 0px,#000 calc(var(--solutions-header-height) + var(--scene-hero-height) - 10px),transparent calc(var(--solutions-header-height) + var(--scene-hero-height) + var(--scene-fade-depth)))}
.solutions-page-v3 .solutions-continuous-scene img{top:calc(var(--solutions-header-height) + var(--scene-hero-height) * .5)}

/* Header envelope: keep the existing sticky/fixed geometry and height. Only
   the inner surface paints; its outer edges match the approved content shell. */
body[class]{--header-cover-height:106px;--header-envelope-radius:clamp(28px,3.5vw,58px)}
body[class] .site-header[data-header],body[class] .site-header[data-header].is-scrolled{border:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;pointer-events:none}
body[class] .site-header[data-header] .header-shell{position:relative;padding-inline:clamp(24px,2.2vw,40px);border:1px solid rgba(19,33,48,.09);border-top:0;border-radius:0 0 var(--header-envelope-radius) var(--header-envelope-radius);background:rgba(241,244,247,.79);box-shadow:0 5px 22px rgba(11,25,40,.09);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);pointer-events:auto}
/* The home surface and height follow scroll position, never elapsed time.
   Keep logo/menu/actions visible at the hero origin and preserve their slots. */
body.home-page .site-header.site-header-home,body.home-page .site-header.site-header-home.is-scrolled{--header-expanded-height:106px;--header-compact-height:82px;height:calc(var(--header-expanded-height) - (var(--header-expanded-height) - var(--header-compact-height)) * var(--header-scroll-progress,0));opacity:1;visibility:visible;pointer-events:none;transition:none}
body.home-page .site-header.site-header-home .header-shell{border-color:rgba(255,255,255,calc(.1 * var(--header-scroll-progress,0)));background:rgba(8,15,23,calc(.9 * var(--header-scroll-progress,0)));box-shadow:0 5px 22px rgba(0,7,16,calc(.18 * var(--header-scroll-progress,0)));backdrop-filter:blur(calc(18px * var(--header-scroll-progress,0))) saturate(calc(1 + .25 * var(--header-scroll-progress,0)));-webkit-backdrop-filter:blur(calc(18px * var(--header-scroll-progress,0))) saturate(calc(1 + .25 * var(--header-scroll-progress,0)));pointer-events:auto;transition:none}
/* Original image sizes the slot; SVG layers replace its paint. GRIFE keeps
   its exact scale and X position while G and ENERGY descend and fade. */
body[class] .site-header[data-header] .brand img{transform:none;transition:none}
body[class] .site-header[data-header] .brand-motion{display:inline-block;position:relative;flex:none;line-height:0}
body[class] .site-header[data-header] .brand-motion>img{display:block;opacity:0}
body[class] .site-header[data-header] .brand-motion-art{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;transition:none}
body[class][data-site-width="medium"] .site-header[data-header] .header-shell{padding-inline:22px}
body[class][data-site-width="small"] .site-header[data-header] .header-shell{padding-inline:10px}
body[class][data-site-width="small"] .site-header[data-header] .brand img{width:clamp(88px,25vw,120px)}

/* Dropdowns are not clipped by the rounded surface. Use the same envelope
   width and switch to a menu whenever the inset controls no longer fit. */
body[class][data-site-nav="menu"] .site-header[data-header] .nav-toggle{display:block}
body[class][data-site-nav="menu"] .site-header[data-header] .header-shell{grid-template-columns:minmax(0,1fr) auto auto;gap:8px}
body[class][data-site-nav="menu"] .site-header[data-header] .main-nav{position:absolute;top:100%;right:0;left:0;display:flex;max-height:0;overflow:auto;align-items:stretch;justify-content:flex-start;flex-direction:column;gap:0;padding:0 20px;border-radius:0 0 24px 24px;background:rgba(241,244,247,.97);box-shadow:0 12px 26px #11233814;backdrop-filter:blur(22px) saturate(145%)}
body[class][data-site-nav="menu"] .site-header[data-header] .main-nav.is-open{max-height:calc(100dvh - var(--header-cover-height) - 12px);padding:12px 20px 24px}
body[class][data-site-nav="menu"] .site-header[data-header] .nav-group{display:grid;height:auto;grid-template-columns:1fr auto}
body[class][data-site-nav="menu"] .site-header[data-header] :is(.nav-group>.nav-primary-link,.nav-direct){height:auto;padding:13px 12px;border-bottom:1px solid #18344e16;color:#24313e!important;font-size:.86rem}
body[class][data-site-nav="menu"] .site-header[data-header] .nav-dropdown-toggle{width:48px;height:100%;border-bottom:1px solid #18344e16;color:#24313e}
body[class][data-site-nav="menu"] .site-header[data-header] .nav-dropdown{position:static;display:none;min-width:0!important;grid-template-columns:1fr!important;gap:2px;padding:7px 8px 11px;border:0;border-radius:0;background:#fff6;box-shadow:none;opacity:1;pointer-events:auto;transform:none!important}
body[class][data-site-nav="menu"] .site-header[data-header] .nav-group.is-open>.nav-dropdown{display:grid;grid-column:1/-1}
body[class][data-site-nav="menu"] .site-header[data-header] .nav-dropdown::before{display:none}
body[class][data-site-nav="menu"] .site-header[data-header] .nav-dropdown a{color:#42536b}
body.home-page[data-site-nav="menu"] .site-header.site-header-home .main-nav{background:rgba(14,21,29,.98)}
body.home-page[data-site-nav="menu"] .site-header.site-header-home :is(.nav-group>.nav-primary-link,.nav-direct,.nav-dropdown-toggle){color:#fff!important;border-bottom-color:#ffffff1a}
body.home-page[data-site-nav="menu"] .site-header.site-header-home .nav-dropdown{background:#ffffff0b}
body.home-page[data-site-nav="menu"] .site-header.site-header-home .nav-dropdown a{color:#d7e0e9}

/* Extend only the photo/shade layers under the header; never shift hero copy,
   title size, banner height, action positions or the sections that follow. */
body.catalog-v2 main .catalog-hero-v2.shop-dynamic-hero{overflow:visible}
body.catalog-v2 main .shop-dynamic-hero :is(.shop-hero-media,.shop-hero-shade){top:calc(-1 * var(--header-cover-height))}
body.catalog-v2 main .shop-dynamic-hero .shop-hero-media{overflow:hidden}
body.montadores-page main .pro-hero-media{top:calc(-1 * var(--header-cover-height));height:calc(100% + var(--header-cover-height))}
body.montadores-page main .pro-hero::after{top:calc(-1 * var(--header-cover-height))}
@container site-content (max-width:700px){
 body.catalog-v2 main .catalog-hero-v2.shop-dynamic-hero .shop-hero-media{height:calc(178px + var(--header-cover-height))}
 body.catalog-v2 main .shop-dynamic-hero :is(.shop-hero-media,.shop-hero-shade){top:calc(-1 * var(--header-cover-height))}
 body.catalog-v2 main .catalog-hero-v2.shop-dynamic-hero .shop-hero-media img{object-position:left center}
 body.catalog-v2 main .catalog-hero-v2.shop-dynamic-hero[data-copy-side="left"] .shop-hero-media img{object-position:right center}
 body.catalog-v2 main .catalog-hero-v2.shop-dynamic-hero .shop-hero-shade,body.catalog-v2 main .catalog-hero-v2.shop-dynamic-hero[data-copy-side="right"] .shop-hero-shade{background:linear-gradient(180deg,rgba(8,18,27,.12) 0px,rgba(8,18,27,.08) calc(105px + var(--header-cover-height)),rgba(8,18,27,.95) calc(178px + var(--header-cover-height)),#08121b calc(210px + var(--header-cover-height)))}
}
@media(max-width:1100px){body[class]{--header-cover-height:76px}}
@media(max-width:700px){body[class]{--header-cover-height:72px;--header-envelope-radius:28px}}
@media(max-width:1100px){body.home-page .site-header.site-header-home,body.home-page .site-header.site-header-home.is-scrolled{--header-expanded-height:76px;--header-compact-height:76px}}
@media(max-width:700px){body.home-page .site-header.site-header-home,body.home-page .site-header.site-header-home.is-scrolled{--header-expanded-height:72px;--header-compact-height:72px}}
/* Phones preserve the original word size too, independent of scroll. */
@media(max-width:700px){body[class][data-site-width] .site-header[data-header] .brand img{width:clamp(88px,25vw,120px);transform:none}}
/* At the narrowest phone width, catalogue/page search remains in the page.
   Avoid shrinking the brand into an unreadable mark to fit four icon actions. */
@media(max-width:360px){
 body[class] .site-header[data-header] .header-actions>[data-open-search]{display:none}
 body[class] .site-header[data-header] .header-actions>:is(.icon-button,.whatsapp-button){width:34px;height:38px;min-width:34px;padding-inline:0}
 body[class] .site-header[data-header] .header-shell{grid-template-columns:minmax(88px,1fr) auto auto}
}
