/* Keyboard focus is visible without changing the page's resting layout. */
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid #e85a10;
  outline-offset: 3px;
  scroll-margin-top: 5rem;
}
.site-skip-link {
  position: fixed;
  z-index: 100;
  top: .5rem;
  left: .5rem;
  transform: translateY(-200%);
  background: #fff;
  color: #111827;
  padding: .75rem 1rem;
  border: 2px solid #1a4fbe;
  font-weight: 700;
}
.site-skip-link:focus { transform: translateY(0); }
.mobile-menu {
  position: absolute;
  top: 4rem;
  left: 0;
  right: 0;
  z-index: 60;
  padding: 1rem 1.25rem;
  background: #fff;
  border-bottom: 1px solid #d1d5db;
  box-shadow: 0 8px 18px rgb(17 24 39 / 12%);
}
.mobile-menu[hidden] { display: none; }
.mobile-menu nav { display: flex; flex-direction: column; gap: .9rem; }
.mobile-menu a { color: #374151; font-size: .95rem; font-weight: 600; }
@media (min-width: 768px) { .mobile-menu { display: none !important; } }


/* Progressive reveal fallback for static hosting when the hydration observer is unavailable. */
@layer utilities { .reveal, .reveal-left, .reveal-right, .reveal-scale { opacity: 1 !important; transform: none !important; } }

/* Essential external styles for hosts that block style attributes. */
.hero-background { background-image: url('/assets/hero-background-1440.webp') !important; }
[data-nimg=fill] { position: absolute; height: 100%; width: 100%; left: 0; top: 0; right: 0; bottom: 0; color: transparent; }

header button[aria-controls=mobile-menu][aria-expanded=true] span:nth-child(1) { transform: translateY(8px) rotate(45deg) !important; }
header button[aria-controls=mobile-menu][aria-expanded=true] span:nth-child(2) { opacity: 0 !important; }
header button[aria-controls=mobile-menu][aria-expanded=true] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg) !important; }

/* SEO visibility: expose existing descriptions completely, including mobile cards. */
#repairs .line-clamp-3 { display: block !important; overflow: visible !important; -webkit-line-clamp: unset !important; line-clamp: unset !important; }
#repairs .grid h3, #repairs .grid p { overflow-wrap: break-word; }
/* Improve low-contrast small text without hiding or changing its wording. */
footer .text-white\/20, footer .text-white\/30 { color: rgb(255 255 255 / 75%) !important; }
footer .text-white\/50 { color: rgb(255 255 255 / 79%) !important; }
@media (max-width: 480px) {
  #repairs .grid.grid-cols-2 { grid-template-columns: minmax(0, 1fr) !important; }
  #repairs .grid p { font-size: 0.875rem !important; line-height: 1.5 !important; }
  #repairs .grid h3 { font-size: 1rem !important; }
}