/* DanaVerse · estilos (marca: /danaverse-brand). Sin transparencias: todo es sólido y entra deslizándose. */
@font-face{font-family:'Permanent Marker';src:url(../fonts/marker.woff2) format('woff2');font-display:swap}
@font-face{font-family:'DM Serif Display';src:url(../fonts/dmserif.woff2) format('woff2');font-style:normal;font-display:swap}
@font-face{font-family:'DM Serif Display';src:url(../fonts/dmserif-italic.woff2) format('woff2');font-style:italic;font-display:swap}
@font-face{font-family:'Archivo';src:url(../fonts/archivo.woff2) format('woff2');font-weight:100 900;font-display:swap}

:root{
  --navy:#16233F; --amarillo:#F2D04B; --azul:#2C4F7C; --nube:#8FB3D9;
  --crema:#F5EDDC; --madera:#7A4A2A; --tinta:#111214; --arena:#E7B98A;
  --navy-2:#22345B; --navy-3:#3A4C73; --tenue:#7F93B8; --suave:#CFD8EA;
  --font-display:'Permanent Marker',cursive;
  --font-titulo:'DM Serif Display',Georgia,serif;
  --font-texto:'Archivo',system-ui,sans-serif;
  --gutter:clamp(20px,5vw,72px);
  --ease:cubic-bezier(.22,1,.36,1);
  /* palabras destacadas (sobre fondo oscuro) y texto apagado antes de leerse */
  --r1:#F2D04B; --r2:#8FB3D9; --r3:#F5EDDC; --off:#6E82A8;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--amarillo) var(--navy);scrollbar-width:thin}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--navy);color:var(--crema);font:400 clamp(16px,.35vw + 14px,19px)/1.6 var(--font-texto);overflow-x:hidden;caret-color:var(--amarillo)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,p,ol,ul,figure,dl,dd{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit;color:inherit;cursor:pointer}
::selection{background:var(--amarillo);color:var(--navy)}
::-webkit-scrollbar{width:10px;background:var(--navy)}
::-webkit-scrollbar-thumb{background:var(--amarillo);border:2px solid var(--navy);border-radius:10px}
:focus-visible{outline:3px solid var(--nube);outline-offset:3px;border-radius:6px}
.test :focus-visible,.proceso :focus-visible,.hero :focus-visible{outline-color:var(--azul)}

.saltar{position:fixed;left:12px;top:-60px;background:var(--amarillo);color:var(--navy);padding:10px 16px;border-radius:10px;font-weight:800;z-index:100;transition:top .2s}
.saltar:focus{top:12px}
.contenedor{width:100%;max-width:1296px;margin-inline:auto;padding-inline:var(--gutter)}
.marker{font-family:var(--font-display);text-transform:uppercase;display:inline-block;transform:rotate(-5deg);font-weight:400;line-height:1.05}
.fondo-noche{position:fixed;inset:0;z-index:-1;background:var(--navy) url(../img/fondo-noche-d.webp) center/cover no-repeat}
@media (max-aspect-ratio:1/1){.fondo-noche{background-image:url(../img/fondo-noche-m.webp)}}

/* Palabras destacadas en negrita y a color */
b{font-weight:800}
b.r1{color:var(--r1)} b.r2{color:var(--r2)} b.r3{color:var(--r3)}
.proceso,.test{--r1:#7A4A2A;--r2:#2C4F7C;--r3:#16233F;--off:#A5ABBA}
.proyectos{--r1:#F2D04B;--r2:#DCE6F5;--r3:#F5EDDC;--off:#9FB6D6}
.pw{display:inline}
.scroll-vivo .pw{color:var(--off)}

/* Títulos y subrayado de brocha */
h2{font:400 clamp(2.2rem,4.4vw + .4rem,4.4rem)/1.06 var(--font-titulo);text-wrap:balance;letter-spacing:-.01em}
h3{font:400 clamp(1.8rem,2.4vw + .6rem,2.6rem)/1.08 var(--font-titulo)}
.subrayado{background:url(../img/trazo-brocha-amarillo.svg) no-repeat 0 94%/100% .34em;padding-bottom:.1em;transition:background-size .9s var(--ease)}
.subrayado--navy{background-image:url(../img/trazo-brocha-navy.svg)}
.scroll-vivo .subrayado{background-size:0 .34em}
.scroll-vivo .subrayado.is-dibujado{background-size:100% .34em}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:13px 26px;border-radius:40px;border:2px solid transparent;font:800 15px/1.2 var(--font-texto);text-decoration:none;cursor:pointer;transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s}
.btn--amarillo{background:var(--amarillo);color:var(--navy)}
.btn--navy{background:var(--navy);color:var(--crema)}
.btn--contorno{border-color:var(--crema);color:var(--crema);background:transparent}
.btn--contorno-navy{border-color:var(--navy);color:var(--navy);background:transparent}
.btn--grande{min-height:58px;padding:16px 32px;font-size:17px}
.btn .flecha{display:inline-block;transition:transform .25s var(--ease)}
.test .btn--contorno,.proceso .btn--contorno{border-color:var(--navy);color:var(--navy)}
@media (hover:hover){
  .btn:hover{transform:translateY(-2px)}
  .btn:hover .flecha{transform:translateX(4px)}
  .btn--amarillo:hover{background:#F7DC72}
  .btn--navy:hover{background:var(--azul)}
  .btn--contorno:hover{background:var(--crema);color:var(--navy)}
  .btn--contorno-navy:hover{background:var(--navy);color:var(--crema)}
}
.btn:active{transform:translateY(0)}

/* Navegación */
.nav{position:fixed;top:max(12px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:6px;padding:6px 6px 6px 8px;background:var(--crema);color:var(--navy);border-radius:44px;max-width:calc(100% - 24px)}
.nav__logo{display:block;border-radius:50%;overflow:hidden;width:40px;height:40px;flex:none;transition:transform .4s var(--ease)}
.nav__logo img{width:40px;height:40px}
@media (hover:hover){.nav__logo:hover{transform:rotate(-8deg) scale(1.06)}}
.nav__links{display:flex;gap:2px;margin:0 6px}
.nav__links a{white-space:nowrap;position:relative;padding:10px 11px;font:600 14px/1 var(--font-texto);color:var(--navy);text-decoration:none}
.nav__links a::after{content:"";position:absolute;left:9px;right:9px;bottom:2px;height:7px;background:url(../img/trazo-brocha-amarillo.svg) no-repeat center/100% 100%;clip-path:inset(0 100% 0 0);transition:clip-path .45s var(--ease)}
.nav__links a:hover::after,.nav__links a:focus-visible::after,.nav__links a.is-actual::after{clip-path:inset(0 0 0 0)}
.btn--nav{min-height:40px;padding:10px 20px;font-size:14px}
@media (max-width:1020px){.nav__links{display:none}}

/* 1 · Despegue en el cielo */
.hero{position:relative}
.hero__pin{position:relative;height:100svh;min-height:560px;overflow:hidden}
.hero__frase{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:84px var(--gutter) 40px;color:var(--amarillo);font-size:clamp(2.2rem,6.2vw,5.6rem);pointer-events:none}
.hero__frase .marker{max-width:13ch}
.scroll-vivo .hero__frase{clip-path:inset(0 100% 0 0)}
html:not(.scroll-vivo) .hero__frase,html:not(.scroll-vivo) .hero__sube{display:none}
.hero__dia{position:absolute;inset:0;overflow:hidden;background:linear-gradient(180deg,#2C4F7C 0%,#5F89B9 24%,#8FB3D9 46%,#D9DFD3 74%,#F2D04B 100%);will-change:transform}
.hero__sol{position:absolute;left:9vw;top:13%;width:clamp(90px,16vmin,190px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#FBF2C4 0 46%,#F7DC72 47% 70%,#F2D04B 71% 100%)}
.capa{position:absolute;left:0;right:0;pointer-events:none;will-change:transform}
.capa__fila{display:flex;align-items:center;width:max-content;will-change:transform}
.capa__fila img{flex:none;width:auto}
.capa--lejos{top:11%}.capa--lejos img{height:clamp(52px,10vh,104px);margin-right:9vw}
.capa--lejos img:nth-child(even){transform:translateY(24px)}
.capa--media{top:30%}.capa--media img{height:clamp(86px,17vh,180px);margin-right:16vw}
.capa--media img:nth-child(odd){transform:translateY(-30px)}
.capa--cerca{top:76%}.capa--cerca img{height:clamp(150px,30vh,320px);margin-right:20vw}
.hero__entrada{position:absolute;left:46%;top:13%;width:min(54vw,800px)}
.hero__avion-caja{will-change:transform}
.hero__avion{width:100%;height:auto;animation:vuelo 4.6s ease-in-out infinite}
@keyframes vuelo{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-16px) rotate(1.5deg)}}
.hero__texto{position:absolute;left:var(--gutter);bottom:max(40px,9svh);width:min(700px,calc(100% - 2*var(--gutter)));color:var(--navy);z-index:8}
.hero__texto h1{font:400 clamp(2.2rem,3.8vw + .4rem,3.9rem)/1.02 var(--font-titulo);letter-spacing:-.015em}
.hero__texto h1 em{font-style:italic;background:url(../img/trazo-brocha-amarillo.svg) no-repeat 0 90%/100% .48em;padding-bottom:.04em}
.hero__texto p{margin-top:16px;max-width:46ch;font-size:clamp(16px,.5vw + 13px,19px);line-height:1.5;font-weight:500}
.hero__texto b{background:var(--amarillo);color:var(--navy);padding:0 .22em;border-radius:3px}
.hero__botones{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hero__sube{position:absolute;right:var(--gutter);bottom:max(24px,6svh);z-index:6;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--navy);color:var(--amarillo);font:700 13px/1 var(--font-texto);letter-spacing:.14em;text-transform:uppercase;padding:14px 12px;border-radius:30px}
.hero__sube svg{animation:subir 2s var(--ease) infinite}
@keyframes subir{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hero__banco{position:absolute;left:-6vw;right:-6vw;bottom:-31vh;display:flex;align-items:flex-end;justify-content:space-around;z-index:7;pointer-events:none}
.hero__banco img{height:clamp(150px,34vh,330px);width:auto;flex:none}
@media (max-width:860px),(max-aspect-ratio:1/1){
  .hero__entrada{left:6%;top:11%;width:88%}
  .hero__sube{display:none}
  .hero__sol{left:auto;right:6vw;top:5%}
  .capa--cerca{top:82%}
  .hero__texto{bottom:max(28px,5svh)}
}
@media (max-height:640px) and (min-width:861px){.hero__texto p{display:none}}

/* 2 · Soy Dana */
.sobre{position:relative;padding-block:clamp(88px,12vw,190px);overflow:hidden}
.sobre__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center;position:relative;z-index:1}
.sobre__texto{display:grid;gap:22px;justify-items:start}
.sobre__texto p{color:var(--suave);max-width:54ch;font-size:clamp(17px,.5vw + 14px,20px)}
.sobre__texto h2{margin-bottom:6px}
.encender .w{transition:color .3s}
.scroll-vivo .encender .w{color:var(--tenue)}
.sobre__escena{position:relative;min-height:clamp(500px,54vw,740px)}
.camara-caja{position:absolute;left:0;top:0;width:66%;z-index:3;transform-origin:50% 60%}
.camara-caja img{width:100%}
.flash{position:absolute;left:50%;top:62%;width:34%;aspect-ratio:1;margin:-17% 0 0 -17%;border-radius:50%;background:#FFF8DC;transform:scale(0);pointer-events:none}
.polaroid{position:absolute;right:0;bottom:0;width:74%;background:var(--crema);padding:14px 14px 64px;border-radius:6px;transform:rotate(4deg);z-index:2}
.polaroid img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:50% 30%}
.polaroid figcaption{position:absolute;left:0;right:0;bottom:14px;text-align:center;color:var(--navy);font-size:clamp(20px,2vw,28px);transform:rotate(-3deg)}
.sobre__obj{position:absolute;z-index:0;pointer-events:none;will-change:transform}
.sobre__obj img{width:100%}
.sobre__obj--b{width:clamp(110px,12vw,180px);right:2vw;bottom:3%}
.sobre__obj--c{width:clamp(70px,8vw,120px);right:44%;top:4%}
@media (max-width:860px){
  .sobre__grid{grid-template-columns:1fr}
  .sobre__obj--b{display:none}
  .sobre__obj--c{right:6vw;top:2%}
  .sobre__escena{min-height:clamp(430px,118vw,560px);margin-top:8px}
  .camara-caja{width:64%}
  .polaroid{width:76%}
}

/* 3 · Método Brújula */
.metodo{position:relative}
.metodo__pin{min-height:100svh;display:flex;align-items:center;padding-block:92px 44px}
.metodo__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,80px);align-items:center;width:100%}
.metodo__lista h2{font-size:clamp(2.1rem,3.6vw + .4rem,3.8rem);display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
.metodo__sub{color:var(--suave);margin-top:10px;max-width:44ch}
.sello{font:400 clamp(14px,1.2vw + 4px,19px)/1 var(--font-display);text-transform:uppercase;background:var(--amarillo);color:var(--navy);padding:6px 11px 5px;border-radius:7px;transform:rotate(-5deg);white-space:nowrap}
.svc-lista{margin:clamp(16px,2.6vh,30px) 0}
.svc{border-top:1px solid var(--navy-3);padding:11px 0}
.svc:last-child{border-bottom:1px solid var(--navy-3)}
.svc__titulo{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:14px;width:100%;font:400 clamp(1.6rem,2.3vw + .6rem,2.8rem)/1.1 var(--font-titulo);color:var(--crema);transition:color .35s,filter .35s,transform .45s var(--ease)}
.svc__titulo:focus-visible{outline:3px solid var(--nube);outline-offset:4px;border-radius:8px}
.svc__texto{color:var(--suave);max-width:46ch;margin-top:6px}
.svc__cta{margin-top:4px}
.scroll-vivo .svc__titulo{color:var(--tenue);filter:blur(1.4px)}
.scroll-vivo .svc.is-activo .svc__titulo{color:var(--crema);filter:none;transform:translateX(10px)}
.scroll-vivo .svc__texto{max-height:0;overflow:hidden;margin-top:0;transition:max-height .5s var(--ease),margin .5s var(--ease)}
.scroll-vivo .svc.is-activo .svc__texto{max-height:120px;margin-top:8px}
@media (hover:hover){.scroll-vivo .svc:not(.is-activo) .svc__titulo:hover{color:var(--suave);filter:none}}
.metodo__escenario{position:relative;aspect-ratio:1/1;max-height:min(64svh,560px);width:100%;justify-self:center;border-radius:30px;overflow:hidden}
.svc-panel{position:absolute;inset:0;display:grid;place-items:center}
.svc-panel--0{background:var(--amarillo)}
.svc-panel--1{background:var(--crema)}
.svc-panel--2{background:var(--nube)}
.svc-panel--3{background:var(--azul)}
.svc-obj{position:relative;height:74%;width:auto;max-width:78%;object-fit:contain;transition:transform .7s var(--ease)}
.svc-sec{position:absolute;right:6%;bottom:6%;width:34%;height:auto;transform:rotate(8deg);transition:transform .7s var(--ease)}
.svc-panel--1 .svc-sec{width:42%;border-radius:8px;border:5px solid var(--navy)}
@media (hover:hover){.metodo__escenario:hover .svc-obj{transform:rotate(-5deg) scale(1.05)}.metodo__escenario:hover .svc-sec{transform:rotate(-4deg) translateY(-8px)}}
html:not(.scroll-vivo) .metodo__escenario{display:grid;grid-template-columns:1fr 1fr;aspect-ratio:auto;max-height:none;gap:12px;background:none}
html:not(.scroll-vivo) .svc-panel{position:relative;aspect-ratio:1/1;border-radius:20px}
@media (max-width:860px){
  .metodo__pin{padding-block:78px 24px}
  .metodo__grid{grid-template-columns:1fr;gap:14px}
  .metodo__escenario{order:-1;aspect-ratio:auto;height:26svh;max-height:none;border-radius:22px}
  .metodo__lista h2{font-size:1.9rem}
  .metodo__sub{margin-top:6px;font-size:15px}
  .svc-lista{margin:10px 0}
  .svc{padding:7px 0}
  .svc__titulo{font-size:1.5rem}
  .svc-obj{height:80%}
  .svc__cta{min-height:44px;padding:10px 22px}
}
@media (max-height:700px) and (min-width:861px){
  .metodo__pin{padding-block:76px 20px}
  .svc{padding:7px 0}
  .metodo__escenario{max-height:60svh}
}

/* 4 · DanaVerse */
.proyectos{background:var(--azul);color:#DCE6F5;padding-block:clamp(40px,5vw,72px) clamp(44px,5.5vw,80px);overflow:hidden}
.proyectos__cab{display:grid;grid-template-columns:1fr minmax(0,44ch);gap:12px clamp(24px,4vw,64px);align-items:end}
.proyectos h2{font-size:clamp(2rem,3.4vw + .4rem,3.5rem);color:var(--crema)}
.proyectos__nota{max-width:44ch;font-size:clamp(16px,.4vw + 14px,18px)}
.muro{margin-top:clamp(22px,3vw,40px)}
.muro__fila{display:flex;gap:clamp(16px,2vw,28px);width:max-content;will-change:transform;padding-left:var(--gutter)}
.muro figure{flex:none}
.muro img{height:clamp(150px,21vw,290px);width:auto;border:6px solid var(--crema);border-radius:6px;background:var(--crema);transition:transform .5s var(--ease)}
.muro figcaption{margin-top:10px;font:700 14px/1.2 var(--font-texto);color:var(--crema)}
@media (hover:hover){.muro figure:hover img{transform:translateY(-8px) rotate(-1.2deg)}}
@media (max-width:860px){.proyectos__cab{grid-template-columns:1fr}.muro img{height:clamp(130px,38vw,200px)}}

/* 5 · Tu despegue */
.proceso{background:var(--crema);color:var(--navy)}
.proceso__pin{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:88px;padding-bottom:28px}
.proceso h2{color:var(--navy);margin-bottom:clamp(30px,6vh,64px)}
.proceso__vista{flex:none;height:clamp(400px,58svh,580px);position:relative;overflow:hidden}
.proceso__carril{position:relative;display:flex;width:max-content;height:100%;padding-left:var(--gutter)}
.proceso__linea{display:none}
.pista{position:absolute;left:0;bottom:0;height:58px;width:100%;z-index:1;background:linear-gradient(90deg,var(--amarillo) 50%,var(--navy) 50%) 0 50%/80px 5px repeat-x,var(--navy);border-radius:0 12px 12px 0}
.pista::before{content:"";position:absolute;left:0;right:0;top:-6px;height:6px;background:linear-gradient(90deg,var(--azul) 50%,var(--crema) 50%) 0 0/28px 6px repeat-x}
.parada{position:relative;width:min(56vw,660px);min-width:min(86vw,440px);flex:none;display:flex;gap:20px;align-items:flex-start;padding:0 4vw 0 0;z-index:2}
.parada--final{width:max(92vw,900px);min-width:0}
.parada__texto{max-width:390px;display:grid;gap:12px}
.parada__texto p{max-width:34ch;font-size:clamp(16px,.6vw + 13px,20px)}
.parada h3{font-size:clamp(2.2rem,3.2vw + .6rem,3.6rem)}
.parada > img{width:clamp(90px,11vw,180px);height:auto;margin-top:6px;transition:transform .6s var(--ease)}
.semana{font-size:22px;color:var(--azul);justify-self:start}
@media (hover:hover){.parada:hover > img{transform:rotate(-8deg) scale(1.08)}}
.p-avion{position:absolute;left:0;top:0;width:clamp(150px,17vw,250px);z-index:4;will-change:transform;pointer-events:none}
.p-cuerpo{position:relative;z-index:2;width:100%;height:auto}
.p-tren{position:absolute;z-index:1;transform-origin:50% 0;will-change:transform}
.p-pata{position:absolute;left:50%;top:0;height:100%;width:auto;transform:translateX(-50%)}
.p-rueda{position:absolute;left:50%;bottom:0;width:100%;height:auto;transform:translateX(-50%)}
.p-tren--del{left:46%;top:60%;width:15%;height:44%;z-index:3}
.p-tren--tras{left:9%;top:56%;width:8%;height:30%}
html:not(.scroll-vivo) .proceso__vista{overflow:visible;height:auto}
html:not(.scroll-vivo) .proceso__carril{width:auto;flex-direction:column;gap:32px;padding-bottom:64px}
html:not(.scroll-vivo) .pista,html:not(.scroll-vivo) .p-avion{display:none}
html:not(.scroll-vivo) .parada,html:not(.scroll-vivo) .parada--final{width:auto;min-width:0}
@media (max-width:860px){
  .proceso__pin{padding-top:76px}
  .proceso__vista{height:clamp(380px,60svh,520px)}
  .parada{min-width:84vw;width:84vw;padding-right:6vw}
  .parada--final{width:130vw}
  .parada > img{display:none}
  .pista{height:48px}
  .p-avion{width:clamp(130px,40vw,190px)}
}

/* 6 · Templo de las ideas */
.ideas{padding-block:clamp(64px,8vw,130px)}
.ideas__intro{max-width:62ch;margin:0 auto clamp(26px,4vw,48px);text-align:center;font-size:clamp(17px,.6vw + 14px,21px);color:var(--suave)}
.templo{display:grid;justify-items:center;--piedra:#F5EDDC}
.templo__fronton{position:relative;width:min(1120px,100%);height:clamp(112px,11vw,152px)}
.templo__fronton svg{position:absolute;inset:0;width:100%;height:100%}
.templo__fronton h2{position:absolute;left:0;right:0;bottom:9%;text-align:center;font-size:clamp(1.3rem,3vw + .2rem,3rem);color:var(--crema)}
.templo__cuerpo{position:relative;display:grid;grid-template-columns:1fr minmax(260px,420px) 1fr;gap:clamp(8px,2vw,28px);align-items:stretch;width:min(1120px,100%);padding:clamp(14px,2vw,24px) clamp(8px,1.4vw,20px) 0;border-top:14px solid var(--piedra)}
.templo__cols{display:flex;gap:clamp(8px,1.6vw,22px);justify-content:center;align-items:flex-end}
.col{flex:1;max-width:120px;display:flex;flex-direction:column;align-items:center;text-align:center;height:100%;min-width:0}
.col__icono{width:clamp(40px,5vw,66px);height:clamp(40px,5vw,66px);object-fit:contain;margin-bottom:8px;transition:transform .5s var(--ease)}
.col__capitel{position:relative;width:118%;height:clamp(12px,1.6vw,20px);background:var(--piedra);border-radius:6px 6px 2px 2px;z-index:2}
.col__fuste{position:relative;flex:1;min-height:150px;width:76%;background:repeating-linear-gradient(90deg,var(--piedra) 0 9px,#DCD2BC 9px 12px);overflow:hidden;border-radius:2px}
.col__llama{position:absolute;left:0;right:0;bottom:0;height:100%;background:repeating-linear-gradient(90deg,var(--amarillo) 0 9px,#E3BC2F 9px 12px);transform-origin:50% 100%;transform:scaleY(0);transition:transform .7s var(--ease)}
.col__base{width:104%;height:clamp(12px,1.6vw,20px);background:var(--piedra);border-radius:2px 2px 6px 6px}
.col__nombre{margin-top:10px;font:700 clamp(11px,.5vw + 9px,14px)/1.15 var(--font-texto);color:var(--suave);min-height:2.4em}
.col__cuenta{font:400 clamp(15px,1vw + 8px,20px)/1 var(--font-display);color:var(--tenue)}
.col.is-viva .col__cuenta{color:var(--amarillo)}
.col.is-viva .col__icono{transform:translateY(-6px) rotate(-6deg) scale(1.1)}
.col.is-pulso .col__fuste{animation:pulso .5s var(--ease)}
@keyframes pulso{50%{transform:scale(1.06)}}
.templo__gradas{display:grid;justify-items:center;width:min(1120px,100%);gap:0}
.templo__gradas span{display:block;height:clamp(10px,1.4vw,16px);background:var(--piedra);border-top:3px solid var(--navy)}
.templo__gradas span:nth-child(1){width:100%}
.templo__gradas span:nth-child(2){width:104%;background:#DCD2BC}
.templo__gradas span:nth-child(3){width:108%;background:#C6BBA3}
.juego__mejor{margin-top:18px;color:var(--suave);text-align:center}
.juego__mejor strong{color:var(--amarillo);font:400 1.3em var(--font-display)}
.juego__caja{position:relative;width:100%;border-radius:18px;overflow:hidden;border:3px solid var(--piedra);background:var(--navy);user-select:none;-webkit-user-select:none}
.juego__lienzo{display:block;width:100%;height:auto;aspect-ratio:400/560;touch-action:pan-y;outline-offset:-6px}
.juego__caja.is-jugando .juego__lienzo{touch-action:none}
.juego__hud{position:absolute;left:12px;right:12px;top:12px;pointer-events:none;display:grid;gap:8px}
.hud__tiempo{height:10px;border:2px solid var(--crema);border-radius:8px;background:var(--navy);overflow:hidden}
.hud__tiempo span{display:block;height:100%;background:var(--amarillo);transform-origin:left;transform:scaleX(1)}
.hud__fila{display:flex;justify-content:space-between;align-items:center}
.hud__ideas{font-size:24px;color:var(--amarillo);transform:rotate(-3deg)}
.hud__vidas{display:flex;gap:4px}
.hud__vidas svg{width:22px;height:30px;transition:filter .3s,transform .3s}
.hud__vidas svg.perdida{filter:grayscale(1) brightness(.5);transform:scale(.78)}
.juego__pantalla{position:absolute;inset:0;background:var(--navy);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:22px}
.juego__pantalla[hidden]{display:none}
.juego__titulo{font-size:clamp(1.8rem,5vw,2.6rem);color:var(--amarillo)}
.juego__reglas{color:var(--suave);max-width:26ch;font-size:15px}
.juego__reglas b{color:var(--amarillo)}
.juego__teclas{font-size:13px;color:var(--tenue)}
.inicio__ideas{display:flex;gap:14px;align-items:flex-end;height:60px}
.inicio__ideas img{height:100%;width:auto;animation:flotar 3s ease-in-out infinite}
.inicio__ideas img:nth-child(2){animation-delay:-.7s}.inicio__ideas img:nth-child(3){animation-delay:-1.4s}.inicio__ideas img:nth-child(4){animation-delay:-2.1s}
@keyframes flotar{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-10px) rotate(3deg)}}
.fin__ideas{font-size:1rem;color:var(--suave)}
.fin__ideas strong{display:block;font:400 4.2rem/1 var(--font-titulo);color:var(--crema)}
.fin__texto{max-width:30ch;color:var(--suave);font-size:15px}
.fin__botones{display:grid;gap:10px;width:100%;max-width:290px}
@media (max-width:860px){
  .templo__cuerpo{grid-template-columns:1fr 1fr;grid-template-areas:"juego juego" "a b"}
  .juego__caja{grid-area:juego;justify-self:center;width:min(100%,420px)}
  #cols-a{grid-area:a}#cols-b{grid-area:b}
  .templo__cols{height:200px}
  .col__fuste{min-height:90px}
  .templo__cuerpo{padding-top:16px}
}
@media (min-width:861px){.templo__cols{height:min(100%,560px)}}
@media (max-width:860px){.juego__caja{order:0}}

/* 7 · Test: pase de abordar */
.test{background:var(--crema);color:var(--navy);padding-block:clamp(72px,10vw,150px)}
.test__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,6vw,96px);align-items:start}
.test__intro{display:grid;gap:20px;justify-items:start}
.test__intro p{max-width:38ch;font-size:clamp(17px,.5vw + 14px,20px)}
.test__obj{width:clamp(120px,16vw,210px);margin-top:12px;transform:rotate(-6deg)}
.test__caja{position:relative;background:var(--navy);color:var(--crema);border-radius:30px;padding:clamp(18px,2.6vw,34px);min-height:520px;display:flex;flex-direction:column;gap:16px;overflow:hidden}
.test__tablero{display:flex;justify-content:space-between;align-items:center;gap:12px}
.test__tablero .marker{color:var(--amarillo);font-size:clamp(17px,1.2vw + 10px,22px)}
.tablero__n{font:800 12px/1 var(--font-texto);letter-spacing:.14em;text-transform:uppercase;background:var(--crema);color:var(--navy);padding:8px 13px;border-radius:30px}
.test__ruta{position:relative;height:58px;flex:none}
.ruta__linea{position:absolute;left:0;right:34px;top:38px;height:0;border-top:3px dashed var(--navy-3)}
.ruta__linea span{position:absolute;left:0;top:-3px;height:3px;width:100%;background:var(--amarillo);transform-origin:left;transform:scaleX(0);transition:transform .8s var(--ease);display:block;margin-top:-3px}
#ruta-avion{position:absolute;top:0;left:0;width:84px;height:auto;transition:left .8s var(--ease)}
.ruta__meta{position:absolute;right:4px;top:12px;width:26px;height:30px}
.ruta__meta::before{content:"";position:absolute;left:3px;top:0;bottom:0;width:3px;background:var(--crema)}
.ruta__meta::after{content:"";position:absolute;left:6px;top:0;width:18px;height:13px;background:var(--amarillo);clip-path:polygon(0 0,100% 50%,0 100%)}
.test__escena{display:grid;overflow:hidden;flex:1;padding:6px 4px 10px}
.test__slide{grid-area:1/1;display:flex;flex-direction:column;gap:18px;justify-content:center;align-items:flex-start}
.test__pregunta{font:400 clamp(1.6rem,2.4vw + .6rem,2.4rem)/1.14 var(--font-titulo);text-wrap:balance}
.opciones{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.opcion{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;width:100%;min-height:84px;padding:14px 16px;border-radius:18px;font:700 clamp(15px,.5vw + 12px,18px)/1.25 var(--font-texto);color:var(--navy);transform:rotate(var(--giro,-1.2deg));transition:transform .35s var(--ease),box-shadow .3s}
.opcion:nth-child(1){background:var(--amarillo);--giro:-1.3deg}
.opcion:nth-child(2){background:var(--nube);--giro:1.1deg}
.opcion:nth-child(3){background:var(--crema);--giro:1.2deg}
.opcion:nth-child(4){background:var(--arena);--giro:-1deg}
.opcion__letra{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--navy);color:var(--crema);font:400 20px/1 var(--font-display)}
.opcion:focus-visible{outline:3px solid var(--crema);outline-offset:3px}
@media (hover:hover){.opcion:hover{transform:rotate(0) translateY(-5px) scale(1.03)}}
.opcion.is-elegida{transform:rotate(0) scale(1.05);box-shadow:0 0 0 4px var(--crema)}
.opcion.is-elegida .opcion__letra{background:var(--azul)}
.opcion.is-fuera{transform:translateY(130%) rotate(6deg)}
.test__atras{all:unset;cursor:pointer;color:var(--suave);font:700 14px var(--font-texto);padding:8px 0;border-bottom:2px solid var(--navy-3)}
.test__atras:focus-visible{outline:3px solid var(--nube);outline-offset:3px}
@media (hover:hover){.test__atras:hover{color:var(--amarillo);border-color:var(--amarillo)}}
.confeti{position:absolute;width:11px;height:11px;pointer-events:none;z-index:9}
/* pase de abordar */
.pase{display:grid;grid-template-columns:1fr auto;width:100%;background:var(--crema);color:var(--navy);border-radius:20px;overflow:hidden;position:relative}
.pase__main{padding:clamp(18px,2.4vw,28px);display:grid;gap:10px;align-content:start}
.pase__main .marker{color:var(--azul);font-size:18px;justify-self:start}
.pase__destino{font:400 clamp(1.8rem,3.4vw,2.9rem)/1.04 var(--font-titulo)}
.pase__txt{font-size:15px;line-height:1.5;max-width:42ch}
.pase__otro{font-size:14px}
.pase__datos{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:4px;padding-top:12px;border-top:2px dashed var(--navy)}
.pase__datos dt{font:800 10px/1 var(--font-texto);letter-spacing:.14em;text-transform:uppercase;color:var(--azul)}
.pase__datos dd{font:400 22px/1.1 var(--font-display)}
.pase__talon{position:relative;border-left:3px dashed var(--navy);padding:clamp(16px,2vw,24px);display:grid;gap:12px;align-content:center;justify-items:center;background:var(--amarillo);min-width:170px}
.pase__talon::before,.pase__talon::after{content:"";position:absolute;left:-14px;width:25px;height:25px;border-radius:50%;background:var(--navy)}
.pase__talon::before{top:-13px}.pase__talon::after{bottom:-13px}
.pase__obj{width:84px;height:auto;animation:flotar 3.4s ease-in-out infinite}
.pase__barras{width:100%;height:36px;background:repeating-linear-gradient(90deg,var(--navy) 0 2px,var(--amarillo) 2px 5px,var(--navy) 5px 9px,var(--amarillo) 9px 11px,var(--navy) 11px 12px,var(--amarillo) 12px 16px)}
.pase__talon .btn{min-height:44px;padding:10px 18px;font-size:14px;width:100%}
.pase__talon .btn--contorno-navy{border-color:var(--navy)}
@media (max-width:860px){
  .test__grid{grid-template-columns:1fr}
  .opciones{grid-template-columns:1fr}
  .opcion{min-height:64px}
  .pase{grid-template-columns:1fr}
  .pase__talon{border-left:0;border-top:3px dashed var(--navy);grid-template-columns:auto 1fr;gap:12px 16px}
  .pase__talon::before,.pase__talon::after{display:none}
  .pase__barras,.pase__talon .btn{grid-column:1/-1}
  .pase__obj{width:64px}
  .test__caja{min-height:0}
  #ruta-avion{width:68px}
}

/* 8 · Contacto */
.contacto{position:relative;padding-block:clamp(100px,14vw,210px);text-align:center;overflow:hidden}
.contacto__grid{display:grid;gap:22px;justify-items:center;position:relative;z-index:1}
.contacto__logo{width:min(520px,80vw);height:auto}
.contacto h2{max-width:16ch}
.contacto h2 .marker{color:var(--amarillo)}
.contacto p{color:var(--suave)}
.contacto__botones{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:8px}
.contacto__avion{position:absolute;left:3vw;bottom:6%;width:clamp(150px,20vw,300px);z-index:0;pointer-events:none}
.pie{background:var(--tinta);color:#B9C4DA;padding-block:26px;font-size:14px}
.pie__fila{display:flex;flex-wrap:wrap;gap:8px 32px;justify-content:space-between}
.pie p{max-width:62ch}

/* Menos movimiento */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}