/* =========================================================
   ZORGWAARD - GEDEELD DESIGN SYSTEEM
   Gebaseerd op de reeds goedgekeurde stijl van de teampagina.
   Wordt door alle pagina's van de site gelinkt (1 bestand =
   1 plek om kleuren/typografie te wijzigen).
   ========================================================= */


:root{
  --lime:#CBE426;
  --lime-dark:#AFC61E;
  --lime-soft:#F5FADD;
  --ink:#231F20;
  --olive:#5C6B1E;
  --sage:#8FB89C;
  --sand:#F7F6F1;
  --white:#FFFFFF;
  --card-bg:#FFFFFF;
  --text:#33302f;
  --muted:#6b7268;
  --border:#e7e4da;
  --radius:16px;
  --shadow:0 4px 18px rgba(35,31,32,.08);
  --shadow-hover:0 10px 28px rgba(35,31,32,.14);
  font-size:16px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter', -apple-system, sans-serif;
  color:var(--text);
  background:var(--sand);
  line-height:1.6;
}
h1,h2,h3,h4{font-family:'Space Grotesk','Inter',sans-serif; font-weight:700; color:var(--ink);}
img{max-width:100%;height:auto;display:block;}
a{color:var(--olive);}
.skip-link{
  position:absolute; left:-999px; top:0; background:#fff; color:var(--ink);
  padding:.75rem 1rem; z-index:100;
}
.skip-link:focus{left:1rem; top:1rem;}

