/* Shared tactile response for every native button and button-style link. */
/* Equal side columns keep the navigation at the actual centre of the screen. */
.site-header,.shop-page .site-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:24px;height:96px}
.site-header>.brand{grid-column:1;justify-self:start}
.site-header>.desktop-nav{grid-column:2;justify-self:center;gap:clamp(18px,1.7vw,28px);white-space:nowrap}
.site-header>.header-actions{grid-column:3;justify-self:end;display:flex;align-items:center;justify-content:flex-end;gap:12px}
.header-actions .theme-toggle{margin:0;flex-shrink:0}
.header-actions .menu-toggle{border-radius:999px;clip-path:none}
@media(max-width:1399px){.header-actions .header-contact{display:none}}
@media(max-width:1100px){
 .site-header,.shop-page .site-header{grid-template-columns:minmax(0,1fr) auto;height:84px;column-gap:16px}
 .site-header>.desktop-nav{display:none}
 .site-header>.header-actions{grid-column:2;gap:12px}
 .header-actions .menu-toggle{display:flex;align-items:center;gap:12px}
 .site-header>.brand{width:145px}
 .shop-page .mobile-nav,.mobile-nav{top:84px}
}
.reactive-control{isolation:isolate;overflow:hidden;transition:background-color .28s ease,color .28s ease,box-shadow .28s ease,filter .28s ease,translate .28s cubic-bezier(.2,.75,.25,1),scale .18s ease}
.control-positioned{position:relative}
@media(hover:hover) and (pointer:fine){
 .reactive-control:not(:disabled):not([aria-disabled=true]):hover{translate:0 -2px;filter:brightness(1.07);box-shadow:0 5px 15px #00000018,inset 0 0 0 1px #ffffff26}
 .reactive-control:is(.interior-tile,.car-image):hover{translate:0 -1px}
 .reactive-control:is(.text-link,.menu-toggle):hover{box-shadow:none}
}
.reactive-control:not(:disabled):not([aria-disabled=true]):focus-visible{outline:2px solid var(--red);outline-offset:4px;box-shadow:0 0 0 5px #d91d2b18;filter:brightness(1.07)}
.reactive-control:not(:disabled):not([aria-disabled=true]):is(:active,.control-pressed){translate:0 1px;scale:.975;box-shadow:inset 0 2px 5px #00000020}
.reactive-control:is(:disabled,[aria-disabled=true]){cursor:not-allowed;translate:none;scale:1;box-shadow:none}
/* Image buttons stay flush with the card. Moving or shrinking their frame
   exposes the pale backing; only the photograph inside may move. */
.car-image>button.open-car.reactive-control,
.car-image>button.open-car.reactive-control:is(:hover,:focus-visible,:active,.control-pressed),
.interior-tile.reactive-control,
.interior-tile.reactive-control:is(:hover,:focus-visible,:active,.control-pressed){translate:none;scale:1;transform:none;filter:none;box-shadow:none;border:0;background:transparent}
.car-image>button.open-car.reactive-control:focus-visible,.interior-tile.reactive-control:focus-visible{outline:2px solid var(--red);outline-offset:-3px}
.car-image>button.open-car>.control-ripple,.interior-tile>.control-ripple{display:none!important}
@media(hover:hover) and (pointer:fine){.car-card:hover .car-image img{transform:scale(1.045)}}
@media(prefers-reduced-motion:reduce){.car-card:hover .car-image img{transform:none}}
.control-ripple{position:absolute!important;display:block!important;pointer-events:none!important;border-radius:50%;width:var(--ripple-size)!important;height:var(--ripple-size)!important;left:var(--ripple-x);top:var(--ripple-y);margin:0!important;padding:0!important;background:currentColor;opacity:0;z-index:2;transform:translate(-50%,-50%) scale(0);animation:control-pressure .62s cubic-bezier(.16,1,.3,1) forwards}
@keyframes control-pressure{0%{opacity:.19;transform:translate(-50%,-50%) scale(0)}55%{opacity:.09}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
/* Tiny utility controls feel like switches, with a restrained red accent. */
:is(.camera-bar,.gallery-controls,.media-mode,.part-controls) button:not(:disabled):is(:hover,:focus-visible),.previous-button:is(:hover,:focus-visible),#close-parts:is(:hover,:focus-visible){box-shadow:inset 0 -2px 0 var(--red),0 4px 12px #00000016}
.dialog-close:not(:disabled):is(:hover,:focus-visible){background:var(--red)!important;color:#fff!important}
@media(prefers-reduced-motion:reduce){
 .reactive-control{transition:none!important}
 .reactive-control:not(:disabled):is(:hover,:focus-visible,:active,.control-pressed){translate:none;scale:1}
 .control-ripple{display:none!important;animation:none}
}