/*
Theme Name: Thepiecraft
Theme URI: https://thepiecraft.com
Author: Manthan Sawant
Author URI: https://thepiecraft.com
Description: Premium handcrafted carpet and rugs ecommerce WordPress theme. Editorial luxury aesthetic, WooCommerce-ready, optimized for the Indian market.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
WC requires at least: 8.0
WC tested up to: 9.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: thepiecraft
Tags: ecommerce, woocommerce, custom-logo, custom-menu, custom-colors, featured-images, full-width-template, theme-options, threaded-comments, translation-ready
*/

/* =========================================================================
   THEPIECRAFT MASTER STYLESHEET
   1. Reset
   2. CSS Variables (Tokens)
   3. Base typography
   4. Layout primitives
   5. Buttons
   6. Header / Nav
   7. Announcement bar
   8. Mobile menu / Search overlay
   9. Hero
   10. Sections (categories, spaces, products, story, stats, testimonials, instagram, newsletter)
   11. Product card
   12. WooCommerce overrides
   13. Single product
   14. Cart drawer
   15. Footer
   16. Page templates (about, contact, collections)
   17. 404, Search
   18. Reveal animations / utilities
   19. Responsive
   ========================================================================= */

/* -----------------------------------------------------------------
   1. RESET
   ----------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: hidden; }
body, h1, h2, h3, h4, h5, h6, p, blockquote, figure, ul, ol, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 2px;
}
::selection { background: var(--color-gold); color: #fff; }

/* -----------------------------------------------------------------
   2. TOKENS
   ----------------------------------------------------------------- */
:root {
	/* New Brand Palette */
	--tea-green: #ccd5aeff;
	--beige: #F0EDE6; /* Slightly darker than bg for depth */
	--cornsilk: #F7F4EF; /* User specified primary bg */
	--papaya-whip: #faedcdff;
	--light-bronze: #d4a373ff;

	/* Functional Mapping */
	--color-bg: var(--cornsilk);
	--color-surface: var(--beige);
	--color-text: #1C1A16;
	--color-text-muted: #56504C; /* Deepened for better contrast */
	--color-text-faint: #827B75; /* Deepened for better contrast */
	--color-gold: #AF835A;       /* Richer bronze for better legibility */
	--color-gold-hover: #966b45;
	--color-dark: #1C1A16;
	--color-border: rgba(28, 26, 22, 0.08);
	--color-border-strong: rgba(28, 26, 22, 0.15);
	--color-tag-bg: var(--papaya-whip);
	--color-success: var(--tea-green);
	--color-error: #B53A2F;

	/* Typography */
	--font-display: 'Bodoni Moda', 'Cormorant Garamond', serif;
	--font-body: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	/* Sizing */
	--container: 1320px;
	--container-narrow: 960px;
	--gutter: clamp(20px, 4vw, 48px);
	--header-h: 75px; /* Ultra-slim designer height */
	--bar-h: 38px;

	/* Radii / shadows */
	--radius: 2px;
	--radius-lg: 6px;
	--shadow-sm: 0 2px 8px rgba(28, 26, 22, 0.06);
	--shadow-md: 0 8px 30px rgba(28, 26, 22, 0.08);
	--shadow-lg: 0 20px 60px rgba(28, 26, 22, 0.12);

	/* Motion */
	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--dur-fast: 180ms;
	--dur: 320ms;
	--dur-slow: 600ms;
}

/* -----------------------------------------------------------------
   3. BASE TYPOGRAPHY
   ----------------------------------------------------------------- */
body {
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

h1, h2, h3, h4 {
	font-family: var(--font-display);
	font-weight: 400;
	letter-spacing: -0.01em;
	line-height: 1.1;
	color: var(--color-text);
}
h1 { font-size: clamp(2.5rem, 6vw, 5rem); font-weight: 300; }
h2 { font-size: clamp(2rem, 4vw, 3.25rem); }
h3 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
h4 { font-size: clamp(1.125rem, 1.6vw, 1.375rem); font-family: var(--font-body); font-weight: 500; letter-spacing: 0.02em; }
em, .italic { font-style: italic; }

p { color: var(--color-text); line-height: 1.7; }
p + p { margin-top: 1em; }

.eyebrow-label, .hero-eyebrow {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	font-family: var(--font-body);
}

.gold-text { color: var(--color-gold); }
.text-muted { color: var(--color-text-muted); }

/* -----------------------------------------------------------------
   4. LAYOUT PRIMITIVES
   ----------------------------------------------------------------- */
.container,
.container-narrow,
.container-wide {
	width: 100%;
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.container { max-width: var(--container); }
.container-narrow { max-width: var(--container-narrow); }
.container-wide { max-width: 1540px; }

.section { padding-block: clamp(48px, 8vw, 50px); }
.section-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: clamp(28px, 4vw, 56px);
	padding-bottom: 16px;
	border-bottom: 1px solid var(--color-border);
}
.section-header h2 { margin: 0; }
.section-header.centered {
	flex-direction: column;
	align-items: center;
	text-align: center;
	border-bottom: 0;
	padding-bottom: 0;
}
.section-header.centered p { color: var(--color-text-muted); margin-top: 8px; }
.section-header.light h2,
.section-header.light p { color: var(--color-bg); }
.section-link {
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.05em;
	color: var(--color-text);
	border-bottom: 1px solid currentColor;
	padding-bottom: 2px;
	transition: color var(--dur) var(--ease);
}
.section-link:hover { color: var(--color-gold); }
.section-cta { margin-top: 48px; }
.section-cta.centered { text-align: center; }

.dark-section {
	background: var(--color-dark);
	color: var(--color-bg);
}
.dark-section h1, .dark-section h2, .dark-section h3, .dark-section h4 {
	color: var(--color-bg);
}
.dark-section p { color: rgba(247, 244, 239, 0.8); }

/* -----------------------------------------------------------------
   5. BUTTONS
   ----------------------------------------------------------------- */
.btn-primary, .btn-outline, .btn-outline-white, .btn-text-link, .btn-text-gold {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: all var(--dur) var(--ease);
	cursor: pointer;
}
.btn-primary {
	background: var(--color-gold);
	color: var(--cornsilk);
	padding: 16px 36px;
	border: 1px solid var(--color-gold);
}
.btn-primary:hover {
	background: var(--color-gold-hover);
	border-color: var(--color-gold-hover);
	transform: translateY(-1px);
}
.btn-outline {
	background: transparent;
	color: var(--color-text);
	border: 1px solid var(--color-text);
	padding: 16px 36px;
}
.btn-outline:hover {
	background: var(--color-text);
	color: var(--color-bg);
}
.btn-outline-white {
	background: transparent;
	color: var(--cornsilk);
	border: 1px solid var(--cornsilk);
	padding: 12px 24px;
}
.btn-outline-white:hover {
	background: var(--color-bg);
	color: var(--color-text);
}
.btn-text-link, .btn-text-gold {
	color: var(--color-text);
	padding: 4px 0;
	border-bottom: 1px solid currentColor;
	letter-spacing: 0.06em;
	text-transform: none;
	font-size: 15px;
}
.btn-text-gold { color: var(--color-gold); }
.btn-text-link:hover, .btn-text-gold:hover { color: var(--color-gold-hover); transform: translateX(4px); }

/* -----------------------------------------------------------------
   6. HEADER / NAV
   ----------------------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 90;
	background: rgba(247, 244, 239, 0.92); /* New brand tone with opacity */
	backdrop-filter: saturate(160%) blur(14px);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid var(--color-border);
	transition: background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.site-header.is-scrolled { box-shadow: var(--shadow-sm); }

.header-inner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: clamp(12px, 3vw, 40px);
	min-height: var(--header-h);
}

.site-logo { display: inline-flex; color: var(--color-text); }
.logo-img {
	height: 48px; /* Refined lettermark scale */
	max-width: 240px;
	object-fit: contain;
	display: block;
}

.primary-nav { justify-self: center; }
.nav-menu {
	display: flex;
	gap: 36px;
	align-items: center;
}
.nav-menu a {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-text);
	padding-block: 8px;
	position: relative;
	transition: color var(--dur) var(--ease);
}
.nav-menu a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 2px;
	height: 1px;
	background: var(--color-gold);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform var(--dur) var(--ease);
}
.nav-menu a:hover { color: var(--color-gold); }
.nav-menu a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav-menu .current-menu-item > a { color: var(--color-gold); }

.header-icons {
	display: flex;
	align-items: center;
	gap: 8px;
}
.icon-btn {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: var(--color-text);
	position: relative;
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.icon-btn:hover { background: var(--color-tag-bg); color: var(--color-gold); }
.icon-btn svg { width: 20px; height: 20px; }
.stock-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.05em;
	padding: 6px 10px;
	border-radius: 999px;
	background: var(--tea-green);
	color: #2D4F36;
}
.cart-count {
	position: absolute;
	top: 4px;
	right: 4px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--color-gold);
	color: var(--cornsilk);
	font-size: 10px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.hamburger {
	display: none;
	width: 40px;
	height: 40px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
}
.hamburger span {
	display: block;
	width: 22px;
	height: 1.5px;
	background: var(--color-text);
	transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.hamburger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* -----------------------------------------------------------------
   7. ANNOUNCEMENT BAR
   ----------------------------------------------------------------- */
.announcement-bar {
	background: var(--light-bronze);
	border-bottom: 0;
	color: var(--cornsilk);
	overflow: hidden;
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	min-height: var(--bar-h);
	display: flex;
	align-items: center;
}
.marquee {
	display: flex;
	gap: 64px;
	white-space: nowrap;
	animation: marquee 38s linear infinite;
	will-change: transform;
}
.marquee span { padding-inline: 32px; }
@keyframes marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

/* -----------------------------------------------------------------
   8. MOBILE MENU / SEARCH OVERLAY
   ----------------------------------------------------------------- */
.mobile-overlay, .search-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(28, 26, 22, 0.45);
	z-index: 95;
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--dur) var(--ease);
}
.mobile-overlay.is-open, .search-backdrop.is-open { opacity: 1; pointer-events: auto; }

