/*
Theme Name: Scanspace
Theme URI: https://github.com/HOOGagency/scanspace-theme
Author: Elizaveta (HOOG Agency)
Author URI: https://github.com/HOOGagency
Description: Scanspace is a clean, minimal WordPress theme for Scandinavian-style furniture stores. It pairs warm neutrals with generous whitespace to put product photography front and center, and is built for performance, accessibility, and WooCommerce.
Version: 0.4.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: scanspace
Tags: e-commerce, minimal, clean, custom-menu, custom-logo, featured-images, translation-ready, block-styles, wide-blocks
*/

/* ==========================================================================
   Custom properties
   ========================================================================== */

:root {
	--color-primary: #2d2a26;
	--color-primary-hover: #1a1815;
	--color-text: #2d2a26;
	--color-text-muted: #999;
	--color-text-secondary: #777;
	--color-logo: #09276a;
	--color-link-hover: #09276a;
	--color-bg: #f7f6f3;
	--color-white: #ffffff;
	--font-primary: 'Figtree', sans-serif;
	--font-accent: 'Urbanist', sans-serif;
	--header-radius: 16px;
	--color-accent: #ab0733;
	--color-accent-hover: #8c0629;
	--transition: 0.2s ease;
	--maxw: 90rem;
	--side-pad: 2rem;
	--ink: #2d2a26;
	--ink-2: #55514b;
	--ink-3: #8c867d;
	--rule: #e7e4dd;
	--rule-2: #efece6;
	--ok: #3f7a4e;
}

/* ==========================================================================
   Base
   ========================================================================== */

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

html {
	font-size: 100%;
	scroll-behavior: smooth;
	background-color: var(--color-bg);
}

h1, h2, h3, h4,
.hero-slider__heading,
.products__heading,
.faq__heading,
.contact__heading {
	font-weight: 700;
}

h1 strong, h1 b,
h2 strong, h2 b,
h3 strong, h3 b,
h4 strong, h4 b,
.hero-slider__heading strong,
.products__heading strong,
.faq__heading strong,
.contact__heading strong {
	font-weight: inherit;
}

body {
	margin: 0 auto;
	overflow-x: hidden;
	max-width: var(--maxw);
	margin-left: auto;
	margin-right: auto;
	background-color: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-primary);
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

a {
	color: inherit;
	text-decoration: none;
}

button {
	font: inherit;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	color: inherit;
}

img,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

:focus-visible {
	outline: 2px solid var(--color-link-hover);
	outline-offset: 0.1875rem;
}

.skip-link {
	position: absolute;
	top: -3rem;
	left: 1rem;
	z-index: 999;
	padding: 0.5rem 1rem;
	background-color: var(--color-primary);
	color: var(--color-white);
	border-radius: 0.25rem;
	font-weight: 500;
}

.skip-link:focus {
	top: 1rem;
}

.screen-reader-text {
	position: absolute;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px;
	height: 1px;
	overflow: hidden;
	white-space: nowrap;
}

/* ==========================================================================
   Site header (sticky wrapper)
   ========================================================================== */

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	max-width: var(--maxw);
	margin-left: auto;
	margin-right: auto;
	background-color: var(--color-bg);
}

/* ==========================================================================
   Top bar (level 1)
   ========================================================================== */

