/* ============================================================
   Ontwerp 3 — Blush & groen: licht, fris, ronde vormen
   ============================================================ */
:root{
  --ink:#1f2422;
  --ink-2:#2b3330;
  --ivory:#ffffff;
  --ivory-2:#ffffff;
  --stone:#f7ebe7;          /* blush */
  --sand:#efd9d2;
  --gold:#2f5f4f;           /* diep groen accent */
  --gold-soft:#8fb3a4;
  --gold-pale:#e6f0ec;
  --muted:#5c6360;
  --line:rgba(31,36,34,.1);
  --line-light:rgba(255,255,255,.18);
  --serif:"DM Serif Display",Georgia,serif;
  --sans:"Figtree","Helvetica Neue",sans-serif;
  --r:24px;
}
body::before{display:none}
::selection{background:var(--sand);color:var(--ink)}
h1,h2,h3{font-weight:400;letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,5.4vw,4.6rem);line-height:1.05}
.eyebrow{color:var(--gold)}
.eyebrow::before{display:none}
.eyebrow{padding:8px 14px;background:var(--gold-pale);border-radius:999px;font-size:.74rem}
/* header */
.header.is-scrolled{background:rgba(255,255,255,.9)}
.nav a[aria-current="page"]{color:var(--gold)}
.nav .btn{border-radius:999px}
/* knoppen */
.btn{border-radius:999px;border-color:var(--ink)}
.btn::after{background:var(--gold)}
.btn:hover{border-color:var(--gold)}
.btn--solid{background:var(--gold);border-color:var(--gold);color:#fff}
.btn--solid::after{background:var(--ink)}
.btn--solid:hover{color:#fff;border-color:var(--ink)}
.btn--gold{background:#fff;border-color:#fff;color:var(--ink)}
.btn--gold::after{background:var(--gold)}
.btn--gold:hover{color:#fff}
.link{border-bottom-color:var(--gold);color:var(--gold)}
/* hero: gecentreerd met brede foto eronder */
.hero.hero--compact{background:var(--stone);padding-bottom:0;padding-top:clamp(130px,15vw,180px)}
.hero--compact .wrap{grid-template-columns:1fr;gap:clamp(36px,5vw,64px);justify-items:center;text-align:center}
.hero--compact h1{max-width:18ch}
.hero--compact .lead{margin-inline:auto;max-width:58ch}
.hero__cta{justify-content:center}
.hero__img{width:100%;margin-bottom:-1px}
.hero__img img{aspect-ratio:21/9;border-radius:var(--r) var(--r) 0 0;object-position:50% 25%}
.hero__img::after{display:none}
@media (max-width:900px){.hero__img{order:0}.hero__img img{aspect-ratio:4/3}}
/* secties */
.statement{background:#fff}
.checks li::before{border-color:var(--gold)}
.treat{background:var(--stone)}
.tcard{background:#fff;box-shadow:0 12px 40px rgba(31,36,34,.06);border-radius:var(--r)}
.tcard figure{border-radius:var(--r) var(--r) 0 0}
.about{background:var(--gold);color:#fff}
.about::before{background:radial-gradient(closest-side,rgba(255,255,255,.14),transparent 70%)}
.about .eyebrow{background:rgba(255,255,255,.14);color:#fff}
.about p{color:rgba(255,255,255,.85)}
.about__img img{border-radius:var(--r)}
.about .btn--light{border-color:rgba(255,255,255,.7);color:#fff}
.about .btn--light::after{background:#fff}
.about .btn--light:hover{color:var(--gold)}
.reviews{background:#fff}
.review{border:0;background:var(--stone);border-radius:var(--r)}
.stars{color:var(--gold)}
.plist li{border-bottom-color:var(--line)}
.plist .p i{color:var(--gold)}
.cta__bg::after{background:rgba(47,95,79,.78)}
.cta .eyebrow{background:rgba(255,255,255,.14);color:#fff}
.cta .eyebrow::after{display:none}
.footer{background:var(--ink)}
.footer h4{color:var(--gold-soft)}
/* subpagina's */
.page-hero{background:var(--stone)}
.page-hero::after{opacity:.05}
.titem__img img{border-radius:var(--r)}
.price-nav a{border-radius:999px;border-color:var(--line);background:#fff}
.price-nav a:hover{border-color:var(--gold);color:var(--gold)}
.pblock{background:#fff;border:0;box-shadow:0 12px 40px rgba(31,36,34,.06);border-radius:var(--r)}
.pblock header{border-bottom-color:var(--ink)}
.pblock .n small.dal{color:var(--gold)}
.pblock h3.sub{color:var(--gold)}
.notice{background:var(--gold-pale);border-left-color:var(--gold);border-radius:var(--r)}
.story__img img{border-radius:var(--r)}
.story__img::after{display:none}
.value{border-top-color:var(--gold)}
.value span{color:var(--gold)}
.crow svg{color:var(--gold);border-color:var(--line)}
.book-panel{background:var(--gold);border-radius:var(--r)}
.book-panel .eyebrow{background:rgba(255,255,255,.14);color:#fff}
.book-panel p,.book-panel ol li{color:rgba(255,255,255,.9)}
.book-panel ol li::before{color:var(--gold-soft)}
.book-panel .btn--gold{background:#fff;border-color:#fff;color:var(--ink)}
.map{border-radius:var(--r);filter:grayscale(.6) contrast(.95)}
.dev-badge{background:var(--gold);color:#fff;border-radius:999px}
/* mobiel menu */
@media (max-width:900px){.nav{background:var(--gold)}.nav a[aria-current="page"]{color:#fff;text-decoration:underline;text-underline-offset:8px}.nav .btn{border-color:#fff;color:#fff}}
.hero.hero--compact{padding-bottom:clamp(48px,6vw,80px)}
.hero--compact .lead{max-width:60ch}
.hero--band .wrap{text-align:center}
.hero--band .eyebrow{background:rgba(255,255,255,.16);color:#fff}
.hero--band h1{margin-inline:auto;max-width:22ch}
.hero--band .hero__bg::after{background:linear-gradient(180deg,rgba(31,36,34,.5) 0%,rgba(31,36,34,.2) 45%,rgba(31,36,34,.65) 100%)}
.hero-actions{background:var(--stone);border-bottom:0}

/* ---- review 10 okt ---- */
/* 1. actief menu-item boven de foto: wit met onderstreping i.p.v. groen */
.header--dark:not(.is-scrolled) .nav a[aria-current="page"]{color:#fff}
.header--dark:not(.is-scrolled) .nav a[aria-current="page"]::after{transform:scaleX(1);background:#fff}
/* 2. knop rechtsboven: vaste, leesbare hover */
.nav .btn{transition:background-color .3s,color .3s,border-color .3s}
.nav .btn::after{display:none}
.nav .btn:hover,.nav .btn:focus-visible{background:var(--gold);border-color:var(--gold);color:#fff;outline:none}
.header--dark:not(.is-scrolled) .nav .btn:hover{background:#fff;border-color:#fff;color:var(--ink)}
/* 7. label boven de titel op de foto: donkere pil */
.hero--band .eyebrow{background:rgba(31,36,34,.62);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@media (max-width:900px){
  .header--dark:not(.is-scrolled) .nav a[aria-current="page"]{color:#fff}
  .nav .btn:hover{background:#fff;color:var(--gold)}
}