/* ============================================================
   "Duurzaamheid" stats + bar chart — Elementor
   ============================================================ */
   .tf-duurzaam-stats{ --tf-blue:#3273eb; --tf-green:#33ca75;  background: #fff}

/* ---- base (xs) ---- */
.e-con.tf-duurzaam-stats{
	display:flex;
	flex-direction:column;
	gap:1.5625rem;
	padding:0 1.5625rem 4.6875rem;      /* u-pt-0 → верх 0, низ = o-band */
}
.tf-duurzaam-stats > .elementor-widget{ margin:0; }

/* subtitle */
.tf-duurzaam-stats-title .elementor-heading-title{
	margin:0;
	color:var(--tf-blue);
	font-size:.625rem;
	font-weight:500;
	letter-spacing:.15em;
	line-height:1.6;
	text-transform:uppercase;
}

/* абзаци (.s-text) */
.tf-duurzaam-stats-intro,
.tf-duurzaam-stats-body,
.tf-duurzaam-stats-outro{ color:#000; font-size:1rem; line-height:1.6666666667; }
.tf-duurzaam-stats-intro p,
.tf-duurzaam-stats-body p,
.tf-duurzaam-stats-outro p{ margin:0; }

/* ---- CHART (c-progress--grid) ---- */
.tf-duurzaam-chart{
	display:grid;
	grid-template-columns:repeat(2,1fr);   /* mobile: 2 колонки */
	gap:.625rem;
	align-items:end;                        /* align-self-end → сходинка знизу */
}
.tf-duurzaam-chart__bar{
	display:flex;
	flex-direction:column;
	justify-content:space-between;          /* year зверху, label знизу, pct посередині */
	align-items:center;
	text-align:center;
	gap:.5rem;
	padding:1rem .75rem;
	border-radius:.625rem;                  /* 10px кути як у rect */
	background:var(--tf-green);
	color:#fff;
}

/* CHART — 6 окремих SVG, сходинка знизу */
.tf-duurzaam-chart{
	display:grid;
	grid-template-columns:repeat(2,1fr);   /* mobile */
	gap:.625rem;
	align-items:end;
	width: 100%;
	margin-bottom: 12px;                        /* align-self-end → вирівняні по низу */
}
@media (min-width:768px){
	.tf-duurzaam-chart{ grid-template-columns:repeat(6,1fr); }
}
.tf-duurzaam-chart svg{ display:block; width:100%; height:auto; font-family:inherit; }
.tf-bar__year { fill:#fff; font-size:22px; font-weight:600; }
.tf-bar__pct  { fill:#fff; font-size:40px; font-weight:800; }
.tf-bar__label{ fill:#fff; font-size:14px; font-weight:600; letter-spacing:1px; }

/* ---- ≥768px ---- */
@media (min-width:768px){
	.e-con.tf-duurzaam-stats{ gap:1rem; padding:0 3rem 6rem; }
	.tf-duurzaam-chart{ grid-template-columns:repeat(6,1fr); }   /* всі 6 в ряд */
	.tf-duurzaam-stats-title .elementor-heading-title{ font-size:.6875rem; }
	.tf-duurzaam-stats-intro,
	.tf-duurzaam-stats-body,
	.tf-duurzaam-stats-outro{ font-size:1.125rem; line-height:1.875rem; }
}

/* ---- ≥992px ---- */
@media (min-width:992px){
	.e-con.tf-duurzaam-stats{ gap:2rem; padding:0 4rem 8rem; }
}

/* ---- ≥1200px ---- */
@media (min-width:1200px){
	.e-con.tf-duurzaam-stats{ padding:0 6rem 10rem; }
	.tf-duurzaam-stats-title .elementor-heading-title{ font-size:.8125rem; margin-bottom: -20px; }
	.tf-duurzaam-stats-intro,
	.tf-duurzaam-stats-body,
	.tf-duurzaam-stats-outro{ font-size:1.25rem; line-height:2.25rem; }
}

/* ---- ≥1550px ---- */
@media (min-width:1550px){
	.e-con.tf-duurzaam-stats{ padding:0 17.5rem 12.5rem; }
	.tf-duurzaam-stats-intro,
	.tf-duurzaam-stats-body,
	.tf-duurzaam-stats-outro{ font-size:1.5rem; line-height:2.5rem; }
	.tf-duurzaam-chart__pct{ font-size: 36px; }
}

/* ---- ≥1800px ---- */
@media (min-width:1800px){
	.e-con.tf-duurzaam-stats{ padding:0 25rem 12.5rem; }
}

.tf-duurzaam-chart svg{
	opacity:0;
	transform:translateY(40px);
	transition:opacity .6s cubic-bezier(.22,.61,.36,1),
	transform .6s cubic-bezier(.22,.61,.36,1);
	transition-delay:var(--tf-delay,0ms);
	will-change:opacity,transform;
}
.tf-duurzaam-chart.is-visible svg{
	opacity:1;
	transform:translateY(0);
}

/* доступність: без анімації для тих, хто її вимкнув */
@media (prefers-reduced-motion:reduce){
	.tf-duurzaam-chart svg{ opacity:1; transform:none; transition:none; }
}