:root {
  /* =========================================================
     KLEUREN — wijzig deze waarden om je volledige stijl te sturen
     ========================================================= */
  --bg:#0d0b0d;
  --bg-2:#131014;
  --panel:#191519;
  --panel-2:#201a1f;
  --text:#fbf7f1;
  --muted:#bfb3b8;
  --accent:#cda373;
  --accent-2:#ead0ad;
  --accent-dark:#7d5936;
  --line:rgba(255,255,255,.105);
  --line-gold:rgba(205,163,115,.28);
  --shadow:0 35px 100px rgba(0,0,0,.45);
  --radius:28px;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.7;overflow-x:hidden}
body.locked{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit}
button{color:inherit}
code{color:var(--accent-2);font-size:.9em}
.container{width:min(1200px,calc(100% - 48px));margin:auto}
.section{padding:118px 0}
.eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--accent-2);font-size:.72rem;font-weight:850;letter-spacing:.19em;text-transform:uppercase}
.eyebrow::before{content:"";width:30px;height:1px;background:var(--accent)}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.04;margin-top:0}
h1{font-size:clamp(4.3rem,8.2vw,8rem);letter-spacing:-.055em}
h2{font-size:clamp(2.6rem,4.8vw,4.7rem);letter-spacing:-.04em}
h3{font-size:1.55rem;letter-spacing:-.02em}
p{margin-top:0}
.muted,.section-heading>p,.treatment-card p,.experience-copy>p,.step p,.about-copy p,.faq-intro p,.faq-list p,.contact-copy>p{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:14px 25px;border:1px solid transparent;border-radius:999px;background:linear-gradient(135deg,var(--accent-2),var(--accent));color:#24160e;font-weight:850;cursor:pointer;transition:.25s ease;box-shadow:0 12px 32px rgba(205,163,115,.12)}
.btn:hover{transform:translateY(-2px);filter:brightness(1.045)}
.btn-small{min-height:46px;padding:10px 20px}
.btn-ghost{background:rgba(255,255,255,.025);color:var(--text);border-color:var(--line);box-shadow:none}
.btn-outline{background:transparent;color:var(--text);border-color:var(--line-gold);box-shadow:none}
.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--accent-2);font-weight:800;transition:.2s ease}
.text-link:hover{gap:13px}
.site-header{position:fixed;inset:0 0 auto;z-index:90;background:linear-gradient(to bottom,rgba(13,11,13,.86),rgba(13,11,13,.4),transparent);transition:.3s ease}
.site-header.scrolled,.site-header.solid{background:rgba(13,11,13,.9);backdrop-filter:blur(20px);border-bottom:1px solid var(--line);box-shadow:0 12px 40px rgba(0,0,0,.22)}
.nav{min-height:112px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.brand-logo{width:92px;height:92px;object-fit:contain;flex:0 0 auto}
.brand-copy{display:grid;line-height:1}
.brand-copy strong{font-family:var(--serif);font-size:1.42rem;letter-spacing:.05em;white-space:nowrap}
.brand-copy span{margin-top:8px;color:var(--accent);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap}
.nav-links{display:flex;align-items:center;gap:25px}
.nav-links>a:not(.btn){font-size:.9rem;color:#d1c6ca;transition:.2s}
.nav-links>a:not(.btn):hover{color:#fff}
.menu-btn{display:none;border:0;background:none;font-size:1.55rem;cursor:pointer}
.hero{position:relative;min-height:100svh;display:grid;align-items:center;padding:138px 0 78px;overflow:hidden;background:radial-gradient(circle at 20% 15%,rgba(205,163,115,.075),transparent 27rem),linear-gradient(180deg,#0c0a0c 0%,var(--bg) 100%)}
.hero::before{content:"";position:absolute;inset:0;opacity:.2;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:68px 68px;mask-image:linear-gradient(to bottom,#000,transparent 80%)}
.hero-glow{position:absolute;border-radius:999px;filter:blur(12px);pointer-events:none}
.hero-glow-one{width:520px;height:520px;right:-250px;top:12%;background:radial-gradient(circle,rgba(205,163,115,.13),transparent 65%)}
.hero-glow-two{width:300px;height:300px;left:-180px;bottom:3%;background:radial-gradient(circle,rgba(137,74,81,.08),transparent 68%)}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr .98fr;gap:74px;align-items:center}
.hero-copy{padding-top:26px}
.hero h1{margin:24px 0 26px;max-width:760px}
.hero h1 em{display:inline-block;color:var(--accent);font-weight:400}
.hero-lead{max-width:650px;color:var(--muted);font-size:1.08rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:33px}
.trust-row{display:flex;flex-wrap:wrap;gap:15px 24px;margin-top:36px;color:#aa9ea3;font-size:.82rem}
.hero-media{position:relative;min-height:730px}
.hero-photo-wrap{position:absolute;inset:0 55px 30px 35px;border:1px solid rgba(255,255,255,.13);border-radius:180px 180px 34px 34px;overflow:hidden;background:var(--panel);box-shadow:var(--shadow)}
.hero-photo{width:100%;height:100%;object-fit:cover;object-position:center 18%;filter:saturate(.78) contrast(1.04)}
.photo-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,8,10,.68),transparent 48%)}
.hero-caption{position:absolute;left:34px;right:34px;bottom:34px;display:grid;gap:3px}
.hero-caption span{color:var(--accent);font-size:.74rem;text-transform:uppercase;letter-spacing:.18em}
.hero-caption strong{font-family:var(--serif);font-size:1.35rem;font-weight:400}
.hero-badge{position:absolute;right:0;bottom:0;width:156px;height:156px;border-radius:50%;display:grid;place-content:center;text-align:center;background:rgba(18,14,17,.92);backdrop-filter:blur(18px);border:1px solid var(--line-gold);box-shadow:var(--shadow)}
.hero-badge small,.hero-badge span{color:var(--muted);font-size:.73rem;text-transform:uppercase;letter-spacing:.11em}
.hero-badge strong{font-family:var(--serif);font-size:2rem;color:var(--accent-2);line-height:1.15}
.scroll-cue{position:absolute;left:50%;bottom:22px;z-index:3;color:var(--muted);font-size:1.25rem;animation:float 1.8s ease-in-out infinite}
@keyframes float{50%{transform:translateY(6px)}}
.intro-strip{border-block:1px solid var(--line);background:#0a080a}
.intro-strip-grid{min-height:102px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.intro-strip p{margin:0;max-width:760px;color:#bcaeb4;font-family:var(--serif);font-size:1.18rem}
.intro-strip a{color:var(--accent-2);font-weight:800;white-space:nowrap}
.intro-strip a span{margin-left:6px}
.section-heading{display:grid;grid-template-columns:1fr .72fr;gap:50px;align-items:end;margin-bottom:52px}
.section-heading h2{margin:13px 0 0;max-width:760px}
.section-heading>p{margin:0;max-width:500px;justify-self:end}
.treatment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.treatment-card{min-height:470px;display:flex;flex-direction:column;padding:30px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(155deg,rgba(255,255,255,.045),rgba(255,255,255,.012));transition:.3s ease}
.treatment-card:hover{transform:translateY(-5px);border-color:rgba(205,163,115,.3);background:linear-gradient(155deg,rgba(205,163,115,.075),rgba(255,255,255,.015))}
.treatment-card.featured{background:radial-gradient(circle at 100% 0,rgba(205,163,115,.13),transparent 44%),var(--panel);border-color:var(--line-gold)}
.treatment-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:70px}
.treatment-number{font-family:var(--serif);font-size:2rem;color:var(--accent)}
.pill{padding:6px 10px;border:1px solid var(--line-gold);border-radius:999px;color:var(--accent-2);font-size:.68rem;text-transform:uppercase;letter-spacing:.12em}
.treatment-card h3{font-size:2rem;margin-bottom:15px}
.treatment-card p{flex:1}
.price-row{display:flex;justify-content:space-between;align-items:end;padding:21px 0;border-top:1px solid var(--line);margin-top:14px}
.price-row span{color:var(--muted);font-size:.86rem}
.price-row strong{font-family:var(--serif);font-size:2rem;font-weight:400;color:var(--accent-2)}
.treatment-card .text-link{font-size:.88rem}
.pricing-note{display:flex;align-items:center;gap:16px;margin-top:26px;padding:19px 22px;border:1px dashed var(--line-gold);border-radius:18px;background:rgba(205,163,115,.035)}
.pricing-note>span{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;background:rgba(205,163,115,.1);color:var(--accent-2);font-size:1.2rem}
.pricing-note p{margin:0;color:var(--muted)}
.experience-section{padding:120px 0;background:var(--bg-2);border-block:1px solid var(--line)}
.experience-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:76px;align-items:center}
.experience-image{position:relative;min-height:720px;border-radius:32px;overflow:hidden;box-shadow:var(--shadow)}
.experience-image img{width:100%;height:100%;min-height:720px;object-fit:cover;filter:saturate(.78)}
.image-note{position:absolute;left:20px;right:20px;bottom:20px;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:rgba(13,11,13,.73);backdrop-filter:blur(16px);font-family:var(--serif);font-size:1.05rem}
.experience-copy h2{margin:15px 0 22px}
.steps{display:grid;gap:0;margin:32px 0}
.step{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:22px 0;border-top:1px solid var(--line)}
.step:last-child{border-bottom:1px solid var(--line)}
.step>span{color:var(--accent);font-family:var(--serif);font-size:1.4rem}
.step h3{margin:0 0 6px;font-size:1.22rem}
.step p{margin:0}
.gallery-section{background:linear-gradient(180deg,var(--bg),#0a080a)}
.lux-gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:250px;gap:14px}
.gallery-item{position:relative;overflow:hidden;padding:0;border:1px solid var(--line);border-radius:18px;background:var(--panel);cursor:zoom-in}
.gallery-item.gallery-big{grid-column:span 2;grid-row:span 2}
.gallery-item.gallery-wide{grid-column:span 2}
.gallery-item img{width:100%;height:100%;object-fit:cover;filter:saturate(.78);transition:.35s ease}
.gallery-item::after{content:"Bekijken";position:absolute;inset:auto 16px 15px;color:#fff;font-size:.7rem;font-weight:850;letter-spacing:.15em;text-transform:uppercase;opacity:0;transform:translateY(7px);transition:.25s;text-shadow:0 2px 12px #000}
.gallery-item:hover img{transform:scale(1.035);filter:saturate(.84) brightness(.8)}
.gallery-item:hover::after{opacity:1;transform:none}
.about-grid{display:grid;grid-template-columns:1fr .9fr;gap:76px;align-items:center}
.about-copy h2{margin:15px 0 24px}
.mini-features{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:34px 0}
.mini-features div{padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.018)}
.mini-features strong{display:block;color:var(--accent);font-family:var(--serif);font-size:1.35rem}
.mini-features span{display:block;margin-top:7px;font-size:.83rem;color:#c9bdc2}
.about-image{min-height:650px;margin:0;border-radius:170px 170px 28px 28px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.about-image img{width:100%;height:100%;min-height:650px;object-fit:cover;filter:saturate(.78)}
.faq-section{border-bottom:1px solid var(--line)}
.faq-grid{display:grid;grid-template-columns:.74fr 1.26fr;gap:80px}
.faq-intro{position:sticky;top:130px;align-self:start}
.faq-intro h2{margin:14px 0 20px}
.faq-list details{border-top:1px solid var(--line);padding:22px 0}
.faq-list details:last-child{border-bottom:1px solid var(--line)}
.faq-list summary{position:relative;padding-right:44px;cursor:pointer;font-family:var(--serif);font-size:1.35rem;list-style:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";position:absolute;right:6px;top:-3px;color:var(--accent);font-family:var(--sans);font-size:1.5rem;font-weight:300}
.faq-list details[open] summary::after{content:"–"}
.faq-list p{margin:14px 50px 0 0}
.contact-section{padding:120px 0;background:radial-gradient(circle at 12% 30%,rgba(205,163,115,.08),transparent 28rem),#0b090b}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.contact-copy h2{margin:14px 0 21px}
.contact-methods{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:34px}
.contact-methods a{display:grid;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.018);transition:.25s}
.contact-methods a:hover{border-color:var(--line-gold);transform:translateY(-2px)}
.contact-methods span{color:var(--muted);font-size:.74rem;text-transform:uppercase;letter-spacing:.12em}
.contact-methods strong{margin-top:4px;font-size:.93rem}
.location-card{padding:36px;border:1px solid var(--line-gold);border-radius:28px;background:linear-gradient(155deg,rgba(255,255,255,.055),rgba(255,255,255,.015));box-shadow:var(--shadow)}
.location-card>img{width:150px;height:150px;object-fit:contain;margin-bottom:24px}
.location-card h3{font-size:2rem;margin-bottom:4px}
.location-card>p{color:var(--accent);font-size:.78rem;text-transform:uppercase;letter-spacing:.15em}
.location-line{display:grid;gap:3px;padding:15px 0;border-top:1px solid var(--line)}
.location-line span{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}
.full-btn{width:100%;margin-top:20px}
.site-footer{padding:40px 0;border-top:1px solid var(--line);background:#080608;color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.footer-brand{display:flex;align-items:center;gap:12px;color:var(--text)}
.footer-brand img{width:70px;height:70px;object-fit:contain}
.footer-brand div{display:grid;line-height:1.2}
.footer-brand span{color:var(--accent);font-size:.66rem;text-transform:uppercase;letter-spacing:.15em;margin-top:4px}
.footer-links{display:flex;gap:20px;font-size:.86rem}
.footer-grid>p{grid-column:1/-1;margin:0;font-size:.75rem}
.whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:80;display:flex;align-items:center;gap:10px;padding:12px 14px 12px 18px;border:1px solid var(--line-gold);border-radius:999px;background:rgba(20,16,19,.88);backdrop-filter:blur(18px);box-shadow:0 16px 45px rgba(0,0,0,.34);font-size:.82rem;font-weight:800}
.whatsapp-float b{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#23160e}
.lightbox{position:fixed;inset:0;z-index:200;display:none;place-items:center;padding:28px;background:rgba(4,3,4,.94);backdrop-filter:blur(14px)}
.lightbox.open{display:grid}
.lightbox img{max-width:min(100%,1150px);max-height:88vh;border-radius:20px;box-shadow:var(--shadow)}
.lightbox-close{position:absolute;right:22px;top:18px;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.07);font-size:1.6rem;cursor:pointer}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .65s ease,transform .65s ease}
.reveal.visible{opacity:1;transform:none}
/* BOEKINGSPAGINA */
.booking-page{background:radial-gradient(circle at 15% 18%,rgba(205,163,115,.07),transparent 26rem),var(--bg)}
.back-link{color:var(--accent-2);font-size:.9rem;font-weight:800}
.booking-main{min-height:calc(100vh - 120px)}
.booking-hero{padding:150px 0 90px}
.booking-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:70px;align-items:start}
.booking-intro{position:sticky;top:130px}
.booking-intro h1{font-size:clamp(4rem,7vw,7rem);margin:20px 0 24px}
.booking-intro h1 em{color:var(--accent);font-weight:400}
.booking-intro>p{color:var(--muted);max-width:500px}
.booking-help{margin-top:32px;padding:22px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.02);display:grid;gap:8px}
.booking-help p{margin:0;color:var(--muted);font-size:.82rem}
.booking-help a{color:var(--accent-2);font-weight:800}
.booking-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:36px;border:1px solid var(--line);border-radius:30px;background:var(--panel);box-shadow:var(--shadow)}
.form-heading{grid-column:1/-1;display:grid;grid-template-columns:48px 1fr;gap:14px;margin-top:8px;padding:8px 0 10px}
.form-heading:first-child{margin-top:0}
.form-heading>span{color:var(--accent);font-family:var(--serif);font-size:1.65rem}
.form-heading h2{font-family:var(--serif);font-size:1.55rem;margin:0 0 3px;letter-spacing:0}
.form-heading p{margin:0;color:var(--muted);font-size:.83rem}
.field{display:grid;gap:8px;color:#c9bdc2;font-size:.83rem}
.field input,.field textarea,.field select{width:100%;padding:14px 15px;color:var(--text);background:#100d10;border:1px solid var(--line);border-radius:13px;outline:none}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(205,163,115,.08)}
.field textarea{min-height:130px;resize:vertical}
.field select{appearance:auto}
.full-field{grid-column:1/-1}
.check-field{display:flex;align-items:flex-start;gap:10px;color:var(--muted);font-size:.8rem;padding:5px 0}
.check-field input{margin-top:5px;accent-color:var(--accent)}
.form-status{margin:0;color:var(--accent-2);font-size:.83rem}
.compact-footer .footer-grid>p{grid-column:auto}
@media(max-width:1050px){
  .nav-links{gap:18px}.nav-links>a:not(.btn){display:none}.menu-btn{display:none}
  .hero-grid,.experience-grid,.about-grid,.contact-grid,.voucher-card,.booking-layout{grid-template-columns:1fr}
  .hero-media{min-height:650px;max-width:720px;width:100%;margin:auto}
  .treatment-grid{grid-template-columns:1fr 1fr}.treatment-card:last-child{grid-column:1/-1}
  .section-heading{grid-template-columns:1fr;gap:16px}.section-heading>p{justify-self:start}
  .experience-image{min-height:600px}.experience-image img{min-height:600px}
  .about-image{min-height:600px}.about-image img{min-height:600px}
  .gift-card-visual{justify-self:start;width:390px}
  .faq-grid{grid-template-columns:1fr;gap:36px}.faq-intro,.booking-intro{position:static}
}
@media(max-width:720px){
  .container{width:min(100% - 28px,1200px)}.section{padding:86px 0}.nav{min-height:92px}.brand-logo{width:68px;height:68px}.brand-copy strong{font-size:1.16rem}.brand-copy span{font-size:.6rem}.nav-links .btn{min-height:42px;padding:9px 15px;font-size:.78rem}.hero{padding:115px 0 72px}.hero h1{font-size:3.85rem}.hero-grid{gap:42px}.hero-media{min-height:520px}.hero-photo-wrap{inset:0 20px 20px 8px;border-radius:110px 110px 25px 25px}.hero-badge{width:112px;height:112px}.hero-badge strong{font-size:1.45rem}.hero-caption{left:20px;right:20px;bottom:22px}.hero-caption strong{font-size:1.04rem}.trust-row{gap:9px 16px}.scroll-cue{display:none}.intro-strip-grid{padding:22px 0;align-items:flex-start;flex-direction:column}.intro-strip p{font-size:1.02rem}.treatment-grid{grid-template-columns:1fr}.treatment-card:last-child{grid-column:auto}.treatment-card{min-height:auto}.treatment-top{margin-bottom:50px}.lux-gallery{grid-template-columns:1fr;grid-auto-rows:360px}.gallery-item.gallery-big,.gallery-item.gallery-wide{grid-column:auto;grid-row:auto}.experience-section{padding:86px 0}.experience-image,.experience-image img{min-height:500px}.mini-features{grid-template-columns:1fr}.about-image,.about-image img{min-height:520px}.about-image{border-radius:100px 100px 24px 24px}.voucher-section{padding:20px 0 86px}.voucher-card{padding:32px;gap:42px}.gift-card-visual{width:100%;padding:22px}.contact-methods{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer-links{flex-wrap:wrap}.whatsapp-float span{display:none}.whatsapp-float{padding:9px;right:14px;bottom:14px}.booking-hero{padding:120px 0 70px}.booking-form{grid-template-columns:1fr;padding:22px}.full-field,.form-heading{grid-column:auto}.booking-intro h1{font-size:3.8rem}.back-link{font-size:.78rem}.compact-footer .footer-grid>p{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}


/* BOEKING: locatiekeuze + extern adres */
.field-help{display:block;margin-top:-2px;color:var(--muted);font-size:.72rem}
.location-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.choice-card{display:flex;align-items:flex-start;gap:12px;padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.018);cursor:pointer;transition:.2s ease}
.choice-card:hover{border-color:var(--line-gold);background:rgba(205,163,115,.035)}
.choice-card input{margin-top:5px;accent-color:var(--accent)}
.choice-card span{display:grid;gap:4px}
.choice-card strong{color:var(--text);font-size:.95rem}
.choice-card small{color:var(--muted);font-size:.77rem;line-height:1.5}
.external-address{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:22px;border:1px solid var(--line-gold);border-radius:18px;background:rgba(205,163,115,.035)}
.external-address[hidden]{display:none}
.external-address-heading{grid-column:1/-1}
.external-address-heading h3{margin:0 0 5px;font-size:1.25rem}
.external-address-heading p{margin:0;color:var(--muted);font-size:.82rem}
@media(max-width:640px){
  .location-choice,.external-address{grid-template-columns:1fr}
  .external-address-heading{grid-column:auto}
}


/* GROTER RELAX LAUREN LOGO */
.site-header .brand{gap:18px}
@media(max-width:640px){
  }

/* VERZENDMETHODE */
.send-choice{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.send-option{position:relative;display:flex;align-items:flex-start;gap:11px;padding:17px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.018);cursor:pointer;transition:.2s ease}
.send-option:hover{border-color:var(--line-gold);background:rgba(205,163,115,.035)}
.send-option input{margin-top:5px;accent-color:var(--accent)}
.send-option span{display:grid;gap:4px}
.send-option strong{font-size:.95rem;color:var(--text)}
.send-option small{color:var(--muted);font-size:.75rem;line-height:1.45}
.send-option.recommended{border-color:var(--line-gold);background:rgba(205,163,115,.05)}
.send-option .preferred{display:inline-flex;width:max-content;margin-top:2px;padding:3px 7px;border-radius:999px;background:rgba(205,163,115,.12);color:var(--accent-2);font-size:.62rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.send-option:has(input:checked){background:rgba(255,255,255,.018) !important;border-color:var(--line) !important;box-shadow:none !important}
@media(max-width:640px){
  .send-choice{grid-template-columns:1fr}
}


.home-page .price-row{justify-content:flex-start}


.home-page .site-header .nav{
    min-height:38vh;
  }
  .home-page .hero{
    padding-top:42vh;
  }
}


/* =========================================================
   HOMEPAGINA V13
   - menulogo: halve hoogte van de vorige 33vh-versie
   - hero start met groot merklogo + één foto + duidelijke boodschap
   ========================================================= */
.home-page .site-header .brand-logo{
  height:16.5vh;
  min-height:92px;
  max-height:145px;
  width:auto;
  max-width:260px;
  object-fit:contain;
}
.home-page .site-header .nav{
  min-height:19vh;
  max-height:170px;
}
.home-page .site-header .brand-copy{
  display:none;
}
.home-page .hero{
  min-height:100svh;
  padding-top:clamp(175px,22vh,220px);
}
.hero-start-grid{
  grid-template-columns:.95fr 1.05fr;
  gap:64px;
}
.hero-brand-message{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.hero-brand-message h1{
  font-size:clamp(3.6rem,6vw,6.7rem);
  margin:20px 0 24px;
}
.hero-brand-message .hero-lead{
  max-width:610px;
  font-size:1.12rem;
}
.hero-single-photo{
  min-height:690px;
}
.hero-single-photo .hero-photo-wrap{
  inset:0 24px 26px 20px;
  border-radius:160px 160px 32px 32px;
}
.hero-single-photo .hero-photo{
  object-position:center 18%;
}

@media(max-width:1050px){
  .home-page .site-header .brand-logo{
    height:13vh;
    min-height:78px;
    max-height:115px;
  }
  .home-page .site-header .nav{
    min-height:15vh;
    max-height:135px;
  }
  .home-page .hero{
    padding-top:clamp(145px,18vh,180px);
  }
  .hero-start-grid{
    grid-template-columns:1fr;
  }
  .hero-brand-message{
    align-items:center;
    text-align:center;
  }
  .hero-brand-message .hero-lead{
    margin-left:auto;
    margin-right:auto;
  }
  .hero-brand-message .hero-actions,
  .hero-brand-message .trust-row{
    justify-content:center;
  }
  .hero-single-photo{
    min-height:620px;
    max-width:720px;
    width:100%;
    margin:auto;
  }
}

@media(max-width:640px){
  .home-page .site-header .brand-logo{
    height:11vh;
    min-height:64px;
    max-height:92px;
    max-width:190px;
  }
  .home-page .site-header .nav{
    min-height:13vh;
    max-height:108px;
  }
  .home-page .hero{
    padding-top:130px;
  }
  .hero-brand-message h1{
    font-size:3.45rem;
  }
  .hero-single-photo{
    min-height:540px;
  }
  .hero-single-photo .hero-photo-wrap{
    inset:0 8px 18px;
    border-radius:100px 100px 24px 24px;
  }
}


/* V15: banner bovenaan op alle pagina's */
.site-header .brand{
  gap:0;
}
.site-header .brand-logo{
  width:auto;
  height:auto;
  max-width:min(460px, 58vw);
  max-height:110px;
  object-fit:contain;
}
.site-header .nav{
  min-height:124px;
}
.brand-copy{
  display:none !important;
}

/* Eerste pagina gebruikt in de header enkel de banner */
.home-page .site-header .brand-logo{
  max-width:min(520px, 64vw);
  max-height:120px;
}

/* Hero-banner op homepagina blijft opvallend groot */
@media(max-width:1050px){
  .site-header .brand-logo{
    max-width:min(360px, 62vw);
    max-height:88px;
  }
  .site-header .nav{
    min-height:102px;
  }
  .home-page .site-header .brand-logo{
    max-width:min(390px, 72vw);
    max-height:92px;
  }
}

@media(max-width:640px){
  .site-header .brand-logo{
    max-width:min(280px, 74vw);
    max-height:68px;
  }
  .site-header .nav{
    min-height:84px;
  }
  .home-page .site-header .brand-logo{
    max-width:min(300px, 80vw);
    max-height:72px;
  }
}


/* V16: foto's Over en Ervaring even hoog als de grote hero-foto */
.experience-image,
.about-image{
  min-height:690px;
  height:690px;
}
.experience-image img,
.about-image img{
  width:100%;
  height:100%;
  min-height:690px;
  object-fit:cover;
}

/* Houd de compositie van de portretfoto's rustig */
.about-image img{object-position:center 18%}
.experience-image img{object-position:center 18%}

@media(max-width:1050px){
  .experience-image,
  .about-image{
    min-height:620px;
    height:620px;
  }
  .experience-image img,
  .about-image img{
    min-height:620px;
    height:620px;
  }
}

@media(max-width:640px){
  .experience-image,
  .about-image{
    min-height:540px;
    height:540px;
  }
  .experience-image img,
  .about-image img{
    min-height:540px;
    height:540px;
  }
}


/* V17: home hero zonder tweede banner naast de foto */
.hero-brand-message{
  justify-content:center;
}
.hero-brand-message .eyebrow{
  margin-bottom:4px;
}

/* Geen lege eindpagina / onnodige ruimte onder de site */
html,body{
  min-height:0;
}
body{
  padding-bottom:0;
}
main{
  margin-bottom:0;
}
.site-footer{
  margin-bottom:0;
}


/* V18: rustige onderzijde en grotere banner in contactsectie */
.whatsapp-float{
  display:none !important;
}

.location-card .contact-banner{
  width:min(100%, 420px);
  height:auto;
  max-height:none;
  object-fit:contain;
  margin:0 auto 30px;
}

.location-card{
  display:flex;
  flex-direction:column;
  align-items:stretch;
}

.location-card h3,
.location-card > p{
  text-align:center;
}

.location-card .location-line{
  width:100%;
}

/* Geen extra CTA-knoppen onderaan in de contactkaart */
.location-card .full-btn{
  display:none !important;
}

/* Footer compacter en zonder overbodige knoppenlook */
.site-footer{
  padding:28px 0;
}
.footer-links{
  gap:16px;
  font-size:.82rem;
}

@media(max-width:640px){
  .location-card .contact-banner{
    width:min(100%, 330px);
    margin-bottom:24px;
  }
}


/* V19: boekingspagina - alleen banner, geen merknaam/ondertitel ernaast */
.booking-page .site-header .brand-copy{
  display:none !important;
}
.booking-page .site-header .brand{
  gap:0;
}


/* V20: onderaan geen extra teksten of navigatielinks */
.site-footer .footer-grid{
  grid-template-columns:1fr;
  justify-items:start;
}
.site-footer .footer-brand{
  margin-bottom:8px;
}
.site-footer .footer-brand > div,
.site-footer .footer-links{
  display:none !important;
}
.site-footer .footer-grid > p{
  grid-column:auto;
}


/* V21: footer zonder banner */
.site-footer .footer-brand{
  display:none !important;
}
.site-footer .footer-grid{
  grid-template-columns:1fr;
  justify-items:start;
}
.site-footer .footer-grid > p{
  margin:0;
}


/* V22: duidelijke boekingsknop onder contactmethodes */
.contact-booking-cta{
  width:100%;
  margin-top:18px;
  min-height:62px;
  font-size:1rem;
  letter-spacing:.02em;
  box-shadow:0 16px 40px rgba(205,163,115,.16);
}


/* V23: banner boekingspagina exact gelijk aan andere pagina's */
.booking-page .site-header .brand-logo{
  width:auto;
  height:auto;
  max-width:min(460px, 58vw);
  max-height:110px;
  object-fit:contain;
}

@media(max-width:1050px){
  .booking-page .site-header .brand-logo{
    max-width:min(360px, 62vw);
    max-height:88px;
  }
}

@media(max-width:640px){
  .booking-page .site-header .brand-logo{
    max-width:min(280px, 74vw);
    max-height:68px;
  }
}


/* V29: opvallende bewegende melding onder de banner */
.site-announcement{
  position:relative;
  z-index:5;
  margin-top:124px;
  border-block:1px solid rgba(255,190,92,.48);
  background:linear-gradient(90deg,rgba(255,170,50,.13),rgba(255,214,145,.10),rgba(255,170,50,.13));
  color:#ffd28e;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(255,167,55,.08);
}
.site-announcement .container{
  padding:16px 0;
  overflow:hidden;
  white-space:nowrap;
  font-size:1.15rem;
  font-weight:850;
  letter-spacing:.02em;
}
.site-announcement .container span{
  display:inline-block;
  min-width:max-content;
  padding-inline:28px;
  animation:siteNoticeMove 10s linear infinite alternate;
}
@keyframes siteNoticeMove{
  from{transform:translateX(-18%)}
  to{transform:translateX(18%)}
}
.site-announcement + main .hero{
  min-height:calc(100svh - 58px);
}
@media(max-width:1050px){
  .site-announcement{margin-top:110px}
}
@media(max-width:640px){
  .site-announcement{margin-top:92px}
  .site-announcement .container{padding:14px 0;font-size:1rem}
  .site-announcement .container span{animation-duration:8s;padding-inline:18px}
}
@media(prefers-reduced-motion:reduce){
  .site-announcement .container{white-space:normal}
  .site-announcement .container span{
    animation:none;
    white-space:normal;
  }
}
/* V32: gouden ster voor verborgen beheer + stabiele header */
.site-header{
  position:fixed;
}

/* De navigatie houdt een vaste geometrie zodat de Afspraak-knop de banner
   of de rest van de pagina niet meer zijwaarts laat verspringen. */
.home-page .site-header .nav{
  display:grid;
  grid-template-columns:minmax(0,auto) 1fr;
  align-items:center;
  gap:22px;
}
.home-page .site-header .brand{
  min-width:0;
  justify-self:start;
}
.home-page .site-header .nav-links{
  justify-self:end;
  min-width:0;
  flex-wrap:nowrap;
}
.home-page .site-header .nav-links .btn{
  flex:0 0 auto;
  white-space:nowrap;
  min-width:94px;
}

.hidden-admin-hold{
  position:absolute;
  top:12px;
  right:12px;
  width:28px;
  height:28px;
  min-width:28px;
  min-height:28px;
  padding:0;
  margin:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#e8bd70;
  opacity:.62;
  cursor:default;
  z-index:100;
  box-shadow:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:none;
}
.hidden-admin-hold::before{
  content:"★";
  display:block;
  font-size:17px;
  line-height:28px;
  text-align:center;
  text-shadow:0 0 9px rgba(232,189,112,.28);
}
.hidden-admin-hold:hover{
  opacity:.88;
  color:#f4d49c;
  background:rgba(205,163,115,.04);
}
.hidden-admin-hold.holding{
  opacity:1;
  color:#ffd58a;
  text-shadow:0 0 12px rgba(255,205,120,.45);
}

@media(max-width:1050px){
  .home-page .site-header .nav{
    grid-template-columns:minmax(0,1fr) auto;
    gap:14px;
  }
  .home-page .site-header .brand-logo{
    max-width:min(390px,calc(100vw - 160px));
  }
  .home-page .site-header .nav-links{
    width:auto;
  }
}

@media(max-width:640px){
  .home-page .site-header .nav{
    gap:10px;
  }
  .home-page .site-header .brand-logo{
    max-width:min(270px,calc(100vw - 138px));
  }
  .home-page .site-header .nav-links .btn{
    min-width:82px;
    padding:9px 13px;
  }
  .hidden-admin-hold{
    top:7px;
    right:7px;
    width:24px;
    height:24px;
    min-width:24px;
    min-height:24px;
  }
  .hidden-admin-hold::before{
    font-size:15px;
    line-height:24px;
  }
}



/* V33: mobiele header stabiel — ster vóór Afspraak, geen horizontale verschuiving */
.site-header{
  overflow:visible;
}

.site-header .nav{
  position:relative;
}

/* Afspraakknop uit de normale flex-flow zodat hij de pagina nooit breder maakt */
.site-header .header-cta,
.site-header a[href="afspraak.php"].btn,
.site-header a[href="afspraak.php"].nav-cta{
  position:absolute !important;
  right:34px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
  z-index:25 !important;
  white-space:nowrap !important;
  max-width:calc(100vw - 180px) !important;
  box-sizing:border-box !important;
}

/* Gouden ster direct vóór de Afspraakknop */
.hidden-admin-hold{
  position:absolute !important;
  top:50% !important;
  right:142px !important;
  transform:translateY(-50%) !important;
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  color:#d8ad67 !important;
  opacity:1 !important;
  box-shadow:none !important;
  cursor:pointer !important;
  z-index:30 !important;
  display:grid !important;
  place-items:center !important;
  font-size:25px !important;
  line-height:1 !important;
}

/* Zorg dat de ster ook echt zichtbaar is */
.hidden-admin-hold::before{
  content:"★";
  display:block;
  color:#d8ad67;
  text-shadow:0 0 8px rgba(216,173,103,.28);
  transform:translateY(-1px);
}

.hidden-admin-hold.holding::before{
  text-shadow:0 0 13px rgba(216,173,103,.75);
  transform:translateY(-1px) scale(1.08);
}

/* Voorkom horizontale overflow/verschuiving op mobiel */
html, body{
  max-width:100%;
  overflow-x:hidden;
}

@media(max-width:760px){
  .site-header .nav{
    min-height:92px;
    padding-right:0 !important;
  }

  .site-header .brand{
    max-width:calc(100% - 205px);
    min-width:0;
  }

  .site-header .brand-logo{
    max-width:100% !important;
    height:auto !important;
  }

  .site-header .header-cta,
  .site-header a[href="afspraak.php"].btn,
  .site-header a[href="afspraak.php"].nav-cta{
    right:18px !important;
    min-width:118px !important;
    max-width:132px !important;
    padding-inline:20px !important;
  }

  .hidden-admin-hold{
    right:142px !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    font-size:27px !important;
  }
}

@media(max-width:420px){
  .site-header .brand{
    max-width:calc(100% - 190px);
  }

  .site-header .header-cta,
  .site-header a[href="afspraak.php"].btn,
  .site-header a[href="afspraak.php"].nav-cta{
    right:12px !important;
    min-width:112px !important;
    max-width:120px !important;
    padding-inline:15px !important;
    font-size:.95rem !important;
  }

  .hidden-admin-hold{
    right:132px !important;
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    min-height:30px !important;
    font-size:26px !important;
  }
}


/* =========================================================
   V34 — grotere Lauren-banner, compacte Afspraakknop,
   behandelingskaarten binnen het mobiele scherm
   ========================================================= */

/* Banner duidelijk groter in de hoofding */
.site-header .brand{
  min-width:0;
}
.site-header .brand-logo{
  width:auto !important;
  height:auto !important;
  max-width:min(590px,66vw) !important;
  max-height:138px !important;
  object-fit:contain !important;
}
.home-page .site-header .brand-logo{
  max-width:min(620px,69vw) !important;
  max-height:145px !important;
}
.site-header .nav{
  min-height:138px;
}

/* Afspraakknop ongeveer de helft van de vorige mobiele knop */
.site-header a[href="afspraak.php"].btn,
.site-header a[href="afspraak.php"].nav-cta,
.site-header .header-cta{
  min-width:68px !important;
  max-width:74px !important;
  min-height:34px !important;
  padding:6px 9px !important;
  font-size:.70rem !important;
  line-height:1 !important;
  right:14px !important;
}

/* Ster vóór de compactere Afspraakknop */
.hidden-admin-hold{
  right:92px !important;
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  min-height:34px !important;
  font-size:29px !important;
}
.hidden-admin-hold::before{
  font-size:29px !important;
}

/* Behandelingskaarten mogen nooit breder worden dan hun container */
#behandelingen,
#behandelingen .container,
.treatment-grid,
.treatment-card{
  min-width:0;
  max-width:100%;
}
.treatment-grid{
  width:100%;
}
.treatment-card{
  width:100%;
  overflow:hidden;
}
.treatment-card h3,
.treatment-card p,
.treatment-card .text-link{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}
.treatment-card .text-link{
  white-space:normal;
}

/* Tablet */
@media(max-width:1050px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(500px,calc(100vw - 155px)) !important;
    max-height:116px !important;
  }
  .site-header .nav{
    min-height:116px;
  }
}

/* Mobiel */
@media(max-width:760px){
  .site-header .nav{
    min-height:96px !important;
    padding-inline:0 !important;
  }

  .site-header .brand{
    max-width:calc(100% - 118px) !important;
    width:auto !important;
  }

  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(255px,calc(100vw - 118px)) !important;
    max-height:82px !important;
  }

  .site-header a[href="afspraak.php"].btn,
  .site-header a[href="afspraak.php"].nav-cta,
  .site-header .header-cta{
    right:8px !important;
    min-width:62px !important;
    max-width:66px !important;
    min-height:32px !important;
    padding:5px 7px !important;
    font-size:.66rem !important;
  }

  .hidden-admin-hold{
    right:76px !important;
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
  }
  .hidden-admin-hold::before{
    font-size:27px !important;
  }

  /* smallere, nette behandelingkaders */
  #behandelingen .container{
    width:calc(100% - 32px) !important;
    max-width:100% !important;
  }
  .treatment-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:14px !important;
  }
  .treatment-card{
    padding:22px 20px !important;
    border-radius:20px !important;
  }
  .treatment-top{
    margin-bottom:36px !important;
  }
  .treatment-card h3{
    font-size:1.7rem !important;
  }
}

/* Zeer smalle Android-schermen */
@media(max-width:420px){
  .site-header .brand{
    max-width:calc(100% - 112px) !important;
  }
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(238px,calc(100vw - 112px)) !important;
    max-height:78px !important;
  }

  .site-header a[href="afspraak.php"].btn,
  .site-header a[href="afspraak.php"].nav-cta,
  .site-header .header-cta{
    right:6px !important;
    min-width:58px !important;
    max-width:62px !important;
    min-height:30px !important;
    padding:5px 6px !important;
    font-size:.63rem !important;
  }

  .hidden-admin-hold{
    right:69px !important;
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    min-height:30px !important;
  }
  .hidden-admin-hold::before{
    font-size:25px !important;
  }

  #behandelingen .container{
    width:calc(100% - 28px) !important;
  }
  .treatment-card{
    padding:20px 17px !important;
  }
  .treatment-card h3{
    font-size:1.55rem !important;
  }
}


/* =========================================================
   V35 — nieuwe Lauren-banner en groter in de hoofding
   ========================================================= */
.site-header .brand-logo{
  width:auto !important;
  height:auto !important;
  max-width:min(760px,74vw) !important;
  max-height:170px !important;
  object-fit:contain !important;
}
.home-page .site-header .brand-logo{
  max-width:min(800px,76vw) !important;
  max-height:178px !important;
}
.site-header .nav{
  min-height:152px !important;
}

@media(max-width:1050px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(620px,calc(100vw - 150px)) !important;
    max-height:132px !important;
  }
  .site-header .nav{
    min-height:124px !important;
  }
}

@media(max-width:760px){
  .site-header .brand{
    max-width:calc(100% - 108px) !important;
  }
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(320px,calc(100vw - 108px)) !important;
    max-height:96px !important;
  }
  .site-header .nav{
    min-height:104px !important;
  }
}

@media(max-width:420px){
  .site-header .brand{
    max-width:calc(100% - 104px) !important;
  }
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(300px,calc(100vw - 104px)) !important;
    max-height:92px !important;
  }
  .site-header .nav{
    min-height:100px !important;
  }
}


