/* ================================================================
   NOTICIERO PRO — Hoja de estilos global
   Aplica a: portada (front-page.php) y posts (single.php)
================================================================ */

/* ── VARIABLES ── */
:root {
  --rojo:       #c0392b;
  --negro:      #0d0d0d;
  --gris-oscuro:#1a1a1a;
  --gris-medio: #2e2e2e;
  --gris-claro: #f5f5f0;
  --dorado:     #d4a843;
  --texto:      #1c1c1c;
  --blanco:     #ffffff;
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
body   { font-family:'Source Sans 3',sans-serif; background:var(--gris-claro); color:var(--texto); }
a      { text-decoration:none; }
img    { display:block; }

/* ================================================================
   HEADER / NAV (compartido)
================================================================ */

/* Top bar */
.cn-top-bar {
  background:var(--negro); color:#aaa;
  font-size:.72rem; font-family:'Oswald',sans-serif; letter-spacing:.08em;
  display:flex; justify-content:space-between; align-items:center; padding:6px 40px;
}
.cn-top-bar a { color:#aaa; text-decoration:none; margin-left:16px; }
.cn-top-bar a:hover { color:var(--dorado); }
.cn-ticker { display:flex; align-items:center; gap:10px; overflow:hidden; max-width:60%; }
.cn-ticker .label { background:var(--rojo); color:#fff; padding:2px 8px; font-size:.65rem; white-space:nowrap; }
.cn-ticker-text { white-space:nowrap; animation:cnTicker 35s linear infinite; color:#ccc; }
@keyframes cnTicker { 0%{ transform:translateX(100%) } 100%{ transform:translateX(-100%) } }

/* Header */
.cn-header { background:var(--blanco); border-bottom:3px solid var(--negro); }
.cn-header-main {
  max-width:1300px; margin:0 auto; padding:22px 40px;
  display:flex; justify-content:space-between; align-items:center;
}
.cn-logo { text-align:center; flex:1; }
.cn-logo .titulo {
  font-family:'Playfair Display',serif; font-size:3.6rem; font-weight:900;
  color:var(--negro); letter-spacing:-2px; line-height:1;
}
.cn-logo .subtitulo {
  font-family:'Oswald',sans-serif; font-size:.68rem; letter-spacing:.3em;
  color:#888; margin-top:4px; text-transform:uppercase;
}
.cn-header-meta { font-size:.78rem; color:#777; text-align:right; font-family:'Source Sans 3',sans-serif; }
.cn-header-meta .fecha { font-weight:600; color:var(--negro); font-size:.85rem; }
.cn-header-weather { font-size:1.5rem; margin-top:4px; }

/* Nav */
.cn-nav { background:var(--negro); }
.cn-nav-inner {
  max-width:1300px; margin:0 auto;
  display:flex; align-items:center; padding:0 40px;
}
.cn-nav a {
  font-family:'Oswald',sans-serif; font-size:.82rem; letter-spacing:.1em;
  color:#ccc; text-decoration:none; padding:13px 18px; display:block;
  text-transform:uppercase; border-bottom:3px solid transparent; transition:all .2s;
}
.cn-nav a:hover, .cn-nav a.active { color:#fff; border-bottom-color:var(--rojo); }
.cn-nav-search { margin-left:auto; display:flex; align-items:center; gap:8px; }
.cn-nav-search input {
  background:var(--gris-medio); border:1px solid #444; color:#eee;
  padding:6px 14px; font-size:.8rem; border-radius:2px; width:160px; outline:none;
  font-family:'Source Sans 3',sans-serif;
}
.cn-nav-search input::placeholder { color:#666; }
.cn-nav-search button {
  background:var(--rojo); color:#fff; border:none; padding:6px 14px;
  font-size:.8rem; cursor:pointer; font-family:'Oswald',sans-serif; letter-spacing:.05em;
}

/* ================================================================
   PORTADA — FRONT PAGE
================================================================ */

/* Breaking */
.cn-breaking {
  background:var(--rojo); color:#fff; padding:10px 40px;
  font-family:'Oswald',sans-serif; font-size:.85rem; letter-spacing:.15em;
  display:flex; align-items:center; justify-content:center; gap:16px;
}
.cn-breaking .badge {
  background:#fff; color:var(--rojo); font-size:.68rem; font-weight:700;
  padding:3px 10px; animation:cnPulse 1.5s infinite;
}
@keyframes cnPulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* Contenedor */
.cn-contenedor { max-width:1300px; margin:0 auto; padding:32px 40px; }

/* Hero grid */
.cn-hero-grid {
  display:grid; grid-template-columns:2fr 1fr; grid-template-rows:auto auto;
  gap:1px; background:#ccc; border:1px solid #ccc; margin-bottom:36px;
}
.cn-card { background:#fff; overflow:hidden; transition:box-shadow .2s; }
.cn-card:hover { box-shadow:0 4px 20px rgba(0,0,0,.1); }
.cn-card-principal { grid-row:1/3; }
.cn-card .img-wrap { width:100%; overflow:hidden; }
.cn-card-principal .img-wrap { height:420px; }
.cn-card-lateral .img-wrap  { height:200px; }
.cn-card .img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.cn-card:hover .img-wrap img { transform:scale(1.04); }
.cn-card-principal .card-body { padding:28px; border-top:4px solid var(--rojo); }
.cn-card-lateral .card-body   { padding:18px 20px; border-top:3px solid var(--negro); }
.cn-card .tag { font-family:'Oswald',sans-serif; font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:var(--rojo); margin-bottom:8px; display:block; }
.cn-card h2   { font-family:'Playfair Display',serif; font-weight:700; line-height:1.2; color:var(--negro); margin-bottom:12px; }
.cn-card-principal h2 { font-size:2.3rem; }
.cn-card-lateral h2   { font-size:1.15rem; }
.cn-card p.resumen { font-size:.95rem; color:#555; line-height:1.65; margin-bottom:16px; }
.cn-card .meta { font-size:.75rem; color:#999; font-family:'Oswald',sans-serif; letter-spacing:.05em; }
.cn-card .meta strong { color:#555; }

/* Section header */
.cn-section-header { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.cn-section-header h3 { font-family:'Oswald',sans-serif; font-size:1rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--negro); }
.cn-section-header .line { flex:1; height:1px; background:#ccc; }
.cn-section-header .rojo-bar { width:40px; height:3px; background:var(--rojo); margin-right:-10px; }

/* Grid 3 */
.cn-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:36px; }
.cn-card-small { background:#fff; border-top:3px solid var(--negro); }
.cn-card-small .img-wrap { width:100%; height:170px; overflow:hidden; }
.cn-card-small .img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.cn-card-small:hover .img-wrap img { transform:scale(1.05); }
.cn-card-small .card-body { padding:16px; }
.cn-card-small .stag { font-family:'Oswald',sans-serif; font-size:.65rem; letter-spacing:.12em; color:var(--rojo); text-transform:uppercase; display:block; margin-bottom:6px; }
.cn-card-small h4 { font-family:'Playfair Display',serif; font-size:1.05rem; font-weight:700; line-height:1.3; color:var(--negro); margin-bottom:8px; }
.cn-card-small p  { font-size:.83rem; color:#666; line-height:1.55; }
.cn-card-small .meta { font-size:.72rem; color:#aaa; font-family:'Oswald',sans-serif; letter-spacing:.05em; margin-top:10px; }

/* Main + Sidebar layout */
.cn-main-sidebar { display:grid; grid-template-columns:1fr 300px; gap:36px; margin-bottom:36px; }

/* Lista noticias */
.cn-noticia-row { display:flex; gap:16px; padding:16px 0; border-bottom:1px solid #e5e5e0; align-items:flex-start; }
.cn-noticia-row .num { font-family:'Playfair Display',serif; font-size:2rem; font-weight:900; color:#e0e0da; line-height:1; min-width:36px; }
.cn-noticia-row .text .tag { display:block; font-family:'Oswald',sans-serif; font-size:.65rem; letter-spacing:.15em; color:var(--rojo); margin-bottom:4px; text-transform:uppercase; }
.cn-noticia-row h5 { font-family:'Playfair Display',serif; font-size:1rem; font-weight:700; color:var(--negro); line-height:1.3; margin-bottom:4px; }
.cn-noticia-row h5 a { color:inherit; }
.cn-noticia-row h5 a:hover { color:var(--rojo); }
.cn-noticia-row .meta { font-size:.72rem; color:#aaa; font-family:'Oswald',sans-serif; }
.cn-noticia-row .thumb { width:100px; height:70px; object-fit:cover; flex-shrink:0; }

/* Ad banner */
.cn-ad { background:linear-gradient(135deg,var(--negro),var(--gris-medio)); color:#fff; text-align:center; padding:28px; margin-bottom:36px; border:1px solid #333; }
.cn-ad .ad-label { font-family:'Oswald',sans-serif; font-size:.6rem; letter-spacing:.2em; color:#666; margin-bottom:8px; }
.cn-ad .ad-text  { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; }
.cn-ad .ad-sub   { font-size:.85rem; color:#aaa; margin-top:4px; }
.cn-ad .ad-btn   { display:inline-block; margin-top:14px; background:var(--rojo); color:#fff; padding:9px 26px; font-family:'Oswald',sans-serif; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; }

/* ================================================================
   SIDEBAR (compartido portada y post)
================================================================ */
.cn-sidebar { position:sticky; top:20px; }
.cn-sidebar .widget       { margin-bottom:28px; }
.cn-sidebar .widget-title { font-family:'Oswald',sans-serif; font-size:.8rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#fff; background:var(--negro); padding:10px 14px; }
.cn-sidebar .widget-body  { background:#fff; border:1px solid #e0e0db; border-top:none; padding:14px; }

/* Clima */
.cn-clima { text-align:center; padding:10px 0; }
.cn-clima .temp    { font-family:'Playfair Display',serif; font-size:3.2rem; font-weight:900; color:var(--negro); line-height:1; }
.cn-clima .ciudad  { font-family:'Oswald',sans-serif; font-size:.75rem; letter-spacing:.1em; color:#888; margin-top:4px; }
.cn-clima .condicion { font-size:.9rem; color:#555; margin-top:8px; }
.cn-clima .icon    { font-size:2.5rem; margin-bottom:6px; }
.cn-clima-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; font-size:.78rem; color:#666; }

/* Opinión */
.cn-opinion-item { display:flex; gap:12px; padding:12px 0; border-bottom:1px solid #eee; }
.cn-opinion-item:last-child { border-bottom:none; }
.cn-opinion-item .avatar { width:46px; height:46px; border-radius:50%; flex-shrink:0; background:#eee; display:flex; align-items:center; justify-content:center; font-size:1rem; overflow:hidden; }
.cn-opinion-item .avatar img { width:100%; height:100%; object-fit:cover; }
.cn-opinion-item .autor    { font-family:'Oswald',sans-serif; font-size:.8rem; font-weight:700; color:var(--negro); }
.cn-opinion-item .titulo-op { font-size:.82rem; color:#555; line-height:1.3; margin-top:2px; }
.cn-opinion-item .titulo-op a { color:inherit; }
.cn-opinion-item .titulo-op a:hover { color:var(--rojo); }

/* Widget noticias (sidebar post) */
.widget-noticia { display:flex; gap:12px; padding:10px 0; border-bottom:1px solid #f0f0ec; align-items:flex-start; }
.widget-noticia:last-child { border-bottom:none; }
.widget-noticia img { width:80px; height:55px; object-fit:cover; flex-shrink:0; }
.widget-noticia .wn-titulo { font-family:'Playfair Display',serif; font-size:.85rem; font-weight:700; color:var(--negro); line-height:1.3; display:block; }
.widget-noticia .wn-titulo:hover { color:var(--rojo); }
.widget-noticia .wn-meta  { font-family:'Oswald',sans-serif; font-size:.65rem; color:#aaa; letter-spacing:.05em; margin-top:4px; }

/* Newsletter */
.cn-newsletter p  { font-size:.83rem; color:#555; line-height:1.6; margin-bottom:12px; }
.cn-newsletter input  { width:100%; padding:9px; border:1px solid #ccc; font-size:.82rem; margin-bottom:8px; font-family:'Source Sans 3',sans-serif; outline:none; }
.cn-newsletter button { width:100%; background:var(--rojo); color:#fff; border:none; padding:10px; font-family:'Oswald',sans-serif; font-size:.85rem; letter-spacing:.1em; cursor:pointer; }

/* ================================================================
   POST INDIVIDUAL — single.php
================================================================ */
.articulo-wrapper {
  max-width:1300px; margin:40px auto; padding:0 40px;
  display:grid; grid-template-columns:1fr 320px; gap:48px; align-items:start;
}
.articulo { background:var(--blanco); padding:40px 48px 48px; border-top:4px solid var(--rojo); }

/* Breadcrumb */
.breadcrumb { font-family:'Oswald',sans-serif; font-size:.7rem; letter-spacing:.12em; color:#aaa; text-transform:uppercase; margin-bottom:20px; display:flex; align-items:center; gap:8px; }
.breadcrumb a { color:#aaa; }
.breadcrumb a:hover { color:var(--rojo); }
.breadcrumb .sep { color:#ccc; }
.breadcrumb .current { color:var(--rojo); }

/* Categoría */
.art-categoria { font-family:'Oswald',sans-serif; font-size:.75rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--rojo); margin-bottom:14px; display:block; }

/* Título */
.art-titulo { font-family:'Playfair Display',serif; font-size:2.6rem; font-weight:900; line-height:1.15; color:var(--negro); margin-bottom:16px; }

/* Bajada */
.art-bajada { font-size:1.15rem; font-weight:300; color:#555; line-height:1.6; border-left:4px solid var(--rojo); padding-left:16px; margin-bottom:24px; }

/* Meta */
.art-meta { display:flex; align-items:center; gap:20px; padding:14px 0; border-top:1px solid #eee; border-bottom:1px solid #eee; margin-bottom:28px; flex-wrap:wrap; }
.art-meta .autor-img { width:40px; height:40px; border-radius:50%; overflow:hidden; background:#ddd; flex-shrink:0; }
.art-meta .autor-img img { width:100%; height:100%; object-fit:cover; }
.art-meta .nombre { font-family:'Oswald',sans-serif; font-size:.82rem; font-weight:700; color:var(--negro); display:block; }
.art-meta .cargo  { font-size:.72rem; color:#aaa; display:block; }
.art-meta .datos  { font-family:'Oswald',sans-serif; font-size:.72rem; color:#999; letter-spacing:.05em; margin-left:auto; text-align:right; line-height:1.8; }

/* Compartir */
.art-share { display:flex; align-items:center; gap:10px; margin-bottom:28px; flex-wrap:wrap; }
.art-share span { font-family:'Oswald',sans-serif; font-size:.7rem; letter-spacing:.15em; text-transform:uppercase; color:#aaa; }
.share-btn { padding:6px 16px; font-family:'Oswald',sans-serif; font-size:.72rem; letter-spacing:.08em; border:none; cursor:pointer; color:#fff; display:inline-block; transition:opacity .2s; }
.share-btn:hover { opacity:.85; }
.share-btn.tw   { background:#1a1a1a; }
.share-btn.fb   { background:#1877f2; }
.share-btn.wa   { background:#25d366; }
.share-btn.copy { background:#888; }

/* Imagen destacada */
.art-imagen-wrap { width:100%; margin-bottom:10px; max-height:480px; overflow:hidden; }
.art-imagen-wrap img { width:100%; height:100%; object-fit:cover; }
.art-imagen-caption { font-size:.75rem; color:#aaa; font-style:italic; margin-bottom:28px; text-align:center; }

/* Contenido del artículo */
.art-contenido { font-size:1.05rem; line-height:1.85; color:#2a2a2a; }
.art-contenido p  { margin-bottom:1.4em; }
.art-contenido h2 { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:var(--negro); margin:2em 0 .8em; border-bottom:2px solid var(--rojo); padding-bottom:6px; }
.art-contenido h3 { font-family:'Playfair Display',serif; font-size:1.2rem; font-weight:700; color:var(--negro); margin:1.8em 0 .7em; }
.art-contenido blockquote { border-left:4px solid var(--dorado); padding:16px 24px; margin:2em 0; background:#fffdf5; font-family:'Playfair Display',serif; font-size:1.15rem; font-style:italic; color:#555; }
.art-contenido img { max-width:100%; height:auto; margin:1em 0; }
.art-contenido a   { color:var(--rojo); text-decoration:underline; }
.art-contenido ul,
.art-contenido ol  { padding-left:28px; margin-bottom:1.4em; }
.art-contenido li  { margin-bottom:.5em; }
.art-contenido strong { color:var(--negro); font-weight:700; }

/* Tags */
.art-tags { margin-top:32px; padding-top:20px; border-top:1px solid #eee; }
.art-tags .label { font-family:'Oswald',sans-serif; font-size:.7rem; letter-spacing:.12em; color:#aaa; text-transform:uppercase; }
.art-tags a { display:inline-block; margin:4px; padding:4px 12px; border:1px solid #ccc; font-size:.78rem; color:#555; transition:all .2s; font-family:'Oswald',sans-serif; letter-spacing:.05em; }
.art-tags a:hover { background:var(--rojo); color:#fff; border-color:var(--rojo); }

/* Nav prev/next */
.art-nav { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#eee; margin-top:32px; border-top:3px solid var(--negro); }
.art-nav .nav-item { background:#fff; padding:18px 20px; display:block; transition:background .2s; }
.art-nav .nav-item:hover { background:#fafaf8; }
.art-nav .nav-item .label { font-family:'Oswald',sans-serif; font-size:.65rem; letter-spacing:.15em; text-transform:uppercase; color:#aaa; margin-bottom:6px; display:block; }
.art-nav .nav-titulo { font-family:'Playfair Display',serif; font-size:.95rem; font-weight:700; color:var(--negro); line-height:1.3; }
.art-nav .nav-next { text-align:right; }

/* ================================================================
   FOOTER (compartido)
================================================================ */
.cn-footer { background:var(--negro); color:#aaa; padding:40px 40px 20px; }
.cn-footer-grid { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:36px; padding-bottom:32px; border-bottom:1px solid #333; }
.cn-footer-grid .col h4 { font-family:'Oswald',sans-serif; font-size:.78rem; letter-spacing:.15em; text-transform:uppercase; color:#fff; margin-bottom:14px; padding-bottom:8px; border-bottom:2px solid var(--rojo); display:inline-block; }
.cn-footer-grid .col p  { font-size:.82rem; line-height:1.7; color:#777; }
.cn-footer-grid .col ul { list-style:none; }
.cn-footer-grid .col ul li { font-size:.82rem; padding:5px 0; border-bottom:1px solid #222; }
.cn-footer-grid .col ul li a { color:#888; transition:color .2s; }
.cn-footer-grid .col ul li a:hover { color:var(--dorado); }
.cn-footer-logo { font-family:'Playfair Display',serif; font-size:2rem; font-weight:900; color:#fff; margin-bottom:12px; }
.cn-footer-bottom { max-width:1300px; margin:18px auto 0; display:flex; justify-content:space-between; font-size:.72rem; color:#555; font-family:'Oswald',sans-serif; letter-spacing:.05em; }

hr.cn-deco { border:none; border-top:1px solid #ccc; margin:32px 0; }

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width:1100px) {
  .cn-contenedor, .articulo-wrapper { padding-left:24px; padding-right:24px; }
  .cn-footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:800px) {
  .cn-hero-grid, .cn-main-sidebar, .articulo-wrapper { grid-template-columns:1fr; }
  .cn-card-principal { grid-row:auto; }
  .cn-grid-3 { grid-template-columns:1fr 1fr; }
  .art-titulo { font-size:1.8rem; }
  .articulo { padding:24px; }
  .cn-sidebar { position:static; }
  .cn-header-main, .cn-nav-inner, .cn-top-bar { padding-left:16px; padding-right:16px; }
  .cn-logo .titulo { font-size:2.4rem; }
}
@media (max-width:500px) {
  .cn-grid-3 { grid-template-columns:1fr; }
  .cn-footer-grid { grid-template-columns:1fr; }
  .art-nav { grid-template-columns:1fr; }
}
