/* 
Theme Name: Estonoesnormal (CSS definitivo)
Description: Estilos unificados ENN: Home, Single, Relacionados, Offcanvas y Páginas estáticas.
Author: ENN Studio
Version: 0.3.2

✅ CAMBIOS 0.3.2 (LO QUE ME HAS PEDIDO):
- FOOTER: sin estilos inline, layout limpio + responsive
- BADGES: SIN fondo (transparente) y con TEXTO + BORDE del color asignado
  (mantengo la paleta original que ya estabas usando)
- Mantengo el resto de tu estructura/variables para que sea “copiar y pegar”
*/

/* ============================================================
   [Bloque 1] VARIABLES DE MARCA
   ============================================================ */
:root{
  /* Paleta */
  --negro-puro:#000000;
  --negro-carbon:#1A1A1A;
  --blanco-roto:#F8F5F0;
  --rojo-alerta:#FF0000;
  --amarillo-senal:#FFFF00;
  --amarillo-marca:#FFE121;
  --amarillo-normal:#f7d547;

  /* Capas */
  --enn-brand:var(--negro-puro);
  --enn-bg:#111111;
  --enn-panel:var(--negro-carbon);

  /* Texto */
  --enn-text:var(--blanco-roto);
  --enn-muted:#BEBEBE;

  /* Separadores */
  --enn-card-border-alpha:0.08;
  --enn-divider-alpha:0.10;

  /* UI */
  --enn-radius:12px;
  --enn-radius-lg:18px;
  --enn-shadow:0 10px 26px rgba(0,0,0,.35);

  /* HOME — spacing */
  --enn-home-gap:22px;

  /* FEED — ritmo vertical */
  --enn-feed-item-pad-y:16px;

  /* FEED — interacción */
  --enn-feed-hover-lift:2px;
  --enn-feed-hover-bg-alpha:0.035;
  --enn-feed-hover-border-alpha:0.16;
  --enn-feed-img-zoom:1.02;

  /* FEED — columna texto */
  --enn-textcol-bg-alpha:0.028;
  --enn-textcol-bg-alpha-hover:0.060;
  --enn-textcol-pad:9px;
  --enn-textcol-sep-alpha:0.045;

  /* BADGES */
  --enn-badge-border-alpha:0.85; /* ✅ MARCADOR: contorno más visible */
  --enn-badge-font:12px;

  /* ==========================================================
     SINGLE (LECTURA LARGA)
     ========================================================== */
  --enn-single-max: 820px;   /* 760–880 */
  --enn-single-font: 18px;   /* 17–19 */
  --enn-single-line: 1.75;   /* 1.65–1.85 */
  --enn-single-gap: 22px;

  /* ==========================================================
     PÁGINAS ESTÁTICAS (Qué es / Contacto / Publicidad / Historia)
     ========================================================== */
  --enn-page-max: 680px;     /* 600–760 (recomendado 640–700) */
  --enn-page-title: 52px;    /* 46–58 */
  --enn-page-font: 17px;     /* 16–18 */
  --enn-page-line: 1.75;     /* 1.65–1.85 */
  --enn-page-gap: 18px;

  /* ==========================================================
     FORMULARIOS (Contacto / Historia / Publicidad)
     ========================================================== */
  --enn-form-pad: 22px;
  --enn-form-gap: 16px;

  --enn-form-panel-bg: rgba(255,255,255,0.03);
  --enn-form-panel-border: rgba(255,255,255,0.10);

  --enn-input-bg: rgba(0,0,0,0.55);
  --enn-input-border: rgba(255,255,255,0.18);
  --enn-input-border-hover: rgba(255,255,255,0.30);
  --enn-input-border-focus: rgba(255,225,33,0.75);

  --enn-help: rgba(248,245,240,0.70);
  --enn-legal: rgba(248,245,240,0.55);

  /* ==========================================================
     FOOTER
     ========================================================== */
  --enn-footer-pad-y: 18px;          /* ✅ MARCADOR */
  --enn-footer-pad-y-bottom: 22px;   /* ✅ MARCADOR */
}

/* ============================================================
   [Bloque 2] RESETEO BÁSICO
   ============================================================ */
*,
*::before,
*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background:var(--enn-bg);
  color:var(--enn-text);
}

a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:none; }

img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius:12px;
}

/* ============================================================
   [Bloque 3] HELPERS
   ============================================================ */
.container{
  max-width:1180px;
  margin:0 auto;
  padding:0 16px;
}

.grid{ display:grid; gap:22px; }

.btn{
  background:var(--amarillo-senal);
  color:#000;
  padding:10px 16px;
  border-radius:999px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.3px;
  border:none;
  cursor:pointer;
}

/* ============================================================
   [Bloque 5] TIPOGRAFÍA GLOBAL
   ============================================================ */
h1,h2,h3,h4,h5,h6{
  font-family:'Bebas Neue','Anton',system-ui,sans-serif;
  margin:0 0 10px;
}

p{
  margin:0 0 10px;
  line-height:1.6;
}

/* ============================================================
   [Bloque 6] LAYOUT BÁSICO
   ============================================================ */
main#content{ padding-bottom:40px; }

/* ============================================================
   [Bloque 6.1] FOOTER — ENN (NUEVO, LIMPIO, RESPONSIVE)
   ------------------------------------------------------------
   ✅ REQUIERE que footer.php tenga esta estructura:
   <footer class="site-footer">
     <div class="container site-footer__inner">
       <div class="site-footer__left">...</div>
       <nav class="site-footer__right">...</nav>
     </div>
   </footer>
   ============================================================ */
.site-footer{
  background: var(--enn-brand);
  color: var(--enn-text);
  margin-top: 32px;
  padding: var(--enn-footer-pad-y) 0 var(--enn-footer-pad-y-bottom);
  font-size: 14px;
}

.site-footer__inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.site-footer__left{
  display:flex;
  align-items:baseline;
  gap:8px;
  opacity:.9;
}

.site-footer__brand{
  font-weight:800;
  letter-spacing:.2px;
}

.site-footer__copy{
  opacity:.75;
}

.site-footer__right{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}

.footer-link{
  color: var(--enn-text);
  opacity:.9;
  transition: opacity .15s ease, transform .15s ease;
}

.footer-link:hover{
  opacity:1;
  transform: translateY(-1px);
}

@media (max-width:680px){
  .site-footer__inner{
    justify-content:center;
    text-align:center;
  }
  .site-footer__left,
  .site-footer__right{
    justify-content:center;
  }
}

/* ============================================================
   [Bloque 7] WIDGETS Y ELEMENTOS COMUNES
   ============================================================ */