/* V36: Private VIP Experience behandelingen */
#behandelingen .section-heading{
  max-width:820px;
}
#behandelingen .section-heading > p{
  max-width:760px;
  line-height:1.75;
}
#behandelingen .treatment-top{
  display:flex;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
#behandelingen .treatment-top span:last-child{
  color:var(--accent-2);
}
.vip-signoff{
  margin-top:34px;
  padding:22px 26px;
  border:1px solid rgba(205,163,115,.22);
  border-radius:18px;
  text-align:center;
  background:rgba(205,163,115,.045);
}
.vip-signoff strong,
.vip-signoff span{
  display:block;
}
.vip-signoff strong{
  color:var(--accent-2);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.35rem;
  font-weight:500;
}
.vip-signoff span{
  margin-top:7px;
  color:var(--muted);
  font-style:italic;
}
@media(max-width:760px){
  #behandelingen .section-heading{
    max-width:100%;
  }
  #behandelingen .section-heading h2{
    font-size:clamp(2rem,9vw,3.1rem);
  }
  #behandelingen .treatment-top{
    gap:8px;
  }
  #behandelingen .treatment-top span{
    font-size:.72rem;
  }
  .vip-signoff{
    margin-top:22px;
    padding:18px 16px;
  }
  .vip-signoff strong{
    font-size:1.15rem;
  }
}


