/*
 * ==========================================================================
 *  Fichas de módulo (sistema F) — `web/modulo.twig` + `partials/modulos/*`
 * ==========================================================================
 *
 * Maqueta validada: `F-modulo-ap.dc.html`. La ficha carga además
 * `modulos.css` (los artefactos de cada módulo, compartidos con /modulos).
 *
 * Prefijo `f-modf-`. Sólo tokens `--f-*`. Sólo se animan transform /
 * opacity / clip-path / background-position (y stroke-dashoffset en los
 * arcos del mapa, trazos SVG pequeños). Todas las animaciones leen
 * `var(--f-dl, 0s)` dentro del shorthand. Estado BASE = final legible:
 * con `prefers-reduced-motion` (f.css: `animation: none`) se lee entero.
 */

/* --------------------------------------------------------------------------
   Cabecera
   -------------------------------------------------------------------------- */
.f-modf-hero { padding-block: clamp(32px, 5vw, 56px) clamp(40px, 5vw, 56px); }
.f-modf-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); gap: 28px 48px; align-items: start; }
.f-modf-h1 { font-size: clamp(2.75rem, 1.4rem + 5.2vw, 5.75rem); }
.f-modf-hero__r { padding-top: 8px; }
.f-modf-def { font-size: clamp(1.125rem, 1rem + 0.5vw, 1.25rem); line-height: 1.45; max-width: 600px; }
.f-modf-h2 { font-size: clamp(2.25rem, 1.5rem + 2.2vw, 3.25rem); }
.f-modf-measure { max-width: 480px; }
.f-modf-sub { margin-top: 12px; }
.f-modf-art { min-width: 0; }

/* --------------------------------------------------------------------------
   Lienzo del flujo (escenario FIJO 1100 × 420 px: nodos y trazos comparten
   coordenadas; en móvil `.f-canvas__body` hace scroll horizontal)
   -------------------------------------------------------------------------- */
