/* A single motion language for the public site. The van owns its hero. */
:root { --soopi-ease:cubic-bezier(.22,1,.36,1); }
.site-nav a { transition:color .22s,opacity .22s,background .22s; }
.wordmark img { transform-origin:left center; transition:transform .35s var(--soopi-ease); }
.text-link { border-bottom-color:transparent; background-image:linear-gradient(currentColor,currentColor); background-repeat:no-repeat; background-position:left bottom; background-size:28% 1px; transition:background-size .4s var(--soopi-ease),color .2s; }
.closing .text-link { align-self:center; width:fit-content; max-width:100%; padding-bottom:5px; }
@media(max-width:820px) { .closing .text-link { align-self:flex-start; } }
.text-link svg { transition:transform .35s var(--soopi-ease); }
.text-link:focus-visible { background-size:100% 1px; }
.footer-col a { width:fit-content; max-width:100%; text-decoration:none; background-image:linear-gradient(currentColor,currentColor); background-repeat:no-repeat; background-position:left bottom; background-size:0 1px; transition:background-size .35s var(--soopi-ease),translate .3s var(--soopi-ease); }
.footer-col a:focus-visible { background-size:100% 1px; }

/* Soft borders and shadows keep the geometry of the shared 3D canvas stable. */
.audience-section .route-choice { transition:box-shadow .35s var(--soopi-ease),border-color .3s; }
.contact-card,.info-panel { transition:box-shadow .35s var(--soopi-ease),border-color .3s,transform .35s var(--soopi-ease); }
.contact-card:focus-within,.info-panel:focus-within { box-shadow:0 14px 40px #24334b12; border-color:#92a6e5; }
.audience-section .route-choice:focus-visible { box-shadow:0 18px 44px #223cad1c; }
.service-row { position:relative; isolation:isolate; }
.service-row::before { content:""; position:absolute; inset:4px -14px; background:#f1f5ff; border-radius:16px; opacity:0; z-index:-1; pointer-events:none; transition:opacity .25s; }
.service-row img { transition:transform .45s var(--soopi-ease),background .25s; }
.service-row>svg { transition:transform .35s var(--soopi-ease); }
.service-row:focus-visible::before { opacity:1; }
.service-row:focus-visible h3 { color:var(--blue); }

/* Numbered steps and information blocks get a quiet line accent. */
.responsibility-list li,.steps-grid .step,.quality-item { position:relative; }
.responsibility-list li::after,.steps-grid .step::before,.quality-item::before { content:""; position:absolute; left:0; right:0; height:2px; background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform .45s var(--soopi-ease); pointer-events:none; }
.responsibility-list li::after { bottom:-1px; }
.steps-grid .step::before,.quality-item::before { top:-1px; }
.quality-item::before { background:#b7e9df; }
.responsibility-list .step-no { display:grid; place-items:center; padding:0; width:30px; height:30px; border-radius:9px; background:#f0f4ff; transition:background .25s,color .25s; }
.steps-grid .step-no { transition:color .25s; }
.quality-item h3,.steps-grid h3 { transition:color .25s; }

/* FAQ feedback remains on the native, keyboard-accessible details control. */
.faq-list details { border-radius:8px; transition:background .25s,border-color .25s; }
.faq-list summary { transition:color .2s; }
.faq-list summary::after { transition:rotate .3s var(--soopi-ease),color .2s; }
.faq-list details[open] { background:#f5f7fc; border-bottom-color:#bdcaed; }
.faq-list details[open] summary { color:var(--blue); }
.faq-list details[open] summary::after { rotate:180deg; }
.faq-list summary:focus-visible { color:var(--blue); }
.field :is(input,textarea,select) { transition:border-color .2s,box-shadow .25s,background .2s; }
.field :is(input,textarea,select):focus-visible { box-shadow:0 0 0 4px #3457df12; }

@media(min-width:821px) {
 .site-nav a:not(.mobile-contact) { position:relative; }
 .site-nav a:not(.mobile-contact)::before { content:""; position:absolute; left:0; right:0; bottom:5px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .3s var(--soopi-ease); }
 .site-nav a:focus-visible::before { transform:scaleX(1); }
}
@media(hover:hover) and (pointer:fine) {
 .site-nav a:hover::before { transform:scaleX(1); }
 .text-link:hover { background-size:100% 1px; }
 .footer-col a:hover { text-decoration:none; background-size:100% 1px; }
 .audience-section .route-choice:hover { border-color:#93a8f5; box-shadow:0 18px 44px #223cad1c; }
 .audience-section .route-choice[data-audience="partner"]:hover { border-color:#c1ceff; box-shadow:0 18px 44px #223cad29,inset 0 0 0 1px #ffffff35; }
 .contact-card:hover,.info-panel:hover { border-color:#92a6e5; box-shadow:0 14px 40px #24334b12; }
 .service-row:hover::before { opacity:1; }
 .service-row:hover h3 { color:var(--blue); }
 .responsibility-list li:hover::after,.steps-grid .step:hover::before,.quality-item:hover::before { transform:scaleX(1); }
 .responsibility-list li:hover .step-no { background:var(--blue); color:white; }
 .quality-item:hover h3 { color:#c5efe6; }
 .faq-list details:hover { background:#f5f7fc; }
 .faq-list summary:hover { color:var(--blue); }
 .field :is(input,textarea,select):not(:disabled):hover { border-color:#92a6e5; }
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .wordmark:hover img { transform:scale(1.035); }
 .text-link:hover svg { transform:translateX(5px); }
 .footer-col a:hover { translate:3px 0; }
 .contact-card:hover { transform:translateY(-4px); }
 .service-row:hover img { transform:translateY(-3px) rotate(-4deg) scale(1.04); }
 .service-row:hover>svg { transform:translateX(6px); }
 .button:not(:disabled):hover { transform:translateY(-3px); box-shadow:0 10px 25px #162b5526; }
 .button:not(:disabled):hover .button-icon svg { transform:translateX(5px); }
 .button:not(:disabled):active { transform:translateY(0); box-shadow:0 2px 5px #162b5515; }
}
@media(max-width:600px) { .service-row::before { inset:4px -8px; border-radius:12px; } }
@media(prefers-reduced-motion:reduce) {
 .wordmark img,.text-link svg,.contact-card,.service-row img,.service-row>svg { transform:none!important; }
 .footer-col a { translate:none!important; }
 .faq-list summary::after { rotate:none; }
}
@media print {
 [data-appear] { opacity:1!important; translate:none!important; }
}