/* Progressive motion: content is visible without JavaScript or API support. */
.motion-control{border:1px solid #5378aa;background:transparent;color:#c7defb;padding:7px 10px;font-size:11px;white-space:nowrap}
.motion-control:hover{border-color:#78dfff;color:#fff}
html[data-motion=reduced] *,html[data-motion=reduced] *::before,html[data-motion=reduced] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-motion=reduced]::view-transition-old(root),html[data-motion=reduced]::view-transition-new(root){animation:none!important}
:root{--ease-emp:cubic-bezier(.2,.7,.2,1);--motion-fast:180ms;--motion-medium:320ms}
@view-transition{navigation:auto}
::view-transition-old(root){animation:emp-page-out 160ms ease-out both}
::view-transition-new(root){animation:emp-page-in 280ms var(--ease-emp) both}
@keyframes emp-page-out{to{opacity:0}}
@keyframes emp-page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes emp-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes emp-photo-enter{from{opacity:0;transform:translateY(15px) scale(.985)}to{opacity:1;transform:none}}
.multipage .button,.multipage .nav-cta{transition:background var(--motion-fast),border-color var(--motion-fast),color var(--motion-fast),transform var(--motion-fast) var(--ease-emp),box-shadow var(--motion-fast)}
.button>span[aria-hidden]{transition:transform var(--motion-fast) var(--ease-emp)}
.button:hover>span[aria-hidden],.button:focus-visible>span[aria-hidden]{transform:translate(3px,-3px)}
.button:active{transform:translateY(1px)}
.site-header a,.site-footer a,.text-link,.filter,.generation-links>a,.home-index>a{transition:color var(--motion-fast),background var(--motion-fast),border-color var(--motion-fast)}
.site-header{transition:box-shadow var(--motion-medium),background var(--motion-medium)}
.site-header.is-scrolled{box-shadow:0 8px 24px #03102b44}
.service-panels>a{transition:transform var(--motion-medium) var(--ease-emp),box-shadow var(--motion-medium),background var(--motion-fast),border-color var(--motion-fast)}
.garage-image img,.home-parts-image img{transition:transform 650ms var(--ease-emp)}
.generation-links strong,.panel-link{transition:color var(--motion-fast),transform var(--motion-medium) var(--ease-emp)}
.enquiry-form input,.enquiry-form select,.enquiry-form textarea,.search-label input{transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}
.enquiry-form input:focus,.enquiry-form select:focus,.enquiry-form textarea:focus{border-color:#6bdcff;box-shadow:0 0 0 3px #59dcff1c}
.faq-list summary span,.expand-icon{transition:transform var(--motion-medium) var(--ease-emp)}
.faq-list summary{transition:color var(--motion-fast)}
.faq-list summary:hover{color:#91e7ff}
@supports(interpolate-size:allow-keywords){
 details{interpolate-size:allow-keywords}
 details::details-content{height:0;opacity:0;overflow:clip;transition:height var(--motion-medium) var(--ease-emp),opacity 220ms ease,content-visibility var(--motion-medium) allow-discrete}
 details[open]::details-content{height:auto;opacity:1}
}
dialog{transition:opacity 200ms ease,transform 240ms var(--ease-emp),display 240ms allow-discrete,overlay 240ms allow-discrete;opacity:0;transform:translateY(12px) scale(.985)}
dialog[open]{opacity:1;transform:none}
dialog::backdrop{transition:background-color 200ms ease,display 240ms allow-discrete,overlay 240ms allow-discrete}
@starting-style{dialog[open]{opacity:0;transform:translateY(12px) scale(.985)}dialog[open]::backdrop{background-color:transparent}}
@media all{
 .home-hero-copy>.eyebrow,.page-hero>div>.eyebrow,.parts-intro>.eyebrow,.gallery-intro>.eyebrow,.contact-intro>.eyebrow{animation:emp-enter 550ms var(--ease-emp) both}
 .home-hero-copy>h1,.page-hero h1,.parts-intro h1,.gallery-intro h1,.contact-intro h1{animation:emp-enter 650ms 60ms var(--ease-emp) both}
 .home-intro,.page-lead,.parts-intro>p:not(.eyebrow),.gallery-intro>p:not(.eyebrow),.contact-intro>p:not(.eyebrow){animation:emp-enter 650ms 120ms var(--ease-emp) both}
 .home-hero .hero-actions,.page-hero>div>.button{animation:emp-enter 650ms 180ms var(--ease-emp) both}
 .hero-mosaic,.page-hero>figure{animation:emp-photo-enter 800ms 100ms var(--ease-emp) both}
}
@media(hover:hover){
 .button:hover{transform:translateY(-2px);box-shadow:0 7px 18px #03102b22}
 .service-panels>a:hover,.service-panels>a:focus-visible{transform:translateY(-5px);box-shadow:0 14px 28px #051f4430}
 .service-panels>a:hover .panel-link{transform:translateX(3px)}
 .garage-card:hover img,.garage-card:focus-visible img{transform:scale(1.04)}
 .home-parts-image:hover img{transform:scale(1.025)}
 .generation-links>a:hover strong{transform:translateX(4px)}
}
@media(max-width:760px){
 .multipage .site-header nav{display:flex;flex-direction:column;visibility:hidden;opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity 200ms ease,transform 260ms var(--ease-emp),visibility 260ms}
 .multipage .site-header nav.open{visibility:visible;opacity:1;transform:none;pointer-events:auto}
 .menu-toggle span{transition:transform 220ms var(--ease-emp)}
 .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
 .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
}
@media(prefers-reduced-motion:reduce){

 html:not([data-motion=full]) *,html:not([data-motion=full]) *::before,html:not([data-motion=full]) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 html:not([data-motion=full])::view-transition-old(root),html:not([data-motion=full])::view-transition-new(root){animation:none!important}
 html:not([data-motion=full]) dialog,html:not([data-motion=full]) dialog[open]{transform:none}
}
