/**
 * Site design system — UX audit (Task 14): єдині CTA, токени бренду, шапка.
 * Завантажується після hero-cta / find-your-door / mobile-ux.
 *
 * Колір бренду за замовчуванням збігається з Redux primary у темі (#bd8348).
 * Щоб змінити — оновіть --ld-brand у :root або в Customizer/дочірній темі.
 */

/* -------------------------------------------------------------------------
   Токени
   ------------------------------------------------------------------------- */
:root {
	--ld-brand: #bd8348;
	--ld-brand-hover: #a06f3d;
	--ld-text: #201f1f;
	--ld-muted: #606060;
	--ld-radius-pill: 50px;
	--ld-transition: 0.25s ease;
	--ld-font-cta: inherit;
}

/* Smart Slider: use site sans-serif fonts */
[class*="n2-ss-slider"] .n2-ss-layer-content h1,
[class*="n2-ss-slider"] .n2-ss-layer-content h2,
[class*="n2-ss-slider"] .n2-ss-layer-content h3,
[class*="n2-ss-slider"] .n2-ss-layer-content .n2-ss-heading,
[class*="n2-ss-slider"] .n2-ss-layer-content p,
[class*="n2-ss-slider"] .n2-ss-layer-content .n2-ss-text {
	font-family: "Poppins", "Rubik", Arial, sans-serif !important;
}

/* -------------------------------------------------------------------------
   Шапка: узгоджені іконки / дрібний текст (менше «звалища» наборів)
   ------------------------------------------------------------------------- */
.header-container .nav-mobile .toggle-menu {
	font-size: 20px;
	line-height: 1;
}

.header-container .top-search .dropdown-toggle .top-search > a,
.header-container .top-search .dropdown-toggle a {
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.02em;
}

.header-container .header-top-setting > .ion-navicon {
	font-size: 26px;
	opacity: 0.92;
}

.header-container .shoping_cart .cart-toggler {
	font-size: 14px;
}

/* -------------------------------------------------------------------------
   Primary CTA — один стиль (шапка + Find your door)
   ------------------------------------------------------------------------- */
.header-cta,
.find-your-door-section .all-doors-btn {
	background: var(--ld-brand) !important;
	background-image: none !important;
	border: 2px solid var(--ld-brand) !important;
	border-radius: var(--ld-radius-pill) !important;
	color: #fff !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	letter-spacing: 0.04em !important;
	text-decoration: none !important;
	box-shadow: none !important;
	transition:
		background var(--ld-transition),
		border-color var(--ld-transition),
		color var(--ld-transition),
		transform 0.2s ease !important;
}

.header-cta:hover,
.header-cta:focus,
.find-your-door-section .all-doors-btn:hover,
.find-your-door-section .all-doors-btn:focus {
	background: var(--ld-brand-hover) !important;
	border-color: var(--ld-brand-hover) !important;
	color: #fff !important;
}

/* -------------------------------------------------------------------------
   Hero CTA — варіант «на темному фото» (без градієнта Woo), ті самі метрики
   ------------------------------------------------------------------------- */
.hero-cta {
	font-size: 15px !important;
	line-height: 1.25 !important;
	padding: 14px 30px !important;
	letter-spacing: 0.04em !important;
	border-radius: var(--ld-radius-pill) !important;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.2) !important;
	transition:
		background var(--ld-transition),
		color var(--ld-transition),
		border-color var(--ld-transition),
		transform 0.2s ease,
		box-shadow var(--ld-transition) !important;
}

.hero-cta:hover,
.hero-cta:focus {
	box-shadow: 0 6px 22px rgba(0, 0, 0, 0.28) !important;
}

@media screen and (max-width: 991px) {
	.header-cta,
	.find-your-door-section .all-doors-btn {
		font-size: 14px !important;
		padding: 10px 20px !important;
	}

	.hero-cta {
		font-size: 14px !important;
		padding: 12px 26px !important;
	}
}

/* -------------------------------------------------------------------------
   Головна сторінка: ієрархія типографіки + ритм секцій
   ------------------------------------------------------------------------- */
body.home #main .wpb_text_column,
body.home #main .entry-content,
body.home #main .textwidget {
	font-size: 15px;
	line-height: 1.65;
	color: var(--ld-muted);
}

body.home #main .wpb_text_column h2,
body.home #main .entry-content h2,
body.home #main .textwidget h2 {
	font-size: 28px;
	line-height: 1.2;
	font-weight: 600;
	color: var(--ld-text);
	margin: 0 0 14px;
	letter-spacing: -0.02em;
}

body.home #main .wpb_text_column h3,
body.home #main .entry-content h3,
body.home #main .textwidget h3 {
	font-size: 17px;
	line-height: 1.3;
	font-weight: 600;
	color: var(--ld-text);
	margin: 22px 0 10px;
}

body.home #main .wpb_text_column h4,
body.home #main .entry-content h4 {
	font-size: 15px;
	font-weight: 600;
	color: var(--ld-text);
	margin: 16px 0 8px;
}

/* Перший абзац у текстовому блоці — «lead» */
body.home #main .wpb_text_column .wpb_wrapper > p:first-of-type {
	font-size: 16px;
	line-height: 1.6;
	color: #4a4a4a;
	margin-bottom: 16px;
}

/* У редакторі можна додати клас ld-lead на абзац */
body.home #main .ld-lead,
body.home #main p.lead {
	font-size: 17px !important;
	line-height: 1.55 !important;
	color: #454545 !important;
	font-weight: 400;
}

