/*!
Theme Name: duploUSA
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: duplousa
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

duploUSA is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
.pm0 {
	margin: 0;
	padding: 0;
}

.mwrap {
	max-width: 1270px;
	margin: 0 auto;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
}

.mwrap800 {
	max-width: 800px;
	margin: 0 auto;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
}

.mwrap-cat {
	max-width: 1920px;
}

.mwrap8 {
	max-width: 1170px;
	margin: 0 auto;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
}

body {
	font-family: 'Open Sans', sans-serif;
	margin: 0;
	padding: 0;
	color: #515151;
}

h1 {
	margin: 0;
	padding: 30px 0;
}

p {
	font-size: 16px;
	line-height: 1.3;
	padding: 8px 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Archivo Narrow", sans-serif;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: #11719f;
}

a:hover {
	cursor: pointer !important;
}

.site-footer {
	text-align: center;
	color: #eee;
	padding: 10px;
	background: #333;
	padding: 30px 0;
}

.d-flex {
	display: flex;
}

.ai-center {
	align-items: center;
}

.first-cont {
	flex-direction: row;
	padding: 140px 0;
	align-items: center;
}

.left-cont,
.right-cont {
	flex-basis: 50%;
	padding: 15px;
}

.right-cont {
	/* background: #e2b143; */
}

.l-cont-img-prev,
.r-cont-desc {
	flex-basis: 50%;
}

.r-cont-desc {
	padding: 12px;
}

.item-prod-home {
	display: flex;
	flex-direction: column;
	flex-basis: 50%;
}

.item-prod-home:hover {
	box-shadow: 0 0 15px rgb(197, 197, 197);
	transform: scale(1.009);
}

.hot-products {
	margin-top: 60px;
}

.prodw {
	padding: 7px;
	box-shadow: 0 0 24px #dfdfdf;
	margin: 8px;
	background: #fcfaf4;
}

.wrap-item-prod-home {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 60px 0;
}


.headmenu {
	justify-content: space-around;
	display: flex;
	padding: 0 !important;
	width: 100%;
	margin: 0 !important;
}

.site-header {
	/* background: #f0f0f0; */
	color: black;
	padding: 20px 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	position: relative;
}

.container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1270px;
	margin: 0 auto;
	padding: 0 20px;
}

.logo a {
	text-decoration: none;
	color: black;
	font-size: 24px;
	font-weight: bold;
}

.prodw a {
	text-decoration: none;
}

.prodw a.prodname {
	color: #454545;
	text-transform: uppercase;
	margin: 7px 0;
	font-weight: 900;
	font-size: 18px;
}

.mehrlink {
	border: 0px solid white;
	padding: 8px;
	color: #111115;
	background-color: #cfcfcfbb;
	display: block;
	text-align: center;
}

.prodw .desc-pprev {
	margin: 6px 0;
}

.h1hometitle {
	font-size: 60px;
	text-transform: uppercase;
	margin: 10px 0;
}

.fs22 {
	font-size: 22px;
}

.desc-hometop {
	line-height: 1.5;
	font-size: 18px;
}

.ylink:hover {
	background-color: #eabb02 !important;
	padding: 11px 55px 11px 55px;
	box-shadow: 0 0 15px rgb(196, 196, 196);
}

a.ylink {
	color: #111111 !important;
	background-color: #f1c50e !important;
	background-image: none;
	text-transform: uppercase;
	letter-spacing: 3px;
	font-size: 1rem;
	border-style: none;
	border-radius: 4px;
	margin: 30px auto 0 0;
	padding: 10px 54px 10px 52px;
	text-decoration: none;
}

a.thirdscreenlink {
	color: #111111 !important;
	background-color: #f1c50e !important;
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 4px 8px;
	text-decoration: none;
	margin-top: 20px;
	display: block;
	text-align: center;
}

.fd {
	border-bottom: 1px solid rgba(255, 105, 0, 1);
	font-size: 20px;
}

.pb-50 {
	padding-bottom: 50px;
}

.pb-40 {
	padding-bottom: 40px;
}

.m0 {
	margin: 0;
}

.mb-50 {
	margin-bottom: 50px;
}

.mb-30 {
	margin-bottom: 30px;
}

.mb-20 {
	margin-bottom: 20px;
}

.mt-30 {
	margin-top: 30px;
}

.mt-40 {
	margin-top: 40px;
}

.mt-15 {
	margin-top: 15px;
}

.mt-60 {
	margin-top: 60px;
}

.third-cont h2 {
	font-size: 44px;
}

.fifth-cont {
	position: relative;
}

.fifth-cont h2 {
	font-size: 44px;
	text-transform: uppercase;
}

.text-center {
	text-align: center;
}

.text-end {
	text-align: end;
}

.fourth-cont {
	background: #454545;
	color: #fff;
}

.fourth-cont-wrap {
	display: flex;
	gap: 1.5rem;
}

.fcontainer h2 {
	text-align: center;
	font-size: 44px;
	text-transform: uppercase;
	padding-top: 40px;
}

.fth-left,
.fth-right {
	flex-basis: 50%;
}

.second-cont-wrap {
	display: flex;
	gap: 1rem;
}

.second-left {
	flex-basis: 62%;
	z-index: 999;
}

.second-right {
	flex-basis: 38%;
	margin-top: 80px;
}

.scontainer h2 {
	font-size: 44px;
	text-transform: uppercase;
	padding-top: 40px;
	margin: 15px 0;
}

.p15 {
	padding: 15px;
}

.p8 {
	padding: 8px;
}

.second-cont {
	position: relative;
}

.third-cont {
	position: relative;
	background: #faf6ee;
}

.color-line-sc {
	height: 151px;
	background: #f1c50e;
	position: absolute;
	z-index: 0;
	display: block;
	top: 3%;
	left: 0;
	width: 50%;
}

.color-line-sc3 {
	height: 200px;
	background: #f1c50e;
	position: absolute;
	z-index: 0;
	display: block;
	top: 22px;
	left: 0;
	width: 48%;
}

.color-line-sc2 {
	height: 95px;
	background: #f1c50e;
	position: absolute;
	z-index: 0;
	display: block;
	top: -2%;
	left: 35%;
	width: 38%;
}

.color-line-sc0 {
	height: 95px;
	background: #32373c;
	position: absolute;
	z-index: 0;
	display: block;
	top: -7%;
	width: 70%;
	right: 0;
}

.ft {
	border-bottom: 1px solid #5a5a5a;
	font-size: 20px;
}

.sec-color {
	color: #ff6801;
}

.hr {
	border-top: 1px solid #949494;
	width: 10%;
	margin: 1rem 0;
}

.hr2 {
	border-top: 1px solid #ff6900;
	width: 10%;
	margin: 1rem 0;
}

