/**
 * iTCS — Dark Mode Premium v3
 * Paleta: #ABC9D0 #5395A3 #006479 #003550
 */

:root {
  --itcs-font-sans: "Inter", system-ui, sans-serif;
}

body, body p, body li, body a, body span,
.subtitle, h1, h2, h3, h4, h5, h6 {
  font-family: var(--itcs-font-sans) !important;
}

/* Controles barra superior */
.itcs-accessibility .form-select {
  background-color: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 0.8rem;
  max-width: 155px;
}
.itcs-accessibility .btn-itcs-theme {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  padding: 0.25rem 0.55rem;
  border-radius: 0.25rem;
  font-size: 0.8rem;
  line-height: 1.2;
}
.itcs-accessibility .btn-itcs-theme:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

/* ==========================================================
   iTCS — Dark Mode Premium v3
   ========================================================== */

:root {
  --itcs-ice:  #ABC9D0;
  --itcs-teal: #5395A3;
  --itcs-cyan: #006479;
  --itcs-navy: #003550;

  --ink-1000: #02131C;
  --ink-950:  #031B27;
  --ink-925:  #052333;
  --ink-900:  #062B3B;
  --ink-850:  #083348;
  --ink-800:  #0A3D50;
  --ink-760:  #0B465A;
  --ink-720:  #0D5065;

  --text-strong:    var(--itcs-ice);
  --text-main:      rgba(171, 201, 208, 0.88);
  --text-soft:      rgba(171, 201, 208, 0.68);
  --text-muted:     rgba(171, 201, 208, 0.48);

  --surface-glass: linear-gradient(
      145deg,
      rgba(171, 201, 208, 0.105) 0%,
      rgba(83, 149, 163, 0.075) 38%,
      rgba(0, 53, 80, 0.18) 100%
    ),
    linear-gradient(180deg, rgba(13, 80, 101, 0.82) 0%, rgba(5, 35, 51, 0.92) 100%);

  --surface-glass-hover: linear-gradient(
      145deg,
      rgba(171, 201, 208, 0.145) 0%,
      rgba(83, 149, 163, 0.12) 42%,
      rgba(0, 100, 121, 0.12) 100%
    ),
    linear-gradient(180deg, rgba(15, 91, 114, 0.9) 0%, rgba(6, 43, 59, 0.96) 100%);

  --line-soft:   rgba(171, 201, 208, 0.12);
  --line-mid:    rgba(171, 201, 208, 0.2);
  --line-accent: rgba(83, 149, 163, 0.36);

  --shadow-deep: 0 28px 80px rgba(2, 19, 28, 0.56);
  --shadow-card: 0 18px 55px rgba(2, 19, 28, 0.46);
  --glow-teal:   0 0 42px rgba(83, 149, 163, 0.18);
  --glow-cyan:   0 0 46px rgba(0, 100, 121, 0.24);

  /* Template token overrides */
  --primary-color:     #5395A3;
  --primary-color-rgb: 83, 149, 163;
  --secondary-color:   #006479;
  --primary-gradient:  90deg, #006479, #5395A3;
  --bg-gradient-1:     0deg, rgba(83,149,163,.14) 0%, rgba(83,149,163,.24) 100%;
  --bg-light:      #062B3B;
  --bg-dark-1:     #02131C;
  --bg-dark-1-rgb: 2, 19, 28;
  --bg-dark-2:     #031B27;
  --bg-dark-3:     #006479;

  color-scheme: dark;
}

/* --- Base --- */
html {
  background: var(--ink-1000);
  scroll-behavior: smooth;
}
body {
  background:
    radial-gradient(circle at 12%  8%, rgba(83, 149, 163, 0.16), transparent 28%),
    radial-gradient(circle at 88%  4%, rgba(0, 100, 121, 0.28),  transparent 30%),
    radial-gradient(circle at 70% 60%, rgba(171, 201, 208, 0.075), transparent 32%),
    linear-gradient(145deg, var(--ink-1000) 0%, var(--ink-950) 38%, var(--itcs-navy) 100%) !important;
  color: var(--text-main);
  overflow-x: clip;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background-image:
    linear-gradient(rgba(171, 201, 208, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(171, 201, 208, 0.035) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(circle at 50% 12%, black 0%, transparent 68%);
}
body::after {
  content: "";
  position: fixed;
  inset: -20%;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(circle at 20% 30%, rgba(83,149,163,.18), transparent 26%),
    radial-gradient(circle at 80% 20%, rgba(0,100,121,.22),  transparent 28%),
    radial-gradient(circle at 60% 80%, rgba(171,201,208,.08), transparent 24%);
  filter: blur(24px);
  animation: ambientMove 18s ease-in-out infinite alternate;
}
@keyframes ambientMove {
  from { transform: translate3d(-2%, -1%, 0) scale(1); }
  to   { transform: translate3d(2%, 1.5%, 0) scale(1.04); }
}
#wrapper, main, section { background: transparent; }
#content { background: transparent !important; }

::selection { background: rgba(83,149,163,.34); color: var(--itcs-ice); }

/* ==========================================================
   ANIMACIONES — keyframes globales
   ========================================================== */

@keyframes orb-drift-a {
  0%   { transform: translate(0, 0) scale(1); }
  33%  { transform: translate(40px, -28px) scale(1.08); }
  66%  { transform: translate(-24px, 18px) scale(0.96); }
  100% { transform: translate(0, 0) scale(1); }
}
@keyframes orb-drift-b {
  0%   { transform: translate(0, 0) scale(1); }
  40%  { transform: translate(-36px, 22px) scale(1.05); }
  75%  { transform: translate(28px, -16px) scale(0.98); }
  100% { transform: translate(0, 0) scale(1); }
}
@keyframes orb-drift-c {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(20px, 30px) scale(1.06); }
  100% { transform: translate(0, 0) scale(1); }
}
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}
@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 16px 42px rgba(0,100,121,.28), inset 0 1px 0 rgba(171,201,208,.30); }
  50%       { box-shadow: 0 20px 60px rgba(83,149,163,.38), 0 0 40px rgba(171,201,208,.18), inset 0 1px 0 rgba(171,201,208,.42); }
}
@keyframes border-glow {
  0%, 100% { border-color: rgba(171,201,208,.12); }
  50%       { border-color: rgba(83,149,163,.36); }
}
@keyframes gradient-shift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes line-expand {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* --- Orbs flotantes en el hero (pseudo-elementos del body) --- */
body::before {
  /* ya definido: grid texture — no tocar */
}

/* Orbs independientes via wrapper del hero */
#inicio-hero::before,
#inicio-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
  filter: blur(72px);
}
#inicio-hero::before {
  width: 520px;
  height: 520px;
  top: -80px;
  left: -100px;
  background: radial-gradient(circle, rgba(83,149,163,.22) 0%, transparent 70%);
  animation: orb-drift-a 18s ease-in-out infinite;
}
#inicio-hero::after {
  width: 400px;
  height: 400px;
  bottom: -60px;
  right: -80px;
  background: radial-gradient(circle, rgba(0,100,121,.28) 0%, transparent 70%);
  animation: orb-drift-b 22s ease-in-out infinite;
}

/* Orb adicional en sección de stats/contadores */
.de_count,
[class*="section-counter"],
[class*="stats"] {
  position: relative;
}

/* --- Cards: hover con glow animado y borde pulsante --- */
.itcs-service-card,
.itcs-partner-card,
.itcs-product-card,
.de-box, .card {
  transition: transform 280ms cubic-bezier(.22,.68,0,1.2), box-shadow 280ms ease, border-color 280ms ease;
}
.itcs-service-card:hover,
.itcs-partner-card:hover,
.itcs-product-card:hover,
.de-box:hover, .card:hover {
  transform: translateY(-8px) scale(1.012);
  box-shadow:
    0 32px 88px rgba(2,19,28,.65),
    0 0 0 1px rgba(83,149,163,.28),
    0 0 64px rgba(83,149,163,.14);
}

/* Línea de acento animada al hacer hover en card */
.itcs-service-card:hover::after,
.itcs-partner-card:hover::after,
.itcs-product-card:hover::after,
.de-box:hover::after, .card:hover::after {
  background: linear-gradient(90deg, transparent, rgba(171,201,208,.70), rgba(83,149,163,.50), transparent);
}

/* --- Botón principal: shimmer animado + glow pulse --- */
.btn-main {
  background-size: 200% auto !important;
  transition: transform 220ms ease, box-shadow 220ms ease, background-position 400ms ease;
  animation: glow-pulse 3.5s ease-in-out infinite;
}
.btn-main:hover {
  background-position: right center !important;
  animation: none;
  transform: translateY(-3px) scale(1.03);
  box-shadow:
    0 22px 62px rgba(83,149,163,.32),
    0 0 42px rgba(171,201,208,.18),
    inset 0 1px 0 rgba(171,201,208,.44);
}

/* --- Links de nav: línea de acento deslizante --- */
#mainmenu a {
  position: relative;
  transition: color 200ms ease;
}
#mainmenu a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background: #ffffff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 240ms cubic-bezier(.22,.68,0,1.2);
}
#mainmenu a:hover::after,
#mainmenu li.active > a::after {
  transform: scaleX(1);
}

/* --- Títulos de sección: línea de acento animada al entrar --- */
.wow.fadeInUp h2::after,
h2.wow::after {
  content: "";
  display: block;
  width: 48px;
  height: 2px;
  margin-top: 10px;
  background: linear-gradient(90deg, var(--itcs-teal), var(--itcs-ice));
  transform-origin: left;
  animation: line-expand 600ms cubic-bezier(.22,.68,0,1.2) both;
  animation-delay: 400ms;
}

/* --- Marquee: velocidad más fluida --- */
.de-marquee-list {
  transition: transform 0.1s linear;
}

/* --- Íconos en cards: hover glow --- */
.de-box i, .card i,
.itcs-service-card i {
  transition: transform 240ms ease, color 240ms ease, text-shadow 240ms ease;
}
.de-box:hover i, .card:hover i,
.itcs-service-card:hover i {
  transform: scale(1.18) translateY(-2px);
  color: var(--itcs-ice) !important;
  text-shadow: 0 0 24px rgba(171,201,208,.5);
}

