/* =========================================================
   GUASAVE NOTICIAS RP — hoja de estilos
   Paleta: #343188 (azul institucional) + blanco
   Tipografía: Oswald (titulares, condensada, estilo TV) + Source Sans 3 (cuerpo)
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Source+Sans+3:ital,wght@0,400;0,600;0,700;1,400&display=swap');

:root{
  --azul: #343188;
  --azul-oscuro: #201f57;
  --azul-claro: #4b47b8;
  --rojo: #d3121a;
  --dorado: #e2b13c;
  --blanco: #ffffff;
  --gris-100: #f4f4f8;
  --gris-200: #e6e6ef;
  --gris-500: #7a7a90;
  --gris-800: #2b2b38;
  --sombra: 0 6px 20px rgba(32,31,87,0.12);
  --radio: 4px;
}

*{ box-sizing: border-box; }

html{ scroll-behavior: smooth; }

body{
  margin:0;
  font-family:'Source Sans 3', system-ui, sans-serif;
  color: var(--gris-800);
  background: var(--gris-100);
  line-height: 1.5;
}

a{ color: inherit; text-decoration: none; }
img{ max-width:100%; display:block; }

h1,h2,h3,h4{
  font-family:'Oswald', sans-serif;
  margin:0 0 .4em;
  text-transform: uppercase;
  letter-spacing: .01em;
}

.container{
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ---------- Barra superior de fecha / ticker ---------- */
.topbar{
  background: var(--azul-oscuro);
  color: var(--blanco);
  font-size: .78rem;
  letter-spacing: .04em;
}
.topbar .container{
  display:flex;
  justify-content: space-between;
  align-items:center;
  padding-top:6px;
  padding-bottom:6px;
  flex-wrap: wrap;
  gap: 6px;
}
.topbar .fecha{ text-transform: uppercase; opacity:.9; }
.topbar .rp-tag{
  background: var(--rojo);
  padding: 2px 10px;
  border-radius: 2px;
  font-weight: 700;
  text-transform: uppercase;
}

/* ---------- Ticker de última hora ---------- */
.ticker{
  background: var(--rojo);
  color: var(--blanco);
  overflow: hidden;
  white-space: nowrap;
  position: relative;
}
.ticker-label{
  position:absolute;
  left:0; top:0; bottom:0;
  background: var(--azul-oscuro);
  padding: 8px 16px;
  font-family:'Oswald', sans-serif;
  font-weight:700;
  text-transform: uppercase;
  font-size:.85rem;
  display:flex;
  align-items:center;
  z-index:2;
  letter-spacing:.05em;
}
.ticker-label::before{
  content:'';
  width:8px; height:8px;
  background: var(--blanco);
  border-radius:50%;
  display:inline-block;
  margin-right:8px;
  animation: pulso 1.4s infinite;
}
@keyframes pulso{
  0%,100%{ opacity:1; }
  50%{ opacity:.25; }
}
.ticker-track{
  display:inline-block;
  padding: 8px 0 8px 190px;
  animation: desfile 32s linear infinite;
  font-size:.9rem;
  font-weight: 600;
}
.ticker-track span{ margin-right: 60px; }
.ticker:hover .ticker-track{ animation-play-state: paused; }
@keyframes desfile{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}

/* ---------- Header / masthead ---------- */
header.masthead{
  background: var(--blanco);
  border-bottom: 6px solid var(--azul);
}
.masthead-inner{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 18px 0;
  gap: 20px;
}
.brand{
  display:flex;
  align-items:center;
  gap: 14px;
}
.brand img.logo{
  height: 56px;
  width:auto;
}
.brand-text .titulo-marca{
  font-family:'Oswald', sans-serif;
  font-weight: 700;
  font-size: 1.9rem;
  color: var(--azul);
  line-height: 1;
  margin:0;
}
.brand-text .titulo-marca em{
  font-style: normal;
  color: var(--rojo);
}
.brand-text .subtitulo-marca{
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gris-500);
  margin-top: 4px;
}
.admin-link{
  font-size:.8rem;
  font-weight:600;
  color: var(--azul);
  border: 1px solid var(--azul);
  padding: 8px 16px;
  border-radius: 2px;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
  transition: all .15s ease;
}
.admin-link:hover{ background: var(--azul); color: var(--blanco); }

