.seccion-portada {

   img,
   video {
      height: 100%;
   }

   a {
      position: absolute;
      top: 70%;
      left: 0;
      right: 0;
      margin: 0 auto;
      color: var(--color-blanco);
      font-size: 1.3rem;
      font-weight: bold;
      text-decoration: none;
      padding: 1em 2em;
      background-color: var(--color-primario);
      border-radius: var(--radio-borde-boton);
      z-index: 1;
      width: max-content;
   }
}

.seccion-acerca-de-pl-sql {
   justify-content: center;
   align-items: center;
   padding-block-end: 7em;

   .contenedor-informacion {
      display: flex;
      flex-direction: column;
      gap: 1em;
      max-width: 700px;
      margin: 0 auto;

      h2 {
         font-size: 4rem;
         font-weight: normal;
         text-align: center;
      }

      p {
         text-align: center;
      }

      a {
         margin: 1em auto 0;
         padding: 1em 2em;
         background-color: var(--color-negro-menos-intenso-0);
         color: var(--color-blanco);
         border-radius: var(--radio-borde-boton);
         font-size: 1.1rem;
      }
   }
}

.seccion-desarrollo-personal {
   min-height: 100dvh;
   justify-content: center;
   align-items: center;
   background-color: var(--color-negro-menos-intenso-0);

   .contenedor-informacion {
      display: flex;
      flex-direction: column;
      gap: 1em;
      max-width: 1200px;

      h2 {
         font-size: 3rem;
         font-weight: normal;
         text-align: center;
         color: var(--color-blanco);
      }

      .contenedor-imagenes {
         display: grid;
         grid-template-columns: 1fr;
         gap: 1em;

         article {
            display: flex;
            flex-direction: column;
            gap: 1em;

            img {
               width: 100%;
               height: 200px;
               object-fit: cover;
               border-radius: 1em;
            }

            span {
               font-size: 1.1rem;
               text-align: center;
               color: var(--color-blanco);
            }
         }
      }

      a {
         margin: 1em auto 0;
         padding: 1em 2em;
         background-color: var(--color-blanco);
         border-radius: var(--radio-borde-boton);
         font-size: 1.1rem;
      }
   }


}

.seccion-servicios {
   min-height: 100dvh;
   justify-content: center;
   align-items: center;

   .contenedor-informacion {
      display: flex;
      flex-direction: column;
      gap: 1em;
      max-width: 1000px;

      .contenedor-general {
         display: grid;
         grid-template-columns: 1fr;
         gap: 4em;

         .contenedor-texto {
            display: flex;
            flex-direction: column;
            gap: 1em;

            h2 {
               font-size: 3rem;
               text-align: center;
            }
         }

         .contenedor-detalle {
            display: grid;
            grid-template-columns: max-content 1fr;
            gap: 1em;
            /* align-items: center; */

            span {
               font-size: 2rem;
               font-weight: bold;
               font-family: "Hammersmith";
               margin-top: .2em;
            }

            p {
               font-size: 1.2rem;
            }
         }
      }

      a {
         margin: 1em auto 0;
         padding: 1em 2em;
         background-color: var(--color-negro-menos-intenso-0);
         color: var(--color-blanco);
         border-radius: var(--radio-borde-boton);
         font-size: 1.1rem;
      }
   }

}

.seccion-caracteristicas {
   min-height: 100dvh;
   justify-content: center;
   align-items: center;

   img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: bottom;
   }

   .contenedor-informacion {
      display: grid;
      grid-template-columns: 1fr;
      max-width: 1300px;
      margin: 0 auto;

      .div {
         width: 100%;
      }

      .contenedor-texto {
         display: flex;
         flex-direction: column;
         gap: 1em;
         background-color: var(--color-blanco-transparente-3);
         padding: 1em;
         border-radius: var(--radio-borde-boton);
         backdrop-filter: blur(5px);

         h2 {
            font-size: 2rem;
         }

         p {
            text-align: center;
         }

         a {
            margin: 1em auto 0;
            padding: 1em 2em;
            background-color: var(--color-negro-menos-intenso-0);
            color: var(--color-blanco);
            border-radius: var(--radio-borde-boton);
            font-size: 1.1rem;
         }
      }
   }
}

@media (min-width: 768px) {
   .seccion-desarrollo-personal {
      .contenedor-informacion {
         h2 {
            font-size: 4rem;
         }

         .contenedor-imagenes {
            grid-template-columns: repeat(3, 1fr);
         }
      }
   }

   .seccion-servicios {
      .contenedor-informacion {
         .contenedor-general {
            grid-template-columns: repeat(2, 1fr);

            .contenedor-texto {
               h2 {
                  font-size: 4rem;
                  text-align: left;
               }
            }

            .contenedor-detalle {
               span {
                  font-size: 3rem;
                  margin-top: 0em;
               }

            }
         }
      }
   }

   .seccion-caracteristicas {
      .contenedor-informacion {
         .contenedor-texto {
            h2 {
               font-size: 4rem;
            }
         }
      }
   }
}

@media (min-width: 1024px) {
   .seccion-caracteristicas {
      
      .contenedor-informacion {
         display: flex;

         .div {
            width: 100%;
         }

         .contenedor-texto {
            backdrop-filter: blur(0px);
            background-color: transparent;

            h2 {
               text-align: left;
            }

            p {
               text-align: left;
            }
         }
      }
   }
}

@media (min-width: 1100px) {
   .seccion-caracteristicas {
      .contenedor-informacion {
         .contenedor-texto {
            width: 50%;
         }
      }
   }
}