/* Homepage v2 — extra secties (dichtheid) */

/* ---------- routekiezer ---------- */
.routepick{display:flex;gap:6px;overflow-x:auto;padding-bottom:3px}
.routepick button{flex-shrink:0;height:44px;padding:0 15px 0 5px;border:1.4px solid var(--line);border-radius:99px;background:var(--surface);font-size:15.5px;font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;gap:9px}
.routepick button .th{width:34px;height:34px;border-radius:50%;object-fit:cover;flex-shrink:0;background:var(--surface-3)}
.routepick button:hover{border-color:var(--line-3)}
.routepick button .p{font-size:14px;font-weight:700;color:var(--ink-3)}
.routepick button.on{background:var(--dark);border-color:var(--dark);color:#fff}
.routepick button.on .p{color:rgba(255,255,255,.65)}

/* ---------- multi-airport ---------- */
.aps{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.ap{background:var(--surface);border:1.4px solid var(--line);border-radius:var(--r-l);padding:13px 14px;text-align:left;transition:border-color .13s,box-shadow .13s,transform .09s}
.ap:hover{border-color:var(--line-3);box-shadow:var(--sh-2);transform:translateY(-2px)}
.ap.on{border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,107,69,.1)}
.ap .apc{font-size:12.5px;font-weight:700;letter-spacing:.08em;color:var(--ink-3)}
.ap.best .apc{color:var(--cheap-ink)}
.ap .nm{font-size:15.5px;font-weight:700;letter-spacing:-.015em;margin-top:1px}
.ap .pr{font-size:23.5px;font-weight:800;letter-spacing:-.03em;margin-top:7px}
.ap .dl{font-size:12.5px;font-weight:700;margin-top:1px}
.ap .apt{font-size:12.5px;font-weight:600;color:var(--ink-3);margin-top:7px;padding:7px 0 0;border-top:1px dashed var(--line);display:flex;align-items:center;gap:5px;border-radius:0}
.ap .apt svg{color:var(--ink-4);flex-shrink:0}
.ap.best{background:var(--cheap-bg);border-color:var(--cheap-bd)}
.ap.best .pr,.ap.best .nm{color:var(--cheap-ink)}
.ap.best .apt{border-top-color:var(--cheap-bd)}

/* ---------- kalender inline ---------- */
.calrow{display:grid;grid-template-columns:1fr 316px;gap:26px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px}
.calbig .mh{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.calbig .mh .t{font-size:17px;font-weight:800;letter-spacing:-.02em}
.calbig .nav{display:flex;gap:5px}
.calbig .nav button{width:28px;height:28px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink-2);display:grid;place-items:center}
.calbig .nav button:hover{border-color:var(--line-3)}
.calbig .dow{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:5px}
.calbig .dow span{text-align:center;font-size:12.5px;font-weight:700;color:var(--ink-4)}
.calbig .grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.calbig .cd{aspect-ratio:1/.72;border-radius:8px;border:1.4px solid transparent}
.calbig .cd .n{font-size:14.5px;font-weight:700}
.calbig .cd .p{font-size:12.5px;font-weight:700}
.calbig .cd.lowest{border-color:var(--cheap-ink)}
.calside{border-left:1px dashed var(--line);padding-left:24px;display:flex;flex-direction:column;gap:14px}
.calside .lb{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-4)}
.calside .sum{font-size:14.5px;color:var(--ink-2);line-height:1.55}
.calside .sum b{color:var(--ink);font-weight:700}
.calside .warn{background:var(--high-bg);border:1px solid var(--high-bd);border-radius:10px;padding:10px 12px;font-size:14px;color:var(--high-ink);font-weight:600;line-height:1.45}
.gradbar{display:flex;gap:0;height:8px;border-radius:99px;overflow:hidden}
.gradbar span{flex:1}
.gradlb{display:flex;justify-content:space-between;font-size:12.5px;font-weight:700;color:var(--ink-3);margin-top:6px}

