/* Q-Global Imports — Legal pages. Matches the main site (dark navy premium,
   Fraunces display + Inter body, platinum/ice accents). Long-form readable. */
:root{
  --bg:#060b14;--bg2:#0a1120;--card:#101b2c;--card2:#0c1626;
  --line:rgba(163,192,228,.14);--line2:rgba(163,192,228,.24);
  --ink:#eef4fc;--mut:#a8bad2;--mut2:#8598b2;
  --gold:#c7daf0;--gold-d:#86abd7;--aqua:#74dbe2;
  --display:'Fraunces','Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --shadow:0 2px 6px rgba(0,0,0,.42),0 26px 64px rgba(0,0,0,.5);
  --z-sticky:100;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:16px/1.7 var(--sans);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* Language visibility — driven by html[data-lang] */
[data-i18n]{display:none}
html[data-lang="nl"] [data-i18n="nl"]{display:revert}
html[data-lang="en"] [data-i18n="en"]{display:revert}
/* inline lang spans */
span[data-i18n]{display:none}
html[data-lang="nl"] span[data-i18n="nl"]{display:inline}
html[data-lang="en"] span[data-i18n="en"]{display:inline}

/* ---- Header ---- */
.lg-head{position:sticky;top:0;z-index:var(--z-sticky);
  background:rgba(6,11,20,.82);backdrop-filter:blur(12px) saturate(1.2);
  -webkit-backdrop-filter:blur(12px) saturate(1.2);border-bottom:1px solid var(--line)}
.lg-nav{display:flex;align-items:center;gap:18px;height:66px}
.lg-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);margin-right:auto}
.lg-brand img{height:38px;width:auto;object-fit:contain;
  filter:drop-shadow(0 2px 7px rgba(180,205,240,.35))}
.lg-brand b{font:700 15px/1 var(--sans);letter-spacing:.07em;white-space:nowrap}
.lg-brand span{display:block;font:500 8.5px/1.5 var(--sans);letter-spacing:.32em;color:var(--mut)}
.lg-brand .wm{display:flex;flex-direction:column;gap:2px}
.lg-back{color:var(--mut);text-decoration:none;font-size:13.5px;white-space:nowrap;
  display:inline-flex;align-items:center;gap:7px;transition:color .2s}
.lg-back:hover{color:var(--ink)}
@media(max-width:620px){.lg-back .txt{display:none}}
@media(max-width:560px){.lg-brand .wm{display:none}.lg-nav{gap:12px}}

/* Language toggle */
.lang{display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:999px;
  background:rgba(16,27,44,.6);flex:0 0 auto}
.lang button{appearance:none;border:0;background:transparent;color:var(--mut);
  font:600 12.5px/1 var(--sans);letter-spacing:.04em;padding:8px 15px;border-radius:999px;
  cursor:pointer;transition:.2s}
.lang button:hover{color:var(--ink)}
.lang button[aria-pressed="true"]{
  background:linear-gradient(150deg,#EDF2F9,#C2D3E7 55%,#A2BDD9);color:#0A1424;
  box-shadow:0 4px 12px rgba(120,160,210,.28),inset 0 1px 0 rgba(255,255,255,.6)}
.lang button:focus-visible{outline:2px solid var(--aqua);outline-offset:2px}

/* ---- Masthead ---- */
.lg-mast{padding:76px 0 40px;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.lg-mast::after{content:"";position:absolute;right:-15%;top:-40%;width:55%;height:180%;
  background:radial-gradient(ellipse,rgba(120,180,240,.11),transparent 66%);pointer-events:none}
.lg-mast .wrap{position:relative;z-index:1}
.lg-kicker{display:inline-flex;align-items:center;gap:11px;font:500 12.5px/1 var(--sans);
  letter-spacing:.14em;text-transform:uppercase;color:var(--mut2);margin-bottom:22px}
.lg-kicker::before{content:"";width:30px;height:1px;
  background:linear-gradient(90deg,var(--aqua),transparent);opacity:.85}
.lg-mast h1{font-family:var(--display);font-weight:400;letter-spacing:-0.02em;line-height:1.05;
  font-size:clamp(34px,5.4vw,60px);text-wrap:balance;max-width:16ch}
.lg-mast .sub{color:var(--mut);font-size:17.5px;margin-top:20px;max-width:62ch;line-height:1.6}
.lg-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.lg-tag{border:1px solid var(--line);border-radius:999px;padding:7px 15px;font-size:12.5px;
  color:var(--gold);background:rgba(16,27,44,.4)}
.lg-tag.warn{color:#f0c890;border-color:rgba(240,200,144,.28)}

/* ---- Body layout: TOC + article ---- */
.lg-body{padding:56px 0 40px}
.lg-body .wrap{display:grid;grid-template-columns:230px 1fr;gap:56px;align-items:start}
@media(max-width:880px){.lg-body .wrap{grid-template-columns:1fr;gap:30px}}

.lg-toc{position:sticky;top:90px;font-size:13.5px}
@media(max-width:880px){.lg-toc{position:static;border:1px solid var(--line);
  border-radius:14px;padding:20px 22px;background:var(--card2)}}
.lg-toc h4{font:600 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;
  color:var(--mut2);margin-bottom:16px}
.lg-toc ol{list-style:none;counter-reset:toc;display:flex;flex-direction:column;gap:2px}
.lg-toc a{counter-increment:toc;display:flex;gap:11px;text-decoration:none;color:var(--mut);
  padding:6px 0;line-height:1.4;transition:color .2s;border-radius:6px}
.lg-toc a::before{content:counter(toc,decimal-leading-zero);color:var(--gold-d);
  font-variant-numeric:tabular-nums;font-weight:600;font-size:11.5px;flex:0 0 auto;padding-top:1px}
.lg-toc a:hover{color:var(--ink)}

/* Article */
.lg-article{max-width:72ch;min-width:0}
.lg-lead{font-size:18px;line-height:1.65;color:var(--mut);margin-bottom:14px;
  padding-bottom:26px;border-bottom:1px solid var(--line)}
.lg-lead b{color:var(--ink);font-weight:600}
.lg-art{padding:30px 0;border-bottom:1px solid var(--line)}
.lg-art:last-child{border-bottom:0}
.lg-art > h2{font-family:var(--display);font-weight:400;font-size:clamp(22px,2.8vw,29px);
  letter-spacing:-0.012em;line-height:1.15;color:var(--ink);display:flex;gap:15px;align-items:baseline}
.lg-art > h2 .n{font:600 13px/1 var(--sans);letter-spacing:.04em;color:var(--gold-d);
  font-variant-numeric:tabular-nums;flex:0 0 auto;padding-top:4px}
.lg-art p{color:var(--mut);margin-top:14px;line-height:1.72}
.lg-art p b,.lg-art li b{color:var(--ink);font-weight:600}
.lg-art ul{list-style:none;margin-top:16px;display:flex;flex-direction:column;gap:11px}
.lg-art ul li{position:relative;padding-left:22px;color:var(--mut);line-height:1.68}
.lg-art ul li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;
  border-radius:50%;background:var(--gold-d)}
.lg-art ol.num{margin-top:16px;padding-left:2px;list-style:none;counter-reset:sub;
  display:flex;flex-direction:column;gap:11px}
.lg-art ol.num li{counter-increment:sub;position:relative;padding-left:34px;color:var(--mut);line-height:1.68}
.lg-art ol.num li::before{content:counter(sub);position:absolute;left:0;top:0;
  width:23px;height:23px;border-radius:7px;background:var(--card);border:1px solid var(--line2);
  color:var(--gold);font:600 12px/23px var(--sans);text-align:center}
.lg-art a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--gold-d)}