.top-bar {
	font-size: 12px;
	color: var(--ink-2, #5a554e);
}

.top-bar__inner {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 10px var(--side-pad);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.top-bar__status {
	font-family: 'Figtree', sans-serif;
	font-size: 14px;
	color: var(--ink-3, #8a847b);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
}

.top-bar__dot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #3f7a4e;
	flex-shrink: 0;
}

.top-bar__address {
	font-size: 14px;
	color: var(--ink-2, #5a554e);
	white-space: nowrap;
}

.top-bar__right {
	display: flex;
	align-items: center;
	gap: 20px;
}

.top-bar__social {
	color: var(--ink-3, #8a847b);
	display: inline-flex;
	align-items: center;
	transition: color 0.15s ease;
	text-decoration: none;
}

.top-bar__social:hover {
	color: var(--ink, #2d2a26);
}

.top-bar__social svg {
	width: 26px;
	height: 26px;
}

.top-bar__divider {
	width: 1px;
	height: 12px;
	background: var(--rule, #e7e4dd);
	flex-shrink: 0;
}

.top-bar__phone {
	font-size: 16px;
	color: var(--ink-2, #2d2926);
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.15s ease;
	font-weight: 700;
}

.top-bar__phone:hover {
	color: var(--ink, #2d2a26);
}

.top-bar__cta {
	font-weight: 600;
	font-size: 14px;
	color: var(--color-accent, #8B1A2B);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.15s ease;
}

.top-bar__cta:hover {
	color: #6d1422;
}

@media (max-width: 61.99em) {

	.top-bar__status,
	.top-bar__address {
		display: none;
	}

	.top-bar__inner {
		justify-content: space-between;
		padding: 8px 1rem;
		gap: 12px;
	}

	.top-bar__right {
		display: contents;
	}

	.top-bar__social {
		display: inline-flex;
		order: -1;
	}

	.top-bar__social:last-of-type {
		margin-right: auto;
	}

	.top-bar__divider {
		display: none;
	}

	.main-header__messengers {
		display: none !important;
	}

	.main-header {
		padding: 0.4rem 12px !important;
		gap: 8px;
	}

	.main-header__logo {
		margin-right: auto;
	}

	.main-header__actions {
		margin-left: auto;
		gap: 6px;
	}
}

/* ==========================================================================
   Main header (level 2)
   ========================================================================== */

.main-header__wrap {
	padding: 0;
}

.main-header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	max-width: var(--maxw);
	margin: 0 auto 10px;
	padding: 0.625rem var(--side-pad);
	background-color: var(--color-white);
	border-radius: 16px;
	box-shadow: 0 0.125rem 1.25rem rgba(0, 0, 0, 0.04);
}

.main-header__logo {
	display: flex;
	align-items: center;
	gap: 1rem;
	text-decoration: none;
	flex-shrink: 0;
}

.main-header__logo-img {
	display: block;
	width: auto;
	height: 1.75rem;
}

.main-header__tagline {
	display: none;
	font-size: 0.625rem;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.075em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

@media (min-width: 62em) {

	.main-header__wrap {
		padding: 0;
	}

	.main-header {
		padding: 0.9rem var(--side-pad);
	}

	.main-header__logo-img {
		height: 2.25rem;
	}

	.main-header__tagline {
		display: inline-block;
		margin-top: 0.6375rem;
	}
}

/* ==========================================================================
   Main nav
   ========================================================================== */

.main-nav {
	display: none;
}


.main-nav__item {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-decoration: none;
	cursor: pointer;
	transition: color var(--transition);
}

.main-nav__item a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: inherit;
	text-decoration: none;
}

.main-nav__item:hover,
.main-nav__item:focus-within {
	color: var(--color-link-hover);
}


.main-nav__icon {
	width: 1.125rem;
	height: 1.125rem;
}

.main-nav__caret {
	width: 0.6875rem;
	height: 0.6875rem;
	transition: transform var(--transition);
}

.main-nav__item:hover .main-nav__caret,
.main-nav__item:focus-within .main-nav__caret {
	transform: rotate(180deg);
}

@media (min-width: 62em) {

	.main-nav {
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: 2.25rem;
		position: static;
		padding: 0;
		background: transparent;
		overflow: visible;
	}

	.main-nav__item--has-sub {
		position: relative;
	}
}

/* ==========================================================================
   Mega menu (3-level)
   ========================================================================== */

.mega {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	background: var(--color-white, #fff);
	border: 1px solid var(--rule, #e7e4dd);
	border-top: none;
	border-radius: 0 0 16px 16px;
	box-shadow: 0 30px 60px -32px rgba(45, 42, 38, 0.28);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-10px);
	transition: opacity 0.22s ease, transform 0.24s cubic-bezier(0.2, 0.7, 0.2, 1), visibility 0.24s;
	z-index: 49;
}

.site-header.mega-open .mega {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.mega-inner {
	padding: 0 32px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr auto;
}

.mega-l1 {
	padding: 30px 24px 30px 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.mega-l1-item {
	width: 100%;
	text-align: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 13px 16px;
	border-radius: 10px;
	color: var(--ink-2, #5a554e);
	background: transparent;
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.16s ease, color 0.16s ease;
}

.mega-l1-item .lab {
	font-family: var(--font-primary, 'Figtree', sans-serif);
	font-weight: 500;
	font-size: 15px;
}


.mega-l1-item .chev {
	width: 14px;
	height: 14px;
	opacity: 0;
	transition: all 0.16s ease;
}

.mega-l1-item:hover {
	background: var(--rule-2, #efece6);
	color: var(--ink, #2d2a26);
}

.mega-l1-item.active {
	background: var(--ink, #2d2a26);
	color: #fff;
}

.mega-l1-item.active .chev {
	opacity: 1;
}

.mega-l2 {
	padding: 30px 28px;
	border-left: 1px solid var(--rule-2, #efece6);
	border-right: 1px solid var(--rule-2, #efece6);
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.mega-l2-item {
	width: 100%;
	text-align: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
	color: var(--ink-2, #5a554e);
	background: transparent;
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.14s ease, color 0.14s ease;
}

.mega-l2-item .ar {
	width: 13px;
	height: 13px;
	opacity: 0;
	transition: opacity 0.14s ease;
}

.mega-l2-item:hover,
.mega-l2-item.active {
	background: var(--rule-2, #efece6);
	color: var(--ink, #2d2a26);
}

.mega-l2-item.active .ar {
	opacity: 1;
}

.mega-l2-viewall {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 16px;
	padding: 10px 12px;
	font-family: var(--font-primary, 'Figtree', sans-serif);
	font-size: 13px;
	font-weight: 500;
	color: var(--color-primary, #09276a);
	text-decoration: none;
	transition: color 0.14s ease;
}

.mega-l2-viewall:hover {
	color: var(--color-link-hover, #09276a);
}

.mega-l2-viewall svg {
	width: 14px;
	height: 14px;
	transition: transform 0.2s ease;
}

.mega-l2-viewall:hover svg {
	transform: translateX(3px);
}

.mega-l3 {
	padding: 30px 0 30px 36px;
}

.mega-l3-head {
	font-family: var(--font-primary, 'Figtree', sans-serif);
	font-weight: 600;
	font-size: 1.0625rem;
	color: var(--ink, #2d2a26);
	margin-bottom: 6px;
	text-decoration: none;
}

.mega-l3-head:hover {
	color: var(--color-link-hover, #09276a);
}

.mega-l3-path {
	font-family: 'JetBrains Mono', monospace;
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink-3, #8a847b);
	margin-bottom: 18px;
}

.mega-l3-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2px;
}

.mega-l3-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 9px 0;
	font-size: 13.5px;
	color: var(--ink-2, #5a554e);
	border-bottom: 1px solid var(--rule-2, #efece6);
	transition: color 0.14s ease, padding 0.16s ease;
	text-decoration: none;
}

.mega-l3-list a:hover {
	color: var(--color-link-hover, #09276a);
	padding-left: 6px;
}

.mega-l3-allrow {
	grid-column: 1 / -1;
	margin-top: 18px;
}

.mega-l3-all {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-primary, 'Figtree', sans-serif);
	font-size: 13px;
	font-weight: 500;
	color: var(--color-primary, #09276a);
	text-decoration: none;
}

.mega-l3-all:hover {
	color: var(--color-link-hover, #09276a);
}

.mega-l3-all svg {
	width: 13px;
	height: 13px;
	transition: transform 0.2s ease;
}

.mega-l3-all:hover svg {
	transform: translateX(3px);
}

.mega-eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 10px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3, #8a847b);
	font-weight: 500;
	margin-bottom: 18px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.mega-feat {
	width: 296px;
	margin: 30px 0 30px 36px;
	background: var(--color-bg, #f5f0e8);
	border: 1px solid var(--rule, #e7e4dd);
	border-radius: 14px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: border-color 0.18s ease;
	text-decoration: none;
}

.mega-feat:hover {
	border-color: var(--ink-2, #5a554e);
}

.mega-feat .img {
	flex: 1 1 auto;
	min-height: 220px;
	background: #ffffff;
	border-bottom: 1px solid var(--rule-2, #efece6);
	display: grid;
	place-items: center;
	position: relative;
	overflow: hidden;
}

.mega-feat .img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.mega-feat .tag {
	position: absolute;
	left: 12px;
	top: 12px;
	background: var(--ink, #2d2a26);
	color: #fff;
	border-radius: 999px;
	padding: 5px 11px;
	font-family: 'JetBrains Mono', monospace;
	font-size: 9px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.mega-feat .body {
	flex: 0 0 auto;
	padding: 12px 16px 14px;
}

.mega-feat .body .brand {
	font-family: 'JetBrains Mono', monospace;
	font-size: 10px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3, #8a847b);
}

.mega-feat .body h4 {
	font-family: var(--font-primary, 'Figtree', sans-serif);
	font-weight: 600;
	font-size: 0.9375rem;
	margin: 6px 0 0;
	color: var(--ink, #2d2a26);
}

@media (max-width: 1100px) {
	.mega {
		display: none;
	}
}

/* ==========================================================================
   Sub menu (For Clients)
   ========================================================================== */

.sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 12rem;
	margin-top: 0.5rem;
	padding: 0.5rem;
	background-color: var(--color-white);
	border-radius: 0.75rem;
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.05);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--transition), visibility var(--transition);
}

.sub-menu::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -0.5rem;
	height: 0.5rem;
}

.sub-menu__link {
	display: block;
	padding: 0.625rem 0.75rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--color-text-secondary);
	text-transform: none;
	letter-spacing: normal;
	text-decoration: none;
	border-radius: 0.375rem;
	transition: color var(--transition), background-color var(--transition);
}

.sub-menu__link:hover,
.sub-menu__link:focus-visible {
	color: var(--color-link-hover);
	background-color: var(--color-bg);
}

@media (max-width: 61.99em) {

	.sub-menu {
		display: none;
	}
}

@media (min-width: 62em) {

	.main-nav__item--has-sub:hover .sub-menu,
	.main-nav__item--has-sub:focus-within .sub-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}
}

/* ==========================================================================
   Header actions (search / wishlist / cart / burger)
   ========================================================================== */

.main-header__actions {
	display: flex;
	align-items: center;
	gap: 0.125rem;
}

.main-header__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	background: transparent;
	border: 0;
	border-radius: 0.625rem;
	cursor: pointer;
	color: var(--color-text);
	transition: background-color var(--transition), color var(--transition);
}

.main-header__icon:hover {
	background-color: #f5f4f0;
	color: var(--color-link-hover);
}

.main-header__icon-svg {
	width: 1.3125rem;
	height: 1.3125rem;
}

.main-header__cart {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.625rem;
	height: 2.625rem;
	margin-left: 0.25rem;
	background-color: transparent;
	color: var(--color-text);
	border-radius: 0.625rem;
	text-decoration: none;
	transition: background-color var(--transition), color var(--transition);
}

.main-header__cart:hover {
	background-color: #f5f4f0;
	color: var(--color-link-hover);
}

.main-header__cart-svg {
	width: 1.25rem;
	height: 1.25rem;
}

.main-header__cart-count {
	position: absolute;
	top: 0.25rem;
	right: 0.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1rem;
	height: 1rem;
	font-size: 0.625rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-white);
	background-color: var(--color-primary);
	border-radius: 50%;
}

.main-header__burger {
	display: grid;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	border: 1px solid #e7e4dd;
	background: #fff;
	place-items: center;
	position: relative;
	cursor: pointer;
}

.main-header__burger span,
.main-header__burger::before,
.main-header__burger::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 18px;
	height: 1.6px;
	background: var(--color-text);
	border-radius: 2px;
	transform: translate(-50%, -50%);
	transition: transform .26s cubic-bezier(.2, .7, .2, 1), opacity .2s ease;
}

.main-header__burger::before {
	transform: translate(-50%, -6px);
}

.main-header__burger::after {
	transform: translate(-50%, 4px);
}

.site-header.nav-open .main-header__burger span {
	opacity: 0;
}

.site-header.nav-open .main-header__burger::before {
	transform: translate(-50%, -50%) rotate(45deg);
}

.site-header.nav-open .main-header__burger::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

/* Mobile menu (hidden on desktop) */
.mobile-menu {
	display: none;
}

@media (min-width: 62em) {

	.main-header__actions {
		gap: 0.5rem;
	}

	.main-header__icon {
		width: 2.625rem;
		height: 2.625rem;
	}

	.main-header__cart {
		width: 2.875rem;
		height: 2.875rem;
		background-color: var(--color-primary);
		color: var(--color-white);
		border-radius: 0.75rem;
	}

	.main-header__cart:hover {
		background-color: var(--color-link-hover);
		color: var(--color-white);
	}

	.main-header__cart-count {
		top: 0.375rem;
		right: 0.375rem;
		color: var(--color-primary);
		background-color: var(--color-white);
	}

	.main-header__burger {
		display: none;
	}
}

/* ==========================================================================
   Mobile menu
   ========================================================================== */

@media (max-width: 61.99em) {

	.main-header__logo-img {
		height: 26px;
		width: auto;
	}

	.main-header__wrap {
		position: relative;
		padding-left: 0.625rem;
		padding-right: 0.625rem;
	}

	.mobile-menu {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		background: #fff;
		border-top: 1px solid #e7e4dd;
		border-bottom: 1px solid #e7e4dd;
		box-shadow: 0 30px 60px -32px rgba(45, 42, 38, .28);
		max-height: calc(100vh - 72px);
		overflow-y: auto;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(-10px);
		transition: opacity .22s ease, transform .24s cubic-bezier(.2, .7, .2, 1), visibility .24s;
		z-index: 48;
	}

	.site-header.nav-open .mobile-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
	}

	.mm-inner {
		padding: 8px 22px 30px;
	}

	.mm-item {
		border-bottom: 1px solid #efece6;
	}

	.mm-link {
		width: 100%;
		text-align: left;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 12px 2px;
		font-family: var(--font-accent);
		font-weight: 500;
		font-size: 18px;
		letter-spacing: .01em;
		text-transform: uppercase;
		color: var(--color-text);
		background: none;
		border: 0;
		text-decoration: none;
		transition: color .15s ease;
	}

	.mm-link:hover {
		color: var(--color-link-hover);
	}

	.mm-link .ico {
		display: inline-flex;
		align-items: center;
		gap: 12px;
	}

	.mm-link .ico > svg:first-child {
		width: 18px;
		height: 18px;
		color: var(--color-text-muted);
	}

	.mm-link .chev {
		width: 16px;
		height: 16px;
		opacity: .6;
		transition: transform .25s ease;
	}

	.mm-item.open > .mm-link .chev,
	.mm-item.open > .mm-sublink .chev {
		transform: rotate(180deg);
		opacity: 1;
	}

	.mm-sub {
		display: none;
	}

	.mm-item.open > .mm-sub {
		display: block;
		animation: mmReveal .2s ease;
	}

	@keyframes mmReveal {
		from { opacity: 0; transform: translateY(-4px); }
		to { opacity: 1; transform: translateY(0); }
	}

	.mm-sub-inner {
		padding: 0 2px 18px 30px;
		display: flex;
		flex-direction: column;
		gap: 2px;
	}

	.mm-sub-inner a {
		padding: 7px 0;
		font-size: 16px;
		color: var(--color-text-secondary);
		display: flex;
		align-items: center;
		justify-content: space-between;
		text-decoration: none;
	}

	.mm-sub-inner a:hover {
		color: var(--color-link-hover);
	}

	.mm-sub-inner a .ct {
		font-family: 'JetBrains Mono', monospace;
		font-size: 10px;
		letter-spacing: .1em;
		color: var(--color-text-muted);
	}

	.mm-sublink {
		width: 100%;
		text-align: left;
		background: none;
		border: 0;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 7px 0;
		font-size: 16px;
		color: var(--color-text-secondary);
		font-family: var(--font-primary);
		text-decoration: none;
	}

	.mm-sublink:hover {
		color: var(--color-link-hover);
	}

	.mm-sublink .chev {
		width: 15px;
		height: 15px;
		opacity: .6;
		transition: transform .25s ease;
	}

	.mm-all {
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 7px 0;
		font-size: 16px;
		font-weight: 600;
		color: var(--color-text);
		text-decoration: none;
	}

	.mm-all:hover {
		color: var(--color-link-hover);
	}

	.mm-all span {
		color: var(--color-text-muted);
	}

	.mm-leaf {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 7px 0;
		font-size: 16px;
		color: var(--color-text-secondary);
		text-decoration: none;
	}

	.mm-leaf:hover {
		color: var(--color-link-hover);
	}

	.mm-leaf .ct {
		font-family: 'JetBrains Mono', monospace;
		font-size: 10px;
		letter-spacing: .1em;
		color: var(--color-text-muted);
	}

	.mm-sub-inner .mm-item {
		border-bottom: 0;
	}

	.mm-sub-inner .mm-sub-inner {
		padding-left: 18px;
	}

	.mm-foot {
		margin-top: 14px;
		padding-top: 0;
		display: flex;
		flex-direction: column;
		gap: 20px;
	}

	.mm-cta {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		height: 52px;
		border-radius: 12px;
		background: var(--color-accent);
		color: #fff;
		font-weight: 600;
		font-size: 15px;
		letter-spacing: .01em;
		text-decoration: none;
		transition: background .18s ease;
	}

	.mm-cta:hover {
		background: var(--color-accent-hover);
	}

	.mm-cta svg {
		width: 15px;
		height: 15px;
	}

	.mm-contact {
		display: flex;
		flex-direction: column;
		gap: 6px;
	}

	.mm-phone {
		font-family: var(--font-accent);
		font-weight: 600;
		font-size: 1.5rem;
		letter-spacing: -0.02em;
		color: var(--color-text);
		text-decoration: none;
	}

	.mm-phone:hover {
		color: var(--color-link-hover);
	}

	.mm-addr {
		font-size: 15px;
		color: var(--color-text-secondary);
	}

	.mm-hours {
		font-family: 'JetBrains Mono', monospace;
		font-size: 12px;
		letter-spacing: .1em;
		text-transform: uppercase;
		color: var(--color-text-muted);
	}

	.mm-phone-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
	}

	.mm-msgrs {
		display: flex;
		gap: 8px;
	}

	.mm-msgr {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		border: 1px solid #e7e4dd;
		display: grid;
		place-items: center;
		color: var(--color-text-secondary);
		text-decoration: none;
		transition: border-color .15s ease, color .15s ease;
	}

	.mm-msgr:hover {
		border-color: var(--color-text);
		color: var(--color-link-hover);
	}

	.main-nav {
		display: none;
	}
}

/* ==========================================================================
   Header messengers (mobile only — TG/WA between logo and actions)
   ========================================================================== */

.main-header__messengers {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	margin-right: auto;
}

.main-header__messenger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.625rem;
	height: 2.625rem;
	color: var(--color-text-secondary);
	border-radius: 0.625rem;
	transition: color var(--transition);
}

.main-header__messenger:hover,
.main-header__messenger:focus-visible {
	color: var(--color-link-hover);
}

.main-header__messenger-icon {
	width: 1.25rem;
	height: 1.25rem;
}

@media (min-width: 62em) {

	.main-header__messengers {
		display: none;
	}
}

/* ==========================================================================
   Hero slider
   ========================================================================== */

.hero-slider {
	position: relative;
	overflow: hidden;
	margin: 0;
	height: 20rem;
	border-radius: var(--header-radius);
}

.hero-slider__track {
	position: relative;
	width: 100%;
	height: 100%;
}

.hero-slider__slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.375rem;
	opacity: 0;
	transition: opacity 0.7s ease;
}

.hero-slider__slide--active {
	opacity: 1;
}

.hero-slider__photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.hero-slider__photo--mobile {
	display: none;
}

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

	.hero-slider__photo--left,
	.hero-slider__photo--right {
		display: none;
	}

	.hero-slider__photo--mobile {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}

.hero-slider__card {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 10;
	max-width: 85%;
	padding: 1.5rem 1.25rem;
	background-color: rgba(255, 253, 248, 0.95);
	border-radius: 1.25rem;
	box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.1);
	text-align: center;
	transform: translate(-50%, -50%);
}

.hero-slider__heading {
	font-family: var(--font-accent);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.hero-slider__subtitle {
	margin-top: 0.625rem;
	font-family: var(--font-primary);
	font-size: 0.875rem;
	font-weight: 300;
	letter-spacing: 0.04em;
	color: #555;
}

.hero-slider__cta {
	display: inline-block;
	margin-top: 1.5rem;
	padding: 0.625rem 1.5rem;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-white);
	background-color: var(--color-accent);
	border-radius: 1.875rem;
	transition: background-color var(--transition), transform 0.15s ease;
}

.hero-slider__cta:hover {
	background-color: var(--color-accent-hover);
	transform: translateY(-1px);
}

.hero-slider__arrow {
	position: absolute;
	top: 50%;
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	color: var(--color-white);
	background-color: rgba(255, 255, 255, 0.15);
	border: 1.5px solid rgba(255, 255, 255, 0.7);
	border-radius: 50%;
	cursor: pointer;
	backdrop-filter: blur(4px);
	transform: translateY(-50%);
	transition: background-color var(--transition);
}

.hero-slider__arrow:hover {
	background-color: rgba(255, 255, 255, 0.3);
}

.hero-slider__arrow--prev { left: 0.5rem; }
.hero-slider__arrow--next { right: 0.5rem; }

.hero-slider__dots {
	position: absolute;
	bottom: 1.25rem;
	left: 50%;
	z-index: 20;
	display: flex;
	gap: 0.5rem;
	transform: translateX(-50%);
}

.hero-slider__dot {
	width: 0.5rem;
	height: 0.5rem;
	background-color: rgba(255, 255, 255, 0.4);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color var(--transition), transform var(--transition);
}

.hero-slider__dot--active {
	background-color: var(--color-white);
	transform: scale(1.3);
}

@media (min-width: 62em) {

	.hero-slider {
		margin: 0;
		height: 30rem;
	}

	.hero-slider__card {
		max-width: 26.25rem;
		padding: 2.75rem 3rem;
	}

	.hero-slider__heading {
		font-size: 1.875rem;
	}

	.hero-slider__subtitle {
		font-size: 1.125rem;
	}

	.hero-slider__cta {
		padding: 0.875rem 2.25rem;
		font-size: 0.75rem;
	}

	.hero-slider__arrow {
		width: 3rem;
		height: 3rem;
	}

	.hero-slider__arrow--prev { left: 1.25rem; }
	.hero-slider__arrow--next { right: 1.25rem; }
}

@media (max-width: 61.99em) {
	.hero-slider {
		margin-left: 0.625rem;
		margin-right: 0.625rem;
	}
}

/* ==========================================================================
   Features strip
   ========================================================================== */

.features-strip__container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 3.5rem;
	margin: 2.5rem var(--side-pad) 0;
	padding: 1.5rem 3rem;
}

.features-strip__item {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text);
}

.features-strip__icon {
	flex-shrink: 0;
	width: 2.25rem;
	height: 2.25rem;
	color: var(--color-primary);
}

.features-strip__text {
	white-space: nowrap;
}

/* ==========================================================================
   Big typography intro
   ========================================================================== */

.intro-big__container {
	margin: 1.5rem var(--side-pad) 0;
	padding: 4rem 3rem;
	text-align: center;
}

.intro-big__text {
	max-width: 68.75rem;
	margin: 0 auto;
	font-family: var(--font-accent);
	font-size: clamp(2rem, 5vw, 4rem);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.intro-big__img-inline {
	position: relative;
	top: -0.05em;
	display: inline-block;
	height: 1em;
	margin: 0 0.15em;
	overflow: hidden;
	border-radius: 2em;
	vertical-align: middle;
}

.intro-big__img-inline--wide {
	width: 2.8em;
}

.intro-big__img-inline--group {
	width: 3.5em;
	border-radius: 0.3em;
}

.intro-big__img-inline img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.intro-big__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 2rem;
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-primary);
	transition: gap var(--transition);
}

.intro-big__link:hover,
.intro-big__link:focus-visible {
	color: var(--color-link-hover);
	gap: 0.75rem;
}

@media (max-width: 61.99em) {

	.features-strip__container {
		flex-wrap: nowrap;
		justify-content: flex-start;
		gap: 1.5rem;
		margin: 1rem 0.625rem 0;
		padding: 1rem;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.features-strip__item {
		flex-shrink: 0;
		font-size: 0.6875rem;
	}

	.intro-big__container {
		margin: 1rem 0.625rem 0;
		padding: 2rem 1rem;
	}

	.intro-big__text {
		font-size: clamp(1.5rem, 6vw, 2rem);
	}

	.intro-big__img-inline--wide {
		width: 3.5em;
	}

	.intro-big__img-inline--group {
		width: 4em;
	}
}

/* ==========================================================================
   Categories grid
   ========================================================================== */

.categories {
	margin: 2.5rem var(--side-pad) 0;
}

.categories__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

.categories__card {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	border-radius: 1rem;
	text-decoration: none;
}

.categories__img-wrap {
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 1rem;
}

.categories__img {
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	transition: transform 0.5s ease;
}

.categories__card:hover .categories__img {
	transform: scale(1.08);
}

.categories__label {
	position: absolute;
	bottom: 1.5rem;
	left: 50%;
	padding: 0.75rem 1.75rem;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--color-text);
	background-color: var(--color-white);
	border-radius: 2rem;
	box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.1);
	transform: translateX(-50%);
	transition: background-color var(--transition), color var(--transition);
}

.categories__card:hover .categories__label,
.categories__card:focus-visible .categories__label {
	color: var(--color-white);
	background-color: var(--color-link-hover);
}

.categories__img--office {
	background-image: url('https://images.unsplash.com/photo-1497366216548-37526070297c?w=600&h=800&fit=crop');
	background-color: #4a6274;
}

.categories__img--school {
	background-image: url('https://images.unsplash.com/photo-1580582932707-520aed937b7b?w=600&h=800&fit=crop');
	background-color: #5d6d7e;
}

.categories__img--home {
	background-image: url('https://images.unsplash.com/photo-1555041469-a586c61ea9bc?w=600&h=800&fit=crop');
	background-color: #2d4a7a;
}

.categories__img--specialized {
	background-image: url('https://images.unsplash.com/photo-1631049307264-da0ec9d70304?w=600&h=800&fit=crop');
	background-color: #85929e;
}

@media (max-width: 61.99em) {

	.categories {
		margin: 1rem 0.625rem 0;
	}

	.categories__grid {
		grid-template-columns: 1fr 1fr;
		gap: 0.75rem;
	}

	.categories__label {
		bottom: 1rem;
		padding: 0.5rem 1rem;
		font-size: 0.6875rem;
	}
}

/* ==========================================================================
   Products
   ========================================================================== */

.products__container {
	margin: 3rem var(--side-pad) 0;
}

.products__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 2rem;
}

.products__heading {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 300;
	color: var(--color-primary);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.15;
}

.products__heading strong {
	font-weight: 700;
}

.products__view-all {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	transition: gap var(--transition);
	flex-shrink: 0;
}

.products__view-all:hover {
	gap: 0.75rem;
	color: var(--color-link-hover);
}

.products__tabs {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 2rem;
	flex-wrap: wrap;
}

.products__tab {
	padding: 0.625rem 1.5rem;
	border: 1.5px solid rgba(45, 42, 38, 0.15);
	border-radius: 2rem;
	background: transparent;
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--color-text-secondary);
	cursor: pointer;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	transition: all var(--transition);
}

.products__tab:hover {
	border-color: var(--color-link-hover);
	color: var(--color-link-hover);
}

.products__tab--active {
	background: var(--color-primary);
	border-color: var(--color-primary);
	color: var(--color-white);
}

.products__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
}

.products__card-wrap {
	display: flex;
}

.products__card-wrap .catalog-card-v {
	width: 100%;
}

.product-card {
	background: var(--color-white);
	border-radius: var(--header-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	display: block;
	transition: box-shadow 0.3s ease;
}

.product-card:hover {
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.08);
}

.product-card__img-wrap {
	aspect-ratio: 1;
	overflow: hidden;
	background: #fff;
	position: relative;
}

.product-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.5s ease;
}

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

.product-card__wishlist {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	z-index: 2;
	width: 2rem;
	height: 2rem;
	background: rgba(255, 255, 255, 0.9);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ccc;
	padding: 0;
	transition: color var(--transition);
}

.product-card__wishlist:hover {
	color: var(--color-link-hover);
}

.product-card__info {
	padding: 1rem 1.25rem 1.25rem;
}

.product-card__brand {
	font-family: var(--font-primary);
	font-size: 0.6875rem;
	color: var(--color-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: 0.25rem;
}

.product-card__name {
	font-family: var(--font-accent);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--color-text);
	letter-spacing: 0.01em;
	line-height: 1.3;
	margin-bottom: 0.75rem;
	transition: color var(--transition);
}

.product-card:hover .product-card__name {
	color: var(--color-link-hover);
}

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

.product-card__price {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--color-text-secondary);
}

.product-card__btn {
	width: 2rem;
	height: 2rem;
	background: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: 0.5rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: background var(--transition);
}

.product-card__btn:hover {
	background: var(--color-accent-hover);
}

@media (max-width: 61.99em) {

	.products__container {
		margin: 2rem 0.625rem 0;
	}

	.products__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
	}

	.products__heading {
		font-size: 1.5rem;
	}

	.products__tabs {
		overflow-x: auto;
		flex-wrap: nowrap;
		-webkit-overflow-scrolling: touch;
		gap: 0.375rem;
	}

	.products__tab {
		flex-shrink: 0;
		padding: 0.5rem 1rem;
		font-size: 0.75rem;
	}

	.products__grid {
		grid-template-columns: 1fr 1fr;
		gap: 0.75rem;
	}

	.product-card__info {
		padding: 0.75rem;
	}

	.product-card__name {
		font-size: 0.8125rem;
	}
}

/* ==========================================================================
   Shop by Brand
   ========================================================================== */

.brands-section {
	padding: 3.5rem var(--side-pad) 0;
}

.brands-section__container {
	max-width: var(--maxw);
	margin: 0 auto;
}

.brands-section__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.5rem;
}

.brands-section__title {
	font-family: var(--font-accent);
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--color-text);
	margin: 0;
}

.brands-section__nav {
	display: flex;
	gap: 0.5rem;
}

.brands-section__arrow {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid #ddd;
	background: var(--color-white);
	color: var(--color-text);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background var(--transition), border-color var(--transition);
}

.brands-section__arrow:hover {
	background: var(--color-bg);
	border-color: #bbb;
}

.brands-section__arrow:disabled {
	opacity: 0.35;
	cursor: default;
}

.brands-section__track {
	--brand-gap: 1.25rem;
	display: flex;
	gap: var(--brand-gap);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 0.25rem;
	cursor: grab;
	user-select: none;
}
.brands-section__track.is-dragging {
	cursor: grabbing;
	scroll-snap-type: none;
}
.brands-section__track img {
	-webkit-user-drag: none;
}

.brands-section__track::-webkit-scrollbar {
	display: none;
}

.brand-card {
	flex: 0 0 calc((100% - 4 * var(--brand-gap)) / 4.3);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.625rem;
	padding: 1.25rem 1rem;
	background: var(--color-white);
	border-radius: 12px;
	border: 1px solid #eee;
	text-decoration: none;
	color: var(--color-text);
	transition: border-color var(--transition), box-shadow var(--transition);
}

.brand-card:hover {
	border-color: #ccc;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.brand-card__logo {
	width: 100%;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.brand-card__logo img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.brand-card__name-fallback {
	font-family: var(--font-accent);
	font-size: 0.9375rem;
	font-weight: 600;
	text-align: center;
}

.brands-section__eyebrow {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--color-text-muted);
	margin-bottom: 0.25rem;
}

.brand-card__name {
	font-family: var(--font-accent);
	font-size: 0.875rem;
	font-weight: 600;
	text-align: center;
}

.brand-card__country {
	font-size: 0.75rem;
	color: var(--color-text-secondary);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.brand-card__count {
	font-size: 0.75rem;
	color: var(--color-text-muted);
}

@media (max-width: 61.99em) {
	.brand-card {
		flex: 0 0 calc((100% - 1 * var(--brand-gap)) / 1.3);
	}
}

/* Brands Index Page */
.brands-index__wrap {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 2.5rem var(--side-pad) 4rem;
}

.brands-index__head h1 {
	font-family: var(--font-accent);
	font-size: 2.5rem;
	font-weight: 700;
	margin: 0 0 2rem;
}

.brands-index__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.brands-index__grid .brand-card {
	flex: none;
}

@media (max-width: 75em) {
	.brands-index__grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 61.99em) {
	.brands-index__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.brands-index__grid .brand-card {
		flex: none;
	}
}

@media (max-width: 30em) {
	.brands-index__grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Shop the Look
   ========================================================================== */

.shop-look__container {
	display: grid;
	grid-template-columns: 1fr 23.75rem;
	grid-template-rows: minmax(0, 1fr);
	gap: 0;
	overflow: hidden;
	height: 32.5rem;
	margin: 2.5rem var(--side-pad) 0;
	border-radius: var(--header-radius);
	box-shadow: 0 0.125rem 1.25rem rgba(0, 0, 0, 0.06);
}

.shop-look--photo-only .shop-look__container {
	grid-template-columns: 1fr;
	height: auto;
}

.shop-look__photo {
	position: relative;
	overflow: hidden;
}

.shop-look__photo-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.shop-look__marker {
	position: absolute;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	background-color: rgba(255, 255, 255, 0.25);
	border: 2px solid rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	cursor: pointer;
	backdrop-filter: blur(4px);
	transition: transform var(--transition), background-color var(--transition);
}

.shop-look__marker-dot {
	display: block;
	width: 0.5rem;
	height: 0.5rem;
	background-color: var(--color-white);
	border-radius: 50%;
}

.shop-look__marker:hover,
.shop-look__marker--active {
	background-color: rgba(45, 42, 38, 0.6);
	border-color: var(--color-white);
	transform: scale(1.2);
}

.shop-look__marker::before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	animation: shopLookPulse 2s ease-out infinite;
}

.shop-look__marker--active::before {
	animation: none;
}


@keyframes shopLookPulse {
	0% {
		opacity: 1;
		transform: scale(1);
	}
	100% {
		opacity: 0;
		transform: scale(2);
	}
}

.shop-look__card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	box-sizing: border-box;
	padding: 1.5rem 1.5rem 1.25rem;
	background-color: var(--color-white);
}

.shop-look__card-inner {
	width: 100%;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	transition: opacity 0.3s ease;
}

.shop-look__card-inner--fading {
	opacity: 0;
}

.shop-look__badge {
	display: inline-block;
	margin-bottom: 1rem;
	padding: 0.25rem 0.75rem;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-white);
	background-color: var(--color-primary);
	border-radius: 1.25rem;
}

.shop-look__brand {
	margin-bottom: 0.375rem;
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	color: var(--color-text-muted);
}

.shop-look__name {
	display: block;
	margin-bottom: 1.25rem;
	font-family: var(--font-accent);
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--color-primary);
	text-decoration: none;
}

.shop-look__name:hover {
	color: var(--color-link-hover, #09276a);
}

.shop-look__product-img {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	margin: 0 auto 1rem;
	overflow: hidden;
	background-color: #ffffff;
	border-radius: 0.75rem;
}

.shop-look__product-img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.shop-look__wishlist {
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	color: #ccc;
	background: none;
	border: 0;
	cursor: pointer;
	transition: color var(--transition);
}

.shop-look__wishlist:hover,
.shop-look__wishlist:focus-visible {
	color: var(--color-link-hover);
}

.shop-look__footer {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	width: 100%;
	padding-top: 1rem;
	border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.shop-look__price {
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--color-text);
}

.shop-look__btn {
	flex: 0 0 auto;
	width: auto;
	height: auto;
	display: flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.625rem 1rem;
	font-family: var(--font-primary);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--color-white);
	background-color: var(--color-accent);
	border: 0;
	border-radius: 0.625rem;
	cursor: pointer;
	transition: background-color var(--transition);
}

.shop-look__btn:hover,
.shop-look__btn:focus-visible {
	background-color: var(--color-accent-hover);
}

@media (max-width: 61.99em) {

	.shop-look__container {
		grid-template-columns: 1fr;
		height: auto;
		margin: 1rem 0.625rem 0;
	}

	.shop-look__photo {
		height: 18rem;
	}

	.shop-look__card {
		padding: 1.5rem;
	}

	.shop-look__name {
		font-size: 1.125rem;
	}

	.shop-look__product-img {
		width: 8rem;
		height: 6rem;
	}
}

/* ==========================================================================
   Portfolio
   ========================================================================== */

.home-projects__container {
	margin: 3rem var(--side-pad) 0;
	padding: 3.5rem 0 0;
}

.home-projects__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 2rem;
}

.home-projects__heading {
	margin: 0;
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 300;
	color: var(--color-primary);
}
.home-projects__heading strong {
	font-weight: 700;
}

.home-projects__all {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text);
	text-decoration: none;
	white-space: nowrap;
}
.home-projects__all:hover {
	color: var(--color-link-hover);
}

.home-projects__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}

@media (max-width: 61.99em) {
	.home-projects__container {
		margin: 2rem 0.625rem 0;
	}

	.home-projects__heading {
		font-size: 1.5rem;
	}

	.home-projects__grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   About
   ========================================================================== */

.about {
	margin: 3rem var(--side-pad) 0;
}

.about__inner {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 3rem;
	align-items: start;
}

.about__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 1.25rem;
}

.about__title {
	font-family: var(--font-accent);
	font-weight: 700;
	font-size: clamp(28px, 3.2vw, 40px);
	line-height: 1.1;
	color: var(--color-text);
	margin: 0 0 1.25rem;
}

.about__caption {
	font-family: 'JetBrains Mono', monospace;
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.about__lead {
	font-size: clamp(20px, 2vw, 24px);
	line-height: 1.4;
	color: var(--color-text);
	margin-top: 45px;
}

.about__lead p {
	margin: 0 0 1rem;
}

.about__lead .accent,
.about__lead a {
	color: var(--color-accent, #ab0733);
}

.about__rule {
	border: 0;
	border-top: 1px solid var(--rule, #e7e4dd);
	margin: 1.75rem 0;
}

.about__body {
	color: var(--color-text-secondary, #555);
	font-size: 16px;
	line-height: 1.7;
}

.about__body p {
	margin: 0 0 1rem;
}

.about__body p:last-child {
	margin-bottom: 0;
}

.about__body strong {
	color: var(--color-text);
	font-weight: 600;
}

@media (max-width: 61.99em) {
	.about {
		margin: 2rem 0.625rem 0;
	}

	.about__inner {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}
}

/* ==========================================================================
   Process / Approach
   ========================================================================== */

.process {
	margin: 80px var(--side-pad) 0;
}

.process__inner {
	background: #2d2a26;
	color: #f2efe9;
	border-radius: 20px;
	padding: 2.5rem;
	box-sizing: border-box;
}

.process__head {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 2rem;
	align-items: start;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	padding-bottom: 2rem;
	margin-bottom: 2rem;
}

.process__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #bdb6ab;
	margin-bottom: 1rem;
}

.process__title {
	font-family: var(--font-accent);
	font-weight: 400;
	font-size: clamp(28px, 3.4vw, 40px);
	line-height: 1.1;
	margin: 0;
	color: #fff;
}

.process__intro {
	color: #cfc8bd;
	line-height: 1.6;
	margin: 0;
}

.process__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
}

.process__step {
	padding: 0 1.5rem;
	border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.process__step:first-child {
	padding-left: 0;
	border-left: 0;
}

.process__ico {
	color: #f2efe9;
	margin-bottom: 1.5rem;
}

.process__ico svg {
	width: 34px;
	height: 34px;
}

.process__num {
	font-family: 'JetBrains Mono', monospace;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #bdb6ab;
	margin-bottom: 0.6rem;
}

.process__step-title {
	font-family: var(--font-accent);
	font-weight: 700;
	font-size: 1.25rem;
	line-height: 1.2;
	color: #fff;
	margin: 0 0 0.75rem;
}

.process__step-text {
	color: #cfc8bd;
	font-size: 14px;
	line-height: 1.6;
	margin: 0;
}

@media (max-width: 61.99em) {
	.process {
		margin: 80px 0.625rem 0;
	}

	.process__inner {
		padding: 1.75rem;
	}

	.process__head {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.process__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.75rem 0;
	}

	.process__step {
		padding: 0 1rem;
	}

	.process__step:nth-child(odd) {
		padding-left: 0;
		border-left: 0;
	}
}

/* ==========================================================================
   Blog preview
   ========================================================================== */

.blog-preview__container {
	margin: 3rem var(--side-pad) 0;
	padding: 3.5rem 0 0;
}

.blog-preview__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 2.5rem;
}

.blog-preview__heading {
	margin: 0;
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 300;
	color: var(--color-primary);
}
.blog-preview__heading strong {
	font-weight: 700;
}

.blog-preview__all {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text);
	text-decoration: none;
	white-space: nowrap;
}
.blog-preview__all:hover {
	color: var(--color-link-hover);
}

.blog-preview__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.blog-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	color: inherit;
	text-decoration: none;
}

.blog-card__img-wrap {
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.blog-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.blog-card:hover .blog-card__img,
.blog-card:focus-visible .blog-card__img {
	transform: scale(1.05);
}

.blog-card__body {
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.blog-card__meta {
	margin-bottom: 0.75rem;
	font-family: 'JetBrains Mono', monospace;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.blog-card__title {
	font-family: var(--font-accent);
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--color-text);
	margin: 0 0 1rem;
	transition: color var(--transition);
}

.blog-card:hover .blog-card__title,
.blog-card:focus-visible .blog-card__title {
	color: var(--color-link-hover);
}

.blog-card__more {
	display: inline-block;
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px solid var(--rule, #e7e4dd);
	font-family: 'JetBrains Mono', monospace;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text);
}
.blog-card:hover .blog-card__more {
	color: var(--color-link-hover);
}

@media (max-width: 61.99em) {

	.blog-preview__container {
		margin: 2rem 0.625rem 0;
	}

	.blog-preview__heading {
		font-size: 1.5rem;
	}

	.blog-preview__grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
}

/* ==========================================================================
   FAQ
   ========================================================================== */

.faq__container {
	margin: 3rem var(--side-pad) 0;
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	gap: 4rem;
	align-items: start;
	padding: 3.5rem 0;
}

.faq__left {
	position: sticky;
	top: 7.5rem;
}

.faq__heading {
	font-family: var(--font-accent);
	font-size: 2.5rem;
	font-weight: 300;
	color: var(--color-primary);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1.15;
	margin-bottom: 1.25rem;
}

.faq__heading strong {
	font-weight: 700;
}

.faq__desc {
	font-family: var(--font-primary);
	font-size: 0.9375rem;
	color: var(--color-text-secondary);
	line-height: 1.7;
	margin-bottom: 1.5rem;
}

.faq__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	transition: gap var(--transition);
}

.faq__link:hover {
	gap: 0.75rem;
	color: var(--color-link-hover);
}

.faq__list {
	display: flex;
	flex-direction: column;
}

.faq__item {
	border-bottom: 1px solid rgba(0,0,0,0.08);
}

.faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 1.5rem 0;
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--font-accent);
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--color-text);
	text-align: left;
	letter-spacing: 0.01em;
	transition: color var(--transition);
}

.faq__question:hover {
	color: var(--color-link-hover);
}

.faq__icon {
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	border: 1.5px solid rgba(0,0,0,0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-left: 1rem;
	transition: border-color var(--transition);
}

.faq__question:hover .faq__icon {
	border-color: var(--color-link-hover);
}

.faq__icon svg {
	width: 0.875rem;
	height: 0.875rem;
	color: var(--color-text);
	transition: transform 0.3s ease;
}

.faq__item--open .faq__icon {
	border-color: var(--color-link-hover);
}

.faq__item--open .faq__icon svg {
	transform: rotate(45deg);
}

.faq__answer {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.35s ease;
}

.faq__item--open .faq__answer {
	max-height: 18.75rem;
}

.faq__answer-inner {
	padding: 0 0 1.5rem;
	font-family: var(--font-primary);
	font-size: 0.875rem;
	color: var(--color-text-secondary);
	line-height: 1.75;
	max-width: 90%;
}

@media (max-width: 61.99em) {

	.faq__container {
		margin: 2rem 0.625rem 0;
		grid-template-columns: 1fr;
		gap: 2rem;
		padding: 2rem 0;
	}

	.faq__left {
		position: static;
	}

	.faq__heading {
		font-size: 1.75rem;
	}

	.faq__question {
		font-size: 0.9375rem;
	}
}

/* ==========================================================================
   Contact
   ========================================================================== */

.contact__container {
	margin: 3rem var(--side-pad) 0;
	display: grid;
	grid-template-columns: 23.75rem 1fr;
	gap: 0;
	border-radius: var(--header-radius);
	overflow: hidden;
	box-shadow: 0 0.125rem 1.25rem rgba(0, 0, 0, 0.06);
	height: 27.5rem;
}

.contact__info {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 2.5rem;
	color: var(--color-white);
	overflow: hidden;
}

.contact__info-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 1;
}

.contact__info-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(9, 39, 106, 0.85);
	z-index: 2;
}

