/* ===== CHOOSER HERO (video background) ===== */
.chooser-hero{
  position:relative; height:100vh; min-height:560px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:var(--ink);
}
.chooser-video-bg{
  position:absolute; inset:0; z-index:0;
  width:100%; height:100%; object-fit:cover; object-position:center;
}
.chooser-overlay{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(ellipse 900px 500px at 50% 30%, rgba(184,135,74,0.14), transparent 60%),
    linear-gradient(180deg, rgba(11,12,14,0.55) 0%, rgba(11,12,14,0.75) 60%, rgba(11,12,14,0.96) 100%);
}
@media (prefers-reduced-motion: reduce){ .chooser-video-bg{display:none;} }

.chooser-hero-content{position:relative; z-index:2; text-align:center; padding:0 24px;}
.chooser-banner{max-width:440px; width:80%; height:auto; display:inline-block;}
.chooser-tagline{
  margin-top:22px; font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:2px;
  text-transform:uppercase; color:var(--bone-dim);
}

.scroll-cue{
  position:absolute; bottom:40px; left:50%; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  color:var(--bone-dim); font-family:'IBM Plex Mono',monospace; font-size:11px;
  letter-spacing:1.5px; text-transform:uppercase; text-align:center;
  animation:cue-bob 2.2s ease-in-out infinite;
}
.scroll-cue:hover{color:var(--brass-bright);}
@keyframes cue-bob{ 0%,100%{transform:translate(-50%,0);} 50%{transform:translate(-50%,8px);} }
@media (prefers-reduced-motion: reduce){ .scroll-cue{animation:none;} }

/* ===== GLOBE SECTION (scroll-driven rotation) ===== */
.globe-section{position:relative; height:280vh;}
.globe-stage{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:
    radial-gradient(ellipse 900px 600px at 50% 20%, rgba(184,135,74,0.08), transparent 60%),
    var(--ink);
  padding:32px;
}
.globe-heading{text-align:center; margin-bottom:48px; z-index:2; position:relative;}
.globe-heading h1{font-family:'Fraunces',serif; font-weight:500; font-size:clamp(26px,4vw,42px); color:var(--bone);}
.globe-heading .sub{color:var(--bone-dim); font-size:13px; margin-top:10px; line-height:1.6; max-width:520px;}

.globe-scene{
  perspective:1400px; width:100%; max-width:560px; height:280px;
  display:flex; align-items:center; justify-content:center; position:relative;
}
.globe-ring{
  position:relative; width:150px; height:150px;
  transform-style:preserve-3d; will-change:transform;
}
.flag-card{
  position:absolute; top:0; left:0; width:150px; height:150px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  backface-visibility:hidden; text-decoration:none;
}
.flag-card:nth-child(1){transform:rotateY(0deg) translateZ(230px);}
.flag-card:nth-child(2){transform:rotateY(60deg) translateZ(230px);}
.flag-card:nth-child(3){transform:rotateY(120deg) translateZ(230px);}
.flag-card:nth-child(4){transform:rotateY(180deg) translateZ(230px);}
.flag-card:nth-child(5){transform:rotateY(240deg) translateZ(230px);}
.flag-card:nth-child(6){transform:rotateY(300deg) translateZ(230px);}

.flag-card img{
  width:76px; height:76px; border-radius:50%; object-fit:cover;
  border:2px solid var(--line-strong); background:var(--panel);
  transition:border-color .2s, transform .2s, box-shadow .2s;
}
.flag-card span{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:1px;
  color:var(--bone-dim); transition:color .2s;
}
.flag-card:hover img{border-color:var(--brass); transform:scale(1.1); box-shadow:0 0 24px rgba(184,135,74,0.25);}
.flag-card:hover span{color:var(--brass-bright);}

.globe-shadow{
  position:absolute; bottom:6px; left:50%; transform:translateX(-50%);
  width:190px; height:26px; border-radius:50%;
  background:radial-gradient(ellipse, rgba(0,0,0,0.55), transparent 70%);
  filter:blur(4px); z-index:0;
}

.globe-hint{
  margin-top:52px; font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:1px;
  text-transform:uppercase; color:var(--bone-dim); z-index:2; position:relative; text-align:center;
}

@media (max-width:640px){
  .globe-scene{height:220px;}
  .globe-ring{width:110px; height:110px;}
  .flag-card{width:110px; height:110px;}
  .flag-card img{width:58px; height:58px;}
  .flag-card:nth-child(1){transform:rotateY(0deg) translateZ(160px);}
  .flag-card:nth-child(2){transform:rotateY(60deg) translateZ(160px);}
  .flag-card:nth-child(3){transform:rotateY(120deg) translateZ(160px);}
  .flag-card:nth-child(4){transform:rotateY(180deg) translateZ(160px);}
  .flag-card:nth-child(5){transform:rotateY(240deg) translateZ(160px);}
  .flag-card:nth-child(6){transform:rotateY(300deg) translateZ(160px);}
  .globe-section{height:240vh;}
}