.fourth-cont h3 {
	font-size: 36px;
	margin: 0;
	color: #f1c50e;
}

.p100 {
	padding: 100px 0;
}

.p80 {
	padding: 80px 0;
}

.pb-100 {
	padding-bottom: 100px;
}

.p-rel {
	position: relative;
}

.p-rel h2 {
	font-size: 44px;
	text-align: center;
	text-transform: uppercase;
}

.mb-100 {
	margin-bottom: 100px;
}

.ls-ttt {
	position: relative;
}

.ls-ttt h2 {
	margin-bottom: 8px;
}

.fifth-left,
.fifth-right {
	flex-basis: 50%;
}

.msto {
	margin: 100px 0;
}

.inside-left-cont h3 {
	text-transform: uppercase;
}

.mt-80 {
	margin-top: 80px;
}

.mt-50 {
	margin-top: 50px;
}

.partner-box {
	text-align: center;
	padding: 65px 0;
	background: #f4f4f4;
	box-shadow: 0 0 3px #d3d3d3;
}

.partner-box h2 {
	font-size: 44px;
	text-transform: uppercase;
}

.partner-box h3 {
	text-transform: uppercase;
	font-size: 36px;
	border-width: medium;
	color: #fff;
	background: #454545;
	padding: 5px;
}

.fb4 {
	flex-basis: 40%;
}

.fb6 {
	flex-basis: 60%;
}




.faq-content h2 {
	font-size: 44px;
}



.accordion {
	all: inherit;
	width: 100%;
	background: #f8f8f8;
	padding: 1.25rem 1.75rem;
	border-radius: 12px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
	font-size: 1.125rem;
	font-weight: 600;
	margin-bottom: 30px;
	cursor: pointer;
}

.accordion:hover {
	background: #faf6ee
}

.accordion:after {
	content: '\002B';
	color: #777;
	font-weight: bold;
	float: right;
	margin-left: 5px;
}

.panel {
	padding: 0 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}

/* ===================== */
/*  Аккордеон: плюс/минус */
/* ===================== */
.accordion.active {
	background: #f1e9da;
	margin-bottom: 0;
}

.accordion.active:after {
	content: "\2212";
	/* Unicode minus */
}


/*--------------------------------------------------------------
 Modern Overrides (preserves original styles above)
--------------------------------------------------------------*/

/* CSS Variables */
:root {
	--color-primary: #f1c50e;
	--color-dark: #32373c;
	--color-gray: #515151;
	--color-light: #fcfaf4;
	--spacing: 1.5rem;
}

/* Subtle box-sizing reset */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Animate.css import */
@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css');

/* Hero Section */
.page-hero {
	position: relative;
	padding: 8rem 0;
	background-size: cover;
	background-position: center;
	color: #fff;
}

.page-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgb(0 0 0 / 73%);
}

.page-hero__content {
	position: relative;
	z-index: 1;
	text-align: center;
}

.page-hero__title {
	font-size: 3rem;
	margin-bottom: 0.5rem;
	animation: fadeInDown 1s both;
}

.page-hero__subtitle {
	font-size: 1.25rem;
	animation: fadeInUp 1s both;
}

/* Content Wrappers */
.page-content,
.post-content {
	background: #fff;
	padding: var(--spacing);
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	margin-bottom: var(--spacing);
	margin-top: 2rem;
}

/* Post Header Enhancements */
.post-header {
	text-align: center;
	margin-bottom: var(--spacing);
}

.post-title {
	font-size: 2.5rem;
	animation: zoomIn 0.8s both;
}

.post-meta {
	color: #777;
}

/* Footer Modern Dark */
.site-footer {
	background: var(--color-dark);
	color: #eee;
	padding: 30px 0;
	text-align: center;
}

.body-wrap {
	background: #f8f8f8;
}

/*--------------------------------------------------------------
# Comments (Updated)
--------------------------------------------------------------*/

