/* ── Extendable: Widget Carrusel Automatizaciones ───────────── */

/* ── Wrapper & Track ─────────────────────────────────────────── */
.eca-wrapper {
	position: relative;
	width: 100%;
	user-select: none;
}

.eca-track {
	position: relative;
	overflow: hidden;
}

.eca-slide {
	display: none;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: 3rem;
	background-color: var(--wp--preset--color--tertiary, #F2F2FA);
	border-radius: 20px;
	padding: 2.5rem;
	animation: eca-fade-in 0.45s ease both;
}

.eca-slide.is-active {
	display: grid;
}

@keyframes eca-fade-in {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
	.eca-slide {
		grid-template-columns: 1fr;
		padding: 1.5rem;
		gap: 1.75rem;
	}
}

/* ── Contenido textual ───────────────────────────────────────── */
.eca-content {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.eca-badge {
	display: inline-block;
	background-color: var(--wp--preset--color--primary, #381d92);
	color: #fff;
	font-family: var(--wp--preset--font-family--inter, 'Inter', sans-serif);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.3em 0.8em;
	border-radius: 100px;
	width: fit-content;
}

.eca-titulo {
	font-family: var(--wp--preset--font-family--inter, 'Inter', sans-serif);
	font-size: clamp(1.4rem, 2.5vw, 2rem);
	font-weight: 800;
	color: var(--wp--preset--color--foreground, #0B0620);
	line-height: 1.2;
	margin: 0;
}

.eca-descripcion {
	font-family: var(--wp--preset--font-family--hind, 'Hind', sans-serif);
	font-size: 1rem;
	line-height: 1.7;
	color: var(--wp--preset--color--foreground, #0B0620);
	opacity: 0.75;
	margin: 0;
}

/* ── Controles ───────────────────────────────────────────────── */
.eca-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin-top: 1.5rem;
}

.eca-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 2px solid #d1d5db;
	background: transparent;
	color: var(--wp--preset--color--foreground, #0B0620);
	cursor: pointer;
	transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.eca-arrow:hover {
	background-color: var(--wp--preset--color--primary, #381d92);
	border-color: var(--wp--preset--color--primary, #381d92);
	color: #fff;
}

.eca-dots {
	display: flex;
	gap: 0.5rem;
	align-items: center;
}

.eca-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #d1d5db;
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background 0.25s, width 0.25s;
}

.eca-dot.is-active {
	background-color: var(--wp--preset--color--primary, #381d92);
	width: 24px;
	border-radius: 100px;
}

/* ── Mockup base: teléfono ───────────────────────────────────── */
.eca-mockup {
	display: flex;
	justify-content: center;
}

.mock-phone {
	width: 100%;
	max-width: 360px;
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 8px 32px rgba(56, 29, 146, 0.15), 0 2px 8px rgba(0,0,0,0.08);
	overflow: hidden;
	font-size: 0.82rem;
}

.mock-phone__bar {
	display: flex;
	gap: 5px;
	padding: 10px 14px 6px;
	background: #f3f4f6;
}

.mock-phone__bar span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #d1d5db;
}

.mock-phone__bar span:nth-child(1) { background: #f87171; }
.mock-phone__bar span:nth-child(2) { background: #fbbf24; }
.mock-phone__bar span:nth-child(3) { background: #34d399; }

/* Header WhatsApp */
.mock-phone__header--wa {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	background: #075e54;
	color: #fff;
}

.mock-avatar--wa {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #128c7e;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
}

.mock-avatar--wa svg {
	width: 20px;
	height: 20px;
}

.mock-header-info strong {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
}

.mock-header-info span {
	font-size: 0.7rem;
	opacity: 0.8;
}

.mock-header-icons {
	margin-left: auto;
	opacity: 0.8;
}

/* Chat area */
.mock-phone__chat {
	padding: 12px;
	min-height: 360px;
	max-height: 360px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.mock-phone__chat--wa {
	background: #ece5dd url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.mock-phone__chat--ig {
	background: #fafafa;
}

/* Burbujas */
.mock-bubble {
	max-width: 80%;
	padding: 7px 11px;
	border-radius: 12px;
	line-height: 1.4;
	font-size: 0.78rem;
	opacity: 0;
	animation-fill-mode: forwards;
	animation-timing-function: ease;
	animation-duration: 0.4s;
}

.mock-bubble--bot {
	background: #fff;
	align-self: flex-start;
	border-bottom-left-radius: 3px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.mock-bubble--user {
	background: #dcf8c6;
	align-self: flex-end;
	border-bottom-right-radius: 3px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

.mock-phone__chat--ig .mock-bubble--bot {
	background: #efefef;
}

.mock-phone__chat--ig .mock-bubble--user {
	background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
	color: #fff;
}

/* Etiqueta de canal */
.mock-channel-label {
	font-size: 0.68rem;
	font-weight: 600;
	color: #9ca3af;
	text-align: center;
	letter-spacing: 0.05em;
	opacity: 0;
	animation-fill-mode: forwards;
	animation-duration: 0.4s;
}

/* Typing indicator */
.mock-typing {
	display: flex;
	gap: 4px;
	align-items: center;
	padding: 8px 12px;
	background: #fff;
	border-radius: 12px;
	border-bottom-left-radius: 3px;
	width: fit-content;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
	opacity: 0;
	animation-fill-mode: forwards;
	animation-duration: 0.4s;
}

.mock-phone__chat--ig .mock-typing {
	background: #efefef;
}

.mock-typing span {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #9ca3af;
	animation: mock-typing-bounce 1.2s infinite ease;
}

.mock-typing span:nth-child(2) { animation-delay: 0.2s; }
.mock-typing span:nth-child(3) { animation-delay: 0.4s; }

@keyframes mock-typing-bounce {
	0%, 80%, 100% { transform: translateY(0); }
	40%           { transform: translateY(-5px); }
}

/* Animaciones de entrada de burbujas */
@keyframes mock-bubble-in {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

.mock-bubble--anim-1  { animation-name: mock-bubble-in; animation-delay: 0.3s; }
.mock-bubble--anim-2  { animation-name: mock-bubble-in; animation-delay: 1.2s; }
.mock-bubble--anim-3  { animation-name: mock-bubble-in; animation-delay: 2.1s; }
.mock-bubble--anim-4  { animation-name: mock-bubble-in; animation-delay: 3.0s; }
.mock-bubble--anim-5  { animation-name: mock-bubble-in; animation-delay: 3.9s; }
.mock-typing--anim-6  { animation-name: mock-bubble-in; animation-delay: 4.8s; }
.mock-channel-label--anim-1 { animation-name: mock-bubble-in; animation-delay: 0.1s; }
.mock-channel-label--anim-3 { animation-name: mock-bubble-in; animation-delay: 2.0s; }

/* Header Instagram */
.mock-phone__header--ig {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	background: linear-gradient(135deg, #833ab4 0%, #fd1d1d 50%, #fcb045 100%);
	color: #fff;
	font-size: 0.85rem;
	font-weight: 600;
}

.mock-ig-channels {
	margin-left: auto;
	display: flex;
	gap: 4px;
}

.mock-ig-chip {
	font-size: 0.65rem;
	font-weight: 700;
	padding: 2px 6px;
	border-radius: 100px;
}

.mock-ig-chip--ig { background: rgba(255,255,255,0.25); }
.mock-ig-chip--fb { background: #1877f2; }

/* ── Mockup CRM Kommo ────────────────────────────────────────── */
.mock-crm {
	width: 100%;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 8px 32px rgba(56, 29, 146, 0.15);
	overflow: hidden;
	font-size: 0.78rem;
}

.mock-crm__topbar {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	background: #1C0A63;
	color: #fff;
}

.mock-crm__logo {
	display: flex;
	align-items: center;
	gap: 5px;
	font-weight: 700;
	font-size: 0.82rem;
}

.mock-crm__pipeline {
	font-size: 0.7rem;
	opacity: 0.7;
}

.mock-crm__badge {
	margin-left: auto;
	background: rgba(255,255,255,0.15);
	border-radius: 100px;
	padding: 2px 8px;
	font-size: 0.68rem;
}

.mock-kanban {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	padding: 12px;
	background: #f8fafc;
	min-height: 340px;
}

.mock-kanban__col {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.mock-kanban__col-title {
	display: flex;
	align-items: center;
	gap: 5px;
	font-weight: 700;
	font-size: 0.7rem;
	color: #374151;
	padding-bottom: 4px;
	border-bottom: 1px solid #e5e7eb;
}

.mock-kanban__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	flex-shrink: 0;
}

.mock-kanban__card {
	background: #fff;
	border-radius: 8px;
	padding: 8px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.08);
	border-left: 3px solid #e5e7eb;
}

.mock-kanban__card--moving {
	border-left-color: #3b82f6;
	animation: mock-card-enter 0.6s 1.5s ease both;
}

.mock-kanban__card-name {
	font-weight: 600;
	color: #111827;
	font-size: 0.72rem;
}

.mock-kanban__card-meta {
	font-size: 0.65rem;
	color: #9ca3af;
	margin-top: 2px;
}

.mock-kanban__card-tag {
	font-size: 0.62rem;
	color: #3b82f6;
	font-weight: 600;
	margin-top: 3px;
}

@keyframes mock-card-enter {
	from { opacity: 0; transform: translateY(-8px); }
	to   { opacity: 1; transform: translateY(0); }
}

.mock-kanban__card--anim-enter {
	animation: mock-card-enter 0.5s 0.4s ease both;
}

.mock-kanban__card--anim-enter-2 {
	animation: mock-card-enter 0.5s 2.5s ease both;
}

/* ── Mockup Gmail ────────────────────────────────────────────── */
.mock-gmail {
	width: 100%;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 8px 32px rgba(56, 29, 146, 0.15);
	overflow: hidden;
	font-size: 0.78rem;
}

.mock-gmail__topbar {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	background: #f3f4f6;
	border-bottom: 1px solid #e5e7eb;
	font-size: 0.8rem;
	font-weight: 600;
	color: #374151;
}

.mock-gmail__agent-tag {
	margin-left: auto;
	font-size: 0.68rem;
	background: #dcfce7;
	color: #166534;
	padding: 2px 8px;
	border-radius: 100px;
	font-weight: 600;
}

.mock-gmail__list {
	display: flex;
	flex-direction: column;
}

.mock-gmail__email {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 14px;
	border-bottom: 1px solid #f3f4f6;
	opacity: 0;
	animation: mock-bubble-in 0.4s ease forwards;
}

.mock-gmail__email--anim-1 { animation-delay: 0.3s; }
.mock-gmail__email--anim-2 { animation-delay: 1.1s; }
.mock-gmail__email--anim-3 { animation-delay: 1.9s; }
.mock-gmail__email--anim-4 { animation-delay: 2.7s; }

.mock-gmail__avatar {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.65rem;
	font-weight: 700;
	color: #fff;
	flex-shrink: 0;
}

.mock-gmail__body {
	flex: 1;
	min-width: 0;
}

.mock-gmail__from {
	font-weight: 700;
	font-size: 0.75rem;
	color: #111827;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mock-gmail__subject {
	font-size: 0.7rem;
	color: #6b7280;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mock-gmail__status {
	font-size: 0.65rem;
	font-weight: 600;
	padding: 3px 7px;
	border-radius: 100px;
	flex-shrink: 0;
}

.mock-gmail__status--done {
	background: #dcfce7;
	color: #166534;
}

.mock-gmail__status--processing {
	background: #fef3c7;
	color: #92400e;
	animation: mock-pulse 1.5s infinite;
}

@keyframes mock-pulse {
	0%, 100% { opacity: 1; }
	50%       { opacity: 0.5; }
}

.mock-gmail__footer {
	display: flex;
	justify-content: space-between;
	padding: 8px 14px;
	background: #f9fafb;
	border-top: 1px solid #e5e7eb;
}

.mock-gmail__stat {
	font-size: 0.68rem;
	color: #6b7280;
}

.mock-gmail__stat--green {
	color: #166534;
	font-weight: 600;
}

/* ── Mockup Dashboard ────────────────────────────────────────── */
.mock-dashboard {
	width: 100%;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 8px 32px rgba(56, 29, 146, 0.15);
	overflow: hidden;
	font-size: 0.78rem;
}

.mock-dashboard__bar {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 9px 14px;
	background: #f3f4f6;
	border-bottom: 1px solid #e5e7eb;
}

.mock-dashboard__bar span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.mock-dashboard__bar span:nth-child(1) { background: #f87171; }
.mock-dashboard__bar span:nth-child(2) { background: #fbbf24; }
.mock-dashboard__bar span:nth-child(3) { background: #34d399; }

.mock-dashboard__url {
	flex: 1;
	font-size: 0.68rem;
	color: #6b7280;
	margin-left: 4px;
}

.mock-dashboard__badge {
	font-size: 0.65rem;
	background: #ede9fe;
	color: #5b21b6;
	font-weight: 600;
	padding: 2px 7px;
	border-radius: 100px;
}

.mock-dashboard__body {
	padding: 12px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* KPI Cards */
.mock-dash-kpis {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
}

.mock-dash-kpi {
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	padding: 8px 10px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	opacity: 0;
	animation: mock-bubble-in 0.4s ease forwards;
}

.mock-dash-kpi--anim-1 { animation-delay: 0.3s; }
.mock-dash-kpi--anim-2 { animation-delay: 0.8s; }
.mock-dash-kpi--anim-3 { animation-delay: 1.3s; }

.mock-dash-kpi__val {
	font-size: 0.95rem;
	font-weight: 800;
	color: #111827;
}

.mock-dash-kpi__label {
	font-size: 0.6rem;
	color: #6b7280;
}

.mock-dash-kpi__delta {
	font-size: 0.65rem;
	font-weight: 700;
}

.mock-dash-kpi__delta--up { color: #059669; }

/* Gráfico de barras */
.mock-dash-chart {
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	padding: 10px 12px;
	opacity: 0;
	animation: mock-bubble-in 0.4s 1.8s ease forwards;
}

.mock-dash-chart__title {
	font-size: 0.68rem;
	font-weight: 700;
	color: #374151;
	margin-bottom: 8px;
}

.mock-dash-chart__bars {
	display: flex;
	align-items: flex-end;
	gap: 6px;
	height: 70px;
}

.mock-dash-bar {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	height: 100%;
	gap: 3px;
}

.mock-dash-bar::before {
	content: '';
	width: 100%;
	background: linear-gradient(to top, #381d92, #7c5cbf);
	border-radius: 4px 4px 0 0;
	height: 0;
	animation: mock-bar-grow 0.6s ease forwards;
}

.mock-dash-bar--anim-1::before { animation-delay: 2.0s; --bar-h: 55%; }
.mock-dash-bar--anim-2::before { animation-delay: 2.2s; --bar-h: 72%; }
.mock-dash-bar--anim-3::before { animation-delay: 2.4s; --bar-h: 48%; }
.mock-dash-bar--anim-4::before { animation-delay: 2.6s; --bar-h: 91%; }

@keyframes mock-bar-grow {
	from { height: 0; }
	to   { height: var(--bar-h, 60%); }
}

.mock-dash-bar span {
	font-size: 0.58rem;
	color: #9ca3af;
}

/* Insight Claude */
.mock-dash-insight {
	display: flex;
	align-items: flex-start;
	gap: 7px;
	background: #ede9fe;
	border-radius: 10px;
	padding: 8px 10px;
	opacity: 0;
	animation: mock-bubble-in 0.4s 3.2s ease forwards;
}

.mock-dash-insight__icon {
	font-size: 0.9rem;
	flex-shrink: 0;
}

.mock-dash-insight__text {
	font-size: 0.68rem;
	color: #3b0764;
	line-height: 1.4;
}

/* Flow de nodos n8n → Claude */
.mock-dash-flow {
	display: flex;
	align-items: center;
	gap: 5px;
	flex-wrap: wrap;
	opacity: 0;
	animation: mock-bubble-in 0.4s 4.0s ease forwards;
}

.mock-dash-node {
	font-size: 0.62rem;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 100px;
}

.mock-dash-node--trigger { background: #fef3c7; color: #92400e; }
.mock-dash-node--n8n     { background: #dbeafe; color: #1e40af; }
.mock-dash-node--claude  { background: #ede9fe; color: #5b21b6; }
.mock-dash-node--dash    { background: #dcfce7; color: #166534; }

.mock-dash-arrow {
	font-size: 0.7rem;
	color: #9ca3af;
}

/* ── Mockup Facturas ─────────────────────────────────────────── */
.mock-facturas {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 0;
	font-size: 0.78rem;
}

.mock-fact-step {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 10px 12px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.06);
	opacity: 0;
	animation: mock-bubble-in 0.4s ease forwards;
}

.mock-fact-step--anim-1 { animation-delay: 0.3s; }
.mock-fact-step--anim-3 { animation-delay: 1.8s; }

.mock-fact-step__icon {
	width: 36px;
	height: 36px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.mock-fact-step__icon--gmail { background: #fce8e6; }
.mock-fact-step__icon--drive { background: #e6f4ea; }

.mock-fact-step__body {
	flex: 1;
	min-width: 0;
}

.mock-fact-step__title {
	font-weight: 700;
	color: #111827;
	font-size: 0.72rem;
}

.mock-fact-step__file {
	font-size: 0.65rem;
	color: #6b7280;
	margin-top: 2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mock-fact-step__size {
	color: #9ca3af;
}

.mock-fact-badge {
	font-size: 0.62rem;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 100px;
	flex-shrink: 0;
}

.mock-fact-badge--new   { background: #fef3c7; color: #92400e; }
.mock-fact-badge--saved { background: #dcfce7; color: #166534; }

/* Conector entre pasos */
.mock-fact-connector {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	padding: 2px 0;
	opacity: 0;
	animation: mock-bubble-in 0.4s ease forwards;
}

.mock-fact-connector--anim-2 { animation-delay: 1.1s; }
.mock-fact-connector--anim-4 { animation-delay: 2.6s; }

.mock-fact-connector__line {
	width: 2px;
	height: 10px;
	background: #d1d5db;
}

.mock-fact-connector__label {
	font-size: 0.62rem;
	color: #6b7280;
	font-weight: 600;
}

/* Google Sheets mini tabla */
.mock-fact-sheets {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,0.06);
	opacity: 0;
	animation: mock-bubble-in 0.4s 3.4s ease forwards;
}

.mock-fact-sheets__topbar {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 12px;
	background: #f0fdf4;
	border-bottom: 1px solid #bbf7d0;
	font-size: 0.7rem;
	font-weight: 600;
	color: #166534;
}

.mock-fact-sheets__auto {
	margin-left: auto;
	font-size: 0.62rem;
	background: #166534;
	color: #fff;
	padding: 1px 6px;
	border-radius: 100px;
}

.mock-fact-table {
	padding: 6px 12px 10px;
}

.mock-fact-table__head {
	display: grid;
	grid-template-columns: 2fr 1fr 1.2fr 1fr;
	gap: 4px;
	padding: 4px 0;
	border-bottom: 1px solid #e5e7eb;
	font-size: 0.6rem;
	font-weight: 700;
	color: #6b7280;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.mock-fact-table__row {
	display: grid;
	grid-template-columns: 2fr 1fr 1.2fr 1fr;
	gap: 4px;
	align-items: center;
	padding: 5px 0;
	border-bottom: 1px solid #f3f4f6;
	font-size: 0.68rem;
	color: #374151;
	opacity: 0;
	animation: mock-bubble-in 0.4s ease forwards;
}

.mock-fact-row--anim-1 { animation-delay: 3.7s; }
.mock-fact-row--anim-2 { animation-delay: 4.1s; }
.mock-fact-row--anim-3 { animation-delay: 4.5s; }

.mock-fact-row--highlight {
	background: #f0fdf4;
	border-radius: 4px;
	margin: 0 -4px;
	padding-left: 4px;
	padding-right: 4px;
}

.mock-fact-tag {
	font-size: 0.6rem;
	font-weight: 700;
	padding: 2px 6px;
	border-radius: 100px;
}

.mock-fact-tag--ok  { background: #dcfce7; color: #166534; }
.mock-fact-tag--new { background: #fef3c7; color: #92400e; animation: mock-pulse 1.5s infinite; }

/* ── Accesibilidad ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	.mock-bubble,
	.mock-channel-label,
	.mock-typing,
	.mock-kanban__card--anim-enter,
	.mock-kanban__card--anim-enter-2,
	.mock-kanban__card--moving,
	.mock-gmail__email,
	.mock-dash-kpi,
	.mock-dash-chart,
	.mock-dash-bar::before,
	.mock-dash-insight,
	.mock-dash-flow,
	.mock-fact-step,
	.mock-fact-connector,
	.mock-fact-sheets,
	.mock-fact-table__row {
		animation: none;
		opacity: 1;
	}

	.mock-dash-bar::before {
		height: var(--bar-h, 60%);
	}

	.eca-slide {
		animation: none;
	}
}
