/* d-lep Kernwaarden 1.0.0. All layout/typography is scoped to this component. */
.dlep-kw,
.dlep-kw * { box-sizing: border-box; }
.dlep-kw {
  --dlep-kw-ink: #20372c;
  --dlep-kw-green: #153c2b;
  --dlep-kw-muted: #58685c;
  --dlep-kw-panel: #f0f4ee;
  --dlep-kw-line: #e2e9df;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  color: var(--dlep-kw-ink);
  background: transparent;
  font-family: "Avenir Next", "Segoe UI", Arial, sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  container-type: inline-size;
  container-name: dlep-kernwaarden;
}
.dlep-kw :is(h1, h2, h3, p, figure) { margin: 0; padding: 0; }
.dlep-kw img { display: block; border: 0; border-radius: 0; box-shadow: none; }
.dlep-kw__hero {
  position: relative;
  isolation: isolate;
  width: 100%;
  min-height: var(--dlep-kw-hero-height, 340px);
  margin: 0;
  padding: 0;
  overflow: visible;
  background: transparent;
}
/* Only this layer extends to the viewport. JS uses clientWidth, excluding scrollbars. */
.dlep-kw__hero-media {
  position: absolute;
  inset: 0 auto 0 0;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
  background: #eaf0e6;
}
.dlep-kw .dlep-kw__hero-img {
  position: absolute;
  top: 0;
  right: 0;
  width: 78%;
  max-width: none;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.dlep-kw__hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #f1f5ed 0%, #f1f5ed 18%, rgba(241,245,237,.94) 29%, rgba(241,245,237,.67) 43%, rgba(241,245,237,.12) 66%, rgba(241,245,237,0) 84%);
}
.dlep-kw__hero-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  max-width: 1260px;
  min-height: var(--dlep-kw-hero-height, 340px);
  margin: 0 auto;
  padding: 42px 0;
}
.dlep-kw .dlep-kw__eyebrow {
  color: var(--dlep-kw-green);
  font-family: "Avenir Next", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  line-height: 1.5;
  font-weight: 600;
  letter-spacing: .21em;
  text-transform: uppercase;
}
.dlep-kw .dlep-kw__hero-title {
  max-width: min(650px, 75%);
  margin: 16px 0 0;
  color: var(--dlep-kw-green);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(42px, 4.3vw, 66px);
  line-height: 1.06;
  letter-spacing: -.035em;
  overflow-wrap: break-word;
  text-wrap: balance;
}
.dlep-kw__hero-title > span,
.dlep-kw__hero-title > strong { display: block; }
.dlep-kw__hero-title > strong {
  margin-top: 6px;
  font: inherit;
  font-size: 1.16em;
  letter-spacing: -.04em;
}
.dlep-kw .dlep-kw__hero-subtitle {
  max-width: 440px;
  margin: 18px 0 0;
  color: var(--dlep-kw-ink);
  font-size: 16px;
  line-height: 1.55;
}
.dlep-kw__content {
  width: 100%;
  max-width: 1260px;
  margin: 0 auto;
  padding: 46px 0 64px;
}
.dlep-kw__intro {
  max-width: 650px;
  margin: 0 auto 34px;
  padding: 0 16px;
  text-align: center;
}
.dlep-kw .dlep-kw__section-title {
  margin: 8px 0 12px;
  color: var(--dlep-kw-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(32px, 3vw, 44px);
  line-height: 1.14;
  letter-spacing: -.025em;
  font-weight: 400;
}
.dlep-kw__intro-text { font-size: 14.5px; line-height: 1.7; color: var(--dlep-kw-muted); }
.dlep-kw__intro-text p + p { margin-top: 12px; }
.dlep-kw__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}
.dlep-kw__card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.dlep-kw__photo,
.dlep-kw__copy { min-width: 0; border-radius: 10px; }
.dlep-kw__photo {
  position: relative;
  min-height: 286px;
  overflow: hidden;
  background: #e5ece1;
}
.dlep-kw .dlep-kw__photo-img {
  position: absolute;
  width: 100%;
  max-width: none;
  height: 100%;
  inset: 0;
  object-fit: cover;
  object-position: center;
}
.dlep-kw__photo-placeholder { display: block; width: 100%; height: 100%; background: linear-gradient(140deg, #e3ecdd, #f4f7ef); }
.dlep-kw__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(20px, 2vw, 29px);
  background: var(--dlep-kw-panel);
  border: 1px solid rgba(21,60,43,.025);
  transition: background-color .22s ease, border-color .22s ease;
}
.dlep-kw__card:nth-child(4n+3) .dlep-kw__photo,
.dlep-kw__card:nth-child(4n+4) .dlep-kw__photo { grid-column: 2; grid-row: 1; }
.dlep-kw__card:nth-child(4n+3) .dlep-kw__copy,
.dlep-kw__card:nth-child(4n+4) .dlep-kw__copy { grid-column: 1; grid-row: 1; }
.dlep-kw .dlep-kw__value-title {
  margin: 13px 0 9px;
  color: var(--dlep-kw-green);
  font-family: "Avenir Next", "Segoe UI", Arial, sans-serif;
  font-size: 19px;
  line-height: 1.28;
  font-weight: 600;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
}
.dlep-kw__value-text {
  color: var(--dlep-kw-ink);
  font-size: 14.5px;
  line-height: 1.65;
  letter-spacing: .005em;
  overflow-wrap: anywhere;
}
.dlep-kw__value-text p + p { margin-top: 12px; }
.dlep-kw__icon {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--dlep-kw-green);
}
.dlep-kw__svg { width: 36px; height: 36px; overflow: visible; }
.dlep-kw__icon-motion { transform-box: fill-box; transform-origin: center; }
.dlep-kw[data-animate="yes"] .dlep-kw__play .dlep-kw__icon-motion > * {
  animation: dlep-kw-draw 900ms ease both;
}
.dlep-kw[data-animate="yes"] .dlep-kw__play .dlep-kw__icon-motion {
  animation: dlep-kw-lift 1350ms ease both;
}
.dlep-kw[data-animate="yes"] .dlep-kw__play :is(.dlep-kw__icon--heart, .dlep-kw__icon--target, .dlep-kw__icon--senses) .dlep-kw__icon-motion {
  animation-name: dlep-kw-heartbeat;
}
.dlep-kw[data-animate="yes"] .dlep-kw__play :is(.dlep-kw__icon--leaf, .dlep-kw__icon--balance, .dlep-kw__icon--diamond) .dlep-kw__icon-motion {
  animation-name: dlep-kw-sway;
}
@keyframes dlep-kw-draw {
  from { stroke-dasharray: 100; stroke-dashoffset: 100; }
  to { stroke-dasharray: 100; stroke-dashoffset: 0; }
}
@keyframes dlep-kw-heartbeat {
  0%, 100% { transform: scale(1); }
  28% { transform: scale(1.09); }
  42% { transform: scale(1); }
  58% { transform: scale(1.055); }
}
@keyframes dlep-kw-sway {
  0%, 100% { transform: rotate(0); }
  30% { transform: rotate(-7deg); }
  62% { transform: rotate(4deg); }
}
@keyframes dlep-kw-lift {
  0%, 100% { transform: translateY(0); }
  40% { transform: translateY(-3px); }
}
@media (hover: hover) {
  .dlep-kw__card:hover .dlep-kw__copy { background: #eaf0e6; border-color: #d9e4d4; }
}
/* Only the builder ancestors that physically clip this hero receive this class. */
.dlep-kw-allow-overflow { overflow: visible !important; }
/* Container queries also cover narrow WPBakery columns on wide desktop screens. */
@container dlep-kernwaarden (max-width: 970px) {
  .dlep-kw__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .dlep-kw__card { grid-template-columns: .9fr 1.1fr; }
  .dlep-kw__card:nth-child(n) .dlep-kw__photo { grid-column: 1; grid-row: 1; }
  .dlep-kw__card:nth-child(n) .dlep-kw__copy { grid-column: 2; grid-row: 1; }
  .dlep-kw__card:nth-child(even) .dlep-kw__photo { grid-column: 2; }
  .dlep-kw__card:nth-child(even) .dlep-kw__copy { grid-column: 1; }
  .dlep-kw__copy { padding: 30px; }
  .dlep-kw__photo { min-height: 270px; }
  .dlep-kw__value-text { font-size: 15px; }
}
@container dlep-kernwaarden (max-width: 540px) {
  .dlep-kw__card { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .dlep-kw__card:nth-child(n) .dlep-kw__photo { grid-column: 1; grid-row: 1; min-height: 0; height: 195px; border-radius: 10px 10px 0 0; }
  .dlep-kw__card:nth-child(n) .dlep-kw__copy { grid-column: 1; grid-row: 2; border-radius: 0 0 10px 10px; padding: 24px; }
  .dlep-kw__hero-inner { min-height: 280px; padding: 36px 0; }
  .dlep-kw__hero { min-height: 280px; }
  .dlep-kw .dlep-kw__hero-title { max-width: 100%; font-size: clamp(34px, 9cqw, 48px); }
  .dlep-kw__hero-subtitle { max-width: 100%; }
  .dlep-kw__hero-shade { background: linear-gradient(90deg, rgba(241,245,237,.96) 0%, rgba(241,245,237,.91) 40%, rgba(241,245,237,.66) 100%); }
  .dlep-kw__content { padding: 32px 0 40px; }
  .dlep-kw__intro { margin-bottom: 24px; padding: 0 4px; }
}
/* Responsive fallback for browsers without container queries. */
@supports not (container-type: inline-size) {
  @media (max-width: 1000px) {
    .dlep-kw__grid { grid-template-columns: minmax(0, 1fr); }
  }
  @media (max-width: 600px) {
    .dlep-kw__card { display: flex; flex-direction: column; gap: 0; }
    .dlep-kw__photo { min-height: 195px; border-radius: 10px 10px 0 0; }
    .dlep-kw__copy { border-radius: 0 0 10px 10px; padding: 24px; }
    .dlep-kw__hero, .dlep-kw__hero-inner { min-height: 280px; }
    .dlep-kw .dlep-kw__hero-title { max-width: 100%; font-size: 40px; }
  }
}
@media (prefers-reduced-motion: reduce) {
  .dlep-kw .dlep-kw__icon-motion,
  .dlep-kw .dlep-kw__icon-motion > * { animation: none !important; transform: none !important; }
  .dlep-kw .dlep-kw__copy { transition: none !important; }
}
@media print {
  .dlep-kw__hero-media { display: none; }
  .dlep-kw__hero, .dlep-kw__hero-inner { min-height: 0; }
  .dlep-kw__hero-inner { padding: 12px 0; }
  .dlep-kw__grid { display: block; }
  .dlep-kw__card { break-inside: avoid; margin-bottom: 12px; }
  .dlep-kw__icon-motion, .dlep-kw__icon-motion > * { animation: none !important; }
}