/*
 * /precios — hoja propia del sistema F (maqueta F-precios.dc.html).
 * Prefijo `f-pr-`. Sólo tokens de `f.css`: el claro y el oscuro salen solos.
 * Movimiento: transform / opacity / background-position y, en trazos SVG
 * pequeños, stroke-dashoffset. Todas las animaciones leen
 * `var(--f-dl, 0s)` y se pausan fuera de pantalla (`[data-f-anim]`).
 * El reposo (sin animación o con movimiento reducido) es legible.
 */

/* ---------------------------------------------------------------- Hero */
.f-pr-hero { border-bottom: 1px solid var(--f-line); padding-block: clamp(56px, 8vw, 80px) clamp(44px, 6vw, 64px); }
.f-pr-hero__in {
  display: grid; gap: 28px 40px; align-items: end;
  grid-template-columns: repeat(auto-fit, minmax(min(460px, 100%), 1fr));
}
.f-pr-h1 { font-size: clamp(2.75rem, 1.4rem + 5.4vw, 6rem); }
.f-pr-hero__ctl { gap: 12px 16px; }

/* Conmutador mensual / anual */
.f-pr-seg { display: flex; border: 1px solid var(--f-line2); background: var(--f-bg); }
.f-pr-seg__b {
  min-height: 44px; padding: 0 14px; border: 0; background: transparent; color: var(--f-ink2);
  font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10.5px;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.f-pr-seg__b:hover { color: var(--f-ink); }
.f-pr-seg__b[aria-pressed="true"] { background: var(--f-inv); color: var(--f-invink); }

/* ---------------------------------------------------------- Tres pasos */
.f-pr-pasos { padding-top: clamp(56px, 7vw, 72px); }
.f-pr-steps {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  border-top: 1px solid var(--f-line2); border-inline-start: 1px solid var(--f-line2);
}
.f-pr-step {
  display: flex; flex-direction: column; gap: 16px; min-width: 0;
  padding: clamp(22px, 3vw, 30px);
  border-inline-end: 1px solid var(--f-line2); border-bottom: 1px solid var(--f-line2);
}
.f-pr-step--tint { background: linear-gradient(140deg, color-mix(in oklab, var(--f-sig) 10%, var(--f-bg)), var(--f-bg)); }
.f-pr-step__h { display: flex; align-items: center; gap: 12px; font-size: 22px; font-weight: 400; letter-spacing: -0.03em; line-height: 1.2; }
.f-pr-step__n {
  display: flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px;
  background: var(--f-sig); color: var(--f-on-sig); font-family: var(--f-font-mono); font-size: 13px;
}
.f-pr-step__d { font-size: 15.5px; line-height: 1.5; color: var(--f-ink2); }
.f-pr-step__d strong, .f-pr-ej strong { font-weight: 500; color: var(--f-ink); }
.f-pr-step__d--s { font-size: 14px; }
.f-pr-step__d--rule { font-size: 14px; border-top: 1px solid var(--f-line2); padding-top: 12px; }

.f-pr-plist { display: flex; flex-direction: column; border-top: 1px solid var(--f-line2); }
.f-pr-pline {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 12px;
  padding: 14px 0; border-bottom: 1px solid var(--f-line);
}
.f-pr-pline__l { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 180px; }
.f-pr-pline__t { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 16px; }
.f-pr-pline__d { font-size: 12.5px; line-height: 1.45; color: var(--f-grey); }
.f-pr-pline__d--ink { color: var(--f-ink2); }
.f-pr-pline__d a, .f-pr-pline__t a { text-decoration: underline; text-decoration-color: var(--f-line2); text-underline-offset: 3px; }
.f-pr-pline__d a:hover, .f-pr-pline__t a:hover { color: var(--f-sig); text-decoration-color: var(--f-sig); }
.f-pr-pline--ap {
  margin: 0 -12px; padding: 14px 12px; border: 1px solid color-mix(in oklab, var(--f-sig) 40%, transparent);
  background: linear-gradient(120deg, color-mix(in oklab, var(--f-sig) 16%, var(--f-bg)), color-mix(in oklab, var(--f-sig) 4%, var(--f-bg)));
}
.f-pr-pline--ap .f-chip { padding: 2px 6px; font-size: 9px; }
.f-pr-price { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.f-pr-price__n { font-size: clamp(2.25rem, 1.8rem + 1.4vw, 2.75rem); font-weight: 300; letter-spacing: -0.055em; line-height: 1; font-variant-numeric: tabular-nums; }
.f-pr-price__u, .f-pr-big__u { font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10px; color: var(--f-grey); }
.f-pr-big { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.f-pr-big__n { font-size: clamp(3rem, 2.4rem + 2vw, 4rem); font-weight: 300; letter-spacing: -0.06em; line-height: 1; font-variant-numeric: tabular-nums; }

.f-pr-ej {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px;
  padding: 20px 24px; border: 1px solid var(--f-line2); background: var(--f-stone); font-size: 16px;
}
.f-pr-ej__t { font-size: 26px; letter-spacing: -0.03em; }
.f-pr-ej__p { margin-inline-start: auto; }

/* ---------------------------------------------------------- Calculadora */
.f-pr-calc-sec { padding-top: clamp(32px, 5vw, 56px); padding-bottom: clamp(64px, 9vw, 110px); }
/* Banda «noche»: clara en claro, azul noche en oscuro. */
.f-pr-calc {
  --pr-ink: var(--f-night-ink);
  --pr-line: color-mix(in oklab, var(--f-night-ink) 12%, transparent);
  --pr-line2: color-mix(in oklab, var(--f-night-ink) 18%, transparent);
  position: relative; overflow: hidden; margin: 0;
  background: var(--f-night); color: var(--pr-ink); border: 1px solid var(--f-line2);
}
:root.dark .f-pr-calc { border-color: var(--pr-line); }
.f-pr-calc__mesh {
  --f-aqua: oklch(72% 0.13 var(--f-gh));
  position: absolute; inset: -20%; pointer-events: none;
  background:
    radial-gradient(600px 380px at 75% 25%, color-mix(in oklab, var(--f-sig) 26%, transparent), transparent 70%),
    radial-gradient(520px 360px at 15% 85%, color-mix(in oklab, var(--f-aqua) 22%, transparent), transparent 70%);
  animation: f-pr-mesh 14s ease-in-out var(--f-dl, 0s) infinite alternate, f-ghue 22s ease-in-out var(--f-dl, 0s) infinite alternate;
}
:root.dark .f-pr-calc__mesh {
  background:
    radial-gradient(600px 380px at 75% 25%, color-mix(in oklab, var(--f-sig) 45%, transparent), transparent 70%),
    radial-gradient(520px 360px at 15% 85%, color-mix(in oklab, var(--f-aqua) 35%, transparent), transparent 70%);
}
@keyframes f-pr-mesh { from { transform: translate(0, 0) scale(1); } to { transform: translate(-4%, 3%) scale(1.08); } }

.f-pr-calc__grid { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); }
.f-pr-calc__in, .f-pr-calc__out { display: flex; flex-direction: column; gap: 24px; min-width: 0; padding: clamp(22px, 3.4vw, 36px); }
.f-pr-calc__in { border-bottom: 1px solid var(--pr-line); }
@media (min-width: 960px) {
  .f-pr-calc__in { border-bottom: 0; border-inline-end: 1px solid var(--pr-line); }
}
.f-pr-calc__k {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10.5px; opacity: 0.75;
}

.f-pr-mods { margin: 0; padding: 0; border: 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.f-pr-mods__lg { padding: 0; }
.f-pr-mods__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); gap: 8px; }
.f-pr-tog {
  position: relative; display: flex; flex-direction: column; gap: 8px; min-height: 96px; padding: 14px;
  border: 1px solid var(--pr-line2); background: color-mix(in oklab, var(--pr-ink) 3%, transparent);
  cursor: pointer; transition: border-color 0.3s ease, background-color 0.3s ease, transform 0.2s ease;
}
.f-pr-tog:hover { transform: translateY(-2px); }
.f-pr-tog__in { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.f-pr-tog:has(.f-pr-tog__in:checked) {
  border-color: var(--f-sig);
  background: color-mix(in oklab, var(--f-sig) 18%, transparent);
  box-shadow: 0 0 24px -8px color-mix(in oklab, var(--f-sig) 70%, transparent);
}
.f-pr-tog:has(.f-pr-tog__in:focus-visible) { outline: 2px solid var(--f-sig); outline-offset: 2px; }
.f-pr-tog__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.f-pr-tog__box { flex: none; width: 14px; height: 14px; border: 1px solid color-mix(in oklab, var(--pr-ink) 45%, transparent); }
.f-pr-tog:has(.f-pr-tog__in:checked) .f-pr-tog__box { background: var(--f-sig); border-color: var(--f-sig); box-shadow: 0 0 10px var(--f-sig); }
.f-pr-tog__p { font-family: var(--f-font-mono); font-size: 10px; letter-spacing: 0.04em; opacity: 0.75; }
.f-pr-tog__t { font-size: 15.5px; line-height: 1.25; }
.f-pr-tog__nota { min-height: 12px; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 9.5px; color: var(--f-sig); }
.f-pr-tog--ap { background: linear-gradient(140deg, color-mix(in oklab, var(--f-sig) 10%, transparent), transparent); }

.f-pr-usr { display: flex; flex-direction: column; gap: 12px; padding-top: 6px; }
.f-pr-usr__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.f-pr-usr__l { font-size: 16px; }
.f-pr-usr__n { font-size: 32px; font-weight: 300; letter-spacing: -0.04em; }
.f-pr-usr__ticks { display: flex; justify-content: space-between; font-family: var(--f-font-mono); font-size: 9.5px; opacity: 0.6; }

/* Deslizador: zona táctil de 44 px, pista de 2 px. */
.f-pr-range { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; margin: 0; background: transparent; cursor: pointer; }
.f-pr-range:focus { outline: none; }
.f-pr-range:focus-visible { outline: 2px solid var(--f-sig); outline-offset: 2px; }
.f-pr-range::-webkit-slider-runnable-track { height: 2px; background: color-mix(in oklab, var(--pr-ink) 22%, transparent); }
.f-pr-range::-moz-range-track { height: 2px; background: color-mix(in oklab, var(--pr-ink) 22%, transparent); }
.f-pr-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 22px; height: 22px; margin-top: -10px; border: 0; border-radius: 0;
  background: var(--f-sig); box-shadow: 0 0 0 6px color-mix(in oklab, var(--f-sig) 30%, transparent), 0 0 18px var(--f-sig);
}
.f-pr-range::-moz-range-thumb {
  width: 22px; height: 22px; border: 0; border-radius: 0;
  background: var(--f-sig); box-shadow: 0 0 0 6px color-mix(in oklab, var(--f-sig) 30%, transparent);
}

.f-pr-res__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; min-height: 30px; }
.f-pr-badge {
  padding: 6px 10px; border: 1px solid var(--pr-line2); opacity: 0.75;
  font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10px;
}
.f-pr-badge:empty { visibility: hidden; }
.f-pr-badge.is-on { opacity: 1; border-color: var(--f-sig); background: color-mix(in oklab, var(--f-sig) 22%, transparent); }

