.bb-about-essay{color:#18251d;background:#fff}.bb-about-heading{background:#18251d;color:white;padding:158px 0 60px}.bb-about-reading{width:100%;max-width:840px;margin:0 auto;padding:0 32px;box-sizing:border-box}.bb-about-heading h1{font-size:clamp(40px,5vw,62px);line-height:1.08;margin:0}.bb-about-heading .bb-eyebrow{color:#b2caaa;font-size:12px;letter-spacing:.12em;margin-bottom:18px}.bb-about-narrative>.bb-about-reading{padding-top:64px;padding-bottom:64px}.bb-about-reading h2{font-size:32px;line-height:1.2;margin:0 0 26px}.bb-about-reading p{font-size:19px;line-height:1.85;margin:0 0 25px}.bb-about-reading strong{font-weight:700}.bb-about-reading a:not(.bb-button):not(.bb-about-company-logo){color:#315b43;text-decoration:underline;text-underline-offset:4px}.bb-about-company-logo{display:inline-block;margin:16px 0 0}.bb-about-company-logo img{display:block;width:166px;height:96px;object-fit:contain}.bb-about-wide{width:100%;max-width:1400px;margin:0 auto;padding:0;overflow:hidden}.bb-about-wide img{display:block;width:100%;height:auto}.bb-about-wide--office img{max-height:760px;object-fit:cover;object-position:center 45%}.bb-about-wide--golden img{max-height:1000px;object-fit:cover;object-position:center 65%}.bb-about-wide--path img{max-height:950px;object-fit:cover;object-position:center 40%}.bb-about-reading .bb-actions{gap:24px;flex-wrap:wrap;align-items:center;margin-top:32px}.bb-about-reading .bb-about-signature{font-size:30px;font-weight:700;margin-top:24px}body:has(.bb-about-essay) .bb-footer{--footer-edge-color:#fff!important}
@media(max-width:850px){.bb-about-heading{padding:132px 0 42px}.bb-about-reading{padding:0 24px}.bb-about-narrative>.bb-about-reading{padding-top:40px;padding-bottom:40px}.bb-about-reading p{font-size:17px;line-height:1.8}.bb-about-reading h2{font-size:28px}.bb-about-wide img{height:auto;max-height:none;object-fit:contain}.bb-about-reading .bb-actions{gap:20px}.bb-about-company-logo img{width:140px;height:auto}}
/* De twee goedgekeurde buitenbeelden volledig tonen, inclusief avondzon. */
.bb-about-wide--golden img,.bb-about-wide--path img{max-height:none;object-fit:contain}
.bb-about-history{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:1400px;margin:0 auto;background:#18251d}.bb-about-history figure{margin:0;min-width:0;align-self:center}.bb-about-history img{display:block;width:100%;height:auto}.bb-about-history__office{align-self:stretch!important;display:flex;align-items:center}
@media(max-width:850px){.bb-about-history{grid-template-columns:1fr;gap:12px}}
.bb-about-history figure{aspect-ratio:3/4;align-self:stretch}.bb-about-history img{height:100%;object-fit:cover}.bb-about-history__office img{object-position:78% center}
@media(max-width:850px){.bb-about-history__office{aspect-ratio:3/2}.bb-about-history__office img{object-position:center}}
/* Mobiel: het volledige historische kantoorbeeld zonder uitsnede. */
@media(max-width:850px){.bb-about-history .bb-about-history__office{aspect-ratio:auto;display:block}.bb-about-history .bb-about-history__office img{height:auto;object-fit:contain;object-position:center}}
/* De twee historische beelden als losse polaroids. */
.bb-about-history{box-sizing:border-box;background:#e7ebe0;padding:64px 56px;gap:44px;align-items:center;overflow:visible}
.bb-about-history figure,.bb-about-history .bb-about-history__office{box-sizing:border-box;display:block;aspect-ratio:auto;align-self:center!important;background:#fff;padding:14px 14px 54px;box-shadow:0 12px 28px #18251d26;transform:rotate(-3deg);margin:0}
.bb-about-history .bb-about-history__office{transform:rotate(3deg)}
.bb-about-history figure img,.bb-about-history .bb-about-history__office img{height:auto;width:100%;object-fit:contain;object-position:center}
@media(max-width:850px){.bb-about-history{padding:40px 30px;gap:40px}.bb-about-history figure,.bb-about-history .bb-about-history__office{padding:10px 10px 36px;transform:rotate(-2deg)}.bb-about-history .bb-about-history__office{transform:rotate(2deg)}}
/* Zelfde bodytypografie als de andere pagina's. */
.bb-about-reading p{font-size:var(--font-size-body);line-height:1.5}
.bb-about-reading a.bb-text-link{text-decoration:underline;text-underline-offset:4px;border-bottom:0;background-image:none;padding-bottom:0}
.bb-about-reading a.bb-text-link::after{content:none}
/* Bestaande kartelvorm van de site, ook binnen de polaroids. */
.bb-about-wide,.bb-about-history figure{position:relative;isolation:isolate}
.bb-about-wide::before,.bb-about-wide::after,.bb-about-history figure::before,.bb-about-history figure::after{content:"";position:absolute;z-index:2;height:16px;background:#fff;pointer-events:none;-webkit-mask:url('/wp-content/themes/beninbeeld/assets/schmutzig.svg') center/auto 100% repeat-x;mask:url('/wp-content/themes/beninbeeld/assets/schmutzig.svg') center/auto 100% repeat-x}
.bb-about-wide::before,.bb-about-wide::after{left:0;right:0}.bb-about-wide::before{top:-1px;transform:rotate(180deg)}.bb-about-wide::after{bottom:-1px}
.bb-about-history figure::before,.bb-about-history figure::after{left:14px;right:14px}.bb-about-history figure::before{top:13px;transform:rotate(180deg)}.bb-about-history figure::after{bottom:53px}
@media(max-width:850px){.bb-about-history figure::before,.bb-about-history figure::after{left:10px;right:10px;height:12px}.bb-about-history figure::before{top:9px}.bb-about-history figure::after{bottom:35px}}
/* Polaroids: de witte papierrand onderaan kartelen, niet de foto. */
.bb-about-history figure::before{content:none}
.bb-about-history figure::after{left:0;right:0;bottom:-15px;height:16px;background:#fff;transform:rotate(180deg)}
@media(max-width:850px){.bb-about-history figure::after{left:0;right:0;bottom:-11px;height:12px}}
/* Bosbergtoren als beeldhero. */
.bb-about-heading--photo{position:relative;height:620px;padding:0;isolation:isolate;overflow:hidden}.bb-about-hero-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center 50%;z-index:-2}.bb-about-heading--photo::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#18251d88,transparent 40%,#18251dbb);z-index:-1}.bb-about-heading--photo .bb-about-reading{position:absolute;bottom:64px;left:50%;transform:translateX(-50%)}
.bb-about-film{min-height:0;height:auto;aspect-ratio:4/5;max-width:1100px}.bb-about-film::before,.bb-about-film::after{content:none}
@media(max-width:850px){.bb-about-heading--photo{height:540px;padding:0}.bb-about-heading--photo .bb-about-reading{bottom:40px}.bb-about-hero-image{object-position:62% center}.bb-about-film{max-width:100%}}
/* Beweging en lucht tussen de historische polaroids. */
.bb-about-history{background:#fff}.bb-about-history figure{transform:translateY(var(--photo-shift,0px)) rotate(-3deg);will-change:transform}.bb-about-history .bb-about-history__office{transform:translateY(var(--photo-shift,0px)) rotate(3deg)}.bb-about-hero-image{will-change:transform}
.bb-about-look{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin:32px 0}.bb-about-look a{font-size:var(--font-size-body)}.bb-about-look .bb-about-handwritten{font-family:'Bradley Hand','Segoe Print',cursive;font-size:28px;line-height:1.4;transform:rotate(-7deg);color:#315b43}.bb-about-handwritten span{display:inline-block;margin-left:8px}
.bb-about-wab{background:#111719;color:#fff;padding:76px 0;margin:0}.bb-about-wab .bb-about-reading{padding-top:0;padding-bottom:0}.bb-about-wab__logo{display:inline-block;margin-bottom:36px}.bb-about-wab__logo img{display:block;width:166px;height:96px;object-fit:contain}.bb-about-wab h2{font-size:38px;margin:0 0 28px}.bb-about-wab p{color:#d8dfda}.bb-about-wab .bb-button{margin-top:16px}.bb-about-reading a.bb-about-wab__logo{background:none;text-decoration:none}
.bb-site .bb-menu__socials li{margin:0!important}
@media(max-width:850px){.bb-about-wab{padding:48px 0}.bb-about-wab h2{font-size:30px}.bb-about-history figure{transform:translateY(var(--photo-shift,0px)) rotate(-2deg)}.bb-about-history .bb-about-history__office{transform:translateY(var(--photo-shift,0px)) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){.bb-about-hero-image{transform:none!important;will-change:auto}.bb-about-history figure{will-change:auto;--photo-shift:0px!important}}
/* Compactere beelden tussen de tekst, zonder de foto's bij te snijden. */
.bb-about-narrative>.bb-about-wide{max-width:700px;margin:0 auto}.bb-about-narrative>.bb-about-film{max-width:700px}.bb-about-narrative>.bb-about-history{max-width:1000px;padding:44px 36px;gap:36px}
@media(max-width:850px){.bb-about-narrative>.bb-about-wide{width:calc(100% - 48px);max-width:480px}.bb-about-narrative>.bb-about-history{width:100%;padding:32px 30px;gap:32px}}
.bb-about-look{gap:20px;margin:20px 0 28px}.bb-about-look a{font-weight:600}
/* Landschapsbeelden breed; staande beelden steeds als paar. */
.bb-about-narrative>.bb-about-wide{width:100%;max-width:none;margin:0}.bb-about-portrait-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;width:100%;max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box;align-items:stretch}.bb-about-portrait-pair>.bb-about-wide{width:100%;max-width:none;margin:0;min-width:0}.bb-about-portrait-pair>.bb-about-wide--golden img{width:100%;height:100%;object-fit:cover;object-position:center}.bb-about-portrait-pair>.bb-about-film{min-height:0;height:100%;aspect-ratio:4/5}
@media(max-width:850px){.bb-about-narrative>.bb-about-wide{width:100%;max-width:none}.bb-about-portrait-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 16px}.bb-about-narrative>.bb-about-history{grid-template-columns:repeat(2,minmax(0,1fr));padding:32px 22px;gap:20px}}
/* Blauwe accentkleur van Web and Brand. */
.bb-about-wab .bb-button{background:#1eb0ff!important;color:#111719!important}.bb-about-wab .bb-button:hover,.bb-about-wab .bb-button:focus-visible{background:#69caff!important;color:#111719!important}
.bb-about-wab{background:linear-gradient(180deg,#11171925 0%,#111719b3 38%,#111719f2 75%),url('../assets/about/ben-bergrand.webp') center top/cover no-repeat;padding-top:240px}.bb-about-wab .bb-about-reading{position:relative}.bb-about-wab p{color:#fff}
@media(max-width:850px){.bb-about-wab{padding-top:220px;background-position:center top}}
/* Donkere afsluiting met doorlopende schmutzig-overgang naar de footer. */
.bb-about-narrative>.bb-about-reading:last-child{max-width:none;background:#18251d;color:#fff;padding-left:max(32px,calc((100% - 776px)/2));padding-right:max(32px,calc((100% - 776px)/2))}
.bb-about-narrative>.bb-about-reading:last-child a:not(.bb-button){color:#a5d9ab}
body:has(.bb-about-essay) .bb-footer{--footer-edge-color:#18251d!important}
@media(max-width:850px){.bb-about-narrative>.bb-about-reading:last-child{padding-left:24px;padding-right:24px}}
.bb-about-narrative>.bb-about-reading:last-child .bb-about-signature{color:#fff!important}
/* Bestaande kartelrand bij de kleurovergangen op de about-pagina. */
.bb-about-heading--photo::after,.bb-about-wab::before,.bb-about-wab::after,.bb-about-narrative>.bb-about-reading:last-child::before{content:"";position:absolute;left:0;right:0;height:clamp(20px,3vw,40px);pointer-events:none;z-index:2;-webkit-mask:url('/wp-content/themes/beninbeeld/assets/schmutzig.svg') center/auto 100% repeat-x;mask:url('/wp-content/themes/beninbeeld/assets/schmutzig.svg') center/auto 100% repeat-x}
.bb-about-heading--photo::after{bottom:-1px;background:#fff}
.bb-about-wab{position:relative;isolation:isolate}.bb-about-wab::before{top:-1px;background:#fff;transform:rotate(180deg)}.bb-about-wab::after{bottom:-1px;background:#18251d}
.bb-about-narrative>.bb-about-reading:last-child{position:relative}.bb-about-narrative>.bb-about-reading:last-child::before{top:-1px;background:#111719;transform:rotate(180deg)}
/* Eén overgang van de bedrijfsfoto naar Let's do business, zonder dubbele rand. */
.bb-about-narrative>.bb-about-reading:last-child::before{content:none}
.bb-about-originals{padding-top:24px;padding-bottom:64px}.bb-about-originals img{display:block;width:100%;height:auto}
/* Teruggeplaatste portretfoto's: gelijke kaders met dezelfde fotokartelrand. */
.bb-about-originals>figure{aspect-ratio:3/4;height:auto;overflow:hidden;align-self:stretch}
.bb-about-originals>figure img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.bb-about-originals>figure:nth-child(2) img{object-position:center 75%}