/* Specialisten — kleine aanvullingen op css/styles.css (enkel tokens) */

/* Kaartje "Zo maakt u een afspraak" in de paginakop */
.spec-howto { gap: 0; padding: clamp(24px, 1.2rem + 1.2vw, 36px); }
.spec-howto .faces { margin-bottom: 1.25rem; }
.spec-howto .card__title-lg { margin-bottom: 1.25rem; }
.spec-howto .facts-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.spec-howto .info-card__phone { margin-top: 2px; }
.spec-howto .status { margin-top: 4px; font-size: 1.0625rem; color: var(--ink); }
/* status breekt op de gsm over twee regels: bolletje bij de eerste regel houden */
.spec-howto .status { align-items: flex-start; }
.spec-howto .status::before { margin-top: .35em; }
.spec-howto .small { margin-top: 4px; }

/* Cardiologie: Hartcentrum (logo + gegevens) naast de route */
.spec-org { gap: 1rem; }
.spec-org__logo { width: 200px; height: auto; margin: -8px 0 4px -12px; }
.spec-org__facts { width: 100%; margin: .5rem 0 .75rem; }
.spec-org .btn-row { margin-top: auto; }
.spec-route .steps { margin: 1.25rem 0 1.5rem; border-color: rgb(122 79 0 / .18); }
.spec-route .step { grid-template-columns: clamp(52px, 2vw + 40px, 80px) minmax(0, 1fr); padding: 22px 0; border-color: rgb(122 79 0 / .18); }
.spec-route .step__num { font-size: clamp(2.25rem, 1.8rem + 1.2vw, 3rem); color: #7a4f00; }
.spec-route .step p { padding-top: .45rem; color: var(--ink); font-size: clamp(1.1875rem, 1.1rem + .3vw, 1.3125rem); line-height: 1.45; }
@media (min-width: 1024px) {
  /* styles.css laat .notice op brede schermen over de volle rasterbreedte lopen (startpagina) */
  .split > .spec-route { grid-column: auto; padding: clamp(28px, 1.5rem + 1vw, 40px); }
}
/* Kaart en route naast elkaar pas vanaf 1280px, dan even hoog; smaller wordt de kaart veel hoger
   dan de route en ontstaat er een gat: dan onder elkaar, over de volle breedte. */
.spec-org > p { max-width: 44rem; }
/* (enkel vanaf 1024px: een max-width op het auto-fit-raster maakt het op de gsm te breed) */
@media (min-width: 1024px) { .spec-org__facts { max-width: 44rem; } }
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .split.spec-cardio { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1280px) {
  .split.spec-cardio { align-items: stretch; }
  /* met grotere tekst wordt het verschil in hoogte te groot: ook dan onder elkaar */
  html[data-textsize] .split.spec-cardio { grid-template-columns: minmax(0, 1fr); }
}

/* Rijen met fijne lijnen in één kolom (naast een inleiding) */
.tasks.spec-rows { grid-template-columns: minmax(0, 1fr); }

.profile__meta strong { font-weight: 600; color: var(--ink); }


/* Namen nooit automatisch afbreken (enkel op de zachte koppeltekens in lange achternamen) */
main .profile__name { hyphens: manual; }
.spec-org__facts a { display: inline-flex; align-items: center; min-height: 44px; }
.more__body p + ul { margin-top: .6rem; }
.more__body ul + p { margin-top: .9rem; }

/* Paginakop: tekst, duidelijke keuze van het specialisme en de cardiologie-mededeling */
.spec-hero { max-width: 52rem; }
.spec-hero .page-hero__lead { max-width: 44rem; }
.spec-pick { margin-top: clamp(2rem, 1.2rem + 2.5vw, 3.25rem); }
.spec-pick__title { font-size: clamp(1.5rem, 1.25rem + .9vw, 2rem); font-weight: 400; letter-spacing: -.015em; line-height: 1.15; margin-bottom: 1.1rem; }
.spec-cardio-note { margin-top: clamp(1.5rem, 1rem + 1.5vw, 2.25rem); }
.spec-cardio-note .notice__title { font-size: clamp(1.3125rem, 1.15rem + .5vw, 1.5rem); }
.spec-cardio-note p { font-size: 1.1875rem; }
.spec-cardio-note__phone { font-size: clamp(1.375rem, 1.2rem + .6vw, 1.75rem); font-weight: 500; }

/* Compacte keuzetegels (enkel de naam): 1, 2 of 4 kolommen (acht tegels vullen dan altijd volledige rijen).
   "Neurochirurgie" heeft naast icoon, pijl en marges zo'n 300px per tegel nodig, vandaar 4 kolommen pas vanaf 1360px. */
.spec-pick .choices { grid-template-columns: minmax(0, 1fr); gap: 12px; }
@media (min-width: 680px) { .spec-pick .choices { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1360px) { .spec-pick .choices { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.spec-pick .choice { min-height: 0; padding: 14px 16px; gap: 14px; align-items: center; }
.spec-pick .choice__icon { width: 48px; height: 48px; border-radius: 14px; }
.spec-pick .choice__icon .icon { width: 24px; height: 24px; }
.spec-pick .choice__title { font-size: clamp(1.1875rem, 1.1rem + .3vw, 1.3125rem); }
.spec-pick .choice__arrow { width: 40px; height: 40px; }

/* Compacte specialistenkaarten: nog steeds één per rij, maar veel lager */
.profiles--spec { gap: 14px; }
.profiles--spec .profile--wide { padding: 0; }
.profiles--spec .profile--wide .profile__photo { flex: none; width: clamp(8.5rem, 6rem + 6vw, 12rem); min-height: 0; aspect-ratio: 4 / 5; border-radius: 0; box-shadow: none; align-self: stretch; }
.profiles--spec .profile--wide .profile__body { padding: 18px clamp(18px, 2vw, 28px); gap: .35rem; }
.profiles--spec .profile__name { font-size: clamp(1.375rem, 1.2rem + .5vw, 1.625rem); }
.profiles--spec .profile__role { font-size: 1rem; }
.profiles--spec .profile__bio { font-size: 1.0625rem; line-height: 1.45; }
.profiles--spec .profile__bio p + p { margin-top: .4rem; }
.profiles--spec .profile__meta { font-size: 1rem; gap: 6px; }
.profiles--spec .profile__actions { padding-top: .4rem; }
.profiles--spec .profile__actions .btn { min-height: 2.75rem; padding: .5rem 1.1rem; font-size: 1.0625rem; }
@media (min-width: 1280px) {
  .profiles--spec .profile--wide .profile__body { column-gap: clamp(24px, 3vw, 48px); row-gap: .35rem; }
  .profiles--spec .profile--wide .profile__body > .profile__meta { padding: 2px 0 2px clamp(18px, 1.6vw, 28px); gap: 8px; }
}
@media (max-width: 599.98px) {
  .profiles--spec .profile--wide { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 8px 14px; padding: 14px; }
  .profiles--spec .profile--wide .profile__photo { width: 100%; height: auto; min-height: 0; aspect-ratio: 4 / 5; align-self: start; border-radius: var(--r-md, 14px); }
  .profiles--spec .profile--wide .profile__photo img { position: absolute; inset: 0; width: 100%; height: 100%; }
}

/* Minder witruimte tussen de specialismen */
.section { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
.section.section--first { padding-top: clamp(2rem, 1.25rem + 2.5vw, 3.5rem); }
.section .section-head { margin-bottom: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); }
