:root{
  --color-gray-90: hsl(0,0%,90%);
  --color-gray-80: hsl(0,0%,80%);
  --color-gray-50: hsl(0,0%,50%);
  --color-light: hsl(0,0%,100%);
  --font-size-initial: 15px;
  --size-initial: 1px;
}

/* CONTAINERS */
main{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(calc(var(--font-size-initial) * 18), 1fr));
  gap: calc(var(--font-size-initial) * 2);
  margin: auto;
  max-width: calc(var(--font-size-initial) * 70);
  padding: calc(var(--font-size-initial) * 2);
}

section{
  border-radius: calc(var(--font-size-initial) * .5);
  /* box-shadow: 0 calc(var(--size-initial) * 3) calc(var(--size-initial) * 6) hsla(0,0%,0%,.1); */
}

  #section-docencia{
    background: var(--color-light);
  } 

/* section:hover { aquí está el error del hover. 
  background-color: gold;
    transform: scale(1.1); 
} */

article{
  padding: calc(var(--font-size-initial) * 3);
  /* padding-top: 0; */
}

figure{
  height: calc(var(--font-size-initial) * 15);
}

/* IMAGE */
img{
  height: 100%;
  object-fit: cover;
  width: 100%;
}

p{
  font-size: calc(var(--font-size-initial) * 1.075);
  line-height: calc(var(--font-size-initial) * 1.25);
}

span{
  color: var(--color-gray-80);
  font-size: calc(var(--font-size-initial) * .75);
  letter-spacing: calc(var(--size-initial) * .75);
  text-transform: uppercase;
  word-spacing: var(--size-initial);
}