/* Selected card refinements only. All other homepage sections keep their design. */
body.sdl-hero-preview {
  --sdl-card-radius: 12px;
  --sdl-card-line: #e1e5ea;
  --sdl-card-shadow: 0 10px 24px rgb(24 35 49 / 6%);
}

/* Six overview cards: a quieter frame, balanced spacing and a shared corner. */
body.sdl-hero-preview #top-main .service-card {
  padding-top: 16px;
  padding-bottom: 18px;
  border-color: var(--sdl-card-line);
  border-radius: var(--sdl-card-radius);
}
body.sdl-hero-preview #top-main .service-card__topline { margin-bottom: 6px; }
body.sdl-hero-preview #top-main .service-card p { line-height: 1.8; }
body.sdl-hero-preview #top-main .service-card::before {
  left: 16px;
  width: 32px;
}
body.sdl-hero-preview #top-main .service-card-link:is(:hover, :focus-visible) .service-card {
  border-color: #d9b9bf;
  box-shadow: var(--sdl-card-shadow);
}
body.sdl-hero-preview #top-main .service-card-link:is(:hover, :focus-visible) .service-card::before {
  width: calc(100% - 32px);
}

/* Both faces of each detailed card keep the same silhouette while flipping. */
body.sdl-hero-preview #top-main .sdl-service,
body.sdl-hero-preview #top-main .sdl-service__face {
  border-radius: var(--sdl-card-radius);
}
body.sdl-hero-preview #top-main .sdl-service__face {
  border-color: var(--sdl-card-line);
  transition: border-color .25s ease, box-shadow .25s ease;
}
body.sdl-hero-preview #top-main .sdl-service__face--back { border-color: #e8cdd1; }
body.sdl-hero-preview #top-main .sdl-service__face::before {
  left: 24px;
  width: 40px;
}
body.sdl-hero-preview #top-main .sdl-service::after {
  border-radius: calc(var(--sdl-card-radius) + 2px);
}
body.sdl-hero-preview #top-main .sdl-service__themes li { border-radius: 4px; }

/* Text links match the existing company and case-study links. */
body.sdl-hero-preview #top-main .sdl-service-page-link,
body.sdl-hero-preview #top-main .sdl-service__cases { font-weight: 600; }
body.sdl-hero-preview #top-main .sdl-service-page-link:hover > span:first-child {
  border-bottom-color: currentColor;
}
@media (hover: hover) and (pointer: fine) {
  body.sdl-hero-preview #top-main .sdl-service:hover .sdl-service__face {
    border-color: #d9b9bf;
    box-shadow: var(--sdl-card-shadow);
  }
}
body.sdl-hero-preview #top-main .sdl-service:focus-within .sdl-service__face {
  border-color: #d9b9bf;
  box-shadow: var(--sdl-card-shadow);
}
@media (max-width: 540px) {
  body.sdl-hero-preview #top-main .service-card {
    padding-top: 14px;
    padding-bottom: 16px;
  }
  body.sdl-hero-preview #top-main .service-card::before { left: 12px; width: 28px; }
  body.sdl-hero-preview #top-main .service-card-link:is(:hover, :focus-visible) .service-card::before {
    width: calc(100% - 24px);
  }
  body.sdl-hero-preview #top-main .sdl-service__face::before { left: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  body.sdl-hero-preview #top-main .sdl-service__face { transition: none; }
}