/* ==========================================================================
   GSS · Componente "GlobalSuite AI Hub"  ·  marker: .gss-aihub
   Página: La IA en el núcleo de la plataforma GRC.
   Autocontenido: define sus propias variables bajo el marker para no depender
   de tokens globales. Todo selector va namespaced bajo .gss-aihub.
   Performance: contain, aspect-ratio, prefers-reduced-motion (skill perf).
   ========================================================================== */

.gss-aihub {
  /* ---- Marca GSS ---- */
  --ah-neon: #5078ff;
  --ah-neon-600: #4166e6;
  --ah-neon-50: #f4f6ff;
  --ah-neon-100: #eaeefc;
  --ah-aqua: #00ffd7;
  --ah-sky: #50dcff;
  --ah-ink: #041438;          /* dark blue gray */
  --ah-gray: #787882;
  --ah-canary: #fff005;
  --ah-danger: #f25a5a;
  --ah-ink-50: #f7f8fb;
  --ah-ink-200: #dfe3ea;
  --ah-ink-300: #c4cad4;
  --ah-ink-700: #3a4758;

  /* ---- Auxiliares ---- */
  --ah-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ah-pill: 999px;
  --ah-dur-fast: 140ms;
  --ah-dur-base: 220ms;
  --ah-dur-slow: 360ms;
  --ah-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ah-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ah-ease-emph: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ah-shadow-lg: 0 16px 32px rgba(4,20,56,.10), 0 4px 8px rgba(4,20,56,.05);

  /* multiplicador de glow (fijo en producción) */
  --glow: 1;

  /* layout */
  --ah-maxw: 1200px;
  --ah-maxw-wide: 1320px;
  --ah-pad-y: clamp(72px, 9vw, 128px);
  --ah-gutter: clamp(20px, 5vw, 48px);

  font-family: var(--ah-font);
  color: var(--ah-ink);
  -webkit-font-smoothing: antialiased;
  contain: layout paint;
}
.gss-aihub *, .gss-aihub *::before, .gss-aihub *::after { box-sizing: border-box; }
.gss-aihub img { max-width: 100%; display: block; }

/* full-bleed: rompe el ancho de la columna de WPBakery */
.gss-aihub .ah-sec {
  position: relative;
  padding: var(--ah-pad-y) var(--ah-gutter);
  overflow: hidden;
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}
.gss-aihub .ah-wrap { width: 100%; max-width: var(--ah-maxw); margin-inline: auto; position: relative; z-index: 2; }
.gss-aihub .ah-wrap--wide { max-width: var(--ah-maxw-wide); }

/* Scroll suave a las secciones ancladas (botón "Solicita una demo" → formulario).
   scroll-margin-top compensa la cabecera fija del sitio para que el destino no
   quede oculto debajo. Ajusta el valor si tu header tiene otra altura. */
.gss-aihub .ah-sec[id] { scroll-margin-top: 96px; }
html { scroll-behavior: smooth; }

