/* ══════════════════════════════════════════════════════════════
   MUNDOS DE FANTASÍA — Redesign Inspired by "The Boat" (SBS)
   Full-viewport cinematic panels · Ink-wash atmosphere
   Horizontal gallery · Minimal chrome · Deep parallax
   ══════════════════════════════════════════════════════════════ */

/* ─── Lenis ─── */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

/* ─── Tokens ─── */
:root {
  --black: #000000;
  --ink: #080808;
  --ink-light: #111111;
  --ink-mid: #1a1a1a;
  --surface: #0d0d0d;
  --text: #e0ddd5;
  --text-dim: #8a8780;
  --text-muted: #55534e;
  --gold: #c8a040;
  --gold-light: #e8c860;
  --gold-glow: rgba(200,160,64,0.3);
  --blue: #4080ff;
  --blue-glow: rgba(64,128,255,0.2);

  --world-japan: linear-gradient(160deg, #d44060, #5a1880);
  --world-transylvania: linear-gradient(160deg, #2a0830, #7a0818);
  --world-egypt: linear-gradient(160deg, #c09848, #302010);
  --world-mexico: linear-gradient(160deg, #e85828, #d8b030);
  --world-germany: linear-gradient(160deg, #1a3810, #060e04);
  --world-india: linear-gradient(160deg, #e88020, #c04000);
  --world-norway: linear-gradient(160deg, #3878a0, #102840);
  --world-spain: linear-gradient(160deg, #b89000, #700000);

  --font-display: 'Cinzel Decorative', serif;
  --font-heading: 'Cinzel', serif;
  --font-body: 'Cormorant Garamond', serif;
  --font-ui: 'Inter', system-ui, sans-serif;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}

/* ─── Reset ─── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { overflow-x: hidden; scrollbar-width: none; }
html::-webkit-scrollbar { display: none; }
body {
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.7;
  color: var(--text);
  background: var(--black);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
::selection { background: var(--gold); color: var(--black); }

/* ══════════════════════════════════════════════════════════════
   LOADER
   ══════════════════════════════════════════════════════════════ */
.loader {
  position: fixed; inset: 0; z-index: 9999; background: var(--black);
  display: flex; align-items: center; justify-content: center;
  transition: opacity 1s var(--ease-out), visibility 1s;
}
.loader.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.loader__inner { text-align: center; width: 200px; }
.loader__line {
  width: 60px; height: 1px; margin: 0 auto 2rem;
  background: var(--gold);
  animation: loaderPulse 1.5s ease-in-out infinite;
}
@keyframes loaderPulse {
  0%, 100% { opacity: .3; transform: scaleX(.6); }
  50% { opacity: 1; transform: scaleX(1); }
}
.loader__text {
  font-family: var(--font-ui); font-size: .75rem; font-weight: 400;
  letter-spacing: .2em; text-transform: uppercase; color: var(--text-dim);
  margin-bottom: 1.5rem;
}
.loader__bar-wrap {
  width: 100%; height: 1px; background: rgba(255,255,255,.06); border-radius: 1px;
}
.loader__bar {
  width: 0; height: 100%; background: var(--gold); border-radius: 1px;
  transition: width .3s;
}

/* ══════════════════════════════════════════════════════════════
   AMBIENT DUST CANVAS
   ══════════════════════════════════════════════════════════════ */
.ambient-dust {
  position: fixed; inset: 0; z-index: 1; pointer-events: none;
  opacity: .4;
}

/* ══════════════════════════════════════════════════════════════
   NAVIGATION — almost invisible
   ══════════════════════════════════════════════════════════════ */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.5rem 2.5rem;
  opacity: 0; transform: translateY(-20px);
  transition: opacity .6s, transform .6s, background .4s;
}
.nav.is-visible { opacity: 1; transform: translateY(0); }
.nav.is-scrolled {
  background: rgba(0,0,0,.85); backdrop-filter: blur(20px);
  padding: .8rem 2.5rem;
}
.nav__logo {
  font-family: var(--font-heading); font-size: .85rem; font-weight: 600;
  letter-spacing: .08em; color: var(--gold);
}
.nav__links { display: flex; gap: 2.5rem; }
.nav__link {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 400;
  letter-spacing: .06em; color: var(--text-dim);
  transition: color .3s; position: relative;
}
.nav__link::after {
  content: ''; position: absolute; bottom: -4px; left: 0;
  width: 0; height: 1px; background: var(--gold);
  transition: width .4s var(--ease-out);
}
.nav__link:hover { color: var(--gold-light); }
.nav__link:hover::after { width: 100%; }

.nav__menu-btn {
  display: none; background: none; border: none; cursor: pointer;
  padding: 8px; flex-direction: column; gap: 6px;
}
.nav__menu-btn span {
  width: 22px; height: 1px; background: var(--gold);
  transition: all .3s; display: block;
}
.nav__menu-btn.is-open span:first-child { transform: rotate(45deg) translate(4px, 4px); }
.nav__menu-btn.is-open span:last-child { transform: rotate(-45deg) translate(4px, -4px); }

@media (max-width: 768px) {
  .nav__links { display: none; }
  .nav__menu-btn { display: flex; }
}

.mobile-menu {
  position: fixed; inset: 0; z-index: 99; background: rgba(0,0,0,.96);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3rem; opacity: 0; visibility: hidden; transition: all .5s var(--ease-out);
}
.mobile-menu.is-open { opacity: 1; visibility: visible; }
.mobile-menu__link {
  font-family: var(--font-heading); font-size: 1.5rem; color: var(--text-dim);
  letter-spacing: .05em; transition: color .3s;
}
.mobile-menu__link:hover { color: var(--gold-light); }

/* ══════════════════════════════════════════════════════════════
   HERO — Cinematic full-viewport opening
   ══════════════════════════════════════════════════════════════ */
.hero {
  position: relative; height: 300vh; /* tall for pin + zoom */
  overflow: hidden;
}
.hero__ink {
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
}
.hero__ink--1 {
  background: radial-gradient(ellipse at 30% 60%, rgba(20,18,30,.8) 0%, transparent 60%);
  animation: inkDrift 25s ease-in-out infinite alternate;
}
.hero__ink--2 {
  background: radial-gradient(ellipse at 70% 40%, rgba(200,160,64,.03) 0%, transparent 50%);
  animation: inkDrift 30s ease-in-out infinite alternate-reverse;
}
.hero__ink--3 {
  background: radial-gradient(ellipse at 50% 80%, rgba(64,128,255,.02) 0%, transparent 50%);
  animation: inkDrift 20s ease-in-out infinite alternate;
}
@keyframes inkDrift {
  0% { transform: translate(-3%, -2%) scale(1); }
  100% { transform: translate(3%, 2%) scale(1.05); }
}

.hero__stars {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
}

.hero__content {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  z-index: 5; text-align: center;
  padding: 2rem;
}
.hero__tag {
  font-family: var(--font-ui); font-size: .7rem; font-weight: 400;
  letter-spacing: .35em; text-transform: uppercase; color: var(--gold);
  margin-bottom: 2rem; opacity: 0;
}
.hero__title {
  font-family: var(--font-display);
  display: flex; flex-wrap: wrap; justify-content: center; gap: .25em .4em;
  line-height: 1.05; margin-bottom: 2.5rem;
}
.hero__word {
  font-size: clamp(3rem, 9vw, 7rem); font-weight: 900;
  color: var(--text); opacity: 0; transform: translateY(80px);
  display: inline-block;
}
.hero__word--dim { color: var(--text-dim); font-weight: 400; }
.hero__word--accent {
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero__desc {
  font-family: var(--font-body); font-size: clamp(1rem, 2vw, 1.3rem);
  color: var(--text-dim); max-width: 480px; opacity: 0; transform: translateY(30px);
  line-height: 1.8;
}

.hero__scroll {
  position: fixed; bottom: 3rem; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: .8rem;
  z-index: 5; opacity: 0;
}
.hero__scroll-line {
  width: 1px; height: 50px; background: linear-gradient(180deg, transparent, var(--gold));
  animation: scrollLine 2s ease-in-out infinite;
}
@keyframes scrollLine {
  0% { transform: scaleY(0); transform-origin: top; opacity: 0; }
  50% { transform: scaleY(1); transform-origin: top; opacity: 1; }
  50.01% { transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
}
.hero__scroll-text {
  font-family: var(--font-ui); font-size: .6rem; letter-spacing: .25em;
  text-transform: uppercase; color: var(--gold); opacity: .5;
}

/* ══════════════════════════════════════════════════════════════
   INK WIPE TRANSITIONS
   ══════════════════════════════════════════════════════════════ */
.ink-wipe {
  position: relative; z-index: 10; margin-top: -1px;
  color: var(--ink); line-height: 0;
}
.ink-wipe svg { width: 100%; height: auto; display: block; }

/* ══════════════════════════════════════════════════════════════
   SECTION TYPOGRAPHY
   ══════════════════════════════════════════════════════════════ */
.section-tag {
  display: inline-block; font-family: var(--font-ui); font-size: .65rem;
  font-weight: 500; letter-spacing: .25em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 1.5rem;
  padding-bottom: .5rem; border-bottom: 1px solid rgba(200,160,64,.2);
}
.section-title {
  font-family: var(--font-heading); font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 600; color: var(--text); margin-bottom: 1rem;
  letter-spacing: .02em; line-height: 1.15;
}
.section-desc {
  font-family: var(--font-body); font-size: 1.15rem;
  color: var(--text-dim); max-width: 520px; margin: 0 auto;
  line-height: 1.8;
}

/* ══════════════════════════════════════════════════════════════
   NEXUS — Tree + Globe (cinematic full viewport)
   ══════════════════════════════════════════════════════════════ */
.nexus {
  position: relative; min-height: 110vh;
  background: var(--ink);
  padding: 6rem 0 4rem; overflow: hidden;
}
.nexus__fog {
  position: absolute; inset: 0; pointer-events: none;
}
.nexus__fog--1 {
  background: radial-gradient(ellipse at 40% 80%, rgba(200,160,64,.03) 0%, transparent 50%);
  animation: inkDrift 22s ease-in-out infinite alternate;
}
.nexus__fog--2 {
  background: radial-gradient(ellipse at 60% 30%, rgba(64,200,128,.02) 0%, transparent 50%);
  animation: inkDrift 28s ease-in-out infinite alternate-reverse;
}
.nexus__header {
  text-align: center; margin-bottom: 2rem; position: relative; z-index: 10;
  padding: 0 2rem;
}
.nexus__stage {
  position: relative; width: 100%; max-width: 1000px; margin: 0 auto;
  height: 80vh; min-height: 550px; max-height: 850px;
}
.nexus__canvas {
  position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1;
  cursor: grab;
}
.nexus__canvas:active { cursor: grabbing; }

/* Globe wrap */
.nexus__globe-wrap {
  position: absolute; top: 5%; left: 50%; transform: translateX(-50%);
  width: clamp(260px, 38vw, 440px); height: clamp(260px, 38vw, 440px);
  z-index: 5; pointer-events: none;
}
.nexus__globe-halo {
  position: absolute; inset: -15%; border-radius: 50%;
  border: 1px solid rgba(64,180,255,.06);
  box-shadow: 0 0 80px rgba(64,180,255,.04);
  animation: haloSpin 40s linear infinite;
}
@keyframes haloSpin { to { transform: rotate(360deg); } }
.nexus__globe-container {
  width: 100%; height: 100%; border-radius: 50%; overflow: hidden;
  position: relative; z-index: 2; cursor: grab;
}
.nexus__globe-container:active { cursor: grabbing; }
.nexus__globe-container canvas { width: 100% !important; height: 100% !important; border-radius: 50%; }

/* Globe labels */
.globe-labels { position: absolute; inset: 0; z-index: 8; pointer-events: none; }
.globe-label {
  position: absolute; display: flex; align-items: center; gap: 6px;
  pointer-events: all; text-decoration: none;
  opacity: 0; transform: scale(.8); transition: opacity .3s, transform .3s;
}
.globe-label.is-visible { opacity: 1; transform: scale(1); }
.globe-label__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold); box-shadow: 0 0 8px var(--gold-glow);
  animation: dotPulse 2.5s ease-in-out infinite;
}
@keyframes dotPulse {
  0%, 100% { box-shadow: 0 0 8px var(--gold-glow); }
  50% { box-shadow: 0 0 16px var(--gold-glow); }
}
.globe-label__name {
  font-family: var(--font-ui); font-size: .65rem; font-weight: 500;
  color: var(--gold); letter-spacing: .04em; white-space: nowrap;
  background: rgba(0,0,0,.7); backdrop-filter: blur(8px);
  padding: 3px 10px; border-radius: 10px;
  border: 1px solid rgba(200,160,64,.1);
  opacity: 0; transform: translateX(-6px); transition: all .3s;
}
.globe-label:hover .globe-label__name { opacity: 1; transform: translateX(0); }

/* Genre ornaments */
.nexus__ornaments { position: absolute; inset: 0; z-index: 10; pointer-events: none; }
.ornament {
  position: absolute; display: flex; flex-direction: column; align-items: center;
  text-align: center; pointer-events: all; cursor: pointer; text-decoration: none;
  transform: translate(-50%, -50%) scale(0);
  transition: transform .5s var(--ease-out);
}
.ornament.is-visible { transform: translate(-50%, -50%) scale(1); }
.ornament:hover { transform: translate(-50%, -50%) scale(1.3) !important; }
.ornament__dot {
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--gold); border: 2px solid rgba(0,0,0,.5);
  box-shadow: 0 0 12px var(--gold-glow);
  transition: all .3s;
}
.ornament:hover .ornament__dot {
  width: 18px; height: 18px; box-shadow: 0 0 24px var(--gold-glow);
}
.ornament__label {
  font-family: var(--font-ui); font-size: .55rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold); margin-top: 4px; white-space: nowrap;
  text-shadow: 0 0 20px rgba(0,0,0,.9);
  opacity: 0; transform: translateY(-4px);
  transition: all .3s;
}
.ornament:hover .ornament__label { opacity: 1; transform: translateY(0); }

/* ══════════════════════════════════════════════════════════════
   WORLDS — Horizontal scroll gallery (like film frames)
   ══════════════════════════════════════════════════════════════ */
.worlds {
  position: relative; background: var(--black);
  padding: 0; overflow: hidden;
}
.worlds__header {
  text-align: center; padding: 6rem 2rem 3rem;
  position: relative; z-index: 2;
}
.worlds__track-wrap {
  overflow: hidden; position: relative;
}
.worlds__track {
  display: flex; gap: 0;
  width: max-content;
  will-change: transform;
}
.world-panel {
  width: 45vw; min-width: 320px; max-width: 500px;
  height: 70vh; min-height: 400px; max-height: 600px;
  flex-shrink: 0; position: relative; overflow: hidden;
}
.world-panel__link {
  display: block; width: 100%; height: 100%;
  position: relative; text-decoration: none;
}
.world-panel__bg {
  position: absolute; inset: 0;
  transition: transform .8s var(--ease-out);
}
.world-panel__link:hover .world-panel__bg {
  transform: scale(1.08);
}
[data-country="japan"] .world-panel__bg { background: var(--world-japan); }
[data-country="transylvania"] .world-panel__bg { background: var(--world-transylvania); }
[data-country="egypt"] .world-panel__bg { background: var(--world-egypt); }
[data-country="mexico"] .world-panel__bg { background: var(--world-mexico); }
[data-country="germany"] .world-panel__bg { background: var(--world-germany); }
[data-country="india"] .world-panel__bg { background: var(--world-india); }
[data-country="norway"] .world-panel__bg { background: var(--world-norway); }
[data-country="spain"] .world-panel__bg { background: var(--world-spain); }

.world-panel__content {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 3rem 2rem 2rem;
  background: linear-gradient(transparent, rgba(0,0,0,.8));
  z-index: 2;
}
.world-panel__count {
  font-family: var(--font-ui); font-size: .6rem; font-weight: 500;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold); display: block; margin-bottom: .5rem;
}
.world-panel__name {
  font-family: var(--font-heading); font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 700; color: #fff; margin-bottom: .3rem;
}
.world-panel__vibe {
  font-family: var(--font-ui); font-size: .7rem; color: rgba(255,255,255,.5);
  letter-spacing: .06em;
}

/* ══════════════════════════════════════════════════════════════
   FEATURED — Full-screen cinematic story preview
   ══════════════════════════════════════════════════════════════ */
.featured {
  position: relative; height: 100vh; min-height: 600px;
  display: flex; align-items: center;
  overflow: hidden;
}
.featured__scene {
  position: absolute; inset: 0; z-index: 0;
}
.featured__layer {
  position: absolute; inset: 0; will-change: transform;
}
.featured__layer--sky {
  background: linear-gradient(180deg, #060618 0%, #0e0e30 40%, #1a1040 70%, #2a1550 100%);
}
.featured__layer--moon {
  background: radial-gradient(circle at 80% 20%, rgba(255,255,220,.6) 0%, rgba(255,255,200,.15) 5%, transparent 15%);
}
.featured__layer--mountains-far { bottom: 0; top: auto; height: 50%; }
.featured__layer--mountains-far::before {
  content: ''; position: absolute; inset: 0; background: #120830;
  clip-path: polygon(0% 100%,0% 55%,15% 25%,30% 45%,45% 15%,55% 30%,70% 10%,85% 35%,100% 25%,100% 100%);
}
.featured__layer--mountains-near { bottom: 0; top: auto; height: 40%; }
.featured__layer--mountains-near::before {
  content: ''; position: absolute; inset: 0; background: #0a0620;
  clip-path: polygon(0% 100%,0% 65%,10% 40%,25% 55%,40% 30%,55% 50%,65% 35%,80% 45%,100% 40%,100% 100%);
}
.featured__layer--trees { bottom: 0; top: auto; height: 30%; }
.featured__layer--trees::before {
  content: ''; position: absolute; inset: 0; background: #060418;
  clip-path: polygon(0% 100%,0% 45%,3% 25%,6% 45%,9% 20%,12% 40%,15% 22%,18% 42%,21% 18%,24% 38%,27% 25%,30% 45%,33% 22%,36% 40%,39% 18%,42% 36%,45% 28%,48% 48%,51% 22%,54% 42%,57% 30%,60% 48%,63% 25%,66% 40%,69% 18%,72% 38%,75% 28%,78% 46%,81% 22%,84% 40%,87% 30%,90% 50%,93% 28%,96% 45%,100% 38%,100% 100%);
}
.featured__layer--ground { bottom: 0; top: auto; height: 12%; background: #040310; }
.featured__layer--fog {
  background: linear-gradient(transparent 60%, rgba(4,3,16,.6) 100%);
}

.featured__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, rgba(0,0,0,.7) 0%, rgba(0,0,0,.3) 50%, transparent 100%);
}
.featured__content {
  position: relative; z-index: 2;
  max-width: 520px; padding: 4rem;
}
.featured__meta {
  display: flex; align-items: center; gap: .8rem;
  font-family: var(--font-ui); font-size: .7rem; color: var(--text-dim);
  letter-spacing: .06em; margin-bottom: 1.5rem;
}
.featured__sep { color: var(--gold); }
.featured__title {
  font-family: var(--font-display); font-size: clamp(2.5rem, 6vw, 4.5rem);
  font-weight: 900; line-height: 1.05; color: var(--text);
  margin-bottom: 1.5rem;
}
.featured__excerpt {
  font-family: var(--font-body); font-size: 1.1rem; font-style: italic;
  color: var(--text-dim); line-height: 1.85; margin-bottom: 2rem;
  border-left: 2px solid var(--gold); padding-left: 1.5rem;
}
.featured__stats {
  display: flex; gap: 2rem; margin-bottom: 2.5rem;
}
.featured__stat {
  font-family: var(--font-ui); font-size: .75rem; color: var(--text-muted);
  letter-spacing: .04em;
}
.featured__stat strong {
  display: block; font-family: var(--font-heading); font-size: 1.3rem;
  color: var(--gold-light); font-weight: 700; margin-bottom: 2px;
}

/* Enter button */
.btn-enter {
  display: inline-flex; align-items: center; gap: 1rem;
  padding: 1rem 2rem; border: 1px solid rgba(200,160,64,.3);
  border-radius: 0; background: transparent; color: var(--gold);
  font-family: var(--font-ui); font-size: .8rem; font-weight: 500;
  letter-spacing: .08em; text-transform: uppercase;
  transition: all .4s var(--ease-out); cursor: pointer;
}
.btn-enter:hover {
  background: var(--gold); color: var(--black);
  border-color: var(--gold); padding-right: 2.5rem;
}
.btn-enter__arrow {
  width: 20px; height: 20px; transition: transform .4s var(--ease-out);
}
.btn-enter:hover .btn-enter__arrow { transform: translateX(6px); }

/* ══════════════════════════════════════════════════════════════
   FOOTER — Minimal
   ══════════════════════════════════════════════════════════════ */
.footer {
  background: var(--black); border-top: 1px solid rgba(255,255,255,.04);
  padding: 4rem 2.5rem 3rem;
}
.footer__inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: flex-start; justify-content: space-between;
  flex-wrap: wrap; gap: 2rem;
}
.footer__logo {
  font-family: var(--font-heading); font-size: .9rem; font-weight: 600;
  color: var(--gold); letter-spacing: .05em; display: block; margin-bottom: .5rem;
}
.footer__tagline {
  font-family: var(--font-body); font-size: .9rem; color: var(--text-muted);
}
.footer__links {
  display: flex; gap: 2rem;
}
.footer__links a {
  font-family: var(--font-ui); font-size: .75rem; color: var(--text-muted);
  letter-spacing: .04em; transition: color .3s;
}
.footer__links a:hover { color: var(--gold); }
.footer__copy {
  width: 100%; font-family: var(--font-ui); font-size: .65rem;
  color: var(--text-muted); margin-top: 1rem;
  padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.04);
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .nexus__globe-wrap { width: clamp(200px, 42vw, 340px); height: clamp(200px, 42vw, 340px); }
  .nexus__stage { height: 70vh; min-height: 480px; }
  .world-panel { width: 65vw; min-width: 280px; }
  .featured__content { padding: 3rem 2rem; }
}

@media (max-width: 768px) {
  .nav { padding: 1rem 1.5rem; }
  .hero__word { font-size: clamp(2.5rem, 12vw, 4rem); }
  .world-panel { width: 80vw; }
  .featured__overlay {
    background: linear-gradient(0deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.4) 50%, transparent 100%);
  }
  .featured__content { max-width: 100%; }
  .footer__inner { flex-direction: column; }
}

@media (max-width: 480px) {
  .nexus__globe-wrap { width: 180px; height: 180px; }
  .nexus__stage { height: 60vh; min-height: 400px; }
  .world-panel { width: 85vw; min-width: 260px; height: 50vh; }
  .featured__title { font-size: clamp(2rem, 10vw, 3rem); }
  .featured__content { padding: 2rem 1.5rem; }
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
  .hero { height: 100vh; }
}