footer p, footer li, footer small { color: rgba(171,201,208,.84) !important; }
footer h5, footer h4 {
  color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 16px;
  letter-spacing: -0.01em;
  margin-bottom: 18px;
}
footer i, footer svg { color: #5395A3 !important; }

/* --- Tipografía --- */
h1, h2                         { color: #ffffff; letter-spacing: -0.035em; }
h3, h4, h5, h6                 { color: var(--text-strong); letter-spacing: -0.035em; }
h1                             { text-shadow: 0 18px 70px rgba(83,149,163,.22); }
p, li                          { color: rgba(255,255,255,.88); }
small, .subtitle, .description { color: rgba(255,255,255,.70); }
.text-dark, .text-black, .text-muted { color: var(--text-main) !important; }
.op-7, .op-8                   { color: var(--text-soft) !important; opacity: 1 !important; }
.id-color, .text-primary       { color: var(--itcs-teal) !important; }
a                              { color: var(--itcs-teal); text-underline-offset: 4px; }
a:hover                        { color: var(--itcs-ice); }

/* --- Header / topbar --- */
header,
header.transparent,
header:not(.header-light) {
  background: linear-gradient(180deg, rgba(2,19,28,.92) 0%, rgba(0,53,80,.78) 100%) !important;
  border-bottom: 1px solid var(--line-soft);
  box-shadow: 0 18px 60px rgba(2,19,28,.34);
  backdrop-filter: blur(18px);
}
header a, #mainmenu a                  { color: rgba(255,255,255,.82); }
header a:hover, #mainmenu a:hover,
#mainmenu li.active > a                { color: #ffffff; }
#topbar {
  background: rgba(2,19,28,.96) !important;
  border-bottom: 1px solid var(--line-soft);
}
#topbar a, #topbar .topbar-widget a    { color: rgba(171,201,208,.78); }

/* --- Secciones oscuras — alternancia de profundidad --- */
.bg-white, .bg-white-10,
.bg-light, .bg-light-2,
section.bg-grey,
#content.zebra section:nth-child(even) {
  background:
    radial-gradient(circle at 15% 10%, rgba(83,149,163,.12), transparent 26%),
    radial-gradient(circle at 90% 70%, rgba(0,100,121,.16),  transparent 32%),
    linear-gradient(180deg, var(--ink-925) 0%, var(--ink-900) 100%) !important;
  color: var(--text-main) !important;
}
.section-dark,
.bg-dark, .bg-dark-1, .bg-dark-2, .bg-dark-3 {
  background:
    radial-gradient(circle at top right, rgba(83,149,163,.20), transparent 35%),
    var(--itcs-navy) !important;
  color: var(--text-main) !important;
}
.section-dark *, .bg-dark * { color: var(--text-main); }
.bg-dark-gradient {
  background: var(--surface-glass) !important;
  color: var(--text-main) !important;
}

/* Alternancia de secciones pares/impares — todas dark, transparentes para que el fondo global atraviese */
main > section,
#content > section,
section.no-bg,
section.no-top,
section.no-bottom {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-top: 1px solid rgba(171,201,208,.055);
  border-bottom: 1px solid rgba(2,19,28,.42);
}
main > section:nth-of-type(2n),
#content > section:nth-of-type(2n) {
  background:
    radial-gradient(circle at 15% 10%, rgba(83,149,163,.10), transparent 26%),
    radial-gradient(circle at 90% 70%, rgba(0,100,121,.14),  transparent 32%),
    linear-gradient(180deg, rgba(5,35,51,.55) 0%, rgba(6,43,59,.55) 100%);
}
main > section:nth-of-type(2n+1),
#content > section:nth-of-type(2n+1) {
  background:
    radial-gradient(circle at 85% 18%, rgba(171,201,208,.06), transparent 24%),
    radial-gradient(circle at 10% 82%, rgba(0,100,121,.13),   transparent 30%),
    linear-gradient(180deg, rgba(3,27,39,.45) 0%, rgba(0,53,80,.55) 100%);
}

/* Sangrado entre secciones: la sección "derrama" sobre la siguiente (sin cortes secos) */
main > section::after,
#content > section::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -90px;
  height: 180px;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(
    180deg,
    rgba(0,100,121,.18) 0%,
    rgba(83,149,163,.06) 46%,
    rgba(0,53,80,0) 100%
  );
  filter: blur(34px);
}
main > section::before,
#content > section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -90px;
  height: 180px;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(
    0deg,
    rgba(0,100,121,.14) 0%,
    rgba(83,149,163,.05) 46%,
    rgba(0,53,80,0) 100%
  );
  filter: blur(30px);
}
main > section > *,
#content > section > * { position: relative; z-index: 3; }

/* --- Marquee / barra de servicios --- */
.bg-color,
.section-dark.bg-color,
[class*="marquee"], [class*="ticker"] {
  background: linear-gradient(90deg, var(--itcs-navy) 0%, var(--itcs-cyan) 44%, var(--ink-800) 100%) !important;
  border-top: 1px solid rgba(171,201,208,.14);
  border-bottom: 1px solid rgba(171,201,208,.10);
  color: var(--itcs-ice) !important;
}
.bg-color span, .bg-color i,
[class*="marquee"] *, [class*="ticker"] * { color: var(--itcs-ice) !important; }

/* Stats sin íconos */
.itcs-stats .de_count i { display: none !important; }

/* --- Counters / stats (editorial, separadores verticales) --- */
.de_count {
  background: transparent !important;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .80rem;
  color: var(--text-soft) !important;
}
/* Ícono liviano: glifo teal dentro de un anillo fino (outline, sin relleno) */
.de_count i {
  background: none !important;
  border: 1px solid rgba(83,149,163,.42) !important;
  box-shadow: 0 0 0 6px rgba(83,149,163,.05);
  color: var(--itcs-teal) !important;
  width: 62px !important;
  height: 62px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 1rem !important;
  padding: 0 !important;
  font-size: 26px !important;
  line-height: 1 !important;
  text-shadow: 0 0 26px rgba(83,149,163,.30);
  transition: transform .28s cubic-bezier(.22,.68,0,1.2), border-color .28s ease, color .28s ease, box-shadow .28s ease;
}
.de_count:hover i {
  transform: translateY(-4px) scale(1.06);
  border-color: var(--itcs-ice) !important;
  color: var(--itcs-ice) !important;
  box-shadow: 0 0 0 7px rgba(83,149,163,.10), 0 0 28px rgba(83,149,163,.18);
}
.de_count:hover h3 { text-shadow: 0 0 38px rgba(171,201,208,.40); }
/* Número protagonista con acento bajo */
.de_count h3 {
  position: relative;
  display: block;
  text-transform: none;
  letter-spacing: -.02em;
  color: var(--itcs-ice) !important;
  font-size: 2.7rem !important;
  padding-bottom: .55rem;
  margin-bottom: .65rem;
  text-shadow: 0 0 32px rgba(83,149,163,.18);
}
.de_count h3::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 34px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--itcs-ice), var(--itcs-teal));
}
.de_count small, .de_count p { color: var(--text-soft) !important; }

/* Separadores verticales finos entre columnas de stats (≥768px) */
@media (min-width: 768px) {
  .itcs-stats > [class*="col-"] + [class*="col-"]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 64px;
    width: 1px;
    background: linear-gradient(transparent, rgba(171,201,208,.24), transparent);
  }
}
.itcs-stats > [class*="col-"] { position: relative; }

/* --- Cards (glass técnico) --- */
.itcs-service-card,
.itcs-partner-card,
.itcs-product-card,
.de-box, .card {
  position: relative;
  overflow: hidden;
  background: var(--surface-glass) !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 24px;
  box-shadow: var(--shadow-card);
  backdrop-filter: blur(18px);
  color: var(--text-main);
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease, background 220ms ease;
}
.itcs-service-card::before,
.itcs-partner-card::before,
.itcs-product-card::before,
.de-box::before, .card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 0%, rgba(171,201,208,.12), transparent 38%),
    linear-gradient(135deg, rgba(171,201,208,.08), transparent 44%);
  opacity: 0.8;
}
.itcs-service-card::after,
.itcs-partner-card::after,
.itcs-product-card::after,
.de-box::after, .card::after {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(171,201,208,.42), rgba(83,149,163,.28), transparent);
}
.itcs-service-card:hover,
.itcs-partner-card:hover,
.itcs-product-card:hover,
.de-box:hover, .card:hover {
  transform: translateY(-6px);
  background: var(--surface-glass-hover) !important;
  border-color: var(--line-accent) !important;
  box-shadow: 0 30px 82px rgba(2,19,28,.62), 0 0 58px rgba(83,149,163,.12);
}
.itcs-service-card > *, .itcs-partner-card > *,
.itcs-product-card > *, .de-box > *, .card > * { position: relative; z-index: 1; }

.itcs-service-card h3, .itcs-service-card h4, .itcs-service-card h5,
.itcs-partner-card h3, .itcs-partner-card h4,
.itcs-product-card h3, .itcs-product-card h4,
.de-box h3, .de-box h4, .card h3, .card h4 { color: var(--itcs-ice) !important; }
.itcs-service-card p, .itcs-partner-card p,
.itcs-product-card p, .de-box p, .card p    { color: var(--text-main) !important; }

/* --- Botones primarios (.btn-main) --- */
.btn-main {
  --btn-gradient: linear-gradient(135deg, var(--itcs-ice), var(--itcs-teal), var(--itcs-cyan));
  background: linear-gradient(135deg, var(--itcs-ice) 0%, var(--itcs-teal) 50%, var(--itcs-cyan) 100%) !important;
  color: var(--itcs-navy) !important;
  border: 1px solid rgba(171,201,208,.34) !important;
  box-shadow: 0 16px 42px rgba(0,100,121,.28), inset 0 1px 0 rgba(171,201,208,.30);
  border-radius: 999px;
}
.btn-main:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 58px rgba(83,149,163,.22), 0 0 36px rgba(171,201,208,.13);
  color: var(--itcs-navy) !important;
}
.btn-main span { color: inherit !important; }

/* --- Botones secundarios / outline --- */
.btn-line, a.btn-line, .btn-outline {
  background: linear-gradient(180deg, rgba(171,201,208,.095), rgba(83,149,163,.065)) !important;
  color: var(--itcs-ice) !important;
  border: 1px solid rgba(171,201,208,.18) !important;
  border-radius: 999px;
}
.btn-line:hover, .btn-outline:hover {
  transform: translateY(-2px);
  background: linear-gradient(180deg, rgba(171,201,208,.14), rgba(83,149,163,.10)) !important;
  border-color: rgba(171,201,208,.28) !important;
}

/* --- Badges / pills --- */
.badge, .pill, .tag {
  background: linear-gradient(135deg, rgba(171,201,208,.12), rgba(83,149,163,.08)) !important;
  color: var(--itcs-ice) !important;
  border: 1px solid rgba(171,201,208,.16) !important;
  box-shadow: inset 0 1px 0 rgba(171,201,208,.08);
}

/* --- Bordes --- */
.rounded-1.border, .border, .border-bottom, .border-top {
  border-color: var(--line-soft) !important;
}

/* --- Inputs --- */
input[type=text], input[type=email], input[type=password],
input[type=date], textarea, select {
  background: linear-gradient(180deg, rgba(6,43,59,.92), rgba(3,27,39,.94)) !important;
  color: var(--itcs-ice) !important;
  border: 1px solid var(--line-soft) !important;
  box-shadow: inset 0 1px 0 rgba(171,201,208,.04);
}
input::placeholder, textarea::placeholder { color: var(--text-muted) !important; }
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: rgba(83,149,163,.48) !important;
  box-shadow: 0 0 0 4px rgba(83,149,163,.12), 0 14px 34px rgba(2,19,28,.28);
}