/* ---------- bestemmingsfilters + dichte grid ---------- */
.dfilters{display:flex;gap:6px;margin-bottom:12px;overflow-x:auto;padding-bottom:2px}
.dfilters button{flex-shrink:0;height:32px;padding:0 13px;border:1px solid var(--line);border-radius:99px;background:var(--surface);font-size:14px;font-weight:600;color:var(--ink-2)}
.dfilters button:hover{border-color:var(--line-3)}
.dfilters button.on{background:var(--dark);border-color:var(--dark);color:#fff}
.dgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.dc{background:var(--surface);border:1.4px solid var(--line);border-radius:var(--r-m);padding:12px 14px;text-align:left;display:block;width:100%;font-family:inherit;transition:border-color .13s,box-shadow .13s}
.dc:hover{border-color:var(--line-3);box-shadow:var(--sh-1)}
.dc.on{border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,107,69,.1)}
.dc .r1{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.dc .cy{font-size:16.5px;font-weight:700;letter-spacing:-.02em}
.dc .cy i{font-style:normal;color:var(--ink-4);font-weight:600;font-size:12.5px;margin-left:4px}
.dc .pp{font-size:18px;font-weight:800;letter-spacing:-.025em}
.dc .r2{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:12.5px;font-weight:600;color:var(--ink-3);flex-wrap:wrap}
.dc .hd{padding:1px 6px;border-radius:4px;border:1px solid;font-size:12.5px;font-weight:700}
.dempty{grid-column:1/-1;padding:30px;text-align:center;color:var(--ink-3);font-size:14.5px;border:1px dashed var(--line-2);border-radius:var(--r-m)}

/* ---------- insight-kaarten ---------- */
.igrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ic{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:18px 20px;display:flex;flex-direction:column}
.ic .ico{width:34px;height:34px;border-radius:9px;background:var(--brand-lo);color:var(--brand);display:grid;place-items:center;margin-bottom:11px}
.ic h3{font-size:18px;letter-spacing:-.022em;margin-bottom:6px}
.ic p{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.5}
.ic p b{color:var(--ink);font-weight:700}
.ic .big{font-size:30.5px;font-weight:800;letter-spacing:-.032em;margin:10px 0 4px;line-height:1}
.ic .big small{display:block;font-size:13.5px;font-weight:600;color:var(--ink-3);letter-spacing:-.005em;margin-top:5px}
.ic .fn{margin-top:auto;padding-top:12px;font-size:12.5px;font-weight:700;letter-spacing:.05em;color:var(--ink-4);text-transform:uppercase}
.wbars{display:flex;align-items:flex-end;gap:5px;height:78px;margin:13px 0 4px}
.wb{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;height:100%}
.wb .cl{width:100%;border-radius:4px 4px 2px 2px;background:var(--surface-3)}
.wb.lo .cl{background:var(--brand)}
.wb.hi .cl{background:#cf5b3f}
.wb .lb{font-size:12.5px;font-weight:700;color:var(--ink-4)}
.wb.lo .lb{color:var(--brand)}
.score{display:flex;align-items:center;gap:12px;margin:12px 0 2px}
.ring{width:64px;height:64px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;background:conic-gradient(var(--brand) 0 var(--pct,88%),var(--surface-3) var(--pct,88%) 100%)}
.ring i{width:50px;height:50px;border-radius:50%;background:var(--surface);display:grid;place-items:center;font-style:normal;font-size:18px;font-weight:800;letter-spacing:-.03em}

/* ---------- prijsdalingen ---------- */
.drops{background:var(--dark);border-radius:var(--r-l);padding:20px 22px;color:#fff}
.drops .dh{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:14px;flex-wrap:wrap}
.drops h2{color:#fff;font-size:23.5px;letter-spacing:-.026em}
.drops .dh p{margin:4px 0 0;font-size:14px;color:rgba(255,255,255,.72)}
.dlist{display:grid;gap:5px}
.dr{display:flex;align-items:center;gap:14px;padding:11px 13px;border-radius:10px;background:rgba(255,255,255,.055);font-size:15.5px}
.dr:hover{background:rgba(255,255,255,.1)}
.dr .nm{font-weight:600;color:#fff}
.dr .nm i{font-style:normal;color:rgba(255,255,255,.56);font-weight:600;font-size:12.5px;margin-left:5px}
.dr .ag{margin-left:auto;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.58);white-space:nowrap}
.dr .was{font-size:13.5px;font-weight:600;color:rgba(255,255,255,.4);text-decoration:line-through}
.dr .now{font-size:18px;font-weight:800;letter-spacing:-.025em;color:#fff;min-width:50px;text-align:right}
.dr .dl{font-size:12.5px;font-weight:700;color:#5cc48f;min-width:40px;text-align:right}

/* ---------- airline-muur ---------- */
.tblock{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px}
.tblock .th{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:15px;flex-wrap:wrap}
.tblock .th h3{font-size:20.5px;letter-spacing:-.024em}
.tblock .th p{margin:4px 0 0;font-size:14.5px;color:var(--ink-3);max-width:62ch}
.alwall{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.alc{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px 0 4px;border:1px solid var(--line);border-radius:99px;background:var(--surface-2);font-size:14px;font-weight:600;color:var(--ink-2)}
.alc i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12.5px;font-weight:800;color:var(--bg);background:var(--dark);flex-shrink:0}
.tstats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-top:16px}
.ts .v{font-size:22.5px;font-weight:800;letter-spacing:-.028em}
.ts .l{font-size:13.5px;color:var(--ink-3);margin-top:2px;line-height:1.4}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:1fr 1fr;gap:8px 26px;align-items:start}
.fi{border-bottom:1px solid var(--line)}
.fi summary{cursor:pointer;padding:13px 0;font-size:16px;font-weight:700;letter-spacing:-.014em;list-style:none;display:flex;align-items:center;gap:10px}
.fi summary::-webkit-details-marker{display:none}
.fi summary::after{content:"+";margin-left:auto;font-size:19px;font-weight:600;color:var(--ink-4);line-height:1}
.fi[open] summary::after{content:"\2212"}
.fi summary:hover{color:var(--brand)}
.fi p{margin:0 0 14px;font-size:14.5px;color:var(--ink-2);line-height:1.6;max-width:64ch}

/* ---------- responsive ---------- */
@media(max-width:1140px){
  .aps{grid-template-columns:repeat(3,1fr)}
  .calrow{grid-template-columns:1fr;gap:18px}
  .calside{border-left:0;border-top:1px dashed var(--line);padding-left:0;padding-top:16px}
  .dgrid{grid-template-columns:1fr 1fr}
  .igrid{grid-template-columns:1fr}
  .tstats{grid-template-columns:1fr 1fr}
  .faq{grid-template-columns:1fr;gap:0}
}
@media(max-width:820px){
  .aps{grid-template-columns:1fr 1fr}
  .dgrid{grid-template-columns:1fr}
  .tstats{grid-template-columns:1fr}
  .drops,.tblock,.calrow{padding:16px 15px}
  .dr{flex-wrap:wrap;gap:8px}
  .dr .ag{order:9;width:100%;margin-left:0}
}