@charset "UTF-8";

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter.ttf") format("opentype");
}

:root {
  --white: #fff;
  --black: #1C1C1C;
  --black2: #252525;
  --yellow: #FCC02D;
  --fs-base: 1rem;
  --fs-md: clamp(1.1rem, 1.06rem + 0.16vw, 1.2rem)
    /* Reduced 20% */
    --fs-lg: clamp(1.2rem, 1.04rem + 0.64vw, 1.6rem)
    /* Reduced 20% */
    --fs-xl: clamp(1.5rem, 0.9rem + 2.4vw, 3.0rem)
    /* Reduced 20% */
    --fs-xxl: 2.8rem;
  /* Reduced 20% */
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

body {
  min-height: 100dvh;
  max-width: 100dvw;
  overflow-x: hidden;
  margin-inline: auto;
  font-family: "Inter";
  color: var(--white);
  background-color: transparent;
  position: relative;
  font-size: var(--fs-base);
}

h1 {
  color: var(--white);
  font-size: var(--fs-xxl);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -1.5px;
}

h2 {
  color: var(--white);
  font-size: var(--fs-xl);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -1px;
}

h3 {
  color: var(--white);
  font-size: var(--fs-lg);
  font-weight: 500;
  line-height: 1.2;
  /* 120% */
  letter-spacing: -0.64px;
}

h4 {
  color: var(--white);
  font-size: var(--fs-md);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.477px;
}

p {
  margin: 0;
}

ul {
  text-decoration: none;
  padding: 0;
}

a {
  text-decoration: none;
}

.titulo {
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: 0.84px;
  text-transform: uppercase;
}

/*Negrita*/
.fw-300 {
  font-weight: 300;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fw-900 {
  font-weight: 700;
}

/*Tamaños*/
.ft-9 {
  font-size: 9px;
}

.ft-10 {
  font-size: 10px !important;
}

.ft-11 {
  font-size: 11px !important;
}

.ft-12 {
  font-size: 12px !important;
}

.ft-14 {
  font-size: 14px !important;
}

/*Distribuciones*/
.start-x,
.start-y,
.center-x,
.center-y,
.between-x,
.between-y,
.end-y,
.end-x,
.around-x {
  display: flex;
  flex-wrap: wrap;
}

.start-y,
.center-y,
.between-y,
.end-y {
  flex-direction: column;
}

.start-x,
.start-y {
  justify-content: start;
  align-items: start;
}

.center-x,
.center-y {
  justify-content: center;
  align-items: center;
}

.between-x,
.between-y {
  justify-content: space-between;
  align-items: center;
}

.around-x {
  justify-content: space-around;
  align-items: start;
}

.end-y,
.end-x {
  justify-content: end;
}

/*colores*/
.text-yellow {
  color: var(--yellow) !important;
}

/*Imagen de fondo*/
.imagen-fondo {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/*Estilos*/
button {
  border: none;
  background: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  font-family: inherit;
}

/* From Uiverse.io by e-coders */
.btn-base {
  position: relative;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.24);
  color: var(--black);
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  border-radius: 12px;
  padding: 8px 26px;
  text-decoration: none;
  cursor: pointer;
  background: transparent;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  transition: background-color 0.5s ease 0.2s, border-color 0.5s ease 0.2s;
}

.btn-base span:first-child {
  position: relative;
  transition: color 600ms cubic-bezier(0.48, 0, 0.12, 1);
  z-index: 10;
  color: var(--white);
}

.btn-base span:last-child {
  color: var(--black);
  display: block;
  position: absolute;
  bottom: 0;
  transition: all 500ms cubic-bezier(0.48, 0, 0.12, 1);
  z-index: 100;
  opacity: 0;
  top: 50%;
  left: 50%;
  transform: translateY(225%) translateX(-50%);
  height: 14px;
  line-height: 13px;
}

.btn-base:after {
  content: "";
  position: absolute;
  bottom: -50%;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--yellow);
  transform-origin: bottom center;
  transition: transform 600ms cubic-bezier(0.48, 0, 0.12, 1);
  transform: skewY(9.3deg) scaleY(0);
  z-index: 50;
}

.btn-base.white {
  border: 2px solid var(--white);
  background: var(--white);
}

.btn-base.white span:first-child {
  color: var(--black);
}

.btn-base:hover {
  background-color: var(--yellow);
  border-color: var(--yellow);
}

.btn-base:hover:after {
  transform-origin: bottom center;
  transform: skewY(9.3deg) scaleY(2);
}

.btn-base:hover span:last-child {
  transform: translateX(-50%) translateY(-50%);
  opacity: 1;
  transition: all 900ms cubic-bezier(0.48, 0, 0.12, 1);
}

.btn-base.yellow {
  border: 2px solid var(--yellow);
  background-color: var(--yellow);
}

.btn-base.yellow span:first-child {
  color: var(--black);
}

.btn-base.yellow:after {
  background-color: var(--white);
}

.btn-base.yellow:hover {
  background-color: var(--white);
  border-color: var(--white);
}

.btn-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white) !important;
  font-size: 14px;
  transition: all 0.5s ease;
  font-weight: 500;
  padding-top: 0.25rem;
  /* From Uiverse.io by karthik092726122003 */
}

.btn-arrow>span {
  padding-bottom: 5px;
  transition: color 0.3s ease;
}

.btn-arrow .styled-wrapper .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 50px;
  height: 50px;
  margin: 0;
  overflow: hidden;
  outline: none;
  background-color: transparent;
  cursor: pointer;
  border: 0;
}

.btn-arrow .styled-wrapper .button:before {
  content: "";
  position: absolute;
  border-radius: 8px;
  inset: 7px;
  background-color: var(--yellow);
  border: 3px solid var(--yellow);
  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 80ms, transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms;
}

.btn-arrow .styled-wrapper .button:after {
  content: "";
  position: absolute;
  border-radius: 8px;
  inset: 7px;
  border: 4px solid var(--yellow);
  background-color: var(--yellow);
  transform: scale(1.3);
  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 0;
  z-index: -1;
}