body.home #main > .page-wrapper .section-element,
body.home #main .section-element {
	margin-bottom: 2.5rem;
}

@media screen and (min-width: 992px) {
	body.home #main > .page-wrapper .section-element,
	body.home #main .section-element {
		margin-bottom: 3rem;
	}
}

/* -------------------------------------------------------------------------
   Footer (layout first): cleaner 3-column rhythm without duplicates
   ------------------------------------------------------------------------- */
#site-footer .footer .footer-top {
	padding-top: 56px;
	padding-bottom: 34px;
}

#site-footer .footer .footer-top .row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	column-gap: 36px;
	row-gap: 18px;
}

#site-footer .footer .footer-top .row > .col-md-6 {
	flex: 1 1 430px;
	max-width: 560px;
	padding-right: 0;
}

#site-footer .footer .footer-top .row > .col-sm-3.col-md-3 {
	flex: 1 1 210px;
	max-width: 260px;
	padding-left: 0;
	padding-right: 0;
}

#site-footer .footer .footer-top .row > .col-md-6 .widget_contact_us img,
#site-footer .footer .footer-top .row > .col-md-6 .widget_contact_us .wp-block-image img {
	width: 150px !important;
	max-width: 150px !important;
	height: auto !important;
}

#site-footer .footer .footer-top .widget_menu .widget-title {
	margin-bottom: 14px;
	font-size: 22px;
	line-height: 1.2;
	font-weight: 600;
	color: #f1f1f1;
}

#site-footer .footer .footer-top .row > .col-sm-3.col-md-3:first-of-type .widget-title span {
	font-size: 0;
}
#site-footer .footer .footer-top .row > .col-sm-3.col-md-3:first-of-type .widget-title span::before {
	content: "All Products";
	font-size: 22px;
}

#site-footer .footer .footer-top .widget_menu .menu li,
#site-footer .footer .footer-top .widget_menu ul li {
	margin-bottom: 8px;
}

#site-footer .footer .footer-top .widget_menu .menu li a,
#site-footer .footer .footer-top .widget_menu ul li a {
	font-size: 18px;
	line-height: 1.35;
	color: #bdbdbd;
}

#site-footer .footer .footer-top .widget_menu .menu li a:hover,
#site-footer .footer .footer-top .widget_menu ul li a:hover {
	color: #ffffff;
}

#site-footer .footer .footer-bottom .widget-copyright,
#site-footer .footer .footer-bottom .widget-copyright a {
	color: #9e9e9e;
}

@media screen and (max-width: 991px) {
	#site-footer .footer .footer-top {
		padding-top: 42px;
		padding-bottom: 26px;
	}
	#site-footer .footer .footer-top .row > .col-md-6,
	#site-footer .footer .footer-top .row > .col-sm-3.col-md-3 {
		flex: 1 1 100%;
		max-width: 100%;
	}
}

/* -------------------------------------------------------------------------
   Головна: спрощені картки товарів (без блоку дій у сітці)
   ------------------------------------------------------------------------- */
body.home #main .shop-products.products .product .actions,
body.home #main .shop-products.products .product .add-to-links,
body.home #main .shop-products.list-view .product .actions,
body.home #main .shop-products.list-view .product .add-to-links,
body.home .shop-products.products .product .actions,
body.home .shop-products.products .product .add-to-links {
	display: none !important;
}

body.home #main .shop-products.products .product .price-box,
body.home .shop-products.products .product .price-box {
	margin-bottom: 6px;
}

body.home #main .shop-products.products .product .product-name,
body.home .shop-products.products .product .product-name {
	margin-bottom: 4px;
}

body.home #main .shop-products.products .product .star-rating,
body.home .shop-products.products .product .star-rating {
	opacity: 0.88;
}

/* -------------------------------------------------------------------------
   Головна: фото товарів у сітці — повністю видимі (вертикальні двері тощо)
   Без #main — блок VC інколи поза типовою обгорткою.
   Скидаємо scale(0.8,1) теми на secondary_image (спотворення + «вузька» картка).
   ------------------------------------------------------------------------- */
body.home .shop-products.products .product-wrapper .product-image {
	overflow: visible !important;
}

body.home .shop-products.products .product-wrapper .product-image a {
	display: block !important;
	position: relative !important;
	height: auto !important;
	min-height: 0 !important;
}

body.home .shop-products.products .product-image a img.primary_image,
body.home .shop-products.products .product-image a > img:first-of-type:not(.secondary_image) {
	width: 100% !important;
	height: auto !important;
	max-width: 100% !important;
	object-fit: contain !important;
	object-position: center bottom;
	display: block !important;
	float: none !important;
}

body.home .shop-products.products .product-image a img:not(.secondary_image) {
	object-fit: contain !important;
}

body.home .shop-products.products .product-image a img.secondary_image {
	object-fit: contain !important;
	object-position: center center !important;
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	left: 0 !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	transform: none !important;
	-webkit-transform: none !important;
	-moz-transform: none !important;
	-ms-transform: none !important;
	-o-transform: none !important;
}

/* Кнопки WPBakery на головній: без «глянцевого» градієнта теми, однакова форма */
body.home #main .vc_general.vc_btn3 {
	background-image: none !important;
	border-radius: var(--ld-radius-pill) !important;
	font-weight: 600 !important;
	letter-spacing: 0.03em !important;
	transition: background var(--ld-transition), color var(--ld-transition), border-color var(--ld-transition), opacity var(--ld-transition) !important;
}
