:root { --navy:#0a1b33; --blue:#0870e0; --sky:#1898f8; --ink:#14213a; --muted:#5b6880; --line:#e1e7ef; --mist:#f4f7fb; --tint:#eaf2fd; --on-navy:#c3cfe1; --wa:#25d366;
  --display:"Sora","Segoe UI",system-ui,sans-serif; --body:"Manrope","Segoe UI",system-ui,sans-serif; }
* { box-sizing:border-box; }
body { margin:0; font-family:var(--body); color:var(--ink); background:#fff; line-height:1.7; font-size:17px; -webkit-font-smoothing:antialiased; }
a { color:var(--blue); }
.wrap { max-width:1100px; margin:0 auto; padding-inline:24px; }
header { background:var(--navy); position:sticky; top:0; z-index:50; }
.nav { display:flex; align-items:center; justify-content:space-between; height:76px; gap:16px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; flex-shrink:0; }
.brand img { width:56px; height:56px; }
.brand b { font-family:var(--display); color:#fff; letter-spacing:.06em; display:block; line-height:1.1; }
.brand small { font-family:var(--display); font-size:.58rem; letter-spacing:.3em; color:var(--on-navy); white-space:nowrap; }
.nav-links { display:flex; gap:22px; align-items:center; }
.nav-links a { color:#fff; text-decoration:none; font-weight:600; font-size:.9rem; white-space:nowrap; }
.nav-links a:hover { color:var(--sky); }
.btn { display:inline-flex; align-items:center; gap:10px; padding:13px 24px; border-radius:999px; background:var(--blue); color:#fff !important; font-family:var(--display); font-weight:600; font-size:.9rem; text-decoration:none; }
.btn:hover { background:#065cbd; }
.btn-wa { background:var(--wa); }
.hero { background:radial-gradient(800px 400px at 90% 0%, var(--tint), transparent 70%); padding:64px 0 40px; }
.eyebrow { font-family:var(--display); font-size:.72rem; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--blue); }
h1,h2,h3 { font-family:var(--display); color:var(--navy); line-height:1.2; letter-spacing:-.01em; }
h1 { font-size:clamp(1.9rem,4vw,2.8rem); margin:12px 0 14px; }
.lead { color:var(--muted); font-size:1.08rem; max-width:62ch; margin:0; }
.filtros { display:flex; flex-wrap:wrap; gap:8px; margin:28px 0 0; }
.filtros button { border:1px solid var(--line); background:#fff; border-radius:999px; padding:8px 16px; font-family:var(--display); font-size:.82rem; cursor:pointer; color:var(--ink); }
.filtros button.on { background:var(--navy); color:#fff; border-color:var(--navy); }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding:36px 0 90px; }
.card { display:flex; flex-direction:column; gap:10px; padding:24px; border:1px solid var(--line); border-radius:18px; text-decoration:none; color:var(--ink); background:#fff; transition:border-color .2s, transform .2s; }
.card:hover { border-color:var(--sky); transform:translateY(-2px); }
.card .tag { align-self:flex-start; font-family:var(--display); font-size:.7rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--blue); background:var(--tint); padding:4px 10px; border-radius:999px; }
.card h3 { margin:0; font-size:1.12rem; }
.card p { margin:0; color:var(--muted); font-size:.92rem; line-height:1.55; }
.card .leer { margin-top:auto; font-family:var(--display); font-weight:600; font-size:.86rem; color:var(--blue); }
article { max-width:760px; margin:0 auto; padding:56px 24px 40px; }
.miga { font-size:.85rem; color:var(--muted); }
.miga a { color:var(--muted); }
article h2 { font-size:1.4rem; margin:40px 0 10px; }
article p, article li { color:#26324a; }
article li { margin:6px 0; }
.compartir { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:22px 0 0; font-family:var(--display); font-size:.82rem; color:var(--muted); }
.compartir a, .compartir button { display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--ink); font-family:var(--display); font-weight:600; font-size:.82rem; text-decoration:none; cursor:pointer; }
.compartir .wa { background:var(--wa); border-color:var(--wa); color:#fff; }
.compartir svg { width:16px; height:16px; fill:currentColor; }
.video { position:relative; padding-top:177%; max-width:360px; margin:28px auto; border-radius:18px; overflow:hidden; background:#000; }
.video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.cta { margin:48px 0 0; padding:30px; border-radius:20px; background:var(--navy); color:var(--on-navy); }
.cta h2 { color:#fff; margin:0 0 8px; font-size:1.35rem; }
article .cta p { margin:0 0 20px; color:#dbe6f5; }
.cta .acciones { display:flex; flex-wrap:wrap; gap:10px; }
.mas { max-width:760px; margin:0 auto; padding:0 24px 80px; }
.mas h2 { font-size:1.15rem; }
.mas ul { padding-left:18px; }
footer { background:var(--navy); color:var(--on-navy); padding:40px 0; font-size:.9rem; }
footer a { color:var(--on-navy); text-decoration:none; }
footer a:hover { color:#fff; }
.foot { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; }
@media (max-width:900px) { .grid { grid-template-columns:1fr 1fr; } .nav-links a:not(.btn) { display:none; } }
@media (max-width:600px) { .grid { grid-template-columns:1fr; } .wrap { padding-inline:18px; } .brand small { display:none; } }