@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;900&display=swap');

:root {
	--color-primary: #86c843;
	--color-secondary: #d4f4c1;
	--color-dark: #1e272e;
	--color-light-accent: #a4b0be;
	--color-light: #f0f4f8;
}

body {
	font-family: 'Inter', 'Poppins', 'Helvetica Neue', Helvetica, Arial,
		sans-serif;

	background: linear-gradient(
		180deg,
		var(--color-light) 0%,
		var(--color-secondary) 100%
	);
	color: var(--color-dark);
	overflow-x: hidden;
}

/* Переназначение классов Tailwind CSS для новой палитры */
.bg-color1 {
	background-color: var(--color-primary);
}
.text-color1 {
	color: var(--color-primary);
}
.hover\:text-color1:hover {
	color: var(--color-primary);
}
.hover\:bg-color1:hover {
	background-color: var(--color-primary);
}

.bg-color2 {
	background-color: var(--color-secondary);
}
.text-color2 {
	color: var(--color-secondary);
}
.hover\:bg-color2:hover {
	background-color: var(--color-secondary);
}

.bg-color3 {
	background-color: var(--color-dark);
}
.text-color3 {
	color: var(--color-dark);
}
.border-color3 {
	border-color: var(--color-dark);
}
.hover\:text-color3:hover {
	color: var(--color-dark);
}

.bg-color4 {
	background-color: var(--color-light-accent);
}
.text-color4 {
	color: var(--color-light-accent);
}
.border-color4 {
	border-color: var(--color-light-accent);
}
.hover\:text-color4:hover {
	color: var(--color-light-accent);
}

.bg-color5 {
	background-color: var(--color-light);
}
.text-color5 {
	color: var(--color-light);
}
.border-color5 {
	border-color: var(--color-light);
}

/* Остальные стили (reveal-element, mobile-menu, popup, и т.д.) */
.reveal-element {
	opacity: 0;
	transform: translateY(40px);
	transition:
		opacity 0.8s ease-out,
		transform 0.8s ease-out;
}

.reveal-element.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.notification-toast {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99999;

	max-width: 360px;
	width: calc(100% - 40px);

	background: #f4b942;
	color: #0a192f;

	padding: 16px 18px;
	border-radius: 14px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);

	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
	transition: all 0.3s ease;
}

.notification-toast.show {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.notification-toast__title {
	display: block;
	font-weight: 700;
	font-size: 16px;
	margin-bottom: 6px;
}

.notification-toast__text {
	margin: 0;
	font-size: 14px;
	line-height: 1.4;
}

#mobile-menu {
	transition: transform 0.3s ease-in-out;
	transform: translateX(100%);
}
#mobile-menu.active {
	transform: translateX(0);
}
#burger-btn span {
	transition: all 0.3s ease-in-out;
}
#burger-btn.active span:nth-child(1) {
	transform: rotate(45deg) translate(5px, 5px);
}
#burger-btn.active span:nth-child(2) {
	opacity: 0;
}
#burger-btn.active span:nth-child(3) {
	transform: rotate(-45deg) translate(7px, -6px);
}

#hero-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -1;
	transition: transform 0.2s ease-out;
}

.deco-shape-1 {
	position: absolute;
	bottom: -50px;
	right: -50px;
	width: 200px;
	height: 200px;
	background-color: var(--color-primary);
	border-radius: 50%;
	opacity: 0.5;
	z-index: -1;
}

.parallax-element-slow {
	transition: transform 0.1s ease-out;
}
.parallax-element-fast {
	transition: transform 0.1s ease-out;
}

.section-bg-image-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: -2;
}
.section-bg-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.08;
}

.deco-grid {
	position: absolute;
	top: 10%;
	left: 10%;
	width: 80%;
	height: 80%;
	background-image: linear-gradient(
			to right,
			var(--color-primary) 1px,
			/* Изменено */ transparent 1px
		),
		linear-gradient(to bottom, var(--color-primary) 1px, transparent 1px); /* Изменено */
	background-size: 40px 40px;
	opacity: 0.15;
	z-index: -1;
}

.split-screen-content {
	padding: 4rem;
}
.split-screen-image {
	position: sticky;
	top: 0;
	height: 100vh;
	width: 100%;
	object-fit: cover;
}

.overlapping-image {
	position: absolute;
	top: -10%;
	right: 0;
	width: 60%;
	height: 120%;
	object-fit: cover;
	z-index: 0;
	border-bottom-left-radius: 200px;
}

.wave-divider {
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	transform: rotate(180deg);
}
.wave-divider svg {
	position: relative;
	display: block;
	width: calc(100% + 1.3px);
	height: 150px;
}
.wave-divider .shape-fill {
	fill: var(--color-dark); /* Изменено */
}

.notification {
	position: fixed;
	top: 20px;
	right: 20px;
	padding: 1rem 1.5rem;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	z-index: 9999;
	opacity: 0;
	transform: translateX(400px);
	transition:
		opacity 0.3s ease-out,
		transform 0.3s ease-out;
	max-width: 350px;
	font-weight: 500;
}
.notification.show {
	opacity: 1;
	transform: translateX(0);
}
.notification.success {
	background-color: var(--color-primary); /* Изменено */
	color: var(--color-dark); /* Изменено */
}
.notification.error {
	background-color: #ef4444;
	color: white;
}

/* --- Cookie Popup --- */
.cookie-popup {
	background-color: var(--color-dark); /* Изменено */
	color: var(--color-light); /* Изменено */
	/* ... остальное без изменений ... */
}
.cookie-popup-title {
	color: var(--color-primary); /* Изменено */
}

.cookie-popup-link {
	color: var(--color-primary); /* Изменено */
}

.cookie-popup-link:hover {
	color: var(--color-light-accent); /* Изменено */
}

.cookie-btn-accept {
	background-color: var(--color-primary); /* Изменено */
	color: var(--color-dark); /* Изменено */
}

.cookie-btn-accept:hover {
	background-color: var(--color-secondary); /* Изменено */
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

.cookie-btn-decline {
	background-color: transparent;
	color: var(--color-light); /* Изменено */
	border: 2px solid var(--color-light); /* Изменено */
}

/* Изменения для Dark Mode */
.timeline-dot {
	background-color: var(--color-secondary); /* Изменено */
	color: var(--color-dark); /* Изменено */
	border: 4px solid var(--color-dark); /* Изменено */
	box-shadow: 0 0 0 4px var(--color-secondary); /* Изменено */
}
@media (min-width: 768px) {
	.timeline-node::before {
		background-color: var(--color-secondary); /* Изменено */
	}
}

.faq-toggle {
	background-color: var(--color-dark); /* Изменено */
	color: var(--color-light); /* Изменено */
}
.faq-toggle:hover {
	background-color: rgba(255, 255, 255, 0.05);
}
.faq-question-text {
	color: var(--color-secondary); /* Изменено */
}
.faq-icon {
	color: var(--color-secondary); /* Изменено */
}
.faq-content {
	background-color: var(--color-dark); /* Изменено */
}
.faq-content p {
	color: var(--color-light); /* Изменено */
}
.contact-input {
	color: var(--color-dark); /* Изменено */
	background-color: var(--color-light); /* Изменено */
	border: 2px solid var(--color-light-accent); /* Изменено */
}
.contact-input:focus {
	border-color: var(--color-primary); /* Изменено */
	box-shadow: 0 0 0 3px rgba(255, 195, 0, 0.5); /* Изменено */
}