/* temas de sección */
.gss-aihub .ah-light {
  background: #fff;
  --ink: var(--ah-ink); --ink-soft: var(--ah-gray);
  --card-bg: #fff; --card-bd: var(--ah-ink-200);
  --chip-bg: var(--ah-neon-50); --hair: var(--ah-ink-200);
}
.gss-aihub .ah-dark {
  --ink: #fff; --ink-soft: rgba(255,255,255,.66);
  --card-bg: rgba(255,255,255,.04); --card-bd: rgba(255,255,255,.10);
  --chip-bg: rgba(255,255,255,.06); --hair: rgba(255,255,255,.12);
  color: #fff;
}
.gss-aihub .ah-dark h1, .gss-aihub .ah-dark h2,
.gss-aihub .ah-dark h3, .gss-aihub .ah-dark h4 { color: #fff; }

.gss-aihub .ah-deep {
  background:
    radial-gradient(120% 90% at 78% 8%, rgba(80,220,255,.20), transparent 55%),
    radial-gradient(90% 80% at 18% 92%, rgba(0,255,215,.12), transparent 55%),
    linear-gradient(180deg, #041438 0%, #061a44 55%, #041438 100%);
}
.gss-aihub .ah-neon {
  background:
    radial-gradient(70% 70% at 84% 4%, rgba(95,225,255,calc(.50*var(--glow))), transparent 58%),
    radial-gradient(66% 62% at 4% 108%, rgba(0,255,215,calc(.38*var(--glow))), transparent 60%),
    linear-gradient(158deg, #5a83ff 0%, #4a70ff 30%, #2a4fb8 58%, #0f2560 84%, #041438 100%);
}
.gss-aihub .ah-neon .ah-eyebrow { color: rgba(255,255,255,.92); }

/* Cierre — degradado premium neon blue + quantum (aquamarine/sky) */
.gss-aihub .ah-close {
  background:
    radial-gradient(64% 70% at 88% 0%, rgba(0,255,215,calc(.34*var(--glow))), transparent 56%),
    radial-gradient(60% 64% at 6% 100%, rgba(80,220,255,calc(.30*var(--glow))), transparent 58%),
    radial-gradient(50% 60% at 50% 120%, rgba(0,255,215,calc(.16*var(--glow))), transparent 60%),
    linear-gradient(152deg, #5a83ff 0%, #4a70ff 26%, #2f55c4 52%, #123072 78%, #041438 100%);
}
.gss-aihub .ah-close::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(140% 100% at 100% 0%, rgba(0,255,215,.12), transparent 46%);
  mix-blend-mode: screen;
}

/* ---------- tipografía ---------- */
.gss-aihub .ah-eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-size: 12px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .2em; color: var(--ah-neon); margin: 0 0 20px;
}
.gss-aihub .ah-dark .ah-eyebrow { color: var(--ah-sky); }
.gss-aihub .h-sec {
  font-size: clamp(32px, 4.4vw, 56px); font-weight: 700; line-height: 1.04;
  letter-spacing: -0.028em; margin: 0; color: var(--ink); text-wrap: balance;
}
.gss-aihub .h-sub {
  font-size: clamp(16px, 1.5vw, 19px); line-height: 1.55;
  color: var(--ink-soft); margin: 18px 0 0; max-width: 60ch; text-wrap: pretty;
}
.gss-aihub .ah-head { max-width: 760px; }
.gss-aihub .aqua { color: var(--ah-aqua); }
.gss-aihub .aqua-grad {
  background: linear-gradient(90deg, var(--ah-sky), var(--ah-aqua));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- botones ---------- */
.gss-aihub .ah-btn {
  display: inline-flex; align-items: center; gap: 10px; font-family: inherit;
  font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: .05em;
  padding: 16px 28px; border-radius: var(--ah-pill); border: 1.5px solid transparent;
  cursor: pointer; text-decoration: none;
  transition: transform var(--ah-dur-fast) var(--ah-ease), box-shadow var(--ah-dur-base) var(--ah-ease), background var(--ah-dur-fast) var(--ah-ease);
}
.gss-aihub .ah-btn svg { width: 18px; height: 18px; }
.gss-aihub .ah-btn--primary { background: var(--ah-aqua); color: var(--ah-ink); }
.gss-aihub .ah-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 10px 32px rgba(0,255,215,.35); color: var(--ah-ink); }
.gss-aihub .ah-btn--blue { background: var(--ah-neon); color: #fff; }
.gss-aihub .ah-btn--blue:hover { transform: translateY(-2px); background: var(--ah-neon-600); color: #fff; }
.gss-aihub .ah-btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.32); }
.gss-aihub .ah-btn--ghost:hover { border-color: #fff; transform: translateY(-2px); color: #fff; }

/* backdrop grid */
.gss-aihub .hero-bg { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.gss-aihub .grid-lines {
  position: absolute; inset: 0; opacity: calc(.10 * var(--glow));
  background-image:
    linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 60% 40%, #000 10%, transparent 70%);
  mask-image: radial-gradient(ellipse 70% 70% at 60% 40%, #000 10%, transparent 70%);
}

/* ==========================================================================
   PILARES
   ========================================================================== */
.gss-aihub .pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 56px; }
.gss-aihub .pillar { position: relative; padding: 4px 0 4px 26px; }
.gss-aihub .pillar::before {
  content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 2px;
  background: linear-gradient(180deg, var(--ah-neon), transparent); border-radius: 2px;
}
.gss-aihub .pillar .ic { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: var(--chip-bg); margin-bottom: 20px; }
.gss-aihub .pillar .ic svg { width: 24px; height: 24px; color: var(--ah-neon); stroke: var(--ah-neon); }
.gss-aihub .pillar h3 { font-size: 20px; font-weight: 700; letter-spacing: -.015em; margin: 0 0 8px; color: var(--ink); }
.gss-aihub .pillar p { font-size: 15px; line-height: 1.55; color: var(--ink-soft); margin: 0; }

/* banda de cifras */
.gss-aihub .stat-band {
  margin-top: 56px; border-radius: 20px; padding: 8px 12px;
  display: grid; grid-template-columns: repeat(3, 1fr);
  background: var(--ah-neon-50); border: 1px solid var(--ah-ink-200);
}
.gss-aihub .stat-card { padding: 30px 34px; position: relative; }
.gss-aihub .stat-card + .stat-card::before {
  content: ""; position: absolute; left: 0; top: 26px; bottom: 26px; width: 1px; background: var(--ah-ink-200);
}
.gss-aihub .stat-card .num { font-size: 46px; font-weight: 800; line-height: 1; letter-spacing: -.025em; margin: 0 0 12px; color: var(--ah-neon); }
.gss-aihub .stat-card p { font-size: 15px; line-height: 1.5; color: var(--ah-gray); margin: 0; max-width: 22ch; }

/* ==========================================================================
   CAPACIDADES (cards)
   ========================================================================== */
.gss-aihub .cap-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 56px; }
.gss-aihub .cap {
  position: relative; padding: 28px 24px 26px; border-radius: 18px;
  background: var(--card-bg); border: 1px solid var(--card-bd); overflow: hidden;
  transition: transform var(--ah-dur-base) var(--ah-ease), border-color var(--ah-dur-base) var(--ah-ease), box-shadow var(--ah-dur-base) var(--ah-ease);
}
.gss-aihub .cap::before {
  content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity var(--ah-dur-base);
  background: radial-gradient(120% 90% at 50% -10%, rgba(15,232,189,.14), transparent 60%);
}
.gss-aihub .cap:hover { transform: translateY(-4px); border-color: rgba(95,230,222,.5); box-shadow: 0 18px 44px rgba(0,0,0,.34); }
.gss-aihub .cap:hover::before { opacity: 1; }
.gss-aihub .cap .ic {
  width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center;
  background: rgba(15,232,189,.12); border: 1px solid rgba(95,230,222,.25); margin-bottom: 18px; position: relative;
}
.gss-aihub .cap .ic svg { width: 22px; height: 22px; color: var(--ah-aqua); stroke: var(--ah-aqua); }
.gss-aihub .cap h3 { font-size: 17px; font-weight: 700; letter-spacing: -.01em; margin: 0 0 8px; color: var(--ink); position: relative; }
.gss-aihub .cap p { font-size: 14px; line-height: 1.5; color: var(--ink-soft); margin: 0; position: relative; }

/* ==========================================================================
   IA EN ACCIÓN (tabs + mockups como imagen)
   ========================================================================== */
.gss-aihub .ia-grid { display: grid; grid-template-columns: 0.82fr 1.18fr; gap: clamp(32px, 5vw, 72px); align-items: start; margin-top: 52px; }
.gss-aihub .ia-tabs { display: flex; flex-direction: column; }
.gss-aihub .ia-tabs > p, .gss-aihub .ia-tabs > br { display: none !important; }
.gss-aihub .ia-tab {
  border: 0; background: none; text-align: left; cursor: pointer; font-family: inherit; color: var(--ink);
  padding: 22px 0; border-top: 1px solid var(--hair); display: block; width: 100%;
}
.gss-aihub .ia-tab:last-child { border-bottom: 1px solid var(--hair); }
.gss-aihub .ia-tab-head { display: flex; align-items: center; gap: 14px; }
.gss-aihub .ia-tab .num {
  font-size: 12px; font-weight: 700; letter-spacing: .04em; width: 28px; height: 28px; flex: none;
  border-radius: 8px; display: grid; place-items: center; background: var(--chip-bg); color: var(--ink-soft);
  transition: background var(--ah-dur-base), color var(--ah-dur-base);
}
.gss-aihub .ia-tab h3 { font-size: clamp(17px, 1.5vw, 21px); font-weight: 700; letter-spacing: -.015em; margin: 0; flex: 1; color: var(--ink); line-height: 1.25; transition: color var(--ah-dur-base); }
.gss-aihub .ia-tab .chev { width: 20px; height: 20px; color: var(--ink-soft); flex: none; transition: transform var(--ah-dur-base); }
/* Acordeón: colapsado por defecto sin depender de grid 0fr ni del JS.
   Blindado con !important contra estilos heredados de Impreza/WPBakery
   (márgenes de <p>, line-height global, wrappers automáticos). */
.gss-aihub .ia-tab-body {
  display: block !important;
  overflow: hidden !important;
  max-height: 0 !important;
  opacity: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: max-height var(--ah-dur-slow) var(--ah-ease), opacity var(--ah-dur-base) var(--ah-ease);
}
.gss-aihub .ia-tab-body > span { display: block !important; overflow: hidden; margin: 0 !important; padding: 0 !important; }
.gss-aihub .ia-tab p { margin: 0 !important; padding: 0 0 0 42px; font-size: 15px; line-height: 1.6; color: var(--ink-soft); max-width: 46ch; }
.gss-aihub .ia-tab[aria-expanded="true"] .num { background: var(--ah-neon); color: #fff; }
.gss-aihub .ia-tab[aria-expanded="true"] .chev { transform: rotate(180deg); }
.gss-aihub .ia-tab[aria-expanded="true"] .ia-tab-body { max-height: 480px !important; opacity: 1 !important; padding-top: 14px !important; }
.gss-aihub .ia-tab:hover h3 { color: var(--ah-neon); }

.gss-aihub .ia-stage { position: relative; min-width: 0; }
.gss-aihub .ia-frame {
  position: relative; border-radius: 16px; overflow: hidden; width: 100%;
  box-shadow: var(--ah-shadow-lg), 0 0 0 1px var(--ah-ink-200);
  font-size: 0; /* elimina huecos entre <picture> inline */
}
.gss-aihub .ia-frame picture { display: contents; }
.gss-aihub .ia-shot { display: none; width: 100% !important; height: auto !important; max-width: 100%; }
.gss-aihub .ia-shot.active { display: block; }

/* ==========================================================================
   PLATAFORMA
   ========================================================================== */
.gss-aihub .plat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 80px); align-items: center; }
.gss-aihub .plat-figure { position: relative; border-radius: 20px; overflow: hidden; border: 1px solid var(--card-bd); box-shadow: 0 30px 80px rgba(0,0,0,.12); }
.gss-aihub .plat-figure img { width: 100%; height: auto; object-fit: cover; aspect-ratio: 1400 / 788; }
.gss-aihub .plat-figure .glow-edge { position: absolute; inset: 0; box-shadow: inset 0 0 80px rgba(15,232,189,calc(.12*var(--glow))); pointer-events: none; }
.gss-aihub .plat-points { display: flex; flex-direction: column; gap: 22px; margin-top: 36px; }
.gss-aihub .plat-point { display: flex; gap: 16px; align-items: flex-start; }
.gss-aihub .plat-point .ic { width: 44px; height: 44px; flex: none; border-radius: 12px; display: grid; place-items: center; background: var(--chip-bg); }
.gss-aihub .plat-point .ic svg { width: 21px; height: 21px; color: var(--ah-neon); stroke: var(--ah-neon); }
.gss-aihub .plat-point h3 { font-size: 18px; font-weight: 700; margin: 0 0 5px; color: var(--ink); letter-spacing: -.01em; }
.gss-aihub .plat-point p { font-size: 14.5px; line-height: 1.55; color: var(--ink-soft); margin: 0; }
.gss-aihub .plat-point strong { color: var(--ink); font-weight: 700; }
.gss-aihub .connectors-strip { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.gss-aihub .conn-chip { font-size: 12.5px; font-weight: 600; padding: 8px 14px; border-radius: var(--ah-pill); background: var(--chip-bg); border: 1px solid var(--card-bd); color: var(--ink); }

/* ==========================================================================
   CTA FINAL + FORMULARIO
   ========================================================================== */
.gss-aihub .cta-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(40px, 6vw, 80px); align-items: center; }
.gss-aihub .cta-copy h2 { font-size: clamp(34px, 4.6vw, 60px); font-weight: 800; line-height: 1.02; letter-spacing: -0.03em; color: #fff; margin: 0; text-wrap: balance; }
.gss-aihub .cta-copy .h-sub { color: rgba(255,255,255,.78); }
.gss-aihub .cta-bullets { display: flex; flex-direction: column; gap: 12px; margin-top: 28px; }
.gss-aihub .cta-bullet { display: flex; gap: 11px; align-items: center; font-size: 15px; color: rgba(255,255,255,.86); }
.gss-aihub .cta-bullet svg { width: 20px; height: 20px; color: var(--ah-aqua); stroke: var(--ah-aqua); flex: none; }

/* Prueba social: frase de confianza + badges G2 */
.gss-aihub .cta-trust { margin-top: 38px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,.14); }
.gss-aihub .cta-trust-quote { font-size: 16px; line-height: 1.55; color: rgba(255,255,255,.82); margin: 0 0 22px; max-width: 46ch; }
.gss-aihub .cta-trust-quote strong { color: #fff; font-weight: 700; }
.gss-aihub .cta-trust-badges {
  display: block; width: 100%; max-width: 520px; height: auto;
  filter: drop-shadow(0 8px 24px rgba(4,20,56,.30));
}

/* Contenedor del formulario (Gravity Forms se inserta aquí) */
.gss-aihub .form-card { background: #fff; border-radius: 22px; padding: clamp(26px, 3vw, 38px); box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.gss-aihub .form-card .fc-eyebrow { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .16em; color: var(--ah-neon); margin: 0 0 6px; }
.gss-aihub .form-card h3 { font-size: 23px; font-weight: 700; letter-spacing: -.02em; color: var(--ah-ink); margin: 0 0 22px; }
/* fallback estático (si aún no se incrusta Gravity Forms) */
.gss-aihub .gss-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.gss-aihub .gss-form .full { grid-column: 1 / -1; }

/* ==========================================================================
   GRAVITY FORMS · tema Orbital — formulario 137 dentro de .form-card
   Orbital se configura por custom properties --gf-*. Sobreescribimos esas
   variables en el wrapper para alinear el form con la marca GSS, sin pelear
   selector a selector contra el CSS del tema. Namespaced bajo .form-card
   para no afectar a otros formularios del sitio.
   ========================================================================== */
.gss-aihub .form-card .gform-theme--orbital,
.gss-aihub .form-card .gform_wrapper.gravity-theme {
  /* tipografía */
  --gf-label-font-size: 12.5px;
  --gf-label-font-weight: 600;
  --gf-ctrl-label-color-primary: var(--ah-ink-700);
  --gf-ctrl-label-color-secondary: var(--ah-ink-700);

  /* inputs */
  --gf-ctrl-bg-color: var(--ah-ink-50);
  --gf-ctrl-color: var(--ah-ink);
  --gf-ctrl-border-color: var(--ah-ink-200);
  --gf-ctrl-border-color-hover: var(--ah-ink-300);
  --gf-ctrl-border-width: 1px;
  --gf-ctrl-radius: 10px;
  --gf-ctrl-size-padding-y: 13px;
  --gf-ctrl-size-padding-x: 14px;
  --gf-ctrl-font-size: 15px;

  /* estado foco */
  --gf-ctrl-border-color-focus: var(--ah-neon);
  --gf-ctrl-bg-color-focus: #fff;
  --gf-local-bs-focus: 0 0 0 3px rgba(80,120,255,.16);

  /* error */
  --gf-ctrl-border-color-error: var(--ah-danger);
  --gf-validation-error-color: var(--ah-danger);

  /* botón */
  --gf-ctrl-btn-bg-color-primary: var(--ah-neon);
  --gf-ctrl-btn-bg-color-hover: var(--ah-neon-600);
  --gf-ctrl-btn-color-primary: #fff;
  --gf-ctrl-btn-radius: var(--ah-pill);
  --gf-ctrl-btn-size-padding-y: 14px;
  --gf-ctrl-btn-size-padding-x: 28px;
  --gf-ctrl-btn-font-weight: 600;

  font-family: var(--ah-font);
}

/* La tarjeta del formulario es blanca, pero la sección es .ah-dark (texto blanco
   heredado). Forzamos color oscuro en TODO el contenido del formulario para que
   ningún texto (p. ej. el label de consentimiento) salga blanco e invisible. */
.gss-aihub .form-card,
.gss-aihub .form-card .gform_wrapper,
.gss-aihub .form-card .gform_wrapper * {
  color: var(--ah-ink);
}
.gss-aihub .form-card .gform_wrapper label,
.gss-aihub .form-card .gform_wrapper .gfield_consent_label,
.gss-aihub .form-card .gform_wrapper .ginput_container_consent label {
  color: var(--ah-ink-700) !important;
}

/* Layout: que el form ocupe el ancho de la tarjeta y respete grid de GF */
.gss-aihub .form-card .gform_wrapper { width: 100%; margin: 0; }
.gss-aihub .form-card .gform_wrapper form { margin: 0; }

/* Etiquetas: mismo aire que el diseño original */
.gss-aihub .form-card .gfield_label {
  font-size: 12.5px; font-weight: 600; color: var(--ah-ink-700);
  margin-bottom: 7px; letter-spacing: 0;
}

/* Inputs / selects / textarea: refuerzo por si una regla del tema gana a la variable */
.gss-aihub .form-card .gform_wrapper .gfield input:not([type=submit]):not([type=button]):not([type=radio]):not([type=checkbox]),
.gss-aihub .form-card .gform_wrapper .gfield select,
.gss-aihub .form-card .gform_wrapper .gfield textarea {
  width: 100%; font-family: inherit; font-size: 15px; color: var(--ah-ink);
  padding: 13px 14px; border-radius: 10px; border: 1px solid var(--ah-ink-200);
  background: var(--ah-ink-50);
  transition: border-color var(--ah-dur-fast), box-shadow var(--ah-dur-fast);
}
.gss-aihub .form-card .gform_wrapper .gfield textarea { resize: vertical; min-height: 90px; }
.gss-aihub .form-card .gform_wrapper .gfield input:not([type=submit]):focus,
.gss-aihub .form-card .gform_wrapper .gfield select:focus,
.gss-aihub .form-card .gform_wrapper .gfield textarea:focus {
  outline: none; border-color: var(--ah-neon);
  box-shadow: 0 0 0 3px rgba(80,120,255,.16); background: #fff;
}

/* Igualar el <select> a los inputs de texto: mismo tamaño, color y alto.
   Orbital ya dibuja su propia flecha, así que NO añadimos otra. */
.gss-aihub .form-card .gform_wrapper .gfield select {
  font-size: 15px !important; line-height: 1.5 !important; color: var(--ah-ink) !important;
  height: auto !important; min-height: 0 !important;
  padding: 13px 14px !important; font-weight: 400 !important;
  background-color: var(--ah-ink-50) !important;
}
.gss-aihub .form-card .gform_wrapper .gfield select option { color: var(--ah-ink); font-size: 15px; }

/* Consentimiento (checkbox) + texto legal: contraste legible */
.gss-aihub .form-card .gform_wrapper .gfield_consent_label,
.gss-aihub .form-card .gform_wrapper .gfield-consent .gfield_label,
.gss-aihub .form-card .gform_wrapper .gfield--type-consent label,
.gss-aihub .form-card .gform_wrapper .ginput_container_consent label,
.gss-aihub .form-card .gform_wrapper .gfield_consent_description {
  font-size: 13px !important; font-weight: 400 !important;
  color: var(--ah-ink-700) !important; line-height: 1.5; opacity: 1 !important;
}
.gss-aihub .form-card .gform_wrapper .gfield_consent_label a,
.gss-aihub .form-card .gform_wrapper .gfield--type-consent label a,
.gss-aihub .form-card .gform_wrapper .ginput_container_consent a {
  color: var(--ah-neon) !important; font-weight: 600; text-decoration: underline;
}
.gss-aihub .form-card .gform_wrapper .ginput_container_consent input[type=checkbox] {
  width: 18px; height: 18px; accent-color: var(--ah-neon); flex: none;
}

/* Mensajes de validación */
.gss-aihub .form-card .gform_wrapper .gfield_description.validation_message,
.gss-aihub .form-card .gform_wrapper .validation_message {
  font-size: 12px; color: var(--ah-danger); margin-top: 5px; padding: 0; background: none; border: 0;
}
.gss-aihub .form-card .gform_wrapper .gfield_error input,
.gss-aihub .form-card .gform_wrapper .gfield_error select,
.gss-aihub .form-card .gform_wrapper .gfield_error textarea { border-color: var(--ah-danger); }

/* Botón de envío: pill azul neón de marca */
.gss-aihub .form-card .gform_wrapper .gform_footer { margin-top: 18px; padding: 0; }
.gss-aihub .form-card .gform_wrapper .gform_footer input[type=submit],
.gss-aihub .form-card .gform_wrapper .gform_footer button {
  font-family: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
  background: var(--ah-neon); color: #fff; border: 0;
  padding: 14px 28px; border-radius: var(--ah-pill);
  transition: background var(--ah-dur-base), transform var(--ah-dur-base);
}
.gss-aihub .form-card .gform_wrapper .gform_footer input[type=submit]:hover,
.gss-aihub .form-card .gform_wrapper .gform_footer button:hover {
  background: var(--ah-neon-600); transform: translateY(-2px);
}

/* Mensaje de confirmación tras envío (sin AJAX recarga, pero por si acaso) */
.gss-aihub .form-card .gform_confirmation_message {
  font-size: 16px; color: var(--ah-ink); line-height: 1.6; text-align: center; padding: 20px 0;
}

/* ==========================================================================
   MODAL DE VÍDEO  (clase de body con prefijo gss-)
   Se abre desde cualquier botón/enlace con data-ah-open-video.
   ========================================================================== */

/* modal: fixed → fuera del flujo, no necesita el full-bleed */
.gss-aihub-modal { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: clamp(16px, 4vw, 48px); font-family: var(--ah-font); }
.gss-aihub-modal[hidden] { display: none; }
.gss-aihub-modal .vm-backdrop { position: absolute; inset: 0; background: rgba(2,10,34,.86); backdrop-filter: blur(6px); animation: ah-vm-fade .25s var(--ah-ease-out); }
.gss-aihub-modal .vm-dialog { position: relative; z-index: 1; width: min(1040px, 100%); aspect-ratio: 16/9; border-radius: 18px; overflow: hidden; background: #000; box-shadow: 0 40px 120px rgba(0,0,0,.6); animation: ah-vm-pop .28s var(--ah-ease-emph); }
.gss-aihub-modal .vm-video { width: 100%; height: 100%; display: block; object-fit: contain; background: #000; }
.gss-aihub-modal .vm-close { position: absolute; top: -52px; right: 0; z-index: 2; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); color: #fff; display: grid; place-items: center; transition: background var(--ah-dur-fast); }
.gss-aihub-modal .vm-close:hover { background: rgba(255,255,255,.24); }
.gss-aihub-modal .vm-close svg { width: 20px; height: 20px; }
@keyframes ah-vm-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ah-vm-pop { from { opacity: 0; transform: scale(.96) translateY(8px); } to { opacity: 1; transform: none; } }
body.gss-aihub-no-scroll { overflow: hidden; }

/* ==========================================================================
   REVEAL ON SCROLL
   ========================================================================== */
.gss-aihub .reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s var(--ah-ease), transform .6s var(--ah-ease); }
.gss-aihub .reveal.in { opacity: 1; transform: none; }
.gss-aihub .reveal.d1 { transition-delay: .07s; }
.gss-aihub .reveal.d2 { transition-delay: .14s; }
.gss-aihub .reveal.d3 { transition-delay: .21s; }
.gss-aihub .reveal.d4 { transition-delay: .28s; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1080px) {
  .gss-aihub .pillars { grid-template-columns: repeat(2, 1fr); gap: 28px 24px; }
  .gss-aihub .cap-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 920px) {
  .gss-aihub .plat-grid, .gss-aihub .cta-grid { grid-template-columns: 1fr; }
  .gss-aihub .ia-grid { grid-template-columns: 1fr; }
  .gss-aihub .ia-stage { order: -1; }
}
@media (max-width: 560px) {
  .gss-aihub .pillars { grid-template-columns: 1fr; }
  .gss-aihub .cap-grid { grid-template-columns: 1fr; }
  .gss-aihub .gss-form { grid-template-columns: 1fr; }
  .gss-aihub .stat-band { grid-template-columns: 1fr; padding: 8px 16px; }
  .gss-aihub .stat-card + .stat-card::before { left: 0; right: 0; top: 0; bottom: auto; width: auto; height: 1px; }
  .gss-aihub .form-foot .legal { max-width: 100%; }
  .gss-aihub .ia-tab p { padding-left: 0; }
  .gss-aihub-modal .vm-close { top: 0; right: 0; background: rgba(0,0,0,.5); }
}

/* Performance / accesibilidad: respeta prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .gss-aihub .reveal { transition-duration: .001s; opacity: 1; transform: none; }
}