:root{--ocean:#071e31;--deep:#082a45;--accent:#29b4ef;--ice:#edf5f8;--blue:#168dc2}html{scroll-behavior:smooth}body{background:var(--ice);color:#142c3e;font-family:Arial,Helvetica,sans-serif}.wrap{max-width:1190px;width:calc(100% - 112px)}.site-header{position:absolute;inset:0 0 auto;z-index:110;height:162px;background:transparent;border:0;display:flex;align-items:flex-start;justify-content:center;padding:36px 4.7%;color:white}.ocean-brand{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:white;gap:2px;text-align:center}.ocean-brand img{width:90px;height:65px;object-fit:contain}.ocean-brand>span{font-size:17px;letter-spacing:.21em;font-weight:700}.ocean-brand small{display:block;font-size:7px;letter-spacing:.18em;margin-top:7px}.menu-toggle{display:flex!important;position:absolute;left:4.7%;top:47px;gap:18px;align-items:center;background:none!important;border:0;color:white;padding:0;min-height:42px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;z-index:120}.hamburger{display:block;width:46px;height:32px;position:relative}.hamburger i{position:absolute;left:0;height:1.5px;background:currentColor;transition:transform .35s,width .35s,top .35s,opacity .2s;width:46px;top:1px}.hamburger i:nth-child(2){top:14px;width:37px}.hamburger i:nth-child(3){top:27px;width:27px}.menu-toggle:hover .hamburger i{width:46px}.menu-open .hamburger i{top:14px;width:40px;transform:rotate(45deg)}.menu-open .hamburger i:nth-child(2){opacity:0}.menu-open .hamburger i:nth-child(3){transform:rotate(-45deg)}.menu-open .menu-toggle{position:fixed;color:var(--accent)}.header-cta,.ocean-button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;background:var(--accent);color:#052035;text-transform:uppercase;font-size:11px;font-weight:700;letter-spacing:.21em;padding:21px 28px;text-decoration:none;border:0;transition:background .25s,transform .25s}.header-cta{position:absolute;right:4.7%;top:47px;min-width:158px}.header-cta span,.ocean-button span{font-size:18px;line-height:1}.ocean-button:hover,.header-cta:hover{background:#75d5ff;transform:translateY(-3px)}.ocean-hero{position:relative;min-height:730px;height:100svh;color:white;background:#072c43;overflow:hidden}.ocean-hero video,.hero-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ocean-hero video{filter:saturate(.9);transform:scale(1.035)}.hero-shade{background:linear-gradient(90deg,rgba(1,21,37,.65),rgba(2,27,42,.2)),linear-gradient(0deg,rgba(1,20,32,.55),transparent 50%)}.hero-content{position:absolute;left:11%;top:40%;max-width:850px}.hero-content .eyebrow{color:#b5e9ff;font-size:10px;letter-spacing:.22em;margin-bottom:20px}.hero-content h1{font-size:clamp(48px,6.1vw,86px);line-height:1.08;letter-spacing:-.025em;font-weight:700;margin:0;max-width:900px;color:white}.hero-intro{font-size:21px;margin:23px 0 30px;color:#e0edf3}.hero-trail{position:absolute;top:44%;left:4.8%;display:flex;flex-direction:column;align-items:center;color:var(--accent);text-decoration:none;height:56%;gap:26px}.hero-trail span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:10px;font-weight:700;letter-spacing:.22em}.hero-trail i{height:170px;width:40px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);border-bottom-left-radius:45px;transform:skewY(20deg);align-self:flex-start;margin-left:0}.hero-trail b{font-size:20px;animation:drift 2s infinite}.hero-bottom{position:absolute;bottom:27px;right:4.7%;left:11%;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:.2em}.hero-bottom button{background:none;border:0;color:white;font-size:11px;letter-spacing:.07em;display:flex;gap:10px;padding:10px;cursor:pointer}.ocean-menu{position:fixed!important;inset:0!important;z-index:102;height:100svh;background:var(--ocean)!important;color:white;opacity:0;transition:opacity .25s;visibility:hidden;overflow:auto;display:block}.ocean-menu[hidden]{display:none!important}.ocean-menu.open{opacity:1;visibility:visible;transition-delay:.38s}.menu-inner{display:grid;grid-template-columns:1fr 1fr;gap:8vw;max-width:1150px;width:78%;margin:110px auto 60px;align-items:center;min-height:calc(100svh - 190px)}.ocean-menu .nav-links{display:flex;flex-direction:column;align-items:flex-start;gap:17px;width:100%}.ocean-menu .nav-links a{font-size:clamp(27px,3.1vw,43px);line-height:1.1;padding:0;color:white;font-weight:700;text-transform:none;letter-spacing:-.025em;border:0;min-height:0;white-space:normal;opacity:0;transform:translateY(18px);transition:color .2s,opacity .4s,transform .4s}.ocean-menu.open .nav-links a{opacity:1;transform:translateY(0);transition-delay:.5s}.ocean-menu .nav-links a:hover,.ocean-menu .nav-links a[aria-current]{color:var(--accent);background:transparent}.menu-aside{opacity:0;transform:translateY(15px);transition:opacity .4s .55s,transform .4s .55s}.open .menu-aside{opacity:1;transform:none}.menu-aside .eyebrow{color:var(--accent);font-size:9px;letter-spacing:.17em}.menu-aside h2{font-size:42px;line-height:1.1;color:white;margin:24px 0}.menu-aside p{color:#aac2d1;font-size:16px;line-height:1.7;margin:0 0 28px}.menu-admin{margin-top:48px;border-top:1px solid #254254;padding-top:20px;font-size:12px;display:flex;flex-direction:column;gap:10px;color:#93aebb}.menu-admin a{color:white}.menu-waves{position:fixed;inset:0;z-index:101;pointer-events:none;overflow:hidden}.menu-waves span{position:absolute;left:-30%;bottom:-80%;width:160%;height:180%;border-radius:45% 50% 0 0;background:#68bbd4;transform:translateY(100%);transition:transform .8s cubic-bezier(.66,.01,.24,1)}.menu-waves span:nth-child(2){background:#155477;transition-delay:.08s}.menu-waves span:nth-child(3){background:var(--ocean);transition-delay:.16s}.menu-open .menu-waves span{transform:translateY(-44%)}body.menu-open{overflow:hidden}.inner-page .site-header{position:relative;background:var(--ocean);height:162px}.inner-page .page-heading{background:#e3eef4;border:0;padding:50px 0 55px}.inner-page .page-heading h1{font-size:clamp(44px,5vw,70px);letter-spacing:-.04em;color:var(--ocean)}.page{animation:page-enter .65s both}.fact-strip{background:var(--ocean);color:white;border:0}.fact-strip .wrap{min-height:115px;gap:30px}.fact-strip b{color:#65cfff;font-size:14px}.fact-strip span{font-size:12px;color:#c5d7e1}.home-content{padding-top:105px;padding-bottom:100px}.intro-line{display:block;margin-bottom:45px}.intro-line h2{font-size:clamp(36px,4.5vw,58px);letter-spacing:-.04em;color:var(--ocean);margin:0 0 16px}.intro-line p{font-size:17px;max-width:560px;color:#536d7c}.quick-grid{gap:22px}.quick-card{border:0;border-radius:0;min-height:430px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;background:linear-gradient(0deg,rgba(0,22,39,.9),rgba(0,25,39,.08)),url('/assets/duiker-onderwater.jpg') center/cover!important;color:white;padding:32px;transition:transform .5s}.quick-card:nth-child(2){background-image:linear-gradient(0deg,rgba(0,22,39,.9),rgba(0,25,39,.08)),url('/assets/clubduik-dreischor-2023.jpg')!important}.quick-card:nth-child(3){background-image:linear-gradient(0deg,rgba(0,22,39,.9),rgba(0,25,39,.08)),url('/assets/onderwater-vissen.jpg')!important}.quick-card:hover{transform:translateY(-10px)}.quick-card h3{font-size:29px;line-height:1.15;color:white}.quick-card .card-kicker{color:#72d5ff}.quick-card p{color:#d5e2e9;font-size:14px}.home-updates{margin:90px 0;gap:65px}.home-updates>section{background:transparent;border:0;padding:0}.small-heading h2{font-size:26px;letter-spacing:-.025em}.home-club{background:var(--ocean);color:#b9cbd6;gap:0;border-radius:0}.home-club>div{padding:45px}.home-club h2{font-size:42px;line-height:1.1;color:white}.home-club .eyebrow,.home-club .text-link{color:#65cfff}.home-club img{height:100%;min-height:470px;object-fit:cover}.footer{background:var(--ocean);border:0}.footer-top{padding-top:65px}.video-credit{font-size:9px;color:#8faab9;line-height:1.8;padding:18px 0;border-top:1px solid #254354}.video-credit a{color:#b5cedc}.button{background:var(--blue);border-radius:0}.button.secondary{background:white;color:var(--deep)}.aside-card,.course-card,.board-card,.news-card,.contact-form{border-radius:0}.news-image{transition:transform .6s}.news-card{overflow:hidden}.news-card:hover .news-image{transform:scale(1.035)}.ocean-reveal{opacity:0;transform:translateY(32px);transition:opacity .85s,transform .85s}.ocean-reveal.in-view{opacity:1;transform:none}a:focus-visible,button:focus-visible{outline:3px solid #59cbff;outline-offset:6px}@keyframes page-enter{from{opacity:.3;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes drift{50%{transform:translateY(8px)}}@media(min-width:1700px){.hero-content{top:42%}}@media(max-width:800px){.wrap{width:calc(100% - 42px)}.site-header{height:130px;padding-top:22px}.ocean-brand img{width:70px;height:52px}.ocean-brand>span{font-size:13px}.ocean-brand small{font-size:5px}.menu-toggle{top:31px;left:22px}.menu-label{display:none}.hamburger{width:33px}.hamburger i{width:33px}.hamburger i:nth-child(2){width:26px}.hamburger i:nth-child(3){width:20px}.header-cta{right:20px;top:32px;padding:15px 17px;min-width:0;font-size:8px;gap:10px}.header-cta span{font-size:13px}.hero-content{left:11%;right:7%;top:39%}.hero-content h1{font-size:clamp(43px,8vw,65px)}.hero-intro{font-size:18px}.hero-content .eyebrow{font-size:8px;max-width:270px;line-height:1.7}.ocean-hero{min-height:650px}.hero-trail{left:4%;top:44%;gap:16px}.hero-trail span{font-size:7px}.hero-trail i{height:125px;width:25px}.hero-bottom{left:11%;font-size:6px;letter-spacing:.12em;gap:12px}.hero-bottom button{font-size:9px}.hero-bottom button span{display:none}.ocean-button{padding:20px 24px;font-size:10px}.menu-inner{grid-template-columns:1fr;width:77%;margin:105px auto 40px;gap:35px;min-height:0}.ocean-menu .nav-links{gap:20px}.ocean-menu .nav-links a{font-size:clamp(27px,5.5vw,36px)}.menu-aside{border-top:1px solid #254254;padding-top:28px}.menu-aside h2{display:none}.menu-aside p{font-size:13px;margin:16px 0}.menu-admin{margin-top:25px}.inner-page .site-header{height:130px}.home-content{padding-top:65px}.quick-grid{grid-template-columns:1fr}.quick-card{min-height:370px}.home-updates{grid-template-columns:1fr;gap:45px;margin:65px 0}.home-club>div{padding:30px}.home-club img{min-height:300px}.home-club h2{font-size:36px}.fact-strip .wrap{padding-top:25px;padding-bottom:25px;gap:18px}.inner-page .page-heading h1{font-size:43px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;transition-delay:0ms!important}.ocean-reveal{opacity:1;transform:none}.ocean-hero video{display:none}.ocean-hero{background:url('/assets/onderwaterwereld-poster.jpg') center/cover}.menu-waves{display:none}.ocean-menu.open{transition-delay:0s}}

.menu-inner{position:relative;padding-bottom:64px}.ocean-menu .menu-support{position:absolute;right:0;bottom:0;display:inline-flex;align-items:center;gap:12px;min-height:44px;color:#b9d3df;font-size:14px;font-weight:400;text-decoration:none}.ocean-menu .menu-support:hover,.ocean-menu .menu-support[aria-current]{color:var(--accent)}.menu-support span{font-size:18px}@media(max-width:800px){.menu-inner{padding-bottom:0}.ocean-menu .menu-support{position:static;justify-self:end;text-align:right;font-size:13px}}

/* Keep menu content below the logo and header at every screen size. */
.ocean-menu .menu-inner{margin-top:190px;min-height:calc(100svh - 250px)}@media(max-width:800px){.ocean-menu .menu-inner{margin-top:165px;min-height:0}}


/* Four staggered, curved blue layers sweep down and retract upward. */
.menu-waves svg{display:block;width:100%;height:100%}.ocean-menu.open{transition-delay:1.05s}.ocean-menu.open .nav-links a{transition-delay:1.12s}.open .menu-aside{transition-delay:1.16s}.ocean-menu .menu-support{transition:color .2s}.menu-waves{z-index:101}.menu-waves path{will-change:d}
@media(prefers-reduced-motion:reduce){.ocean-menu.open,.ocean-menu.open .nav-links a,.open .menu-aside{transition-delay:0s!important}}

/* Menu hover and keyboard focus: slide with a light-blue leading line. */
.ocean-menu .nav-links a{position:relative;transition:color .2s,opacity .4s,transform .3s ease}.ocean-menu .nav-links a::before{content:'';position:absolute;left:0;top:50%;width:24px;height:2px;background:#83d9f2;opacity:0;transform:translate(-36px,-50%) scaleX(0);transform-origin:left;transition:opacity .25s,transform .3s}.ocean-menu.open .nav-links a:hover,.ocean-menu.open .nav-links a:focus-visible{transform:translateX(36px);transition-delay:0s;color:var(--accent)}.ocean-menu .nav-links a:hover::before,.ocean-menu .nav-links a:focus-visible::before{opacity:1;transform:translate(-36px,-50%) scaleX(1)}@media(prefers-reduced-motion:reduce){.ocean-menu.open .nav-links a:hover,.ocean-menu.open .nav-links a:focus-visible{transform:none}.ocean-menu .nav-links a::before{left:-6px;width:18px;transform:translate(-22px,-50%) scaleX(0)}.ocean-menu .nav-links a:hover::before,.ocean-menu .nav-links a:focus-visible::before{transform:translate(-22px,-50%) scaleX(1)}}


.ocean-menu.open .nav-links a{transition-delay:0s}


/* The leading line and movement identify focused menu links. */
.ocean-menu .nav-links a:focus-visible{outline:none}


/* Fit the complete menu within the available viewport. */
.ocean-menu .menu-inner{box-sizing:border-box;height:calc(100svh - 180px);min-height:0;margin:160px auto 20px;padding-bottom:38px;gap:5vw}.ocean-menu .nav-links{gap:clamp(10px,2vh,17px)}.menu-aside h2{font-size:clamp(28px,4.8vh,42px);margin:16px 0}.menu-aside p{margin-bottom:18px}.menu-admin{margin-top:24px;padding-top:14px}.ocean-menu .menu-support{bottom:0}@media(max-width:800px){.ocean-menu .menu-inner{width:82%;height:calc(100svh - 135px);margin:120px auto 15px;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto auto;gap:12px;padding-bottom:0;align-items:center}.ocean-menu .nav-links{padding:0;gap:clamp(5px,1.4svh,14px)}.ocean-menu .nav-links a{font-size:clamp(22px,3.7svh,31px);line-height:1.12}.menu-aside{border:0;padding:0}.menu-aside>.eyebrow,.menu-aside>p,.menu-aside>.ocean-button{display:none}.menu-admin{margin:0;padding:10px 0 0;gap:5px;font-size:11px}.menu-admin>span{display:none}.ocean-menu .menu-support{position:static;justify-self:end;min-height:34px;font-size:12px}}@media(min-width:801px) and (max-height:700px){.ocean-menu .menu-inner{height:calc(100svh - 165px);margin-top:145px}.ocean-menu .nav-links a{font-size:clamp(25px,5.2vh,36px)}.menu-aside .eyebrow{font-size:8px}.menu-aside h2{margin:12px 0}.menu-aside p{font-size:14px;line-height:1.5;margin-bottom:14px}.menu-aside .ocean-button{padding:15px 22px}.menu-admin{margin-top:18px;padding-top:12px}}


@media(max-height:480px){.menu-open .site-header{padding-top:14px}.menu-open .ocean-brand img{width:50px;height:36px}.menu-open .ocean-brand>span{font-size:11px}.menu-open .ocean-brand small{font-size:5px;margin-top:4px}.menu-open .menu-toggle{top:20px}.ocean-menu .menu-inner{height:calc(100svh - 110px);margin:95px auto 15px;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto;gap:5px 30px;padding-bottom:0;width:82%}.ocean-menu .nav-links{grid-row:1/3;gap:7px;padding:0}.ocean-menu .nav-links a{font-size:clamp(18px,5.6svh,25px);line-height:1.1}.menu-aside{align-self:end;border:0;padding:0}.menu-aside>.eyebrow,.menu-aside>h2,.menu-aside>p,.menu-aside>.ocean-button{display:none}.menu-admin{margin:0;padding-top:10px;gap:5px;font-size:11px}.menu-admin>span{display:none}.ocean-menu .menu-support{position:static;justify-self:end;align-self:end;min-height:34px;font-size:12px}}


body.menu-open.inner-page .site-header{background:transparent}


body.menu-open .site-header{pointer-events:none}body.menu-open .site-header button{pointer-events:auto}