/* ==========================================================================
   H2 · rc — Recensieband  (was: "belofte-band")
   v1.0 · 2026-08-31 · Natuurlijk Gezonder
   --------------------------------------------------------------------------
   Prefix: rc-. Gebruikt uitsluitend tokens uit 00-tokens.css.
   Homepage, direct ná de hero. Geen JavaScript.

   WAAROM DIT GEEN BELOFTE-BAND MEER IS
   Het containerplan had hier een muntgroene band met "Ervaar" en "De rust
   die je verdient" — vijf woorden, overgenomen uit de Wix-site. Die band
   is geschreven toen de hero nog een kale foto met een kop was. Inmiddels
   draagt de hero een lead, twee knoppen én een feitenkaart met drie
   feiten (zes accommodaties · privé wellnesstuin · gratis parkeren). Een
   stemmingszin daar direct onder herhaalt de toon die er al staat en
   vertraagt de weg naar de kamerstrook.

   WAT DE PLEK WÉL VERDIENT
   De site heeft nul sociale bewijskracht. Geen cijfer, geen citaat, geen
   sterren — gecontroleerd over de hele inventarisatie en alle drie de
   taalversies: nul treffers. En de pagina vraagt bezoekers om rechtstreeks
   te boeken in plaats van via Booking, wat de zwaarste vraag van de hele
   homepage is. Precies dáár hoort het bewijs, en de plek direct onder de
   hero is de klassieke plaats ervoor.

   De inhoud is nog ⟦plaatshouder⟧: ik verzin geen recensies. Zie de README.
   ========================================================================== */

/* Een band, geen sectie: de verticale ruimte is kleiner dan `--ng-sectie-y`,
   want dit is een adempauze tussen de hero en de kamerstrook en geen
   hoofdstuk op zichzelf. */
.rc {
  padding: var(--ng-s-6) 0;
  background: var(--ng-munt-050);
}

.rc__raster { display: grid; gap: var(--ng-s-5); }
@media (min-width: 62rem) {
  .rc__raster {
    grid-template-columns: auto 1fr;
    gap: var(--ng-s-8);
    align-items: center;
  }
}

/* --------------------------------------------------------------------------
   De cijfers

   Twee platformen naast elkaar en géén samengesteld gemiddelde: Booking
   telt van 1 tot 10 en Airbnb van 1 tot 5. Die twee middelen tot één getal
   levert een cijfer op dat nergens bestaat en dat niemand kan narekenen.
   Twee cijfers met hun eigen schaal erbij is korter én waar.
   -------------------------------------------------------------------------- */

.rc__cijfers {
  display: flex;
  gap: var(--ng-s-6);
  margin: 0;
  padding: 0;
  list-style: none;
}

.rc__cijfer { white-space: nowrap; }

.rc__score {
  display: block;
  font-family: var(--ng-font-display);
  font-weight: var(--ng-w-medium);
  font-size: var(--ng-t-h2);
  line-height: 1;
  color: var(--ng-kop);
}
/* De kleine tekst staat op de vólle tekstkleur en niet op `--ng-tekst-zacht`.
   Op de muntgrond geeft die zachte kleur 4,67:1 — binnen AA, maar de
   krapste waarde van de band, en dat op 12 tot 14 px. De hiërarchie zit
   hier al in de grootte en het lettertype; daar is een lichtere kleur niet
   ook nog voor nodig. Hetzelfde besluit als bij de kolomkoppen van de
   vergelijktabel (`A0`).

   Het grote cijfer zelf houdt `--ng-kop`: 4,67:1 op 40 px is grote tekst,
   en daarvoor is de AA-drempel 3:1. */
.rc__score small {
  font-family: var(--ng-font-tekst);
  font-size: var(--ng-t-klein);
  font-weight: var(--ng-w-normaal);
  color: var(--ng-tekst);
}
.rc__bron {
  display: block;
  margin-top: var(--ng-s-1);
  font-size: var(--ng-t-micro);
  line-height: var(--ng-lh-klein);
  color: var(--ng-tekst);
}

/* --------------------------------------------------------------------------
   De citaten

   Twee, niet drie. Een band die drie citaten draagt is geen band meer.
   -------------------------------------------------------------------------- */

.rc__quotes {
  display: grid;
  gap: var(--ng-s-4);
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 48rem) {
  .rc__quotes { grid-template-columns: 1fr 1fr; gap: var(--ng-s-6); }
}

.rc__quote { margin: 0; padding-left: var(--ng-s-4); border-left: 2px solid var(--ng-munt-200); }

.rc__quote blockquote {
  margin: 0 0 var(--ng-s-2);
  font-size: var(--ng-t-body);
  line-height: var(--ng-lh-body);
  color: var(--ng-tekst);
}
.rc__quote cite {
  display: block;
  font-size: var(--ng-t-micro);
  font-style: normal;
  color: var(--ng-tekst);   /* zie de noot bij `.rc__score small` */
}

/* --------------------------------------------------------------------------
   Zonder cijfers

   Zijn er (nog) geen platformcijfers, dan draait de band op citaten
   alleen: laat `.rc__cijfers` weg en de kolom verdwijnt vanzelf, want het
   raster is `auto 1fr`. Er is geen aparte variant voor nodig.
   -------------------------------------------------------------------------- */


/* ==========================================================================
   R3 · 2026-10-01 · wijziging uit het goedgekeurde R2-prototype
   (prototype/r2/r2.css, blok 2), ongewijzigd overgenomen. Staat achteraan,
   zodat het net als in het prototype ná de regels hierboven telt.
   ========================================================================== */

/* --------------------------------------------------------------------------
   2 · rc — recensieband · WIJZIGING op A2-rc-recensieband.css
   Alleen de grond: munt is in R2 de praktische kleur en hoort bij één
   sectie. Onder een zandvlak zou een muntband bovendien twee pastels tegen
   elkaar zetten.
   -------------------------------------------------------------------------- */

.rc { background: var(--ng-grond); padding: var(--ng-s-7) 0 0; }