/* ═══════════════════════════════════════════════════════════
   responsive.css — Thailand Rundreisen
   Mobile-First Breakpoints: 480 · 768 · 1024 · 1280 · 1600px
   ═══════════════════════════════════════════════════════════ */

/* ── Mobile Default (< 480px) ── */
.menu-toggle { display: flex; }
.main-nav {
  display: none; position: absolute; top: 70px; left: 0; right: 0;
  background: var(--white); flex-direction: column; padding: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1); gap: 4px;
}
.main-nav.open { display: flex; }
.footer-grid { grid-template-columns: 1fr; gap: 28px; }
.form-row { grid-template-columns: 1fr; }
.related-grid { grid-template-columns: 1fr; }
.newsletter-form { flex-direction: column; }
.social-proof-inner { gap: 24px; }
.hero-content { padding: 56px 20px; }
.section { padding: 48px 0; }
.footer-bottom { flex-direction: column; text-align: center; }
.back-to-top { bottom: 16px; right: 16px; }

/* ── 480px ── */
@media (min-width: 480px) {
  .card-grid { grid-template-columns: 1fr; }
  .related-grid { grid-template-columns: 1fr 1fr; }
}

/* ── 768px ── */
@media (min-width: 768px) {
  .menu-toggle { display: none; }
  .main-nav { display: flex; flex-direction: row; position: static; box-shadow: none; padding: 0; }
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .form-row { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .related-grid { grid-template-columns: repeat(3, 1fr); }
  .newsletter-form { flex-direction: row; }
  .hero-content { padding: 80px 40px; }
  .section { padding: 64px 0; }
}

/* ── 1024px ── */
@media (min-width: 1024px) {
  .card-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; }
  .footer-bottom { flex-direction: row; }
  .section { padding: 72px 0; }
}

/* ── 1280px ── */
@media (min-width: 1280px) {
  .card-grid { grid-template-columns: repeat(4, 1fr); }
  .hero-content { padding: 100px 0; }
}

/* ── 1600px ── */
@media (min-width: 1600px) {
  :root { --max-width: 1400px; }
}

/* ── Print ── */
@media print {
  .site-header, .site-footer, .back-to-top, .cookie-banner, .menu-toggle { display: none !important; }
  body { background: white; color: black; }
  a { color: black; text-decoration: underline; }
  .hero { min-height: auto; background: none; }
  .hero-content { color: black; }
}