.widget-title{
  font-family:'Bebas Neue',sans-serif;
  color:var(--amarillo-marca);
}

.pagination{
  display:flex;
  gap:8px;
  justify-content:center;
  padding:26px 0;
}

.pagination a,
.pagination span{
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:8px;
}

/* ============================================================
   [Bloque 8] RELACIONADOS + TARJETAS MINI
   ============================================================ */
.btn.btn-random{
  background:var(--amarillo-marca);
  color:#000;
  padding:10px 16px;
  border-radius:999px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.3px;
  border:none;
  cursor:pointer;
}

.enn-related .section-title{
  font-family:'Bebas Neue',sans-serif;
  color:var(--amarillo-marca);
  font-size:28px;
  margin:0 0 12px;
}

.card-mini{
  display:flex;
  gap:10px;
  align-items:center;
  background:var(--enn-brand);
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  padding:6px 10px;
  transition:background .2s ease, border-color .2s ease, transform .15s ease;
}

.card-mini:hover{
  background:#111;
  border-color:rgba(255,255,255,.14);
  transform:translateY(-1px);
}

.card-mini-thumb img{
  width:80px;
  height:80px;
  object-fit:cover;
  border-radius:8px;
}

.card-mini-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:20px;
  margin:0;
}

.card-mini-title a{ color:var(--amarillo-marca); }

.card-mini-meta{
  font-size:13px;
  opacity:.75;
  color:var(--enn-muted);
}

.enn-related .cards-mini{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

@media (max-width:640px){
  .enn-related .cards-mini{ grid-template-columns:1fr; }
}

/* ============================================================
   [Bloque 9] HEADER + NAV (.enn-*)
   ============================================================ */
.enn-topbar{
  background:var(--enn-brand);
  padding:16px 0;
  display:flex;
  align-items:center;
}

.enn-topbar .container{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}

.enn-logo img,
.custom-logo{
  display:block;
  height:64px;
  width:auto;
}

@media (max-width:960px){
  .enn-topbar{ padding:12px 0; }
  .enn-logo img,
  .custom-logo{ height:48px; }
}

.enn-nav{
  position:sticky;
  top:0;
  z-index:1000;
  background:var(--amarillo-normal);
  padding:4px 0;
  box-shadow:0 1px 0 rgba(0,0,0,.08);
}

.enn-nav-inner{
  display:grid;
  grid-template-columns:90px 1fr 90px;
  align-items:center;
  column-gap:40px;
}

.enn-burger{
  grid-column:1;
  justify-self:start;
  background:transparent;
  border:0;
  padding:6px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

.enn-burger svg,
.enn-search-btn svg{
  width:22px;
  height:22px;
  display:block;
}

.enn-menu-wrap{
  grid-column:2;
  justify-self:center;
  display:flex;
  justify-content:center;
}

.enn-actions{
  grid-column:3;
  justify-self:end;
  display:flex;
  align-items:center;
  gap:8px;
}

.enn-menu{
  list-style:none;
  display:flex;
  gap:22px;
  margin:0;
  padding:0;
  font-family:'Bebas Neue',sans-serif;
  font-size:18px;
  letter-spacing:.3px;
  align-items:center;
}

.enn-menu li{ margin:0; padding:0; }

.enn-menu a{
  color:#000;
  display:inline-block;
  padding:2px 2px;
  line-height:1.1;
  transition:color .15s ease, transform .15s ease;
}

.enn-menu a:hover{
  color:var(--rojo-alerta);
  transform:translateY(-1px);
}

.enn-search-btn{
  background:transparent;
  border:0;
  padding:6px;
  cursor:pointer;
  display:flex;
  align-items:center;
}

.enn-search-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.86);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:1100;
}

.enn-search-overlay.is-open{ display:flex; }

.enn-search-close{
  position:absolute;
  top:20px;
  right:20px;
  font-size:36px;
  line-height:1;
  background:none;
  border:0;
  color:#fff;
  cursor:pointer;
}

.enn-search-box{
  width:min(720px,92vw);
  background:#111;
  padding:24px;
  border-radius:12px;
}

.enn-search-box input[type="search"]{
  width:100%;
  padding:14px 16px;
  font-size:18px;
  border-radius:10px;
  border:1px solid #333;
  background:#000;
  color:var(--enn-text);
}

/* OFFCANVAS */
.enn-offcanvas{
  position:fixed;
  top:0;
  left:0;
  height:100vh;
  width:min(380px,86vw);
  background:var(--enn-panel);
  color:var(--enn-text);
  transform:translateX(-100%);
  transition:transform .25s ease;
  z-index:1200;
  display:flex;
  flex-direction:column;
}

.enn-offcanvas.is-open{ transform:translateX(0); }

.enn-offcanvas__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,.10);
  font-weight:700;
}

.enn-offcanvas__close{
  background:none;
  border:0;
  color:var(--enn-text);
  font-size:28px;
  cursor:pointer;
}

.enn-offcanvas__body{
  padding:14px 18px;
  overflow:auto;
}

.off-menu{ list-style:none; margin:0; padding:0; }

.off-menu a{
  color:var(--enn-text);
  display:block;
  padding:10px 0;
}

.off-menu a:hover{ color:var(--amarillo-normal); }

.off-extra{ list-style:none; margin:14px 0 0; padding:0; }

.off-extra a{
  color:#bbb;
  display:block;
  padding:8px 0;
}

.off-extra a:hover{ color:#fff; }

@media (max-width:960px){
  .enn-menu-wrap{ display:none; }
  .enn-nav{ padding:8px 0; }
}

/* ============================================================
   [Bloque 10] HOME: SISTEMA DE MÓDULOS
   ============================================================ */
.home .home-hero{ margin: var(--enn-home-gap) auto 0; }
.home .home-feed{ margin: var(--enn-home-gap) auto 40px; }

@media (max-width:680px){
  :root{
    --enn-home-gap:16px;
    --enn-feed-item-pad-y:14px;
    --enn-textcol-pad:9px;
  }
}

/* ============================================================
   [Bloque 11] PANEL UNIFICADO (.enn-module)
   ============================================================ */
.enn-module{
  background:var(--enn-panel);
  border:1px solid rgba(255,255,255,var(--enn-card-border-alpha));
  border-radius:var(--enn-radius-lg);
  box-shadow:var(--enn-shadow);
  overflow:hidden;
}

.enn-module--hero{ padding:14px; }
.enn-module--feed{ padding:12px 0; }

@media (max-width:680px){
  .enn-module--hero{
    padding:0;
    border-radius:14px;
  }
  .hero-slider-mobile{
    border-radius:14px;
    overflow:hidden;
  }
}

/* ============================================================
   [Bloque 12] HOME: FEED — LISTA PREMIUM
   ============================================================ */
#enn-infinite-feed{
  display:flex;
  flex-direction:column;
  gap:0;
}

