/* =============================================
   RAMOS — ИНЖИНИРИНГ — Main Stylesheet
   Brand: Manrope / Graphite + Copper
   ============================================= */

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

/* =============================================
   CSS CUSTOM PROPERTIES
   ============================================= */

:root {
	/* Brand Colors */
	--color-graphite:      #1F2326;
	--color-graphite-text: #2C2C2C;
	--color-copper:        #B5651D;
	--color-white:         #FFFFFF;
	--color-neutral:       #F5F5F5;

	/* Derived */
	--color-graphite-80:   rgba(31, 35, 38, 0.80);
	--color-copper-hover:  #9A5218;
	--color-border:        rgba(255,255,255,0.10);
	--color-border-light:  rgba(44,44,44,0.12);

	/* Messenger brand colors */
	--color-viber:     #7360F2;
	--color-telegram:  #2CA5E0;
	--color-whatsapp:  #25D366;

	/* Typography */
	--font-family: 'Manrope', sans-serif;

	/* Type scale */
	--text-h1:      clamp(2.25rem, 4vw, 3rem);
	--text-h2:      clamp(1.625rem, 2.5vw, 2rem);
	--text-h3:      clamp(1.125rem, 1.8vw, 1.375rem);
	--text-body:    1rem;
	--text-caption: 0.75rem;
	--text-label:   0.8125rem;

	/* Spacing */
	--section-py:  clamp(4rem, 7vw, 6.5rem);
	--gap-lg:      2rem;
	--gap-md:      1.25rem;
	--gap-sm:      0.75rem;

	/* Container */
	--container-max: 1536px;
	--container-px:  clamp(1rem, 4vw, 2.5rem);

	/* Header */
	--header-height:    72px;
	--admin-bar-height: 0px;

	/* Transitions */
	--ease:    0.22s ease;
	--ease-md: 0.35s ease;
}

/* =============================================
   RESET & BASE
   ============================================= */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }

body {
	font-family: var(--font-family);
	font-size: var(--text-body);
	font-weight: 400;
	line-height: 1.65;
	color: var(--color-graphite-text);
	background: var(--color-white);
}

img    { display: block; max-width: 100%; height: auto; }
a      { color: inherit; text-decoration: none; }
ul     { list-style: none; }
button { cursor: pointer; font-family: inherit; border: none; background: none; }

/* =============================================
   CONTAINER
   ============================================= */

.ramos-container {
	width: 100%;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--container-px);
}

@media (max-width: 1600px) { :root { --container-max: 1440px; } }
@media (max-width: 1440px) { :root { --container-max: 1280px; } }
@media (max-width: 1280px) { :root { --container-max: 1140px; } }
@media (max-width: 1024px) { :root { --container-max: 100%; --container-px: 1.5rem; } }
@media (max-width: 768px)  { :root { --container-px: 1.25rem; } }
@media (max-width: 480px)  { :root { --container-px: 1rem; } }

/* =============================================
   TYPOGRAPHY UTILITIES
   ============================================= */

.ramos-h1 {
	font-size: var(--text-h1);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--color-graphite);
}
.ramos-h2 {
	font-size: var(--text-h2);
	font-weight: 700;
	line-height: 1.2;
	color: var(--color-graphite);
}
.ramos-h3 {
	font-size: var(--text-h3);
	font-weight: 600;
	line-height: 1.3;
	color: var(--color-graphite);
}
.ramos-label {
	font-size: var(--text-label);
	font-weight: 700;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--color-copper);
}
.ramos-caption {
	font-size: var(--text-caption);
	font-weight: 500;
	letter-spacing: 0.08em;
	color: #888;
}

/* =============================================
   BUTTONS
   ============================================= */

.btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.875rem 1.75rem;
	font-family: var(--font-family);
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	border: 2px solid transparent;
	transition: background var(--ease), color var(--ease), border-color var(--ease);
	cursor: pointer;
	text-decoration: none;
}

.btn-primary {
	background: var(--color-copper);
	color: var(--color-white);
	border-color: var(--color-copper);
}
.btn-primary:hover {
	background: var(--color-copper-hover);
	border-color: var(--color-copper-hover);
	color: var(--color-white);
}

.btn-outline-white {
	background: transparent;
	color: var(--color-white);
	border-color: rgba(255,255,255,0.5);
}
.btn-outline-white:hover {
	background: var(--color-white);
	color: var(--color-graphite);
	border-color: var(--color-white);
}

.btn-outline-dark {
	background: transparent;
	color: var(--color-graphite);
	border-color: var(--color-graphite);
}
.btn-outline-dark:hover {
	background: var(--color-graphite);
	color: var(--color-white);
	border-color: var(--color-graphite);
}

/* =============================================
   HEADER
   ============================================= */

.site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	background: var(--color-graphite);
	border-bottom: 1px solid var(--color-border);
	transition: background var(--ease-md), box-shadow var(--ease-md), border-color var(--ease-md);
}

/* Прозрачный хедер на главной — до скролла */
.site-header--transparent {
	background: transparent;
	border-bottom-color: transparent;
}
.site-header--transparent.scrolled {
	background: var(--color-graphite);
	border-bottom-color: var(--color-border);
}

.site-header.scrolled {
	box-shadow: 0 2px 24px rgba(0,0,0,0.35);
}

/* Главная: убираем padding-top, hero уходит под шапку */
.is-front-page {
	padding-top: 0 !important;
}

.header-inner {
	display: flex;
	align-items: center;
	height: 72px;
	gap: 1rem;
}

/* =============================================
   HERO — тёмный фирменный фон
   ============================================= */

.ramos-hero--dark {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	overflow: hidden;
	background: var(--color-graphite);
}

/* Убираем базовые декоративные слои — используем .hero-bg */
.ramos-hero--dark::before,
.ramos-hero--dark::after {
	display: none;
}

.hero-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	/* Фолбэк-градиент, если фоновое фото не задано */
	background-color: var(--color-graphite);
}

/* Затемняющий градиент поверх фото — сохраняет читаемость белого текста */
.hero-bg::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background: linear-gradient(
		160deg,
		rgba(23,26,29,0.86) 0%,
		rgba(23,26,29,0.80) 45%,
		rgba(16,18,20,0.90) 100%
	);
}

/* Диагональная сетка из брендбука */
.hero-bg__grid {
	position: absolute;
	inset: 0;
	z-index: 1;
	background-image:
		repeating-linear-gradient(
			-45deg,
			rgba(181,101,29,0.07) 0px,
			rgba(181,101,29,0.07) 1px,
			transparent 1px,
			transparent 46px
		);
}

/* Крупный шестигранный знак — фирменный элемент, в правой части экрана */
.hero-bg__hex {
	position: absolute;
	top: 50%;
	right: -6%;
	width: 620px;
	height: 620px;
	z-index: 1;
	transform: translateY(-50%);
	opacity: 0.5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none' stroke='%23ffffff' stroke-opacity='0.07' stroke-width='1.2'%3E%3Cpolygon points='100,14 174.6,57 174.6,143 100,186 25.4,143 25.4,57'/%3E%3Cline x1='100' y1='14' x2='100' y2='186'/%3E%3Cline x1='174.6' y1='57' x2='25.4' y2='143'/%3E%3Cline x1='174.6' y1='143' x2='25.4' y2='57'/%3E%3C/svg%3E");
}

/* Мягкое медное свечение — добавляет глубину без пестроты */
.hero-bg__glow {
	position: absolute;
	top: 45%;
	right: 8%;
	width: 620px;
	height: 620px;
	z-index: 1;
	transform: translateY(-50%);
	background: radial-gradient(
		circle,
		rgba(181,101,29,0.16) 0%,
		rgba(181,101,29,0.05) 42%,
		transparent 70%
	);
}

/* Медный угловой акцент — как в брендбуке */
.hero-bg__corner {
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 0;
	z-index: 1;
	border-style: solid;
	border-width: 0 240px 240px 0;
	border-color: transparent var(--color-copper) transparent transparent;
	opacity: 0.22;
}

.ramos-hero--dark .hero-content {
	position: relative;
	z-index: 2;
	padding-top: calc(var(--header-height) + var(--section-py));
	padding-bottom: var(--section-py);
}

@media (max-width: 1024px) {
	.hero-bg__hex,
	.hero-bg__glow { width: 440px; height: 440px; right: -14%; }
	.hero-bg__corner { border-width: 0 150px 150px 0; }
}
@media (max-width: 768px) {
	.ramos-hero--dark { min-height: auto; }
	.hero-bg__hex { opacity: 0.35; }
	.hero-bg__corner { border-width: 0 110px 110px 0; }
}

/* Logo */
.site-logo {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 0.625rem;
}

/* SVG fallback (inline) */
.site-logo > svg,
.site-logo > img {
	height: 45px;
	width: auto;
}

/* WordPress custom_logo() output:
   .site-logo > a.custom-logo-link > img.custom-logo */
.site-logo .custom-logo-link {
	display: flex;
	align-items: center;
	line-height: 0;
}
.site-logo .custom-logo-link img.custom-logo,
.site-logo .custom-logo {
	height: 45px !important;
	width: auto !important;
	max-width: none !important;
	display: block;
}

/* Hide WP site title/description that may appear next to logo */
.site-logo .site-title,
.site-logo .site-description {
	display: none;
}

.site-logo .logo-wordmark {
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	color: var(--color-white);
	line-height: 1;
}
.site-logo .logo-wordmark span {
	display: block;
	font-size: 0.5625rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	color: var(--color-copper);
	margin-top: 0.15em;
}

/* =============================================
   PRIMARY NAV — базовая структура
   ============================================= */

.primary-nav {
	flex: 1;
	display: flex;
	align-items: stretch;
}

.primary-nav__list {
	display: flex;
	align-items: stretch;
	gap: 0;
	height: 100%;
}

.primary-nav__item {
	position: static; /* mega menu — full-width */
	display: flex;
	align-items: stretch;
}

.primary-nav__link {
	display: flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0 0.75rem;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: rgba(255,255,255,0.80);
	white-space: nowrap;
	transition: color var(--ease);
	cursor: pointer;
	border-bottom: 2px solid transparent;
}
.primary-nav__link:hover,
.primary-nav__item.is-open .primary-nav__link {
	color: var(--color-white);
	border-bottom-color: var(--color-copper);
}

