@font-face{font-family:'Lilita One';src:url(/img/LilitaOne-Regular.ttf) format('truetype');font-display:swap}
:root{--turq:#2fd8c8;--deep:#063e52;--navy:#0d1f4a;--gold:#ffc92e;--red:#e52219;--text:#0b2a33;--card:#ffffff}
*{box-sizing:border-box}
html{background:#063e52}
body{margin:0;min-height:100vh;color:#fff;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.55;
  background:radial-gradient(90% 55% at 50% 30%,#e0fff6 0%,#8ff4e0 22%,#2fd8c8 48%,#11a0a8 72%,#063e52 100%) fixed;}
body::before{content:'';position:fixed;left:0;right:0;bottom:0;height:60%;z-index:-1;pointer-events:none;opacity:.9;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' preserveAspectRatio='none'%3E%3Cg fill='%230e6a70' opacity='.55'%3E%3Cpath d='M0 120c30-30 60-10 70 20 20-30 60-20 60 20 10 40-20 70-40 90 30 20 40 70 10 100 20 40-10 90-40 90H0z'/%3E%3Cpath d='M400 90c-30-30-70-10-75 25-25-25-65-5-60 35 5 35 30 55 45 70-30 25-35 75-5 100-20 45 15 90 45 90h50z'/%3E%3C/g%3E%3Cg fill='%23084a52' opacity='.6'%3E%3Cpath d='M0 260c25-20 50 0 55 25 25-15 50 5 45 35-5 25-25 35-40 45 20 30 10 70-20 85H0z'/%3E%3Cpath d='M400 240c-25-20-55 0-58 28-28-14-52 8-45 38 6 24 28 34 42 42-22 32-8 72 22 82h39z'/%3E%3C/g%3E%3C/svg%3E") 0 100%/100% 100% no-repeat}
a{color:inherit}
.ct,h1,h2,h3,.btn,.nav a{font-family:'Lilita One',"Arial Rounded MT Bold",sans-serif;font-weight:400;letter-spacing:.3px}
.ct,h1,h2{-webkit-text-stroke:5px #0b1a3d;paint-order:stroke fill}
.wrap{max-width:980px;margin:0 auto;padding:0 16px}
header{position:sticky;top:0;z-index:10;background:rgba(6,62,82,.82);backdrop-filter:blur(8px);border-bottom:3px solid #0b1a3d}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;gap:12px}
header .home img{height:40px;display:block}
.nav{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.nav a{text-decoration:none;font-size:15px;opacity:.92}
.nav a:hover{opacity:1;color:var(--gold)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 26px;border-radius:14px;border:3px solid #0b1a3d;
  background:linear-gradient(#ffe46a,#ffb21a);color:#3a1d00;font-size:20px;text-decoration:none;box-shadow:0 5px 0 #0b1a3d}
.btn.gray{background:linear-gradient(#e9eef5,#b9c4d3);color:#1f2a44}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #0b1a3d}
/* portada */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center;padding:36px 0 20px}
.hero .logo{width:min(420px,90%);display:block;filter:drop-shadow(0 8px 14px rgba(0,0,30,.4))}
.hero p{font-size:19px;max-width:520px;text-shadow:0 2px 4px rgba(0,30,40,.6)}
.hero .art{border-radius:24px;border:4px solid #0b1a3d;box-shadow:0 10px 0 #0b1a3d,0 20px 40px rgba(0,0,0,.35);width:100%;max-width:400px;aspect-ratio:2/3;object-fit:cover;justify-self:center}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.soon{font-size:14px;opacity:.85;margin-top:8px}
section{padding:28px 0}
h2{font-size:34px;text-align:center;margin:0 0 18px}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.panel{background:linear-gradient(#1d3a7f,#142a5e);border:3px solid #0b1a3d;border-radius:18px;padding:16px;box-shadow:0 6px 0 #0b1a3d}
.panel h3{margin:0 0 6px;font-size:22px;color:var(--gold)}
.panel p{margin:0;font-size:15px;color:#d6e2ff}
.chars{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.chars figure{margin:0;text-align:center}
.chars img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:14px;border:3px solid #0b1a3d;box-shadow:0 5px 0 #0b1a3d}
.chars figcaption{font-family:'Lilita One',sans-serif;margin-top:8px;font-size:15px;-webkit-text-stroke:3px #0b1a3d;paint-order:stroke fill}
footer{margin-top:30px;padding:26px 0 40px;background:rgba(6,40,56,.85);border-top:3px solid #0b1a3d;text-align:center;font-size:14px}
footer .castle{height:46px;margin-bottom:10px}
footer .links{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:10px 0}
/* páginas legales */
.doc{background:#fff;color:var(--text);border-radius:20px;border:3px solid #0b1a3d;box-shadow:0 8px 0 #0b1a3d;padding:26px 24px;margin:26px auto;max-width:820px}
.doc h1{font-size:34px;margin:0 0 4px;color:#fff}
.doc h2{font-size:22px;text-align:left;margin:26px 0 8px;color:#0b6a74;-webkit-text-stroke:0}
.doc h1{-webkit-text-stroke:0;color:#0b2a33}
.doc .upd{color:#4b6670;font-size:14px;margin:0 0 16px}
.doc li{margin:4px 0}
.doc{overflow-wrap:anywhere}
.doc .box{background:#e9fbf8;border:2px solid #2fd8c8;border-radius:12px;padding:12px 14px}
@media (max-width:760px){
  .hero{grid-template-columns:1fr;text-align:center;padding-top:22px}
  .hero .logo,.hero p{margin-left:auto;margin-right:auto}
  .cta{justify-content:center}
  .feat{grid-template-columns:1fr}
  .chars{grid-template-columns:repeat(3,1fr)}
  .nav{gap:10px}.nav a{font-size:13px}
  .doc{padding:20px 16px;margin:16px}
  h2{font-size:28px}
}