.contact__info-content {
	position: relative;
	z-index: 3;
}

.contact__heading {
	font-family: var(--font-accent);
	font-size: 1.625rem;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 2rem;
	line-height: 1.2;
}

.contact__heading strong {
	font-weight: 700;
}

.contact__item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.5rem 0;
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
	transition: color var(--transition);
}

.contact__item:hover {
	color: var(--color-white);
}

.contact__icon {
	width: 1rem;
	height: 1rem;
	color: rgba(255, 255, 255, 0.45);
	flex-shrink: 0;
}

.contact__hours {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	font-size: 0.8125rem;
	color: rgba(255, 255, 255, 0.55);
	line-height: 1.7;
}

.contact__hours-label {
	font-size: 0.6875rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: 0.25rem;
	color: rgba(255, 255, 255, 0.35);
}

.contact__socials {
	display: flex;
	gap: 0.625rem;
	margin-top: 1.5rem;
}

.contact__social {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.125rem;
	height: 2.125rem;
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 0.5rem;
	color: rgba(255, 255, 255, 0.5);
	text-decoration: none;
	transition: border-color var(--transition), color var(--transition);
}

.contact__social:hover {
	border-color: rgba(255, 255, 255, 0.5);
	color: var(--color-white);
}

.contact__map {
	width: 100%;
	height: 100%;
	border: none;
	display: block;
	filter: saturate(0.25) contrast(1.05);
	transition: filter 0.3s ease;
}

.contact__map:hover {
	filter: saturate(0.5) contrast(1.05);
}

@media (max-width: 61.99em) {

	.contact__container {
		margin: 2rem 0.625rem 0;
		grid-template-columns: 1fr;
		height: auto;
	}

	.contact__info {
		padding: 2rem 1.5rem;
	}

	.contact__map {
		height: 16rem;
	}

	.contact__heading {
		font-size: 1.375rem;
	}
}

/* ==========================================================================
   Site main / generic content
   ========================================================================== */

.site-main {
	max-width: var(--maxw);
	margin: 0 auto;
}

.entry {
	max-width: 800px;
	margin: 0 auto;
	padding: 2rem var(--side-pad, 20px) 4rem;
}

body.is-for-clients .entry {
	max-width: 64rem;
}

.entry__head {
	margin-bottom: 1.75rem;
}

.entry__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.75rem;
}

.entry__title {
	font-family: var(--font-accent);
	font-weight: 700;
	color: var(--color-text);
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.1;
	margin: 0;
}

.entry__cover {
	margin: 1.75rem 0;
	border-radius: 16px;
	overflow: hidden;
}

.entry__cover img {
	width: 100%;
	height: auto;
	display: block;
}

.entry__svc-ico {
	color: var(--color-text);
	margin-bottom: 0.75rem;
}
.entry__svc-ico svg {
	width: 40px;
	height: 40px;
}

.entry-content {
	color: var(--color-text);
	font-family: var(--font-primary);
	font-size: 18px;
	line-height: 1.7;
	overflow-wrap: break-word;
}

.entry-content > * + * {
	margin-top: 1.1em;
}

.entry-content h2 {
	font-family: var(--font-accent);
	font-weight: 700;
	font-size: 1.6em;
	line-height: 1.2;
	margin-top: 2em;
}

.entry-content h3 {
	font-family: var(--font-accent);
	font-weight: 700;
	font-size: 1.3em;
	line-height: 1.25;
	margin-top: 1.6em;
}