/* V37: banner ongeveer 20% kleiner */
.site-header .brand-logo{
  max-width:min(608px,59vw) !important;
  max-height:136px !important;
}
.home-page .site-header .brand-logo{
  max-width:min(640px,61vw) !important;
  max-height:142px !important;
}
.site-header .nav{
  min-height:124px !important;
}

@media(max-width:1050px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(496px,calc(100vw - 150px)) !important;
    max-height:106px !important;
  }
  .site-header .nav{
    min-height:104px !important;
  }
}

@media(max-width:760px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(256px,calc(100vw - 108px)) !important;
    max-height:77px !important;
  }
  .site-header .nav{
    min-height:88px !important;
  }
}

@media(max-width:420px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:min(240px,calc(100vw - 104px)) !important;
    max-height:74px !important;
  }
  .site-header .nav{
    min-height:86px !important;
  }
}

/* Duidelijke Terug-knop op de afspraakpagina */
.booking-back-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:92px;
  min-height:42px;
  padding:10px 18px;
  border-radius:999px;
  border:0;
  text-decoration:none;
  font-weight:800;
  font-size:.9rem;
  line-height:1;
  color:#24160e;
  background:linear-gradient(135deg,var(--accent-2),var(--accent));
  box-shadow:0 10px 28px rgba(205,163,115,.16);
}
.booking-back-btn:hover{
  transform:translateY(-1px);
}


/* V39: prijsweergave op Afspraak-pagina */
.appointment-price-box{
  margin-top:12px;
  padding:14px 16px;
  border:1px solid rgba(205,163,115,.26);
  border-radius:14px;
  background:rgba(205,163,115,.055);
  display:grid;
  grid-template-columns:auto 1fr;
  gap:3px 12px;
  align-items:center;
}
.appointment-price-box[hidden]{
  display:none !important;
}
.appointment-price-box > span{
  color:var(--muted);
  font-size:.82rem;
}
.appointment-price-box > strong{
  justify-self:end;
  color:var(--accent-2);
  font-size:1.18rem;
}
.appointment-price-box > small{
  grid-column:1 / -1;
  color:var(--muted);
  font-size:.78rem;
}


/* V40: prijs duidelijk zichtbaar op Afspraak-pagina */
.appointment-price-box{
  margin-top:14px;
  padding:16px 18px;
  border:1px solid rgba(222,180,112,.42);
  border-radius:14px;
  background:rgba(205,163,115,.10);
  box-shadow:0 10px 28px rgba(0,0,0,.10);
}
.appointment-price-box > span{
  font-weight:700;
}
.appointment-price-box > strong{
  color:#f0c98e;
  font-size:1.28rem;
}


/* V41: banner/foto-parameterblad + grotere beheerster */
.hidden-admin-hold{
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
}
.hidden-admin-hold::before{
  font-size: 34px !important;
}
@media (max-width: 760px){
  .hidden-admin-hold{
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
  .hidden-admin-hold::before{
    font-size: 32px !important;
  }
}


/* V43: beide prijzen zichtbaar in de behandelingskaders */
.treatment-prices{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:22px 0 18px;
}
.treatment-prices > div{
  min-width:0;
  padding:12px 13px;
  border:1px solid rgba(205,163,115,.24);
  border-radius:13px;
  background:rgba(205,163,115,.055);
}
.treatment-prices span,
.treatment-prices strong{
  display:block;
}
.treatment-prices span{
  color:var(--muted);
  font-size:.72rem;
  line-height:1.25;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.treatment-prices strong{
  margin-top:5px;
  color:var(--accent-2);
  font-family:var(--serif);
  font-size:1.08rem;
  font-weight:600;
}
@media(max-width:420px){
  .treatment-prices{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .treatment-prices > div{
    padding:10px 9px;
  }
  .treatment-prices span{
    font-size:.65rem;
  }
  .treatment-prices strong{
    font-size:1rem;
  }
}


/* V44: extra verplaatsingskader */
.travel-note-card{
  border-style:dashed;
  background:linear-gradient(180deg,rgba(205,163,115,.075),rgba(255,255,255,.018));
}
.travel-note-card h3{
  color:var(--accent-2);
}


/* V45: rechtstreeks-contactkader onderaan de afspraakpagina */
.booking-help-bottom{
  margin-top:28px;
  padding-bottom:10px;
}
.booking-help-bottom .booking-help{
  width:100%;
  max-width:760px;
  margin:0 auto;
  text-align:center;
}
.booking-help-bottom .booking-help p{
  margin-bottom:12px;
}
.booking-help-bottom .booking-help a{
  display:inline-flex;
  margin:4px 8px;
}
@media(max-width:640px){
  .booking-help-bottom{
    margin-top:20px;
  }
  .booking-help-bottom .booking-help a{
    display:flex;
    justify-content:center;
    margin:8px 0;
  }
}


/* V46: automatische fotocarrousel */
.photo-flow-section{
  overflow:hidden;
}
.photo-flow{
  width:min(100%,980px);
  margin:0 auto;
  user-select:none;
  -webkit-user-select:none;
  outline:none;
}
.photo-flow-stage{
  position:relative;
  aspect-ratio:16/10;
  min-height:360px;
  max-height:720px;
  overflow:hidden;
  border-radius:28px;
  border:1px solid rgba(205,163,115,.22);
  background:#0b090b;
  box-shadow:0 28px 70px rgba(0,0,0,.32);
  cursor:pointer;
}
.photo-flow-slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  opacity:0;
  transform:scale(1.015);
  transition:opacity .85s ease, transform 1.1s ease;
  pointer-events:none;
}
.photo-flow-slide.is-active{
  opacity:1;
  transform:scale(1);
}
.photo-flow-shade{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 70%,rgba(8,6,8,.52));
}
.photo-flow-status{
  position:absolute;
  left:18px;
  bottom:16px;
  z-index:2;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(10,8,10,.62);
  backdrop-filter:blur(8px);
  color:#e9d8c1;
  font-size:.78rem;
  letter-spacing:.04em;
}
.photo-flow.is-paused .photo-flow-status{
  color:#f4cd91;
  border-color:rgba(205,163,115,.34);
}
.photo-flow-dots{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:9px;
  margin-top:16px;
}
.photo-flow-dot{
  width:9px;
  height:9px;
  min-width:9px;
  min-height:9px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  cursor:pointer;
  transition:width .25s ease, background .25s ease;
}
.photo-flow-dot.is-active{
  width:28px;
  background:#cda373;
}
@media(max-width:760px){
  .photo-flow-stage{
    aspect-ratio:3/4;
    min-height:0;
    border-radius:22px;
  }
  .photo-flow-status{
    left:12px;
    bottom:12px;
  }
}
@media(prefers-reduced-motion:reduce){
  .photo-flow-slide{transition:opacity .2s linear;transform:none!important}
}


/* V49: lokale SEO-regel */
.local-seo-strip{
  padding:18px 0;
  border-top:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.015);
}
.local-seo-strip p{
  margin:0;
  text-align:center;
  color:var(--muted);
  font-size:.84rem;
  line-height:1.6;
}


/* V50: Beleving op maat */
.experience-copy .experience-signature{
  margin:22px 0 10px;
  padding:13px 16px;
  border-left:2px solid var(--accent);
  color:var(--accent-2);
  font-weight:800;
  letter-spacing:.04em;
}
.experience-copy .experience-closing{
  margin-top:14px;
  font-family:var(--serif);
  font-size:1.08rem;
  color:var(--text);
  line-height:1.65;
}


/* V51: luxe kernpunten in Over mij */
.about-luxury-points{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:24px 0 26px;
}
.about-point{
  padding:14px 15px;
  border:1px solid rgba(205,163,115,.16);
  border-radius:14px;
  background:rgba(255,255,255,.018);
}
.about-point strong{
  display:block;
  margin-bottom:5px;
  color:var(--accent-2);
  font-size:.95rem;
}
.about-point span{
  display:block;
  color:var(--muted);
  font-size:.84rem;
  line-height:1.55;
}
@media(max-width:700px){
  .about-luxury-points{
    grid-template-columns:1fr;
  }
}


/* V53: desktop header en menu opnieuw uitgelijnd */
@media (min-width: 901px){
  .site-header .nav{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:24px !important;
    min-height:92px !important;
    height:auto !important;
    padding-top:10px !important;
    padding-bottom:10px !important;
  }

  .site-header .brand{
    flex:0 0 auto !important;
    max-width:none !important;
  }

  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:420px !important;
    max-height:88px !important;
  }

  .site-header .nav-links{
    position:static !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:18px !important;
    flex-wrap:nowrap !important;
    margin-left:auto !important;
    width:auto !important;
    overflow:visible !important;
  }

  .site-header .nav-links > a:not(.btn){
    white-space:nowrap !important;
  }

  .site-header .hidden-admin-hold{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    left:auto !important;
    transform:none !important;
    flex:0 0 42px !important;
    margin:0 !important;
  }

  .site-header a[href="afspraak.php"].btn,
  .site-header a[href="afspraak.php"].nav-cta,
  .site-header .header-cta{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    left:auto !important;
    transform:none !important;
    flex:0 0 auto !important;
    min-width:82px !important;
    max-width:none !important;
    min-height:38px !important;
    padding:8px 14px !important;
    font-size:.76rem !important;
    margin:0 !important;
  }

  .hero{
    min-height:auto !important;
    padding-top:118px !important;
    padding-bottom:70px !important;
  }

  .hero.hero-intro{
    min-height:auto !important;
  }
}

/* Brede monitoren: genoeg ruimte voor alle menu-items */
@media (min-width: 1200px){
  .site-header .nav{
    gap:30px !important;
  }
  .site-header .nav-links{
    gap:22px !important;
  }
}

/* V53: titel Behandelingen op brede monitor niet ongewenst onder elkaar */
#behandelingen .section-heading h2{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:baseline !important;
  gap:.25em !important;
}
#behandelingen .section-heading h2 em{
  display:inline !important;
  white-space:nowrap !important;
}
@media (min-width: 900px){
  #behandelingen .section-heading h2{
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
  }
}

/* Bij smallere desktops gecontroleerd iets compacter */
@media (min-width: 901px) and (max-width: 1180px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:340px !important;
  }
  .site-header .nav-links{
    gap:12px !important;
  }
  .site-header .nav-links > a:not(.btn){
    font-size:.82rem !important;
  }
}


/* V55: belangrijke titels op brede schermen op één regel */
@media (min-width: 900px){
  #behandelingen .section-heading h2,
  #behandelingen .section-heading h2 em{
    white-space:nowrap !important;
    flex-wrap:nowrap !important;
  }

  .photo-carousel-section .section-heading h2,
  .photo-carousel-section .section-heading h2 em,
  #foto .section-heading h2,
  #foto .section-heading h2 em{
    white-space:nowrap !important;
    flex-wrap:nowrap !important;
  }
}

/* Op kleinere schermen mogen de titels natuurlijk afbreken */
@media (max-width: 899px){
  #behandelingen .section-heading h2,
  #behandelingen .section-heading h2 em,
  .photo-carousel-section .section-heading h2,
  .photo-carousel-section .section-heading h2 em,
  #foto .section-heading h2,
  #foto .section-heading h2 em{
    white-space:normal !important;
  }
}


/* V58: luxe Behandelingen-sectie naar voorbeeld */
#behandelingen{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding-top:112px;
  padding-bottom:118px;
  background:
    radial-gradient(circle at 78% 18%, rgba(184,126,71,.16), transparent 23rem),
    radial-gradient(circle at 8% 78%, rgba(112,69,38,.12), transparent 30rem),
    linear-gradient(115deg,#0a0909 0%,#12100f 46%,#0a0909 100%);
}
#behandelingen::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.72;
  background:
    linear-gradient(90deg,rgba(0,0,0,.12),rgba(0,0,0,.04) 55%,rgba(0,0,0,.34)),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.012) 0,
      rgba(255,255,255,.012) 1px,
      transparent 1px,
      transparent 78px
    );
}
#behandelingen::after{
  content:"";
  position:absolute;
  right:-8vw;
  bottom:-22%;
  width:62vw;
  height:58%;
  z-index:-1;
  pointer-events:none;
  border-radius:52% 0 0 0;
  background:
    radial-gradient(ellipse at 42% 20%,rgba(210,162,107,.14),transparent 44%),
    linear-gradient(180deg,rgba(54,39,30,.24),rgba(9,8,8,.03));
  filter:blur(2px);
  transform:rotate(-3deg);
}

#behandelingen .container{
  width:min(1420px,calc(100% - 72px));
}

#behandelingen .treatment-heading{
  display:block !important;
  max-width:980px;
  margin:0 0 64px;
}
#behandelingen .treatment-heading .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:16px;
  margin-bottom:34px;
  padding:9px 14px;
  border:1px solid rgba(222,180,112,.18);
  background:rgba(255,255,255,.055);
  color:#d9b57f;
  font-size:.76rem;
  letter-spacing:.28em;
  text-transform:uppercase;
}
#behandelingen .treatment-heading .eyebrow::before{
  content:"";
  display:block;
  width:34px;
  height:1px;
  margin-left:-62px;
  margin-right:12px;
  background:#d8a95f;
}

#behandelingen .treatment-heading h2{
  display:block !important;
  margin:0 0 28px;
  font-family:var(--serif);
  font-size:clamp(3.05rem,5.3vw,5.65rem);
  line-height:.98;
  letter-spacing:-.035em;
  font-weight:500;
  white-space:nowrap !important;
}
#behandelingen .treatment-heading h2 > span{
  color:#e1b36f;
}
#behandelingen .treatment-heading h2 em{
  display:inline !important;
  color:#f5f0e9;
  font-weight:400;
  white-space:nowrap !important;
}
#behandelingen .treatment-heading > p{
  max-width:820px;
  margin:0;
  color:#d0c6be;
  font-size:1.02rem;
  line-height:1.85;
}

#behandelingen .treatment-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  align-items:stretch;
}
#behandelingen .treatment-card{
  min-height:430px !important;
  padding:38px 38px 32px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:24px !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.008)),
    rgba(10,10,10,.74) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(4px);
}
#behandelingen .treatment-card:hover{
  transform:translateY(-4px);
  border-color:rgba(219,174,111,.36) !important;
  background:
    linear-gradient(145deg,rgba(218,169,103,.045),rgba(255,255,255,.01)),
    rgba(10,10,10,.78) !important;
}

#behandelingen .treatment-top{
  display:grid !important;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  margin-bottom:62px !important;
  color:#f0ece7;
}
#behandelingen .treatment-top::before{
  content:none;
}
#behandelingen .treatment-top span:first-child{
  order:1;
  color:#eee7df;
  font-size:.78rem;
  letter-spacing:.04em;
  white-space:nowrap;
}
#behandelingen .treatment-top::after{
  content:"";
  order:2;
  height:1px;
  min-width:34px;
  background:#d5a456;
}
#behandelingen .treatment-top span:last-child{
  order:3;
  color:#d9ad6a;
  font-size:.75rem;
  letter-spacing:.05em;
  text-align:right;
  text-transform:uppercase;
  white-space:nowrap;
}

#behandelingen .treatment-card h3{
  margin:0 0 20px;
  font-family:var(--serif);
  font-size:clamp(2rem,2.5vw,2.65rem) !important;
  font-weight:500;
  line-height:1.08;
  color:#faf5ee;
}
#behandelingen .treatment-card > p{
  margin:0 0 22px;
  color:#c8bfb8;
  font-size:.98rem;
  line-height:1.8;
}

#behandelingen .treatment-prices{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:8px 0 22px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.10);
}
#behandelingen .treatment-prices > div{
  display:grid;
  gap:5px;
}
#behandelingen .treatment-prices span{
  color:#9e948e;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
#behandelingen .treatment-prices strong{
  color:#e4bc80;
  font-size:1rem;
  font-weight:700;
}
#behandelingen .treatment-card .text-link{
  margin-top:auto;
  color:#d9ad6a;
  font-size:.82rem;
  letter-spacing:.03em;
}

#behandelingen .travel-note-card{
  grid-column:1 / -1;
  min-height:auto !important;
  padding:30px 38px !important;
  border-style:dashed !important;
}
#behandelingen .travel-note-card .treatment-top{
  margin-bottom:24px !important;
}

#behandelingen .vip-signoff{
  margin-top:44px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.08);
}
#behandelingen .vip-signoff strong{
  color:#e2bb80;
}

/* Tablet */
@media(max-width:1100px){
  #behandelingen{
    padding-top:92px;
    padding-bottom:92px;
  }
  #behandelingen .container{
    width:min(100% - 44px,1100px);
  }
  #behandelingen .treatment-heading h2{
    font-size:clamp(2.65rem,5.5vw,4.6rem);
  }
  #behandelingen .treatment-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #behandelingen .treatment-card:nth-child(3){
    grid-column:1 / -1;
  }
}

/* Mobiel */
@media(max-width:760px){
  #behandelingen{
    padding-top:72px;
    padding-bottom:72px;
  }
  #behandelingen .container{
    width:calc(100% - 30px) !important;
  }
  #behandelingen .treatment-heading{
    margin-bottom:38px;
  }
  #behandelingen .treatment-heading .eyebrow{
    margin-bottom:22px;
  }
  #behandelingen .treatment-heading .eyebrow::before{
    display:none;
  }
  #behandelingen .treatment-heading h2{
    white-space:normal !important;
    font-size:clamp(2.35rem,12vw,3.5rem);
    line-height:1.03;
  }
  #behandelingen .treatment-heading h2 em{
    white-space:normal !important;
  }
  #behandelingen .treatment-grid{
    grid-template-columns:minmax(0,1fr) !important;
  }
  #behandelingen .treatment-card,
  #behandelingen .treatment-card:nth-child(3),
  #behandelingen .travel-note-card{
    grid-column:auto !important;
    min-height:auto !important;
    padding:28px 24px !important;
  }
  #behandelingen .treatment-top{
    margin-bottom:42px !important;
    gap:12px;
  }
  #behandelingen .treatment-top span:last-child{
    white-space:normal;
  }
}


/* V59: definitieve zichtbare desktop-layout voor Behandelingen */
@media (min-width: 1180px){
  #behandelingen{
    padding:105px 0 115px !important;
    background:
      radial-gradient(circle at 82% 16%,rgba(190,128,63,.20),transparent 25rem),
      linear-gradient(105deg,#080808 0%,#14110f 52%,#090807 100%) !important;
  }

  #behandelingen .container{
    width:min(1480px,calc(100% - 90px)) !important;
  }

  #behandelingen .treatment-heading{
    width:100% !important;
    max-width:1060px !important;
    margin-bottom:58px !important;
  }

  #behandelingen .treatment-heading h2{
    display:block !important;
    width:max-content !important;
    max-width:none !important;
    font-size:clamp(3.6rem,5.15vw,5.8rem) !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  #behandelingen .treatment-heading h2 span,
  #behandelingen .treatment-heading h2 em{
    display:inline !important;
    white-space:nowrap !important;
  }

  #behandelingen .treatment-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
  }

  #behandelingen .treatment-card{
    display:flex !important;
    flex-direction:column !important;
    min-height:445px !important;
    padding:38px 40px 34px !important;
    border-radius:24px !important;
    border:1px solid rgba(255,255,255,.18) !important;
    background:rgba(10,10,10,.78) !important;
  }

  #behandelingen .treatment-card h3{
    font-size:2.45rem !important;
  }

  #behandelingen .travel-note-card{
    grid-column:1 / -1 !important;
    min-height:auto !important;
  }
}


/* V60: duidelijke datum- en uurkeuze op desktop en mobiel */
.booking-form select{
  width:100%;
  min-height:50px;
  padding:12px 42px 12px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background-color:#100d10;
  color:var(--text);
  font:inherit;
  cursor:pointer;
}
.booking-form select:focus{
  border-color:var(--accent);
  outline:none;
  box-shadow:0 0 0 3px rgba(205,163,115,.10);
}


/* V61: Behandelingen-label zonder kader */
#behandelingen .treatment-heading .treatment-eyebrow-plain{
  display:inline-block !important;
  padding:0 !important;
  margin-bottom:24px !important;
  border:0 !important;
  background:transparent !important;
  color:var(--accent) !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
}
#behandelingen .treatment-heading .treatment-eyebrow-plain::before{
  display:none !important;
  content:none !important;
}


/* V62: afspraakknoppen in Behandelingen gelijk aan de andere hoofdknoppen */
#behandelingen .treatment-booking-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:150px !important;
  margin-top:auto !important;
  align-self:flex-start !important;
  padding:11px 18px !important;
  border-radius:999px !important;
  text-decoration:none !important;
  color:#24160e !important;
  background:linear-gradient(135deg,var(--accent-2),var(--accent)) !important;
  border:0 !important;
  font-weight:850 !important;
  font-size:.82rem !important;
  line-height:1 !important;
  box-shadow:0 10px 28px rgba(205,163,115,.16) !important;
}
#behandelingen .treatment-booking-btn:hover{
  transform:translateY(-1px) !important;
}


/* V68: optionele, eerlijke zichtbare lokale SEO-sectie */
.local-seo-public{
  background:#0d0b0d;
  color:#f6f1ec;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:42px 0;
}
.local-seo-public h2{
  margin:0 0 12px;
  color:#f6f1ec;
  font-family:var(--serif);
  font-weight:500;
}
.local-seo-public p{
  max-width:900px;
  margin:0;
  color:#eee7df;
  line-height:1.75;
}
.local-seo-public .local-seo-areas{
  margin-top:12px;
  color:#cda373;
}


