
/* Round 10: grouped identity, material imagery, reachable appearance control. */
.hero{background:#f7faf9;min-height:500px;overflow:hidden}
.hero-art{inset:0;width:100%;height:100%;z-index:-1}
.hero-art>img{mask-image:none;object-fit:cover;object-position:center;width:100%;height:100%}
.hero-art:after{display:block;background:linear-gradient(90deg,#f8fafaf7 0%,#f8fafae8 24%,#f8fafa60 39%,transparent 52%)}
.hero-inner{padding:88px 0 96px;position:relative}
.hero-copy{max-width:44%}.hero-copy h1{font-size:48px;line-height:1.12;max-width:570px}.hero .lead{max-width:450px}
[data-theme=dark] .hero:before{display:none}
[data-theme=dark] .hero-art{opacity:1;background-image:none}
[data-theme=dark] .hero-art:after{background:linear-gradient(90deg,#0f1413 0%,#0f1413f7 23%,#0f1413a8 40%,#0f14131c 65%),linear-gradient(0deg,#0f141350,#0f14131c)}
.floating-appearance{flex:none;display:inline-flex;align-items:center;justify-content:center;align-self:center;justify-self:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:4px;color:var(--ink);background:none;font-size:24px;line-height:1}
.floating-appearance:hover{background:var(--pale)}
.floating-appearance:focus-visible{outline:3px solid var(--accent-strong);outline-offset:3px}
.section-nav{gap:16px}.section-links{gap:24px}.section-nav.is-floating{padding-inline:24px}
.company>img{width:40px;height:40px;object-fit:contain;background:#fff;border-radius:50%;padding:2px}
.role-showcase{width:min(100%,880px);max-width:66vw}
.role-photo-frame{padding:20px}
.role-switcher{margin-top:32px;margin-bottom:28px}
#role-action{margin-bottom:24px}
.product-feature{display:flex;flex-direction:column;align-items:stretch;background:#10251f;min-height:620px}
.product-feature .feature-art{position:relative;inset:auto;width:100%;height:310px;object-fit:contain;object-position:center;background:#f2f6f3;flex:none;z-index:0}
.product-feature>div{position:relative;z-index:1;flex:1;background:linear-gradient(180deg,#10251f,#122d23);padding-top:24px}
.product-feature h3{font-size:28px}
@media(min-width:901px) and (max-width:1150px){.section-links{gap:16px}.section-nav.is-floating{padding-inline:18px}.hero-copy{max-width:45%}.hero-copy h1{font-size:40px}}
@media(min-width:651px) and (max-width:900px){.hero-copy{max-width:47%}.hero-copy h1{font-size:36px}.hero-inner{padding:64px 0 72px}.hero-art>img{object-position:60% center}.product-feature{display:grid;grid-template-columns:40% 1fr;min-height:320px}.product-feature .feature-art{height:100%;max-height:420px}.product-feature>div{max-width:none;padding:32px}.section-links{gap:16px}}
@media(max-width:650px){
 .hero{display:flex;flex-direction:column;min-height:0}.hero-art{position:relative;inset:auto;order:0;height:250px;width:100%;z-index:0}.hero-art>img{object-fit:cover;object-position:100% center}.hero-art:after{display:none!important}.hero-inner{order:1;padding:24px 0 56px}.hero-copy{max-width:100%}.hero-copy h1{font-size:32px;max-width:none}.hero .lead{max-width:none}
 [data-theme=dark] .hero-art{opacity:1}[data-theme=dark] .hero-art:after{display:block!important;background:linear-gradient(0deg,#0f1413,transparent 28%),#0f141314}
 .section-nav,.section-nav.is-floating{display:grid;grid-template-columns:minmax(0,1fr) 44px;column-gap:8px;padding:0 16px}.section-nav.is-floating{padding-inline:12px}.section-toggle{grid-column:1;grid-row:1;min-width:0}.floating-appearance{grid-column:2;grid-row:1;padding:0;width:44px;height:44px}.section-links{grid-column:1/-1;grid-row:2}.section-nav .nav-cta{display:none}
 .role-showcase{width:100%;max-width:none}.role-photo-frame{padding:10px}.role-switcher{margin-top:28px;margin-bottom:24px}
 .product-feature{display:flex;min-height:0}.product-feature .feature-art{height:280px;object-position:center 35%}.product-feature>div{max-width:none;padding:28px 24px}.product-feature h3{font-size:28px}
}
@media(prefers-reduced-motion:reduce){.hero-art,.floating-appearance{animation:none!important;transition:none!important}}

.prototype-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:6px 5%;min-height:32px;background:#eaf2ed;color:#17553a;font:12px/1.5 "Segoe UI",Arial,sans-serif}.prototype-bar a{min-height:28px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:3px}.prototype-bar span{font-weight:600}[data-theme=dark] .prototype-bar{background:#202d26;color:#d5ebdd}

.prototype-bar{padding-block:0;min-height:44px}.prototype-bar a{min-height:44px}

/* Joseph requested uppercase section labels in the Azure reference. */
.eyebrow{text-transform:uppercase;letter-spacing:.09em}

/* Smaller brand artwork leaves the message in focus. */
.hero-art{left:54%;right:3%;width:43%;height:100%;opacity:.85}.hero-art>img{object-fit:contain;object-position:center}.hero-art:after{display:none}@media(max-width:760px){.hero-art{left:60%;width:38%;opacity:.12}.hero-inner{padding-top:52px;padding-bottom:60px}}