.btn-arrow:hover .button:before,
.btn-arrow:focus .button:before {
  opacity: 0;
  transform: scale(0.7);
  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.btn-arrow:hover .button:after,
.btn-arrow:focus .button:after {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 80ms, transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms;
}

.btn-arrow .styled-wrapper .button-box {
  display: flex;
  position: absolute;
  top: 14px;
  left: -50px;
}

.btn-arrow .styled-wrapper .button-elem {
  width: 50px;
  height: 50px;
  position: relative;
}

.btn-arrow .fa-arrow-right {
  font-size: 17px;
  padding-top: 2px;
}

.btn-arrow:hover .button-box,
.btn-arrow:focus .button-box {
  transition: 0.4s;
  transform: translateX(50px);
}

.btn-arrow:hover>span,
.btn-arrow:focus>span {
  color: var(--yellow);
}

.red {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 50%;
  background-color: var(--white);
  transition: background-color 0.3s ease;
}

.red i {
  color: var(--black);
}

.red:hover {
  background-color: var(--yellow);
}

.btn-ver {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  background-color: var(--yellow);
  transition: all 0.5s ease;
}

.btn-ver:hover {
  transform: rotate(45deg);
}

/*Header*/
/* Nav */
nav.navTop {
  position: fixed;
  width: 90%;
  max-width: 1200px;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.5s ease-in;
  z-index: 100;
  background: rgba(28, 28, 28, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 50px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  top: -150px;
}

nav.navTop {
  top: 20px !important;
}

.navbar {
  font-size: 15px;
  font-weight: 500;
  height: auto;
  padding: 0;
  width: 100%;
}

.navbar .nav-acciones {
  height: auto;
  display: flex;
  align-items: center;
}

.navbar .nav-acciones ul li {
  padding-inline: 20px;
  color: var(--black);
}

.navbar .nav-acciones ul li img {
  transition: all 0.5s ease;
}

.dropdown-menu a {
  height: 50px;
}

.categorias li:not(.close):not(.mega-dropdown) {
  padding-inline: 1rem;
  transition: 0.2s all ease;
  margin-bottom: 0;
  font-weight: 400;
  display: flex;
  align-items: center;
  height: 50px;
}

.categorias li:not(.close):not(.mega-dropdown) a {
  position: relative;
  color: var(--white);
  transition: all 0.5s ease;
  font-size: var(--fs-md);
}

.categorias li:not(.close):not(.mega-dropdown) a i {
  font-size: 16px;
}

.categorias li:not(.close):not(.mega-dropdown):hover a {
  color: var(--yellow);
}

/* Estado inicial del menú */
/* Old offcanvas styles - disabled, using custom menu toggle */
/*
.offcanvas-top {
  top: 60px !important;
  height: 0;
  z-index: -1;
  border-radius: 8px;
  background-color: var(--black2);
  opacity: 0;
}

.nav-acciones .offcanvas.offcanvas-top {
  max-height: 0;
  overflow: hidden;
}
*/

/* Animación para expandir el menú */
/*
@keyframes expandMenu {
  from {
    height: 0;
  }
  to {
    height: 100dvh;
    opacity: 1;
    max-height: 30svb;
  }
}
@keyframes collapseMenu {
  from {
    height: 100dvh;
  }
  to {
    height: 0;
  }
}
*/
/* Cuando el menú esté visible */
.offcanvas-top.show {
  animation: expandMenu 0.5s ease-in-out forwards 0.5s;
}

/* Cuando el menú se oculta */
.offcanvas-top:not(.show) {
  animation: collapseMenu 0.5s ease-in-out forwards;
}

.offcanvas-backdrop.show {
  display: none;
}

.navbar-nav::-webkit-scrollbar {
  width: 0px;
}

/* From Uiverse.io by JulanDeAlb */
.navbar-toggler {
  border: none;
}

.hamburger {
  width: 32px;
  height: 32px;
  padding: 4px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  background-color: var(--yellow);
}

.hamburger:focus {
  box-shadow: none;
}

.hamburger span {
  width: 100%;
  height: 0.15rem;
  border-radius: 0.5rem;
  background-color: var(--black);
  box-shadow: 0 0.5px 2px 0 hsla(0, 0%, 0%, 0.2);
  transition: transform 0.4s, background-color 0.4s, opacity 0.4s;
}

.offcanvas-top.show+.hamburger span:nth-child(1),
.hamburger.open span:nth-child(1) {
  transform: translateY(7px) rotate(-45deg);
}

.offcanvas-top.show+.hamburger span:nth-child(2),
.hamburger.open span:nth-child(2) {
  transform: translate(-50%);
  opacity: 0;
}

.offcanvas-top.show+.hamburger span:nth-child(3),
.hamburger.open span:nth-child(3) {
  transform: translateY(-7px) rotate(45deg);
}

.encabezado {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.encabezado .hamburger {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  background-color: var(--yellow) !important;
  border-radius: 6px;
  padding: 5px;
}

.encabezado p {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
  margin: 0;
}

.logo {
  position: static;
  transform: none;
}

.logo img {
  height: 30px;
}

.navbar-expand-xl .navbar-nav .dropdown-menu {
  left: 0;
}

.nav-item.dropdown:hover .dropdown-menu {
  display: block;
}

/*Footer*/
/*Footer*/
footer {
  background-color: #242729;
  color: var(--white);
}

.footer-middle {
  display: block;
  font-size: 1rem;
  background-size: cover;
}

.footer-middle .entradas li {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer-middle .elipse {
  margin-top: 2rem;
}

.footer-middle .elipse img {
  left: -15px;
  top: -15px;
}

.footer-middle a {
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
  transition: all 0.5s ease;
}

.footer-middle a:hover {
  color: var(--yellow);
}

.footer-middle h4 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  color: var(--white);
  text-align: start;
  text-transform: initial;
}

.footer-middle li {
  margin-bottom: 0.4rem;
}

.footer-middle .around-x {
  width: 100%;
  max-width: 90%;
}

.footer-middle p {
  max-width: 350px;
  font-size: 17px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.7);
}

.footer-bottom .container {
  margin-top: 4rem;
  line-height: normal;
  font-weight: 400;
  padding-top: 2rem;
  padding-bottom: 2rem;
  text-align: center;
  border-top: 2px solid rgba(255, 255, 255, 0.3);
}

.footer-bottom .container p {
  margin: 0;
  font-size: 1rem;
}

.grupo-comtel {
  padding: 0 1rem 1rem;
}

.grupo-comtel h2 {
  margin: 0;
  display: inline-flex;
  align-items: flex-end;
  gap: 0.6rem;
  font-size: clamp(1.1rem, 1rem + 0.8vw, 1.6rem);
  letter-spacing: -0.4px;
  line-height: 1;
}

.grupo-comtel-text {
  line-height: 1;
}

.grupo-comtel-logo {
  height: 0.84em;
  width: auto;
  display: block;
  padding-bottom: 0.08em;
  transform: translateY(-0.01em);
}

/*Utilies*/
section {
  padding: 3.5rem 0;
  position: relative;
}

/* Difuminado global entre bloques para evitar cortes bruscos */
main>section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 120px;
  pointer-events: none;
  background: linear-gradient(to bottom,
      rgba(11, 12, 14, 0) 0%,
      rgba(11, 12, 14, 0.22) 45%,
      rgba(11, 12, 14, 0.68) 100%);
  filter: blur(14px);
  opacity: 0.95;
}

/*Main*/
.section-portada {
  margin-top: 0;
  padding-top: 100px;
  padding-bottom: 150px;
  margin-bottom: 0;
  color: var(--black);
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  /* Increased by ~15% from 75vh */
  display: flex;
  align-items: center;
}

.section-portada::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  background: linear-gradient(to bottom, transparent, #0B0C0E 90%);
  z-index: 1;
  pointer-events: none;
}

.section-portada .container {
  position: relative;
  z-index: 2;
}

.section-portada.style2 {
  padding-top: 80px;
  min-height: 500px;
}

.section-portada.style2 h1 {
  font-size: clamp(2.5rem, 2rem + 2vw, 3.75rem);
  line-height: 1.1;
  margin-bottom: 1rem;
  font-weight: 600;
}

.section-portada.style2 .container {
  position: static;
}

.section-portada.style2 .imagen-fondo {
  filter: brightness(0.6);
}

.section-portada.style2 .titulo {
  color: var(--white);
}

.section-portada.style2 h2 {
  padding-top: 1rem;
}

.section-portada .flotante {
  position: absolute;
  width: 80%;
  left: 0;
  right: 0;
  margin-inline: auto;
  bottom: 0;
  top: -130px;
  z-index: 1;
}

.section-portada p {
  margin: 1.5rem 0;
  max-width: 475px;
  color: #C3C3C3;
  line-height: 1.5;
}

.section-portada .row {
  padding-top: 100px;
}

.section-portada h4 {
  padding-top: 50%;
}

.section-promesa {
  margin-top: 0;
  padding-top: 0;
}

.section-promesa .ct {
  position: relative;
  padding: 26px 0px;
  border-radius: 12px;
  overflow: hidden;
  margin-inline: 20px;
}

.section-promesa .container {
  position: relative;
  isolation: isolate;
  border-radius: 12px;
  overflow: hidden;
  padding: 25px 50px;
}

.section-promesa .container::after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  position: absolute;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.24) 4%, rgba(0, 0, 0, 0.18) 51.8%, rgba(0, 0, 0, 0.55) 87%);
}

.section-promesa .container .imagen-fondo {
  z-index: 0;
}

