
 :root{
  /* kleur: clubgroen exact afgestemd op het Roef!-logo (#0B694F) */
  --green:#0B694F; --green-mid:#0E7D5F; --green-deep:#073D2D; --night:#04231A;
  --mint:#2BC597; --mint-deep:#1B9E76; --mint-bright:#46E0B0;
  --c-hand:#2FD3A3; --c-hsb:#F2A23B; --c-dart:#4FB8E2; --c-jdb:#A6DA50;
  --t-hand:#0D8060; --t-hsb:#A05F08; --t-dart:#1A719E; --t-jdb:#5E7A1C;
  --paper:#F4F2E9; --card:#FFFFFF; --cream:#ECEADF;
  --ink:#15231C; --muted:#56655D; --grey:#86918A; --line:#E1DFD2;
  --r-lg:24px; --r-md:16px; --r-sm:11px;
  --sh-card:0 1px 2px rgba(7,65,47,.045),0 12px 30px -18px rgba(7,65,47,.13);
  --sh-pop:0 2px 5px rgba(4,36,27,.06),0 22px 46px -26px rgba(4,36,27,.26);
  --disp:'Fredoka',system-ui,sans-serif;
  --hand:'Caveat',cursive;--sans:'Plus Jakarta Sans',system-ui,sans-serif;
 }
 *{box-sizing:border-box;margin:0;padding:0}
 html{scroll-behavior:smooth;scroll-padding-top:96px}
 body{font-family:var(--sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden;font-size:16.5px;line-height:1.6}
 .wrap{max-width:1180px;margin:0 auto;padding:0 28px}
 a{text-decoration:none;color:inherit} img{display:block;max-width:100%} button{font-family:inherit}
 ::selection{background:var(--mint);color:var(--night)}
 *:focus-visible{outline:3px solid var(--mint);outline-offset:3px;border-radius:6px}
 h1,h2,h3,h4{text-wrap:balance}

 /* ===== display-typografie: stadionletters + coach-stift ===== */
 .dx{font-family:var(--disp);font-weight:700;letter-spacing:-.01em}
 .sc{font-weight:800}

 /* ===== knoppen: sticker met druk-effect ===== */
 .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;cursor:pointer;
  font-family:var(--disp);font-weight:600;font-size:16px;letter-spacing:.012em;white-space:nowrap;
  padding:16px 30px;border-radius:50px;position:relative;
  box-shadow:0 2px 10px -4px var(--glow,rgba(4,36,27,.35));
  transition:transform .2s cubic-bezier(.34,1.4,.5,1),box-shadow .2s,filter .2s}
 .btn:hover{transform:translateY(-3px);box-shadow:0 14px 30px -12px var(--glow,rgba(4,36,27,.4));filter:brightness(1.03)}
 .btn:active{transform:translateY(-1px);box-shadow:0 6px 14px -5px var(--glow,rgba(4,36,27,.55));filter:brightness(.99)}
 .btn .arr{display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
 .btn:hover .arr{transform:translateX(4px)}
 .btn-white .arr{color:var(--mint-deep)}
 .btn-mint .arr{color:var(--green-deep)}
 .btn-green{background:var(--green-deep);color:#fff;--glow:rgba(7,65,47,.4)}
 .btn-mint{background:linear-gradient(180deg,#41E0AE,var(--mint) 55%);color:var(--night);--glow:rgba(53,217,168,.45)}
 .btn-sponsor{background:linear-gradient(180deg,#0d7b5e,var(--green) 62%);color:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 30px -12px rgba(7,61,45,.5);transition:transform .2s,box-shadow .2s,filter .2s}
 .btn-sponsor:hover{transform:translateY(-2px);filter:brightness(1.07);box-shadow:0 20px 40px -14px rgba(7,61,45,.55)}
 .btn-sponsor .arr{transition:transform .2s}.btn-sponsor:hover .arr{transform:translateX(3px)}
 .btn-mint:hover{filter:brightness(1.05)}
 .btn-dark{background:var(--night);color:#fff;--glow:rgba(0,0,0,.5)}
 .btn-white{background:#fff;color:var(--green-deep);--glow:rgba(4,36,27,.4)}
 .btn-out{background:rgba(4,36,27,.32);color:#fff;box-shadow:0 6px 18px -6px rgba(4,36,27,.5);border:2px solid rgba(255,255,255,.72);padding:14px 28px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:transform .2s,border-color .2s,background .2s}
 .btn-out:hover{transform:translateY(-3px);border-color:#fff;background:rgba(4,36,27,.46);box-shadow:0 10px 24px -6px rgba(4,36,27,.6)}
 .btn-out:active{transform:translateY(-1px)}

 /* ===== navigatie ===== */
 header.nav{position:sticky;top:0;z-index:80;background:linear-gradient(180deg,#0A4A37 0%,var(--green-deep) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 0 rgba(91,240,194,.18),0 10px 30px -12px rgba(4,36,27,.6)}
 .nav .row{display:flex;align-items:center;height:96px;gap:22px}
 .nav .logo{display:flex;flex:0 0 auto;align-items:center;align-self:center;background:#fff;border-radius:13px;padding:10px 20px;box-shadow:0 8px 20px -12px rgba(4,36,27,.30),0 1px 3px rgba(4,36,27,.10),inset 0 0 0 1px rgba(10,105,81,.05);transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .28s;position:relative;z-index:30;margin-left:-2px;transform:rotate(-1deg)}
 .nav .logo:hover{transform:rotate(-1.8deg) translateY(5px) scale(1.035);box-shadow:0 18px 40px -14px rgba(4,36,27,.45),0 3px 9px rgba(4,36,27,.18),inset 0 0 0 1px rgba(10,105,81,.06)}
 .nav .logo img{height:70px;width:auto;flex:none;display:block}
 nav.menu{display:flex;gap:4px;margin-left:14px;flex:1 1 auto;align-items:center}
 nav.menu .shopdrop{margin-left:auto}
 nav.menu a{color:#F4FBF7;font-family:var(--disp);font-weight:500;font-size:15px;padding:10px 15px;border-radius:50px;white-space:nowrap;transition:background .2s,color .2s,transform .2s}
 nav.menu a:hover{background:rgba(53,217,168,.13);color:#fff;transform:translateY(-2px)}
 nav.menu .joinbtn{color:var(--night);background:var(--mint);box-shadow:0 1px 2px rgba(4,36,27,.12);margin-left:12px;padding:11px 22px;border-radius:50px;font-weight:600}
 nav.menu .joinbtn:hover{background:var(--mint-bright);transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(27,158,118,.6)}
 nav.menu .joinbtn:active{transform:translateY(0);box-shadow:0 2px 6px -2px rgba(27,158,118,.5)}
 nav.menu .shopbtn{position:relative;display:inline-flex;align-items:center;gap:8px;margin-left:14px;color:#DCF2E6;font-family:var(--disp);font-weight:500;font-size:15px;padding:9px 17px;border-radius:50px;border:1px solid rgba(255,255,255,.12);background:transparent;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
 nav.menu .shopbtn:hover{transform:translateY(-2px);background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.55);box-shadow:0 6px 18px -8px rgba(4,36,27,.5);color:#fff}
 nav.menu .shopbtn svg{color:#CFE9DD;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
 nav.menu .shopbtn:hover svg{transform:translateY(-1px) scale(1.08)}
 nav.menu .shopbtn .soon{font-family:var(--disp);font-weight:600;font-size:10px;letter-spacing:.04em;text-transform:lowercase;color:rgba(230,244,236,.62);background:none;padding:0;border-radius:0;box-shadow:none;animation:none}
 @keyframes soonpulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
 .burger{display:none;margin-left:auto;background:none;border:0;cursor:pointer;width:48px;height:44px;padding:11px 6px;flex-direction:column;justify-content:space-between;box-sizing:border-box}
 .burger span{display:block;width:100%;height:3.5px;background:#fff;border-radius:3px;transition:transform .28s cubic-bezier(.5,.2,.2,1),opacity .2s}
 .burger.open span:nth-child(1){transform:translateY(9px) rotate(45deg)}
 .burger.open span:nth-child(2){opacity:0}
 .burger.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
 @media(max-width:980px){nav.menu{display:none}.burger{display:flex}}

 /* ===== hero ===== */
 .hero{position:relative;color:#fff;overflow:hidden;background:var(--night);padding:60px 0 118px;text-align:center}
 .hero .hcollage{position:absolute;inset:0;z-index:0;background:#02120c}
 
 
 .hcell{display:block;background-size:cover;background-position:center;filter:none;transition:transform 1.4s cubic-bezier(.22,1,.36,1)}
.hcell{transform:scale(1.04)}
.hc-hand{position:absolute;left:0;top:0;bottom:0;width:54%;clip-path:polygon(0 0, 100% 0, 88% 100%, 0 100%);filter:brightness(1.02) contrast(1.02);background-size:cover;background-position:50% 46% !important;background-image:url('img/img01.webp')}
.hc-hsb{position:absolute;right:0;top:0;bottom:0;width:54%;clip-path:polygon(12% 0, 100% 0, 100% 100%, 0 100%);filter:brightness(1.02) contrast(1.02);background-size:cover;background-position:52% 12%;background-image:url('img/foto-pitcher.webp')}
.hero:hover .hcell{transform:scale(1.04)}
 .hero:hover  .hero .hc-dart{filter:brightness(1.5) saturate(1.14) contrast(.92) sepia(.22) hue-rotate(96deg) saturate(1.2);background-image:url('img/img03.webp');background-position:50% 50%}
 .hero .hc-jdb{filter:brightness(1.12) saturate(1.2) contrast(1.02) sepia(.26) hue-rotate(94deg) saturate(1.28);background-image:url('img/img04.webp');background-position:48% 52%}
 .hero .hoverlay{position:absolute;inset:0;z-index:1;background:radial-gradient(120% 80% at 50% 40%,rgba(4,42,31,.2),rgba(4,36,27,.06) 55%,rgba(4,36,27,0) 85%),linear-gradient(180deg,rgba(2,20,14,.26),rgba(4,36,27,0) 24%,rgba(4,36,27,0) 100%)}
 .hero .hglow{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(60% 50% at 50% 42%,rgba(91,240,194,.14),rgba(91,240,194,0) 70%);mix-blend-mode:screen}
 .hero .hgrain{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
 .hero .inner{position:relative;z-index:3;text-align:center;display:flex;flex-direction:column;align-items:center;
  max-width:562px;padding:28px 40px 30px;border-radius:24px;
  background:linear-gradient(160deg,rgba(6,40,30,.18),rgba(4,24,18,.31));
  backdrop-filter:blur(6px) saturate(1.04);-webkit-backdrop-filter:blur(6px) saturate(1.04);
  border:1px solid rgba(91,240,194,.09);
  box-shadow:0 20px 46px -34px rgba(2,16,11,.42),inset 0 1px 0 rgba(255,255,255,.04);}
 
 
 /* split hero: text left-aligned in .htext */
 /* scrim/glow not needed on split layout */
 .hero .pill{align-self:center;display:inline-flex;align-items:center;gap:9px;background:rgba(4,36,27,.42);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(91,240,194,.42);color:var(--mint-bright);
  font-family:var(--disp);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:9px 20px;border-radius:50px;margin-bottom:20px;box-shadow:0 8px 26px -10px rgba(4,36,27,.5),inset 0 1px 0 rgba(255,255,255,.08)}
 .hero .pill:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint-bright);box-shadow:0 0 8px var(--mint-bright)}
 .hero h1{font-family:var(--disp);font-weight:700;font-size:clamp(44px,6.4vw,84px);line-height:.96;letter-spacing:-.028em;text-shadow:0 2px 12px rgba(2,20,14,.7),0 20px 54px rgba(2,20,14,.5)}
 .hero h1 .accent{color:var(--mint-bright);font-weight:inherit}
 .hero h1 .ring{display:inline-block;color:var(--mint-bright);font-family:var(--hand);font-weight:700;font-size:.94em;transform:rotate(-2deg);padding:0 .06em}
 
 
 @keyframes draw{to{stroke-dashoffset:0}}
 .hero p{font-size:18.5px;max-width:42ch;margin:18px auto 0;color:#F1F8F4;line-height:1.55;font-weight:450;text-shadow:0 1px 12px rgba(2,20,14,.72)}
 .hero .btns{margin-top:26px;display:flex;gap:16px;justify-content:center;align-items:stretch;flex-wrap:wrap}
 .hero .btns .btn{font-weight:700}
 .wave{position:absolute;left:0;right:0;bottom:-1px;z-index:2;line-height:0}
 .wave svg{width:100%;height:92px;display:block}
 
 

 .logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 12px;padding:0;width:auto}.logowrap{overflow:visible}.logos .lcell{display:flex;align-items:center;justify-content:center;flex:0 0 auto;padding:0 30px;height:64px}
.logos img{height:var(--lh,46px);width:auto;opacity:1;filter:none;transition:transform .28s}
.logos .lcell:hover img{opacity:1;filter:none;transform:scale(1.05)}
/* ===== sport-tegels ===== */
 .tiles{margin-top:10px;position:relative;z-index:8}
 .tiles:before{content:"";position:absolute;left:0;right:0;top:-96px;height:150px;z-index:-1;pointer-events:none;background:radial-gradient(72% 100% at 50% 0%,rgba(47,211,163,.05),rgba(47,211,163,0) 70%)}
 .tilegrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
 @media(max-width:900px){.tilegrid{grid-template-columns:1fr}}
 .tile{position:relative;border-radius:16px;padding:24px 22px 22px;color:#fff;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;border:0;transition:transform .28s cubic-bezier(.2,.8,.3,1.1),box-shadow .28s;cursor:pointer;background:var(--green-deep);min-height:292px;isolation:isolate;box-shadow:0 10px 26px -20px rgba(2,16,11,.42);min-height:322px}
 .tile:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);z-index:3;pointer-events:none;transition:box-shadow .2s}
 .tile:hover{transform:translateY(-4px);box-shadow:0 16px 34px -24px rgba(4,36,27,.34),0 8px 18px -12px rgba(4,36,27,.22)}
 .tile:hover:after{box-shadow:inset 0 0 0 1px rgba(255,255,255,.13)}
 .t-hand{--ac:var(--c-hand)} .t-hsb{--ac:var(--c-hsb)} .t-dart{--ac:var(--c-dart)} .t-jdb{--ac:var(--c-jdb)}
 .tile .pic{position:absolute;inset:0;background-size:cover;background-position:center;opacity:1;transition:opacity .28s,transform .6s;filter:saturate(.98) brightness(1.0) contrast(1.02)}
 .tile:hover .pic{opacity:1;transform:scale(1.035)}
 .t-hand .pic{background-position:50% 50%;filter:saturate(1.14) brightness(1.12) contrast(1.05)}
 .t-hsb .pic{background-position:56% 34%;filter:saturate(.99) brightness(1.0) contrast(1.02)}
 .t-dart .pic{background-position:42% 50%;filter:saturate(.99) brightness(1.0) contrast(1.02)}
 .t-jdb .pic{background-position:50% 74%;background-size:128%;filter:saturate(1.14) brightness(1.12) contrast(1.05)}
 .tile .tint{position:absolute;inset:0;z-index:1;background:transparent;transition:opacity .28s;opacity:1}
 .t-dart .tint{opacity:1}
 .tile:hover .tint{opacity:.55}
 .tile .grad{position:absolute;inset:0}
 .tile .glow{display:none}
 .tile .ct{position:relative;z-index:2;display:flex;flex-direction:column;height:100%}
 .tile .ct h3{margin-top:auto}
 .tile small{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;margin-bottom:8px;color:#fff;
  background:rgba(4,36,27,.45);backdrop-filter:blur(4px);padding:6px 12px;border-radius:50px;border:1px solid rgba(255,255,255,.14)}
 .tile small:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ac);box-shadow:0 0 10px var(--ac)}
  .tile h3{font-family:var(--disp);font-weight:600;font-size:25px;line-height:1.08;letter-spacing:-.015em;text-shadow:0 1px 9px rgba(4,36,27,.5);margin:0 0 7px;height:auto;display:block}
 .tile .tinfo{position:relative;z-index:2;font-size:14px;line-height:1.55;color:rgba(255,255,255,.88);margin-top:10px;max-width:30ch;min-height:3.1em}
 .tile .go{position:relative;z-index:2;font-family:var(--disp);font-weight:600;font-size:12.5px;margin-top:0;display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;color:rgba(255,255,255,.82);background:transparent;padding:2px 0 0;border:0;border-radius:0;align-self:flex-start;white-space:nowrap;backdrop-filter:none;box-shadow:none;transition:color .2s,transform .2s}
 .tile:hover .go{transform:none;background:transparent;border-color:transparent;color:#fff}
 .tile .go .arr{color:#fff;display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
 .tile:hover .go .arr{transform:translateX(6px)}
 .t-hand .pic{background-image:url('img/img05.webp')}
 .t-hsb .pic{background-image:url('img/foto-catcher.webp')}
 .t-dart .pic{background-image:url('img/img07.webp')}
 .t-jdb .pic{background-image:url('img/foto-boules-spel.webp')}
 .tile .grad{background:linear-gradient(180deg,rgba(4,36,27,0) 38%,rgba(4,36,27,.22) 66%,rgba(4,36,27,.74) 100%)}
 .tile:before{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;z-index:1;
  background:linear-gradient(0deg,var(--ac),transparent);opacity:.08;mix-blend-mode:multiply;transition:opacity .28s}
 .tile:hover:before{opacity:.14}

 /* ===== sponsoren ===== */
 .sponsors{padding:84px 0 36px}
 .sponsors .lbl{text-align:center;font-family:var(--disp);font-weight:600;color:var(--green);font-size:12px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:32px;display:flex;align-items:center;justify-content:center;gap:18px}
 .sponsors .lbl:before,.sponsors .lbl:after{content:"";height:1px;width:min(120px,18vw);background:var(--line)}
 .slogo{flex:0 0 auto;display:flex;align-items:center;gap:14px;background:var(--card);padding:14px 24px 14px 14px;border-radius:50px;border:1px solid var(--line);box-shadow:0 1px 2px rgba(7,65,47,.04);transition:transform .2s,box-shadow .2s,border-color .2s}
 .slogo:hover{transform:translateY(-3px);box-shadow:var(--sh-card);border-color:transparent}
 .sini{position:relative;flex:0 0 auto;display:block}
 .slogo .ini{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--ac,var(--green-deep));color:#fff;font-family:var(--disp);font-weight:700;font-size:17px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.25)}
 .slogo .sdot{display:none}
 .slogo span:not(.ini){font-family:var(--disp);font-weight:600;font-size:15.5px;white-space:nowrap;color:var(--ink)}
 .slogo.haslogo{padding:0 26px;min-height:74px;border-radius:18px;background:transparent;border:0;box-shadow:none}
 .slogo.haslogo:hover{transform:translateY(-3px);box-shadow:none}
 .slogo .slimg{height:40px;width:auto;display:block;object-fit:contain;filter:saturate(1.02)}
 .slogo .slimg-tall{height:52px}

 /* ===== sectiekoppen: editoriaal, links uitgelijnd ===== */
 section{padding:104px 0}
 .head{display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:end;margin-bottom:44px}
 .head.center{display:block;text-align:center;max-width:62ch;margin:0 auto 44px}
 .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;color:var(--green);background:rgba(11,105,79,.10);font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:8px 18px;border-radius:50px;margin-bottom:14px}
 .eyebrow:before{content:none}
 .head h2{font-family:var(--disp);font-weight:700;font-size:clamp(30px,4.4vw,48px);line-height:1.05;letter-spacing:-.015em}
 .head h2 .sc{color:var(--mint-deep);font-weight:850}
 .head p{color:var(--muted);font-size:16.5px;line-height:1.65;padding-bottom:8px}
 .head.center p{padding-bottom:0;margin-top:14px}

 /* ===== nieuws ===== */
 .news{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}
 @media(max-width:880px){.news{grid-template-columns:1fr}}
 .feat{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:400px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;background:var(--green-deep);transition:transform .2s,box-shadow .2s;box-shadow:var(--sh-card);isolation:isolate}
 .feat:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);z-index:3;pointer-events:none}
 .feat .pic{position:absolute;inset:0;opacity:1;filter:saturate(1.08) brightness(1.04) contrast(1.04);background-image:url('img/foto-actie.webp');background-size:cover;background-position:center;transition:transform .6s;filter:saturate(.88)}
 .feat:hover .pic{transform:scale(1.05)}
 .feat:hover{transform:translateY(-5px);box-shadow:var(--sh-pop)}
 .feat .grad{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(4,36,27,0) 30%,rgba(4,36,27,.30) 62%,rgba(3,28,21,.86) 100%)}
 .feat .c{position:relative;z-index:2}
 .feat .tag{display:inline-block;background:var(--bar,var(--mint));color:var(--night);font-family:var(--disp);font-weight:600;font-size:12.5px;letter-spacing:.03em;padding:7px 15px;border-radius:50px}
 .feat .fdate{display:block;color:rgba(255,255,255,.66);font-weight:550;font-size:13px;margin:14px 0 8px;letter-spacing:.02em}
 .feat h3{font-family:var(--disp);font-weight:700;font-size:29px;line-height:1.14;max-width:19ch;letter-spacing:-.01em}
 .feat .rl{margin-top:18px;color:#fff;font-family:var(--disp);font-weight:600;font-size:15px;display:inline-flex;gap:9px;align-items:center}
 .feat .rl .arr{display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
 .feat:hover .rl .arr{transform:translateX(6px)}
 .nstack{display:flex;flex-direction:column;gap:12px;background:#fbf9f2;border:1px solid rgba(11,105,79,.09);border-radius:24px;padding:12px;box-shadow:0 18px 40px -28px rgba(7,61,45,.45),inset 0 1px 0 rgba(255,255,255,.6)}
 .nstack .ncard{flex:1}
 .ncard{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:0;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;overflow:hidden;display:flex;align-items:stretch;min-height:104px}
 .ncard:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--bar,var(--green));transition:width .2s;z-index:2}
 .ncard:after{content:"→";position:absolute;right:18px;bottom:16px;font-family:var(--disp);font-weight:700;font-size:18px;color:var(--bar,var(--green));opacity:0;transition:opacity .2s,transform .2s;transform:translateX(-6px);z-index:2}
 .ncard:hover{transform:translateY(-3px);box-shadow:var(--sh-card);border-color:rgba(11,105,79,.2)}
 .ncard:hover:before{width:8px}
 .ncard:hover:after{opacity:1;transform:translateX(0)}
 .ncard .nthumb{flex:0 0 108px;align-self:stretch;background-size:cover;background-position:center;position:relative;filter:saturate(1.04);transition:filter .28s cubic-bezier(.2,.8,.3,1),transform .28s cubic-bezier(.2,.8,.3,1)}
 .ncard:hover .nthumb{filter:saturate(1.1) brightness(1.04);transform:scale(1.04)}
 .ncard{overflow:hidden}
 .ncard .nthumb:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(4,36,27,.45),rgba(4,36,27,.15) 60%,var(--card)),linear-gradient(0deg,color-mix(in srgb,var(--bar) 40%,transparent),transparent 55%)}
 .ncard .ntext{flex:1;min-width:0;padding:18px 22px 18px 24px;display:flex;flex-direction:column;justify-content:center}
 .ncard .tag{font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.05em;color:var(--bar,var(--green));text-transform:uppercase}
 .ncard h4{font-family:var(--disp);font-weight:600;font-size:17px;margin-top:6px;line-height:1.28;color:var(--ink);padding-right:18px}
 .ncard .d{display:inline-flex;align-items:center;gap:6px;color:var(--grey);font-size:12.5px;margin-top:9px;font-weight:550;letter-spacing:.02em}
 .ncard .d:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--bar,var(--green));opacity:.6}
 .allnews{display:flex;justify-content:center;margin-top:40px}
 /* ===== Voor leden-balk ===== */
 .ledenbar{position:relative;z-index:5;margin-top:64px;margin-bottom:72px;padding:72px 0 72px;
  background:linear-gradient(135deg,var(--green) 0%,var(--green-deep) 100%);
  border-top:1px solid rgba(70,224,176,.45);box-shadow:inset 0 4px 14px -6px rgba(70,224,176,.25);border-bottom:1px solid rgba(43,197,151,.35)}
 .ledenbar .lb-head{text-align:center;max-width:640px;margin:0 auto 24px}
 .ledenbar .lb-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;
  font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mint);margin-bottom:14px}
 .ledenbar .lb-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 8px var(--mint)}
 .ledenbar h2{font-family:var(--disp);font-weight:800;font-size:clamp(28px,4vw,40px);color:#fff;line-height:1.05;text-shadow:0 1px 2px rgba(2,20,14,.5)}
 .ledenbar h2 .sc{color:var(--mint);font-family:var(--hand);font-weight:700}
 .ledenbar .lb-head p{color:#cfeede;font-size:16px;margin-top:12px;line-height:1.5}
 .ledenbar .lb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
 @media(max-width:980px){.ledenbar .lb-grid{grid-template-columns:repeat(3,1fr)}}
 @media(max-width:680px){.ledenbar .lb-grid{grid-template-columns:1fr 1fr}}
 @media(max-width:460px){.ledenbar .lb-grid{grid-template-columns:1fr}}
 .ledenbar .lb-card{display:flex;flex-direction:column;gap:4px;text-align:left;cursor:pointer;position:relative;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.028));border:1px solid rgba(91,240,194,.13);border-radius:16px;box-shadow:0 12px 26px -18px rgba(2,16,11,.75);
  padding:18px 18px 16px;transition:transform .28s cubic-bezier(.2,.8,.3,1.1),background .2s,border-color .2s,box-shadow .28s}
 .ledenbar .lb-flag{position:absolute;top:10px;right:10px;background:#F2A23B;color:#3a2500;font-family:var(--disp);font-weight:700;font-size:10px;letter-spacing:.03em;padding:3px 9px;border-radius:99px;box-shadow:0 3px 8px -2px rgba(0,0,0,.4);z-index:3}
 .ledenbar .lb-card:hover{transform:translateY(-4px);background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.05));border-color:rgba(70,224,176,.4);box-shadow:0 20px 40px -20px rgba(2,16,11,.85)}
 .ledenbar .lb-card .lb-n{font-family:var(--disp);font-weight:800;font-size:13px;color:var(--mint-bright);letter-spacing:.06em}
 .ledenbar .lb-card b{font-family:var(--disp);font-weight:700;font-size:16px;color:#fff;line-height:1.2;text-shadow:0 1px 1px rgba(2,20,14,.45)}
 .ledenbar .lb-card .lb-go{font-family:var(--disp);font-weight:600;font-size:13px;color:#bdeeda;margin-top:6px;display:inline-flex;align-items:center;gap:6px}.ledenbar .lb-card .lb-go .arr{display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.ledenbar .lb-card:hover .lb-go .arr{transform:translateX(4px)}
 #nieuws{padding-top:72px;padding-bottom:78px}#nieuws>.wrap{max-width:1320px}
 /* nieuws-kop: één linkse kolom, lead pal onder de titel - geën losse rechterkolom */
 #nieuws .head{display:block;margin-bottom:40px}
 #nieuws .head .ht{max-width:none}
 #nieuws .head h2{color:var(--ink);letter-spacing:-.015em}#nieuws .head h2 .sc{color:var(--mint-deep)}
 #nieuws .head .lead{color:var(--muted);font-size:17px;line-height:1.62;max-width:46ch;margin-top:20px;
  padding-left:18px;position:relative}
 /* korte mint-accent: echoot het 'alle'-accent in de kop, verbindt kop → lead */
 #nieuws .head .lead:before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:4px;border-radius:4px;
  background:linear-gradient(180deg,var(--mint),var(--mint-deep))}
 #nieuws .head p{color:var(--muted)}
 #nieuws .feat{border:0;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 26px 60px -30px rgba(7,61,45,.5);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s}#nieuws .feat:hover{transform:translateY(-6px);box-shadow:0 40px 80px -32px rgba(7,61,45,.6)}#nieuws .feat .grad{background:linear-gradient(175deg,rgba(4,36,27,.06) 30%,rgba(5,38,28,.42) 58%,rgba(4,30,22,.9) 92%)}#nieuws .feat .tag{background:color-mix(in srgb,var(--bar,var(--mint)) 88%,#fff);color:var(--night);font-weight:700;letter-spacing:.04em;padding:7px 15px;box-shadow:0 6px 18px -8px color-mix(in srgb,var(--bar) 70%,transparent)}#nieuws .feat .fdate{color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.14em;font-size:11.5px;font-family:var(--disp);font-weight:600;margin:16px 0 10px}#nieuws .feat h3{letter-spacing:-.02em}#nieuws .feat .rl{color:var(--mint-bright)}
 #nieuws .ncard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:16px;box-shadow:0 4px 12px -10px rgba(7,61,45,.3);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s}#nieuws .ncard:before{width:3px;background:var(--bar,var(--mint));opacity:.95}#nieuws .ncard:hover{transform:translateX(4px);border-color:color-mix(in srgb,var(--bar,var(--green)) 32%,rgba(11,105,79,.1));box-shadow:0 22px 44px -26px rgba(7,61,45,.5)}#nieuws .ncard:hover:before{width:4px}#nieuws .ncard:after{color:var(--bar,var(--green))}#nieuws .ncard .nthumb{flex:0 0 96px;border-radius:12px;margin:12px 0 12px 12px;align-self:auto;min-height:calc(100% - 24px)}#nieuws .ncard .ntext{padding:14px 20px 14px 18px}#nieuws .ncard .tag{color:var(--bar,var(--green));letter-spacing:.1em;font-weight:700;font-size:11px}#nieuws .ncard h4{color:var(--ink);font-weight:600;letter-spacing:-.005em}#nieuws .ncard .d{color:var(--grey)}#nieuws .ncard .d:before{background:var(--bar,var(--green));opacity:.9}
 #nieuws .allnews{margin-top:34px}#nieuws .allnews .btn-green{background:var(--green-deep);color:#fff;font-weight:700;box-shadow:0 14px 30px -14px rgba(7,61,45,.5);transition:transform .2s,box-shadow .2s,filter .2s}#nieuws .allnews .btn-green:hover{transform:translateY(-2px);background:var(--green);box-shadow:0 20px 40px -16px rgba(7,61,45,.55)}
 .allnews .btn{margin-left:auto;margin-right:auto}

 /* ===== vrijwilligers ===== */
 .vol{background:linear-gradient(105deg,var(--green-deep) 0%,var(--green-deep) 30%,var(--green) 62%,var(--green-deep) 100%);color:#fff;position:relative;overflow:hidden;padding:0;margin-bottom:72px}
 .vol .ph{position:absolute;inset:0;background-image:url('img/img10.webp');background-size:cover;background-position:60% 35%;opacity:.42;mix-blend-mode:soft-light}
 .vol:before{content:"";position:absolute;inset:0;opacity:.05;background-image:radial-gradient(#fff 1.3px,transparent 1.3px);background-size:28px 28px;z-index:1}
 .vol:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,rgba(4,30,22,.82) 0%,rgba(4,30,22,.5) 34%,rgba(4,30,22,.12) 58%,rgba(4,30,22,.4) 100%)}
 .vol .inner{position:relative;z-index:2;display:grid;grid-template-columns:.92fr 1.08fr;gap:54px;align-items:center;padding:104px 0}
 @media(max-width:880px){.vol .inner{grid-template-columns:1fr;gap:28px;padding:56px 20px}.vol .vintro{text-align:center;background:rgba(3,22,15,.44);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:28px 22px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);box-shadow:0 20px 44px -28px rgba(0,0,0,.6)}.vol .vintro .lead{margin-left:auto;margin-right:auto}}
 .vol h2{font-family:var(--disp);font-weight:700;font-size:clamp(32px,4vw,44px);line-height:1.04;letter-spacing:-.01em}
 .vol h2 .sc{color:var(--mint-bright);display:block;font-size:.6em;font-weight:800;margin-top:8px}
 .vol .lead{color:#CBE8DA;margin-top:16px;font-size:16px;line-height:1.65;max-width:42ch}
 .vintro .veyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mint);background:rgba(4,36,27,.35);border:1px solid rgba(53,217,168,.3);padding:8px 18px;border-radius:50px;margin-bottom:14px}
 .vintro .veyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint)}
 .vnote{margin-top:20px;font-weight:600;font-size:16px;color:#A8E6CD}
 .vstat{margin-top:26px;display:flex;align-items:center;gap:22px;background:rgba(4,36,27,.34);border:1px solid rgba(53,217,168,.22);border-radius:var(--r-md);padding:18px 22px}
 .vstat .vbig{display:flex;align-items:center;gap:12px;flex:0 0 auto}
 .vstat .vbig b{font-family:var(--disp);font-weight:700;font-size:48px;line-height:.85;color:var(--mint)}
 .vstat .vbig span{font-family:var(--disp);font-weight:500;font-size:12.5px;line-height:1.3;color:#CBE8DA;letter-spacing:.02em}
 .vbar-wrap{flex:1;min-width:0}
 .vbar{height:9px;border-radius:50px;background:rgba(255,255,255,.14);overflow:hidden}
 .vbar i{display:block;height:100%;width:25%;border-radius:50px;background:linear-gradient(90deg,var(--mint-deep),var(--mint));transition:width .5s cubic-bezier(.3,.8,.3,1)}
 .vbar-tx{display:block;margin-top:8px;font-weight:550;font-size:12px;color:#A8D9C5;letter-spacing:.03em}
 .vlist{display:flex;flex-direction:column;gap:11px}
 .vrow{display:flex;align-items:center;gap:16px;background:var(--paper);border-radius:var(--r-md);padding:12px 16px 12px 22px;position:relative;overflow:hidden;box-shadow:0 12px 28px -14px rgba(4,36,27,.6);transition:transform .2s,box-shadow .2s,opacity .28s}
 .vrow:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--sc,var(--mint))}
 .vrow:not(.filled):hover{transform:translateX(4px);box-shadow:0 18px 36px -14px rgba(4,36,27,.7)}
 .s-hand{--sc:var(--c-hand)} .s-hsb{--sc:var(--c-hsb)} .s-dart{--sc:var(--c-dart)} .s-jdb{--sc:var(--c-jdb)} .s-club{--sc:var(--green-mid)}
 .vrow .when{font-family:var(--disp);font-weight:600;font-size:12px;color:var(--muted);min-width:54px;text-align:center;line-height:1.15;padding:8px 6px;border-radius:12px;background:color-mix(in srgb,var(--sc,var(--mint)) 14%,transparent);flex:0 0 auto}
 .vrow .when b{display:block;font-size:17px;color:var(--ink);font-weight:700;text-transform:capitalize}
 .vrow .what{flex:1}
 .vrow .what b{font-family:var(--disp);font-weight:600;font-size:16px;display:block;color:var(--ink)}
 .vrow .what span{font-size:12.5px;color:var(--muted);font-weight:480}
 .vbtn{font-family:var(--disp);font-weight:600;font-size:14px;color:#fff;background:var(--green-deep);border:0;padding:11px 21px;border-radius:50px;cursor:pointer;transition:transform .2s,background .2s;margin-right:4px;white-space:nowrap}
 .vbtn:hover{transform:translateY(-2px);background:var(--green)}
 .vbtn:active{transform:translateY(1px)}
 .vrow .done{font-family:var(--disp);font-weight:600;font-size:14px;background:rgba(11,107,82,.13);color:var(--green);border:0;padding:11px 18px;border-radius:50px;margin-right:4px;white-space:nowrap}
 .vrow.filled{opacity:.58}
 .vall{align-self:flex-start;margin-top:8px;font-family:var(--disp);font-weight:600;font-size:15px;color:#fff;display:inline-flex;align-items:center;gap:9px;opacity:.9;transition:opacity .2s}
 .vall:hover{opacity:1;color:var(--mint)}
 .vall .arr{display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
 .vall:hover .arr{transform:translateX(5px)}

 /* ===== vriendenwand ===== */
 .friends{position:relative;overflow:hidden;padding:72px 0 56px;scroll-margin-top:100px}
 .friends:before{content:'';position:absolute;inset:0;opacity:.045;background-image:radial-gradient(var(--green) 1.4px,transparent 1.4px);background-size:26px 26px}
 .friends .wrap{position:relative;z-index:2}
 .friends .deco{position:absolute;border-radius:50%;filter:blur(70px);z-index:1}
 .friends .deco.a{width:360px;height:360px;background:var(--mint);top:-140px;left:-100px;opacity:.16}
 .friends .deco.b{display:none}
 .fcount{display:inline-flex;align-items:center;gap:14px;margin-top:20px;font-family:var(--disp);font-weight:700;font-size:17px;color:var(--green)}
 .fcount #ftext{font-size:15px;font-weight:600;color:var(--grey)}
 .fcount #ftext b{font-size:26px;font-weight:700;color:var(--green);font-variant-numeric:tabular-nums}
 .fcount .bar{width:200px;height:12px;background:#D9D6C7;border-radius:99px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(4,36,27,.12)}
 .fcount .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--mint-deep));transition:width .5s cubic-bezier(.3,.8,.3,1);border-radius:99px}
 .wall{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:9px;margin-top:40px;background:linear-gradient(165deg,var(--green) 0%,var(--green-deep) 80%);padding:26px;border-radius:var(--r-lg);box-shadow:var(--sh-pop),inset 0 0 0 1px rgba(255,255,255,.08)}
 @media(max-width:900px){.wall{grid-template-columns:repeat(6,minmax(0,1fr))}}
 @media(max-width:520px){.wall{grid-template-columns:repeat(4,minmax(0,1fr))}}
 .spot{aspect-ratio:1.35/1;border-radius:10px;display:grid;place-items:center;text-align:center;padding:6px;font-family:var(--disp);font-weight:500;font-size:11.5px;line-height:1.2;cursor:pointer;min-width:0;overflow-wrap:anywhere;word-break:break-word;hyphens:auto;transition:transform .2s,box-shadow .2s,background .2s;border:1.5px dashed rgba(255,255,255,.26);color:rgba(255,255,255,.55);background:rgba(255,255,255,.05)}
 .spot.taken{background:#fff;color:var(--green-deep);border:1.5px solid #fff;box-shadow:0 8px 18px -8px rgba(0,0,0,.45);font-weight:600}
 .spot.taken:nth-child(3n){transform:rotate(-1.1deg)}
 .spot.taken:nth-child(4n){transform:rotate(.9deg)}
 .spot.taken.dark{background:var(--mint);color:var(--green-deep);border-color:var(--mint)}
 .spot.taken:hover{transform:translateY(-3px) rotate(0) scale(1.05);z-index:2}
 .spot:not(.taken):hover{border-color:var(--mint);color:#fff;background:rgba(53,217,168,.16);transform:translateY(-3px)}
 .spot .plus{font-size:18px;line-height:1}
 .friends .joinbar{max-width:640px;margin:22px auto 4px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
  .friends .jb-free{font-family:var(--disp);font-weight:600;font-size:15.5px;color:var(--muted)}
  .friends .jb-free b{font-family:var(--disp);font-weight:800;font-size:30px;color:var(--green);vertical-align:-3px;margin-right:5px}
  .friends .jb-bar{width:min(340px,82vw);height:9px;background:#E1DFD2;border-radius:99px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(4,36,27,.12)}
  .friends .jb-bar i{display:block;height:100%;width:28%;background:linear-gradient(90deg,var(--mint-deep),var(--mint));border-radius:99px;transition:width .6s cubic-bezier(.3,.8,.3,1)}
  .friends .jb-sub{font-size:13px;color:var(--grey)}
  .friends .jb-sub b{color:var(--green-mid);font-weight:700}
  .friends .jb-cta{display:flex;flex-direction:column;align-items:center;gap:9px;margin-top:6px}
  .friends .jb-note{font-size:12.5px;color:var(--grey);max-width:42ch;line-height:1.5}
  .ftip{text-align:center;margin-top:24px;color:var(--grey);font-size:13px}
 @keyframes pop{0%{transform:scale(.7);opacity:0}60%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}
 .spot.justadded{animation:pop .42s cubic-bezier(.2,.9,.3,1.4)}

 /* ===== modal: vriend worden ===== */
 .modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;background:rgba(4,36,27,.62);backdrop-filter:blur(4px);padding:20px}
 .modal.open{display:flex}
 .modal .box{background:#fff;border-radius:var(--r-lg);padding:32px;max-width:390px;width:100%;text-align:center;box-shadow:var(--sh-pop)}
 .modal h3{font-family:var(--disp);font-weight:700;font-size:23px;color:var(--ink)}
 .modal p{color:var(--muted);font-size:14px;margin:10px 0 18px;line-height:1.55}
 .fprice{display:flex;align-items:center;justify-content:center;gap:16px;background:linear-gradient(160deg,var(--green),var(--green-deep));color:#fff;border-radius:var(--r-md);padding:16px 22px;margin:0 0 18px}
 .fprice .amt{font-family:var(--disp);font-weight:700;font-size:42px;line-height:1;color:var(--mint)}
 .fprice .per{font-weight:550;font-size:12.5px;line-height:1.35;text-align:left;color:#CBE8DA}
 .fsecure{color:var(--grey);font-size:12px;margin:14px 0 0}
 .modal input{width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;font-size:15px;font-family:inherit;margin-bottom:14px;background:var(--paper);transition:border-color .2s,background .2s}
 .modal input:focus{outline:none;border-color:var(--green);background:#fff}
 .modal .acts{display:flex;gap:10px;justify-content:center}
 .modal .cancel{background:none;border:0;color:var(--grey);font-family:var(--disp);font-weight:600;font-size:15px;cursor:pointer;padding:13px}

 /* ===== locatie: clubkaart bij daglicht ===== */
 .locp{padding:88px 0 104px;background:linear-gradient(180deg,#F7F1E0 0%,#F2F0E6 28%,#EAEFE2 64%,#E4ECDF 100%);position:relative}
 .lp-panel{position:relative}
 .lp-grid{display:grid;grid-template-columns:minmax(300px,400px) 1fr;gap:38px;align-items:stretch}
 .lp-eyebrow{font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--green)}
 .lp-left h2{font-family:var(--disp);font-weight:800;font-size:clamp(26px,3.2vw,34px);color:var(--ink);letter-spacing:-.02em;line-height:1.08;margin:10px 0 12px}
 .lp-left h2 .sc{color:var(--green)}
 .lp-left>p{font-size:14px;line-height:1.7;color:var(--muted);margin-bottom:26px}
 .lp-cards{display:flex;flex-direction:column;gap:14px}
 .lx-card{display:block;border-radius:16px;padding:18px 20px;background:#fff;
  border:1px solid rgba(11,105,79,.12);box-shadow:0 18px 40px -30px rgba(7,61,45,.4);
  transition:box-shadow .2s,border-color .2s,transform .2s}
 .lx-card:hover{border-color:rgba(11,105,79,.26);transform:translateY(-3px);box-shadow:0 26px 52px -30px rgba(7,61,45,.5)}
 .lx-tag{font-family:var(--disp);font-weight:700;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--xc,var(--green))}
 .lx-card h4{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--ink);margin:3px 0 2px}
 .lx-addr{font-size:14px;color:var(--grey)}
 .lx-meta{font-family:var(--disp);font-weight:600;font-size:12px;color:var(--grey);margin-top:9px}
 .lx-acts{display:flex;gap:18px;margin-top:13px;align-items:center}
 .lx-acts a{font-family:var(--disp);font-weight:700;font-size:13px;text-decoration:none}
 .lx-route{color:var(--green)}
 .lx-route .arr{display:inline-block;transition:transform .2s}
 .lx-route:hover .arr{transform:translateX(3px)}
 .lx-map-link{color:var(--grey)}
 .lx-map-link:hover{color:var(--ink)}
 .lp-map{position:relative;border-radius:24px;overflow:hidden;min-height:400px;border:1px solid rgba(11,105,79,.12);
  box-shadow:0 30px 70px -38px rgba(7,61,45,.42);background:#e3ebdb}
 .lp-map svg{position:absolute;inset:0;width:100%;height:100%;display:block}
 .lp-halo{transform-box:fill-box;transform-origin:center;animation:lppulse 3s ease-out infinite}
 @keyframes lppulse{0%{transform:scale(.5);opacity:.55}70%{opacity:0}100%{transform:scale(1.9);opacity:0}}
 .lp-open{position:absolute;right:14px;bottom:14px;display:inline-flex;align-items:center;gap:8px;
  font-family:var(--disp);font-weight:600;font-size:13px;color:var(--green-deep);text-decoration:none;
  padding:9px 16px;border-radius:50px;border:1px solid rgba(11,105,79,.22);background:rgba(255,255,255,.88);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .2s,border-color .2s,transform .2s}
 .lp-open:hover{background:#fff;border-color:var(--green);transform:translateY(-2px)}
 .lp-open svg{width:14px;height:14px;flex:0 0 auto;position:static}
 @media(max-width:880px){.lp-grid{grid-template-columns:1fr;gap:24px}.lp-map{min-height:300px}}
 @media(prefers-reduced-motion:reduce){.lp-halo{animation:none;opacity:0}}

 #shoptoast{position:fixed;top:96px;right:24px;z-index:200;background:var(--green-deep);color:#fff;border:1px solid rgba(91,240,194,.3);border-radius:16px;padding:14px 20px;box-shadow:0 18px 44px -12px rgba(4,36,27,.6);display:flex;flex-direction:column;gap:3px;max-width:320px;opacity:0;transform:translateY(-12px) scale(.96);pointer-events:none;transition:opacity .28s,transform .28s cubic-bezier(.34,1.56,.64,1)}
 #shoptoast.show{opacity:1;transform:translateY(0) scale(1)}
 #shoptoast b{font-family:var(--disp);font-weight:600;font-size:15px;color:var(--mint-bright)}
 #shoptoast span{font-size:14px;color:#CFE9DD;line-height:1.5}
 @media(max-width:540px){#shoptoast{right:14px;left:14px;max-width:none}}
 footer{background:var(--night);color:#B9D9CB;padding:64px 0 28px;position:relative;overflow:hidden}
 footer .wm{position:absolute;right:10px;bottom:-48px;font-family:var(--disp);font-weight:850;font-size:clamp(120px,20vw,260px);line-height:.8;color:transparent;-webkit-text-stroke:1.5px rgba(53,217,168,.12);pointer-events:none;user-select:none}
 .fgrid{position:relative;z-index:2;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.1fr;gap:36px}
 @media(max-width:980px){.fgrid{grid-template-columns:1fr 1fr 1fr}}
 @media(max-width:760px){.fgrid{grid-template-columns:1fr 1fr}}
 @media(max-width:480px){.fgrid{grid-template-columns:1fr 1fr;gap:22px 20px}.fgrid>div:first-child{grid-column:1 / -1}}
 footer .logo{background:#fff;display:inline-block;border-radius:14px;padding:10px 14px;margin-bottom:18px}
 footer .logo img{height:44px}
 footer h5{color:#fff;font-family:var(--disp);font-weight:600;font-size:15px;margin-bottom:12px}
 footer a{display:block;font-size:14px;padding:5px 0;opacity:.82;transition:opacity .2s,color .2s}
 footer a:hover{opacity:1;color:var(--mint)}
 .fbar{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.14);margin-top:40px;padding-top:18px;font-size:12.5px;opacity:.65;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

 /* ===== lid-worden modal ===== */
 .jmodal{position:fixed;inset:0;z-index:210;display:none;align-items:center;justify-content:center;background:rgba(4,36,27,.66);backdrop-filter:blur(5px);padding:20px;overflow-y:auto}
 .jmodal.open{display:flex}
 .jbox{background:#fff;border-radius:var(--r-lg);width:100%;max-width:480px;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;box-shadow:var(--sh-pop);max-height:92vh;display:flex;flex-direction:column}
  .jbox>div{display:flex;flex-direction:column;min-height:0;flex:1 1 auto}
 .jhead{background:linear-gradient(160deg,var(--green),var(--green-deep));color:#fff;padding:26px 30px;position:relative;overflow:hidden}
 .jhead:before{content:"";position:absolute;inset:0;opacity:.08;background-image:radial-gradient(#fff 1.3px,transparent 1.3px);background-size:22px 22px}
 .jhead h3{font-family:var(--disp);font-weight:700;font-size:25px;position:relative;z-index:2}
 .jhead p{position:relative;z-index:2;color:#CBE8DA;font-size:14px;margin-top:6px;line-height:1.5}
 .jhead .x{position:absolute;top:20px;right:22px;z-index:3;background:rgba(255,255,255,.16);border:0;color:#fff;width:34px;height:34px;border-radius:50%;font-size:18px;cursor:pointer;transition:background .2s}
 .jhead .x:hover{background:rgba(255,255,255,.3)}
 .jbody{padding:26px 30px 28px;overflow-y:auto;flex:1 1 auto;min-height:0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
 #jform,#mform{flex:1 1 auto;flex-direction:column;min-height:0}
 .calwrap{position:relative;border-radius:24px;overflow:hidden;border:1px solid rgba(11,105,79,.14);box-shadow:0 24px 50px -30px rgba(7,61,45,.4);background:#fff;margin-top:8px}
 .calwrap iframe{width:100%;height:600px;border:0;display:block;border-radius:16px;background:#fff}
 .cal-extlink{display:inline-flex;align-items:center;gap:7px;margin-top:18px;font-family:var(--disp);font-weight:600;font-size:13px;color:var(--muted);cursor:pointer;transition:color .2s ease}
 .cal-extlink:hover{color:var(--green)}
 @media(max-width:600px){.calwrap iframe{height:460px}}
 .aghome{padding:22px 0 46px;margin-bottom:72px}
 .agtabs{display:flex;gap:10px;margin:6px 0 14px;flex-wrap:wrap}
 .agtab{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--green-deep);background:rgba(11,105,79,.06);border:1px solid rgba(11,105,79,.16);border-radius:99px;padding:9px 18px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
 .agtab.on{background:var(--green);color:#fff;border-color:var(--green)}
 @media(max-width:700px){.agtab{font-size:12.5px;padding:7px 14px}}
 .agtab:hover:not(.on){border-color:var(--green)}
 .aglegend{display:flex;gap:16px;flex-wrap:wrap;margin:0 0 16px;font-size:12.5px;color:var(--muted)}
 .aglegend span{display:inline-flex;align-items:center;gap:5px}
 .aglegend i{width:8px;height:8px;border-radius:50%;display:inline-block}
 .aglegend i+i{margin-left:-2px}
 .aghome>.wrap{max-width:1320px}
 .aghome .head{display:block;margin-bottom:24px}
 .aghome .head .ht{max-width:none}
 .aghome .head .lead{color:var(--muted);max-width:48ch;margin-top:16px}
 .frow{margin-bottom:16px}
 .frow.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
 .frow label{display:block;font-family:var(--disp);font-weight:600;font-size:14px;color:var(--ink);margin-bottom:6px}
 .frow input,.frow select{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:11px;font-size:15px;font-family:inherit;background:var(--paper);transition:border-color .2s,background .2s}
 .frow input[type=date]{max-width:100%;box-sizing:border-box}
 .frow input:focus,.frow select:focus{outline:none;border-color:var(--green);background:#fff}
 .sportpick{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
 .sportpick label{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;font-family:var(--disp);font-weight:500;font-size:14px;text-transform:none;letter-spacing:0;color:var(--ink);transition:border-color .2s,background .2s}
 .sportpick label:hover{border-color:var(--green)}
 .sportpick input{display:none}
 .sportpick label.on{border-color:var(--green);background:#EAF3EE;color:var(--green-deep)}
 .sportpick .dot{width:14px;height:14px;border-radius:50%;border:2px solid #C5D1CA;flex:0 0 auto;transition:all .2s}
 .sportpick label.on .dot{border-color:var(--green);background:var(--green);box-shadow:inset 0 0 0 3px #fff}
 .jfoot{padding:0 30px 28px;display:flex;gap:12px;align-items:center}
 .jfoot .btn{flex:1;justify-content:center}
 .jfoot .cancel{background:none;border:0;color:var(--grey);font-family:var(--disp);font-weight:600;font-size:15px;cursor:pointer;padding:13px;flex:0 0 auto}
 .jdone{text-align:center;padding:42px 30px}
 .jdone .check{width:64px;height:64px;border-radius:50%;background:#EAF3EE;color:var(--green);display:grid;place-items:center;margin:0 auto 18px;font-size:30px}
 .jdone h3{font-family:var(--disp);font-weight:700;font-size:24px}
 .jdone h3 span{font-weight:850;color:var(--mint-deep)}
 .jdone p{color:var(--muted);margin-top:10px;font-size:14px;line-height:1.55}
 .jnote{font-size:12px;color:var(--grey);margin-top:6px}

 /* ===== scroll-reveal ===== */
 .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
 .reveal.in{opacity:1;transform:none}
 .reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}

 /* ===== scrollbar ===== */
 ::-webkit-scrollbar{width:12px;height:12px}
 ::-webkit-scrollbar-track{background:var(--paper)}
 ::-webkit-scrollbar-thumb{background:var(--green);border-radius:99px;border:3px solid var(--paper)}
 ::-webkit-scrollbar-thumb:hover{background:var(--green-deep)}

 /* ===== mobiel menu ===== */
 .mobnav{position:fixed;top:88px;left:0;right:0;z-index:79;background:var(--green-deep);
  display:flex;flex-direction:column;padding:14px 16px 18px;gap:8px;
  max-height:calc(100vh - 88px);max-height:calc(100dvh - 88px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  transform:translateY(-135%);transition:transform .28s cubic-bezier(.3,.7,.3,1);box-shadow:0 20px 40px -16px rgba(0,0,0,.5)}
 .mobnav.open{transform:translateY(0)}
 .mobnav .mn-lbl{font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--mint-bright);opacity:.75;padding:6px 4px 1px}
 .mobnav .mn-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .mobnav a{color:#fff;font-family:var(--disp);font-weight:600;font-size:14px;line-height:1.15;padding:13px 14px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;min-height:50px}
 .mobnav a:active{background:rgba(255,255,255,.18)}
 .mobnav .mjoin{background:var(--mint);color:var(--night);font-weight:700;font-size:16px;justify-content:center;text-align:center;margin-top:8px;border:0}
 body.menu-open{overflow:hidden}

 /* ===== mobiel ===== */
 @media(max-width:760px){
  .wrap{padding:0 18px}
  .nav .logo{margin-top:6px;padding:8px 13px;border-radius:14px}
  .nav .logo img{height:46px}
  .reveal{opacity:1!important;transform:none!important;transition:none!important}
  .hero{padding:80px 0 80px}
  .hero .pill{font-size:12.5px;padding:8px 16px;text-align:center;line-height:1.4;max-width:90%;white-space:normal}
  .hero h1{font-size:clamp(42px,12.5vw,64px);line-height:1.08}
  
  .hero p{font-size:16px;line-height:1.55}
  .hero .btns{flex-direction:column;align-items:stretch}
  .hero .btns .btn{justify-content:center}
  section{padding:54px 0}
  section.phero-page{padding:0}
  .head{grid-template-columns:1fr;gap:14px;margin-bottom:32px;align-items:start}
  #nieuws .head .lead{font-size:16px;max-width:none;margin-top:16px}
  .head p{padding-bottom:0}
  .head h2,.vol h2{font-size:32px}
  .head.center{margin-bottom:32px}
  .tiles{margin-top:-36px}
  .tile{min-height:250px;padding:22px 20px}
  .tile .tinfo{max-width:none}
  .news{gap:14px}
  .feat{min-height:310px;padding:24px}
  .feat h3{font-size:23px}
  .feat .grad{background:linear-gradient(180deg,rgba(7,65,47,.08) 16%,rgba(4,36,27,.95))}
  .allnews{margin-top:26px}
  .vol .inner{padding:48px 0}
  .vstat{flex-direction:column;align-items:flex-start;gap:14px}
  .vstat .vbar-wrap{width:100%}
  .vrow{flex-wrap:wrap;gap:10px 14px;padding:14px 14px 14px 0}
  .vrow .when{min-width:50px}
  .vrow .what{flex:1 1 auto;min-width:0}
  .vrow .vbtn,.vrow .done{flex:1 1 100%;margin:2px 0 0 16px;text-align:center}
  .vall{margin-left:2px}
  .friends{padding:54px 0}
  .friends .deco.a{width:200px;height:200px;top:-70px;left:0}
  .friends .deco.b{width:180px;height:180px;bottom:-70px;right:0}
  .wall{padding:14px;gap:7px}
  .spot{font-size:10px;border-radius:8px}
  .sponsors{padding:38px 0 42px}
  
  .slogo{padding:10px 16px 10px 10px;gap:10px}
  .slogo .ini{width:36px;height:36px;font-size:16px;border-radius:10px}
  .slogo span:not(.ini){font-size:14px}
  .slogo.haslogo{padding:11px 18px}
  .slogo .slimg{height:28px}
  .fgrid{gap:28px}
  footer .wm{font-size:120px;right:0;bottom:-26px}
  .jmodal{align-items:flex-start;padding:10px}
  .jbox{max-width:100%;border-radius:18px;max-height:calc(100dvh - 20px)}
  .frow.two,.sportpick{grid-template-columns:1fr}
  .jhead{padding:22px}
  .jbody{padding:22px}
  .jfoot{padding:0 22px 22px;flex-wrap:wrap}
  .fprice{padding:14px 18px}
  .fprice .amt{font-size:34px}
  .modal .acts{flex-direction:column-reverse}
  .modal .acts .btn{width:100%;justify-content:center}
  .modal .cancel{width:100%}
 }
 @media(max-width:420px){
  .hero h1{font-size:clamp(36px,12vw,48px)}
  .nav .logo img{height:48px}
  .tile h3{font-size:24px;min-height:2.12em}
  .head h2,.vol h2{font-size:27px}
  .vstat .vbig b{font-size:40px}
  .wall{grid-template-columns:repeat(3,minmax(0,1fr))}
  .spot{font-size:9.5px}
  .fprice .amt{font-size:30px}
  .vrow .when{min-width:48px;font-size:11px}
 }

 @media(prefers-reduced-motion:reduce){
  
  .reveal{opacity:1;transform:none;transition:none}
  .hero .ph{animation:none;opacity:1;filter:saturate(.55) brightness(.82) contrast(1.05) sepia(.12) hue-rotate(70deg)}
  
  .spot.justadded{animation:none}
  html{scroll-behavior:auto}
 }

 /* ============================================================
   FABEL-SKIN - clubhuis-posterlaag (zelfde opzet, meer feest)
   Vlaggetjes, sticker-schaduwen, inkt-randen, ticker & grain.
   ============================================================ */
 :root{
  --paper:#F7F1E0; --cream:#EFE8D3; --line:#E2DBC4;
 }
 body{background:
  radial-gradient(1100px 520px at 88% -120px, rgba(54,214,164,.10), transparent 60%),
  radial-gradient(900px 480px at -10% 30%, rgba(242,162,59,.05), transparent 55%),
  var(--paper)}
 body:after{content:"";position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

 /* ---- vlaggetjesslinger ---- */
 
 
 
 
 
 
 
 @keyframes sway{from{transform:rotate(-.45deg)}to{transform:rotate(.45deg)}}

 /* ---- hero: rustige diepte, geen poster-offsets ---- */
 .hero h1{text-shadow:0 3px 12px rgba(4,36,27,.7),0 18px 44px rgba(4,36,27,.5)}

 /* ---- knoppen: één pers-motief, schaduw in eigen diepe kleur ---- */
 .btn{box-shadow:0 1px 2px rgba(4,36,27,.12),0 10px 22px -12px var(--glow,rgba(4,36,27,.34));
  transition:transform .2s cubic-bezier(.34,1.4,.5,1),box-shadow .2s,filter .2s,background .2s}
 .btn:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(4,36,27,.14),0 18px 34px -14px var(--glow,rgba(4,36,27,.4));filter:brightness(1.02)}
 .btn:active{transform:translateY(0);box-shadow:0 1px 2px rgba(4,36,27,.14),0 8px 16px -8px var(--glow,rgba(4,36,27,.4));filter:brightness(.99)}
 .btn-mint{--press:var(--mint-deep)}
 .btn-green{--press:#03140E}
 .btn-dark{--press:rgba(0,0,0,.55)}
 .btn-white{--press:rgba(4,36,27,.22)}
 .btn-out{--press:rgba(4,36,27,.55)}

 /* ---- sport-tegels: hoekvlag als kleurcode, zachte diepte ---- */
 .tile{box-shadow:0 4px 14px -8px rgba(4,36,27,.28),0 24px 48px -30px rgba(4,36,27,.45)}
 .tile:hover{box-shadow:0 16px 34px -24px rgba(4,36,27,.36),0 6px 16px -12px rgba(4,36,27,.22)}
 .tile .glow{display:none}
 
 .tile .go{box-shadow:none}
 .tile:hover .go{transform:translateY(-2px)}

 /* ---- sectiekoppen: strakke badges, overal dezelfde ---- */
 .eyebrow{background:rgba(11,105,79,.08);border:1px solid rgba(11,105,79,.18);color:var(--green)}

 /* ---- vrijwilligers: zonnescherm-rand + geplakte briefjes ---- */
 /* zachte, strakke overgang i.p.v. drukke kartelrand */
 .scallop{position:absolute;left:0;right:0;height:54px;z-index:3;pointer-events:none}
 .scallop.top{top:-1px;background:
  radial-gradient(140% 100% at 50% 0%, var(--paper) 0 49.5%, transparent 50%)}
 .scallop.bot{display:none}
.vol .vrow{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:0 16px 34px -20px rgba(0,0,0,.6);padding:14px 16px 14px 24px;transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s,background .28s}.vol .vrow:nth-child(odd),.vol .vrow:nth-child(even){transform:none}.vol .vrow:before{width:3px;background:var(--sc,var(--mint));opacity:.9;box-shadow:0 0 12px var(--sc,var(--mint))}.vol .vrow:not(.filled):hover{transform:translateX(4px);border-color:rgba(91,240,194,.4);background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.04));box-shadow:0 24px 46px -22px rgba(0,0,0,.7)}.vol .vrow:not(.filled):hover:before{width:4px}.vol .vrow .when{background:rgba(4,36,27,.42);color:rgba(206,228,219,.75);border-radius:12px;border:1px solid color-mix(in srgb,var(--sc,var(--mint)) 26%,transparent);padding:9px 8px}.vol .vrow .when b{color:#fff}.vol .vrow .what b{color:#fff;letter-spacing:-.005em}.vol .vrow .what span{color:rgba(200,224,214,.66)}.vol .vrow.filled{opacity:1;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.08)}.vol .vrow.filled .what b,.vol .vrow.filled .when b{color:rgba(255,255,255,.72)}.vol .vbtn{border:none;background:var(--mint);color:var(--night);font-weight:700;box-shadow:0 10px 22px -10px rgba(54,214,164,.5);transition:transform .2s,box-shadow .2s,filter .2s}.vol .vbtn:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 16px 30px -12px rgba(54,214,164,.6)}.vol .vrow .done{background:rgba(91,240,194,.14);color:var(--mint-bright);border:1px solid rgba(91,240,194,.3);font-weight:700}.vol .vstat{border:1px solid rgba(91,240,194,.22);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));box-shadow:0 16px 40px -24px rgba(0,0,0,.5)}.vol .vintro .veyebrow{border-style:solid;transform:none;box-shadow:none;border:1px solid rgba(91,240,194,.28);background:rgba(4,36,27,.4);color:var(--mint-bright);letter-spacing:.16em}

 /* ---- modals & toast: zachte diepte ---- */
 .modal .box,.jbox{border:1px solid rgba(11,105,79,.1);box-shadow:var(--sh-pop)}
 .modal input:focus,.frow input:focus,.frow select:focus{box-shadow:0 0 0 4px rgba(54,214,164,.14)}
 #shoptoast{border:1px solid rgba(91,240,194,.35);box-shadow:0 18px 44px -12px rgba(4,36,27,.6)}
 footer .wm{-webkit-text-stroke:2px rgba(53,217,168,.22)}

 /* ---- mobiel & motion ---- */
 @media(max-width:760px){
  
  
  
  
  
  
  .wall{transform:none;border-width:5px}

 }

 /* ===== footer ===== */
 footer{background:
  radial-gradient(120% 90% at 12% 0%, rgba(54,214,164,.10), transparent 55%),
  radial-gradient(120% 90% at 90% 8%, rgba(242,162,59,.07), transparent 55%),
  linear-gradient(180deg,#052B20,var(--night) 70%);padding:78px 0 30px}
 footer:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:3;
  background:linear-gradient(90deg,var(--c-hand),var(--mint-bright) 30%,var(--c-hsb) 64%,var(--c-jdb) 100%);
  opacity:.9}
 .fgrid{gap:44px}
 footer .logo{box-shadow:0 12px 30px -10px rgba(0,0,0,.5);transform:rotate(-2deg)}
 footer h5{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;opacity:.95;
  margin-bottom:16px;position:relative;padding-bottom:10px}
 footer h5:after{content:"";position:absolute;left:0;bottom:0;width:26px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--mint-bright),var(--c-hsb))}
 footer a{opacity:.78;font-size:14px;padding:6px 0;position:relative;width:fit-content;transition:opacity .2s,color .2s,transform .2s}
 footer a:hover{opacity:1;color:var(--mint-bright);transform:translateX(3px)}
 /* bonden-links met sport-stip */
 .fbond a{display:flex;align-items:center;gap:9px}
 .fbond a .bdot{width:7px;height:7px;border-radius:50%;flex:none;box-shadow:0 0 8px -1px currentColor;
  transition:transform .2s}
 .fbond a:hover .bdot{transform:scale(1.35)}
 .fbond a .ext{margin-left:2px;opacity:.45;font-size:11px;transition:opacity .2s,transform .2s}
 .fbond a:hover .ext{opacity:.9;transform:translate(2px,-2px)}
 /* social-iconen onder het logo */
 .fsocial{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;margin:38px 0 6px}
 .fsocial .s-labeled{display:flex;flex-direction:column;align-items:center;gap:5px}
 .fsocial .s-tag{font-size:10.5px;font-weight:600;color:#9fc9b3;letter-spacing:.02em}
 footer .fsocial a{display:inline-flex !important;align-items:center;justify-content:center;flex:none !important;width:42px !important;height:42px !important;padding:0 !important;opacity:1;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#cfeede;position:static;backdrop-filter:blur(4px);transition:transform .2s cubic-bezier(.34,1.56,.64,1),background .2s,border-color .2s,color .2s,box-shadow .2s}
 .fsocial .s-dotwrap{position:relative;display:inline-flex}
 .fsocial .s-dot{position:absolute;bottom:0;right:0;width:17px;height:17px;border-radius:50%;background:var(--night);border:2px solid var(--night);box-shadow:0 0 0 1px rgba(255,255,255,.14);display:grid;place-items:center;pointer-events:none}
 .fsocial .s-dot svg{width:11px;height:11px}
 .fsocial a svg{width:18px;height:18px;display:block}
 .fsocial a:hover{transform:translateY(-3px)}
 .fbar{border-top:1px solid rgba(255,255,255,.1);margin-top:52px;padding-top:22px;opacity:.5;
  font-size:10.5px;letter-spacing:.04em;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
 .fbar .heart{color:var(--c-hsb);font-style:normal}
 .fbar a{display:inline;padding:0;opacity:.9;color:var(--mint-bright)}
 footer .wm{bottom:-60px;-webkit-text-stroke:1.5px rgba(54,214,164,.1)}
 

 /* ===== vriendenwand strak in lijn met de rest ===== */
 .friends .head h2{letter-spacing:-.02em}
 .fcount{margin-top:24px}
 .bar{background:#DCD9CB;box-shadow:inset 0 1px 2px rgba(4,36,27,.1)}
 .bar i{background:linear-gradient(90deg,var(--green),var(--mint-deep))}
 /* het "bord": strak, één fijne hairline + zachte diepte (geen 8px rand/rotatie) */
 .friends .wall{border:1px solid rgba(255,255,255,.1);outline:none;transform:none;
  background:linear-gradient(160deg,#0E7D5F 0%,var(--green-deep) 78%);
  box-shadow:0 44px 100px -46px rgba(4,35,26,.8),inset 0 0 0 1px rgba(255,255,255,.05),inset 0 2px 30px rgba(0,0,0,.18);
  padding:30px;border-radius:26px}
 /* vrije plekjes: subtiel, strak (geen dashed) */
 .friends .spot{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.5);border-radius:13px;font-weight:550;
  transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s,background .2s,border-color .2s}
 .friends .spot:not(.taken):hover{background:rgba(91,240,194,.12);border-color:rgba(91,240,194,.4);
  color:#fff;transform:translateY(-2px)}
 /* ingenomen plekjes: strakke naamplaatjes, geen plakband/rotatie */
 .friends .spot.taken{background:linear-gradient(180deg,#ffffff,#f3f6f2);color:var(--green-deep);
  border:1px solid rgba(255,255,255,.9);border-radius:13px;font-weight:700;
  box-shadow:0 14px 30px -14px rgba(0,0,0,.5),inset 0 0 0 1px rgba(7,61,45,.04);transform:none}
 .friends .spot.taken:before{content:none}
 .friends .spot.taken:nth-child(3n),.friends .spot.taken:nth-child(4n){transform:none}
 .friends .spot.taken:hover{transform:translateY(-3px) scale(1.03);z-index:2;
  box-shadow:0 22px 44px -18px rgba(0,0,0,.55)}
 /* "mint" gemarkeerde naamplaatjes (de groene accent-spots) net iets sjieker */
 .friends .spot.taken.hl,.friends .spot.taken.dark{background:linear-gradient(180deg,var(--mint-bright),var(--mint));
  color:var(--green-deep);border-color:rgba(255,255,255,.65);
  box-shadow:0 14px 30px -14px rgba(20,120,90,.6),inset 0 0 0 1px rgba(255,255,255,.3)}
 .friends .spot.taken.mid{background:linear-gradient(180deg,#eafaf3,#d6f0e6);color:var(--green-deep);
  border-color:rgba(255,255,255,.8)}
 .ftip{margin-top:26px;color:var(--grey);opacity:.85}

 /* ============================================================
   SPA PAGINA'S - routing + content componenten
   ============================================================ */
 .page{display:none}
 .page.is-active{display:block;animation:pagein .45s cubic-bezier(.22,1,.36,1)}
 @keyframes pagein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
 .menu a.on{color:var(--mint);font-weight:700}
 .mobnav a.on{color:var(--mint)}

 /* sub-hero voor binnenpagina's */
 .phero{position:relative;background:var(--night);color:#fff;overflow:hidden;padding:120px 0 92px}
 .phero .phero-badge{position:absolute;top:36px;right:5%;width:180px;height:auto;border-radius:16px;box-shadow:0 20px 44px -14px rgba(0,0,0,.6);z-index:2}
 @media(max-width:900px){.phero .phero-badge{display:none}}
 .phero .ph{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.97;z-index:0;filter:brightness(1.15) saturate(1.05) contrast(1.01)}
 #phbg-handbal{background-image:url('img/img11.webp')}
 #phbg-hsb{background-image:url('img/foto-actie.webp');background-position:center 42%}
 #phbg-darten{background-image:url('img/img13.webp')}
 #phbg-jdb{background-image:url('img/foto-boules.webp');background-position:center 62%}
 #phbg-club{background-image:url('img/img15.webp')}
 #phbg-wedstrijden{background-image:url('img/foto-slag.webp');background-position:center 38%}
 #phbg-salvettiloop{background-image:url('img/rsl-bos.webp');background-position:center 55%}
 .phero:before{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(4,35,26,.26),rgba(4,20,15,.58) 92%),radial-gradient(120% 90% at 80% -10%,rgba(54,214,164,.13),transparent 60%)}
 .phero .wrap{position:relative;z-index:2}
 .phero .crumbs{font-family:var(--disp);font-size:13px;letter-spacing:.04em;color:rgba(206,228,219,.7);margin-bottom:18px}
 .phero .crumbs a{color:var(--mint-bright);cursor:pointer}
 .phero .crumbs a:hover{text-decoration:underline}
 .phero .ptag{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;font-size:12px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--mint-bright);background:rgba(54,214,164,.12);
  border:1px solid rgba(91,240,194,.28);padding:8px 18px;border-radius:50px;margin-bottom:18px}
 .phero .ptag .dot{width:8px;height:8px;border-radius:50%;background:var(--c,var(--mint))}
 .phero h1{font-family:var(--disp);font-weight:850;font-size:clamp(38px,6vw,68px);line-height:1.02;letter-spacing:-.025em}
 .phero h1 .sc{color:var(--mint-bright)}
 .phero .sub{margin-top:20px;font-size:18px;line-height:1.6;color:rgba(216,236,227,.82);max-width:60ch}
 .phero .pbtns{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap}

 .psec{padding:84px 0}
 .psec.alt{background:linear-gradient(180deg,#F4F2E9,#EFEBDD)}
 .psec.green{background:linear-gradient(165deg,var(--green-deep),var(--green) 60%,var(--green-deep));color:#fff}
 .psec .lead2{font-size:16px;line-height:1.7;color:#3f5a4d;max-width:64ch}
 .psec.green .lead2{color:#CBE8DA}
 .seclbl{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:700;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--green);background:transparent;
  border:1px solid rgba(11,105,79,.18);padding:7px 16px;border-radius:50px;margin-bottom:16px}
 .psec.green .seclbl{color:var(--mint-bright);background:rgba(54,214,164,.12);border-color:rgba(91,240,194,.28)}
 .psec h2{font-family:var(--disp);font-weight:800;font-size:clamp(28px,4vw,42px);line-height:1.06;letter-spacing:-.02em;color:var(--ink)}
 .psec.green h2{color:#fff}
 .psec h2 .sc{color:var(--mint-deep)}
 .psec.green h2 .sc{color:var(--mint-bright)}
 .psec h3{font-family:var(--disp);font-weight:700;font-size:21px;color:var(--ink);margin-bottom:8px}

 /* info-kaarten grid */
 .cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
 .cards2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:40px}
 .icard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:16px;padding:28px;
  box-shadow:0 20px 46px -30px rgba(7,61,45,.4);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s;position:relative;overflow:hidden}
 .icard:before{content:"";position:absolute;left:0;top:24px;bottom:24px;width:4px;border-radius:0 4px 4px 0;
  background:var(--c,var(--green));box-shadow:0 0 14px color-mix(in srgb,var(--c,var(--green)) 55%,transparent)}
 .icard:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--c,var(--green)) 30%,rgba(11,105,79,.1));box-shadow:0 34px 60px -32px rgba(7,61,45,.5)}
 .icard .ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:24px;margin-bottom:16px;
  background:linear-gradient(155deg,color-mix(in srgb,var(--c,var(--green)) 20%,transparent),color-mix(in srgb,var(--c,var(--green)) 6%,transparent));
  color:var(--c,var(--green));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c,var(--green)) 20%,transparent)}
 .icard p{color:var(--muted);font-size:16px;line-height:1.65;margin-top:6px}
 .prakt{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:40px}
 @media(max-width:760px){.prakt{grid-template-columns:1fr}}
 .pkcard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:16px;padding:24px 26px}
 .pkcard .pkh{font-family:var(--disp);font-weight:700;font-size:17px;color:var(--ink);margin-bottom:6px}
 .pkcard p{color:var(--muted);font-size:16px;line-height:1.6}
 .pkcard a{color:var(--c,var(--green));font-weight:600}
 .sportgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
 @media(max-width:820px){.sportgrid{grid-template-columns:1fr 1fr}}
 @media(max-width:480px){.sportgrid{grid-template-columns:1fr}}
 .sportlink{display:flex;flex-direction:column;gap:6px;text-align:left;background:#fff;border:1px solid rgba(11,105,79,.1);border-left:4px solid var(--c,var(--green));border-radius:14px;padding:20px 22px;transition:transform .2s,box-shadow .2s;cursor:pointer}
 .ledengrid{grid-template-columns:repeat(3,1fr)}
 @media(max-width:980px){.ledengrid{grid-template-columns:repeat(3,1fr)}}
 @media(max-width:680px){.ledengrid{grid-template-columns:1fr 1fr}}
 @media(max-width:460px){.ledengrid{grid-template-columns:1fr}}
 .ledengrid .sportlink .ll-ic{font-family:var(--disp);font-weight:700;font-size:13px;color:var(--c);opacity:.85;letter-spacing:.06em;margin-bottom:2px}
 .ledengrid .sportlink h3{margin:0;font-size:17px}
 .ledengrid .sportlink .go{margin-top:8px;font-weight:600;color:var(--c);font-size:14px}
 .sportlink:hover{transform:translateY(-4px);box-shadow:0 28px 50px -34px rgba(7,61,45,.5)}
 .sportlink h3{font-family:var(--disp);font-weight:700;font-size:19px;color:var(--ink);margin:0}
 .sportlink span{font-size:14px;color:var(--muted)}
 .sportlink .go{margin-top:4px;font-size:14px;font-weight:600;color:var(--c,var(--green))}
 .locblk{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px}
 @media(max-width:760px){.locblk{grid-template-columns:1fr}}
 .loccard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:18px;padding:26px}
 .loccard .lk{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--c,var(--green))}
 .loccard h3{font-family:var(--disp);font-weight:700;font-size:20px;color:var(--ink);margin:6px 0 4px}
 .loccard p{color:var(--muted);font-size:14px;line-height:1.6}
 .icard .ico.num{background:none;box-shadow:none;border-radius:0;width:auto;height:auto;font-family:var(--disp);font-weight:800;font-size:30px;color:var(--c,var(--green));margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid color-mix(in srgb,var(--c,var(--green)) 35%,transparent);display:inline-block;place-items:unset;letter-spacing:-.02em}
 .todo{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:#9a7b1e;background:rgba(240,162,60,.12);border:1px dashed rgba(240,162,60,.5);border-radius:7px;padding:4px 10px;margin-top:10px;font-family:var(--body)}
 .todo:before{content:"✎";font-size:12px}

 .psec.green .icard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 44px -26px rgba(0,0,0,.55)}
 .psec.green .icard h3{color:#fff}
 .psec.green .icard p{color:rgba(206,228,219,.75)}
 .psec.green .icard .ico{color:var(--c,var(--mint));background:rgba(255,255,255,.06)}

 /* trainingsschema tabel */
 .schedule{margin-top:36px;border:1px solid rgba(11,105,79,.12);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 20px 46px -30px rgba(7,61,45,.35)}
 .schedule .srow{display:grid;grid-template-columns:1.1fr 1fr 1fr .9fr;gap:0;border-bottom:1px solid rgba(11,105,79,.08)}
 .schedule .srow:last-child{border-bottom:0}
 .schedule .srow.head{background:var(--green-deep);color:#fff;font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
 .schedule .srow>div{padding:15px 20px;font-size:14px;color:var(--ink);display:flex;align-items:center}
 .schedule .srow.head>div{color:#fff}
 .schedule .srow:not(.head):hover{background:rgba(54,214,164,.06)}
 .schedule .srow .team{font-family:var(--disp);font-weight:700}
 .pill-sm{display:inline-block;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.04em;
  padding:4px 11px;border-radius:50px;background:color-mix(in srgb,var(--c,var(--green)) 14%,transparent);color:var(--c,var(--green))}

 /* coach / contactpersoon */
 .people{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
 .person{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:16px;padding:20px;text-align:center;box-shadow:0 18px 40px -28px rgba(7,61,45,.35);transition:transform .28s cubic-bezier(.2,.8,.3,1),box-shadow .28s cubic-bezier(.2,.8,.3,1),border-color .2s ease}
 .person:hover{transform:translateY(-3px);box-shadow:var(--sh-card);border-color:rgba(11,105,79,.2)}
 .person .av{width:58px;height:58px;border-radius:50%;margin:0 auto 12px;display:grid;place-items:center;
  font-family:var(--disp);font-weight:800;font-size:21px;color:#fff;
  background:linear-gradient(155deg,var(--c,var(--green)),color-mix(in srgb,var(--c,var(--green)) 60%,#000))}
 .person h4{font-family:var(--disp);font-weight:700;font-size:17px;color:var(--ink)}
 .person .role{font-size:13px;color:var(--c,var(--green));font-weight:600;margin-top:2px}
 .person .mail{display:block;margin-top:9px;font-size:13px;color:var(--ink);font-weight:600;word-break:break-word}
 .person .mail:hover{color:var(--c,var(--green))}
 .person a.msg{display:inline-block;margin-top:7px;font-size:12.5px;color:var(--green);opacity:.78}
 .person a:hover{opacity:1;color:var(--mint-deep)}

 /* nieuws-archief grid */
 .archive{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px}
 .acard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:20px;overflow:hidden;cursor:pointer;
  box-shadow:0 20px 46px -32px rgba(7,61,45,.4);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s;display:flex;flex-direction:column}
 .acard:hover{transform:translateY(-6px);box-shadow:0 36px 64px -34px rgba(7,61,45,.55)}
 .acard .athumb{height:170px;background-size:cover;background-position:center;position:relative;background-color:var(--c,var(--green))}
 .acard .athumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(4,36,27,.5))}
 .acard .atag{position:absolute;left:14px;top:14px;z-index:2;font-family:var(--disp);font-weight:700;font-size:11px;
  letter-spacing:.04em;padding:6px 13px;border-radius:50px;background:var(--c,var(--mint));color:var(--night)}
 .acard .abody{padding:20px 22px 22px;flex:1;display:flex;flex-direction:column}
 .acard .adate{font-family:var(--disp);font-weight:600;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
 .acard h3{font-family:var(--disp);font-weight:700;font-size:18px;line-height:1.25;color:var(--ink);margin:8px 0 10px}
 .acard p{font-size:14px;color:var(--muted);line-height:1.6;flex:1}
 .acard .more{margin-top:14px;font-family:var(--disp);font-weight:700;font-size:14px;color:var(--green);display:inline-flex;align-items:center;gap:7px}
 .afilters{display:flex;gap:10px;flex-wrap:wrap;margin:30px 0 38px}
 .afilter{font-family:var(--disp);font-weight:600;font-size:14px;padding:9px 18px;border-radius:50px;cursor:pointer;
  border:1px solid rgba(11,105,79,.18);background:#fff;color:var(--green);transition:all .2s}
 .afilter:hover{border-color:var(--green)}
 .afilter.on{background:var(--green-deep);color:#fff;border-color:var(--green-deep)}

 /* artikel-detail */
 .article{max-width:760px;margin:0 auto}
 .article .meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:8px}
 .article .ahero-img{width:100%;height:340px;border-radius:22px;background-size:cover;background-position:center;margin:30px 0 36px;box-shadow:0 30px 64px -34px rgba(7,61,45,.5)}
 .article p{font-size:17px;line-height:1.75;color:#33473d;margin-bottom:20px}
 .article h3{font-family:var(--disp);font-weight:700;font-size:24px;color:var(--ink);margin:34px 0 10px}
 .article .back{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;color:var(--green);cursor:pointer;margin-bottom:30px}
 .article .back:hover{color:var(--mint-deep)}

 /* contact / formulier */
 .cgrid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start;margin-top:44px}
 .cdir{margin-top:14px}
 .cdir .dgroup{margin-bottom:30px}
 .cdir .dhead{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--ink);display:flex;align-items:center;gap:10px;margin-bottom:12px}
 .cdir .dhead .dbar{width:26px;height:3px;border-radius:3px;background:var(--c,var(--green))}
 .cdir .drow{display:flex;flex-direction:column;gap:3px;padding:11px 0;border-bottom:1px solid rgba(11,105,79,.1)}
 .cdir .drow:last-child{border-bottom:0}
 .cdir .dwho{font-size:14px;color:var(--ink)}
 .cdir .dwho b{font-weight:600}
 .cdir .dwho .drole{color:var(--muted)}
 .cdir .drow a{font-size:14px;color:var(--c,var(--green));font-weight:600;word-break:break-word}
 .cdir .drow a:hover{opacity:.75}
 .cdir-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 46px}
 @media(max-width:760px){.cdir-grid{grid-template-columns:1fr}}
 .cinfo .crow{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid rgba(11,105,79,.1)}
 .cinfo .cico svg{width:21px;height:21px;display:block}
 .cinfo .crow:last-child{border-bottom:0}
 .cinfo .cico{width:46px;height:46px;border-radius:13px;flex:0 0 auto;display:grid;place-items:center;font-size:20px;
  background:linear-gradient(155deg,rgba(11,105,79,.16),rgba(11,105,79,.06));color:var(--green);box-shadow:inset 0 0 0 1px rgba(11,105,79,.16)}
 .cinfo .crow h4{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink)}
 .cinfo .crow p,.cinfo .crow a{font-size:14px;color:var(--muted);line-height:1.6}
 .cinfo .crow a:hover{color:var(--green)}
 .cform{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:24px;padding:34px;box-shadow:0 28px 60px -34px rgba(7,61,45,.45)}
 .cform .fr{margin-bottom:18px}
 .cform .fr.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
 .cform label{display:block;font-family:var(--disp);font-weight:600;font-size:14px;color:var(--ink);margin-bottom:7px}
 .cform input,.cform select,.cform textarea{width:100%;border:1.5px solid rgba(11,105,79,.16);border-radius:12px;
  padding:12px 14px;font-size:15px;font-family:inherit;color:var(--ink);background:#fcfdfb;transition:border-color .2s,box-shadow .2s}
 .cform textarea{min-height:120px;resize:vertical}
 .cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--mint-deep);box-shadow:0 0 0 4px rgba(54,214,164,.12)}
 .cform .submit{width:100%;justify-content:center;margin-top:6px}
 .cdone{text-align:center;padding:30px 10px}
 .cdone .check{width:64px;height:64px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;font-size:32px;color:#fff;background:linear-gradient(155deg,var(--mint),var(--mint-deep));box-shadow:0 14px 30px -10px rgba(27,158,118,.6)}
 .cdone h3{font-family:var(--disp);font-weight:800;font-size:24px;color:var(--ink);margin-bottom:8px}
 .cdone p{color:var(--muted);font-size:15.5px;line-height:1.6}

 /* FAQ accordion */
 .faq{margin-top:36px;max-width:780px}
 .faq details{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:14px;margin-bottom:12px;overflow:hidden;box-shadow:0 12px 28px -22px rgba(7,61,45,.3)}
 .faq summary{padding:18px 22px;font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
 .faq summary::-webkit-details-marker{display:none}
 .faq summary:after{content:"+";font-size:22px;color:var(--green);transition:transform .2s;font-weight:400}
 .faq details[open] summary:after{transform:rotate(45deg)}
 .faq details p{padding:0 22px 20px;color:var(--muted);font-size:15px;line-height:1.7}

 /* stats band */
 .statband{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:8px}
 .statband .st{text-align:center}
 .statband .st b{display:block;font-family:var(--disp);font-weight:850;font-size:46px;line-height:1;color:var(--mint-bright)}
 .statband .st span{font-size:14px;color:#CBE8DA;margin-top:8px;display:block}

 /* CTA-strip */
 .ctastrip{background:linear-gradient(155deg,var(--green),var(--green-deep));border-radius:28px;padding:54px;text-align:center;color:#fff;
  box-shadow:0 40px 90px -44px rgba(4,35,26,.7);position:relative;overflow:hidden;margin-top:20px}
 .ctastrip:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 80% -10%,rgba(54,214,164,.22),transparent 60%)}
 .ctastrip h2{position:relative;color:#fff;margin-bottom:12px}
 .ctastrip p{position:relative;color:#CBE8DA;font-size:17px;max-width:54ch;margin:0 auto 26px}
 .ctastrip .pbtns{position:relative;justify-content:center}

 @media(max-width:880px){
  .cards3,.people,.archive{grid-template-columns:1fr 1fr}
  .cgrid{grid-template-columns:1fr;gap:32px}
  .statband{grid-template-columns:1fr 1fr}
  .schedule .srow{grid-template-columns:1fr 1fr;font-size:13px}
  .phero{padding:100px 0 70px}
 }
 @media(max-width:600px){
  .cards3,.cards2,.people,.archive{grid-template-columns:1fr}
  .cform .fr.two{grid-template-columns:1fr}
  .ctastrip{padding:38px 26px}
 }

 /* ===== homepage polish (rondje) ===== */
 /* hero tekst gecentreerd (origineel) */
 /* 2) shop-badge subtieler - minder schreeuwerig, geen puls */
 nav.menu .shopbtn .soon{font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:lowercase;
  color:rgba(230,244,236,.62);background:none;box-shadow:none;animation:none;padding:0}
 nav.menu .shopbtn .soon{padding-left:8px;border-left:1px solid rgba(230,244,236,.22)}

 /* ============================================================
   MODERNE MODULES: agenda, wedstrijden, teams, vrijwilligers
   ============================================================ */
 /* nav dropdown "Meer" */
 .menu .navdrop{position:relative}
 .menu .navdrop>button{font-family:inherit;font-size:15px;color:#F4FBF7;background:none;border:0;cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;padding:10px 15px;border-radius:50px;font-weight:500;white-space:nowrap;transition:background .2s,color .2s,transform .2s}
 .menu .navdrop>button:hover{background:rgba(53,217,168,.13);color:#fff;transform:translateY(-2px)}
 .menu .navdrop.open>button{color:#fff}
 .menu .navdrop>button:after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform .2s;opacity:.7}
 .menu .navdrop.open>button:after{transform:rotate(-135deg) translateY(-1px)}
 .menu .navdrop .ddmenu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-6px);
  background:#fff;border-radius:16px;padding:8px;min-width:210px;border:1px solid var(--line);opacity:0;visibility:hidden;transition:all .2s cubic-bezier(.22,1,.36,1);
  box-shadow:0 24px 50px -20px rgba(4,35,26,.4),0 2px 8px rgba(4,35,26,.08),inset 0 0 0 1px rgba(11,105,79,.08);z-index:60}
 .menu .navdrop.open .ddmenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
 .menu .navdrop .ddmenu a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;color:var(--ink)!important;
  font-family:var(--disp);font-weight:600;font-size:14px;transition:background .2s;white-space:nowrap}
 .menu .navdrop .ddmenu a:hover{background:rgba(54,214,164,.1);color:var(--green-deep)!important}
 .menu .navdrop .ddmenu a:hover .di{background:linear-gradient(155deg,rgba(11,105,79,.22),rgba(11,105,79,.10));color:var(--green-deep)}
 .menu .navdrop .ddmenu a .di{width:30px;height:30px;border-radius:10px;transition:background .2s ease,color .2s ease;display:grid;place-items:center;font-size:15px;flex:0 0 auto;
  background:linear-gradient(155deg,rgba(11,105,79,.14),rgba(11,105,79,.05));color:var(--green)}
 .menu .navdrop .ddmenu a span small{display:block;font-weight:500;font-size:11.5px;color:var(--grey);margin-top:1px}

 /* ===== AGENDA ===== */
 .agfilters{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 34px}
 .agtl{position:relative;max-width:880px}
 .agtl:before{content:"";position:absolute;left:118px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,rgba(11,105,79,.18),rgba(11,105,79,.05));border-radius:2px}
 .agitem{display:grid;grid-template-columns:104px 1fr;gap:28px;position:relative;padding:14px 0}
 .agdate{text-align:right;padding-top:18px}
 .agdate .d{font-family:var(--disp);font-weight:850;font-size:30px;color:var(--ink);line-height:1}
 .agdate .m{font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-top:3px}
 .agdate .day{font-size:12px;color:var(--grey);margin-top:2px}
 .agcard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:18px;padding:20px 24px;position:relative;
  box-shadow:0 16px 38px -26px rgba(7,61,45,.4);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s}
 .agcard:hover{transform:translateX(4px);border-color:color-mix(in srgb,var(--c,var(--green)) 30%,rgba(11,105,79,.1));box-shadow:0 24px 48px -26px rgba(7,61,45,.5)}
 .agcard:before{content:"";position:absolute;left:-29px;top:30px;width:15px;height:15px;border-radius:50%;background:var(--c,var(--green));
  border:3px solid #F4F2E9;box-shadow:0 0 0 2px color-mix(in srgb,var(--c,var(--green)) 40%,transparent)}
 .agcard .agtop{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
 .agcard .agtype{font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  padding:5px 12px;border-radius:50px;background:color-mix(in srgb,var(--c,var(--green)) 14%,transparent);color:var(--c,var(--green))}
 .agcard .agtime{font-family:var(--disp);font-weight:600;font-size:14px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
 .agcard h3{font-family:var(--disp);font-weight:700;font-size:19px;color:var(--ink);margin-bottom:4px}
 .agcard .agloc{font-size:14px;color:var(--grey);display:inline-flex;align-items:center;gap:6px}
 .agcard .agadd{position:absolute;right:20px;top:20px;width:36px;height:36px;border-radius:11px;border:1px solid rgba(11,105,79,.16);
  background:#fff;color:var(--green);display:grid;place-items:center;cursor:pointer;transition:all .2s;font-size:18px;text-decoration:none}
 .agcard .agadd:hover{background:var(--green);color:#fff;border-color:var(--green);transform:scale(1.06)}

 /* ===== WEDSTRIJDEN / UITSLAGEN ===== */
 .wtabs{display:inline-flex;background:#fff;border:1px solid rgba(11,105,79,.12);border-radius:50px;padding:5px;gap:4px;margin-bottom:34px;box-shadow:0 10px 26px -18px rgba(7,61,45,.3)}
 .wtab{font-family:var(--disp);font-weight:700;font-size:14px;padding:10px 24px;border-radius:50px;cursor:pointer;color:var(--muted);border:0;background:none;transition:all .2s}
 .wtab.on{background:var(--green-deep);color:#fff}
 .wlist{display:flex;flex-direction:column;gap:14px;max-width:860px}
 .match{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:18px;padding:18px 24px;display:grid;
  grid-template-columns:96px 1fr auto;gap:20px;align-items:center;box-shadow:0 14px 34px -26px rgba(7,61,45,.38);
  transition:transform .2s,box-shadow .2s,border-color .2s}
 .match:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--c,var(--green)) 28%,rgba(11,105,79,.1));box-shadow:0 24px 46px -26px rgba(7,61,45,.48)}
 .match .mwhen{text-align:center;border-right:1px solid rgba(11,105,79,.1);padding-right:18px}
 .match .mwhen .md{font-family:var(--disp);font-weight:800;font-size:15px;color:var(--ink)}
 .match .mwhen .mt{font-size:12.5px;color:var(--grey);margin-top:2px}
 .match .mteams{display:flex;flex-direction:column;gap:7px}
 .match .mteam{display:flex;align-items:center;gap:12px;font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink)}
 .match .mteam.home .mbadge{background:var(--c,var(--green))}
 .match .mteam .mbadge{width:26px;height:26px;border-radius:8px;flex:0 0 auto;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800;background:#b7c3bb}
 .match .mteam.win{color:var(--green-deep)}
 .match .mteam .msc{margin-left:auto;font-family:var(--disp);font-weight:850;font-size:20px;min-width:30px;text-align:right}
 .match .mteam.win .msc{color:var(--mint-deep)}
 .match .mmeta{text-align:right}
 .match .mtag{font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;padding:5px 12px;border-radius:50px;
  background:color-mix(in srgb,var(--c,var(--green)) 13%,transparent);color:var(--c,var(--green));white-space:nowrap}
 .match .mstatus{font-size:12.5px;color:var(--grey);margin-top:8px;display:block}
 .match .mwin{display:inline-flex;align-items:center;gap:5px;font-family:var(--disp);font-weight:700;font-size:12px;color:var(--mint-deep);margin-top:8px}
 @media(max-width:680px){.match{grid-template-columns:1fr;gap:14px}.match .mwhen{border-right:0;border-bottom:1px solid rgba(11,105,79,.1);padding-right:0;padding-bottom:12px;text-align:left;display:flex;gap:10px;align-items:baseline}.match .mmeta{text-align:left}}

 /* ===== TEAMS ===== */
 .teamgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:8px}
 .teamcard{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:20px;overflow:hidden;cursor:pointer;
  box-shadow:0 18px 42px -28px rgba(7,61,45,.4);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s}
 .teamcard:hover{transform:translateY(-6px);box-shadow:0 34px 60px -32px rgba(7,61,45,.55)}
 .teamcard .tch{height:90px;background:linear-gradient(135deg,var(--c,var(--green)),color-mix(in srgb,var(--c,var(--green)) 55%,#063d2f));position:relative;display:flex;align-items:flex-end;padding:16px 20px}
 .teamcard .tch:after{content:"";position:absolute;inset:0;background:radial-gradient(120% 100% at 90% -20%,rgba(255,255,255,.25),transparent 60%)}
 .teamcard .tch .tsport{position:relative;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.9)}
 .teamcard .tcb{padding:20px 22px 22px}
 .teamcard h3{font-family:var(--disp);font-weight:800;font-size:21px;color:var(--ink);margin-bottom:4px}
 .teamcard .tcsub{font-size:14px;color:var(--grey)}
 .teamcard .tcrow{display:flex;gap:18px;margin-top:16px;padding-top:16px;border-top:1px solid rgba(11,105,79,.08)}
 .teamcard .tcstat b{display:block;font-family:var(--disp);font-weight:850;font-size:22px;color:var(--c,var(--green));line-height:1}
 .teamcard .tcstat span{font-size:11.5px;color:var(--grey);margin-top:2px;display:block}
 .teamcard .tcmore{margin-top:16px;font-family:var(--disp);font-weight:700;font-size:14px;color:var(--c,var(--green));display:inline-flex;align-items:center;gap:6px}

 /* ===== VRIJWILLIGERS-MODULE ===== */
 .vhero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:8px}
 .vstat-c{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:22px;text-align:center}
 .vstat-c b{display:block;font-family:var(--disp);font-weight:850;font-size:38px;color:var(--mint-bright);line-height:1}
 .vstat-c span{font-size:13px;color:#CBE8DA;margin-top:8px;display:block}
 .vboard{display:grid;grid-template-columns:1.6fr .9fr;gap:32px;margin-top:8px;align-items:start}
 @media(max-width:900px){.vboard{grid-template-columns:1fr}.teamgrid{grid-template-columns:1fr 1fr}.vhero-stats{grid-template-columns:1fr 1fr}}
 @media(max-width:560px){.teamgrid{grid-template-columns:1fr}}
 .vfilters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
 .vchip{font-family:var(--disp);font-weight:600;font-size:13px;padding:8px 16px;border-radius:50px;cursor:pointer;border:1px solid rgba(11,105,79,.16);background:#fff;color:var(--green);transition:all .2s}
 .vchip:hover{border-color:var(--green)}
 .vchip.on{background:var(--green-deep);color:#fff;border-color:var(--green-deep)}
 .vshift{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:16px;padding:18px 20px;margin-bottom:14px;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;position:relative;overflow:hidden;
  box-shadow:0 14px 32px -26px rgba(7,61,45,.36);transition:box-shadow .2s,transform .2s,border-color .2s}
 .vshift:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c,var(--green))}
 .vshift:hover{transform:translateX(3px);box-shadow:0 22px 44px -26px rgba(7,61,45,.46)}
 .vshift.done{background:linear-gradient(180deg,rgba(54,214,164,.08),rgba(54,214,164,.03));border-color:rgba(54,214,164,.3)}
 .vshift .vwhen{text-align:center;min-width:54px}
 .vshift .vwhen .vd{font-family:var(--disp);font-weight:850;font-size:22px;color:var(--ink);line-height:1}
 .vshift .vwhen .vm{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);font-weight:700;font-family:var(--disp);margin-top:3px}
 .vshift .vmid h4{font-family:var(--disp);font-weight:700;font-size:16.5px;color:var(--ink)}
 .vshift .vmid .vsub{font-size:14px;color:var(--grey);margin-top:3px;display:flex;gap:12px;flex-wrap:wrap}
 .vshift .vmid .vsub span{display:inline-flex;align-items:center;gap:5px}
 .vshift .vspots{display:flex;align-items:center;gap:4px;margin-top:8px}
 .vshift .vspots .pip{width:18px;height:18px;border-radius:50%;border:2px solid color-mix(in srgb,var(--c,var(--green)) 50%,transparent);background:transparent}
 .vshift .vspots .pip.fill{background:var(--c,var(--green));border-color:var(--c,var(--green))}
 .vshift .vspots .vspots-t{font-size:12.5px;color:var(--grey);margin-left:6px;font-weight:600}
 .vsignbtn{font-family:var(--disp);font-weight:700;font-size:14px;color:#fff;background:var(--green-deep);border:0;padding:11px 22px;border-radius:50px;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s,background .2s;box-shadow:0 10px 22px -10px rgba(7,61,45,.5)}
 .vsignbtn:hover{transform:translateY(-2px);background:var(--green);box-shadow:0 16px 30px -12px rgba(7,61,45,.6)}
 .vsignbtn.go{background:var(--mint);color:var(--night)}
 .vshift .vdone-badge{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--mint-deep);background:rgba(54,214,164,.14);border:1px solid rgba(54,214,164,.3);padding:9px 18px;border-radius:50px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
 .vside{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
 .vpanel{background:#fff;border:1px solid rgba(11,105,79,.1);border-radius:20px;padding:24px;box-shadow:0 20px 46px -30px rgba(7,61,45,.4)}
 .vpanel h3{font-family:var(--disp);font-weight:800;font-size:18px;color:var(--ink);margin-bottom:6px;display:flex;align-items:center;gap:9px}
 .vpanel .pmuted{font-size:14px;color:var(--grey);line-height:1.6}
 .vmine{display:flex;flex-direction:column;gap:10px;margin-top:14px}
 .vmine .vm-item{display:flex;align-items:center;gap:12px;padding:12px 14px;background:linear-gradient(180deg,rgba(54,214,164,.08),rgba(54,214,164,.03));border:1px solid rgba(54,214,164,.22);border-radius:12px}
 .vmine .vm-item .vm-ic{width:34px;height:34px;border-radius:10px;background:var(--mint);color:var(--night);display:grid;place-items:center;flex:0 0 auto;font-size:16px}
 .vmine .vm-item .vm-tx b{display:block;font-family:var(--disp);font-weight:700;font-size:14px;color:var(--ink)}
 .vmine .vm-item .vm-tx span{font-size:12.5px;color:var(--grey)}
 .vmine-empty{font-size:14px;color:#9aa9a0;font-style:italic;padding:14px 0}
 .vprog{margin-top:16px}
 .vprog .vbar2{height:12px;background:#E4E8DD;border-radius:50px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(7,61,45,.12)}
 .vprog .vbar2 i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--mint-deep));border-radius:50px;transition:width .6s cubic-bezier(.22,1,.36,1)}
 .vprog .vptx{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-top:8px;font-weight:600}
 .vpoints{text-align:center;padding:8px 0}
 .vpoints .vpnum{font-family:var(--disp);font-weight:850;font-size:46px;color:var(--green);line-height:1}
 .vpoints .vplbl{font-size:13px;color:var(--grey);margin-top:4px}
 .vbadges{display:flex;gap:10px;justify-content:center;margin-top:16px;flex-wrap:wrap}
 .vbadge2{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:20px;background:linear-gradient(155deg,rgba(11,105,79,.14),rgba(11,105,79,.05));border:1px solid rgba(11,105,79,.12);position:relative}
 .vbadge2.locked{opacity:.32;filter:grayscale(1)}
 .vtoast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(20px);z-index:300;background:var(--night);color:#fff;
  padding:16px 24px;border-radius:16px;box-shadow:0 24px 50px -16px rgba(4,35,26,.6);display:flex;align-items:center;gap:14px;opacity:0;
  transition:all .28s cubic-bezier(.22,1,.36,1);pointer-events:none;max-width:90vw}
 .vtoast.show{opacity:1;transform:translateX(-50%) translateY(0)}
 .vtoast .vt-ic{width:38px;height:38px;border-radius:11px;background:var(--mint);color:var(--night);display:grid;place-items:center;font-size:19px;flex:0 0 auto}
 .vtoast b{font-family:var(--disp);font-weight:700;font-size:15px;display:block}
 .vtoast span{font-size:13px;color:#CBE8DA}

 /* ===== vrijwilligers (functioneel) ===== */
 .vsteps{list-style:none;margin-top:14px;display:flex;flex-direction:column;gap:14px}
 .vsteps li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--muted);line-height:1.5}
 .vsteps li b{color:var(--ink)}
 .vstep-n{flex:0 0 auto;width:26px;height:26px;border-radius:50%;background:var(--green-deep);color:#fff;
  font-family:var(--disp);font-weight:800;font-size:13px;display:grid;place-items:center;margin-top:1px}
 .vshift .vnames{display:flex;align-items:center;gap:6px;margin-top:10px;flex-wrap:wrap}
 .vshift .vname-pill{font-family:var(--disp);font-weight:600;font-size:11.5px;color:var(--green-deep);
  background:rgba(11,105,79,.09);border:1px solid rgba(11,105,79,.14);padding:3px 10px;border-radius:50px}
 .vshift .vnames .vnlbl{font-size:12px;color:#9aa9a0}
 .vm-note{font-size:12.5px;color:var(--grey);line-height:1.5;background:rgba(11,105,79,.05);border-radius:11px;padding:11px 14px;margin:4px 0 8px}
 .vm-check{width:64px;height:64px;border-radius:50%;margin:8px auto 18px;display:grid;place-items:center;font-size:32px;color:#fff;
  background:linear-gradient(155deg,var(--mint),var(--mint-deep));box-shadow:0 14px 30px -10px rgba(27,158,118,.6)}
 #vmodal .jbody .frow{margin-bottom:16px}

 /* ===== inline 'vrije plek' tegel in de sponsorbalk ===== */
 /* ===== 'Jouw logo hier?' - één nette knop naast de sponsors ===== */
 .logos .lcell.free{padding:0 0 0 6px}
 .logos .free-inner{position:relative;display:flex;align-items:center;justify-content:center;height:48px;padding:0 22px;
  border:1.5px dashed rgba(11,105,79,.32);border-radius:12px;text-decoration:none;white-space:nowrap;cursor:pointer;
  background:rgba(11,105,79,.02);
  transition:border-color .28s ease,background .28s ease,box-shadow .28s ease,transform .28s cubic-bezier(.34,1.4,.5,1)}
 .logos .free-inner span{font-family:var(--disp);font-weight:600;font-size:13px;letter-spacing:.01em;
  color:rgba(11,105,79,.66);transition:color .28s ease}
 .logos .free-inner .farr{margin-left:8px;color:rgba(11,105,79,.5);transition:transform .28s cubic-bezier(.34,1.4,.5,1),color .28s ease}
 .logos .lcell.free:hover .free-inner{border-color:transparent;background:var(--green);
  box-shadow:0 10px 22px -8px rgba(11,105,79,.55),0 2px 6px rgba(11,105,79,.25);transform:translateY(-3px)}
 .logos .lcell.free:hover .free-inner span{color:#fff}
 .logos .lcell.free:hover .free-inner .farr{color:#fff;transform:translateX(4px)}
 .logos .lcell.free:active .free-inner{transform:translateY(-1px);box-shadow:0 5px 12px -6px rgba(11,105,79,.5)}
 

 /* ===== sponsorpagina: pakketten ===== */
 .pkgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(198px,1fr));gap:16px;margin-top:8px;align-items:stretch}
 @media(max-width:1000px){.pkgrid{grid-template-columns:1fr 1fr}}
 @media(max-width:560px){.pkgrid{grid-template-columns:1fr}}
 .pkg{background:#fff;border:1px solid rgba(11,105,79,.12);border-radius:18px;padding:24px 22px;display:flex;flex-direction:column;position:relative;
  box-shadow:0 20px 46px -30px rgba(7,61,45,.4);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s}
 .pkg:hover{transform:translateY(-6px);box-shadow:0 36px 64px -32px rgba(7,61,45,.5);border-color:color-mix(in srgb,var(--c,var(--green)) 30%,rgba(11,105,79,.12))}
 .pkg.featured{border:2px solid var(--mint-deep);box-shadow:0 30px 66px -30px rgba(27,158,118,.5)}
 .pkg .pk-pop{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--mint);color:var(--night);
  font-family:var(--disp);font-weight:800;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:6px 16px;border-radius:50px;white-space:nowrap;box-shadow:0 8px 20px -6px rgba(27,158,118,.6)}
 .pkg .pk-ico{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;font-size:26px;margin-bottom:16px;
  background:linear-gradient(155deg,color-mix(in srgb,var(--c,var(--green)) 22%,transparent),color-mix(in srgb,var(--c,var(--green)) 7%,transparent));
  color:var(--c,var(--green));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c,var(--green)) 20%,transparent)}
 .pkg h3{font-family:var(--disp);font-weight:800;font-size:20px;color:var(--ink);margin-bottom:4px}
 .pkg .pk-tag{font-size:13px;color:var(--grey);margin-bottom:14px;line-height:1.4;min-height:4.2em}
 .pkg .pk-price{font-family:var(--disp);font-weight:850;font-size:30px;color:var(--ink);line-height:1;margin-bottom:2px}
 .pkg .pk-price small{font-size:14px;font-weight:600;color:var(--grey)}
 .pkg .pk-per{font-size:12.5px;color:#9aa9a0;margin-bottom:16px}
 .pkg .pk-feats{list-style:none;display:flex;flex-direction:column;gap:9px;margin-bottom:18px;flex:1}
 .pkg .pk-feats li{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:#41564b;line-height:1.45}
 .pkg .pk-feats li:before{content:"✓";color:var(--c,var(--green));font-weight:800;flex:0 0 auto;margin-top:1px}
 .pkg .pk-btn{width:100%;justify-content:center}
 .pkg.featured .pk-btn{background:var(--mint);color:var(--night)}

 /* sponsor extra info */
 .spwhy{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
 @media(max-width:760px){.spwhy{grid-template-columns:1fr}.pkgrid{grid-template-columns:1fr}}
 .spwhy .swc{text-align:center;padding:8px}
 .spwhy .swc .si{font-size:32px;margin-bottom:10px}
 .spwhy .swc .si.num{font-family:var(--disp);font-weight:800;font-size:30px;color:var(--c,var(--green));display:inline-block;padding-bottom:8px;border-bottom:2px solid color-mix(in srgb,var(--c,var(--green)) 35%,transparent)}
 .spwhy .swc h4{font-family:var(--disp);font-weight:700;font-size:17px;color:var(--ink);margin-bottom:6px}
 .spwhy .swc p{font-size:14px;color:var(--muted);line-height:1.6}
 /* sponsor interesse-form: hergebruik .cform/.cgrid */
 .spform-wrap{max-width:680px;margin:44px auto 0}

 /* ===== homepage vrijwilligers-teaser ===== */
 .vol .vmodbtn{margin-top:24px;background:var(--mint)!important;color:var(--night)!important;border:0!important;
  font-weight:800;box-shadow:0 16px 34px -12px rgba(54,214,164,.55)!important;align-self:flex-start}
 .vol .vmodbtn:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 22px 42px -14px rgba(54,214,164,.65)!important}
 .vol .vpreview-lbl{font-family:var(--disp);font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(91,240,194,.75);margin-bottom:4px}
 .vol .vrow{cursor:pointer}
 .vol .vrow .vgo{display:inline-flex;align-items:center;gap:7px;font-family:var(--disp);font-weight:700;font-size:14px;
  color:var(--mint-bright);white-space:nowrap;background:rgba(91,240,194,.1);border:1px solid rgba(91,240,194,.26);
  padding:9px 16px;border-radius:50px;transition:background .2s,border-color .2s,transform .2s}
 .vol .vrow:hover .vgo{background:var(--mint);color:var(--night);border-color:var(--mint)}
 .vol .vrow:hover .vgo .arr{transform:translateX(3px)}
 .vol .vrow .vgo .arr{display:inline-block;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
 .vol .vall{margin-top:6px}

 /* ============================================================
   VRIENDENWAND - leuker, speelser, eyecatchend
   ============================================================ */
 /* karakter in het bord: warme houtige groen-gradient + subtiele glow */
 .friends .wall{position:relative;background:
   radial-gradient(120% 80% at 15% 0%,rgba(91,240,194,.14),transparent 55%),
   radial-gradient(100% 90% at 95% 100%,rgba(240,162,59,.1),transparent 55%),
   linear-gradient(160deg,#0e7d5f 0%,#0b694f 45%,#073d2d 100%)!important;
  gap:11px!important;padding:30px!important;border-radius:28px!important;
  box-shadow:0 44px 100px -40px rgba(4,35,26,.75),inset 0 0 0 1px rgba(255,255,255,.07),inset 0 2px 40px rgba(0,0,0,.16)!important;
  overflow:visible!important}

 /* lege plekjes: nodigen uit */
 .friends .spot:not(.taken){border:1.5px dashed rgba(255,255,255,.2)!important;background:rgba(255,255,255,.04)!important;
  color:rgba(255,255,255,.45)!important;transition:transform .2s cubic-bezier(.34,1.56,.64,1),background .2s,border-color .2s,box-shadow .2s,color .2s!important}
 .friends .spot:not(.taken) .plus{transition:transform .28s cubic-bezier(.34,1.56,.64,1)}
 .friends .spot:not(.taken):hover{background:rgba(91,240,194,.16)!important;border-color:rgba(91,240,194,.6)!important;
  color:#fff!important;transform:translateY(-3px) scale(1.06)!important;
  box-shadow:0 16px 30px -12px rgba(0,0,0,.5),0 0 22px rgba(91,240,194,.4)!important}
 .friends .spot:not(.taken):hover .plus{transform:rotate(90deg) scale(1.25)}
 .friends .spot:not(.taken):hover:after{content:"jouw naam?";position:absolute;bottom:-7px;left:50%;transform:translateX(-50%);
  font-family:var(--disp);font-weight:700;font-size:8.5px;letter-spacing:.02em;color:var(--night);background:var(--mint-bright);
  padding:2px 8px;border-radius:50px;white-space:nowrap;box-shadow:0 4px 10px -2px rgba(0,0,0,.4);z-index:5}

 /* ingenomen plaatjes: speels, met lichte rotatie + sport-emoji */
 .friends .spot.taken{position:relative;border-radius:12px!important;font-weight:700!important;
  box-shadow:0 14px 28px -12px rgba(0,0,0,.5),inset 0 0 0 1px rgba(7,61,45,.05)!important;
  transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .28s!important;
  display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:7px 6px!important}
 .friends .spot.taken .femoji{font-size:15px;line-height:1;filter:saturate(1.1)}
 .friends .spot.taken .fname{display:block;line-height:1.12}
 /* lichte speelse rotaties, afwisselend */
 .friends .spot.taken:nth-of-type(7n+1){transform:rotate(-2.5deg)}
 .friends .spot.taken:nth-of-type(7n+3){transform:rotate(2deg)}
 .friends .spot.taken:nth-of-type(7n+5){transform:rotate(-1.5deg)}
 .friends .spot.taken:nth-of-type(7n+6){transform:rotate(1.8deg)}
 .friends .spot.taken:hover{transform:translateY(-6px) rotate(0deg) scale(1.08)!important;z-index:6;
  box-shadow:0 26px 46px -16px rgba(0,0,0,.6),inset 0 0 0 1px rgba(7,61,45,.05)!important}

 /* kleurvarianten - warm & mint door elkaar voor een levendige muur */
 .friends .spot.taken{background:linear-gradient(180deg,#ffffff,#f4f7f3)!important;color:var(--green-deep)!important}
 .friends .spot.taken.dark{background:linear-gradient(160deg,var(--mint-bright),var(--mint))!important;color:var(--green-deep)!important}
 .friends .spot.taken.mid{background:linear-gradient(160deg,#fff3da,#ffe6bd)!important;color:#7a4e12!important}
 .friends .spot.taken.warm{background:linear-gradient(160deg,#ffe0e0,#ffc9c9)!important;color:#8a2f2f!important}
 .friends .spot.taken.sky{background:linear-gradient(160deg,#d8f0ff,#b9e4ff)!important;color:#1c5a7a!important}

 /* teller speelser */
 .friends .fcount{display:inline-flex;align-items:center;gap:16px;background:#fff;border:1px solid rgba(11,105,79,.12);
  padding:12px 22px;border-radius:50px;box-shadow:0 12px 30px -20px rgba(7,61,45,.3);margin-top:26px}
 .friends .fcount #ftext b{font-family:var(--disp);font-weight:850;font-size:24px;color:var(--green);vertical-align:-2px}
 .friends .fcount .bar{width:200px}
 .friends .fcount .bar i{background:linear-gradient(90deg,var(--mint-deep),var(--mint),var(--mint-bright))!important}
 .friends .fcount:after{content:"🎉";font-size:18px}

 /* ===== vriendentribune (stadion) ===== */
 /* SIGNATUUR: stadionlampen die ECHT aanspringen, eenmalig wanneer de
   sectie in beeld scrollt (.lit). Daarna pas de rustige ambient-loop. */

 /* --- 0. RUST: vóór .lit staat alles uit/dim --- */
 .friends #stadsvg .stbeam,
 .friends #stadsvg #st_pools ellipse,
 .friends #stadsvg #st_glow ellipse,
 .friends #stadsvg #st_fieldlight .stfbeam,
 .friends #stadsvg #st_fieldlight .stfdiamond{opacity:0}
 .friends #stadsvg .stbulb{opacity:.32}
 .friends #stadsvg .stcore,
 .friends #stadsvg .sthalo{opacity:0}

 /* --- 1. AANSTEEK-SEQUENTIE (eenmalig, alleen na .lit) --- */
 /* HID/halogeen-warmup: dim -> 2x knipper -> stabiel vol */
 @keyframes st_warm{
  0%{opacity:.32}8%{opacity:.7}12%{opacity:.18}
  20%{opacity:.9}26%{opacity:.3}38%{opacity:1}100%{opacity:1}}
 @keyframes st_corewake{0%,30%{opacity:0}40%{opacity:.5}60%{opacity:0}100%{opacity:1}}
 @keyframes st_halowake{0%,34%{opacity:0}100%{opacity:.85}}
 @keyframes st_beamcast{0%,40%{opacity:0;transform:scaleY(.55)}70%{opacity:.95}100%{opacity:.92;transform:scaleY(1)}}
 @keyframes st_poolcast{0%,46%{opacity:0}100%{opacity:1}}
 @keyframes st_glowcast{0%,50%{opacity:0}100%{opacity:1}}

 /* bulbs warmen op, per mast iets verschoven (stagger via inline delay) */
 .friends #stadsvg.lit .stbulb{animation:st_warm 1.15s ease-out both}
 .friends #stadsvg.lit .stcore{animation:st_corewake 1.4s ease-out both}
 .friends #stadsvg.lit .sthalo{animation:st_halowake 1.5s ease-out both}
 .friends #stadsvg.lit .stbeam{
  transform-origin:top center;transform-box:fill-box;
  animation:st_beamcast 1.7s cubic-bezier(.2,.7,.25,1) both}
 .friends #stadsvg.lit #st_pools ellipse{animation:st_poolcast 1.6s ease-out both}
 .friends #stadsvg.lit #st_glow ellipse{animation:st_glowcast 1.7s ease-out both}

 /* --- 2. AMBIENT: kleur-dans + zachte cadans, start NA de warmup (delay) --- */
 @keyframes st_dans{0%{stop-color:#eafff8}20%{stop-color:#c9f4e0}40%{stop-color:#fbe3bd}60%{stop-color:#bfe9f5}80%{stop-color:#d9efb0}100%{stop-color:#eafff8}}
 @keyframes st_dansmid{0%{stop-color:#7df0cc}20%{stop-color:#2fd3a3}40%{stop-color:#f0a23c}60%{stop-color:#48b6e0}80%{stop-color:#9cd647}100%{stop-color:#7df0cc}}
 @keyframes st_dansdim{0%{stop-color:#2fd3a3}20%{stop-color:#23b88c}40%{stop-color:#c98726}60%{stop-color:#369bc6}80%{stop-color:#7fb834}100%{stop-color:#2fd3a3}}
 .friends #stadsvg.lit .st-d {animation:st_dans 13s ease-in-out 2s infinite}
 .friends #stadsvg.lit .st-dm{animation:st_dansmid 13s ease-in-out 2s infinite}
 .friends #stadsvg.lit .st-dd{animation:st_dansdim 13s ease-in-out 2s infinite}

 /* zachte vlam-cadans, ook pas na warmup; haalt de "verbrande" piek eraf */
 @keyframes st_flikker{0%,100%{opacity:.94}45%{opacity:1}72%{opacity:.9}}
 @keyframes st_halopuls{0%,100%{opacity:.62}50%{opacity:.85}}
 @keyframes st_beampuls{0%,100%{opacity:.8}50%{opacity:.92}}
 @keyframes st_poolpuls{0%,100%{opacity:.86}50%{opacity:1}}
 .friends #stadsvg.lit .stcore{animation:st_corewake 1.4s ease-out both,st_flikker 5s ease-in-out 1.6s infinite}
 .friends #stadsvg.lit .sthalo{animation:st_halowake 1.5s ease-out both,st_halopuls 5s ease-in-out 1.6s infinite}
 .friends #stadsvg.lit .stbeam{animation:st_beamcast 1.7s cubic-bezier(.2,.7,.25,1) both,st_beampuls 5s ease-in-out 1.8s infinite}
 .friends #stadsvg.lit #st_pools ellipse{animation:st_poolcast 1.6s ease-out both,st_poolpuls 5s ease-in-out 1.8s infinite}
 /* veld vangt het licht: cast bij aanspringen, daarna ademen in de beam-cadans */
 @keyframes st_fcast{0%,48%{opacity:0}100%{opacity:1}}
 @keyframes st_fbeampuls{0%,100%{opacity:.72}50%{opacity:1}}
 @keyframes st_fdiapuls{0%,100%{opacity:.6}50%{opacity:.92}}
 .friends #stadsvg.lit #st_fieldlight .stfbeam{animation:st_fcast 1.7s ease-out both,st_fbeampuls 5s ease-in-out 1.8s infinite}
 .friends #stadsvg.lit #st_fieldlight .stfdiamond{animation:st_fcast 1.8s ease-out both,st_fdiapuls 5s ease-in-out 1.9s infinite}

 /* --- zoeklicht: strijkt langs de plekken, fadet rustig in zodra de tribune oplicht --- */
 /* --- zoeklicht: springt soepel van stoel naar stoel; de rest dimt mee --- */
 .friends #stadsvg .stspot{opacity:0}
 .friends #stadsvg #st_search.go .stspot{opacity:1;transition:opacity 1s ease,transform 1.1s cubic-bezier(.6,.05,.25,1)}
 .friends #stadsvg #st_search.go .sl-pool{transition:transform 1.1s cubic-bezier(.6,.05,.25,1),rx 1.1s cubic-bezier(.6,.05,.25,1),ry 1.1s cubic-bezier(.6,.05,.25,1)}
 .friends #stadsvg #st_search.go .sl-dim{transition:opacity 1.4s ease 1s}
 .friends #stadsvg #st_search.go .sl-dim{opacity:0}
 .friends #stadsvg .sl-pool{animation:st_searchpoolpuls 2.6s ease-in-out infinite}
 @keyframes st_searchpoolpuls{0%,100%{opacity:.9}50%{opacity:1}}

 /* --- reduced motion: gewoon vol licht, geen sequentie --- */
 @media (prefers-reduced-motion:reduce){
  .friends #stadsvg .stbeam,.friends #stadsvg #st_pools ellipse,
  .friends #stadsvg #st_glow ellipse,.friends #stadsvg .stcore,
  .friends #stadsvg .sthalo,
  .friends #stadsvg #st_fieldlight .stfbeam,.friends #stadsvg #st_fieldlight .stfdiamond{opacity:1!important;animation:none!important}
  .friends #stadsvg .stbulb{opacity:1!important;animation:none!important}
  .friends #stadsvg .st-d,.friends #stadsvg .st-dm,.friends #stadsvg .st-dd{animation:none!important}
  .friends #stadsvg .stspot{opacity:.7!important;transform:rotate(0deg)}
  .friends #stadsvg .sl-pool{animation:none!important}
  .friends #stadsvg .sl-dim{opacity:0!important}}

 /* 3D-podium: perspectief-laag rond het stadion */
 .friends .stadstage{margin:22px auto 0;max-width:1120px}
 @media(min-width:1300px){.friends>.wrap{max-width:1330px}.friends .stadstage{max-width:1264px}}
 .friends .stadwrap{position:relative;margin:0 auto;border-radius:24px;overflow:hidden;
  transition:box-shadow .5s,transform .8s cubic-bezier(.22,1,.36,1),opacity .8s ease;
  box-shadow:0 44px 100px -42px rgba(4,35,26,.72),inset 0 0 0 1px rgba(255,255,255,.06)}
 /* zachte float-in zodra de sectie aangaat (geen 3D-kanteling meer) */
 .friends .stadstage:not(.lit) .stadwrap{opacity:.001;transform:translateY(24px)}
 .friends .stadstage.lit .stadwrap{opacity:1;transform:none}
 @media (prefers-reduced-motion:reduce){
  .friends .stadstage:not(.lit) .stadwrap{opacity:.001;transform:none}
  .friends .stadstage.lit .stadwrap{opacity:1}
 }
 .friends .stadsvg{display:block;width:100%;height:auto}
 .friends .stadsw{position:absolute;top:22px;right:22px;z-index:3;display:inline-flex;
  background:rgba(8,42,32,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.30);border-radius:50px;padding:5px;box-shadow:0 12px 30px -14px rgba(0,0,0,.6)}
 .friends .stadsw button{background:transparent;border:0;color:rgba(216,240,230,.82);cursor:pointer;
  font-family:var(--disp);font-weight:700;font-size:16px;padding:12px 25px;border-radius:50px;
  display:flex;align-items:center;gap:6px;transition:background .2s,color .2s}
 .friends .stadsw button.on{background:var(--mint);color:var(--green-deep);box-shadow:0 5px 16px -5px rgba(43,197,151,.7),inset 0 0 0 1px rgba(255,255,255,.30)}
  .friends .stadsw button:not(.on):hover{background:rgba(255,255,255,.09);color:#fff}
 .friends .stseat{cursor:default;transition:transform .2s}
 .friends .stseat.free{cursor:pointer}
 .friends .stseat.free rect,.friends .stseat.free path{transition:fill .2s ease}
 .friends .stseat .seathint{animation:seathintIn .18s ease both;pointer-events:none}
 @keyframes seathintIn{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
 @media (prefers-reduced-motion:reduce){.friends .stseat .seathint{animation:none}}
 /* ===== nieuwe-vriend viering (goal celebration) ===== */
 .friends #stadsvg .st-celebrate{animation:st_celebrate 2.4s ease-out forwards;transform-origin:center;transform-box:fill-box;pointer-events:none}
 @keyframes st_celebrate{0%{opacity:0;transform:scale(.4)}14%{opacity:1;transform:scale(1.06)}26%{transform:scale(1)}74%{opacity:1}100%{opacity:0;transform:scale(1)}}
 .friends #stadsvg .st-seatpop{animation:st_seatpop .7s cubic-bezier(.2,.9,.3,1.5);transform-origin:center bottom;transform-box:fill-box}
 @keyframes st_seatpop{0%{transform:translateY(0) scale(1)}35%{transform:translateY(-7px) scale(1.16)}100%{transform:translateY(0) scale(1)}}
 .friends #stadsvg #st_scoreboard.st-cheer{animation:st_boardbounce .7s cubic-bezier(.2,.8,.3,1.4)}
 @keyframes st_boardbounce{0%{transform:translateY(0)}30%{transform:translateY(-6px)}55%{transform:translateY(2px)}100%{transform:translateY(0)}}
 .friends #stadsvg #st_sbglow{opacity:0}
 .friends #stadsvg #st_sbglow.on{animation:st_sbglow 2.2s ease-out}
 @keyframes st_sbglow{0%{opacity:0}18%{opacity:.85}100%{opacity:0}}
 @media (prefers-reduced-motion:reduce){.friends #stadsvg .st-celebrate,.friends #stadsvg .st-seatpop,.friends #stadsvg #st_scoreboard.st-cheer,.friends #stadsvg #st_sbglow.on{animation:none!important}}
 .friends .stadtip{position:relative;text-align:center;color:#04231A;font-weight:700;font-size:14px;
  margin:-44px auto 0;max-width:920px;pointer-events:none;z-index:3}
 @media(max-width:760px){
  .friends .stadsw button{font-size:12px;padding:7px 12px}
  .friends .stadtip{position:static;margin:12px 4px 0;color:var(--grey);font-size:12px;line-height:1.4;font-weight:550}
  /* mobiel: stadion op werkbare grootte + zijwaarts scrollen i.p.v. platdrukken */
  .friends .stadwrap{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
   border-radius:18px;scroll-snap-type:x proximity;
   scrollbar-width:none;-ms-overflow-style:none}
  .friends .stadwrap::-webkit-scrollbar{display:none}
  .friends .stadsvg{width:760px;max-width:none;min-width:760px;scroll-snap-align:center}
  /* swipe-hint: subtiele veeg-aanwijzing die verdwijnt zodra je scrollt */
  .friends .stadwrap .swipehint{position:absolute;top:50%;right:10px;transform:translateY(-50%);
   z-index:4;display:flex;align-items:center;gap:6px;pointer-events:none;
   background:rgba(8,42,32,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
   border:1px solid rgba(91,240,194,.3);border-radius:50px;padding:7px 13px;
   color:#bff0dc;font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.02em;
   box-shadow:0 8px 24px -8px rgba(0,0,0,.6);animation:swipenudge 1.8s ease-in-out infinite}
  .friends .stadwrap.scrolled .swipehint{opacity:0;transition:opacity .28s ease}
  @keyframes swipenudge{0%,100%{transform:translateY(-50%) translateX(0)}50%{transform:translateY(-50%) translateX(-5px)}}
  @media (prefers-reduced-motion:reduce){.friends .stadwrap .swipehint{animation:none}}
 }
 @media(min-width:761px){.friends .stadwrap .swipehint{display:none}}

 /* sterren: heel zachte twinkel */
 .friends #stadsvg:not(.playing) .ststar,.friends #stadsvg:not(.playing) .stdust,.friends #stadsvg:not(.playing) .st-d,.friends #stadsvg:not(.playing) .st-dm,.friends #stadsvg:not(.playing) .st-dd,.friends #stadsvg:not(.playing) .stcore,.friends #stadsvg:not(.playing) .sthalo,.friends #stadsvg:not(.playing) .stbeam,.friends #stadsvg:not(.playing) #st_pools ellipse,.friends #stadsvg:not(.playing) #st_glow ellipse,.friends #stadsvg:not(.playing) #st_fieldlight .stfbeam,.friends #stadsvg:not(.playing) #st_fieldlight .stfdiamond,.friends #stadsvg:not(.playing) .sl-pool{animation-play-state:paused!important}
  .friends #stadsvg .ststar{animation:st_twinkle 4.5s ease-in-out infinite}
 @keyframes st_twinkle{0%,100%{opacity:.18}50%{opacity:.6}}
 .friends #stadsvg:not(.lit) .ststar{opacity:0}
 /* volumetrisch stof in de lichtbundels */
 .friends #stadsvg .stdust{animation:st_dustfloat 7s ease-in-out infinite;mix-blend-mode:screen}
 @keyframes st_dustfloat{0%,100%{opacity:.0;transform:translateY(0)}50%{opacity:.5;transform:translateY(-6px)}}
 .friends #stadsvg:not(.lit) .stdust{opacity:0}
 @media (prefers-reduced-motion:reduce){.friends #stadsvg .ststar,.friends #stadsvg .stdust{animation:none}}
 /* confetti */
 .confetti-pc{position:fixed;width:10px;height:14px;z-index:400;pointer-events:none;will-change:transform,opacity;border-radius:2px}

 @keyframes wobblein{0%{transform:scale(0) rotate(-12deg);opacity:0}60%{transform:scale(1.15) rotate(4deg)}100%{transform:scale(1) rotate(0);opacity:1}}
 .friends .spot.justadded{animation:wobblein .55s cubic-bezier(.34,1.56,.64,1)!important}


/* === extra aanbod: lichte hero-variant === */
.phero.phero-light{background:radial-gradient(120% 100% at 15% 0%,#EAF6F0 0%,#F2EEE2 58%,var(--paper) 100%);color:var(--ink)}
.phero.phero-light .ph{opacity:0}
.phero.phero-light .crumbs{color:var(--muted)}
.phero.phero-light .crumbs a{color:var(--green)}
.phero.phero-light .ptag{color:var(--green);background:rgba(11,105,79,.09)}
.phero.phero-light h1{color:var(--ink)}
.phero.phero-light .sc{color:var(--green)}
.phero.phero-light .sub{color:#3E4E45}
.phero.phero-light .btn-out{background:#fff;color:var(--green);border-color:rgba(11,105,79,.3);box-shadow:0 8px 22px -12px rgba(4,36,27,.22)}
/* === Ook bij Roef! strook (homepage) === */
.ookbij{margin-top:54px}
.ob-head{text-align:center;max-width:640px;margin:0 auto 26px}
.ob-lbl{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
.ob-h{font-family:var(--disp);font-weight:850;font-size:clamp(24px,3.4vw,34px);color:var(--ink);letter-spacing:-.02em}
.ob-sub{color:var(--muted);font-size:16px;margin-top:8px}
.ob-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ob-card{display:flex;align-items:center;gap:16px;text-decoration:none;cursor:pointer;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--c);border-radius:var(--r-md);padding:20px 22px;box-shadow:0 14px 30px -22px rgba(4,36,27,.4);transition:transform .2s ease,box-shadow .2s ease}
.ob-card:hover{transform:translateY(-4px);box-shadow:0 22px 46px -24px rgba(4,36,27,.5)}
.ob-ic{font-size:34px;line-height:1;flex:0 0 auto}
.ob-card h3{font-family:var(--disp);font-weight:800;font-size:19px;color:var(--ink)}
.ob-card p{color:var(--muted);font-size:14px;margin-top:3px}
.ob-go{margin-left:auto;font-family:var(--disp);font-weight:700;font-size:14px;color:var(--c);white-space:nowrap;align-self:center}
@media(max-width:680px){.ob-grid{grid-template-columns:1fr}}
/* === ledenbar: twee rijen === */
.lb-sub{display:block;font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mint);margin:6px 2px 12px}
.lb-sub.two{margin-top:22px}
.ledenbar .lb-grid.lb-4{grid-template-columns:repeat(4,1fr)}
.lb-sport{border-left:3px solid var(--c,var(--mint))}
@media(max-width:980px){.ledenbar .lb-grid.lb-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.ledenbar .lb-grid.lb-4{grid-template-columns:1fr}}
/* === navdrop subkopje === */
.ddmenu .dd-sub{display:block;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--green);opacity:.8;padding:10px 14px 4px;margin-top:4px;border-top:1px solid rgba(11,105,79,.16)}
 .ddmenu a.dd-minor{padding:5px 14px;font-weight:500;font-size:12px;color:var(--muted)}
 .ddmenu a.dd-minor span small{font-size:9.5px;opacity:.8}
 .ddmenu a.dd-minor:hover{background:rgba(11,105,79,.055)}
 .ddmenu a.dd-minor:hover span{color:var(--green)!important}

/* === leesbare documentpagina's (privacy, gedragscode) === */
.doc-prose{max-width:770px}
.doc-prose h3{font-family:var(--disp);font-weight:800;font-size:20px;color:var(--ink);margin:28px 0 8px}
.doc-prose h3:first-child{margin-top:0}
.doc-prose p{color:var(--muted);font-size:16px;line-height:1.72;margin-bottom:12px}
.doc-prose ul{margin:8px 0 16px;padding:0;list-style:none}
.doc-prose li{position:relative;padding-left:28px;color:var(--muted);font-size:15.5px;line-height:1.62;margin-bottom:10px}
.doc-prose li::before{content:"";position:absolute;left:3px;top:9px;width:8px;height:8px;border-radius:50%;background:var(--c,var(--green))}
.doc-prose ol.rules{counter-reset:r;margin:10px 0 6px;padding:0;list-style:none}
.doc-prose ol.rules li{counter-increment:r;padding:14px 16px 14px 54px;background:var(--card);border:1px solid var(--line);border-left:3px solid var(--c,var(--green));border-radius:var(--r-sm);margin-bottom:10px;color:var(--ink);font-size:15px;line-height:1.55}
.doc-prose ol.rules li::before{content:counter(r);position:absolute;left:14px;top:12px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:var(--c,var(--green));color:#fff;font-family:var(--disp);font-weight:800;font-size:13px;border-radius:50%}
.doc-prose .upd{margin-top:26px;font-size:14px;color:var(--grey)}
.doc-cta{margin-top:22px}

/* === beeld-hero (extra aanbod met eigen banner) === */
.imghero{background:linear-gradient(180deg,#EAF6F0,var(--paper));padding:24px 0 40px}
.imghero .crumbs{font-family:var(--disp);font-size:13px;letter-spacing:.04em;color:var(--muted);margin-bottom:16px}
.imghero .crumbs a{color:var(--green);cursor:pointer}
.imghero-img{width:100%;height:auto;display:block;border-radius:24px;box-shadow:0 30px 64px -34px rgba(7,61,45,.4)}
.imghero .pbtns{margin-top:24px;justify-content:center}
.imghero .btn-out{background:#fff;color:var(--green);border-color:rgba(11,105,79,.3);box-shadow:0 8px 22px -12px rgba(4,36,27,.2)}

/* === hero een tintje lichter: meer foto + leesbaarheids-scrim === */
.phero:not(.phero-light)::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(105deg,rgba(4,33,24,.58) 0%,rgba(4,33,24,.30) 52%,rgba(4,33,24,.08) 100%)}
.phero:not(.phero-light) .wrap{position:relative;z-index:2}
.phero:not(.phero-light) h1{text-shadow:0 2px 12px rgba(2,20,14,.6),0 16px 44px rgba(2,20,14,.4)}
.phero:not(.phero-light) .sub{color:#EDF7F2;text-shadow:0 1px 12px rgba(2,20,14,.7),0 2px 4px rgba(2,20,14,.32)}
.phero:not(.phero-light) .crumbs{color:rgba(226,241,234,.84);text-shadow:0 1px 8px rgba(2,20,14,.6)}
#phbg-golf{background-image:url('img/img16.svg')}

.callegend{display:flex;gap:18px;flex-wrap:wrap;margin:14px 0 0;align-items:center}
.callegend .lg{display:inline-flex;align-items:center;gap:7px;font-family:var(--disp);font-weight:600;font-size:14px;color:var(--muted)}
.callegend .lg i{width:13px;height:13px;border-radius:4px;display:inline-block}
/* agenda een kleurtje: zacht creme/mint-frame ipv fel wit */
.calwrap{background:linear-gradient(180deg,#E7F1EC,#F4F1E7);padding:12px;border-radius:24px;border:1px solid rgba(11,105,79,.14);box-shadow:0 18px 42px -30px rgba(7,61,45,.45)}
.calwrap iframe{border-radius:12px;background:#F4F1E7}

/* === contributie-tarievenblok === */
.contribcard{max-width:480px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:0 18px 38px -26px rgba(4,36,27,.4);margin-top:6px}
.contribcard .crow{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:13px 22px;font-size:16px;border-top:1px solid var(--line)}
.contribcard .crow:first-child{border-top:0}
.contribcard .crow:nth-child(even){background:rgba(11,105,79,.035)}
.contribcard .crow span{color:var(--muted)}
.contribcard .crow b{font-family:var(--disp);color:var(--c);font-size:18px;white-space:nowrap}
.cnote{color:var(--muted);font-size:14px;margin-top:14px;max-width:64ch}

/* === Shop = pill; Sporten = plain zoals de andere links === */
.navdrop.shopdrop{margin-left:8px}
.menu .navdrop.shopdrop>button{background:none;border:1px solid rgba(255,255,255,.28);border-radius:50px;padding:8px 14px;color:#DCF2E6;gap:8px}
.menu .navdrop.shopdrop.open>button,.menu .navdrop.shopdrop>button:hover{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.1)}
.navdrop.shopdrop .ddmenu{left:auto;right:0;transform:translateX(0) translateY(-6px)}
.navdrop.shopdrop.open .ddmenu{opacity:1;visibility:visible;transform:translateX(0) translateY(0)}
/* === menu strakker === */
nav.menu{gap:2px}
nav.menu a{font-size:14.5px;padding:8px 12px}
.menu .navdrop>button{font-size:14.5px;padding:8px 12px}
nav.menu .joinbtn{margin-left:8px;padding:10px 18px}
nav.menu .shopbtn{padding:8px 14px;font-size:14.5px}
/* nav-dropdown-knoppen exact zelfde font als de links */
.menu .navdrop>button{font-family:var(--disp);line-height:1.6}

/* === premium-pass sportpagina's === */
.phero-page .phero{padding:88px 0 70px}
@keyframes pIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.phero-page.is-active .phero .wrap>*{animation:pIn .6s cubic-bezier(.2,.7,.3,1) both}
.phero-page.is-active .phero .crumbs{animation-delay:.03s}
.phero-page.is-active .phero .ptag{animation-delay:.10s}
.phero-page.is-active .phero h1{animation-delay:.17s}
.phero-page.is-active .phero .sub{animation-delay:.25s}
.phero-page.is-active .phero .pbtns{animation-delay:.33s}
.lead2{max-width:52ch}
.schedule .srow:not(.head):nth-child(even){background:rgba(11,105,79,.028)}
.schedule .srow:not(.head){transition:background .2s}
.schedule .srow:not(.head):hover{background:rgba(11,105,79,.06)}
.icard .ico.num{font-size:19px;opacity:.62;padding-bottom:6px}
.pkcard{transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s,border-color .28s}
.pkcard:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--c,var(--green)) 26%,rgba(11,105,79,.1));box-shadow:0 26px 50px -30px rgba(7,61,45,.45)}
@media(prefers-reduced-motion:reduce){.phero-page.is-active .phero .wrap>*{animation:none}.reveal{opacity:1 !important;transform:none !important}}

/* sponsors: twee groepen, direct op de achtergrond (geen box) */
.sponsgroup{text-align:center;margin-bottom:34px}
.sponsgroup:last-child{margin-bottom:0}
.sponsgroup .lbl{margin-bottom:20px}
.sponsplaceholder{color:var(--grey);font-family:var(--disp);font-weight:600;font-size:14px}

/* sponsorpagina premium: accentbalk + 3/2-indeling + featured === */
.pkg{overflow:hidden;padding-top:28px}
.pkg::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--c,var(--green))}
.pkg.featured{background:linear-gradient(180deg,#F1FAF6,#ffffff)}
.pk-badge{position:absolute;top:12px;right:12px;background:var(--c,var(--green));color:#fff;font-family:var(--disp);font-weight:700;font-size:10px;letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;border-radius:99px}
.pkgrid.pkgrid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pkgrid.pkgrid-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:700px}
.sponsdivider{height:1px;background:linear-gradient(90deg,transparent,rgba(11,105,79,.16),transparent);margin:54px 0 34px}
@media(max-width:860px){.pkgrid.pkgrid-3{grid-template-columns:1fr}.pkgrid.pkgrid-2{grid-template-columns:1fr}}

/* onderschrift tribune leesbaarder */
.friends .stadtip{color:var(--green-deep);font-weight:700;font-size:15px !important;background:none;box-shadow:none;padding:0;margin:26px auto 0;width:auto;max-width:none;letter-spacing:0;text-shadow:none;position:static}
.friends .stdemo{text-align:center;color:var(--grey);font-size:11.5px;margin:6px auto 0;opacity:.72;letter-spacing:.02em}


/* ===== Mobiele vriendenwand (toegevoegd) ===== */
 .alleen-shirt{display:none}
 @media(max-width:700px){.alleen-tribune{display:none}.alleen-shirt{display:inline}}
 .fwall-mobile{display:none}
 .fwm-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
 .fwm-count{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--green-deep);white-space:nowrap}
 .fwm-count b{font-size:22px;color:var(--green)}
 .fwm-bar{flex:1;height:10px;background:#D9D6C7;border-radius:99px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(4,36,27,.12)}
 .fwm-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--mint-deep),var(--mint),var(--mint-bright));border-radius:99px;transition:width .6s cubic-bezier(.3,.8,.3,1)}
 /* het vriendenbord = 1 groot ROEF-shirt met naam-vakjes erin */
 .fwm-board{position:relative;filter:drop-shadow(0 24px 34px rgba(7,61,45,.26))}
 .fwm-shirt{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
 .fwm-inner{position:relative;z-index:1;padding:21% 16% 12.5%}
 .fwm-chest{text-align:center;margin-bottom:14px}
 .fwm-chest .cr{display:block;font-family:var(--hand);font-weight:700;font-size:27px;line-height:1;color:#eafff4;transform:rotate(-2.5deg);text-shadow:0 1px 3px rgba(3,32,23,.32)}
 .fwm-chest .cl{display:block;font-family:var(--disp);font-weight:600;font-size:10px;letter-spacing:4.5px;color:rgba(255,255,255,.68);margin-top:5px;padding-left:5px}
 .fwm-cells{position:relative;overflow:hidden;max-height:176px}
 .fwm-cells.scrolling{-webkit-mask-image:linear-gradient(180deg,#000 78%,transparent);mask-image:linear-gradient(180deg,#000 78%,transparent)}
 .fwm-track{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
 .fwm-cells.scrolling .fwm-track{animation:fwmScroll var(--fwd,26s) linear infinite}
 .fwm-cells.scrolling:hover .fwm-track,.fwm-cells.scrolling:active .fwm-track{animation-play-state:paused}
 @keyframes fwmScroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
 @media(prefers-reduced-motion:reduce){.fwm-cells.scrolling .fwm-track{animation:none}}
 .fwm-cell{background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.55);border-radius:7px;padding:8px 4px;text-align:center;font-family:var(--disp);font-weight:600;font-size:10.5px;color:var(--green-deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 3px 7px rgba(3,40,28,.18),inset 0 1px 0 rgba(255,255,255,.85)}
 .fwm-cell.free{background:rgba(255,255,255,.13);border:1.4px dashed rgba(255,255,255,.72);color:#fff;box-shadow:none;cursor:pointer;transition:background .2s}
 .fwm-cell.free:active{background:rgba(255,255,255,.24)}
 .fwm-cell.free b{color:#fff;margin-right:3px;font-size:13px;font-weight:700}
 .fwm-cta{margin-top:18px;width:100%;justify-content:center}
 @media(max-width:700px){
  .friends .stadstage,.friends .stadtip{display:none}
  .fwall-mobile{display:block;margin-top:20px}
  .joinbar .jb-cta{display:none}
 }
 .sponsors-bord-mobile{display:none}
 @media(max-width:700px){.sponsors-bord-mobile{display:block}}
 .ledcard{position:relative;max-width:340px;height:132px;margin:0 auto;border-radius:12px;background:#0b241b;box-shadow:0 14px 30px -12px rgba(0,0,0,.5);padding:7px}
 .ledcard .ledface{position:relative;width:100%;height:100%;border-radius:7px;overflow:hidden;background:linear-gradient(180deg,#ffffff,#f2f6f3 55%,#e3eae5)}
 .ledcard .ledimg{position:absolute;left:16px;right:16px;top:12px;bottom:10px;width:calc(100% - 32px);height:calc(100% - 22px);object-fit:contain;opacity:0;transition:opacity .42s ease}
 .ledcard .ledimg.on{opacity:1}
 .ledcard .ledsheen{position:absolute;inset:0 0 auto 0;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,0));pointer-events:none}
 .ledcard .ledsparkle{position:absolute;top:0;bottom:0;width:34%;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.5) 48%,rgba(255,255,255,.85) 50%,rgba(255,255,255,.5) 52%,transparent 70%);transform:translateX(-160%);animation:ledsparkle 6s ease-in-out infinite;pointer-events:none}
 @keyframes ledsparkle{0%,68%{transform:translateX(-160%)}86%,100%{transform:translateX(160%)}}
 @media(prefers-reduced-motion:reduce){.ledcard .ledsparkle{animation:none;display:none}}
 .ledcard .leddot{position:absolute;width:4px;height:4px;border-radius:50%;background:#5bf0c2;opacity:.7;bottom:7px;z-index:2}
 .ledcard .leddot.l{left:9px}
 .ledcard .leddot.r{right:9px}
 /* ===== MOBIEL: hero als gestapelde banden i.p.v. smalle kolommen (toegevoegd) ===== */
@media(max-width:700px){
 .hero{padding:0 0 40px}
 .hero .hcollage{height:300px;bottom:auto;overflow:hidden}
.hc-hand{left:0;right:0;top:0;bottom:auto;width:auto;height:174px;
  clip-path:polygon(0 0,100% 0,100% 84%,0 100%);background-position:50% 26% !important}
.hc-hsb{left:0;right:0;top:150px;bottom:auto;width:auto;height:174px;
  clip-path:polygon(0 16%,100% 0,100% 100%,0 100%);background-image:url('img/img02.webp');background-position:50% 48%}
 .hero .hoverlay{height:306px;bottom:auto;background:linear-gradient(180deg,rgba(2,20,14,.25),rgba(2,20,14,0) 40%,rgba(4,35,26,.5) 70%,var(--night) 89%,var(--night) 100%)}
 .hero .hglow{display:none}
 .hero .inner{margin-top:300px;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border:0!important;box-shadow:none!important;padding:20px 22px 0!important;max-width:none}
 .tiles{margin-top:18px}
 .tile{min-height:195px}
}
/* ===== MOBIEL: tikdoelen & leesbaarheid (toegevoegd) ===== */
@media(max-width:760px){
 /* tikdoelen minimaal ~44px hoog */
 .vall{min-height:44px;display:inline-flex;align-items:center}
 .friends .stadsw button{min-height:42px;padding:11px 15px}
 .afilter,.vchip{min-height:40px}
 .agadd{min-height:40px;display:inline-flex;align-items:center}
 .jhead .x,.modal .box .cancel{min-height:40px;min-width:40px}
 .lx-acts a.lx-route,.lx-acts a.lx-map-link{min-height:44px;display:inline-flex;align-items:center}
 footer .fgrid a{min-height:44px;display:flex;align-items:center;padding:4px 0}
 footer .fbond a{min-height:44px;display:inline-flex;align-items:center}
 footer p a{display:inline-block;padding:9px 0}
 a[href^="tel:"],a[href^="mailto:"]{display:inline-block!important;padding:10px 0!important;min-height:40px}
  /* hero-kaart compacter op telefoon */
 .hero .inner{padding:26px 24px 28px}
 /* mini-labels iets leesbaarder op telefoon */
 .lx-tag{font-size:11.5px}
 .ncard .tag{font-size:12px}
 .lp-eyebrow{font-size:12px}
 .fdate,.vpreview-lbl{font-size:12px}
 .ftip,.stadtip{font-size:12.5px}
}

/* === sponsors: shirt-band (marquee) === */
.sponsors{padding:60px 0 44px;text-align:center;overflow:hidden}
.sponsors .spons-lbl{margin-bottom:22px}
.marquee{position:relative;overflow:hidden;padding:6px 0;width:100vw;max-width:1600px;margin-left:50%;transform:translateX(-50%)}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:48px;z-index:2;pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,var(--paper),rgba(244,242,233,0))}
.marquee::after{right:0;background:linear-gradient(270deg,var(--paper),rgba(244,242,233,0))}
.mtrack{display:flex;align-items:center;width:max-content;animation:mscroll 24s linear infinite;will-change:transform;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}
@media(min-width:860px){.mtrack{animation-duration:14s}}
.marquee:hover .mtrack{animation-play-state:paused}
.mtrack .spcell{display:flex;align-items:center;justify-content:center;flex:0 0 auto;padding:0 28px;height:72px}
.mtrack .spcell img{height:41px;width:auto;display:block;transition:transform .28s ease}
.mtrack .spcell img[alt="Pick-up Kip"]{height:67px}
.mtrack .spcell img[alt="Dametje van Daelen"]{height:90px}
.mtrack .spcell:has(img[alt="Dametje van Daelen"]){height:90px}
.mtrack .spcell img[alt="ROOT"]{height:65px}
.mtrack .spcell img[alt="Van de Ven"]{height:65px}
.mtrack .spcell:hover img{transform:translateY(-3px)}
@keyframes mscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.sponsors.sponsors-slot{padding:46px 0 78px;margin-bottom:72px}
.sponsors-slot .spons-lbl{margin-bottom:18px;color:var(--green-deep)}
.mtrack .spcell.spcta{text-decoration:none;padding:0 22px}
.spcta-in{display:flex;flex-direction:column;justify-content:center;gap:3px;height:56px;padding:0 24px;border:1.5px dashed rgba(11,105,79,.32);border-radius:14px;background:rgba(11,105,79,.05);box-shadow:0 10px 24px -18px rgba(7,61,45,.3);transition:border-color .2s ease,box-shadow .28s cubic-bezier(.2,.8,.3,1),transform .28s cubic-bezier(.2,.8,.3,1)}
.spcta-in b{font-family:var(--disp);font-weight:700;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--green-deep);opacity:.72;line-height:1.1;white-space:nowrap}
.spcta-go{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--green);display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.spcta-go .arr{display:inline-block;transition:transform .2s cubic-bezier(.34,1.4,.5,1)}
.spcta:hover .spcta-in{border-color:rgba(27,158,118,.55);box-shadow:0 18px 34px -20px rgba(7,61,45,.55);transform:translateY(-3px)}
.spcta:hover .spcta-go .arr{transform:translateX(4px)}
@media(max-width:640px){.spcta-in{height:50px;padding:0 18px}.spcta-in b{font-size:9.5px;letter-spacing:.14em}.spcta-go{font-size:12.5px}}
@media(max-width:760px){.sponsors.sponsors-slot{padding:34px 0 58px}}
nav.menu a.navbal{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:11px;height:11px;padding:0;margin-left:10px;opacity:.3;transition:transform .3s cubic-bezier(.2,.9,.3,1),opacity .25s}
nav.menu a.navbal svg{width:100%;height:100%;display:block}
nav.menu a.navbal:hover,nav.menu a.navbal:focus-visible{opacity:1;transform:rotate(-20deg) scale(1.9)}
@media(max-width:1020px){nav.menu a.navbal{display:none}}
.tier-cta{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-family:var(--disp);font-weight:700;font-size:14px;color:var(--green);text-decoration:none}
.tier-cta .farr{transition:transform .28s cubic-bezier(.34,1.4,.5,1)}
.tier-cta:hover .farr{transform:translateX(5px)}
@media (prefers-reduced-motion:reduce){.mtrack{animation:none;flex-wrap:wrap;justify-content:center;width:auto;gap:8px 12px}.marquee{overflow-x:auto}}
@media(max-width:640px){.mtrack .spcell{padding:0 19px}.mtrack .spcell img{height:37px}.mtrack .spcell img[alt="Pick-up Kip"]{height:48px}.mtrack .spcell img[alt="Dametje van Daelen"]{height:98px}.mtrack .spcell:has(img[alt="Dametje van Daelen"]){height:98px}.mtrack .spcell img[alt="ROOT"]{height:47px}.mtrack .spcell img[alt="Van de Ven"]{height:47px}}

.ledenbar .lb-grid.lb-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:680px){.ledenbar .lb-grid.lb-3{grid-template-columns:1fr}}

/* === rijkere sporttegels === */

.pkgrid.pkgrid-1{grid-template-columns:minmax(0,400px);justify-content:center;max-width:none}

/* footer social: platformkleuren */
.fsocial a.s-fb svg{color:#5a9bff}
.fsocial a.s-ig svg{color:#f472b6}
.fsocial a.s-wa svg{color:#3ddc84}
.fsocial a.s-mail svg{color:var(--mint)}
.fsocial a.s-fb:hover{background:#1877F2;border-color:#1877F2;color:#fff;box-shadow:0 10px 22px -8px rgba(24,119,242,.6)}
.fsocial a.s-ig:hover{background:linear-gradient(45deg,#f09433,#dc2743,#bc1888);border-color:transparent;color:#fff;box-shadow:0 10px 22px -8px rgba(220,39,67,.55)}
.fsocial a.s-wa:hover{background:#25D366;border-color:#25D366;color:#04321f;box-shadow:0 10px 22px -8px rgba(37,211,102,.55)}
.fsocial a.s-fb:hover svg,.fsocial a.s-ig:hover svg{color:#fff}
.fsocial a.s-wa:hover svg{color:#04321f}
.fsocial a.s-mail:hover{background:var(--mint);border-color:var(--mint);box-shadow:0 10px 22px -8px rgba(54,214,164,.6)}
.fsocial a.s-mail:hover svg{color:#04342c}


@media(max-width:760px){.fgrid>div:first-child{grid-column:1 / -1;margin-bottom:8px}}

/* team-fotoband (HSB) */
.teamband{margin:28px 0 0}
.teamband .tb-img{border-radius:20px;overflow:hidden;box-shadow:0 30px 60px -32px rgba(4,36,27,.5);background:#0b3b2c}
.teamband img{width:100%;height:auto;display:block}
.teamband figcaption{font-family:var(--sans);font-size:12.5px;color:var(--muted);margin-top:11px;text-align:center;letter-spacing:.01em}

/* trainingsschema-tabel (HSB) */
.tsched-wrap{overflow-x:auto;margin-top:22px;border:1px solid rgba(11,105,79,.14);border-radius:14px;-webkit-overflow-scrolling:touch}
.tsched{border-collapse:collapse;width:100%;min-width:760px;font-family:var(--sans);font-size:13px}
.tsched th{background:var(--green-deep);color:#eafff4;font-family:var(--disp);font-weight:700;font-size:12px;padding:11px 13px;text-align:left;white-space:nowrap;letter-spacing:.02em}
.tsched td{padding:9px 13px;border-top:1px solid rgba(11,105,79,.10);color:var(--ink);white-space:nowrap}
.tsched td:nth-child(-n+2){color:var(--muted);font-variant-numeric:tabular-nums;width:52px}
.tsched td.fill{color:var(--green-deep);font-weight:600}
.tsched tr.day td{background:var(--green);color:#fff;font-family:var(--disp);font-weight:700;font-size:13px;text-align:left;letter-spacing:.04em;padding:8px 14px}
.tsched tbody tr:not(.day):hover{background:rgba(43,197,151,.09)}
.tsched tr.day .dname{position:sticky;left:14px;display:inline-block}

/* === facebook-feed als rustige zijkolom in de sportsectie === */
.socpsec{padding:clamp(30px,4.2vh,58px) 0 clamp(34px,4.6vh,62px)}
.socpsec .cards3{margin-top:clamp(22px,2.8vh,32px);gap:18px}
.socpsec .icard{padding:22px 22px 24px}
.socpsec .icard h3{font-size:19px;margin-bottom:6px}
.socpsec .icard .ico.num{font-size:17px;margin-bottom:9px;padding-bottom:5px}
.socpsec .icard p{font-size:15px;line-height:1.6;margin-top:5px}
.socpsec .lead2+.lead2{margin-top:clamp(9px,1.2vh,14px) !important}
.socsplit{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(26px,2.6vw,40px);align-items:start}
.socsplit .socmain .lead2{max-width:none}
.socpsec h2{margin-bottom:clamp(14px,1.8vh,20px)}
.socpsec .seclbl{margin-bottom:clamp(10px,1.4vh,16px)}
.socaside{padding-top:var(--socoffset,86px)}
.soclabel{display:flex;align-items:center;gap:9px;margin-bottom:11px;font-family:var(--disp);font-weight:600;font-size:12.5px;color:var(--grey)}
.livedot{width:6px;height:6px;border-radius:50%;background:var(--mint-deep);opacity:.75;flex:0 0 auto}
.soccard{position:relative;background:var(--card);border:1px solid rgba(11,105,79,.10);border-radius:16px;overflow:hidden;box-shadow:0 1px 2px rgba(7,65,47,.035),0 12px 28px -20px rgba(7,65,47,.22);min-height:280px}
.socskel{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;gap:12px;padding:20px 18px;background:var(--card);transition:opacity .5s ease}
.socskel i{display:block;border-radius:8px;background:linear-gradient(90deg,#F1EFE7 25%,#F8F6EF 37%,#F1EFE7 63%);background-size:400% 100%;animation:socshim 1.6s ease infinite}
@keyframes socshim{0%{background-position:100% 50%}100%{background-position:0 50%}}
.soccard.ready .socskel{opacity:0;visibility:hidden}
.soccard{--soccrop:70px}
.socfr{display:block;width:100%;border:0;background:var(--card);position:relative;z-index:1;margin-top:calc(var(--soccrop) * -1)}
.soccard.clipped:after{content:"";position:absolute;left:0;right:0;bottom:0;height:54px;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 78%);z-index:2;pointer-events:none}
.socmore{display:inline-flex;align-items:center;gap:7px;margin-top:11px;font-family:var(--disp);font-weight:600;font-size:13px;color:var(--muted);text-decoration:none;transition:color .2s}
.socmore .arr{transition:transform .28s cubic-bezier(.34,1.4,.5,1)}
.socmore:hover{color:var(--green)}
.socmore:hover .arr{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){.socskel i{animation:none}}
@media(max-width:1020px){.socsplit{grid-template-columns:minmax(0,1fr);gap:32px}.socaside{padding-top:0}.socaside{max-width:460px;width:100%}.socpsec{padding:52px 0 56px}}
.sochome{display:none}
@media(min-width:860px){.sochome{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(32px,3.8vw,46px);max-width:1160px;margin:0 auto}}
.sochomecard{flex:1 1 320px;max-width:400px;min-width:280px}
.sochomecard{transition:transform .28s cubic-bezier(.22,1,.36,1)}
.sochomecard:hover{transform:translateY(-4px)}
.sochomescroll{position:relative;max-height:470px;overflow:hidden;border-radius:16px;box-shadow:0 1px 2px rgba(7,65,47,.035),0 16px 34px -20px rgba(7,65,47,.28);transition:box-shadow .28s}
.sochomecard:hover .sochomescroll{box-shadow:0 22px 44px -18px rgba(7,65,47,.38)}
.sochomescroll:after{content:"";position:absolute;left:0;right:0;bottom:0;height:96px;background:linear-gradient(180deg,rgba(247,245,238,0),var(--card) 72%);pointer-events:none}
.sochomescroll .soccard{box-shadow:none;min-height:0;border-radius:16px}
@media(max-width:700px){.sochomescroll{max-height:330px}.sochomescroll:after{height:72px}.sofeed{height:330px}}
.solist{max-width:640px;margin:0 auto;background:var(--card);border-radius:var(--r-md);box-shadow:0 12px 28px -14px rgba(4,36,27,.6);overflow:hidden}
@media(min-width:860px){.solist{display:none}}
.solist .srow{display:flex;align-items:center;gap:18px;padding:19px 26px;position:relative;text-decoration:none;transition:background .25s}
.solist .srow+.srow:before{content:"";position:absolute;left:26px;right:26px;top:0;height:1px;background:rgba(11,105,79,.09)}
.solist .srow:hover{background:rgba(11,105,79,.035)}
.srow-ico{width:52px;height:52px;border-radius:50%;flex:0 0 auto;overflow:hidden;position:relative;box-shadow:inset 0 0 0 1px rgba(4,36,27,.08)}
.srow-ico:after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(255,255,255,.9),inset 0 0 0 3px var(--sc,var(--mint))}
.srow-ico img{width:100%;height:100%;object-fit:cover;display:block}
.srow-txt{flex:1;min-width:0}
.srow-txt b{font-family:var(--disp);font-weight:600;font-size:16.5px;letter-spacing:-.005em;display:block;color:var(--ink)}
.srow-txt span{font-size:12.5px;color:var(--muted);font-weight:480}
.srow-arr{font-family:var(--disp);font-weight:600;font-size:19px;color:var(--green);opacity:0;transition:opacity .25s,transform .25s;transform:translateX(-3px);flex:0 0 auto}
.solist .srow:hover .srow-arr{opacity:1;transform:translateX(0)}
.sofeed{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:4px;height:470px;border-radius:16px;overflow:hidden;box-shadow:0 1px 2px rgba(7,65,47,.035),0 16px 34px -20px rgba(7,65,47,.28);transition:box-shadow .28s;background:linear-gradient(90deg,#F1EFE7 25%,#F8F6EF 37%,#F1EFE7 63%);background-size:400% 100%;animation:socshim 1.6s ease infinite}
.sochomecard:hover .sofeed{box-shadow:0 22px 44px -18px rgba(7,65,47,.38)}
.sofeed.ready{animation:none;background:none}
.sofeeditem{display:block;background-size:cover;background-position:center;position:relative;overflow:hidden}
.sofeeditem:after{content:"";position:absolute;inset:0;background:rgba(4,36,27,0);transition:background .2s}
.sofeeditem:hover:after{background:rgba(4,36,27,.15)}
@media(prefers-reduced-motion:reduce){.sofeed{animation:none}}

/* === sfeerband: foto met handgeschreven regel === */
.fotoband{display:grid;grid-template-columns:1.05fr .95fr;min-height:430px;border-radius:var(--r-lg);overflow:hidden;background:var(--green-deep);box-shadow:var(--sh-card);margin-top:30px}
.fotoband .fb-beeld{background-size:cover;background-position:center 26%;filter:grayscale(1) contrast(1.04);min-height:300px}
.fotoband .fb-tekst{padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;justify-content:center;color:#fff}
.fotoband .fb-q{font-family:var(--hand);font-size:clamp(26px,3.2vw,36px);line-height:1.22;color:var(--mint-bright);margin-bottom:16px}
.fotoband .fb-tekst p{color:#CBE8DA;font-size:15.5px;line-height:1.75}
.fotoband .fb-credit{margin-top:20px;font-size:12px;letter-spacing:.04em;color:rgba(203,232,218,.55)}
@media(max-width:860px){.fotoband{grid-template-columns:1fr}.fotoband .fb-beeld{min-height:250px}}

/* === cookiekeuze: vriendelijke balk plus nette plaatshouders === */
.ckbar{position:fixed;left:0;right:0;bottom:0;z-index:200;padding:14px;transform:translateY(130%);transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.ckbar.op{transform:none}
.ck-in{max-width:1020px;margin:0 auto;background:#fff;border:1px solid rgba(11,105,79,.14);border-radius:var(--r-lg);box-shadow:0 30px 70px -28px rgba(4,36,27,.5);padding:20px 24px;display:flex;align-items:center;gap:20px 26px;flex-wrap:wrap}
.ck-tekst{flex:1 1 360px;min-width:240px}
.ck-tekst b{display:block;font-family:var(--disp);font-weight:700;font-size:17px;color:var(--ink);margin-bottom:5px}
.ck-tekst p{font-size:14px;line-height:1.6;color:var(--muted);margin:0}
.ck-knoppen{display:flex;gap:10px;flex:0 0 auto}
.ck-btn{font-family:var(--disp);font-weight:700;font-size:14.5px;line-height:1;padding:13px 22px;border-radius:50px;cursor:pointer;border:1.5px solid var(--green);transition:transform .2s cubic-bezier(.2,.8,.3,1),box-shadow .2s,background .2s}
.ck-ja{background:var(--green);color:#fff}
.ck-nee{background:#fff;color:var(--green)}
.ck-btn:hover{transform:translateY(-2px);box-shadow:0 14px 26px -16px rgba(7,61,45,.6)}
.ck-meer{flex:0 0 auto;font-family:var(--disp);font-weight:600;font-size:13px;color:var(--grey);text-decoration:underline;text-underline-offset:3px}
.ck-meer:hover{color:var(--green)}
@media(max-width:680px){.ckbar{padding:8px}.ck-in{padding:16px 17px;gap:12px;border-radius:var(--r-md)}.ck-tekst b{font-size:16px}.ck-tekst p{font-size:13.5px;line-height:1.55}.ck-knoppen{width:100%}.ck-btn{flex:1;padding:12px 8px;font-size:14px}.ck-meer{font-size:12.5px}}
.ckph{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;padding:18px;border-radius:inherit;background:linear-gradient(180deg,#F2F6F1,#E9F0E8)}
.ckph-in{text-align:center;max-width:330px}
.ckph-in b{display:block;font-family:var(--disp);font-weight:700;font-size:15.5px;color:var(--ink);margin-bottom:6px}
.ckph-in p{font-size:13.5px;line-height:1.55;color:var(--muted);margin:0 0 14px}
.ckph-btn{font-family:var(--disp);font-weight:700;font-size:13.5px;padding:10px 20px;border-radius:50px;border:1.5px solid var(--green);background:#fff;color:var(--green);cursor:pointer;transition:transform .2s cubic-bezier(.2,.8,.3,1),background .2s}
.ckph-btn:hover{transform:translateY(-2px);background:rgba(11,105,79,.06)}
.fbar .ck-link{color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fbar .ck-link:hover{color:var(--mint-bright)}

/* === full-width clubband: adempauze tussen nieuws en agenda === */
.clubband{position:relative;overflow:hidden;isolation:isolate;background:var(--night);display:flex;align-items:flex-end;padding:0;margin:34px 0 58px;min-height:clamp(300px,30vw,470px)}
.clubband .cbnd-foto{position:absolute;inset:0;z-index:0;background:url('img/club-band.webp') center 40%/cover no-repeat;transform:scale(1.06)}
.clubband .cbnd-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(3,26,19,.80) 0%,rgba(3,26,19,.36) 26%,rgba(3,26,19,.02) 54%,rgba(3,26,19,0) 100%)}
.clubband .wrap{position:relative;z-index:3;width:100%;padding-top:clamp(50px,7vw,96px);padding-bottom:clamp(28px,3.2vw,46px)}
.clubband .cbnd-eye{display:inline-block;font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mint-bright);text-shadow:0 1px 8px rgba(2,16,11,.7);margin-bottom:10px}
.clubband h2{font-family:var(--disp);font-weight:800;font-size:clamp(27px,3.8vw,44px);line-height:1.04;letter-spacing:-.022em;color:#fff;text-shadow:0 2px 10px rgba(2,16,11,.62),0 6px 30px rgba(2,16,11,.5)}
.clubband h2 .sc{color:var(--mint-bright)}
@media(max-width:700px){.clubband{min-height:286px;margin:24px 0 40px}.clubband .cbnd-foto{background-position:center 42%}}

/* === dronebeeld achter de locatiesectie + lichte CTA-band ervoor de footer === */
.locp.dronesec{background:var(--night);position:relative;overflow:hidden;isolation:isolate;margin-bottom:72px}
@media(max-width:700px){.ledenbar{padding:46px 0 46px;margin-bottom:46px}.aghome{margin-bottom:46px}.vol{margin-bottom:46px}.sponsors.sponsors-slot{margin-bottom:46px}.locp.dronesec{margin-bottom:46px}}
.locp.dronesec>*:not(.dronewrap){position:relative;z-index:2}
.dronewrap{position:absolute;inset:0;overflow:hidden;z-index:0}
.dronewrap video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.14) contrast(1.06);opacity:0;transition:opacity .6s ease}
.dronewrap video.playing{opacity:1}
.dronewrap .scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,20,15,.44) 0%,rgba(3,20,15,.22) 22%,rgba(3,20,15,.03) 40%,rgba(3,20,15,0) 50%)}
.locp.dronesec .lp-eyebrow{color:var(--mint-bright);text-shadow:0 1px 8px rgba(2,16,11,.7)}
.locp.dronesec .lp-left h2{color:#fff;text-shadow:0 2px 6px rgba(2,16,11,.7),0 4px 24px rgba(2,16,11,.7)}
.locp.dronesec .lp-left h2 .sc{color:var(--mint-bright)}
.locp.dronesec .lp-left>p{color:#EAF5EF;text-shadow:0 1px 4px rgba(2,16,11,.75),0 2px 16px rgba(2,16,11,.75)}
.locp.dronesec .lx-card{background:rgba(4,26,19,.82);border-color:rgba(255,255,255,.16);box-shadow:0 26px 52px -24px rgba(0,0,0,.6);backdrop-filter:blur(8px) saturate(1.05);-webkit-backdrop-filter:blur(8px) saturate(1.05)}
.locp.dronesec .lx-card h4{color:#fff}
.locp.dronesec .lx-addr{color:#DCEFE4}
.locp.dronesec .lx-meta{color:rgba(214,238,226,.74)}
.locp.dronesec .lx-route{color:var(--mint-bright)}
.locp.dronesec .lx-map-link{color:rgba(214,238,226,.82)}
.locp.dronesec .lx-card:hover{background:rgba(5,32,24,.9);border-color:rgba(91,240,194,.4);transform:translateY(-3px);box-shadow:0 34px 62px -24px rgba(0,0,0,.68)}
.locp.dronesec .lp-map{border-color:rgba(255,255,255,.22);box-shadow:0 34px 70px -34px rgba(0,0,0,.65)}
.dronewrap{background:url('img/drone-poster.jpg') center/cover}
@media(max-width:700px){.dronewrap .scrim{background:linear-gradient(180deg,rgba(3,20,15,.52) 0%,rgba(3,20,15,.30) 34%,rgba(3,20,15,.06) 58%,rgba(3,20,15,0) 74%)}}
@media(prefers-reduced-motion:reduce){.dronewrap video{display:none}}

.ctaband{background:linear-gradient(180deg,#F7F1E0 0%,#F2EEE0 55%,#ECE8D9 100%);padding:clamp(56px,8vh,96px) 0}
.cb-in{max-width:680px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.cb-eyebrow{font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--green);background:rgba(11,105,79,.08);border:1px solid rgba(11,105,79,.14);border-radius:50px;padding:8px 18px;margin-bottom:20px}
.cb-in h3{font-family:var(--disp);font-weight:800;font-size:clamp(26px,3.6vw,40px);line-height:1.08;letter-spacing:-.02em;color:var(--ink);margin-bottom:14px}
.cb-in h3 .sc{color:var(--green)}
.cb-in p{font-size:16.5px;line-height:1.65;color:var(--muted);max-width:46ch;margin-bottom:28px}
.cb-btns{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.cb-ghost{background:transparent;color:var(--green);border:1px solid rgba(11,105,79,.28);box-shadow:none}
.cb-ghost:hover{background:rgba(11,105,79,.06);border-color:rgba(11,105,79,.5)}

/* === actuele clubmelding: smalle band die bij de donkere kop hoort === */
.mldbar{position:relative;z-index:70;background:linear-gradient(180deg,#073d2d,#06362a);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px -18px rgba(4,36,27,.7)}
.mldbar .wrap{display:flex;align-items:center;gap:14px;padding-top:10px;padding-bottom:10px}
.mld-lbl{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-hsb);background:rgba(242,162,59,.13);border:1px solid rgba(242,162,59,.3);border-radius:50px;padding:5px 13px}
.mld-lbl:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c-hsb);box-shadow:0 0 8px rgba(242,162,59,.75);flex:0 0 auto}
.mld-tekst{flex:1;font-size:14.5px;line-height:1.45;color:#E4F2EA}
.mld-tekst a{color:var(--mint-bright);font-weight:700;text-decoration:none;border-bottom:1px solid rgba(91,240,194,.4);margin-left:10px;white-space:nowrap;transition:border-color .2s ease,color .2s ease}
.mld-tekst a:hover{color:#fff;border-bottom-color:#fff}
.mld-dicht{flex:0 0 auto;background:none;border:0;cursor:pointer;color:rgba(203,232,218,.62);font-size:19px;line-height:1;padding:4px 8px;border-radius:50px;transition:opacity .2s ease,background .2s ease,color .2s ease}
.mld-dicht:hover{color:#fff;background:rgba(255,255,255,.1)}
@media(max-width:700px){.mldbar .wrap{gap:10px;align-items:flex-start;padding-top:9px;padding-bottom:9px}.mld-lbl{margin-top:1px;font-size:10px;padding:4px 10px}.mld-tekst{font-size:13.5px}}
/* === mobiel menu: snelle knoppen bovenaan === */
.mobnav .mn-snel{grid-template-columns:1fr 1fr}
.mobnav a.mn-acc{background:rgba(91,240,194,.14);border-color:rgba(91,240,194,.38);color:#EAFFF6;font-weight:700;font-size:15px;justify-content:center}
.mobnav a.mn-acc:active{background:rgba(91,240,194,.26)}