/* ---------- Nav de categorías ---------- */
nav.categorias{
  background: var(--azul);
}
nav.categorias .container{
  display:flex;
  gap: 4px;
  overflow-x:auto;
  scrollbar-width: none;
}
nav.categorias .container::-webkit-scrollbar{ display:none; }
nav.categorias a{
  color: var(--blanco);
  font-family:'Oswald', sans-serif;
  font-weight: 500;
  font-size: .85rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 12px 16px;
  white-space: nowrap;
  border-bottom: 3px solid transparent;
  transition: all .15s ease;
}
nav.categorias a:hover,
nav.categorias a.activo{
  background: var(--azul-oscuro);
  border-bottom-color: var(--dorado);
}

/* ---------- Contenido principal ---------- */
main{ padding: 32px 0 60px; }

.seccion-titulo{
  display:flex;
  align-items:center;
  gap: 12px;
  margin: 40px 0 18px;
}
.seccion-titulo h2{
  font-size: 1.15rem;
  color: var(--azul);
  margin:0;
  white-space: nowrap;
}
.seccion-titulo .linea{
  height: 3px;
  background: var(--azul);
  flex:1;
  opacity:.15;
}

/* ---------- Historia destacada ---------- */
.destacado{
  display:grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 28px;
  background: var(--blanco);
  box-shadow: var(--sombra);
  border-radius: var(--radio);
  overflow: hidden;
}
.destacado .media{
  position: relative;
  background: var(--azul-oscuro);
  min-height: 340px;
}
.destacado .media img,
.destacado .media video{
  width:100%; height:100%;
  object-fit: cover;
  min-height: 340px;
}
.destacado .media .placeholder{
  width:100%; height:100%;
  min-height:340px;
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,.35);
  font-family:'Oswald',sans-serif;
  font-size: 3rem;
  letter-spacing: .1em;
}
.badge{
  position:absolute;
  top: 16px; left:16px;
  background: var(--rojo);
  color: var(--blanco);
  font-family:'Oswald', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  padding: 5px 12px;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: 2px;
}
.destacado .info{
  padding: 30px 34px 30px 4px;
  display:flex;
  flex-direction: column;
  justify-content:center;
}
.categoria-tag{
  color: var(--rojo);
  font-family:'Oswald', sans-serif;
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform: uppercase;
  margin-bottom: 10px;
  display:inline-block;
}
.destacado h1{
  font-size: 2rem;
  color: var(--gris-800);
  line-height: 1.12;
  margin-bottom: 14px;
}
.destacado h1 a:hover{ color: var(--azul); }
.resumen{
  color:#4a4a58;
  font-size: 1rem;
  margin-bottom: 18px;
}
.meta{
  font-size: .78rem;
  color: var(--gris-500);
  text-transform: uppercase;
  letter-spacing: .03em;
}

/* ---------- Buscador de índice de noticias ---------- */
.buscador-noticias{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom: 30px;
  background: var(--blanco);
  padding: 16px;
  border-radius: var(--radio);
  box-shadow: var(--sombra);
}
.buscador-input{
  flex: 1 1 240px;
  padding: 11px 14px;
  border: 1px solid var(--gris-200);
  border-radius: 3px;
  font-family: inherit;
  font-size: .95rem;
  background: var(--gris-100);
}
.buscador-select{
  padding: 11px 14px;
  border: 1px solid var(--gris-200);
  border-radius: 3px;
  font-family: inherit;
  font-size: .9rem;
  background: var(--gris-100);
  min-width: 180px;
}
.buscador-input:focus, .buscador-select:focus{
  outline:none;
  border-color: var(--azul);
  background: var(--blanco);
}

