/* Satcop x My School Ride feature card (shared, self-contained). v1 2026-10-06 */
.msr-feature{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);
  background:#000;color:#f5f5f7;border-radius:24px;overflow:hidden;
  text-align:left;min-height:280px;box-sizing:border-box;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;line-height:1.47059;
  transition:transform .2s ease, box-shadow .2s ease;
}
.msr-feature *{box-sizing:border-box}
.msr-feature:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.14)}
.msr-media{position:relative;min-height:240px;background:#1c1c1e;overflow:hidden}
.msr-media picture{position:absolute;inset:0;display:block}
.msr-media img{
  position:absolute;inset:0;width:100%;height:100%;max-width:none;
  object-fit:cover;object-position:34% 58%;display:block;
}
.msr-live{
  position:absolute;left:16px;bottom:16px;z-index:1;
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 13px 7px 11px;border-radius:980px;
  background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  color:#1d1d1f;font-size:12px;font-weight:600;letter-spacing:-.005em;line-height:1.2;
  box-shadow:0 4px 18px rgba(0,0,0,.14);
}
.msr-live i{
  width:8px;height:8px;border-radius:50%;background:#30d158;flex:none;
  box-shadow:0 0 0 3px rgba(48,209,88,.22);
}
.msr-body{
  padding:30px 34px 32px;display:flex;flex-direction:column;justify-content:center;gap:8px;
}
.msr-tag{
  font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#2997ff;
}
.msr-title{
  font-size:clamp(24px,2.6vw,30px);line-height:1.1;letter-spacing:-.02em;font-weight:600;
  margin:0;max-width:none;color:#f5f5f7;text-wrap:balance;
}
.msr-body p{font-size:15px;line-height:1.45;color:#a1a1a6;margin:2px 0 0;max-width:460px}
.msr-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;margin-top:14px}
.msr-feature a.msr-cta{
  display:inline-flex;align-items:center;gap:6px;
  background:#0071e3;color:#fff;border-radius:980px;padding:11px 20px;
  font-size:15px;font-weight:500;line-height:1.2;letter-spacing:-.01em;
  text-decoration:none;white-space:nowrap;transition:background .2s ease;
}
.msr-feature a.msr-cta:hover{background:#0077ed;text-decoration:none}
.msr-feature a.msr-cta:focus-visible{outline:2px solid #2997ff;outline-offset:3px}
.msr-meta{font-size:13px;color:#86868b}

/* Home: lives inside the product card grid, fills the last row */
.story-grid .msr-feature{grid-column:span 3}

/* Inner pages: standalone band above the final call to action */
.msr-section{padding:56px 22px 56px;background:#fff}
.msr-section + .stage.cta{padding-top:48px}
.msr-section > .wrap{max-width:980px;margin:0 auto}
.msr-section.msr-flush{padding-left:0;padding-right:0}
.msr-section.msr-flush > .wrap{max-width:1080px}
.policy + .msr-section{padding-top:8px}
.msr-section .msr-feature{margin:0}

@media(max-width:900px){
  .story-grid .msr-feature{grid-column:1 / -1}
}
@media(max-width:640px){
  .msr-feature{grid-template-columns:1fr;min-height:0}
  .msr-media{min-height:0;aspect-ratio:16/10}
  .msr-body{padding:22px 22px 24px}
  .msr-title{font-size:24px}
  .msr-section{padding:40px 22px 40px}
  .msr-section.msr-flush{padding-left:0;padding-right:0}
}
@media(prefers-reduced-motion:reduce){.msr-feature{transition:none}.msr-feature:hover{transform:none}}