.msm-grafisch-ontwerper-hero{position:relative;display:grid;grid-template-columns:minmax(320px,.82fr) minmax(420px,1.18fr);min-height:690px;padding:clamp(350px,29vw,400px) clamp(24px,5vw,76px) 54px;gap:clamp(30px,5vw,84px);overflow:hidden;background:var(--m-bg);color:var(--m-ink);font-family:Arial,sans-serif}.msm-grafisch-ontwerper-hero .go-recursive{position:absolute;z-index:0;left:0;right:0;top:108px;height:255px;color:var(--m-ink)}.msm-grafisch-ontwerper-hero .go-recursive canvas{display:block;width:100%;height:100%;cursor:crosshair}.msm-grafisch-ontwerper-hero .go-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.msm-grafisch-ontwerper-hero .go-copy{z-index:1;align-self:end;padding-bottom:36px}.msm-grafisch-ontwerper-hero .go-copy p{max-width:23rem;margin:0 0 22px;font-size:15px;line-height:1.45}.msm-grafisch-ontwerper-hero h1{max-width:700px;margin:0;font-size:clamp(48px,6.8vw,102px);line-height:.91;letter-spacing:-.065em;font-weight:800}.msm-grafisch-ontwerper-hero .go-copy a{display:inline-flex;gap:16px;align-items:center;margin-top:34px;padding:15px 20px;background:var(--m-primary);color:white;text-decoration:none;font-weight:700}.msm-grafisch-ontwerper-hero figure{z-index:1;align-self:end;margin:0;position:relative}.msm-grafisch-ontwerper-hero figure img{width:100%;height:clamp(410px,50vw,590px);object-fit:cover;object-position:55% 50%;display:block}.msm-grafisch-ontwerper-hero figcaption{position:absolute;right:0;bottom:0;padding:12px 16px;background:#171717;color:#fff;font-size:13px}.msm-grafisch-ontwerper-hero a:focus-visible{outline:3px solid #171717;outline-offset:4px}@media(max-width:720px){.msm-grafisch-ontwerper-hero{display:flex;flex-direction:column;min-height:760px;padding:280px 18px 20px;gap:20px}.msm-grafisch-ontwerper-hero .go-recursive{top:104px;height:165px}.msm-grafisch-ontwerper-hero .go-copy{padding:0}.msm-grafisch-ontwerper-hero .go-copy p{margin-bottom:14px;font-size:13px}.msm-grafisch-ontwerper-hero h1{font-size:52px}.msm-grafisch-ontwerper-hero .go-copy a{margin-top:18px}.msm-grafisch-ontwerper-hero figure{margin-top:auto;width:100%}.msm-grafisch-ontwerper-hero figure img{content:url('./assets/hero-mobile.webp');height:330px;object-position:52% 46%}.msm-grafisch-ontwerper-hero figcaption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.msm-grafisch-ontwerper-hero *{scroll-behavior:auto!important}}

/* Pilot composition: the recursive word sculpture leads; copy and image support it. */
.msm-grafisch-ontwerper-hero{min-height:690px;padding:270px clamp(24px,5vw,76px) 34px;grid-template-columns:minmax(280px,.72fr) minmax(420px,1.28fr);gap:clamp(28px,4vw,62px)}
.msm-grafisch-ontwerper-hero .go-recursive{top:18px;left:clamp(24px,5vw,76px);right:clamp(24px,5vw,76px);height:220px}
.msm-grafisch-ontwerper-hero .go-copy{align-self:center;padding-bottom:0}
.msm-grafisch-ontwerper-hero h1{max-width:520px;font-size:clamp(40px,4vw,52px);line-height:.94;letter-spacing:-.05em}
.msm-grafisch-ontwerper-hero .go-copy a{margin-top:24px}
.msm-grafisch-ontwerper-hero figure{align-self:center}
.msm-grafisch-ontwerper-hero figure img{height:300px}
@media(max-width:720px){.msm-grafisch-ontwerper-hero{min-height:690px;padding:178px 18px 18px;gap:16px}.msm-grafisch-ontwerper-hero .go-recursive{top:12px;left:18px;right:18px;height:142px}.msm-grafisch-ontwerper-hero h1{font-size:42px;max-width:350px}.msm-grafisch-ontwerper-hero .go-copy p{margin-bottom:10px}.msm-grafisch-ontwerper-hero .go-copy a{margin-top:14px}.msm-grafisch-ontwerper-hero figure img{height:245px}.msm-grafisch-ontwerper-hero figcaption{font-size:10px}}