* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  background: #f4efe7;
  color: #171717;
}

.pagina {
  width: min(1180px, 90%);
  margin: 0 auto;
  padding: 80px 0;
}


/* PARTE SUPERIOR */

.inicio {
  display: grid;
  grid-template-columns: 0.85fr 1.35fr;
  gap: 90px;
  align-items: start;
  margin-bottom: 120px;
}

.intro {
  padding-top: 10px;
}

.mini-titulo {
  font-size: 11px;
  letter-spacing: 2px;
  margin-bottom: 28px;
  color: #286b68;
}

.intro h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 54px;
  font-weight: normal;
  line-height: 0.98;
  max-width: 430px;
  margin-bottom: 35px;
}

.descripcion {
  max-width: 390px;
  font-size: 15px;
  line-height: 1.7;
  color: #555;
  margin-bottom: 35px;
}

.boton {
  display: inline-block;
  text-decoration: none;
  color: #f4efe7;
  background: #286b68;
  padding: 13px 20px;
  font-size: 13px;
}


/* GRID DE TARJETAS */

.servicios {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

.tarjeta {
  min-height: 210px;
  border: 1px solid #bdb7ad;
  padding: 26px;

  display: flex;
  flex-direction: column;
}

.categoria {
  font-size: 10px;
  letter-spacing: 1.5px;
  color: #286b68;
}

.tarjeta h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  line-height: 1.15;
  font-weight: normal;
  margin-top: auto;
  max-width: 250px;
}

.tarjeta span {
  font-size: 11px;
  margin-top: 25px;
  color: #777;
}


/* BLOQUE INFERIOR */

.deportes {
  display: flex;
  min-height: 470px;
}

.foto {
  width: 58%;
  overflow: hidden;
}

.foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.texto-deportes {
  width: 42%;
  background: #243b3a;
  color: #fff;
  padding: 60px 50px;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.claro {
  color: #d4ddd9;
}

.texto-deportes h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 46px;
  font-weight: normal;
  line-height: 1;
  margin-bottom: 35px;
}

.texto-deportes > p:not(.mini-titulo) {
  font-size: 14px;
  line-height: 1.7;
  color: #e6e6e6;
  max-width: 350px;
}

.boton-claro {
  background: transparent;
  border: 1px solid #fff;
  margin-top: auto;
}


/* MÓVIL */

@media (max-width: 800px) {

  .pagina {
    padding: 45px 0;
  }

  .inicio {
    grid-template-columns: 1fr;
    gap: 55px;
    margin-bottom: 70px;
  }

  .intro h1 {
    font-size: 43px;
  }

  .servicios {
    grid-template-columns: 1fr;
  }

  .deportes {
    flex-direction: column;
  }

  .foto,
  .texto-deportes {
    width: 100%;
  }

  .foto {
    height: 320px;
  }

  .texto-deportes {
    min-height: 420px;
  }
}