/* Voor locaties — alleen wat op deze pagina staat, één op één uit voor-locaties.html (referentie).
   Gedeeld: home.css (componenten, ook de fases) en subpage.css (subpagina's: vraagkaarten, donkere kaarten, mini-velden, planningsregels). */
.hp{overflow-x:clip}
.bar{flex:1;border-radius:6px 6px 3px 3px;background:#2C1722}
.bar--low{background:#E6A88E}
.bar__l{flex:1;text-align:center}

/* Mobiel (< 768 px) — alleen deze pagina, één op één uit voor-locaties-mobiel.html. Gedeeld: mobile.css */
@media (max-width:767px){
.bar{flex:1;border-radius:6px 6px 3px 3px;background:#2C1722}
.bar--low{background:#E6A88E}
.bar__l{flex:1;text-align:center}
/* .qcard.scard: wint van de gedeelde swipe-kaart (mobile.css laadt later), net als in de referentie */
.qcard,.qcard.scard{display:flex;flex-direction:column;gap:10px;min-height:140px;padding:20px;border-radius:18px;background:#F8F2EC;border:1px solid #E6D6C6;width:250px}
.qcard__ex{margin:auto 0 0;padding-top:12px;border-top:1px solid #E6D6C6;font-size:14px;color:#6B5560}
.tile-m{display:flex;flex-direction:column;gap:12px;padding:16px 14px;border-radius:16px;background:#F8F2EC;border:1px solid #EFE6DA;min-height:100px}
.tile-m__ico{width:38px;height:38px;border-radius:11px;background:#FFFFFF;display:flex;align-items:center;justify-content:center}
}