/* Default/no-JS content stays visible. Prepared starts are applied before paint,
   so an entrance never first snaps a visible element away from its position. */
/* SPA navigation calls scrollTo(0, 0). Global smooth scrolling made a new page
   sweep past the reader while its independent entrance animations started. */
html {scroll-behavior:auto}
.motion-prepared {--motion-x:0px;--motion-y:30px;opacity:0;transform:translate3d(var(--motion-x),var(--motion-y),0)}
.motion-warm {will-change:transform,opacity}
.motion-running {animation:site-reveal .72s cubic-bezier(.22,.61,.36,1) both}
@keyframes site-reveal {
  from {opacity:0;transform:translate3d(var(--motion-x),var(--motion-y),0)}
  to {opacity:1;transform:translate3d(0,0,0)}
}
@media (min-width:1101px) {
  .motion-prepared[data-motion-direction="left"] {--motion-x:-34px;--motion-y:0px}
  .motion-prepared[data-motion-direction="right"] {--motion-x:34px;--motion-y:0px}
}
@media (max-width:1100px) {
  .motion-prepared {--motion-y:24px}
  .motion-running {animation-duration:.64s}
}
/* The first HTML and its SPA replacement share this pre-paint state.
   The head bootstrap removes it automatically if the main script fails. */
.motion-boot :is(.hero-copy,.hero-visual,.parts-hero>div,.parts-hero>figure,.repair-service-hero>div,.repair-service-hero>figure,.blog-hero>div,.page-intro>*,.article-header>*,.bb-intro>*) {opacity:0}
/* Reserve the lazy portrait's real ratio before its pixels arrive. */
.quality-visual img {aspect-ratio:1122/1402;display:block}
/* Blurring moving content under a sticky header is expensive at large desktop
   resolutions. Keep the same white header without repeated backdrop filtering. */
.site-header,.site-header.is-scrolled {background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;will-change:auto}
@media (min-width:1101px) {
  .desktop-nav > a,.desktop-nav .nav-disclosure-toggle {position:relative}
  .desktop-nav > a::after,.desktop-nav .nav-disclosure-toggle::after {
    content:"";position:absolute;left:.7rem;right:.7rem;bottom:3px;height:3px;
    background:var(--lime);transform:scaleX(0);transform-origin:left;
    transition:transform .22s ease;pointer-events:none;
  }
  .desktop-nav > a:hover::after,.desktop-nav > a:focus-visible::after,
  .desktop-nav > a.is-active::after,.desktop-nav .nav-disclosure-toggle:hover::after,
  .desktop-nav .nav-disclosure-toggle:focus-visible::after,
  .desktop-nav .nav-disclosure-toggle.is-active::after,
  .desktop-nav .nav-disclosure-toggle[aria-expanded="true"]::after {transform:scaleX(1)}
  .desktop-nav > a.is-active,.desktop-nav .nav-disclosure-toggle.is-active,
  .desktop-nav .nav-disclosure-toggle[aria-expanded="true"] {box-shadow:none}
}
.btn {transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
.motion-button-arrow {display:inline-block;transition:transform .2s ease}
@media (hover:hover) and (pointer:fine) {
  .btn:not(:disabled):not([aria-disabled="true"]):hover {transform:translateY(-2px);box-shadow:0 6px 16px rgba(7,31,47,.12)}
  .btn:hover .motion-button-arrow {transform:translateX(3px)}
}
.btn:focus-visible,.desktop-nav > a:focus-visible,.nav-disclosure-toggle:focus-visible {
  outline:2px solid var(--blue);outline-offset:4px;
}
@media print, (prefers-reduced-motion:reduce) {
  .motion-prepared,.motion-running,.motion-boot :is(.hero-copy,.hero-visual,.parts-hero>div,.parts-hero>figure,.repair-service-hero>div,.repair-service-hero>figure,.blog-hero>div,.page-intro>*,.article-header>*,.bb-intro>*) {opacity:1;transform:none;animation:none;will-change:auto}
  html {scroll-behavior:auto}
  .btn,.motion-button-arrow,.desktop-nav > a::after,.desktop-nav .nav-disclosure-toggle::after {transition:none}
  .btn:hover,.btn:hover .motion-button-arrow {transform:none}
}