/* V69: zachtere, rustigere visuele structuur */
:root{
  --soft-line:rgba(255,255,255,.08);
  --soft-shadow:0 18px 50px rgba(0,0,0,.22);
}

body{
  background:
    radial-gradient(circle at 18% 10%,rgba(205,163,115,.035),transparent 28rem),
    linear-gradient(180deg,#0c0a0b 0%,#100d0e 48%,#0b090a 100%);
}

.section{
  padding-top:88px;
  padding-bottom:88px;
}

.card,
.about-point,
.treatment-card,
.contact-card,
.booking-form,
.admin-card,
.panel,
.photo-card,
.faq-item,
.price-card,
.mode-option{
  border-color:var(--soft-line) !important;
  border-radius:22px !important;
  box-shadow:var(--soft-shadow);
}

.about-point,
.contact-card,
.booking-form,
.photo-card,
.faq-item,
.price-card,
.mode-option{
  background:
    linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.006)),
    rgba(18,14,15,.78) !important;
}

body,
p,
li,
small,
.field-help,
.hint{
  color:#d8cfca;
}

p{
  line-height:1.78;
}

.btn,
button,
input[type="submit"]{
  border-radius:999px !important;
  box-shadow:0 10px 28px rgba(205,163,115,.12);
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease;
}

.btn:hover,
button:hover,
input[type="submit"]:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 34px rgba(205,163,115,.16);
}

.site-header{
  background:linear-gradient(180deg,rgba(10,8,9,.94),rgba(10,8,9,.82)) !important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.045);
}

.hero{
  background:
    radial-gradient(circle at 72% 20%,rgba(205,163,115,.08),transparent 26rem),
    linear-gradient(180deg,#0d0a0b 0%,#100d0e 74%,#0d0b0c 100%) !important;
}

.about-luxury-points{
  gap:16px !important;
}

.about-point{
  padding:24px !important;
}

.experience-section{
  background:
    radial-gradient(circle at 18% 30%,rgba(205,163,115,.05),transparent 25rem),
    linear-gradient(135deg,#100d0e,#151112 52%,#0e0c0d) !important;
}

#behandelingen{
  background:
    radial-gradient(circle at 78% 18%,rgba(184,126,71,.11),transparent 28rem),
    linear-gradient(115deg,#0c0a0a 0%,#151111 48%,#0b0909 100%) !important;
}

#behandelingen .treatment-card{
  border-color:rgba(255,255,255,.11) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.004)),
    rgba(13,11,11,.72) !important;
  box-shadow:0 20px 44px rgba(0,0,0,.18);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,background .28s ease;
}

#behandelingen .treatment-card:hover{
  transform:translateY(-3px);
  border-color:rgba(219,174,111,.25) !important;
  box-shadow:0 24px 52px rgba(0,0,0,.22);
}

.photo-carousel,
.photo-carousel-frame,
#foto img{
  border-radius:26px !important;
}

.photo-carousel-frame{
  overflow:hidden;
  box-shadow:0 22px 54px rgba(0,0,0,.23);
}

.faq-item{
  margin-bottom:12px;
  padding:18px 20px;
}

.faq-item + .faq-item{
  border-top:none !important;
}

input,
select,
textarea{
  border-radius:14px !important;
  border-color:rgba(255,255,255,.10) !important;
  background:#121011 !important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

input:focus,
select:focus,
textarea:focus{
  border-color:rgba(205,163,115,.55) !important;
  box-shadow:0 0 0 4px rgba(205,163,115,.07) !important;
  background:#151213 !important;
}

.site-footer{
  border-top:1px solid rgba(255,255,255,.05);
  background:#0a0809;
}

@media(max-width:760px){
  .section{
    padding-top:68px;
    padding-bottom:68px;
  }

  .about-point,
  .treatment-card,
  .booking-form,
  .contact-card{
    border-radius:18px !important;
  }
}



/* V70: zwarte/donkere basis vervangen door warme beige achtergrond */
:root{
  --beige-bg:#e8dccb;
  --beige-bg-2:#f1e7d8;
  --beige-panel:#eadfce;
  --beige-panel-2:#f4ecdf;
  --beige-text:#2f2925;
  --beige-muted:#665d56;
  --beige-line:rgba(65,49,37,.13);
}

/* Hoofdachtergrond */
body{
  background:
    radial-gradient(circle at 18% 10%,rgba(176,132,84,.10),transparent 28rem),
    linear-gradient(180deg,var(--beige-bg-2) 0%,var(--beige-bg) 55%,#e3d4c1 100%) !important;
  color:var(--beige-text) !important;
}

body,
p,
li,
small,
.field-help,
.hint{
  color:var(--beige-muted) !important;
}

h1,h2,h3,h4,h5,h6,
strong,
label{
  color:var(--beige-text);
}

/* Header licht beige */
.site-header{
  background:linear-gradient(180deg,rgba(241,231,216,.97),rgba(232,220,203,.94)) !important;
  border-bottom:1px solid var(--beige-line) !important;
  box-shadow:0 10px 30px rgba(70,52,38,.08);
}
.site-header .nav-links a:not(.btn){
  color:#3b322d !important;
}

/* Hero */
.hero{
  background:
    radial-gradient(circle at 72% 20%,rgba(174,126,74,.11),transparent 26rem),
    linear-gradient(180deg,#f2e8da 0%,#eadfce 74%,#e5d7c4 100%) !important;
  color:var(--beige-text) !important;
}
.hero p,
.hero .lead,
.hero .trust-row{
  color:#625950 !important;
}

/* Algemene secties */
.section,
.experience-section,
#behandelingen,
.local-seo-public{
  background:
    linear-gradient(180deg,rgba(244,236,223,.96),rgba(232,220,203,.98)) !important;
  color:var(--beige-text) !important;
}

/* Kaarten */
.card,
.about-point,
.treatment-card,
.contact-card,
.booking-form,
.admin-card,
.panel,
.photo-card,
.faq-item,
.price-card,
.mode-option{
  background:
    linear-gradient(145deg,rgba(255,255,255,.36),rgba(255,255,255,.10)),
    var(--beige-panel) !important;
  border-color:var(--beige-line) !important;
  color:var(--beige-text) !important;
  box-shadow:0 18px 40px rgba(75,55,40,.10) !important;
}

/* Behandelingen-kaarten licht houden */
#behandelingen .treatment-card{
  background:
    linear-gradient(145deg,rgba(255,255,255,.35),rgba(255,255,255,.08)),
    #e6d7c4 !important;
  border-color:rgba(81,58,40,.15) !important;
  color:var(--beige-text) !important;
}
#behandelingen .treatment-card h3,
#behandelingen .treatment-top span:first-child{
  color:#2f2925 !important;
}
#behandelingen .treatment-card > p{
  color:#655c55 !important;
}
#behandelingen .treatment-top::after{
  background:#b88b56 !important;
}
#behandelingen .treatment-prices{
  border-top-color:rgba(79,58,43,.12) !important;
}
#behandelingen .treatment-prices span{
  color:#776d65 !important;
}
#behandelingen .treatment-prices strong{
  color:#9a6b38 !important;
}

/* Beleving */
.experience-section .experience-copy{
  background:rgba(244,236,223,.78) !important;
}

/* Formulieren */
input,
select,
textarea{
  background:#f7efe3 !important;
  color:#2f2925 !important;
  border-color:rgba(79,58,43,.14) !important;
}
input::placeholder,
textarea::placeholder{
  color:#8a7d72 !important;
}
input:focus,
select:focus,
textarea:focus{
  background:#fbf6ee !important;
  border-color:rgba(177,128,78,.55) !important;
  box-shadow:0 0 0 4px rgba(177,128,78,.10) !important;
}

/* FAQ en tekst */
.faq-item summary,
.faq-item h3{
  color:#342d28 !important;
}
.faq-item p{
  color:#665d56 !important;
}

/* Foto's */
.photo-carousel-frame{
  box-shadow:0 22px 46px rgba(74,53,38,.14) !important;
}

/* Lokale SEO-sectie indien zichtbaar */
.local-seo-public{
  border-top:1px solid var(--beige-line) !important;
  border-bottom:1px solid var(--beige-line) !important;
}
.local-seo-public h2,
.local-seo-public p{
  color:#342d28 !important;
}
.local-seo-public .local-seo-areas{
  color:#9f7548 !important;
}

/* Footer */
.site-footer{
  background:#dfcfbc !important;
  border-top:1px solid var(--beige-line) !important;
  color:#554b44 !important;
}

/* Admin/beheer: lichte structuur */
.admin-card,
.panel{
  background:#efe3d2 !important;
}
table{
  color:#332c27;
}
th{
  background:rgba(119,88,59,.08);
}
td,th{
  border-color:rgba(79,58,43,.10) !important;
}

/* Goudaccenten behouden */
.eyebrow,
.text-link,
#behandelingen .treatment-card .text-link{
  color:#9d7041 !important;
}


/* V71: laatste donkere vlakken volledig naar beige */
.intro-strip,
.gallery-section,
.contact-section,
.booking-page,
.booking-main,
.booking-hero{
  background:linear-gradient(180deg,#f2e8da 0%,#e8dccb 100%) !important;
  color:#2f2925 !important;
}
.image-note,
.booking-help,
.booking-help-bottom .booking-help{
  background:rgba(244,236,223,.94) !important;
  color:#2f2925 !important;
  border-color:rgba(65,49,37,.13) !important;
  box-shadow:0 15px 34px rgba(75,55,40,.09) !important;
}
.image-note *,
.booking-help *,
.booking-help-bottom .booking-help *{color:#5f554e !important}
.choice-card{
  background:#f4ecdf !important;
  color:#2f2925 !important;
  border-color:rgba(65,49,37,.13) !important;
}
.choice-card:has(input:checked){
  background:#f4ecdf !important;
  border-color:rgba(65,49,37,.13) !important;
  box-shadow:none !important;
}
.choice-card:has(input:disabled){opacity:.5;cursor:not-allowed}
.form-heading h2,.booking-intro h1{color:#2f2925 !important}
.booking-form select{background:#fbf6ee !important;color:#2f2925 !important;border-color:rgba(65,49,37,.14) !important}
.compact-footer{background:#dfcfbc !important}

.send-option:has(input:checked){background:#f4ecdf !important;color:#2f2925 !important;border-color:rgba(65,49,37,.13) !important;box-shadow:none !important}

/* V72 stable interaction states */
#behandelingen .treatment-card:hover,
#behandelingen .treatment-card:active,
#behandelingen .treatment-card:focus-within{
  background:rgba(255,255,255,.58) !important;
  border-color:rgba(65,49,37,.12) !important;
  transform:none !important;
  box-shadow:none !important;
}
.treatment-card .text-link:focus-visible,
.treatment-card a:focus-visible,
.choice-card:focus-within,
.send-option:focus-within{
  outline:2px solid rgba(157,112,65,.35);
  outline-offset:2px;
}


/* V74 — definitieve visuele harmonie desktop + mobiel */
:root{
  --bg:#eadfce !important;--bg-2:#f3eadc !important;--panel:#f7efe4 !important;--panel-2:#e7d8c5 !important;
  --text:#332b25 !important;--muted:#6b6158 !important;--accent:#b58249 !important;--accent-2:#d9b47f !important;
  --accent-dark:#7a542f !important;--line:rgba(73,54,40,.14) !important;--line-gold:rgba(181,130,73,.30) !important;
  --shadow:0 18px 48px rgba(75,55,40,.11) !important;--radius:24px !important
}
html{background:#eadfce}
body{background:radial-gradient(circle at 18% 8%,rgba(206,161,108,.11),transparent 30rem),linear-gradient(180deg,#f4ebde 0%,#eadfce 52%,#e4d4c0 100%) !important;color:var(--text) !important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.container{width:min(1280px,calc(100% - 56px))}.section{padding:96px 0}
h1,h2,h3,h4{color:var(--text) !important}
p,.muted,.section-heading>p,.treatment-card p,.experience-copy>p,.step p,.about-copy p,.faq-intro p,.faq-list p,.contact-copy>p,small,.field-help,.hint{color:var(--muted) !important}
.eyebrow{color:#9c6d3b !important}.eyebrow::before{background:#b58249 !important}
.site-header,.site-header.scrolled,.site-header.solid{background:rgba(243,234,220,.94) !important;border-bottom:1px solid rgba(73,54,40,.10) !important;box-shadow:0 10px 34px rgba(76,55,40,.07) !important;backdrop-filter:blur(16px)}
.site-header .nav-links>a:not(.btn){color:#4f453e !important}.site-header .nav-links>a:not(.btn):hover{color:#8b6037 !important}.menu-btn{color:#4a4039 !important}
.btn,.booking-back-btn,.treatment-booking-btn,.booking-form button[type="submit"]{display:inline-flex !important;align-items:center !important;justify-content:center !important;min-height:50px !important;padding:12px 22px !important;border:1px solid rgba(126,86,47,.16) !important;border-radius:999px !important;background:linear-gradient(135deg,#dec092 0%,#b98249 100%) !important;color:#2d2118 !important;font-weight:800 !important;line-height:1.1 !important;text-decoration:none !important;box-shadow:0 10px 24px rgba(126,86,47,.12) !important;transition:transform .2s ease,box-shadow .2s ease,filter .2s ease !important}
.btn:hover,.booking-back-btn:hover,.treatment-booking-btn:hover,.booking-form button[type="submit"]:hover{transform:translateY(-1px) !important;filter:brightness(1.025) !important;box-shadow:0 13px 29px rgba(126,86,47,.16) !important}
.btn:active,.booking-back-btn:active,.treatment-booking-btn:active,.booking-form button[type="submit"]:active{transform:none !important}
.btn-ghost,.btn-outline{background:#f6ede0 !important;border:1px solid rgba(126,86,47,.22) !important;color:#6e4d2d !important;box-shadow:none !important}
.hero{background:radial-gradient(circle at 78% 18%,rgba(190,140,83,.13),transparent 28rem),linear-gradient(180deg,#f5ecdf 0%,#eadfce 100%) !important}.hero::before{opacity:.08 !important}.hero h1 em{color:#a87540 !important}.hero-lead,.trust-row{color:#6e6258 !important}
.hero-photo-wrap{border-color:rgba(73,54,40,.13) !important;background:#e7d8c5 !important;box-shadow:0 24px 60px rgba(75,55,40,.14) !important}.hero-badge{background:rgba(248,240,229,.94) !important;border-color:rgba(181,130,73,.34) !important;box-shadow:0 14px 38px rgba(75,55,40,.13) !important}.hero-badge strong{color:#986839 !important}.hero-badge small,.hero-badge span{color:#6e6258 !important}.photo-shade{background:linear-gradient(to top,rgba(56,40,29,.30),transparent 52%) !important}
.intro-strip,.experience-section,.gallery-section,.local-seo-public,.booking-hero{background:linear-gradient(180deg,#f3eadc,#eadfce) !important;border-color:rgba(73,54,40,.10) !important}.intro-strip p{color:#5f554d !important}
.card,.about-point,.treatment-card,.contact-card,.booking-form,.photo-card,.faq-item,.price-card,.mode-option,.experience-copy{background:linear-gradient(145deg,rgba(255,255,255,.42),rgba(255,255,255,.10)),#eadfce !important;border:1px solid rgba(73,54,40,.12) !important;border-radius:22px !important;box-shadow:0 16px 42px rgba(75,55,40,.08) !important}
.experience-section .experience-copy{padding:34px !important}.image-note{background:rgba(244,235,222,.90) !important;border-color:rgba(73,54,40,.13) !important;color:#4e443d !important}
#behandelingen{background:radial-gradient(circle at 80% 16%,rgba(183,129,72,.12),transparent 30rem),linear-gradient(180deg,#f2e7d7 0%,#e8dbc8 100%) !important}
#behandelingen .treatment-card{background:rgba(248,241,231,.72) !important;border-color:rgba(73,54,40,.13) !important;box-shadow:0 14px 38px rgba(75,55,40,.08) !important}
#behandelingen .treatment-card:hover,#behandelingen .treatment-card:active,#behandelingen .treatment-card:focus-within{background:rgba(248,241,231,.72) !important;border-color:rgba(73,54,40,.13) !important;box-shadow:0 14px 38px rgba(75,55,40,.08) !important;transform:none !important}
#behandelingen .treatment-card h3,#behandelingen .treatment-top span:first-child{color:#342d28 !important}#behandelingen .treatment-card>p{color:#675d55 !important}#behandelingen .treatment-prices strong{color:#956637 !important}#behandelingen .treatment-prices span{color:#766a61 !important}
.choice-card,.choice-card:hover,.choice-card:active,.choice-card:focus-within,.choice-card:has(input:checked),.send-option,.send-option:hover,.send-option:active,.send-option:focus-within,.send-option:has(input:checked),.send-option.recommended{background:#f5ecdf !important;border-color:rgba(73,54,40,.13) !important;color:#332b25 !important;box-shadow:none !important;transform:none !important}
.choice-card input,.send-option input{accent-color:#a87540 !important}.choice-card strong,.send-option strong{color:#342d28 !important}.choice-card small,.send-option small{color:#6d6259 !important}.send-option .preferred{background:#ead7bc !important;color:#80582f !important}
.booking-form{background:rgba(248,241,231,.82) !important}input,select,textarea,.booking-form select{background:#fbf5ec !important;color:#332b25 !important;border:1px solid rgba(73,54,40,.14) !important;border-radius:13px !important;box-shadow:none !important}input:focus,select:focus,textarea:focus,.booking-form select:focus{background:#fffaf3 !important;border-color:rgba(181,130,73,.55) !important;outline:none !important;box-shadow:0 0 0 3px rgba(181,130,73,.10) !important}input::placeholder,textarea::placeholder{color:#928376 !important}.form-heading{border-color:rgba(73,54,40,.10) !important}.form-heading>span{color:#9a6a39 !important}.booking-help-bottom .booking-help{background:#f5ecdf !important;border:1px solid rgba(73,54,40,.12) !important;box-shadow:0 14px 34px rgba(75,55,40,.08) !important}
.faq-item{background:#f5ecdf !important}.faq-item summary,.faq-item h3{color:#342d28 !important}.contact-methods a{border-color:rgba(73,54,40,.12) !important}.site-footer,.compact-footer{background:#dfcfbc !important;color:#51483f !important;border-top:1px solid rgba(73,54,40,.10) !important}.site-footer a{color:#6f4d2d !important}.photo-carousel-frame,.experience-image,.about-image{box-shadow:0 20px 48px rgba(75,55,40,.12) !important}
@media(min-width:1100px){.section{padding:100px 0}.section-heading{margin-bottom:48px}.nav{min-height:98px}.site-header .brand-logo,.home-page .site-header .brand-logo{max-width:390px !important;max-height:80px !important}.hero{padding-top:124px !important;padding-bottom:74px !important}}
@media(min-width:761px) and (max-width:1099px){.container{width:min(100% - 38px,1000px)}.section{padding:82px 0}.hero{padding-top:116px !important}.section-heading{gap:28px}}
@media(max-width:760px){.container{width:calc(100% - 28px) !important}.section{padding:66px 0 !important}h1{font-size:clamp(3.1rem,15vw,4.8rem) !important}h2{font-size:clamp(2.15rem,10vw,3.35rem) !important}.site-header .nav{min-height:80px !important}.site-header .brand-logo,.home-page .site-header .brand-logo{max-width:235px !important;max-height:58px !important}.hero{padding-top:100px !important;padding-bottom:58px !important}.hero-actions{gap:10px}.hero-actions .btn{width:100%}.card,.about-point,.treatment-card,.contact-card,.booking-form,.faq-item{border-radius:18px !important}.booking-form{padding:20px !important}.experience-section .experience-copy{padding:24px !important}.treatment-booking-btn{width:100% !important}.booking-back-btn{min-height:42px !important;padding:10px 16px !important}}


/* V75 — Afspraakpagina mobiel: breedte definitief gecorrigeerd */
.booking-page,.booking-main,.booking-hero,.booking-layout,.booking-intro,.booking-form,.booking-form > *,
.location-choice,.external-address,.send-choice,.booking-help-bottom,.booking-help-bottom .booking-help{
  min-width:0 !important;max-width:100% !important;box-sizing:border-box !important;
}
@media (max-width:760px){
  .booking-page{width:100% !important;max-width:100vw !important;overflow-x:hidden !important;}
  .booking-page .container,.booking-page .booking-hero > .container,.booking-page .booking-help-bottom{
    width:100% !important;max-width:100% !important;margin-left:auto !important;margin-right:auto !important;
    padding-left:14px !important;padding-right:14px !important;
  }
  .booking-page .site-header .nav{width:100% !important;max-width:100% !important;padding-left:12px !important;padding-right:12px !important;gap:10px !important;}
  .booking-page .site-header .brand{flex:1 1 auto !important;min-width:0 !important;max-width:calc(100% - 92px) !important;}
  .booking-page .site-header .brand-logo{width:auto !important;max-width:100% !important;height:auto !important;max-height:54px !important;object-fit:contain !important;}
  .booking-page .booking-back-btn{flex:0 0 auto !important;min-width:72px !important;max-width:84px !important;padding:9px 12px !important;white-space:nowrap !important;}
  .booking-hero{width:100% !important;padding:102px 0 54px !important;overflow-x:hidden !important;}
  .booking-layout{display:grid !important;grid-template-columns:minmax(0,1fr) !important;width:100% !important;gap:24px !important;}
  .booking-intro{width:100% !important;padding:0 2px !important;}
  .booking-intro h1{width:100% !important;max-width:100% !important;font-size:clamp(2.75rem,13vw,4rem) !important;line-height:1.02 !important;overflow-wrap:anywhere !important;}
  .booking-form{display:grid !important;grid-template-columns:minmax(0,1fr) !important;width:100% !important;max-width:100% !important;margin:0 !important;padding:18px 14px !important;gap:14px !important;overflow:hidden !important;}
  .booking-form .full-field,.booking-form .form-heading,.booking-form .field,.booking-form label,.booking-form .location-choice,.booking-form .external-address,.booking-form .send-choice,.booking-form .choice-card,.booking-form .send-option,.booking-form .check-field,.booking-form .appointment-price-box{
    grid-column:1 !important;width:100% !important;max-width:100% !important;min-width:0 !important;
  }
  .booking-form .location-choice,.booking-form .external-address,.booking-form .send-choice{grid-template-columns:minmax(0,1fr) !important;}
  .booking-form .external-address{padding:16px 12px !important;}
  .booking-form input,.booking-form select,.booking-form textarea,.booking-form button{width:100% !important;max-width:100% !important;min-width:0 !important;box-sizing:border-box !important;}
  .booking-form select{text-overflow:ellipsis !important;}
  .booking-form .choice-card,.booking-form .send-option{padding:15px 13px !important;overflow:hidden !important;}
  .booking-form .choice-card > span,.booking-form .send-option > span{min-width:0 !important;width:100% !important;}
  .booking-form .choice-card strong,.booking-form .choice-card small,.booking-form .send-option strong,.booking-form .send-option small,.booking-form .field-help,.booking-form .form-heading p{overflow-wrap:anywhere !important;word-break:normal !important;}
  .booking-form .form-heading{gap:12px !important;}
  .booking-form .form-heading > span{flex:0 0 34px !important;}
  .booking-help-bottom{margin-top:22px !important;}
  .booking-help-bottom .booking-help{width:100% !important;padding:16px 14px !important;overflow-wrap:anywhere !important;}
  .compact-footer .container{width:100% !important;max-width:100% !important;padding-left:14px !important;padding-right:14px !important;}
}
@media (max-width:390px){
  .booking-page .booking-hero > .container,.booking-page .booking-help-bottom{padding-left:10px !important;padding-right:10px !important;}
  .booking-form{padding:16px 11px !important;}
  .booking-page .site-header .brand-logo{max-height:48px !important;}
  .booking-page .booking-back-btn{min-width:66px !important;max-width:74px !important;font-size:.72rem !important;}
}


/* V76: zachtere fotokaders + smallere kader voor smalle/portretfoto
   - zwarte randen vervangen door beige achtergrond
   - portretfoto's krijgen automatisch een smaller kader */
.photo-flow{max-width:980px;transition:max-width .35s ease;}
.photo-flow-stage{background:linear-gradient(180deg,#f7efe4 0%,#eadfce 100%) !important;border:1px solid rgba(126,86,47,.16) !important;box-shadow:0 22px 52px rgba(97,72,50,.12) !important;}
.photo-flow-slide{background:transparent !important;}
.photo-flow-shade{background:linear-gradient(180deg,transparent 70%,rgba(91,67,46,.10)) !important;}
.photo-flow-status{border-color:rgba(126,86,47,.16) !important;background:rgba(250,244,236,.88) !important;color:#6d5132 !important;box-shadow:0 8px 20px rgba(97,72,50,.08);}
.photo-flow.is-paused .photo-flow-status{color:#9f6f3d !important;border-color:rgba(171,123,67,.28) !important;background:rgba(250,244,236,.94) !important;}
.photo-flow-dot{background:rgba(126,86,47,.26) !important;}
.photo-flow-dot.is-active{background:#b98249 !important;}
@media (min-width: 761px){
  .photo-flow.is-portrait{max-width:720px !important;}
  .photo-flow.is-portrait .photo-flow-stage{aspect-ratio:4 / 5 !important;max-height:900px !important;}
  .photo-flow.is-squareish{max-width:820px !important;}
  .photo-flow.is-squareish .photo-flow-stage{aspect-ratio:1 / 1 !important;max-height:820px !important;}
}
@media (max-width:760px){
  .photo-flow-stage{background:#efe3d2 !important;}
}



/* V78 — banner, menu, gelijke desktophoogtes, zachtere beleving/foto */
.site-header .hidden-admin-hold,
.home-page .site-header .hidden-admin-hold{
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  min-height:44px !important;
  border-radius:999px !important;
  padding:0 !important;
  border:1px solid rgba(163,120,71,.34) !important;
  background:linear-gradient(180deg,#f3e1c5 0%, #e5ccb0 100%) !important;
  box-shadow:0 10px 24px rgba(105,76,49,.12) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
  overflow:hidden !important;
}
.site-header .hidden-admin-hold::before,
.home-page .site-header .hidden-admin-hold::before{
  content:none !important;
}
.site-header .hidden-admin-hold .hidden-admin-core,
.home-page .site-header .hidden-admin-hold .hidden-admin-core{
  width:12px;
  height:12px;
  border-radius:50%;
  background:linear-gradient(180deg,#a97543 0%, #805731 100%);
  box-shadow:0 0 0 4px rgba(255,255,255,.18);
  opacity:.9;
}
.site-header .hidden-admin-hold:hover,
.site-header .hidden-admin-hold.holding,
.home-page .site-header .hidden-admin-hold:hover,
.home-page .site-header .hidden-admin-hold.holding{
  transform:translateY(-1px) scale(1.03);
  box-shadow:0 14px 28px rgba(105,76,49,.18) !important;
}
.site-header .nav-links{
  gap:18px !important;
  flex-wrap:nowrap !important;
}
.site-header .nav-links > a:not(.btn){
  white-space:nowrap !important;
}
.site-header .nav-links .btn{
  white-space:nowrap !important;
}

.site-header .brand-logo,
.home-page .site-header .brand-logo{
  width:auto !important;
  object-fit:contain !important;
  max-width:430px !important;
  max-height:92px !important;
}
@media(max-width:760px){
  .site-header .brand-logo,
  .home-page .site-header .brand-logo{
    max-width:280px !important;
    max-height:74px !important;
  }
  .site-header .nav-links{
    gap:14px !important;
  }
  .site-header .hidden-admin-hold,
  .home-page .site-header .hidden-admin-hold{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
  }
}

/* Fotobeleving compacter op desktop */
.photo-flow{
  margin-inline:auto;
}
@media(min-width:1100px){
  .photo-flow{
    max-width:760px !important;
  }
  .photo-flow.is-portrait .photo-flow-stage{
    max-height:700px !important;
    aspect-ratio:4 / 5 !important;
  }
  .photo-flow.is-squareish .photo-flow-stage{
    max-height:650px !important;
    aspect-ratio:1 / 1 !important;
  }
  .photo-flow:not(.is-portrait):not(.is-squareish) .photo-flow-stage{
    max-height:620px !important;
  }
}

/* Beleving/over kaders compacter */
.about-luxury-points{
  gap:14px !important;
}
.about-point{
  min-height:0 !important;
  padding:18px 20px !important;
}
.about-point strong{
  font-size:1.08rem !important;
  margin-bottom:8px !important;
}
.about-point span{
  font-size:.96rem !important;
  line-height:1.55 !important;
}

/* Behandelingen: tijd + titel iets groter */
#behandelingen .treatment-card{
  min-height:0 !important;
}
#behandelingen .treatment-top{
  margin-bottom:34px !important;
}
#behandelingen .treatment-top span:first-child{
  font-size:1.06rem !important;
  letter-spacing:.14em !important;
}
#behandelingen .treatment-top span:last-child{
  font-size:1rem !important;
  letter-spacing:.17em !important;
}
#behandelingen .treatment-card h3{
  font-size:2.2rem !important;
}
@media(max-width:760px){
  #behandelingen .treatment-card h3{
    font-size:1.95rem !important;
  }
  #behandelingen .treatment-top{
    margin-bottom:24px !important;
  }
}

/* Desktop secties optisch even hoog */
@media(min-width:1100px){
  #over > .container,
  #ervaring > .container,
  #foto > .container,
  #behandelingen > .container,
  #vragen > .container,
  #contact > .container{
    min-height:calc(100vh - 185px);
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  #over .about-grid,
  #ervaring .experience-grid,
  #contact .contact-grid{
    align-items:center !important;
  }
}

/* FAQ ook zichtbaar in menu-ankerpositie */
#vragen{
  scroll-margin-top:120px;
}




/* V79: Over en Beleving terug compact — tekst links, foto rechts */
@media (min-width: 901px){
  #over > .container,
  #ervaring > .container{
    min-height:0 !important;
    display:block !important;
  }

  #over .about-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr) !important;
    gap:54px !important;
    align-items:center !important;
  }

  #over .about-copy{
    order:1 !important;
  }

  #over .about-image{
    order:2 !important;
    min-height:0 !important;
    height:600px !important;
    margin:0 !important;
    border-radius:30px !important;
  }

  #over .about-image img{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:center 18% !important;
  }

  #over .about-luxury-points{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
    margin:24px 0 !important;
  }

  #over .about-point{
    padding:16px 18px !important;
    min-height:0 !important;
  }

  #over .about-point strong{
    font-size:1.03rem !important;
    margin-bottom:5px !important;
  }

  #over .about-point span{
    font-size:.91rem !important;
    line-height:1.48 !important;
  }

  #ervaring{
    padding:82px 0 !important;
  }

  #ervaring .experience-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr) !important;
    gap:54px !important;
    align-items:center !important;
  }

  #ervaring .experience-copy{
    order:1 !important;
    padding:28px 30px !important;
    min-height:0 !important;
  }

  #ervaring .experience-image{
    order:2 !important;
    min-height:0 !important;
    height:600px !important;
    border-radius:30px !important;
  }

  #ervaring .experience-image img{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:center 18% !important;
  }

  #ervaring .experience-copy h2{
    margin:12px 0 18px !important;
    font-size:clamp(2.5rem,3.7vw,4.1rem) !important;
  }

  #ervaring .experience-copy p{
    margin-bottom:14px !important;
    line-height:1.65 !important;
  }

  #ervaring .experience-closing{
    margin-top:12px !important;
  }
}

/* Tablet: foto nog steeds rechts, maar iets smaller */
@media (min-width: 761px) and (max-width: 900px){
  #over .about-grid,
  #ervaring .experience-grid{
    grid-template-columns:minmax(0,1fr) minmax(300px,.82fr) !important;
    gap:34px !important;
    align-items:center !important;
  }

  #over .about-copy,
  #ervaring .experience-copy{
    order:1 !important;
  }

  #over .about-image,
  #ervaring .experience-image{
    order:2 !important;
    height:520px !important;
    min-height:0 !important;
    border-radius:26px !important;
  }

  #over .about-image img,
  #ervaring .experience-image img{
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }

  #over .about-luxury-points{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
}

/* Mobiel: vertrouwde verticale opbouw */
@media (max-width:760px){
  #over .about-grid,
  #ervaring .experience-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
  }

  #over .about-copy,
  #ervaring .experience-copy{
    order:1 !important;
  }

  #over .about-image,
  #ervaring .experience-image{
    order:2 !important;
    height:420px !important;
    min-height:0 !important;
    border-radius:22px !important;
  }

  #over .about-image img,
  #ervaring .experience-image img{
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }

  #over .about-luxury-points{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #over .about-point{
    padding:15px 16px !important;
  }

  #ervaring .experience-copy{
    padding:20px !important;
  }
}


