:root{--navy:#061a3e;--navy2:#0b325a;--teal:#35cdbf;--gold:#ffd15d;--paper:#fff4d9;--wood:#bc681e}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-snap-type:y proximity}
body{margin:0;overflow-x:hidden;background:#071a3e;color:#fff;font-family:"Nunito Sans",sans-serif}
a{color:inherit;text-decoration:none}
.stack-nav{position:fixed;z-index:20;top:0;left:0;width:94px}
.public-header-backdrop{position:fixed;z-index:14;top:0;right:0;left:0;height:94px;pointer-events:none;background:rgb(4 27 60/.96);box-shadow:0 5px 18px rgb(0 19 46/.38);opacity:0;transition:opacity .3s ease}
body.inner-section .public-header-backdrop{opacity:1}
.stack-burger{display:grid;place-content:center;gap:7px;width:94px;height:112px;border:0;background:#bd681e;cursor:pointer}
.stack-burger span{display:block;width:35px;height:3px;background:#fff4c5;transition:.3s}
.stack-burger.open span:nth-child(1){transform:translateY(10px) rotate(45deg)}
.stack-burger.open span:nth-child(2){opacity:0}
.stack-burger.open span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}
.stack-nav-list{display:flex;height:0;overflow:hidden;flex-direction:column;transition:height .42s cubic-bezier(.175,.885,.32,1.275)}
.stack-nav-list.open{height:calc(100svh - 112px)}
.stack-nav-list a{display:flex;flex:1;align-items:center;justify-content:center;gap:7px;writing-mode:vertical-rl;background:#163a60;color:#fff;padding:7px;font-size:11px;font-weight:900}
.stack-nav-list a:nth-child(2){background:#087f7e}
.stack-nav-list a:nth-child(3){background:#7652af}
.stack-nav-list a:nth-child(4){background:#bf681e}
.stack-nav-list svg{width:21px}
.stack-brand{position:fixed;z-index:15;top:22px;left:122px;display:flex;align-items:center;gap:9px;font-size:17px;font-weight:900;line-height:.85;text-shadow:0 2px 8px #061a3e}
.stack-brand img{width:52px;height:52px;border-radius:50%;object-fit:cover}
.stack-brand b{color:#50e4d6}
.access-link{position:fixed;z-index:15;top:31px;right:32px;display:flex;align-items:center;gap:7px;border:1px solid rgb(255 255 255/.37);border-radius:99px;padding:10px 15px;background:rgb(3 20 49/.4);backdrop-filter:blur(8px);font-size:13px;font-weight:900}
.access-link svg{width:16px}
.stack-panel{position:relative;display:grid;min-height:100svh;isolation:isolate;overflow:hidden;scroll-snap-align:start;place-items:center}
.panel-background{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover}
.panel-overlay{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgb(2 16 45/.88),rgb(4 27 60/.52) 55%,rgb(4 19 45/.22))}
.panel-content{width:min(1120px,calc(100% - 180px));opacity:0;transform:scale(.72) rotateX(-24deg) translateY(60px);transform-origin:center 80%;transition:opacity .65s ease,transform .75s cubic-bezier(.175,.885,.32,1.275)}
.stack-panel.is-active .panel-content{opacity:1;transform:none}
.eyebrow{margin:0 0 12px;color:var(--gold);font-size:11px;font-weight:1000;letter-spacing:.14em}
h1,h2,h3{font-family:Bungee,sans-serif;letter-spacing:-.035em}
h1{margin:0;font-size:clamp(43px,6vw,78px);line-height:1.04}
h1 em,h2 em{color:var(--gold);font-style:normal}
.home-content{align-self:center;max-width:590px;margin-right:auto;padding-top:80px}
.home-content>p:not(.eyebrow){max-width:510px;margin:22px 0;color:#e3efff;font-size:18px;line-height:1.55}
.home-explorers{position:absolute;right:max(4%,calc((100vw - 1250px)/2));bottom:-19px;width:min(500px,39vw);filter:drop-shadow(0 22px 20px rgb(0 0 0/.35));animation:floatExplorer 5.5s ease-in-out infinite}
.panel-home .panel-overlay{background:linear-gradient(90deg,rgb(2 16 45/.94),rgb(3 21 51/.7) 34%,rgb(3 21 51/.1) 70%)}
.panel-actions{display:flex;flex-wrap:wrap;gap:12px}
.wood-button,.outline-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;border:3px solid #613516;border-radius:0;clip-path:polygon(0 10%,85% 10%,100% 50%,85% 90%,0 90%,7% 50%);padding:0 36px 0 30px;background:linear-gradient(180deg,#c9843f 0%,#a45c26 12%,#874519 53%,#b86a2b 88%,#713614 100%);box-shadow:inset 0 2px 0 rgb(255 225 156/.5),inset 0 -3px 0 rgb(75 34 12/.35),0 5px 0 #4c260f,0 10px 18px rgb(4 22 39/.28);color:#fff7d5;font:900 15px "Nunito Sans",sans-serif;text-shadow:0 2px 0 #4e260e;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.wood-button::after,.outline-button::after{position:absolute;z-index:-1;inset:0;opacity:.34;background:linear-gradient(4deg,transparent 0 19%,rgb(75 32 8/.75) 20% 22%,transparent 23% 45%,rgb(255 199 102/.45) 46% 48%,transparent 49% 72%,rgb(71 29 8/.7) 73% 76%,transparent 77%);content:""}
.wood-button:hover,.outline-button:hover{transform:translateY(-2px);box-shadow:inset 0 2px 0 rgb(255 225 156/.5),0 7px 0 #4c260f,0 13px 22px rgb(4 22 39/.34)}
.wood-button:active,.outline-button:active{transform:translateY(3px);box-shadow:inset 0 3px 7px rgb(57 23 5/.4),0 1px 0 #4c260f}
.wood-button svg,.outline-button svg{position:relative;z-index:1;width:21px}
.outline-button{border-color:#2a657c;background:linear-gradient(180deg,#1d7189,#0b405e 55%,#092f4c);box-shadow:inset 0 2px 0 rgb(188 247 255/.28),inset 0 -3px 0 rgb(2 26 51/.55),0 5px 0 #06233e;color:#e8f7ff;text-shadow:0 2px 0 #06243f}
.outline-button:hover{box-shadow:inset 0 2px 0 rgb(188 247 255/.28),0 7px 0 #06233e,0 13px 22px rgb(4 22 39/.34)}
.home-points{position:absolute;z-index:2;right:7%;bottom:9%;display:grid;gap:9px}
.home-points span,.world-note{display:flex;align-items:center;gap:8px;border:1px solid rgb(255 233 155/.48);border-radius:16px;padding:10px 13px;background:rgb(2 26 57/.56);backdrop-filter:blur(7px);font-size:12px;font-weight:900}
.home-points svg,.world-note svg{width:18px;color:var(--gold)}
.scroll-cue{position:absolute;z-index:2;bottom:18px;left:50%;display:flex;align-items:center;gap:5px;transform:translateX(-50%);font-size:9px;font-weight:900;letter-spacing:.11em}
.scroll-cue svg{width:18px;animation:bob 1.4s ease-in-out infinite}
.panel-route .panel-overlay{background:linear-gradient(90deg,rgb(3 17 47/.9),rgb(3 20 51/.72),rgb(3 20 51/.34))}
.route-content{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center}
.section-heading h2{margin:0;font-size:clamp(30px,4vw,52px);line-height:1.18}
.section-heading>p:not(.eyebrow){color:#e1efff;font-size:17px;line-height:1.55}
.route-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.route-cards article{position:relative;display:grid;grid-template-columns:42px 1fr;gap:10px;min-height:150px;border:1px solid rgb(255 255 255/.25);border-radius:20px;padding:20px;background:rgb(5 32 67/.65);backdrop-filter:blur(7px)}
.route-cards b{position:absolute;top:12px;right:14px;color:rgb(255 211 97/.5);font:22px Bungee,sans-serif}
.route-icon{display:grid;width:39px;height:39px;place-items:center;border-radius:12px;background:#0ca499;color:#fff5bd}
.route-icon svg{width:21px}
.route-cards h3{margin:6px 0;font-size:15px}
.route-cards p{margin:0;color:#d2e6f8;font-size:12px;line-height:1.4}
.panel-worlds .panel-overlay{background:linear-gradient(90deg,rgb(3 17 46/.92),rgb(3 20 55/.62),rgb(3 20 55/.3))}
.worlds-content{display:grid;grid-template-columns:.8fr 1.2fr;gap:34px;align-items:center}
.world-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.world-card{display:grid;place-items:center;min-height:175px;border:1px solid rgb(255 255 255/.2);border-radius:19px;padding:5px;background:rgb(3 27 62/.53);backdrop-filter:blur(6px);transition:transform .25s}
.world-card:nth-child(4){grid-column:1/2}
.world-card:nth-child(5){grid-column:3/4}
.world-card:hover{transform:translateY(-8px)}
.world-card img{width:100%;height:122px;object-fit:contain}
.world-card span{display:flex;align-items:center;gap:5px;color:#fff4c2;font-size:11px;font-weight:900}
.world-card svg{width:15px;color:var(--gold)}
.world-note{grid-column:1/-1;border-color:rgb(73 240 219/.45);color:#e5ffff}
.panel-membership .panel-overlay{background:linear-gradient(90deg,rgb(3 17 46/.94),rgb(3 20 51/.7),rgb(3 20 51/.33))}
.membership-content{display:grid;grid-template-columns:1fr .72fr;gap:50px;align-items:center}
.membership-copy h2{margin:0;font-size:clamp(30px,4vw,51px);line-height:1.15}
.membership-copy>p:not(.eyebrow){max-width:560px;color:#e2efff;font-size:17px;line-height:1.55}
.membership-copy ul{display:grid;gap:11px;padding:0;list-style:none}
.membership-copy li{display:flex;align-items:center;gap:8px;font-weight:800}
.membership-copy li svg{width:18px;color:var(--gold)}
.membership-box{border:1px solid rgb(255 224 135/.65);border-radius:26px;padding:28px;background:rgb(4 27 60/.8);box-shadow:0 20px 38px rgb(0 0 0/.25);text-align:center;backdrop-filter:blur(10px)}
.membership-box>span{color:var(--gold);font-size:10px;font-weight:1000;letter-spacing:.13em}
.membership-box>strong{display:block;margin:7px 0 0;font:clamp(46px,6vw,67px) Bungee,sans-serif;line-height:1}
.membership-box>strong small{font-size:.45em;vertical-align:top}
.membership-box>p{margin:5px 0 16px;color:#d6f3ed}
.membership-box form{display:grid;gap:9px;text-align:left}
.membership-box label{display:grid;gap:4px;color:#e8f7ff;font-size:11px;font-weight:900}
.membership-box .promo-field{margin-top:4px;color:#ffe095}.membership-box .promo-field small{color:#b9d8ee;font-size:10px;font-weight:700;letter-spacing:0;line-height:1.3}.membership-box .promo-field input{text-transform:uppercase}
.membership-box input{width:100%;border:1px solid rgb(255 255 255/.28);border-radius:10px;padding:10px;background:rgb(255 255 255/.1);color:#fff;font:inherit}
.membership-box input::placeholder{color:#c5d8eb}
.membership-box .wood-button{margin-top:6px}
.membership-box form small{min-height:17px;color:#a4fff0;font-weight:800;text-align:center}
.privacy{display:flex;justify-content:center;align-items:center;gap:5px;color:#d8f7f3;font-size:11px}
.privacy svg{width:16px;color:var(--gold)}
.panel-membership footer{position:absolute;bottom:20px;color:#d9eaff;font-size:11px}
@keyframes floatExplorer{0%,100%{transform:translateY(0)}
50%{transform:translateY(-10px)}
}
@keyframes bob{0%,100%{transform:translateY(0)}
50%{transform:translateY(5px)}
}

@media(max-width:900px){.panel-content{width:min(760px,calc(100% - 150px))}
.home-points{right:4%;bottom:10%}
.route-content,.worlds-content,.membership-content{grid-template-columns:1fr;gap:22px}
.route-content,.worlds-content{padding-top:100px}
.world-showcase{max-width:560px}
.membership-content{padding-top:105px;padding-bottom:45px}
.membership-copy>p:not(.eyebrow){margin-bottom:12px}
.membership-copy ul{grid-template-columns:repeat(2,1fr);font-size:13px}
.panel-membership{min-height:auto;padding:60px 0}
.panel-membership footer{position:static;margin-top:18px}
.home-explorers{width:43vw;right:1%}
}

@media(max-width:620px){html{scroll-snap-type:none}
.public-header-backdrop{height:76px}
.stack-nav{width:64px}
.stack-burger{width:64px;height:76px}
.stack-burger span{width:27px}
.stack-nav-list.open{height:calc(100svh - 76px)}
.stack-brand{top:14px;left:78px;font-size:13px}
.stack-brand img{width:43px;height:43px}
.access-link{top:17px;right:13px;padding:8px 9px;font-size:10px}
.access-link svg{display:none}
.panel-content{width:calc(100% - 42px)}
.panel-home{min-height:780px}
.panel-home .panel-overlay{background:linear-gradient(180deg,rgb(2 16 45/.88),rgb(3 20 51/.64) 54%,rgb(3 20 51/.08))}
.home-content{align-self:start;padding-top:125px}
.home-content h1{font-size:42px}
.home-content>p:not(.eyebrow){max-width:290px;font-size:15px}
.home-explorers{right:-11%;bottom:-7px;width:83vw}
.home-points{right:auto;left:22px;bottom:28px}
.home-points span{padding:7px 9px;font-size:10px}
.home-points span:nth-child(2),.home-points span:nth-child(3){display:none}
.scroll-cue{display:none}
.route-content,.worlds-content{padding-top:100px;padding-bottom:45px}
.section-heading h2{font-size:29px}
.section-heading>p:not(.eyebrow){font-size:14px}
.route-cards{grid-template-columns:1fr 1fr;gap:8px}
.route-cards article{display:block;min-height:132px;padding:14px}
.route-icon{margin-bottom:7px}
.route-cards b{font-size:16px}
.route-cards h3{font-size:12px}
.route-cards p{font-size:10px}
.world-showcase{grid-template-columns:repeat(2,1fr)}
.world-card{min-height:130px}
.world-card img{height:82px}
.world-card:nth-child(4),.world-card:nth-child(5){grid-column:auto}
.world-card span{font-size:9px}
.world-note{font-size:10px}
.panel-membership{padding:0 0 50px}
.membership-content{padding-top:115px}
.membership-copy h2{font-size:30px}
.membership-copy>p:not(.eyebrow){font-size:14px}
.membership-copy ul{grid-template-columns:1fr;font-size:12px}
.membership-box{padding:21px}
.panel-membership footer{text-align:center;font-size:10px}
}

/* Transición 3D de Stacked: entra con giro, escala y se reinicia al salir. */
.stack-panel { perspective: 1000px; }
.panel-content {
  will-change: transform, opacity;
  transform: scale(.7) rotateX(-230deg);
  transform-origin: center 80%;
  transition: opacity .5s ease, transform .68s cubic-bezier(.175,.885,.32,1.275);
}
.stack-panel.is-active .panel-content { opacity: 1; transform: none; }

/* Portada: composición más equilibrada, con aire a la izquierda y exploradores más contenidos. */
.panel-home .home-content {
  width: min(510px, 48%);
  margin-left: clamp(48px, 9vw, 150px);
  margin-right: 0;
  padding-top: 50px;
}
.panel-home .home-content h1 { font-size: clamp(39px, 5vw, 66px); }
.panel-home .home-content > p:not(.eyebrow) { max-width: 465px; font-size: 17px; }
.panel-home .home-explorers { right: max(7%, calc((100vw - 1180px)/2)); width: min(425px, 34vw); bottom: -10px; }

@media (max-width: 900px) {
  .panel-home .home-content { width: 58%; margin-left: 48px; }
  .panel-home .home-explorers { width: 39vw; right: 4%; }
}

@media (max-width: 620px) {
  .panel-home .home-content { width: 100%; margin-left: 0; padding-top: 123px; }
  .panel-home .home-content h1 { font-size: 38px; }
  .panel-home .home-content > p:not(.eyebrow) { font-size: 14px; }
  .panel-home .home-explorers { width: 73vw; right: -5%; bottom: -3px; }
}

/* Escala real por dispositivo: evita títulos pegados, contenido fuera de vista y personajes dominantes. */
.panel-home .home-content {
  width: min(455px, 42%);
  margin-left: clamp(26px, 5vw, 96px);
  padding-inline: 0;
}
.panel-home .home-content h1 { font-size: clamp(36px, 4.35vw, 58px); }
.panel-home .home-content > p:not(.eyebrow) { font-size: clamp(15px, 1.18vw, 17px); }
.panel-home .home-explorers { width: min(390px, 31vw); right: max(6%, calc((100vw - 1200px) / 2)); }

@media (min-width: 621px) and (max-width: 1024px) {
  .panel-content { width: min(860px, calc(100% - 150px)); }
  .panel-home .home-content { width: min(430px, 54%); margin-left: clamp(26px, 6vw, 70px); }
  .panel-home .home-explorers { width: min(355px, 38vw); right: 3%; }
  .home-points { right: 3%; bottom: 7%; }
  .home-points span { font-size: 10px; padding: 8px 10px; }
}

@media (min-width: 1025px) {
  .panel-home .home-content {
    width: min(1120px, calc(100% - 180px));
    max-width: none;
    margin: 0 auto;
    padding-top: 42px;
    text-align: left;
  }
  .panel-home .home-content > p:not(.eyebrow) { margin-right: 0; margin-left: 0; }
  .panel-home .panel-actions { justify-content: flex-start; }
}

@media (max-width: 620px) {
  .panel-home { min-height: 100svh; }
  .panel-home .home-content {
    width: calc(100% - 42px);
    margin: 0;
    padding: 116px 0 0;
  }
  .panel-home .home-content h1 { max-width: 310px; font-size: clamp(31px, 10vw, 38px); line-height: 1.08; }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 286px; margin: 16px 0; font-size: 14px; line-height: 1.42; }
  .panel-home .home-content .eyebrow { max-width: 310px; font-size: 9px; line-height: 1.35; }
  .panel-home .panel-actions { gap: 10px; }
  .panel-home .wood-button, .panel-home .outline-button { min-height: 47px; padding: 9px 18px; font-size: 13px; }
  .panel-home .home-explorers { width: min(64vw, 290px); right: -1%; bottom: -2px; }
  .panel-home .home-points { display: none; }
  .panel-route, .panel-worlds { min-height: auto; padding: 24px 0; }
  .route-content, .worlds-content { padding-top: 92px; }
}

/* Portada: una zona limpia para leer y otra reservada para los exploradores. */
@media (min-width: 1025px) {
  .panel-home .home-content h1 { max-width: 560px; font-size: clamp(34px, 3.8vw, 52px); }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 445px; }
}

@media (max-width: 620px) {
  .panel-home .home-content { padding-top: 110px; }
  .panel-home .home-content h1 { max-width: 275px; font-size: clamp(28px, 8.6vw, 34px); line-height: 1.08; }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 255px; margin: 13px 0; font-size: 13px; line-height: 1.38; }
  .panel-home .home-explorers { width: min(59vw, 255px); right: -1%; bottom: -3px; }
  .panel-home .panel-actions { gap: 8px; }
  .panel-home .wood-button, .panel-home .outline-button { min-height: 44px; padding: 8px 15px; font-size: 12px; }
}

/* Guardas responsivas: móviles angostos, pantallas bajas, tabletas y escritorio. */
img { max-width: 100%; }
.panel-content, .section-heading, .membership-copy, .membership-box, .route-cards article { min-width: 0; }
.section-heading p, .membership-copy p, .route-cards p, .world-note span, .membership-copy li { overflow-wrap: anywhere; }

@media (max-width: 360px) {
  .panel-content { width: calc(100% - 30px); }
  .stack-brand { left: 70px; font-size: 11px; }
  .access-link { right: 8px; font-size: 9px; }
  .panel-home .home-content { padding-top: 98px; }
  .panel-home .home-content h1 { max-width: 244px; font-size: 27px; }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 230px; font-size: 12px; }
  .panel-home .home-explorers { width: min(56vw, 214px); }
  .panel-home .panel-actions { max-width: 244px; }
  .panel-home .wood-button, .panel-home .outline-button { min-height: 41px; padding: 7px 13px; font-size: 11px; }
  .route-cards { grid-template-columns: 1fr; }
  .route-cards article { min-height: auto; }
  .membership-box { padding: 17px; }
}

@media (min-width: 621px) and (max-width: 1024px) {
  .panel-home .home-content h1 { font-size: clamp(35px, 5vw, 48px); }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 390px; font-size: 15px; }
  .world-showcase { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .membership-box { width: min(100%, 460px); }
}

@media (min-width: 1025px) and (max-height: 820px) {
  .panel-home .home-content { padding-top: 28px; }
  .panel-home .home-content h1 { font-size: clamp(32px, 3.35vw, 46px); }
  .panel-home .home-content > p:not(.eyebrow) { margin: 14px 0; font-size: 15px; }
  .panel-home .home-explorers { width: min(350px, 28vw); }
  .home-points { bottom: 5%; }
  .membership-content, .route-content, .worlds-content { gap: 28px; }
}

@media (max-width: 620px) and (max-height: 740px) {
  .panel-home { min-height: 720px; }
  .panel-home .home-content { padding-top: 92px; }
  .panel-home .home-content h1 { font-size: 27px; }
  .panel-home .home-content > p:not(.eyebrow) { font-size: 12px; margin: 10px 0; }
  .panel-home .home-explorers { width: min(54vw, 230px); }
  .panel-home .wood-button, .panel-home .outline-button { min-height: 40px; }
}

/* Tipografía del home: legible en cada pantalla sin invadir a los personajes. */
@media (min-width: 1025px) {
  .panel-home .home-content h1 { font-size: clamp(40px, 4.1vw, 56px); }
  .panel-home .home-content > p:not(.eyebrow) { font-size: clamp(16px, 1.25vw, 18px); line-height: 1.48; }
}

@media (min-width: 621px) and (max-width: 1024px) {
  .panel-home .home-content h1 { font-size: clamp(39px, 5.3vw, 52px); }
  .panel-home .home-content > p:not(.eyebrow) { font-size: 16px; line-height: 1.46; }
}

@media (max-width: 620px) {
  .panel-home .home-content h1 { max-width: 295px; font-size: clamp(31px, 9.4vw, 39px); }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 278px; font-size: 14px; line-height: 1.42; }
  .panel-home .home-explorers { width: min(55vw, 238px); }
}

@media (max-width: 360px) {
  .panel-home .home-content h1 { max-width: 260px; font-size: 30px; }
  .panel-home .home-content > p:not(.eyebrow) { max-width: 244px; font-size: 13px; }
}
