.az-site .az-platforms {
  width: 100%;
  padding-block: var(--az-section-space);
  background: var(--az-brand-blue);
  color: color-mix(in srgb, var(--az-surface) 96%, transparent);
  position: relative;
  overflow: hidden;
}

.az-site .az-platforms > .az-container {
  width: 100%;
  max-width: var(--az-container-max);
  margin-inline: auto;
  padding-inline: clamp(16px, 2vw, 24px);
  box-sizing: border-box;
}

.az-site .az-platforms::before {
  content: "";
  position: absolute;
  inset: -120px;
  background:
    radial-gradient(700px 420px at 85% 20%, color-mix(in srgb, var(--az-brand-blue) 28%, transparent), transparent 60%),
    radial-gradient(520px 360px at 20% 70%, color-mix(in srgb, var(--az-brand-blue-dark) 22%, transparent), transparent 62%),
    linear-gradient(135deg, color-mix(in srgb, var(--az-brand-blue) 10%, transparent), color-mix(in srgb, var(--az-brand-blue-dark) 10%, transparent));
  pointer-events: none;
  z-index: 0;
}

.az-site .az-platforms::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--az-brand-gold),
      transparent
    ) top / 100% 2px no-repeat;
  opacity: 0.18;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 0;
}

.az-site .az-platforms > * {
  position: relative;
  z-index: 1;
}

.az-site .az-platforms__head {
  max-inline-size: 46rem;
  margin: 0 auto clamp(var(--az-space-5), 3vw, var(--az-space-7));
  text-align: center;
}

.az-site .az-platforms__title {
  margin: 0 0 var(--az-space-3);
  color: color-mix(in srgb, var(--az-surface) 96%, transparent);
}

.az-site .az-platforms__text {
  color: color-mix(in srgb, var(--az-surface) 84%, transparent);
  line-height: var(--az-line-base);
  margin-bottom: 14px;
}

.az-site .az-platforms__text p:last-child {
  margin-bottom: 0;
}

.az-site .az-platforms__grid {
  display: grid;
  gap: clamp(var(--az-space-3), 2.2vw, var(--az-space-5));
}

.az-site .az-platforms__card {
  display: grid;
  gap: var(--az-space-3);
  min-height: 100%;
  position: relative;
  overflow: clip;
  border: 1px solid var(--az-border);
  border-radius: var(--az-radius-module);
  background: var(--az-surface);
  color: var(--az-text);
  padding: clamp(var(--az-space-5), 2.2vw, var(--az-space-6));
  box-shadow: var(--az-shadow-sm);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease, background-color 200ms ease;
}

.az-site .az-platforms__card::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  inline-size: clamp(2.5rem, 22%, 4.25rem);
  block-size: 2px;
  background: color-mix(in srgb, var(--az-brand-gold) 58%, transparent);
  pointer-events: none;
}

.az-site .az-platforms__card:hover,
.az-site .az-platforms__card:focus-within {
  border-color: var(--az-brand-gold);
  background: var(--az-surface-2);
}

@media (hover: hover) {
  .az-site .az-platforms__card:hover,
  .az-site .az-platforms__card:focus-within {
    transform: translateY(-2px);
    box-shadow: var(--az-shadow-md);
  }
}

.az-site .az-platforms__card-main {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: clamp(var(--az-space-3), 2vw, var(--az-space-4));
  align-items: start;
}

.az-site .az-platforms__content {
  min-width: 0;
  display: grid;
  gap: var(--az-space-2);
}

.az-site .az-platforms__num {
  inline-size: 44px;
  block-size: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  border: 1px solid var(--az-border);
  background: color-mix(in srgb, var(--az-primary) 12%, var(--az-surface));
  color: var(--az-text);
  font-size: var(--az-font-size-sm);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
}

.az-site .az-platforms__icon {
  inline-size: clamp(2.25rem, 3vw, 2.75rem);
  block-size: clamp(2.25rem, 3vw, 2.75rem);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--az-radius-card);
  border: 1px solid color-mix(in srgb, var(--az-brand-silver) 70%, transparent);
  background: color-mix(in srgb, var(--az-surface) 94%, var(--az-brand-blue) 6%);
  overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .az-site .az-platforms__card {
    transition: none !important;
    transform: none !important;
  }
}

.az-site .az-platforms__icon img {
  display: block;
  width: auto;
  height: auto;
  max-inline-size: 100%;
  max-block-size: 100%;
  opacity: 0.9;
  filter: saturate(0.45) contrast(1.06);
}

.az-site .az-platforms .az-platforms__icon img[src$=".svg"],
.az-site .az-platforms .az-platforms__icon img[src*=".svg?"] {
  filter: saturate(0.3) contrast(1.02) brightness(1.08);
}

.az-site .az-platforms__item-title {
  margin: 0;
  font-size: var(--az-font-size-lg);
  font-weight: 700;
  line-height: 1.3;
}

.az-site .az-platforms__item-link {
  color: inherit;
  text-decoration: none;
}

.az-site .az-platforms__item-link:hover,
.az-site .az-platforms__item-link:focus-visible {
  text-decoration: underline;
}

.az-site .az-platforms__item-text {
  color: var(--az-muted);
  line-height: var(--az-line-base);
}

.az-site .az-platforms__item-text p:last-child {
  margin-bottom: 0;
}

.az-site .az-platforms--structured .az-platforms__footer,
.az-site .az-platforms--structured .az-platforms__cta,
.az-site .az-platforms--structured .az-platforms__actions {
  justify-self: start;
  align-self: start;
  margin-top: var(--az-space-4);
  padding-top: var(--az-space-3);
  border-top: 1px solid var(--az-border);
}

.az-site .az-platforms--structured .az-platforms__footer a,
.az-site .az-platforms--structured .az-platforms__cta a,
.az-site .az-platforms--structured .az-platforms__actions a {
  font-size: var(--az-font-size-sm);
  color: var(--az-brand-gold);
}

@media (min-width: 640px) {
  .az-site .az-platforms--cols-2 .az-platforms__grid,
  .az-site .az-platforms--cols-3 .az-platforms__grid,
  .az-site .az-platforms--cols-4 .az-platforms__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .az-site .az-platforms--cols-3 .az-platforms__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .az-site .az-platforms--cols-4 .az-platforms__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
