/* Portada «Mar de luz» (de portada-d2), acotada a #inicio. Generado por _scripts/mar.mjs: no se edita a mano */
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(../fonts/instrument-serif-italic-latin.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap}
#inicio{--fondo:#0D0E13;--texto:#F4F0EC;--tenue:rgba(244,240,236,.62);--pad:clamp(20px,4.6vw,76px)}
#inicio em{font-family:"Instrument Serif",serif;font-style:italic;font-weight:400}
#inicio .recorrido{position:relative;height:1000vh}
#inicio .escena{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--fondo)}
#inicio #gl{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}
#inicio .carga{position:absolute;left:50%;bottom:44px;width:120px;height:1px;margin-left:-60px;background:rgba(244,240,236,.14);z-index:8;transition:opacity .6s}
#inicio .carga b{display:block;height:100%;width:0;background:var(--texto);transition:width .3s}
html.mar-lista #inicio .carga{opacity:0}
#inicio .velo{position:absolute;inset:0;pointer-events:none;opacity:0;z-index:9;background:linear-gradient(0deg,rgba(13,14,19,.66) 0%,rgba(13,14,19,.28) 26%,transparent 50%),linear-gradient(90deg,rgba(13,14,19,.4),transparent 44%)}
#inicio .ml-lema{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(44px,9vh,92px);display:flex;justify-content:space-between;align-items:flex-end;gap:24px;opacity:0;pointer-events:none;z-index:10}
#inicio .ml-lema p{font-size:clamp(23px,2.45vw,38px);line-height:1.08;letter-spacing:-.01em}
#inicio .lema-b{text-align:right}
#inicio .lema-b em{font-size:1.1em}
#inicio .pista{position:absolute;left:var(--pad);bottom:30px;z-index:10;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--tenue);font-weight:400;opacity:0;transition:opacity .8s}
html.mar-lista #inicio .pista{opacity:1}
#inicio .bajar{position:absolute;right:var(--pad);bottom:28px;z-index:10;display:flex;align-items:center;gap:12px;font-size:15px;letter-spacing:.14em;text-transform:uppercase;font-weight:400}
#inicio .bajar b{display:block;width:1px;height:34px;background:linear-gradient(var(--texto),transparent);animation:cae 2.2s ease-in-out infinite;transform-origin:top}
@keyframes cae{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
#inicio .etapas{position:absolute;inset:0;z-index:12;pointer-events:none}
#inicio .etapa{position:absolute;left:var(--pad);bottom:clamp(60px,15vh,130px);width:min(500px,calc(100% - 2*var(--pad)));opacity:0;visibility:hidden;will-change:transform,opacity}
#inicio .etapa h2{font-size:clamp(44px,5.6vw,88px);line-height:.98;font-weight:300;letter-spacing:-.025em;margin-bottom:20px;text-wrap:balance}
#inicio .etapa h2 em{font-size:1.08em;letter-spacing:-.01em}
#inicio .etapa p{font-size:clamp(18px,1.45vw,23px);line-height:1.32;color:var(--tenue);max-width:25ch;margin-bottom:26px;text-wrap:pretty}
#inicio .etapa a{pointer-events:auto;display:inline-flex;align-items:center;gap:14px;height:46px;padding:0 22px;border-radius:99px;background:#E3E4EE;color:#0D0E13;font-size:14px;font-weight:600;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
#inicio .etapa a span{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
#inicio .etapa a:hover span{transform:translateX(4px)}
#inicio .puntos{position:absolute;right:var(--pad);top:50%;transform:translateY(-50%);z-index:11;display:flex;flex-direction:column;gap:12px;opacity:0}
#inicio .puntos i{display:block;width:6px;height:6px;border-radius:50%;background:rgba(244,240,236,.28);transition:background .4s,transform .4s,box-shadow .4s}
#inicio .puntos i.on{background:#fff;transform:scale(1.5);box-shadow:0 0 12px 2px rgba(210,220,255,.7)}
@media (max-width:760px){#inicio .ml-lema{flex-direction:column;align-items:flex-start;bottom:96px;gap:14px}
#inicio .lema-b{text-align:left}
#inicio .ml-lema p{font-size:24px}
#inicio .pista{left:20px;right:96px;bottom:34px;font-size:11px;line-height:1.4}
#inicio .bajar{right:20px;bottom:30px}
#inicio .etapa{bottom:44px}
#inicio .etapa h2{font-size:50px}
#inicio .etapa p{font-size:19px;max-width:28ch}
#inicio .puntos{display:none}
}
@media (prefers-reduced-motion:reduce){#inicio .bajar b{animation:none}
}

#inicio{font-family:"Inter Tight",system-ui,sans-serif;font-weight:300;color:var(--texto);background:var(--fondo);position:relative}
#inicio .solo-lectores{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#inicio a{color:inherit;text-decoration:none}
#inicio .etapa a.sec{display:flex;width:fit-content;height:auto;padding:0 0 2px;margin-top:16px;background:none;border-radius:0;border-bottom:1px solid rgba(244,240,236,.55);color:var(--texto);font-weight:400;font-size:15px}
#inicio .etapa a.sec:hover{border-bottom-color:#fff}
@media (max-width:760px){#inicio .etapa a.sec{margin-top:14px}}