/* Основной контейнер комментариев */
.comment-list,
.comments-area {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Одиночный комментарий */
.comment {
	display: block;
	/* margin-bottom: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid #e0e0e0; */
	animation: fadeInUp 0.5s both;
}

/* Аватар */
.comment .comment-avatar {
	float: left;
	width: 60px;
	margin-right: 1rem;
}

.comment .comment-avatar img {
	border-radius: 50%;
	width: 60px;
	height: 60px;
	object-fit: cover;
}

/* Контент комментария */
.comment .comment-content {
	overflow: hidden;
	background: #fff;
	/* белый фон */
	padding: 1rem;
	border-radius: 8px;
	position: relative;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.comment-content p {
	margin: 0;
}

/* Заголовок и мета */
.comment .comment-content .comment-author {
	font-weight: bold;
	color: #32373c;
	margin-bottom: 0.25rem;
}

.comment .comment-content .comment-meta {
	font-size: 0.85rem;
	color: #888;
	margin-bottom: 1rem;
}

/* Текст */
.comment .comment-content .comment-text {
	font-size: 1rem;
	line-height: 1.5;
	color: #515151;
}

/* Ссылка “Ответить” */
.comment .reply {
	display: block;
	margin-top: 1rem;
}

.comment .reply a {
	font-size: 0.9rem;
	color: #f1c50e;
	text-decoration: none;
	transition: color 0.2s;
}

.comment .reply a:hover {
	color: #32373c;
}

/* Вложенные комментарии: просто вниз, без смещения вбок */
.comment .children {
	list-style: none;
	margin: 0.5rem 0 0 0;
	padding: 0;
	padding-left: 50px;
}

.comment .children .comment {
	margin-left: 0;
	padding-left: 0;
	border-left: none;
}

/* Форма ответа */
.comment-respond {
	background: #fff;
	/* белый фон */
	padding: 1.5rem;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	margin-top: 2rem;
}

.comment-respond h3 {
	margin-top: 0;
	font-family: "Archivo Narrow", sans-serif;
	font-size: 1.5rem;
	color: #32373c;
}

.comment-respond label {
	display: block;
	margin-bottom: 0.5rem;
	font-weight: 600;
	color: #32373c;
}

.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond textarea {
	width: 100%;
	padding: 0.75rem;
	margin-bottom: 1rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	transition: border-color 0.2s;
}

.comment-respond input:focus,
.comment-respond textarea:focus {
	border-color: #f1c50e;
	outline: none;
}

.comment-respond .form-submit {
	text-align: right;
}

.comment-respond .form-submit input[type="submit"] {
	background: #f1c50e;
	color: #fff;
	border: none;
	padding: 0.75rem 1.5rem;
	font-size: 1rem;
	border-radius: 4px;
	cursor: pointer;
	transition: background 0.2s, transform 0.1s;
}

.comment-respond .form-submit input[type="submit"]:hover {
	background: #32373c;
	transform: translateY(-2px);
}

/*--------------------------------------------------------------
# Search above categories
--------------------------------------------------------------*/
.blog-search {
	margin-bottom: 1.5rem;
	text-align: center;
}

.blog-search .search-form {
	display: inline-flex;
	border: 1px solid #ccc;
	border-radius: 50px;
	overflow: hidden;
}

.blog-search .search-field {
	border: none;
	padding: 0.5rem 1rem;
	font-size: 1rem;
	outline: none;
}

.blog-search .search-field:focus {
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}

.blog-search .search-submit {
	background: var(--color-primary);
	border: none;
	padding: 0 1rem;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
	transition: background 0.3s;
}

.blog-search .search-submit:hover {
	background: var(--color-dark);
}

/* Отступы для категорий после поиска */
.blog-categories {
	margin-bottom: 2rem;
}



/*--------------------------------------------------------------
# Blog Page Styles
--------------------------------------------------------------*/

.blog-main {
	padding: 15px;
}

.blog-title {
	text-align: center;
	font-size: 2.5rem;
	margin-bottom: var(--spacing);
	color: var(--color-dark);
}

.blogst .post-content {
	line-height: 1.7;
	color: #404040;
}

.blogst .post-content ul {
	margin-left: 30px;
}

.blogst .post-content :is(h1, h2, h3, h4) {
	font-size: 32px;
	padding: 10px 0;
}

.cat-search-title {
	font-size: 2.5rem;
	margin-bottom: var(--spacing);
	color: var(--color-dark);
}

.blog-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: var(--spacing);
}

.blog-item {
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
	transform: translateY(0);
	transition: transform 0.3s, box-shadow 0.3s;
	opacity: 0;
	/* для анимации */
}

.blog-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.blog-item-thumb img {
	width: 100%;
	height: 300px;
	object-fit: cover;
}

.blog-item-content {
	padding: var(--spacing);
}

.blog-item-title {
	font-size: 1.5rem;
	margin-bottom: 0.5rem;
}

.blog-item-title a {
	color: var(--color-dark);
	text-decoration: none;
}

.blog-item-meta {
	font-size: 0.85rem;
	color: #777;
	margin-bottom: 0.75rem;
}

.meta-sep {
	margin: 0 0.5rem;
}

.blog-item-excerpt {
	font-size: 1rem;
	margin-bottom: 1rem;
	color: var(--color-gray);
}

.blog-item-readmore {
	font-weight: bold;
	color: var(--color-primary);
	text-decoration: none;
	transition: color 0.2s;
}

.blog-item-readmore:hover {
	color: var(--color-dark);
}

.pagination {
	text-align: center;
	margin-top: var(--spacing);
}

.pagination .page-numbers.current {
	background: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
}

/* Анимация появления */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.blog-item.animate__animated {
	opacity: 1;
	animation: fadeInUp 0.6s both;
}


/*--------------------------------------------------------------
# Blog Pagination Overrides
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Blog Categories Bar
--------------------------------------------------------------*/
.blog-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 2.5rem;
	justify-content: center;
}

.blog-cat-link {
	padding: 0.7rem 2rem;
	background: #f1c50e;
	border-radius: 20px;
	font-size: 0.9rem;
	color: #32373c;
	text-decoration: none;
	transition: background 0.3s, color 0.3s;
}

.blog-cat-link:hover,
.blog-cat-link.current-cat {
	background: #32373c;
	color: #fff;
}



/* Убедимся, что .blog-list — грид-контейнер */
.blog-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: var(--spacing);
}

/* Переносим .pagination из грида на нижнюю строку */
.blog-list .pagination {
	grid-column: 1 / -1;
	/* занимает всю ширину грида */
	display: flex;
	/* горизонтально */
	justify-content: center;
	/* по центру */
	margin-top: var(--spacing);
	padding: 0;
	list-style: none;
}

/* Стили для ссылок страниц */
.blog-list .pagination .page-numbers {
	margin: 0 0.5rem;
	padding: 0.5rem 0.75rem;
}

/* Активная страница */
.blog-list .pagination .page-numbers.current {
	background: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
	cursor: default;
}

/* Если paginate_links выводит <ul><li> структуру */
.blog-list .pagination ul {
	display: flex;
	gap: 0.5rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.blog-list .pagination ul li {
	list-style: none;
}

.blog-list .pagination ul li a,
.blog-list .pagination ul li span {
	display: inline-block;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--color-primary);
	border-radius: 4px;
	color: var(--color-dark);
	background: #fff;
	transition: background 0.2s, color 0.2s, transform 0.2s;
}

.blog-list .pagination ul li a:hover {
	background: var(--color-primary);
	color: #fff;
	transform: translateY(-2px);
}

.blog-list .pagination ul li .current {
	background: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
	cursor: default;
}

ul.page-numbers a.page-numbers {
	text-decoration: none;
}

/*--------------------------------------------------------------
# Mobile Styles Start
--------------------------------------------------------------*/

@media (max-width: 768px) {

	.problems-hero-flex,
	.problems-for-flex {
		flex-direction: column;
	}

	.faq-box {
		padding: 0 15px;
	}

	.hot-products {
		margin-top: 20px;
	}

	h2 {
		font-size: 34px;
	}

	.first-cont {
		flex-direction: column;
		padding: 25px 0;
	}

	.wrap-item-prod-home {
		flex-direction: column;
	}

	.nav-menu {
		flex-direction: column;
	}

	.nav-menu li.menu-item {
		align-self: end;
		padding: 5px;
	}

	.nav-menu a {
		font-size: 20px;
	}

	.main-navigation.active {
		padding-top: 22px;
	}

	.h1hometitle {
		font-size: 38px;
	}

	.f-container {
		flex-direction: column;
	}

	.msto {
		margin: 0;
	}

	.container-r-w {
		padding-left: unset;
	}

	.fifth-left .mt-80 {
		margin-top: 15px;
	}

	.partner-box {
		padding: 0 0 30px 0;
	}

	.partner-box .container-partner .d-flex {
		flex-direction: column;
	}

	.container-partner h2 {
		margin: 0;
	}

	.third-wrap .wrap-item-prod-home .item-prod-home .d-flex {
		flex-direction: column;
	}

	/* Stack flex sections vertically */
	.second-cont-wrap,
	.fourth-cont-wrap,
	.fifth-cont-wrap,
	.wrap-item-prod-home {
		display: flex !important;
		flex-direction: column !important;
		align-items: center;
	}



	/* Hide decorative color lines */
	.color-line-sc,
	.color-line-sc2,
	.color-line-sc3,
	.color-line-sc0 {
		display: none !important;
	}

	/* Text readability */
	.desc-hometop,
	.fs22,
	.fs20 {
		font-size: 1rem !important;
		line-height: 1.6 !important;
	}

	.second-right {
		margin-top: 0;
	}

	.second-cont.mb-100 {
		margin-bottom: 0;
		padding-bottom: 50px;
	}

	.p-rel h2 {
		margin: 0;
		padding-top: 30px;
	}

	.prodw {
		padding: 0;
	}

	.fourth-cont .container-l-w {
		padding: 0;
	}

	.fifth-cont {
		padding-bottom: 50px;
	}

	.faq-content.p100 {
		padding: 15px 15px 50px;
	}
}