.nav-chevron {
	width: 10px;
	height: 10px;
	flex-shrink: 0;
	opacity: 0.6;
	transition: transform var(--ease);
}
.primary-nav__item.is-open .nav-chevron {
	transform: rotate(180deg);
	opacity: 1;
}

/* =============================================
   ПРОСТОЙ DROPDOWN (производственный)
   ============================================= */

.nav-dropdown {
	position: fixed;
	top: calc(var(--header-height) + var(--admin-bar-height));
	left: 0;
	right: 0;
	background: var(--color-graphite);
	border-top: 2px solid var(--color-copper);
	border-bottom: 1px solid var(--color-border);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity var(--ease), transform var(--ease), visibility var(--ease);
	z-index: 500;
}
.primary-nav__item--dropdown.is-open .nav-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.nav-dropdown__list li a {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 0.75rem 1.25rem;
	transition: background var(--ease);
}
.nav-dropdown__list li a:hover {
	background: rgba(255,255,255,0.05);
}
.nd-title {
	font-size: 0.875rem;
	font-weight: 600;
	color: rgba(255,255,255,0.90);
}
.nd-desc {
	font-size: 0.75rem;
	color: rgba(255,255,255,0.45);
	line-height: 1.4;
}

/* =============================================
   MEGA MENU (сельскохозяйственный)
   ============================================= */

.nav-mega {
	position: fixed;
	top: calc(var(--header-height) + var(--admin-bar-height));
	left: 0;
	right: 0;
	background: var(--color-graphite);
	border-top: 2px solid var(--color-copper);
	border-bottom: 1px solid var(--color-border);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity var(--ease-md), transform var(--ease-md), visibility var(--ease-md);
	z-index: 500;
	max-height: calc(100vh - var(--header-height) - var(--admin-bar-height));
	overflow-y: auto;
}
.primary-nav__item--mega.is-open .nav-mega {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.nav-mega__inner {
	display: grid;
	grid-template-columns: 260px 1fr;
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--container-px);
	min-height: 360px;
}

/* — Левая колонка: категории — */
.nav-mega__categories {
	padding: 1.75rem 0 1.75rem 0;
	border-right: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
}

.nav-mega__section-label {
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.30);
	padding: 0 1.25rem 0.75rem;
}

.nav-mega__cat-list {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.nav-mega__cat-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	padding: 0 1.25rem;
	cursor: pointer;
	transition: background var(--ease);
	border-left: 2px solid transparent;
}
.nav-mega__cat-item:hover {
	background: rgba(255,255,255,0.04);
}
.nav-mega__cat-item.is-active {
	background: rgba(255,255,255,0.06);
	border-left-color: var(--color-copper);
}

.nav-mega__cat-item a {
	display: block;
	padding: 0.8rem 0;
	font-size: 0.875rem;
	font-weight: 600;
	color: rgba(255,255,255,0.75);
	flex: 1;
	transition: color var(--ease);
}
.nav-mega__cat-item:hover a,
.nav-mega__cat-item.is-active a {
	color: var(--color-white);
}
.nav-mega__cat-item svg {
	width: 10px;
	height: 10px;
	flex-shrink: 0;
	color: rgba(255,255,255,0.30);
	transition: color var(--ease);
}
.nav-mega__cat-item.is-active svg { color: var(--color-copper); }

.nav-mega__explore {
	display: inline-block;
	margin: 0.75rem 1.25rem 0;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--color-copper);
	transition: opacity var(--ease);
}
.nav-mega__explore:hover { opacity: 0.75; }

/* — Правая панель: подуслуги — */
.nav-mega__panels {
	padding: 1.75rem 1.5rem 1.75rem 2rem;
	position: relative;
}

.nav-mega__panel {
	display: none;
}
.nav-mega__panel.is-active {
	display: block;
}

.nav-mega__panel-title {
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.30);
	margin-bottom: 1.25rem;
}

.nav-mega__panel-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: var(--color-border);
	border: 1px solid var(--color-border);
}

.nav-mega__panel-item {
	background: rgba(255,255,255,0.02);
	padding: 1rem 1.125rem;
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	transition: background var(--ease);
}
.nav-mega__panel-item:hover {
	background: rgba(255,255,255,0.07);
}

.npi-title {
	font-size: 0.875rem;
	font-weight: 600;
	color: rgba(255,255,255,0.90);
	transition: color var(--ease);
}
.nav-mega__panel-item:hover .npi-title {
	color: var(--color-copper);
}
.npi-desc {
	font-size: 0.75rem;
	line-height: 1.5;
	color: rgba(255,255,255,0.40);
}

/* Закрывающий оверлей позади мега-меню */
.nav-mega-backdrop {
	position: fixed;
	top: calc(var(--header-height) + var(--admin-bar-height));
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.40);
	z-index: 499;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--ease-md), visibility var(--ease-md);
}
.nav-mega-backdrop.is-visible {
	opacity: 1;
	visibility: visible;
}

/* =============================================
   RESPONSIVE
   ============================================= */

@media (max-width: 1280px) {
	.nav-mega__panel-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1024px) {
	.primary-nav { display: none; }
}

/* =============================================
   HEADER ACTIONS
   ============================================= */

.header-actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	margin-left: auto;
}

/* --- Email --- */
.header-email {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.8125rem;
	font-weight: 500;
	color: rgba(255,255,255,0.70);
	padding: 0.35rem 0.5rem;
	border-right: 1px solid var(--color-border);
	padding-right: 0.875rem;
	margin-right: 0.25rem;
	transition: color var(--ease);
	white-space: nowrap;
}
.header-email svg { flex-shrink: 0; opacity: 0.7; }
.header-email:hover { color: var(--color-copper); }
.header-email:hover svg { opacity: 1; }

/* --- Phone widget --- */
.header-phone-widget {
	position: relative;
}

.phone-widget-trigger {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.45rem 0.75rem;
	background: rgba(255,255,255,0.07);
	border: 1px solid var(--color-border);
	color: rgba(255,255,255,0.90);
	font-size: 0.8125rem;
	font-weight: 600;
	cursor: pointer;
	transition: background var(--ease), border-color var(--ease), color var(--ease);
	white-space: nowrap;
}
.phone-widget-trigger:hover {
	background: rgba(255,255,255,0.12);
	border-color: rgba(255,255,255,0.25);
	color: var(--color-white);
}
.phone-widget-trigger svg:first-child { color: var(--color-copper); flex-shrink: 0; }

.phone-chevron {
	transition: transform var(--ease);
	flex-shrink: 0;
	opacity: 0.6;
}
.header-phone-widget.is-open .phone-chevron {
	transform: rotate(180deg);
}

/* Dropdown panel */
.phone-dropdown {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	width: 320px;
	background: var(--color-graphite);
	border: 1px solid var(--color-border);
	border-top: 2px solid var(--color-copper);
	padding: 0.875rem 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity var(--ease), transform var(--ease), visibility var(--ease);
	z-index: 200;
}
.header-phone-widget.is-open .phone-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.phone-dropdown-label {
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.35);
	padding: 0 1.125rem 0.625rem;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 0.25rem;
}

.phone-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.625rem 1.125rem;
	gap: 0.75rem;
	transition: background var(--ease);
}
.phone-row:hover { background: rgba(255,255,255,0.05); }

.phone-row-number {
	font-size: 0.9375rem;
	font-weight: 600;
	color: rgba(255,255,255,0.90);
	letter-spacing: 0.01em;
	transition: color var(--ease);
	flex: 1;
}
.phone-row-number:hover { color: var(--color-copper); }

.phone-row-messengers {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	flex-shrink: 0;
}

.messenger-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	color: var(--color-white);
	transition: transform var(--ease), opacity var(--ease);
	opacity: 0.75;
}
.messenger-btn:hover { transform: scale(1.15); opacity: 1; }
.messenger-btn svg { width: 16px; height: 16px; }

.messenger-viber    { background: var(--color-viber); }
.messenger-telegram { background: var(--color-telegram); }
.messenger-whatsapp { background: var(--color-whatsapp); }

/* --- Search button --- */
.header-search-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	color: rgba(255,255,255,0.70);
	transition: color var(--ease), background var(--ease);
	border-radius: 50%;
}
.header-search-btn:hover {
	color: var(--color-white);
	background: rgba(255,255,255,0.08);
}

/* =============================================
   SEARCH OVERLAY
   ============================================= */

.search-overlay {
	position: fixed;
	inset: 0;
	background: rgba(31,35,38,0.97);
	z-index: 1400;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 2rem var(--container-px);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--ease-md), visibility var(--ease-md);
}
.search-overlay.is-open {
	opacity: 1;
	visibility: visible;
}

.search-overlay-inner {
	width: 100%;
	max-width: 680px;
	position: relative;
}

.search-close {
	position: absolute;
	top: -3.5rem;
	right: 0;
	color: rgba(255,255,255,0.55);
	transition: color var(--ease);
	padding: 0.25rem;
}
.search-close:hover { color: var(--color-white); }

.search-overlay-form {
	display: flex;
	align-items: center;
	border-bottom: 2px solid var(--color-copper);
	gap: 0.75rem;
}

.search-overlay-input {
	flex: 1;
	background: none;
	border: none;
	outline: none;
	font-family: var(--font-family);
	font-size: clamp(1.375rem, 3vw, 2rem);
	font-weight: 600;
	color: var(--color-white);
	padding: 0.75rem 0;
	caret-color: var(--color-copper);
}
.search-overlay-input::placeholder {
	color: rgba(255,255,255,0.30);
}

.search-overlay-submit {
	flex-shrink: 0;
	color: rgba(255,255,255,0.55);
	transition: color var(--ease);
	padding: 0.5rem;
}
.search-overlay-submit:hover { color: var(--color-copper); }

.search-overlay-hint {
	margin-top: 1rem;
	font-size: 0.8125rem;
	color: rgba(255,255,255,0.30);
	letter-spacing: 0.04em;
}

/* =============================================
   HAMBURGER
   ============================================= */

