
:root {
  --font: 'Oxygen', sans-serif;
  --primary: #42E2B8;
  --gradient: linear-gradient(135deg, #FAD7A1 0%, #E96D71 100%);
  --black: black;
}

body {
  font-family: var(--font);
  background: var(--gradient);
  margin: 0;
}
/* Galería en columna, imágenes centradas */
.gallery {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 10px;
}

.gallery img {
  width: 90%;
  max-width: 600px;
  height: auto;
  max-height: 500px; /* Limita altura para verticales */
  object-fit: contain; /* Mantiene proporción sin recortar */
  border-radius: 5px;
  display: block;
  margin: 0 auto;
}

/* Imagen de perfil */
.imagen_yo img {
  max-width: 250px;
  display: block;
  margin: 0 auto 20px;
  border-radius: 5px;
}

/* Redes sociales */
.social {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin: 15px 0;
}

.social img {
  width: 32px;
  height: 32px;
}

footer {
  margin-top: 20px;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.w3-section {
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.social-item {
  background: var(--primary);
  display: inline-flex;
  inline-size: 44px;
  block-size: 44px;
  text-align: center;
  line-height: 44px;
  align-items: center;
  border-radius: 4px;
  justify-content: center;
  border: 2px solid var(--black);
}

.social-item + .social-item {
  margin-left: 1em;
}

.social-item img {
  vertical-align: middle;
}

/* Contacto: centrar y limitar ancho del formulario */
#contact form {
  max-width: 600px;
  margin: 0 auto;
  padding: 0 15px;
}

/* Para móviles un poco más estrecho */
@media (max-width: 480px) {
  .gallery img {
    width: 95%;
    max-width: 100%;
    max-height: 400px;
  }
  
  #contact form {
    padding: 0 10px;
  }
}