/*--------------------------------------------------------------
# Mobile Styles End
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Navigation (Меню)
--------------------------------------------------------------*/

/* Базовый стиль списка */
.nav-menu {

	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav-menu li.menu-item {
	padding: 0 8px;
}

.nav-menu li.menu-item a {
	text-decoration: none;
	color: #000;
}

.nav-menu ul.sub-menu li {
	position: relative;
	padding: 0;
}

.nav-menu ul.sub-menu li a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 12px 15px;
	color: #232323;
	background: transparent;
	text-decoration: none;
	transition: background 0.14s;
	border: none;
}

.nav-menu ul.sub-menu li:hover a,
.nav-menu ul.sub-menu li a:hover {
	background: #f1d81461;
	color: #000;
}


.nav-menu ul.sub-menu {
	padding: 20px 0;
	width: max-content;
}

.nav-menu li.menu-item.menu-item-has-children {
	position: relative;
}

/* Подменю */
.nav-menu .sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: #fff;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.nav-menu li.menu-item-has-children:hover>.sub-menu {
	display: block;
}

/* Кнопка-тогглер (скрыта на десктопе) */
.menu-toggle {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	padding: 10px;
}

.burger-icon,
.burger-icon::before,
.burger-icon::after {
	width: 25px;
	height: 3px;
	background: var(--color-dark);
	display: block;
	position: relative;
}

.burger-icon::before {
	content: '';
	position: absolute;
	top: -8px;
}

.burger-icon::after {
	content: '';
	position: absolute;
	top: 8px;
}



/* Мобильная версия */
@media (max-width: 768px) {
	.menu-toggle {
		display: block;
	}

	/* по умолчанию скрываем меню */
	#site-navigation {
		position: absolute;
		top: 100%;
		right: 0;
		width: 100%;
		z-index: 999;
		height: 100vh;
		background: #282828;
		transform: translateX(-200%);
		transition: transform 0.25s ease-in-out;
	}

	/* когда добавлен класс toggled-on – показываем */
	#site-navigation.toggled-on {
		transform: translateY(0);
	}

	/* делаем пункты меню столбцом */
	.nav-menu {
		display: block;
	}

	.nav-menu li.menu-item {
		border-bottom: 1px solid #4e4e4e;
	}

	.nav-menu li {
		margin: 0;

	}

	.nav-menu li a {
		display: block;
		padding: 12px 20px;
		color: #fff !important;
	}

	/* скрываем подменю по умолчанию */
	.nav-menu .sub-menu {
		position: static;
		box-shadow: none;
		background: none;
	}
}


/* ==========================================================================
	 2. Стили для страницы каталога (мини-карточки)
	 ========================================================================== */

/* 2.1. Фильтры */
.catalog-filter-form {
	display: inline-flex;
	flex-wrap: wrap;
	gap: .5rem 1rem;
	align-items: center;
	margin-bottom: 1.5rem;
}

.catalog-filter-form .filter-button,
.catalog-filter-form .reset-button {
	display: block;
	width: 80%;
	/* или конкретную ширину по вкусу */
	max-width: 220px;
	/* ограничение максимальной ширины */
	margin: 0.75rem auto;
	/* сверху / снизу отступ и центрирование */
	padding: 0.6rem 1rem;
}

.catalog-filter-form .reset-button {
	margin-top: 0;
	/* если нужен другой отступ */
	background: transparent;
	color: var(--color-dark);
	border: 1px solid var(--color-dark);
}

.catalog-filter-form fieldset {
	border: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: .5rem;
}

.catalog-filter-form legend {
	font-weight: 600;
	margin-right: .5rem;
}

.catalog-filter-form input[type="radio"] {
	margin-right: .25rem;
}

.catalog-filter-form .button,
.catalog-filter-form .reset-button {
	padding: .5rem 1rem;
	border-radius: 4px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
}

.catalog-filter-form .button {
	background: var(--color-primary);
	color: #fff;
	border: none;
}

.catalog-filter-form .reset-button {
	background: transparent;
	color: var(--color-dark);
	border: 1px solid var(--color-dark);
}


/* 2.3. Мини-карточка товара */
.catalog-list .product-card {
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
	display: flex;
	flex-direction: column;
	transition: transform .2s, box-shadow .2s;
	height: 100%;
}

.catalog-list .product-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.catalog-list .product-card .product-image img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform .3s;
}

.catalog-list .product-card .product-image:hover img {
	transform: scale(1.05);
}

.catalog-list .catalog-item .product-card .product-image {
	flex: 0 0 auto;
}