.f-pr-total { position: relative; display: flex; align-items: baseline; gap: 10px; }
.f-pr-total__glow {
  position: absolute; left: -20px; top: 10%; width: 260px; max-width: 80%; height: 120px; border-radius: 50%;
  background: color-mix(in oklab, var(--f-sig) 40%, transparent); filter: blur(40px); opacity: 0.55;
  animation: f-pr-glow 4s ease-in-out var(--f-dl, 0s) infinite;
}
@keyframes f-pr-glow { 0%, 100% { opacity: 0.55; transform: scale(1); } 50% { opacity: 0.9; transform: scale(1.15); } }
.f-pr-total__n { position: relative; font-size: clamp(4.5rem, 3rem + 5vw, 7.375rem); font-weight: 300; letter-spacing: -0.06em; line-height: 0.9; }
.f-pr-total__u { position: relative; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 11px; opacity: 0.75; }

.f-pr-comp { display: flex; flex-direction: column; gap: 8px; }
/* Barra de composición: usuarios de fondo, módulos encima escalados (sólo transform). */
.f-pr-bar { position: relative; height: 10px; overflow: hidden; background: var(--f-aqua); }
.f-pr-bar__mods {
  position: absolute; inset: 0; background: var(--f-sig);
  transform-origin: left; transform: scaleX(var(--pr-p, 0.5));
  transition: transform 0.6s var(--f-ease);
}
.f-pr-ley { display: flex; flex-wrap: wrap; gap: 6px 18px; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 9.5px; opacity: 0.8; }
.f-pr-ley__i { display: flex; align-items: center; gap: 6px; }
.f-pr-ley__sq { width: 8px; height: 8px; background: var(--f-sig); }
.f-pr-ley__sq--usr { background: var(--f-aqua); }