.mobile-menu {
	position: fixed;
	top: 0; right: 0;
	height: 100dvh;
	width: min(380px, 88vw);
	background: var(--color-bg);
	z-index: 100;
	transform: translateX(100%);
	transition: transform var(--dur) var(--ease);
	padding: 72px clamp(16px, 6vw, 32px) 32px;
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
}
.mobile-menu.is-open { transform: translateX(0); }
.mobile-menu-close {
	position: absolute;
	top: 18px; right: 24px;
	font-size: 32px;
	line-height: 1;
	color: var(--color-text);
}
.mobile-nav-list { display: flex; flex-direction: column; gap: 4px; }
.mobile-nav-list a {
	font-family: var(--font-display);
	font-size: clamp(22px, 6vw, 28px);
	padding: 10px 0;
	border-bottom: 1px solid var(--color-border);
	display: block;
}
.mobile-nav-list a:hover { color: var(--color-gold); }
.mobile-menu-footer {
	margin-top: auto;
	padding-top: 32px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 14px;
	letter-spacing: 0.05em;
}

/* Mobile Navigation Sidebar Tools (Location & Currency) */
.mobile-menu-tools {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--color-border);
	width: 100%;
}

.mobile-tool-item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	min-width: 0;
	background: var(--color-surface);
	border: 1px solid var(--color-border-strong);
	padding: 11px 14px;
	border-radius: var(--radius, 2px);
	cursor: pointer;
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 500;
	transition: all 180ms var(--ease);
	box-sizing: border-box;
}

.mobile-tool-item:hover {
	border-color: var(--color-gold);
	background: rgba(175, 131, 90, 0.05);
}

.mobile-tool-item svg {
	color: var(--color-gold);
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}

.mobile-tool-item span,
.mobile-tool-item label {
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mobile-tool-item select {
	background: transparent;
	border: none;
	color: inherit;
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	outline: none;
	width: 100%;
	min-width: 0;
	flex: 1;
	padding: 0;
	margin: 0;
	height: auto;
	max-width: 100%;
}

.search-overlay {
	position: fixed;
	top: 0; left: 0; right: 0;
	background: var(--color-surface);
	z-index: 100;
	padding: 80px 24px 60px;
	transform: translateY(-100%);
	transition: transform var(--dur) var(--ease);
	box-shadow: var(--shadow-md);
}
.search-overlay.is-open { transform: translateY(0); }
.search-overlay form {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	gap: 12px;
	border-bottom: 1px solid var(--color-text);
	padding-bottom: 8px;
}
.search-overlay input[type="search"] {
	flex: 1;
	font-family: var(--font-display);
	font-size: clamp(20px, 4vw, 32px);
	background: transparent;
	border: 0;
	padding: 10px 0;
}
.search-overlay button[type="submit"] {
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0 16px;
	color: var(--color-gold);
}
.search-overlay-close {
	position: absolute;
	top: 18px; right: 24px;
	font-size: 32px; line-height: 1;
}
.search-hint {
	max-width: 720px;
	margin: 12px auto 0;
	font-size: 13px;
	color: var(--color-text-muted);
}

/* -----------------------------------------------------------------
   9. HERO
   ----------------------------------------------------------------- */
.hero {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	min-height: calc(100vh - var(--header-h) - var(--bar-h));
	background: var(--color-bg);
}
.hero-content {
	padding: clamp(40px, 6vw, 100px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 24px;
}
.hero-eyebrow { color: var(--color-gold); }
.hero-heading {
	font-size: clamp(3rem, 7vw, 6rem);
	font-weight: 300;
	line-height: 1.02;
	letter-spacing: -0.02em;
}
.hero-heading em {
	display: block;
	color: var(--color-gold);
	font-weight: 400;
}
.hero-sub {
	font-size: clamp(16px, 1.4vw, 18px);
	color: var(--color-text-muted);
	max-width: 460px;
}
.hero-actions {
	display: flex;
	gap: 24px;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 8px;
}
.hero-image {
	overflow: hidden;
	position: relative;
}
.hero-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1);
	transition: transform 1.2s var(--ease);
}
.hero-image:hover img { transform: scale(1.03); }

/* -----------------------------------------------------------------
   10A. TRUST BAR
   ----------------------------------------------------------------- */
.trust-bar {
	background: var(--color-surface);
	border-block: 1px solid var(--color-border);
	padding-block: 28px;
}
.trust-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	text-align: center;
}
.trust-item {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-size: 13px;
	letter-spacing: 0.05em;
	color: var(--color-text-muted);
}
.trust-icon { font-size: 18px; }

/* -----------------------------------------------------------------
   10B. FEATURED CATEGORIES
   ----------------------------------------------------------------- */
.categories-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.categories-carousel-wrapper.full-width {
	margin-top: 40px;
	width: 100%;
	overflow: hidden;
	position: relative;
}
.categories-carousel {
	width: 100%;
	padding: 0 0 40px; /* Removed horizontal padding for edge-to-edge marquee */
	overflow: hidden; /* Ensure it stays contained */
}
.featured-categories .carousel-arrow {
	display: none; /* Marquee doesn't need manual triggers */
}
.categories-track {
	display: flex;
	justify-content: flex-start; /* Start flush at the edge */
	gap: 32px;
	animation: marquee 60s linear infinite; /* Luxury slow flow */
	will-change: transform;
	width: max-content;
}
.categories-carousel-wrapper:hover .categories-track {
	animation-play-state: paused; /* Hold on hover */
}
@keyframes marquee {
	0% { transform: translateX(0); }
	100% { transform: translateX(-33.333%); } /* Perfect reset for 3 sets of items */
}

.collection-card {
	flex: 0 0 420px; /* Highlighting categories with larger scale */
	transition: all var(--dur) var(--ease);
}
.collection-card:hover {
	transform: translateY(-12px);
}
.collection-card a { display: block; text-align: center; }
.collection-image {
	aspect-ratio: 4 / 5.5;
	overflow: hidden;
	border-radius: 4px; /* More refined radius */
	margin-bottom: 20px;
	box-shadow: 0 4px 20px rgba(28, 26, 22, 0.04);
}
.collection-image img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 1.5s var(--ease);
}
.collection-card:hover .collection-image img { transform: scale(1.08); }

.collection-info {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
}
.collection-title {
	font-family: var(--font-display);
	font-size: 20px;
	font-style: italic;
	font-weight: 400;
	color: var(--color-text);
	margin: 0;
	letter-spacing: 0.01em;
}
.collection-subtitle {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	color: var(--color-gold);
	opacity: 0.7;
	transition: opacity var(--dur) var(--ease);
}
.collection-card:hover .collection-subtitle { opacity: 1; }

/* Category Carousel Arrows */
.carousel-arrow {
	position: absolute;
	top: 44%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-muted);
	z-index: 10;
	cursor: pointer;
	transition: all var(--dur) var(--ease);
	opacity: 1; /* Always visible for accessibility */
	box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}
.carousel-arrow svg { width: 18px; height: 18px; stroke-width: 1.2; }
.carousel-arrow:hover { background: var(--color-gold); color: #fff; border-color: var(--color-gold); }
.carousel-arrow.prev { left: -150px; }
.carousel-arrow.next { right: -150px; }

@media (max-width: 1700px) {
	.carousel-arrow.prev { left: -40px; }
	.carousel-arrow.next { right: -40px; }
}
@media (max-width: 1300px) {
	.carousel-arrow.prev { left: 12px; }
	.carousel-arrow.next { right: 12px; }
}

@media (max-width: 1280px) {
	.collection-card { flex: 0 0 320px; }
}
@media (max-width: 1024px) {
	.collection-card { flex: 0 0 280px; }
	.carousel-arrow { display: none; }
	.categories-carousel { gap: 24px; }
}
@media (max-width: 768px) {
	.collection-card { flex: 0 0 240px; }
	.categories-carousel { gap: 16px; }
}
@media (max-width: 480px) {
	.collection-card { flex: 0 0 200px; }
}

/* -----------------------------------------------------------------
   10C. SHOP BY ROOMS
   ----------------------------------------------------------------- */
.shop-by-rooms { padding-block: 50px; }
.rooms-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
.room-card {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5.2;
	overflow: hidden;
	background: var(--color-bg);
}
.room-image {
	height: 100%;
	width: 100%;
	transition: transform 1.8s var(--ease);
}
.room-card:hover .room-image {
	transform: scale(1.06);
}
.room-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.room-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	padding: 40px;
	background: linear-gradient(to top, rgba(28, 26, 22, 0.45) 0%, transparent 50%);
	color: var(--cornsilk);
	opacity: 0.95;
	transition: all 0.6s var(--ease);
}
.room-card:hover .room-overlay {
	background: linear-gradient(to top, rgba(28, 26, 22, 0.6) 0%, transparent 60%);
	opacity: 1;
}
.room-overlay h3 {
	color: var(--cornsilk);
	font-family: var(--font-display);
	font-weight: 400;
	font-size: clamp(20px, 2vw, 24px);
	letter-spacing: 0.03em;
	margin: 0;
	font-style: italic;
	transition: transform 0.6s var(--ease);
}
.room-card:hover .room-overlay h3 {
	transform: translateY(-5px);
}
.room-card::after {
	content: "";
	position: absolute;
	inset: 20px;
	border: 1px solid rgba(255, 255, 255, 0);
	transition: all 0.6s var(--ease);
	pointer-events: none;
	z-index: 2;
}
.room-card:hover::after {
	border-color: rgba(255, 255, 255, 0.3);
	inset: 24px;
}

@media (max-width: 1024px) {
	.rooms-grid { gap: 16px; }
	.room-overlay { padding-bottom: 32px; }
	.room-overlay h3 { font-size: 16px; }
}
@media (max-width: 768px) {
	.rooms-grid { grid-template-columns: 1fr; gap: 20px; }
	.room-card { aspect-ratio: 4 / 3; }
}

/* -----------------------------------------------------------------
   10D. PRODUCT GRID
   ----------------------------------------------------------------- */
.products-grid {
	display: grid;
	gap: 28px 20px;
}
.products-grid[data-columns="4"] { grid-template-columns: repeat(4, 1fr); }
.products-grid[data-columns="3"] { grid-template-columns: repeat(3, 1fr); }
.products-grid[data-columns="2"] { grid-template-columns: repeat(2, 1fr); }

.products-scroll-row {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(280px, 1fr);
	gap: 20px;
	overflow-x: auto;
	padding-bottom: 16px;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
}
.products-scroll-row > * { scroll-snap-align: start; }

/* -----------------------------------------------------------------
   10E. BRAND STORY
   ----------------------------------------------------------------- */
