/* Extracted verbatim from ../../../css/style.css:506-537 (+ mobile override
   at css/style.css:2020-2025). .s-card / .s-card-wrap bases live in
   bridge-tokens.css since they're shared floating-card scaffolding; this file
   is the image-card-specific layer on top of them. */

.s-card.card-image {
  background: var(--darknavy);
  padding-top: 160px;
  padding-bottom: 160px;
  min-height: 560px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.card-image-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
}

.card-image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(6,14,42,0.2) 0%, rgba(6,14,42,0.85) 70%);
  border-radius: 8px;
}

.card-image-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

@media (max-width: 768px) {
  .s-card.card-image {
    min-height: 400px;
    padding-top: 120px;
    padding-bottom: 48px;
  }
}