/* Header logo: symbol stays at its established scale; wordmark is enlarged in the revised embedded artwork. */
.logo{width:235px;height:88px;display:flex;align-items:center;overflow:visible}
.logo img{width:225px;max-height:78px;height:auto;object-fit:contain;object-position:left center}

/* Clearer separators between the six hero sector focuses. */
.hero-sector-row .bullet{font-size:24px;line-height:1;font-weight:600;color:rgba(255,255,255,.78)}

/* Same scroll cue position/scale, but clearer as a small inverted Contact-style button. */
.scroll-cue{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;background:#fff;color:var(--brand);font-weight:600;letter-spacing:.10em;box-shadow:0 2px 10px rgba(0,0,0,.10)}
.scroll-cue:hover{background:rgba(255,255,255,.92)}

/* Over ons: vertically center the compact right-hand box against the left copy. */
.about-v11{align-items:center}
.about-v11 .jobs-card{margin-top:0;padding-top:25px;padding-bottom:25px;align-self:center}

/* Onze locatie: heading/copy start near the top of the office image, mirroring section-heading spacing. */
.office-copy{top:46px;bottom:auto;left:7vw;max-width:620px}
.office-copy .eyebrow{margin:0 0 8px}
.office-copy h2{margin:0 0 12px}

@media(max-width:780px){
  .logo{width:178px;height:68px;flex-basis:178px}
  .logo img{width:170px;max-height:64px}
  .office-copy{top:38px;left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right))}
  .about-v11 .jobs-card{margin-top:0}
  .hero-sector-row .bullet{font-size:20px}
}
@media(max-width:430px){.logo{width:166px;flex-basis:166px}.logo img{width:158px}}
@media(max-width:360px){.logo{width:154px;flex-basis:154px}.logo img{width:146px}}

/* Onze locatie: title accent matches other branded section labels such as Sectorfocus. */
.office-copy .eyebrow{color:var(--brand);}
@media (max-width:760px){
}