/* Aanvraagpagina "Gratis proefdraaien met mijn klas" (proefdraaien.html) */
.tt-aanvraag{--navy:#2b3048;--grijs:#5b6070;--zacht:#8a90a0;--rand:#dcdfe8;--accent:#5e6788;--rood:#e5484d;--groen:#34c35d;
  padding:clamp(40px,5vw,72px) 0 clamp(60px,8vw,110px);background:linear-gradient(180deg,#fff8ec 0%,#fdf1ec 55%,#fff 100%)}
.tt-aanvraag__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);grid-template-areas:"kop kaart" "extra kaart";grid-template-rows:auto 1fr;column-gap:clamp(32px,5vw,72px);row-gap:0;align-items:start;max-width:1120px;margin:0 auto}
.tt-aanvraag__intro{grid-area:kop}.tt-aanvraag__extra{grid-area:extra}.tt-aanvraag__kaart{grid-area:kaart;align-self:start}

/* links */
.tt-aanvraag__eyebrow{margin:0 0 .75rem;font-size:.8rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--zacht)}
.tt-aanvraag__titel{margin:0 0 1rem;font-family:Sora,sans-serif;font-weight:700;font-size:clamp(2rem,3.4vw,2.9rem);line-height:1.08;letter-spacing:-.02em;color:var(--navy)}
.tt-aanvraag__sub{margin:0 0 2rem;font-size:1.1rem;line-height:1.6;color:#4b5064;max-width:30rem}
.tt-aanvraag__stappen{list-style:none;margin:0 0 1.75rem;padding:0;display:flex;flex-direction:column;gap:18px}
.tt-aanvraag__stappen li{position:relative;display:flex;gap:14px;align-items:flex-start}
.tt-aanvraag__stappen li:not(:last-child)::after{content:"";position:absolute;left:14px;top:34px;bottom:-16px;border-left:2px dotted #cfd2dc}
.tt-aanvraag__stappen strong{display:block;font-family:Sora,sans-serif;font-size:1rem;color:var(--navy)}
.tt-aanvraag__stappen span:not(.tt-aanvraag__nr){display:block;margin-top:2px;font-size:.95rem;color:var(--grijs)}
.tt-aanvraag__nr{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;font:700 .85rem Sora,sans-serif}
.tt-aanvraag__nr--oranje{background:#ff6b00}
.tt-aanvraag__zeker{list-style:none;margin:0 0 1.75rem;padding:0;display:flex;flex-direction:column;gap:10px}
.tt-aanvraag__zeker li{padding-left:30px;font-size:.98rem;color:var(--navy);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%2334c35d'/%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") left 2px/20px no-repeat}
.tt-aanvraag__quote{margin:0;padding:18px 20px;border-radius:16px;background:rgba(255,255,255,.75);border:1px solid rgba(43,48,72,.06);max-width:30rem}
.tt-aanvraag__quote blockquote{margin:0 0 12px;font-size:1.02rem;line-height:1.5;color:var(--navy)}
.tt-aanvraag__quote figcaption{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--zacht)}
.tt-aanvraag__quote strong{color:var(--navy)}
.tt-aanvraag__av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#505975;color:#fff;font:700 .85rem Sora,sans-serif}

/* kaart + formulier */
.tt-aanvraag__kaart{position:sticky;top:110px;background:#fff;border-radius:24px;padding:clamp(24px,3vw,40px);box-shadow:0 24px 60px rgba(43,48,72,.12),0 2px 6px rgba(43,48,72,.05)}
.tt-form__kop h2,.tt-bedankt h2{margin:0 0 .25rem;font-family:Sora,sans-serif;font-weight:700;font-size:1.45rem;color:var(--navy)}
.tt-form__kop p{margin:0 0 1.5rem;font-size:.85rem;color:var(--zacht)}
.tt-veld{margin:0 0 18px;padding:0;border:0;min-width:0}
.tt-veld label,.tt-veld legend{display:block;margin:0 0 7px;padding:0;font-size:.92rem;font-weight:600;color:var(--navy)}
.tt-veld label span[aria-hidden],.tt-veld legend span[aria-hidden],.tt-form__kop span{color:var(--rood)}
.tt-veld__optioneel{margin-left:6px;font-weight:500;font-size:.8rem;color:var(--zacht)}
.tt-veld input[type=text],.tt-veld input[type=email],.tt-veld textarea{width:100%;box-sizing:border-box;height:50px;padding:0 16px;border:1.5px solid var(--rand);border-radius:12px;background:#fff;font:inherit;font-size:1rem;color:var(--navy);transition:border-color .15s,box-shadow .15s}
.tt-veld textarea{height:auto;min-height:88px;padding:12px 16px;line-height:1.5;resize:vertical}
.tt-veld input::placeholder,.tt-veld textarea::placeholder{color:#a9adba}
.tt-veld input:focus,.tt-veld textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(94,103,136,.15)}
.tt-veld.is-fout input,.tt-veld.is-fout textarea{border-color:var(--rood);box-shadow:0 0 0 4px rgba(229,72,77,.12)}
.tt-veld__fout{margin:6px 0 0;font-size:.85rem;color:var(--rood);display:none}
.tt-veld.is-fout .tt-veld__fout{display:block}

/* keuzepillen */
.tt-keuze{display:flex;flex-wrap:wrap;gap:8px}
.tt-keuze label{position:relative;margin:0;font-weight:600}
.tt-keuze input{position:absolute;opacity:0;width:1px;height:1px}
.tt-keuze span{display:inline-flex;align-items:center;height:44px;padding:0 18px;border:1.5px solid var(--rand);border-radius:999px;background:#fff;font-size:.95rem;color:var(--navy);cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .15s}
.tt-keuze span:hover{border-color:#b9bdca}
.tt-keuze input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.tt-keuze input:focus-visible+span{box-shadow:0 0 0 4px rgba(94,103,136,.2)}
.tt-veld.is-fout .tt-keuze span{border-color:#f2b8ba}

/* akkoord */
.tt-vink{display:flex!important;gap:12px;align-items:flex-start;font-weight:500!important;font-size:.92rem!important;line-height:1.45;color:var(--grijs)!important;cursor:pointer}
.tt-vink input{position:absolute;opacity:0;width:1px;height:1px}
.tt-vink__vak{flex:none;width:22px;height:22px;margin-top:1px;border:1.5px solid var(--rand);border-radius:7px;background:#fff;transition:background .15s,border-color .15s}
.tt-vink input:checked+.tt-vink__vak{background:var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;border-color:var(--navy)}
.tt-vink input:focus-visible+.tt-vink__vak{box-shadow:0 0 0 4px rgba(94,103,136,.2)}
.tt-veld--akkoord.is-fout .tt-vink__vak{border-color:var(--rood)}

/* knop */
.tt-form__val{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.tt-form__knop{position:relative;display:flex!important;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;margin-top:6px;font-size:1.05rem!important;font-weight:600}
.tt-form__pijl{transition:transform .2s}
.tt-form__knop:hover .tt-form__pijl{transform:translateX(3px)}
.tt-form__laden{display:none;width:20px;height:20px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:tt-draai .7s linear infinite}
.tt-form.is-bezig .tt-form__knoptekst,.tt-form.is-bezig .tt-form__pijl{display:none}
.tt-form.is-bezig .tt-form__laden{display:block}
.tt-form.is-bezig .tt-form__knop{pointer-events:none;opacity:.85}
@keyframes tt-draai{to{transform:rotate(360deg)}}
.tt-form__klein{margin:12px 0 0;text-align:center;font-size:.85rem;color:var(--zacht)}
.tt-form__melding{margin:14px 0 0;padding:12px 14px;border-radius:12px;background:#fdecec;color:#b42318;font-size:.92rem}

/* bevestiging */
.tt-bedankt{text-align:center;padding:12px 0 4px;outline:none;animation:tt-in .45s cubic-bezier(.16,1,.3,1) both}
.tt-bedankt__vink{width:76px;height:76px;margin:0 auto 18px}
.tt-bedankt__vink svg{width:100%;height:100%}
.tt-bedankt__vink circle{fill:#e8f7ee;stroke:var(--groen);stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151;animation:tt-teken .6s .1s ease-out forwards}
.tt-bedankt__vink path{fill:none;stroke:var(--groen);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:36;stroke-dashoffset:36;animation:tt-teken .4s .55s ease-out forwards}
.tt-bedankt__tekst{margin:.5rem auto 1.75rem;max-width:26rem;font-size:1.02rem;line-height:1.6;color:var(--grijs)}
.tt-bedankt__tekst strong{color:var(--navy)}
.tt-aanvraag__stappen--klein{max-width:18rem;margin:0 auto 1.75rem;text-align:left}
.tt-aanvraag__stappen--klein li.is-klaar .tt-aanvraag__nr{background:var(--groen)}
.tt-bedankt__knoppen{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
@keyframes tt-teken{to{stroke-dashoffset:0}}
@keyframes tt-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

@media (max-width:991px){
  .tt-aanvraag__grid{grid-template-columns:1fr;grid-template-areas:"kop" "kaart" "extra";grid-template-rows:auto;row-gap:28px}
  .tt-aanvraag__kaart{position:static}
  .tt-aanvraag__quote{display:none}
}
@media (prefers-reduced-motion:reduce){.tt-bedankt,.tt-bedankt__vink circle,.tt-bedankt__vink path{animation:none;stroke-dashoffset:0}}

/* ===== v2: animaties, vervolgsectie ===== */
.tt-aanvraag{position:relative;overflow:hidden;overflow:clip}
.tt-aanvraag::before,.tt-aanvraag::after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:0}
.tt-aanvraag::before{width:520px;height:520px;left:-180px;top:-160px;background:radial-gradient(circle,rgba(255,206,120,.28),rgba(255,206,120,0) 70%)}
.tt-aanvraag::after{width:620px;height:620px;right:-220px;bottom:-260px;background:radial-gradient(circle,rgba(150,170,255,.18),rgba(150,170,255,0) 70%)}
.tt-aanvraag .container{position:relative;z-index:1}
.tt-aanvraag__sub{margin-bottom:1.6rem}

/* hoogtepunten-video (Remotion, stille lus) */
.tt-aanvraag__foto{position:relative;margin:0 0 1.75rem;border-radius:24px;overflow:hidden;isolation:isolate;background:#fdefe7;box-shadow:0 22px 50px rgba(43,48,72,.14),0 2px 6px rgba(43,48,72,.05)}
.tt-aanvraag__video{display:block;width:100%;height:auto;aspect-ratio:1280/832;object-fit:cover}

/* binnenkomst */
.tt-in{opacity:0;transform:translateY(16px);animation:tt-omhoog .7s cubic-bezier(.16,1,.3,1) forwards;animation-delay:var(--d,0s)}
.tt-foto-in{opacity:0;transform:translateY(20px) scale(.97);animation:tt-omhoog .9s cubic-bezier(.16,1,.3,1) .3s forwards}
.tt-kaart-in{opacity:0;transform:translateY(24px);animation:tt-omhoog .8s cubic-bezier(.16,1,.3,1) .22s forwards}
@keyframes tt-omhoog{to{opacity:1;transform:none}}

/* velden: kleine reacties */
.tt-veld:focus-within>label,.tt-veld:focus-within>legend{color:var(--accent)}
.tt-keuze input:checked+span{animation:tt-kies .32s cubic-bezier(.34,1.56,.64,1)}
@keyframes tt-kies{0%{transform:scale(.92)}60%{transform:scale(1.05)}100%{transform:scale(1)}}
.tt-form__knop{transition:transform .2s ease,box-shadow .2s ease}
.tt-form__knop:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(94,103,136,.28)}

/* vervolgsectie: dezelfde stappenkaarten als op de homepage */
.tt-vervolg{padding:clamp(56px,7vw,96px) 0 clamp(40px,5vw,72px)}
.tt-vervolg__binnen{max-width:1120px;margin:0 auto}
.tt-vervolg .tt-aanbod__stappen{margin:0;padding:0;border:0}
.tt-vervolg__titel{margin:0 0 1.75rem;font-family:Sora,sans-serif;font-weight:700;font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.015em;color:#2b3048}
.tt-vervolg .tt-stap{background:#fdf8f3;box-shadow:0 1px 0 rgba(43,48,72,.04)}
.tt-onthul .tt-stap,.tt-onthul .tt-vervolg__titel,.tt-onthul .tt-aanvraag__eyebrow{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.tt-onthul.is-in .tt-stap,.tt-onthul.is-in .tt-vervolg__titel,.tt-onthul.is-in .tt-aanvraag__eyebrow{opacity:1;transform:none}
.tt-onthul.is-in .tt-stap:nth-child(1){transition-delay:.12s}.tt-onthul.is-in .tt-stap:nth-child(2){transition-delay:.24s}.tt-onthul.is-in .tt-stap:nth-child(3){transition-delay:.36s}

/* ===== v3: meer beweging ===== */
/* zachte vlekken die langzaam zweven */
.tt-aanvraag::before{animation:tt-zweef 14s ease-in-out infinite alternate}
.tt-aanvraag::after{animation:tt-zweef 17s ease-in-out -6s infinite alternate-reverse}
@keyframes tt-zweef{from{transform:translate(0,0) scale(1)}to{transform:translate(60px,40px) scale(1.12)}}
/* formulier bouwt zich op na de kaart */
.tt-kaart-in .tt-form>*:not([type=hidden]):not(.tt-form__val){opacity:0;transform:translateY(12px);animation:tt-omhoog .6s cubic-bezier(.16,1,.3,1) forwards}
.tt-kaart-in .tt-form>:nth-child(1){animation-delay:.38s}.tt-kaart-in .tt-form>:nth-child(2){animation-delay:.44s}.tt-kaart-in .tt-form>:nth-child(3){animation-delay:.5s}
.tt-kaart-in .tt-form>:nth-child(4){animation-delay:.56s}.tt-kaart-in .tt-form>:nth-child(5){animation-delay:.62s}.tt-kaart-in .tt-form>:nth-child(6){animation-delay:.68s}
.tt-kaart-in .tt-form>:nth-child(7){animation-delay:.74s}.tt-kaart-in .tt-form>:nth-child(8){animation-delay:.8s}.tt-kaart-in .tt-form>:nth-child(n+9){animation-delay:.86s}
/* stappenkaarten reageren op de muis */
.tt-vervolg .tt-stap{transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1),box-shadow .25s ease}
.tt-onthul.is-in .tt-stap:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(43,48,72,.1);transition-delay:0s}

@media (max-width:991px){.tt-aanvraag__foto{margin-bottom:1.5rem}}
@media (prefers-reduced-motion:reduce){.tt-aanvraag::before,.tt-aanvraag::after{animation:none}.tt-kaart-in .tt-form>*{animation:none!important;opacity:1!important;transform:none!important}}
@media (prefers-reduced-motion:reduce){.tt-in,.tt-foto-in,.tt-kaart-in{animation:none;opacity:1;transform:none}.tt-onthul .tt-stap,.tt-onthul .tt-vervolg__titel,.tt-onthul .tt-aanvraag__eyebrow{opacity:1;transform:none}}

/* ===== v4: achtergrond loopt door achter de vaste kop (zoals op voor-teamleiders), geen harde rand onder het menu ===== */
.tt-aanvraag-pagina{position:relative;isolation:isolate;overflow:hidden;overflow:clip;background:linear-gradient(180deg,#fff8ec 0,#fdf1ec 760px,#fff 1340px) no-repeat}
.tt-aanvraag-pagina::before{content:"";position:absolute;z-index:0;width:620px;height:620px;left:-200px;top:-120px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,206,120,.3),rgba(255,206,120,0) 70%);animation:tt-zweef 14s ease-in-out infinite alternate}
.tt-aanvraag{background:none}
.tt-aanvraag::before{display:none}
@media (max-width:991px){.tt-aanvraag-pagina{background:linear-gradient(180deg,#fff8ec 0,#fdf1ec 1200px,#fff 2300px) no-repeat}}
@media (prefers-reduced-motion:reduce){.tt-aanvraag-pagina::before{animation:none}}
/* lila vlek rechtsonder volledig laten uitvloeien vóór de rand van de sectie (geen afgesneden kant) */
.tt-aanvraag::after{bottom:0;right:-250px;background:radial-gradient(closest-side,rgba(150,170,255,.2),rgba(150,170,255,0))}