/* --- CTA Section --- */
.itcs-cta-section {
  background:
    radial-gradient(circle at 80% 30%, rgba(83,149,163,.22), transparent 34%),
    linear-gradient(135deg, #006479 0%, #003550 100%) !important;
  border-bottom: 1px solid rgba(171,201,208,.16);
}

/* --- Footer --- */
footer {
  background:
    radial-gradient(circle at 12% 0%, rgba(83,149,163,.12), transparent 26%),
    linear-gradient(180deg, #003550 0%, #02131C 100%) !important;
  color: rgba(171,201,208,.84) !important;
  border-top: 1px solid rgba(171,201,208,.14);
}
footer h1, footer h2, footer h3,
footer h4, footer h5 {
  color: #ffffff !important;
  font-weight: 800 !important;
}
/* Links footer: hover blanco con desplazamiento */
footer a {
  color: rgba(171,201,208,.84) !important;
  transition: color 180ms ease, transform 180ms ease;
  display: inline-block;
}
footer a:hover {
  color: #ffffff !important;
  transform: translateX(3px);
  padding-left: 0 !important;
}
/* Contact column */
footer .text-white                { color: #ffffff !important; }
footer .fw-bold.text-white        { color: #ffffff !important; font-weight: 800 !important; }
/* Texto institucional izquierda */
.footer-brand-text {
  max-width: 360px;
  color: rgba(171,201,208,.84) !important;
  line-height: 1.7;
}
.footer-brand-text strong         { color: #ffffff; font-weight: 700; }
.subfooter {
  margin-top: 0;
  padding-top: 0;
  background: rgba(2,19,28,.6) !important;
  color: rgba(171,201,208,.62) !important;
  font-size: 13px;
  border-top: 1px solid rgba(171,201,208,.12);
}
.subfooter a { color: rgba(171,201,208,.62) !important; }
.subfooter a:hover { color: #ffffff !important; transform: none; padding-left: 0 !important; }

/* --- Topbar accesibilidad --- */
.itcs-accessibility .form-select {
  background-color: rgba(171,201,208,.08);
  border-color: rgba(171,201,208,.24);
  color: var(--itcs-ice);
}

/* Anclas con menú fijo */
.scroll-margin {
  scroll-margin-top: 120px;
}

/* Subheader: overlay oscuro sobre cualquier imagen de fondo */
#subheader.jarallax::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(2, 19, 28, 0.62);
  z-index: 1;
  pointer-events: none;
}
#subheader .container.relative.z-2,
#subheader .gradient-edge-top { position: relative; z-index: 2; }

/* Select de contacto: que se note que es desplegable (caret + cursor) */
select.itcs-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  padding-right: 2.6rem;
}
.field-set:has(> select.itcs-select) { position: relative; }
.field-set:has(> select.itcs-select)::after {
  content: "";
  position: absolute;
  top: 1.15rem;
  right: 1.1rem;
  width: 14px;
  height: 9px;
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='none' stroke='%2300b3c4' stroke-width='2' d='M1 1l6 6 6-6'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Sombra de texto en todas las cabeceras (legibilidad sobre imagen) */
#subheader h1,
#subheader h2,
#subheader h3,
#subheader p,
#subheader .svc-hero-badge,
#subheader .crumb { text-shadow: 0 2px 14px rgba(0, 0, 0, 0.55); }

/* Logo provisorio en texto (marcas sin logo aún) */
.itcs-logo-text {
  font-weight: 800; font-size: 1.5rem; letter-spacing: .5px;
  color: var(--itcs-ice, #cfe8ee);
}
.itcs-brand-logo-lead .itcs-logo-text { font-size: 2rem; }

/* Información detallada — índice lateral + contenido (estilo documentación) */
.itcs-info-section { border-top: 1px solid rgba(171, 201, 208, 0.12); }
/* La seccion contenedora trae overflow:hidden y rompe el sticky del indice */
section:has(.itcs-info-full) { overflow: visible !important; }
.itcs-info-full { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 2.8rem; align-items: start; }
@media (max-width: 991px) { .itcs-info-full { grid-template-columns: 1fr; gap: 1.2rem; } }
/* Primer bloque = intro (ya se muestra arriba): ocultar para no duplicar */
.itcs-info-content > .itcs-info-block:first-child { }
/* Índice lateral */
.itcs-info-nav { position: sticky; top: 100px; align-self: start; }
.itcs-info-nav-inner { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid rgba(171,201,208,.14); }
.itcs-info-nav-link {
  display: block; font-size: .9rem; line-height: 1.3;
  padding: .5rem .9rem; margin-left: -1px;
  color: rgba(171,201,208,.72); border-left: 2px solid transparent;
  text-decoration: none; transition: color .15s ease, border-color .15s ease;
}
.itcs-info-nav-link:hover { color: #fff; }
.itcs-info-nav-link.active { color: var(--itcs-teal, #00b3c4); border-left-color: var(--itcs-teal, #00b3c4); font-weight: 600; }
@media (max-width: 991px) {
  .itcs-info-nav { position: static; }
  .itcs-info-nav-inner { flex-direction: row; overflow-x: auto; border-left: 0; border-bottom: 1px solid rgba(171,201,208,.14); padding-bottom: 6px; gap: 6px; }
  .itcs-info-nav-link { white-space: nowrap; border-left: 0; border-radius: 999px; background: rgba(171,201,208,.06); padding: .4rem .8rem; }
  .itcs-info-nav-link.active { border-left: 0; background: rgba(0,179,196,.16); }
}
/* Contenido */
.itcs-info-content > .itcs-info-block { margin: 0 0 2.1rem; scroll-margin-top: 100px; }
.itcs-info-h { font-size: 1.25rem; color: #fff; font-weight: 700; margin: 0 0 .15rem; padding-left: .7rem; border-left: 3px solid var(--itcs-teal, #00b3c4); }
.itcs-info-sub { color: var(--itcs-teal, #00b3c4); font-weight: 600; margin: 0 0 .6rem; }
.itcs-info-h5 { font-size: .98rem; color: #fff; font-weight: 700; margin: 1rem 0 .35rem; }
.itcs-info-label { font-weight: 600; color: var(--itcs-ice, #cfe8ee); margin: .85rem 0 .35rem; }
.itcs-info-list { margin-bottom: .5rem; }
.itcs-info-section p, .itcs-info-block p { opacity: .9; }

/* Fix hover botones btn-line: texto se oscurecia (.btn-main:hover pone navy) */
.btn-line.fx-slide span { transform: none !important; opacity: 1 !important; }
.btn-line.fx-slide::before { display: none !important; }
.btn-main.btn-line:hover,
.btn-main.btn-line:hover span { color: var(--itcs-ice, #cfe8ee) !important; }

/* Slide banner "20 años" dentro del carrusel (llena el slide) */
.itcs-banner-slide { background: #010612; }
.itcs-banner-slide picture { display: block; width: 100%; height: 100%; }
.itcs-banner-slide img {
  width: 100%; height: 100%;
  object-fit: contain; object-position: center;
  display: block;
}
/* Filtro sutil (mas claro que el de las otras slides) */
.itcs-banner-slide .sw-overlay { background: rgba(2, 19, 28, 0.28); opacity: 1; }

/* Certificaciones ISO en el footer (visibles en toda la web) */
.itcs-footer-cert { display: flex; gap: 10px; margin-top: 16px; }
.itcs-footer-cert a { display: inline-block; line-height: 0; }
.itcs-footer-cert img {
  height: 78px; width: auto; display: block;
  border-radius: 6px; border: 1px solid rgba(171, 201, 208, 0.2);
  background: #fff; padding: 3px;
  transition: transform .2s ease, border-color .2s ease;
}
.itcs-footer-cert a:hover img { transform: translateY(-2px); border-color: var(--itcs-teal, #00b3c4); }

/* Redes sociales en footer */
.itcs-social { display: flex; gap: 10px; margin-top: 18px; }
.itcs-social a {
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px;
  border: 1px solid rgba(171, 201, 208, 0.18);
  color: #abc9d0; font-size: 18px;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
@media (hover: hover) and (pointer: fine) {
  .itcs-social a:hover {
    border-color: var(--itcs-teal, #00b3c4);
    color: var(--itcs-teal, #00b3c4);
    transform: translateY(-2px);
  }
}

/* B — Titulo de cabecera mas equilibrado en movil */
@media (max-width: 767px) {
  #subheader h1 { font-size: 2.1rem; line-height: 1.18; }
}

/* Rails laterales "Ir arriba"/scrollbar: ocultar tambien en tablets (se superponen) */
@media (max-width: 991px) {
  .float-text, .scrollbar-v { display: none !important; }
}

/* C — Tap targets minimos (48px) en campos del formulario */
.field-set input.form-control,
.field-set select.form-control { min-height: 48px; }

/* D — Foco visible para navegacion por teclado (accesibilidad) */
a.menu-item:focus-visible,
.btn-main:focus-visible,
.svc-filter-btn:focus-visible,
.brand-tab:focus-visible,
.tec-card:focus-visible,
.svc-card-wrap a:focus-visible,
a.svc-tech-chip:focus-visible,
.svc-btn-outline:focus-visible,
.form-control:focus-visible {
  outline: 2px solid var(--itcs-teal, #00b3c4);
  outline-offset: 2px;
  border-radius: 6px;
}

/* --- Botón "Ir arriba" — circular, esquina inferior derecha, discreto --- */
#back-to-top,
.back-to-top,
a#back-to-top,
a.back-to-top {
  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  left: auto !important;
  top: auto !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  transform: none !important;
  background: linear-gradient(180deg, rgba(6,43,59,.82), rgba(3,27,39,.92)) !important;
  color: var(--itcs-ice) !important;
  border: 1px solid rgba(171,201,208,.16) !important;
  box-shadow: 0 18px 45px rgba(2,19,28,.42) !important;
  backdrop-filter: blur(14px);
  z-index: 50;
  font-size: 0;
  line-height: 0;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-indent: 0;
}
#back-to-top *, .back-to-top * { display: none !important; }
#back-to-top::before,
.back-to-top::before {
  content: "↑";
  display: block;
  font-size: 18px;
  line-height: 1;
  color: var(--itcs-ice);
  font-family: system-ui, sans-serif;
}
#back-to-top:hover,
.back-to-top:hover {
  background: linear-gradient(180deg, rgba(13,80,101,.88), rgba(6,43,59,.96)) !important;
  border-color: rgba(83,149,163,.36) !important;
}

/* --- Anti-light-mode: cualquier .bg-white / utilidades claras del template --- */
.bg-white, .bg-white-10, .bg-white-100,
.bg-light, .bg-light-2, .bg-grey, .bg-gray, .bg-gray-50,
.bg-slate-50, .bg-neutral-50, .bg-zinc-50, .bg-stone-50 {
  background:
    radial-gradient(circle at 15% 8%, rgba(83,149,163,.13), transparent 26%),
    linear-gradient(180deg, var(--ink-925) 0%, var(--ink-950) 100%) !important;
  color: var(--text-main) !important;
}
.bg-white.text-dark, .bg-white .text-dark { color: var(--itcs-ice) !important; }
.bg-white h1, .bg-white h2, .bg-white h3, .bg-white h4, .bg-white h5 { color: var(--itcs-ice) !important; }

/* Jarallax subheader: sin tocar, dejar imágenes como están */

/* Secciones con data-bgimage del template (cargan imágenes claras) — neutralizar */
section[data-bgimage] {
  background-image: none !important;
  background:
    radial-gradient(circle at 15% 10%, rgba(83,149,163,.10), transparent 26%),
    radial-gradient(circle at 90% 70%, rgba(0,100,121,.14),  transparent 32%),
    linear-gradient(180deg, var(--ink-925) 0%, var(--ink-900) 100%) !important;
  color: var(--text-main) !important;
}
.text-black, .text-dark,
.text-gray-950, .text-gray-900, .text-gray-800, .text-gray-700,
.text-slate-950, .text-slate-900,
.text-neutral-950, .text-neutral-900 {
  color: var(--itcs-ice) !important;
}

/* Logo iTCS en cabecera: mismo criterio que web-itcs-v3 (globals .itcs-logo__img / .site-theme-logo__img) */
/*
 * style.css define --logo-width en * { } (cada <img>); hay que fijar aquí con mayor especificidad.
 */
#logo img,
#logo a img {
  --logo-width: min(220px, 42vw);
  width: auto !important;
  max-width: min(220px, 42vw) !important;
  height: auto !important;
  max-height: 44px !important;
  object-fit: contain !important;
  vertical-align: middle;
  box-sizing: border-box;
}
@media (min-width: 992px) {
  #logo img,
  #logo a img {
    max-height: 50px !important;
  }
}
#logo .itcs-logo-header-c {
  display: none !important;
}
#logo .itcs-logo-header-w {
  display: inline-block !important;
}
/* El template oculta .logo-main en pantallas chicas; el !important de .itcs-logo-header-w
   rompía eso y dejaba dos logos. Alineamos con el breakpoint del JS (993px). */
@media (max-width: 992px) {
  #logo .logo-main.itcs-logo-header-w {
    display: none !important;
  }
  #logo .logo-mobile {
    display: block !important;
  }
}
@media (min-width: 993px) {
  #logo .logo-mobile {
    display: none !important;
  }
}

/* Móvil/tablet: CTA + hamburguesa no deben ocupar el 100% del ancho (rompe alineación) */
@media (max-width: 992px) {
  :root {
    /* Fila: logo + CTA; si es bajo, subir solo este valor. */
    --itcs-mobile-header-bar: 6.75rem;
  }
  #wrapper {
    overflow-x: hidden;
  }
  header.header-mobile .de-flex {
    align-items: center;
  }
  header.header-mobile .de-flex > .de-flex-col:first-child {
    min-width: 0;
  }
  header.header-mobile #logo a {
    display: inline-flex;
    align-items: center;
    line-height: 0;
  }
  header.header-mobile .de-flex > .de-flex-col:nth-child(3) .menu_side_area,
  header.header-mobile .menu_side_area {
    width: auto !important;
    max-width: none;
    margin-left: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: nowrap;
  }
  /*
   * El template deja .header-col-mid #mainmenu con position: absolute (más específico que #mainmenu).
   * Sin cerrar el panel, se ve "Inicio" bajo el logo. Ocultar hasta .menu-open (toggle en designesia.js).
   */
  header.header-mobile:not(.menu-open) #mainmenu,
  header.header-mobile:not(.menu-open) .header-col-mid #mainmenu {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    pointer-events: none !important;
    border: none !important;
    box-shadow: none !important;
  }
  header.header-mobile.menu-open #mainmenu,
  header.header-mobile.menu-open .header-col-mid #mainmenu {
    position: fixed !important;
    /* = safe-area + franja (header con padding-top safe y .de-flex con min-height) */
    top: calc(env(safe-area-inset-top, 0px) + var(--itcs-mobile-header-bar)) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: calc(100vh - env(safe-area-inset-top, 0px) - var(--itcs-mobile-header-bar)) !important;
    min-height: calc(100dvh - env(safe-area-inset-top, 0px) - var(--itcs-mobile-header-bar)) !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0.5rem 1.15rem 1.5rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    visibility: visible !important;
    pointer-events: auto !important;
    /* Debajo de las columnas logo / CTA (esas llevan z-index mayor) */
    z-index: 1 !important;
    background: rgba(10, 12, 20, 0.97) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
  }
  html[data-theme="dark"] header.header-mobile.menu-open #mainmenu {
    background: rgba(10, 12, 20, 0.98) !important;
  }
  #menu-btn {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }
  /* Altura mínima = franja de marca; laterales por encima del panel (z-index) */
  header.header-mobile.menu-open .de-flex {
    position: relative;
    z-index: 2 !important;
    isolation: isolate;
    min-height: var(--itcs-mobile-header-bar);
    padding-bottom: 0.35rem;
  }
  header.header-mobile.menu-open .de-flex > .de-flex-col:not(.header-col-mid) {
    position: relative;
    z-index: 3 !important;
  }
  header.header-mobile.menu-open .header-col-mid {
    z-index: 0 !important;
  }
  header.header-mobile.menu-open #menu-btn,
  header.header-mobile .menu_side_area,
  header.header-mobile.menu-open .de-flex > .de-flex-col:first-child {
    position: relative;
  }
  header.header-mobile .header-col-mid {
    min-height: 0;
  }
  /* Fila superior: safe-area + sólida detrás de logo/CTA */
  header.header-mobile.menu-open {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-top: env(safe-area-inset-top, 0);
    z-index: 10055;
    background: linear-gradient(
      180deg,
      rgba(10, 12, 20, 0.99) 0%,
      rgba(10, 12, 20, 0.94) 100%
    ) !important;
    overflow: visible !important; /* el template pone overflow:hidden; puede recortar el panel fijo */
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
  }
  header.header-mobile.menu-open .header-col-mid {
    overflow: visible !important;
  }
  body:has(#wrapper > header.header-mobile.menu-open) {
    overflow: hidden;
  }
}

@media (max-width: 767.98px) {
  .scroll-margin {
    scroll-margin-top: 88px;
  }
}

/* Tarjetas de servicios: misma altura, texto flexible, CTA al pie */
.col-lg-4.col-md-6.d-flex .itcs-service-card {
  display: flex !important;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
}
.itcs-service-card > .relative.z-2 {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.itcs-service-card > .relative.z-2 p {
  flex: 1 1 auto;
  margin-bottom: 1rem;
  /* Sin esto, el ítem flex tiene min-width:auto y el párrafo no puede ser más estrecho que el texto en una sola línea */
  min-width: 0;
  width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.itcs-service-card > .relative.z-2 .btn-main {
  margin-top: auto;
  align-self: flex-start;
}

/* style.css define .d-flex{white-space:nowrap}, lo que recorta texto en cualquier
   contenedor flex de Bootstrap. Bootstrap NO aplica nowrap a .d-flex; lo restauramos.
   Botones (.btn-main) y marquee tienen su propio nowrap, así que no se ven afectados. */
.d-flex { white-space: normal; }

/* Texto que envuelve dentro del ancho de la tarjeta (evita desbordes en flex) */
.itcs-service-card,
.itcs-partner-card,
.itcs-product-card,
.svc-card {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  white-space: normal;
}
.itcs-service-card,
.itcs-partner-card,
.itcs-product-card {
  overflow-x: hidden; /* refuerzo: el wrap a veces falla sin min-width en flex hijos */
}
.itcs-service-card > .relative.z-2,
.itcs-partner-card > .relative.z-2,
.itcs-product-card > .relative.z-2 {
  min-width: 0;
  max-width: 100%;
  width: 100%;
}
.itcs-service-card h4,
.itcs-partner-card h4,
.itcs-product-card h4 {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.itcs-partner-card > .relative.z-2 p,
.itcs-partner-card .itcs-partner-cat,
.itcs-product-card p {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.itcs-service-card .btn-main,
.itcs-partner-card .btn-main,
.itcs-product-card .btn-main {
  max-width: 100%;
  white-space: normal;
}
.itcs-service-card .btn-main span,
.itcs-partner-card .btn-main span,
.itcs-product-card .btn-main span {
  overflow-wrap: break-word;
}

/* Collage equipo: proporciones fijas e imágenes alineadas */
.itcs-team-hero-img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
  vertical-align: middle;
}
.itcs-team-square {
  aspect-ratio: 1 / 1;
  width: 100%;
  background: #0f172a;
}
.itcs-team-square-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.itcs-team-collage-wrap {
  position: relative;
}
.itcs-team-collage-wrap .itcs-team-loc-badge {
  z-index: 3;
}
.itcs-team-loc-badge {
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  background: linear-gradient(90deg, var(--itcs-c-electric), var(--itcs-c-blue)) !important;
  color: #fff !important;
  border: none;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
}
.itcs-team-stat-num {
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 700;
  line-height: 1.1;
  color: var(--itcs-c-blue);
}
html[data-theme="dark"] .itcs-team-stat-num {
  color: var(--itcs-c-mint);
}
.itcs-team-stat-box {
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(48, 54, 192, 0.35);
}
html:not([data-theme="dark"]) .itcs-team-stat-box {
  background: #f1f5f9;
  border-color: rgba(48, 54, 192, 0.2);
  color: #0f172a;
}
html:not([data-theme="dark"]) .itcs-team-stat-box .itcs-team-stat-num {
  color: var(--itcs-c-electric);
}

/* Partners: mismas tarjetas que servicios (gradiente oscuro + CTA al pie) */
.col-lg-4.col-md-6.d-flex .itcs-partner-card {
  display: flex !important;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
}
.itcs-partner-card > .relative.z-2 {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.itcs-partner-card .itcs-partner-cat {
  flex: 1 1 auto;
  margin-bottom: 1rem;
  opacity: 0.88;
  font-size: 0.9375rem;
  min-width: 0;
  width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.itcs-partner-card .btn-main {
  margin-top: auto;
  align-self: flex-start;
}
.itcs-partner-badge {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.itcs-partner-logo-wrap {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 1rem;
}
.itcs-partner-logo-wrap--dual {
  gap: 0.65rem;
  flex-wrap: wrap;
}
.itcs-partner-logo-wrap--dual .itcs-partner-logo-plus {
  color: rgba(255, 255, 255, 0.55);
  font-weight: 600;
  font-size: 1.1rem;
  line-height: 1;
}
.itcs-partner-logo {
  max-height: 40px;
  width: auto;
  max-width: min(160px, 100%);
  object-fit: contain;
  object-position: left center;
  display: block;
}
/* Simple Icons y SVG monocromo: blanco sobre gradiente */
.itcs-partner-logo--mono {
  filter: brightness(0) invert(1);
  opacity: 0.95;
}
/* Favicons / PNG con color (se ven bien sobre fondo oscuro) */
.itcs-partner-logo--color {
  filter: none;
  opacity: 1;
  max-height: 36px;
}
/* SVG tipográfico provisional (sin marca vectorial en assets) */
.itcs-partner-logo--textsvg {
  filter: none;
  max-height: 34px;
  max-width: 220px;
}

/* Servicios: bloque lateral con marcas (mismo lenguaje que partners) */
.itcs-service-tech-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1.15rem;
}
.itcs-service-tech-logos .itcs-partner-logo {
  max-height: 32px;
  max-width: 120px;
}
.itcs-service-tech-logos .itcs-partner-logo--mono {
  max-height: 28px;
}
.itcs-service-tech-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.75;
  margin-bottom: 0.75rem;
}

/* Productos: tarjeta con logo arriba y CTA al pie */
.col-lg-4.col-md-6.d-flex .itcs-product-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
}
.itcs-product-card .itcs-partner-logo-wrap {
  margin-bottom: 0.85rem;
}
.itcs-product-card .itcs-partner-logo {
  max-height: 38px;
}
.itcs-product-card p {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.itcs-product-card .btn-main {
  margin-top: auto;
  align-self: flex-start;
}

/*
 * Tarjetas (Servicios destacados, etc.): en HTML vienen con overflow-hidden;
 * además .itcs-service-card p tenía flex:1 1 auto y el recuadro recortaba el texto en móvil/tablet.
 */
@media (max-width: 991.98px) {
  /* En móvil/tablet no mostrar el párrafo descriptivo (solo título, icono y CTA) */
  .itcs-service-card > .relative.z-2 > p {
    display: none !important;
  }
  .col-lg-4.col-md-6.d-flex {
    align-items: flex-start !important;
    min-width: 0; /* columna flex puede impedir el wrap sin esto */
  }
  .col-lg-4.col-md-6.d-flex .itcs-service-card,
  .col-lg-4.col-md-6.d-flex .itcs-partner-card,
  .col-lg-4.col-md-6.d-flex .itcs-product-card {
    min-height: auto !important;
    height: auto !important;
    max-height: none !important;
    /* Contiene el ancho; el eje Y sigue pudiendo crecer con el contenido (no vuelve a recortar como overflow:hidden) */
    overflow-x: hidden;
    overflow-y: visible;
  }
  .itcs-service-card > .relative.z-2,
  .itcs-partner-card > .relative.z-2 {
    flex: none !important;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
  }
  .itcs-service-card > .relative.z-2 p,
  .itcs-partner-card > .relative.z-2 p {
    flex: 0 0 auto !important;
  }
  .itcs-product-card {
    overflow-x: hidden;
    overflow-y: visible;
  }
  .itcs-product-card p {
    flex: 0 0 auto !important;
  }
}

/* Certificaciones ISO: franja identificativa de la norma */
.itcs-iso-badge {
  display: block;
  width: 100%;
  max-width: 280px;
  height: auto;
  margin-bottom: 1.25rem;
  border-radius: 8px;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.12);
}
html[data-theme="dark"] .itcs-iso-badge {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4);
}

/* ============================================================
   TIMELINE — Sección Hitos
   ============================================================ */
.itcs-hitos-section { padding: 80px 0; }

/* Línea vertical */
.itcs-timeline {
  position: relative;
  display: flex;
  flex-direction: column;
}
.itcs-timeline::before {
  content: "";
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 16px;
  width: 2px;
  background: linear-gradient(
    180deg,
    rgba(171,201,208,.06) 0%,
    rgba(83,149,163,.50) 18%,
    rgba(83,149,163,.50) 82%,
    rgba(171,201,208,.06) 100%
  );
}

/* Item */
.itcs-timeline-item {
  position: relative;
  padding-left: 56px;
  padding-bottom: 36px;
}
.itcs-timeline-item:last-child { padding-bottom: 0; }

/* Nodo */
.itcs-timeline-node {
  position: absolute;
  top: 30px;
  left: 9px;          /* 16px (centro línea) – 7px (radio del nodo) */
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #5395A3;
  border: 3px solid #031B27;
  box-shadow:
    0 0 0 5px rgba(83,149,163,.16),
    0 0 22px rgba(83,149,163,.38);
  z-index: 2;
}
.itcs-timeline-node--last {
  background: var(--itcs-ice);
  box-shadow:
    0 0 0 5px rgba(171,201,208,.14),
    0 0 22px rgba(171,201,208,.28);
}

/* Card */
.itcs-timeline-card {
  padding: 26px 30px;
  border-radius: 20px;
  background:
    radial-gradient(circle at top left, rgba(171,201,208,.09), transparent 36%),
    linear-gradient(145deg, rgba(13,80,101,.74) 0%, rgba(3,27,39,.95) 100%);
  border: 1px solid rgba(171,201,208,.14);
  box-shadow:
    0 18px 45px rgba(2,19,28,.42),
    inset 0 1px 0 rgba(171,201,208,.05);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}
.itcs-timeline-card:hover {
  transform: translateY(-4px);
  border-color: rgba(83,149,163,.34);
  box-shadow:
    0 24px 60px rgba(2,19,28,.54),
    0 0 36px rgba(83,149,163,.10);
}

/* Badge tipo */
.itcs-timeline-badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 999px;
  color: #ABC9D0;
  background: linear-gradient(135deg, rgba(171,201,208,.10), rgba(83,149,163,.08));
  border: 1px solid rgba(171,201,208,.22);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

/* Año */
.itcs-timeline-year {
  color: #ffffff;
  font-size: clamp(30px, 4vw, 44px);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 10px;
}

/* Título */
.itcs-timeline-title {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 17px;
  line-height: 1.3;
  margin-bottom: 8px;
}

/* Descripción */
.itcs-timeline-desc {
  color: rgba(171,201,208,.82) !important;
  line-height: 1.65;
  margin-bottom: 0;
  font-size: 15px;
}

/* Mobile */
@media (max-width: 767px) {
  .itcs-timeline::before { left: 12px; }
  .itcs-timeline-node { left: 5px; top: 26px; }
  .itcs-timeline-item { padding-left: 40px; padding-bottom: 28px; }
  .itcs-timeline-card { padding: 20px 22px; }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .itcs-timeline-card { transition: none; }
}

/* --- Sección Blog --- */
.itcs-blog-section h2 { color: #ffffff !important; font-weight: 800; }
.itcs-blog-section .lead {
  color: rgba(171,201,208,.86) !important;
  font-weight: 500;
}

/* Blog: fondos de marca sin fotos de stock con logos ajenos */
/* Blog card (listado dinámico) */
.itcs-blog-badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #ABC9D0 !important;
  background: rgba(83,149,163,.38);
  border: 1px solid rgba(171,201,208,.50);
  border-radius: 999px;
  padding: 0.22rem 0.85rem;
  box-shadow: inset 0 1px 0 rgba(171,201,208,.18), 0 2px 8px rgba(2,19,28,.3);
}

/* Badge categoría cards blog */
.itcs-blog-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
  color: #ABC9D0;
  background: linear-gradient(135deg, rgba(171,201,208,.14), rgba(83,149,163,.10));
  border: 1px solid rgba(171,201,208,.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.itcs-blog-card-list {
  background: var(--surface-glass);
  border: 1px solid var(--line-soft);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}
.itcs-blog-card-list:hover {
  transform: translateY(-6px);
  border-color: var(--line-accent);
  box-shadow: 0 30px 82px rgba(2,19,28,.62), 0 0 48px rgba(83,149,163,.12);
}
.itcs-blog-card {
  position: relative;
  isolation: isolate;
  border: 1px solid rgba(171,201,208,.14);
  border-radius: 20px;
  overflow: visible !important;
  box-shadow: 0 18px 45px rgba(2,19,28,.42), inset 0 1px 0 rgba(171,201,208,.05);
  transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}
/* Clip only the thumb image, not card body */
.itcs-blog-card > a:first-child {
  overflow: hidden;
  border-radius: 19px 19px 0 0;
  display: block;
}
.itcs-blog-card:hover {
  transform: translateY(-4px);
  border-color: rgba(83,149,163,.34);
  box-shadow: 0 24px 60px rgba(2,19,28,.54), 0 0 36px rgba(83,149,163,.10);
}
/* Fondos específicos por card */
.itcs-blog-card-bg--a {
  background: linear-gradient(145deg, #003550 0%, #00465A 60%, #006479 100%);
}
.itcs-blog-card-bg--b {
  background: linear-gradient(145deg, #031B27 0%, #003550 55%, #0A3D50 100%);
}
.itcs-blog-card-bg--c {
  background: linear-gradient(145deg, #052333 0%, #006479 60%, #5395A3 100%);
}
/* Z-index: contenido sobre fondo */
.itcs-blog-card > *,
.itcs-blog-card .p-4,
.itcs-blog-card h4,
.itcs-blog-card p,
.itcs-blog-card a,
.itcs-blog-card .itcs-blog-badge { position: relative; z-index: 3; }
/* Títulos de cards: blanco puro */
.itcs-blog-card h4,
.itcs-blog-card h4 a { color: #ffffff !important; font-weight: 700 !important; letter-spacing: -0.02em; }
.itcs-blog-card:hover h4,
.itcs-blog-card:hover h4 a { color: #ffffff !important; }
/* Descripciones: celeste claro */
.itcs-blog-card p { color: rgba(171,201,208,.86) !important; }
.itcs-blog-card:hover p { color: rgba(171,201,208,.96) !important; }
.itcs-blog-card .itcs-blog-card-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  transition: transform 0.35s ease, opacity 0.35s ease;
}
.itcs-blog-card:hover .itcs-blog-card-bg {
  transform: scale(1.03);
  opacity: 0.95;
}
.itcs-blog-card .gradient-edge-bottom { z-index: 1; }
.itcs-blog-card .position-relative.z-2,
.itcs-blog-card > .absolute.z-2 { z-index: 2 !important; }

/* Altura mínima uniforme en todas las blog cards */
.itcs-blog-card {
  min-height: 300px;
  overflow: hidden !important;
}

/* ── Cards de blog (home + listado) — estructura limpia ── */
.itcs-home-blog-card {
  display: block;
  position: relative;
  min-height: 300px;
  border-radius: 20px;
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  border: 1px solid rgba(171,201,208,.14);
  box-shadow: 0 18px 45px rgba(2,19,28,.42);
  transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}
.itcs-home-blog-card:hover {
  transform: translateY(-4px);
  border-color: rgba(83,149,163,.34);
  box-shadow: 0 24px 60px rgba(2,19,28,.54), 0 0 36px rgba(83,149,163,.10);
  color: #fff;
}
.itcs-home-blog-fade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(2,19,28,.92) 0%, rgba(2,19,28,.30) 60%, transparent 100%);
  z-index: 1;
}
.itcs-home-blog-body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 24px;
  z-index: 2;
}
.itcs-home-blog-body p {
  color: rgba(171,201,208,.82);
  font-size: .9rem;
  line-height: 1.55;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}
.itcs-home-blog-body h4 {
  color: #fff;
  font-weight: 700;
  line-height: 1.25;
}

/* Blog listado: franja de marca en lugar de foto stock */
.itcs-blog-thumb {
  min-height: 200px;
  width: 100%;
  display: block;
}

/* Cuerpo del artículo (HTML del admin) */
.itcs-blog-body {
  font-size: 1.05rem;
  line-height: 1.75;
  max-width: 48rem;
}
.itcs-blog-body p {
  margin-bottom: 1rem;
}
.itcs-blog-body h2,
.itcs-blog-body h3,
.itcs-blog-body h4 {
  margin-top: 1.75rem;
  margin-bottom: 0.75rem;
  font-weight: 700;
}
.itcs-blog-body h2 {
  font-size: 1.5rem;
}
.itcs-blog-body h3 {
  font-size: 1.25rem;
}
.itcs-blog-body ul,
.itcs-blog-body ol {
  margin-bottom: 1rem;
  padding-left: 1.25rem;
}
.itcs-blog-body blockquote {
  border-left: 4px solid var(--itcs-c-blue);
  padding-left: 1rem;
  margin: 1.25rem 0;
  opacity: 0.9;
}

/* Equipo: tarjetas por rol (legacy; la home/about usan foto grupal .itcs-team-group-photo) */
.itcs-team-roles-section {
  background:
    radial-gradient(circle at 15% 10%, rgba(83,149,163,.12), transparent 26%),
    radial-gradient(circle at 90% 70%, rgba(0,100,121,.14), transparent 32%),
    linear-gradient(180deg, var(--ink-925) 0%, var(--ink-900) 100%);
  color: var(--text-main);
}
.itcs-team-roles-section h2 { color: var(--itcs-ice); }
.itcs-team-roles-overline {
  color: var(--itcs-c-blue);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 0.8125rem;
}
html[data-theme="dark"] .itcs-team-roles-overline {
  color: var(--itcs-c-mint);
}
.itcs-team-roles-lead {
  color: #64748b;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
}
html[data-theme="dark"] .itcs-team-roles-lead {
  color: rgba(203, 213, 225, 0.85);
}

/* Equipo: una sola imagen grupal */
.itcs-team-group-photo {
  margin: 0 auto;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(15, 23, 42, 0.12);
}
html[data-theme="dark"] .itcs-team-group-photo {
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.45);
}
.itcs-team-group-photo img {
  width: 100%;
  height: auto;
  display: block;
}

.itcs-team-role-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 6px 28px rgba(15, 23, 42, 0.09);
}
html[data-theme="dark"] .itcs-team-role-card {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}
.itcs-team-role-card__media img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
  vertical-align: middle;
}
.itcs-team-role-card__body {
  flex: 1 1 auto;
  background: #f8f9fa;
  padding: 1.35rem 1rem;
  text-align: center;
}
html[data-theme="dark"] .itcs-team-role-card__body {
  background: #152238;
}
.itcs-team-role-card__body h4 {
  font-weight: 700;
  font-size: 1.125rem;
}
.itcs-team-role-card__body .itcs-team-role-sub {
  font-size: 0.875rem;
  color: #64748b;
  margin-bottom: 0;
}
html[data-theme="dark"] .itcs-team-role-card__body .itcs-team-role-sub {
  color: rgba(203, 213, 225, 0.75);
}

/* Nuestras oficinas — dos fichas con rótulo sobre imagen */
.itcs-offices-section .itcs-offices-lead {
  color: rgba(203, 213, 225, 0.88);
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
}
.itcs-office-tile {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  display: block;
}
.itcs-office-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease;
}
.itcs-office-tile:hover img {
  transform: scale(1.03);
}
.itcs-office-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(10, 12, 20, 0.82) 100%);
  pointer-events: none;
  z-index: 1;
}
.itcs-office-tile__label {
  position: absolute;
  left: 1.35rem;
  bottom: 1.25rem;
  z-index: 2;
  font-weight: 700;
  font-size: 1.125rem;
  color: #fff;
  line-height: 1.3;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

/* —— Inicio: hero (Swiper) — texto alineado al área de la diapositiva, sin tocar imágenes ——
 * 1) Antes: `overflow-hidden` + caption con translateY(-50%) recortaba o “movía” la última línea al pasar de slide.
 * 2) Título con `clamp` para que quepa ancho; caption en flex, sin doble transform con el slide. */
#inicio-hero.itcs-hero-home,
.itcs-hero-home {
  overflow: visible;
}

#inicio-hero .mh-700 {
  min-height: min(100vh, 900px);
}

@media (min-width: 992px) {
  #inicio-hero .mh-700 {
    min-height: 700px;
  }
}

#inicio-hero .sw-caption {
  top: 0;
  right: 0;
  left: 0;
  transform: none;
  display: flex;
  align-items: center;
  min-height: 100%;
  padding: 4rem 0 5.5rem;
  box-sizing: border-box;
  overflow: visible;
}

#inicio-hero .sw-caption .container {
  width: 100%;
  max-width: 100%;
}

#inicio-hero .sw-text-wrapper {
  max-width: 52rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

#inicio-hero h1.slider-title,
#inicio-hero h2.slider-title {
  max-width: 100%;
  font-size: clamp(1.6rem, 1.1rem + 2.4vw, 3.4rem) !important;
  line-height: 1.18;
  letter-spacing: -0.02em;
  word-wrap: break-word;
  overflow-wrap: break-word;
  text-wrap: balance;
}

#inicio-hero h3.slider-teaser,
#inicio-hero p.slider-teaser {
  line-height: 1.4;
  overflow-wrap: break-word;
}

#inicio-hero .swiper-slide .swiper-inner {
  animation: none !important;
}

/* ==========================================================
   EFFECTS v2 — scroll reveal, stagger, shimmer, marquee, CTA
   ========================================================== */

/* --- Scroll reveal --- */
.itcs-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 700ms ease, transform 700ms cubic-bezier(.22,.68,0,1.2);
}
.itcs-reveal.itcs-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger para hijos directos (cards, items) */
.itcs-stagger.itcs-visible > *:nth-child(1) { transition-delay:  80ms; }
.itcs-stagger.itcs-visible > *:nth-child(2) { transition-delay: 160ms; }
.itcs-stagger.itcs-visible > *:nth-child(3) { transition-delay: 240ms; }
.itcs-stagger.itcs-visible > *:nth-child(4) { transition-delay: 320ms; }
.itcs-stagger.itcs-visible > *:nth-child(5) { transition-delay: 400ms; }
.itcs-stagger.itcs-visible > *:nth-child(6) { transition-delay: 480ms; }
.itcs-stagger > * {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 650ms ease, transform 650ms cubic-bezier(.22,.68,0,1.2);
}
.itcs-stagger.itcs-visible > * {
  opacity: 1;
  transform: translateY(0);
}

/* --- Shimmer hover en cards --- */
.itcs-service-card,
.itcs-partner-card,
.itcs-product-card,
.de-box, .card {
  overflow: hidden;
}
.itcs-service-card::before,
.itcs-partner-card::before,
.itcs-product-card::before,
.de-box::before, .card::before {
  background:
    radial-gradient(circle at 18% 0%, rgba(171,201,208,.12), transparent 38%),
    linear-gradient(135deg, rgba(171,201,208,.08), transparent 44%);
  opacity: 0.8;
  transition: opacity 280ms ease;
}
/* Shimmer sweep */
.itcs-service-card::after,
.itcs-partner-card::after,
.itcs-product-card::after {
  background: linear-gradient(90deg, transparent, rgba(171,201,208,.12) 42%, transparent 58%),
              linear-gradient(90deg, transparent, rgba(171,201,208,.42), rgba(83,149,163,.28), transparent);
  background-size: 200% 1px, 100% 1px;
  background-position: -200% bottom, 0 bottom;
  background-repeat: no-repeat;
  transition: background-position 600ms ease;
  height: auto;
  inset: 0 0 auto 0;
  top: 0;
  bottom: 0;
}
.itcs-service-card:hover::after,
.itcs-partner-card:hover::after,
.itcs-product-card:hover::after {
  background-position: 200% bottom, 0 bottom;
}

/* Cursor light — activado via JS con --mx/--my */
.itcs-service-card,
.itcs-partner-card,
.itcs-product-card {
  --mx: 50%;
  --my: 50%;
}
.itcs-service-card:hover::before,
.itcs-partner-card:hover::before,
.itcs-product-card:hover::before {
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(171,201,208,.16), transparent 55%),
    radial-gradient(circle at 18% 0%, rgba(171,201,208,.10), transparent 38%),
    linear-gradient(135deg, rgba(171,201,208,.06), transparent 44%);
  opacity: 1;
}

/* --- Marquee: bordes desvanecidos --- */
.bg-color {
  position: relative;
  overflow: hidden;
}
.bg-color::before,
.bg-color::after {
  content: "";
  position: absolute;
  top: 0;
  width: 100px;
  height: 100%;
  z-index: 2;
  pointer-events: none;
}
.bg-color::before {
  left: 0;
  background: linear-gradient(90deg, var(--itcs-navy), transparent);
}
.bg-color::after {
  right: 0;
  background: linear-gradient(270deg, var(--itcs-navy), transparent);
  /* Anular el pseudo-element de sección anterior */
  bottom: auto;
  filter: none;
  height: 100%;
}

/* --- CTA final breathing glow --- */
section:last-of-type,
.cta-section {
  position: relative;
  overflow: hidden;
}
section:last-of-type::before {
  content: "";
  position: absolute;
  inset: auto 15% -120px 15%;
  height: 240px;
  background: radial-gradient(ellipse at center, rgba(83,149,163,.28), transparent 68%);
  filter: blur(30px);
  animation: ctaGlow 4s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
@keyframes ctaGlow {
  from { opacity: .45; transform: scale(.96); }
  to   { opacity: .85; transform: scale(1.04); }
}

/* --- Accesibilidad --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
  html { scroll-behavior: auto !important; }
}

/* ==========================================================
   PARTNER CARDS — rediseño premium
   ========================================================== */

.itcs-partner-card-new {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 220px;
  padding: 22px;
  border-radius: 22px;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(171,201,208,.12), transparent 34%),
    linear-gradient(145deg, rgba(13,80,101,.74) 0%, rgba(3,27,39,.94) 100%);
  border: 1px solid rgba(171,201,208,.14);
  box-shadow: 0 18px 45px rgba(2,19,28,.42), inset 0 1px 0 rgba(171,201,208,.06);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}
.itcs-partner-card-new::after {
  content: "";
  position: absolute;
  left: 22px; right: 22px; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(171,201,208,.32), rgba(83,149,163,.28), transparent);
  pointer-events: none;
}
.itcs-partner-card-new:hover {
  transform: translateY(-5px);
  border-color: rgba(83,149,163,.38);
  box-shadow: 0 28px 70px rgba(2,19,28,.58), 0 0 42px rgba(83,149,163,.12);
}

.pcard-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 76px;
  height: 48px;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(171,201,208,.14);
  flex-shrink: 0;
}
.pcard-logo img {
  max-width: 120px;
  max-height: 32px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.pcard-cat {
  color: rgba(171,201,208,.80) !important;
  font-size: 0.9rem;
  margin-bottom: 0;
  flex: 1 1 auto;
  padding-top: 0.5rem;
}

.pcard-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-top: 22px;
  padding: 9px 18px;
  border-radius: 999px;
  color: #003550 !important;
  background: linear-gradient(135deg, #ABC9D0 0%, #5395A3 100%);
  font-size: 0.8rem;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 10px 26px rgba(0,100,121,.22), inset 0 1px 0 rgba(255,255,255,.16);
  transition: transform 180ms ease, box-shadow 180ms ease;
  letter-spacing: 0.02em;
}
.pcard-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(83,149,163,.26);
  color: #003550 !important;
}

