@media (max-width: 1024px) {
  :root { --section-padding: 70px; }
  .display-xl { font-size: 2rem; }
  .display-lg { font-size: 1.5rem; }
  .display-md { font-size: 1.25rem; }
  .benefits-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
  .pricing-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
  .pricing-card.popular { transform: none; }
  .pricing-card.popular:hover { transform: translateY(-8px); }
}

@media (max-width: 900px) {
  .nav { display: none !important; }
  .mobile-menu-btn { display: flex !important; }
  .header { background: rgba(255,255,255,.96); }
  .logo { font-size: 1.375rem; }
}

@media (max-width: 768px) { .hero::after { background-size: 120% auto; background-position: center center; opacity: .06; } }
@media (max-width: 640px) { .hero::after { background-size: 150% auto; background-position: center top; } }

@media (max-width: 480px) {
  :root { --section-padding: 60px; --container-padding: 16px; }
  .hero { text-align: center; padding: 120px 0 60px; min-height: 100vh; }
  .display-xl { font-size: 1.75rem; }
  .text-xl { font-size: .875rem; }
  .display-md { font-size: 1.25rem; }
  .benefits-grid { grid-template-columns: 1fr; gap: 1.75rem; }
  .benefit-card { padding: 1.75rem 1.5rem; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .pricing-card { margin: 0 1rem; padding: 1rem .75rem; }
  .pricing-grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .pricing-card.popular { transform: none; }
  .pricing-card.popular:hover { transform: translateY(-8px); }
  .price { font-size: 1.125rem; }
  .back-to-top { bottom: 1.5rem; right: 1.5rem; width: 45px; height: 45px; }
  .promo-notification { bottom: 1.5rem; left: 1.5rem; max-width: 250px; padding: .875rem 1.25rem; }
  .promo-notification .promo-title { font-size: .875rem; }
  .promo-notification .promo-text { font-size: .75rem; }
}

@media (max-width: 360px) {
  :root { --container-padding: 12px; }
  .display-xl { font-size: 1.5rem; }
  .display-md { font-size: 1.125rem; }
  .stat-number { font-size: 2rem; }
  .stats-grid { grid-template-columns: 1fr; gap: 1.25rem; }
  .pricing-card { margin: 0 .5rem; padding: .875rem .625rem; }
  .price { font-size: 1.25rem; }
  .hero-cta { padding: .875rem 1.5rem; font-size: .875rem; }
  .back-to-top { bottom: 1rem; right: 1rem; width: 40px; height: 40px; font-size: 1rem; }
  .promo-notification { bottom: 1rem; left: 1rem; max-width: 220px; padding: .75rem 1rem; }
  .promo-notification .promo-title { font-size: .8125rem; }
  .promo-notification .promo-text { font-size: .6875rem; }
  .promo-notification .promo-icon { font-size: 1.25rem; }
  .hero::after { background-size: 180% auto; background-position: center 20%; opacity: .1; }
  .promo-modal { width: 95%; padding: 2rem 1.5rem; }
  .promo-modal-title { font-size: 1.25rem; }
  .promo-modal-subtitle { font-size: .9375rem; }
  .promo-modal-benefits li { font-size: .875rem; }
  .promo-modal-cta { font-size: .9375rem; padding: .875rem 1.5rem; }
}
