/* ==========================================================================
   PORTAL DE NOTICIAS — responsive2.css
   Versión: 2.6
   Descripción: Reglas adaptativas para Mockup v2 (CCN Oficial).
   ========================================================================== */

/* --------------------------------------------------------------------------
   DESKTOP GRANDE (xxl: >= 1400px)
   -------------------------------------------------------------------------- */
@media (min-width: 1400px) {
  .container {
    max-width: 1320px;
  }
}

/* --------------------------------------------------------------------------
   TABLET & DESKTOP MEDIANO (max-width: 1199px)
   -------------------------------------------------------------------------- */
@media (max-width: 1199px) {
  .hero-v2-title {
    font-size: 1.4rem;
  }
  .main-nav-v2 .nav-link-v2 {
    padding: 8px 10px;
    font-size: 0.78rem;
  }
}

/* --------------------------------------------------------------------------
   MÓVIL & TABLET (max-width: 991px):
   - Oculta el site-header superior (redes/logo duplicado)
   - Oculta todas las pestañas de categorías
   - Muestra SIEMPRE el top bar limpio con Logo a la Izquierda y Botones (Buscar + Menú) a la Derecha
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
  /* Ocultar header superior en móvil */
  .site-header-v2 {
    display: none !important;
  }

  /* Fijar altura de la barra principal en móvil */
  .main-nav-v2,
  .main-nav-v2 .container {
    min-height: 60px !important;
    height: 60px !important;
  }

  /* Ocultar SIEMPRE las pestañas de categorías en móvil */
  .main-nav-v2 .nav-list {
    display: none !important;
  }

  /* Mostrar SIEMPRE Logo/Botones (izquierda) y Fecha (derecha) en móvil */
  .main-nav-v2 .nav-scrolled-left,
  .main-nav-v2 .nav-scrolled-right {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .nav-scrolled-left {
    gap: 10px !important;
  }

  .nav-scrolled-logo-img {
    height: 44px !important;
  }

  .btn-nav-scrolled {
    width: 36px !important;
    height: 36px !important;
    font-size: 1.05rem !important;
  }

  .nav-scrolled-date {
    font-size: 0.75rem !important;
  }

@media (max-width: 576px) {
  .nav-scrolled-date {
    font-size: 0.7rem !important;
  }
}

  .opinion-avatar {
    width: 80px;
    height: 80px;
  }

  .footer-v2-top,
  .footer-v2-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
}

/* --------------------------------------------------------------------------
   MOBILE PEQUEÑO (max-width: 767px)
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .hero-v2-title {
    font-size: 1.25rem;
  }

  .top-stories-widget {
    margin-top: 1.5rem;
  }

  .card-overlay-banner {
    min-height: 260px;
    padding: 1rem;
  }

  .card-overlay-banner .banner-title {
    font-size: 1.15rem;
  }

  .btn-back-top-v2 {
    bottom: 16px;
    right: 16px;
    width: 38px;
    height: 38px;
    font-size: 1rem;
  }
}