/* ---------- Rejilla de notas ---------- */
.grid-notas{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.tarjeta{
  background: var(--blanco);
  border-radius: var(--radio);
  overflow:hidden;
  box-shadow: var(--sombra);
  display:flex;
  flex-direction: column;
  transition: transform .15s ease;
}
.tarjeta:hover{ transform: translateY(-3px); }
.tarjeta .media{
  position:relative;
  background: var(--gris-200);
  aspect-ratio: 16/10;
  overflow:hidden;
}
.tarjeta .media img,
.tarjeta .media video{ width:100%; height:100%; object-fit:cover; }
.tarjeta .media .placeholder{
  width:100%;height:100%;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--azul), var(--azul-oscuro));
  color: rgba(255,255,255,.4);
  font-family:'Oswald',sans-serif;
  font-size:1.6rem;
}
.tarjeta .info{ padding: 16px 18px 20px; flex:1; display:flex; flex-direction:column; }
.tarjeta h3{
  font-size: 1.08rem;
  line-height:1.25;
  margin-bottom: 8px;
  color: var(--gris-800);
}
.tarjeta h3 a:hover{ color: var(--azul); }
.tarjeta p{ font-size:.9rem; color:#5b5b6b; margin: 0 0 12px; flex:1; }

/* ---------- Página de nota individual ---------- */
.nota-header{ max-width: 820px; margin: 0 auto 24px; text-align:left; }
.nota-header .categoria-tag{ margin-bottom: 10px; }
.nota-header h1{
  font-size: 2.3rem;
  color: var(--gris-800);
  line-height:1.15;
}
.nota-header .resumen{ font-size:1.1rem; }
.nota-media{
  max-width: 900px;
  margin: 0 auto 28px;
  border-radius: var(--radio);
  overflow:hidden;
  box-shadow: var(--sombra);
}
.nota-media img, .nota-media video{ width:100%; }
.nota-cuerpo{
  max-width: 720px;
  margin: 0 auto;
  background: var(--blanco);
  padding: 34px 40px;
  border-radius: var(--radio);
  box-shadow: var(--sombra);
  font-size: 1.05rem;
}
.nota-cuerpo p{ margin: 0 0 1.1em; }
.compartir{
  max-width: 720px;
  margin: 24px auto 0;
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;
}
.compartir span{
  font-family:'Oswald', sans-serif;
  text-transform: uppercase;
  font-size:.8rem;
  color: var(--gris-500);
  letter-spacing:.05em;
}
.btn-compartir{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 8px 16px;
  border-radius: 2px;
  font-size: .85rem;
  font-weight:600;
  border: 1px solid var(--gris-200);
  background: var(--blanco);
  cursor:pointer;
  transition: all .15s ease;
}
.btn-compartir:hover{ background: var(--azul); color:var(--blanco); border-color: var(--azul); }
.btn-compartir.copiado{ background: var(--dorado); border-color: var(--dorado); color: var(--gris-800); }

.relacionadas{ max-width: 900px; margin: 50px auto 0; }

/* ---------- Footer ---------- */
footer.site-footer{
  background: var(--azul-oscuro);
  color: rgba(255,255,255,.85);
  margin-top: 60px;
}
.footer-top{
  padding: 40px 0 24px;
  display:grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 30px;
}
.footer-top h4{ color: var(--blanco); font-size:.95rem; }
.footer-top p, .footer-top a{ font-size:.85rem; color: rgba(255,255,255,.7); line-height:1.7; }
.footer-top a:hover{ color: var(--blanco); }
.footer-top ul{ list-style:none; padding:0; margin:0; }
.disclaimer-box{
  background: rgba(0,0,0,.22);
  border-left: 4px solid var(--dorado);
  padding: 16px 20px;
  font-size: .82rem;
  line-height: 1.6;
  color: rgba(255,255,255,.85);
  border-radius: 2px;
}
.disclaimer-box strong{ color: var(--dorado); }
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 16px 0;
  font-size: .78rem;
  color: rgba(255,255,255,.55);
  text-align:center;
}

