section.service-cards {
  padding: var(--spacing-104) 0;
  background: linear-gradient(
    323deg,
    #e2f2ef 9.79%,
    rgba(255, 255, 255, 0) 98.63%
  );
}

section.service-cards .container {
  max-width: 1256px;
  padding: 0 20px;
  width: 100%;
  margin: 0 auto;
}

section.service-cards .service-cards-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-64);
}

section.service-cards .service-cards-title {
  color: #005159;
  text-align: center;
  font-weight: 500;
  letter-spacing: 1px;
  margin: 0;
  max-width: 600px;
}

section.service-cards .service-cards-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-32);
  width: 100%;
}

section.service-cards .service-card {
  flex: 1 1 calc(50% - var(--spacing-32) / 2);
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  text-decoration: none;
  overflow: hidden;
  border-radius: var(--radius-16);
  border: 1px solid #00a2b1;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

section.service-cards .service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

section.service-cards .service-card-image {
  width: 100%;
  height: 291px;
  min-height: 196px;
  overflow: hidden;
}

section.service-cards .service-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

section.service-cards .service-card-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-16);
  padding: var(--spacing-24);
  background: #fff;
  flex: 1;
}

section.service-cards .service-card-title {
  color: #211e19;
  font-weight: 500;
  letter-spacing: 0.64px;
  margin: 0;
}

section.service-cards .service-card-text {
  color: #656565;
  font-weight: 400;
  margin: 0;
  flex: 1;
}

section.service-cards .service-card-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #211e19;
  font-family: Geist, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 0.28px;
  text-transform: uppercase;
  text-decoration: none;
  margin-top: auto;
  transition: color 0.3s ease;
}

section.service-cards .service-card-link::after {
  content: "";
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'><path d='M11.8534 6.42448L7.35351 11.8242C7.25969 11.9368 7.13245 12 6.99977 12C6.86709 12 6.73985 11.9368 6.64603 11.8242C6.55221 11.7116 6.49951 11.5589 6.49951 11.3997C6.49951 11.2405 6.55221 11.0878 6.64603 10.9752L10.2928 6.59997H0.499984C0.36738 6.59997 0.240207 6.53676 0.146442 6.42424C0.0526768 6.31172 0 6.15912 0 6C0 5.84088 0.0526768 5.68827 0.146442 5.57576C0.240207 5.46324 0.36738 5.40003 0.499984 5.40003H10.2928L6.64603 1.02478C6.55221 0.912198 6.49951 0.75951 6.49951 0.6003C6.49951 0.441091 6.55221 0.288402 6.64603 0.175824C6.73985 0.0632457 6.86709 0 6.99977 0C7.13245 0 7.25969 0.0632457 7.35351 0.175824L11.8534 5.57552C11.8998 5.63124 11.9367 5.69741 11.9619 5.77025C11.987 5.84308 12 5.92115 12 6C12 6.07884 11.987 6.15692 11.9619 6.22975C11.9367 6.30259 11.8998 6.36875 11.8534 6.42448Z' fill='%23211E19'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: background-image 0.3s ease;
}

section.service-cards .service-card:hover .service-card-link {
  color: #00a2b1;
}

section.service-cards .service-card:hover .service-card-link::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'><path d='M11.8534 6.42448L7.35351 11.8242C7.25969 11.9368 7.13245 12 6.99977 12C6.86709 12 6.73985 11.9368 6.64603 11.8242C6.55221 11.7116 6.49951 11.5589 6.49951 11.3997C6.49951 11.2405 6.55221 11.0878 6.64603 10.9752L10.2928 6.59997H0.499984C0.36738 6.59997 0.240207 6.53676 0.146442 6.42424C0.0526768 6.31172 0 6.15912 0 6C0 5.84088 0.0526768 5.68827 0.146442 5.57576C0.240207 5.46324 0.36738 5.40003 0.499984 5.40003H10.2928L6.64603 1.02478C6.55221 0.912198 6.49951 0.75951 6.49951 0.6003C6.49951 0.441091 6.55221 0.288402 6.64603 0.175824C6.73985 0.0632457 6.86709 0 6.99977 0C7.13245 0 7.25969 0.0632457 7.35351 0.175824L11.8534 5.57552C11.8998 5.63124 11.9367 5.69741 11.9619 5.77025C11.987 5.84308 12 5.92115 12 6C12 6.07884 11.987 6.15692 11.9619 6.22975C11.9367 6.30259 11.8998 6.36875 11.8534 6.42448Z' fill='%2300A2B1'/></svg>");
}

/* Tablet */
@media (max-width: 1024px) {
  section.service-cards {
    padding: var(--spacing-80) 56px;
  }

  section.service-cards .service-cards-inner {
    gap: var(--spacing-48);
  }

  section.service-cards .service-cards-grid {
    gap: var(--spacing-24);
  }

  section.service-cards .service-card {
    flex: 1 1 calc(50% - var(--spacing-24) / 2);
  }

  section.service-cards .service-card-image {
    height: 240px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  section.service-cards {
    padding: var(--spacing-56) 0;
  }

  section.service-cards .service-cards-inner {
    gap: var(--spacing-32);
  }

  section.service-cards .service-cards-grid {
    flex-direction: column;
    gap: var(--spacing-24);
  }

  section.service-cards .service-card {
    flex: 1 1 100%;
    width: 100%;
  }

  section.service-cards .service-card-image {
    height: 220px;
  }

  section.service-cards .service-card-content {
    padding: var(--spacing-20);
    gap: var(--spacing-12);
  }
}