.section-promesa .container h4,
.section-promesa .container h3,
.section-promesa .container .row {
  position: relative;
  z-index: 2;
}

.section-promesa .container .row {
  padding-top: 280px;
}

.section-promesa .container .cifras {
  font-size: 30px;
  font-weight: 300;
  line-height: 1.38;
}

.section-promesa .container .cifras span {
  text-align: center;
  font-size: 70px;
  font-weight: 400;
  letter-spacing: -3px;
}

.section-promesa .container p {
  max-width: 243px;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.65;
}

.section-promesa h2 {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.13;
  letter-spacing: normal;
}

.section-promesa h3 {
  font-size: 40px;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -2px;
}

.section-promesa h3 span {
  font-weight: 700;
}

.clientes-section {
  padding-top: 0;
}

.clientes-section h2 {
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 0.96;
  letter-spacing: 0.84px;
  text-transform: uppercase;
}

.carrusel-clientes {
  position: relative;
}

.carrusel-clientes::after {
  content: "";
  position: absolute;
  width: 200px;
  height: 100%;
  left: 0;
  top: 0;
  background: linear-gradient(90deg, #1c1c1c 0, rgba(28, 28, 28, 0.95) 40%, rgba(249, 249, 249, 0) 100%);
}

.carrusel-clientes::before {
  content: "";
  position: absolute;
  width: 200px;
  height: 100%;
  right: 0;
  top: 0;
  background: linear-gradient(-90deg, #1c1c1c 0, rgba(28, 28, 28, 0.95) 40%, rgba(249, 249, 249, 0) 100%);
  z-index: 1;
}

.carrusel-clientes .cliente {
  display: flex;
  align-items: center;
  justify-content: center;
}

.carrusel-clientes .cliente .ct-imagen {
  width: 140px;
  height: 80px;
  margin-inline: 0.9rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.carrusel-clientes .cliente .ct-imagen img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: center;
  object-position: center;
}

.nosotros-section {
  position: relative;
}

.nosotros-section .shine {
  position: absolute;
  bottom: 0;
  right: 0;
}

.nosotros-section .nosotros-media {
  position: relative;
  isolation: isolate;
}

.nosotros-section .nosotros-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(to top, rgba(255, 126, 30, 0.46) 0%, rgba(255, 126, 30, 0.24) 26%, rgba(255, 126, 30, 0) 54%),
    linear-gradient(135deg, rgba(0, 0, 0, 0.62) 10%, rgba(0, 0, 0, 0.34) 50%, rgba(0, 0, 0, 0.52) 100%);
}

.nosotros-section .nosotros-img {
  width: 100%;
  display: block;
  opacity: 0.92;
  filter: sepia(0.4) hue-rotate(-22deg) saturate(1.42) brightness(0.86) contrast(1.06);
}

.nosotros-section .contenido {
  position: absolute;
  left: 10%;
  top: 50%;
  width: 283px;
  z-index: 2;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.85);
}

.nosotros-section .contenido h3 {
  font-weight: 400;
}

.nosotros-section .contenido h3 span {
  font-weight: 700;
}

.nosotros-section .contenido p {
  padding-top: 0.5rem;
  font-size: 1.25rem;
}

.nosotros-section .accordion .accordion-button {
  font-size: var(--fs-lg);
  line-height: 1;
  color: #C4C4C4;
  padding-top: 24px;
  padding-bottom: 18px;
  padding-inline-start: 0;
  padding-inline-end: 0;
  background-color: rgba(0, 0, 0, 0);
  box-shadow: none;
  text-align: start;
  font-weight: 500;
}

.nosotros-section .accordion .accordion-button span {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.8px;
}

.nosotros-section .accordion .accordion-button img {
  transition: all 0.5s ease;
}

.nosotros-section .accordion .accordion-button::after {
  display: none;
}

.nosotros-section .accordion .accordion-button:not(.collapse):hover img {
  transform: rotate(22.5deg);
}

.nosotros-section .accordion .accordion-button:not(.collapsed) {
  pointer-events: none;
  color: var(--white);
}

.nosotros-section .accordion .accordion-button:not(.collapsed) img {
  filter: invert(63.83%) sepia(27.73%) saturate(1004.31%) hue-rotate(4.76deg) brightness(167.93%) contrast(101.78%);
}

.nosotros-section .accordion .accordion-item {
  border-bottom: 1px solid rgba(195, 195, 195, 0.1);
  padding-bottom: 0.5rem;
  background-color: transparent;
  border-radius: 0px;
}

.nosotros-section .accordion .accordion-item:not(:first-child) {
  margin-top: 0px;
}

.nosotros-section .accordion .accordion-item:first-child {
  border-top: 1px solid var(--border);
}

.nosotros-section .accordion .accordion-body {
  padding-inline-start: 0px;
  padding-inline-end: 0px;
  padding-bottom: 24px;
  padding-top: 0;
  color: #C3C3C3;
}

.soluciones-section .solucion {
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: start;
  gap: 100px;
  padding: 35px 30px;
  height: 100% !important;
}

.soluciones-section .carrusel-soluciones {
  padding-bottom: 60px;
  margin-bottom: 30px;
  display: flex;
}

.soluciones-section .slick-track {
  display: flex;
  height: 100%;
}

.soluciones-section .carrusel-soluciones .slick-list {
  margin: 0 -10px;
}

.soluciones-section .carrusel-soluciones .slick-slide {
  margin: 0 10px;
}

.soluciones-section .slick-arrow {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border: 1px solid white;
  border-radius: 50%;
  transition: all 0.5s ease;
  padding: 15px 10px;
  position: absolute;
  z-index: 100;
}

.soluciones-section .slick-arrow:hover {
  transform: scale(1.05);
}

.soluciones-section .next,
.soluciones-section .prev {
  bottom: 0px;
  cursor: pointer;
}

.soluciones-section .prev {
  right: 60px;
}

.soluciones-section .next {
  right: 10px;
}

.ventajas-section .benefico {
  border-radius: 20px;
  border: 1.25px solid rgba(255, 84, 31, 0.2);
  background: rgba(39, 40, 41, 0.7);
  min-height: 200px;
  height: 100%;
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  gap: 22px;
}

.ventajas-section .benefico p {
  max-width: 511px;
}

.ventajas-section .benefico.style {
  border: none;
  background: linear-gradient(119deg, rgba(0, 0, 0, 0) 23.34%, rgba(252, 192, 45, 0.3) 96.36%), rgba(39, 40, 41, 0.7);
}

.casos-section .caso .ct-portada {
  width: 100%;
  height: 100%;
  aspect-ratio: 570/580;
  border-radius: 8px;
  overflow: hidden;
  flex: 1;
  position: relative;
}

.casos-section .caso .ct-portada::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.55) 54%,
      rgba(0, 0, 0, 0.78) 100%);
}

.casos-section .caso .ct-portada img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  transition: all 0.5s ease;
  border-radius: 8px;
  filter: brightness(0.8);
}

.casos-section .caso .ct-portada .dot {
  width: 6px;
  height: 6px;
  flex-shrink: 0;
  border-radius: 50%;
  background-color: white;
  position: absolute;
  z-index: 2;
}

.casos-section .caso .ct-portada .dot:nth-of-type(1) {
  top: 14px;
  left: 14px;
}

.casos-section .caso .ct-portada .dot:nth-of-type(2) {
  top: 14px;
  right: 14px;
}

.casos-section .caso .ct-portada .dot:nth-of-type(3) {
  bottom: 14px;
  left: 14px;
}

.casos-section .caso .ct-portada .dot:nth-of-type(4) {
  bottom: 14px;
  right: 14px;
}

.casos-section .caso .contenido {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 50px 0;
  text-align: center;
  z-index: 2;
}

.casos-section .caso .contenido h3 {
  max-width: 370px;
  margin-inline: auto;
  font-size: 1.6rem;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.75);
}

