/*! Fullcast Motion Kit 1.2.0 · Clases para módulos nativos de Divi 5 */

/* =========================================================
   TOKENS
   Los valores reales vienen de Ajustes > Fullcast Motion Kit
   (se imprimen inline después de este archivo).
   ========================================================= */
:root{
  --fcx-c-1:#fd4000; --fcx-c-2:#9ea939; --fcx-c-3:#60c0a8; --fcx-c-4:#ec4899; --fcx-c-5:#ffb81f; --fcx-c-6:#1c94a4;
  --fcx-ink:#1f1a24;
  --fcx-t-1:#fff2eb; --fcx-t-2:#f4f6dc; --fcx-t-3:#fdedf5; --fcx-t-4:#e3f4ef;
}
/* Paletas por defecto. Para cambiarlas en una sección usa una clase
   fcx-pal-* o escribe --fcx-palette en su Custom CSS. */
:root{
  --fcx-accent:var(--fcx-c-1);
  --fcx-palette:var(--fcx-c-1),var(--fcx-c-2),var(--fcx-c-3),var(--fcx-c-4),var(--fcx-c-5);
  --fcx-palette-soft:var(--fcx-t-1),var(--fcx-t-2),var(--fcx-t-3),var(--fcx-t-4);
}

/* =========================================================
   PALETAS (atajos). Ponlas en la sección, fila o módulo.
   ========================================================= */
.fcx-pal-warm{
  --fcx-palette:var(--fcx-c-1),var(--fcx-c-5),var(--fcx-c-4),#ff7a45;
  --fcx-palette-soft:var(--fcx-t-1),var(--fcx-t-3),#ffe7c2;
}
.fcx-pal-fresh{
  --fcx-palette:var(--fcx-c-2),var(--fcx-c-3),var(--fcx-c-6),var(--fcx-c-5);
  --fcx-palette-soft:var(--fcx-t-2),var(--fcx-t-4),#dff0f2;
}
.fcx-pal-night{ /* para fondos oscuros */
  --fcx-palette:#ffffff,var(--fcx-c-5),var(--fcx-c-4),var(--fcx-c-3);
  --fcx-palette-soft:#2b2432,#352c3d,rgba(255,255,255,.06);
  --fcx-hex-line:rgba(255,255,255,.12); --fcx-hex-opacity:.35;
  --fcx-flow-line:rgba(255,255,255,.14);
}
.fcx-pal-on-color{ /* para fondos de color intenso (ej. naranja) */
  --fcx-palette:rgba(255,255,255,.9),var(--fcx-c-5),var(--fcx-ink);
  --fcx-palette-soft:rgba(255,255,255,.14),rgba(255,255,255,.08),rgba(0,0,0,.07);
  --fcx-hex-line:rgba(255,255,255,.16); --fcx-hex-opacity:.4;
}

/* =========================================================
   CAPAS DE FONDO (fcx-bg-hex, fcx-bg-shapes)
   La capa va detrás del contenido y encima del fondo de Divi.
   ========================================================= */
