/* ================================================================
   M45 AUTOMOTIVE — RESPONSIVE STYLES
   Breakpoints:
     Mobile:  < 768px
     Tablet:  768px – 1024px
     Desktop: > 1024px
================================================================ */

/* ---- TABLET (768px–1024px) ---- */
@media (max-width: 1024px) {

  /* Nav: hide center links, show hamburger */
  .nav__links  { display: none; }
  .nav__right  { display: none; }
  .nav__toggle {
    display: flex;
    grid-column: 3;
    justify-self: end;
    background: var(--c-navy);
    border-radius: 4px;
    height: auto;
  }
  .nav.is-scrolled .nav__toggle { background: transparent; padding: 4px 0; }
  .nav__drawer { display: flex; } /* controlled by JS transform */

  /* Dropdown never shows on tablet/mobile — use drawer instead */
  .nav__dropdown { display: none !important; }

  /* Services: 2-column */
  .services__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Advantage: 2-column + 1 centered */
  .advantage__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Footer: 2-column */
  .footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-md);
  }

  .footer__brand { grid-column: 1 / -1; }

  /* CTA banner: stack */
  .cta-banner__inner {
    flex-direction: column;
    text-align: center;
  }
  .cta-banner h2 { max-width: none; }
  .cta-banner__actions {
    align-items: center;
    width: 100%;
  }

  /* Trust bar: wrap */
  .trust-bar__divider { display: none; }
  .trust-bar__inner {
    justify-content: center;
    gap: 1rem 2rem;
  }

  /* Form row: full width */
  .form-row { grid-template-columns: 1fr; }
}

/* ---- MOBILE (< 768px) ---- */
@media (max-width: 767px) {

  /* Typography scale adjustments */
  h1 { font-size: clamp(2.75rem, 11vw, 4.5rem); }
  h2 { font-size: clamp(2rem, 8vw, 3rem); }

  /* Nav */
  .nav { height: 60px; }
  .nav.is-scrolled { height: 56px; }

  /* Hero */
  .hero { min-height: 92vh; }
  .hero__content { padding-top: 72px; padding-bottom: var(--sp-xl); }
  .hero__ctas { flex-direction: column; align-items: flex-start; }
  .hero__ctas .btn { width: 100%; justify-content: center; }
  .hero__accent { display: none; }

  /* Trust bar */
  .trust-bar__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }
  .trust-bar__divider { display: none; }

  /* Services: single column */
  .services__grid {
    grid-template-columns: 1fr;
  }

  /* Advantage: single column */
  .advantage__grid {
    grid-template-columns: 1fr;
  }

  /* Testimonials */
  .testimonial-card { padding: 0 var(--sp-sm); }
  .testimonial-card__quote::before { display: none; }

  /* CTA banner */
  .cta-banner__actions .btn { width: 100%; justify-content: center; }

  /* Footer: single column */
  .footer__grid {
    grid-template-columns: 1fr;
    gap: var(--sp-md);
  }

  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }

  /* Schedule panel */
  .schedule-panel { width: 100vw; }
  .form-row { grid-template-columns: 1fr; }

  /* Section spacing */
  .section { padding: var(--sp-lg) 0; }

  /* Section header bottom margin */
  .section-header { margin-bottom: var(--sp-md); }

  /* CTA banner */
  .cta-banner { padding: var(--sp-lg) 0; }
  .cta-banner::before { display: none; }
}

/* ---- DESKTOP REFINEMENTS (> 1024px) ---- */
@media (min-width: 1025px) {
  /* Ensure nav drawer is hidden on desktop regardless of JS state */
  .nav__drawer {
    display: none !important;
  }

  .nav__toggle { display: none; }
}

/* Narrower desktop — cap dropdown width and ensure it doesn't clip */
@media (min-width: 1025px) and (max-width: 1260px) {
  .nav__dropdown {
    width: min(720px, calc(100vw - 2rem));
    left: auto;
    right: 0;
    transform: translateY(-8px);
  }
  .nav__dropdown::before {
    left: auto;
    right: 3rem;
    transform: translateX(0) rotate(45deg);
  }
  .nav__item--has-dropdown:hover .nav__dropdown,
  .nav__item--has-dropdown:focus-within .nav__dropdown,
  .nav__item--has-dropdown .nav__dropdown.is-open {
    transform: translateY(0);
  }
}

/* ---- DEALS PAGE ---- */
@media (max-width: 1024px) {
  .deal-tier  { grid-template-columns: 1fr 1fr; }
  .deal-pair  { grid-template-columns: 1fr; }
  .deal-package { flex-direction: column; align-items: flex-start; }
  .deal-package__price { text-align: left; }
  .free-offer { flex-direction: column; }
}

@media (max-width: 767px) {
  .deal-tier  { grid-template-columns: 1fr; }
  .deal-package { padding: var(--sp-sm); }
}

/* ---- CONTACT PAGE ---- */
@media (max-width: 1024px) {
  .contact-grid { grid-template-columns: 1fr; }
  .map-placeholder { aspect-ratio: 16 / 9; }
}

/* ---- LOCATION PAGES ---- */
@media (max-width: 1024px) {
  .location-two-col { grid-template-columns: 1fr; }
  .location-details-grid { grid-template-columns: repeat(2, 1fr); }
  .area-served-grid { grid-template-columns: repeat(2, 1fr); }
  .location-services-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  .location-details-grid { grid-template-columns: 1fr; }
  .area-served-grid { grid-template-columns: 1fr; }
  .location-services-grid { grid-template-columns: 1fr; }
  .location-photo { min-height: 240px; }
  .location-map-wrapper { aspect-ratio: 4 / 3; }
  .location-ctas { flex-direction: column; }
  .location-ctas .btn { width: 100%; justify-content: center; }
}

/* ---- LEGAL PAGES ---- */
@media (max-width: 767px) {
  .legal-content { padding-top: calc(60px + var(--sp-md)); }
}

/* ---- PRINT ---- */
@media print {
  .nav, .schedule-overlay, .schedule-panel, .trust-bar { display: none !important; }
  .hero { min-height: auto; background: #fff !important; }
  .hero__bg, .hero__overlay { display: none; }
  .hero__headline, .hero__sub { color: #000; }
}

/* ---- REDUCED MOTION ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .testimonials__track { transition: none; }
  html { scroll-behavior: auto; }
}