/* Theme Name: OranjeKlinieken XD
Theme URI: https://oranjeklinieken.nl/
Author: OranjeKlinieken
Description: Maatwerk WordPress-thema op basis van het aangeleverde Adobe XD-bestand. Inclusief WPBakery-ondersteuning en native custom post types.
Version: 1.6.1
Text Domain: oranjeklinieken
Requires at least: 6.2
Requires PHP: 7.4 */

:root {
  --ok-orange: #f6a623;
  --ok-orange-dark: #e39012;
  --ok-taupe: #a69c93;
  --ok-taupe-dark: #756f6a;
  --ok-brown: #514c48;
  --ok-beige: #e9e1d8;
  --ok-offwhite: #f7f5f2;
  --ok-white: #fff;
  --ok-text: #6e6863;
  --ok-line: rgba(103, 96, 90, .18);
  --ok-container: 1380px;
  --ok-content: 1240px;
  --ok-header-height: 112px;
  --ok-shadow: 0 18px 45px rgba(68, 61, 55, .12);
}

* {
  box-sizing: border-box;
}

html,
body {
  overflow-x: clip;
}

.wpb_content_element a{
	text-decoration: underline;
	color: #FFB03A;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ok-text);
  background: var(--ok-offwhite);
  font-family: Montserrat, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

body.ok-menu-open {
  overflow: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

a:hover {
  color: var(--ok-orange-dark);
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

p {
  margin: 0 0 1.25em;
}

ul,
ol {
  margin-top: 0;
}

address {
  font-style: normal;
}

header.ok-treatment-hero{
	margin-bottom: 0;
}

.wpb_single_image .vc_single_image-wrapper.vc_box_rounded, .wpb_single_image .vc_single_image-wrapper.vc_box_rounded img{
	border-radius: 33px !important;
}

@media (max-width: 767px) {
	
	.center-on-mobile.wpb_text_column, .center-on-mobile.wpb_text_column p, .center-on-mobile.wpb_text_column h3, .center-on-mobile.wpb_text_column h2, .center-on-mobile.wpb_text_column h4{
		text-align: center !important;
	}
	
  .reverse-columns-mobile > .wpb_column:first-child {
    order: 2;
    margin-top: 30px;
  }

  .reverse-columns-mobile > .wpb_column:last-child {
    order: 1;
  }
}

/* De daadwerkelijke klikbare tab */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab > .vc_tta-panel-title > h4 a {

    font-family: Montserrat, Arial, sans-serif !important;

}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 .45em;
  color: var(--ok-taupe-dark);
  font-family: "Playfair Display", Georgia, serif !important;
  font-weight: 400;
  line-height: 1.12 !important;
}

h1 {
  font-size: clamp(46px, 4vw, 76px);
}

h2 {
  font-size: clamp(38px, 3.15vw, 58px);
}

h3 {
  font-size: clamp(27px, 2vw, 38px);
}

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.screen-reader-text:focus {
  position: fixed !important;
  z-index: 99999;
  top: 12px;
  left: 12px;
  width: auto;
  height: auto;
  padding: 12px 18px;
  clip: auto;
  background: #fff;
}

.white-content, .white-content h1, .white-content h2, .white-content h3, .white-content h4, .white-content h5, .white-content h6,
.white-content .vc_tta-panel-body{
	color: #fff !important;
}

body .vc_btn3-container a{
	font-weight: bold;
	border-radius: 12px !important;
}

body .vc_do_toggle{
	margin-bottom: 30px;
	padding-bottom: 10px;
	border-bottom: 1px solid #fff;
}

	body .vc_toggle_title{
		text-transform: uppercase;
	}

.ok-container {
  width: 100%;
  padding: 0 30px;
  margin-inline: auto;
}

.ok-content-width {
  width: min(calc(100% - 80px), var(--ok-content));
  margin-inline: auto;
}

.ok-section {
  position: relative;
  padding: 110px 0;
}

.ok-richtext > :last-child,
.ok-entry-content > :last-child {
  margin-bottom: 0;
}

.ok-entry-content {
  padding-top: 90px;
  padding-bottom: 0;
}

.ok-two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 90px;
  align-items: center;
}

.ok-eyebrow {
  display: block;
  margin-bottom: 12px;
  color: inherit;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .05em;
  line-height: 1.35;
  text-transform: uppercase;
}

.ok-section-heading {
  max-width: 850px;
  margin: 0 auto 64px;
  text-align: center;
}

.ok-section-heading--left {
  max-width: 760px;
  margin-left: 0;
  text-align: left;
}

.ok-section-heading p {
  margin-top: 22px;
}

.ok-button {
  display: inline-flex;
  margin: 5px;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: 13px 28px;
  border: 1px solid var(--ok-orange);
  border-radius: 10px;
  color: #fff;
  background: var(--ok-orange);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  transition: .2s ease;
}

.ok-button:hover {
  color: #fff;
  border-color: var(--ok-orange-dark);
  background: var(--ok-orange-dark);
  transform: translateY(-2px);
}

.ok-button--outline {
  color: var(--ok-taupe-dark);
  border-color: var(--ok-taupe);
  background: transparent;
}

.ok-button--outline:hover {
  color: #fff;
  border-color: var(--ok-taupe-dark);
  background: var(--ok-taupe-dark);
}

.ok-button--outline-light {
  color: #fff;
  border-color: rgba(255,255,255,.85);
  background: transparent;
}

.ok-button--outline-light:hover {
  color: var(--ok-taupe-dark);
  border-color: #fff;
  background: #fff;
}

.ok-button--light {
  color: var(--ok-taupe-dark);
  border-color: #fff;
  background: #fff;
}

.ok-button--small {
  min-height: 46px;
  padding: 10px 22px;
  font-size: 14px;
}

/* Header */

.ok-site-header {
  position: relative;
  z-index: 1000;
  height: var(--ok-header-height);
  border-top: 2px solid var(--ok-brown);
  background: #fff;
}

.ok-header-inner {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) auto;
  gap: 34px;
  align-items: center;
  height: 100%;
}

.ok-brand {
  min-width: 0;
}

.ok-logo,
.custom-logo-link {
  display: block;
  width: 170px;
}

.ok-logo img,
.custom-logo-link img {
  width: 100%;
  max-height: 82px;
  object-fit: contain;
}

.ok-primary-nav {
  justify-self: start;
  width: 100%;
  min-width: 0;
}

.ok-menu,
.ok-primary-nav ul {
  display: flex;
  gap: 30px;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ok-primary-nav li {
  position: relative;
}

.ok-primary-nav a {
  display: inline-flex;
  align-items: center;
  padding: 42px 0;
  color: #8d8781;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.ok-primary-nav .menu-item-has-children > a::after {
  content: "+";
  margin-left: 7px;
  font-size: 16px;
}

/* Actieve navigatie: huidige pagina én bovenliggende secties blijven zichtbaar actief. */
.ok-primary-nav .current-menu-item > a,
.ok-primary-nav .current-menu-parent > a,
.ok-primary-nav .current-menu-ancestor > a,
.ok-primary-nav .ok-current-section > a {
  color: var(--ok-brown);
  font-weight: 600;
}

.ok-primary-nav .sub-menu {
  position: absolute;
  top: calc(100% - 10px);
  left: -24px;
  display: block;
  min-width: 260px;
  padding: 16px 22px;
  border: 1px solid var(--ok-line);
  background: #fff;
  box-shadow: var(--ok-shadow);
  opacity: 0;
  visibility: hidden;
  transform: translateY(7px);
  transition: .2s ease;
}

.ok-primary-nav li:hover > .sub-menu,
.ok-primary-nav li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.ok-primary-nav .sub-menu a {
  display: block;
  padding: 10px 0;
  line-height: 1.35;
}

.ok-header-actions {
  display: flex;
  gap: 14px;
  align-items: center;
}

/* Compacte zoektrigger in de header. Het daadwerkelijke zoekveld staat in een modal,
   zodat navigatie, telefoonnummer en afspraakknop hun ruimte houden. */
.ok-search-toggle {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  padding: 0;
  border: 1px solid var(--ok-line);
  border-radius: 50%;
  color: var(--ok-brown);
  background: #fff;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.ok-search-toggle:hover,
.ok-search-toggle:focus-visible,
.ok-search-toggle[aria-expanded="true"] {
  border-color: rgba(246,166,35,.55);
  color: var(--ok-orange-dark);
  background: var(--ok-offwhite);
}

.ok-search-toggle:active {
  transform: scale(.96);
}

.ok-search-toggle svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

body.ok-search-open {
  overflow: hidden;
}

.ok-search-modal[hidden] {
  display: none !important;
}

.ok-search-modal {
  position: fixed;
  z-index: 100000;
  inset: 0;
  display: grid;
  place-items: start center;
  padding: clamp(90px, 14vh, 150px) 24px 40px;
}

.ok-search-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(65,59,54,.48);
  backdrop-filter: blur(5px);
}

.ok-search-dialog {
  position: relative;
  z-index: 1;
  width: min(760px, 100%);
  padding: clamp(34px, 5vw, 58px);
  border-radius: 28px;
  background: var(--ok-offwhite);
  box-shadow: 0 30px 90px rgba(47,42,37,.22);
}

.ok-search-dialog .ok-eyebrow {
  margin-bottom: 8px;
}

.ok-search-dialog h2 {
  max-width: 620px;
  margin-bottom: 28px;
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.05;
}

.ok-search-close {
  position: absolute;
  top: 18px;
  right: 20px;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: var(--ok-brown);
  background: rgba(255,255,255,.72);
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
}

.ok-search-modal-form .asl_w,
.ok-search-modal-form div.asl_w {
  width: 100% !important;
  margin: 0 !important;
}

.ok-search-modal-form div.asl_w .probox {
  min-height: 62px !important;
  height: 62px !important;
  border: 1px solid var(--ok-line) !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.ok-search-modal-form div.asl_w .probox .proinput {
  margin-left: 20px !important;
}

.ok-search-modal-form div.asl_w .probox .proinput input {
  height: 60px !important;
  color: var(--ok-text) !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

.ok-search-modal-form div.asl_w .probox .promagnifier {
  width: 58px !important;
  height: 58px !important;
  border-radius: 50% !important;
}

.ok-search-modal-form div.asl_w .probox .prosettings {
  display: none !important;
}

.ok-search-modal-form .search-form {
  display: flex;
  width: 100%;
  margin: 0;
}

.ok-search-modal-form .search-field {
  width: 100%;
  height: 62px;
  padding: 12px 24px;
  border: 1px solid var(--ok-line);
  border-radius: 999px;
  background: #fff;
}

.ok-search-modal-form .search-submit {
  margin-left: 10px;
}

/* Houd Ajax Search Lite-resultaten boven de modal/backdrop. */
div.asl_r,
div.asl_s.searchsettings {
  z-index: 100010 !important;
}

.ok-header-phone {
  color: #8d8781;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

.ok-header-button {
  min-height: 54px;
  padding-inline: 27px;
}

.ok-menu-toggle {
  display: none;
  width: 45px;
  height: 45px;
  padding: 8px;
  border: 0;
  background: transparent;
}

.ok-menu-toggle span {
  display: block;
  width: 26px;
  height: 2px;
  margin: 5px auto;
  background: var(--ok-brown);
}

.ok-mobile-panel {
  display: none !important;
}

/* Home hero */

.ok-treatment-hero {
  position: relative;
  min-height: 700px;
  overflow: hidden;
  color: #fff;
  background: #b4a79d url("assets/xd/hero-texture.jpg") center/cover no-repeat;
}

.ok-treatment-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(87,80,75,.08), rgba(87,80,75,.22));
  pointer-events: none;
}

.ok-treatment-hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 50% 50%;
  align-items: center;
  min-height: 700px;
}

.ok-treatment-hero-copy {
  grid-column: 2;
  max-width: 730px;
  padding: 70px 0 70px 50px;
}

.ok-treatment-hero-copy h1 {
  color: #fff;
}

.ok-treatment-hero-model {
  position: absolute;
  z-index: 1;
  left: max(20px, calc((100vw - var(--ok-container)) / 2));
  bottom: 0;
  width: min(50vw, 900px);
  height: 100%;
}

.ok-treatment-hero-model img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left bottom;
}

.ok-rating {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 24px 0 15px;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
}

.ok-stars {
  color: var(--ok-orange);
  font-size: 24px;
  letter-spacing: 3px;
  line-height: 1;
}

.ok-stats {
  color: #fff;
  background: var(--ok-taupe);
}

.ok-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: 125px;
  align-items: center;
}

.ok-stat {
  padding: 16px 25px;
  text-align: center;
}

.ok-stat strong,
.ok-stat span {
  display: block;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 30px;
}