#enn-feed-sentinel{ width:100%; height:1px; }

.enn-card-h{
  display:grid;
  grid-template-columns:38% 1fr;
  gap:16px;
  align-items:stretch;
  background:transparent;
  padding: var(--enn-feed-item-pad-y) 16px;
  border-bottom:0;
  position:relative;
  border-radius:14px;
  transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.enn-card-h::after{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  bottom:0;
  height:1px;
  background: linear-gradient(
    to right,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,var(--enn-divider-alpha)) 50%,
    rgba(255,255,255,0) 100%
  );
}
.enn-card-h:last-child::after{ display:none; }

.enn-card-h:hover{
  transform: translateY(calc(-1 * var(--enn-feed-hover-lift)));
  background: rgba(255,255,255,var(--enn-feed-hover-bg-alpha));
  box-shadow: 0 18px 38px rgba(0,0,0,.28);
}

.enn-card-h__media{
  border-radius:12px;
  overflow:hidden;
}

.enn-card-h__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:12px;
  transform: scale(1);
  transition: transform .22s ease, filter .22s ease;
}

.enn-card-h:hover .enn-card-h__media img{
  transform: scale(var(--enn-feed-img-zoom));
  filter: brightness(1.02);
}

.enn-card-h__placeholder{
  width:100%;
  height:100%;
  aspect-ratio:16/9;
  background:#000;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:12px;
}

.enn-card-h__body{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding: var(--enn-textcol-pad);
  border-radius: 10px 14px 14px 10px;

  background:
    radial-gradient(
      120% 140% at 80% 70%,
      rgba(255,255,255,var(--enn-textcol-bg-alpha)) 0%,
      rgba(255,255,255,0) 72%
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,var(--enn-textcol-bg-alpha)) 18%,
      rgba(255,255,255,var(--enn-textcol-bg-alpha)) 100%
    );

  box-shadow: inset 1px 0 0 rgba(255,255,255,var(--enn-textcol-sep-alpha));
  transition: background .18s ease, box-shadow .18s ease;
}

.enn-card-h__body .enn-badge{ margin-bottom:2px; }

.enn-card-h:hover .enn-card-h__body{
  background:
    radial-gradient(
      120% 140% at 80% 70%,
      rgba(255,255,255,var(--enn-textcol-bg-alpha-hover)) 0%,
      rgba(255,255,255,0) 70%
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,var(--enn-textcol-bg-alpha-hover)) 18%,
      rgba(255,255,255,var(--enn-textcol-bg-alpha-hover)) 100%
    );
  box-shadow: inset 1px 0 0 rgba(255,255,255,0.085);
}

.enn-card-h__title{
  margin:0 0 2px 0;
  font-family:'Bebas Neue',sans-serif;
  font-size:28px;
  line-height:1.05;
  color:var(--amarillo-marca);
}

.enn-card-h__title a{ color:inherit; }
.enn-card-h:hover .enn-card-h__title a{ color:var(--amarillo-senal); }

.enn-card-h__excerpt{
  margin:0;
  color:var(--enn-text);
  opacity:.84;
  line-height:1.58;
  font-family:'Montserrat',system-ui,sans-serif;
  max-width:70ch;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.enn-card-h__meta{
  margin-top:2px;
  font-size:13px;
  color:var(--enn-text);
  opacity:.70;
}

.enn-card-h:hover .enn-badge{
  transform: translateY(-1px);
  filter: brightness(1.06);
}

@media (max-width:860px){
  .enn-card-h{
    grid-template-columns:1fr;
    gap:12px;
    padding: var(--enn-feed-item-pad-y) 14px;
  }
  .enn-card-h::after{
    left:14px;
    right:14px;
  }
  .enn-card-h__body{
    box-shadow:none;
    border-radius:12px;
    background: rgba(255,255,255,0.030);
  }
  .enn-card-h:hover .enn-card-h__body{
    background: rgba(255,255,255,0.045);
  }
}

/* ============================================================
   [Bloque 13] BADGES — “OUTLINE” (FONDO = TARJETA)
   ------------------------------------------------------------
   ✅ Objetivo final:
   - Texto BLANCO
   - Contorno del color asignado por categoría
   - Fondo del color de la tarjeta (panel)
   ------------------------------------------------------------
   MARCADORES:
   - Si quieres que el contorno sea más fino/grueso: border-width
   - Si quieres fondo más oscuro/claro: background
   ============================================================ */

/* Base badge */
.enn-badge,
.enn-hero-sm__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  max-width:100%;
  align-self:flex-start;
  padding:6px 10px 4px;
  border-radius:999px;
  font-family:'Bebas Neue',sans-serif;
  font-size:var(--enn-badge-font);
  letter-spacing:.7px;
  text-transform:uppercase;
  line-height:1;
  white-space:nowrap;

  /* ✅ Fondo = color tarjeta */
  background: var(--enn-panel) !important;   /* MARCADOR: cambia a var(--enn-brand) si los quieres “negro puro” */

  /* ✅ Texto siempre blanco */
  color: var(--enn-text) !important;

  /* Border por defecto (si no hay clase) */
  border: 1px solid rgba(248,245,240,var(--enn-badge-border-alpha));

  /* look premium */
  box-shadow:0 8px 20px rgba(0,0,0,.22);
  transition:transform .12s ease, filter .12s ease;
}

/* Tamaño pequeño */
.enn-badge.is-sm{
  padding:5px 9px 3px;
  font-size:11px;
}

/* Hover */
a:hover .enn-badge,
a:hover .enn-card-h__badge,
a:hover .enn-hero-sm__badge{
  transform:translateY(-1px);
  filter:brightness(1.08);
}