.story-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(32px, 5vw, 80px);
	align-items: center;
}
.story-image { aspect-ratio: 7 / 8; overflow: hidden; border-radius: var(--radius); }
.story-image img { width: 100%; height: 100%; object-fit: cover; }
.story-content { display: flex; flex-direction: column; gap: 20px; }
.story-content h2 { margin: 0; }

/* -----------------------------------------------------------------
   10F. STATS BAR
   ----------------------------------------------------------------- */
.stats-bar { padding-block: clamp(40px, 5vw, 80px); border-block: 1px solid var(--color-border); }
.stats-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	text-align: center;
}
.stat-item { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.stat-number, .stat-plus, .stat-percent {
	font-family: var(--font-display);
	font-size: clamp(2.25rem, 4vw, 3.5rem);
	font-weight: 300;
	color: var(--color-gold);
	line-height: 1;
}
.stat-plus, .stat-percent { display: inline-block; }
.stat-item > .stat-plus, .stat-item > .stat-percent {
	margin-top: -2.6em;
	margin-left: 2.4em;
	font-size: clamp(1.5rem, 2.4vw, 2rem);
}
.stat-label {
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-top: 8px;
}

/* -----------------------------------------------------------------
   10G. TESTIMONIALS
   ----------------------------------------------------------------- */
.testimonials-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
.testimonial-card {
	background: var(--color-surface);
	padding: 36px 32px;
	border: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	gap: 16px;
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.testimonial-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-md);
}
.testimonial-card .stars { color: var(--color-gold); letter-spacing: 2px; font-size: 14px; }
.testimonial-card blockquote {
	font-family: var(--font-display);
	font-size: 19px;
	line-height: 1.55;
	font-style: italic;
	color: var(--color-text);
}
.testi-author {
	display: flex; align-items: center; gap: 12px;
	margin-top: auto;
}
.testi-author img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.testi-author strong { display: block; font-size: 14px; }
.testi-author span { font-size: 12px; color: var(--color-text-muted); letter-spacing: 0.05em; }

/* -----------------------------------------------------------------
   10H. INSTAGRAM STRIP
   ----------------------------------------------------------------- */
.instagram-strip { padding-block: 60px 0; }
.insta-label {
	text-align: center;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 24px;
}
.insta-label strong { color: var(--color-gold); font-weight: 500; }
.insta-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 2px;
}
.insta-item { position: relative; aspect-ratio: 1; overflow: hidden; }
.insta-item img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease); }
.insta-overlay {
	position: absolute; inset: 0;
	background: rgba(28, 26, 22, 0.55);
	color: var(--cornsilk);
	display: flex; align-items: center; justify-content: center;
	opacity: 0;
	transition: opacity var(--dur) var(--ease);
}
.insta-item:hover img { transform: scale(1.06); }
.insta-item:hover .insta-overlay { opacity: 1; }

/* -----------------------------------------------------------------
   10I. NEWSLETTER
   ----------------------------------------------------------------- */
.newsletter { text-align: center; padding-block: clamp(60px, 8vw, 110px); }
.newsletter-inner { max-width: 640px; margin: 0 auto; display: flex; flex-direction: column; gap: 18px; }
.newsletter-inner h2 { color: var(--color-bg); }
.newsletter-inner p { color: rgba(247, 244, 239, 0.75); }
.newsletter-inner form,
.newsletter-inner .wpcf7-form {
	display: flex; gap: 8px; flex-wrap: wrap;
	justify-content: center;
	margin-top: 8px;
}
.newsletter-inner input[type="email"] {
	flex: 1 1 280px;
	padding: 14px 18px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.25);
	color: var(--cornsilk);
	font-size: 14px;
}
.newsletter-inner input[type="email"]::placeholder { color: rgba(255, 255, 255, 0.55); }
.newsletter-inner input[type="submit"],
.newsletter-inner button[type="submit"] {
	padding: 14px 28px;
	background: var(--color-gold);
	color: var(--cornsilk);
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border: 0;
	cursor: pointer;
	transition: background var(--dur) var(--ease);
}
.newsletter-inner input[type="submit"]:hover,
.newsletter-inner button[type="submit"]:hover { background: var(--color-gold-hover); }
.newsletter-note { font-size: 12px; color: rgba(247, 244, 239, 0.55); }

/* Artisan Features Grid */
.artisan-features { padding-block: clamp(60px, 8vw, 100px); }
.features-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 40px;
	margin-top: 60px;
}
.feature-item {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
}
.feature-icon {
	width: 80px;
	height: 80px;
	color: var(--color-text);
	transition: transform var(--dur) var(--ease), color var(--dur) var(--ease);
}
.feature-item:hover .feature-icon {
	transform: translateY(-5px);
	color: var(--color-gold);
}
.feature-label {
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text);
}

/* -----------------------------------------------------------------
   11. PRODUCT CARD
   ----------------------------------------------------------------- */
.product-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: relative;
	text-align: center;
	flex: 0 0 300px; /* Adjust size to fit 4 products */
}
.product-card-media {
	position: relative;
	aspect-ratio: 4 / 5.2;
	overflow: hidden;
	background: var(--beige); /* Replaced #F4F4F4 for softer look */
}
.product-card-media img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 1.2s var(--ease), opacity 0.8s var(--ease);
}
.product-card:hover .product-card-media img { transform: scale(1.06); }
.product-card-media .secondary-image {
	position: absolute; inset: 0;
	opacity: 0;
	transition: opacity 0.8s var(--ease), transform 1.2s var(--ease);
}
.product-card:hover .secondary-image { opacity: 1; transform: scale(1.06); }
.product-card:hover .primary-image { opacity: 0; }

.product-card-badges {
	display: none !important;
}

.product-card-actions {
	position: absolute;
	right: 14px; top: 14px;
	display: flex; flex-direction: column; gap: 8px;
	opacity: 0;
	transform: translateX(10px);
	transition: all 0.5s var(--ease);
	z-index: 5;
}
.product-card:hover .product-card-actions { opacity: 1; transform: translateX(0); }
.product-card-actions .icon-btn {
	background: var(--color-bg);
	width: 38px; height: 38px;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	box-shadow: var(--shadow-sm);
	transition: all var(--dur) var(--ease);
}
.product-card-actions .icon-btn:hover { background: var(--color-gold); color: #fff; }

.product-card-add-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid var(--color-gold);
	border-radius: 50%;
	color: var(--color-gold);
	transition: all var(--dur) var(--ease);
	margin-top: 12px;
}
.product-card-add-btn:hover {
	background: var(--color-gold);
	color: var(--cornsilk);
}
.product-card-add-btn svg {
	width: 16px;
	height: 16px;
}

.product-card-meta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 20px 10px;
}
.product-card-cat {
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
	font-weight: 500;
}
.product-card-title {
	font-family: var(--font-display);
	font-size: 20px;
	font-weight: 400;
	color: var(--color-text);
	line-height: 1.2;
	margin: 0;
	transition: color var(--dur) var(--ease);
}
.product-card-title:hover { color: var(--color-gold); }

.product-card-price {
	font-size: 15px;
	font-weight: 500;
	color: var(--color-text-muted);
}
.product-card-price ins { text-decoration: none; color: var(--color-text); }
.product-card-price del { font-size: 0.85em; opacity: 0.5; margin-right: 8px; }

.product-card-rating {
	margin-top: 4px;
	display: flex;
	align-items: center;
	gap: 4px;
}

/* Product Carousels */
.new-arrivals-carousel-wrapper,
.designers-choice-carousel-wrapper,
.best-sellers-carousel-wrapper,
.related-carousel-wrapper,
.recent-carousel-wrapper,
.categories-carousel-wrapper {
	position: relative;
	margin-top: 40px;
}
.new-arrivals-carousel,
.designers-choice-carousel,
.best-sellers-carousel,
.related-carousel,
.recent-carousel,
.categories-carousel {
	width: 100%;
	padding: 0 0 40px;
	overflow: hidden;
}

.new-arrivals-carousel-wrapper:hover .carousel-arrow,
.designers-choice-carousel-wrapper:hover .carousel-arrow,
.best-sellers-carousel-wrapper:hover .carousel-arrow,
.related-carousel-wrapper:hover .carousel-arrow,
.recent-carousel-wrapper:hover .carousel-arrow,
.categories-carousel-wrapper:hover .carousel-arrow { 
	opacity: 1; 
}

.products-track {
	display: flex;
	gap: 24px;
	transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
	will-change: transform;
}
.products-track .product-card {
	flex: 0 0 calc((100% - 3 * 24px) / 4);
	min-width: 0;
}

@media (max-width: 1024px) {
	.products-track .product-card { flex: 0 0 calc((100% - 24px) / 2); }
	.products-track { gap: 24px; }
}
@media (max-width: 768px) {
	.products-track .product-card { flex: 0 0 100%; }
	.products-track { gap: 0; }
}


/* Fix Shop Title Overlap and Clipping */
.post-type-archive-product #main,
.single-product #main {
	margin-top: 40px !important;
}
.shop-header {
	padding: 60px 0 !important;
	margin-top: 0 !important;
	text-align: center;
	border-bottom: 1px solid var(--color-border);
	overflow: visible !important; /* Allow large typography to show */
	max-height: none !important;
}
.shop-header h1 {
	margin-top: 20px;
	line-height: 1.1;
}

.woocommerce-page .container,
.woocommerce .container {}

.shop-header {
	padding: 20px 0; /* Minimalist title strip */
	text-align: center;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 32px;
	max-height: 120px; /* Safety cap to prevent 400px gap */
	overflow: hidden;
}
.shop-header h1 { margin-bottom: 12px; }
.shop-header p { color: var(--color-text-muted); max-width: 600px; margin: 0 auto; }

/* Force-hide any oversized legacy banners on Shop */
.post-type-archive-product .hero,
.post-type-archive-product .page-header,
.post-type-archive-product .banner {
	display: none !important;
}

.shop-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	margin-bottom: 32px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--color-border);
}
.shop-toolbar .woocommerce-result-count { margin: 0; color: var(--color-text-muted); font-size: 14px; }
.shop-toolbar .woocommerce-ordering select {
	padding: 10px 14px;
	border: 1px solid var(--color-border);
	background: var(--color-surface);
	font-size: 14px;
	color: var(--color-text);
}

.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 32px 24px;
	margin: 0 0 40px;
	padding: 0;
	justify-content: start !important;
}
/* Prevent pseudo-elements from taking up grid slots */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
	display: none !important;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	clear: none !important;
}