.ok-stat span {
  text-transform: uppercase;
}

/* Homepage */

.ok-two-col--intro {
  grid-template-columns: .82fr 1.18fr;
}

.ok-treatment-category-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 34px;
}

.ok-treatment-category-card {
  text-align: center;
}

.ok-treatment-category-image {
  height: 350px;
  margin-bottom: 26px;
  background: rgba(255,255,255,.18);
  overflow: hidden;
}

.ok-treatment-category-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

.ok-treatment-category-card h3 {
  font-size: 38px;
}

.ok-treatment-category-card p {
  min-height: 95px;
}

.ok-review-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1px;
  max-width: 1000px;
  margin: 55px auto 40px;
  background: var(--ok-line);
}

.ok-review-facts > div {
  padding: 35px 20px;
  background: #fff;
}

.ok-review-facts strong {
  display: block;
  color: var(--ok-taupe-dark);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 42px;
  font-weight: 400;
}

.ok-review-facts span {
  display: block;
  margin-top: 8px;
  text-transform: uppercase;
  font-size: 13px;
}

.ok-contact-column h2 {
  font-size: 48px;
}

.ok-accordion {
  border-top: 1px solid var(--ok-line);
}

.ok-accordion-item {
  border-bottom: 1px solid var(--ok-line);
}

.ok-accordion-item > button {
  position: relative;
  width: 100%;
  padding: 20px 45px 20px 0;
  border: 0;
  color: var(--ok-text);
  background: transparent;
  text-align: left;
  text-transform: uppercase;
}

.ok-accordion-item > button::after {
  content: "+";
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
}

.ok-accordion-item.is-open > button::after {
  content: "−";
}

.ok-accordion-panel {
  display: none;
  padding: 0 45px 20px 0;
}

.ok-accordion-item.is-open .ok-accordion-panel {
  display: block;
}

/* Common page heroes */

.ok-page-hero,
.ok-archive-hero {
  padding: 105px 0 95px;
  color: #fff;
  background: var(--ok-taupe-dark) url("assets/xd/hero-texture.jpg") center/cover no-repeat;
}

.ok-page-hero::before,
.ok-archive-hero::before {
  content: "";
  position: absolute;
  inset: 0;
}

.ok-page-hero,
.ok-archive-hero {
  position: relative;
}

.ok-page-hero .ok-container,
.ok-archive-hero .ok-container {
  position: relative;
  z-index: 1;
}

.ok-page-hero h1,
.ok-archive-hero h1 {
  max-width: 1000px;
  color: #fff;
}

.ok-page-hero p,
.ok-archive-hero p {
  max-width: 760px;
}

.ok-breadcrumbs {
  margin-bottom: 32px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ok-breadcrumbs span {
  margin: 0 8px;
  opacity: .65;
}

/* Treatment pages */

.ok-treatment-hero-copy > p {
  max-width: 710px;
}

.ok-treatment-content-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 90px;
  align-items: center;
}

.ok-treatment-photo {
  min-height: 650px;
  overflow: hidden;
}

.ok-treatment-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.ok-process-list {
  max-width: 950px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.ok-process-list li {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 28px;
  padding: 28px 0;
  border-bottom: 1px solid var(--ok-line);
}

.ok-process-list li > span {
  display: flex;
  width: 56px;
  height: 56px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  background: var(--ok-orange);
  font-weight: 700;
}

.ok-process-list h3 {
  margin-bottom: 7px;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 21px;
  font-weight: 600;
}

.ok-treatment-rates {
  background: #fff;
}

.ok-rates-grid,
.ok-rates-group {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 80px;
  align-items: start;
}

.ok-rates-group {
  padding: 58px 0;
  border-bottom: 1px solid var(--ok-line);
}

.ok-rate-list {
  border-top: 1px solid var(--ok-line);
}

.ok-rate-list > div {
  display: flex;
  gap: 25px;
  justify-content: space-between;
  padding: 20px 0;
  border-bottom: 1px solid var(--ok-line);
}

.ok-rate-list strong {
  color: var(--ok-taupe-dark);
  white-space: nowrap;
}

.ok-treatment-extra {
  color: #fff;
  background: var(--ok-taupe-dark);
}

.ok-treatment-extra h2 {
  color: #fff;
}

.ok-treatment-extra-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 90px;
}

.ok-treatment-doctor {
  background: #fff;
}

.ok-consult-cta {
  padding: 100px 0;
  color: #fff;
  text-align: center;
  background: var(--ok-taupe-dark);
}

.ok-consult-cta h2 {
  color: #fff;
}

.ok-consult-cta p {
  max-width: 780px;
  margin: 0 auto 30px;
}

.ok-faq-section {
  background: #f4f1ed;
}

.ok-faq-section h2 {
  margin-bottom: 48px;
  text-align: center;
}

/* Cards and archives */

.ok-archive-group + .ok-archive-group {
  margin-top: 100px;
}

.ok-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 34px;
}

.ok-treatment-card {
  background: #fff;
  box-shadow: 0 12px 36px rgba(75,68,62,.08);
}

.ok-treatment-card-image {
  display: block;
  height: 390px;
  overflow: hidden;
  background: #eae3dc;
}

.ok-treatment-card-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

.ok-treatment-card-copy {
  padding: 30px;
}

.ok-treatment-card-copy h2 {
  font-size: 34px;
}

.ok-team-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 35px;
}

.ok-team-card {
  background: #fff;
}

.ok-team-card img {
  width: 100%;
  height: 520px;
  object-fit: contain;
  object-position: center bottom;
  background: #ece5df;
}

.ok-team-card div {
  padding: 28px;
}

.ok-team-card h2 {
  font-size: 34px;
}


/* Team profile */

.ok-team-hero {
  position: relative;
  min-height: 720px;
  overflow: hidden;
  color: #fff;
  background: var(--ok-taupe-dark) url("assets/xd/hero-texture.jpg") center/cover;
}

.ok-team-hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 55% 45%;
  align-items: center;
  min-height: 720px;
}

.ok-team-hero-copy {
  grid-column: 1;
  max-width: 780px;
}

.ok-team-hero-copy h1 {
  color: #fff;
}

.ok-team-role {
  font-size: 15px;
  letter-spacing: .06em;
}

.ok-team-hero-photo {
  position: absolute;
  z-index: 1;
  right: max(20px,calc((100vw - var(--ok-container))/2));
  bottom: 0;
  width: min(43vw,760px);
  height: 95%;
}

.ok-team-hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right bottom;
}

.ok-team-about-grid {
  display: grid;
  grid-template-columns: .75fr 1.25fr;
  gap: 90px;
}

.ok-team-stats {
  color: #fff;
  background: var(--ok-taupe);
}

.ok-team-stats .ok-container {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  min-height: 150px;
  align-items: center;
  text-align: center;
}

.ok-team-stats strong,
.ok-team-stats span {
  display: block;
}

.ok-team-stats strong {
  font-family: "Playfair Display",Georgia,serif;
  font-size: 40px;
  font-weight: 400;
}

.ok-team-stats span {
  text-transform: uppercase;
}

.ok-team-specialisms {
  background: #f4f1ed;
}

.ok-team-quote {
  padding: 110px 0;
  color: #fff;
  text-align: center;
  background: var(--ok-taupe-dark);
}

.ok-team-quote blockquote {
  max-width: 1050px;
  margin: 0 auto 25px;
  font-family: "Playfair Display",Georgia,serif;
  font-size: clamp(28px,2.5vw,45px);
  line-height: 1.4;
}

.ok-team-quote cite {
  font-style: normal;
  text-transform: uppercase;
}

/* Footer */

.ok-site-footer {
  padding: 80px 0 25px;
  color: rgba(255,255,255,.88);
  background: var(--ok-brown);
}

.ok-footer-grid {
  display: grid;
  grid-template-columns: 1.3fr repeat(3,1fr);
  gap: 65px;
}

.ok-site-footer h2 {
  color: #fff;
  font-family: Montserrat,Arial,sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
}

.ok-site-footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ok-site-footer li {
  margin-bottom: 8px;
}

.ok-footer-brand .ok-logo {
  width: 190px;
  padding: 10px;
  background: #fff;
}

.ok-footer-brand p {
  max-width: 360px;
  margin-top: 25px;
}

.ok-footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 25px;
  margin-top: 65px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.16);
  font-size: 13px;
}

.ok-footer-bottom div {
  display: flex;
  gap: 20px;
}

/* Imported Flatsome content and small utilities */

.ok-narrow {
  width: min(calc(100% - 40px), 760px);
  margin-inline: auto;
  padding: 90px 0;
}

.ok-text-center {
  text-align: center;
}

.ok-section--compact {
  width: min(calc(100% - 40px), var(--ok-content));
  margin-inline: auto;
  padding: 55px 0;
}

.ok-post-featured {
  margin: 0 0 45px;
  overflow: hidden;
}

.ok-post-featured img {
  display: block;
  width: 100%;
  height: auto;
}

.ok-legacy-section {
  padding: 65px 0;
}

.ok-legacy-section + .ok-legacy-section {
  padding-top: 0;
}

.ok-legacy-inner {
  width: min(calc(100% - 80px), var(--ok-container));
  margin-inline: auto;
}

.ok-entry-content .ok-legacy-inner {
  width: 100%;
}

.ok-legacy-row {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  align-items: stretch;
}

.ok-legacy-col {
  flex: 1 1 280px;
  min-width: 0;
}

.ok-legacy-text > :last-child,
.ok-legacy-col > :last-child {
  margin-bottom: 0;
}

.ok-legacy-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}

.ok-legacy-image,
.ok-legacy-image-box img,
.ok-legacy-banner img,
.ok-legacy-slide img {
  display: block;
  max-width: 100%;
  height: auto;
}

.ok-legacy-image-box,
.ok-legacy-banner,
.ok-legacy-message {
  overflow: hidden;
  background: #fff;
}

.ok-legacy-featured-box {
  display: grid;
  grid-template-columns: minmax(150px,.8fr) minmax(0,1.2fr);
  height: 100%;
  overflow: hidden;
  color: inherit;
  background: #fff;
  box-shadow: 0 12px 36px rgba(75,68,62,.08);
}

.ok-legacy-featured-box__media {
  min-height: 240px;
}

.ok-legacy-featured-box__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ok-legacy-featured-box__content {
  padding: 28px;
}

.ok-legacy-featured-box__content > :last-child {
  margin-bottom: 0;
}

.ok-legacy-divider {
  margin: 38px 0;
  border: 0;
  border-top: 1px solid var(--ok-line);
}

.ok-legacy-gap {
  display: block;
}

.ok-legacy-title {
  margin-bottom: 30px;
}

.ok-legacy-blog-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 28px;
}

.ok-legacy-blog-card {
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 36px rgba(75,68,62,.08);
}

.ok-legacy-blog-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
}

.ok-legacy-blog-card__body {
  padding: 24px;
}

.ok-legacy-blog-card__body h3 {
  margin: 0;
  font-size: 25px;
}

.ok-legacy-accordion-item,
.ok-legacy-tab {
  padding: 20px 0;
  border-bottom: 1px solid var(--ok-line);
}

.ok-legacy-message {
  padding: 25px;
  border-left: 4px solid var(--ok-orange);
}

/* Forms and WPBakery */

.entry-content::after {
  content: "";
  display: table;
  clear: both;
}

/* * WPBakery layout
 *
 * Normal rows remain inside the site-wide main container.
 * Rows explicitly set to full width in WPBakery break out to the viewport. */

.ok-builder-page,
.ok-builder-page article,
.ok-builder-page .entry-content,
.ok-builder-page .ok-wpbakery-content {
  width: 100%;
  max-width: 100%;
  margin-right: 0;
  margin-left: 0;
}

/* WPBakery: "Achtergrond over de gehele breedte". */

/* * Background full width, content still aligned with the site's 1600px frame.
 * WPBakery omits data-vc-stretch-content="true" for this setting. */

/* WPBakery: background and content both over the entire width. */

.wpb_text_column > :last-child {
  margin-bottom: 0;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea,
select {
  max-width: 100%;
  padding: 13px 15px;
  border: 1px solid var(--ok-line);
  border-radius: 0;
  background: #fff;
}

textarea {
  min-height: 150px;
}

/* Responsive */

@media (max-width: 1320px) {
  :root {
    --ok-header-height: 94px;
  }

  .ok-container,
  .ok-content-width {
    width: min(calc(100% - 60px), var(--ok-container));
  }

  .ok-content-width {
    max-width: var(--ok-content);
  }

  .ok-header-inner {
    grid-template-columns: 170px minmax(0,1fr) auto;
    gap: 16px;
  }

  .ok-header-actions {
    gap: 10px;
  }

  .ok-logo,
  .custom-logo-link {
    width: 145px;
  }

  .ok-primary-nav ul {
    gap: 18px;
  }

  .ok-primary-nav a {
    padding-block: 34px;
    font-size: 11px;
  }

  .ok-header-phone {
    display: none;
  }

  .ok-treatment-category-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 55px 35px;
  }
}

