/*
Theme Name:     ACUSTAT2025
Theme URI:
Description:    Theme for the Acustat website
Author:         Developers
Author URI:
Version:        0.1.0
*/

:root {
	--color-white: #FFFFFF;
	--e-global-color-2c0e50b: #FFFFFF;

	--color-gray-70: #CBCBCB;

	--color-navy-20: #102E4A;
	--e-global-color-058dc04: #102E4A;

	--color-purple-60: #6C5CD6;

	--color-purple-95: #F0F3FE;
	--e-global-color-0d42e02: #F0F3FE;

	--letter-spacing-01: 0.04em;
}

html, body {
	margin: 0;
	padding: 0;

}

html * {
	box-sizing: border-box;
}

body {
	color: var(--color-navy-20);
	font-size: 16px;
	line-height: 1.6;
	font-family: Inter, sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	letter-spacing: 0;
}

.page-wrap {
	background-color: #fff;
	background-image: conic-gradient(from 239.26deg at 50% 50%, rgba(255, 255, 255, 0.08) -17.12deg, rgba(255, 255, 255, 0.08) 19.02deg, rgba(25, 0, 188, 0.08) 40.36deg, rgba(112, 90, 255, 0.08) 56.93deg, rgba(136, 103, 246, 0.08) 78.23deg, rgba(181, 127, 228, 0.08) 137.33deg, rgba(25, 0, 188, 0.08) 191.68deg, rgba(231, 153, 209, 0.08) 227.94deg, rgba(255, 255, 255, 0.08) 275.32deg, rgba(255, 255, 255, 0.08) 342.88deg, rgba(255, 255, 255, 0.08) 379.02deg);
	background-repeat: no-repeat;
	backdrop-filter: blur(160.3px);
}

h1, .elementor-element h1 {
	font-size: 72px;
	line-height: 0.88;
	font-family: Inter, sans-serif;
	font-weight: 500;
	letter-spacing: var(--letter-spacing-01);
	color: var(--color-navy-20);
}

h2, .elementor-element h2 {
	font-size: 32px;
	line-height: 1.4;
	font-family: Inter, sans-serif;
	font-weight: 500;
	letter-spacing: var(--letter-spacing-01);
	color: var(--color-navy-20);
}

h3, .elementor-element h3 {
	font-size: 24px;
	line-height: 1.0;
	font-family: Inter, sans-serif;
	font-weight: 600;
	letter-spacing: var(--letter-spacing-01);
	color: var(--color-navy-20);
}

p {
	margin: 0 0 16px 0;
}

h4, .elementor-element h4, #menu-main a, #menu-secondary a {
	font-size: 20px;
	line-height: 1.5;
	font-family: Inter, sans-serif;
	font-weight: 600;
	letter-spacing: var(--letter-spacing-01);
	color: var(--color-navy-20);
}

#menu-main a:hover, #menu-secondary a:hover, #menu-main a:active, #menu-secondary a:active {
	color: var(--color-purple-60);
}

h5, .elementor-element h5, #menu-footer {
	font-size: 20px;
	line-height: 1.5;
	font-family: Inter, sans-serif;
	font-weight: 400;
	letter-spacing: var(--letter-spacing-01);
	color: var(--color-navy-20);
}

.button, .elementor-button, a.elementor-button {
	display: inline-block;
	border-radius: 8px !important;
	padding: 10px 24px !important;
	font-size: 16px;
	line-height: 1.5 !important;
	font-family: Inter, sans-serif;
	font-weight: 600;
	letter-spacing: 0;
	cursor: pointer;
	text-align: center;
}

.button-primary, a.button-primary, a.elementor-button {
	background: var(--color-navy-20);
	color: var(--color-white);
}

.button-primary:hover, a.button-primary:hover, a.elementor-button:hover {
	color: var(--color-white) !important;
	background-color: #2b4359;
}

.button-secondary, a.button-secondary {
	color: var(--color-navy-20);
	background-color: var(--color-white);
}

.button-secondary:hover, a.button-secondary:hover, a.elementor-button.secondary:hover {
	color: var(--color-navy-20) !important;
	background-color: #cbcbcb;
}

a, .elementor-element a {
	text-decoration: none;
}

a:hover, .elementor-element a:hover,
a:active, .elementor-element a:active,
a.active, .elementor-element a.active {
	color: var(--color-purple-60);
}

ul, .elementor-element ul {
	padding-left: 20px;
}

.flex-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.content-footer, .content-header {
	max-width: 1440px;
	margin: auto;

}