.catalog-list .product-card .product-info {
	padding: 1rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.catalog-list .product-card .product-title {
	font-size: 22px;
	margin: 0 0 .5rem;
}

.catalog-list .product-card .product-price {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 1rem;
}

.catalog-list .product-card .product-button {
	margin-top: auto;
	padding: .5rem;
	background: var(--color-primary);
	color: #32373c;
	text-align: center;
	border-radius: 4px;
	text-decoration: none;
	font-weight: 400;
	transition: background .2s;
}

.catalog-list .product-card .product-button:hover {
	background: var(--color-dark);
	color: #fff;
}

/* ==========================================================================
	 2. Layout для страницы каталога: sidebar + main
	 ========================================================================== */
.catalog-archive.layout-sidebar {
	display: flex;
	margin: 0 auto;
	max-width: 1600px;
}

.catalog-sidebar {
	padding: 1rem;
	border-radius: 8px;
}

.catalog-main {
	flex: 1;
	padding: 15px;
	background: #f9f9f9;
}

/* ==========================================================================
	 3. Стили категорий над фильтрами
	 ========================================================================== */
.catalog-categories {
	margin-bottom: var(--spacing);
}

.catalog-categories h3 {
	font-weight: 700;
	margin-bottom: 0.75rem;
}

.catalog-categories .cat-link {
	display: block;
	padding: 0.25rem 0;
	color: var(--color-dark);
	text-decoration: none;
	transition: color 0.2s;
}

.catalog-categories .cat-link.active {
	color: var(--color-primary);
	font-weight: 600;
}

.catalog-categories .cat-link.child {
	padding-left: 1rem;
}

.catalog-categories .cat-link:hover {
	color: var(--color-primary);
}

/* ==========================================================================
	 4. Стили фильтров в сайдбаре (вертикально на ПК)
	 ========================================================================== */
.catalog-filters {
	margin-top: 25px;
	padding-left: 30px;
	border-top: 1px solid #c3c1c1;
}

.catalog-sidebar h3 {
	font-size: 24px;
}

.catalog-filters h3 {
	padding: 15px 0;
}

.catalog-filter-form {
	display: block;
	margin-bottom: var(--spacing);
}

.catalog-filter-form fieldset {
	display: block;
	border: none;
	margin: 0 0 var(--spacing);
	padding: 0;
}

.catalog-filter-form legend {
	font-weight: 700;
	margin-bottom: 0.5rem;
	display: block;
}

.catalog-filter-form label {
	display: block;
	margin-bottom: 0.5rem;
	cursor: pointer;
}

.catalog-filter-form input[type="checkbox"] {
	margin-right: 0.5rem;
}

.catalog-filter-form .filter-button,
.catalog-filter-form .reset-button {
	padding: 0.5rem 1rem;
	border-radius: 4px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
	margin-right: 0.5rem;
	margin-top: 0.5rem;
}

.catalog-filter-form .filter-button {
	background: var(--color-primary);
	color: #fff;
	border: none;
	font-size: 16px;
}

.catalog-filter-form .reset-button {
	background: transparent;
	color: var(--color-dark);
	border: 1px solid var(--color-dark);
}

/* ==========================================================================
	 5. Сетка мини-карточек каталога
	 ========================================================================== */
.catalog-list {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(4, 1fr);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* три колонки на экранах до 1200px */
@media (max-width: 1180px) {
	.catalog-list {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* две колонки на экранах до 900px */
@media (max-width: 900px) {
	.catalog-list {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* одна колонка на экранах до 600px */
@media (max-width: 600px) {
	.catalog-list {
		grid-template-columns: 1fr;
	}
}


.catalog-item {
	margin: 0;
	padding: 0;
}

.product-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.product-card .product-image img {
	width: 100%;
	display: block;
	transition: transform 0.3s;
}

.product-card .product-image:hover img {
	transform: scale(1.05);
}


.product-card .product-title {
	font-size: 1.1rem;
	margin-bottom: 0.5rem;
	color: var(--color-dark);
}

.product-card .product-price {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 1rem;
}


.product-card .product-button:hover {
	background: var(--color-dark);
}

/* ==========================================================================
	 6. Стили single-catalog.php (страница одного товара)
	 ========================================================================== */
.catalog-single {
	max-width: 1200px;
	margin: 15px auto;
	padding: 15px;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1);
}

.catalog-single .stok-star {
	justify-content: start;
	margin-bottom: 15px;
}

.catalog-single .product-availability {
	margin-right: 20px;
}

.product-view {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}

.product-image {
	flex: 1 1 45%;
}

.product-image img {
	width: 100%;
	height: auto;
	border-radius: 6px;
}

.product-details {
	flex: 1 1 50%;
	display: flex;
	flex-direction: column;
}

.product-details .product-title {
	font-size: 2.25rem;
	color: var(--color-dark);
}

.product-details .product-price {
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--color-primary);
	margin-bottom: 1rem;
}

.product-details .product-rating {
	display: flex;
	gap: 0.25rem;
	margin-bottom: 1rem;
	font-size: 1rem;
}

.product-details .product-rating .star {
	color: #ddd;
}

.product-details .product-rating .star.filled {
	color: #ffb400;
}

.product-details .product-specs {
	list-style: none;
	padding: 0;
	margin: 1rem 0 2rem;
	border-top: 1px solid #eee;
}

.product-details .product-specs li {
	padding: 0.75rem 0;
	border-bottom: 1px solid #eee;
}

.product-details .product-specs li:last-child {
	border-bottom: none;
}

.product-details .product-button {
	padding: 0.85rem 1.5rem;
	background: var(--color-primary);
	color: #fff;
	text-decoration: none;
	border-radius: 6px;
	font-weight: 600;
	margin-top: auto;
	transition: background 0.3s, transform 0.1s;
}

.product-details .product-button:hover {
	background: var(--color-dark);
	transform: translateY(-2px);
}

.product-description {
	margin-top: 3rem;
	line-height: 1.7;
	color: var(--color-gray);
	line-height: 1.8;
	padding: 8px;
}

/* .product-description ul li {
	margin-left: 30px;
} */

.product-description h2 {
	text-align: center;
	font-size: 28px;
	line-height: 2.4;
}

/* ==========================================================================
	 7. Адаптив (до 768px)
	 ========================================================================== */
@media (max-width: 768px) {
	.catalog-archive.layout-sidebar {
		flex-direction: column;
	}

	.catalog-sidebar {
		width: 100%;
		margin-bottom: var(--spacing);
	}

	.catalog-list {
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	}

	.product-view {
		flex-direction: column;
	}

	.product-image,
	.product-details {
		flex: 1 1 100%;
	}
}

/* ===================================================================
   Поиск по каталогу над категориями
=================================================================== */
.catalog-search {
	margin-bottom: var(--spacing);
	text-align: center;
}

.catalog-search .search-form {
	display: inline-flex;
	border: 1px solid #ccc;
	border-radius: 50px;
	overflow: hidden;
}

.catalog-search .search-field {
	border: none;
	padding: 0.5rem 1rem;
	font-size: 1rem;
	outline: none;
	width: 200px;
}

.catalog-search .search-field:focus {
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}

.catalog-search .search-submit {
	background: var(--color-primary);
	border: none;
	padding: 0 1rem;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
	transition: background 0.3s;
}

.catalog-search .search-submit:hover {
	background: var(--color-dark);
}


@media (max-width: 768px) {

	/* Скрываем весь контент сайдбара кроме кнопки */
	.catalog-sidebar .sidebar-inner {
		display: none;
		padding-top: 15px;
	}

	/* Кнопка-раскрытие всегда видна */
	.sidebar-toggle {
		display: block;
		width: 100%;
		background: var(--color-primary);
		color: #fff;
		border: none;
		padding: 0.75rem;
		font-size: 1rem;
		cursor: pointer;
	}

	/* При добавлении класса .open показываем содержимое */
	.catalog-sidebar.open .sidebar-inner {
		display: block;
		padding-top: 20px;
	}
}

@media (min-width: 768px) {
	.sidebar-toggle {
		display: none;
	}
}

/* ==========================================================================
   Универсальный стиль для кнопки сброса фильтров
   ========================================================================== */
.reset-button {
	display: inline-block;
	text-align: center;
	background: transparent;
	color: var(--color-dark);
	border: 1px solid var(--color-dark);
	padding: 0.5rem 1rem;
	border-radius: 4px;
	font-weight: 600;
	transition: background 0.2s, color 0.2s;
	cursor: pointer;
	text-decoration: none;
	margin-top: 0.5rem;
}

/* При наведении — темная заливка и белый текст */
.reset-button:hover {
	background: var(--color-dark);
	color: #fff;
}

.catalog-current-filter {
	padding-bottom: 15px;
}


/* Заголовок результатов поиска */
.search-header {
	text-align: center;
	margin: 2rem 0 1rem;
}

.search-title {
	font-size: 2rem;
	font-weight: 700;
	color: var(--color-dark);
}

.search-title .highlight {
	color: var(--color-primary);
}



/*--------------------------------------------------------------
# Catalog Pagination Overrides
--------------------------------------------------------------*/
.catalog-pagination {
	text-align: center;
	margin: var(--spacing) 0;
}

.catalog-pagination .page-numbers {
	display: inline-block;
	margin: 0 0.5rem;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--color-primary);
	border-radius: 4px;
	color: var(--color-dark);
	background: #fff;
	text-decoration: none;
	transition: background 0.2s, color 0.2s, transform 0.2s;
}

.catalog-pagination .page-numbers.current {
	background: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
	cursor: default;
}

.catalog-pagination .page-numbers:hover {
	background: var(--color-primary);
	color: #fff;
	transform: translateY(-2px);
}

.stars {
	color: #f1c40f;
	font-size: 1.2em;
}

.stok-star {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.product-availability {
	display: flex;
	align-items: center;
	/* margin-top: 15px; */
	font-weight: 600;
}

.product-availability svg {
	margin-right: 0.5rem;
	color: var(--color-primary);
}

.product-availability.out-of-stock svg,
.product-availability.out-of-stock span {
	color: #e74c3c;
	/* красный для “нет в наличии” */
}

.product-availability.in-stock svg,
.product-availability.in-stock span {
	color: #4caf50;
}

.catalog-list .product-title a {
	color: #32373c;
	text-decoration: none;

}

h1.product-title {
	padding: 0;
}



/* --------------------------------------------------
   Modern Product Specs Table
   -------------------------------------------------- */
.product-specs-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
	border-radius: 8px;
	overflow: hidden;
}

.product-specs-table th,
.product-specs-table td {
	padding: 0.75rem 1rem;
	background: #fff;
}

.product-specs-table th {
	background: var(--color-light);
	font-weight: 600;
	color: var(--color-dark);
	text-align: left;
	width: 30%;
	border-bottom: 1px solid #e0e0e0;
}

.product-specs-table td {
	color: #515151;
	border-bottom: 1px solid #e0e0e0;
}

.product-specs-table tr:nth-child(even) td {
	background: #f9f9f9;
}

.product-specs-table tr:last-child th,
.product-specs-table tr:last-child td {
	border-bottom: none;
}

/* Responsive */
@media (max-width: 600px) {
	.product-specs-table {
		display: block;
		overflow-x: auto;
	}
}


/* Комpaktный список спецификаций в мини-карточке */
.catalog-list .mini-specs {
	list-style: none;
	margin: .5rem 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .25rem .75rem;
	font-size: .85rem;
	color: #555;
	background: var(--color-light);
	border-radius: 4px;
}

.catalog-list .mini-specs li {
	padding: .5rem;
}

.catalog-list .mini-specs .prop {
	font-weight: 600;
	margin-right: .25rem;
	color: var(--color-dark);
}


.product-attributes {
	padding: 1rem;
	background: #f9f9f9;
	border-radius: 6px;
}

.product-attributes>div {
	margin-bottom: 0.5rem;
	font-size: 0.95rem;
}

.product-attributes strong {
	display: inline-block;
	width: 5.5rem;
	color: var(--color-dark);
}

/* отдельные стили, если нужно */
.product-forms {
	/* дополнительные стили для Forms */
}

.product-sizes {
	/* дополнительные стили для Sizes */
}


h3 {
	font-size: 22px;
}

.font-sans {
	font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}


/*===== Ваши существующие стили =====*/
.clicli {
	line-height: 1.6;
}

ul {
	list-style: none;
}

.partner-hero {
	background: linear-gradient(135deg, #e0e0e0, #ffffff);
	padding: 100px 20px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.partner-hero h1 {
	font-size: 3rem;
	margin-bottom: 20px;
	max-width: 800px;
}

.partner-hero p {
	font-size: 1.2rem;
	max-width: 700px;
	margin-bottom: 30px;
}

.fcontainer .cta-button {
	background: #090909;
}

.cta-button {
	display: inline-block;
	background: #444;
	color: #fff;
	padding: 15px 30px;
	text-decoration: none;
	border-radius: 50px;
	font-weight: bold;
	transition: transform 0.3s, background 0.3s;
}

.cta-button:hover {
	background: #222;
	transform: scale(1.05);
}

section {
	padding: 60px 15px;
	max-width: 1270px;
	margin: 0 auto;
}

section #partner-form {
	padding: 60px 20px;
	max-width: 960px;
	margin: 0 auto;
}

.why svg {
	color: #0d9488;
}

section.why,
section.how {
	padding: 80px 20px 120px !important;
}

.what-we-offer ul.svg-icon-li li {
	display: flex;
	gap: 0.75rem;
}

.what-we-offer ul.svg-icon-li li svg {
	color: #0d9488;
	margin-top: 0.25rem;
	flex: 0 0 24px;
}

ul.card2 {
	padding: 0;
}

ul.card2.svg-icon-li {
	line-height: 2.1;
}

.how-number {
	font-weight: bold;
	font-size: 3rem;
	color: #0d9488;
}

.section-title {
	font-size: 2.5rem;
	margin-bottom: 50px;
	text-align: center;
	position: relative;
}

.section-title::after {
	content: '';
	width: 60px;
	height: 4px;
	background: #444;
	display: block;
	margin: 20px auto 0;
	border-radius: 2px;
}

.grid-2,
.grid-4,
.grid-22 {
	display: grid;
	gap: 30px;
}

.workwith .grid-22 {
	grid-template-columns: 40% 60%;
	align-items: center;
}

@media (max-width: 768px) {
	.workwith .grid-22 {
		grid-template-columns: 1fr;
	}
}

.grid-2 {
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	align-items: center;
}

.partner-benefits .grid-2 {
	align-items: normal;
	margin-top: 30px;
}

.grid-4 {
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	text-align: center;
}

.card {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	padding: 30px;
	transition: transform 0.3s;
}

.card-link-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	text-indent: -9999px;
	background: transparent;
	cursor: pointer;
}

.card1 {
	border-radius: 12px;
	padding-top: 30px;
	transition: transform 0.3s;
}

.card2 {
	border-radius: 12px;
	line-height: 1.8;
}

.card:hover {
	transform: translateY(-5px);
}

img.responsive {
	width: 100%;
	border-radius: 12px;
}

.faq-item {
	margin-bottom: 30px;
}

.faq-item strong {
	display: block;
	margin-bottom: 10px;
	font-size: 1.1rem;
}

.contact-info {
	text-align: center;
	padding: 60px 20px;
	/* background: linear-gradient(135deg, #f0f0f0, #ffffff); */
}

/* ===== Partner form ===================== */
#partner-form {
	padding: 80px 20px;
	text-align: center
}

.partner-form {
	max-width: 680px;
	margin-inline: auto;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.partner-form label {
	font-weight: 600;
	margin-bottom: 8px;
	color: #374151;
	display: block
}

.partner-form input,
.partner-form textarea {
	width: 100%;
	padding: 14px 18px;
	font-size: 1rem;
	border: 1px solid #d1d5db;
	border-radius: 10px;
	background: #ffffff;
	transition: border-color .2s, box-shadow .2s
}

.partner-form input:focus,
.partner-form textarea:focus {
	border-color: #0d9488;
	box-shadow: 0 0 0 3px rgba(13, 148, 136, .15);
	outline: none
}

/* две колонки на ≥640 px */
.grid-two {
	display: flex;
	flex-direction: column;
	gap: 26px
}

@media(min-width:640px) {
	.grid-two {
		flex-direction: row
	}
}

.grid-two>* {
	flex: 1
}

/* кнопка */
.partner-form .cta-button {
	align-self: center;
}

.grid-products {
	display: grid;
	gap: 30px;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	margin-top: 30px;
}

.partner-prod .product-card {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	padding: 20px;
	text-align: center;
	transition: transform 0.3s;
}

.partner-prod .product-card:hover {
	transform: translateY(-5px);
}

.partner-prod .product-card img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	border-radius: 8px;
	margin-bottom: 15px;
}

.partner-prod .product-card h3 {
	margin: 15px 0 10px;
}

.partner-prod .product-card p {
	font-size: 0.95rem;
	color: #555;
}

/*===== Новые стили для блока отзывов партнеров =====*/

.partners .section-title {
	margin-bottom: 40px;
}

.partners .grid-2 {
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	align-items: normal;
}

.partners .card {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px;
}

.partners .testimonial-image {
	width: 100px;
	height: 100px;
	margin-bottom: 15px;
}

.partners .testimonial-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.partners .testimonial-text {
	font-style: italic;
	line-height: 1.5;
	margin-bottom: 15px;
	color: #333;
}

.partners .testimonial-author {
	font-weight: 600;
	color: #444;
}

@media (max-width: 480px) {
	.partners .testimonial-text {
		font-size: 0.95rem;
	}

	.partners .testimonial-author {
		font-size: 0.85rem;
	}
}

.bg-w {
	background: linear-gradient(135deg, #f0f0f0, #ffffff);
}

.bg-r {
	background: linear-gradient(133deg, #ffe26c 50%, #ffffff 100%);
}






.partners-section {
	max-width: 1200px;
	margin: 0 auto;
	padding: 60px 20px;
	font-family: Arial, sans-serif;
}

.partners-header h2 {
	font-size: 32px;
	margin-bottom: 10px;
}

.partners-header h3 {
	margin-bottom: 15px;
	color: #555;
}

.partners-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 20px;
	margin-top: 30px;
}

.partner-card {
	border: 1px solid #ececec;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
	--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
	--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
	transition: transform 0.3s;
}

.partner-card:hover {
	transform: translateY(-5px);
}

.partner-card img {
	width: 100%;
	height: 180px;
	object-fit: cover;
}

.partner-card p {
	padding: 15px;
	font-size: 16px;
	color: #333;
}

.mt-15 {
	margin-top: 15px;
}

.h-reviews-box {
	background: #faf6ee;
}

.review-single-container {
	max-width: 1200px;
	margin: 15px auto;
	padding: 15px;
}

#review-popup-modal {
	display: none;
	position: fixed;
	align-items: center;
	justify-content: center;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 9999;
	background: rgb(0 0 0 / 66%);
}


#review-popup-modal[style*="flex"] {
	display: flex !important;
}

#review-popup-modal>div {
	background: #fff;
	padding: 36px 30px 26px 30px;
	max-width: 420px;
	width: 90vw;
	border-radius: 18px;
	position: relative;
	box-shadow: 0 12px 56px #1113;
	animation: popShow .18s;
}