.f-pr-scale { display: flex; flex-direction: column; gap: 8px; }
.f-pr-scale__track { position: relative; height: 2px; background: color-mix(in oklab, var(--pr-ink) 14%, transparent); }
.f-pr-scale__fill {
  position: absolute; inset: 0; background: var(--f-sig); box-shadow: 0 0 8px var(--f-sig);
  transform-origin: left; transform: scaleX(var(--pr-s, 0)); transition: transform 0.6s var(--f-ease);
}
.f-pr-scale__tick { position: absolute; left: var(--pr-x, 50%); top: -5px; width: 2px; height: 12px; background: color-mix(in oklab, var(--pr-ink) 50%, transparent); }
.f-pr-scale__l { display: flex; justify-content: space-between; gap: 8px; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 9.5px; opacity: 0.7; }

.f-pr-lines { margin: 0; border-top: 1px solid var(--pr-line); }
.f-pr-line { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--pr-line); font-size: 14px; }
.f-pr-line[hidden] { display: none; }
.f-pr-line dt { opacity: 0.85; }
.f-pr-line dd { margin: 0; white-space: nowrap; }

.f-pr-cta {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
  min-height: 54px; padding: 0 20px; border: 0;
  background: var(--pr-ink); color: var(--f-night);
  font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 11.5px; text-align: start;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.f-pr-cta:hover, .f-pr-cta:focus-visible { background: var(--f-sig); color: var(--f-on-sig); }
.f-pr-cta svg { flex: none; transition: transform 0.25s ease; }
.f-pr-cta:hover svg { transform: translate(2px, -2px); }
.f-pr-cta[disabled] { opacity: 0.5; cursor: not-allowed; }

/* ---------------------------------------------------- Banda del conector */
.f-pr-conn-sec { padding-bottom: clamp(56px, 7vw, 80px); }
.f-pr-conn { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; padding: 26px clamp(20px, 3vw, 30px); border: 1px solid var(--f-line2); }
.f-pr-conn__t { flex: 1 1 260px; font-size: clamp(1.25rem, 1rem + 0.9vw, 1.75rem); letter-spacing: -0.03em; line-height: 1.25; }

/* ------------------------------------------------------ Siempre incluido */
.f-pr-cards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  border-top: 1px solid var(--f-line2); border-inline-start: 1px solid var(--f-line2);
}
.f-pr-card {
  display: flex; flex-direction: column; gap: 12px; padding: clamp(22px, 3vw, 30px);
  border-inline-end: 1px solid var(--f-line2); border-bottom: 1px solid var(--f-line2);
}
.f-pr-card--1 { background: linear-gradient(150deg, color-mix(in oklab, var(--f-sig) 14%, var(--f-bg)), var(--f-bg)); }
.f-pr-card--2 { background: linear-gradient(150deg, color-mix(in oklab, var(--f-aqua) 14%, var(--f-bg)), var(--f-bg)); }
.f-pr-card--3 { background: linear-gradient(150deg, color-mix(in oklab, var(--f-violet) 12%, var(--f-bg)), var(--f-bg)); }
.f-pr-card__k { display: flex; align-items: center; gap: 8px; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10.5px; color: var(--f-sig); }
.f-pr-card__t { font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.625rem); font-weight: 400; letter-spacing: -0.035em; line-height: 1.1; }
.f-pr-card__d { font-size: 15px; line-height: 1.5; color: var(--f-ink2); }

