:root {
  --cream: #f6f0e6;
  --paper: #fbf7ef;
  --olive: #687553;
  --olive-dark: #3f4d36;
  --terracotta: #bf6e4f;
  --ink: #3d4134;
  --muted: #6f6b61;
  --line: rgba(63, 77, 54, .16);
  --sage-soft: #e8ecdf;
  --clay-soft: #f1ded3;
  --sand: #efe5d8;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  border-top: 7px solid var(--olive);
  color: var(--ink);
  background: #fffdf8;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.55;
}
a { color: inherit; }
h1, h2, h3, blockquote, .brand { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
main { flex: 1; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  isolation: isolate;
  width: min(1180px, calc(100% - 40px));
  min-height: 94px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 270px 1fr;
  align-items: center;
  gap: 28px;
  padding: 0 22px;
  border-bottom: 3px solid #d89958;
  border-radius: 0 0 18px 18px;
  background: var(--paper);
  box-shadow: 0 9px 24px rgba(108, 69, 43, .14);
  overflow: visible;
}
.site-header::before { content: ''; position: absolute; inset: 0; z-index: -2; border-radius: inherit; background: url('/header-zachte-wolken.png') center 55% / cover no-repeat; filter: saturate(.82); opacity: .72; transform: scale(1.01); }
.site-header::after { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: linear-gradient(100deg, rgba(255, 247, 222, .74), rgba(236, 165, 118, .52) 56%, rgba(255, 225, 151, .66)); }
.brand { display: flex; align-items: center; gap: 13px; color: var(--olive-dark); font-size: clamp(1.4rem, 2vw, 1.65rem); font-style: italic; line-height: 1; letter-spacing: .01em; text-decoration: none; }
.brand > span:last-child { white-space: nowrap; }
.brand-mark { width: 50px; height: 50px; display: grid; flex: 0 0 50px; place-items: center; border: 3px solid #f7d981; border-radius: 50%; background: #c9653f; color: #fff5c8; box-shadow: 0 6px 18px rgba(120, 73, 50, .22); }
.site-header nav { display: flex; justify-content: flex-end; align-items: center; gap: clamp(12px, 1.45vw, 22px); }
.site-header nav a { position: relative; text-decoration: none; font-size: .76rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.site-header nav a:hover, .site-header nav a.active { color: var(--terracotta); }
.site-header nav a::after { content: ''; position: absolute; left: 50%; right: 50%; bottom: -9px; height: 2px; background: var(--terracotta); transition: left .22s ease, right .22s ease; }
.site-header nav a:hover::after, .site-header nav a.active::after { left: 0; right: 0; }
.menu-toggle { display: none; }
.nav-group { position: relative; display: flex; align-items: center; gap: 3px; }
.submenu-toggle {
  min-width: 30px;
  min-height: 34px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--olive-dark);
  font: 700 1rem/1 Arial, Helvetica, sans-serif;
  cursor: pointer;
}
.submenu {
  position: absolute;
  top: calc(100% + 16px);
  left: 0;
  min-width: 270px;
  display: none;
  padding: 10px 12px;
  border: 1px solid rgba(191, 110, 79, .18);
  border-radius: 0 0 18px 18px;
  background: #fbf2e7;
  box-shadow: 0 18px 36px rgba(103, 70, 51, .16);
}
.submenu.is-open, .nav-group:hover .submenu, .nav-group:focus-within .submenu { display: grid; }
.site-header nav .submenu a {
  min-height: 48px;
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  color: var(--ink);
  border-bottom: 1px solid rgba(191, 110, 79, .12);
  border-radius: 10px;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: .84rem;
  font-weight: 400;
  letter-spacing: .035em;
  white-space: nowrap;
  text-transform: none;
}
.site-header nav .submenu a:last-child { border-bottom: 0; }
.site-header nav .submenu a::before {
  content: '';
  width: 32px;
  height: 32px;
  display: block;
  border-radius: 50%;
  background-color: #f3dfd1;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.site-header nav .submenu a[href="/consult/persoonlijk/"]::before { background-image: url('/consult-persoonlijk.png'); }
.site-header nav .submenu a[href="/consult/telefonisch/"]::before { background-image: url('/consult-telefonisch.png'); }
.site-header nav .submenu a[href="/consult/chat/"]::before { background-image: url('/consult-chat.png'); }
.site-header nav .submenu a[href="/consult/email/"]::before { background-image: url('/consult-email-serieus.png'); }
.site-header nav .submenu a[href="/reviews/"]::before {
  content: '♡';
  display: grid;
  place-items: center;
  background: #f3dfd1;
  color: var(--terracotta);
  font: 700 1.15rem/1 Georgia, 'Times New Roman', serif;
}
.site-header nav .submenu a::after {
  content: '›';
  position: static;
  width: auto;
  height: auto;
  display: block;
  color: var(--terracotta);
  background: transparent;
  font: 700 1rem/1 Arial, Helvetica, sans-serif;
}
.site-header nav .submenu a:hover, .site-header nav .submenu a.active { color: var(--terracotta); background: #fffaf2; }
.header-button, .primary-button, .secondary-button, form button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: fit-content;
  border: 0;
  border-radius: 999px;
  background: var(--terracotta);
  color: white;
  padding: 11px 19px;
  font: inherit;
  font-size: .85rem;
  text-decoration: none;
  cursor: pointer;
}

.hero {
  position: relative;
  width: min(1120px, calc(100% - 44px));
  min-height: 460px;
  margin: 42px auto 78px;
  display: grid;
  grid-template-columns: minmax(330px, .86fr) minmax(0, 1.14fr);
  align-items: center;
  gap: clamp(42px, 7vw, 86px);
  padding: 28px 46px 28px 24px;
  isolation: isolate;
  background: linear-gradient(108deg, #f0ddd3 0 45%, #f9eee7 45% 100%);
  overflow: visible;
}
.hero::before { content: ''; position: absolute; width: 118px; height: 118px; left: -18px; bottom: -28px; border: 1px solid rgba(191, 110, 79, .42); border-radius: 50%; z-index: 0; }
.hero-face { position: relative; z-index: 1; align-self: stretch; min-height: 460px; margin: 0; overflow: hidden; border-radius: 46% 46% 10px 10px; background: #e8d9ca; box-shadow: 18px 20px 0 var(--clay-soft); }
.hero-face::after { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255, 250, 243, .06), rgba(241, 222, 211, .03)); pointer-events: none; }
.hero-face img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 34%; filter: blur(.25px) saturate(.98); opacity: 1; transform: scale(1.02); transition: transform .7s ease; }
.hero:hover .hero-face img { transform: scale(1.055); }
.hero-face img.home-portrait { filter: none; transform: none; }
.hero:hover .hero-face img.home-portrait { transform: none; }
.hero-copy { position: relative; z-index: 1; width: min(560px, 100%); justify-self: center; padding: 44px 0; }
.section-kicker { margin: 0 0 5px; color: var(--terracotta); font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero h1 { margin: 0; color: var(--olive-dark); font-size: clamp(2.15rem, 3.8vw, 3.15rem); font-style: italic; line-height: 1.05; letter-spacing: -.025em; }
.hero-copy > p:last-child { max-width: 540px; margin: 18px 0 0; font-size: 1rem; line-height: 1.65; }
.hero-copy > p + p { margin-top: 12px; }
.primary-button { margin: 18px auto 0; background: var(--olive); padding: 12px 20px; box-shadow: 0 4px 14px rgba(31,41,25,.16); }

.opening-quote {
  width: min(850px, calc(100% - 48px));
  margin: -30px auto 70px;
  color: var(--olive-dark);
  font-size: clamp(1.35rem, 2.6vw, 2rem);
  font-style: italic;
  line-height: 1.45;
  text-align: center;
}
.intro-section, .responsibility { padding: 70px max(24px, calc((100% - 920px)/2)); }
.intro-section { background: #fffdf8; }
.responsibility { background: var(--cream); }
.section-copy h2 { margin: 0 0 6px; color: var(--olive-dark); font-size: clamp(1.9rem, 3vw, 2.45rem); font-style: italic; line-height: 1.15; }
.section-copy p { margin: 14px 0; font-size: 1rem; line-height: 1.65; }
.section-copy ul { margin: 18px 0; padding-left: 22px; columns: 2; column-gap: 52px; }
.section-copy li { margin: 0 0 9px; break-inside: avoid; }

.offer { padding: 52px max(22px, calc((100% - 1120px)/2)) 0; background: var(--cream); border-top: 1px solid rgba(104, 117, 83, .1); }
.consult-showcase { position: relative; max-width: 1040px; margin: 0 auto; overflow: hidden; padding: 20px 42px 34px; border-radius: 72px 72px 18px 18px; background: #fbf7ef; }
.consult-showcase::before, .consult-showcase::after { content: ''; position: absolute; z-index: 0; top: -82px; width: 190px; height: 156px; border-radius: 50%; }
.consult-showcase::before { left: -72px; background: #c57758; transform: rotate(-22deg); }
.consult-showcase::after { right: -62px; background: #b4b7a3; transform: rotate(20deg); }
.section-heading { position: relative; z-index: 1; text-align: center; margin-bottom: 12px; }
.section-heading h1, .section-heading h2 { margin: 0 0 3px; color: var(--olive-dark); font-size: clamp(2rem, 3.1vw, 2.65rem); font-style: italic; line-height: 1; }
.section-heading p { margin: 0; color: var(--terracotta); font-size: .76rem; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; }
.consult-cards { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.consult-card { min-height: 248px; padding: 14px 13px 16px; display: flex; flex-direction: column; align-items: center; color: var(--ink); border: 1px solid #e6cdb9; border-radius: 10px; background: #fffaf2; text-align: center; text-decoration: none; box-shadow: 0 7px 16px rgba(129, 86, 60, .06); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.consult-card:hover { transform: translateY(-4px); background: #fff7ec; box-shadow: 0 14px 28px rgba(129, 86, 60, .13); }
.consult-card:focus-visible { outline: 3px solid rgba(191, 110, 79, .4); outline-offset: 3px; }
.consult-card[aria-expanded="true"] { border-color: rgba(191, 110, 79, .7); background: #fffdf8; box-shadow: 0 12px 24px rgba(61, 65, 52, .1); }
.consult-card img { width: 86px; height: 86px; display: block; margin-bottom: 10px; border-radius: 50%; object-fit: cover; filter: blur(.55px) saturate(.96); }
.consult-card h2, .consult-card h3 { margin: 0 0 7px; color: var(--olive-dark); font-size: 1.05rem; font-style: normal; line-height: 1.2; }
.consult-card p { margin: 0; max-width: 190px; color: #4b5047; font-size: .9rem; line-height: 1.38; }
.consult-card > span { width: 38px; margin-top: auto; padding-top: 12px; border-bottom: 2px solid var(--terracotta); }
.consult-reveals { position: relative; z-index: 1; }
.consult-reveal { margin-top: 18px; padding: 24px 30px; border-left: 5px solid var(--terracotta); border-radius: 0 22px 22px 0; background: rgba(255, 253, 248, .92); text-align: left; }
.consult-reveal[hidden] { display: none; }
.consult-reveal h3 { margin: 0 0 4px; color: var(--olive-dark); font-size: 1.35rem; font-style: italic; }
.consult-reveal p { margin: 10px 0 0; font-size: .96rem; line-height: 1.6; }
.consult-reveal .consult-format { margin-top: 0; color: var(--terracotta); font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.consult-leaves { position: absolute; z-index: 2; right: 3px; top: 112px; width: 20px; height: 135px; object-fit: cover; }
.consult-page { min-height: calc(100vh - 147px); padding-top: 62px; padding-bottom: 78px; }
.page-main { background: #fffdf8; }
.subpage-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(920px, calc(100% - 44px));
  margin: 54px auto 0;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  align-items: center;
  gap: 34px;
  padding: 34px 46px;
  border-radius: 54px 8px 54px 8px;
  background: #f8f1e5 url('/consult-goud.png') center / cover no-repeat;
  box-shadow: 0 16px 34px rgba(61, 65, 52, .08);
}
.subpage-hero::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #f8f1e5 0%, rgba(248, 241, 229, .97) 26%, rgba(248, 241, 229, .82) 48%, rgba(248, 241, 229, .42) 72%, rgba(248, 241, 229, .08) 100%); }
.subpage-hero img { width: 128px; height: 128px; display: block; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 8px rgba(255, 253, 248, .82); }
.subpage-hero .section-kicker { color: var(--terracotta); }
.subpage-hero h1 { margin: 0; color: var(--olive-dark); font-size: clamp(2rem, 4vw, 2.8rem); font-style: italic; line-height: 1.08; }
.subpage-hero div > p:last-child { margin: 12px 0 0; color: var(--ink); font-size: 1rem; }
.page-title-block {
  width: min(920px, calc(100% - 44px));
  margin: 54px auto 0;
  padding: 40px 54px;
  border-radius: 54px 8px 54px 8px;
  background: linear-gradient(120deg, var(--cream), #fbf7ef);
}
.page-title-block h1 { max-width: 720px; margin: 0; color: var(--olive-dark); font-size: clamp(2rem, 4vw, 2.8rem); font-style: italic; line-height: 1.08; }

.service-details {
  padding: 40px max(22px, calc((100% - 1050px)/2)) 78px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  background: #fffdf8;
}
.service-detail {
  position: relative;
  scroll-margin-top: 24px;
  padding: 58px 64px 62px 112px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.service-detail::before { content: attr(data-number); position: absolute; top: 50px; left: 28px; color: rgba(191, 110, 79, .6); font-family: Georgia, 'Times New Roman', serif; font-size: 2rem; font-style: italic; }
.service-detail:nth-child(2) { margin-block: 20px; border: 0; border-radius: 0 76px 0 76px; background: linear-gradient(120deg, #f3ecdf, #f8f4ec); }
.service-detail:last-child { border-bottom: 0; }
.service-detail h2 { margin: 0 0 6px; color: var(--olive-dark); font-size: 1.95rem; font-style: italic; line-height: 1.12; }
.service-detail h3 { margin: 24px 0 7px; color: var(--olive-dark); font-family: Arial, Helvetica, sans-serif; font-size: .9rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.service-detail p { margin: 13px 0; font-size: .96rem; line-height: 1.62; }
.service-detail ul { margin: 10px 0 16px; padding-left: 20px; columns: 2; column-gap: 44px; }
.service-detail li { margin: 0 0 7px; break-inside: avoid; font-size: .94rem; line-height: 1.5; }
.service-price { color: var(--olive-dark); font-weight: 700; }
.single-service { width: min(1050px, 100%); margin: 0 auto; padding: 40px 22px 78px; }
.single-service .service-detail { padding: 52px 76px 64px; border-bottom: 0; }
.single-service .service-detail::before { display: none; }
.single-service .coaching-detail { margin-top: 24px; border-radius: 0 64px 0 64px; background: linear-gradient(120deg, #f3ecdf, #f8f4ec); }
.coaching-page {
  background: linear-gradient(180deg, #fffdf8 0, #fff7e9 54%, #fffaf3 100%);
}
.coaching-page .page-title-block {
  border-left: 7px solid #c96f4c;
  background: linear-gradient(125deg, #f8e9c9, #efc7a1);
  box-shadow: 0 16px 34px rgba(145, 85, 51, .12);
}
.coaching-page .coaching-detail {
  border-top: 6px solid #cc7653;
  background: linear-gradient(145deg, #fffaf1, #f8e8ce 58%, #efcfb2);
  box-shadow: 0 18px 42px rgba(145, 85, 51, .1);
}
.coaching-page .coaching-detail h3 {
  padding-left: 12px;
  border-left: 4px solid #d8aa56;
  color: #a65339;
}
.coaching-page .coaching-detail li::marker,
.coaching-page .responsibility li::marker { color: #c96f4c; }
.coaching-page .responsibility {
  border-top: 1px solid rgba(201, 111, 76, .22);
  background: linear-gradient(120deg, #f7e6c5, #efc9a7);
}
.reviews { padding: 14px max(22px, calc((100% - 1120px)/2)) 70px; background: linear-gradient(180deg, #f3e5d7, #f7eee4); text-align: center; }
.reviews-mark { margin: 0 0 -4px; color: #d8aa56; font-size: 1.6rem; line-height: 1; text-shadow: 0 2px 8px rgba(153, 112, 37, .16); }
.reviews > .section-kicker { margin-bottom: 4px; }
.reviews > h1, .reviews > h2 { margin: 0 0 28px; color: var(--olive-dark); font-size: clamp(2rem, 3vw, 2.55rem); font-style: italic; line-height: 1; }
.reviews-page { min-height: calc(100vh - 147px); padding-top: 62px; }
.review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.reviews-page .review-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.review-card, .review-card:nth-child(3n + 2), .review-card:nth-child(3n) { position: relative; margin: 0; padding: 22px 20px 20px; border: 1px solid rgba(191, 110, 79, .1); border-radius: 10px; background: #fffaf2; box-shadow: 0 8px 22px rgba(103, 70, 51, .07); text-align: left; }
.review-card::before { content: '“'; position: absolute; top: 9px; left: 12px; color: var(--terracotta); font: 700 1.75rem/1 Georgia, 'Times New Roman', serif; }
.review-author { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 0 0 11px 20px; border-bottom: 1px solid rgba(191, 110, 79, .14); }
.review-author strong { color: var(--olive-dark); font-family: Georgia, 'Times New Roman', serif; font-size: 1.08rem; font-weight: 700; }
.review-author span { color: var(--muted); font-size: .78rem; }
.review-card p { margin: 15px 0 0; font-size: .9rem; line-height: 1.6; }
.time-note { margin: 34px 0; padding: 30px 34px; border-left: 6px solid var(--terracotta); background: var(--clay-soft); }
.time-note h3 { margin-top: 0; }
.time-note p:last-child { margin-bottom: 0; }
.reviews-time-note { max-width: 920px; margin: 42px auto 0; text-align: left; }
.detail-button {
  display: inline-block;
  margin-top: 8px;
  color: var(--terracotta);
  font-size: .86rem;
  font-weight: 700;
  border-bottom: 1px solid rgba(191, 110, 79, .38);
  text-decoration: none;
}

.about h1, .about h2, .experiences h2, .contact h1, .contact h2 { margin: 0 0 6px; color: var(--olive-dark); font-size: clamp(1.9rem, 3vw, 2.5rem); font-style: italic; line-height: 1.12; }
.about p { max-width: 560px; margin: 13px 0; font-size: 1rem; line-height: 1.6; }
.secondary-button { margin-top: 8px; background: var(--olive); }

.about { padding: 76px max(28px, calc((100% - 1120px)/2)); display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); align-items: start; gap: 64px; background: var(--paper); }
.about-copy h2, .about-copy h3 { margin: 30px 0 8px; color: var(--olive-dark); font-family: Arial, Helvetica, sans-serif; font-size: .9rem; font-style: normal; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.about-photo { position: sticky; top: 32px; min-height: 520px; margin: 18px 0 0; overflow: hidden; border-radius: 110px 6px 110px 6px; box-shadow: 18px 18px 0 var(--clay-soft); }
.about-photo img { width: 100%; height: 100%; min-height: 520px; display: block; object-fit: cover; object-position: 58% center; }
.about-symbol { color: #dfb184; font-family: Georgia, 'Times New Roman', serif; font-size: 7rem; text-align: center; opacity: .56; }

.experiences { padding: 58px 24px; background: var(--cream); text-align: center; }
.contact { padding: 78px max(28px, calc((100% - 1040px)/2)); display: grid; grid-template-columns: .8fr 1.2fr; align-items: start; gap: 70px; background: linear-gradient(90deg, var(--sand) 0 39%, #fffaf1 39% 100%); }
.contact > div { padding-top: 30px; }
.contact-photo { width: min(100%, 300px); height: 330px; margin: 0 0 30px; overflow: hidden; border-radius: 90px 6px 90px 6px; box-shadow: 12px 12px 0 var(--clay-soft); }
.contact-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 36%; }
.contact-icon { display: grid; place-items: center; background: linear-gradient(145deg, #f8dfa6, #efa66f); }
.contact-icon img { width: 82%; height: 82%; object-fit: contain; object-position: center; }
.contact-page { min-height: calc(100vh - 147px); }
form { display: grid; gap: 16px; padding: 34px; border-top: 7px solid var(--terracotta); background: white; box-shadow: 0 16px 42px rgba(61,65,52,.1); }
label { display: grid; gap: 6px; color: var(--muted); font-size: .86rem; }
label > span { font-size: .76rem; }
input, textarea, select { width: 100%; border: 0; border-bottom: 1px solid rgba(63, 77, 54, .28); border-radius: 0; background: #fffdf9; padding: 12px 13px; color: var(--ink); font: inherit; font-size: 1rem; }
textarea { resize: vertical; }
.form-note { margin: 0; color: var(--muted); font-size: .8rem; line-height: 1.5; }
form button { background: var(--olive-dark); transition: background .2s ease, transform .2s ease; }
form button:hover { background: var(--terracotta); transform: translateY(-2px); }
footer { min-height: 52px; padding: 13px max(24px, calc((100% - 1080px)/2)); display: flex; justify-content: space-between; align-items: center; gap: 24px; background: var(--olive-dark); color: white; font-size: .84rem; }

@media (min-width: 481px) and (max-width: 860px) {
  .site-header { width: calc(100% - 20px); min-height: 72px; grid-template-columns: 120px 1fr; gap: 8px; padding-inline: 8px; }
  .brand { gap: 6px; font-size: .86rem; }
  .brand > span:last-child { white-space: normal; }
  .brand-mark { width: 30px; height: 30px; flex-basis: 30px; border-width: 2px; }
  .site-header nav { gap: 6px; }
  .site-header nav a { font-size: .54rem; letter-spacing: .025em; }
  .nav-group { gap: 0; }
  .submenu-toggle { min-width: 22px; min-height: 30px; font-size: .8rem; }
  .submenu { top: calc(100% + 14px); }
  .hero { width: calc(100% - 34px); min-height: 330px; grid-template-columns: minmax(180px, .86fr) minmax(0, 1.14fr); gap: 26px; margin-top: 28px; padding: 18px 26px 18px 16px; }
  .hero-face { min-height: 330px; }
  .hero-copy { padding: 24px 0; }
  .hero h1 { font-size: clamp(1.8rem, 5vw, 2.35rem); }
  .consult-showcase { padding-inline: 28px; border-radius: 54px 54px 14px 14px; }
  .consult-cards { gap: 8px; }
  .consult-card { min-height: 230px; padding-inline: 8px; }
  .consult-card img { width: 72px; height: 72px; }
  .consult-card h2, .consult-card h3 { font-size: .9rem; }
  .consult-card p { font-size: .78rem; }
  .subpage-hero { grid-template-columns: 118px minmax(0, 1fr); gap: 24px; padding: 30px 34px; }
  .subpage-hero img { width: 104px; height: 104px; }
  .single-service .service-detail { padding: 46px 38px 52px; }
  .reviews-page .review-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .review-card, .review-card:nth-child(3n + 2), .review-card:nth-child(3n) { padding: 20px 13px 16px; }
  .review-card p { font-size: .78rem; }
  .review-author { gap: 6px; }
  .review-author strong { font-size: .9rem; }
  .review-author span { font-size: .68rem; }
}

@media (max-width: 480px) {
  .site-header { width: 100%; min-height: 76px; grid-template-columns: 1fr auto; padding: 8px 20px; }
  .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 8px 16px;
    border: 1px solid rgba(63, 77, 54, .24);
    border-radius: 999px;
    background: rgba(255, 253, 248, .8);
    color: var(--olive-dark);
    font: 700 .78rem/1 Arial, Helvetica, sans-serif;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  .site-header nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    padding: 14px 20px 20px;
    border-top: 1px solid var(--line);
    background: #fffdf8;
    box-shadow: 0 18px 34px rgba(61, 65, 52, .14);
  }
  .site-header nav.is-open { display: flex; }
  .site-header nav > a { min-height: 44px; display: flex; align-items: center; padding: 0 10px; }
  .site-header nav > a::after { display: none; }
  .nav-group { display: grid; grid-template-columns: 1fr 44px; align-items: center; }
  .nav-group > a { min-height: 44px; display: flex; align-items: center; padding: 0 10px; }
  .nav-group > a::after { display: none; }
  .submenu-toggle { min-width: 44px; min-height: 44px; }
  .submenu, .nav-group:hover .submenu, .nav-group:focus-within .submenu {
    position: static;
    grid-column: 1 / -1;
    min-width: 0;
    display: none;
    padding: 4px 0 8px 16px;
    border: 0;
    border-left: 2px solid var(--terracotta);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .nav-group .submenu.is-open { display: grid; }
  .brand { font-size: 1.16rem; }
  .hero { min-height: 0; grid-template-columns: 1fr; gap: 30px; margin-top: 20px; padding: 22px 22px 36px; background: linear-gradient(180deg, #f0ddd3 0 53%, #f9eee7 53% 100%); }
  .hero-face { min-height: 460px; }
  .hero-copy { width: auto; padding: 36px 28px 40px; }
  .hero h1 { font-size: clamp(2rem, 8vw, 2.7rem); }
  .consult-showcase { padding-inline: 34px; border-radius: 54px 54px 14px 14px; }
  .consult-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .subpage-hero { grid-template-columns: 118px minmax(0, 1fr); gap: 24px; padding: 30px 34px; }
  .subpage-hero img { width: 104px; height: 104px; }
  .single-service .service-detail { padding: 46px 28px 52px; }
  .service-details { grid-template-columns: 1fr; padding: 42px 18px; }
  .service-detail { padding: 58px 26px 36px; }
  .service-detail::before { top: 18px; left: 26px; font-size: 1.5rem; }
  .service-detail:nth-child(2) { border-radius: 0 42px 0 42px; }
  .service-detail ul { columns: 1; }
  .review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reviews-page .review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-copy ul { columns: 1; }
  .about { grid-template-columns: 1fr; padding: 48px 24px; gap: 36px; }
  .about-photo { position: static; min-height: 420px; }
  .about-photo img { min-height: 420px; }
  .about-symbol { display: none; }
  .contact { grid-template-columns: 1fr; gap: 30px; padding: 52px 24px; background: linear-gradient(180deg, var(--sand) 0 31%, #fffaf1 31% 100%); }
  .contact > div { padding-top: 0; }
  footer { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 480px) {
  body { font-size: 16px; }
  .site-header { width: 100%; }
  .header-button { padding: 10px 14px; font-size: .78rem; }
  .hero { width: calc(100% - 28px); margin-bottom: 42px; }
  .hero-face { min-height: 380px; }
  .hero-copy { padding: 24px 4px 16px; }
  .primary-button { font-size: .8rem; }
  .offer { padding-inline: 14px; }
  .consult-showcase { padding: 24px 28px 30px; border-radius: 42px 42px 12px 12px; }
  .section-heading p { font-size: .68rem; letter-spacing: .19em; }
  .consult-cards, .review-grid { grid-template-columns: 1fr; }
  .reviews-page .review-grid { grid-template-columns: 1fr; }
  .consult-card { min-height: 236px; }
  .consult-reveal { padding: 22px 20px; }
  .consult-leaves { display: none; }
  .reviews { padding: 18px 16px 56px; }
  .reviews-page { padding-top: 44px; }
  .subpage-hero { width: calc(100% - 28px); margin-top: 28px; grid-template-columns: 1fr; justify-items: center; gap: 18px; padding: 28px 24px; text-align: center; }
  .subpage-hero img { width: 112px; height: 112px; }
  .page-title-block { width: calc(100% - 28px); margin-top: 28px; padding: 30px 26px; }
  .single-service { padding: 42px 14px; }
  .single-service .service-detail { padding: 38px 18px 46px; }
  form { padding: 28px 22px; }
  .about h1, .about h2, .experiences h2, .contact h1, .contact h2 { font-size: 1.8rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* New offerings and blog */
.upcoming-heading { margin: 30px 0 18px; }
.upcoming-heading h2 { font-size: 1.35rem; }
.upcoming-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 780px; margin: auto; }
.simple-upcoming { min-height: calc(100vh - 210px); padding: 1px 0 80px; }
.upcoming-content { width: min(920px, calc(100% - 44px)); margin: 26px auto 0; padding: 18px 54px; color: var(--olive-dark); }
.upcoming-content p { margin: 12px 0; font-size: 1rem; }
.websites-feature { padding: 26px 22px 70px; background: #fffdf8; }
.websites-feature-link { display: flex; align-items: center; gap: 26px; max-width: 850px; margin: auto; padding: 18px; color: var(--olive-dark); text-decoration: none; background: linear-gradient(120deg,#fce8e5,#eef1dc); border-radius: 28px; }
.websites-feature-link img { width: 156px; height: 156px; border-radius: 50%; object-fit: cover; }
.websites-feature-link strong { display: block; font-family: Georgia,serif; font-size: clamp(1.3rem,2.5vw,1.8rem); line-height: 1.2; }
.websites-feature-link small { display: block; margin-top: 8px; font-size: .95rem; }
.websites-feature-link:hover { box-shadow: 0 8px 22px rgba(61,65,52,.14); }
@media (max-width: 900px) { .upcoming-cards { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) { .upcoming-content { padding-inline: 22px; } .upcoming-cards { grid-template-columns: 1fr; } .websites-feature-link { flex-direction: column; text-align: center; } }

/* Consultation menu: current forms and upcoming offerings. */
.submenu { max-height: min(75vh, 520px); overflow-y: auto; }
.site-header nav .submenu-label { padding: 10px 8px 4px; color: var(--terracotta); font: 700 .72rem/1.2 Arial, Helvetica, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.site-header nav .submenu a[href="/aanbod/holistische-massage/"]::before { background-image: url('/holistische-massage.png'); }
.site-header nav .submenu a[href="/aanbod/sound-healing/"]::before { background-image: url('/sound-healing.png'); }
.site-header nav .submenu a[href="/aanbod/intuitiekring/"]::before { background-image: url('/intuitiekring.png'); }
@media (max-width: 480px) { .site-header nav.is-open { max-height: calc(100vh - 80px); overflow-y: auto; } .submenu { max-height: none; overflow: visible; } }

.blog-story { max-width: 78ch; line-height: 1.65; }

.hero .hero-face {
  width: 100%;
  min-height: 0;
  aspect-ratio: 614 / 906;
  align-self: center;
}
