/* =====================================================================
   GEN-WORK · responsive.css
   Mobile-first overrides keyed off design-spec breakpoints.
   sm 480 · md 768 · lg 1024 · xl 1280
   ===================================================================== */

/* >= 480 */
@media (min-width: 480px) {
  .form__row { grid-template-columns: 1fr 1fr; }
  .gallery   { grid-template-columns: repeat(2, 1fr); }
}

/* >= 768  (tablet) */
@media (min-width: 768px) {
  .container { padding-inline: var(--container-pad-tablet); }
  section.section { padding-block: var(--section-py-tablet); }
  .contact { padding-block: var(--section-py-tablet); }

  .stats__grid     { grid-template-columns: repeat(4, 1fr); }
  .stat:not(:last-child) { border-inline-end: 1px solid var(--color-gold-muted); }

  .brands__grid    { grid-template-columns: repeat(3, 1fr); }
  .svc-grid        { grid-template-columns: repeat(2, 1fr); }
  .gallery         { grid-template-columns: repeat(3, 1fr); }
  .values-grid     { grid-template-columns: repeat(3, 1fr); }

  .cta-banner__inner {
    flex-direction: row; text-align: left;
    justify-content: space-between;
  }

  .site-footer__grid {
    grid-template-columns: auto 1fr auto;
    text-align: left; justify-items: stretch;
  }
  .site-footer__contact { justify-content: flex-start; }

  .about-grid { grid-template-columns: 1fr 1fr; gap: var(--sp-12); }
  .detail-intro { grid-template-columns: 1.1fr 1fr; align-items: center; gap: var(--sp-12); }
}

/* >= 1024 (desktop) */
@media (min-width: 1024px) {
  .container { padding-inline: var(--container-pad-desktop); }
  section.section { padding-block: var(--section-py-desktop); }
  .contact { padding-block: var(--section-py-desktop); }

  .site-header__menu { display: none; }
  .site-nav { display: block; }

  .svc-grid     { grid-template-columns: repeat(3, 1fr); }
  .brands__grid { grid-template-columns: repeat(6, 1fr); }
  .gallery      { grid-template-columns: repeat(4, 1fr); }

  .contact__grid {
    grid-template-columns: 360px 1fr;
    gap: var(--sp-12);
  }
  .contact-card { position: sticky; top: 96px; }
}

/* >= 1280 */
@media (min-width: 1280px) {
  .hero__title { font-size: clamp(var(--fs-48), 5.2vw, var(--fs-72)); }
}

/* Phone-only tweaks */
@media (max-width: 767px) {
  .hero__signature { display: none; }
}