.casos-section .caso .contenido p {
  max-width: 370px;
  margin-inline: auto;
  color: #C3C3C3;
  font-size: 1.15rem;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.72);
}

.casos-section .caso .contenido .tag {
  display: flex;
  padding: 6px 8px;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  background: rgba(8, 8, 8, 0.46);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  color: #FFF;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: 0.72px;
  text-transform: uppercase;
}

.casos-section .caso:hover img {
  transform: scale(1.05);
  filter: blur(5px) brightness(0.8);
}

.text-swap {
  display: inline-grid;
  vertical-align: bottom;
  overflow: hidden;
  cursor: default;
}

.text-swap .layer {
  grid-area: 1/1;
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  display: inline-block;
  white-space: wrap;
}

.text-swap .visible {
  transform: translateY(0);
}

.text-swap .hidden {
  transform: translateY(100%);
}

.caso:hover .visible {
  transform: translateY(-100%);
}

.caso:hover .hidden {
  transform: translateY(0);
}

.casos-section .caso-modal-trigger {
  text-decoration: none;
}

.casos-section .caso-modal-trigger .contenido h3 {
  max-width: 430px;
  font-size: clamp(1.35rem, 1.2rem + 0.45vw, 1.7rem);
}

.casos-section .caso-modal-trigger .contenido p {
  max-width: 430px;
  font-size: 1.03rem;
  line-height: 1.5;
  padding-inline: 18px;
}

/* Proyectos destacados - modal con grilla y tipografía blanca */
.project-detail-modal .modal-dialog {
  max-width: 920px;
}

.project-detail-modal .modal-content {
  color: #fff;
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 32px 60px rgba(0, 0, 0, 0.55);
  background-color: #0B0C0E;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    radial-gradient(circle at 18% 20%, rgba(255, 174, 56, 0.25) 0%, rgba(255, 174, 56, 0) 45%),
    radial-gradient(circle at 85% 80%, rgba(255, 95, 31, 0.22) 0%, rgba(255, 95, 31, 0) 48%);
  background-size: 38px 38px, 38px 38px, 100% 100%, 100% 100%;
  overflow: hidden;
  position: relative;
}

.project-detail-modal .modal-content::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.3);
}

.project-detail-modal .modal-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  padding: 1.2rem 1.35rem 1rem;
  background: rgba(0, 0, 0, 0.22);
  position: relative;
  z-index: 1;
}

.project-modal-kicker {
  display: inline-block;
  margin-bottom: 0.2rem;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.project-detail-modal .modal-title {
  font-size: clamp(1.25rem, 1.05rem + 0.45vw, 1.65rem);
  line-height: 1.25;
  color: #fff;
  margin: 0;
}

.project-detail-modal .modal-body {
  padding: 1.2rem 1.35rem 1.45rem;
  position: relative;
  z-index: 1;
}

.project-modal-image {
  width: 100%;
  max-height: 430px;
  display: block;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
  margin-bottom: 1rem;
}

.project-detail-modal .modal-body p {
  color: rgba(255, 255, 255, 0.88);
  font-size: 1rem;
  line-height: 1.7;
  margin-bottom: 0.9rem;
}

.project-detail-modal .modal-body p:last-child {
  margin-bottom: 0;
}

.preguntas-section {
  position: relative;
}

.preguntas-section .shine {
  position: absolute;
  top: 0;
  left: 0;
}

.preguntas-section .accordion-header:hover .visible {
  transform: translateY(-100%);
}

.preguntas-section .accordion-header:hover .hidden {
  transform: translateY(0);
}

.word {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
  animation: fade-in 0.8s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

@keyframes fade-in {
  100% {
    opacity: 1;
    filter: blur(0);
  }
}

.testimonio-section .testimonio {
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: flex-start;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  min-height: 270px;
  height: 100%;
}

.testimonio-section .testimonio .ct-logo {
  height: 28px;
  overflow: hidden;
}

.testimonio-section .testimonio .ct-logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: center;
  object-position: center;
  transition: all 0.5s ease;
}

.testimonio-section .testimonio .punto {
  width: 6px;
  height: 6px;
  flex-shrink: 0;
  border-radius: 50%;
  background-color: var(--yellow);
}

.testimonio-section .testimonio .between-x {
  margin-bottom: 0.35rem;
}

.testimonio-section .testimonio .autor {
  display: flex;
  align-items: center;
  margin-top: auto;
}

.testimonio-section .testimonio .autor img {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  border-radius: 50%;
  margin-right: 0.5rem;
}

.testimonio-section .testimonio .autor .nombre {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.35;
}

.testimonio-section .testimonio .autor .cargo {
  color: #C3C3C3;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
}

.testimonio-section .testimonio p {
  font-size: clamp(0.85rem, 0.8rem + 0.3vw, 1.05rem);
  line-height: 1.5;
  margin: 0.55rem 0 0.6rem;
}

.miniaturas {
  display: inline-flex;
  align-items: center;
  position: relative;
  padding-right: 190px;
}

.miniaturas .miniatura {
  width: 40px;
  border-radius: 50%;
  height: 40px;
  border: 3px solid #F2F2F2;
  overflow: hidden;
}

.miniaturas .miniatura img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: center;
  object-position: center;
}

.miniaturas .miniatura:not(:first-of-type) {
  margin-left: -12px;
}

.miniaturas::after {
  content: "";
  position: absolute;
  width: 195px;
  height: 92px;
  top: 50%;
  right: 0;
  z-index: 10;
  transform: translateY(-70%);
  background-image: url("../img/others/arrow1.png");
}

.miniaturas.style2 .miniatura {
  border-radius: 5.6px;
}

.miniaturas.style2::after {
  content: "";
  position: absolute;
  width: 195px;
  height: 92px;
  top: 145%;
  right: 0;
  z-index: 10;
  background-image: url("../img/others/arrow2.png");
}

.timeline-section {
  position: relative;
}

.timeline-section::before,
.preguntas-section::before {
  display: none;
}

.timeline-section::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -72px;
  height: 175px;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(85% 95% at 50% 0%,
      rgba(11, 12, 14, 0) 0%,
      rgba(11, 12, 14, 0.56) 62%,
      #0B0C0E 100%);
  filter: blur(16px);
}

.timeline-section .container,
.preguntas-section .container {
  position: relative;
  z-index: 2;
}

.timeline-section .shine {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin-inline: auto;
}

.timeline-section .anho {
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: -0.48px;
  margin-top: 3px;
}

.timeline-section h2 {
  font-size: clamp(1.25rem, 1.2rem + 0.35vw, 1.5rem);
  /*24-28px - reduced 15% */
  font-weight: 400;
  max-width: 750px;
}

.timeline-section h3 {
  font-size: 22px;
  font-weight: 400;
  line-height: 1.33;
  letter-spacing: -0.671px;
}

.timeline-section .digito {
  font-size: 68px;
  font-weight: 700;
  line-height: 1.11;
  letter-spacing: -3.357px;
  margin-bottom: 0;
}

.timeline-section .col-xl-3 .ct-hito {
  padding-top: 50px;
}

.timeline-section .col-xl-3 .hito {
  margin-bottom: 1.5rem;
}

.timeline-section .col-xl-3:nth-of-type(1) .ct-hito {
  padding-top: 120px;
}

.timeline-section .col-xl-3:nth-of-type(2) .ct-hito {
  padding-top: 180px;
}

.timeline-section .col-xl-3:nth-of-type(4) .ct-hito {
  padding-top: 140px;
}

.timeline-section .disponible {
  color: rgba(255, 255, 255, 0.6);
  margin-left: 1.5rem;
  position: relative;
  padding-right: 15px;
}

.timeline-section .disponible::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 7.5px;
  height: 7.5px;
  flex-shrink: 0;
  background: #0AC300;
  border-radius: 50%;
}