.hamburger {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	gap: 5px;
	order: 99; /* всегда крайний правый */
	flex-shrink: 0;
}
.hamburger span {
	display: block;
	width: 24px;
	height: 2px;
	background: var(--color-white);
	transition: transform var(--ease), opacity var(--ease);
	transform-origin: center;
}
.hamburger.is-active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.is-active span:nth-child(2) { opacity: 0; }
.hamburger.is-active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* =============================================
   MOBILE NAV
   ============================================= */

.mobile-nav {
	position: fixed;
	inset: 0;
	background: var(--color-graphite);
	z-index: 1300; /* выше хедера (1000) и поиска (1100) */
	display: flex;
	flex-direction: column;
	opacity: 0;
	visibility: hidden;
	transform: translateX(100%);
	transition: opacity var(--ease-md), transform var(--ease-md), visibility var(--ease-md);
}
.mobile-nav.is-open {
	opacity: 1;
	visibility: visible;
	transform: translateX(0);
}

/* — Верхняя панель мобильного меню — */
.mobile-nav__topbar {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	height: var(--header-height);
	padding-inline: var(--container-px);
	border-bottom: 1px solid var(--color-border);
}

.mobile-nav__logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}
.mobile-nav__logo svg,
.mobile-nav__logo img,
.mobile-nav__logo .custom-logo {
	height: 32px !important;
	width: auto !important;
}

.mobile-nav__topbar-actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	margin-left: auto;
}

/* Телефонный виджет — компактная версия под мобильную топбар-панель */
.mobile-nav__topbar-actions .header-phone-widget {
	position: static;
}
.mobile-nav__topbar-actions .phone-widget-trigger {
	padding: 0.4rem 0.6rem;
	font-size: 0.75rem;
}
.mobile-nav__topbar-actions .phone-trigger-number {
	display: none; /* только иконка на мобильном топбаре */
}
.mobile-nav__topbar-actions .phone-dropdown {
	position: fixed;
	top: var(--header-height);
	left: 0;
	right: 0;
	width: auto;
	border-left: none;
	border-right: none;
}

.mobile-nav__topbar-actions .header-search-btn {
	width: 36px;
	height: 36px;
}

.mobile-nav-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: rgba(255,255,255,0.60);
	transition: color var(--ease);
	flex-shrink: 0;
}
.mobile-nav-close:hover { color: var(--color-white); }

/* — Тело меню (скролл) — */
.mobile-nav__body {
	flex: 1;
	overflow-y: auto;
	padding: 1.5rem var(--container-px) 2.5rem;
}

.mobile-nav__list {
	display: flex;
	flex-direction: column;
}

.mobile-nav__item {
	border-bottom: 1px solid var(--color-border);
}

.mobile-nav__item > a {
	display: block;
	padding: 1.1rem 0;
	font-size: 1.0625rem;
	font-weight: 700;
	color: rgba(255,255,255,0.88);
	transition: color var(--ease);
}
.mobile-nav__item > a:hover { color: var(--color-copper); }

/* Аккордеон */
.mobile-nav__accordion-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 1.1rem 0;
	font-size: 1.0625rem;
	font-weight: 700;
	color: rgba(255,255,255,0.88);
	text-align: left;
}
.mobile-nav__accordion-trigger svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	color: rgba(255,255,255,0.40);
	transition: transform var(--ease);
}
.mobile-nav__item--accordion.is-open .mobile-nav__accordion-trigger svg {
	transform: rotate(180deg);
	color: var(--color-copper);
}

.mobile-nav__accordion-panel {
	max-height: 0;
	overflow: hidden;
	transition: max-height var(--ease-md);
}
.mobile-nav__item--accordion.is-open .mobile-nav__accordion-panel {
	max-height: 600px; /* достаточно для 5-6 пунктов */
}

.mobile-nav__accordion-panel ul {
	display: flex;
	flex-direction: column;
	padding-bottom: 0.75rem;
}
.mobile-nav__accordion-panel ul li a {
	display: block;
	padding: 0.7rem 0 0.7rem 1rem;
	font-size: 0.9375rem;
	font-weight: 500;
	color: rgba(255,255,255,0.60);
	border-left: 2px solid var(--color-border);
	transition: color var(--ease), border-color var(--ease);
}
.mobile-nav__accordion-panel ul li a:hover {
	color: var(--color-white);
	border-left-color: var(--color-copper);
}

/* — Уровень 2: категории внутри направления — */
.mobile-nav__sub-list {
	display: flex;
	flex-direction: column;
	padding-bottom: 0.5rem;
}

.mobile-nav__sub-item {
	border-left: 2px solid var(--color-border);
}

.mobile-nav__sub-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0.75rem 0 0.75rem 1rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: rgba(255,255,255,0.75);
	text-align: left;
	transition: color var(--ease);
}
.mobile-nav__sub-trigger:hover { color: var(--color-white); }

.mobile-nav__sub-trigger svg {
	width: 11px;
	height: 11px;
	flex-shrink: 0;
	color: rgba(255,255,255,0.35);
	transition: transform var(--ease);
	margin-right: 0.75rem;
}
.mobile-nav__sub-item--accordion.is-open .mobile-nav__sub-trigger svg {
	transform: rotate(180deg);
	color: var(--color-copper);
}
.mobile-nav__sub-item--accordion.is-open > .mobile-nav__sub-trigger,
.mobile-nav__sub-item--accordion.is-open {
	border-left-color: var(--color-copper);
}

.mobile-nav__leaf-panel {
	max-height: 0;
	overflow: hidden;
	transition: max-height var(--ease-md);
}
.mobile-nav__sub-item--accordion.is-open .mobile-nav__leaf-panel {
	max-height: 400px;
}

.mobile-nav__leaf-panel ul {
	display: flex;
	flex-direction: column;
	padding: 0.15rem 0 0.6rem 2.25rem;
}
.mobile-nav__leaf-panel ul li a {
	display: block;
	padding: 0.55rem 0;
	font-size: 0.875rem;
	font-weight: 500;
	color: rgba(255,255,255,0.50);
	transition: color var(--ease);
}
.mobile-nav__leaf-panel ul li a:hover {
	color: var(--color-white);
}
.mobile-nav__leaf-panel ul li a.mobile-nav__leaf-all {
	color: var(--color-copper);
	font-weight: 600;
}

.mobile-nav__all-link {
	display: block;
	padding: 0.85rem 0 0.85rem 1rem;
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-copper);
}

.mobile-nav .mobile-contacts {
	margin-top: 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.mobile-nav .mobile-contacts a {
	font-size: 0.9375rem;
	font-weight: 600;
	color: rgba(255,255,255,0.65);
	transition: color var(--ease);
}
.mobile-nav .mobile-contacts a:hover { color: var(--color-copper); }

/* =============================================
   HEADER OFFSET (fixed header)
   ============================================= */

body { padding-top: var(--header-height); }
.admin-bar { --admin-bar-height: 32px; }
.admin-bar .site-header { top: var(--admin-bar-height); }
@media (max-width: 782px) {
	.admin-bar { --admin-bar-height: 46px; }
}

/* =============================================
   RESPONSIVE — header
   ============================================= */

@media (max-width: 1200px) {
	/* Hide email label text, keep icon only */
	.header-email span { display: none; }
	.header-email { padding-right: 0.625rem; border-right: none; margin-right: 0; }
}

@media (max-width: 1024px) {
	.primary-nav    { display: none; }
	.header-email   { display: none; }
	.hamburger      { display: flex; }
	/* Keep phone widget and search visible on tablet */
}

@media (max-width: 640px) {
	/* On small mobile hide phone trigger text, show icon only */
	.phone-trigger-number { display: none; }
	.phone-widget-trigger { padding: 0.45rem 0.625rem; }
}

/* =============================================
   HERO SECTION
   ============================================= */

.ramos-hero {
	position: relative;
	background: var(--color-graphite);
	min-height: clamp(520px, 85vh, 820px);
	display: flex;
	align-items: center;
	overflow: hidden;
}

/* Diagonal grid pattern */
.ramos-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		repeating-linear-gradient(
			-45deg,
			rgba(181,101,29,0.06) 0px,
			rgba(181,101,29,0.06) 1px,
			transparent 1px,
			transparent 48px
		);
	pointer-events: none;
}
/* Corner copper accent */
.ramos-hero::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 220px 220px 0;
	border-color: transparent var(--color-copper) transparent transparent;
	opacity: 0.25;
}

.hero-content {
	position: relative;
	z-index: 2;
	padding-block: var(--section-py);
	max-width: 760px;
}

.hero-label {
	display: inline-block;
	margin-bottom: 1.5rem;
	font-size: var(--text-label);
	font-weight: 700;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--color-copper);
}

.hero-title {
	font-size: clamp(2.5rem, 5vw, 3.75rem);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: var(--color-white);
	margin-bottom: 1.5rem;
}

.hero-desc {
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	font-weight: 400;
	line-height: 1.7;
	color: rgba(255,255,255,0.72);
	max-width: 580px;
	margin-bottom: 2.5rem;
}

.hero-actions {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.hero-stats {
	position: relative;
	z-index: 2;
	display: flex;
	gap: 3rem;
	padding-block: 2rem;
	border-top: 1px solid var(--color-border);
	margin-top: 3rem;
	flex-wrap: wrap;
}
.hero-stat-item .stat-number {
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	font-weight: 800;
	color: var(--color-white);
	line-height: 1;
}
.hero-stat-item .stat-number em { color: var(--color-copper); font-style: normal; }
.hero-stat-item .stat-label {
	font-size: 0.8125rem;
	font-weight: 500;
	color: rgba(255,255,255,0.55);
	margin-top: 0.25rem;
	letter-spacing: 0.04em;
}

@media (max-width: 768px) {
	.hero-stats { gap: 1.75rem; }
	.ramos-hero::after { border-width: 0 120px 120px 0; }
}
@media (max-width: 480px) {
	.hero-actions { flex-direction: column; align-items: flex-start; }
}

/* =============================================
   SECTION: ABOUT
   ============================================= */

.section-about {
	padding-block: var(--section-py);
	background: var(--color-white);
}

.about-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5rem;
	align-items: center;
}

