/* creative-continuity.css — recorrido de la Home después del hero · Claude, 20-oct-2026.
   Alcance: body.fnx-site.fnx-home. Carga después de home-reset.css y antes de navigation-reset.css.
   Idea: promesa (hero) → mecanismo (proceso) → prueba (territorio) → capacidades → acción (rutas).
   Una decisión por encuadre; sin scroll-jacking ni revelados; la única continuidad es funcional (etapa → puente → conteos). */
body.fnx-site.fnx-home {
  --cc-navy: var(--fnx-navy, #01193d);
  --cc-paper: var(--fnx-paper, #f6f2e9);
  --cc-gold: var(--fnx-gold, #bd965c);
  --cc-gold-text: #8a5a2b;
  --cc-gold-light: #d8b479;
  --cc-line: var(--fnx-line, #dcd8cf);
  --cc-muted: var(--fnx-muted, #5d6876);
  --cc-gutter: var(--fnx-gutter, clamp(24px, 4.45vw, 80px));
  --cc-sans: var(--fnx-sans, "Source Sans 3", sans-serif);
  --cc-serif: var(--fnx-serif, "Source Serif 4", serif);
  --cc-mono: var(--fnx-mono, "IBM Plex Mono", monospace);
}

/* ---------- Mecanismo: «Qué hacemos» con una sola frase y el componente al mando ---------- */
body.fnx-site.fnx-home .business.section { padding-top: 72px; padding-bottom: 56px; margin-top: 0; border-top: 0; }
body.fnx-site.fnx-home .business .section-heading h2 { font: 500 clamp(36px, 3.6vw, 54px)/1.02 var(--cc-sans); letter-spacing: -.04em; max-width: 14ch; }
body.fnx-site.fnx-home .business .business-intro { padding-top: 10px; max-width: 30ch; }
body.fnx-site.fnx-home .business .business-intro > p:first-child { font: 400 clamp(20px, 1.6vw, 24px)/1.3 var(--cc-sans); color: var(--cc-muted); margin: 0; }
body.fnx-site.fnx-home .business .tal { padding-top: 40px; padding-bottom: 0; }

/* ---------- Puente: de la etapa elegida a los proyectos (lo actualiza el JS de Astra) ---------- */
body.fnx-site.fnx-home .fnx-stage-bridge { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 28px; padding: 22px var(--cc-gutter) 26px; border-top: 1px solid var(--cc-line); font-family: var(--cc-sans); }
body.fnx-site.fnx-home .fnx-stage-bridge > p { margin: 0; font: 500 11px/1.5 var(--cc-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cc-gold-text); }
body.fnx-site.fnx-home .fnx-stage-bridge a { font: 500 16px/1.3 var(--cc-sans); color: var(--cc-navy); text-decoration: none; border-bottom: 1px solid var(--cc-navy); padding-bottom: 3px; }
body.fnx-site.fnx-home .fnx-stage-bridge a:hover { border-bottom-width: 2px; }
body.fnx-site.fnx-home .fnx-stage-bridge a + a { color: var(--cc-muted); border-bottom-color: var(--cc-line); }

/* ---------- Prueba: territorio con una decisión (elegir estado) y la etapa activa en los conteos ---------- */
body.fnx-site.fnx-home .territory.section { padding-top: 72px; padding-bottom: 64px; }
body.fnx-site.fnx-home .territory .section-heading h2 { font: 500 clamp(36px, 3.6vw, 54px)/1.02 var(--cc-sans); letter-spacing: -.04em; max-width: 14ch; }
body.fnx-site.fnx-home .territory-intro { position: static; margin: 14px 0 0; max-width: 40ch; font: 400 17px/1.5 var(--cc-sans); color: rgba(246, 242, 233, .78); }
body.fnx-site.fnx-home .territory-grid { margin-top: 36px; }
body.fnx-site.fnx-home .stage-counts { margin-top: 40px; padding-top: 28px; gap: 48px; }
body.fnx-site.fnx-home .stage-counts > div { position: relative; padding-top: 10px; transition: color .3s ease; }
body.fnx-site.fnx-home .stage-counts > div::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 2px; background: transparent; transition: background .3s ease; }
body.fnx-site.fnx-home .stage-counts b { font: 400 44px/1 var(--cc-sans); letter-spacing: -.04em; }
body.fnx-site.fnx-home .stage-counts span { font-size: 15px; }
body.fnx-site.fnx-home .stage-counts > p { font: 400 12px/1.5 var(--cc-mono); letter-spacing: .02em; color: rgba(246, 242, 233, .6); }
/* La etapa activa del proceso se refleja aquí sin JS: Originación → 01, Desarrollo → 03, Operación → 04.
   Estructuración (02) es flujo de trabajo, no etapa de inventario: los tres conteos quedan neutrales. */
body.fnx-site.fnx-home main:has([data-tal][data-etapa="1"]) .stage-counts > div:nth-of-type(1)::before,
body.fnx-site.fnx-home main:has([data-tal][data-etapa="3"]) .stage-counts > div:nth-of-type(2)::before,
body.fnx-site.fnx-home main:has([data-tal][data-etapa="4"]) .stage-counts > div:nth-of-type(3)::before { background: var(--cc-gold-light); }
body.fnx-site.fnx-home main:has([data-tal][data-etapa="1"]) .stage-counts > div:nth-of-type(1) span,
body.fnx-site.fnx-home main:has([data-tal][data-etapa="3"]) .stage-counts > div:nth-of-type(2) span,
body.fnx-site.fnx-home main:has([data-tal][data-etapa="4"]) .stage-counts > div:nth-of-type(3) span { color: var(--cc-gold-light); }

/* ---------- Capacidades: seis en dos columnas, nombre al frente, resumen en segundo plano ---------- */
body.fnx-site.fnx-home .capabilities.section { padding-top: 72px; padding-bottom: 64px; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 6%; }
body.fnx-site.fnx-home .capabilities .section-heading h2 { font: 500 clamp(36px, 3.6vw, 54px)/1.02 var(--cc-sans); letter-spacing: -.04em; }
body.fnx-site.fnx-home .capabilities .text-link { margin-top: 22px; font: 500 15px/1.4 var(--cc-sans); }
body.fnx-site.fnx-home .division-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; border-top: 1px solid var(--cc-line); }
body.fnx-site.fnx-home .division-list .division { grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 14px; padding: 18px 0 20px; border-top: 0; border-bottom: 1px solid var(--cc-line); }
body.fnx-site.fnx-home .division-list .division > .tiny { display: none; }
body.fnx-site.fnx-home .division-list .division img { width: 40px; height: 40px; margin-top: 2px; }
body.fnx-site.fnx-home .division-list .division h3 { font: 500 19px/1.2 var(--cc-sans); letter-spacing: -.015em; color: var(--cc-navy); margin: 0 0 4px; }
body.fnx-site.fnx-home .division-list .division p { font: 400 14px/1.5 var(--cc-sans); color: var(--cc-muted); margin: 0; max-width: 34ch; }
body.fnx-site.fnx-home .division-list .division:hover h3 { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--cc-gold); }

/* ---------- Acción: tres rutas de cliente, misma altura, acción visible ---------- */
body.fnx-site.fnx-home .contact.section { padding-top: 72px; padding-bottom: 80px; }
body.fnx-site.fnx-home .contact .section-heading { display: block; }
body.fnx-site.fnx-home .contact .section-heading h2 { font: 500 clamp(36px, 3.6vw, 54px)/1.02 var(--cc-sans); letter-spacing: -.04em; min-width: 0; margin-top: 14px; }
body.fnx-site.fnx-home .audiences { margin-top: 40px; gap: 24px; }
body.fnx-site.fnx-home .audiences > a { display: flex; flex-direction: column; background: var(--cc-paper); border: 1px solid var(--cc-line); border-top: 2px solid var(--cc-navy); padding: 22px 24px 24px; text-decoration: none; }
body.fnx-site.fnx-home .audiences > a .tiny { font: 500 11px/1.5 var(--cc-mono); letter-spacing: .12em; color: var(--cc-gold-text); }
body.fnx-site.fnx-home .audiences h3 { margin: 14px 0 10px; font: 500 clamp(22px, 1.9vw, 27px)/1.15 var(--cc-sans); letter-spacing: -.025em; }
body.fnx-site.fnx-home .audiences p { margin: 0; font: 400 15.5px/1.55 var(--cc-sans); color: var(--cc-muted); max-width: 32ch; }
body.fnx-site.fnx-home .fnx-home-audience-action { margin-top: auto; padding-top: 22px; display: inline-flex; align-items: center; gap: 10px; border: 0; font: 500 15px/1.4 var(--cc-sans); color: var(--cc-navy); }
body.fnx-site.fnx-home .fnx-home-audience-action::after { content: ""; width: 22px; height: 1px; background: currentColor; transition: width .25s ease; }
body.fnx-site.fnx-home .audiences > a:hover .fnx-home-audience-action::after { width: 36px; }
body.fnx-site.fnx-home .audiences > a:focus-visible { outline: 2px solid var(--cc-gold); outline-offset: 3px; }

/* ---------- Anchos menores ---------- */
@media (max-width: 1000px) {
  body.fnx-site.fnx-home .capabilities.section { display: block; }
  body.fnx-site.fnx-home .division-list { margin-top: 28px; }
}
@media (max-width: 700px) {
  body.fnx-site.fnx-home .business.section, body.fnx-site.fnx-home .territory.section, body.fnx-site.fnx-home .capabilities.section, body.fnx-site.fnx-home .contact.section { padding-top: 56px; padding-bottom: 48px; }
  body.fnx-site.fnx-home .fnx-stage-bridge { padding: 18px var(--cc-gutter) 22px; gap: 8px 18px; }
  body.fnx-site.fnx-home .division-list { grid-template-columns: minmax(0, 1fr); }
  body.fnx-site.fnx-home .audiences { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 28px; }
  body.fnx-site.fnx-home .audiences > a { margin: 0; padding: 20px 18px 22px; }
  body.fnx-site.fnx-home .stage-counts { gap: 24px; }
  body.fnx-site.fnx-home .stage-counts b { font-size: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  body.fnx-site.fnx-home .stage-counts > div, body.fnx-site.fnx-home .stage-counts > div::before, body.fnx-site.fnx-home .fnx-home-audience-action::after { transition: none; }
}