@keyframes popShow {
	from {
		opacity: 0;
		transform: scale(0.93);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

#close-review-popup {
	position: absolute;
	top: 10px;
	right: 14px;
	font-size: 2em;
	background: none;
	border: none;
	cursor: pointer;
	color: #888;
	transition: color .18s;
}

#close-review-popup:hover {
	color: #D33;
}

#review-form input[type="text"],
#review-form input[type="url"],
#review-form textarea,
#review-form select {
	width: 100%;
	font-size: 1em;
	border-radius: 8px;
	border: 1px solid #ffffff;
	padding: 9px 13px;
	margin-top: 4px;
	margin-bottom: 12px;
	box-sizing: border-box;
	transition: border .18s;
	box-shadow: 0 0 7px #bdbdbd;
}

#review-form input:focus,
#review-form textarea:focus,
#review-form select:focus {
	border-color: #aaa;
	outline: none;
}

#review-form button[type="submit"] {
	background: #222;
	color: #fff;
	border: none;
	border-radius: 7px;
	padding: 12px 28px;
	font-size: 1.06em;
	font-weight: 500;
	cursor: pointer;
	transition: background .16s;
	width: 100%;
}

#review-form button[type="submit"]:hover {
	background: #111;
}

#review-form-msg {
	min-height: 24px;
	margin-bottom: 8px;
	font-size: 1.06em;
}