/* ---------- Admin: login ---------- */
.login-wrap{
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background: linear-gradient(160deg, var(--azul-oscuro), var(--azul) 60%);
  padding: 20px;
}
.login-card{
  background: var(--blanco);
  width: 100%;
  max-width: 380px;
  padding: 40px 34px;
  border-radius: var(--radio);
  box-shadow: 0 20px 50px rgba(0,0,0,.3);
  text-align:center;
}
.login-card img.logo{ height: 60px; margin: 0 auto 10px; }
.login-card h1{ font-size: 1.3rem; color: var(--azul); margin-bottom: 4px; }
.login-card .sub{ font-size:.8rem; color: var(--gris-500); margin-bottom: 26px; text-transform: uppercase; letter-spacing:.05em; }
.campo{ text-align:left; margin-bottom: 16px; }
.campo label{ display:block; font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color: var(--gris-500); margin-bottom: 6px; }
.campo input, .campo select, .campo textarea{
  width:100%;
  padding: 11px 13px;
  border: 1px solid var(--gris-200);
  border-radius: 3px;
  font-family: inherit;
  font-size: .95rem;
  background: var(--gris-100);
}
.campo input:focus, .campo select:focus, .campo textarea:focus{
  outline: none;
  border-color: var(--azul);
  background: var(--blanco);
}
.campo textarea{ resize: vertical; min-height: 90px; }
.btn{
  display:inline-block;
  width:100%;
  padding: 12px;
  background: var(--azul);
  color: var(--blanco);
  font-family:'Oswald',sans-serif;
  font-weight:600;
  text-transform: uppercase;
  letter-spacing:.05em;
  border:none;
  border-radius: 3px;
  cursor:pointer;
  font-size:.9rem;
  transition: background .15s ease;
}
.btn:hover{ background: var(--azul-oscuro); }
.btn.rojo{ background: var(--rojo); }
.btn.rojo:hover{ background: #a80d13; }
.btn.secundario{ background: var(--blanco); color: var(--azul); border: 1px solid var(--azul); }
.btn.secundario:hover{ background: var(--gris-100); }
.error-msg{
  background: #fdeaea;
  color: var(--rojo);
  border: 1px solid #f4c6c8;
  padding: 10px 14px;
  border-radius: 3px;
  font-size: .85rem;
  margin-bottom: 16px;
  text-align:left;
}
.ok-msg{
  background: #eaf7ec;
  color: #1f7a34;
  border: 1px solid #c7e9cc;
  padding: 10px 14px;
  border-radius: 3px;
  font-size: .85rem;
  margin-bottom: 16px;
}

/* ---------- Admin: dashboard ---------- */
.admin-header{
  background: var(--azul);
  color: var(--blanco);
  padding: 18px 0;
}
.admin-header .container{
  display:flex;
  align-items:center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
.admin-header .titulo-marca{ font-size: 1.3rem; color: var(--blanco); margin:0; }
.admin-header .titulo-marca em{ color: var(--dorado); font-style:normal; }
.admin-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.admin-actions form{ display:inline; }
.admin-actions .btn{ width:auto; padding: 9px 18px; font-size:.8rem; }

.admin-main{ padding: 30px 0 60px; }
.admin-panel{
  background: var(--blanco);
  border-radius: var(--radio);
  box-shadow: var(--sombra);
  padding: 24px 26px;
  margin-bottom: 26px;
}
.admin-panel h2{ font-size:1.1rem; color: var(--azul); margin-bottom: 18px; }

.tabla-notas{ width:100%; border-collapse: collapse; font-size:.9rem; }
.tabla-notas th{
  text-align:left;
  font-family:'Oswald',sans-serif;
  text-transform: uppercase;
  font-size:.72rem;
  letter-spacing:.05em;
  color: var(--gris-500);
  border-bottom: 2px solid var(--gris-200);
  padding: 10px 8px;
}
.tabla-notas td{
  padding: 12px 8px;
  border-bottom: 1px solid var(--gris-200);
  vertical-align: middle;
}
.tabla-notas tr:hover{ background: var(--gris-100); }
.tabla-notas .miniatura{
  width: 64px; height: 40px;
  object-fit: cover;
  border-radius: 3px;
  background: var(--gris-200);
}
.pill{
  display:inline-block;
  font-size:.7rem;
  font-weight:700;
  padding: 3px 9px;
  border-radius: 10px;
  background: var(--gris-200);
  color: var(--gris-800);
  text-transform: uppercase;
}
.pill.destacada{ background: var(--dorado); color: #5c4700; }
.acciones-fila{ display:flex; gap:8px; }
.acciones-fila a, .acciones-fila button{
  font-size:.78rem;
  padding: 6px 12px;
  border-radius: 3px;
  border: 1px solid var(--gris-200);
  background: var(--blanco);
  cursor:pointer;
  font-family: inherit;
}
.acciones-fila a:hover{ background: var(--azul); color:var(--blanco); border-color:var(--azul); }
.acciones-fila button.del:hover{ background: var(--rojo); color:var(--blanco); border-color:var(--rojo); }

.form-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-grid .full{ grid-column: 1 / -1; }
.check-row{ display:flex; align-items:center; gap:8px; margin-top: 6px; }
.check-row input{ width:auto; }
.preview-actual{ display:flex; align-items:center; gap:12px; margin-top:8px; font-size:.85rem; color: var(--gris-500); }
.preview-actual img, .preview-actual video{ width:110px; height:70px; object-fit:cover; border-radius:3px; }

.empty-state{
  text-align:center;
  padding: 40px 20px;
  color: var(--gris-500);
}

/* ---------- 404 ---------- */
.pagina-404{
  min-height: 60vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 60px 20px;
}
.pagina-404 h1{ font-size: 5rem; color: var(--azul); margin-bottom:0; }
.pagina-404 p{ color: var(--gris-500); margin-bottom: 20px; }

/* ---------- Responsive ---------- */
@media (max-width: 860px){
  .destacado{ grid-template-columns: 1fr; }
  .destacado .info{ padding: 24px; }
  .grid-notas{ grid-template-columns: repeat(2,1fr); }
  .footer-top{ grid-template-columns: 1fr; }
  .form-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
  .grid-notas{ grid-template-columns: 1fr; }
  .brand-text .titulo-marca{ font-size: 1.4rem; }
  .destacado h1{ font-size: 1.5rem; }
  .nota-header h1{ font-size: 1.7rem; }
  .nota-cuerpo{ padding: 22px 20px; }
}

/* ---------- Ajustes de interfaz ---------- */
:root{
  --azul: #173f5f;
  --azul-oscuro: #102d45;
  --azul-claro: #20639b;
  --rojo: #ed553b;
  --dorado: #f6c85f;
  --gris-100: #f4f7f8;
  --gris-200: #dce5e9;
  --gris-500: #6b7c86;
  --gris-800: #19323f;
  --sombra: 0 12px 32px rgba(16,45,69,.10);
  --radio: 8px;
}

body{
  background: #eef3f4;
  color: var(--gris-800);
}

.container{ max-width: 1240px; padding-left: 24px; padding-right: 24px; }
main{ padding-top: 42px; }

.topbar{ background: var(--azul-oscuro); }
.topbar .container{ min-height: 34px; }
.topbar .rp-tag{ border-radius: 999px; padding: 3px 12px; background: rgba(246,200,95,.16); color: var(--dorado); }
.ticker{ background: var(--rojo); }
.ticker-label{ background: var(--azul-oscuro); padding-left: 24px; padding-right: 24px; }

header.masthead{ border-bottom: 1px solid var(--gris-200); }
.masthead-inner{ padding-top: 24px; padding-bottom: 22px; }
.brand{ gap: 16px; }
.brand img.logo{ height: 62px; }
.brand-text .titulo-marca{ font-size: 2.05rem; letter-spacing: -.01em; }
.brand-text .subtitulo-marca{ color: var(--gris-500); }
.admin-link{ border-radius: 999px; padding: 9px 16px; }

nav.categorias{ background: var(--blanco); border-bottom: 1px solid var(--gris-200); }
nav.categorias .container{ gap: 2px; }
nav.categorias a{ color: var(--azul); padding: 14px 16px 12px; border-bottom-width: 3px; }
nav.categorias a:hover, nav.categorias a.activo{ background: #eaf1f4; color: var(--azul-oscuro); border-bottom-color: var(--rojo); }

.seccion-titulo{ margin-top: 16px; margin-bottom: 22px; }
.seccion-titulo h2{ font-size: 1.25rem; letter-spacing: .02em; }
.seccion-titulo .linea{ background: var(--rojo); height: 2px; opacity: .35; }

.destacado{ grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); gap: 0; border: 1px solid var(--gris-200); box-shadow: var(--sombra); }
.destacado .media{ min-height: 390px; }
.destacado .media img, .destacado .media video, .destacado .media .placeholder{ min-height: 390px; }
.destacado .info{ padding: 38px 42px; }
.destacado h1{ font-size: clamp(2rem, 3.2vw, 3rem); }
.destacado .resumen{ font-size: 1.08rem; line-height: 1.65; }
.badge{ border-radius: 999px; padding: 6px 13px; }
.categoria-tag{ color: var(--rojo); }

.grid-notas{ gap: 20px; }
.tarjeta{ border: 1px solid var(--gris-200); box-shadow: 0 7px 20px rgba(16,45,69,.07); }
.tarjeta:hover{ transform: translateY(-5px); box-shadow: 0 14px 28px rgba(16,45,69,.13); }
.tarjeta .media{ aspect-ratio: 16/9; }
.tarjeta .info{ padding: 19px 20px 21px; }
.tarjeta h3{ font-size: 1.16rem; }
.tarjeta p{ line-height: 1.55; }

.buscador-noticias{ padding: 18px; border: 1px solid var(--gris-200); box-shadow: 0 7px 20px rgba(16,45,69,.06); }
.buscador-input, .buscador-select, .campo input, .campo select, .campo textarea{ border-radius: 6px; border-color: var(--gris-200); background: #fbfcfc; }
.buscador-input:focus, .buscador-select:focus, .campo input:focus, .campo select:focus, .campo textarea:focus{ box-shadow: 0 0 0 3px rgba(32,99,155,.12); }
.btn{ border-radius: 6px; background: var(--rojo); }
.btn:hover{ background: #c9412b; }
.btn.secundario{ color: var(--azul); border-color: var(--gris-200); }

.nota-header{ max-width: 850px; padding-top: 12px; }
.nota-header h1{ font-size: clamp(2rem, 4vw, 3.2rem); }
.nota-header .resumen{ font-size: 1.18rem; line-height: 1.6; }
.nota-media{ max-width: 980px; border-radius: var(--radio); }
.nota-cuerpo{ max-width: 760px; border: 1px solid var(--gris-200); font-size: 1.1rem; line-height: 1.8; }
.btn-compartir{ border-radius: 999px; }

footer.site-footer{ margin-top: 76px; background: var(--azul-oscuro); }
.footer-top{ padding-top: 48px; }

.admin-header{ background: var(--azul-oscuro); }
.admin-panel{ border: 1px solid var(--gris-200); box-shadow: 0 7px 20px rgba(16,45,69,.07); }
.tabla-notas{ min-width: 760px; }
.admin-panel:has(.tabla-notas){ overflow-x: auto; }
.acciones-fila a, .acciones-fila button{ border-radius: 999px; }

.login-wrap{ background: radial-gradient(circle at 20% 10%, #20639b 0, var(--azul-oscuro) 54%, #0b2031 100%); }
.login-card{ max-width: 420px; border-radius: 12px; padding: 44px 38px; }

@media (max-width: 860px){
  .destacado .media, .destacado .media img, .destacado .media video, .destacado .media .placeholder{ min-height: 300px; }
  .destacado .info{ padding: 28px; }
}
@media (max-width: 560px){
  .container{ padding-left: 16px; padding-right: 16px; }
  main{ padding-top: 28px; }
  .topbar .container{ align-items: flex-start; }
  .topbar .rp-tag{ font-size: .68rem; }
  .masthead-inner{ align-items: flex-start; }
  .brand img.logo{ height: 48px; }
  .brand-text .titulo-marca{ font-size: 1.35rem; }
  .brand-text .subtitulo-marca{ font-size: .62rem; }
  .admin-link{ font-size: .68rem; padding: 8px 11px; }
  nav.categorias a{ padding-left: 12px; padding-right: 12px; }
  .destacado .info{ padding: 24px; }
  .destacado h1{ font-size: 1.85rem; }
  .buscador-noticias > *{ width: 100% !important; min-width: 0; }
  .nota-header h1{ font-size: 2rem; }
  .compartir{ align-items: stretch; }
  .compartir span{ width: 100%; }
  .btn-compartir{ justify-content: center; }
  .login-card{ padding: 34px 24px; }
}