/* Look «Marea de fondo» — carga detrás de tw.css. Fuentes locales (subconjunto latino, variables). */
@font-face{font-family:"Space Grotesk";src:url(./fuentes/space-grotesk.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:Figtree;src:url(./fuentes/figtree.woff2) format("woff2");font-weight:300 900;font-display:swap}
/* Respaldo métrico para que el cambio de fuente no mueva nada (CLS) */
@font-face{font-family:"SG fallback";src:local("Arial");size-adjust:104%;ascent-override:92%;descent-override:26%}
@font-face{font-family:"Figtree fallback";src:local("Arial");size-adjust:98%;ascent-override:96%;descent-override:26%}
:root{--abismo:#06233A;--fondo:#0B3350;--superficie:#114363;--espuma:#EAF4F4;--bruma:#A9C9D4;--coral:#FF7A59;--coral-tinta:#2A0E05;--alga:#5FD3A6;--arena:#F2C14E}
body.look{background:var(--abismo);color:var(--espuma);font-family:Figtree,"Figtree fallback",system-ui,sans-serif}
.look h1,.look h2,.nota,.nota-chip,.btn{font-family:"Space Grotesk","SG fallback",system-ui,sans-serif}
#franja{background:var(--arena);color:#1B1300}
.dato{color:var(--bruma);margin:0}
.hero{position:relative;margin-top:.5rem;border-radius:1.75rem;padding:1.5rem;background:radial-gradient(120% 90% at 100% 0,#16557D 0,var(--fondo) 55%,var(--abismo) 100%);overflow:hidden}
.hero .ola{position:absolute;inset:auto 0 0 0;width:100%;height:5rem;opacity:.35;pointer-events:none}
.hero .ola path{animation:ola 14s linear infinite}
@keyframes ola{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.hero-tit{font-size:.8rem;text-transform:uppercase;letter-spacing:.16em;color:var(--bruma);margin:0;font-weight:700}
.playa{line-height:1.05;margin:.4rem 0 0}
.nota{font-size:clamp(7rem,30vw,13rem);font-weight:700;line-height:.85;letter-spacing:-.05em;color:var(--espuma);margin:0;min-height:.85em}
.nota small{font-size:.22em;color:var(--bruma);letter-spacing:0}
.motivo{color:var(--bruma);margin:.25rem 0 0}
.btn{display:flex;align-items:center;justify-content:center;border-radius:1rem;font-weight:700;font-size:.95rem;text-decoration:none;border:0;transition:transform .2s ease,background-color .2s ease}
.btn-1{background:var(--coral);color:var(--coral-tinta)}
.btn-2{background:transparent;color:var(--espuma);box-shadow:inset 0 0 0 1.5px var(--bruma)}
.btn:hover{transform:translateY(-2px)}.btn:active{transform:scale(.97)}
.look a:focus-visible,.look button:focus-visible{outline:3px solid var(--arena);outline-offset:3px}
.ficha-caja{background:var(--abismo);box-shadow:inset 0 0 0 1px var(--superficie)}
.parte{background:var(--fondo)}
.avi-cristal{background:rgba(6,35,58,.72)!important}
.avi-panel{background:rgba(6,35,58,.94)!important}
.look footer{color:var(--bruma)}
@media(min-width:900px){.hero{padding:2.5rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}