html {
  background-color: rgb(252, 248, 238);
  /*background-color: white; */
}

.oswald-text {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

.divContainer {
  width: 100%;
  height: 100%;
  position: absolute;
}

.text {
  position: absolute;
  top: 20%;
  left: 13%;
}

#homepageButtonDiv {

  flex-basis: 7em;

  margin-left: 1%;
  margin-top: 1%;
  flex-shrink: 0;
  align-items: center;
  display: flex;


}

p{

  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 450;
  font-style: normal;
  font-size: 120%;
  line-height: 1.2;
  margin: 0;
  position: right;
}

#homepageButtonDiv a {
  display: flex;         /* ¡LA CLAVE! Trata el <a> como contenedor flex */
  align-items: center;   /* Alinea verticalmente el SVG y el Texto */
  gap: 5px;             /* Espacio entre el SVG y el Texto (ajusta) */
  text-decoration: none; /* Quita el subrayado del enlace */
  color: black;          /* O el color que desees para el texto */
  /* background-color: lightblue; /* Fondo para depurar el área del enlace */
}

/* --- Estilo del SVG Cuadrado/Árbol --- */
#homepageButtonDiv a #homepageSquare {
  width: 30%;   /* Dale un tamaño fijo al SVG (ajusta) */
  height: 30%;  /* Dale un tamaño fijo al SVG (ajusta) */
  display: block; /* Buena práctica para SVG */
  flex-shrink: 0; /* Evita que el SVG se encoja */
}