/* ── Bureautabel (gedeeld: homepage + overzicht) ───────────────── */
/* Geen rangkolom en geen sorteerknoppen meer: de tabel zet feiten naast
   elkaar en drukt geen volgorde-als-oordeel uit. */
.rankTableWrap{border:1px solid var(--border-color-1);border-radius:var(--radius-card);background:#fff;box-shadow:var(--shadow-card);margin-top:8px;overflow:hidden}
.rankTable{width:100%;border-collapse:collapse;font-size:15px}
.rankTable th,.rankTable td{padding:16px 14px;text-align:left;vertical-align:middle}

.rankTable thead th{background:var(--background-alt-1);border-bottom:1px solid var(--border-color-1);font-size:12px;font-weight:700;color:var(--font-color-dark);line-height:1.35;vertical-align:bottom}

.rankTable tbody tr{border-bottom:1px solid var(--border-color-2);transition:var(--transition)}
.rankTable tbody tr:last-child{border-bottom:0}
.rankTable tbody tr:hover{background:var(--background-alt-1)}
.rankTableName{font-weight:700;color:var(--font-color-dark)}
.rankTableName a:hover{color:var(--color-indigo)}
.rankTableBest{color:var(--font-color);font-size:14px}
.rankTableLeeg{color:var(--font-color);opacity:.7;font-style:italic}
.rankTablePartial{display:inline-block;margin-left:8px;padding:2px 7px;border-radius:999px;background:var(--background-alt-1);border:1px solid var(--border-color-1);font-size:11px;font-weight:600;color:var(--font-color);white-space:nowrap}

.rankTableNote{margin-top:16px;font-size:14px;color:var(--font-color);line-height:1.6}
.rankTableNote a{color:var(--color-indigo);text-decoration:underline}

/* ── Gestapelde weergave ───────────────────────────────────────── */
/* Onder deze breedte past het raster niet meer, dus wordt elk bureau een
   eigen kaart in plaats van een horizontale schuifbalk. */
@media (max-width:1100px){
    .rankTableWrap{border:0;background:none;box-shadow:none;border-radius:0;overflow:visible}
    .rankTable,.rankTable tbody,.rankTable tr,.rankTable td,.rankTable th{display:block;width:auto}
    .rankTable thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

    .rankTable tbody tr{position:relative;padding:22px 24px 18px;margin-bottom:16px;border:1px solid var(--border-color-1);border-radius:var(--radius-card);background:#fff;box-shadow:var(--shadow-card)}
    .rankTable tbody tr:last-child{margin-bottom:0}
    .rankTable tbody tr:hover{background:#fff}
    .rankTable tbody td,.rankTable tbody th{padding:0}

    .rankTableName{font-size:19px;margin-bottom:14px}

    .rankTable tbody td[data-label]{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 0;border-top:1px solid var(--border-color-2);font-size:14px}
    .rankTable tbody td[data-label]::before{content:attr(data-label);font-weight:600;color:var(--font-color)}
    .rankTableBest{text-align:right}
}

@media (max-width:480px){
    .rankTable tbody tr{padding:20px 18px 16px}
    .rankTable tbody td[data-label]{flex-direction:column;align-items:flex-start;gap:4px}
    .rankTableBest{text-align:left}
}
