:root{
  --texto:#2E2E2E; --suave:#5E6470; --azul:#0038A8; --azul-osc:#002A80; --amarillo:#FCD116; --ambar:#E8A800;
  --fondo:#FFFFFF; --claro:#F5F5F5; --linea:#E5E5E5; --ancho:1120px; --lectura:720px;
  --titulos:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif; --cuerpo:'Source Serif 4',Georgia,'Times New Roman',serif;
  --oswald:Oswald,"Arial Narrow",sans-serif; --radio:8px; --sombra:6px 6px 0 rgba(46,46,46,.08);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--texto);font-family:var(--cuerpo);font-size:19px;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:var(--azul);text-underline-offset:3px}
a:hover{color:var(--azul-osc)}
.envoltura{max-width:var(--ancho);margin:0 auto;padding:0 20px}
#ultimas{scroll-margin-top:96px}

/* Títulos: H2 de sección en Oswald con rayita amarilla (estilo del usuario) */
h1,h2,h3{font-family:var(--titulos);font-weight:800;line-height:1.2;color:var(--texto)}
h1{font-size:clamp(30px,4.4vw,46px);margin:.2em 0 .35em}
h2{font-size:clamp(23px,2.6vw,28px);margin:1.6em 0 .5em}
h3{font-size:20px;margin:0 0 .35em}
.titulo-seccion{margin:0 0 26px}
.titulo-seccion h1,.titulo-seccion h2{font-family:var(--oswald);font-weight:700;font-size:clamp(26px,2vw + 14px,34px);text-transform:uppercase;letter-spacing:.02em;margin:0}
.titulo-seccion h1::after,.titulo-seccion h2::after{content:"";display:block;width:44px;height:4px;border-radius:2px;background:var(--amarillo);margin-top:10px}
.etiqueta{position:relative;z-index:1;display:inline-block;font-family:var(--titulos);font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--azul);text-decoration:none}
.etiqueta::before{content:"";display:inline-block;width:16px;height:4px;background:var(--amarillo);vertical-align:middle;margin-right:7px;border-radius:2px}

/* Bandas con fondo alterno */
.banda{padding:56px 0 64px}
.banda--gris{background:var(--claro)}

/* Tarjetas de notas: foto arriba, toda la tarjeta clickeable, sombra recta sin desenfoque */
.grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:28px}
.tarjeta{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);transition:transform .15s,box-shadow .15s}
.tarjeta:hover{transform:translateY(-3px);box-shadow:8px 8px 0 rgba(252,209,22,.55)}
.tarjeta__foto{width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--claro)}
.tarjeta .etiqueta{margin:18px 20px 6px}
.tarjeta h3{margin:0 20px 8px;font-size:20px;line-height:1.25}
.tarjeta__link{color:var(--texto);text-decoration:none}
.tarjeta__link::after{content:"";position:absolute;inset:0}
.tarjeta:hover .tarjeta__link{color:var(--azul)}
.tarjeta p{margin:0 20px 22px;font-size:16px;line-height:1.55;color:var(--suave)}

/* Nota */
.nota{max-width:var(--lectura);margin:0 auto;padding:34px 20px 60px}
.migas{font-family:var(--titulos);font-size:14px;color:var(--suave)}
.migas a{color:var(--suave)}
.nota .bajada{font-size:21px;line-height:1.5;color:var(--suave);margin:0 0 18px}
.firma{font-family:var(--titulos);font-size:14px;color:var(--suave);padding:12px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);margin:0 0 24px}
.nota__foto{margin:0 0 30px}
.nota__foto img{width:100%;border-radius:var(--radio)}
.nota__foto figcaption{margin-top:8px;font-family:var(--titulos);font-size:13px;color:var(--suave)}
.nota h2{font-family:var(--oswald);font-weight:700;font-size:clamp(24px,1.4vw + 16px,30px);letter-spacing:.01em;margin:1.7em 0 .55em}
.nota h2::after{content:"";display:block;width:44px;height:4px;border-radius:2px;background:var(--amarillo);margin-top:8px}
.nota ul{padding-left:1.2em}
.nota li{margin:.35em 0}
.nota li::marker{color:var(--ambar)}

/* Páginas */
.pagina{max-width:var(--lectura);margin:0 auto;padding:34px 20px 60px}

/* Pie: color oscuro, logo con contorno */
.pie{background:#1F2430;color:#D5DEE6;font-family:var(--titulos);font-size:15px;line-height:1.6;padding-top:clamp(40px,5vw,64px)}
.pie__grilla{display:grid;gap:36px 28px;grid-template-columns:1fr;padding-bottom:clamp(36px,4vw,56px)}
@media (min-width:600px){.pie__grilla{grid-template-columns:1fr 1fr}.pie__marca{grid-column:1/-1}}
@media (min-width:1000px){.pie__grilla{grid-template-columns:1.4fr 1fr 1.3fr 1fr}.pie__marca{grid-column:auto}}
.pie__marca img{width:230px;margin-bottom:14px}
.pie__marca p{max-width:340px;margin:0 0 18px;color:#D5DEE6}
.pie__marca .btn{padding:.75em 1.2em}
.pie h3{position:relative;margin:0 0 18px;padding-bottom:10px;font-family:var(--oswald);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:18px;color:#fff}
.pie h3::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:3px;border-radius:2px;background:var(--amarillo)}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.pie ul a{color:#D5DEE6;text-decoration:none;line-height:1.4}
.pie ul a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--amarillo);text-decoration-thickness:2px;text-underline-offset:4px}
.pie__base{border-top:1px solid rgba(255,255,255,.14)}
.pie__base-fila{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 28px;padding-top:18px;padding-bottom:18px;font-size:13px;color:#B9C6D2}

@media (max-width:640px){
  body{font-size:18px}
  .grilla{grid-template-columns:1fr}
  .banda{padding:40px 0 48px}
}
@media (max-width:599px){
  .pie__grilla{grid-template-columns:1fr 1fr;grid-template-areas:"marca marca" "secciones revista" "organismos organismos";gap:32px 20px}
  .pie__marca{grid-area:marca}.pie__grilla>nav{grid-area:secciones}.pie__grilla>div:nth-of-type(2){grid-area:organismos}.pie__grilla>div:nth-of-type(3){grid-area:revista}
}