/* The code is a monitor; the page is a nearly opaque glass sheet over it. */
:root{--monitor-rail:5vw;--monitor-top:clamp(18px,3vh,36px);--glass-top:var(--monitor-top);--sheet-shadow:#182b491a;--monitor-bg:#e4eaf3;--glass-opacity:90%}
html[data-theme=dark]{--monitor-bg:#0c1523;--sheet-shadow:#0006}
body{background:var(--monitor-bg);isolation:isolate}
.scroll-backdrop{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.backdrop-glass{position:fixed;top:var(--glass-top);bottom:0;left:var(--monitor-rail);right:0;pointer-events:none;z-index:1;background:color-mix(in srgb,var(--bg) 20%,transparent);backdrop-filter:blur(1.2px);-webkit-backdrop-filter:blur(1.2px)}
.site-shell{position:relative;z-index:2;width:calc(100% - var(--monitor-rail));margin:var(--monitor-top) 0 0 var(--monitor-rail);border-left:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent);border-radius:22px 0 0 0;box-shadow:-12px -10px 36px var(--sheet-shadow),0 18px 48px #182b490a}
:is(.header,.footer,.hero,.products-intro,.about-compact,.formula-finale){background:color-mix(in srgb,var(--bg) var(--glass-opacity),transparent)}
.product-bots,.product-web{background:color-mix(in srgb,var(--paper) var(--glass-opacity),transparent)}
.product-ai{background:color-mix(in srgb,var(--blue) var(--glass-opacity),transparent)}
.product-mobile,.contact{background:color-mix(in srgb,var(--peach) var(--glass-opacity),transparent)}
.product-stores{background:color-mix(in srgb,var(--bg) var(--glass-opacity),transparent)}
.product-crm{background:color-mix(in srgb,var(--panel) var(--glass-opacity),transparent)}
:is(.header,.footer,.hero,.products-intro,.about-compact,.formula-finale,.product-section,.contact){backdrop-filter:blur(1.4px);-webkit-backdrop-filter:blur(1.4px)}
:is(.shop-window,.business-console,.web-browser,.mobile-nav,.solution-tabs,.demo-cart-dialog){background:color-mix(in srgb,var(--paper) var(--glass-opacity),transparent);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
:is(.primary,.contact-button,.demo-cart-checkout){background:color-mix(in srgb,var(--action) var(--glass-opacity),transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.formula-finale{height:300px}
@media(max-width:1200px){.desktop-nav{gap:20px;font-size:12px}.header{gap:20px;padding-inline:4vw}.header-contact{font-size:12px;gap:15px}.brand-name{font-size:9px}.section-wrap{padding-inline:4vw}.hero{gap:24px}.hero h1{font-size:clamp(54px,6.3vw,90px)}}
@media(max-width:960px){.desktop-nav{gap:14px;font-size:11px}.brand{gap:8px}.header-contact{font-size:11px;gap:10px}.header{gap:16px}.hero{grid-template-columns:1fr 1fr}.hero h1{font-size:59px}.hero-actions{gap:16px;flex-wrap:wrap}}
@media(max-width:760px){.section-wrap,.header{padding-inline:24px}.hero{display:flex;flex-direction:column;gap:10px}.hero h1{font-size:clamp(57px,9.5vw,85px)}.hero .product-demo{width:100%}.formula-finale{height:240px}}
@media(max-width:390px){.section-wrap,.header{padding-inline:19px}.hero h1{font-size:clamp(49px,15vw,58px)}.product-title{font-size:36px}.products-intro h2{font-size:41px}}
@media(prefers-reduced-motion:reduce){.scroll-backdrop{display:none}.formula-finale{display:none}}

/* The top edge lifts off the monitor without clipping navigation or dialogs. */
.site-shell>.header{border-top-left-radius:21px}.backdrop-glass{border-top-left-radius:22px}