.woocommerce nav.woocommerce-pagination {
	margin: 40px 0;
	text-align: center;
}
.woocommerce nav.woocommerce-pagination ul {
	display: inline-flex ; gap: 6px;
	border: 0;
}
.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	min-width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--color-border);
	background: var(--color-surface);
	color: var(--color-text);
	font-size: 14px;
	transition: all var(--dur) var(--ease);
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
	background: var(--color-text);
	color: var(--color-bg);
	border-color: var(--color-text);
}

/* WC notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border: 1px solid var(--color-border);
	background: var(--color-surface);
	border-top: 3px solid var(--color-gold);
	padding: 16px 20px;
	font-size: 14px;
	border-radius: var(--radius);
}
.woocommerce-error { border-top-color: var(--color-error); }

/* -----------------------------------------------------------------
   13. SINGLE PRODUCT
   ----------------------------------------------------------------- */
.single-product .product {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: clamp(32px, 5vw, 80px);
	padding-top: 48px;
}
.single-product .woocommerce-product-gallery {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
}
.single-product .woocommerce-product-gallery__image img {
	width: 100%;
	border-radius: var(--radius);
}
.single-product .summary {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	padding: clamp(0px, 2vw, 24px) 0;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.single-product .product_title {
	font-family: var(--font-display);
	font-size: clamp(2rem, 3.5vw, 3rem);
	font-weight: 400;
	margin: 0;
}
.single-product .price {
	font-family: var(--font-body);
	font-size: 24px;
	font-weight: 500;
	color: var(--color-text);
}
.single-product .price del { color: var(--color-text-faint); margin-right: 12px; }
.single-product .price ins { color: var(--color-gold); text-decoration: none; }

.single-product .woocommerce-product-details__short-description {
	font-size: 16px;
	color: var(--color-text-muted);
	line-height: 1.7;
	padding-block: 8px;
	border-block: 1px solid var(--color-border);
}

.single-product table.variations { margin: 12px 0; }
.single-product table.variations th,
.single-product table.variations td { padding: 8px 0; }
.single-product table.variations label {
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}
.single-product table.variations select {
	padding: 12px 14px;
	border: 1px solid var(--color-border);
	background: var(--color-surface);
	min-width: 220px;
}

.single-product .quantity input.qty {
	width: 70px;
	padding: 14px 10px;
	border: 1px solid var(--color-border);
	text-align: center;
	font-size: 15px;
}

.single-product button.single_add_to_cart_button.cart-button {
	position: relative;
	padding: 18px 40px !important;
	width: 100%;
	height: 56px;
	background: var(--color-gold) !important;
	color: var(--cornsilk) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-size: 14px !important;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	cursor: pointer;
	overflow: hidden;
	transition: 0.3s var(--ease);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.cart-button:hover {
	background: var(--color-gold-hover) !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(184, 150, 107, 0.25);
}

.cart-button:active {
	transform: scale(0.98) translateY(0);
}

.cart-button span {
	position: absolute;
	z-index: 3;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	text-align: center;
}

.cart-button span.add-to-cart { opacity: 1; }
.cart-button span.added { opacity: 0; }

.cart-button .cart-icon {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: -10%;
	transform: translate(-50%, -50%);
}

.cart-button .box-icon {
	position: absolute;
	z-index: 1;
	top: -20%;
	left: 52%;
	transform: translate(-50%, -50%);
}

/* Clicked State Animations */
.cart-button.clicked .cart-icon {
	animation: cartMove 2s var(--ease) forwards;
}

.cart-button.clicked .box-icon {
	animation: boxDrop 2s var(--ease) forwards;
}

.cart-button.clicked span.add-to-cart {
	animation: textOut 2s var(--ease) forwards;
}

.cart-button.clicked span.added {
	animation: textIn 2s var(--ease) forwards;
}

@keyframes cartMove {
	0% { left: -10%; }
	40%, 60% { left: 50%; }
	100% { left: 110%; }
}

@keyframes boxDrop {
	0%, 40% { top: -20%; }
	60% { top: 38%; left: 52%; }
	100% { top: 38%; left: 112%; }
}

@keyframes textOut {
	0% { opacity: 1; }
	20%, 100% { opacity: 0; }
}

@keyframes textIn {
	0%, 80% { opacity: 0; }
	100% { opacity: 1; }
}

.additional-options {
	margin: 24px 0;
	padding: 16px 0;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}
.stain-coating-check {
	display: flex;
	align-items: center;
	gap: 12px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
}
.stain-coating-check input[type="checkbox"] {
	width: 18px;
	height: 18px;
	cursor: pointer;
	accent-color: var(--color-gold);
}
.coating-price {
	display: block;
	font-size: 12px;
	color: var(--color-gold);
	margin-top: 4px;
	font-weight: 400;
}

.single-product .product_meta {
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var(--color-text-muted);
	padding-top: 24px;
	border-top: 2px solid rgba(0,0,0,0.06);
}
.single-product .product_meta > span { display: block; padding: 4px 0; }

/* -----------------------------------------------------------------
   13A. PRODUCT TABS REDESIGN
   ----------------------------------------------------------------- */
.product-tabs {
	margin-top: 80px;
	padding-top: 40px;
	border-top: 2px solid rgba(0,0,0,0.12);
}
.product-tabs-bar {
	display: flex;
	gap: 40px;
	border-bottom: 1px solid rgba(0,0,0,0.12);
	margin-bottom: 48px;
	overflow-x: auto;
	padding-bottom: 2px;
}
.tab-btn {
	padding: 16px 0;
	font-size: 13px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	border-bottom: 2px solid transparent;
	white-space: nowrap;
	transition: all 0.3s var(--ease);
}
.tab-btn.active {
	color: var(--color-text);
	border-bottom-color: var(--color-gold);
}

.tab-panel { display: none; }
.tab-panel.active { display: block; animation: fadeIn 0.5s var(--ease); }

/* Description Editorial */
.description-editorial {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 80px;
}
.desc-story .desc-eyebrow {
	display: block;
	font-size: 11px;
	letter-spacing: 0.2em;
	color: var(--color-gold);
	margin-bottom: 12px;
}
.desc-story h3 {
	font-family: var(--font-display);
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	margin-bottom: 24px;
}
.desc-main-text {
	font-size: 16px;
	line-height: 1.8;
	color: var(--color-text-muted);
}
.desc-main-text p { margin-bottom: 20px; }

/* Description Read More Toggle */
.desc-wrapper {
	position: relative;
	max-height: 250px;
	overflow: hidden;
	transition: max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.desc-wrapper.expanded {
	max-height: 2000px;
}
.desc-fade-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 80px;
	background: linear-gradient(to bottom, rgba(247, 244, 239, 0), var(--color-bg, #F7F4EF));
	pointer-events: none;
	transition: opacity 0.3s ease;
	opacity: 1;
}
.desc-wrapper.expanded .desc-fade-overlay {
	opacity: 0;
}
.desc-read-more-btn {
	background: none;
	border: none;
	color: var(--color-gold);
	font-family: var(--font-body);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 10px 0;
	margin-top: 15px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	transition: color 0.18s ease;
}
.desc-read-more-btn:hover {
	color: var(--color-gold-hover);
}
.desc-read-more-btn .arrow {
	display: inline-block;
	transition: transform 0.3s ease;
}
.desc-read-more-btn.active .arrow {
	transform: rotate(180deg);
}

.desc-care .care-box {
	background: var(--color-surface);
	padding: 40px;
	border: 1px solid rgba(0,0,0,0.1);
}
.care-box h4 {
	font-family: var(--font-display);
	font-size: 20px;
	margin-bottom: 24px;
}
.care-list { list-style: none; padding: 0; }
.care-list li {
	display: flex;
	gap: 12px;
	margin-bottom: 16px;
	font-size: 14px;
	color: var(--color-text-muted);
	line-height: 1.6;
}
.care-icon { color: var(--color-gold); font-size: 16px; }

/* Specifications Modern Grid - Premium Box Style */
.specifications-modern-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
	gap: 24px;
}

.specifications-modern-grid .spec-item {
	display: flex;
	gap: 18px;
	align-items: center;
	padding: 16px 20px;
	background: var(--color-surface);
	border: 1px solid var(--color-border-strong);
	border-radius: var(--radius-lg, 4px);
	transition: transform var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}

.specifications-modern-grid .spec-item:hover {
	transform: translateY(-2px);
	border-color: var(--color-gold);
	box-shadow: var(--shadow-sm);
}

.specifications-modern-grid .spec-icon {
	font-size: 20px;
	color: var(--color-gold);
	background: rgba(175, 131, 90, 0.08);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}

.specifications-modern-grid .spec-item:hover .spec-icon {
	background: var(--color-gold);
	color: #fff;
}

.specifications-modern-grid .spec-info {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.specifications-modern-grid .spec-label {
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.specifications-modern-grid .spec-value {
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	color: var(--color-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Shipping Redesign Grid */
.shipping-redesign-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
.shipping-card {
	padding: 40px;
	background: var(--color-surface);
	border: 1px solid rgba(0,0,0,0.1);
	text-align: center;
	transition: transform 0.4s var(--ease);
}
.shipping-card:hover { transform: translateY(-8px); }
.card-icon {
	color: var(--color-gold);
	margin-bottom: 24px;
	display: flex; justify-content: center;
}
.shipping-card h4 {
	font-family: var(--font-display);
	font-size: 18px;
	margin-bottom: 16px;
}
.shipping-card p {
	font-size: 14px;
	color: var(--color-text-muted);
	line-height: 1.6;
}

@media (max-width: 1024px) {
	.description-editorial { grid-template-columns: 1fr; gap: 48px; }
	.shipping-redesign-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
	.product-tabs-bar { gap: 24px; }
	.desc-care .care-box, .shipping-card { padding: 32px 24px; }
}

.related-products {
	margin-top: 100px;
	padding-top: 60px;
	border-top: 2px solid rgba(0,0,0,0.12);
}
.related-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px;
	margin-top: 48px;
}
@media (max-width: 1024px) {
	.related-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}
}
@media (max-width: 576px) {
	.related-grid {
		grid-template-columns: 1fr;
	}
}

/* -----------------------------------------------------------------
   13B. RUG SIZE GUIDE
   ----------------------------------------------------------------- */
.size-guide-section {
	margin-top: 60px;
	padding-top: 40px;
	border-top: 2px solid rgba(0,0,0,0.12);
}
.size-guide-tabs {
	margin-top: 32px;
}
.guide-tabs-nav {
	display: flex;
	gap: 24px;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 40px;
	overflow-x: auto;
	padding-bottom: 2px;
}
.guide-tab-btn {
	padding: 12px 0;
	font-size: 14px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	border-bottom: 2px solid transparent;
	white-space: nowrap;
	font-weight: 500;
}
.guide-tab-btn.active {
	color: var(--color-text);
	border-bottom-color: var(--color-gold);
}
.guide-panel {
	display: none;
}
.guide-panel.active {
	display: block;
	animation: fadeIn 0.4s var(--ease);
}
.guide-content {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 48px;
	align-items: center;
}
.guide-text h3 {
	font-family: var(--font-display);
	font-size: clamp(22px, 2.5vw, 32px);
	margin-bottom: 16px;
	color: var(--color-text);
}
.guide-text p {
	color: var(--color-text-muted);
	line-height: 1.8;
	font-size: clamp(14px, 1.4vw, 17px);
}
.guide-visual img {
	width: 100%;
	height: auto;
	background: var(--color-surface);
	padding: 20px;
}

@media (max-width: 991px) {
	.guide-content {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.guide-text { order: 1; }
	.guide-visual { order: 2; }
}
@media (max-width: 768px) {
	.size-guide-section { margin-top: 60px; padding-top: 40px; }
	.guide-tabs-nav { gap: 16px; }
	.guide-tab-btn { font-size: 11px; }
}

/* -----------------------------------------------------------------
   13C. REVIEWS SUMMARY
   ----------------------------------------------------------------- */
.reviews-summary-box {
	display: flex;
	gap: 60px;
	padding: 48px;
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	margin-bottom: 48px;
	align-items: center;
}
.rating-large {
	text-align: center;
	border-right: 1px solid var(--color-border);
	padding-right: 60px;
}
.rating-number {
	display: block;
	font-size: 64px;
	font-family: var(--font-display);
	line-height: 1;
	color: var(--color-text);
}
.rating-stars {
	margin: 12px 0;
	color: var(--color-gold);
	font-size: 18px;
	letter-spacing: 2px;
}
.rating-large p { font-size: 11px; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.15em; }

.rating-bars { flex: 1; display: flex; flex-direction: column; gap: 12px; }
.rating-bar-row { display: flex; align-items: center; gap: 16px; }
.bar-label { font-size: 13px; font-weight: 500; min-width: 30px; }
.bar-track {
	flex: 1;
	height: 6px;
	background: rgba(0,0,0,0.05);
	position: relative;
}
.bar-fill {
	position: absolute;
	left: 0; top: 0; height: 100%;
	background: var(--color-gold);
}
.bar-count { font-size: 13px; color: var(--color-text-muted); min-width: 24px; text-align: right; }

@media (max-width: 768px) {
	.reviews-summary-box { flex-direction: column; padding: 32px 24px; gap: 32px; }
	.rating-large { border-right: 0; border-bottom: 1px solid var(--color-border); padding-right: 0; padding-bottom: 32px; width: 100%; }
}

/* -----------------------------------------------------------------
   14. CART DRAWER
   ----------------------------------------------------------------- */
.cart-drawer {
	position: fixed;
	top: 0; right: 0;
	height: 100dvh;
	width: min(440px, 92vw);
	background: var(--color-bg);
	z-index: 100;
	transform: translateX(100%);
	transition: transform var(--dur) var(--ease);
	display: flex;
	flex-direction: column;
	box-shadow: var(--shadow-lg);
}
.cart-drawer.is-open { transform: translateX(0); }
.cart-drawer-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 24px;
	border-bottom: 1px solid var(--color-border);
}
.cart-drawer-header h3 { margin: 0; font-size: 20px; font-family: var(--font-display); }
.cart-drawer-close {
	width: 36px; height: 36px;
	font-size: 28px;
	line-height: 1;
	display: inline-flex; align-items: center; justify-content: center;
}
.cart-drawer-body {
	flex: 1;
	overflow-y: auto;
	padding: 16px 24px;
}
.cart-drawer-item {
	display: grid;
	grid-template-columns: 80px 1fr auto;
	gap: 14px;
	padding: 16px 0;
	border-bottom: 1px solid var(--color-border);
}
.cart-drawer-item img { width: 80px; height: 100px; object-fit: cover; }
.cart-item-info { display: flex; flex-direction: column; gap: 6px; }
.cart-item-name { font-size: 14px; font-weight: 500; }
.cart-item-meta { font-size: 12px; color: var(--color-text-muted); }
.cart-item-price { font-size: 14px; font-weight: 500; color: var(--color-gold); }
.cart-qty-controls { display: inline-flex; align-items: center; border: 1px solid var(--color-border); }
.cart-qty-controls button { width: 28px; height: 28px; }
.cart-qty-controls input { width: 32px; text-align: center; border: 0; padding: 4px 0; background: transparent; }
.cart-item-remove { font-size: 11px; color: var(--color-text-muted); text-decoration: underline; align-self: flex-start; }
.cart-drawer-empty { text-align: center; padding: 60px 20px; color: var(--color-text-muted); }
.cart-drawer-empty p { margin-bottom: 20px; }

.cart-drawer-footer {
	border-top: 1px solid var(--color-border);
	padding: 20px 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: var(--color-surface);
}
.cart-subtotal { display: flex; justify-content: space-between; font-size: 16px; font-weight: 500; }
.cart-subtotal-amt { color: var(--color-gold); }
.cart-shipping-note { font-size: 12px; color: var(--color-text-muted); text-align: center; }
.cart-drawer-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }

/* -----------------------------------------------------------------
   14B. CART PAGE
   ----------------------------------------------------------------- */
.woocommerce-cart .woocommerce { padding: 40px 0; }
.woocommerce table.shop_table {
	border: 1px solid var(--color-border);
	border-collapse: collapse;
	background: var(--color-surface);
	border-radius: 0;
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	padding: 16px;
	border: 0;
	border-bottom: 1px solid var(--color-border);
}
.woocommerce table.shop_table th {
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	text-align: left;
}
.cart_totals {
	background: var(--color-tag-bg);
	padding: 32px;
	border-radius: var(--radius);
}
.cart_totals h2 { margin-bottom: 20px; }

/* -----------------------------------------------------------------
   14C. CHECKOUT
   ----------------------------------------------------------------- */
.woocommerce-checkout #customer_details { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.woocommerce-checkout .form-row { margin: 0 0 16px; }
.woocommerce-checkout label {
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin-bottom: 6px;
	display: block;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	padding: 12px 14px !important;
	border: 1px solid var(--color-border) !important;
	background: var(--color-surface) !important;
	font-size: 14px !important;
	border-radius: 0 !important;
}
.woocommerce-checkout-review-order {
	background: var(--color-tag-bg);
	padding: 32px;
}
#place_order.single-product button.single_add_to_cart_button,
.single-product .single_add_to_cart_button {
	background: var(--color-gold) !important;
	color: var(--cornsilk) !important;
	padding: 18px 40px !important;
	font-size: 14px !important;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	border: 0 !important;
	border-radius: 0 !important;
	transition: all 0.4s var(--ease);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 100%;
	position: relative;
	overflow: hidden;
}

.single-product button.single_add_to_cart_button:hover { 
	background: var(--color-gold-hover) !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(184, 150, 107, 0.25);
}

.single-product button.single_add_to_cart_button:active {
	transform: scale(0.98) translateY(0);
}

.cart-btn-icon {
	transition: transform 0.3s var(--ease);
}

.single_add_to_cart_button:hover .cart-btn-icon {
	animation: iconBounce 0.6s var(--ease) infinite;
}

@keyframes iconBounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-3px); }
}

/* Adding State */
.single_add_to_cart_button.is-adding {
	pointer-events: none;
	opacity: 0.9;
}

.single_add_to_cart_button.is-adding .cart-btn-icon {
	animation: rotateFull 0.8s linear infinite;
}

@keyframes rotateFull {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

/* -----------------------------------------------------------------
   14D. MY ACCOUNT
   ----------------------------------------------------------------- */
.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	gap: 4px;
	border-right: 1px solid var(--color-border);
	padding-right: 24px;
}
.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 10px 0;
	font-size: 14px;
	letter-spacing: 0.05em;
	color: var(--color-text-muted);
}
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover { color: var(--color-gold); }