.f-modf-canvas .f-canvas__body { -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.f-modf-stage { width: 1100px; height: 420px; margin-inline: auto; }
.f-modf-nodes { position: static; }
.f-modf-n { position: absolute; }
.f-modf-n1 { left: 0; top: 30px; width: 190px; }
.f-modf-n2 { left: 260px; top: 30px; width: 190px; }
.f-modf-n3 { left: 520px; top: 30px; width: 180px; }
.f-modf-n4 { left: 230px; top: 190px; width: 200px; }
.f-modf-n5 { left: 520px; top: 190px; width: 180px; }
.f-modf-n6 { left: 800px; top: 190px; width: 180px; }
.f-modf-n7 { left: 450px; top: 300px; width: 190px; }
.f-modf-n8 { left: 700px; top: 300px; width: 200px; }
.f-modf-b { position: absolute; top: 160px; padding: 0 4px; background: var(--f-stone); }
.f-modf-b1 { left: 352px; }
.f-modf-b2 { left: 622px; }
.f-modf-b3 { left: 902px; }
.f-modf-rombo {
  position: absolute; left: 0; top: 0; z-index: 2; width: 14px; height: 14px;
  pointer-events: none;
  transform: translate(793px, 323px) rotate(45deg);
  animation: f-modf-rombo 8s linear var(--f-dl, 0s) infinite;
}
.f-modf-rombo::before { content: ''; position: absolute; inset: 0; background: var(--f-sig); }
.f-modf-rombo::after { content: ''; position: absolute; inset: -6px; border: 1px solid var(--f-sig); opacity: 0.5; border-radius: 50%; }
@keyframes f-modf-rombo {
  0% { transform: translate(88px, 63px) rotate(45deg); }
  33.8% { transform: translate(603px, 63px) rotate(45deg); }
  39% { transform: translate(603px, 143px) rotate(45deg); }
  57.4% { transform: translate(323px, 143px) rotate(45deg); }
  67.2% { transform: translate(323px, 293px) rotate(45deg); }
  81.3% { transform: translate(538px, 293px) rotate(45deg); }
  83.3% { transform: translate(538px, 323px) rotate(45deg); }
  100% { transform: translate(793px, 323px) rotate(45deg); }
}

/* --------------------------------------------------------------------------
   Lista de comprobación (encaje, conciliación, horas…)
   -------------------------------------------------------------------------- */
.f-modf-chk { position: relative; overflow: hidden; border: 1px solid var(--f-line2); background: var(--f-bg); }
.f-modf-chk__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; padding: 14px; border-bottom: 1px solid var(--f-line); }
.f-modf-chk__head .f-eyebrow { white-space: nowrap; font-size: 10px; }
.f-modf-chk__t { font-size: 17px; letter-spacing: -0.01em; }
.f-modf-chk__rows { position: relative; }
.f-modf-chk__scan { position: absolute; left: 0; right: 0; top: 0; height: 20%; pointer-events: none; background: linear-gradient(180deg, transparent, color-mix(in oklab, var(--f-sig) 10%, transparent), transparent); transform: translateY(500%); animation: f-modf-rscan 7s linear var(--f-dl, 0s) infinite; }
@keyframes f-modf-rscan { 0% { transform: translateY(-100%); } 55%, 100% { transform: translateY(500%); } }
.f-modf-chk__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(104px, 170px); border-bottom: 1px solid var(--f-line); }
.f-modf-chk__row:last-child { border-bottom: 0; }
.f-modf-chk__l { padding: 12px 14px; display: flex; flex-direction: column; gap: 7px; min-width: 0; font-size: 14px; overflow-wrap: anywhere; }
.f-modf-chk__track { display: block; height: 2px; background: var(--f-line); overflow: hidden; }
.f-modf-chk__bar, .f-modf-chk__seg {
  display: block; height: 100%; background: var(--f-sig); transform-origin: left;
  animation: f-modf-rbar 7s cubic-bezier(0.4, 0, 0.2, 1) var(--f-dl, 0s) infinite both;
}
.f-modf-bar--warn { background: var(--f-warn); }
.f-modf-bar--bad { background: var(--f-bad); }
.f-modf-bar--grey { background: var(--f-line2); }
@keyframes f-modf-rbar { 0%, 3% { transform: scaleX(0); } 10%, 92% { transform: scaleX(1); } 100% { transform: scaleX(1); opacity: 0; } }
.f-modf-chk__s { border-inline-start: 1px solid var(--f-line); padding: 12px 14px; display: flex; align-items: center; min-width: 0; }
.f-modf-chk__v { display: inline-block; font-size: 10.5px; overflow-wrap: anywhere; animation: f-modf-chk 7s cubic-bezier(0.2, 0.7, 0.2, 1) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-chk { 0%, 4% { opacity: 0; transform: translateX(8px); } 10%, 92% { opacity: 1; transform: none; } 100% { opacity: 0; transform: none; } }
.f-modf-bad { color: var(--f-bad); }
.f-modf-chk__foot { border-top: 1px solid var(--f-line2); padding: 14px; display: flex; flex-direction: column; gap: 10px; background: var(--f-stone); }
.f-modf-chk__segs { display: flex; gap: 4px; }
.f-modf-chk__seg { flex: 1; height: 6px; }
.f-modf-chk__res { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.f-modf-chk__resv, .f-modf-chk__cta { animation: f-modf-res 7s ease var(--f-dl, 0s) infinite both; }
.f-modf-chk__resv { font-size: 15px; }
.f-modf-chk__cta { padding: 7px 10px; background: var(--f-inv); color: var(--f-invink); --f-dl: 0.3s; }
@keyframes f-modf-res { 0%, 55% { opacity: 0; transform: translateY(6px); } 62%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.f-modf-chk__sample { padding: 10px 14px; border-top: 1px solid var(--f-line); text-align: end; }

/* --------------------------------------------------------------------------
   Mapa del mundo (Administración pública)
   -------------------------------------------------------------------------- */
.f-modf-map {
  position: relative; overflow: hidden; border: 1px solid var(--f-line2);
  padding: clamp(16px, 3vw, 40px);
  color: var(--f-night-ink);
  background: radial-gradient(ellipse at 50% 40%, color-mix(in oklab, var(--f-sig) 12%, var(--f-bg)) 0%, var(--f-stone) 72%);
}
:root.dark .f-modf-map { background: radial-gradient(ellipse at 50% 40%, color-mix(in oklab, var(--f-sig) 22%, var(--f-night)) 0%, var(--f-night) 70%); border-color: var(--f-night-line); }
.f-modf-map__sweep {
  position: absolute; top: 0; bottom: 0; left: 0; width: 22%; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, transparent, color-mix(in oklab, var(--f-sig) 28%, transparent), transparent);
  transform: translateX(-115%);
  animation: f-modf-sweep 6s linear var(--f-dl, 0s) infinite;
}
@keyframes f-modf-sweep { from { transform: translateX(-115%); } to { transform: translateX(480%); } }
.f-modf-map__top { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.f-modf-map__live { color: inherit; opacity: 0.75; font-size: 10.5px; }
.f-modf-map__count { display: flex; align-items: baseline; gap: 8px; }
.f-modf-cnt { display: block; height: 40px; overflow: hidden; font-size: 36px; font-weight: 300; letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }
.f-modf-cnt__in { display: block; transform: translateY(-200px); animation: f-modf-cnt 10s steps(1) var(--f-dl, 0s) infinite; }
.f-modf-cnt__in > span { display: block; height: 40px; line-height: 40px; }
@keyframes f-modf-cnt { 0% { transform: translateY(0); } 16% { transform: translateY(-40px); } 32% { transform: translateY(-80px); } 48% { transform: translateY(-120px); } 64% { transform: translateY(-160px); } 80%, 100% { transform: translateY(-200px); } }
.f-modf-map__hoy { opacity: 0.75; }
.f-modf-map__stage { position: relative; }
.f-modf-map__img { width: 100%; height: auto; }
:root.dark .f-modf-map__img { filter: brightness(1.45) saturate(0.9); }
.f-modf-map__over { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.f-modf-tw { fill: var(--f-sig); animation: f-modf-tw 3.2s ease-in-out var(--f-dl, 0s) infinite; }
@keyframes f-modf-tw { 0%, 100% { opacity: 1; } 50% { opacity: 0.15; } }
.f-modf-arc { fill: none; stroke: var(--f-sig); stroke-width: 1; stroke-dasharray: 420; stroke-dashoffset: 0; opacity: 0; animation: f-modf-arc 6s ease-in-out var(--f-dl, 0s) infinite; }
@keyframes f-modf-arc { 0% { stroke-dashoffset: 420; opacity: 0; } 10% { opacity: 0.75; } 45% { stroke-dashoffset: 0; opacity: 0.6; } 60%, 100% { stroke-dashoffset: 0; opacity: 0; } }
.f-modf-pt { fill: var(--f-sig); transform-box: fill-box; transform-origin: center; animation: f-modf-pop 6s cubic-bezier(0.2, 0.8, 0.2, 1) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-pop { 0% { transform: scale(0); opacity: 0; } 6% { transform: scale(1.6); opacity: 1; } 14%, 100% { transform: scale(1); opacity: 1; } }
.f-modf-ping { fill: none; stroke: var(--f-sig); stroke-width: 1.6; transform-box: fill-box; transform-origin: center; opacity: 0; animation: f-modf-ping 6s ease-out var(--f-dl, 0s) infinite; }
@keyframes f-modf-ping { 0% { transform: scale(1); opacity: 0.75; } 40% { transform: scale(5.3); opacity: 0; } 100% { transform: scale(5.3); opacity: 0; } }
.f-modf-hub { fill: var(--f-ink); }
.f-modf-map__cards { display: none; }
@media (min-width: 960px) { .f-modf-map__cards { display: block; } }
.f-modf-card {
  position: absolute; z-index: 3; display: flex; flex-direction: column;
  padding: 8px 10px; white-space: nowrap; font-size: 12.5px; line-height: 1.35;
  border: 1px solid var(--f-line2); color: var(--f-ink);
  background: color-mix(in oklab, var(--f-bg) 88%, transparent);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: 0; transform: translate(10px, -50%);
  animation: f-modf-card 14s ease-in-out var(--f-dl, 0s) infinite;
}
.f-modf-card--l { transform: translate(calc(-100% - 10px), -50%); animation-name: f-modf-card-l; }
:root.dark .f-modf-card { background: color-mix(in oklab, var(--f-night) 85%, transparent); border-color: var(--f-night-line); color: var(--f-night-ink); }
@keyframes f-modf-card { 0% { opacity: 0; transform: translate(10px, calc(-50% + 8px)); } 4%, 22% { opacity: 1; transform: translate(10px, -50%); } 27%, 100% { opacity: 0; transform: translate(10px, calc(-50% - 6px)); } }
@keyframes f-modf-card-l { 0% { opacity: 0; transform: translate(calc(-100% - 10px), calc(-50% + 8px)); } 4%, 22% { opacity: 1; transform: translate(calc(-100% - 10px), -50%); } 27%, 100% { opacity: 0; transform: translate(calc(-100% - 10px), calc(-50% - 6px)); } }
.f-modf-card--1 { left: 22.5%; top: 44.8%; --f-dl: 0s; }
.f-modf-card--2 { left: 60.3%; top: 59.4%; --f-dl: 1.4s; }
.f-modf-card--3 { left: 34%; top: 76.7%; --f-dl: 2.8s; }
.f-modf-card--4 { left: 51.2%; top: 22.1%; --f-dl: 4.2s; }
.f-modf-card--5 { left: 71.4%; top: 38.2%; --f-dl: 5.6s; }
.f-modf-card--6 { left: 37.1%; top: 75.5%; --f-dl: 7s; }
.f-modf-card--7 { left: 79.7%; top: 63%; --f-dl: 8.4s; }
.f-modf-card--8 { left: 49%; top: 29.7%; --f-dl: 9.8s; }
.f-modf-card--9 { left: 91.9%; top: 82.7%; --f-dl: 11.2s; }
.f-modf-card--10 { left: 49.2%; top: 54.5%; --f-dl: 12.6s; }
.f-modf-tick { position: relative; z-index: 2; margin-top: 18px; border-top: 1px solid var(--f-line2); padding-top: 14px; overflow: hidden; }
:root.dark .f-modf-tick { border-top-color: var(--f-night-line); }
.f-modf-tick__in { display: flex; gap: 36px; width: max-content; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10.5px; opacity: 0.85; animation: f-modf-tick 40s linear var(--f-dl, 0s) infinite; }
.f-modf-tick__in li { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
@keyframes f-modf-tick { to { transform: translateX(-50%); } }
.f-modf-map__sample { position: absolute; right: 14px; bottom: 6px; z-index: 3; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 9.5px; opacity: 0.6; }
@media (prefers-reduced-motion: reduce) {
  /* Sin movimiento la cinta no corre: se envuelve en varias líneas. */
  .f-modf-tick__in { flex-wrap: wrap; width: auto; gap: 8px 24px; }
  .f-modf-tick__in li[aria-hidden] { display: none; }
}

/* --------------------------------------------------------------------------
   Pliego leído y citado
   -------------------------------------------------------------------------- */
.f-modf-pl { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); border: 1px solid var(--f-line2); background: var(--f-bg); }
.f-modf-pl__data { padding: 16px; display: flex; flex-direction: column; gap: 6px; }
.f-modf-pl__data .f-eyebrow { padding-bottom: 6px; }
.f-modf-pl__row { padding: 12px 0; border-top: 1px solid var(--f-line); display: flex; flex-direction: column; gap: 5px; }
.f-modf-pl__row dt { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--f-grey); }
.f-modf-pl__row dd { margin: 0; font-size: 16px; }
.f-modf-cite { animation: f-modf-cite 8s ease var(--f-dl, 0s) infinite both; white-space: nowrap; }
@keyframes f-modf-cite { 0%, 2% { opacity: 0; transform: translateX(-6px); } 8%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.f-modf-type { display: inline-block; animation: f-modf-type 8s steps(24) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-type { 0%, 2% { clip-path: inset(0 100% 0 0); } 14%, 100% { clip-path: inset(0 0 0 0); } }
.f-modf-pl__doc { position: relative; overflow: hidden; padding: 16px; background: var(--f-stone); display: flex; flex-direction: column; gap: 12px; border-top: 1px solid var(--f-line); }
@media (min-width: 560px) { .f-modf-pl__doc { border-top: 0; border-inline-start: 1px solid var(--f-line); } }
.f-modf-pl__scan { position: absolute; left: 0; right: 0; top: 0; height: 28%; pointer-events: none; background: linear-gradient(180deg, transparent, color-mix(in oklab, var(--f-sig) 14%, transparent), transparent); transform: translateY(400%); animation: f-modf-scan 3s ease-in-out var(--f-dl, 0s) infinite; }
@keyframes f-modf-scan { from { transform: translateY(-100%); } to { transform: translateY(400%); } }
.f-modf-pl__lines { display: flex; flex-direction: column; gap: 6px; }
.f-modf-pl__lines span { display: block; height: 5px; background: var(--f-line2); opacity: 0.7; }
.f-modf-pl__lines span:nth-child(1) { width: 92%; }
.f-modf-pl__lines span:nth-child(2) { width: 84%; }
.f-modf-pl__lines span:nth-child(3) { width: 88%; }
.f-modf-pl__lines span:nth-child(4) { width: 70%; }
.f-modf-pl__q { font-size: 13px; line-height: 1.65; color: var(--f-ink2); }
.f-modf-hl {
  color: var(--f-ink); padding: 0 2px;
  background-color: transparent;
  background-image: linear-gradient(90deg, color-mix(in oklab, var(--f-sig) 24%, transparent) 50%, transparent 50%);
  background-size: 200% 100%; background-repeat: no-repeat; background-position: 0 0;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  animation: f-modf-hl 8s cubic-bezier(0.4, 0, 0.2, 1) var(--f-dl, 0s) infinite both;
}
@keyframes f-modf-hl { 0%, 2% { background-position: 100% 0; } 12%, 100% { background-position: 0 0; } }
.f-modf-pl__sample { margin-top: auto; }

/* --------------------------------------------------------------------------
   Precio recomendado
   -------------------------------------------------------------------------- */
.f-modf-pr { border: 1px solid var(--f-line2); background: var(--f-bg); padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.f-modf-pr__head { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13px; }
.f-modf-pr__svg { width: 100%; height: auto; overflow: visible; }
.f-modf-pr__bar { fill: var(--f-stone2); transform-box: fill-box; transform-origin: 50% 100%; animation: f-modf-bar 6s cubic-bezier(0.2, 0.7, 0.2, 1) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-bar { 0% { transform: scaleY(0); } 18%, 100% { transform: scaleY(1); } }
.f-modf-pr__horq { fill: none; stroke: var(--f-sig); stroke-width: 1.5; animation: f-modf-horq 6s cubic-bezier(0.4, 0, 0.2, 1) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-horq { 0%, 22% { clip-path: inset(0 100% 0 0); } 38%, 100% { clip-path: inset(0 0 0 0); } }
.f-modf-pr__tem { stroke: var(--f-bad); stroke-dasharray: 3 4; animation: f-modf-tem 6s ease var(--f-dl, 0s) infinite both; }
@keyframes f-modf-tem { 0%, 30% { opacity: 0; } 36%, 46%, 56% { opacity: 1; } 41%, 51% { opacity: 0.25; } 60%, 100% { opacity: 1; } }
.f-modf-pr__axis { stroke: var(--f-line2); }
.f-modf-pr__lbl, .f-modf-pr__tick, .f-modf-pr__mark text { font-family: var(--f-font-mono); font-size: 10px; }
.f-modf-pr__lbl { animation: f-modf-lbl 6s ease var(--f-dl, 0s) infinite both; }
.f-modf-pr__lbl--sig { fill: var(--f-sig); }
.f-modf-pr__lbl--bad { fill: var(--f-bad); }
@keyframes f-modf-lbl { 0%, 28% { opacity: 0; } 36%, 100% { opacity: 1; } }
.f-modf-pr__tick { fill: var(--f-grey); }
.f-modf-pr__mark { transform-box: view-box; animation: f-modf-mark 6s cubic-bezier(0.5, 0, 0.2, 1) var(--f-dl, 0s) infinite both; }
.f-modf-pr__mark line { stroke: var(--f-ink); stroke-width: 1.5; }
.f-modf-pr__mark rect, .f-modf-pr__mark circle { fill: var(--f-ink); }
.f-modf-pr__mark text { fill: var(--f-bg); font-size: 9.5px; }
@keyframes f-modf-mark { 0%, 36% { transform: translateX(-200px); opacity: 0; } 40% { opacity: 1; } 50% { transform: translateX(140px); } 56% { transform: translateX(-30px); } 62%, 94% { transform: translateX(0); opacity: 1; } 100% { opacity: 0; } }
.f-modf-pr__foot { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; border-top: 1px solid var(--f-line); padding-top: 12px; font-size: 14px; }
.f-modf-pr__amt { display: inline-block; font-size: 28px; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; animation: f-modf-amt 6s cubic-bezier(0.2, 0.7, 0.2, 1) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-amt { 0%, 44% { opacity: 0; transform: translateY(8px); } 52%, 100% { opacity: 1; transform: none; } }
.f-modf-pr__sample { text-align: end; }

/* --------------------------------------------------------------------------
   La sala de candidaturas (banda noche: clara en modo claro)
   -------------------------------------------------------------------------- */
.f-modf-sala { padding-block: clamp(80px, 10vw, 120px); }
.f-modf-sala__eb { color: inherit; opacity: 0.7; }
.f-modf-sala__h { font-size: clamp(2.75rem, 1.4rem + 5vw, 5.75rem); }
.f-modf-sala__lead { font-size: clamp(1.125rem, 1rem + 0.5vw, 1.25rem); line-height: 1.5; opacity: 0.9; max-width: 560px; }
.f-modf-sala__sample { text-align: end; font-family: var(--f-font-mono); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10.5px; opacity: 0.55; }
.f-modf-steps { position: relative; }
.f-modf-steps__rail { display: none; position: absolute; left: 0; right: 0; top: 17px; height: 1px; background: var(--f-night-line); }
.f-modf-steps__prog { display: block; height: 100%; background: var(--f-sig); transform-origin: left; animation: f-modf-prog 3.2s cubic-bezier(0.4, 0, 0.2, 1) var(--f-dl, 0s) both; }
@keyframes f-modf-prog { 0% { transform: scaleX(0); } 70%, 100% { transform: scaleX(1); } }
@media (min-width: 1120px) { .f-modf-steps__rail { display: block; } }
.f-modf-steps__list { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 32px 20px; }
.f-modf-step { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.f-modf-step__n { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; background: var(--f-sig); color: var(--f-on-sig); font-family: var(--f-font-mono); font-size: 13px; }
.f-modf-step__t { font-size: 24px; font-weight: 400; letter-spacing: -0.03em; line-height: 1.2; }
.f-modf-step__d { font-size: 15px; line-height: 1.5; opacity: 0.78; }
.f-modf-step__box { position: relative; overflow: hidden; min-height: 150px; border: 1px solid var(--f-night-line); padding: 14px; display: flex; flex-direction: column; gap: 9px; font-size: 13px; margin-top: auto; }
.f-modf-step__box--list { padding: 0; gap: 0; }
.f-modf-step__box--list li { display: flex; justify-content: space-between; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--f-night-line); }
.f-modf-step__box--list li:last-child { border-bottom: 0; }
.f-modf-step__li { display: flex; justify-content: space-between; gap: 10px; }
.f-modf-dim { opacity: 0.6; }
.f-modf-v2 { display: inline-block; animation: f-modf-v2 6s cubic-bezier(0.2, 0.7, 0.2, 1) var(--f-dl, 0s) infinite both; }
@keyframes f-modf-v2 { 0%, 3% { opacity: 0; transform: scale(0.6); } 10%, 92% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.f-modf-read__scan { position: absolute; left: 0; right: 0; top: 0; height: 30%; pointer-events: none; background: linear-gradient(180deg, transparent, color-mix(in oklab, var(--f-sig) 30%, transparent), transparent); transform: translateY(400%); animation: f-modf-scan 3s ease-in-out var(--f-dl, 0s) infinite; }
.f-modf-read__k { display: flex; justify-content: space-between; gap: 8px; opacity: 0.7; }
.f-modf-read__pg { display: block; height: 14px; overflow: hidden; }
.f-modf-read__pgin { display: block; transform: translateY(-70px); animation: f-modf-pg 6s steps(1) var(--f-dl, 0s) infinite; }
.f-modf-read__pgin > span { display: block; height: 14px; line-height: 14px; text-align: end; }
@keyframes f-modf-pg { 0% { transform: translateY(0); } 13% { transform: translateY(-14px); } 26% { transform: translateY(-28px); } 39% { transform: translateY(-42px); } 52% { transform: translateY(-56px); } 65%, 100% { transform: translateY(-70px); } }
.f-modf-ln { display: block; height: 6px; background: var(--f-night-line); transform-origin: left; animation: f-modf-ln 6s cubic-bezier(0.4, 0, 0.2, 1) var(--f-dl, 0s) infinite both; }
.f-modf-ln--k { background: var(--f-sig); animation-name: f-modf-lnk; }
.f-modf-ln--92 { width: 92%; }
.f-modf-ln--78 { width: 78%; }
.f-modf-ln--86 { width: 86%; }
.f-modf-ln--64 { width: 64%; }
.f-modf-ln--70 { width: 70%; }
.f-modf-ln--82 { width: 82%; }
@keyframes f-modf-ln { 0%, 3% { transform: scaleX(0); } 12%, 92% { transform: scaleX(1); } 100% { transform: scaleX(1); opacity: 0.3; } }
@keyframes f-modf-lnk { 0%, 3% { transform: scaleX(0); opacity: 1; } 12% { transform: scaleX(1); opacity: 1; } 16% { opacity: 0.35; } 20%, 92% { opacity: 1; } 100% { opacity: 0.3; } }
.f-modf-sobres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.f-modf-sobre { position: relative; border: 1px solid var(--f-night-line); padding: 8px 4px; font-size: 11.5px; text-align: center; hyphens: auto; -webkit-hyphens: auto; }
.f-modf-sobre .f-modf-dim { font-size: 10px; }
.f-modf-sobre--sig { border-color: var(--f-sig); }
.f-modf-sobre::after { content: ''; position: absolute; inset: 0; background: color-mix(in oklab, var(--f-sig) 35%, transparent); opacity: 0; animation: f-modf-sobre 6s ease var(--f-dl, 0s) infinite both; }
@keyframes f-modf-sobre { 0%, 3% { opacity: 0; } 9% { opacity: 1; } 20%, 100% { opacity: 0; } }
.f-modf-mesa { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; border-top: 1px solid var(--f-night-line); padding-top: 10px; margin-top: auto; }
.f-modf-mesa__n { display: flex; align-items: baseline; gap: 2px; }
.f-modf-score { display: block; height: 30px; overflow: hidden; font-size: 26px; font-weight: 300; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.f-modf-score__in { display: block; transform: translateY(-150px); animation: f-modf-score 6s steps(1) var(--f-dl, 0s) infinite; }
.f-modf-score__in > span { display: block; height: 30px; line-height: 30px; }
@keyframes f-modf-score { 0% { transform: translateY(0); } 45% { transform: translateY(-30px); } 52% { transform: translateY(-60px); } 59% { transform: translateY(-90px); } 66% { transform: translateY(-120px); } 73%, 100% { transform: translateY(-150px); } }

/* --------------------------------------------------------------------------
   Asistente, lista de espera
   -------------------------------------------------------------------------- */
.f-modf-chat { min-width: 0; }
.f-modf-wait { display: flex; flex-direction: column; gap: 14px; padding: clamp(20px, 3vw, 28px); border: 1px solid var(--f-line2); background: var(--f-stone); }
.f-modf-wait .f-label { margin-bottom: 0; }

@media (prefers-reduced-motion: reduce) {
  .f-modf-rombo, .f-modf-map__sweep, .f-modf-chk__scan, .f-modf-pl__scan, .f-modf-read__scan { display: none; }
}

/* Precio del módulo: dos columnas ya en móvil. */
.f-modf-prices { --f-min: 150px; }
@media (max-width: 639px) {
  .f-modf-prices .f-kpi { padding: 20px 16px; gap: 10px; }
  .f-modf-prices .f-kpi__n { font-size: 2.25rem; }
  .f-modf-prices .f-kpi__l { font-size: 10px; }
}