/* BFZ home — verfijning (okt 2026): luxe verfijningen per deel van de homepage, bovenop de hoofdstukken. */

/* ===== verfijning: hero, statement, clubfoto, resultaten ===== */
/* BFZ home — verfijning bovenste hoofdstukken (okt 2026): hero, statement, cinemaband, resultaten-opening.
   Enkel overrides, na alle andere stylesheets. Minder, groter, rustiger: geen schaduwen, geen schuine prints,
   geen kaders-in-kaders. Beweging alleen via transform/opacity/clip-path, traag en eenmalig of gescrubd. */

/* =========================================================================================
   1. HERO — details, geen herontwerp
   ========================================================================================= */

/* titel: iets trager en ruimer gespreid; daarna pas de knop (eerst de zin, dan de uitnodiging) */
@media (prefers-reduced-motion: no-preference) {
  html:not(.is-loading) body.v2 .hero .hero__title .line:nth-child(1) > span { animation-duration: 1.25s; animation-delay: 0.1s; }
  html:not(.is-loading) body.v2 .hero .hero__title .line:nth-child(2) > span { animation-duration: 1.25s; animation-delay: 0.26s; }
  body.v2 .hero .hero__aside { animation: verf-hero-aside 1.1s cubic-bezier(0.22, 1, 0.36, 1) 0.72s both; }
  /* poster -> film: een tragere, zachtere overvloei (desktop) */
  body.v2 .hero .hero__bg-video[data-video-src-desktop] { transition: opacity 1.9s cubic-bezier(0.4, 0, 0.2, 1); }
}
@keyframes verf-hero-aside { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* sluier die de hero rustig dimt terwijl 'Ons aanbod' eroverheen schuift (element wordt door verf.js geplaatst) */
body.v2 .hero .verf-hero-veil { position: absolute; inset: 0; z-index: 6; background: #0e0c0b; opacity: 0; pointer-events: none; }

/* knop: bij hover keert hij stil om (crème vlak -> glas met crème lijn), traag uitgeademd; enkel met muis */
@media (hover: hover) and (pointer: fine) {
  body.v2.bfz-actions .hero .hero__cta {
    transition: background-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.5s cubic-bezier(0.22, 1, 0.36, 1), scale 140ms ease;
  }
  body.v2.bfz-actions .hero .hero__cta:hover {
    background: rgba(239, 234, 227, 0.08); color: #f4eee5; border-color: rgba(239, 234, 227, 0.82);
  }
}

/* =========================================================================================
   2. STATEMENT — het label lijnt op de kapitaalhoogte van de eerste regel, de bronzen lijn tekent mee
   ========================================================================================= */
body.v2 .st .st__eyebrow { padding-top: 0.55em; }
body.v2 .st .st__eyebrow::after { width: 64px; opacity: 0.7; }
@media (max-width: 880px) {
  body.v2 .st .st__eyebrow { padding-top: 0; }
  body.v2 .st .st__eyebrow::after { width: 48px; }
}

/* =========================================================================================
   3. CINEMABAND — rand tot rand: geen afgeronde kader-in-kader meer, een zachte overgang
      uit het donker en de cijfers als filmcredits op een rustige onderrand
   ========================================================================================= */
body.v2 .cinema-photo--1 .cinema-photo__video,
body.v2.js-motion .cinema-photo--1 .cinema-photo__video:not(.is-in),
body.v2 .cinema-photo--1 .cinema-photo__video.is-in {
  clip-path: none; border-radius: 0; transform: scale(1.03); transform-origin: 50% 50%;
}
@media (min-width: 881px) {
  body.v2 .cinema-photo--1 .cinema-photo__overlay {
    z-index: 1;
    background:
      linear-gradient(180deg, rgba(18, 16, 16, 0.92) 0%, rgba(18, 16, 16, 0.38) 16%, rgba(18, 16, 16, 0) 34%, rgba(18, 16, 16, 0) 58%, rgba(14, 12, 11, 0.5) 80%, rgba(14, 12, 11, 0.86) 100%);
  }
  /* de overlay ligt nu boven de film (die had z-index 1) */
  body.v2 .cinema-photo--1 .cinema-photo__video--desktop { z-index: 0; }
  body.v2 .cinema-photo--1 .cinema-credit { z-index: 2; bottom: clamp(30px, 4.4vw, 56px); text-shadow: none; letter-spacing: 0.28em; }
}
body.v2 .cinema-photo--1 .cinema-credit .dot { opacity: 0.9; }
@media (max-width: 880px) and (prefers-reduced-motion: no-preference) {
  /* telefoon: de cijfers sluiten het statement af als één rustige creditregel tussen twee haarlijnen */
  body.v2 .cinema-photo--1 { padding: 0 var(--gutter) 64px; }
  body.v2 .cinema-photo--1 .cinema-credit {
    margin: 0; padding: 18px 0; border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 10px; letter-spacing: 0.2em; line-height: 1.8; text-shadow: none; color: #efeae3;
  }
  body.v2 .cinema-photo--1 .cinema-credit .dot { padding: 0 8px; }
}

/* =========================================================================================
   4. RESULTATEN — de opening als gecomponeerde spread i.p.v. losse prints:
      vier beelden (twee groot die over de rand lopen, twee klein binnen de marge), recht,
      zonder schaduw, elk met een eigen diepte. Kleur blijft.
   ========================================================================================= */
/* de oude zwevende prints: geen rotatie, geen schaal, geen fade van hoofdstukken.js */
body.v2 .rs .rs-open .rs-open__ph { transform: none !important; opacity: 1 !important; will-change: auto; }
body.v2 .rs .rs-open :is(.rs-open__ph--2, .rs-open__ph--5, .rs-open__ph--7) { display: none; }
body.v2 .rs .rs-open .rs-open__frame {
  transform: none; box-shadow: none; background: #e2dcd3; aspect-ratio: var(--ar, 3 / 4);
}
body.v2 .rs .rs-open .rs-open__img {
  inset: -8% 0 auto 0; height: 116%; object-position: var(--pos, 50% 35%);
  filter: saturate(0.9) contrast(1.02);
}
/* desktop: twee banen naast het statement; groot = dichtbij (loopt over de rand, beweegt sneller),
   klein = verder (binnen de marge, trager) */
/* maten volgen de breedte, maar nooit hoger dan de scène toelaat (brede, lage schermen) */
body.v2 .rs .rs-open .rs-open__collage { --wb: min(17%, 30vh); --ws: min(9%, 15vh); --rand: 4%; }
body.v2 .rs .rs-open .rs-open__ph--1 { --x: var(--rand); --y: 9%; --w: var(--wb); --ar: 3 / 4; --pos: 50% 40%; z-index: 2; }
body.v2 .rs .rs-open .rs-open__ph--3 { --x: calc(var(--rand) + var(--wb) * 0.55); --y: 70%; --w: var(--ws); --ar: 4 / 5; --pos: 50% 30%; z-index: 1; }
body.v2 .rs .rs-open .rs-open__ph--6 { --x: calc(100% - var(--rand) - var(--wb) * 0.55 - var(--ws)); --y: 12%; --w: var(--ws); --ar: 4 / 5; --pos: 50% 35%; z-index: 1; }
body.v2 .rs .rs-open .rs-open__ph--4 { --x: calc(100% - var(--rand) - var(--wb)); --y: 52%; --w: var(--wb); --ar: 3 / 4; --pos: 45% 40%; z-index: 2; }

/* telefoon: twee beelden boven, twee onder het statement, gespiegeld; de grote lopen over de rand */
@media (max-width: 880px) {
  body.v2 .rs .rs-open .rs-open__stage { padding: calc(var(--gutter) + 90vw) 0 106vw; }
  body.v2 .rs .rs-open .rs-open__ph--6 { display: block; }
  body.v2 .rs .rs-open .rs-open__ph--1 { --x: -6vw; --y: var(--gutter); --w: 58vw; }
  body.v2 .rs .rs-open .rs-open__ph--6 { --x: calc(100% - var(--gutter) - 34vw); --y: calc(var(--gutter) + 30vw); --w: 34vw; }
  body.v2 .rs .rs-open .rs-open__ph--3 { --x: var(--gutter); --y: auto; --w: 34vw; bottom: 51vw; }
  body.v2 .rs .rs-open .rs-open__ph--4 { --x: calc(100% - 52vw); --y: auto; --w: 58vw; bottom: 2vw; }
}
@media (max-width: 420px) {
  body.v2 .rs .rs-open .rs-open__stage { padding-top: calc(var(--gutter) + 90vw); }
}

/* reduced motion: alles stil en zichtbaar, het beeld gewoon in zijn kader */
@media (prefers-reduced-motion: reduce) {
  body.v2 .rs .rs-open .rs-open__frame, body.v2 .rs .rs-open .rs-open__img { transform: none !important; }
  body.v2 .rs .rs-open .rs-open__img { inset: 0; height: 100%; }
  body.v2 .hero .verf-hero-veil { display: none; }
  body.v2 .cinema-photo--1 .cinema-photo__video { transform: none; }
}

/* ===== verfijning: partners, reviews, team ===== */
/* BFZ home — verfijning 'midden' (okt 2026): partners, reviews, team.
   Laadt na alle andere stylesheets. Elke regel is gescoped op zijn eigen sectie. */

/* =====================================================================================
   PARTNERS — 'Vertrouwd door.': een rustig register in plaats van een logowand
   ===================================================================================== */
body.v2 section.partners.aurora-host {
  padding: clamp(84px, 9vw, 136px) 0 clamp(72px, 8vw, 120px);
}
body.v2 section.partners.aurora-host .partners__intro { margin-bottom: clamp(36px, 4.2vw, 60px); }
/* twee banen, gescheiden door één haarlijn die naar de randen uitvloeit (het masker neemt de lijn mee) */
body.v2 section.partners.aurora-host .partners__marquee {
  padding: clamp(24px, 2.4vw, 36px) 0;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
body.v2 section.partners.aurora-host .partners__marquee + .partners__marquee { border-top: 1px solid rgba(255, 255, 255, 0.09); }
body.v2 section.partners.aurora-host .partners__track { gap: clamp(76px, 6.6vw, 112px); }
/* één gelijke crèmetoon voor álle merken (de svg's kregen hun inversie niet meer, Zichtbar viel weg) */
body.v2 section.partners.aurora-host .partners__marquee img.partners__icon {
  height: 40px; max-width: 176px; opacity: 0.58; filter: grayscale(1) brightness(1.5);
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
body.v2 section.partners.aurora-host .partners__marquee img.partners__icon[src$=".svg"] { filter: grayscale(1) invert(1) brightness(1.75); }
body.v2 section.partners.aurora-host .partners__marquee img.partners__icon:is([src*="flandrien-kaas"], [src*="pasfrost"]) { filter: grayscale(1) brightness(1.75); }
body.v2 section.partners.aurora-host .partners__item:hover { transform: none; }
@media (hover: hover) and (pointer: fine) {
  body.v2 section.partners.aurora-host .partners__item:hover img.partners__icon { opacity: 0.92; }
}
body.v2 section.partners.aurora-host .partners__item:focus-visible { outline: 1px solid #b9885e; outline-offset: 6px; }
body.v2 section.partners.aurora-host .partners__item:focus-visible img.partners__icon { opacity: 0.92; }
@media (max-width: 880px) {
  body.v2 section.partners.aurora-host { padding: 72px 0 60px; }
  body.v2 section.partners.aurora-host .partners__intro { margin-bottom: 28px; }
  body.v2 section.partners.aurora-host .partners__marquee { padding: 20px 0;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
            mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
  body.v2 section.partners.aurora-host .partners__track { gap: 44px; padding: 0 24px; }
  body.v2 section.partners.aurora-host .partners__marquee img.partners__icon { height: 34px; max-width: 128px; }
}

/* =====================================================================================
   REVIEWS — 'Wat onze leden zeggen.': geen kaarten meer. Grote citaten op het crème vlak,
   gescheiden door verticale haarlijnen met een bronzen aanzet; één beeld zonder kader als adempauze.
   De rail blijft: gepind en horizontaal op desktop, een veegrail op mobiel.
   ===================================================================================== */
body.v2 section.testimonials[data-rv] {
  --rv-gap: 0px;
  --rv-card: clamp(380px, 33vw, 540px);
  --rv-hair: rgba(23, 20, 17, 0.15);
  --rv-side: clamp(30px, 3.2vw, 60px);
}
/* het hele spoor is één crème vel: wat over de titel schuift, dekt hem af achter de haarlijn */
body.v2 section.testimonials[data-rv] .rv__item { background: #efeae3; }
body.v2 section.testimonials[data-rv] .rv__item--spacer { background: transparent; }

body.v2 section.testimonials[data-rv] .rv__card {
  overflow: visible; background: transparent; border: 0; border-left: 1px solid var(--rv-hair);
  padding: 2px var(--rv-side) 0;
}
/* bronzen aanzet bovenaan de haarlijn; tekent zich door bij aandacht */
body.v2 section.testimonials[data-rv] .rv__card::before {
  left: -1px; top: 0; width: 1px; height: 100%;
  transform: scaleY(var(--rv-seg, 0.12)); transform-origin: 50% 0;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
body.v2 section.testimonials[data-rv] .rv__top {
  align-items: flex-start; padding-bottom: 0; margin-bottom: clamp(30px, 3.6vw, 56px); border-bottom: 0;
}
body.v2 section.testimonials[data-rv] .rv__num { font-size: clamp(44px, 3.7vw, 62px); line-height: 0.8; }
body.v2 section.testimonials[data-rv] .rv__stars { margin-top: 4px; font-size: 10px; letter-spacing: 0.34em; }
body.v2 section.testimonials[data-rv] .rv__text {
  margin: 0 0 clamp(34px, 3.6vw, 56px);
  font-size: clamp(20px, 1.7vw, 27px); line-height: 1.38; letter-spacing: -0.012em; color: #1d1915;
  text-indent: -0.42em; /* het openingsteken hangt in de marge: de tekst staat strak op de lijn */
}
/* de korte stemmen krijgen de maat van een statement */
body.v2 section.testimonials[data-rv] .rv__item:is(:nth-child(11), :nth-child(12)) .rv__text {
  font-size: clamp(25px, 2.35vw, 38px); line-height: 1.22; letter-spacing: -0.018em;
}
body.v2 section.testimonials[data-rv] .rv__by { gap: 8px; }
body.v2 section.testimonials[data-rv] .rv__name { font-size: 11px; letter-spacing: 0.16em; }

/* beeld zonder kader: hoog, randloos, tussen de stemmen */
body.v2 section.testimonials[data-rv] .rv__item--photo {
  width: calc(var(--rv-card) * 0.86); padding: 0 var(--rv-side); align-items: stretch;
}
body.v2 section.testimonials[data-rv] .rv__photo { height: 100%; background: transparent; }
body.v2 section.testimonials[data-rv] .rv__photo img { filter: saturate(0.88) contrast(1.02); }

/* het donkere vlak wordt een typografische pauze: enkel het bronzen aanhalingsteken */
body.v2 section.testimonials[data-rv] .rv__item--field { width: calc(var(--rv-card) * 0.5); align-items: stretch; }
body.v2 section.testimonials[data-rv] .rv__field { height: 100%; overflow: visible; background: transparent; }
body.v2 section.testimonials[data-rv] .rv__field::after { display: none; }
body.v2 section.testimonials[data-rv] .rv__field-mark {
  left: 18%; top: 50%; margin-top: -0.36em; font-size: clamp(220px, 20vw, 340px); line-height: 1; color: #9a6c45; opacity: 0.9;
}

/* met verf.js: de aanzet volgt de rail (scrub), dus geen eigen overgang */
body.v2 section.testimonials.rv--seg[data-rv] .rv__card::before { transition: none; }

@media (hover: hover) and (pointer: fine) {
  body.v2 section.testimonials[data-rv] .rv__card:hover { border-color: var(--rv-hair); }
  body.v2 section.testimonials[data-rv] .rv__card:hover::before { transform: scaleY(1); }
}

@media (min-width: 881px) {
  body.v2 section.testimonials.rv--pin[data-rv] .rv__card { min-height: min(60vh, 580px); }
  /* het beeld breekt licht uit boven en onder de lijn van de citaten */
  body.v2 section.testimonials.rv--pin[data-rv] .rv__photo { height: calc(100% + 72px); margin: -36px 0; }
  body.v2 section.testimonials.rv--pin[data-rv] .rv__item--spacer { width: calc(var(--rv-head) + clamp(24px, 3.4vw, 64px)); }
}

@media (max-width: 880px) {
  body.v2 section.testimonials[data-rv] { --rv-card: min(86vw, 380px); --rv-side: 24px; }
  body.v2 section.testimonials[data-rv] .rv__card { padding: 2px 24px 0 22px; }
  body.v2 section.testimonials[data-rv] .rv__top { margin-bottom: 28px; }
  body.v2 section.testimonials[data-rv] .rv__num { font-size: 44px; }
  body.v2 section.testimonials[data-rv] .rv__text { font-size: 18px; line-height: 1.46; margin-bottom: 32px; }
  body.v2 section.testimonials[data-rv] .rv__item:is(:nth-child(11), :nth-child(12)) .rv__text { font-size: 22px; line-height: 1.3; }
  body.v2 section.testimonials[data-rv] .rv__item--photo { width: 66vw; padding: 0 22px; }
  body.v2 section.testimonials[data-rv] .rv__item--field { width: 38vw; }
  body.v2 section.testimonials[data-rv] .rv__field-mark { left: 10%; font-size: 190px; }
}

@media (prefers-reduced-motion: reduce) {
  body.v2 section.testimonials[data-rv] .rv__card::before { transition: none; transform: scaleY(0.12); }
}

/* =====================================================================================
   TEAM — 'Eén team, één visie.': een redactionele portretreeks in plaats van een raster.
   Geen kolomlijnen, één beeldverhouding, het onderschrift als museumlabel, focus bij aandacht.
   ===================================================================================== */
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__lines { display: none; }

/* één verhouding: het verspringen wordt een ritme in plaats van toeval */
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n) .tm__frame { aspect-ratio: 2 / 3; }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(2) { padding-top: clamp(64px, 8.4vw, 150px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(3) { padding-top: clamp(24px, 3vw, 54px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(4) { padding-top: clamp(84px, 11vw, 196px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(5) { padding-top: clamp(40px, 5.4vw, 96px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__frame { background: #171411; }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__frame::after { display: none; }

/* het onderschrift: naam en nummer op één lijn, haarlijn, functie */
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__drift {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "frame frame" "name num" "role role";
  column-gap: 16px;
}
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__frame { grid-area: frame; }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__name {
  grid-area: name; margin: 24px 0 0; font-size: clamp(18px, 1.55vw, 25px); letter-spacing: 0.01em;
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__num {
  grid-area: num; align-self: end; margin: 0 0 1px; gap: 0;
  font-size: 10px; letter-spacing: 0.16em; color: #b9885e;
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__num::after { display: none; }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__role {
  grid-area: role; margin: 14px 0 0; padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: linear-gradient(#b9885e, #b9885e) no-repeat 0 -1px / 0% 1px;
  color: #b5aba0;
  transition: background-size 1.1s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__img { transition: filter 1.1s cubic-bezier(0.22, 1, 0.36, 1); }

/* aandacht (muis): het gekozen portret blijft helder, de anderen treden terug; de lijn tekent zich in brons */
@media (hover: hover) and (pointer: fine) {
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:hover .tm__img { filter: none; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__wall:has(.tm__member:hover) .tm__member:not(:hover) .tm__img { filter: brightness(0.6) saturate(0.82); }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__wall:has(.tm__member:hover) .tm__member:not(:hover) :is(.tm__name, .tm__role, .tm__num) { opacity: 0.45; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:hover .tm__role { background-size: 100% 1px; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:hover .tm__num { color: #b9885e; }
}

@media (max-width: 880px) {
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n) { padding-top: 0; padding-bottom: 36px; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(1) { padding-bottom: 48px; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(1) .tm__frame { aspect-ratio: 4 / 5; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n+2) .tm__frame { aspect-ratio: 2 / 3; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__drift { column-gap: 10px; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__name { margin-top: 16px; font-size: 16px; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(1) .tm__name { margin-top: 20px; font-size: 22px; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__num { font-size: 9.5px; letter-spacing: 0.12em; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__role { margin-top: 10px; padding-top: 9px; font-size: 9.5px; }
}

@media (prefers-reduced-motion: reduce) {
  body.v2 section.coaches[aria-labelledby="coaches-title"] :is(.tm__img, .tm__name, .tm__num, .tm__role) { transition: none; }
}

/* ===== verfijning: kaart, slot, ritme, menubalk, badge ===== */
/* BFZ home — verfijning onderste helft (okt 2026): kaart, slot en het ritme ertussen.
   Enkel aftrekken en verfijnen: geen kaders rond de kaart, geen doosjes rond de minuten, een navigatie die
   meekleurt met het crème vlak, een rustige B&W-film in het slot en een sig-mark die zich terugtrekt. */

/* ======================================================================
   RITME — naden tussen hoofdstukken
   Een kleurwissel (crème <-> donker) is zelf de naad: geen extra haarlijn erbovenop.
   ====================================================================== */

body.v2 section.partners { border-top: 0; }

/* ======================================================================
   NAVIGATIE — kleurt mee op crème (verf.js zet body.verf-nav-licht)
   Op donker: de bestaande donkere glasbalk. Op crème: crème glas met donkere inkt, in plaats van
   een troebele grijsbruine band (donker glas 78 % over crème).
   Zonder :has-ondersteuning valt de hele regel weg en blijft de donkere balk staan.
   ====================================================================== */
body.v2 .nav.is-scrolled {
  transition: padding 0.4s var(--ease-cinema), transform 0.45s var(--ease-cinema),
              background-color 0.6s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
body.v2 .nav .nav__logo img { transition: filter 0.6s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.6s ease; }
body.v2 .nav .nav__hamburger-line { transition: transform 0.4s var(--ease-cinema), opacity 0.3s var(--ease-cinema), background-color 0.6s ease; }
body.v2 .nav .nav__hamburger::before { transition: color 0.6s ease; }

body.v2.verf-nav-licht .nav.is-scrolled:not(:has(.nav__hamburger.is-open)) {
  background-color: rgba(239, 234, 227, 0.84);
  border-bottom-color: rgba(23, 20, 17, 0.1);
  --action-ink: #24201c; --action-line: rgba(69, 57, 43, 0.42); --action-wash: rgba(69, 57, 43, 0.055);
  --action-solid: #2c2823; --action-solid-ink: #f4eee5; --action-solid-hover: #433b32;
  --fg: #171411;
}
body.v2.verf-nav-licht .nav.is-scrolled:not(:has(.nav__hamburger.is-open)) .nav__logo img { filter: brightness(0); opacity: 0.9; }
body.v2.verf-nav-licht .nav.is-scrolled:not(:has(.nav__hamburger.is-open)) .nav__hamburger-line { background-color: #171411; }
body.v2.verf-nav-licht .nav.is-scrolled:not(:has(.nav__hamburger.is-open)) .nav__hamburger::before { color: #171411; }
body.v2.bfz-actions.verf-nav-licht .nav.is-scrolled:not(:has(.nav__hamburger.is-open)) .nav__cta { color: var(--action-ink); border-color: var(--action-line); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body.v2.verf-nav-licht .nav.is-scrolled:not(:has(.nav__hamburger.is-open)) { background-color: rgba(239, 234, 227, 0.97); }
}

/* ======================================================================
   SIG-MARK — de draaiende stempel hoort bij de opening. In de onderste helft (vanaf de resultaten)
   trekt hij zich terug: hij botste met de kaartlabels, de +-tekens van de vragen en het slotstatement.
   ====================================================================== */
body.v2 .sig-mark { transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1); }
body.v2.verf-sig-rust .sig-mark { opacity: 0; pointer-events: none; }

/* ======================================================================
   VLOT BEREIKBAAR — de kaart zonder kader
   De kaart stond in een eigen donkerder vak met rand; nu ligt ze open op het vlak van de sectie,
   alleen de ringen, de bronzen lijnen en een zachte gloed rond BFZ. De minuten zijn typografie
   (geen omkaderde doosjes meer); het 'plaatje' achter elk label is de kleur van de sectie, zodat
   het label gewoon een onderbreking in de lijn is.
   ====================================================================== */


/* labels op de lijn: geen hoekig plaatje, maar een zachte uitsparing in de kleur van het vlak */





/* het centrum ademt trager en zachter */



/* legenda: het nummer kleurt brons zodra de lijn getekend is — het bolletje ervoor was dubbel op */






/* ======================================================================
   STAP BINNEN — een zachtere zwart-witfilm
   De ramen en tl-lampen in de film brandden uit tot zuiver wit (contrast 1.08, helderheid 0.98); nu blijft
   het zwart diep en zakken de lichten naar een zacht grijs: rustiger, meer 'film' dan 'fotokopie'.
   ====================================================================== */
body.v2 section.final-cta .fc__frame > .final-cta__video { filter: grayscale(1) contrast(1.02) brightness(0.86); }
body.v2 section.final-cta .fc__frame > .final-cta__bg { filter: grayscale(1) contrast(1.04) brightness(0.82); }
body.v2 section.final-cta .fc__tag { font-weight: 300; letter-spacing: 0.16em; }

/* ======================================================================
   MOBIEL
   ====================================================================== */


/* ======================================================================
   VERMINDERDE BEWEGING
   ====================================================================== */
@media (prefers-reduced-motion: reduce) {
  body.v2 .sig-mark, body.v2 .nav.is-scrolled, body.v2 .nav .nav__logo img,
  body.v2 .nav .nav__hamburger-line, body.v2 .nav .nav__hamburger::before { transition: none; }
}



/* ===== korter scrollen (okt 2026): niets zet het scherm nog vast ===== */
body.v2 .rs .rs-open.is-scrub { height: auto; }
body.v2 .rs .rs-open.is-scrub .rs-open__stage { position: relative; top: auto; }
/* team compacter (okt 2026): rustiger ritme op desktop, een veegrij op gsm */
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n) .tm__frame { aspect-ratio: 3 / 4; }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(2) { padding-top: clamp(40px, 4.4vw, 72px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(3) { padding-top: clamp(12px, 1.4vw, 24px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(4) { padding-top: clamp(56px, 5.8vw, 96px); }
body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(5) { padding-top: clamp(24px, 2.8vw, 48px); }
@media (max-width: 880px) {
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__wall { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); margin: 40px calc(-1 * var(--gutter)) 0; padding: 0 var(--gutter) 6px; scrollbar-width: none; overscroll-behavior-x: contain; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__wall::-webkit-scrollbar { display: none; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n) { flex: 0 0 64%; grid-column: auto; grid-row: auto; padding: 0; scroll-snap-align: start; transform: none !important; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n) .tm__frame { aspect-ratio: 3 / 4; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(1) .tm__name { font-size: 16px; margin-top: 16px; }
}

/* ===== afgeronde fotokaders (okt 2026, in de geest van Mana): alle ingekaderde foto's onder 'Ons aanbod'
   krijgen dezelfde zachte hoek; schermvullende beelden (film, slot) blijven recht ===== */
body.v2 { --foto-hoek: 16px; }
@media (max-width: 880px) { body.v2 { --foto-hoek: 12px; } }
body.v2 .rs .rs-open__frame,
body.v2 .rs .rs__stage,
body.v2 section.coaches .tm__frame,
body.v2 .testimonials .rv__photo,
body.v2 .testimonials .rv__item--photo .rv__media { border-radius: var(--foto-hoek); overflow: hidden; }
body.v2 .rs .rs-open__frame img, body.v2 .rs .rs__stage img, body.v2 section.coaches .tm__frame img { border-radius: 0; }

/* ---------- reviews: Google als bron (okt 2026) — het Google-icoon i.p.v. de grote nummers, gele sterren,
   en naast de titel de score die naar Google linkt ---------- */
body.v2 .testimonials .rv__sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
body.v2 section.testimonials[data-rv] .rv__top { align-items: center; }
body.v2 .testimonials .rv__g { display: block; width: 26px; height: 26px; flex: none; }
body.v2 section.testimonials[data-rv] .rv__stars { margin-top: 0; font-size: 12px; letter-spacing: 0.16em; color: #f4b400; }
body.v2 .testimonials .rv__src { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body.v2 .testimonials .rv__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px 48px; flex-wrap: wrap; }
body.v2 .testimonials .rv__head > .testimonials__heading { flex: 1 1 0; min-width: 0; width: auto; margin: 0; }
@media (max-width: 880px) { body.v2 .testimonials .rv__head > .testimonials__heading { flex: none; width: 100%; } }
body.v2 .testimonials .rv__score {
  display: inline-flex; align-items: center; gap: 16px; margin: 0 0 4px; padding: 0; border: 0;
  color: #171411; text-decoration: none; -webkit-tap-highlight-color: transparent;
}
body.v2 .testimonials .rv__score-g { width: 34px; height: 34px; flex: none; }
body.v2 .testimonials .rv__score-cijfer { font-family: var(--font-display); font-size: clamp(40px, 3.4vw, 54px); font-weight: 300; line-height: 0.9; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
body.v2 .testimonials .rv__score-rest { display: flex; flex-direction: column; gap: 8px; }
body.v2 .testimonials .rv__score-sterren { font-size: 13px; line-height: 1; letter-spacing: 0.16em; color: #f4b400; }
body.v2 .testimonials .rv__score-tekst {
  font-size: 10.5px; font-weight: 500; line-height: 1.2; letter-spacing: 0.14em; text-transform: uppercase; color: #6b6157;
  background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; padding-bottom: 3px; transition: background-size 0.6s cubic-bezier(0.22, 1, 0.36, 1), color 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  body.v2 .testimonials .rv__score:hover .rv__score-tekst { background-size: 100% 1px; color: #171411; }
}
body.v2 .testimonials .rv__score:focus-visible { outline: 2px solid #b49b78; outline-offset: 6px; border-radius: 2px; }
@media (max-width: 880px) {
  body.v2 .testimonials .rv__head { flex-direction: column; align-items: flex-start; }
  body.v2 .testimonials .rv__g { width: 22px; height: 22px; }
  body.v2 .testimonials .rv__score-g { width: 28px; height: 28px; }
}

/* ---------- team (okt 2026): kop op dezelfde schaal als de andere koppen, ondertekst botst niet meer met
   'één visie', een rustig ritme in twee hoogtes en een rechte veegrij op gsm ---------- */
body.v2 .coaches #coaches-title { font-size: clamp(44px, 6vw, 96px); }
@media (min-width: 881px) {
  body.v2 .coaches .tm__sub { width: min(46ch, 30vw); margin-top: 0.35em; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(n) { padding-top: 0; }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__member:nth-child(2n) { padding-top: clamp(32px, 3.6vw, 56px); }
}
@media (min-width: 881px) and (max-width: 1279px) {
  body.v2 .coaches .tm__intro { display: block; }
  body.v2 .coaches .tm__sub { width: auto; max-width: 46ch; margin: 28px 0 0 auto; }
}
@media (max-width: 880px) {
  body.v2 .coaches #coaches-title { font-size: clamp(38px, 12vw, 64px); }
  body.v2 section.coaches[aria-labelledby="coaches-title"] .tm__drift { transform: none !important; }
}

/* clubbeeld op gsm: gewoon de foto over de volle breedte, geen lege strook meer */
@media (max-width: 880px) {
  body.v2 .cinema-photo--1 { height: 68vw; min-height: 0; padding: 0; position: relative; overflow: hidden; }
  body.v2 .cinema-photo--1 .cinema-photo__bg { display: block; position: absolute; inset: 0; background-size: cover; background-position: 50% 50%; }
  body.v2 .cinema-photo--1 .cinema-photo__overlay { display: block; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18, 16, 16, 0.85) 0%, rgba(18, 16, 16, 0) 30%, rgba(18, 16, 16, 0) 70%, rgba(18, 16, 16, 0.5) 100%); }
  body.v2 .cinema-photo--1 .cinema-photo__video { display: none !important; }
}

/* 'Ons aanbod': ook dit fotokader afgerond, zoals alle andere */
body.v2 .offer-gallery { border-radius: 16px; overflow: hidden; }
@media (max-width: 880px) { body.v2 .offer-gallery { border-radius: 12px; } }