/* --- Full Responsiveness --- */

/* 1440px / 1280px */
@media (max-width: 1440px) {
  .hero-content h1 { font-size: 3.2rem; }
}

@media (max-width: 1280px) {
  .grid-2 { gap: 40px; }
  .hero-content h1 { font-size: 2.8rem; }
}

/* 1024px (Laptop) */
@media (max-width: 1024px) {
  .section { padding: 80px 0; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  
  .hero-content h1 { font-size: 2.5rem; }
  .hero-price { font-size: 2.5rem; }
}

/* 768px (Tablet) */
@media (max-width: 768px) {
  .mobile-toggle { display: block; }
  .header-cta { display: none; }
  
  .nav-menu {
    position: absolute; top: 100%; left: 0; width: 100%;
    background: var(--bg-color); flex-direction: column;
    text-align: center; gap: 0; box-shadow: var(--shadow);
    display: none; border-top: 1px solid var(--border);
  }
  .nav-menu.active { display: flex; }
  .nav-menu a { display: block; padding: 20px; border-bottom: 1px solid var(--border); }
  
  .grid-2 { grid-template-columns: 1fr; text-align: center; }
  .grid-3 { grid-template-columns: 1fr; }
  
  .hero { text-align: center; padding: 60px 0; }
  .hero-rating, .hero-buttons, .hero-desc { justify-content: center; margin-left: auto; margin-right: auto; }
  .trust-badge { position: relative; bottom: 0; left: 0; margin-top: 20px; justify-content: center; }
  
  .split-section.reverse .grid-2 > div:first-child { order: 2; }
  .split-section.reverse .grid-2 > div:last-child { order: 1; }
  
  .footer .grid-3 { grid-template-columns: 1fr; text-align: center; }
  .cookie-inner { flex-direction: column; text-align: center; }
}

/* 480px (Mobile) */
@media (max-width: 480px) {
  .section { padding: 60px 0; }
  .section-title { font-size: 2.2rem; }
  .hero-content h1 { font-size: 2.2rem; }
  .hero-buttons { flex-direction: column; }
  .btn { width: 100%; }
  
  .comparison-row { flex-direction: column; text-align: center; padding: 30px 0; gap: 15px; }
  .comp-label { margin-bottom: 10px; font-size: 1.1rem; }
  
  .expert-card { flex-direction: column; text-align: center; align-items: center; }
  .cookie-actions { flex-direction: column; width: 100%; }
  .cookie-actions .btn { width: 100%; }
}

/* 375px / 320px (Small Mobile) */
@media (max-width: 375px) {
  .hero-content h1 { font-size: 2rem; }
  .section-title { font-size: 1.8rem; }
  .card { padding: 30px 20px; }
  .hero-price { font-size: 2rem; }
}