/* -----------------------------------------------------------------
   15. FOOTER
   ----------------------------------------------------------------- */
.site-footer {
	background: var(--light-bronze);
	color: #fff;
	margin-top: 100px;
	position: relative;
	overflow: hidden;
}
.site-footer p {
	color: rgba(255, 255, 255, 0.85) !important;
	font-size: 15.5px;
	line-height: 1.7;
}
.footer-main { padding-block: clamp(60px, 8vw, 90px); }
.footer-grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr 1.4fr;
	gap: clamp(24px, 3.5vw, 48px);
}
.footer-brand { display: flex; flex-direction: column; gap: 20px; }
.footer-logo {
	display: block;
	max-width: 260px;
}
.footer-logo img {
	max-height: 72px;
	width: auto;
	object-fit: contain;
}
.footer-tagline {
	font-family: var(--font-display);
	font-size: 20px;
	font-style: italic;
	color: #fff;
	margin-bottom: 0;
	letter-spacing: 0.05em;
}
.footer-desc {
	color: rgba(255, 255, 255, 0.8) !important;
	line-height: 1.7;
	font-size: 15px;
	max-width: 300px;
}
.footer-col h4 {
	font-family: var(--font-display);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 24px;
	position: relative;
}
.footer-col h4::after {
	content: "";
	position: absolute;
	left: 0; bottom: -8px;
	width: 30px; height: 1px;
	background: #fff;
}
.footer-nav { display: flex; flex-direction: column; gap: 12px; }
.footer-nav li a {
	color: rgba(255, 255, 255, 0.8);
	font-size: 15.5px;
	font-family: var(--font-body);
	transition: all 0.25s var(--ease);
}
.footer-nav li a:hover {
	color: #fff;
	text-decoration: underline;
	padding-left: 2px;
}
.footer-contact-info {
	display: flex;
	flex-direction: column;
	gap: 12px;
	font-size: 15.5px;
	color: rgba(255, 255, 255, 0.8);
}
.footer-contact-info p { margin: 0; display: flex; gap: 10px; align-items: center; }
.whatsapp-link {
	display: inline-flex;
	align-items: center;
	margin-top: 10px;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 0.1em;
	border-bottom: 1px solid rgba(255, 255, 255, 0.4);
	transition: all 0.25s var(--ease);
}
.whatsapp-link:hover {
	color: #fff;
	border-bottom-color: #fff;
}

