/*
 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
*/
body {
  font-family: var(--tipo-general);
  font-size: var(--font-size-txt);
}

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);
  }
}

.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;
}

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

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

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


/* 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;
      }

    }
  }
}

/* ---------- FICHA DE PRODUCTO ----------*/

.produt-txt-destacado {
  p {
    font-family: var(--tipo-titulos);
    font-size: var(--subtith3-size);

    span {
      font-family: var(--tipo-italic);
      font-size: calc(var(--subtith3-size) * 1.3);
    }
  }

}

.product-designer {
  .wc-designer-link {
    font-family: var(--tipo-italic);
    font-size: var(--subtith3-size);
    color: var(--c-primary);
    transition: var(--transition-p);

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

.product-brand {
  object-fit: cover;
  max-height: 150px;
  max-width: 200px !important;
}

.product-adjunto {
  transition: var(--transition-p);
  border: 1px solid transparent;

  .elementor-icon-box-icon {
    transition: var(--transition-p);
    transform: translateY(0px);
  }

  &:hover {

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

    .elementor-icon-box-icon {
      transition: var(--transition-p);
      transform: translateX(10px);
    }
  }
}

.related-product {
  padding: 30px !important;
  border: 1px solid var(--c-negro);

  .producto_texto {
    flex-direction: row !important;
    justify-content: space-between;
    align-items: center;

    .producto_title {
      h4 {
        font-size: 18px !important;
      }

      text-transform: uppercase;
      color: var(--c-negro) !important;
      transition: var(--transition-p);
    }

    .producto_icon {
      .elementor-icon {
        svg {
          width: 20px !important;
          height: 20px !important;
        }

      }

    }
  }

  &:hover {
    .producto_texto {
      .producto_title {
        color: var(--c-amarillo) !important;
        transition: var(--transition-p);
      }
    }
  }
}



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

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

/* bg-shrink  */