/* Badges */
.partner-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid rgba(171,201,208,.16);
  flex-shrink: 0;
}
.partner-badge--platinum {
  color: #ABC9D0;
  background: linear-gradient(135deg, rgba(171,201,208,.22), rgba(83,149,163,.10));
  border-color: rgba(171,201,208,.30);
}
.partner-badge--silver {
  color: rgba(171,201,208,.95);
  background: linear-gradient(135deg, rgba(171,201,208,.16), rgba(171,201,208,.06));
  border-color: rgba(171,201,208,.22);
}
.partner-badge--authorized {
  color: #ABC9D0;
  background: linear-gradient(135deg, rgba(83,149,163,.18), rgba(0,100,121,.10));
  border-color: rgba(83,149,163,.28);
}
.partner-badge--partner {
  color: rgba(171,201,208,.75);
  background: rgba(171,201,208,.07);
  border-color: rgba(171,201,208,.14);
}

/* Product hero overlay */
.product-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,53,80,.88) 0%, rgba(0,53,80,.64) 42%, rgba(0,53,80,.28) 100%);
  z-index: 1;
  pointer-events: none;
}

/* --- Dropdown / submenu del nav --- */
#mainmenu ul,
.dark-scheme #mainmenu ul {
  background: #031B27 !important;
  border: 1px solid rgba(171, 201, 208, 0.14) !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35) !important;
  border-radius: 8px;
  overflow: hidden;
}

