/*
 * Nuraforce Liquid Lens V5.1
 * Single-purpose refinement: remove the visible outer hero-stage container.
 * Scaled 3D product ecosystem (10–20% larger, wider orbit radius, visible Z-depth, unclipped).
 */

:root {
  --v5-stage-height: clamp(550px, calc(100svh - 130px), 680px);
  --v5-core-size: 192px;
  --v5-cube-size: 110px;
  --v5-perspective: 1150px;
}

.system-stage.hero-stage-v5 {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  overflow: visible !important;
  contain: none !important;
}

.system-stage.hero-stage-v5::before,
.system-stage.hero-stage-v5::after {
  display: none !important;
  content: none !important;
}

.hero-stage-v5 .liquid-stage-canvas {
  display: none !important;
}

.liquid-stage--v5 {
  display: block !important;
  grid-template-rows: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.liquid-stage--v5::before,
.liquid-stage--v5::after {
  display: none !important;
  content: none !important;
}

.liquid-stage--v5 .liquid-stage__topbar,
.liquid-stage--v5 .liquid-stage__footer {
  display: none !important;
}

.liquid-stage--v5 .hero-sequence {
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}

.hero-scene {
  overflow: visible !important;
}

/* Remove top and right hat/roof plates on ecosystem cards */
.ecosystem-cube__face--top,
.ecosystem-cube__face--right {
  display: none !important;
}

/* Left-Facing 3D Card Orientation (Turned slightly more towards front) & Natural Float Animation */
.ecosystem-cube__form {
  transform: rotateX(-8deg) rotateY(-14deg);
}

.ecosystem-cube--core .ecosystem-cube__form {
  animation: v5-core-float-left 7s ease-in-out infinite alternate !important;
}

.ecosystem-cube--product .ecosystem-cube__form {
  animation: v5-product-float-left 6.4s ease-in-out infinite alternate !important;
  animation-delay: calc(var(--cube-order, 0) * -760ms) !important;
}

@keyframes v5-core-float-left {
  from { transform: rotateX(-9deg) rotateY(-11deg) translateY(2px); }
  to { transform: rotateX(-6deg) rotateY(-17deg) translateY(-4px); }
}

@keyframes v5-product-float-left {
  from { transform: rotateX(-9deg) rotateY(-12deg) translateY(1px); }
  to { transform: rotateX(-6deg) rotateY(-16deg) translateY(-3px); }
}

/* Ensure animated liquid caustic wave effect runs across all card fronts */
.hero-sequence[data-sequence-scene="cubes"] .ecosystem-cube__face--front::after {
  animation: v5-cube-caustic 5.8s ease-in-out infinite !important;
}

/* Expanded Ecosystem 3D Orbit Coordinates & Larger Scale (from backup) */
.ecosystem-cube--core {
  --cube-size: var(--v5-core-size) !important;
  transform: translate(-50%, -50%) translate3d(0, -4px, 48px) !important;
}

.ecosystem-cube--product[data-orbit-slot="0"] {
  --slot-x: 204px !important;
  --slot-y: 130px !important;
  --slot-z: 220px !important;
  --slot-scale: 1.20 !important;
}

.ecosystem-cube--product[data-orbit-slot="1"] {
  --slot-x: 252px !important;
  --slot-y: -84px !important;
  --slot-z: 55px !important;
  --slot-scale: 0.96 !important;
}

.ecosystem-cube--product[data-orbit-slot="2"] {
  --slot-x: 24px !important;
  --slot-y: -172px !important;
  --slot-z: -155px !important;
  --slot-scale: 0.76 !important;
}

.ecosystem-cube--product[data-orbit-slot="3"] {
  --slot-x: -238px !important;
  --slot-y: -92px !important;
  --slot-z: -85px !important;
  --slot-scale: 0.82 !important;
}

.ecosystem-cube--product[data-orbit-slot="4"] {
  --slot-x: -202px !important;
  --slot-y: 126px !important;
  --slot-z: 95px !important;
  --slot-scale: 0.98 !important;
}

/* Scaled orbit rings and technical signal paths (from backup) */
.cube-orbit--outer {
  width: 590px !important;
  height: 375px !important;
}

.cube-orbit--inner {
  width: 385px !important;
  height: 245px !important;
}

.cube-signals {
  width: min(100%, 900px) !important;
  height: min(100%, 620px) !important;
}

/* ==========================================================================
   Responsive Ecosystem Sizing & Positioning Overrides
   ========================================================================== */

/* Laptop / Medium Desktop */
@media (max-width: 1240px) and (min-width: 901px) {
  :root {
    --v5-core-size: 160px;
    --v5-cube-size: 92px;
    --v5-perspective: 1000px;
  }

  .ecosystem-cube--product[data-orbit-slot="0"] {
    --slot-x: 168px !important;
    --slot-y: 108px !important;
    --slot-z: 175px !important;
    --slot-scale: 1.18 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="1"] {
    --slot-x: 208px !important;
    --slot-y: -70px !important;
    --slot-z: 45px !important;
    --slot-scale: 0.94 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="2"] {
    --slot-x: 20px !important;
    --slot-y: -142px !important;
    --slot-z: -125px !important;
    --slot-scale: 0.74 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="3"] {
    --slot-x: -196px !important;
    --slot-y: -76px !important;
    --slot-z: -70px !important;
    --slot-scale: 0.80 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="4"] {
    --slot-x: -166px !important;
    --slot-y: 104px !important;
    --slot-z: 78px !important;
    --slot-scale: 0.96 !important;
  }

  .cube-orbit--outer {
    width: 485px !important;
    height: 308px !important;
  }

  .cube-orbit--inner {
    width: 316px !important;
    height: 200px !important;
  }

  .cube-signals {
    width: min(100%, 740px) !important;
    height: min(100%, 510px) !important;
  }
}

/* Tablet Portrait */
@media (max-width: 900px) {
  :root {
    --v5-core-size: 130px;
    --v5-cube-size: 74px;
    --v5-perspective: 880px;
  }

  .ecosystem-cube--product[data-orbit-slot="0"] {
    --slot-x: 136px !important;
    --slot-y: 84px !important;
    --slot-z: 135px !important;
    --slot-scale: 1.16 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="1"] {
    --slot-x: 168px !important;
    --slot-y: -54px !important;
    --slot-z: 36px !important;
    --slot-scale: 0.92 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="2"] {
    --slot-x: 16px !important;
    --slot-y: -110px !important;
    --slot-z: -98px !important;
    --slot-scale: 0.72 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="3"] {
    --slot-x: -158px !important;
    --slot-y: -60px !important;
    --slot-z: -54px !important;
    --slot-scale: 0.78 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="4"] {
    --slot-x: -134px !important;
    --slot-y: 80px !important;
    --slot-z: 60px !important;
    --slot-scale: 0.94 !important;
  }

  .cube-orbit--outer {
    width: 395px !important;
    height: 250px !important;
  }

  .cube-orbit--inner {
    width: 258px !important;
    height: 164px !important;
  }

  .cube-signals {
    width: min(100%, 600px) !important;
    height: min(100%, 360px) !important;
  }
}

/* Tablet / Large Mobile */
@media (max-width: 760px) {
  :root {
    --v5-core-size: 104px;
    --v5-cube-size: 58px;
    --v5-perspective: 760px;
  }

  .ecosystem-cube--product[data-orbit-slot="0"] {
    --slot-x: 104px !important;
    --slot-y: 64px !important;
    --slot-z: 95px !important;
    --slot-scale: 1.14 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="1"] {
    --slot-x: 128px !important;
    --slot-y: -42px !important;
    --slot-z: 28px !important;
    --slot-scale: 0.90 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="2"] {
    --slot-x: 12px !important;
    --slot-y: -84px !important;
    --slot-z: -70px !important;
    --slot-scale: 0.70 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="3"] {
    --slot-x: -122px !important;
    --slot-y: -46px !important;
    --slot-z: -42px !important;
    --slot-scale: 0.76 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="4"] {
    --slot-x: -102px !important;
    --slot-y: 62px !important;
    --slot-z: 46px !important;
    --slot-scale: 0.92 !important;
  }

  .cube-orbit--outer {
    width: 300px !important;
    height: 190px !important;
  }

  .cube-orbit--inner {
    width: 196px !important;
    height: 124px !important;
  }

  .cube-signals {
    width: min(100%, 460px) !important;
    height: min(100%, 300px) !important;
  }

  .cube-brand {
    width: 44px !important;
  }
}

/* Mobile (~430px, ~390px, ~360px) */
@media (max-width: 430px) {
  :root {
    --v5-core-size: 88px;
    --v5-cube-size: 50px;
    --v5-perspective: 680px;
  }

  .ecosystem-cube--product[data-orbit-slot="0"] {
    --slot-x: 84px !important;
    --slot-y: 52px !important;
    --slot-z: 75px !important;
    --slot-scale: 1.14 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="1"] {
    --slot-x: 104px !important;
    --slot-y: -34px !important;
    --slot-z: 22px !important;
    --slot-scale: 0.88 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="2"] {
    --slot-x: 10px !important;
    --slot-y: -68px !important;
    --slot-z: -55px !important;
    --slot-scale: 0.68 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="3"] {
    --slot-x: -98px !important;
    --slot-y: -36px !important;
    --slot-z: -34px !important;
    --slot-scale: 0.74 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="4"] {
    --slot-x: -82px !important;
    --slot-y: 50px !important;
    --slot-z: 36px !important;
    --slot-scale: 0.90 !important;
  }

  .cube-orbit--outer {
    width: 245px !important;
    height: 155px !important;
  }

  .cube-orbit--inner {
    width: 160px !important;
    height: 100px !important;
  }

  .cube-signals {
    width: 100% !important;
    height: 100% !important;
  }

  .cube-brand {
    width: 36px !important;
  }

  .cube-focus {
    bottom: 5px !important;
  }
}

/* Narrow Mobile (~320px to ~350px) */
@media (max-width: 350px) {
  :root {
    --v5-core-size: 76px;
    --v5-cube-size: 43px;
    --v5-perspective: 600px;
  }

  .ecosystem-cube--product[data-orbit-slot="0"] {
    --slot-x: 68px !important;
    --slot-y: 42px !important;
    --slot-z: 60px !important;
    --slot-scale: 1.12 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="1"] {
    --slot-x: 84px !important;
    --slot-y: -28px !important;
    --slot-z: 18px !important;
    --slot-scale: 0.86 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="2"] {
    --slot-x: 8px !important;
    --slot-y: -56px !important;
    --slot-z: -44px !important;
    --slot-scale: 0.66 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="3"] {
    --slot-x: -80px !important;
    --slot-y: -30px !important;
    --slot-z: -28px !important;
    --slot-scale: 0.72 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="4"] {
    --slot-x: -66px !important;
    --slot-y: 40px !important;
    --slot-z: 30px !important;
    --slot-scale: 0.88 !important;
  }

  .cube-orbit--outer {
    width: 200px !important;
    height: 128px !important;
  }

  .cube-orbit--inner {
    width: 130px !important;
    height: 82px !important;
  }

  .cube-signals {
    width: 100% !important;
    height: 100% !important;
  }

  .cube-brand {
    width: 30px !important;
  }
}

/* Mobile & Tablet Landscape */
@media (max-height: 620px) and (min-width: 600px) and (max-width: 900px) and (orientation: landscape) {
  :root {
    --v5-core-size: 100px;
    --v5-cube-size: 56px;
    --v5-perspective: 750px;
  }

  .ecosystem-cube--product[data-orbit-slot="0"] {
    --slot-x: 95px !important;
    --slot-y: 58px !important;
    --slot-z: 85px !important;
    --slot-scale: 1.14 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="1"] {
    --slot-x: 118px !important;
    --slot-y: -38px !important;
    --slot-z: 25px !important;
    --slot-scale: 0.90 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="2"] {
    --slot-x: 12px !important;
    --slot-y: -76px !important;
    --slot-z: -60px !important;
    --slot-scale: 0.70 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="3"] {
    --slot-x: -110px !important;
    --slot-y: -40px !important;
    --slot-z: -36px !important;
    --slot-scale: 0.76 !important;
  }

  .ecosystem-cube--product[data-orbit-slot="4"] {
    --slot-x: -94px !important;
    --slot-y: 56px !important;
    --slot-z: 40px !important;
    --slot-scale: 0.92 !important;
  }

  .cube-orbit--outer {
    width: 275px !important;
    height: 175px !important;
  }

  .cube-orbit--inner {
    width: 180px !important;
    height: 114px !important;
  }

  .cube-signals {
    width: min(100%, 380px) !important;
    height: min(100%, 250px) !important;
  }

  .cube-brand {
    width: 42px !important;
  }
}



