/* ===========================================
   Template - Responsive
   =========================================== */

@media (max-width: 1024px) {
  .hero-text h1 { font-size: 2.4rem; }
  .hero-grid { gap: 36px; }
  .card-row { grid-template-columns: repeat(2, 1fr); }
  .dual-cols { gap: 24px; }
  .col-media { flex: 0 0 260px; }
}

@media (max-width: 768px) {
  .topbar-nav {
    position: fixed; inset: 0;
    background: rgba(10, 22, 40, 0.97);
    flex-direction: column; justify-content: center; align-items: center;
    gap: 0; padding: 32px;
    backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    z-index: 999;
    opacity: 0; pointer-events: none; transition: opacity .3s;
  }
  .topbar-nav.open { opacity: 1; pointer-events: all; }

  .topbar-nav a {
    padding: 16px 0; font-size: 1.2rem; font-weight: 600;
    color: var(--tx); text-align: center;
    width: 100%; max-width: 260px;
    border-bottom: 1px solid rgba(255,255,255,.04);
    opacity: 0; transform: translateY(12px);
    transition: opacity .25s, transform .25s, color .2s;
  }
  .topbar-nav a:last-child { border-bottom: none; }
  .topbar-nav a:hover { color: var(--c1); }
  .topbar-nav.open a { opacity: 1; transform: translateY(0); }
  .topbar-nav.open a:nth-child(1) { transition-delay: .03s; }
  .topbar-nav.open a:nth-child(2) { transition-delay: .06s; }
  .topbar-nav.open a:nth-child(3) { transition-delay: .09s; }
  .topbar-nav.open a:nth-child(4) { transition-delay: .12s; }
  .topbar-nav.open a:nth-child(5) { transition-delay: .15s; }

  .topbar-nav .nav-action {
    margin-top: 20px; width: 100%; max-width: 260px;
    text-align: center; padding: 13px 20px; font-size: 0.95rem;
  }

  .menu-btn { display: block; }
  body.nav-open { overflow: hidden; }

  .hero-grid { grid-template-columns: 1fr; text-align: center; }
  .hero-text > p { margin: 0 auto 22px; }
  .hero-text h1 { font-size: 2rem; }
  .hero-meta { justify-content: center; }
  .hero-actions { justify-content: center; }
  .hero-visual img { max-width: 100%; }

  .content-block { padding: 44px 0; }
  .content-block h2 { font-size: 1.5rem; }
  .content-block h3 { font-size: 1.1rem; }

  .dual-cols, .dual-cols.flipped { flex-direction: column; }
  .col-media { flex: none; width: 100%; max-width: 360px; margin: 0 auto; }

  .tile-grid { grid-template-columns: 1fr; }
  .card-row { grid-template-columns: 1fr; }
  .verdict-grid { grid-template-columns: 1fr; }
  .action-bar { flex-direction: column; text-align: center; padding: 20px; }

  .promo-strip h3 { font-size: 1.4rem; }
  .closing-cta h2 { font-size: 1.7rem; }
}

@media (max-width: 480px) {
  .hero-text h1 { font-size: 1.6rem; }
  .hero-text > p { font-size: 0.92rem; }
  .btn-main { padding: 11px 22px; font-size: 0.85rem; }
  .btn-ghost { padding: 11px 18px; font-size: 0.85rem; }
  .content-block h2 { font-size: 1.3rem; }
  .note-block, .highlight-box { padding: 16px; }
  .action-bar { padding: 16px; }
  .promo-strip { padding: 36px 18px; }
  .promo-strip h3 { font-size: 1.2rem; }
  .accordion-item summary { padding: 13px 16px; font-size: 0.88rem; }
}