/* Homepage integration for the commissioned Folded World scene.
   The outer .hero-bg-wrap remains the existing GSAP/layout shell; Three.js
   owns only the namespaced contents below. */
.hero-hybrid .folded-world-scene{
  isolation:isolate;
  z-index:1;
  overflow:visible;
  contain:layout style;
  margin-right:0!important;
}

.hero-hybrid .hero-inner{position:relative;z-index:3;}
.hero-hybrid .hero-trustline{flex-wrap:wrap;row-gap:8px;}
.hero-hybrid .hero-trustline .sep{display:none;}
.hero-hybrid .hero-trustline .support-badge{flex:0 0 100%;justify-content:flex-start;}

.folded-world-halo{
  display:none;
  position:absolute;
  z-index:0;
  left:4%;
  top:9%;
  width:94%;
  height:82%;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(ellipse at 58% 48%,rgba(219,176,82,.18) 0%,rgba(199,154,62,.08) 35%,rgba(199,154,62,0) 72%);
  filter:blur(18px);
}

@media(min-width:921px){
  .hero-hybrid{
    padding-top:clamp(126px,13vh,156px);
    padding-bottom:112px;
  }
  .hero-hybrid .hero-badge-row{margin-bottom:20px;}
  .hero-hybrid .hero-support{margin-top:22px;}
  .hero-hybrid .hero-actions{margin-top:26px;}
  .hero-hybrid .hero-trustline{margin-top:24px;}
  .hero-hybrid .hero-art.hero-bg-wrap.folded-world-scene{
    width:calc(100% + clamp(128px,calc(12vw + 32px),202px));
    left:-64px;
  }
  .hero-hybrid .hero-title em{white-space:nowrap;}
  .hero-hybrid .hero-trustline{flex-wrap:wrap;}
  .hero-hybrid .hero-trustline span{white-space:nowrap;}
}

@media(max-width:640px){
  .hero-hybrid .hero-trustline .support-badge{justify-content:center;}
}

@media(min-width:921px) and (max-width:1080px){
  .hero-hybrid .hero-art.hero-bg-wrap.folded-world-scene{
    width:calc(100% + 114px);
    left:-48px;
  }
}

@media(min-width:921px) and (max-height:720px){
  .hero-hybrid{padding-top:122px;padding-bottom:94px;}
  .hero-hybrid .hero-title,
  .hero-hybrid .hero-title.lead{font-size:clamp(56px,5.7vw,78px);}
  .hero-hybrid .folded-world-scene{min-height:470px;}
}

.hero-hybrid .hero-art img.folded-world-poster,
.folded-world-canvas{
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
}

.hero-hybrid .hero-art img.folded-world-poster{
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 32px 36px rgba(0,0,0,.38));
  opacity:1;
  transition:opacity .65s cubic-bezier(.16,.8,.24,1);
}

.folded-world-canvas{
  opacity:0;
  pointer-events:none;
  transition:opacity .65s cubic-bezier(.16,.8,.24,1);
}

@media(min-width:921px){
  .hero-hybrid .hero-art img.folded-world-poster,
  .hero-hybrid .folded-world-canvas{
    top:-56px;
    bottom:auto;
    height:calc(100% + 112px);
  }
}

.webgl-ready .hero-hybrid .folded-world-canvas{opacity:1;}
.webgl-ready .hero-hybrid .hero-art img.folded-world-poster{opacity:0;}
.static-fallback .hero-hybrid .folded-world-canvas,
.webgl-fallback .hero-hybrid .folded-world-canvas{display:none;}

/* On desktop the live scene is the primary artwork. Keep the poster hidden
   during the first uncached WebGL load so it cannot flash as a second map.
   It remains available for reduced-motion, save-data and genuine WebGL
   fallback modes, and continues to power the mobile presentation. */
@media(min-width:701px){
  .hero-hybrid .hero-art img.folded-world-poster{opacity:0;}
  .static-fallback .hero-hybrid .hero-art img.folded-world-poster,
  .webgl-fallback .hero-hybrid .hero-art img.folded-world-poster{opacity:1;}
}

.folded-world-status{
  position:absolute;
  right:9%;
  bottom:7%;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(235,240,246,.58);
  font-size:9px;
  font-weight:750;
  letter-spacing:.14em;
  text-transform:uppercase;
  transition:opacity .3s ease;
}

.folded-world-status span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--gold-light);
  box-shadow:0 0 12px rgba(230,198,118,.8);
  animation:folded-world-status 1.1s ease-in-out infinite;
}

.webgl-ready .folded-world-status,
.static-fallback .folded-world-status,
.webgl-fallback .folded-world-status{opacity:0;}

@keyframes folded-world-status{
  0%,100%{opacity:.35;transform:scale(.75)}
  50%{opacity:1;transform:scale(1)}
}

