/* Capabilities page: four operational layers, September 2026 */

.page-capabilities .split__illo {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid var(--brand-line);
  background-color: #102d58;
  background-position: center;
  background-size: cover;
}

.page-capabilities .split__illo::after {
  position: absolute;
  inset: 0;
  background: rgba(12, 74, 158, .1);
  content: "";
  pointer-events: none;
}

.page-capabilities .split__illo > svg { display: none; }
.page-capabilities #content .split__illo { background-image: url("../img/scenes/client-workshop.webp"); }
.page-capabilities #seo .split__illo { background-image: url("../img/scenes/geo-research.webp"); }
.page-capabilities #pim .split__illo { background-image: url("../img/scenes/commerce-growth.webp"); }
.page-capabilities #i18n .split__illo { background-image: url("../img/scenes/export-growth.webp"); }

@supports (background-image: image-set(url("x.avif") type("image/avif"))) {
  .page-capabilities #content .split__illo { background-image: image-set(url("../img/scenes/client-workshop.avif") type("image/avif"), url("../img/scenes/client-workshop.webp") type("image/webp")); }
  .page-capabilities #seo .split__illo { background-image: image-set(url("../img/scenes/geo-research.avif") type("image/avif"), url("../img/scenes/geo-research.webp") type("image/webp")); }
  .page-capabilities #pim .split__illo { background-image: image-set(url("../img/scenes/commerce-growth.avif") type("image/avif"), url("../img/scenes/commerce-growth.webp") type("image/webp")); }
  .page-capabilities #i18n .split__illo { background-image: image-set(url("../img/scenes/export-growth.avif") type("image/avif"), url("../img/scenes/export-growth.webp") type("image/webp")); }
}

.page-capabilities .featgrid,
.page-capabilities .grid-3,
.page-capabilities .grid-4 {
  border-top: 1px solid var(--brand-line);
}

.page-capabilities .card {
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid var(--brand-line);
  border-left: 1px solid var(--brand-line);
  border-radius: 0;
}

.page-capabilities .card:last-child { border-right: 1px solid var(--brand-line); }
.page-capabilities .cta__illo { min-height: 220px; background: url("../img/favicon.svg") center / 150px 150px no-repeat; }
.page-capabilities .cta__illo > svg { display: none; }

@media (max-width: 900px) {
  .page-capabilities .split__illo { min-height: 320px; }
}

@media (max-width: 640px) {
  .page-capabilities .split__illo { min-height: 240px; }
  .page-capabilities .cta__illo { display: none; }
}
