/* Partnerpagina (W31). Alles wat kan, komt uit assets/styles.css; hier staat
   alleen wat partner-worden.html en en/partners.html nodig hebben: het raster
   met vier voordelen, de twee modellen, het rekenvoorbeeld en het slotblok.
   Laadt ná styles.css en gebruikt alleen de tokens uit :root; er komt geen
   kleur bij.

   De keuzeknoppen, het uitvouwbare aanmeldformulier en de vervolgstap stonden
   hier ook, zolang de aanmelding de sectie #kennismaking onder aan deze pagina
   was. Sinds P15 (9 sep 2026) is dat een eigen pagina
   (partner-worden-contact.html) met een eigen blok in styles.css, dus die
   regels zijn hier weg. */

/* Vier voordelen: vier kolommen, twee op tablet en telefoon, één op heel smal.
   styles.css zet .grid--4 op 640px al op één kolom; hier blijven het er twee
   tot 480px, anders wordt de rij kaarten op een telefoon onnodig lang. */
.partner-benefits { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 980px) { .partner-benefits { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .partner-benefits { grid-template-columns: 1fr; } }

/* De herhaalde knop onder een blok, en de uitleg onder de drie stappen. */
.partner-cta { margin-top: 32px; }
.partner-models { margin-top: 32px; }
.partner-example { margin-top: 56px; }
.partner-example .section-head { margin-bottom: 32px; }


/* Slotblok vóór de footer: één kader, gecentreerd, op het zachte vlak. */
.cta-box {
  max-width: 760px; margin: 0 auto; padding: 40px;
  border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--canvas);
  text-align: center;
}
.cta-box .h-section { margin-bottom: 12px; }
.cta-box .lead { max-width: 520px; margin: 0 auto 26px; }
@media (max-width: 520px) { .cta-box { padding: 40px 20px; } }