.footer-icon-wrapper {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
	color: inherit;
	vertical-align: middle;
	flex-shrink: 0;
}
.footer-contact-icon {
	stroke: currentColor;
	stroke-width: 1.5;
	fill: none;
	width: 16px;
	height: 16px;
}

.social-links { display: flex; gap: 12px; margin-top: 12px; }
.social-links a {
	width: 36px; height: 36px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	color: #fff;
	transition: all 0.3s var(--ease);
}
.social-links a:hover {
	border-color: #fff;
	background: #fff;
	color: var(--light-bronze);
	transform: translateY(-2px);
}
.social-links svg { width: 14px; height: 14px; }

.footer-bottom {
	padding-block: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	font-size: 14px;
	color: rgba(255, 255, 255, 0.8);
}
.footer-bottom-inner {
	display: grid;
	grid-template-areas: 
		"legal legal"
		"copy payment";
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 16px 40px;
}
.footer-legal {
	grid-area: legal;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	padding-bottom: 16px;
	width: 100%;
}
.footer-legal a {
	color: rgba(255, 255, 255, 0.8);
	font-size: 13px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	transition: color 0.25s var(--ease);
}
.footer-legal a:hover {
	color: #fff;
	text-decoration: underline;
}
.footer-bottom-inner p {
	grid-area: copy;
	margin: 0;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.75) !important;
}
.payment-icons {
	grid-area: payment;
	display: flex;
	gap: 12px;
	align-items: center;
	transition: all 0.4s var(--ease);
}
.payment-icons svg {
	height: 18px;
	width: auto;
}

/* Popular Searches */
.footer-popular-searches {
	padding: 40px 0;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	margin-bottom: 20px;
}
.footer-popular-searches h4 {
	font-family: var(--font-display);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 20px;
}
.popular-search-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.popular-search-tags a {
	font-size: 13px;
	padding: 6px 16px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 20px;
	color: rgba(255, 255, 255, 0.85);
	transition: all 0.3s var(--ease);
	letter-spacing: 0.05em;
}
.popular-search-tags a:hover {
	border-color: #fff;
	color: var(--light-bronze);
	background: #fff;
}

/* Responsive Footer Grid & Bottom */
@media (max-width: 1024px) {
	.footer-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 40px;
	}
	.footer-brand {
		grid-column: span 3;
		max-width: 480px;
	}
	.footer-contact-col {
		grid-column: span 3;
	}
}

@media (max-width: 768px) {
	.footer-grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.footer-brand, .footer-contact-col {
		grid-column: span 1;
	}
	.footer-bottom-inner {
		grid-template-areas: 
			"legal"
			"copy"
			"payment";
		grid-template-columns: 1fr;
		text-align: center;
		justify-items: center;
		gap: 16px;
	}
	.footer-legal {
		border-bottom: none;
		padding-bottom: 0;
	}
}

.whatsapp-float {
	position: fixed;
	bottom: 24px;
	right: 24px;
	width: 56px; height: 56px;
	border-radius: 50%;
	background: #25D366;
	color: var(--cornsilk);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--shadow-md);
	z-index: 80;
	transition: transform var(--dur) var(--ease);
	animation: pulse-whatsapp 2.4s ease-in-out infinite;
}
.whatsapp-float:hover { transform: scale(1.08); }
.whatsapp-float svg { width: 28px; height: 28px; }
@keyframes pulse-whatsapp {
	0%, 100% { box-shadow: var(--shadow-md), 0 0 0 0 rgba(37, 211, 102, 0.5); }
	50% { box-shadow: var(--shadow-md), 0 0 0 16px rgba(37, 211, 102, 0); }
}

/* -----------------------------------------------------------------
   16. PAGE TEMPLATES
   ----------------------------------------------------------------- */

/* About */
.page-about-hero {
	min-height: 60vh;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	background: var(--color-bg);
}
.page-about-hero-content {
	padding: clamp(40px, 6vw, 100px);
	display: flex; flex-direction: column; justify-content: center; gap: 18px;
}
.page-about-hero-image img { width: 100%; height: 100%; object-fit: cover; min-height: 480px; }
.about-values {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	padding-block: clamp(60px, 7vw, 110px);
}
.about-value { text-align: center; padding: 32px; border: 1px solid var(--color-border); }
.about-value h3 { font-family: var(--font-display); margin-bottom: 12px; }
.about-process {
	background: var(--color-tag-bg);
	padding-block: clamp(60px, 7vw, 110px);
}
.process-steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
	margin-top: 48px;
}
.process-step { display: flex; flex-direction: column; gap: 10px; }
.process-step-num {
	font-family: var(--font-display);
	font-size: 56px;
	color: var(--color-gold);
	line-height: 1;
}

/* Contact */
.contact-grid {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: clamp(32px, 5vw, 80px);
	padding-block: clamp(48px, 7vw, 100px);
}
.contact-info-block { display: flex; flex-direction: column; gap: 16px; }
.contact-info-item {
	display: flex; flex-direction: column; gap: 4px;
	padding: 18px 0;
	border-bottom: 1px solid var(--color-border);
}
.contact-info-item span:first-child {
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}
.contact-info-item a, .contact-info-item p {
	font-family: var(--font-display);
	font-size: 22px;
	margin: 0;
}
.contact-form-block { background: var(--color-surface); padding: 40px; border: 1px solid var(--color-border); }
.contact-form-block input, .contact-form-block textarea, .contact-form-block select {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--color-border);
	background: var(--color-surface);
	font-size: 14px;
	margin-bottom: 14px;
}
.contact-form-block textarea { min-height: 120px; resize: vertical; }
.contact-form-block button[type="submit"] {
	background: var(--color-gold); color: var(--cornsilk);
	padding: 14px 32px;
	font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase;
}

/* Collections page */
.collections-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	padding-block: clamp(48px, 6vw, 80px);
}

/* -----------------------------------------------------------------
   17. 404 / SEARCH
   ----------------------------------------------------------------- */
.error-404 {
	text-align: center;
	padding: clamp(80px, 12vw, 160px) 24px;
	min-height: 60vh;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
}
.error-404 .big-number {
	font-family: var(--font-display);
	font-size: clamp(120px, 22vw, 220px);
	color: var(--color-gold);
	line-height: 1;
}
.search-results-page { padding-block: 60px; }
.search-results-page article {
	padding: 24px 0;
	border-bottom: 1px solid var(--color-border);
}
.search-results-page article h2 a:hover { color: var(--color-gold); }

/* Default page */
.default-page-wrap { padding-block: clamp(48px, 7vw, 100px); }
.default-page-wrap .container { max-width: 820px; }
.default-page-wrap h1 { margin-bottom: 32px; }
.default-page-wrap h2 { margin: 32px 0 12px; }

/* -----------------------------------------------------------------
   18. REVEAL ANIMATIONS / UTILITIES
   ----------------------------------------------------------------- */
.reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
	will-change: opacity, transform;
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.reveal { opacity: 1; transform: none; }
}

.sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	border: 0;
}

/* Lock body when overlay open */
body.is-locked { overflow: hidden; }

/* -----------------------------------------------------------------
   19. RESPONSIVE
   ----------------------------------------------------------------- */
@media (max-width: 1280px) {
	.products-grid[data-columns="4"] { grid-template-columns: repeat(3, 1fr); }
	.woocommerce ul.products,
	.woocommerce-page ul.products { grid-template-columns: repeat(3, 1fr); }
	.footer-grid { grid-template-columns: 1fr 1fr 1fr 1fr; }
}

@media (max-width: 1024px) {
	.nav-menu { gap: 24px; }
	.hero { grid-template-columns: 1fr; }
	.hero-image { aspect-ratio: 4 / 3; max-height: 60vh; }
	.story-grid { grid-template-columns: 1fr; }
	.testimonials-grid { grid-template-columns: 1fr 1fr; }
	.space-grid { grid-template-columns: repeat(3, 1fr); }
	.insta-grid { grid-template-columns: repeat(3, 1fr); }
	.single-product .product { grid-template-columns: 1fr; }
	.about-values { grid-template-columns: 1fr; }
	.process-steps { grid-template-columns: repeat(2, 1fr); }
	.contact-grid { grid-template-columns: 1fr; }
	.page-about-hero { grid-template-columns: 1fr; }
	.collections-grid { grid-template-columns: repeat(2, 1fr); }
	.footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
	.woocommerce-checkout #customer_details { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
	.primary-nav { display: none; }
	.hide-on-mobile { display: none !important; }
	.hamburger { display: inline-flex; }
	.header-inner { grid-template-columns: 1fr auto; }
	.site-logo { justify-self: start; }
	.header-icons { gap: 4px; }
	.icon-btn.search-trigger { display: none; }
	.trust-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
	.categories-grid { grid-template-columns: 1fr; }
	.products-grid[data-columns="4"], .products-grid[data-columns="3"] { grid-template-columns: repeat(2, 1fr); }
	.woocommerce ul.products,
	.woocommerce-page ul.products { grid-template-columns: repeat(2, 1fr); gap: 20px 14px; }
	.testimonials-grid { grid-template-columns: 1fr; }
	.stats-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
	.space-grid { grid-template-columns: repeat(2, 1fr); }
	.shop-toolbar { flex-direction: column; align-items: flex-start; }
	.process-steps { grid-template-columns: 1fr; }
	.collections-grid { grid-template-columns: 1fr; }
	.section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
	.footer-bottom-inner { justify-content: center; text-align: center; }
}

@media (max-width: 480px) {
	h1 { font-size: 2.5rem; }
	h2 { font-size: 1.75rem; }
	.btn-primary, .btn-outline { padding: 14px 28px; font-size: 13px; }
	.products-grid[data-columns="4"], .products-grid[data-columns="3"] { grid-template-columns: 1fr; gap: 24px; }
	.woocommerce ul.products,
	.woocommerce-page ul.products { grid-template-columns: 1fr; }
	.insta-grid { grid-template-columns: repeat(2, 1fr); }
	.footer-grid { grid-template-columns: 1fr; }
	.hero-actions { flex-direction: column; align-items: stretch; }
	.hero-actions .btn-primary { justify-content: center; }
	.whatsapp-float { width: 50px; height: 50px; bottom: 16px; right: 16px; }
}