.f-pr-scene {
  display: grid; align-items: center; overflow: hidden;
  grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
  border: 1px solid var(--f-line2);
}
.f-pr-scene__art { position: relative; padding: 24px 24px 0; min-width: 0; }
.f-pr-scene__svg { width: 100%; height: auto; }
.f-pr-bubble { position: relative; height: 56px; margin: 0 0 6px clamp(40px, 21%, 120px); }
.f-pr-say {
  position: absolute; left: 0; top: 0; max-width: 100%;
  padding: 10px 14px; background: var(--f-bg); border: 1px solid var(--f-line2); font-size: 15px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Reposo: se lee la primera orden. En bucle, las tres se turnan. */
.f-pr-say--2, .f-pr-say--3 { opacity: 0; }
.f-pr-say { animation: f-pr-say 12s ease var(--f-dl, 0s) infinite; }
.f-pr-say--2 { --f-dl: 4s; }
.f-pr-say--3 { --f-dl: 8s; }
@keyframes f-pr-say {
  0% { opacity: 0; transform: translateY(6px); }
  4%, 28% { opacity: 1; transform: none; }
  33%, 100% { opacity: 0; transform: none; }
}

.f-pr-svg-ink { fill: none; stroke: var(--f-ink); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.f-pr-svg-phone { fill: var(--f-ink); }
.f-pr-svg-screen { fill: var(--f-sig); opacity: 0.85; }
.f-pr-svg-sig { fill: none; stroke: var(--f-sig); stroke-width: 1.6; stroke-linecap: round; }
.f-pr-blinky { animation: f-pr-wv 1.2s ease-in-out var(--f-dl, 0s) infinite; }
@keyframes f-pr-wv { 0%, 100% { opacity: 0.15; } 50% { opacity: 1; } }
.f-pr-svg-wire { fill: none; stroke: var(--f-line2); stroke-width: 1.2; }
.f-pr-svg-link { fill: none; stroke: var(--f-sig); stroke-width: 1.6; stroke-dasharray: 4 8; animation: f-pr-flow 1.4s linear var(--f-dl, 0s) infinite; }
@keyframes f-pr-flow { to { stroke-dashoffset: -24; } }
.f-pr-svg-node { fill: var(--f-bg); stroke: var(--f-sig); stroke-width: 1.4; }
.f-pr-svg-node-glow { fill: var(--f-sig); opacity: 0; animation: f-pr-node 4s ease var(--f-dl, 0s) infinite; }
@keyframes f-pr-node { 0%, 30% { opacity: 0; } 38% { opacity: 0.22; } 60%, 100% { opacity: 0; } }
.f-pr-svg-t { fill: var(--f-ink); font-family: var(--f-font); font-size: 14px; }
.f-pr-svg-t--l { font-size: 20px; letter-spacing: -0.5px; }
.f-pr-svg-t--s { font-size: 13px; }
.f-pr-svg-t--xs { font-size: 10.5px; }
.f-pr-svg-t--inv { fill: var(--f-invink); }
.f-pr-svg-k { fill: var(--f-grey); font-family: var(--f-font-mono); font-size: 9px; letter-spacing: 0.06em; }
.f-pr-svg-k--inv { fill: var(--f-invink); opacity: 0.65; font-size: 8px; letter-spacing: 0.03em; }

/* Punto que viaja por un trazo: un guion de longitud ~0 con remate redondo. */
.f-pr-comet {
  fill: none; stroke: var(--f-sig); stroke-linecap: round;
  stroke-dasharray: 0.001 1.2; stroke-dashoffset: 0;
}
.f-pr-comet--hop { stroke-width: 10; animation: f-pr-hop 4s linear var(--f-dl, 0s) infinite; }
@keyframes f-pr-hop { 0% { stroke-dashoffset: 0; } 35%, 100% { stroke-dashoffset: -1; } }
.f-pr-comet--in { stroke-width: 8; animation: f-pr-run 3s linear var(--f-dl, 0s) infinite; }
.f-pr-comet--out { stroke-width: 7; animation: f-pr-run 2.4s linear var(--f-dl, 0s) infinite; }
@keyframes f-pr-run { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -1; } }

.f-pr-scene__out { display: flex; flex-direction: column; gap: 10px; padding: clamp(20px, 3vw, 28px); min-width: 0; }
.f-pr-scene__out .f-sample { align-self: flex-end; }
.f-pr-results { display: flex; flex-direction: column; gap: 10px; }
.f-pr-result {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 16px; background: var(--f-bg); border: 1px solid var(--f-line2);
  animation: f-pr-res 12s ease var(--f-dl, 0s) infinite;
}
.f-pr-result::after {
  content: ''; position: absolute; inset: -1px; pointer-events: none; opacity: 0;
  box-shadow: inset 0 0 0 1px var(--f-sig), 0 0 0 4px var(--f-sigsoft);
  animation: f-pr-halo 12s ease var(--f-dl, 0s) infinite;
}
@keyframes f-pr-res { 0% { transform: translateX(-6px); } 12%, 100% { transform: none; } }
@keyframes f-pr-halo { 0% { opacity: 1; } 12%, 100% { opacity: 0; } }
.f-pr-result__b { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.f-pr-result__k { font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 9.5px; color: var(--f-grey); }
.f-pr-result__t { font-size: 15px; }
.f-pr-result__ok { font-family: var(--f-font-mono); font-size: 11px; color: var(--f-ok); animation: f-pr-ok 12s ease calc(var(--f-dl, 0s) + 0.4s) infinite; }
@keyframes f-pr-ok { 0%, 3% { opacity: 0.15; } 4%, 100% { opacity: 1; } }

/* -------------------------------------------------------------- Tu IA */
.f-pr-ia__items { max-width: 560px; }
.f-pr-ia__items .f-item { gap: 4px; padding: 16px 0; border-bottom-color: var(--f-line2); }
.f-pr-ia__items .f-item__t { font-size: 17px; font-weight: 400; }
.f-pr-ia__items .f-item__d { font-size: 14.5px; }
.f-pr-diag { min-width: 0; padding: clamp(14px, 2.4vw, 22px); border: 1px solid var(--f-line2); background: var(--f-bg); }
.f-pr-diag__svg { width: 100%; height: auto; }
.f-pr-svg-box { fill: var(--f-stone); stroke: var(--f-line2); }
.f-pr-svg-box--sig { stroke: var(--f-sig); }
.f-pr-svg-box--bg { fill: var(--f-bg); }
.f-pr-svg-core { fill: var(--f-inv); animation: f-pr-core 3s ease-in-out var(--f-dl, 0s) infinite; }
@keyframes f-pr-core { 0%, 100% { opacity: 1; } 50% { opacity: 0.88; } }

/* -------------------------------------------------------------- Cierre */
.f-pr-cierre__h { max-width: 1000px; }
.f-pr-cierre__links { gap: 4px 24px; }

/* Columnas de la escena en móvil: la orden no se corta del todo. */
@media (max-width: 479px) {
  .f-pr-say { font-size: 13.5px; }
  .f-pr-ej { padding: 16px; }
  .f-pr-ej__p { margin-inline-start: 0; }
}