/* Price and comparison: part of the main Stride site, never the fictional demos. */
.website-price{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:28px 34px;margin:10px 0 25px;background:#51321f;color:#fffaf2;border-radius:18px;border:1px solid #76533b}
.website-price p{margin:0}.website-price .price-label{display:block;font-size:12px;font-weight:600;letter-spacing:1.3px;text-transform:uppercase;color:#edc9a4}.website-price strong{display:block;font-family:Manrope,sans-serif;font-size:clamp(29px,3vw,43px);line-height:1.3;letter-spacing:-1px;margin:6px 0}.website-price .price-note{font-size:14px;color:#f1e2d2;max-width:580px}.website-price .button{flex:none;background:#edc9a4;color:#493023}
.style-comparison{border:1px solid #c7b09a;border-radius:14px;margin:0 0 35px;background:#fffdf8}.style-comparison>summary{padding:18px 24px;font-weight:600;cursor:pointer}.comparison-grid{padding:4px 24px 24px;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.comparison-grid article{border-top:2px solid #b68f6d;padding-top:17px}.comparison-grid h3{font-size:19px}.comparison-grid p{font-size:14px;margin-bottom:12px}.comparison-grid ul{font-size:14px;padding-left:18px}.comparison-note{padding:0 24px 20px;font-size:13px;margin:0}
.footer-privacy{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:12px}.privacy-control{font:inherit;color:inherit;background:none;border:0;padding:7px 0;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.privacy-dialog{max-width:520px;width:calc(100% - 36px);padding:28px;border:1px solid #c7b09a;border-radius:16px;background:#fffaf2;color:#493023;box-shadow:0 15px 80px #0003}.privacy-dialog::backdrop{background:#261c1680}.privacy-dialog h2{font-size:26px;letter-spacing:-.8px}.privacy-dialog p,.privacy-dialog label{font-size:14px}.privacy-dialog label{display:flex;gap:12px;align-items:start;margin:20px 0}.privacy-dialog input{width:20px!important;margin:4px 0!important;flex:none}.privacy-dialog .privacy-actions{display:flex;gap:12px;flex-wrap:wrap}.privacy-document{max-width:880px;padding-block:50px 80px}.privacy-document h1{font-size:clamp(38px,5vw,58px)}.privacy-document h2{font-size:25px;letter-spacing:-.7px;margin-top:35px}.privacy-document p,.privacy-document li{font-size:16px}.external-consent{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:210px;padding:24px;text-align:center;background:#f2e8dd;border:1px solid #c7b09a;border-radius:12px;color:#493023}.external-consent p{font-size:13px;margin:0;max-width:400px}.external-consent .button{font-size:13px}.contact-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.form-actions button:disabled{opacity:.6;cursor:wait}.form-privacy{font-size:12px;margin:12px 0}
@media(max-width:720px){.website-price{padding:25px 23px;display:block}.website-price .button{margin-top:20px}.comparison-grid{grid-template-columns:1fr 1fr;gap:18px}.comparison-grid h3{font-size:16px}.footer-privacy{gap:14px}}
@media(max-width:420px){.comparison-grid{grid-template-columns:1fr}}
/* Keep keyboard focus visible even when a design resets button styles. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid #b26727!important;outline-offset:4px!important}
@media(prefers-reduced-motion:reduce) and (max-width:0px){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.desktop-letter,.touch-letter,.stride-letter,.stride-word,.word-arrival,.reveal,.pending,.stride-reveal,.desktop-replay,.touch-replay,.touch-demo-replay{opacity:1!important;translate:none!important;clip-path:none!important;filter:none!important}.desktop-letter,.touch-letter,.stride-letter,.stride-word,.word-arrival{transform:none!important}}
/* Three useful navigation levels, with less space lost on phones. */
@media(max-width:720px){body.demo .stride-shell-inner{min-height:56px;padding:6px 16px;gap:16px}body.demo .stride-shell-brand img{width:104px}body.demo .stride-shell-toggle{min-height:44px;padding:8px 12px}body.demo .demo-toolbar{min-height:28px;padding-block:3px}body.demo.v4 .header{min-height:54px;padding-top:5px;padding-bottom:5px}body.demo.v4 .header .logo{font-size:18px}body.demo.v4 .header .menu-toggle{min-height:44px}}
@media(max-width:720px){body.demo.v4 .header{padding:5px 18px!important;gap:8px 16px!important}body.demo.v4 .header:not(.menu-open) nav{padding-top:0!important}body.demo.v4 .header .wordmark small{font-size:9px;letter-spacing:1px}}
.stride-location>.external-consent{order:0;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;min-height:210px;width:100%;padding:18px}.stride-location>.external-consent p{font-size:13px;line-height:1.5;text-align:center}.stride-location iframe[hidden]{display:none!important}
.package-scope-note{font-size:14px;line-height:1.6;color:#6d5544;margin:0 0 22px;max-width:1000px}.comparison-included,.comparison-extras{margin:0 24px 22px;border-top:1px solid #d7c5b2;padding-top:20px}.comparison-included h3,.comparison-extras h3{font-size:20px;margin-bottom:12px}.comparison-included ul{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;padding:0;margin:0;font-size:14px}.comparison-included li{border-left:3px solid #b68f6d;padding-left:12px}.comparison-extras p{font-size:14px;margin:0;max-width:950px}.style-base-copy{font-size:18px;color:#493023;margin-top:22px;max-width:900px}
@media(max-width:720px){.comparison-included ul{grid-template-columns:1fr;gap:12px}.package-scope-note{font-size:13px}.style-base-copy{font-size:16px}}
.comparison-extras .button{margin-top:17px;font-size:14px}

/* ===== Update 22 oktober 2026 ===== */
/* Privacyvraag voor anonieme statistieken bij het eerste bezoek. */
.privacy-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:400;max-width:780px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:16px 18px;background:#fffaf2;color:#493023;border:1px solid #d8c3aa;border-radius:16px;box-shadow:0 12px 32px #51321f2e;font-size:14px;line-height:1.55}
.privacy-bar p{margin:0;flex:1 1 340px}
.privacy-bar a{color:#51321f;font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.privacy-bar .privacy-actions{display:flex;gap:10px;flex-wrap:wrap}
.privacy-bar .button{margin:0;min-height:44px;padding:11px 18px;font-size:14px;cursor:pointer}
@media(max-width:720px){.privacy-bar{left:10px;right:10px;bottom:10px;padding:14px 15px;font-size:13.5px}.privacy-bar .privacy-actions{width:100%}.privacy-bar .button{flex:1 1 0}}
/* WhatsApp-knop uit beeld waar al contactknoppen staan, en zolang de privacyvraag open is. */
body>a.whatsapp{transition:opacity .25s ease,transform .25s ease,visibility 0s linear 0s}
body>a.whatsapp.is-hidden,body.privacy-bar-open>a.whatsapp{opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s ease,transform .25s ease,visibility 0s linear .25s}
/* Telefoon: hoofdknop direct onder de intro, daarna de foto. Geen krap voortgangslijntje. */
@media(max-width:720px){
 .hero-copy>.button{order:4!important;margin:0 0 26px!important}
 .hero>.hero-image{order:5!important}
 body>.scroll-guide{display:none!important}
 nav.breadcrumb>a{display:inline-flex!important;align-items:center;min-height:44px}
}
/* Voldoende contrast voor de taalwissel, het kruimelpad en de dienstnummers. */
.language-switch span,.breadcrumb span{color:#7a5f4a}
.tile-number{color:#7f5c42}
/* Footer iets beter leesbaar, lopende tekst op een prettige regellengte. */
.footer-bottom small{font-size:13px}
.marketing-copy>p{max-width:68ch}

/* Voorbeelden op telefoon: "Terug naar voorbeelden" en de eigen menubalk van het voorbeeld blijven bovenaan staan; de Stride-balk scrolt weg. */
@media(max-width:720px){
 body.demo{--stride-shell-height:0px!important}
 body.demo .stride-shell{position:relative!important}
 body.demo.v4 .demo-toolbar{position:sticky!important;top:0!important}
 body.demo #demo-back{display:inline-flex;align-items:center;min-height:44px}
 body.demo .demo-language{display:inline-flex;align-items:center;gap:2px}
 body.demo .demo-language a{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:44px}
 body.demo .phone-motion-control.in-scene{position:absolute!important;top:12px!important;right:12px!important;bottom:auto!important;left:auto!important}
}
/* iPad staand: de video vult de opening van Écurie Aurel, met de tekst eroverheen. */
@media(min-width:721px) and (max-width:1023px){
 body.demo.v4.v4-elegant-stable .aurel-video-hero .local-film{grid-column:1/-1!important;left:0!important;width:100%!important}
 body.demo.v4.v4-elegant-stable .aurel-video-hero video{object-fit:cover!important;object-position:52% center!important}
 body.demo.v4.v4-elegant-stable .aurel-video-hero:after{background:linear-gradient(0deg,#241c15e6 0%,#241c1580 42%,transparent 80%)!important}
 body.demo.v4.v4-elegant-stable .aurel-video-hero .aurel-title{top:auto!important;bottom:110px!important;left:48px!important;width:min(560px,calc(100% - 96px))!important;transform:none!important}
}
/* Minder beweging: ook de doorlopende effecten van Beyond Jumping staan stil. */
@media(prefers-reduced-motion:reduce) and (max-width:0px){
 body.demo.v4-interactive-stable *,body.demo.v4-interactive-stable *::before,body.demo.v4-interactive-stable *::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
 /* These ambient loops are switched on with stronger selectors, so they are stopped by name. */
 html body.demo.v4-interactive-stable.signature-motion.motion-user-enabled .sport-light:after,html body.demo.v4-interactive-stable.style-interactive.phone-animations .sport-aperture>img,html body.demo.v4-interactive-stable .phone-photo-frame:after{animation:none!important}
}
/* Minder beweging op de eigen site: geen schuivende blokken, wel rustig infaden en de getypte kop. */
@media(prefers-reduced-motion:reduce) and (max-width:0px){
 body.stride-fade-only .stride-reveal{transform:none!important;translate:none!important;transition:opacity .7s ease var(--stride-delay,0ms)!important}
 body.stride-fade-only .stride-reveal:not(.stride-visible){opacity:0!important}
 body.stride-fade-only :is(.touch-letter,.desktop-letter){opacity:var(--letter-opacity,1)!important}
}
/* Springstal-video's op telefoon en tablet: de foto staat erachter tot de video echt speelt, zodat het beeld nooit zwart is. */
@media(max-width:1023px){body.demo .local-film.film-waiting{background:#332b24 url(../assets/fleur-third-jump-poster.jpg?v=7) 52% center/cover no-repeat!important}body.demo .local-film.film-waiting video{opacity:0}}
/* Dienst- en werkwijzeblokken op telefoon en tablet: infaden en omhoog schuiven, zoals de andere blokken. */
.stride-reveal.stride-detail-motion{transition:opacity .7s ease var(--stride-delay,0ms),transform .8s cubic-bezier(.2,.65,.25,1) var(--stride-delay,0ms),box-shadow .4s}
/* Luxe interieur op de laptop: openingsblok met de foto links en de tekst rechts in een vaste verhouding; kop en tekst onder elkaar. */
@media(min-width:1024px){
 body.demo.v4.v4-elegant-interior .interior-intro{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)!important;gap:clamp(48px,5vw,96px)!important;align-items:center!important}
 body.demo.v4.v4-elegant-interior .interior-intro>img{width:100%!important}
 body.demo.v4.v4-elegant-interior .interior-intro>div{display:block!important;max-width:540px}
 body.demo.v4.v4-elegant-interior .interior-intro>div>h1{font-size:clamp(44px,4.2vw,66px)!important;line-height:1.08!important}
 body.demo.v4.v4-elegant-interior .interior-intro>div>p:not(.eyebrow){margin-top:28px!important;max-width:46ch}
}
/* Animatie-springstal op de laptop: de staande video in de rechterhelft, zodat het hele paard in beeld blijft; de tekst links op donker. */
@media(min-width:1024px){
 body.demo.v4.v4-interactive-stable .jump-film-hero .local-film{inset:0 0 0 auto!important;width:50%!important}
 body.demo.v4.v4-interactive-stable .jump-film-hero video{object-fit:cover!important;object-position:50% 45%!important}
 body.demo.v4.v4-interactive-stable.desktop-refined .jump-film-hero:after{background:linear-gradient(90deg,#171c20 0%,#171c20 46%,#171c2099 52%,transparent 66%)!important}
}
/* Boekingsdemo: stapnamen en tarieven goed leesbaar. */
.booking-progress li{color:#4f6157}
.booking-choice small{color:#4e5c50}
