/* ============================================================
   "Geeft vorm door co-creatie" outro (tf-cocreatie-outro)
   Значення 1:1 з app CSS: o-band / subtitle / s-text--large /
   g-container-small / c-btn--ghost
   ============================================================ */
   .tf-cocreatie-outro{ --tf-blue:#3273eb; --tf-accent:#eb6049; background:#f9f9fd; }

/* секція: g-container-small (гутери) + o-band (вертикаль) */
.e-con.tf-cocreatie-outro{
	display:flex;
	flex-direction:column;
	align-items:flex-start;                 /* оригінал не центрує; лівий край */
	gap:1.171875rem;                         /* .s-text grid-gap (subtitle → текст) */
	padding:4.6875rem 1.5625rem;             /* o-band + g-container-small (base) */
}
.tf-cocreatie-outro > .elementor-widget{ margin:0; }

/* subtitle */
.tf-cocreatie-outro-eyebrow .elementor-heading-title{
	margin:0 0 .625rem;
	color: #3273eb;
	font-size:.625rem; font-weight:500;
	letter-spacing:.15em; line-height:1.1; text-transform:uppercase;
}

/* великий текст (.s-text--large) */
.tf-cocreatie-outro-text{ color:#000; font-size:1.375rem; line-height:1.875rem; }
.tf-cocreatie-outro-text p{ margin:0; }

/* CTA (.c-btn--ghost) */
.tf-cocreatie-outro-cta{ margin-top:1.5rem; }
.tf-cocreatie-outro-cta .elementor-button{
	position:relative; overflow:hidden; z-index:1;
	display:inline-flex; align-items:center; justify-content:center;
	height:3.75rem; padding:0 2.1875rem;
	border:.0625rem solid var(--tf-accent); border-radius:.625rem;
	background-color:transparent; color:var(--tf-accent);
	font-size:.8125rem; font-weight:500; letter-spacing:.15em;
	line-height:3.625rem; text-transform:uppercase; white-space:nowrap;
	transition:background-color .5s cubic-bezier(.22,.61,.36,1),
	color .5s cubic-bezier(.22,.61,.36,1),
	border-color .5s cubic-bezier(.22,.61,.36,1);
}
.tf-cocreatie-outro-cta .elementor-button .elementor-button-icon{ display:none !important; }
.tf-cocreatie-outro-cta .elementor-button::before{     /* c-btn-bg: коло */
	content:""; position:absolute; z-index:-1;
	top:var(--y,50%); left:var(--x,50%);
	width:0; height:0; border-radius:50%;
	background:var(--tf-blue); transform:translate(-50%,-50%);
	transition:width .4s ease-in-out, height .4s ease-in-out;
}
.tf-cocreatie-outro-cta .elementor-button:hover,
.tf-cocreatie-outro-cta .elementor-button:focus{
	background-color:transparent;
	border-color:var(--tf-blue);
	color:#fff;
}
.tf-cocreatie-outro-cta .elementor-button:hover::before,
.tf-cocreatie-outro-cta .elementor-button:focus::before{ width:250%; height:250%; }
.tf-cocreatie-outro-cta .elementor-button .elementor-button-content-wrapper{ position:relative; z-index:1; }

/* ---- ≥768px ---- */
@media (min-width:768px){
	.e-con.tf-cocreatie-outro{ padding:6rem 3rem; }
	.tf-cocreatie-outro-eyebrow .elementor-heading-title{ font-size:.6875rem; }
	.tf-cocreatie-outro-text{ font-size:1.5rem; line-height:2.0625rem; }
}

/* ---- ≥992px ---- */
@media (min-width:992px){
	.e-con.tf-cocreatie-outro{ padding:8rem 4rem; }
	.tf-cocreatie-outro-cta .elementor-button{
		margin-top: 32px;
	}
}

/* ---- ≥1200px ---- */
@media (min-width:1200px){
	.e-con.tf-cocreatie-outro{ padding:10rem 6rem; }
	.tf-cocreatie-outro-eyebrow .elementor-heading-title{ font-size:.8125rem; margin-bottom:.9375rem; }
	.tf-cocreatie-outro-text{ font-size:1.875rem; line-height:2.6875rem; }
}

/* ---- ≥1550px ---- */
@media (min-width:1550px){
	.e-con.tf-cocreatie-outro{ gap: 0; padding:12.5rem 12.5rem; }
	.tf-cocreatie-outro-text{ font-size:2.375rem; line-height:3.375rem; }
}

/* ---- ≥1800px ---- */
@media (min-width:1800px){
	.e-con.tf-cocreatie-outro{ padding:12.5rem 20rem; }
}