/* ✅ Paleta original aplicada SOLO al CONTORNO (texto sigue blanco) */
.enn-badge.is-normal{     border-color:#4B5D5A; }
.enn-badge.is-viral{      border-color:#FF6A00; }
.enn-badge.is-curioso{    border-color:#6D28D9; }
.enn-badge.is-ciencia{    border-color:#0077B6; }
.enn-badge.is-animaladas{ border-color:#0F9D58; }
.enn-badge.is-quiz{       border-color:#C1126B; }

/* ============================================================
   [Bloque 14] HERO SMALL (overlay)
   ============================================================ */
.enn-hero-sm{
  position: relative;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  background: #000;
}

.enn-hero-sm__media{
  position: relative;
  width: 100%;
  height: 100%;
}

.enn-hero-sm__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.enn-hero-sm__placeholder{
  width: 100%;
  height: 100%;
  background: #222;
}

.enn-hero-sm__overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:14px 16px 16px;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.10) 35%,
    rgba(0,0,0,.65) 70%,
    rgba(0,0,0,.88) 100%
  );
}

.enn-hero-sm__badge{
  position:absolute;
  top:12px;
  left:12px;
  width:auto;
  max-width:calc(100% - 24px);
  border-radius:999px;
  white-space:nowrap;
}

@media (max-width:680px){
  .enn-hero-sm__badge{
    top:10px;
    left:10px;
  }
}

.enn-hero-sm__title{
  margin: 0;
  color: var(--amarillo-marca);
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px;
  line-height: 1.05;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (min-width: 681px){
  .hero-grid-desktop .enn-hero-sm__overlay{ min-height:118px; }
  .hero-grid-desktop .enn-hero-sm__title{
    -webkit-line-clamp:3;
    min-height:calc(1.05em * 3);
  }
}

/* ============================================================
   [Bloque 15] HERO (desktop grid + móvil slider)
   ============================================================ */
.hero-grid-desktop{ display:none; }
.hero-slider-mobile{ display:none; }

@media (max-width: 680px){
  .home-hero.container{
    padding-left:0;
    padding-right:0;
  }

  .home-hero .hero-grid,
  .hero-grid-desktop{
    display:none !important;
  }

  .hero-slider-mobile{
    position: relative;
    display:flex !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:0;
    padding:0 0 18px;
  }

  .hero-slider-mobile{
    --enn-hero-slide-width: 92%;
  }

  .hero-slider-mobile .hero-slide{
    flex: 0 0 var(--enn-hero-slide-width) !important;
    scroll-snap-align: start;
    position: relative;
  }

  .hero-slider-mobile .enn-hero-sm{
    height:100%;
    border-radius:0;
  }

  .hero-slider-mobile .enn-hero-sm__media{
    width:100%;
    aspect-ratio:16/9;
    height:auto;
  }

  .hero-slider-mobile .enn-hero-sm__img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }

  .hero-slider-mobile .enn-hero-sm__overlay{
    padding:18px 16px 20px;
  }

  .hero-slider-mobile .enn-hero-sm__title{
    font-size:26px;
    line-height:1.08;
    -webkit-line-clamp:3;
  }

  .hero-slider-mobile::before,
  .hero-slider-mobile::after{
    position: absolute;
    top: 50%;
    width: 22px;
    height: 22px;
    margin-top: -11px;
    border-radius: 999px;
    border: 1px solid rgba(248,245,240,.4);
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: var(--enn-text);
    pointer-events: none;
    opacity: .8;
  }

  .hero-slider-mobile::before{ content: '‹'; left: 6px; }
  .hero-slider-mobile::after{ content: '›'; right: 6px; }
}

@media (min-width: 681px){
  .hero-slider-mobile{ display:none; }

  .hero-grid-desktop{
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:14px;
    align-items:stretch;
    grid-auto-rows:clamp(220px, 28vw, 360px);
  }

  .hero-grid-desktop .hero-item,
  .hero-grid-desktop .hero-item > *{ height:100%; }

  .hero-grid-desktop .hero-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:12px;
  }

  .hero-grid-desktop .hero-item a.hero-link{
    display:flex;
    flex-direction:column;
    height:100%;
  }

  .hero-grid-desktop .hero-item .card-hero-content{
    margin-top:auto;
  }
}

/* ============================================================
   [Bloque 16] SINGLE — lectura larga
   ============================================================ */
.enn-single{ padding-bottom:44px; }

.single-hero{
  background: transparent;
  padding: 26px 0 14px;
}

.single-hero .container{
  max-width: var(--enn-single-max);
}

.single-thumb{
  margin: 0 0 14px;
  border-radius: 16px;
  overflow:hidden;
  box-shadow: 0 18px 40px rgba(0,0,0,.30);
}

.single-thumb img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
}

.single-title{
  margin: 0 0 8px;
  font-family:'Anton',system-ui,sans-serif;
  font-size: 52px;
  line-height: 0.98;
  letter-spacing: .2px;
  color:var(--amarillo-marca);
}

.single-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  font-size: 13px;
  opacity: .78;
  margin-bottom: 12px;
}

.single-meta a{
  color:var(--enn-text);
  border-bottom:1px solid rgba(255,255,255,.16);
}
.single-meta a:hover{
  border-bottom-color: rgba(255,255,255,.32);
}

.single-share{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.10);
}

.single-share__btn{
  appearance:none;
  background: rgba(255,255,255,0.06);
  color:var(--enn-text);
  border:1px solid rgba(255,255,255,0.14);
  border-radius: 999px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .2px;
  cursor:pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}

.single-share__btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.09);
  border-color: rgba(255,255,255,0.22);
}

.single-content{ padding: 10px 0 0; }
.single-content .container{ max-width: var(--enn-single-max); }

.single-body{
  font-size: var(--enn-single-font);
  line-height: var(--enn-single-line);
  color:var(--enn-text);
}

.single-body p{
  margin: 0 0 var(--enn-single-gap);
  opacity: .92;
}

.single-body figure,
.single-body .wp-block-image,
.single-body .wp-block-embed,
.single-body .wp-block-gallery{
  margin: 18px 0 22px;
}

.single-body h2{
  margin: 34px 0 12px;
  font-family:'Bebas Neue',sans-serif;
  font-size: 34px;
  letter-spacing: .6px;
  color:var(--amarillo-marca);
}

.single-body h3{
  margin: 26px 0 10px;
  font-family:'Bebas Neue',sans-serif;
  font-size: 28px;
  letter-spacing: .4px;
  color:var(--amarillo-marca);
  opacity: .95;
}

.single-body a{
  color:var(--amarillo-senal);
  border-bottom:1px solid rgba(255,255,0,.22);
}
.single-body a:hover{
  border-bottom-color: rgba(255,255,0,.44);
}

.single-body blockquote{
  margin: 26px 0;
  padding: 14px 16px;
  border-left: 3px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.04);
  border-radius: 12px;
}

.single-body img{ border-radius:16px; }

.single-body p:first-of-type{
  font-size: 1.05em;
  opacity: 0.95;
  line-height: 1.65;
}

.single-nav{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.10);
}

.single-nav a{
  display:block;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}

.single-nav a:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18);
}

.single-nav__next{ text-align:right; }

.single-related-wrap{
  margin-top: 48px;
  padding-bottom: 14px;
}

.single-related-wrap .enn-related.container{
  max-width: var(--enn-single-max);
  margin-left: auto;
  margin-right: auto;
}