/* Schakel op laptops en smallere desktopvensters al over naar de compacte navigatie.
   1440px is bewust gekozen zodat navigatie, zoeken, telefoon en afspraakknop
   nooit eerst tegen elkaar aan hoeven te lopen. */
@media (max-width: 1440px) {
  .ok-site-header {
    height: 82px;
  }

  .ok-header-inner {
    grid-template-columns: 1fr auto;
    gap: 18px;
  }

  .ok-primary-nav,
  .ok-header-phone,
  .ok-header-button {
    display: none;
  }

  .ok-header-actions {
    gap: 8px;
  }

  .ok-menu-toggle {
    display: block;
  }

  .ok-logo,
  .custom-logo-link {
    width: 145px;
  }

  .ok-mobile-panel[hidden] {
    display: none !important;
  }

  .ok-mobile-panel:not([hidden]) {
    position: fixed;
    z-index: 1100;
    inset: 0;
    display: block !important;
    overflow-y: auto;
    color: var(--ok-text);
    background: rgba(255,255,255,.98);
  }

  .ok-mobile-panel-inner {
    width: min(100%,620px);
    min-height: 100%;
    margin-left: auto;
    padding: 90px 40px 45px;
    background: #fff;
  }

  .ok-mobile-close {
    position: absolute;
    top: 22px;
    right: 28px;
    width: 45px;
    height: 45px;
    border: 0;
    background: transparent;
    font-size: 38px;
  }

  .ok-mobile-menu,
  .ok-mobile-panel .ok-menu {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .ok-mobile-menu a,
  .ok-mobile-panel .ok-menu a {
    display: block;
    padding: 14px 0;
    border-bottom: 1px solid var(--ok-line);
    font-size: 18px;
    text-transform: uppercase;
  }

  .ok-mobile-menu .current-menu-item > a,
  .ok-mobile-menu .current-menu-parent > a,
  .ok-mobile-menu .current-menu-ancestor > a,
  .ok-mobile-menu .ok-current-section > a,
  .ok-mobile-panel .ok-menu .current-menu-item > a,
  .ok-mobile-panel .ok-menu .current-menu-parent > a,
  .ok-mobile-panel .ok-menu .current-menu-ancestor > a,
  .ok-mobile-panel .ok-menu .ok-current-section > a {
    color: var(--ok-brown);
    font-weight: 600;
  }

  .ok-mobile-menu .sub-menu {
    margin: 0;
    padding-left: 18px;
    list-style: none;
  }

  .ok-mobile-contact {
    margin-top: 40px;
  }
}

@media (max-width: 1024px) {
  body {
    font-size: 16px;
  }

  .ok-container,
  .ok-content-width {
    width: min(calc(100% - 42px), var(--ok-container));
  }

  .ok-section {
    padding: 80px 0;
  }

  .ok-site-header {
    height: 82px;
  }

  .ok-header-inner {
    grid-template-columns: 1fr auto;
  }

  .ok-primary-nav,
  .ok-header-phone,
  .ok-header-button {
    display: none;
  }

  .ok-menu-toggle {
    display: block;
  }

  .ok-logo,
  .custom-logo-link {
    width: 138px;
  }

  .ok-mobile-panel[hidden] {
    display: none !important;
  }

  .ok-mobile-panel:not([hidden]) {
    position: fixed;
    z-index: 1100;
    inset: 0;
    display: block !important;
    overflow-y: auto;
    color: var(--ok-text);
    background: rgba(255,255,255,.98);
  }

  .ok-mobile-panel-inner {
    width: min(100%,620px);
    min-height: 100%;
    margin-left: auto;
    padding: 90px 40px 45px;
    background: #fff;
  }

  .ok-mobile-close {
    position: absolute;
    top: 22px;
    right: 28px;
    width: 45px;
    height: 45px;
    border: 0;
    background: transparent;
    font-size: 38px;
  }

  .ok-mobile-menu,
  .ok-mobile-panel .ok-menu {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .ok-mobile-menu a,
  .ok-mobile-panel .ok-menu a {
    display: block;
    padding: 14px 0;
    border-bottom: 1px solid var(--ok-line);
    font-size: 18px;
    text-transform: uppercase;
  }

  .ok-mobile-menu .sub-menu {
    margin: 0;
    padding-left: 18px;
    list-style: none;
  }

  .ok-mobile-contact {
    margin-top: 40px;
  }

  .ok-treatment-hero {
    min-height: 780px;
  }

  .ok-treatment-hero-grid {
    grid-template-columns: 1fr;
    min-height: 780px;
    align-items: start;
  }

  .ok-treatment-hero-copy {
    grid-column: 1;
    max-width: 760px;
    padding: 70px 0 380px;
  }

  .ok-treatment-hero-model {
    left: 0;
    right: 0;
    width: 100%;
    height: 430px;
  }

  .ok-treatment-hero-model img {
    object-position: center bottom;
  }

  .ok-two-col,
  .ok-treatment-content-grid,
  .ok-rates-grid,
  .ok-rates-group,
  .ok-treatment-extra-grid,
  .ok-team-about-grid {
    grid-template-columns: 1fr;
    gap: 55px;
  }

  .ok-card-grid,
  .ok-team-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .ok-footer-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .ok-team-hero-grid {
    grid-template-columns: 1fr;
    min-height: 780px;
    align-items: start;
  }

  .ok-team-hero-copy {
    padding-top: 70px;
  }

  .ok-team-hero-photo {
    right: 0;
    width: 100%;
    height: 470px;
  }
}

@media (max-width: 680px) {
  h1 {
    font-size: 43px;
  }

  h2 {
    font-size: 38px;
  }

  h3 {
    font-size: 29px;
  }

  .ok-container,
  .ok-content-width {
    width: min(calc(100% - 30px), var(--ok-container));
  }

  .ok-section {
    padding: 65px 0;
  }

  .ok-treatment-hero {
    min-height: 760px;
  }

  .ok-treatment-hero-grid {
    min-height: 760px;
  }

  .ok-treatment-hero-copy {
    padding: 48px 0 350px;
  }

  .ok-treatment-hero-model {
    height: 360px;
  }

  .ok-rating {
    align-items: flex-start;
    flex-direction: column;
  }

  .ok-stats-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
    min-height: 115px;
  }

  .ok-stat {
    padding: 12px 4px;
  }

  .ok-stat strong,
  .ok-stat span {
    font-size: 13px;
    line-height: 22px;
  }

  .ok-treatment-category-grid,
  .ok-card-grid,
  .ok-team-grid,
  .ok-review-facts {
    grid-template-columns: 1fr;
  }

  .ok-treatment-category-card p {
    min-height: 0;
  }

  .ok-treatment-photo {
    min-height: 490px;
  }

  .ok-process-list li {
    grid-template-columns: 50px 1fr;
    gap: 16px;
  }

  .ok-process-list li > span {
    width: 44px;
    height: 44px;
  }

  .ok-rate-list > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .ok-team-stats .ok-container {
    grid-template-columns: 1fr;
    padding-block: 30px;
  }

  .ok-team-stats .ok-container > div {
    padding: 18px;
  }

  .ok-footer-grid {
    grid-template-columns: 1fr;
  }

  .ok-footer-bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .ok-mobile-panel-inner {
    padding-inline: 25px;
  }
}

/* XD doctor presentation on the homepage */

@media (max-width: 680px) {
  .ok-treatment-hero {
    min-height: 700px;
  }

  .ok-treatment-hero-grid {
    min-height: 700px;
  }

  .ok-treatment-hero-copy {
    position: relative;
    z-index: 3;
    width: 62%;
    padding: 70px 0 55px;
  }

  .ok-treatment-hero-copy h1 {
    font-size: 39px;
  }

  .ok-treatment-hero-model {
    left: auto;
    right: -8%;
    width: 72%;
    height: 100%;
  }

  .ok-treatment-hero-model img {
    object-position: right center;
  }

  .ok-two-col--intro {
    display: block;
  }

  .ok-treatment-category-grid {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 18px;
  }

  .ok-treatment-category-card {
    flex: 0 0 86%;
    scroll-snap-align: center;
  }
}

@media (max-width: 680px) {
  .ok-legacy-inner {
    width: min(calc(100% - 30px), var(--ok-container));
  }

  .ok-entry-content .ok-legacy-inner {
    width: 100%;
  }

  .ok-legacy-row {
    gap: 22px;
  }

  .ok-legacy-featured-box {
    grid-template-columns: 1fr;
  }

  .ok-legacy-featured-box__media {
    min-height: 220px;
  }

  .ok-legacy-blog-grid {
    grid-template-columns: 1fr;
  }
}

/* Treatment detail alignment, matched to the supplied XD artboard. */

@media (min-width: 1025px) {
  .ok-treatment-hero::after {
    display: none;
  }

  .ok-treatment-hero-grid {
    grid-template-columns: 53% 47%;
  }

  .ok-treatment-hero-copy {
    grid-column: 1;
    max-width: 640px;
    padding: 72px 40px 72px 0;
  }

  .ok-treatment-hero-copy h1 {
    max-width: 590px;
    font-size: clamp(46px, 4vw, 68px);
    line-height: 1.08;
  }

  .ok-treatment-hero-copy > p {
    max-width: 590px;
  }

  .ok-treatment-hero-model {
    right: max(0px, calc((100vw - var(--ok-container)) / 2));
    left: auto;
    width: min(49vw, 880px);
  }

  .ok-treatment-hero-model img {
    object-position: right bottom;
  }

  .ok-treatment-intro-section {
    padding-top: 96px;
    padding-bottom: 108px;
  }

  .ok-treatment-content-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
    gap: 88px;
    align-items: center;
    max-width: 1120px;
  }

  .ok-treatment-content-grid .ok-richtext {
    grid-column: 1;
    grid-row: 1;
  }

  .ok-treatment-content-grid .ok-treatment-photo {
    grid-column: 2;
    grid-row: 1;
  }

  .ok-treatment-photo {
    min-height: 0;
    height: 430px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: none;
  }

  .ok-treatment-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .ok-treatment-content-grid .ok-richtext h2 {
    max-width: 620px;
    margin-bottom: 34px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--ok-line);
  }

  .ok-treatment-content-grid .ok-richtext p {
    max-width: 650px;
  }

  .ok-treatment-single .ok-button,
  .ok-treatment-single .ok-button--outline,
  .ok-treatment-single .ok-button--outline-light {
    box-shadow: none;
  }
}

/* v1.2.2 pixel-correction pass based on user diff review */

/* Remove decorative overlays and invented background blocks */

.ok-treatment-hero::after {
  display: none;
}

/* Homepage treatment heading centered and category figures allowed to break out */

.ok-treatment-category-grid {
  align-items: end;
}

.ok-treatment-category-card {
  overflow: visible;
}

.ok-treatment-category-image {
  position: relative;
  height: 295px;
  margin-bottom: 30px;
  background: transparent;
  overflow: visible;
}

.ok-treatment-category-image img {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: auto;
  max-width: 125%;
  height: 118%;
  transform: translateX(-50%);
  object-fit: contain;
  object-position: center bottom;
}

/* Rounded image treatments where the XD shows rounded photography */

.ok-treatment-photo {
  border-radius: 24px;
}

.ok-treatment-photo img {
  display: block;
}

/* Treatment page: keep layout 1:1 with the supplied XD: copy left, model right, first content image right */

@media (min-width: 1025px) {
  .ok-treatment-hero {
    background-position: center center;
  }

  .ok-treatment-hero-grid {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .ok-treatment-hero-copy {
    grid-column: 1;
    width: 100%;
    max-width: 560px;
    padding: 88px 0 88px 0;
  }

  .ok-treatment-hero-copy h1 {
    max-width: 520px;
    font-size: clamp(42px,4vw,63px);
    line-height: 1.08;
  }

  .ok-treatment-hero-model {
    left: auto;
    right: max(40px, calc((100vw - var(--ok-container)) / 2));
    width: min(42vw, 720px);
    height: 100%;
  }

  .ok-treatment-hero-model img {
    object-position: right bottom;
  }

  .ok-layout-eye .ok-treatment-hero-model img {
    transform: scaleX(-1);
    transform-origin: center center;
  }

  .ok-treatment-intro-section {
    padding-top: 96px;
    padding-bottom: 96px;
  }

  .ok-treatment-content-grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr);
    gap: 84px;
    align-items: center;
    max-width: 1040px;
  }

  .ok-treatment-content-grid .ok-richtext {
    grid-column: 1;
    grid-row: 1;
  }

  .ok-treatment-content-grid .ok-treatment-photo {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
  }

  .ok-treatment-photo {
    width: 100%;
    max-width: 360px;
    height: 455px;
    min-height: 455px;
    margin-left: auto;
    overflow: hidden;
    box-shadow: none;
  }

  .ok-treatment-content-grid .ok-richtext h2 {
    max-width: 620px;
    margin-bottom: 28px;
    padding-bottom: 0;
    border-bottom: 0;
  }
}