.entry-content a {
	color: var(--color-accent, #ab0733);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.entry-content ul,
.entry-content ol {
	padding-left: 1.4em;
}

.entry-content ul {
	list-style: none;
}

.entry-content ul li::before {
	content: '';
	display: inline-block;
	width: 0.45em;
	height: 0.45em;
	background: var(--color-accent);
	border-radius: 50%;
	margin-right: 0.6em;
	margin-left: -1.05em;
	vertical-align: middle;
}

.entry-content ol {
	list-style: none;
	counter-reset: ol-counter;
}

.entry-content ol li {
	counter-increment: ol-counter;
}

.entry-content ol li::before {
	content: counter(ol-counter) ". ";
	color: var(--color-accent);
	font-weight: 700;
}

.entry-content li + li {
	margin-top: 0.4em;
}

.entry-content img {
	max-width: 100%;
	height: auto;
	border-radius: 12px;
}

.entry-content blockquote {
	margin: 1.6em 0;
	padding: 0.4em 0 0.4em 1.2em;
	border-left: 3px solid var(--rule, #e7e4dd);
	color: var(--color-text-secondary, #555);
	font-style: italic;
}

.entry-content hr {
	border: 0;
	border-top: 1px solid var(--rule, #e7e4dd);
	margin: 2em 0;
}

.entry-content table {
	width: 100%;
	border-collapse: collapse;
}

.entry-content th,
.entry-content td {
	border: 1px solid var(--rule, #e7e4dd);
	padding: 0.6em 0.8em;
	text-align: left;
}

.entry-content thead th,
.entry-content th {
	background: var(--color-bg);
	font-weight: 600;
	color: var(--color-text);
}

.entry-content .cat-row td {
	background: var(--color-bg);
	font-weight: 700;
	color: var(--color-text);
}

.entry-content dl {
	margin: 1.25rem 0;
}

.entry-content dt {
	font-family: var(--font-primary);
	font-weight: 600;
	color: var(--color-text);
	margin-top: 1rem;
}

.entry-content dl > dt:first-child {
	margin-top: 0;
}

.entry-content dd {
	margin: 0.25rem 0 0;
	padding-left: 1rem;
	color: var(--color-text-secondary);
	border-left: 2px solid var(--rule);
}

.entry-content .form-field {
	overflow-wrap: anywhere;
}

.entry-content .wf-field {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0.85rem 0;
}

.entry-content .wf-line {
	flex: 1 1 8rem;
	min-height: 1.3em;
	border-bottom: 1px solid var(--rule);
}

@media (max-width: 61.99em) {
	.entry-content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		white-space: nowrap;
	}

	.entry-content td,
	.entry-content th {
		white-space: normal;
	}
}

/* ==========================================================================
   Site footer
   ========================================================================== */

.site-footer {
	margin-top: 4rem;
	padding: 0 0 1rem;
	background-color: var(--color-bg);
	border-top: none;
	color: var(--color-text-secondary);
	font-size: 0.875rem;
}

.site-footer__main {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 0;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 3.5rem var(--side-pad);
	background-color: var(--color-white);
	border-radius: var(--header-radius);
	box-shadow: 0 0.125rem 1.25rem rgba(0, 0, 0, 0.04);
}

.footer-brand {
	padding-right: 3rem;
	border-right: 1px solid rgba(0, 0, 0, 0.08);
}

.footer-brand__logo-link {
	display: block;
	text-decoration: none;
}

.footer-brand__logo-img {
	display: block;
	width: auto;
	height: 2.75rem;
	margin-bottom: 1.75rem;
}

.footer-brand__contact {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	padding: 0.4375rem 0;
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0.02em;
	color: var(--color-text);
	text-decoration: none;
	transition: color var(--transition);
}

.footer-brand__contact--phone {
	font-weight: 700;
	text-transform: uppercase;
}

.footer-brand__contact:hover {
	color: var(--color-link-hover);
}

.footer-brand__contact-icon {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--color-primary);
}

.footer-brand__address {
	margin-top: 1.25rem;
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--color-text-muted);
}

.footer-brand__social {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-top: 1.75rem;
}

.footer-brand__social-link {
	display: flex;
	align-items: center;
	color: var(--color-text-secondary);
	transition: color var(--transition);
}

.footer-brand__social-link:hover,
.footer-brand__social-link:focus-visible {
	color: var(--color-link-hover);
}

.footer-brand__social-icon {
	width: 1.5rem;
	height: 1.5rem;
}

.footer-col {
	padding-left: 3rem;
}

.footer-col__label {
	display: block;
	margin-bottom: 1.5rem;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.footer-col__list {
	list-style: none;
}

.footer-col__list li {
	padding: 0.375rem 0;
}

.footer-col__list a {
	font-size: 0.875rem;
	font-weight: 400;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-text);
	transition: color var(--transition);
}

.footer-col__list a:hover {
	color: var(--color-link-hover);
}

.site-footer__bottom {
	border-top: none;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 1.25rem var(--side-pad);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.site-footer__copy-wrap {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.site-footer__copy {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
}

.site-footer__credit {
	font-size: 0.75rem;
	color: var(--color-text-muted);
	text-decoration: none;
	transition: color var(--transition);
}

.site-footer__credit:hover {
	color: var(--color-link-hover);
}

.site-footer__legal {
	display: flex;
	gap: 1.5rem;
}

.site-footer__legal a {
	font-size: 0.8125rem;
	color: var(--color-text-muted);
	text-decoration: none;
	transition: color var(--transition);
}

.site-footer__legal a:hover {
	color: var(--color-link-hover);
}

@media (max-width: 61.99em) {

	.site-footer__main {
		grid-template-columns: 1fr;
		gap: 2.5rem;
		margin: 0 auto;
		padding: 2.5rem 1.5rem;
	}

	.footer-brand {
		padding-right: 0;
		padding-bottom: 2.5rem;
		border-right: 0;
		border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	}

	.footer-col {
		padding-left: 0;
	}

	.site-footer__bottom {
		flex-direction: column;
		gap: 1rem;
		padding: 1.25rem 1.5rem;
		text-align: center;
	}
}

/* ==========================================================================
   Product Page
   ========================================================================== */

/* --- Breadcrumbs --- */
.breadcrumbs {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 1rem var(--side-pad) 0.75rem;
    font-family: var(--font-primary);
    font-size: 0.8125rem;
    color: var(--color-text-muted);
}

.breadcrumbs ol {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.1em;
}

.breadcrumbs li + li::before {
    content: "›";
    margin-right: 0.5em;
    color: var(--color-text-muted);
}

.breadcrumbs a {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color var(--transition);
}

.breadcrumbs a:hover {
    color: var(--color-link-hover);
}

.breadcrumbs__current {
    color: var(--color-primary);
}

/* --- Layout --- */
.product-page {
    display: grid;
    grid-template-columns: 1fr 28rem;
    gap: 3rem;
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 0 var(--side-pad) 3rem;
}

.product-page__left {
    min-width: 0;
}

.product-page__right {
    position: sticky;
    top: 7.5rem;
    align-self: start;
}

/* --- Gallery --- */
.gallery {
    display: grid;
    grid-template-columns: 6.5rem 1fr;
    gap: 1.25rem;
    align-items: start;
}

.gallery__thumbs {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 0;
    height: 56vh;
}

.gallery__thumbs-btn {
    flex: 0 0 auto;
    width: 6.5rem;
    height: 1.75rem;
    border: 0;
    background: var(--color-white);
    border-radius: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--color-text);
    transition: background var(--transition), color var(--transition), opacity var(--transition);
}

.gallery__thumbs-btn:hover {
    background: var(--color-primary);
    color: #fff;
}

.gallery__thumbs-btn:disabled {
    opacity: 0.3;
    cursor: default;
    background: var(--color-white);
    color: var(--color-text);
}

.gallery__thumbs-viewport {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    margin: 0.5rem 0;
    width: 6.5rem;
}

.gallery__thumbs-track {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    transition: transform 0.28s ease;
}

.gallery__thumb {
    flex: 0 0 6.5rem;
    width: 6.5rem;
    height: 6.5rem;
    border-radius: 0.625rem;
    overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color var(--transition);
}

.gallery__thumb--active,
.gallery__thumb:hover {
    border-color: var(--color-primary);
}

.gallery__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gallery__main {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    max-height: 70vh;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.gallery__main img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.gallery__zoom {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    background: var(--color-white);
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform var(--transition);
    font-size: 1.125rem;
    color: var(--color-primary);
}

.gallery__zoom:hover {
    transform: scale(1.1);
}

.gallery__counter {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    background: rgba(255, 255, 255, 0.92);
    padding: 0.25rem 0.75rem;
    border-radius: 999px;
    font-family: var(--font-primary);
    font-size: 0.75rem;
    color: var(--color-primary);
    backdrop-filter: blur(4px);
}

/* --- Shared Card Style --- */
.product-dims,
.product-specs,
.product-features,
.product-desc {
    background: var(--color-white);
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.04);
    margin-top: 1.5rem;
}

.card__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.card__title {
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 1.25rem;
    color: var(--color-primary);
}

.card__eyebrow {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--color-text-muted);
}

/* --- Specifications --- */
.product-specs__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 2.5rem;
}

/* --- Dimensions --- */
.product-dims__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.product-dims__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
    text-align: center;
    border-right: 1px solid #eee;
    padding: 1rem 0;
}

.product-dims__item:last-child {
    border-right: none;
}

.product-dims__icon {
    width: 2.375rem;
    height: 2.375rem;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-dims__icon svg {
    width: 100%;
    height: 100%;
}

.product-dims__value {
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 1.4rem;
    color: var(--color-primary);
    line-height: 1.2;
}

.product-dims__unit {
    font-family: var(--font-primary);
    font-size: 0.8125rem;
    color: var(--color-text-muted);
}

.product-dims__label {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
}

.product-dims__note {
	margin: 1.25rem 0 0;
	padding-top: 1.25rem;
	border-top: 1px solid var(--rule);
	font-family: var(--font-sans);
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--ink-2);
	text-align: center;
}

/* --- Specifications --- */
.product-specs__row {
    display: grid;
    grid-template-columns: 8.75rem 1fr;
    padding: 1.125rem 0;
    border-bottom: 1px solid #eee;
    align-items: baseline;
}

.product-specs__row:last-child {
    border-bottom: none;
}

.product-specs__label {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    padding-top: 0.125rem;
}

.product-specs__value {
    font-family: var(--font-primary);
    font-size: 0.9rem;
    color: var(--color-primary);
    line-height: 1.5;
}

.product-dims__text,
.product-specs__text {
    padding: 0 2rem 2rem;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    line-height: 1.7;
    color: var(--color-text);
}

/* --- Features --- */
.product-features__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid #eee;
}

.product-features__item {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1.5rem 1.25rem;
    border-right: 1px solid #eee;
}

.product-features__item:last-child {
    border-right: none;
}

.product-features__icon {
    width: 2.5rem;
    height: 2.5rem;
    color: var(--color-primary);
}

.product-features__icon svg {
    width: 100%;
    height: 100%;
}

.product-features__title {
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 1.0625rem;
    color: var(--color-primary);
}

.product-features__text {
    font-family: var(--font-primary);
    font-size: 0.84rem;
    color: var(--color-text-muted);
    line-height: 1.55;
}

/* --- Description --- */
.product-desc__grid {
    display: grid;
    grid-template-columns: 7fr 3fr;
    gap: 2rem;
}

.product-desc__text {
    font-family: var(--font-primary);
    font-size: 0.9375rem;
    color: #53524e;
    line-height: 1.7;
}

.product-desc__text p {
    margin: 0 0 1rem;
}

.product-desc__text p:last-child {
    margin-bottom: 0;
}

.product-desc__text p:first-child::first-letter {
    font-family: var(--font-accent);
    font-weight: 300;
    font-size: 3.4rem;
    float: left;
    line-height: 0.8;
    margin-right: 0.375rem;
    margin-top: 0.25rem;
    color: var(--color-primary);
}

.product-desc__photo {
    aspect-ratio: 4 / 3;
    border-radius: 12px;
    border: 1px solid #eee;
    overflow: hidden;
}

.product-desc__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.product-desc__brand-logo-float {
    float: right;
    width: 160px;
    padding: 20px;
    margin: 0 0 16px 24px;
    background: #f5f0e8;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-desc__brand-logo-float img {
    max-width: 120px;
    max-height: 60px;
    object-fit: contain;
}

/* --- Product Info (Right Sidebar) --- */
.product-info {
    background: var(--color-white);
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.04);
}

.product-info__meta {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    margin-bottom: 0.5rem;
}

.product-info__brand-link {
    color: var(--color-text-muted);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color var(--transition);
}

.product-info__brand-link:hover {
    color: var(--color-link-hover);
}

.product-info__dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--color-text-muted);
    flex-shrink: 0;
}

.product-info__name {
    font-family: var(--font-accent);
    font-weight: 700;
    font-size: 1.625rem;
    color: var(--color-primary);
    line-height: 1.05;
}

.product-info__variant {
    font-family: var(--font-accent);
    font-weight: 300;
    font-size: 0.925rem;
    color: var(--color-primary);
    margin-bottom: 1.25rem;
}

/* Price Block */
.product-info__price-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: 1.125rem;
    border: 1px solid #eee;
    border-radius: 12px;
    background: #fbfaf6;
    margin-bottom: 1.25rem;
}

.product-info__price {
    font-family: var(--font-accent);
    font-weight: 600;
    font-size: 1.25rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--color-primary);
}

.product-info__price-note {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    color: var(--color-text-muted);
    text-align: right;
    max-width: 9rem;
}

/* Actions */
.product-info__actions {
    display: grid;
    grid-template-columns: 6.875rem 1fr 2.75rem;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.product-info__qty {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    border: 1px solid #ddd;
    border-radius: 0.625rem;
    height: 2.75rem;
    overflow: hidden;
}

.product-info__qty-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    color: var(--color-text-secondary);
    transition: background-color var(--transition);
    padding: 0;
}

.product-info__qty-btn:hover {
    background-color: #f3f1ea;
}

.product-info__qty-input {
    text-align: center;
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 0.9375rem;
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    background: none;
    width: 100%;
    color: var(--color-primary);
    -moz-appearance: textfield;
}

.product-info__qty-input::-webkit-outer-spin-button,
.product-info__qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.product-info__cart-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
    border-radius: 0.625rem;
    height: 2.75rem;
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color var(--transition);
    letter-spacing: 0.02em;
}

.product-info__cart-btn:hover {
    background-color: var(--color-link-hover);
}

.product-info__wish-btn {
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ddd;
    border-radius: 0.625rem;
    background: none;
    cursor: pointer;
    transition: border-color var(--transition), color var(--transition);
    color: var(--color-text-muted);
    font-size: 1.125rem;
    flex-shrink: 0;
}

.product-info__wish-btn:hover {
    border-color: var(--color-primary);
    color: var(--color-accent);
}

/* Details Table */
.product-info__details {
    border-top: 1px solid #eee;
    padding-top: 1.125rem;
    margin-bottom: 1.25rem;
}

.product-info__details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 1.5rem;
}

.product-info__detail-row {
    display: grid;
    grid-template-columns: 6.25rem 1fr;
    padding: 0.5625rem 0;
    border-bottom: 1px solid #f5f4f0;
    align-items: baseline;
}

.product-info__detail-row:last-child {
    border-bottom: none;
}

.product-info__detail-label {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
}

.product-info__detail-value {
    font-family: var(--font-primary);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-primary);
}

.product-info__detail-value a {
    color: var(--color-primary);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color var(--transition);
}

.product-info__detail-value a:hover {
    color: var(--color-link-hover);
}

/* Messengers */
.product-info__messengers {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.product-info__messenger-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid #ddd;
    border-radius: 0.625rem;
    padding: 0.75rem;
    font-family: var(--font-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-primary);
    background: none;
    cursor: pointer;
    text-decoration: none;
    transition: border-color var(--transition), color var(--transition);
}

.product-info__messenger-btn:hover {
    border-color: var(--color-primary);
    color: var(--color-link-hover);
}

.product-info__messenger-btn svg {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

/* Lead Time */
.product-info__lead-time {
    padding-top: 1.125rem;
    font-family: var(--font-primary);
    font-size: 0.75rem;
    color: var(--color-text-muted);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* --- Related Products --- */
.related-products {
    margin-top: 4rem;
    max-width: var(--maxw);
    margin-left: auto;
    margin-right: auto;
    padding: 0 var(--side-pad) 3rem;
}

.related-products__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.related-products__title {
    font-family: var(--font-accent);
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--color-primary);
}

.related-products__link {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-primary);
    text-decoration: none;
    transition: color 0.15s;
}

.related-products__link:hover {
    color: var(--color-link-hover);
}

.related-products .catalog-grid {
    grid-template-columns: repeat(4, 1fr);
}

/* --- Product Page Mobile --- */
@media (max-width: 61.99em) {

    .breadcrumbs {
        padding: 0.75rem 0.625rem 0.5rem;
        font-size: 0.75rem;
    }

    .product-page {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 0 0.625rem 2rem;
    }

    .product-page__right {
        position: static;
    }

    .gallery {
        grid-template-columns: 4.5rem 1fr;
        gap: 0.75rem;
    }

    .gallery__thumbs-btn {
        width: 4.5rem;
    }

    .gallery__thumbs-viewport {
        width: 4.5rem;
    }

    .gallery__thumb {
        flex: 0 0 4.5rem;
        width: 4.5rem;
        height: 4.5rem;
    }

    .product-dims,
    .product-specs,
    .product-features,
    .product-desc {
        padding: 1.5rem;
        margin-top: 1rem;
    }

    .product-dims__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }

    .product-specs__grid {
        grid-template-columns: 1fr;
    }

    .product-info__details-grid {
        grid-template-columns: 1fr;
    }

    .product-features__grid {
        grid-template-columns: 1fr;
    }

    .product-features__item {
        border-right: none;
        border-bottom: 1px solid #eee;
        padding: 1.25rem 0;
    }

    .product-features__item:last-child {
        border-bottom: none;
    }

    .product-desc__grid {
        grid-template-columns: 1fr;
    }

    .product-info {
        padding: 1.5rem;
    }

    .product-info__price-block {
        flex-direction: column;
        align-items: flex-start;
    }

    .product-info__price-note {
        text-align: left;
        max-width: none;
    }

    .product-info__actions {
        display: flex;
        flex-wrap: wrap;
        gap: 0.625rem;
    }

    .product-info__cart-btn {
        order: -1;
        width: 100%;
    }

    .product-info__qty {
        width: 7.5rem;
    }

    .related-products {
        margin-top: 2rem;
        padding: 0 0.625rem 2rem;
    }

    .related-products .catalog-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
}

/* --- Lightbox --- */
.gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.92);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
    animation: lightboxFadeIn 0.2s ease;
}

.gallery-lightbox img {
    max-width: 90vw;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 4px;
}

.gallery-lightbox__close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 2.5rem;
    height: 2.5rem;
    background: rgba(255, 255, 255, 0.15);
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gallery-lightbox__close:hover {
    background: rgba(255, 255, 255, 0.3);
}

@keyframes lightboxFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

body.is-lightbox-open {
    overflow: hidden;
}

.gallery-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2.75rem;
    height: 2.75rem;
    background: rgba(9, 39, 106, 0.55);
    border: none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.16s;
    z-index: 2;
}

.gallery-lightbox__nav:hover {
    background: rgba(9, 39, 106, 0.8);
}

.gallery-lightbox__nav svg {
    width: 1.25rem;
    height: 1.25rem;
}

.gallery-lightbox__nav--prev {
    left: 1.25rem;
}

.gallery-lightbox__nav--next {
    right: 1.25rem;
}

.gallery-lightbox__counter {
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.7);
}

.gallery-lightbox__thumbs {
    position: absolute;
    bottom: 3.25rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.375rem;
    z-index: 2;
}

.gallery-lightbox__thumb {
    width: 3rem;
    height: 3rem;
    border: 2px solid transparent;
    border-radius: 6px;
    padding: 0;
    background: none;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.16s, border-color 0.16s;
    overflow: hidden;
    flex-shrink: 0;
}