/* -----------------------------------------------------------------
   21. FULL-BLEED HERO (Jaipur Rugs style)
   ----------------------------------------------------------------- */
.hero-full {
	position: relative;
	height: 100vh;
	display: flex;
	align-items: center;
	overflow: hidden;
	color: var(--cornsilk);
}

.hero-full-media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.hero-full-media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	animation: heroSlowZoom 14s var(--ease) infinite alternate;
}
@keyframes heroSlowZoom {
	from { transform: scale(1); }
	to   { transform: scale(1.06); }
}
.hero-full-overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(28,26,22,0.35) 0%, rgba(28,26,22,0.05) 35%, rgba(28,26,22,0.65) 100%),
		linear-gradient(90deg, rgba(28,26,22,0.55) 0%, rgba(28,26,22,0.0) 60%);
}

.hero-full-content {
	position: relative;
	z-index: 2;
	width: 100%;
	padding-block: clamp(80px, 12vw, 160px);
}
.hero-full-content > .container {
	max-width: 880px;
	margin-inline: 0;
	padding-left: clamp(24px, 6vw, 96px);
}

.hero-full-eyebrow {
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.85);
	margin-bottom: 20px;
	display: inline-flex;
	align-items: center;
	gap: 14px;
}
.hero-full-eyebrow::before {
	content: "";
	display: inline-block;
	width: 28px;
	height: 1px;
	background: var(--color-gold);
}

.hero-full-heading {
	font-family: var(--font-display);
	font-weight: 300;
	font-size: clamp(3rem, 7.4vw, 7rem);
	line-height: 0.98;
	letter-spacing: -0.02em;
	color: var(--cornsilk);
	margin: 0 0 24px;
	max-width: 14ch;
}
.hero-full-heading .italic-line {
	display: block;
	font-style: italic;
	font-weight: 400;
	color: var(--color-bg);
	opacity: 0.92;
}

.hero-full-sub {
	font-size: clamp(16px, 1.4vw, 19px);
	line-height: 1.55;
	color: rgba(255,255,255,0.88);
	max-width: 480px;
	margin-bottom: 36px;
}

.hero-full-actions {
	display: flex;
	gap: 14px;
	align-items: center;
	flex-wrap: wrap;
}

.btn-hero, .btn-hero-ghost {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	padding: 18px 36px;
	border: 1px solid;
	transition: all var(--dur) var(--ease);
	cursor: pointer;
	white-space: nowrap;
}
.btn-hero {
	background: var(--color-bg);
	color: var(--color-text);
	border-color: #fff;
}
.btn-hero:hover {
	background: var(--color-gold);
	color: var(--cornsilk);
	border-color: var(--color-gold);
	transform: translateY(-1px);
}
.btn-hero-ghost {
	background: transparent;
	color: var(--cornsilk);
	border-color: rgba(255,255,255,0.6);
}
.btn-hero-ghost:hover {
	background: var(--color-bg);
	color: var(--color-text);
	border-color: #fff;
}

/* Scroll cue */
.hero-scroll-cue {
	position: absolute;
	bottom: 28px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	width: 22px;
	height: 36px;
	border: 1px solid rgba(255,255,255,0.6);
	border-radius: 999px;
	display: flex;
	justify-content: center;
	padding-top: 6px;
}
.hero-scroll-cue span {
	display: block;
	width: 2px;
	height: 8px;
	background: var(--color-bg);
	border-radius: 2px;
	animation: heroScrollDot 1.6s ease-in-out infinite;
}
@keyframes heroScrollDot {
	0%   { transform: translateY(0);  opacity: 1; }
	100% { transform: translateY(10px); opacity: 0; }
}

@media (max-width: 768px) {
	.hero-full { height: 100vh; }
	.hero-full-content > .container { max-width: 100%; padding-inline: 24px; }
	.hero-full-overlay {
		background:
			linear-gradient(180deg, rgba(28,26,22,0.25) 0%, rgba(28,26,22,0.55) 60%, rgba(28,26,22,0.75) 100%);
	}
	.hero-full-actions { flex-direction: column; align-items: stretch; width: 100%; }
	.btn-hero, .btn-hero-ghost { justify-content: center; }
	.hero-scroll-cue { display: none; }
}

/* -----------------------------------------------------------------
   22. SHOP BY ROOMS (3 large editorial cards)
   ----------------------------------------------------------------- */
.rooms-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
.room-card {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--color-text);
	color: var(--cornsilk);
}
.room-image {
	aspect-ratio: 4 / 5;
	overflow: hidden;
}
.room-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1s var(--ease), opacity var(--dur) var(--ease);
	opacity: 0.85;
}
.room-card:hover .room-image img {
	transform: scale(1.06);
	opacity: 0.7;
}
.room-content {
	position: absolute;
	inset: auto 0 0 0;
	padding: 32px 32px 36px;
	background: linear-gradient(to top, rgba(28,26,22,0.85) 0%, rgba(28,26,22,0.35) 70%, transparent 100%);
	color: var(--cornsilk);
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.room-eyebrow {
	font-size: 11px;
	letter-spacing: 0.25em;
	font-weight: 600;
	color: var(--color-gold);
}
.room-content h3 {
	font-family: var(--font-display);
	font-size: clamp(24px, 2.4vw, 34px);
	font-weight: 400;
	color: var(--cornsilk);
	margin: 0;
	letter-spacing: -0.01em;
}
.room-content p {
	font-size: 14px;
	color: rgba(255,255,255,0.85);
	margin: 0;
	max-width: 30ch;
}
.room-cta {
	display: inline-block;
	margin-top: 12px;
	font-size: 13px;
	letter-spacing: 0.08em;
	color: var(--cornsilk);
	border-bottom: 1px solid currentColor;
	padding-bottom: 2px;
	width: fit-content;
	transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.room-card:hover .room-cta { color: var(--color-gold); border-color: var(--color-gold); }

@media (max-width: 1024px) {
	.rooms-grid { grid-template-columns: 1fr 1fr; }
	.rooms-grid .room-card:last-child { grid-column: span 2; }
	.rooms-grid .room-card:last-child .room-image { aspect-ratio: 16 / 7; }
}
@media (max-width: 768px) {
	.rooms-grid { grid-template-columns: 1fr; gap: 20px; }
	.rooms-grid .room-card:last-child { grid-column: auto; }
	.rooms-grid .room-card:last-child .room-image { aspect-ratio: 4 / 5; }
}

/* -----------------------------------------------------------------
   23. JOURNAL / BLOGS GRID
   ----------------------------------------------------------------- */
.journal-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
.journal-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	background: var(--color-surface);
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.journal-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-md);
}
.journal-image {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}
.journal-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.9s var(--ease);
}
.journal-card:hover .journal-image img { transform: scale(1.05); }

.journal-meta {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 4px 24px 28px;
}
.journal-date {
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-text-faint);
}
.journal-title {
	font-family: var(--font-display);
	font-size: clamp(20px, 1.8vw, 24px);
	font-weight: 400;
	line-height: 1.25;
	margin: 0;
	letter-spacing: -0.005em;
}
.journal-title a { color: var(--color-text); transition: color var(--dur) var(--ease); }
.journal-title a:hover { color: var(--color-gold); }
.journal-excerpt {
	font-size: 14px;
	color: var(--color-text-muted);
	line-height: 1.65;
	margin: 0;
}
.journal-readmore {
	margin-top: 4px;
	font-size: 13px;
	align-self: flex-start;
}

@media (max-width: 1024px) {
	.journal-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
	.journal-grid { grid-template-columns: 1fr; gap: 28px; }
}

/* -----------------------------------------------------------------
   24. WHO WE ARE — EDITORIAL REDESIGN
   ----------------------------------------------------------------- */
.who-we-are-redesign {
	padding-block: clamp(80px, 12vw, 160px);
	background: var(--color-bg);
}
.grid-2-col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(40px, 8vw, 120px);
	align-items: center;
}
.editorial-heading {
	font-family: var(--font-display);
	font-size: clamp(34px, 4.5vw, 64px);
	font-weight: 400;
	line-height: 1.1;
	margin: 16px 0 32px;
	color: var(--color-text);
}
.story-text-body {
	font-size: 17px;
	line-height: 1.7;
	color: var(--color-text-muted);
	margin-bottom: 40px;
}
.story-text-body p + p { margin-top: 24px; }

.story-stats-grid {
	display: flex;
	gap: 48px;
	margin-bottom: 48px;
}
.stat-num {
	display: block;
	font-family: var(--font-display);
	font-size: 42px;
	color: var(--color-gold);
	line-height: 1;
	margin-bottom: 8px;
}
.stat-label {
	font-size: 12px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--color-text-faint);
}

.story-visual-wrap {
	position: relative;
}
.main-visual {
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: 4px;
	box-shadow: 20px 20px 0 var(--color-surface);
}
.main-visual img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 1.5s var(--ease);
}
.who-we-are-redesign:hover .main-visual img { transform: scale(1.05); }
.luxury-seal-wrap {
	position: absolute;
	left: -60px;
	bottom: -40px;
	z-index: 10;
}
.luxury-seal {
	position: relative;
	width: 140px;
	height: 140px;
	background: rgba(184, 150, 107, 0.95); /* Deep Gold */
	backdrop-filter: blur(8px);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 20px 40px rgba(0,0,0,0.2), inset 0 0 20px rgba(255,255,255,0.2);
	border: 1px solid rgba(255,255,255,0.3);
	animation: float 6s ease-in-out infinite;
}
.seal-svg {
	position: absolute;
	width: 100%;
	height: 100%;
	animation: rotateSeal 20s linear infinite;
}
.seal-text {
	font-family: var(--font-body);
	font-size: 8.5px;
	font-weight: 600;
	letter-spacing: 1px;
	fill: var(--color-bg);
	text-transform: uppercase;
}
.seal-center {
	position: relative;
	width: 60px;
	height: 60px;
	background: var(--color-bg);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--color-gold);
	box-shadow: inset 0 0 10px rgba(184, 150, 107, 0.2);
}
.seal-year {
	font-family: var(--font-display);
	font-size: 24px;
	color: var(--color-gold);
	font-weight: 400;
	line-height: 1;
}
.seal-center::after {
	content: "";
	position: absolute;
	inset: -4px;
	border: 1.5px solid rgba(255,255,255,0.4);
	border-radius: 50%;
}

