/* =============================================================================
   TEMA VISUAL v2 — 26/09/2026 — SOLO ESTÉTICA
   Se carga DESPUÉS de style.css y únicamente si THEME_V2 = true (config.php).
   Todo cuelga de body.iv2, así que poner THEME_V2 a false devuelve el diseño
   anterior sin tocar nada más. Contenido, menús, rutas y datos no cambian.
   Rojo corporativo #d10014 (medido en infosvalencia.com), antracita #1f2024,
   amarillo del logo #fac10b. Tipografías alojadas aquí (sin Google Fonts).
============================================================================= */

@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/atkinson-hyperlegible-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/atkinson-hyperlegible-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/bricolage-grotesque-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/bricolage-grotesque-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---- Variables ---- */
body.iv2 {
  --color-brand: #d10014;
  --color-brand-dark: #a80010;
  --color-brand-gold: #fac10b;
  --color-brand-gold-dark: #c99500;
  --color-text: #1a1a1a;
  --color-text-muted: #4b4b4b;
  --color-bg: #ffffff;
  --color-bg-alt: #f6f4f2;
  --color-border: #e4e0dc;
  --shadow-brand: 0 10px 24px -8px rgba(209, 0, 20, 0.35);
  --shadow-brand-soft: 0 6px 16px -6px rgba(209, 0, 20, 0.22);
  --font-sans: 'Atkinson Hyperlegible', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --iv-head: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --iv-link: #d10014;       /* rojo para TEXTO (en noche se aclara para cumplir contraste) */
  --iv-tint: #fdecee;
  --iv-card: #ffffff;
  --iv-panel: #d10014;
  --iv-anth: #1f2024;
}
:root[data-theme="dark"] body.iv2 {
  --color-text: #eaeaea;
  --color-text-muted: #a8a8a8;
  --color-bg: #14141a;
  --color-bg-alt: #1c1c24;
  --color-border: #33333c;
  --iv-link: #ff5a68;
  --iv-tint: #2a1519;
  --iv-card: #1c1c24;
  --iv-panel: #8f0010;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.iv2 {
    --color-text: #eaeaea;
    --color-text-muted: #a8a8a8;
    --color-bg: #14141a;
    --color-bg-alt: #1c1c24;
    --color-border: #33333c;
    --iv-link: #ff5a68;
    --iv-tint: #2a1519;
    --iv-card: #1c1c24;
    --iv-panel: #8f0010;
  }
}

/* ---- Base ---- */
body.iv2 { font-size: 18px; line-height: 1.6; }
body.iv2 a { color: var(--iv-link); }
body.iv2 h1, body.iv2 h2, body.iv2 h3 { font-family: var(--iv-head); font-weight: 800; letter-spacing: -0.015em; text-wrap: balance; }
body.iv2 :focus-visible { outline: 3px solid var(--color-brand-gold); outline-offset: 2px; border-radius: 6px; }
body.iv2 .skip-link { background: var(--color-brand); }
body.iv2 .ico { display: block; flex: none; }
body.iv2 .ico .d { fill: currentColor; fill-opacity: .22; }
@media (min-width: 800px) { body.iv2 { font-size: 19px; } }

