/*
 * Aiden UI · in-view-title (Arc UI, https://uiarc.dev/components/in-view-title) — copia del kit
 * (direccion/diseno/kit/in-view-title/in-view-title.css) para los títulos de sección de aidenstartup.com
 * (WEB-20261014-11; el mismo fichero que aiden.es, WEB-20261014-10). Variantes que usan las webs: blur (títulos de
 * sección) y wipe (llamada final).
 *
 * Diferencias con el kit, todas para no tocar el diseño de la casa:
 *  - El encabezado es el propio título de la web (Sora, su tamaño, su peso, su color y su <em> verde): no se le pone
 *    color de primer plano como al .wrap de Arc, que pisaría el color de cada página.
 *  - Los títulos no viven dentro de .aui-scope, así que las curvas van con su valor de motion-tokens como respaldo.
 *  - Sin forzar prioridades: los estados escondidos y las transiciones solo existen con prefers-reduced-motion: no-preference,
 *    así que con movimiento reducido no hay nada que anular (el JS además los deja visibles al instante).
 * Sin JS no se aplica nada de esto: las clases y data-state solo las pone el script.
 */
.aui-in-view-title { min-width: 0; }
.aui-in-view-title[data-variant="line"], .aui-in-view-title[data-variant="wipe"] { display: flow-root; }
.aui-in-view-title-clip { display: inline-block; overflow: hidden; vertical-align: top; padding: .08em .14em .2em; margin: -.08em -.14em -.2em; }
.aui-in-view-title-line-clip { display: block; overflow: hidden; padding: .06em .12em .18em; margin: -.06em -.12em -.18em; }
.aui-in-view-title-line-clip + .aui-in-view-title-line-clip { margin-top: -.24em; }
.aui-in-view-title-clip > span, .aui-in-view-title-line-clip > span, .aui-in-view-title-blur-word, .aui-in-view-title-track-word, .aui-in-view-title-track-word > span { display: inline-block; }
.aui-in-view-title-track-word { white-space: nowrap; }
.aui-in-view-title-wipe { display: block; padding: .1em .12em .22em; margin: -.1em -.12em -.22em; }

@media (prefers-reduced-motion: no-preference) {
  /* La máscara del barrido mide 2,3 veces el título con el centro difuminado: el borde suave queda fuera del título
     en los dos extremos del recorrido. */
  .aui-in-view-title-wipe { -webkit-mask-image: linear-gradient(90deg, #000 44%, transparent 56%); mask-image: linear-gradient(90deg, #000 44%, transparent 56%); -webkit-mask-size: 230% 100%; mask-size: 230% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: var(--wipe, 0%) 0; mask-position: var(--wipe, 0%) 0; }

  /* Entrada (reveal() de Arc): posición en --s con ease.enter, desenfoque en --s × .78, opacidad en --s × .56 con
     ease.standard; el barrido usa ease.standard. --d es el retraso de cada pieza. */
  .aui-in-view-title-part {
    transition:
      transform var(--s, .8s) var(--ease-enter, cubic-bezier(.16,1,.3,1)) var(--d, 0s),
      filter calc(var(--s, .8s) * .78) var(--ease-enter, cubic-bezier(.16,1,.3,1)) var(--d, 0s),
      opacity calc(var(--s, .8s) * .56) var(--ease-standard, cubic-bezier(.22,1,.36,1)) var(--d, 0s),
      -webkit-mask-position var(--s, .8s) var(--ease-standard, cubic-bezier(.22,1,.36,1)) var(--d, 0s),
      mask-position var(--s, .8s) var(--ease-standard, cubic-bezier(.22,1,.36,1)) var(--d, 0s);
  }
  /* Salida (once=false): un fundido rápido sin escalonado (duration.exit = .18 s, ease.standard). */
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-part { transition: transform .18s var(--ease-standard, cubic-bezier(.22,1,.36,1)), filter .18s var(--ease-standard, cubic-bezier(.22,1,.36,1)), opacity .18s var(--ease-standard, cubic-bezier(.22,1,.36,1)), -webkit-mask-position .18s var(--ease-standard, cubic-bezier(.22,1,.36,1)), mask-position .18s var(--ease-standard, cubic-bezier(.22,1,.36,1)); }
  .aui-in-view-title[data-instant] .aui-in-view-title-part { transition: none; }

  /* Estados escondidos de cada variante (los «animate» de Arc cuando visible es false). */
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-clip > .aui-in-view-title-part { transform: translateY(.9em); opacity: 0; }
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-line-clip > .aui-in-view-title-part { transform: translateY(112%); opacity: 0; }
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-blur-word { opacity: 0; transform: translateY(.2em); filter: blur(8px); }
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-track-word { opacity: 0; filter: blur(4px); }
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-track-word > .aui-in-view-title-part { transform: translateX(var(--tx, 0em)); }
  .aui-in-view-title[data-state="hidden"] .aui-in-view-title-wipe { --wipe: 100%; transform: translateX(-.12em); }
}
