/* V20 — Dual Fidelity / local rendered plates + material overlays */
.hero-stage,.experience-frame{overflow:hidden;isolation:isolate}
/* Critical fix: WebGL canvases MUST remain out of normal layout flow.
   position:relative previously caused the canvas and scene host to resize one another,
   leading to runaway page growth / visible jitter. Respect the original layer order. */
.hero-stage canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;display:block}
.experience-frame canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;display:block}
.hero-stage.webgl-fallback canvas,.experience-frame.webgl-fallback canvas{display:none}
.hero-stage .v20-hero-plate{z-index:0;opacity:.44}
.experience-frame .v20-scene-plate{z-index:0;opacity:.34}
.hero-stage .hero-fallback-art{z-index:2}

.v20-hero-plate,.v20-scene-plate{position:absolute;inset:0;pointer-events:none;z-index:1;background-size:cover;background-position:center center;opacity:.56;transform:scale(1.03);filter:saturate(1.03) contrast(1.05) brightness(.92)}
.v20-hero-plate:after,.v20-scene-plate:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,10,12,.14),rgba(4,10,12,.38)),radial-gradient(circle at 50% 46%,rgba(220,255,170,.08),transparent 34%),repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 1px,transparent 1px 140px);mix-blend-mode:screen;opacity:.46}
.v20-hero-plate{background-image:url('../assets/renders/nexus.webp');opacity:.62;filter:saturate(1.06) contrast(1.08) brightness(.94)}
.experience-frame[data-scene-mode='warehouse'] .v20-scene-plate{background-image:url('../assets/renders/warehouse.webp');opacity:.48}
.experience-frame[data-scene-mode='data'] .v20-scene-plate{background-image:url('../assets/renders/data.webp');opacity:.42}
.experience-frame[data-scene-mode='automation'] .v20-scene-plate{background-image:url('../assets/renders/automation.webp');opacity:.46}
.experience-frame[data-scene-mode='energy'] .v20-scene-plate{background-image:url('../assets/renders/energy.webp');opacity:.50}
.experience-frame::before{content:'';position:absolute;inset:auto 0 0 0;height:41%;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(7,11,13,.36) 45%,rgba(7,11,13,.72));}
.experience-bg-glow{z-index:0;background:radial-gradient(circle at 50% 44%,rgba(160,220,190,.14),transparent 33%),radial-gradient(circle at 20% 80%,rgba(210,255,150,.12),transparent 26%),radial-gradient(circle at 82% 22%,rgba(82,160,220,.12),transparent 24%)}
.experience-frame[data-scene-mode='warehouse'] .experience-bg-glow{background:radial-gradient(circle at 48% 60%,rgba(226,246,180,.16),transparent 29%),radial-gradient(circle at 18% 20%,rgba(255,255,255,.09),transparent 25%),radial-gradient(circle at 82% 12%,rgba(172,220,210,.16),transparent 24%)}
.experience-frame[data-scene-mode='nexus'] .experience-bg-glow{background:radial-gradient(circle at 50% 45%,rgba(214,255,145,.20),transparent 30%),radial-gradient(circle at 72% 15%,rgba(95,214,220,.18),transparent 24%)}
.experience-frame[data-scene-mode='energy'] .experience-bg-glow{background:radial-gradient(circle at 20% 24%,rgba(255,244,200,.18),transparent 28%),radial-gradient(circle at 76% 20%,rgba(165,245,185,.16),transparent 24%)}
.experience-frame[data-scene-mode='automation'] .experience-bg-glow{background:radial-gradient(circle at 65% 40%,rgba(208,255,165,.14),transparent 27%),radial-gradient(circle at 18% 70%,rgba(150,210,200,.12),transparent 22%)}
.experience-frame[data-scene-mode='data'] .experience-bg-glow{background:radial-gradient(circle at 50% 50%,rgba(100,160,255,.14),transparent 28%),radial-gradient(circle at 78% 18%,rgba(175,255,225,.10),transparent 22%)}
.hero-stage{background:radial-gradient(ellipse at 55% 42%,rgba(74,166,135,.18),transparent 45%),#050a0c}
.experience-current p,.threshold-caption,.hero-subrow p{ text-shadow:0 1px 1px rgba(0,0,0,.28)}
.project-card,.brief-card,.lab-card,.method-card,.exp-card{box-shadow:0 20px 55px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.045)}
/* Final stacking order, applied after the scene-specific plate styles. */
.hero-stage .v20-hero-plate{opacity:.38!important}
.experience-frame .v20-scene-plate{opacity:.29!important}
@media(max-width:700px){
 .hero-stage .v20-hero-plate{opacity:.30!important}
 .experience-frame .v20-scene-plate{opacity:.24!important}
}