
:root{--bg:#f8f5f2;--panel:#fff;--ink:#2f2b27;--muted:#6f6a64;--gold:#c5a572;--radius:16px;--shadow:0 10px 30px rgba(0,0,0,.08);--maxw:1140px}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Inter,Segoe UI,Roboto,Arial,sans-serif;line-height:1.7}
img,video{max-width:100%;display:block;height:auto}
a{text-decoration:none;color:inherit}
.header{position:sticky;top:0;z-index:100;display:flex;gap:18px;align-items:center;justify-content:space-between;padding:10px 16px;background:rgba(255,255,255,.8);backdrop-filter:blur(8px);border-bottom:1px solid #eee}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:40px;width:auto;border-radius:8px;border:1px solid #eee}
.menu{display:flex;gap:8px;list-style:none;margin:0;padding:0;align-items:center}
.menu a{padding:8px 10px;border-radius:10px}
.menu a:hover{background:#f0ece7}
.menu a.active{background:#e9e2d7}
.menu .cta{background:var(--gold);color:#fff;padding:10px 14px;border-radius:12px;font-weight:600}
.lang-switch{display:flex;gap:8px;align-items:center}
.lang-switch select{padding:6px 8px;border:1px solid #ddd;border-radius:8px;background:#fff}
.hero-banner{width:100%;max-height:640px;overflow:hidden}
.hero-banner video{width:100%;height:auto;object-fit:cover}
.section{max-width:var(--maxw);margin:56px auto;padding:0 16px}
.section h2{font-family:Georgia,serif;font-size:clamp(22px,2.4vw,34px);margin:0 0 18px}
.muted{color:var(--muted)}
.about{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center}
.about img{border-radius:22px;border:1px solid #eee;box-shadow:var(--shadow)}
.about .copy p{color:var(--ink);margin:0 0 16px;max-width:68ch;font-size:clamp(16px,1.3vw,20px);line-height:1.8}
@media (max-width:920px){.about{grid-template-columns:1fr}}
.btn{display:inline-block;background:var(--gold);color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;box-shadow:var(--shadow)}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.services{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.service-card{display:grid;grid-template-columns:1fr 1.2fr;gap:16px;background:var(--panel);padding:16px;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid #eee;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.service-card.in{opacity:1;transform:none}
.service-card img{border-radius:12px;border:1px solid #eee}
.service-card h3{margin:0 0 8px;font-size:22px}
.service-card .desc{color:var(--muted);margin:6px 0 10px}
.price-list{list-style:none;margin:0 8px 6px 0;padding:0}
.price-list li{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed #eee}
.price-list li:last-child{border-bottom:none}
.subhead{margin-top:10px;font-weight:700}
@media (max-width:1000px){.services{grid-template-columns:1fr}.service-card{grid-template-columns:1fr}}
.gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.gallery a{display:block;border:1px solid #eee;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);background:#fff;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.gallery a.in{opacity:1;transform:none}
.gallery img{width:100%;height:160px;object-fit:cover}
@media (max-width:1200px){.gallery{grid-template-columns:repeat(4,1fr)}}
@media (max-width:900px){.gallery{grid-template-columns:repeat(2,1fr)} .gallery img{height:180px}}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:9999}
.lightbox.open{display:flex}
.lightbox img{max-width:88vw;max-height:88vh;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.6)}
.lb-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;pointer-events:none}
.lb-btn{background:rgba(255,255,255,.2);border:none;color:#fff;font-size:28px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;cursor:pointer;pointer-events:auto}
.lb-btn:hover{background:rgba(255,255,255,.3)}
.lb-close{position:absolute;top:12px;right:12px;width:56px;height:56px;font-size:28px;line-height:1;border-radius:50%;}
.reviews-wrap{position:relative}
.reviews-track{display:flex;gap:16px;scroll-behavior:smooth;overflow:hidden}
.review{flex:0 0 calc(33.333% - 10.6px);background:var(--panel);border:1px solid #eee;border-radius:16px;box-shadow:var(--shadow);padding:16px}
.stars{color:#e0a72b;font-size:18px;letter-spacing:2px}
.rev-nav{display:flex;gap:10px;justify-content:center;margin-top:10px}
.rev-btn{background:#e9e2d7;border:none;border-radius:10px;padding:8px 12px;cursor:pointer}
.rev-dots{display:flex;gap:6px;justify-content:center;margin-top:6px}
.rev-dot{width:8px;height:8px;border-radius:50%;background:#d4c8b6;opacity:.6}
.rev-dot.active{opacity:1;background:#b8a489}
@media (max-width:1000px){.review{flex:0 0 100%}}
.footer{background:#f3efe9;margin-top:48px;padding:28px 16px 18px;color:#8a8175}
.footer-inner{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:16px}
.footer h4{margin:0 0 8px;color:#5f564b}
.social{display:flex;gap:12px;align-items:center}
.social a{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:999px;transition:transform .2s, box-shadow .2s}
.social a:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.footer small{display:block;margin-top:10px}
.legal{display:flex;gap:12px;justify-content:flex-end;align-items:center}
.map-embed{overflow:hidden;border-radius:16px;border:1px solid #e6dccd;box-shadow:var(--shadow)}
.cookie{position:fixed;left:16px;right:16px;bottom:16px;background:#fff;border:1px solid #e7ded1;border-radius:14px;box-shadow:var(--shadow);padding:12px 14px;display:none;z-index:99999}
.cookie.show{display:block}
.cookie .row{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.cookie button{background:var(--gold);color:#fff;border:none;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer}

/* --- v6.3: global hover animation for ALL buttons/links --- */
:root{ --hover-shadow: 0 6px 18px rgba(0,0,0,.12); --hover-raise: -2px; }
a.btn, .btn, .menu a, .menu .cta, .rev-btn, .lb-btn, .cookie button, .legal a, .actions .btn, .brand, .reviews-track .review, .gallery a, .social a {
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
}
a.btn:hover, .btn:hover, .menu a:hover, .menu .cta:hover, .rev-btn:hover, .lb-btn:hover, .cookie button:hover, .legal a:hover, .actions .btn:hover, .brand:hover, .social a:hover {
  transform: translateY(var(--hover-raise));
  box-shadow: var(--hover-shadow);
}
/* Make gallery tiles lift subtly but without too much shadow (keep elegant) */
.gallery a:hover { box-shadow: 0 10px 24px rgba(0,0,0,.10); }
/* Keyboard focus for accessibility */
a:focus, button:focus, select:focus { outline: 2px solid #c5a57233; outline-offset: 2px; border-radius: 10px; }
/* Keep existing TikTok/IG behavior consistent */


/* v6.7: Over-mij title styling */
.about .copy .intro-title{
  display:block;
  margin:0 0 10px;
  font-weight:600;
  text-align:left;
  font-size:clamp(20px, 2vw, 24px);
  line-height:1.3;
}

/* v6.13: description under treatment photo */
.service-card .under-photo{margin-top:8px}
.service-card .under-photo p{margin:0;color:var(--muted);text-align:left}
@media (max-width:1000px){
  .service-card .under-photo p{margin-top:6px}
}

/* v6.14: swapped price and description */
.service-card .under-photo .price-list{margin-top:8px}
.service-card .desc{margin-top:8px;text-align:left}

/* v6.15: h3 moved above price list under photo */
.service-card .under-photo h3 {
  margin: 0 0 5px;
  text-align: left;
}
.service-card .under-photo .price-list {
  margin-top: 0;
}

/* v6.16 — Clean Treatments Grid */
.tgrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:18px;
}
@media (max-width:980px){
  .tgrid{ grid-template-columns:1fr; }
}
.tcard{
  background:var(--panel);
  border:1px solid #eee;
  border-radius:16px;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.tcard > img{
  width:100%;
  height:640px;
  object-fit:contain;
  display:block;
  background:#fff;
}
.thead{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px 0 14px;
}
.thead h3{
  margin:0;
  font-size:20px;
}
.thead .tprice{
  color:var(--muted);
  font-weight:600;
}
.tprices, .tsub ul{
  list-style:none;
  margin:8px 14px 0 14px;
  padding:0;
  border-top:1px dashed #eee;
}
.tprices li, .tsub ul li{
  display:flex; justify-content:space-between;
  padding:8px 0;
  border-bottom:1px dashed #f1ede7;
}
.tdesc{
  margin:10px 14px 16px 14px;
  color:var(--muted);
}
.tsub{
  margin:10px 14px 0 14px;
}
.tsub strong{
  display:block; margin-bottom:6px; color:#6b5f53;
}

/* v6.17 larger images, balanced spacing */
.tprices, .tsub ul{
  margin-top: 6px;
}
.tdesc{
  margin-top: 10px;
  font-size: 0.95rem;
}
.thead h3{
  font-size: 22px;
}


/* =========================
   RESPONSIVE FIXES (mobile + laptop alignment)
   ========================= */
@media (max-width: 900px) {
  /* Header fix: prevent overflow and keep layout centered */
  .header {
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  .menu {
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
  }
  .menu li {
    margin: 4px 6px;
  }
  .menu .cta {
    white-space: nowrap;
  }
  /* Ensure brand and language switch stay aligned */
  .brand, .lang-switch {
    flex: 0 0 auto;
  }
  .lang-switch select {
    font-size: 14px;
  }
  /* Hero video scales properly */
  .hero-banner video {
    width: 100%;
    height: auto;
    object-fit: cover;
  }
}
@media (min-width: 901px) {
  /* Laptop alignment consistency */
  .header {
    justify-content: space-between;
  }
  .menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}

/* === Shared dropdown menu styles (moved from index inline) === */
.menu { position: relative; }
.menu .has-dropdown { position: relative; }
.menu .has-dropdown > .menu-trigger { cursor: pointer; }
.menu .dropdown{
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  display: none;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.08);
  padding: 8px 10px;
  width: auto;
  min-width: max-content;
  max-width: 95vw;
  z-index: 1001;
  max-height: 70vh;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.menu .has-dropdown.open > .dropdown{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}
.menu .dropdown a{
  display: block;
  width: 100%;
  white-space: nowrap;
  text-decoration: none;
  padding: 12px 16px;
  color: #2f2924;
  border-radius: 10px;
  font-size: 15px;
}
.menu .dropdown a:hover,
.menu .dropdown a:focus{ background:#faf7f4; outline: none; }

@media (max-width: 700px){
  .menu .dropdown{ max-width: 92vw; padding: 10px 12px; }
  .menu .dropdown a{ font-size: 14px; padding: 10px 12px; }
}


/* === Scope the special treatment-page header layout to .has-topbar only === */
.header .brand{ display:flex !important; } /* default visible everywhere */
.has-topbar .header{ flex-wrap: wrap; justify-content: center; align-items: center; }
.has-topbar .header .site-title{
  order:0; width:100%; text-align:center;
  font-family: system-ui, -apple-system, Inter, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 22px; font-weight:600; letter-spacing:3px; color:#2f2924; padding:10px 0 6px 0; background:#fff;
}
.has-topbar .header .menu{ order:1; width:100%; justify-content:center; }
.has-topbar .header .brand{ display:none !important; } /* hide logo only on treatment pages */



/* ==== FINAL treatment pages header fix (match index exactly) ==== */
.has-topbar .header{ 
  flex-wrap: wrap !important; 
  justify-content: center !important; 
  align-items: center !important;
}
.has-topbar .header .site-title{
  order: 0 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  display: block !important;
  text-align: center !important;
  /* exact font from index */
  font-family: system-ui, -apple-system, Inter, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: 3px !important;
  color: #2f2924 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 10px 0 6px 0 !important;
  background: #fff !important;
}
.has-topbar .header .menu{
  order: 1 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  justify-content: center !important;
}
/* Hide brand/logo on these pages to keep title perfectly centered like screenshot */
.has-topbar .header .brand{ display: none !important; }
/* Keep language switch present but not affecting centering */
.has-topbar .lang-switch{ order: 2 !important; }



/* === Apply Georgia serif font to Elité Clinics title on treatment pages === */
.has-topbar .header .site-title{
  font-family: Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  letter-spacing: 3px !important;
  color: #2f2924 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  background: #fff !important;
  padding: 14px 0 10px 0 !important;
  line-height: 1.3 !important;
}


/* === FINAL FONT FIX for Elité Clinics title on treatment pages === */
.has-topbar .header .site-title{
  font-family: Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #2f2924 !important;
  text-align: center !important;
  background: #fff !important;
  padding: 14px 0 10px 0 !important;
  line-height: 1.3 !important;
}



/* === Thinner font weight for Elité Clinics on treatment pages === */
.has-topbar .header .site-title{
  font-family: Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #2f2924 !important;
  text-align: center !important;
  background: #fff !important;
  padding: 14px 0 10px 0 !important;
  line-height: 1.3 !important;
}



/* === Adjusted Georgia serif font for Elité Clinics on treatment pages === */
.has-topbar .header .site-title{
font-family: 'Playfair Display', serif!important;
  font-size: 28px !important;
  font-weight: 400 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #2f2924 !important;
  text-align: center !important;
  background: #fff !important;
  padding: 14px 0 10px 0 !important;
  line-height: 1.3 !important;
}



/* === Ensure clickable Elité Clinics link looks identical to index === */
.has-topbar .site-title a {
  all: unset !important;
  font-family: Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #2f2924 !important;
  text-align: center !important;
  display: block !important;
  cursor: pointer !important;
  line-height: 1.3 !important;
  background: #fff !important;
  padding: 14px 0 10px 0 !important;
}



/* --- Before/After gallery cards for Powder Brows --- */
.ba-gallery{
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.ba-card{
  background:#fff;
  border:1px solid #eee;
  border-radius:16px;
  overflow:hidden;
  box-shadow: var(--shadow);
}
.ba-card img{
  display:block;
  width:100%;
  height:auto;
}
@media (min-width: 900px){
  .ba-gallery{ grid-template-columns: repeat(2, 1fr); }
}
/* =========================
   FONTS – GOOGLE FONTS
   ========================= */

/* basis tekst */
body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: #1f1f1f;
}

/* headings / product titels */
h1,
h2,
h3,
.shop-title {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
}

/* subtitels / kleine tekst */
.shop-sub,
p {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
}

/* =========================
   FORCE SHOP ITEMS GELIJK
   ========================= */

/* grid zelf */
.shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  align-items: stretch;
}


/* product card */
.shop-product {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

.shop-product.is-hidden {
  display: none !important;
}

/* afbeelding container */
.shop-img {
  height: 200px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

/* afbeelding zelf */
.shop-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* titel & sub vaste ruimte */
.shop-title {
  min-height: 52px;
  text-align: center;
}

.shop-sub {
  min-height: 24px;
  text-align: center;
}

/* knop altijd onder */
.shop-btn {
  margin-top: auto !important;
}
.product-title {
  text-align: center;
  margin-bottom: 24px;
}

.product-intro {
  max-width: 700px;
  margin: 0 auto 16px;
  text-align: center;
  line-height: 1.6;
}

.product-section-title {
  margin-top: 40px;
  margin-bottom: 16px;
  text-align: center;
}

.product-list {
  max-width: 520px;
  margin: 0 auto 32px;
  padding-left: 18px;
}

.product-list li {
  margin-bottom: 10px;
  line-height: 1.5;
}

.product-outro {
  max-width: 700px;
  margin: 32px auto 0;
  text-align: center;
  font-weight: 500;
}
/* --- Shop toolbar (search + filters) --- */
.shop-toolbar{
  max-width:1200px;
  margin:18px auto 10px;
  padding:0 20px;
}

.shop-search-inner{
  display:flex;
  align-items:center;
  gap:10px;
  background:#fff;
  border:1px solid #eee;
  border-radius:999px;
  padding:10px 14px;
  box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

#productSearch{
  flex:1;
  border:none;
  outline:none;
  font-size:14px;
  background:transparent;
  color:#2f2b27;
}

#clearSearch{
  border:none;
  background:#faf7f4;
  color:#2f2b27;
  width:34px;
  height:34px;
  border-radius:999px;
  cursor:pointer;
  font-size:20px;
  line-height:1;
  display:none;
}
#clearSearch:hover{ filter:brightness(0.98); }

.shop-toolbar-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:10px;
  flex-wrap:wrap;
}

.shop-filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.filter-btn{
  border:1px solid #eee;
  background:#fff;
  padding:8px 12px;
  border-radius:999px;
  font-size:13px;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,0.03);
}
.filter-btn.is-active{
  border-color:#c5a572;
}

.shop-meta{
  color:#6f6a64;
  font-size:13px;
}

.no-results{
  margin-top:10px;
  color:#6f6a64;
  font-size:13px;
  padding:10px 12px;
  border:1px dashed #e6e0d9;
  border-radius:14px;
  background:rgba(255,255,255,0.6);
}

/* Mobile: toolbar should scroll away (no sticky) */
@media (max-width: 768px){
  .shop-toolbar{
    position:static;
    top:auto;
    z-index:auto;
    background:transparent;
    backdrop-filter:none;
    padding:0 16px;
    margin:18px auto 10px;
    border-bottom:none;
  }
}

/* Make sure filter buttons keep your site colors (Safari sometimes tints) */
.filter-btn{
  color: var(--ink);
  -webkit-appearance: none;
  appearance: none;
}

#productSearch{
  -webkit-appearance: none;
  appearance: none;
}
/* STOP page jumping while filtering/searching (scroll anchoring) */
#webshop,
.shop-toolbar,
.shop-grid {
  overflow-anchor: none;
}

/* =========================
   MOBILE POLISH (global)
   ========================= */

/* Prevent the "gap" above a fixed/sticky header on notched devices (mobile) */
@media (max-width: 700px){
  .header{ padding-top: calc(10px + env(safe-area-inset-top, 0px)); }
}

/* Clamp long tag pills so they don't stretch product cards */
.shop-tag{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* SHOP PAGE – center brand on MOBILE only */
@media (max-width: 768px) {

  body.shop-page .header {
    position: relative;
  }

  body.shop-page .brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  /* optioneel: logo verbergen op mobiel voor rust */
  body.shop-page .brand img {
    display: none;
  }
}
/* CART PAGE – center brand on MOBILE only */
@media (max-width: 768px) {

  body.cart-page .header {
    position: relative;
  }

  body.cart-page .brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  /* optioneel: logo verbergen op mobiel */
  body.cart-page .brand img {
    display: none;
  }

  /* optioneel: kleine finetune titel */
  body.cart-page .brand-name {
    white-space: nowrap;
  }
}
@media (max-width: 640px){

  .header{
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    column-gap: 8px !important;
  }

  /* Logo links */
  .header .brand{
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
  }

  /* Titel exact in het midden */
  .header .site-title{
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    text-align: center !important;

    white-space: nowrap !important;
    font-size: 18px !important;
    letter-spacing: 1px !important;
    line-height: 1.15 !important;
    overflow: visible !important;
  }

  /* Taal rechts */
  .header .lang-switch{
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
  }

  /* Menu op tweede rij */
  .header .menu{
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    justify-content: center !important;
  }
}
/* FIX: titel echt in het midden zetten */
.header .site-title{
  width: auto !important;
  min-width: 0 !important;
  text-align: center !important;
  justify-self: center !important;
}
/* =========================
   HEADER - ONE SOURCE OF TRUTH
   Fix: titel perfect gecentreerd + compacte academy
   ========================= */

/* Basis: vaste header + nette spacing */
.header{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 999;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(6px);
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  transition: transform .3s ease, box-shadow .3s ease;
}

/* Zorg dat content niet onder header valt */
body{
  padding-top: calc(var(--header-h, 84px) + env(safe-area-inset-top, 0px));
}

/* ✅ TITEL ECHT IN HET MIDDEN:
   links en rechts even breed (1fr auto 1fr) */
.header{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  column-gap: 10px !important;
  padding: 8px 14px !important;
  padding-top: calc(8px + env(safe-area-inset-top, 0px)) !important;
}

.header .brand{
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
}

.header .site-title{
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  text-align: center !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

.header .lang-switch{
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
}

/* Menu altijd 2e rij, gecentreerd */
.header .menu{
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  margin: 6px 0 0 0 !important;
  padding: 0 !important;
}
.header .menu li{ list-style: none !important; }
.header .menu a{ display: inline-block !important; }

/* Logo + title sizing (default) */
.header .brand img{
  height: 44px !important; /* compact overal */
  width: auto !important;
}

.header .site-title{
  font-family: "Playfair Display", serif !important;
  font-weight: 400 !important;
  letter-spacing: 3.5px !important;
  text-transform: uppercase !important;
  color: #2f2924 !important;
  font-size: 24px !important;
  line-height: 1.1 !important;
}

/* Link padding iets compacter */
.header .menu a{
  padding: 6px 10px !important;
  font-size: 14px !important;
}

/* Mobiel: nog compacter + titel blijft midden */
@media (max-width: 640px){
  .header{
    padding: 6px 10px !important;
    column-gap: 8px !important;
  }
  .header .brand img{ height: 38px !important; }
  .header .site-title{
    font-size: 18px !important;
    letter-spacing: 2px !important;
  }
  .header .menu a{
    padding: 6px 8px !important;
    font-size: 13px !important;
  }
}

/* ✅ Academy specifiek: header NIET te groot (logo/titel iets kleiner) */
body.page-academy .header .brand img{
  height: 38px !important;
}
body.page-academy .header .site-title{
  font-size: 20px !important;
  letter-spacing: 2.5px !important;
}
@media (max-width: 640px){
  body.page-academy .header .brand img{ height: 34px !important; }
  body.page-academy .header .site-title{ font-size: 17px !important; }
}
/* ✅ Titel Elité Clinics perfect gecentreerd (iPhone + Samsung) */
.header{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  column-gap: 10px !important;
}

/* logo links */
.header .brand{
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
}

/* titel exact midden */
.header .site-title{
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  text-align: center !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* taal rechts */
.header .lang-switch{
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
}

/* menu op 2e rij, gecentreerd */
.header .menu{
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  margin-top: 6px !important;
}

/* iPhone notch safe-area (voorkomt rare offset bovenaan) */
.header{
  padding-top: calc(6px + env(safe-area-inset-top, 0px)) !important;
}
body{
  padding-top: calc(var(--header-h, 80px) + env(safe-area-inset-top, 0px)) !important;
}
@media (max-width: 700px){
  .lang-switch label{ display:none !important; }
}
.laser-note{
    display:block;
    margin-top:12px;
    font-size:14px;
    color:#6f6257;
}

.old-price{
    position: relative;
    display: inline-block;
    color:#c46b6b;
    margin:0 6px;
}

.old-price::after{
    content:"";
    position:absolute;
    left:-1px;
    right:-1px;
    top:50%;
    height:1.2px;
    background:#c46b6b;
    opacity:0.95;
    transform:rotate(-8deg);
    transform-origin:center;
}
.new-price{
    color:#a87f5c;
    font-weight:700;
    margin-right:4px;
}
.laser-offer{
    margin-top:28px;
    padding:22px;
    background:#faf7f4;
    border:1px solid #e7ddd4;
    border-radius:16px;
    text-align:center;
}

.offer-badge{
    display:inline-block;
    background:#a87f5c;
    color:#fff;
    padding:5px 14px;
    border-radius:30px;
    font-size:12px;
    letter-spacing:1px;
    margin-bottom:12px;
}

.offer-title{
    font-size:18px;
    font-weight:600;
    margin-bottom:10px;
}

.offer-price{
    margin:0;
}

.offer-price .old-price{
    color:#b86b6b;
    font-size:22px;
    margin-right:8px;
}

.offer-price .new-price{
    color:#a87f5c;
    font-size:34px;
    font-weight:700;
}

.offer-text{
    margin-top:10px;
    color:#6f6257;
}

.faq-item{
    background:#fff;
    border:1px solid #ebe3dc;
    border-radius:12px;
    margin-bottom:10px;
    overflow:hidden;
    box-shadow:0 2px 10px rgba(0,0,0,.03);
}

.faq-item summary{
    cursor:pointer;
    list-style:none;
    padding:15px 22px;      /* was waarschijnlijk 18-22px */
    font-weight:600;
    font-size:17px;         /* iets kleiner */
    color:#2f2924;
    position:relative;
    transition:.2s ease;
}

.faq-item summary:hover{
    background:#fcfaf8;
}

.faq-item summary::-webkit-details-marker{
    display:none;
}

.faq-item summary::after{
    content:"+";
    position:absolute;
    right:22px;
    top:50%;
    transform:translateY(-50%);
    font-size:22px;         /* was 24px */
    font-weight:300;
    color:#a87f5c;
}

.faq-item[open] summary::after{
    content:"−";
}

.faq-item p{
    padding:0 22px 16px;
    margin:0;
    line-height:1.7;
    color:#6f6257;
    font-size:15px;
}
@media (max-width: 768px){

    .results-gallery{
        grid-template-columns:1fr;
        gap:18px;
    }

    .results-gallery .gallery-item{
        aspect-ratio:4/5;
    }

    .results-gallery .gallery-item img{
        width:100%;
        height:100%;
        object-fit:cover;
    }

}
.old-price{
    position: relative;
    display: inline-block;
    color:#c46b6b;
    margin:0 6px;
    text-decoration:none !important;
    -webkit-text-decoration:none !important;
}
/* =========================================
   LASER ONTHARING PRIJSLIJST
========================================= */

.laser-prices {
    display: grid;
    grid-template-columns: repeat(2, minmax(1fr));
    gap: 24px;
    margin-top: 32px;
}

.laser-price-group {
    overflow: hidden;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(177, 134, 94, 0.18);
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(71, 49, 32, 0.06);
}

.laser-price-group h4 {
    margin: 0;
    padding: 20px 20px 14px;
    color: #a77850;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.laser-price-table {
    width: 100%;
    border-collapse: collapse;
}

.laser-price-table th,
.laser-price-table td {
    padding: 13px 16px;
    border-bottom: 1px solid rgba(83, 63, 47, 0.1);
    text-align: left;
    vertical-align: middle;
}

.laser-price-table th {
    color: #62584f;
    font-size: 13px;
    font-weight: 700;
}

.laser-price-table td {
    color: #2f2b28;
    font-size: 14px;
}

.laser-price-table th:not(:first-child),
.laser-price-table td:not(:first-child) {
    text-align: right;
    white-space: nowrap;
}

.laser-price-table tbody tr:last-child td {
    border-bottom: 0;
}

/* =========================================
   FULL BODY OPENINGSACTIE
========================================= */
/* ===== FULL BODY LUXURY CARD ===== */

.fullbody-promo {
    max-width: 500px;
    margin: 34px auto 42px;
    padding: 28px 34px;
    background: #fcfaf8;
    border: 1px solid rgba(176, 135, 96, 0.16);
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(60, 45, 35, 0.035);
    text-align: center;
}

.fullbody-promo::before,
.fullbody-promo::after {
    display: none;
}

.fullbody-badge {
    display: inline-block;
    margin-bottom: 12px;
    padding: 0;
    background: none;
    color: #a27a58;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.32em;
    text-transform: uppercase;
}

.fullbody-promo h3 {
    margin: 0;
    color: #2f2925;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 28px;
    font-weight: 500;
    line-height: 1.2;
}

.fullbody-subtitle {
    max-width: 340px;
    margin: 8px auto 20px;
    color: #776d64;
    font-size: 13px;
    line-height: 1.6;
}

.fullbody-price {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 14px;
    margin: 20px 0;
}

.fullbody-price::before,
.fullbody-price::after {
    align-self: center;
    width: 42px;
    height: 1px;
    background: rgba(176, 135, 96, 0.28);
    content: "";
}

.fullbody-old-price {
    color: #9d8e81;
    font-size: 18px;
    font-weight: 400;
    text-decoration: line-through;
}

.fullbody-arrow {
    display: none;
}

.fullbody-new-price {
    color: #9d7351;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 42px;
    font-weight: 500;
    line-height: 1;
}

.fullbody-benefits {
    display: block;
    margin: 20px auto;
}

.fullbody-benefit {
    margin: 5px 0;
    color: #61574f;
    font-size: 13px;
    letter-spacing: 0.03em;
    line-height: 1.5;
}

.fullbody-benefit::before {
    display: none;
}

.fullbody-promo-button {
    display: inline-block;
    margin-top: 8px;
    padding-bottom: 3px;
    background: none;
    border: none;
    border-bottom: 1px solid #b08760;
    border-radius: 0;
    box-shadow: none;
    color: #9d7351;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-decoration: none;
    text-transform: uppercase;
    transition:
        color 0.2s ease,
        border-color 0.2s ease;
}

.fullbody-promo-button:hover {
    background: none;
    border-color: #6f523a;
    box-shadow: none;
    color: #6f523a;
    transform: none;
}

@media (max-width: 900px) {
    .laser-prices {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .laser-prices {
        gap: 16px;
        margin-top: 24px;
    }

    .laser-price-group {
        border-radius: 12px;
    }

    .laser-price-group h4 {
        padding: 16px 14px 10px;
        font-size: 13px;
    }

    .laser-price-table th,
    .laser-price-table td {
        padding: 11px 12px;
    }

    .laser-price-table th {
        font-size: 11px;
    }

    .laser-price-table td {
        font-size: 12px;
    }

    .fullbody-promo {
        max-width: 100%;
        margin: 28px auto 34px;
        padding: 26px 20px;
        border-radius: 9px;
    }

    .fullbody-badge {
        margin-bottom: 10px;
        font-size: 9px;
    }

    .fullbody-promo h3 {
        font-size: 25px;
    }

    .fullbody-subtitle {
        max-width: 300px;
        margin-bottom: 18px;
        font-size: 12px;
    }

    .fullbody-price {
        gap: 10px;
        margin: 18px 0;
    }

    .fullbody-price::before,
    .fullbody-price::after {
        width: 28px;
    }

    .fullbody-old-price {
        font-size: 16px;
    }

    .fullbody-new-price {
        font-size: 36px;
    }

    .fullbody-benefits {
        margin: 18px auto;
    }

    .fullbody-benefit {
        font-size: 12px;
    }

    .fullbody-promo-button {
        font-size: 11px;
    }
}

/* =========================================
   FULL BODY IN DE NORMALE PRIJSLIJST
========================================= */

.fullbody-price-group {
    grid-column: 1 / -1;
}

.fullbody-price-group .laser-price-table {
    table-layout: fixed;
}

.fullbody-treatment-name {
    font-weight: 400;
}



.table-old-price {
    margin-right: 6px;
    color: #b56666;
    font-size: 12px;
    text-decoration: line-through;
}

.table-new-price {
    color: #a77850;
    font-weight: 800;
}

/* =========================================
   MEEST GEBOEKTE PAKKETTEN
========================================= */

.most-booked-packages {
    grid-column: 1 / -1;
}

/* =========================================
   MOBIEL
========================================= */

@media (max-width: 850px) {
    .laser-prices {
        grid-template-columns: 1fr;
    }

    .fullbody-price-group,
    .most-booked-packages {
        grid-column: auto;
    }
}

@media (max-width: 650px) {
    .fullbody-promo {
        margin: 28px auto 24px;
        padding: 36px 20px;
        border-radius: 20px;
    }

    .fullbody-promo h3 {
        font-size: 25px;
    }

    .fullbody-price {
        gap: 10px;
    }

    .fullbody-old-price {
        font-size: 21px;
    }

    .fullbody-new-price {
        font-size: 42px;
    }

    .fullbody-benefits {
        grid-template-columns: 1fr;
        max-width: 330px;
    }

  .laser-price-group {
    overflow: hidden;
}

.laser-price-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.laser-price-table th,
.laser-price-table td {
    padding: 10px 5px;
    font-size: 11px;
    white-space: normal;
    word-break: break-word;
}

.laser-price-table th:first-child,
.laser-price-table td:first-child {
    width: 43%;
    text-align: left;
}

.laser-price-table th:nth-child(2),
.laser-price-table td:nth-child(2),
.laser-price-table th:nth-child(3),
.laser-price-table td:nth-child(3),
.laser-price-table th:nth-child(4),
.laser-price-table td:nth-child(4) {
    width: 19%;
    text-align: center;
}
}

/* Uitleg laser + afbeelding */
.laser-info-card {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 34px;
    align-items: center;
    margin: 34px 0;
    padding: 30px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(177, 134, 94, 0.18);
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(71, 49, 32, 0.06);
}

.laser-info-text h3 {
    margin-top: 0;
    margin-bottom: 14px;
}

.laser-info-text p:last-child {
    margin-bottom: 0;
}

.laser-info-image {
    overflow: hidden;
    border-radius: 14px;
}

.laser-info-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 14px;
}

/* Mobiele versie */
@media (max-width: 768px) {
    .laser-info-card {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 20px;
    }

    .laser-info-image img {
        height: auto;
        max-height: 360px;
        object-fit: cover;
    }
}.section h1,
.section h2,
.section h3,
.intro-title,
.section-title,
.thead h3,
.social-follow h3,
.footer h4,
.laser-price-group h4 {
    font-family: "Cormorant Garamond", serif !important;
font-weight: 600;

}
/* ===== Alle gewone prijslijsten dezelfde luxe stijl als rechts ===== */

.tcard .tprices,
.tcard .tsub {
    margin: 24px 14px 0 !important;
    padding: 0 !important;

    background: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid rgba(177, 134, 94, 0.18) !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 32px rgba(71, 49, 32, 0.06) !important;

    overflow: hidden !important;
}

/* Gewone prijslijst */
.tcard .tprices {
    list-style: none !important;
}

/* Titel zoals Special Design */
.tcard .tsub strong {
    display: block !important;
    margin: 0 !important;
    padding: 20px 20px 14px !important;

    font-family: "Cormorant Garamond", serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #a77850 !important;
}

/* Lijst binnen Special Design */
.tcard .tsub ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
}

/* Elke prijsregel */
.tcard .tprices li,
.tcard .tsub ul li {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    margin: 0 !important;
    padding: 13px 16px !important;

    border-bottom: 1px solid rgba(83, 63, 47, 0.1) !important;
    font-size: 14px !important;
    color: #2f2b28 !important;
}

/* Geen rand onder de laatste regel */
.tcard .tprices li:last-child,
.tcard .tsub ul li:last-child {
    border-bottom: 0 !important;
}

/* Mobiel */
@media (max-width: 700px) {
    .tcard .tprices,
    .tcard .tsub {
        margin: 18px 10px 0 !important;
        border-radius: 12px !important;
    }

    .tcard .tsub strong {
        padding: 16px 14px 10px !important;
        font-size: 14px !important;
    }

    .tcard .tprices li,
    .tcard .tsub ul li {
        padding: 11px 12px !important;
        font-size: 13px !important;
    }
}
.laser-preparation {
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #6f625a;
}

.laser-preparation p,
.laser-preparation li {
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: #6f625a;
}

.laser-preparation h4 {
  margin-top: 24px;
  margin-bottom: 10px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  color: #27221f;
}

.laser-preparation ul {
  margin-top: 0;
  margin-bottom: 20px;
  padding-left: 20px;
}

.laser-preparation li {
  margin-bottom: 2px;
}

.laser-warning {
  margin-top: 22px;
}

.laser-warning h4 {
  font-weight: 600;
}

.laser-warning p {
  margin-top: 8px;
}
/* ===== FORCE alle FAQ content dezelfde stijl ===== */

.faq-item p,
.faq-item li,
.faq-item ul,
.faq-item ol,
.faq-item h4,
.faq-item strong{
    font-family: 'Inter', sans-serif !important;
    color:#6f6257 !important;
}

.faq-item p,
.faq-item li{
    font-size:15px !important;
    font-weight:400 !important;
    line-height:1.8 !important;
}

.faq-item h4{
    font-size:15px !important;
    font-weight:600 !important;
    color:#2f2924 !important;
    margin:22px 0 10px !important;
}

.faq-item ul{
    margin:0 0 18px 18px !important;
    padding:0 !important;
}

.faq-item li{
    margin-bottom:6px !important;
}

.faq-item p:last-child{
    margin-bottom:0 !important;
}
.free-consult-card {
  background: #fff;
  border: 1px solid #eadfd3;
  border-radius: 18px;
  padding: 34px 28px;
  margin-top: 24px;
  box-sizing: border-box;
}

.free-consult-label {
  margin: 0 0 18px;
  color: #a97955;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 14px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.free-consult-card h3 {
  margin: 0 0 16px;
  color: #2e2925;
  font-size: 25px;
  font-weight: 500;
  line-height: 1.2;
}

.free-consult-card p {
  margin: 0 0 12px;
  color: #625a54;
  font-size: 15px;
  line-height: 1.7;
}

.free-consult-btn {
  display: inline-block;
  margin-top: 14px;
  padding-bottom: 5px;

  color: #a97955;
  text-decoration: none;
  border-bottom: 1px solid #a97955;

  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: uppercase;

  transition: 0.2s ease;
}

.free-consult-btn:hover {
  color: #805a3f;
  border-color: #805a3f;
}
/* ELITÉ CLINICS titel dunner */
.has-topbar .header .site-title,
.has-topbar .header .site-title a {
  font-weight: 400 !important;
}
/* GRATIS PROEFBEHANDELING - WIT / OPEN DESIGN */

.free-trial-card {
  width: 100%;
  max-width: 500px;
  margin: 34px auto 42px;
  padding: 28px 10px;

  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;

  text-align: center;
}

.free-trial-label {
  display: inline-block;
  margin-bottom: 12px;

  color: #a27a58;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
}

.free-trial-card h3 {
  margin: 0 0 12px;

  font-family: "Playfair Display", Georgia, serif;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  color: #2f2925;
}

.free-trial-text {
  max-width: 390px;
  margin: 8px auto;

  color: #776d64;
  font-size: 13px;
  line-height: 1.7;
}

.free-trial-button {
  display: inline-block;
  margin-top: 18px;
  padding-bottom: 3px;

  background: transparent;
  border: none;
  border-bottom: 1px solid #b08760;
  border-radius: 0;
  box-shadow: none;

  color: #9d7351;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
}

.free-trial-button:hover {
  color: #6f523a;
  border-bottom-color: #6f523a;
  background: transparent;
  box-shadow: none;
  transform: none;
}

@media (max-width: 700px) {
  .free-trial-card {
    padding: 24px 10px;
    margin: 26px auto 32px;
  }

  .free-trial-card h3 {
    font-size: 25px;
  }
}