.gallery-lightbox__thumb:hover {
    opacity: 0.85;
}

.gallery-lightbox__thumb--active {
    opacity: 1;
    border-color: #fff;
}

.gallery-lightbox__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gallery-lightbox__thumbs + .gallery-lightbox__counter {
    bottom: 0.75rem;
}

/* ==========================================================================
   Search Overlay
   ========================================================================== */

body.is-search-open {
    overflow: hidden;
}

.search-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

.search-overlay.active {
    opacity: 1;
    visibility: visible;
}

.search-overlay__inner {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    max-width: 42rem;
    height: 100%;
    background: var(--color-bg);
    padding: 2.5rem;
    overflow-y: auto;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.08);
    transform: translateX(100%);
    transition: transform 0.3s ease;
}

.search-overlay.active .search-overlay__inner {
    transform: translateX(0);
}

.search-overlay__close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: none;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color var(--transition);
}

.search-overlay__close:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.search-overlay__title {
    font-family: var(--font-accent);
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-primary);
    margin-bottom: 1.25rem;
}

.search-overlay__bar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: var(--color-white);
    border: 1.5px solid #ddd;
    border-radius: 2rem;
    padding: 0.875rem 1.25rem;
    transition: border-color var(--transition);
}

.search-overlay__bar:focus-within {
    border-color: var(--color-primary);
}

.search-overlay__icon {
    flex-shrink: 0;
    color: var(--color-text-muted);
}

.search-overlay__input {
    border: none;
    outline: none;
    background: none;
    width: 100%;
    font-family: var(--font-primary);
    font-size: 0.9375rem;
    color: var(--color-primary);
}

.search-overlay__input::placeholder {
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.8125rem;
}

.search-overlay__section-label {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-text-muted);
    margin: 1.5rem 0 0.75rem;
}

.search-overlay__products {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.625rem;
}

.search-overlay__product-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: var(--color-white);
    border-radius: 0.625rem;
    padding: 0.625rem 0.75rem;
    text-decoration: none;
    color: inherit;
    border: 1px solid transparent;
    transition: border-color var(--transition);
}

.search-overlay__product-item:hover {
    border-color: var(--color-primary);
}

.search-overlay__product-thumb {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.5rem;
    background: #f0efeb;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.search-overlay__product-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-overlay__product-name {
    font-family: var(--font-accent);
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1.3;
}

.search-overlay__product-brand {
    font-size: 0.6875rem;
    color: var(--color-text-muted);
}

.search-overlay__articles,
.search-overlay__pages {
    display: flex;
    flex-direction: column;
}

.search-overlay__article-item,
.search-overlay__page-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0efeb;
    text-decoration: none;
    color: inherit;
    transition: color var(--transition);
}

.search-overlay__article-item:last-child,
.search-overlay__page-item:last-child {
    border-bottom: none;
}

.search-overlay__article-item:hover,
.search-overlay__page-item:hover {
    color: var(--color-link-hover);
}

.search-overlay__article-item svg,
.search-overlay__page-item svg {
    flex-shrink: 0;
    color: var(--color-text-muted);
}

.search-overlay__article-title,
.search-overlay__page-title {
    font-size: 0.8125rem;
    color: var(--color-primary);
}

.search-overlay__article-type {
    margin-left: auto;
    font-size: 0.6875rem;
    color: var(--color-text-muted);
    flex-shrink: 0;
}

.search-overlay__view-all {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 1.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-link-hover);
    text-decoration: none;
}

.search-overlay__view-all:hover {
    gap: 0.5rem;
}

.search-overlay__empty {
    padding: 2rem 0;
    text-align: center;
    color: var(--color-text-muted);
    font-size: 0.875rem;
}

.search-overlay mark {
    background: #fef3cd;
    color: inherit;
    border-radius: 2px;
    padding: 0 2px;
}

/* ==========================================================================
   Search Results Page
   ========================================================================== */

.search-page {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 2rem var(--side-pad) 4rem;
}

.search-page__title {
    font-family: var(--font-accent);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--color-primary);
    margin-bottom: 0.25rem;
}

.search-page__count {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    margin-bottom: 1.5rem;
}

.search-page__tabs {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
}

.search-page__tab {
    padding: 0.5rem 1.25rem;
    border: 1.5px solid rgba(45, 42, 38, 0.15);
    border-radius: 2rem;
    background: transparent;
    font-family: var(--font-primary);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--color-text-secondary);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    transition: all var(--transition);
}

.search-page__tab:hover {
    border-color: var(--color-link-hover);
    color: var(--color-link-hover);
}

.search-page__tab.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}

.search-page__tab-count {
    opacity: 0.6;
    margin-left: 0.25rem;
}

.search-page__section {
    margin-bottom: 2.5rem;
}

.search-page__section-label {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-text-muted);
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #eee;
}

.search-page__products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
}

.search-page__articles-list {
    display: flex;
    flex-direction: column;
}

.search-page__article-item {
    display: flex;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid #f0efeb;
    text-decoration: none;
    color: inherit;
    transition: color var(--transition);
}

.search-page__article-item:last-child {
    border-bottom: none;
}

.search-page__article-item:hover {
    color: var(--color-link-hover);
}

.search-page__article-thumb {
    width: 5rem;
    height: 3.5rem;
    border-radius: 0.5rem;
    background: #f0efeb;
    overflow: hidden;
    flex-shrink: 0;
}

.search-page__article-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-page__article-meta {
    font-size: 0.625rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-muted);
    margin-bottom: 0.25rem;
}

.search-page__article-title {
    font-family: var(--font-accent);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1.3;
}

.search-page__article-excerpt {
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
    line-height: 1.5;
    margin-top: 0.25rem;
}

.search-page__pages-list {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.search-page__page-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.875rem;
    background: var(--color-white);
    border-radius: 0.5rem;
    text-decoration: none;
    color: inherit;
    border: 1px solid transparent;
    transition: border-color var(--transition);
}

.search-page__page-item:hover {
    border-color: var(--color-primary);
}

.search-page__page-item svg {
    color: var(--color-text-muted);
    flex-shrink: 0;
}

.search-page__page-title {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-primary);
}

.search-page__page-url {
    font-size: 0.6875rem;
    color: var(--color-text-muted);
    margin-left: auto;
}

.search-page__empty {
    text-align: center;
    padding: 4rem 0;
    color: var(--color-text-muted);
}

.search-page__empty a {
    color: var(--color-link-hover);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* --- Search Mobile --- */
@media (max-width: 61.99em) {

    .search-overlay__inner {
        max-width: 100%;
        padding: 1.5rem;
    }

    .search-overlay__products {
        grid-template-columns: 1fr;
    }

    .search-page {
        padding: 1.5rem 0.625rem 3rem;
    }

    .search-page__title {
        font-size: 1.25rem;
    }

    .search-page__products-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    .search-page__article-thumb {
        width: 4rem;
        height: 3rem;
    }
}

/* ==========================================================================
   Wishlist Page
   ========================================================================== */

.main-header__icon--wishlist {
    position: relative;
}

.main-header__wishlist-count {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    color: var(--color-white);
    background-color: var(--color-accent);
    border-radius: 50%;
}

.wishlist-page {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 2rem var(--side-pad) 4rem;
}

.wishlist-page__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 1.75rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.wishlist-page__title {
    font-family: var(--font-accent);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.wishlist-page__count {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    margin-top: 0.25rem;
}

.wishlist-page__header-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.wishlist-page__btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem;
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
    border-radius: 0.625rem;
    font-family: var(--font-accent);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    letter-spacing: 0.02em;
    text-decoration: none;
    transition: background-color var(--transition);
}

.wishlist-page__btn-primary:hover {
    background-color: var(--color-link-hover);
}

.wishlist-page__btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    border-radius: 0.5rem;
}

.wishlist-page__btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem;
    background: none;
    color: var(--color-primary);
    border: 1.5px solid rgba(45, 42, 38, 0.2);
    border-radius: 0.625rem;
    font-family: var(--font-primary);
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: border-color var(--transition);
}

.wishlist-page__btn-outline:hover {
    border-color: var(--color-primary);
}

.wishlist-page__btn-danger {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.375rem 0.75rem;
    background: none;
    color: #a32d2d;
    border: 1px solid #f09595;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color var(--transition);
}

.wishlist-page__btn-danger:hover {
    background-color: #fcebeb;
}

.wishlist-page__sel-bar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: #e6f1fb;
    border-radius: 0.625rem;
    margin-bottom: 1rem;
    font-size: 0.8125rem;
    color: #0c447c;
}

.wishlist-page__table {
    width: 100%;
    border-collapse: collapse;
}

.wishlist-page__table th {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    font-weight: 500;
    padding: 0 0 0.75rem;
    text-align: left;
    border-bottom: 1px solid #eee;
}

.wishlist-page__th-check {
    width: 2.25rem;
}

.wishlist-page__checkbox {
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px solid #ccc;
    border-radius: 4px;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    background: var(--color-white);
    transition: background-color var(--transition), border-color var(--transition);
}

.wishlist-page__checkbox:checked {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.wishlist-page__checkbox:checked::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid var(--color-white);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.wishlist-page__row {
    border-bottom: 1px solid #f0efeb;
    transition: opacity 0.2s, transform 0.2s, background-color 0.15s;
}

.wishlist-page__row:last-child {
    border-bottom: none;
}

.wishlist-page__row--selected {
    background-color: rgba(9, 39, 106, 0.03);
}

.wishlist-page__row td {
    padding: 1rem 0;
    vertical-align: middle;
}

.wishlist-page__product {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: inherit;
}

.wishlist-page__thumb {
    width: 4rem;
    height: 4rem;
    border-radius: 0.625rem;
    background: #f0efeb;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wishlist-page__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wishlist-page__product-name {
    font-family: var(--font-accent);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-primary);
    line-height: 1.3;
    margin-bottom: 0.125rem;
}

.wishlist-page__product-brand {
    font-size: 0.6875rem;
    color: var(--color-text-muted);
}

.wishlist-page__category {
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
}

.wishlist-page__variant {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    font-style: italic;
}

.wishlist-page__qty {
    display: inline-grid;
    grid-template-columns: 1.75rem 2rem 1.75rem;
    border: 1px solid #ddd;
    border-radius: 0.5rem;
    height: 2rem;
    overflow: hidden;
}

.wishlist-page__qty-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: var(--color-text-secondary);
    cursor: pointer;
    background: none;
    border: none;
    transition: background-color var(--transition);
}

.wishlist-page__qty-btn:hover {
    background-color: #f3f1ea;
}

.wishlist-page__qty-input {
    text-align: center;
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 0.8125rem;
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    background: none;
    width: 100%;
    color: var(--color-primary);
    -moz-appearance: textfield;
}

.wishlist-page__qty-input::-webkit-outer-spin-button,
.wishlist-page__qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.wishlist-page__td-remove {
    text-align: right;
}

.wishlist-page__remove {
    color: #ccc;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0.25rem;
    transition: color var(--transition);
}

.wishlist-page__remove:hover {
    color: #a32d2d;
}

.wishlist-page__bottom-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    background: var(--color-white);
    border-radius: 12px;
    border: 1px solid #f0efeb;
    margin-top: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.wishlist-page__bottom-left {
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
}

.wishlist-page__bottom-left strong {
    color: var(--color-primary);
    font-weight: 500;
}

.wishlist-page__bottom-right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.wishlist-page__share-link {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--color-link-hover);
    background: none;
    border: none;
    cursor: pointer;
}

.product-card__wishlist.active,
.product-info__wish-btn.active {
    color: var(--color-accent);
}

.product-card__wishlist.active svg,
.product-info__wish-btn.active svg {
    fill: var(--color-accent);
    stroke: var(--color-accent);
}

.wishlist-page__empty {
    text-align: center;
    padding: 5rem 0;
}

.wishlist-page__empty-icon {
    color: #ddd;
    margin-bottom: 1rem;
}

.wishlist-page__empty h2 {
    font-family: var(--font-accent);
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--color-primary);
    margin-bottom: 0.5rem;
}

.wishlist-page__empty p {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    margin-bottom: 1.5rem;
}

.wishlist-page__mobile-cards {
    display: none;
}

.wishlist-page__mob-card {
    background: var(--color-white);
    border-radius: 12px;
    padding: 0.75rem;
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    border: 1px solid #f0efeb;
    margin-bottom: 0.625rem;
}

.wishlist-page__mob-card .wishlist-page__thumb {
    width: 3.5rem;
    height: 3.5rem;
}

.wishlist-page__mob-card-body {
    flex: 1;
    min-width: 0;
}

.wishlist-page__mob-card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
}

.wishlist-page__mob-card-top a {
    text-decoration: none;
    color: inherit;
}

.wishlist-page__mob-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
}

/* --- Wishlist Mobile --- */
@media (max-width: 61.99em) {

    .wishlist-page {
        padding: 1.5rem 0.625rem 3rem;
    }

    .wishlist-page__header {
        flex-direction: column;
        align-items: stretch;
    }

    .wishlist-page__header-actions {
        width: 100%;
    }

    .wishlist-page__btn-primary:only-child,
    .wishlist-page__header-actions .wishlist-page__btn-primary {
        flex: 1;
        justify-content: center;
    }

    .wishlist-page__table-wrap {
        display: none;
    }

    .wishlist-page__mobile-cards {
        display: block;
    }

    .wishlist-page__sel-bar {
        flex-wrap: wrap;
        font-size: 0.75rem;
    }

    .wishlist-page__bottom-bar {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .wishlist-page__bottom-right {
        justify-content: center;
    }
}

/* --- Toast --- */
.scanspace-toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.5rem 1rem;
    background: var(--color-primary);
    color: #fff;
    border-radius: 0.5rem;
    font-family: var(--font-primary);
    font-size: 0.75rem;
    font-weight: 500;
    z-index: 99999;
    opacity: 0;
    pointer-events: none;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: opacity 0.2s ease;
}

.scanspace-toast.show {
    opacity: 1;
}

/* --- Print --- */
@media print {
    .site-header,
    .site-footer,
    .wishlist-page__header-actions,
    .wishlist-page__sel-bar,
    .wishlist-page__bottom-bar,
    .wishlist-page__remove,
    .wishlist-page__qty-btn,
    .wishlist-page__checkbox,
    .wishlist-page__th-check,
    .scanspace-toast {
        display: none !important;
    }

    .wishlist-page {
        padding: 0;
    }

    .wishlist-page__table {
        font-size: 12px;
    }

    .wishlist-page__mobile-cards {
        display: none !important;
    }

    .wishlist-page__table-wrap {
        display: block !important;
    }
}

/* ==========================================================================
   Quote Page
   ========================================================================== */

.quote-page {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 2rem var(--side-pad) 4rem;
}

.quote-page__title {
    font-family: var(--font-accent);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.quote-page__sub {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    margin-bottom: 2rem;
}

/* --- Quote Items Card --- */

.quote-card {
    background: var(--color-white);
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.04);
    margin-bottom: 1.25rem;
}

.quote-table {
    width: 100%;
    border-collapse: collapse;
}

.quote-table th {
    font-family: var(--font-primary);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    font-weight: 500;
    padding: 0 0 0.75rem;
    text-align: left;
    border-bottom: 1px solid #eee;
}

.quote-table__row {
    border-bottom: 1px solid #f0efeb;
    transition: opacity 0.2s, transform 0.2s;
}

.quote-table__row:last-child {
    border-bottom: none;
}

.quote-table__row td {
    padding: 1rem 0;
    vertical-align: middle;
}

.quote-table__product {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: inherit;
}

.quote-table__thumb {
    width: 4rem;
    height: 4rem;
    border-radius: 0.625rem;
    background: #f0efeb;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quote-table__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.quote-table__name {
    font-family: var(--font-accent);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-primary);
    line-height: 1.3;
    margin-bottom: 0.125rem;
}

.quote-table__brand {
    font-size: 0.6875rem;
    color: var(--color-text-muted);
}

.quote-table__variant {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    font-style: italic;
}

.quote-table__qty {
    display: inline-grid;
    grid-template-columns: 1.75rem 2rem 1.75rem;
    border: 1px solid #ddd;
    border-radius: 0.5rem;
    height: 2rem;
    overflow: hidden;
}

.quote-table__qty-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: var(--color-text-secondary);
    cursor: pointer;
    background: none;
    border: none;
    transition: background-color var(--transition);
}

.quote-table__qty-btn:hover {
    background-color: #f3f1ea;
}

.quote-table__qty-input {
    text-align: center;
    font-family: var(--font-accent);
    font-weight: 500;
    font-size: 0.8125rem;
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    background: none;
    width: 100%;
    color: var(--color-primary);
    -moz-appearance: textfield;
}

.quote-table__qty-input::-webkit-outer-spin-button,
.quote-table__qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.quote-table__td-remove {
    text-align: right;
}

.quote-table__remove {
    color: #ccc;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0.25rem;
    transition: color var(--transition);
}

.quote-table__remove:hover {
    color: #a32d2d;
}

.quote-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 0 0;
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
    border-top: 1px solid #eee;
}

.quote-total strong {
    color: var(--color-primary);
    font-weight: 500;
}

.quote-page__mobile-cards {
    display: none;
}

.quote-mob-card {
    background: var(--color-white);
    border-radius: 12px;
    padding: 0.75rem;
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    border: 1px solid #f0efeb;
    margin-bottom: 0.625rem;
}

.quote-mob-card .quote-table__thumb {
    width: 3.5rem;
    height: 3.5rem;
}

.quote-mob-card__body {
    flex: 1;
    min-width: 0;
}

.quote-mob-card__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
}

.quote-mob-card__top a {
    text-decoration: none;
    color: inherit;
}

.quote-mob-card__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
}

/* --- Quote Note --- */

.quote-note {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    background: #f0f4fa;
    border-radius: 0.625rem;
    font-size: 0.8125rem;
    color: #3d5a80;
    line-height: 1.5;
    margin-bottom: 0;
}

.quote-note svg {
    flex-shrink: 0;
    margin-top: 1px;
}

.quote-separator {
    border: none;
    border-top: 1px solid #eee;
    margin: 2rem 0;
}

/* --- Quote Form --- */

