/*

 Theme Name:   GeneratePress Child

 Theme URI:    https://generatepress.com

 Description:  Default GeneratePress child theme

 Author:       Tom Usborne

 Author URI:   https://tomusborne.com

 Template:     generatepress

 Version:      0.1

*/

@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');


/* VARIABLES POR DEFECTO */



:root {



  --c-negro: #000000;

  --c-blanco: #F7F7F5;

  --c-grisoscuro: #333333;

  --c-grismedio: #969696;

  --c-grisclaro: #EFEFEF;

  --c-gris: #f9f9f9;

  --c-rojo: #A61E2D;

  --c-rojo-hover: #7F1622;

  --f-primaria: 'Playfair Display', sans-serif;

  --f-secundaria: 'Nunito', sans-serif;



  --all-animation: all 0.5s ease-in-out;

  --all-animation-large: all 0.8s ease-in-out;



}



/* OUTLINE */

*:focus {

  outline: 5px solid orange;

}



/* ESTILOS COMUNES */

.zindex0 {

  z-index: 0;

}



.zindex1 {

  z-index: 1;

}



body {

  font-family: var(--f-secundaria);

  color: var(--c-negro);

  font-size: 15px;

  line-height: 1.3em;

  font-weight: 300;

}



p {

  margin-bottom: 20px;



  &:last-child {

    margin-bottom: 0;

  }

}



a {

  color: var(--c-negro);

  text-decoration: none;

}



a,

a:hover {

  transition: all 0.4s ease !important;

}





/* LISTAS */

.lista {

  ul {

    list-style: none;

    margin: 0 0 0 25px;



    li {

      position: relative;

      margin-bottom: 10px;



      &::before {

        content: "";

        position: absolute;

        background-color: var(--c-grismedio);

        width: 10px;

        height: 10px;

        top: 7px;

        left: -20px;

        border-radius: 20px;

      }

    }

  }

}





/* TÍTULOS */

h1,

h2,

h3,

h4,

h5,

h6 {

  font-family: var(--f-primaria) !important;

  font-weight: 600;

  line-height: 1.2em !important;

  text-transform: uppercase;

  letter-spacing: 1px !important;

}



h1 {

  font-size: clamp(20px, 5vw, 34px);



  @media screen and (max-width: 768px) {

    font-size: 26px;

  }

}







h2 {

  font-size: clamp(20px, 3vw, 30px);



  @media screen and (max-width: 768px) {

    font-size: 20px;

  }

}



h3 {

  font-size: clamp(20px, 2vw, 20px);

  text-transform: unset;

  @media screen and (max-width: 768px) {

    font-size: 17px;

  }

}



h4 {

  font-size: clamp(18px, 1.5vw, 18px);

}





/* SERVICIOS HOME */

.caja-servicio {

  transition: var(--all-animation);



  .tit-servicio {

    transition: var(--all-animation);

    opacity: 0;

    transform: translateY(100px);

  }



  &:hover {

    transition: var(--all-animation);



    .tit-servicio {

      opacity: 1;

      transform: translateY(0);

      transition: var(--all-animation);

    }

  }

}





/* -- HEADER -- */

.menu-pc {

  .menu-item {

    a {

      font-family: var(--f-primaria) !important;

      font-weight: 800 !important;

      letter-spacing: 1px;

    }

  }

}



.menu-header {

  .menu-item {

    a {

      /* font-family: var(--f-secundaria); */

      font-family: var(--f-primaria) !important;

      font-size: 1rem;

      color: var(--c-negro);

      position: relative;

      margin: 0;

      transition: var(--all-animation);

      font-weight: 800 !important;

      letter-spacing: 1px;

      text-transform: uppercase;



      &::after {

        content: "";

        background-color: var(--c-grismedio);

        width: 0;

        height: 1px;

        position: absolute;

        left: 0;

        bottom: 0;

        transition: var(--all-animation);

      }



      &:hover {

        color: var(--c-grismedio);



        &::after {

          width: 100%;

        }

      }

    }



    &.current-menu-item {

      a {

        color: var(--c-negro);



        &::after {

          width: 100%;

        }

      }

    }

  }

}







