.puffar {
	gap: var(--space-xs);
}

@media screen and (min-width: 1026px) {
	.puffar--list ul {
		columns: 3;
		column-gap: var(--space-m);
	}
}
@media screen and (max-width: 1025px) {
	.puffar--list ul {
		padding: 15px 35px;
	}
}
.puffar--list ul {
	margin: 0;
	list-style: none;
	padding-bottom: 0;
}
.puffar--list ul li {
	margin-bottom: var(--space-s);
	position: relative;
	&::before {
		content: "";
		position: absolute;
		left: -18px;
		top: 8px;
		width: 5px;
		height: 5px;
		background: var(--accent-light);
	}
}
@media screen and (max-width: 1025px) {
	.puffar--list ul li {
		margin-bottom: var(--space-m);
	}
	.puffar--list ul li:last-child {
		margin: 0;
	}
}

.puff h3,
.puffar .puff__content {
	padding-left: 40px;
}
@media screen and (min-width: 1026px) {
	.puffar--list .puff__content {
		padding-left: 20px;
	}
}

.puff {
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}
.puff h3::before {
	content: "";
	position: absolute;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
	width: 12px;
	height: 12px;
	background: var(--accent);
}

.puff .line-component {
	position: absolute;
}

.puffar .puff {
	padding-top: 2rem;
}
@media screen and (max-width: 1025px) {
	.puffar .puff {
		padding-bottom: 1rem;
	}
}