.fcx-host{isolation:isolate}
.fcx-layer{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;border-radius:inherit}
.fcx-hex canvas{display:block}
.fcx-hex[data-fade="left"]  {-webkit-mask-image:linear-gradient(to right,transparent 15%,#000 60%);mask-image:linear-gradient(to right,transparent 15%,#000 60%)}
.fcx-hex[data-fade="right"] {-webkit-mask-image:linear-gradient(to left,transparent 15%,#000 60%);mask-image:linear-gradient(to left,transparent 15%,#000 60%)}
.fcx-hex[data-fade="top"]   {-webkit-mask-image:linear-gradient(to bottom,transparent 15%,#000 70%);mask-image:linear-gradient(to bottom,transparent 15%,#000 70%)}
.fcx-hex[data-fade="bottom"]{-webkit-mask-image:linear-gradient(to top,transparent 15%,#000 70%);mask-image:linear-gradient(to top,transparent 15%,#000 70%)}
.fcx-hex[data-fade="center"]{-webkit-mask-image:radial-gradient(ellipse at center,transparent 35%,#000 85%);mask-image:radial-gradient(ellipse at center,transparent 35%,#000 85%)}

.fcx-shape{position:absolute;display:block;border-radius:50%;opacity:var(--fcx-shapes-opacity,1);
  animation:fcx-drift var(--fcx-d,18s) ease-in-out infinite alternate;animation-delay:var(--fcx-dl,0s)}
.fcx-shape-sq{border-radius:28%}
.fcx-shape-half{border-radius:999px 999px 0 0}
@keyframes fcx-drift{to{translate:var(--fcx-dx,40px) var(--fcx-dy,-30px);rotate:var(--fcx-rot,24deg)}}

/* =========================================================
   MEDIA CON PLACA (fcx-slab) · Image o Video
   ========================================================= */
.fcx-slab-box{isolation:isolate}
.fcx-slab-plate{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:var(--fcx-slab-color,var(--fcx-accent));
  border-radius:var(--fcx-slab-radius,24px);
  translate:var(--fcx-slab-x,22px) var(--fcx-slab-y,22px);
  rotate:var(--fcx-slab-tilt,2.5deg);
  animation:fcx-slab var(--fcx-slab-speed,7s) ease-in-out infinite alternate}
@keyframes fcx-slab{to{translate:calc(var(--fcx-slab-x,22px) * .65) calc(var(--fcx-slab-y,22px) * 1.25);rotate:calc(var(--fcx-slab-tilt,2.5deg) * -.6)}}
.fcx-slab-media{border-radius:var(--fcx-media-radius,18px)}

/* =========================================================
   SOMBRA (fcx-shadow) · módulo, fila o grupo
   ========================================================= */
.fcx-shadow img,.fcx-shadow video,.fcx-shadow iframe,img.fcx-shadow{
  filter:drop-shadow(0 var(--fcx-shadow-y,22px) var(--fcx-shadow-blur,24px) var(--fcx-shadow-color,rgba(31,26,36,.28)))}

/* =========================================================
   FLOTACIÓN (fcx-float / fcx-float-group)
   Usa translate/rotate individuales: no pisa el transform de Divi.
   ========================================================= */
.fcx-float,.fcx-float-item{
  animation:fcx-float var(--fcx-float-speed,5.5s) ease-in-out infinite;
  animation-delay:calc(var(--fcx-i,0) * var(--fcx-float-stagger,1.4s) * -1)}
@keyframes fcx-float{
  0%,100%{translate:0 0;rotate:0deg}
  50%{translate:0 calc(var(--fcx-float-distance,10px) * -1);rotate:calc(var(--fcx-float-tilt,2deg) * -1)}}

/* =========================================================
   CONTADOR (fcx-count)
   ========================================================= */
.fcx-num{font-variant-numeric:tabular-nums}

/* =========================================================
   TEXTO CINÉTICO (fcx-kinetic, fcx-kinetic-words)
   ========================================================= */
.fcx-kinetic-ready .fcx-k{display:inline-block;opacity:0;translate:0 .4em;rotate:-4deg;
  color:var(--fcx-k-color,inherit);
  transition:opacity .5s ease,translate .6s cubic-bezier(.2,.8,.2,1.2),rotate .6s cubic-bezier(.2,.8,.2,1.2);
  transition-delay:calc(var(--fcx-k,0) * var(--fcx-kinetic-delay,.16s))}
.fcx-kinetic-ready .fcx-k-last{color:var(--fcx-kinetic-last,var(--fcx-k-color,inherit))}
.fcx-kinetic-ready.fcx-in .fcx-k{opacity:1;translate:0 0;rotate:0deg}

/* =========================================================
   CICLO DE PALABRAS (fcx-cycle, fcx-cycle-sync, fcx-cycle-item)
   ========================================================= */
.fcx-cycle-ready .fcx-cy{display:inline-block;opacity:var(--fcx-cycle-dim,.22);transition:opacity .5s ease,color .5s ease,translate .5s ease}
.fcx-cycle-ready .fcx-cy.fcx-on{opacity:1;color:var(--fcx-cy-color,inherit);translate:0 -.08em}
.fcx-cycle-item{opacity:var(--fcx-cycle-item-dim,1);transition:translate .5s ease,opacity .5s ease}
.fcx-cycle-item.fcx-on{opacity:1;translate:0 calc(var(--fcx-cycle-lift,6px) * -1)}
.fcx-cycle-bar{position:absolute;left:0;right:0;bottom:0;height:var(--fcx-cycle-bar,6px);pointer-events:none;
  border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;
  background:var(--fcx-item-accent,var(--fcx-cycle-accent,var(--fcx-accent)));
  transform:scaleX(.18);transform-origin:left;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.fcx-cycle-item.fcx-on .fcx-cycle-bar{transform:scaleX(1)}
.fcx-cycle-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;
  background:var(--fcx-cycle-glow,transparent);opacity:0;transition:opacity .5s ease}
.fcx-cycle-item.fcx-on .fcx-cycle-glow{opacity:1}

/* Texto con el color activo del ciclo (útil en el título de cada columna) */
.fcx-accent-text,.fcx-accent-text h1,.fcx-accent-text h2,.fcx-accent-text h3,.fcx-accent-text h4,.fcx-accent-text h5,.fcx-accent-text h6{
  color:var(--fcx-item-accent,var(--fcx-cycle-accent,var(--fcx-accent)))!important}

/* =========================================================
   CHECKLIST (fcx-checklist) · Text module con una lista
   ========================================================= */
.fcx-checklist-ready ul,.fcx-checklist-ready ol{list-style:none!important;padding:0!important;margin:0!important;display:grid;gap:var(--fcx-check-gap,14px)}
.fcx-checklist-ready li{list-style:none!important;margin:0!important;display:grid;grid-template-columns:var(--fcx-check-size,40px) minmax(0,1fr);gap:var(--fcx-check-text-gap,16px);align-items:center;
  background:var(--fcx-check-item-bg,transparent);border-radius:var(--fcx-check-item-radius,18px);padding:var(--fcx-check-item-pad,0)}
.fcx-checklist-ready li::before,.fcx-checklist-ready li::marker{content:none!important;display:none!important}
.fcx-tick{width:var(--fcx-check-size,40px);height:var(--fcx-check-size,40px);border-radius:calc(var(--fcx-check-size,40px) * .3);
  background:var(--fcx-check-bg,var(--fcx-t-3));display:grid;place-items:center}
.fcx-tick svg{width:55%;height:55%}
.fcx-tick path{fill:none;stroke:var(--fcx-check-color,var(--fcx-c-4));stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:30;stroke-dashoffset:30;transition:stroke-dashoffset .6s ease;transition-delay:calc(var(--fcx-i,0) * var(--fcx-check-stagger,.18s))}
.fcx-checklist-ready.fcx-in .fcx-tick path{stroke-dashoffset:0}

/* =========================================================
   FLUJO SEÑAL → ACCIÓN (fcx-flow) · Group con 2 módulos
   ========================================================= */
.fcx-flow-track{display:grid!important;grid-template-columns:minmax(0,1fr) var(--fcx-flow-gap,64px) minmax(0,1fr)!important;
  align-items:center!important;column-gap:0!important;row-gap:0!important}
.fcx-flow-a{grid-column:1;grid-row:1;margin:0!important;max-width:none!important}
.fcx-flow-b{grid-column:3;grid-row:1;margin:0!important;max-width:none!important}
.fcx-flow-line{grid-column:2;grid-row:1;position:relative;display:block;
  height:var(--fcx-flow-line-width,4px);margin:0 var(--fcx-flow-inset,8px);
  background:var(--fcx-flow-line,#eee8ef);border-radius:99px}
.fcx-flow-dot{position:absolute;top:50%;left:0;display:block;
  width:var(--fcx-flow-dot,12px);height:var(--fcx-flow-dot,12px);margin-top:calc(var(--fcx-flow-dot,12px) / -2);border-radius:50%;
  background:var(--fcx-flow-color,var(--fcx-flow-auto,var(--fcx-accent)));
  animation:fcx-pass var(--fcx-flow-speed,2.4s) cubic-bezier(.6,0,.3,1) infinite;
  animation-delay:calc(var(--fcx-flow-i,0) * var(--fcx-flow-stagger,.45s))}
@keyframes fcx-pass{0%{left:0;opacity:0}20%,80%{opacity:1}100%{left:calc(100% - var(--fcx-flow-dot,12px));opacity:0}}
@media (max-width:767px){
  .fcx-flow-track{grid-template-columns:minmax(0,1fr)!important}
  .fcx-flow-a{grid-column:1;grid-row:1}
  .fcx-flow-line{grid-column:1;grid-row:2;width:var(--fcx-flow-line-width,4px);height:var(--fcx-flow-gap-mobile,26px);margin:var(--fcx-flow-inset,8px) auto}
  .fcx-flow-b{grid-column:1;grid-row:3}
  .fcx-flow-dot{top:0;left:50%;margin:0 0 0 calc(var(--fcx-flow-dot,12px) / -2);animation-name:fcx-pass-v}
}
@keyframes fcx-pass-v{0%{top:0;opacity:0}20%,80%{opacity:1}100%{top:calc(100% - var(--fcx-flow-dot,12px));opacity:0}}

/* Chips de señal y acción (opcional): fcx-flow-chips en el Group
   del flujo o en cualquier contenedor que agrupe varios flujos. */
.fcx-flow-chips .fcx-flow-a,.fcx-flow-chips .fcx-flow-b{
  padding:var(--fcx-flow-chip-pad,16px 18px)!important;border-radius:var(--fcx-flow-chip-radius,14px)!important;
  font-weight:var(--fcx-flow-chip-weight,700);line-height:1.3}
.fcx-flow-chips .fcx-flow-a{background:var(--fcx-flow-signal-bg,var(--fcx-t-3))!important;color:var(--fcx-flow-signal-color,#9c1f5c)!important;
  box-shadow:inset var(--fcx-flow-signal-edge,0px) 0 0 var(--fcx-flow-color,var(--fcx-flow-auto,var(--fcx-accent)))}
.fcx-flow-chips .fcx-flow-b{background:var(--fcx-flow-action-bg,var(--fcx-ink))!important;color:var(--fcx-flow-action-color,#fff)!important}
.fcx-flow-chips .fcx-flow-a *,.fcx-flow-chips .fcx-flow-b *{color:inherit!important}

/* =========================================================
   CUADRANTE (fcx-quadrant)
   ========================================================= */
.fcx-quad{display:block;width:100%;max-width:var(--fcx-quad-size,420px);height:auto;margin-inline:auto}
.fcx-quad .fcx-q-cell{fill:var(--fcx-quad-cell,#fff);opacity:var(--fcx-quad-cell-opacity,.1)}
.fcx-quad .fcx-q-hot{opacity:var(--fcx-quad-hot-opacity,.22);animation:fcx-hot 3s ease-in-out infinite}
@keyframes fcx-hot{50%{opacity:calc(var(--fcx-quad-hot-opacity,.22) + .12)}}
.fcx-quad .fcx-q-ring{fill:none;stroke:var(--fcx-quad-ring,#fff);stroke-width:4;stroke-dasharray:10 12;opacity:.7;transform-origin:310px 110px;animation:fcx-spin 14s linear infinite}
.fcx-quad .fcx-q-dot{fill:var(--fcx-quad-dot,var(--fcx-ink))}
.fcx-quad .fcx-q-core{fill:var(--fcx-quad-core,var(--fcx-c-5))}
.fcx-quad .fcx-q-travel{animation:fcx-travel 6s cubic-bezier(.5,0,.2,1) infinite}
@keyframes fcx-spin{to{transform:rotate(360deg)}}
@keyframes fcx-travel{0%{transform:translate(-190px,190px);opacity:0}15%{opacity:1}55%,85%{transform:translate(0,0);opacity:1}100%{transform:translate(0,0);opacity:0}}

/* =========================================================
   CONTROL DE MOVIMIENTO
   ========================================================= */
.fcx-hover-pause:hover .fcx-float-item,.fcx-float.fcx-hover-pause:hover,
.fcx-hover-pause:hover .fcx-flow-dot,.fcx-hover-pause:hover .fcx-shape{animation-play-state:paused}

.fcx-motion-off.fcx-float,.fcx-motion-off.fcx-float-item,.fcx-motion-off .fcx-float-item,
.fcx-motion-off .fcx-shape,.fcx-motion-off .fcx-slab-plate,.fcx-motion-off .fcx-flow-dot,
.fcx-motion-off .fcx-quad *{animation:none!important}

@media (prefers-reduced-motion:reduce){
  .fcx-float,.fcx-float-item,.fcx-shape,.fcx-slab-plate,.fcx-flow-dot,.fcx-quad *{animation:none!important}
  .fcx-flow-dot{left:calc(50% - var(--fcx-flow-dot,12px) / 2)}
  .fcx-kinetic-ready .fcx-k{opacity:1;translate:0 0;rotate:0deg;transition:none}
  .fcx-tick path{stroke-dashoffset:0;transition:none}
}