/* ================================================================
   REIS — het keuzescherm: weekends, villa's, vluchten en de stand.
   Zelfde taal als de poster: zwart, blauw, Anton, scheve banners.
   ================================================================ */

:root{
  --groen:#4ade80;
  --goud:#ffd23f;
  --lijn:#25252c;
  --paneel:#101015;
}

/* ---------------- overlay ---------------- */
.reis{position:fixed;inset:0;z-index:72;display:none;overflow-y:auto;-webkit-overflow-scrolling:touch;
 background:var(--zwart);padding-bottom:calc(var(--balkh, 108px) + 28px)}
.reis.open{display:block}
.reis-kop{position:sticky;top:0;z-index:12;background:rgba(10,10,12,.94);backdrop-filter:blur(8px);
 border-bottom:1px solid var(--lijn);padding:max(10px, env(safe-area-inset-top,0px)) 14px 10px;
 display:flex;align-items:center;gap:12px}
.reis-kop .titel{font-family:var(--display);font-size:1.15rem;text-transform:uppercase;letter-spacing:.03em;line-height:1;flex:1}
.reis-kop .titel span{color:var(--blauw)}
.reis-sluit{font-family:var(--cond);font-weight:700;font-size:1.05rem;background:transparent;color:var(--wit);
 border:1px solid #3a3a40;padding:8px 14px;cursor:pointer;line-height:1}
.reis-sluit:hover{border-color:var(--blauw);color:var(--blauw)}

/* springlinks naar de secties */
.reis-tabs{display:flex;gap:2px;overflow-x:auto;background:var(--lijn);border-bottom:1px solid var(--lijn);
 position:sticky;top:52px;z-index:11;scrollbar-width:none}
.reis-tabs::-webkit-scrollbar{display:none}
.reis-tabs button{flex:1 0 auto;background:var(--zwart);color:#8a8a92;border:none;padding:11px 16px;cursor:pointer;
 font-family:var(--cond);font-weight:700;font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.reis-tabs button:hover{color:var(--wit)}
.reis-tabs button.actief{background:var(--blauw);color:var(--wit)}

.reis-binnen{max-width:1080px;margin:0 auto;padding:0 16px}
.reis-intro{padding:34px 0 8px;text-align:center}
.reis-intro h2{font-size:clamp(2.2rem,8vw,4.2rem);line-height:.92}
.reis-intro h2 span{color:var(--blauw)}
.reis-intro p{max-width:560px;margin:16px auto 0;color:#c9c5ba;font-size:1.1rem}

.sectie{padding:38px 0 8px;scroll-margin-top:104px}
.sectie > h3{font-size:clamp(1.6rem,5.5vw,2.6rem);margin-bottom:4px}
.sectie > h3 span{color:var(--blauw)}
.sectie > .uitleg{color:#8a8a92;letter-spacing:.1em;text-transform:uppercase;font-size:.82rem;margin-bottom:20px}

/* ---------------- keuzekaarten algemeen ---------------- */
.gekozen-vink{position:absolute;top:0;right:0;background:var(--blauw);color:var(--wit);
 font-family:var(--display);font-size:.9rem;letter-spacing:.1em;padding:7px 14px 8px;text-transform:uppercase;z-index:4}

/* ---------------- de weekends ---------------- */
.weekends{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.wk{position:relative;background:var(--paneel);border:1px solid var(--lijn);padding:22px 20px 20px;
 cursor:pointer;text-align:left;color:var(--wit);font-family:var(--cond);font-size:1rem;overflow:hidden;
 transition:border-color .15s, background .15s}
.wk:hover{border-color:#4a4a55}
.wk.aan{border-color:var(--blauw);background:#0c1522}
.wk .letter{position:absolute;right:-6px;bottom:-30px;font-family:var(--display);font-size:8rem;line-height:1;
 color:#ffffff;opacity:.045;pointer-events:none}
.wk.aan .letter{color:var(--blauw);opacity:.16}
.wk .maand{font-family:var(--display);font-size:2.1rem;text-transform:uppercase;line-height:1}
.wk .datum{color:var(--wit);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.9rem;margin-top:4px}
.wk .weer{color:#8a8a92;margin-top:12px;font-size:.95rem}
.wk .niveau{display:inline-block;margin-top:12px;border:1px solid #3a3a40;padding:4px 10px;
 font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;color:#c9c5ba}
.wk.aan .niveau{border-color:var(--blauw);color:var(--blauw)}
.wk .tipvlag{position:absolute;top:12px;right:-34px;transform:rotate(38deg);background:var(--goud);color:#0a0a0c;
 font-family:var(--display);font-size:.72rem;letter-spacing:.14em;padding:5px 40px;text-transform:uppercase}
.wk ul{list-style:none;margin-top:14px;font-size:.95rem}
.wk ul li{padding-left:18px;position:relative;color:#c9c5ba;margin-bottom:3px;line-height:1.35}
.wk ul li::before{position:absolute;left:0;top:-1px}
.wk ul li.ja::before{content:"+";color:var(--groen);font-weight:700}
.wk ul li.nee::before{content:"–";color:#ff8a94;font-weight:700}
.wk .let-op{margin-top:14px;border-left:3px solid var(--blauw);padding:7px 0 7px 11px;color:#ffb3ba;font-size:.92rem}
/* "geen van deze" — bewust anders dan de echte opties */
.wk.geenvan{background:transparent;border-style:dashed;border-color:#3a3a44}
.wk.geenvan .maand{color:#c9c5ba}
.wk.geenvan .datum{color:#8a8a92}
.wk.geenvan.aan{border-style:solid;border-color:var(--blauw);background:#0c1522}
.wk.geenvan.aan .maand{color:var(--wit)}

/* ---------------- beschikbaarheidsmatrix ---------------- */
.matrix-schuif{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:6px}
table.matrix{border-collapse:collapse;width:100%;min-width:460px;font-size:.95rem}
table.matrix th,table.matrix td{border:1px solid var(--lijn);padding:11px 12px;text-align:center}
table.matrix thead th{font-family:var(--cond);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
 font-size:.76rem;color:#8a8a92;background:var(--paneel)}
table.matrix thead th.nu{color:var(--blauw)}
table.matrix tbody th{text-align:left;font-family:var(--cond);font-weight:700;color:var(--wit);
 background:var(--paneel);white-space:nowrap}
table.matrix tbody th small{display:block;font-weight:400;color:#8a8a92;letter-spacing:.08em;text-transform:uppercase;font-size:.68rem}
td.vrij{color:var(--groen)}
td.bezet{color:#ff5a68}
td .bedrag{display:block;color:#c9c5ba;font-size:.82rem;margin-top:2px}
td.bezet .bedrag{color:#6a5055}
.matrix-noot{color:#8a8a92;font-size:.85rem;margin-top:10px;line-height:1.45}
.schuifhint{display:none;color:var(--blauw);font-weight:700;letter-spacing:.12em;text-transform:uppercase;
 font-size:.7rem;margin-top:8px}
@media (max-width:720px){ .schuifhint{display:block} }

/* ---------------- met hoeveel man ---------------- */
.groepbalk{border:1px solid var(--blauw);background:#0b1420;padding:16px 14px 14px;margin-bottom:12px}
.gkop{font-family:var(--display);font-size:1.35rem;text-transform:uppercase;line-height:1;margin-bottom:12px}
.gknoppen{display:flex;gap:8px;flex-wrap:wrap}
.gknop{flex:1;min-width:130px;background:transparent;border:1px solid #3a3a40;color:var(--wit);
 padding:12px 14px;cursor:pointer;text-align:left;transition:border-color .15s,background .15s}
.gknop b{display:block;font-family:var(--display);font-size:1.5rem;line-height:1;text-transform:uppercase}
.gknop i{display:block;font-style:normal;color:#8a8a92;font-weight:700;letter-spacing:.12em;
 text-transform:uppercase;font-size:.7rem;margin-top:5px}
.gknop:hover{border-color:var(--wit)}
.gknop.aan{background:var(--blauw);border-color:var(--blauw)}
.gknop.aan i{color:#cfe6ff}
.guitleg{color:#c9c5ba;font-size:.9rem;line-height:1.5;margin-top:12px}
.guitleg b{color:var(--wit)}

/* ---------------- filteren en sorteren ---------------- */
.filterbalk{border:1px solid var(--lijn);background:#0d0d12;padding:14px 14px 12px;margin-bottom:16px}
.frij{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-bottom:9px}
.fkop{font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:.7rem;color:#8a8a92;
 width:100%;margin-bottom:1px}
.fchip{font-family:var(--cond);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.78rem;
 background:transparent;color:#c9c5ba;border:1px solid #3a3a40;padding:8px 13px;cursor:pointer;
 transition:border-color .15s,color .15s,background .15s}
.fchip:hover{border-color:var(--wit);color:var(--wit)}
.fchip.aan{background:var(--blauw);border-color:var(--blauw);color:var(--wit)}
.ftel{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-top:1px solid var(--lijn);
 padding-top:10px;margin-top:2px;color:#8a8a92;font-size:.85rem;letter-spacing:.05em}
.fwis{background:none;border:none;color:var(--goud);font-family:var(--cond);font-weight:700;
 letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;cursor:pointer;padding:0;
 text-decoration:underline;text-underline-offset:3px}
.fwis.weg{display:none}
.villas-leeg{border:1px dashed #3a3a44;padding:22px 18px;color:#8a8a92;line-height:1.5}

/* ---------------- villakaarten ---------------- */
.villas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:16px}
.feiten span.spel{border-color:#3a4a20;color:#c8e6a0}
.villa{position:relative;background:var(--paneel);border:1px solid var(--lijn);overflow:hidden;
 transition:border-color .15s}
.villa:hover{border-color:#4a4a55}
.villa.aan{border-color:var(--blauw)}
.villa .foto{position:relative;aspect-ratio:16/9;background:#08080b;overflow:hidden;cursor:pointer}
.villa .foto img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.05) saturate(1.03)}
.villa .foto::after{content:"";position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(to top, rgba(10,10,12,.92) 0%, rgba(10,10,12,.15) 42%, transparent 68%)}
.villa .chips{position:absolute;top:12px;left:12px;z-index:3;display:flex;gap:6px;flex-wrap:wrap;
 max-width:calc(100% - 130px)}
.villa .rang{font-family:var(--display);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
 background:rgba(0,0,0,.6);border:1px solid #55555c;color:#c9c5ba;padding:5px 11px;white-space:nowrap}
.villa .prijsstempel{position:absolute;top:12px;right:12px;z-index:3;text-align:right;
 background:var(--blauw);color:var(--wit);padding:7px 13px 9px;transform:rotate(2deg);box-shadow:5px 5px 0 rgba(0,0,0,.45)}
.villa .prijsstempel b{display:block;font-family:var(--display);font-size:1.5rem;line-height:1}
.villa .prijsstempel span{display:block;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
 font-size:.6rem;opacity:.92;line-height:1.3;margin-top:2px}
.villa .prijsstempel.geen{background:#3a3a44}
.villa .naamband{position:absolute;left:0;right:0;bottom:14px;z-index:3;padding:0 16px;pointer-events:none}
.villa .naamband h4{font-family:var(--display);font-size:clamp(1.5rem,5.5vw,2.4rem);line-height:1;text-transform:uppercase;
 color:var(--wit);text-shadow:0 3px 24px #000}
.villa .naamband .waar{font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.76rem;color:var(--goud);
 margin-top:5px;text-shadow:0 2px 12px #000}
.villa .fitchip{font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.68rem;
 padding:4px 8px;background:rgba(10,10,12,.72);border:1px solid #3a4a20;color:#c8e6a0}
.villa .fitchip.let{border-color:var(--goud);color:var(--goud)}
.villa .fototeller{font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.68rem;
 color:#c9c5ba;background:rgba(0,0,0,.55);border:1px solid #3a3a40;padding:5px 9px;white-space:nowrap;align-self:center}

.villa .lijf{padding:16px}
.villa .zin{color:#c9c5ba;font-size:1.02rem;line-height:1.45}
.feiten{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}
.feiten span{border:1px solid var(--lijn);padding:5px 10px;font-size:.82rem;color:#c9c5ba;letter-spacing:.04em}
.feiten span b{color:var(--wit);font-weight:700}

.beschikbaar{display:flex;gap:6px;flex-wrap:wrap;margin-top:13px}
.beschikbaar i{font-style:normal;font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.7rem;
 padding:5px 9px;border:1px solid}
.beschikbaar i.ja{border-color:#20573a;color:var(--groen);background:#0d1a12}
.beschikbaar i.nee{border-color:#5a2027;color:#ff8a94;background:#1a0d10;text-decoration:line-through}

.villa-knoppen{display:flex;gap:8px;margin-top:15px;flex-wrap:wrap}
.villa-knoppen button{flex:1;min-width:132px;font-family:var(--cond);font-weight:700;letter-spacing:.14em;
 text-transform:uppercase;font-size:.88rem;padding:13px 14px;cursor:pointer;border:1px solid #3a3a40;
 background:transparent;color:var(--wit)}
.villa-knoppen .kiesdeze{background:var(--wit);color:var(--zwart);border-color:var(--wit);font-family:var(--display);
 font-size:1.05rem;letter-spacing:.08em}
.villa-knoppen .kiesdeze:hover{background:var(--blauw);color:var(--wit);border-color:var(--blauw)}
.villa.aan .villa-knoppen .kiesdeze{background:var(--blauw);color:var(--wit);border-color:var(--blauw)}
.villa-knoppen .meer:hover{border-color:var(--wit)}

/* ---------------- een keuze weer loslaten ---------------- */
.losmaak{display:none;margin-top:10px;color:var(--goud);font-size:.82rem;line-height:1.4;letter-spacing:.03em}
.losmaak b{color:var(--wit);font-weight:700}
.villa.aan .losmaak,.wk.aan .losmaak{display:block}
.wk .losmaak{position:relative;z-index:2}
.losmaakregel{color:#8a8a92;font-size:.82rem;margin-top:9px;letter-spacing:.03em}
.wisknop{font-family:var(--cond);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;
 background:transparent;color:#c9c5ba;border:1px solid #3a3a40;padding:13px 16px;cursor:pointer;white-space:nowrap}
.wisknop:hover{border-color:var(--wit);color:var(--wit)}
.wisknop.zeker{border-color:var(--blauw);color:var(--blauw)}
.wisknop.weg{display:none}

/* ---------------- zit er niks tussen? ---------------- */
.andersblok{border:1px dashed #3a3a44;padding:20px 18px;margin-top:16px}
.andersblok h4{font-family:var(--display);font-size:1.5rem;text-transform:uppercase;line-height:1}
.andersblok p{color:#8a8a92;margin-top:9px;line-height:1.5;max-width:640px}
.andersknop{margin-top:16px;font-family:var(--cond);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
 font-size:.88rem;background:transparent;color:var(--wit);border:1px solid #3a3a40;padding:13px 20px;cursor:pointer}
.andersknop:hover{border-color:var(--wit)}
.andersknop.aan{background:var(--blauw);border-color:var(--blauw)}
.anderslabel{display:block;margin-top:18px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
 font-size:.8rem;color:#c9c5ba}
.andersblok textarea{width:100%;margin-top:8px;font-family:var(--cond);font-size:1.05rem;background:#0f0f14;
 color:var(--wit);border:1px solid #3a3a40;padding:12px 14px;letter-spacing:.03em;resize:vertical;line-height:1.4}
.andersblok textarea:focus{outline:none;border-color:var(--blauw)}
.anderstel{text-align:right;color:#55555c;font-size:.78rem;margin-top:5px;letter-spacing:.08em}

.idee{border-left:3px solid var(--goud);padding:4px 0 4px 12px;margin-bottom:12px;color:#c9c5ba;line-height:1.45}
.idee b{display:block;font-family:var(--display);font-size:1rem;text-transform:uppercase;letter-spacing:.04em;
 color:var(--wit);margin-bottom:2px}

/* ---------------- villadetail (lightbox) ---------------- */
.detail{position:fixed;inset:0;z-index:90;display:none;background:#08080b;overflow-y:auto;
 -webkit-overflow-scrolling:touch}
.detail.open{display:block}
.detail-binnen{max-width:900px;margin:0 auto;padding:0 0 150px}
.detail-sluit{position:fixed;top:max(12px, env(safe-area-inset-top,0px));right:14px;z-index:94;
 font-family:var(--cond);font-weight:700;font-size:1.1rem;background:rgba(0,0,0,.72);color:var(--wit);
 border:1px solid #3a3a40;padding:9px 15px;cursor:pointer}
.detail-sluit:hover{border-color:var(--blauw);color:var(--blauw)}

.carrousel{position:relative;aspect-ratio:16/10;background:#08080b;overflow:hidden}
.carrousel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.carrousel img.aan{opacity:1}
.carrousel .pijl{position:absolute;top:50%;transform:translateY(-50%);z-index:3;background:rgba(0,0,0,.5);
 border:1px solid #3a3a40;color:var(--wit);font-size:1.3rem;width:46px;height:56px;cursor:pointer;line-height:1}
.carrousel .pijl:hover{background:var(--blauw);border-color:var(--blauw)}
.carrousel .pijl.links{left:10px}
.carrousel .pijl.rechts{right:10px}
.carrousel .bolletjes{position:absolute;left:0;right:0;bottom:12px;z-index:3;display:flex;gap:6px;justify-content:center}
.carrousel .bolletjes b{width:7px;height:7px;background:rgba(255,255,255,.35);border-radius:50%;cursor:pointer}
.carrousel .bolletjes b.aan{background:var(--blauw);transform:scale(1.35)}

.detail h3{font-size:clamp(2rem,7vw,3.4rem);margin-top:22px;line-height:.95}
.detail .waar{font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:.82rem;color:var(--goud);margin-top:8px}
.detail .zin{color:#c9c5ba;font-size:1.1rem;margin-top:14px;line-height:1.5}
.detail-blok{padding:0 16px}
.detail-blok h5{font-family:var(--cond);font-weight:700;letter-spacing:.22em;text-transform:uppercase;
 font-size:.82rem;color:var(--blauw);margin:28px 0 11px}
.plusmin{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.plusmin ul{list-style:none}
.plusmin li{position:relative;padding-left:20px;margin-bottom:6px;color:#c9c5ba;line-height:1.4}
.plusmin li::before{position:absolute;left:0;font-weight:700}
.plusmin .voor li::before{content:"+";color:var(--groen)}
.plusmin .tegen li::before{content:"–";color:#ff8a94}

table.kosten{width:100%;border-collapse:collapse;font-size:.97rem}
table.kosten th,table.kosten td{border-bottom:1px solid var(--lijn);padding:10px 6px;text-align:right}
table.kosten th:first-child,table.kosten td:first-child{text-align:left}
table.kosten thead th{font-family:var(--cond);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
 font-size:.72rem;color:#8a8a92}
table.kosten tbody td{color:#c9c5ba}
table.kosten tbody tr.nu td{color:var(--wit);background:#0c1522}
table.kosten tbody tr.weg td{color:#5a5a62}
table.kosten .pp{font-family:var(--display);font-size:1.15rem;color:var(--wit)}
table.kosten tr.weg .pp{color:#5a5a62;text-decoration:line-through}

.lijstjes{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 22px}
.lijstjes ul{list-style:none}
.lijstjes li{color:#c9c5ba;padding:5px 0;border-bottom:1px solid #17171d;display:flex;justify-content:space-between;gap:14px}
.lijstjes li span{color:var(--wit);font-weight:700;white-space:nowrap}
.lijstjes li.fijn{color:#8a8a92;font-size:.86rem;border-bottom:none;padding:0 0 9px}

.detail-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.detail-links a{flex:1;min-width:150px;text-align:center;text-decoration:none;font-family:var(--cond);font-weight:700;
 letter-spacing:.14em;text-transform:uppercase;font-size:.84rem;padding:13px 12px;border:1px solid #3a3a40;color:var(--wit)}
.detail-links a:hover{border-color:var(--blauw);color:var(--blauw)}

.detail-kiesbalk{position:fixed;left:0;right:0;bottom:0;z-index:95;background:rgba(10,10,12,.96);
 border-top:1px solid var(--lijn);padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
.detail-kiesbalk button{width:100%;max-width:880px;margin:0 auto;display:block;font-family:var(--display);
 font-size:1.3rem;letter-spacing:.06em;background:var(--wit);color:var(--zwart);border:none;padding:17px;
 cursor:pointer;text-transform:uppercase;clip-path:polygon(2% 0,100% 0,98% 100%,0 100%)}
.detail-kiesbalk button:hover{background:var(--blauw);color:var(--wit)}
.detail-kiesbalk button.aan{background:var(--blauw);color:var(--wit)}

/* ---------------- vluchten ---------------- */
.vluchten{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.vlucht{background:var(--paneel);border:1px solid var(--lijn);padding:18px}
.vlucht .route{font-family:var(--display);font-size:1.5rem;text-transform:uppercase;line-height:1}
.vlucht .route em{font-style:normal;color:var(--blauw)}
.vlucht .naar{color:#8a8a92;letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;margin-top:4px}
.vlucht .bedrag{font-family:var(--display);font-size:2rem;margin-top:13px;line-height:1}
.vlucht .bedrag small{font-family:var(--cond);font-size:.8rem;color:#8a8a92;letter-spacing:.1em;
 text-transform:uppercase;display:block;font-weight:700;margin-top:3px}
.vlucht .band{color:#8a8a92;font-size:.88rem;margin-top:6px}
.vlucht .mtsch{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.vlucht .mtsch b{font-weight:400;font-size:.76rem;border:1px solid var(--lijn);padding:3px 8px;color:#c9c5ba}
.vlucht .tip{color:#c9c5ba;font-size:.9rem;margin-top:12px;border-left:3px solid var(--lijn);padding-left:11px;line-height:1.4}
.vluchtnoot{color:#8a8a92;font-size:.9rem;line-height:1.5;margin-bottom:20px;max-width:720px;
 border-left:3px solid var(--lijn);padding-left:13px}
.zoekrij{margin-top:14px;border-top:1px solid var(--lijn);padding-top:12px}
.zoekkop{color:#55555c;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.68rem;margin-bottom:8px}
.zoekweek{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.zoekweek b{flex:1;min-width:96px;font-weight:400;color:#c9c5ba;font-size:.88rem}
.zoekweek a{text-decoration:none;font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.68rem;
 padding:5px 10px;border:1px solid var(--lijn);color:#c9c5ba}
.zoekweek a:hover{border-color:var(--blauw);color:var(--blauw)}
.vlucht a.hoofdlink{display:block;text-align:center;margin-top:14px;text-decoration:none;font-family:var(--cond);
 font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem;padding:11px;
 border:1px solid #3a3a40;color:var(--wit)}
.vlucht a.hoofdlink:hover{border-color:var(--blauw);color:var(--blauw)}

.bijkomend{background:var(--paneel);border:1px solid var(--lijn);padding:18px;margin-top:14px}
.bijkomend h5{font-family:var(--cond);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.8rem;
 color:var(--blauw);margin-bottom:10px}
.bijkomend ul{list-style:none}
.bijkomend li{color:#c9c5ba;padding-left:18px;position:relative;margin-bottom:5px;line-height:1.4}
.bijkomend li::before{content:"+";position:absolute;left:0;color:#8a8a92;font-weight:700}

/* ---------------- wie ben je + erbij ---------------- */
.namen{display:flex;flex-wrap:wrap;gap:6px}
.namen button{font-family:var(--display);font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase;
 background:transparent;color:var(--wit);border:1px solid #3a3a40;padding:11px 17px;cursor:pointer}
.namen button:hover{border-color:var(--wit)}
.namen button.aan{background:var(--blauw);border-color:var(--blauw)}
.anders{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.anders input{flex:1;min-width:200px;font-family:var(--cond);font-size:1.1rem;background:#0f0f14;color:var(--wit);
 border:1px solid #3a3a40;padding:12px 16px;letter-spacing:.04em}
.anders input:focus{outline:none;border-color:var(--blauw)}

.komt{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--lijn);border:1px solid var(--lijn)}
.komt button{background:var(--zwart);color:var(--wit);border:none;padding:20px 8px;cursor:pointer;font-family:var(--cond)}
.komt button:hover{background:#131318}
.komt button b{display:block;font-family:var(--display);font-size:1.25rem;text-transform:uppercase;line-height:1.1}
.komt button i{display:block;font-style:normal;color:#8a8a92;font-size:.78rem;letter-spacing:.1em;
 text-transform:uppercase;margin-top:5px}
.komt button.aan{background:var(--blauw)}
.komt button.aan i{color:#cfe6ff}
.komt button.aan.nee{background:#3a3a44}

/* ---------------- de stand ---------------- */
.stand-blok{background:var(--paneel);border:1px solid var(--lijn);padding:18px;margin-bottom:12px;overflow:hidden}
.stand-blok h5{font-family:var(--cond);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.8rem;
 color:var(--blauw);margin-bottom:14px}
.staaf{margin-bottom:13px}
.staaf .rij{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:5px}
.staaf .rij > *{min-width:0}
.staaf .wie{font-family:var(--display);font-size:1.05rem;text-transform:uppercase;letter-spacing:.03em;
 overflow-wrap:anywhere}
.staaf .aantal{font-family:var(--display);font-size:1.05rem;color:var(--blauw);white-space:nowrap}
.staaf .spoor{height:9px;background:#1c1c22;overflow:hidden}
.staaf .vul{height:100%;background:var(--blauw);width:0;transition:width .5s cubic-bezier(.16,1,.3,1)}
.staaf.leider .vul{background:var(--goud)}
.staaf.grijs .wie{color:#8a8a92}
.staaf.grijs .vul{background:#4a4a55}
.staaf.grijs .aantal{color:#8a8a92}
.staaf.leider .aantal{color:var(--goud)}
.staaf .stemmers{color:#8a8a92;font-size:.85rem;margin-top:5px;letter-spacing:.04em;overflow-wrap:anywhere}

.roster{display:grid;gap:2px;background:var(--lijn);border:1px solid var(--lijn)}
.roster .man{background:var(--zwart);display:flex;align-items:center;gap:10px;padding:12px 13px;flex-wrap:wrap}
.roster .man .nm{font-family:var(--display);font-size:1.1rem;text-transform:uppercase;letter-spacing:.03em;
 min-width:88px;flex:0 0 auto}
.roster .man .chip{font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.66rem;
 padding:4px 9px;border:1px solid #3a3a40;color:#8a8a92;white-space:nowrap}
.roster .man .chip.ja{border-color:#20573a;color:var(--groen)}
.roster .man .chip.twijfel{border-color:#6a5520;color:var(--goud)}
.roster .man .chip.nee{border-color:#5a2027;color:#ff8a94}
.roster .man .keus{color:#c9c5ba;font-size:.88rem;margin-left:auto;text-align:right;letter-spacing:.03em}
.roster .man .keus em{font-style:normal;color:#55555c}
.roster .man.stil .nm{color:#55555c}
.roster .man .opm{flex:1 0 100%;color:#8a8a92;font-size:.9rem;font-style:italic;padding-left:2px}

.uitslag-stempel{text-align:center;margin:18px 0 4px;font-family:var(--display);
 font-size:clamp(1.3rem,4.4vw,2.1rem);color:var(--goud);border:4px solid var(--goud);
 padding:12px 18px;transform:rotate(-1.4deg);text-transform:uppercase;line-height:1.15}

/* ---------------- vaste balk onderin ---------------- */
.keuzebalk{position:fixed;left:0;right:0;bottom:0;z-index:78;background:rgba(10,10,12,.97);
 border-top:1px solid var(--lijn);padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));display:none}
.keuzebalk.aan{display:block}
.keuzebalk .binnen{max-width:1080px;margin:0 auto;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.keuzebalk .samenvatting{flex:1;min-width:190px;line-height:1.3}
.keuzebalk .samenvatting b{display:block;font-family:var(--display);font-size:1rem;text-transform:uppercase;
 letter-spacing:.03em;color:var(--wit)}
.keuzebalk .samenvatting span{color:#8a8a92;font-size:.85rem;letter-spacing:.05em}
.keuzebalk .samenvatting span.mist{color:var(--blauw)}
.vastknop{font-family:var(--display);font-size:1.15rem;letter-spacing:.06em;background:var(--wit);color:var(--zwart);
 border:none;padding:15px 32px;cursor:pointer;text-transform:uppercase;clip-path:polygon(3% 0,100% 0,97% 100%,0 100%)}
.vastknop:hover:not(:disabled){background:var(--blauw);color:var(--wit)}
.vastknop:disabled{background:#2a2a32;color:#6a6a75;cursor:not-allowed}

.melding{position:fixed;left:50%;bottom:calc(var(--balkh, 80px) + 18px);transform:translateX(-50%) translateY(14px);z-index:96;
 background:var(--blauw);color:var(--wit);font-family:var(--display);font-size:1rem;letter-spacing:.08em;
 text-transform:uppercase;padding:12px 26px;opacity:0;pointer-events:none;transition:opacity .25s, transform .25s;
 box-shadow:0 8px 30px rgba(0,0,0,.6);text-align:center;max-width:92vw}
.melding.zie{opacity:1;transform:translateX(-50%) translateY(0)}
.melding.fout{background:#3a3a44;border:1px solid #ff5a68;color:#ff8a94}

.reis-voet{text-align:center;color:#55555c;font-size:.82rem;line-height:1.6;padding:34px 8px 16px;
 border-top:1px solid var(--lijn);margin-top:38px}

/* ---------------- klein scherm ---------------- */
@media (max-width:640px){
  .reis{padding-bottom:calc(var(--balkh, 94px) + 28px)}
  .reis-tabs{top:48px}
  .reis-tabs button{padding:11px 10px;font-size:.76rem;letter-spacing:.09em}
  .reis-kop{padding-top:max(8px, env(safe-area-inset-top,0px));padding-bottom:8px}
  .reis-kop .titel{font-size:1rem}
  .reis-binnen{padding:0 13px}
  .reis-intro{padding-top:26px}
  .sectie{padding-top:32px;scroll-margin-top:96px}
  .villa .prijsstempel{padding:6px 10px 8px}
  .villa .prijsstempel b{font-size:1.2rem}
  .villa .naamband{bottom:12px;padding:0 13px}
  .villa .lijf{padding:14px 13px}
  .carrousel{aspect-ratio:4/3}
  .carrousel .pijl{width:40px;height:50px}
  .detail-blok{padding:0 13px}
  .andersblok{padding:17px 14px}
  .andersknop{width:100%}
  .komt button{padding:15px 5px}
  .komt button b{font-size:1rem}
  .komt button i{font-size:.68rem;letter-spacing:.06em}
  .roster .man .keus{margin-left:0;flex:1 0 100%;text-align:left}
  .keuzebalk{padding:9px 13px calc(9px + env(safe-area-inset-bottom,0px))}
  .keuzebalk .binnen{gap:8px}
  .keuzebalk .samenvatting b{font-size:.92rem}
  .keuzebalk .samenvatting span{font-size:.78rem}
  /* wissen en vastzetten naast elkaar op één regel, zodat de balk laag blijft */
  .vastknop{flex:1;padding:13px;font-size:1.05rem;order:3}
  .wisknop{flex:0 0 auto;padding:12px 12px;font-size:.72rem;letter-spacing:.08em;order:2}
  .groepbalk{padding:13px 12px 12px}
  .gkop{font-size:1.2rem}
  .gknop b{font-size:1.3rem}
  .filterbalk{padding:12px 12px 10px}
  .fchip{font-size:.74rem;padding:7px 11px}
  .detail-kiesbalk{padding:10px 13px calc(10px + env(safe-area-inset-bottom,0px))}
  .detail-kiesbalk button{font-size:1.1rem;padding:15px}
}
@media (max-width:560px){
  .villa .naamband .plek{display:none}
}
@media (prefers-reduced-motion: reduce){
  .staaf .vul{transition:none}
  .carrousel img{transition:none}
  .melding{transition:none}
}


/* ================================================================
   SCOREBORD — de stand in één oogopslag, los van het keuzescherm
   ================================================================ */
.uitslag{position:fixed;inset:0;z-index:74;display:none;overflow-y:auto;-webkit-overflow-scrolling:touch;
 background:radial-gradient(ellipse at 50% -10%, #0e1a2b 0%, var(--zwart) 60%);padding-bottom:96px}
.uitslag.open{display:block}
.uitslag-binnen{max-width:640px;margin:0 auto;padding:16px 16px 0}

/* de twee koplopers */
.kop2{display:grid;gap:8px}
.leidt{position:relative;border:1px solid var(--lijn);background:var(--paneel);padding:13px 16px;overflow:hidden}
.leidt.wint{border-color:var(--goud);background:#17130a}
.leidt .wat{font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:.68rem;color:#8a8a92}
.leidt .naam{font-family:var(--display);font-size:clamp(1.35rem,5.8vw,2.1rem);line-height:1.05;margin-top:3px;
 text-transform:uppercase}
.leidt.wint .naam{color:var(--goud)}
.leidt .telling{font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;color:#c9c5ba;margin-top:4px}
.leidt .telling b{color:var(--wit)}
.leidt.leeg .naam{color:#55555c;font-size:clamp(1.1rem,4.6vw,1.5rem)}

.wintvlag{position:absolute;top:11px;right:-32px;transform:rotate(38deg);background:var(--goud);color:#0a0a0c;
 font-family:var(--display);font-size:.66rem;letter-spacing:.14em;padding:4px 38px;text-transform:uppercase}

/* wie er is */
.uitslag-kop{font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.68rem;color:var(--blauw);
 margin:16px 0 8px}
.mannen{display:flex;flex-wrap:wrap;gap:6px}
.mannen span{font-family:var(--display);font-size:.86rem;letter-spacing:.04em;text-transform:uppercase;
 border:1px solid #3a3a40;padding:6px 9px;color:#55555c;display:flex;align-items:center;gap:5px}
.mannen span i{font-style:normal;font-size:.8rem}
.mannen span.ja{border-color:#20573a;color:var(--groen)}
.mannen span.twijfel{border-color:#6a5520;color:var(--goud)}
.mannen span.nee{border-color:#5a2027;color:#ff8a94}
.mannen span.gekozen{border-color:#4a4a55;color:#c9c5ba}

/* compacte balkjes */
.mini{margin-top:7px}
.mini .r{display:flex;align-items:baseline;gap:10px;font-size:.92rem}
.mini .r span:first-child{flex:1;min-width:0;color:#c9c5ba;overflow-wrap:anywhere;font-size:.86rem}
.mini .r b{font-family:var(--display);font-size:1rem;color:var(--wit)}
.mini .sp{height:5px;background:#1c1c22;margin-top:3px;overflow:hidden}
.mini .vl{height:100%;background:var(--blauw);width:0;transition:width .45s cubic-bezier(.16,1,.3,1)}
.mini.top .vl{background:var(--goud)}
.mini.top .r b{color:var(--goud)}
.mini.nul .r span:first-child,.mini.nul .r b{color:#55555c}

.tweekolom{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;align-items:start}
.tweekolom .uitslag-kop{margin-top:16px}

.uitslag-noot{color:#55555c;font-size:.82rem;line-height:1.5;margin-top:16px;text-align:center}

.knoprij{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}

.uitslag-voet{position:fixed;left:0;right:0;bottom:0;z-index:75;background:rgba(10,10,12,.97);
 border-top:1px solid var(--lijn);padding:11px 16px calc(11px + env(safe-area-inset-bottom,0px))}
.uitslag-voet .vastknop{display:block;width:100%;max-width:608px;margin:0 auto}

@media (min-width:560px){ .kop2{grid-template-columns:1fr 1fr} }
@media (max-width:640px){
  .knoprij .stemknop{padding:11px 15px;letter-spacing:.07em;font-size:.88rem}
  .uitslag{padding-bottom:88px}
  .uitslag-binnen{padding:16px 13px 0}
  .leidt{padding:14px 15px}
}
@media (prefers-reduced-motion: reduce){ .mini .vl{transition:none} }