#mainmenu ul li a,
#mainmenu li li a {
  color: rgba(171, 201, 208, 0.82) !important;
  transition: background 180ms ease, color 180ms ease, padding-left 180ms ease;
  position: relative;
}

#mainmenu ul li a:hover,
#mainmenu li li a:hover,
#mainmenu ul li:hover > a {
  background: rgba(83, 149, 163, 0.18) !important;
  color: #ABC9D0 !important;
  padding-left: 18px;
}

#mainmenu ul li a:hover::before,
#mainmenu li li a:hover::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 999px;
  background: #5395A3;
}

#mainmenu ul li.active > a,
#mainmenu li li a[aria-current="page"] {
  background: linear-gradient(90deg, rgba(83,149,163,0.30), rgba(0,100,121,0.24)) !important;
  color: #ABC9D0 !important;
}

/* ═══════════════════════════════════════════════════════════
   Services page
   ═══════════════════════════════════════════════════════════ */

/* Hero enhancements */
.svc-hero-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: 999px;
  color: #ABC9D0;
  background: linear-gradient(135deg, rgba(171,201,208,.12), rgba(83,149,163,.10));
  border: 1px solid rgba(171,201,208,.28);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.svc-hero-sub {
  color: rgba(171,201,208,.82);
  font-size: 1.05rem;
  line-height: 1.65;
  margin-bottom: 1.25rem;
  max-width: 560px;
}
.svc-hero-stat {
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.15;
  letter-spacing: -.03em;
}
.svc-hero-stat span {
  font-size: .95rem;
  font-weight: 400;
  color: rgba(171,201,208,.70);
  letter-spacing: 0;
}