@media (max-width: 680px) {
  .ok-treatment-category-image {
    height: 250px;
  }

  .ok-treatment-category-image img {
    max-width: 118%;
    height: 112%;
  }
}

/* WPBakery homepage helpers */

.home .ok-builder-page .entry-content {
  padding-top: 0;
  padding-bottom: 0;
}

/* ==========================================================
   Site-wide content container
   Every page template uses the same frame. Explicit WPBakery
   full-width rows can break out of this frame.
   ========================================================== */

:root {
  --ok-main-max-width: 1380px;
  --ok-main-gutter: 40px;
}

.ok-site-main {
  width: calc(100% - (var(--ok-main-gutter) * 2));
  max-width: var(--ok-main-max-width);
  margin-right: auto;
  margin-left: auto;
  overflow: visible;
}

.ok-site-main > *,
.ok-site-main article,
.ok-site-main .entry-content {
  max-width: 100%;
}

@media (max-width: 1024px) {
  :root {
    --ok-main-gutter: 21px;
  }
}

@media (max-width: 680px) {
  :root {
    --ok-main-gutter: 15px;
  }
}

/* Treatment-specific presentation */
.ok-treatment-quality {
  padding: 48px 0;
  text-align: center;
  background: #fff;
}

.ok-treatment-quality p {
  margin-bottom: 28px;
  font-size: 22px;
}

.ok-treatment-quality img {
  width: min(100%, 1160px);
  margin-right: auto;
  margin-left: auto;
}

.ok-treatment-doctor-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 90px;
  align-items: center;
}

.ok-treatment-doctor-photo {
  min-height: 650px;
  overflow: hidden;
  border-radius: 24px;
  background: #ece5df;
}

.ok-treatment-doctor-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

@media (max-width: 1024px) {
  .ok-treatment-doctor-grid {
    grid-template-columns: 1fr;
    gap: 55px;
  }
}

@media (max-width: 680px) {
  .ok-treatment-doctor-photo {
    min-height: 490px;
  }
}

/* ==========================================================
   v1.3.4 Treatment pages: full-width hero + WPBakery body
   ========================================================== */

/*
 * The global <main> normally is the site container. Treatment pages are the
 * exception: the hero needs to reach both viewport edges. The page body gets
 * its own constrained container below.
 */
