@charset "UTF-8";
/* ==========================================
   VARIABLES COLORES
   ========================================== */
/* ==========================================
   VARIABLES FUENTES
   ========================================== */
/* Tamaños calculados para escalar entre 320px y 1440px */
/* ==========================================
   VARIABLES TARJETAS
   ========================================== */
/* ==========================================
   VARIABLES MÁRGENES
   ========================================== */
/* ==========================================
   VARIABLES GAP
   ========================================== */
/* ==========================================
   VARIABLES PADDING
   ========================================== */
/* ==========================================
   VARIABLES BORDES & SOMBRAS
   ========================================== */
/* ==========================================
   VARIABLES PARALLAX
   ========================================== */
/* ==========================================
   VARIABLES MODIFICADORAS DE TEXTO
   ========================================== */
/*mixins*/
/*estilos generales*/
html.lenis,
html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

html {
  overflow-x: clip;
}

body {
  background: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%) !important;
  color: #140f24 !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: clamp(0.9375rem, 0.87rem + 0.283vw, 1.125rem) !important;
  position: relative;
  z-index: 3;
  overflow-x: clip;
}

.site-main .pagina {
  display: flex;
  flex-direction: column;
  gap: clamp(3rem, 0.491rem + 10.566vw, 10rem);
}

.site-main::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -14rem;
  left: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(135deg, #f0abfc 0%, #fbcfe8 50%, #d8b4fe 100%);
  filter: blur(90px);
}

h1 {
  font-size: clamp(2.5rem, 1.066rem + 6.038vw, 6.5rem) !important;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 900;
  margin-bottom: clamp(1rem, 0.642rem + 1.509vw, 2rem);
}

h2,
.h2 {
  position: relative;
  display: inline-block;
  font-size: clamp(1.125rem, 1.08rem + 0.189vw, 1.25rem);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 700;
  color: #140f24;
  margin-bottom: clamp(1rem, 0.642rem + 1.509vw, 2rem);
  z-index: 2;
  margin-left: 15px;
}

h2:not(.cta h2, .tarjeta-blog-contenido h2)::after,
.h2::after {
  content: "";
  position: absolute;
  left: -15px;
  width: 6px;
  height: 100%;
  border-radius: 28px;
  background-color: #6347ea;
}

h2.titulo-blog {
  margin-left: 0;
}

h3 {
  font-size: clamp(1.125rem, 1.035rem + 0.377vw, 1.375rem);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 600;
}

p {
  font-weight: 400;
}

p.texto-bajada-titulo {
  font-size: clamp(1.25rem, 0.802rem + 1.887vw, 2.375rem);
  font-weight: 600;
  margin-bottom: clamp(1.5rem, 0.962rem + 2.264vw, 3rem);
}

p.subtitulo-hero {
  font-weight: bold;
  color: #e6007a;
}

