/* CaniCo: de stijl van de home doorgetrokken naar de andere pagina's (2026-10-15).
   Geladen op alle pagina's behalve de home, na canico-home.css.
   Uitschakelen: de regel 'canico-paginas' in canico-design.php in commentaar zetten. */

/* Hero zoals de home: grote titel, beeld rechts */
.hero.p-hero { min-height: 88vh; }
.hero.p-hero .hero-h1 { font-size: clamp(2.6rem, 4.8vw, 4.4rem) !important; line-height: 1.05 !important; }
.hero.p-hero .hero-sub { font-size: 1.12rem; max-width: 520px; }
.hero.p-hero .hero-right img.hero-right-foto { object-position: center 30%; }
.p-hero-feiten { display: flex; gap: 1.6rem; flex-wrap: wrap; justify-content: center; }
.p-hero-feiten span { font-size: .8rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--creme); }
.p-hero-feiten span b { display: block; font-family: 'Playfair Display', serif; font-size: 1.6rem; letter-spacing: 0; text-transform: none; color: #ffc49e; }

/* Split met foto in plaats van filmpje */
.h-split-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.h-split.p-split-kort { min-height: 78vh; }

/* Genummerde punten (wat je krijgt) */
.p-punten-blok { background: var(--creme); padding: 8rem 2rem; }
.p-punten { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem 3.5rem; margin-top: 3.5rem; }
.p-punt .h-hs-nr { font-size: clamp(3rem, 5vw, 4.2rem); margin-bottom: .6rem; }
.p-punt p { font-size: 1.08rem; line-height: 1.7; color: var(--groen-donker); margin: 0; }
.p-punten-slot { margin-top: 4rem; padding-top: 2.5rem; border-top: 1px solid rgba(0,73,59,.14); max-width: 820px; }
.p-punten-slot .h-slot { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(1.5rem, 2.6vw, 2rem); color: var(--groen-donker); margin: 0 0 1rem; }

/* Voor wie wel, voor wie iets anders */
.p-wie { background: #fff; padding: 8rem 2rem; }
.p-wie .h-lijsten li::before { content: "✓"; color: var(--bosgroen); }
.p-wie .h-lijsten .p-anders li::before { content: "→"; color: var(--oranje); }
.p-wie .h-lijsten li a { color: var(--groen-donker); font-weight: 600; }

/* Investering */
.p-prijs { background: var(--groen-licht); padding: 8rem 2rem; }
.p-prijs-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 5rem; align-items: center; }
.p-prijs-grid .gids-stapel { margin: 0 auto; }
.p-prijs-bedrag { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(3rem, 6vw, 4.6rem); color: var(--groen-donker); line-height: 1; margin: .6rem 0 .4rem; }
.p-prijs-bedrag span { font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: .95rem; color: var(--tekst-grijs); margin-left: .6rem; }
.p-prijs ul { list-style: none; padding: 0; margin: 1.6rem 0 2rem; }
.p-prijs li { padding: .7rem 0; border-bottom: 1px solid rgba(0,73,59,.14); font-size: 1.05rem; color: var(--groen-donker); }
.p-prijs li::before { content: "✓"; color: var(--bosgroen); font-weight: 800; margin-right: .8rem; }
.p-belofte { margin-top: 2.2rem; border-left: 2px solid var(--oranje); padding: .3rem 0 .3rem 1.4rem; font-size: 1rem; line-height: 1.75; color: var(--tekst-grijs); }
.p-belofte strong { display: block; font-family: 'Playfair Display', serif; font-size: 1.3rem; color: var(--groen-donker); margin-bottom: .3rem; }

/* Review in een zwart blok */
.p-review { margin: 2rem 0 0; border-left: 2px solid var(--oranje); padding: .4rem 0 .4rem 1.4rem; }
.p-review-kop { text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; font-weight: 700; color: #ffc49e; }
.p-review p { font-family: 'Lora', serif; font-style: italic; font-size: 1.08rem; line-height: 1.75; color: rgba(248,247,239,.9) !important; margin: .5rem 0; }
.p-review-naam { font-size: .85rem; color: rgba(248,247,239,.65); }

/* Afsluiter in het zwart, met knop */
.h-statement .p-afsluit-knop { margin-top: 3rem; }
.h-statement .cta-intake-detail { color: rgba(248,247,239,.65) !important; margin-top: 1rem; }

/* Kleine prijsregel onder knoppen */
.p-knopregel { font-size: .85rem; color: var(--tekst-grijs); margin-top: .9rem; }

@media (max-width: 960px) {
	.hero.p-hero { min-height: 0; }
	.p-punten-blok, .p-wie, .p-prijs { padding: 5rem 1.25rem; }
	.p-punten, .p-prijs-grid { grid-template-columns: 1fr; gap: 2.5rem; }
	.h-split.p-split-kort { min-height: 0; }
}

/* Foto in een split vult altijd het hele vak */
.h-split-media img { height: 100% !important; max-width: none !important; }
.p-prijs .gids-stapel { transform: scale(1.35); transform-origin: center; }
@media (max-width: 960px) { .p-prijs .gids-stapel { transform: none; } }

/* Overzicht met twee kaarten (Zelf aan de slag) */
.h-kaarten.p-twee { grid-template-columns: repeat(2, 1fr); max-width: 980px; }
.p-gidsbeeld { background: var(--groen-licht); padding: 3rem 2rem 2rem; display: flex; justify-content: center; }
.p-gidsbeeld .gids-stapel { margin: 0 auto; max-width: 240px; }
@media (max-width: 960px) { .h-kaarten.p-twee { grid-template-columns: 1fr; } }

/* Aanbod per traject (Persoonlijke begeleiding): foto + tekst, om en om */
.p-trajecten { background: #fff; padding: 8rem 2rem 4rem; }
.p-traject { display: grid; grid-template-columns: .9fr 1.1fr; gap: 0; max-width: 1180px; margin: 0 auto 6rem; align-items: start; }
.p-traject > img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; position: sticky; top: 6rem; }
.p-traject.omgekeerd > img { order: 2; }
.p-traject-tekst { padding: 1rem 4.5rem; }
.p-traject-tekst h3 { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(2.2rem, 3.6vw, 3rem); color: var(--groen-donker); margin: .4rem 0 1.2rem; line-height: 1.05; }
.p-prijzen { display: flex; gap: 2.5rem; flex-wrap: wrap; padding: 1.2rem 0 1.4rem; margin-bottom: 1.4rem; border-top: 1px solid rgba(0,73,59,.14); border-bottom: 1px solid rgba(0,73,59,.14); }
.p-prijzen div { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 2rem; color: var(--groen-donker); line-height: 1.1; }
.p-prijzen small { display: block; font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: .8rem; color: var(--tekst-grijs); margin-top: .3rem; line-height: 1.5; max-width: 240px; }
.p-traject-tekst p { font-size: 1.05rem; line-height: 1.8; color: var(--tekst-grijs); }
.p-traject-tekst .vinkjes li { font-size: 1rem; }
.p-traject-tekst .mini-review { margin: 1.6rem 0; }
.p-traject-tekst .belofte { margin: 1.4rem 0; }
.p-traject-tekst .btn-primary { margin-top: 1rem; }
.melding { margin: 0 auto; max-width: none; border-radius: 0; text-align: center; border-left: 0; border-bottom: 1px solid rgba(0,73,59,.12); }
@media (max-width: 960px) {
	.p-trajecten { padding: 5rem 1.25rem 2rem; }
	.p-traject { grid-template-columns: 1fr; margin-bottom: 4rem; }
	.p-traject > img { position: static; aspect-ratio: 4 / 3; }
	.p-traject.omgekeerd > img { order: 0; }
	.p-traject-tekst { padding: 2rem 0 0; }
}

/* Punten met titel (De CaniCode: wat je krijgt) */
.p-punt h3 { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.5rem; color: var(--groen-donker); margin: 0 0 .6rem; }
.p-punt.p-tekst p { font-size: 1rem; color: var(--tekst-grijs); line-height: 1.75; }
.p-punten-blok.wit { background: #fff; }
.p-punten-blok.licht { background: var(--groen-licht); }
/* Prijstabel in het investeringsblok */
.p-prijs .prijstabel { width: 100%; margin: 1.5rem 0; }
.p-prijs-grid.p-prijs-tekst { grid-template-columns: 1.15fr .85fr; align-items: start; }

/* Gele invulvakken voor open vragen aan Annelies (enkel tijdens het bouwen) */
.p-vraagvak { background: #fff6b8; border: 2px dashed #d4a800; color: #5a4a00; padding: 1rem 1.3rem; border-radius: 6px; font-size: .95rem; line-height: 1.6; margin: 1.5rem 0; }
.p-vraagvak strong { display: block; color: #5a4a00; }
.h-statement .p-vraagvak, .h-missie .p-vraagvak { color: #5a4a00 !important; }
/* Losse review op een lichte achtergrond */
.p-quote { max-width: 760px; margin: 3rem auto 0; border-left: 2px solid var(--oranje); padding: .4rem 0 .4rem 1.4rem; }
.p-quote .p-review-kop { color: var(--oranje-tekst, #b8500c); }
.p-quote p { font-family: 'Lora', serif; font-style: italic; font-size: 1.12rem; line-height: 1.75; color: var(--groen-donker); margin: .5rem 0; }
.p-quote .p-review-naam { color: var(--tekst-grijs); font-size: .85rem; }
.p-knopblok { margin-top: 2.5rem; }
.h-statement .p-knopblok .p-knopregel { color: rgba(248,247,239,.65); }

/* Fotoband waarin de kleuren van de foto zelf spreken (De CaniCode, zonsondergang) */
.fotoband.p-kleur { align-items: flex-end; padding-bottom: 5rem; }
.fotoband.p-kleur::before { background: linear-gradient(to bottom, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 100%); }
.fotoband.p-kleur .missie-quote, .fotoband.p-kleur p { text-shadow: 0 2px 14px rgba(0,0,0,.45); }

/* Split met de foto rechts, om twee dezelfde opmaken na elkaar te vermijden */
.h-split.omgekeerd { grid-template-columns: 1.1fr .9fr; }
.h-split.omgekeerd .h-split-media { order: 2; }
@media (max-width: 960px) { .h-split.omgekeerd { grid-template-columns: 1fr; } .h-split.omgekeerd .h-split-media { order: 0; } }

/* Webdesign-ronde De CaniCode (15/10) */
/* Eén linkerlijn: smalle tekstblokken (FAQ, formulieren) staan links, zoals de rest van de pagina */
.blok .blok-smal { max-width: 1180px; }
.blok .blok-smal > * { max-width: 820px; }
.blok .section-title { color: var(--groen-donker); }
/* Citaten: links uitgelijnd, en drie naast elkaar in een reviewblok */
.p-quote { margin: 3rem 0 0; }
.p-quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; margin: 3rem 0 2.5rem; }
.p-quotes .p-quote { margin: 0; max-width: none; }
/* Scheidingslijn onder genummerde punten over de volle breedte */
.p-punten-slot { max-width: none; }
.p-punten-slot > * { max-width: 820px; }
/* Leesbaardere tekst in de puntenblokken, met een lijn boven elk punt zonder cijfer */
.p-punt.p-tekst p { font-size: 1.02rem; }
.p-punt.p-tekst:not(:has(.h-hs-nr)) { border-top: 2px solid var(--bosgroen); padding-top: 1.2rem; }
/* Statement in licht (wit) om niet te veel zwarte blokken na elkaar te hebben */
.h-statement.licht { background: #fff; color: var(--groen-donker); }
.h-statement.licht p.h-groot { color: var(--groen-donker); }
.h-statement.licht .h-groot span { color: var(--oranje-tekst, #b8500c); }
.h-statement.licht p { color: var(--tekst-grijs); }
.h-statement.licht .h-kernvraag { border-top-color: rgba(0,73,59,.14); }
.h-statement.licht .section-eyebrow { color: var(--oranje-tekst, #b8500c) !important; }
.h-split.creme { background: var(--creme); }
/* Prijstabel rustiger */
.p-prijs .prijstabel { background: transparent; }
.p-prijs .prijstabel th { background: transparent; border-bottom: 2px solid var(--groen-donker); }
.p-prijs .prijstabel td { background: transparent; font-size: .95rem; }
.p-prijs .prijstabel .bedrag { font-size: 1.5rem; font-weight: 900; color: var(--groen-donker); }
@media (max-width: 960px) { .p-quotes { grid-template-columns: 1fr; gap: 2rem; } }
.h-statement .p-knopblok { max-width: 660px; margin: 2rem auto 0; }
.h-statement.licht .p-knopregel { color: var(--tekst-grijs) !important; }
.p-prijs .prijstabel, .p-prijs .prijstabel th, .p-prijs .prijstabel td { border-left: 0 !important; border-right: 0 !important; border-top: 0 !important; }
/* Ook brede blokken (RESET, instappen) op dezelfde linkerlijn als de rest */
.blok .blok-inner { max-width: 1180px; }
/* Punten zonder cijfer krijgen een groene lijn erboven (15/10: cijfers enkel als er een volgorde is) */
.p-punt:not(:has(.h-hs-nr)) { border-top: 2px solid var(--bosgroen); padding-top: 1.2rem; }
.p-punt:not(.p-tekst) p { font-family: 'Lora', serif; font-size: 1.15rem !important; line-height: 1.6; color: var(--groen-donker); }

/* Rustiger ritme (15/10): lange tekst in statementblokken links uitgelijnd, titel blijft gecentreerd */
.h-statement .h-kernvraag { text-align: left; }
.h-statement .h-kernvraag .h-vraag { text-align: left; }
.h-statement .p-knopblok { text-align: left; }
/* Eén kleurtoon voor alle foto's, zoals de filmpjes op de home */
.hero-right img.hero-right-foto, .h-split-media img, .h-missie > img, .p-traject > img { filter: contrast(1.05) saturate(.85) brightness(.98) sepia(.06); }

/* Intro in twee kolommen: titel links, tekst rechts (15/10) */
.p-kop2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 5rem; align-items: end; max-width: none !important; }
.p-kop2 .h-titel { margin-bottom: 0; }
.p-kop2 .p-kop-rechts .h-intro { max-width: none; margin: 0 0 .8rem; }
.p-kop2 .p-kop-rechts .h-intro:last-child { margin-bottom: .4rem; }
.h-herken-kop:has(.p-kop2) { max-width: none; }
@media (max-width: 960px) { .p-kop2 { grid-template-columns: 1fr; gap: 1.2rem; } }
.p-twee-tekst { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 5rem; }
.p-twee-tekst .h-intro { max-width: none; margin: 0; }
@media (max-width: 960px) { .p-twee-tekst { grid-template-columns: 1fr; } }

/* Mini-menu dat verschijnt na de hero (15/10) */
.p-mininav { position: fixed; top: 72px; left: 0; right: 0; z-index: 90; background: rgba(248,247,239,.97); border-bottom: 1px solid rgba(0,73,59,.12); box-shadow: 0 6px 18px rgba(0,0,0,.06); transform: translateY(-120%); opacity: 0; transition: transform .3s, opacity .3s; }
.p-mininav.zichtbaar { transform: none; opacity: 1; }
.p-mininav .h-wrap { display: flex; align-items: center; gap: 2rem; padding: .7rem 2rem; }
.p-mininav a { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--groen-donker); text-decoration: none; }
.p-mininav a:hover { color: var(--oranje-tekst, #b8500c); }
.p-mininav-naam { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.1rem; color: var(--groen-donker); margin-right: auto; }
.p-mininav a.p-mininav-knop { background: var(--oranje); color: #fff; padding: .6rem 1.1rem; border-radius: 2px; }
/* Vaste wachtlijstknop op gsm */
.p-gsmknop { display: none; }
@media (max-width: 960px) {
	.p-mininav { display: none; }
	.p-gsmknop { display: block; position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 95; background: var(--oranje); color: #fff; text-align: center; padding: 1rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .85rem; text-decoration: none; border-radius: 3px; box-shadow: 0 8px 22px rgba(0,0,0,.25); transform: translateY(150%); transition: transform .3s; }
	.p-gsmknop.zichtbaar { transform: none; }
}
/* Reviews met hondenfoto, drie naast elkaar */
.p-reviewkaarten { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; margin: 3rem 0 2.5rem; }
.p-reviewkaarten .review-card { min-width: 0; width: auto; max-width: none; }
@media (max-width: 960px) { .p-reviewkaarten { grid-template-columns: 1fr; } }
/* RESET met de zonsondergang als opening */
.p-reset-band { background-size: cover; background-position: center top; }
.p-reset-opening { text-align: center; max-width: 900px; margin: 2rem auto 6rem; }
.p-reset-opening .missie-quote { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.1; color: var(--creme) !important; }
.p-reset-opening .missie-sub { color: rgba(248,247,239,.9); font-size: 1.15rem; }
.p-reset-opening .missie-sub strong { color: #ffc49e; }
/* Waarom nu, in het prijsblok */
.p-waaromnu { margin: 0 0 2.5rem; padding-bottom: 2rem; border-bottom: 1px solid rgba(0,73,59,.14); }
.p-waaromnu .h-hs-label { color: var(--oranje-tekst, #b8500c); }
.p-waaromnu-titel { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.6rem; line-height: 1.2; color: var(--groen-donker); margin: .4rem 0 1rem; }
.p-waaromnu .h-intro { font-size: 1rem; margin: 0 0 .7rem; }
/* Afsluiter als opening van het instapblok */
.p-instap-opening { text-align: center; max-width: 900px; margin: 1rem auto 5rem; }
.p-instap-opening .h-groot { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(2.4rem, 5.6vw, 4.4rem); line-height: 1.08; color: var(--creme) !important; margin: 0 0 1.2rem; }
.p-instap-opening .h-groot span { display: block; color: #ffc49e; font-style: italic; font-weight: 700; }
.p-instap-opening p { color: rgba(248,247,239,.85) !important; font-size: 1.12rem; }
.p-reviewkaarten .review-card img.review-hond-foto { display: block; width: 100% !important; height: 230px !important; max-width: none !important; object-fit: cover; border-radius: 3px; margin: 0 0 1.2rem; }

/* Match-blok gecentreerd (15/10) */
.p-wie.p-midden { text-align: center; }
.p-wie.p-midden .section-eyebrow { justify-content: center; }
.p-wie.p-midden .h-intro, .p-wie.p-midden .h-herken-kop { margin-left: auto; margin-right: auto; max-width: 760px; }
.p-wie.p-midden .h-lijsten { max-width: 920px; margin-left: auto; margin-right: auto; text-align: left; }
.p-wie.p-midden .p-quote { margin: 3rem auto 0; max-width: 640px; text-align: left; }
/* Belofte in de lettervorm van de citaten */
.p-belofte { font-family: 'Lora', serif; font-style: italic; font-size: 1.05rem; color: var(--groen-donker); }
.p-belofte strong { font-style: normal; }

/* Volle hero voor het hoofdaanbod (De CaniCode, 15/10): foto over de hele breedte, tekst erover */
.hero.p-hero.p-vol { display: block; position: relative; min-height: 92vh; }
.p-vol .hero-right { position: absolute; inset: 0; padding: 0; display: block; }
.p-vol .hero-right-overlay { background: linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.05) 80%), linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 40%) !important; }
.p-vol .hero-left { position: relative; z-index: 2; background: transparent !important; max-width: 720px; min-height: 92vh; padding: 9rem 2rem 6rem 6vw; }
.p-vol .hero-eyebrow { color: #ffc49e !important; }
.p-vol .hero-h1 { color: var(--creme) !important; font-size: clamp(3rem, 6vw, 5.6rem) !important; }
.p-vol .hero-sub { color: rgba(248,247,239,.88) !important; }
.p-vol .p-knopregel { color: rgba(248,247,239,.75) !important; }
.p-vol .hero-left .btn-ghost { color: var(--creme) !important; border-color: rgba(248,247,239,.55) !important; }
.p-vol .hero-right-brand { position: absolute; right: 4vw; bottom: 3rem; z-index: 2; }
@media (max-width: 960px) {
	.p-vol .hero-left { min-height: 0; padding: 7rem 1.25rem 9rem; }
	.p-vol .hero-right-overlay { background: linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.85)) !important; }
	.p-vol .hero-right-brand { left: 0; right: 0; bottom: 2rem; }
}
/* Gecentreerde tekst onder de wolkjes */
.p-midden-tekst { text-align: center; max-width: 760px !important; margin-left: auto; margin-right: auto; }
.p-midden-tekst .h-intro { margin-left: auto; margin-right: auto; }
.p-vol .hero-right img.hero-right-foto { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-height: none !important; object-fit: cover; object-position: 30% 60%; }
.p-vol .hero-right img.hero-right-foto { object-position: 50% 78%; }
.hero.p-hero.p-vol .hero-right img.hero-right-foto { object-position: 50% 50% !important; }

/* Herkenning De CaniCode: gecentreerd, gevoelens als één rustige zin onder de wolkjes (15/10) */
.p-midden-kop { text-align: center; margin-left: auto; margin-right: auto; }
.p-midden-kop .section-eyebrow { justify-content: center; }
.p-midden-kop .h-intro { margin-left: auto; margin-right: auto; }
.p-gevoelens { max-width: 900px; margin: 3.5rem auto 0; text-align: center; padding-top: 3rem; border-top: 1px solid rgba(0,73,59,.14); }
.p-gevoelens p { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(1.3rem, 2.2vw, 1.7rem); line-height: 1.5; color: var(--groen-donker); margin: 0; }
.p-gevoelens span { white-space: nowrap; }
.p-gevoelens .p-gevoelens-slot { margin-top: 1rem; font-style: italic; color: var(--oranje-tekst, #b8500c); font-size: clamp(1.5rem, 2.8vw, 2.1rem); }
@media (max-width: 700px) { .p-gevoelens span { white-space: normal; } }
.h-intro.p-intro-groot { font-size: 1.25rem; color: var(--groen-donker); max-width: 760px; margin-top: 1rem; }

/* Zwart erkenningsblok: titel gecentreerd, tekst links, "Waarom lukte het niet?" in een kader rechts (15/10) */
.p-erk-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4rem; max-width: 1100px; margin: 4rem auto 0; padding-top: 3rem; border-top: 1px solid rgba(248,247,239,.18); text-align: left; align-items: start; }
.p-erkenning .p-erk-tekst p { max-width: none; margin: 0 0 1.1rem; }
.p-erkenning .p-erk-tekst strong { color: var(--creme); }
.p-erkenning .p-knopblok { max-width: none; margin: 2rem 0 0; }
.p-erk-kader { border: 1px solid rgba(255,196,158,.45); border-left: 3px solid var(--oranje); padding: 2rem 2.2rem; background: rgba(255,255,255,.04); }
.p-erkenning .p-erk-kader p { max-width: none; margin: 0 0 1rem; font-size: 1.02rem; }
.p-erkenning .p-erk-kader p.p-erk-vraag { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.6rem; line-height: 1.25; color: #ffc49e; margin-bottom: 1.2rem; }
@media (max-width: 960px) { .p-erk-grid { grid-template-columns: 1fr; gap: 2.5rem; } }
.p-erkenning .p-knopregel { font-size: .85rem !important; margin-top: .8rem; }

/* Kleinere foto in een split (Na 12 weken, 15/10): foto als kader in plaats van halve schermbreedte */
.h-split.p-split-smal { grid-template-columns: .75fr 1.25fr; min-height: 0 !important; align-items: center; padding: 6rem 0 6rem 5vw; gap: 0; }
.h-split.p-split-smal .h-split-media { position: relative; aspect-ratio: 4 / 5; max-height: 560px; background: none; overflow: hidden; }
.h-split.p-split-smal .h-split-tekst { padding: 2rem 5rem; }
/* Zwart-witfoto's houden hun zwart-wit, zonder warme filter */
img[src*="-zw."] { filter: contrast(1.05) !important; }
@media (max-width: 960px) { .h-split.p-split-smal { padding: 4rem 1.25rem 0; } .h-split.p-split-smal .h-split-tekst { padding: 2.5rem 0 3rem; } }

/* Persoonlijke begeleiding (15/10): aanvraagblok gecentreerd in crème, match-blok crème */
.p-aanvraag-midden { background: var(--creme); }
.p-aanvraag-midden .blok-smal { text-align: center; }
.p-aanvraag-midden .blok-smal > * { margin-left: auto; margin-right: auto; max-width: 720px; }
.p-aanvraag-midden .section-eyebrow { justify-content: center; }
.p-aanvraag-midden .belofte { text-align: left; }
.p-aanvraag-midden #kennismaking { text-align: left; }
.p-wie.p-creme { background: var(--creme); }

/* Hero Persoonlijke begeleiding (15/10): titel gecentreerd + drie tegels online / bij mij / bij jou thuis */
.p-hero-drie { background: var(--groen-licht); padding: 9rem 2rem 5rem; }
.p-hd-kop { max-width: 860px; margin: 0 auto; text-align: center; }
.p-hd-kop .hero-h1 { font-size: clamp(2.6rem, 5vw, 4.4rem) !important; line-height: 1.05 !important; }
.p-hd-kop .hero-sub { max-width: 680px; margin: 0 auto 2rem; font-size: 1.1rem; color: var(--tekst-grijs); }
.p-hd-kop .hero-cta-group { justify-content: center; }
.p-hd-kop .cta-intake-detail { margin-top: 1rem; }
.p-hd-tegels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; max-width: 1180px; margin: 4rem auto 0; }
.p-hd-tegel { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 3px; text-decoration: none; }
.p-hd-tegel img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; filter: contrast(1.05) saturate(.85) brightness(.98) sepia(.06); }
.p-hd-tegel:hover img { transform: scale(1.04); }
.p-hd-tegel span { position: absolute; left: 0; right: 0; bottom: 0; padding: 3.5rem 1.5rem 1.3rem; background: linear-gradient(to top, rgba(0,30,24,.82), rgba(0,30,24,0)); color: rgba(248,247,239,.85); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; }
.p-hd-tegel span b { display: block; font-family: 'Playfair Display', serif; font-size: 1.8rem; letter-spacing: 0; text-transform: none; color: var(--creme); margin-bottom: .2rem; }
@media (max-width: 960px) { .p-hero-drie { padding: 7rem 1.25rem 3rem; } .p-hd-tegels { grid-template-columns: 1fr; } .p-hd-tegel { aspect-ratio: 16 / 10; } }
/* Herkenning als contrastzinnen */
.p-contrast { background: #fff; padding: 7rem 2rem; }
.p-contrast .h-wrap { max-width: 980px; }
.p-contrast-regel { font-family: 'Playfair Display', serif; font-weight: 900; font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.25; color: var(--groen-donker); margin: 0; padding: 2rem 0; border-bottom: 1px solid rgba(0,73,59,.12); }
.p-contrast-regel:last-child { border-bottom: 0; }
.p-contrast-regel span { display: block; font-style: italic; font-weight: 700; color: var(--oranje-tekst, #b8500c); }
.p-hd-kop .btn-ghost { color: var(--groen-donker) !important; border-color: rgba(0,73,59,.35) !important; }
.p-hd-kop .cta-intake-detail, .p-hd-kop .cta-intake-detail a { color: var(--tekst-grijs) !important; }
/* Tegels met de mogelijkheden per plaats (15/10) */
.p-hd-tegel { aspect-ratio: auto !important; display: flex; flex-direction: column; background: #fff; box-shadow: 0 14px 34px rgba(0,73,59,.1); }
.p-hd-tegel img { height: 300px !important; flex: none; }
.p-hd-paneel { padding: 1.5rem 1.6rem 1.6rem; text-align: left; }
.p-hd-paneel b { display: block; font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.7rem; color: var(--groen-donker); }
.p-hd-sub { display: block; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: var(--bosgroen); margin: .2rem 0 1rem; }
.p-hd-paneel ul { list-style: none; margin: 0; padding: 0; }
.p-hd-paneel li { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-top: 1px solid rgba(0,73,59,.12); }
.p-hd-paneel li a { color: var(--groen-donker); font-weight: 600; text-decoration: none; }
.p-hd-paneel li a::after { content: " →"; color: var(--oranje); }
.p-hd-paneel li em { font-style: normal; font-family: 'Playfair Display', serif; font-weight: 700; color: var(--groen-donker); white-space: nowrap; }
@media (max-width: 960px) { .p-hd-tegel img { height: 220px !important; } }
.p-hd-tegel .p-hd-paneel span.p-hd-sub { position: static; background: none; padding: 0; color: var(--bosgroen); font-size: .72rem; }
.p-hd-tegel img { object-position: center 18%; }
/* Tegels zonder foto: strakke kaartjes met een bosgroene bovenrand */
.p-hd-tegels.p-zonder-foto .p-hd-tegel { border-top: 4px solid var(--bosgroen); border-radius: 3px; }
.p-hd-tegels.p-zonder-foto .p-hd-paneel { padding: 2rem 1.8rem 1.8rem; }
.p-hd-tegels.p-zonder-foto .p-hd-paneel b { font-size: 2rem; }
.p-hd-tegels.p-zonder-foto { margin-top: 3.5rem; }
/* Hero Begeleiding: tekst links, kaartjes rechts onder elkaar (15/10) */
.p-hd-naast .p-hd-binnen { display: grid; grid-template-columns: 1.15fr .85fr; gap: 4.5rem; max-width: 1180px; margin: 0 auto; align-items: center; }
.p-hd-naast .p-hd-kop { text-align: left; margin: 0; max-width: none; }
.p-hd-naast .p-hd-kop .hero-sub { margin: 0 0 2rem; }
.p-hd-naast .p-hd-kop .hero-cta-group { justify-content: flex-start; }
.p-hd-naast .p-hd-kop .section-eyebrow, .p-hd-naast .p-hd-kop .hero-eyebrow { text-align: left; }
.p-hd-naast .p-hd-tegels { grid-template-columns: 1fr; gap: 1rem; margin: 0; max-width: none; }
.p-hd-naast .p-hd-paneel { padding: 1.3rem 1.6rem 1.2rem !important; }
.p-hd-naast .p-hd-paneel b { font-size: 1.6rem !important; display: inline; }
.p-hd-naast .p-hd-sub { display: inline !important; margin-left: .8rem !important; }
.p-hd-naast .p-hd-paneel ul { margin-top: .7rem; }
.p-hd-naast .p-hd-paneel li { padding: .5rem 0; }
@media (max-width: 960px) { .p-hd-naast .p-hd-binnen { grid-template-columns: 1fr; gap: 2.5rem; } }
/* Melding duidelijk als kader (15/10) */
.melding { max-width: 1180px !important; margin: 2.5rem auto !important; text-align: left !important; background: #fff; border: 1px solid rgba(0,73,59,.12) !important; border-left: 4px solid var(--oranje) !important; border-radius: 3px !important; padding: 1.2rem 1.6rem !important; font-size: 1rem; line-height: 1.6; color: var(--groen-donker); }
.melding strong { color: var(--oranje-tekst, #b8500c); display: block; margin-bottom: .2rem; }
@media (max-width: 960px) { .melding { margin: 1.5rem 1.25rem !important; } }
/* Contrastzinnen kleiner */
.p-contrast { padding: 5rem 2rem; }
.p-contrast .h-wrap { max-width: 860px; }
.p-contrast-regel { font-size: clamp(1.25rem, 2.1vw, 1.65rem); padding: 1.3rem 0; }
/* Melding compacter en gecentreerd */
.melding { max-width: 760px !important; text-align: center !important; border-left: 1px solid rgba(0,73,59,.12) !important; border-top: 4px solid var(--oranje) !important; }
/* Kaartjes in de hero compacter (15/10) */
.p-hd-naast .p-hd-binnen { grid-template-columns: 1.3fr .7fr; }
.p-hd-naast .p-hd-tegels { gap: .7rem; }
.p-hd-naast .p-hd-paneel { padding: 1rem 1.3rem .9rem !important; }
.p-hd-naast .p-hd-paneel b { font-size: 1.35rem !important; }
.p-hd-naast .p-hd-paneel ul { margin-top: .4rem; }
.p-hd-naast .p-hd-paneel li { padding: .4rem 0; font-size: .92rem; }
.p-hd-naast .p-hd-paneel li em { font-size: .95rem; }
.melding { background: var(--creme) !important; }
/* Melding in de hero en in de contactinfo: links uitgelijnd en compact */
.melding.p-melding-hero, .melding.p-melding-klein { max-width: 520px !important; margin: 1.8rem 0 0 !important; text-align: left !important; font-size: .9rem; padding: .9rem 1.2rem !important; }
.melding.p-melding-klein { margin-top: 1.2rem !important; }
/* Afsluiters (kort zinnetje + knop) blijven gecentreerd */
.h-statement .h-kernvraag[style*="border-top:0"], .h-statement .h-kernvraag[style*="border-top:0"] p, .h-statement .h-kernvraag[style*="border-top:0"] .p-afsluit-knop { text-align: center !important; }
.blok .blok-smal > .p-faq-knop { max-width: none; text-align: center; }

/* Zelf aan de slag (15/10): hero = de winkelplank met de gidsen */
.p-zelf { background: var(--groen-licht); padding: 9rem 2rem 6rem; }
.p-zelf-kop { max-width: 820px; margin: 0 auto 3.5rem; text-align: center; }
.p-zelf-kop .hero-h1 { font-size: clamp(2.6rem, 5vw, 4.4rem) !important; line-height: 1.05 !important; }
.p-zelf-kop .hero-sub { max-width: 680px; margin: 0 auto; font-size: 1.1rem; color: var(--tekst-grijs); }
.p-zelf .h-kaarten.p-twee { margin: 0 auto; }
.p-zelf .h-kaart { background: #fff; box-shadow: 0 14px 34px rgba(0,73,59,.1); }
.p-zelf .p-gidsbeeld { background: var(--creme); }
.p-zelf .h-aanbod-noot { margin-top: 2.5rem; }
@media (max-width: 960px) { .p-zelf { padding: 7rem 1.25rem 4rem; } }
.p-zelf .p-gidsbeeld { padding: 3rem 2rem 2.4rem; }
.p-zelf .p-gidsbeeld .gids-stapel { max-width: 250px !important; width: 250px; }
.h-statement.licht .cta-intake-detail, .h-statement.licht .cta-intake-detail a { color: var(--tekst-grijs) !important; }
/* Zelf aan de slag met drie producten (15/10) */
.h-kaarten.p-drie { grid-template-columns: repeat(3, 1fr); max-width: 1180px; }
.p-compact-beeld { display: flex; align-items: center; justify-content: center; min-height: 260px; }
.p-compact-mail { width: 230px; background: #fff; border-radius: 6px; box-shadow: 0 10px 28px rgba(0,0,0,.12); padding: 1.1rem 1.2rem 1.3rem; transform: rotate(-2deg); text-align: left; }
.p-compact-dag { display: inline-block; background: var(--oranje); color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: .2rem .6rem; border-radius: 2px; }
.p-compact-van { display: block; font-size: .75rem; color: var(--tekst-grijs); margin: .7rem 0 .9rem; }
.p-compact-regel { display: block; height: 7px; border-radius: 4px; background: rgba(0,73,59,.15); margin: .45rem 0; }
.p-compact-regel.kort { width: 60%; }
.p-binnenkort .h-kaart-label { color: var(--oranje-tekst, #b8500c) !important; }
@media (max-width: 960px) { .h-kaarten.p-drie { grid-template-columns: 1fr; } }
.p-compact-beeld { min-height: 300px; }
/* Kleiner statement (Zelf aan de slag) */
.h-statement.p-statement-klein { padding: 6rem 2rem; }
.h-statement.p-statement-klein p.h-groot { font-size: clamp(2rem, 4vw, 3.2rem); }
.h-statement.p-statement-klein .h-vraag { font-size: clamp(1.3rem, 2.4vw, 1.8rem) !important; }
/* Zelf aan de slag per reeks (15/10) */
.p-reeks { padding: 7rem 2rem; }
.p-reeks.p-creme { background: var(--creme); }
.p-reeks .h-kaarten.p-twee { margin: 3rem 0 0; }
.h-kaarten.p-een { grid-template-columns: minmax(0, 480px); margin: 3rem 0 0; }
.p-reeks .h-aanbod-noot { text-align: left; }
@media (max-width: 960px) { .p-reeks { padding: 5rem 1.25rem; } .h-kaarten.p-een { grid-template-columns: 1fr; } }
.p-reeks.p-creme .h-kaart { background: #fff; } .p-reeks.p-creme .p-gidsbeeld { background: var(--groen-licht); }
/* hero met foto rechts (Zelf aan de slag, 15/10) */
.p-hd-foto { margin: 0; border-radius: 18px; overflow: hidden; aspect-ratio: 4 / 5; max-height: 560px; box-shadow: 0 18px 40px rgba(0,73,59,.15); }
.p-hd-foto img { width: 100%; height: 100% !important; object-fit: cover; object-position: center 35%; display: block; }
@media (max-width: 960px) { .p-hd-foto { aspect-ratio: 4 / 3; max-height: none; } }
.p-reeks .h-kaarten.p-twee { max-width: none; }
/* enkele kaart (CaniCompactjes): even breed als een gidskaart, plaats voor meer reeksen */
.p-reeks .h-kaarten.p-een { grid-template-columns: repeat(2, 1fr); max-width: none; }
@media (max-width: 960px) { .p-reeks .h-kaarten.p-een { grid-template-columns: 1fr; } }
/* Mijn wens voor jou (CaniCode, in Wie ik ben op donkergroen) */
.p-wens { margin: 2rem 0 1.6rem; border-left: 2px solid var(--oranje); padding: .3rem 0 .3rem 1.4rem; font-family: 'Lora', serif; font-style: italic; font-size: 1.05rem; line-height: 1.75; color: var(--creme); }
.p-wens strong { display: block; font-family: 'Playfair Display', serif; font-style: normal; font-size: 1.3rem; color: #ffc49e; margin-bottom: .3rem; }
/* hero-feiten beter leesbaar op de foto (15/10) */
.p-hero-feiten span { text-shadow: 0 1px 8px rgba(0,0,0,.6); }
.p-hero-feiten span b { font-family: 'Montserrat', sans-serif; font-weight: 800; font-size: 1.5rem; }
.hero.p-hero .hero-right img.hero-right-foto { height: 100% !important; max-height: none !important; }
/* foto in de afsluiter (puppygids: Amedee in de nek) */
.p-afsluit-foto { display: block; width: 220px; height: 220px; margin: 0 auto 2.4rem; border-radius: 50%; object-fit: cover; object-position: center 45%; border: 4px solid rgba(255,196,158,.55); }
@media (max-width: 600px) { .p-afsluit-foto { width: 170px; height: 170px; } }
.h-statement img.p-afsluit-foto { height: 220px !important; border-radius: 50% !important; } @media (max-width: 600px) { .h-statement img.p-afsluit-foto { height: 170px !important; } }
/* punten-blok gecentreerd (Over mij: Van notenleer tot leiband) */
.p-punten-blok.p-midden { text-align: center; }
.p-punten-blok.p-midden .section-eyebrow { justify-content: center; }
.p-punten-blok.p-midden .h-intro { margin-left: auto; margin-right: auto; max-width: 760px; }
.p-punten-blok.p-midden .p-punten { max-width: 1040px; margin-left: auto; margin-right: auto; }
/* één grote review (De CaniCode: Minke) */
.p-reviewkaarten.p-een-review { grid-template-columns: minmax(0, 620px) !important; justify-content: center; }
.p-reviewkaarten.p-een-review { grid-template-columns: minmax(0, 860px) !important; }
.p-een-review .review-card { display: grid !important; grid-template-columns: 260px 1fr; column-gap: 2.4rem; align-content: start; }
.p-een-review .review-card > img.review-hond-foto { grid-row: 1 / span 4; width: 100% !important; height: 100% !important; min-height: 300px; margin: 0 !important; }
.p-een-review .review-card > *:not(img) { grid-column: 2; }
.p-een-review .review-tags { justify-self: start; }
@media (max-width: 700px) { .p-een-review .review-card { grid-template-columns: 1fr; } .p-een-review .review-card > img.review-hond-foto { grid-row: auto; min-height: 220px; } .p-een-review .review-card > *:not(img) { grid-column: 1; } }
.p-een-review .review-tekst { font-size: 1.2rem; }
.p-een-review .review-card { display: flow-root !important; }
.p-een-review .review-card > img.review-hond-foto { float: left; width: 260px !important; height: 340px !important; min-height: 0; margin: 0 2.4rem 0 0 !important; }
.p-een-review .review-card > *:not(img) { margin-bottom: 1rem; }
.p-een-review .review-tags { display: inline-block; }
@media (max-width: 700px) { .p-een-review .review-card > img.review-hond-foto { float: none; width: 100% !important; height: 240px !important; margin: 0 0 1.2rem !important; } }
/* mobiele correcties (eindcontrole 16/10) */
@media (max-width: 960px) {
  .p-hd-naast .p-hd-binnen { grid-template-columns: 1fr !important; }
  .p-prijs-grid { grid-template-columns: 1fr !important; }
  .btn-primary, .btn-ghost { white-space: normal !important; max-width: 100%; text-align: center; }
  .hero-left, .hero-right { min-width: 0; max-width: 100%; }
}

/* Alle hero's als volle hero (19/10/2026): extra's voor de pagina's die er nu bij komen */
.p-vol .hero-sub a, .p-vol .cta-intake-detail, .p-vol .cta-intake-detail a { color: var(--creme) !important; }
.p-vol .cta-intake-detail { opacity: .85; margin-top: .8rem; }
.hero.p-hero.p-vol[style*="min-height"] { min-height: 92vh !important; }
/* begeleiding: het aanbod in één oogopslag, net onder de hero */
.p-aanbod-onder { background: var(--creme); padding: 4.5rem 2rem 4rem; }
.p-ao-binnen { max-width: 1180px; margin: 0 auto; }
.p-aanbod-onder .p-hd-tegels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin: 0 auto; max-width: none; }
.p-aanbod-onder .p-melding-hero { max-width: 760px; margin: 2.2rem auto 0; }
@media (max-width: 960px) {
	.p-aanbod-onder { padding: 3rem 1.25rem; }
	.p-aanbod-onder .p-hd-tegels { grid-template-columns: 1fr; }
}
/* uitsnede per foto in de volle hero (staande foto's worden over de breedte uitgesneden) */
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-zonsondergang"] { object-position: 50% 27% !important; }
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-veld-zitten"] { object-position: 50% 66% !important; }
.p-aanbod-onder .melding { margin: 2.2rem auto 0 !important; max-width: 760px !important; }

/* begeleiding: het aanbod klein en verticaal in de hero (19/10) */
.p-vol .hero-left .p-hd-tegels { display: grid; grid-template-columns: 1fr; gap: .5rem; margin: 2.2rem 0 0; max-width: 470px; }
.p-vol .hero-left .p-hd-tegel { aspect-ratio: auto !important; background: rgba(248,247,239,.07) !important; box-shadow: none !important; border: 0 !important; border-left: 2px solid #f0a283 !important; border-radius: 0 4px 4px 0 !important; backdrop-filter: blur(2px); }
.p-vol .hero-left .p-hd-paneel { padding: .6rem 1rem !important; display: grid; grid-template-columns: 7.5rem 1fr; align-items: baseline; gap: 0 .8rem; }
.p-vol .hero-left .p-hd-paneel b { font-size: 1rem !important; color: var(--creme) !important; font-family: 'Playfair Display', serif; }
.p-vol .hero-left .p-hd-paneel .p-hd-sub { display: none !important; }
.p-vol .hero-left .p-hd-paneel ul { grid-column: 2; grid-row: 1; list-style: none; margin: 0; padding: 0; }
.p-vol .hero-left .p-hd-paneel li { display: flex; justify-content: space-between; gap: 1rem; border: 0 !important; padding: .1rem 0 !important; font-size: .82rem; }
.p-vol .hero-left .p-hd-paneel li a { color: rgba(248,247,239,.9) !important; text-decoration: none; }
.p-vol .hero-left .p-hd-paneel li a:hover { text-decoration: underline; }
.p-vol .hero-left .p-hd-paneel li a::after { color: #f0a283 !important; }
.p-vol .hero-left .p-hd-paneel li em { color: #f6c7ab !important; font-style: normal; white-space: nowrap; }
.p-aanbod-onder { padding: 3rem 2rem !important; }
.p-aanbod-onder .melding { margin-top: 0 !important; }




/* ===== Hero's (19/10, ronde 2): overal exact dezelfde filter als De CaniCode, foto's over de hele breedte ===== */
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-park-zitten"] { object-position: 50% 55% !important; }
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-zelf-016"] { object-position: 50% 78% !important; }
/* begeleiding: kaartjes rechts, foto gewoon over de hele breedte zoals de andere hero's */
@media (min-width: 1100px) {
	.hero.p-vol:has(.p-hd-tegels) .hero-left { position: static; }
	.hero.p-vol:has(.p-hd-tegels) .hero-left > * { position: relative; z-index: 2; }
	.hero.p-vol:has(.p-hd-tegels) .hero-left .p-hd-tegels { position: absolute; right: 4vw; top: 50%; transform: translateY(-50%); width: 270px; margin: 0; z-index: 3; }
	.hero.p-vol:has(.p-hd-tegels) .hero-left .p-hd-paneel { grid-template-columns: 1fr; gap: .3rem; }
	.hero.p-vol:has(.p-hd-tegels) .hero-left .p-hd-paneel ul { grid-column: 1; grid-row: auto; }
}
/* contact: klein fotootje bij "Liever mailen?" */
.los-fotootje { margin: 0 0 2rem; max-width: 260px; }
.los-fotootje img { width: 100%; display: block; border-radius: 6px; }

/* losse foto's: roestrood stippelkader en licht schuin, zoals bij "Over mij" op de home (19/10).
   In zwarte secties (h-missie, h-statement) geen kader en niet schuin. */
.los-fotootje img, .h-split-media:has(> img) {
	outline: 2px dashed rgba(204,90,58,.6); outline-offset: 10px; border-radius: 6px; transform: rotate(-2deg); }
.h-split.omgekeerd .h-split-media:has(> img) { transform: rotate(2deg); }
.h-split-media:has(> img) img { border-radius: 6px; }
.h-split-media:has(> img) { overflow: hidden; }

.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-overmij-grijs"] { object-position: 50% 12% !important; }
.p-vol .hero-right:has(img[src*="hero-cocker-bos"]) { overflow: hidden; }
/* begeleiding: kaartjes op een donkere, bijna dichte achtergrond zodat ze goed leesbaar zijn */
.p-vol .hero-left .p-hd-tegel { background: rgba(14,14,12,.82) !important; backdrop-filter: blur(6px); }
.p-vol .hero-left .p-hd-paneel li { font-size: .86rem !important; }
.p-vol .hero-left .p-hd-paneel li a { color: #f8f7ef !important; }

/* begeleiding: pijltjes blijven naast de tekst */
.p-vol .hero-left .p-hd-paneel li a { white-space: nowrap; }
@media (min-width: 1100px) { .hero.p-vol:has(.p-hd-tegels) .hero-left .p-hd-tegels { width: 300px !important; } }
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-strand-noorwegen"] { object-position: 50% 60% !important; }
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="aanbod-begeleiding-witte-herder"] { object-position: 50% 25% !important; }

/* contact (19/10, v3): "Even ter info" bovenaan, formulier links, fotootje met "Liever mailen?" klein ernaast */
.contact-grid { display: grid !important; grid-template-columns: 1fr 220px !important; gap: 2.2rem 3.5rem !important; max-width: 940px; margin: 0 auto; align-items: start !important; }
.contact-grid > .melding { grid-column: 1 / -1; margin: 0 !important; }
.contact-grid > form.formulier { background: #fff !important; border-radius: 10px !important; padding: 2.4rem 2.4rem 2.2rem !important; box-shadow: 0 10px 30px rgba(0,0,0,.05) !important; margin: 0 !important; max-width: none !important; }
.contact-grid > .contact-info { background: transparent !important; padding: 1.4rem 0 0 !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; text-align: center; }
.contact-info .los-fotootje { width: 180px; margin: 0 auto 1.8rem !important; }
.contact-info .los-fotootje img { aspect-ratio: 4 / 5; object-fit: cover; }
.contact-info > h3 { font-size: .95rem !important; margin: 0 0 .2rem !important; }
.contact-info > p { font-size: .9rem; margin: 0 !important; }
@media (max-width: 760px) { .contact-grid { grid-template-columns: 1fr !important; } }
/* begeleiding: Amedee iets meer naar het midden zodat de kaartjes rechts zijn kop niet bedekken */
@media (min-width: 1100px) {
	.p-vol .hero-right:has(img[src*="hero-amedee-park"]) { overflow: hidden; }
	.hero.p-vol:has(.p-hd-tegels) .hero-right img.hero-right-foto[src*="hero-amedee-park"] { transform: scale(1.28); transform-origin: 100% 85%; }
}
/* de kleine filmpjes (home "Zo kan het ook voelen", De CaniCode) krijgen hetzelfde stippelkader en staan licht schuin */
.h-split-media:has(> video) { outline: 2px dashed rgba(204,90,58,.6); outline-offset: 10px; border-radius: 6px; transform: rotate(-2deg); overflow: hidden; }
.h-split.omgekeerd .h-split-media:has(> video) { transform: rotate(2deg); }
.h-split-media:has(> video) video { border-radius: 6px; }
.contact-grid > .melding { max-width: none !important; width: 100%; }
/* contact: formulier iets smaller, fotootje groter; "Liever mailen?" onderaan gelijk met de onderkant van het formulier */
@media (min-width: 761px) {
	.contact-grid { grid-template-columns: 1fr 300px !important; max-width: 960px; }
	.contact-grid > .contact-info { align-self: stretch; display: flex !important; flex-direction: column; justify-content: space-between; padding: 1.2rem 0 1.6rem !important; }
	.contact-info .los-fotootje { width: 250px; margin: 0 auto !important; }
}
@media (min-width: 761px) {
	.contact-grid > .contact-info { justify-content: flex-start !important; }
	.contact-info > h3 { margin-top: auto !important; }
}
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-amedee-speelt"] { transform: scaleX(-1); object-position: 50% 70% !important; }
.hero.p-hero.p-vol .hero-right img.hero-right-foto[src*="hero-amedee-park"] { object-position: 50% 55% !important; }
/* zelf aan de slag: fotostrook zonder tekst (Amedee en de sheltie langs het meer) */
.fotoband.p-strook-leeg { min-height: 64vh; padding: 0; background-position: center 62%; }
.fotoband.p-strook-leeg::before { background: none; }
/* begeleiding: het beeld van de opticien bij CaniConsult */
.p-bril { font-family: 'Lora', serif; font-style: italic; font-size: 1.08rem; line-height: 1.75; color: var(--groen-donker); border-left: 3px solid #cc5a3a; padding-left: 1.1rem; margin: 1.4rem 0 1.6rem; }
/* zelf aan de slag: meteen alle producten in één oogopslag, net onder de hero */
.p-snel { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; max-width: 1180px; margin: 0 auto; padding: 3.2rem 2rem 1rem; }
.p-snel a { display: flex; flex-direction: column; gap: .45rem; background: #fff; border-radius: 8px; border-top: 3px solid #cc5a3a; padding: 1.3rem 1.4rem 1.2rem; text-decoration: none; box-shadow: 0 8px 24px rgba(0,0,0,.05); transition: transform .15s; }
.p-snel a:hover { transform: translateY(-3px); }
.p-snel-soort { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #b04a2e; }
.p-snel b { font-family: 'Playfair Display', serif; font-size: 1.12rem; line-height: 1.3; color: var(--groen-donker); }
.p-snel-prijs { margin-top: auto; font-weight: 700; color: var(--groen-donker); }
.p-snel-prijs::after { content: " →"; color: #cc5a3a; }
@media (max-width: 860px) { .p-snel { grid-template-columns: 1fr; padding: 2.4rem 1.25rem .5rem; } }
.p-iets-groters { margin-top: 1.4rem; font-size: .95rem; font-style: italic; }
.pagina-hero .p-iets-groters { color: var(--groen-donker); } .pagina-hero .p-iets-groters a { color: #b04a2e; font-weight: 700; font-style: normal; }
/* verkooppagina's van de gidsen (20/10): hero zonder foto, met de gids en het werkboek op een effen bosgroene achtergrond */
.hero.p-hero.p-vol.p-hero-product { background: var(--bosgroen, #4d6e3f); }
.p-hero-product .hero-right { display: flex !important; align-items: center; justify-content: flex-end; padding: 0 9vw 0 0 !important; background: none; }
.p-hero-product .hero-right .gids-stapel { width: 340px; max-width: 30vw; margin: 0; }
.p-hero-product .gids-stapel img { box-shadow: 0 24px 50px rgba(0,0,0,.35); }
.p-hero-product .gids-stapel .gs-label { color: #f6c7ab !important; font-size: 1.1rem; }
@media (max-width: 960px) {
	.p-hero-product .hero-right { position: relative !important; justify-content: center; padding: 0 0 4rem !important; }
	.p-hero-product .hero-right .gids-stapel { width: 230px; max-width: 70vw; }
	.p-hero-product .hero-left { padding-bottom: 3rem !important; }
}
@media (max-width: 960px) { .p-hero-product .hero-right { flex-direction: column; align-items: center; gap: 2.4rem; } .p-hero-product .hero-right-brand { position: static !important; } }