.about-text .ramos-label { margin-bottom: 1rem; }
.about-text .ramos-h2 { margin-bottom: 1.25rem; }
.about-text p { color: #555; line-height: 1.75; margin-bottom: 1rem; }
.about-text p:last-of-type { margin-bottom: 1.75rem; }

.about-features { display: flex; flex-direction: column; gap: 1.125rem; }

.about-feature {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.125rem 1.25rem;
	background: var(--color-neutral);
	border-left: 3px solid var(--color-copper);
}
.about-feature-icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.about-feature-icon svg { width: 24px; height: 24px; stroke: var(--color-copper); fill: none; }
.about-feature h4 { font-size: 0.9375rem; font-weight: 700; color: var(--color-graphite); margin-bottom: 0.25rem; }
.about-feature p { font-size: 0.875rem; color: #666; line-height: 1.55; margin: 0; }

@media (max-width: 1024px) { .about-grid { grid-template-columns: 1fr; gap: 3rem; } }

/* =============================================
   SECTION: SERVICES GRID
   ============================================= */

.section-services {
	padding-block: var(--section-py);
	background: var(--color-neutral);
}

.section-header { margin-bottom: 3rem; }
.section-header .ramos-label { margin-bottom: 0.75rem; }
.section-header .ramos-h2 { margin-bottom: 0.75rem; }
.section-header p { color: #666; max-width: 560px; }

.services-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: var(--color-border-light);
	border: 1px solid var(--color-border-light);
}

.service-card {
	background: var(--color-white);
	padding: 2rem 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	transition: background var(--ease);
	position: relative;
	overflow: hidden;
}
.service-card::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--color-copper);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--ease-md);
}
.service-card:hover { background: var(--color-graphite); }
.service-card:hover::before { transform: scaleX(1); }
.service-card:hover .service-title { color: var(--color-white); }
.service-card:hover .service-desc { color: rgba(255,255,255,0.65); }
.service-card:hover .service-icon svg { stroke: var(--color-copper); }

.service-icon {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.service-icon svg {
	width: 32px;
	height: 32px;
	stroke: var(--color-graphite);
	fill: none;
	stroke-width: 1.5;
	transition: stroke var(--ease);
}
.service-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-graphite);
	transition: color var(--ease);
}
.service-desc {
	font-size: 0.875rem;
	line-height: 1.65;
	color: #666;
	flex: 1;
	transition: color var(--ease);
}
.service-link {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--color-copper);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	transition: gap var(--ease);
}
.service-card:hover .service-link { gap: 0.625rem; }
.service-link svg { width: 14px; height: 14px; stroke: currentColor; fill: none; }

@media (max-width: 1024px) { .services-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .services-grid { grid-template-columns: 1fr; } }

/* =============================================
   SECTION: WHY RAMOS (USP)
   ============================================= */

.section-usp {
	padding-block: var(--section-py);
	background: var(--color-graphite);
	position: relative;
	overflow: hidden;
}
.section-usp::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		repeating-linear-gradient(
			-45deg,
			rgba(181,101,29,0.04) 0px,
			rgba(181,101,29,0.04) 1px,
			transparent 1px,
			transparent 48px
		);
	pointer-events: none;
}
.section-usp .section-header .ramos-h2 { color: var(--color-white); }
.section-usp .section-header p { color: rgba(255,255,255,0.60); }

.usp-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1px;
	background: var(--color-border);
	border: 1px solid var(--color-border);
	position: relative;
	z-index: 2;
}

.usp-item {
	background: rgba(255,255,255,0.03);
	padding: 2rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	transition: background var(--ease);
}
.usp-item:hover { background: rgba(255,255,255,0.07); }
.usp-number {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.3em;
	color: var(--color-copper);
	text-transform: uppercase;
}
.usp-item h3 { font-size: 1rem; font-weight: 700; color: var(--color-white); line-height: 1.3; }
.usp-item p { font-size: 0.875rem; line-height: 1.65; color: rgba(255,255,255,0.60); }

@media (max-width: 1024px) { .usp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .usp-grid { grid-template-columns: 1fr; } }

/* =============================================
   SECTION: CTA BANNER
   ============================================= */

.section-cta {
	padding-block: clamp(3.5rem, 6vw, 5rem);
	background: var(--color-copper);
	position: relative;
	overflow: hidden;
}
.section-cta::before {
	content: '';
	position: absolute;
	top: -60px;
	right: -60px;
	width: 360px;
	height: 360px;
	border-radius: 50%;
	background: rgba(255,255,255,0.06);
	pointer-events: none;
}
.cta-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	flex-wrap: wrap;
}
.cta-text h2 {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 800;
	color: var(--color-white);
	margin-bottom: 0.5rem;
}
.cta-text p { font-size: 1rem; color: rgba(255,255,255,0.82); }
.cta-actions { display: flex; gap: 1rem; flex-wrap: wrap; }

/* =============================================
   SECTION: PARTNERS
   ============================================= */

.section-partners {
	padding-block: 3rem;
	background: var(--color-white);
	border-top: 1px solid var(--color-border-light);
	border-bottom: 1px solid var(--color-border-light);
}
.partners-label {
	font-size: var(--text-caption);
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: #aaa;
	text-align: center;
	margin-bottom: 1.75rem;
}
.partners-logos {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 1.25rem;
}
.partners-logos span {
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: #ccc;
	text-transform: uppercase;
	transition: color var(--ease);
}
.partners-logos span:hover { color: var(--color-graphite); }

/* =============================================
   SECTION: CONTACTS HOME
   ============================================= */

.section-contacts-home {
	padding-block: var(--section-py);
	background: var(--color-neutral);
}
.contacts-home-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: start;
}
.contacts-home-info .ramos-label { margin-bottom: 1rem; }
.contacts-home-info .ramos-h2 { margin-bottom: 1.5rem; }

.contact-items { display: flex; flex-direction: column; gap: 1.25rem; }
.contact-item {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
}
.contact-item-icon {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 1.5px solid var(--color-border-light);
	flex-shrink: 0;
}
.contact-item-icon svg { width: 20px; height: 20px; stroke: var(--color-copper); fill: none; }
.contact-item-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-copper);
	margin-bottom: 0.25rem;
}
.contact-item-value {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--color-graphite);
	line-height: 1.5;
}
.contact-item-value a {
	color: var(--color-graphite);
	transition: color var(--ease);
}
.contact-item-value a:hover { color: var(--color-copper); }

.contacts-home-map iframe {
	width: 100%;
	height: 400px;
	border: none;
	filter: grayscale(0.3);
}

@media (max-width: 1024px) { .contacts-home-grid { grid-template-columns: 1fr; gap: 2.5rem; } }

/* =============================================
   FOOTER
   ============================================= */

.site-footer {
	background: var(--color-graphite);
	color: rgba(255,255,255,0.65);
}

.footer-main {
	padding-block: clamp(3rem, 5vw, 4.5rem);
	display: grid;
	grid-template-columns: 280px 1fr 1fr 1fr;
	gap: 3rem;
}

.footer-brand .site-logo { margin-bottom: 1.25rem; }
.footer-brand p {
	font-size: 0.875rem;
	line-height: 1.65;
	color: rgba(255,255,255,0.50);
	margin-bottom: 1.5rem;
	max-width: 240px;
}

.footer-col-title {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--color-copper);
	margin-bottom: 1.25rem;
}
.footer-col ul { display: flex; flex-direction: column; gap: 0.625rem; }
.footer-col ul li a {
	font-size: 0.875rem;
	font-weight: 500;
	color: rgba(255,255,255,0.60);
	transition: color var(--ease);
}
.footer-col ul li a:hover { color: var(--color-white); }

.footer-contacts-list { display: flex; flex-direction: column; gap: 0.875rem; }
.footer-contact-item .fc-label {
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.35);
	margin-bottom: 0.2rem;
}
.footer-contact-item a,
.footer-contact-item p {
	font-size: 0.875rem;
	font-weight: 500;
	color: rgba(255,255,255,0.65);
	transition: color var(--ease);
	margin: 0;
}
.footer-contact-item a:hover { color: var(--color-copper); }

.footer-bottom {
	border-top: 1px solid var(--color-border);
	padding-block: 1.25rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}
.footer-bottom p { font-size: 0.8125rem; color: rgba(255,255,255,0.35); }
.footer-bottom a {
	font-size: 0.8125rem;
	color: rgba(255,255,255,0.35);
	transition: color var(--ease);
}
.footer-bottom a:hover { color: var(--color-copper); }