/* V81: Beleving-titel buiten kader + betere ankerpositie */
#over,
#ervaring{
  scroll-margin-top: 132px;
}

#ervaring .experience-copy{
  background:none !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
}

#ervaring .experience-copy-head{
  margin-bottom:20px;
}

#ervaring .experience-copy-head .eyebrow{
  display:inline-block;
  margin-bottom:10px;
}

#ervaring .experience-copy-head h2{
  margin:0;
}

#ervaring .experience-card{
  background:linear-gradient(145deg,rgba(255,255,255,.42),rgba(255,255,255,.10)),#eadfce !important;
  border:1px solid rgba(73,54,40,.12) !important;
  border-radius:22px !important;
  box-shadow:0 16px 42px rgba(75,55,40,.08) !important;
  padding:28px 30px !important;
}

#ervaring .experience-image img{
  object-position:center 8% !important;
}

@media (min-width: 901px){
  #ervaring .experience-copy{
    padding:0 !important;
  }
  #ervaring .experience-copy-head{
    margin-bottom:22px !important;
  }
  #ervaring .experience-card{
    padding:28px 30px !important;
  }
}

@media (min-width: 761px) and (max-width: 900px){
  #ervaring .experience-image img{
    object-position:center 12% !important;
  }
}

@media (max-width:760px){
  #over,
  #ervaring{
    scroll-margin-top:108px;
  }
  #ervaring .experience-copy{
    padding:0 !important;
  }
  #ervaring .experience-copy-head{
    margin-bottom:16px !important;
  }
  #ervaring .experience-card{
    padding:20px !important;
    border-radius:18px !important;
  }
  #ervaring .experience-image img{
    object-position:center 10% !important;
  }
}


/* V84: Beleving-foto zichtbaar + top uitlijnen met linkerkolom */
#ervaring{
  scroll-margin-top: 158px !important;
}

#ervaring .experience-grid{
  align-items: start !important;
}

#ervaring .experience-copy,
#ervaring .experience-copy-head,
#ervaring .experience-card,
#ervaring .experience-image{
  align-self: start !important;
}

#ervaring .experience-image{
  display:block !important;
  width:100% !important;
  margin-top: 0 !important;
  overflow:hidden !important;
}

#ervaring .experience-image img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 12% !important;
}

@media (min-width: 901px){
  #ervaring .experience-grid{
    align-items: start !important;
  }
  #ervaring .experience-copy-head{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  #ervaring .experience-copy{
    margin-top: 0 !important;
  }
  #ervaring .experience-image{
    min-height: 600px !important;
    height: 600px !important;
    margin-top: 6px !important;
  }
}

@media (min-width: 761px) and (max-width: 900px){
  #ervaring{
    scroll-margin-top: 136px !important;
  }
  #ervaring .experience-grid{
    align-items:start !important;
  }
  #ervaring .experience-image{
    min-height: 520px !important;
    height: 520px !important;
    margin-top: 4px !important;
  }
  #ervaring .experience-image img{
    object-position:center 10% !important;
  }
}

@media (max-width: 760px){
  #ervaring{
    scroll-margin-top: 118px !important;
  }
  #ervaring .experience-grid{
    align-items:start !important;
  }
  #ervaring .experience-image{
    width:100% !important;
    min-height: 420px !important;
    height: 420px !important;
    margin-top: 0 !important;
  }
  #ervaring .experience-image img{
    object-position:center 8% !important;
  }
}


/* V86 — beheerknop uit header, naar voetnoot */
.site-header .hidden-admin-hold,
.home-page .site-header .hidden-admin-hold{
  display:none !important;
}

.site-footer .footer-grid{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  align-items:center !important;
  gap:18px !important;
}

.site-footer .footer-grid > p{
  grid-column:1 !important;
  margin:0 !important;
}

.site-footer .footer-admin-hold{
  grid-column:2 !important;
  justify-self:end !important;
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  padding:0 !important;
  border-radius:999px !important;
  border:1px solid rgba(126,86,47,.22) !important;
  background:linear-gradient(180deg,#f0dec4 0%,#dec3a2 100%) !important;
  box-shadow:0 8px 20px rgba(91,65,43,.10) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  position:relative !important;
}

.site-footer .footer-admin-hold::before{
  content:none !important;
}

.site-footer .footer-admin-hold .hidden-admin-core{
  width:10px !important;
  height:10px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#a97543 0%,#805731 100%) !important;
  box-shadow:0 0 0 3px rgba(255,255,255,.20) !important;
}

.site-footer .footer-admin-hold.holding{
  transform:scale(1.05) !important;
  box-shadow:0 10px 24px rgba(91,65,43,.18) !important;
}

@media(max-width:760px){
  .site-footer .footer-grid{
    grid-template-columns:1fr auto !important;
  }
  .site-footer .footer-admin-hold{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
  }
}

/* V87 — footer beheerknop definitief zichtbaar; oude header-positionering neutraliseren */
.site-footer .footer-admin-hold{
  position:relative !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  transform:none !important;
  opacity:1 !important;
  z-index:2 !important;
  margin:0 !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  border:1px solid rgba(116,79,46,.38) !important;
  background:linear-gradient(180deg,#f5e4ca 0%,#d9b98f 100%) !important;
  box-shadow:0 6px 16px rgba(81,56,37,.18) !important;
  color:#805731 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  place-items:unset !important;
  font-size:0 !important;
}
.site-footer .footer-admin-hold::before{
  content:none !important;
  display:none !important;
}
.site-footer .footer-admin-hold .hidden-admin-core{
  display:block !important;
  width:12px !important;
  height:12px !important;
  min-width:12px !important;
  min-height:12px !important;
  border-radius:50% !important;
  background:#8f6137 !important;
  box-shadow:0 0 0 4px rgba(255,255,255,.25) !important;
}
.site-footer .footer-admin-hold:hover,
.site-footer .footer-admin-hold.holding{
  top:auto !important;
  right:auto !important;
  transform:scale(1.05) !important;
  opacity:1 !important;
}
@media(max-width:760px){
  .site-footer .footer-admin-hold{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    transform:none !important;
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
  }
}


/* V88 — Fotobeleving minder hoog */
@media (min-width:1100px){
  #foto .photo-flow{
    max-width:760px !important;
  }

  #foto .photo-flow-stage,
  #foto .photo-flow.is-portrait .photo-flow-stage,
  #foto .photo-flow.is-squareish .photo-flow-stage,
  #foto .photo-flow:not(.is-portrait):not(.is-squareish) .photo-flow-stage{
    height:520px !important;
    min-height:0 !important;
    max-height:520px !important;
    aspect-ratio:auto !important;
  }
}

@media (min-width:761px) and (max-width:1099px){
  #foto .photo-flow-stage,
  #foto .photo-flow.is-portrait .photo-flow-stage,
  #foto .photo-flow.is-squareish .photo-flow-stage{
    height:460px !important;
    min-height:0 !important;
    max-height:460px !important;
    aspect-ratio:auto !important;
  }
}

@media (max-width:760px){
  #foto .photo-flow-stage,
  #foto .photo-flow.is-portrait .photo-flow-stage,
  #foto .photo-flow.is-squareish .photo-flow-stage{
    height:380px !important;
    min-height:0 !important;
    max-height:380px !important;
    aspect-ratio:auto !important;
  }
}


/* V89 — desktopsecties dezelfde hoogte */
@media (min-width:1100px){

  /* Eén uniforme sectiehoogte onder de vaste header */
  #over,
  #ervaring,
  #foto,
  #behandelingen,
  #vragen,
  #contact{
    min-height:calc(100vh - 98px) !important;
    box-sizing:border-box !important;
    padding-top:72px !important;
    padding-bottom:72px !important;
    scroll-margin-top:116px !important;
  }

  /* De inhoud van elke sectie verticaal centreren */
  #over > .container,
  #ervaring > .container,
  #foto > .container,
  #behandelingen > .container,
  #vragen > .container,
  #contact > .container{
    min-height:calc(100vh - 242px) !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    box-sizing:border-box !important;
  }

  /* Interne grids behouden hun normale layout */
  #over .about-grid,
  #ervaring .experience-grid,
  #contact .contact-grid,
  #vragen .faq-grid{
    width:100% !important;
  }

  /* Fotobeleving: geen extra ruimte door oude regels */
  #foto .section-heading{
    margin-bottom:28px !important;
  }

  #foto .photo-flow{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }

  /* Behandelingen compacter binnen dezelfde schermhoogte */
  #behandelingen .section-heading{
    margin-bottom:32px !important;
  }

  #behandelingen .treatment-grid{
    gap:18px !important;
  }

  #behandelingen .treatment-card{
    padding:24px !important;
  }

  #behandelingen .treatment-top{
    margin-bottom:24px !important;
  }

  #behandelingen .treatment-card > p{
    line-height:1.55 !important;
  }

  #behandelingen .vip-signoff{
    margin-top:24px !important;
  }

  /* FAQ iets compacter zodat ze dezelfde hoogte houdt */
  #vragen .faq-grid{
    gap:48px !important;
  }

  #vragen .faq-list details{
    padding:16px 0 !important;
  }

  /* Contact: oude grote padding overschrijven */
  #contact.contact-section{
    padding-top:72px !important;
    padding-bottom:72px !important;
  }

  #contact .contact-card,
  #contact .location-card{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}