/* Filter bar */
.svc-filter-section {
  padding: 28px 0 20px;
  border-bottom: 1px solid rgba(171,201,208,.08);
}
.svc-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.svc-filter-btn {
  padding: 8px 18px;
  border-radius: 999px;
  border: 1px solid rgba(171,201,208,.20);
  background: rgba(171,201,208,.05);
  color: rgba(171,201,208,.68);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
  font-family: inherit;
}
.svc-filter-btn:hover {
  background: rgba(83,149,163,.15);
  border-color: rgba(83,149,163,.38);
  color: #fff;
}
.svc-filter-btn.active {
  background: rgba(83,149,163,.22);
  border-color: rgba(83,149,163,.50);
  color: #fff;
}

/* Service card */
.svc-card {
  position: relative;
  height: 100%;
  padding: 28px;
  border-radius: 24px;
  background:
    radial-gradient(circle at top left, rgba(171,201,208,.08), transparent 34%),
    linear-gradient(145deg, rgba(13,80,101,.76) 0%, rgba(3,27,39,.94) 100%);
  border: 1px solid rgba(171,201,208,.14);
  box-shadow: 0 18px 45px rgba(2,19,28,.42), inset 0 1px 0 rgba(171,201,208,.05);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
  display: flex;
  flex-direction: column;
  scroll-margin-top: 100px;
}
.svc-card:hover {
  transform: translateY(-4px);
  border-color: rgba(83,149,163,.34);
  box-shadow: 0 24px 60px rgba(2,19,28,.54), 0 0 36px rgba(83,149,163,.10);
}

