#service {
  scroll-margin: 100px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 25px;
}

.service--card {
  display: grid;
  grid-template-columns: 0.4fr 0.6fr;
  grid-template-rows: auto auto;
  gap: 10px 30px;
  align-items: start;
  margin-bottom: 40px;
}

.service--card img {
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 100%; /* o el ancho que necesites */
  height: auto;
  object-fit: cover;
  border-radius: 15px;
}

/* Título: columna 2, fila 1 */
.service--card h3 {
  grid-column: 2;
  grid-row: 1;
  margin: 0; /* quita márgenes por defecto si quieres */
}

/* Párrafo: columna 2, fila 2 */
.service--card p {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
}

/* Para las pares, invierte las columnas */
.service--card:nth-child(2n) {
  grid-template-columns: 0.6fr 0.4fr;
}

.service--card:nth-child(2n) img {
  grid-column: 2 / 3;
}

.service--card:nth-child(2n) h3,
.service--card:nth-child(2n) p {
  grid-column: 1 / 2;
}