.quote-form-section {
    margin-bottom: 2rem;
}

.quote-form__title {
    font-family: var(--font-accent);
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--color-primary);
    margin-bottom: 1.25rem;
}

.quote-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.quote-field {
    margin-bottom: 0;
}

.quote-field label {
    display: block;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    margin-bottom: 0.25rem;
    font-weight: 500;
}

.quote-field--full {
    grid-column: 1 / -1;
}

.quote-input {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1.5px solid #ddd;
    border-radius: 0.5rem;
    font-family: var(--font-primary);
    font-size: 0.875rem;
    color: var(--color-primary);
    background: var(--color-white);
    outline: none;
    transition: border-color var(--transition);
}

.quote-input:focus {
    border-color: var(--color-primary);
}

.quote-input::placeholder {
    color: #bbb;
}

.quote-textarea {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1.5px solid #ddd;
    border-radius: 0.5rem;
    font-family: var(--font-primary);
    font-size: 0.875rem;
    color: var(--color-primary);
    background: var(--color-white);
    outline: none;
    resize: none;
    overflow: hidden;
    min-height: 4rem;
    transition: border-color var(--transition);
}

.quote-textarea:focus {
    border-color: var(--color-primary);
}

.quote-textarea::placeholder {
    color: #bbb;
}

.quote-upload {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0.875rem;
    border: 1.5px dashed #ddd;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: border-color var(--transition), color var(--transition);
    color: var(--color-text-muted);
    font-size: 0.8125rem;
}

.quote-upload:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.quote-upload-hint {
    font-size: 0.6875rem;
    color: #bbb;
    margin-top: 0.25rem;
}

.quote-form-footer {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 0.5rem;
}

.quote-consent {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.quote-checkbox {
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px solid #ccc;
    border-radius: 4px;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    flex-shrink: 0;
    margin-top: 2px;
    position: relative;
    background: var(--color-white);
    transition: background-color var(--transition), border-color var(--transition);
}

.quote-checkbox:checked {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.quote-checkbox:checked::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid var(--color-white);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.quote-consent__label {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    line-height: 1.5;
}

.quote-consent__label a {
    color: var(--color-link-hover);
    text-decoration: underline;
}

.quote-form-buttons {
    display: flex;
    gap: 0.5rem;
}

.quote-submit {
    flex: 1;
    padding: 0.875rem;
    background: var(--color-accent);
    color: var(--color-white);
    border: none;
    border-radius: 0.625rem;
    font-family: var(--font-accent);
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    transition: background-color var(--transition), opacity var(--transition);
}

.quote-submit:hover:not(:disabled) {
    background: var(--color-accent-hover);
}

.quote-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.quote-wa {
    padding: 0.875rem 1.25rem;
    border: 1.5px solid #ddd;
    border-radius: 0.625rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-primary);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: border-color var(--transition), color var(--transition);
}

.quote-wa:hover {
    border-color: #25d366;
    color: #25d366;
}

.quote-tg {
    padding: 0.875rem 1.25rem;
    border: 1.5px solid #ddd;
    border-radius: 0.625rem;
    font-family: var(--font-primary);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-primary);
    background: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: border-color var(--transition), color var(--transition);
}

.quote-tg:hover {
    border-color: #0088cc;
    color: #0088cc;
}

.quote-toast {
    position: fixed;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%) translateY(1rem);
    background: var(--color-primary);
    color: #fff;
    font-family: var(--font-primary);
    font-size: 0.8125rem;
    padding: 0.625rem 1.25rem;
    border-radius: 0.5rem;
    opacity: 0;
    transition: opacity 0.25s, transform 0.25s;
    z-index: 9999;
    pointer-events: none;
    white-space: nowrap;
}

.quote-toast.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* --- Quote Success --- */

.quote-success {
    text-align: center;
    padding: 4rem 0;
}

.quote-success h2 {
    font-family: var(--font-accent);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--color-primary);
    margin: 1rem 0 0.5rem;
}

.quote-success p {
    font-size: 0.875rem;
    color: var(--color-text-secondary);
    margin-bottom: 1.5rem;
}

/* --- Quote Empty --- */

.quote-empty {
    text-align: center;
    padding: 5rem 0;
}

.quote-empty__icon {
    color: #ddd;
    margin-bottom: 1rem;
}

.quote-empty h2 {
    font-family: var(--font-accent);
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--color-primary);
    margin-bottom: 0.5rem;
}

.quote-empty p {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    margin-bottom: 1.5rem;
}

/* --- Quote Mobile --- */
@media (max-width: 61.99em) {

    .quote-page {
        padding: 1.5rem 0.625rem 3rem;
    }

    .quote-table {
        display: none;
    }

    .quote-page__mobile-cards {
        display: block;
    }

    .quote-form-grid {
        grid-template-columns: 1fr;
    }

    .quote-form-buttons {
        flex-direction: column;
    }

    .quote-wa,
    .quote-tg {
        justify-content: center;
    }
}

/* ==========================================================================
   Catalog Listing
   ========================================================================== */

.catalog-page {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 1.5rem var(--side-pad) 4rem;
}

.catalog-top-bar {
    background: var(--color-white);
    border-radius: 16px;
    padding: 1.5rem 2rem 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.04);
}

.catalog-top-bar .breadcrumbs {
    padding: 0;
    margin-bottom: 1rem;
}

.catalog-top-bar .catalog-header {
    margin-bottom: 1.25rem;
}

.catalog-header {
    margin-bottom: 1.5rem;
}

.catalog-header__title {
    font-family: var(--font-accent);
    font-size: 1.75rem;
    font-weight: 500;
    color: var(--color-primary);
}

.catalog-header__desc {
    font-size: 0.875rem;
    color: var(--color-text-secondary);
    margin-top: 0.25rem;
    line-height: 1.5;
}


/* --- Subcategories --- */

.catalog-subcats {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.catalog-subcat {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.575rem 1.675rem 0.575rem 1.675rem;
    background: var(--color-white);
    border-radius: 2rem;
    border: 1px solid #eee;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--color-primary);
    text-decoration: none;
    white-space: nowrap;
    transition: border-color var(--transition), box-shadow var(--transition);
}

.catalog-subcat:hover {
    border-color: var(--color-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.catalog-subcat:has(.catalog-subcat__img) {
    padding-left: 0.575rem;
}

.catalog-subcat__img {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: #f0ede6;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.catalog-subcat__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* --- Toolbar --- */

.catalog-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 1rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid #eee;
    gap: 0.5rem;
}

.catalog-toolbar__left {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.catalog-filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    border: 1.5px solid rgba(45, 42, 38, 0.15);
    border-radius: 2rem;
    background: none;
    font-size: 0.8125rem;
    font-weight: 500;
    font-family: var(--font-primary);
    color: var(--color-primary);
    cursor: pointer;
    transition: all 0.15s;
}

.catalog-filter-toggle:hover {
    border-color: var(--color-primary);
}

.catalog-filter-toggle.active {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

.catalog-filter-badge {
    min-width: 1.125rem;
    height: 1.125rem;
    border-radius: 50%;
    background: var(--color-accent);
    color: var(--color-white);
    font-size: 0.625rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.25rem;
}

.catalog-sort {
    padding: 0.5rem 2rem 0.5rem 0.875rem;
    border: 1.5px solid rgba(45, 42, 38, 0.15);
    border-radius: 2rem;
    font-size: 0.8125rem;
    font-family: var(--font-primary);
    color: var(--color-primary);
    background: var(--color-white) url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23999' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 0.875rem center;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
}

.catalog-view-btns {
    display: flex;
    border: 1.5px solid rgba(45, 42, 38, 0.15);
    border-radius: 2rem;
    overflow: hidden;
}

.catalog-view-btn {
    padding: 0.4375rem 0.625rem;
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s;
}

.catalog-view-btn.active {
    background: var(--color-primary);
    color: var(--color-white);
}

/* --- Filter panel --- */

.catalog-filters {
    background: var(--color-white);
    border-radius: 12px;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.25s ease, margin 0.3s ease;
    margin-bottom: 0;
}

.catalog-filters.open {
    max-height: 600px;
    opacity: 1;
    margin-bottom: 1.25rem;
}

.catalog-filters__inner {
    padding: 1.25rem 1.5rem;
}

.catalog-filter-row {
    display: flex;
    align-items: flex-start;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f5f4f0;
}

.catalog-filter-row:last-of-type {
    border-bottom: none;
}

.catalog-filter-label {
    width: 5.5rem;
    flex-shrink: 0;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    font-weight: 500;
    padding-top: 0.375rem;
}

.catalog-filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    flex: 1;
}

.catalog-filter-tag {
    padding: 0.3125rem 0.75rem;
    border: 1.5px solid #ddd;
    border-radius: 2rem;
    font-size: 0.6875rem;
    font-weight: 500;
    color: #555;
    cursor: pointer;
    background: none;
    transition: all 0.12s;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-family: var(--font-primary);
}

.catalog-filter-tag:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.catalog-filter-tag.selected {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

/* --- Selected pills --- */

.catalog-filter-selected {
    display: flex;
    align-items: center;
    padding: 0.75rem 0 0;
    margin-top: 0.25rem;
    gap: 0.5rem;
    border-top: 1px solid #f0efeb;
}

.catalog-selected-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    background: var(--color-primary);
    color: var(--color-white);
    border-radius: 2rem;
    font-size: 0.6875rem;
    cursor: pointer;
    transition: background 0.15s;
}

.catalog-selected-pill:hover {
    background: var(--color-link-hover);
}

.catalog-clear-all {
    font-size: 0.6875rem;
    color: var(--color-text-muted);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    margin-left: 0.25rem;
}

.catalog-clear-all:hover {
    color: var(--color-primary);
}

/* --- Product grid --- */

.catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.catalog-grid--list {
    grid-template-columns: 1fr 1fr;
}

/* --- Vertical card (grid) --- */

.catalog-card-v {
    background: var(--color-white);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s;
}

.catalog-grid--list .catalog-card-v {
    display: none;
}

.catalog-card-v:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.catalog-card-v__photo {
    position: relative;
    aspect-ratio: 4 / 5;
    background: #ffffff;
    overflow: hidden;
}

.catalog-card-v__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 0;
}

.pcard-media__track {
    display: flex;
    height: 100%;
    transition: transform 0.3s ease;
}

.pcard-media__slide {
    flex: 0 0 100%;
    height: 100%;
}

.pcard-media__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.pcard-media__dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    display: flex;
    gap: 6px;
    justify-content: center;
    z-index: 3;
    opacity: 0;
    transition: opacity 0.2s;
}

.pcard-media[data-multi]:hover .pcard-media__dots,
.pcard-media[data-multi] .pcard-media__dots--visible {
    opacity: 1;
}

.pcard-media__dot {
    width: 18px;
    height: 5px;
    border: 0;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    padding: 0;
    transition: background 0.15s;
}

.pcard-media__dot.is-active {
    background: #a32d2d;
}

.pcard-media__zones {
    position: absolute;
    inset: 0;
    display: flex;
    z-index: 2;
}

.pcard-media__zone {
    flex: 1;
}

@media (hover: none) {
    .pcard-media__zones {
        display: none;
    }
    .pcard-media[data-multi] .pcard-media__dots {
        opacity: 1;
    }
}

.catalog-card-v__wish {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 2;
    width: 2.25rem;
    height: 2.25rem;
    background: rgba(255, 255, 255, 0.85);
    border: none;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ccc;
    cursor: pointer;
    transition: color 0.15s;
}

.catalog-card-v__wish:hover {
    color: var(--color-accent);
}

.catalog-card-v__body {
    padding: 1rem 1.125rem 1.25rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.catalog-card-v__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.25rem;
}

.catalog-card-v__meta {
    font-size: 0.725rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-text-muted);
    font-weight: 500;
}

.catalog-card-v__sku {
    font-size: 0.725rem;
    font-family: var(--font-primary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
    font-weight: 500;
    flex-shrink: 0;
}

.catalog-card-v__name {
    font-family: var(--font-accent);
    font-size: 1.0825rem;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1.3;
    margin-bottom: 0.5rem;
    transition: color 0.15s;
}

.catalog-card-v:hover .catalog-card-v__name {
    color: var(--color-link-hover);
}

.catalog-card-v__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3125rem;
    margin-bottom: 0.875rem;
}

.catalog-card-v__tag {
    padding: 0.1875rem 0.5rem;
    border: 1px solid #ddd;
    border-radius: 2rem;
    font-size: 0.625rem;
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.catalog-card-v__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 0.625rem;
    border-top: 1px solid #f0efeb;
}

.catalog-card-v__price {
    font-size: 0.8825rem;
    font-weight: 500;
    color: var(--color-text-secondary);
}


/* --- Horizontal card (list) --- */

.catalog-card-h {
    display: none;
    background: var(--color-white);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.3s;
}

.catalog-grid--list .catalog-card-h {
    display: flex;
}

.catalog-card-h:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.catalog-card-h__photo {
    width: 10rem;
    flex-shrink: 0;
    background: #f0ede6;
    overflow: hidden;
}

.catalog-card-h__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 0;
}

.catalog-card-h__body {
    flex: 1;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.catalog-card-h__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.25rem;
}

.catalog-card-h__meta {
    font-size: 0.5625rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-text-muted);
    font-weight: 500;
}

.catalog-card-h__sku {
    font-size: 0.625rem;
    color: var(--color-text-muted);
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

.catalog-card-h__name {
    font-family: var(--font-accent);
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 0.625rem;
    line-height: 1.3;
    transition: color 0.15s;
}

.catalog-card-h:hover .catalog-card-h__name {
    color: var(--color-link-hover);
}

.catalog-card-h__dims {
    display: flex;
    align-items: baseline;
    margin-bottom: 0.625rem;
}

.catalog-card-h__dim {
    display: flex;
    align-items: baseline;
    gap: 0.1875rem;
    padding-right: 0.625rem;
    border-right: 1px solid #eee;
    margin-right: 0.625rem;
}

.catalog-card-h__dim:last-child {
    border-right: none;
    margin-right: 0;
    padding-right: 0;
}

.catalog-card-h__dim-val {
    font-family: var(--font-accent);
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--color-primary);
}

.catalog-card-h__dim-unit,
.catalog-card-h__dim-label {
    font-size: 0.5625rem;
    text-transform: uppercase;
    color: var(--color-text-muted);
    letter-spacing: 0.04em;
}

.catalog-card-h__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.catalog-card-h__price {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-secondary);
}

.catalog-card-h__request {
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-primary);
    transition: color 0.15s;
}

.catalog-card-h:hover .catalog-card-h__request {
    color: var(--color-link-hover);
}

/* --- Catalog Empty --- */

.catalog-empty {
    text-align: center;
    padding: 4rem 0;
    color: var(--color-text-muted);
}

.catalog-empty a {
    color: var(--color-link-hover);
    text-decoration: underline;
}

/* --- Catalog Pagination --- */

.catalog-pagination {
    margin-top: 2.5rem;
    display: flex;
    justify-content: center;
}

.catalog-pagination .page-numbers {
    display: flex;
    gap: 0.375rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.catalog-pagination .page-numbers li a,
.catalog-pagination .page-numbers li span {
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid #ddd;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: all 0.15s;
}

.catalog-pagination .page-numbers li a:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.catalog-pagination .page-numbers li span.current {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

/* --- Category SEO Text --- */
.category-seo-text {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
}
.category-seo-text--after {
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px solid #E6E1D9;
}

/* --- Catalog Mobile --- */
@media (max-width: 61.99em) {

    .catalog-page {
        padding: 1rem 0.625rem 3rem;
    }

    .catalog-header__title {
        font-size: 1.375rem;
    }

    .catalog-subcats {
        flex-wrap: nowrap;
        padding-bottom: 0.5rem;
    }

    .catalog-view-btns {
        display: none;
    }

    .catalog-filter-row {
        flex-direction: column;
        gap: 0.5rem;
    }

    .catalog-filter-label {
        width: auto;
    }

    .catalog-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    .catalog-grid--list {
        grid-template-columns: 1fr;
    }

    .catalog-card-v__body {
        padding: 0.625rem 0.75rem 0.75rem;
    }

    .catalog-card-v__name {
        font-size: 0.875rem;
    }

    .catalog-card-v__tags {
        display: none;
    }

    .catalog-card-h__photo {
        width: 7rem;
    }

    .catalog-card-h__dims {
        display: none;
    }
}

@media (max-width: 30em) {
    .catalog-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Reduced motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

	:root {
		--transition: 0s;
	}

	html {
		scroll-behavior: auto;
	}

	.hero-slider__slide {
		transition: none;
	}

	.hero-slider__cta {
		transition: none;
	}

	.mega {
		transition: none;
	}

	.shop-look__marker {
		transition: none;
	}

	.shop-look__marker::before {
		animation: none;
	}

	.shop-look__card-inner {
		transition: none;
	}

	.categories__img {
		transition: none;
	}

	.product-card {
		transition: none;
	}

	.product-card__img {
		transition: none;
	}

	.blog-card__img {
		transition: none;
	}

	.faq__icon svg {
		transition: none;
	}

	.faq__answer {
		transition: none;
	}

	.contact__map {
		transition: none;
	}
}

/* ==========================================================================
   Single Project
   ========================================================================== */

.proj-wrap {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 0 var(--side-pad);
}

/* Hero */
.proj-hero {
	padding: 2.5rem 0 0;
}

.proj-crumb {
	font-family: var(--font-primary);
	font-size: 0.6875rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 2.5rem;
}

.proj-crumb ol {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.1em;
}

.proj-crumb li + li::before {
	content: "/";
	margin-right: 0.5em;
	color: var(--color-text-muted);
}

.proj-crumb a {
	color: var(--color-text-muted);
	text-decoration: none;
}

.proj-crumb a:hover {
	color: var(--color-text);
}

.proj-crumb strong {
	color: var(--color-text);
}

.proj-hero-grid {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 3rem;
	align-items: start;
}

.proj-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-family: var(--font-primary);
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 1rem;
}


.proj-title {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.1;
	color: var(--color-text);
	margin: 0 0 1.5rem;
}

.proj-lead {
	font-family: var(--font-primary);
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
	max-width: 36rem;
}

.proj-hero__left {
	background: var(--color-white, #fff);
	border-radius: 16px;
	padding: 2.5rem;
}

.proj-hero__media {
	align-self: stretch;
}

.proj-hero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 16px;
	display: block;
}

.proj-meta {
	display: flex;
	flex-direction: column;
}

.proj-meta-row {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.9rem 0;
	border-bottom: 1px solid #e7e4dd;
}

.proj-meta-row:last-child {
	border-bottom: 0;
}

.proj-meta-k {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	color: var(--color-text-muted);
}

.proj-meta-v {
	font-family: var(--font-primary);
	font-size: 0.9125rem;
	font-weight: 600;
	color: var(--color-text);
}

/* Hotspots */
/* Story */
.proj-story-sec {
	padding: 3rem 0;
}

.proj-story {
	margin-bottom: 3rem;
}

.proj-story-heading {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 1.5rem;
	color: var(--color-text);
}

.proj-story-text {
	font-family: var(--font-primary);
	font-size: 1rem;
	line-height: 1.7;
	color: var(--color-text);
	column-count: 2;
	column-gap: 3rem;
}

.proj-story-text p {
	margin: 0 0 1rem;
	break-inside: avoid;
}

.proj-story-text h2,
.proj-story-text h3 {
	break-inside: avoid;
	color: var(--color-text);
	margin-top: 0;
}

.proj-story-text > :first-child {
	margin-top: 0;
}

/* Gallery grid */
.proj-gallery--masonry {
	column-count: 3;
	column-gap: 16px;
}

.proj-gallery__item {
	display: block;
	margin: 0 0 16px;
	break-inside: avoid;
	border-radius: 14px;
	overflow: hidden;
	cursor: zoom-in;
}

.proj-gallery__item img {
	width: 100%;
	height: auto;
	display: block;
}

/* Video section */
.proj-video-sec {
	padding: 3rem 0;
}

.proj-video {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 3rem;
	align-items: center;
}

.proj-video__heading {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 1rem;
	color: var(--color-text);
}

.proj-video__body {
	font-family: var(--font-primary);
	font-size: 1rem;
	line-height: 1.7;
	color: var(--color-text);
}

.proj-video__body p {
	margin: 0 0 1rem;
}

.proj-video__frame {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 16px;
	overflow: hidden;
	background: #000;
}

.proj-video__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.proj-video__photo {
	width: 100%;
	height: auto;
	border-radius: 16px;
	object-fit: cover;
	display: block;
}

/* Products section */
.proj-products-sec {
	padding: 3rem 0;
}

.proj-sec-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	margin-bottom: 2rem;
}

