/* PF Timeline — elemento para Impreza */
.w-pftimeline {
	--pf-tl-accent: var(--color-content-primary, #3b8beb);
	--pf-tl-line: var(--color-content-border, #e5e5e5);
	--pf-tl-meta-width: 160px;
	--pf-tl-col-gap: 20px;
	--pf-tl-gap: 48px;
	--pf-tl-marker-size: 16px;
	--pf-tl-marker-border: 3px;
	position: relative;
	max-width: 100%;
}

.w-pftimeline .pf-timeline__list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

/* Línea vertical continua, centrada en la columna del marcador */
.w-pftimeline .pf-timeline__list::before {
	content: "";
	position: absolute;
	top: 0.6em;
	bottom: 0;
	left: calc(var(--pf-tl-meta-width) + var(--pf-tl-col-gap) + var(--pf-tl-marker-size) / 2);
	width: 1px;
	background: var(--pf-tl-line);
	transform: translateX(-50%);
}

.w-pftimeline .pf-timeline__item {
	display: grid;
	grid-template-columns: var(--pf-tl-meta-width) var(--pf-tl-marker-size) minmax(0, 1fr);
	column-gap: var(--pf-tl-col-gap);
	align-items: start;
	margin: 0 0 var(--pf-tl-gap);
	padding: 0;
}

.w-pftimeline .pf-timeline__item:last-child {
	margin-bottom: 0;
}

.w-pftimeline .pf-timeline__meta {
	text-align: right;
}

/* El periodo es un h5: hereda fuente, peso y color del tema; solo se ajusta el margen */
.w-pftimeline .pf-timeline__period {
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.w-pftimeline .pf-timeline__company {
	display: block;
	color: var(--color-content-faded, #a0a0a0);
}

.w-pftimeline .pf-timeline__marker {
	position: relative;
	z-index: 1;
	display: block;
	width: var(--pf-tl-marker-size);
	height: var(--pf-tl-marker-size);
	margin-top: 0.4em;
	border-radius: 50%;
	background: var(--color-content-bg, #fff);
	border: var(--pf-tl-marker-border) solid var(--pf-tl-accent);
	box-sizing: border-box;
}

.w-pftimeline.marker_filled .pf-timeline__marker {
	background: var(--pf-tl-accent);
}

/* El título es un h4: hereda el estilo del tema; solo se ajusta el margen */
.w-pftimeline .pf-timeline__title {
	margin: 0 0 0.5em;
}

.w-pftimeline .pf-timeline__title a {
	color: inherit;
	text-decoration: none;
}

.w-pftimeline .pf-timeline__title a:hover {
	color: var(--pf-tl-accent);
}

/* La descripción no lleva estilos propios: hereda el <p> del tema */
.w-pftimeline .pf-timeline__text > :last-child {
	margin-bottom: 0;
}

/* Animación de entrada (solo si está activada) */
.pf-timeline--animate .pf-timeline__item {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .6s ease, transform .6s ease;
}

.pf-timeline--animate .pf-timeline__item.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.pf-timeline--animate .pf-timeline__item {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* Móvil: fechas encima del contenido, línea a la izquierda */
@media (max-width: 767px) {
	.w-pftimeline .pf-timeline__list::before {
		left: calc(var(--pf-tl-marker-size) / 2);
	}

	.w-pftimeline .pf-timeline__item {
		grid-template-columns: var(--pf-tl-marker-size) minmax(0, 1fr);
		grid-template-areas:
			"marker meta"
			"marker content";
	}

	.w-pftimeline .pf-timeline__marker  { grid-area: marker; }
	.w-pftimeline .pf-timeline__meta    { grid-area: meta; text-align: left; margin-bottom: 0.5em; }
	.w-pftimeline .pf-timeline__content { grid-area: content; }
}
