/* Mobiele variant (18-10-2026): alleen telefoonformaat, desktop blijft gelijk. */
/* regelbreuk die alleen op telefoon geldt */
.br-mob { display: none; }

@media (max-width: 640px) {
  .br-mob { display: inline; }

  /* Homepage · werkwijze: kaartenstapel met pijlen weg */
  #werkwijze .dr-beeld { display: none; }
  #werkwijze .dr-grid { gap: 32px; }

  /* Footer onderkant: links onder elkaar, daaronder KVK en copyright op één regel */
  .ft-bot { display: grid; grid-template-columns: 1fr auto; gap: 24px 16px; align-items: baseline; }
  .ft-bot p:nth-child(2) { order: -1; grid-column: 1 / -1; flex-direction: column; align-items: flex-start; gap: 0; font-size: 16px; line-height: 1.8; color: var(--wit); }
  .ft-bot p:first-child, .ft-bot p:last-child { font-size: 13px; color: rgba(255, 255, 255, .6); }

  /* Diensten en prijzen · jaartabel: het verschil staat onder het Werfpartner-bedrag, zodat duidelijk is dat Werfpartner
     goedkoper of duurder is (stond onder Werfcampagne) */
  .tabel tbody td:last-child { grid-column: 3; }
  .tabel tbody .verschil { line-height: 1.35; }

  /* Hoe we werven · de stappen (Online t/m Gestart) krijgen meer lucht boven en onder */
  .st { padding-top: 56px; padding-bottom: 56px; }
}

/* Over ons · teamkaarten onder elkaar (tot 480px, zelfde grens als site.css): foto weer bovenaan, lager bijgesneden (4:3) */
@media (max-width: 480px) {
  .team-rij .foto, .team-rij .baan { order: 0; margin: 0 0 18px; aspect-ratio: 4 / 3; }
  /* portret: uitsnede hoger, zodat het gezicht in het 4:3-vlak valt (overschrijft de inline object-position 50% 70%) */
  /* tekst in de teamkaarten even groot als de lopende tekst elders (18px i.p.v. 16px) */
  .persoon p:not(.persoon-rol) { font-size: 18px; line-height: 1.6; }
  .team-rij .foto img { object-position: 50% 12% !important; }
  /* Flexxcompany-baan past in het lagere vlak: kleinere ring (26 i.p.v. 32cqi) */
  .team-rij .baan { --r: 26cqi; }
  .team-rij .baan .baan-ringen { width: 81.25cqi; height: 81.25cqi; }
  /* tegels en kern naar dezelfde verhouding (x 0,8125), zodat de logo's niet over de kern vallen */
  .team-rij .baan .baan-tegel { width: 22.75cqi; height: 10.5cqi; }
  .team-rij .baan .baan-tegel img { height: 4.2cqi; }
  .team-rij .baan .baan-kern { width: 32.5cqi; gap: 1.3cqi; }
  .team-rij .baan .baan-kern b { font-size: 5.85cqi; }
  .team-rij .baan .baan-kern small { font-size: 4.06cqi; }
}
