/* ==========================================================
   1. VARIABLES GLOBALES
   ========================================================== */
:root {
  --bg: #000000;
  --surface: #070b14;
  --surface2: #101827;
  --text: #f5f6fa;
  --muted: #959ba6;
  --blue: #1068F8;
  --container: 1400px;
  --primary-button-bg: linear-gradient(180deg, #1068F8, #0860F0);
  --primary-button-color: #ffffff;
  --primary-button-border: #1068F8;
  --primary-button-shadow: 0 12px 30px rgba(8, 96, 240, 0.28);
}
/* ==========================================================
   2. REINICIO Y ESTILOS BASE
   ========================================================== */
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, Arial, sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
}
a {
  color: inherit;
  text-decoration: none;
}
button,
input {
  font: inherit;
}
.container {
  width: min(calc(100% - 40px), var(--container));
  margin-left: auto;
  margin-right: auto;
}
/* ==========================================================
   3. CABECERA, TOPBAR Y NAVEGACIÓN
   ========================================================== */
.header {
  position: fixed;
  z-index: 50;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(5, 6, 8, 0.94);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(18px);
}
/* ==========================================================
   TOPBAR TECHNEXUS — MÁS GRANDE Y VISIBLE
   ========================================================== */

.topbar {
  position: relative;
  width: 100%;
  height: 46px;

  border-bottom: 1px solid rgba(135, 181, 255, 0.25);

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(76, 137, 235, 0.25),
      transparent 45%
    ),
    linear-gradient(
      90deg,
      #002870 0%,
      #003998 50%,
      #002870 100%
    );

  box-shadow:
    inset 0 -1px 0 rgba(255, 255, 255, 0.04),
    0 5px 22px rgba(0, 0, 0, 0.22);

  overflow: hidden;
}

/* Contenedor interno */

.topbar-inner {
  position: relative;
  z-index: 2;

  width: min(calc(100% - 40px), var(--container));
  height: 100%;
  margin: 0 auto;

  display: grid;
  grid-template-columns: minmax(690px, 1fr) auto minmax(250px, 1fr);
  align-items: center;
  gap: 28px;
}

/* ==========================================================
   CONTACTOS DEL TOPBAR
   ========================================================== */

.topbar-contact {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (min-width: 1101px) and (max-width: 1450px) {
  .topbar-message {
    display: none;
  }

  .topbar-inner {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

/* Enlace principal */

.topbar-animated-link {
  position: relative;
  isolation: isolate;

  height: 34px;
  padding: 0 14px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;

  overflow: hidden;
  flex-shrink: 0;

  border: none;
  border-radius: 7px;

  color: #e5efff;
  background: transparent;

  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;

  cursor: pointer;
  user-select: none;

  transition:
    color 0.35s ease,
    transform 0.25s ease,
    box-shadow 0.35s ease;
}

/* Texto e ícono por encima de la animación */

.topbar-link-text {
  position: relative;
  z-index: 3;
}

.topbar-animated-link > svg {
  position: relative;
  z-index: 3;

  width: 15px;
  height: 15px;

  flex-shrink: 0;

  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;

  transition: transform 0.35s ease;
}

/* Contenedor del borde */

.topbar-border-effect {
  position: absolute;
  inset: 0;
  z-index: 1;

  display: block;
  overflow: hidden;

  border: 1px solid rgba(174, 207, 255, 0.42);
  border-radius: inherit;

  background: rgba(255, 255, 255, 0.055);

  pointer-events: none;
}

/* Franja diagonal */

.topbar-border-effect::before {
  content: "";

  position: absolute;
  top: 50%;
  left: 50%;

  width: 9%;
  height: 600%;

  background: rgba(129, 178, 255, 0.12);

  transform:
    translate(-50%, -50%)
    rotate(-60deg);

  transition:
    width 0.45s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.45s cubic-bezier(0.23, 1, 0.32, 1),
    background 0.35s ease;
}

/* Hover */

.topbar-animated-link:hover {
  color: #071426;

  transform: translateY(-1px);

  box-shadow:
    0 0 18px rgba(126, 174, 255, 0.35);
}

.topbar-animated-link:hover > svg {
  transform: scale(1.1);
}

.topbar-animated-link:hover .topbar-border-effect::before {
  width: 160%;

  background: linear-gradient(
    135deg,
    #c9e0ff 0%,
    #81b1ff 100%
  );

  transform:
    translate(-50%, -50%)
    rotate(-90deg);
}

/* Al presionar */

.topbar-animated-link:active {
  transform: scale(0.96);
}

.topbar-animated-link:active .topbar-border-effect::before {
  background: #6399f2;
}

/* Navegación con teclado */

.topbar-animated-link:focus-visible {
  outline: 2px solid #a9cbff;
  outline-offset: 2px;
}

/* Responsive */

@media (max-width: 600px) {
  .topbar-contact {
    gap: 6px;
  }

  .topbar-link-text {
    display: none;
  }

  .topbar-animated-link {
    width: 32px;
    min-width: 32px;
    height: 32px;
    padding: 0;

    border-radius: 50%;
  }

  .topbar-border-effect {
    border-radius: 50%;
  }
}

/* ==========================================================
   MENSAJE CENTRAL
   ========================================================== */

.topbar-message {
  position: relative;

  margin: 0;
  padding: 0 16px;

  color: #e1edff;

  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2.2px;
  text-align: center;
  white-space: nowrap;

  text-shadow:
    0 0 14px rgba(129, 177, 255, 0.42);
}

.topbar-message::before {
  content: "";

  display: inline-block;

  width: 6px;
  height: 6px;
  margin-right: 10px;

  border-radius: 50%;

  background: #1068F8;

  box-shadow:
    0 0 10px rgba(141, 187, 255, 1);

  vertical-align: 1px;

  animation: topbarPulse 2s ease-in-out infinite;
}

@keyframes topbarPulse {
  0%,
  100% {
    opacity: 0.45;
    transform: scale(0.8);
  }

  50% {
    opacity: 1;
    transform: scale(1.15);
  }
}

/* ==========================================================
   REDES SOCIALES
   ========================================================== */

.topbar-social {
  min-width: 0;

  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}

.brand-pill {
  height: 30px;
  padding: 0 13px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;

  border: 1px solid rgba(191, 217, 255, 0.27);
  border-radius: 999px;

  color: #e5efff;
  background: rgba(4, 14, 28, 0.28);

  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.3px;
  white-space: nowrap;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

/* Botones de redes */

.topbar-social-btn {
  position: relative;
  z-index: 1;

  width: 31px;
  height: 31px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;
  overflow: hidden;

  border: none;
  border-radius: 50%;

  color: #ffffff;
  text-decoration: none;

  cursor: pointer;

  transition:
    transform 0.25s ease,
    box-shadow 0.35s ease;
}

.topbar-social-btn svg {
  position: relative;
  z-index: 4;

  width: 16px;
  height: 16px;

  fill: currentColor;

  transition: transform 0.35s ease;
}

/* Capa oscura inicial */

.topbar-social-btn::before {
  content: "";

  position: absolute;
  z-index: 2;

  width: 35px;
  height: 35px;

  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 50%;

  background: #121b29;

  transition:
    width 0.4s cubic-bezier(0.23, 1, 0.32, 1),
    height 0.4s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.35s ease;
}

.topbar-social-btn:hover {
  transform: translateY(-2px) scale(1.08);
}

.topbar-social-btn:hover::before {
  width: 0;
  height: 0;
  opacity: 0;
}

.topbar-social-btn:hover svg {
  transform: scale(1.12);
}

.topbar-social-btn:active {
  transform: scale(0.86);
}

/* Facebook */

.social-facebook {
  background: linear-gradient(
    135deg,
    #2d8cff,
    #1454c2
  );
}

.social-facebook:hover {
  box-shadow:
    0 0 17px rgba(24, 119, 242, 0.72);
}

/* Instagram */

.social-instagram {
  background: linear-gradient(
    135deg,
    #833ab4 0%,
    #fd1d1d 52%,
    #fcb045 100%
  );
}

.social-instagram:hover {
  box-shadow:
    0 0 17px rgba(235, 54, 102, 0.68);
}

/* TikTok */

.social-tiktok {
  background: linear-gradient(
    135deg,
    #25f4ee 0%,
    #111111 45%,
    #fe2c55 100%
  );
}

.social-tiktok:hover {
  box-shadow:
    -4px 0 13px rgba(37, 244, 238, 0.5),
    4px 0 13px rgba(254, 44, 85, 0.5);
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 1100px) {
  .topbar-inner {
    grid-template-columns: 1fr auto;
    gap: 16px;
  }

  .topbar-message {
    display: none;
  }

  .topbar-social {
    justify-self: end;
  }
}

@media (max-width: 700px) {
  .topbar {
    height: 42px;
  }

  .topbar-inner {
    width: min(calc(100% - 40px), var(--container));
    gap: 8px;
  }

  .topbar-contact {
    gap: 6px;
  }

  .topbar-animated-link {
    height: 31px;
    padding: 0 10px;
    font-size: 10px;
  }

  .brand-pill {
    display: none;
  }

  .topbar-social {
    gap: 6px;
  }

  .topbar-social-btn {
    width: 29px;
    height: 29px;
  }
}

@media (max-width: 540px) {
  .topbar-link-text {
    display: none;
  }

  .topbar-animated-link {
    width: 31px;
    min-width: 31px;
    height: 31px;
    padding: 0;

    border-radius: 50%;
  }

  .topbar-border-effect {
    border-radius: 50%;
  }

  .topbar-animated-link > svg {
    width: 14px;
    height: 14px;
  }
}
.navbar {
  height: 70px;
  display: flex;
  align-items: center;
  gap: 34px;
}
.logo {
  font-weight: 800;
  font-size: 18px;
  letter-spacing: -0.7px;
}
.logo-mark {
  display: flex;
  align-items: center;
  gap: 9px;
}
.logo-symbol {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(130, 175, 255, 0.2);
  background: linear-gradient(
    145deg,
    rgba(130, 175, 255, 0.16),
    rgba(130, 175, 255, 0.03)
  );
  color: #c8ddff;
  font-size: 12px;
  letter-spacing: -2px;
  box-shadow: inset 0 0 16px rgba(130, 175, 255, 0.05);
}
.logo-symbol span {
  color: #83b0ff;
}
.nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-left: auto;
}
.nav a {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  padding: 12px 15px;
  border-radius: 4px;

  color: #aab2c2;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;

  transition:
    color 0.35s ease,
    transform 0.35s ease;
}

/* Línea inferior animada */
.nav a::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;

  width: 0;
  height: 2px;

  background: #1068F8;
  box-shadow: 0 0 12px rgba(141, 187, 255, 0.75);

  transition: width 0.4s ease;
  z-index: -1;
}

/* Fondo que sube */
.nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;

  width: 100%;
  height: 0;

  background: linear-gradient(
    135deg,
    #0860F0 0%,
    #a9ceff 100%
  );

  transition: height 0.4s ease 0.25s;
  z-index: -1;
}

/* Hover */
.nav a:hover {
  color: #07101e;
  transform: translateY(-2px);
  transition-delay: 0.25s;
}

.nav a:hover::before {
  width: 100%;
}

.nav a:hover::after {
  height: 100%;
}

.nav-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
/* ==========================================================
   ACCIONES DEL NAV
   ========================================================== */

.nav-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-shrink: 0;
}

/* ==========================================================
   BOTÓN WHATSAPP EXPANDIBLE
   ========================================================== */

.whatsapp-expand {
  position: relative;

  width: 45px;
  min-width: 45px;
  height: 45px;

  display: inline-flex;
  align-items: center;
  justify-content: flex-start;

  overflow: hidden;
  flex-shrink: 0;

  border: 1px solid rgba(0, 215, 87, 0.45);
  border-radius: 50%;

  background: #00b94f;
  color: #ffffff;
  text-decoration: none;

  cursor: pointer;
  box-sizing: border-box;

  box-shadow:
    0 0 18px rgba(0, 215, 87, 0.16),
    2px 2px 10px rgba(0, 0, 0, 0.2);

  transition:
    width 0.35s ease,
    border-radius 0.35s ease,
    background-color 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.2s ease;
}

/* Ícono */

.whatsapp-sign {
  width: 43px;
  min-width: 43px;
  height: 43px;

  display: flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;
  z-index: 2;

  transition: transform 0.35s ease;
}

.whatsapp-sign svg {
  width: 22px;
  height: 22px;
  display: block;
}

.whatsapp-sign svg path {
  fill: #ffffff;
}

/* Texto oculto */

.whatsapp-text {
  position: absolute;
  left: 46px;

  width: 90px;

  color: #ffffff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  white-space: nowrap;

  opacity: 0;
  visibility: hidden;
  transform: translateX(12px);

  transition:
    opacity 0.25s ease,
    visibility 0.25s ease,
    transform 0.35s ease;
}

/* Hover */

.whatsapp-expand:hover {
  width: 150px;
  border-radius: 999px;
  background: #00d757;

  box-shadow:
    0 0 24px rgba(0, 215, 87, 0.3),
    2px 2px 12px rgba(0, 0, 0, 0.25);
}

.whatsapp-expand:hover .whatsapp-sign {
  transform: translateX(2px);
}

.whatsapp-expand:hover .whatsapp-text {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.whatsapp-expand:active {
  transform: translateY(2px) scale(0.98);
}

/* ==========================================================
   BOTÓN AGENDAR CITA ANIMADO
   ========================================================== */

.appointment-button {
  position: relative;

  width: 155px;
  height: 44px;
  padding: 0 38px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;

  flex-shrink: 0;
  overflow: hidden;

  border: 2px solid transparent;
  border-radius: 999px;

  background: transparent;
  color: #ffffff;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  white-space: nowrap;
  text-decoration: none;

  box-shadow:
    0 0 0 1px #1068F8,
    0 0 18px rgba(126, 174, 255, 0.16);

  cursor: pointer;

  transition:
    color 0.6s cubic-bezier(0.23, 1, 0.32, 1),
    border-radius 0.6s cubic-bezier(0.23, 1, 0.32, 1),
    box-shadow 0.6s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.25s ease;
}

/* Flechas */

.appointment-arrow {
  position: absolute;
  width: 19px;
  height: 19px;

  fill: #ffffff;
  z-index: 3;

  transition:
    left 0.8s cubic-bezier(0.23, 1, 0.32, 1),
    right 0.8s cubic-bezier(0.23, 1, 0.32, 1),
    fill 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.appointment-arr-1 {
  right: 14px;
}

.appointment-arr-2 {
  left: -30px;
}

/* Texto */

.appointment-text {
  position: relative;
  z-index: 2;

  transform: translateX(-8px);

  transition:
    transform 0.8s cubic-bezier(0.23, 1, 0.32, 1),
    color 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Círculo que cubre el botón */

.appointment-circle {
  position: absolute;
  top: 50%;
  left: 50%;

  width: 20px;
  height: 20px;

  border-radius: 50%;

  background: linear-gradient(
    135deg,
    #1068F8 0%,
    #0860F0 100%
  );

  opacity: 0;
  transform: translate(-50%, -50%);

  transition:
    width 0.8s cubic-bezier(0.23, 1, 0.32, 1),
    height 0.8s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.4s ease;
}

/* Hover */

.appointment-button:hover {
  color: #001038;
  border-radius: 12px;

  box-shadow:
    0 0 0 10px transparent,
    0 0 25px rgba(126, 174, 255, 0.25);
}

.appointment-button:hover .appointment-arr-1 {
  right: -30px;
}

.appointment-button:hover .appointment-arr-2 {
  left: 14px;
}

.appointment-button:hover .appointment-text {
  color: #001038;
  transform: translateX(10px);
}

.appointment-button:hover .appointment-arrow {
  fill: #001038;
}

.appointment-button:hover .appointment-circle {
  width: 230px;
  height: 230px;
  opacity: 1;
}

/* Al presionar */

.appointment-button:active {
  transform: scale(0.95);

  box-shadow:
    0 0 0 4px rgba(141, 187, 255, 0.7),
    0 0 20px rgba(126, 174, 255, 0.25);
}

/* Accesibilidad con teclado */

.appointment-button:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}
/* ==========================================================
   4. BOTONES REUTILIZABLES
   ========================================================== */
.button {
  height: 44px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 700;
  transition: 0.2s;
}
.button:hover {
  transform: translateY(-2px);
}
.button-primary {
  color: var(--primary-button-color);
  background: var(--primary-button-bg);
  border-color: var(--primary-button-border);
  box-shadow: var(--primary-button-shadow);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
}
.button-outline {
  background: rgba(10, 11, 14, 0.45);
  border-color: rgba(255, 255, 255, 0.23);
}
.button-small {
  height: 34px;
  padding: 0 15px;
  font-size: 11px;
}
/* ==========================================================
   5. SECCIÓN PRINCIPAL (HERO)
   ========================================================== */
.hero {
  position: relative;
  min-height: 780px;
  padding-top: 104px;
  overflow: hidden;
  background: #020609;
}
.hero-backgrounds,
.hero-background {
  position: absolute;
  inset: 0;
}
.hero-backgrounds {
  z-index: 0;
  overflow: hidden;
}
.hero-background {
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  opacity: 0;
  transform: scale(1.035);
  filter: brightness(0.62) saturate(1.08);
  transition: opacity 1s ease, transform 6.5s ease;
}
.hero-background:nth-child(1) {
  filter: brightness(0.84) saturate(1.05);
}
.hero-background:nth-child(2) {
  filter: brightness(0.79) saturate(1.08);
}
.hero-background:nth-child(3) {
  filter: brightness(0.82) saturate(1.05);
}
.hero-background:nth-child(4) {
  filter: brightness(0.82) saturate(1.05);
}
.hero-background.is-active {
  opacity: 1;
  transform: scale(1);
}

/* Mantiene el sujeto de cada escena dentro del area segura del banner. */
.hero-background:nth-child(1) { background-position: 72% center; }
.hero-background:nth-child(2) { background-position: 78% center; }
.hero-background:nth-child(3) { background-position: 76% center; }
.hero-background:nth-child(4) { background-position: 80% center; }

@media (max-width: 760px) {
  .hero-background { background-position: center bottom; }
}
.hero:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(
      90deg,
      rgba(3, 7, 10, 0.96),
      rgba(3, 8, 12, 0.7) 40%,
      rgba(3, 8, 12, 0.09) 70%,
      rgba(3, 7, 10, 0.24)
    ),
    linear-gradient(
      180deg,
      transparent 56%,
      rgba(0, 0, 0, 0.22) 70%,
      rgba(0, 0, 0, 0.72) 88%,
      #000 100%
    );
  pointer-events: none;
}
.hero-section-bridge {
  position: absolute;
  z-index: 3;
  bottom: -165px;
  width: min(42vw, 580px);
  height: 310px;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 100%, rgba(84, 150, 255, .3) 0%, rgba(51, 105, 221, .13) 46%, transparent 74%);
  filter: blur(28px);
  opacity: .58;
  pointer-events: none;
}
.hero-section-bridge--left { left: -180px; }
.hero-section-bridge--right { right: -180px; }
.hero-about-connector {
  position: relative;
  z-index: 4;
  height: 0;
  pointer-events: none;
}
.hero-about-connector::before {
  content: "";
  position: absolute;
  top: -76px;
  right: 0;
  left: 0;
  height: 152px;
  background:
    radial-gradient(ellipse 28% 70px at 0% 50%, rgba(80, 145, 255, .18), transparent 76%),
    radial-gradient(ellipse 28% 70px at 100% 50%, rgba(80, 145, 255, .18), transparent 76%),
    linear-gradient(90deg, rgba(91, 155, 255, .12), transparent 27%, transparent 73%, rgba(91, 155, 255, .12));
  filter: blur(13px);
  opacity: .72;
}
.grid-bg {
  position: absolute;
  inset: 104px 0 0;
  opacity: 0.12;
  background-image:
    linear-gradient(rgba(105, 175, 229, 0.18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(105, 175, 229, 0.18) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: linear-gradient(#000, transparent 77%);
}
.hero-code-editor {
  position: absolute;
  z-index: 4;
  top: auto;
  bottom: 152px;
  right: max(30px, calc((100vw - var(--container)) / 2));
  width: min(390px, 29vw);
  overflow: hidden;
  border: 1px solid rgba(141, 187, 255, 0.2);
  border-radius: 12px;
  background: rgba(4, 9, 17, 0.94);
  box-shadow:
    0 24px 65px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(141, 187, 255, 0.04),
    0 0 28px rgba(73, 133, 255, 0.1);
  backdrop-filter: blur(18px);
  opacity: 0;
  transform: translateX(35px) scale(0.96);
  pointer-events: none;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.hero-code-editor.is-visible {
  opacity: 0.96;
  transform: translateX(0) scale(1);
  animation: editor-modern-glow 3.8s ease-in-out infinite;
}
.code-editor-bar {
  height: 40px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(13, 25, 42, 0.98);
  border-bottom: 1px solid rgba(141, 187, 255, 0.12);
}
.code-editor-bar strong {
  margin-left: 7px;
  color: #aeb9d6;
  font: 600 11px Consolas, monospace;
}
.editor-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
}
.editor-dot-red { background: #ff5f57; }
.editor-dot-yellow { background: #ffbd2e; }
.editor-dot-green { background: #28c840; }
.code-editor-body {
  min-height: 170px;
  padding: 17px 14px;
  display: flex;
  background:
    linear-gradient(135deg, rgba(126, 174, 255, 0.035), transparent 55%),
    rgba(5, 11, 21, 0.96);
}
.code-line-numbers {
  padding-right: 14px;
  color: #4f5b82;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  font: 12px/1.65 Consolas, monospace;
  text-align: right;
}
.code-editor-body pre {
  min-width: 0;
  margin: 0;
  padding-left: 14px;
  color: #9dc4ff;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: 600 11px/1.65 Consolas, monospace;
}
.code-comment {
  color: #57a64a;
}
.code-keyword,
.code-php {
  color: #569cd6;
}
.code-variable {
  color: #9cdcfe;
}
.code-string {
  color: #ce9178;
}
.code-terminal {
  max-height: 0;
  overflow: hidden;
  border-top: 1px solid transparent;
  background: #050b12;
  opacity: 0;
  transition:
    max-height 0.55s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.35s ease,
    border-color 0.35s ease;
}
.code-terminal.is-visible {
  max-height: 145px;
  border-top-color: rgba(141, 187, 255, 0.14);
  opacity: 1;
}
.code-terminal-title {
  height: 27px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  color: #aab6c8;
  font: 700 8px Consolas, monospace;
  letter-spacing: 0.8px;
}
.code-terminal-title span {
  color: #57a64a;
}
.code-terminal-output {
  padding: 9px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font: 9px/1.35 Consolas, monospace;
}
.terminal-command {
  color: #7e8a9d;
}
.code-terminal-output strong {
  color: #6fce82;
  font-weight: 500;
}
.code-terminal-output b {
  margin-top: 2px;
  color: #9dc4ff;
  font-weight: 600;
}
.code-cursor {
  display: inline-block;
  width: 2px;
  height: 13px;
  margin-left: 2px;
  background: #9dc4ff;
  vertical-align: -2px;
  animation: code-cursor-blink 0.8s steps(1) infinite;
}
.code-preview {
  padding: 17px 18px 19px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  border-top: 1px solid rgba(141, 187, 255, 0.16);
  background: rgba(8, 17, 29, 0.98);
}
.code-preview small {
  margin-bottom: 5px;
  color: #1068F8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.8px;
}
.code-preview strong {
  color: #ffffff;
  font-size: 17px;
}
.code-preview span {
  color: #8f9ab3;
  font-size: 11px;
}
@keyframes code-cursor-blink {
  50% { opacity: 0; }
}
@keyframes editor-modern-glow {
  0%, 100% {
    border-color: rgba(141, 187, 255, 0.28);
    box-shadow:
      0 24px 65px rgba(0, 0, 0, 0.5),
      0 0 0 1px rgba(141, 187, 255, 0.06),
      0 0 18px rgba(73, 133, 255, 0.14),
      -7px -4px 18px rgba(73, 133, 255, 0.08);
  }
  50% {
    border-color: rgba(141, 187, 255, 0.48);
    box-shadow:
      0 28px 72px rgba(0, 0, 0, 0.56),
      0 0 0 1px rgba(141, 187, 255, 0.12),
      8px 7px 30px rgba(73, 133, 255, 0.24),
      -9px -6px 26px rgba(73, 133, 255, 0.18);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-code-editor.is-visible {
    animation: none;
  }
}
.hero-content {
  position: relative;
  z-index: 5;
  padding-top: clamp(44px, 7vh, 72px);
}

.hero-carousel {
  position: relative;
  display: grid;
  max-width: 1100px;
}

.hero-slide {
  grid-area: 1 / 1;
  padding-bottom: 30px;
  opacity: 0;
  visibility: hidden;
  transform: translateX(28px);
  transition:
    opacity 0.55s ease,
    transform 0.55s ease,
    visibility 0s linear 0.55s;
}

.hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition-delay: 0s;
}

.hero-slide p {
  max-width: 690px;
  margin: 0;
  color: #a6adb8;
  font-size: 14px;
  line-height: 1.75;
}

.hero-carousel-controls {
  position: absolute;
  bottom: 2px;
  left: 0;
  z-index: 3;
  display: flex;
  gap: 7px;
}

.hero-carousel-controls button {
  width: 22px;
  height: 4px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.22);
  cursor: pointer;
  transition: width 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

.hero-carousel-controls button.is-active {
  width: 40px;
  background: #1068F8;
  box-shadow: 0 0 12px rgba(141, 187, 255, 0.75);
}

.hero-carousel-controls button:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}


/* ==========================================================
   BUSCADOR DEL HERO
   No modifica los otros elementos de .hero-content
   ========================================================== */

.hero-search {
  position: relative;
  isolation: isolate;

  width: min(100%, 390px);
  height: 58px;

  margin-top: 27px;
  margin-bottom: 0;

  display: flex;
  align-items: center;
  justify-content: center;
}

/* Capas del borde luminoso */

.hero-search-glow,
.hero-search-dark-border,
.hero-search-white-border,
.hero-search-border {
  position: absolute;
  pointer-events: none;
  overflow: hidden;
  border-radius: 13px;
}

.hero-search-glow {
  inset: -14px;
  z-index: -4;

  opacity: 0.35;
  filter: blur(24px);
}

.hero-search-dark-border {
  inset: -4px;
  z-index: -3;

  filter: blur(3px);
}

.hero-search-white-border {
  inset: -2px;
  z-index: -2;

  filter: blur(1.5px);
}

.hero-search-border {
  inset: -1px;
  z-index: -1;

  filter: blur(0.4px);
}

/* Gradientes animados */

.hero-search-glow::before,
.hero-search-dark-border::before,
.hero-search-white-border::before,
.hero-search-border::before {
  content: "";

  position: absolute;
  top: 50%;
  left: 50%;

  width: 700px;
  height: 700px;

  transform: translate(-50%, -50%) rotate(75deg);

  transition:
    transform 1.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.hero-search-glow::before {
  background: conic-gradient(
    transparent 0deg,
    #1068F8 48deg,
    transparent 105deg,
    transparent 180deg,
    #ffffff 230deg,
    transparent 290deg
  );
}

.hero-search-dark-border::before {
  background: conic-gradient(
    transparent 0deg,
    #003998 48deg,
    transparent 110deg,
    transparent 180deg,
    #001038 230deg,
    transparent 292deg
  );
}

.hero-search-white-border::before {
  background: conic-gradient(
    transparent 0deg,
    #ffffff 45deg,
    transparent 100deg,
    transparent 180deg,
    #ffffff 230deg,
    transparent 285deg
  );
}

.hero-search-border::before {
  background: conic-gradient(
    #001038 0deg,
    #1068F8 48deg,
    #001038 105deg,
    #001038 180deg,
    #ffffff 230deg,
    #001038 290deg
  );
}

/* Movimiento del borde */

.hero-search:hover .hero-search-glow::before,
.hero-search:hover .hero-search-dark-border::before,
.hero-search:hover .hero-search-white-border::before,
.hero-search:hover .hero-search-border::before {
  transform: translate(-50%, -50%) rotate(255deg);
}

.hero-search:focus-within .hero-search-glow::before,
.hero-search:focus-within .hero-search-dark-border::before,
.hero-search:focus-within .hero-search-white-border::before,
.hero-search:focus-within .hero-search-border::before {
  transform: translate(-50%, -50%) rotate(435deg);
  transition-duration: 3s;
}

/* Parte interior */

.hero-search-main {
  position: relative;
  z-index: 2;

  width: 100%;
  height: 56px;

  display: flex;
  align-items: center;

  overflow: hidden;
  border-radius: 12px;

  background:
    linear-gradient(
      135deg,
      rgba(14, 23, 35, 0.98),
      rgba(3, 6, 11, 0.98)
    );

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.05),
    0 12px 34px rgba(0, 0, 0, 0.3);
}

/* Input */

.hero-search-input {
  position: relative;
  z-index: 2;

  width: 100%;
  height: 100%;

  padding: 0 64px 0 20px;

  border: none;
  outline: none;
  border-radius: 12px;

  color: #ffffff;
  background: transparent;

  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
}

.hero-search-input::placeholder {
  color: #818b9b;
}

.hero-search-input::-webkit-search-cancel-button {
  display: none;
}

/* Luz interior */

.hero-search-light {
  position: absolute;
  top: 12px;
  left: 10px;

  width: 30px;
  height: 30px;

  border-radius: 50%;
  background: #377dff;

  opacity: 0.22;
  filter: blur(18px);
  pointer-events: none;

  transition:
    opacity 0.4s ease,
    transform 0.5s ease;
}

.hero-search:hover .hero-search-light,
.hero-search:focus-within .hero-search-light {
  opacity: 0.55;
  transform: translateX(35px);
}

/* Botón del buscador */

.hero-search-button {
  position: absolute;
  z-index: 4;

  top: 8px;
  right: 8px;

  width: 40px;
  height: 40px;

  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(132, 176, 255, 0.22);
  border-radius: 9px;

  color: #dce9ff;

  background:
    linear-gradient(
      180deg,
      rgba(43, 68, 110, 0.8),
      rgba(9, 15, 26, 0.98)
    );

  cursor: pointer;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 15px rgba(56, 118, 255, 0.13);

  transition:
    color 0.25s ease,
    background 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.hero-search-button:hover {
  color: #001038;

  background:
    linear-gradient(
      135deg,
      #1068F8,
      #0860F0
    );

  transform: scale(1.05);

  box-shadow:
    0 0 20px rgba(126, 174, 255, 0.35);
}

.hero-search-button:active {
  transform: scale(0.94);
}

/* Mantener la separación original de los botones */

.hero-search + .hero-buttons {
  margin-top: 26px;
}

/* Responsive */

@media (max-width: 600px) {
  .hero-search {
    width: 100%;
    max-width: 390px;
  }

  .hero-search-input {
    padding-left: 16px;
    font-size: 11px;
  }
}

.badge {
  width: max-content;
  height: 26px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(115, 171, 255, 0.22);
  background: rgba(82, 139, 218, 0.1);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.4px;
  color: #a9c8ff;
}
.badge i {
  width: 5px;
  height: 5px;
  background: #7baeff;
  border-radius: 50%;
  box-shadow: 0 0 10px #7baeff;
}
.chromatic {
  text-shadow:
    -1px 0 rgba(74, 145, 255, 0.95),
    1px 0 rgba(255, 96, 74, 0.78);
}
.hero h1 {
  margin: 30px 0 22px;
  font-size: clamp(44px, 5.2vw, 68px);
  line-height: 0.99;
  letter-spacing: -4px;
}
.hero-accent {
  color: #1068F8;
  background: linear-gradient(135deg, #FFFFFF 5%, #1068F8 48%, #003998 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
}
.hero-buttons {
  display: flex;
  gap: 12px;
  margin-top: 31px;
}
.hero-buttons .button-primary {
  position: relative;
  z-index: 0;
  border-radius: 999px;
  cursor: pointer;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.hero-buttons .button-primary::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: #1068F8;
  transition:
    transform 0.4s ease,
    opacity 0.4s ease;
}
.hero-buttons .button-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(73, 133, 255, 0.35);
}
.hero-buttons .button-primary:hover::after {
  transform: scaleX(1.4) scaleY(1.65);
  opacity: 0;
}
.hero-buttons .button-primary:active {
  transform: translateY(-1px);
  box-shadow: 0 5px 12px rgba(73, 133, 255, 0.28);
}
.hero-buttons .button-icon {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.2s ease;
}
.hero-buttons .button-primary:hover .button-icon {
  transform: translate(2px, -2px);
}
.hero-buttons b {
  width: 18px;
  height: 18px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 7px;
}
.trust {
  margin-top: 118px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.avatars {
  display: flex;
  padding-left: 10px;
}
.avatars img {
  width: 34px;
  height: 34px;
  margin-left: -10px;
  border: 2px solid #071018;
  border-radius: 50%;
  display: block;
  object-fit: cover;
  object-position: center 27%;
  background: #f7f9ff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.35);
}
.hero-services-button {
  width: 165px;
}
.trust strong,
.trust small {
  display: block;
  font-size: 10px;
}
.trust small {
  color: #838b96;
}
.team-trust {
  width: fit-content;
  min-width: 365px;
  padding: 12px 18px 12px 12px;
  gap: 18px;
  /* Card sin fondo: conserva únicamente el contenido. */
  background: transparent;
  border: 1px solid rgba(16, 104, 248, .95);
  border-radius: 16px;
  box-shadow:
    0 0 7px rgba(16, 104, 248, .82),
    0 0 18px rgba(16, 104, 248, .56),
    inset 0 0 9px rgba(16, 104, 248, .22);
  backdrop-filter: none;
}
.team-trust .avatars { position: relative; padding-left: 15px; }
.team-trust .avatars::before {
  content: "STAFF";
  position: absolute;
  top: -8px;
  left: 18px;
  z-index: 2;
  padding: 3px 6px;
  border: 1px solid rgba(16, 104, 248, .72);
  border-radius: 999px;
  color: #fff;
  background: #003998;
  font-size: 7px;
  font-weight: bold;
  letter-spacing: .1em;
}
.team-trust .avatars img {
  width: 62px;
  height: 62px;
  margin-left: -15px;
  border: 3px solid #101f38;
  box-shadow: 0 7px 17px rgba(0, 0, 0, .42);
}
.team-trust .avatars img:first-child { margin-left: 0; }

/* Equipo: composicion centrada y minimalista. */
.team-trust {
  min-width: 330px;
  margin-right: auto;
  margin-left: auto;
  padding: 8px 0;
  gap: 14px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.team-trust .avatars { padding-left: 0; }
.team-trust .avatars::before { display: none; }
.team-trust .avatars img {
  width: 52px;
  height: 52px;
  margin-left: -10px;
  border: 2px solid rgba(175, 198, 232, .7);
  box-shadow: none;
}
.team-trust strong { font-size: 11px; font-weight: 600; letter-spacing: 0; }
.team-trust small { max-width: 210px; margin-top: 3px; font-size: 9px; }
.team-trust strong { color: #f4f8ff; font-size: 12px; letter-spacing: .01em; }
.team-trust small { max-width: 200px; margin-top: 4px; color: #aab9cf; font-size: 10px; line-height: 1.45; }

/* Ajustes de tipografia finales para la variante minimalista. */
.team-trust strong { font-size: 11px; font-weight: 600; letter-spacing: 0; }
.team-trust small { max-width: 210px; margin-top: 3px; font-size: 9px; }
@media (max-width: 620px) {
  .team-trust { min-width: 0; width: 100%; padding: 11px; gap: 13px; }
  .team-trust .avatars img { width: 49px; height: 49px; margin-left: -13px; }
  .team-trust small { max-width: 175px; }
}
.clients {
  position: relative;
  z-index: 5;
  margin-top: 38px;
  padding-top: 21px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  display: flex;
  justify-content: flex-end;
  gap: 54px;
  color: #6f7782;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.3px;
}
.tech-carousel {
  position: relative;
  z-index: 5;
  margin-top: 72px;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.tech-track {
  width: max-content;
  display: flex;
  animation: tech-marquee 32s linear infinite;
}
.tech-group {
  display: flex;
  align-items: center;
  gap: 22px;
  padding-right: 22px;
}
.tech-item {
  position: relative;
  min-width: 72px;
  height: 64px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}
.tech-item::before {
  content: "";
  position: absolute;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(95, 151, 255, 0.28), rgba(73, 133, 255, 0.08) 45%, transparent 72%);
  filter: blur(5px);
  opacity: 0.7;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.tech-item img,
.stitch-icon {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  object-fit: contain;
  flex-shrink: 0;
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.2));
}
.tech-item span {
  display: none;
}
.tech-item.is-icon-fallback::after {
  content: attr(data-fallback);
  position: relative;
  z-index: 1;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgba(141, 190, 255, .55);
  border-radius: 50%;
  color: #eaf4ff;
  background: rgba(11, 32, 63, .84);
  box-shadow: 0 0 13px rgba(45, 129, 255, .3);
  font: 800 9px/1 Inter, Arial, sans-serif;
  letter-spacing: .4px;
}
.stitch-icon {
  display: grid;
  place-items: center;
  border-radius: 6px;
  color: #ffffff;
  background: transparent;
  font-size: 25px;
  font-style: normal;
  box-shadow: inset 0 0 10px rgba(73, 133, 255, 0.12);
}
.tech-item:hover {
  transform: translateY(-3px) scale(1.08);
}
.tech-item:hover::before {
  opacity: 1;
  transform: scale(1.25);
}
@keyframes tech-marquee {
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .tech-track {
    animation-play-state: paused;
  }
}
.code-window {
  position: absolute;
  z-index: 1;
  width: 760px;
  height: 470px;
  right: -20px;
  top: 150px;
  border: 1px solid rgba(105, 169, 223, 0.11);
  background: linear-gradient(rgba(8, 24, 35, 0.96), rgba(3, 11, 17, 0.94));
  box-shadow: 0 25px 70px rgba(0, 0, 0, 0.6);
  transform: perspective(1200px) rotateY(-7deg) rotateX(2deg);
  opacity: 0.86;
}
.window-top {
  height: 38px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  gap: 7px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.window-top i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2f4759;
}
.window-body {
  display: flex;
  padding: 30px 38px;
}
.numbers {
  width: 40px;
  color: #39576b;
  font-size: 9px;
  line-height: 18px;
}
.code {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.code span {
  display: block;
  height: 5px;
  border-radius: 6px;
  background: linear-gradient(90deg, #466d7f, #183244);
}
.code .blue {
  background: linear-gradient(90deg, #2d7faa, #1c425a);
}
.code .purple {
  background: linear-gradient(90deg, #5e5a99, #282b4e);
}
.w46 {
  width: 46%;
}
.w48 {
  width: 48%;
}
.w55 {
  width: 55%;
}
.w60 {
  width: 60%;
}
.w64 {
  width: 64%;
}
.w68 {
  width: 68%;
}
.w72 {
  width: 72%;
}
.w78 {
  width: 78%;
}
.w84 {
  width: 84%;
}
.w88 {
  width: 88%;
}
.w90 {
  width: 90%;
}
.w92 {
  width: 92%;
}
.window-cards {
  position: absolute;
  left: 80px;
  right: 38px;
  bottom: 34px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.window-cards i {
  height: 74px;
  border: 1px solid rgba(100, 171, 219, 0.11);
  background:
    linear-gradient(135deg, rgba(50, 111, 150, 0.1), transparent),
    rgba(8, 20, 29, 0.86);
}
/* ==========================================================
   6. ESTILOS GENERALES DE SECCIONES
   ========================================================== */
.hero-next-cta {
  position: relative;
  isolation: isolate;
  min-height: 445px;
  overflow: hidden;
  border-top: 0;
  border-bottom: 0;
  background:
    linear-gradient(rgba(105, 175, 229, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(105, 175, 229, 0.045) 1px, transparent 1px),
    radial-gradient(ellipse 52% 230px at 50% 100%, rgba(255, 255, 255, 0.28), transparent 72%),
    #03070d;
  background-size: 38px 38px, 38px 38px, auto, auto;
  background-attachment: fixed, fixed, scroll, scroll;
}
.hero-next-cta::before,
.hero-next-cta::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #1068F8;
  box-shadow:
    180px 95px 0 rgba(141, 187, 255, 0.55),
    420px 245px 0 rgba(126, 174, 255, 0.42),
    760px 65px 0 rgba(141, 187, 255, 0.35),
    1040px 285px 0 rgba(141, 187, 255, 0.5),
    1280px 120px 0 rgba(126, 174, 255, 0.38);
  opacity: 0.65;
}
.hero-next-cta::before {
  top: 30px;
  left: 3%;
}
.hero-next-cta::after {
  right: 8%;
  bottom: 40px;
  transform: rotate(180deg);
}
.hero-next-glow {
  position: absolute;
  z-index: 0;
  left: 50%;
  bottom: -155px;
  width: min(980px, 88vw);
  height: 310px;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 30%, rgba(99, 158, 255, 0.34), rgba(42, 91, 207, 0.16) 36%, transparent 70%);
  transform: translateX(-50%);
  filter: blur(22px);
  display: block;
  opacity: .92;
  pointer-events: none;
  animation: hero-cloud-drift 11s ease-in-out infinite alternate;
}
.hero-next-glow::before,
.hero-next-glow::after { content:""; position:absolute; border-radius:50%; filter:blur(26px); background:rgba(95,153,255,.2); }
.hero-next-glow::before { width:55%; height:64%; left:-12%; top:32%; }.hero-next-glow::after { width:48%; height:75%; right:-7%; top:12%; background:rgba(64,122,239,.16); }
@keyframes hero-cloud-drift { from { transform:translateX(-52%) scale(.97); } to { transform:translateX(-48%) scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .hero-next-glow { animation:none; } }
.hero-next-glow { bottom:-125px; width:min(1120px,96vw); height:300px; background:radial-gradient(ellipse at 50% 100%,rgba(255,255,255,.62),rgba(255,255,255,.2) 48%,transparent 74%); filter:blur(19px); animation:none; }
.hero-next-glow::before,.hero-next-glow::after { display:none; }
.hero-next-content {
  position: relative;
  z-index: 2;
  padding-top: 67px;
  padding-bottom: 64px;
  text-align: center;
}
.hero-next-kicker {
  width: max-content;
  min-height: 30px;
  margin: 0 auto 22px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(126, 174, 255, 0.4);
  border-radius: 999px;
  background: rgba(82, 139, 218, 0.09);
  color: #9ebeff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
}
.hero-next-kicker i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #1068F8;
  box-shadow: 0 0 10px #1068F8;
}
.hero-next-content h2 {
  margin: 0;
  color: #f5f7ff;
  font-size: clamp(38px, 4.2vw, 62px);
  line-height: 1.08;
  letter-spacing: -2.7px;
}
.hero-next-content h2 span {
  background: linear-gradient(100deg, #FFFFFF 0%, #1068F8 48%, #003998 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-next-content p {
  margin: 20px auto 0;
  color: #8f9ab0;
  font-size: 14px;
  line-height: 1.75;
}
.hero-next-actions {
  margin-top: 29px;
  display: flex;
  justify-content: center;
  gap: 14px;
}
.hero-next-primary,
.hero-next-secondary {
  min-width: 184px;
  height: 52px;
  padding: 0 23px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.hero-next-primary {
  color: var(--primary-button-color);
  border: 1px solid var(--primary-button-border);
  background: var(--primary-button-bg);
  box-shadow: var(--primary-button-shadow);
}
.hero-next-primary svg {
  width: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hero-next-secondary {
  border: 1px solid rgba(126, 174, 255, 0.4);
  color: #b8c9ed;
  background: rgba(7, 13, 31, 0.45);
}
.hero-next-secondary span {
  color: #1068F8;
  font-size: 18px;
  transition: transform 0.25s ease;
}
.hero-next-primary:hover,
.hero-next-secondary:hover {
  transform: translateY(-3px);
}
.hero-next-primary:hover {
  box-shadow: 0 18px 42px rgba(73, 133, 255, 0.34);
}
.hero-next-secondary:hover {
  border-color: rgba(141, 187, 255, 0.75);
  box-shadow: 0 10px 28px rgba(73, 133, 255, 0.12);
}
.hero-next-secondary:hover span {
  transform: translateX(4px);
}
.hero-next-secondary.secondary-action { position:relative; z-index:0; width:155px; height:44px; padding:0 38px; display:inline-flex; align-items:center; justify-content:center; gap:4px; flex-shrink:0; overflow:hidden; border:2px solid transparent; border-radius:999px; color:#fff; background:transparent; font-size:11px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; white-space:nowrap; text-decoration:none; box-shadow:0 0 0 1px #1068F8,0 0 18px rgba(126,174,255,.16); transition:color .6s cubic-bezier(.23,1,.32,1),border-radius .6s cubic-bezier(.23,1,.32,1),box-shadow .6s cubic-bezier(.23,1,.32,1),transform .25s ease; }
.hero-next-secondary.secondary-action::after { display:none; }
.solutions-arrow { position:absolute; z-index:3; width:18px; height:18px; fill:currentColor; transition:left .8s cubic-bezier(.23,1,.32,1),right .8s cubic-bezier(.23,1,.32,1),fill .8s cubic-bezier(.23,1,.32,1); }.solutions-arr-1 { right:14px; }.solutions-arr-2 { left:-30px; }
.solutions-text { position:relative; z-index:2; color:inherit !important; font-size:inherit !important; transform:translateX(-8px); transition:transform .8s cubic-bezier(.23,1,.32,1),color .8s cubic-bezier(.23,1,.32,1); }
.solutions-circle { position:absolute; top:50%; left:50%; width:20px; height:20px; z-index:1; border-radius:50%; background:linear-gradient(135deg,#1068F8,#0860F0); opacity:0; transform:translate(-50%,-50%); transition:width .8s cubic-bezier(.23,1,.32,1),height .8s cubic-bezier(.23,1,.32,1),opacity .4s ease; }
.hero-next-secondary.secondary-action:hover { color:#001038; border-radius:12px; border-color:transparent; box-shadow:0 0 0 10px transparent,0 0 25px rgba(126,174,255,.25); }.hero-next-secondary.secondary-action:hover .solutions-arr-1 { right:-30px; }.hero-next-secondary.secondary-action:hover .solutions-arr-2 { left:14px; }.hero-next-secondary.secondary-action:hover .solutions-text { color:#001038 !important; transform:translateX(10px); }.hero-next-secondary.secondary-action:hover .solutions-circle { width:260px; height:260px; opacity:1; transform:translate(-50%,-50%) !important; }
@media (prefers-reduced-motion: reduce) { .hero-next-secondary,.solutions-arrow,.solutions-text,.solutions-circle { transition:none; } }
@media (max-width: 620px) { .hero-next-secondary.secondary-action { width:min(100%,260px); } }
@media (max-width: 620px) {
  .hero-next-cta {
    min-height: 0;
  }
  .hero-next-content {
    padding-top: 55px;
    padding-bottom: 55px;
  }
  .hero-next-content h2 {
    font-size: 36px;
    letter-spacing: -1.8px;
  }
  .hero-next-content p br {
    display: none;
  }
  .hero-next-actions {
    align-items: center;
    flex-direction: column;
  }
  .hero-next-primary,
  .hero-next-secondary {
    width: min(100%, 260px);
  }
}

.section {
  padding: 112px 0;
}
/* ==========================================================
   7. SECCIÓN NOSOTROS
   ========================================================== */
.about {
  position: relative;
  padding: 110px 0 105px;
  overflow: hidden;
  background:
    linear-gradient(rgba(105, 175, 229, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(105, 175, 229, 0.045) 1px, transparent 1px),
    radial-gradient(ellipse 42% 250px at 0% 0%, rgba(73, 133, 255, 0.25), transparent 72%),
    radial-gradient(ellipse 42% 250px at 100% 0%, rgba(73, 133, 255, 0.25), transparent 72%),
    radial-gradient(ellipse 34% 220px at 0% 100%, rgba(44, 91, 205, 0.15), transparent 74%),
    radial-gradient(ellipse 34% 220px at 100% 100%, rgba(44, 91, 205, 0.15), transparent 74%),
    #03070d;
  background-size: 38px 38px, 38px 38px, auto, auto, auto, auto;
  background-attachment: fixed, fixed, scroll, scroll, scroll, scroll;
}
.about::before {
  content: "";
  position: absolute;
  top: 25px;
  left: 5%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #1068F8;
  box-shadow:
    150px 110px 0 rgba(141, 187, 255, 0.35),
    370px 420px 0 rgba(126, 174, 255, 0.28),
    650px 185px 0 rgba(141, 187, 255, 0.42),
    890px 560px 0 rgba(126, 174, 255, 0.3),
    1120px 90px 0 rgba(141, 187, 255, 0.32),
    1320px 390px 0 rgba(126, 174, 255, 0.36);
  opacity: 0.7;
  pointer-events: none;
}
.about::after { content:""; position:absolute; z-index:0; top:auto; bottom:-135px; left:50%; width:min(920px,82vw); height:270px; border-radius:50%; background:radial-gradient(ellipse at 50% 100%,rgba(84,150,255,.24),rgba(44,91,205,.1) 48%,transparent 74%); filter:blur(22px); opacity:.82; pointer-events:none; transform:translateX(-50%); animation:none; }
.about-corner-glow {
  position: absolute;
  z-index: 0;
  top: -165px;
  width: min(42vw, 580px);
  height: 310px;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 0%, rgba(84, 150, 255, .3) 0%, rgba(51, 105, 221, .13) 46%, transparent 74%);
  filter: blur(28px);
  opacity: .58;
  pointer-events: none;
}
.about-corner-glow--left { left: -180px; }
.about-corner-glow--right { right: -180px; }
@keyframes about-cloud-drift { from { transform:translateX(-48%) scale(1.04); } to { transform:translateX(-52%) scale(.97); } }
@media (prefers-reduced-motion: reduce) { .about::after { animation:none; } }
.about-shell {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(420px, 1fr) minmax(0, 1fr);
  gap: 80px;
  align-items: center;
}
.about-copy {
  position: relative;
  z-index: 2;
  grid-column: 2;
  grid-row: 1;
  background: transparent !important;
  box-shadow: none;
}
.about-kicker {
  width: max-content;
  min-height: 29px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(126, 174, 255, 0.35);
  border-radius: 999px;
  color: #a8c6ff;
  background: rgba(60, 100, 174, 0.09);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
}
.about-kicker i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #1068F8;
  box-shadow: 0 0 10px #1068F8;
}
.about-copy h2 {
  margin: 24px 0 0;
  color: #f4f7ff;
  font-size: clamp(44px, 4.5vw, 68px);
  font-weight: bold;
  line-height: .98;
  letter-spacing: -4.2px;
  text-transform: none;
}
.about-copy h2 span {
  display: block;
  background: linear-gradient(100deg, #86b5ff, #7d8eff);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.about-rule {
  width: 100%;
  height: 1px;
  margin: 28px 0 24px;
  background: linear-gradient(90deg, #6f9dff, rgba(126, 142, 255, 0.65), transparent);
}
.about-copy > p {
  max-width: 650px;
  margin: 0 0 17px;
  color: #8e98aa;
  font-size: 13px;
  line-height: 1.85;
}
.about-copy > p strong {
  color: #e7edfa;
  font-weight: 500;
  text-decoration: none;
}
.about-copy > p {
  position: relative;
  max-width: 690px;
  margin-bottom: 15px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #bac6d8;
  background: none;
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.75;
}
.about-copy > p::before {
  content: none;
}
.about-copy .about-emphasis {
  color: #edf5ff;
  font-weight: 500;
  text-decoration: none;
  text-shadow: none;
}
.about-highlight {
  margin-top: 23px;
  padding: 17px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(126, 174, 255, 0.18);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(73, 133, 255, 0.08), rgba(73, 133, 255, 0.015));
  color: #aab4c5;
  font-size: 11px;
  line-height: 1.65;
}
.about-highlight-icon,
.about-value-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(141, 187, 255, 0.25);
  color: #1068F8;
  background: rgba(73, 133, 255, 0.09);
}
.about-highlight-icon {
  width: 37px;
  height: 37px;
  border-radius: 10px;
}
.about-highlight-icon svg,
.about-value-icon svg {
  width: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.about-tags {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
}
.about-tags span {
  position: relative;
  width: 132px;
  min-height: 88px;
  padding: 10px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 9px;
  overflow: hidden;
  border: 1px solid rgba(141, 187, 255, 0.52);
  border-radius: 11px;
  color: #c1ccdf;
  background: transparent;
  box-shadow: none;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  transition: transform 0.3s ease, border-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}
.about-tags span::after {
  content: none;
}
.about-tags i {
  width: 40px;
  height: 40px;
  display: block;
  color: #1068F8;
  font-style: normal;
}
.about-tags svg {
  width: 40px;
  height: 40px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.about-tags span:hover {
  transform: translateY(-4px);
  border-color: rgba(177, 213, 255, 0.95);
  color: #ffffff;
  background: radial-gradient(circle at 50% 110%, rgba(73, 133, 255, 0.36), rgba(12, 27, 52, 0.34) 54%, transparent 78%);
  box-shadow: 0 13px 28px rgba(0, 0, 0, 0.28), 0 0 24px rgba(73, 133, 255, 0.28), inset 0 1px rgba(217, 232, 255, 0.1);
}
.about-tags span:hover i {
  color: #d9e8ff;
}
.about-button {
  width: max-content;
  height: 46px;
  margin-top: 27px;
  padding: 0 21px;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  border-radius: 9px;
  color: var(--primary-button-color);
  border: 1px solid var(--primary-button-border);
  background: var(--primary-button-bg);
  box-shadow: var(--primary-button-shadow);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.about-button:hover {
  transform: translateY(-3px);
  box-shadow: 0 17px 36px rgba(73, 133, 255, 0.32);
}
.about-button b {
  font-size: 17px;
}
.about-visual {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  min-height: 570px;
}
.about-visual::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 24% 18%, rgba(100, 168, 255, 0.14), transparent 34%),
    linear-gradient(135deg, rgba(4, 9, 25, 0.04) 12%, rgba(4, 9, 25, 0.3) 62%, rgba(4, 9, 25, 0.1) 100%);
}
.about-orbit {
  position: absolute;
  top: 5px;
  left: 10%;
  width: 260px;
  height: 145px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 60%, rgba(105, 114, 255, 0.48), rgba(69, 57, 190, 0.12) 55%, transparent 72%);
  filter: blur(2px);
}
.about-image-main,
.about-image-secondary,
.about-image-tertiary {
  position: absolute;
  object-fit: cover;
  border: 1px solid rgba(141, 187, 255, 0.2);
  box-shadow: 0 24px 65px rgba(0, 0, 0, 0.45);
  /* Oscurecimiento suave; el degradado del conjunto aporta profundidad. */
  filter: brightness(0.7) contrast(1.06) saturate(0.96);
  transform: scale(1);
  cursor: pointer;
  transition:
    filter 0.55s ease,
    transform 0.65s cubic-bezier(0.23, 1, 0.32, 1),
    border-color 0.4s ease,
    box-shadow 0.4s ease;
}
.about-image-main:hover,
.about-image-secondary:hover,
.about-image-tertiary:hover {
  z-index: 3;
  filter: brightness(1.04) contrast(1.1) saturate(1.16);
  transform: scale(1.055);
  border-color: rgba(141, 187, 255, 0.52);
  box-shadow:
    0 28px 75px rgba(0, 0, 0, 0.52),
    0 0 28px rgba(73, 133, 255, 0.12);
}
.about-image-tertiary {
  top: 4px;
  left: 10%;
  width: 43%;
  height: 150px;
  border-radius: 50%;
}
.about-image-main {
  top: 105px;
  right: 0;
  width: 82%;
  height: 330px;
  border-radius: 20px;
}
.about-image-secondary {
  right: 3%;
  bottom: 5px;
  width: 48%;
  height: 175px;
  border-radius: 50%;
}
.about-visual-card {
  position: absolute;
  z-index: 2;
  isolation: isolate;
  left: 0;
  bottom: 65px;
  width: 180px;
  min-height: 126px;
  padding: 22px;
  border: 0;
  border-radius: 16px;
  background: transparent;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.3);
}
.about-visual-card::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border: 0;
  border-radius: inherit;
  background: #1068F8;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.46);
}
.about-visual-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 4px -10px -10px 10px;
  border: 1px solid rgba(255, 255, 255, 0.92);
  border-radius: 16px;
  background: transparent;
  box-shadow: 10px 13px 25px rgba(5, 20, 57, 0.28), 0 0 16px rgba(73, 133, 255, 0.13);
  transform: translate(2px, 2px);
}
.about-visual-card strong {
  position: relative;
  z-index: 1;
  display: block;
  color: #fff;
  font-size: 30px;
  letter-spacing: -1px;
}
.about-visual-card strong span {
  color: #fff;
}
.about-visual-card small {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 10px;
  line-height: 1.55;
}
.about-values {
  grid-column: 1 / -1;
  margin-top: 36px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.about-values-head {
  grid-column: 1 / -1;
  margin-bottom: 20px;
  text-align: center;
}
.about-values-head .about-kicker {
  margin: 0 auto 18px;
}
.about-values-head h3 {
  margin: 0;
  color: #edf3ff;
  font-size: clamp(29px, 3vw, 42px);
  line-height: 1.12;
  letter-spacing: -1.8px;
}
.about-values-head p {
  max-width: 720px;
  margin: 13px auto 0;
  color: #8793a7;
  font-size: 13px;
  line-height: 1.75;
}
.about-value-card {
  position: relative;
  min-height: 280px;
  padding: 34px 30px 30px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow: hidden;
  border: 1px solid rgba(141, 187, 255, 0.13);
  border-radius: 16px;
  background: transparent;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18);
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.about-value-card:nth-of-type(1) {
  --value-card-image: url("assets/images/about/about-digital-v2.webp");
}
.about-value-card:nth-of-type(2) {
  --value-card-image: url("assets/images/hero/hero-networks-v2.webp");
}
.about-value-card:nth-of-type(3) {
  --value-card-image: url("assets/images/about/about-developer-v2.webp");
}
.about-value-card > * {
  position: relative;
  z-index: 2;
}
.about-value-card::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1.5px;
  border-radius: inherit;
  background: linear-gradient(-45deg, #8b5cff 0%, #40c9ff 48%, #1068F8 100%);
  background-size: 220% 220%;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0.7;
  z-index: 3;
  pointer-events: none;
  transition:
    transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275),
    opacity 0.4s ease,
    background-position 0.6s ease,
    filter 0.4s ease;
}
.about-value-card::after {
  content: none;
}
.about-value-card:hover {
  transform: translateY(-8px) scale(1.012);
  border-color: transparent;
  box-shadow:
    0 28px 70px rgba(0, 0, 0, 0.36),
    -8px 6px 28px rgba(139, 92, 255, 0.16),
    8px -4px 30px rgba(64, 201, 255, 0.14);
}
.about-value-card:hover::before {
  transform: scale(1.018) rotate(-0.7deg);
  background-position: 100% 50%;
  opacity: 1;
  filter: drop-shadow(0 0 9px rgba(64, 201, 255, 0.45));
}
.about-value-card .about-value-icon {
  position: absolute;
  z-index: 1;
  top: 20px;
  right: 22px;
  width: 98px;
  height: 98px;
  border: 0;
  border-radius: 0;
  color: #1068F8;
  background: transparent;
  opacity: 0.12;
  transform: rotate(-7deg);
  transition: opacity 0.4s ease, transform 0.55s cubic-bezier(0.23, 1, 0.32, 1);
}
.about-value-card .about-value-icon svg {
  width: 76px;
  height: 76px;
  stroke-width: 1.15;
}
.about-value-card:hover .about-value-icon {
  opacity: 0.24;
  transform: rotate(0deg) scale(1.08);
}
.about-value-card > div:last-child {
  position: relative;
  z-index: 2;
  padding-right: 50px;
}
.about-value-card > div:last-child > span {
  display: block;
  width: max-content;
  padding-bottom: 8px;
  border-bottom: 2px solid #1068F8;
  color: #a9c8ff;
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 2.2px;
}
.about-value-card h3 {
  max-width: 310px;
  margin: 18px 0 12px;
  color: #e8edf7;
  font-size: 17px;
  line-height: 1.3;
  letter-spacing: -0.25px;
}
.about-value-card p {
  max-width: 340px;
  margin: 0;
  color: #939fb2;
  font-size: 12.5px;
  line-height: 1.8;
}
.about-value-card ul {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  list-style: none;
  color: #939fb2;
  font-size: 12.5px;
  line-height: 1.55;
}
.about-value-card li {
  position: relative;
  padding-left: 16px;
}
.about-value-card li::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #1068F8;
  box-shadow: 0 0 8px rgba(141, 187, 255, 0.6);
}
@media (max-width: 980px) {
  .about-shell {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .about-copy {
    grid-column: 1;
    grid-row: 2;
  }
  .about-visual {
    grid-column: 1;
    grid-row: 1;
    width: min(100%, 680px);
    margin: 0 auto;
  }
  .about-values {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 650px) {
  .about {
    padding: 78px 0 75px;
  }
  .about-copy h2 {
    font-size: 42px;
    letter-spacing: -2.5px;
  }
  .about-visual {
    min-height: 440px;
  }
  .about-image-main {
    width: 94%;
    height: 260px;
  }
  .about-image-tertiary {
    left: 5%;
    width: 48%;
    height: 115px;
  }
  .about-image-secondary {
    width: 55%;
    height: 135px;
  }
  .about-visual-card {
    width: 150px;
    min-height: 110px;
    padding: 17px;
  }
  .about-values {
    grid-template-columns: 1fr;
  }
  .about-value-card {
    min-height: 260px;
    padding: 27px 22px;
  }
  .about-value-card .about-value-icon {
    top: 15px;
    right: 12px;
    width: 78px;
    height: 78px;
  }
  .about-value-card .about-value-icon svg {
    width: 60px;
    height: 60px;
  }
  .about-value-card > div:last-child {
    padding-right: 28px;
  }
}

/* Proceso de trabajo */
.workflow {
  position: relative;
  overflow: hidden;
  padding: 112px 0 120px;
  color: #eaf1ff;
  background:
    linear-gradient(rgba(105, 175, 229, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(105, 175, 229, 0.045) 1px, transparent 1px),
    radial-gradient(ellipse 54% 340px at 50% 0%, rgba(73, 133, 255, 0.2), transparent 72%),
    radial-gradient(circle at 82% 60%, rgba(126, 92, 255, 0.08), transparent 26%),
    #03070d;
  background-size: 38px 38px, 38px 38px, auto, auto, auto;
  background-attachment: fixed, fixed, scroll, scroll, scroll;
}
.workflow::before {
  content: "";
  position: absolute;
  top: -205px;
  left: 50%;
  width: 700px;
  height: 380px;
  border-radius: 50%;
  background: rgba(67, 127, 255, 0.11);
  filter: blur(110px);
  transform: translateX(-50%);
  pointer-events: none;
}
.workflow-container { position: relative; z-index: 1; }
.workflow-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 75px;
  align-items: end;
  margin-bottom: 72px;
}
.workflow-heading h2 {
  max-width: 850px;
  margin: 24px 0 0;
  font-size: clamp(44px, 4.5vw, 68px);
  line-height: 1.03;
  letter-spacing: -3.5px;
  text-transform: uppercase;
}
.workflow-heading h2 span {
  color: transparent;
  background: linear-gradient(100deg, #86b5ff, #7d8eff 62%, #aa70ff);
  -webkit-background-clip: text;
  background-clip: text;
}
.workflow-heading > p {
  margin: 0 0 7px;
  padding-left: 25px;
  border-left: 2px solid #608eff;
  color: #8f9cb0;
  font-size: 13px;
  line-height: 1.8;
}
.workflow-layout {
  display: grid;
  grid-template-columns: minmax(340px, 0.88fr) minmax(520px, 1.12fr);
  gap: 78px;
  align-items: start;
}
.workflow-featured,
.workflow-mini-grid figure {
  position: relative;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(124, 169, 240, 0.25);
  background: #07101d;
}
.workflow-featured {
  height: 390px;
  border-radius: 17px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35), 0 0 32px rgba(73, 133, 255, 0.08);
}
.workflow-featured::after,
.workflow-mini-grid figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(3, 8, 15, 0.08) 25%, rgba(3, 8, 15, 0.95));
  pointer-events: none;
}
.workflow-featured img,
.workflow-mini-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.7) saturate(0.78);
  transition: transform 0.7s cubic-bezier(.2,.8,.2,1), filter 0.5s ease;
}
.workflow-featured:hover img,
.workflow-mini-grid figure:hover img { transform: scale(1.065); filter: brightness(0.94) saturate(1); }
.workflow-featured figcaption {
  position: absolute;
  z-index: 2;
  left: 25px;
  right: 25px;
  bottom: 24px;
}
.workflow-featured figcaption small { display: block; margin-bottom: 7px; color: #82a9ff; font-size: 9px; font-weight: 800; letter-spacing: 1.7px; }
.workflow-featured figcaption strong { display: block; max-width: 340px; font-size: 20px; line-height: 1.15; text-transform: uppercase; }
.workflow-status {
  position: absolute;
  z-index: 2;
  top: 18px;
  left: 18px;
  padding: 9px 13px;
  border: 1px solid rgba(78, 255, 176, 0.3);
  border-radius: 999px;
  color: #aaffd3;
  background: rgba(4, 22, 18, 0.82);
  backdrop-filter: blur(10px);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.8px;
}
.workflow-status i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: #49ffa4; box-shadow: 0 0 10px #49ffa4; animation: workflow-pulse 1.8s infinite; }
@keyframes workflow-pulse { 50% { opacity: .4; transform: scale(.75); } }
.workflow-mini-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.workflow-mini-grid figure { height: 145px; border-radius: 13px; }
.workflow-mini-grid figcaption { position: absolute; z-index: 2; left: 15px; right: 15px; bottom: 13px; font-size: 11px; font-weight: 700; }
.workflow-mini-grid figcaption span { margin-right: 6px; color: #7fa9ff; }
.workflow-note { display: flex; gap: 14px; margin-top: 14px; padding: 17px 18px; border: 1px solid rgba(117, 154, 220, 0.2); border-radius: 13px; background: rgba(10, 19, 35, 0.62); }
.workflow-note > span { color: #778cff; }
.workflow-note p { margin: 0; color: #79869a; font-size: 10px; line-height: 1.55; }
.workflow-note strong { display: block; margin-bottom: 3px; color: #dfe9fa; font-size: 11px; }
.workflow-steps { position: relative; }
.workflow-steps { display: grid; gap: 12px; }
.workflow-steps::before { content: none; }
.workflow-step {
  position: relative;
  display: grid;
  grid-template-columns: 58px 1fr 38px;
  gap: 25px;
  min-height: 150px;
  padding: 24px;
  overflow: hidden;
  border: 1px solid rgba(126, 174, 255, 0.15);
  border-radius: 15px;
  background: linear-gradient(120deg, rgba(29, 53, 91, 0.2), rgba(5, 11, 20, 0.46));
  backdrop-filter: blur(8px);
  transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.workflow-step::after {
  content: "";
  position: absolute;
  right: -55px;
  bottom: -75px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: rgba(73, 133, 255, 0.11);
  filter: blur(38px);
  pointer-events: none;
}
.workflow-step:hover {
  z-index: 2;
  transform: translateX(8px);
  border-color: rgba(141, 187, 255, 0.42);
  box-shadow: -12px 18px 45px rgba(0, 0, 0, 0.28), 0 0 25px rgba(84, 129, 255, 0.1);
}
.workflow-step + .workflow-step { padding-top: 24px; border-top-color: rgba(126, 174, 255, 0.15); }
.workflow-number { position: relative; z-index: 2; width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(103, 143, 255, 0.46); border-radius: 11px; color: #81a2ff; background: rgba(9, 19, 38, 0.82); font-size: 13px; font-weight: 800; box-shadow: inset 0 0 22px rgba(73, 133, 255, 0.08); transition: .3s ease; }
.workflow-step:hover .workflow-number { color: #fff; border-color: #9c65ff; background: linear-gradient(135deg, #477cff, #8b4eff); transform: rotate(-4deg) scale(1.06); box-shadow: 0 8px 30px rgba(92, 101, 255, 0.28); }
.workflow-step-copy { position: relative; z-index: 2; }
.workflow-step-copy small { color: #91b5ff; font-size: 8px; font-weight: 800; letter-spacing: 1.5px; }
.workflow-step-copy h3 { margin: 6px 0 11px; color: #e7edf8; font-size: 20px; line-height: 1.15; text-transform: uppercase; }
.workflow-step-copy p { max-width: 650px; margin: 0; color: #8e98aa; font-size: 12px; line-height: 1.75; }
.workflow-step-copy > div { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.workflow-step-copy > div span { padding: 6px 9px; border: 1px solid rgba(123, 154, 210, 0.18); border-radius: 5px; color: #77859b; background: rgba(15, 26, 44, 0.45); font-size: 8px; }
.workflow-step-icon { position: relative; z-index: 2; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(121, 156, 217, 0.22); border-radius: 9px; color: #1068F8; background: rgba(15, 26, 43, 0.65); font-size: 13px; box-shadow: inset 0 0 18px rgba(73, 133, 255, 0.08); }
@media (max-width: 980px) {
  .workflow-heading { grid-template-columns: 1fr; gap: 28px; }
  .workflow-heading > p { max-width: 600px; }
  .workflow-layout { grid-template-columns: 1fr; gap: 65px; }
  .workflow-showcase { max-width: 680px; }
}
@media (max-width: 650px) {
  .workflow { padding: 82px 0 88px; }
  .workflow-heading { margin-bottom: 48px; }
  .workflow-heading h2 { font-size: 40px; letter-spacing: -2px; }
  .workflow-heading > p { padding-left: 17px; }
  .workflow-featured { height: 310px; }
  .workflow-mini-grid { grid-template-columns: 1fr; }
  .workflow-mini-grid figure { height: 160px; }
  .workflow-step { grid-template-columns: 48px 1fr; gap: 17px; }
  .workflow-number { width: 48px; height: 48px; }
  .workflow-steps::before { left: 23px; }
  .workflow-step-icon { display: none; }
  .workflow-step-copy h3 { font-size: 17px; }
}

/* Ajuste editorial del proceso: menos tarjetas, más continuidad visual */
.workflow {
  padding: 128px 0 136px;
  background:
    radial-gradient(circle at 30% 18%, rgba(76, 125, 218, .1), transparent 28%),
    linear-gradient(180deg, #050a12 0%, #03070d 42%, #04070c 100%);
}
.workflow::before {
  inset: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  border-top: 1px solid rgba(255, 255, 255, .045);
  background: linear-gradient(90deg, transparent, rgba(124, 167, 241, .035) 50%, transparent);
  filter: none;
  transform: none;
  opacity: .55;
}
.workflow-heading {
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: clamp(50px, 8vw, 120px);
  margin-bottom: 88px;
}
.workflow-heading h2 {
  max-width: 800px;
  margin-top: 22px;
  font-size: clamp(43px, 4.25vw, 66px);
  line-height: 1.02;
  letter-spacing: -3.2px;
}
.workflow-heading h2 span {
  background-image: linear-gradient(100deg, #8cb7ff, #8b93ff 60%, #a179ef);
}
.workflow-heading > p {
  max-width: 410px;
  margin-bottom: 4px;
  padding-left: 22px;
  border-left: 1px solid rgba(116, 158, 238, .72);
  color: #98a2b2;
  line-height: 1.85;
}
.workflow-layout {
  grid-template-columns: minmax(360px, .9fr) minmax(500px, 1.1fr);
  gap: clamp(64px, 9vw, 132px);
}
.workflow-showcase {
  position: sticky;
  top: 150px;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(150px, .82fr);
  grid-template-rows: minmax(0, 1fr);
  gap: 3px;
  height: 718px;
}
.workflow-featured,
.workflow-mini-grid figure {
  border: 0;
  background: #080d14;
}
.workflow-featured {
  grid-row: 1;
  height: 100%;
  border: 1px solid rgba(155, 178, 215, .14);
  border-radius: 5px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .28);
}
.workflow-featured::after,
.workflow-mini-grid figure::after {
  background: linear-gradient(180deg, rgba(3, 8, 15, .06) 34%, rgba(3, 8, 15, .92));
}
.workflow-featured img,
.workflow-mini-grid img {
  filter: brightness(.62) saturate(.68);
}
.workflow-featured:hover img,
.workflow-mini-grid figure:hover img {
  transform: scale(1.025);
  filter: brightness(.78) saturate(.8);
}
.workflow-featured figcaption {
  left: 28px;
  right: 28px;
  bottom: 28px;
}
.workflow-featured figcaption small {
  margin-bottom: 9px;
  color: #8fb3f2;
  font-weight: 700;
}
.workflow-featured figcaption strong {
  max-width: 360px;
  color: #edf2fb;
  font-weight: 650;
  line-height: 1.25;
}
.workflow-status {
  top: 21px;
  left: 22px;
  padding: 0;
  border: 0;
  color: rgba(218, 231, 250, .72);
  background: transparent;
  backdrop-filter: none;
  font-weight: 700;
  letter-spacing: 1.15px;
}
.workflow-status i {
  width: 5px;
  height: 5px;
  margin: 0 8px 1px 0;
  background: #75dca9;
  box-shadow: none;
  animation: none;
}
.workflow-mini-grid {
  grid-column: 2;
  grid-row: 1;
  gap: 1px;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 1fr;
  margin-top: 0;
  background: rgba(154, 180, 220, .12);
}
.workflow-mini-grid figure {
  height: auto;
  border-radius: 0;
}
.workflow-mini-grid figcaption {
  left: 0;
  right: auto;
  bottom: 0;
  width: max-content;
  max-width: calc(100% - 32px);
  display: inline-grid;
  grid-template-columns: 28px 1fr;
  gap: 11px;
  align-items: center;
  padding: 18px 28px 18px 18px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: rgba(231, 238, 248, .86);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.workflow-mini-grid figcaption::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: -28px;
  bottom: -30px;
  width: calc(100% + 70px);
  height: calc(100% + 60px);
  border-radius: 45%;
  background:
    radial-gradient(ellipse at 38% 58%, rgba(5, 11, 20, .94) 0%, rgba(7, 15, 27, .72) 45%, transparent 74%);
  filter: blur(15px);
  pointer-events: none;
}
.workflow-mini-grid figcaption > * {
  position: relative;
  z-index: 1;
}
.workflow-mini-grid figure::after {
  background:
    linear-gradient(180deg, transparent 35%, rgba(3, 8, 15, .28) 58%, rgba(3, 8, 15, .96) 100%),
    linear-gradient(90deg, rgba(3, 8, 15, .22), transparent 60%);
}
.workflow-mini-grid figcaption .workflow-mini-icon {
  width: 34px;
  height: 34px;
  margin-right: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 0;
  color: #9bc1ff;
  background: transparent;
  backdrop-filter: none;
}
.workflow-mini-icon svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.workflow-mini-grid figcaption .workflow-mini-copy {
  display: block;
  min-width: 0;
  margin-right: 0;
  color: inherit;
}
.workflow-mini-copy small {
  display: block;
  margin-bottom: 5px;
  color: #7f9fda;
  font-size: 7px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 1.15px;
}
.workflow-mini-copy strong {
  display: block;
  color: #f5f7fb;
  background: none;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -.1px;
}
.workflow-note {
  grid-column: 1 / -1;
  grid-row: 2;
  align-items: flex-start;
  gap: 12px;
  margin-top: 24px;
  padding: 0 2px;
  border: 0;
  background: transparent;
}
.workflow-note > span {
  margin-top: 1px;
  color: #829fe7;
  font-size: 11px;
}
.workflow-note p {
  max-width: 390px;
  color: #747f90;
  line-height: 1.6;
}
.workflow-note strong {
  margin-bottom: 4px;
  color: #cad4e3;
  font-weight: 600;
}
.workflow-steps {
  display: grid;
  gap: 0;
}
.workflow-step {
  isolation: isolate;
  grid-template-columns: 82px 1fr 28px;
  gap: 24px;
  min-height: 156px;
  padding: 25px 24px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
  transition: none;
}
.workflow-step::before {
  content: none;
  display: none;
}
.workflow-step::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: 0;
  background: linear-gradient(90deg, rgba(6, 12, 21, .62), rgba(7, 14, 25, .34) 65%, transparent);
  box-shadow: none;
  backdrop-filter: blur(12px);
  pointer-events: none;
}
.workflow-step:nth-child(even)::before {
  background: #7657d7;
  animation-delay: -5s;
}
.workflow-step:nth-child(3)::before {
  background: #397fc0;
  animation-delay: -8s;
}
@keyframes workflow-blob {
  0%, 100% { transform: translate(-115%, -105%); }
  25% { transform: translate(20%, -105%); }
  50% { transform: translate(20%, 5%); }
  75% { transform: translate(-115%, 5%); }
}
.workflow-step + .workflow-step {
  padding-top: 25px;
  border-top: 0;
}
.workflow-step:hover {
  transform: none;
  border-color: transparent;
  box-shadow: none;
}
.workflow-number {
  width: auto;
  height: auto;
  display: block;
  padding-top: 0;
  border: 0;
  border-radius: 0;
  color: transparent;
  background: linear-gradient(145deg, #b5ceff 5%, #7599e6 55%, #7d67d7);
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 42px;
  font-weight: 300;
  line-height: .9;
  letter-spacing: -2px;
  box-shadow: none;
  opacity: .78;
  transform-origin: left center;
  animation: workflow-number-breathe 5.5s ease-in-out infinite;
}
.workflow-number::after {
  content: "";
  position: absolute;
  top: 50px;
  left: 0;
  width: 28px;
  height: 1px;
  background: rgba(118, 154, 225, .42);
  transform-origin: left;
  animation: workflow-number-line 5.5s ease-in-out infinite;
}
.workflow-step:nth-child(2) .workflow-number,
.workflow-step:nth-child(2) .workflow-number::after { animation-delay: -1.35s; }
.workflow-step:nth-child(3) .workflow-number,
.workflow-step:nth-child(3) .workflow-number::after { animation-delay: -2.7s; }
.workflow-step:nth-child(4) .workflow-number,
.workflow-step:nth-child(4) .workflow-number::after { animation-delay: -4.05s; }
@keyframes workflow-number-breathe {
  0%, 100% { opacity: .58; transform: translateY(0) scale(1); }
  50% { opacity: 1; transform: translateY(-3px) scale(1.035); }
}
@keyframes workflow-number-line {
  0%, 100% { opacity: .45; transform: scaleX(.7); }
  50% { opacity: 1; transform: scaleX(1.35); }
}
.workflow-step:hover .workflow-number {
  color: transparent;
  border-color: transparent;
  background: linear-gradient(145deg, #c5d8ff 5%, #83a6f0 55%, #8872df);
  -webkit-background-clip: text;
  background-clip: text;
  transform: none;
  box-shadow: none;
}
.workflow-step:hover .workflow-number::after {
  width: 36px;
  background: #8caaf1;
}
.workflow-step-copy small {
  color: #7f9edb;
  font-weight: 700;
  letter-spacing: 1.65px;
}
.workflow-step-copy h3 {
  margin: 7px 0 12px;
  color: #e6ebf3;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.35px;
}
.workflow-step-copy p {
  max-width: 610px;
  color: #8c96a6;
}
.workflow-step-copy > div {
  gap: 16px;
  margin-top: 13px;
}
.workflow-step-copy > div span {
  position: relative;
  padding: 0 0 0 10px;
  border: 0;
  border-radius: 0;
  color: #6f7b8d;
  background: transparent;
}
.workflow-step-copy > div span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #758fca;
  transform: translateY(-50%);
}
.workflow-step-icon {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 0;
  color: #6d87bd;
  background: transparent;
  opacity: .7;
  box-shadow: none;
}
.workflow-step-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 980px) {
  .workflow-heading { grid-template-columns: 1fr; }
  .workflow-layout { grid-template-columns: 1fr; }
  .workflow-showcase {
    position: relative;
    top: auto;
    height: 610px;
  }
}
@media (max-width: 650px) {
  .workflow { padding: 82px 0 88px; }
  .workflow-heading { margin-bottom: 54px; }
  .workflow-heading h2 { font-size: 38px; }
  .workflow-showcase {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 360px 150px;
    height: auto;
  }
  .workflow-featured {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .workflow-mini-grid {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
  }
  .workflow-step {
    grid-template-columns: 58px 1fr;
    gap: 12px;
    padding: 22px 18px;
  }
  .workflow-step + .workflow-step { padding-top: 22px; }
  .workflow-number { width: auto; height: auto; }
  .workflow-number { font-size: 31px; letter-spacing: -1.5px; }
  .workflow-number::after { top: 38px; width: 22px; }
  .workflow-step-copy > div { gap: 9px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .workflow-step::before { animation: none; }
  .workflow-number,
  .workflow-number::after { animation: none; }
}

/* Sistema compartido de botones de acción */
.primary-action {
  position: relative;
  z-index: 0;
  width: max-content;
  min-width: 0;
  height: 46px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  overflow: visible;
  border: 1px solid var(--primary-button-border);
  border-radius: 999px;
  color: var(--primary-button-color);
  background: var(--primary-button-bg);
  box-shadow: var(--primary-button-shadow);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  line-height: 1;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.primary-action::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: #1068F8;
  opacity: 1;
  transition: transform 0.4s ease, opacity 0.4s ease;
}
.primary-action:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(73, 133, 255, 0.35);
}
.primary-action:hover::after {
  transform: scaleX(1.35) scaleY(1.55);
  opacity: 0;
}
.primary-action:active {
  transform: translateY(-1px);
}
.secondary-action {
  width: max-content;
  min-width: 0;
  height: 46px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid rgba(141, 187, 255, 0.48);
  border-radius: 999px;
  color: #c2cee4;
  background: rgba(7, 13, 24, 0.58);
  box-shadow: 0 0 18px rgba(73, 133, 255, 0.07);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.7px;
  line-height: 1;
  text-transform: uppercase;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.secondary-action:hover {
  transform: translateY(-3px);
  border-color: #1068F8;
  box-shadow: 0 10px 26px rgba(73, 133, 255, 0.17);
}
.kicker {
  margin-bottom: 9px;
  color: #7daeff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.9px;
}
.title {
  margin: 0;
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.04;
  letter-spacing: -2.5px;
}
/* ==========================================================
   8. SECCIÓN SERVICIOS
   ========================================================== */
.services.why-solutec {
  position: relative;
  overflow: hidden;
  padding: 124px 0 132px;
  background: radial-gradient(circle at 82% 4%, rgba(73, 102, 192, .12), transparent 34%), linear-gradient(180deg, #050a12, #060b13);
}
.why-solutec::before {
  content: "";
  position: absolute;
  inset: 0;
  border-top: 1px solid rgba(255,255,255,.045);
  background: linear-gradient(90deg, transparent, rgba(120,158,225,.025) 52%, transparent);
  pointer-events: none;
}
.why-solutec .container { position: relative; z-index: 1; }
.why-heading {
  display: grid;
  grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr);
  gap: clamp(60px,10vw,150px);
  align-items: end;
  margin-bottom: 76px;
}
.why-heading h2 {
  max-width: 780px;
  margin: 23px 0 0;
  color: #eef3fc;
  font-size: clamp(46px,5.1vw,76px);
  font-weight: 430;
  line-height: 1.02;
  letter-spacing: -4px;
}
.why-heading h2 span {
  color: transparent;
  background: linear-gradient(100deg,#f1f5fc,#91b6ff 52%,#8b76ef);
  -webkit-background-clip: text;
  background-clip: text;
  font-weight: 680;
}
.why-heading-copy { padding-bottom: 4px; }
.why-heading-copy p {
  max-width: 500px;
  margin: 0 0 26px;
  color: #9ba5b5;
  font-size: 14px;
  line-height: 1.85;
}
.why-action { gap: 12px; }
.why-action b { font-size: 16px; transition: transform .3s ease; }
.why-action:hover b { transform: translateX(4px); }
.why-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 12px;
  transition: grid-template-columns .55s cubic-bezier(.2,.8,.2,1);
}
.why-grid:has(.why-card:nth-child(1):hover) { grid-template-columns: 1.42fr .86fr .86fr .86fr; }
.why-grid:has(.why-card:nth-child(2):hover) { grid-template-columns: .86fr 1.42fr .86fr .86fr; }
.why-grid:has(.why-card:nth-child(3):hover) { grid-template-columns: .86fr .86fr 1.42fr .86fr; }
.why-grid:has(.why-card:nth-child(4):hover) { grid-template-columns: .86fr .86fr .86fr 1.42fr; }
.why-card {
  position: relative;
  isolation: isolate;
  min-height: 354px;
  padding: 32px 30px 29px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(132,160,210,.14);
  border-radius: 10px;
  background: rgba(13,22,36,.66);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
  backdrop-filter: blur(18px);
  transform: translateY(0);
  transition:
    transform .45s cubic-bezier(.2,.8,.2,1),
    border-color .4s ease,
    background .4s ease,
    box-shadow .45s ease,
    filter .45s ease,
    opacity .45s ease;
}
.why-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -90px;
  right: -70px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(74,116,220,.13);
  filter: blur(45px);
  transition: transform .6s ease;
}
.why-card:nth-child(even)::before { background: rgba(119,84,222,.13); }
.why-card::after {
  content: "";
  position: absolute;
  right: 27px;
  bottom: 27px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: linear-gradient(135deg, #87adff, #786aff);
  box-shadow: 0 0 22px rgba(103, 132, 255, .52);
  opacity: 0;
  transform: scale(.25);
  transition: opacity .35s ease .08s, transform .45s cubic-bezier(.2,1.4,.3,1) .08s;
}
.why-card:hover {
  transform: translateY(-8px);
  border-color: rgba(126, 164, 255, .66);
  background:
    linear-gradient(145deg, rgba(67, 91, 175, .18), transparent 58%),
    rgba(14, 24, 42, .88);
  box-shadow:
    0 26px 65px rgba(0, 0, 0, .32),
    0 0 46px rgba(73, 124, 235, .2),
    inset 0 1px 0 rgba(215, 228, 255, .16);
  filter: brightness(1.16);
}
.why-card:hover::before {
  transform: translate(-48px, 42px) scale(1.25);
}
.why-card:hover::after {
  opacity: 1;
  transform: scale(1);
}
.why-card-media {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  width: 52%;
  margin: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateX(34px) scale(1.05);
  transition: opacity .5s ease, transform .65s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}
.why-card-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, #0a0f18 0%, rgba(10, 15, 24, .76) 18%, transparent 64%),
    linear-gradient(180deg, rgba(3, 5, 8, .08), rgba(3, 5, 8, .64));
}
.why-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(.72) saturate(.78);
}
.why-card:hover .why-card-media {
  opacity: .88;
  transform: translateX(0) scale(1);
}
.why-card-copy,
.why-result,
.why-icon,
.why-index {
  position: relative;
  z-index: 2;
}
.why-card-copy {
  max-width: 100%;
  transition: max-width .45s ease;
}
.why-card:hover .why-card-copy,
.why-card:hover .why-result {
  max-width: 58%;
}
.why-grid:has(.why-card:hover) .why-card:not(:hover) {
  filter: blur(2.4px) brightness(.52);
  opacity: .7;
  transform: scale(.975);
}
.why-index {
  position: absolute;
  top: 22px;
  right: 24px;
  color: rgba(121,151,216,.18);
  font-size: 34px;
  font-weight: 760;
  line-height: 1;
  transition: color .4s ease, transform .45s ease;
}
.why-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  margin-bottom: 39px;
  color: #9ab8ff;
  background: rgba(72,104,194,.1);
  border: 1px solid rgba(129,158,224,.2);
  border-radius: 8px;
  transform: rotate(0) translateY(0);
  transition:
    color .35s ease,
    background .35s ease,
    border-color .35s ease,
    box-shadow .4s ease,
    transform .45s cubic-bezier(.2,.9,.25,1.25);
}
.why-icon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.why-card:hover .why-index {
  color: rgba(142, 171, 238, .42);
  transform: translateY(-2px);
}
.why-card:hover .why-icon {
  color: #d8e5ff;
  border-color: rgba(139, 171, 255, .58);
  background: linear-gradient(145deg, rgba(77, 118, 236, .82), rgba(92, 79, 213, .72));
  box-shadow: 0 13px 30px rgba(66, 91, 211, .3);
  transform: rotate(-6deg) translateY(-5px) scale(1.06);
}
.why-card:hover .why-result strong {
  filter: brightness(1.24);
}
.why-card-copy small {
  display: block;
  margin-bottom: 8px;
  color: #75839a;
  font-size: 8px;
  font-weight: 600;
  text-transform: uppercase;
}
.why-card-copy h3 {
  margin: 0 0 15px;
  color: #edf2fb;
  font-size: 17px;
  font-weight: 720;
  line-height: 1.2;
  letter-spacing: -.35px;
  text-transform: uppercase;
}
.why-card-copy p { margin: 0; color: #8e99aa; font-size: 11.5px; line-height: 1.75; }
.why-result { margin-top: auto; padding-top: 27px; display: flex; gap: 10px; align-items: baseline; }
.why-result strong {
  color: transparent;
  background: linear-gradient(110deg,#9dbbff,#8a6ef0);
  -webkit-background-clip: text;
  background-clip: text;
  font-size: 19px;
  font-weight: 730;
}
.why-result span { color: #68758a; font-size: 7px; text-transform: uppercase; }
@media (max-width: 1080px) {
  .why-grid { grid-template-columns: repeat(2,1fr); }
  .why-grid:has(.why-card:nth-child(1):hover),
  .why-grid:has(.why-card:nth-child(2):hover),
  .why-grid:has(.why-card:nth-child(3):hover),
  .why-grid:has(.why-card:nth-child(4):hover) {
    grid-template-columns: repeat(2,1fr);
  }
}
@media (max-width: 760px) {
  .services.why-solutec { padding: 88px 0 94px; }
  .why-heading { grid-template-columns: 1fr; gap: 32px; margin-bottom: 52px; }
  .why-heading h2 { font-size: 45px; letter-spacing: -2.5px; }
  .why-grid { grid-template-columns: 1fr; }
  .why-grid:has(.why-card:nth-child(1):hover),
  .why-grid:has(.why-card:nth-child(2):hover),
  .why-grid:has(.why-card:nth-child(3):hover),
  .why-grid:has(.why-card:nth-child(4):hover) {
    grid-template-columns: 1fr;
  }
  .why-card { min-height: 335px; }
}
@media (prefers-reduced-motion: reduce) {
  .why-card,
  .why-card::before,
  .why-card::after,
  .why-icon,
  .why-index { transition: none; }
}
.services {
  padding-top: 88px;
}
.services-grid {
  margin-top: 38px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.service-card {
  min-height: 210px;
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.05);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.025), transparent 55%),
    #171719;
}
.service-card:hover {
  transform: translateY(-5px);
  border-color: rgba(117, 167, 255, 0.22);
}
.icon {
  width: 36px;
  height: 36px;
  margin-bottom: 22px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(116, 167, 255, 0.14);
  background: rgba(68, 113, 182, 0.12);
  color: #8eb8ff;
}
.icon svg {
  width: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.service-card h3 {
  margin: 0 0 10px;
  font-size: 17px;
}
.service-card p {
  margin: 0;
  color: #9297a1;
  font-size: 11px;
  line-height: 1.65;
}
/* ==========================================================
   9. SECCIÓN PROYECTOS / PORTAFOLIO
   ========================================================== */
.projects {
  background: #0b0b0c;
}
.section-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
}
.project-link {
  margin-bottom: 7px;
  color: #8cb6ff;
  font-size: 11px;
  font-weight: 700;
}
.mosaic {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 132px;
  gap: 12px;
}
.project {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: #101216;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
}
.project:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.035),
    transparent 46%
  );
  pointer-events: none;
}
.project-one {
  grid-column: span 4;
  grid-row: span 2;
  padding: 20px;
  background:
    radial-gradient(
      circle at 60% 18%,
      rgba(44, 117, 178, 0.24),
      transparent 46%
    ),
    #0a0f14;
}
.project-phone {
  grid-column: span 2;
  grid-row: span 2;
  display: grid;
  place-items: center;
  background:
    radial-gradient(
      circle at 50% 60%,
      rgba(31, 83, 152, 0.24),
      transparent 50%
    ),
    #0d0d10;
}
.project-planet {
  grid-column: span 3;
  grid-row: span 2;
  background: radial-gradient(circle at 50% 50%, #142334, #080b10 68%);
}
.project-analytics {
  grid-column: span 3;
  grid-row: span 2;
  padding: 20px;
  background: linear-gradient(135deg, #0c1218, #16131c);
}
.project-wave {
  grid-column: span 3;
  grid-row: span 2;
  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(76, 105, 167, 0.25),
      transparent 50%
    ),
    #080b11;
}
.project-product {
  grid-column: span 3;
  grid-row: span 2;
  padding: 20px;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  background: #121115;
}
.project-terminal {
  grid-column: span 2;
  grid-row: span 2;
  padding: 22px;
  background:
    radial-gradient(
      circle at 60% 40%,
      rgba(9, 124, 191, 0.18),
      transparent 45%
    ),
    #050b10;
}
.project-large {
  grid-column: span 4;
  grid-row: span 3;
  padding: 16px;
  background:
    radial-gradient(
      circle at 55% 42%,
      rgba(66, 82, 165, 0.25),
      transparent 48%
    ),
    #090a12;
}
.browser-dots {
  height: 18px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding-left: 8px;
  background: #121922;
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.browser-dots i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #586777;
}
.dashboard {
  height: calc(100% - 18px);
  display: flex;
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-top: 0;
  background: #0a1017;
}
.dashboard aside {
  width: 21%;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  background: repeating-linear-gradient(
    180deg,
    #16212b 0 5px,
    transparent 5px 18px
  );
  background-size: 65% 100%;
  background-repeat: no-repeat;
  background-position: center 20px;
}
.dash-main {
  flex: 1;
  padding: 14px;
}
.dash-title {
  display: block;
  width: 42%;
  height: 5px;
  background: #31465b;
}
.metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-top: 18px;
}
.metrics i {
  height: 42px;
  background: linear-gradient(145deg, #172632, #101821);
  border: 1px solid rgba(88, 150, 204, 0.12);
}
.chart {
  position: relative;
  height: 92px;
  margin-top: 11px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.05);
  background: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.04) 0 1px,
    transparent 1px 22px
  );
}
.chart b {
  position: absolute;
  inset: 30px 12px 18px;
  background: linear-gradient(
    145deg,
    transparent 0 8%,
    rgba(65, 140, 206, 0.36) 9% 11%,
    transparent 12% 22%,
    rgba(83, 165, 227, 0.55) 23% 25%,
    transparent 26% 40%,
    rgba(80, 140, 199, 0.4) 41% 43%,
    transparent 44% 58%,
    rgba(85, 175, 230, 0.55) 59% 61%,
    transparent 62%
  );
  transform: skewY(-8deg);
}
.phone {
  width: 96px;
  height: 210px;
  padding: 13px 8px 9px;
  border: 4px solid #24262d;
  border-radius: 20px;
  background: #090b0f;
}
.notch {
  display: block;
  width: 34px;
  height: 6px;
  margin: -8px auto 12px;
  border-radius: 0 0 8px 8px;
  background: #23252c;
}
.phone-image {
  height: 80px;
  border-radius: 8px;
  background: linear-gradient(135deg, #5a5f72, #2d2445 45%, #151a27);
}
.phone span {
  display: block;
  height: 5px;
  margin-top: 13px;
  border-radius: 4px;
  background: #677080;
}
.phone .short {
  width: 65%;
}
.phone b {
  display: block;
  width: 58%;
  height: 18px;
  margin-top: 16px;
  border-radius: 5px;
  background: #5f91ed;
}
.planet {
  position: absolute;
  width: 94px;
  height: 94px;
  left: 50%;
  top: 52%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background:
    radial-gradient(
      circle at 35% 27%,
      rgba(255, 255, 255, 0.48),
      transparent 5%
    ),
    radial-gradient(circle at 42% 45%, #57748f, #1f2f42 54%, #0d151f 74%);
  box-shadow: 0 0 54px rgba(86, 140, 190, 0.22);
}
.orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(132, 177, 223, 0.28);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-20deg);
}
.o1 {
  width: 178px;
  height: 68px;
}
.o2 {
  width: 140px;
  height: 42px;
  transform: translate(-50%, -50%) rotate(30deg);
}
.analytics {
  height: 100%;
  padding: 13px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(6, 9, 13, 0.65);
}
.analytics > span {
  display: block;
  width: 44%;
  height: 7px;
  background: #647282;
}
.numbers-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-top: 14px;
}
.numbers-row i {
  height: 44px;
  border: 1px solid rgba(112, 148, 195, 0.12);
  background: #151c26;
}
.bars {
  height: 80px;
  margin-top: 12px;
  display: flex;
  align-items: end;
  gap: 7px;
  padding: 8px;
  background: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.035) 0 1px,
    transparent 1px 20px
  );
}
.bars b {
  flex: 1;
  background: linear-gradient(#5b84f3, #26385e);
}
.bars b:nth-child(1) {
  height: 32%;
}
.bars b:nth-child(2) {
  height: 56%;
}
.bars b:nth-child(3) {
  height: 81%;
}
.bars b:nth-child(4) {
  height: 44%;
}
.bars b:nth-child(5) {
  height: 69%;
}
.wave {
  position: absolute;
  left: 4%;
  top: 31%;
  width: 92%;
  height: 38%;
  border: 1px solid rgba(157, 185, 255, 0.55);
  border-radius: 50%;
  filter: drop-shadow(0 0 8px rgba(115, 164, 255, 0.28));
}
.w1 {
  transform: rotate(5deg) scaleY(0.45);
}
.w2 {
  transform: rotate(-6deg) scaleY(0.65);
}
.w3 {
  transform: rotate(12deg) scaleY(0.85);
}
.w4 {
  transform: rotate(-14deg) scaleY(1.1);
}
.w5 {
  transform: rotate(0) scaleY(1.35);
}
.product-image {
  background:
    radial-gradient(
      circle at 58% 48%,
      #b9d2ff 0 4%,
      #3d6fb8 5% 13%,
      #1c1735 14% 28%,
      transparent 29%
    ),
    linear-gradient(135deg, #171421, #0b0c11);
}
.product-copy {
  padding: 28px 15px;
  background: #090a0d;
}
.product-copy i {
  display: block;
  height: 6px;
  margin-bottom: 10px;
  background: #606572;
}
.product-copy i:nth-child(2) {
  width: 63%;
}
.product-copy b {
  display: block;
  width: 54%;
  height: 22px;
  margin-top: 24px;
  background: #4f83e7;
}
.terminal {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.terminal i {
  display: block;
  height: 5px;
  background: linear-gradient(90deg, #2f9ad0, #15475f 70%, transparent);
}
.terminal i:nth-child(2) {
  width: 72%;
}
.terminal i:nth-child(3) {
  width: 88%;
}
.terminal i:nth-child(4) {
  width: 55%;
}
.terminal i:nth-child(5) {
  width: 94%;
}
.terminal i:nth-child(6) {
  width: 65%;
}
.terminal i:nth-child(7) {
  width: 82%;
}
.project-large {
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.large-nav {
  height: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.large-content {
  height: 56%;
  display: flex;
  align-items: center;
  padding: 28px;
  gap: 28px;
}
.sphere {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: radial-gradient(
    circle at 36% 30%,
    #d5e4ff 0 5%,
    #4778bd 6% 25%,
    #1a193c 26% 62%,
    #090914 63%
  );
  box-shadow: 0 0 50px rgba(94, 91, 212, 0.24);
}
.large-copy {
  flex: 1;
}
.large-copy i {
  display: block;
  height: 7px;
  margin-bottom: 12px;
  background: #5d6474;
}
.large-copy i:nth-child(2) {
  width: 76%;
}
.large-copy i:nth-child(3) {
  width: 54%;
}
.large-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 0 22px 20px;
}
.large-cards i {
  height: 62px;
  border: 1px solid rgba(116, 126, 201, 0.12);
  background: #121525;
}
/* ==========================================================
   10. TESTIMONIOS
   ========================================================== */
.testimonial {
  padding: 105px 0 95px;
  color: #0b2857;
  background:
    radial-gradient(
      circle at 50% 45%,
      rgba(255, 255, 255, 0.12),
      transparent 32%
    ),
    linear-gradient(120deg, #5f9aff, #4c8dff 50%, #5b9cff);
}
.testimonial-inner {
  text-align: center;
}
.avatar {
  width: 48px;
  height: 48px;
  margin: 0 auto 27px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: transparent;
  background:
    radial-gradient(circle at 50% 34%, #d7a77d 0 18%, transparent 19%),
    radial-gradient(circle at 50% 100%, #1c2935 0 44%, transparent 45%), #19212c;
  box-shadow: 0 8px 24px rgba(9, 37, 82, 0.25);
}
.testimonial blockquote {
  margin: 0;
  font-size: clamp(25px, 3.2vw, 38px);
  line-height: 1.25;
  letter-spacing: -1.5px;
  font-weight: 800;
}
.testimonial strong,
.testimonial small {
  display: block;
}
.testimonial strong {
  margin-top: 25px;
  font-size: 12px;
}
.testimonial small {
  font-size: 10px;
  opacity: 0.68;
}
.slider-buttons {
  margin-top: 28px;
  display: flex;
  justify-content: center;
  gap: 8px;
}
.slider-buttons button {
  width: 31px;
  height: 31px;
  border: 1px solid rgba(13, 53, 107, 0.17);
  background: rgba(255, 255, 255, 0.05);
  color: #173e74;
}
.dots {
  margin-top: 14px;
  display: flex;
  justify-content: center;
  gap: 5px;
}
.dots i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(7, 39, 82, 0.25);
}
.dots i:first-child {
  width: 13px;
  border-radius: 20px;
  background: rgba(7, 39, 82, 0.56);
}
/* ==========================================================
   11. PREGUNTAS FRECUENTES
   ========================================================== */
.faq {
  padding-top: 102px;
}
.faq-container {
  max-width: 760px;
}
.faq-head {
  text-align: center;
}
.faq-head p {
  margin: 10px 0 0;
  color: #8e949d;
  font-size: 11px;
}
.faq-list {
  margin-top: 47px;
}
.faq-list details {
  margin-bottom: 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: #18181b;
}
.faq-list summary {
  min-height: 54px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}
.faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-list summary span {
  color: #9ba1aa;
  font-size: 17px;
  transition: 0.2s;
}
.faq-list details[open] summary span {
  transform: rotate(45deg);
}
.faq-list details p {
  margin: 0;
  padding: 0 20px 18px;
  color: #969ca6;
  font-size: 10px;
  line-height: 1.7;
}
/* ==========================================================
   12. LLAMADA A LA ACCIÓN
   ========================================================== */
.cta {
  padding-top: 20px;
  padding-bottom: 130px;
}
.cta-box {
  padding: 88px 30px 82px;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background:
    radial-gradient(
      circle at 50% 0,
      rgba(255, 255, 255, 0.03),
      transparent 44%
    ),
    #242426;
}
.cta-box h2 {
  margin: 0;
  font-size: clamp(36px, 4.4vw, 54px);
  line-height: 0.98;
  letter-spacing: -3px;
}
.cta-box p {
  margin: 22px 0 30px;
  color: #a6aab2;
  font-size: 11px;
  line-height: 1.65;
}
.cta-box > div {
  display: flex;
  justify-content: center;
  gap: 12px;
}
/* ==========================================================
   13. PIE DE PÁGINA
   ========================================================== */
.footer {
  padding: 65px 0 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  background: #111113;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 0.7fr 0.7fr 1.3fr;
  gap: 50px;
}
.footer-brand p,
.newsletter p {
  color: #8f949e;
  font-size: 10px;
  line-height: 1.6;
}
.footer-brand p {
  max-width: 255px;
  margin: 14px 0 18px;
}
.social {
  display: flex;
  gap: 10px;
}
.social a {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #a8adb7;
  font-size: 10px;
}
.footer-column,
.newsletter {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.footer-column h3,
.newsletter h3 {
  margin: 3px 0 18px;
  color: #d7dae0;
  font-size: 9px;
  letter-spacing: 1.4px;
}
.footer-column a {
  margin-bottom: 10px;
  color: #888e98;
  font-size: 10px;
}
.newsletter p {
  margin: 0 0 13px;
}
.newsletter form {
  width: 100%;
  height: 36px;
  display: flex;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: #171719;
}
.newsletter input {
  min-width: 0;
  flex: 1;
  padding: 0 12px;
  color: #eff2f6;
  background: none;
  border: 0;
  outline: 0;
  font-size: 10px;
}
.newsletter button {
  width: 38px;
  border: 0;
  color: #111a27;
  background: #eef1f7;
}
.footer-bottom {
  margin-top: 50px;
  padding-top: 21px;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  color: #747984;
  font-size: 9px;
}
.footer-bottom p {
  margin: 0;
}
.footer-bottom div {
  display: flex;
  gap: 22px;
}

/* ==========================================================
   NORMALIZACIÓN CROMÁTICA — NEGRO, BLANCO Y AZUL
   El negro construye las superficies; el azul solo ilumina.
   ========================================================== */
:root {
  --bg: #000;
  --surface: #0b0b0c;
  --surface2: #111214;
}
body {
  background: #000;
}
.hero-next-cta,
.services.why-solutec {
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, .16), transparent 31%),
    #000;
}
.workflow {
  background: #03070d;
}
.about {
  background: #000;
}
.projects,
.faq,
.cta {
  background: #000;
}
.footer {
  background: #070707;
}
.testimonial {
  color: #edf3ff;
  background:
    radial-gradient(circle at 50% 48%, rgba(75, 135, 245, .11), transparent 33%),
    #001038;
}
.testimonial blockquote { color: #f2f5fa; }
.testimonial strong { color: #91b7ff; }
.testimonial small { color: #929cab; }
.slider-buttons button {
  border-color: rgba(126, 174, 255, .22);
  color: #9bc0ff;
  background: rgba(73, 133, 255, .07);
}
.dots i { background: rgba(126, 174, 255, .25); }
.dots i:first-child { background: #7eaaff; }
.faq-list details {
  border-color: rgba(255, 255, 255, .055);
  background: #0d0d0e;
}
.cta-box {
  background:
    radial-gradient(circle at 50% 0%, rgba(73, 133, 255, .07), transparent 42%),
    #0b0b0c;
}

/* Acentos sin deriva violeta o rosada */
.about-copy h2 span,
.workflow-heading h2 span,
.why-heading h2 span {
  background-image: linear-gradient(100deg, #f2f6ff 0%, #91b8ff 50%, #5f91ed 100%);
}
.about-orbit {
  background: radial-gradient(circle at 50% 60%, rgba(73, 133, 255, .35), rgba(38, 87, 173, .08) 56%, transparent 72%);
}
.about-value-card::before {
  background: linear-gradient(-45deg, #477fe8 0%, #78b0ff 50%, #b8d3ff 100%);
}
.about-value-card:hover {
  box-shadow:
    0 28px 70px rgba(0, 0, 0, .4),
    -7px 6px 26px rgba(49, 105, 216, .13),
    8px -4px 30px rgba(102, 164, 255, .11);
}
.workflow-step:nth-child(even)::before,
.workflow-step:nth-child(3)::before {
  background: #356dd5;
}
.workflow-number,
.workflow-step:hover .workflow-number {
  background-image: linear-gradient(145deg, #e1ebff 5%, #8bb6ff 55%, #4f83e7);
}
.why-card:nth-child(even)::before {
  background: rgba(61, 115, 220, .13);
}
.why-card::after {
  background: linear-gradient(135deg, #a7c5ff, #5f91ed);
}
.why-card:hover {
  background:
    linear-gradient(145deg, rgba(48, 91, 175, .16), transparent 58%),
    rgba(10, 14, 20, .9);
}
.why-card:hover .why-icon {
  background: linear-gradient(145deg, rgba(77, 128, 236, .88), rgba(48, 94, 190, .82));
}
.why-result strong {
  background-image: linear-gradient(110deg, #d3e2ff, #6d9ff5);
}

/* Carrusel 3D de servicios */
.services-orbit {
  position: relative;
  overflow: hidden;
  padding: 124px 0 112px;
  background:
    radial-gradient(circle at 4% 16%, rgba(38, 111, 239, .26) 0%, transparent 24%),
    radial-gradient(circle at 96% 20%, rgba(53, 136, 255, .2) 0%, transparent 22%),
    radial-gradient(ellipse at 6% 84%, rgba(19, 76, 182, .18) 0%, transparent 27%),
    radial-gradient(ellipse at 94% 88%, rgba(59, 120, 231, .16) 0%, transparent 28%),
    radial-gradient(ellipse 38% 28% at 50% 58%, rgba(55, 111, 219, .11), transparent 70%),
    #001038;
}
.services-orbit::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(93, 142, 224, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(93, 142, 224, .035) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
  pointer-events: none;
}
.services-orbit .container { position: relative; z-index: 1; }
.services-orbit-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
}
.services-orbit-heading .about-kicker {
  margin-inline: auto;
}
.services-orbit-heading h2 {
  max-width: 1040px;
  width: 100%;
  margin: 22px 0 0;
  color: #f1f4fa;
  font-size: clamp(44px, 4.8vw, 72px);
  font-weight: 680;
  line-height: 1.02;
  letter-spacing: -3.7px;
  text-transform: uppercase;
}
.services-orbit-heading h2 span {
  color: transparent;
  background: linear-gradient(100deg, #f4f7fc 0%, #98bcff 48%, #568bea 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
.services-orbit-heading > p {
  max-width: 1040px;
  margin: 24px auto 0;
  padding-left: 0;
  border-left: 0;
  color: #9099a7;
  font-size: 13px;
  line-height: 1.85;
}
.services-orbit-stage {
  position: relative;
  height: 665px;
  margin-top: 28px;
  perspective: 1500px;
  perspective-origin: 50% 44%;
}
.services-neural-canvas {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .72;
  mask-image: radial-gradient(ellipse 64% 68% at 50% 52%, #000 24%, rgba(0,0,0,.78) 62%, transparent 100%);
  pointer-events: none;
}
.services-orbit-stage::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 52px;
  width: 920px;
  height: 110px;
  border-radius: 50%;
  background: rgba(48, 100, 205, .12);
  filter: blur(48px);
  transform: translateX(-50%);
  animation: services-floor-glow 4.5s ease-in-out infinite;
}
.services-orbit-ring {
  --card-w: 250px;
  --card-h: 365px;
  --translate-z: 510px;
  --start-angle: 0deg;
  position: absolute;
  z-index: 2;
  top: 108px;
  left: calc(50% - var(--card-w) / 2);
  width: var(--card-w);
  height: var(--card-h);
  transform-style: preserve-3d;
  animation: service-orbit-rotating 40s linear infinite;
  will-change: transform;
}
.services-orbit-ring:has(.service-orbit-card:focus) {
  animation-play-state: paused;
}
@keyframes service-orbit-rotating {
  from { transform: rotateX(-8deg) rotateY(var(--start-angle)); }
  to { transform: rotateX(-8deg) rotateY(calc(var(--start-angle) + 360deg)); }
}
@keyframes services-floor-glow {
  50% { opacity: .58; transform: translateX(-50%) scale(.88); }
}
.service-orbit-card {
  --service-card-image: url("assets/images/services/cards/web-design-vertical-v1.webp");
  --service-card-position: 48% center;
  position: absolute;
  inset: 0;
  padding: 12px 17px 20px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 20px;
  color: #edf3fc;
  background:
    linear-gradient(145deg, rgba(5, 9, 15, .86), rgba(1, 3, 6, .82)) padding-box,
    linear-gradient(145deg, rgba(177, 207, 255, .72), rgba(67, 126, 235, .2) 48%, rgba(116, 168, 255, .58)) border-box;
  box-shadow:
    0 24px 60px rgba(0, 0, 0, .34),
    0 0 18px rgba(74, 130, 235, .1),
    inset 0 1px 0 rgba(255, 255, 255, .055);
  backdrop-filter: blur(13px) saturate(1.08);
  -webkit-backdrop-filter: blur(13px) saturate(1.08);
  transform:
    rotateY(calc((360deg / var(--quantity)) * var(--index)))
    translateZ(var(--translate-z));
  backface-visibility: hidden;
  transition:
    border-color .35s ease,
    filter .45s ease,
    box-shadow .45s ease,
    opacity .35s ease,
    scale .45s cubic-bezier(.22,.8,.24,1);
  cursor: pointer;
}
.service-orbit-card:nth-child(2) { --service-card-image: url("assets/images/services/cards/web-systems-vertical-v1.webp"); --service-card-position: 52% center; }
.service-orbit-card:nth-child(3) { --service-card-image: url("assets/images/services/cards/online-store-vertical-v1.webp"); --service-card-position: 50% center; }
.service-orbit-card:nth-child(4) { --service-card-image: url("assets/images/services/cards/seo-positioning-vertical-v1.webp"); --service-card-position: 55% center; }
.service-orbit-card:nth-child(5) { --service-card-image: url("assets/images/services/cards/mobile-apps-vertical-v1.webp"); --service-card-position: 50% center; }
.service-orbit-card:nth-child(6) { --service-card-image: url("assets/images/services/cards/automation-vertical-v1.webp"); --service-card-position: 48% center; }
.service-orbit-card:nth-child(7) { --service-card-image: url("assets/images/services/cards/support-vertical-v1.webp"); --service-card-position: 52% center; }
.service-orbit-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(118deg, transparent 18%, rgba(159, 194, 255, .11) 47%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .75s ease;
  z-index: 3;
  pointer-events: none;
}
.service-orbit-card::after {
  content: none;
}
.service-orbit-card:hover,
.service-orbit-card:focus,
.service-orbit-card.is-oriented {
  outline: none;
  border-color: transparent;
  background:
    linear-gradient(145deg, rgba(6, 11, 19, .9), rgba(1, 4, 8, .88)) padding-box,
    linear-gradient(135deg, #d5e5ff, #6ba2ff 44%, #b4d1ff) border-box;
  filter: brightness(1.04) saturate(1.05);
  scale: 1.025;
  box-shadow:
    0 28px 72px rgba(0, 0, 0, .5),
    0 0 42px rgba(70, 125, 235, .38),
    inset 0 1px 0 rgba(255, 255, 255, .12);
}
.service-orbit-card.is-oriented {
  animation: service-card-border-glow 2.8s ease-in-out infinite;
}
@keyframes service-card-border-glow {
  50% {
    box-shadow:
      0 30px 76px rgba(0, 0, 0, .52),
      0 0 58px rgba(86, 145, 255, .5),
      inset 0 1px 0 rgba(255, 255, 255, .17);
  }
}
.service-orbit-card:hover::before,
.service-orbit-card:focus::before,
.service-orbit-card.is-oriented::before { transform: translateX(120%); }
.service-orbit-card > * {
  position: relative;
  z-index: 2;
}
.service-card-waves {
  position: absolute;
  z-index: 0;
  top: 142px;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 72% 10%, rgba(91, 146, 250, .22), transparent 34%),
    linear-gradient(155deg, #2855a3, #102d5c 54%, #071326);
  transition: top .45s ease, filter .4s ease;
  pointer-events: none;
}
.service-card-waves i {
  position: absolute;
  top: auto;
  bottom: calc(100% - 30px);
  left: -54%;
  width: 208%;
  aspect-ratio: 1;
  border-radius: 43%;
  background: #0c121c;
  transform-origin: 50% 49%;
  animation: service-water-wave 7s linear infinite;
  will-change: transform;
}
.service-card-waves i:nth-child(2) {
  top: auto;
  bottom: calc(100% - 38px);
  border-radius: 46%;
  background: rgba(11, 18, 29, .74);
  animation-duration: 10s;
  animation-direction: reverse;
}
.service-card-waves i:nth-child(3) {
  top: auto;
  bottom: calc(100% - 46px);
  border-radius: 47%;
  background: rgba(15, 31, 57, .42);
  animation-duration: 13s;
}
@keyframes service-water-wave {
  to { transform: rotate(360deg); }
}
.service-orbit-card:hover .service-card-waves,
.service-orbit-card:focus .service-card-waves,
.service-orbit-card.is-oriented .service-card-waves {
  top: 132px;
  filter: brightness(1.25);
}
.service-orbit-card:hover .service-card-waves i,
.service-orbit-card:focus .service-card-waves i,
.service-orbit-card.is-oriented .service-card-waves i {
  animation-duration: 3.8s;
}
.service-orbit-index {
  position: absolute;
  top: 19px;
  right: 18px;
  color: rgba(157, 190, 247, .34);
  font-size: 27px;
  font-weight: 760;
  line-height: 1;
}
.service-orbit-icon {
  position: absolute;
  z-index: 4;
  top: 46px;
  left: 50%;
  width: 43px;
  height: 43px;
  margin: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(124, 166, 244, .28);
  border-radius: 10px;
  color: #91b6ff;
  background: rgba(7, 13, 23, .62);
  backdrop-filter: blur(10px);
  transform: translateX(-50%);
  transition: color .35s ease, background .35s ease, transform .4s ease, box-shadow .4s ease;
}
.service-orbit-card:hover .service-orbit-icon,
.service-orbit-card:focus .service-orbit-icon,
.service-orbit-card.is-oriented .service-orbit-icon {
  color: #f3f7ff;
  background: #477fe8;
  box-shadow: 0 12px 28px rgba(60, 112, 224, .35);
  transform: translateX(-50%) translateY(-4px) rotate(-5deg);
}
.service-orbit-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.service-orbit-card small {
  display: block;
  margin-top: 11px;
  text-align: center;
  color: #a8c5f5;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
.service-orbit-card h3 {
  margin: 7px -5px 11px;
  color: #ffffff;
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: -.5px;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 2px 16px rgba(126, 174, 255, .2);
}
.service-orbit-card p {
  margin: 0;
  color: #d1d8e3;
  font-size: 10px;
  line-height: 1.65;
}
.service-orbit-card a {
  position: relative;
  z-index: 8;
  width: max-content;
  margin-top: auto;
  min-height: 31px;
  padding: 0 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(189, 216, 255, .72);
  border-radius: 999px;
  color: #06101f;
  background: linear-gradient(180deg, #c7dcff, #78a9ff);
  box-shadow:
    0 9px 24px rgba(69, 126, 235, .25),
    inset 0 1px 0 rgba(255, 255, 255, .7);
  font-size: 8px;
  font-weight: 750;
  letter-spacing: 1.05px;
  text-transform: uppercase;
  transition: transform .3s ease, box-shadow .35s ease, filter .3s ease;
  pointer-events: auto;
  cursor: pointer;
}
.service-orbit-media {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 122px;
  flex: 0 0 122px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(151, 186, 246, .22);
  border-radius: 15px;
  background: rgba(0, 0, 0, .32);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
}
.service-orbit-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(2, 4, 8, .02), rgba(2, 5, 10, .42)),
    radial-gradient(circle at 50% 60%, transparent 25%, rgba(0, 0, 0, .18));
  pointer-events: none;
}
.service-orbit-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: brightness(.82) saturate(.86);
  transform: scale(1.02);
  transition: transform .65s cubic-bezier(.2,.8,.2,1), filter .45s ease;
}
.service-orbit-card:hover .service-orbit-media img,
.service-orbit-card:focus .service-orbit-media img,
.service-orbit-card.is-oriented .service-orbit-media img {
  filter: brightness(1.05) saturate(.95);
  transform: scale(1.09);
}
.service-orbit-card a span {
  display: inline-block;
  margin-left: 5px;
  transition: transform .3s ease;
}
.service-orbit-card a:hover span { transform: translateX(4px); }
.service-orbit-card a:hover,
.service-orbit-card a:focus-visible {
  outline: none;
  filter: brightness(1.1);
  transform: translateY(-2px);
  box-shadow:
    0 13px 30px rgba(69, 126, 235, .4),
    0 0 22px rgba(112, 163, 255, .22),
    inset 0 1px 0 rgba(255, 255, 255, .78);
}
.services-orbit-hint {
  position: absolute;
  left: 50%;
  bottom: 13px;
  margin: 0;
  color: #687386;
  font-size: 8px;
  letter-spacing: .7px;
  text-transform: uppercase;
  transform: translateX(-50%);
}
.services-orbit-hint span {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 7px;
  border-radius: 50%;
  background: #76a5ff;
  box-shadow: 0 0 10px rgba(118, 165, 255, .8);
}
@media (max-width: 900px) {
  .services-orbit-heading > p { max-width: 600px; }
  .services-orbit-stage { height: 630px; perspective: 1250px; }
  .services-orbit-ring { --card-w: 220px; --card-h: 352px; --translate-z: 410px; }
}
@media (max-width: 650px) {
  .services-orbit { padding: 86px 0 92px; }
  .services-orbit-heading h2 { font-size: 39px; letter-spacing: -2px; }
  .services-orbit-stage {
    height: auto;
    margin-top: 46px;
    perspective: none;
    overflow: visible;
  }
  .services-orbit-stage::before,
  .services-orbit-hint,
  .services-neural-canvas { display: none; }
  .services-orbit-ring {
    position: relative;
    top: auto;
    left: auto;
    width: auto;
    height: auto;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 82%;
    gap: 12px;
    overflow-x: auto;
    padding: 4px 2px 22px;
    transform: none;
    transform-style: flat;
    animation: none;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .services-orbit-ring::-webkit-scrollbar { display: none; }
  .service-orbit-card {
    position: relative;
    inset: auto;
    min-height: 330px;
    transform: none;
    backface-visibility: visible;
    scroll-snap-align: center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .services-orbit-ring,
  .services-orbit-stage::before { animation: none; }
  .service-orbit-card,
  .service-orbit-card::before,
  .service-orbit-card::after,
  .service-orbit-icon { transition: none; }
  .service-orbit-card::after { animation: none; }
  .service-card-waves i { animation: none; }
  .service-orbit-card.is-oriented { animation: none; }
}

/* Sistema solar de clientes */
.clients-solar {
  position: relative;
  overflow: hidden;
  padding: 124px 0 118px;
  background:
    radial-gradient(circle at 50% 62%, rgba(50, 108, 219, .09), transparent 32%),
    #001038;
}
.clients-solar::before {
  content: "";
  position: absolute;
  inset: 0;
  border-top: 1px solid rgba(255,255,255,.045);
  background:
    radial-gradient(circle at 18% 25%, rgba(126,174,255,.15) 0 1px, transparent 1.7px),
    radial-gradient(circle at 76% 32%, rgba(126,174,255,.12) 0 1px, transparent 1.8px),
    radial-gradient(circle at 63% 78%, rgba(255,255,255,.1) 0 1px, transparent 1.7px);
  background-size: 170px 170px, 230px 230px, 290px 290px;
  opacity: .55;
  pointer-events: none;
}
.clients-solar .container { position: relative; z-index: 1; }
.clients-solar-heading {
  max-width: 850px;
  margin: 0 auto;
  text-align: center;
}
.clients-solar-heading .about-kicker { margin-inline: auto; }
.clients-solar-heading h2 {
  margin: 22px 0 0;
  color: #f1f4fa;
  font-size: clamp(43px, 4.7vw, 70px);
  line-height: 1.03;
  letter-spacing: -3.5px;
  text-transform: uppercase;
}
.clients-solar-heading h2 span {
  color: transparent;
  background: linear-gradient(100deg, #f2f6ff, #91b8ff 52%, #5f91ed);
  -webkit-background-clip: text;
  background-clip: text;
}
.clients-solar-heading p {
  max-width: 620px;
  margin: 20px auto 0;
  color: #929cab;
  font-size: 13px;
  line-height: 1.8;
}
.clients-solar-system {
  position: relative;
  width: min(100%, 780px);
  height: 720px;
  margin: 38px auto 0;
  display: grid;
  place-items: center;
  isolation: isolate;
}
.clients-stars {
  position: absolute;
  inset: 4%;
  z-index: -2;
  border-radius: 50%;
  background:
    radial-gradient(circle at 15% 32%, #8eb8ff 0 1px, transparent 1.8px),
    radial-gradient(circle at 82% 22%, #dbe8ff 0 1px, transparent 1.7px),
    radial-gradient(circle at 72% 78%, #76a5ff 0 1.2px, transparent 2px),
    radial-gradient(circle at 29% 84%, #dbe8ff 0 1px, transparent 1.8px),
    radial-gradient(circle at 47% 9%, #76a5ff 0 1px, transparent 1.8px);
  filter: drop-shadow(0 0 5px rgba(104,157,255,.65));
  animation: client-stars-pulse 4s ease-in-out infinite;
}
.clients-sun {
  position: relative;
  z-index: 8;
  width: 154px;
  height: 154px;
  display: grid;
  place-content: center;
  justify-items: center;
  border: 1px solid rgba(170,202,255,.62);
  border-radius: 50%;
  background:
    radial-gradient(circle at 42% 35%, rgba(166,201,255,.35), transparent 25%),
    radial-gradient(circle, #183d7c, #07162e 62%, #03070d);
  box-shadow:
    0 0 24px rgba(72,132,245,.42),
    0 0 74px rgba(54,111,225,.24),
    inset 0 0 34px rgba(139,183,255,.18);
  animation: clients-sun-breathe 3.4s ease-in-out infinite;
}
.clients-sun::before,
.clients-sun::after {
  content: "";
  position: absolute;
  inset: -13px;
  border: 1px solid rgba(102,157,255,.18);
  border-radius: 50%;
}
.clients-sun::after { inset: -25px; opacity: .5; }
.clients-sun-logo {
  position: relative;
  z-index: 1;
  width: 124px;
  max-width: 92%;
  height: auto;
  display: block;
  mix-blend-mode: screen;
  filter: drop-shadow(0 0 8px rgba(181, 211, 255, .2));
}
.clients-sun-mark {
  color: #dce9ff;
  font-size: 38px;
  font-weight: 780;
  line-height: 1;
  text-shadow: 0 0 18px rgba(150,190,255,.55);
}
.clients-sun strong {
  margin-top: 7px;
  color: #f1f5fc;
  font-size: 13px;
  letter-spacing: 2.3px;
}
.clients-sun small {
  margin-top: 3px;
  color: #7898d4;
  font-size: 6px;
  letter-spacing: 1.5px;
}
.client-orbit {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: var(--orbit-size);
  height: var(--orbit-size);
  margin-top: calc(var(--orbit-size) / -2);
  margin-left: calc(var(--orbit-size) / -2);
  border: 1px solid rgba(112,158,235,.14);
  border-radius: 50%;
  box-shadow: inset 0 0 22px rgba(55,111,219,.025);
  animation: client-orbit-spin var(--speed) linear infinite;
  animation-direction: var(--direction);
}
.client-orbit::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #90b8ff;
  box-shadow: 0 0 12px rgba(116,165,255,.95);
}
.orbit-one,
.orbit-one .client-planet { animation-delay: -3s; }
.orbit-two,
.orbit-two .client-planet { animation-delay: -11s; }
.orbit-three,
.orbit-three .client-planet { animation-delay: -19s; }
.orbit-four,
.orbit-four .client-planet { animation-delay: -29s; }
.client-planet {
  position: absolute;
  top: 50%;
  animation: client-counter-spin var(--speed) linear infinite;
  animation-direction: var(--direction);
}
.client-planet.planet-a { left: 100%; translate: -50% -50%; }
.client-planet.planet-b { left: 0; translate: -50% -50%; }
.client-logo {
  width: 112px;
  height: 62px;
  padding: 10px 12px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(132,172,240,.18);
  border-radius: 13px;
  background: rgba(6,10,17,.82);
  box-shadow:
    0 14px 36px rgba(0,0,0,.35),
    0 0 18px rgba(66,119,220,.07),
    inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter: blur(14px);
  transition: transform .35s ease, border-color .35s ease, box-shadow .4s ease, filter .35s ease;
}
.client-logo.logo-wide { width: 134px; }
.client-logo.logo-tall { height: 74px; }
.client-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(1) brightness(1.45) contrast(1.1);
  transition: filter .35s ease, transform .45s ease;
}
.client-logo:hover {
  z-index: 12;
  border-color: rgba(145,184,255,.62);
  box-shadow:
    0 18px 45px rgba(0,0,0,.4),
    0 0 30px rgba(74,132,241,.24),
    inset 0 1px 0 rgba(255,255,255,.08);
  transform: scale(1.1);
}
.client-logo:hover img {
  filter: grayscale(0) brightness(1.25) contrast(1.08);
  transform: scale(1.035);
}
.clients-solar-system:hover .client-orbit,
.clients-solar-system:hover .client-planet {
  animation-play-state: paused;
}
.clients-comet {
  position: absolute;
  z-index: -1;
  width: 90px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(128,174,255,.7));
  filter: drop-shadow(0 0 5px rgba(93,149,255,.8));
  transform: rotate(-28deg);
  animation: client-comet 7s linear infinite;
}
.comet-one { top: 21%; left: 9%; }
.comet-two { right: 5%; bottom: 18%; animation-delay: -3.5s; }
@keyframes client-orbit-spin { to { transform: rotate(360deg); } }
@keyframes client-counter-spin { to { transform: rotate(-360deg); } }
@keyframes clients-sun-breathe {
  50% { transform: scale(1.035); box-shadow: 0 0 34px rgba(72,132,245,.52), 0 0 88px rgba(54,111,225,.3), inset 0 0 38px rgba(139,183,255,.24); }
}
@keyframes client-stars-pulse { 50% { opacity: .55; transform: scale(.98); } }
@keyframes client-comet {
  0% { opacity: 0; translate: -40px 30px; }
  20%, 60% { opacity: .7; }
  100% { opacity: 0; translate: 170px -100px; }
}
@media (max-width: 760px) {
  .clients-solar { padding: 88px 0 90px; }
  .clients-solar-heading h2 { font-size: 39px; letter-spacing: -2px; }
  .clients-solar-system { height: 610px; transform: scale(.83); margin-top: 0; margin-bottom: -55px; }
}
@media (max-width: 520px) {
  .clients-solar-system { width: 760px; left: 50%; margin-left: -380px; transform: scale(.62); margin-top: -45px; margin-bottom: -120px; }
}
@media (prefers-reduced-motion: reduce) {
  .client-orbit,
  .client-planet,
  .clients-sun,
  .clients-stars,
  .clients-comet { animation-play-state: paused; }
}
/* ==========================================================
   14. DISEÑO RESPONSIVE
   ========================================================== */

/* Pantallas medianas y laptops pequeñas */
@media (max-width: 1160px) {
  .hero-code-editor {
    display: none;
  }
  .topbar-message {
    display: none;
  }
  .topbar-inner {
    grid-template-columns: 1fr 1fr;
  }
  .nav {
    gap: 2px;
  }
  .nav a {
    padding: 10px 7px;
    font-size: 8px;
  }
  .logo-mark > span:last-child {
    display: none;
  }
  .whatsapp-button span {
    display: none;
  }
  .whatsapp-button {
    width: 38px;
    padding: 0;
    justify-content: center;
  }
}
/* Tablets horizontales */
@media (max-width: 1024px) {
  .nav {
    gap: 0;
  }
  .code-window {
    right: -280px;
    opacity: 0.6;
  }
  .mosaic {
    grid-template-columns: repeat(6, 1fr);
  }
  .project-one,
  .project-phone,
  .project-planet,
  .project-analytics,
  .project-wave,
  .project-product,
  .project-terminal,
  .project-large {
    grid-column: span 3;
  }
  .footer-grid {
    grid-template-columns: 1.4fr 0.7fr 0.7fr;
  }
  .newsletter {
    grid-column: 1/-1;
  }
}
/* Tablets verticales y celulares grandes */
@media (max-width: 760px) {
  .container {
    width: min(calc(100% - 30px), var(--container));
  }
  .topbar {
    height: 31px;
  }
  .topbar-contact .topbar-link:nth-child(2),
  .topbar-social {
    display: none;
  }
  .topbar-inner {
    display: flex;
    justify-content: center;
  }
  .topbar-contact {
    width: 100%;
    justify-content: center;
  }
  .navbar {
    height: 61px;
    gap: 16px;
  }
  .nav {
    display: none;
  }
  .logo-mark > span:last-child {
    display: inline;
  }
  .nav-actions {
    margin-left: auto;
  }
  .whatsapp-button {
    display: none;
  }
  .appointment-button {
    height: 34px;
    padding: 0 13px;
    font-size: 9px;
  }
  .hero {
    min-height: 760px;
    padding-top: 92px;
  }
  .hero-content {
    padding-top: 110px;
  }
  .hero h1 {
    font-size: 42px;
    letter-spacing: -2.7px;
  }
  .hero-slide p {
    font-size: 13px;
  }
  .grid-bg {
    inset: 92px 0 0;
  }
  .code-window {
    width: 610px;
    height: 420px;
    right: -390px;
    top: 145px;
    opacity: 0.42;
  }
  .trust {
    margin-top: 92px;
  }
  .clients {
    justify-content: space-between;
    gap: 12px;
    font-size: 7px;
  }
  .section {
    padding: 82px 0;
  }
  .services-grid {
    grid-template-columns: 1fr;
  }
  .section-row {
    align-items: flex-start;
  }
  .project-link {
    white-space: nowrap;
  }
  .mosaic {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 116px;
  }
  .project-one,
  .project-phone,
  .project-planet,
  .project-analytics,
  .project-wave,
  .project-product,
  .project-terminal,
  .project-large {
    grid-column: span 1;
    grid-row: span 2;
  }
  .project-one,
  .project-large {
    grid-column: span 2;
  }
  .testimonial blockquote {
    font-size: 27px;
  }
  .faq-container {
    width: min(calc(100% - 30px), 760px);
  }
  .cta-box {
    padding: 70px 20px;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
  .footer-brand,
  .newsletter {
    grid-column: 1/-1;
  }
  .footer-bottom {
    gap: 20px;
    flex-direction: column;
    align-items: flex-start;
  }
}
/* Celulares pequeños */
@media (max-width: 520px) {
  .topbar-link {
    padding: 0 8px;
  }
  .topbar-link span {
    font-size: 8px;
  }
  .logo-mark > span:last-child {
    display: none;
  }
  .appointment-button {
    padding: 0 12px;
  }
  .appointment-button span:first-child {
    display: none;
  }
  .button-small {
    padding: 0 12px;
  }
  .hero h1 {
    font-size: 36px;
  }
  .hero-buttons {
    align-items: stretch;
    flex-direction: column;
    width: 190px;
  }
  .clients span:nth-child(2),
  .clients span:nth-child(4) {
    display: none;
  }
  .section-row {
    display: block;
  }
  .project-link {
    display: inline-block;
    margin-top: 20px;
  }
  .mosaic {
    grid-template-columns: 1fr;
  }
  .project-one,
  .project-phone,
  .project-planet,
  .project-analytics,
  .project-wave,
  .project-product,
  .project-terminal,
  .project-large {
    grid-column: span 1;
  }
  .testimonial blockquote br {
    display: none;
  }
  .cta-box > div {
    flex-direction: column;
    align-items: center;
  }
  .cta-box .button {
    width: 170px;
  }
  .footer-grid {
    grid-template-columns: 1fr;
  }
  .footer-column,
  .newsletter,
  .footer-brand {
    grid-column: auto;
  }
}

/* Clientes — composición orbital horizontal */
.clients-solar {
  padding: 118px 0 110px;
  background: radial-gradient(ellipse at 76% 50%, rgba(48,87,174,.13), transparent 34%), linear-gradient(112deg, #050a13 0%, #070d18 48%, #050a13 100%);
}
.clients-solar-layout {
  display: grid;
  grid-template-columns: minmax(330px, .72fr) minmax(620px, 1.35fr);
  align-items: center;
  gap: 38px;
}
.clients-solar-heading { max-width: 440px; margin: 0; text-align: left; }
.clients-solar-heading .about-kicker { margin: 0; }
.clients-solar-heading h2 { margin-top: 22px; font-size: clamp(58px, 5.4vw, 82px); line-height: .94; letter-spacing: -4px; }
.clients-solar-heading h2 span { background: linear-gradient(100deg, #6f9dff, #8271ff 82%); -webkit-background-clip: text; background-clip: text; }
.clients-solar-heading p { max-width: 410px; margin: 30px 0 0; font-size: 14px; line-height: 2; }
.clients-solar-status {
  width: fit-content; margin-top: 30px; padding: 11px 16px; display: flex; align-items: center; gap: 10px;
  color: #afbbce; font-size: 11px; border: 1px solid rgba(133,159,205,.25); border-radius: 999px; background: rgba(14,22,36,.55);
}
.clients-solar-status i { width: 7px; height: 7px; border-radius: 50%; background: #26d08a; box-shadow: 0 0 12px rgba(38,208,138,.55); }
.clients-solar-cta {
  width: fit-content; margin-top: 16px; padding: 14px 19px; display: flex; align-items: center; gap: 12px;
  color: #fff; font-size: 10px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  border: 1px solid rgba(112,132,255,.48); border-radius: 999px;
  background: linear-gradient(100deg, rgba(49,78,146,.6), rgba(64,35,132,.72)); box-shadow: 0 14px 34px rgba(0,0,0,.2);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.clients-solar-cta:hover { color: #fff; transform: translateY(-2px); border-color: rgba(151,162,255,.82); box-shadow: 0 16px 34px rgba(31,52,122,.3); }
.clients-solar-cta span { font-size: 17px; line-height: 0; }
.clients-solar-system { width: 100%; height: 520px; margin: 0; }
.clients-stars { inset: 6% 2%; border-radius: 50%; }
.clients-sun { width: 112px; height: 112px; }
.clients-sun-mark { font-size: 28px; }
.clients-sun strong { margin-top: 5px; }
.client-orbit {
  z-index: 1; top: 50%; left: 50%; margin: 0; translate: -50% -50%;
  border: 1px solid rgba(81,153,218,.38); border-radius: 50%;
  box-shadow: inset 0 0 22px rgba(55,111,219,.02), 0 0 22px rgba(35,84,152,.03);
  transform: rotate(-3deg); animation: none;
}
.client-orbit::before { display: none; }
.orbit-outer { width: 94%; height: 78%; }
.orbit-inner { width: 62%; height: 47%; border-style: dashed; border-color: rgba(111,104,224,.32); transform: rotate(-5deg); }
.clients-solar-system > .client-logo {
  position: absolute; z-index: 5; width: 112px; height: 66px; padding: 8px;
  border: 1px solid transparent; border-radius: 12px; background: transparent;
  filter: drop-shadow(0 8px 12px rgba(0,0,0,.45)); animation: client-logo-float 5s ease-in-out infinite;
}
.clients-solar-system > .client-logo img { filter: grayscale(1) brightness(1.18) contrast(1.05); }
.clients-solar-system > .client-logo:hover {
  z-index: 12; border-color: rgba(145,184,255,.62); background: rgba(6,12,23,.82);
  transform: scale(1.1) translateY(-3px); animation-play-state: paused;
}
.client-stm { top: 8%; left: 22%; width: 105px !important; animation-delay: -.8s !important; }
.client-heavy { top: 9%; right: 14%; width: 125px !important; height: 72px !important; animation-delay: -2.2s !important; }
.client-cosco { top: 29%; right: 18%; width: 112px !important; height: 82px !important; animation-delay: -3.4s !important; }
.client-xperto { top: 47%; right: -1%; width: 130px !important; animation-delay: -1.4s !important; }
.client-faby { right: 12%; bottom: 5%; width: 130px !important; height: 72px !important; animation-delay: -4.1s !important; }
.client-juanjui { left: 24%; bottom: 5%; width: 130px !important; animation-delay: -2.8s !important; }
.client-saenz { left: 22%; bottom: 22%; width: 82px !important; height: 86px !important; animation-delay: -.2s !important; }
.client-zona { top: 42%; left: -1%; width: 112px !important; height: 105px !important; animation-delay: -3.8s !important; }
@keyframes client-logo-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
@media (max-width: 1060px) {
  .clients-solar-layout { grid-template-columns: 1fr; gap: 46px; }
  .clients-solar-heading { max-width: 680px; margin: 0 auto; text-align: center; }
  .clients-solar-heading .about-kicker, .clients-solar-status, .clients-solar-cta { margin-left: auto; margin-right: auto; }
  .clients-solar-heading p { max-width: 580px; margin-left: auto; margin-right: auto; }
  .clients-solar-system { max-width: 780px; margin: 0 auto; transform: none; }
}
@media (max-width: 650px) {
  .clients-solar { padding: 82px 0 78px; }
  .clients-solar-heading h2 { font-size: 48px; letter-spacing: -2.5px; }
  .clients-solar-heading p { font-size: 13px; line-height: 1.75; }
  .clients-solar-system {
    left: auto; width: 100%; height: auto; margin: 0; padding-top: 128px; display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; transform: none;
  }
  .client-orbit, .clients-comet { display: none; }
  .clients-sun { position: absolute; top: 0; left: 50%; translate: -50% 0; }
  .clients-solar-system > .client-logo, .client-stm, .client-heavy, .client-cosco, .client-xperto,
  .client-faby, .client-juanjui, .client-saenz, .client-zona {
    position: relative; inset: auto; width: 100% !important; height: 92px !important; padding: 17px;
    border-color: rgba(128,158,217,.14); background: rgba(9,16,29,.58); animation-delay: 0s !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .clients-solar-system > .client-logo { animation-play-state: paused; }
}

/* Ajuste integrado: órbitas activas y logos uniformes */
.clients-solar {
  padding: 112px 0 104px;
  background:
    radial-gradient(circle at 50% 66%, rgba(50,108,219,.09), transparent 34%),
    #001038;
}
.clients-solar-layout {
  display: block;
}
.clients-solar-heading {
  max-width: 850px;
  margin: 0 auto;
  text-align: center;
}
.clients-solar-heading .about-kicker { margin-inline: auto; }
.clients-solar-heading h2 {
  margin-top: 22px;
  font-size: clamp(43px, 4.7vw, 70px);
  line-height: 1.03;
  letter-spacing: -3.5px;
}
.clients-solar-heading h2 span {
  background: linear-gradient(100deg, #f2f6ff, #91b8ff 52%, #5f91ed);
  -webkit-background-clip: text;
  background-clip: text;
}
.clients-solar-heading p {
  max-width: 620px;
  margin: 20px auto 0;
  font-size: 13px;
  line-height: 1.8;
}
.clients-solar-system {
  width: min(100%, 840px);
  height: 590px;
  margin: 38px auto 0;
}
.orbit-outer { width: 88%; height: 68%; }
.orbit-inner { width: 60%; height: 42%; }
.clients-solar-system > .client-logo {
  position: absolute;
  inset: auto;
  width: 132px !important;
  height: 82px !important;
  padding: 13px 15px;
  overflow: hidden;
  border: 1px solid rgba(132,172,240,.18);
  border-radius: 14px;
  background: rgba(6,10,17,.84);
  box-shadow: 0 14px 36px rgba(0,0,0,.35), 0 0 18px rgba(66,119,220,.07), inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter: blur(14px);
  filter: none;
  animation: none !important;
  transform: translate(-50%, -50%);
  will-change: left, top;
}
.clients-solar-system > .client-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(1) brightness(1.32) contrast(1.08);
}
.clients-solar-system > .client-logo:hover {
  transform: translate(-50%, -50%) scale(1.08);
}
@media (max-width: 760px) {
  .clients-solar { padding: 88px 0 82px; }
  .clients-solar-heading h2 { font-size: 39px; letter-spacing: -2px; }
  .clients-solar-system {
    left: auto;
    width: 700px;
    height: 520px;
    margin: 20px 0 -45px;
    margin-left: calc((100% - 700px) / 2);
    padding: 0;
    display: grid;
    transform: scale(.82);
  }
  .client-orbit { display: block; }
  .clients-comet { display: block; }
  .clients-sun { top: 50%; left: 50%; translate: -50% -50%; }
  .clients-solar-system > .client-logo {
    position: absolute;
    width: 118px !important;
    height: 74px !important;
    padding: 12px 14px;
  }
}
@media (max-width: 520px) {
  .clients-solar-system {
    margin-top: -20px;
    margin-bottom: -105px;
    transform: scale(.66);
  }
}

/* Composición final de clientes: órbita izquierda, contenido derecha */
.clients-solar {
  padding: 110px 0;
  background:
    radial-gradient(ellipse at 34% 54%, rgba(54, 104, 210, .12), transparent 34%),
    linear-gradient(100deg, #03070d 0%, #060b14 58%, #04070c 100%);
}
.clients-solar-layout {
  display: grid;
  grid-template-columns: minmax(650px, 1.55fr) minmax(310px, .72fr);
  grid-template-areas: "orbit copy";
  align-items: center;
  gap: clamp(28px, 4vw, 68px);
}
.clients-solar-heading {
  grid-area: copy;
  max-width: 410px;
  margin: 0;
  text-align: left;
}
.clients-solar-heading .about-kicker { margin: 0; }
.clients-solar-heading h2 {
  margin-top: 22px;
  font-size: clamp(48px, 4.2vw, 68px);
  line-height: 1;
  letter-spacing: -3.2px;
}
.clients-solar-heading p {
  max-width: 390px;
  margin: 25px 0 0;
  font-size: 13px;
  line-height: 1.9;
}
.clients-solar-system {
  grid-area: orbit;
  width: 100%;
  height: 555px;
  margin: 0;
}
.orbit-outer {
  width: 94%;
  height: 72%;
  border-color: rgba(76, 151, 224, .37);
}
.orbit-inner {
  width: 63%;
  height: 44%;
  border-color: rgba(101, 103, 225, .3);
}
.clients-solar-system > .client-logo {
  width: 132px !important;
  height: 86px !important;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  filter: none;
}
.clients-solar-system > .client-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  overflow: visible;
  filter:
    grayscale(1)
    brightness(1.28)
    contrast(1.08)
    drop-shadow(0 0 5px rgba(147, 184, 255, .22))
    drop-shadow(0 0 13px rgba(82, 132, 235, .12));
}
.clients-solar-system > .client-logo:hover {
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: translate(-50%, -50%) scale(1.08);
}
.clients-solar-system > .client-logo:hover img {
  filter:
    grayscale(0)
    brightness(1.25)
    contrast(1.06)
    drop-shadow(0 0 7px rgba(164, 198, 255, .38))
    drop-shadow(0 0 18px rgba(82, 132, 235, .22));
}
@media (max-width: 1120px) {
  .clients-solar-layout {
    grid-template-columns: minmax(560px, 1.4fr) minmax(280px, .7fr);
    gap: 24px;
  }
  .clients-solar-system { height: 510px; }
}
@media (max-width: 900px) {
  .clients-solar-layout {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas: "copy" "orbit";
    gap: 42px;
  }
  .clients-solar-heading {
    max-width: 680px;
    margin: 0 auto;
    text-align: center;
  }
  .clients-solar-heading .about-kicker { margin-inline: auto; }
  .clients-solar-heading p { max-width: 560px; margin-left: auto; margin-right: auto; }
  .clients-solar-system {
    width: min(100%, 780px);
    height: 540px;
    margin: 0 auto;
  }
}
@media (max-width: 760px) {
  .clients-solar { padding: 84px 0 76px; }
  .clients-solar-system {
    width: 680px;
    height: 500px;
    margin: -24px 0 -70px;
    margin-left: calc((100% - 680px) / 2);
    transform: scale(.78);
  }
  .clients-solar-system > .client-logo {
    width: 122px !important;
    height: 80px !important;
  }
}
@media (max-width: 520px) {
  .clients-solar-heading h2 { font-size: 40px; }
  .clients-solar-system {
    margin-top: -58px;
    margin-bottom: -118px;
    transform: scale(.62);
  }
}

/* Distribución definitiva: contenido izquierda y órbitas ordenadas derecha */
.clients-solar-layout {
  grid-template-columns: minmax(320px, .72fr) minmax(620px, 1.5fr);
  grid-template-areas: "copy orbit";
  gap: clamp(26px, 3vw, 52px);
}
.clients-solar-heading {
  max-width: 420px;
}
.clients-solar-heading h2 {
  font-size: clamp(45px, 4vw, 64px);
}
.clients-solar-system {
  height: 550px;
}
.orbit-outer {
  width: 92%;
  height: 78%;
  border-width: 1.5px;
  border-color: rgba(76, 165, 244, .64);
  box-shadow:
    0 0 12px rgba(61, 143, 230, .14),
    inset 0 0 18px rgba(61, 143, 230, .06);
}
.orbit-inner {
  width: 57%;
  height: 47%;
  border-width: 1.5px;
  border-color: rgba(118, 116, 255, .5);
  border-style: dashed;
  box-shadow:
    0 0 12px rgba(103, 103, 245, .13),
    inset 0 0 16px rgba(103, 103, 245, .055);
}
.orbit-outer::after,
.orbit-inner::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  border-top: 2px solid rgba(184, 218, 255, .32);
  border-right: 2px solid transparent;
  border-bottom: 2px solid rgba(91, 130, 255, .08);
  border-left: 2px solid transparent;
  filter: drop-shadow(0 0 5px rgba(91, 158, 245, .22));
  pointer-events: none;
}
.orbit-inner::after {
  border-top-color: rgba(164, 166, 255, .25);
  filter: drop-shadow(0 0 4px rgba(111, 111, 255, .18));
}

/* Últimos proyectos — carrusel editorial */
.projects {
  position: relative;
  padding: 102px 0 94px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 0%, rgba(49, 96, 180, .08), transparent 34%),
    #050a12;
}
.projects-showcase-head {
  margin-bottom: 48px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
}
.projects-showcase-head .about-kicker { margin: 0 0 15px; }
.projects-showcase-head h2 {
  margin: 0;
  color: #f4f7fc;
  font-size: clamp(27px, 2.3vw, 36px);
  line-height: 1;
  letter-spacing: 7px;
}
.projects-showcase-link {
  margin-bottom: 4px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #8fb8ff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2px;
}
.projects-showcase-link span {
  font-size: 16px;
  transition: transform .25s ease;
}
.projects-showcase-link:hover { color: #c8dcff; }
.projects-showcase-link:hover span { transform: translateX(4px); }
.projects-showcase {
  position: relative;
  width: 100%;
}
.projects-showcase-track {
  display: flex;
  gap: 14px;
  padding: 0 max(20px, calc((100vw - 1260px) / 2));
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
}
.projects-showcase-track:focus-visible {
  outline: 2px solid #1068f8;
  outline-offset: 5px;
}
.projects-showcase-track::-webkit-scrollbar { display: none; }
.project-showcase-card {
  position: relative;
  flex: 0 0 clamp(360px, 31vw, 520px);
  display: flex;
  min-height: 470px;
  flex-direction: column;
  overflow: hidden;
  scroll-snap-align: start;
  background: #09111d;
  isolation: isolate;
}
.project-showcase-card::before,
.project-showcase-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.project-showcase-card::before {
  bottom: auto;
  height: 330px;
  background: linear-gradient(180deg, rgba(2,7,13,.02) 55%, rgba(3,8,14,.42) 100%);
}
.project-showcase-card::after {
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(104,158,255,.48), transparent);
  opacity: .45;
}
.project-showcase-card > img {
  width: 100%;
  height: 330px;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform .75s cubic-bezier(.2,.75,.2,1), filter .5s ease;
  filter: saturate(.78) brightness(.77);
}
.project-showcase-card:hover > img {
  transform: scale(1.045);
  filter: saturate(.95) brightness(.88);
}
.project-showcase-copy {
  position: relative;
  z-index: 2;
  flex: 1;
  padding: 25px 28px 27px;
  background: linear-gradient(180deg, #09111d, #060b13);
}
.project-showcase-copy small {
  display: block;
  margin-bottom: 13px;
  color: #8cb3ff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.6px;
}
.project-showcase-copy h3 {
  margin: 0;
  color: #f7f9fc;
  font-size: 21px;
  line-height: 1.15;
  letter-spacing: .2px;
}
.project-showcase-copy p {
  margin: 10px 0 0;
  color: #a6afbd;
  font-size: 12px;
  line-height: 1.55;
}
.projects-showcase-arrow {
  position: absolute;
  z-index: 4;
  top: 50%;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: #f7f9fc;
  font-size: 19px;
  border: 1px solid rgba(158,188,236,.34);
  border-radius: 50%;
  background: rgba(5,12,23,.82);
  box-shadow: 0 10px 28px rgba(0,0,0,.3);
  backdrop-filter: blur(12px);
  transform: translateY(-50%);
  transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
.projects-showcase-arrow:hover {
  border-color: rgba(151,191,255,.74);
  background: rgba(23,48,87,.92);
  transform: translateY(-50%) scale(1.06);
}
.projects-showcase-arrow:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
  border-color: #1068f8;
}
.projects-showcase-arrow.is-prev { left: 20px; }
.projects-showcase-arrow.is-next { right: 20px; }
.projects-showcase-status {
  width: max-content;
  max-width: calc(100% - 40px);
  margin: 18px auto 0;
  color: rgba(232, 241, 255, .72);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.1px;
  text-align: center;
  text-transform: uppercase;
}
@media (max-width: 900px) {
  .projects { padding: 82px 0 76px; }
  .projects-showcase-head { margin-bottom: 34px; align-items: center; }
  .projects-showcase-head h2 { font-size: 26px; letter-spacing: 4px; }
  .project-showcase-card { flex-basis: min(78vw, 460px); min-height: 440px; }
  .project-showcase-card::before,
  .project-showcase-card > img { height: 300px; }
}
@media (max-width: 560px) {
  .projects-showcase-head { align-items: flex-start; flex-direction: column; gap: 18px; }
  .projects-showcase-head .about-kicker { margin-bottom: 12px; }
  .projects-showcase-head h2 { max-width: 230px; font-size: 24px; line-height: 1.2; letter-spacing: 3px; }
  .projects-showcase-link { margin-top: 0; white-space: nowrap; }
  .projects-showcase-track { gap: 10px; }
  .project-showcase-card { flex-basis: calc(100vw - 42px); min-height: 410px; }
  .project-showcase-card::before,
  .project-showcase-card > img { height: 245px; }
  .project-showcase-copy { padding: 22px 22px 24px; }
  .project-showcase-copy h3 { font-size: 19px; }
  .projects-showcase-arrow { width: 42px; height: 42px; }
  .projects-showcase-arrow.is-prev { left: 10px; }
  .projects-showcase-arrow.is-next { right: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .projects-showcase-track { scroll-behavior: auto; }
  .project-showcase-card > img { transition: none; }
}

.clients-solar-system > .client-logo {
  width: 96px !important;
  height: 60px !important;
}
@media (max-width: 1120px) {
  .clients-solar-layout {
    grid-template-columns: minmax(285px, .7fr) minmax(540px, 1.35fr);
    grid-template-areas: "copy orbit";
  }
  .clients-solar-system { height: 510px; }
  .clients-solar-system > .client-logo {
    width: 90px !important;
    height: 56px !important;
  }
}
@media (max-width: 900px) {
  .clients-solar-layout {
    grid-template-columns: 1fr;
    grid-template-areas: "copy" "orbit";
  }
  .clients-solar-heading {
    max-width: 680px;
    margin-inline: auto;
    text-align: center;
  }
  .clients-solar-heading .about-kicker { margin-inline: auto; }
}
@media (max-width: 760px) {
  .clients-solar-system > .client-logo {
    width: 94px !important;
    height: 59px !important;
  }
}

/* Marca oficial */
.logo-brand-image { display: inline-flex; align-items: center; justify-content: center; width: 82px; height: 52px; padding: 0 !important; overflow: visible; border-radius: 0; background: transparent; }
.logo-brand-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.logo-brand-image--footer { width: 116px; height: 74px; margin-bottom: 14px; }
html[data-theme="light"] .logo-brand-image { background: transparent; box-shadow: none; }
@media (max-width: 760px) { .logo-brand-image { width: 68px; height: 43px; }.logo-brand-image--footer { width: 100px; height: 64px; } }

/* Preguntas frecuentes: guía de servicios */
.faq { position: relative; padding: 120px 0; overflow: hidden; background: radial-gradient(circle at 74% 42%,rgba(48,106,220,.12),transparent 30%), #001038; }
.faq-container { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(360px,.72fr); width: min(calc(100% - 64px), 1420px); max-width: none; align-items: stretch; gap: clamp(42px,5vw,90px); }
.faq-copy { padding: 18px 0; }.faq-copy h2 { margin: 20px 0 12px; color: #f1f4fa; font-size: clamp(42px,5vw,68px); line-height: .95; letter-spacing: -3.3px; text-transform: uppercase; }.faq-copy h2 span { color: transparent; background: linear-gradient(105deg,#f2f6ff,#91b9ff 58%,#5d8eea); -webkit-background-clip: text; background-clip: text; }.faq-copy > p { max-width: 500px; margin: 0; color: #929eb0; font-size: 13px; line-height: 1.75; }
.faq .faq-list { margin-top: 33px; }.faq .faq-list details { margin: 0; border: 0; border-bottom: 1px solid rgba(140,169,217,.22); background: transparent; }.faq .faq-list summary { min-height: 61px; padding: 0 2px; color: #dfe8f7; font-size: 13px; font-weight: 700; }.faq .faq-list summary span { color: #9bbdff; font-size: 21px; font-weight: 400; }.faq .faq-list details[open] summary { color: #fff; }.faq .faq-list details[open] summary span { color: #82adff; }.faq .faq-list details p { max-width: 660px; padding: 0 28px 19px 2px; color: #8e9aae; font-size: 11px; line-height: 1.75; }
.faq-visual-wrap { position:relative; z-index:0; min-height:530px; isolation:isolate; }.faq-visual-wrap::before { content:""; position:absolute; z-index:0; inset:14px -13px -15px 15px; clip-path:polygon(15% 0,100% 0,85% 100%,0 100%); background:linear-gradient(145deg,rgba(64,125,245,.95),rgba(22,60,153,.8) 56%,rgba(8,26,78,.94)); box-shadow:0 20px 38px rgba(20,73,207,.34),inset 0 1px rgba(176,213,255,.5); }.faq-visual-wrap::after { content:""; position:absolute; z-index:0; inset:28px -28px -29px 30px; clip-path:polygon(15% 0,100% 0,85% 100%,0 100%); border:1px solid rgba(98,162,255,.42); background:rgba(53,108,229,.1); filter:blur(.1px); }
.faq-visual { position: relative; z-index:1; min-height: 530px; margin: 0; overflow: hidden; border: 1px solid rgba(124,164,231,.24); border-radius: 13px; background: #09101d; }.faq-visual::after { content:""; position:absolute; inset:0; background: linear-gradient(180deg,rgba(3,7,13,.04),rgba(3,7,13,.12) 53%,rgba(3,7,13,.86)); }.faq-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 56% center; filter: saturate(.73) brightness(.8); transition: transform .65s ease,filter .35s ease; }.faq-visual:hover img { transform: scale(1.035); filter: saturate(.9) brightness(.92); }.faq-visual figcaption { position:absolute; z-index:1; right:18px; bottom:17px; left:18px; color:#c7d9f8; font-size:8px; font-weight:800; letter-spacing:1px; text-align:center; }
.faq-visual { border: 0; border-radius: 0; clip-path: polygon(15% 0,100% 0,85% 100%,0 100%); filter: drop-shadow(0 18px 28px rgba(0,0,0,.32)); }
.faq-visual::before { content:""; position:absolute; z-index:2; inset:1px; border:1px solid rgba(140,183,255,.68); clip-path: polygon(15% 0,100% 0,85% 100%,0 100%); pointer-events:none; }
.faq-visual::after { z-index:1; }.faq-visual img { position:relative; z-index:0; }.faq-visual figcaption { z-index:3; }
@media (max-width:860px) { .faq-visual { clip-path: polygon(9% 0,100% 0,91% 100%,0 100%); }.faq-visual::before { clip-path: polygon(9% 0,100% 0,91% 100%,0 100%); } }
html[data-theme="light"] .faq { background: radial-gradient(circle at 74% 42%,rgba(48,106,220,.12),transparent 30%),#FFFFFF !important; }.faq-container .faq-copy { color:inherit; }html[data-theme="light"] .faq-copy h2,html[data-theme="light"] .faq .faq-list summary { color:#10234a; }html[data-theme="light"] .faq-copy > p,html[data-theme="light"] .faq .faq-list details p { color:#5a6b84; }html[data-theme="light"] .faq .faq-list details { border-bottom-color:rgba(43,91,166,.2); }
@media (max-width: 860px) { .faq-container { grid-template-columns: 1fr; width: min(calc(100% - 40px), 680px); gap: 34px; }.faq-visual-wrap { min-height:390px; max-width:620px; }.faq-visual { min-height: 390px; max-width: 620px; }.faq-copy { padding-top:0; } }
@media (max-width: 560px) { .faq { padding: 84px 0; }.faq-copy h2 { font-size: 43px; letter-spacing:-2.5px; }.faq .faq-list summary { min-height:64px; font-size:12px; }.faq-visual-wrap,.faq-visual { min-height:330px; }.faq .faq-list details p { padding-right:5px; } }

/* Compatibilidad progresiva: los efectos avanzados nunca rompen el diseño */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .header,.section-path,.theme-toggle,.contact-form,.testimonial-copy { background-color: rgba(7,13,24,.96) !important; }
  html[data-theme="light"] .header,html[data-theme="light"] .section-path,html[data-theme="light"] .theme-toggle,html[data-theme="light"] .contact-form { background-color: rgba(255,255,255,.98) !important; }
}
@supports not (clip-path: polygon(0 0,100% 0,100% 100%,0 100%)) {
  .faq-visual-wrap::before,.faq-visual-wrap::after,.faq-visual,.faq-visual::before { clip-path: none !important; }
  .faq-visual { border-radius: 12px; }.faq-visual-wrap::before { border-radius: 12px; }.faq-visual-wrap::after { display: none; }
}
@supports not selector(:has(*)) {
  .services-orbit-ring:hover { animation-play-state: paused; }
  .testimonials-grid .testimonial-project:not(.is-active) { filter: none; }
}
@supports not (translate: 0 0) {
  .client-planet.planet-a { transform: translate(-50%,-50%); }.client-planet.planet-b { transform: translate(-50%,-50%); }
  .clients-sun { transform: translate(-50%,-50%); }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Camino flotante de navegación */
.section-path { position: fixed; top: 50%; left: 18px; z-index: 900; display: flex; flex-direction: column; gap: 0; padding: 13px 11px; border: 1px solid rgba(111,158,249,.17); border-radius: 13px; background: rgba(4,9,17,.58); box-shadow: 0 14px 34px rgba(0,0,0,.18); backdrop-filter: blur(12px); transform: translateY(-50%); }
.section-path::before { content: ""; position: absolute; top: 48px; bottom: 22px; left: 25px; width: 1px; background: linear-gradient(180deg,rgba(111,158,249,.52),rgba(111,158,249,.07)); }
.section-path-label { margin: 0 0 8px 25px; color: #64728a; font-size: 7px; font-weight: 800; letter-spacing: .9px; }
.section-path a { position: relative; display: flex; align-items: center; gap: 9px; min-height: 35px; color: #68758a; font-size: 8px; font-weight: 700; letter-spacing: .35px; text-decoration: none; transition: color .24s ease, transform .24s ease; }
.section-path a i { position: relative; z-index: 1; display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid #65758e; border-radius: 50%; color: #75859d; background: #09101b; transition: background .24s ease, border-color .24s ease, box-shadow .24s ease, transform .24s ease, color .24s ease; }
.section-path a i svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.section-path a span { max-width: 0; overflow: hidden; opacity: 0; white-space: nowrap; transition: max-width .28s ease, opacity .2s ease; }
.section-path:hover a span,.section-path a:focus-visible span { max-width: 85px; opacity: 1; }
.section-path a.is-passed { color: #a9c8ff; }.section-path a.is-passed i { border-color: #78aaff; color: #bcd5ff; background: rgba(57,112,222,.22); box-shadow: 0 0 11px rgba(107,164,255,.48), inset 0 0 9px rgba(103,164,255,.12); }
.section-path a.is-current { color: #f3f7ff; transform: translateX(2px); }.section-path a.is-current i { width: 25px; height: 25px; margin-left: -2.5px; border-color: #dbeaff; color: #fff; background: linear-gradient(145deg,#5288f0,#769eff); box-shadow: 0 0 0 3px rgba(87,144,248,.18),0 0 19px rgba(95,153,255,.85); }
.section-path a:focus-visible { outline: 0; color: #fff; }.section-path a:focus-visible i { box-shadow: 0 0 0 3px rgba(139,185,255,.32); }
html[data-theme="light"] .section-path { border-color: rgba(42,94,173,.16); background: rgba(255,255,255,.78); box-shadow: 0 12px 28px rgba(23,62,120,.12); }.theme-toggle { z-index: 901; }
@media (max-width: 1050px) { .section-path { left: 10px; }.section-path-label { display: none; }.section-path::before { top: 22px; }.section-path a { min-height: 31px; } }
@media (max-width: 760px) { .section-path { top: auto; right: 70px; bottom: 13px; left: 13px; flex-direction: row; justify-content: space-between; padding: 8px 12px; transform: none; }.section-path::before { top: 50%; right: 22px; bottom: auto; left: 22px; width: auto; height: 1px; }.section-path a { min-height: 23px; }.section-path a span { display:none; }.section-path a i { width: 17px; height: 17px; }.section-path a i svg { width: 9px; height: 9px; }.section-path a.is-current i { width: 22px; height: 22px; }.theme-toggle { bottom: 11px; } }

/* Variante compacta: cápsula de iconos, sin etiquetas */
.section-path { width: 52px; align-items: center; gap: 8px; padding: 14px 9px; border-radius: 28px; border-color: rgba(112,158,243,.24); background: linear-gradient(180deg,rgba(8,16,30,.94),rgba(3,8,16,.9)); box-shadow: 0 14px 38px rgba(0,0,0,.35), inset 0 1px rgba(185,210,255,.08); }
.section-path::before { top: 28px; bottom: 28px; left: 25px; background: linear-gradient(180deg,rgba(122,168,255,.14),rgba(122,168,255,.58) 45%,rgba(122,168,255,.12)); }
.section-path-label,.section-path a span { display: none !important; }
.section-path a { justify-content: center; width: 32px; min-height: 32px; }
.section-path a i { width: 27px; height: 27px; border-color: rgba(129,158,205,.45); color: #73829a; background: rgba(11,20,35,.82); }
.section-path a i svg { width: 13px; height: 13px; stroke-width: 1.55; }
.section-path a.is-passed i { border-color: rgba(116,169,255,.76); color: #acd0ff; background: radial-gradient(circle at 50% 35%,rgba(105,165,255,.34),rgba(23,58,118,.52)); box-shadow: 0 0 0 2px rgba(88,145,247,.08),0 0 15px rgba(80,144,255,.34); }
.section-path a.is-current { transform: none; }.section-path a.is-current i { width: 32px; height: 32px; margin-left: 0; border-color: #e3efff; color: #fff; background: radial-gradient(circle at 35% 25%,#8fc5ff,#4c83ed 58%,#365ebc); box-shadow: 0 0 0 4px rgba(84,144,251,.17),0 0 25px rgba(83,146,255,.88),inset 0 1px rgba(255,255,255,.48); }
html[data-theme="light"] .section-path { border-color: rgba(31,85,172,.18); background: linear-gradient(180deg,rgba(255,255,255,.95),rgba(240,247,255,.9)); box-shadow: 0 14px 30px rgba(27,66,121,.16); }.section-path a:hover i { border-color: #b7d4ff; color: #dcecff; transform: scale(1.08); }
@media (max-width: 760px) { .section-path { right: 70px; left: 13px; width: auto; height: 48px; gap: 0; padding: 8px 10px; border-radius: 24px; }.section-path::before { top: 50%; right: 26px; left: 26px; }.section-path a { width: 29px; min-height: 29px; }.section-path a i { width: 23px; height: 23px; }.section-path a i svg { width: 11px; height: 11px; }.section-path a.is-current i { width: 28px; height: 28px; } }

/* Acabado minimalista: la navegación acompaña, no compite */
.section-path { width: 52px; gap: 9px; padding: 12px 8px; border-color: rgba(117,152,211,.16); border-radius: 26px; background: rgba(5,10,19,.46); box-shadow: 0 8px 22px rgba(0,0,0,.16); }
.section-path::before { top: 27px; bottom: 27px; left: 25px; background: rgba(126,160,217,.2); }
.section-path a { width: 36px; min-height: 36px; }.section-path a i { width: 29px; height: 29px; border-color: rgba(143,171,218,.55); color: #c9d9ef; background: rgba(9,16,28,.46); }.section-path a i svg { width: 17px; height: 17px; stroke-width: 1.85; }
.section-path a.is-passed i { border-color: rgba(119,166,244,.72); color: #d3e3ff; background: rgba(45,89,161,.28); box-shadow: none; }
.section-path a.is-current i { width: 33px; height: 33px; border-color: #1068F8; color: #fff; background: #477bd9; box-shadow: 0 0 0 2px rgba(100,153,243,.16); }
.section-path a:hover i { border-color: #9fc3fb; color: #dceaff; transform: none; }
html[data-theme="light"] .section-path { background: rgba(255,255,255,.72); box-shadow: 0 8px 18px rgba(31,69,124,.1); }
@media (max-width: 760px) { .section-path { width: auto; height: 49px; padding: 8px 10px; }.section-path a { width: 33px; min-height: 33px; }.section-path a i { width: 26px; height: 26px; }.section-path a i svg { width: 15px; height: 15px; }.section-path a.is-current i { width: 30px; height: 30px; } }

/* Alternador de tema y modo claro */
.theme-toggle { position: fixed; left: 22px; bottom: 22px; z-index: 1001; display: grid; width: 48px; height: 48px; place-items: center; overflow: hidden; border: 1px solid rgba(126,174,255,.58); border-radius: 50%; color: #a9c8ff; background: rgba(5,12,24,.88); box-shadow: 0 10px 28px rgba(0,0,0,.34), inset 0 1px rgba(193,218,255,.12); backdrop-filter: blur(12px); cursor: pointer; transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease; }
.theme-toggle:hover { transform: translateY(-3px) rotate(9deg); border-color: #8db8ff; color: #fff; }.theme-toggle span { position:absolute; font-size:21px; line-height:1; transition: opacity .28s ease, transform .35s cubic-bezier(.2,.75,.25,1); }.theme-toggle-sun { opacity:0; transform:rotate(-70deg) scale(.45); }.theme-toggle-moon { opacity:1; transform:rotate(0) scale(1); }
html[data-theme="light"] .theme-toggle { border-color: rgba(34,95,187,.28); color: #1264d9; background: rgba(255,255,255,.9); box-shadow: 0 10px 24px rgba(29,70,132,.16); }html[data-theme="light"] .theme-toggle-sun { opacity:1; transform:rotate(0) scale(1); }html[data-theme="light"] .theme-toggle-moon { opacity:0; transform:rotate(70deg) scale(.45); }

html[data-theme="light"] body { color: #14223a; background: #FFFFFF; }
html[data-theme="light"] .header { border-bottom-color: rgba(17,61,125,.1); background: rgba(255,255,255,.88) !important; box-shadow: 0 5px 20px rgba(24,60,112,.06); }
html[data-theme="light"] .header a,html[data-theme="light"] .nav-links a,html[data-theme="light"] .logo { color: #10244a !important; }
html[data-theme="light"] .topbar { background: linear-gradient(90deg,#eef5ff,#dfeeff,#f4f8ff) !important; border-bottom-color: rgba(22,84,173,.11); }html[data-theme="light"] .topbar,html[data-theme="light"] .topbar a { color:#174485 !important; }
html[data-theme="light"] .hero-next-cta,html[data-theme="light"] .about,html[data-theme="light"] .workflow,html[data-theme="light"] .projects,html[data-theme="light"] .clients-solar,html[data-theme="light"] .testimonials-showcase,html[data-theme="light"] .faq,html[data-theme="light"] .contact-showcase,html[data-theme="light"] .footer { background-color: #FFFFFF !important; color: #14223a !important; }
html[data-theme="light"] .testimonial-project::after,html[data-theme="light"] .contact-visual::after { opacity: .42; }
html[data-theme="light"] .hero { color: #f4f7fd !important; }
html[data-theme="light"] .hero h1 { color: #f4f7fd !important; }
html[data-theme="light"] .hero .hero-accent { color: #1068F8 !important; background: linear-gradient(135deg,#FFFFFF 5%,#1068F8 48%,#003998 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; }
html[data-theme="light"] .hero p,html[data-theme="light"] .hero small,html[data-theme="light"] .hero b { color: inherit !important; }
html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3,html[data-theme="light"] h4,html[data-theme="light"] .title,html[data-theme="light"] .about-copy h2,html[data-theme="light"] .contact-copy h2 { color: #10234a !important; }
html[data-theme="light"] p,html[data-theme="light"] .about-copy > p,html[data-theme="light"] .testimonials-intro p,html[data-theme="light"] .clients-solar-heading p { color: #52637e !important; }
html[data-theme="light"] .about-shell,html[data-theme="light"] .contact-shell { background: #fff !important; border-color: rgba(32,89,174,.16) !important; box-shadow: 0 18px 50px rgba(31,72,132,.1); }
html[data-theme="light"] .contact-copy { background: linear-gradient(145deg,#f9fcff,#edf5ff) !important; }html[data-theme="light"] .contact-form { background: #fff !important; border-color: rgba(31,94,187,.18) !important; box-shadow: 0 14px 35px rgba(32,76,139,.11); }html[data-theme="light"] .contact-form-head h3,html[data-theme="light"] .contact-form-head > span { color: #123b7f !important; }
html[data-theme="light"] .contact-fields label { color: #334866 !important; }html[data-theme="light"] .contact-fields input,html[data-theme="light"] .contact-fields select,html[data-theme="light"] .contact-fields textarea { color:#14223a; background:#f3f7fd; border-color:rgba(40,98,185,.1); }html[data-theme="light"] .contact-fields input::placeholder,html[data-theme="light"] .contact-fields textarea::placeholder { color:#8190a8; }
html[data-theme="light"] .service-orbit-card,html[data-theme="light"] .project-showcase-card,html[data-theme="light"] .testimonial-project,html[data-theme="light"] .faq details,html[data-theme="light"] .client-logo { border-color: rgba(29,86,173,.17) !important; background-color: #fff !important; box-shadow: 0 10px 28px rgba(28,71,135,.08); }
html[data-theme="light"] .service-orbit-card p,html[data-theme="light"] .project-showcase-copy p,html[data-theme="light"] .faq p { color:#5e6e85 !important; }
html[data-theme="light"] .testimonial-copy { background: linear-gradient(135deg,rgba(255,255,255,.95),rgba(241,247,255,.94)) !important; color:#14223a !important; }html[data-theme="light"] .testimonial-copy blockquote,html[data-theme="light"] .testimonial-copy footer strong { color:#14223a !important; }html[data-theme="light"] .testimonial-copy footer small { color:#5e6e85 !important; }
html[data-theme="light"] .clients-sun { box-shadow: 0 0 34px rgba(15,113,233,.25), inset 0 0 26px rgba(86,158,255,.16) !important; }html[data-theme="light"] .clients-solar-system { filter: saturate(.85); }
html[data-theme="light"] .footer { border-top-color:rgba(29,86,173,.14); }html[data-theme="light"] .footer p,html[data-theme="light"] .footer a,html[data-theme="light"] .footer h3 { color:#425775 !important; }
@media (max-width: 620px) { .theme-toggle { left: 15px; right:auto; bottom: 15px; width:44px; height:44px; } }

/* Contacto: formulario editorial integrado a la línea visual */
.contact-showcase { position: relative; padding: 116px 0; overflow: hidden; background: linear-gradient(rgba(48,105,198,.045) 1px,transparent 1px), linear-gradient(90deg,rgba(48,105,198,.045) 1px,transparent 1px), #001038; background-size: 72px 72px; }
.contact-shell { position: relative; display: grid; grid-template-columns: minmax(280px,.82fr) minmax(430px,1.1fr) minmax(180px,.38fr); min-height: 650px; overflow: hidden; border: 1px solid rgba(103,151,238,.2); border-radius: 16px; background: #060a12; box-shadow: 0 24px 80px rgba(0,0,0,.35); }
.contact-copy { position: relative; z-index: 2; padding: 64px 52px; background: radial-gradient(circle at 10% 0%,rgba(68,126,241,.14),transparent 39%), #070b13; }
.contact-copy h2 { margin: 24px 0 25px; color: #f2f5fc; font-size: clamp(42px,4.2vw,64px); line-height: 1.02; letter-spacing: -3.3px; text-transform: uppercase; }
.contact-copy h2 span { color: transparent; background: linear-gradient(100deg,#a7c7ff,#5a88ed); -webkit-background-clip: text; background-clip: text; }
.contact-copy p { max-width: 360px; margin: 0; color: #9da8b9; font-size: 13px; line-height: 1.8; }
.contact-direct { display: grid; gap: 16px; margin-top: 42px; }
.contact-direct a { display: grid; grid-template-columns: 30px 1fr; column-gap: 10px; align-items: center; color: #dfe9fa; text-decoration: none; }
.contact-direct a > span { grid-row: span 2; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(111,158,249,.46); border-radius: 7px; color: #8ab4ff; font-size: 15px; }
.contact-direct small { color: #718097; font-size: 7px; font-weight: 800; letter-spacing: .9px; }
.contact-direct strong { font-size: 10px; font-weight: 650; }
.contact-direct a:hover strong { color: #8db6ff; }
.contact-orbit-mark { position: absolute; right: 54px; bottom: 47px; display: grid; width: 96px; height: 96px; place-items: center; border: 1px solid rgba(101,150,249,.68); border-radius: 27px; color: #78a6ff; font-size: 47px; line-height: 1; transform: rotate(-45deg); box-shadow: inset 0 0 28px rgba(77,133,241,.1), 0 0 32px rgba(69,124,232,.12); }
.contact-orbit-mark::after { content: ""; position: absolute; inset: -9px; border: 1px solid rgba(97,147,242,.18); border-radius: 32px; }
.contact-form { z-index: 2; align-self: center; margin: 28px 0; padding: 40px 38px 32px; color: #eaf0fa; background: linear-gradient(145deg,rgba(19,28,43,.95),rgba(8,13,23,.98)); border: 1px solid rgba(131,167,230,.24); border-radius: 12px; box-shadow: 0 20px 44px rgba(0,0,0,.28), inset 0 1px rgba(196,217,255,.06); }
.contact-form-head > span { color: #8eaff4; font-size: 8px; font-weight: 800; letter-spacing: .9px; }
.contact-form-head h3 { margin: 11px 0 29px; color: #f5f7fb; font-size: 27px; letter-spacing: -1.2px; text-transform: uppercase; }
.contact-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 13px; }
.contact-fields label { display: grid; gap: 8px; color: #aeb9c9; font-size: 9px; font-weight: 600; }
.contact-field-wide { grid-column: 1 / -1; }
.contact-fields input,.contact-fields select,.contact-fields textarea { width: 100%; min-height: 42px; padding: 11px 12px; border: 1px solid transparent; border-radius: 6px; outline: 0; color: #eaf1ff; background: rgba(126,159,222,.075); font: inherit; font-size: 11px; transition: border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.contact-fields textarea { resize: vertical; min-height: 88px; }
.contact-fields select { color: #aeb9c9; appearance: auto; }
.contact-fields option { color: #111; }
.contact-fields input::placeholder,.contact-fields textarea::placeholder { color: #758298; }
.contact-fields input:focus,.contact-fields select:focus,.contact-fields textarea:focus { border-color: rgba(116,166,255,.7); background: rgba(96,141,237,.1); box-shadow: 0 0 0 3px rgba(83,135,241,.11); }
.contact-consent { display: flex; align-items: center; gap: 8px; margin-top: 16px; color: #7d899a; font-size: 8px; cursor: pointer; }
.contact-consent input { width: 13px; height: 13px; accent-color: #6b9dff; }
.contact-submit { display: flex; width: 100%; align-items: center; justify-content: space-between; margin-top: 17px; padding: 14px 16px; border: 0; border-radius: 6px; color: #fff; background: linear-gradient(100deg,#3976e9,#6a61ee); box-shadow: 0 10px 25px rgba(66,112,235,.22); font: inherit; font-size: 10px; font-weight: 800; letter-spacing: .65px; text-transform: uppercase; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.contact-submit span { font-size: 19px; line-height: .5; }.contact-submit:hover { filter: brightness(1.12); transform: translateY(-2px); box-shadow: 0 15px 30px rgba(66,112,235,.34); }
.contact-whatsapp { display: flex; justify-content: space-between; margin-top: 18px; color: #8491a3; font-size: 8px; text-decoration: none; }.contact-whatsapp b { color: #9bc5b6; font-size: 8px; letter-spacing: .4px; text-transform: uppercase; }
.contact-visual { position: relative; min-width: 0; margin: 0; overflow: hidden; }.contact-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,#080d16 0%,transparent 36%), linear-gradient(0deg,rgba(3,7,13,.75),transparent 40%); }.contact-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 43% center; filter: saturate(.63) brightness(.72); }.contact-visual figcaption { position: absolute; z-index: 1; top: 18px; right: 15px; padding: 10px 12px; border: 1px solid rgba(176,202,252,.24); border-radius: 999px; color: #e7efff; background: rgba(3,8,15,.62); font-size: 7px; font-weight: 800; letter-spacing: .6px; }.contact-visual figcaption i { display:inline-block; width:5px; height:5px; margin-right:5px; border-radius:50%; background:#81aaff; box-shadow:0 0 9px #81aaff; }
@media (max-width: 1050px) { .contact-shell { grid-template-columns: .8fr 1.2fr; }.contact-visual { display: none; } }
@media (max-width: 720px) { .contact-showcase { padding: 80px 0; background-size: 48px 48px; }.contact-shell { grid-template-columns: 1fr; }.contact-copy { padding: 45px 27px 84px; }.contact-copy h2 { font-size: 47px; }.contact-orbit-mark { right: 28px; bottom: 25px; width: 66px; height: 66px; border-radius: 20px; font-size: 34px; }.contact-form { margin: 0; border-radius: 0; border-right: 0; border-left: 0; padding: 34px 27px; }.contact-fields { grid-template-columns: 1fr; }.contact-field-wide { grid-column: auto; } }

/* Acordeón: un caso activo por defecto, los demás se contraen al hover */
@media (min-width: 761px) {
  .testimonials-showcase .testimonials-grid { display: flex; height: 458px; gap: 10px; }
  .testimonials-showcase .testimonials-grid .testimonial-project,
  .testimonials-showcase .testimonials-grid .testimonial-project--featured { flex: .7 1 0; min-width: 0; min-height: 0; cursor: pointer; transition: flex .62s cubic-bezier(.2,.72,.2,1), filter .45s ease, border-color .35s ease, box-shadow .35s ease; }
  .testimonials-showcase .testimonials-grid .testimonial-project.is-active { flex: 1.7 1 0; }
  .testimonials-showcase .testimonials-grid .testimonial-project .testimonial-copy { opacity: 0 !important; transform: translateY(16px) !important; pointer-events: none !important; }
  .testimonials-showcase .testimonials-grid .testimonial-project.is-active .testimonial-copy { opacity: 1 !important; transform: translateY(0) !important; pointer-events: auto !important; }
  .testimonials-showcase .testimonials-grid .testimonial-project.is-active .testimonial-default { opacity: 0; transform: translateY(8px); }
  .testimonials-showcase .testimonials-grid .testimonial-project:not(.is-active) .testimonial-default { right: 11px; bottom: 14px; left: 11px; display: grid; justify-items: center; gap: 7px; text-align: center; font-size: 0; }
  .testimonials-showcase .testimonials-grid .testimonial-project:not(.is-active) .testimonial-client-logo { width: 104px; height: 62px; object-position: center; }
  .testimonials-showcase .testimonials-grid .testimonial-project:not(.is-active)::after { background: linear-gradient(180deg, rgba(2,7,14,.06), rgba(2,6,12,.75) 72%, rgba(2,5,10,.98)); }
  .testimonials-showcase .testimonials-grid .testimonial-project:not(.is-active) .testimonial-image { filter: saturate(.55) brightness(.44); }
  .testimonials-showcase .testimonials-grid .testimonial-project.is-active .testimonial-image { filter: saturate(.82) brightness(.72); transform: scale(1.045); }
  .testimonials-showcase .testimonials-grid .testimonial-project.is-active { border-color: rgba(119,166,255,.72); box-shadow: 0 18px 48px rgba(15,59,141,.24); }
}

/* Panel editorial: información integrada, no otra tarjeta dentro de la imagen */
.testimonials-showcase .testimonial-copy { right: 28px; bottom: 24px; left: 28px; padding: 0 0 0 16px; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.testimonials-showcase .testimonial-copy::before { content: ""; position: absolute; top: 2px; bottom: 2px; left: 0; width: 1px; background: linear-gradient(transparent, #75a7ff 24%, #75a7ff 78%, transparent); box-shadow: 0 0 13px rgba(100,155,255,.52); }
.testimonials-showcase .testimonial-copy-top { justify-content: flex-start; gap: 15px; }
.testimonials-showcase .testimonial-copy-top span { padding: 0; border: 0; border-radius: 0; color: #9ec2ff; background: transparent; font-size: 8px; letter-spacing: 1.1px; }
.testimonials-showcase .testimonial-copy-top b { margin-left: auto; color: #8fb5ff; font-size: 10px; letter-spacing: 1.5px; }
.testimonials-showcase .testimonial-copy blockquote { max-width: 690px; margin: 13px 0 17px; color: #f5f7fb; font-size: clamp(13px, 1.1vw, 15px); font-weight: 600; line-height: 1.52; letter-spacing: -.16px; text-shadow: 0 2px 16px rgba(0,0,0,.75); }
.testimonials-showcase .testimonial-copy footer { grid-template-columns: 28px minmax(0, 1fr) auto; gap: 8px; padding-top: 11px; border-top-color: rgba(154,188,244,.22); }
.testimonials-showcase .testimonial-copy footer { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; }
.testimonials-showcase .testimonial-footer-logo { width: 52px; height: 31px; opacity: 1; filter: grayscale(1) brightness(3); }
.testimonials-showcase .testimonial-copy footer strong { color: #b8c9e4; font-size: 8px; letter-spacing: .8px; }
.testimonials-showcase .testimonial-copy footer small { margin-top: 4px; color: #f0f4fb; font-size: 10px; font-weight: 600; }
.testimonials-showcase .testimonial-copy footer em { color: #8e9bad; font-size: 7px; letter-spacing: .7px; }
@media (max-width: 620px) { .testimonials-showcase .testimonial-copy { right: 20px; bottom: 20px; left: 20px; } }

.testimonial-corner-icon { position: absolute; top: 16px; right: 16px; z-index: 2; display: grid; width: 46px; height: 46px; place-items: center; color: #b5d0ff; opacity: .88; transition: opacity .32s ease, transform .38s cubic-bezier(.2,.75,.25,1); }
.testimonial-corner-icon svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 9px rgba(99,157,255,.5)); }
.testimonial-project.is-active .testimonial-corner-icon { opacity: 0; transform: translateY(-7px) scale(.82); pointer-events: none; }
@media (max-width: 760px) { .testimonial-corner-icon { top: 15px; right: 15px; } }

/* Footer Jexora */
.footer{position:relative;isolation:isolate;overflow:hidden;padding:82px 0 24px;border-top-color:rgba(113,160,246,.22);background:radial-gradient(ellipse at 12% 0%,rgba(48,105,211,.16),transparent 35%),linear-gradient(rgba(65,118,207,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(65,118,207,.045) 1px,transparent 1px),#04070d;background-size:auto,74px 74px,74px 74px,auto}.footer-grid--jexora{grid-template-columns:minmax(230px,1.25fr) minmax(140px,.74fr) minmax(145px,.78fr) minmax(245px,1.05fr);gap:clamp(28px,4vw,72px)}.footer .logo-brand-image--footer{width:142px;height:82px;margin:-8px 0 10px}.footer-brand p{max-width:290px;margin:0 0 22px;color:#91a0b6;font-size:12px;line-height:1.75}.footer .social,.newsletter form{display:none}.footer-brand-cta{display:inline-flex;align-items:center;gap:11px;padding:10px 13px;border:1px solid rgba(132,177,255,.44);border-radius:7px;color:#dceaff;background:rgba(68,122,220,.1);font-size:9px;font-weight:800;letter-spacing:.7px;text-transform:uppercase}.footer-brand-cta span{color:#91bcff;font-size:15px}.footer-column h3,.newsletter h3{margin:7px 0 21px;color:#edf4ff;font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase}.footer-column a{position:relative;width:fit-content;margin:0 0 12px;color:#8492a9;font-size:11px;transition:color .22s,transform .22s}.footer-column a::before{content:"";display:inline-block;width:0;height:1px;margin:0;vertical-align:middle;background:#91bcff;transition:width .22s,margin .22s}.footer-column a:hover{color:#e6f0ff;transform:translateX(2px)}.footer-column a:hover::before{width:9px;margin-right:7px}.newsletter{display:flex;flex-direction:column;align-items:flex-start}.newsletter>p{max-width:260px;margin:-5px 0 13px;color:#8796ac;font-size:11px;line-height:1.65}.footer-direct-link{display:block;margin-top:10px}.footer-direct-link small,.footer-direct-link strong{display:block}.footer-direct-link small{margin-bottom:3px;color:#718199;font-size:7px;font-weight:800;letter-spacing:.7px;text-transform:uppercase}.footer-direct-link strong{color:#d8e4f5;font-size:10px;font-weight:600}.footer-direct-link:hover strong{color:#9fc4ff}.footer-bottom{margin-top:62px;padding-top:18px;border-top-color:rgba(135,168,218,.17);color:#687890;font-size:9px}.footer-bottom div{align-items:center;gap:16px}.footer-bottom div span{color:#7788a2}.footer-bottom div span::after{content:"";display:inline-block;width:3px;height:3px;margin-left:16px;border-radius:50%;vertical-align:middle;background:#70a3ef}.footer-bottom a{color:#a8c7f8;font-weight:700}html[data-theme="light"] .footer{background:radial-gradient(ellipse at 12% 0%,rgba(66,129,229,.13),transparent 35%),linear-gradient(rgba(65,118,207,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(65,118,207,.04) 1px,transparent 1px),#FFFFFF!important;background-size:auto,74px 74px,74px 74px,auto}.footer-brand p,.newsletter>p{color:#65758c!important}html[data-theme="light"] .footer-column h3,html[data-theme="light"] .newsletter h3{color:#132a50!important}html[data-theme="light"] .footer-column a{color:#4d6280!important}html[data-theme="light"] .footer-direct-link strong{color:#244267!important}@media(max-width:1024px){.footer-grid--jexora{grid-template-columns:1.1fr .8fr .8fr}.newsletter{grid-column:1/-1}.newsletter>p{max-width:360px}}@media(max-width:760px){.footer{padding-top:62px}.footer-grid--jexora{grid-template-columns:1fr 1fr;gap:37px 24px}.footer-brand,.newsletter{grid-column:1/-1}.footer-bottom{margin-top:45px}.footer .logo-brand-image--footer{width:128px;height:74px}}@media(max-width:520px){.footer{background-size:auto,52px 52px,52px 52px,auto}.footer-grid--jexora{grid-template-columns:1fr;gap:29px}.footer-brand,.newsletter{grid-column:auto}.footer-column h3,.newsletter h3{margin-bottom:15px}.footer-column a{margin-bottom:10px}.footer-bottom div{gap:11px}.footer-bottom div span::after{margin-left:11px}}

.footer-appointment-button { width: 205px; height: 46px; padding: 0 46px; }
.footer-appointment-button .appointment-text { transform: translateX(-10px); }
.footer-appointment-button:hover .appointment-text { transform: translateX(12px); }
.footer-social.topbar-social { display:flex; width:auto; min-width:0; justify-content:flex-start; gap:8px; margin-top:24px; padding-top:17px; border-top:1px solid rgba(135,168,218,.16); }.footer-social .brand-pill { display:inline-flex; margin-right:2px; }

/* Footer: jerarquía y contraste reforzados */
.footer{padding-top:96px;border-top-color:rgba(121,172,255,.38);background:radial-gradient(ellipse at 8% 20%,rgba(40,103,228,.23),transparent 31%),radial-gradient(ellipse at 86% 0%,rgba(73,117,210,.13),transparent 28%),linear-gradient(180deg,#08101d 0%,#04070d 42%,#03060b 100%)}.footer::after{content:"";position:absolute;z-index:-1;top:0;right:0;left:0;height:1px;background:linear-gradient(90deg,transparent,rgba(139,188,255,.78),transparent);box-shadow:0 0 18px rgba(91,151,255,.45)}.footer-grid--jexora{align-items:start}.footer-grid--jexora>*{position:relative}.footer-brand{padding:18px 22px 22px;border:1px solid rgba(125,172,250,.23);border-radius:14px;background:linear-gradient(145deg,rgba(21,39,69,.76),rgba(5,10,19,.3));box-shadow:inset 0 1px rgba(198,221,255,.1),0 18px 38px rgba(0,0,0,.16)}.footer-brand::before{content:"";position:absolute;top:0;right:23px;left:23px;height:1px;background:linear-gradient(90deg,transparent,rgba(142,188,255,.8),transparent);box-shadow:0 0 9px rgba(91,151,255,.45)}.footer-brand .logo-brand-image--footer{filter:drop-shadow(0 7px 14px rgba(82,141,255,.23))}.footer-brand p{color:#a5b6cf}.footer-column{padding-top:18px}.footer-column h3,.newsletter h3{position:relative;margin-bottom:25px;color:#f4f7ff;font-size:11px}.footer-column h3::after,.newsletter h3::after{content:"";position:absolute;bottom:-10px;left:0;width:25px;height:2px;background:linear-gradient(90deg,#a8cbff,#477fdf);box-shadow:0 0 9px rgba(91,151,255,.52)}.footer-column a{color:#a1b1c9;font-size:11px}.newsletter{padding:20px 21px 22px;border:1px solid rgba(119,166,248,.34);border-radius:14px;background:linear-gradient(145deg,rgba(22,41,73,.78),rgba(7,14,25,.88));box-shadow:inset 0 1px rgba(193,220,255,.1),0 16px 36px rgba(0,0,0,.19)}.newsletter>p{color:#a7b8d0}.footer-direct-link{width:100%;padding:9px 10px;border:1px solid transparent;border-radius:8px;transition:border-color .22s,background .22s,transform .22s}.footer-direct-link:hover{border-color:rgba(133,180,255,.36);background:rgba(73,124,214,.12);transform:translateX(3px)}.footer-social.topbar-social{margin-top:18px}.footer-bottom{margin-top:70px}.footer-bottom::before{content:"";position:absolute;top:-1px;left:0;width:90px;height:1px;background:#79aaff;box-shadow:0 0 11px rgba(106,163,255,.7)}html[data-theme="light"] .footer{background:radial-gradient(ellipse at 8% 20%,rgba(40,103,228,.13),transparent 31%),radial-gradient(ellipse at 86% 0%,rgba(73,117,210,.08),transparent 28%),linear-gradient(180deg,#FFFFFF 0%,#f2f7ff 100%)!important}html[data-theme="light"] .footer-brand,html[data-theme="light"] .newsletter{border-color:rgba(63,116,204,.2);background:rgba(255,255,255,.78);box-shadow:0 14px 30px rgba(34,78,142,.08)}html[data-theme="light"] .footer-brand p,html[data-theme="light"] .newsletter>p{color:#50647f!important}@media(max-width:1024px){.footer-brand{padding:18px}.newsletter{padding:19px}}@media(max-width:760px){.footer{padding-top:72px}.footer-brand{padding:18px}.footer-column{padding-top:0}.newsletter{padding:18px}.footer-bottom{margin-top:52px}}

/* La marca permanece integrada al footer, sin tarjeta contenedora */
.footer .footer-brand { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }.footer .footer-brand::before { display:none; }
html[data-theme="light"] .footer .footer-brand { border:0; background:transparent; box-shadow:none; }

/* Contacto: panel transparente con borde luminoso */
.footer .newsletter { overflow:hidden; border-color:rgba(128,177,255,.62); background:transparent; box-shadow:inset 0 1px rgba(211,229,255,.13),0 0 0 1px rgba(62,123,231,.1),0 0 26px rgba(50,117,239,.2),0 18px 36px rgba(0,0,0,.16); }.footer .newsletter::before { content:""; position:absolute; inset:-1px; z-index:-1; border-radius:14px; background:radial-gradient(circle at 12% 0%,rgba(91,151,255,.16),transparent 32%); pointer-events:none; }.footer .newsletter:hover { border-color:rgba(170,205,255,.84); box-shadow:inset 0 1px rgba(223,235,255,.2),0 0 0 1px rgba(92,151,255,.18),0 0 34px rgba(63,132,255,.3),0 18px 36px rgba(0,0,0,.16); }html[data-theme="light"] .footer .newsletter { background:transparent; border-color:rgba(53,112,207,.35); box-shadow:0 0 22px rgba(46,111,224,.13); }

/* Buscador de acceso rapido antes del footer */
.footer-search-section { position:relative; overflow:hidden; padding:92px 0 88px; border-top:1px solid rgba(98,149,239,.18); background:linear-gradient(rgba(49,104,197,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(49,104,197,.055) 1px,transparent 1px),radial-gradient(ellipse at 50% 0%,rgba(47,106,221,.16),transparent 52%),#03070d; background-size:74px 74px,74px 74px,auto,auto; }.footer-search-section::before { content:""; position:absolute; top:-115px; left:50%; width:min(75vw,920px); height:210px; border:1px solid rgba(112,162,250,.18); border-radius:50%; transform:translateX(-50%); }.footer-search-content { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; }.footer-search-content .about-kicker { margin:0; }.footer-search-content h2 { margin:17px 0 12px; color:#f3f7ff; font-size:clamp(34px,4vw,56px); line-height:1; letter-spacing:-2.7px; text-transform:uppercase; }.footer-search-content h2 span { color:transparent; background:linear-gradient(100deg,#c2dcff,#6c9afa); -webkit-background-clip:text; background-clip:text; }.footer-search-content > p { max-width:480px; margin:0; color:#94a2b6; font-size:12px; line-height:1.7; }.footer-search-box.hero-search { width:min(100%,540px); margin:30px 0 0; }.footer-search-box .hero-search-main { background:linear-gradient(135deg,rgba(13,24,40,.99),rgba(3,7,13,.99)); }.footer-search-links { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:21px; }.footer-search-links a { padding:7px 10px; border:1px solid rgba(125,167,239,.22); border-radius:999px; color:#9fafc5; background:rgba(49,89,157,.08); font-size:9px; font-weight:700; transition:color .2s,border-color .2s,background .2s; }.footer-search-links a:hover { border-color:rgba(139,184,255,.62); color:#e8f1ff; background:rgba(58,109,195,.22); }html[data-theme="light"] .footer-search-section { background:linear-gradient(rgba(49,104,197,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(49,104,197,.045) 1px,transparent 1px),radial-gradient(ellipse at 50% 0%,rgba(47,106,221,.12),transparent 52%),#FFFFFF !important; background-size:74px 74px,74px 74px,auto,auto; }html[data-theme="light"] .footer-search-content h2 { color:#142d55; }html[data-theme="light"] .footer-search-content > p { color:#61718b !important; }@media(max-width:620px) { .footer-search-section { padding:75px 0 70px; background-size:52px 52px,52px 52px,auto,auto; }.footer-search-content h2 { font-size:37px; letter-spacing:-2px; }.footer-search-box.hero-search { margin-top:25px; }.footer-search-links { gap:7px; } }

/* Buscador integrado al footer: compacto y funcional como acceso rápido */
.footer.footer-search-section { padding:0 0 26px; background:radial-gradient(ellipse at 13% 0%,rgba(40,103,228,.18),transparent 28%),linear-gradient(180deg,#08101d 0%,#04070d 47%,#03060b 100%); }.footer .footer-search-content { display:grid; grid-template-columns:minmax(250px,.86fr) minmax(340px,1.14fr); grid-template-areas:"kicker search" "title search" "copy links"; column-gap:clamp(45px,7vw,120px); align-items:center; padding:40px 0 36px; border-bottom:1px solid rgba(125,170,241,.18); text-align:left; }.footer .footer-search-content .about-kicker { grid-area:kicker; justify-self:start; }.footer .footer-search-content h2 { grid-area:title; margin:10px 0 9px; font-size:clamp(30px,3.05vw,44px); letter-spacing:-2.2px; }.footer .footer-search-content > p { grid-area:copy; max-width:420px; font-size:11px; }.footer .footer-search-box.hero-search { grid-area:search; width:100%; max-width:550px; justify-self:end; margin:0; }.footer .footer-search-links { grid-area:links; justify-content:flex-start; width:100%; max-width:550px; margin:13px 0 0 auto; }.footer .footer-grid--jexora { padding-top:58px; }.footer.footer-search-section::before { top:-190px; right:8%; left:auto; width:560px; height:240px; opacity:.7; transform:none; }.footer.footer-search-section::after { z-index:0; }.footer .footer-grid,.footer .footer-search-content { position:relative; z-index:1; }html[data-theme="light"] .footer.footer-search-section { background:radial-gradient(ellipse at 13% 0%,rgba(40,103,228,.12),transparent 28%),linear-gradient(180deg,#FFFFFF 0%,#f2f7ff 100%) !important; }@media(max-width:760px){.footer .footer-search-content{grid-template-columns:1fr;grid-template-areas:"kicker" "title" "copy" "search" "links";gap:0;padding:48px 0 34px;text-align:center}.footer .footer-search-content .about-kicker{justify-self:center}.footer .footer-search-content h2{margin:12px 0 10px;font-size:35px}.footer .footer-search-content>p{justify-self:center}.footer .footer-search-box.hero-search{margin-top:22px;justify-self:center}.footer .footer-search-links{justify-content:center;margin:14px auto 0}.footer .footer-grid--jexora{padding-top:44px}}

/* Header claro: superficie blanca nítida y navegación más legible. */
html[data-theme="light"] .header {
  background: #fff !important;
  border-bottom: 1px solid rgba(23, 61, 118, .17);
  box-shadow: 0 9px 24px rgba(20, 54, 105, .12);
}
html[data-theme="light"] .topbar {
  background: #f3f7ff !important;
  border-bottom: 1px solid rgba(47, 102, 184, .14);
}
html[data-theme="light"] .nav a {
  color: #001038 !important;
  text-shadow: none;
}
html[data-theme="light"] .nav a:hover,
html[data-theme="light"] .nav a.active {
  color: #001038 !important;
}
html[data-theme="light"] .topbar {
  background: linear-gradient(100deg, #1d579f 0%, #163f7b 48%, #001038 100%) !important;
  border-bottom-color: rgba(10, 37, 78, .42);
}
html[data-theme="light"] .topbar,
html[data-theme="light"] .topbar a,
html[data-theme="light"] .topbar-message {
  color: #FFFFFF !important;
}
html[data-theme="light"] .topbar .topbar-animated-link,
html[data-theme="light"] .topbar .brand-pill {
  border-color: rgba(255, 255, 255, .38);
  background: rgba(255, 255, 255, .13);
  box-shadow: inset 0 1px rgba(255, 255, 255, .18);
}
html[data-theme="light"] .topbar .topbar-animated-link:hover {
  color: #001038 !important;
}
html[data-theme="light"] .topbar .topbar-animated-link:hover .topbar-border-effect {
  border-color: rgba(255, 255, 255, .78);
}
html[data-theme="light"] .topbar-social-btn {
  color: #2b70cf !important;
  background: #fff;
  box-shadow: 0 3px 9px rgba(10, 42, 91, .18);
}
html[data-theme="light"] .topbar-social-btn::before {
  border-color: rgba(35, 92, 174, .14);
  background: #fff !important;
}
html[data-theme="light"] .topbar-social-btn svg,
html[data-theme="light"] .topbar-social-btn svg path {
  fill: #2b70cf !important;
}
html[data-theme="light"] .topbar-social-btn:hover {
  color: #fff !important;
}
html[data-theme="light"] .topbar-social-btn:hover svg,
html[data-theme="light"] .topbar-social-btn:hover svg path {
  fill: #fff !important;
}
html[data-theme="light"] .topbar-social-btn.social-facebook:hover {
  background: linear-gradient(135deg, #2d8cff, #1454c2) !important;
  box-shadow: 0 0 17px rgba(24, 119, 242, .72);
}
html[data-theme="light"] .topbar-social-btn.social-instagram:hover {
  background: linear-gradient(135deg, #833ab4 0%, #fd1d1d 52%, #fcb045 100%) !important;
  box-shadow: 0 0 17px rgba(235, 54, 102, .68);
}
html[data-theme="light"] .topbar-social-btn.social-tiktok:hover {
  background: linear-gradient(135deg, #25f4ee 0%, #111 45%, #fe2c55 100%) !important;
  box-shadow: 0 0 17px rgba(254, 44, 85, .52);
}
html[data-theme="light"] .header .appointment-button:not(:hover) .appointment-arrow {
  fill: #001038;
}
/* Hero de transición en claro: misma energía tecnológica, con contraste real. */
html[data-theme="light"] .hero-next-cta {
  background: radial-gradient(ellipse at 50% 100%, rgba(86, 145, 239, .15), transparent 44%), #FFFFFF !important;
  background-size: auto;
}
html[data-theme="light"] .hero-next-cta::before,
html[data-theme="light"] .hero-next-cta::after {
  opacity: .26;
}
html[data-theme="light"] .hero-next-content h2 {
  color: #001038 !important;
  text-shadow: 0 1px rgba(255, 255, 255, .8);
}
html[data-theme="light"] .hero-next-content h2 span {
  color: #0860F0 !important;
  background: none !important;
  -webkit-text-fill-color: #0860F0 !important;
}
html[data-theme="light"] .hero-next-content p {
  color: #465f84 !important;
}
html[data-theme="light"] .hero-next-kicker {
  border-color: rgba(45, 112, 207, .32);
  color: #3678d5;
  background: rgba(231, 241, 255, .8);
  box-shadow: 0 8px 22px rgba(41, 100, 191, .1);
}
html[data-theme="light"] .hero-next-glow {
  bottom: -165px;
  opacity: .48;
  filter: blur(24px);
}
html[data-theme="light"] .hero-next-primary.primary-action {
  min-width: 228px;
  height: 45px;
  padding: 0 24px;
  border: 0;
  border-radius: 999px;
  position: relative;
  color: #001038 !important;
  background: #9bc2ff;
  box-shadow: 0 9px 20px rgba(55, 119, 213, .18);
  gap: 10px;
  font-size: 11px;
  letter-spacing: .7px;
}
html[data-theme="light"] .hero-next-primary.primary-action svg {
  display: none;
}
html[data-theme="light"] .hero-next-primary.primary-action::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: #1068F8;
}
html[data-theme="light"] .hero-next-primary.primary-action .hero-next-arrow {
  position: static;
  display: inline-block;
  color: #001038;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  transform: translateY(-1px);
}
html[data-theme="light"] .hero-next-primary.primary-action:hover {
  color: #001038 !important;
  background: #1068F8;
  box-shadow: 0 15px 30px rgba(55, 119, 213, .3);
}
html[data-theme="light"] .hero-next-secondary.secondary-action {
  color: #001038 !important;
  background: #fff !important;
  box-shadow: 0 0 0 1px #1068F8, 0 0 18px rgba(126, 174, 255, .16);
}
html[data-theme="light"] .hero-next-secondary.secondary-action .solutions-text,
html[data-theme="light"] .hero-next-secondary.secondary-action .solutions-arrow {
  color: #001038 !important;
  fill: #001038 !important;
}

html[data-theme="light"] .about-shell {
  background: transparent !important;
  border: 0;
  box-shadow: none;
}

/* Testimonios: casos reales con detalle progresivo */
.contact-visual { inset:0; width:100%; height:100%; }.contact-visual img { object-position:center 44%; }.contact-shell::after { background:linear-gradient(90deg,rgba(3,7,13,.98) 0%,rgba(3,7,13,.9) 42%,rgba(3,7,13,.45) 67%,rgba(3,7,13,.12) 100%); }@media(max-width:700px){.contact-visual{inset:auto;position:relative;width:100%;height:310px}.contact-visual img{object-position:center}.contact-shell::after{display:none}}
.contact-showcase > .container { width:100%; max-width:none; }.contact-shell { border-right:0; border-left:0; border-radius:0; }
.contact-showcase { padding-bottom:0; }
@media(min-width:701px){.contact-copy{width:min(52%,650px);padding-left:max(40px,calc((100vw - var(--container))/2));padding-right:0}.contact-form{width:min(52%,650px);margin-left:max(40px,calc((100vw - var(--container))/2))}}

/* Testimonios: casos reales con detalle progresivo */
/* Contacto: composición editorial con persona y formulario superpuesto */
.contact-showcase { padding:120px 0; background:#030609; }.contact-shell { display:block; min-height:660px; overflow:hidden; border-color:rgba(118,168,247,.34); background:#07101d; box-shadow:0 28px 80px rgba(0,0,0,.38); }.contact-shell::after { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(3,7,13,.98) 0%,rgba(3,7,13,.92) 42%,rgba(3,7,13,.24) 69%,rgba(3,7,13,.06) 100%); }.contact-copy { z-index:2; width:55%; padding:63px 52px 0; background:transparent; }.contact-copy h2 { margin:17px 0 18px; font-size:clamp(40px,4vw,59px); }.contact-copy > p { max-width:465px; color:#b0bdcf; }.contact-copy .contact-direct,.contact-copy .contact-orbit-mark { display:none; }.contact-form { position:relative; z-index:2; width:min(55%,650px); margin:27px 0 52px 52px; padding:30px 31px 27px; border-color:rgba(156,191,248,.35); border-radius:10px; background:rgba(8,15,26,.72); box-shadow:0 16px 38px rgba(0,0,0,.25),inset 0 1px rgba(214,229,255,.08); backdrop-filter:blur(13px); }.contact-form-head h3 { font-size:23px; }.contact-fields { gap:10px 12px; }.contact-fields input,.contact-fields select,.contact-fields textarea { background:rgba(3,8,15,.68); }.contact-fields textarea { min-height:78px; }.contact-visual { position:absolute; z-index:0; top:0; right:0; bottom:0; left:auto; display:block; width:53%; min-height:0; max-width:none; overflow:hidden; border:0; border-radius:0; clip-path:none; filter:none; }.contact-visual::before { display:none; }.contact-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,7,13,.72),transparent 48%),linear-gradient(180deg,transparent 52%,rgba(3,7,13,.58)); }.contact-visual img { width:100%; height:100%; object-position:46% center; filter:saturate(.78) brightness(.84); }.contact-visual figcaption { display:none; }html[data-theme="light"] .contact-showcase { background:#FFFFFF !important; }html[data-theme="light"] .contact-shell::after { background:linear-gradient(90deg,rgba(247,250,255,.96),rgba(247,250,255,.82) 45%,rgba(247,250,255,.12) 72%); }html[data-theme="light"] .contact-form { background:rgba(255,255,255,.8) !important; }@media(max-width:900px){.contact-copy{width:64%;padding:52px 38px 0}.contact-form{width:min(64%,620px);margin-left:38px}.contact-visual{width:52%}.contact-shell::after{background:linear-gradient(90deg,rgba(3,7,13,.97),rgba(3,7,13,.85) 49%,rgba(3,7,13,.18) 100%)}}@media(max-width:700px){.contact-shell{min-height:0;display:grid;grid-template-columns:1fr}.contact-visual{position:relative;grid-row:1;grid-column:1;width:100%;height:310px}.contact-visual::after{background:linear-gradient(180deg,rgba(3,7,13,.14),rgba(3,7,13,.86))}.contact-shell::after{display:none}.contact-copy,.contact-form{grid-column:1;width:auto;margin:0}.contact-copy{grid-row:2;padding:42px 25px 18px}.contact-form{grid-row:3;padding:25px 22px 27px;border-radius:0;border-right:0;border-left:0;background:#09111e}.contact-copy h2{font-size:41px}.contact-fields{grid-template-columns:1fr}.contact-fields label{grid-column:auto}.contact-fields .contact-field-wide{grid-column:auto}}

/* Testimonios: casos reales con detalle progresivo */
.site-search-results{position:absolute;z-index:30;top:calc(100% + 11px);right:0;left:0;display:none;overflow:hidden;border:1px solid rgba(124,171,250,.45);border-radius:11px;background:linear-gradient(145deg,rgba(12,23,40,.98),rgba(4,9,17,.98));box-shadow:0 18px 38px rgba(0,0,0,.46),0 0 25px rgba(53,116,231,.15);backdrop-filter:blur(14px)}.site-search-results.is-visible{display:block;animation:site-search-enter .18s ease-out}.site-search-results-title{margin:0;padding:11px 13px 8px;color:#9dbfff;font-size:8px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}.site-search-result{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 13px;border:0;border-top:1px solid rgba(135,173,229,.13);color:#e7efff;background:transparent;text-align:left;cursor:pointer;transition:background .2s,padding .2s}.site-search-result:hover,.site-search-result:focus-visible{padding-left:17px;background:rgba(69,125,222,.18);outline:0}.site-search-result b,.site-search-result small{display:block}.site-search-result b{font-size:10px}.site-search-result small{margin-top:2px;color:#8e9eb4;font-size:9px}.site-search-result i{color:#a7c9ff;font-size:16px;font-style:normal}.site-search-empty{display:block;padding:3px 13px 13px;color:#8899b1;font-size:10px;line-height:1.5}@keyframes site-search-enter{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}html[data-theme="light"] .site-search-results{border-color:rgba(57,112,204,.28);background:rgba(255,255,255,.97);box-shadow:0 16px 32px rgba(25,66,132,.15)}html[data-theme="light"] .site-search-result{color:#1c385f}html[data-theme="light"] .site-search-result small,html[data-theme="light"] .site-search-empty{color:#61718b}@media(max-width:620px){.site-search-results{top:calc(100% + 8px)}.site-search-result{padding:10px 12px}}
.hero-content > .hero-search { z-index: 20; }
.site-search-results { border-color:rgba(121,167,240,.32); border-radius:8px; background:#030507; box-shadow:0 12px 26px rgba(0,0,0,.38); }.site-search-results-title { padding:10px 12px 7px; color:#a9c4f4; font-size:7px; }.site-search-result { gap:10px; padding:9px 12px; border-top-color:rgba(132,166,215,.12); }.site-search-result:hover,.site-search-result:focus-visible { padding-left:12px; background:rgba(70,113,181,.12); }.site-search-result b { color:#e8f0ff; font-size:9px; }.site-search-result small { color:#718198; font-size:8px; }.site-search-result i { color:#a7c4ef; font-size:13px; }.site-search-empty { padding:3px 12px 12px; color:#718198; font-size:9px; }
.footer .footer-search-content { z-index: 20; }.footer .footer-grid { z-index: 1; }
.footer.footer-search-section { background-image:linear-gradient(90deg,rgba(1,4,9,.93) 0%,rgba(2,6,12,.82) 45%,rgba(1,4,9,.94) 100%),linear-gradient(180deg,rgba(3,8,17,.3),rgba(1,4,8,.78)),url("assets/images/footer/footer-liquid-dark.webp"); background-position:center; background-size:cover; }.footer.footer-search-section::after { position:absolute; z-index:0; inset:0; height:auto; background:linear-gradient(180deg,rgba(90,145,239,.1),transparent 16%,rgba(0,0,0,.22) 100%); box-shadow:none; pointer-events:none; }.footer.footer-search-section .footer-search-content,.footer.footer-search-section .footer-grid { text-shadow:0 1px 10px rgba(0,0,0,.72); }
.footer.footer-search-section { background-image:linear-gradient(90deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.76) 47%,rgba(0,0,0,.91) 100%),linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.68)),url("assets/images/footer/footer-liquid-dark.webp"); background-position:center 42%; }.footer.footer-search-section::before { display:none; }.footer.footer-search-section::after { background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 22%,rgba(0,0,0,.34) 100%); }
.footer.footer-search-section { background-image:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.54) 47%,rgba(0,0,0,.83) 100%),linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.47)),url("assets/images/footer/footer-liquid-dark.webp"); }
.footer .footer-search-content h2 { color:#f3f5fa; font-size:clamp(34px,3.15vw,46px); font-weight:800; line-height:1.02; letter-spacing:-2.7px; }.footer .footer-search-content h2 span { display:block; color:#78a4f7; background:none; -webkit-text-fill-color:#78a4f7; }

/* Alineación final del contenido sobre el fondo panorámico de contacto */
.contact-showcase { padding-bottom:0; }@media(min-width:701px){.contact-copy{width:min(45vw,650px);padding:63px 0 0 max(42px,calc((100vw - 1400px)/2));}.contact-form{width:min(45vw,650px);margin:27px 0 52px max(42px,calc((100vw - 1400px)/2));}}
.contact-shell { border:0; }.contact-shell::after { background:linear-gradient(180deg,#001038 0%,rgba(3,3,3,0) 16%,rgba(3,3,3,0) 78%,#001038 100%),linear-gradient(90deg,rgba(3,7,13,.98) 0%,rgba(3,7,13,.9) 42%,rgba(3,7,13,.45) 67%,rgba(3,7,13,.12) 100%); }.footer.footer-search-section { border-top:0; }
.contact-visual{inset:0!important;width:100%!important;height:100%!important}.contact-visual img{object-position:right center!important;filter:saturate(.92) brightness(.94)!important}.contact-shell::after{background:linear-gradient(180deg,#001038 0%,rgba(3,3,3,0) 16%,rgba(3,3,3,0) 78%,#001038 100%),linear-gradient(90deg,rgba(3,7,13,.98) 0%,rgba(3,7,13,.89) 38%,rgba(3,7,13,.38) 64%,rgba(3,7,13,.04) 100%)!important}
@media(max-width:700px){.contact-visual{inset:auto!important;position:relative!important;width:100%!important;height:310px!important}.contact-visual img{object-position:center!important}.contact-shell::after{display:none}}

/* Contacto: estructura editorial de dos columnas */
/* Variante final Jexora: imagen protagonista y formulario editorial */
.contact-shell{display:block!important;min-height:660px!important;background:#07101d!important}.contact-visual{inset:0!important;width:100%!important;height:100%!important;opacity:1!important;mix-blend-mode:normal!important}.contact-visual img{object-position:right center!important;filter:saturate(.9) brightness(.9)!important}.contact-shell::after{background:linear-gradient(180deg,#001038 0%,rgba(3,3,3,0) 17%,rgba(3,3,3,0) 78%,#001038 100%),linear-gradient(90deg,rgba(3,7,13,.98) 0%,rgba(3,7,13,.9) 41%,rgba(3,7,13,.4) 65%,rgba(3,7,13,.04) 100%)!important}.contact-copy{width:min(45vw,650px)!important;padding:63px 0 0 max(42px,calc((100vw - 1400px)/2))!important;border:0!important;background:transparent!important}.contact-copy .contact-direct,.contact-copy .contact-orbit-mark{display:none!important}.contact-form{position:relative!important;z-index:2!important;width:min(45vw,650px)!important;margin:27px 0 52px max(42px,calc((100vw - 1400px)/2))!important;padding:30px 31px 27px!important;border:1px solid rgba(156,191,248,.35)!important;border-radius:10px!important;background:rgba(8,15,26,.72)!important;box-shadow:0 16px 38px rgba(0,0,0,.25),inset 0 1px rgba(214,229,255,.08)!important;backdrop-filter:blur(13px)!important}.contact-form-head h3{font-size:23px!important;letter-spacing:normal!important}.contact-form-head h3::before{display:none!important}.contact-whatsapp{display:none!important}@media(max-width:900px){.contact-copy{width:64%!important;padding:52px 38px 0!important}.contact-form{width:min(64%,620px)!important;margin-left:38px!important}}@media(max-width:700px){.contact-shell{display:grid!important}.contact-visual{inset:auto!important;position:relative!important;width:100%!important;height:310px!important;opacity:1!important}.contact-copy,.contact-form{width:auto!important;margin:0!important}.contact-copy{padding:42px 25px 18px!important}.contact-form{padding:25px 22px 27px!important;border-right:0!important;border-left:0!important;border-radius:0!important}}
.contact-showcase{background:#001038!important}.contact-shell{background:#001038!important}
.contact-visual img{filter:grayscale(.55) saturate(.45) brightness(.88)!important}.contact-shell::after{background:linear-gradient(180deg,#000 0%,rgba(0,0,0,0) 17%,rgba(0,0,0,0) 78%,#000 100%),linear-gradient(90deg,rgba(0,0,0,.98) 0%,rgba(0,0,0,.9) 41%,rgba(0,0,0,.42) 65%,rgba(0,0,0,.04) 100%)!important}
.contact-visual img{filter:grayscale(1) saturate(0) brightness(.78)!important}.contact-visual::after{background:linear-gradient(90deg,rgba(0,0,0,.68),transparent 50%),linear-gradient(180deg,transparent 52%,rgba(0,0,0,.58))!important}
.contact-visual img{filter:none!important}.contact-shell::after{background:rgba(0,0,0,.24)!important}.contact-visual::after{background:rgba(0,0,0,.12)!important}
.contact-shell{background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.18)),url("assets/images/about/contact-consultant-v2.webp") right center/cover no-repeat!important}.contact-visual{display:none!important}.contact-shell::after{background:rgba(0,0,0,.12)!important}
.contact-human-check { position:relative; }
.contact-human-check{display:flex;align-items:center;gap:11px;min-height:54px;margin-top:16px;padding:9px 13px;border:1px solid rgba(139,184,250,.28);border-radius:4px;color:#ecf4ff;background:rgba(5,14,30,.72);cursor:pointer}.contact-human-check input{position:absolute;opacity:0;pointer-events:none}.contact-human-box{display:grid;width:19px;height:19px;place-items:center;border:1px solid rgba(188,214,255,.68);border-radius:2px;background:rgba(7,16,31,.86)}.contact-human-copy{font-size:10px;font-weight:700}.contact-human-copy small{display:block;margin-top:2px;color:#7790b3;font-size:7px;font-weight:600}.contact-human-mark{margin-left:auto;color:#6faeff;font-size:18px;opacity:.28;transition:opacity .2s,transform .2s}.contact-human-check input:checked~.contact-human-box{border-color:#75adff;background:#397ce4}.contact-human-check input:checked~.contact-human-box::after{content:'✓';color:#fff;font-size:13px;font-weight:900}.contact-human-check input:checked~.contact-human-mark{opacity:1;transform:scale(1.08)}
.contact-form-head h3::before { font:800 32px/1.15 Inter,Arial,sans-serif !important; }
.contact-showcase{padding-top:92px;background:#07182f}.contact-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(460px,1fr);min-height:620px;background:#091a32;box-shadow:none}.contact-shell::after{background:linear-gradient(90deg,rgba(7,24,47,.96),rgba(7,24,47,.9) 43%,rgba(7,24,47,.88) 100%)!important}.contact-visual{opacity:.12;mix-blend-mode:screen}.contact-copy{grid-column:1;z-index:2;width:auto;padding:72px clamp(42px,6vw,100px);border-right:1px solid rgba(120,168,244,.17);background:transparent}.contact-copy .about-kicker{color:#69b4ff}.contact-copy h2{max-width:500px;margin:18px 0;color:#f4f7ff;font-size:clamp(42px,4vw,60px);line-height:1.02}.contact-copy>p{max-width:465px;color:#aec4e5;font-size:13px;line-height:1.7}.contact-copy .contact-direct{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:32px;padding:17px 0;border-top:1px solid rgba(141,183,248,.25);border-bottom:1px solid rgba(141,183,248,.25)}.contact-copy .contact-direct a{grid-template-columns:37px 1fr;column-gap:10px}.contact-copy .contact-direct a+a{border-left:1px solid rgba(141,183,248,.2);padding-left:22px}.contact-copy .contact-direct a>span{width:37px;height:37px;border-color:rgba(158,200,255,.5);border-radius:50%;color:#e7f2ff;background:rgba(109,160,235,.2)}.contact-copy .contact-direct small{color:#8cbaf8}.contact-copy .contact-direct strong{color:#dceaff;font-size:11px}.contact-form{grid-column:2;z-index:2;align-self:stretch;width:auto;margin:0;padding:63px clamp(38px,5vw,82px);border:0;border-left:1px solid rgba(120,168,244,.17);border-radius:0;background:rgba(6,15,31,.72);box-shadow:none;backdrop-filter:blur(8px)}.contact-form-head{margin-bottom:20px}.contact-form-head>span{color:#6faeff;font-size:9px}.contact-form-head h3{margin-top:6px;color:#fff;font-size:32px;letter-spacing:-1.4px}.contact-form-head h3::before{content:'Envíanos un mensaje';font:inherit}.contact-form-head h3{font-size:0}.contact-fields{gap:11px 12px}.contact-fields label{color:#eff5ff;font-size:9px;font-weight:700}.contact-fields input,.contact-fields select,.contact-fields textarea{border:1px solid rgba(126,164,229,.18);border-radius:3px;color:#dce8fb;background:rgba(19,5,39,.62)}.contact-fields input:focus,.contact-fields select:focus,.contact-fields textarea:focus{border-color:#5b9bff;box-shadow:0 0 0 2px rgba(82,151,255,.14)}.contact-fields textarea{min-height:92px}.contact-consent{margin-top:15px}.contact-submit{height:45px;margin-top:16px;border-radius:999px;background:linear-gradient(90deg,#2c75e7,#2e80f2);box-shadow:none}.contact-whatsapp{display:none}@media(max-width:900px){.contact-shell{grid-template-columns:1fr}.contact-copy,.contact-form{grid-column:1;border:0}.contact-copy{padding:54px 40px}.contact-form{padding:45px 40px}.contact-visual{opacity:.08}}@media(max-width:700px){.contact-showcase{padding-top:0}.contact-shell{display:block}.contact-copy{padding:48px 25px}.contact-copy .contact-direct{grid-template-columns:1fr;gap:14px}.contact-copy .contact-direct a+a{padding-left:0;border-left:0}.contact-form{padding:37px 25px}.contact-visual{display:none}.contact-copy h2{font-size:42px}.contact-form-head h3{font-size:28px}}

/* Testimonios: casos reales con detalle progresivo */
.testimonials-showcase{position:relative;overflow:hidden;padding:120px 0 112px;background:linear-gradient(rgba(42,98,185,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(42,98,185,.045) 1px,transparent 1px),radial-gradient(circle at 16% 50%,rgba(44,105,226,.13),transparent 28%),#001038;background-size:74px 74px,74px 74px,auto,auto}.testimonials-showcase .container{position:relative;z-index:1}.testimonials-heading{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.65fr);align-items:end;gap:42px;margin-bottom:42px}.testimonials-heading h2{margin:19px 0 0;color:#f5f7fc;font-size:clamp(42px,5.3vw,72px);line-height:.97;letter-spacing:-3.4px;text-transform:uppercase}.testimonials-heading h2 span{color:transparent;background:linear-gradient(100deg,#f7f9ff 2%,#9cc1ff 42%,#5c8ef0 95%);-webkit-background-clip:text;background-clip:text}.testimonials-intro{max-width:370px;justify-self:end;padding-left:18px;border-left:1px solid rgba(112,163,255,.55)}.testimonials-intro p{margin:0;color:#9aa6b8;font-size:13px;line-height:1.8}.testimonials-contact{display:inline-flex;align-items:center;gap:12px;margin-top:23px;padding:11px 15px;border:1px solid rgba(150,188,255,.5);border-radius:8px;color:#eff5ff;background:rgba(74,128,233,.13);font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}.testimonials-contact:hover{color:#fff;background:#3e7bea;box-shadow:0 8px 25px rgba(50,115,240,.32)}.testimonials-grid{display:grid;grid-template-columns:1.25fr .88fr .88fr;gap:12px}.testimonial-project{position:relative;isolation:isolate;min-height:390px;overflow:hidden;border:1px solid rgba(123,159,219,.25);border-radius:15px;background:#08101d;outline:none;transition:filter .35s,border-color .35s,box-shadow .35s}.testimonial-project--featured{min-height:430px}.testimonial-image{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.67) brightness(.52);transition:transform .7s,filter .45s}.testimonial-project:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(3,8,16,.03) 24%,rgba(2,6,13,.58) 67%,rgba(2,5,11,.95) 100%);transition:background .35s}.testimonial-default{position:absolute;right:18px;bottom:17px;left:18px;display:flex;align-items:center;gap:9px;color:#eef4ff;font-size:9px;font-weight:800;letter-spacing:.65px;text-transform:uppercase;transition:opacity .22s,transform .28s}.testimonial-client-logo{width:40px;height:25px;object-fit:contain;object-position:left center;filter:grayscale(1) brightness(2.6)}.testimonial-copy{position:absolute;right:14px;bottom:14px;left:14px;padding:17px;border:1px solid rgba(164,190,237,.24);border-radius:11px;color:#f2f6ff;background:linear-gradient(140deg,rgba(15,27,46,.88),rgba(3,9,18,.93));box-shadow:0 15px 38px rgba(0,0,0,.3);backdrop-filter:blur(12px);opacity:0;transform:translateY(15px);pointer-events:none;transition:opacity .3s,transform .38s}.testimonial-copy-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.testimonial-copy-top span{padding:5px 8px;border:1px solid rgba(131,171,243,.33);border-radius:999px;color:#a9c8ff;font-size:7px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}.testimonial-copy-top b{color:#8caeff;font-size:11px;letter-spacing:1px}.testimonial-copy blockquote{margin:13px 0 16px;color:#f3f6fc;font-size:12px;font-weight:550;line-height:1.62}.testimonial-copy footer{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;padding-top:12px;border-top:1px solid rgba(160,185,226,.18)}.testimonial-footer-logo{width:30px;height:23px;object-fit:contain;filter:grayscale(1) brightness(2.35)}.testimonial-copy footer strong,.testimonial-copy footer small{display:block}.testimonial-copy footer strong{color:#f0f4fc;font-size:8px;text-transform:uppercase}.testimonial-copy footer small{margin-top:3px;color:#8490a3;font-size:8px}.testimonial-copy footer em{color:#9ca8ba;font-size:7px;font-style:normal;text-transform:uppercase;white-space:nowrap}.testimonial-copy footer em i{display:inline-block;width:6px;height:6px;margin-right:3px;border-radius:50%;background:#78a7ff;box-shadow:0 0 8px #78a7ff}.testimonial-project:hover,.testimonial-project:focus-visible{border-color:rgba(119,166,255,.7);box-shadow:0 15px 45px rgba(15,59,141,.22)}.testimonial-project:hover .testimonial-image,.testimonial-project:focus-visible .testimonial-image{filter:saturate(.85) brightness(.72);transform:scale(1.055)}.testimonial-project:hover .testimonial-default,.testimonial-project:focus-visible .testimonial-default{opacity:0;transform:translateY(7px)}.testimonial-project:hover .testimonial-copy,.testimonial-project:focus-visible .testimonial-copy{opacity:1;transform:translateY(0);pointer-events:auto}@media (hover:hover){.testimonials-grid:has(.testimonial-project:hover) .testimonial-project:not(:hover){filter:brightness(.7) saturate(.65)}}@media (max-width:930px){.testimonials-heading{grid-template-columns:1fr;gap:24px}.testimonials-intro{justify-self:start}.testimonials-grid{grid-template-columns:1fr 1fr}.testimonial-project--featured{grid-column:span 2}}@media (max-width:620px){.testimonials-showcase{padding:88px 0;background-size:52px 52px,52px 52px,auto,auto}.testimonials-heading h2{font-size:42px;letter-spacing:-2.4px}.testimonials-heading h2 br{display:none}.testimonials-grid{grid-template-columns:1fr}.testimonial-project,.testimonial-project--featured{grid-column:auto;min-height:390px}.testimonial-copy{padding:15px}}

/* Paleta de títulos para superficies claras: azul profundo + acento azul Jexora. */
html[data-theme="light"] :is(h1, h2, h3, h4, .title) { color:#001038 !important; text-shadow:none; }
html[data-theme="light"] :is(h1, h2, h3, h4, .title) span { color:#0860F0 !important; background:none !important; -webkit-text-fill-color:#0860F0 !important; }
/* El hero principal conserva texto claro porque se superpone a una fotografía oscura. */
html[data-theme="light"] .hero h1,html[data-theme="light"] .hero h1 span { color:#f4f7fd !important; }
html[data-theme="light"] .hero .hero-accent { color:#1068F8 !important; background:linear-gradient(135deg,#FFFFFF 5%,#1068F8 48%,#003998 100%) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; }
/* Estos bloques conservan fondos fotográficos oscuros incluso en modo claro. */
html[data-theme="light"] .footer :is(h1, h2, h3, h4, .title) { color:#f4f7fd !important; }
html[data-theme="light"] .footer :is(h1, h2, h3, h4, .title) span { color:#1068F8 !important; -webkit-text-fill-color:#1068F8 !important; }

/* Rótulo de sección unificado. */
:is(.badge, .hero-next-kicker, .about-kicker) {
  width: max-content;
  min-height: 30px;
  height: auto;
  padding: 0 15px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #a6c7ff;
  border-radius: 999px;
  color: #0860F0;
  background: #eef5ff;
  box-shadow: 0 8px 20px rgba(55, 119, 220, .10);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
}
:is(.badge, .hero-next-kicker, .about-kicker) i {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 50%;
  background: #5b9cff;
  box-shadow: 0 0 8px rgba(91, 156, 255, .68);
}

/* Halo azul más intenso al cierre del bloque de llamada a la acción. */
html[data-theme="light"] .hero-next-cta {
  background: radial-gradient(ellipse at 50% 100%, rgba(38, 112, 255, .29), rgba(89, 151, 255, .12) 42%, transparent 69%), #FFFFFF !important;
}
html[data-theme="light"] .hero-next-glow {
  bottom: -135px;
  opacity: .86;
  background: radial-gradient(ellipse at 50% 100%, rgba(31, 109, 255, .64), rgba(56, 126, 255, .36) 42%, transparent 74%);
  filter: blur(22px);
}
html[data-theme="light"] .about::after {
  display: none;
}

/* Etapas del proceso: superficies claras y legibles, sin la capa oscura. */
html[data-theme="light"] .workflow-step {
  border: 0;
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] .workflow-step::after {
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
html[data-theme="light"] .workflow-step::before {
  background: #438cff;
  opacity: .22;
  filter: blur(34px);
}
html[data-theme="light"] .workflow-step:nth-child(even)::before { background:#5b9cff; }
html[data-theme="light"] .workflow-step:nth-child(3)::before { background:#2f80ed; }
html[data-theme="light"] .workflow-number {
  color: #76a7f5;
  background: none;
  -webkit-text-fill-color: #76a7f5;
  opacity: .92;
}
html[data-theme="light"] .workflow-number::after { background: rgba(87, 143, 232, .48); }
html[data-theme="light"] .workflow-step-copy small { color:#4f8de5; }
html[data-theme="light"] .workflow-step-copy h3 { color:#001038 !important; }
html[data-theme="light"] .workflow-step-copy p { color:#516985; }
html[data-theme="light"] .workflow-step-copy > div span { color:#6680a0; }
html[data-theme="light"] .workflow-step-copy > div span::before { background:#4d90ed; }
html[data-theme="light"] .workflow-step-icon { color:#4d8eea; opacity:1; }

/* La marca debe conservar contraste y acento en la versión clara de Nosotros. */
html[data-theme="light"] .about-copy > p strong {
  color: #2466c7;
  background: linear-gradient(100deg, #174b9b 0%, #0860F0 52%, #235eae 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 1px 8px rgba(55, 123, 220, .16);
}

/* Tarjetas de capacidades: contraste y realce coherentes con la superficie clara. */
html[data-theme="light"] .about-tags span {
  border-color: rgba(58, 126, 229, .38);
  color: #39577d;
  background: linear-gradient(145deg, #ffffff 0%, #eaf3ff 100%);
  box-shadow: 0 8px 20px rgba(32, 96, 185, .09), inset 0 1px rgba(255, 255, 255, .9);
}
html[data-theme="light"] .about-tags i {
  color: #4f91f5;
}
html[data-theme="light"] .about-tags span:hover,
html[data-theme="light"] .about-tags span:focus-visible {
  transform: translateY(-5px);
  border-color: #397ce4;
  color: #123d77;
  background: linear-gradient(145deg, #ffffff 0%, #dcecff 100%);
  box-shadow: 0 15px 28px rgba(30, 91, 177, .18), 0 0 0 3px rgba(76, 143, 245, .13), inset 0 1px #ffffff;
  outline: none;
}
html[data-theme="light"] .about-tags span:hover i,
html[data-theme="light"] .about-tags span:focus-visible i {
  color: #1764ca;
  transform: translateY(-2px) scale(1.06);
}
html[data-theme="light"] .about-tags i {
  transition: color .25s ease, transform .3s cubic-bezier(.23, 1, .32, 1);
}

/* En fondo claro, las imágenes conservan detalle y se separan de la superficie. */
html[data-theme="light"] :is(.about-image-main, .about-image-secondary, .about-image-tertiary) {
  border-color: rgba(65, 132, 231, .5);
  filter: brightness(.72) contrast(1.04) saturate(.96);
  box-shadow: 0 18px 38px rgba(25, 76, 151, .2), 0 4px 12px rgba(21, 51, 96, .14), 0 0 0 5px rgba(100, 161, 250, .08);
}
html[data-theme="light"] :is(.about-image-main, .about-image-secondary, .about-image-tertiary):hover {
  filter: brightness(1.04) contrast(1.06) saturate(1.03);
  border-color: #4f91f5;
  box-shadow: 0 25px 46px rgba(25, 76, 151, .26), 0 0 0 6px rgba(79, 145, 245, .14);
}
html[data-theme="light"] .about-visual-card {
  box-shadow: 0 18px 32px rgba(25, 76, 151, .24), 0 0 0 5px rgba(100, 161, 250, .1);
}

/* Pilares: la variante clara conserva la profundidad visual del modo oscuro. */
html[data-theme="light"] .about-value-card {
  --value-accent: #2879ed;
  border-color: rgba(43, 116, 223, .3);
  background: linear-gradient(145deg, #ffffff 0%, #edf5ff 54%, #e3efff 100%);
  box-shadow: 0 16px 34px rgba(22, 71, 143, .16), inset 0 1px rgba(255, 255, 255, .96);
}
html[data-theme="light"] .about-value-card:nth-of-type(2) { --value-accent: #3a7ded; }
html[data-theme="light"] .about-value-card:nth-of-type(3) { --value-accent: #177fd8; }
html[data-theme="light"] .about-value-card::before {
  background: linear-gradient(120deg, #1761c9 0%, var(--value-accent) 48%, #83bbff 100%);
  opacity: .9;
}
html[data-theme="light"] .about-value-card::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -88px;
  right: -48px;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(76, 146, 248, .25) 0%, rgba(110, 172, 255, .11) 42%, transparent 70%);
  pointer-events: none;
  transition: transform .45s ease, opacity .35s ease;
}
html[data-theme="light"] .about-value-card .about-value-icon {
  color: var(--value-accent);
  background: rgba(255, 255, 255, .42);
  opacity: .38;
}
html[data-theme="light"] .about-value-card > div:last-child > span {
  border-bottom-color: var(--value-accent);
  color: #1b62c5;
  text-shadow: 0 1px 10px rgba(38, 113, 225, .18);
}
html[data-theme="light"] .about-value-card h3 { color: #102f62 !important; }
html[data-theme="light"] .about-value-card :is(p, ul) { color: #3d587d !important; }
html[data-theme="light"] .about-value-card li::before {
  background: var(--value-accent);
  box-shadow: 0 0 9px rgba(40, 121, 237, .55);
}
html[data-theme="light"] .about-value-card:hover,
html[data-theme="light"] .about-value-card:focus-within {
  transform: translateY(-8px) scale(1.012);
  background: linear-gradient(145deg, #ffffff 0%, #e8f3ff 48%, #d9ebff 100%);
  box-shadow: 0 25px 50px rgba(20, 74, 155, .24), 0 0 0 4px rgba(60, 132, 238, .12), inset 0 1px #fff;
}
html[data-theme="light"] .about-value-card:hover::before,
html[data-theme="light"] .about-value-card:focus-within::before {
  opacity: 1;
  filter: drop-shadow(0 0 10px rgba(42, 118, 230, .55));
}
html[data-theme="light"] .about-value-card:hover::after,
html[data-theme="light"] .about-value-card:focus-within::after {
  opacity: 1;
  transform: scale(1.18);
}
html[data-theme="light"] .about-value-card:hover .about-value-icon,
html[data-theme="light"] .about-value-card:focus-within .about-value-icon {
  color: #145fc9;
  opacity: .62;
}

/* Proyectos: fotografía viva con una capa azul editorial para el modo claro. */
html[data-theme="light"] .project-showcase-card {
  border: 1px solid rgba(53, 123, 229, .42) !important;
  border-radius: 15px;
  background: #dcecff !important;
  box-shadow: 0 16px 34px rgba(24, 76, 151, .2), 0 0 0 4px rgba(94, 155, 246, .08) !important;
  transition: transform .35s cubic-bezier(.23, 1, .32, 1), box-shadow .35s ease, border-color .3s ease;
}
html[data-theme="light"] .project-showcase-card::before {
  background:
    linear-gradient(180deg, rgba(218, 238, 255, .04) 15%, rgba(23, 76, 153, .08) 42%, rgba(5, 25, 61, .92) 100%),
    linear-gradient(120deg, rgba(21, 109, 225, .2), transparent 46%);
}
html[data-theme="light"] .project-showcase-card::after {
  height: 3px;
  background: linear-gradient(90deg, #49b8ff 0%, #2979ec 46%, #8bc4ff 100%);
  opacity: .95;
}
html[data-theme="light"] .project-showcase-card > img {
  filter: saturate(1.04) brightness(.94) contrast(1.1);
}
html[data-theme="light"] .project-showcase-card:hover {
  transform: translateY(-8px);
  border-color: #3c8bf4 !important;
  box-shadow: 0 25px 48px rgba(20, 75, 156, .27), 0 0 0 5px rgba(71, 139, 241, .13) !important;
}
html[data-theme="light"] .project-showcase-card:hover > img {
  transform: scale(1.06);
  filter: saturate(1.12) brightness(1.04) contrast(1.08);
}
html[data-theme="light"] .project-showcase-copy small {
  color: #9fd2ff;
  text-shadow: 0 1px 9px rgba(0, 33, 83, .75);
}
html[data-theme="light"] .project-showcase-copy h3 {
  color: #FFFFFF !important;
  text-shadow: 0 3px 16px rgba(0, 20, 56, .74);
}
html[data-theme="light"] .project-showcase-copy p {
  color: #d7e9ff !important;
  text-shadow: 0 2px 10px rgba(0, 25, 65, .7);
}

/* Galería de proceso: luz real en la fotografía y capas azules para el contraste. */
html[data-theme="light"] :is(.workflow-featured, .workflow-mini-grid figure) {
  border-color: rgba(50, 122, 230, .46);
  background: #dcecff;
  box-shadow: 0 17px 38px rgba(21, 74, 153, .2), 0 0 0 4px rgba(84, 150, 245, .08);
}
html[data-theme="light"] .workflow-featured::after,
html[data-theme="light"] .workflow-mini-grid figure::after {
  background:
    linear-gradient(180deg, rgba(237, 247, 255, .02) 20%, rgba(40, 115, 208, .1) 48%, rgba(4, 30, 72, .93) 100%),
    linear-gradient(118deg, rgba(30, 133, 237, .18), transparent 45%);
}
html[data-theme="light"] :is(.workflow-featured img, .workflow-mini-grid img) {
  filter: brightness(.98) contrast(1.07) saturate(1.04);
}
html[data-theme="light"] .workflow-featured:hover img,
html[data-theme="light"] .workflow-mini-grid figure:hover img {
  filter: brightness(1.06) contrast(1.08) saturate(1.1);
}
html[data-theme="light"] .workflow-featured:hover,
html[data-theme="light"] .workflow-mini-grid figure:hover {
  border-color: #4c98ff;
  box-shadow: 0 25px 48px rgba(18, 75, 161, .26), 0 0 0 5px rgba(77, 149, 247, .12);
}
html[data-theme="light"] .workflow-featured figcaption small { color: #9fd2ff; }
html[data-theme="light"] .workflow-featured figcaption strong,
html[data-theme="light"] .workflow-mini-copy strong { color: #FFFFFF !important; text-shadow: 0 3px 16px rgba(0, 22, 58, .78); }
html[data-theme="light"] .workflow-status {
  border-color: rgba(139, 198, 255, .58);
  background: rgba(7, 43, 93, .78);
  box-shadow: 0 8px 22px rgba(5, 49, 115, .24);
}
html[data-theme="light"] .workflow-mini-grid figcaption::before {
  background: radial-gradient(ellipse at 38% 58%, rgba(18, 71, 148, .94) 0%, rgba(6, 35, 83, .82) 45%, transparent 74%);
}
html[data-theme="light"] .workflow-mini-grid figcaption .workflow-mini-icon { color: #a9d6ff; }

/* Etapas del proceso: paneles claros con una columna de acento y jerarquía nítida. */
html[data-theme="light"] .workflow-steps { gap: 12px; }
html[data-theme="light"] .workflow-step {
  min-height: 154px;
  margin: 0;
  padding: 25px 24px;
  overflow: hidden;
  border: 1px solid rgba(56, 125, 227, .25);
  border-radius: 14px;
  background: linear-gradient(100deg, #e8f2ff 0%, #f9fcff 29%, #ffffff 66%, #eef6ff 100%);
  box-shadow: 0 12px 28px rgba(25, 75, 145, .11), inset 0 1px #fff;
  transition: transform .3s cubic-bezier(.23, 1, .32, 1), border-color .3s ease, box-shadow .3s ease;
}
html[data-theme="light"] .workflow-step + .workflow-step { padding-top: 25px; border-top: 1px solid rgba(56, 125, 227, .25); }
html[data-theme="light"] .workflow-step::after {
  z-index: 0;
  inset: 0 auto 0 0;
  width: 23%;
  border-radius: 13px 0 0 13px;
  background: linear-gradient(160deg, rgba(43, 122, 232, .16), rgba(92, 159, 249, .04) 62%, transparent 100%);
  backdrop-filter: none;
}
html[data-theme="light"] .workflow-step::before {
  z-index: 0;
  width: 215px;
  height: 215px;
  background: #4f96f5;
  opacity: .16;
  filter: blur(34px);
}
html[data-theme="light"] .workflow-step > :is(.workflow-number, .workflow-step-copy, .workflow-step-icon) { z-index: 1; }
html[data-theme="light"] .workflow-number {
  color: #2c76d9;
  opacity: 1;
  text-shadow: 0 3px 14px rgba(43, 120, 225, .2);
}
html[data-theme="light"] .workflow-number::after { background: #5d9ff7; }
html[data-theme="light"] .workflow-step-copy small { color: #397fdf; }
html[data-theme="light"] .workflow-step-copy h3 { color: #112f60 !important; text-shadow: none; }
html[data-theme="light"] .workflow-step-copy p { color: #405d82 !important; }
html[data-theme="light"] .workflow-step-copy > div span { color: #597294; }
html[data-theme="light"] .workflow-step-copy > div span::before { background: #468ce9; box-shadow: 0 0 7px rgba(70, 140, 233, .45); }
html[data-theme="light"] .workflow-step-icon { color: #397fdf; opacity: 1; }
html[data-theme="light"] .workflow-step:hover {
  transform: translateX(7px);
  border-color: rgba(45, 121, 230, .62);
  box-shadow: 0 19px 38px rgba(20, 75, 157, .18), 0 0 0 4px rgba(71, 140, 241, .1), inset 0 1px #fff;
}
html[data-theme="light"] .workflow-step:hover .workflow-number { color: #145fc9; background: none; -webkit-text-fill-color: currentColor; transform: translateY(-3px) scale(1.035); }

/* Proceso sin tarjetas: solo contenido y nubes azules en movimiento. */
html[data-theme="light"] .workflow-steps { gap:0; }
html[data-theme="light"] .workflow-step,
html[data-theme="light"] .workflow-step + .workflow-step {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: none;
}
html[data-theme="light"] .workflow-step::after {
  inset: 0;
  width: auto;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
html[data-theme="light"] .workflow-step::before {
  opacity: .22;
  filter: blur(36px);
}
html[data-theme="light"] .workflow-step:hover {
  transform: none;
  border-color: transparent;
  box-shadow: none;
}

/* Fondo geométrico direccional para el proceso. */
html[data-theme="light"] .workflow {
  background: #FFFFFF !important;
}
html[data-theme="light"] .workflow::before { display:none; }
html[data-theme="light"] .workflow::after {
  content:"";
  position:absolute;
  z-index:0;
  inset:0 auto 0 0;
  width:min(940px, 78vw);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 960 760' preserveAspectRatio='none'%3E%3Cpath d='M0 0H112L481 380 112 760H0L369 380Z' fill='%23102b57' fill-opacity='.10'/%3E%3Cpath d='M118 0H240L609 380 240 760H118L487 380Z' fill='%232f80ed' fill-opacity='.10'/%3E%3Cpath d='M248 0H360L729 380 360 760H248L617 380Z' fill='%235b9cff' fill-opacity='.11'/%3E%3Cpath d='M368 0H470L839 380 470 760H368L737 380Z' fill='%2389baff' fill-opacity='.12'/%3E%3Cpath d='M478 0H570L939 380 570 760H478L847 380Z' fill='%23bed9ff' fill-opacity='.18'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:left center;
  background-size:100% 100%;
  opacity:.72;
  pointer-events:none;
}

/* Interacción suave: contorno sutil, esquinas redondeadas y un ligero acercamiento. */
html[data-theme="light"] .workflow-step {
  transition: transform .32s cubic-bezier(.2, .75, .25, 1), border-radius .32s ease, background .32s ease, box-shadow .32s ease;
}
html[data-theme="light"] .workflow-step:hover {
  z-index: 2;
  outline: 0;
  border-radius: 10px;
  background: rgba(235, 245, 255, .42);
  box-shadow: inset 0 0 0 1.5px rgba(40, 127, 232, .72), 0 10px 24px rgba(35, 104, 207, .12);
  transform: scale(1.012);
}

/* Servicios en claro: tarjetas luminosas con jerarquía y contraste definidos. */
html[data-theme="light"] .service-orbit-card {
  border-color: #91b9f3 !important;
  color: #001038;
  background: linear-gradient(155deg, #ffffff 0%, #f2f7ff 52%, #e5f0ff 100%) !important;
  box-shadow: 0 16px 34px rgba(31, 87, 166, .17), inset 0 1px rgba(255, 255, 255, .92);
  backdrop-filter: none;
}
html[data-theme="light"] .service-card-waves {
  background: radial-gradient(circle at 72% 10%, rgba(77, 146, 246, .25), transparent 36%), linear-gradient(155deg, #d3e5ff, #eaf3ff 58%, #dcecff);
}
html[data-theme="light"] .service-card-waves i { background:#f7fbff; }
html[data-theme="light"] .service-card-waves i:nth-child(2) { background:rgba(224, 239, 255, .88); }
html[data-theme="light"] .service-card-waves i:nth-child(3) { background:rgba(196, 220, 252, .58); }
html[data-theme="light"] .service-orbit-media {
  border-color: rgba(65, 132, 229, .45);
  background: #dcecff;
  box-shadow: 0 8px 18px rgba(38, 95, 175, .13);
}
html[data-theme="light"] .service-orbit-media::after { background: linear-gradient(180deg, rgba(255,255,255,0), rgba(11, 55, 121, .18)); }
html[data-theme="light"] .service-orbit-media img { filter: brightness(1.03) saturate(1.04) contrast(1.04); }

/* Las imágenes definen el ambiente de cada servicio; el degradado deja el texto siempre legible. */
.service-orbit-card {
  padding: 146px 18px 20px;
  background:
    linear-gradient(180deg, rgba(3, 10, 22, .04) 0%, rgba(5, 13, 28, .5) 42%, rgba(3, 9, 19, .97) 76%) padding-box,
    var(--service-card-image) var(--service-card-position) / auto 100% no-repeat padding-box,
    linear-gradient(145deg, rgba(177, 207, 255, .72), rgba(67, 126, 235, .2) 48%, rgba(116, 168, 255, .58)) border-box;
}
.service-orbit-card:hover,
.service-orbit-card:focus,
.service-orbit-card.is-oriented {
  background:
    linear-gradient(180deg, rgba(3, 10, 22, .02) 0%, rgba(5, 13, 28, .42) 42%, rgba(3, 9, 19, .95) 76%) padding-box,
    var(--service-card-image) var(--service-card-position) / auto 100% no-repeat padding-box,
    linear-gradient(135deg, #d5e5ff, #6ba2ff 44%, #b4d1ff) border-box;
}
.service-orbit-media { display: none; }
.service-orbit-icon { top: 25px; }
.service-orbit-card small { margin-top: 0; text-align: left; color: #1068F8; }
.service-orbit-card h3 { margin: 8px 0 12px; text-align: left; text-shadow: 0 2px 16px rgba(0, 0, 0, .7); }
.service-orbit-card p { color: #e4ebf7; text-shadow: 0 1px 10px rgba(0, 0, 0, .72); }

html[data-theme="light"] .service-orbit-card,
html[data-theme="light"] .service-orbit-card:hover,
html[data-theme="light"] .service-orbit-card:focus,
html[data-theme="light"] .service-orbit-card.is-oriented {
  background:
    linear-gradient(180deg, rgba(239, 247, 255, .08) 0%, rgba(17, 56, 109, .3) 38%, rgba(7, 31, 70, .9) 78%) padding-box,
    var(--service-card-image) var(--service-card-position) / auto 100% no-repeat padding-box,
    linear-gradient(145deg, #dcecff, #5792e9 52%, #1068F8) border-box !important;
}
html[data-theme="light"] .service-orbit-card small { color: #d5e9ff; }
html[data-theme="light"] .service-orbit-card h3,
html[data-theme="light"] .service-orbit-card p { color: #fff !important; text-shadow: 0 2px 12px rgba(0, 21, 56, .8); }
html[data-theme="light"] .service-orbit-icon {
  border-color: rgba(49, 121, 225, .35);
  color: #fff;
  background: #0860F0;
  box-shadow: 0 8px 20px rgba(46, 117, 218, .28);
}
html[data-theme="light"] .service-orbit-card small { color:#397fdf; }
html[data-theme="light"] .service-orbit-card h3 { color:#001038 !important; text-shadow:none; }
html[data-theme="light"] .service-orbit-card p { color:#4c6687 !important; font-weight:500; }
html[data-theme="light"] .service-orbit-index { color:rgba(43, 113, 214, .25); }
html[data-theme="light"] .service-orbit-card:hover,
html[data-theme="light"] .service-orbit-card:focus,
html[data-theme="light"] .service-orbit-card.is-oriented {
  border-color: #3b86ef !important;
  background:
    linear-gradient(180deg, rgba(239, 247, 255, .03) 0%, rgba(17, 56, 109, .35) 40%, rgba(7, 31, 70, .92) 78%) padding-box,
    var(--service-card-image) var(--service-card-position) / auto 100% no-repeat padding-box,
    linear-gradient(145deg, #dcecff, #5792e9 52%, #1068F8) border-box !important;
  box-shadow: 0 22px 42px rgba(26, 87, 175, .23), 0 0 0 4px rgba(71, 140, 241, .12);
}

/* Velo localizado para que la tipografía original conserve contraste sobre las fotos. */
.service-orbit-card::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 128px;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(2, 13, 34, .12) 0%, rgba(2, 13, 34, .72) 23%, rgba(2, 10, 25, .94) 58%);
  pointer-events: none;
}
html[data-theme="light"] .service-orbit-card :is(small, h3, p) {
  color: #f7fbff !important;
  text-shadow: 0 2px 10px rgba(0, 15, 43, .95) !important;
}
html[data-theme="light"] .service-orbit-card small { color: #b9d6ff !important; }

/* Fondo inmersivo y transiciones de la sección de servicios. */
.services-orbit {
  background:
    url("assets/images/services/services-dark-geometry-v2.webp") center / cover no-repeat;
}
.services-orbit::after {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  background:linear-gradient(180deg, #001038 0%, rgba(3,3,3,.58) 10%, transparent 24%, transparent 77%, rgba(3,3,3,.62) 91%, #001038 100%);
  pointer-events:none;
}
.services-orbit .container { z-index:1; }
html[data-theme="light"] .services-orbit::after {
  background:linear-gradient(180deg,
    #FFFFFF 0%,
    #f5f9ff 6%,
    rgba(232,241,255,.88) 15%,
    rgba(205,223,250,.54) 27%,
    rgba(174,203,244,.18) 40%,
    transparent 52%,
    transparent 66%,
    rgba(174,203,244,.18) 77%,
    rgba(205,223,250,.54) 87%,
    rgba(232,241,255,.88) 95%,
    #FFFFFF 100%);
}
html[data-theme="light"] .services-orbit-heading h2 { color:#f5f9ff !important; text-shadow:0 3px 18px rgba(0, 18, 62, .62); }
html[data-theme="light"] .services-orbit-heading h2 span { color:#9ecaff !important; -webkit-text-fill-color:#9ecaff !important; }
html[data-theme="light"] .services-orbit-heading > p { color:#d9eaff !important; text-shadow:0 2px 12px rgba(0, 18, 62, .62); }

/* Variante clara: ajustes tipográficos sobre la misma escena oscura. */
html[data-theme="light"] .services-orbit::before,
html[data-theme="light"] .services-orbit::after { display:none; }
html[data-theme="light"] .services-orbit-heading h2 {
  color:#001038 !important;
  text-shadow:none;
}
html[data-theme="light"] .services-orbit-heading h2 span {
  color:#0860F0 !important;
  -webkit-text-fill-color:#0860F0 !important;
}
html[data-theme="light"] .services-orbit-heading > p {
  color:#4d6687 !important;
  text-shadow:none;
}

/* Botones de las tarjetas alineados con la llamada a la acción de About. */
html[data-theme="light"] .service-orbit-card a {
  min-height: 46px;
  padding: 0 21px;
  gap: 20px;
  border: 1px solid var(--primary-button-border);
  border-radius: 999px;
  color: var(--primary-button-color);
  background: var(--primary-button-bg);
  box-shadow: var(--primary-button-shadow);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .8px;
  transition: transform .25s ease, box-shadow .25s ease;
}
html[data-theme="light"] .service-orbit-card a:hover,
html[data-theme="light"] .service-orbit-card a:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 17px 36px rgba(73, 133, 255, .32);
}
html[data-theme="light"] .service-orbit-card a span { margin-left:0; font-size:17px; }

/* Fondo limpio con profundidad tecnológica detrás del carrusel. */
html[data-theme="light"] .services-orbit::before {
  display:block;
  z-index:0;
  background:
    radial-gradient(circle at 12% 28%, rgba(50, 124, 233, .16), transparent 19%),
    radial-gradient(circle at 88% 62%, rgba(70, 143, 243, .14), transparent 23%),
    radial-gradient(ellipse at 50% 88%, rgba(98, 164, 255, .16), transparent 36%),
    linear-gradient(rgba(71, 132, 220, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(71, 132, 220, .07) 1px, transparent 1px);
  background-size:auto, auto, auto, 56px 56px, 56px 56px;
  mask-image:none;
  opacity:1;
}
html[data-theme="light"] .services-orbit::after {
  display:block;
  background:radial-gradient(ellipse at 50% 52%, transparent 32%, rgba(74, 140, 235, .08) 68%, transparent 76%);
  opacity:1;
}

/* En claro, se muestra la imagen de fondo sin cuadrícula, velos ni brillos superpuestos. */
html[data-theme="light"] .services-orbit::before,
html[data-theme="light"] .services-orbit::after,
html[data-theme="light"] .services-neural-canvas,
html[data-theme="light"] .services-orbit-stage::before {
  display: none !important;
}

/* Servicios mantiene la misma escena oscura en ambos temas. */
html[data-theme="light"] .services-orbit {
  background:
    url("assets/images/services/services-dark-geometry-v2.webp") center / cover no-repeat !important;
}
html[data-theme="light"] .services-orbit::before {
  display: block !important;
  background-image: linear-gradient(rgba(93, 142, 224, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(93, 142, 224, .035) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
}
html[data-theme="light"] .services-orbit::after {
  display: block !important;
  background: linear-gradient(180deg, #001038 0%, rgba(3,3,3,.58) 10%, transparent 24%, transparent 77%, rgba(3,3,3,.62) 91%, #001038 100%);
}
html[data-theme="light"] .services-neural-canvas,
html[data-theme="light"] .services-orbit-stage::before { display: block !important; }

/* El arte geométrico ya incluye sus propias líneas y brillos. */
.services-orbit::before,
.services-orbit::after { display: none; }
html[data-theme="light"] .services-orbit::before,
html[data-theme="light"] .services-orbit::after { display: none !important; }
html[data-theme="light"] .services-orbit-heading h2 {
  color: #f1f4fa !important;
  text-shadow: none;
}
html[data-theme="light"] .services-orbit-heading h2 span {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background: linear-gradient(100deg, #f4f7fc 0%, #98bcff 48%, #568bea 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
html[data-theme="light"] .services-orbit-heading > p {
  color: #9099a7 !important;
  text-shadow: none;
}

/* Rótulo de Servicios: neón transparente, como los indicadores del hero. */
.services-orbit-heading .about-kicker {
  border-color: rgba(120, 177, 255, .82);
  color: #a9ccff;
  background: transparent !important;
  box-shadow: 0 0 8px rgba(73, 143, 255, .55), 0 0 20px rgba(73, 143, 255, .22), inset 0 0 10px rgba(73, 143, 255, .08);
  text-shadow: 0 0 8px rgba(121, 180, 255, .75);
}
.services-orbit-heading .about-kicker i {
  background: #78b1ff;
  box-shadow: 0 0 7px #78b1ff, 0 0 14px rgba(97, 164, 255, .9);
}

/* Mismo cromatismo del título hero, con la segunda línea siempre visible. */
.services-orbit-heading h2.chromatic {
  text-shadow: -1px 0 rgba(74, 145, 255, .95), 1px 0 rgba(255, 96, 74, .58);
}
.services-orbit-heading h2.chromatic span {
  display: block;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background: linear-gradient(135deg, #FFFFFF 5%, #1068F8 48%, #003998 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  text-shadow: none;
}

/* Clientes en modo claro: órbitas visibles y logotipos integrados. */
html[data-theme="light"] .clients-solar {
  background:
    radial-gradient(ellipse at 62% 50%, rgba(64, 137, 238, .16), transparent 31%),
    radial-gradient(circle at 15% 20%, rgba(91, 160, 255, .12), transparent 24%),
    #FFFFFF !important;
}
html[data-theme="light"] .clients-solar-heading h2 { color:#001038 !important; text-shadow:none; }
html[data-theme="light"] .clients-solar-heading h2 span { color:#0860F0 !important; -webkit-text-fill-color:#0860F0 !important; }
html[data-theme="light"] .clients-solar-heading p { color:#526b8a !important; }
html[data-theme="light"] .clients-solar-system {
  filter:none;
}
html[data-theme="light"] .orbit-outer {
  border-color: rgba(43, 126, 230, .62);
  box-shadow: 0 0 22px rgba(56, 136, 237, .16), inset 0 0 26px rgba(67, 144, 240, .08);
}
html[data-theme="light"] .orbit-inner {
  border-color: rgba(73, 126, 227, .5);
  box-shadow: 0 0 18px rgba(75, 132, 232, .12), inset 0 0 18px rgba(75, 132, 232, .06);
}
html[data-theme="light"] .clients-solar-system > .client-logo {
  overflow:hidden;
  border:1px solid rgba(61, 128, 221, .22);
  border-radius:12px;
  background:rgba(255,255,255,.9) !important;
  box-shadow:0 9px 22px rgba(31, 86, 160, .13), inset 0 1px rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
}
html[data-theme="light"] .clients-solar-system > .client-logo img {
  filter:grayscale(1) contrast(1.12);
  mix-blend-mode:multiply;
  opacity:.82;
}
html[data-theme="light"] .clients-solar-system > .client-logo:hover {
  border-color:rgba(43, 125, 231, .68);
  background:#fff !important;
  box-shadow:0 14px 30px rgba(30, 92, 179, .2), 0 0 0 4px rgba(73, 144, 241, .11);
}
html[data-theme="light"] .clients-solar-system > .client-logo:hover img {
  filter:grayscale(0) contrast(1.05);
  mix-blend-mode:normal;
  opacity:1;
}

/* Logotipos flotantes, sin placas blancas y con radiación azul. */
html[data-theme="light"] .clients-solar-system > .client-logo {
  isolation:isolate;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent !important;
  box-shadow:none;
  backdrop-filter:none;
}
html[data-theme="light"] .clients-solar-system > .client-logo::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-20px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(57, 133, 239, .35) 0%, rgba(91, 160, 255, .15) 40%, transparent 72%);
  filter:blur(8px);
  opacity:.8;
  transition:opacity .3s ease, transform .3s ease;
}
html[data-theme="light"] .clients-solar-system > .client-logo img {
  mix-blend-mode:multiply;
  filter:grayscale(1) contrast(1.18);
}
html[data-theme="light"] .clients-solar-system > .client-logo:hover {
  border:0;
  background:transparent !important;
  box-shadow:none;
}
html[data-theme="light"] .clients-solar-system > .client-logo:hover::before {
  opacity:1;
  transform:scale(1.18);
}

/* Clientes conserva una atmósfera nocturna, también desde el modo claro global. */
html[data-theme="light"] .clients-solar {
  color:#edf5ff !important;
  background:
    radial-gradient(ellipse at 62% 50%, rgba(32, 104, 220, .24), transparent 34%),
    radial-gradient(circle at 16% 24%, rgba(60, 137, 246, .12), transparent 23%),
    linear-gradient(115deg, #020711 0%, #06142c 55%, #020813 100%) !important;
}
html[data-theme="light"] .clients-solar-heading h2 { color:#f3f7ff !important; text-shadow:0 3px 18px rgba(0,0,0,.48); }
html[data-theme="light"] .clients-solar-heading h2 span { color:#82b5ff !important; -webkit-text-fill-color:#82b5ff !important; }
html[data-theme="light"] .clients-solar-heading p { color:#a8bfdf !important; }
html[data-theme="light"] .clients-solar-system > .client-logo img {
  filter:grayscale(1) brightness(0) invert(1);
  mix-blend-mode:screen;
  opacity:.95;
}
html[data-theme="light"] .clients-solar-system > .client-logo:hover img {
  filter:grayscale(1) brightness(0) invert(1);
  mix-blend-mode:screen;
}
html[data-theme="light"] .clients-solar-system > .client-logo::before {
  background:radial-gradient(circle, rgba(47, 137, 255, .46) 0%, rgba(40, 105, 232, .2) 42%, transparent 74%);
}

/* Nebulosa original con velos oscuros para preservar la lectura. */
html[data-theme="light"] .clients-solar {
  background:
    linear-gradient(90deg, rgba(2, 7, 17, .95) 0%, rgba(3, 11, 29, .84) 43%, rgba(3, 15, 42, .48) 100%),
    linear-gradient(180deg, rgba(1, 5, 14, .12), rgba(1, 5, 14, .28)),
    url("assets/images/clients/clients-nebula-background.webp") center / cover no-repeat !important;
}

/* Rótulo de clientes con acabado neón, sin placa de fondo. */
.clients-solar .about-kicker {
  border-color: rgba(105, 174, 255, .88);
  color: #82b6ff;
  background: transparent;
  box-shadow: 0 0 10px rgba(53, 139, 255, .42), inset 0 0 9px rgba(54, 142, 255, .1);
  text-shadow: 0 0 8px rgba(110, 177, 255, .68);
}
.clients-solar .about-kicker i {
  background: #79b3ff;
  box-shadow: 0 0 9px #62a5ff, 0 0 17px rgba(56, 144, 255, .85);
}

/* Testimonios: composición clara, editorial y con contraste consistente. */
html[data-theme="light"] .testimonials-showcase {
  background:
    radial-gradient(circle at 12% 52%, rgba(57, 125, 226, .13), transparent 24%),
    radial-gradient(circle at 84% 20%, rgba(95, 163, 255, .12), transparent 22%),
    linear-gradient(rgba(65, 124, 213, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(65, 124, 213, .055) 1px, transparent 1px),
    #FFFFFF !important;
  background-size:auto, auto, 58px 58px, 58px 58px, auto;
}
html[data-theme="light"] .testimonials-heading h2 {
  color:#001038 !important;
  text-shadow:none;
}
html[data-theme="light"] .testimonials-heading h2 span {
  color:#0860F0 !important;
  -webkit-text-fill-color:#0860F0 !important;
}
html[data-theme="light"] .testimonials-intro {
  padding:18px 0 18px 20px;
  border-left:2px solid #5b9cff;
}
html[data-theme="light"] .testimonials-intro p { color:#4c6688 !important; }
html[data-theme="light"] .testimonials-contact {
  border-color:#79adff;
  color:#001038;
  background:linear-gradient(180deg, #c7ddff, #1068F8);
  box-shadow:0 9px 22px rgba(45, 111, 211, .18);
}
html[data-theme="light"] .testimonial-project {
  border-color:rgba(47, 113, 205, .3) !important;
  background:#dcecff !important;
  box-shadow:0 14px 30px rgba(31, 84, 157, .13) !important;
}
html[data-theme="light"] .testimonial-project::after {
  opacity:1;
  background:linear-gradient(180deg, rgba(5, 23, 54, .04) 25%, rgba(5, 25, 61, .34) 62%, rgba(4, 19, 47, .88) 100%) !important;
}
html[data-theme="light"] .testimonial-image { filter:saturate(.88) brightness(.82) contrast(1.04); }
html[data-theme="light"] .testimonial-project:hover .testimonial-image,
html[data-theme="light"] .testimonial-project:focus-visible .testimonial-image { filter:saturate(1) brightness(.96) contrast(1.05); }
html[data-theme="light"] .testimonial-copy {
  padding:17px 18px 16px 20px;
  border:1px solid rgba(161, 201, 255, .42);
  border-radius:12px;
  background:linear-gradient(145deg, rgba(8, 35, 79, .92), rgba(4, 21, 52, .94)) !important;
  box-shadow:0 14px 30px rgba(6, 34, 80, .26);
  backdrop-filter:blur(12px);
}
html[data-theme="light"] .testimonial-copy::before { background:linear-gradient(transparent, #82b5ff 20%, #82b5ff 80%, transparent); }
html[data-theme="light"] .testimonial-copy blockquote,
html[data-theme="light"] .testimonial-copy footer strong { color:#f5f9ff !important; text-shadow:none; }
html[data-theme="light"] .testimonial-copy footer small { color:#b9d1f4 !important; }
html[data-theme="light"] .testimonial-copy-top span { color:#9ec5ff; }
html[data-theme="light"] .testimonial-copy-top b { color:#a9cdff; }
html[data-theme="light"] .testimonial-project:hover,
html[data-theme="light"] .testimonial-project:focus-visible {
  border-color:#4b94f5 !important;
  box-shadow:0 20px 40px rgba(26, 88, 178, .22), 0 0 0 4px rgba(77, 148, 245, .1) !important;
}

/* Título de testimonios con la misma jerarquía cromática de Servicios. */
html[data-theme="light"] .testimonials-heading h2,
html[data-theme="light"] .testimonials-heading h2 span {
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  text-shadow:none !important;
}
html[data-theme="light"] .testimonials-heading h2 {
  color:#001038 !important;
  -webkit-text-fill-color:#001038 !important;
}
html[data-theme="light"] .testimonials-heading h2 span {
  display:block;
  color:#0860F0 !important;
  opacity:1;
  filter:none;
  text-shadow:none !important;
  -webkit-text-fill-color:#0860F0 !important;
}

/* El CTA hereda directamente el componente compartido de About. */
.testimonials-contact.about-button.primary-action {
  margin-top:23px;
  gap:20px;
  padding:0 21px;
  border-color:var(--primary-button-border);
  border-radius:999px;
  color:var(--primary-button-color);
  background:var(--primary-button-bg);
  box-shadow:var(--primary-button-shadow);
}
.testimonials-contact.about-button.primary-action:hover { background:var(--primary-button-bg); }

/* Sistema único de botones: primario sólido y secundario transparente. */
:is(.primary-action, .about-button, .testimonials-contact, .contact-submit, .service-orbit-card a) {
  min-height:46px;
  padding:0 21px;
  align-items:center;
  justify-content:center;
  gap:20px;
  border:1px solid var(--primary-button-border) !important;
  border-radius:999px !important;
  color:var(--primary-button-color) !important;
  background:var(--primary-button-bg) !important;
  box-shadow:var(--primary-button-shadow) !important;
  font-size:10px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
:is(.primary-action, .about-button, .testimonials-contact, .contact-submit, .service-orbit-card a):hover,
:is(.primary-action, .about-button, .testimonials-contact, .contact-submit, .service-orbit-card a):focus-visible {
  transform:translateY(-3px);
  box-shadow:0 17px 36px rgba(73, 133, 255, .32) !important;
  filter:brightness(1.05);
}
:is(.secondary-action, .appointment-button, .button-outline) {
  min-height:46px;
  padding:0 21px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  border:1px solid #78abff !important;
  border-radius:999px !important;
  color:#0860F0 !important;
  background:transparent !important;
  box-shadow:0 0 0 1px rgba(120, 171, 255, .12), 0 8px 20px rgba(52, 118, 220, .08) !important;
  font-size:10px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
  transition:transform .25s ease, color .25s ease, background .25s ease, box-shadow .25s ease;
}
:is(.secondary-action, .appointment-button, .button-outline):hover,
:is(.secondary-action, .appointment-button, .button-outline):focus-visible {
  color:#001038 !important;
  background:#9bc2ff !important;
  box-shadow:0 14px 30px rgba(55, 119, 213, .24) !important;
  transform:translateY(-3px);
}
html:not([data-theme="light"]) :is(.secondary-action, .appointment-button, .button-outline) { color:#cfe2ff !important; }

/* Testimonios: imagen protagonista y comentario editorial, no una tarjeta opaca. */
html[data-theme="light"] .testimonial-project::after {
  background:linear-gradient(180deg, rgba(5, 26, 61, .02) 28%, rgba(5, 26, 61, .16) 59%, rgba(4, 20, 49, .68) 100%) !important;
}
html[data-theme="light"] .testimonial-image,
html[data-theme="light"] .testimonials-showcase .testimonial-project:not(.is-active) .testimonial-image {
  filter:saturate(.96) brightness(.98) contrast(1.04) !important;
}
html[data-theme="light"] .testimonial-project:hover .testimonial-image,
html[data-theme="light"] .testimonial-project:focus-visible .testimonial-image,
html[data-theme="light"] .testimonials-showcase .testimonial-project.is-active .testimonial-image {
  filter:saturate(1.06) brightness(1.06) contrast(1.05) !important;
}
html[data-theme="light"] .testimonials-showcase .testimonial-copy {
  right:30px;
  bottom:25px;
  left:30px;
  max-width:760px;
  padding:0 0 0 18px;
  border:0;
  border-radius:0;
  background:radial-gradient(ellipse at 28% 50%, rgba(0, 0, 0, .88) 0%, rgba(0, 0, 0, .62) 42%, rgba(0, 0, 0, .2) 68%, transparent 86%) !important;
  box-shadow:none;
  backdrop-filter:none;
}
html[data-theme="light"] .testimonials-showcase .testimonial-copy::before {
  top:1px;
  bottom:1px;
  width:2px;
  background:linear-gradient(transparent, #8bbaff 18%, #8bbaff 82%, transparent);
  box-shadow:0 0 12px rgba(104, 165, 255, .68);
}
html[data-theme="light"] .testimonials-showcase .testimonial-copy blockquote {
  max-width:690px;
  margin:12px 0 15px;
  color:#fff !important;
  font-size:clamp(13px, 1.1vw, 15px);
  font-weight:650;
  line-height:1.5;
  text-shadow:0 2px 14px rgba(0, 15, 42, .9);
}
html[data-theme="light"] .testimonials-showcase .testimonial-copy footer {
  padding-top:10px;
  border-top-color:rgba(207, 226, 255, .38);
}
html[data-theme="light"] .testimonials-showcase .testimonial-copy footer strong { color:#d4e5ff !important; }
html[data-theme="light"] .testimonials-showcase .testimonial-copy footer small { color:#fff !important; }

/* FAQ en modo claro: superficie editorial, acordeones nítidos y visual integrado. */
html[data-theme="light"] .faq { background:radial-gradient(circle at 82% 36%,rgba(74,144,245,.15),transparent 26%),radial-gradient(circle at 8% 82%,rgba(100,166,255,.12),transparent 25%),linear-gradient(rgba(63,123,214,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(63,123,214,.05) 1px,transparent 1px),#FFFFFF!important;background-size:auto,auto,58px 58px,58px 58px,auto; }
html[data-theme="light"] .faq-container { grid-template-columns:minmax(0,1.08fr) minmax(340px,.72fr); width:min(calc(100% - 64px),1360px); align-items:center; gap:clamp(42px,6vw,92px); }
html[data-theme="light"] .faq-copy { padding:0; }html[data-theme="light"] .faq-copy h2 { color:#001038!important; }html[data-theme="light"] .faq-copy h2 span { color:#0860F0!important;-webkit-text-fill-color:#0860F0!important; }html[data-theme="light"] .faq-copy>p { color:#526b8a!important; }
html[data-theme="light"] .faq .faq-list { margin-top:30px; }html[data-theme="light"] .faq .faq-list details { margin:0 0 10px;overflow:hidden;border:1px solid rgba(61,125,218,.18);border-radius:12px;background:rgba(255,255,255,.8);box-shadow:0 8px 22px rgba(32,84,157,.06);transition:border-color .25s ease,box-shadow .25s ease,background .25s ease; }html[data-theme="light"] .faq .faq-list details[open] { border-color:rgba(55,123,222,.54);background:linear-gradient(135deg,#fff,#edf5ff);box-shadow:0 13px 28px rgba(38,98,184,.12); }
html[data-theme="light"] .faq .faq-list summary { min-height:64px;padding:0 17px;color:#18355f!important;font-size:12px; }html[data-theme="light"] .faq .faq-list summary span { width:25px;height:25px;display:grid;place-items:center;border-radius:50%;color:#0860F0;background:#e4efff;font-size:18px;line-height:1; }html[data-theme="light"] .faq .faq-list details[open] summary span { color:#fff;background:#0860F0; }html[data-theme="light"] .faq .faq-list details p { padding:0 54px 17px 17px;color:#5a7290!important;font-size:11px;line-height:1.75; }
html[data-theme="light"] .faq-visual-wrap { min-height:490px; }html[data-theme="light"] .faq-visual-wrap::before,html[data-theme="light"] .faq-visual-wrap::after { display:none; }html[data-theme="light"] .faq-visual { min-height:490px;border:1px solid rgba(58,126,225,.28);border-radius:18px;clip-path:none;background:#dcecff;box-shadow:0 22px 44px rgba(29,83,158,.18);filter:none; }html[data-theme="light"] .faq-visual::before { display:none; }html[data-theme="light"] .faq-visual::after { background:linear-gradient(180deg,rgba(10,46,105,.02),rgba(9,39,91,.12) 54%,rgba(6,28,68,.7)); }html[data-theme="light"] .faq-visual img { filter:saturate(.92) brightness(.96); }html[data-theme="light"] .faq-visual:hover img { filter:saturate(1.04) brightness(1.03); }
@media(max-width:860px){html[data-theme="light"] .faq-container{grid-template-columns:1fr;width:min(calc(100% - 40px),680px)}html[data-theme="light"] .faq-visual-wrap,html[data-theme="light"] .faq-visual{min-height:390px}}

/* Capas de profundidad detrás de la imagen de FAQ. */
html[data-theme="light"] .faq-visual-wrap::before {
  display:block;
  inset:16px -18px -18px 18px;
  clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);
  background:linear-gradient(145deg, rgba(72,143,245,.68), rgba(37,98,194,.34) 58%, rgba(112,177,255,.54));
  box-shadow:0 20px 38px rgba(37,96,183,.2);
}
html[data-theme="light"] .faq-visual-wrap::after {
  display:block;
  inset:31px -31px -31px 33px;
  clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);
  border:1px solid rgba(73,145,245,.42);
  background:rgba(99,159,246,.1);
}

/* La composición visual de FAQ es idéntica a la del modo oscuro. */
html[data-theme="light"] .faq-visual-wrap::before {
  inset:14px -13px -15px 15px;
  clip-path:polygon(15% 0,100% 0,85% 100%,0 100%);
  background:linear-gradient(145deg,rgba(64,125,245,.95),rgba(22,60,153,.8) 56%,rgba(8,26,78,.94));
  box-shadow:0 20px 38px rgba(20,73,207,.34),inset 0 1px rgba(176,213,255,.5);
}
html[data-theme="light"] .faq-visual-wrap::after {
  inset:28px -28px -29px 30px;
  clip-path:polygon(15% 0,100% 0,85% 100%,0 100%);
  border-color:rgba(98,162,255,.42);
  background:rgba(53,108,229,.1);
}
html[data-theme="light"] .faq-visual {
  border:0;
  border-radius:0;
  clip-path:polygon(15% 0,100% 0,85% 100%,0 100%);
  background:#09101d;
  box-shadow:none;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.32));
}
html[data-theme="light"] .faq-visual::before {
  display:block;
  content:"";
  position:absolute;
  z-index:2;
  inset:1px;
  border:1px solid rgba(140,183,255,.68);
  clip-path:polygon(15% 0,100% 0,85% 100%,0 100%);
  pointer-events:none;
}
html[data-theme="light"] .faq-visual::after { z-index:1; background:linear-gradient(180deg,rgba(3,7,13,.04),rgba(3,7,13,.12) 53%,rgba(3,7,13,.86)); }
html[data-theme="light"] .faq-visual img { position:relative;z-index:0;filter:saturate(.73) brightness(.8); }
html[data-theme="light"] .faq-visual:hover img { filter:saturate(.9) brightness(.92); }

/* Acordeones claros con la misma estructura limpia del modo oscuro. */
html[data-theme="light"] .faq .faq-list { margin-top:33px; }
html[data-theme="light"] .faq .faq-list details,
html[data-theme="light"] .faq .faq-list details[open] {
  margin:0;
  overflow:visible;
  border:0;
  border-bottom:1px solid rgba(43,91,166,.28);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
html[data-theme="light"] .faq .faq-list summary {
  min-height:61px;
  padding:0 2px;
  color:#001038 !important;
  font-size:13px;
}
html[data-theme="light"] .faq .faq-list summary span,
html[data-theme="light"] .faq .faq-list details[open] summary span {
  width:auto;
  height:auto;
  display:block;
  border-radius:0;
  color:#0860F0;
  background:transparent;
  font-size:21px;
}
html[data-theme="light"] .faq .faq-list details[open] summary { color:#001038 !important; }
html[data-theme="light"] .faq .faq-list details p {
  max-width:660px;
  padding:0 28px 19px 2px;
  color:#5a6b84 !important;
  font-size:11px;
  line-height:1.75;
}

/* Marcas de agua de preguntas en el fondo de FAQ. */
html[data-theme="light"] .faq::before {
  content:"?";
  position:absolute;
  z-index:0;
  top:8%;
  left:4%;
  color:rgba(55,123,220,.075);
  background:none;
  font-size:190px;
  font-weight:800;
  line-height:1;
  pointer-events:none;
}
html[data-theme="light"] .faq::after {
  content:"?";
  position:absolute;
  z-index:0;
  right:43%;
  bottom:7%;
  color:rgba(55,123,220,.07);
  font-size:210px;
  font-weight:800;
  line-height:1;
  pointer-events:none;
}
html[data-theme="light"] .faq-container { position:relative; z-index:1; }

/* Cabeceras de FAQ con azul plano, sin relieve. */
html[data-theme="light"] .faq .faq-list details { margin-bottom:8px; border-bottom:0; }
html[data-theme="light"] .faq .faq-list summary,
html[data-theme="light"] .faq .faq-list details[open] summary {
  padding:0 17px;
  border-radius:6px;
  color:var(--primary-button-color) !important;
  background:#1068F8;
  box-shadow:none;
  font-weight:800;
}
html[data-theme="light"] .faq .faq-list details[open] summary { background:#1068F8; }
html[data-theme="light"] .faq .faq-list summary span,
html[data-theme="light"] .faq .faq-list details[open] summary span { color:var(--primary-button-color); }
html[data-theme="light"] .faq .faq-list details p { padding-top:14px; }

/* Foto de FAQ más luminosa en modo claro, conservando su composición técnica. */
html[data-theme="light"] .faq-visual::after {
  background:linear-gradient(180deg, rgba(3, 15, 37, .01), rgba(5, 27, 67, .06) 52%, rgba(3, 15, 38, .52));
}
html[data-theme="light"] .faq-visual img {
  filter:saturate(1) brightness(1.02) contrast(1.04);
}
html[data-theme="light"] .faq-visual:hover img {
  filter:saturate(1.08) brightness(1.1) contrast(1.05);
}

/* Respuestas de FAQ con lectura reforzada. */
html[data-theme="light"] .faq .faq-list details p {
  max-width:700px;
  padding:16px 28px 21px 17px;
  color:#405f84 !important;
  font-size:13px;
  font-weight:500;
  line-height:1.8;
}

/* Contacto: variantes aisladas por tema; no hay estilos visuales compartidos. */
/* El contenido de contacto continúa inmediatamente tras el FAQ, sin una franja vacía. */
html[data-theme="dark"] body .contact-showcase {
  padding-top: 0;
  background:#001038 !important;
}
html[data-theme="dark"] body .contact-shell {
  background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.18)),url("assets/images/about/contact-consultant-v2.webp") right center/cover no-repeat !important;
}
html[data-theme="dark"] body .contact-shell::after {
  display:block !important;
  background:linear-gradient(180deg,rgba(0,0,0,.96),rgba(0,0,0,.08) 18%,rgba(0,0,0,.08) 78%,rgba(0,0,0,.96)) !important;
}
html[data-theme="dark"] body .contact-visual { display:none !important; }
html[data-theme="dark"] body .contact-copy h2 { color:#f4f7fd !important; }
html[data-theme="dark"] body .contact-copy h2 span { color:#1068F8 !important; -webkit-text-fill-color:#1068F8 !important; }
html[data-theme="dark"] body .contact-copy > p { color:#b0bdcf !important; }
html[data-theme="dark"] body .contact-form { background:rgba(7,15,27,.72) !important; }
html[data-theme="dark"] body .contact-fields input,
html[data-theme="dark"] body .contact-fields select,
html[data-theme="dark"] body .contact-fields textarea { color:#eaf2ff !important; background:rgba(3,10,20,.54) !important; }

html[data-theme="light"] body .contact-shell {
  background:url("assets/images/about/contact-consultant-light-v1.webp") right center/cover no-repeat !important;
  box-shadow:none !important;
}
html[data-theme="light"] body .contact-shell::after { display:none !important; }
html[data-theme="light"] body .contact-visual { display:none !important; }
html[data-theme="light"] body .contact-copy { background:transparent !important; }
html[data-theme="light"] body .contact-copy .about-kicker {
  color:#286fc7 !important;
  -webkit-text-fill-color:#286fc7 !important;
}
html[data-theme="light"] body .contact-copy h2 {
  color:#001038 !important;
  background:none !important;
  -webkit-text-fill-color:#001038 !important;
  font-size:clamp(42px,5vw,68px) !important;
  font-weight:800 !important;
  line-height:.95 !important;
  letter-spacing:-3.3px !important;
  text-transform:uppercase;
}
html[data-theme="light"] body .contact-copy h2 span {
  display:block;
  color:#0860F0 !important;
  background:none !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  text-shadow:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:#0860F0 !important;
}
html[data-theme="light"] body .contact-copy > p { color:#244b7b !important; font-weight:500 !important; }
html[data-theme="light"] body .contact-form {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:rgba(255,255,255,.56) !important;
  border-color:rgba(255,255,255,.78) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(91,151,231,.12),0 20px 46px rgba(32,83,151,.18) !important;
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
}
html[data-theme="light"] body .contact-form::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.48),rgba(226,240,255,.16) 48%,rgba(255,255,255,.34));
}
html[data-theme="light"] body .contact-form > * { position:relative; z-index:1; }
html[data-theme="light"] body .contact-form-head > span { color:#286fc7 !important; }
html[data-theme="light"] body .contact-form-head h3 { color:#0b2b59 !important; font-size:26px !important; }
html[data-theme="light"] body .contact-form-head h3::before { content:none !important; }
html[data-theme="light"] body .contact-fields label { color:#244b7b !important; font-weight:600 !important; }
html[data-theme="light"] body .contact-fields input,
html[data-theme="light"] body .contact-fields select,
html[data-theme="light"] body .contact-fields textarea { color:#142b4e !important; background:#f4f8ff !important; border-color:rgba(74,136,225,.22) !important; box-shadow:none !important; }
html[data-theme="light"] body .contact-fields input::placeholder,
html[data-theme="light"] body .contact-fields textarea::placeholder { color:#71829b !important; }
html[data-theme="light"] body .contact-human-check {
  border-color:rgba(74,136,225,.28) !important;
  color:#173b6c !important;
  background:rgba(232,242,255,.72) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72) !important;
}
html[data-theme="light"] body .contact-human-box { border-color:#7da8df !important; background:rgba(255,255,255,.7) !important; }
html[data-theme="light"] body .contact-human-copy { color:#173b6c !important; }
html[data-theme="light"] body .contact-human-copy small { color:#607b9f !important; }
html[data-theme="light"] body .contact-human-mark { color:#0860F0 !important; }
html[data-theme="light"] body .contact-consent,
html[data-theme="light"] body .contact-consent span { color:#4c6688 !important; }

/* El cierre de marca conserva la misma identidad nocturna en ambos temas. */
html[data-theme="light"] .footer.footer-search-section {
  color:#edf4ff !important;
  background-image:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.54) 47%,rgba(0,0,0,.83) 100%),linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.47)),url("assets/images/footer/footer-liquid-dark.webp") !important;
  background-position:center 42% !important;
  background-size:cover !important;
}
html[data-theme="light"] .footer.footer-search-section::after { background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 22%,rgba(0,0,0,.34) 100%) !important; }
html[data-theme="light"] .footer .footer-search-content h2,
html[data-theme="light"] .footer .footer-column h3,
html[data-theme="light"] .footer .newsletter h3 { color:#f3f5fa !important; }
html[data-theme="light"] .footer .footer-search-content h2 span { color:#78a4f7 !important; -webkit-text-fill-color:#78a4f7 !important; }
html[data-theme="light"] .footer :is(.footer-search-content > p,.footer-brand p,.newsletter > p,.footer-column a) { color:#9facbf !important; }
html[data-theme="light"] .footer .footer-direct-link small { color:#718199 !important; }
html[data-theme="light"] .footer .footer-direct-link strong { color:#d8e4f5 !important; }
html[data-theme="light"] .footer .newsletter { border-color:rgba(128,177,255,.62) !important; background:transparent !important; box-shadow:inset 0 1px rgba(211,229,255,.13),0 0 26px rgba(50,117,239,.2),0 18px 36px rgba(0,0,0,.16) !important; }
html[data-theme="light"] .footer .footer-bottom,
html[data-theme="light"] .footer .footer-bottom p,
html[data-theme="light"] .footer .footer-bottom div span { color:#7788a2 !important; }
html[data-theme="light"] .footer .footer-bottom a { color:#a8c7f8 !important; }

/* Recorrido de secciones: barra blanca y avance claramente visible. */
.section-path {
  background: #ffffff !important;
  border-color: #d7e5f8;
  box-shadow: 0 12px 30px rgba(8, 38, 86, .24);
}
.section-path::before {
  background: linear-gradient(180deg, #1976ff 0%, #4d9dff 52%, #c8dcf7 100%);
}
.section-path a i {
  border-color: #c5d3e6;
  color: #65758a;
  background: #f4f7fb;
}
.section-path a.is-passed i {
  border-color: #1677ff;
  color: #ffffff;
  background: #1976ff;
  box-shadow: 0 0 0 3px rgba(25, 118, 255, .16), 0 0 14px rgba(25, 118, 255, .62);
}
.section-path a.is-current i {
  border-color: #0b62df;
  color: #ffffff;
  background: #0068ff;
  box-shadow: 0 0 0 5px rgba(0, 104, 255, .2), 0 0 23px rgba(0, 104, 255, .9);
}

/* Modo oscuro: superficie limpia, sin efecto nubloso. */
html[data-theme="dark"] .section-path {
  border-color: rgba(145, 188, 255, .35);
  background: #08111f !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .42);
  backdrop-filter: none;
}
html[data-theme="dark"] .section-path a i {
  border-color: rgba(153, 190, 242, .46);
  color: #c7d9f4;
  background: rgba(7, 17, 34, .58);
}

/* Recorrido de secciones en la zona inferior. */
.section-path {
  top: auto;
  right: auto;
  bottom: 18px;
  left: 50%;
  width: auto;
  height: 52px;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  padding: 8px 12px;
  transform: translateX(-50%);
  transition: opacity .25s ease, visibility .25s ease;
}
.section-path.is-hidden-on-home {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.section-path::before {
  display: none;
}
@media (max-width: 760px) {
  .section-path {
    right: 70px;
    bottom: 13px;
    left: 13px;
    justify-content: space-between;
    gap: 0;
    transform: none;
  }
}

/* Simulador breve de atención por WhatsApp. */
.whatsapp-chat { position:fixed; right:22px; bottom:82px; z-index:1002; font-family:Inter,Arial,sans-serif; }
.whatsapp-chat-toggle { display:flex; align-items:center; gap:8px; min-height:42px; padding:0 14px; border:1px solid rgba(123,192,157,.6); border-radius:999px; color:#fff; background:#168a52; box-shadow:0 10px 24px rgba(0,0,0,.28); font:700 11px/1 inherit; cursor:pointer; }
.whatsapp-chat-toggle span:first-child { font-size:16px; }
.whatsapp-chat-panel { position:absolute; right:0; bottom:52px; display:grid; grid-template-rows:auto minmax(230px,1fr) auto; width:min(350px,calc(100vw - 28px)); height:410px; overflow:hidden; border:1px solid rgba(127,174,241,.34); border-radius:15px; background:#0b1626; box-shadow:0 20px 52px rgba(0,0,0,.46); }
.whatsapp-chat-panel[hidden] { display:none; }
.whatsapp-chat-panel header { display:flex; align-items:center; justify-content:space-between; padding:14px 15px; color:#fff; background:#168a52; }
.whatsapp-chat-panel header strong,.whatsapp-chat-panel header small { display:block; }.whatsapp-chat-panel header strong { font-size:12px; }.whatsapp-chat-panel header small { margin-top:3px; color:#d9f8e8; font-size:9px; }
.whatsapp-chat-close { border:0; color:#fff; background:transparent; font-size:23px; line-height:1; cursor:pointer; }
.whatsapp-chat-messages { display:flex; flex-direction:column; gap:9px; overflow-y:auto; padding:15px; background:linear-gradient(135deg,rgba(20,44,68,.92),rgba(7,18,31,.98)); }
.whatsapp-chat-message { width:fit-content; max-width:86%; margin:0; padding:9px 11px; border-radius:10px; color:#dce9f8; background:rgba(25,42,63,.96); font-size:11px; line-height:1.45; white-space:pre-line; }
.whatsapp-chat-message.is-user { align-self:flex-end; color:#fff; background:#168a52; }.whatsapp-chat-message.is-action { align-self:flex-start; padding:0; background:transparent; }.whatsapp-chat-message.is-action a { display:block; padding:9px 11px; border-radius:9px; color:#fff; background:#168a52; font-size:10px; font-weight:800; text-decoration:none; }
.whatsapp-chat-form { display:flex; gap:8px; padding:11px; border-top:1px solid rgba(145,179,223,.17); background:#0b1626; }.whatsapp-chat-form input { min-width:0; flex:1; border:1px solid rgba(133,169,215,.28); border-radius:8px; outline:0; padding:9px 10px; color:#eef5ff; background:#101f33; font:11px/1.2 inherit; }.whatsapp-chat-form input:focus { border-color:#53a3ff; }.whatsapp-chat-form button { width:34px; border:0; border-radius:8px; color:#fff; background:#168a52; cursor:pointer; }.whatsapp-chat-form button:disabled { opacity:.5; cursor:not-allowed; }
html[data-theme="light"] .whatsapp-chat-panel { border-color:rgba(35,99,184,.22); background:#fff; box-shadow:0 18px 44px rgba(26,70,137,.2); }.whatsapp-chat-messages { background:#edf6ff; }.whatsapp-chat-message.is-bot { color:#193a63; background:#fff; }.whatsapp-chat-form { background:#fff; }.whatsapp-chat-form input { color:#193a63; background:#f5f9ff; }
@media(max-width:760px) { .whatsapp-chat { right:13px; bottom:71px; }.whatsapp-chat-panel { bottom:51px; height:390px; }.whatsapp-chat-toggle { min-height:40px; } }

/* Jack: el lobito que acompaña las consultas de Jexora. */
.whatsapp-chat { bottom:10px; }
.whatsapp-chat-toggle { position:relative; display:grid; width:178px; height:252px; place-items:end center; padding:0; border:0; background:transparent; box-shadow:none; animation:jack-float 4.6s ease-in-out infinite; will-change:transform; touch-action:manipulation; }
.whatsapp-chat-toggle::before,.whatsapp-chat-toggle::after { content:none; }
.jack-floating-bubble { position:absolute; z-index:3; top:35px; left:-116px; display:grid; width:128px; min-height:34px; place-items:center start; padding:10px 13px; border:1px solid rgba(20,48,84,.12); border-radius:14px 14px 4px 14px; color:#17365f; background:rgba(255,255,255,.97); box-shadow:0 12px 30px rgba(4,19,43,.18); text-align:left; animation:jack-bubble-in .38s ease-out both; backdrop-filter:blur(8px); }
.jack-floating-bubble::after { content:""; position:absolute; z-index:-1; right:-6px; bottom:7px; width:13px; height:13px; border-top:1px solid rgba(20,48,84,.10); border-right:1px solid rgba(20,48,84,.10); border-radius:0 3px 0 0; background:#fff; transform:rotate(45deg); }
.jack-bubble-copy,.jack-bubble-typing { grid-area:1/1; }
.jack-bubble-copy { display:block; animation:jack-copy-cycle 6s ease-in-out infinite; }
.jack-bubble-copy strong,.jack-bubble-copy small { display:block; }
.jack-bubble-copy strong { color:#17365f; font:800 11px/1.3 Inter,Arial,sans-serif; letter-spacing:-.1px; }
.jack-bubble-copy small { margin-top:2px; color:#60738d; font:600 9px/1.35 Inter,Arial,sans-serif; }
.jack-bubble-typing { display:flex; align-items:center; gap:4px; min-height:28px; padding-left:2px; animation:jack-typing-cycle 6s ease-in-out infinite; }
.jack-bubble-typing i { width:5px; height:5px; border-radius:50%; background:#3979c6; animation:jack-live-dot .8s ease-in-out infinite; }
.jack-bubble-typing i:nth-child(2) { animation-delay:.13s; }.jack-bubble-typing i:nth-child(3) { animation-delay:.26s; }
.jack-floating-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.jack-avatar { position:relative; z-index:0; display:block; width:39px; height:39px; flex:none; overflow:visible; border:2px solid rgba(220,239,255,.85); border-radius:50%; background:radial-gradient(circle at 50% 65%,#fafcff 0 24%,#323d52 25% 52%,#151c2b 53%); box-shadow:inset 0 -3px 5px rgba(0,0,0,.18),0 3px 9px rgba(0,0,0,.22); }
.jack-avatar::before,.jack-avatar::after { content:""; position:absolute; z-index:0; top:-8px; width:16px; height:20px; border-radius:4px 13px 4px 13px; background:#182132; }
.jack-avatar::before { left:1px; transform:rotate(-25deg); }.jack-avatar::after { right:1px; transform:rotate(25deg) scaleX(-1); }
.jack-avatar:has(img)::before,.jack-avatar:has(img)::after { display:none; }.jack-avatar img { position:absolute; z-index:2; inset:0; display:block; width:100%; height:100%; border-radius:inherit; object-fit:cover; object-position:center; }
.jack-avatar i,.jack-avatar b { position:absolute; z-index:1; top:15px; width:7px; height:7px; border:2px solid #172132; border-radius:50%; background:#7fc9ff; box-shadow:inset 1px 1px #fff; }
.jack-avatar i { left:8px; }.jack-avatar b { right:8px; }.jack-avatar--small { width:31px; height:31px; }.jack-avatar--small i,.jack-avatar--small b { top:11px; width:5px; height:5px; border-width:1px; }.jack-avatar--small i { left:6px; }.jack-avatar--small b { right:6px; }
.jack-avatar--floating { width:168px; height:236px; border:0; border-radius:0; background:transparent; box-shadow:none; transition:transform .22s ease-out,filter .22s ease-out; will-change:transform; }.jack-avatar--floating img { border-radius:0; object-fit:contain; mix-blend-mode:normal; filter:drop-shadow(0 13px 10px rgba(0,0,0,.28)); }.jack-avatar--floating img:only-child { animation:none; }.whatsapp-chat-toggle:hover .jack-avatar--floating,.whatsapp-chat-toggle:focus-visible .jack-avatar--floating { filter:brightness(1.1) saturate(1.14); transform:scale(1.045) rotate(-1.5deg); }.whatsapp-chat-toggle:focus-visible { outline:2px solid #a9d5ff; outline-offset:4px; border-radius:24px; }
.whatsapp-chat-panel { bottom:58px; border-color:rgba(102,163,255,.48); background:#07142b; transform-origin:bottom right; animation:jack-panel-in .18s ease-out; }
.jack-welcome { position:absolute; right:0; bottom:61px; display:grid; width:min(326px,calc(100vw - 28px)); padding:19px 16px 15px; overflow:hidden; border:1px solid rgba(151,197,255,.25); border-radius:28px 28px 28px 9px; color:#edf5ff; background:radial-gradient(circle at 18% 12%,rgba(94,169,255,.24),transparent 32%),linear-gradient(150deg,rgba(22,57,112,.98),rgba(7,20,48,.98)); box-shadow:0 26px 60px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.12); text-align:left; transform-origin:bottom right; animation:jack-panel-in .18s ease-out; }
.jack-welcome::before { content:""; position:absolute; top:-48px; right:-38px; width:142px; height:142px; border:1px solid rgba(157,207,255,.12); border-radius:50%; pointer-events:none; }.jack-welcome::after { content:""; position:absolute; right:21px; bottom:16px; width:50px; height:2px; border-radius:99px; background:linear-gradient(90deg,transparent,rgba(149,204,255,.7),transparent); pointer-events:none; }
.jack-welcome[hidden] { display:none; }.jack-welcome-intro { position:relative; z-index:1; display:flex; align-items:center; gap:12px; padding:3px 26px 16px 3px; }.jack-welcome .jack-avatar--welcome { width:62px; height:62px; flex:none; margin:0; border-width:2px; box-shadow:0 0 0 6px rgba(127,186,255,.10),0 10px 20px rgba(0,0,0,.24); }.jack-welcome strong { display:block; font-size:16px; letter-spacing:-.35px; }.jack-welcome p { margin:4px 0 0; color:#c3d7f5; font-size:10px; line-height:1.45; }.jack-welcome-close { position:absolute; z-index:2; top:12px; right:13px; display:grid; width:25px; height:25px; place-items:center; border:0; border-radius:50%; color:#d8e8ff; background:rgba(255,255,255,.08); font-size:18px; line-height:1; cursor:pointer; transition:background .18s ease,transform .18s ease; }.jack-welcome-close:hover { background:rgba(255,255,255,.16); transform:rotate(90deg); }
.jack-choice { position:relative; z-index:1; display:grid; grid-template-columns:39px 1fr; column-gap:11px; align-items:center; width:100%; margin-top:8px; padding:11px 13px; border:1px solid transparent; border-radius:19px 19px 19px 8px; text-align:left; text-decoration:none; font-family:Inter,Arial,sans-serif; cursor:pointer; transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }.jack-choice:hover,.jack-choice:focus-visible { transform:translateX(3px); box-shadow:0 9px 18px rgba(0,0,0,.16); outline:0; }.jack-choice span { grid-row:span 2; display:grid; width:38px; height:38px; place-items:center; border-radius:50% 50% 50% 12px; color:#fff; background:rgba(255,255,255,.16); }.jack-choice svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }.jack-choice b { color:#fff; font-size:11px; }.jack-choice small { margin-top:2px; color:rgba(255,255,255,.77); font-size:8px; }.jack-choice--whatsapp { border-color:rgba(143,255,197,.24); background:linear-gradient(125deg,rgba(15,158,97,.96),rgba(25,186,111,.9)); }.jack-choice--chat { border-color:rgba(166,203,255,.22); background:rgba(81,121,200,.26); }.jack-choice--chat:hover,.jack-choice--chat:focus-visible { background:rgba(81,121,200,.42); }
@keyframes jack-float { 0%,100% { transform:translate3d(0,0,0) rotate(0); } 45% { transform:translate3d(0,-7px,0) rotate(-1deg); } 68% { transform:translate3d(0,-2px,0) rotate(1deg); } }
@keyframes jack-panel-in { from { opacity:0; transform:translate3d(0,10px,0) scale(.98); } to { opacity:1; transform:translate3d(0,0,0) scale(1); } }
@keyframes jack-typing-dot { 0%,100% { transform:translateY(0); opacity:.42; } 50% { transform:translateY(-3px); opacity:1; } }
@keyframes jack-bubble-in { from { opacity:0; transform:translateY(6px) scale(.96); } to { opacity:1; transform:translateY(0) scale(1); } } @keyframes jack-typing-cycle { 0%,17%,84%,100% { opacity:1; transform:translateY(0); } 23%,78% { opacity:0; transform:translateY(2px); } } @keyframes jack-copy-cycle { 0%,17%,84%,100% { opacity:0; transform:translateY(2px); } 23%,78% { opacity:1; transform:translateY(0); } } @keyframes jack-live-dot { 0%,100% { opacity:.35; transform:translateY(0); } 50% { opacity:1; transform:translateY(-3px); } } @keyframes jack-idle { 0%,43%,100% { opacity:1; } 44%,82% { opacity:0; } } @keyframes jack-gesture { 0%,43%,100% { opacity:0; } 44%,82% { opacity:1; } }
.whatsapp-chat-panel header { gap:9px; padding:12px 14px; background:linear-gradient(110deg,#194fc1,#227ee8); }.whatsapp-chat-panel header .jack-avatar { z-index:0; width:35px; height:35px; }.whatsapp-chat-panel header .jack-avatar i,.whatsapp-chat-panel header .jack-avatar b { top:13px; }.whatsapp-chat-panel header .jack-avatar i { left:7px; }.whatsapp-chat-panel header .jack-avatar b { right:7px; }.whatsapp-chat-panel header div { margin-right:auto; }.whatsapp-chat-panel header small { color:#dcecff; }
.whatsapp-chat-messages { gap:10px; padding:14px; background:radial-gradient(circle at 10% 0,rgba(36,115,233,.25),transparent 38%),linear-gradient(135deg,#101f3b,#071124); }.whatsapp-chat-message { border:1px solid rgba(141,183,244,.16); border-radius:12px 12px 12px 3px; }.whatsapp-chat-message strong { color:#8ac4ff; }.whatsapp-chat-message.is-user { border-color:transparent; border-radius:12px 12px 3px 12px; background:linear-gradient(135deg,#1d70dc,#2856c0); }
.whatsapp-chat-message.is-typing { display:flex; align-items:center; gap:4px; min-width:44px; padding:10px 12px; }.whatsapp-chat-message.is-typing span { width:5px; height:5px; border-radius:50%; background:#9ccaff; animation:jack-typing-dot .8s ease-in-out infinite; }.whatsapp-chat-message.is-typing span:nth-child(2) { animation-delay:.12s; }.whatsapp-chat-message.is-typing span:nth-child(3) { animation-delay:.24s; }
.whatsapp-chat-suggestions { display:flex; flex-wrap:wrap; gap:6px; }.whatsapp-chat-suggestions button { border:1px solid rgba(121,181,255,.42); border-radius:999px; padding:7px 9px; color:#d8eaff; background:rgba(48,105,185,.19); font:700 9px/1 Inter,Arial,sans-serif; cursor:pointer; transition:background .2s,transform .2s; }.whatsapp-chat-suggestions button:hover { background:rgba(67,136,235,.45); transform:translateY(-1px); }
.whatsapp-chat-form { background:#07142b; }.whatsapp-chat-form button,.whatsapp-chat-message.is-action a { background:linear-gradient(135deg,#1f76df,#2856c0); }
html[data-theme="light"] .whatsapp-chat-messages { background:linear-gradient(135deg,#e9f3ff,#f6faff); }.whatsapp-chat-message.is-bot { border-color:rgba(65,124,207,.16); }.whatsapp-chat-form { background:#fff; }
@media(max-width:760px) { .whatsapp-chat { bottom:-4px; }.whatsapp-chat-panel,.jack-welcome { bottom:94px; }.whatsapp-chat-toggle { width:142px; height:204px; }.jack-avatar--floating { width:134px; height:188px; }.jack-floating-bubble { top:27px; left:-120px; width:122px; padding:9px 12px; } }
@media(prefers-reduced-motion:reduce) { .whatsapp-chat-toggle,.jack-floating-bubble,.jack-bubble-copy,.jack-bubble-typing,.jack-bubble-typing i,.whatsapp-chat-panel,.jack-welcome,.whatsapp-chat-message.is-typing span { animation:none; } .jack-bubble-copy { opacity:1; transform:none; }.jack-bubble-typing { display:none; }.jack-avatar--floating { transition:none; } }

/* Dark hero labels: transparent surface with a neon outline. */
html[data-theme="dark"] :is(.badge, .hero-next-kicker, .about-kicker) {
  border-color: rgba(120, 177, 255, .82);
  color: #a9ccff;
  background: transparent;
  box-shadow: 0 0 8px rgba(73, 143, 255, .55), 0 0 20px rgba(73, 143, 255, .22), inset 0 0 10px rgba(73, 143, 255, .08);
  text-shadow: 0 0 8px rgba(121, 180, 255, .75);
}
html[data-theme="dark"] :is(.badge, .hero-next-kicker, .about-kicker) i {
  background: #78b1ff;
  box-shadow: 0 0 7px #78b1ff, 0 0 14px rgba(97, 164, 255, .9);
}

/* Editor del hero: superficie de vidrio tecnológica, estable y discreta. */
/* El rótulo del hero se mantiene igual sobre su fondo fotográfico en ambos temas. */
.hero .badge {
  border-color: rgba(120, 177, 255, .82);
  color: #a9ccff;
  background: transparent;
  box-shadow: 0 0 8px rgba(73, 143, 255, .55), 0 0 20px rgba(73, 143, 255, .22), inset 0 0 10px rgba(73, 143, 255, .08);
  text-shadow: 0 0 8px rgba(121, 180, 255, .75);
}
.hero .badge i {
  background: #78b1ff;
  box-shadow: 0 0 7px #78b1ff, 0 0 14px rgba(97, 164, 255, .9);
}

/* El modo claro no altera el hero: usa la misma paleta y contraste del modo oscuro. */
html[data-theme="light"] .hero {
  color: var(--text) !important;
  background: #020609 !important;
}
html[data-theme="light"] .hero h1 {
  color: var(--text) !important;
}
html[data-theme="light"] .hero .hero-accent {
  color: #1068F8 !important;
  background: linear-gradient(135deg, #FFFFFF 5%, #1068F8 48%, #003998 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
html[data-theme="light"] .hero .hero-slide p {
  color: #a6adb8 !important;
}
html[data-theme="light"] .hero .trust small {
  color: #838b96 !important;
}
html[data-theme="light"] .hero .team-trust small {
  color: #aab9cf !important;
}
html[data-theme="light"] .hero .appointment-button {
  color: #cfe2ff !important;
}

/* Fondo limpio para la sección About en modo claro. */
html[data-theme="light"] .about {
  background:
    linear-gradient(rgba(14, 48, 96, .84), rgba(14, 48, 96, .84)),
    url("assets/images/about/about-team-collaboration-bg-v1.webp") center / cover no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
  background-attachment: scroll !important;
}
html[data-theme="light"] .about::after {
  display: none;
}
html[data-theme="light"] .about-shell {
  background: transparent !important;
  box-shadow: none !important;
}
html[data-theme="light"] .about-values-head :is(h3, p) {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(8, 42, 93, .34);
}
html[data-theme="light"] .about-copy > p,
html[data-theme="light"] .about-copy > p strong {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(8, 42, 93, .34);
}
html[data-theme="light"] .about-copy h2 {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(8, 42, 93, .28);
}
html[data-theme="light"] .about-copy > p strong {
  background: none !important;
  color: #8bb7f5 !important;
  -webkit-text-fill-color: #8bb7f5 !important;
}
html[data-theme="light"] .about-copy h2 span {
  background: none !important;
  color: #8bb7f5 !important;
  -webkit-text-fill-color: #8bb7f5 !important;
}
html[data-theme="light"] .about .about-kicker {
  color: #dcecff !important;
  border-color: rgba(220, 236, 255, .72) !important;
  background: rgba(255, 255, 255, .10) !important;
}
html[data-theme="light"] .about .about-kicker i {
  background: #b9daff !important;
}
html[data-theme="light"] .about-rule {
  background: rgba(219, 237, 255, .62) !important;
}

.values-section {
  position: relative;
  overflow: hidden;
  padding: 108px 0;
  background: #001038;
}
.values-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 46% 130px at 50% 0%, rgba(84,150,255,.13), transparent 74%);
}
.values-section::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: -110px;
  left: 0;
  height: 220px;
  pointer-events: none;
  background: radial-gradient(ellipse 46% 110px at 50% 100%, rgba(84,150,255,.14), rgba(44,91,205,.05) 46%, transparent 74%);
  filter: blur(20px);
}
.values-section .about-values {
  position: relative;
  z-index: 1;
  margin-top: 0;
}
.values-section .about-values-head h3 {
  color: #edf3ff !important;
  text-shadow: none;
}
.values-section .about-values-head p {
  color: #98a8c0 !important;
  text-shadow: none;
}
.values-section .about-kicker {
  border-color: rgba(121,174,255,.42);
  color: #a9ccff;
  background: rgba(25,67,134,.2);
  box-shadow: 0 0 14px rgba(58,129,238,.18);
}
.values-section .about-value-card,
html[data-theme="light"] .values-section .about-value-card {
  border-color: rgba(113,166,244,.28);
  background: linear-gradient(145deg, rgba(8,18,35,.94), rgba(4,11,23,.95)) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.24), inset 0 1px rgba(183,211,255,.06);
}
.values-section .about-value-card h3,
html[data-theme="light"] .values-section .about-value-card h3 { color: #edf3ff !important; }
.values-section .about-value-card :is(p, ul),
html[data-theme="light"] .values-section .about-value-card :is(p, ul) { color: #98a8c0 !important; }
.values-section .about-value-card > div:last-child > span { color: #a9c8ff; }
.values-section .about-value-card .about-value-icon { color: #1068F8; opacity: .16; }

/* Llamada a la acción: fondo de red tecnológica con centro despejado. */
.hero-next-cta,
html[data-theme="light"] .hero-next-cta {
  background:
    linear-gradient(rgba(2, 9, 24, .10), rgba(2, 9, 24, .26)),
         url("assets/images/hero/cta-team-workspace-v1.webp") center / cover no-repeat !important;
}
html[data-theme="light"] .hero-next-content h2 {
  color: #f4f7ff !important;
  text-shadow: 0 3px 18px rgba(0, 0, 0, .48);
}
html[data-theme="light"] .hero-next-content h2 span {
  color: #1068F8 !important;
  -webkit-text-fill-color: #1068F8 !important;
}
html[data-theme="light"] .hero-next-content p {
  color: #c7d9f4 !important;
}
html[data-theme="light"] .hero-next-kicker {
  border-color: rgba(120, 177, 255, .82);
  color: #a9ccff;
  background: transparent;
  box-shadow: 0 0 8px rgba(73, 143, 255, .55), 0 0 20px rgba(73, 143, 255, .22);
}

.hero-code-editor {
  border-color: rgba(128, 174, 235, .34);
  background:
    radial-gradient(ellipse at 14% 4%, rgba(74, 126, 197, .25), transparent 42%),
    radial-gradient(ellipse at 88% 100%, rgba(41, 87, 151, .18), transparent 48%),
    linear-gradient(135deg, rgba(8, 20, 37, .72), rgba(1, 4, 9, .90));
  box-shadow: 0 20px 52px rgba(0, 0, 0, .52), inset 0 1px rgba(220, 237, 255, .07), 0 0 20px rgba(55, 132, 255, .10);
  backdrop-filter: blur(26px) saturate(112%);
  -webkit-backdrop-filter: blur(26px) saturate(112%);
}
.hero-code-editor.is-visible {
  opacity: .98;
  animation: none;
}
.hero-code-editor.is-dismissed {
  opacity: 0;
  transform: translateX(120%) scale(.96);
}
.code-editor-bar {
  background: rgba(4, 9, 17, .76);
  border-bottom-color: rgba(154, 197, 255, .13);
}
.code-editor-body {
  background: linear-gradient(135deg, rgba(86, 133, 196, .045), transparent 58%), rgba(1, 5, 10, .70);
}
.code-terminal {
  background: rgba(1, 4, 8, .72);
}
.code-terminal-title { border-bottom-color: rgba(168, 204, 255, .11); }
.code-cursor {
  opacity: .65;
  animation: none;
}

/* El hero ocupa el alto visible y reduce su composición en pantallas bajas. */
.hero {
  min-height: 100vh;
  min-height: 100svh;
  height: 100vh;
  height: 100svh;
}
.trust { margin-top: clamp(22px, 4.5vh, 48px); }
.tech-carousel {
  position: absolute;
  right: 0;
  bottom: 8px;
  left: 0;
  margin-top: 0;
}

@media (max-height: 850px) and (min-width: 761px) {
  .hero { padding-top: 92px; }
  .grid-bg { inset: 92px 0 0; }
  .hero-content { padding-top: clamp(34px, 5vh, 48px); }
  .hero h1 { margin: 20px 0 14px; font-size: clamp(40px, 4.6vw, 58px); }
  .hero-slide { padding-bottom: 22px; }
  .hero-slide p { font-size: 12px; line-height: 1.58; }
  .hero-search + .hero-buttons { margin-top: 18px; }
  .hero-buttons { margin-top: 20px; }
  .trust { margin-top: 22px; }
  .team-trust { transform: scale(.88); transform-origin: center top; }
  .hero-code-editor { bottom: 78px; transform: translateX(35px) scale(.88); transform-origin: right bottom; }
  .hero-code-editor.is-visible { transform: translateX(0) scale(.88); }
}

@media (max-height: 700px) and (max-width: 760px) {
  .hero { min-height: 100svh; height: 100svh; padding-top: 92px; }
  .hero-content { padding-top: 54px; }
  .hero h1 { margin: 15px 0 11px; font-size: 34px; line-height: .98; letter-spacing: -2px; }
  .hero-slide { padding-bottom: 18px; }
  .hero-slide p { font-size: 11px; line-height: 1.45; }
  .hero-search + .hero-buttons { margin-top: 14px; }
  .hero-buttons { margin-top: 15px; }
  .trust { margin-top: 22px; }
  .team-trust { transform: scale(.76); transform-origin: center top; }
  .tech-carousel { bottom: 2px; }
  .tech-item { min-width: 58px; height: 48px; }
  .tech-item::before { width: 38px; height: 38px; }
  .tech-item img, .stitch-icon { width: 23px; height: 23px; }
}

/* Proporciones finales de marca: encabezado compacto y cierre visible. */
.header .logo-brand-image { width:150px; height:58px; }
.footer .logo-brand-image--footer { width:162px; height:56px; margin:0 0 16px; }
html[data-theme="light"] .header .logo-brand-image { width:148px; height:60px; }
@media (max-width:760px) {
  .header .logo-brand-image { width:124px; height:52px; }
  html[data-theme="light"] .header .logo-brand-image { width:128px; height:54px; }
  .footer .logo-brand-image--footer { width:148px; height:50px; margin-bottom:14px; }
}

/* Base nocturna oficial de Jexora. */
html[data-theme="dark"] body { background:#000; }
html[data-theme="dark"] .header { background:rgba(0,0,0,.96); }
html[data-theme="dark"] :is(.about, .workflow, .projects, .testimonials-showcase, .faq, .contact-showcase) {
  background-color:#000;
}

/* Contornos secundarios en blanco: el azul queda reservado para acciones primarias. */
html[data-theme="dark"] :is(.secondary-action, .appointment-button, .button-outline) {
  border-color:rgba(255,255,255,.82) !important;
  color:#fff !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 8px 20px rgba(255,255,255,.06) !important;
}
html[data-theme="dark"] :is(.secondary-action, .appointment-button, .button-outline):hover,
html[data-theme="dark"] :is(.secondary-action, .appointment-button, .button-outline):focus-visible {
  color:#001038 !important;
  background:#fff !important;
  box-shadow:0 14px 30px rgba(255,255,255,.2) !important;
}
html[data-theme="dark"] :is(.secondary-action, .appointment-button, .button-outline):is(:hover, :focus-visible) :is(.appointment-text, .solutions-text, .appointment-arrow, .solutions-arrow) {
  color:#001038 !important;
  fill:#001038 !important;
  stroke:#001038 !important;
}
html[data-theme="dark"] :is(.appointment-circle, .solutions-circle) {
  background:#fff;
}

/* El título institucional replica el énfasis cromático del hero. */
html[data-theme="dark"] .about-copy h2 {
  color:#fff;
  text-shadow:-1px 0 rgba(16,104,248,.38), 1px 0 rgba(255,255,255,.12);
}
html[data-theme="dark"] .about-copy h2 span {
  color:#1068F8;
  background:linear-gradient(135deg, #fff 5%, #1068F8 48%, #003998 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* Etiquetas técnicas con el azul vibrante de la marca. */
html[data-theme="dark"] :is(.badge, .hero-next-kicker, .about-kicker) {
  border-color:#1068F8;
  color:#fff;
  box-shadow:0 0 8px rgba(16,104,248,.82), 0 0 20px rgba(16,104,248,.34), inset 0 0 10px rgba(16,104,248,.12);
  text-shadow:0 0 8px rgba(16,104,248,.7);
}
html[data-theme="dark"] :is(.badge, .hero-next-kicker, .about-kicker) i {
  background:#1068F8;
  box-shadow:0 0 7px #1068F8, 0 0 14px rgba(16,104,248,.9);
}

/* Rótulo del hero: borde y resplandor azul de marca. */
.hero .badge {
  border-color: #1068F8;
  color: #fff;
  background: rgba(6, 16, 32, .46);
  box-shadow: 0 0 8px rgba(16, 104, 248, .82), 0 0 20px rgba(16, 104, 248, .34), inset 0 0 10px rgba(16, 104, 248, .12);
  text-shadow: 0 0 8px rgba(16, 104, 248, .7);
}
.hero .badge i {
  background: #1068F8;
  box-shadow: 0 0 7px #1068F8, 0 0 14px rgba(16, 104, 248, .9);
}

/* Barra superior: contacto claro, transición blanca e iconos de contorno. */
.topbar .topbar-animated-link {
  color:#fff;
}
.topbar .topbar-border-effect {
  border-color:rgba(255,255,255,.58);
  background:rgba(255,255,255,.08);
}
.topbar .topbar-border-effect::before {
  background:rgba(255,255,255,.14);
  opacity:0;
}
.topbar .topbar-animated-link:hover {
  color:#001038 !important;
  box-shadow:0 0 18px rgba(255,255,255,.32);
}
.topbar .topbar-animated-link:hover .topbar-border-effect {
  background:#fff;
}
.topbar .topbar-animated-link:hover .topbar-border-effect::before {
  background:#fff;
  opacity:1;
}
.topbar .topbar-message {
  color:#fff !important;
  text-shadow:0 0 12px rgba(255,255,255,.28);
}
.topbar .topbar-message::before {
  background:#fff;
  box-shadow:0 0 10px rgba(255,255,255,.95), 0 0 16px rgba(16,104,248,.72);
}
.topbar .topbar-social-btn {
  border:1px solid rgba(255,255,255,.78);
  color:#fff !important;
  background:transparent !important;
  box-shadow:none !important;
}
.topbar .topbar-social-btn::before {
  border:0;
  background:transparent !important;
}
.topbar .topbar-social-btn svg,
.topbar .topbar-social-btn svg path {
  fill:#fff !important;
}
.topbar .brand-pill {
  border-color:#fff;
  color:#fff;
  background:#001038;
}
.topbar .topbar-social-btn.social-facebook:hover {
  background:linear-gradient(135deg,#2d8cff,#1454c2) !important;
  box-shadow:0 0 17px rgba(24,119,242,.72) !important;
}
.topbar .topbar-social-btn.social-instagram:hover {
  background:linear-gradient(135deg,#833ab4 0%,#fd1d1d 52%,#fcb045 100%) !important;
  box-shadow:0 0 17px rgba(235,54,102,.68) !important;
}
.topbar .topbar-social-btn.social-tiktok:hover {
  background:linear-gradient(135deg,#25f4ee 0%,#111 45%,#fe2c55 100%) !important;
  box-shadow:-4px 0 13px rgba(37,244,238,.5),4px 0 13px rgba(254,44,85,.5) !important;
}

/* Header de vidrio nublado al desplazarse. */
.header {
  transition:background-color .35s ease, border-color .35s ease, box-shadow .35s ease, backdrop-filter .35s ease;
}
html[data-theme="dark"] .header:hover {
  border-bottom-color:rgba(255,255,255,.18);
  background:rgba(0,0,0,.58) !important;
  box-shadow:0 10px 30px rgba(0,0,0,.28), inset 0 -1px rgba(255,255,255,.05);
  backdrop-filter:blur(22px) saturate(1.18);
}
html[data-theme="light"] .header:hover {
  border-bottom-color:rgba(0,16,56,.14);
  background:rgba(255,255,255,.62) !important;
  box-shadow:0 10px 30px rgba(0,16,56,.1), inset 0 -1px rgba(255,255,255,.6);
  backdrop-filter:blur(22px) saturate(1.1);
}

/* Transición continua entre la sección About y el hero inferior. */
html[data-theme="dark"] .about {
  background:#000 !important;
  background-size:auto;
  background-attachment:scroll;
}

/* Puente visual: resplandor blanco en los extremos, con centro despejado. */
html[data-theme="dark"] .hero-section-bridge {
  bottom:-96px;
  height:210px;
  border-radius:0;
  background:linear-gradient(90deg,rgba(16,104,248,.48),rgba(16,104,248,.16) 48%,transparent 82%);
  clip-path:polygon(0 20%,100% 0,72% 100%,0 78%);
  filter:blur(18px);
  opacity:.72;
}
html[data-theme="dark"] .hero-section-bridge--right {
  background:linear-gradient(270deg,rgba(16,104,248,.48),rgba(16,104,248,.16) 48%,transparent 82%);
  clip-path:polygon(0 0,100% 20%,100% 78%,28% 100%);
}
html[data-theme="dark"] .about-corner-glow {
  top:-96px;
  height:210px;
  border-radius:0;
  background:linear-gradient(90deg,rgba(16,104,248,.48),rgba(16,104,248,.16) 48%,transparent 82%);
  clip-path:polygon(0 20%,100% 0,72% 100%,0 78%);
  filter:blur(18px);
  opacity:.72;
}
html[data-theme="dark"] .about-corner-glow--right {
  background:linear-gradient(270deg,rgba(16,104,248,.48),rgba(16,104,248,.16) 48%,transparent 82%);
  clip-path:polygon(0 0,100% 20%,100% 78%,28% 100%);
}
html[data-theme="dark"] .hero-about-connector::before {
  background:
    radial-gradient(ellipse 28% 70px at 0% 50%,rgba(16,104,248,.22),transparent 76%),
    radial-gradient(ellipse 28% 70px at 100% 50%,rgba(16,104,248,.22),transparent 76%),
    linear-gradient(90deg,rgba(16,104,248,.14),transparent 27%,transparent 73%,rgba(16,104,248,.14));
}

/* Navegación móvil y topbar compacta. */
.nav-toggle { display:none; }
@media (max-width:760px) {
  .topbar { height:42px; }
  .topbar-inner { width:min(calc(100% - 16px),var(--container)); display:flex; justify-content:center; }
  .topbar-contact { width:100%; justify-content:center; gap:6px; }
  .topbar-contact .topbar-link:nth-child(2) { display:inline-flex; }
  .topbar .topbar-link-text { display:inline; }
  .topbar .topbar-animated-link { height:31px; width:auto; min-width:0; padding:0 9px; border-radius:7px; font-size:9px; }
  .topbar-message, .topbar-social { display:none !important; }

  .navbar { gap:10px; }
  .nav-toggle {
    display:grid;
    order:3;
    width:42px;
    height:42px;
    margin-left:2px;
    padding:0;
    place-content:center;
    gap:5px;
    border:1px solid rgba(255,255,255,.78);
    border-radius:10px;
    color:#fff;
    background:transparent;
    cursor:pointer;
  }
  .nav-toggle span { display:block; width:19px; height:1.5px; border-radius:999px; background:currentColor; transition:transform .25s ease,opacity .2s ease; }
  .nav-toggle[aria-expanded="true"] span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
  .nav {
    position:fixed;
    z-index:60;
    top:92px;
    right:12px;
    display:flex;
    width:min(78vw,290px);
    padding:12px;
    flex-direction:column;
    align-items:stretch;
    gap:3px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:14px;
    background:rgba(0,0,0,.88);
    box-shadow:0 18px 40px rgba(0,0,0,.36);
    backdrop-filter:blur(18px);
    opacity:0;
    pointer-events:none;
    transform:translateX(115%);
    transition:transform .28s ease,opacity .2s ease;
  }
  .nav.is-open { opacity:1; pointer-events:auto; transform:translateX(0); }
  .nav a { padding:13px 14px; border-radius:9px; color:#fff; font-size:11px; text-align:left; }
  .nav a:hover, .nav a:focus-visible { color:#001038; background:#fff; transform:none; }
  .nav-actions { order:2; margin-left:auto; gap:8px; }
}
@media (max-width:700px) { .nav { top:103px; } }
@media (max-width:460px) {
  .topbar .topbar-animated-link { padding:0 7px; font-size:8px; }
  .nav-actions .appointment-button { display:none; }
}

/* Composición móvil: contenido del hero en flujo, sin superposiciones. */
@media (max-width:760px) {
  .topbar { height:40px; }
  .topbar-inner { width:calc(100% - 14px); justify-content:space-between; gap:6px; }
  .topbar-contact { width:auto; flex:0 1 auto; justify-content:flex-start; gap:5px; }
  .topbar .topbar-animated-link { height:30px; padding:0 8px; font-size:8px; letter-spacing:0; }
  .topbar .topbar-animated-link > svg { width:12px; height:12px; }
  .topbar-social { display:flex !important; flex:0 0 auto; gap:5px; }
  .topbar-social-btn { width:25px; height:25px; }
  .topbar-social-btn svg { width:12px; height:12px; }
  .topbar-social-btn::before { width:25px; height:25px; }
  .nav { top:101px; }

  .hero { height:auto; min-height:0; padding-bottom:16px; }
  .hero-content { padding-top:32px; }
  .hero-slide { padding-bottom:16px; }
  .hero h1 { margin:17px 0 13px; font-size:clamp(31px,9.2vw,38px); line-height:.98; letter-spacing:-2.2px; }
  .hero-slide p { max-width:100%; font-size:11.5px; line-height:1.58; }
  .hero-search { width:100%; height:54px; margin-top:18px; }
  .hero-search-main { height:52px; }
  .hero-search + .hero-buttons { margin-top:15px; }
  .hero-buttons { width:auto; margin-top:15px; gap:10px; flex-direction:row; }
  .hero-buttons :is(.button, .appointment-button) { min-width:134px; }
  .team-trust { margin-top:22px; min-width:0; width:100%; padding:10px; gap:10px; }
  .team-trust .avatars { padding-left:10px; }
  .team-trust .avatars img { width:43px; height:43px; margin-left:-11px; }
  .team-trust strong { font-size:10px; }
  .team-trust small { max-width:170px; font-size:8.5px; line-height:1.4; }

  .tech-carousel { position:relative; right:auto; bottom:auto; left:auto; height:54px; margin-top:15px; }
  .tech-group { gap:12px; padding-right:12px; }
  .tech-item { min-width:52px; height:50px; }
  .tech-item::before { width:36px; height:36px; }
  .tech-item img, .stitch-icon { width:23px; height:23px; }
}
@media (max-width:380px) {
  .topbar .topbar-animated-link { padding:0 5px; font-size:7px; }
  .topbar-social-btn { width:22px; height:22px; }
  .hero-buttons :is(.button, .appointment-button) { min-width:122px; }
}

/* Barra de contacto móvil: misma jerarquía del escritorio, sin compresión. */
@media (max-width:760px) {
  .topbar { height:42px; }
  .topbar-inner {
    width:calc(100% - 16px);
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
  }
  .topbar-contact {
    width:auto;
    min-width:0;
    display:flex;
    justify-content:flex-start;
    gap:6px;
  }
  .topbar .topbar-animated-link {
    height:31px;
    min-width:0;
    padding:0 9px;
    gap:6px;
    flex:0 0 auto;
    border-radius:7px;
    color:#fff !important;
    font-size:8.5px;
    font-weight:700;
    letter-spacing:0;
  }
  .topbar .topbar-link-text { display:inline !important; }
  .topbar .topbar-animated-link > svg { width:13px; height:13px; }
  .topbar .topbar-border-effect {
    border-color:rgba(255,255,255,.72);
    background:rgba(0,16,56,.2);
  }
  .topbar-social {
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    gap:5px;
  }
  .topbar-social-btn { width:25px; height:25px; }
  .topbar-social-btn::before { width:25px; height:25px; }
  .topbar-social-btn svg { width:12px; height:12px; }
}
@media (max-width:380px) {
  .topbar-inner { width:calc(100% - 12px); gap:5px; }
  .topbar-contact { gap:4px; }
  .topbar .topbar-animated-link { padding:0 6px; font-size:7.5px; }
  .topbar-social { gap:4px; }
  .topbar-social-btn { width:23px; height:23px; }
}

/* El correo extenso queda representado por su icono en móvil. */
@media (max-width:760px) {
  .topbar-contact .topbar-animated-link:nth-child(3) .topbar-link-text {
    display:none !important;
  }

  .topbar-contact .topbar-animated-link:nth-child(3) {
    width:31px;
    padding:0;
  }
}

@media (max-width:380px) {
  .topbar-social .social-instagram,
  .topbar-social .social-tiktok {
    display:none;
  }
}

/* Hover rectangular para los datos de contacto. */
.topbar .topbar-animated-link:hover .topbar-border-effect::before {
  width:100%;
  height:100%;
  border-radius:inherit;
  transform:translate(-50%,-50%) rotate(0deg);
}
@media (max-width:760px) {
  .topbar .topbar-border-effect {
    border-radius:7px !important;
  }
}

/* Misión, visión y valores sobre el azul vibrante de marca. */
.values-section,
html[data-theme="light"] .values-section {
  background:#1068F8;
}
.values-section::before {
  background:radial-gradient(ellipse 46% 150px at 50% 0%,rgba(255,255,255,.2),transparent 74%);
}
.values-section::after {
  background:radial-gradient(ellipse 50% 130px at 50% 100%,rgba(0,16,56,.28),transparent 74%);
}
.values-section .about-values-head p { color:rgba(255,255,255,.86) !important; }
.values-section .about-values-head h3 {
  color:#fff !important;
  font-size:clamp(44px,4.5vw,68px);
  font-weight:bold;
  line-height:.98;
  letter-spacing:-4.2px;
  -webkit-text-fill-color:#fff;
  text-shadow:0 1px 0 rgba(0,16,56,.18);
}
.values-section .about-values-head h3 span {
  display:block;
  margin-top:0;
  color:#1068F8 !important;
  background:linear-gradient(135deg,#FFFFFF 5%,#1068F8 48%,#003998 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent !important;
  text-shadow:none;
}
.values-section .about-kicker {
  border:1px solid #fff !important;
  color:#fff !important;
  background:transparent !important;
  box-shadow:0 0 14px rgba(255,255,255,.2);
}
.values-section .about-kicker i { background:#fff !important; box-shadow:0 0 9px rgba(255,255,255,.9) !important; }
.values-section .about-value-card,
html[data-theme="light"] .values-section .about-value-card {
  border-color:rgba(255,255,255,.42);
  box-shadow:0 16px 34px rgba(0,16,56,.24), inset 0 1px rgba(255,255,255,.1);
}

/* Composición editorial para los pilares: cada tarjeta tiene su propia presencia. */
.values-section {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  margin-top:-82px;
  padding:178px 0 108px;
  background:
    linear-gradient(180deg,#000 0%,#000 9%,#001038 42%,#003998 72%,rgba(8,96,240,.52) 100%),
    radial-gradient(ellipse 42% 120% at 0% 100%,rgba(0,16,56,.38),transparent 72%),
    radial-gradient(ellipse 36% 110% at 100% 0%,rgba(255,255,255,.16),transparent 70%),
    linear-gradient(105deg,#003998 0%,#0860F0 45%,#1068F8 72%,#0758df 100%) !important;
}
html[data-theme="dark"] .values-section,
html[data-theme="light"] .values-section {
  background:
    linear-gradient(180deg,#000 0%,#000 9%,#001038 42%,#003998 72%,rgba(8,96,240,.52) 100%),
    radial-gradient(ellipse 42% 120% at 0% 100%,rgba(0,16,56,.38),transparent 72%),
    radial-gradient(ellipse 36% 110% at 100% 0%,rgba(255,255,255,.16),transparent 70%),
    linear-gradient(105deg,#003998 0%,#0860F0 45%,#1068F8 72%,#0758df 100%) !important;
}
.values-section::before {
  background:radial-gradient(ellipse 58% 150px at 50% 0%,rgba(0,16,56,.38),transparent 74%) !important;
}
.values-section .about-values {
  position:relative;
  z-index:1;
  margin-top:0;
  grid-template-columns:1.06fr .94fr 1fr;
  gap:20px;
  counter-reset:value-card;
}
.values-section .about-values-head {
  margin-bottom:28px;
}
.values-section .about-values-head h3 {
  max-width:780px;
  margin-inline:auto;
}
.values-section .about-value-card,
html[data-theme="light"] .values-section .about-value-card {
  min-height:294px;
  padding:32px 30px 28px;
  border:1px solid rgba(255,255,255,.5) !important;
  border-radius:22px;
  background:
    linear-gradient(145deg,rgba(10,28,68,.97),rgba(0,16,56,.98)) padding-box,
    linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,255,255,.18)) border-box !important;
  box-shadow:0 20px 42px rgba(0,16,56,.28),inset 0 1px rgba(255,255,255,.13) !important;
  counter-increment:value-card;
}
.values-section .about-value-card::before {
  inset:auto 0 0;
  width:100%;
  height:4px;
  padding:0;
  border-radius:0 0 22px 22px;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.08) 78%) !important;
  opacity:.9;
  -webkit-mask:none;
  mask:none;
}
.values-section .about-value-card::after {
  content:"0" counter(value-card);
  position:absolute;
  right:22px;
  bottom:15px;
  z-index:1;
  color:rgba(255,255,255,.1);
  font-size:42px;
  font-weight:800;
  letter-spacing:-3px;
  line-height:1;
}
.values-section .about-value-card:nth-of-type(2) {
  transform:translateY(18px);
  background:
    radial-gradient(circle at 100% 0,rgba(16,104,248,.34),transparent 38%),
    linear-gradient(145deg,rgba(10,28,68,.97),rgba(0,16,56,.98)) padding-box,
    linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,255,255,.18)) border-box !important;
}
.values-section .about-value-card:nth-of-type(3) {
  background:
    radial-gradient(circle at 0 100%,rgba(255,255,255,.1),transparent 36%),
    linear-gradient(145deg,rgba(10,28,68,.97),rgba(0,16,56,.98)) padding-box,
    linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,255,255,.18)) border-box !important;
}
.values-section .about-value-card:hover { transform:translateY(-7px) !important; }
.values-section .about-value-card:nth-of-type(2):hover { transform:translateY(10px) !important; }
.values-section .about-value-card > div:last-child > span {
  color:#fff;
  border-bottom-color:#1068F8;
  box-shadow:0 2px 0 rgba(16,104,248,.18);
}
.values-section .about-value-card h3 { color:#fff !important; }
.values-section .about-value-card p,
.values-section .about-value-card li { color:rgba(232,241,255,.73) !important; }
.values-section .about-value-card li::marker { color:#fff; }
.values-section .about-value-card .about-value-icon { color:#fff; opacity:.16; }

/* Sin halo blanco sobre la llamada a la acción fotográfica. */
.hero-next-cta .hero-next-glow { display:none; }

/* El proceso empieza limpio, sin franja ni halo azul superior. */
html[data-theme="dark"] .workflow {
  background:#03070d !important;
}
html[data-theme="dark"] .workflow::before {
  display:none;
}
.workflow-heading h2 {
  color:#f4f7fd !important;
  font-size:clamp(44px,5.2vw,68px);
  line-height:.99;
  letter-spacing:-4px;
}
.workflow-heading h2 span {
  color:transparent !important;
  background:linear-gradient(135deg,#FFFFFF 5%,#1068F8 48%,#003998 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}

/* Proceso alineado a la paleta Jexora: marino, eléctrico y blanco. */
.workflow-heading > p { border-left-color:#1068F8; color:rgba(232,241,255,.72); }
.workflow-featured,
.workflow-mini-grid figure { background:#001038; }
.workflow-featured { border-color:rgba(16,104,248,.42); }
.workflow-mini-grid { background:rgba(16,104,248,.36); }
.workflow-featured figcaption small,
.workflow-mini-copy small,
.workflow-step-copy small { color:#1068F8; }
.workflow-status i { background:#1068F8; box-shadow:0 0 9px rgba(16,104,248,.78); }
.workflow-mini-grid figcaption .workflow-mini-icon,
.workflow-note > span,
.workflow-step-icon { color:#1068F8; }
.workflow-step::before,
.workflow-step:nth-child(even)::before,
.workflow-step:nth-child(3)::before { background:#1068F8; }
.workflow-step::after { background:linear-gradient(90deg,rgba(0,16,56,.66),rgba(0,16,56,.34) 65%,transparent); }
.workflow-number,
.workflow-step:hover .workflow-number {
  background:linear-gradient(145deg,#fff 5%,#1068F8 52%,#003998 100%);
  -webkit-background-clip:text;
  background-clip:text;
}
.workflow-number::after,
.workflow-step:hover .workflow-number::after { background:#1068F8; }
.workflow-step-copy h3,
.workflow-featured figcaption strong,
.workflow-mini-copy strong { color:#fff !important; }
.workflow-step-copy p,
.workflow-note p { color:rgba(232,241,255,.68); }
.workflow-step-copy > div span { color:rgba(232,241,255,.58); }
.workflow-step-copy > div span::before { background:#1068F8; box-shadow:0 0 6px rgba(16,104,248,.8); }

/* Servicios: degradado de lectura negro, sin velo azul marino. */
html[data-theme="dark"] .service-orbit-card,
html[data-theme="dark"] .service-orbit-card:hover,
html[data-theme="dark"] .service-orbit-card:focus,
html[data-theme="dark"] .service-orbit-card.is-oriented {
  background:
    linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.56) 42%,rgba(0,0,0,.98) 76%) padding-box,
    var(--service-card-image) var(--service-card-position) / auto 100% no-repeat padding-box,
    linear-gradient(145deg,rgba(255,255,255,.72),rgba(16,104,248,.22) 48%,rgba(16,104,248,.58)) border-box !important;
}
html[data-theme="dark"] .service-orbit-card::after {
  background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.74) 23%,rgba(0,0,0,.96) 58%);
}

/* Proyectos con la misma jerarquía tipográfica de los títulos actuales. */
.projects-showcase-head h2 {
  color:#f4f7fd !important;
  font-size:clamp(34px,3.7vw,52px);
  font-weight:700;
  line-height:.99;
  letter-spacing:-2.8px;
}
.projects-showcase-link,
.projects-showcase-link:hover { color:#1068F8 !important; }
.project-showcase-copy small {
  color:#1068F8;
  font-size:9px;
  font-weight:800;
  letter-spacing:1.35px;
}
.project-showcase-copy h3 {
  color:#fff !important;
  font-size:clamp(20px,1.65vw,27px);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-.85px;
}
.project-showcase-copy p { color:rgba(232,241,255,.76); }

/* Universo de clientes: misma experiencia visual tanto en claro como en oscuro. */
.clients-solar,
html[data-theme="light"] .clients-solar,
html[data-theme="dark"] .clients-solar {
  color:#edf5ff !important;
  background:
    linear-gradient(90deg,rgba(2,7,17,.95) 0%,rgba(3,11,29,.84) 43%,rgba(3,15,42,.48) 100%),
    linear-gradient(180deg,rgba(1,5,14,.12),rgba(1,5,14,.28)),
    url("assets/images/clients/clients-nebula-background.webp") center / cover no-repeat !important;
}
.clients-solar-heading h2 {
  color:#f4f7fd !important;
  font-size:clamp(44px,5.2vw,68px);
  line-height:.99;
  letter-spacing:-4px;
  text-shadow:0 3px 18px rgba(0,0,0,.48);
}
.clients-solar-heading h2 span {
  color:transparent !important;
  background:linear-gradient(135deg,#FFFFFF 5%,#1068F8 48%,#003998 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}
.clients-solar-heading p { color:#fff !important; }
.clients-solar-system > .client-logo img {
  filter:grayscale(1) brightness(0) invert(1);
  mix-blend-mode:screen;
  opacity:.95;
}

/* Tema oscuro: un único acento eléctrico. Los antiguos celestes claros no
   deben reaparecer por herencia en controles, etiquetas ni iconografía. */
html[data-theme="dark"] {
  --blue: #1068F8;
}
html[data-theme="dark"] :is(
  .section-path a,
  .section-path a i,
  .workflow-featured figcaption small,
  .workflow-mini-copy small,
  .workflow-step-copy small,
  .workflow-mini-grid figcaption .workflow-mini-icon,
  .workflow-note > span,
  .workflow-step-icon,
  .project-showcase-link,
  .project-showcase-copy small,
  .contact-copy .about-kicker,
  .contact-form-head > span,
  .footer-brand-cta span,
  .footer-direct-link small,
  .footer-column a:hover,
  .testimonial-copy-top span,
  .testimonial-copy-top b,
  .testimonial-copy footer em i,
  .faq-list summary span
) {
  color: #1068F8 !important;
}
html[data-theme="dark"] :is(
  .section-path,
  .section-path a i,
  .workflow-featured,
  .contact-form,
  .contact-fields input,
  .contact-fields select,
  .contact-fields textarea,
  .footer-brand-cta,
  .footer-column h3::after,
  .newsletter h3::after,
  .faq-list details,
  .testimonial-project
) {
  border-color: rgba(16, 104, 248, .58) !important;
}
html[data-theme="dark"] :is(
  .section-path a.is-passed i,
  .section-path a.is-current i,
  .workflow-status i,
  .workflow-step-copy > div span::before,
  .testimonial-copy footer em i,
  .faq-list summary span,
  .contact-human-mark
) {
  background-color: #1068F8 !important;
  box-shadow: 0 0 10px rgba(16, 104, 248, .8) !important;
}

@media (max-width:760px) {
  .values-section { margin-top:-54px; padding:122px 0 74px; }
  .values-section .about-values { grid-template-columns:1fr; gap:14px; }
  .values-section .about-values-head { margin-bottom:16px; }
  .values-section .about-value-card,
  .values-section .about-value-card:nth-of-type(2) { min-height:0; transform:none; }
  .values-section .about-value-card:nth-of-type(2):hover { transform:translateY(-5px) !important; }
}

/* Tarjeta del equipo: destaque elegante sin competir con el hero. */
.hero .team-trust {
  position: relative;
  isolation: isolate;
  width: min(100%, 430px);
  min-width: 0;
  margin: clamp(42px, 6.5vh, 68px) auto 0;
  padding: 14px 20px 14px 15px;
  gap: 18px;
  overflow: hidden;
  border: 1px solid rgba(99, 155, 237, .38);
  border-radius: 18px;
  background:
    radial-gradient(circle at 8% 50%, rgba(16, 104, 248, .18), transparent 34%),
    linear-gradient(120deg, rgba(13, 29, 51, .9), rgba(5, 12, 23, .78));
  box-shadow: 0 16px 38px rgba(0, 0, 0, .28), inset 0 1px rgba(210, 228, 255, .1);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.hero .team-trust::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 22px;
  left: 22px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 166, 255, .85), transparent);
}
.hero .team-trust .avatars { flex: 0 0 auto; padding-left: 2px; }
.hero .team-trust .avatars img {
  width: 58px;
  height: 58px;
  margin-left: -11px;
  border: 2px solid rgba(133, 181, 248, .78);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .3), 0 0 0 3px rgba(16, 104, 248, .07);
}
.hero .team-trust-copy { min-width: 0; }
.hero .team-trust-kicker {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 5px;
  color: #76adff;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.hero .team-trust-kicker i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #408cfb;
  box-shadow: 0 0 7px rgba(64, 140, 251, .72);
}
.hero .team-trust strong { font-size: 12px; font-weight: 700; line-height: 1.3; }
.hero .team-trust small { max-width: 230px; margin-top: 4px; color: #9eafc6; font-size: 9px; }
html[data-theme="light"] .hero .team-trust {
  border-color: rgba(61, 117, 200, .24);
  background:
    radial-gradient(circle at 8% 50%, rgba(16, 104, 248, .11), transparent 34%),
    linear-gradient(120deg, rgba(251, 253, 255, .95), rgba(231, 240, 252, .86));
  box-shadow: 0 14px 32px rgba(35, 74, 126, .13), inset 0 1px rgba(255, 255, 255, .85);
}
html[data-theme="light"] .hero .team-trust strong { color: #173255; }
html[data-theme="light"] .hero .team-trust small { color: #58708e !important; }
html[data-theme="light"] .hero .team-trust-kicker { color: #236bc5; }
@media (max-width: 620px) {
  .hero .team-trust {
    width: 100%;
    margin-top: 44px;
    padding: 12px 14px;
    gap: 13px;
    border-radius: 15px;
  }
  .hero .team-trust .avatars img { width: 48px; height: 48px; margin-left: -9px; }
  .hero .team-trust strong { font-size: 10px; }
}

/* Ritmo vertical del hero: cada bloque respira sin perder continuidad. */
@media (min-width: 761px) {
  .hero h1 { margin-top: 34px; margin-bottom: 26px; }
  .hero-slide { padding-bottom: 38px; }
  .hero-search { margin-top: 40px; }
  .hero-search + .hero-buttons {
    margin-top: 70px;
  }
}

@media (max-width: 760px) {
  .hero h1 { margin-top: 25px; margin-bottom: 21px; }
  .hero-slide { padding-bottom: 27px; }
  .hero-search { margin-top: 28px; }
  .hero-search + .hero-buttons { margin-top: 28px; }
}

/* Staff compacto: solo retratos y una pestana identificadora. */
.hero .hero-action-row {
  display: flex;
  align-items: center;
  gap: clamp(26px, 3.5vw, 48px);
  margin-top: 34px;
}
.hero .hero-action-row .hero-buttons { flex: 0 0 auto; margin-top: 0; }
.hero .team-trust-stack {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.hero .team-trust-stack .hero-carousel-controls {
  position: static;
  display: flex;
  gap: 7px;
}
.hero .hero-action-row .team-trust {
  position: relative;
  display: grid;
  place-items: center;
  width: 126px;
  min-width: 126px;
  height: 68px;
  margin: 0;
  padding: 9px 12px 7px;
  overflow: visible;
  border: 1px solid rgba(122, 169, 236, .38);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(16, 32, 54, .9), rgba(7, 15, 27, .92));
  box-shadow: inset 0 1px rgba(255, 255, 255, .06), 0 12px 28px rgba(0, 0, 0, .24);
  transform: none;
}
.hero .hero-action-row .team-trust::before,
.hero .hero-action-row .team-trust::after { display: none; }
.hero .hero-action-row .team-trust-tab {
  position: absolute;
  top: -10px;
  left: 50%;
  padding: 4px 13px;
  border: 1px solid rgba(118, 170, 245, .5);
  border-radius: 999px;
  color: #eef5ff;
  background: #0d4fae;
  box-shadow: 0 5px 14px rgba(5, 52, 119, .32);
  font-size: 7px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .17em;
  text-transform: uppercase;
  transform: translateX(-50%);
}
.hero .hero-action-row .team-trust .avatars {
  justify-content: center;
  padding-left: 10px;
}
.hero .hero-action-row .team-trust .avatars img {
  width: 45px;
  height: 45px;
  margin-left: -10px;
  border: 2px solid #0a1525;
  box-shadow: 0 0 0 1px rgba(119, 167, 235, .35), 0 6px 15px rgba(0, 0, 0, .3);
}
html[data-theme="light"] .hero .hero-action-row .team-trust {
  border-color: rgba(51, 105, 181, .28);
  background: linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(226, 237, 251, .94));
  box-shadow: inset 0 1px #fff, 0 10px 24px rgba(48, 82, 128, .14);
}
html[data-theme="light"] .hero .hero-action-row .team-trust .avatars img { border-color: #edf4fd; }

@media (max-width: 760px) {
  .hero .hero-action-row {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 22px;
    margin-top: 22px;
  }
  .hero .hero-action-row .hero-buttons { width: auto; margin-top: 0; }
  .hero .hero-action-row .team-trust { width: 116px; min-width: 116px; height: 64px; }
  .hero .hero-action-row .team-trust .avatars img { width: 41px; height: 41px; }
}

/* Variante final: capsula humana y sobria para el equipo. */
.hero .hero-action-row { gap: clamp(24px, 3vw, 38px); }
.hero .hero-action-row .team-trust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 202px;
  min-width: 202px;
  height: 58px;
  padding: 6px 8px 6px 17px;
  gap: 12px;
  overflow: hidden;
  border: 1px solid rgba(138, 174, 224, .28);
  border-radius: 999px;
  background: rgba(8, 19, 33, .72);
  box-shadow: inset 0 1px rgba(255, 255, 255, .055), 0 9px 24px rgba(0, 0, 0, .18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.hero .hero-action-row .team-trust-label {
  color: #c9d8eb;
  font-size: 8px;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: .11em;
  white-space: nowrap;
  text-transform: uppercase;
}
.hero .hero-action-row .team-trust .avatars {
  flex: 0 0 auto;
  justify-content: center;
  padding-left: 7px;
}
.hero .hero-action-row .team-trust .avatars img {
  width: 42px;
  height: 42px;
  margin-left: -7px;
  border: 1.5px solid rgba(210, 225, 245, .82);
  background: #e9eef5;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .22);
}
html[data-theme="light"] .hero .hero-action-row .team-trust {
  border-color: rgba(57, 101, 160, .2);
  background: rgba(248, 251, 255, .82);
  box-shadow: inset 0 1px #fff, 0 8px 20px rgba(48, 82, 128, .11);
}
html[data-theme="light"] .hero .hero-action-row .team-trust-label { color: #354f70; }
html[data-theme="light"] .hero .hero-action-row .team-trust .avatars img { border-color: #fff; }

@media (max-width: 760px) {
  .hero .hero-action-row { gap: 18px; }
  .hero .hero-action-row .team-trust {
    width: 188px;
    min-width: 188px;
    height: 54px;
    padding-left: 15px;
  }
  .hero .hero-action-row .team-trust .avatars img { width: 38px; height: 38px; }
}

/* El equipo ocupa el centro horizontal del hero, independiente de los botones. */
@media (min-width: 1051px) {
  .hero .hero-action-row {
    position: relative;
    min-height: 58px;
  }
  .hero .hero-action-row .team-trust {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0;
    transform: translate(-50%, -50%);
  }
}

@media (max-width: 1050px) {
  .hero .hero-action-row {
    display: block;
  }
  .hero .hero-action-row .team-trust {
    position: relative;
    margin: 28px auto 0;
    transform: none;
  }
}

/* Equipo del hero: presencia humana integrada al lenguaje visual de la pagina. */
.hero .hero-action-row .team-trust {
  width: 254px;
  min-width: 254px;
  height: 64px;
  padding: 8px 10px 8px 16px;
  gap: 14px;
  overflow: visible;
  border-color: #fff;
  border-radius: 16px;
  background: transparent;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.hero .hero-action-row .team-trust-copy {
  min-width: 0;
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.hero .hero-action-row .team-trust-label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #e4edf9;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
}
.hero .hero-action-row .team-trust-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hero .hero-action-row .team-trust-copy small {
  max-width: none;
  margin: 0;
  color: #8fa3bd;
  font-size: 8px;
  line-height: 1.25;
  white-space: nowrap;
}
.hero .hero-action-row .team-trust .avatars {
  padding-left: 8px;
}
.hero .hero-action-row .team-trust .avatars img {
  width: 44px;
  height: 44px;
  margin-left: -9px;
  object-fit: cover;
  object-position: center 18%;
  border: 2px solid #fff;
  background: #eef3f8;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .24);
}
html[data-theme="light"] .hero .hero-action-row .team-trust {
  border-color: #fff;
  background: transparent;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
}
html[data-theme="light"] .hero .hero-action-row .team-trust-label { color: #e4edf9; }
html[data-theme="light"] .hero .hero-action-row .team-trust-copy small { color: #a9b8cb !important; }

@media (min-width: 761px) {
  .hero-search + .hero-action-row { margin-top: 70px; }
}

@media (max-width: 760px) {
  .hero .hero-action-row .team-trust {
    width: 230px;
    min-width: 230px;
    height: 60px;
    padding-left: 14px;
  }
  .hero .hero-action-row .team-trust .avatars img {
    width: 41px;
    height: 41px;
  }
}

/* Posicion final: equipo en una fila independiente y centrada. */
.hero .hero-action-row {
  position: relative;
  display: block;
  width: 100%;
  min-height: 0;
}
.hero .hero-action-row .team-trust {
  position: relative;
  top: auto;
  left: auto;
  margin: 38px auto 0;
  transform: none;
}

/* Los controles del hero se agrupan directamente bajo la tarjeta STAFF. */
.hero .hero-action-row .team-trust-stack {
  width: 254px;
  margin: 38px auto 0;
}
.hero .hero-action-row .team-trust-stack .team-trust {
  margin: 0;
}
.hero .team-trust-stack .hero-carousel-controls {
  width: 100%;
  justify-content: center;
}

@media (max-height: 780px) and (min-width: 761px) {
  .hero .hero-action-row .team-trust { margin-top: 26px; }
}

@media (max-width: 760px) {
  .hero .hero-action-row .team-trust { margin-top: 28px; }
  .hero .hero-action-row .team-trust-stack { width: 230px; margin-top: 28px; }
}

/* En escritorio, STAFF comparte la fila de los botones; los indicadores quedan debajo. */
@media (min-width: 761px) {
  .hero .hero-action-row {
    display: flex;
    align-items: flex-start;
    min-height: 80px;
  }

  .hero .hero-action-row .team-trust-stack {
    position: absolute;
    top: 0;
    right: auto;
    left: 50%;
    margin: 0;
    transform: translateX(-50%);
  }
}

/* Hero más compacto: el mensaje principal y el buscador se leen como un bloque. */
@media (min-width: 761px) {
  .hero h1 {
    margin-top: 60px;
    margin-bottom: 12px;
  }

  .hero-slide {
    padding-bottom: 8px;
  }

  .hero-search {
    margin-top: 14px;
  }

  .hero-search + .hero-action-row {
    margin-top: 78px;
  }

  /* La franja de tecnologías acompaña las acciones y evita un vacío excesivo
     antes del cierre del hero. */
  .tech-carousel {
    bottom: clamp(52px, 13vh, 92px);
  }
}

/* CTA intermedia: una sola composicion visual, independiente del tema. */
.hero-next-cta,
html[data-theme="light"] .hero-next-cta {
  position: relative;
  isolation: isolate;
  min-height: 0;
  padding: clamp(24px, 3vw, 44px) 0;
  overflow: hidden;
  border: 0;
  background:
    radial-gradient(ellipse 86% 240px at 50% 0, rgba(68, 139, 255, .20), transparent 76%),
    linear-gradient(
      180deg,
      #0860f0 0,
      #0757d5 52px,
      #0645ad 118px,
      #032b72 190px,
      #01183f 268px,
      #020712 370px
    ),
    #020712 !important;
}

.hero-next-cta::before,
.hero-next-cta::after,
html[data-theme="light"] .hero-next-cta::before,
html[data-theme="light"] .hero-next-cta::after {
  content: "";
  position: absolute;
  inset: clamp(24px, 3vw, 44px) clamp(18px, 2.5vw, 48px);
  width: auto;
  height: auto;
  border-radius: clamp(20px, 2vw, 30px);
  opacity: 1;
  transform: none;
  pointer-events: none;
}

.hero-next-cta::before,
html[data-theme="light"] .hero-next-cta::before {
  z-index: 0;
  background: url("assets/images/hero/cta-team-workspace-v1.webp") center / cover no-repeat;
  filter: brightness(1.08) saturate(1.03);
  box-shadow:
    0 30px 80px rgba(0, 0, 0, .42),
    inset 0 0 0 1px rgba(139, 185, 255, .18);
}

.hero-next-cta::after,
html[data-theme="light"] .hero-next-cta::after {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(18, 92, 205, .22) 0%, rgba(0, 30, 83, .16) 15%, transparent 42%),
    linear-gradient(90deg, rgba(0, 8, 24, .12) 0%, rgba(0, 9, 27, .42) 29%, rgba(0, 8, 23, .68) 50%, rgba(0, 9, 27, .42) 71%, rgba(0, 8, 24, .12) 100%),
    linear-gradient(180deg, rgba(0, 9, 25, .04), rgba(0, 7, 20, .46));
  box-shadow: inset 0 0 110px rgba(0, 0, 0, .16);
}

.hero-next-cta .hero-next-glow {
  display: none;
}

.hero-next-content {
  z-index: 2;
  width: min(calc(100% - 80px), 820px);
  min-height: clamp(490px, 33vw, 570px);
  padding: clamp(72px, 7vw, 106px) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.hero-next-kicker,
html[data-theme="light"] .hero-next-kicker,
html[data-theme="dark"] .hero-next-kicker {
  min-height: 36px;
  margin: 0 auto 25px;
  padding: 0 19px;
  border: 1px solid #168cff;
  color: #f7fbff;
  background: rgba(1, 7, 16, .9);
  box-shadow:
    inset 0 0 10px rgba(22, 140, 255, .12),
    0 0 5px rgba(22, 140, 255, .95),
    0 0 17px rgba(22, 140, 255, .62),
    0 0 28px rgba(0, 91, 255, .26);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-shadow: 0 0 8px rgba(255, 255, 255, .18);
}

.hero-next-kicker i,
html[data-theme="light"] .hero-next-kicker i,
html[data-theme="dark"] .hero-next-kicker i {
  width: 6px;
  height: 6px;
  flex-basis: 6px;
  background: #168cff;
  box-shadow: 0 0 8px rgba(22, 140, 255, .95);
}

.hero-next-content h2,
html[data-theme="light"] .hero-next-content h2 {
  max-width: 820px;
  margin: 0;
  color: #f7f9ff !important;
  font-size: clamp(46px, 4.15vw, 68px);
  font-weight: 750;
  line-height: .98;
  letter-spacing: clamp(-3.5px, -.05em, -2px);
  text-wrap: balance;
  text-shadow: 0 8px 35px rgba(0, 0, 0, .46);
}

.hero-next-content h2 span,
html[data-theme="light"] .hero-next-content h2 span {
  color: transparent !important;
  background: linear-gradient(100deg, #b9d7ff 0%, #5798ff 40%, #1068F8 72%, #68a5ff 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.hero-next-content p,
html[data-theme="light"] .hero-next-content p {
  max-width: 620px;
  margin: 24px auto 0;
  color: #aebbd0 !important;
  font-size: 15px;
  line-height: 1.7;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .5);
}

.hero-next-actions {
  margin-top: 32px;
  gap: 12px;
}

.hero-next-primary.primary-action,
html[data-theme="light"] .hero-next-primary.primary-action,
.hero-next-secondary.secondary-action,
html[data-theme="light"] .hero-next-secondary.secondary-action {
  width: auto;
  min-width: 190px;
  height: 50px;
  padding: 0 23px;
  border-radius: 12px;
  font-size: 10px;
  letter-spacing: .85px;
}

.hero-next-primary.primary-action,
html[data-theme="light"] .hero-next-primary.primary-action {
  color: #fff !important;
  border: 1px solid #2378ff;
  background: linear-gradient(180deg, #1972ff, #075be5);
  box-shadow: 0 14px 34px rgba(8, 96, 240, .34), inset 0 1px rgba(255, 255, 255, .2);
}

.hero-next-primary.primary-action .hero-next-arrow,
html[data-theme="light"] .hero-next-primary.primary-action .hero-next-arrow {
  position: static;
  color: currentColor;
  font-size: 17px;
  line-height: 1;
  transform: none;
}

.hero-next-primary.primary-action::after,
html[data-theme="light"] .hero-next-primary.primary-action::after {
  display: none;
}

.hero-next-secondary.secondary-action,
html[data-theme="light"] .hero-next-secondary.secondary-action {
  overflow: hidden;
  color: #e8f1ff !important;
  border: 1px solid rgba(151, 192, 255, .42);
  background: rgba(4, 15, 34, .64) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .07);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.hero-next-secondary.secondary-action .solutions-arr-2,
.hero-next-secondary.secondary-action .solutions-circle {
  display: none;
}

.hero-next-secondary.secondary-action .solutions-text,
html[data-theme="light"] .hero-next-secondary.secondary-action .solutions-text {
  color: inherit !important;
  transform: none;
}

.hero-next-secondary.secondary-action .solutions-arr-1,
html[data-theme="light"] .hero-next-secondary.secondary-action .solutions-arr-1 {
  position: static;
  width: 17px;
  height: 17px;
  color: #81b2ff !important;
  fill: currentColor !important;
}

.hero-next-primary.primary-action:hover,
.hero-next-secondary.secondary-action:hover {
  transform: translateY(-3px);
  border-radius: 12px;
}

.hero-next-secondary.secondary-action:hover,
html[data-theme="light"] .hero-next-secondary.secondary-action:hover {
  color: #fff !important;
  border-color: rgba(151, 192, 255, .76);
  background: rgba(14, 46, 96, .72) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .1);
}

.hero-next-secondary.secondary-action:hover .solutions-text {
  color: inherit !important;
  transform: none;
}

.hero-next-secondary.secondary-action:hover .solutions-arr-1 {
  right: auto;
  transform: translateX(3px);
}

@media (max-width: 700px) {
  .hero-next-cta,
  html[data-theme="light"] .hero-next-cta {
    padding: 16px 0;
  }
  .hero-next-cta::before,
  .hero-next-cta::after,
  html[data-theme="light"] .hero-next-cta::before,
  html[data-theme="light"] .hero-next-cta::after {
    inset: 16px 12px;
    border-radius: 20px;
  }
  .hero-next-cta::before,
  html[data-theme="light"] .hero-next-cta::before {
    /* La foto es panoramica: en vertical enfocamos al equipo de la izquierda
       para evitar que el recorte caiga sobre su amplio centro oscuro. */
    background-position: 12% center;
    filter: brightness(1.2) saturate(1.08);
  }
  .hero-next-cta::after,
  html[data-theme="light"] .hero-next-cta::after {
    background:
      radial-gradient(ellipse 76% 54% at 58% 43%, rgba(0, 7, 21, .34), transparent 78%),
      linear-gradient(180deg, rgba(15, 86, 194, .12) 0%, rgba(0, 27, 76, .08) 18%, transparent 44%),
      linear-gradient(180deg, rgba(0, 8, 24, .14), rgba(0, 7, 21, .52));
  }
  .hero-next-content {
    width: min(calc(100% - 48px), 560px);
    min-height: 560px;
    padding: 68px 0;
  }
  .hero-next-kicker,
  html[data-theme="light"] .hero-next-kicker {
    max-width: 100%;
    min-height: 32px;
    margin-bottom: 22px;
    padding: 7px 13px;
    font-size: 8px;
    text-align: left;
  }
  .hero-next-content h2,
  html[data-theme="light"] .hero-next-content h2 {
    font-size: clamp(38px, 11.5vw, 52px);
    line-height: 1.02;
    letter-spacing: -2.2px;
  }
  .hero-next-content h2 br { display: none; }
  .hero-next-content p,
  html[data-theme="light"] .hero-next-content p {
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.65;
  }
  .hero-next-content p br { display: none; }
  .hero-next-actions {
    width: 100%;
    margin-top: 28px;
  }
  .hero-next-primary.primary-action,
  html[data-theme="light"] .hero-next-primary.primary-action,
  .hero-next-secondary.secondary-action,
  html[data-theme="light"] .hero-next-secondary.secondary-action {
    width: min(100%, 290px);
  }
}

/* Carrusel de tecnologías: una pieza contenida, limpia y sin destellos laterales. */
.hero-section-bridge {
  display: none;
}

/* Se elimina el adorno azul de transición y sus puntos decorativos. */
.about-corner-glow,
.about::before {
  display: none;
}

.tech-carousel {
  box-sizing: border-box;
  padding: 6px 18px;
  border: 1px solid rgba(16, 104, 248, .72);
  border-radius: 18px;
  background: linear-gradient(100deg, rgba(7, 18, 31, .42), rgba(22, 48, 76, .28), rgba(7, 18, 31, .42));
  box-shadow: inset 0 1px rgba(255, 255, 255, .07), 0 12px 30px rgba(0, 0, 0, .16);
  backdrop-filter: blur(14px) saturate(1.1);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  -webkit-mask-image: none;
  mask-image: none;
}

@media (min-width: 761px) {
  .tech-carousel {
    right: auto;
    left: 50%;
    width: min(1140px, calc(100% - 180px));
    transform: translateX(-50%);
  }
}

/* Ritmo final del hero: separaciones consistentes entre lectura y acciones. */
@media (min-width: 761px) {
  .hero-content {
    --hero-title-gap: 24px;
    --hero-copy-gap: 16px;
    --hero-block-gap: 28px;
  }

  .hero h1 {
    margin-top: var(--hero-title-gap);
    margin-bottom: var(--hero-copy-gap);
  }

  .hero-slide {
    padding-bottom: 0;
  }

  .hero-search {
    margin-top: var(--hero-block-gap);
  }

  .hero-search + .hero-action-row {
    margin-top: var(--hero-block-gap);
  }

  .hero .hero-action-row {
    display: flex;
    align-items: flex-start;
    gap: 34px;
    min-height: 80px;
  }

  .hero .hero-action-row .team-trust-stack {
    position: static;
    inset: auto;
    margin: 0;
    transform: none;
  }

  .tech-carousel {
    bottom: clamp(28px, 5vh, 48px);
  }
}

@media (max-width: 760px) {
  .hero-content {
    --hero-title-gap: 18px;
    --hero-copy-gap: 14px;
    --hero-block-gap: 20px;
  }

  .hero h1 {
    margin-top: var(--hero-title-gap);
    margin-bottom: var(--hero-copy-gap);
  }

  .hero-slide {
    padding-bottom: 0;
  }

  .hero-search {
    margin-top: var(--hero-block-gap);
  }

  .hero-search + .hero-action-row {
    margin-top: var(--hero-block-gap);
  }

  .hero .hero-action-row .team-trust-stack {
    margin-top: 24px;
  }

  .tech-carousel {
    margin-top: 24px;
  }
}

/* Zona segura del editor: libre de Jack y de la franja de tecnologías. */
@media (min-width: 1161px) {
  .hero-code-editor {
    right: max(210px, calc((100vw - var(--container)) / 2));
    bottom: clamp(142px, 17vh, 172px);
  }

  .tech-carousel {
    width: min(1140px, calc(100% - 390px));
  }
}

/* About: el encabezado comparte el mismo lenguaje visual del hero. */
.about .about-kicker,
html[data-theme="light"] .about .about-kicker,
html[data-theme="dark"] .about .about-kicker {
  min-height: 30px;
  padding: 0 15px;
  border: 1px solid #1068F8 !important;
  border-radius: 999px;
  color: #fff !important;
  background: rgba(6, 16, 32, .46) !important;
  box-shadow: 0 0 8px rgba(16, 104, 248, .82), 0 0 20px rgba(16, 104, 248, .34), inset 0 0 10px rgba(16, 104, 248, .12);
  text-shadow: 0 0 8px rgba(16, 104, 248, .7);
}
.about .about-kicker i,
html[data-theme="light"] .about .about-kicker i,
html[data-theme="dark"] .about .about-kicker i {
  background: #1068F8 !important;
  box-shadow: 0 0 7px #1068F8, 0 0 14px rgba(16, 104, 248, .9) !important;
}

/* Workflow: conserva el rótulo neón sobre la superficie oscura de la sección. */
.workflow-heading .about-kicker {
  border-color: #1068F8;
  color: #fff;
  background: rgba(6, 16, 32, .46);
  box-shadow: 0 0 8px rgba(16, 104, 248, .82), 0 0 20px rgba(16, 104, 248, .34), inset 0 0 10px rgba(16, 104, 248, .12);
  text-shadow: 0 0 8px rgba(16, 104, 248, .7);
}
.workflow-heading .about-kicker i {
  background: #1068F8;
  box-shadow: 0 0 7px #1068F8, 0 0 14px rgba(16, 104, 248, .9);
}
.about .about-copy h2.chromatic,
html[data-theme="light"] .about .about-copy h2.chromatic,
html[data-theme="dark"] .about .about-copy h2.chromatic {
  max-width: 650px;
  margin: 30px 0 22px;
  color: #f4f7ff !important;
  font-size: clamp(42px, 3.7vw, 58px);
  font-weight: 800;
  line-height: .99;
  letter-spacing: -4px;
  text-shadow: -1px 0 rgba(74, 145, 255, .95), 1px 0 rgba(255, 96, 74, .78) !important;
}
.about .about-copy h2 .hero-accent,
html[data-theme="light"] .about .about-copy h2 .hero-accent,
html[data-theme="dark"] .about .about-copy h2 .hero-accent {
  color: #1068F8 !important;
  background: linear-gradient(135deg, #fff 5%, #1068F8 48%, #003998 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

@media (max-width: 650px) {
  .about .about-copy h2.chromatic,
  html[data-theme="light"] .about .about-copy h2.chromatic,
  html[data-theme="dark"] .about .about-copy h2.chromatic {
    margin-top: 25px;
    font-size: 42px;
    letter-spacing: -2.5px;
  }
}

/* Texto descriptivo uniforme, sin palabras destacadas. */
.about .about-copy > p,
.about .about-copy > p * {
  font-weight: 400 !important;
  text-decoration: none !important;
  text-shadow: none !important;
}
.about .about-copy > p * {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

/* Galería de Quiénes somos: las tres imágenes muestran el trabajo del equipo. */
.about-image-tertiary {
  top: 6px;
  left: 4%;
  width: 48%;
  height: 164px;
  border-radius: 16px;
  object-position: center;
}
.about-image-main {
  top: 102px;
  width: 80%;
  height: 322px;
  border-radius: 18px;
  object-position: center;
}
.about-image-secondary {
  right: 2%;
  bottom: 4px;
  width: 52%;
  height: 168px;
  border-radius: 16px;
  object-position: center;
}

@media (max-width: 650px) {
  .about-image-tertiary { height: 122px; border-radius: 12px; }
  .about-image-main { top: 94px; height: 256px; border-radius: 14px; }
  .about-image-secondary { height: 130px; border-radius: 12px; }
}

/* Ajuste fino de separación en las acciones del hero. */
@media (min-width: 761px) {
  .hero .hero-action-row {
    gap: 42px;
  }
  .hero .hero-action-row .hero-buttons {
    gap: 16px;
  }
  .hero .team-trust-stack {
    gap: 15px;
  }
}

@media (max-width: 760px) {
  .hero .hero-action-row .hero-buttons { gap: 12px; }
  .hero .team-trust-stack { gap: 13px; }
}

/* Hero: jerarquía vertical amplia y STAFF centrado entre las acciones. */
@media (min-width: 761px) {
  .hero-content {
    padding-top: clamp(128px, 15vh, 164px);
  }
  .hero h1 {
    margin-top: 32px;
    margin-bottom: 26px;
  }
  .hero-slide {
    padding-bottom: 0;
  }
  .hero-search {
    margin-top: 38px;
  }
  .hero-search + .hero-action-row {
    position: relative;
    margin-top: 42px;
  }
  .hero .hero-action-row .team-trust-stack {
    position: absolute;
    top: 0;
    left: 50%;
    margin: 0;
    transform: translateX(-50%);
  }
}

@media (max-width: 760px) {
  .hero-content { padding-top: 88px; }
  .hero h1 { margin-top: 28px; margin-bottom: 22px; }
  .hero-search { margin-top: 32px; }
  .hero-search + .hero-action-row { margin-top: 32px; }
}

/* Distribución vertical del hero: cada bloque conserva su propia pausa. */
@media (min-width: 761px) {
  .hero h1 {
    margin-top: clamp(36px, 4.5vh, 48px);
    margin-bottom: clamp(26px, 3.2vh, 34px);
  }
  .hero-search {
    margin-top: clamp(42px, 5vh, 56px);
  }
  .hero-search + .hero-action-row {
    margin-top: clamp(42px, 5vh, 56px);
  }
}

/* Consistencia visual global: rotulos de seccion y fondos oscuros. */
html body :is(.badge, .hero-next-kicker, .about-kicker),
html[data-theme="light"] body :is(.badge, .hero-next-kicker, .about-kicker),
html[data-theme="dark"] body :is(.badge, .hero-next-kicker, .about-kicker) {
  min-height: 30px;
  padding: 0 15px;
  border: 1px solid #1068F8 !important;
  border-radius: 999px;
  color: #fff !important;
  background: rgba(0, 0, 0, .52) !important;
  box-shadow: 0 0 8px rgba(16, 104, 248, .72), inset 0 0 10px rgba(16, 104, 248, .12) !important;
  text-shadow: 0 0 8px rgba(16, 104, 248, .65);
}

html body :is(.badge, .hero-next-kicker, .about-kicker) i,
html[data-theme="light"] body :is(.badge, .hero-next-kicker, .about-kicker) i,
html[data-theme="dark"] body :is(.badge, .hero-next-kicker, .about-kicker) i {
  background: #1068F8 !important;
  box-shadow: 0 0 7px #1068F8, 0 0 14px rgba(16, 104, 248, .9) !important;
}

/* Las secciones sin fotografia de fondo usan negro puro en ambos temas. */
html body :is(.about, .workflow, .services-orbit, .projects, .testimonials-showcase, .faq, .contact-showcase),
html[data-theme="light"] body :is(.about, .workflow, .services-orbit, .projects, .testimonials-showcase, .faq, .contact-showcase),
html[data-theme="dark"] body :is(.about, .workflow, .services-orbit, .projects, .testimonials-showcase, .faq, .contact-showcase) {
  background: #000 !important;
}

html body :is(.about, .workflow, .services-orbit)::before,
html body :is(.about, .services-orbit)::after {
  background: none !important;
}

/* Contacto conserva su fotografia, sin la capa azul que la ocultaba. */
html body .contact-shell,
html[data-theme="light"] body .contact-shell,
html[data-theme="dark"] body .contact-shell {
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .74) 43%, rgba(0, 0, 0, .24) 72%, rgba(0, 0, 0, .08) 100%),
    url("assets/images/about/contact-consultant-v2.webp") right center / cover no-repeat !important;
}

html body .contact-shell::after,
html[data-theme="light"] body .contact-shell::after,
html[data-theme="dark"] body .contact-shell::after {
  background: linear-gradient(90deg, rgba(0, 0, 0, .42), transparent 72%) !important;
}

html body .contact-form,
html[data-theme="light"] body .contact-form,
html[data-theme="dark"] body .contact-form {
  background: rgba(0, 0, 0, .7) !important;
}

html body .contact-fields :is(input, select, textarea),
html[data-theme="light"] body .contact-fields :is(input, select, textarea),
html[data-theme="dark"] body .contact-fields :is(input, select, textarea) {
  background: rgba(0, 0, 0, .68) !important;
}

@media (max-width: 700px) {
  html body .contact-shell,
  html[data-theme="light"] body .contact-shell,
  html[data-theme="dark"] body .contact-shell {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, .24), #000 54%),
      url("assets/images/about/contact-consultant-v2.webp") 68% top / auto 390px no-repeat !important;
  }
}

/* Testimonios: misma tipografia y degradado de los titulos principales. */
html body .testimonials-heading h2,
html[data-theme="light"] body .testimonials-heading h2,
html[data-theme="dark"] body .testimonials-heading h2 {
  color: #f4f7fd !important;
  font-size: clamp(44px, 5.2vw, 68px);
  font-weight: 800;
  line-height: .99;
  letter-spacing: -4px;
  text-transform: none;
  text-shadow: none !important;
  -webkit-text-fill-color: #f4f7fd !important;
}

html body .testimonials-heading h2 span,
html[data-theme="light"] body .testimonials-heading h2 span,
html[data-theme="dark"] body .testimonials-heading h2 span {
  color: transparent !important;
  background: linear-gradient(135deg, #FFFFFF 5%, #1068F8 48%, #003998 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

/* FAQ: blanco frio y degradado azul como en la referencia del encabezado. */
html body .faq-copy h2,
html[data-theme="light"] body .faq-copy h2,
html[data-theme="dark"] body .faq-copy h2 {
  color: #f4f7fd !important;
  -webkit-text-fill-color: #f4f7fd !important;
  text-shadow: none !important;
}

html body .faq-copy h2 span,
html[data-theme="light"] body .faq-copy h2 span,
html[data-theme="dark"] body .faq-copy h2 span {
  color: transparent !important;
  background: linear-gradient(135deg, #FFFFFF 5%, #1068F8 48%, #003998 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

/* Servicios: universo profundo con nebulosas y dos campos de estrellas. */
html body .services-orbit,
html[data-theme="light"] body .services-orbit,
html[data-theme="dark"] body .services-orbit {
  isolation: isolate;
  background:
    radial-gradient(ellipse 48% 46% at 50% 58%, rgba(35, 102, 235, .32) 0%, rgba(22, 51, 137, .16) 40%, transparent 78%),
    radial-gradient(ellipse 34% 38% at 5% 42%, rgba(22, 64, 164, .14), transparent 78%),
    radial-gradient(ellipse 34% 38% at 95% 64%, rgba(75, 38, 177, .13), transparent 78%),
    linear-gradient(180deg, #000 0%, #02050d 18%, #030816 52%, #01040c 84%, #000 100%) !important;
}

html body .services-orbit::before,
html[data-theme="light"] body .services-orbit::before,
html[data-theme="dark"] body .services-orbit::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -8%;
  display: block !important;
  background:
    radial-gradient(circle, rgba(255,255,255,.95) 0 1px, transparent 1.5px) 4px 7px / 83px 83px,
    radial-gradient(circle, rgba(137,183,255,.8) 0 1px, transparent 1.7px) 31px 46px / 127px 127px,
    radial-gradient(circle, rgba(255,255,255,.48) 0 .7px, transparent 1.3px) 18px 25px / 47px 47px !important;
  opacity: .78;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
  pointer-events: none;
  animation: services-star-drift 42s linear infinite;
}

html body .services-orbit::after,
html[data-theme="light"] body .services-orbit::after,
html[data-theme="dark"] body .services-orbit::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block !important;
  background:
    radial-gradient(ellipse 43% 18% at 50% 61%, rgba(50, 121, 255, .27), transparent 72%),
    radial-gradient(ellipse 31% 42% at 50% 54%, rgba(95, 60, 206, .14), transparent 74%),
    radial-gradient(circle at 13% 31%, rgba(91, 151, 255, .11), transparent 20%),
    radial-gradient(circle at 87% 73%, rgba(105, 74, 215, .1), transparent 22%),
    linear-gradient(90deg, rgba(0,0,0,.2), transparent 20%, transparent 80%, rgba(0,0,0,.2)) !important;
  pointer-events: none;
}

/* FAQ renovado: contenido orientado a decisiones y acordeón con mayor jerarquía. */
.faq .faq-intro {
  max-width: 650px;
  color: #a6b3c7;
  font-size: 14px;
  line-height: 1.8;
}

.faq-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 22px;
}

.faq-highlights > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 31px;
  padding: 0 11px;
  border: 1px solid rgba(82, 145, 255, .22);
  border-radius: 999px;
  color: #c4d1e4;
  background: rgba(15, 42, 82, .32);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .15px;
}

.faq-highlights i {
  display: grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #1068f8;
  box-shadow: 0 0 12px rgba(16, 104, 248, .55);
  font-size: 9px;
  font-style: normal;
}

.faq .faq-list {
  margin-top: 28px;
}

.faq .faq-list details {
  position: relative;
  margin: 0 0 9px;
  overflow: hidden;
  border: 1px solid rgba(110, 157, 233, .15) !important;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(19, 31, 51, .74), rgba(8, 13, 23, .88));
  transition: border-color .28s ease, background .28s ease, box-shadow .28s ease, transform .28s ease;
}

.faq .faq-list details:hover {
  border-color: rgba(77, 139, 243, .38) !important;
  transform: translateX(3px);
}

.faq .faq-list details[open] {
  border-color: rgba(16, 104, 248, .62) !important;
  background: linear-gradient(135deg, rgba(13, 54, 119, .58), rgba(7, 18, 37, .96));
  box-shadow: 0 13px 32px rgba(0, 54, 151, .18), inset 3px 0 #1068f8;
}

.faq .faq-list summary {
  min-height: 66px;
  gap: 20px;
  padding: 0 17px 0 19px;
  color: #e8eef9;
  font-size: 13px;
}

.faq .faq-list .faq-question {
  display: flex;
  align-items: center;
  gap: 13px;
  width: auto;
  height: auto;
  border-radius: 0;
  color: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: inherit;
  transform: none !important;
  transition: color .25s ease;
}

.faq .faq-list details[open] summary .faq-question {
  color: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

.faq .faq-list .faq-question small {
  flex: 0 0 auto;
  color: #5593f8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .8px;
}

.faq .faq-list .faq-toggle {
  position: relative;
  display: grid;
  flex: 0 0 29px;
  width: 29px;
  height: 29px;
  place-items: center;
  border: 1px solid rgba(105, 159, 247, .3);
  border-radius: 50%;
  color: #8ab5fb;
  background: rgba(16, 104, 248, .09);
  transition: color .25s ease, background .25s ease, border-color .25s ease, transform .3s ease;
}

.faq .faq-list .faq-toggle::before,
.faq .faq-list .faq-toggle::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 1.5px;
  border-radius: 2px;
  background: currentColor;
}

.faq .faq-list .faq-toggle::after { transform: rotate(90deg); }

.faq .faq-list details[open] .faq-toggle {
  color: #fff !important;
  border-color: #1068f8;
  background: #1068f8 !important;
  transform: rotate(180deg);
  box-shadow: 0 0 16px rgba(16, 104, 248, .45) !important;
}

.faq .faq-list details[open] .faq-toggle::after { transform: rotate(0); }

.faq .faq-list details p {
  max-width: 690px;
  padding: 0 62px 22px 51px;
  color: #a9b7ca;
  font-size: 12px;
  line-height: 1.85;
}

.faq-visual-card {
  position: absolute !important;
  z-index: 4 !important;
  right: calc(15% + 14px) !important;
  bottom: 28px !important;
  left: 30px !important;
  display: grid;
  grid-template-columns: 40px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(158, 195, 255, .34);
  border-radius: 13px;
  color: #fff !important;
  background: rgba(2, 10, 24, .78);
  box-shadow: 0 16px 35px rgba(0, 0, 0, .35), inset 0 1px rgba(255, 255, 255, .08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  text-align: left !important;
}

.faq-visual-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(145deg, #277cff, #0752ce);
  box-shadow: 0 8px 18px rgba(16, 104, 248, .4);
  font-size: 20px;
  font-weight: 800;
}

.faq-visual-card > span:nth-child(2) { display: grid; gap: 4px; }
.faq-visual-card small { color: #8fbaff; font-size: 7px; font-weight: 800; letter-spacing: 1px; }
.faq-visual-card strong { color: #fff; font-size: 11px; line-height: 1.25; }
.faq-visual-card a { display: inline-flex; align-items: center; gap: 6px; color: #fff; font-size: 9px; font-weight: 800; white-space: nowrap; }
.faq-visual-card a b { color: #75a9ff; font-size: 14px; }

.faq-response-badge {
  position: absolute;
  z-index: 5;
  top: 26px;
  right: -11px;
  display: grid;
  gap: 2px;
  min-width: 112px;
  padding: 12px 15px;
  border: 1px solid rgba(145, 187, 255, .45);
  border-radius: 11px;
  color: #fff;
  background: linear-gradient(145deg, rgba(20, 108, 249, .95), rgba(5, 63, 159, .96));
  box-shadow: 0 14px 28px rgba(4, 49, 132, .38);
}

.faq-response-badge strong { font-size: 16px; line-height: 1; }
.faq-response-badge span { color: #dce9ff; font-size: 7px; font-weight: 700; letter-spacing: .35px; text-transform: uppercase; }

html[data-theme="light"] .faq-highlights > span {
  border-color: rgba(36, 102, 201, .18);
  color: #345779;
  background: rgba(235, 244, 255, .9);
}

html[data-theme="light"] .faq .faq-list details,
html[data-theme="light"] .faq .faq-list details[open] {
  border: 1px solid rgba(70, 127, 213, .2) !important;
  background: linear-gradient(135deg, #fff, #f2f7ff);
  box-shadow: 0 9px 24px rgba(37, 85, 155, .07);
}

html[data-theme="light"] .faq .faq-list details[open] {
  border-color: rgba(16, 104, 248, .55) !important;
  box-shadow: 0 13px 28px rgba(38, 98, 184, .12), inset 3px 0 #1068f8;
}

html[data-theme="light"] .faq .faq-list summary,
html[data-theme="light"] .faq .faq-list details[open] summary {
  color: #102e59 !important;
  background: transparent !important;
}

html[data-theme="light"] .faq .faq-list details p {
  color: #4d6787 !important;
}

@media (max-width: 560px) {
  .faq-highlights { gap: 7px; }
  .faq-highlights > span { font-size: 8px; }
  .faq .faq-list summary { min-height: 72px; padding-left: 14px; font-size: 12px; }
  .faq .faq-list .faq-question { gap: 9px; }
  .faq .faq-list details p { padding: 0 48px 20px 40px; font-size: 11px; }
  .faq-visual-card { right: 18px !important; bottom: 18px !important; left: 18px !important; grid-template-columns: 36px 1fr; }
  .faq-visual-icon { width: 36px; height: 36px; }
  .faq-visual-card a { grid-column: 2; }
  .faq-response-badge { right: 5px; }
}

@keyframes services-star-drift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-42px, 28px, 0); }
}

@media (prefers-reduced-motion: reduce) {
  html body .services-orbit::before { animation: none; }
}

@media (max-width: 620px) {
  html body .testimonials-heading h2 {
    font-size: 42px;
    letter-spacing: -2.5px;
  }
}

/* FAQ visual: la foto no debe imponer su proporción vertical al contenedor. */
.faq-visual-wrap,
.faq-visual {
  height: 530px;
  min-height: 0;
}

.faq-visual img,
html[data-theme="light"] .faq-visual img,
html[data-theme="dark"] .faq-visual img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

@media (max-width: 860px) {
  .faq-visual-wrap,
  .faq-visual,
  html[data-theme="light"] .faq-visual-wrap,
  html[data-theme="light"] .faq-visual,
  html[data-theme="dark"] .faq-visual-wrap,
  html[data-theme="dark"] .faq-visual {
    height: 390px;
    min-height: 0;
  }

  .faq-visual,
  .faq-visual::before,
  html[data-theme="light"] .faq-visual,
  html[data-theme="light"] .faq-visual::before,
  html[data-theme="dark"] .faq-visual,
  html[data-theme="dark"] .faq-visual::before {
    clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
  }

  .faq-visual-card {
    right: calc(7% + 14px) !important;
  }
}

/* Refinamiento final: contacto sobrio, confirmación flotante y footer legible. */
html body .contact-form,
html[data-theme="light"] body .contact-form,
html[data-theme="dark"] body .contact-form {
  padding: 34px 36px 30px !important;
  border-color: rgba(171, 190, 220, .18) !important;
  border-radius: 14px !important;
  background: rgba(8, 13, 22, .94) !important;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .04) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

html body .contact-form::before {
  border-top: 2px solid rgba(64, 126, 226, .75);
  background: none;
}

html body .contact-form-head { margin-bottom: 26px; }
html body .contact-form-head > div > span { color: #83a9e4 !important; letter-spacing: 1.45px; }
html body .contact-form-head h3,
html[data-theme="light"] body .contact-form-head h3,
html[data-theme="dark"] body .contact-form-head h3 {
  color: #f4f7fb !important;
  font-size: 24px !important;
  font-weight: 650 !important;
  letter-spacing: -.7px !important;
}
html body .contact-form-head > small { color: #a5b0c0; font-size: 9px; }
html body .contact-form-head > small i { background: #61c995; box-shadow: 0 0 0 3px rgba(97, 201, 149, .1); }

html body .contact-fields { gap: 17px 14px; }
html body .contact-fields label,
html[data-theme="light"] body .contact-fields label,
html[data-theme="dark"] body .contact-fields label {
  color: #c4cedd !important;
  font-size: 10px;
  font-weight: 600 !important;
}
html body .contact-fields :is(input, select, textarea),
html[data-theme="light"] body .contact-fields :is(input, select, textarea),
html[data-theme="dark"] body .contact-fields :is(input, select, textarea) {
  min-height: 49px;
  border-color: rgba(157, 177, 207, .18) !important;
  border-radius: 7px !important;
  color: #edf2f9 !important;
  background: #0f1723 !important;
  font-size: 12px;
  box-shadow: none !important;
}
html body .contact-fields :is(input, select, textarea):hover { border-color: rgba(157, 184, 224, .35) !important; }
html body .contact-fields :is(input, select, textarea):focus {
  border-color: #5b8edb !important;
  background: #121c2a !important;
  box-shadow: 0 0 0 3px rgba(71, 126, 210, .12) !important;
}
html body .contact-fields :is(input, textarea)::placeholder { color: #77869b !important; }
html body .contact-form-assurance { margin-top: 17px; color: #9aa8ba; font-size: 9px; }
html body .contact-consent,
html[data-theme="light"] body .contact-consent,
html[data-theme="dark"] body .contact-consent { color: #98a6b8 !important; font-size: 9px; }

html body .contact-actions {
  grid-template-columns: minmax(0, 1fr) 150px;
  align-items: center;
  gap: 12px;
  margin-top: 19px;
}
html body .contact-submit {
  height: 48px;
  border: 1px solid #2f73d9;
  border-radius: 7px;
  background: #1764d7;
  box-shadow: none;
  font-size: 10px;
  letter-spacing: .25px;
}
html body .contact-submit:hover,
html body .contact-submit:focus-visible {
  background: #2472e1;
  box-shadow: 0 10px 24px rgba(16, 85, 189, .24);
}

html body .contact-whatsapp.whatsapp-expand {
  justify-self: end;
  width: 45px !important;
  min-width: 45px;
  height: 45px;
  padding: 0 !important;
  border: 1px solid rgba(0, 215, 87, .45);
  border-radius: 50% !important;
  color: #fff;
  background: #00b94f !important;
  box-shadow: 0 0 18px rgba(0, 215, 87, .16), 2px 2px 10px rgba(0, 0, 0, .2);
}
html body .contact-whatsapp.whatsapp-expand:hover,
html body .contact-whatsapp.whatsapp-expand:focus-visible {
  width: 150px !important;
  border-color: rgba(0, 215, 87, .7);
  border-radius: 999px !important;
  background: #00d757 !important;
  box-shadow: 0 0 24px rgba(0, 215, 87, .26), 2px 2px 12px rgba(0, 0, 0, .22);
}
html body .contact-whatsapp .whatsapp-sign { padding: 0; }
html body .contact-whatsapp .whatsapp-text { color: #fff; font-size: 11px; }

.contact-success-toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1400;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: min(390px, calc(100% - 32px));
  padding: 15px 17px;
  border: 1px solid rgba(109, 202, 155, .42);
  border-radius: 12px;
  color: #eefaf4;
  background: rgba(8, 20, 17, .96);
  box-shadow: 0 22px 55px rgba(0, 0, 0, .4), inset 0 1px rgba(255, 255, 255, .06);
  backdrop-filter: blur(12px);
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .25s ease, transform .25s ease;
}
.contact-success-toast[hidden] { display: none; }
.contact-success-toast.is-visible { opacity: 1; transform: translateY(0); }
.contact-success-toast-icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 50%;
  color: #07130d;
  background: #65d39b;
  font-size: 17px;
  font-weight: 800;
}
.contact-success-toast strong,
.contact-success-toast small { display: block; }
.contact-success-toast strong { color: #f4fff9; font-size: 12px; font-weight: 750; }
.contact-success-toast small { margin-top: 4px; color: #a8c6b7; font-size: 10px; line-height: 1.45; }

/* Pie de página: jerarquía tipográfica y contraste consistentes en ambos temas. */
html body .footer.footer-search-section,
html[data-theme="light"] body .footer.footer-search-section,
html[data-theme="dark"] body .footer.footer-search-section {
  color: #edf3fb !important;
  background-image:
    linear-gradient(90deg, rgba(2, 6, 12, .94), rgba(5, 12, 23, .85) 48%, rgba(2, 6, 12, .95)),
    url("assets/images/footer/footer-liquid-dark.webp") !important;
  background-position: center !important;
  background-size: cover !important;
}
html body .footer.footer-search-section::after { background: linear-gradient(180deg, rgba(25, 65, 126, .08), transparent 24%, rgba(0, 0, 0, .34) 100%) !important; }
html body .footer.footer-search-section :is(.footer-search-content, .footer-grid) { text-shadow: none; }
html body .footer .footer-search-content { padding-block: 48px 42px; border-bottom-color: rgba(153, 177, 214, .18); }
html body .footer .footer-search-content h2 {
  color: #f4f7fb !important;
  font-size: clamp(34px, 3.2vw, 48px);
  font-weight: 700;
  letter-spacing: -2px;
  text-transform: none;
}
html body .footer .footer-search-content h2 span { color: #76a6f2 !important; -webkit-text-fill-color: #76a6f2 !important; }
html body .footer .footer-search-content > p { color: #b0bdcf !important; font-size: 13px; line-height: 1.7; }
html body .footer .footer-search-links a {
  padding: 8px 12px;
  border-color: rgba(151, 178, 220, .22);
  color: #b9c7da !important;
  background: rgba(255, 255, 255, .025);
  font-size: 10px;
}
html body .footer .footer-search-links a:hover { color: #fff !important; background: rgba(62, 113, 196, .18); }
html body .footer .footer-grid--jexora { padding-top: 64px; }
html body .footer-brand p,
html[data-theme="light"] body .footer-brand p { color: #b0bdcf !important; font-size: 12px; line-height: 1.75; }
html body .footer-column h3,
html body .footer .newsletter h3,
html[data-theme="light"] body .footer-column h3,
html[data-theme="light"] body .footer .newsletter h3 {
  color: #f3f6fb !important;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 1.2px;
}
html body .footer-column a,
html[data-theme="light"] body .footer-column a { color: #aebccf !important; font-size: 12px; line-height: 1.45; }
html body .footer-column a:hover { color: #fff !important; }
html body .footer .newsletter,
html[data-theme="light"] body .footer .newsletter {
  padding: 23px !important;
  border-color: rgba(143, 172, 217, .25) !important;
  border-radius: 12px;
  background: rgba(8, 16, 29, .62) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .045), 0 16px 38px rgba(0, 0, 0, .18) !important;
}
html body .footer .newsletter::before { display: none; }
html body .footer .newsletter > p,
html[data-theme="light"] body .footer .newsletter > p { color: #afbdd0 !important; font-size: 12px; }
html body .footer .footer-direct-link { padding: 10px 11px; border-color: rgba(146, 174, 216, .12); background: rgba(255, 255, 255, .018); }
html body .footer .footer-direct-link small,
html[data-theme="light"] body .footer .footer-direct-link small { color: #8fa1ba !important; font-size: 9px; }
html body .footer .footer-direct-link strong,
html[data-theme="light"] body .footer .footer-direct-link strong { color: #e1e9f5 !important; font-size: 11px; }
html body .footer .footer-bottom,
html body .footer .footer-bottom p,
html body .footer .footer-bottom div span,
html[data-theme="light"] body .footer .footer-bottom,
html[data-theme="light"] body .footer .footer-bottom p,
html[data-theme="light"] body .footer .footer-bottom div span { color: #94a4ba !important; font-size: 10px; }
html body .footer .footer-bottom a,
html[data-theme="light"] body .footer .footer-bottom a { color: #b8d2fb !important; }

@media (max-width: 720px) {
  html body .contact-form,
  html[data-theme="light"] body .contact-form,
  html[data-theme="dark"] body .contact-form { padding: 27px 20px 24px !important; }
  html body .contact-actions { grid-template-columns: 1fr; }
  html body .contact-whatsapp.whatsapp-expand,
  html body .contact-whatsapp.whatsapp-expand:hover,
  html body .contact-whatsapp.whatsapp-expand:focus-visible {
    justify-self: stretch;
    width: 100% !important;
    border-radius: 7px !important;
  }
  html body .contact-whatsapp .whatsapp-text {
    position: static;
    width: auto;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  html body .contact-whatsapp.whatsapp-expand { justify-content: center; padding-right: 43px !important; }
  .contact-success-toast { right: 16px; bottom: 16px; }
  html body .footer .footer-search-content h2 { font-size: 35px; letter-spacing: -1.5px; }
  html body .footer .footer-grid--jexora { padding-top: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  .contact-success-toast,
  html body .contact-whatsapp.whatsapp-expand { transition: none; }
}

/* Contacto — panel editorial y formulario de conversión */
html body .contact-showcase,
html[data-theme="light"] body .contact-showcase,
html[data-theme="dark"] body .contact-showcase {
  padding: 112px 0 120px !important;
  background: #000 !important;
}

html body .contact-showcase > .container {
  width: min(1440px, calc(100% - 48px));
  max-width: none;
}

html body .contact-shell,
html[data-theme="light"] body .contact-shell,
html[data-theme="dark"] body .contact-shell {
  display: block !important;
  min-height: 790px !important;
  overflow: hidden;
  border: 1px solid rgba(119, 167, 240, .2) !important;
  border-radius: 28px !important;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .97) 0%, rgba(0, 0, 0, .91) 43%, rgba(0, 0, 0, .3) 70%, rgba(0, 0, 0, .05) 100%),
    url("assets/images/about/contact-consultant-v2.webp") right center / cover no-repeat !important;
  box-shadow: 0 34px 90px rgba(0, 0, 0, .46), inset 0 1px rgba(255, 255, 255, .035) !important;
}

html body .contact-shell::after,
html[data-theme="light"] body .contact-shell::after,
html[data-theme="dark"] body .contact-shell::after {
  display: block !important;
  background: linear-gradient(180deg, rgba(0, 0, 0, .32), transparent 20%, transparent 76%, rgba(0, 0, 0, .58)) !important;
}

html body .contact-copy,
html[data-theme="light"] body .contact-copy,
html[data-theme="dark"] body .contact-copy {
  position: relative;
  z-index: 2;
  width: min(58%, 720px) !important;
  padding: 66px 64px 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body .contact-copy h2,
html[data-theme="light"] body .contact-copy h2,
html[data-theme="dark"] body .contact-copy h2 {
  max-width: 620px;
  margin: 16px 0 18px !important;
  color: #f4f7fd !important;
  font-size: clamp(42px, 4.2vw, 64px) !important;
  font-weight: 800 !important;
  line-height: .97 !important;
  letter-spacing: -3.4px !important;
  text-transform: none !important;
  -webkit-text-fill-color: #f4f7fd !important;
}

html body .contact-copy h2 span,
html[data-theme="light"] body .contact-copy h2 span,
html[data-theme="dark"] body .contact-copy h2 span {
  color: #1068f8 !important;
  background: none !important;
  -webkit-text-fill-color: #1068f8 !important;
}

html body .contact-copy > p,
html[data-theme="light"] body .contact-copy > p,
html[data-theme="dark"] body .contact-copy > p {
  max-width: 540px;
  color: #aebbd0 !important;
  font-size: 13px;
  line-height: 1.75;
}

html body .contact-copy .contact-direct {
  display: flex !important;
  gap: 28px;
  margin-top: 26px;
}

html body .contact-copy .contact-direct a {
  grid-template-columns: 34px 1fr;
  min-width: 0;
  padding: 0 !important;
  border: 0 !important;
}

html body .contact-copy .contact-direct a > span {
  width: 34px;
  height: 34px;
  border-color: rgba(117, 169, 255, .38);
  border-radius: 50%;
  color: #80b2ff;
  background: rgba(16, 104, 248, .1);
}

html body .contact-copy .contact-direct strong { color: #e1e9f6; font-size: 10px; }
html body .contact-copy .contact-direct small { color: #72829b; }
html body .contact-copy .contact-orbit-mark { display: none !important; }

html body .contact-form,
html[data-theme="light"] body .contact-form,
html[data-theme="dark"] body .contact-form {
  position: relative !important;
  z-index: 3 !important;
  width: min(58%, 720px) !important;
  margin: 34px 0 66px 42px !important;
  padding: 30px 34px 27px !important;
  border: 1px solid rgba(133, 178, 244, .22) !important;
  border-radius: 18px !important;
  color: #ecf3ff !important;
  background: linear-gradient(145deg, rgba(12, 23, 42, .88), rgba(3, 9, 19, .94)) !important;
  box-shadow: 0 24px 54px rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .055) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

html body .contact-form::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: radial-gradient(circle at 0 0, rgba(16, 104, 248, .13), transparent 36%);
  pointer-events: none;
}

html body .contact-form-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 23px;
}

html body .contact-form-head > div > span { color: #76aaf8 !important; font-size: 8px; font-weight: 800; letter-spacing: 1.2px; }
html body .contact-form-head h3,
html[data-theme="light"] body .contact-form-head h3,
html[data-theme="dark"] body .contact-form-head h3 {
  margin: 7px 0 0 !important;
  color: #fff !important;
  font-size: 25px !important;
  font-weight: 750;
  letter-spacing: -1px !important;
  text-transform: none;
}
html body .contact-form-head h3::before { content: none !important; display: none !important; }
html body .contact-form-head > small { display: flex; flex: none; align-items: center; gap: 7px; margin-top: 4px; color: #91a2ba; font-size: 8px; font-weight: 650; }
html body .contact-form-head > small i { width: 6px; height: 6px; border-radius: 50%; background: #36c988; box-shadow: 0 0 0 4px rgba(54, 201, 136, .1), 0 0 12px rgba(54, 201, 136, .5); }

html body .contact-fields { gap: 14px 13px; }
html body .contact-fields label,
html[data-theme="light"] body .contact-fields label,
html[data-theme="dark"] body .contact-fields label { gap: 7px; color: #b8c5d8 !important; font-size: 9px; font-weight: 700 !important; letter-spacing: .08px; }

html body .contact-fields :is(input, select, textarea),
html[data-theme="light"] body .contact-fields :is(input, select, textarea),
html[data-theme="dark"] body .contact-fields :is(input, select, textarea) {
  min-height: 47px;
  padding: 12px 14px;
  border: 1px solid rgba(127, 162, 213, .2) !important;
  border-radius: 9px !important;
  color: #edf4ff !important;
  background: rgba(1, 7, 17, .72) !important;
  font-size: 11px;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
}
html body .contact-fields textarea { min-height: 104px; line-height: 1.55; }
html body .contact-fields select { color-scheme: dark; }
html body .contact-fields :is(input, select, textarea):hover { border-color: rgba(126, 174, 244, .38) !important; }
html body .contact-fields :is(input, select, textarea):focus {
  border-color: #397fe8 !important;
  background: rgba(3, 12, 27, .88) !important;
  box-shadow: 0 0 0 3px rgba(16, 104, 248, .14) !important;
}
html body .contact-fields :is(input, textarea)::placeholder { color: #687992 !important; }
html body .contact-fields label.has-error :is(input, select, textarea) { border-color: #f06f7f !important; box-shadow: 0 0 0 3px rgba(240, 111, 127, .08) !important; }
html body .contact-field-error { margin-top: 0; color: #ff9ba8; font-size: 8px; }

html body .contact-form-assurance { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 15px; color: #7f91aa; font-size: 8px; }
html body .contact-form-assurance span::first-letter { color: #4bd296; }
html body .contact-consent,
html[data-theme="light"] body .contact-consent,
html[data-theme="dark"] body .contact-consent { align-items: flex-start; margin-top: 13px; color: #8292aa !important; font-size: 8px; line-height: 1.45; }
html body .contact-consent input { flex: none; margin-top: 1px; accent-color: #1068f8; }
html body .contact-consent.has-error { color: #ff9ba8 !important; }

html body .contact-actions { display: grid; grid-template-columns: minmax(0, 1fr) 132px; gap: 10px; margin-top: 16px; }
html body .contact-submit {
  height: 48px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px;
  background: linear-gradient(100deg, #1068f8, #3f7ff1);
  box-shadow: 0 12px 25px rgba(16, 104, 248, .22);
  font-size: 9px;
}
html body .contact-submit:hover { box-shadow: 0 16px 30px rgba(16, 104, 248, .34); }
html body .contact-submit:disabled { opacity: .62; cursor: wait; transform: none; }
html body .contact-submit-icon { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .15); font-size: 15px; }
html body .contact-whatsapp {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 0 14px;
  border: 1px solid rgba(64, 199, 130, .36);
  border-radius: 9px;
  color: #bbefd4;
  background: rgba(24, 139, 83, .1);
  font-size: 9px;
  font-weight: 750;
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
html body .contact-whatsapp b { color: #6ee0a5; font-size: 14px; }
html body .contact-whatsapp:hover { border-color: rgba(72, 218, 144, .65); background: rgba(24, 139, 83, .2); transform: translateY(-1px); }
html body .contact-form-status { min-height: 17px; margin: 12px 0 0; color: #91a2ba; font-size: 9px; line-height: 1.5; }
html body .contact-form-status.is-success { color: #70dca6; }
html body .contact-form-status.is-error { color: #ff9ba8; }
html body .contact-form-status a { color: inherit; font-weight: 800; }
html body .contact-visual { display: none !important; }
body .whatsapp-chat { transition: opacity .22s ease, transform .22s ease; }
body.is-contact-visible .whatsapp-chat { opacity: 0; pointer-events: none; transform: translateY(18px); }

/* Jack: recorrido conversacional guiado, sin respuestas generadas por IA. */
body .whatsapp-chat-panel {
  grid-template-rows: auto 3px minmax(0, 1fr) auto;
  width: min(390px, calc(100vw - 28px));
  height: min(570px, calc(100vh - 120px));
  overflow: hidden;
  border: 1px solid rgba(148, 167, 194, .32);
  border-radius: 22px 22px 22px 7px;
  color: #17243a;
  background: #f8f7f3;
  box-shadow: 0 24px 70px rgba(2, 12, 31, .38);
}
body .whatsapp-chat-panel header {
  min-height: 68px;
  padding: 12px 16px;
  background: #102a50;
}
body .whatsapp-chat-panel header strong { font-size: 14px; letter-spacing: -.15px; }
body .whatsapp-chat-panel header small { margin-top: 2px; color: #bfd0e8; font-size: 10px; }
body .whatsapp-chat-close {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
}
body .jack-guide-progress { overflow: hidden; background: #dde3eb; }
body .jack-guide-progress span {
  display: block;
  width: 22%;
  height: 100%;
  border-radius: 0 99px 99px 0;
  background: #3478ca;
  transition: width .28s ease;
}
body .whatsapp-chat-messages {
  display: block;
  overflow-y: auto;
  padding: 21px 18px 24px;
  color: #17243a;
  background: #f8f7f3;
  scrollbar-width: thin;
  scrollbar-color: #c4cbd4 transparent;
}
body .jack-conversation { display: flex; flex-direction: column; gap: 16px; }
body .jack-path-step {
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .2s ease, transform .2s ease;
}
body .jack-path-step.is-visible { opacity: 1; transform: none; }
body .jack-path-eyebrow {
  display: block;
  margin: 0 0 7px 2px;
  color: #64738a;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .9px;
  text-transform: uppercase;
}
body .whatsapp-chat-message {
  width: auto;
  max-width: none;
  border: 0;
  font-size: 12px;
  line-height: 1.6;
  white-space: normal;
}
body .whatsapp-chat-message.is-bot {
  margin: 0;
  padding: 0 3px 13px;
  color: #182943;
  background: transparent;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -.1px;
}
body .whatsapp-chat-message.is-user {
  align-self: flex-end;
  max-width: 78%;
  margin: -4px 0 0;
  padding: 8px 12px;
  border: 0;
  border-radius: 14px 14px 4px 14px;
  color: #fff;
  background: #2f65aa;
  font-size: 10px;
  box-shadow: none;
}
body .jack-path-options { display: grid; gap: 7px; }
body .jack-path-options button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  gap: 10px;
  align-items: center;
  width: 100%;
  min-height: 55px;
  padding: 10px 12px 10px 14px;
  border: 1px solid #d9dee5;
  border-radius: 10px;
  color: #1a2b43;
  background: #fff;
  box-shadow: 0 2px 8px rgba(20, 42, 73, .035);
  text-align: left;
  font-family: Inter, Arial, sans-serif;
  cursor: pointer;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
body .jack-path-options button:hover,
body .jack-path-options button:focus-visible {
  border-color: #6f94c5;
  outline: 0;
  box-shadow: 0 5px 16px rgba(24, 66, 118, .1);
  transform: translateY(-1px);
}
body .jack-path-options button:disabled { cursor: default; opacity: .48; transform: none; }
body .jack-path-options button span { min-width: 0; }
body .jack-path-options button b,
body .jack-path-options button small { display: block; }
body .jack-path-options button b { font-size: 11px; line-height: 1.3; }
body .jack-path-options button small { margin-top: 3px; color: #758196; font-size: 9px; line-height: 1.35; }
body .jack-path-options button i { color: #7890ae; font-size: 16px; font-style: normal; }
body .jack-path-options button.is-primary {
  min-height: 61px;
  border-color: #158a55;
  color: #fff;
  background: #168c57;
  box-shadow: 0 8px 20px rgba(22, 140, 87, .18);
}
body .jack-path-options button.is-primary small,
body .jack-path-options button.is-primary i { color: #d9f4e7; }
body .jack-path-step.is-result {
  padding: 16px;
  border: 1px solid #d9dee5;
  border-radius: 15px 15px 15px 5px;
  background: #fff;
}
body .jack-guide-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 8px 13px;
  border-top: 1px solid #e0e3e7;
  background: #fff;
}
body .jack-guide-footer button {
  border: 0;
  padding: 7px 5px;
  color: #53647b;
  background: transparent;
  font: 700 9px/1 Inter, Arial, sans-serif;
  cursor: pointer;
}
body .jack-guide-footer button:hover { color: #1d5fae; }
body .jack-guide-footer button:disabled { opacity: .3; cursor: default; }
body .jack-welcome {
  border-color: rgba(155, 175, 202, .35);
  border-radius: 20px 20px 20px 7px;
  color: #17243a;
  background: #fff;
  box-shadow: 0 22px 60px rgba(3, 18, 42, .34);
}
body .jack-welcome::before,
body .jack-welcome::after { display: none; }
body .jack-welcome strong { color: #17243a; }
body .jack-welcome p { color: #627086; font-size: 10px; }
body .jack-welcome-close { color: #52627a; background: #eef1f5; }
body .jack-choice { border-radius: 10px; }
body .jack-choice--chat { border-color: #dbe2eb; color: #1c3555; background: #f3f6fa; }
body .jack-choice--chat:hover,
body .jack-choice--chat:focus-visible { background: #e9eff7; }
body .jack-choice--chat b { color: #1c3555; }
body .jack-choice--chat small { color: #697990; }
body .jack-choice--chat span { color: #2f65aa; background: #dce9f8; }

@media (max-width: 760px) {
  body .whatsapp-chat-panel {
    right: 0;
    bottom: 94px;
    width: min(382px, calc(100vw - 24px));
    height: min(550px, calc(100vh - 115px));
    border-radius: 18px 18px 18px 6px;
  }
  body .whatsapp-chat-messages { padding: 18px 15px 22px; }
}

@media (prefers-reduced-motion: reduce) {
  body .jack-path-step,
  body .jack-guide-progress span,
  body .jack-path-options button { transition: none; }
}

@media (max-width: 980px) {
  html body .contact-copy,
  html body .contact-form { width: 68% !important; }
  html body .contact-copy { padding-inline: 42px !important; }
  html body .contact-form { margin-left: 28px !important; }
}

@media (max-width: 720px) {
  html body .contact-showcase,
  html[data-theme="light"] body .contact-showcase,
  html[data-theme="dark"] body .contact-showcase { padding: 56px 0 72px !important; }
  html body .contact-showcase > .container { width: min(100% - 24px, 540px); }
  html body .contact-shell,
  html[data-theme="light"] body .contact-shell,
  html[data-theme="dark"] body .contact-shell {
    min-height: 0 !important;
    padding-top: 285px;
    border-radius: 20px !important;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, .04) 0, rgba(0, 0, 0, .18) 215px, #03070d 290px),
      url("assets/images/about/contact-consultant-v2.webp") 82% top / auto 320px no-repeat !important;
  }
  html body .contact-copy,
  html[data-theme="light"] body .contact-copy,
  html[data-theme="dark"] body .contact-copy { width: auto !important; padding: 31px 23px 22px !important; }
  html body .contact-copy h2,
  html[data-theme="light"] body .contact-copy h2,
  html[data-theme="dark"] body .contact-copy h2 { font-size: 39px !important; letter-spacing: -2.3px !important; }
  html body .contact-copy .contact-direct { display: grid !important; grid-template-columns: 1fr; gap: 12px; }
  html body .contact-form,
  html[data-theme="light"] body .contact-form,
  html[data-theme="dark"] body .contact-form { width: auto !important; margin: 0 12px 18px !important; padding: 25px 18px 22px !important; border-radius: 14px !important; }
  html body .contact-form-head { display: block; }
  html body .contact-form-head > small { margin-top: 11px; }
  html body .contact-fields { grid-template-columns: 1fr; }
  html body .contact-fields label,
  html body .contact-fields .contact-field-wide { grid-column: auto; }
  html body .contact-actions { grid-template-columns: 1fr; }
  html body .contact-whatsapp { min-height: 45px; }
}

@media (max-width: 560px) {
  .faq-visual-wrap,
  .faq-visual,
  html[data-theme="light"] .faq-visual-wrap,
  html[data-theme="light"] .faq-visual,
  html[data-theme="dark"] .faq-visual-wrap,
  html[data-theme="dark"] .faq-visual {
    height: 330px;
  }

  .faq-visual-wrap::before,
  html[data-theme="light"] .faq-visual-wrap::before,
  html[data-theme="dark"] .faq-visual-wrap::before {
    inset: 10px 0 -12px 10px;
  }

  .faq-visual-wrap::after,
  html[data-theme="light"] .faq-visual-wrap::after,
  html[data-theme="dark"] .faq-visual-wrap::after {
    inset: 20px 0 -22px 20px;
  }

  .faq-visual-card {
    right: calc(7% + 10px) !important;
    left: 16px !important;
    gap: 10px;
    padding: 11px;
  }

  .faq-visual-card strong {
    font-size: 10px;
  }

  .faq-visual-card a {
    justify-self: start;
    white-space: normal;
  }

  .faq-response-badge {
    right: 8px;
  }
}

/* FAQ: composicion centrada verticalmente y dudas decorativas de fondo. */
.faq,
html[data-theme="light"] .faq,
html[data-theme="dark"] .faq {
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding-block: clamp(84px, 10vh, 128px);
}

.faq::before,
.faq::after,
html[data-theme="light"] .faq::before,
html[data-theme="light"] .faq::after,
html[data-theme="dark"] .faq::before,
html[data-theme="dark"] .faq::after {
  position: absolute;
  z-index: 2;
  color: rgba(54, 126, 245, .13);
  font-size: clamp(150px, 16vw, 270px);
  font-weight: 800;
  line-height: .8;
  text-shadow: 0 0 45px rgba(16, 104, 248, .18);
  pointer-events: none;
  user-select: none;
}

.faq::before,
html[data-theme="light"] .faq::before,
html[data-theme="dark"] .faq::before {
  content: "?";
  top: 17%;
  left: 1%;
  transform: rotate(-12deg);
}

.faq::after,
html[data-theme="light"] .faq::after,
html[data-theme="dark"] .faq::after {
  content: "?";
  right: 1.5%;
  bottom: 7%;
  transform: rotate(14deg);
}

.faq .faq-container {
  position: relative;
  z-index: 1;
  align-items: center;
}

@media (min-width: 861px) {
  .faq .faq-visual-wrap {
    transform: translateY(clamp(42px, 5vh, 58px));
  }
}

@media (max-width: 860px) {
  .faq,
  html[data-theme="light"] .faq,
  html[data-theme="dark"] .faq {
    min-height: auto;
    padding-block: 84px;
  }

  .faq::before,
  html[data-theme="light"] .faq::before,
  html[data-theme="dark"] .faq::before {
    top: 8%;
    left: -22px;
  }

  .faq::after,
  html[data-theme="light"] .faq::after,
  html[data-theme="dark"] .faq::after {
    right: -18px;
    bottom: 5%;
  }
}

/* Contacto: esta capa debe permanecer al final para prevalecer sobre variantes históricas. */
html body .contact-form,
html[data-theme="light"] body .contact-form,
html[data-theme="dark"] body .contact-form {
  padding: 34px 36px 30px !important;
  border-color: rgba(171, 190, 220, .18) !important;
  border-radius: 14px !important;
  background: rgba(8, 13, 22, .94) !important;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .04) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
html body .contact-form::before { border-top: 2px solid rgba(64, 126, 226, .75); background: none; }
html body .contact-form-head { margin-bottom: 26px; }
html body .contact-form-head > div > span { color: #83a9e4 !important; letter-spacing: 1.45px; }
html body .contact-form-head h3,
html[data-theme="light"] body .contact-form-head h3,
html[data-theme="dark"] body .contact-form-head h3 { color: #f4f7fb !important; font-size: 24px !important; font-weight: 650 !important; letter-spacing: -.7px !important; }
html body .contact-form-head > small { color: #a5b0c0; font-size: 9px; }
html body .contact-fields { gap: 17px 14px; }
html body .contact-fields label,
html[data-theme="light"] body .contact-fields label,
html[data-theme="dark"] body .contact-fields label { color: #c4cedd !important; font-size: 10px; font-weight: 600 !important; }
html body .contact-fields :is(input, select, textarea),
html[data-theme="light"] body .contact-fields :is(input, select, textarea),
html[data-theme="dark"] body .contact-fields :is(input, select, textarea) {
  min-height: 49px;
  border-color: rgba(157, 177, 207, .18) !important;
  border-radius: 7px !important;
  color: #edf2f9 !important;
  background: #0f1723 !important;
  font-size: 12px;
  box-shadow: none !important;
}
html body .contact-fields :is(input, select, textarea):hover { border-color: rgba(157, 184, 224, .35) !important; }
html body .contact-fields :is(input, select, textarea):focus { border-color: #5b8edb !important; background: #121c2a !important; box-shadow: 0 0 0 3px rgba(71, 126, 210, .12) !important; }
html body .contact-fields :is(input, textarea)::placeholder { color: #77869b !important; }
html body .contact-fields select { color-scheme: dark; }
html body .contact-fields select option {
  color: #edf2f9;
  background: #0f1723;
}
html body .contact-fields select option:disabled { color: #77869b; }
html[data-theme="light"] body .contact-fields select { color-scheme: light; }
html[data-theme="light"] body .contact-fields select option {
  color: #142b4e;
  background: #f4f8ff;
}
html body .contact-form-assurance { margin-top: 17px; color: #9aa8ba; font-size: 9px; }
html body .contact-consent,
html[data-theme="light"] body .contact-consent,
html[data-theme="dark"] body .contact-consent { color: #98a6b8 !important; font-size: 9px; }
html body .contact-actions { grid-template-columns: minmax(0, 1fr) 150px; align-items: center; gap: 12px; margin-top: 19px; }
html body .contact-submit { height: 48px; border: 1px solid #2f73d9; border-radius: 7px; background: #1764d7; box-shadow: none; font-size: 10px; letter-spacing: .25px; }
html body .contact-submit:hover,
html body .contact-submit:focus-visible { background: #2472e1; box-shadow: 0 10px 24px rgba(16, 85, 189, .24); }
html body .contact-whatsapp.whatsapp-expand { justify-self: end; width: 45px !important; min-width: 45px; height: 45px; padding: 0 !important; border: 1px solid rgba(0, 215, 87, .45); border-radius: 50% !important; color: #fff; background: #00b94f !important; box-shadow: 0 0 18px rgba(0, 215, 87, .16), 2px 2px 10px rgba(0, 0, 0, .2); }
html body .contact-whatsapp.whatsapp-expand:hover,
html body .contact-whatsapp.whatsapp-expand:focus-visible { width: 150px !important; border-color: rgba(0, 215, 87, .7); border-radius: 999px !important; background: #00d757 !important; box-shadow: 0 0 24px rgba(0, 215, 87, .26), 2px 2px 12px rgba(0, 0, 0, .22); }

@media (max-width: 720px) {
  html body .contact-form,
  html[data-theme="light"] body .contact-form,
  html[data-theme="dark"] body .contact-form { padding: 27px 20px 24px !important; }
  html body .contact-actions { grid-template-columns: 1fr; }
  html body .contact-whatsapp.whatsapp-expand,
  html body .contact-whatsapp.whatsapp-expand:hover,
  html body .contact-whatsapp.whatsapp-expand:focus-visible { justify-self: stretch; width: 100% !important; border-radius: 7px !important; }
  html body .contact-whatsapp .whatsapp-text { position: static; width: auto; opacity: 1; visibility: visible; transform: none; }
  html body .contact-whatsapp.whatsapp-expand { justify-content: center; padding-right: 43px !important; }
}

/* Título del buscador del footer: mismo tratamiento cromático de los títulos principales. */
html body .footer .footer-search-content h2,
html[data-theme="light"] body .footer .footer-search-content h2,
html[data-theme="dark"] body .footer .footer-search-content h2 {
  color: #f4f7fc !important;
  -webkit-text-fill-color: #f4f7fc !important;
}
html body .footer .footer-search-content h2 span,
html[data-theme="light"] body .footer .footer-search-content h2 span,
html[data-theme="dark"] body .footer .footer-search-content h2 span {
  display: block;
  color: transparent !important;
  background: linear-gradient(135deg, #ffffff 5%, #1068f8 48%, #003998 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Footer final: cierre editorial alineado con el sistema visual del sitio. */
html body .footer.footer-search-section {
  padding: 0 0 24px;
  border-top: 1px solid rgba(112, 160, 235, .28);
  background:
    radial-gradient(circle at 12% 0%, rgba(31, 103, 222, .22), transparent 31%),
    linear-gradient(rgba(65, 118, 207, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(65, 118, 207, .04) 1px, transparent 1px),
    #03070d;
  background-size: auto, 72px 72px, 72px 72px, auto;
}

html body .footer.footer-search-section::before {
  top: -210px;
  right: -80px;
  left: auto;
  width: min(62vw, 820px);
  height: 360px;
  border-color: rgba(109, 160, 246, .16);
  opacity: .9;
  transform: none;
}

.footer-cta {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(40px, 8vw, 130px);
  align-items: end;
  padding-top: 72px;
  padding-bottom: 64px;
  border-bottom: 1px solid rgba(125, 170, 241, .2);
}
.footer-search-panel {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(150px, .55fr) minmax(340px, 1.45fr);
  grid-template-areas: "label search" "links links";
  gap: 14px 28px;
  align-items: center;
  margin-top: 2px;
  padding: 24px 26px;
  border: 1px solid rgba(119, 166, 242, .22);
  border-radius: 12px;
  background: rgba(8, 18, 32, .66);
  box-shadow: inset 0 1px rgba(210, 228, 255, .06);
}
.footer-search-panel > label {
  grid-area: label;
  color: #dce8f9;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.footer-search-panel .footer-search-box.hero-search {
  grid-area: search;
  width: 100%;
  max-width: none;
  margin: 0;
}
.footer-search-panel .footer-search-links {
  grid-area: links;
  justify-content: flex-end;
  width: 100%;
  max-width: none;
  margin: 0;
}
.footer-search-panel .footer-search-links a { font-size: 9px; }

.footer-cta-copy { max-width: 760px; }
.footer-cta .about-kicker { margin: 0 0 18px; }
.footer-cta h2 {
  max-width: 740px;
  margin: 0;
  color: #f5f8fd;
  font-size: clamp(38px, 4.6vw, 66px);
  font-weight: 700;
  line-height: .98;
  letter-spacing: clamp(-3.8px, -.055em, -2px);
  text-transform: uppercase;
}
.footer-cta h2 span {
  display: block;
  color: transparent;
  background: linear-gradient(100deg, #c8deff, #6a9cf7 52%, #3e72d7);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.footer-cta-copy > p {
  max-width: 590px;
  margin: 22px 0 0;
  color: #95a5bc;
  font-size: 13px;
  line-height: 1.75;
}
.footer-cta-action {
  display: inline-flex;
  min-width: 225px;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 0 11px 0 22px;
  border: 1px solid rgba(122, 169, 246, .48);
  border-radius: 8px;
  color: #f7faff;
  background: rgba(25, 77, 158, .28);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .55px;
  text-transform: uppercase;
  transition: border-color .25s ease, background .25s ease, transform .25s ease;
}
.footer-cta-action b {
  display: grid;
  width: 37px;
  height: 37px;
  place-items: center;
  border-radius: 6px;
  color: #fff;
  background: #1764d7;
  font-size: 17px;
  transition: transform .25s ease;
}
.footer-cta-action:hover,
.footer-cta-action:focus-visible {
  border-color: rgba(154, 194, 255, .82);
  background: rgba(34, 94, 187, .4);
  transform: translateY(-3px);
}
.footer-cta-action:hover b { transform: rotate(8deg); }

html body .footer .footer-grid--jexora {
  grid-template-columns: minmax(240px, 1.25fr) minmax(135px, .68fr) minmax(150px, .78fr) minmax(270px, 1.12fr);
  gap: clamp(32px, 4.5vw, 70px);
  padding-top: 58px;
}
.footer .footer-brand p {
  max-width: 315px;
  margin: 14px 0 22px;
  color: #9cacc2 !important;
  font-size: 12px;
  line-height: 1.75;
}
.footer-location {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #8292a8;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .7px;
  text-transform: uppercase;
}
.footer-location i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #63a0ff;
  box-shadow: 0 0 10px rgba(99, 160, 255, .8);
}
.footer .footer-column,
.footer .newsletter { padding-top: 12px; }
.footer .footer-column h3,
.footer .newsletter h3 {
  margin: 0 0 27px;
  color: #f2f6fd;
  font-size: 10px;
  letter-spacing: 1.2px;
}
.footer .footer-column a {
  margin-bottom: 13px;
  color: #97a7bd;
  font-size: 11px;
}
.footer .newsletter {
  padding: 22px;
  border: 1px solid rgba(117, 166, 244, .3);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(16, 32, 57, .72), rgba(6, 12, 22, .72));
  box-shadow: inset 0 1px rgba(211, 229, 255, .08), 0 18px 38px rgba(0, 0, 0, .17);
}
.footer .newsletter > p {
  max-width: 290px;
  margin: -3px 0 13px;
  color: #96a6bd !important;
  font-size: 11px;
  line-height: 1.65;
}
.footer .footer-direct-link {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  width: 100%;
  margin-top: 7px;
  padding: 9px;
  border: 1px solid transparent;
  border-radius: 8px;
}
.footer-contact-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(112, 163, 247, .3);
  border-radius: 7px;
  color: #8eb8fa;
  background: rgba(48, 103, 194, .13);
  font-size: 15px;
}
.footer .footer-direct-link small { margin-bottom: 4px; color: #71849f; }
.footer .footer-direct-link strong { color: #dbe6f5; font-size: 11px; }
.footer .footer-social.topbar-social {
  width: 100%;
  margin-top: 15px;
  padding-top: 15px;
}
.footer .footer-bottom {
  position: relative;
  margin-top: 58px;
  padding-top: 20px;
  border-top-color: rgba(125, 170, 241, .17);
  color: #718199;
  font-size: 9px;
}

html[data-theme="light"] body .footer.footer-search-section {
  border-top-color: rgba(35, 92, 174, .18);
  background:
    radial-gradient(circle at 12% 0%, rgba(31, 103, 222, .12), transparent 31%),
    linear-gradient(rgba(49, 104, 197, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(49, 104, 197, .04) 1px, transparent 1px),
    #f8fbff !important;
  background-size: auto, 72px 72px, 72px 72px, auto !important;
}
html[data-theme="light"] .footer-cta { border-bottom-color: rgba(35, 92, 174, .16); }
html[data-theme="light"] .footer-search-panel {
  border-color: rgba(48, 103, 190, .18);
  background: rgba(255, 255, 255, .68);
  box-shadow: 0 12px 30px rgba(34, 78, 142, .06);
}
html[data-theme="light"] .footer-search-panel > label { color: #173a6a; }
html[data-theme="light"] .footer-cta h2 { color: #102950; }
html[data-theme="light"] .footer-cta-copy > p { color: #5d6f89; }
html[data-theme="light"] .footer-cta-action { color: #153767; background: rgba(255, 255, 255, .78); }
html[data-theme="light"] .footer-cta-action b { color: #fff; }
html[data-theme="light"] .footer .footer-brand p,
html[data-theme="light"] .footer .newsletter > p { color: #526681 !important; }
html[data-theme="light"] .footer-location { color: #5c6f89; }
html[data-theme="light"] .footer .newsletter {
  border-color: rgba(48, 103, 190, .2);
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 16px 34px rgba(34, 78, 142, .08);
}
html[data-theme="light"] .footer .footer-direct-link:hover { background: rgba(49, 104, 197, .07); }

@media (max-width: 1024px) {
  html body .footer .footer-grid--jexora { grid-template-columns: 1.2fr .8fr .8fr; }
  .footer .newsletter { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; column-gap: 18px; }
  .footer .newsletter h3,
  .footer .newsletter > p,
  .footer .footer-social { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  html body .footer.footer-search-section { background-size: auto, 52px 52px, 52px 52px, auto; }
  .footer-cta { grid-template-columns: 1fr; gap: 28px; align-items: start; padding-top: 58px; padding-bottom: 48px; }
  .footer-cta h2 { font-size: clamp(36px, 11vw, 50px); letter-spacing: -2.4px; }
  .footer-cta-copy > p { font-size: 12px; }
  .footer-cta-action { justify-self: start; }
  .footer-search-panel {
    grid-template-columns: 1fr;
    grid-template-areas: "label" "search" "links";
    gap: 13px;
    padding: 20px;
  }
  .footer-search-panel > label { text-align: center; }
  .footer-search-panel .footer-search-links { justify-content: center; }
  html body .footer .footer-grid--jexora { grid-template-columns: 1fr 1fr; gap: 38px 24px; padding-top: 44px; }
  .footer .footer-brand,
  .footer .newsletter { grid-column: 1 / -1; }
  .footer .footer-column { padding-top: 0; }
  .footer .footer-bottom { margin-top: 46px; }
}

@media (max-width: 520px) {
  .footer-cta { padding-top: 50px; }
  .footer-cta-action { width: 100%; }
  .footer-search-panel { padding: 17px 14px; }
  html body .footer .footer-grid--jexora { grid-template-columns: 1fr 1fr; gap: 34px 20px; }
  .footer .newsletter { display: flex; padding: 18px; }
  .footer .footer-bottom { align-items: flex-start; gap: 15px; }
  .footer .footer-bottom div { align-items: flex-end; flex-direction: column; }
  .footer .footer-bottom div span::after { display: none; }
}

/* Footer CTA: composicion mas compacta y proporcionada. */
@media (min-width: 761px) {
  .footer-cta {
    grid-template-columns: minmax(0, 680px) auto;
    column-gap: clamp(36px, 6vw, 96px);
    row-gap: 30px;
    padding-top: 48px;
    padding-bottom: 40px;
  }

  .footer-cta-copy { max-width: 680px; }
  .footer-cta .about-kicker { margin-bottom: 13px; }
  .footer-cta h2 {
    max-width: 650px;
    font-size: clamp(38px, 3.75vw, 54px);
    line-height: 1;
    letter-spacing: clamp(-3px, -.05em, -1.8px);
  }
  .footer-cta-copy > p {
    max-width: 560px;
    margin-top: 15px;
    font-size: 12px;
    line-height: 1.6;
  }
  .footer-cta-action {
    min-width: 212px;
    min-height: 52px;
    gap: 22px;
    padding-left: 20px;
  }
  .footer-cta-action b { width: 34px; height: 34px; }

  .footer-search-panel {
    grid-template-columns: minmax(150px, .42fr) minmax(340px, 1.58fr);
    grid-template-areas: "label search" "label links";
    gap: 8px 24px;
    margin-top: 0;
    padding: 16px 20px;
  }
  .footer-search-panel > label { align-self: center; }
  .footer-search-panel .footer-search-box.hero-search { height: 50px; }
  .footer-search-panel .hero-search-main { height: 48px; }
  .footer-search-panel .hero-search-button {
    top: 7px;
    right: 7px;
    width: 34px;
    height: 34px;
  }
  .footer-search-panel .footer-search-links { gap: 7px; }
  .footer-search-panel .footer-search-links a { padding: 6px 10px; }
}

@media (max-width: 760px) {
  .footer-cta {
    gap: 22px;
    padding-top: 42px;
    padding-bottom: 38px;
  }
  .footer-cta .about-kicker { margin-bottom: 13px; }
  .footer-cta h2 {
    font-size: clamp(33px, 10vw, 44px);
    line-height: 1;
  }
  .footer-cta-copy > p { margin-top: 15px; line-height: 1.6; }
  .footer-cta-action { min-height: 52px; }
  .footer-search-panel { gap: 10px; padding: 16px; }
}

/* Footer CTA: balancea el bloque editorial, la accion y el buscador. */
@media (min-width: 1280px) {
  .footer-cta {
    grid-template-columns: minmax(0, 930px) minmax(230px, 1fr);
    column-gap: clamp(52px, 6vw, 104px);
    row-gap: 34px;
    align-items: end;
    padding-top: 58px;
    padding-bottom: 46px;
  }

  .footer-cta-copy {
    max-width: 930px;
  }

  .footer-cta h2 {
    max-width: 930px;
    font-size: clamp(44px, 3.25vw, 58px);
    line-height: .98;
  }

  .footer-cta-copy > p {
    max-width: 620px;
  }

  .footer-cta-action {
    min-width: 238px;
    justify-self: end;
    margin-bottom: 2px;
  }

  .footer-search-panel {
    grid-template-columns: 210px minmax(0, 1fr);
    column-gap: 30px;
    padding: 17px 22px;
  }
}

@media (min-width: 761px) and (max-width: 1279px) {
  .footer-cta {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 32px;
  }

  .footer-cta-action {
    justify-self: end;
  }

  .footer-search-panel {
    grid-template-columns: 175px minmax(0, 1fr);
  }
}

/* ==========================================================
   MOBILE FINAL — layout, legibilidad y controles tactiles
   ========================================================== */
html {
  scroll-padding-top: 112px;
  -webkit-text-size-adjust: 100%;
}

img,
svg,
video,
canvas { max-width: 100%; }

:is(#about, #workflow, #services, #projects, #clients, #testimonials, #faq, #contact) {
  scroll-margin-top: 104px;
}

@media (max-width: 760px) {
  :root { --mobile-gutter: 15px; }

  body {
    min-width: 0;
    overflow-x: clip;
    font-size: 14px;
  }

  .container,
  .topbar-inner {
    width: calc(100% - (var(--mobile-gutter) * 2));
    max-width: none;
  }

  .section,
  .workflow,
  .values-section,
  .hero-next-cta,
  .footer { min-width: 0; }

  /* Cabecera compacta y menu utilizable con una mano. */
  .topbar { height: 42px; }
  .topbar-inner { gap: 5px; }
  .topbar-contact { gap: 4px; }
  .topbar .topbar-animated-link {
    min-height: 32px;
    padding-inline: 7px;
    gap: 5px;
    font-size: 8px;
  }
  .topbar .topbar-animated-link > svg { width: 12px; height: 12px; }
  .topbar-social { gap: 4px; }
  .topbar-social-btn,
  .topbar-social-btn::before { width: 24px; height: 24px; }
  .navbar { height: 62px; gap: 8px; }
  .header .logo-brand-image { width: 118px; height: 48px; }
  .nav-actions .appointment-button { display: none; }
  .nav-actions .whatsapp-expand {
    width: 44px;
    min-width: 44px;
    height: 44px;
  }
  .nav-toggle {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
  }
  .nav {
    top: 104px;
    right: 12px;
    width: min(320px, calc(100vw - 24px));
    max-height: calc(100dvh - 116px);
    padding: 10px;
    overflow-y: auto;
    overscroll-behavior: contain;
    border-radius: 16px;
  }
  .nav a {
    display: flex;
    min-height: 46px;
    align-items: center;
    padding: 11px 14px;
    font-size: 13px;
  }

  /* Hero: todo el contenido respeta el ancho real del dispositivo. */
  .hero {
    height: auto;
    min-height: 0;
    padding: 104px 0 20px;
  }
  .hero .hero-background {
    background-position: center bottom;
    filter: brightness(.94) saturate(1.12);
  }
  .hero .hero-background:nth-child(2) { filter: brightness(.9) saturate(1.1); }
  .hero .hero-background:nth-child(3) { filter: brightness(.92) saturate(1.08); }
  .hero .hero-background:nth-child(4) { filter: brightness(.96) saturate(1.06); }
  .hero::after {
    background:
      linear-gradient(180deg, rgba(1, 6, 16, .18), rgba(1, 6, 16, .46) 56%, rgba(0, 0, 0, .88) 100%),
      linear-gradient(90deg, rgba(2, 8, 18, .68), rgba(2, 8, 18, .08));
  }
  .hero-content {
    width: calc(100% - (var(--mobile-gutter) * 2));
    min-width: 0;
    padding-top: 34px;
  }
  .hero-carousel,
  .hero-slide,
  .hero-slide.is-active {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  .hero-slide { transform: translateX(14px); }
  .hero-slide.is-active { transform: none; }
  .hero .badge {
    width: 100%;
    max-width: 100%;
    min-height: 34px;
    height: auto;
    padding: 8px 11px;
    white-space: normal;
    font-size: 8px;
    line-height: 1.35;
    letter-spacing: .65px;
  }
  .hero h1 {
    width: 100%;
    margin: 22px 0 16px;
    font-size: clamp(34px, 10.2vw, 44px);
    line-height: 1.02;
    letter-spacing: -2.1px;
    overflow-wrap: anywhere;
  }
  .hero h1 br { display: none; }
  .hero-slide p {
    width: 100%;
    max-width: 100%;
    color: #b3bdcc;
    font-size: 14px;
    line-height: 1.62;
  }
  .hero-code-editor { display: none; }
  .hero-search,
  .footer-search-panel .footer-search-box.hero-search {
    width: 100%;
    max-width: 100%;
    height: 54px;
    margin-top: 24px;
  }
  .hero-search-main { height: 52px; }
  .hero-search-input { min-width: 0; padding-right: 56px; font-size: 16px; }
  .hero-search-button { width: 40px; height: 40px; }
  .hero-search + .hero-action-row { margin-top: 22px; }
  .hero .hero-action-row,
  .hero .hero-action-row .hero-buttons { width: 100%; }
  .hero .hero-action-row .hero-buttons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .hero .hero-buttons :is(.button, .appointment-button) {
    width: 100%;
    min-width: 0;
    height: 48px;
    padding-inline: 12px;
    font-size: 9px;
  }
  .hero .hero-action-row .team-trust-stack {
    width: min(230px, 78vw);
    margin-top: 22px;
  }
  .hero .hero-action-row .team-trust {
    width: 100%;
    min-width: 0;
    height: 62px;
    margin: 0;
  }
  .hero .team-trust small { font-size: 9px; }
  .hero .team-trust-stack .hero-carousel-controls {
    position: static;
    min-height: 28px;
    margin-top: 8px;
    align-items: center;
  }
  .hero-carousel-controls button { min-width: 28px; min-height: 8px; }
  .tech-carousel {
    position: relative;
    inset: auto;
    width: calc(100% - (var(--mobile-gutter) * 2));
    height: 58px;
    margin: 18px auto 0;
    overflow: hidden;
    transform: none;
  }
  .tech-item { min-width: 54px; height: 52px; }
  .tech-item.is-icon-fallback::after {
    width: 34px;
    height: 34px;
    font-size: 8px;
  }

  /* Ritmo y tipografia compartidos entre secciones. */
  .about,
  .workflow,
  .services-orbit,
  .projects,
  .clients-solar,
  .testimonials-showcase,
  .faq { padding-block: 76px; }
  :is(.about-copy, .workflow-heading, .services-orbit-heading, .clients-solar-heading, .testimonials-heading, .faq-copy, .contact-copy) p {
    font-size: 14px;
    line-height: 1.68;
  }
  .about-kicker,
  .hero-next-kicker { max-width: 100%; white-space: normal; line-height: 1.35; }

  .about-shell { grid-template-columns: 1fr; gap: 44px; }
  .about .about-copy h2.chromatic,
  html[data-theme="light"] .about .about-copy h2.chromatic,
  html[data-theme="dark"] .about .about-copy h2.chromatic {
    margin: 23px 0 18px;
    font-size: clamp(36px, 10vw, 43px);
    line-height: 1.02;
    letter-spacing: -2.3px;
  }
  .about-copy h2 br { display: none; }
  .about-tags { gap: 8px; }
  .about-tags > span { min-height: 42px; font-size: 10px; }
  .about-button { min-height: 48px; }
  .about-visual { min-height: 360px; }
  .about-image-tertiary { height: 112px; }
  .about-image-main { top: 82px; height: 245px; }
  .about-image-secondary { height: 120px; }

  .values-section { margin-top: -36px; padding: 102px 0 72px; }
  .values-section .about-values-head h3 {
    font-size: clamp(36px, 10vw, 44px);
    line-height: 1.02;
    letter-spacing: -2.4px;
  }
  .values-section .about-values { gap: 12px; }
  .values-section .about-value-card,
  html[data-theme="light"] .values-section .about-value-card {
    min-height: 0;
    padding: 24px 21px 22px;
    border-radius: 17px;
  }
  .about-value-card h3 { font-size: 19px; }
  .about-value-card p,
  .about-value-card li { font-size: 13px; line-height: 1.62; }

  .hero-next-content {
    width: calc(100% - 48px);
    min-height: 530px;
    padding: 60px 0;
  }
  .hero-next-content h2,
  html[data-theme="light"] .hero-next-content h2 {
    font-size: clamp(37px, 11vw, 48px);
    letter-spacing: -2px;
  }
  .hero-next-content p,
  html[data-theme="light"] .hero-next-content p { font-size: 14px; }
  .hero-next-actions { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .hero-next-primary.primary-action,
  .hero-next-secondary.secondary-action { width: 100%; min-height: 48px; }

  .workflow-heading { gap: 22px; margin-bottom: 42px; }
  .workflow-heading h2 {
    font-size: clamp(36px, 10vw, 42px);
    line-height: 1.02;
    letter-spacing: -2.2px;
  }
  .workflow-heading h2 br { display: none; }
  .workflow-heading > p { padding-left: 14px; }
  .workflow-layout { gap: 50px; }
  .workflow-showcase {
    grid-template-rows: 286px 126px;
    height: auto;
  }
  .workflow-featured { height: auto; }
  .workflow-featured figcaption { right: 16px; left: 16px; }
  .workflow-featured figcaption strong { font-size: 17px; }
  .workflow-mini-grid figure { height: 126px; }
  .workflow-step {
    grid-template-columns: 43px minmax(0, 1fr);
    gap: 12px;
    padding: 21px 0;
  }
  .workflow-number { font-size: 26px; }
  .workflow-step-copy h3 { margin-bottom: 9px; font-size: 18px; }
  .workflow-step-copy p { font-size: 13px; line-height: 1.65; }
  .workflow-step-copy > div span { padding: 6px 8px; font-size: 9px; }

  .services-orbit-heading { grid-template-columns: 1fr; gap: 22px; }
  .services-orbit-heading h2 {
    font-size: clamp(36px, 10vw, 42px);
    line-height: 1.02;
    letter-spacing: -2.2px;
  }
  .services-orbit-heading h2 br { display: none; }
  .services-orbit-stage { margin-top: 34px; overflow: hidden; }
  .services-orbit-ring {
    grid-auto-columns: 88%;
    gap: 10px;
    padding: 4px 0 18px;
    scroll-padding-inline: 0;
    overscroll-behavior-inline: contain;
    touch-action: pan-x;
  }
  .service-orbit-card {
    width: auto;
    min-width: 0;
    min-height: 390px;
    padding-inline: 20px;
    scroll-snap-align: start;
  }
  .service-orbit-card h3 { font-size: 23px; }
  .service-orbit-card p { font-size: 13px; line-height: 1.55; }
  .service-orbit-card a { min-height: 44px; }
  .services-orbit-hint {
    position: static;
    display: block;
    margin: 10px 0 0;
    text-align: center;
    transform: none;
  }

  .projects-showcase-head { margin-bottom: 28px; gap: 15px; }
  .projects-showcase-head h2 {
    max-width: none;
    font-size: clamp(27px, 8vw, 34px);
    letter-spacing: 2px;
  }
  .projects-showcase-link { min-height: 44px; align-items: center; }
  .projects-showcase-track { padding-inline: var(--mobile-gutter); scroll-padding-inline: var(--mobile-gutter); }
  .project-showcase-card {
    flex-basis: calc(100vw - 44px);
    min-height: 430px;
    scroll-snap-align: center;
  }
  .project-showcase-copy { padding: 20px 18px 22px; }
  .project-showcase-copy h3 { font-size: 19px; }
  .project-showcase-copy p { font-size: 13px; line-height: 1.55; }
  .projects-showcase-arrow { width: 44px; height: 44px; }

  .clients-solar-heading h2 {
    font-size: clamp(38px, 10.5vw, 46px);
    line-height: 1;
    letter-spacing: -2.3px;
  }
  .clients-solar-heading h2 br { display: none; }
  .clients-solar-system { padding-top: 118px; gap: 9px; }
  .clients-solar-system > .client-logo,
  .client-stm, .client-heavy, .client-cosco, .client-xperto,
  .client-faby, .client-juanjui, .client-saenz, .client-zona {
    min-width: 0;
    height: 86px !important;
    padding: 14px !important;
  }

  .testimonials-heading { gap: 20px; margin-bottom: 30px; }
  html body .testimonials-heading h2 {
    font-size: clamp(36px, 10vw, 43px);
    line-height: 1.02;
    letter-spacing: -2.3px;
  }
  .testimonials-heading h2 br { display: none; }
  .testimonials-intro { max-width: none; padding-left: 14px; }
  .testimonial-project,
  .testimonial-project--featured { min-height: 405px; }
  .testimonial-default { display: none; }
  .testimonial-image { filter: saturate(.78) brightness(.58); }
  .testimonial-copy {
    right: 11px;
    bottom: 11px;
    left: 11px;
    padding: 16px;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .testimonial-copy blockquote { font-size: 13px; line-height: 1.58; }
  .testimonial-copy footer { grid-template-columns: 32px minmax(0, 1fr); }

  .faq,
  html[data-theme="light"] .faq,
  html[data-theme="dark"] .faq { padding-block: 76px; }
  .faq-container { width: calc(100% - (var(--mobile-gutter) * 2)); gap: 48px; }
  .faq-copy h2 { font-size: clamp(37px, 10.5vw, 45px); line-height: 1.02; letter-spacing: -2.4px; }
  .faq-copy h2 br { display: none; }
  .faq-highlights { align-items: stretch; flex-direction: column; }
  .faq-highlights > span { min-height: 36px; font-size: 10px; }
  .faq .faq-list summary {
    min-height: 66px;
    padding: 12px;
    font-size: 13px;
    line-height: 1.42;
  }
  .faq .faq-list .faq-question { min-width: 0; }
  .faq .faq-list details p { padding: 0 40px 18px 39px; font-size: 13px; line-height: 1.62; }
  .faq-visual-wrap,
  .faq-visual,
  html[data-theme="light"] .faq-visual-wrap,
  html[data-theme="light"] .faq-visual,
  html[data-theme="dark"] .faq-visual-wrap,
  html[data-theme="dark"] .faq-visual { height: 320px; }

  .contact-showcase,
  html[data-theme="light"] body .contact-showcase,
  html[data-theme="dark"] body .contact-showcase { padding: 54px 0 66px !important; }
  html body .contact-showcase > .container { width: calc(100% - 24px); }
  html body .contact-shell,
  html[data-theme="light"] body .contact-shell,
  html[data-theme="dark"] body .contact-shell {
    padding-top: 250px;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, .03), rgba(0, 0, 0, .22) 180px, #03070d 260px),
      url("assets/images/about/contact-consultant-v2.webp") 76% top / auto 285px no-repeat !important;
  }
  html body .contact-copy,
  html[data-theme="light"] body .contact-copy,
  html[data-theme="dark"] body .contact-copy { padding: 28px 18px 19px !important; }
  html body .contact-copy h2,
  html[data-theme="light"] body .contact-copy h2,
  html[data-theme="dark"] body .contact-copy h2 {
    font-size: clamp(34px, 10vw, 40px) !important;
    line-height: 1.02;
    letter-spacing: -2.1px !important;
  }
  .contact-copy h2 br { display: none; }
  .contact-direct a { min-width: 0; min-height: 58px; }
  .contact-direct strong { overflow-wrap: anywhere; }
  html body .contact-form,
  html[data-theme="light"] body .contact-form,
  html[data-theme="dark"] body .contact-form {
    margin: 0 8px 14px !important;
    padding: 23px 15px 20px !important;
  }
  html body .contact-form-head h3,
  html[data-theme="light"] body .contact-form-head h3,
  html[data-theme="dark"] body .contact-form-head h3 { font-size: 21px !important; }
  html body .contact-fields { gap: 14px; }
  html body .contact-fields :is(input, select, textarea),
  html[data-theme="light"] body .contact-fields :is(input, select, textarea),
  html[data-theme="dark"] body .contact-fields :is(input, select, textarea) {
    min-height: 50px;
    font-size: 16px;
  }
  html body .contact-fields textarea { min-height: 118px; }
  html body .contact-consent,
  html[data-theme="light"] body .contact-consent,
  html[data-theme="dark"] body .contact-consent { font-size: 11px; line-height: 1.5; }
  html body .contact-submit,
  html body .contact-whatsapp.whatsapp-expand { min-height: 48px; }

  /* Footer, accesos flotantes y areas seguras del sistema. */
  .footer-cta { padding-top: 54px; padding-bottom: 42px; }
  .footer-cta h2 {
    font-size: clamp(34px, 10vw, 43px);
    line-height: 1.02;
    letter-spacing: -2.2px;
  }
  .footer-cta-copy > p { font-size: 14px; }
  .footer-cta-action { min-height: 52px; }
  .footer-search-panel { padding: 15px 12px; }
  .footer-search-panel .footer-search-links { gap: 6px; }
  .footer-search-panel .footer-search-links a { min-height: 36px; display: inline-flex; align-items: center; }
  html body .footer .footer-grid--jexora {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 18px;
  }
  .footer .footer-brand,
  .footer .newsletter { grid-column: 1 / -1; }
  .footer .footer-column a { min-height: 32px; margin-bottom: 4px; }
  .footer .newsletter { padding: 17px !important; }
  .footer .footer-direct-link { min-width: 0; }
  .footer .footer-direct-link span:last-child { min-width: 0; }
  .footer .footer-direct-link strong { overflow-wrap: anywhere; }
  .footer .footer-bottom { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }

  .section-path {
    right: 74px;
    bottom: calc(9px + env(safe-area-inset-bottom));
    left: 9px;
    height: 44px;
    padding: 6px 7px;
  }
  .section-path a { width: 30px; min-height: 30px; }
  .section-path a i { width: 25px; height: 25px; }
  .section-path a.is-current i { width: 29px; height: 29px; }
  .whatsapp-chat {
    right: 4px;
    bottom: calc(40px + env(safe-area-inset-bottom));
  }
  .whatsapp-chat-toggle { width: 70px; height: 100px; }
  .jack-avatar--floating { width: 66px; height: 92px; }
  .jack-floating-bubble { display: none; }
  body .whatsapp-chat-panel,
  body .jack-welcome {
    position: fixed;
    right: 12px;
    bottom: calc(62px + env(safe-area-inset-bottom));
    width: calc(100vw - 24px);
    max-width: 382px;
  }
  body .whatsapp-chat-panel { height: min(560px, calc(100dvh - 86px)); }
}

@media (max-width: 380px) {
  :root { --mobile-gutter: 12px; }
  .topbar-contact .topbar-animated-link:nth-child(3) { display: none; }
  .header .logo-brand-image { width: 108px; }
  .hero h1 { font-size: 33px; }
  .hero .hero-buttons :is(.button, .appointment-button) { font-size: 8px; }
  .workflow-showcase { grid-template-rows: 255px 116px; }
  .workflow-mini-grid figure { height: 116px; }
  .clients-solar-system { grid-template-columns: 1fr; }
  .clients-solar-system > .client-logo,
  .client-stm, .client-heavy, .client-cosco, .client-xperto,
  .client-faby, .client-juanjui, .client-saenz, .client-zona { height: 80px !important; }
  html body .footer .footer-grid--jexora { grid-template-columns: 1fr; }
  .footer .footer-column { grid-column: 1; }
}

@media (max-width: 760px) and (orientation: landscape) {
  .nav { max-height: calc(100dvh - 108px); }
  body .whatsapp-chat-panel { height: calc(100dvh - 76px); }
}

@media (max-width: 760px) and (max-height: 650px) {
  .whatsapp-chat { right: 8px; bottom: calc(8px + env(safe-area-inset-bottom)); }
  .whatsapp-chat-toggle {
    width: 52px;
    height: 52px;
    border: 1px solid rgba(137, 191, 255, .7);
    border-radius: 50%;
    background: #0a203f url("assets/images/brand/jack-chat-avatar.webp") center / cover no-repeat;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .4), 0 0 15px rgba(38, 122, 255, .28);
  }
  .jack-avatar--floating { display: none; }
  body.is-home-visible .whatsapp-chat {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}

/* Servicios mobile: conserva la orbita 3D de desktop a escala tactil. */
@media (max-width: 650px) {
  .services-orbit-stage {
    height: 570px;
    margin-top: 28px;
    overflow: hidden;
    perspective: 920px;
    perspective-origin: 50% 43%;
    touch-action: pan-y;
  }

  .services-orbit-stage::before {
    display: block;
    bottom: 48px;
    width: 86%;
    height: 80px;
  }

  .services-orbit-ring {
    --card-w: clamp(176px, 48vw, 202px);
    --card-h: 390px;
    --translate-z: clamp(218px, 61vw, 250px);
    position: absolute;
    top: 76px;
    left: calc(50% - var(--card-w) / 2);
    width: var(--card-w);
    height: var(--card-h);
    display: block;
    overflow: visible;
    padding: 0;
    transform-style: preserve-3d;
    animation: service-orbit-rotating 40s linear infinite;
    scroll-snap-type: none;
    scrollbar-width: auto;
  }

  .service-orbit-card {
    position: absolute;
    inset: 0;
    width: 100%;
    min-height: 0;
    height: 100%;
    padding: 146px 18px 20px;
    backface-visibility: hidden;
    transform:
      rotateY(calc((360deg / var(--quantity)) * var(--index)))
      translateZ(var(--translate-z));
    scroll-snap-align: none;
  }
}

@media (max-width: 650px) and (prefers-reduced-motion: reduce) {
  .services-orbit-ring { animation: none; }
}

/* Clientes mobile: orbita mas compacta y marcas con mejor presencia. */
@media (max-width: 760px) {
  .clients-solar-system > .client-logo {
    width: 110px !important;
    height: 84px !important;
    padding: 10px !important;
  }
}

@media (max-width: 520px) {
  .clients-solar-system {
    width: 600px;
    margin-left: calc((100% - 600px) / 2);
  }

  .clients-solar-system > .client-logo {
    width: 118px !important;
    height: 84px !important;
  }
}

/* Jack mobile: recupera presencia y mantiene visible su saludo lateral. */
@media (max-width: 760px) and (min-height: 651px) {
  .whatsapp-chat {
    right: 6px;
    bottom: calc(36px + env(safe-area-inset-bottom));
  }

  .whatsapp-chat-toggle {
    width: 116px;
    height: 168px;
  }

  .jack-avatar--floating {
    display: block;
    width: 110px;
    height: 156px;
  }

  .jack-floating-bubble {
    top: 24px;
    left: -112px;
    display: grid;
    width: 120px;
    min-height: 52px;
    padding: 9px 11px;
  }

  .jack-bubble-copy strong { font-size: 10px; }
  .jack-bubble-copy small { font-size: 8px; }
}