/* scroll-margin on anchor wrapper */
.svc-card-wrap {
  scroll-margin-top: 100px;
}

/* Icon + badge row */
.svc-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}
.svc-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: rgba(83,149,163,.18);
  color: #ABC9D0;
  border: 1px solid rgba(171,201,208,.16);
  flex-shrink: 0;
}
.svc-badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 11px;
  border-radius: 999px;
  color: #ABC9D0;
  background: linear-gradient(135deg, rgba(171,201,208,.10), rgba(83,149,163,.08));
  border: 1px solid rgba(171,201,208,.22);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Card typography */
.svc-card-title {
  color: #fff;
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.2;
  margin-bottom: .6rem;
}
.svc-card-desc {
  color: rgba(171,201,208,.80);
  font-size: .94rem;
  line-height: 1.65;
  margin-bottom: 1rem;
}

/* Bullet list */
.svc-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.1rem;
  display: grid;
  gap: 8px;
}
.svc-list li {
  position: relative;
  padding-left: 20px;
  color: rgba(171,201,208,.78);
  font-size: .90rem;
  line-height: 1.5;
}
.svc-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .58em;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #5395A3;
  box-shadow: 0 0 12px rgba(83,149,163,.50);
}

/* Divider */
.svc-divider {
  border: none;
  border-top: 1px solid rgba(171,201,208,.10);
  margin: 1.1rem 0;
}

/* Tech chips */
.svc-tech-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 1.4rem;
}
.svc-tech-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 6px 12px;
  border-radius: 10px;
  background: rgba(171,201,208,.07);
  border: 1px solid rgba(171,201,208,.12);
}
.svc-tech-chip img {
  height: 22px;
  width: auto;
  max-width: 90px;
  object-fit: contain;
  opacity: .88;
}
a.svc-tech-chip { text-decoration: none; cursor: pointer; transition: border-color .2s ease, transform .2s ease, background .2s ease; }
a.svc-tech-chip:hover { border-color: rgba(83,149,163,.55); background: rgba(171,201,208,.12); transform: translateY(-2px); }
a.svc-tech-chip:hover img { opacity: 1; }
/* logos mono blancos en chip: leve sombra para contraste sobre fondo claro */
.svc-tech-chip img.itcs-logo-mono { opacity: 1; }

/* Card actions */
.svc-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: auto;
}
.svc-btn-outline {
  display: inline-flex;
  align-items: center;
  padding: 9px 20px;
  border-radius: 999px;
  color: #ABC9D0;
  background: rgba(171,201,208,.07);
  border: 1px solid rgba(171,201,208,.18);
  font-size: .82rem;
  font-weight: 700;
  text-decoration: none;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
  letter-spacing: .02em;
}
.svc-btn-outline:hover {
  color: #fff;
  background: rgba(171,201,208,.14);
  border-color: rgba(171,201,208,.32);
}

/* Responsive */
@media (max-width: 768px) {
  .svc-card { padding: 22px; border-radius: 20px; }
  .svc-card-title { font-size: 1.1rem; }
  .svc-card-actions { flex-direction: column; align-items: stretch; }
  .svc-card-actions a { width: 100%; justify-content: center; text-align: center; }
  .svc-hero-sub { font-size: .95rem; }
  .svc-filter-btn { font-size: 11px; padding: 7px 14px; }
}

/* Chip de tecnología con texto (marcas sin logo) */
.svc-tech-text { font-weight: 700; font-size: .80rem; color: var(--itcs-ice); letter-spacing: .01em; padding: 0 4px; }

/* Logos normalizados a blanco (assets oscuros/color en fondo oscuro) */
.itcs-logo-mono { filter: brightness(0) invert(1); opacity: .85; }