@media (max-width: 1280px) {
	.footer-main { grid-template-columns: 240px 1fr 1fr; }
	.footer-col:last-child { grid-column: 2 / -1; }
}
@media (max-width: 1024px) {
	.footer-main { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
	.footer-brand { grid-column: 1 / -1; }
	.footer-col:last-child { grid-column: auto; }
}
@media (max-width: 600px) {
	.footer-main { grid-template-columns: 1fr; }
	.footer-brand { grid-column: auto; }
}

/* =============================================================
   WOOCOMMERCE — полная стилизация
   Дефолтные стили плагина отключены (functions.php),
   ниже — собственное оформление под фирменный стиль RAMOS.
   ============================================================= */

/* ---------- Общий контейнер / отступы страницы ---------- */
.woo-main {
	padding-block: clamp(2rem, 4vw, 3rem) var(--section-py);
	min-height: 50vh;
}

/* ---------- Layout: контент + сайдбар с фильтрами ---------- */
.woo-layout--with-sidebar {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 3rem;
	align-items: start;
}
.woo-layout--with-sidebar .woo-main {
	order: 2;
	min-width: 0;
}
.woo-layout--with-sidebar .woo-sidebar {
	order: 1;
}

.woo-sidebar {
	padding-top: clamp(2rem, 4vw, 3rem);
}
.woo-sidebar-empty {
	padding: 1.25rem;
	background: var(--color-neutral);
	border-left: 3px solid var(--color-copper);
	font-size: 0.8125rem;
	line-height: 1.6;
	color: #777;
}
.woo-sidebar-empty p:first-child { font-weight: 700; color: var(--color-graphite); margin-bottom: 0.4rem; }

@media (max-width: 860px) {
	.woo-layout--with-sidebar {
		grid-template-columns: 1fr;
	}
	.woo-layout--with-sidebar .woo-main { order: 1; }
	.woo-layout--with-sidebar .woo-sidebar {
		order: 2;
		padding-top: 0;
		margin-top: 2rem;
		border-top: 1px solid var(--color-border-light);
		padding-top: 2rem;
	}
}

/* ---------- WooCommerce: виджет "Фильтр по цене" ---------- */
.widget_price_filter .price_slider { margin-bottom: 1.25rem; }
.widget_price_filter .price_slider_amount {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	font-size: 0.8125rem;
	color: #777;
}
.widget_price_filter .price_slider_amount .button {
	padding: 0.4rem 0.875rem !important;
	font-size: 0.75rem !important;
}
.widget_price_filter .ui-slider {
	position: relative;
	height: 4px;
	background: var(--color-border-light);
	margin: 1.25rem 0.5rem 1.5rem;
}
.widget_price_filter .ui-slider-range {
	position: absolute;
	height: 4px;
	background: var(--color-copper);
}
.widget_price_filter .ui-slider-handle {
	position: absolute;
	top: 50%;
	width: 15px;
	height: 15px;
	margin-left: -7px;
	transform: translateY(-50%);
	background: var(--color-white);
	border: 2px solid var(--color-copper);
	border-radius: 50%;
	cursor: pointer;
	outline: none;
}

/* ---------- WooCommerce: виджет "Категории товаров" / layered nav ---------- */
.widget_product_categories ul,
.widget_layered_nav ul,
.widget_layered_nav_filters ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.widget_product_categories li,
.widget_layered_nav li {
	border-bottom: 1px solid var(--color-border-light);
}
.widget_product_categories li a,
.widget_layered_nav li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	padding: 0.6rem 0;
	font-size: 0.875rem;
	color: var(--color-graphite-text);
	transition: color var(--ease), padding-left var(--ease);
}
.widget_product_categories li a:hover,
.widget_layered_nav li a:hover {
	color: var(--color-copper);
	padding-left: 0.25rem;
}
.widget_product_categories li.current-cat > a {
	color: var(--color-copper);
	font-weight: 700;
}
.widget_product_categories .count {
	font-size: 0.75rem;
	color: #aaa;
	font-weight: 400;
}
.widget_layered_nav_filters li a {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.3rem 0.7rem;
	font-size: 0.75rem;
	background: var(--color-neutral);
	border: 1px solid var(--color-border-light);
}

/* ---------- WooCommerce: рейтинговый фильтр / общие списки ---------- */
.widget_rating_filter ul { list-style: none; margin: 0; padding: 0; }

/* ---------- Активные фильтры ---------- */
.woocommerce-widget-layered-nav-list__item--chosen a {
	color: var(--color-copper);
}

/* ---------- Хлебные крошки ---------- */
.woocommerce-breadcrumb {
	font-size: 0.8125rem;
	color: #999;
	margin-bottom: 1.75rem;
	letter-spacing: 0.01em;
}
.woocommerce-breadcrumb a {
	color: #999;
	transition: color var(--ease);
}
.woocommerce-breadcrumb a:hover { color: var(--color-copper); }

/* ---------- Заголовок архива / страницы магазина ---------- */
.woocommerce-products-header__title.page-title,
.woo-main h1.entry-title {
	font-size: var(--text-h2);
	font-weight: 700;
	color: var(--color-graphite);
	margin-bottom: 1.5rem;
}

/* ---------- Notices (сообщения корзины, ошибки форм) ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	list-style: none;
	padding: 1rem 1.25rem;
	margin-bottom: 1.5rem;
	background: var(--color-neutral);
	border-left: 3px solid var(--color-copper);
	font-size: 0.9375rem;
	color: var(--color-graphite-text);
}
.woocommerce-error { border-left-color: #c0392b; }
.woocommerce-message .button,
.woocommerce-info .button {
	margin-left: auto;
	order: 2;
}
ul.woocommerce-error { display: block; }
ul.woocommerce-error li { padding: 0.15rem 0; }

/* ---------- Кнопки WooCommerce (общие) ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-Button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.875rem 1.75rem;
	font-family: var(--font-family);
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--color-white);
	background: var(--color-copper);
	border: 2px solid var(--color-copper);
	border-radius: 0;
	cursor: pointer;
	transition: background var(--ease), border-color var(--ease), color var(--ease);
	text-decoration: none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background: var(--color-copper-hover);
	border-color: var(--color-copper-hover);
	color: var(--color-white);
}
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
	background: var(--color-graphite);
	border-color: var(--color-graphite);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
	background: #000;
	border-color: #000;
}
.woocommerce a.button.loading,
.woocommerce button.button.loading { opacity: 0.6; pointer-events: none; }
.woocommerce a.added_to_cart {
	display: inline-block;
	margin-left: 0.75rem;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--color-copper);
	text-decoration: underline;
}

/* ---------- Quantity input ---------- */
.quantity {
	display: inline-flex;
}
.quantity .qty {
	width: 64px;
	height: 48px;
	padding: 0 0.5rem;
	text-align: center;
	font-family: var(--font-family);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--color-graphite);
	background: var(--color-white);
	border: 1.5px solid var(--color-border-light);
	border-right: none;
}
.quantity .qty:focus { outline: none; border-color: var(--color-copper); }

/* =============================================================
   SHOP ARCHIVE
   ============================================================= */

/* Тулбар: "Показано X товаров" слева, сортировка справа.
   WooCommerce выводит их как соседние элементы (не в общей обёртке),
   поэтому используем float — это надёжно работает без лишней разметки. */
.woocommerce-result-count {
	float: left;
	margin: 0;
	padding-top: 0.7rem;
	font-size: 0.875rem;
	color: #888;
}

.woocommerce-ordering {
	float: right;
	margin: 0;
}
.woocommerce-ordering select {
	font-family: var(--font-family);
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--color-graphite-text);
	padding: 0.65rem 2.5rem 0.65rem 1.125rem;
	background-color: var(--color-white);
	border: 1.5px solid var(--color-border-light);
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23888888' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 11px;
	transition: border-color var(--ease);
}
.woocommerce-ordering select:hover,
.woocommerce-ordering select:focus {
	outline: none;
	border-color: var(--color-copper);
}

.woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.75rem;
	list-style: none;
	clear: both !important;
	margin: 3rem 0 0 !important;
	padding: 0;
}
.woocommerce ul.products li.product {
	position: relative;
	background: var(--color-white);
	padding: 0;
	display: flex;
	flex-direction: column;
	transition: box-shadow var(--ease-md), transform var(--ease-md);
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}
.woocommerce ul.products li.product:hover {
	box-shadow: 0 14px 32px rgba(0,0,0,0.10);
	transform: translateY(-2px);
}

.woocommerce ul.products li.product a img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	margin-bottom: 1.25rem;
	background: var(--color-neutral);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-family);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.4;
	color: var(--color-graphite);
	margin: 0 0 0.5rem;
}

.woocommerce ul.products li.product .price {
	font-family: var(--font-family);
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-copper);
	margin-top: auto;
	padding-top: 0.5rem;
}
.woocommerce ul.products li.product .price del {
	font-weight: 500;
	color: #aaa;
	margin-right: 0.4rem;
	text-decoration: line-through;
}
.woocommerce ul.products li.product .price ins {
	text-decoration: none;
}

.woocommerce ul.products li.product .button {
	margin-top: 0.875rem;
	width: 100%;
	padding: 0.65rem 1rem;
	font-size: 0.8125rem;
}

/* Бейдж "Распродажа" */
.woocommerce span.onsale {
	position: absolute;
	top: 1.25rem;
	left: 1.25rem;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.3rem 0.7rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--color-white);
	background: var(--color-copper);
	border-radius: 0;
	min-height: auto;
	min-width: auto;
	line-height: 1.5;
}

/* Пагинация */
.woocommerce-pagination {
	margin-top: 2.5rem;
}
.woocommerce-pagination ul.page-numbers {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.woocommerce-pagination .page-numbers li { display: flex; }
.woocommerce-pagination a.page-numbers,
.woocommerce-pagination span.page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 0.5rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--color-graphite);
	border: 1.5px solid var(--color-border-light);
	transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.woocommerce-pagination a.page-numbers:hover,
.woocommerce-pagination span.page-numbers.current {
	background: var(--color-graphite);
	border-color: var(--color-graphite);
	color: var(--color-white);
}

@media (max-width: 1200px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 860px)  { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .woocommerce ul.products { grid-template-columns: 1fr; } }

/* С сайдбаром доступной ширины меньше — переходим на 3 колонки раньше */
@media (max-width: 1440px) {
	.woo-layout--with-sidebar .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1024px) {
	.woo-layout--with-sidebar .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.woo-layout--with-sidebar .woocommerce ul.products { grid-template-columns: 1fr; }
}

/* =============================================================
   SINGLE PRODUCT
   ============================================================= */

.woocommerce div.product {
	display: grid;
	grid-template-columns: 420px 1fr;
	gap: 3.5rem;
	margin-bottom: 3rem;
}

/* Сдвигаем блок с описанием товара правее относительно фото */
.woocommerce div.product .summary.entry-summary {
	padding-left: 2rem;
}
@media (max-width: 1100px) {
	.woocommerce div.product .summary.entry-summary { padding-left: 1rem; }
}
@media (max-width: 900px) {
	.woocommerce div.product .summary.entry-summary { padding-left: 0; }
}

/* ---------- Галерея (собственная реализация, см. main.js) ---------- */
.woocommerce div.product .woocommerce-product-gallery {
	position: relative;
}
.woocommerce-product-gallery__wrapper {
	margin: 0;
	padding: 0;
	list-style: none;
}
.woocommerce-product-gallery__image {
	display: none;
	background: var(--color-neutral);
}
.woocommerce-product-gallery__image:first-child,
.woocommerce-product-gallery__image.is-active {
	display: block;
}
.woocommerce-product-gallery__image a {
	display: block;
	aspect-ratio: 1 / 1;
}
.woocommerce-product-gallery__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ramos-gallery-thumbs {
	display: flex;
	gap: 0.625rem;
	margin-top: 0.875rem;
	flex-wrap: wrap;
}
.ramos-gallery-thumb {
	width: 68px;
	height: 68px;
	padding: 0;
	border: 1.5px solid var(--color-border-light);
	background: var(--color-neutral);
	cursor: pointer;
	overflow: hidden;
	transition: border-color var(--ease);
	flex-shrink: 0;
}
.ramos-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ramos-gallery-thumb:hover { border-color: rgba(181,101,29,0.5); }
.ramos-gallery-thumb.is-active { border-color: var(--color-copper); }

