/* ============================================================================
   === REDISEÑO · design system (rd-*) ========================================
   OpenOne — dirección visual "ALIANZA / CONVERGENCIA".
   Fuente de verdad del look para TODO el rediseño. Nada hardcodeado en las
   secciones: consumir SIEMPRE estos tokens y clases rd-*.

   IDIOMA VISUAL
   · Paleta:  morado #542DE3 = tinta estructural + marca; mint #10F4AE = ÚNICO
     acento de "activación/vida" (se usa poco y con intención). Lienzo lila-blanco;
     superficies profundas en morado casi-negro (nunca negro puro de fondo).
   · Tipografía: Funnel Display en TODO (labels incluidos — sin monoespaciada
     de adorno). Titulares densos, tracking negativo; labels en mayúscula espaciada
     SIN punto ni numeración.
   · Componentes: tarjetas de esquinas suaves + sombra morada difusa; tiles de
     icono en lila; botones de rectángulo redondeado (no píldora 999px).
   · Movimiento: curva Emil `--rd-ease` (no easings stock). Entradas ease-out,
     press scale(0.97), solo transform/opacity. Reveals deliberados (no fade-up
     a todo por igual).
   · Ilustración: formas geométricas SÓLIDAS (orbes, círculos, tiles), sin líneas
     decorativas, sin blobs/glows, sin gradientes por estética. El wordmark OpenOne
     es la pieza firma (dos "O" que convergen = alianza).
   ============================================================================ */
  :root {
    /* — Paleta — */
    --rd-purple: #542DE3;        /* primario: estructura, marca, texto de acento */
    --rd-purple-700: #3B1EA6;    /* morado profundo: gradientes / hover */
    --rd-purple-900: #1F1452;    /* morado casi-negro: superficies profundas */
    --rd-purple-300: #A98BFF;    /* morado claro: texto de marca legible sobre superficies profundas */
    --rd-purple-tint: #EDE7FF;   /* superficie lila: tiles de icono, hover */
    --rd-purple-tint-2: #F4F1FE; /* superficie lila más clara */
    --rd-mint: #10F4AE;          /* acento ÚNICO de activación — usar con moderación */
    --rd-mint-ink: #06382A;      /* texto sobre mint */
    --rd-mint-tint: #E1FBF2;     /* superficie mint muy clara (hover "activación") */
    --rd-ink: #0E0B22;           /* texto principal (negro-morado) */
    --rd-ink-soft: #4A4A6A;      /* texto secundario */
    --rd-ink-faint: #8C8CA8;     /* texto terciario / labels quietas */
    --rd-bg: #F3F1FB;            /* lienzo: blanco con matiz lila */
    --rd-surface: #FFFFFF;       /* tarjetas claras */
    --rd-deep-1: #1F1452;        /* superficie profunda (inicio del gradiente) */
    --rd-deep-2: #0A0A23;        /* superficie profunda (fin del gradiente) */

    /* — Tipografía (Funnel Display en todo) — */
    --rd-font: 'Funnel Display', system-ui, sans-serif;
    --rd-text-xs: 12px;
    --rd-text-sm: clamp(13px, 0.9vw, 14px);
    --rd-text-base: clamp(15.5px, 1vw, 17px);
    --rd-text-lg: clamp(18px, 1.5vw, 22px);
    --rd-text-xl: clamp(22px, 2.3vw, 31px);
    --rd-text-2xl: clamp(28px, 3.2vw, 42px);
    --rd-text-3xl: clamp(34px, 4.6vw, 58px);
    --rd-tracking-tight: -0.03em;
    --rd-tracking-label: 0.16em;

    /* — Espaciado (base 8) — */
    --rd-s1: 4px; --rd-s2: 8px; --rd-s3: 12px; --rd-s4: 16px; --rd-s5: 24px;
    --rd-s6: 32px; --rd-s7: 48px; --rd-s8: 64px; --rd-s9: 96px; --rd-s10: 128px;
    --rd-section-y: clamp(72px, 10vh, 128px);
    --rd-section-x: clamp(20px, 4vw, 40px);
    --rd-container: 1200px;

    /* — Radios — */
    --rd-r-sm: 10px; --rd-r-md: 16px; --rd-r-lg: 22px; --rd-r-xl: 28px; --rd-r-btn: 14px;

    /* — Sombras — */
    --rd-shadow-sm: 0 1px 2px rgba(14,11,34,0.05);
    --rd-shadow-card: 0 1px 2px rgba(14,11,34,0.05), 0 26px 60px -34px rgba(84,45,227,0.30);
    --rd-shadow-cta: 0 14px 30px -12px rgba(84,45,227,0.55);
    --rd-shadow-cta-hover: 0 22px 44px -12px rgba(84,45,227,0.72);
    --rd-shadow-mint: 0 16px 30px -14px rgba(16,244,174,0.5);
    --rd-shadow-nav: 0 10px 30px -22px rgba(14,11,34,0.45);

    /* — Movimiento (curvas Emil, no stock) — */
    --rd-ease: cubic-bezier(0.23, 1, 0.32, 1);
    --rd-ease-inout: cubic-bezier(0.77, 0, 0.175, 1);
    --rd-dur-fast: 160ms;
    --rd-dur: 240ms;
    --rd-dur-slow: 420ms;
  }

  /* ── Contenedor y sección ─────────────────────────────────────────────── */
  .rd-section { position: relative; padding: var(--rd-section-y) var(--rd-section-x); }
  .rd-container { max-width: var(--rd-container); margin: 0 auto; width: 100%; }

  /* ── Label / eyebrow (SIN punto, SIN numeración, Funnel Display) ──────── */
  .rd-label { font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 700;
    text-transform: uppercase; letter-spacing: var(--rd-tracking-label); color: var(--rd-purple); }
  .rd-label--faint { color: var(--rd-ink-faint); }

  /* ── Wordmark OpenOne inline (todo morado; "One" itálica) ─────────────── */
  .rd-wordmark { color: var(--rd-purple); font-weight: 700; letter-spacing: -0.02em; }
  .rd-wordmark i { font-style: italic; }

  /* ── Botones ──────────────────────────────────────────────────────────── */
  .rd-btn { font-family: var(--rd-font); display: inline-flex; align-items: center;
    justify-content: center; gap: 10px; padding: 15px 26px; font-size: var(--rd-text-sm);
    font-weight: 600; letter-spacing: -0.005em; border: 1px solid transparent;
    border-radius: var(--rd-r-btn); cursor: pointer; white-space: nowrap;
    transition: transform var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease),
      background-color var(--rd-dur) var(--rd-ease), color var(--rd-dur) var(--rd-ease),
      border-color var(--rd-dur) var(--rd-ease); }
  .rd-btn__arrow { display: inline-block; transition: transform var(--rd-dur) var(--rd-ease); }
  .rd-btn--primary { background: linear-gradient(135deg, var(--rd-purple), var(--rd-purple-700));
    color: #fff; box-shadow: var(--rd-shadow-cta); }
  .rd-btn--dark { background: var(--rd-ink); color: #fff; }
  .rd-btn--ghost { background: rgba(255,255,255,0.6); color: var(--rd-ink);
    border-color: rgba(14,11,34,0.14); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
  .rd-btn--sm { padding: 10px 16px; font-size: var(--rd-text-xs); border-radius: var(--rd-r-sm); gap: 8px; }
  @media (hover: hover) and (pointer: fine) {
    .rd-btn:hover .rd-btn__arrow { transform: translateX(3px); }
    .rd-btn--primary:hover { transform: translateY(-2px); box-shadow: var(--rd-shadow-cta-hover); }
    .rd-btn--dark:hover { background: var(--rd-purple); }
    .rd-btn--ghost:hover { color: var(--rd-purple); border-color: var(--rd-purple); transform: translateY(-2px); }
  }
  /* press feedback (declarado al final: gana al hover durante el :active) */
  .rd-btn:active { transform: scale(0.97); }

  /* ── Tarjetas ─────────────────────────────────────────────────────────── */
  .rd-card { background: var(--rd-surface); border-radius: var(--rd-r-md);
    box-shadow: var(--rd-shadow-card); padding: clamp(24px, 3vw, 40px); }
  .rd-card--tint { background: var(--rd-purple-tint-2); box-shadow: none; }
  .rd-card--deep { background: linear-gradient(150deg, var(--rd-deep-1), var(--rd-deep-2));
    color: #fff; border-radius: var(--rd-r-md); padding: clamp(24px, 3vw, 40px); }

  /* ── Chip + tile de icono (formas sólidas, no píldora 999px) ──────────── */
  .rd-chip { display: inline-flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
  .rd-tile { width: 44px; height: 44px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; background: var(--rd-purple-tint);
    box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
    transition: transform var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease); }
  .rd-tile .ms { color: var(--rd-purple); font-size: 22px; }
  .rd-tile--mint { background: var(--rd-mint); box-shadow: var(--rd-shadow-mint); }
  .rd-tile--mint .ms { color: var(--rd-mint-ink); }

  /* ── Reveal deliberado (entrada suave, ease-out; escalonable) ─────────── */
  @keyframes rd-reveal-in { to { opacity: 1; transform: translateY(0); } }
  .rd-reveal { opacity: 0; transform: translateY(16px);
    animation: rd-reveal-in var(--rd-dur-slow) var(--rd-ease) forwards; }
  .rd-reveal--d1 { animation-delay: 70ms; }
  .rd-reveal--d2 { animation-delay: 140ms; }
  .rd-reveal--d3 { animation-delay: 210ms; }
  .rd-reveal--d4 { animation-delay: 300ms; }

  /* ── NAV ──────────────────────────────────────────────────────────────── */
  .rd-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; display: flex;
    align-items: center; justify-content: space-between; gap: var(--rd-s4); height: 64px;
    padding: 0 clamp(16px, 3vw, 32px); background: rgba(255,255,255,0.82);
    backdrop-filter: blur(20px) saturate(1.4); -webkit-backdrop-filter: blur(20px) saturate(1.4);
    box-shadow: var(--rd-shadow-nav); transition: transform var(--rd-dur-slow) var(--rd-ease); }
  .rd-nav__brand { position: relative; display: flex; align-items: center; height: 28px; min-width: 128px; }
  .rd-nav__brand img { display: block; height: 22px; width: auto; }
  .rd-nav__full, .rd-nav__compact { position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    transition: opacity var(--rd-dur-slow) var(--rd-ease); }
  .rd-nav__links { display: flex; align-items: center; gap: 2px; }
  .rd-nav__link { padding: 8px 13px; font-size: 13px; font-weight: 500; letter-spacing: -0.005em;
    color: var(--rd-ink-soft); border-radius: var(--rd-r-sm); white-space: nowrap;
    transition: color var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease); }
  .rd-nav__right { display: flex; align-items: center; gap: var(--rd-s3); }

  /* Breadcrumb: opencard › OpenOne — 'opencard' regresa al sitio; micro-interacción de flecha */
  .rd-crumb { display: flex; align-items: center; gap: 9px; height: 28px; }
  .rd-crumb__home { display: flex; align-items: center; text-decoration: none; }
  .rd-crumb__arrow { display: inline-flex; align-items: center; justify-content: center;
    width: 0; opacity: 0; overflow: hidden; transform: translateX(3px);
    color: var(--rd-purple); font-size: 16px; font-weight: 700; line-height: 1;
    transition: width var(--rd-dur) var(--rd-ease), opacity var(--rd-dur) var(--rd-ease), transform var(--rd-dur) var(--rd-ease); }
  .rd-crumb__logo { height: 22px; width: auto; display: block; transition: opacity var(--rd-dur) var(--rd-ease); }
  .rd-crumb__sep { color: var(--rd-ink-soft); opacity: 0.4; font-size: 16px; font-weight: 400; }
  .rd-crumb__current { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; color: var(--rd-purple); }
  .rd-crumb__current em { font-style: italic; }
  @media (hover: hover) and (pointer: fine) {
    .rd-crumb__home:hover .rd-crumb__arrow { width: 19px; opacity: 1; transform: translateX(0); }
    .rd-crumb__home:hover .rd-crumb__logo { opacity: 0.82; }
  }
  .rd-lang { display: flex; align-items: center; gap: 2px; padding: 3px;
    background: var(--rd-purple-tint-2); border-radius: 11px; }
  @media (hover: hover) and (pointer: fine) {
    .rd-nav__link:hover { color: var(--rd-purple); background: var(--rd-purple-tint); }
  }

  /* ── HERO ─────────────────────────────────────────────────────────────── */
  .rd-hero { position: relative; min-height: 100vh; min-height: 100dvh; overflow: hidden;
    display: flex; flex-direction: column; background: transparent;
    padding: clamp(104px, 14vh, 150px) var(--rd-section-x) clamp(48px, 7vh, 72px); }
  .rd-hero__inner { position: relative; z-index: 1; max-width: 1240px; margin: 0 auto; width: 100%;
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: clamp(22px, 3.4vh, 40px); }
  .rd-hero__lead { margin: 0; max-width: 22ch; font-size: var(--rd-text-xl); line-height: 1.18;
    letter-spacing: var(--rd-tracking-tight); font-weight: 600; color: var(--rd-ink); text-wrap: balance; }
  .rd-hero__wordmark { margin: 0; line-height: 0; }
  .rd-hero__wordmark svg { width: min(940px, 90vw); height: auto; display: block; margin: 0 auto; overflow: visible; }
  .rd-hero__powered { display: flex; align-items: center; justify-content: center; gap: 12px; }
  .rd-hero__powered-label { font-family: var(--rd-font); font-size: 12px; letter-spacing: 0.2em;
    text-transform: uppercase; color: var(--rd-ink-faint); }
  .rd-hero__powered img { height: 22px; width: auto; display: block; }
  .rd-hero__cta { display: flex; flex-wrap: wrap; gap: var(--rd-s3); justify-content: center; }

  /* ── Responsive rd-* (nav compacto + hero holgado) ───────────────────── */
  @media (max-width: 900px) {
    .rd-nav { height: 58px; gap: var(--rd-s3); }
    .rd-nav__links { display: none; }              /* narrativa de scroll; links ocultos en móvil */
    .rd-hero__inner { gap: clamp(20px, 3vh, 30px); }
  }

  *, *::before, *::after { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; background: var(--rd-bg); color: var(--rd-ink); font-family: 'Funnel Display', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
  body { overflow-x: hidden; }
  a { color: inherit; text-decoration: none; }
  button { font-family: inherit; cursor: pointer; }
  ::selection { background: #542DE3; color: #fff; }

  /* ===== RESPONSIVE (mobile / tablet) ===== */
  @media (max-width: 900px) {
    section[id] { padding-left: 20px !important; padding-right: 20px !important; padding-top: 76px !important; padding-bottom: 76px !important; }
    section[id="top"] { padding-top: 104px !important; padding-bottom: 56px !important; min-height: 0 !important; }
    /* Vision: disable pin/sticky on mobile, stack normally, force solution visible */
    section#vision { height: auto !important; }
    section#vision [data-vision-sticky] { position: static !important; height: auto !important; }
    section#vision [data-vision-sol] { opacity: 1 !important; transform: none !important; }
    section#vision [data-vision-prob] { transform: none !important; }
    section#playbook [data-pb-track] { height: auto !important; }
    section#playbook [data-pb-sticky] { position: static !important; min-height: 0 !important; padding: 0 !important; }
    section#playbook [style*="grid-template-columns: 0.82fr 1.18fr"] { grid-template-columns: 1fr !important; gap: 20px !important; }
    section#vision [data-vision-cue] { display: none !important; }
    /* Solución: en móvil se apila (orbe arriba, beneficios abajo) y se revela todo */
    section#solucion [data-sol-track] { height: auto !important; }
    section#solucion [data-sol-sticky] { position: static !important; min-height: 0 !important; padding: 76px 20px !important; display: block !important; }
    .oo-sol-row { display: block !important; width: 100% !important; max-width: 100% !important; transform: none !important; }
    section#solucion .oo-orbit-wrap { --sys: clamp(200px, 62vw, 300px) !important; margin: 32px auto 0 !important; }
    .oo-sol-left { display: block !important; width: 100% !important; max-width: 100% !important; overflow: hidden; }
    .oo-sol-title { max-width: 92vw !important; font-size: clamp(22px, 6.4vw, 30px) !important; }
    .oo-sol-right { display: block !important; width: 100% !important; max-width: 440px; margin: 32px auto 0; padding: 22px 18px 24px; }
    .oo-sol-list { grid-template-columns: 1fr 1fr; gap: 18px 14px; text-align: center; }
    .oo-cap { opacity: 1 !important; transform: none !important; }
    .oo-sol-panel { position: static !important; transform: none !important; width: 100% !important; max-width: 100% !important; margin: 20px auto 0; }
    [style*="clamp(72px, 17vw, 248px)"] { font-size: clamp(44px, 13vw, 108px) !important; }
    [style*="padding: 60px 32px; max-width: 1100px"] { padding: 20px 0 !important; }
    [style*="display: flex; gap: 2px; padding: 0px 4px"] { display: none !important; }
    [style*="grid-template-columns: 1.05fr 1fr"] { grid-template-columns: 1fr !important; gap: 40px !important; }
    [style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr !important; gap: 24px !important; }
    [style*="grid-template-columns: 1fr auto 1fr auto 1fr"] { grid-template-columns: 1fr !important; gap: 16px !important; }
    [style*="grid-template-columns: auto 1fr 1fr"] { grid-template-columns: 1fr !important; gap: 28px !important; }
    [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
    [style*="grid-template-columns: repeat(5, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
    [style*="grid-template-columns: repeat(6, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
    [style*="grid-template-columns: repeat(7, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
    [style*="padding: 24px 0px 32px; display: flex; justify-content: space-between"] { flex-direction: column !important; gap: 24px !important; }
    [style*="width: 600px"] { width: 100% !important; max-width: 100% !important; }
    [style*="max-width: 22%"] { max-width: 100% !important; }
    footer > div { justify-content: center !important; text-align: center !important; }
    /* Diagram container + chips */
    [style*="padding: 56px 40px"] { padding: 28px 16px !important; }
    [style*="width: 110px; height: 110px"] { width: 88px !important; height: 88px !important; }
    [style*="max-width: 980px"] { max-width: 100% !important; }
    /* Large card paddings */
    [style*="padding: 40px 36px"] { padding: 28px 18px !important; }
    [style*="padding: 40px"] { padding: 22px !important; }
    [style*="padding: 36px"] { padding: 22px !important; }
    [style*="padding: 32px"] { padding: 20px !important; }
    /* Heading sizes */
    [style*="font-size: 32px"] { font-size: 23px !important; }
    [style*="font-size: 28px"] { font-size: 21px !important; }
    /* Inline-percent widths */
    [style*="max-width: 32%"] { max-width: 100% !important; }
    /* Navbar tighten so it never overflows */
    nav[style*="position: fixed"] { padding: 6px 8px 6px 12px !important; gap: 6px !important; max-width: calc(100vw - 20px) !important; }
    nav[style*="position: fixed"] [style*="padding: 9px 16px 9px 18px"] { padding: 8px 12px !important; font-size: 12px !important; }
    /* Playbook dashed connector line — hide when stacked */
    [style*="left: 5%; right: 5%; height: 2px"] { display: none !important; }
    /* Decorative blobs must never create scroll */
    [style*="position: absolute"][style*="border-radius: 50%"] { max-width: 100vw !important; }
  }
  @media (max-width: 560px) {
    section[id] { padding-top: 56px !important; padding-bottom: 56px !important; }
    [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr !important; }
    [style*="grid-template-columns: repeat(5, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
    [style*="grid-template-columns: repeat(6, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
    [style*="grid-template-columns: repeat(7, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
    [style*="grid-template-columns: repeat(2, 1fr)"] { grid-template-columns: 1fr !important; }
    [style*="repeat(4, 1fr); gap: 12px; margin-bottom: 32px"] { grid-template-columns: repeat(2, 1fr) !important; }
    [style*="width: 110px; height: 110px"] { width: 74px !important; height: 74px !important; }
    [style*="padding: 56px 40px"] { padding: 22px 12px !important; }
  }
  @media (max-width: 420px) {
    /* Hide language toggle on very small screens to keep nav clean */
    [style*="border-radius: 3px; margin-left: 4px"] { display: none !important; }
  }
  html { scroll-behavior: smooth; }

  /* === Regla opencard: textos centrados; tarjetas con info centrada === */
  section { text-align: center; }
  section [style*="max-width"] { margin-left: auto !important; margin-right: auto !important; }
  [data-tilt] ul, [data-tilt] ol { align-items: center !important; }
  [data-tilt] li, [data-tilt] [style*="display: flex"] { justify-content: center !important; }

  @media (min-width: 901px) {
    section[id]:not(#top):not(#contacto):not(#vision):not(#playbook):not(#solucion) { min-height: 94vh; display: flex; flex-direction: column; justify-content: center; }
  }
  @keyframes float-blob {
    0%, 100% { transform: translate(0,0) scale(1); }
    33% { transform: translate(40px,-30px) scale(1.08); }
    66% { transform: translate(-30px,30px) scale(0.95); }
  }
  @keyframes drift-blob {
    0%, 100% { transform: translate(0,0) scale(1); }
    50% { transform: translate(-50px,40px) scale(1.1); }
  }
  @keyframes fade-up {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes faseInA {
    from { opacity: 0; transform: translateX(48px); }
    to { opacity: 1; transform: translateX(0); }
  }
  @keyframes faseInB {
    from { opacity: 0; transform: translateX(48px); }
    to { opacity: 1; transform: translateX(0); }
  }
  @keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  @keyframes spin-slow { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  @keyframes pulse-soft {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.06); opacity: 0.85; }
  }
  @keyframes draw-dash {
    from { stroke-dashoffset: 200; }
    to { stroke-dashoffset: 0; }
  }
  @keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
  }
  @keyframes type-cursor {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
  }
  @keyframes orbit {
    from { transform: rotate(0deg) translateX(120px) rotate(0deg); }
    to { transform: rotate(360deg) translateX(120px) rotate(-360deg); }
  }
  @keyframes wordmark-glow {
    0%, 100% { filter: drop-shadow(0 0 0 rgba(84,45,227,0)); }
    50% { filter: drop-shadow(0 0 24px rgba(84,45,227,0.35)); }
  }
  @keyframes oo-pop {
    0%   { opacity: 0; transform: scale(0.2) rotate(-12deg); filter: blur(20px); text-shadow: 0 0 0 rgba(84,45,227,0); }
    45%  { opacity: 1; transform: scale(1.18) rotate(0deg); filter: blur(0); text-shadow: 0 0 55px rgba(84,45,227,0.75); }
    70%  { transform: scale(1.18); text-shadow: 0 0 34px rgba(84,45,227,0.55); }
    100% { opacity: 1; transform: scale(1); filter: blur(0); text-shadow: 0 0 0 rgba(84,45,227,0); }
  }
  @keyframes wm-expand {
    0%   { max-width: 0; opacity: 0; filter: blur(10px); }
    34%  { max-width: 0; opacity: 0; filter: blur(10px); }
    100% { max-width: 1.5em; opacity: 1; filter: blur(0); }
  }
  @keyframes sol-glow-pulse {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50% { opacity: 0.9; transform: scale(1.12); }
  }
  @keyframes card-sweep {
    0% { transform: translateX(-120%) skewX(-18deg); }
    100% { transform: translateX(320%) skewX(-18deg); }
  }
  @keyframes twinkle {
    0%, 100% { opacity: 0.25; }
    50% { opacity: 1; }
  }
  @keyframes float-node {
    0%, 100% { transform: translate(0,0); }
    50% { transform: translate(var(--fx,6px), var(--fy,-8px)); }
  }
  @keyframes border-flow {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
  }
  @keyframes aurora-a { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(34vw,22vh) scale(1.4); } }
  @keyframes aurora-b { 0%,100% { transform: translate(0,0) scale(1.15); } 50% { transform: translate(-32vw,18vh) scale(0.85); } }
  @keyframes aurora-c { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(26vw,-24vh) scale(1.35); } }
  @keyframes aurora-d { 0%,100% { transform: translate(0,0) scale(1.05); } 50% { transform: translate(-24vw,-20vh) scale(1.3); } }
  @keyframes hue-drift { 0%,100% { opacity: 0.7; } 50% { opacity: 1; } }
  @keyframes flow-dot { 0% { left: -3px; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: calc(100% - 3px); opacity: 0; } }
  @keyframes flow-dot-v { 0% { top: -3px; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { top: calc(100% - 3px); opacity: 0; } }
  @keyframes secRevealA { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes secRevealB { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes heroWm { from { opacity: 0; transform: translateY(22px) scale(0.965); filter: blur(7px); } to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } }
  @media (max-width: 1180px) {
    [data-eco-core] { transform: translate(-50%, -50%) scale(0.82) !important; }
  }
  @media (max-width: 1000px) {
    [data-eco-core] { transform: translate(-50%, -50%) scale(0.66) !important; }
  }
  @media (max-width: 820px) {
    [data-eco-core] { transform: translate(-50%, -50%) scale(0.5) !important; }
  }
  /* ===== Ecosistema OpenOne — sistema orbital ===== */
  @keyframes oo-orbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
  @keyframes oo-orbit-rev { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } }
  @keyframes oo-core-pulse {
    0%, 100% { box-shadow: 0 24px 60px -18px rgba(84,45,227,0.55), 0 0 0 0 rgba(16,244,174,0.30), inset 0 6px 20px rgba(255,255,255,0.30); }
    50%      { box-shadow: 0 32px 74px -18px rgba(84,45,227,0.70), 0 0 0 16px rgba(16,244,174,0), inset 0 6px 20px rgba(255,255,255,0.30); }
  }

  .ms { font-family: 'Material Symbols Outlined'; font-variation-settings: 'FILL' 0, 'wght' 500; line-height: 1; }

  /* Escenario de una sola pantalla: título + diagrama como una unidad centrada */
  .oo-stage {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(18px, 3.2vh, 40px);
    padding: 76px 0 44px;
  }
  .oo-orbit-wrap {
    /* Limitado por ancho Y alto para que quepa junto al título en un viewport */
    --sys: clamp(300px, min(90vw, 62vh), 600px);
    position: relative; width: var(--sys); height: var(--sys);
    margin: 0 auto;
    flex: none;
  }

  /* Campos gravitacionales — discos SÓLIDOS suaves (sin líneas): el interno delimita
     la infraestructura One-Stop-Shop; el externo, actores y beneficios del ecosistema. */
  .oo-track { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none; z-index: 1; }
  .oo-track.inner { width: calc(var(--sys) * 0.62); height: calc(var(--sys) * 0.62);
    background: radial-gradient(circle, rgba(84,45,227,0.10) 0%, rgba(84,45,227,0.045) 66%, rgba(84,45,227,0) 100%); }
  .oo-track.outer { width: calc(var(--sys) * 1.02); height: calc(var(--sys) * 1.02);
    background: radial-gradient(circle, rgba(84,45,227,0.05) 0%, rgba(84,45,227,0.02) 70%, rgba(84,45,227,0) 100%); }

  /* Rotores (giran) */
  .oo-rotor { position: absolute; inset: 0; transform-origin: 50% 50%; z-index: 2; }
  .oo-rotor.inner { animation: oo-orbit 46s linear infinite; }
  .oo-rotor.outer { animation: oo-orbit-rev 78s linear infinite; }

  /* Nodos: contra-rotan para quedar siempre derechos; el ícono queda pegado a su órbita */
  .oo-node { position: absolute; top: 50%; left: 50%; transform-origin: 50% calc(var(--oo-ic) / 2); }
  .oo-node.inner-node {
    --oo-ic: clamp(44px, calc(var(--sys) * 0.11), 58px);
    --nw: clamp(90px, calc(var(--sys) * 0.20), 120px);
    width: var(--nw);
    margin-left: calc(var(--dx) - var(--nw) / 2);
    margin-top: calc(var(--dy) - var(--oo-ic) / 2);
    animation: oo-orbit-rev 46s linear infinite;
  }
  .oo-node.outer-node {
    --oo-ic: clamp(40px, calc(var(--sys) * 0.10), 52px);
    --nw: clamp(84px, calc(var(--sys) * 0.19), 122px);
    width: var(--nw);
    margin-left: calc(var(--dx) - var(--nw) / 2);
    margin-top: calc(var(--dy) - var(--oo-ic) / 2);
    animation: oo-orbit 78s linear infinite;
  }
  .oo-node:hover { z-index: 20; }
  /* Al pasar el cursor sobre el ecosistema, el giro se detiene: los nodos dejan de ser
     blancos móviles y se pueden explorar/clic con precisión. Rotor y nodo pausan juntos. */
  @media (hover: hover) and (pointer: fine) {
    .oo-orbit-wrap:hover .oo-rotor,
    .oo-orbit-wrap:hover .oo-node { animation-play-state: paused; }
  }

  /* Posiciones (fracciones del tamaño del sistema) */
  .p-in-0   { --dx: 0px;                          --dy: calc(var(--sys) * -0.27); }
  .p-in-90  { --dx: calc(var(--sys) * 0.27);      --dy: 0px; }
  .p-in-180 { --dx: 0px;                          --dy: calc(var(--sys) * 0.27); }
  .p-in-270 { --dx: calc(var(--sys) * -0.27);     --dy: 0px; }
  .p-out-0   { --dx: 0px;                          --dy: calc(var(--sys) * -0.46); }
  .p-out-36  { --dx: calc(var(--sys) * 0.270);     --dy: calc(var(--sys) * -0.372); }
  .p-out-72  { --dx: calc(var(--sys) * 0.437);     --dy: calc(var(--sys) * -0.142); }
  .p-out-108 { --dx: calc(var(--sys) * 0.437);     --dy: calc(var(--sys) * 0.142); }
  .p-out-144 { --dx: calc(var(--sys) * 0.270);     --dy: calc(var(--sys) * 0.372); }
  .p-out-180 { --dx: 0px;                          --dy: calc(var(--sys) * 0.46); }
  .p-out-216 { --dx: calc(var(--sys) * -0.270);    --dy: calc(var(--sys) * 0.372); }
  .p-out-252 { --dx: calc(var(--sys) * -0.437);    --dy: calc(var(--sys) * 0.142); }
  .p-out-288 { --dx: calc(var(--sys) * -0.437);    --dy: calc(var(--sys) * -0.142); }
  .p-out-324 { --dx: calc(var(--sys) * -0.270);    --dy: calc(var(--sys) * -0.372); }

  /* Tarjeta de cada nodo */
  .oo-card { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 9px; width: 100%; cursor: pointer; transition: transform 0.4s cubic-bezier(0.22,1,0.36,1); }
  .oo-card:hover { transform: translateY(-5px); }
  .oo-ic { width: var(--oo-ic); height: var(--oo-ic); border-radius: 30%; display: flex; align-items: center; justify-content: center; background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6); transition: background-color var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease), transform var(--rd-dur) var(--rd-ease); }
  .oo-ic .ms { font-size: calc(var(--oo-ic) * 0.5); color: var(--rd-purple); }
  .oo-card:hover .oo-ic { transform: scale(1.06); box-shadow: 0 16px 30px -14px rgba(84,45,227,0.7); }
  .oo-benefit:hover .oo-ic { background: var(--rd-mint-tint); box-shadow: var(--rd-shadow-mint); }
  .oo-lbl { font-size: clamp(10.5px, calc(var(--sys) * 0.0205), 13px); font-weight: 600; color: var(--rd-ink); line-height: 1.28; }
  .oo-sub { display: block; font-weight: 500; color: var(--rd-ink-faint); font-size: 0.85em; margin-top: 1px; }

  /* Núcleo */
  .oo-core { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 9px; cursor: pointer; z-index: 3; text-align: center; }
  /* Núcleo = pieza FIRMA: la "O" mint y la "O" morada convergen en un solo orbe (la alianza). */
  .oo-core-orb { --c: clamp(100px, calc(var(--sys) * 0.205), 150px); width: var(--c); height: var(--c); border-radius: 50%; background: radial-gradient(circle at 34% 30%, var(--rd-mint) 0%, #16D9B8 38%, var(--rd-purple) 100%); display: flex; align-items: center; justify-content: center; box-shadow: 0 24px 60px -18px rgba(84,45,227,0.55), inset 0 6px 20px rgba(255,255,255,0.3); animation: oo-core-pulse 3.6s ease-in-out infinite; transition: transform var(--rd-dur-slow) var(--rd-ease); }
  .oo-core:hover .oo-core-orb { transform: scale(1.05); }
  .oo-core-ic { font-size: calc(var(--sys) * 0.072); color: #fff; }
  .oo-core-logo { width: 48%; height: auto; display: block; filter: brightness(0) invert(1); }
  .oo-core-lbl { font-size: clamp(11px, calc(var(--sys) * 0.021), 14px); font-weight: 700; color: var(--rd-purple); }

  /* ===== Solución — coreografía de scroll: orbe (izq) + beneficios (der) ===== */
  @media (min-width: 901px) {
    section#solucion .oo-orbit-wrap { --sys: clamp(280px, min(46vw, 56vh), 520px); }
  }
  .oo-sol-row {
    display: flex; align-items: center; justify-content: center;
    gap: 60px; width: 100%; max-width: 1180px; margin: 0 auto;
    will-change: transform; transition: transform 0.12s linear;
  }
  .oo-sol-left { display: flex; flex-direction: column; align-items: center; gap: clamp(18px, 3vh, 38px); flex: none; }
  .oo-sol-head { text-align: center; }
  .oo-sol-title {
    font-family: var(--rd-font);
    font-size: var(--rd-text-xl); line-height: 1.12; letter-spacing: var(--rd-tracking-tight);
    font-weight: 600; margin: 0 auto; color: var(--rd-ink); max-width: 15em; text-wrap: balance;
  }
  .oo-sol-accent { color: var(--rd-purple); }
  /* Panel derecho — inventario de capacidades, en diálogo visual con el orbe (mismos chips suaves, todo centrado) */
  .oo-sol-right {
    width: 396px; flex: none; text-align: center;
    background: var(--rd-surface); border-radius: var(--rd-r-lg);
    padding: 26px 24px 28px;
    box-shadow: var(--rd-shadow-card);
  }
  .oo-sol-rlabel {
    font-family: var(--rd-font);
    font-size: var(--rd-text-xs); font-weight: 700; text-transform: uppercase;
    letter-spacing: var(--rd-tracking-label); color: var(--rd-purple);
    text-align: center; margin-bottom: 18px;
  }
  .oo-sol-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; align-items: start; }
  .oo-cap {
    display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
    gap: 7px; text-align: center;
    will-change: transform, opacity;
    transition: opacity 0.14s linear, transform 0.14s linear;
  }
  .oo-cap-ic {
    width: 34px; height: 34px; border-radius: 30%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    background: var(--rd-purple-tint); box-shadow: 0 9px 20px -15px rgba(84,45,227,0.6);
    transition: background-color var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease), transform var(--rd-dur) var(--rd-ease);
  }
  .oo-cap-ic .ms { font-size: 19px; color: var(--rd-purple); }
  .oo-cap-lbl { font-size: 12.5px; font-weight: 500; color: var(--rd-ink); line-height: 1.24; letter-spacing: -0.005em; }
  @media (hover: hover) and (pointer: fine) {
    .oo-cap:not(.oo-cap-hl):hover .oo-cap-ic { transform: translateY(-3px); background: var(--rd-mint-tint); box-shadow: 0 13px 24px -14px rgba(16,244,174,0.5); }
  }
  /* Capacidad protagonista — Modelo Colaborativo: el corazón del modelo OpenOne, único acento verde */
  .oo-cap-hl {
    grid-column: 1 / -1; flex-direction: row; justify-content: center; gap: 13px;
    background: var(--rd-purple); border-radius: var(--rd-r-btn); padding: 13px 20px; margin-bottom: 3px;
    box-shadow: 0 22px 46px -22px rgba(84,45,227,0.7);
  }
  .oo-cap-hl .oo-cap-ic { width: 40px; height: 40px; background: var(--rd-mint); box-shadow: var(--rd-shadow-mint); }
  .oo-cap-hl .oo-cap-ic .ms { color: var(--rd-mint-ink); font-size: 23px; }
  .oo-cap-hl .oo-cap-lbl { color: #fff; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }
  @media (hover: hover) and (pointer: fine) {
    .oo-cap-hl:hover .oo-cap-ic { transform: translateY(-3px); box-shadow: 0 14px 26px -12px rgba(16,244,174,0.8); }
  }
  /* Panel de detalle de nodo — tarjeta lila, todo centrado y en Funnel Display.
     Entra con fade + micro-desplazamiento preservando el centrado horizontal. */
  @keyframes oo-panel-in {
    from { opacity: 0; transform: translateX(-50%) translateY(12px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
  }
  .oo-sol-panel {
    position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%);
    width: calc(100% - 64px); max-width: 560px;
    padding: 26px 30px 28px; background: var(--rd-purple-tint-2);
    border-radius: var(--rd-r-lg);
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
    box-shadow: var(--rd-shadow-card);
    z-index: 30; animation: oo-panel-in var(--rd-dur-slow) var(--rd-ease) both;
  }
  .oo-sol-panel__ic {
    width: 50px; height: 50px; border-radius: 30%; margin-bottom: 8px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 24px; line-height: 1;
    background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
  }
  .oo-sol-panel__kind {
    font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 700;
    text-transform: uppercase; letter-spacing: var(--rd-tracking-label); color: var(--rd-purple);
  }
  .oo-sol-panel__title {
    font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); line-height: 1.16;
  }
  .oo-sol-panel__desc {
    font-family: var(--rd-font); font-size: var(--rd-text-sm); line-height: 1.55;
    color: var(--rd-ink-soft); margin: 4px auto 0; max-width: 46ch;
  }
  .oo-sol-panel__close {
    position: absolute; top: 12px; right: 14px; width: 30px; height: 30px; border-radius: 50%;
    background: transparent; border: none; color: var(--rd-ink-faint); font-size: 19px; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    transition: background-color var(--rd-dur) var(--rd-ease), color var(--rd-dur) var(--rd-ease), transform var(--rd-dur-fast) var(--rd-ease);
  }
  @media (hover: hover) and (pointer: fine) {
    .oo-sol-panel__close:hover { background: var(--rd-ink); color: #fff; }
  }
  .oo-sol-panel__close:active { transform: scale(0.94); }

  /* ============================================================================
     === VISIÓN — problema ⇢ solución (pin de convergencia) =====================
     El problema del mercado se plantea centrado; al hacer scroll converge a la
     izquierda y emerge la card profunda OpenOne (la solución). Reutiliza tokens
     rd-*; el movimiento lo dirige el runtime (solReveal) vía estilos inline.
     ============================================================================ */
  .rd-vision { max-width: 1180px; margin: 0 auto; width: 100%; }
  .rd-vision__grid { position: relative; display: grid; grid-template-columns: 1fr 1fr;
    gap: clamp(24px, 4vw, 56px); align-items: center; }
  .rd-vision__prob { display: flex; flex-direction: column; align-items: center; text-align: center; }
  .rd-vision__tag { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.04;
    letter-spacing: var(--rd-tracking-tight); font-weight: 700; color: var(--rd-ink);
    margin: 14px 0 0; max-width: 15ch; text-wrap: balance; }
  .rd-vision__lead { font-size: var(--rd-text-lg); line-height: 1.42; color: var(--rd-ink-soft);
    font-weight: 500; margin: 18px auto 26px; max-width: 34ch; }
  .rd-vision__needs-label { margin-bottom: 16px; }
  .rd-vision__needs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; max-width: 440px; }
  .rd-vision__need { font-family: var(--rd-font); font-size: var(--rd-text-sm); font-weight: 600;
    color: var(--rd-ink); background: var(--rd-purple-tint-2); border-radius: var(--rd-r-sm);
    padding: 13px 12px; text-align: center; line-height: 1.25; }

  .rd-vision__sol { display: flex; align-items: center; }
  .rd-vision__card { position: relative; overflow: hidden; width: 100%; text-align: center;
    background: linear-gradient(150deg, var(--rd-deep-1), var(--rd-deep-2));
    border-radius: var(--rd-r-lg); padding: clamp(30px, 3.6vw, 52px); color: #fff;
    box-shadow: 0 40px 90px -50px rgba(84,45,227,0.72); }
  /* Realce interior superior — luz sólida, no glow decorativo (da volumen a la card) */
  .rd-vision__card::before { content: ""; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(180deg, rgba(169,139,255,0.14), rgba(169,139,255,0) 42%); }
  .rd-vision__sol-label { color: var(--rd-purple-300); margin-bottom: 18px; display: inline-block;
    position: relative; z-index: 2; }
  .rd-vision__wordmark { font-family: var(--rd-font); font-size: var(--rd-text-2xl); font-weight: 800;
    letter-spacing: -0.02em; margin-bottom: 20px; position: relative; z-index: 2; }
  .rd-vision__wordmark .o1 { color: #fff; }
  .rd-vision__wordmark .o2 { color: var(--rd-purple-300); font-style: italic; }
  .rd-vision__bridge { font-size: var(--rd-text-lg); line-height: 1.42; color: #fff; font-weight: 400;
    margin: 0; min-height: 4.6em; position: relative; z-index: 2; }
  .rd-vision__caret { display: inline-block; width: 3px; color: var(--rd-mint); font-weight: 400; }

  /* ============================================================================
     === SECTORES — una alianza por industria ==================================
     Título + 4 tabs (hover/click) → detalle de la alianza + franja de cierre.
     Todo centrado; sin líneas separadoras. La tab activa es la pieza de audacia:
     card morada con tile mint de "activación".
     ============================================================================ */
  .rd-sectors { max-width: 1200px; margin: 0 auto; width: 100%; }
  .rd-sectors__head { margin-bottom: clamp(28px, 4vw, 44px); }
  .rd-sectors__title { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.06;
    letter-spacing: var(--rd-tracking-tight); font-weight: 700; color: var(--rd-ink);
    margin: 12px auto 0; max-width: 22ch; text-wrap: balance; }

  .rd-sectors__tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 22px; }
  .rd-sector-tab { font-family: var(--rd-font); display: flex; flex-direction: column; align-items: center;
    text-align: center; gap: 13px; padding: 24px 16px; background: var(--rd-surface); border: none;
    border-radius: var(--rd-r-md); box-shadow: var(--rd-shadow-card); cursor: pointer;
    transition: transform var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease),
      background-color var(--rd-dur) var(--rd-ease); }
  .rd-sector-tab__tile { width: 54px; height: 54px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; font-size: 27px; line-height: 1; color: var(--rd-purple);
    background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
    transition: transform var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease),
      box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-sector-tab__kind { color: var(--rd-purple); }
  .rd-sector-tab__name { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); line-height: 1.1; }
  @media (hover: hover) and (pointer: fine) {
    .rd-sector-tab:hover { transform: translateY(-3px); box-shadow: 0 1px 2px rgba(14,11,34,0.05), 0 30px 66px -34px rgba(84,45,227,0.4); }
    .rd-sector-tab:hover .rd-sector-tab__tile { transform: scale(1.06); }
  }
  .rd-sector-tab:active { transform: scale(0.98); }
  .rd-sector-tab.is-active { background: linear-gradient(135deg, var(--rd-purple), var(--rd-purple-700));
    box-shadow: var(--rd-shadow-cta); transform: translateY(-3px); }
  .rd-sector-tab.is-active .rd-sector-tab__tile { background: var(--rd-mint); color: var(--rd-mint-ink);
    box-shadow: var(--rd-shadow-mint); }
  .rd-sector-tab.is-active .rd-sector-tab__kind { color: rgba(255,255,255,0.72); }
  .rd-sector-tab.is-active .rd-sector-tab__name { color: #fff; }

  .rd-sector-detail { background: var(--rd-surface); border-radius: var(--rd-r-lg);
    box-shadow: var(--rd-shadow-card); padding: clamp(30px, 3.4vw, 46px); }
  .rd-sector-detail__ic { width: 66px; height: 66px; border-radius: 30%; margin: 0 auto 4px;
    display: flex; align-items: center; justify-content: center; font-size: 33px; line-height: 1;
    color: var(--rd-purple); background: var(--rd-purple-tint); box-shadow: 0 14px 30px -18px rgba(84,45,227,0.6); }
  .rd-sector-detail__name { font-family: var(--rd-font); font-size: var(--rd-text-xl); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); margin: 12px 0 0; line-height: 1.1; }
  .rd-sector-detail__cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 64px);
    margin: 28px auto 0; max-width: 720px; }
  .rd-sector-detail__col { display: flex; flex-direction: column; align-items: center; text-align: center; }
  .rd-sector-detail__collabel { margin-bottom: 16px; }
  .rd-sector-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;
    gap: 11px; width: 100%; }
  .rd-sector-list li { font-family: var(--rd-font); font-size: var(--rd-text-base); font-weight: 600;
    color: var(--rd-ink); line-height: 1.3; }

  .rd-sectors__closing { margin-top: 24px; background: var(--rd-purple-tint-2); border-radius: var(--rd-r-lg);
    padding: clamp(28px, 3.4vw, 40px); display: flex; flex-direction: column; align-items: center; gap: 24px; }
  .rd-sectors__closing-head { max-width: 48ch; }
  .rd-sectors__closing-title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-purple); line-height: 1.16; }
  .rd-sectors__closing-text { font-size: var(--rd-text-sm); color: var(--rd-ink-soft); line-height: 1.5; margin-top: 8px; }
  .rd-sectors__benefits { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; width: 100%; }
  .rd-bchip { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
  .rd-bchip__tile { width: 48px; height: 48px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; font-size: 23px; line-height: 1; color: var(--rd-purple);
    background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
    transition: transform var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease),
      box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-bchip__lbl { font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 600;
    color: var(--rd-ink); line-height: 1.25; }
  @media (hover: hover) and (pointer: fine) {
    .rd-bchip:hover .rd-bchip__tile { transform: translateY(-3px); background: var(--rd-mint-tint);
      box-shadow: var(--rd-shadow-mint); }
  }

  /* Responsive rediseño Visión + Sectores */
  @media (max-width: 900px) {
    .rd-vision__grid { grid-template-columns: 1fr; gap: 34px; }
    .rd-vision__needs { max-width: 360px; margin: 0 auto; }
    .rd-sectors__tabs { grid-template-columns: repeat(2, 1fr); }
    .rd-sector-detail__cols { grid-template-columns: 1fr; gap: 30px; }
    .rd-sectors__benefits { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 520px) {
    .rd-sectors__benefits { grid-template-columns: repeat(2, 1fr); }
  }

  /* ============================================================================
     === MODELOS — modelos de alianza (timeline pinneado) =======================
     Título + selector de modelos (los modNodes del runtime, como pasos centrados)
     → tarjeta de convergencia: lo que aporta opencard + lo que aporta el aliado,
     unidos por un nodo "+" central (la alianza). Observación como chip lila.
     Todo centrado; sin líneas separadoras. El scroll (pin) avanza el modelo activo.
     ============================================================================ */
  .rd-models { max-width: 1120px; margin: 0 auto; width: 100%;
    display: flex; flex-direction: column; align-items: center; gap: clamp(22px, 3.4vh, 40px); }
  .rd-models__title { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.06;
    letter-spacing: var(--rd-tracking-tight); font-weight: 700; color: var(--rd-ink);
    margin: 0 auto; max-width: 26ch; text-wrap: balance; }

  /* Selector = los modNodes como pasos centrados (reusa n.circleStyle / n.labelStyle) */
  .rd-models__steps { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
  .rd-model-step { font-family: var(--rd-font); display: flex; align-items: center; gap: 14px;
    padding: 12px 22px 12px 14px; background: var(--rd-surface); border: none; border-radius: var(--rd-r-md);
    box-shadow: var(--rd-shadow-card); cursor: pointer;
    transition: transform var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-model-step__txt { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; text-align: left; }
  .rd-model-step__badge { font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 700;
    text-transform: uppercase; letter-spacing: var(--rd-tracking-label); }
  .rd-model-step__title { font-family: var(--rd-font); font-size: var(--rd-text-sm); line-height: 1.16;
    letter-spacing: -0.01em; max-width: 20ch; }
  @media (hover: hover) and (pointer: fine) {
    .rd-model-step:hover { transform: translateY(-2px);
      box-shadow: 0 1px 2px rgba(14,11,34,0.05), 0 30px 66px -34px rgba(84,45,227,0.4); }
  }
  .rd-model-step:active { transform: scale(0.98); }

  /* Progreso del recorrido (modLineFillPx: 0→100px sobre la última posición) */
  .rd-models__progress { width: 100px; height: 5px; border-radius: 999px;
    background: var(--rd-purple-tint); overflow: hidden; }
  .rd-models__progress-fill { height: 100%; border-radius: 999px; background: var(--rd-mint);
    box-shadow: var(--rd-shadow-mint); transition: width var(--rd-dur-slow) var(--rd-ease); }

  /* Tarjeta de convergencia */
  .rd-model-card { width: 100%; max-width: 940px; margin: 0 auto; }
  .rd-model-card__head { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 30px; }
  .rd-model-tile { width: 66px; height: 66px; border-radius: 30%; flex-shrink: 0; display: flex;
    align-items: center; justify-content: center; font-size: 31px; line-height: 1; color: #fff;
    background: linear-gradient(135deg, var(--rd-purple), var(--rd-purple-700));
    box-shadow: 0 16px 34px -16px rgba(84,45,227,0.6); }
  .rd-model-card__meta { display: inline-flex; align-items: center; gap: 12px; }
  .rd-model-card__tag { font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.1em; color: var(--rd-mint-ink);
    background: var(--rd-mint-tint); padding: 4px 11px; border-radius: var(--rd-r-sm); }
  .rd-model-card__title { font-family: var(--rd-font); font-size: var(--rd-text-xl); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); line-height: 1.12;
    margin: 0 auto; max-width: 22ch; text-wrap: balance; }

  .rd-model-conv { display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(18px, 3vw, 40px);
    align-items: start; max-width: 780px; margin: 0 auto; }
  .rd-model-conv__col { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
  .rd-model-conv__collabel { display: flex; align-items: center; justify-content: center; min-height: 22px; }
  .rd-model-conv__collabel img { height: 20px; width: auto; display: block; }
  .rd-model-conv__collabel span { font-family: var(--rd-font); font-size: var(--rd-text-base);
    font-weight: 700; letter-spacing: -0.01em; color: var(--rd-ink); }
  .rd-model-conv__list { display: flex; flex-direction: column; gap: 12px; width: 100%; align-items: center; }
  .rd-model-conv__item { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
  .rd-model-conv__item-tile { width: 42px; height: 42px; border-radius: 30%; flex-shrink: 0; display: flex;
    align-items: center; justify-content: center; font-size: 20px; line-height: 1; color: var(--rd-purple);
    background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
    transition: transform var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease),
      box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-model-conv__item-lbl { font-family: var(--rd-font); font-size: var(--rd-text-sm); font-weight: 600;
    color: var(--rd-ink); line-height: 1.28; max-width: 18ch; }
  @media (hover: hover) and (pointer: fine) {
    .rd-model-conv__item:hover .rd-model-conv__item-tile { transform: translateY(-3px);
      background: var(--rd-mint-tint); box-shadow: var(--rd-shadow-mint); }
  }
  /* Nodo "+" central: las dos aportaciones convergen (la alianza) */
  .rd-model-conv__plus { align-self: center; justify-self: center; margin: 0 auto; width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 30px; font-weight: 300; line-height: 1;
    color: var(--rd-purple); background: var(--rd-surface);
    box-shadow: 0 14px 30px -14px rgba(84,45,227,0.55), inset 0 0 0 1px var(--rd-purple-tint); }

  /* Observación — chip lila centrado (sin borde punteado / sin línea) */
  .rd-model-note { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
    max-width: 640px; margin: 26px auto 0; padding: 20px 26px; background: var(--rd-purple-tint-2);
    border-radius: var(--rd-r-md); }
  .rd-model-note__ic { width: 40px; height: 40px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; background: var(--rd-surface); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.55); }
  .rd-model-note__ic .ms { color: var(--rd-purple); font-size: 21px; }
  .rd-model-note__txt { font-family: var(--rd-font); font-size: var(--rd-text-sm); line-height: 1.5;
    color: var(--rd-ink-soft); max-width: 52ch; }
  .rd-model-note__txt strong { color: var(--rd-ink); font-weight: 700; }

  /* Móvil — modelos apilados */
  .rd-models__mobile { max-width: 480px; margin: 0 auto; width: 100%;
    display: flex; flex-direction: column; align-items: center; gap: 18px; }
  .rd-models__mobile .rd-model-card__head { margin-bottom: 22px; }

  @media (max-width: 720px) {
    .rd-model-conv { grid-template-columns: 1fr; gap: 26px; max-width: 340px; }
    .rd-model-conv__plus { transform: rotate(0deg); }
    .rd-model-step { padding: 11px 18px 11px 12px; }
    .rd-model-step__title { display: none; }
  }

  /* ============================================================================
     === CASO — JurisOne (la fórmula OpenOne aplicada) ==========================
     Ecuación firma (opencard + aliado = OpenOne) → subtítulo → dos paneles
     (capacidades implementadas / beneficios obtenidos) → cierre narrativo.
     Todo centrado; sin líneas. Panel de beneficios en superficie profunda.
     ============================================================================ */
  .rd-caso { max-width: 1120px; margin: 0 auto; width: 100%;
    display: flex; flex-direction: column; align-items: center; gap: clamp(22px, 3.2vh, 38px); }
  .rd-caso__eq { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.05;
    letter-spacing: var(--rd-tracking-tight); font-weight: 600; color: var(--rd-ink);
    margin: 0; display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px; }
  .rd-caso__eq img { height: 0.62em; width: auto; vertical-align: middle; }
  .rd-caso__eq-op { color: var(--rd-ink-faint); font-weight: 300; margin: 0 14px; }
  .rd-caso__eq-ally { font-weight: 500; color: var(--rd-ink-soft); font-size: 0.82em; }
  .rd-caso__eq-wm { color: var(--rd-purple); font-weight: 800; letter-spacing: -0.02em; }
  .rd-caso__eq-wm i { font-style: italic; }
  .rd-caso__lead { font-family: var(--rd-font); font-size: var(--rd-text-lg); line-height: 1.42;
    color: var(--rd-ink-soft); font-weight: 500; margin: -6px auto 4px; max-width: 44ch; }

  .rd-caso__panels { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; width: 100%; align-items: stretch; }
  .rd-caso__panel { text-align: center; display: flex; flex-direction: column; align-items: center; }
  .rd-caso__panel-label { margin-bottom: 22px; }
  .rd-caso__panel-label--light { color: var(--rd-purple-300); }
  .rd-caso__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 18px; width: 100%; align-content: start; }
  .rd-caso__item { display: flex; flex-direction: column; align-items: center; gap: 9px; text-align: center; }
  .rd-caso__item-tile { width: 46px; height: 46px; border-radius: 30%; flex-shrink: 0; display: flex;
    align-items: center; justify-content: center; font-size: 22px; line-height: 1; color: var(--rd-purple);
    background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
    transition: transform var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease),
      box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-caso__item-lbl { font-family: var(--rd-font); font-size: var(--rd-text-sm); font-weight: 600;
    color: var(--rd-ink); line-height: 1.28; max-width: 16ch; }
  @media (hover: hover) and (pointer: fine) {
    .rd-caso__item:hover .rd-caso__item-tile { transform: translateY(-3px);
      background: var(--rd-mint-tint); box-shadow: var(--rd-shadow-mint); }
  }
  /* Panel profundo (beneficios): tiles translúcidos, texto claro */
  .rd-caso__panel--deep .rd-caso__item-tile { background: rgba(255,255,255,0.08); color: var(--rd-purple-300);
    box-shadow: none; }
  .rd-caso__panel--deep .rd-caso__item-lbl { color: rgba(255,255,255,0.9); }
  @media (hover: hover) and (pointer: fine) {
    .rd-caso__panel--deep .rd-caso__item:hover .rd-caso__item-tile { background: var(--rd-mint);
      color: var(--rd-mint-ink); box-shadow: var(--rd-shadow-mint); }
  }

  @media (max-width: 820px) {
    .rd-caso__panels { grid-template-columns: 1fr; }
    .rd-caso__grid { gap: 20px 16px; }
  }
  @media (max-width: 420px) {
    .rd-caso__grid { grid-template-columns: 1fr 1fr; }
  }

  /* ============================================================================
     === ALIANZA — la ecuación firma (opencard + aliado = resultado) ============
     "Una alianza OpenOne NO es proveedor-cliente": lo que aporta cada parte
     converge en un resultado. Tres tarjetas rd-* unidas por operadores (+ , =);
     el resultado es la pieza de audacia (superficie profunda). Todo centrado.
     ============================================================================ */
  .rd-alianza { max-width: 1200px; margin: 0 auto; width: 100%;
    display: flex; flex-direction: column; align-items: center; gap: clamp(34px, 5vw, 56px); }
  .rd-alianza__head { display: flex; flex-direction: column; align-items: center; text-align: center; }
  .rd-alianza__title { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.05;
    letter-spacing: var(--rd-tracking-tight); font-weight: 600; color: var(--rd-ink);
    margin: 12px auto 0; max-width: 20ch; text-wrap: balance; }
  .rd-alianza__title .rd-alianza__no { font-weight: 800; }
  .rd-alianza__title .rd-alianza__em { color: var(--rd-purple); }
  .rd-alianza__lead { font-family: var(--rd-font); font-size: var(--rd-text-lg); line-height: 1.42;
    color: var(--rd-ink-soft); font-weight: 500; margin: 18px auto 0; max-width: 42ch; }

  .rd-alianza__eq { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: clamp(12px, 2vw, 22px); align-items: stretch; width: 100%; }
  .rd-alianza__card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; }
  .rd-alianza__brand { display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 12px; min-height: 34px; }
  .rd-alianza__brand img { height: 24px; width: auto; display: block; }
  .rd-alianza__brand-tile { width: 48px; height: 48px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6); }
  .rd-alianza__brand-tile .ms { color: var(--rd-purple); font-size: 24px; }
  .rd-alianza__brand-name { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); }
  .rd-alianza__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;
    gap: 12px; width: 100%; align-items: center; }
  .rd-alianza__list li { font-family: var(--rd-font); font-size: var(--rd-text-base); font-weight: 600;
    color: var(--rd-ink); line-height: 1.3; }
  .rd-alianza__op { display: flex; align-items: center; justify-content: center; }
  .rd-alianza__op-plus { width: 52px; height: 52px; border-radius: 50%; background: var(--rd-surface);
    display: flex; align-items: center; justify-content: center; color: var(--rd-purple);
    font-size: 30px; font-weight: 300; line-height: 1;
    box-shadow: 0 14px 30px -14px rgba(84,45,227,0.55), inset 0 0 0 1px var(--rd-purple-tint); }
  .rd-alianza__op-eq { display: flex; flex-direction: column; gap: 6px; }
  .rd-alianza__op-eq span { width: 22px; height: 3px; border-radius: 2px; background: var(--rd-purple); }
  /* Resultado — superficie profunda: la pieza de audacia del bloque */
  .rd-alianza__card--result { gap: 14px; }
  .rd-alianza__result-tile { width: 48px; height: 48px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; background: rgba(255,255,255,0.10); }
  .rd-alianza__result-tile .ms { color: #fff; font-size: 24px; }
  .rd-alianza__result-label { color: var(--rd-purple-300); }
  .rd-alianza__result-title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); line-height: 1.14; }
  .rd-alianza__result-text { font-family: var(--rd-font); font-size: var(--rd-text-sm); line-height: 1.5;
    color: rgba(255,255,255,0.82); margin: 0; }
  @media (max-width: 900px) {
    .rd-alianza__eq { grid-template-columns: 1fr; gap: 16px; }
    .rd-alianza__op-eq { flex-direction: row; }
  }

  /* ============================================================================
     === PLAYBOOK — hoja de ruta (reskin rd-*, coreografía intacta) =============
     Sección pinneada: capa INTRO (5 tarjetas + cierre) hace cross-fade a la capa
     FASES (rail + detalle). El runtime dirige el movimiento (pbShowIntro,
     pbIntroStyle/pbPhasesStyle, activeFase, pbLineFillPx). Aquí SOLO el lenguaje
     visual: tarjetas rd-*, tiles lila, labels Funnel, tokens de color.
     ============================================================================ */
  .rd-pb-title { font-family: var(--rd-font); font-size: clamp(28px, 3vw, 44px); line-height: 1.06;
    letter-spacing: var(--rd-tracking-tight); font-weight: 600; margin: 0; color: var(--rd-ink); text-wrap: balance; }
  .rd-pb-accent { color: var(--rd-purple); }
  .rd-pb-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
  .rd-pb-card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 13px;
    background: var(--rd-surface); border-radius: var(--rd-r-md); box-shadow: var(--rd-shadow-card);
    padding: 28px 20px 30px; }
  .rd-pb-card__tile { width: 52px; height: 52px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; font-size: 26px; line-height: 1; color: var(--rd-purple);
    background: var(--rd-purple-tint); box-shadow: 0 10px 24px -16px rgba(84,45,227,0.6);
    transition: transform var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease),
      box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-pb-card__title { font-family: var(--rd-font); font-size: var(--rd-text-base); font-weight: 700;
    color: var(--rd-purple); line-height: 1.2; letter-spacing: -0.01em; }
  .rd-pb-card__text { font-family: var(--rd-font); font-size: var(--rd-text-sm); font-weight: 500;
    color: var(--rd-ink-soft); line-height: 1.5; }
  @media (hover: hover) and (pointer: fine) {
    .rd-pb-card:hover .rd-pb-card__tile { transform: translateY(-3px); background: var(--rd-mint-tint);
      box-shadow: var(--rd-shadow-mint); }
  }
  .rd-pb-closing { max-width: 1000px; margin: 6px auto 0; padding: clamp(28px, 3vw, 36px) clamp(24px, 3vw, 40px);
    background: var(--rd-purple-tint-2); border-radius: var(--rd-r-lg);
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
  .rd-pb-closing__tile { width: 48px; height: 48px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; background: var(--rd-surface); box-shadow: 0 12px 26px -18px rgba(84,45,227,0.6); }
  .rd-pb-closing__tile .ms { color: var(--rd-purple); font-size: 24px; }
  .rd-pb-closing__text { font-family: var(--rd-font); font-size: var(--rd-text-lg); line-height: 1.55;
    margin: 0; color: var(--rd-ink); max-width: 78ch; font-weight: 500; }

  /* Rail de fases */
  .rd-pb-rail { position: relative; }
  .rd-pb-rail__track { position: absolute; left: 27px; top: 50px; width: 2px; height: 300px; border-radius: 2px;
    background: rgba(84,45,227,0.16); }
  .rd-pb-rail__fill { position: absolute; left: 27px; top: 50px; width: 2px; border-radius: 2px;
    background: linear-gradient(180deg, var(--rd-purple), var(--rd-purple-300));
    box-shadow: 0 0 12px rgba(84,45,227,0.5); transition: height 0.9s var(--rd-ease); }
  .rd-pb-node { position: relative; display: flex; align-items: center; gap: 18px; cursor: pointer; height: 100px; }
  .rd-pb-node__txt { display: flex; flex-direction: column; gap: 3px; transition: opacity 0.7s ease; }
  .rd-pb-node__eyebrow { font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 700;
    letter-spacing: var(--rd-tracking-label); text-transform: uppercase; }
  .rd-pb-node__label { font-family: var(--rd-font); font-size: var(--rd-text-lg); line-height: 1.2; letter-spacing: -0.01em; }

  /* Detalle de la fase activa */
  .rd-pb-detail { min-height: 380px; }
  .rd-pb-detail__kind { margin-bottom: 12px; }
  .rd-pb-detail__title { font-family: var(--rd-font); font-size: clamp(30px, 3.4vw, 46px); font-weight: 700;
    line-height: 1.08; letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); margin-bottom: 22px; }
  .rd-pb-detail__obj { font-family: var(--rd-font); font-size: var(--rd-text-lg); line-height: 1.5;
    color: var(--rd-ink-soft); margin: 0 auto 36px; max-width: 60ch; }
  .rd-pb-detail__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
  .rd-pb-detail__collabel { margin-bottom: 16px; }
  .rd-pb-detail__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
  .rd-pb-detail__list li { font-family: var(--rd-font); font-size: var(--rd-text-base); line-height: 1.45;
    text-align: center; color: var(--rd-ink-soft); }
  .rd-pb-detail__list--strong li { color: var(--rd-ink); font-weight: 600; }

  /* Playbook móvil (intro apilada + fases) */
  .rd-pb-m { max-width: 1280px; margin: 0 auto; width: 100%; display: flex; flex-direction: column; gap: 16px; }
  .rd-pb-m__cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 6px; }
  .rd-pb-fase { background: var(--rd-surface); border-radius: var(--rd-r-md); box-shadow: var(--rd-shadow-card);
    padding: 24px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; }
  .rd-pb-fase__head { display: flex; flex-direction: column; align-items: center; gap: 10px; }
  .rd-pb-fase__tile { width: 48px; height: 48px; border-radius: 30%; display: flex; align-items: center;
    justify-content: center; font-size: 22px; color: #fff;
    background: linear-gradient(135deg, var(--rd-purple), var(--rd-purple-700));
    box-shadow: 0 14px 30px -16px rgba(84,45,227,0.6); }
  .rd-pb-fase__kind { font-family: var(--rd-font); font-size: var(--rd-text-xs); font-weight: 700;
    color: var(--rd-ink-faint); text-transform: uppercase; letter-spacing: var(--rd-tracking-label); }
  .rd-pb-fase__title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    color: var(--rd-purple); line-height: 1.15; }
  .rd-pb-fase__obj { font-family: var(--rd-font); font-size: var(--rd-text-sm); line-height: 1.5; color: var(--rd-ink-soft); }
  .rd-pb-fase__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; align-items: center; }
  .rd-pb-fase__list li { font-family: var(--rd-font); font-size: var(--rd-text-sm); color: var(--rd-ink); line-height: 1.4; }
  @media (max-width: 900px) {
    .rd-pb-cards { grid-template-columns: repeat(2, 1fr); }
  }

  /* ============================================================================
     === OBJETIVOS — lo que resuelve OpenOne (4 tarjetas rd-card, centradas) =====
     Reskin rd-*: tile de icono con activación mint al hover; todo centrado,
     sin líneas. Coherente con Sectores / Playbook.
     ============================================================================ */
  .rd-objetivos__inner { display: flex; flex-direction: column; align-items: center; }
  .rd-objetivos__head { display: flex; flex-direction: column; align-items: center; gap: 12px;
    text-align: center; margin-bottom: clamp(32px, 4vw, 52px); }
  .rd-objetivos__title { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.06;
    letter-spacing: var(--rd-tracking-tight); font-weight: 700; color: var(--rd-ink);
    margin: 0; max-width: 24ch; text-wrap: balance; }
  .rd-objetivos__grid { display: grid; grid-template-columns: repeat(4, 1fr);
    gap: clamp(16px, 1.6vw, 22px); width: 100%; }
  .rd-objetivo { display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: 16px; cursor: default;
    transition: transform var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-objetivo__tile { width: 56px; height: 56px; font-size: 26px; }
  .rd-objetivo__title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); margin: 0; line-height: 1.12; }
  .rd-objetivo__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column;
    align-items: center; gap: 9px; width: 100%; }
  .rd-objetivo__list li { font-family: var(--rd-font); font-size: var(--rd-text-sm);
    color: var(--rd-ink-soft); line-height: 1.35; }
  @media (hover: hover) and (pointer: fine) {
    .rd-objetivo:hover { transform: translateY(-4px);
      box-shadow: 0 1px 2px rgba(14,11,34,0.05), 0 34px 70px -34px rgba(84,45,227,0.42); }
    .rd-objetivo:hover .rd-objetivo__tile { background: var(--rd-mint); box-shadow: var(--rd-shadow-mint); }
  }

  /* ============================================================================
     === BENEFICIOS — para nuestros aliados (7 tarjetas rd-card, centradas) ======
     Grilla flexible centrada (última fila queda centrada); tile con activación
     mint al hover. Sin líneas, todo centrado.
     ============================================================================ */
  .rd-beneficios__inner { display: flex; flex-direction: column; align-items: center; }
  .rd-beneficios__head { text-align: center; margin-bottom: clamp(32px, 4vw, 52px); }
  .rd-beneficios__title { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.06;
    letter-spacing: var(--rd-tracking-tight); font-weight: 700; color: var(--rd-ink); margin: 0;
    max-width: 22ch; text-wrap: balance; }
  .rd-beneficios__grid { display: flex; flex-wrap: wrap; justify-content: center;
    gap: clamp(16px, 1.6vw, 22px); width: 100%; }
  .rd-benefit { flex: 0 1 clamp(240px, 22vw, 282px); min-height: 232px; display: flex;
    flex-direction: column; align-items: center; text-align: center; gap: 14px; cursor: default;
    transition: transform var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-benefit__tile { width: 56px; height: 56px; font-size: 26px; }
  .rd-benefit__title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); margin: 0; line-height: 1.14; }
  .rd-benefit__text { font-family: var(--rd-font); font-size: var(--rd-text-sm); color: var(--rd-ink-soft);
    line-height: 1.5; margin: 0; }
  @media (hover: hover) and (pointer: fine) {
    .rd-benefit:hover { transform: translateY(-4px);
      box-shadow: 0 1px 2px rgba(14,11,34,0.05), 0 34px 70px -34px rgba(84,45,227,0.42); }
    .rd-benefit:hover .rd-benefit__tile { background: var(--rd-mint); box-shadow: var(--rd-shadow-mint); }
  }

  /* ============================================================================
     === DATA — poder de la data e hiperpersonalización (superficie profunda) ====
     Fondo oscuro (deep tokens). Pieza firma: el titular con "hiperpersonalización"
     en degradado morado, en UN SOLO RENGLÓN (nowrap, no partir). Tarjetas claras
     rd-card sobre el oscuro; la flecha avanza al hover (activación mint).
     ============================================================================ */
  .rd-data { min-height: 100vh; min-height: 100dvh; display: flex; align-items: center;
    background: linear-gradient(160deg, var(--rd-deep-1) 0%, var(--rd-deep-2) 100%); color: #fff; }
  .rd-data__inner { display: flex; flex-direction: column; align-items: center; }
  .rd-data__title { font-family: var(--rd-font); font-size: clamp(28px, 7vw, 96px); line-height: 1.04;
    letter-spacing: -0.04em; font-weight: 600; color: #fff; text-align: center; text-wrap: balance;
    margin: 0 auto clamp(40px, 6vw, 64px); }
  .rd-data__emph { white-space: nowrap;
    background: linear-gradient(120deg, #B9A3FF 0%, #7A52F0 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent; }
  .rd-data__grid { display: grid; grid-template-columns: repeat(4, 1fr);
    gap: clamp(16px, 1.8vw, 22px); width: 100%; }
  .rd-data-card { display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: 18px; min-height: 208px; cursor: default;
    transition: transform var(--rd-dur) var(--rd-ease), box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-data-card__tile { width: 54px; height: 54px; font-size: 28px; font-weight: 700;
    color: var(--rd-purple); }
  .rd-data-card__label { font-family: var(--rd-font); font-size: var(--rd-text-base); font-weight: 500;
    color: var(--rd-ink-soft); line-height: 1.45; }
  @media (hover: hover) and (pointer: fine) {
    .rd-data-card:hover { transform: translateY(-4px);
      box-shadow: 0 1px 2px rgba(14,11,34,0.06), 0 40px 80px -34px rgba(0,0,0,0.7); }
    .rd-data-card:hover .rd-data-card__tile { background: var(--rd-mint); box-shadow: var(--rd-shadow-mint);
      transform: translateX(3px); }
  }

  /* ============================================================================
     === CONTACTO — cierre de alianza + formulario ==============================
     Pieza de cierre. El mensaje final va centrado arriba; "finalLine2" en degradado
     morado itálico es la firma de convergencia (único gesto audaz). Debajo, el
     formulario en una rd-card centrada y estrecha: campos rd-field sobre superficie
     lila, foco morado con halo suave; el estado "enviado" activa el acento mint
     (activación, con moderación). Todo centrado, sin líneas.
     ============================================================================ */
  .rd-contacto { overflow: hidden; }
  .rd-contacto__inner { display: flex; flex-direction: column; align-items: center; }
  .rd-contacto__head { display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: 20px; margin-bottom: clamp(36px, 5vw, 56px); }
  .rd-contacto__title { font-family: var(--rd-font); font-size: var(--rd-text-2xl); line-height: 1.06;
    letter-spacing: var(--rd-tracking-tight); font-weight: 600; color: var(--rd-ink); margin: 0;
    max-width: 20ch; text-wrap: balance; }
  .rd-contacto__emph { background: linear-gradient(120deg, #7A52F0 0%, var(--rd-purple) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent; font-style: italic;
    padding-inline: 0.12em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
  .rd-contacto__lead { font-family: var(--rd-font); font-size: var(--rd-text-base); line-height: 1.55;
    color: var(--rd-ink-soft); margin: 0; max-width: 54ch; }

  .rd-contacto__card { width: 100%; max-width: 560px; }
  .rd-contacto__form-head { display: flex; flex-direction: column; align-items: center; gap: 8px;
    margin-bottom: 24px; }
  .rd-contacto__form-title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); margin: 0; }
  .rd-form { display: flex; flex-direction: column; gap: 12px; }
  .rd-field { width: 100%; padding: 14px 16px; font-family: var(--rd-font); font-size: var(--rd-text-sm);
    text-align: center; color: var(--rd-ink); background: var(--rd-purple-tint-2);
    border: 1px solid transparent; border-radius: var(--rd-r-sm); outline: none;
    transition: border-color var(--rd-dur) var(--rd-ease), background-color var(--rd-dur) var(--rd-ease),
      box-shadow var(--rd-dur) var(--rd-ease); }
  .rd-field::placeholder { color: var(--rd-ink-faint); }
  .rd-field:focus { border-color: var(--rd-purple); background: var(--rd-surface);
    box-shadow: 0 0 0 3px rgba(84,45,227,0.14); }
  textarea.rd-field { resize: vertical; min-height: 86px; line-height: 1.5; }
  select.rd-field { text-align-last: center; cursor: pointer;
    appearance: none; -webkit-appearance: none; }
  .rd-form__submit { margin-top: 6px; width: 100%; }
  .rd-form__submit[disabled] { opacity: 0.62; cursor: progress; transform: none; box-shadow: none; }
  .rd-form__note { font-family: var(--rd-font); font-size: var(--rd-text-xs); color: var(--rd-ink-faint);
    text-align: center; margin-top: 2px; }
  .rd-form__error { font-family: var(--rd-font); font-size: var(--rd-text-xs); color: #C63A2A;
    text-align: center; margin-top: 2px; letter-spacing: var(--rd-tracking-tight, 0);
    animation: rd-reveal-in var(--rd-dur) var(--rd-ease) both; }
  @media (hover: hover) and (pointer: fine) {
    .rd-field:hover { border-color: rgba(84,45,227,0.24); }
  }

  /* Estado "enviado" — activación mint (confirmación = activar) */
  .rd-contacto__thanks { display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: 16px; padding: 28px 0;
    animation: rd-reveal-in var(--rd-dur-slow) var(--rd-ease) both; }
  .rd-contacto__thanks-tile { width: 66px; height: 66px; border-radius: 30%; display: flex;
    align-items: center; justify-content: center; font-size: 30px; background: var(--rd-mint);
    color: var(--rd-mint-ink); box-shadow: var(--rd-shadow-mint); }
  .rd-contacto__thanks-title { font-family: var(--rd-font); font-size: var(--rd-text-lg); font-weight: 700;
    letter-spacing: var(--rd-tracking-tight); color: var(--rd-ink); }
  .rd-contacto__thanks-text { font-family: var(--rd-font); font-size: var(--rd-text-sm); line-height: 1.5;
    color: var(--rd-ink-soft); margin: 0; max-width: 34ch; }

  /* ============================================================================
     === FOOTER — cierre de marca (centrado, sin líneas) ========================
     Wordmark OpenOne (One itálica) + firma "Powered by opencard" + copyright.
     ============================================================================ */
  .rd-footer { padding: clamp(40px, 6vw, 64px) var(--rd-section-x) clamp(30px, 4vw, 44px);
    background: transparent; }
  .rd-footer__inner { display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: 14px; }
  .rd-footer__wordmark { font-size: 24px; letter-spacing: -0.02em; }
  .rd-footer__powered { display: flex; align-items: center; gap: 9px; }
  .rd-footer__powered-label { font-family: var(--rd-font); font-size: 10px; letter-spacing: 0.14em;
    text-transform: uppercase; color: var(--rd-ink-faint); }
  .rd-footer__powered img { height: 15px; width: auto; display: block; }
  .rd-footer__copy { font-family: var(--rd-font); font-size: var(--rd-text-xs); letter-spacing: 0.02em;
    color: var(--rd-ink-faint); }

  /* Responsive — Objetivos / Beneficios / Data */
  @media (max-width: 900px) {
    .rd-objetivos__grid { grid-template-columns: repeat(2, 1fr); }
    .rd-data__grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 520px) {
    .rd-objetivos__grid { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }
    .rd-data__grid { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }
    .rd-benefit { flex-basis: 100%; }
  }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
  }

  /* ===== Modelos en UNA sola pantalla (compacto; se cambia de modelo con clic) ===== */
  #modelos { padding: 0 !important; }
  #modelos .rd-models { gap: clamp(14px, 2.2vh, 24px) !important; }
  #modelos .rd-model-card__head { display: none !important; }   /* redundante con el selector de arriba */
  #modelos .rd-model-conv { gap: clamp(20px, 3vw, 44px) !important; }
  #modelos .rd-model-conv__col { gap: 10px !important; }
  #modelos .rd-model-conv__list { gap: 8px !important; }
  #modelos .rd-model-conv__item { gap: 5px !important; }
  #modelos .rd-model-conv__item-tile { width: 38px !important; height: 38px !important; }
  #modelos .rd-model-note { margin-top: 8px !important; }
  /* La tarjeta de modelo siempre visible (la animacion faseInB se colgaba en opacity:0
     al cambiar de modelo por clic, tras quitar el timeline pineado). */
  #modelos .rd-model-card { opacity: 1 !important; transform: none !important; animation: none !important; }