.eyebrow{
  display:inline-block; font-size:13px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink); background:var(--lime); padding:6px 14px; border-radius:100px; margin-bottom:20px;
}
.lead{ font-size:17px; color:var(--muted); max-width:620px; }
.section-head{ text-align:center; max-width:680px; margin:0 auto 48px; }
.section-head .lead{ margin:0 auto; }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-size:16px; font-weight:700; padding:15px 28px; border-radius:10px; border:2px solid transparent;
  cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:transform .15s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease, color .15s ease;
}
.btn svg{width:18px; height:18px; flex-shrink:0;}
.btn-primary{ background:var(--lime); color:var(--ink) !important; box-shadow:0 10px 24px rgba(203,228,38,.45); }
.btn-primary:hover{ background:var(--lime-dark); transform:translateY(-2px); box-shadow:0 14px 28px rgba(175,198,30,.5); }
.btn-ghost{ background:transparent; border-color:rgba(35,31,32,.18); color:var(--ink) !important; }
.btn-ghost:hover{ border-color:var(--ink); background:var(--lime-soft); }
.btn-on-dark{ background:var(--lime); color:var(--ink) !important; }
.btn-on-dark:hover{ background:#e6f56a; transform:translateY(-2px); }
.btn-ghost-on-dark{ background:transparent; border-color:rgba(255,255,255,.4); color:#fff !important; }
.btn-ghost-on-dark:hover{ border-color:var(--lime); background:rgba(255,255,255,.08); }

/* Header */
header.site-header{ background:#fff; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:50; transition:box-shadow .25s ease; }
header.site-header.scrolled{ box-shadow:0 6px 22px rgba(35,31,32,.08); }

/* Leesvoortgangsbalk (onderin de header) */
.scroll-progress{ position:absolute; left:0; right:0; bottom:-1px; height:3px; background:transparent; overflow:hidden; }
.scroll-progress span{ display:block; height:100%; width:0; background:linear-gradient(90deg, var(--lime), var(--lime-dark)); transition:width .1s linear; }

/* Terug-naar-boven knop */
.to-top{
  position:fixed; right:20px; bottom:20px; z-index:998; width:46px; height:46px; border-radius:50%;
  border:none; cursor:pointer; background:var(--ink); color:var(--lime);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px rgba(35,31,32,.28);
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .25s ease, transform .25s ease, visibility .25s ease, background .2s ease;
}
.to-top svg{ width:20px; height:20px; }
.to-top:hover{ background:#000; transform:translateY(-2px); }
.to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
@media (max-width:640px){ .to-top{ bottom:84px; right:14px; } }
.top-bar{ background:var(--ink); color:#fff; font-size:.85rem; }
.top-bar .wrap{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.5rem; padding:.5rem 1.5rem; }
.top-bar a{color:#fff; text-decoration:none;}
.top-bar a:hover{text-decoration:underline;}
.wrap{max-width:1200px; margin:0 auto;}
nav.main-nav{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:1rem 1.5rem; }
.brand{ display:inline-flex; align-items:center; text-decoration:none; }
.brand-logo{ height:56px; width:auto; display:block; }
.footer-logo{ height:26px; width:auto; display:block; }
.logo-icon{display:inline-flex; flex-direction:column; align-items:center;}
.logo-icon .dot{width:10px; height:10px; border-radius:50%; background:var(--lime); margin-bottom:2px;}
.logo-icon .arch{width:28px; height:14px; border:4px solid var(--lime); border-bottom:none; border-radius:28px 28px 0 0;}
.main-nav ul{ list-style:none; display:flex; align-items:center; gap:1.75rem; margin:0; padding:0; flex-wrap:wrap; }
.main-nav a{ text-decoration:none; color:var(--text); font-weight:500; padding:.25rem 0; border-bottom:2px solid transparent; }
.main-nav a:hover, .main-nav a[aria-current="page"]{ color:var(--ink); border-bottom-color:var(--lime); }
/* `.main-nav a` hierboven is specifieker dan een losse klasse, dus de nav-selector
   moet mee, anders erft de knop de smalle linkpadding. */
.cta-btn, .main-nav a.cta-btn{ background:var(--lime); color:var(--ink) !important; padding:.6rem 1.2rem; border-radius:999px; font-weight:700; border-bottom:none !important; }
.cta-btn:hover{background:var(--lime-dark);}

/* Hamburgerknop (alleen zichtbaar op mobiel) */
.nav-toggle{
  display:none; width:44px; height:44px; border:none; background:transparent; cursor:pointer;
  flex-direction:column; justify-content:center; align-items:center; gap:5px; padding:0; margin-left:auto;
}
.nav-toggle span{ display:block; width:24px; height:2.5px; background:var(--ink); border-radius:3px; transition:transform .25s ease, opacity .25s ease; }
.nav-open .nav-toggle span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
.nav-open .nav-toggle span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

/* Dropdown (diensten) */
.has-dropdown{position:relative;}
.dropdown{
  display:none; position:absolute; top:100%; left:0; background:#fff; border:1px solid var(--border);
  border-radius:12px; box-shadow:var(--shadow-hover); padding:.5rem; min-width:260px; z-index:60;
}
.has-dropdown:hover .dropdown, .has-dropdown:focus-within .dropdown{display:block;}
.dropdown a{ display:block; padding:.6rem .8rem; border-radius:8px; border-bottom:none !important; font-size:.92rem; }
.dropdown a:hover{ background:var(--lime-soft); color:var(--ink); }

/* Breadcrumb */
.breadcrumb{ font-size:.85rem; color:var(--muted); padding:1rem 1.5rem 0; max-width:1200px; margin:0 auto; }
.breadcrumb a{color:var(--muted); text-decoration:none;}
.breadcrumb a:hover{text-decoration:underline;}

/* ===== HERO ===== */
.hero-section{ background:linear-gradient(180deg, var(--sand) 0%, #fff 100%); border-bottom:1px solid var(--border); padding:48px 0 64px; }
.hero-grid{ max-width:1200px; margin:0 auto; padding:0 1.5rem; display:grid; grid-template-columns:1.05fr .85fr; gap:56px; align-items:center; }
.hero-grid--top{ align-items:start; }
.hero-grid h1{ font-size:2.6rem; margin:0 0 20px; letter-spacing:-0.01em; line-height:1.15; }

/* Instagram-widget in de hero */
.hero-embed{ background:#fff; border:1px solid var(--border); border-radius:18px; padding:20px; box-shadow:0 30px 60px -20px rgba(35,31,32,.16); }
.hero-embed-title{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:14px; }
.hero-embed-title svg{ width:18px; height:18px; color:var(--olive); flex-shrink:0; }
.hero-embed behold-widget{ display:block; width:100%; }
.hero-grid .lead{ font-size:18px; margin-bottom:28px; max-width:560px; }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:32px; }
.trust-list{ display:grid; grid-template-columns:repeat(2,auto); gap:12px 28px; }
.trust-list li{ display:flex; align-items:center; gap:10px; font-size:14.5px; font-weight:500; color:var(--text); }
.trust-list svg{ width:18px; height:18px; color:var(--olive); flex-shrink:0; }

.hero-visual{ position:relative; background:#fff; border:1px solid var(--border); border-radius:18px; padding:32px; box-shadow:0 30px 60px -20px rgba(35,31,32,.16); }
.hero-visual-icons{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:22px; }
.icon-tile{ aspect-ratio:1; border-radius:14px; background:var(--lime-soft); display:flex; align-items:center; justify-content:center; }
.icon-tile svg{ width:28px; height:28px; color:var(--ink); }
.icon-tile:nth-child(2){ background:var(--lime); }
.hero-visual-card{ border-top:1px solid var(--border); padding-top:20px; }
.hero-visual-card-title{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:12px; }
.quick-contact{ display:flex; flex-direction:column; gap:10px; }
.quick-contact a{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:600; color:var(--ink) !important; padding:10px 12px; border-radius:8px; background:var(--lime-soft); text-decoration:none; }
.quick-contact svg{ width:17px; height:17px; color:var(--olive); }

/* Compact page hero (voor niet-home pagina's) */
.page-hero{ background:linear-gradient(180deg, var(--sand) 0%, #fff 100%); border-bottom:1px solid var(--border); padding:40px 0 48px; }
.page-hero .wrap{ max-width:820px; text-align:left; }
.page-hero h1{ font-size:2.3rem; margin:0 0 14px; line-height:1.15; }

/* ===== GENERIC CARD GRID (team, diensten, subthema's) ===== */
.content-section{ max-width:1200px; margin:0 auto; padding:72px 1.5rem; }
.content-section.tight{ padding-top:48px; }
.cards-grid, .team-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:2rem; }
.cards-grid.cols-4{ grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:1.5rem; }
.info-card, .team-card{
  background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow);
  overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.info-card:hover, .team-card:hover{box-shadow:var(--shadow-hover); transform:translateY(-4px); border-color:rgba(203,228,38,.6);}
.info-card .photo, .team-card .photo{ aspect-ratio:4/3; overflow:hidden; background:var(--lime-soft); }
.info-card .photo img, .team-card .photo img{width:100%; height:100%; object-fit:cover;}
.info-card .content, .team-card .content{padding:1.5rem;}
.info-card h2, .info-card h3, .team-card h2{ font-size:1.25rem; margin:0 0 .5rem; }
.role, .badge{ display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); background:var(--lime); padding:.3rem .7rem; border-radius:999px; margin-bottom:.9rem; }
.info-card p, .team-card p{margin:0 0 .85rem; font-size:.96rem; color:var(--text);}
.info-card .link-more{ font-weight:700; font-size:.92rem; text-decoration:none; display:inline-flex; align-items:center; gap:6px; }
.info-card .link-more svg{width:15px;height:15px;}
details{margin-top:.5rem;}
summary{ cursor:pointer; font-weight:700; color:var(--ink); font-size:.9rem; list-style:none; display:flex; align-items:center; gap:.5rem; }
summary::-webkit-details-marker{display:none;}
summary::before{ content:"+"; font-size:.85rem; font-weight:700; line-height:1; width:20px; height:20px; border-radius:50%; background:var(--lime-soft); color:var(--ink); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
details[open] summary::before{content:"\2013"; background:var(--lime);}
.specialisaties{ margin:.75rem 0 0; padding-left:1.1rem; font-size:.9rem; color:var(--text); }
.specialisaties li{margin-bottom:.3rem;}
.registratie{ margin-top:1rem; padding-top:.75rem; border-top:1px solid var(--border); font-size:.8rem; color:var(--muted); }

/* Simple link-list cards (voor uitgebreide onderwerpenlijsten) */
.topic-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(270px,1fr)); gap:1.25rem; }
.topic-card{
  background:#fff; border:1px solid var(--border); border-radius:14px; padding:1.4rem; box-shadow:var(--shadow);
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease; text-decoration:none; display:block;
}
.topic-card:hover{box-shadow:var(--shadow-hover); transform:translateY(-3px); border-color:rgba(203,228,38,.6);}
.topic-card h3, .topic-card h4{ font-size:1.02rem; margin:0 0 .5rem; color:var(--ink); }
.topic-card p{ font-size:.9rem; color:var(--muted); margin:0 0 .6rem; }
.topic-card .link-more{ font-weight:700; font-size:.86rem; color:var(--olive); }
.topic-category{ margin-bottom:56px; }
.topic-category-head{ margin-bottom:20px; }
.topic-category-head .eyebrow{margin-bottom:8px;}
.topic-category-head h2, .topic-category-head h3{font-size:1.5rem; margin:0 0 6px;}
.topic-category-head p{color:var(--muted); margin:0; max-width:640px;}

/* Artikel / behandelpagina prose */
.content-section.article{ max-width:820px; }
.content-section.article h2{ font-size:1.5rem; margin:2.2rem 0 .6rem; }
.content-section.article h2:first-child{ margin-top:0; }
.content-section.article h3{ font-size:1.15rem; margin:1.6rem 0 .5rem; }
.content-section.article p{ margin:0 0 1.1rem; font-size:1.02rem; }
.content-section.article ul.specialisaties{ padding-left:1.3rem; margin:0 0 1.2rem; }
.content-section.article ul.specialisaties li{ margin-bottom:.5rem; font-size:1.02rem; }

/* Chips (specialisaties overzicht) */
.chip-list{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{ background:var(--lime-soft); color:var(--ink); font-weight:600; font-size:.86rem; padding:.5rem 1rem; border-radius:999px; }

/* ===== USP / WAAROM ===== */
.usp-section{ background:var(--lime-soft); padding:72px 0; }
.usp-grid{ max-width:1200px; margin:0 auto; padding:0 1.5rem; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.usp-item{ text-align:center; padding:8px; }
.usp-icon{ width:58px; height:58px; border-radius:50%; background:#fff; border:2px solid var(--lime); display:flex; align-items:center; justify-content:center; margin:0 auto 16px; }
.usp-icon svg{ width:26px; height:26px; color:var(--ink); }
.usp-item h3, .usp-item h4{ font-size:16.5px; margin-bottom:6px; }
.usp-item p{ font-size:14px; color:var(--text); margin:0; }

/* ===== MISSIE / WAARDEN BLOK ===== */
.values-section{ max-width:1200px; margin:0 auto; padding:72px 1.5rem; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.values-section .quote-box{ background:var(--ink); border-radius:var(--radius); padding:40px; color:#fff; }
.values-section .quote-box p{ font-family:'Space Grotesk',sans-serif; font-size:1.4rem; line-height:1.4; color:#fff; margin:0; }
.values-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.values-list li{ display:flex; gap:14px; align-items:flex-start; font-size:15.5px; }
.values-list svg{ width:22px; height:22px; color:var(--olive); flex-shrink:0; margin-top:2px; }

/* ===== TARIEVEN TABEL ===== */
.price-table{ width:100%; border-collapse:collapse; background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.price-table caption{ text-align:left; font-weight:700; font-family:'Space Grotesk',sans-serif; font-size:1.05rem; padding:16px 20px; background:var(--lime-soft); color:var(--ink); }
.price-table th, .price-table td{ text-align:left; padding:13px 20px; border-bottom:1px solid var(--border); font-size:.95rem; }
.price-table th{ font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); background:var(--sand); }
.price-table td:last-child, .price-table th:last-child{ text-align:right; font-weight:700; color:var(--ink); white-space:nowrap; }
.price-table tbody tr:last-child td{border-bottom:none;}
.price-note{ background:#fff; border:1px solid var(--border); border-left:4px solid var(--lime); border-radius:10px; padding:18px 22px; font-size:.94rem; color:var(--text); margin-bottom:28px; }

/* ===== OPENINGSTIJDEN TABEL ===== */
.hours-table{ width:100%; border-collapse:collapse; background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); max-width:560px; }
.hours-table td{ padding:15px 24px; border-bottom:1px solid var(--border); font-size:1rem; }
.hours-table tr:last-child td{border-bottom:none;}
.hours-table td:first-child{ font-weight:700; color:var(--ink); }
.hours-table td:last-child{ text-align:right; color:var(--text); }
.hours-table tr.closed td:last-child{ color:var(--muted); }
.hours-table tr.today{ background:var(--lime-soft); }

/* ===== LOCATIES ===== */
.location-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(340px,1fr)); gap:2rem; }
.location-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.location-card .map{ aspect-ratio:16/9; }
.location-card .map iframe{ width:100%; height:100%; border:0; display:block; }
.location-card .content{ padding:1.8rem; }
.location-card h3{ font-size:1.25rem; margin:0 0 .4rem; }
.location-card address{ font-style:normal; color:var(--muted); margin-bottom:1rem; }
.location-card .actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* ===== A-Z BANNER (verwijst vanaf dienstenpagina's naar klachten.html) ===== */
.az-banner{
  display:flex; align-items:center; gap:22px; flex-wrap:wrap;
  background:var(--lime-soft); border:1px solid var(--border); border-left:5px solid var(--lime);
  border-radius:var(--radius); padding:24px 28px; margin-bottom:48px; text-decoration:none;
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.az-banner:hover{ box-shadow:var(--shadow-hover); transform:translateY(-2px); border-left-color:var(--lime-dark); }
.az-banner-icon{
  width:52px; height:52px; border-radius:50%; background:#fff; border:2px solid var(--lime);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.az-banner-icon svg{ width:24px; height:24px; color:var(--ink); }
.az-banner-text{ flex:1 1 280px; display:flex; flex-direction:column; gap:4px; }
.az-banner-text strong{ font-family:'Space Grotesk',sans-serif; font-size:1.15rem; color:var(--ink); }
.az-banner-text span{ font-size:.96rem; color:var(--text); }
.az-banner-btn{ flex-shrink:0; }
@media (max-width:640px){
  .az-banner{ padding:20px; gap:16px; }
  .az-banner-btn{ width:100%; }
}

/* ===== KLACHTEN A-Z ===== */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.az-search{ margin-bottom:22px; }
.az-search-field{
  display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--border);
  border-radius:12px; padding:4px 16px; box-shadow:var(--shadow); max-width:620px;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.az-search-field:focus-within{ border-color:var(--lime-dark); box-shadow:0 0 0 4px rgba(203,228,38,.28); }
.az-search-field svg{ width:20px; height:20px; color:var(--muted); flex-shrink:0; }
.az-search-field input{
  border:none; outline:none; background:transparent; font-family:inherit; font-size:1rem;
  padding:14px 0; width:100%; color:var(--text);
}
.az-meta{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin:10px 2px 0; }
.az-count{ font-size:.88rem; color:var(--muted); margin:0; }
.az-switch{
  display:inline-flex; align-items:center; gap:7px; font-size:.88rem; font-weight:700;
  color:var(--olive); text-decoration:none; padding:6px 12px; border-radius:999px;
  background:var(--lime-soft); transition:background .15s ease, transform .15s ease;
}
.az-switch:hover{ background:var(--lime); color:var(--ink); transform:translateY(-1px); }
.az-switch svg{ width:14px; height:14px; }
#per-therapeut{ scroll-margin-top:110px; }

.az-jump{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:28px; }
.az-jump a{
  display:flex; align-items:center; justify-content:center; min-width:34px; height:34px; padding:0 8px;
  background:#fff; border:1px solid var(--border); border-radius:8px; text-decoration:none;
  font-weight:700; font-size:.86rem; color:var(--ink);
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.az-jump a:hover{ background:var(--lime); border-color:var(--lime); transform:translateY(-2px); }

/* Op breed scherm de A-Z in twee kolommen: halveert de paginahoogte
   zonder ook maar één klacht te verbergen (belangrijk voor Google). */
@media (min-width:1000px){
  #az-list{ columns:2; column-gap:32px; }
  #az-list .az-group{ break-inside:avoid; page-break-inside:avoid; }
}
.az-group{ margin-bottom:26px; }
.az-letter{
  font-size:1.5rem; color:var(--ink); margin:0 0 12px; padding-bottom:8px;
  border-bottom:2px solid var(--lime); scroll-margin-top:120px;
}
.az-row{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 18px; justify-content:space-between;
  background:#fff; border:1px solid var(--border); border-radius:12px;
  padding:13px 18px; margin-bottom:8px; scroll-margin-top:120px;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.az-row:hover{ border-color:rgba(203,228,38,.7); box-shadow:var(--shadow); transform:translateX(3px); }
.az-row:target{ border-color:var(--lime-dark); box-shadow:0 0 0 4px rgba(203,228,38,.3); }
.az-row h4{ margin:0; font-size:1.03rem; flex:1 1 260px; }
.ther-list{ display:flex; flex-wrap:wrap; gap:8px; }
.ther-chip{
  display:inline-block; background:var(--lime-soft); color:var(--ink); text-decoration:none;
  font-size:.84rem; font-weight:600; padding:.35rem .8rem; border-radius:999px;
  border:1px solid transparent; transition:background .15s ease, border-color .15s ease;
}
a.ther-chip:hover{ background:var(--lime); border-color:var(--lime-dark); }
.ther-chip em{ font-style:normal; color:var(--muted); font-weight:500; }
.ther-chip--plain{ background:var(--sand); color:var(--muted); }
.az-empty{ background:#fff; border:1px solid var(--border); border-radius:12px; padding:22px; color:var(--muted); }

/* Zoekresultaten (verschijnen bovenaan bij het typen) */
.az-results{ margin-bottom:8px; }
.js-anim .az-results .az-row{ animation:fadeUp .28s ease both; }
.js-anim .az-results .az-row:nth-child(1){ animation-delay:0s; }
.js-anim .az-results .az-row:nth-child(2){ animation-delay:.03s; }
.js-anim .az-results .az-row:nth-child(3){ animation-delay:.06s; }
.js-anim .az-results .az-row:nth-child(4){ animation-delay:.09s; }
.js-anim .az-results .az-row:nth-child(n+5){ animation-delay:.12s; }
.az-row mark{ background:var(--lime); color:var(--ink); padding:0 2px; border-radius:3px; }
@media (prefers-reduced-motion: reduce){
  .az-results .az-row{ animation:none !important; }
}

@media (max-width:640px){
  .az-row{ flex-direction:column; align-items:flex-start; gap:10px; }
  .az-row h4{ flex:none; }
}

/* ===== VIRTUELE RONDLEIDING (Google Street View) ===== */
.tour-embed{
  position:relative; width:100%; aspect-ratio:16/9; overflow:hidden;
  border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); background:var(--lime-soft);
}
.tour-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
/* Tijdelijke placeholder zolang de embedcode nog niet is geplakt */
.tour-placeholder{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; text-align:center; padding:24px; color:var(--muted);
}
.tour-placeholder svg{ width:40px; height:40px; color:var(--olive); }
.tour-placeholder strong{ color:var(--ink); font-family:'Space Grotesk',sans-serif; font-size:1.05rem; }
.tour-placeholder span{ font-size:.9rem; max-width:420px; }
@media (max-width:640px){ .tour-embed{ aspect-ratio:4/3; } }

/* ===== CONTACTFORMULIER ===== */
.contact-layout{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start; }
.contact-info-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow); }
.contact-info-card h3{ margin-top:0; }
/* Alleen de icoonrijtjes zijn flex. Een gewone opsomming in deze kaart valt
   hierbuiten, want in een flexregel wordt elk stukje tekst rond een <strong>
   een eigen kolom. */
.contact-info-card ul:not(.specialisaties){ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.contact-info-card ul:not(.specialisaties) li{ display:flex; gap:12px; align-items:flex-start; font-size:.96rem; }
.contact-info-card ul.specialisaties{ font-size:.96rem; }
.contact-info-card svg{ width:19px; height:19px; color:var(--olive); flex-shrink:0; margin-top:2px; }
.form-note{ font-size:.82rem; color:var(--muted); margin-top:14px; }

/* ===== FINAL CTA ===== */
.final-cta-wrap{ max-width:1200px; margin:0 auto; padding:80px 1.5rem 88px; }
.final-cta{ background:var(--ink); text-align:center; border-radius:20px; padding:64px 24px; position:relative; overflow:hidden; }
.final-cta::before{ content:""; position:absolute; top:-60px; right:-60px; width:220px; height:220px; background:var(--lime); opacity:.15; border-radius:50%; }
.final-cta::after{ content:""; position:absolute; bottom:-70px; left:-50px; width:200px; height:200px; background:var(--sage); opacity:.12; border-radius:50%; }
.final-cta-inner{ max-width:640px; margin:0 auto; position:relative; }
.final-cta img{ height:56px; width:auto; margin:0 auto 24px; display:block; }
.final-cta h2{ color:#fff; font-size:32px; margin-bottom:14px; }
.final-cta p{ color:rgba(255,255,255,.75); font-size:17px; margin-bottom:32px; }
.final-cta-ctas{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }

/* Footer */
footer.site-footer{ background:var(--ink); color:#f1efe4; }
.footer-grid{ max-width:1200px; margin:0 auto; padding:3rem 1.5rem 2rem; display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:2rem; }
.footer-grid h3{color:var(--lime); font-family:'Space Grotesk',sans-serif; font-size:1rem; margin:0 0 .9rem;}
.footer-grid ul{list-style:none; margin:0; padding:0;}
.footer-grid li{margin-bottom:.5rem;}
.footer-grid a{color:#d8d5c9; text-decoration:none; font-size:.92rem;}
.footer-grid a:hover{color:#fff; text-decoration:underline;}
.socials{display:flex; gap:.9rem; margin-top:.5rem;}
.socials a{ width:36px; height:36px; border-radius:50%; background:rgba(203,228,38,.15); display:flex; align-items:center; justify-content:center; }
.socials svg{width:16px; height:16px; fill:var(--lime);}
.copyright{ display:flex; align-items:center; justify-content:center; gap:.6rem; text-align:center; font-size:.82rem; padding:1rem 1.5rem; border-top:1px solid rgba(255,255,255,.12); color:#b3ae9e; }

/* ===== STICKY MOBILE CTA ===== */
.sticky-cta{ display:none; position:fixed; left:0; right:0; bottom:0; z-index:999; background:#fff; border-top:1px solid var(--border); box-shadow:0 -8px 24px rgba(35,31,32,.1); padding:10px 12px; gap:10px; }
.sticky-cta .btn{ flex:1; padding:13px 10px; font-size:14px; }

@media (max-width:1024px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ max-width:460px; margin:0 auto; }
  .usp-grid{ grid-template-columns:repeat(2,1fr); }
  .values-section{ grid-template-columns:1fr; }
  .contact-layout{ grid-template-columns:1fr; }
}
/* Mobiele navigatie: hamburger + uitklapbaar paneel */
@media (max-width:860px){
  .nav-toggle{ display:flex; }
  nav.main-nav{ position:relative; }
  .main-nav ul{
    position:absolute; top:calc(100% + 1px); left:0; right:0; z-index:70;
    flex-direction:column; align-items:stretch; gap:0;
    background:#fff; border-top:1px solid var(--border); box-shadow:0 12px 24px rgba(35,31,32,.1);
    padding:.5rem 1rem 1rem;
    max-height:0; overflow:hidden; opacity:0; visibility:hidden;
    transition:max-height .3s ease, opacity .25s ease, visibility .25s ease, padding .3s ease;
  }
  .nav-open .main-nav ul, nav.main-nav.nav-open ul{
    max-height:80vh; opacity:1; visibility:visible; padding:.5rem 1rem 1.25rem;
  }
  .main-nav ul li{ width:100%; border-bottom:1px solid var(--border); }
  .main-nav ul li:last-child{ border-bottom:none; margin-top:.6rem; }
  .main-nav a{ display:block; padding:.85rem .25rem; border-bottom:none; }
  .main-nav a[aria-current="page"]{ border-bottom:none; color:var(--olive); }
  .main-nav a.cta-btn{ text-align:center; padding:.85rem 1.2rem; }
  /* Dropdown 'Diensten' altijd open tonen in het mobiele paneel */
  .has-dropdown .dropdown{
    display:block; position:static; box-shadow:none; border:none; padding:0 0 .4rem 1rem; min-width:0;
  }
  .has-dropdown .dropdown a{ padding:.55rem .25rem; font-size:.88rem; color:var(--muted); }
}

@media (max-width:640px){
  .hero-grid h1, .page-hero h1{font-size:1.9rem;}
  .hero-ctas .btn{ width:100%; }
  .trust-list{ grid-template-columns:1fr; }
  .usp-grid{ grid-template-columns:1fr 1fr; }
  .final-cta{ padding:44px 20px; border-radius:16px; }
  .final-cta h2{ font-size:26px; }
  .final-cta-ctas .btn{ width:100%; }
  .sticky-cta{ display:flex; }
  body{ padding-bottom:74px; }
}

/* =========================================================
   ANIMATIES
   Scroll-reveal (.reveal, via script.js) + load-in hero
   animaties + subtiele micro-interacties. Draait automatisch
   uit voor mensen die "verminderde beweging" verkiezen.
   ========================================================= */
@keyframes fadeUp{ from{ opacity:0; transform:translateY(26px);} to{ opacity:1; transform:translateY(0);} }
@keyframes fadeIn{ from{ opacity:0;} to{ opacity:1;} }
@keyframes floatY{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-8px);} }
@keyframes pulseRing{ 0%{ box-shadow:0 10px 24px rgba(203,228,38,.45), 0 0 0 0 rgba(203,228,38,.55);} 70%{ box-shadow:0 10px 24px rgba(203,228,38,.45), 0 0 0 14px rgba(203,228,38,0);} 100%{ box-shadow:0 10px 24px rgba(203,228,38,.45), 0 0 0 0 rgba(203,228,38,0);} }
@keyframes drift{ 0%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(10px,-14px) scale(1.06);} 100%{ transform:translate(0,0) scale(1);} }

/* Scroll-reveal utility */
.js-anim .reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); }
.js-anim .reveal.in-view{ opacity:1; transform:translateY(0); }
.js-anim .reveal-group.in-view .reveal-item{ opacity:1; transform:translateY(0); }
.js-anim .reveal-item{ opacity:0; transform:translateY(28px); transition:opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1); }
.js-anim .reveal-group.in-view .reveal-item:nth-child(1){ transition-delay:.05s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(2){ transition-delay:.14s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(3){ transition-delay:.23s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(4){ transition-delay:.32s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(5){ transition-delay:.41s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(6){ transition-delay:.5s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(7){ transition-delay:.59s; }
.js-anim .reveal-group.in-view .reveal-item:nth-child(8){ transition-delay:.68s; }

/* Hero: laadt meteen in, geen scroll-trigger nodig */
.js-anim .hero-grid > div:first-child > .eyebrow{ animation:fadeUp .7s ease both; }
.js-anim .hero-grid > div:first-child > h1{ animation:fadeUp .7s ease .08s both; }
.js-anim .hero-grid > div:first-child > .lead{ animation:fadeUp .7s ease .16s both; }
.js-anim .hero-grid > div:first-child > .hero-ctas{ animation:fadeUp .7s ease .24s both; }
.js-anim .hero-grid > div:first-child > .trust-list{ animation:fadeUp .7s ease .32s both; }
.js-anim .hero-visual, .js-anim .hero-embed{ animation:fadeUp .8s ease .2s both; }

/* Zwevende icoontjes in de hero-kaart */
.hero-visual-icons .icon-tile:nth-child(1){ animation:floatY 4.5s ease-in-out infinite; }
.hero-visual-icons .icon-tile:nth-child(2){ animation:floatY 4.5s ease-in-out .5s infinite; }
.hero-visual-icons .icon-tile:nth-child(3){ animation:floatY 4.5s ease-in-out 1s infinite; }

/* Zachte pulse-ring op de belangrijkste CTA */
.hero-ctas .btn-primary{ animation:pulseRing 2.8s ease-out 1.5s infinite; }
.hero-ctas .btn-primary:hover{ animation:none; }

/* Decoratieve cirkels in de final-cta driften rustig */
.final-cta::before{ animation:drift 9s ease-in-out infinite; }
.final-cta::after{ animation:drift 11s ease-in-out 1.5s infinite; }

/* Kaarten en USP-iconen: iets levendiger bij hover */
.info-card, .team-card, .topic-card{ transition:box-shadow .25s ease, transform .25s ease, border-color .25s ease; }
.usp-icon{ transition:transform .3s ease, background .3s ease; }
.usp-item:hover .usp-icon{ transform:scale(1.1) rotate(-4deg); background:var(--lime-soft); }
.chip{ transition:transform .2s ease, background .2s ease; }
.chip:hover{ transform:translateY(-2px); background:var(--lime); }

/* Sticky mobiele CTA schuift in bij laden */
.js-anim .sticky-cta{ animation:fadeUp .5s ease both; }

@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-item, .hero-grid *, .hero-visual, .hero-embed, .icon-tile, .btn-primary,
  .final-cta::before, .final-cta::after, .sticky-cta, .az-row{
    animation:none !important; transition:none !important; opacity:1 !important; transform:none !important;
  }
}

/* ===== Therapeutpagina's ===== */
.therapist-intro{
  display:grid; grid-template-columns:300px 1fr; gap:36px;
  align-items:start; margin-bottom:14px;
}
.therapist-photo{
  width:100%; height:auto; border-radius:18px; display:block;
  object-fit:cover; aspect-ratio:4/3;
  box-shadow:0 10px 30px rgba(35,31,32,.10);
}
.therapist-intro h2{ margin-top:0; }
@media (max-width:760px){
  .therapist-intro{ grid-template-columns:1fr; gap:22px; }
  .therapist-photo{ max-width:260px; }
}

/* Doorklik naar de eigen pagina vanaf de teamkaart */
.team-more{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:14px; font-weight:600; text-decoration:none;
  color:var(--olive); border-bottom:2px solid var(--lime);
  padding-bottom:2px; transition:gap .2s ease;
}
.team-more:hover{ gap:13px; }

/* ===== Locatiepagina's ===== */
.loc-facts{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:18px; margin:26px 0 8px;
}
.loc-fact{
  background:var(--lime-soft); border-radius:16px; padding:20px 22px;
  border-left:5px solid var(--lime);
}
.loc-fact strong{ display:block; font-family:'Space Grotesk',sans-serif; margin-bottom:5px; }
.loc-map-full{
  border-radius:18px; overflow:hidden; aspect-ratio:16/8; margin-top:8px;
  box-shadow:0 10px 30px rgba(35,31,32,.10);
}
.loc-map-full iframe{ width:100%; height:100%; border:0; display:block; }
@media (max-width:640px){ .loc-map-full{ aspect-ratio:4/3; } }

/* ===== Reviews ===== */
.reviews-section{ background:var(--sand); }
.reviews-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:22px; margin-top:30px;
}
.review-card{
  background:#fff; border-radius:18px; padding:26px 26px 22px;
  box-shadow:0 8px 26px rgba(35,31,32,.07);
  display:flex; flex-direction:column; gap:13px;
}
.review-stars{ display:flex; gap:3px; color:var(--lime-dark); }
.review-stars svg{ width:17px; height:17px; }
.review-card p{ margin:0; font-size:16px; line-height:1.62; color:var(--ink); }
.review-card cite{
  font-style:normal; font-weight:600; font-size:14.5px; color:var(--olive);
  margin-top:auto; padding-top:4px;
}
.reviews-cta{
  margin-top:30px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  justify-content:center; font-size:15px;
}
/* losse quote op behandel- en therapeutpagina's */
.review-quote{
  background:var(--lime-soft); border-left:5px solid var(--lime);
  border-radius:0 16px 16px 0; padding:22px 26px; margin:30px 0 8px;
}
.review-quote .review-stars{ margin-bottom:9px; }
.review-quote p{ margin:0 0 9px; font-size:16.5px; line-height:1.6; font-style:italic; }
.review-quote cite{ font-style:normal; font-weight:600; font-size:14.5px; color:var(--olive); }

/* ===== Huishoudelijk reglement: inhoudsopgave ===== */
.reglement-index{
  list-style:none; padding:0; margin:12px 0 0;
  columns:2; column-gap:30px;
}
.reglement-index li{ break-inside:avoid; margin:0 0 7px; }
.reglement-index a{
  font-weight:600; font-size:15px; text-decoration:none; color:var(--olive);
  border-bottom:1px solid transparent;
}
.reglement-index a:hover{ border-bottom-color:var(--lime); }
@media (max-width:700px){ .reglement-index{ columns:1; } }

/* ===== Juridische voettekst ===== */
.footer-legal{
  display:inline-block; margin-top:7px;
  font-size:12.5px; opacity:.62; line-height:1.6;
}
.footer-legal a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.28); }
.footer-legal a:hover{ border-bottom-color:var(--lime); }

/* Het hidden-attribuut van de browser (display:none) verliest van elke
   display-regel in dit bestand, zoals .az-row{display:flex}. Daarom hier
   expliciet: alles met [hidden] is echt weg. */
.az-row[hidden], .az-group[hidden], #az-list[hidden],
.az-results[hidden], .az-jump[hidden], .az-empty[hidden],
.team-card[hidden], .info-card[hidden]{ display:none !important; }