.wpplatform-contact-social {
  padding-block: var(--school-section-padding-y-lg);
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--school-secondary) 11%, transparent), color-mix(in srgb, var(--school-primary) 8%, transparent)),
    var(--school-surface);
}

.wpplatform-contact-social__layout {
  align-items: center;
  gap: var(--school-space-6);
}

.wpplatform-contact-social__content h2 {
  max-width: 12ch;
  color: var(--school-heading);
}

.wpplatform-contact-social__links {
  margin-top: var(--school-space-3);
  justify-content: center;
}

.wpplatform-contact-social__card {
  overflow: hidden;
  border: var(--school-card-border-width) solid var(--school-card-border-color);
  border-radius: var(--school-card-radius);
  background: var(--school-card-background);
  box-shadow: var(--school-shadow-md);
  margin: var(--school-space-3);
  padding: var(--school-space-4);
}

.wpplatform-contact-social__card .wp-block-image,
.wpplatform-contact-social__card .wp-block-image img {
  width: 100%;
}

.wpplatform-contact-social__card .wp-block-image img {
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.wpplatform-contact-social__card > :not(.wp-block-image) {
  margin-inline: var(--school-space-3);
}

.wpplatform-contact-social__card > :last-child {
  margin-bottom: var(--school-space-3);
}

.wpplatform-contact-social__layout
.wpplatform-contact-social__card 
.wpplatform-contact-social__label {
  color: var(--school-primary);
  font-size: var(--wp--preset--font-size--x-small);
  font-weight: 700;
  text-transform: uppercase;
  margin-block-start: 20px;
}

@media (max-width: 781px) {
  .wpplatform-contact-social__layout {
    gap: var(--school-space-4);
  }
}

@media (max-width: 599px) {
  .wpplatform-contact-social {
    padding-block: var(--school-section-padding-y-mobile);
  }
}