.content-header {
	padding: 30px 60px;
	justify-content: space-between;
}

.content-main {
	padding: 0;
	min-height: 400px;
	overflow: hidden;
	z-index: 0;
}

.content-footer {
	padding: 40px 60px 30px;
}


#menu-main, #menu-secondary {

	display: flex;
	list-style-type: none;
	padding-left: 0;
	gap: 40px;
	justify-content: space-between;
}

#mobile-menu-main-toggler, #menu-main li:last-child {
	display: none;
}

#mobile-menu-main-toggler button {
	background: none !important;
	border: none ! important;
	border-radius: 0 !important;
	width: 24px;
	height: 24px;
}

/********* Footer ********************/
#page-footer {
	padding: 10px 0;
	background: radial-gradient(50% 50% at 50% 50%, rgba(112, 90, 255, 0.15) 68.2%, rgba(16, 46, 74, 0.15)), #132E47;
	color: var(--color-white);
}

#menu-footer a {
	color: var(--color-white);
}

#menu-footer a:hover, #menu-footer a:active {
	color: var(--color-purple-60);
}

#menu-footer {
	display: flex;
	list-style-type: none;
	padding-left: 0;
	gap: 84px;
}

#page-footer h2 {
	font-size: 35px;
	color: var(--color-white);
	margin: 0;
}

#page-footer .button {
	width: 147px;
}

/** Beauty **/

.circle-checkbox {
	padding-left: 32px;
	background-image: url(images/circle-checked.svg);
	background-size: 20px 20px;
	background-position: 0 5px;
	background-repeat: no-repeat;
}

.circle-dark {
	padding-left: 24px;
	background-image: url(images/circle-dark.svg);
	background-size: 13px 12px;
	background-position: 0 6px;
	background-repeat: no-repeat;
}

.no-margin p, p.no-margin {
	margin: 0 0 0 0;
}

/********** Homepage *********/
#percents {
	z-index: 20;
}

#expertise-wrap {
	z-index: 10;
	margin-top: -100px;

	background: linear-gradient(0deg, #102E4A, #102E4A),
	radial-gradient(40.17% 73.36% at 73.96% 40.31%,
			rgba(112, 90, 255, 0.4) 0%,
			rgba(16, 46, 74, 0.4) 100%);
	/* warning: gradient uses a rotation that is not supported b
	y CSS and may not behave as expected */;

}

#expertise-inner {
	max-width: calc(min(100vw - 32px, 1200px)) !important;
	margin: auto;
}

.expertise-even {
	align-self: flex-end !important;
}

.services-list .elementor-spacer {
	background-color: var(--color-gray-70) !important;
}

#contact-wrap {
	max-width: 814px;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 1146px) {
	#percents {
		flex-wrap: wrap !important;
		max-width: calc(100vw - 32px) !important;
		text-align: center;
	}
}

@media screen and (max-width: 900px) {

	.content-footer {
		padding-left: 8px;
		padding-right: 8px;
	}

	.content-header {
		padding: 16px 16px;
	}

	h1, .elementor-element h1 {
		font-size: 56px;
		font-weight: 600;
		line-height: 1.4;
	}

	#menu-main {
		position: absolute;
		top: -16px;
		right: 0;
		display: none;
		background-color: var(--color-white);
		width: 100%;
		padding: 20px;
		z-index: 20;
	}

	#menu-main li {
		margin-bottom: 12px;
	}

	#mobile-menu-main-toggler {
		display: inline-block;
		position: absolute;
		top: 16px;
		right: 16px;
		width: 24px;
		height: 24px;
		background-image: url(images/hamburger.svg);
		background-size: 24px 24px;
		background-position: 0 0;
		background-repeat: no-repeat;
		z-index: 1000;

	}

	#mobile-menu-main-toggler.active {
		background-image: url(images/cross.svg);
	}

	#menu-secondary {
		display: none;
	}

	.content-footer, .content-footer .flex-row, #menu-footer {
		text-align: center;
		flex-direction: column;
	}

	.content-footer h2 {
		max-width: 480px;
	}

	.footer-logo {
		display: none;
	}

	#menu-footer {
		gap: 16px;
	}

	.content-footer {
		padding-bottom: 64px;
	}

	#page-footer {
		background-image: url(images/logo-light.png);
		background-position: center bottom 48px;
		background-repeat: no-repeat;
		background-size: 161px 27px;
		padding-bottom: 48px;
	}
}