.home-mini-contact {
	padding: 40px 15px;
	font-size: 1.08em;
}

.home-mini-contact-box {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	width: 100%;
	gap: 30px;
}


.home-mini-contact-info h3 {
	margin: 0 0 13px 0;
	font-size: 1.2em;
	font-weight: 600;
	color: #223;
	letter-spacing: 0.01em;
}

.home-mini-contact-info div {
	margin-bottom: 7px;
}

.home-mini-contact-info span {
	font-weight: 500;
	color: #556;
	margin-right: 8px;
	display: inline-block;
	min-width: 70px;
}

.home-mini-contact-info a {
	color: #2867b3;
	text-decoration: none;
	transition: color .18s;
	font-weight: 500;
	word-break: break-all;
}

.home-mini-contact-info a:hover {
	color: #183d66;
}

@media (max-width: 600px) {
	.home-mini-contact {
		padding: 30px 15px;
	}

	.home-mini-contact-box {
		flex-direction: column;
		gap: 12px;
	}

	.home-mini-contact-action {
		justify-content: flex-start;
		margin-top: 10px;
	}
}

.problems-hero-section {
	padding: 60px 0 80px 0;
}

.problems-hero-flex {
	display: flex;
	gap: 60px;
	align-items: center;
	justify-content: space-between;
}