/* Callout (definitions, invoice text, etc.) */
.lg-note{margin-top:22px;padding:22px 24px;border:1px solid var(--line);border-radius:14px;
  background:var(--card2);box-shadow:var(--hair)}
.lg-note h5{font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:var(--mut2);margin-bottom:12px}
.lg-note p{margin-top:8px;color:var(--mut);font-size:14.5px;line-height:1.65}
.lg-note.accent{border-color:rgba(116,219,226,.28);background:rgba(116,219,226,.05)}

/* Placeholder chip — Mario fills these */
.ph{display:inline-block;padding:1px 8px;border-radius:6px;background:rgba(240,200,144,.14);
  border:1px dashed rgba(240,200,144,.45);color:#f0c890;font:600 13px/1.4 var(--sans);
  letter-spacing:.01em;white-space:nowrap}

/* Company info definition grid */
.lg-dl{margin-top:24px;display:grid;grid-template-columns:auto 1fr;gap:0;
  border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card2)}
.lg-dl dt{padding:15px 20px;font:600 12px/1.4 var(--sans);letter-spacing:.1em;
  text-transform:uppercase;color:var(--mut2);border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);background:var(--card)}
.lg-dl dd{padding:15px 20px;color:var(--ink);border-bottom:1px solid var(--line);font-size:15px}
.lg-dl dt:last-of-type,.lg-dl dd:last-of-type{border-bottom:0}
@media(max-width:560px){.lg-dl{grid-template-columns:1fr}
  .lg-dl dt{border-right:0;padding-bottom:4px}
  .lg-dl dd{padding-top:4px}}

/* Cross links between legal pages */
.lg-more{padding:20px 0 70px}
.lg-more .wrap{display:flex;flex-wrap:wrap;gap:10px}
.lg-more a{border:1px solid var(--line);border-radius:999px;padding:9px 17px;font-size:13px;
  color:var(--mut);text-decoration:none;transition:.2s;background:rgba(16,27,44,.4)}
.lg-more a:hover{color:var(--ink);border-color:var(--gold-d)}
.lg-more a[aria-current="page"]{color:#0A1424;
  background:linear-gradient(150deg,#EDF2F9,#C2D3E7 55%,#A2BDD9);border-color:transparent}

/* Shared legal footer (also injected into index.html) */
.lg-foot{border-top:1px solid var(--line);padding:52px 0 40px;color:var(--mut);font-size:13px}
.lg-foot .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:38px}
@media(max-width:760px){.lg-foot .cols{grid-template-columns:1fr;gap:30px}}
.lg-foot h6{font:600 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;
  color:var(--mut2);margin-bottom:16px}
.lg-foot ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.lg-foot a{color:var(--mut);text-decoration:none;transition:color .2s}
.lg-foot a:hover{color:var(--ink)}
.lg-foot .co p{line-height:1.75;color:var(--mut)}
.lg-foot .co b{color:var(--ink);font-weight:600}
.lg-cookie-open{appearance:none;background:transparent;border:0;color:var(--mut);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:inherit;padding:0;
  text-align:left}
.lg-cookie-open:hover{color:var(--ink)}
.lg-foot .bar{border-top:1px solid var(--line);padding-top:26px;display:flex;
  justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:12.5px;color:var(--mut2)}

:focus-visible{outline:2px solid var(--aqua);outline-offset:2px;border-radius:4px}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