.single-related-wrap .enn-related .section-title{
  margin-top: 6px;
}

/* ============================================================
   [Bloque 17] ARCHIVE QUIZ
   ============================================================ */
.archive-header{
  text-align:center;
  padding:32px 0;
}

.archive-title{
  margin:0;
  font-family:'Anton',sans-serif;
  font-size:42px;
  color:var(--amarillo-marca);
}

.archive-desc{
  margin-top:6px;
  font-size:16px;
  color:var(--enn-text);
  opacity:.85;
}

.archive-quiz-grid{
  margin-top:24px;
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
}

/* ============================================================
   [Bloque 18] SINGLE QUIZ
   ============================================================ */
.single-quiz-header{
  margin:20px 0;
  text-align:center;
}

.single-quiz-title{
  font-family:'Anton',sans-serif;
  font-size:40px;
  color:var(--amarillo-marca);
  margin:10px 0 20px;
}

.single-quiz-thumb img{
  width:100%;
  border-radius:14px;
  margin-bottom:24px;
}

.single-quiz-body{
  font-size:18px;
  line-height:1.6;
  margin-bottom:40px;
}

.single-quiz-body h2{
  font-family:'Bebas Neue',sans-serif;
  font-size:28px;
  color:var(--amarillo-marca);
}

.quiz-progress{
  margin:16px 0 20px;
  font-size:14px;
  opacity:.8;
}

.quiz-questions{ margin-bottom:24px; }

.quiz-question{
  margin-bottom:22px;
  padding:16px;
  border-radius:12px;
  background:var(--enn-panel);
}

.quiz-options{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:10px;
}

.quiz-option{
  text-align:left;
  background:#000;
  border:1px solid #333;
  border-radius:999px;
  padding:10px 14px;
  cursor:pointer;
  font-family:'Montserrat',system-ui,sans-serif;
  font-size:14px;
  color:var(--enn-text);
  transition:background .15s ease, border-color .15s ease, transform .1s ease;
}

.quiz-option:hover{
  border-color:var(--amarillo-marca);
  transform:translateY(-1px);
}

.quiz-option.is-selected{
  background:var(--amarillo-marca);
  color:#000;
  border-color:var(--amarillo-marca);
  font-weight:700;
}

.quiz-calc{
  display:inline-block;
  margin:10px 0 18px;
  background:var(--rojo-alerta);
  color:var(--enn-text);
  border:none;
  border-radius:999px;
  padding:10px 18px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.4px;
  cursor:pointer;
}

.quiz-results{ margin-top:10px; }

.quiz-result{
  display:none;
  margin-top:14px;
  padding:18px;
  border-radius:12px;
  background:var(--enn-panel);
}

.quiz-result.is-active{ display:block; }

/* ============================================================
   [Bloque 19] PÁGINAS ESTÁTICAS — SISTEMA ÚNICO
   ============================================================ */
body.page main#content{
  padding-top: 10px;
}

.enn-page{
  padding: 18px 0 42px;
}

/* ✅ container de page.php a ancho editorial */
.enn-page > .container{
  max-width: var(--enn-page-max);
}

/* H1 WordPress */
.enn-page__title{
  margin: 6px 0 14px;
  font-family: 'Anton', system-ui, sans-serif;
  font-size: var(--enn-page-title);
  line-height: 0.95;
  letter-spacing: .2px;
  color: var(--amarillo-marca);
}

.enn-page__content{
  margin-top: 0;
  font-size: var(--enn-page-font);
  line-height: var(--enn-page-line);
  color: var(--enn-text);
}

.enn-page__content > *:first-child{ margin-top: 0; }

.enn-page__content p{
  margin: 0 0 var(--enn-page-gap);
  opacity: .92;
}

.enn-page__content h2{
  margin: 26px 0 10px;
  font-family:'Bebas Neue', sans-serif;
  font-size: 30px;
  letter-spacing: .6px;
  color: var(--amarillo-marca);
}

.enn-page__content h3{
  margin: 22px 0 8px;
  font-family:'Bebas Neue', sans-serif;
  font-size: 26px;
  letter-spacing: .4px;
  color: var(--amarillo-marca);
  opacity:.95;
}

.enn-page__content a{
  color: var(--amarillo-senal);
  border-bottom: 1px solid rgba(255,255,0,.22);
}
.enn-page__content a:hover{
  border-bottom-color: rgba(255,255,0,.44);
}

.enn-page__content ul,
.enn-page__content ol{
  margin: 0 0 18px 20px;
  padding: 0;
}
.enn-page__content li{
  margin: 0 0 8px;
}

@media (max-width: 680px){
  body.page main#content{ padding-top: 8px; }
  .enn-page{ padding: 14px 0 34px; }
  .enn-page__title{ font-size: 44px; } /* 40–48 */
}

/* ============================================================
   [Bloque 20] ENN — FORMULARIOS (Contacto / Historia / Publicidad)
   ============================================================ */
.enn-form-wrap{
  max-width: var(--enn-page-max);
  margin: 0 auto;
  padding: 10px 0 38px;
}

.enn-form-head{ margin-bottom: 14px; }

.enn-form-title{
  font-family: 'Anton', system-ui, sans-serif;
  font-size: 52px;
  line-height: 0.98;
  color: var(--amarillo-marca);
  margin: 0 0 12px;
}

.enn-form-lead{
  margin: 0 0 12px;
  font-size: 18px;
  line-height: 1.75;
  opacity: .92;
}

.enn-form-note{
  margin: 14px 0 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.10);
}

.enn-form{
  padding: var(--enn-form-pad);
  border-radius: 18px;
  background: var(--enn-form-panel-bg);
  border: 1px solid var(--enn-form-panel-border);
  box-shadow: 0 18px 44px rgba(0,0,0,.35);
}

.enn-label{
  display:block;
  margin: 0 0 8px;
  font-family: 'Bebas Neue', system-ui, sans-serif;
  font-size: 20px;
  letter-spacing: .4px;
  color: var(--enn-text);
}

.enn-muted{
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 14px;
  letter-spacing: 0;
  color: rgba(248,245,240,0.65);
  margin-left: 6px;
}

.enn-required{
  color: var(--rojo-alerta);
  font-weight: 800;
}

.enn-input,
.enn-textarea,
.enn-file{
  width: 100%;
  max-width: 100%;
  margin: 0 0 var(--enn-form-gap);
}

.enn-input,
.enn-textarea{
  color: var(--enn-text);
  background: var(--enn-input-bg);
  border: 1px solid var(--enn-input-border);
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.45;
  outline: none;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .12s ease;
}

