/* Contact met Daan: huisstijl videologic.nl (zwart, wit, rood #c41e3a, Poppins) */
.cmd { background: #fff; padding: 48px 16px 70px; font-family: 'Poppins', sans-serif; color: #1a1a1a; }
.cmd * { box-sizing: border-box; }
.cmd-kaart { max-width: 560px; margin: 0 auto; text-align: center; }
.cmd-avatar { width: 130px; height: 130px; border-radius: 50%; overflow: hidden; margin: 0 auto 16px; background: #f2f2f2; display: flex; align-items: center; justify-content: center; border: 4px solid #fff; box-shadow: 0 0 0 3px #c41e3a; }
.cmd-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cmd-avatar span { font-size: 48px; font-weight: 700; color: #3c3c3c; }
.cmd-naam { margin: 0; font-size: 28px; font-weight: 700; color: #1a1a1a; }
.cmd-functie { margin: 4px 0 0; color: #757575; }
.cmd-bio { margin: 16px 0 0; color: #3c3c3c; line-height: 1.6; }
.cmd-knop { display: flex; align-items: center; gap: 14px; text-decoration: none; border-radius: 8px; padding: 14px 16px; text-align: left; font-weight: 600; transition: transform .15s, box-shadow .15s, background .15s; }
.cmd-knop:hover { transform: translateY(-2px); text-decoration: none; }
.cmd-titel { flex: 1; }
.cmd-pijl { color: #c41e3a; font-weight: 700; }
.cmd-icoon { width: 38px; height: 38px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex: none; }
.cmd-primair { background: #c41e3a; color: #fff; margin-top: 24px; padding: 16px; }
.cmd-primair:hover { background: #a3182f; color: #fff; box-shadow: 0 8px 20px rgba(196, 30, 58, .3); }
.cmd-primair .cmd-pijl { color: #fff; }
.cmd-primair .cmd-icoon { background: rgba(255, 255, 255, .18); color: #fff; }
.cmd-hint { font-size: 13px; color: #757575; margin: 10px 0 22px; }
.cmd-chips { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-bottom: 28px; }
.cmd-chip { background: #f2f2f2; color: #1a1a1a; border-radius: 99px; padding: 9px 16px; font-size: 14px; text-decoration: none; }
.cmd-chip:hover { background: #e6e6e6; color: #1a1a1a; text-decoration: none; }
.cmd-links { display: flex; flex-direction: column; gap: 10px; }
.cmd-link { background: #fff; color: #1a1a1a; border: 1px solid #e3e3e3; }
.cmd-link:hover { color: #1a1a1a; border-color: #c41e3a; box-shadow: 0 6px 16px rgba(0, 0, 0, .08); }
.cmd-link .cmd-icoon { background: #3c3c3c; color: #fff; }
.cmd-gereedschap { display: flex; gap: 10px; justify-content: center; margin-top: 28px; }
.cmd-klein { font: inherit; font-size: 14px; background: #fff; color: #3c3c3c; border: 1px solid #e3e3e3; border-radius: 99px; padding: 8px 18px; cursor: pointer; text-decoration: none; display: inline-block; }
.cmd-klein:hover { border-color: #c41e3a; color: #c41e3a; text-decoration: none; }
.cmd-modal[hidden] { display: none; }
.cmd-modal { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 16px; font-family: 'Poppins', sans-serif; }
.cmd-modal-achtergrond { position: absolute; inset: 0; background: rgba(0, 0, 0, .65); }
.cmd-modal-kaart { position: relative; background: #fff; color: #1a1a1a; border-radius: 12px; padding: 24px; text-align: center; max-width: 340px; width: 100%; }
.cmd-modal-kaart h2 { margin: 0 0 12px; font-size: 22px; color: #1a1a1a; }
.cmd-modal-kaart img { max-width: 100%; height: auto; }
.cmd-url { font-size: 13px; color: #757575; word-break: break-all; margin: 8px 0 14px; }
.cmd-modal-knoppen { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 480px) { .cmd { padding-top: 32px; } .cmd-naam { font-size: 24px; } }