.crecer-secion h2 {
  text-align: center;
  margin-bottom: 50px;
}

.crecer-secion .ct {
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  padding: 90px 70px 50px 70px;
}

.crecer-secion .ct p {
  color: #C3C3C3;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
}

.preguntas-section {
  margin-top: -46px;
  padding-top: calc(3.5rem + 46px);
  margin-bottom: 0;
  padding-bottom: 50px;
}

.preguntas-section .accordion .accordion-button {
  font-size: 20px;
  line-height: 1;
  color: var(--white);
  padding-top: 10px;
  padding-bottom: 10px;
  padding-inline-start: 0;
  padding-inline-end: 0;
  background-color: rgba(0, 0, 0, 0);
  box-shadow: none;
  text-align: start;
  font-weight: 400;
}

.preguntas-section .accordion .accordion-button::after {
  content: "+";
  color: var(--white);
  background-image: none;
  line-height: 1;
  width: auto;
  height: auto;
  font-size: 25px;
  margin-inline-start: 50px;
  margin-inline-start: auto;
  margin-inline-end: 0;
}

.preguntas-section .accordion .accordion-button:not(.collapsed) {
  pointer-events: none;
}

.preguntas-section .accordion .accordion-button:not(.collapsed)::after {
  transform: rotate(45deg);
  color: var(--yellow);
}

.preguntas-section .accordion .accordion-item {
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  padding: 20px;
  margin-bottom: 1rem;
  border: none;
}

.preguntas-section .accordion .accordion-item:not(:first-child) {
  margin-top: 0px;
}

.preguntas-section .accordion .accordion-body {
  padding-inline-start: 0px;
  padding-inline-end: 0px;
  padding-bottom: 24px;
  padding-top: 0;
  color: #C3C3C3;
  max-width: 640px;
}

.cta-section .ct-cta {
  position: relative;
  display: flex;
  flex-direction: column;
  max-width: 1120px;
  height: 375px;
  padding: 20px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  margin-inline: auto;
  border-radius: 32px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  overflow: hidden;
}

.cta-section .ct-cta p {
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.12;
  max-width: 618px;
  margin: 35px auto;
}

.contacto-section {
  padding-bottom: 0;
}

.contacto-section .ct {
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50px;
  padding: 50px;
}

.contacto-section .ct .flex-nowrap {
  transition: all 0.5s ease;
}

.contacto-section .ct .flex-nowrap:hover {
  color: var(--yellow);
}

.contacto-section .fas {
  color: var(--orange);
  font-size: 22px;
}

.contacto-section a {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 300;
  transition: all 0.5s ease;
}

.contacto-section a:hover {
  color: var(--yellow);
}

.contacto-section label {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 400;
}

.contacto-section input,
.contacto-section textarea {
  height: 42px;
  border-radius: 0.5rem;
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid transparent !important;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 300;
}

.contacto-section input:focus,
.contacto-section textarea:focus {
  color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0 5px var(--yellow) !important;
  border-color: var(--yellow) !important;
}

.contacto-section textarea {
  height: 150px;
}

.contacto-section .btn-simple {
  color: var(--black) !important;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 400 !important;
}

.mapa {
  filter: grayscale(100);
  padding-top: 50px;
}

.tipo-proyecto {
  padding: 0.8rem;
  background-color: transparent;
  background-color: 1rem;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  color: white;
}

.tipo-proyecto .ct-imagen {
  overflow: hidden;
  width: 100%;
  max-height: 300px;
  aspect-ratio: 16/9;
  position: relative;
  border-radius: 0.8rem;
}

.tipo-proyecto .ct-imagen img {
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  position: absolute;
  -o-object-fit: cover;
  object-fit: cover;
  transform-origin: center center;
}

.tipo-proyecto .ct-imagen .tag {
  display: inline-flex;
  padding: 4px 1rem;
  border: solid 1px var(--white);
  background: rgba(61, 61, 61, 0.46);
  color: var(--white);
  font-weight: 400;
  border-radius: 30px;
  position: absolute;
  font-size: 12px;
  text-transform: uppercase;
  top: 1rem;
  left: 1rem;
}

.tipo-proyecto .info {
  padding: 1rem;
}

.tipo-proyecto .info .subtitulo {
  text-transform: uppercase;
  color: rg(0, 0, 238);
  font-size: 12px;
}

.tipo-proyecto .info h3 {
  font-size: 18px;
  line-height: 1.5;
  color: var(--white);
  font-weight: 500;
}

.tipo-proyecto .brillo {
  position: absolute;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.5) 15%, rgba(255, 255, 255, 0.02) 40%, rgba(255, 255, 255, 0.09) 60%, rgba(255, 255, 255, 0.4) 100%);
  filter: blur(200px);
  left: -25%;
  top: -25%;
  transition: all 0.5s ease;
}

.tipo-proyecto:hover .ct-imagen img {
  transform: scale(1.1);
}

.tipo-proyecto:hover .brillo {
  top: -75%;
  left: -75%;
}

.ft-section {
  margin-top: 50px;
}

.ft-section .tags {
  position: relative;
  margin: 2rem 0 1rem 0;
  margin-left: 40px;
}

.ft-section .tags span {
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  display: flex;
}

.ft-section .tags::after {
  content: "";
  height: 2px;
  width: 20px;
  position: absolute;
  top: 8px;
  left: -30px;
  background-color: var(--black);
}

.ft-section .fecha {
  font-weight: 500;
  color: rgb(131, 136, 137);
  font-size: 12px;
  margin: 0.5rem 0;
  display: flex;
  margin-bottom: 2rem;
}

.ft-section .ct-portada img {
  max-width: 100%;
  width: 100%;
  height: auto;
  margin-inline: auto;
}

.ft-section h2 {
  font-size: clamp(1.5rem, 1.35rem + 0.6vw, 1.875rem);
  font-weight: 600;
  line-height: 1.4;
}

.ft-section h3 {
  margin: 1.5rem 0;
  font-size: 1.125rem;
  font-weight: 600;
}

.ft-section p {
  margin: 1.125rem 0 1.6rem 0;
}

.ft-section li {
  margin: 0.5rem 0;
}

.ft-section .lista {
  margin-left: 1.5rem;
  margin-bottom: 50px;
}

.ft-section a {
  color: var(--black);
}

#alertContainer {
  color: #d9534f;
  /* Un color rojo para la alerta */
  font-size: 0.9em;
  font-weight: bold;
  margin-top: 5px;
  padding: 0 !important;
}

#alertContainer .alert {
  padding: 0;
  padding-top: 0.5rem;
}

.honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.mensaje-exito {
  max-width: 500px;
  width: 90%;
  height: 220px;
  background-color: var(--yellow);
  padding: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: stretch !important;
  box-sizing: border-box;
  position: fixed;
  z-index: 9999;
  border-radius: 1rem;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.contenedor-mensaje {
  background-color: var(--black);
  height: 200px;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 400;
}

.contenedor-mensaje .titulo {
  text-transform: uppercase;
  margin-bottom: 1rem;
  font-weight: 800;
  font-size: 1.2rem;
  color: var(--white);
  text-align: center;
}

.contenedor-mensaje .titulo::after {
  display: none;
}

html {
  width: 100dvw !important;
  overflow-x: hidden !important;
}

/*# sourceMappingURL=style.css.map */
/* Aura Background Styles - Scoped to Hero */
.aura-background {
  position: absolute;
  /* Changed from fixed */
  top: 0;
  left: 0;
  width: 100%;
  height: 120%;
  /* Increased height to extend background */
  z-index: -1;
  pointer-events: none;
  mask-image: linear-gradient(to bottom, black 80%, transparent);
  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent);
  background-color: #0B0C0E;
  overflow: hidden;
  /* Ensure no spillover */
}