.enn-input:hover,
.enn-textarea:hover{ border-color: var(--enn-input-border-hover); }

.enn-input:focus,
.enn-textarea:focus{
  border-color: var(--enn-input-border-focus);
  background: rgba(0,0,0,0.70);
  box-shadow: 0 0 0 3px rgba(255,225,33,0.14);
}

.enn-input::placeholder,
.enn-textarea::placeholder{ color: rgba(248,245,240,0.42); }

.enn-textarea{
  resize: vertical;
  min-height: 220px;
}

.enn-help{
  margin: -8px 0 var(--enn-form-gap);
  font-size: 14px;
  line-height: 1.5;
  color: var(--enn-help);
}

.enn-checkbox{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  margin: 4px 0 14px;
  font-size: 15px;
  line-height: 1.45;
  color: rgba(248,245,240,0.92);
  user-select:none;
  cursor:pointer;
}

.enn-checkbox input[type="checkbox"]{
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: var(--amarillo-marca);
}

.enn-file{
  color: rgba(248,245,240,0.90);
  background: transparent;
}

.enn-file::-webkit-file-upload-button{
  appearance: none;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(0,0,0,0.55);
  color: var(--enn-text);
  padding: 10px 14px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 900;
  letter-spacing: .2px;
  transition: transform .12s ease, border-color .15s ease, background .15s ease;
}

.enn-file::-webkit-file-upload-button:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,0.28);
  background: rgba(0,0,0,0.70);
}

.enn-submit{
  appearance:none;
  border:0;
  cursor:pointer;
  width: fit-content;
  background: var(--amarillo-marca);
  color: #000;
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: .4px;
  text-transform: uppercase;
  transition: transform .12s ease, filter .12s ease;
}

.enn-submit:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
}

.enn-submit:active{ transform: translateY(0); }

.enn-legal{
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--enn-legal);
}

@media (max-width: 680px){
  .enn-form-wrap{ padding: 8px 0 28px; }
  .enn-form{ padding: 18px 16px; border-radius: 16px; }
  .enn-textarea{ min-height: 200px; }
}
/* ============================================================
   FOOTER ENN — premium minimal
   ------------------------------------------------------------
   ✅ sin inline styles (todo desde CSS)
   ============================================================ */

.enn-footer{
  margin-top: 32px;
  background: var(--enn-brand);
  color: var(--enn-text);
  border-top: 1px solid rgba(255,255,255,.08);
}

.enn-footer__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding: 18px 16px;
}

.enn-footer__brand{
  display:flex;
  align-items:baseline;
  gap:8px;
  opacity: .92;
}

.enn-footer__site{
  font-weight: 900;
  letter-spacing: .2px;
}

.enn-footer__copy{
  opacity: .75;
}

.enn-footer__nav{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

.enn-footer__link{
  color: rgba(248,245,240,.90);
  font-size: 13px;
  letter-spacing: .2px;
  opacity: .92;
  border-bottom: 1px solid rgba(255,255,255,.0);
  transition: transform .12s ease, opacity .12s ease, border-color .12s ease;
}

.enn-footer__link:hover{
  opacity: 1;
  transform: translateY(-1px);
  border-bottom-color: rgba(255,255,255,.22);
}

/* Mobile */
@media (max-width: 680px){
  .enn-footer__inner{
    flex-direction:column;
    align-items:flex-start;
    padding: 16px 16px 22px;
  }
  .enn-footer__nav{
    gap:12px;
  }
}
/* =========================================================
 * CATEGORY PAGE ONLY — Estilo aislado (NO TOCA HOME)
 * ---------------------------------------------------------
 * REGLA:
 * - Todo cuelga de .enn-page--category o body.category
 * - NO tocar clases globales fuera de este scope
 * =======================================================*/

body.category .enn-page--category {
  background: var(--negro-puro);
}

/* =========================
   Layout general del canal
   ========================= */

/* MARCADOR: Si quieres más aire vertical, sube padding */
body.category .enn-page--category .container {
  padding-top: 18px;
  padding-bottom: 30px;
}

/* =========================
   Header del canal
   ========================= */

body.category .enn-page--category .enn-channel-header {
  position: sticky;
  top: 56px; /* MARCADOR: ajusta si tu header sticky tiene otra altura */
  z-index: 20;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.92) 0%,
    rgba(0,0,0,0.70) 100%
  );
  backdrop-filter: blur(10px);
}

body.category .enn-page--category .enn-channel-header .container {
  padding-top: 14px;
  padding-bottom: 14px;
}

body.category .enn-page--category .enn-channel-badge {
  box-shadow: 0 10px 24px rgba(0,0,0,.35);
}

body.category .enn-page--category .enn-channel-title {
  letter-spacing: .6px;
}

body.category .enn-page--category .enn-channel-desc {
  opacity: .95;
}

/* =========================
   Grid de página (feed + sidebar)
   ========================= */

body.category .enn-page--category .enn-cat-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

/* MARCADOR: breakpoint desktop */
@media (min-width: 980px) {
  body.category .enn-page--category .enn-cat-grid {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 26px;
    align-items: start;
  }
}

/* Sidebar editorial (aunque esté vacía ahora) */
body.category .enn-page--category .enn-cat-sidebar {
  position: sticky;
  top: 140px; /* MARCADOR: ajusta para que no choque con el header sticky */
  padding: 14px;
  background: var(--negro-carbon);
  border: 1px solid rgba(248,245,240,.08);
  border-radius: 16px;
}

body.category .enn-page--category .enn-cat-sidebar__title {
  margin: 0 0 10px;
  font-family: "Bebas Neue", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--blanco-roto);
  letter-spacing: .7px;
  font-size: 20px;
}

/* =========================
   Feed + cards (mejora CTR)
   ========================= */

body.category .enn-page--category .enn-feed {
  display: grid;
  gap: 12px;
}

/* Card horizontal: hacemos que parezca “editorial premium” */
body.category .enn-page--category .enn-card-h {
  background: var(--negro-carbon);
  border: 1px solid rgba(248,245,240,.08);
  border-radius: 16px;
  overflow: hidden;
  transition: transform .12s ease, border-color .12s ease;
}

body.category .enn-page--category .enn-card-h:hover {
  transform: translateY(-1px);
  border-color: rgba(248,245,240,.16);
}

body.category .enn-page--category .enn-card-h__body {
  padding: 14px 14px 12px;
}

/* Imagen: más “media” */
body.category .enn-page--category .enn-card-h__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Badge más visible */
body.category .enn-page--category .enn-badge.is-sm {
  font-size: 12px;
  letter-spacing: .6px;
  padding: 6px 10px;
}

