@font-face{font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/figtree-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--navy:#0B1B33;--ink:#081426;--gold:#C9A24B;--gold-suave:#E4C98A;--fondo:#F7F5EF;--borde:#ECE6D8;--texto:#2b3445}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--texto);font:17px/1.7 Figtree,system-ui,sans-serif}
a{color:var(--navy)}
h1,h2,h3{font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif;font-weight:600;color:var(--navy);line-height:1.15}
/* Texto corrido: justificado, con sangría y partición de palabras (norma de Ramón). */
.bloque>p{text-align:justify;text-indent:1.5em;hyphens:auto;-webkit-hyphens:auto}
.lista li span,.tarjeta p,.faq p{text-align:justify;hyphens:auto;-webkit-hyphens:auto}
/* Centrado: cabecera, portada, títulos, tarjetas, botones, cajas, vídeo y pie. */
.portada,.centro h2,.llamada,footer,.tarjeta h3,.video{text-align:center}
/* .nota: dos o tres líneas de texto corrido, así que va justificada y con sangría, como los demás párrafos. */
.cabecera{position:sticky;top:0;z-index:5;background:rgba(11,27,51,.96);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:space-between;padding:12px 20px}
.cabecera img{height:28px;width:auto;display:block}
.cabecera .boton{padding:9px 18px;font-size:14px;margin:0}
.portada{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% -10%,rgba(201,162,75,.28),transparent 60%),linear-gradient(180deg,var(--ink),var(--navy));color:#fff;padding:64px 20px 56px}
.etiqueta{display:inline-block;border:1px solid rgba(201,162,75,.4);background:rgba(201,162,75,.08);color:var(--gold-suave);border-radius:99px;padding:6px 15px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.portada h1{color:#fff;font-size:clamp(30px,6vw,52px);margin:20px auto 0;max-width:860px}
.portada p{max-width:660px;margin:16px auto 0;color:rgba(255,255,255,.78);font-size:18px}
.botones{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px}
.boton{display:inline-block;background:linear-gradient(135deg,#E4C98A,#C9A24B);color:var(--navy);font-weight:700;text-decoration:none;border-radius:99px;padding:14px 28px;box-shadow:0 10px 30px -12px rgba(201,162,75,.7)}
.boton.claro{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3);box-shadow:none}
main{max-width:1040px;margin:0 auto;padding:16px 20px 24px}
.bloque{max-width:780px;margin:0 auto;padding:28px 0 8px}
.bloque.centro{max-width:1040px}
h2{font-size:clamp(25px,4vw,34px);margin:30px 0 14px;text-align:center}
.tarjetas{display:grid;gap:16px;margin-top:22px}
.tarjetas{grid-template-columns:1fr}
@media(min-width:640px){.tarjetas.c2,.tarjetas.c4{grid-template-columns:repeat(2,1fr)}.tarjetas.c3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:640px) and (max-width:899px){.tarjetas.c3:has(.tarjeta:nth-child(3):last-child){grid-template-columns:1fr}}
@media(min-width:900px){.tarjetas.c3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1000px){.tarjetas.c4{grid-template-columns:repeat(4,1fr)}}
.tarjetas.c2{max-width:820px;margin-left:auto;margin-right:auto}
.tarjeta{background:#fff;border:1px solid var(--borde);border-radius:20px;padding:26px 22px;box-shadow:0 18px 40px -30px rgba(11,27,51,.5)}
.tarjeta h3{font-size:20px;margin:14px 0 8px}
.tarjeta p{margin:0;font-size:15.5px;line-height:1.6;color:#4a5262}
.ico{display:grid;place-items:center;width:52px;height:52px;margin:0 auto;border-radius:15px;background:var(--navy);color:var(--gold)}
.ico svg{width:24px;height:24px}
.destacadas .tarjeta{background:linear-gradient(180deg,var(--navy),#13284a);border-color:rgba(201,162,75,.35)}
.destacadas .tarjeta h3{color:#fff}
.destacadas .tarjeta p{color:rgba(255,255,255,.75)}
.destacadas .ico{background:linear-gradient(135deg,#E4C98A,#C9A24B);color:var(--navy)}
.lista{list-style:none;padding:0;margin:8px 0}
.lista li{display:flex;gap:12px;align-items:flex-start;margin:12px 0}
.lista li span{flex:1}
.tick{flex:none;display:grid;place-items:center;width:26px;height:26px;margin-top:3px;border-radius:99px;background:rgba(201,162,75,.16);color:#8A6A1A}
.tick svg{width:15px;height:15px}
.nota{margin:26px auto 0;max-width:780px;color:#4a5262}
.video video{display:block;width:100%;max-width:860px;margin:18px auto 0;border-radius:20px;aspect-ratio:16/9;background:#000;box-shadow:0 30px 60px -30px rgba(11,27,51,.6)}
.llamada{max-width:860px;margin:40px auto 10px;border-radius:28px;padding:40px 24px;background:radial-gradient(ellipse at 50% 0,rgba(201,162,75,.25),transparent 65%),linear-gradient(180deg,var(--ink),var(--navy));color:#fff}
.llamada h2{color:#fff;margin-top:0}
.llamada p{color:rgba(255,255,255,.75);max-width:560px;margin:0 auto 18px}
.faq{max-width:780px;margin:18px auto 0;text-align:left}
.faq details{background:#fff;border:1px solid var(--borde);border-radius:18px;padding:18px 22px;margin:12px 0}
.faq summary{cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{display:inline;font-family:Figtree,system-ui,sans-serif;font-size:17px;font-weight:600}
.faq p{margin:10px 0 0;color:#4a5262;font-size:15.5px}
footer{background:var(--navy);color:rgba(255,255,255,.6);padding:28px 20px;font-size:14px;margin-top:48px}
footer img{height:26px;width:auto;opacity:.85}
footer a{color:rgba(255,255,255,.85)}
footer p{margin:10px 0 0}