/* ---- Cabecera: logo SIN fondo, controles grandes, filo rojo ---- */
body.iv2 .site-header { border-bottom: 3px solid var(--color-brand); box-shadow: none; background: var(--color-bg); }
body.iv2 .site-header-top { padding: 0.5em 1em; gap: 0.6em 1em; }
body.iv2 .site-header .site-logo img { height: 52px; }
body.iv2 .lang-switch {
  display: inline-flex; background: var(--color-bg-alt); border: 1px solid var(--color-border);
  border-radius: 12px; padding: 2px; margin-left: 0;
}
body.iv2 .lang-switch a {
  margin: 0; min-width: 42px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 9px; font: 700 15px var(--font-sans); color: var(--color-text-muted);
}
body.iv2 .lang-switch a:hover { text-decoration: none; color: var(--color-text); }
body.iv2 .lang-switch a[aria-current="page"] { background: var(--color-brand); color: #fff; }
body.iv2 .theme-toggle, body.iv2 .nav-toggle {
  width: 46px; height: 46px; margin: 0; border: 0; border-radius: 12px; background: transparent; color: var(--color-text);
  align-items: center; justify-content: center;
}
body.iv2 .theme-toggle { display: inline-flex; }
body.iv2 .theme-toggle:hover, body.iv2 .nav-toggle:hover { background: var(--color-bg-alt); color: var(--color-text); }
@media (max-width: 900px) { body.iv2 .nav-toggle { display: inline-flex; } }
body.iv2 .site-search input[type="search"] { min-height: 46px; border-radius: 12px 0 0 12px; border-color: var(--color-border); background: var(--color-bg); color: var(--color-text); font-size: 16px; padding: 0 0.9em; }
body.iv2 .site-search button { min-width: 50px; background: var(--color-brand); border-color: var(--color-brand); color: #fff; border-radius: 0 12px 12px 0; }
body.iv2 .site-search button:hover { background: var(--color-brand-dark); color: #fff; }

/* Menú principal (escritorio): mismas categorías y desplegables, otro aire */
body.iv2 .main-nav { border-top: 1px solid var(--color-border); }
body.iv2 .main-nav > ul > li > a, body.iv2 .main-nav > ul > li > span { font-size: 15px; font-weight: 700; padding: 0.5em 0.6em; min-height: 46px; border-radius: 10px; white-space: nowrap; }
body.iv2 .main-nav > ul > li > a:hover { color: var(--iv-link); background: var(--iv-tint); text-decoration: none; }
@media (min-width: 901px) { body.iv2 .main-nav .submenu { border-top: 3px solid var(--color-brand); border-radius: 0 0 12px 12px; box-shadow: 0 16px 32px rgba(0, 0, 0, 0.18); background: var(--color-bg); } }

/* Menos separación entre el título de la categoría y su flecha, SOLO en
   escritorio (pedido 29/09/2026): en escritorio el submenú se abre con el
   ratón encima (hover), no hace falta tocar la flecha para desplegarlo, así
   que puede ser más compacta sin perder utilidad — y así el menú entero
   cabe en una sola línea. En el cajón de móvil la flecha SIGUE siendo el
   único disparador del desplegable (no hay hover en touch) y necesita
   seguir siendo un objetivo de toque amplio: por eso esto vive dentro de
   min-width:901px y la regla de abajo (@media max-width:900px, más abajo
   en este mismo archivo) no se toca. */
@media (min-width: 901px) {
  /* El alemán tiene etiquetas más largas ("Nachrichten und Gesellschaft",
     "Traditionen und Kuriositäten"...) y con solo la flecha más pegada
     seguía partiéndose en dos líneas (medido: 1290px en un hueco de
     1200px) — se aprieta un poco más el espaciado general de cada
     categoría, en los dos idiomas, para que quepan ambos. */
  body.iv2 .main-nav > ul { gap: 0; }
  body.iv2 .main-nav > ul > li > a, body.iv2 .main-nav > ul > li > span { font-size: 14px; padding-left: 0.35em; padding-right: 0.35em; }
  body.iv2 .main-nav > ul > li.has-children > a { padding-right: 0.15em; }
  body.iv2 .nav-chevron-btn { padding: 0 0.2em; min-width: 0; }
}
body.iv2 .main-nav .submenu a { font-size: 16px; font-weight: 400; min-height: 44px; display: flex; align-items: center; }
body.iv2 .main-nav .submenu a:hover { background: var(--iv-tint); color: var(--iv-link); }

/* Cabecera en móvil (pedido 29/09): logo centrado en su propia fila y debajo
   ES/DE + día-noche + hamburguesa centrados en otra fila. El buscador (cuando
   se ve) va en una tercera fila a todo el ancho. El mismo truco que ya usaba
   el diseño original: el logo con flex-basis:100% fuerza el salto de línea y,
   como el contenedor está centrado, los controles que vienen detrás quedan
   agrupados y centrados en la fila siguiente.
   Tamaño del logo (pedido 29/09, 2ª vuelta): en vez de una altura fija, el
   ANCHO del logo se iguala al ancho real de esa fila de controles (medido en
   vivo: 200px a ≤640px, 181px a ≤360px), así que crece hasta juntar sus dos
   bordes con los de los botones de debajo; el alto se ajusta solo porque el
   SVG mantiene su proporción (se quita la altura fija de la regla base).
   SOLO afecta a móvil (≤640px); tablet/escritorio se quedan como están. */
@media (max-width: 640px) {
  body.iv2 .site-header-top { justify-content: center; row-gap: 0.5em; column-gap: 0.5em; padding: 0.5em 0.75em 0.6em; }
  body.iv2 .site-logo { order: 1; flex-basis: 100%; flex: 1 1 100%; display: flex; justify-content: center; margin: 0; }
  body.iv2 .site-header .site-logo img { width: 200px; height: auto; }
  body.iv2 .lang-switch { order: 2; margin: 0; }
  body.iv2 .theme-toggle { order: 3; margin: 0; }
  body.iv2 .nav-toggle { order: 4; }
  body.iv2 .site-search { order: 5; flex-basis: 100%; max-width: 100%; margin: 0; }
}
@media (max-width: 360px) {
  body.iv2 .site-header .site-logo img { width: 181px; height: auto; }
  body.iv2 .lang-switch a { min-width: 36px; }
  body.iv2 .theme-toggle, body.iv2 .nav-toggle { width: 42px; }
}

@media (max-width: 900px) { body.iv2:has(.iv-home) .site-search { display: none; } }

/* Panel lateral del menú (móvil): filas grandes y cómodas para el pulgar */
@media (max-width: 900px) {
  body.iv2 .main-nav { border-top: 0; padding-top: 3.6rem; background: var(--color-bg); }
  body.iv2 .main-nav > ul > li > a, body.iv2 .main-nav > ul > li > span { font-size: 19px; min-height: 56px; padding: 0.5em 0.3em; border-radius: 0; }
  body.iv2 .main-nav .submenu a { font-size: 17px; min-height: 48px; }
  body.iv2 .nav-close { width: 48px; height: 48px; border-radius: 12px; }
}

/* ---- Títulos de sección, píldoras de categoría ---- */
body.iv2 main#contenido { padding-top: 1.2em; }
body.iv2 h1 { font-family: var(--iv-head); font-weight: 800; }
body.iv2 .section-title, body.iv2 .iv-h2 {
  font-family: var(--iv-head); font-size: 26px; line-height: 1.1; border: 0; padding: 0; margin: 1.6em 0 0.7em;
  display: flex; align-items: center; gap: 0.5em; letter-spacing: -0.015em;
}
body.iv2 .section-title::before { width: 6px; height: 1.05em; background: var(--color-brand); border-radius: 3px; }
body.iv2 .post-cat, body.iv2 .post-cat-list .post-cat {
  background: var(--color-brand); color: #fff; box-shadow: none; border-radius: 99px; padding: 0.35em 0.85em;
  font: 800 12px/1.2 var(--iv-head); letter-spacing: 0.08em;
}
body.iv2 a.post-cat:hover { opacity: 1; background: var(--color-brand-dark); }
body.iv2 .geo-pill { min-height: 44px; display: inline-flex; align-items: center; padding: 0 1.2em; font: 800 16px var(--iv-head); }
body.iv2 .geo-pill:hover { color: var(--iv-link); border-color: var(--color-brand); }
body.iv2 .geo-pill.is-active { background: var(--color-brand); border-color: var(--color-brand); color: #fff; }

/* ---- Portada: panel rojo con accesos rápidos ---- */
body.iv2 main#contenido.iv-home { max-width: none; padding: 0 0 3em; }
.iv-wrap { max-width: var(--max-width, 1200px); margin: 0 auto; padding: 0 1em; }
.iv-panel { background: var(--iv-panel); color: #fff; padding: 10px 0 26px; }
.iv-panel h1.iv-tag { font: 700 13px/1.3 var(--font-sans); letter-spacing: 0.12em; text-transform: uppercase; margin: 12px 0 8px; color: #fff; }
.iv-panel .iv-ask { font: 800 clamp(30px, 8.4vw, 52px)/1.08 var(--iv-head); margin: 0 0 16px; color: #fff; }
.iv-search { display: flex; background: #fff; border-radius: 14px; overflow: hidden; }
.iv-search input { all: unset; box-sizing: border-box; flex: 1; min-width: 0; padding: 0 16px; min-height: 56px; font: 400 18px var(--font-sans); color: #1a1a1a; }
.iv-search input::placeholder { color: #5a5a5a; }
.iv-search button { all: unset; cursor: pointer; min-width: 60px; background: var(--color-brand-gold); color: #1a1a1a; display: flex; align-items: center; justify-content: center; }
.iv-search button:focus-visible { outline: 3px solid #fff; outline-offset: -3px; }
.iv-tiles { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 16px; }
.iv-tile {
  display: flex; align-items: center; gap: 14px; min-height: 76px; padding: 12px 14px; border-radius: 16px;
  background: var(--iv-card); color: var(--color-text); box-shadow: 0 2px 0 rgba(0, 0, 0, 0.18); text-decoration: none; min-width: 0;
}
.iv-tile:hover { text-decoration: none; box-shadow: 0 0 0 3px var(--color-brand-gold); }
.iv-tile:active { transform: scale(.985); }
.iv-tile-ic { width: 54px; height: 54px; border-radius: 16px; background: var(--color-brand); color: #fff; display: flex; align-items: center; justify-content: center; flex: none; }
.iv-tile-ic .ico .d { fill-opacity: .32; }
body.iv2 .iv-tile-t { min-width: 0; overflow-wrap: anywhere; }
.iv-tile-t b { display: block; font: 800 19px/1.15 var(--iv-head); color: var(--color-text); }
.iv-tile-t small { display: block; font-size: 14px; margin-top: 2px; color: var(--color-text-muted); }
@media (min-width: 560px) { .iv-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .iv-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---- Listas con miniatura (Lo más leído, carrusel, ...) ---- */
.iv-body { padding-top: 0; }
.iv-cols { display: grid; gap: 0 40px; grid-template-columns: minmax(0, 1fr); }
.iv-col { min-width: 0; display: flex; flex-direction: column; }
.iv-rows { list-style: none; margin: 0; padding: 0; }
.iv-row { position: relative; display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--color-border); align-items: center; }
.iv-row-th { position: relative; display: block; width: 96px; height: 96px; border-radius: 14px; overflow: hidden; background: var(--color-bg-alt); }
.iv-row-th img { width: 100%; height: 100%; object-fit: cover; }
body.iv2 .iv-rank { position: absolute; left: 0; top: 0; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; background: var(--color-brand); color: #fff; font: 800 16px var(--iv-head); border-radius: 14px 0 12px 0; }
.iv-row-b { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.iv-row-cat { position: relative; z-index: 2; font: 700 12px var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--iv-link); }
body.iv2 .iv-row h3 { font-size: 19px; line-height: 1.2; margin: 0; }
body.iv2 .iv-row h3 a { color: var(--color-text); text-decoration: none; }
body.iv2 .iv-row h3 a::after { content: ""; position: absolute; inset: 0; }
.iv-row:hover h3 a { text-decoration: underline; text-decoration-thickness: 3px; text-decoration-color: var(--color-brand); text-underline-offset: 3px; }
.iv-row time { font-size: 14px; color: var(--color-text-muted); }
@media (min-width: 800px) {
  .iv-row { grid-template-columns: 120px minmax(0, 1fr); }
  .iv-row-th { width: 120px; height: 100px; }
}
@media (min-width: 1024px) {
  .iv-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
  .iv-col .iv-car { flex: 1; min-height: 420px; }
}

/* Carrusel (solo escritorio; el JS pone .is-carousel) */
@media (min-width: 1024px) {
  .iv-car.is-carousel { position: relative; overflow: hidden; border-radius: 20px; background: var(--iv-anth); }
  .iv-car.is-carousel .iv-track { display: flex; height: 100%; transition: transform 0.45s ease; transform: translateX(calc(var(--i, 0) * -100%)); }
  .iv-car.is-carousel .iv-track > li { flex: 0 0 100%; min-width: 0; height: 100%; }
  .iv-car.is-carousel .iv-row { display: block; position: relative; height: 100%; padding: 0; border: 0; color: #fff; }
  .iv-car.is-carousel .iv-row-th { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; background: var(--iv-anth); }
  .iv-car.is-carousel .iv-row-b { position: absolute; inset: auto 0 0 0; padding: 90px 84px 56px; gap: 8px; background: linear-gradient(to top, rgba(20, 20, 24, 0.95), rgba(20, 20, 24, 0)); }
  .iv-car.is-carousel .iv-row-cat { color: var(--color-brand-gold); }
  .iv-car.is-carousel .iv-row h3 { font-size: clamp(24px, 2.4vw, 32px); }
  .iv-car.is-carousel .iv-row h3 a { color: #fff; }
  .iv-car.is-carousel .iv-row time { color: #dcdde1; }
  .iv-car.is-carousel .iv-row:hover h3 a { text-decoration-color: var(--color-brand-gold); }
  .iv-car-btn { position: absolute; top: 50%; margin-top: -26px; width: 52px; height: 52px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, 0.95); color: #1a1a1a; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3); z-index: 3; padding: 0; }
  .iv-car-btn:hover { background: #fff; color: var(--color-brand); }
  .iv-flip { display: flex; transform: scaleX(-1); }
  .iv-prev { left: 14px; }
  .iv-next { right: 14px; }
  .iv-dots { position: absolute; left: 0; right: 0; bottom: 14px; display: flex; justify-content: center; gap: 2px; z-index: 3; }
  .iv-dot { all: unset; cursor: pointer; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; }
  .iv-dot::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.55); transition: width 0.2s; }
  .iv-dot[aria-current="true"]::after { background: var(--color-brand-gold); width: 26px; border-radius: 6px; }
  .iv-dot:focus-visible, .iv-car-btn:focus-visible { outline: 3px solid var(--color-brand-gold); }
}
@media (prefers-reduced-motion: reduce) { .iv-car.is-carousel .iv-track, .iv-dot::after { transition: none; } }

/* ---- Widget de pestañas (Agenda / Recomendados) ---- */
body.iv2 .home-widget { border-radius: 16px; border-color: var(--color-border); margin: 2.2em 0; }
body.iv2 .hw-tabs { background: var(--color-bg-alt); }
body.iv2 .hw-tab { min-height: 52px; font: 800 16px var(--iv-head); }
body.iv2 .hw-tab:hover { color: var(--iv-link); }
body.iv2 .hw-tab.is-active { color: var(--iv-link); border-bottom-color: var(--color-brand); }
body.iv2 .hw-item h3 { font-size: 18px; }
body.iv2 .hw-item h3 a:hover { color: var(--iv-link); }
body.iv2 .hw-item-img img { border-radius: 12px; }

/* ---- Tarjetas de artículos (portada "Más artículos", categorías, buscador) ----
   Mismo marcado de siempre; se presentan como filas con miniatura (más rápidas
   de leer en móvil) y dos columnas en pantallas anchas. */
body.iv2 .post-grid { grid-template-columns: 1fr; gap: 0 40px; }
body.iv2 .post-grid .post-card {
  position: relative; flex-direction: row; align-items: center; gap: 14px; padding: 14px 0; border: 0; border-bottom: 1px solid var(--color-border);
  border-radius: 0; background: transparent; box-shadow: none; overflow: visible;
}
body.iv2 .post-grid .post-card:hover { transform: none; box-shadow: none; border-color: var(--color-border); }
body.iv2 .post-grid .post-card-img { flex: 0 0 96px; width: 96px; height: 96px; border-radius: 14px; overflow: hidden; background: var(--color-bg-alt); align-self: flex-start; }
body.iv2 .post-grid .post-card-img img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
body.iv2 .post-grid .post-card:hover .post-card-img img { transform: none; }
body.iv2 .post-grid .post-card-body { padding: 0; flex: 1; min-width: 0; align-items: flex-start; gap: 4px; }
body.iv2 .post-grid .post-card-body .post-cat { position: relative; z-index: 2; margin: 0; }
body.iv2 .post-grid .post-card-body h2, body.iv2 .post-grid .post-card-body h3 { font-size: 19px; line-height: 1.2; margin: 0; }
body.iv2 .post-grid .post-card-body h2 a::after, body.iv2 .post-grid .post-card-body h3 a::after { content: ""; position: absolute; inset: 0; }
body.iv2 .post-grid .post-card:hover h2 a, body.iv2 .post-grid .post-card:hover h3 a { text-decoration: underline; text-decoration-thickness: 3px; text-decoration-color: var(--color-brand); text-underline-offset: 3px; }
body.iv2 .post-grid .post-card-body p { display: none; }
body.iv2 .post-grid .post-card-body time { font-size: 14px; }
@media (min-width: 700px) {
  body.iv2 .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.iv2 .post-grid .post-card-img { flex-basis: 120px; width: 120px; height: 100px; }
  body.iv2 .post-grid .post-card-body p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 15px; margin: 0; flex: none; }
}
/* Sin huecos: con un número impar de tarjetas, la última ocupa las dos columnas */
@media (min-width: 700px) { body.iv2 .post-grid > .post-card:last-child:nth-child(odd) { grid-column: 1 / -1; } }

/* Cargar más */
body.iv2 .btn-load-more { border-radius: 14px; min-height: 56px; display: inline-flex; align-items: center; justify-content: center; font: 800 18px var(--iv-head); padding: 0 2.4em; }
body.iv2 .btn-load-more:hover { background: var(--color-brand-dark); border-color: var(--color-brand-dark); }
body.iv2 .breadcrumbs { font-size: 15px; }
body.iv2 .breadcrumbs a:hover { color: var(--iv-link); }

/* ---- Artículo ---- */
body.iv2 .single-post h1 { font-size: clamp(30px, 7.8vw, 48px); line-height: 1.08; margin: 0.35em 0 0.35em; }
body.iv2 .post-meta { font-size: 15px; }
body.iv2 .post-featured-img img { border-radius: 16px; box-shadow: none; }
body.iv2 .post-content { font-size: 19px; line-height: 1.7; }
body.iv2 .post-content h2 { font-size: 28px; line-height: 1.12; margin-top: 1.5em; }
body.iv2 .post-content h3 { font-size: 22px; line-height: 1.15; }
body.iv2 .post-content a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
body.iv2 .post-content summary::before { color: var(--iv-link); }
body.iv2 .post-content .dia-programa > summary::before, body.iv2 .post-content .dia-programa > summary:hover { color: var(--iv-link); }

/* Compartir: botones de 48px, el mismo comportamiento que ya tenía */
body.iv2 .post-share { border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); padding: 1em 0; margin-top: 1.8em; }
body.iv2 .post-share-label { font: 800 16px var(--iv-head); color: var(--color-text); }
body.iv2 .post-share-icon { width: 48px; height: 48px; background: var(--color-bg-alt); }
body.iv2 .post-share-btn { width: 52px; height: 52px; background: var(--color-brand); border-color: var(--color-brand); color: #fff; }
body.iv2 .post-share-btn:hover { background: var(--color-brand-dark); border-color: var(--color-brand-dark); }
body.iv2 .back-link a { min-height: 48px; }
body.iv2 .back-link a:hover { color: #fff; }

/* Barra lateral (tiempo + publicidad): mismo formato y espaciado que el clon */
body.iv2 .sidebar-widget { border-radius: 16px; background: var(--iv-card); }
body.iv2 .sidebar-widget h2 { font: 800 15px var(--iv-head); color: var(--iv-link); border-bottom-color: var(--color-brand-gold); }
body.iv2 #weather-widget { border-top: 4px solid var(--color-brand); }
body.iv2 .weather-icon { color: var(--iv-link); line-height: 0; }
body.iv2 .weather-icon .d { fill: currentColor; fill-opacity: .22; }
body.iv2 .weather-temp { color: var(--iv-link); font-family: var(--iv-head); font-weight: 800; }
body.iv2 .sidebar-banner-link { border-radius: 10px; }

/* Relacionados: mismas tarjetas verticales de siempre, con el nuevo aire */
body.iv2 .post-related .post-card { border-radius: 16px; }
body.iv2 .post-related .post-card:hover { border-color: var(--color-brand); }

/* ---- Pie: antracita corporativo, siempre oscuro ---- */
body.iv2 .site-footer { background: var(--iv-anth); color: #dcdde1; border-top: 4px solid var(--color-brand); margin-top: 2.5em; font-size: 17px; }
body.iv2 .site-footer-widgets { padding-top: 2.4em; }
body.iv2 .footer-col h2 { font: 800 19px var(--iv-head); text-transform: none; letter-spacing: 0; color: #fff; }
body.iv2 .footer-col p { color: #c4c6cc; font-size: 16px; }
body.iv2 .footer-legal-menu li { margin: 0; }
body.iv2 .footer-legal-menu a, body.iv2 .footer-link-button { color: #dcdde1; display: flex; align-items: center; min-height: 44px; font-size: 17px; }
body.iv2 .footer-legal-menu a:hover, body.iv2 .footer-link-button:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--color-brand); text-decoration-thickness: 2px; }
body.iv2 .footer-col-partner a { display: inline-block; background: #fff; border-radius: 10px; padding: 4px; }
body.iv2 .footer-category-finder { max-width: 320px; }
body.iv2 .footer-category-finder label { color: #fff; font-weight: 700; font-size: 16px; text-align: left; }
body.iv2 .footer-category-finder-row select { min-height: 52px; border-radius: 12px; border-color: #4a4b52; background: #2a2b31; color: #fff; font-size: 17px; }
body.iv2 .footer-category-finder-row select option, body.iv2 .footer-category-finder-row select optgroup { background: #2a2b31; color: #fff; }
body.iv2 .site-footer-bottom { border-top-color: #3a3b42; padding: 1.4em 1em 1.8em; }
body.iv2 .site-footer-copyright-inline { color: #a9abb2; }
/* El pie de iv2 es SIEMPRE oscuro (antracita), da igual el modo día/noche de
   la página — por eso aquí se fija el gris a mano en vez de var(--color-text-
   muted), que en modo claro sería un gris oscuro invisible sobre ese fondo. */
body.iv2 .site-footer-credit { color: #a9abb2; }
body.iv2 .site-footer-credit a { color: #dcdde1; }
body.iv2 .site-footer-credit a:hover { color: #fff; }
body.iv2 .site-footer .site-logo img { height: 48px; opacity: 1; }
body.iv2 .site-footer-bottom .site-logo img { height: 48px; opacity: 1; }
body.iv2 .social-links a { width: 48px; height: 48px; background: #2a2b31; border-color: #2a2b31; color: #fff; }
body.iv2 .social-links a:hover { background: var(--color-brand); border-color: var(--color-brand); }
/* Deja libre la esquina donde vive el botón "Volver arriba": nunca tapa las redes */
@media (min-width: 761px) { body.iv2 .site-footer-bottom { padding-right: 84px; } }
@media (max-width: 760px) { body.iv2 .site-footer-bottom { padding-bottom: 5.4em; } }

/* ---- Volver arriba: siempre disponible, sin ocultarse al llegar al pie ---- */
/* bottom con env(safe-area-inset-bottom): en iPhones con indicador de inicio,
   que el botón no quede pegado al borde ni debajo del área táctil del gesto. */
body.iv2 .back-to-top { width: 52px; height: 52px; right: 14px; bottom: calc(16px + env(safe-area-inset-bottom)); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3); }
body.iv2 .back-to-top.is-visible.is-near-footer { opacity: 1; transform: none; pointer-events: auto; }
body.iv2 .back-to-top:hover { background: var(--color-brand-dark); }
@media (min-width: 800px) { body.iv2 .back-to-top { right: 24px; bottom: calc(24px + env(safe-area-inset-bottom)); } }

/* ---- Aviso de cookies ---- */
body.iv2 .cookie-banner { border-radius: 14px; border-left-width: 5px; }
body.iv2 .btn-cookie { min-height: 46px; font-weight: 700; border-radius: 10px; }
body.iv2 .cookie-banner p a { color: var(--iv-link); }
body.iv2 .btn-cookie-secondary:hover { border-color: var(--color-brand); }

/* ---- Cabeceras del artículo / página con más aire y contraste ---- */
body.iv2 .single-page h1 { font-size: clamp(30px, 7.8vw, 44px); }
body.iv2 .archivo-resumen { color: var(--color-text-muted); }

/* Pie en móvil: logo centrado bajo las redes */
@media (max-width: 760px) { body.iv2 .site-footer-bottom .site-logo { margin: 0 auto; justify-content: center; display: flex; } }
