/*
 * Pandpagina, vernieuwd (23/10/2026): scherpe foto's, alle gegevens zichtbaar, vaste kolom met prijs en makelaar.
 * Kleuren uit modern.css (--cv-blauw, --cv-rood, --cv-inkt, --cv-grijs, --cv-lijn, --cv-zacht); EPC-kleuren .epc-a … uit modern.css.
 */
.pd { color: var(--cv-inkt, #1b2040); }
.pd p { color: inherit; }
.pd-kruimel { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; font-size: .85rem; color: var(--cv-grijs, #5b6180); }
.pd-kruimel a { color: var(--cv-grijs, #5b6180); text-decoration: underline; }

/* foto's: gsm = veegbare reeks over de volle breedte, vanaf 768 px een mozaïek (1 groot + 4) */
.pd-galerij { position: relative; margin: 0 -15px 24px; }
.pd-galerij__rij { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.pd-galerij__rij::-webkit-scrollbar { display: none; }
.pd-galerij__foto { flex: 0 0 100%; margin: 0; aspect-ratio: 3 / 2; overflow: hidden; scroll-snap-align: start; background: var(--cv-zacht, #f3f5fb); cursor: zoom-in; }
.pd-galerij__foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pd-galerij__labels { position: absolute; top: 12px; left: 12px; z-index: 2; display: flex; gap: 8px; }
.pd-label { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 9px; background: var(--cv-blauw, #001e9a); color: #fff; font-size: .8rem; font-weight: 700; letter-spacing: .02em; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); }
.pd-label--rood { background: var(--cv-rood, #ff4b4b); }
a.pd-label--wit, .pd-label--wit { background: #fff; color: var(--cv-blauw, #001e9a); text-decoration: none; }
.pd-galerij__knoppen { position: absolute; right: 12px; bottom: 12px; z-index: 2; display: flex; gap: 8px; }
.pd-knop-foto { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .95); color: var(--cv-blauw, #001e9a); font-size: .9rem; font-weight: 700; box-shadow: 0 6px 20px rgba(0, 0, 0, .22); cursor: pointer; transition: transform .15s ease; }
.pd-knop-foto:hover, .pd-knop-foto:focus-visible { color: var(--cv-blauw, #001e9a); text-decoration: none; transform: scale(1.04); }
.pd-knop-foto svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.pd-knop-foto[data-pand-video] svg { fill: currentColor; stroke: none; }
.pd-galerij__teller { position: absolute; left: 12px; bottom: 12px; z-index: 2; height: 30px; padding: 0 12px; border-radius: 9px; background: rgba(10, 14, 40, .65); color: #fff; font-size: .8rem; font-weight: 600; line-height: 30px; }
@media (max-width: 575px) {
    .pd-knop-foto { height: 36px; padding: 0 13px; font-size: .82rem; }
}
@media (min-width: 768px) {
    .pd-galerij { margin: 0 0 36px; }
    .pd-galerij__rij { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; aspect-ratio: 3 / 1; overflow: hidden; border-radius: 12px; }
    .pd-galerij__foto { aspect-ratio: auto; min-height: 0; }
    .pd-galerij__foto:first-child { grid-row: 1 / 3; }
    .pd-galerij__foto:nth-child(n+6) { display: none; }
    .pd-galerij__foto img { transition: transform .6s ease, filter .3s ease; }
    .pd-galerij__foto:hover img { transform: scale(1.03); filter: brightness(1.04); }
    /* grote foto altijd 3:2, zoals de meeste foto's (dronefoto's van 4:3 worden boven en onder iets bijgesneden) */
    .pd-galerij--n1 .pd-galerij__rij { grid-template-columns: 1fr; grid-template-rows: 1fr; aspect-ratio: 2 / 1; }
    .pd-galerij--n2 .pd-galerij__rij, .pd-galerij--n3 .pd-galerij__rij { aspect-ratio: 9 / 4; }
    .pd-galerij--n2 .pd-galerij__rij { grid-template-columns: 2fr 1fr; }
    .pd-galerij--n2 .pd-galerij__foto:nth-child(2) { grid-row: 1 / 3; }
    .pd-galerij--n3 .pd-galerij__rij { grid-template-columns: 2fr 1fr; }
    .pd-galerij--n4 .pd-galerij__foto:nth-child(4) { grid-column: 2 / 4; }
    .pd-galerij__labels { top: 18px; left: 18px; }
    .pd-galerij__knoppen { right: 18px; bottom: 18px; }
    .pd-galerij__teller { display: none; }
    /* videopopup over de kleine foto's (zie partials/pand-video) */
    .pd-galerij > .pand-video-zweef.pand-video-zweef--anker { top: 0; right: 0; bottom: 0; left: calc(50% + 2px); border-radius: 0 12px 12px 0; }
    .pd-galerij--n2 > .pand-video-zweef.pand-video-zweef--anker, .pd-galerij--n3 > .pand-video-zweef.pand-video-zweef--anker { left: calc(66.666% + 1.5px); }
}

/* inhoud links, vaste kolom rechts */
.pd-raster { display: grid; gap: 8px; }
.pd-zij--pc { display: none; }
@media (min-width: 992px) {
    .pd-raster { grid-template-columns: minmax(0, 1fr) 360px; gap: 64px; align-items: start; }
    .pd-zij--pc { display: block; height: 100%; }
    .pd-zij--gsm { display: none; }
    .pd-zij__plak { position: sticky; top: 120px; }
}
.pd-kop h1 { margin: 0 0 .5rem; color: var(--cv-blauw, #001e9a); font-size: clamp(1.75rem, 3.2vw, 2.5rem); line-height: 1.15; }
.pd-adres { display: flex; align-items: center; gap: 3px; margin: 0 0 .5rem; font-size: 1.05rem; }
.pd-adres a { color: var(--cv-grijs, #5b6180); }
.pd-adres svg { flex: none; width: 20px; height: 20px; margin-left: -3px; fill: none; stroke: var(--cv-blauw, #001e9a); stroke-width: 1.8; }
.pd-slogan { max-width: 40em; margin: 0 0 .75rem; font-size: 1.2rem; line-height: 1.55; }
.pd-slogan a { color: var(--cv-blauw, #001e9a); text-decoration: underline; }

.pd-cijfers { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 12px; margin: 0 0 2rem; padding: 0; list-style: none; }
.pd-cijfers li { display: flex; flex-direction: column; gap: 2px; padding: 16px 16px 14px; border: 1px solid var(--cv-lijn, #e4e7f1); border-radius: 16px; background: #fff; }
.pd-cijfers svg { width: 28px; height: 28px; margin-bottom: 8px; fill: none; stroke: var(--cv-blauw, #001e9a); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pd-cijfers strong { font-size: 1.3rem; font-weight: 700; line-height: 1.2; }
.pd-cijfers span { color: var(--cv-grijs, #5b6180); font-size: .85rem; }
.pd-cijfers .pd-epc { margin-bottom: 8px; }
.pd-epc { display: inline-block; align-self: flex-start; min-width: 44px; height: 28px; padding: 0 16px 0 9px; color: #16171f; font-size: 1rem; font-weight: 800; line-height: 28px; clip-path: polygon(0 0, 78% 0, 100% 50%, 78% 100%, 0 100%); border-radius: 4px 0 0 4px; }
.pd-epc--klein { min-width: 34px; height: 22px; padding: 0 12px 0 7px; font-size: .82rem; line-height: 22px; }
.pd-cijfers .pd-epc + strong { font-size: 1.3rem; }
@media (max-width: 575px) {
    .pd-cijfers { grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 1.5rem; }
    .pd-cijfers li { padding: 12px 10px 10px; border-radius: 14px; }
    .pd-cijfers svg { width: 22px; height: 22px; margin-bottom: 4px; }
    .pd-cijfers strong, .pd-cijfers .pd-epc + strong { font-size: 1.05rem; }
    .pd-cijfers span { font-size: .75rem; }
    .pd-cijfers .pd-epc { min-width: 34px; height: 22px; padding: 0 12px 0 7px; margin-bottom: 4px; font-size: .82rem; line-height: 22px; }
}

.pd-blok { padding: 2.2rem 0; border-top: 1px solid var(--cv-lijn, #e4e7f1); }
.pd-blok h2 { margin: 0 0 1.25rem; color: var(--cv-blauw, #001e9a); font-size: 1.55rem; }
.pd-tekst { position: relative; max-width: 46em; color: #30364f; font-size: 1.05rem; line-height: 1.6; }
.pd-tekst p { margin: 0; }
.pd-tekst p + p { margin-top: .75em; } /* alinea's: halve witregel i.p.v. een volle (Karel 26/10) */
.pd-tekst--lang:not(.pd-tekst--open) { max-height: 26em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 72%, transparent); mask-image: linear-gradient(#000 72%, transparent); }
.pd-meer { margin-top: 10px; padding: 8px 0; border: 0; background: none; color: var(--cv-blauw, #001e9a); font-weight: 700; text-decoration: underline; cursor: pointer; }

.pd-groepen { display: grid; gap: 24px 48px; }
@media (min-width: 768px) {
    .pd-groepen { grid-template-columns: 1fr 1fr; }
}
.pd-groep h3 { margin: 0 0 .4rem; color: var(--cv-inkt, #1b2040); font-size: 1.05rem; font-weight: 700; text-transform: none; }
.pd-groep dl { margin: 0; }
.pd-groep dl div { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 6px 0; border-bottom: 1px solid var(--cv-lijn, #e4e7f1); font-size: .95rem; }
.pd-groep dt { color: var(--cv-grijs, #5b6180); font-weight: 400; }
.pd-groep dd { margin: 0; font-weight: 600; text-align: right; }

.pd-documenten { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.pd-documenten a { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--cv-lijn, #e4e7f1); border-radius: 14px; background: #fff; color: var(--cv-inkt, #1b2040); font-weight: 600; }
.pd-documenten svg { flex: none; width: 24px; height: 24px; fill: none; stroke: var(--cv-blauw, #001e9a); stroke-width: 1.6; }

.pd-fotoraster { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; }
.pd-fotoraster figure { margin: 0; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 10px; background: var(--cv-zacht, #f3f5fb); cursor: zoom-in; }
.pd-fotoraster .pd-f--gsm-breed { grid-column: span 2; }
@media (min-width: 768px) {
    .pd-fotoraster { grid-template-columns: repeat(6, 1fr); }
    .pd-fotoraster figure, .pd-fotoraster .pd-f--gsm-breed { grid-column: span 2; }
    .pd-fotoraster .pd-f--groot { grid-column: span 4; grid-row: span 2; aspect-ratio: auto; }
    .pd-fotoraster .pd-f--half { grid-column: span 3; }
}
.pd-fotoraster img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.pd-fotoraster figure:hover img { transform: scale(1.03); }

.pd-kaart { position: relative; height: 380px; overflow: hidden; border-radius: 18px; }
/* vergrendeling: de pagina scrolt over de kaart heen tot je erop klikt; boven de pin (Leaflet 600), onder de knoppen + en - (1000) */
.pd-kaart__slot { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 900; display: flex; justify-content: center; align-items: flex-end; padding: 0 0 16px; border: 0; background: transparent; cursor: pointer; }
.pd-kaart__slot span { padding: 8px 14px; border-radius: 999px; background: rgba(10, 14, 40, .72); color: #fff; font-size: .85rem; font-weight: 600; opacity: 0; transition: opacity .2s ease; }
.pd-kaart:hover .pd-kaart__pc, .pd-kaart__slot:focus-visible .pd-kaart__pc { opacity: 1; }
.pd-kaart__gsm { display: none; }
@media (hover: none) {
    .pd-kaart__pc { display: none; }
    .pd-kaart__gsm { display: inline; opacity: 1; }
}
.pd-kaart--actief .pd-kaart__slot { display: none; }
.pd-barometer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; margin-top: 20px; padding: 24px 26px; border-radius: 18px; background: var(--cv-zacht, #f3f5fb); }
.pd-barometer h3 { margin: 4px 0 6px; color: var(--cv-blauw, #001e9a); font-size: 1.2rem; }
.pd-barometer p { max-width: 34em; margin: 0; color: #30364f; }
.pd-barometer__knoppen { display: flex; flex-wrap: wrap; gap: 10px; }
.pd-barometer .pd-barometer__let-op { display: flex; gap: 10px; max-width: 40em; margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #fff; color: #30364f; font-size: .9rem; line-height: 1.55; }
.pd-barometer__let-op svg { flex: none; width: 20px; height: 20px; margin-top: 1px; fill: none; stroke: var(--cv-blauw, #001e9a); stroke-width: 1.8; stroke-linecap: round; }
.pd-barometer__let-op strong { color: var(--cv-inkt, #1b2040); }
.pd-barometer__let-op a { color: var(--cv-blauw, #001e9a); font-weight: 600; text-decoration: underline; white-space: nowrap; }

/* prijs, makelaar en delen */
.pd-prijskaart { padding: 24px; border: 1px solid var(--cv-lijn, #e4e7f1); border-radius: 20px; background: #fff; box-shadow: 0 14px 40px rgba(16, 24, 64, .08); }
.pd-prijskaart__soort { display: flex; align-items: center; gap: 8px; color: var(--cv-rood, #ff4b4b); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.pd-prijskaart__soort img { flex: none; width: 28px; height: 28px; } /* icoon van de formule, zoals op /formules */
.pd-prijs { margin: 2px 0 10px; color: var(--cv-blauw, #001e9a); font-size: 2.3rem; font-weight: 800; line-height: 1.15; }
.pd-prijs small { font-size: 1rem; font-weight: 600; }
.pd-prijs--tekst { font-size: 1.6rem; }
.pd-prijskaart__uitleg { margin: 0 0 18px; color: var(--cv-grijs, #5b6180); font-size: .88rem; line-height: 1.55; }
.pd-prijskaart__uitleg a { color: var(--cv-blauw, #001e9a); text-decoration: underline; }
.pd-knop { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px; border-radius: 999px; font-size: 1rem; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; transition: background .15s ease, border-color .15s ease, transform .15s ease; }
.pd-knop:hover, .pd-knop:focus-visible { text-decoration: none; transform: translateY(-1px); }
.pd-knop svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.pd-knop--vol, .pd-knop--vol:hover { border: 2px solid var(--cv-blauw, #001e9a); background: var(--cv-blauw, #001e9a); color: #fff; }
.pd-knop--vol:hover { background: #00167a; }
.pd-knop--rand, .pd-knop--rand:hover { border: 2px solid var(--cv-lijn, #e4e7f1); background: #fff; color: var(--cv-blauw, #001e9a); }
.pd-knop--rand:hover { border-color: var(--cv-blauw, #001e9a); }
.pd-knop--breed { width: 100%; }
.pd-knoppenrij { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.pd-knoppenrij .pd-knop:only-child { grid-column: 1 / -1; }
.pd-makelaar { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 16px 20px; border-radius: 20px; background: var(--cv-zacht, #f3f5fb); }
/* foto met licht afgeronde hoeken (zaakvoerder 24/10: een cirkel knipte te veel weg); inzoomen op het gezicht kan per makelaar in config/team.php (cirkel) */
.pd-makelaar__foto { flex: none; width: 96px; height: 96px; overflow: hidden; border-radius: 16px; background: #fff; }
.pd-makelaar__foto img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.pd-makelaar span { display: block; color: var(--cv-grijs, #5b6180); font-size: .8rem; }
.pd-makelaar strong { display: block; font-size: 1.05rem; }
.pd-makelaar a { color: var(--cv-blauw, #001e9a); font-weight: 600; }
.pd-makelaar .pd-biv { display: block; color: var(--cv-grijs, #5b6180); font-size: .78rem; }
.pd-contact__functie .pd-biv { font-weight: 400; font-size: .92rem; }
.pd-schatting { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 16px 20px; border: 1px solid var(--cv-lijn, #e4e7f1); border-radius: 20px; background: #fff; color: var(--cv-inkt, #1b2040); text-decoration: none; transition: border-color .15s ease, transform .15s ease; }
.pd-schatting:hover, .pd-schatting:focus-visible { border-color: var(--cv-blauw, #001e9a); color: var(--cv-inkt, #1b2040); text-decoration: none; transform: translateY(-1px); }
.pd-schatting svg { flex: none; width: 42px; height: 42px; padding: 10px; border-radius: 50%; background: var(--cv-zacht, #f3f5fb); fill: none; stroke: var(--cv-blauw, #001e9a); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pd-schatting__tekst strong { display: block; font-size: .98rem; line-height: 1.3; }
.pd-schatting__tekst > span { display: block; margin-top: 2px; color: var(--cv-blauw, #001e9a); font-size: .88rem; font-weight: 600; line-height: 1.4; }
.pd-delen { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding: 0 4px; color: var(--cv-grijs, #5b6180); font-size: .85rem; }
.pd-delen > span { margin-right: 4px; }
.pd-delen a, .pd-delen button { display: inline-flex; justify-content: center; align-items: center; gap: 6px; min-width: 38px; height: 38px; padding: 0 10px; border: 1px solid var(--cv-lijn, #e4e7f1); border-radius: 999px; background: #fff; color: var(--cv-blauw, #001e9a); font-size: .82rem; font-weight: 600; cursor: pointer; }
.pd-delen a:hover, .pd-delen button:hover { border-color: var(--cv-blauw, #001e9a); }
.pd-delen svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pd-zij--gsm { margin: 0 0 1.5rem; }

/* makelaar onderaan, met de foto in het groot */
.pd-contact { padding: 8px 0 56px; color: var(--cv-inkt, #1b2040); }
.pd-contact__kaart { display: grid; overflow: hidden; border: 1px solid var(--cv-lijn, #e4e7f1); border-radius: 24px; background: #fff; box-shadow: 0 14px 40px rgba(16, 24, 64, .06); }
.pd-contact__foto { position: relative; aspect-ratio: 7 / 10; background: #fff; }
.pd-contact__foto img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }
.pd-contact__tekst { align-self: center; padding: 30px 24px 34px; }
.pd-contact h2 { margin: 6px 0 4px; color: var(--cv-blauw, #001e9a); font-size: clamp(1.8rem, 3vw, 2.5rem); text-transform: none; }
.pd-contact__functie { margin: 0 0 1.2rem; color: var(--cv-grijs, #5b6180); font-weight: 600; }
.pd-contact__tekst > p:not(.pd-contact__functie) { max-width: 32em; margin: 0 0 1.4rem; color: #30364f; font-size: 1.1rem; line-height: 1.6; }
.pd-contact__lijst { display: grid; gap: 10px; margin: 0 0 1.6rem; padding: 0; list-style: none; }
.pd-contact__lijst li { display: flex; align-items: center; gap: 12px; font-size: 1.1rem; }
.pd-contact__lijst svg { flex: none; width: 22px; height: 22px; fill: none; stroke: var(--cv-blauw, #001e9a); stroke-width: 1.6; stroke-linejoin: round; }
.pd-contact__lijst a { color: var(--cv-inkt, #1b2040); font-weight: 700; word-break: break-word; }
.pd-contact__knoppen { display: flex; flex-wrap: wrap; gap: 10px; }
@media (min-width: 768px) {
    .pd-contact__kaart { grid-template-columns: 360px 1fr; align-items: center; }
}
@media (min-width: 992px) {
    .pd-contact__kaart { grid-template-columns: 400px 1fr; }
    .pd-contact__tekst { padding: 48px 56px; }
}
@media (max-width: 767px) {
    .pd-contact__foto { max-height: 80vh; }
}

/* gsm: vaste balk met bellen en bezoek aanvragen */
.pd-actiebalk { display: none; }
@media (max-width: 991px) {
    .pd-actiebalk { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1030; display: flex; gap: 10px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); box-shadow: 0 -6px 24px rgba(16, 24, 64, .12); }
    .pd-actiebalk .pd-knop { flex: 1; min-height: 46px; }
    body:has(.pd-actiebalk) { padding-bottom: 76px; }
    body:has(.pd-actiebalk) .pand-video-zweef:not(.pand-video-zweef--anker) { bottom: calc(84px + env(safe-area-inset-bottom)); }
    body:has(.pd-actiebalk) .si-knop { bottom: 84px; }
    body:has(.pd-actiebalk):has(.si-knop) .pand-video-zweef:not(.pand-video-zweef--anker) { bottom: 140px; }
}

/* label Startprijs / Vraagprijs in de prijskaart: klikbaar, opent de uitleg voor kopers (Karel 26/10/2026) */
a.pd-prijskaart__soort { text-decoration: none; cursor: pointer; }
a.pd-prijskaart__soort:hover, a.pd-prijskaart__soort:focus-visible { color: var(--cv-blauw, #001e9a); text-decoration: underline; text-underline-offset: 3px; }

/* afdrukken: brochure van 4 A4-bladen voor de makelaar (zaakvoerder 27/10/2026, partials/pand-print + pand-print-band), in de stijl
   van ons flyer-magazine: klein cursief woord (Arimo) + blauwe kapitalen (Montserrat, vervangt Gotham), blauw #1A2AA4, rood #FF4B4B.
   De lettertypes staan op onze eigen server en laden enkel bij het afdrukken. Op het scherm is de brochure onzichtbaar. */
@font-face { font-family: 'CV Montserrat'; font-style: normal; font-weight: 400 800; font-display: block; src: url(/fonts/montserrat-normal-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'CV Montserrat'; font-style: normal; font-weight: 400 800; font-display: block; src: url(/fonts/montserrat-normal-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'CV Arimo'; font-style: italic; font-weight: 400 600; font-display: block; src: url(/fonts/arimo-italic-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'CV Arimo'; font-style: italic; font-weight: 400 600; font-display: block; src: url(/fonts/arimo-italic-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
.pd-print { display: none; }
@media print {
  html, body { margin: 0 !important; padding: 0 !important; background: #fff !important; }
  body > *:not(.pd-print) { display: none !important; }
  .pd-print { display: block !important; color: #22263f; font-family: 'CV Montserrat', Montserrat, Nunito, sans-serif; font-size: 9.8pt; line-height: 1.7; letter-spacing: 0; }
  .pd-print, .pd-print * { -webkit-print-color-adjust: exact; print-color-adjust: exact; box-sizing: border-box; }
  .pd-print h2, .pd-print h3 { margin: 0; letter-spacing: 0; font-family: inherit; }
  .pd-print img { display: block; width: 100%; height: 100%; object-fit: cover; max-width: none; }

  .pp-blad { position: relative; width: 210mm; height: 297mm; overflow: hidden; break-after: page; display: flex; flex-direction: column; background: #fff; }
  .pp-blad:last-child { break-after: auto; }

  /* titels zoals in het magazine: klein cursief woord, daaronder blauwe kapitalen */
  .pp-cursief { display: block; font-family: 'CV Arimo', Arimo, Arial, sans-serif; font-style: italic; font-weight: 400; font-size: 15pt; line-height: 1.1; color: #141414; text-transform: lowercase; }
  .pp-cursief--klein { font-size: 11.5pt; }
  .pp-cursief--wit { color: #fff; }
  .pp-kapitalen { display: block; font-size: 30pt; font-weight: 800; line-height: 1; color: #1a2aa4; text-transform: uppercase; }
  .pp-kapitalen--cover { font-size: 24pt; }
  .pp-kapitalen--klein { font-size: 19pt; }
  .pd-print .pp-logo { width: 44mm; height: auto; object-fit: contain; }
  .pd-print .pp-logo--wit { filter: brightness(0) invert(1); }
  .pp-beeldmerk { position: absolute; display: block; color: #fff; opacity: .08; pointer-events: none; }
  .pp-beeldmerk svg { display: block; width: 100%; height: 100%; fill: currentColor; }

  /* blad 1 */
  .pp-cover__kop { flex: none; display: flex; align-items: center; justify-content: space-between; padding: 14mm 20mm 0; }
  .pp-cover__web { font-size: 9pt; font-weight: 600; color: #1a2aa4; }
  .pp-cover__titel { flex: none; padding: 12mm 20mm 10mm; }
  .pp-cover__titel .pp-cursief { margin-bottom: 2mm; }
  .pp-cover__adres { display: block; margin-top: 2.5mm; font-size: 10.5pt; font-weight: 500; color: #4a4f6a; }
  .pp-cover__foto { flex: 1; min-height: 80mm; overflow: hidden; background: #e7ebf7; }
  .pp-cover__feiten { flex: none; padding: 8mm 20mm 9mm; }
  .pp-prijs b { display: block; font-size: 23pt; font-weight: 800; line-height: 1.05; color: #1a2aa4; }
  .pp-prijs small { font-size: 11pt; font-weight: 700; }
  .pp-prijs .pp-prijs--tekst { font-size: 18pt; }
  .pp-cijfers { display: flex; max-width: 112mm; margin: 5mm 0 0; padding: 0; list-style: none; }
  .pp-cijfers li { padding: 0 3.6mm; border-left: .3mm solid #d5daf0; }
  .pp-cijfers li:first-child { padding-left: 0; border-left: 0; }
  .pp-cijfers b { display: block; font-size: 11.5pt; font-weight: 800; line-height: 1.2; color: #1a2aa4; white-space: nowrap; }
  .pp-cijfers span { display: block; font-size: 7.6pt; line-height: 1.3; color: #6a6f88; white-space: nowrap; }

  /* blauwe band met de makelaar (blad 1 en 4): de makelaar staat rechts en steekt boven de band uit */
  .pp-band { position: relative; flex: none; background: #1a2aa4; color: #fff; }
  .pp-band--cover { height: 56mm; }
  .pp-band--slot { height: 74mm; }
  .pp-band .pp-beeldmerk { left: 96mm; top: -4mm; width: 70mm; height: 64mm; }
  .pp-band__portret { position: absolute; z-index: 1; right: 6mm; bottom: 0; width: 94mm; height: 94mm; }
  .pp-band--slot .pp-band__portret { bottom: 16mm; width: 86mm; height: 86mm; }
  .pp-band__portret img { object-fit: contain; object-position: bottom; }
  .pp-band__mens { position: absolute; left: 20mm; bottom: 9mm; width: 96mm; display: flex; flex-direction: column; line-height: 1.4; }
  .pp-band--slot .pp-band__mens { bottom: 24mm; }
  .pp-band__naam { margin-top: 1mm; font-size: 16pt; font-weight: 800; line-height: 1.15; text-transform: uppercase; }
  .pp-band__functie { font-size: 8pt; opacity: .85; }
  .pp-band__gsm { margin-top: 2.5mm; font-size: 15pt; font-weight: 800; line-height: 1.15; }
  .pp-band__mail { font-size: 9pt; }
  .pp-band__kantoor { font-size: 8pt; opacity: .85; }

  /* blad 2 en 3: witte bladen met de titel linksboven en ruime marges */
  .pp-titel { flex: none; padding: 20mm 22mm 9mm; }
  .pp-titel .pp-cursief { margin-bottom: 1.5mm; }
  .pp-over__inhoud { flex: none; display: grid; grid-template-columns: 1fr 60mm; align-items: start; gap: 14mm; padding: 0 0 12mm 22mm; }
  .pp-over__tekst p { margin: 0 0 4mm; }
  .pp-slogan { font-size: 11.5pt; font-weight: 700; line-height: 1.45; color: #1a2aa4; }
  .pp-over--kort .pp-over__tekst { font-size: 10.6pt; line-height: 1.8; }
  .pp-over--vol .pp-over__tekst { font-size: 9.2pt; line-height: 1.62; }
  .pp-over__fotos { display: grid; grid-template-rows: 1fr 1fr; gap: 2.5mm; height: 116mm; }
  .pp-over__fotos > div { overflow: hidden; background: #e7ebf7; }
  /* brede foto onderaan: vult wat er onder de tekst overblijft */
  .pp-breed { flex: 1 1 0; min-height: 0; overflow: hidden; container-type: size; }
  /* blijft er minder dan 4 cm over, dan geen foto (anders een smalle reep) */
  @container (max-height: 40mm) { .pp-breed img { display: none; } }
  .pp-over--twee .pp-over__inhoud, .pp-over--lang .pp-over__inhoud { grid-template-columns: 1fr; padding-right: 22mm; }
  .pp-over--twee .pp-over__tekst, .pp-over--lang .pp-over__tekst { columns: 2; column-gap: 12mm; font-size: 9pt; line-height: 1.6; }
  /* te lange tekst: het blad groeit mee en loopt door op een volgend blad, met dezelfde marges (clone) */
  .pp-over--lang { display: block; height: auto; min-height: 297mm; overflow: visible; }
  .pp-over--lang .pp-titel { padding-bottom: 0; }
  .pp-over--lang .pp-over__inhoud { display: block; padding: 9mm 22mm 16mm; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
  .pp-over--lang .pp-over__tekst p { orphans: 3; widows: 3; }
  .pp-kenmerken__inhoud { flex: none; columns: 2; column-gap: 14mm; column-fill: balance; padding: 0 22mm 6mm; }
  /* reglement direct na de kenmerken; de fotostrook vult de rest van het blad (zonder strook staat het reglement onderaan) */
  .pp-kenmerken .pp-reglement { margin-top: auto; }
  .pp-kenmerken .pp-strook { flex: 1 1 0; min-height: 50mm; height: auto; }
  .pp-groep { break-inside: avoid; margin-bottom: 5mm; }
  .pp-groep h3 { margin-bottom: 1mm; font-size: 9.6pt; font-weight: 800; color: #1a2aa4; text-transform: uppercase; }
  .pp-groep dl { margin: 0; }
  .pp-groep dl div { display: flex; justify-content: space-between; gap: 4mm; padding: 1.25mm 0; border-bottom: .25mm solid #e1e5f3; font-size: 8.5pt; line-height: 1.3; }
  .pp-groep dt { font-weight: 400; color: #6a6f88; }
  .pp-groep dd { margin: 0; font-weight: 700; text-align: right; color: #22263f; }
  .pp-kenmerken__inhoud--dicht .pp-groep dl div { padding: 1mm 0; font-size: 8.1pt; }
  .pp-reglement { flex: none; display: grid; grid-template-columns: 56mm 1fr; gap: 8mm; align-items: start; padding: 3mm 22mm 10mm; }
  .pp-reglement .pp-kapitalen--klein { font-size: 16pt; }
  .pp-reglement p { margin: 0; padding-left: 5mm; border-left: 1.2mm solid #ff4b4b; font-size: 8.8pt; line-height: 1.5; }
  .pp-strook { flex: none; display: grid; grid-template-columns: 1fr 1fr; gap: 2.5mm; height: 70mm; }
  .pp-strook > div { overflow: hidden; background: #e7ebf7; }

  /* blad 4: meer foto's, de ligging en de makelaar */
  .pp-slot__fotos { flex: none; display: grid; grid-template-columns: repeat(6, 1fr); gap: 2.5mm; background: #fff; }
  .pp-slot__fotos > div { overflow: hidden; background: #e7ebf7; grid-column: span 2; height: 50mm; }
  .pp-slot__fotos > div:nth-child(-n+2) { grid-column: span 3; height: 66mm; }
  .pp-ligging { flex: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 8mm; padding: 9mm 22mm 6mm; }
  .pp-ligging .pp-cursief { margin-bottom: 1mm; }
  .pp-ligging__adres { font-size: 10pt; font-weight: 500; color: #4a4f6a; text-align: right; }
  .pp-kaart { position: relative; flex: 1; min-height: 50mm; overflow: hidden; background: #eef1fb; }
  .pp-kaart__pin { position: absolute; left: 50%; top: 50%; width: 12mm; height: 12mm; margin: -6mm 0 0 -6mm; padding: 2.4mm; border: .9mm solid #fff; border-radius: 50%; background: #ff4b4b; color: #fff; box-shadow: 0 1mm 3mm rgba(0, 0, 0, .3); }
  .pp-kaart__pin svg { display: block; width: 100%; height: 100%; fill: currentColor; }
  .pp-kaart small { position: absolute; right: 2mm; bottom: 1.5mm; font-size: 6pt; color: #4a4f6a; background: rgba(255, 255, 255, .7); padding: 0 1.5mm; }
  .pp-wettelijk { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 8mm; margin: 0; padding: 3.5mm 20mm 5mm; border-top: .25mm solid rgba(255, 255, 255, .3); background: #1a2aa4; }
  .pd-print .pp-wettelijk .pp-logo { flex: none; width: 30mm; }
  .pp-wettelijk p { margin: 0; font-size: 6.2pt; line-height: 1.45; color: rgba(255, 255, 255, .78); }

  /* blad 3: twee recente Google-reviews onder de kenmerken (Karel 27/10/2026) */
  .pp-kenmerken .pp-reviews { flex: none; margin-top: auto; padding: 2mm 22mm 6mm; }
  .pp-reviews .pp-kapitalen--klein { font-size: 16pt; }
  .pp-kenmerken .pp-reviews + .pp-reglement { margin-top: 0; }
  .pp-reviews__kop { display: flex; align-items: flex-end; justify-content: space-between; gap: 8mm; margin-bottom: 3mm; }
  .pp-reviews__score { font-size: 9.5pt; color: #4a4f6a; white-space: nowrap; }
  .pp-reviews__score b { font-size: 13pt; font-weight: 800; color: #1a2aa4; }
  .pp-sterren { color: #f5a623; letter-spacing: .4mm; font-size: 11pt; }
  .pp-reviews__lijst { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; }
  .pp-reviews__lijst--een { grid-template-columns: 1fr; }
  .pp-reviews blockquote { margin: 0; padding: 3mm 4mm 3mm 5mm; border-left: 1.2mm solid #1a2aa4; background: #f3f5fc; }
  .pp-reviews blockquote p { margin: 0 0 2mm; font-family: 'CV Arimo', Arimo, Arial, sans-serif; font-style: italic; font-size: 9pt; line-height: 1.45; color: #22263f; }
  .pp-reviews blockquote span { font-size: 8pt; font-weight: 600; color: #6a6f88; }
}
/* einde afdrukken */
/* videopopup meteen (Karel 27/10/2026): eerst de foto van het pand met een afspeelteken, de video komt erover zodra hij speelt (partials/pand-video) */
.pand-video-zweef__dek { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; transition: opacity .6s ease; }
.pand-video-zweef__laden { position: absolute; top: 50%; left: 50%; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: rgba(255, 255, 255, .92); box-shadow: 0 6px 20px rgba(0, 0, 0, .3); animation: pvz-puls 1.4s ease-in-out infinite; transition: opacity .4s ease; pointer-events: none; }
.pand-video-zweef__laden svg { width: 22px; height: 22px; margin-left: 3px; fill: var(--cv-blauw, #001e9a); }
.pand-video-zweef--speelt .pand-video-zweef__dek, .pand-video-zweef--speelt .pand-video-zweef__laden { opacity: 0; pointer-events: none; animation: none; }
@keyframes pvz-puls { 50% { transform: scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .pand-video-zweef__laden { animation: none; } }
/* gsm: klein rechtsboven op de foto, boven de knoppen Video en Alle foto's */
@media (max-width: 767px) {
    .pd-galerij > .pand-video-zweef.pand-video-zweef--anker.pand-video-zweef--hoek { top: 10px; right: 10px; bottom: auto; left: auto; width: auto; height: calc(100% - 66px); aspect-ratio: 9 / 16; border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }
    .pd-galerij > .pand-video-zweef.pand-video-zweef--anker.pand-video-zweef--hoek.pand-video-zweef--liggend { width: 58%; height: auto; aspect-ratio: 16 / 9; }
    .pand-video-zweef--hoek .pand-video-zweef__sluit { top: 6px; right: 6px; width: 30px; height: 30px; }
    .pand-video-zweef--hoek .pand-video-knoppen { left: 6px; right: 6px; bottom: 6px; }
    .pand-video-zweef--hoek .pand-video-knoppen button { width: 32px; height: 32px; }
    .pand-video-zweef--hoek .pand-video-zweef__laden { width: 40px; height: 40px; margin: -20px 0 0 -20px; }
}