body.single-ok_behandeling .ok-site-main {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

body.single-ok_behandeling .ok-treatment-single {
  width: 100%;
  max-width: none;
  margin: 0;
}

/* Hero background is truly viewport-wide. Its existing .ok-container keeps
 * the copy aligned with the rest of the website. */
body.single-ok_behandeling .ok-treatment-hero {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

/* Everything edited in WPBakery stays inside the normal site frame. */
.ok-treatment-builder-content {
  width: calc(100% - (var(--ok-main-gutter) * 2));
  max-width: var(--ok-main-max-width);
  margin-right: auto;
  margin-left: auto;
  padding-top: 72px;
  padding-bottom: 96px;
  overflow: visible;
}

.ok-treatment-builder-content .entry-content,
.ok-treatment-builder-content .ok-wpbakery-content {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

/* On treatment pages WPBakery rows are intentionally kept inside the body
 * container. A row can still have its own background, columns and spacing,
 * but it will not escape to browser width. */
.single-ok_behandeling .ok-treatment-builder-content .vc_row:not([data-vc-full-width="true"]),
.single-ok_behandeling .ok-treatment-builder-content .vc_section:not([data-vc-full-width="true"]) {
  left: auto !important;
  width: auto !important;
  max-width: 100% !important;
  margin-right: -15px !important;
  margin-left: -15px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  transform: none !important;
}

@media (max-width: 1024px) {
  .ok-treatment-builder-content {
    padding-top: 56px;
    padding-bottom: 72px;
  }
}

@media (max-width: 680px) {
  .ok-treatment-builder-content {
    padding-top: 40px;
    padding-bottom: 56px;
  }
}

/* ==========================================================
   v1.3.5 Treatment editor handover
   ========================================================== */

/* The treatment hero itself is full viewport width, but the hero's actual
   content is aligned to exactly the same 1380px frame as the website body. */
body.single-ok_behandeling .ok-treatment-hero > .ok-treatment-hero-grid {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  max-width: var(--ok-main-max-width);
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

/* WPBakery owns all vertical spacing below the hero. The theme only provides
   the normal horizontal website container. */
body.single-ok_behandeling .ok-treatment-builder-content {
  width: calc(100% - (var(--ok-main-gutter) * 2));
  max-width: var(--ok-main-max-width);
  margin-right: auto;
  margin-left: auto;
  padding-top: 0;
  padding-bottom: 0;
}

body.single-ok_behandeling .ok-treatment-builder-content > .entry-content {
  width: 100%;
  max-width: none;
  padding-top: 0;
  padding-bottom: 0;
}

/* A treatment can use WPBakery backgrounds and columns, but the body itself
   never escapes the normal website frame. */
body.single-ok_behandeling .ok-treatment-builder-content .vc_row:not([data-vc-full-width="true"]),
body.single-ok_behandeling .ok-treatment-builder-content .vc_section:not([data-vc-full-width="true"]) {
  left: auto !important;
  width: auto !important;
  max-width: 100% !important;
  transform: none !important;
}

/* Native WPBakery "Stretch row" is allowed to escape the treatment body.
   WPBakery itself keeps the row content aligned while the background reaches
   the viewport edges. "Stretch row and content" remains available for the
   occasional full-width image. */

@media (max-width: 680px) {
  body.single-ok_behandeling .ok-treatment-hero > .ok-treatment-hero-grid {
    width: calc(100% - (var(--ok-main-gutter) * 2));
  }
}


/* ==========================================================
   v1.3.6 Treatment body: no locked legacy template
   The legacy treatment body is no longer rendered. Both the live
   preview and saved WPBakery body use this same constrained frame.
   ========================================================== */
body.single-ok_behandeling .ok-treatment-single--builder-preview .ok-treatment-builder-content,
body.single-ok_behandeling .ok-treatment-single--builder .ok-treatment-builder-content {
  width: calc(100% - (var(--ok-main-gutter) * 2));
  max-width: var(--ok-main-max-width);
  margin-right: auto;
  margin-left: auto;
}


/* ==========================================================
   v1.3.7 Archive full-bleed backgrounds + global key figures
   Only the backgrounds escape the site frame. Copy and statistics
   remain aligned to the normal 1380px website container.
   ========================================================== */

/* .ok-site-main is constrained site-wide, so archive backgrounds need to
   break out of that frame without widening their actual content. */
.ok-site-main > .ok-archive-hero,
.ok-site-main > .ok-stats {
  width: 100vw;
  max-width: none;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
}

.ok-site-main > .ok-archive-hero > .ok-container,
.ok-site-main > .ok-stats > .ok-container {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  max-width: var(--ok-main-max-width);
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

/* Keep the key figures aligned even when the reusable block is used from a
   template where it is not a direct child of .ok-site-main. */
.ok-stats > .ok-container {
  max-width: var(--ok-main-max-width);
}

@media (max-width: 680px) {
  .ok-site-main > .ok-archive-hero > .ok-container,
  .ok-site-main > .ok-stats > .ok-container {
    width: calc(100% - (var(--ok-main-gutter) * 2));
  }
}


/* ==========================================================
   v1.3.8 Standard page full-bleed hero background
   The background spans the viewport, while hero copy remains
   aligned to the normal 1380px site frame.
   ========================================================== */

.ok-site-main .ok-standard-page > .ok-page-hero {
  width: 100vw;
  max-width: none;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
}

.ok-site-main .ok-standard-page > .ok-page-hero > .ok-container {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  max-width: var(--ok-main-max-width);
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

@media (max-width: 680px) {
  .ok-site-main .ok-standard-page > .ok-page-hero > .ok-container {
    width: calc(100% - (var(--ok-main-gutter) * 2));
  }
}

/* =========================================================
   Ajax Search Lite in zoekmodal - OranjeKlinieken styling
   ========================================================= */

/* Ajax Search Lite plaatst zelf nog een rechthoekige skin/wrapper rond de
   probox. In de modal willen we uitsluitend de afgeronde zoekbalk zien. */
.ok-search-modal-form div.asl_m,
.ok-search-modal-form div.asl_w,
.ok-search-modal-form div.asl_m.asl_w {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.ok-search-modal-form div.asl_m .probox,
.ok-search-modal-form div.asl_w .probox {
  overflow: hidden !important;
  border: 1px solid rgba(103, 96, 90, .20) !important;
  border-radius: 999px !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: 0 7px 22px rgba(68, 61, 55, .045) !important;
}

.ok-search-modal-form div.asl_m .probox .proinput,
.ok-search-modal-form div.asl_m .probox .proinput form,
.ok-search-modal-form div.asl_m .probox .proinput input,
.ok-search-modal-form div.asl_w .probox .proinput,
.ok-search-modal-form div.asl_w .probox .proinput form,
.ok-search-modal-form div.asl_w .probox .proinput input {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.ok-search-modal-form div.asl_m .probox .proclose,
.ok-search-modal-form div.asl_w .probox .proclose {
  margin-right: 2px !important;
}

/* De live resultaten worden door Ajax Search Lite buiten de modal in de DOM
   geplaatst. Scope daarom via body.ok-search-open zodat de plugin elders op de
   site niet onbedoeld wordt aangepast. */
body.ok-search-open div.asl_r {
  overflow: hidden !important;
  padding: 8px !important;
  border: 1px solid rgba(103, 96, 90, .14) !important;
  border-radius: 20px !important;
  background: var(--ok-offwhite) !important;
  background-image: none !important;
  box-shadow: 0 24px 65px rgba(47, 42, 37, .18) !important;
}

body.ok-search-open div.asl_r .results,
body.ok-search-open div.asl_r .resdrg,
body.ok-search-open div.asl_r .results .asl_nores,
body.ok-search-open div.asl_r .results .group {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.ok-search-open div.asl_r .results {
  overflow-x: hidden !important;
  padding: 0 !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(117, 111, 106, .45) transparent;
}

body.ok-search-open div.asl_r .results::-webkit-scrollbar {
  width: 6px;
}

body.ok-search-open div.asl_r .results::-webkit-scrollbar-track {
  background: transparent;
}

body.ok-search-open div.asl_r .results::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(117, 111, 106, .38);
}

body.ok-search-open div.asl_r .results .item {
  display: flex !important;
  align-items: center !important;
  gap: 15px !important;
  min-height: 0 !important;
  margin: 0 0 4px !important;
  padding: 13px 14px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transition: background .18s ease, transform .18s ease !important;
}

body.ok-search-open div.asl_r .results .item:last-child {
  margin-bottom: 0 !important;
}

body.ok-search-open div.asl_r .results .item:hover,
body.ok-search-open div.asl_r .results .item.hovered {
  background: #fff !important;
}

body.ok-search-open div.asl_r .results .item .asl_image {
  width: 76px !important;
  min-width: 76px !important;
  height: 68px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 11px !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: none !important;
}

body.ok-search-open div.asl_r .results .item .asl_content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 0 !important;
}

body.ok-search-open div.asl_r .results .item h3,
body.ok-search-open div.asl_r .results .item h3 a {
  margin: 0 0 4px !important;
  color: var(--ok-brown) !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
}

body.ok-search-open div.asl_r .results .item:hover h3 a,
body.ok-search-open div.asl_r .results .item h3 a:hover {
  color: var(--ok-orange-dark) !important;
}

body.ok-search-open div.asl_r .results .item .desc,
body.ok-search-open div.asl_r .results .item p,
body.ok-search-open div.asl_r .results .item .etc,
body.ok-search-open div.asl_r .results .item .asl_desc {
  margin: 0 !important;
  color: #837c76 !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.ok-search-open div.asl_r .results .item .etc,
body.ok-search-open div.asl_r .results .item .asl_date,
body.ok-search-open div.asl_r .results .item .asl_author {
  color: #a39c96 !important;
  font-size: 12px !important;
}

body.ok-search-open div.asl_r .results .asl_nores {
  padding: 20px 18px !important;
  color: var(--ok-text) !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

@media (max-width: 767px) {
  .ok-search-dialog {
    border-radius: 22px;
  }

  body.ok-search-open div.asl_r {
    padding: 6px !important;
    border-radius: 16px !important;
  }

  body.ok-search-open div.asl_r .results .item {
    gap: 11px !important;
    padding: 11px !important;
  }

  body.ok-search-open div.asl_r .results .item .asl_image {
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    border-radius: 9px !important;
  }

  body.ok-search-open div.asl_r .results .item h3,
  body.ok-search-open div.asl_r .results .item h3 a {
    font-size: 14px !important;
  }

  body.ok-search-open div.asl_r .results .item .desc,
  body.ok-search-open div.asl_r .results .item p,
  body.ok-search-open div.asl_r .results .item .asl_desc {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    font-size: 12.5px !important;
  }
}

/* =========================================================
   v1.4.4 Clinicminds booking page
   The scheduler stays on OranjeKlinieken while Clinicminds
   runs inside its supported frame integration.
   ========================================================= */

.ok-booking-section {
  padding: 70px 0 110px;
  background: var(--ok-offwhite);
}

.ok-booking-container {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  margin: 0 auto;
}

.ok-booking-frame-wrap {
  overflow: hidden;
  border: 1px solid rgba(103, 96, 90, .12);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(68, 61, 55, .09);
}

.ok-booking-frame {
  display: block;
  width: 100%;
  height: 1460px;
  border: 0;
  background: #fff;
  overflow: hidden;
}

.ok-booking-fallback {
  margin: 24px 0 0;
  text-align: center;
}

.ok-booking-fallback a {
  color: var(--ok-orange-dark);
  text-decoration: underline;
}

@media (max-width: 780px) {
  .ok-booking-section {
    padding: 38px 0 70px;
  }

  .ok-booking-frame-wrap {
    border-radius: 20px;
  }

  .ok-booking-frame {
    height: 1680px;
  }
}

/* ==========================================================
   v1.4.6 Blog archive + robust smooth live category filter
   ========================================================== */

.ok-site-main > .ok-blog-hero {
  position: relative;
  width: 100vw;
  max-width: none;
  min-height: 440px;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  display: flex;
  align-items: center;
  color: #fff;
  background: #cbbcab url("assets/xd/hero-texture.jpg") center/cover no-repeat;
  overflow: hidden;
}

.ok-site-main > .ok-blog-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(111, 99, 88, .28), rgba(111, 99, 88, .04));
}

.ok-blog-hero > .ok-container {
  position: relative;
  z-index: 1;
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  max-width: var(--ok-main-max-width);
  padding: 76px 0 70px;
  margin: 0 auto;
}

.ok-blog-hero h1 {
  max-width: 930px;
  margin: 0 0 18px;
  color: #fff;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(44px, 4.35vw, 72px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.025em;
}

.ok-blog-hero p {
  margin: 0;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
}

.ok-site-main > .ok-blog-archive {
  width: 100vw;
  max-width: none;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 74px 0 92px;
  background: #fff;
}

.ok-blog-archive__inner {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  max-width: var(--ok-main-max-width);
  margin-right: auto;
  margin-left: auto;
}

.ok-blog-filter-intro {
  max-width: 840px;
  margin: 0 auto 28px;
  text-align: center;
}

.ok-blog-filter-intro__eyebrow {
  display: block;
  margin-bottom: 8px;
  color: #8b847f;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ok-blog-filter-intro h2 {
  margin: 0;
  color: #928981;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(35px, 3vw, 50px);
  font-weight: 400;
  line-height: 1.16;
}

.ok-blog-filter-intro__rule {
  display: block;
  width: 210px;
  height: 1px;
  margin: 20px auto 0;
  background: rgba(104, 98, 92, .28);
}

.ok-blog-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
  margin: 0 auto 86px;
}

.ok-blog-filter {
  min-width: 170px;
  padding: 14px 22px;
  border: 1px solid rgba(119, 111, 104, .34);
  border-radius: 4px;
  color: #8a837d;
  background: transparent;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .025em;
  text-align: center;
  text-transform: uppercase;
  transition: color .22s ease, background-color .22s ease, border-color .22s ease, transform .22s ease;
}

.ok-blog-filter:hover {
  color: #fff;
  border-color: #c7b9aa;
  background: #c7b9aa;
  transform: translateY(-1px);
}

.ok-blog-filter.is-active {
  color: #fff;
  border-color: #b9aa9c;
  background: #b9aa9c;
}

.ok-blog-results {
  position: relative;
  min-height: 520px;
}

.ok-blog-results::after {
  content: "";
  position: absolute;
  z-index: 3;
  top: 8px;
  left: 50%;
  width: 34px;
  height: 34px;
  margin-left: -17px;
  border: 2px solid rgba(145, 134, 124, .2);
  border-top-color: #9f9184;
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-5px) rotate(0deg);
  transition: opacity .18s ease;
}

.ok-blog-results.is-loading::after {
  opacity: 1;
  animation: ok-blog-spin .7s linear infinite;
}

@keyframes ok-blog-spin {
  to { transform: translateY(-5px) rotate(360deg); }
}

.ok-blog-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 86px 44px;
  opacity: 1;
  transform: translateY(0);
  transition: opacity .18s ease, transform .18s ease;
}

.ok-blog-grid.is-leaving {
  opacity: 0;
  transform: translateY(10px);
}

.ok-blog-grid.is-entering {
  opacity: 0;
  transform: translateY(12px);
}

.ok-blog-card {
  min-width: 0;
  background: transparent;
}

.ok-blog-card__image {
  display: block;
  width: 100%;
  aspect-ratio: 1.72 / 1;
  overflow: hidden;
  border-radius: 34px;
  background: #eee7df;
}

.ok-blog-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .55s cubic-bezier(.2,.65,.3,1);
}

.ok-blog-card:hover .ok-blog-card__image img {
  transform: scale(1.025);
}

.ok-blog-card__body {
  padding: 22px 14px 0;
}

.ok-blog-card__meta {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 7px;
  color: #8a837d;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .025em;
  line-height: 1.4;
  text-transform: uppercase;
}

.ok-blog-card__meta time {
  flex: 0 0 auto;
  text-align: right;
}

.ok-blog-card__title {
  max-width: 93%;
  margin: 0;
  color: #8e857e;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(25px, 2vw, 33px);
  font-weight: 400;
  line-height: 1.16;
}

.ok-blog-card__title a:hover {
  color: #6f6862;
}

.ok-blog-card__rule {
  display: block;
  width: 210px;
  max-width: 38%;
  height: 1px;
  margin: 18px 0 18px;
  background: rgba(112, 105, 99, .28);
}

.ok-blog-card__excerpt {
  max-width: 95%;
  margin: 0 0 25px;
  color: #7e7771;
  font-size: 14px;
  line-height: 1.65;
}

.ok-blog-card__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 10px 22px;
  border-radius: 7px;
  color: #fff;
  background: #c7b9aa;
  font-size: 11px;
  font-weight: 600;
  transition: background-color .2s ease, transform .2s ease;
}

.ok-blog-card__button:hover {
  color: #fff;
  background: #aa9c90;
  transform: translateY(-1px);
}

.ok-blog-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 78px;
  color: #8c837b;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 18px;
}

.ok-blog-pagination__link,
.ok-blog-pagination__next {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 28px;
  color: #9a9189;
  transition: color .18s ease, transform .18s ease;
}

.ok-blog-pagination__link[aria-current="page"] {
  color: #655f5a;
  font-weight: 600;
}

.ok-blog-pagination__link:hover,
.ok-blog-pagination__next:hover {
  color: var(--ok-orange-dark);
  transform: translateY(-1px);
}

.ok-blog-pagination__next {
  margin-left: 2px;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 22px;
}

.ok-blog-empty {
  grid-column: 1 / -1;
  padding: 90px 20px;
  color: #8a817a;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 30px;
  text-align: center;
}

@media (max-width: 1024px) {
  .ok-site-main > .ok-blog-hero {
    min-height: 390px;
  }

  .ok-blog-hero > .ok-container {
    padding-top: 66px;
    padding-bottom: 62px;
  }

  .ok-blog-filters {
    gap: 12px;
    margin-bottom: 65px;
  }

  .ok-blog-filter {
    min-width: 145px;
  }

  .ok-blog-grid {
    gap: 64px 28px;
  }
}

@media (max-width: 760px) {
  .ok-site-main > .ok-blog-hero {
    min-height: 330px;
  }

  .ok-blog-hero > .ok-container {
    width: calc(100% - (var(--ok-main-gutter) * 2));
    padding: 54px 0;
  }

  .ok-blog-hero h1 {
    font-size: clamp(38px, 11vw, 52px);
  }

  .ok-blog-hero h1 br {
    display: none;
  }

  .ok-site-main > .ok-blog-archive {
    padding-top: 56px;
  }

  .ok-blog-archive__inner {
    width: calc(100% - (var(--ok-main-gutter) * 2));
  }

  .ok-blog-filter-intro {
    margin-bottom: 25px;
  }

  .ok-blog-filters {
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 10px;
    width: calc(100% + var(--ok-main-gutter));
    margin-bottom: 54px;
    padding: 0 var(--ok-main-gutter) 8px 0;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .ok-blog-filters::-webkit-scrollbar {
    display: none;
  }

  .ok-blog-filter {
    flex: 0 0 auto;
    min-width: 148px;
  }

  .ok-blog-grid {
    grid-template-columns: 1fr;
    gap: 58px;
  }

  .ok-blog-card__image {
    border-radius: 26px;
  }

  .ok-blog-card__body {
    padding-right: 2px;
    padding-left: 2px;
  }

  .ok-blog-card__title,
  .ok-blog-card__excerpt {
    max-width: 100%;
  }

  .ok-blog-pagination {
    margin-top: 56px;
  }
}



@media (prefers-reduced-motion: reduce) {
  .ok-blog-grid,
  .ok-blog-card__image img,
  .ok-blog-filter,
  .ok-blog-card__button {
    transition: none !important;
  }

  .ok-blog-results.is-loading::after {
    animation-duration: 1.4s;
  }
}

/* ==========================================================
   v1.4.7 Single blog article
   Calm editorial layout with a contained featured image and
   comfortable reading width. The page background can still
   span the viewport while the content stays aligned.
   ========================================================== */

body.single-post .ok-site-main > .ok-single-post {
  max-width: none;
}

.ok-single-post-hero .ok-container {
  max-width: var(--ok-main-max-width);
}

.ok-single-post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  margin: 0 0 17px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .055em;
  line-height: 1.4;
  text-transform: uppercase;
}

.ok-single-post-meta time {
  opacity: .82;
}

.ok-single-post-category {
  color: var(--ok-orange);
}

.ok-single-post-category:hover {
  color: #fff;
}

.ok-single-post-body {
  width: 100vw;
  max-width: none;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 78px 0 115px;
  background: #fff;
}

.ok-single-post-shell {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), 1050px);
  margin: 0 auto;
}

.ok-single-post .ok-post-featured {
  width: 100%;
  margin: 0 auto 65px;
  overflow: hidden;
  border-radius: 32px;
  background: var(--ok-offwhite);
}

.ok-single-post .ok-post-featured img {
  display: block;
  width: 100%;
  max-height: 620px;
  object-fit: cover;
  object-position: center;
}

.ok-single-post-content.ok-entry-content {
  width: min(100%, 820px);
  margin: 0 auto;
  padding: 0;
  color: var(--ok-text);
}

.ok-single-post-content > p,
.ok-single-post-content > ul,
.ok-single-post-content > ol,
.ok-single-post-content > blockquote {
  margin-bottom: 1.55em;
}

.ok-single-post-content h2,
.ok-single-post-content h3,
.ok-single-post-content h4 {
  margin-top: 1.35em;
}

.ok-single-post-content h2:first-child,
.ok-single-post-content h3:first-child {
  margin-top: 0;
}

.ok-single-post-content img {
  border-radius: 22px;
}

.ok-single-post-content figure,
.ok-single-post-content .wp-caption {
  max-width: 100%;
  margin: 42px 0;
}

.ok-single-post-content blockquote {
  margin-right: 0;
  margin-left: 0;
  padding: 22px 0 22px 28px;
  border-left: 3px solid var(--ok-orange);
  color: var(--ok-taupe-dark);
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.35;
}