.proj-sec-head h2 {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 0.5rem 0 0;
}

.proj-sec-head h2 strong {
	font-weight: 700;
}

.proj-view-all {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--color-link-hover);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	white-space: nowrap;
}

.proj-view-all:hover {
	text-decoration: underline;
}

.proj-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
}

/* Services */
.proj-svc-sec {
	padding: 3rem 0;
}

.proj-svc-top {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: end;
	margin-bottom: 2.5rem;
}

.proj-svc-top h2 {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 400;
	line-height: 1.2;
	margin: 0.5rem 0 0;
}

.proj-svc-top h2 strong {
	font-weight: 700;
}

.proj-svc-lead {
	font-family: var(--font-primary);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
}

.proj-svc-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}

a.proj-svc {
	text-decoration: none;
	color: inherit;
	display: block;
}

.proj-svc {
	background: var(--color-white);
	border-radius: 16px;
	padding: 2rem;
	position: relative;
	transition: box-shadow 0.3s;
}

.proj-svc:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.proj-svc__ico {
	margin-bottom: 1.25rem;
	color: var(--color-text);
}

.proj-svc__ico svg {
	width: 40px;
	height: 40px;
	display: block;
}

.proj-svc__num {
	font-family: var(--font-primary);
	font-size: 0.6875rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.5rem;
}

.proj-svc__title {
	font-family: var(--font-accent);
	font-size: 1.125rem;
	font-weight: 600;
	margin: 0 0 0.5rem;
}

.proj-svc__desc {
	font-family: var(--font-primary);
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
	margin: 0;
}

.proj-svc__arrow {
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	font-size: 1.25rem;
	color: var(--color-text-muted);
	transition: color 0.2s, transform 0.2s;
}

.proj-svc:hover .proj-svc__arrow {
	color: var(--color-accent);
	transform: translateX(4px);
}

/* Project CTA form */
.pform-sec {
	padding: 3rem 0 4rem;
}

.pform {
	display: grid;
	grid-template-columns: 0.92fr 1.08fr;
	background: var(--color-white);
	border-radius: var(--header-radius);
	overflow: hidden;
}

.pform-intro {
	background: var(--color-white);
	border-right: 1px solid var(--rule);
	padding: 2.5rem;
	display: flex;
	flex-direction: column;
}

.pform-eyebrow {
	font-family: var(--font-primary);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin-bottom: 0.75rem;
}

.pform-title {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 400;
	line-height: 1.15;
	margin: 0 0 1rem;
}

.pform-title b {
	font-weight: 700;
}

.pform-lead {
	font-family: var(--font-primary);
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0 0 2rem;
}

.steps {
	list-style: none;
	padding: 0;
	margin: 0 0 auto;
	display: flex;
	flex-direction: column;
}

.steps li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1.125rem;
	align-items: start;
	padding: 1.125rem 0;
	border-top: 1px solid var(--rule);
}

.steps li:last-child {
	border-bottom: 0;
}

.steps .n {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem;
	font-weight: 500;
	color: var(--color-accent);
	letter-spacing: 0.08em;
	padding-top: 0.125rem;
}

.steps .tx {
	display: flex;
	flex-direction: column;
	gap: 0.1875rem;
}

.steps .tx b {
	font-family: var(--font-accent);
	font-weight: 600;
	font-size: 1rem;
	letter-spacing: -0.01em;
	color: var(--color-text);
}

.steps .tx span {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	line-height: 1.5;
	font-weight: 300;
	color: var(--ink-2);
}

.intro-foot {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--rule);
}

.intro-foot__card {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.875rem;
	color: var(--color-text);
	text-decoration: none;
	background: transparent;
	padding: 0.75rem 1rem;
	border-radius: 0.5rem;
	transition: color 0.2s, box-shadow 0.2s;
}

.intro-foot__card:hover {
	color: var(--color-accent);
}

.intro-foot__card svg {
	flex-shrink: 0;
	color: var(--ink-3);
}

.pform-form {
	padding: 2.5rem;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.pform-hp {
	position: absolute;
	left: -9999px;
	opacity: 0;
	height: 0;
	width: 0;
	overflow: hidden;
}

.pform-grid2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.pform-field label {
	display: block;
	font-family: var(--font-primary);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin-bottom: 0.375rem;
}

.pform-field label abbr {
	text-decoration: none;
	color: var(--color-accent);
}

.pform-field input,
.pform-field textarea {
	width: 100%;
	font-family: var(--font-primary);
	font-size: 0.9375rem;
	padding: 0.75rem 1rem;
	border: 1px solid var(--rule);
	border-radius: 10px;
	background: var(--color-bg);
	color: var(--color-text);
	outline: none;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.pform-field input:focus,
.pform-field textarea:focus {
	border-color: var(--color-text);
	box-shadow: 0 0 0 3px rgba(45, 42, 38, 0.08);
}

.pform-field.is-invalid input,
.pform-field.is-invalid textarea {
	border-color: var(--color-accent);
}

.field-error {
	display: block;
	font-family: var(--font-primary);
	font-size: 0.75rem;
	color: var(--color-accent);
	margin-top: 0.25rem;
}

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

.chip {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	padding: 0.5rem 1rem;
	border: 1px solid var(--rule);
	border-radius: 100px;
	background: transparent;
	color: var(--color-text);
	cursor: pointer;
	transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.chip:hover {
	border-color: var(--color-text);
}

.chip.on {
	background: var(--color-text);
	border-color: var(--color-text);
	color: #fff;
}

.pform-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 0.25rem;
}

.consent {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	color: var(--ink-2);
	cursor: pointer;
	line-height: 1.4;
}

.consent input[type="checkbox"] {
	width: 1rem;
	height: 1rem;
	margin-top: 0.125rem;
	accent-color: var(--color-accent);
	flex-shrink: 0;
}

.consent a {
	color: var(--color-text);
	text-decoration: underline;
}

.pform-submit {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-accent);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #fff;
	background: var(--color-accent);
	border: none;
	border-radius: 10px;
	padding: 0.875rem 2rem;
	cursor: pointer;
	transition: background 0.2s, transform 0.15s;
	flex-shrink: 0;
}

.pform-submit:hover {
	background: var(--color-accent-hover);
}

.pform-submit:active {
	transform: scale(0.97);
}

.pform-submit:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.pform-submit svg {
	transition: transform 0.2s;
}

.pform-submit:hover svg {
	transform: translateX(3px);
}

.reassure {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.75rem;
	color: var(--ink-3);
}

.reassure__dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ok);
	flex-shrink: 0;
}

.pform-success {
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 3rem 2rem;
}

.pform-success h3 {
	font-family: var(--font-accent);
	font-size: 1.5rem;
	font-weight: 700;
	margin: 1rem 0 0.5rem;
}

.pform-success p {
	font-family: var(--font-primary);
	color: var(--ink-2);
}

/* Mobile */
@media (max-width: 61.99em) {

	.proj-hero {
		padding-top: 1.5rem;
	}

	.proj-hero-grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.proj-hero__left {
		padding: 1.5rem;
	}

	.proj-title {
		font-size: 2rem;
	}

	.proj-hero__media {
		order: -1;
	}

	.proj-hero__img {
		height: auto;
		aspect-ratio: 16 / 10;
	}

	.proj-story-text {
		column-count: 1;
	}

	.proj-gallery--masonry {
		column-count: 2;
	}

	.proj-video {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.proj-sec-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
	}

	.proj-cards {
		grid-template-columns: 1fr 1fr;
		gap: 0.75rem;
	}

	.proj-svc-top {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.proj-svc-grid {
		grid-template-columns: 1fr;
	}

	.pform {
		grid-template-columns: 1fr;
	}

	.pform-intro {
		padding: 2rem 1.5rem;
		border-right: none;
		border-bottom: 1px solid var(--rule);
	}

	.pform-form {
		padding: 2rem 1.5rem;
	}

	.pform-grid2 {
		grid-template-columns: 1fr;
	}

	.pform-foot {
		flex-direction: column;
		align-items: stretch;
	}

	.pform-submit {
		width: 100%;
		justify-content: center;
	}
}

@media (max-width: 40em) {
	.proj-gallery--masonry {
		column-count: 1;
	}
}

/* ==========================================================================
   Services Archive
   ========================================================================== */

.svc-archive {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 2.5rem var(--side-pad) 4rem;
}

.svc-archive__header {
	margin-bottom: 2.5rem;
}

.svc-archive__title {
	font-family: var(--font-accent);
	font-size: 2.5rem;
	font-weight: 400;
	line-height: 1.1;
	margin: 0.5rem 0 0;
}

.svc-archive__title strong {
	font-weight: 700;
}

.svc-archive__lead {
	font-family: var(--font-primary);
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
	max-width: 40rem;
	margin: 1rem 0 0;
}

.svc-archive__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}

.svc-tile {
	background: var(--color-white);
	border-radius: 16px;
	padding: 2rem;
	text-decoration: none;
	color: inherit;
	display: flex;
	flex-direction: column;
	position: relative;
	transition: box-shadow 0.3s;
}

.svc-tile:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.svc-tile__ico {
	margin-bottom: 1.25rem;
	color: var(--color-text);
}

.svc-tile__ico svg {
	width: 48px;
	height: 48px;
	display: block;
}

.svc-tile__title {
	font-family: var(--font-accent);
	font-size: 1.25rem;
	font-weight: 600;
	margin: 0 0 0.5rem;
	line-height: 1.3;
}

.svc-tile__desc {
	font-family: var(--font-primary);
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
	margin: 0;
	flex: 1;
}

.svc-tile__arrow {
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	font-size: 1.25rem;
	color: var(--color-text-muted);
	transition: color 0.2s, transform 0.2s;
}

.svc-tile:hover .svc-tile__arrow {
	color: var(--color-accent);
	transform: translateX(4px);
}

.svc-archive__empty {
	font-family: var(--font-primary);
	color: var(--color-text-muted);
	text-align: center;
	padding: 3rem 0;
}

/* ==========================================================================
   Single Service
   ========================================================================== */

.svc-page {
	max-width: 52rem;
	margin: 0 auto;
	padding: 2.5rem var(--side-pad) 4rem;
}


@media (max-width: 61.99em) {

	.svc-archive__grid {
		grid-template-columns: 1fr;
	}

	.svc-archive__title {
		font-size: 1.75rem;
	}

}

/* ==========================================================================
   Portfolio Archive
   ========================================================================== */

.pf-wrap {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 2.5rem var(--side-pad) 4rem;
}

/* Hero */
.pf-hero {
	margin-bottom: 2.5rem;
}

.pf-hero__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: start;
}

.pf-hero__title {
	font-family: var(--font-accent);
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1.08;
	margin: 0.75rem 0 1.25rem;
	color: var(--color-text);
}

.pf-hero__title--muted {
	color: var(--color-text-muted);
	font-weight: 400;
}

.pf-hero__lead {
	font-family: var(--font-primary);
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--color-text-secondary);
	max-width: 32rem;
}

.pf-hero__meta {
	background: var(--color-white);
	border-radius: 16px;
	padding: 2rem;
}

.pf-hero__meta-row {
	display: flex;
	justify-content: space-between;
	padding: 0.75rem 0;
	border-bottom: 1px solid #eee;
}

.pf-hero__meta-row:last-child {
	border-bottom: 0;
}

.pf-hero__meta-k {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.pf-hero__meta-v {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--color-text);
}

/* Filters */
.portfolio-filters {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 2rem;
	flex-wrap: wrap;
}

