/* ===== RESPONSIVE ===== */

@media (max-width: 1100px) {
  .cards-grid { grid-template-columns: repeat(2, 1fr); }
  .cards-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .stats-bar__inner { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}

@media (max-width: 900px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__image { display: none; }
  .hero__content { padding: 60px 0; }
  .content-with-sidebar { grid-template-columns: 1fr; }
  .sidebar { order: -1; }
  .article-featured { grid-template-columns: 1fr; }
  .article-featured__image { min-height: 240px; }
  .contact-grid { grid-template-columns: 1fr; gap: 32px; }
  .about-intro { grid-template-columns: 1fr; gap: 36px; }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .about-values { grid-template-columns: repeat(2, 1fr); }
  .newsletter-strip__inner { flex-direction: column; gap: 24px; }
  .newsletter-form { width: 100%; }
  .newsletter-form input { flex: 1; }
}

@media (max-width: 768px) {
  .site-nav { display: none; }
  .site-nav.open { 
    display: flex; 
    flex-direction: column; 
    position: absolute; 
    top: 100%; 
    left: 0; 
    right: 0; 
    background: var(--color-card); 
    padding: 16px 24px;
    border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-md);
    z-index: 99;
    align-items: flex-start;
  }
  .site-nav.open .site-nav__link { width: 100%; padding: 10px 0; border-radius: 0; }
  .menu-toggle { display: flex; }
  .site-header { position: relative; }
  .cards-grid { grid-template-columns: 1fr; }
  .cards-grid--2 { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .about-values { grid-template-columns: 1fr; }
  .top-bar-inner { flex-direction: column; gap: 6px; text-align: center; }
  .stats-bar__inner { grid-template-columns: repeat(2, 1fr); }
  .footer-bottom { flex-direction: column; text-align: center; }
  .header-logo__tagline { display: none; }
  .section { padding: 40px 0; }
  .section--lg { padding: 56px 0; }
  .policy-page__title { font-size: 28px; }
  .article-single__title { font-size: 26px; }
  .article-single__image { height: 240px; }
}

@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .hero__content { padding: 44px 0; }
  .hero__title { font-size: 26px; }
  .article-single__body { font-size: 15px; }
  .newsletter-form { flex-direction: column; }
  .newsletter-form input { width: 100%; }
  .pagination { flex-wrap: wrap; }
}
