/* My Benefits case study — scoped integration */
.mb-case{--mb-accent:#b51f82;--mb-navy:#203f60;--mb-soft:#f4f4f1;--mb-line:rgba(17,17,17,.11)}
.mb-case main{overflow:hidden}.mb-shell{width:min(1180px,calc(100% - 44px));margin:auto}.mb-section{padding:104px 0;scroll-margin-top:128px}.mb-section+.mb-section{border-top:1px solid var(--mb-line)}.mb-soft{background:#f6f6f2}.mb-case h1,.mb-case h2,.mb-case h3{font-weight:400}.mb-case h1{font-size:clamp(48px,7.5vw,96px);line-height:.98;letter-spacing:-.055em}.mb-case h2{font-size:clamp(34px,5vw,62px);line-height:1.04;max-width:960px}.mb-case h3{letter-spacing:-.02em}.mb-lead{font-size:clamp(18px,2vw,23px);line-height:1.7;color:var(--muted);max-width:850px}.mb-subnav{position:sticky;top:75px;z-index:70;background:rgba(251,251,248,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--mb-line)}.mb-subnav-inner{width:min(1180px,calc(100% - 44px));margin:auto;display:flex;gap:5px;overflow:auto;scrollbar-width:none;padding:9px 0}.mb-subnav-inner::-webkit-scrollbar{display:none}.mb-subnav a{padding:8px 12px;border-radius:999px;color:var(--muted);font-size:13px;white-space:nowrap}.mb-subnav a.active{background:#f7e9f3;color:var(--mb-accent)}
.mb-hero{padding:88px 0 96px;background:linear-gradient(150deg,#fff 0%,#f5f2f6 62%,#eef2f6 100%)}.mb-hero-grid{display:grid;grid-template-columns:1.2fr .55fr;gap:76px;align-items:center}.mb-meta{display:flex;flex-wrap:wrap;gap:9px;margin-top:32px}.mb-meta span{border:1px solid var(--mb-line);background:rgba(255,255,255,.74);border-radius:999px;padding:8px 12px;color:var(--muted);font-size:13px}.mb-phone{width:min(330px,76vw);aspect-ratio:592/1284;border:9px solid #121922;border-radius:48px;padding:7px;background:#121922;box-shadow:0 36px 90px rgba(17,24,39,.25);position:relative;margin:auto}.mb-phone:before{content:"";position:absolute;top:9px;left:50%;transform:translateX(-50%);width:42%;height:23px;border-radius:0 0 15px 15px;background:#121922;z-index:3}.mb-phone-screen{height:100%;border-radius:33px;overflow:hidden;background:#0d1726}.mb-phone video{width:100%;height:100%;object-fit:cover;object-position:center top}.mb-snapshot{display:grid;grid-template-columns:repeat(4,1fr);background:var(--mb-navy);color:#fff}.mb-snapshot>div{padding:30px max(24px,calc((100vw - 1180px)/8));border-right:1px solid rgba(255,255,255,.16)}.mb-snapshot>div:last-child{border:0}.mb-snapshot strong{display:block;font-size:clamp(24px,3vw,37px);font-weight:300;line-height:1.15}.mb-snapshot span{font-size:13px;color:rgba(255,255,255,.68)}
.mb-visual{margin:0;background:#fff;border:1px solid var(--mb-line);border-radius:24px;overflow:hidden;box-shadow:0 18px 50px rgba(17,17,17,.07)}.mb-visual img{width:100%;height:auto}.mb-visual figcaption{padding:17px 20px;color:var(--muted);font-size:14px;border-top:1px solid var(--mb-line)}.mb-before-grid{display:grid;grid-template-columns:1.1fr .55fr;gap:24px;margin-top:48px}.mb-before-grid figure:last-child{grid-column:1/-1}.mb-tall{max-height:720px;overflow:auto}.mb-findings,.mb-principles,.mb-steps,.mb-callouts,.mb-outcomes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}.mb-findings article,.mb-principles article,.mb-steps article,.mb-callouts article{padding:24px;border:1px solid var(--mb-line);border-radius:20px;background:#fff}.mb-findings span,.mb-steps span,.mb-outcomes span{display:block;color:var(--mb-accent);font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}.mb-findings p,.mb-principles p,.mb-steps p,.mb-callouts p,.mb-outcomes p,.mb-feature p,.mb-related p{color:var(--muted);margin-bottom:0}.mb-principles article b{color:var(--mb-accent);font-weight:500;display:block;margin-bottom:12px}.mb-xd{margin-top:48px;background:#eef0f3;padding:18px}.mb-xd figcaption{margin:-1px -18px -18px}
.mb-browser{margin-top:48px;background:#eef0f3;border:1px solid var(--mb-line);border-radius:26px;overflow:hidden;box-shadow:0 24px 65px rgba(17,17,17,.10)}.mb-browser-bar{height:40px;background:#fff;border-bottom:1px solid var(--mb-line);display:flex;align-items:center;gap:7px;padding:0 14px;color:var(--muted);font-size:12px}.mb-browser-bar i{width:9px;height:9px;background:#d5d8de;border-radius:50%}.mb-browser-bar span{margin-left:6px}.mb-browser video{width:100%;display:block;background:#101828}.mb-responsive{display:grid;grid-template-columns:1fr 210px;gap:24px;align-items:start;margin-top:48px}.mb-mobile-long{max-height:760px;overflow:auto}.mb-mobile-context{display:grid;grid-template-columns:.65fr .65fr 1fr;gap:24px;align-items:center;margin-top:48px}.mb-mobile-context .mb-visual img{max-height:590px;object-fit:contain}.mb-phone-inline{width:min(300px,100%)}
.mb-feature{margin-top:48px;padding:42px;border-radius:28px;background:linear-gradient(135deg,#e9f5f3,#f4eef8);display:grid;grid-template-columns:.8fr 1.2fr;gap:38px;align-items:center}.mb-feature h3{font-size:32px}.mb-two{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:24px}.mb-outcomes{grid-template-columns:repeat(4,1fr)}.mb-outcomes article{padding:24px 0;border-top:1px solid #171717}.mb-case blockquote{margin:60px 0 0;padding:32px 36px;border-left:4px solid var(--mb-accent);background:#f8edf5;border-radius:0 22px 22px 0;font-size:clamp(21px,2.5vw,30px);line-height:1.5}.mb-related{margin-top:86px}.mb-related>div{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.mb-related article{padding:24px;border:1px solid var(--mb-line);border-radius:20px;background:#fff}
.v3-home .work-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}.work-card-featured{grid-column:1/-1;display:grid;grid-template-columns:1.15fr .85fr}.work-card-featured .thumb{height:100%;min-height:340px}.work-card-featured .work-body{display:flex;flex-direction:column;justify-content:center}.work-card-featured h3{font-size:32px}
@media(max-width:980px){.mb-subnav{top:67px}.mb-hero-grid,.mb-feature,.mb-responsive,.mb-mobile-context{grid-template-columns:1fr}.mb-phone{margin-top:20px}.mb-snapshot,.mb-findings,.mb-principles,.mb-steps,.mb-callouts,.mb-outcomes{grid-template-columns:repeat(2,1fr)}.mb-before-grid,.mb-two{grid-template-columns:1fr}.mb-before-grid figure:last-child{grid-column:auto}.mb-responsive .mb-mobile-long{width:min(330px,100%);max-height:none;margin:auto}.mb-mobile-context .mb-visual{max-width:430px;margin:auto}.work-card-featured{grid-template-columns:1fr}.work-card-featured .thumb{min-height:240px}}
@media(max-width:620px){.mb-shell,.mb-subnav-inner{width:min(100% - 28px,1180px)}.mb-section{padding:74px 0}.mb-hero{padding:62px 0 76px}.mb-snapshot,.mb-findings,.mb-principles,.mb-steps,.mb-callouts,.mb-outcomes,.mb-related>div{grid-template-columns:1fr}.mb-snapshot>div{border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}.mb-feature{padding:24px}.v3-home .work-grid-four{grid-template-columns:1fr}.work-card-featured{grid-column:auto}.work-card-featured h3{font-size:24px}}


/* Shared RRUX story-navigation state overrides project-specific pink. */
.mb-case .story-nav a.active,
.mb-case .story-nav a[aria-current="true"]{
  background:#171717;
  border-color:#171717;
  color:#fff;
}
.mb-case .story-nav a:hover{
  color:#171717;
  background:#f0f0eb;
  border-color:rgba(17,17,17,.10);
}

/* V5.1: use the shared flush liquid-glass story navigation. */
.mb-case .mb-subnav{
  top:63px;
  background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(248,248,246,.70));
  border-bottom-color:rgba(17,19,24,.10);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
}
@media(max-width:620px){.mb-case .mb-subnav{top:57px}}

/* V5.4: match the shared balanced chapter-navigation spacing. */
.mb-case .mb-subnav{
  min-height:60px;
}
.mb-case .mb-subnav-inner{
  min-height:60px;
  padding:11px 0;
  align-items:center;
}
.mb-case .mb-subnav a{
  min-height:38px;
  padding:9px 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
@media(max-width:620px){
  .mb-case .mb-subnav{
    min-height:56px;
  }
  .mb-case .mb-subnav-inner{
    min-height:56px;
    padding:9px 0;
  }
  .mb-case .mb-subnav a{
    min-height:36px;
    padding:8px 13px;
  }
}


/* V5.5.1: full-width implementation outcome with balanced editorial layout. */
.mb-outcomes .mb-outcome-feature{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(220px,.72fr) minmax(0,1.55fr);
  gap:clamp(28px,5vw,72px);
  align-items:start;
  padding:34px 0 0;
}
.mb-outcomes .mb-outcome-feature h3{
  margin-bottom:0;
  max-width:420px;
}
.mb-outcomes .mb-outcome-feature p{
  margin:0;
  max-width:760px;
  font-size:16px;
  line-height:1.75;
}
@media(max-width:760px){
  .mb-outcomes .mb-outcome-feature{
    grid-template-columns:1fr;
    gap:14px;
    padding-top:28px;
  }
  .mb-outcomes .mb-outcome-feature p{
    max-width:none;
  }
}