@keyframes rotateSeal {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

@keyframes float {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	50%      { transform: translateY(-15px) rotate(2deg); }
}

/* -----------------------------------------------------------------
   25. TESTIMONIALS
   ----------------------------------------------------------------- */
.testimonials-section {
	padding-block: 100px;
}
.testimonials-carousel-wrapper {
	margin-top: 60px;
	overflow: hidden;
}
.testimonials-track {
	display: flex;
	gap: 32px;
}
.testimonial-card {
	flex: 0 0 420px;
	background: var(--color-bg);
	padding: 48px;
	border-radius: 4px;
	display: flex;
	flex-direction: column;
	gap: 24px;
	box-shadow: var(--shadow-sm);
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.testimonial-card:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-md);
}
.testimonial-rating {
	color: var(--color-gold);
	font-size: 18px;
}
.testimonial-text {
	font-family: var(--font-body);
	font-size: 18px;
	line-height: 1.6;
	color: var(--color-text);
	margin: 0;
	font-style: italic;
}
.testimonial-author {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.author-name {
	font-weight: 600;
	font-size: 15px;
	color: var(--color-text);
}
.author-location {
	font-size: 12px;
	color: var(--color-text-faint);
	letter-spacing: 0.05em;
}
.testimonial-product {
	margin-top: auto;
	padding-top: 20px;
	border-top: 1px solid var(--color-border);
}
.product-tag {
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-gold);
	font-weight: 500;
}

@media (max-width: 1024px) {
	.grid-2-col { grid-template-columns: 1fr; gap: 60px; }
	.story-visual-wrap { order: -1; max-width: 600px; margin: 0 auto; }
	.floating-badge { left: auto; right: -20px; bottom: -20px; }
}

@media (max-width: 768px) {
	.testimonial-card { flex: 0 0 320px; padding: 32px; }
	.story-stats-grid { gap: 24px; }
}

/* -----------------------------------------------------------------
   25. OUR STORY — LUXURY REDESIGN
   ----------------------------------------------------------------- */

/* Hero Split */
.about-hero-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 85vh;
	background: var(--color-bg);
}
.about-hero-text {
	padding: clamp(60px, 10vw, 120px) var(--gutter);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 32px;
}
.hero-title-main {
	font-size: clamp(3rem, 6vw, 5.5rem);
	font-weight: 300;
	line-height: 1.05;
	letter-spacing: -0.02em;
}
.serif-italic { font-family: var(--font-display); font-style: italic; color: var(--color-gold); }
.hero-intro-lead {
	font-size: clamp(1.1rem, 1.5vw, 1.25rem);
	line-height: 1.7;
	color: var(--color-text-muted);
	max-width: 540px;
}
.about-hero-visual { position: relative; overflow: hidden; }
.image-reveal-wrapper { width: 100%; height: 100%; }
.parallax-img { width: 100%; height: 100%; object-fit: cover; }

/* Layered Grid */
.grid-layered {
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: 80px;
	align-items: center;
	padding-block: 80px;
}
.layered-image-wrap {
	position: relative;
	padding-right: 60px;
	padding-bottom: 60px;
}
.image-main {
	aspect-ratio: 4/5;
	overflow: hidden;
	box-shadow: var(--shadow-lg);
}
.image-main img { width: 100%; height: 100%; object-fit: cover; }
.image-accent {
	position: absolute;
	bottom: 0; right: 0;
	width: 55%;
	aspect-ratio: 1;
	border: 12px solid var(--color-bg);
	box-shadow: var(--shadow-md);
	overflow: hidden;
}
.image-accent img { width: 100%; height: 100%; object-fit: cover; }

/* Stats Bar Refined - NO OVERLAP FIX */
.stats-bar-refined { padding-block: 80px; border-top: 1px solid var(--color-border); }
.stats-row {
	display: flex;
	justify-content: space-between;
	gap: 40px;
	flex-wrap: wrap;
}
.stat-box {
	flex: 1;
	min-width: 200px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.stat-val-row {
	display: flex;
	align-items: baseline;
	gap: 2px;
	color: var(--color-text);
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 5vw, 4.5rem);
	line-height: 1;
}
.stat-number { font-weight: 400; }
.stat-suffix { color: var(--color-gold); font-style: italic; }
.stat-label {
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}

/* Process Horizontal */
.process-scroll-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	margin-top: 60px;
}
.process-item-card {
	background: var(--color-bg);
	padding: 40px;
	border: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	gap: 24px;
	transition: transform var(--dur) var(--ease);
}
.process-item-card:hover { transform: translateY(-8px); border-color: var(--color-gold); }
.process-step {
	font-family: var(--font-display);
	font-size: 40px;
	color: var(--color-border);
	line-height: 1;
}
.process-img { aspect-ratio: 3/2; overflow: hidden; background: var(--color-surface); }
.process-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.process-item-card:hover .process-img img { transform: scale(1.1); }

/* Final CTA Overlay */
.about-cta-final { position: relative; }
.cta-inner-wrap {
	padding-block: clamp(100px, 15vw, 200px);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	text-align: center;
}
.cta-btns { display: flex; gap: 16px; justify-content: center; margin-top: 40px; }
.light-text { color: var(--color-bg); }

@media (max-width: 1024px) {
	.about-hero-split, .grid-layered { grid-template-columns: 1fr; gap: 40px; }
	.about-hero-visual { height: 50vh; }
	.process-scroll-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
	.process-scroll-row { grid-template-columns: 1fr; }
	.layered-image-wrap { padding-right: 30px; padding-bottom: 30px; }
	.image-accent { width: 60%; border-width: 6px; }
	.stats-row { grid-template-columns: 1fr 1fr; display: grid; }
}

/* -----------------------------------------------------------------
   26. CONTACT PAGE — CONCIERGE REDESIGN
   ----------------------------------------------------------------- */
.contact-page-hero {
	padding: clamp(80px, 12vw, 140px) 0 60px;
	text-align: center;
	border-bottom: 1px solid var(--color-border);
}
.contact-title {
	font-size: clamp(2.5rem, 5vw, 4.5rem);
	font-family: var(--font-display);
	font-weight: 400;
	margin-bottom: 24px;
}
.contact-subtitle {
	color: var(--color-text-muted);
	font-size: clamp(1.1rem, 1.5vw, 1.2rem);
	max-width: 680px;
	margin: 0 auto;
	line-height: 1.7;
}

.contact-main-grid {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: clamp(60px, 8vw, 120px);
	padding-block: clamp(80px, 12vw, 140px);
	align-items: start;
}

/* Sidebar Concierge */
.sidebar-info-block {
	position: sticky;
	top: 140px;
	background: var(--color-surface);
	padding: clamp(40px, 5vw, 60px);
	border: 1px solid rgba(0,0,0,0.1);
}
.sidebar-heading {
	font-family: var(--font-display);
	font-size: clamp(1.75rem, 2.5vw, 2.25rem);
	margin-bottom: 16px;
	line-height: 1.2;
}
.sidebar-desc {
	color: var(--color-text-muted);
	font-size: 15px;
	line-height: 1.8;
	margin-bottom: 48px;
}
.concierge-links {
	display: flex;
	flex-direction: column;
	gap: 40px;
}
.concierge-item {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.item-label {
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-gold);
	font-weight: 600;
}
.item-link {
	font-size: 20px;
	font-family: var(--font-display);
	color: var(--color-text);
	transition: all 0.3s var(--ease);
}
.item-link:hover { color: var(--color-gold); transform: translateX(5px); }
.item-text { font-size: 17px; line-height: 1.6; color: var(--color-text); }

/* Luxury Underline Form */
.contact-form-wrap {
	width: 100%;
}
.form-heading {
	font-family: var(--font-display);
	font-size: clamp(2rem, 3vw, 2.5rem);
	margin-bottom: 60px;
}
.form-row-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
}
.floating-group {
	position: relative;
	margin-bottom: 56px;
}
.underline-input {
	width: 100%;
	background: transparent;
	border: none;
	border-bottom: 1.5px solid rgba(0,0,0,0.15);
	padding: 12px 0;
	font-size: 16px;
	color: var(--color-text);
	border-radius: 0;
	transition: all 0.3s var(--ease);
}
.underline-input:focus {
	outline: none;
	border-bottom-color: var(--color-gold);
	background: rgba(184, 150, 107, 0.03);
	padding-left: 8px;
}
.floating-group label {
	position: absolute;
	top: 12px;
	left: 0;
	font-size: 15px;
	color: var(--color-text-muted);
	pointer-events: none;
	transition: all 0.3s var(--ease);
}
/* Ensure label moves even if input is not focused but has content */
.underline-input:focus ~ label,
.underline-input:not(:placeholder-shown) ~ label,
.underline-input:valid ~ label {
	top: -16px;
	left: 0;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-gold);
	font-weight: 600;
}
/* For select specifically */
select.underline-input {
	cursor: pointer;
	appearance: none;
}

textarea.underline-input {
	min-height: 60px;
	resize: none;
}

.form-footer {
	display: flex;
	align-items: center;
	gap: 40px;
	margin-top: 24px;
}
.form-note {
	font-size: 13px;
	color: var(--color-text-muted);
	line-height: 1.6;
	max-width: 360px;
}

@media (max-width: 1024px) {
	.contact-main-grid { grid-template-columns: 1fr; gap: 80px; }
	.sidebar-info-block { position: static; padding: 48px; }
}
@media (max-width: 768px) {
	.form-row-2 { grid-template-columns: 1fr; gap: 48px; }
	.form-footer { flex-direction: column; align-items: flex-start; gap: 24px; }
	.contact-page-hero { padding-top: 60px; }
}

/* -----------------------------------------------------------------
   PRINT
   ----------------------------------------------------------------- */
@media print {
	.site-header, .site-footer, .announcement-bar, .whatsapp-float, .cart-drawer, .mobile-menu, .search-overlay { display: none !important; }
	body { background: #fff; color: #000; }
}

/* FORCE HIGH-LEGIBILITY SANS-SERIF FONT FOR ALL WOOCOMMERCE PRICES */
.price, 
.amount, 
.woocommerce-Price-amount, 
.product-card-price, 
.product-price, 
.atc-price, 
.cart-item-price, 
.coating-price, 
.spec-value {
	font-family: var(--font-body) !important;
}

