/* ============================================================
   Hoffmedia — Mobile polish (shared across all pages)
   Loaded after each page's inline <style> so it can override.
   ============================================================ */

/* Prevent iOS rotation-triggered text resize */
html { -webkit-text-size-adjust: 100%; }

/* Kill default tap-flash; rely on :active states for feedback */
html, body, a, button { -webkit-tap-highlight-color: transparent; }

/* Faster taps; prevents browser-level double-tap zoom on buttons */
button, a, .btn, [role="button"] { touch-action: manipulation; }

/* Generic active-state feedback so every tap registers visually */
.btn:active,
button:active:not(:disabled) { transform: translateY(1px) scale(0.985); transition: transform 0.05s ease; }

/* Forms: 16px minimum font-size on mobile so iOS does not zoom on focus.
   !important is appropriate here — this is a hard accessibility floor. */
@media (max-width: 768px) {
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="search"],
  input[type="url"],
  input[type="password"],
  input[type="date"],
  textarea,
  select {
    font-size: 16px !important;
  }
}

/* Touch target minimums — every tappable element ≥ 44px */
@media (max-width: 768px) {
  /* Header */
  .nav__burger { width: 48px; height: 48px; }
  .nav__logo { min-height: 44px; display: inline-flex; align-items: center; padding: 0.4rem 0; }

  /* Footer link columns — block-level flex on the <a> keeps links stacked
     while ensuring 44px tap area. Footer markup uses <a> direct children. */
  .foot__col a { display: flex; align-items: center; min-height: 44px; line-height: 1.2; }
  .foot__col h5 { margin-top: 0.5rem; }
  .foot__brand-logo { min-height: 44px; display: inline-flex; align-items: center; }
  .foot__brand a,
  .foot__contact a { min-height: 44px; display: flex; align-items: center; }

  /* Mobile nav sheet links and footer */
  .nav__sheet a,
  .nav__sheet-foot a { min-height: 44px; display: flex; align-items: center; }

  /* Inline contact info on CTA / contact bands */
  .cta__contact a,
  .hbar__methods a,
  .contact__methods a { min-height: 44px; display: inline-flex; align-items: center; padding: 0 0.25rem; }

  /* Service-page jump pills */
  .phero__jump { min-height: 44px; padding: 0.7rem 1.1rem; display: inline-flex; align-items: center; }

  /* Portfolio filter chips */
  .work__filter { min-height: 44px; padding: 0.7rem 1.1rem; }

  /* Featured service card CTA + Send the Brief */
  .svc-feature__cta { padding: 0.6rem 0; min-height: 44px; align-items: center; }
  .brief__strip button[type="submit"] { min-height: 48px; }
}

/* Hover affordances should not stick on touch devices */
@media (hover: none) {
  .svc-list__item:hover { padding-left: 0.5rem; background: transparent; }
  .svc-list__item:hover .svc-list__arrow { color: var(--text-faint); transform: none; }
  .work__card:hover { transform: none; }
  .work__card:hover .work__thumb img,
  .work__card:hover .work__thumb video,
  .work__card:hover .work__thumb iframe { transform: translate(-50%, -50%); }
  .svc-feature:hover { transform: none; }
  .svc-feature:hover .svc-feature__bg img,
  .svc-feature:hover .svc-feature__bg video { transform: none; }
  .tcard:hover { transform: none; }
  .btn:hover { transform: none; box-shadow: none; }
}

/* Hero / full-bleed sections: dvh prevents Safari URL-bar overlap */
@supports (height: 100dvh) {
  .hero { min-height: min(88dvh, 920px); }
}
@supports (height: 100dvh) and (max-width: 900px) {
  .hero { min-height: 88dvh; }
}

/* Honor reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Safe-area padding for notched / gesture-bar devices */
@supports (padding: env(safe-area-inset-top)) {
  .nav { padding-left: max(1.5rem, env(safe-area-inset-left)); padding-right: max(1.5rem, env(safe-area-inset-right)); }
  footer { padding-bottom: max(1.5rem, env(safe-area-inset-bottom)); }
  .hero__inner { padding-left: max(1.5rem, env(safe-area-inset-left)); padding-right: max(1.5rem, env(safe-area-inset-right)); }
}

/* Reviews iframe: reserve space to avoid layout shift while widget loads */
.lc_reviews_widget { min-height: 320px; }

/* No fixed backgrounds on mobile (Safari ignores; perf hit) */
@media (max-width: 900px) {
  [style*="background-attachment: fixed"],
  [style*="background-attachment:fixed"] { background-attachment: scroll !important; }
}

/* ============================================================
   Mobile pare-down — hide secondary content on small screens
   so the page stays scannable and fast on phones (most traffic).
   ============================================================ */
@media (max-width: 768px) {
  /* Home: live Google reviews iframe — featured + 2 cards already cover proof */
  .testi__live { display: none !important; }

  /* Home: plan "what you won't deal with" promises — secondary reassurance */
  .plan__agreement { display: none !important; }

  /* Home: standalone brief-download strip — Final CTA below covers the same intent */
  section:has(> .container > .brief__strip) { display: none !important; }

  /* Footer: "Service Areas" column (10 cities) — redundant with nav and CTA contact line */
  .foot__col:last-child { display: none !important; }

  /* Home hero: keep first 2 chips only — 4 chips wrap heavy on narrow screens */
  .hero__chips .hero__chip:nth-child(n+3) { display: none; }

  /* Home results: drop the decorative "↓ becomes ↓" connector; the two phrases stand alone */
  .results__arrow { display: none; }
  .results__transform { gap: 0.75rem; }

  /* Services page: hide the 3-up "Recent Work" cards inside each service block.
     Six blocks × three cards = 18 cards on mobile — too long. The nav link
     "See all projects" inside still appears via the main work grid up top. */
  .svc-block .svc-proof { display: none !important; }

  /* Home partners marquee: tighten to a single tidy band */
  .partners__label { font-size: 0.7rem; letter-spacing: 0.18em; }

  /* Home featured testimonial: drop the heavy bg image on mobile (still bleeds bandwidth) */
  .testi__featured-bg { display: none; }
  .testi__featured { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); }

  /* Reduce vertical padding on stacked sections so the page reads tighter */
  .sec, .work, .problems, .results, .guide, .plan, .services, .testi, .cta {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
}