/* Клик по главному фото — курсор увеличения */
.woocommerce-product-gallery__image a {
	cursor: zoom-in;
}

/* ---------- Lightbox (собственная реализация) ---------- */
.ramos-lightbox {
	position: fixed;
	inset: 0;
	z-index: 1500;
	background: rgba(15,17,18,0.96);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3rem clamp(1rem, 5vw, 4rem);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--ease-md), visibility var(--ease-md);
}
.ramos-lightbox.is-open {
	opacity: 1;
	visibility: visible;
}
.ramos-lightbox__img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.ramos-lightbox__close {
	position: absolute;
	top: 1.5rem;
	right: clamp(1rem, 5vw, 2.5rem);
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,0.75);
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.15);
	transition: color var(--ease), background var(--ease);
	cursor: pointer;
}
.ramos-lightbox__close:hover {
	color: var(--color-white);
	background: rgba(255,255,255,0.14);
}
.ramos-lightbox__close svg { width: 20px; height: 20px; }

.ramos-lightbox__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,0.65);
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.15);
	transition: color var(--ease), background var(--ease);
	cursor: pointer;
}
.ramos-lightbox__nav:hover {
	color: var(--color-white);
	background: rgba(255,255,255,0.14);
}
.ramos-lightbox__nav svg { width: 20px; height: 20px; }
.ramos-lightbox__prev { left: clamp(0.5rem, 3vw, 2rem); }
.ramos-lightbox__next { right: clamp(0.5rem, 3vw, 2rem); }

/* ---------- Summary (правая колонка) ---------- */
.product_title.entry-title {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 800;
	color: var(--color-graphite);
	line-height: 1.2;
	margin-bottom: 0.875rem;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-size: 1.375rem;
	font-weight: 700;
	color: var(--color-copper);
	margin-bottom: 1.125rem;
	display: block;
}
.woocommerce div.product p.price del {
	font-size: 1rem;
	font-weight: 500;
	color: #aaa;
	margin-right: 0.6rem;
}
.woocommerce div.product p.price ins { text-decoration: none; }

.woocommerce-product-details__short-description {
	font-size: 0.9375rem;
	line-height: 1.7;
	color: #555;
	margin-bottom: 1.5rem;
	max-width: 480px;
}
.woocommerce-product-details__short-description p:not(:last-child) { margin-bottom: 0.75rem; }

.stock {
	display: inline-block;
	font-size: 0.8125rem;
	font-weight: 600;
	padding: 0.35rem 0.75rem;
	margin-bottom: 1.5rem;
	background: var(--color-neutral);
}
.stock.in-stock { color: #2e7d32; }
.stock.out-of-stock { color: #c0392b; }

form.cart {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: 1.75rem;
}
form.cart .button {
	height: 48px;
}

.product_meta {
	padding-top: 1.5rem;
	border-top: 1px solid var(--color-border-light);
	font-size: 0.8125rem;
	color: #888;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}
.product_meta > span { display: block; }
.product_meta a { color: var(--color-copper); }

/* ---------- Tabs (Описание / Отзывы) ---------- */
.woocommerce-tabs {
	grid-column: 1 / -1;
	margin-top: 1rem;
	border-top: 1px solid var(--color-border-light);
	padding-top: 2rem;
}
.woocommerce-tabs ul.tabs {
	display: flex;
	gap: 0.5rem;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
	border-bottom: 1px solid var(--color-border-light);
}
.woocommerce-tabs ul.tabs li {
	margin: 0;
}
.woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 0.875rem 1.25rem;
	font-size: 0.9375rem;
	font-weight: 700;
	color: #999;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	transition: color var(--ease), border-color var(--ease);
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover {
	color: var(--color-graphite);
	border-bottom-color: var(--color-copper);
}
.woocommerce-tabs .panel {
	max-width: 780px;
	font-size: 0.9375rem;
	line-height: 1.75;
	color: #555;
}
.woocommerce-tabs .panel h2 {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-graphite);
	margin-bottom: 1rem;
}

/* ---------- Вкладка "Документация" ---------- */
.ramos-doc-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
	background: var(--color-border-light);
	border: 1px solid var(--color-border-light);
	max-width: 480px;
}
.ramos-doc-list li { background: var(--color-white); }
.ramos-doc-list a {
	display: flex;
	align-items: center;
	gap: 0.875rem;
	padding: 1rem 1.25rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--color-graphite-text);
	transition: background var(--ease), color var(--ease);
}
.ramos-doc-list a:hover {
	background: var(--color-neutral);
	color: var(--color-copper);
}
.ramos-doc-list a svg {
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	color: var(--color-copper);
}
.ramos-doc-empty {
	max-width: 560px;
	padding: 1.125rem 1.25rem;
	background: var(--color-neutral);
	border-left: 3px solid var(--color-copper);
	font-size: 0.875rem;
	color: #777;
}

/* ---------- Похожие товары / связанные товары ---------- */
.related.products,
.upsells.products {
	grid-column: 1 / -1;
	margin-top: 3rem;
	padding-top: 2.5rem;
	border-top: 1px solid var(--color-border-light);
}
.related.products > h2,
.upsells.products > h2 {
	font-size: var(--text-h2);
	font-weight: 700;
	color: var(--color-graphite);
	margin-bottom: 1.75rem;
}

/* Похожие/сопутствующие товары — 4 компактные колонки */
.related.products ul.products,
.upsells.products ul.products {
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
	margin-top: 0 !important;
}
.related.products ul.products li.product a img,
.upsells.products ul.products li.product a img {
	margin-bottom: 0.75rem;
}
.related.products ul.products li.product .woocommerce-loop-product__title,
.upsells.products ul.products li.product .woocommerce-loop-product__title {
	font-size: 0.8125rem;
	margin-bottom: 0.35rem;
}
.related.products ul.products li.product .price,
.upsells.products ul.products li.product .price {
	font-size: 0.8125rem;
}
.related.products ul.products li.product .button,
.upsells.products ul.products li.product .button {
	margin-top: 0.625rem;
	padding: 0.5rem 0.75rem;
	font-size: 0.75rem;
}

@media (max-width: 1024px) {
	.related.products ul.products,
	.upsells.products ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 500px) {
	.related.products ul.products,
	.upsells.products ul.products { grid-template-columns: 1fr; }
}

@media (max-width: 1100px) {
	.woocommerce div.product { grid-template-columns: 340px 1fr; gap: 2.5rem; }
}
@media (max-width: 900px) {
	.woocommerce div.product { grid-template-columns: 1fr; gap: 2rem; }
}

/* =============================================================
   CART PAGE
   ============================================================= */

table.shop_table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 2rem;
}
table.shop_table thead th {
	text-align: left;
	padding: 1rem 1rem 1rem 0;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #999;
	border-bottom: 1.5px solid var(--color-graphite);
}
table.shop_table tbody td {
	padding: 1.25rem 1rem 1.25rem 0;
	font-size: 0.9375rem;
	color: var(--color-graphite-text);
	border-bottom: 1px solid var(--color-border-light);
	vertical-align: middle;
}
table.shop_table tbody tr:last-child td { border-bottom: none; }
table.shop_table td.product-thumbnail img {
	width: 72px;
	height: 72px;
	object-fit: cover;
	background: var(--color-neutral);
}
table.shop_table td.product-name a {
	font-weight: 600;
	color: var(--color-graphite);
}
table.shop_table td.product-price,
table.shop_table td.product-subtotal {
	font-weight: 700;
	color: var(--color-copper);
}
table.shop_table td.actions {
	text-align: right;
}
a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	color: #c0392b !important;
	font-size: 1.25rem;
	text-decoration: none !important;
	transition: background var(--ease);
}
a.remove:hover { background: rgba(192,57,43,0.1); }

.cart-collaterals {
	display: flex;
	justify-content: flex-end;
	margin-top: 2rem;
}
.cart_totals {
	width: 100%;
	max-width: 420px;
	padding: 1.75rem;
	background: var(--color-neutral);
}
.cart_totals h2 {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--color-graphite);
	margin-bottom: 1.25rem;
}
.cart_totals table { width: 100%; }
.cart_totals table th,
.cart_totals table td {
	padding: 0.75rem 0;
	font-size: 0.9375rem;
	border-bottom: 1px solid var(--color-border-light);
	text-align: left;
}
.cart_totals table tr:last-child th,
.cart_totals table tr:last-child td { border-bottom: none; }
.cart_totals .order-total .amount {
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--color-copper);
}
.wc-proceed-to-checkout .button {
	width: 100%;
	margin-top: 1rem;
}

.coupon {
	display: flex;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}
.coupon input#coupon_code {
	padding: 0 1rem;
	height: 48px;
	border: 1.5px solid var(--color-border-light);
	font-family: var(--font-family);
	font-size: 0.9375rem;
}

@media (max-width: 700px) {
	table.shop_table td.product-thumbnail img { width: 52px; height: 52px; }
	table.shop_table thead { display: none; }
	table.shop_table, table.shop_table tbody, table.shop_table tr, table.shop_table td {
		display: block;
		width: 100%;
	}
	table.shop_table tr {
		padding: 1rem 0;
		border-bottom: 1px solid var(--color-border-light);
	}
	table.shop_table td { border-bottom: none; padding: 0.35rem 0; }
	table.shop_table td.actions { text-align: left; }
	.cart_totals { max-width: 100%; }
}

/* =============================================================
   CHECKOUT
   ============================================================= */

.woocommerce-checkout .col2-set,
.woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: 1fr 420px;
	gap: 3rem;
	align-items: start;
}
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
	grid-column: 2;
}
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
	grid-column: 1;
}