@media(max-width:1080px){
  .hero-hybrid .folded-world-scene{min-height:470px;}
}

@media(max-width:920px){
  .hero-hybrid .folded-world-scene{min-height:420px;}
}

@media(max-width:700px){
  .hero-hybrid .hero-art.hero-bg-wrap.folded-world-scene{
    width:100%;
    min-height:276px;
    height:276px;
    margin:10px 0 -18px;
    overflow:visible;
    contain:layout style;
  }
  .mobile-map-stage{
    position:absolute;
    inset:0;
    z-index:1;
    transform:scale(var(--mobile-map-scale,.78));
    transform-origin:center center;
    will-change:transform;
    pointer-events:none;
  }
  .hero-hybrid .hero-art img.folded-world-poster{
    object-position:center;
    filter:drop-shadow(0 22px 27px rgba(0,0,0,.34));
    transform:none;
    will-change:auto;
  }
  .mobile-map-effects{
    position:absolute;
    inset:0;
    z-index:2;
    overflow:hidden;
    -webkit-mask-image:url('../images/folded-world-render.webp');
    mask-image:url('../images/folded-world-render.webp');
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    -webkit-mask-position:center;
    mask-position:center;
    -webkit-mask-size:contain;
    mask-size:contain;
    pointer-events:none;
  }
  .mobile-route-sweep{
    position:absolute;
    top:5%;
    bottom:5%;
    left:-42%;
    width:34%;
    border-radius:50%;
    opacity:0;
    background:linear-gradient(90deg,transparent,rgba(255,226,145,.1) 22%,rgba(255,230,156,.68) 50%,rgba(255,226,145,.1) 78%,transparent);
    filter:blur(8px);
    mix-blend-mode:screen;
    transform:skewX(-12deg);
    will-change:transform,opacity;
  }
  .mobile-map-effects.is-active .mobile-route-sweep{animation:mobileRouteSweep 4.8s cubic-bezier(.42,0,.2,1) .2s 1 both;}
  .mobile-destination-pulses{
    position:absolute;
    inset:0;
    z-index:3;
    display:block;
    width:100%;
    height:100%;
    overflow:visible;
    pointer-events:none;
    mix-blend-mode:screen;
  }
  .mobile-destination-halo,
  .mobile-destination-ring,
  .mobile-destination-core{
    transform-box:fill-box;
    transform-origin:center;
    will-change:transform,opacity;
  }
  .mobile-destination-halo{
    fill:rgba(229,178,71,.28);
    opacity:.42;
    filter:blur(8px);
  }
  .mobile-destination-ring{
    fill:none;
    stroke:rgba(255,229,157,.94);
    stroke-width:4;
    opacity:0;
  }
  .mobile-destination-core{
    fill:#ffe6a5;
    opacity:.82;
    filter:drop-shadow(0 0 9px rgba(241,192,82,.96));
  }
  .mobile-map-effects.is-active .mobile-destination-halo{
    animation:mobileDestinationHalo 2.65s ease-in-out var(--pulse-delay) infinite;
  }
  .mobile-map-effects.is-active .mobile-destination-ring{
    animation:mobileDestinationRing 2.65s cubic-bezier(.2,.65,.3,1) var(--pulse-delay) infinite;
  }
  .mobile-map-effects.is-active .mobile-destination-core{
    animation:mobileDestinationCore 2.65s ease-in-out var(--pulse-delay) infinite;
  }
  @keyframes mobileRouteSweep{
    0%,12%{opacity:0;transform:translate3d(0,0,0) skewX(-12deg);}
    24%{opacity:.86;}
    72%{opacity:.72;}
    88%,100%{opacity:0;transform:translate3d(430%,0,0) skewX(-12deg);}
  }
  @keyframes mobileDestinationHalo{
    0%,100%{opacity:.3;transform:scale(.72);}
    46%{opacity:.74;transform:scale(1.25);}
  }
  @keyframes mobileDestinationRing{
    0%{opacity:.82;transform:scale(.46);}
    72%,100%{opacity:0;transform:scale(2.35);}
  }
  @keyframes mobileDestinationCore{
    0%,100%{opacity:.72;transform:scale(.82);}
    46%{opacity:1;transform:scale(1.28);}
  }
  .folded-world-halo{display:block;left:8%;top:13%;width:84%;height:72%;filter:blur(15px);}
  .folded-world-status{display:none;}
}

@media(max-width:390px){
  .hero-hybrid .hero-art.hero-bg-wrap.folded-world-scene{min-height:244px;height:244px;margin-top:8px;}
}

@media(prefers-reduced-motion:reduce){
  .folded-world-canvas{display:none;}
  .hero-hybrid .hero-art img.folded-world-poster{opacity:1!important;transition:none;transform:none!important;}
  .mobile-map-stage{transform:none!important;}
  .mobile-map-effects{display:none!important;}
  .folded-world-status{display:none;}
}