/* ==========================================================================
   TWS Cookie consent — site-wide component (bar + preferences modal)
   Design source: "Cookie consent - Bricks handoff.html" (approved).
   All tokens/reset scoped to #twsc-root so they can never override the
   site's own --navy / --surface tokens. Fonts (Thicccboi/Nunito) load site-wide.
   ========================================================================== */
#twsc-root{
  --navy:#1B3A6B;--navy-light:#4A6FA5;--navy-darker:#142C52;--link-blue:#6B8FC9;
  --border:#D0D5DD;--text:#555F6E;--text-muted:#8A93A2;--surface:#F5F5F5;--navy-soft:#EAF0F9;--white:#FFFFFF;
  --font-display:'Thicccboi',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;
  --radius-btn:8px;--radius-card:12px;
  --shadow-card:0 8px 24px rgba(27,58,107,.08);--shadow-btn:0 4px 12px rgba(27,58,107,.18);
  --ease:cubic-bezier(.22,1,.36,1);
  font-family:var(--font-body);color:var(--text);
}
#twsc-root *{box-sizing:border-box}
/* Reveal (cat-rijen in de modaal) */
#twsc-root [data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
#twsc-root [data-reveal].is-in{opacity:1;transform:none}
#twsc-root .cc-cat[data-reveal]:nth-child(2){transition-delay:.05s}
#twsc-root .cc-cat[data-reveal]:nth-child(3){transition-delay:.1s}
#twsc-root .cc-cat[data-reveal]:nth-child(4){transition-delay:.15s}
/* Onderbalk */
#twsc-root .cc-bar{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:var(--white);border-top:1px solid var(--border);box-shadow:0 -8px 24px rgba(27,58,107,.08);transform:translateY(110%);transition:transform .38s var(--ease)}
#twsc-root .cc-bar.is-open{transform:translateY(0)}
#twsc-root .cc-bar__inner{max-width:1160px;margin:0 auto;padding:24px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
#twsc-root .cc-bar__text{flex:1 1 420px;min-width:280px}
#twsc-root .cc-bar__title{font-family:var(--font-display);font-size:20px;font-weight:600;line-height:1.3;letter-spacing:-.01em;color:var(--navy);margin:0 0 6px}
#twsc-root .cc-bar__desc{font-size:14px;line-height:1.55;color:var(--text);margin:0}
#twsc-root .cc-inline{color:var(--link-blue);font-weight:700;text-decoration:none}
#twsc-root .cc-inline:hover{text-decoration:underline;text-underline-offset:3px}
#twsc-root .cc-bar__actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* Knoppen */
#twsc-root .btn{font-family:var(--font-display);font-weight:600;font-size:14px;border-radius:var(--radius-btn);padding:11px 20px;border:1px solid transparent;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;transition:background .22s var(--ease),border-color .22s var(--ease),box-shadow .22s var(--ease),color .22s var(--ease)}
#twsc-root .btn--primary{background:var(--navy);color:var(--white);box-shadow:var(--shadow-btn)}
#twsc-root .btn--primary:hover{background:var(--navy-darker);box-shadow:0 6px 16px rgba(27,58,107,.24)}
#twsc-root .btn--ghost{background:transparent;color:var(--navy);border-color:var(--border)}
#twsc-root .btn--ghost:hover{border-color:var(--navy);background:var(--navy-soft)}
#twsc-root .btn--link{background:none;border:none;color:var(--navy-light);padding:11px 8px;text-decoration:underline;text-underline-offset:3px}
#twsc-root .btn--link:hover{color:var(--navy)}
#twsc-root .btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--navy-soft)}
/* Voorkeuren-modaal */
#twsc-root .cc-overlay{position:fixed;inset:0;z-index:10000;background:rgba(20,44,82,.45);opacity:0;visibility:hidden;transition:opacity .3s ease;display:flex;align-items:center;justify-content:center;padding:24px}
#twsc-root .cc-overlay.is-open{opacity:1;visibility:visible}
#twsc-root .cc-modal{background:var(--white);border-radius:var(--radius-card);box-shadow:0 16px 40px rgba(27,58,107,.2);max-width:560px;width:100%;max-height:85vh;overflow:auto;transform:translateY(12px);transition:transform .3s var(--ease)}
#twsc-root .cc-overlay.is-open .cc-modal{transform:translateY(0)}
#twsc-root .cc-modal__head{padding:24px 24px 16px;border-bottom:1px solid var(--border)}
#twsc-root .cc-modal__title{font-family:var(--font-display);font-size:22px;font-weight:600;line-height:1.25;color:var(--navy);margin:0 0 6px}
#twsc-root .cc-modal__intro{font-size:14px;line-height:1.55;color:var(--text);margin:0}
#twsc-root .cc-modal__body{padding:8px 24px}
#twsc-root .cc-cat{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--surface)}
#twsc-root .cc-cat:last-child{border-bottom:none}
#twsc-root .cc-cat__text{flex:1}
#twsc-root .cc-cat__title{font-family:var(--font-display);font-size:15px;font-weight:600;line-height:1.3;color:var(--navy);margin:0 0 4px}
#twsc-root .cc-cat__desc{font-size:13px;line-height:1.5;color:var(--text);margin:0}
/* Toggle */
#twsc-root .cc-toggle{flex-shrink:0;position:relative;display:inline-flex;align-items:center;cursor:pointer;padding-top:2px}
#twsc-root .cc-toggle input{position:absolute;opacity:0;width:0;height:0}
#twsc-root .cc-track{width:44px;height:26px;border-radius:999px;background:var(--border);transition:background .22s var(--ease);position:relative}
#twsc-root .cc-track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .22s var(--ease)}
#twsc-root .cc-toggle input:checked+.cc-track{background:var(--navy)}
#twsc-root .cc-toggle input:checked+.cc-track::after{transform:translateX(18px)}
#twsc-root .cc-toggle input:disabled+.cc-track{background:var(--navy-light);opacity:.55;cursor:not-allowed}
#twsc-root .cc-toggle input:focus-visible+.cc-track{box-shadow:0 0 0 3px var(--navy-soft)}
#twsc-root .cc-modal__foot{padding:16px 24px 24px;display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;position:sticky;bottom:0;background:var(--white);border-top:1px solid var(--border)}
/* Laptop 1280 */
@media(max-width:1280px){
  #twsc-root .cc-bar__inner{max-width:1120px;padding:22px 32px}
}
/* Tablet 768 */
@media(max-width:768px){
  #twsc-root .cc-bar__inner{flex-direction:column;align-items:stretch;gap:16px}
  #twsc-root .cc-bar__text{flex:0 0 auto}
  #twsc-root .cc-bar__actions{width:100%}
  #twsc-root .cc-bar__actions .btn--ghost,#twsc-root .cc-bar__actions .btn--primary{flex:1}
  #twsc-root .cc-bar__actions .btn--link{width:100%;text-align:center}
  #twsc-root .cc-bar__title{font-size:19px}
  #twsc-root .cc-modal{max-width:100%}
}
/* Mobiel 390 */
@media(max-width:390px){
  #twsc-root .cc-bar__inner{padding:18px}
  #twsc-root .cc-bar__title{font-size:18px}
  #twsc-root .cc-bar__desc{font-size:13px}
  #twsc-root .cc-modal__foot{flex-direction:column-reverse}
  #twsc-root .cc-modal__foot .btn{width:100%}
}