.pf-pills {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.pf-pill {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	padding: 0.5rem 1.125rem;
	border-radius: 100px;
	border: 1px solid #e0ddd7;
	background: var(--color-white);
	color: var(--color-text);
	cursor: pointer;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.pf-pill span {
	color: var(--color-text-muted);
	margin-left: 0.25rem;
}

.pf-pill:hover {
	border-color: var(--color-text);
}

.pf-pill.is-active {
	background: var(--color-text);
	color: var(--color-white);
	border-color: var(--color-text);
}

.pf-pill.is-active span {
	color: rgba(255, 255, 255, 0.6);
}

.pf-showing {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	white-space: nowrap;
}

.pf-showing strong {
	color: var(--color-text);
}

/* Grid */
.pf-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.proj-card {
	background: var(--color-white);
	border: 1px solid #e7e4dd;
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	display: flex;
	flex-direction: column;
	transition: box-shadow 0.3s, transform 0.2s;
}

.proj-card:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
	transform: translateY(-2px);
}

.proj-card__img {
	aspect-ratio: 16 / 10;
	background-size: cover;
	background-position: center;
	background-color: #fff;
}

.proj-card__body {
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.proj-card__loc {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.625rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.5rem;
}
.proj-card__loc svg {
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
}

.proj-card__title {
	font-family: var(--font-accent);
	font-size: 1.375rem;
	font-weight: 600;
	line-height: 1.25;
	margin: 0 0 0.5rem;
	color: var(--color-text);
}

.proj-card__desc {
	font-family: var(--font-primary);
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
	margin: 0 0 1rem;
}

.proj-card__meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
	gap: 0;
	padding-top: 1rem;
	border-top: 1px solid var(--rule, #e7e4dd);
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.proj-card__meta-item {
	padding: 0 1rem;
	border-left: 1px solid var(--rule, #e7e4dd);
}

.proj-card__meta-item:first-child {
	padding-left: 0;
	border-left: 0;
}

.proj-card__meta-k {
	display: block;
	font-family: 'JetBrains Mono', monospace;
	font-size: 10px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 0.35rem;
}

.proj-card__meta-v {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--color-text);
}

.proj-card__more {
	font-family: var(--font-primary);
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--color-link-hover);
	margin-top: auto;
}

.proj-card:hover .proj-card__more {
	text-decoration: underline;
}

.pf-empty {
	font-family: var(--font-primary);
	color: var(--color-text-muted);
	text-align: center;
	padding: 3rem 0;
}

@media (max-width: 61.99em) {

	.pf-hero__grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.pf-hero__title {
		font-size: 2.25rem;
	}

	.pf-pills {
		gap: 0.375rem;
		overflow-x: auto;
		flex-wrap: nowrap;
		-webkit-overflow-scrolling: touch;
	}

	.pf-pill {
		flex-shrink: 0;
		padding: 0.4rem 0.875rem;
		font-size: 0.75rem;
	}

	.pf-grid {
		grid-template-columns: 1fr;
	}

	.proj-card__meta {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.75rem 0;
	}

	.proj-card__meta-item:nth-child(odd) {
		padding-left: 0;
		border-left: 0;
	}
}

/* ==========================================================================
   Cookie consent banner
   ========================================================================== */

.cc {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	background: var(--color-white, #fff);
	border-top: 1px solid var(--rule, #e7e4dd);
	box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08);
	padding: 1rem 1.25rem;
}

.cc__bar {
	display: flex;
	gap: 1rem;
	align-items: center;
	flex-wrap: wrap;
	max-width: var(--maxw, 1200px);
	margin: 0 auto;
}

.cc__text {
	flex: 1 1 320px;
	font-size: 14px;
	color: var(--color-text);
	margin: 0;
	line-height: 1.5;
}

.cc__text a {
	color: var(--color-accent, #ab0733);
	text-decoration: underline;
}

.cc__actions {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.cc__btn {
	border-radius: 10px;
	padding: 0.6rem 1rem;
	font-family: var(--font-primary);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	border: 1px solid var(--rule, #e7e4dd);
	background: transparent;
	color: var(--color-text);
	transition: background var(--transition), color var(--transition);
}

.cc__btn:hover {
	background: var(--color-bg, #f7f6f3);
}

.cc__btn--accent {
	background: var(--color-accent, #ab0733);
	color: #fff;
	border-color: var(--color-accent, #ab0733);
}

.cc__btn--accent:hover {
	background: var(--color-accent-hover, #8c0629);
}

.cc__panel {
	max-width: var(--maxw, 1200px);
	margin: 1rem auto 0;
	border-top: 1px solid var(--rule, #e7e4dd);
	padding-top: 1rem;
}

.cc__row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--rule, #e7e4dd);
	cursor: pointer;
}

.cc__row--locked {
	opacity: 0.6;
	cursor: default;
}

.cc__row small {
	display: block;
	color: var(--color-text-muted);
	font-size: 12px;
	margin-top: 2px;
}

@media (max-width: 61.99em) {
	.cc__actions {
		width: 100%;
	}

	.cc__btn {
		flex: 1;
		text-align: center;
	}
}

/* ==========================================================================
   Contacts page (page-contacts.php)
   ========================================================================== */

.contacts h1,
.contacts h2,
.contacts h3 {
	font-weight: 300;
	letter-spacing: -0.03em;
}

.contacts h1 b,
.contacts h2 b,
.contacts h3 b {
	font-weight: 600 !important;
}

.contacts h1 em,
.contacts h2 em,
.contacts h3 em {
	font-style: normal;
	color: var(--ink-3);
	font-weight: 300 !important;
}

.contacts__wrap {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 0 var(--side-pad) 0.5rem;
}

/* Hero */

.c-hero {
	padding: 2.5rem 0 3.5rem;
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 4rem;
	align-items: flex-end;
	border-bottom: 1px solid var(--rule);
	margin-bottom: 3.5rem;
}

.c-hero__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
	display: inline-flex;
	gap: 0.875rem;
	align-items: center;
	margin-bottom: 1.875rem;
}

.c-hero__eyebrow::before {
	content: "";
	width: 2rem;
	height: 1px;
	background: var(--ink-3);
}

.c-hero__title {
	font-family: var(--font-accent);
	font-size: clamp(2.5rem, 5.2vw, 4.5rem);
	line-height: 0.98;
	letter-spacing: -0.035em;
	margin-bottom: 1.75rem;
}

.c-hero__lead {
	font-size: 1.0625rem;
	color: var(--ink-2);
	line-height: 1.6;
	max-width: 42ch;
	font-weight: 300;
}

/* Quick-contact rows */

.c-quick {
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--rule-2);
}

.c-quick__row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 1.125rem;
	padding: 1.125rem 0.25rem;
	border-bottom: 1px solid var(--rule-2);
	transition: padding 0.18s ease, color 0.18s ease;
}

a.c-quick__row:hover {
	padding-left: 0.625rem;
	color: var(--ink);
}

.c-quick__icon {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	border: 1px solid var(--rule);
	display: grid;
	place-items: center;
	color: var(--ink);
	flex-shrink: 0;
}

.c-quick__icon svg {
	width: 1.0625rem;
	height: 1.0625rem;
	stroke-width: 1.6;
}

.c-quick__label {
	display: flex;
	flex-direction: column;
	gap: 0.1875rem;
}

.c-quick__label small {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.59375rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
}

.c-quick__label b {
	font-family: var(--font-accent);
	font-weight: 600;
	font-size: 1.05rem;
	letter-spacing: -0.01em;
	color: var(--ink);
}

.c-quick__arrow {
	width: 0.9375rem;
	height: 0.9375rem;
	color: var(--ink-3);
	transition: transform 0.18s ease;
}

a.c-quick__row:hover .c-quick__arrow {
	transform: translateX(4px);
	color: var(--color-accent);
}

.c-quick__msgbtns {
	display: flex;
	gap: 0.5rem;
}

.c-quick__msgbtn {
	width: 2.625rem;
	height: 2.625rem;
	border-radius: 50%;
	border: 1px solid var(--rule);
	display: grid;
	place-items: center;
	color: var(--ink);
	background: var(--color-white);
	transition: border-color 0.16s, color 0.16s, transform 0.16s;
}

.c-quick__msgbtn:hover {
	transform: translateY(-2px);
}

.c-quick__msgbtn svg {
	width: 1.1875rem;
	height: 1.1875rem;
}

.c-quick__msgbtn--wa:hover {
	border-color: #1f8a5b;
	color: #1f8a5b;
}

.c-quick__msgbtn--tg:hover {
	border-color: #2a6fdb;
	color: #2a6fdb;
}

/* Visit section (showroom + ask) */

.c-visit {
	display: grid;
	grid-template-columns: 1.55fr 1fr;
	gap: 1.5rem;
	margin-bottom: 1.5rem;
	align-items: stretch;
}

.c-showroom {
	display: flex;
	flex-direction: column;
}

.c-showroom__photo-btn,
.c-showroom__thumb-btn {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: zoom-in;
}

.c-showroom__photo {
	width: 100%;
	aspect-ratio: 16 / 10;
	border: 1px solid var(--rule);
	border-radius: var(--header-radius);
	object-fit: cover;
}

.c-showroom__thumbs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.75rem;
	margin-top: 0.75rem;
}

.c-showroom__thumb {
	width: 100%;
	aspect-ratio: 4 / 3;
	border: 1px solid var(--rule);
	border-radius: 0.75rem;
	object-fit: cover;
}

.c-showroom__cap {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	margin: 0.875rem 0.125rem 0;
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.625rem;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
}

.c-showroom__dot {
	width: 0.25rem;
	height: 0.25rem;
	border-radius: 50%;
	background: var(--ok);
}

/* Showroom info block */

.c-sb {
	margin-top: 1.25rem;
	background: var(--color-white);
	border: 1px solid var(--rule);
	border-radius: var(--header-radius);
	padding: 1.875rem 2rem;
}

.c-sb__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem;
	padding-bottom: 1.375rem;
	margin-bottom: 1.375rem;
	border-bottom: 1px solid var(--rule-2);
}

.c-sb__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.65625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
	margin-bottom: 0.5rem;
}

.c-sb__title {
	font-family: var(--font-accent);
	font-size: 1.85rem;
	line-height: 1.05;
}

.c-sb__status {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.65625rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ok);
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	border: 1px solid var(--rule);
	border-radius: 999px;
	padding: 0.5rem 0.875rem;
	background: var(--color-bg);
}

.c-sb__status-dot {
	width: 0.375rem;
	height: 0.375rem;
	border-radius: 50%;
	background: var(--ok);
	box-shadow: 0 0 0 3px rgba(63, 122, 78, 0.16);
}

.c-sb__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-bottom: 1.625rem;
}

.c-sb__cell {
	padding: 0 1.625rem;
}

.c-sb__cell:first-child {
	padding-left: 0;
}

.c-sb__cell:not(:last-child) {
	border-right: 1px solid var(--rule-2);
}

.c-sb__cell-key {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.625rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
	margin-bottom: 0.75rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.c-sb__cell-key svg {
	width: 0.875rem;
	height: 0.875rem;
	stroke-width: 1.6;
	color: var(--ink);
}

.c-sb__cell-val {
	font-size: 0.875rem;
	color: var(--ink);
	line-height: 1.65;
}

.c-sb__actions {
	display: flex;
	gap: 0.625rem;
	flex-wrap: wrap;
}

.c-sb__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.84375rem;
	font-weight: 600;
	padding: 0.75rem 1.125rem;
	border-radius: 0.6875rem;
	border: 1px solid transparent;
	cursor: pointer;
	transition: 0.16s;
}

.c-sb__btn svg {
	width: 0.9375rem;
	height: 0.9375rem;
}

.c-sb__btn--dark {
	background: var(--ink);
	color: var(--color-white);
}

.c-sb__btn--dark:hover {
	background: #1c1916;
}

.c-sb__btn--ghost {
	background: transparent;
	border-color: var(--rule);
	color: var(--ink);
}

.c-sb__btn--ghost:hover {
	border-color: var(--ink);
}

/* Ask form */

.c-ask {
	background: var(--color-white);
	border: 1px solid var(--rule);
	border-radius: var(--header-radius);
	padding: 2.125rem 2rem;
	display: flex;
	flex-direction: column;
}

.c-ask__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
	margin-bottom: 1rem;
}

.c-ask__title {
	font-family: var(--font-accent);
	font-size: 1.7rem;
	line-height: 1.08;
	margin-bottom: 0.5rem;
}

.c-ask__note {
	font-size: 0.84375rem;
	color: var(--ink-2);
	line-height: 1.55;
	margin: 0 0 1.625rem;
	font-weight: 300;
}

.c-ask__form {
	display: flex;
	flex-direction: column;
	gap: 0.875rem;
}

.c-ask__hp {
	position: absolute;
	left: -9999px;
	opacity: 0;
	height: 0;
	width: 0;
}

.c-ask__row2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.875rem;
}

.c-ask__field {
	display: flex;
	flex-direction: column;
	gap: 0.4375rem;
}

.c-ask__label {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.59375rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
}

.c-ask__field input,
.c-ask__field textarea {
	font-family: var(--font-primary);
	font-size: 0.875rem;
	color: var(--ink);
	background: var(--color-bg);
	border: 1px solid var(--rule);
	border-radius: 0.625rem;
	padding: 0.75rem 0.875rem;
	transition: border-color 0.16s, background 0.16s;
}

.c-ask__field input::placeholder,
.c-ask__field textarea::placeholder {
	color: var(--ink-3);
}

.c-ask__field input:focus,
.c-ask__field textarea:focus {
	outline: none;
	border-color: var(--ink);
	background: var(--color-white);
}

.c-ask__field textarea {
	resize: vertical;
	min-height: 5.75rem;
	line-height: 1.5;
}

.c-ask__consent {
	display: flex;
	gap: 0.5625rem;
	align-items: flex-start;
	font-size: 0.71875rem;
	color: var(--ink-3);
	line-height: 1.5;
	margin-top: 0.125rem;
	cursor: pointer;
}

.c-ask__consent input {
	margin-top: 0.125rem;
	accent-color: var(--color-accent);
	width: 0.875rem;
	height: 0.875rem;
	flex-shrink: 0;
}

.c-ask__consent a {
	color: var(--ink-2);
	text-decoration: underline;
}

.c-ask__submit {
	width: 100%;
	margin-top: 0.375rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-family: var(--font-primary);
	font-size: 0.84375rem;
	font-weight: 600;
	padding: 0.75rem 1.125rem;
	border-radius: 0.6875rem;
	border: none;
	cursor: pointer;
	background: var(--color-accent);
	color: var(--color-white);
	transition: background 0.16s;
}

.c-ask__submit:hover {
	background: var(--color-accent-hover);
}

.c-ask__submit:disabled {
	opacity: 0.7;
	cursor: default;
}

.c-ask__submit svg {
	width: 0.9375rem;
	height: 0.9375rem;
}

.c-ask__foot {
	margin-top: 1.125rem;
	padding-top: 1.125rem;
	border-top: 1px solid var(--rule-2);
	display: flex;
	align-items: center;
	gap: 0.625rem;
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.625rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
}

.c-ask__foot a {
	color: var(--ink);
}

.c-ask__foot-dot {
	width: 0.3125rem;
	height: 0.3125rem;
	border-radius: 50%;
	background: var(--ok);
}

/* Ask form — validation */

.c-ask__field input.is-invalid,
.c-ask__field textarea.is-invalid {
	border-color: var(--color-accent);
}

.c-ask__consent input.is-invalid {
	outline: 1px solid var(--color-accent);
}

.c-ask__error {
	display: block;
	margin-top: 0.25rem;
	font-family: var(--font-primary);
	font-size: 0.75rem;
	color: var(--color-accent);
}

.c-ask__error[hidden] {
	display: none;
}

/* Instagram Grid */

.ig-grid {
	padding: 4rem 2rem 3rem;
	max-width: var(--maxw);
	margin: 0 auto;
}

.ig-grid__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.5rem;
	flex-wrap: wrap;
}

.ig-grid__heading {
	font-family: var(--font-accent);
	font-size: 2rem;
	font-weight: 300;
	color: var(--color-primary);
	margin: 0;
}

.ig-grid__heading strong {
	font-weight: 700;
}

.ig-grid__heading a {
	color: inherit;
	text-decoration: none;
}

.ig-grid__heading a:hover,
.ig-grid__heading a:focus-visible {
	color: var(--color-accent);
}

.ig-grid__handle {
	font-family: var(--font-primary);
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition);
}

.ig-grid__handle:hover,
.ig-grid__handle:focus-visible {
	color: var(--color-accent);
}

.ig-grid__tiles {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 0.5rem;
}

.ig-tile {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 0.5rem;
	aspect-ratio: 1;
}

.ig-tile__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

.ig-tile:hover .ig-tile__img,
.ig-tile:focus-visible .ig-tile__img {
	transform: scale(1.06);
}

.ig-tile__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	background: rgba(9, 39, 106, 0.55);
	color: #fff;
	opacity: 0;
	transition: opacity 0.3s ease;
	padding: 1rem;
	text-align: center;
}

.ig-tile:hover .ig-tile__overlay,
.ig-tile:focus-visible .ig-tile__overlay {
	opacity: 1;
}

.ig-tile__icon {
	width: 2rem;
	height: 2rem;
}

.ig-tile__icon svg {
	width: 100%;
	height: 100%;
}

.ig-tile__caption {
	font-family: var(--font-primary);
	font-size: 0.75rem;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

@media (max-width: 75em) {
	.ig-grid__tiles {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Map */

.c-map {
	margin: 2.5rem 0 0;
	padding: 0 2rem;
	max-width: var(--maxw);
	margin-left: auto;
	margin-right: auto;
}

.c-map__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	margin-bottom: 1.125rem;
	flex-wrap: wrap;
}

.c-map__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
}

.c-map__more {
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--ink-2);
	display: inline-flex;
	gap: 0.5rem;
	align-items: center;
}

.c-map__more svg {
	width: 0.875rem;
	height: 0.875rem;
}

.c-map__wrap {
	position: relative;
	border: 1px solid var(--rule);
	border-radius: var(--header-radius);
	overflow: hidden;
	background: #e6e0d3;
}

.c-map__iframe {
	display: block;
	width: 100%;
	height: 27.5rem;
	border: 0;
	filter: grayscale(0.12) contrast(0.98);
}

.c-map__placeholder {
	display: grid;
	place-items: center;
	height: 27.5rem;
	color: var(--ink-3);
}

.c-map__card {
	position: absolute;
	left: 3rem;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 18.75rem;
	background: var(--color-white);
	border: 1px solid var(--rule);
	border-radius: 0.875rem;
	padding: 1.5rem 1.625rem;
	box-shadow: 0 1.5rem 3.125rem -1.75rem rgba(45, 42, 38, 0.4);
}

.c-map__card-eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 0.59375rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-3);
	font-weight: 500;
	margin-bottom: 0.625rem;
}

.c-map__card-title {
	font-family: var(--font-accent);
	font-weight: 600;
	font-size: 1.25rem;
	letter-spacing: -0.015em;
	margin-bottom: 0.375rem;
}

.c-map__card-addr {
	font-size: 0.84375rem;
	color: var(--ink-2);
	line-height: 1.55;
	margin: 0 0 1.25rem;
}

.c-map__card-btn {
	width: 100%;
	justify-content: center;
}

/* Contacts mobile */

@media (max-width: 61.99em) {
	.c-hero {
		grid-template-columns: 1fr;
		gap: 2.25rem;
	}

	.c-visit {
		grid-template-columns: 1fr;
	}

	.c-sb__grid {
		grid-template-columns: 1fr;
	}

	.c-sb__cell {
		padding: 1.125rem 0;
		border-right: 0;
		border-bottom: 1px solid var(--rule-2);
	}

	.c-sb__cell:first-child {
		padding-top: 0;
	}

	.c-sb__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.875rem;
	}

	.c-ask__row2 {
		grid-template-columns: 1fr;
	}

	.c-map__card {
		position: static;
		transform: none;
		width: auto;
		margin: 1.125rem;
		box-shadow: none;
	}

	.c-showroom__thumbs {
		grid-template-columns: repeat(2, 1fr);
	}

	.ig-grid {
		padding: 3rem 1rem 2rem;
	}

	.ig-grid__heading {
		font-size: 1.5rem;
	}

	.ig-grid__tiles {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ==========================================================================
   Interior Design page blocks
   ========================================================================== */

/* --- Principles (4 cards) --- */
.principles {
	padding-bottom: 0;
}

.principles__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
}

.principle {
	background: var(--color-white, #fff);
	border-radius: 20px;
	padding: 1.9rem 2rem 1.8rem;
	display: flex;
	gap: 1.2rem;
	align-items: flex-start;
}

.principle__icon {
	flex: 0 0 44px;
	height: 44px;
	border-radius: 12px;
	background: rgba(171, 7, 51, .07);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-accent, #ab0733);
}

.principle__icon svg {
	width: 22px;
	height: 22px;
}

.principle p {
	margin: 0;
	padding-top: .45rem;
	font-weight: 500;
	line-height: 1.5;
}

/* --- Spaces we create (photo + text cards) --- */
.spaces {
	padding-bottom: 5.5rem;
}

.spaces__head {
	margin-bottom: 2.2rem;
}

.spaces__head h2 {
	font-size: clamp(1.8rem, 3.2vw, 2.6rem);
	margin: .9rem 0 0;
}

.space {
	background: var(--color-white, #fff);
	border-radius: 20px;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin-bottom: 1.5rem;
}

.space--flip .space__media {
	order: 2;
}

.space__media {
	min-height: 420px;
	background-color: #e9e5dc;
	background-size: cover;
	background-position: center;
}

.space__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.space__body {
	padding: 3rem 3.2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.space__body h3 {
	font-size: 1.65rem;
	margin: .9rem 0 1.1rem;
}

.space__body p {
	color: var(--ink-2, #555);
	font-size: 1rem;
	margin: 0 0 1rem;
}

.space__body p.pull {
	color: var(--ink, #2d2a26);
	font-weight: 500;
	font-size: 1.08rem;
}

.space__body p:last-child {
	margin-bottom: 0;
}

.eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: .75rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-accent, #ab0733);
	display: flex;
	align-items: center;
	gap: .6rem;
}

.eyebrow::before {
	content: "";
	width: 22px;
	height: 2px;
	background: var(--color-accent, #ab0733);
}

@media (max-width: 61.99em) {
	.principles__grid {
		grid-template-columns: 1fr;
	}

	.space {
		grid-template-columns: 1fr;
	}

	.space--flip .space__media {
		order: 0;
	}

	.space__media {
		min-height: 260px;
	}

	.space__body {
		padding: 2rem 1.5rem;
	}
}