.ok-single-post-content a:not(.ok-button):not(.vc_btn3) {
  text-decoration: underline;
  text-decoration-color: rgba(227, 144, 18, .45);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

@media (max-width: 780px) {
  .ok-single-post-body {
    padding: 40px 0 75px;
  }

  .ok-single-post .ok-post-featured {
    margin-bottom: 38px;
    border-radius: 22px;
  }

  .ok-single-post .ok-post-featured img {
    max-height: none;
  }

  .ok-single-post-content img {
    border-radius: 16px;
  }
}


/* 1.4.9 - Desktop H1 sizing: approximately 20% smaller sitewide.
   Mobile sizing remains unchanged. */
@media (min-width: 1025px) {
  h1 {
    font-size: clamp(36.8px, 3.2vw, 60.8px);
  }

  .ok-treatment-hero-copy h1 {
    font-size: clamp(33.6px, 3.2vw, 50.4px);
  }

  .ok-blog-hero h1 {
    font-size: clamp(35.2px, 3.48vw, 57.6px);
  }
}

/* --------------------------------------------------------------------------
   Desktop mega menu, gebaseerd op het klant-XD
   -------------------------------------------------------------------------- */
@media (min-width: 1441px) {
  .ok-site-header {
    overflow: visible;
  }

  /* De bestaande WP-submenu's blijven de bron voor de mega-links, maar worden
     op desktop niet als losse dropdown getoond. Mobiel gebruikt ze ongewijzigd. */
  .ok-primary-nav > .ok-menu > .menu-item-has-children > .sub-menu,
  .ok-primary-nav > ul > .menu-item-has-children > .sub-menu {
    display: none !important;
  }

  .ok-primary-nav > .ok-menu > .menu-item-has-children.is-mega-open > a,
  .ok-primary-nav > ul > .menu-item-has-children.is-mega-open > a {
    color: var(--ok-brown);
    font-weight: 600;
  }

  .ok-primary-nav > .ok-menu > .menu-item-has-children.is-mega-open > a::after,
  .ok-primary-nav > ul > .menu-item-has-children.is-mega-open > a::after {
    content: "−";
  }

  .ok-mega-menu {
    position: absolute;
    z-index: 990;
    top: 100%;
    left: 50%;
    width: 100vw;
    max-width: none;
    padding: 44px 0 48px;
    border-top: 1px solid rgba(103, 96, 90, .06);
    background: #fff;
    box-shadow: 0 26px 48px rgba(72, 64, 57, .08);
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, -5px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  }

  .ok-mega-menu:not([hidden]) {
    display: block;
  }

  .ok-mega-menu.is-open {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
  }

  .ok-mega-menu-inner {
    /* Alleen het witte vlak is full-bleed. De inhoud volgt de gewone sitecontainer. */
    width: min(calc(100% - 80px), var(--ok-container));
    max-width: var(--ok-container);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(250px, .92fr) minmax(400px, 1.38fr) minmax(275px, .92fr);
    gap: clamp(48px, 5vw, 94px);
    align-items: start;
  }

  .ok-mega-title,
  .ok-mega-contact h2 {
    margin: 0;
    color: #7d766f;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 34px;
    font-weight: 400;
    letter-spacing: -.02em;
    line-height: 1.12;
  }

  .ok-mega-rule {
    width: 100%;
    height: 1px;
    margin: 18px 0 34px;
    background: rgba(90, 84, 78, .55);
  }

  .ok-mega-link-list {
    display: grid;
    gap: 14px;
    align-content: start;
  }

  .ok-mega-link-list a {
    display: block;
    width: fit-content;
    color: #8d8781;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .035em;
    line-height: 1.35;
    text-transform: uppercase;
    transition: color .18s ease, transform .18s ease;
  }

  .ok-mega-link-list a:hover,
  .ok-mega-link-list a:focus-visible,
  .ok-mega-link-list a.is-current {
    color: var(--ok-brown);
    transform: translateX(3px);
  }

  .ok-mega-visual {
    margin: 0;
  }

  .ok-mega-visual img {
    width: 100%;
    height: 410px;
    border-radius: 28px;
    object-fit: cover;
    object-position: center;
  }

  .ok-mega-contact {
    color: #99928c;
    font-size: 14px;
    line-height: 1.85;
  }

  .ok-mega-contact p {
    margin: 0 0 30px;
  }

  .ok-mega-contact a {
    color: inherit;
  }

  .ok-mega-contact a:hover {
    color: var(--ok-brown);
  }

  .ok-mega-hours strong {
    color: #8a837d;
    font-weight: 400;
  }
}

@media (min-width: 1441px) and (max-width: 1600px) {
  .ok-mega-menu {
    padding-block: 36px 40px;
  }

  .ok-mega-menu-inner {
    grid-template-columns: minmax(220px, .85fr) minmax(350px, 1.25fr) minmax(245px, .85fr);
    gap: 42px;
  }

  .ok-mega-title,
  .ok-mega-contact h2 {
    font-size: 30px;
  }

  .ok-mega-visual img {
    height: 350px;
  }

  .ok-mega-link-list {
    gap: 11px;
  }

  .ok-mega-link-list a {
    font-size: 14px;
  }
}

@media (max-width: 1440px) {
  .ok-mega-menu {
    display: none !important;
  }
}

/* 1.5.3 - Compactere desktopheader.
   Het menu sluit dichter aan op het logo en de hoofditems krijgen minder
   horizontale tussenruimte. Alleen van toepassing op de echte desktopvariant. */
@media (min-width: 1441px) {
  .ok-header-inner {
    grid-template-columns: 185px minmax(0, 1fr) auto;
    gap: 18px;
  }

  .ok-menu,
  .ok-primary-nav ul {
    gap: clamp(18px, 1.25vw, 24px);
  }
}

/* =========================================
   WPBAKERY ACCORDION - SITEBREED
   ========================================= */

.vc_tta-accordion {
    margin-top: 20px;
}

/* Alles transparant */
.vc_tta-accordion .vc_tta-panels,
.vc_tta-accordion .vc_tta-panel,
.vc_tta-accordion .vc_tta-panel-heading,
.vc_tta-accordion .vc_tta-panel-body {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Iedere accordion rij */
.vc_tta-accordion .vc_tta-panel {
    margin: 0 !important;
    border-bottom: 1px solid rgba(112, 105, 99, 0.55) !important;
}

/* Lijn boven eerste item */
.vc_tta-accordion .vc_tta-panel:first-child {
    border-top: 1px solid rgba(112, 105, 99, 0.55) !important;
}

/* Titel */
.vc_tta-accordion .vc_tta-panel-title {
    margin: 0 !important;
    font-family: inherit !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

/* Klikbare titelrij */
.vc_tta-accordion .vc_tta-panel-title > a {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    min-height: 64px;
    padding: 18px 48px 18px 0 !important;
    color: #756e68 !important;
    background: transparent !important;
}

/* Titeltekst */
.vc_tta-accordion .vc_tta-title-text {
    font-family: inherit !important;
    font-weight: 400 !important;
}

/* Standaard WPBakery icoon weg */
.vc_tta-accordion .vc_tta-controls-icon {
    display: none !important;
}

/* Eigen plus/min */
.vc_tta-accordion .vc_tta-panel-title > a::before,
.vc_tta-accordion .vc_tta-panel-title > a::after {
    content: "";
    position: absolute;
    right: 6px;
    top: 50%;
    width: 20px;
    height: 1px;
    background: #756e68;
    transform: translateY(-50%);
    transition: transform .25s ease, opacity .25s ease;
}

.vc_tta-accordion .vc_tta-panel-title > a::after {
    transform: translateY(-50%) rotate(90deg);
}

/* Open item wordt min */
.vc_tta-accordion .vc_tta-panel.vc_active .vc_tta-panel-title > a::after {
    opacity: 0;
    transform: translateY(-50%) rotate(0deg);
}

/* Inhoud */
.vc_tta-accordion .vc_tta-panel-body {
    padding: 20px 0 30px !important;
    color: #817a74 !important;
    font-size: 17px;
    line-height: 1.7;
}

/* Tekstmarges */
.vc_tta-accordion .vc_tta-panel-body p:first-child {
    margin-top: 0;
}

.vc_tta-accordion .vc_tta-panel-body p:last-child {
    margin-bottom: 0;
}

/* Hover */
.vc_tta-accordion .vc_tta-panel-title > a:hover {
    color: #4f4945 !important;
}

/* Mobiel */
@media (max-width: 767px) {

    .vc_tta-accordion .vc_tta-panel-title {
        font-size: 14px !important;
    }

    .vc_tta-accordion .vc_tta-panel-title > a {
        min-height: 58px;
        padding: 15px 40px 15px 0 !important;
    }

    .vc_tta-accordion .vc_tta-panel-title > a::before,
    .vc_tta-accordion .vc_tta-panel-title > a::after {
        width: 16px;
        right: 4px;
    }

    .vc_tta-accordion .vc_tta-panel-body {
        padding: 15px 0 24px !important;
        font-size: 16px;
    }
}

/* ============================================
   WPBAKERY TOUR / LEFT TABS - SITEBREED
   OranjeKlinieken - gebaseerd op WPBakery 9 markup
   ============================================ */

/* Tab lijst */
body .vc_tta.vc_tta-tabs-position-left .vc_tta-tabs-list {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

/* Ieder tab-item */
body .vc_tta.vc_tta-tabs-position-left .vc_tta-tab {
    margin: 0 0 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

/* WPBakery 9 zet een h4.vc_tta-panel-title tussen li en a */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab > .vc_tta-panel-title {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    box-shadow: none !important;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}

/* De daadwerkelijke klikbare tab */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab > .vc_tta-panel-title > a {
    display: block !important;
    width: 100% !important;
    padding: 16px 22px !important;

    border: 0 !important;
    border-radius: 12px !important;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    color: #817a74 !important;
    box-shadow: none !important;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    text-align: left !important;
    text-decoration: none !important;
}

/* Titelspan */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab > .vc_tta-panel-title > a .vc_tta-title-text {
    color: inherit !important;
    font-family: Montserrat, Arial, sans-serif !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}

/* Actief item: beige vlak zoals het ontwerp */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab.vc_active > .vc_tta-panel-title {
    background: #d8c7b8 !important;
    background-color: #d8c7b8 !important;
    background-image: none !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab.vc_active > .vc_tta-panel-title > a {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab.vc_active > .vc_tta-panel-title > a .vc_tta-title-text {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Inactief item: volledig transparant */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab:not(.vc_active) > .vc_tta-panel-title,
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab:not(.vc_active) > .vc_tta-panel-title > a {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* WPBakery o-fill pseudo-elementen uitschakelen */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab > .vc_tta-panel-title > a::before,
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab > .vc_tta-panel-title > a::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* Subtiele hover op inactieve tabs */
body .vc_tta.vc_tta-tabs-position-left
.vc_tta-tab:not(.vc_active) > .vc_tta-panel-title:hover {
    background: rgba(216, 199, 184, .15) !important;
}

/* Rechter content schoon */
body .vc_tta.vc_tta-tabs-position-left .vc_tta-panels,
body .vc_tta.vc_tta-tabs-position-left .vc_tta-panels-container,
body .vc_tta.vc_tta-tabs-position-left .vc_tta-panel,
body .vc_tta.vc_tta-tabs-position-left .vc_tta-panel-body {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Desktop verhouding links/rechts */
@media (min-width: 992px) {
    body .vc_tta.vc_tta-tabs-position-left > .vc_tta-tabs-container {
        width: 38% !important;
        padding-right: 42px !important;
    }

    body .vc_tta.vc_tta-tabs-position-left > .vc_tta-panels-container {
        width: 62% !important;
    }
}

/* Mobiel: WPBakery gebruikt panel-headings */
@media (max-width: 991px) {
    body .vc_tta.vc_tta-tabs-position-left .vc_tta-panel-heading {
        margin: 0 0 8px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body .vc_tta.vc_tta-tabs-position-left .vc_tta-panel-heading > a {
        background: transparent !important;
        color: #817a74 !important;
        font-family: Montserrat, Arial, sans-serif !important;
        font-weight: 400 !important;
    }

    body .vc_tta.vc_tta-tabs-position-left
    .vc_tta-panel.vc_active > .vc_tta-panel-heading {
        background: #d8c7b8 !important;
    }

    body .vc_tta.vc_tta-tabs-position-left
    .vc_tta-panel.vc_active > .vc_tta-panel-heading > a,
    body .vc_tta.vc_tta-tabs-position-left
    .vc_tta-panel.vc_active > .vc_tta-panel-heading .vc_tta-title-text {
        color: #ffffff !important;
        font-weight: 700 !important;
    }
}

/* =========================================
   CONTACT FORM 7 - ORANJEKLINIEKEN
   SITEBREED
   ========================================= */

/* Velden */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 select,
.wpcf7 textarea {
    width: 100%;
    padding: 15px 18px;
    border: 1px solid rgba(103, 96, 90, .22);
    border-radius: 10px;
    color: var(--ok-text);
    background: #fff;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    outline: none;
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.wpcf7 textarea {
    min-height: 150px;
    resize: vertical;
}

/* Focus */
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
    border-color: var(--ok-taupe);
    box-shadow: 0 0 0 3px rgba(166, 156, 147, .10);
}

/* Placeholder */
.wpcf7 ::placeholder {
    color: #aaa29c;
    opacity: 1;
}

/* Labels */
.wpcf7 label {
    display: block;
    color: var(--ok-text);
    font-size: 15px;
    font-weight: 500;
}

/* Ruimte tussen velden */
.wpcf7 p {
    margin-bottom: 20px;
}


/* =========================================
   VERZENDKNOP
   ========================================= */

.wpcf7 input[type="submit"],
.wpcf7 .wpcf7-submit {
    display: inline-flex;
    width: auto !important;
    min-width: 150px;
    min-height: 52px;

    align-items: center;
    justify-content: center;

    padding: 14px 28px !important;

    border: 1px solid var(--ok-orange) !important;
    border-radius: 12px !important;

    color: #fff !important;
    background: var(--ok-orange) !important;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    box-shadow: none !important;
    cursor: pointer;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.wpcf7 input[type="submit"]:hover,
.wpcf7 .wpcf7-submit:hover {
    color: #fff !important;
    border-color: var(--ok-orange-dark) !important;
    background: var(--ok-orange-dark) !important;
    transform: translateY(-2px);
}

.wpcf7 input[type="submit"]:disabled,
.wpcf7 .wpcf7-submit:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}


/* =========================================
   FOUTMELDING PER VELD
   ========================================= */

.wpcf7-not-valid-tip {
    display: block;
    margin-top: 7px;
    color: #a5524b !important;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 13px !important;
    font-weight: 500;
    line-height: 1.4;
}

/* Foutief veld zelf subtiel markeren */
.wpcf7 .wpcf7-not-valid {
    border-color: rgba(165, 82, 75, .65) !important;
    background-color: #fffafa !important;
}


/* =========================================
   ALGEMENE CF7 MELDING ONDER FORMULIER
   ========================================= */

.wpcf7 form .wpcf7-response-output {
    margin: 24px 0 0 !important;
    padding: 15px 18px !important;

    border: 0 !important;
    border-left: 3px solid var(--ok-taupe) !important;
    border-radius: 8px !important;

    color: var(--ok-text) !important;
    background: #f5f2ef !important;

    font-family: Montserrat, Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.55;
}

/* Fout */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    border-left-color: #a5524b !important;
    color: #8c4741 !important;
    background: #fbf3f2 !important;
}

/* Succes */
.wpcf7 form.sent .wpcf7-response-output {
    border-left-color: #718878 !important;
    color: #556c5c !important;
    background: #f1f5f2 !important;
}


/* =========================================
   LOADER
   ========================================= */

.wpcf7-spinner {
    margin: 0 0 0 12px !important;
    vertical-align: middle;
}


/* Mobiel */
@media (max-width: 767px) {

    .wpcf7 input[type="text"],
    .wpcf7 input[type="email"],
    .wpcf7 input[type="tel"],
    .wpcf7 input[type="url"],
    .wpcf7 select,
    .wpcf7 textarea {
        font-size: 16px;
    }

    .wpcf7 input[type="submit"],
    .wpcf7 .wpcf7-submit {
        width: 100% !important;
    }
}

/* =========================================
   WPBAKERY VIDEO - SITEBREED
   ========================================= */

.wpb_video_widget {
    overflow: hidden;
    border-radius: 28px;
}

.wpb_video_widget .wpb_video_wrapper {
    overflow: hidden;
    border-radius: 28px;
    background: #000;
}

/* YouTube iframe zelf */
.wpb_video_widget .wpb_video_wrapper iframe {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 28px;
}

/* Iets subtiele diepte */
.wpb_video_widget {
    box-shadow: 0 16px 45px rgba(68, 61, 55, .08);
}

/* Mobiel iets minder rond */
@media (max-width: 767px) {
    .wpb_video_widget,
    .wpb_video_widget .wpb_video_wrapper,
    .wpb_video_widget .wpb_video_wrapper iframe {
        border-radius: 20px;
    }
}

/* =========================================
   VOOR & NA TABS - KLEUREN
   ========================================= */

/* Niet actieve knoppen */
.voor-na-tabs.vc_tta.vc_tta-tabs .vc_tta-tabs-list .vc_tta-tab > a,
.voor-na-tabs.vc_tta.vc_tta-color-white.vc_tta-style-flat .vc_tta-tab > a {
    background: #ffffff !important;
    background-color: #ffffff !important;

    border: 1px solid #b7b0ab !important;
    border-radius: 7px !important;

    color: #98928e !important;
    box-shadow: none !important;
}

/* Ook tekst/span forceren */
.voor-na-tabs .vc_tta-tab > a,
.voor-na-tabs .vc_tta-tab > a span,
.voor-na-tabs .vc_tta-tab > a .vc_tta-title-text {
    color: #98928e !important;
    font-family: inherit !important;
}

/* Actieve knop */
.voor-na-tabs.vc_tta.vc_tta-tabs .vc_tta-tabs-list .vc_tta-tab.vc_active > a,
.voor-na-tabs.vc_tta.vc_tta-color-white.vc_tta-style-flat .vc_tta-tab.vc_active > a {
    background: #dacfc9 !important;
    background-color: #dacfc9 !important;

    border-color: #b9aea8 !important;
    color: #ffffff !important;

    box-shadow: none !important;
}

/* Actieve tekst */
.voor-na-tabs .vc_tta-tab.vc_active > a,
.voor-na-tabs .vc_tta-tab.vc_active > a span,
.voor-na-tabs .vc_tta-tab.vc_active > a .vc_tta-title-text {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Hover alleen op niet actieve tabs */
.voor-na-tabs .vc_tta-tab:not(.vc_active) > a:hover {
    background: #f7f4f2 !important;
    background-color: #f7f4f2 !important;
    border-color: #b7b0ab !important;
}

/* Paneel zelf transparant houden */
.voor-na-tabs .vc_tta-panels,
.voor-na-tabs .vc_tta-panel,
.voor-na-tabs .vc_tta-panel-body {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
}   

ul.vc_tta-tabs-list{
	margin: 0 0 20px !important;
}

.vc_tta-color-custom.vc_tta-style-flat .vc_tta-tab.vc_active a{
	background-color: #D1C3B5 !important;
	color: #fff !important;
}

.vc_tta.vc_tta-shape-rounded .vc_tta-tab a{
	border-radius: 12px !important;
}

.twentytwenty-wrapper{
	overflow: hidden;
	border-radius: 33px;
}

body .__fbcw__widget{
	border-radius: 12px !important;
	overflow: hidden !important;
}

/* ==========================================
   ORANJEKLINIEKEN MAILCHIMP NIEUWSBRIEF
   ========================================== */

#mc_embed_shell {
    width: 100%;
    margin: 0;
    padding: 0;
}

#mc_embed_shell #mc_embed_signup {
    width: 100% !important;
    max-width: 650px;
    margin: 0;
    padding: 0;
    background: transparent !important;
    font-family: inherit !important;
}

#mc_embed_shell #mc_embed_signup form,
#mc_embed_shell #mc_embed_signup_scroll {
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}


/* Label alleen toegankelijk houden voor screenreaders */

#mc_embed_shell .mc-field-group label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}


/* ==========================================
   EMAILVELD
   ========================================== */

#mc_embed_shell .mc-field-group {
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 0 22px !important;
    padding: 0 !important;
}

#mc_embed_shell #mce-EMAIL {
    display: block !important;
    box-sizing: border-box !important;

    width: 100% !important;
    height: 64px !important;

    margin: 0 !important;
    padding: 0 22px !important;

    background: #ffffff !important;

    border: 1px solid #b7b0ab !important;
    border-radius: 9px !important;

    color: #817b76 !important;

    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    outline: none !important;
    box-shadow: none !important;

    transition: border-color .2s ease, box-shadow .2s ease;
}

#mc_embed_shell #mce-EMAIL::placeholder {
    color: #9b9692 !important;
    opacity: 1 !important;

    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;

    text-transform: uppercase;
    letter-spacing: .02em;
}

#mc_embed_shell #mce-EMAIL:focus {
    border-color: #8f8883 !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .20) !important;
}


/* ==========================================
   VERZENDKNOP
   ========================================== */

#mc_embed_shell #mc-embedded-subscribe {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 145px !important;
    height: 52px !important;

    margin: 0 !important;
    padding: 0 25px !important;

    background: #ffb431 !important;

    border: 0 !important;
    border-radius: 9px !important;

    color: #ffffff !important;

    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    text-align: center;
    cursor: pointer;

    box-shadow: none !important;

    transition:
        background-color .2s ease,
        transform .2s ease;
}

#mc_embed_shell #mc-embedded-subscribe:hover {
    background: #f7aa26 !important;
    transform: translateY(-1px);
}

#mc_embed_shell #mc-embedded-subscribe:active {
    transform: translateY(0);
}


/* ==========================================
   MAILCHIMP RESPONSES
   ========================================== */

#mc_embed_shell #mce-responses {
    float: none !important;
    clear: both !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

#mc_embed_shell #mce-responses .response {
    float: none !important;

    box-sizing: border-box !important;
    width: 100% !important;

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

    border-radius: 8px !important;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}


