/* open-sans-300 - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: normal;

	font-weight: 300;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-300.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-300italic - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: italic;

	font-weight: 300;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-300italic.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-regular - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: normal;

	font-weight: 400;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-regular.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-italic - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: italic;

	font-weight: 400;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-italic.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-500 - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: normal;

	font-weight: 500;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-500.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-500italic - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: italic;

	font-weight: 500;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-500italic.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-600 - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: normal;

	font-weight: 600;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-600.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-600italic - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: italic;

	font-weight: 600;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-600italic.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-700 - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: normal;

	font-weight: 700;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-700.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-700italic - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: italic;

	font-weight: 700;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-700italic.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-800 - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: normal;

	font-weight: 800;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-800.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



/* open-sans-800italic - cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese */

@font-face {

	font-display: swap;

	/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

	font-family: 'Open Sans';

	font-style: italic;

	font-weight: 800;

	src: url('/assets/fonts/open-sans-v44-cyrillic_cyrillic-ext_greek_greek-ext_hebrew_latin_latin-ext_math_symbols_vietnamese-800italic.woff2') format('woff2');

	/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */

}



html {

	scroll-padding-top: 60px;

}





/* == Brand Styles == */

:root {

	/* Используем цвета из нашего логотипа */

	--werktrack-blue: #155691;

	/*#0a4a8f; */

	--werktrack-gray: #3d4041;

	/*#3a4a5a;*/

	--werktrack-accent: #00b8d4;

	/* Бирюзовый для акцентов (из стрелки) */

	

	--werktrack-red-bg: rgba(220, 53, 69, 0.1);

	--werktrack-red-icon: #dc3545;

	--werktrack-green-bg: rgba(25, 135, 84, 0.1);

	--werktrack-green-icon: #198754;

}



body {

	color: var(--werktrack-gray);

	font-family: 'Open Sans';

	font-weight: 300;

	font-style: normal;

}



.werk-prefix {

  color: var(--werktrack-gray);

  font-weight: 300;

}

.werk-prefix strong {

  color: var(--werktrack-blue);

  font-weight: 500;

}



/* Настройка основного цвета Bootstrap */

.btn-primary {

	background-color: var(--werktrack-blue);

	border-color: var(--werktrack-blue);

}



.btn-primary:hover {

	background-color: #083b72;

	border-color: #083b72;

}



.text-primary {

	color: var(--werktrack-blue) !important;

}



.btn-outline-primary {

	border-color: var(--werktrack-blue);

	color: var(--werktrack-blue);

}



.btn-outline-primary:hover {

	background-color: var(--werktrack-blue);

	color: #fff;

}



/* == Navbar == */

.navbar-brand img {

	height: 60px;

}



.navbar {

	background-color: #fff;

	border-bottom: 1px solid #eee;

}



.navbar-brand span {

	font-size: 3rem;

	line-height: 3rem;

	color: #3d4041;

	vertical-align: middle;

}



.navbar-brand strong {

	color: var(--werktrack-blue);

}





/* == Hero Section == */

.hero-section {

	padding: 3rem 0;

	background-color: #f8f9fa;

}



.hero-section h1 {

	font-weight: 400;

	color: #222;

}



.hero-section .lead {

	font-size: 1.25rem;

	color: var(--werktrack-gray);

}



/* == Features Section == */

.feature-icon-wrapper {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 60px;

	height: 60px;

	border-radius: 50%;

	background-color: rgba(10, 74, 143, 0.1);

	/* Светлый фон из синего */

	color: var(--werktrack-blue);

	font-size: 2rem;

	margin-bottom: 1.5rem;

}



.features-section .card {

	border: 1px solid #e9ecef;

	border-radius: 0.5rem;

	transition: transform 0.2s, box-shadow 0.2s;

}



.features-section .card:hover {

	transform: translateY(-5px);

	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);

}



/* == Problem/Solution Section == */

#problem-solution .card {

	border: none;

	background-color: #f8f9fa;

	border-radius: 0.5rem;

}



#problem-solution .icon-wrapper {

	font-size: 2rem;

	margin-bottom: 1rem;

}



#problem-solution .feature-icon-wrapper.icon-problem {

	background-color: var(--werktrack-red-bg);

	color: var(--werktrack-red-icon);

}



