/* =====================================================================
   Webolimp — тема поверх SmartStore (подключается последней в head.php)
   Палитра «динамичного продвижения»: электрический фиолетовый, фуксия,
   закатный оранжевый + неоновый лайм для акцентов.
   ===================================================================== */

:root,
[data-bs-theme=light] {
	--wo-violet: #7c3aed;
	--wo-violet-2: #8b5cf6;
	--wo-magenta: #ec4899;
	--wo-orange: #f97316;
	--wo-lime: #a3e635;
	--wo-cyan: #22d3ee;
	--wo-grad: linear-gradient(120deg, #7c3aed 0%, #ec4899 52%, #f97316 100%);
	--wo-grad-soft: linear-gradient(120deg, rgba(124, 58, 237, .12), rgba(236, 72, 153, .12) 52%, rgba(249, 115, 22, .12));
	--wo-glow: 0 10px 30px -8px rgba(236, 72, 153, .55), 0 6px 18px -10px rgba(124, 58, 237, .6);
	--wo-surface: #ffffff;
	--wo-border: rgba(124, 58, 237, .14);

	--bs-primary: #7c3aed;
	--bs-primary-rgb: 124, 58, 237;
	--bs-primary-text-emphasis: #5b21b6;
	--bs-primary-bg-subtle: #ede9fe;
	--bs-primary-border-subtle: #c4b5fd;
	--bs-link-color: #7c3aed;
	--bs-link-color-rgb: 124, 58, 237;
	--bs-link-hover-color: #db2777;
	--bs-link-hover-color-rgb: 219, 39, 119;
	--bs-focus-ring-color: rgba(124, 58, 237, .25);
	--bs-body-bg: #faf9ff;
	--bs-tertiary-bg: #f3f0ff;
	--surface-color: #ffffff;
	--contrast-color: #ffffff;
}

[data-bs-theme=dark] {
	--wo-surface: #15122b;
	--wo-border: rgba(167, 139, 250, .16);
	--bs-primary: #a78bfa;
	--bs-primary-rgb: 167, 139, 250;
	--bs-primary-text-emphasis: #c4b5fd;
	--bs-primary-bg-subtle: #2a1f52;
	--bs-primary-border-subtle: #4c3a8f;
	--bs-link-color: #c4b5fd;
	--bs-link-color-rgb: 196, 181, 253;
	--bs-link-hover-color: #f9a8d4;
	--bs-link-hover-color-rgb: 249, 168, 212;
	--bs-body-bg: #0b0a1a;
	--bs-body-bg-rgb: 11, 10, 26;
	--bs-secondary-bg: #1a1734;
	--bs-tertiary-bg: #110f24;
	--bs-tertiary-bg-rgb: 17, 15, 36;
	--bs-border-color: #2a2650;
	--surface-color: #15122b;
}

body {
	background-color: var(--bs-body-bg);
}

/* ---------- Текст и ссылки ---------- */
.text-primary {
	color: rgba(var(--bs-primary-rgb), 1) !important;
}

.wo-grad-text,
section.header-top h1 .text-primary,
.section-header .above-heading {
	background: var(--wo-grad);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent !important;
}

.section-header .above-heading {
	font-weight: 700;
	letter-spacing: .08em;
}

::selection {
	background: rgba(236, 72, 153, .25);
}

/* ---------- Кнопки ---------- */
.btn-primary,
.btn-primary:disabled {
	--bs-btn-color: #fff;
	--bs-btn-bg: #7c3aed;
	--bs-btn-border-color: transparent;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #6d28d9;
	--bs-btn-hover-border-color: transparent;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #5b21b6;
	--bs-btn-active-border-color: transparent;
	--bs-btn-focus-shadow-rgb: 124, 58, 237;
	background-image: var(--wo-grad);
	background-size: 200% 100%;
	background-position: 0% 50%;
	border: 0;
	box-shadow: var(--wo-glow);
	transition: background-position .5s ease, transform .2s ease, box-shadow .2s ease;
}

.btn-primary:hover,
.btn-primary:focus-visible {
	background-position: 100% 50%;
	transform: translateY(-1px);
	box-shadow: 0 14px 34px -8px rgba(236, 72, 153, .65), 0 8px 22px -10px rgba(124, 58, 237, .7);
}

.btn-outline-primary {
	--bs-btn-color: var(--bs-primary);
	--bs-btn-border-color: rgba(var(--bs-primary-rgb), .45);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #7c3aed;
	--bs-btn-hover-border-color: #7c3aed;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #6d28d9;
	--bs-btn-active-border-color: #6d28d9;
	--bs-btn-focus-shadow-rgb: 124, 58, 237;
}

.btn-outline-primary:hover {
	background-image: var(--wo-grad);
	border-color: transparent;
}

.btn-success {
	--bs-btn-bg: #65a30d;
	--bs-btn-border-color: #65a30d;
	--bs-btn-hover-bg: #4d7c0f;
	--bs-btn-hover-border-color: #4d7c0f;
}

.bg-primary {
	background-image: var(--wo-grad) !important;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
	border-color: #a78bfa;
	box-shadow: 0 0 0 .25rem rgba(124, 58, 237, .2);
}

.form-check-input:checked {
	background-color: #7c3aed;
	border-color: #7c3aed;
}

.spinner-grow.text-primary,
.spinner-border.text-primary {
	color: #ec4899 !important;
}

/* ---------- Меню ---------- */
.header-menu .text-dark.nav-link:hover,
[data-bs-theme=light] header.header-menu .offcanvas.show .text-dark.nav-link:hover {
	color: #ec4899 !important;
}

header.header-menu .offcanvas.show {
	background: #120f26;
}

/* ---------- Hero: живой градиентный фон ---------- */
section.header-top {
	isolation: isolate;
}

section.header-top .img-background {
	background: none !important;
}

section.header-top .img-background::before,
section.header-top .img-background::after {
	content: "";
	position: absolute;
	width: 46vw;
	height: 46vw;
	max-width: 620px;
	max-height: 620px;
	border-radius: 50%;
	filter: blur(70px);
	opacity: .45;
	z-index: -1;
	animation: wo-float 18s ease-in-out infinite alternate;
}

section.header-top .img-background::before {
	background: radial-gradient(circle, #8b5cf6 0%, rgba(139, 92, 246, 0) 70%);
	top: -18%;
	left: -8%;
}

section.header-top .img-background::after {
	background: radial-gradient(circle, #ec4899 0%, rgba(236, 72, 153, 0) 70%);
	bottom: -30%;
	right: -6%;
	animation-duration: 22s;
	animation-direction: alternate-reverse;
}

section.header-top .container {
	position: relative;
}

section.header-top .container::before {
	content: "";
	position: absolute;
	width: 320px;
	height: 320px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(249, 115, 22, .55) 0%, rgba(249, 115, 22, 0) 70%);
	filter: blur(60px);
	top: 10%;
	right: 18%;
	z-index: -1;
	animation: wo-float 14s ease-in-out infinite alternate-reverse;
	pointer-events: none;
}

[data-bs-theme=dark] section.header-top .img-background::before,
[data-bs-theme=dark] section.header-top .img-background::after {
	opacity: .55;
}

@keyframes wo-float {
	0% {
		transform: translate(0, 0) scale(1);
	}

	50% {
		transform: translate(6%, 8%) scale(1.12);
	}

	100% {
		transform: translate(-6%, -4%) scale(.95);
	}
}

@media (prefers-reduced-motion: reduce) {

	section.header-top .img-background::before,
	section.header-top .img-background::after,
	section.header-top .container::before {
		animation: none;
	}
}

/* ---------- Счётчики ---------- */
section.counts-area .count-box {
	background: var(--wo-surface);
	border: 1px solid var(--wo-border);
	box-shadow: 0 10px 30px -18px rgba(124, 58, 237, .45);
}

section.counts-area .count-box i {
	background: var(--wo-grad);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

section.counts-area .count-box span,
section.counts-area .odometer {
	color: var(--bs-primary) !important;
}

/* ---------- Пакеты ---------- */
.package-list-tab .buy-package-item .icon-square {
	background: var(--wo-grad);
}

.package-list-carousel .buy-package-item .icon-square {
	color: #db2777;
	background: #fce7f3;
}

section.package-list .tab-item.active .img-logo,
section.package-list .tab-item .img-logo:hover {
	border-color: #ec4899 !important;
	box-shadow: 0 0 0 3px rgba(236, 72, 153, .2);
}

.package-btn-list .buy-package-item {
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.package-btn-list .buy-package-item:hover {
	transform: translateY(-2px);
	border-color: rgba(236, 72, 153, .5) !important;
	box-shadow: 0 10px 24px -14px rgba(236, 72, 153, .7);
}

[data-bs-theme=dark] .tab-content .tab-item {
	background-image: linear-gradient(310deg, #120f26 0%, #1d1840 100%);
}

[data-bs-theme=dark] .package-btn-list .buy-package-item {
	background: #1d1840 !important;
	border-color: #2e2860;
}

[data-bs-theme=dark] .package-btn-list .buy-package-item:hover {
	background: #262055 !important;
}

/* ---------- Почему мы ---------- */
section.why-choose-us .icon-box {
	background: var(--wo-surface);
	border: 1px solid var(--wo-border);
	transition: transform .3s ease, box-shadow .3s ease;
}

section.why-choose-us .icon-box:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 40px -20px rgba(124, 58, 237, .55);
}

section.why-choose-us .icon-box i {
	background-color: rgba(124, 58, 237, .1);
	color: #7c3aed;
}

[data-bs-theme=dark] section.why-choose-us .icon-box i {
	color: #c4b5fd;
}

section.why-choose-us .icon-box:hover i,
section.why-choose-us .content .read-more {
	background: var(--wo-grad);
	color: #fff;
}

section.why-choose-us .content .read-more:hover {
	background: var(--wo-grad);
	filter: brightness(1.08);
}

/* ---------- Что мы предлагаем ---------- */
section.what-we-offer {
	background-image: linear-gradient(125deg, #5b21b6 0%, #7c3aed 30%, #db2777 70%, #f97316 100%);
	background-size: 160% 160%;
	animation: wo-pan 16s ease-in-out infinite alternate;
}

@keyframes wo-pan {
	from {
		background-position: 0% 40%;
	}

	to {
		background-position: 100% 60%;
	}
}

section.group-features .feature-icons .content .icon-box .icon {
	background-color: #a3e635;
	color: #1a2e05;
}

/* ---------- Как это работает ---------- */
section.how-it-work .single_work_step:hover .step-icon::after,
section.how-it-work .single_work_step:focus .step-icon::after {
	border-color: #ec4899;
}

section.how-it-work .single_work_step:hover .step-icon i,
section.how-it-work .single_work_step:focus .step-icon i,
section.how-it-work .single_work_step:hover h5,
section.how-it-work .single_work_step:focus h5,
section.how-it-work .single_work_step:focus::before {
	color: #db2777;
}

/* ---------- Отзывы, CTA, быстрые ссылки ---------- */
section.reviews .rating-box .progress-bar,
section.reviews .rating-box .progress .progress-bar {
	background-image: var(--wo-grad);
}

section.quick-link .bg-gradient-dark {
	background-image: linear-gradient(125deg, #1e1446 0%, #3b1a5c 55%, #5a1d3f 100%) !important;
}

/* ---------- Оформление заказа ---------- */
.payment-options .item-payment:hover,
.payment-options .item-payment.selected {
	border-color: #ec4899 !important;
	box-shadow: 0 6px 18px -10px rgba(236, 72, 153, .7);
}

.card {
	--bs-card-border-color: var(--wo-border);
}

/* ---------- Кнопка «наверх» ---------- */
.btn-back-to-top {
	background-image: var(--wo-grad) !important;
	border: 0 !important;
}

/* ---------- Блок «Наши проекты» в футере ---------- */
.wo-projects {
	padding: 2.5rem 0 0;
}

.wo-projects .wo-projects-title {
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: 1rem;
}

.wo-project {
	display: flex;
	align-items: center;
	gap: .9rem;
	height: 100%;
	padding: 1rem 1.1rem;
	border-radius: 14px;
	background: var(--wo-surface);
	border: 1px solid var(--wo-border);
	color: var(--bs-body-color);
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.wo-project:hover {
	transform: translateY(-3px);
	border-color: rgba(236, 72, 153, .45);
	box-shadow: 0 14px 30px -18px rgba(124, 58, 237, .7);
	color: var(--bs-body-color);
}

.wo-project .wo-project-icon {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.3rem;
	color: #fff;
}

.wo-project .wo-project-name {
	font-weight: 700;
	line-height: 1.2;
}

.wo-project .wo-project-desc {
	font-size: .85rem;
	color: var(--bs-secondary-color);
	line-height: 1.35;
}

.wo-project .bi-arrow-up-right {
	margin-left: auto;
	opacity: .5;
	transition: opacity .2s ease, transform .2s ease;
}

.wo-project:hover .bi-arrow-up-right {
	opacity: 1;
	transform: translate(2px, -2px);
}