/* Título con jerarquía y line-clamp para limpieza */
body.category .enn-page--category .enn-card-h__title {
  margin: 10px 0 8px;
  font-family: "Bebas Neue", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 24px;
  line-height: 1.05;
}

body.category .enn-page--category .enn-card-h__title a {
  color: var(--blanco-roto);
  text-decoration: none;
}

body.category .enn-page--category .enn-card-h__title a:hover {
  text-decoration: underline;
}

/* Excerpt: más compacto */
body.category .enn-page--category .enn-card-h__excerpt {
  margin: 0 0 10px;
  color: rgba(248,245,240,.82);
  font-size: 14px;
  line-height: 1.45;

  /* MARCADOR: si quieres 3 líneas, cambia 2 -> 3 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Meta */
body.category .enn-page--category .enn-card-h__meta {
  color: rgba(248,245,240,.65);
  font-size: 12px;
}

/* =========================
   HERO en categorías (sin tocar home)
   ========================= */

/* MARCADOR: si quieres ocultar hero móvil en categorías, cambia display */
body.category .enn-page--category .enn-hero-slider {
  margin-top: 10px;
}

/* Loader/sentinel */
body.category .enn-page--category .enn-loader {
  margin-top: 14px;
  text-align: center;
  color: rgba(248,245,240,.7);
}
/* =========================================================
 * CATEGORY PAGE ONLY — FIX ANCHO + LAYOUT (NO TOCA HOME)
 * =======================================================*/

/* =========================================================
 * FIX 1: Ensanchar containers SOLO en categorías
 *
 * PROBLEMA:
 * - .container global parece tener max-width demasiado pequeño
 *
 * SOLUCIÓN:
 * - Forzamos un ancho editorial en categorías
 *
 * MARCADOR:
 * - Si quieres más ancho, sube 1240px -> 1320px
 * =======================================================*/
body.category .enn-page--category .container {
  max-width: 1240px; /* ← TOCA AQUÍ */
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 18px;
  padding-right: 18px;
}

/* =========================================================
 * FIX 2: Grid del canal (main + sidebar)
 *
 * MARCADOR:
 * - Si quieres una sidebar más grande: 320px -> 360px
 * =======================================================*/
body.category .enn-page--category .enn-cat-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

@media (min-width: 980px){
  body.category .enn-page--category .enn-cat-grid{
    grid-template-columns: minmax(0, 1fr) 320px; /* ← TOCA AQUÍ */
    gap: 26px;
    align-items: start;
  }
}

/* Sidebar sticky (solo categorías) */
body.category .enn-page--category .enn-cat-sidebar{
  position: sticky;
  top: 140px; /* ← MARCADOR: ajusta si choca con tu header sticky */
  padding: 14px;
  background: var(--negro-carbon);
  border: 1px solid rgba(248,245,240,.08);
  border-radius: 16px;
}

/* =========================================================
 * FIX 3: Cards horizontales más "media company"
 * - Las hacemos realmente horizontales en desktop
 * =======================================================*/
body.category .enn-page--category .enn-card-h{
  display: grid;
  grid-template-columns: 220px 1fr; /* ← MARCADOR: ancho de imagen */
  gap: 0;
  background: var(--negro-carbon);
  border: 1px solid rgba(248,245,240,.08);
  border-radius: 16px;
  overflow: hidden;
}

@media (max-width: 680px){
  body.category .enn-page--category .enn-card-h{
    grid-template-columns: 1fr; /* en móvil apila */
  }
}

/* Imagen ocupa su columna */
body.category .enn-page--category .enn-card-h__media{
  display:block;
  width:100%;
  height:100%;
}

body.category .enn-page--category .enn-card-h__media img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

/* Cuerpo con padding editorial */
body.category .enn-page--category .enn-card-h__body{
  padding: 14px 16px 12px;
}

/* Título con presencia */
body.category .enn-page--category .enn-card-h__title{
  margin: 10px 0 8px;
  font-family: "Bebas Neue", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 26px;
  line-height: 1.05;
}

/* Excerpt con clamp */
body.category .enn-page--category .enn-card-h__excerpt{
  color: rgba(248,245,240,.82);
  font-size: 14px;
  line-height: 1.45;

  /* MARCADOR: 2 -> 3 líneas */
  display: -webkit-box;
  -webkit-line-clamp: 2; /* ← TOCA AQUÍ */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* =========================================================
 * CATEGORY ONLY — Header limpio + badge outline tipo HOME
 * =======================================================*/

/* Ocultamos cualquier badge anterior si existía */
body.category .enn-page--category .enn-channel-badge.is-normal,
body.category .enn-page--category .enn-channel-badge.is-viral,
body.category .enn-page--category .enn-channel-badge.is-curioso,
body.category .enn-page--category .enn-channel-badge.is-ciencia,
body.category .enn-page--category .enn-channel-badge.is-animaladas,
body.category .enn-page--category .enn-channel-badge.is-quiz{
  /* MARCADOR: no hace falta si ya no lo imprimes, pero lo dejo de seguridad */
}

/* Badge outline (blanco + borde color canal) */
body.category .enn-page--category .enn-channel-badge--outline{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 6px 12px;
  border-radius: 999px;

  background: transparent;
  border: 2px solid var(--enn-channel-color, #FFFF00); /* ← color canal */
  color: var(--blanco-roto);

  font-family: "Bebas Neue", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  letter-spacing: .8px;
  font-size: 18px;

  box-shadow: 0 10px 24px rgba(0,0,0,.35);
}

/* Descripción debajo del badge */
body.category .enn-page--category .enn-channel-desc{
  margin-top: 10px;
  color: rgba(248,245,240,.85);
  max-width: 85ch;
  line-height: 1.55;
}

/* =========================================================
 * Utilidad: H1 oculto (SEO) — accesible
 * =======================================================*/
.enn-sr-only{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* =========================================================
 * CATEGORY ONLY — Forzar color del canal en el badge superior
 * NO TOCA HOME
 * =======================================================*/

body.category .enn-page--category .enn-channel-badge--outline{
  border-color: var(--enn-channel-color, #FFFF00);
  color: var(--blanco-roto, #F8F5F0);
  background: transparent;
}

/* =========================================================
 * CATEGORY ONLY — Quitar badge en las tarjetas (redundante)
 * NO TOCA HOME
 * =======================================================*/
body.category .enn-page--category .enn-card-h .enn-badge{
  display: none !important; /* ← MARCADOR: si lo quieres volver a ver, comenta esta línea */
}
/* CATEGORY ONLY — subrayado/acentos del canal */
body.category .enn-page--category .enn-channel-desc{
  border-left: 3px solid var(--enn-channel-color, #FFFF00);
  padding-left: 12px;
}
/* =========================================================
 * CATEGORY ONLY — Badge “hero” del canal (NO toca home)
 * =======================================================*/
body.category .enn-page--category .enn-channel-header .enn-badge{
  /* MARCADOR: tamaño badge */
  font-size: 24px;          /* ← TOCA AQUÍ */
  padding: 10px 18px;       /* ← TOCA AQUÍ */
  border-width: 2px;        /* ← TOCA AQUÍ */
  border-radius: 999px;
  letter-spacing: .8px;
  line-height: 1;
}

/* Mobile */
@media (max-width: 640px){
  body.category .enn-page--category .enn-channel-header .enn-badge{
    font-size: 20px;        /* ← TOCA AQUÍ */
    padding: 9px 14px;
  }
}
/* =========================================================
 * CATEGORY ONLY — Eliminar barra gris superior
 * ---------------------------------------------------------
 * Motivo:
 * - Es un adorno heredado del módulo (no contenido real)
 * - En categorías molesta y resta calidad visual
 *
 * SEGURIDAD:
 * - Scoped a body.category
 * - NO afecta a Home
 * =======================================================*/

/* Caso 1: barra creada con pseudo-elementos */
body.category .enn-page--category .enn-module::before,
body.category .enn-page--category .enn-module::after,
body.category .enn-page--category .enn-module--hero::before,
body.category .enn-page--category .enn-module--hero::after{
  display: none !important; /* ← MARCADOR: comenta para volver a verla */
}

/* Caso 2: barra creada por fondo/borde del wrapper */
body.category .enn-page--category .enn-module,
body.category .enn-page--category .enn-module--hero{
  background: transparent !important;
  border-top: 0 !important;
}
/* =========================================
   CATEGORY HERO
   Reutiliza el HERO de HOME sin romperlo
========================================= */

.enn-page--category .enn-category-hero {
  margin-top: 32px;
}

.enn-page--category .enn-category-hero .enn-hero-grid,
.enn-page--category .enn-category-hero .enn-hero-slider {
  /* hereda exactamente el comportamiento del home */
}

/* Reaplicamos reglas que en HOME dependen de .home */
.enn-page--category .enn-hero-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 24px;
}

.enn-page--category .enn-hero-grid__main,
.enn-page--category .enn-hero-grid__side {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Mobile */
@media (max-width: 900px) {
  .enn-page--category .enn-hero-grid {
    display: none;
  }
}
/* =========================================================
 * ENN — CATEGORY HERO FIX (NO TOCA HOME)
 * ---------------------------------------------------------
 * OBJETIVO:
 * - Hacer que el HERO de category.php se vea igual que en HOME
 * - Sin romper HOME (scoping estricto)
 *
 * REQUIERE:
 * - functions.php añadiendo body_class: enn-is-category
 * - category.php con <main class="enn-page enn-page--category">
 *
 * MARCADORES:
 * - Espaciado global: --enn-cat-gap
 * - Mostrar/ocultar slider móvil: ver @media
 * =======================================================*/

body.enn-is-category .enn-page--category {
  /* MARCADOR: ajusta espaciado vertical general del canal */
  --enn-cat-gap: 22px;
}

/* =========================================================
 * 1) Header del canal (badge + descripción)
 * =======================================================*/
body.enn-is-category .enn-page--category .enn-channel-header {
  padding: 22px 0 0;
}

body.enn-is-category .enn-page--category .enn-channel-header .enn-badge {
  /* MARCADOR: tamaño del badge superior del canal */
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 999px;
  letter-spacing: .5px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.enn-is-category .enn-page--category .enn-channel-desc {
  margin-top: 12px;
  max-width: 980px;
  line-height: 1.55;
}

/* =========================================================
 * 2) HERO — Grid desktop (igual lógica que HOME)
 * =======================================================*/
body.enn-is-category .enn-page--category .home-hero {
  margin-top: var(--enn-cat-gap);
}

/* La caja de módulo (si en HOME tiene sombras/bordes, aquí lo respetamos) */
body.enn-is-category .enn-page--category .enn-module--hero {
  /* MARCADOR: si no quieres “barra/espacio” arriba del hero, baja padding */
  padding-top: 0;
}

/* Grid principal */
body.enn-is-category .enn-page--category .enn-hero-grid {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 16px;
  align-items: stretch;
}

/* Columna derecha (hero-small apilados) */
body.enn-is-category .enn-page--category .enn-hero-grid__side {
  display: grid;
  gap: 12px;
}

/* =========================================================
 * 3) HERO — Slider móvil (solo móvil)
 * ---------------------------------------------------------
 * En desktop: ocultamos slider
 * En móvil: ocultamos grid y mostramos slider
 * =======================================================*/
body.enn-is-category .enn-page--category .enn-hero-slider {
  display: none; /* desktop off */
}

@media (max-width: 900px) {

  /* MARCADOR: si quieres mantener grid también en móvil, comenta estas 2 reglas */
  body.enn-is-category .enn-page--category .enn-hero-grid {
    display: none;
  }

  body.enn-is-category .enn-page--category .enn-hero-slider {
    display: block;
    margin-top: 10px;
  }

  /* Track horizontal (asumiendo que tu JS mueve el track) */
  body.enn-is-category .enn-page--category .enn-hero-slider__track {
    display: flex;
    gap: 12px;
    overflow: hidden;
    scroll-behavior: smooth;
    padding: 6px 0;
  }

  /* Slide ancho */
  body.enn-is-category .enn-page--category .enn-hero-slider__slide {
    flex: 0 0 86%;
  }

  /* Botones */
  body.enn-is-category .enn-page--category .enn-hero-slider .btn-prev,
  body.enn-is-category .enn-page--category .enn-hero-slider .btn-next {
    margin-top: 10px;
  }
}

/* =========================================================
 * 4) FEED (infinite) — espaciado y contenedor
 * =======================================================*/
body.enn-is-category .enn-page--category .home-feed {
  margin-top: var(--enn-cat-gap);
}

/* MARCADOR: si el feed queda muy estrecho, ajusta max-width aquí */
body.enn-is-category .enn-page--category .enn-feed {
  width: 100%;
}

/* =========================================================
 * 5) DEBUG opcional (solo si quieres ver cajas)
 * ---------------------------------------------------------
 * Para depurar, descomenta:
 *
 * body.enn-is-category .enn-page--category .enn-hero-grid { outline: 1px solid red; }
 * body.enn-is-category .enn-page--category .enn-module--hero { outline: 1px solid lime; }
 * =======================================================*/