@media (prefers-color-scheme: dark) {
  html, body, .sc-host { background: #ffffff !important; color: #1a1a1a !important; }
  .client-logo img {
    filter: brightness(0) saturate(100%) invert(24%) sepia(98%) saturate(7474%) hue-rotate(318deg) brightness(104%) contrast(103%) !important;
  }
}
@media (max-width: 699px) {
  html {
    scrollbar-gutter: auto;
    scrollbar-width: none;
  }
  ::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  html,
  body,
  #tienvoud-site,
  .sc-host {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }
  .tienvoud-brand-navigation {
    padding-left: 16px !important;
    padding-right: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 0 rgba(255,31,169,.12);
  }
  .tienvoud-brand-navigation > a { font-size: 26px !important; }
  .tienvoud-audience-control { left: auto !important; right: 16px !important; padding-left: 16px !important; padding-right: 0 !important; }
  .audience-toggle { font-size: 13px !important; }
  .section-links {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px !important;
    padding: 0 8px !important;
    overflow: hidden !important;
  }
  .section-links a {
    min-width: 0;
    white-space: normal !important;
    font-size: clamp(11px, 3.2vw, 13px) !important;
    line-height: 1.05;
    text-align: center;
    text-wrap: balance;
  }
  .section-label-desktop { display: none; }
  .section-label-mobile { display: inline; }
  .client-logo-track { gap: 24px !important; padding-right: 24px !important; }
  .client-logo { width: 144px; min-width: 144px; max-width: 144px; }
  .tienvoud-impact-copy,
  .tienvoud-school-slogan {
    display: block;
    max-width: calc(100vw - 72px);
    font-size: clamp(19px, 5.5vw, 24px);
    white-space: normal;
    line-height: 1.18;
  }
  .tienvoud-slogan::before { inset: -24px -30px; }
  [data-sparren="true"] { z-index: 3; }
  #wat-we-doen,
  #wie-we-zijn,
  #contact { padding-left: 16px !important; padding-right: 16px !important; }
  #wat-we-doen > h2,
  #wie-we-zijn > h2,
  #contact > h2 {
    font-size: clamp(27px, 8vw, 34px) !important;
    line-height: 1.08;
  }
  #wat-we-doen > div:nth-of-type(1) { gap: 16px !important; }
  #wat-we-doen > div:nth-of-type(1) > div { padding: 20px !important; }
  #wie-we-zijn > div:nth-of-type(1) { gap: 18px !important; }
  .tienvoud-team-card { box-shadow: 5px 5px 0 rgba(255,31,169,.18) !important; }
  .tienvoud-choice-content { gap: 28px; }
  .tienvoud-choice-actions { flex-direction: column; width: min(420px, calc(100vw - 40px)); gap: 14px; }
  .tienvoud-choice-button { min-height: 60px; padding: 14px 20px; }
  .cursor-grid-aura { display: none !important; }
}
@media (hover: none), (pointer: coarse) {
  .cursor-grid-aura { display: none !important; }
  .audience-toggle:hover { color: #ff1fa9 !important; }
}
@media (prefers-reduced-motion: reduce) {
  .audience-chevron, .audience-options, .tienvoud-graph-top-extension path, .tienvoud-graph-top-explosion > span, .tienvoud-choice-squares span, .minimum-loader-cube { animation: none !important; transition: none !important; }
}