*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #0B0D0F; }
img { max-width: 100%; }
a { color: #F2F0EC; }
a:hover { color: #CDB68A; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #D9C29A; outline-offset: 3px;
}
figure img, a img { transition: transform .6s ease; }
figure:hover img, a:hover img { transform: scale(1.03); }

/* projects filter */
.filter {
  min-height: 44px; padding: 0 20px; border-radius: 2px; font: inherit; font-size: 13px;
  letter-spacing: .1em; text-transform: uppercase; cursor: pointer;
  background: transparent; color: #F2F0EC; border: 1px solid #3A4249;
}
.filter[aria-pressed="true"] { background: #D9C29A; color: #0B0D0F; border-color: #D9C29A; font-weight: 600; }
.proj[hidden] { display: none; }

/* quote form */
#quote-form button[disabled] { opacity: .6; cursor: wait; }
#form-status.error { color: #F2A7A7; }

/* call bar above the header */
.callbar:hover { color: #0B0D0F; filter: brightness(1.06); }

/* ---------- phones ---------- */
@media (max-width: 700px) {
  /* header: logo + Free Quote on one row, menu as one scrolling row underneath */
  .hdr { padding: 10px 16px !important; gap: 8px !important; flex-wrap: wrap !important; }
  .hdr-logo img { height: 38px !important; }
  .hdr-cta { order: 2; gap: 10px !important; }
  .hdr-phone { display: none !important; }
  .hdr-cta a:last-child { min-height: 40px !important; padding: 0 16px !important; font-size: 13px !important; }
  /* menu: all five links visible, two centred rows */
  .hdr-nav {
    order: 3; width: calc(100% + 32px); margin: 0 -16px; padding: 4px 12px;
    flex-wrap: wrap !important; justify-content: center; gap: 0 18px !important;
    font-size: 12px !important; letter-spacing: 0.05em !important;
    border-top: 1px solid #262C31;
  }
  .hdr-nav a { white-space: nowrap; padding: 9px 0 !important; }

  #g-reviews blockquote { font-size: 20px !important; }
  #g-reviews figure { padding: 22px !important; }

  /* call bar: shorter text on phones */
  .callbar { font-size: 15px !important; }
  .callbar-extra { display: none; }

  /* hero: shorter, smaller text */
  #top { min-height: 560px !important; }
  #top h1 { font-size: 40px !important; }
  #top p { font-size: 16px !important; }
  #top a { min-height: 48px !important; padding: 0 22px !important; font-size: 15px !important; }

  /* stats: 2 x 2 instead of one per row */
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px 16px !important; padding: 24px 16px !important; }
  .stat-num { font-size: 32px !important; }
  .stats > div > span:not(.stat-num) { font-size: 11px !important; letter-spacing: 0.1em !important; }

  /* less empty space between sections */
  #showers { padding-top: 64px !important; gap: 44px !important; }
  #services { padding-top: 40px !important; padding-bottom: 64px !important; }
  #work, #reviews > div, #quote > div { padding-top: 64px !important; padding-bottom: 64px !important; }

  /* section headings a bit smaller */
  section h2 { font-size: 34px !important; }
  section h3 { font-size: 26px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  figure img, a img { transition: none; }
}