.woocommerce-billing-fields h3,
#order_review_heading {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--color-graphite);
	margin-bottom: 1.25rem;
}
.woocommerce-form-row,
.form-row {
	margin-bottom: 1.125rem;
}
.form-row-first,
.form-row-last {
	width: 48%;
	display: inline-block;
	vertical-align: top;
}
.form-row-first { float: left; clear: left; }
.form-row-last { float: right; clear: right; }
.form-row-wide { clear: both; }
.woocommerce-form-row label,
.form-row label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-graphite);
	margin-bottom: 0.4rem;
}
.woocommerce-form-row .required { color: var(--color-copper); text-decoration: none; }

.woocommerce-input-wrapper input.input-text,
.woocommerce-input-wrapper select,
.woocommerce-input-wrapper textarea,
#order_comments {
	width: 100%;
	padding: 0.75rem 1rem;
	font-family: var(--font-family);
	font-size: 0.9375rem;
	color: var(--color-graphite-text);
	background: var(--color-white);
	border: 1.5px solid var(--color-border-light);
	transition: border-color var(--ease);
}
.woocommerce-input-wrapper input.input-text:focus,
.woocommerce-input-wrapper select:focus,
.woocommerce-input-wrapper textarea:focus {
	outline: none;
	border-color: var(--color-copper);
}

#order_review table.shop_table {
	background: var(--color-neutral);
	padding: 1.5rem;
}

.woocommerce-checkout-payment {
	background: var(--color-neutral);
	padding: 1.5rem;
	margin-top: 1.5rem;
}
.woocommerce-checkout-payment ul.wc_payment_methods {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
}
.woocommerce-checkout-payment li.wc_payment_method {
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--color-border-light);
	font-size: 0.9375rem;
}
.woocommerce-checkout-payment li.wc_payment_method:last-of-type { border-bottom: none; }

#place_order {
	width: 100%;
	height: 52px;
	font-size: 1rem;
	margin-top: 1rem;
}

@media (max-width: 900px) {
	.woocommerce-checkout .col2-set,
	.woocommerce-checkout form.checkout {
		grid-template-columns: 1fr;
	}
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review,
	.woocommerce-checkout .col2-set .col-1,
	.woocommerce-checkout .col2-set .col-2 {
		grid-column: 1;
	}
	.form-row-first,
	.form-row-last {
		width: 100%;
		float: none;
	}
}

/* =============================================================
   MY ACCOUNT
   ============================================================= */

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var(--color-border-light);
}
.woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--color-border-light);
}
.woocommerce-MyAccount-navigation li:last-child { border-bottom: none; }
.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 0.875rem 1.25rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--color-graphite-text);
	transition: background var(--ease), color var(--ease);
}
.woocommerce-MyAccount-navigation li a:hover {
	background: var(--color-neutral);
	color: var(--color-copper);
}
.woocommerce-MyAccount-navigation li.is-active a {
	background: var(--color-graphite);
	color: var(--color-white);
}

.woocommerce-account .woocommerce-MyAccount-content {
	margin-top: 2rem;
}
.woocommerce-account .addresses .title h3 {
	font-size: 1rem;
	font-weight: 700;
	margin-bottom: 0.75rem;
}

@media (max-width: 900px) {
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		width: 100%;
	}
}

/* =============================================================
   МИНИ-КОРЗИНА / ВИДЖЕТЫ САЙДБАРА (если используются)
   ============================================================= */

.widget {
	margin-bottom: 2.5rem;
}
.widget-title,
.widget > h2 {
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--color-copper);
	margin-bottom: 1rem;
}
.widget ul { list-style: none; margin: 0; padding: 0; }
.widget ul li {
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--color-border-light);
	font-size: 0.9375rem;
}
.widget ul li a { color: var(--color-graphite-text); transition: color var(--ease); }
.widget ul li a:hover { color: var(--color-copper); }

.widget .search-form,
.woocommerce-product-search {
	display: flex;
}
.widget .search-form input[type="search"],
.woocommerce-product-search input[type="search"] {
	flex: 1;
	padding: 0.65rem 0.875rem;
	font-family: var(--font-family);
	font-size: 0.875rem;
	border: 1.5px solid var(--color-border-light);
	border-right: none;
}
.widget .search-form button,
.woocommerce-product-search button {
	padding: 0 1rem;
	background: var(--color-graphite);
	color: var(--color-white);
	border: none;
	font-weight: 600;
	cursor: pointer;
}

/* =============================================================
   UTILITY
   ============================================================= */

.text-copper { color: var(--color-copper); }
.text-white  { color: var(--color-white); }
.bg-graphite { background: var(--color-graphite); }
.bg-neutral  { background: var(--color-neutral); }
.visually-hidden {
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* =============================================
   SECTION: TRACKS (Направления инжиниринга)
   ============================================= */

.section-tracks {
	padding-block: var(--section-py);
	background: var(--color-neutral);
}

.tracks-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1px;
	background: var(--color-border-light);
	border: 1px solid var(--color-border-light);
}

.track-card {
	background: var(--color-white);
	padding: 2.5rem;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.track-card__icon {
	width: 56px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-graphite);
}
.track-card__icon svg {
	width: 28px;
	height: 28px;
	stroke: var(--color-copper);
	fill: none;
	stroke-width: 1.5;
}

.track-card__title {
	font-size: 1.375rem;
	font-weight: 700;
	color: var(--color-graphite);
	line-height: 1.25;
}

.track-card__desc {
	font-size: 0.9375rem;
	line-height: 1.65;
	color: #666;
}

.track-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.25rem;
}

.track-tag {
	display: inline-flex;
	align-items: center;
	padding: 0.4rem 0.75rem;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-graphite);
	background: var(--color-neutral);
	border: 1px solid var(--color-border-light);
	transition: background var(--ease), border-color var(--ease), color var(--ease);
}
.track-tag:hover {
	background: var(--color-copper);
	border-color: var(--color-copper);
	color: var(--color-white);
}

.track-card .btn {
	margin-top: 0.5rem;
	align-self: flex-start;
}

@media (max-width: 900px) {
	.tracks-grid { grid-template-columns: 1fr; }
}

/* =============================================
   SECTION: PROJECTS (Наши проекты)
   ============================================= */

.section-projects {
	padding-block: var(--section-py);
	background: var(--color-white);
}

.projects-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.project-card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--color-border-light);
	transition: box-shadow var(--ease-md);
}
.project-card:hover {
	box-shadow: 0 12px 32px rgba(0,0,0,0.10);
}

.project-card__media {
	position: relative;
	height: 230px;
	background-color: var(--color-graphite);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 1rem;
	overflow: hidden;
}
/* Затемнение снизу — чтобы бейджи читались на любом фото */
.project-card__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(31,35,38,0.30) 0%,
		rgba(31,35,38,0.05) 40%,
		rgba(31,35,38,0.55) 100%
	);
	pointer-events: none;
}

.project-card__category {
	position: relative;
	z-index: 1;
	display: inline-block;
	padding: 0.4rem 0.7rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-white);
	background: rgba(181,101,29,0.92);
	backdrop-filter: blur(2px);
}

/* KPI-плашка в правом нижнем углу обложки */
.project-card__kpi {
	position: absolute;
	z-index: 1;
	right: 1rem;
	bottom: 1rem;
	text-align: right;
	max-width: 62%;
}
.project-card__kpi .pk-value {
	display: block;
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1.05;
	color: var(--color-white);
	text-shadow: 0 2px 12px rgba(0,0,0,0.5);
}
.project-card__kpi .pk-label {
	display: block;
	margin-top: 0.15rem;
	font-size: 0.6875rem;
	line-height: 1.35;
	color: rgba(255,255,255,0.85);
	text-shadow: 0 1px 8px rgba(0,0,0,0.6);
}

.project-card__body {
	padding: 1.375rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	flex: 1;
}

.project-card__title {
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--color-graphite);
	line-height: 1.35;
}

.project-card__subtitle {
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.45;
	color: var(--color-copper);
	margin-top: -0.15rem;
}

.project-card__desc {
	font-size: 0.875rem;
	line-height: 1.6;
	color: #666;
	flex: 1;
}

.project-card__geo {
	font-size: 0.75rem;
	line-height: 1.5;
	color: #999;
	padding-top: 0.6rem;
	margin-top: 0.15rem;
	border-top: 1px solid var(--color-border-light);
}

/* =============================================
   СТРАНИЦА ПРОЕКТОВ (/proekty/)
   ============================================= */

/* — Заголовочный экран — */
.page-hero {
	position: relative;
	background: var(--color-graphite);
	overflow: hidden;
	padding-top: calc(var(--header-height) + clamp(2.5rem, 5vw, 4rem));
	padding-bottom: clamp(2.5rem, 5vw, 4rem);
}
.page-hero__bg {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(160deg, #23282c 0%, var(--color-graphite) 50%, #16191b 100%);
}
.page-hero__bg::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		repeating-linear-gradient(
			-45deg,
			rgba(181,101,29,0.07) 0px,
			rgba(181,101,29,0.07) 1px,
			transparent 1px,
			transparent 46px
		);
}
.page-hero__bg::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 200px 200px 0;
	border-color: transparent var(--color-copper) transparent transparent;
	opacity: 0.20;
}
.page-hero__content {
	position: relative;
	z-index: 2;
	max-width: 760px;
}
.page-hero__title {
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var(--color-white);
	margin: 0.75rem 0 1rem;
}
.page-hero__desc {
	font-size: clamp(0.9375rem, 1.4vw, 1.0625rem);
	line-height: 1.7;
	color: rgba(255,255,255,0.72);
	max-width: 600px;
}
.page-hero__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 2.5rem;
	margin-top: 2.25rem;
	padding-top: 1.75rem;
	border-top: 1px solid var(--color-border);
}
.phs-item .phs-value {
	display: block;
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	font-weight: 800;
	line-height: 1;
	color: var(--color-copper);
}
.phs-item .phs-label {
	display: block;
	margin-top: 0.3rem;
	font-size: 0.8125rem;
	color: rgba(255,255,255,0.55);
}

@media (max-width: 768px) {
	.page-hero__bg::after { border-width: 0 110px 110px 0; }
	.page-hero__stats { gap: 1.5rem; }
}

/* — Фильтр — */
.section-projects-full {
	padding-block: var(--section-py);
	background: var(--color-white);
}