span.palabra-destacada {
  background-image: linear-gradient(135deg, #e6007a 0%, #6347ea 50%, #00c2ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block; /* Opcional: ayuda a calcular mejor los bordes del gradiente */
}

a {
  text-decoration: none !important;
}

a.btn-general {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(135deg, #6347ea 0%, #e6007a 100%);
  padding: clamp(0.625rem, 0.58rem + 0.189vw, 0.75rem) clamp(1rem, 0.91rem + 0.377vw, 1.25rem);
  color: #f7f3fb;
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  font-weight: 500;
  transition: all 0.2s ease;
  font-size: 1rem;
  max-width: 180px;
}
a.btn-general::after {
  content: "\f0da";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-left: 1rem;
  display: inline-block;
}
a.btn-general:hover {
  transform: scale(1.02);
}

a.btn-secundario {
  display: flex;
  align-items: center;
  border: 2px solid #140f24;
  padding: clamp(0.375rem, 0.33rem + 0.189vw, 0.5rem) clamp(0.75rem, 0.66rem + 0.377vw, 1rem);
  color: #140f24;
  border-radius: 20px;
  transition: all 0.2s ease;
  font-size: 1rem;
}
a.btn-secundario:hover {
  background-color: #140f24;
  color: #f7f3fb;
  transform: scale(1.02);
}

.hero {
  margin-top: clamp(2.5rem, 0.887rem + 6.792vw, 7rem);
}

.padding-seccion {
  padding: 0 clamp(1.25rem, -1.17rem + 10.189vw, 8rem);
}

/* componentes reutilizables*/
.cta div {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: clamp(2.5rem, 0.887rem + 6.792vw, 7rem) 0;
  margin: 0 clamp(1.25rem, -0.68rem + 9.64vw, 8rem) clamp(2.5rem, 0.887rem + 6.792vw, 7rem) clamp(1.25rem, -0.68rem + 9.64vw, 8rem);
  background: radial-gradient(120% 80% at 50% 0%, #4f46e5 0%, #9333ea 50%, #4338ca 100%);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
}
.cta div h2 {
  font-size: clamp(1.625rem, 0.774rem + 3.585vw, 4rem);
  color: #f7f3fb;
  text-align: center;
  margin-bottom: clamp(1.5rem, 0.962rem + 2.264vw, 3rem);
  text-align: center;
  font-family: "Plus Jakarta Sans", sans-serif;
  margin-left: 0;
}
.cta div a.btn-general {
  background: #f7f3fb;
  color: #140f24;
}

.cta div::after {
  content: "";
  width: 300px;
  height: 300px;
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: rgba(34, 211, 238, 0.2);
  filter: blur(90px);
}

.cta div::before {
  content: "";
  width: 300px;
  height: 300px;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(244, 114, 182, 0.2);
  filter: blur(90px);
}

.tarjetas-filosofia {
  display: flex;
}
.tarjetas-filosofia div.card-body {
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  display: flex;
  position: relative;
  z-index: 1;
  flex-direction: column-reverse;
  transition: color 0.3s ease, transform 0.3s ease;
  overflow: hidden;
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
  /* Capa de color que sube */
}
.tarjetas-filosofia div.card-body::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(120% 80% at 50% 0%, #4f46e5 0%, #9333ea 50%, #4338ca 100%);
  z-index: -1;
  clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
  transition: clip-path 0.3s ease;
}
.tarjetas-filosofia div.card-body h4 {
  margin-bottom: clamp(0.75rem, 0.571rem + 0.755vw, 1.25rem);
  font-size: clamp(1rem, 0.866rem + 0.566vw, 1.375rem);
  font-weight: 600;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.tarjetas-filosofia div.card-body p {
  font-size: clamp(0.875rem, 0.785rem + 0.377vw, 1.125rem);
  color: #7e7587;
  transition: color 0.3s ease;
}
.tarjetas-filosofia div.card-body:hover {
  transform: translateY(-5px);
}
.tarjetas-filosofia div.card-body:hover::before {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.tarjetas-filosofia div.card-body:hover h4 {
  color: #f0eaf8;
}
.tarjetas-filosofia div.card-body:hover p {
  color: #f0eaf8;
}
.tarjetas-filosofia .icon {
  margin-bottom: 1rem;
  display: flex;
  justify-content: flex-end;
}
.tarjetas-filosofia .icon i {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(0.875rem, 0.776rem + 0.42vw, 1.1rem);
  color: #6347ea;
  border: 1px solid #7e7587;
  background-color: #f7f3fb;
  padding: 0.5rem 0.5rem;
  width: clamp(1.875rem, 1.601rem + 1.17vw, 2.5rem);
  height: clamp(1.875rem, 1.601rem + 1.17vw, 2.5rem);
  align-content: center;
  text-align: center;
  border-radius: 20px;
}

/* estilos mouse-circle*/
.cursor-circle {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: 0;
  will-change: transform;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: inset 0 0 16px rgba(255, 255, 255, 0.5), 0 6px 20px rgba(99, 71, 234, 0.2);
  transition: opacity 0.25s ease;
}
.cursor-circle.visible {
  opacity: 1;
}

/* en táctil no hay cursor */
@media (hover: none) {
  .cursor-circle {
    display: none;
  }
}
/*Estilos palabra dinamica*/
.palabra-dinamica {
  display: inline-block;
  opacity: 1;
  transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
  transform: translateY(0);
  color: #e6007a;
}

.palabra-ocultar {
  opacity: 0;
  transform: translateX(-20px);
}

/*Estilos indicador scroll*/
.indicador-scroll {
  position: fixed;
  left: 50%;
  bottom: calc(22px + env(safe-area-inset-bottom, 0px));
  z-index: 900;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 1.1rem;
  border-radius: 28px;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, 16px);
  transition: opacity 0.35s, transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #140f24;
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  background: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%);
}
.indicador-scroll.is-visible {
  opacity: 1;
  transform: translate(-50%, -50%);
}
.indicador-scroll__flecha {
  animation: indicador-rebote 1.4s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .indicador-scroll__flecha {
    animation: none;
  }
}

@keyframes indicador-rebote {
  50% {
    transform: translateY(4px);
  }
}
/*estilos header*/
header.header nav {
  padding: 1.5rem 0;
}
header.header nav .navbar-brand {
  color: #140f24;
  font-weight: 500;
}
header.header nav a.nav-link,
header.header nav a {
  color: #7e7587;
}
header.header nav #navbarNavAltMarkup {
  justify-content: flex-end;
}
header.header .navbar-toggler-fixed {
  position: fixed;
  top: -15px;
  left: 0;
  right: 0;
  z-index: 9;
  pointer-events: none;
}
header.header .navbar-toggler-fixed div {
  display: flex;
  justify-content: flex-end;
  padding-top: 30px;
}
header.header button.navbar-toggler {
  border: none;
  pointer-events: auto;
  background-color: #ffffff;
  padding: clamp(0.6rem, 0.32rem + 0.75vw, 1rem);
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
}
header.header button.navbar-toggler span:after {
  content: "";
  display: block;
  width: clamp(16px, 13.85px + 0.57vw, 22px);
  height: 3px;
  background-color: #7e7587;
}
header.header button.navbar-toggler .linea2::after {
  margin: 6px 0 0 0;
  transition: all 0.2s ease;
}
header.header button:hover .linea2::after {
  transform: translateX(5px);
}
header.header .navbar-toggler-float {
  position: fixed;
  bottom: 30px;
  right: 40px;
  padding: clamp(0.7rem, 0.32rem + 0.75vw, 1rem);
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  background: #6347ea;
  border: none;
  z-index: 9;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex-direction: column;
  opacity: 0;
  pointer-events: none;
}
header.header .navbar-toggler-float span:after {
  content: "";
  display: block;
  width: clamp(16px, 13.85px + 0.57vw, 22px);
  height: 3px;
  background-color: #f7f3fb;
}
header.header .navbar-toggler-float .linea2::after {
  margin: 2px 0 0 0;
  transition: all 0.2s ease;
}
header.header .offcanvas {
  overflow: hidden;
  padding: 1rem;
  background: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%);
  width: clamp(80%, 95.32% - 1.06vw, 90%);
  height: 100%;
}
header.header .offcanvas .offcanvas-header {
  justify-content: flex-end;
}
header.header .offcanvas .offcanvas-header button.btn-cerrar {
  color: #7e7587;
  background: none;
  border: none;
  position: relative;
}
header.header .offcanvas .offcanvas-header button.btn-cerrar span::after {
  content: "";
  position: absolute;
  width: 25px;
  height: 2px;
  background-color: #7e7587;
}
header.header .offcanvas .offcanvas-header button.btn-cerrar .linea-x1::after {
  transform: rotate(45deg);
  transition: all 0.2s ease;
}
header.header .offcanvas .offcanvas-header button.btn-cerrar .linea-x2::after {
  transform: rotate(-45deg);
  transition: all 0.2s ease;
}
header.header .offcanvas .offcanvas-header button.btn-cerrar:hover .linea-x1::after {
  transform: rotate(180deg);
  background-color: #6347ea;
}
header.header .offcanvas .offcanvas-header button.btn-cerrar:hover .linea-x2::after {
  transform: rotate(-180deg);
  background-color: #6347ea;
}
header.header .offcanvas .offcanvas-body li {
  position: relative;
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  z-index: 1;
  margin-bottom: 1rem;
  border-radius: 20px;
  transition: background-color 0.4s ease;
}
header.header .offcanvas .offcanvas-body li a {
  padding-left: 1rem;
  display: inline-block;
  width: 100%;
  font-size: clamp(1.25rem, 0.443rem + 3.396vw, 3.5rem);
  font-weight: 700;
  transition: background-color 0.4s ease;
}
header.header .offcanvas .offcanvas-body li.current-menu-item {
  background-color: #f7f3fb;
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
}
header.header .offcanvas .offcanvas-body li.current-menu-item::after {
  display: block;
  content: "";
  height: clamp(3.125rem, 2.817vw + 2.465rem, 5rem);
  width: 8px;
  margin-left: 1rem;
  border-radius: 20px;
  background: linear-gradient(135deg, #e6007a 0%, #6347ea 50%, #00c2ff 100%);
}
header.header .offcanvas .offcanvas-body li:hover {
  background-color: #f7f3fb;
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
}
header.header .offcanvas .offcanvas-body::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -14rem;
  right: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#c7d2fe 0%, #bae6fd 50%, #c4b5fd 100%);
  filter: blur(90px);
}
header.header .offcanvas .offcanvas-body::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -14rem;
  left: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#ddd6fe 0%, #c7d2fe 100%);
  filter: blur(90px);
}

