/* Homepage scroll walk (index.php #home-walk): service cards over the video.
   Julio 2026-10-12: card background 30% opaque. Dark glass so white text stays readable over bright and dark scenes:
   navy at 30% + the video behind blurred and slightly dimmed. Loaded after story.css. */
.story--home .story-card {
  background: rgba(11, 31, 51, 0.30);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(14px) brightness(0.78) saturate(1.1);
  backdrop-filter: blur(14px) brightness(0.78) saturate(1.1);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
}
.story--home .story-card h2 { color: #fff; margin-bottom: 0.4rem; }
.story--home .story-card p { color: rgba(255, 255, 255, 0.93); }
.story--home .story-card .btn { text-shadow: none; margin-top: 0.35rem; }
.story--home .story-card__step {
  display: block; margin: 0 0 0.35rem; font: 600 0.75rem/1 var(--font-accent, inherit);
  letter-spacing: 0.08em; text-transform: uppercase; color: #9FD3B8;
}
/* overlay layouts: a compact card (the homepage cards are short) */
@media (min-width: 900px), (min-aspect-ratio: 5/4) {
  .story--home .story__side--text { width: min(440px, calc(var(--frame-w) - 230px)); }
}
@media (min-width: 900px) and (max-aspect-ratio: 4/3) {
  .story--home .story__side--text { width: min(440px, calc(var(--frame-w) - 230px)); }
}
/* "Services we offer" heading + disclosure above the walk */
.home-walk-intro { padding-bottom: 0.5rem; }
.home-walk-intro .section__intro { margin-bottom: 0; }