/* Succesmelding */

#mc_embed_shell #mce-success-response {
    background: rgba(255, 255, 255, .75) !important;
    border: 1px solid rgba(82, 112, 87, .35) !important;
    color: #526f57 !important;
}


/* Algemene foutmelding */

#mc_embed_shell #mce-error-response {
    background: rgba(255, 255, 255, .75) !important;
    border: 1px solid rgba(143, 72, 72, .30) !important;
    color: #8f4848 !important;
}


/* Links binnen meldingen */

#mc_embed_shell #mce-responses .response a {
    color: inherit !important;
    text-decoration: underline;
}


/* ==========================================
   INLINE VALIDATIEFOUT
   ========================================== */

#mc_embed_shell #mce-EMAIL.mce_inline_error {
    border-color: #a95f5f !important;
    background: #ffffff !important;
}

#mc_embed_shell div.mce_inline_error {
    width: 100% !important;

    margin: 7px 0 0 !important;
    padding: 0 !important;

    background: transparent !important;

    color: #8f4848 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}


/* Mailchimp helperteksten verwijderen */

#mc_embed_shell .helper_text,
#mc_embed_shell .indicates-required,
#mc_embed_shell .asterisk {
    display: none !important;
}


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

@media (max-width: 767px) {

    #mc_embed_shell #mc_embed_signup {
        max-width: 100%;
    }

    #mc_embed_shell #mce-EMAIL {
        height: 58px !important;
        padding: 0 18px !important;
        font-size: 14px !important;
        border-radius: 8px !important;
    }

    #mc_embed_shell #mce-EMAIL::placeholder {
        font-size: 14px !important;
    }

    #mc_embed_shell #mc-embedded-subscribe {
        width: auto !important;
        min-width: 135px !important;
        height: 50px !important;
        padding: 0 22px !important;
        border-radius: 8px !important;
        font-size: 14px !important;
    }

}
/* =========================================================
   Footer - final XD match
   Alleen footer styling. Achtergrond loopt browserbreed door,
   inhoud staat bewust in een smallere gecentreerde container.
   ========================================================= */

.ok-site-footer {
  position: relative;
  padding: 62px 0 24px;
  color: #fff;
  background: #6c6762;
}

.ok-footer-content {
  width: min(calc(100% - 40px), 960px);
  margin: 0 auto;
}

.ok-footer-logo {
  display: block;
  width: 210px;
  margin: 0 auto 54px;
}

.ok-footer-logo img {
  display: block;
  width: 100%;
  height: auto;
}

.ok-footer-grid {
  display: grid;
  grid-template-columns: 1.08fr 1.18fr .9fr;
  gap: 74px;
  align-items: start;
}

.ok-site-footer .ok-footer-column h2 {
  margin: 0 0 15px;
  color: #fff;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 27px;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

.ok-site-footer p,
.ok-site-footer li,
.ok-site-footer a,
.ok-site-footer span {
  color: rgba(255,255,255,.94);
}

.ok-site-footer a {
  transition: opacity .18s ease;
}

.ok-site-footer a:hover {
  color: #fff;
  opacity: .72;
}

.ok-footer-contact-row {
  display: grid;
  grid-template-columns: 22px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  margin: 0 0 11px;
}

.ok-footer-contact-row svg {
  width: 19px;
  height: 19px;
  margin-top: 3px;
  overflow: visible;
  fill: none;
  stroke: #fff;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ok-footer-contact-row p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.72;
  letter-spacing: .055em;
}

.ok-footer-contact-row p span {
  white-space: nowrap;
}

.ok-footer-socials {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 25px;
}

.ok-footer-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
}