/* Logo en texto para marcas sin asset (listado Tecnologías) */
.itcs-partner-logo-text { display: inline-block; font-weight: 800; font-size: 1.5rem; letter-spacing: -.01em; color: #fff; }

/* ===== Listado Tecnologías — tarjetas compactas ===== */
.svc-filter-bar { display: flex; flex-wrap: wrap; gap: 8px; }
/* Transición suave al filtrar */
#tec-grid > [data-category] { transition: opacity .38s ease, transform .38s cubic-bezier(.22,.68,0,1.2); will-change: opacity, transform; }
#tec-grid > [data-category].tec-hide { opacity: 0; transform: translateY(10px) scale(.97); pointer-events: none; }

/* Acento cromático por categoría (tonos fríos cohesivos) */
#tec-grid > [data-category="ciberseguridad"]   { --acc: #5395A3; }
#tec-grid > [data-category="infraestructura"]  { --acc: #3E8EA8; }
#tec-grid > [data-category="backup-storage"]   { --acc: #3FB39A; }
#tec-grid > [data-category="cloud"]            { --acc: #4F9FD1; }
#tec-grid > [data-category="gestion"]          { --acc: #6C8FC7; }
#tec-grid > [data-category="seguridad-fisica"] { --acc: #5E83B5; }
#tec-grid > [data-category="energia"]          { --acc: #46B6C4; }
#tec-grid > [data-category="euc"]              { --acc: #9BC2CE; }

/* Fondo con profundidad detrás del grid */
.tec-section { position: relative; isolation: isolate; }
.tec-section::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(820px 460px at 14% 2%, rgba(83,149,163,.12), transparent 60%),
    radial-gradient(760px 480px at 88% 26%, rgba(0,100,121,.13), transparent 62%),
    radial-gradient(700px 500px at 50% 100%, rgba(171,201,208,.06), transparent 60%);
}
.tec-section::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(171,201,208,.05) 1px, transparent 1px);
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 78%);
          mask-image: radial-gradient(ellipse at center, #000 30%, transparent 78%);
}
.tec-card {
  display: flex; flex-direction: column; height: 100%;
  padding: 24px 22px 20px; border-radius: 18px;
  background: linear-gradient(165deg, rgba(13,80,101,.42) 0%, rgba(3,27,39,.82) 100%);
  border: 1px solid rgba(171,201,208,.12);
  text-decoration: none; color: inherit; position: relative; overflow: hidden;
  transition: transform .25s cubic-bezier(.22,.68,0,1.2), border-color .25s ease, box-shadow .25s ease;
}
.tec-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; background: linear-gradient(90deg, transparent, rgba(171,201,208,.4), transparent); opacity: 0; transition: opacity .25s; }
.tec-card:hover { transform: translateY(-5px); border-color: rgba(83,149,163,.42); box-shadow: 0 22px 50px rgba(2,19,28,.5), 0 0 30px rgba(83,149,163,.1); }
.tec-card:hover::before { opacity: 1; }
.tec-cat { position: absolute; top: 15px; right: 16px; font-size: .60rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--text-soft, rgba(171,201,208,.6)); }
.tec-logo { height: 42px; display: flex; align-items: center; margin-bottom: 16px; }
.tec-logo img { max-height: 34px; max-width: 140px; width: auto; object-fit: contain; }
.tec-logo .itcs-partner-logo-text { font-size: 1.3rem; }
.tec-card h4 { color: #fff !important; margin: 0 0 4px; font-size: 1.18rem; letter-spacing: -.01em; }
.tec-card > p { color: var(--text-soft, rgba(171,201,208,.7)); font-size: .85rem; margin: 0 0 16px; line-height: 1.45; }
.tec-link { margin-top: auto; color: var(--itcs-ice); font-weight: 700; font-size: .82rem; display: inline-flex; align-items: center; gap: 7px; }
.tec-link i { transition: transform .25s ease; }
.tec-card:hover .tec-link i { transform: translateX(4px); }

/* Cards con más vida (acento por categoría) — debe ir tras el bloque base */
.tec-card { border-left: 3px solid var(--acc, rgba(83,149,163,.5)); }
.tec-card::before { background: linear-gradient(90deg, transparent, var(--acc, rgba(171,201,208,.4)), transparent); }
.tec-cat { color: var(--acc, var(--text-soft)) !important; opacity: .92; }
.tec-card:hover {
  transform: translateY(-6px);
  border-color: rgba(171,201,208,.18);
  border-left-color: var(--acc);
  box-shadow: 0 24px 54px rgba(2,19,28,.55), 0 0 40px -6px var(--acc);
}
.tec-logo { height: 48px; margin-bottom: 18px; }
.tec-logo img { max-height: 40px; max-width: 150px; }
.tec-link { color: var(--acc, var(--itcs-ice)); }

/* Logo destacado en intro de página de marca */
.itcs-brand-logo-lead img { max-width: 220px; height: 46px; object-fit: contain; }

/* ===== Páginas de marca — formatos alternativos ===== */
/* A: lista compacta de capacidades — grid alineado (filas parejas) */
.cap-list { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 44px; }
@media (max-width: 767px) { .cap-list { grid-template-columns: 1fr; } }
.cap-item { padding: 16px 0; border-bottom: 1px solid rgba(171,201,208,.10); display: flex; gap: 14px; align-items: flex-start; }
.cap-item i { color: var(--itcs-teal); font-size: 22px; margin-top: 2px; flex-shrink: 0; }
.cap-item h5 { color: #fff !important; margin: 0 0 3px; font-size: 1.04rem; }
.cap-item p { margin: 0; color: var(--text-soft); font-size: .88rem; line-height: 1.5; }

/* B: ficha técnica con sidebar fijo */
.brand-sticky { position: sticky; top: 100px; }
.brand-aside { padding: 30px 26px; border-radius: 22px; background: linear-gradient(160deg, rgba(13,80,101,.5), rgba(3,27,39,.85)); border: 1px solid rgba(171,201,208,.12); }
.brand-aside .itcs-partner-logo-text { font-size: 1.7rem; }
.brand-block + .brand-block { margin-top: 38px; }
.brand-block > h3 { font-size: 1.4rem; margin-bottom: 18px; }

/* C: pestañas */
.brand-tabs { display: flex; gap: 6px; flex-wrap: wrap; border-bottom: 1px solid rgba(171,201,208,.14); margin-bottom: 30px; }
.brand-tab { padding: 12px 22px; cursor: pointer; color: var(--text-soft); font-weight: 700; border: none; background: none; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; font-size: .98rem; }
.brand-tab:hover { color: var(--itcs-ice); }
.brand-tab.active { color: var(--itcs-ice); border-bottom-color: var(--itcs-teal); }
.brand-panel { display: none; }
.brand-panel.active { display: block; animation: itcs-fade .35s ease; }
@keyframes itcs-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Lista de servicios en 2 columnas (card ancha) */
.svc-list-2col { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 575.98px) { .svc-list-2col { grid-template-columns: 1fr; } }

/* Plan destacado en la grilla de SLA */
.itcs-plan-featured {
  border-color: rgba(83,149,163,.55) !important;
  box-shadow: 0 24px 64px rgba(2,19,28,.55), 0 0 48px rgba(83,149,163,.22) !important;
  transform: translateY(-6px);
}
.itcs-plan-featured .svc-badge {
  color: var(--itcs-navy);
  background: linear-gradient(135deg, var(--itcs-ice), var(--itcs-teal));
  border-color: transparent;
}

/* ============================================================
   Industrias — vocabulario propio (on-brand)
   ============================================================ */
.ind-tile {
  position: relative;
  height: 100%;
  padding: 30px 28px;
  border-radius: 22px;
  background: linear-gradient(160deg, rgba(13,80,101,.55) 0%, rgba(3,27,39,.86) 100%);
  border: 1px solid rgba(171,201,208,.12);
  border-left: 3px solid rgba(83,149,163,.55);
  box-shadow: 0 16px 40px rgba(2,19,28,.38);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}
.ind-tile:hover {
  transform: translateY(-4px);
  border-left-color: var(--itcs-ice);
  box-shadow: 0 24px 58px rgba(2,19,28,.52), 0 0 34px rgba(83,149,163,.12);
}
.ind-ico {
  width: 56px; height: 56px;
  border-radius: 15px;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  color: var(--itcs-ice);
  background: rgba(83,149,163,.16);
  border: 1px solid rgba(171,201,208,.18);
  margin-bottom: 16px;
}
.ind-tile h4 { color: #fff !important; margin-bottom: .5rem; }
.ind-desc { color: rgba(171,201,208,.80); font-size: .92rem; line-height: 1.6; margin-bottom: 1rem; }
.ind-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 1rem; }
.ind-chip {
  font-size: .74rem; font-weight: 700; line-height: 1.2;
  color: rgba(171,201,208,.92);
  background: rgba(171,201,208,.07);
  border: 1px solid rgba(171,201,208,.16);
  border-radius: 999px;
  padding: 5px 11px;
}
.ind-tech { font-size: .80rem; color: var(--text-soft, rgba(171,201,208,.68)); }
.ind-tech strong { color: var(--itcs-ice); font-weight: 700; }

/* Proceso numerado (Nuestro enfoque) */
.ind-step {
  position: relative;
  height: 100%;
  padding: 26px 24px;
  border-radius: 18px;
  background: rgba(171,201,208,.035);
  border: 1px solid rgba(171,201,208,.10);
  transition: border-color 200ms ease, background 200ms ease;
}
.ind-step:hover { border-color: rgba(83,149,163,.34); background: rgba(171,201,208,.06); }
.ind-step-num {
  display: block;
  font-size: 2.2rem; font-weight: 800; line-height: 1;
  color: rgba(83,149,163,.55);
  margin-bottom: 12px;
  letter-spacing: -.02em;
}
.ind-step h5 { color: #fff !important; margin-bottom: .4rem; }
.ind-step p { color: rgba(171,201,208,.78); font-size: .9rem; margin-bottom: 0; }

/* ============================================================
   Marquee de logos de tecnologías
   ============================================================ */
.itcs-logo-marquee {
  border-top: 1px solid rgba(171,201,208,.08);
  border-bottom: 1px solid rgba(171,201,208,.08);
  position: relative;
}
/* Degradados laterales para que los logos entren/salgan suavemente */
.itcs-logo-marquee::before,
.itcs-logo-marquee::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 90px;
  z-index: 2;
  pointer-events: none;
}
.itcs-logo-marquee::before { left: 0; background: linear-gradient(90deg, var(--ink-925, #052333), transparent); }
.itcs-logo-marquee::after { right: 0; background: linear-gradient(270deg, var(--ink-925, #052333), transparent); }

.itcs-marquee-track {
  display: flex;
  align-items: center;
  width: max-content;
  will-change: transform;
  animation: itcs-marquee-scroll 30s linear infinite;
}
.itcs-logo-marquee:hover .itcs-marquee-track { animation-play-state: paused; }
@keyframes itcs-marquee-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .itcs-marquee-track { animation: none; flex-wrap: wrap; justify-content: center; }
}
.itcs-logo-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  padding: 0 46px;
  flex-shrink: 0;
}
.itcs-logo-item img {
  max-height: 54px;
  max-width: 190px;
  width: auto;
  object-fit: contain;
  opacity: .82;
  filter: grayscale(100%) brightness(0) invert(1);
  transition: opacity 200ms ease, filter 200ms ease;
}
.itcs-logo-item:hover img { opacity: 1; filter: none; }
.itcs-logo-item--text {
  color: #fff;
  font-weight: 800;
  font-size: 1.85rem;
  letter-spacing: -.01em;
  opacity: .82;
}
.itcs-logo-item--text:hover { opacity: 1; }

/* Contenido completo de páginas de marca */
.itcs-marca-content h3 { font-size: 1.5rem; }
.itcs-marca-content h4 { font-size: 1.15rem; font-weight: 800; }
.itcs-marca-content p { color: var(--text-main); line-height: 1.7; margin-bottom: .9rem; }
.itcs-marca-content .ul-check { margin-bottom: 1.2rem; }
.itcs-marca-content .ul-check li { margin-bottom: .35rem; }