.aura-background [data-us-project] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  filter: hue-rotate(-10deg) saturate(1.2);
  /* Shift yellow to orange */
}

/* Typography Overrides (Aura Style) */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #0B0C0E;
  /* Dark background base */
}

h1,
.h1 {
  font-weight: 500;
  letter-spacing: -1.8px;
}

h2,
.h2 {
  font-weight: 500;
  letter-spacing: -1.2px;
}

h3,
h4,
h5,
h6 {
  font-weight: 500;
  letter-spacing: -0.5px;
}

p {
  font-weight: 300;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.6;
}

/* Header Aura Style */
header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 140px;
  overflow: hidden;
  z-index: 9000;
  background: transparent;
  pointer-events: none;
}

header nav {
  pointer-events: auto;
}

header .mobile-menu-overlay {
  pointer-events: auto;
}

.navTop {
  padding: 0.5rem 0;
}

.navTop .navbar {
  width: 70% !important;
  margin-inline: auto;
  border: 1px solid var(--yellow);
  border-radius: 80px;
  background-color: transparent;
  backdrop-filter: blur(10px);
  padding: 0 1.5rem;
  height: 50px;
  margin-top: 1rem;
}

/* Navbar inner layout */
.navbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  position: relative;
}

/* Nav links - always horizontal */
.nav-links {
  display: flex !important;
  flex-direction: row !important;
  list-style: none;
  gap: 2rem;
  margin: 0;
  padding: 0;
  align-items: center;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.3s ease;
}

.nav-links.show {
  max-height: 200px;
  opacity: 1;
}

.nav-links li a {
  color: var(--white);
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  transition: color 0.3s ease;
  white-space: nowrap;
}

.nav-links li a:hover {
  color: var(--yellow);
}

/* Social icons in navbar */
.nav-redes {
  display: flex;
  gap: 0.75rem;
  align-items: center;
}

/* Footer Aura Style */
footer {
  position: relative;
  background-color: #0B0C0E;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  overflow: hidden;
  padding-top: 4rem;
  padding-bottom: 2rem;
}

/* Grid Background Pattern */
footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: 40px 40px;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  pointer-events: none;
  z-index: 0;
}

footer .container {
  position: relative;
  z-index: 1;
}

.footer-middle h4 {
  font-size: 14px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.05em;
  margin-bottom: 1.5rem;
  font-weight: 600;
}

.footer-middle ul li a {
  color: rgba(255, 255, 255, 0.6);
  font-size: 15px;
  transition: color 0.2s;
  text-decoration: none;
  display: inline-block;
  margin-bottom: 0.75rem;
}

.footer-middle ul li a:hover {
  color: #fff;
}

/* Hero Typography (Aura Match) */
.section-portada h1 {
  font-size: 3rem;
  line-height: 1.1;
  font-weight: 500;
  letter-spacing: -1.8px;
  color: white;
  margin-bottom: 1.5rem;
}

@media (min-width: 1024px) {
  .section-portada h1 {
    font-size: 4.5rem;
  }
}

.section-portada p {
  font-size: 1.125rem;
  line-height: 1.625;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.6);
}

.page-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(28, 28, 28, 0.85);
  z-index: -5;
  pointer-events: none;
}

/* --- REFINED AURA STYLES (User Request) --- */

/* 1. Global Background Grid & Lighting */
body {
  background-color: #0B0C0E;
  position: relative;
  /* Ensure no background color on body hides the pseudo-elements */
}

body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: -2;
  background-size: 50px 50px;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  pointer-events: none;
}

body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: -2;
  background: radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.04) 0%, transparent 70%);
  pointer-events: none;
}

/* Disable Footer Grid since we have global grid */
footer::before {
  display: none;
}

footer {
  background: transparent !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* 2. Floating Menu (Pill Style) */
header {
  background: transparent !important;
  border-bottom: none !important;
  position: fixed;
  top: 20px;
  width: 100%;
  height: auto;
  z-index: 1000;
  display: flex;
  justify-content: center;
  pointer-events: none;
  /* Allow clicks pass through outside navbar */
}

.navTop {
  pointer-events: auto;
  width: 90%;
  max-width: 1100px;
  background: rgba(11, 12, 14, 0.85) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 30px;
  /* Requested radius */
  padding: 0.5rem 2rem !important;
  margin: 0 auto;
  box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.5);
}

/* 3. Typography Adjustments (Smaller H1) */
h1,
.h1,
.section-portada h1 {
  font-size: 2.25rem !important;
  line-height: 1.1;
  letter-spacing: -1.2px;
}

@media (min-width: 1024px) {

  h1,
  .h1,
  .section-portada h1 {
    font-size: 2.8rem !important;
    /* Reduced 20% */
  }
}


/* Ajustes carrusel (Solicitud usuario) */
.carrusel-clientes .cliente .ct-imagen {
  width: 129.6px !important;
  /* Aumentado otro 20% */
  height: 86.4px !important;
  opacity: 0.8;
  transition: opacity 0.3s;
  filter: grayscale(100%);
}

.carrusel-clientes .cliente .ct-imagen:hover {
  opacity: 1;
  filter: grayscale(0%);
}

.carrusel-clientes::after,
.carrusel-clientes::before {
  display: none !important;
  /* Quitar degradados sólidos antiguos */
}

/* Tipografía Unificada */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4 {
  font-family: 'Inter', sans-serif;
  font-weight: 500 !important;
  /* Unificado */
}

/* Adjust partner title to match style */
.center-y h2 {
  font-size: 14px !important;
  text-transform: uppercase;
  letter-spacing: 0.05em !important;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 0;
}

/* --- SIZE ADJUSTMENTS (User Request - 35% Increase) --- */
h2,
.h2 {
  font-size: 2rem !important;
  /* Mobile base */
  letter-spacing: -1px;
}

@media (min-width: 1024px) {

  h2,
  .h2 {
    font-size: 2.75rem !important;
    /* Increased to ~35% larger than 2rem */
  }
}

/* Fix for .titulo (Small Labels) to prevent them from growing too big */
.titulo,
h2.titulo {
  font-size: 1rem !important;
  /* 16px - slightly larger than 14px */
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
  font-weight: 600 !important;
  opacity: 0.7;
}

/* --- SPECIFIC TEXT SIZE ADJUSTMENTS (User Request) --- */

/* 1. Testimonials Text (Reduce size) */
.testimonio-section .testimonio p {
  font-size: 0.9rem !important;
  /* Smaller text */
  line-height: 1.6;
  opacity: 0.8;
}

/* 2. Industries/Cases (Text over photo) - Increase size */
.casos-section .caso .contenido h3 .layer {
  font-size: 1.6rem !important;
  /* Increased title size */
  font-weight: 600 !important;
  line-height: 1.25;
}

.casos-section .caso .contenido p {
  font-size: 1.15rem !important;
  /* Increased content size */
  opacity: 0.9;
  font-weight: 400;
}

/* 3. "Acompañamos proyectos..." Title (Specific Reduction 15%) */
/* Targeting the specific h2 inside .timeline-section */
.timeline-section h2 {
  font-size: 1.7rem !important;
  /* Reduced 15% from global ~2rem base */
  line-height: 1.3;
}

@media (min-width: 1024px) {
  .timeline-section h2 {
    font-size: 2.35rem !important;
    /* Reduced 15% from global ~2.75rem */
  }
}

/* --- REFINED TECH HERO STYLES (User Request) --- */

/* 1. Hero Text Polish */
.section-portada h1.animated-text {
  font-weight: 600;
  letter-spacing: -2px;
  /* Tighter tracking for modern look */
  text-shadow: 0 10px 30px rgba(0, 0, 0, 0.8);
  /* Lift off background */
  margin-bottom: 2rem;
  position: relative;
  z-index: 10;
}

