/* Muster42: layered on site.css. */
.m42-logo{display:inline-flex;align-items:center;gap:10px;line-height:1;text-decoration:none;flex-shrink:0}
.m42-logo img{height:40px;width:auto}
.m42-logo .wm{font-family:var(--sans);font-weight:700;font-size:30px;letter-spacing:-.01em;color:#0B1114}
/* Wordmark colours follow the MusterGRC master lockup (brand/README.md):
   the 42 takes GRC's place and GRC's colours, deeper on light because
   Muster Blue text on white fails contrast (style guide p.16). */
.m42-logo .wm b{font-weight:700;color:#0E6A93}
.m42-logo.on-dark .wm{color:#F2F6F8}
.m42-logo.on-dark .wm b{color:#3FC4F0}
/* the discreet "42" cue in the top bar */
.framework .m42-cue{text-transform:none;letter-spacing:.06em;font-weight:500;color:var(--on-dark-2)}
.framework .m42-cue b{color:#FFFFFF;font-weight:700}
.framework .m42-cue em{font-style:normal;color:var(--blue);font-weight:700}
.product-tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--deep);border:1px solid var(--rule);border-radius:999px;padding:4px 12px;background:#FFFFFF}
@media(max-width:480px){.m42-logo .wm{font-size:24px}.m42-logo img{height:32px}}
.foot .brand .m42-logo{gap:10px}
.foot .brand .m42-logo img{height:40px;width:40px}
.foot .brand .m42-logo .wm{font-size:28px;line-height:1}
.foot .brand .product-tag{align-self:flex-start}

/* hero: the three parts of the service, one line each */
.hero-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;max-width:620px}
.hero-steps li{position:relative;padding-left:22px;font-size:17px;line-height:1.55;color:var(--text)}
.hero-steps li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:2px;background:var(--blue)}
.hero-steps b{color:var(--dark);font-weight:600}
.hero-copy .hero-steps{margin:-16px 0 36px}
.nowrap{white-space:nowrap}

/* MusterGRC, the product, gets its own zone: a white band carrying the
   MusterGRC lockup, so it reads as the tool rather than the company. */
.band.product{position:relative;z-index:2;background:#FFFFFF;border-block:1px solid var(--rule)}
.product-mark{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.product-mark img{height:40px;width:auto}
.product-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:var(--sp-content)}
.product-cta span{font-size:15px;color:var(--muted)}