/* Zeer lage desktopvensters: inhoud mag groeien zonder afsnijden */
@media (min-width:1100px) and (max-height:760px){
  #over,
  #ervaring,
  #foto,
  #behandelingen,
  #vragen,
  #contact{
    min-height:662px !important;
    padding-top:54px !important;
    padding-bottom:54px !important;
  }

  #over > .container,
  #ervaring > .container,
  #foto > .container,
  #behandelingen > .container,
  #vragen > .container,
  #contact > .container{
    min-height:554px !important;
  }
}

/* Tablet en mobiel blijven inhoudsgestuurd */
@media (max-width:1099px){
  #over,
  #ervaring,
  #foto,
  #behandelingen,
  #vragen,
  #contact{
    min-height:0 !important;
  }

  #over > .container,
  #ervaring > .container,
  #foto > .container,
  #behandelingen > .container,
  #vragen > .container,
  #contact > .container{
    min-height:0 !important;
  }
}


/* V90 — behandelingskaarten compacter: titel weg, duur links, afspraak rechts */
#behandelingen .treatment-card{
  min-height:0 !important;
  padding:22px 24px !important;
}

#behandelingen .treatment-top{
  display:none !important;
}

#behandelingen .treatment-card h3{
  margin-top:0 !important;
  margin-bottom:14px !important;
}

#behandelingen .treatment-card > p{
  margin-bottom:18px !important;
  line-height:1.5 !important;
}

#behandelingen .treatment-prices{
  margin-top:0 !important;
  margin-bottom:18px !important;
  padding-top:14px !important;
}

#behandelingen .treatment-bottom-row{
  margin-top:auto !important;
  padding-top:16px !important;
  border-top:1px solid rgba(73,54,40,.10) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
}

#behandelingen .treatment-duration{
  font-family:var(--serif) !important;
  font-size:2rem !important;
  line-height:1 !important;
  font-weight:700 !important;
  color:#956637 !important;
  letter-spacing:.04em !important;
  white-space:nowrap !important;
}

#behandelingen .treatment-booking-btn{
  margin:0 !important;
  min-height:46px !important;
  padding:11px 20px !important;
  white-space:nowrap !important;
}

@media(min-width:1100px){
  #behandelingen .treatment-grid{
    align-items:stretch !important;
  }

  #behandelingen .treatment-card{
    display:flex !important;
    flex-direction:column !important;
    padding:20px 22px !important;
  }

  #behandelingen .treatment-card h3{
    font-size:1.95rem !important;
  }

  #behandelingen .treatment-card > p{
    font-size:.95rem !important;
    line-height:1.48 !important;
  }

  #behandelingen .treatment-bottom-row{
    padding-top:14px !important;
  }

  #behandelingen .treatment-duration{
    font-size:2.2rem !important;
  }
}

@media(max-width:760px){
  #behandelingen .treatment-bottom-row{
    flex-direction:row !important;
    align-items:center !important;
  }

  #behandelingen .treatment-duration{
    font-size:1.8rem !important;
  }

  #behandelingen .treatment-booking-btn{
    width:auto !important;
    flex:0 0 auto !important;
    padding:10px 16px !important;
    font-size:.78rem !important;
  }
}


/* V91 — correcte duur per kaart + afspraakknop rechts */
#behandelingen .treatment-bottom-row{
  width:100% !important;
  display:grid !important;
  grid-template-columns:auto 1fr !important;
  align-items:center !important;
  gap:18px !important;
}

#behandelingen .treatment-duration{
  grid-column:1 !important;
  justify-self:start !important;
  display:block !important;
}

#behandelingen .treatment-bottom-row .treatment-booking-btn{
  grid-column:2 !important;
  justify-self:end !important;
  width:auto !important;
  max-width:max-content !important;
  margin:0 !important;
}

#behandelingen .travel-note-card .treatment-top{
  display:none !important;
}

@media(max-width:760px){
  #behandelingen .treatment-bottom-row{
    grid-template-columns:auto minmax(0,1fr) !important;
    gap:12px !important;
  }
  #behandelingen .treatment-bottom-row .treatment-booking-btn{
    justify-self:end !important;
    width:auto !important;
    max-width:100% !important;
  }
}


/* V92 — Over & Beleving desktop: foto links, tekst rechts */
@media (min-width:901px){
  #over .about-grid,
  #ervaring .experience-grid{
    grid-template-columns:minmax(380px,.95fr) minmax(0,1.05fr) !important;
    align-items:center !important;
  }

  #over .about-image{
    order:1 !important;
    grid-column:1 !important;
  }

  #over .about-copy{
    order:2 !important;
    grid-column:2 !important;
  }

  #ervaring .experience-image{
    order:1 !important;
    grid-column:1 !important;
  }

  #ervaring .experience-copy{
    order:2 !important;
    grid-column:2 !important;
  }
}

/* De langere Contact-CTA blijft netjes leesbaar */
.contact-booking-cta{
  text-align:center !important;
  white-space:normal !important;
  line-height:1.25 !important;
  max-width:100% !important;
}


/* V93 — prijzen gelijk uitlijnen, Beleving-foto zonder tekst, Fotobeleving 2 kolommen */

/* Behandelingen: gelijke verticale positie van elk prijsbedrag */
#behandelingen .treatment-prices{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:stretch !important;
}

#behandelingen .treatment-prices > div{
  display:grid !important;
  grid-template-rows:2.4em auto !important;
  align-content:start !important;
  gap:6px !important;
  min-height:72px !important;
}

#behandelingen .treatment-prices span{
  display:flex !important;
  align-items:flex-end !important;
  min-height:2.4em !important;
  line-height:1.2 !important;
  margin:0 !important;
}

#behandelingen .treatment-prices strong{
  display:block !important;
  margin:0 !important;
  line-height:1.1 !important;
  align-self:start !important;
}

/* Beleving: foto zonder tekst-overlay */
#ervaring .image-note{
  display:none !important;
}

/* Fotobeleving: desktop tekst links, foto rechts */
@media (min-width:901px){
  #foto > .photo-flow-layout{
    display:grid !important;
    grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr) !important;
    gap:54px !important;
    align-items:center !important;
    width:min(100% - 48px,1200px) !important;
  }

  #foto .photo-flow-copy{
    grid-column:1 !important;
    align-self:center !important;
  }

  #foto .photo-flow-copy .eyebrow{
    display:inline-block !important;
    margin-bottom:12px !important;
  }

  #foto .photo-flow-copy h2{
    margin:0 !important;
    max-width:420px !important;
    line-height:1.02 !important;
    font-size:clamp(2.8rem,4.2vw,4.8rem) !important;
  }

  #foto .photo-flow{
    grid-column:2 !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
  }

  #foto .photo-flow-stage,
  #foto .photo-flow.is-portrait .photo-flow-stage,
  #foto .photo-flow.is-squareish .photo-flow-stage,
  #foto .photo-flow:not(.is-portrait):not(.is-squareish) .photo-flow-stage{
    height:500px !important;
    min-height:0 !important;
    max-height:500px !important;
    aspect-ratio:auto !important;
  }
}

/* Mobiel/tablet: tekst boven foto */
@media (max-width:900px){
  #foto > .photo-flow-layout{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
  }

  #foto .photo-flow-copy{
    order:1 !important;
  }

  #foto .photo-flow{
    order:2 !important;
    width:100% !important;
  }

  #foto .photo-flow-copy h2{
    margin:10px 0 0 !important;
    line-height:1.04 !important;
  }
}

/* V94 — Over & Beleving desktop definitief: foto links, tekst rechts */
@media (min-width:901px){
  #over > .about-grid,
  #ervaring > .experience-grid{
    display:grid !important;
    grid-template-columns:minmax(360px,.95fr) minmax(0,1.05fr) !important;
    gap:54px !important;
    align-items:center !important;
    width:100% !important;
  }

  #over .about-image{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    align-self:center !important;
    margin:0 !important;
  }

  #over .about-copy{
    grid-column:2 !important;
    grid-row:1 !important;
    order:2 !important;
    align-self:center !important;
    width:100% !important;
  }

  #over .about-luxury-points{
    width:100% !important;
  }

  #ervaring .experience-image{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    align-self:center !important;
    margin:0 !important;
  }

  #ervaring .experience-copy{
    grid-column:2 !important;
    grid-row:1 !important;
    order:2 !important;
    align-self:center !important;
    width:100% !important;
    margin:0 !important;
  }
}

@media (max-width:900px){
  #over > .about-grid,
  #ervaring > .experience-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  #over .about-copy,
  #over .about-image,
  #ervaring .experience-copy,
  #ervaring .experience-image{
    grid-column:1 !important;
  }
}

/* V95 — Start & Fotobeleving desktop: foto links, tekst rechts */
@media (min-width:901px){
  /* Start */
  #home > .hero-start-grid{
    display:grid !important;
    grid-template-columns:minmax(360px,.95fr) minmax(0,1.05fr) !important;
    gap:54px !important;
    align-items:center !important;
  }

  #home .hero-media{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    align-self:center !important;
    margin:0 !important;
  }

  #home .hero-copy{
    grid-column:2 !important;
    grid-row:1 !important;
    order:2 !important;
    align-self:center !important;
    width:100% !important;
  }

  /* Fotobeleving */
  #foto > .photo-flow-layout{
    display:grid !important;
    grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr) !important;
    gap:54px !important;
    align-items:center !important;
  }

  #foto .photo-flow{
    grid-column:1 !important;
    grid-row:1 !important;
    order:1 !important;
    width:100% !important;
    margin:0 !important;
  }

  #foto .photo-flow-copy{
    grid-column:2 !important;
    grid-row:1 !important;
    order:2 !important;
    align-self:center !important;
    width:100% !important;
  }
}

/* Tablet en mobiel: tekst en foto netjes onder elkaar */
@media (max-width:900px){
  #home > .hero-start-grid,
  #foto > .photo-flow-layout{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  #home .hero-copy{
    grid-column:1 !important;
    order:1 !important;
  }

  #home .hero-media{
    grid-column:1 !important;
    order:2 !important;
  }

  #foto .photo-flow-copy{
    grid-column:1 !important;
    order:1 !important;
  }

  #foto .photo-flow{
    grid-column:1 !important;
    order:2 !important;
    width:100% !important;
  }
}


/* V96 — subtiele zijruimte bij alle pagina-inhoud */
:root{
  --section-side-space: 24px;
  --section-inner-gap: 18px;
}

/* Algemene sectiecontainers iets van de randen weg */
main > section > .container,
.site-footer > .container{
  padding-left:var(--section-side-space) !important;
  padding-right:var(--section-side-space) !important;
  box-sizing:border-box !important;
}

/* Start, Over, Beleving en Fotobeleving:
   extra ademruimte tussen foto en tekst/kaders */
@media (min-width:901px){
  #start .hero-grid,
  #over .about-grid,
  #ervaring .experience-grid,
  #foto .photo-flow-layout{
    column-gap:clamp(28px,3vw,48px) !important;
  }

  #start .hero-media,
  #over .about-image,
  #ervaring .experience-image,
  #foto .photo-flow{
    margin-left:var(--section-inner-gap) !important;
  }

  #start .hero-copy,
  #over .about-copy,
  #ervaring .experience-copy,
  #foto .photo-flow-copy{
    margin-right:var(--section-inner-gap) !important;
  }

  #behandelingen .treatment-grid,
  #vragen .faq-grid,
  #contact .contact-grid{
    padding-left:var(--section-inner-gap) !important;
    padding-right:var(--section-inner-gap) !important;
    box-sizing:border-box !important;
  }
}

/* Tablet en mobiel: kleine veilige zijruimte zonder de inhoud te versmallen */
@media (max-width:900px){
  :root{
    --section-side-space:16px;
    --section-inner-gap:0px;
  }

  main > section > .container,
  .site-footer > .container{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  #start .hero-copy,
  #start .hero-media,
  #over .about-copy,
  #over .about-image,
  #ervaring .experience-copy,
  #ervaring .experience-image,
  #foto .photo-flow-copy,
  #foto .photo-flow,
  #behandelingen .treatment-grid,
  #vragen .faq-grid,
  #contact .contact-grid{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
}


/* V97 — Fotobeleving: 20% hoger en 30% smaller op desktop */
@media (min-width:901px){
  #foto > .photo-flow-layout{
    grid-template-columns:minmax(320px,1fr) minmax(0,.70fr) !important;
    gap:48px !important;
  }

  #foto .photo-flow{
    width:70% !important;
    max-width:70% !important;
    justify-self:end !important;
  }

  #foto .photo-flow-stage,
  #foto .photo-flow.is-portrait .photo-flow-stage,
  #foto .photo-flow.is-squareish .photo-flow-stage,
  #foto .photo-flow:not(.is-portrait):not(.is-squareish) .photo-flow-stage{
    height:600px !important;
    min-height:0 !important;
    max-height:600px !important;
    aspect-ratio:auto !important;
  }
}

/* Mobiel/tablet behouden de bestaande maat */
@media (max-width:900px){
  #foto .photo-flow{
    width:100% !important;
    max-width:100% !important;
  }
}


/* V98 — behandelingsprijzen exact gelijk uitgelijnd + zwart */
#behandelingen .treatment-prices{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  align-items:stretch !important;
}

#behandelingen .treatment-prices > div{
  display:grid !important;
  grid-template-rows:30px 32px !important;
  align-items:start !important;
  min-height:78px !important;
  padding:14px 14px 12px !important;
  box-sizing:border-box !important;
}

#behandelingen .treatment-prices span{
  display:flex !important;
  align-items:flex-end !important;
  height:30px !important;
  min-height:30px !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.15 !important;
}

#behandelingen .treatment-prices strong{
  display:flex !important;
  align-items:center !important;
  height:32px !important;
  min-height:32px !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1 !important;
  color:#111111 !important;
  -webkit-text-fill-color:#111111 !important;
  font-weight:500 !important;
}

#behandelingen .treatment-prices strong,
#behandelingen .treatment-prices strong *{
  color:#111111 !important;
  -webkit-text-fill-color:#111111 !important;
}


/* V100 — prijzen en duurtijden behandelingen visueel gelijk */
#behandelingen .treatment-prices{
  align-items:stretch !important;
}

#behandelingen .treatment-prices > div{
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  min-height:90px !important;
}

#behandelingen .treatment-prices span{
  color:#6d5b49 !important;
}

#behandelingen .treatment-prices strong{
  display:flex !important;
  align-items:flex-end !important;
  min-height:1.25em !important;
  margin-top:8px !important;
  color:#000000 !important;
  font-family:var(--sans) !important;
  font-size:1.28rem !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  font-variant-numeric:tabular-nums lining-nums !important;
  white-space:nowrap !important;
}

#behandelingen .treatment-duration{
  display:inline-flex !important;
  align-items:baseline !important;
  color:#000000 !important;
  font-family:var(--sans) !important;
  font-size:2.2rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  font-variant-numeric:tabular-nums lining-nums !important;
  white-space:nowrap !important;
}

#behandelingen .treatment-bottom-row{
  align-items:end !important;
}

@media(max-width:760px){
  #behandelingen .treatment-prices > div{
    min-height:84px !important;
  }

  #behandelingen .treatment-prices strong{
    font-size:1.16rem !important;
  }

  #behandelingen .treatment-duration{
    font-size:1.95rem !important;
  }
}


/* V102 — beheerknop in footer als één enkel rondje */
.site-footer .footer-admin-hold{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  padding:0 !important;
  border-radius:50% !important;
  border:1px solid rgba(108,75,45,.34) !important;
  background:#d7b98f !important;
  box-shadow:0 4px 12px rgba(70,48,31,.14) !important;
  position:relative !important;
  overflow:hidden !important;
}

.site-footer .footer-admin-hold::before,
.site-footer .footer-admin-hold::after,
.site-footer .footer-admin-hold .hidden-admin-core{
  content:none !important;
  display:none !important;
}

.site-footer .footer-admin-hold:hover,
.site-footer .footer-admin-hold.holding{
  background:#cda373 !important;
  transform:scale(1.04) !important;
  box-shadow:0 5px 14px rgba(70,48,31,.18) !important;
}

@media(max-width:760px){
  .site-footer .footer-admin-hold{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    min-height:28px !important;
  }
}
\n\n/* V103 — melding onder banner overal gelijk en vet */\n.site-announcement .container,\n.site-announcement .container span{\n  font-weight:900 !important;\n}\n\n.site-announcement .container span{\n  -webkit-text-stroke:0.01px currentColor;\n}\n

/* V104 — bezoekersmelding groter, zwart en in drukletters */
.site-announcement .container,
.site-announcement .container span{
  color:#000000 !important;
  font-family:var(--sans) !important;
  font-size:1.34rem !important;
  font-weight:900 !important;
  line-height:1.3 !important;
  letter-spacing:.035em !important;
  text-transform:uppercase !important;
  -webkit-text-stroke:0 !important;
}

