/* ==========================================================================
   Werkwijze — page-specific styles
   ========================================================================== */

/* ---- Page overrides: force header elements visible (no scroll animation) ---- */
.page--werkwijze .header__logo-text {
  opacity: 1;
}

.page--werkwijze .header__lang-icon {
  opacity: 1;
}

/* Footer info bar: blue-100 bg on werkwijze (white on landing) */
.page--werkwijze .footer__info {
  background: var(--blue-100);
}

/* ---- Section label: match Figma spec on werkwijze ---- */
.page--werkwijze .section-label {
  gap: 8px;
  align-items: center;
}

.page--werkwijze .section-label__bracket {
  align-self: stretch;
  width: 11px;
}

.page--werkwijze .section-label__bracket--open {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding-top: 10px;
}

.page--werkwijze .section-label__bracket--close {
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 10px;
}

.page--werkwijze .section-label__bracket-char {
  line-height: 1.2;
}

.page--werkwijze .section-label__text {
  padding: 10px 0;
}

/* ---- Werkwijze content wrapper ---- */
.werkwijze {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}

/* ---- Werkwijze body (main content area) ---- */
.werkwijze__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 80px;
  padding-top: 56px;
  padding-bottom: 120px;
  width: 100%;
}

/* ---- Breadcrumb ---- */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 2px;
}

.breadcrumb__icon {
  width: 24px;
  height: 24px;
}

.breadcrumb__text {
  font-family: var(--font-primary);
  font-weight: var(--fw-semibold);
  font-size: 1.125rem; /* 18px */
  line-height: 1.4;
  color: var(--green-1200);
  white-space: nowrap;
}

/* ---- Werkwijze Hero ---- */
.werkwijze-hero {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: flex-start;
  padding: 0 var(--page-padding-x);
  width: 100%;
}

.werkwijze-hero__content {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.werkwijze-hero__title {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 6rem; /* 96px */
  line-height: 1.05;
  letter-spacing: -2.88px;
  color: var(--green-1200);
  max-width: 1178px;
}

.werkwijze-hero__subtitle {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
  font-size: 2.375rem; /* 38px */
  line-height: 1.2;
  letter-spacing: -0.76px;
  color: var(--green-1200);
  max-width: 1059px;
}

/* ---- Werkwijze Photos ---- */
.werkwijze-photos {
  display: flex;
  gap: 10px;
  width: 100%;
  padding: 0 var(--page-padding-x);
  justify-content: center;
  align-items: flex-start;
}

.werkwijze-photos__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 0 0 718px;
  min-width: 0;
}

.werkwijze-photos__item:last-child {
  flex: 0 0 679px;
}

.werkwijze-photos__image {
  height: 573px;
  border-radius: var(--radius-card);
  overflow: hidden;
}

.werkwijze-photos__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.werkwijze-photos__caption {
  display: flex;
  gap: 4px;
  align-items: flex-end;
}

.werkwijze-photos__arrow {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  transform: rotate(180deg);
}

.werkwijze-photos__caption span {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
  font-size: 0.9375rem; /* 15px */
  line-height: 1.1;
  letter-spacing: 0.3px;
  color: var(--green-1200);
  white-space: nowrap;
}

/* ---- Voor wie wij werken ---- */
.werkwijze-clients {
  width: 100%;
}

.werkwijze-clients__inner {
  background: var(--blue-100);
  padding: 120px;
  width: 100%;
}

.werkwijze-clients__layout {
  display: flex;
  gap: 21px;
  align-items: flex-start;
  width: 100%;
}

.werkwijze-clients__label {
  width: 339px;
  flex-shrink: 0;
}

.werkwijze-clients__content {
  display: flex;
  flex-direction: column;
  gap: 78px;
  align-items: flex-start;
  flex: 1 1 0;
  min-width: 0;
}

.werkwijze-clients__text {
  font-family: var(--font-primary);
  font-weight: var(--fw-regular);
  font-size: 1.875rem; /* 30px */
  line-height: 1.25;
  letter-spacing: -0.45px;
  color: var(--green-1200);
  padding-right: 120px;
  max-width: 938px;
}

.werkwijze-clients__logos {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  padding-right: 120px;
}

.werkwijze-clients__logo-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 177.519px;
  height: 84.948px;
  background: var(--base-100);
  overflow: hidden;
  padding: 1px;
}

.werkwijze-clients__logo-box img {
  max-width: 80%;
  max-height: 70%;
  object-fit: contain;
}