/* =========================================================
   Vloerpaneel.nl — design tokens (Atelier, 1:1 uit tokens.css van douchekraan/…/paardenshampoo/rondvloerkleed)
   Palet uit het logo (15 sept 2026, Higgsfield GPT Image 2.5): drie verspringende vloerplanken in een afgeronde tegel,
   subtiel verloop van leisteenblauw #5f939b naar petrol #2b5560, woordmerk in inkt #1c2a30, ".nl" in petrol.
   - Inkt/knoppen #1c2a30: het woordmerk; 14.76:1 met witte tekst.
   - Accent #2b5a64 is petrol uit het verloop. Bewust donker: het is tegelijk achtergrond met witte tekst (.dk-badge--best)
     en tekstkleur van labels van 10,5-13px. Berekend 7.64:1 op wit, 6.62:1 op --c-panel en
     5.94:1 op --c-panel-dark. Leisteenblauw #5f939b haalt op wit maar 3.42:1: decoratief, nooit kleine tekst.
   - Paneeltint: koel grijsblauw #e9f0f1; --c-panel-text #25363d haalt 10.87:1.
   - --c-meta #52636a haalt 5.43:1 op het paneel en 4.88:1 op het donkere paneel; --c-text-3 #3d4f56 6.67:1 op het donkerste vlak.
   Koppen Manrope, tekst Instrument Sans (portfoliostandaard).
   ========================================================= */
:root {
  --c-ink: #1c2a30; --c-ink-hover: #2a3c43; --c-paper: #f7f9f9; --c-white: #ffffff; --c-input: #edf2f3;
  /* paneeltint vloerpaneel.nl (muntwit) */
  --c-panel: #e9f0f1; --c-panel-dark: #dae5e7; --c-panel-light: #f4f8f8; --c-panel-text: #25363d; --c-panel-ink: #1c2a30; --c-panel-avatar: #cddcdf;
  --c-text: #172327; --c-text-prose: #223036; --c-text-2: #36474e; --c-text-3: #3d4f56; --c-meta: #52636a; --c-meta-2: #6a7b82;
  --c-line: rgba(28,42,48,.08); --c-line-2: rgba(28,42,48,.10); --c-line-input: rgba(28,42,48,.14); --c-check: #c9d7da;
  --c-accent: #2b5a64; --c-success: #2b744b; --c-warning: #a86f0b; --c-error: #b93a2b; --c-error-bg: #fff6f4;
  --f-head: 'Manrope', sans-serif; --f-body: 'Instrument Sans', system-ui, sans-serif; --f-mono: ui-monospace, Menlo, monospace;
  --fs-h1: 60px; --lh-h1: 1.0; --ls-h1: -.035em; --fs-h1-page: 46px; --lh-h1-page: 1.05; --fs-h1-long: 54px; --lh-h1-long: 1.02;
  --fs-h2: 34px; --lh-h2: 1.1; --ls-h2: -.03em; --fs-h2-sm: 28px; --fs-h3: 22px; --ls-h3: -.02em;
  --fs-card-title: 17px; --fs-card-title-lg: 19px; --fs-body: 15px; --lh-body: 1.5; --fs-prose: 16.5px; --lh-prose: 1.65; --fs-intro: 17px; --lh-intro: 1.55;
  --fs-meta: 13px; --fs-label: 12.5px; --ls-label: .08em; --fs-price: 24px; --fs-price-lg: 40px; --fs-price-sm: 18px; --fs-score: 14px; --fs-score-lg: 20px; --fs-score-xl: 30px;
  --pad-x: 48px; --pad-x-m: 20px; --sec: 64px; --sec-m: 40px; --gap: 20px; --gap-m: 12px; --card-pad: 14px; --card-pad-text: 18px; --panel-pad: 56px; --panel-pad-m: 20px;
  --w-container: 1440px; --w-read: 760px; --w-sidebar: 340px; --w-filters: 272px; --w-gallery: 600px; --w-mobile: 390px;
  --r-panel: 28px; --r-card: 22px; --r-card-sm: 20px; --r-img: 16px; --r-md: 14px; --r-sm: 10px; --r-xs: 8px; --r-pill: 999px;
  --sh-float: 0 12px 32px rgba(28,42,48,.08); --sh-pop: 0 18px 44px rgba(28,42,48,.16); --sh-soft: 0 12px 32px rgba(28,42,48,.10); --sh-search: 0 8px 24px rgba(28,42,48,.08); --sh-sticky: 0 14px 36px rgba(0,0,0,.18); --sh-dark: 0 12px 32px rgba(0,0,0,.28); --sh-btn-hover: 0 8px 20px rgba(0,0,0,.18);
  --btn-h-hero: 54px; --btn-h: 48px; --btn-h-list: 46px; --btn-h-table: 42px; --btn-h-sm: 40px; --input-h: 50px; --chip-pad: 7px 14px; --check: 18px; --tap-min: 44px;
}
@media (max-width: 767px) {
  :root { --fs-h1: 32px; --lh-h1: 1.02; --ls-h1: -.03em; --fs-h1-page: 30px; --fs-h1-long: 30px; --fs-h2: 27px; --fs-h2-sm: 24px; --fs-h3: 19px; --fs-body: 16px; --fs-prose: 15.5px; --lh-prose: 1.6; --fs-intro: 15px; --fs-price: 18px; --fs-price-lg: 36px; --pad-x: var(--pad-x-m); --sec: var(--sec-m); --gap: var(--gap-m); --r-panel: 26px; --r-card: 18px; --r-img: 12px; }
}
@media (min-width: 768px) and (max-width: 1199px) { :root { --pad-x: 32px; --w-sidebar: 300px; } }
