/* AANGEPAST VOOR KLUBB — de aangeleverde handoff gebruikte eigen grenzen op
   1360, 1100 en 760. De gedeelde laag van Klubb schrijft 375 / 768 / 1024 /
   1440 voor, en de regel daar is: past een component niet binnen een grens,
   pas dan de component aan en niet de grens. De media queries hieronder zijn
   daarom omgezet naar max-width 1439 / 1023 / 767, wat de bovenkant is van
   diezelfde vier stappen. Verder is er niets aan deze stylesheet veranderd.
   ------------------------------------------------------------------------ */

/* ==========================================================================
   Mobile drawer — appended to homepage.css
   The nav collapses below 1100px; the drawer reuses the nav's items at
   56px rows with a full-width intake button at the bottom.
   ========================================================================== */

.vc-drawer {
  display: none;
}

@media (max-width: 1023px) {
  .vc-drawer {
    display: block;
    background: var(--surface-page);
    border-top: 1px solid var(--border-hairline);
    padding: 8px var(--container-pad) 24px;
    max-height: calc(100dvh - var(--header-h-scrolled));
    overflow-y: auto;
  }

  .vc-drawer__link {
    display: flex;
    align-items: center;
    min-height: 56px;
    font-family: var(--font-display);
    font-size: 21px;
    line-height: 1.3;
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-subtle);
  }

  .vc-drawer__sub {
    display: flex;
    flex-direction: column;
    padding: 8px 0 8px 20px;
    border-bottom: 1px solid var(--border-subtle);
  }

  .vc-drawer__sublink {
    display: flex;
    align-items: center;
    min-height: 44px;
    font-size: var(--size-body-s);
    line-height: 1.4;
    color: var(--text-secondary);
    border-bottom: none;
  }

  .vc-drawer__cta {
    padding-top: 24px;
  }
}