.projects-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 2.5rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--color-border-light);
}
.projects-filter__btn {
	padding: 0.55rem 1.125rem;
	font-family: var(--font-family);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--color-graphite);
	background: var(--color-neutral);
	border: 1px solid var(--color-border-light);
	cursor: pointer;
	transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.projects-filter__btn:hover {
	border-color: var(--color-copper);
	color: var(--color-copper);
}
.projects-filter__btn.is-active {
	background: var(--color-graphite);
	border-color: var(--color-graphite);
	color: var(--color-white);
}

/* — Список проектов — */
.projects-list {
	display: flex;
	flex-direction: column;
	gap: clamp(2.5rem, 5vw, 4rem);
}

.project-row {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(1.75rem, 3.5vw, 3rem);
	align-items: center;
}
.project-row--reverse .project-row__media { order: 2; }
.project-row--reverse .project-row__body  { order: 1; }
.project-row[hidden] { display: none; }

/* Обложка */
.project-row__media {
	position: relative;
	min-width: 0;
}
.project-row__cover {
	width: 100%;
	aspect-ratio: 16 / 10;
	background-color: var(--color-graphite);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.project-row__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to bottom,
		rgba(31,35,38,0.25) 0%,
		transparent 35%,
		rgba(31,35,38,0.45) 100%
	);
	pointer-events: none;
}
.project-row__category {
	position: absolute;
	z-index: 1;
	top: 1rem;
	left: 1rem;
	padding: 0.4rem 0.75rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-white);
	background: rgba(181,101,29,0.92);
}
.project-row__kpi {
	position: absolute;
	z-index: 1;
	left: 1rem;
	bottom: 1rem;
	max-width: 70%;
}
.project-row__kpi .prk-value {
	display: block;
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	font-weight: 800;
	line-height: 1;
	color: var(--color-white);
	text-shadow: 0 2px 14px rgba(0,0,0,0.55);
}
.project-row__kpi .prk-label {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.75rem;
	line-height: 1.4;
	color: rgba(255,255,255,0.88);
	text-shadow: 0 1px 10px rgba(0,0,0,0.65);
}

/* Контент */
.project-row__body { min-width: 0; }
.project-row__title {
	font-size: clamp(1.25rem, 2.2vw, 1.625rem);
	font-weight: 800;
	color: var(--color-graphite);
	line-height: 1.25;
}
.project-row__subtitle {
	margin-top: 0.35rem;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--color-copper);
}
.project-row__desc {
	margin-top: 1rem;
	font-size: 0.9375rem;
	line-height: 1.7;
	color: #555;
}

/* Таблица характеристик */
.project-specs {
	margin-top: 1.5rem;
	border-top: 1px solid var(--color-border-light);
}
.project-specs__row {
	display: grid;
	grid-template-columns: 170px minmax(0, 1fr);
	gap: 1rem;
	padding: 0.65rem 0;
	border-bottom: 1px solid var(--color-border-light);
}
.project-specs dt {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #999;
	padding-top: 0.1rem;
}
.project-specs dd {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.55;
	color: var(--color-graphite-text);
}

/* Результат */
.project-row__result {
	margin-top: 1.5rem;
	padding: 1.125rem 1.25rem;
	background: var(--color-neutral);
	border-left: 3px solid var(--color-copper);
}
.project-row__result .prr-label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-copper);
	margin-bottom: 0.4rem;
}
.project-row__result p:last-child {
	font-size: 0.875rem;
	line-height: 1.65;
	color: var(--color-graphite-text);
}

.project-row__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.75rem;
	margin-top: 1.25rem;
	padding-top: 1rem;
	border-top: 1px solid var(--color-border-light);
}
.project-row__object,
.project-row__geo {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: #999;
}
.project-row__object { color: var(--color-graphite-text); font-weight: 600; }
.project-row__object svg,
.project-row__geo svg {
	width: 15px;
	height: 15px;
	flex-shrink: 0;
	margin-top: 0.1rem;
	color: var(--color-copper);
}

.projects-empty {
	padding: 3rem 1rem;
	text-align: center;
	color: #999;
	font-size: 0.9375rem;
}

@media (max-width: 900px) {
	.project-row {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
	.project-row--reverse .project-row__media { order: 1; }
	.project-row--reverse .project-row__body  { order: 2; }
	.project-specs__row { grid-template-columns: 1fr; gap: 0.2rem; }
}

@media (max-width: 1200px) {
	.projects-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 780px) {
	.projects-grid { grid-template-columns: 1fr; }
}

/* =============================================
   SECTION: EQUIPMENT (WooCommerce slider)
   ============================================= */

.section-equipment {
	padding-block: var(--section-py);
	background: var(--color-neutral);
}

.equipment-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.equipment-nav {
	display: flex;
	gap: 0.5rem;
	flex-shrink: 0;
	margin-bottom: 0.25rem;
}
.equipment-nav__btn {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1.5px solid var(--color-graphite);
	color: var(--color-graphite);
	transition: background var(--ease), color var(--ease);
}
.equipment-nav__btn:hover {
	background: var(--color-graphite);
	color: var(--color-white);
}
.equipment-nav__btn svg { width: 16px; height: 16px; }

.equipment-slider {
	display: flex;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	padding-bottom: 0.5rem;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.equipment-slider::-webkit-scrollbar { display: none; }

.equipment-card {
	flex: 0 0 auto;
	width: 260px;
	scroll-snap-align: start;
	background: var(--color-white);
	border: 1px solid var(--color-border-light);
	display: flex;
	flex-direction: column;
	transition: box-shadow var(--ease-md);
}
.equipment-card:hover { box-shadow: 0 12px 28px rgba(0,0,0,0.10); }

.equipment-card__media {
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--color-neutral);
	overflow: hidden;
}
.equipment-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.equipment-card__body {
	padding: 1.125rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.equipment-card__title {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--color-graphite);
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.equipment-card__price {
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-copper);
}
.equipment-card__price bdi { font-weight: 700; }

.equipment-empty {
	padding: 3rem 1rem;
	text-align: center;
	background: var(--color-white);
	border: 1px dashed var(--color-border-light);
}
.equipment-empty p { color: #999; font-size: 0.9375rem; }

@media (max-width: 640px) {
	.equipment-card { width: 210px; }
}

/* =============================================
   PARTNER LOGO SLOTS (placeholders)
   ============================================= */

.partner-logo-slot {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 140px;
	height: 64px;
	border: 1.5px dashed var(--color-border-light);
	color: #ccc;
	transition: border-color var(--ease), color var(--ease);
}
.partner-logo-slot:hover {
	border-color: var(--color-copper);
	color: var(--color-copper);
}
.partner-logo-slot svg {
	width: 28px;
	height: 28px;
}

/* =============================================================
   CATALOG MODE — "Запросить цену" + модальное окно
   ============================================================= */

/* Кнопка в карточке каталога (компактная, вместо "В корзину") */
.woocommerce ul.products li.product .ramos-price-request-btn.button {
	width: 100%;
}

/* Кнопка на карточке товара (крупная) */
.ramos-price-request-wrap {
	margin: 0.5rem 0 1.75rem;
}
.ramos-price-request-btn--lg {
	height: 52px;
	padding-inline: 2.25rem;
}

/* ---------- Модальное окно ---------- */
.ramos-price-modal {
	position: fixed;
	inset: 0;
	z-index: 1600;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--ease-md), visibility var(--ease-md);
}
.ramos-price-modal.is-open {
	opacity: 1;
	visibility: visible;
}

.ramos-price-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(15,17,18,0.72);
}

.ramos-price-modal__panel {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 480px;
	max-height: 90vh;
	overflow-y: auto;
	background: var(--color-white);
	padding: clamp(1.75rem, 4vw, 2.75rem);
	transform: translateY(12px);
	transition: transform var(--ease-md);
}
.ramos-price-modal.is-open .ramos-price-modal__panel {
	transform: translateY(0);
}

.ramos-price-modal__close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #999;
	transition: color var(--ease), background var(--ease);
}
.ramos-price-modal__close:hover {
	color: var(--color-graphite);
	background: var(--color-neutral);
}

.ramos-price-modal__label {
	font-size: var(--text-label);
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--color-copper);
	margin-bottom: 0.5rem;
}
.ramos-price-modal__title {
	font-size: 1.375rem;
	font-weight: 800;
	color: var(--color-graphite);
	line-height: 1.3;
	margin-bottom: 1.5rem;
	min-height: 1.3em;
}

/* ---------- Стилизация формы Contact Form 7 внутри модалки ---------- */
.ramos-price-modal__form .wpcf7-form p { margin-bottom: 1.125rem; }
.ramos-price-modal__form .wpcf7-form label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-graphite);
	margin-bottom: 0.4rem;
}
.ramos-price-modal__form .wpcf7-form input[type="text"],
.ramos-price-modal__form .wpcf7-form input[type="email"],
.ramos-price-modal__form .wpcf7-form input[type="tel"],
.ramos-price-modal__form .wpcf7-form textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	font-family: var(--font-family);
	font-size: 0.9375rem;
	color: var(--color-graphite-text);
	background: var(--color-white);
	border: 1.5px solid var(--color-border-light);
	transition: border-color var(--ease);
}
.ramos-price-modal__form .wpcf7-form input:focus,
.ramos-price-modal__form .wpcf7-form textarea:focus {
	outline: none;
	border-color: var(--color-copper);
}
.ramos-price-modal__form .wpcf7-form input[type="submit"] {
	width: 100%;
	height: 50px;
	margin-top: 0.5rem;
	font-family: var(--font-family);
	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--color-white);
	background: var(--color-copper);
	border: 2px solid var(--color-copper);
	cursor: pointer;
	transition: background var(--ease), border-color var(--ease);
}
.ramos-price-modal__form .wpcf7-form input[type="submit"]:hover {
	background: var(--color-copper-hover);
	border-color: var(--color-copper-hover);
}
.ramos-price-modal__form .wpcf7-spinner { margin-left: 0.75rem; }
.ramos-price-modal__form .wpcf7-not-valid-tip {
	font-size: 0.75rem;
	color: #c0392b;
	margin-top: 0.3rem;
}
.ramos-price-modal__form .wpcf7-response-output {
	margin-top: 1rem;
	padding: 0.875rem 1rem;
	font-size: 0.8125rem;
	background: var(--color-neutral);
	border-left: 3px solid var(--color-copper);
}