.problems-hero-text {
	flex: 1 1 430px;
}

.hero-title {
	font-size: 3.3rem;
	font-weight: 900;
	line-height: 1.08;
	color: #32373c;
	margin-bottom: 28px;
}

.hero-sub {
	font-size: 1.25rem;
	color: #555;
	margin-bottom: 32px;
}


.problems-hero-img img {
	border-radius: 20px;
	box-shadow: 0 10px 40px #dededecc;
	max-width: 410px;
	width: 100%;
}

.problems-for-section {
	background: #fff;
	padding: 80px 0;
}

.problems-for-flex {
	display: flex;
	gap: 44px;
	align-items: center;
	justify-content: space-evenly;
}

.section-title-alt {
	font-size: 2rem;
	margin-bottom: 20px;
	font-weight: bold;
	color: #1d2332;
}

.for-whom-list {
	list-style: disc;
	margin-left: 24px;
	color: #444;
	font-size: 1.18rem;
	margin-bottom: 18px;
}

.for-icons svg {
	margin-right: 9px;
}

.problems-solutions-section {
	padding: 60px 0;
}

.section-title {
	font-size: 2.3rem;
	margin-bottom: 38px;
	text-align: center;
	color: #222;
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: .01em;
}

.problems-cards-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
	gap: 36px;
}

.problem-card {
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 6px 32px #dfdfdf33;
	padding: 34px 24px 24px 24px;
	text-align: left;
	transition: box-shadow .18s;
}

.problem-card:hover {
	box-shadow: 0 12px 40px #c1c1c144;
}

.problem-icon {
	font-size: 2.5rem;
	display: inline-block;
	margin-bottom: 12px;
}

.problem-card h3 {
	font-size: 1.18rem;
	color: #2b2b2b;
	margin-bottom: 8px;
	text-transform: uppercase;
	font-weight: bold;
}

.problem-card p {
	color: #454545;
	font-size: 1.07rem;
	margin: 0;
}

.problems-visual-section {
	padding: 60px 0 38px 0;
}

.visual-flex {
	display: flex;
	gap: 2rem;
	align-items: center;
	justify-content: space-evenly;
}

@media (max-width: 768px) {
	.visual-flex {
		flex-direction: column;
	}
}

.visual-img img {
	border-radius: 14px;
	max-width: 370px;
	box-shadow: 0 4px 18px #e4c60018;
}

.visual-ul {
	margin: 14px 0 16px 0;
	padding-left: 19px;
	color: #333;
	font-size: 1.07em;
	line-height: 1.9;
}


.problems-reviews-section {
	background: #fff;
	padding: 80px 0 120px 0;
}

.reviews-slider {
	display: flex;
	gap: 32px;
	justify-content: center;
	margin-bottom: 24px;
	flex-wrap: wrap;
}

.review-card {
	background: #f1c50e22;
	border-radius: 14px;
	box-shadow: 0 4px 16px #e2e2e2a6;
	padding: 24px 26px;
	max-width: 320px;
	min-width: 220px;
	font-size: 1.09em;
	font-style: italic;
}

.review-author {
	margin-top: 10px;
	color: #32373c;
	font-weight: bold;
	font-size: 0.98em;
	text-align: right;
}

.problems-cta-section {
	padding: 60px
}


/* ====== Desktop: underline active menu item with animation ====== */
@media (min-width: 769px) {
	.nav-menu {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 5px;
		background: #fff;
		border-bottom: 4px solid #f1c50e0e;
		padding-bottom: 0;
		margin: 0;
	}

	.nav-menu li.menu-item {
		position: relative;
		list-style: none;
		padding: 0 12px;
	}

	.nav-menu li.menu-item a {
		display: block;
		font-size: 1.06rem;
		color: #000;
		text-decoration: none;
		padding: 18px 0 13px 0;
		position: relative;
		transition: color 0.18s;
		font-family: 'Inter', 'Archivo Narrow', Arial, sans-serif;
		font-weight: 600;
	}

	.nav-menu li.menu-item a::after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 4px;
		height: 3px;
		background: #f1c50e;
		border-radius: 2px;
		transform: scaleX(0);
		transition: transform 0.28s cubic-bezier(0.76, 0, 0.24, 1);
		pointer-events: none;
	}

	.nav-menu li.menu-item:hover>a::after,
	.nav-menu li.menu-item.current-menu-item>a::after {
		transform: scaleX(1);
	}

	.nav-menu li.menu-item:hover>a,
	.nav-menu li.menu-item.current-menu-item>a {
		color: #e4a807;
	}

	.menu-toggle {
		display: none;
	}
}

/* ====== Mobile: minimal underline and clarity ====== */
@media (max-width: 768px) {
	#site-navigation {
		position: absolute;
		top: 100%;
		right: 0;
		width: 100%;
		z-index: 999;
		height: 100vh;
		background: #282828;
		transform: translateX(-200%);
		transition: transform 0.25s ease-in-out;
	}

	#site-navigation.toggled-on {
		transform: translateY(0);
	}

	.nav-menu {
		display: block;
		margin: 0;
		padding: 0;
	}

	.nav-menu li.menu-item {
		border-bottom: 1px solid #3a3a3a;
		margin: 0;
		position: relative;
	}

	.nav-menu li.menu-item a {
		padding: 14px 26px;
		font-size: 1.09rem;
		color: #fff !important;
		font-weight: 500;
		border-bottom: 2px solid transparent;
		transition: border-color 0.18s, color 0.18s;
		display: block;
	}

	.nav-menu li.menu-item.current-menu-item>a,
	.nav-menu li.menu-item:hover>a {
		border-bottom: 2px solid #f1c50e;
		color: #e4a807 !important;
		background: #2222;
	}

	.menu-toggle {
		display: block;
		background: none;
		border: none;
		cursor: pointer;
		padding: 10px;
		z-index: 1002;
		position: relative;
	}

	.burger-icon,
	.burger-icon::before,
	.burger-icon::after {
		display: block;
		background: #111;
		height: 3px;
		width: 26px;
		border-radius: 2px;
		transition: all 0.25s;
		position: relative;
	}

	.burger-icon::before,
	.burger-icon::after {
		content: '';
		position: absolute;
		left: 0;
		width: 26px;
		height: 3px;
		border-radius: 2px;
		background: #111;
		transition: all 0.25s;
	}

	.burger-icon::before {
		top: -8px;
	}

	.burger-icon::after {
		top: 8px;
	}
}