/* Shared Marketingbende surfaces; existing page containers and forms stay intact. */
.mb-elementor-page main .mb-brand-hero {
  width: 100vw !important;
  max-width: none;
  margin: 0 calc(50% - 50vw) !important;
  padding: calc(var(--mb-header-height, 92px) + 64px) 48px 72px !important;
  height: auto !important;
  min-height: 0 !important;
  background: #202020 !important;
  color: #fff;
  overflow: clip;
  isolation: isolate;
}
.mb-elementor-page main .mb-brand-hero > .elementor-background-overlay { display: none; }
.mb-elementor-page main .mb-brand-hero > .elementor-container { max-width: 1280px; width: 100%; min-height: 0 !important; margin-inline: auto; }
.mb-elementor-page main .mb-brand-hero .mb-brand-copy > .elementor-widget-wrap { padding: 0 !important; display: flex !important; flex-direction: column; gap: 25px; align-content: stretch; }
.mb-elementor-page main .mb-brand-hero .mb-brand-copy .elementor-widget { margin: 0; width: 100%; }
.mb-elementor-page main .mb-brand-hero :is(h1, h1.elementor-heading-title) { color: #fff; font-size: clamp(44px, 5.5vw, 76px); font-weight: 700; line-height: 1.04; letter-spacing: -.04em; max-width: 16ch; margin: 0; text-wrap: balance; overflow-wrap: anywhere; }
.mb-elementor-page main .mb-brand-hero .mb-brand-copy :is(p, .elementor-widget-text-editor) { color: #dededc; font-size: 20px; line-height: 1.55; }
.mb-elementor-page main .mb-brand-hero .mb-brand-copy p { max-width: 52ch; margin: 0; }
.mb-elementor-page main .mb-brand-hero .mb-brand-copy h1 + p,
.mb-elementor-page main .mb-brand-hero .mb-brand-copy p + p { margin-top: 25px; }
.mb-elementor-page main .mb-brand-hero a { color: inherit; }
.mb-elementor-page main .mb-brand-hero :is(.cta-btn, .mb-portfolio-button .elementor-button) { display: inline-block; min-height: 52px; background: #fff; color: #202020; border: 1px solid #fff; border-radius: 4px; padding: 16px 23px; font-size: 17px; font-weight: 700; line-height: 1.4; text-decoration: none; }
.mb-elementor-page main .mb-brand-hero :is(.cta-btn, .mb-portfolio-button .elementor-button):hover { background: #e5e5e3; border-color: #e5e5e3; }
.mb-elementor-page main .mb-brand-hero a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.mb-elementor-page main .mb-brand-hero .mb-portfolio-link a { font-size: 17px; font-weight: 700; text-underline-offset: 6px; }
.mb-elementor-page main .mb-brand-hero--service > .elementor-container { display: flex; align-items: center; gap: 58px; }
.mb-elementor-page main .mb-brand-hero--service .mb-brand-copy { width: 60%; flex: 60 1 0; min-width: 0; }
.mb-elementor-page main .mb-brand-hero--service .mb-brand-visual { width: 40%; flex: 40 1 0; min-width: 0; }
.mb-elementor-page main .mb-brand-hero--service .mb-brand-visual > .elementor-widget-wrap { display: block; padding: 0 !important; }
.mb-elementor-page main .mb-brand-hero--service .mb-brand-visual .elementor-widget-image { width: 100%; margin: 0; }
.mb-elementor-page main .mb-brand-hero--service .mb-brand-visual img { display: block; width: 100%; height: 440px; max-width: 100%; object-fit: contain; object-position: center bottom; }
/* Preserve John's real portrait layout; only its frame and type join the shared theme. */
.mb-elementor-page main .mb-brand-hero--portrait { padding-bottom: 0 !important; }
.mb-elementor-page main .mb-brand-hero--portrait :is(.mb-portrait-copy, .mb-contact-portrait-copy) { padding-bottom: 64px; }
.mb-elementor-page main .mb-brand-hero--portrait .mb-portrait-photo { background: transparent; }
.mb-elementor-page main .mb-brand-hero--portrait .mb-contact-portrait-image img { object-fit: contain; }
.mb-elementor-page main .mb-brand-reading { padding: calc(var(--mb-header-height, 92px) + 50px) 32px 80px; max-width: 900px; margin-inline: auto; color: #202020; }
.mb-elementor-page main .mb-brand-reading > .elementor-container { max-width: 760px; }
.mb-elementor-page main .mb-brand-reading :is(p, li) { font-size: 18px; line-height: 1.65; }
.mb-elementor-page main .mb-brand-reading h1 { font-size: clamp(40px, 5vw, 64px); font-weight: 700; letter-spacing: -.035em; line-height: 1.08; margin-bottom: 30px; }
.mb-elementor-page main .mb-brand-reading h2 { font-size: 30px; font-weight: 700; letter-spacing: -.025em; line-height: 1.15; margin-top: 38px; margin-bottom: 18px; }
.mb-elementor-page main .mb-brand-reading a { text-decoration: underline; text-underline-offset: 4px; }
/* The default document template already reserves the fixed-header clearance. */
.mb-elementor-page.privacy-policy main .mb-brand-reading { padding-top: 0; }
/* Remove stacked legacy section spacing without changing portrait proportions. */
.mb-elementor-page main .mb-home-cta { padding-top: 72px !important; padding-bottom: 56px !important; }
.mb-elementor-page main .mb-home-cta .mb-text-block { margin-bottom: 0; }
.mb-elementor-page main .mb-home-portrait { padding-top: 48px !important; }
.mb-elementor-page main .mb-home-portrait > .elementor-container { align-items: flex-start; }
.mb-elementor-page main .mb-home-portrait .mb-portrait-copy { padding-bottom: 48px; }
.mb-elementor-page:is(.page-id-15, .page-id-232) main .services.light:has(+ .services.light .process-step) { padding-bottom: 24px !important; }
.mb-elementor-page:is(.page-id-15, .page-id-232) main .services.light + .services.light:has(.process-step) { padding-top: 16px !important; }
.mb-elementor-page:is(.page-id-15, .page-id-232) main .services.light:has(.process-step) { padding-bottom: 64px !important; }
.mb-elementor-page:is(.page-id-15, .page-id-232) main .services.light:has(.process-step) + .services.light { padding-top: 64px !important; }
.mb-elementor-page main .contact-info-section { padding-top: 48px !important; padding-bottom: 48px !important; }
.mb-elementor-page main .contact-info-section > .elementor-container > .elementor-column > .elementor-widget-wrap { padding-top: 0 !important; }
/* Each head has its own reserved space and a physical line to emerge from. */
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head {
  --mb-head-slot: 110px;
  --mb-head-top: 20px;
  position: relative;
  width: 100% !important;
  height: var(--mb-head-slot);
  min-height: var(--mb-head-slot);
  margin: 0 !important;
  overflow: hidden;
  border-bottom: 1px solid currentColor;
  color: #303030;
  pointer-events: none;
  isolation: isolate;
}
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head > .elementor-widget-container { position: relative; width: 100%; height: 100%; overflow: hidden; }
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head img { position: absolute; width: 176px; height: 220px; max-width: none; left: calc(50% - 88px); top: var(--mb-head-top); display: block; object-fit: contain; object-position: top center; animation: none !important; filter: none !important; transform: translate3d(0, var(--mb-head-rise, 0px), 0) !important; }
.mb-elementor-page #diensten .bureau__services .mb-service-card { margin-bottom: 32px; }
/* Keep the card edge steady while its head moves, including on touch devices. */
.mb-elementor-page #diensten .bureau__services .mb-service-card:is(:hover, :focus-within) { transform: none; }
.mb-elementor-page #diensten .bureau__services .mb-service-card > .elementor-widget-wrap { position: relative; display: block; padding: 0 24px 28px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.mb-elementor-page #diensten .bureau__services .mb-service-card:is(:hover, :focus-within) > .elementor-widget-wrap { background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.mb-elementor-page #diensten .bureau__services .mb-service-card > .elementor-widget-wrap::before { content: ''; position: absolute; inset: 110px 0 0; border: 1px solid #d7d7d3; border-top: 0; border-radius: 0 0 12px 12px; background: #fbfbfd; pointer-events: none; z-index: 0; }
.mb-elementor-page #diensten .bureau__services .mb-service-card > .elementor-widget-wrap > .elementor-widget { position: relative; z-index: 1; }
.mb-elementor-page #diensten .bureau__services .mb-service-card .mb-edge-head { width: calc(100% + 48px) !important; margin-inline: -24px !important; margin-bottom: 0 !important; }
.mb-elementor-page #diensten .bureau__services .mb-service-card .elementor-widget-heading { padding-top: 28px; margin-bottom: 24px; }
.mb-elementor-page #diensten .bureau__services .mb-service-card .elementor-heading-title { font-size: 17px; line-height: 1.3; min-height: 2.6em; }
.mb-elementor-page #diensten .bureau__services .mb-service-card .mb-wp-text-body { margin-bottom: 0; }
.mb-elementor-page #diensten .bureau__services .mb-service-card:hover > .elementor-widget-wrap::before,
.mb-elementor-page #diensten .bureau__services .mb-service-card:focus-within > .elementor-widget-wrap::before { border-color: #aaa; background: #fff; }
:is(.mb-elementor-page, .mbpse-curated) .mb-page-edge { margin-top: 26px !important; color: currentColor; }
/* A fixed place for each character, varied across the individual blocks. */
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head { --mb-head-position: 50%; }
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head.mb-head-laptop { --mb-head-position: 24%; }
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head.mb-head-camera { --mb-head-position: 78%; }
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head.mb-head-tablet { --mb-head-position: 42%; }
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head.mb-head-john { --mb-head-position: 66%; }
:is(.mb-elementor-page, .mbpse-curated) .mb-edge-head img { left: clamp(0px, calc(var(--mb-head-position) - 88px), calc(100% - 176px)); right: auto; }
/* Begin at the clipping edge: no invisible travel before the quick reveal. */
:is(.mb-elementor-page, .mbpse-curated) .mb-heads-ready .mb-edge-head img { --mb-head-rise: calc(var(--mb-head-slot) - var(--mb-head-top)); transition: transform 280ms cubic-bezier(.22, .61, .36, 1); }
:is(.mb-elementor-page, .mbpse-curated) .mb-heads-ready.mb-head-active .mb-edge-head img { --mb-head-rise: 0px; transition-duration: 400ms; }
@media (max-width: 1023px) {
  .mb-elementor-page main .mb-brand-hero { padding-inline: 32px !important; }
  .mb-elementor-page main .mb-brand-hero--service > .elementor-container { gap: 32px; }
  .mb-elementor-page main .mb-brand-hero--service .mb-brand-visual img { height: 350px; }
  .mb-elementor-page main .mb-brand-hero .mb-brand-copy :is(p, .elementor-widget-text-editor) { font-size: 19px; }
}
@media (max-width: 767px) {
  .mb-elementor-page main .mb-brand-hero { padding: calc(var(--mb-header-height, 72px) + 40px) 24px 52px !important; }
  .mb-elementor-page main .mb-brand-hero :is(h1, h1.elementor-heading-title) { font-size: clamp(40px, 10.8vw, 58px); max-width: 18ch; }
  .mb-elementor-page main .mb-brand-hero .mb-brand-copy :is(p, .elementor-widget-text-editor) { font-size: 18px; }
  .mb-elementor-page main .mb-brand-hero--service > .elementor-container { flex-direction: column; align-items: stretch; gap: 25px; }
  .mb-elementor-page main .mb-brand-hero--service :is(.mb-brand-copy, .mb-brand-visual) { width: 100%; flex: 0 1 auto; }
  .mb-elementor-page main .mb-brand-hero--service .mb-brand-visual img { height: 280px; }
  .mb-elementor-page main .mb-brand-hero--portrait { padding-bottom: 0 !important; }
  .mb-elementor-page main .mb-brand-hero--portrait :is(.mb-portrait-copy, .mb-contact-portrait-copy) { padding-bottom: 0; }
  .mb-elementor-page main .mb-brand-reading { padding: calc(var(--mb-header-height, 72px) + 36px) 9px 56px; }
  .mb-elementor-page main .mb-brand-reading h2 { font-size: 27px; }
  .mb-elementor-page main .mb-brand-reading :is(p, li) { font-size: 17px; }
  .mb-elementor-page main .mb-home-cta { padding-top: 56px !important; padding-bottom: 40px !important; }
  .mb-elementor-page main .mb-home-portrait { padding-top: 40px !important; }
  .mb-elementor-page main .mb-home-portrait .mb-portrait-copy { padding-bottom: 0; }
  .mb-elementor-page #diensten .bureau__services .mb-service-card { margin-bottom: 28px; }
  .mb-elementor-page #diensten .bureau__services .mb-service-card .elementor-widget-heading { margin-bottom: 24px; }
}
@media (hover: none), (prefers-reduced-motion: reduce) {
  :is(.mb-elementor-page, .mbpse-curated) .mb-heads-ready .mb-edge-head img { --mb-head-rise: 0px; transition: none; }
}
/* Mobile: the bende closes behind John; each head peeks from its own fixed line. */
@media (max-width: 767px) {
  .mb-elementor-page .preloader .words .word1 { width: min(72vw, 320px); }
}
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  .mb-elementor-page main .mb-penguin-header .mb-mobile-depth {
    transform: translate3d(var(--mb-depth-x, 0px), var(--mb-depth-y, 0px), 0);
  }
  :is(.mb-elementor-page, .mbpse-curated) .mb-edge-head.mb-scroll-head img {
    transform: translate3d(0, var(--mb-scroll-head-rise, 0px), 0) !important;
    transition: none !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mb-elementor-page .preloader { display: none !important; }
}