.section-portada p {
  font-size: 1.15rem;
  font-weight: 300;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.9);
  /* Whiter text */
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9);
  /* Readability against datacenter */
  max-width: 500px;
  margin-bottom: 2.5rem;
  padding-left: 1.5rem;
  border-left: 2px solid #fb923c;
  /* Orange accent line */
}

/* 2. Glassmorphism Backing for Text (Optional, keeping subtle) */
.section-portada .col-lg-5 {
  position: relative;
}

.section-portada .col-lg-5::before {
  content: '';
  position: absolute;
  top: -2rem;
  left: -2rem;
  right: -2rem;
  bottom: -2rem;
  background: radial-gradient(circle at center, rgba(0, 0, 0, 0.6) 0%, transparent 80%);
  z-index: -1;
  pointer-events: none;
  filter: blur(40px);
}

/* 3. Modern Tech Button */
.btn-base.white {
  background: rgba(255, 255, 255, 0.95);
  border: none;
  color: #0B0C0E !important;
  padding: 14px 32px;
  border-radius: 4px;
  /* Slightly squarer for tech feel */
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-size: 0.85rem;
  transition: all 0.3s ease;
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
  overflow: hidden;
}

.btn-base.white:hover {
  background: #ffffff;
  box-shadow: 0 0 30px rgba(255, 255, 255, 0.4);
  transform: translateY(-2px);
}

.btn-base.white span:first-child {
  color: #0B0C0E !important;
}

/* Hide old effects on this specific button */
.btn-base.white::after {
  display: none;
}

.btn-base.white span:last-child {
  display: none;
}

/* --- GLOBAL TECH TYPOGRAPHY REFINEMENTS --- */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: 'Inter', sans-serif;
  letter-spacing: -0.03em !important;
  /* Unified tight tracking */
}

/* --- SOLUCIONES SECTION UPGRADE --- */
.soluciones-section .solucion {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.05);
  /* Subtle border */
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  position: relative;
  overflow: hidden;
  justify-content: flex-start;
  gap: 12px;
  padding: 20px 18px;
}

.soluciones-section .solucion:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(251, 146, 60, 0.4);
  /* Orange accent on hover */
  box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.5);
  transform: translateY(-5px);
}

/* Digital Number Style */
.soluciones-section .solucion .between-x span {
  font-family: 'Courier New', monospace;
  /* Tech/Code feel */
  font-weight: 700;
  font-size: 1.5rem;
  color: rgba(255, 255, 255, 0.3);
  transition: color 0.3s ease;
}

.soluciones-section .solucion:hover .between-x span {
  color: #fb923c;
  /* Orange light up */
  text-shadow: 0 0 10px rgba(251, 146, 60, 0.6);
}

.soluciones-section .solucion .solucion-icon {
  width: 176px;
  height: 176px;
  border-radius: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.86);
  box-shadow: inset 0 0 14px rgba(255, 255, 255, 0.04);
  transition: all 0.3s ease;
}

.soluciones-section .solucion .solucion-icon img {
  width: 96px;
  height: 96px;
  display: block;
  object-fit: contain;
}

.soluciones-section .solucion:hover .solucion-icon {
  color: #fb923c;
  border-color: rgba(251, 146, 60, 0.45);
  background: rgba(251, 146, 60, 0.08);
  box-shadow: inset 0 0 14px rgba(251, 146, 60, 0.2), 0 0 16px rgba(251, 146, 60, 0.2);
}

/* Arrow Button in Card */
.soluciones-section .btn-ver {
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: none;
}

.soluciones-section .solucion:hover .btn-ver {
  background-color: #fb923c;
  border-color: #fb923c;
  transform: rotate(0deg) scale(1.1);
  /* Stable scale, no rotate */
}

/* --- ANIMATED LIGHTING ACCENTS --- */

/* Hero Pulse Accent */
@keyframes neonPulse {
  0% {
    border-color: rgba(251, 146, 60, 0.3);
    box-shadow: -2px 0 10px rgba(251, 146, 60, 0);
  }

  50% {
    border-color: rgba(251, 146, 60, 0.8);
    box-shadow: -2px 0 15px rgba(251, 146, 60, 0.3);
  }

  100% {
    border-color: rgba(251, 146, 60, 0.3);
    box-shadow: -2px 0 10px rgba(251, 146, 60, 0);
  }
}

.section-portada p {
  animation: neonPulse 3s infinite ease-in-out;
}

/* Partner Logos Glow */
.carrusel-clientes .cliente .ct-imagen {
  transition: all 0.3s ease;
  filter: grayscale(100%) opacity(0.6);
}

.carrusel-clientes .cliente .ct-imagen:hover {
  filter: grayscale(0%) opacity(1) drop-shadow(0 0 8px rgba(255, 255, 255, 0.5));
  transform: scale(1.1);
}

/* --- LEGIBILITY CHECKS --- */
.soluciones-section p {
  color: rgba(255, 255, 255, 0.75);
  /* improved contrast */
  font-size: 1rem;
  line-height: 1.45;
  margin: 0;
}

.soluciones-section h3 {
  margin: 0;
  font-size: 1.5rem;
}

/* --- SOLAR FLARE EFFECTS (User Request) --- */

/* Ambient Solar Flare Background */
.solar-flare-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 800px;
  aspect-ratio: 1/1;
  background: radial-gradient(circle, rgba(255, 160, 80, 0.15) 0%, rgba(255, 100, 0, 0.05) 40%, transparent 70%);
  filter: blur(120px) contrast(1.2);
  z-index: -1;
  pointer-events: none;
  animation: solarPulse 10s ease-in-out infinite alternate;
  opacity: 0.6;
  mix-blend-mode: screen;
}

@keyframes solarPulse {
  0% {
    transform: translate(-50%, -50%) scale(0.9);
    opacity: 0.4;
  }

  100% {
    transform: translate(-50%, -50%) scale(1.1);
    opacity: 0.7;
  }
}

/* 1. Soluciones Section Flare */
.soluciones-section {
  position: relative;
  overflow: hidden;
}

.soluciones-section .solar-flare-bg {
  top: 0%;
  left: 100%;
  transform: translate(-50%, -20%);
  background: radial-gradient(circle, rgba(255, 140, 0, 0.15) 0%, rgba(255, 69, 0, 0.05) 50%, transparent 70%);
}

/* 2. Crecer Section Flare */
.crecer-secion {
  position: relative;
  overflow: hidden;
}

.crecer-secion .solar-flare-bg {
  top: 50%;
  left: 0%;
  transform: translate(-30%, -50%);
  width: 1200px;
  height: 800px;
  background: radial-gradient(ellipse at center, rgba(255, 120, 30, 0.12) 0%, transparent 70%);
}

/* 3. Interactive Card Flare (Explosion effect on hover) */
.soluciones-section .solucion {
  z-index: 1;
  /* Ensure content is above flare */
  position: relative;
  /* Define containing block */
}

.soluciones-section .solucion::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 165, 0, 0.2) 0%, transparent 60%);
  filter: blur(40px);
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
  z-index: -1;
}

.soluciones-section .solucion:hover::before {
  opacity: 1;
}

/* 4. Nosotros Section Flare (Right Side) */
.nosotros-section {
  position: relative;
  overflow: hidden;
}

.nosotros-section .solar-flare-bg {
  top: 50%;
  left: 100%;
  transform: translate(-60%, -50%);
  width: 900px;
  height: 900px;
  background: radial-gradient(circle, rgba(255, 140, 40, 0.1) 0%, transparent 65%);
}

/* 5. Ventajas Section Flare (Why Choose Netsun) */
.ventajas-section {
  position: relative;
  overflow: hidden;
}

.ventajas-section .solar-flare-bg {
  top: 20%;
  left: 0%;
  transform: translate(-30%, -20%);
  width: 1000px;
  height: 800px;
  background: radial-gradient(circle, rgba(255, 160, 60, 0.08) 0%, transparent 70%);
}

