/* Huisstijl miekekosters.nl. Zelfde tokens als de restyle van september 2026 (over-ons, book). */
:root {
  --magenta: #F056DE;
  --magenta-d: #d942c2;
  --magenta-tekst: #b8249f;
  --magenta-s: #fde6f9;
  --koraal: #fe686a;
  --koraal-s: #ffe5e6;
  --groen: #6d7a5e;
  --groen-s: #e7ede0;
  --beige: #fbf7f0;
  --wit: #ffffff;
  --tekst: #2b2b2b;
  --tekst-mut: #5a5a5a;
  --lijn: #e8e2d8;
  --radius: 6px;
  --font-body: 'Heebo', system-ui, -apple-system, sans-serif;
  --font-head: 'Lora', Georgia, serif;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--wit); color: var(--tekst); font-family: var(--font-body); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; }
a { color: var(--magenta-tekst); }
h1, h2, h3 { font-family: var(--font-head); font-weight: 500; color: var(--tekst); margin: 0 0 18px; text-wrap: balance; }
h1 { font-size: clamp(30px, 4.4vw, 46px); line-height: 1.15; }
h2 { font-size: clamp(25px, 3.2vw, 34px); line-height: 1.2; }
h3 { font-size: clamp(19px, 2.2vw, 23px); line-height: 1.3; }
p { margin: 0 0 18px; }
strong { font-weight: 600; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.smal { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.sectie { padding: clamp(48px, 7vw, 96px) 0; }
.sectie--beige { background: var(--beige); }
.eyebrow { font-weight: 700; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--magenta); margin: 0 0 14px; }
.knop { display: inline-block; background: var(--magenta); color: #fff; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; font-size: 13px; padding: 16px 32px; border-radius: var(--radius); border: 0; cursor: pointer; transition: background .15s ease, transform .15s ease; }
.knop:hover { background: var(--magenta-d); transform: translateY(-1px); }
.knop--licht { background: var(--wit); color: var(--magenta-tekst); border: 1px solid var(--lijn); padding: 11px 20px; font-size: 12px; }
.knop--licht:hover { background: var(--magenta-s); }
.knop:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid var(--magenta-d); outline-offset: 3px; }
.citaat { font-family: var(--font-head); font-style: italic; font-weight: 600; font-size: clamp(19px, 2.2vw, 23px); line-height: 1.4; color: var(--magenta-tekst); border-left: 3px solid var(--magenta); padding: 4px 0 4px 24px; margin: 28px 0; }
.kader { background: var(--beige); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 22px 24px; margin: 0 0 22px; }
.kader > :last-child { margin-bottom: 0; }
figure { margin: 28px 0; } figcaption { font-size: 14px; color: var(--tekst-mut); margin-top: 8px; }
.video { position: relative; aspect-ratio: 16/9; margin: 28px 0; } .video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--radius); }
hr { border: 0; border-top: 1px solid var(--lijn); margin: 36px 0; }