#problem-solution .feature-icon-wrapper.icon-solution {

	background-color: var(--werktrack-green-bg);

	color: var(--werktrack-green-icon);

}



/* Сделаем их чуть крупнее, чем иконки функций,

  чтобы усилить акцент.

*/

#problem-solution .feature-icon-wrapper {

	width: 70px;

	height: 70px;

	font-size: 2.5rem;

	margin-bottom: 1.5rem;

}



/* == Final CTA Section == */

.cta-section {

	background-color: var(--werktrack-blue);

	color: #fff;

	padding: 5rem 0;

}



.cta-section h2 {

	font-weight: 700;

}



/* == Demo Page Styles == */



/* Стилизация списка выгод */

#demo-benefits-list li {

	font-size: 1.1rem;

	line-height: 1.6;

}



#demo-benefits-list .bi-check-circle-fill {

	position: relative;

	top: 2px; /* Легкая вертикальная центровка иконки */

}



/* Стилизация шагов на "Thank You" page */

#next-steps-list .badge {

	font-size: 1rem;

    line-height: 1.4rem;

    padding: 0.3rem 0.6rem;

    flex-shrink: 0; /* Предотвращает сжатие номерка */

}



#next-steps-list li {

    line-height: 1.7;

}



/* == Footer == */

.footer {

	padding: 3rem 0;

	background-color: #f8f9fa;

}



.footer .logo-footer {

	height: 60px;

	margin-bottom: 0;

	font-size: 3rem;

	line-height: 3rem;

	color: var(--werktrack-gray);

	vertical-align: middle;

}



.footer .logo-footer strong {

	color: var(--werktrack-blue);

}



.footer a {

	color: var(--werktrack-gray);

	text-decoration: none;

}



.footer a:hover {

	color: var(--werktrack-blue);

	text-decoration: underline;

}



.footer .social-icons a {

	font-size: 1.5rem;

	margin-left: 1rem;

}





#advantage {

	padding: 5rem 0;

	background-color: #f8f9fa;

	/* Или #fff, если хотите разделение */

}



#advantage .icon-wrapper {

	font-size: 3rem;

	color: var(--werktrack-blue);

	margin-bottom: 1.5rem;

}



.lang-switcher .dropdown-toggle::after {

	margin-left: .5em;

}



/* == Legal Pages (Impressum, AGB, etc.) == */

.legal-page {

	padding-top: 4rem;

	padding-bottom: 4rem;

}



.legal-page h1 {

	font-weight: 700;

	color: #222;

}



.legal-page h2 {

	font-weight: 600;

	color: var(--werktrack-blue);

	margin-top: 2.5rem;

	margin-bottom: 1rem;

}



.legal-page h3 {

	font-weight: 600;

	margin-top: 2rem;

	margin-bottom: 0.5rem;

}



.legal-page p, 

.legal-page ul, 

.legal-page li {

	line-height: 1.7;

	color: var(--werktrack-gray);

}



.legal-page a {

	color: var(--werktrack-blue);

	text-decoration: underline;

}



.legal-page a:hover {

	text-decoration: none;

}



/* == Cookie Consent Banner == */

.cookie-banner {

	z-index: 1050; /* Выше, чем большинство элементов, но ниже, чем модальные окна Bootstrap */

	border-top: 1px solid #ddd;

	background-color: #fdfdfd !important; /* Чуть светлее, чем bg-light */

}



.fw-bold {

    font-weight: 400 !important;

}



#advantage .icon-solution {

	 width: 180px;

	 height: 180px;

	 font-size: 8rem;

}



/* На мобильных, делаем кнопки на 100% ширины */

@media (max-width: 767.98px) {

	.cookie-banner .row > div {

		text-align: center !important;

	}

	.cookie-banner button {

		width: 100%;

	}

}



@media (max-width: 991.98px) {

	.hero-section {

		padding: 1rem 0;

	}

	.hero-section .lead {

		font-size: 1rem;

	}

	.display-5 {

		font-size: calc(1.375rem + 1.5vw);

	}

	.navbar-brand img {

		height: 40px;

	}

	.navbar-brand span {

		font-size: 2rem;

		line-height: 2rem;

	}

	.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {

		overflow-x: hidden;

	}

	#advantage .icon-solution {

		width: 80px;

		height: 80px;

		font-size: 3rem;

	}

}