/* =====================================================
   IL CORRIERE DIGITALE — Responsive Stylesheet
   ===================================================== */

/* ─── DESKTOP (992–1199px) ───────────────────────────── */
@media (max-width: 1199px) {
  :root {
    --sidebar-width: 280px;
  }

  .hero-card__title { font-size: 26px; }
  .hero-card--secondary .hero-card__title { font-size: 18px; }

  .editors-grid { grid-template-columns: repeat(3, 1fr); }

  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 32px; }

  .team-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ─── TABLET (768–991px) ─────────────────────────────── */
@media (max-width: 991px) {
  :root {
    --header-height: 64px;
    --sidebar-width: 100%;
  }

  .primary-nav { display: none; }
  .mobile-menu-btn { display: flex; }

  .hero-grid {
    grid-template-columns: 1fr;
    height: auto;
  }
  .hero-card--primary { height: 380px; }
  .hero-secondary {
    flex-direction: row;
    height: 220px;
  }
  .hero-secondary .hero-card { flex: 1; }

  .news-grid {
    grid-template-columns: 1fr;
  }
  .sidebar {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }

  .editors-grid { grid-template-columns: repeat(2, 1fr); }

  .opinion-grid { grid-template-columns: 1fr 1fr; }
  .opinion-grid .opinion-card:last-child { display: none; }

  .newsletter-banner__inner {
    flex-direction: column;
    gap: 32px;
    text-align: center;
  }
  .newsletter-form__input { width: 260px; }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  .footer-grid > *:first-child { grid-column: span 2; }

  .mission-grid { grid-template-columns: 1fr; gap: 40px; }
  .mission-photo { min-height: 300px; }

  .team-grid { grid-template-columns: repeat(3, 1fr); }

  .contact-grid { grid-template-columns: 1fr; gap: 48px; }

  .related-grid { grid-template-columns: repeat(2, 1fr); }
  .related-grid .article-card-grid:last-child { display: none; }

  .cat-featured { grid-template-columns: 1fr; }
  .cat-featured__thumb { aspect-ratio: 16/9; }

  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 180px);
  }
  .gallery-item:nth-child(1),
  .gallery-item:nth-child(4) { grid-row: span 1; }
  .gallery-item:nth-child(1) { grid-column: span 2; }
}

/* ─── MOBILE LARGE (576–767px) ───────────────────────── */
@media (max-width: 767px) {
  .hero-secondary {
    flex-direction: column;
    height: auto;
  }
  .hero-secondary .hero-card { height: 200px; }

  .article-card {
    grid-template-columns: 1fr;
  }
  .article-card__thumb {
    height: 200px;
    width: 100%;
  }

  .opinion-grid { grid-template-columns: 1fr; }
  .opinion-grid .opinion-card:last-child { display: block; }

  .sidebar {
    grid-template-columns: 1fr;
  }

  .team-grid { grid-template-columns: repeat(2, 1fr); }

  .article-headline { font-size: 30px; }
  .article-subtitle { font-size: 17px; }

  .article-body p { font-size: 16px; }
  .article-body h2 { font-size: 22px; }
  .pull-quote p { font-size: 21px !important; }
  .stat-callout__number { font-size: 40px; }

  .related-grid { grid-template-columns: 1fr; }
  .related-grid .article-card-grid:last-child { display: flex; }

  .comment-form__row { grid-template-columns: 1fr; }

  .author-bio-box { flex-direction: column; align-items: center; text-align: center; }

  .footer-grid { grid-template-columns: 1fr; }
  .footer-grid > *:first-child { grid-column: span 1; }

  .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }

  .search-hero { padding: 36px 0; }
  .search-results-query { font-size: 18px; }

  .gallery-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .gallery-item,
  .gallery-item:nth-child(1),
  .gallery-item:nth-child(4) {
    grid-row: span 1;
    grid-column: span 1;
    height: 200px;
  }
}

/* ─── MOBILE (< 576px) ───────────────────────────────── */
@media (max-width: 575px) {
  :root {
    --ticker-height: 36px;
    --header-height: 56px;
    --ribbon-height: 40px;
  }

  .container { padding: 0 16px; }
  .container--narrow { padding: 0 16px; }

  .site-logo { font-size: 17px; }

  .ticker-bar__date { display: none; }

  .hero-card--primary { height: 320px; }
  .hero-card__title { font-size: 22px; }
  .hero-card--secondary .hero-card__title { font-size: 16px; }

  .hero-section { padding: 16px 0; }

  .news-section { padding: 36px 0; }
  .editors-section { padding: 40px 0; }
  .editors-grid { grid-template-columns: 1fr; }

  .opinion-section { padding: 36px 0; }
  .gallery-section { padding: 36px 0; }

  .newsletter-banner { padding: 36px 0; }
  .newsletter-banner__heading { font-size: 22px; }
  .newsletter-form { flex-direction: column; }
  .newsletter-form__input { width: 100%; }

  .category-hero { padding: 32px 0; }
  .category-hero__name { font-size: 28px; }

  .page-hero { padding: 40px 0; }
  .page-hero__title { font-size: 28px; }
  .page-hero__subtitle { font-size: 15px; }

  .legal-hero__title { font-size: 26px; }
  .legal-content { padding: 40px 16px; }

  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .team-card__photo-wrap { width: 120px; height: 120px; }

  .article-header-block { padding: 32px 0 24px; }
  .article-headline { font-size: 26px; }
  .article-subtitle { font-size: 16px; }

  .comment-section-heading { font-size: 11px; }

  .pagination { gap: 4px; }
  .page-btn { width: 36px; height: 36px; font-size: 13px; }

  .search-main-input { font-size: 16px; height: 48px; }

  .contact-section { padding: 48px 0; }
  .mission-section { padding: 48px 0; }
  .team-section { padding: 48px 0; }

  .cat-featured__body { padding: 20px; }
  .cat-featured__title { font-size: 20px; }

  .editors-grid { grid-template-columns: 1fr; }

  .section-heading { margin-bottom: 24px; }
  .gallery-section__header { flex-direction: column; align-items: flex-start; gap: 12px; }

  .site-footer__top { padding: 40px 0 32px; }
}

/* ─── PRINT ──────────────────────────────────────────── */
@media print {
  .ticker-bar,
  .site-header,
  .category-ribbon,
  .filter-bar,
  .sidebar,
  .newsletter-banner,
  .site-footer,
  .scroll-top,
  .share-row,
  .comment-section,
  #reading-progress { display: none !important; }

  body { font-size: 12pt; color: #000; }
  .article-headline { font-size: 24pt; }
  .article-body p { font-size: 12pt; line-height: 1.6; }
  a { color: #000; text-decoration: underline; }
}