/* Testbalk (alleen op het testadres) */
.testbalk { background: var(--tekst); color: #fff; font-size: 13px; text-align: center; padding: 7px 16px; }

/* Kop */
.kop { border-bottom: 1px solid var(--lijn); background: var(--wit); }
.kop .container { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 76px; }
.kop .logo img { display: block; width: 190px; height: auto; }
.menu { display: flex; gap: 32px; font-size: 15px; align-items: center; }
.menu a { color: var(--tekst); text-decoration: none; white-space: nowrap; }
@media (max-width: 1200px) { .menu { gap: 22px; } } /* acht menu-items passen tot het breekpunt van 1040px */
.menu a:hover, .menu a:focus-visible, .menu a:active, .menu a[aria-current], .menu-uitklap__knop:hover, .menu-uitklap.open .menu-uitklap__knop { color: var(--magenta); }
.menu a.menu-cta { background: var(--magenta); color: #fff; padding: 10px 18px; border-radius: var(--radius); font-weight: 600; }
.menu a.menu-cta:hover, .menu a.menu-cta:active { background: #d942c2; color: #fff; }
.menu-uitklap { position: relative; }
.menu-uitklap__knop { background: none; border: 0; padding: 0; font: inherit; color: var(--tekst); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.menu-uitklap__knop::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.menu-uitklap__lijst { display: none; position: absolute; top: 100%; left: -18px; padding-top: 14px; z-index: 20; min-width: 300px; }
.menu-uitklap__lijst::before { content: ""; position: absolute; inset: 14px 0 0; background: var(--wit); border: 1px solid var(--lijn); border-top: 3px solid var(--magenta); box-shadow: 0 14px 30px rgba(0,0,0,.10); z-index: -1; }
.menu-uitklap__lijst a { display: block; padding: 10px 18px; white-space: nowrap; }
.menu-uitklap__lijst a:first-child { margin-top: 8px; } .menu-uitklap__lijst a:last-child { margin-bottom: 8px; }
.menu-uitklap:hover .menu-uitklap__lijst, .menu-uitklap:focus-within .menu-uitklap__lijst, .menu-uitklap.open .menu-uitklap__lijst { display: block; }
.menu-knop { display: none; background: none; border: 1.5px solid var(--magenta); color: var(--magenta-tekst); border-radius: var(--radius); padding: 8px 14px; font: 600 14px var(--font-body); cursor: pointer; -webkit-appearance: none; appearance: none; }
.menu-knop[aria-expanded="true"] { background: var(--magenta); color: #fff; }
.menu-uitklap__knop { -webkit-appearance: none; appearance: none; }
.kop--logo .container { justify-content: center; }

/* Voet */
.voet { background: var(--beige); border-top: 1px solid var(--lijn); padding: 56px 0 28px; font-size: 14px; color: var(--tekst-mut); }
.voet a { color: var(--tekst-mut); text-decoration: none; }
.voet a:hover { color: var(--magenta-tekst); }
.voet__raster { display: grid; grid-template-columns: 1.3fr 1fr 1.2fr 1.2fr; gap: 40px 32px; }
.voet__kol--merk { grid-column: 1; grid-row: 1 / span 2; }
.voet__kol--inspiratie { grid-column: 2; grid-row: 1 / span 2; }
/* Programma staat rechts onder de aanmeldknop, zodat de footer lager en evenwichtiger is (Mieke 12 nov 2026). */
.voet__kol--boeken { grid-column: 3; grid-row: 1 / span 2; }
.voet__kol--mail { grid-column: 4; grid-row: 1; }
.voet__kol--programma { grid-column: 4; grid-row: 2; align-self: start; }
.voet__raster { grid-template-rows: auto 1fr; }
.voet__kol > nav, .voet__kol ul { list-style: none; margin: 0; padding: 0; }
.voet__kol li { margin: 0 0 8px; line-height: 1.45; }
.voet__kol p { margin: 0 0 16px; line-height: 1.6; }
.voet__kol--merk img { display: block; margin-bottom: 20px; }
.voet__kop { font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 13px; color: var(--tekst); margin: 0 0 14px !important; }
.voet__sociaal { display: flex; gap: 10px; }
.voet__sociaal a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--lijn); background: var(--wit); color: var(--tekst); }
.voet__sociaal a:hover { color: var(--magenta-tekst); border-color: var(--magenta); }
.voet__kol--mail .knop { color: #fff; }
.voet__onder { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 18px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--lijn); }
.voet__links { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.voet--kort { padding: 32px 0; }
.voet--kort .voet__onder { margin-top: 0; padding-top: 0; border-top: 0; }
@media (max-width: 1040px) { .voet__raster { grid-template-columns: 1fr 1fr; } .voet__raster > * { grid-column: auto !important; grid-row: auto !important; } .voet__kol--merk, .voet__kol--mail { grid-column: 1 / -1 !important; } }
@media (max-width: 480px) { .voet__raster { grid-template-columns: 1fr; } }

/* Lopende tekst */
.tekst h2 { margin-top: 44px; }
.tekst h3 { margin-top: 30px; margin-bottom: 10px; }
.tekst ul, .tekst ol { padding-left: 22px; margin: 0 0 18px; }
.tekst li { margin-bottom: 6px; }

/* Artikel */
.artikelkop { background: var(--beige); padding: clamp(40px, 6vw, 72px) 0 40px; }
.byline { font-size: 14px; color: var(--tekst-mut); display: flex; flex-wrap: wrap; gap: 4px 18px; }
.kort-antwoord { background: var(--magenta-s); border-left: 3px solid var(--magenta); border-radius: 0 var(--radius) var(--radius) 0; padding: 20px 24px; margin: 36px 0 8px; }
.kort-antwoord .eyebrow { margin-bottom: 6px; }
.kort-antwoord p { margin: 0; font-size: 18px; }

/* Blok met een aanbod */
.aanbod { background: var(--magenta-s); border: 1px solid #f6c9ee; border-radius: var(--radius); padding: clamp(26px, 4vw, 40px); margin: 44px 0 0; }
.aanbod h2 { margin-bottom: 12px; }

/* Podcast */
.pc-kop { background: var(--beige); padding: 32px 0 44px; }
.kruimel { font-size: 13px; color: var(--tekst-mut); margin-bottom: 26px; }
.kruimel a { color: var(--tekst-mut); }
.pc-grid { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 28px; align-items: start; }
.pc-hoes { width: 160px; aspect-ratio: 1; border-radius: var(--radius); background: center/cover no-repeat url('/beeld/podcast-hoes-600.jpg'); }
.pc-kop h1 { margin-bottom: 10px; }
.pc-sub { font-family: var(--font-head); font-style: italic; font-size: clamp(19px, 2.2vw, 22px); color: var(--magenta-tekst); margin: 0 0 14px; }
.meta { font-size: 14px; color: var(--tekst-mut); display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; }
.speler { margin-top: 30px; background: var(--wit); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 18px 20px; }
.speler-rij { display: flex; align-items: center; gap: 16px; }
.speel { flex: none; width: 54px; height: 54px; border-radius: 50%; border: 0; background: var(--magenta); color: #fff; cursor: pointer; display: grid; place-items: center; }
.speel:hover { background: var(--magenta-d); }
.speel svg { width: 22px; height: 22px; }
.balk-wrap { flex: 1; min-width: 0; }
.balk { width: 100%; accent-color: var(--magenta); cursor: pointer; margin: 0; }
.tijden { display: flex; justify-content: space-between; font-size: 13px; color: var(--tekst-mut); font-variant-numeric: tabular-nums; }
.speler-knoppen { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.klein { border: 1px solid var(--lijn); background: var(--beige); color: var(--tekst); border-radius: var(--radius); font: 500 13px var(--font-body); padding: 6px 12px; cursor: pointer; }
.luister-ook { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 14px; color: var(--tekst-mut); }
.samenvatting ol { list-style: none; counter-reset: nr; padding: 0; margin: 26px 0; display: grid; gap: 12px; }
.samenvatting ol li { counter-increment: nr; position: relative; background: var(--beige); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 16px 20px 16px 64px; margin: 0; }
.samenvatting ol li::before { content: counter(nr); position: absolute; left: 20px; top: 15px; width: 30px; height: 30px; border-radius: 50%; background: var(--magenta-s); color: var(--magenta-tekst); font-weight: 700; display: grid; place-items: center; font-size: 15px; }
.hoofdstukken { list-style: none; padding: 0; margin: 10px 0 0; border-top: 1px solid var(--lijn); }
.hoofdstukken li { border-bottom: 1px solid var(--lijn); }
.hoofdstukken button { width: 100%; text-align: left; background: none; border: 0; padding: 12px 2px; font: 16px var(--font-body); color: var(--tekst); cursor: pointer; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 10px; }
.hoofdstukken button:hover span { color: var(--magenta-tekst); }
.hoofdstukken time, .transcript h3 time { font-variant-numeric: tabular-nums; color: var(--magenta-tekst); font-weight: 500; font-family: var(--font-body); }
.transcript h3 { margin-top: 36px; margin-bottom: 10px; }
.transcript h3 button { all: unset; cursor: pointer; }
.transcript h3 time { font-size: 13px; margin-left: 10px; }
.notitie { font-size: 15px; color: var(--tekst-mut); }

/* Podcastoverzicht */
.zoek { width: 100%; max-width: 420px; font: 16px var(--font-body); padding: 12px 14px; border: 1px solid var(--lijn); border-radius: var(--radius); margin: 8px 0 26px; }
.afl-lijst { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.afl-lijst a { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 16px; align-items: center; text-decoration: none; color: var(--tekst); background: var(--wit); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 14px 18px; }
.afl-lijst a:hover { border-color: var(--magenta); }
.afl-nr { font-family: var(--font-head); font-size: 20px; color: var(--magenta-tekst); }
.afl-titel { font-family: var(--font-head); font-size: 18px; line-height: 1.3; display: block; }
.afl-meta { font-size: 13px; color: var(--tekst-mut); }

@media (max-width: 1040px) {
  .menu-knop { display: block; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--wit); border-bottom: 1px solid var(--lijn); flex-direction: column; align-items: flex-start; padding: 12px 16px 18px; gap: 12px; z-index: 5; }
  .menu.open { display: flex; }
  .menu-uitklap__lijst { position: static; padding: 6px 0 0 14px; min-width: 0; }
  .menu-uitklap__lijst::before { display: none; }
  .menu-uitklap__lijst a { padding: 6px 0; white-space: normal; }
  .menu-uitklap:hover .menu-uitklap__lijst { display: none; }
  .menu-uitklap.open .menu-uitklap__lijst { display: block; }
  .kop { position: relative; }
  .menu a.menu-cta { padding: 8px 14px; }
}
@media (max-width: 760px) {
  body { font-size: 16px; }
  .container, .smal { padding: 0 16px; }
  .kop { position: relative; }
  .kop .logo img { width: 160px; }
  .pc-grid { grid-template-columns: 1fr; gap: 20px; }
  .pc-hoes { width: 110px; }
  .knop { padding: 14px 22px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }
.smal > .aanbod:first-child { margin-top: 0; }

/* Leadmagnet (gratis boek): hero met foto, vinklijst, formulier */
.lm-hero { position: relative; min-height: 560px; display: flex; align-items: flex-end; background: #2b2b2b center/cover no-repeat; }
.lm-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,20,20,.78) 0%, rgba(20,20,20,.35) 55%, rgba(20,20,20,0) 100%); }
.lm-hero .container { position: relative; z-index: 1; padding-top: 64px; padding-bottom: 48px; color: #fff; }
.lm-eyebrow { font-family: var(--font-head); font-style: italic; font-size: 18px; color: #d7e6cd; margin: 0 0 8px; }
.lm-hero h1 { color: #fff; max-width: 640px; }
.lm-hero h1 strong { color: var(--magenta); font-weight: inherit; }
.lm-form { background: #fff; border-radius: var(--radius); padding: 22px; margin-top: 28px; max-width: 420px; }
.lm-form p.klein { color: var(--tekst-mut); font-size: 13px; margin: 10px 0 0; }
.lm-form input[type="email"] { width: 100%; font: 16px var(--font-body); padding: 13px 14px; border: 1px solid var(--lijn); border-radius: var(--radius); margin: 0 0 12px; }
.lm-form .knop { width: 100%; text-align: center; }
.lm-dank { display: none; }
.lm-dank.tonen { display: block; }
.lm-form.verstuurd form { display: none; }
.lm-vinklijst { list-style: none; padding: 0; margin: 30px 0 0; display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lm-vinklijst li { display: flex; gap: 14px; align-items: flex-start; }
.lm-vinklijst .vink { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--groen-s); color: var(--groen); font-weight: 700; display: grid; place-items: center; font-size: 15px; }
.lm-vinklijst h3 { margin: 0 0 4px; font-size: 17px; }
.lm-vinklijst p { margin: 0; color: var(--tekst-mut); font-size: 15px; }
@media (max-width: 760px) {
  .lm-hero { min-height: 460px; }
  .lm-vinklijst { grid-template-columns: 1fr; }
}

/* Sitetekst v2: vragen als koppen met antwoord */
.vragen h2 { font-size: 22px; margin: 28px 0 8px; }
.vragen p { margin: 0 0 8px; }

/* Vaste identiteitszin op afleveringspagina's */
.identiteit p { margin: 0; font-size: 15px; color: var(--tekst-mut); }
.identiteit strong { color: var(--tekst); }

.thema-links { display: flex; flex-wrap: wrap; gap: 8px; }
.thema-links .knop { font-size: 13px; padding: 8px 12px; }

/* ---------- Artikel, uit het design system (ArtikelPagina, 22 oktober 2026) ---------- */
.artkop { padding: clamp(36px, 4.5vw, 64px) 0 clamp(16px, 2vw, 26px); }
.artkop__wrap { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.artkop h1 { font-weight: 600; font-size: clamp(29px, 4.2vw, 44px); line-height: 1.15; margin: 0 0 18px; }
.artkop__meta { font-size: 14px; color: var(--tekst-mut); margin: 0; padding-top: 18px; border-top: 1px solid var(--lijn); }
.artkop__meta strong { color: var(--tekst); font-weight: 600; }
.artkop__punt { color: #c9c3b8; margin: 0 6px; }
.artbanner { max-width: 760px; margin: 8px auto 36px; padding: 0 24px; }
.artbanner figure { margin: 0; }

.fotoletters { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: var(--tekst) center / cover no-repeat; display: flex; align-items: flex-end; justify-content: flex-end; padding: 5% 5.5%; container-type: inline-size; }
.fotoletters::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, rgba(20,16,12,0) 45%, rgba(20,16,12,.42) 100%); }
.fotoletters__woorden { position: relative; z-index: 1; margin: 0; font-family: 'Anton', 'Heebo', Impact, sans-serif; font-weight: 400; text-transform: uppercase; font-size: 11.5cqw; line-height: 1.08; text-align: right; color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,.18); }
.fotoletters__woorden span { display: block; }
.fotoletters__woorden span + span { margin-top: .08em; }
.fotoletters__woorden .accent { color: var(--magenta); }
.fotoletters--banner { aspect-ratio: 21 / 8; }
.fotoletters--links { justify-content: flex-start; }
.fotoletters--links .fotoletters__woorden { text-align: left; }
.fotoletters--links::after { background: linear-gradient(160deg, rgba(20,16,12,0) 45%, rgba(20,16,12,.42) 100%); }
.fotoletters--banner .fotoletters__woorden { font-size: 8.5cqw; }

.artikel { max-width: 760px; margin: 0 auto; padding: 0 24px; font-size: 18px; line-height: 1.7; }
.artikel p { margin: 0 0 20px; }
.artikel h2, .artikel h3 { text-wrap: wrap; }
.artikel h2 { font-weight: 600; font-size: clamp(22px, 2.4vw, 25px); line-height: 1.25; margin: 48px 0 16px; padding-top: 22px; border-top: 1px solid var(--lijn); }
.artikel h3 { font-weight: 600; font-size: clamp(19px, 2vw, 21px); color: var(--magenta-tekst); margin: 32px 0 10px; }
.artikel h2 + h3 { margin-top: 8px; }
/* Kopregel (Lise 22 okt): zwart met lijn = hoofdstuk (kop 2 in Notion), roze = tussenkop (kop 3). Geen cijfer-rondjes. */
.artikel strong { font-weight: 600; }
.artikel a { color: var(--magenta-tekst); font-weight: 500; text-underline-offset: 3px; }
.artikel ul, .artikel ol { margin: 0 0 20px; padding-left: 22px; }
.artikel li { margin-bottom: 8px; }
.artikel img { display: block; height: auto; border-radius: var(--radius); margin: 36px auto; }
.artikel blockquote { font-family: var(--font-head); font-style: italic; font-weight: 600; font-size: clamp(20px, 2.4vw, 25px); line-height: 1.4; color: var(--magenta-tekst); border-left: 3px solid var(--magenta); padding: 4px 0 4px 24px; margin: 36px 0; }
.artikel .kort-antwoord { background: var(--beige); border-left: 6px solid var(--magenta); border-radius: 2px; padding: 22px 28px; margin: 0 0 20px; }
.artikel .kort-antwoord p:last-child { font-size: 17px; line-height: 1.6; }

.leesook { max-width: 760px; margin: 0 auto; padding: clamp(40px, 5vw, 64px) 24px 0; }
.leesook__kop { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.leesook__lijn { flex: 1; height: 1px; background: var(--lijn); }
.leesook__titel { font-family: var(--font-head); font-weight: 600; font-size: 19px; }
.leesook__kaarten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.mk .leesook__kaart, .leesook__kaart { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--lijn); border-radius: var(--radius); padding: 0 20px 18px; overflow: hidden; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s, box-shadow .2s; }
.leesook__kaart:hover { border-color: var(--magenta); transform: translateY(-2px); box-shadow: 0 8px 22px rgba(240,86,222,.10); }
.leesook__beeld { margin: 0 -20px 16px; border-radius: 0; padding: 6% 7%; }
.leesook__beeld .fotoletters__woorden { font-size: 13cqw; }
.leesook__kaart > :first-child:not(.leesook__beeld) { margin-top: 22px; }
.leesook__cat { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--magenta-tekst); margin-bottom: 8px; }
.leesook__kaarttitel { font-family: var(--font-head); font-weight: 600; font-size: 16px; line-height: 1.35; margin-bottom: 8px; }
.leesook__oms { font-size: 14px; line-height: 1.5; color: var(--tekst-mut); padding-bottom: 14px; }
.leesook__link { font-size: 13px; font-weight: 600; color: var(--groen); display: inline-flex; align-items: center; gap: 5px; margin-top: auto; }
.leesook__link svg { width: 14px; height: 14px; }

.artcta { max-width: 1000px; margin: 0 auto; padding: clamp(40px, 5vw, 72px) 24px clamp(48px, 6vw, 80px); }
.artcta__kaart { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(24px, 3.5vw, 44px); align-items: center; background: var(--beige); border: 1px solid var(--lijn); border-radius: var(--radius); padding: clamp(28px, 4vw, 44px); }
.artcta h2 { font-weight: 600; font-size: clamp(23px, 3vw, 32px); line-height: 1.25; margin: 0 0 12px; }
.artcta p { font-size: 16px; }
.artcta .artcta__body { font-size: 18px; }
.artcta__lijst { list-style: none; margin: 0 0 16px; padding: 0; }
.artcta__lijst li { position: relative; padding-left: 28px; margin: 0 0 8px; font-size: 16px; }
.artcta__lijst li::before { content: "✓"; position: absolute; left: 0; color: var(--magenta); font-weight: 700; }
.artcta__klein { font-size: 14px !important; color: var(--tekst-mut); margin: 18px 0 0; }
.artcta__klein a { color: var(--groen); font-weight: 600; }
.artcta__beeld { display: block; text-decoration: none; }
.artcta__foto { display: block; aspect-ratio: 16 / 10; border-radius: var(--radius); background: center / cover no-repeat; box-shadow: 0 16px 38px rgba(0,0,0,.14); }
.artcta__label { display: block; margin-top: 12px; text-align: center; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; font-size: 12px; color: var(--koraal); }
@media (max-width: 768px) {
  .leesook__kaarten { grid-template-columns: 1fr; }
  .artcta__kaart { grid-template-columns: 1fr; }
  .artcta__beeld { order: -1; }
  .artikel { font-size: 17px; padding: 0 16px; }
  .artkop__wrap, .artbanner, .leesook { padding-left: 16px; padding-right: 16px; }
}

/* ---------- Recept ---------- */
/* Huisstijl (feedback Lise 22 okt: minder rond, minder AI): rechte vlakken, lijnen, Anton-cijfers, geen pillen of rondjes. */
.artbanner--recept { max-width: 1000px; }
.recept__foto::after { display: none; }
/* Recept zonder (echte) foto: beige band met de naam in blokletters */
.receptkop { max-width: 1000px; margin: clamp(28px, 4vw, 48px) auto 40px; padding: 0 24px; }
.receptband { background: var(--beige); border-left: 6px solid var(--magenta); padding: clamp(28px, 5vw, 56px) clamp(24px, 5vw, 56px) clamp(20px, 3vw, 32px); container-type: inline-size; }
.receptband h1.fotoletters__woorden { text-align: left; color: var(--tekst); text-shadow: none; font-size: clamp(44px, 9cqw, 92px); margin: 0 0 28px; }
.receptband .recept__kenmerken { border-color: #e2d9cb; }
.recept__kenmerken { display: flex; flex-wrap: wrap; margin: 0; padding: 14px 0; border-top: 1px solid var(--lijn); border-bottom: 1px solid var(--lijn); font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--tekst); }
.recept__kenmerken span + span::before { content: ""; display: inline-block; width: 1px; height: 12px; background: var(--magenta); margin: 0 14px; vertical-align: -1px; }
.recept { max-width: 1000px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.recept h2 { font-weight: 600; font-size: 26px; margin: 0 0 18px; padding-bottom: 12px; border-bottom: 2px solid var(--magenta); }
.recept__ingredienten { background: var(--beige); padding: 26px 28px 18px; border-radius: 2px; position: sticky; top: 24px; }
.recept__ingredienten ul { list-style: none; margin: 0; padding: 0; }
.recept__ingredienten li { padding: 9px 0 9px 20px; border-bottom: 1px solid var(--lijn); position: relative; font-size: 16px; line-height: 1.45; }
.recept__ingredienten li:last-child { border-bottom: 0; }
.recept__ingredienten li::before { content: ""; position: absolute; left: 0; top: 17px; width: 7px; height: 7px; background: var(--magenta); }
.recept__bereiding ol { list-style: none; margin: 0; padding: 0; }
.recept__bereiding li { display: grid; grid-template-columns: 56px 1fr; gap: 8px; padding: 18px 0; border-bottom: 1px solid var(--lijn); font-size: 18px; line-height: 1.7; }
.recept__bereiding li:first-child { padding-top: 4px; }
.recept__nr { font-family: 'Anton', 'Heebo', Impact, sans-serif; font-size: 34px; line-height: 1; color: var(--magenta); }
@media (max-width: 768px) {
  .recept { grid-template-columns: 1fr; padding: 0 16px; }
  .recept__ingredienten { position: static; }
  .recept__bereiding li { grid-template-columns: 44px 1fr; font-size: 17px; }
  .recept__nr { font-size: 28px; }
}

/* Vragenblok bovenaan een artikel: "Dit artikel beantwoordt drie vragen" (citeerbaar voor Google en AI-zoekers) */
.artikel .vragenblok { background: var(--beige); border-left: 6px solid var(--magenta); border-radius: 2px; padding: 24px 28px 8px; margin: 0 0 40px; }
.vragenblok__vraag { display: flex; gap: 16px; margin-bottom: 18px; }
.vragenblok__nr { flex: none; width: 32px; font-family: 'Anton', 'Heebo', Impact, sans-serif; font-size: 26px; line-height: 1; color: var(--magenta); }
.artikel .vragenblok h2 { font-size: 20px; margin: 0 0 6px; padding: 0; border: 0; }
.artikel .vragenblok p { font-size: 16px; line-height: 1.6; margin: 0; }
.artikel .vragenblok .vragenblok__kort { font-size: 17px; margin: 0 0 20px; padding-bottom: 18px; border-bottom: 1px solid #e2d9cb; }

/* Succesverhaal: de eigen foto van de deelnemer bovenaan, niet uitgerekt */
.succesfoto { margin: 0; text-align: center; }
.succesfoto img { display: inline-block; max-height: 460px; width: auto; max-width: 100%; border-radius: 2px; }
.succesfoto figcaption { font-size: 14px; color: var(--tekst-mut); margin-top: 8px; }

/* Blogoverzicht: meer kaarten per groep, ruimte tussen de groepen */
.blogoverzicht { max-width: 1000px; }
.blogoverzicht + .blogoverzicht { padding-top: 48px; }

/* Kajabi-pagina's: elementen die daar met een script infaden, staan hier gewoon zichtbaar */
.codepagina [class*="-fade"] { opacity: 1 !important; transform: none !important; }

/* Achtergrondfoto uit de Kajabi-sectie-instellingen; vast (parallax) op grote schermen, gewoon op telefoon */
.kj-sectie { background-size: cover; background-position: center; background-repeat: no-repeat; }
.kj-sectie--vast { background-attachment: fixed; }
/* Telefoons (vooral iPhone) negeren background-attachment: fixed. Daar ligt de foto in een vaste laag achter de sectie,
   die met clip-path alleen binnen de sectie zichtbaar is: zo blijft de achtergrond ook op de telefoon staan (Lise 5 nov). */
@media (max-width: 900px), (hover: none) {
  .kj-sectie--vast { background-attachment: scroll; position: relative; isolation: isolate; clip-path: inset(0); }
  .kj-sectie--vast::before { content: ""; position: fixed; inset: 0; z-index: -1; background-image: inherit; background-size: cover; background-position: center; }
}

/* Blogoverzicht: zoeken en filteren (Lise 5 nov) */
.artkop__intro { max-width: 680px; margin: 14px auto 0; color: var(--tekst-mut); font-size: 17px; }
.blogfilter { max-width: 1100px; margin: 8px auto 0; padding: 0 24px; text-align: center; }
.blogfilter__zoek { width: 100%; max-width: 520px; font: 16px var(--font-body); padding: 14px 16px; border: 1px solid var(--lijn); border-radius: var(--radius); background: var(--wit); }
.blogfilter__zoek:focus { outline: 2px solid var(--magenta); outline-offset: 0; }
.blogfilter__knoppen { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 16px; }
.blogfilter__knop { font: 600 14px var(--font-body); padding: 9px 18px; border: 1.5px solid var(--magenta); border-radius: var(--radius); background: var(--wit); color: var(--tekst); cursor: pointer; }
.blogfilter__knop:hover, .blogfilter__knop.is-actief { background: var(--magenta); color: #fff; }
.blogfilter__geen { margin-top: 26px; color: var(--tekst-mut); }
.blogoverzicht h2.leesook__titel { margin: 0; font-size: 19px; line-height: 1.3; }
/* Tegel voor een succesverhaal zonder hoofdfoto: geen gezicht, wel naam en kilo's */
.succestegel { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; background: var(--beige, #f7f1e8); border-top: 4px solid var(--magenta); text-align: center; }
.succestegel__label { font: 700 11px var(--font-body); letter-spacing: .16em; text-transform: uppercase; color: var(--magenta-tekst); }
.succestegel__kilo { font-family: 'Anton', 'Heebo', Impact, sans-serif; font-size: 46px; line-height: 1.05; color: var(--magenta); }
.succestegel__naam { font-family: var(--font-head); font-style: italic; font-size: 20px; color: var(--tekst); }
.leesook__beeld:not(.fotoletters) { aspect-ratio: 16 / 9; background: var(--tekst) center / cover no-repeat; }
.leesook__beeld.succestegel { background: var(--beige); }
.succestegel__icoon { color: var(--magenta); margin: 4px 0 2px; }
.leesook__kaart[hidden], .blogoverzicht[hidden] { display: none !important; }
.codepagina { overflow-x: clip; }
/* Footer onderaan, ook bij een korte pagina (Lise 5 nov) */
body { display: flex; flex-direction: column; min-height: 100vh; }
body > main { flex: 1 0 auto; }

/* Podcastoverzicht (Lise 5 nov): hoes, opvallend adviesblok, alle afleveringen met zoeken en filter */
.podhero { background: var(--beige); padding: clamp(36px, 6vw, 80px) 24px; }
.podhero__wrap { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: minmax(220px, 400px) 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.podhero__hoes { width: 100%; height: auto; border-radius: var(--radius); box-shadow: 0 20px 48px rgba(0,0,0,.18); display: block; }
.podhero h1 { margin: 6px 0 14px; }
.podhero__intro p { font-size: 17px; }
.podhero__knoppen { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.podadvies { background: var(--magenta); color: #fff; padding: clamp(40px, 6vw, 70px) 24px; text-align: center; }
.podadvies__wrap { max-width: 720px; margin: 0 auto; }
.podadvies .podadvies__getal { font-family: 'Anton', 'Heebo', Impact, sans-serif; font-size: clamp(40px, 6vw, 68px); line-height: 1; text-transform: uppercase; margin: 0 0 6px; }
.podadvies h2 { color: #fff; margin: 0 0 12px; font-size: clamp(26px, 3vw, 34px); }
.podadvies p { font-size: 18px; margin: 0 0 24px; }
.podadvies .podadvies__knop { background: #fff; color: var(--magenta-tekst); }
.podadvies .podadvies__knop:hover { background: var(--beige); }
.podlijst { max-width: 900px; margin: 0 auto; padding: 0 24px; text-align: center; }
.podlijst__kop { margin: 0 0 18px; }
.podlijst__teller { font-size: 14px; color: var(--tekst-mut); margin: 18px 0 6px; }
.podlijst .afl-lijst { text-align: left; }
.afl-lijst li[hidden] { display: none; }
@media (max-width: 760px) { .podhero__wrap { grid-template-columns: 1fr; } .podhero__hoes { max-width: 280px; margin: 0 auto; } }
/* Bedankpagina (Lise 7 nov) */
.bedankt { background: var(--beige); padding: clamp(40px, 7vw, 90px) 24px; }
.bedankt__kaart { max-width: 680px; margin: 0 auto; background: var(--wit); border-top: 4px solid var(--magenta); box-shadow: 0 18px 50px rgba(0,0,0,.08); padding: clamp(28px, 5vw, 56px); text-align: center; border-radius: var(--radius); }
.bedankt__kaart h1 { margin: 6px 0 16px; font-size: clamp(26px, 3vw, 36px); }
.bedankt__kaart .tekst p { font-size: 17px; }

/* Afleveringspagina's (Lise 7 nov): minder witruimte, advies-kaart, nette knoppen */
.sectie.pc-sectie { padding: 18px 0; }
.sectie.pc-sectie--eerste { padding-top: 28px; }
.pc-sectie .kort-antwoord { margin-top: 0; }
.pc-sectie .identiteit { margin: 0; }
.pc-sectie .samenvatting > :first-child { margin-top: 0; }
.sectie.pc-luisterook { padding: clamp(36px, 5vw, 56px) 0; }
.pod-advieskaart { display: flex; gap: 22px; align-items: center; justify-content: space-between; margin-top: 26px; padding: 22px 24px; background: var(--magenta-s); border-left: 3px solid var(--magenta); }
.pod-advieskaart p { margin: 0; }
.pod-advieskaart .pod-advieskaart__kop { font-family: var(--font-head); font-size: 19px; font-weight: 600; margin-bottom: 4px; }
.pod-advieskaart .knop { flex: 0 0 auto; }
@media (max-width: 640px) { .pod-advieskaart { flex-direction: column; align-items: flex-start; } }
.knop--rand { background: var(--wit); color: var(--magenta-tekst); border: 1.5px solid var(--magenta); }
.knop--rand:hover { background: var(--magenta-s); }
.podhero__knoppen .knop { display: inline-flex; align-items: center; }
/* Afleveringen, ronde 2 (Lise 7 nov) */
.pc-inhoudkop { margin: 0 0 14px !important; }
.pc-sectie .vragen > h2:first-child, .vragen h2:first-child { margin-top: 6px; }
.sectie.pc-sectie.vragen-sectie { padding-top: 6px; }
.pc-luisterook { background: var(--beige); padding: clamp(40px, 6vw, 72px) 24px; }
.pc-luisterook__wrap { max-width: 1100px; margin: 0 auto; }
.pc-luisterook__kaarten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 8px; }
.pc-lk { display: grid; grid-template-columns: 96px 1fr; grid-template-rows: auto 1fr auto; column-gap: 14px; background: #a3002f; color: #fff; text-decoration: none; padding: 14px; border-radius: var(--radius); box-shadow: 0 10px 26px rgba(0,0,0,.14); transition: transform .2s; }
.pc-lk:hover { transform: translateY(-3px); }
.pc-lk img { grid-row: 1 / 4; width: 96px; height: 96px; object-fit: cover; border-radius: 6px; }
.pc-lk__nr { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
.pc-lk__titel { font-family: var(--font-head); font-weight: 600; font-size: 16px; line-height: 1.3; margin-top: 4px; }
.pc-lk__luister { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-top: 8px; }
.pc-luisterook .pod-advieskaart { background: var(--wit); }
@media (max-width: 860px) { .pc-luisterook__kaarten { grid-template-columns: 1fr; } }
/* Afleveringen, ronde 3 (Lise 7 nov) */
.pc-inhoudkop { color: var(--magenta); font-size: clamp(24px, 2.6vw, 30px); padding-bottom: 10px; border-bottom: 2px solid var(--magenta-s); }
.pc-sectie .kort-antwoord .eyebrow { font-size: 11px; letter-spacing: .14em; }
.identiteit { display: flex; gap: 14px; align-items: center; padding: 14px 0; border-top: 1px solid var(--lijn); border-bottom: 1px solid var(--lijn); }
.identiteit img { flex: 0 0 56px; width: 56px; height: 56px; object-fit: cover; border-radius: 4px; }
.identiteit p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--tekst-mut); }
.identiteit p strong { color: var(--tekst); }
.pc-luisterook > .pc-luisterook__wrap > .eyebrow { text-align: center; font-size: 15px; margin-bottom: 14px; }
.sectie.pc-transcript { padding-top: clamp(28px, 4vw, 44px); }
/* Afleveringen, ronde 4 (Lise 7 nov) */
.pc-lk-kop { text-align: center; margin: 0 0 20px; }
.transcript .eyebrow + h2 { margin-top: 0; }
.artcta:has(+ .pc-transcript) { padding-bottom: 0; }
.artcta + .pc-transcript.sectie { padding-top: clamp(40px, 5vw, 72px); }
/* Luister ook op wit, los van de beige hoofdstukken (Lise 7 nov) */
.pc-luisterook { background: var(--wit); }
.pc-luisterook .pod-advieskaart { background: var(--magenta-s); }
/* Afleveringen, ronde 5 (Lise 7 nov) */
.pc-luisterook__kaarten { margin-bottom: 12px; }
.pc-luisterook .pod-advieskaart { margin-top: 32px; }
.pc-inhoudkop { color: var(--tekst); border-bottom: 0; padding-bottom: 0; }
.swband { background: var(--magenta-s); padding: clamp(32px, 5vw, 56px) 24px; }
.swband__wrap { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 300px 1fr; gap: clamp(24px, 4vw, 48px); align-items: center; }
.swband__beeld { display: block; aspect-ratio: 4 / 3; background: center / cover no-repeat; border-radius: var(--radius); box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.swband h2 { margin: 4px 0 10px; }
.swband p { margin: 0 0 18px; }
@media (max-width: 760px) { .swband__wrap { grid-template-columns: 1fr; } .swband__beeld { max-width: 360px; } }
.swband + .pc-transcript.sectie { padding-top: clamp(40px, 5vw, 64px); }
.pc-lk-kop { margin-bottom: 30px; }
/* Afleveringen, ronde 6 (Lise 7 nov) */
.pc-oudprogramma { margin: 16px 0 0; padding: 12px 16px; background: var(--wit); border-left: 3px solid var(--magenta); font-size: 15px; }
.pc-oudprogramma a { font-weight: 600; }
.pc-lk-kop { margin-top: -8px; margin-bottom: 40px; }
.pc-luisterook { padding-bottom: clamp(56px, 7vw, 88px); }

/* Hero in fotoletterstijl (design system: Hero / OptInPagina) */
.hero-fl { position: relative; min-height: 600px; background: var(--tekst) center / cover no-repeat; display: flex; align-items: flex-end; container-type: inline-size; color: #fff; overflow: hidden; }
.hero-fl::after { content: ""; position: absolute; inset: 0; background: linear-gradient(20deg, rgba(20,16,12,.62) 0%, rgba(20,16,12,.18) 50%, rgba(20,16,12,0) 75%); }
.hero-fl__inhoud { position: relative; z-index: 1; width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px 64px; }
.hero-fl__eyebrow { font: 700 13px/1 var(--font-body) !important; letter-spacing: .16em !important; text-transform: uppercase; color: #fff !important; margin: 0 0 16px !important; opacity: .9; }
.hero-fl__titel { font-family: 'Anton', 'Heebo', Impact, sans-serif !important; font-weight: 400 !important; text-transform: uppercase; font-size: clamp(56px, 8.6cqw, 132px) !important; line-height: .9 !important; letter-spacing: -.005em; margin: 0 !important; color: #fff !important; text-shadow: 0 2px 18px rgba(0,0,0,.18); }
.hero-fl__titel span { display: block; }
.hero-fl__titel .accent { color: var(--magenta) !important; }
.hero-fl__sub { font: italic 400 22px/1.4 var(--font-head) !important; color: #fff !important; margin: 18px 0 26px !important; max-width: 560px; }
@media (max-width: 760px) { .hero-fl { min-height: 480px; } .hero-fl__inhoud { padding-bottom: 40px; } .hero-fl__sub { font-size: 18px !important; } }

/* Opt-in: wat je krijgt met foto's naast elkaar, formulier met cover op beige */
.lm-intro { max-width: 760px; }
.lm-intro--midden { margin: 0 auto 36px; text-align: center; }
.lm-dagen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.lm-dag { margin: 0; background: var(--wit); border: 1px solid var(--lijn); border-radius: var(--radius); overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,.05); }
.lm-dag__foto { display: block; aspect-ratio: 4 / 3; background: center / cover no-repeat; }
.lm-dag figcaption { padding: 20px 22px 24px; }
.lm-dag h3 { margin: 0 0 8px; font-size: 21px; }
.lm-dag p { margin: 0; font-size: 16px; color: var(--tekst-mut); }
@media (max-width: 860px) { .lm-dagen { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; } }
.lm-aanmeld { max-width: 1000px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.lm-aanmeld--zonder { grid-template-columns: 1fr; max-width: 560px; }
.lm-aanmeld__cover { width: 100%; border-radius: 14px; box-shadow: 0 20px 48px rgba(0,0,0,.16); }
.lm-aanmeld .lm-form { background: none; box-shadow: none; padding: 0; max-width: none; }
.lm-aanmeld .lm-form h2 { margin: 0 0 10px; }
.lm-aanmeld .lm-form form { display: flex; flex-direction: column; gap: 12px; margin-top: 18px; }
.lm-aanmeld .lm-form input { font: 16px var(--font-body); padding: 14px 16px; border: 1px solid #ddd5c8; border-radius: var(--radius); background: var(--wit); }
.lm-aanmeld .lm-form input:focus { outline: 2px solid var(--magenta); }
.lm-aanmeld .lm-form .knop { width: 100%; }
@media (max-width: 760px) { .lm-aanmeld { grid-template-columns: 1fr; } .lm-aanmeld__cover { max-width: 320px; margin: 0 auto; } }

/* Bedankpagina e-book (design system: BedanktEbookPagina) */
.bd-hero { background: var(--beige); padding: clamp(56px, 9vw, 110px) 24px clamp(48px, 8vw, 96px); }
.bd-hero__wrap { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.bd-hero__wrap--zonder { grid-template-columns: 1fr; max-width: 760px; }
.bd-hero__cover { width: 100%; border-radius: 14px; box-shadow: 0 24px 56px rgba(0,0,0,.18); }
.bd-hero__label { font-family: var(--font-head); text-transform: uppercase; letter-spacing: .14em; font-size: 13px; color: #fe686a; margin: 0 0 14px; }
.bd-hero__kop { font-family: 'Heebo', sans-serif !important; font-weight: 800 !important; text-transform: uppercase; font-size: clamp(34px, 5vw, 64px) !important; line-height: .9 !important; letter-spacing: -.02em; color: #46443d !important; margin: 0 0 18px !important; }
.bd-hero__kop span { color: #fe686a; }
.bd-hero__tekst p { font-size: 18px; line-height: 1.6; color: #5b574f; margin: 0 0 28px; max-width: 48ch; }
.bd-knop { display: inline-block; font: 700 18px var(--font-body); color: #fff !important; background: #fe686a; border-radius: 999px; padding: 18px 38px; text-decoration: none !important; }
.bd-knop:hover { background: #ef5557; }
@media (max-width: 760px) { .bd-hero__wrap { grid-template-columns: 1fr; } .bd-hero__cover { max-width: 300px; } }
/* E-bookcover (design system: Ebookcover) */
.ebook { position: relative; aspect-ratio: 3 / 4; border-radius: 4px; overflow: hidden; background: var(--tekst) center / cover no-repeat; box-shadow: 0 18px 40px rgba(0,0,0,.18); display: flex; flex-direction: column; justify-content: space-between; padding: 7% 7% 8%; container-type: inline-size; color: #fff; }
.ebook::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,16,12,.55) 0%, rgba(20,16,12,0) 55%); }
.ebook > * { position: relative; z-index: 1; }
.ebook p, .ebook span { color: #fff !important; margin: 0 !important; }
.ebook .ebook__merk { font: 800 4.6cqw/1 var(--font-body) !important; letter-spacing: .02em; text-transform: uppercase; text-shadow: 0 1px 8px rgba(0,0,0,.35); }
.ebook .ebook__merk span { font-weight: 300 !important; }
.ebook .ebook__label { display: inline-block; font: 700 3.4cqw/1 var(--font-body) !important; letter-spacing: .14em !important; text-transform: uppercase; background: #fff; color: var(--magenta-tekst) !important; padding: .6em 1em; border-radius: 999px; margin-top: 4% !important; }
.ebook .ebook__titel { font: 800 13cqw/.86 var(--font-body) !important; letter-spacing: -.015em !important; text-transform: uppercase !important; }
.ebook .ebook__titel span { display: block; }
.ebook .ebook__titel .accent { color: var(--magenta) !important; }
.lm-aanmeld .ebook, .bd-hero .ebook { width: 100%; max-width: 420px; }
.lm-dagen--vier { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 960px) { .lm-dagen--vier { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.hero-fl__titel { font-size: clamp(46px, 6.6cqw, 104px) !important; }

/* Opt-inpagina volgens het design system (OptInPagina, zomers inspiratieboek) */
.oi-hero { position: relative; min-height: 560px; background: #2b2b2b center 22% / cover no-repeat; display: flex; align-items: center; justify-content: center; padding: 80px 24px; }
.oi-hero::before { content: ""; position: absolute; inset: 0; background: rgba(20,15,12,.38); }
.oi-hero__inhoud { position: relative; z-index: 1; text-align: center; max-width: 1080px; }
.oi-hero__sub { font: italic 500 clamp(18px, 2vw, 24px) var(--font-head); color: #dcfdd8; margin: 0 0 14px; }
.oi-hero__titel { font-family: 'Heebo', sans-serif !important; font-weight: 800 !important; text-transform: uppercase; font-size: clamp(44px, 7vw, 96px) !important; line-height: .86 !important; letter-spacing: -.02em; color: #fff !important; margin: 0 !important; text-shadow: 0 2px 28px rgba(20,15,12,.5); }
.oi-hero__titel span { color: #ff9a9b; }
.oi-label { font-family: var(--font-head); text-transform: uppercase; letter-spacing: .14em; font-size: 13px; color: #fe686a; margin: 0 0 12px; }
.oi-knop { display: inline-block; font: 700 17px var(--font-body); color: #fff !important; background: #fe686a; border: 0; border-radius: 999px; padding: 16px 34px; text-decoration: none !important; cursor: pointer; }
.oi-knop:hover { background: #ef5557; }
.oi-aanmeld { background: var(--beige); padding: clamp(48px, 7vw, 96px) 24px; }
.oi-aanmeld__wrap { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.oi-aanmeld .ebook { max-width: 420px; }
.oi-form { text-align: center; }
.oi-form h2 { font-family: 'Heebo', sans-serif; font-weight: 700; font-size: clamp(22px, 2.4vw, 28px); color: #46443d; margin: 0 0 8px; }
.oi-form__tekst { font-size: 15px; color: #5b574f; margin: 0 0 18px; }
.oi-form form { display: flex; flex-direction: column; gap: 14px; align-items: center; }
.oi-form input[type=text], .oi-form input[type=email] { width: 100%; font: 16px var(--font-body); padding: 14px 16px; border: 1px solid #ddd5c8; border-radius: 2px; background: var(--wit); }
.oi-form input:focus { outline: 2px solid #fe686a; }
.oi-form__klein { font-size: 13px; font-style: italic; color: #8a857c; margin: 4px 0 0; }
.oi-inhoud { background: var(--wit); padding: clamp(56px, 8vw, 104px) 24px; }
.oi-inhoud__wrap { max-width: 1140px; margin: 0 auto; }
.oi-kop { font-family: 'Heebo', sans-serif !important; font-weight: 800 !important; text-transform: uppercase; font-size: clamp(32px, 5vw, 56px) !important; line-height: .94 !important; letter-spacing: -.015em; color: #46443d !important; margin: 0 0 16px !important; }
.oi-kop span { color: #fe686a; }
.oi-intro { font-size: 18px; line-height: 1.6; color: #5b574f; max-width: 60ch; margin: 0 0 36px; }
.oi-vinken { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; }
.oi-vink { display: flex; gap: 14px; align-items: flex-start; }
.oi-vink__rond { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; background: #ffe0e0; color: #f24d50; display: flex; align-items: center; justify-content: center; font-size: 20px; }
.oi-vink h3, .oi-kaart h3 { font: 700 18px var(--font-body); color: #46443d; margin: 0 0 4px; }
.oi-vink p, .oi-kaart p { font-size: 15px; line-height: 1.55; color: #5b574f; margin: 0; }
.oi-kaarten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.oi-kaarten--vier { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.oi-kaart { margin: 0; background: #fbf7f0; border-radius: 6px; overflow: hidden; box-shadow: 0 10px 28px rgba(0,0,0,.08); }
.oi-kaart__foto { display: block; aspect-ratio: 4 / 3; background: center / cover no-repeat; }
.oi-kaart figcaption { padding: 18px 20px 22px; }
.oi-mieke { background: var(--beige); padding: clamp(48px, 7vw, 96px) 24px 0; }
.oi-mieke__wrap { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 56px); align-items: end; }
.oi-mieke__foto { width: 100%; max-width: 380px; display: block; }
.oi-mieke__wrap > div { padding-bottom: clamp(48px, 7vw, 96px); }
.oi-mieke__citaat { font: italic 500 clamp(26px, 3.4vw, 40px)/1.18 var(--font-head); color: #5a6650; margin: 0 0 24px; }
.oi-mieke__tekst p { font-size: 17px; line-height: 1.65; color: #5b574f; max-width: 52ch; }
.oi-mieke__groet { font: italic 20px var(--font-head); color: #46443d; margin: 14px 0 28px; }
.ebook .ebook__titel .koraal { color: #fe686a !important; }
.bd-hero .ebook { max-width: 420px; }
@media (max-width: 960px) { .oi-kaarten--vier { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .oi-aanmeld__wrap, .oi-mieke__wrap { grid-template-columns: 1fr; } .oi-aanmeld .ebook { max-width: 300px; margin: 0 auto; } .oi-kaarten { grid-template-columns: 1fr; } .oi-mieke__foto { max-width: 260px; margin: 0 auto; } }
.lm-aanmeld__cover--vrij { box-shadow: none; border-radius: 0; filter: drop-shadow(0 22px 40px rgba(0,0,0,.2)); max-width: 380px; }
.oi-aanmeld .lm-form.oi-form { background: none !important; box-shadow: none !important; padding: 0 !important; max-width: 520px !important; width: 100%; margin: 0 auto; border: 0 !important; }
/* Ronde 3 opt-in (Lise 7 nov): titelaccent in koraal, knop onder "wat je krijgt" in het midden */
.oi-inhoud__wrap > p:last-child { text-align: center; }
/* Elke regel van de titel op een eigen regel, nooit afgebroken (Lise 7 nov: "Van XL naar S" op één regel) */
.oi-hero__titel .oi-regel { display: block; white-space: nowrap; color: #fff !important; }
.oi-hero__titel .oi-regel--accent { color: #fe686a !important; }
@media (max-width: 560px) { .oi-hero__titel .oi-regel { white-space: normal; } }
.lm-aanmeld__cover--vrij { filter: none; box-shadow: 0 18px 40px rgba(0,0,0,.18); border-radius: 4px; max-width: 400px; width: 100%; }
/* Opt-in zonder hoofdfoto: het boek zelf in de hero (eerste hoofdstukken) */
.oi-hero--boek { background: #3d4a35; min-height: 0; padding: clamp(48px, 7vw, 88px) 24px; }
.oi-hero--boek::before { display: none; }
.oi-hero__boekwrap { position: relative; z-index: 1; max-width: 1100px; width: 100%; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.oi-hero--boek .oi-hero__inhoud { text-align: left; }
.oi-hero--boek .oi-hero__titel { font-size: clamp(40px, 5.6vw, 76px) !important; text-shadow: none; margin-bottom: 28px !important; }
.oi-hero--boek .oi-hero__titel .oi-regel { white-space: normal; }
.oi-hero__boek { width: 100%; max-width: 380px; justify-self: center; display: block; border-radius: 4px; box-shadow: 0 24px 60px rgba(0,0,0,.45); transform: rotate(2deg); }
.oi-aanmeld__wrap--zonder { grid-template-columns: 1fr; }
@media (max-width: 760px) { .oi-hero__boekwrap { grid-template-columns: 1fr; } .oi-hero--boek .oi-hero__inhoud { text-align: center; } .oi-hero__boek { max-width: 240px; } }
.oi-hero--onder { min-height: 680px; align-items: flex-end; background-position: center 20%; padding-bottom: 56px; }
.oi-hero--onder::before { background: linear-gradient(180deg, rgba(20,15,12,0) 35%, rgba(20,15,12,.75) 100%); }
/* Kijkje in het boek: vier pagina's onder de vinklijst (OptInPagina, mk_inditboek) */
.oi-kijkje { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 44px; }
.oi-kijkje img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: top; border-radius: 12px; box-shadow: 0 10px 30px rgba(43,43,43,.14); display: block; background: #fff; }
@media (max-width: 760px) { .oi-kijkje { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } }
/* Boek-hero op beige in plaats van groen (Lise 7 nov); formulier eronder op wit */
.oi-hero--boek { background: var(--beige); }
.oi-hero--boek .oi-hero__titel .oi-regel { color: #2b2b2b !important; }
.oi-hero--boek .oi-hero__titel .oi-regel--accent { color: #fe686a !important; }
.oi-hero--boek .oi-hero__sub { color: #6d7a5e; }
.oi-hero--boek + .oi-aanmeld { background: #fff; }
.oi-hero__boek { box-shadow: 0 24px 60px rgba(43,43,43,.28); }
/* Ronde 7 nov avond */
.oi-hero__titel .oi-regel + .oi-regel--accent { margin-top: .1em; } /* puntjes op de Ë niet tegen de regel erboven */
.oi-inhoud--beige { background: var(--beige); }
.oi-hero--boek + .oi-aanmeld { background: #fff; }
.oi-kijkje { gap: 20px; margin-top: 48px; }
.oi-kijkje img { aspect-ratio: 3 / 4; }
.oi-aanmeld + .oi-mieke { background: #fff; } /* formulier en Even van mij niet allebei beige */
/* 6 punten: 3 boven 3, in het midden (Lise 7 nov) */
.oi-vinken--drie { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 960px; margin: 0 auto; }
@media (max-width: 760px) { .oi-vinken--drie { grid-template-columns: 1fr; } }
/* Foto van Mieke rechts als de boekcover er links boven staat: afwisselen */
@media (min-width: 761px) { .oi-mieke--rechts .oi-mieke__wrap { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } .oi-mieke--rechts .oi-mieke__foto { order: 2; justify-self: end; } }
/* Hoofdstukken: inhoud beige, formulier wit, daarna geen dubbel beige */
.oi-inhoud--beige + .oi-aanmeld { background: #fff; }
/* Tabellen in tekstpagina's (privacyverklaring) */
.tabel { overflow-x: auto; margin: 1.2em 0; }
.tabel table { width: 100%; border-collapse: collapse; font-size: .95em; }
.tabel th, .tabel td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid #e8e2d8; }
.tabel th { font-weight: 700; background: var(--beige); }
/* BedanktPagina uit het design system (programma, inspiratiemail, inloggen) */
.bp-hero { position: relative; min-height: 520px; display: flex; align-items: flex-end; padding: 72px 24px 64px; background: #2b2b2b center / cover no-repeat; }
.bp-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,15,12,.62) 0%, rgba(20,15,12,.25) 55%, rgba(20,15,12,0) 100%); }
.bp-hero__wrap { position: relative; z-index: 1; max-width: 1100px; width: 100%; margin: 0 auto; color: #fff; }
.bp-hero__label { font: 600 13px/1 'Heebo', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #dcfdd8; margin: 0 0 16px; }
.bp-hero__kop { font-family: 'Heebo', sans-serif !important; font-weight: 800 !important; text-transform: uppercase; font-size: clamp(40px, 6vw, 80px) !important; line-height: .9 !important; letter-spacing: -.02em; color: #fff !important; margin: 0 0 18px !important; max-width: 760px; }
.bp-hero__kop span { color: #fe686a; }
.bp-hero__sub { font: italic 500 clamp(17px, 1.8vw, 21px)/1.5 var(--font-head); color: #fff; margin: 0; max-width: 560px; }
.bp-hero .bp-knop { margin-top: 26px; }
.bp-knop { display: inline-block; background: #fe686a; color: #fff !important; font: 700 16px 'Heebo', sans-serif; padding: 15px 30px; border-radius: 999px; text-decoration: none !important; }
.bp-knop:hover { background: #f05456; }
.bp-sectie { padding: clamp(56px, 7vw, 96px) 24px; }
.bp-sectie--beige { background: var(--beige); }
.bp-wrap { max-width: 1100px; margin: 0 auto; }
.bp-label { font: 600 12px/1 'Heebo', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #fe686a; margin: 0 0 10px; }
.bp-kop { font-family: var(--font-head) !important; font-size: clamp(28px, 3.4vw, 40px) !important; margin: 0 0 28px !important; }
.bp-midden { text-align: center; }
.bp-kaarten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.bp-kaart { background: var(--beige); border-top: 4px solid #fe686a; border-radius: 12px; padding: 28px 24px; }
.bp-kaart:nth-child(2) { border-top-color: #F056DE; }
.bp-kaart__nr { display: inline-flex; width: 36px; height: 36px; border-radius: 50%; background: #fff; color: #fe686a; font: 700 16px 'Heebo', sans-serif; align-items: center; justify-content: center; margin-bottom: 14px; }
.bp-kaart h3 { font-family: var(--font-head) !important; font-size: 20px !important; margin: 0 0 8px !important; }
.bp-kaart p { margin: 0; font-size: 16px; line-height: 1.6; }
.bp-twee { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.bp-twee img { width: 100%; border-radius: 14px; display: block; }
.bp-tekst h3 { font-family: var(--font-head) !important; font-size: 21px !important; margin: 26px 0 8px !important; }
.bp-tekst p, .bp-tekst li { font-size: 16px; line-height: 1.65; }
.bp-tekst ol { padding-left: 20px; }
.bp-tip { display: flex; gap: 12px; align-items: flex-start; border-bottom: 1px solid #e8e2d8; padding: 12px 0; }
.bp-tip__ic { flex: 0 0 26px; height: 26px; border-radius: 50%; background: #dcfdd8; color: #3d4a35; font: 700 13px/26px 'Heebo', sans-serif; text-align: center; }
.bp-tip p { margin: 0; }
.bp-faq { max-width: 760px; margin: 0 auto; }
.bp-faq details { border-bottom: 1px solid #e8e2d8; padding: 18px 0; }
.bp-faq summary { font: 600 18px var(--font-head); cursor: pointer; list-style: none; position: relative; padding-right: 32px; }
.bp-faq summary::after { content: "+"; position: absolute; right: 0; top: -2px; color: #fe686a; font-size: 24px; }
.bp-faq details[open] summary::after { content: "–"; }
.bp-faq details p { margin: 12px 0 0; line-height: 1.65; }
.bp-mieke { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 56px); align-items: end; max-width: 900px; margin: 0 auto; }
.bp-mieke img { width: 100%; max-width: 320px; display: block; }
.bp-mieke__zin { font: italic 500 22px/1.5 var(--font-head); color: #F056DE; margin: 0 0 14px; }
.bp-mieke__naam { font: italic 500 22px var(--font-head); color: #6d7a5e; margin: 0 0 clamp(40px, 6vw, 80px); }
@media (max-width: 760px) { .bp-kaarten, .bp-twee, .bp-mieke { grid-template-columns: 1fr; } .bp-hero { min-height: 460px; } .bp-mieke img { max-width: 240px; } }
/* Startweek-blok onder de bedankpagina's (gedeelde tekst uit Notion), in de stijl van de BedanktPagina */
.bd-sw { background: #fff; padding: clamp(56px, 7vw, 96px) 24px; }
.bd-sw__wrap { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.bd-sw__foto { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 30% center; border-radius: 16px; display: block; box-shadow: 0 20px 50px rgba(43,43,43,.14); }
.bd-sw__label { display: inline-block; background: #dcfdd8; color: #3d4a35; font: 700 13px/1 'Heebo', sans-serif; letter-spacing: .08em; text-transform: uppercase; padding: 10px 16px; border-radius: 999px; margin: 0 0 18px; }
.bd-sw__kop { font-family: var(--font-head) !important; font-size: clamp(28px, 3.2vw, 40px) !important; line-height: 1.15 !important; margin: 0 0 10px !important; }
.bd-sw__sub { font: italic 500 21px/1.4 var(--font-head); color: #fe686a; margin: 0 0 16px; }
.bd-sw__punten { list-style: none; padding: 0; margin: 18px 0; }
.bd-sw__punten li { display: flex; gap: 12px; margin: 0 0 10px; line-height: 1.55; }
.bd-sw__punten li > span:first-child { flex: 0 0 26px; height: 26px; border-radius: 50%; background: #ffe3e3; color: #fe686a; font-weight: 700; text-align: center; line-height: 26px; }
@media (max-width: 760px) { .bd-sw__wrap { grid-template-columns: 1fr; } .bd-sw__foto { aspect-ratio: 16 / 10; } }
.bd-knop--licht { background: transparent !important; color: #fe686a !important; border: 2px solid #fe686a; }
.bp-hero__sub p { margin: 0 0 8px; }
.bp-hero--kaart { align-items: center; min-height: 620px; }
.bp-hero--kaart::before { background: rgba(20,15,12,.18); }
.bp-hero--kaart .bp-wrap { position: relative; z-index: 1; width: 100%; }
.bp-inlogkaart { background: #fff; border-radius: 16px; padding: clamp(28px, 4vw, 44px); max-width: 480px; box-shadow: 0 24px 60px rgba(0,0,0,.18); }
.bp-inlogkaart p { line-height: 1.6; }
.bp-inlogkaart__klein { font-size: 14px; color: #6b6b6b; margin-bottom: 0; }
.bp-hero--staand { background-color: #17292b; background-size: auto 100%; background-position: right 8% center; min-height: 560px; align-items: center; }
.bp-hero--staand::before { background: linear-gradient(90deg, rgba(23,41,43,1) 0%, rgba(23,41,43,.85) 45%, rgba(23,41,43,0) 70%); }
@media (max-width: 760px) { .bp-hero--staand { background-position: right -60px center; } }
/* Informatiepagina Wat is de Regieformule (naar de Kajabi-pagina, in de nieuwe huisstijl) */
.rf-hero { background: var(--beige); padding: clamp(64px, 8vw, 110px) 24px; text-align: center; }
.rf-titel { font-family: var(--font-head) !important; font-size: clamp(34px, 4.4vw, 52px) !important; margin: 0 0 32px !important; }
.rf-definitie { max-width: 760px; margin: 0 auto; background: #fff; border-left: 4px solid #F056DE; border-radius: 10px; padding: 28px 32px; text-align: left; font: 400 clamp(18px, 1.8vw, 21px)/1.6 var(--font-head); box-shadow: 0 10px 30px rgba(43,43,43,.06); }
.rf-klein { max-width: 760px; margin: 18px auto 0; font-size: 14px; color: #6b6b6b; text-align: center; }
.rf-klein a { color: #F056DE !important; }
.rf-sectie { padding: clamp(64px, 8vw, 100px) 24px; text-align: center; }
.rf-sectie--beige { background: var(--beige); }
.rf-kop { font-family: var(--font-head) !important; font-size: clamp(28px, 3.4vw, 40px) !important; margin: 0 0 14px !important; }
.rf-intro { max-width: 680px; margin: 0 auto 36px; font-size: 17px; line-height: 1.65; }
.rf-cirkels { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; text-align: left; }
.rf-cirkel { background: var(--beige); border-radius: 14px; overflow: hidden; }
.rf-cirkel__ic { height: 170px; display: flex; align-items: center; justify-content: center; font-size: 64px; }
.rf-cirkel--roze .rf-cirkel__ic { background: #fde3f9; color: #F056DE; }
.rf-cirkel--groen .rf-cirkel__ic { background: #e2e8dc; color: #3d4a35; }
.rf-cirkel--koraal .rf-cirkel__ic { background: #ffe3e3; color: #fe686a; }
.rf-cirkel h3 { font-family: var(--font-head) !important; color: #fe686a !important; font-size: 19px !important; margin: 22px 24px 8px !important; }
.rf-cirkel p { margin: 0 24px 26px; font-size: 15px; line-height: 1.6; }
.rf-citaat { max-width: 720px; margin: 40px auto 0; font: italic 500 clamp(19px, 2vw, 23px)/1.5 var(--font-head); }
.rf-citaat--roze { color: #F056DE; }
.rf-vergelijk { max-width: 860px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; text-align: left; }
.rf-vak { background: #fff; border-radius: 12px; border-top: 4px solid #6b6b6b; padding: 26px 28px; box-shadow: 0 10px 30px rgba(43,43,43,.06); }
.rf-vak--rf { border-top-color: #F056DE; }
.rf-vak h3 { font-family: var(--font-head) !important; font-size: 24px !important; margin: 0 0 12px !important; }
.rf-vak--rf h3 { color: #F056DE !important; }
.rf-vak li { font-size: 15px; line-height: 1.6; margin: 0 0 8px; }
.rf-lijst { max-width: 680px; margin: 0 auto; text-align: left; }
.rf-rij { display: flex; gap: 14px; align-items: center; background: var(--beige); border-radius: 8px; padding: 14px 18px; margin: 0 0 10px; font-size: 16px; }
.rf-rij span { color: #3d4a35; font-weight: 700; }
.rf-faq { text-align: left; }
.rf-faq details { background: #fff; border: 0; border-radius: 8px; padding: 18px 22px; margin: 0 0 10px; }
.rf-slot { max-width: 720px; margin: 0 auto; background: var(--beige); border-radius: 16px; padding: clamp(32px, 5vw, 56px); }
@media (max-width: 760px) { .rf-cirkels, .rf-vergelijk { grid-template-columns: 1fr; } }
.bp-band { background: #F056DE; padding: clamp(48px, 6vw, 80px) 24px; }
.bp-band__kaart { max-width: 680px; margin: 0 auto; background: #fff; border-radius: 16px; padding: clamp(28px, 4vw, 44px); text-align: center; box-shadow: 0 20px 50px rgba(0,0,0,.14); }
.bp-band__label { display: inline-block; background: #dcfdd8; color: #3d4a35; font: 700 12px/1 'Heebo', sans-serif; letter-spacing: .14em; text-transform: uppercase; padding: 8px 14px; border-radius: 999px; margin: 0 0 14px; }
.bp-band__kop { font-family: var(--font-head) !important; color: #F056DE !important; font-size: clamp(24px, 3vw, 34px) !important; margin: 0 0 12px !important; }
.bp-mieke--smal { max-width: 680px; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); }
.bp-mieke--smal img { max-width: 220px; }
.bp-mieke--smal .bp-mieke__naam { margin-bottom: 48px; }
.bd-sw__foto { object-position: 60% center; }

/* Feedback Lise ronde 2b (9 nov) */
.bp-hero__kop strong { color: var(--magenta); font-weight: inherit; }
.bp-tekst h3 { color: var(--koraal) !important; }
.bp-tekst a { color: var(--magenta-tekst); }
.bp-mieke--smal { max-width: 780px; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
.bp-mieke--smal img { max-width: 300px; }
.rf-hero-fl .hero-fl__eyebrow { color: var(--magenta) !important; opacity: 1; }
.rf-def { background: var(--beige); padding: clamp(48px, 6vw, 80px) 24px; text-align: center; }
.rf-formule { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 5vw, 64px); align-items: center; text-align: left; }
.rf-formule svg { width: 100%; max-width: 380px; display: block; margin: 0 auto; }
.rf-stappen { display: flex; flex-direction: column; gap: 16px; }
.rf-stap { background: var(--beige); border-radius: var(--radius); padding: 22px 26px; border-left: 3px solid var(--magenta); }
.rf-stap:nth-child(2) { border-left-color: var(--koraal); }
.rf-stap:nth-child(3) { border-left-color: var(--groen); }
.rf-stap h3 { font-family: var(--font-head) !important; font-size: 19px !important; margin: 0 0 8px !important; }
.rf-stap p { margin: 0; font-size: 15px; line-height: 1.6; }
@media (max-width: 900px) { .rf-formule { grid-template-columns: 1fr; } }
.artikel ol { list-style: none; counter-reset: nr; padding: 0; margin: 28px 0; display: grid; gap: 14px; }
.artikel ol > li { counter-increment: nr; position: relative; background: var(--beige); border-radius: var(--radius); padding: 18px 22px 18px 80px; margin: 0; min-height: 64px; }
.artikel ol > li::before { content: counter(nr, decimal-leading-zero); position: absolute; left: 22px; top: 16px; font: 800 32px/1 'Heebo', sans-serif; color: var(--magenta); letter-spacing: -.02em; }
.bd-sw__wrap--rechts { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
.bd-sw__wrap--rechts .bd-sw__foto { order: 2; }
@media (max-width: 760px) { .bd-sw__wrap--rechts { grid-template-columns: 1fr; } .bd-sw__wrap--rechts .bd-sw__foto { order: 0; } }
.oi-aanmeld__foto { width: 100%; max-width: 420px; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 16px; display: block; margin: 0 auto; box-shadow: 0 20px 50px rgba(43,43,43,.14); }
.rf-slot { background: linear-gradient(135deg, #6d7a5e 0%, #5a6950 100%); color: #fff; }
.rf-slot .rf-kop, .rf-slot p { color: #fff !important; }
.rf-slot .bp-knop { background: #fff !important; color: #b8249f !important; }

/* Wake-up Call dagpagina's (Kajabi-ontwerp in de huisstijl) */
.wu-dag { background: var(--beige); padding: clamp(56px, 7vw, 96px) 24px clamp(56px, 7vw, 88px); text-align: center; }
.wu-dag__label { display: inline-block; background: var(--koraal-s); color: var(--koraal); font: 700 15px/1 var(--font-body); padding: 12px 22px; border-radius: 999px; margin: 0 0 22px; }
.wu-dag__kop { font-family: var(--font-head) !important; font-size: clamp(36px, 5vw, 58px) !important; line-height: 1.1 !important; margin: 0 0 18px !important; }
.wu-dag__intro { max-width: 720px; margin: 0 auto 8px; font-size: 19px; line-height: 1.5; }
.wu-dag__intro + .wu-dag__intro { font-weight: 600; }
.wu-kaart { max-width: 760px; margin: 36px auto 30px; background: #fff; border-radius: 18px; padding: clamp(28px, 4vw, 48px); box-shadow: 0 20px 50px rgba(43,43,43,.09); }
.wu-kaart__cover { width: 240px; max-width: 70%; height: auto; border-radius: 14px; display: block; margin: 0 auto 26px; box-shadow: 0 12px 30px rgba(43,43,43,.14); }
.wu-kaart__audio { width: 100%; display: block; margin: 0 0 26px; }
.wu-kaart__regel { font: 400 clamp(19px, 2vw, 22px)/1.5 var(--font-head); margin: 0 0 6px; }
.wu-kaart__naam { font: italic 500 22px var(--font-head); color: var(--magenta-tekst); margin: 18px 0 0; }
.wu-dag__morgen { font-size: 18px; font-weight: 600; margin: 0 0 10px; }
.wu-dag__noot { max-width: 680px; margin: 0 auto; font-size: 15px; line-height: 1.6; color: var(--tekst-mut); }
.wu-slot { padding: clamp(56px, 7vw, 88px) 24px; }
.wu-slot__kaart { max-width: 760px; margin: 0 auto; text-align: center; background: linear-gradient(135deg, #6d7a5e 0%, #5a6950 100%); color: #fff; border-radius: 18px; padding: clamp(32px, 5vw, 56px); }
.wu-slot__kaart h2 { font-family: var(--font-head) !important; color: #fff !important; font-size: clamp(26px, 3vw, 36px) !important; margin: 0 0 16px !important; }
.wu-slot__kaart p { color: #fff; font-size: 17px; line-height: 1.6; margin: 0 0 8px; }
.wu-slot__kaart .bp-knop { background: #fff !important; color: #b8249f !important; margin-top: 18px; }
.wu-slot__klein { font-size: 14px !important; opacity: .85; margin-top: 14px !important; }
.oi-aanmeld__foto--vierkant { aspect-ratio: 1; }
.bp-hero--staand { background-color: #1f1b17; background-position: right top; }
.bp-hero--staand::before { background: linear-gradient(90deg, rgba(31,27,23,1) 0%, rgba(31,27,23,1) 40%, rgba(31,27,23,0) 64%); }
/* Wake-up Call dagpagina's, ronde 2 (Lise 9 nov): foto met letters, podcastspeler, oranje blok voor morgen */
.wu-hero { min-height: 460px; }
.wu-hero::after { background: linear-gradient(20deg, rgba(20,16,12,.7) 0%, rgba(20,16,12,.3) 50%, rgba(20,16,12,.05) 80%); }
.wu-dag { background: var(--beige); padding: clamp(48px, 6vw, 80px) 24px; text-align: left; }
.wu-dag__wrap { max-width: 760px; margin: 0 auto; }
.wu-dag__kop { font-family: var(--font-head) !important; font-size: clamp(30px, 4vw, 44px) !important; line-height: 1.15 !important; margin: 0 0 14px !important; text-align: left; }
.wu-dag__intro { margin: 0 0 6px; font-size: 19px; line-height: 1.5; max-width: none; }
.wu-dag__intro + .wu-dag__intro { font-weight: 400; font-family: var(--font-head); font-style: italic; color: var(--magenta-tekst); font-size: 21px; }
.wu-speler { margin-top: 30px; padding: 22px 24px; border-radius: 14px; border: 0; box-shadow: 0 14px 36px rgba(43,43,43,.07); }
.wu-speler__kop { display: flex; align-items: center; gap: 16px; margin: 0 0 18px; }
.wu-speler__kop img { width: 72px; height: 72px; border-radius: 10px; object-fit: cover; flex: none; }
.wu-speler__label { margin: 0 0 4px; font: 700 12px/1 var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--koraal); }
.wu-speler__titel { margin: 0; font: 500 19px/1.3 var(--font-head); }
.wu-tekst { margin: 34px 0 0; padding-left: 22px; border-left: 3px solid var(--magenta); }
.wu-tekst p { font: 400 clamp(19px, 2vw, 22px)/1.5 var(--font-head); margin: 0 0 6px; }
.wu-tekst .wu-tekst__naam { font-style: italic; color: var(--magenta-tekst); margin-top: 14px; }
.wu-morgen { margin-top: 40px; background: #fff; border-radius: 14px; padding: 26px 28px; border-top: 4px solid var(--koraal); }
.wu-morgen h3 { font-family: var(--font-head) !important; color: var(--koraal) !important; font-size: 24px !important; margin: 0 0 8px !important; }
.wu-morgen p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--tekst); }
.rf-slotband { background: linear-gradient(135deg, #6d7a5e 0%, #5a6950 100%); }
.rf-slotband .rf-slot { background: none; padding: 0; border-radius: 0; }
.bp-hero--breed { min-height: 500px; align-items: flex-end; background-position: center 25%; }
.bp-hero--breed .bp-hero__wrap { padding-bottom: 56px; }
.bp-hero--breed .bp-hero__kop { max-width: 560px; }
.bd-tekst { background: var(--beige); padding: clamp(40px, 5vw, 64px) 24px; }
.bd-tekst__kaart { max-width: 760px; margin: 0 auto; background: #fff; border-radius: 14px; padding: clamp(26px, 4vw, 40px); box-shadow: 0 14px 36px rgba(43,43,43,.07); border-left: 4px solid var(--magenta); }
.bd-tekst__kaart p { font: 400 19px/1.6 var(--font-head); margin: 0 0 12px; }
.bd-tekst__kaart .bp-knop { margin-top: 12px; }
.bd-meer { background: var(--magenta-s); padding: clamp(48px, 6vw, 80px) 24px; text-align: center; }
.bd-meer__kaart { max-width: 720px; margin: 0 auto; }
.bd-meer h2 { font-family: var(--font-head) !important; font-size: clamp(26px, 3vw, 36px) !important; margin: 0 0 14px !important; }
.bd-meer p { font-size: 17px; line-height: 1.65; margin: 0 0 12px; }
.bd-meer p:last-child a { display: inline-block; margin-top: 10px; background: var(--magenta); color: #fff !important; text-decoration: none; font-weight: 700; padding: 15px 30px; border-radius: 999px; }

/* Wake-up dagpagina ronde 3: tekst boven de speler in één stijl, brede speler met grote hoes */
.wu-dag__wrap { max-width: 980px; }
.wu-dag__kop, .wu-dag__intro { max-width: 760px; }
.wu-dag__intro, .wu-dag__intro + .wu-dag__intro { font: 400 19px/1.55 var(--font-body); font-style: normal; color: var(--tekst); margin: 0 0 6px; }
.wu-speler { display: grid; grid-template-columns: 240px 1fr; gap: 36px; align-items: center; margin-top: 34px; padding: 28px; background: #fff; }
.wu-speler__cover { width: 240px; height: 240px; border-radius: 12px; object-fit: cover; display: block; box-shadow: 0 12px 30px rgba(43,43,43,.14); }
.wu-speler__titel { font-size: clamp(22px, 2.4vw, 28px); margin: 0 0 18px; }
.wu-speler__body .speler-rij { margin-top: 0; }
@media (max-width: 720px) {
  .wu-speler { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .wu-speler__cover { width: 100%; height: auto; aspect-ratio: 1; max-width: 320px; margin: 0 auto; }
}

/* Bedankt: roze blok "wil je meer" met foto ernaast (Lise 9 nov) */
.bd-meer__kaart--foto { max-width: 980px; display: grid; grid-template-columns: 340px 1fr; gap: clamp(28px, 4vw, 56px); align-items: center; text-align: left; }
.bd-meer__foto { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 14px; display: block; box-shadow: 0 16px 40px rgba(43,43,43,.14); }
@media (max-width: 760px) { .bd-meer__kaart--foto { grid-template-columns: 1fr; text-align: center; } .bd-meer__foto { max-width: 340px; margin: 0 auto; } }
.bp-hero--breed .bp-hero__sub p { font-size: clamp(18px, 2vw, 21px); }
.wu-speler > * { min-width: 0; }

/* Wake-up dagpagina ronde 4: één accentkleur (magenta) zoals de podcastaflevering in het design system */
.wu-hero::after { background: linear-gradient(20deg, rgba(20,16,12,.78) 0%, rgba(20,16,12,.45) 55%, rgba(20,16,12,.2) 100%); }
.wu-dag { background: var(--wit); }
.wu-speler { background: var(--beige); box-shadow: none; border: 1px solid var(--lijn); }
.wu-speler .eyebrow.wu-speler__label { color: var(--magenta); font-size: 12px; letter-spacing: .16em; margin: 0 0 6px; }
.wu-speler__cover { box-shadow: none; }
.wu-morgen { background: var(--magenta-s); border-top: 0; border-left: 3px solid var(--magenta); border-radius: 0 var(--radius) var(--radius) 0; padding: 22px 26px; }
.wu-morgen .eyebrow { margin: 0 0 6px; }
.wu-morgen h3 { color: var(--tekst) !important; font-size: 22px !important; margin: 0 0 4px !important; }
.wu-dag + .artcta, .codepagina .artcta { margin-top: 0; }
.oi-intro--breed { max-width: none; }

/* Startweek-blok breed: lichtroze band over de hele breedte (Lise 9 nov, Wake-up dag 7) */
.artcta--breed { max-width: none; background: var(--magenta-s); padding: clamp(56px, 7vw, 96px) 24px; }
.artcta--breed .artcta__kaart { max-width: 1100px; margin: 0 auto; background: none; border: 0; padding: 0; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.artcta--breed h2 { font-size: clamp(28px, 3.4vw, 40px); margin-bottom: 8px; }
.artcta--breed .artcta__sub { font: italic 400 clamp(19px, 2vw, 22px)/1.4 var(--font-head); color: var(--magenta-tekst); margin: 0 0 16px; }
.artcta--breed .artcta__klein a { color: var(--magenta-tekst); }
@media (max-width: 760px) { .artcta--breed .artcta__kaart { grid-template-columns: 1fr; } }