/* 6. Testimonios Section Flare (Innovation Impulse) */
.testimonio-section {
  position: relative;
  overflow: hidden;
}

.testimonio-section .solar-flare-bg {
  top: 60%;
  left: 80%;
  transform: translate(-50%, -50%);
  width: 1100px;
  height: 900px;
  background: radial-gradient(circle, rgba(255, 120, 20, 0.09) 0%, transparent 60%);
}

/* --- DATACENTER LIGHTS ON SIMULATION (User Request) --- */

@keyframes datacenterPowerUp {
  0% {
    filter: var(--promesa-orange-filter) brightness(0.28) contrast(1.2);
  }

  15% {
    filter: var(--promesa-orange-filter) brightness(0.28) contrast(1.2);
  }

  16% {
    filter: var(--promesa-orange-filter) brightness(0.58) contrast(1.2);
  }

  /* Flicker 1 */
  17% {
    filter: var(--promesa-orange-filter) brightness(0.28) contrast(1.2);
  }

  25% {
    filter: var(--promesa-orange-filter) brightness(0.68) contrast(1.1);
  }

  /* Flicker 2 */
  26% {
    filter: var(--promesa-orange-filter) brightness(0.38) contrast(1.2);
  }

  28% {
    filter: var(--promesa-orange-filter) brightness(0.78) contrast(1.1);
  }

  /* Power surges */
  30% {
    filter: var(--promesa-orange-filter) brightness(1.15) contrast(1);
  }

  /* Overbright ignition */
  40% {
    filter: var(--promesa-orange-filter) brightness(0.98) contrast(1.05);
  }

  /* Settle */
  100% {
    filter: var(--promesa-orange-filter) brightness(1.08) contrast(1.02);
  }

  /* Stable On */
}

@keyframes serverHum {
  0% {
    transform: scale(1);
    filter: var(--promesa-orange-filter) brightness(1.08) contrast(1.03);
  }

  50% {
    transform: scale(1.005);
    filter: var(--promesa-orange-filter) brightness(1.12) contrast(1.06);
  }

  100% {
    transform: scale(1);
    filter: var(--promesa-orange-filter) brightness(1.08) contrast(1.03);
  }
}

.section-promesa {
  position: relative;
  overflow: hidden;
  background-color: #050505;
  --promesa-orange-filter: sepia(0.42) hue-rotate(-18deg) saturate(1.45);
  /* Deep dark base */
}

/* Base Image - Acts as the "video" canvas */
.section-promesa .imagen-fondo {
  opacity: 1 !important;
  animation: datacenterPowerUp 2.5s cubic-bezier(0.1, 0, 0.2, 1) forwards,
    serverHum 8s ease-in-out infinite 2.5s;
  will-change: filter, transform;
}

/* Content Fade In Delay */
.section-promesa .container {
  opacity: 0;
  animation: contentFadeIn 1s ease-out forwards 2.8s;
  /* Start after lights on */
}

@keyframes contentFadeIn {
  to {
    opacity: 1;
  }
}

/* --- INVERTED AURA CTA (User Request) --- */
.ct-cta {
  position: relative;
  overflow: hidden !important;
  /* contain the aura */
  background: #0B0C0E;
  /* Fallback/base color */
}

/* Scope the aura within the card */
.ct-cta .aura-background.inverted {
  position: absolute;
  top: -50%;
  /* Adjusted to center the rotation */
  left: 0;
  width: 100%;
  height: 150%;
  transform: rotate(180deg);
  transform-origin: center center;
  z-index: 0;
  pointer-events: none;
  filter: hue-rotate(-10deg) saturate(1.2);
  /* Match the orange correction */
}

/* Ensure text is above aura */
.ct-cta h2,
.ct-cta p,

/* --- FOOTER AURA UPWARD FLARE (User Request) --- */
footer {
  position: relative;
  overflow: hidden;
}

footer::after {
  content: '';
  position: absolute;
  bottom: -150px;
  /* Start below the footer */
  left: 50%;
  transform: translateX(-50%);
  width: 120%;
  /* Wider than screen to curve edges */
  height: 400px;
  /* Height of the flame */
  background: radial-gradient(ellipse at center, rgba(255, 100, 0, 0.15) 0%, rgba(255, 140, 0, 0.05) 40%, transparent 70%);
  filter: blur(80px);
  pointer-events: none;
  z-index: 0;
  opacity: 0.8;
}

/* --- RANDOM FOOTER EXPLOSIONS (User Request) --- */
.footer-flames,
.random-flames {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.footer-flames span,
.random-flames span {
  position: absolute;
  bottom: -50px;
  width: 150px;
  height: 150px;
  background: radial-gradient(circle, rgba(255, 69, 0, 0.4) 0%, rgba(255, 140, 0, 0.1) 60%, transparent 80%);
  border-radius: 50%;
  filter: blur(40px);
  opacity: 0;
  transform-origin: bottom center;
}

/* Randomize Flames */
.footer-flames span:nth-child(1),
.random-flames span:nth-child(1) {
  left: 10%;
  animation: flameRise 4s infinite 0s;
  width: 200px;
  height: 300px;
}

.footer-flames span:nth-child(2),
.random-flames span:nth-child(2) {
  left: 30%;
  animation: flameRise 5s infinite 1.5s;
  width: 180px;
  height: 250px;
  background: radial-gradient(circle, rgba(255, 100, 0, 0.5) 0%, transparent 70%);
}

.footer-flames span:nth-child(3),
.random-flames span:nth-child(3) {
  left: 50%;
  animation: flameRise 3.5s infinite 0.5s;
  width: 300px;
  height: 400px;
}

.footer-flames span:nth-child(4),
.random-flames span:nth-child(4) {
  left: 70%;
  animation: flameRise 6s infinite 2.5s;
  width: 220px;
  height: 280px;
}

.footer-flames span:nth-child(5),
.random-flames span:nth-child(5) {
  left: 90%;
  animation: flameRise 4.5s infinite 1s;
  width: 160px;
  height: 220px;
  background: radial-gradient(circle, rgba(255, 165, 0, 0.4) 0%, transparent 70%);
}

/* --- Section Specific Flame Positioning --- */

/* 1. Nosotros: Right Side (User Request: "lado derecho abajo") */
.nosotros-section .random-flames {
  left: auto;
  right: 0;
  width: 60%;
  /* Constrain to right side */
}

/* 2. Preguntas Frecuentes: Left Side (User Request: "lado izquierdo") */
.preguntas-section .random-flames {
  left: 0;
  right: auto;
  width: 50%;
  /* Constrain to left side */
  transform: scaleX(-1);
  /* Flip for variety */
}

/* 3. Acompañamos Proyectos (Timeline): Bottom Center */
.timeline-section .random-flames {
  width: 100%;
  opacity: 0.6;
  /* More subtle */
}

@keyframes flameRise {
  0% {
    transform: translateY(20%) scale(0.5);
    opacity: 0;
  }

  20% {
    opacity: 0.8;
    transform: translateY(0%) scale(1.2);
  }

  /* Explosion peak */
  50% {
    opacity: 0.4;
  }

  100% {
    transform: translateY(-30%) scale(1.5);
    opacity: 0;
  }
}

footer .container {
  position: relative;
  z-index: 1;
  /* Ensure content is above aura */
}

/* Promotora Image Styling */
.promotora-img {
  -webkit-mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
  filter: drop-shadow(0 0 20px rgba(252, 192, 45, 0.1));
  /* Subtle yellow glow from aura palette */
  transition: transform 0.3s ease;
}

@media (min-width: 992px) {
  .promotora-img {
    transform: scale(1.1) translateY(40%);
    /* Slightly larger and pushed down */
  }
}