/* V104 — e-mailformulier rechtstreeks in Contact */
.contact-email-form{
  margin-top:28px;
  padding:24px;
  border:1px solid rgba(73,54,40,.14);
  border-radius:20px;
  background:rgba(255,255,255,.22);
  box-shadow:0 14px 34px rgba(75,55,40,.07);
}
.contact-email-form-head{display:grid;gap:5px;margin-bottom:18px}
.contact-email-form-head strong{font-family:var(--serif);font-size:1.4rem;color:#332b25}
.contact-email-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-email-fields label{display:grid;gap:7px;color:#40372f;font-size:.82rem;font-weight:800;letter-spacing:.025em}
.contact-email-fields label small{font-weight:500;color:#6b6158}
.contact-email-full{grid-column:1/-1}
.contact-email-fields input,
.contact-email-fields textarea{
  width:100%;
  border:1px solid rgba(73,54,40,.18);
  border-radius:12px;
  background:#fffaf3;
  color:#211d19;
  font:inherit;
  font-weight:500;
  padding:11px 13px;
  outline:none;
}
.contact-email-fields textarea{resize:vertical;min-height:120px;line-height:1.5}
.contact-email-fields input:focus,
.contact-email-fields textarea:focus{border-color:#b58249;box-shadow:0 0 0 3px rgba(181,130,73,.12)}
.contact-email-submit{margin-top:16px !important;width:100% !important}
.contact-email-success,.contact-email-error{margin:0 0 14px !important;padding:11px 13px;border-radius:10px;font-weight:700 !important}
.contact-email-success{background:rgba(56,116,68,.10);color:#245c30 !important}
.contact-email-error{background:rgba(145,54,54,.10);color:#7d2727 !important}
.contact-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

@media(max-width:760px){
  .site-announcement .container,
  .site-announcement .container span{font-size:1.08rem !important}
  .contact-email-form{padding:18px}
  .contact-email-fields{grid-template-columns:1fr}
  .contact-email-full{grid-column:auto}
}


/* V105 — bezoekersmelding definitief zwart, groter en extra vet */
.site-announcement,
.site-announcement .container,
.site-announcement .container span{
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
  opacity:1 !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:2rem !important;
  font-weight:900 !important;
  font-style:normal !important;
  line-height:1.2 !important;
  letter-spacing:.025em !important;
  text-transform:uppercase !important;
  text-shadow:none !important;
}

@media(max-width:760px){
  .site-announcement,
  .site-announcement .container,
  .site-announcement .container span{
    font-size:1.45rem !important;
  }
}


/* V106 — bezoekersmelding op ALLE publieke pagina's uniform en extra groot */
.site-announcement,
.site-announcement .container,
.site-announcement .container span,
.public-banner-notice,
.public-banner-notice span,
.message,
.message span,
.booking-site-announcement,
.booking-site-announcement .container,
.booking-site-announcement .container span{
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
  opacity:1 !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:36px !important;
  font-weight:900 !important;
  font-style:normal !important;
  line-height:1.18 !important;
  letter-spacing:.02em !important;
  text-transform:uppercase !important;
  text-shadow:none !important;
  animation:none !important;
  white-space:normal !important;
}

@media(max-width:760px){
  .site-announcement,
  .site-announcement .container,
  .site-announcement .container span,
  .public-banner-notice,
  .public-banner-notice span,
  .message,
  .message span,
  .booking-site-announcement,
  .booking-site-announcement .container,
  .booking-site-announcement .container span{
    font-size:24px !important;
    line-height:1.2 !important;
  }
}


/* V107 — bezoekersmelding knipperend; mobiel exact 50% van desktop */
@keyframes laurenNoticeBlink{
  0%, 48%{opacity:1;}
  49%, 100%{opacity:.18;}
}

.site-announcement .container,
.site-announcement .container span,
.public-banner-notice,
.public-banner-notice span,
.message,
.message span{
  animation:laurenNoticeBlink 1.4s steps(1,end) infinite !important;
}

/* desktopgrootte blijft 36px */
.site-announcement .container,
.site-announcement .container span,
.public-banner-notice,
.public-banner-notice span,
.message,
.message span{
  font-size:36px !important;
}

/* mobiel: exact 50% = 18px */
@media(max-width:760px){
  .site-announcement .container,
  .site-announcement .container span,
  .public-banner-notice,
  .public-banner-notice span,
  .message,
  .message span{
    font-size:18px !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .site-announcement .container,
  .site-announcement .container span,
  .public-banner-notice,
  .public-banner-notice span,
  .message,
  .message span{
    animation:none !important;
    opacity:1 !important;
  }
}


/* V108 — bezoekersmelding naast Start-foto + zwart/grijs overvloeien */
@keyframes massageLaurenNoticeColorFlow{
  0%,
  100%{
    color:#000000;
    -webkit-text-fill-color:#000000;
  }
  50%{
    color:#777777;
    -webkit-text-fill-color:#777777;
  }
}

/* Eén overgang zwart -> grijs per seconde, en de volgende seconde terug */
.hero-visitor-notice,
.public-banner-notice.notice-color-flow,
.public-banner-notice.notice-color-flow span,
.message.notice-color-flow,
.message.notice-color-flow span,
.booking-site-announcement.notice-color-flow,
.booking-site-announcement.notice-color-flow .container,
.booking-site-announcement.notice-color-flow span{
  animation:massageLaurenNoticeColorFlow 2s ease-in-out infinite !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.02em !important;
  line-height:1.2 !important;
  opacity:1 !important;
}

/* Start desktop: melding in de tekstkolom naast de foto */
.hero-visitor-notice{
  font-size:25.2px !important; /* 30% kleiner dan 36px */
  margin:0 0 22px !important;
  padding:12px 0 !important;
  text-align:left !important;
}

/* Aanmeld-/toegangspagina en onderhoud: 30% kleiner */
.public-banner-notice.notice-color-flow,
.message.notice-color-flow{
  font-size:25.2px !important;
  color:#000000;
  -webkit-text-fill-color:#000000;
}

/* Afspraakpagina dezelfde kleurvloei */
.booking-site-announcement.notice-color-flow .container{
  font-size:25.2px !important;
  font-weight:900 !important;
  padding-top:14px !important;
  padding-bottom:14px !important;
  text-align:center !important;
  color:#000000;
  -webkit-text-fill-color:#000000;
}

/* Oude knipper/opacity-animaties uitschakelen; alleen kleur vloeit */
.site-announcement span,
.public-banner-notice span,
.message span{
  opacity:1 !important;
}

@media(max-width:900px){
  /* Op mobiel staat Start opnieuw netjes onder elkaar */
  .hero-visitor-notice{
    font-size:12.6px !important; /* 30% kleiner dan de eerdere mobiele 18px */
    text-align:center !important;
    margin:0 0 16px !important;
    padding:8px 0 !important;
  }

  .public-banner-notice.notice-color-flow,
  .message.notice-color-flow,
  .booking-site-announcement.notice-color-flow .container{
    font-size:12.6px !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-visitor-notice,
  .public-banner-notice.notice-color-flow,
  .public-banner-notice.notice-color-flow span,
  .message.notice-color-flow,
  .message.notice-color-flow span,
  .booking-site-announcement.notice-color-flow,
  .booking-site-announcement.notice-color-flow .container,
  .booking-site-announcement.notice-color-flow span{
    animation:none !important;
    color:#000000 !important;
    -webkit-text-fill-color:#000000 !important;
  }
}


/* V109 — pagina 1 melding: 4 sec per kleurwissel + 50% groter */
.hero-visitor-notice{
  font-size:37.8px !important; /* 25.2px x 1.5 */
  animation:massageLaurenNoticeColorFlow 8s ease-in-out infinite !important;
}
.hero-visitor-notice *{
  font-size:inherit !important;
  animation:inherit !important;
}

@media(max-width:900px){
  .hero-visitor-notice{
    font-size:18.9px !important; /* 12.6px x 1.5 */
    animation:massageLaurenNoticeColorFlow 8s ease-in-out infinite !important;
  }
}


/* V111 — aangeleverde zonsondergang als achtergrond van de publieke site */
body.home-page,
body.booking-page,
body.site-photo-background{
  background-image:
    linear-gradient(rgba(244,235,222,.20),rgba(234,223,206,.20)),
    url("assets/optimized/site-background-v111.webp") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
  background-color:#eadfce !important;
}

/* Secties licht transparant zodat de foto zichtbaar blijft en tekst leesbaar blijft */
body.home-page .hero,
body.home-page main > section,
body.booking-page main > section{
  background:rgba(244,235,222,.78) !important;
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}

body.home-page .site-footer,
body.booking-page .site-footer{
  background:rgba(223,207,188,.88) !important;
}

/* Header iets transparant boven dezelfde achtergrond */
body.home-page .site-header,
body.booking-page .site-header{
  background:rgba(234,223,206,.90) !important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

/* Kaarten blijven rustig en goed leesbaar */
body.home-page .about-point,
body.home-page .experience-card,
body.home-page .treatment-card,
body.home-page .contact-card,
body.home-page .faq-item,
body.booking-page .booking-form,
body.booking-page .booking-card{
  background:rgba(247,239,228,.92) !important;
}

@media(max-width:900px){
  body.home-page,
  body.booking-page,
  body.site-photo-background{
    background-attachment:scroll !important;
    background-position:center center !important;
  }

  body.home-page .hero,
  body.home-page main > section,
  body.booking-page main > section{
    background:rgba(244,235,222,.84) !important;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
}


/* V112 — vaste instelbare verhouding Fotobeleving */
#foto .photo-flow-stage,
#foto .photo-flow.is-portrait .photo-flow-stage,
#foto .photo-flow.is-squareish .photo-flow-stage,
#foto .photo-flow:not(.is-portrait):not(.is-squareish) .photo-flow-stage{
  width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
  aspect-ratio:var(--overview-ratio,4 / 5)!important;
}
#foto .photo-flow-slide{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important}
@media(max-width:900px){
  #foto .photo-flow-stage,#foto .photo-flow.is-portrait .photo-flow-stage,#foto .photo-flow.is-squareish .photo-flow-stage,#foto .photo-flow:not(.is-portrait):not(.is-squareish) .photo-flow-stage{height:auto!important;max-height:none!important;aspect-ratio:var(--overview-ratio,4 / 5)!important}
}


/* V113 — kaart & werkgebied */
.coverage-section{padding-top:20px}
.coverage-layout{display:grid;grid-template-columns:minmax(0,0.92fr) minmax(320px,1.08fr);align-items:stretch;gap:28px}
.coverage-copy{display:flex;flex-direction:column;justify-content:center;gap:18px;padding:26px 10px 26px 0}
.coverage-copy h2{margin:0;font-size:clamp(2rem,4vw,3.6rem);line-height:1.05}
.coverage-copy p{margin:0;font-size:1.02rem;line-height:1.8;color:var(--text-soft,#5b4c40)}
.coverage-map-card{background:rgba(255,250,243,.72);border:1px solid rgba(160,126,76,.20);border-radius:28px;padding:16px;box-shadow:0 16px 36px rgba(116,94,61,.10)}
.coverage-map{width:100%;min-height:520px;border-radius:22px;overflow:hidden;background:#e9dfd1}
.coverage-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.coverage-legend-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.42);border:1px solid rgba(160,126,76,.14)}
.coverage-legend-item strong{display:block;font-size:1rem;color:#2d221b}
.coverage-legend-item small{display:block;color:#6a594c;font-size:.92rem}
.coverage-swatch{display:inline-block;width:18px;height:18px;border-radius:999px;flex:0 0 18px;box-shadow:0 0 0 4px rgba(255,255,255,.7)}
.coverage-swatch.is-green{background:#4a8b4b}
.coverage-swatch.is-yellow{background:#d4b128}
.coverage-swatch.is-red{background:#b85d53}
.coverage-note{font-size:.96rem!important;color:#756354!important}
.leaflet-container{font:inherit}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#fff8ef;color:#2c241d}
.leaflet-control-attribution{background:rgba(255,248,239,.88)!important;color:#534538}
.leaflet-control-attribution a{color:#6d573d}
@media (max-width: 980px){
  .coverage-layout{grid-template-columns:1fr;gap:18px}
  .coverage-copy{padding-right:0}
  .coverage-legend{grid-template-columns:1fr}
  .coverage-map{min-height:420px}
}
@media (max-width: 640px){
  .coverage-map-card{padding:12px;border-radius:22px}
  .coverage-map{min-height:360px;border-radius:18px}
}


/* V114 — zones voor externe afspraak */
.external-zone-choice{margin:8px 0 6px;padding:18px;border:1px solid rgba(73,54,40,.14);border-radius:18px;background:rgba(255,255,255,.26)}
.external-zone-heading{margin-bottom:14px}
.external-zone-heading h3{margin:0 0 5px;font-family:var(--serif);font-size:1.35rem;color:#332b25}
.external-zone-heading p{margin:0;color:#6b6158;font-size:.92rem}
.zone-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.zone-choice-card{position:relative;display:flex;align-items:flex-start;gap:10px;padding:14px 15px;border:1px solid rgba(73,54,40,.16);border-radius:15px;background:rgba(255,250,243,.78);cursor:pointer;transition:.18s ease}
.zone-choice-card:hover{transform:translateY(-1px)}
.zone-choice-card input{margin-top:4px;accent-color:#8b6a3e}
.zone-choice-card span{display:grid;gap:3px}
.zone-choice-card strong{font-size:1rem;color:#2d241d}
.zone-choice-card small{color:#6b6158;line-height:1.35}
.zone-choice-card:has(input:checked){box-shadow:0 0 0 2px rgba(126,86,47,.16);border-color:rgba(126,86,47,.46)}
.zone-choice-card.is-green:has(input:checked){background:rgba(104,160,105,.13)}
.zone-choice-card.is-yellow:has(input:checked){background:rgba(219,191,64,.14)}
.zone-choice-card.is-red:has(input:checked){background:rgba(184,93,83,.12)}
.zone-choice-card.is-outside:has(input:checked){background:rgba(103,95,88,.10)}
.coverage-swatch.is-outside{background:#8b8178}
.coverage-legend-outside{grid-column:1/-1}
@media(max-width:760px){.zone-choice-grid{grid-template-columns:1fr}.external-zone-choice{padding:14px}.external-zone-heading h3{font-size:1.18rem}}


/* V116 — vaste referentiekaart met instelbare cirkels rond Sint-Niklaas */
.coverage-map-shell{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  min-height:520px;
  border-radius:22px;
  overflow:hidden;
  background:#000;
}
.coverage-map-fallback{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:#000;
  object-fit:cover;
  object-position:center;
}
.coverage-zone-overlay{
  --center-x:31.8%;
  --center-y:54.8%;
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
}
.coverage-zone-ring{
  position:absolute;
  left:var(--center-x);
  top:var(--center-y);
  width:var(--zone-size);
  aspect-ratio:1/1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  box-sizing:border-box;
}
.coverage-zone-ring .coverage-zone-label{position:absolute;left:50%;top:14%;transform:translate(-50%,-50%);display:grid;place-items:center;min-width:30px;height:30px;padding:0 8px;border-radius:999px;font-weight:900;font-size:1rem;color:#fff;background:transparent;box-shadow:none;line-height:1;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.coverage-zone-ring.zone-red,
.coverage-zone-ring.zone-yellow,
.coverage-zone-ring.zone-green{
  border:2px solid rgba(255,255,255,.78);
  background:rgba(255,255,255,.04);
}
.coverage-map-center{display:none}
.coverage-map-help{
  margin:10px 4px 0!important;
  color:#6e5d50!important;
  font-size:.88rem!important;
  line-height:1.45!important;
}
@media(max-width:980px){.coverage-map-shell{min-height:420px}}
@media(max-width:640px){.coverage-map-shell{min-height:360px;border-radius:18px}.coverage-zone-overlay{--center-x:31.6%;--center-y:55.1%}.coverage-zone-ring .coverage-zone-label{min-width:24px;height:24px;font-size:.8rem;top:16%}}


/* V120 — rustige kaartweergave */
#werkgebied .coverage-copy{
  gap:14px !important;
}

#werkgebied .coverage-legend{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

#werkgebied .coverage-legend-item{
  gap:0 !important;
  padding:11px 13px !important;
}

/* Geen kleuricoontjes meer in de keuzes/legende */
#werkgebied .coverage-swatch{
  display:none !important;
}

/* Cijfers tegen de rand van iedere cirkel */
.coverage-zone-ring .coverage-zone-label{
  left:50% !important;
  top:12px !important;
  transform:translate(-50%,-50%) !important;
  min-width:26px !important;
  height:26px !important;
  padding:0 6px !important;
  font-size:.9rem !important;
  color:#fff !important;
  background:transparent !important;
  box-shadow:none !important;
  text-shadow:0 1px 4px rgba(0,0,0,.65) !important;
}

/* Mobiel compacter */
@media(max-width:640px){
  #werkgebied{
    min-height:auto !important;
    padding-top:24px !important;
    padding-bottom:24px !important;
  }

  #werkgebied .coverage-layout{
    gap:12px !important;
  }

  #werkgebied .coverage-copy{
    gap:10px !important;
    padding:8px 0 4px !important;
  }

  #werkgebied .coverage-copy h2{
    font-size:1.75rem !important;
  }

  #werkgebied .coverage-legend{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  #werkgebied .coverage-legend-item{
    padding:9px 10px !important;
    border-radius:14px !important;
  }

  #werkgebied .coverage-legend-item strong{
    font-size:.9rem !important;
  }

  #werkgebied .coverage-legend-item small{
    font-size:.78rem !important;
  }

  #werkgebied .coverage-map-card{
    padding:8px !important;
    border-radius:18px !important;
  }

  #werkgebied .coverage-map-shell{
    width:min(100%,420px) !important;
    min-height:0 !important;
    aspect-ratio:715 / 909 !important;
    margin:0 auto !important;
    border-radius:14px !important;
  }

  .coverage-zone-ring .coverage-zone-label{
    min-width:22px !important;
    height:22px !important;
    font-size:.76rem !important;
    top:10px !important;
  }
}


/* V121 — externe zonekeuze: 4 zones in één kader */
.external-zone-choice{
  padding:16px !important;
}

.external-zone-heading{
  margin-bottom:10px !important;
}

.external-zone-heading h3{
  margin:0 !important;
  font-size:1.2rem !important;
}

.zone-choice-grid.zone-choice-grid-compact{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
  border:1px solid rgba(73,54,40,.16) !important;
  border-radius:18px !important;
  overflow:hidden !important;
  background:rgba(255,250,243,.62) !important;
}

.zone-choice-grid-compact .zone-choice-card{
  position:relative !important;
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  align-items:center !important;
  gap:10px !important;
  min-height:66px !important;
  margin:0 !important;
  padding:11px 14px !important;
  border:0 !important;
  border-bottom:1px solid rgba(73,54,40,.12) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}

.zone-choice-grid-compact .zone-choice-card:last-child{
  border-bottom:0 !important;
}

.zone-choice-grid-compact .zone-choice-card:has(input:checked){
  background:rgba(181,130,73,.10) !important;
  box-shadow:inset 3px 0 0 rgba(157,112,65,.72) !important;
}

.zone-choice-grid-compact .zone-choice-card input[type="radio"]{
  position:absolute !important;
  opacity:0 !important;
  width:1px !important;
  height:1px !important;
  pointer-events:none !important;
}

.zone-choice-grid-compact .zone-radio-dot{
  width:20px !important;
  height:20px !important;
  border:2px solid #9d7041 !important;
  border-radius:50% !important;
  display:block !important;
  position:relative !important;
  justify-self:start !important;
}

.zone-choice-grid-compact .zone-choice-card:has(input:checked) .zone-radio-dot::after{
  content:"" !important;
  position:absolute !important;
  inset:4px !important;
  border-radius:50% !important;
  background:#9d7041 !important;
}

.zone-choice-grid-compact .zone-choice-main{
  display:block !important;
  min-width:0 !important;
}

.zone-choice-grid-compact .zone-choice-main strong{
  display:block !important;
  color:#2d241d !important;
  font-size:1.08rem !important;
  line-height:1.15 !important;
}

.zone-choice-grid-compact .zone-choice-main small{
  display:block !important;
  margin-top:4px !important;
  color:#6b6158 !important;
  font-size:.91rem !important;
  line-height:1.25 !important;
}

/* mobiel: selectiebolletjes verder naar links */
@media(max-width:760px){
  .external-zone-choice{
    padding:10px !important;
  }

  .external-zone-heading h3{
    font-size:1.08rem !important;
  }

  .zone-choice-grid-compact .zone-choice-card{
    grid-template-columns:24px minmax(0,1fr) !important;
    gap:7px !important;
    min-height:58px !important;
    padding:9px 10px 9px 5px !important;
  }

  .zone-choice-grid-compact .zone-radio-dot{
    width:18px !important;
    height:18px !important;
    margin-left:0 !important;
    justify-self:start !important;
  }

  .zone-choice-grid-compact .zone-choice-main strong{
    font-size:1rem !important;
  }

  .zone-choice-grid-compact .zone-choice-main small{
    font-size:.83rem !important;
  }
}


/* V122 - werkgebied lager op de pagina en zonder 4 kaders */
.coverage-section-compact .coverage-layout-compact {
  display: grid;
  gap: 1.5rem;
}

.coverage-section-compact .coverage-copy {
  max-width: 42rem;
}

.coverage-section-compact .coverage-copy h2 {
  margin-bottom: 0;
}

.coverage-section-compact .coverage-map-card {
  max-width: 860px;
}

.coverage-section-compact .coverage-map-shell {
  padding: 1rem;
}

.coverage-section-compact .coverage-zone-overlay .coverage-zone-label {
  color: #ffffff;
}

@media (min-width: 900px) {
  .coverage-section-compact .coverage-layout-compact {
    grid-template-columns: 1fr;
  }
}


/* V123 — reservatie: locatiekeuze in dezelfde stijl als zonekeuze */
.location-choice.location-choice-compact{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  border:1px solid rgba(73,54,40,.16)!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:rgba(255,250,243,.62)!important;
}
.location-choice-compact .choice-card{
  position:relative!important;
  display:grid!important;
  grid-template-columns:32px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  min-height:66px!important;
  margin:0!important;
  padding:11px 14px!important;
  border:0!important;
  border-bottom:1px solid rgba(73,54,40,.12)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
.location-choice-compact .choice-card:last-child{border-bottom:0!important}
.location-choice-compact .choice-card:has(input:checked){
  background:rgba(181,130,73,.10)!important;
  box-shadow:inset 3px 0 0 rgba(157,112,65,.72)!important;
}
.location-choice-compact .choice-card input[type="radio"]{
  position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;pointer-events:none!important;
}
.location-choice-compact .zone-radio-dot{
  width:20px!important;height:20px!important;border:2px solid #9d7041!important;border-radius:50%!important;
  display:block!important;position:relative!important;justify-self:start!important;
}
.location-choice-compact .choice-card:has(input:checked) .zone-radio-dot::after{
  content:""!important;position:absolute!important;inset:4px!important;border-radius:50%!important;background:#9d7041!important;
}
.location-choice-compact .choice-main{display:block!important;min-width:0!important}
.location-choice-compact .choice-main strong{display:block!important;color:#2d241d!important;font-size:1.08rem!important;line-height:1.15!important}
.location-choice-compact .choice-main small{display:block!important;margin-top:4px!important;color:#6b6158!important;font-size:.91rem!important;line-height:1.25!important}

.booking-zone-map{margin:0 0 14px!important}
.booking-coverage-map-shell{
  width:min(100%,520px)!important;
  min-height:0!important;
  aspect-ratio:715/909!important;
  margin:0 auto!important;
  border-radius:16px!important;
  overflow:hidden!important;
}

@media(max-width:760px){
  .location-choice-compact .choice-card{
    grid-template-columns:24px minmax(0,1fr)!important;
    gap:7px!important;
    min-height:58px!important;
    padding:9px 10px 9px 5px!important;
  }
  .location-choice-compact .zone-radio-dot{width:18px!important;height:18px!important;margin-left:0!important}
  .location-choice-compact .choice-main strong{font-size:1rem!important}
  .location-choice-compact .choice-main small{font-size:.83rem!important}
  .booking-zone-map{margin:0 0 10px!important}
  .booking-coverage-map-shell{width:min(100%,320px)!important;border-radius:12px!important}
}


/* V125 — zone 4 label, banner release en ronde mobiele selectie */
.brand{position:relative!important}
.site-release-version{
  position:absolute!important;
  left:50%!important;
  bottom:-11px!important;
  transform:translateX(-50%)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:9px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  color:#74685e!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.coverage-zone-ring .coverage-zone-label-4{
  left:100%!important;
  top:50%!important;
  transform:translate(55%,-50%)!important;
  color:#fff!important;
  background:transparent!important;
  text-shadow:0 1px 4px rgba(0,0,0,.65)!important;
}

/* Alle radio-bolletjes werkelijk rond houden */
.location-choice-compact .zone-radio-dot,
.zone-choice-grid-compact .zone-radio-dot{
  box-sizing:border-box!important;
  display:block!important;
  width:20px!important;
  min-width:20px!important;
  max-width:20px!important;
  height:20px!important;
  min-height:20px!important;
  max-height:20px!important;
  aspect-ratio:1 / 1!important;
  border-radius:999px!important;
  padding:0!important;
  margin:0!important;
  flex:0 0 20px!important;
}
.location-choice-compact .choice-card:has(input:checked) .zone-radio-dot::after,
.zone-choice-grid-compact .zone-choice-card:has(input:checked) .zone-radio-dot::after{
  border-radius:999px!important;
}

@media(max-width:760px){
  .location-choice-compact .choice-card,
  .zone-choice-grid-compact .zone-choice-card{
    grid-template-columns:30px minmax(0,1fr)!important;
    padding-left:10px!important;
    gap:8px!important;
  }
  .location-choice-compact .zone-radio-dot,
  .zone-choice-grid-compact .zone-radio-dot{
    width:18px!important;
    min-width:18px!important;
    max-width:18px!important;
    height:18px!important;
    min-height:18px!important;
    max-height:18px!important;
    flex-basis:18px!important;
    margin-left:4px!important;
    justify-self:start!important;
  }
  .site-release-version{bottom:-9px!important;font-size:8px!important}
}


/* V126 — release in voetnoot */
.site-release-note{
  display:inline-block;
  margin-left:.45em;
  font-size:.72em;
  font-weight:700;
  letter-spacing:.04em;
  color:inherit;
  opacity:.72;
}


/* V127 — versie uitsluitend in voetnoot */
.site-release-version{display:none!important}


/* V132 — cijfer 4 groter en dichter tegen cirkel 3 */
.coverage-zone-ring .coverage-zone-label-4{
  left:100% !important;
  top:50% !important;
  transform:translate(18%,-50%) !important;
  min-width:42px !important;
  width:42px !important;
  height:42px !important;
  padding:0 !important;
  font-size:1.8rem !important;
  font-weight:900 !important;
  line-height:1 !important;
}

@media(max-width:640px){
  .coverage-zone-ring .coverage-zone-label-4{
    min-width:36px !important;
    width:36px !important;
    height:36px !important;
    font-size:1.52rem !important;
    transform:translate(14%,-50%) !important;
  }
}


/* V133 — boekingsheader exact dezelfde bannermaat als pagina 1 */
.booking-page .site-header .nav{
  min-height:92px !important;
  height:auto !important;
  padding-top:10px !important;
  padding-bottom:10px !important;
}

.booking-page .site-header .brand{
  flex:0 1 auto !important;
  max-width:none !important;
  min-width:0 !important;
}

.booking-page .site-header .brand-logo{
  width:auto !important;
  height:auto !important;
  max-width:430px !important;
  max-height:92px !important;
  object-fit:contain !important;
}

@media(max-width:760px){
  .booking-page .site-header .nav{
    min-height:86px !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .booking-page .site-header .brand{
    max-width:calc(100% - 96px) !important;
  }

  .booking-page .site-header .brand-logo{
    max-width:280px !important;
    max-height:74px !important;
  }
}


/* V135 — mobiele boekingstitels 20% kleiner */
@media(max-width:760px){
  .booking-page .booking-intro h1{
    font-size:clamp(2.2rem,10.4vw,3.2rem) !important;
  }

  .booking-page .form-heading h2{
    font-size:1.24rem !important;
  }

  .booking-page .external-zone-heading h3{
    font-size:.86rem !important;
  }

  .booking-page .external-address-heading h3{
    font-size:1rem !important;
  }
}


/* V136 — verzendkeuze zonder breed focuskader */
.booking-form .send-option{
  position:relative !important;
  display:grid !important;
  grid-template-columns:30px minmax(0,1fr) !important;
  align-items:center !important;
  gap:10px !important;
  outline:none !important;
}

.booking-form .send-option:focus-within,
.booking-form .send-option:focus,
.booking-form .send-option:active{
  outline:none !important;
  outline-offset:0 !important;
  box-shadow:none !important;
}

.booking-form .send-option input[type="radio"]{
  position:absolute !important;
  opacity:0 !important;
  width:1px !important;
  height:1px !important;
  min-width:1px !important;
  max-width:1px !important;
  margin:0 !important;
  padding:0 !important;
  pointer-events:none !important;
  box-shadow:none !important;
}

.booking-form .send-radio-dot{
  box-sizing:border-box !important;
  display:block !important;
  width:20px !important;
  min-width:20px !important;
  height:20px !important;
  min-height:20px !important;
  border:2px solid #a87540 !important;
  border-radius:50% !important;
  background:transparent !important;
  position:relative !important;
  justify-self:start !important;
}

.booking-form .send-option:has(input:checked) .send-radio-dot::after{
  content:"" !important;
  position:absolute !important;
  inset:4px !important;
  border-radius:50% !important;
  background:#a87540 !important;
}

.booking-form .send-option-content{
  display:grid !important;
  gap:4px !important;
  min-width:0 !important;
  width:100% !important;
}

/* Selectie alleen subtiel aangeven, zonder extra dubbel kader */
.booking-form .send-option:has(input:checked){
  outline:none !important;
  box-shadow:none !important;
  border-color:rgba(73,54,40,.13) !important;
  background:#f5ecdf !important;
}

@media(max-width:760px){
  .booking-form .send-option{
    grid-template-columns:28px minmax(0,1fr) !important;
    gap:8px !important;
  }

  .booking-form .send-radio-dot{
    width:18px !important;
    min-width:18px !important;
    height:18px !important;
    min-height:18px !important;
  }
}


/* V137 — zone bepaalt behandelingskeuze */
.treatment-zone-message{
  display:block;
  margin-top:7px;
  color:#8b4f36 !important;
  font-weight:800;
  font-size:.82rem;
}
.treatment-zone-message[hidden]{display:none !important}

/* Werkgebied desktop: zelfde rustige 2-kolomsopbouw als Beleving */
@media(min-width:901px){
  #werkgebied{
    padding:86px 0 !important;
  }

  #werkgebied > .coverage-layout-compact{
    display:grid !important;
    grid-template-columns:minmax(360px,.95fr) minmax(0,1.05fr) !important;
    gap:54px !important;
    align-items:center !important;
    width:100% !important;
  }

  #werkgebied .coverage-map-card{
    grid-column:1 !important;
    grid-row:1 !important;
    width:100% !important;
    max-width:430px !important;
    justify-self:start !important;
    margin-left:18px !important;
    padding:12px !important;
  }

  #werkgebied .coverage-map-shell{
    width:100% !important;
    min-height:0 !important;
    aspect-ratio:715 / 909 !important;
    padding:0 !important;
    border-radius:20px !important;
  }

  #werkgebied .coverage-copy{
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    max-width:100% !important;
    align-self:center !important;
    margin-right:18px !important;
  }

  #werkgebied .coverage-copy h2{
    margin:12px 0 0 !important;
  }
}


/* V139 — duidelijke melding bij ongeldige zone/behandeling */
.treatment-zone-message{
  display:block !important;
  margin-top:7px !important;
  color:#8b3f32 !important;
  font-weight:900 !important;
  font-size:.86rem !important;
}
.treatment-zone-message[hidden]{
  display:none !important;
}


/* V140 — kaartsectie desktop iets lager laten starten */
@media(min-width:901px){
  #werkgebied{
    padding-top:112px !important;
    padding-bottom:60px !important;
    scroll-margin-top:108px !important;
  }
}

/* V141 — taalkeuze in de banner/header */
.language-switch{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  flex:0 0 auto!important;
  margin-left:8px!important;
  z-index:30!important;
}
.language-switch a{
  display:grid!important;
  place-items:center!important;
  width:30px!important;
  height:30px!important;
  border-radius:999px!important;
  border:1px solid rgba(126,86,47,.16)!important;
  background:rgba(255,250,243,.72)!important;
  text-decoration:none!important;
  font-size:18px!important;
  line-height:1!important;
  box-shadow:none!important;
  opacity:.72;
  transition:.2s ease;
}
.language-switch a.active,
.language-switch a:hover{
  opacity:1;
  transform:translateY(-1px);
  border-color:rgba(157,112,65,.4)!important;
  background:#fffaf3!important;
}
.booking-language-switch{margin-left:auto!important}
@media(max-width:760px){
  .language-switch{gap:3px!important;margin-left:4px!important}
  .language-switch a{width:25px!important;height:25px!important;font-size:15px!important}
  .site-header .brand{max-width:calc(100% - 170px)!important}
  .booking-page .site-header .brand{max-width:calc(100% - 185px)!important}
}


/* V143 — echte vlagafbeeldingen, duidelijk zichtbaar in de header */
.language-switch{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  flex:0 0 auto !important;
  position:relative !important;
  z-index:120 !important;
  visibility:visible !important;
  opacity:1 !important;
  margin-left:10px !important;
}

.language-switch a{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:36px !important;
  height:28px !important;
  padding:3px !important;
  border-radius:7px !important;
  border:1px solid rgba(101,72,44,.24) !important;
  background:#fffaf3 !important;
  box-shadow:0 3px 10px rgba(69,48,31,.10) !important;
  visibility:visible !important;
  opacity:.82 !important;
  overflow:hidden !important;
}

.language-switch a img{
  display:block !important;
  width:28px !important;
  height:18px !important;
  object-fit:cover !important;
  border-radius:2px !important;
  visibility:visible !important;
  opacity:1 !important;
}

.language-switch a.active{
  opacity:1 !important;
  border-color:#9d7041 !important;
  box-shadow:0 0 0 2px rgba(157,112,65,.18),0 3px 10px rgba(69,48,31,.10) !important;
}

@media(max-width:760px){
  .language-switch{
    gap:4px !important;
    margin-left:4px !important;
  }

  .language-switch a{
    width:31px !important;
    height:25px !important;
    padding:2px !important;
  }

  .language-switch a img{
    width:25px !important;
    height:16px !important;
  }

  .site-header .brand{
    max-width:calc(100% - 176px) !important;
  }

  .booking-page .site-header .brand{
    max-width:calc(100% - 188px) !important;
  }
}


/* V144 — mobiel: vlaggen onder de bannerfoto */
@media (max-width: 760px) {
  .site-header .nav{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:center !important;
    row-gap:8px !important;
  }

  .site-header .brand{
    order:1 !important;
    flex:0 0 100% !important;
    width:100% !important;
    max-width:100% !important;
    display:flex !important;
    justify-content:center !important;
    margin:0 auto !important;
  }

  .site-header .brand-logo{
    display:block !important;
    margin:0 auto !important;
  }

  .site-header .language-switch{
    order:2 !important;
    flex:0 0 100% !important;
    width:100% !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    margin:2px 0 4px !important;
  }

  .site-header .menu-toggle{
    order:3 !important;
  }

  .site-header .nav-links{
    order:4 !important;
  }

  .site-header .header-actions,
  .site-header .booking-back-btn,
  .site-header .admin-trigger{
    order:3 !important;
  }

  .site-header .language-switch a{
    width:34px !important;
    height:27px !important;
  }

  .site-header .language-switch a img{
    width:28px !important;
    height:18px !important;
  }

  .booking-page .site-header .brand{
    max-width:100% !important;
  }
}


/* V145 — mobiel: talen links, boeking/rechterknop rechts, inhoud lager */
.mobile-booking-btn{
  display:none !important;
}

@media(max-width:760px){
  .site-header .nav{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      "brand brand"
      "langs action"
      "menu menu" !important;
    align-items:center !important;
    gap:8px 10px !important;
    padding-top:9px !important;
    padding-bottom:10px !important;
  }

  .site-header .brand{
    grid-area:brand !important;
    width:100% !important;
    max-width:100% !important;
    justify-self:center !important;
    display:flex !important;
    justify-content:center !important;
    margin:0 !important;
  }

  .site-header .language-switch{
    grid-area:langs !important;
    width:auto !important;
    justify-self:start !important;
    justify-content:flex-start !important;
    margin:0 !important;
  }

  .home-page .site-header .mobile-booking-btn{
    grid-area:action !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    justify-self:end !important;
    min-height:38px !important;
    padding:8px 14px !important;
    border-radius:999px !important;
    border:1px solid rgba(126,86,47,.16) !important;
    background:linear-gradient(135deg,#dec092 0%,#b98249 100%) !important;
    color:#2d2118 !important;
    font-size:.76rem !important;
    font-weight:800 !important;
    line-height:1 !important;
    text-decoration:none !important;
    box-shadow:0 8px 20px rgba(126,86,47,.12) !important;
    white-space:nowrap !important;
  }

  .home-page .site-header .nav-links .btn{
    display:none !important;
  }

  .site-header .menu-btn{
    grid-area:menu !important;
    justify-self:end !important;
  }

  .booking-page .site-header .booking-back-btn{
    grid-area:action !important;
    justify-self:end !important;
    margin:0 !important;
  }

  .booking-page .site-header .nav{
    grid-template-areas:
      "brand brand"
      "langs action" !important;
  }

  /* De vaste header is nu hoger: laat de pagina-inhoud duidelijk lager beginnen. */
  .home-page .hero{
    padding-top:185px !important;
  }

  .booking-page .booking-hero{
    padding-top:185px !important;
  }
}


/* V146 — pagina 1 mobiel: inhoud lager starten zoals boekingspagina */
@media(max-width:760px){
  .home-page .site-header .nav-links{
    display:none !important;
  }

  .home-page main .hero.hero-intro{
    padding-top:215px !important;
  }

  .home-page #home{
    scroll-margin-top:190px !important;
  }
}


/* V147 — pagina 1 mobiel: volledige header vrijhouden */
@media(max-width:760px){
  /* De header bestaat mobiel uit de banner + rij met talen en Afspraak.
     De eerste inhoud mag pas onder die volledige vaste header beginnen. */
  .home-page main .hero.hero-intro{
    padding-top:285px !important;
  }

  .home-page #home > .hero-start-grid{
    align-items:start !important;
  }

  .home-page #home{
    scroll-margin-top:255px !important;
  }
}

@media(max-width:420px){
  .home-page main .hero.hero-intro{
    padding-top:275px !important;
  }
}


/* V152 — taalafkortingen zichtbaar naast de vlaggen */
.language-switch a{
  width:auto !important;
  min-width:48px !important;
  padding-left:5px !important;
  padding-right:7px !important;
  gap:4px !important;
}
.language-switch .language-label{
  display:inline-block !important;
  font-size:.68rem !important;
  font-weight:850 !important;
  letter-spacing:.04em !important;
  line-height:1 !important;
  color:#4a3627 !important;
}
@media(max-width:760px){
  .site-header .language-switch a{
    width:auto !important;
    min-width:43px !important;
    padding-left:4px !important;
    padding-right:5px !important;
    gap:3px !important;
  }
  .site-header .language-switch .language-label{
    font-size:.62rem !important;
  }
}


/* V154 — pagina 1 mobiel: titel en tekst strikt onder elkaar */
@media(max-width:760px){
  .home-page #home .hero-copy,
  .home-page #home .hero-brand-message{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    position:relative !important;
    overflow:visible !important;
    height:auto !important;
    min-height:0 !important;
    padding-top:0 !important;
  }

  .home-page #home .hero-brand-message .eyebrow{
    position:static !important;
    display:block !important;
    width:100% !important;
    margin:0 0 10px !important;
  }

  .home-page #home .hero-brand-message h1{
    position:static !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 0 24px !important;
    padding:0 !important;
    font-size:clamp(2.65rem,12vw,3.55rem) !important;
    line-height:1.02 !important;
    overflow:visible !important;
    transform:none !important;
  }

  .home-page #home .hero-brand-message h1 em{
    display:inline !important;
    position:static !important;
    line-height:inherit !important;
  }

  .home-page #home .hero-brand-message .hero-lead{
    position:static !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 0 4px !important;
    padding:0 !important;
    line-height:1.65 !important;
    transform:none !important;
    clear:both !important;
  }

  .home-page #home .hero-actions{
    position:static !important;
    width:100% !important;
    margin-top:28px !important;
    transform:none !important;
  }

  .home-page #home .trust-row{
    position:static !important;
    width:100% !important;
    margin-top:26px !important;
    transform:none !important;
  }
}


/* V158 — mobiel: pagina 1 en boekingspagina dezelfde scroll/header-afstand */
@media(max-width:760px){
  html{
    scroll-padding-top:300px !important;
  }

  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:300px !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:300px !important;
  }

  /* De inhoud mag tijdens scrollen wel onder de vaste header doorgaan,
     maar een sectie-start wordt nooit meer achter de header geplaatst. */
  .home-page .site-header,
  .booking-page .site-header{
    min-height:0 !important;
  }
}

