/* Voor wie het werkt — overzicht en klantpagina's */
.sterren{position:relative;height:clamp(430px,54vw,640px);margin-top:44px;overflow:hidden;
  background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(74,31,184,.28),transparent 72%),var(--glas)}
.sterren-lijnen{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.sterren-lijnen line{stroke:rgba(143,107,255,.13);stroke-width:1;transition:stroke .5s}
.sterren-lijnen line.is-aan{stroke:rgba(205,191,255,.6)}
.sterren-lijnen circle{fill:var(--oranje);filter:drop-shadow(0 0 5px var(--oranje))}
.ster{position:absolute;left:0;top:0;display:flex;align-items:center;gap:9px;margin:-6px 0 0 -6px;white-space:nowrap;font-size:.8rem;font-weight:600;color:var(--tekst-dof);will-change:transform;z-index:1}
.ster i{width:12px;height:12px;border-radius:50%;background:#4a4068;flex:none;transition:background .4s,box-shadow .4s,transform .4s var(--zacht)}
.ster span{display:flex;flex-direction:column;line-height:1.2;opacity:.55;transition:opacity .35s,color .35s}
.ster small{font:500 .62rem var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--tekst-dof)}
.ster.is-actief,.ster:hover,.ster:focus-visible{color:var(--tekst);z-index:3}
.ster.is-actief span,.ster:hover span{opacity:1}
.ster.is-actief i,.ster:hover i{background:var(--lila);box-shadow:0 0 0 5px rgba(143,107,255,.18),0 0 18px var(--paars-licht);transform:scale(1.15)}
.ster.is-focus{color:var(--tekst);z-index:4}.ster.is-focus span{opacity:1;font-size:1.05em}
.ster.is-focus i{background:var(--oranje);box-shadow:0 0 0 6px rgba(255,122,26,.18),0 0 24px var(--oranje);transform:scale(1.35)}
.sterren.is-smal .ster span{display:none}
.sterren.is-smal .ster.toon span,.sterren.is-smal .ster.is-actief span{display:flex;font-size:.72rem;background:rgba(4,1,12,.8);padding:2px 6px;border-radius:6px}
.sterren.is-smal .ster::after{content:"";position:absolute;inset:-12px}

/* overzicht */
.klant-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:14px;align-items:end;padding:20px 22px;margin-top:14px}
.klant-filters .filters-telling{grid-column:1/-1}
@media (max-width:1100px){.klant-filters{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:520px){.klant-filters{grid-template-columns:1fr}}
#klantRooster{margin-top:14px;transition:opacity .35s,filter .35s}
#klantRooster.is-filteren{opacity:.25;filter:blur(6px);pointer-events:none}
.klanttegel .logo{font-size:1.1rem;color:var(--tekst);filter:none}
.klanttegel .logo svg{width:24px;height:24px}
.klanttegel p{flex:1}

/* klantpagina */
.klant-merk{font-size:1.25rem;margin-bottom:26px;color:var(--lila);filter:none}
.klant-merk svg{width:34px;height:34px}
.klant-kop{font-size:clamp(2.3rem,6.4vw,5rem)!important;max-width:16ch!important}
.klant-rooster{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,340px);gap:clamp(24px,5vw,70px);align-items:start}
.klant-alinea{font-size:clamp(1.08rem,1.7vw,1.3rem);line-height:1.6;color:var(--tekst-zacht);max-width:60ch}
.klant-citaat{margin:36px 0 0;padding:30px;display:grid;grid-template-columns:auto 1fr;gap:6px 22px;align-items:start}
.klant-citaat .portret{width:72px;height:72px;border-radius:50%;border:1px solid var(--glas-rand);grid-row:span 2}
.klant-citaat blockquote{margin:0;font-size:clamp(1.15rem,2.1vw,1.55rem);line-height:1.45;letter-spacing:-.015em;color:var(--lila)}
.klant-citaat figcaption{color:var(--tekst-zacht);font-size:.9rem}
.klant-citaat figcaption b{display:block;color:var(--tekst)}
.klant-feiten{position:sticky;top:100px}
.klant-feiten dl{display:grid;grid-template-columns:auto 1fr;gap:12px 18px;margin:8px 0 0;font-size:.95rem}
.klant-feiten dt{color:var(--tekst-dof)}.klant-feiten dd{margin:0;text-align:right;color:var(--tekst);font-variant-numeric:tabular-nums}
.klant-feiten dd a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}
.klant-feiten .statuslamp{margin-right:6px}
.klant-verder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.klant-begin{border-color:rgba(255,122,26,.4)}
@media (max-width:860px){.klant-rooster{grid-template-columns:1fr}.klant-feiten{position:static}.klant-verder{grid-template-columns:1fr}.klant-citaat{grid-template-columns:1fr}.klant-citaat .portret{grid-row:auto}}

.klant-filters select{min-width:0;width:100%}