/* FORMULARIO POR PANTALLAS */

.form-contacto {

  .form-row {

    display: flex;

    justify-content: space-between;

    align-items: center;

    flex-wrap: wrap;

    gap: 20px 0;



    p {

      margin-bottom: 0;

    }



    .col {

      flex: 0 0 31%;

    }



    .col100 {

      flex: 0 0 100%;

    }

  }



  input,

  select,

  textarea {

    font-family: var(--f-secundaria);

    background-color: var(--c-blanco);

    border: 1px solid var(--c-grismedio);

    width: 100%;

    border-radius: 0;

    padding: 10px 15px;

  }



  textarea {

    max-height: 125px;

    resize: none;

  }



  label {

    display: inline-block;

    margin-bottom: 10px;

  }



  input[type="submit"] {

    color: var(--c-blanco);

    padding: 15px 30px;

    margin: 0px;

    background-color: var(--c-negro);

    border-radius: 0;

    border: 1px solid var(--c-negro);

    font-family: var(--f-secundaria);

    font-size: 1rem;

    font-weight: 600;

    letter-spacing: 0.5px;

    overflow: hidden;

    z-index: 1;

    width: 160px;

    text-align: center;

    justify-content: center;

    transition: all .4s ease;



    &:hover {

      background-color: var(--c-blanco);

      color: var(--c-negro);

    }

  }



  .wpcf7-acceptance {

    .wpcf7-list-item {

      margin: 40px 0 0;

      width: 100%;



      label {

        width: 100%;

        display: flex;

        align-items: center;

        justify-content: flex-start;

        gap: 8px;



        input {

          width: fit-content;

          position: relative;

          width: 16px;

          height: 16px;

          padding: 0;

          transition: all 0.4s ease;

        }

      }

    }

  }



  span.wpcf7-not-valid-tip {

    font-size: 12px !important;

    margin-left: 0px !important;

    margin-top: 10px !important;

  }



  .wpcf7-spinner {

    width: 100%;

    height: 0;

    visibility: hidden;

  }



  .info-legal {

    font-size: 12px;

    line-height: 1.3em;

  }

}

.bloque-mov {

    transition: transform .3s ease, box-shadow .3s ease;

    &:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 30px rgba(0,0,0,.08);
    }

}

.elementor-image-carousel {

    .swiper-slide {

        img {
            filter: grayscale(100%);
            transition: filter .35s ease;
        }

        &:hover {

            img {
                filter: grayscale(0%);
            }

        }

    }

}



/* BLOG */

.posts-blog {

  article {

    border-bottom: 1px solid var(--c-gris);



    .elementor-post__text {

      justify-content: center;



      .elementor-post__excerpt {

        max-height: fit-content;

      }

    }

  }

}



.bloque-proyectos {

  .elementor-loop-container {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 20px;



    .e-loop-item {

      flex: 0 0 31%;

      

    }

  }

}



/* paginas de proyectos */

.single-post {

  .e-con-inner {

    max-width: 1440px;

  }

}



/* ---------- RESPONSIVE ---------- */



@media screen and (max-width: 1024px) {

  .caja-servicio {

    .tit-servicio {

      opacity: 1;

      transform: translateY(0);

      transition: var(--all-animation-large);

    }

  }

}



@media screen and (max-width: 800px) {

  .posts-blog {

    article {

      flex-direction: column !important;

      border: none;



      .elementor-post__text {

        border-bottom: 1px solid var(--c-gris);

      }

    }

  }



  .bloque-proyectos {

    .elementor-loop-container {

      gap: 10px;



      .e-loop-item {

        flex: 0 0 45%;

        



        @media screen and (max-width: 600px) {

          flex: 0 0 100%;

        }

      }

    }

  }

}



@media screen and (max-width: 600px) {

  .form-contacto {

    .form-row {

      flex-direction: column;



      .col {

        flex: 0 0 100%;

      }

    }

  }

}



@media screen and (max-width: 560px) {}







/* CAPTCHA */

.grecaptcha-badge {

  display: none;

}