@media(max-width:420px){
  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:290px !important;
  }

  html{
    scroll-padding-top:290px !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:290px !important;
  }
}


/* V159 — mobiel: vaste header volledig afdekkend, geen inhoud zichtbaar onder vlaggen */
@media(max-width:760px){
  .home-page .site-header,
  .booking-page .site-header{
    background:#eadfce !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    border-bottom:1px solid rgba(73,54,40,.12) !important;
    box-shadow:0 8px 18px rgba(73,54,40,.08) !important;
  }

  .home-page .site-header.scrolled,
  .home-page .site-header.solid,
  .booking-page .site-header.scrolled,
  .booking-page .site-header.solid{
    background:#eadfce !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }

  .home-page .site-header .nav,
  .booking-page .site-header .nav{
    padding-bottom:14px !important;
  }

  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:320px !important;
  }

  html{
    scroll-padding-top:320px !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:320px !important;
  }
}

@media(max-width:420px){
  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:310px !important;
  }

  html{
    scroll-padding-top:310px !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:310px !important;
  }
}


/* V160 — definitieve mobiele header: sticky in documentflow, geen overlap */
@media(max-width:760px){
  .home-page .site-header,
  .booking-page .site-header{
    position:sticky !important;
    top:0 !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    inset:auto !important;
    width:100% !important;
    z-index:120 !important;
    background:#eadfce !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    border-bottom:1px solid rgba(73,54,40,.14) !important;
    box-shadow:0 8px 18px rgba(73,54,40,.08) !important;
  }

  .home-page .site-header.scrolled,
  .home-page .site-header.solid,
  .booking-page .site-header.scrolled,
  .booking-page .site-header.solid{
    position:sticky !important;
    top:0 !important;
    background:#eadfce !important;
  }

  .home-page .site-header .nav,
  .booking-page .site-header .nav{
    min-height:0 !important;
    padding-top:12px !important;
    padding-bottom:14px !important;
  }

  /* Omdat de header nu ruimte inneemt in de documentflow,
     is geen kunstmatige 300px compensatie meer nodig. */
  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:34px !important;
  }

  html{
    scroll-padding-top:170px !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:170px !important;
  }
}

@media(max-width:420px){
  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:28px !important;
  }

  html{
    scroll-padding-top:160px !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:160px !important;
  }
}


/* V162 — mobiele header blijft altijd vast staan tijdens scrollen */
:root{
  --mobile-header-height: 250px;
}

@media(max-width:760px){
  .home-page .site-header,
  .booking-page .site-header,
  .home-page .site-header.scrolled,
  .home-page .site-header.solid,
  .booking-page .site-header.scrolled,
  .booking-page .site-header.solid{
    position:fixed !important;
    inset:0 0 auto 0 !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:999 !important;
    background:#eadfce !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    border-bottom:1px solid rgba(73,54,40,.14) !important;
    box-shadow:0 8px 18px rgba(73,54,40,.08) !important;
  }

  .home-page .site-header .nav,
  .booking-page .site-header .nav{
    padding-top:12px !important;
    padding-bottom:14px !important;
  }

  /* De header is fixed; deze gemeten ruimte voorkomt overlap. */
  .home-page main .hero.hero-intro,
  .booking-page .booking-hero{
    padding-top:calc(var(--mobile-header-height) + 24px) !important;
  }

  html{
    scroll-padding-top:calc(var(--mobile-header-height) + 12px) !important;
  }

  .home-page #home,
  .home-page #over,
  .home-page #ervaring,
  .home-page #foto,
  .home-page #behandelingen,
  .home-page #werkgebied,
  .home-page #vragen,
  .home-page #contact{
    scroll-margin-top:calc(var(--mobile-header-height) + 12px) !important;
  }
}


/* V183 — Reviews ook zichtbaar in mobiele header */
.mobile-header-actions{
  display:none;
}
.mobile-reviews-btn{
  display:none;
}
@media(max-width:760px){
  .site-header .nav{
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      "brand brand"
      "langs action"
      "menu menu" !important;
  }

  .home-page .site-header .mobile-header-actions{
    grid-area:action !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:7px !important;
    justify-self:end !important;
    min-width:0 !important;
  }

  .home-page .site-header .mobile-header-actions .mobile-booking-btn,
  .home-page .site-header .mobile-header-actions .mobile-reviews-btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:38px !important;
    padding:8px 11px !important;
    border-radius:999px !important;
    border:1px solid rgba(126,86,47,.16) !important;
    background:linear-gradient(135deg,#dec092 0%,#b98249 100%) !important;
    color:#2d2118 !important;
    font-size:.72rem !important;
    font-weight:850 !important;
    line-height:1 !important;
    text-decoration:none !important;
    box-shadow:0 8px 20px rgba(126,86,47,.12) !important;
    white-space:nowrap !important;
    width:auto !important;
  }

  .home-page .site-header .mobile-header-actions .mobile-reviews-btn{
    background:#f7efe4 !important;
    border-color:rgba(73,54,40,.18) !important;
    box-shadow:none !important;
  }
}

@media(max-width:390px){
  .home-page .site-header .mobile-header-actions{
    gap:5px !important;
  }
  .home-page .site-header .mobile-header-actions .mobile-booking-btn,
  .home-page .site-header .mobile-header-actions .mobile-reviews-btn{
    padding:7px 9px !important;
    font-size:.68rem !important;
  }
}

/* V193 — vier behandelingen naast elkaar op brede schermen */
@media(min-width:1100px){
  #behandelingen .treatment-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}
