	.fl-section-doctors {
		padding: 20px 0;
	}

	.fl-section-doctors .container {
		max-width: 1200px;
	}

	.fl-section-doctors .fl-page-section-title {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		margin-bottom: 20px;
	}

	.fl-page-section-title h2 {
		margin: 0;
		font-size: 36px;
		font-weight: 700;
		line-height: 135%;
		color: #2B2B2B;
	}

	.fl-section-doctors .fl-text-under-title {
		font-size: 18px;
		font-weight: 500;
		line-height: 160%;
		color: #656565;
		margin-top: 16px;
		margin-bottom: 50px;
		text-align: center;
	}

	.fl-section-doctors .fl-text-under-title p {
		margin: 0;
		margin-bottom: 8px;
	}

	/* Стилі для сітки постів */
	.fl-doctor-grid {
		display: block;
		width: 100%;
	}

	.fl-doctor-item {
		width: calc(33.33% - 18px);
		margin-right: 18px;
		margin-bottom: 18px;

		padding: 24px;
		background-color: #fff;
		box-shadow: 0 2px 26px 0 #0000000D;
		border-radius: 16px;
		overflow: hidden;
		/* Щоб зображення не виходило за межі */
		display: flex;
		flex-direction: column;
		/* Елементи всередині йдуть зверху вниз */
		transition: box-shadow 0.3s ease;
	}

	.fl-doctor-item-thumbnail {
		position: relative;
		/* Щоб псевдоелемент позиціонувався відносно цього елемента */
		width: 100%;
		height: 310px;
		/* Фіксована висота зображення, можна адаптувати */
		overflow: hidden;

		border-radius: 16px;
		transition: background-color 0.3s ease;
	}

	.fl-doctor-item-thumbnail::before {
		content: '';
		/* Обов'язково для псевдоелемента */
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border-radius: 16px;
		/* Градієнт від прозорого до чорного (або іншого кольору) */
		background: linear-gradient(56.82deg, rgba(156, 120, 255, 0.4) -20.17%, rgba(223, 223, 223, 0) 58.24%);
		/* або, наприклад, від низу догори з кольором теми: */
		pointer-events: none;
		/* Дозволяє клікам проходити крізь оверлей до зображення/посилання */
		transition: background-color 0.3s ease;
		/* Для плавного ефекту при наведенні, якщо захочеш */
	}

	.fl-doctor-item-thumbnail img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		/* Щоб зображення заповнювало весь простір */
		display: block;
		margin-top: 20px;
		border-radius: 16px;
	}

	/* Кольори для 1, 4, 7... елементів */
	.fl-doctor-grid .fl-doctor-item:nth-child(3n+1):hover .fl-doctor-item-thumbnail {
		background-color: #A280FF;
		/* Перший колір */
	}

	/* Кольори для 2, 5, 8... елементів */
	.fl-doctor-grid .fl-doctor-item:nth-child(3n+2):hover .fl-doctor-item-thumbnail {
		background-color: #02B1C1;
		/* Другий колір */
	}

	/* Кольори для 3, 6, 9... елементів */
	.fl-doctor-grid .fl-doctor-item:nth-child(3n+3):hover .fl-doctor-item-thumbnail {
		background-color: #FEB201;
		/* Третій колір */
	}

	.fl-doctor-item-meta {
		display: flex;
		flex-direction: column;
		gap: 12px;

		margin: 24px 0;
		min-height: 150px;
	}

	.fl-doctor-item-cat {
		font-size: 18px;
		font-weight: 500;
		line-height: 150%;

		color: #656565;
	}

	.fl-doctor-item-title {
		margin: 0;
		width: 92%;

		font-size: 24px;
		font-weight: 600;
		line-height: 150%;

		color: #2B2B2B;
	}

	.fl-doctor-item-title a {
		text-decoration: none;
		color: #2B2B2B;
		transition: color 0.2s ease;
	}


	.fl-doctor-item-patiens {
		font-size: 18px;
		font-weight: 700;
		line-height: 150%;
		color: #936BFF;
	}

	.fl-doctor-item-btn {
		display: flex;
	}

	.fl-doctor-item-btn a {
		border: 2px solid #936BFF;
		border-radius: 8px;

		padding: 20px 32px;
		width: 100%;

		font-size: 18px;
		font-weight: 700;
		line-height: 150%;
		text-align: center;
		text-decoration: none;
		color: #936BFF;

		transition: background 200ms ease-in;
	}

	.fl-doctor-item-btn a:hover {
		background-color: #936BFF;
		color: #fff;
	}

	.fl-doctor-grid-nav {
		margin-top: 30px;

		display: flex;
		gap: 12px;
		justify-content: center;
		align-items: center;

		cursor: pointer;
	}

	.fl-doctor-grid-nav .custom-nav-btn svg {
		width: 36px;
		height: 36px;
		object-fit: contain;
	}

	.fl-doctor-grid-nav .custom-nav-btn:hover svg circle {
		fill: #936BFF;
		stroke: #936BFF;
	}

	.fl-doctor-grid-nav .custom-nav-btn:hover svg path {
		fill: #fff;
	}

	.fl-doctor-grid-nav .prev-btn.is-disabled,
	.fl-doctor-grid-nav .next-btn.is-disabled {
		opacity: 0.5;
		/* Зменшуємо прозорість */
		pointer-events: none;
		/* Робимо кнопку не клікабельною */
		cursor: default;
		/* Змінюємо курсор, щоб показати неактивність */
	}


	@media(max-width: 767px) {
		.fl-section-doctors {
			padding-top: 24px;
			padding-bottom: 40px;
		}

		.fl-doctor-item {
			padding: 16px;

			width: calc(80% - 12px);
			margin-left: 12px;
			margin-right: 12px;
			margin: 20px 12px 20px 12px;

			border: 1px solid #9670FF;
		}

		.fl-doctor-item-title {
			font-size: 20px;
		}

		.fl-section-doctors .fl-text-under-title {
			margin-bottom: 12px;
		}
	}