/* Páginas públicas de estudio: la paleta y tipografía de la portada. */
:root{--marino:#0B3634;--azul:#13675F;--oro:#E0B53A;--fondo:#fff;--gris:#F4F7F6;--linea:#E1E9E6;--texto:#18302B;--suave:#56706A;--disp:"Outfit",system-ui,sans-serif;--body:"Plus Jakarta Sans",system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--fondo);color:var(--texto);font:400 16px/1.7 var(--body)}
img{max-width:100%;height:auto}
a{color:var(--azul)}
a:focus-visible{outline:3px solid var(--oro);outline-offset:3px}
.marco{width:min(1120px,calc(100% - 40px));margin:auto}
.barra{background:var(--marino);color:#fff}
.barra .marco{min-height:70px;display:flex;align-items:center;gap:18px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;line-height:1.15}
.marca img{width:38px;height:38px;object-fit:contain}
.marca b{display:block;font:800 18px var(--disp)}
.marca small{display:block;font-size:10px;letter-spacing:.03em;color:#DCEAE5}
.barra nav{margin-left:auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.barra nav a{font:600 14px var(--body);text-decoration:none;color:#DCEAE5}
.barra nav a:hover{color:#fff}
.barra nav a.boton{color:var(--marino)}
.boton{display:inline-block;padding:12px 20px;border-radius:9px;background:var(--oro);color:var(--marino);font-weight:800;text-decoration:none;text-align:center}
.boton:hover{filter:brightness(1.06)}
.migas{font-size:13px;color:var(--suave);margin:26px 0 8px}
.migas a{color:var(--suave)}
.heroe{background:var(--gris);border-bottom:1px solid var(--linea);padding:28px 0 54px}
.heroe .marco{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,420px);align-items:center;gap:56px}
.heroe .marco.sin-imagen{display:block;max-width:900px}
.etq{display:inline-block;color:var(--azul);font:700 12px var(--body);text-transform:uppercase;letter-spacing:.1em}
h1,h2,h3{font-family:var(--disp);line-height:1.15;color:var(--marino);text-wrap:balance}
h1{font-size:clamp(36px,5vw,58px);letter-spacing:-.03em;margin:12px 0 18px}
h2{font-size:clamp(27px,3vw,38px);letter-spacing:-.02em;margin:0 0 16px}
h3{font-size:21px;margin:0 0 8px}
.heroe p{font-size:19px;color:var(--suave);margin:0 0 22px;max-width:680px}
.heroe figure{margin:0}
.heroe figure img,.muestra img{display:block;width:100%;border-radius:14px;border:1px solid var(--linea);box-shadow:0 16px 40px -25px rgba(12,47,43,.35)}
.heroe figcaption,.muestra figcaption{font-size:12px;color:var(--suave);margin-top:8px}
main>section:not(.heroe){padding:64px 0}
main>section:nth-of-type(odd):not(.heroe){background:var(--gris)}
.col{max-width:780px}
.col p{margin:0 0 18px}
.col ul,.col ol{padding-left:23px;margin:12px 0 24px}
.col li{margin:0 0 9px}
.rejilla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}
.tarjeta{padding:23px;border:1px solid var(--linea);border-radius:12px;background:#fff}
.tarjeta p{margin:0;color:var(--suave)}
.dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,460px);gap:48px;align-items:center}
.muestra{margin:0}
.nota{border-left:4px solid var(--oro);padding:12px 18px;background:#FFF9E8;color:var(--texto);margin:24px 0}
.nota p{margin:0}
.cta{background:var(--marino)!important;color:#fff;text-align:center}
.cta h2,.cta p{color:#fff}
.cta p{max-width:680px;margin:0 auto 22px}
.relacionadas{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.relacionadas a{border:1px solid var(--linea);background:#fff;border-radius:8px;padding:11px 14px;text-decoration:none;font-weight:700}
.pie{background:#072624;color:#DCEAE5;padding:32px 0 42px;font-size:14px}
.pie p{margin:0 0 12px}
.pie nav{display:flex;flex-wrap:wrap;gap:10px 20px}
.pie a{color:#DCEAE5}
@media(max-width:800px){.heroe .marco,.dos{grid-template-columns:minmax(0,1fr);gap:26px}.heroe .marco>*,.dos>*{min-width:0}.heroe figure{max-width:520px}.rejilla{grid-template-columns:1fr}.barra nav a:not(.boton){display:none}}
@media(max-width:480px){.marco{width:min(100% - 28px,1120px)}.barra .marco{min-height:64px}.marca b{font-size:15px}.marca small{font-size:9px}.barra nav{display:none}main>section:not(.heroe){padding:44px 0}.heroe{padding-bottom:40px}}