/* Deliberate, visible feedback. Transform-only movement avoids layout jumps. */
:root{--action-ease:cubic-bezier(.2,.8,.2,1)}
.button,.ride-route button,.contact .text-link{position:relative;isolation:isolate;transition:transform .28s var(--action-ease),color .22s,background-color .22s}
.button{overflow:hidden;font-weight:600}
.button::before,.ride-route button::before{content:'';position:absolute;inset:0;z-index:-1;background:#0b4668;transform:scaleY(0);transform-origin:bottom;transition:transform .3s var(--action-ease);border-radius:inherit;pointer-events:none}
.button .ui-icon,.ride-footer a .ui-icon,.other-trade .ui-icon,.contact-copy>a .ui-icon{transition:transform .3s var(--action-ease)}
.header .nav-cta{padding:12px 16px;border-radius:3px;font-weight:600}
.opening-bottom .button{padding:12px 18px;font-weight:600}
.ride-route button{padding:10px 12px;border-radius:3px}
.ride-route button span{font-weight:600;transition:color .22s}
.trade-list summary,.faq-list summary{transition:transform .28s var(--action-ease),color .22s,background-color .22s}
.faq-list summary .ui-icon{transition:transform .3s var(--action-ease)}
.faq-list details[open] summary .ui-icon{transform:rotate(45deg)}
.header nav>a:not(.button),.ride-footer a,.other-trade,.contact-copy>a{transition:color .22s,transform .28s var(--action-ease),text-decoration-color .22s}

@media(hover:hover) and (pointer:fine){
 .button:hover{transform:translateY(-5px) scale(1.025);color:#fff;background-color:var(--reference-blue);text-shadow:none}
 .button:hover::before,.ride-route button:hover::before{transform:scaleY(1)}
 .button:hover .ui-icon{transform:translate(5px,-5px)}
 .opening-bottom .button:hover .ui-icon{transform:translateY(5px)}
 .ride-route button:hover,.phone-close .ride-route button:hover{transform:translateY(-4px);color:#fff}
 .ride-route button:hover span,.phone-close .ride-route button:hover span{color:#fff}
 .trade-list summary:hover,.faq-list summary:hover{transform:translateX(7px);color:var(--reference-blue);background-color:#e4f0f7}
 .faq-list summary:hover .ui-icon{transform:rotate(90deg)}
 .faq-list details[open] summary:hover .ui-icon{transform:rotate(135deg)}
 .header nav>a:not(.button):hover{transform:translateY(-3px);text-decoration:underline;text-underline-offset:7px}
 .ride-footer a:hover,.other-trade:hover,.contact-copy>a:hover,.contact .text-link:hover{transform:translateX(4px);color:var(--reference-blue)}
 .ride-footer a:hover .ui-icon,.other-trade:hover .ui-icon,.contact-copy>a:hover .ui-icon{transform:translate(4px,-4px)}
}
.button:focus-visible,.ride-route button:focus-visible{color:#fff;background-color:#0b4668;outline:2px solid #135c85;outline-offset:5px}
.ride-route button:focus-visible span{color:#fff}
.button:active,.ride-route button:active{transform:translateY(1px) scale(.97);transition-duration:.12s;background-color:#0b4668;color:#fff}
.ride-route button:active span{color:#fff}
.contact .text-link:active,summary:active{transform:translateX(2px);transition-duration:.12s}

/* Use the available 600 weight for deliberate emphasis, not synthetic bold. */
main strong{font-weight:600}
.process-map h3,.ride-static article h3{font-weight:600}
.process-map p strong,.ride-reading p strong,.ride-static p strong{color:var(--ink)}
.ride-reading h2 strong{font-weight:600;letter-spacing:-.04em}
@media(max-width:760px){
 .header .nav-cta{padding:10px 12px}
 .ride-route{gap:6px}.ride-route button{padding:10px 8px}
}
@media(prefers-reduced-motion:reduce){
 .button,.ride-route button,.trade-list summary,.faq-list summary,.header nav>a,.ride-footer a,.other-trade,.contact-copy>a,.contact .text-link,.button .ui-icon,.ride-footer .ui-icon,.other-trade .ui-icon,.contact-copy>a .ui-icon,.faq-list summary .ui-icon{transition:none!important;transform:none!important}
 .button::before,.ride-route button::before{transition:none!important}
}