/* Platecraft Addons – Icon List. */

.pil {
	--pil-icon: 1em;
	--pil-gap: 12px;
	--pil-row-gap: 12px;
	--pil-col-gap: 28px;
	--pil-div-w: 1px;
	--pil-div-c: rgba(0, 0, 0, 0.1);
	--pil-join-w: 2px;
	--pil-join-c: rgba(194, 65, 12, 0.3);
	display: flex;
	flex-direction: column;
	gap: var(--pil-row-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}
.pil--grid {
	display: grid;
	/* "All in one line" (--pil-line: none, flow column): each item a column of its own, as wide as its text. */
	grid-template-columns: var(--pil-line, var(--pil-grid-cols, repeat(var(--pil-cols, 2), minmax(0, 1fr))));
	grid-auto-flow: var(--pil-flow, row);
	justify-content: var(--pil-justify, start);
	gap: var(--pil-row-gap) var(--pil-col-gap);
}
.pil--grid .pil__item {
	justify-content: var(--pil-justify, flex-start);
}
.pil--inline {
	flex-flow: row wrap;
	justify-content: var(--pil-justify, flex-start);
	gap: var(--pil-row-gap) var(--pil-col-gap);
}
.pil--list {
	align-items: var(--pil-justify, stretch);
}
.pil__item {
	position: relative;
	margin: 0;
	padding: 0;
	transition: transform 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}
.pil__item,
.pil__link {
	display: flex;
	align-items: var(--pil-valign, flex-start);
	gap: var(--pil-gap);
}
.pil__link {
	color: inherit;
	text-decoration: none;
}
.pil__marker {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	min-width: var(--pil-box, auto);
	height: var(--pil-box, auto);
	margin-top: 0.15em;
	border-radius: 50%;
	color: #c2410c;
	font-size: var(--pil-icon);
	font-weight: 700;
	line-height: 1;
	transition: color 0.3s ease, background-color 0.3s ease;
}
.pil__marker svg {
	width: var(--pil-icon);
	height: var(--pil-icon);
	fill: currentColor;
}
.pil__body {
	display: block;
	min-width: 0;
	text-align: var(--pil-ta); /* not set: as the page */
}
.pil__text {
	/* With a smaller font than the item, sitting on the baseline made each
	   line 1px taller than the Line Height that was set. */
	vertical-align: top;
	transition: color 0.3s ease;
}
.pil__sub {
	display: block;
	margin-top: 2px;
	color: color-mix(in srgb, currentColor 70%, transparent);
	font-size: 0.875em;
}
.pil__badge {
	display: inline-block;
	margin-left: 6px;
	padding: 2px 8px;
	border-radius: 999px;
	background-color: #fdf2ec;
	color: #c2410c;
	font-size: 0.72em;
	font-weight: 700;
	line-height: 1.5;
	vertical-align: 0.15em;
}

/* Lines between items. */
.pil--divider.pil--list .pil__item:not(:last-child),
.pil--divider.pil--grid .pil__item {
	padding-bottom: var(--pil-div-space, var(--pil-row-gap));
	border-bottom: var(--pil-div-w) var(--pil-div-style, solid) var(--pil-div-c);
}
/* In a row: a short line in the middle of the gap. */
.pil--divider.pil--inline .pil__item:not(:last-child)::after {
	content: "";
	position: absolute;
	top: calc((100% - var(--pil-div-len, 70%)) / 2);
	right: calc(var(--pil-col-gap) / -2);
	bottom: calc((100% - var(--pil-div-len, 70%)) / 2);
	border-right: var(--pil-div-w) var(--pil-div-style, solid) var(--pil-div-c);
}

/* A line joining the icons (one under the other). */
.pil--join .pil__item:not(:last-child)::after {
	content: "";
	position: absolute;
	top: calc(0.15em + var(--pil-box, var(--pil-icon)) + 6px);
	bottom: calc(var(--pil-row-gap) * -1 + 6px);
	left: calc(var(--pil-box, var(--pil-icon)) / 2);
	border-left: var(--pil-join-w) var(--pil-join-style, solid) var(--pil-join-c);
	transform: translateX(-50%);
}

/* Items coming in one by one. */
.pil--reveal .pil__item {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.5s ease calc(var(--pil-i, 0) * 0.09s), transform 0.5s ease calc(var(--pil-i, 0) * 0.09s), background-color 0.3s ease;
}
.pil--reveal.is-shown .pil__item {
	opacity: 1;
	transform: none;
}
.elementor-editor-active .pil--reveal .pil__item {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.pil--reveal .pil__item {
		opacity: 1;
		transform: none;
		transition: none;
	}
}