/*estilos home page*/
.home .hero-home h1 {
  margin-bottom: 0;
  font-size: clamp(3rem, 0.67rem + 9.81vw, 9.5rem) !important;
  text-transform: uppercase;
}
.home .hero-home .hero-home-info {
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
  margin-top: clamp(2rem, 0.566rem + 6.038vw, 6rem);
  align-items: center;
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
}
.home .hero-home .hero-home-info .mi-nombre {
  font-size: clamp(1.125rem, 0.856rem + 1.132vw, 1.875rem);
  font-weight: 700;
  margin-bottom: 0;
}
.home .hero-home .hero-home-info .mi-carrera {
  font-size: 1rem;
  color: #7e7587;
}
.home .hero-home .hero-home-info .hero-home-buttons {
  display: flex;
  flex-direction: column;
}
.home .hero-home .hero-home-info .hero-home-buttons .btns {
  display: flex;
  justify-content: flex-end;
}
.home .hero-home .hero-home-info .hero-home-buttons .btns .btn-general {
  margin-right: 2rem;
}
.home .hero-home .hero-home-info .hero-home-buttons .iconos {
  display: flex;
  justify-content: end;
  margin-top: 2rem;
  gap: 1rem;
}
.home .hero-home .hero-home-info .hero-home-buttons .iconos i {
  font-size: 1.5rem;
  color: #7e7587;
  transition: background-color 0.3s ease, transform 0.3s ease;
  padding: 0.5rem;
  border-radius: 28px;
}
.home .hero-home .hero-home-info .hero-home-buttons .iconos i:hover {
  background-color: #ffffff;
  transform: scale(1.1);
}
.home .home-filosofia {
  position: relative;
}
.home .home-filosofia .row {
  row-gap: 2rem;
  justify-content: space-between;
}
.home .home-filosofia .card-container {
  display: flex;
  position: relative;
  z-index: 3;
}
.home .home-filosofia::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -14rem;
  right: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#c7d2fe 0%, #bae6fd 50%, #c4b5fd 100%);
  filter: blur(90px);
}
.home .home-proyectos .btn-todos-proyectos {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: clamp(1.5rem, 0.962rem + 2.264vw, 3rem);
}
.home .home-proyectos .btn-todos-proyectos div {
  display: flex;
  justify-content: flex-end;
}
.home .home-proyectos .row {
  align-items: flex-start;
  justify-content: space-between;
  row-gap: 2rem;
}
.home .home-proyectos .row p {
  margin-bottom: 0;
}
.home .home-proyectos .row h4 {
  font-size: clamp(1.25rem, 1.205rem + 0.189vw, 1.375rem);
  font-weight: 600;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.home .home-proyectos .btn-proyectos-home {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
  display: block;
}
.home .home-proyectos .btn-proyectos-home .info-proyecto__active {
  border-bottom: 1px solid #6347ea;
  padding-left: 2rem;
  opacity: 1;
}
.home .home-proyectos .btn-proyectos-home .info-proyecto__active .tipo-proyecto::before {
  content: "\f111";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-right: 1rem;
  font-size: 0.75rem;
  color: #6347ea;
}
.home .home-proyectos .imagen-proyecto-preview {
  position: relative;
  max-height: 300px;
  padding: 0;
  transition: opacity 0.2s ease;
}
.home .home-proyectos .imagen-proyecto-preview video {
  width: 100%;
  height: 300px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  transition: opacity 0.2s ease;
}
.home .home-proyectos .imagen-proyecto-preview:hover a {
  opacity: 1;
}
.home .home-proyectos .imagen-proyecto-preview:hover video {
  opacity: 0.7;
}
.home .seccion-blog-slider {
  position: relative;
  overflow: hidden;
}
.home .seccion-blog-slider .swiper.blog-slider {
  width: 100%;
  padding: 2rem 0 2.5rem;
  overflow: visible;
}
.home .seccion-blog-slider .swiper-slide {
  width: 85vw;
  max-width: 1100px;
  height: 80vh;
  min-height: 350px;
  max-height: 550px;
  display: flex;
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
  transition-property: transform, opacity, height, box-shadow;
}
@media (max-width: 768px) {
  .home .seccion-blog-slider .swiper-slide {
    width: 90vw;
    height: 50vh;
    min-height: 350px;
  }
}
.home .seccion-blog-slider .swiper-slide-shadow,
.home .seccion-blog-slider [class*=swiper-slide-shadow-] {
  display: none !important;
}
.home .seccion-blog-slider .tarjeta-blog-contenido {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-decoration: none;
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  background-color: #ffffff;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .imagen-wrapper {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .imagen-wrapper video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  padding: 1rem 0;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .imagen-wrapper:after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(20, 15, 36, 0.3);
}
.home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias {
  position: absolute;
  top: 1.1rem;
  left: 1.1rem;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
  transition: transform 0.3s ease-out;
}
@media (max-width: 768px) {
  .home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias {
    top: 0.7rem;
    left: 0.7rem;
    gap: 0.45rem;
  }
}
.home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li {
  background: #ffffff;
  color: #140f24;
  font-size: 0.875rem;
  font-weight: 600;
  padding: 0.1rem 0.75rem;
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  opacity: 0;
  transform: translateY(-10px) rotate(-2deg);
  transition: opacity 0.3s ease, transform 0.45s cubic-bezier(0.3, 0.9, 0.3, 1.3);
}
.home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(even) {
  transform: translateY(-10px) rotate(2deg);
}
.home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(2) {
  transition-delay: 0.06s;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(3) {
  transition-delay: 0.12s;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(4) {
  transition-delay: 0.18s;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .informacion-tarjeta-blog {
  display: flex;
  justify-content: space-between;
  padding-top: 1rem;
  border-top: 1px solid rgba(240, 234, 248, 0.7);
}
.home .seccion-blog-slider .tarjeta-blog-contenido .informacion-tarjeta-blog .titulo-blog {
  color: #140f24;
  font-size: clamp(1rem, 0.866rem + 0.566vw, 1.375rem);
  font-weight: 700;
  margin: 0 0 0.25rem;
  transition: color 0.3s ease;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .informacion-tarjeta-blog .categoria-blog {
  color: #7e7587;
  font-size: clamp(0.875rem, 0.785rem + 0.377vw, 1.125rem);
  font-weight: 500;
  margin: 0;
  transition: color 0.3s ease;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .informacion-tarjeta-blog p.texto-hover {
  opacity: 0;
  transition: opacity 0.3s ease-out;
  color: #e6007a;
}
.home .seccion-blog-slider .tarjeta-blog-contenido .informacion-tarjeta-blog p.texto-hover::after {
  content: "\f0da";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-left: 1rem;
}
@media (prefers-reduced-motion: reduce) {
  .home .seccion-blog-slider .tarjeta-blog-contenido .imagen-wrapper img,
  .home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias,
  .home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li,
  .home .seccion-blog-slider .tarjeta-blog-contenido .tarjeta-info-overlay,
  .home .seccion-blog-slider .tarjeta-blog-contenido .titulo-blog,
  .home .seccion-blog-slider .tarjeta-blog-contenido .categoria-blog {
    transition: none;
  }
  .home .seccion-blog-slider .tarjeta-blog-contenido .imagen-wrapper img {
    transform: scale(1.12);
  }
  .home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias {
    transform: none;
  }
}
.home .seccion-blog-slider .tarjeta-blog-contenido:hover .informacion-tarjeta-blog p.texto-hover {
  opacity: 1;
}
.home .seccion-blog-slider .swiper-controls-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 2rem;
  padding-bottom: 1rem;
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-pagination {
  position: static;
  width: auto;
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-pagination .swiper-pagination-bullet {
  width: clamp(0.375rem, 0.283rem + 0.39vw, 0.625rem);
  height: clamp(0.375rem, 0.283rem + 0.39vw, 0.625rem);
  background-color: #7e7587;
  opacity: 0.4;
  transition: all 0.3s ease;
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-pagination .swiper-pagination-bullet-active {
  opacity: 1;
  width: 28px;
  border-radius: 6px;
  background-color: #6347ea;
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-next,
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-prev {
  position: static;
  margin: 0;
  width: auto;
  height: auto;
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-next::after,
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-prev::after {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #140f24;
  font-size: clamp(0.875rem, 0.765rem + 0.47vw, 1.125rem);
  background-color: #ffffff;
  padding: clamp(0.6rem, 0.51rem + 0.38vw, 0.85rem);
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  transition: all 0.1s ease;
  display: inline-block;
  transition: transform 0.2s ease;
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-next:hover::after,
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-prev:hover::after {
  transform: scale(1.05);
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-next::after {
  content: "\f061";
}
.home .seccion-blog-slider .swiper-controls-wrapper .swiper-button-prev::after {
  content: "\f060";
}
.home .seccion-blog-slider .swiper-slide:hover .imagen-wrapper img, .home .seccion-blog-slider .swiper-slide:focus-within .imagen-wrapper img {
  filter: none;
}
.home .seccion-blog-slider .swiper-slide:hover .etiquetas-tecnologias li, .home .seccion-blog-slider .swiper-slide:focus-within .etiquetas-tecnologias li {
  opacity: 1;
  transform: none;
}
@media (hover: none) {
  .home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li,
  .home .seccion-blog-slider .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(n) {
    opacity: 1;
    transform: none;
  }
}
.home .home-proceso {
  position: relative;
}
.home .home-proceso .home-proceso__pin {
  align-items: center;
}
.home .home-proceso .proceso {
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  background: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%);
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 3rem;
}
.home .home-proceso .proceso__hint {
  font-size: clamp(0.7rem, 0.646rem + 0.226vw, 0.85rem);
  color: #7e7587;
  margin: 0;
}
.home .home-proceso .proceso__palabras {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
  row-gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.home .home-proceso .proceso__palabras li {
  display: flex;
  align-items: baseline;
  gap: 1.25rem;
}
.home .home-proceso .proceso__palabra {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
  font-size: clamp(2rem, -3.14rem + 10.71vw, 6.5rem);
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(126, 117, 135, 0.4);
  transition: color 0.4s ease;
}
.home .home-proceso .proceso__palabra:hover {
  color: #140f24;
}
.home .home-proceso .proceso__palabra.is-active {
  background-image: linear-gradient(135deg, #e6007a 0%, #6347ea 50%, #00c2ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block; /* Opcional: ayuda a calcular mejor los bordes del gradiente */
}
.home .home-proceso .proceso__flecha {
  font-size: clamp(1.5rem, 4vw, 3.5rem);
  color: rgba(126, 117, 135, 0.4);
}
.home .home-proceso .proceso__barras {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.home .home-proceso .proceso__barras li {
  height: 4px;
  background: rgba(126, 117, 135, 0.4);
  overflow: hidden;
}
.home .home-proceso .proceso__relleno {
  display: block;
  width: 100%;
  height: 100%;
  background: #e6007a;
  transform: scaleX(0);
  transform-origin: left center;
}
.home .home-proceso .proceso__textos {
  display: grid;
}
.home .home-proceso .proceso__textos p {
  grid-area: 1/1;
  max-width: 40rem;
  margin: 0;
  font-size: clamp(1rem, 0.821rem + 0.755vw, 1.5rem);
  color: #7e7587;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}
.home .home-proceso .proceso__textos p.is-active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.home .home-proceso::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -14rem;
  left: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#e9d5ff 0%, #fce7f3 50%, #ccfbf1 100%);
  filter: blur(90px);
}
.home .home-tecnologias ul.row {
  list-style: none;
  padding: 0;
  row-gap: 1.5rem;
}
.home .home-tecnologias ul.row li.tecnologia {
  display: flex;
}
.home .home-tecnologias ul.row li.tecnologia .tarjeta-tecnologia {
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  width: 100%;
  transition: transform 0.3s ease;
}
.home .home-tecnologias ul.row li.tecnologia .tarjeta-tecnologia h3 {
  color: #e6007a;
  margin-bottom: 1rem;
  font-family: "Plus Jakarta Sans", sans-serif;
  border-bottom: 1px solid rgba(240, 234, 248, 0.7);
  padding-bottom: 1rem;
}
.home .home-tecnologias ul.row li.tecnologia .tarjeta-tecnologia ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.home .home-tecnologias ul.row li.tecnologia .tarjeta-tecnologia ul li {
  font-weight: bold;
  font-size: 1rem;
}
.home .home-tecnologias ul.row li.tecnologia .tarjeta-tecnologia p {
  font-size: clamp(0.875rem, 0.785rem + 0.377vw, 1.125rem);
  color: #7e7587;
}
.home .home-tecnologias ul.row li.tecnologia .tarjeta-tecnologia:hover {
  transform: translateY(-4px);
}
.home .home-personal {
  position: relative;
}
.home .home-personal .container-img {
  display: flex;
  align-items: center;
  justify-content: center;
}
.home .home-personal .container-img div {
  padding: 1rem;
  background: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
}
.home .home-personal .container-img img {
  max-height: clamp(180px, 124px + 14vw, 320px);
  border-radius: 20px;
}
.home .home-personal .row {
  justify-content: space-between;
  row-gap: 2rem;
}
.home .home-personal::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -14rem;
  right: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#ddd6fe 0%, #c7d2fe 100%);
  filter: blur(90px);
}

.site-footer {
  padding: clamp(1.5rem, 0.604rem + 3.774vw, 4rem) 0;
  position: relative;
  z-index: 3;
  margin: 0 clamp(1.25rem, -0.68rem + 9.64vw, 8rem);
  border-top: 1px solid rgba(99, 71, 234, 0.3);
}
.site-footer h3 {
  font-size: clamp(1rem, 0.955rem + 0.189vw, 1.125rem);
}
.site-footer .row {
  justify-content: space-between;
  row-gap: 2rem;
}
.site-footer .row a {
  color: #140f24;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 600;
  font-size: clamp(1rem, 0.955rem + 0.189vw, 1.125rem);
  margin-bottom: 0.5rem;
}
.site-footer .row p {
  font-size: clamp(0.8125rem, 0.768rem + 0.189vw, 0.9375rem);
  color: #7e7587;
  margin-top: 0.5rem;
}
.site-footer .row .enlaces-footer {
  display: flex;
  justify-content: space-between;
}
.site-footer .row .enlaces-footer ul {
  padding: 0;
  list-style: none;
}
.site-footer .row .enlaces-footer ul li {
  font-size: clamp(0.8125rem, 0.768rem + 0.189vw, 0.9375rem);
  color: #7e7587;
}
.site-footer .row .enlaces-footer ul li:hover {
  color: #e6007a;
}

.sobre-mi .container-img {
  display: flex;
  align-items: center;
  justify-content: center;
}
.sobre-mi .container-img div {
  padding: 1rem;
  background: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
}
.sobre-mi .container-img img {
  border-radius: 20px;
  max-height: clamp(180px, 124px + 14vw, 320px);
}
.sobre-mi .porque-sobre-mi .row {
  justify-content: space-between;
  row-gap: 2rem;
}
.sobre-mi .como-trabajo-sobre-mi ul {
  padding: 0;
  display: flex;
  position: relative;
  list-style: none;
  gap: 1rem;
}
.sobre-mi .como-trabajo-sobre-mi ul li {
  font-size: clamp(1rem, 0.57rem + 0.89vw, 1.375rem);
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 1rem;
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
}
.sobre-mi .como-trabajo-sobre-mi .dot,
.sobre-mi .como-trabajo-sobre-mi .text {
  opacity: 0;
  transform: translateY(15px);
}
.sobre-mi .como-trabajo-sobre-mi .dot {
  position: relative;
  z-index: 2;
  width: clamp(0.875rem, 0.45rem + 0.89vw, 1.25rem);
  height: clamp(0.875rem, 0.45rem + 0.89vw, 1.25rem);
  border-radius: 50%;
  flex-shrink: 0;
  background-color: #f7f3fb;
  box-sizing: border-box;
}
.sobre-mi .mis-formas-sobre-mi .row {
  row-gap: 2rem;
}
.sobre-mi .frase-sobre-mi {
  color: #140f24;
  text-align: center;
  padding: 2rem 0;
  position: relative;
  z-index: 3;
  width: 100%;
}
.sobre-mi .frase-sobre-mi div {
  display: block;
  margin: 0 clamp(1.25rem, -1.17rem + 10.189vw, 8rem);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
}
.sobre-mi .frase-sobre-mi p {
  margin-bottom: 0;
  font-size: clamp(1.125rem, 0.722rem + 1.698vw, 2.25rem);
  font-weight: 600;
}
.sobre-mi .lo-que-sigue-sobre-mi .row {
  row-gap: 2rem;
  justify-content: space-between;
}

.sobre-mi::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -14rem;
  left: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(135deg, #f0abfc 0%, #fbcfe8 50%, #d8b4fe 100%);
  filter: blur(90px);
}

.sobre-mi::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  right: -14rem;
  transform: translateY(-50%);
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#c7d2fe 0%, #bae6fd 50%, #c4b5fd 100%);
  filter: blur(90px);
}

.pag-proyectos {
  display: flex;
  flex-direction: column;
  gap: clamp(3rem, 0.491rem + 10.566vw, 10rem);
}
.pag-proyectos h1 {
  margin-bottom: 0;
}
.pag-proyectos .row {
  row-gap: 1.5rem;
}
.pag-proyectos .tarjeta-blog {
  margin-bottom: 1.75rem;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-decoration: none;
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  background-color: #ffffff;
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .imagen-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: #ffffff;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .imagen-wrapper video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  margin: 1rem 0;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .imagen-wrapper::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(20, 15, 36, 0);
  transition: background-color 0.3s ease;
  pointer-events: none;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias {
  position: absolute;
  top: 1.1rem;
  left: 1.1rem;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 768px) {
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias {
    top: 0.7rem;
    left: 0.7rem;
    gap: 0.45rem;
  }
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li {
  background: #ffffff;
  color: #140f24;
  font-size: 0.875rem;
  font-weight: 600;
  padding: 0.1rem 0.75rem;
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  opacity: 0;
  transform: translateY(-10px) rotate(-2deg);
  transition: opacity 0.3s ease, transform 0.45s cubic-bezier(0.3, 0.9, 0.3, 1.3);
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(even) {
  transform: translateY(-10px) rotate(2deg);
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(2) {
  transition-delay: 0.06s;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(3) {
  transition-delay: 0.12s;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(4) {
  transition-delay: 0.18s;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-top: 1rem;
  margin-top: auto;
  border-top: 1px solid rgba(240, 234, 248, 0.7);
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog .titulo-blog {
  color: #140f24;
  font-size: clamp(1.15rem, 2vw, 1.35rem);
  font-weight: 700;
  margin: 0 0 0.25rem;
  transition: color 0.3s ease;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog .categoria-blog {
  color: #7e7587;
  font-size: 0.9rem;
  font-weight: 500;
  margin: 0;
  transition: color 0.3s ease;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog p.texto-hover {
  opacity: 0;
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
  white-space: nowrap;
  color: #e6007a;
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
  transform: translateX(-5px);
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog p.texto-hover::after {
  content: "\f0da";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-left: 0.5rem;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:hover .imagen-wrapper::after, .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:focus-within .imagen-wrapper::after {
  background-color: rgba(20, 15, 36, 0.1);
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:hover .etiquetas-tecnologias li,
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:hover .etiquetas-tecnologias li:nth-child(even), .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:focus-within .etiquetas-tecnologias li,
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:focus-within .etiquetas-tecnologias li:nth-child(even) {
  opacity: 1;
  transform: none;
}
.pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:hover .informacion-tarjeta-blog p.texto-hover, .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido:focus-within .informacion-tarjeta-blog p.texto-hover {
  opacity: 1;
  transform: translateX(0);
}
@media (hover: none) {
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li,
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(even) {
    opacity: 1;
    transform: none;
  }
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li:nth-child(n+3) {
    display: none;
  }
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog p.texto-hover {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .etiquetas-tecnologias li,
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .informacion-tarjeta-blog p.texto-hover,
  .pag-proyectos .tarjeta-blog .tarjeta-blog-contenido .imagen-wrapper::after {
    transition: none;
  }
}

.pag-proyectos::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -14rem;
  left: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(135deg, #f0abfc 0%, #fbcfe8 50%, #d8b4fe 100%);
  filter: blur(90px);
}

.pag-proyectos::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  right: -14rem;
  transform: translateY(-50%);
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#c7d2fe 0%, #bae6fd 50%, #c4b5fd 100%);
  filter: blur(90px);
}

.pagina-proyecto {
  position: relative;
}
.pagina-proyecto .video-proyecto {
  margin-left: clamp(1.25rem, -0.68rem + 9.64vw, 8rem);
  margin-right: clamp(1.25rem, -0.68rem + 9.64vw, 8rem);
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
}
.pagina-proyecto .video-proyecto video {
  width: 100%;
  max-height: 100dvh;
}
.pagina-proyecto #seccion-fija-animada {
  width: 100%;
}
.pagina-proyecto .marco-fijo {
  display: grid;
  overflow: hidden;
}
.pagina-proyecto .slide-item {
  grid-area: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: radial-gradient(120% 80% at 50% 0%, #ffffff 0%, #f5f0fb 45%, #eae2f8 75%, #f0eaf8 100%);
  opacity: 0;
  visibility: hidden;
  will-change: opacity;
}
.pagina-proyecto .slide-item.desafio {
  opacity: 1;
  visibility: visible;
}
.pagina-proyecto .bloque-imagen {
  display: flex;
  justify-content: center;
}
.pagina-proyecto .bloque-imagen div {
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
}
.pagina-proyecto .slide-item img {
  max-width: 100%;
  max-height: clamp(180px, 124px + 14vw, 320px);
  border-radius: 20px;
  padding: 1rem;
  -o-object-fit: contain;
     object-fit: contain;
  height: auto;
}
.pagina-proyecto .desafio .row,
.pagina-proyecto .enfoque .row,
.pagina-proyecto .resultado .row {
  justify-content: space-between;
  width: 100%;
}
.pagina-proyecto .galeria-item {
  margin-bottom: 1.5rem;
  display: block;
}
.pagina-proyecto .galeria-item a {
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
  padding: clamp(0.875rem, 0.472rem + 1.698vw, 2rem);
  display: block;
  width: 100%;
}
.pagina-proyecto .galeria-item img {
  width: 100%;
  aspect-ratio: 4/5;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  display: block;
  transition: all 0.3s ease;
  border-radius: 20px;
}
.pagina-proyecto .galeria {
  margin-bottom: clamp(3rem, 0.491rem + 10.566vw, 10rem);
}
.pagina-proyecto .galeria h2 {
  margin-bottom: clamp(1.5rem, 0.962rem + 2.264vw, 3rem);
  font-family: "Plus Jakarta Sans", sans-serif;
}

.pagina-proyecto::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -14rem;
  right: -14rem;
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(135deg, #f0abfc 0%, #fbcfe8 50%, #d8b4fe 100%);
  filter: blur(90px);
}

.pagina-proyecto::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: -14rem;
  transform: translateY(-50%);
  width: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  height: clamp(20rem, 12.606rem + 31.132vw, 40.625rem);
  border-radius: 50%;
  background: linear-gradient(#c7d2fe 0%, #bae6fd 50%, #c4b5fd 100%);
  filter: blur(90px);
}

.formulario-contacto {
  z-index: 3;
  backdrop-filter: blur(50px);
  box-shadow: 0 24px 60px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 28px;
  border: 1px solid rgb(255, 255, 255);
  background: radial-gradient(120% 80% at 50% 0%, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 100%);
  padding: clamp(1.25rem, -0.68rem + 9.64vw, 8rem);
  margin: 0 clamp(1.25rem, -1.17rem + 10.189vw, 8rem);
  margin-bottom: clamp(3rem, 0.491rem + 10.566vw, 10rem);
}
.formulario-contacto input:not([type=checkbox]),
.formulario-contacto textarea.ff-el-form-control {
  background-color: inherit;
  border: 1px solid #7e7587;
  color: #140f24;
  border-radius: 14px;
  background-color: #ffffff;
}
.formulario-contacto input:not([type=checkbox]):focus,
.formulario-contacto textarea.ff-el-form-control:focus {
  background-color: inherit;
  color: #140f24;
}
.formulario-contacto input[type=checkbox] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border: 1px solid rgba(230, 0, 122, 0.2);
  border-radius: 4px;
  outline: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.formulario-contacto .ff-el-form-check-label {
  backdrop-filter: blur(34px);
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  padding: 0.4rem 0.8rem;
}
.formulario-contacto .ff-el-form-check-label input {
  margin-right: 0.5rem;
}
.formulario-contacto .ff-el-form-check-label span {
  font-size: clamp(0.875rem, 0.73rem + 0.3vw, 1rem);
  margin-left: 0.25rem;
}
.formulario-contacto input[type=checkbox]:hover {
  background-color: #e6007a;
}
.formulario-contacto input:checked {
  background-color: #e6007a;
}
.formulario-contacto .fluentform .ff-el-group {
  margin-bottom: 3rem;
}
.formulario-contacto .ff-el-input--content {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.formulario-contacto .ff-el-form-check.ff-el-form-check- label {
  display: flex;
  align-items: center;
  width: 220px;
  height: 100%;
}
.formulario-contacto .ff-el-form-check.ff-el-form-check- label .ff-el-form-check-input {
  top: 0;
  margin-right: 0.5rem;
}
.formulario-contacto .ff-default .ff-el-input--label label {
  margin-bottom: 0.75rem;
}
.formulario-contacto .ff-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(135deg, #6347ea 0%, #e6007a 100%);
  padding: clamp(0.625rem, 0.58rem + 0.189vw, 0.75rem) clamp(1rem, 0.91rem + 0.377vw, 1.25rem);
  color: #f7f3fb;
  box-shadow: 0 12px 50px 0 rgba(99, 102, 241, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.9);
  border-radius: 20px;
  font-weight: 500;
  transition: all 0.2s ease;
  font-size: 1rem;
  max-width: 180px;
}
.formulario-contacto .ff-btn::after {
  content: "\f0da";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-left: 1rem;
  display: inline-block;
}
.formulario-contacto .ff-btn:hover {
  transform: scale(1.02);
}

@media (max-width: 1399.98px) {
  .home .hero-home .hero-home-info .hero-home-buttons .btns {
    margin-top: 1.5rem;
    justify-content: flex-start;
  }
}
@media (max-width: 1199.98px) {
  .pagina-proyecto .row {
    row-gap: 2rem;
  }
}
@media (max-width: 991.98px) {
  .cursor-circle {
    display: none;
  }
  .formulario-contacto .ff-el-input--content {
    flex-wrap: wrap;
    gap: 1rem;
  }
  .pagina-proyecto .slide-item .bloque-imagen {
    display: block;
  }
  .pagina-proyecto .slide-item .bloque-imagen img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: top;
       object-position: top;
  }
}
@media (max-width: 767.98px) {
  .formulario-contacto .ff-el-input--content {
    flex-direction: column;
    gap: 1rem;
  }
  .como-trabajo-sobre-mi ul {
    flex-direction: column;
  }
  .home .home-proyectos .btn-todos-proyectos .padding-seccion-button {
    justify-content: flex-start;
  }
}
@media (max-width: 576px) {
  .home-proceso .row.etapas-proceso div {
    --progreso-mobile: 0%;
    position: relative;
    margin-left: 12px;
    padding-left: 1rem;
  }
  .home-proceso .row.etapas-proceso div::before {
    content: "";
    position: absolute;
    left: 0;
    height: var(--progreso-mobile);
    width: 6px;
    background-color: #e6007a;
  }
}
@media (max-width: 372.98px) {
  .home .hero-home .hero-home-info .hero-home-buttons .btns {
    flex-direction: column;
    gap: 1rem;
  }
  .home .hero-home .hero-home-info .hero-home-buttons .btns a {
    justify-content: center;
  }
  .home .hero-home .hero-home-info .hero-home-buttons .btns a.btn-general {
    margin-right: 0;
  }
}/*# sourceMappingURL=estilos-cliente.css.map */