.ok-footer-socials svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ok-footer-socials .ok-footer-icon-fill {
  fill: #fff;
  stroke: none;
}

.ok-footer-hours-list {
  display: grid;
  gap: 2px;
}

.ok-footer-hours-row {
  display: grid;
  grid-template-columns: 105px minmax(0,1fr);
  gap: 14px;
  font-size: 13.5px;
  line-height: 1.55;
  letter-spacing: .055em;
}

.ok-footer-hours-row span:last-child {
  white-space: nowrap;
}

.ok-footer-hours-row .ok-footer-closed {
  text-transform: uppercase;
}

.ok-footer-phone-hours {
  display: grid;
  gap: 2px;
  margin-top: 31px;
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: .055em;
}

.ok-footer-phone-hours strong {
  margin-bottom: 2px;
  color: #fff;
  font-weight: 400;
}

.ok-site-footer .ok-footer-extra ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ok-site-footer .ok-footer-extra li {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.68;
  letter-spacing: .055em;
}

.ok-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 17px;
  margin: 59px 0 0;
  padding: 0;
  border: 0;
  font-size: 9px;
  line-height: 1;
  letter-spacing: .025em;
  text-transform: uppercase;
}

.ok-footer-bottom-separator {
  width: 1px;
  height: 15px;
  background: rgba(255,255,255,.72);
}

.ok-footer-to-top {
  position: absolute;
  right: 28px;
  bottom: 27px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(255,255,255,.9);
  color: #fff;
}

.ok-footer-to-top svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

.ok-footer-to-top:hover {
  color: #fff;
  opacity: 1;
  background: rgba(255,255,255,.08);
}

@media (max-width: 980px) {
  .ok-site-footer {
    padding-top: 55px;
  }

  .ok-footer-content {
    width: min(calc(100% - 50px), 760px);
  }

  .ok-footer-logo {
    margin-bottom: 46px;
  }

  .ok-footer-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 48px 60px;
  }

  .ok-footer-extra {
    grid-column: 1 / -1;
  }

  .ok-footer-extra ul {
    columns: 2;
    column-gap: 60px;
  }
}

@media (max-width: 680px) {
  .ok-site-footer {
    padding: 48px 0 82px;
  }

  .ok-footer-content {
    width: min(calc(100% - 40px), 440px);
  }

  .ok-footer-logo {
    width: 185px;
    margin-bottom: 42px;
  }

  .ok-footer-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .ok-footer-extra {
    grid-column: auto;
  }

  .ok-footer-extra ul {
    columns: 1;
  }

  .ok-site-footer .ok-footer-column h2 {
    font-size: 25px;
  }

  .ok-footer-contact-row p,
  .ok-footer-hours-row,
  .ok-site-footer .ok-footer-extra li {
    font-size: 13px;
  }

  .ok-footer-hours-row {
    grid-template-columns: 96px minmax(0,1fr);
    gap: 12px;
  }

  .ok-footer-phone-hours {
    font-size: 12.5px;
  }

  .ok-footer-bottom {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 13px;
    margin-top: 48px;
    text-align: center;
    font-size: 8px;
    line-height: 1.4;
  }

  .ok-footer-bottom-separator {
    height: 12px;
  }

  .ok-footer-to-top {
    right: 15px;
    bottom: 18px;
    width: 42px;
    height: 42px;
  }
}

/* =========================================
   WPBAKERY QUOTES
   ========================================= */

.wpb_text_column blockquote {
    position: relative;
    max-width: 1120px;
    margin: 0 auto 45px !important;
    padding: 0 65px !important;

    border: 0 !important;
    background: transparent !important;

    color: #aaa29b;

   font-family: "Playfair Display", Georgia, serif !important;
    font-size: 31px;
    line-height: 1.65;
    font-weight: 400;
    font-style: italic;

    text-align: center;
}


.wpb_text_column blockquote p{
	 font-family: "Playfair Display", Georgia, serif !important;
}

/* Openingsquote */

.wpb_text_column blockquote::before {
    content: "“";
    position: absolute;

    top: -45px;
    left: 0;

    color: #ffae2c;

    font-family: Georgia, serif;
    font-size: 82px;
    line-height: 1;
    font-style: normal;
}


/* Sluitingsquote */

.wpb_text_column blockquote::after {
    content: "”";
    position: absolute;

    right: 0;
    bottom: -55px;

    color: #ffae2c;

    font-family: Georgia, serif;
    font-size: 82px;
    line-height: 1;
    font-style: normal;
}


/* Aldus */

.wpb_text_column .quote-author-label {
    margin: 0 0 4px !important;

    color: #aaa29b;

    font-size: 14px;
    line-height: 1.3;
    font-weight: 400;
    font-style: italic;
    text-align: center;
    text-transform: uppercase;
}


/* Naam */

.wpb_text_column .quote-author {
    margin: 0 !important;

    color: #8f8882;

    font-size: 36px;
    line-height: 1.2;
    font-weight: 400;
    text-align: center;
}


/* Tablet */

@media (max-width: 1024px) {

    .wpb_text_column blockquote {
        padding: 0 50px !important;
        font-size: 27px;
    }

    .wpb_text_column .quote-author {
        font-size: 32px;
    }

}


/* Mobiel */

@media (max-width: 767px) {

    .wpb_text_column blockquote {
        margin-bottom: 35px !important;
        padding: 0 25px !important;

        font-size: 22px;
        line-height: 1.55;
        font-family: "Playfair Display", Georgia, serif !important;
    }

    .wpb_text_column blockquote::before {
        top: -30px;
        left: -5px;
        font-size: 55px;
    }

    .wpb_text_column blockquote::after {
        right: -5px;
        bottom: -40px;
        font-size: 55px;
    }

    .wpb_text_column .quote-author-label {
        font-size: 12px;
    }

    .wpb_text_column .quote-author {
        font-size: 28px;
    }

}
/* ==========================================================
   v1.6.1 Indication pages
   Same editable full-width hero presentation as treatments.
   ========================================================== */

body.single-ok_indicatie .ok-site-main {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

body.single-ok_indicatie .ok-indication-single {
  width: 100%;
  max-width: none;
  margin: 0;
}

body.single-ok_indicatie .ok-indication-hero {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

body.single-ok_indicatie .ok-indication-hero > .ok-treatment-hero-grid {
  width: min(calc(100% - (var(--ok-main-gutter) * 2)), var(--ok-main-max-width));
  max-width: var(--ok-main-max-width);
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

body.single-ok_indicatie .ok-indication-builder-content {
  width: calc(100% - (var(--ok-main-gutter) * 2));
  max-width: var(--ok-main-max-width);
  margin-right: auto;
  margin-left: auto;
  padding-top: 0;
  padding-bottom: 0;
  overflow: visible;
}

body.single-ok_indicatie .ok-indication-builder-content > .entry-content {
  width: 100%;
  max-width: none;
  padding-top: 0;
  padding-bottom: 0;
}

body.single-ok_indicatie .ok-indication-builder-content .vc_row:not([data-vc-full-width="true"]),
body.single-ok_indicatie .ok-indication-builder-content .vc_section:not([data-vc-full-width="true"]) {
  left: auto !important;
  width: auto !important;
  max-width: 100% !important;
  transform: none !important;
}

/* The fallback indication model is a cut-out portrait. Keep it prominent on
   desktop, just like the treatment hero, without changing treatment pages. */
@media (min-width: 1025px) {
  body.single-ok_indicatie .ok-indication-hero-model {
    right: max(40px, calc((100vw - var(--ok-container)) / 2));
    left: auto;
    width: min(42vw, 720px);
    height: 100%;
  }

  body.single-ok_indicatie .ok-indication-hero-model img {
    object-fit: contain;
  }
}

@media (max-width: 680px) {
  body.single-ok_indicatie .ok-indication-hero > .ok-treatment-hero-grid {
    width: calc(100% - (var(--ok-main-gutter) * 2));
  }
}

@media (min-width: 1025px) {
  body.single-ok_indicatie .ok-indication-hero-model.is-default-model img {
    transform: scaleX(-1);
    transform-origin: center center;
  }
}

/* =========================================
   WPBAKERY ACCORDION - WITTE VARIANT
   Gebruik op row: white-content
   ========================================= */

.white-content .vc_tta,
.white-content .vc_tta-panels-container,
.white-content .vc_tta-panels,
.white-content .vc_tta-panel,
.white-content .vc_tta-panel-body {
    background: transparent !important;
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    box-shadow: none !important;
}


/* Accordion titelbalk */

.white-content .vc_tta-panel-heading {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.55) !important;
    border-radius: 0 !important;
}


/* Titel */

.white-content .vc_tta-panel-title > a,
.white-content .vc_tta-panel-title > a:hover,
.white-content .vc_tta-panel.vc_active .vc_tta-panel-title > a {
    color: #ffffff !important;
    background: transparent !important;
}


/* Plus / min icoon */

.white-content .vc_tta-controls-icon::before,
.white-content .vc_tta-controls-icon::after {
    border-color: #ffffff !important;
}


/* Content */

.white-content .vc_tta-panel-body,
.white-content .vc_tta-panel-body p,
.white-content .vc_tta-panel-body li,
.white-content .vc_tta-panel-body strong,
.white-content .vc_tta-panel-body em,
.white-content .vc_tta-panel-body h2,
.white-content .vc_tta-panel-body h3,
.white-content .vc_tta-panel-body h4 {
    color: #ffffff !important;
}


/* Links in content */

.white-content .vc_tta-panel-body a {
    color: #ffffff !important;
    text-decoration: underline;
}


/* Geen beige actieve achtergrond */

.white-content .vc_tta-panel.vc_active .vc_tta-panel-heading,
.white-content .vc_tta-panel-heading:hover {
    background: transparent !important;
    background-color: transparent !important;
}

/* =========================================
   WHITE CONTENT ACCORDION - HARD OVERRIDE
   ========================================= */

/* Alle accordion lijnen wit */
.white-content .vc_tta-panel-heading,
.white-content .vc_tta-panel.vc_active .vc_tta-panel-heading,
.white-content .vc_tta-panel-heading:hover {
    border-color: rgba(255, 255, 255, 0.65) !important;
}

/* Lijn onder iedere accordion */
.white-content .vc_tta-panel {
    border-color: rgba(255, 255, 255, 0.65) !important;
}

.white-content .vc_tta-panel-heading {
    border-bottom: 1px solid rgba(255, 255, 255, 0.65) !important;
}

/* Plus en min volledig wit */
.white-content .vc_tta-controls-icon,
.white-content .vc_tta-controls-icon::before,
.white-content .vc_tta-controls-icon::after {
    border-color: #ffffff !important;
    color: #ffffff !important;
}

/* WPBakery gebruikt soms borders om het plusje te tekenen */
.white-content .vc_tta-controls-icon-plus::before,
.white-content .vc_tta-controls-icon-plus::after {
    border-color: #ffffff !important;
}

/* Min bij actieve accordion */
.white-content .vc_tta-panel.vc_active .vc_tta-controls-icon::before,
.white-content .vc_tta-panel.vc_active .vc_tta-controls-icon::after {
    border-color: #ffffff !important;
}

/* Titelbalk volledig transparant */
.white-content .vc_tta-panel-title > a,
.white-content .vc_tta-panel-title > a:hover,
.white-content .vc_tta-panel.vc_active .vc_tta-panel-title > a {
    background: transparent !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

/* Content zonder bruine randjes */
.white-content .vc_tta-panel-body {
    border-color: rgba(255, 255, 255, 0.65) !important;
    background: transparent !important;
}

/* Eventuele WPBakery lijnen in pseudo-elements */
.white-content .vc_tta-panel-heading::before,
.white-content .vc_tta-panel-heading::after,
.white-content .vc_tta-panel-body::before,
.white-content .vc_tta-panel-body::after {
    border-color: #ffffff !important;
}

.white-content .vc_tta-accordion .vc_tta-panel-title > a::before,
.white-content .vc_tta-accordion .vc_tta-panel-title > a::after {
    color: #fff !important;
    background-color: #fff !important;
    border-color: #fff !important;
}

/* WPBakery responsive visibility fix */

@media (max-width: 767px) {
    .vc_hidden-xs {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .vc_hidden-sm {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .vc_hidden-md {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .vc_hidden-lg {
        display: none !important;
    }
}