/* Cross-cutting responsive rules — variable overrides, body-level, section spacing */

/* Mobile (< 768px) */
@media (max-width: 767px) {
  :root {
    --font-hero-title: 1.6rem;
    --font-section-title: 1.3rem;
  }

  /* ── Touch Targets (44px minimum) ── */

  /* Navigation links (inside mobile menu) */
  .navbar__links .nav-link {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  /* Login button */
  .btn-login {
    min-height: 44px;
    padding: 0.6rem 1.3rem;
  }

  /* Gold CTA buttons */
  .btn-gold {
    min-height: 44px;
    padding: 0.65rem 1.6rem;
  }

  /* Generic .btn */
  .btn {
    min-height: 44px;
  }

  /* Package filter pills */
  .pkg-filter {
    min-height: 44px;
    padding: 0.55rem 1.1rem;
  }

  /* Contact form inputs and textarea */
  .form-row input,
  .form-row textarea {
    min-height: 44px;
    padding: 0.7rem 0.9rem;
  }

  /* Contact form (component variant) */
  .form-field__input {
    min-height: 44px;
    padding: 0.7rem 0.9rem;
  }

  /* Contact submit button */
  .contact__submit {
    min-height: 44px;
    padding: 0.7rem 2.5rem;
  }

  /* Search box button (main.css variant) */
  .search-box__btn {
    min-height: 44px;
    padding: 0.7rem 1rem;
  }

  /* Search field inputs */
  .search-field input,
  .search-field select,
  .search-field__input {
    min-height: 44px;
    padding: 0.7rem 0.8rem;
  }

  /* Package card buttons */
  .pkg-card__btn {
    min-height: 44px;
    padding: 0.55rem 1rem;
  }

  /* Package search input */
  .pkg-search input {
    min-height: 44px;
  }

  /* Filter checkbox labels */
  .pkg-filter-check {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  /* Footer social links */
  .footer__social a {
    min-width: 44px;
    min-height: 44px;
  }

  /* Top bar social links */
  .topbar__social a {
    min-width: 44px;
    min-height: 44px;
  }
}

/* ── Mobile Spacing & Typography ── */
@media (max-width: 767px) {
  /* Slightly smaller body font for mobile readability */
  body {
    font-size: 0.9rem;
  }

  /* Reduce section vertical padding */
  .section {
    padding: 3rem 0;
  }

  /* Tighter container side padding on small screens */
  .container {
    padding: 0 1rem;
  }

  /* Section head spacing */
  .section__head {
    margin-bottom: 1.75rem;
  }

  /* Contact section */
  .contact {
    padding: 3rem 0;
  }

  /* Footer padding */
  .footer {
    padding: 2rem 0 0;
  }

  .footer__inner {
    gap: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
