/* Gidspagina's (/etf/, /vergelijk/, /aandeel/) — gegenereerd door
   scripts/build-gids.js. Bouwt voort op de tokens in app.css. */
.gids{ max-width:960px; margin:0 auto; padding:24px 16px 56px; }
.gids a{ color:var(--accent-ink); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .gids a{ color:var(--accent); } }
:root[data-theme="dark"] .gids a{ color:var(--accent); }

.gids-nav{ gap:18px; flex-wrap:wrap; font-size:15px; }
.gids-crumbs{ font-size:13px; color:var(--ink-dim); margin-bottom:14px; }
.gids-crumbs a{ color:var(--ink-dim) !important; text-decoration:none; }
.gids-crumbs a:hover{ text-decoration:underline; }

.gids-head{ margin-bottom:22px; }
.gids-head h1{ font-size:clamp(28px, 4.4vw, 40px); line-height:1.15; }
.gids-head h1::before{ content:""; display:block; width:36px; height:3px; border-radius:2px; background:var(--accent); margin-bottom:16px; }
.gids-lead{ color:var(--ink-dim); margin:0; font-size:15px; overflow-wrap:anywhere; }

.gids-sec{ background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:22px; margin-bottom:18px; min-width:0; }
.gids-sec h2{ font-size:21px; }
.gids-sec h3{ font-family:'Inter', system-ui, sans-serif; font-size:14px; font-weight:600; margin:0 0 8px; }
.gids-sec .sub{ color:var(--ink-dim); font-size:13.5px; margin:-4px 0 14px; }
.gids-two{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.gids-two > .gids-sec{ margin-bottom:18px; }
.gids-summary{ font-size:16px; line-height:1.65; margin:0 0 20px; max-width:72ch; }
.gids-note{ font-size:12.5px; color:var(--ink-dim); margin:14px 0 0; line-height:1.55; }

.gids-kpis{ display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; margin-bottom:18px; }
.gids-kpis > div{ background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:14px 16px; min-width:0; }
.gids-kpis span{ display:block; font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-dim); }
.gids-kpis b{ display:block; font-size:22px; margin:2px 0; }
.gids-kpis b.isin{ font-size:15px; padding:4px 0 3px; overflow-wrap:anywhere; }
.gids-kpis small{ color:var(--ink-dim); font-size:12px; }

.gids-verdict{ background:var(--navy); color:#eaf1ff; border-radius:18px; padding:24px; margin-bottom:18px; }
.gids-verdict p{ margin:16px 0 0; line-height:1.6; font-size:15.5px; max-width:75ch; }
.gv-nums{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; }
.gv-nums > div{ background:rgba(255,255,255,.06); border-radius:12px; padding:14px; }
.gv-nums b{ display:block; font-size:30px; color:#fff; line-height:1.1; }
.gv-nums span{ display:block; font-size:13px; color:#cfe0ff; margin-top:4px; }
.gv-nums small{ color:#9fb3d6; font-size:11.5px; }

.gtable-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.gtable{ width:100%; border-collapse:collapse; font-size:14px; }
.gtable th, .gtable td{ padding:9px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.gtable thead th{ font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-dim); font-weight:600; }
.gtable tbody tr:last-child td, .gtable tbody tr:last-child th{ border-bottom:0; }
.gtable .r{ text-align:right; white-space:nowrap; }
.gtable td.mono{ white-space:nowrap; }
.gcmp tbody th{ font-weight:500; color:var(--ink-dim); white-space:nowrap; }
.tag{ display:inline-block; font-size:11px; background:var(--accent-soft); color:var(--ink); border-radius:6px; padding:1px 7px; margin-left:4px; }

.gbars{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.gbars li{ display:grid; grid-template-columns:minmax(90px, 38%) 1fr auto; gap:10px; align-items:center; font-size:13.5px; }
.gbars .bl{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gbars .bt{ height:8px; border-radius:4px; background:var(--surface-2); overflow:hidden; }
.gbars .bt i{ display:block; height:100%; background:var(--accent); border-radius:4px; }
.gbars .bv{ min-width:52px; text-align:right; }
.gbars li.muted{ color:var(--ink-dim); }
.gbars li.muted .bt i{ background:var(--line); }

.gonly{ margin-top:16px; }
.gonly ul{ list-style:none; margin:0; padding:0; font-size:14px; }
.gonly li{ padding:4px 0; display:flex; justify-content:space-between; gap:8px; }
.gonly li .mono{ color:var(--ink-dim); }

.glinks{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.glinks a{ display:inline-block; text-decoration:none; border:1px solid var(--line); border-radius:999px; padding:6px 14px; font-size:13.5px; color:var(--ink) !important; background:var(--surface); }
.glinks a:hover{ border-color:var(--accent); }

.gids-cta{
  display:flex; align-items:center; justify-content:space-between; gap:16px 24px; flex-wrap:wrap;
  background:var(--accent-soft); border:1px solid var(--accent); border-radius:16px; padding:20px 22px; margin:6px 0 18px;
}
.gids-cta > div{ flex:1 1 320px; }
.gids-cta strong{ display:block; font-size:17px; margin-bottom:4px; }
.gids-cta span{ color:var(--ink-dim); font-size:14px; }
.gids-cta .sample-cta{ color:#fff !important; white-space:nowrap; }

.gfaq details{ border-bottom:1px solid var(--line); }
.gfaq details:first-child{ border-top:1px solid var(--line); }
.gfaq summary{ cursor:pointer; padding:14px 2px; font-weight:600; font-size:14.5px; list-style:none; display:flex; justify-content:space-between; gap:12px; }
.gfaq summary::-webkit-details-marker{ display:none; }
.gfaq summary::after{ content:"+"; color:var(--ink-dim); font-family:'IBM Plex Mono'; }
.gfaq details[open] summary::after{ content:"–"; }
.gfaq p{ margin:0 2px 16px; color:var(--ink-dim); font-size:14px; line-height:1.6; max-width:72ch; }

.gids-footlinks{ margin:0 0 14px; }
.gids-footlinks a{ color:var(--ink-dim); }

@media (max-width:760px){
  .gids-two{ grid-template-columns:1fr; gap:0; }
  .gids-kpis{ grid-template-columns:1fr 1fr; }
  .gv-nums{ grid-template-columns:1fr; }
  .gv-nums > div{ display:flex; align-items:baseline; gap:12px; }
  .gv-nums b{ font-size:24px; min-width:84px; }
  .gv-nums span{ margin-top:0; }
  .gids-sec{ padding:16px; }
  .gtable{ font-size:13px; }
  .gtable th, .gtable td{ padding:8px 6px; }
}
