/* Shared layout refinements for the horizontal brand lockup. */
* { box-sizing: border-box; }
img { max-width: 100%; }
.main-nav, .nav, .site-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px 24px; padding: 14px 5vw;
}
.brand { display: block; flex: 0 1 300px; min-width: 0; }
.brand-logo { display: block; width: 300px; max-width: 100%; height: auto; mix-blend-mode: darken; }
.nav-links, .links, .site-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 20px; margin: 0; }
.nav-links a, .links a, .site-nav a { display: inline-flex; align-items: center; min-height: 44px; }
.main-nav { position: static; }
section[id] { scroll-margin-top: 24px; }
.hero > *, .wrap > *, .content-layout > *, .contact-panel > *, .contact-section > * { min-width: 0; }
.hero h1, .page-hero h1, .detail-hero h1 { text-wrap: balance; }
.service-card, .line-card, .faq-item, .box, .side { overflow-wrap: anywhere; }
.contact-form input, .contact-form select, .contact-form textarea { min-width: 0; font-size: 16px; }
.contact-form input, .contact-form select, .contact-form button { min-height: 48px; }
.footer, .site-footer { flex-wrap: wrap; overflow-wrap: anywhere; }
.side-note a, .contact-list a { overflow-wrap: anywhere; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #a8322d; outline-offset: 4px;
}
@media (max-width: 1100px) {
  .main-nav .brand { flex-basis: 280px; }
  .main-nav .nav-links { order: 3; flex: 1 0 100%; justify-content: center; }
}
@media (max-width: 980px) {
  .hero, .locations, .why-section, .contact-section, .detail-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 850px) {
  .wrap { grid-template-columns: minmax(0, 1fr); }
  .nav { flex-direction: row; align-items: center; }
}
@media (max-width: 620px) {
  .main-nav, .nav, .site-header { display: flex; flex-direction: row; align-items: center; gap: 8px 12px; padding: 12px 5vw; }
  .main-nav .brand, .brand { flex: 0 1 280px; max-width: 100%; margin: 0 auto; }
  .brand-logo { width: 280px; }
  .main-nav .nav-links, .links, .site-nav { order: 2; flex: 1 0 100%; justify-content: center; gap: 0 16px; font-size: 14px; }
  .main-nav .nav-cta { order: 3; width: 100%; min-height: 44px; }
  .hero { padding: 36px 5vw; gap: 28px; }
  .hero p { font-size: 17px; line-height: 1.6; }
  .hero-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .hero-actions a { min-height: 48px; text-align: center; padding: 12px 16px; }
  .icon-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .icon-strip a { padding: 18px 12px; font-size: 14px; border-bottom: 1px solid var(--line); }
  .icon-strip svg { width: 28px; height: 28px; }
  .section, .locations, .why-section, .contact-section, .business-lines, .faq-section, .wrap, .detail-layout { padding: 40px 5vw; gap: 24px; }
  .service-grid, .line-grid, .faq-grid, .difference-grid { grid-template-columns: minmax(0, 1fr); }
  .trust-band { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trust-band div { padding: 20px 16px; }
  .trust-band div:last-child { grid-column: 1 / -1; }
  .trust-band strong { font-size: 19px; overflow-wrap: anywhere; }
  .location-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .location-list span { padding: 12px; font-size: 14px; }
  .contact-form { padding: 20px; }
  .difference-card { grid-template-columns: 36px minmax(0, 1fr); }
  .footer, .site-footer { flex-direction: column; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .service-card { transition: none; }
}
