/*
 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
*/
html {
  scrollbar-color: var(--c-rojo) var(--c-acero-oscuro);
  /* Firefox: pastilla, fondo */
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: var(--c-acero-oscuro);
}

::-webkit-scrollbar-thumb {
  background-color: var(--c-rojo);
  border-radius: 8px;
  border: 2px solid var(--c-acero-oscuro);
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--c-rojo);
}


body {
  font-family: var(--tipo-general);
  font-size: var(--font-size-txt);
  color: var(--c-grafito-profundo);
}

p {
  margin-bottom: 0px !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--tipo-titulos) !important;
}

.tit-h1 {
  h1 {
    /* font-family: var(--tipo-bold) !important; */
    font-size: var(--tit-size);

    span {
      color: var(--c-acero-oscuro)
    }
  }
}

.tit-h2 {
  h2 {
    font-size: var(--subtith2-size);
  }
}

.tit-h3 {
  h3 {
    font-size: var(--subtith3-size);
  }
}

.tit-project {

  h3,
  h2 {
    font-size: var(--tit-size);
  }
}

.subtit-project {
  font-family: var(--tipo-titulos);
}

#content>div:first-child {
  overflow: hidden;
}

.c-blanco,
.c-blanco p {
  color: var(--c-blanco);
}

.copyright {
  font-size: var(--letpq-size) !important;
  color: var(--c-acero);
  transition: var(--transition-p);

  a {
    color: var(--c-secondary);
    transition: var(--transition-p);

    &:hover {
      transition: var(--transition-p);
      color: var(--c-primary);
    }
  }
}

.ver-video {
  .elementor-custom-embed-play {
    position: relative;
    min-height: 50px;
    min-width: 200px;
    max-width: 200px;
    border-radius: 50px;
    border: 1px solid var(--c-blanco);
    transition: var(--transition-p);

    svg {
      position: absolute;
      transform: translateX(0px);
      transition: var(--transitions-large);
      left: 0px;
    }

    &::after {
      content: 'Ver vídeo';
      position: absolute !important;
      z-index: 1;
      font-family: var(--tipo-titulos);
      top: 12px;
      left: 32%;
      color: var(--c-acero);
      transition: var(--transition-p);

    }
  }

  &:hover {
    .elementor-custom-embed-play {
      transition: var(--transition-p);
      background-color: var(--c-rojo);

      &::after {
        color: var(--c-blanco);
        transition: var(--transition-p);
      }

      svg {
        transition: var(--transitions-large);
        transform: translateX(150px) rotate(180deg);
      }
    }
  }
}

.interactivo {
  iframe {
    min-height: 600px;
  }
}



/* BG SIZE ANIMATIONS */
.bg-shrink {
  -webkit-clip-path: inset(0% 0% 0% 0% round 40px);
  clip-path: inset(0% 0% 0% 0% round 40px);
  transition: -webkit-clip-path 0.1s linear;
  transition: clip-path 0.1s linear;
  transition: clip-path 0.1s linear, -webkit-clip-path 0.1s linear;
}

.bg-grow {
  -webkit-clip-path: inset(10% 10% 10% 10% round 40px);
  clip-path: inset(10% 10% 10% 10% round 40px);
  transition: -webkit-clip-path 0.1s linear;
  transition: clip-path 0.1s linear;
  transition: clip-path 0.1s linear, -webkit-clip-path 0.1s linear;
}

.blur {
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px)
}

.blur-v2 {
  -webkit-backdrop-filter: blur(36px);
  backdrop-filter: blur(36px);
  background: linear-gradient(180deg, var(--token-365216f8-7ee6-4f9f-94e0-ca7d584e4354, #fffefa00) 0%, var(--token-43dae1eb-abd5-4d5a-a1bb-b05d36b50058, #fffefa05) 100%);
  z-index: 1;
  flex: none;
  width: 100%;
  height: 54%;
  position: absolute;
  bottom: 0;
  left: 0%;
  overflow: hidden;
  -webkit-mask: linear-gradient(#0000 0%, #000000e6 46%, #000 100%);
  mask: linear-gradient(#0000 0%, #000000e6 46%, #000 100%);
}

.bg-blur {
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: #ffffff73;
}

.bg-blur-dark {
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: #00000073;
}

.card {
  position: relative;
  padding: 2rem;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  color: white;

  /* El truco del borde gradiente */
  border: 1px solid transparent;
  background-clip: padding-box;

}

.card::before {
  content: '';
  position: absolute;
  inset: -1px;
  /* cubre exactamente el borde */
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(to bottom,
      rgba(255, 255, 255, 0.8) 0%,
      rgba(255, 255, 255, 0) 100%);
  -webkit-mask:
    linear-gradient(white, white) content-box,
    linear-gradient(white, white);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}


.card-dark {
  position: relative;
  padding: 2rem;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  color: white;
  border: 1px solid transparent;
  background-clip: padding-box;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.card-dark::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(to bottom,
      rgba(255, 255, 255, 0.15) 0%,
      rgba(255, 255, 255, 0) 100%);
  -webkit-mask:
    linear-gradient(white, white) content-box,
    linear-gradient(white, white);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.video-alargado {
  overflow: hidden;
  height: 600px;

  video {
    height: 600px !important;
    object-fit: fill !important;
  }
}


.splited .word {
  display: inline-block;
  white-space: nowrap;
}

.word {
  display: inline;
}


.proyecto-relacionado {
  .relacionado-texto {
    position: relative;
    overflow: hidden;

    &::after {
      position: absolute;
      content: "";
      background-color: var(--c-amarillo);
      height: 200px;
      width: 100%;
      top: -210px;
      left: 0px;
      transition: var(--transitions-after);
      transition-delay: 0.3s;
      z-index: -1;
    }

    &::before {
      position: absolute;
      content: "";
      background-color: var(--c-azul);
      height: 200px;
      width: 100%;
      top: -210px;
      left: 0px;
      transition: var(--transitions-after);
      transition-delay: 0.1s;
      z-index: -1;
    }
  }

  &:hover {
    .relacionado-texto {
      &::after {
        top: 200px;
        transition: var(--transitions-after);
        transition-delay: 0.3s;
      }

      &::before {
        top: 200px;
        transition: var(--transitions-after);
        transition-delay: 0.1s;
      }

    }
  }
}

.bg-blur {

  boder: 1px solid #5c5c5c78;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #15151599;
  border-radius: 6px;
}

/* Galeria de producto */
.producto-galeria {
  .gallery-item {

    .gallery-icon {
      overflow: hidden;

      img {
        min-height: 300px;
        object-fit: cover;
        transition: var(--transitions-large);
        filter: grayscale(1);

      }
    }


    &:hover {
      .gallery-icon {
        img {
          transform: scale(1.1);
          transition: var(--transitions-large);
          filter: grayscale(0);
        }
      }
    }
  }
}

/* TOUR */
.tour-virtual  {
  .wpvr-master-container{
    min-height: 450px;
    max-width: 700px !important;
  }
}

/* ficha de proyecto */
.galeria-proyecto{
  .gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    
    .gallery-item {
      flex: 0 0 49%;
    }
  }
}

/* ---------- RESPONSIVE ---------- */
@media screen and (max-width:1024px) {}

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

/* bg-shrink  */