/* ==========================================================================
   Seashore Medical & Industrial Waste Factory
   responsive.css — breakpoint refinements (desktop-first overrides)
   Targets: 1920 / 1440 / 1366 / 1024 / 768 / 480 / 360
   ========================================================================== */

/* ---- Large desktops ---- */
@media (min-width: 1920px) {
  .smw-hero {
    min-height: min(82vh, 920px);
  }
}

/* ---- Small desktops / laptops ---- */
@media (max-width: 1440px) {
  .smw-navbar {
    gap: 1rem;
  }
  .smw-nav__link {
    padding-inline: 0.6rem;
    font-size: 0.92rem;
  }
  .smw-nav__cta {
    padding: 0.72rem 1.2rem;
    font-size: 0.88rem;
  }
  .smw-brand__logo {
    height: 40px;
  }
}

@media (max-width: 1340px) {
  .smw-nav {
    gap: 0;
  }
  .smw-nav__link {
    padding-inline: 0.5rem;
    font-size: 0.88rem;
  }
  .smw-brand__logo {
    height: 38px;
  }
}

/* ---- Below desktop nav: burger navigation ---- */
@media (max-width: 1199.98px) {
  .smw-nav,
  .smw-nav__cta--desktop {
    display: none;
  }
  .smw-burger {
    display: inline-flex;
  }
  .smw-topbar__contact span.smw-topbar__hide-sm {
    display: none;
  }
}

/* ---- Tablets (≤1024) ---- */
@media (max-width: 1024px) {
  :root {
    --smw-nav-h: 76px;
    --smw-nav-h-scrolled: 66px;
  }

  .smw-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .smw-grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }

  .smw-process {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 2.5rem;
  }

  .smw-process::before,
  .smw-process::after {
    display: none;
  }

  .smw-gallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .smw-cta__inner {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  .smw-footer__main {
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
  }

  .smw-service-detail__aside {
    position: static;
  }
}

/* ---- Tablet portrait / large phones (≤900) ---- */
@media (max-width: 900px) {
  .smw-split,
  .smw-split--reverse {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .smw-split--reverse .smw-split__media {
    order: 0;
  }

  .smw-split__media {
    max-width: 640px;
  }

  .smw-split__media::before,
  .smw-split--reverse .smw-split__media::before {
    inset: 14px -12px -12px 14px;
  }

  .smw-service-detail {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  .smw-contact-layout {
    grid-template-columns: 1fr;
  }

  .smw-group-band__inner {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .smw-group-band__actions {
    grid-column: 1 / -1;
  }
}

/* ---- Phones (≤768) ---- */
@media (max-width: 768px) {
  :root {
    --smw-section: clamp(3.5rem, 10vw, 5rem);
    --smw-topbar-h: 38px;
  }

  .smw-topbar__group {
    display: none;
  }

  .smw-topbar__contact {
    justify-content: center;
    width: 100%;
    gap: 1.1rem;
  }

  .smw-hero {
    min-height: 0;
    padding-top: clamp(4rem, 14vw, 5.5rem);
  }

  .smw-hero__actions .smw-btn {
    flex: 1 1 auto;
    justify-content: center;
    min-width: 200px;
  }

  .smw-process {
    grid-template-columns: 1fr;
    gap: 0;
    padding-left: 0.5rem;
  }

  .smw-process__step {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    column-gap: 1.4rem;
    text-align: left;
    align-items: flex-start;
    padding-bottom: 2rem;
    position: relative;
  }

  .smw-process__step::before {
    content: "";
    position: absolute;
    left: 43px;
    top: 88px;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg, var(--smw-emerald) 0%, var(--smw-line-strong) 100%);
  }

  .smw-process__step:last-child::before {
    display: none;
  }

  .smw-process__step h3 {
    margin-top: 0.65rem;
  }

  .smw-process__badge {
    margin-bottom: 0;
  }

  .smw-grid--2,
  .smw-grid--3 {
    grid-template-columns: 1fr;
  }

  .smw-checklist--2col {
    grid-template-columns: 1fr;
  }

  .smw-points {
    grid-template-columns: 1fr;
  }

  .smw-form {
    grid-template-columns: 1fr;
  }

  .smw-field--half {
    grid-column: auto;
  }

  .smw-media-badge {
    left: 1rem;
    bottom: 1rem;
    padding: 0.85rem 1rem;
  }

  .smw-footer__bottom {
    flex-direction: column;
    text-align: center;
    justify-content: center;
  }

  .smw-footer__legal {
    justify-content: center;
  }

  .smw-cta__actions .smw-btn {
    flex: 1 1 auto;
    justify-content: center;
  }
}

/* ---- Small phones (≤480) ---- */
@media (max-width: 480px) {
  :root {
    --smw-gutter: 1.1rem;
  }

  .smw-brand__logo {
    height: 34px;
  }

  .smw-hero__trust {
    gap: 0.5rem;
  }

  .smw-hero__trust li {
    font-size: 0.78rem;
    padding: 0.42rem 0.85rem;
  }

  .smw-grid--4 {
    grid-template-columns: 1fr;
  }

  .smw-gallery {
    grid-template-columns: 1fr;
  }

  .smw-filters {
    gap: 0.45rem;
  }

  .smw-filters__btn {
    padding: 0.5rem 1rem;
    font-size: 0.84rem;
  }

  .smw-footer__main {
    grid-template-columns: 1fr;
    gap: 2.25rem;
  }

  .smw-group-band__inner {
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }

  .smw-benefit {
    flex-direction: column;
    gap: 0.9rem;
  }
}

/* ---- Very small phones (≤360) ---- */
@media (max-width: 360px) {
  .smw-btn {
    padding: 0.85rem 1.3rem;
    font-size: 0.92rem;
    width: 100%;
  }

  .smw-hero__label {
    font-size: 0.68rem;
    letter-spacing: 0.1em;
  }

  .smw-process__step {
    grid-template-columns: 68px minmax(0, 1fr);
    column-gap: 1rem;
  }

  .smw-process__badge {
    width: 68px;
    height: 68px;
    font-size: 1.5rem;
  }

  .smw-process__step::before {
    left: 33px;
    top: 68px;
  }
}

/* ---- Touch targets ---- */
@media (pointer: coarse) {
  .smw-nav__link,
  .smw-btn,
  .smw-filters__btn,
  .smw-mobile-nav__link {
    min-height: 44px;
  }
}

/* ---- Contact panel + map on small screens ---- */
@media (max-width: 720px) {
  .smw-reach__grid {
    grid-template-columns: 1fr;
  }
  .smw-map__actions {
    flex-direction: column;
    align-items: stretch;
  }
  .smw-map__actions .smw-btn {
    justify-content: center;
  }
}

/* ---- Permits & certifications grids ---- */
@media (max-width: 1024px) {
  .smw-cred-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .smw-cred-grid--2,
  .smw-cred-grid--3 { grid-template-columns: 1fr; }
  .smw-cred__meta > div { grid-template-columns: 1fr; gap: 0.15rem; }
}