/* /prp-voor-mannen/ : page-only rules (blueprint C5, design-v2 B). Everything else comes from site.css. Weights 400/700 only. */

/* Hero: the consult photo (man with the tablet), framed on the man and the tablet; caption chip inside the rounded picture */
.hero--sub .hero__photo .photo-chip{left:14px;bottom:14px}
.hero--sub .hero__photo--consult img{object-position:50% 45%}
@media (min-width:768px){.hero--sub .hero__photo .photo-chip{left:18px;bottom:18px}}
@media (min-width:1024px){.hero--sub .hero__photo--consult img{object-position:42% 50%}}
.inline-cta__photo img{object-position:55% 45%}

/* Split sections: top-aligned variant for text beside a card */
.split--top{align-items:start}
@media (min-width:1024px){.split .section__head{margin-bottom:var(--s-6)}}
.split__text .prose + .facts{margin-top:var(--s-5)}
.split__text .facts + .note{margin-top:var(--s-5)}
.split__media .photo-card picture{display:block;height:100%}
.split__media .photo-card{aspect-ratio:4/3}
.split__media .photo-card img{object-position:50% 40%}

/* 01: the sterile-field note as a tall card beside the prose */
.photo-note--tall{margin-top:0;grid-template-columns:1fr;gap:0;padding:0;overflow:hidden;border-radius:var(--r-lg)}
.photo-note--tall img{width:100%;height:auto;aspect-ratio:16/10;border-radius:0}
.photo-note--tall > div{padding:20px 22px}
.photo-note--tall b{font-size:1.05rem;margin-bottom:6px}
.photo-note--tall span{font-size:.92rem}
@media (min-width:1024px){.photo-note--tall img{aspect-ratio:4/3}}

/* 02: timeline below the split */
#kruin .section__body{margin-top:var(--s-7)}
@media (min-width:1024px){#kruin .section__body{margin-top:var(--s-8)}}

/* 03: clinic card with the numbers and the team cut-out, the comparison table below */
.kliniek-card{position:relative;background:var(--c-mint);border:1px solid var(--c-teal-soft);border-radius:var(--r-lg);padding:22px 22px 0;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.kliniek-card .tile__tag{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c-teal-dark)}
.kliniek-card h3{font-size:1.3rem;margin-top:10px;max-width:24ch}
.kliniek-card .tw-stats{gap:14px 24px}
.kliniek-card .tw-stats b{font-size:clamp(1.6rem,1.3rem + 1.2vw,2.1rem)}
.kliniek-card .tw-photo{margin:18px -22px 0}
@media (min-width:1024px){.kliniek-card{padding:28px 28px 0}.kliniek-card h3{font-size:1.45rem}.kliniek-card .tw-stats{display:grid;grid-template-columns:repeat(2,auto);justify-content:start;gap:16px 40px}.kliniek-card .tw-photo{margin:20px -28px 0}}
#of-transplantatie .section__body{margin-top:var(--s-7)}
@media (min-width:1024px){#of-transplantatie .section__body{margin-top:var(--s-8)}}

/* 04: short section, the paragraph sits in a white card beside the heading */
#minoxidil .section__head{margin-bottom:0}
#minoxidil .listcard .prose p{font-size:var(--t-body);line-height:1.6}

/* 05: two cases side by side, no wider than two home cards */
@media (min-width:1024px){.ba-gallery--mannen{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}}
#voor-en-na .section__head{margin-bottom:28px}
.ba-gallery__link{margin-top:var(--s-5)}

/* 06: prose card beside the risk box; the risk box reads as a white card on the mint band */
#niet-geschikt .listcard h3 .icon{background:var(--c-mint);color:var(--c-navy)}
#niet-geschikt .listcard .prose p{font-size:var(--t-body)}
#niet-geschikt .box{background:#fff;border-color:var(--c-rule)}
#niet-geschikt .inline-cta{margin-top:var(--s-6)}

/* 08: note and link beside the price cards */
.kosten__aside .note{margin-top:8px}
.kosten__link{margin-top:var(--s-4)}
@media (min-width:1024px){.kosten__aside{padding-top:12px}}