.about-europass__wrapper {
	color: #575756 !important;
	/* margin-bottom: 40px; */
}
.about-europass {
	position: relative;
}

.about-europass__wrapper::before {
	content: "";
	position: absolute;
	top: 40px; /* змістити вниз, як на макеті */
	right: 0;
	width: 27%;
	height: 100%;
	background-color: #f2f2f7; /* світло-сірий */
	z-index: -1;
	clip-path: polygon(0% 91%, 0% 9%, 100% 6%, 100% 94%);
}
.about-europass__header {
	font-size: 40px;
}
.about-europass__content {
	font-size: 16px;
	margin-top: 40px;
}

.about-europass__content__text {
	width: 50%;
}
.about-europass__img {
	width: 50%;
	clip-path: polygon(0% 100%, 8% 8%, 95% 0%, 100% 90%);
	overflow: hidden;
}
.tools-pill-card {
	box-shadow: 0px 4px 6px 0px #00000040;
}
.tools-pill-card p {
	margin: 0;
}

/* 💻 MD – планшети горизонтально */
@media (max-width: 1024px) {
	.about-europass__wrapper {
		color: #575756 !important;
	}
	.about-europass__wrapper::before {
		top: 26px;
	}
	.about-europass__header {
		font-size: 30px;
	}
	.about-europass__content {
		font-size: 14px;
		margin-top: 20px;
	}

	.about-europass__content__text {
		width: 50%;
	}
	.about-europass__img {
		width: 50%;
		clip-path: polygon(0% 100%, 8% 8%, 95% 0%, 100% 90%);
		overflow: hidden;
	}
}

/* 📱 SM – планшети вертикально */
@media (max-width: 781px) {
	.abaut-europas__hero-wrapper .bg-polygon.bg-polygon-square::after {
		height: 17em;
	}
	.ebaut-europass__hero__image img {
		max-height: 290px;
		width: auto !important;
	}

	.ebaut-europass__hero__image {
		display: flex;
		justify-content: center;
	}
}


@media (max-width: 768px) {
	.abaut-europas__hero-wrapper .bg-polygon.bg-polygon-square::after {
		height: 17em;
	}
	.ebaut-europass__hero__image img {
		max-height: 290px;
		width: auto !important;
	}

	.ebaut-europass__hero__image {
		display: flex;
		justify-content: center;
	}

	.tools-pill-card {
		padding-top: var(--wp--preset--spacing--30) !important;
		padding-right: var(--wp--preset--spacing--30) !important;
		padding-bottom: var(--wp--preset--spacing--30) !important;
		padding-left: var(--wp--preset--spacing--30) !important;
	}
	.about-europass__content {
		display: flex;
		flex-direction: column;
	}

	.about-europass__content__text {
		width: 100%;
	}
	.about-europass__img {
		width: 100%;
		clip-path: polygon(0% 100%, 8% 8%, 95% 0%, 100% 90%);
		overflow: hidden;
	}

	.about-europass__wrapper::before {
		content: "";
		position: absolute;
		top: auto !important; /* змістити вниз, як на макеті */
		bottom: -35px;
		right: 0;
		width: 46%;
		height: 67vw;
		background-color: #f2f2f7; /* світло-сірий */
		z-index: -1;
		clip-path: polygon(0% 91%, 0% 9%, 100% 6%, 100% 94%);
	}

	/*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */ /*  */
}

/* 📱 XS – великі телефони */
@media (max-width: 576px) {
	.about-europass__wrapper::before {
		bottom: -35px;
		height: 70vw;
	}
}

/* 📱 XXS – маленькі телефони (iPhone SE) */
@media (max-width: 375px) {
	.about-europass__wrapper::before {
		bottom: -30px;
		height: 71vw;
	}
}

/* базові змінні */
.tools-pill-card {
	--card-pad: var(--wp--preset--spacing--50);
	position: relative;
	overflow: hidden;
	border-radius: 100px;
}

/* маленька підкладка рівно під .icon-container */
.icon-container {
	position: relative;
	z-index: 0;
}
.icon-container::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 100px;
	background: linear-gradient(88deg, #c65094 0%, #4884c3 50%, #6c3088 100%);
	z-index: 0;
	transition: opacity 0.25s ease;
}

/* розлив: між врапером іконки та IMG/контентом */
.tools-pill-card::before {
	content: "";
	position: absolute;
	top: var(--card-pad);
	bottom: var(--card-pad);
	left: var(--card-pad);
	width: 0; /* старт з нуля, розширюється лише вправо */
	opacity: 0; /* і з прозорості 0 */
	border-radius: 100px;
	background: linear-gradient(88deg, #c65094 0%, #4884c3 50%, #6c3088 100%);
	z-index: 1; /* ← між фоном контейнера і зображенням */
	transition:
		width 0.45s ease,
		opacity 0.45s ease;
}

/* контент та IMG вище розливу */
.tools-pill-card > * {
	position: relative;
	z-index: 2;
}
.icon-container img {
	position: relative;
	z-index: 2;
}

/* hover: ширина до внутрішніх меж падінга + робимо видимим; маленьку гасимо */
.wp-block-tiptip-hyperlink-group-block:hover .tools-pill-card::before,
.tools-pill-card:hover::before {
	width: calc(100% - var(--card-pad) * 2);
	opacity: 1;
}

.wp-block-tiptip-hyperlink-group-block:hover .icon-container::before,
.tools-pill-card:hover .icon-container::before {
	opacity: 0;
}

/* опційно — білий текст на градієнті */
.wp-block-tiptip-hyperlink-group-block .tools-pill-card p,
.wp-block-tiptip-hyperlink-group-block .tools-pill-card strong {
	transition: color 0.2s;
}
.wp-block-tiptip-hyperlink-group-block:hover .tools-pill-card p,
.wp-block-tiptip-hyperlink-group-block:hover .tools-pill-card strong {
	color: #fff !important;
}

/* мобільне коригування відступів картки */
@media (max-width: 768px) {
	.tools-pill-card {
		--card-pad: var(--wp--preset--spacing--30);
	}
}

/* reduce motion */
@media (prefers-reduced-motion: reduce) {
	.tools-pill-card::before,
	.icon-container::before {
		transition: none;
	}
}