/* 1.3 — rustige beweging, zonder videobestanden of extra bibliotheken. */
.hero-image{transform-origin:60% 45%;animation:godive-ocean-drift 26s ease-in-out infinite alternate;will-change:transform}
.hero::after{content:"";position:absolute;inset:-25%;z-index:-1;pointer-events:none;background:linear-gradient(115deg,transparent 38%,#ffffff08 46%,#ffffff02 53%,transparent 63%);transform:translateX(-12%);animation:godive-light-drift 20s ease-in-out infinite alternate}
.hero-content>.eyebrow{animation:godive-enter .8s ease both}.hero-content>h1{animation:godive-enter 1s .1s ease both}.hero-content>.hero-copy{animation:godive-enter 1s .23s ease both}.hero-actions{animation:godive-enter 1s .36s ease both}.hero-bottom a>span{display:inline-block;animation:godive-scroll-cue 3s 1.5s ease-in-out infinite}
.page-heading{overflow:hidden}.page-title-image{animation:godive-title-drift 22s ease-in-out infinite alternate;transform-origin:center;will-change:transform}.page-heading .container{animation:godive-enter .8s ease both}
.button{position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s,background .25s}.button::after{content:"";position:absolute;inset:-80% auto -80% -70%;width:35%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,#ffffff26,transparent);pointer-events:none;transition:left .6s ease}.button:hover::after,.button:focus-visible::after{left:140%}.button>span{transition:transform .25s ease}.button:hover>span{transform:translate(2px,-2px)}
.course-photo img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}.course-card{transition:transform .35s ease,box-shadow .35s ease}.course-card:hover{transform:translateY(-6px)}.intro-visual>img{transition:transform .8s ease}.intro-visual:hover>img{transform:translateY(-4px)}
.motion-reveal{opacity:0;transform:translateY(22px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1);transition-delay:var(--motion-delay,0ms)}.motion-reveal.motion-visible{opacity:1;transform:none}
body.godive-motion-paused .hero-image,body.godive-motion-paused .hero::after,body.godive-motion-paused .hero-bottom a>span,body.godive-motion-paused .page-title-image{animation-play-state:paused}
.motion-control{position:absolute;right:0;bottom:0;display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:6px 10px;background:#101a2266;border:1px solid #ffffff40;border-radius:5px;color:#fff;font-size:10px;letter-spacing:.025em;cursor:pointer;backdrop-filter:blur(8px)}.hero-bottom:has(.motion-control){padding-right:160px}.motion-control:hover{background:#101a22a6}.motion-control:focus-visible{outline:2px solid white;outline-offset:3px}.motion-control svg{width:12px;height:12px;fill:currentColor}
.page-heading>.motion-control{right:28px;bottom:20px}
@keyframes godive-ocean-drift{from{transform:scale(1.025) translate3d(-.3%,0,0)}to{transform:scale(1.09) translate3d(.7%,-.7%,0)}}
@keyframes godive-title-drift{from{transform:scale(1.025)}to{transform:scale(1.08) translate3d(0,-.6%,0)}}
@keyframes godive-light-drift{from{transform:translateX(-12%) rotate(-4deg);opacity:.3}to{transform:translateX(12%) rotate(3deg);opacity:.8}}
@keyframes godive-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes godive-scroll-cue{0%,60%,100%{transform:translateY(0)}75%{transform:translateY(5px)}85%{transform:translateY(0)}92%{transform:translateY(3px)}}
@media(max-width:760px){.hero-image{animation-name:godive-ocean-drift-mobile;animation-duration:24s}.hero::after{display:none}.hero-bottom:has(.motion-control){justify-content:flex-start;padding-right:140px}.motion-control{font-size:9px;min-height:32px}.motion-reveal{transform:translateY(14px)}}
@keyframes godive-ocean-drift-mobile{from{transform:scale(1.025)}to{transform:scale(1.065) translate3d(-.4%,-.4%,0)}}
@media(prefers-reduced-motion:reduce){.hero-image,.hero::after,.hero-content>*,.hero-actions,.hero-bottom a>span,.page-title-image,.page-heading .container{animation:none!important;transform:none!important;will-change:auto}.motion-reveal{opacity:1;transform:none;transition:none}.motion-control{display:none}.hero-bottom:has(.motion-control){padding-right:0}.course-card:hover,.intro-visual:hover>img,.button:hover>span{transform:none}.button::after{display:none}}
@media print{.motion-reveal{opacity:1;transform:none}.motion-control{display:none}}
