/**
 * Manam Chocolate - Main Theme Stylesheet
 *
 * @package ManamChocolate
 * @since 1.1.0
 */

/* ==========================================================================
   CSS Custom Properties (Variables)
   ========================================================================== */

/* ==========================================================================
   Font Faces (Official Infini Font from manamchocolate.com)
   ========================================================================== */

@font-face {
	font-family: "infini romain";
	src: url("../fonts/infini-romain.otf") format("opentype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "infini gras";
	src: url("../fonts/infini-gras.otf") format("opentype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "infini italique";
	src: url("../fonts/infini-italique.otf") format("opentype");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

:root {
	--mc-font-sans: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--mc-font-serif: Georgia, Cambria, "Times New Roman", Times, serif;

	/* Reference Website Colors (manamchocolate.com) */
	--mc-color-bg: #fef8f4;
	--mc-color-surface: #ffffff;
	--mc-color-surface-subtle: #f8f3ee;
	--mc-color-text: #282828;
	--mc-color-heading: #1a1a1a;
	--mc-color-muted: #6e6561;
	--mc-color-border: #ded9d5;
	--mc-color-border-subtle: #eae5e0;

	/* Brand Palette */
	--mc-color-cacao: #321c13;
	--mc-color-cacao-dark: #1f120c;
	--mc-color-accent: #a05934;
	--mc-color-accent-hover: #834423;
	--mc-color-accent-gold: #c48b59;
	--mc-color-focus: #1d70b8;

	/* Layout & Spacing */
	--mc-container-max: 1320px;
	--mc-header-height: 68px;
	--mc-announcement-height: 34px;

	--mc-spacing-xs: 0.5rem;
	--mc-spacing-sm: 1rem;
	--mc-spacing-md: 1.5rem;
	--mc-spacing-lg: 2.5rem;
	--mc-spacing-xl: 4rem;

	--mc-radius-sm: 4px;
	--mc-radius-md: 8px;
	--mc-radius-pill: 9999px;

	--mc-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
	--mc-shadow-dropdown: 0 16px 36px rgba(28, 20, 16, 0.08);
	--mc-shadow-mega: 0 24px 50px rgba(28, 20, 16, 0.1);
}

/* ==========================================================================
   Box Sizing Reset & Base Defaults
   ========================================================================== */

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

html {
	font-size: 16px;
	line-height: 1.6;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	font-family: var(--mc-font-sans);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.65;
	color: var(--mc-color-text);
	background-color: var(--mc-color-bg);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.mobile-nav-open {
	overflow: hidden !important;
	touch-action: none;
}

#page {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.site-content {
	flex: 1 0 auto;
	padding-top: var(--mc-spacing-lg);
	padding-bottom: var(--mc-spacing-xl);
}

body.home .site-content,
.archive .site-content,
.woocommerce-page .site-content,
.tax-product_cat .site-content,
.has-hero-banner .site-content,
.site-content:has(.collection-hero-banner),
.site-content:has(.experience-hero),
.site-content:has(.workshop-hero),
.site-content:has(.front-page-main) {
	padding-top: 0;
}

/* ==========================================================================
   Responsive Images & Embedded Media
   ========================================================================== */

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

iframe,
video,
embed,
object {
	max-width: 100%;
}

/* ==========================================================================
   Container Utility
   ========================================================================== */

.site-container {
	width: 100%;
	max-width: var(--mc-container-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--mc-spacing-md);
	padding-right: var(--mc-spacing-md);
}

@media (min-width: 1200px) {
	.site-container {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/* ==========================================================================
   Accessible Focus Styles
   ========================================================================== */

:focus-visible {
	outline: 2px solid var(--mc-color-focus);
	outline-offset: 3px;
}

/* Accessible Screen Reader / Visually Hidden Utility */
.visually-hidden,
.screen-reader-text,
.sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Header Announcement Bar Override (Reference has no announcement bar on collections/inner pages) */
.header-announcement-bar {
	display: none !important;
}

/* ==========================================================================
   Typography & Elements
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	color: var(--mc-color-heading);
	font-weight: 600;
	line-height: 1.25;
	margin-top: 0;
	margin-bottom: var(--mc-spacing-sm);
	letter-spacing: -0.01em;
}

h1 { font-size: 2.25rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.35rem; }
h4 { font-size: 1.15rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }

p {
	margin-top: 0;
	margin-bottom: var(--mc-spacing-sm);
}

a {
	color: var(--mc-color-cacao);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
	transition: color 0.15s ease-in-out;
}

a:hover,
a:focus {
	color: var(--mc-color-accent);
}

/* ==========================================================================
   HEADER 1: ANNOUNCEMENT BAR
   ========================================================================== */

.header-announcement-bar {
	background-color: var(--mc-color-cacao-dark);
	color: #ffffff;
	padding: 7px 0;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.announcement-container {
	display: flex;
	justify-content: center;
	align-items: center;
}

.announcement-text {
	margin: 0;
	line-height: 1.4;
}

/* ==========================================================================
   HEADER 2: STICKY NAVIGATION BAR & HOMEPAGE TRANSPARENT OVERLAY
   ========================================================================== */

.site-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	width: 100%;
	background-color: #121212;
	transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* WordPress Admin Bar Compatibility */
body.admin-bar .site-header {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .site-header {
		top: 46px;
	}
}

@media screen and (max-width: 600px) {
	body.admin-bar .site-header {
		top: 0;
	}
}

/* --------------------------------------------------------------------------
   HOMEPAGE TRANSPARENT HEADER OVERLAY
   -------------------------------------------------------------------------- */

/* Hide shipping announcement bar on homepage */
body.home .header-announcement-bar {
	display: none !important;
}

/* Initial transparent header state on homepage */
body.home .site-header:not(.is-scrolled),
.site-header.header--transparent:not(.is-scrolled) {
	background-color: transparent !important;
	box-shadow: none !important;
}

body.home .site-header:not(.is-scrolled) .header-main-bar,
.site-header.header--transparent:not(.is-scrolled) .header-main-bar {
	background-color: transparent !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
	box-shadow: none !important;
}

/* Homepage Transparent Header Overlay (Header overlays hero without shifting hero upward) */
body.home .site-header {
	margin-bottom: calc(-1 * (var(--mc-header-height, 68px) + 1px));
}

@media (max-width: 1080px) {
	body.home .site-header {
		margin-bottom: -65px;
	}
}

body.home .site-main.front-page-main,
body.home .hero-promotional-section {
	margin-top: 0;
	position: relative;
	z-index: 1;
}

/* Scrolled state on homepage (smooth transition to solid #121212) */
body.home .site-header.is-scrolled,
.site-header.header--transparent.is-scrolled {
	background-color: #121212 !important;
}

body.home .site-header.is-scrolled .header-main-bar,
.site-header.header--transparent.is-scrolled .header-main-bar {
	background-color: #121212 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

/* Inner pages announcement bar */
.header-announcement-bar {
	background-color: #0d0d0d;
	color: rgba(255, 255, 255, 0.9);
	padding: 8px 0;
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Main Bar Default for Inner Pages */
.header-main-bar {
	background-color: #121212;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.site-header.is-scrolled .header-main-bar {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.header-main-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: var(--mc-header-height, 68px);
	gap: 1.5rem;
}

/* Mobile Toggle Wrap */
.header-mobile-toggle-wrap {
	display: none;
}

.mobile-menu-toggle {
	background: transparent;
	border: none;
	padding: 8px;
	margin-left: -8px;
	color: #ffffff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--mc-radius-sm);
	transition: opacity 0.15s ease;
}

.mobile-menu-toggle:hover {
	opacity: 0.8;
}

/* Site Branding / Logo Wordmark */
.site-branding {
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.site-brand-link {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
}

.site-brand-text {
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #ffffff;
	display: inline-block;
	transition: opacity 0.15s ease;
}

.site-brand-link:hover .site-brand-text {
	opacity: 0.85;
}

.brand-logo-white {
	display: block !important;
	max-height: 38px;
	width: auto;
	object-fit: contain;
}

.brand-logo-dark {
	display: none !important;
}

/* ==========================================================================
   DESKTOP PRIMARY NAVIGATION (TITLE-CASE, WHITE UNDERLINE HOVER)
   ========================================================================== */

.desktop-navigation {
	flex: 1 1 auto;
	display: flex;
	justify-content: center;
}

.primary-nav-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 20px;
}

.primary-nav-menu > .menu-item {
	position: relative;
}

.primary-nav-menu > .menu-item > .menu-link,
.primary-nav-menu > .menu-item > a {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 24px 0;
	font-family: var(--mc-font-sans, "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13.5px;
	font-weight: 400;
	letter-spacing: 0.01em;
	text-transform: none; /* Title-case, never uppercase */
	color: #ffffff;
	text-decoration: none;
	position: relative;
	transition: opacity 0.15s ease;
	white-space: nowrap;
}

/* Animated White Underline on Hover */
.primary-nav-menu > .menu-item > .menu-link::after,
.primary-nav-menu > .menu-item > a::after {
	content: "";
	position: absolute;
	bottom: 18px;
	left: 0;
	width: 0;
	height: 1.5px;
	background-color: #ffffff;
	transition: width 0.22s ease-in-out;
}

.primary-nav-menu > .menu-item:hover > .menu-link,
.primary-nav-menu > .menu-item:hover > a,
.primary-nav-menu > .menu-item.focus > .menu-link,
.primary-nav-menu > .menu-item.focus > a {
	opacity: 0.9;
}

.primary-nav-menu > .menu-item:hover > .menu-link::after,
.primary-nav-menu > .menu-item:hover > a::after,
.primary-nav-menu > .menu-item.focus > .menu-link::after,
.primary-nav-menu > .menu-item.focus > a::after {
	width: 100%;
}

.dropdown-chevron {
	display: inline-flex;
	align-items: center;
	transition: transform 0.2s ease;
	opacity: 0.7;
	color: #ffffff;
}

.primary-nav-menu > .menu-item:hover .dropdown-chevron,
.primary-nav-menu > .menu-item.focus .dropdown-chevron {
	transform: rotate(180deg);
	opacity: 1;
}

/* ==========================================================================
   AUTHENTIC CASCADING FLYOUT MENUS (EXACT MANAM CHOCOLATE WHITE & BLACK TREATMENT)
   ========================================================================== */

/* Level 1 Flyout */
.primary-nav-menu .nav-dropdown,
.primary-nav-menu ul.sub-menu {
	display: block;
	position: absolute;
	top: 100%;
	left: 0;
	width: max-content;
	min-width: 340px;
	background-color: #ffffff !important;
	color: rgb(40, 40, 40) !important;
	border: 1px solid rgba(40, 40, 40, 0.15) !important;
	border-radius: 0px !important;
	padding: 20px 0 !important;
	margin: 0;
	list-style: none;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(6px);
	transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
	z-index: 1050;
	white-space: nowrap;
}

/* Open Level 1 on parent hover or focus */
.primary-nav-menu > .menu-item-has-children:hover > .nav-dropdown,
.primary-nav-menu > .menu-item-has-children:hover > ul.sub-menu,
.primary-nav-menu > .menu-item-has-children.focus > .nav-dropdown,
.primary-nav-menu > .menu-item-has-children.focus > ul.sub-menu,
.primary-nav-menu > .menu-item-has-children:focus-within > .nav-dropdown,
.primary-nav-menu > .menu-item-has-children:focus-within > ul.sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.primary-nav-menu .nav-dropdown__item,
.primary-nav-menu .dropdown-item,
.primary-nav-menu ul.sub-menu > li {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	background-color: transparent !important;
}

/* Strictly Remove Underlines from ALL Dropdown Links */
.primary-nav-menu .nav-dropdown a,
.primary-nav-menu .nav-dropdown__link,
.primary-nav-menu .dropdown-link,
.primary-nav-menu ul.sub-menu a,
.nav-dropdown a,
.nav-dropdown__link {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 3px 30px !important;
	font-family: "infini romain", Georgia, serif !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 26px !important;
	letter-spacing: normal !important;
	color: rgb(40, 40, 40) !important;
	background-color: transparent !important;
	text-decoration: none !important;
	text-decoration-line: none !important;
	text-decoration-thickness: 0 !important;
	text-underline-offset: 0 !important;
	border-bottom: none !important;
	box-shadow: none !important;
	text-transform: none !important;
	white-space: nowrap !important;
	transition: background-color 0.15s ease, color 0.15s ease;
	outline: none;
}

/* Prevent any inherited underline or pseudo-element underline on hover/focus */
.primary-nav-menu .nav-dropdown a:hover,
.primary-nav-menu .nav-dropdown a:focus,
.primary-nav-menu .nav-dropdown__link:hover,
.primary-nav-menu .nav-dropdown__link:focus,
.primary-nav-menu .dropdown-link:hover,
.primary-nav-menu .dropdown-link:focus,
.primary-nav-menu ul.sub-menu a:hover,
.primary-nav-menu ul.sub-menu a:focus,
.nav-dropdown a:hover,
.nav-dropdown a:focus,
.nav-dropdown__link:hover,
.nav-dropdown__link:focus {
	background-color: rgba(0, 0, 0, 0.04) !important;
	color: #000000 !important;
	text-decoration: none !important;
	text-decoration-line: none !important;
	border-bottom: none !important;
	box-shadow: none !important;
}

.primary-nav-menu .nav-dropdown a::after,
.primary-nav-menu .nav-dropdown a::before,
.primary-nav-menu .nav-dropdown__link::after,
.primary-nav-menu .nav-dropdown__link::before,
.primary-nav-menu .dropdown-link::after,
.primary-nav-menu .dropdown-link::before,
.primary-nav-menu ul.sub-menu a::after,
.primary-nav-menu ul.sub-menu a::before,
.nav-dropdown a::after,
.nav-dropdown a::before {
	display: none !important;
	content: none !important;
	width: 0 !important;
	height: 0 !important;
}

/* Active parent state when hovered or when its submenu is open */
.primary-nav-menu .nav-dropdown__item.has-dropdown:hover > .nav-dropdown__link,
.primary-nav-menu .nav-dropdown__item.has-dropdown.focus > .nav-dropdown__link,
.primary-nav-menu .nav-dropdown__item.has-dropdown.is-open > .nav-dropdown__link,
.primary-nav-menu .nav-dropdown__item.has-dropdown:focus-within > .nav-dropdown__link {
	background-color: rgba(0, 0, 0, 0.04) !important;
	color: #000000 !important;
}

/* Level 2 Sub-Flyout (Right Cascading Menu) */
.primary-nav-menu .nav-dropdown .nav-dropdown,
.primary-nav-menu .nav-dropdown__item.has-dropdown > .nav-dropdown,
.primary-nav-menu .dropdown-has-submenu > .nav-dropdown,
.primary-nav-menu ul.sub-menu li > ul.sub-menu {
	display: block !important;
	position: absolute !important;
	top: -20px !important;
	left: 100% !important;
	width: max-content !important;
	min-width: 250px !important;
	background-color: #ffffff !important;
	color: rgb(40, 40, 40) !important;
	border: 1px solid rgba(40, 40, 40, 0.15) !important;
	border-radius: 0px !important;
	padding: 20px 0 !important;
	margin: 0 !important;
	list-style: none !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transform: translateX(6px) !important;
	transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s !important;
	z-index: 1060 !important;
	white-space: nowrap !important;
}

/* Invisible Hover Bridge between Parent Item and Submenu to prevent premature closing */
.primary-nav-menu .nav-dropdown .nav-dropdown::before,
.primary-nav-menu ul.sub-menu ul.sub-menu::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -20px;
	width: 25px;
	background: transparent;
	pointer-events: auto;
}

/* Open Level 2 on parent hover, keyboard focus, or active click state */
.primary-nav-menu .nav-dropdown__item.has-dropdown:hover > .nav-dropdown,
.primary-nav-menu .nav-dropdown__item.has-dropdown.focus > .nav-dropdown,
.primary-nav-menu .nav-dropdown__item.has-dropdown.is-open > .nav-dropdown,
.primary-nav-menu .nav-dropdown__item.has-dropdown:focus-within > .nav-dropdown,
.primary-nav-menu .dropdown-has-submenu:hover > .nav-dropdown,
.primary-nav-menu .dropdown-has-submenu.focus > .nav-dropdown,
.primary-nav-menu .dropdown-has-submenu.is-open > .nav-dropdown,
.primary-nav-menu .dropdown-has-submenu:focus-within > .nav-dropdown,
.primary-nav-menu ul.sub-menu li.has-dropdown:hover > ul.sub-menu,
.primary-nav-menu ul.sub-menu li.menu-item-has-children:hover > ul.sub-menu,
.primary-nav-menu ul.sub-menu li:hover > ul.sub-menu,
.primary-nav-menu ul.sub-menu li.is-open > ul.sub-menu,
.primary-nav-menu ul.sub-menu li.focus > ul.sub-menu,
.primary-nav-menu ul.sub-menu li:focus-within > ul.sub-menu {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transform: translateX(0) !important;
}

/* Right-Facing Arrow Icon for Nested Categories */
.dropdown-arrow-right {
	display: inline-flex;
	align-items: center;
	margin-left: 20px;
	color: rgba(40, 40, 40, 0.65) !important;
	transition: transform 0.15s ease, color 0.15s ease;
	flex-shrink: 0;
	cursor: pointer;
}

.nav-dropdown__item:hover > .nav-dropdown__link .dropdown-arrow-right,
.nav-dropdown__item.is-open > .nav-dropdown__link .dropdown-arrow-right,
.dropdown-has-submenu:hover > .dropdown-link .dropdown-arrow-right,
.dropdown-has-submenu.is-open > .dropdown-link .dropdown-arrow-right {
	color: #000000 !important;
	transform: translateX(2px);
}

/* View All Links inside Dropdowns */
.nav-dropdown .view-all-link {
	border-top: 1px solid rgba(40, 40, 40, 0.08) !important;
	margin-top: 6px !important;
	padding-top: 10px !important;
}

/* New Badge for Seasonal Collections */
.nav-badge-new {
	display: inline-block;
	background-color: #d4a373;
	color: #121212;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 1px 5px;
	border-radius: 2px;
	margin-left: 6px;
	vertical-align: middle;
}

/* Remove Underlines from Mobile Drawer links */
.mobile-nav-menu a,
.mobile-sub-list a,
.mobile-menu-item a {
	text-decoration: none !important;
	text-decoration-line: none !important;
	border-bottom: none !important;
}

/* ==========================================================================
   HEADER ACTIONS (RIGHT: EMAIL, SEARCH, ACCOUNT, CART)
   ========================================================================== */

.header-actions {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 20px;
}

.header-action-btn,
.header__icon-wrapper {
	background: transparent;
	border: none;
	padding: 0;
	margin: 0;
	color: #ffffff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	text-decoration: none;
	line-height: 1;
	transition: opacity 0.18s ease;
}

.header-action-btn:hover,
.header-action-btn:focus,
.header__icon-wrapper:hover,
.header__icon-wrapper:focus {
	opacity: 0.8;
	color: #ffffff;
}

.icon {
	display: block;
	flex-shrink: 0;
}

/* Floating Cart Count Badge (Exact Reference Bubble Count) */
.header__cart-count--floating,
.cart-count-badge {
	position: absolute;
	top: -8px;
	right: -12px;
	height: 19px;
	min-width: 19px;
	padding: 0 4px;
	border-radius: 19px;
	background: #ffffff;
	color: #121212;
	font-family: "infini romain", Georgia, serif;
	font-size: 9px;
	font-weight: 700;
	line-height: 19px;
	text-align: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
	pointer-events: none;
	letter-spacing: 0;
}

/* ==========================================================================
   AUTHENTIC BLINKIT AVAILABILITY MODAL (REFERENCE EXACT PARITY)
   ========================================================================== */

#newsletter-popup.modal,
.blinkit-modal {
	position: fixed;
	inset: 0;
	z-index: 10005;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
}

#newsletter-popup.is-active,
.blinkit-modal.is-active {
	opacity: 1;
	visibility: visible;
}

.modal__overlay {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
}

.modal__content.blinkit-modal__content {
	position: relative;
	z-index: 10;
	width: 90vw;
	max-width: 500px;
	background-color: #000000;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
	transform: scale(0.94);
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

#newsletter-popup.is-active .modal__content {
	transform: scale(1);
}

.modal__close-button {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 20;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: rgba(0, 0, 0, 0.5);
	color: #ffffff;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.2s ease, transform 0.15s ease;
}

.modal__close-button:hover,
.modal__close-button:focus {
	background-color: rgba(0, 0, 0, 0.85);
	transform: scale(1.05);
	color: #ffffff;
}

.newsletter-modal__link.blinkit-modal__link {
	display: block;
	position: relative;
	width: 100%;
	text-decoration: none;
	line-height: 0;
}

.newsletter-modal__image.blinkit-modal__image {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: 8px;
}

/* ==========================================================================
   STAGE 5.11: EXACT RIGHT-SIDE PREDICTIVE SEARCH DRAWER & BORDER ALIGNMENT
   ========================================================================== */

.drawer.predictive-search {
	position: fixed;
	inset: 0;
	z-index: 10010;
	display: block;
	visibility: hidden;
	pointer-events: none;
	transition: visibility 0.35s ease;
}

.drawer.predictive-search.is-active,
.drawer.predictive-search[open] {
	visibility: visible;
	pointer-events: auto;
}

.drawer__overlay {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.55);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity 0.35s ease;
	pointer-events: none;
}

.drawer.predictive-search.is-active .drawer__overlay {
	opacity: 1;
	pointer-events: auto;
}

.drawer__container {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: auto;
	width: 89vw;
	max-width: 500px;
	height: 100%;
	height: 100vh;
	background-color: #ffffff;
	color: #121212;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
	box-shadow: -10px 0 35px rgba(0, 0, 0, 0.2);
	border-left: 1px solid rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
	overflow: hidden;
	pointer-events: auto;
	z-index: 2;
}

.drawer.predictive-search.is-active .drawer__container {
	transform: translateX(0);
}

/* Ensure body does not scroll horizontally */
body.search-drawer-open {
	overflow: hidden;
}

/* Drawer Header - Perfectly Contained Inside Panel */
.drawer__header {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-shrink: 0;
	height: 74px;
	padding: 0 20px 0 24px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	background: #ffffff;
	box-sizing: border-box;
	width: 100%;
}

.predictive-search__form {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	margin: 0;
	gap: 12px;
	box-sizing: border-box;
}

.predictive-search__form .icon--header-search {
	color: #121212;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
}

.predictive-search__input {
	flex: 1 1 auto;
	min-width: 0;
	border: none;
	outline: none;
	box-shadow: none;
	background: transparent;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 15px;
	font-weight: 400;
	color: #121212;
	padding: 10px 0;
	box-sizing: border-box;
}

.predictive-search__input::placeholder {
	color: rgba(18, 18, 18, 0.55);
	font-weight: 400;
}

.predictive-search__clear-btn {
	background: transparent;
	border: none;
	color: rgba(18, 18, 18, 0.5);
	cursor: pointer;
	padding: 4px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color 0.15s ease;
}

.predictive-search__clear-btn:hover {
	color: #121212;
}

.drawer__close-button {
	background: transparent;
	border: none;
	color: #121212;
	cursor: pointer;
	padding: 8px;
	margin-left: 8px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.15s ease;
	line-height: 1;
}

.drawer__close-button:hover {
	opacity: 0.7;
}

/* Drawer Content - Fully Contained with Smooth Vertical Scroll */
.drawer__content {
	flex: 1 1 auto;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 24px;
	background: #ffffff;
	box-sizing: border-box;
	width: 100%;
}

.predictive-search__content-wrapper {
	width: 100%;
	box-sizing: border-box;
}

.predictive-search__initial-state {
	padding: 40px 10px;
	text-align: center;
	color: #71717a;
	font-size: 14px;
	line-height: 1.6;
	box-sizing: border-box;
}

/* Spinner */
.predictive-search__loading-state {
	display: flex;
	justify-content: center;
	padding: 30px 0;
	box-sizing: border-box;
}

.search-spinner {
	width: 36px;
	height: 36px;
	animation: spin 0.8s linear infinite;
}

.search-spinner .spinner-svg {
	width: 100%;
	height: 100%;
}

@keyframes spin {
	100% { transform: rotate(360deg); }
}

/* Results Menu & Product List */
.predictive-search__menu {
	width: 100%;
	box-sizing: border-box;
}

.predictive-search__menu-title {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #71717a;
	margin: 0 0 16px;
}

.predictive-search__product-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
	box-sizing: border-box;
}

.predictive-search__product-item.line-item {
	position: relative;
	border-radius: 4px;
	border: 1px solid transparent;
	transition: background-color 0.15s ease, border-color 0.15s ease;
	box-sizing: border-box;
	width: 100%;
}

.predictive-search__product-item.is-selected,
.predictive-search__product-item:hover {
	background-color: #f7f6f4;
	border-color: rgba(0, 0, 0, 0.05);
}

.line-item__content-wrapper {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 8px 10px;
	text-decoration: none;
	color: inherit;
	box-sizing: border-box;
	width: 100%;
}

.line-item__image-wrapper {
	width: 68px;
	height: 68px;
	flex-shrink: 0;
	border-radius: 4px;
	overflow: hidden;
	background: #faf6f0;
	box-sizing: border-box;
}

.line-item__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.line-item__info {
	flex: 1 1 auto;
	min-width: 0;
	box-sizing: border-box;
}

.line-item__title {
	display: block;
	font-family: "infini romain", Georgia, serif;
	font-size: 14.5px;
	font-weight: 400;
	color: #121212;
	line-height: 1.35;
	margin-bottom: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.line-item__cacao-badge {
	display: inline-block;
	font-size: 10.5px;
	font-weight: 600;
	text-transform: uppercase;
	color: #633927;
	letter-spacing: 0.04em;
	margin-bottom: 3px;
}

.line-item__price-wrap {
	font-size: 13.5px;
	font-weight: 500;
	color: #121212;
}

.line-item__arrow {
	color: #121212;
	opacity: 0;
	flex-shrink: 0;
	transform: translateX(-6px);
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.predictive-search__product-item:hover .line-item__arrow,
.predictive-search__product-item.is-selected .line-item__arrow {
	opacity: 1;
	transform: translateX(0);
}

/* No Results State in Drawer */
.predictive-search__no-results {
	padding: 30px 10px;
	text-align: center;
	box-sizing: border-box;
	width: 100%;
}

.predictive-search__no-results .no-results-text {
	font-family: "infini romain", Georgia, serif;
	font-size: 16px;
	font-weight: 500;
	color: #121212;
	margin-bottom: 8px;
}

.predictive-search__no-results .no-results-subtext {
	font-size: 13.5px;
	color: #71717a;
	line-height: 1.5;
	margin-bottom: 20px;
}

.predictive-search__suggestions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}

.search-suggest-chip {
	background: #f4eee7;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 20px;
	padding: 6px 14px;
	font-size: 12.5px;
	color: #27272a;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.search-suggest-chip:hover {
	background: #ebe0d3;
	border-color: #633927;
}

/* Drawer Footer - Perfectly Contained Inside Panel */
.drawer__footer {
	flex-shrink: 0;
	padding: 16px 24px 24px;
	background: #ffffff;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
	box-sizing: border-box;
	width: 100%;
}

.predictive-search__view-all-btn {
	width: 100%;
	display: block;
	box-sizing: border-box;
	background-color: #121212;
	color: #ffffff;
	border: none;
	padding: 14px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
	border-radius: 2px;
	transition: background-color 0.2s ease;
}

.predictive-search__view-all-btn:hover {
	background-color: #333333;
	color: #ffffff;
}

@media (max-width: 768px) {
	.drawer__container {
		width: 100vw;
		max-width: 100vw;
		border-left: none;
	}
	.drawer__header {
		height: 64px;
		padding: 0 16px;
	}
	.drawer__content {
		padding: 16px;
	}
	.drawer__footer {
		padding: 14px 16px 20px;
	}
}


/* ==========================================================================
   STAGE 5.10: FULL SEARCH RESULTS PAGE STYLING (search.php)
   ========================================================================== */

.site-search-page {
	background-color: #faf6f0;
	min-height: 80vh;
	padding-bottom: 80px;
}

.search-page-header {
	background-color: #121212;
	color: #ffffff;
	padding: 60px 0 45px;
	text-align: center;
}

.search-breadcrumbs {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 20px;
}

.search-breadcrumbs a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: none;
	transition: color 0.15s ease;
}

.search-breadcrumbs a:hover {
	color: #ffffff;
}

.search-page-title {
	font-family: "infini romain", Georgia, serif;
	font-size: clamp(24px, 3.5vw, 36px);
	font-weight: 400;
	letter-spacing: 0.04em;
	color: #ffffff;
	margin: 0 0 28px;
}

.search-refine-bar {
	max-width: 520px;
	margin: 0 auto;
}

.search-refine-input-wrap {
	display: flex;
	align-items: center;
	background-color: #1e1e1e;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 4px;
	padding: 4px 6px 4px 16px;
	transition: border-color 0.2s ease;
}

.search-refine-input-wrap:focus-within {
	border-color: #ffffff;
}

.search-refine-input-wrap .icon-search {
	color: rgba(255, 255, 255, 0.6);
	margin-right: 10px;
	flex-shrink: 0;
}

.search-refine-input {
	flex: 1;
	background: transparent;
	border: none;
	outline: none;
	color: #ffffff;
	font-size: 15px;
	padding: 8px 0;
}

.search-refine-submit {
	background-color: #ffffff;
	color: #121212;
	border: none;
	border-radius: 2px;
	padding: 9px 18px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.search-refine-submit:hover {
	background-color: #e2e2e2;
}

/* Search Toolbar */
.search-facet-meta-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 30px 0 20px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	margin-bottom: 35px;
}

.search-product-grid-wrap .products.products-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 28px 24px;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (max-width: 1080px) {
	.search-product-grid-wrap .products.products-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 768px) {
	.search-product-grid-wrap .products.products-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px 14px;
	}
}

/* Search No Results Box */
.search-no-results-box {
	padding: 60px 20px;
	text-align: center;
	max-width: 600px;
	margin: 0 auto;
}

.no-results-icon {
	color: #71717a;
	margin-bottom: 20px;
}

.no-results-title {
	font-family: "infini romain", Georgia, serif;
	font-size: 26px;
	font-weight: 400;
	color: #121212;
	margin-bottom: 12px;
}

.no-results-desc {
	font-size: 14.5px;
	color: #71717a;
	line-height: 1.6;
	margin-bottom: 28px;
}

.no-results-pills {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-bottom: 35px;
}

.search-suggestion-pill {
	display: inline-block;
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 24px;
	padding: 8px 18px;
	font-size: 13.5px;
	color: #121212;
	text-decoration: none;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
	transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.search-suggestion-pill:hover {
	background: #f4eee7;
	border-color: #633927;
	transform: translateY(-1px);
	text-decoration: none;
}

.btn-browse-catalogue {
	display: inline-block;
	background-color: #121212;
	color: #ffffff;
	border: none;
	border-radius: 2px;
	padding: 13px 28px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.btn-browse-catalogue:hover {
	background-color: #333333;
	color: #ffffff;
	text-decoration: none;
}


/* ==========================================================================
   MOBILE NAVIGATION DRAWER (#121212 Dark Theme, Accordions, Plus/Minus)
   ========================================================================== */

.mobile-navigation-drawer {
	position: fixed;
	inset: 0;
	z-index: 10001;
	pointer-events: none;
	visibility: hidden;
	transition: visibility 0.3s ease;
}

@media (min-width: 1081px) {
	#mobile-navigation-drawer,
	.mobile-navigation-drawer {
		display: none !important;
	}
}

.mobile-navigation-drawer.is-open {
	pointer-events: auto;
	visibility: visible;
}

.mobile-drawer-backdrop {
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

.mobile-navigation-drawer.is-open .mobile-drawer-backdrop {
	opacity: 1;
	pointer-events: auto;
}

.mobile-drawer-panel {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 86%;
	max-width: 390px;
	background-color: #121212;
	color: #ffffff;
	box-shadow: 10px 0 30px rgba(0, 0, 0, 0.5);
	transform: translateX(-100%);
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.mobile-navigation-drawer.is-open .mobile-drawer-panel {
	transform: translateX(0);
}

/* Drawer Header */
.mobile-drawer-header {
	padding: 16px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.mobile-drawer-close {
	background: transparent;
	border: none;
	padding: 6px;
	color: #ffffff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--mc-radius-sm);
	transition: opacity 0.15s ease;
}

.mobile-drawer-close:hover {
	opacity: 0.8;
}

/* Drawer Search */
.mobile-drawer-search {
	padding: 12px 18px;
	background-color: #181818;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.mobile-search-wrap {
	display: flex;
	align-items: center;
	background-color: #121212;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 2px;
	padding: 2px 4px 2px 10px;
}

.mobile-search-input {
	flex: 1;
	border: none;
	background: transparent;
	font-family: inherit;
	font-size: 0.88rem;
	color: #ffffff;
	padding: 6px;
	outline: none;
}

.mobile-search-submit {
	background: transparent;
	border: none;
	padding: 6px;
	color: rgba(255, 255, 255, 0.6);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Drawer Body & Accordions */
.mobile-drawer-body {
	flex: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 8px 0;
}

.mobile-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mobile-menu-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.accordion-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 13px 20px;
}

.mobile-item-link {
	font-size: 0.95rem;
	font-weight: 500;
	color: #ffffff;
	text-decoration: none;
	flex: 1;
	letter-spacing: 0.01em;
	transition: color 0.15s ease;
}

.mobile-item-link:hover {
	color: #d4a373;
}

.accordion-toggle-btn {
	background: transparent;
	border: none;
	padding: 6px 8px;
	color: rgba(255, 255, 255, 0.7);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color 0.15s ease;
}

.animated-plus {
	position: relative;
	display: inline-block;
	width: 12px;
	height: 12px;
}

.animated-plus::before,
.animated-plus::after {
	content: "";
	position: absolute;
	background-color: currentColor;
	transition: transform 0.25s ease;
}

.animated-plus::before {
	top: 5px;
	left: 0;
	width: 12px;
	height: 1.5px;
}

.animated-plus::after {
	top: 0;
	left: 5px;
	width: 1.5px;
	height: 12px;
}

.accordion-toggle-btn[aria-expanded="true"] .animated-plus::after {
	transform: rotate(90deg);
	opacity: 0;
}

.accordion-panel {
	background-color: #181818;
	padding: 8px 20px 16px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.mobile-sub-group {
	margin-bottom: 14px;
}

.mobile-sub-title {
	font-size: 0.74rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #d4a373;
	margin: 8px 0 6px;
}

.mobile-sub-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.mobile-sub-list a {
	font-size: 0.88rem;
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
	padding: 3px 0;
	display: inline-block;
}

.mobile-sub-list a:hover {
	color: #ffffff;
}

.mobile-view-all {
	font-weight: 600;
	color: #d4a373 !important;
	font-size: 0.82rem !important;
	margin-top: 2px;
}

/* Mobile Preferences Tags */
.mobile-pref-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 6px;
}

.mobile-pref-tags a {
	font-size: 0.74rem;
	font-weight: 500;
	padding: 3px 9px;
	background-color: #222222;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: var(--mc-radius-pill);
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
}

/* Drawer Footer */
.mobile-drawer-footer {
	padding: 14px 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	background-color: #121212;
	display: flex;
	gap: 10px;
}

.mobile-footer-action-link {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	padding: 9px 12px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 2px;
	font-size: 0.84rem;
	font-weight: 500;
	color: #ffffff;
	text-decoration: none;
	background-color: #181818;
	transition: all 0.15s ease;
}

.mobile-footer-action-link:hover {
	background-color: #242424;
	border-color: #ffffff;
}

.mobile-cart-count {
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	border-radius: 50%;
	background-color: #ffffff;
	color: #121212;
	font-size: 10px;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
}

/* ==========================================================================
   RESPONSIVE BREAKPOINTS (DESKTOP VS MOBILE/TABLET)
   ========================================================================== */

@media (max-width: 1080px) {
	:root {
		--mc-header-height: 64px;
	}

	.header-mobile-toggle-wrap {
		display: block;
	}

	.desktop-navigation {
		display: none;
	}

	.header-main-inner {
		justify-content: space-between;
	}

	.site-branding {
		flex: 1;
		justify-content: center;
	}

	.header-actions {
		gap: 0.85rem;
	}
}

@media (max-width: 480px) {
	.announcement-text {
		font-size: 10.5px;
		letter-spacing: 0.05em;
	}

	.site-brand-text {
		font-size: 1.02rem;
		letter-spacing: 0.1em;
	}

	.header-actions {
		gap: 0.65rem;
	}
}

/* ==========================================================================
   CONTENT LAYOUTS & POST CARDS
   ========================================================================== */

.posts-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--mc-spacing-lg);
	margin-top: var(--mc-spacing-md);
	margin-bottom: var(--mc-spacing-lg);
}

@media (min-width: 768px) {
	.posts-list {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.posts-list {
		grid-template-columns: repeat(3, 1fr);
	}
}

.entry-card {
	background-color: #ffffff;
	border: 1px solid var(--mc-color-border);
	border-radius: var(--mc-radius-md);
	padding: var(--mc-spacing-md);
	display: flex;
	flex-direction: column;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.entry-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--mc-shadow-dropdown);
}

.entry-card .entry-thumbnail {
	margin-bottom: var(--mc-spacing-sm);
	border-radius: var(--mc-radius-sm);
	overflow: hidden;
}

.entry-card .entry-title {
	font-size: 1.25rem;
	margin-bottom: 0.5rem;
}

.entry-card .entry-title a {
	text-decoration: none;
	color: var(--mc-color-heading);
}

.entry-card .entry-title a:hover {
	color: var(--mc-color-accent);
}

.entry-meta {
	font-size: 0.8125rem;
	color: var(--mc-color-muted);
	margin-bottom: var(--mc-spacing-sm);
}

.entry-summary {
	flex-grow: 1;
	font-size: 0.9375rem;
	color: var(--mc-color-muted);
	margin-bottom: var(--mc-spacing-sm);
}

.entry-footer .read-more-link {
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--mc-color-cacao);
}

/* Single & Page Layouts */
.single-post-main,
.page-article {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

.post-hero-thumbnail,
.page-thumbnail {
	margin-top: var(--mc-spacing-md);
	margin-bottom: var(--mc-spacing-md);
	border-radius: var(--mc-radius-md);
	overflow: hidden;
}

.entry-content {
	line-height: 1.8;
}

/* Pagination */
.pagination,
.posts-pagination {
	margin-top: var(--mc-spacing-lg);
	display: flex;
	justify-content: center;
	gap: 0.5rem;
}

.pagination .nav-links {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.pagination a,
.pagination span.current {
	display: inline-block;
	padding: 0.5rem 0.85rem;
	border: 1px solid var(--mc-color-border);
	border-radius: var(--mc-radius-sm);
	text-decoration: none;
	font-size: 0.875rem;
	font-weight: 500;
}

.pagination span.current {
	background-color: var(--mc-color-cacao);
	color: #ffffff;
	border-color: var(--mc-color-cacao);
}

/* Forms & Buttons */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
	width: 100%;
	padding: 0.65rem 0.85rem;
	border: 1px solid var(--mc-color-border);
	border-radius: var(--mc-radius-sm);
	font-family: inherit;
	font-size: 0.95rem;
	background-color: #ffffff;
	color: var(--mc-color-text);
}

button,
input[type="submit"],
.btn-primary {
	display: inline-block;
	background-color: var(--mc-color-cacao);
	color: #ffffff;
	border: none;
	border-radius: var(--mc-radius-sm);
	padding: 0.65rem 1.25rem;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
	transition: background-color 0.15s ease-in-out;
}

button:not(.collapsible-toggle):not(.filter-group-header):not(.accordion-toggle-btn):hover,
input[type="submit"]:hover,
.btn-primary:hover {
	background-color: var(--mc-color-cacao-dark);
	color: #ffffff;
}

/* Search Form Fallback */
.search-form {
	display: flex;
	gap: 0.5rem;
	max-width: 500px;
	margin: var(--mc-spacing-sm) 0;
}

.search-form .search-field {
	flex-grow: 1;
}

/* 404 Page */
.error-404-container {
	text-align: center;
	max-width: 600px;
	margin: var(--mc-spacing-lg) auto;
}

.error-code {
	display: block;
	font-size: 5rem;
	font-weight: 800;
	color: var(--mc-color-accent);
	line-height: 1;
	margin-bottom: var(--mc-spacing-xs);
}

.error-actions {
	margin-top: var(--mc-spacing-md);
}

.error-actions .search-form {
	margin: 0 auto var(--mc-spacing-md);
}

/* ==========================================================================
   FOOTER (PHASE 10 - COMPLETE IMPLEMENTATION)
   ========================================================================== */

.site-footer {
	background-color: #121212;
	color: #ffffff;
	padding: 85px 0 34px;
	margin-top: auto;
	border-top: none;
	position: relative;
	width: 100%;
}

.footer-container {
	width: 100%;
}

/* Footer Main Grid */
.footer-main-row {
	display: grid;
	grid-template-columns: 270px 180px 180px 330px 1fr;
	gap: 40px;
	align-items: flex-start;
}

/* Column 0: Brand Logo */
.footer-col-brand {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.footer-brand-logo-link {
	display: inline-block;
	text-decoration: none;
}

.footer-brand-logo {
	width: 290px;
	height: auto;
	display: block;
}

/* Column Headings */
.footer-col-title,
h3.footer-col-title {
	margin: 0 0 20px 0;
	padding: 0;
	color: #ffffff !important;
}

.site-footer,
.site-footer * {
	box-sizing: border-box;
}

.site-footer a {
	color: #ffffff !important;
	text-decoration: none !important;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	transition: opacity 0.2s ease;
}

.site-footer a:hover,
.site-footer a:focus {
	color: #ffffff !important;
	text-decoration: none !important;
	opacity: 0.75;
}

.footer-title-desktop,
.footer-col-title .footer-title-desktop,
.footer-col-title span,
.footer-col-title a {
	font-family: var(--mc-font-sans, "FS Meridian Bold", "FS Meridian", sans-serif) !important;
	font-size: 20px !important;
	font-weight: 600 !important;
	letter-spacing: 1px !important;
	text-transform: uppercase !important;
	color: #ffffff !important;
	display: block;
	line-height: 1.3;
	margin-bottom: 20px;
}

/* Mobile Accordion Toggle Button */
.footer-accordion-toggle {
	display: none;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	background: none;
	border: none;
	padding: 16px 0;
	color: #ffffff !important;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	text-align: left;
}

.footer-accordion-icon {
	transition: transform 0.25s ease;
	color: #ffffff;
}

.footer-accordion-toggle[aria-expanded="true"] .footer-accordion-icon {
	transform: rotate(180deg);
}

/* Link Lists */
.footer-links-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.footer-links-list li {
	margin: 0;
	padding: 0;
}

.footer-links-list a {
	color: #ffffff !important;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 15px;
	font-weight: 400;
	line-height: 26px;
	text-decoration: none !important;
	display: inline-block;
	opacity: 1;
	transition: opacity 0.2s ease;
}

.footer-links-list a:hover {
	color: #ffffff !important;
	opacity: 0.75;
	transform: none;
}

/* Column 2: Stacked Subcolumns (About + Helpdesk) */
.footer-subcol-about {
	margin-bottom: 30px;
}

/* Column 3: Contact Details */
.footer-contact-content {
	display: flex;
	flex-direction: column;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 15px;
	color: #ffffff !important;
}

.contact-block.customer-care-block {
	margin-bottom: 20px;
	padding-bottom: 0;
	border-bottom: none;
}

.site-footer .contact-line,
.site-footer .contact-label {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 24px !important;
	color: #ffffff !important;
	margin: 0 0 6px 0 !important;
}

.site-footer .contact-label {
	color: #ffffff !important;
	margin-right: 6px !important;
}

.site-footer .contact-link,
.site-footer .footer-contact-link,
.site-footer a.contact-link,
.site-footer a.footer-contact-link {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	text-decoration: none !important;
	line-height: 24px !important;
	transition: opacity 0.2s ease !important;
}

.site-footer .contact-link:hover,
.site-footer .contact-link:focus,
.site-footer .footer-contact-link:hover,
.site-footer .footer-contact-link:focus,
.site-footer a.contact-link:hover,
.site-footer a.contact-link:focus {
	color: #ffffff !important;
	opacity: 0.75 !important;
	text-decoration: none !important;
}

.site-footer .contact-link:visited,
.site-footer .footer-contact-link:visited,
.site-footer a.contact-link:visited {
	color: #ffffff !important;
}

.site-footer .contact-hours {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	margin: 10px 0 0 0 !important;
	line-height: 24px !important;
}

.contact-stores-list {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 14px;
}

.store-item,
.footer-store-item {
	display: flex;
	flex-direction: column;
}

.site-footer .footer-col-contact .store-name,
.site-footer .footer-store-name,
.site-footer h4.store-name,
.site-footer h4.footer-store-name {
	font-family: var(--mc-font-sans, "FS Meridian Bold", "FS Meridian", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: #ffffff !important;
	margin: 0 0 2px 0 !important;
	line-height: 22px !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.site-footer .footer-col-contact .store-address,
.site-footer .footer-store-address,
.site-footer p.store-address,
.site-footer p.footer-store-address {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	margin: 0 0 2px 0 !important;
	line-height: 22px !important;
	letter-spacing: 0 !important;
}

.site-footer .footer-col-contact .store-phone,
.site-footer .footer-store-phone,
.site-footer p.store-phone,
.site-footer p.footer-store-phone {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	margin: 0 !important;
	line-height: 22px !important;
}

.site-footer .footer-col-contact .store-phone a,
.site-footer .footer-store-phone a {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	color: #ffffff !important;
	text-decoration: none !important;
	line-height: 22px !important;
}

.site-footer .footer-col-contact .store-phone a:hover,
.site-footer .footer-col-contact .store-phone a:focus,
.site-footer .footer-store-phone a:hover,
.site-footer .footer-store-phone a:focus {
	color: #ffffff !important;
	opacity: 0.75 !important;
	text-decoration: none !important;
}

.site-footer .footer-col-contact .store-phone a:visited,
.site-footer .footer-store-phone a:visited {
	color: #ffffff !important;
}

/* Column 4: Origin Emblem */
.footer-col-emblem {
	display: flex;
	justify-content: flex-end;
}

.footer-emblem-wrap {
	display: flex;
	justify-content: flex-end;
}

.footer-emblem-img {
	width: 175px;
	height: auto;
	opacity: 0.85;
	transition: opacity 0.3s ease;
}

.footer-emblem-img:hover {
	opacity: 1;
}

/* Bottom Legal & Social Row */
.footer-bottom-row {
	margin-top: 50px;
	padding-top: 24px;
	border-top: 1px solid #363636;
}

.footer-mobile-logo-wrap {
	display: none;
}

.footer-bottom-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}

.footer-copyright {
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #ffffff;
}

/* Social Media Links */
.footer-social-links {
	display: flex;
	align-items: center;
	gap: 14px;
}

.social-icon-link {
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-color: #1a1a1a;
	border: 1px solid #282828;
	transition: all 0.25s ease;
}

.social-icon-link:hover {
	color: #ffffff;
	background-color: #2a2a2a;
	border-color: #444444;
	transform: translateY(-2px);
}

.social-icon-link:focus-visible {
	outline: 2px solid var(--mc-color-focus, #1d70b8);
	outline-offset: 3px;
}

/* Legal Links */
.footer-legal-links {
	display: flex;
	align-items: center;
	gap: 16px;
}

.footer-legal-links a {
	color: #ffffff !important;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0;
	text-decoration: none !important;
	text-transform: uppercase;
	transition: opacity 0.2s ease;
}

.footer-legal-links a:hover {
	color: #ffffff !important;
	opacity: 0.75;
}

.legal-divider {
	color: #ffffff;
	font-size: 14px;
}

/* ==========================================================================
   FOOTER RESPONSIVE BREAKPOINTS
   ========================================================================== */

@media screen and (max-width: 1199px) {
	.footer-main-row {
		grid-template-columns: 230px 150px 150px 290px 1fr;
		gap: 28px;
	}

	.footer-brand-logo {
		width: 230px;
	}

	.footer-emblem-img {
		width: 140px;
	}
}

@media screen and (max-width: 991px) {
	.site-footer {
		padding: 65px 0 30px;
	}

	.footer-main-row {
		grid-template-columns: 1fr 1fr;
		gap: 36px 40px;
	}

	.footer-col-brand {
		grid-column: 1 / -1;
		margin-bottom: 8px;
	}

	.footer-col-emblem {
		display: none;
	}

	.footer-bottom-row {
		margin-top: 48px;
	}
}

@media screen and (max-width: 767px) {
	.site-footer {
		padding: 44px 0 36px;
	}

	.footer-main-row {
		display: flex;
		flex-direction: column;
		gap: 0;
	}

	.footer-col-brand {
		display: none;
	}

	/* Accordion Styles on Mobile */
	.footer-col-shop,
	.footer-subcol-about,
	.footer-subcol-helpdesk {
		border-bottom: 1px solid #525252;
	}

	.footer-accordion-toggle {
		display: flex;
	}

	.footer-title-desktop {
		display: none;
	}

	.footer-col-content {
		display: none;
		padding-bottom: 20px;
	}

	.footer-col-content.is-open {
		display: block;
		animation: mc-accordion-fade 0.25s ease;
	}

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

	.footer-subcol-about {
		margin-bottom: 0;
	}

	/* Contact column remains permanently visible on mobile */
	.footer-col-contact {
		padding-top: 28px;
		border-bottom: none;
	}

	.footer-col-contact .footer-title-desktop {
		display: block;
		margin-bottom: 18px;
	}

	.footer-col-contact .footer-col-content {
		display: block;
		padding-bottom: 0;
	}

	/* Bottom area mobile arrangement */
	.footer-bottom-row {
		margin-top: 36px;
		padding-top: 24px;
	}

	.footer-mobile-logo-wrap {
		display: flex;
		justify-content: center;
		margin-bottom: 22px;
	}

	.footer-mobile-logo {
		width: 220px;
		height: auto;
	}

	.footer-bottom-inner {
		flex-direction: column;
		text-align: center;
		gap: 16px;
	}

	.footer-social-links {
		justify-content: center;
		gap: 16px;
	}

	.footer-legal-links {
		justify-content: center;
	}
}

/* ==========================================================================
   HOMEPAGE PHASE 3: SECTIONS
   ========================================================================== */

.front-page-main {
	overflow-x: hidden;
	width: 100%;
}

.homepage-section {
	position: relative;
	width: 100%;
}

/* ==========================================================================
   HOMEPAGE SECTION 0: PROMOTIONAL HERO BANNER SLIDESHOW (DIWALI 2026 CAMPAIGN)
   ========================================================================== */

.hero-promotional-section {
	position: relative;
	width: 100%;
	overflow: hidden;
	background-color: #832014;
	--section-autoplay-duration: 5s;
	--section-animation-play-state: running;
}

.hero-promotional-section:hover,
.hero-promotional-section:focus-within {
	--section-animation-play-state: paused;
}

.hero-slides-wrapper {
	display: grid;
	grid-template-columns: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
}

.hero-slide {
	grid-area: 1 / 1 / 2 / 2;
	width: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
	z-index: 1;
}

.hero-slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 2;
}

.hero-promotional-link {
	display: block;
	position: relative;
	width: 100%;
	text-decoration: none;
	color: inherit;
	outline: none;
	cursor: pointer;
}

.hero-promotional-visual-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 2 / 1;
	min-height: 480px;
	overflow: hidden;
	background-color: #832014;
}

.hero-picture {
	display: block;
	width: 100%;
	height: 100%;
}

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

/* Slide Progress Bar Navigation */
.hero-slideshow-nav {
	position: absolute;
	bottom: 24px;
	left: 0;
	right: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 12px;
	z-index: 10;
	pointer-events: none;
}

.hero-progress-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 28px;
	padding: 13px 0;
	background: transparent;
	border: none;
	cursor: pointer;
	pointer-events: auto;
	position: relative;
	transition: opacity 0.2s ease;
}

.hero-progress-btn:focus-visible {
	outline: 2px solid #ffffff;
	outline-offset: 4px;
	border-radius: 2px;
}

/* Track line */
.hero-progress-btn::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 2px;
	margin-top: -1px;
	background-color: rgba(255, 255, 255, 0.35);
	border-radius: 1px;
	transition: background-color 0.2s ease;
}

.hero-progress-btn:hover::before {
	background-color: rgba(255, 255, 255, 0.65);
}

/* Animated fill line */
.hero-progress-bar-fill {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 2px;
	margin-top: -1px;
	background-color: #ffffff;
	border-radius: 1px;
	transform-origin: left center;
	transform: scaleX(0);
	pointer-events: none;
}

.hero-progress-btn.is-active .hero-progress-bar-fill {
	animation: heroProgressBarFill var(--section-autoplay-duration, 5s) linear forwards;
	animation-play-state: var(--section-animation-play-state, running);
}

@keyframes heroProgressBarFill {
	0% {
		transform: scaleX(0);
	}
	100% {
		transform: scaleX(1);
	}
}

/* Accessibility: Prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
	.hero-slide {
		transition: none !important;
	}
	.hero-progress-btn.is-active .hero-progress-bar-fill {
		animation: none !important;
		transform: scaleX(1) !important;
	}
}

/* Responsive adjustment for Mobile */
@media (max-width: 767px) {
	.hero-promotional-visual-wrap {
		aspect-ratio: 10 / 14;
		min-height: 420px;
	}

	.hero-slideshow-nav {
		bottom: 16px;
		gap: 8px;
	}

	.hero-progress-btn {
		width: 48px;
		height: 24px;
		padding: 11px 0;
	}
}

/* Responsive Campaign Fallback Backdrop (rendered when photographic files are pending) */
.hero-fallback-visual {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(circle at 72% 45%, #9b2819 0%, #7d1c10 40%, #520f06 100%);
	display: flex;
	align-items: center;
	justify-content: center;
}

.hero-fallback-glow {
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 70% 50%, rgba(247, 184, 75, 0.22) 0%, rgba(125, 28, 16, 0.1) 45%, transparent 70%),
	            radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.06) 0%, transparent 40%);
	pointer-events: none;
}

/* Promotional Overlay Content */
.hero-promotional-content-wrap {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	pointer-events: none;
}

.hero-promotional-container {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	padding-top: var(--mc-header-height);
}

.hero-promotional-text-box {
	max-width: 480px;
	margin-right: 4%;
	color: #ffffff;
	text-align: left;
	pointer-events: auto;
}

.hero-campaign-tag {
	display: inline-block;
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #f7ce87;
	margin-bottom: 12px;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.hero-campaign-title {
	font-family: var(--mc-font-serif);
	font-size: 3.4rem;
	font-weight: 500;
	line-height: 1.1;
	color: #ffffff;
	margin: 0 0 26px;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
	letter-spacing: -0.01em;
}

.hero-btn-wrap {
	display: inline-block;
}

.btn-hero-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 34px;
	background-color: #ffffff;
	color: #1a1a1a;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	border-radius: var(--mc-radius-pill);
	border: 1px solid #ffffff;
	transition: all 0.22s ease;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.2);
}

.hero-promotional-link:hover .btn-hero-cta,
.hero-promotional-link:focus .btn-hero-cta {
	background-color: transparent;
	color: #ffffff;
	box-shadow: 0 6px 22px rgba(0, 0, 0, 0.3);
}

/* ==========================================================================
   HOMEPAGE SECTION 1: EXPLORE OUR COLLECTIONS
   ========================================================================== */

.collections-section {
	background-color: var(--mc-color-bg);
	padding: 72px 0 96px;
}

.collections-header {
	margin-bottom: 36px;
}

.collections-header .section-subtitle {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--mc-color-muted);
	margin-bottom: 4px;
}

.collections-header .section-title {
	font-size: 2.25rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--mc-color-heading);
	margin: 0;
	line-height: 1.2;
}

/* Collections Grid (Desktop 2-column collage matching reference) */
.collections-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px;
}

/* Highlight Card (Gifting Collection spans 2 rows) */
.collection-card--highlight {
	grid-row: span 2;
}

.collection-card {
	position: relative;
	background-color: transparent;
	border: none;
	border-radius: 0;
	overflow: hidden;
	box-shadow: none;
	transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

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

.collection-card-link {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
}

/* Collection Card Image */
.collection-card-image-wrap {
	position: relative;
	width: 100%;
	height: 350px;
	overflow: hidden;
	background-color: var(--mc-color-cacao-dark);
}

.collection-card--highlight .collection-card-image-wrap {
	height: 100%;
	min-height: 740px;
}

/* Subtle protective overlay for contrast */
.collection-card-image-wrap::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.22);
	z-index: 1;
	transition: background 0.35s ease;
}

.collection-card:hover .collection-card-image-wrap::before {
	background: rgba(0, 0, 0, 0.32);
}

.collection-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

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

/* Centred Text Group Over Photograph */
.collection-card-info {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	text-align: center;
	z-index: 2;
	padding: 0 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: transparent;
	border: none;
	pointer-events: none;
}

.collection-name {
	font-family: var(--mc-font-serif, "Heroine", "Playfair Display", Georgia, serif);
	font-size: clamp(26px, 2.5vw, 40px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #ffffff;
	text-align: center;
	margin: 0;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
	transition: transform 0.3s ease, color 0.2s ease;
}

.collection-card:hover .collection-name {
	transform: translateY(-2px);
}

.collection-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--mc-font-sans, "FS Meridian", "Inter", sans-serif);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.8;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #ffffff;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
	transition: color 0.2s ease;
}

.collection-arrow {
	display: none;
}

/* ==========================================================================
   HOMEPAGE SECTION 2: BRAND INTRODUCTION / HERO SECTION
   ========================================================================== */

.brand-intro-section {
	position: relative;
	width: 100%;
	background-color: #fff2dc;
	overflow: hidden;
}

/* Desktop Composition */
@media (min-width: 1000px) {
	.brand-intro-section {
		min-height: 720px;
		display: flex;
		align-items: center;
	}

	.brand-intro-visual-wrap {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
	}

	.brand-intro-visual {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center left;
		display: block;
	}

	.brand-intro-content-container {
		position: relative;
		z-index: 2;
		width: 100%;
		padding: 72px 0;
	}

	.brand-intro-inner {
		display: flex;
		justify-content: flex-end;
	}

	.brand-intro-text-box {
		width: 100%;
		max-width: 560px;
		background-color: rgba(255, 242, 220, 0.94);
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		padding: 50px 48px;
		border-radius: var(--mc-radius-md);
		border: 1px solid rgba(196, 139, 89, 0.35);
		box-shadow: 0 20px 48px rgba(35, 20, 12, 0.14);
	}
}

.brand-intro-title {
	font-size: 2.15rem;
	font-weight: 700;
	line-height: 1.22;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--mc-color-heading);
	margin: 0 0 20px;
}

.brand-intro-body {
	margin-bottom: 24px;
}

.brand-intro-lead {
	font-size: 1.08rem;
	line-height: 1.68;
	color: #382419;
	margin: 0 0 14px;
	font-weight: 400;
}

.brand-intro-text {
	font-size: 1.02rem;
	line-height: 1.68;
	color: #382419;
	margin: 0;
	font-weight: 400;
}

.brand-intro-action {
	margin-top: 8px;
}

.brand-story-btn {
	background-color: var(--mc-color-heading);
	color: #ffffff;
	padding: 13px 36px;
	border-radius: var(--mc-radius-sm);
	font-size: 0.88rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
	display: inline-block;
	box-shadow: 0 4px 14px rgba(24, 20, 18, 0.2);
	transition: all 0.25s ease;
}

.brand-story-btn:hover,
.brand-story-btn:focus {
	background-color: var(--mc-color-accent);
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(160, 89, 52, 0.32);
}

/* ==========================================================================
   HOMEPAGE SECTION: OUR CRAFT (BEFORE THE BEAN. BEYOND THE BAR.)
   ========================================================================== */

.our-craft-section {
	position: relative;
	width: 100%;
	background-color: #121212;
	color: #f5f5f5;
	padding: 96px 0 110px;
	overflow: hidden;
}

.craft-section-header {
	text-align: left;
	margin-bottom: 48px;
	max-width: 820px;
}

.craft-subtitle {
	display: block;
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: #d6b27e;
	margin-bottom: 12px;
}

.craft-main-heading {
	font-family: var(--mc-font-serif);
	font-size: clamp(2.2rem, 4vw, 3.25rem);
	font-weight: 400;
	line-height: 1.15;
	color: #f5f5f5;
	margin: 0;
	letter-spacing: -0.01em;
}

.craft-heading-line {
	display: block;
}

/* Interactive Timeline Container */
.craft-timeline {
	position: relative;
	width: 100%;
}

.craft-carousel-wrapper {
	position: relative;
	width: 100%;
}

/* Previous / Next Arrows */
.craft-arrows-wrap {
	position: absolute;
	top: -64px;
	right: 0;
	display: flex;
	align-items: center;
	gap: 12px;
	z-index: 5;
}

.craft-arrow-btn {
	width: 44px;
	height: 44px;
	border-radius: var(--mc-radius-pill);
	border: 1px solid rgba(255, 255, 255, 0.25);
	background: rgba(255, 255, 255, 0.08);
	color: #f5f5f5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.22s ease;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

.craft-arrow-btn:hover:not(:disabled),
.craft-arrow-btn:focus:not(:disabled) {
	background-color: #ffffff;
	color: #121212;
	border-color: #ffffff;
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

.craft-arrow-btn:disabled {
	opacity: 0.28;
	cursor: not-allowed;
	pointer-events: none;
}

/* Stages List & Cards */
.craft-stages-list {
	position: relative;
	width: 100%;
	min-height: 480px;
}

.craft-stage-card {
	display: grid;
	grid-template-columns: 1fr 1fr;
	background-color: #f7f2ea;
	border-radius: var(--mc-radius-md);
	overflow: hidden;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	position: absolute;
	inset: 0;
	width: 100%;
	transition: opacity 0.35s ease, visibility 0.35s ease;
}

.craft-stage-card.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	position: relative;
	z-index: 2;
}

/* Visual Column */
.craft-stage-visual-wrap {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 480px;
	background-color: #1a120f;
	overflow: hidden;
}

.craft-stage-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

/* Stage Placeholder (Rendered when photographic file is pending) */
.craft-stage-placeholder {
	width: 100%;
	height: 100%;
	min-height: 480px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 32px;
	background: radial-gradient(circle at 50% 45%, #2a1f1b 0%, #160f0d 100%);
	text-align: center;
	border: 1px dashed rgba(214, 178, 126, 0.3);
}

.craft-placeholder-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	max-width: 320px;
}

.craft-placeholder-badge {
	display: inline-block;
	padding: 5px 14px;
	background: rgba(214, 178, 126, 0.15);
	color: #d6b27e;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	border-radius: var(--mc-radius-pill);
	text-transform: uppercase;
	border: 1px solid rgba(214, 178, 126, 0.3);
}

.craft-placeholder-label {
	font-family: var(--mc-font-serif);
	font-size: 1.45rem;
	color: #ffffff;
	letter-spacing: 0.02em;
}

.craft-placeholder-file {
	font-family: monospace;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.55);
}

.craft-placeholder-hint {
	font-size: 0.82rem;
	color: #d6b27e;
	letter-spacing: 0.05em;
	margin-top: 4px;
}

/* Content Column */
.craft-stage-content-wrap {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 56px 48px;
	background-color: #f7f2ea;
	color: #282828;
}

.craft-stage-content {
	max-width: 500px;
}

.craft-stage-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 18px;
	font-size: 0.76rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: #8c6239;
}

.craft-stage-tag {
	color: #8c6239;
}

.craft-stage-separator {
	color: rgba(140, 98, 57, 0.45);
}

.craft-stage-focus {
	color: #5c4436;
	font-weight: 600;
	letter-spacing: 0.06em;
}

.craft-stage-title {
	font-family: var(--mc-font-serif);
	font-size: 2.2rem;
	font-weight: 500;
	line-height: 1.22;
	color: #1e1714;
	margin: 0 0 20px;
}

.craft-stage-desc {
	font-size: 1.05rem;
	line-height: 1.72;
	color: #44352e;
	margin: 0;
	font-weight: 400;
}

/* Navigation Tabs with Progress Bar */
.craft-nav-container {
	margin-top: 44px;
	position: relative;
	width: 100%;
}

.craft-progress-track {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background: rgba(255, 255, 255, 0.16);
	border-radius: var(--mc-radius-pill);
	overflow: hidden;
}

.craft-progress-bar {
	height: 100%;
	background: #ffffff;
	transition: width 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}

.craft-tabs-nav {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	padding-top: 20px;
	gap: 16px;
}

.craft-nav-tab {
	background: transparent;
	border: none;
	padding: 0;
	text-align: left;
	cursor: pointer;
	color: rgba(245, 245, 245, 0.48);
	transition: color 0.22s ease;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.craft-tab-stage {
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.craft-tab-title {
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.craft-nav-tab:hover,
.craft-nav-tab:focus {
	color: rgba(255, 255, 255, 0.82);
}

.craft-nav-tab.is-active,
.craft-nav-tab[aria-selected="true"] {
	color: #ffffff;
}

.craft-nav-tab.is-active .craft-tab-stage,
.craft-nav-tab[aria-selected="true"] .craft-tab-stage {
	color: #d6b27e;
}

/* ==========================================================================
   HOMEPAGE RESPONSIVE STYLES
   ========================================================================== */

/* Tablet & Mobile (max-width: 999px) */
@media (max-width: 999px) {
	/* Hero Promotional Section Responsive */
	.hero-promotional-visual-wrap {
		aspect-ratio: 10 / 14;
		min-height: 480px;
	}

	.hero-promotional-content-wrap {
		align-items: flex-end;
	}

	.hero-promotional-container {
		justify-content: center;
		padding-top: 20px;
		padding-bottom: 52px;
	}

	.hero-promotional-text-box {
		margin-right: 0;
		text-align: center;
		max-width: 340px;
	}

	.hero-campaign-tag {
		font-size: 0.74rem;
		letter-spacing: 0.16em;
		margin-bottom: 8px;
	}

	.hero-campaign-title {
		font-size: 2.2rem;
		margin-bottom: 20px;
	}

	.btn-hero-cta {
		padding: 11px 28px;
		font-size: 0.75rem;
	}

	.collections-section {
		padding: 56px 0 72px;
	}

	.collections-header {
		text-align: center;
		margin-bottom: 28px;
	}

	.collections-header .section-title {
		font-size: 1.85rem;
	}

	.collections-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.collection-card--highlight {
		grid-row: auto;
	}

	.collection-card--highlight .collection-card-image-wrap {
		min-height: auto;
		height: 280px;
	}

	.collection-card-image-wrap {
		height: 260px;
	}

	.collection-card-info {
		padding: 0 20px;
		gap: 6px;
	}

	.collection-name {
		font-size: 26px;
	}

	.collection-action {
		font-size: 13px;
	}

	/* Brand Intro Stacked on Mobile */
	.brand-intro-section {
		display: block;
	}

	.brand-intro-visual-wrap {
		width: 100%;
		height: auto;
	}

	.brand-intro-visual {
		width: 100%;
		height: auto;
		max-height: 480px;
		object-fit: cover;
		display: block;
	}

	.brand-intro-content-container {
		padding: 44px 0 54px;
		background-color: #fff2dc;
	}

	.brand-intro-text-box {
		width: 100%;
		max-width: 100%;
		background: transparent;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		padding: 0;
		border: none;
		box-shadow: none;
	}

	.brand-intro-title {
		font-size: 1.65rem;
		line-height: 1.25;
		margin-bottom: 16px;
	}

	.brand-intro-lead,
	.brand-intro-text {
		font-size: 0.98rem;
		line-height: 1.62;
		color: #382419;
	}

	.brand-story-btn {
		display: inline-block;
		width: auto;
		padding: 12px 30px;
	}

	/* Our Craft Section Responsive */
	.our-craft-section {
		padding: 68px 0 80px;
	}

	.craft-section-header {
		margin-bottom: 36px;
	}

	.craft-main-heading {
		font-size: 2.15rem;
	}

	.craft-arrows-wrap {
		position: static;
		margin-bottom: 20px;
		justify-content: flex-end;
	}

	.craft-stage-card {
		grid-template-columns: 1fr;
	}

	.craft-stage-visual-wrap {
		min-height: 340px;
		aspect-ratio: 4 / 3;
	}

	.craft-stage-placeholder {
		min-height: 340px;
	}

	.craft-stage-content-wrap {
		padding: 36px 28px;
	}

	.craft-stage-title {
		font-size: 1.75rem;
		margin-bottom: 16px;
	}

	.craft-stage-desc {
		font-size: 0.98rem;
		line-height: 1.65;
	}

	.craft-tabs-nav {
		grid-template-columns: repeat(2, 1fr);
		gap: 18px 24px;
	}
}

/* Small Mobile (max-width: 480px) */
@media (max-width: 480px) {
	.our-craft-section {
		padding: 52px 0 64px;
	}

	.craft-main-heading {
		font-size: 1.65rem;
		line-height: 1.22;
	}

	.craft-stage-visual-wrap {
		min-height: 260px;
		aspect-ratio: 1 / 1;
	}

	.craft-stage-placeholder {
		min-height: 260px;
		padding: 24px 16px;
	}

	.craft-placeholder-label {
		font-size: 1.25rem;
	}

	.craft-stage-content-wrap {
		padding: 28px 20px;
	}

	.craft-stage-title {
		font-size: 1.45rem;
		margin-bottom: 12px;
	}

	.craft-stage-desc {
		font-size: 0.92rem;
		line-height: 1.6;
	}

	.craft-tabs-nav {
		grid-template-columns: 1fr 1fr;
		gap: 14px 16px;
	}

	.craft-tab-title {
		font-size: 0.78rem;
	}
	.hero-promotional-visual-wrap {
		min-height: 420px;
	}

	.hero-campaign-title {
		font-size: 1.85rem;
	}

	.hero-promotional-container {
		padding-bottom: 38px;
	}

	.collections-section {
		padding: 44px 0 56px;
	}

	.collections-header .section-title {
		font-size: 1.55rem;
	}

	.collection-name {
		font-size: 1.08rem;
	}

	.collection-action {
		font-size: 0.8rem;
	}

	.brand-intro-title {
		font-size: 1.38rem;
		line-height: 1.28;
	}

	.brand-intro-lead,
	.brand-intro-text {
		font-size: 0.92rem;
		line-height: 1.6;
	}

	.brand-intro-content-container {
		padding: 36px 0 44px;
	}
}

/* ==========================================================================
   HOMEPAGE SECTION 3: DISCOVER PRODUCTS (PHASE 7)
   ========================================================================== */

.discover-section {
	background-color: var(--mc-color-bg, #fef8f4);
	padding: 80px 0 92px;
	position: relative;
	overflow: hidden;
}

.discover-section-inner {
	width: 100%;
}

/* Header & Title */
.discover-header {
	text-align: center;
	margin-bottom: 40px;
}

.discover-header-text {
	margin-bottom: 24px;
}

.discover-title {
	font-family: var(--mc-font-sans);
	font-size: 2.15rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mc-color-text, #282828);
	margin: 0;
	display: inline-block;
	position: relative;
}

.discover-title sup {
	font-size: 14px;
	vertical-align: super;
}

/* Navigation Tabs */
.discover-tabs-nav {
	display: flex;
	justify-content: center;
	align-items: center;
	border-bottom: 1px solid var(--mc-color-border-subtle, #eae5e0);
	max-width: 680px;
	margin: 0 auto;
}

.discover-tabs-nav-scroll {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 40px;
	overflow-x: auto;
	padding: 0 16px 1px;
	-webkit-overflow-scrolling: touch;
}

.discover-tab-btn {
	background: transparent;
	border: none;
	padding: 10px 4px 14px;
	font-family: var(--mc-font-sans);
	font-size: 1.05rem;
	font-weight: 400;
	color: var(--mc-color-muted, #6e6561);
	cursor: pointer;
	position: relative;
	transition: color 0.25s ease, font-weight 0.25s ease;
	white-space: nowrap;
	outline: none;
}

.discover-tab-btn:hover {
	color: var(--mc-color-heading, #1a1a1a);
}

.discover-tab-btn.active {
	color: var(--mc-color-heading, #1a1a1a);
	font-weight: 600;
}

.discover-tab-btn::after {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: transparent;
	transition: background-color 0.25s ease, transform 0.25s ease;
	transform: scaleX(0);
}

.discover-tab-btn.active::after {
	background-color: var(--mc-color-heading, #1a1a1a);
	transform: scaleX(1);
}

.discover-tab-btn:focus-visible {
	outline: 2px solid var(--mc-color-focus, #1d70b8);
	outline-offset: 4px;
	border-radius: 2px;
}

/* Tab Panels */
.discover-tab-pane {
	display: none;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.discover-tab-pane.active {
	display: block;
	opacity: 1;
}

/* Carousel Wrapper & Arrows */
.discover-carousel-wrapper {
	position: relative;
	padding: 0 52px;
}

.discover-nav-arrow {
	position: absolute;
	top: 38%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #fef8f4;
	border: 1px solid #ded9d5;
	color: #282828;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	transition: all 0.25s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.discover-nav-arrow:hover:not(:disabled) {
	background-color: #121212;
	color: #ffffff;
	border-color: #121212;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.discover-nav-arrow:disabled {
	opacity: 0.28;
	cursor: not-allowed;
	pointer-events: none;
}

.discover-nav-prev {
	left: 0;
}

.discover-nav-next {
	right: 0;
}

/* Slider Track */
.discover-products-slider {
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	padding: 8px 0 24px;
	scrollbar-width: none;
}

.discover-products-slider::-webkit-scrollbar {
	display: none;
}

.discover-products-grid {
	display: flex;
	gap: 24px;
}

/* Product Item Card */
.product-item-card {
	flex: 0 0 calc((100% - (24px * 3)) / 4);
	min-width: 0;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	position: relative;
}

/* Image Wrapper (4:5 Aspect Ratio) */
.product-item-image-wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 5;
	background-color: #f6f2ee;
	overflow: hidden;
	border-radius: 2px;
	margin-bottom: 14px;
}

.product-item-image-link {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
}

.product-item-image-ratio {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-color: #f6f2ee;
}

.product-primary-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease, opacity 0.35s ease;
	z-index: 1;
}

.product-card-hover-img,
.product-item-hover-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.35s ease, transform 0.4s ease;
	z-index: 2;
}

@media (hover: hover) and (min-width: 768px) {
	.product-item-card:hover .product-card-hover-img,
	.product-item-card:hover .product-item-hover-image {
		opacity: 1;
		transform: scale(1.03);
	}
	.product-item-card:hover .product-primary-image {
		transform: scale(1.03);
	}
}

/* Sold Out Badge */
.product-item-badge-list {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 5;
}

.product-badge.badge-sold-out {
	display: inline-block;
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	color: #404040;
	font-family: var(--mc-font-sans);
	font-size: 0.72rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 4px 10px;
	border-radius: 2px;
	border: 1px solid rgba(0, 0, 0, 0.06);
}

/* Product Actions (Add to Cart) */
.product-item-actions {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 6;
}

.product-add-to-cart-btn {
	width: 100%;
	background-color: #121212;
	color: #ffffff;
	border: none;
	padding: 13px 16px;
	font-family: var(--mc-font-sans);
	font-size: 0.85rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transform: translateY(101%);
	transition: transform 0.28s ease, background-color 0.2s ease, opacity 0.2s ease;
}

.product-item-card:hover .product-add-to-cart-btn:not(.is-disabled),
.product-item-card:focus-within .product-add-to-cart-btn:not(.is-disabled) {
	transform: translateY(0);
}

.product-add-to-cart-btn:hover:not(.is-disabled) {
	background-color: #321c13;
}

.product-add-to-cart-btn.is-disabled {
	display: none;
}

.product-quick-buy-btn {
	display: none;
}

/* Product Info */
.product-item-info {
	text-align: left;
	display: flex;
	flex-direction: column;
}

.product-item-title {
	font-family: var(--mc-font-sans);
	font-size: 0.96rem;
	font-weight: 500;
	line-height: 1.35;
	margin: 0 0 6px 0;
	color: var(--mc-color-text, #282828);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.7em;
}

.product-item-title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.product-item-title a:hover {
	color: var(--mc-color-accent, #a05934);
}

.product-item-weight {
	display: block;
	font-family: var(--mc-font-sans);
	font-size: 0.82rem;
	color: var(--mc-color-muted, #6e6561);
	margin-bottom: 8px;
	font-weight: 400;
}

.product-item-price-wrap {
	display: flex;
	align-items: baseline;
	gap: 6px;
	flex-wrap: wrap;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--mc-color-heading, #1a1a1a);
}

.product-item-price {
	font-family: var(--mc-font-sans);
}

.product-item-price .woocommerce-Price-amount {
	color: inherit;
	font-weight: inherit;
}

.product-item-tax-note {
	font-family: var(--mc-font-sans);
	font-size: 0.76rem;
	font-weight: 400;
	color: #888888;
}

/* AJAX Spinner & State Animations */
.btn-loading-spinner {
	display: none;
	width: 14px;
	height: 14px;
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-radius: 50%;
	border-top-color: #ffffff;
	animation: mc-spin 0.6s linear infinite;
}

.btn-add-to-cart.is-loading .btn-loading-spinner {
	display: inline-block;
}

.btn-add-to-cart.is-loading .btn-text {
	opacity: 0.7;
}

.btn-add-to-cart.is-added {
	background-color: #2b6e3f !important;
}

@keyframes mc-spin {
	to { transform: rotate(360deg); }
}

/* Header Cart Count Bump Animation */
.cart-count-badge.cart-bump {
	animation: mc-cart-bump 0.4s ease-out;
}

@keyframes mc-cart-bump {
	0% { transform: scale(1); }
	40% { transform: scale(1.4); }
	100% { transform: scale(1); }
}

/* ==========================================================================
   DISCOVER SECTION RESPONSIVE QUERIES
   ========================================================================== */

@media screen and (max-width: 1199px) {
	.product-item-card {
		flex: 0 0 calc((100% - (24px * 2)) / 3);
	}
}

@media screen and (max-width: 991px) {
	.discover-section {
		padding: 68px 0 76px;
	}

	.discover-carousel-wrapper {
		padding: 0 40px;
	}

	.discover-title {
		font-size: 1.85rem;
	}

	.discover-tabs-nav-scroll {
		gap: 28px;
	}

	.discover-tab-btn {
		font-size: 0.98rem;
	}

	/* Show quick buy button on touch/tablets */
	.product-quick-buy-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		bottom: 10px;
		right: 10px;
		width: 38px;
		height: 38px;
		border-radius: 50%;
		background-color: #ffffff;
		border: 1px solid rgba(0, 0, 0, 0.08);
		box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
		color: #121212;
		z-index: 5;
		cursor: pointer;
		transition: background-color 0.2s ease, transform 0.2s ease;
	}

	.product-quick-buy-btn:hover {
		background-color: #121212;
		color: #ffffff;
		transform: scale(1.05);
	}

	.product-quick-buy-btn.is-added {
		background-color: #2b6e3f;
		color: #ffffff;
	}

	.product-add-to-cart-btn {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.discover-section {
		padding: 50px 0 60px;
	}

	.discover-header {
		margin-bottom: 28px;
	}

	.discover-title {
		font-size: 1.55rem;
		letter-spacing: 0.1em;
	}

	.discover-tabs-nav {
		border-bottom: 1px solid var(--mc-color-border-subtle, #eae5e0);
		width: 100%;
	}

	.discover-tabs-nav-scroll {
		justify-content: flex-start;
		gap: 20px;
		padding: 0 16px 1px;
	}

	.discover-tab-btn {
		font-size: 0.92rem;
		padding: 8px 2px 12px;
	}

	.discover-carousel-wrapper {
		padding: 0 16px;
	}

	/* On mobile, navigation arrows are hidden for pure touch swipe scroll */
	.discover-nav-arrow {
		display: none;
	}

	.discover-products-slider {
		padding: 4px 0 16px;
	}

	.discover-products-grid {
		gap: 16px;
	}

	.product-item-card {
		flex: 0 0 240px;
		max-width: 260px;
	}

	.product-item-title {
		font-size: 0.9rem;
	}

	.product-item-weight {
		font-size: 0.78rem;
		margin-bottom: 6px;
	}

	.product-item-price-wrap {
		font-size: 0.88rem;
	}
}

@media screen and (max-width: 480px) {
	.product-item-card {
		flex: 0 0 215px;
	}

	.discover-title {
		font-size: 1.4rem;
	}
}

/* ==========================================================================
   HOMEPAGE SECTION 5: FEATURED IN (PHASE 8)
   ========================================================================== */

.featured-in-section {
	background-color: var(--mc-color-bg, #fef8f4);
	padding: 85px 0 100px;
	position: relative;
	overflow: hidden;
	border-top: 1px solid var(--mc-color-border-subtle, #eae5e0);
}

.featured-in-color-wrapper {
	width: 100%;
}

/* Header & Title */
.featured-in-header {
	text-align: center;
	margin-bottom: 34px;
}

.featured-in-title {
	font-family: var(--mc-font-sans);
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--mc-color-text, #282828);
	margin: 0;
	display: inline-block;
}

/* Logos / Mastheads Row */
.featured-in-logos-container {
	margin-bottom: 56px;
}

.featured-in-logos-scroller {
	display: flex;
	justify-content: center;
}

.featured-in-logos-list {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 36px 54px;
}

.featured-logo-item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	opacity: 0.45;
	transition: opacity 0.3s ease, transform 0.25s ease;
	cursor: pointer;
	padding: 6px 4px;
}

.featured-logo-item:hover,
.featured-logo-item.is-active,
.featured-logo-item:focus-visible {
	opacity: 1;
	transform: translateY(-1px);
}

.featured-logo-item:focus-visible {
	outline: 2px solid var(--mc-color-focus, #1d70b8);
	outline-offset: 4px;
	border-radius: 2px;
}

/* Publication Logo Images */
.featured-logo-img {
	display: block;
	max-height: 38px;
	width: auto;
	max-width: 150px;
	object-fit: contain;
	transition: transform 0.25s ease, filter 0.25s ease;
}

.featured-logo-img.pub-logo-time {
	max-height: 52px;
	max-width: 52px;
}

.featured-logo-img.pub-logo-travel-leisure {
	max-height: 34px;
	max-width: 140px;
}

.featured-logo-img.pub-logo-the-hindu {
	max-height: 30px;
	max-width: 140px;
}

.featured-logo-img.pub-logo-the-week {
	max-height: 30px;
	max-width: 130px;
}

.featured-logo-img.pub-logo-conde-nast {
	max-height: 32px;
	max-width: 140px;
}

.featured-logo-img.pub-logo-forbes {
	max-height: 26px;
	max-width: 105px;
}

@media (max-width: 768px) {
	.featured-logo-img {
		max-height: 30px;
		max-width: 120px;
	}

	.featured-logo-img.pub-logo-time {
		max-height: 44px;
		max-width: 44px;
	}
}

/* Publication Wordmarks Typography */
.featured-logo-wordmark {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.wordmark-badge {
	font-family: var(--mc-font-sans);
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #e9510c;
	margin-bottom: 2px;
}

.pub-time .wordmark-text {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.55rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	color: #1a1a1a;
	line-height: 1;
}

.pub-travel-leisure .wordmark-text {
	font-family: var(--mc-font-sans);
	font-size: 1.05rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #1a1a1a;
	line-height: 1;
}

.pub-the-hindu .wordmark-text {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.3rem;
	font-style: italic;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #1a1a1a;
	line-height: 1;
}

.pub-the-week .wordmark-text {
	font-family: var(--mc-font-sans);
	font-size: 1.25rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #1a1a1a;
	line-height: 1;
}

.pub-conde-nast .wordmark-text {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.15rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #1a1a1a;
	line-height: 1;
}

.pub-forbes .wordmark-text {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.45rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #1a1a1a;
	line-height: 1;
}

/* Quotes Carousel Container */
.featured-quotes-carousel {
	max-width: 1080px;
	margin: 0 auto;
	position: relative;
}

.featured-quotes-wrapper {
	position: relative;
	min-height: 220px;
}

.featured-quote-item {
	display: none;
	opacity: 0;
	transition: opacity 0.35s ease;
}

.featured-quote-item.is-active {
	display: block;
	opacity: 1;
	animation: mc-quote-fade 0.35s ease forwards;
}

@keyframes mc-quote-fade {
	from {
		opacity: 0;
		transform: translateY(6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Quote Layout (Quote Mark Left + Content Right) */
.featured-quote-layout {
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 40px;
	align-items: flex-start;
}

.featured-quote-mark-wrap {
	display: flex;
	align-items: flex-start;
	padding-top: 4px;
}

.featured-quote-mark-icon {
	width: 54px;
	height: 44px;
	display: block;
}

.featured-quote-content-wrap {
	display: flex;
	flex-direction: column;
}

.featured-quote-content {
	margin: 0;
	padding: 0;
	border: none;
}

.featured-quote-text {
	font-family: var(--mc-font-sans);
	font-size: clamp(1.85rem, 3.2vw, 2.9rem);
	font-weight: 400;
	line-height: 1.24;
	color: var(--mc-color-text, #282828);
	margin: 0;
	letter-spacing: -0.01em;
}

.featured-quote-author {
	font-family: var(--mc-font-sans);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--mc-color-text, #282828);
	margin: 28px 0 0 0;
}

/* Carousel Navigation */
.featured-quotes-nav {
	margin-top: 42px;
	padding-left: 100px;
}

.featured-nav-arrows {
	display: inline-flex;
	align-items: center;
	gap: 16px;
}

.featured-nav-arrow {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #fef8f4;
	border: 1px solid #ded9d5;
	color: #282828;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.25s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.featured-nav-arrow:hover:not(:disabled) {
	background-color: #121212;
	color: #ffffff;
	border-color: #121212;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.featured-nav-arrow:disabled {
	opacity: 0.28;
	cursor: not-allowed;
	pointer-events: none;
}

/* Mobile Dots */
.featured-dots-nav {
	display: none;
}

.featured-dot-btn {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: #ded9d5;
	border: none;
	padding: 0;
	cursor: pointer;
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.featured-dot-btn.is-active {
	background-color: #121212;
	transform: scale(1.3);
}

/* ==========================================================================
   FEATURED IN RESPONSIVE BREAKPOINTS
   ========================================================================== */

@media screen and (max-width: 1199px) {
	.featured-in-section {
		padding: 75px 0 88px;
	}

	.featured-quote-layout {
		grid-template-columns: 50px 1fr;
		gap: 30px;
	}

	.featured-quote-mark-icon {
		width: 46px;
		height: 38px;
	}

	.featured-quotes-nav {
		padding-left: 80px;
	}
}

@media screen and (max-width: 991px) {
	.featured-in-section {
		padding: 65px 0 76px;
	}

	.featured-in-logos-container {
		margin-bottom: 44px;
	}

	.featured-in-logos-list {
		gap: 28px 40px;
	}

	.featured-quote-layout {
		grid-template-columns: 44px 1fr;
		gap: 24px;
	}

	.featured-quote-mark-icon {
		width: 40px;
		height: 32px;
	}

	.featured-quotes-nav {
		padding-left: 68px;
		margin-top: 32px;
	}

	.featured-quotes-wrapper {
		min-height: 200px;
	}
}

@media screen and (max-width: 767px) {
	.featured-in-section {
		padding: 50px 0 60px;
	}

	.featured-in-header {
		margin-bottom: 24px;
	}

	.featured-in-title {
		font-size: 0.75rem;
		letter-spacing: 0.16em;
	}

	/* Mobile Scroller for logos */
	.featured-in-logos-scroller {
		justify-content: flex-start;
		overflow-x: auto;
		padding: 0 16px 12px;
		-webkit-overflow-scrolling: touch;
	}

	.featured-in-logos-list {
		flex-wrap: nowrap;
		justify-content: flex-start;
		gap: 28px;
	}

	.featured-logo-item {
		flex: 0 0 auto;
		opacity: 0.6;
	}

	.featured-quote-layout {
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	.featured-quote-mark-icon {
		width: 36px;
		height: 28px;
	}

	.featured-quote-text {
		font-size: 1.35rem;
		line-height: 1.38;
	}

	.featured-quote-author {
		font-size: 0.85rem;
		margin-top: 20px;
	}

	.featured-quotes-wrapper {
		min-height: 240px;
	}

	/* Switch controls on mobile: Hide desktop arrows, show dots */
	.featured-quotes-nav {
		padding-left: 0;
		margin-top: 28px;
		text-align: center;
	}

	.featured-nav-arrows {
		display: none;
	}

	.featured-dots-nav {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 10px;
	}
}

@media screen and (max-width: 480px) {
	.featured-quote-text {
		font-size: 1.22rem;
		line-height: 1.4;
	}

	.featured-quotes-wrapper {
		min-height: 260px;
	}
}

/* ==========================================================================
   HOMEPAGE SECTION 6: MANAM CHOCOLATE KARKHANA (PHASE 9)
   ========================================================================== */

.karkhana-section {
	position: relative;
	width: 100%;
	background-color: var(--mc-color-bg, #fef8f4);
	overflow: hidden;
}

.karkhana-container-wrapper {
	width: 100%;
	position: relative;
}

/* Slideshow Container */
.karkhana-slideshow {
	position: relative;
	width: 100%;
	aspect-ratio: 2 / 1;
	min-height: 520px;
	max-height: 740px;
	background-color: #1a120c;
	overflow: hidden;
}

.karkhana-slides-track {
	position: relative;
	width: 100%;
	height: 100%;
}

/* Individual Slide */
.karkhana-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.8s ease-in-out, visibility 0.8s ease-in-out;
	z-index: 1;
}

.karkhana-slide.is-active {
	opacity: 1;
	visibility: visible;
	z-index: 2;
}

.karkhana-image-wrapper {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}

.karkhana-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transform: scale(1);
	transition: transform 6s ease-out;
}

.karkhana-slide.is-active .karkhana-image {
	transform: scale(1.03);
}

/* Navigation Dots / Progress Bars */
.karkhana-nav-dots {
	position: absolute;
	bottom: 28px;
	right: 8%;
	z-index: 5;
}

.karkhana-nav-dots-inner {
	display: flex;
	align-items: center;
	gap: 10px;
}

.karkhana-progress-btn {
	width: 38px;
	height: 4px;
	background-color: rgba(255, 255, 255, 0.35);
	border: none;
	padding: 0;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	border-radius: 2px;
	transition: background-color 0.25s ease, width 0.3s ease;
}

.karkhana-progress-fill {
	position: absolute;
	top: 0;
	left: 0;
	width: 0%;
	height: 100%;
	background-color: #ffffff;
	transition: width 0.3s ease;
}

.karkhana-progress-btn.is-active {
	width: 48px;
	background-color: rgba(255, 255, 255, 0.55);
}

.karkhana-progress-btn.is-active .karkhana-progress-fill {
	width: 100%;
}

.karkhana-progress-btn:hover {
	background-color: rgba(255, 255, 255, 0.65);
}

/* Karkhana Content Box (Warm Biscuit / Almond Cream #F0E5D4) */
.karkhana-content-box {
	background-color: #f0e5d4;
	color: #1a1a1a;
	padding: 38px 42px;
	border-radius: 2px;
}

/* Desktop Floating Content Box */
.karkhana-desktop-content-box {
	position: absolute;
	bottom: 12%;
	left: 8%;
	z-index: 4;
	width: 36%;
	max-width: 490px;
	min-width: 330px;
	box-shadow: 0 12px 36px rgba(18, 10, 6, 0.16);
}

.karkhana-title {
	font-family: var(--mc-font-sans);
	font-size: 2.1rem;
	line-height: 1.18;
	color: #1a1a1a;
	margin: 0 0 16px 0;
	letter-spacing: 0.03em;
}

.karkhana-title strong {
	font-weight: 700;
}

.karkhana-desc {
	font-family: var(--mc-font-sans);
	font-size: 0.98rem;
	line-height: 1.58;
	color: #282828;
	margin: 0 0 20px 0;
}

.karkhana-location {
	font-family: var(--mc-font-sans);
	font-size: 0.88rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #1a1a1a;
	margin: 0;
}

.karkhana-location strong {
	font-weight: 700;
}

/* Mobile Content Box (Below visual showcase on mobile) */
.karkhana-mobile-content-box-wrapper {
	display: none;
}

/* ==========================================================================
   KARKHANA SECTION RESPONSIVE QUERIES
   ========================================================================== */

@media screen and (max-width: 1279px) {
	.karkhana-slideshow {
		min-height: 480px;
	}

	.karkhana-desktop-content-box {
		width: 40%;
		padding: 32px 36px;
	}

	.karkhana-title {
		font-size: 1.85rem;
	}
}

@media screen and (max-width: 999px) {
	.karkhana-slideshow {
		aspect-ratio: 16 / 9;
		min-height: 320px;
		max-height: 460px;
	}

	/* Switch from floating overlay to stacked mobile layout */
	.karkhana-desktop-content-box {
		display: none;
	}

	.karkhana-mobile-content-box-wrapper {
		display: block;
		background-color: var(--mc-color-bg, #fef8f4);
		padding: 24px 0 54px;
	}

	.karkhana-mobile-content-box {
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
		padding: 30px 24px;
	}

	.karkhana-title {
		font-size: 1.65rem;
		line-height: 1.22;
	}

	.karkhana-desc {
		font-size: 0.92rem;
		line-height: 1.55;
	}

	.karkhana-location {
		font-size: 0.82rem;
	}

	.karkhana-nav-dots {
		bottom: 16px;
		right: 50%;
		transform: translateX(50%);
	}

	.karkhana-progress-btn {
		width: 28px;
		height: 3px;
	}

	.karkhana-progress-btn.is-active {
		width: 36px;
	}
}

@media screen and (max-width: 480px) {
	.karkhana-slideshow {
		min-height: 260px;
	}

	.karkhana-mobile-content-box {
		padding: 24px 20px;
	}

	.karkhana-title {
		font-size: 1.45rem;
	}

	.karkhana-desc {
		font-size: 0.88rem;
	}

	.karkhana-location {
		font-size: 0.78rem;
	}
}





/* ==========================================================================
   PHASE 11: SHOP AND COLLECTION ARCHIVES & DIRECTORY STYLES
   ========================================================================== */

/* 1. Full-Width Collection Hero Banner (Exact Reference Parity) */
.collection-hero-banner {
	position: relative;
	width: 100%;
	overflow: hidden;
	margin: 0;
	padding: 0;
	padding-bottom: 24.7838%; /* Exact 4.03:1 ratio (1856x460 / 1920x475.86px) */
	background-color: #241913;
}

.collection-hero-banner .collection-banner-picture,
.collection-hero-banner .collection-banner-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	display: block;
}

.collection-banner-inner {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: none;
	padding: 24px 40px;
	max-width: 1600px;
	margin: 0 auto;
	z-index: 3;
}

/* Breadcrumbs: Floating Top-Left over Photographic Banner */
.collection-breadcrumbs {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: "infini romain", Georgia, serif;
	font-size: 13px;
	letter-spacing: 0.02em;
	color: #ffffff;
	pointer-events: auto;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
}

.collection-breadcrumbs a {
	color: #ffffff;
	text-decoration: none;
	font-weight: 400;
	opacity: 0.9;
	transition: opacity 0.2s ease;
}

.collection-breadcrumbs a:hover {
	opacity: 1;
	text-decoration: none;
}

.collection-breadcrumbs .breadcrumb-separator {
	color: rgba(255, 255, 255, 0.65);
	margin: 0 3px;
}

.collection-breadcrumbs .breadcrumb-current {
	color: #ffffff;
	font-weight: 400;
}

/* 2. Main Shop Container */
.shop-main-container {
	max-width: 1600px !important;
	width: 100% !important;
	margin: 0 auto !important;
	padding-left: 40px !important;
	padding-right: 40px !important;
	padding-top: 36px !important;
	padding-bottom: 80px !important;
}

/* 3. Product Facet Layout (Sidebar + Product Grid) */
.product-facet-layout {
	display: grid !important;
	grid-template-columns: 275px 1fr !important;
	gap: 40px !important;
	align-items: start !important;
}

.product-facet-layout.no-sidebar {
	grid-template-columns: 1fr !important;
}

/* Filter Sidebar (Clean Reference Aesthetic - No White Card Box) */
.product-facet__sidebar {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	position: sticky;
	top: 100px;
}

.product-facet__filters-header,
.filter-sidebar-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 14px;
	margin-bottom: 0;
	border-bottom: 1px solid rgba(40, 40, 40, 0.1);
}

.filter-sidebar-title {
	font-family: var(--mc-font-serif, "infini romain", Georgia, serif) !important;
	font-size: 22px !important;
	font-weight: 400 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: #282828 !important;
	line-height: 26px !important;
	margin: 0 !important;
}

.filter-clear-all-btn {
	font-size: 0.8rem;
	font-weight: 500;
	color: #9c4125;
	text-decoration: underline;
	letter-spacing: 0.02em;
	cursor: pointer;
}

.filter-clear-all-btn:hover {
	color: #722c16;
}

/* Filter Accordion Groups */
.filter-accordion-list {
	display: flex;
	flex-direction: column;
}

.filter-group {
	border-bottom: 1px solid rgba(40, 40, 40, 0.08);
	padding: 0;
}

.filter-group:last-child {
	border-bottom: 1px solid rgba(40, 40, 40, 0.08);
	padding-bottom: 0;
}

/* Filter Accordion Header Toggle - Exact Reference Parity (No Brown Hover / Background) */
button.filter-group-header,
button.collapsible-toggle,
.filter-group-header,
.collapsible-toggle {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 22px 0;
	font-family: var(--mc-font-sans);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #282828 !important;
	cursor: pointer;
	text-align: left;
	height: 68px;
	box-sizing: border-box;
	outline: none;
	transition: none;
}

button.filter-group-header:hover,
button.filter-group-header:focus,
button.filter-group-header:focus-visible,
button.filter-group-header:active,
button.collapsible-toggle:hover,
button.collapsible-toggle:focus,
button.collapsible-toggle:focus-visible,
button.collapsible-toggle:active,
.filter-group-header:hover,
.filter-group-header:focus,
.filter-group-header:focus-visible,
.filter-group-header:active,
.collapsible-toggle:hover,
.collapsible-toggle:focus,
.collapsible-toggle:focus-visible,
.collapsible-toggle:active,
.filter-group-header[aria-expanded="true"]:hover,
.filter-group-header[aria-expanded="true"]:focus,
.filter-group-header[aria-expanded="true"]:active {
	background: transparent !important;
	background-color: transparent !important;
	color: #282828 !important;
	border: none !important;
	box-shadow: none !important;
	outline: none !important;
}

.filter-group-header::before,
.filter-group-header::after,
.collapsible-toggle::before,
.collapsible-toggle::after {
	content: none !important;
	display: none !important;
}

/* Chevron Toggle Arrow - Exact Reference Parity */
.filter-group-header .chevron-toggle,
.collapsible-toggle .chevron-toggle,
.collapsible-toggle svg.icon--chevron,
.filter-group-header svg {
	display: block;
	flex-shrink: 0;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	color: #282828 !important;
	stroke: none !important;
	fill: none !important;
	transition: transform 0.2s ease-in-out;
	transform: rotate(0deg);
}

.filter-group-header[aria-expanded="true"] .chevron-toggle,
.collapsible-toggle[aria-expanded="true"] .chevron-toggle,
.collapsible-toggle[aria-expanded="true"] svg.icon--chevron,
.filter-group-header[aria-expanded="true"] svg {
	transform: rotate(180deg);
}

.filter-group-header .chevron-toggle:hover,
.filter-group-header .chevron-toggle:focus,
.filter-group-header .chevron-toggle:active,
.collapsible-toggle .chevron-toggle:hover,
.collapsible-toggle svg.icon--chevron:hover,
.filter-group-header:hover .chevron-toggle,
.filter-group-header:focus .chevron-toggle,
.filter-group-header:active .chevron-toggle,
.collapsible-toggle:hover svg,
.collapsible-toggle:focus svg,
.collapsible-toggle:active svg {
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	color: #282828 !important;
}

.filter-group-header .chevron-toggle path,
.collapsible-toggle .chevron-toggle path,
.collapsible-toggle svg.icon--chevron path,
.filter-group-header svg path {
	stroke: #282828 !important;
	stroke-width: 1px !important;
	fill: none !important;
	transition: stroke 0.15s ease;
}

.filter-group-header:hover .chevron-toggle path,
.filter-group-header:focus .chevron-toggle path,
.filter-group-header:active .chevron-toggle path,
.collapsible-toggle:hover svg path,
.collapsible-toggle:focus svg path,
.collapsible-toggle:active svg path,
.filter-group-header .chevron-toggle:hover path {
	stroke: #282828 !important;
	fill: none !important;
}

.filter-group-content {
	margin-top: 0;
	padding-bottom: 22px;
}

.filter-options-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.filter-option-item {
	margin: 0;
}

.filter-checkbox-link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 3px 0;
	font-family: var(--mc-font-serif, "infini romain", Georgia, serif);
	font-size: 15px;
	line-height: 26px;
	color: #282828;
	text-decoration: none;
	transition: color 0.15s ease;
}

.filter-checkbox-link:hover {
	color: #000000;
}

.filter-checkbox-link.is-active {
	font-weight: 400;
	color: #282828;
}

.custom-checkbox {
	width: 14px;
	height: 14px;
	border: 1px solid #a8a5a2;
	border-radius: 0px;
	flex-shrink: 0;
	position: relative;
	background: #ffffff;
	transition: all 0.2s ease;
	box-sizing: border-box;
}

.custom-checkbox.checked,
.filter-checkbox-link.is-active .custom-checkbox {
	background: #282828;
	border-color: #282828;
}

.custom-checkbox.checked::after,
.filter-checkbox-link.is-active .custom-checkbox::after {
	content: "";
	position: absolute;
	left: 4px;
	top: 1px;
	width: 4px;
	height: 7px;
	border: solid #ffffff;
	border-width: 0 1.5px 1.5px 0;
	transform: rotate(45deg);
}

.option-label {
	flex: 1;
	font-family: inherit;
	font-size: 15px;
	color: #282828;
}

.option-count {
	font-family: inherit;
	font-size: 15px;
	color: #282828;
}
/* Price Range Form & Dual Slider */
.price-range-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 4px;
}

.price-range__slider-wrap {
	position: relative;
	width: 100%;
	height: 24px;
	margin: 6px 0 10px 0;
	display: flex;
	align-items: center;
}

.price-range__track-bar {
	position: absolute;
	width: 100%;
	height: 2px;
	background: #e0dedc;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}

.price-range__highlight {
	position: absolute;
	height: 100%;
	background: #282828;
	left: 0%;
	right: 0%;
}

.price-range-slider {
	position: absolute;
	width: 100%;
	pointer-events: none;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	z-index: 2;
	margin: 0;
	top: 50%;
	transform: translateY(-50%);
}

.price-range-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	pointer-events: auto;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #282828;
	border: 2px solid #ffffff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	cursor: pointer;
}

.price-range-slider::-moz-range-thumb {
	pointer-events: auto;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #282828;
	border: 2px solid #ffffff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	cursor: pointer;
}

.price-inputs-row {
	display: flex;
	align-items: center;
	gap: 8px;
}

.price-input-field {
	display: flex;
	align-items: center;
	border: 1px solid #d4c8be;
	border-radius: 0px;
	padding: 8px 10px;
	background: #ffffff;
	flex: 1;
}

.price-input-field .currency-symbol {
	font-family: var(--mc-font-serif, "infini romain", Georgia, serif);
	font-size: 0.9rem;
	color: #282828;
	margin-right: 4px;
}

.price-input-field input {
	width: 100%;
	border: none;
	outline: none;
	font-family: var(--mc-font-sans);
	font-size: 0.88rem;
	color: #282828;
	background: transparent;
	padding: 0;
}

.price-separator {
	color: #282828;
	font-family: var(--mc-font-serif, "infini romain", Georgia, serif);
	font-size: 0.9rem;
}

.btn-price-apply {
	background: #282828;
	color: #ffffff;
	border: none;
	border-radius: 0px;
	padding: 9px 16px;
	font-family: var(--mc-font-sans);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease;
}

.btn-price-apply:hover {
	background: #000000;
}

/* 4. Product Area & Toolbar (Exact Reference Alignment) */
.product-facet__product-area {
	width: 100%;
}

.product-facet__meta-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 14px;
	margin-bottom: 24px;
	border-bottom: 1px solid rgba(40, 40, 40, 0.1);
	min-height: 40px;
}

.meta-bar-left {
	display: flex;
	align-items: center;
	gap: 16px;
}

.product-facet__count {
	font-family: var(--mc-font-sans);
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #282828;
}

.mobile-filter-trigger-btn {
	display: none;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	background: #faf6f0;
	border: 1px solid #dcd2c7;
	border-radius: 2px;
	font-size: 0.86rem;
	font-weight: 600;
	color: #282828;
	cursor: pointer;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.product-facet__meta-bar-item--sort {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sort-by-label {
	font-family: var(--mc-font-sans);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #282828;
}

.sort-select-wrapper {
	position: relative;
	display: inline-block;
}

.shop-sort-select {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	border: none;
	padding: 4px 24px 4px 6px;
	font-family: var(--mc-font-sans);
	font-size: 0.85rem;
	color: #282828;
	font-weight: 500;
	cursor: pointer;
}

.shop-sort-select:focus {
	outline: none;
}

.sort-chevron-icon {
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: #282828;
}

/* 5. Product Grid Area (EXACT 3 COLUMNS, NO 92px SHRINK) */
.product-facet__product-list {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 40px 24px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
}

.product-facet__product-list::before,
.product-facet__product-list::after,
.woocommerce ul.products.product-facet__product-list::before,
.woocommerce ul.products.product-facet__product-list::after {
	content: none !important;
	display: none !important;
}

.product-facet__product-list li.product,
.woocommerce ul.products.product-facet__product-list li.product,
.woocommerce-page ul.products.product-facet__product-list li.product,
.product-facet__product-list .product-item-card {
	flex: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
	display: flex !important;
	flex-direction: column !important;
	background: transparent !important;
	position: relative !important;
}

/* 4:5 Aspect Ratio Image Wrapper */
.product-facet__product-list .product-item-image-wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 5;
	background-color: #f7f3ee;
	overflow: hidden;
	border-radius: 0;
	margin-bottom: 12px;
}

.product-facet__product-list .product-item-image-link {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	inset: 0;
}

.product-facet__product-list .product-item-image-ratio {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	padding-bottom: 0;
}

.product-facet__product-list .product-primary-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.product-facet__product-list .product-item-card:hover .product-primary-image {
	transform: scale(1.03);
}

.product-facet__product-list .product-card-hover-img,
.product-facet__product-list .product-item-hover-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.35s ease, transform 0.5s ease;
	z-index: 2;
}

@media (hover: hover) and (min-width: 768px) {
	.product-facet__product-list .product-item-card:hover .product-card-hover-img,
	.product-facet__product-list .product-item-card:hover .product-item-hover-image {
		opacity: 1;
		transform: scale(1.03);
	}
}

/* Badges */
.product-facet__product-list .product-item-award-tag {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 5;
	background: #ffffff;
	border: 1px solid #d4c8be;
	padding: 4px 8px;
	border-radius: 2px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
	pointer-events: none;
}

.product-facet__product-list .product-item-cacao-tag {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 5;
	background: #ffffff;
	border: 1px solid #d4c8be;
	padding: 3px 8px;
	border-radius: 2px;
	font-family: var(--mc-font-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #282828;
	line-height: 1.2;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
	pointer-events: none;
}

.product-facet__product-list .product-item-badge-list {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 3;
}

.product-facet__product-list .badge-sold-out {
	display: inline-block;
	background: #282828;
	color: #ffffff;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: 2px;
}

/* Hover Add-to-Cart Action */
.product-facet__product-list .product-item-actions {
	position: absolute;
	bottom: 12px;
	left: 12px;
	right: 12px;
	z-index: 4;
	display: flex;
	gap: 8px;
	opacity: 0;
	transform: translateY(8px);
	transition: all 0.25s ease;
}

.product-facet__product-list .product-item-card:hover .product-item-actions {
	opacity: 1;
	transform: translateY(0);
}

.product-facet__product-list .product-add-to-cart-btn {
	flex: 1;
	padding: 10px 14px;
	background: rgba(254, 250, 246, 0.95);
	color: #282828;
	border: 1px solid #282828;
	border-radius: 2px;
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: all 0.2s ease;
}

.product-facet__product-list .product-add-to-cart-btn:hover {
	background: #282828;
	color: #ffffff;
}

.product-facet__product-list .product-quick-buy-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	background: rgba(254, 250, 246, 0.95);
	color: #282828;
	border: 1px solid #282828;
	border-radius: 2px;
	cursor: pointer;
	transition: all 0.2s ease;
}

.product-facet__product-list .product-quick-buy-btn:hover {
	background: #282828;
	color: #ffffff;
}

/* Product Card Information & Exact Typography */
.product-facet__product-list .product-item-info {
	padding: 0;
	text-align: left;
}

.product-facet__product-list .product-item-header-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 4px;
}

.product-facet__product-list .product-item-title {
	flex: 1;
	text-align: left;
	margin: 0;
	font-family: "infini romain", Georgia, serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.45;
	color: #282828;
}

.product-facet__product-list .product-item-title a {
	color: #282828;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.product-facet__product-list .product-item-title a:hover {
	opacity: 0.75;
	text-decoration: none;
}

.product-facet__product-list .product-item-veg-icon {
	flex-shrink: 0;
	margin-top: 3px;
}

.product-facet__product-list .product-item-weight {
	display: block;
	font-family: var(--mc-font-sans);
	font-size: 13px;
	color: #282828;
	margin-bottom: 4px;
	letter-spacing: 0.01em;
}

.product-facet__product-list .product-item-price-wrap {
	display: flex;
	align-items: baseline;
	gap: 6px;
	font-family: "infini romain", Georgia, serif;
	font-size: 15px;
	color: #282828;
	font-weight: 400;
}

.product-facet__product-list .product-item-price {
	font-size: 15px;
	color: #282828;
	font-weight: 400;
}

.product-facet__product-list .product-item-tax-note {
	font-size: 12px;
	color: #71717a;
	font-weight: 400;
}

/* 5. Pagination */
.shop-pagination-wrap {
	margin-top: 56px;
	display: flex;
	justify-content: center;
}

.shop-pagination-wrap .woocommerce-pagination ul {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 6px;
}

.shop-pagination-wrap .woocommerce-pagination li {
	margin: 0;
}

.shop-pagination-wrap .woocommerce-pagination a,
.shop-pagination-wrap .woocommerce-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 10px;
	border: 1px solid #dcd2c7;
	border-radius: 4px;
	font-size: 0.88rem;
	font-weight: 600;
	color: #2b160c;
	text-decoration: none;
	transition: all 0.2s ease;
}

.shop-pagination-wrap .woocommerce-pagination a:hover {
	background: #f0e5d4;
	border-color: #2b160c;
}

.shop-pagination-wrap .woocommerce-pagination .current {
	background: #2b160c;
	color: #ffffff;
	border-color: #2b160c;
}

/* 6. Empty State */
.no-products-found-card {
	background: #faf6f0;
	border: 1px dashed #dcd2c7;
	border-radius: 8px;
	padding: 64px 24px;
	text-align: center;
	max-width: 580px;
	margin: 40px auto;
}

.no-products-icon {
	color: #9c8577;
	margin-bottom: 16px;
}

.no-products-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.8rem;
	color: #2b160c;
	margin: 0 0 12px;
}

.no-products-message {
	font-size: 0.95rem;
	color: #634f44;
	line-height: 1.6;
	margin: 0 0 28px;
}

.no-products-actions {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	flex-wrap: wrap;
}

.no-products-actions .btn-primary {
	padding: 10px 22px;
	background: #2b160c;
	color: #ffffff;
	text-decoration: none;
	border-radius: 4px;
	font-size: 0.86rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.no-products-actions .btn-secondary {
	padding: 10px 22px;
	background: transparent;
	color: #2b160c;
	border: 1px solid #2b160c;
	text-decoration: none;
	border-radius: 4px;
	font-size: 0.86rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* 7. Collections Directory Page Styles */
.collections-directory-main {
	padding-bottom: 80px;
}

.collections-dir-hero {
	background-color: #faf6f0;
	border-bottom: 1px solid rgba(43, 22, 12, 0.08);
	padding: 48px 0 40px;
	text-align: center;
}

.collections-dir-hero-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.collections-dir-hero .collection-breadcrumbs {
	color: #7d695e;
	margin-bottom: 12px;
}

.collections-dir-hero .collection-breadcrumbs a {
	color: #5c473c;
}

.collections-dir-hero .breadcrumb-current {
	color: #2b160c;
}

.collections-dir-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.6rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: #2b160c;
	margin: 0 0 12px;
	text-transform: uppercase;
}

.collections-dir-lead {
	max-width: 680px;
	margin: 0 auto;
	font-size: 1.05rem;
	line-height: 1.65;
	color: #543f33;
}

.collections-dir-grid-section {
	padding-top: 48px;
}

.collections-dir-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 36px 28px;
}

.col-dir-card {
	background: #ffffff;
	border: 1px solid #eae2d8;
	border-radius: 6px;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.col-dir-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(43, 22, 12, 0.09);
}

.col-dir-card-link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.col-dir-card-image-wrap {
	position: relative;
	width: 100%;
	padding-bottom: 62.5%; /* 16:10 aspect ratio */
	background-color: #f7f2ea;
	overflow: hidden;
}

.col-dir-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.col-dir-card:hover .col-dir-img {
	transform: scale(1.05);
}

.col-dir-count-badge {
	position: absolute;
	top: 14px;
	right: 14px;
	background: rgba(43, 22, 12, 0.85);
	backdrop-filter: blur(4px);
	color: #ffffff;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: 20px;
}

.col-dir-card-info {
	padding: 22px 20px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.col-dir-name {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.45rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 10px;
	line-height: 1.25;
}

.col-dir-desc {
	font-size: 0.92rem;
	line-height: 1.58;
	color: #5c473c;
	margin: 0 0 18px;
	flex-grow: 1;
}

.col-dir-cta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.84rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #9c4125;
	transition: gap 0.2s ease, color 0.2s ease;
}

.col-dir-card:hover .col-dir-cta {
	color: #6d2410;
	gap: 12px;
}

/* 8. Mobile Filter Drawer Overlay */
.mobile-filter-drawer {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
}

.mobile-filter-drawer[hidden] {
	display: none;
}

.mobile-filter-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
	backdrop-filter: blur(2px);
}

.mobile-filter-panel {
	position: relative;
	width: 85%;
	max-width: 360px;
	height: 100%;
	background: #ffffff;
	box-shadow: 4px 0 24px rgba(0, 0, 0, 0.2);
	display: flex;
	flex-direction: column;
	z-index: 10;
	margin-left: auto; /* opens from right side */
	animation: slideInRight 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes slideInRight {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}

.mobile-filter-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	border-bottom: 1px solid #eae2d8;
}

.mobile-filter-panel-title {
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #2b160c;
	margin: 0;
}

.mobile-filter-close-btn {
	background: none;
	border: none;
	color: #4a382e;
	cursor: pointer;
	padding: 4px;
}

.mobile-filter-panel-body {
	padding: 20px;
	overflow-y: auto;
	flex-grow: 1;
}

.mobile-filter-clear-bar {
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid #f0e9df;
}

.mobile-filter-section {
	margin-bottom: 22px;
}

.mobile-filter-subheading {
	font-size: 0.88rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #2b160c;
	margin: 0 0 10px;
}

.mobile-filter-panel-footer {
	padding: 16px 20px;
	border-top: 1px solid #eae2d8;
	background: #faf6f0;
}

.mobile-filter-panel-footer .btn-block {
	width: 100%;
	padding: 12px;
	background: #2b160c;
	color: #ffffff;
	border: none;
	border-radius: 4px;
	font-size: 0.9rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
}

/* 9. Responsive Breakpoints for Phase 11 */
@media screen and (max-width: 1023px) {
	.product-facet-layout {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.product-facet__sidebar {
		display: none; /* replaced by mobile drawer */
	}

	.mobile-filter-trigger-btn {
		display: inline-flex;
	}

	.product-facet__product-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px 16px;
	}

	.collections-dir-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}

	/* Always show add to cart on touch */
	.product-facet__product-list .product-item-actions {
		opacity: 1;
		transform: none;
		position: static;
		margin-top: 10px;
	}
}

@media screen and (max-width: 767px) {
	.collection-banner-title {
		font-size: 2rem;
	}

	.collection-hero-banner {
		min-height: 240px;
		padding: 36px 0 28px;
	}

	.collections-dir-title {
		font-size: 2rem;
	}

	.collections-dir-lead {
		font-size: 0.95rem;
	}

	.product-facet__meta-bar {
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}

	.product-facet__meta-bar-item--sort {
		justify-content: space-between;
	}

	.shop-sort-select {
		width: 100%;
	}
}

@media screen and (max-width: 480px) {
	.product-facet__product-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 18px 10px;
	}

	.collections-dir-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.product-facet__product-list .product-item-title {
		font-size: 0.88rem;
	}

	.product-facet__product-list .product-item-price-wrap {
		font-size: 0.84rem;
	}

	.product-facet__product-list .product-add-to-cart-btn {
		font-size: 0.74rem;
		padding: 8px 6px;
	}
}



/* ==========================================================================
   PHASE 12: SINGLE PRODUCT DETAILS PAGE STYLES
   ========================================================================== */

/* 1. Breadcrumbs */
.product-breadcrumbs {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	font-size: 0.8rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #7d695e;
	padding: 28px 0 24px;
	border-bottom: 1px solid rgba(43, 22, 12, 0.07);
	margin-bottom: 36px;
}

.product-breadcrumbs a {
	color: #5c473c;
	text-decoration: none;
	transition: color 0.2s ease;
}

.product-breadcrumbs a:hover {
	color: #2b160c;
	text-decoration: underline;
}

.product-breadcrumbs .breadcrumb-separator {
	color: #baa99c;
}

.product-breadcrumbs .breadcrumb-current {
	color: #2b160c;
	font-weight: 600;
}

/* 2. Main Two-Column Layout */
.product-main-layout {
	display: grid;
	grid-template-columns: 52% 48%;
	gap: 56px;
	align-items: start;
	margin-bottom: 64px;
}

/* 3. Product Gallery */
.product__media {
	position: relative;
	width: 100%;
}

.product__gallery-container {
	display: grid;
	gap: 20px;
}

.product__gallery-container.has-thumbnails {
	grid-template-columns: 88px 1fr;
}

.product__gallery-container.no-thumbnails {
	grid-template-columns: 1fr;
}

/* Thumbnail Strip */
.product__thumbnail-list-wrapper {
	max-height: 600px;
	overflow-y: auto;
}

.product__thumbnail-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.product__thumbnail-item {
	width: 100%;
	aspect-ratio: 4 / 5;
	border: 1px solid #e5e5e5;
	border-radius: 0px;
	padding: 0;
	background: #f7f7f7;
	cursor: pointer;
	overflow: hidden;
	transition: border-color 0.2s ease, opacity 0.2s ease;
	opacity: 0.75;
}

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

.product__thumbnail-item:hover {
	opacity: 1;
	border-color: #999999;
}

.product__thumbnail-item.is-active {
	opacity: 1;
	border: 1.5px solid #000000;
}

/* Main Active View */
.product__main-image-wrapper {
	position: relative;
	width: 100%;
	background-color: #f7f7f7;
	border-radius: 0px;
	overflow: hidden;
}

.product__main-image-ratio {
	position: relative;
	width: 100%;
	padding-bottom: 125%; /* 4:5 Aspect Ratio */
}

.product__active-photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.3s ease;
}

.product__media .product-badge-wrap {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 5;
}

/* 4. Product Info Column */
.product__info {
	display: flex;
	flex-direction: column;
}

.product-meta__weight-wrap {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.product-veg-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	flex-shrink: 0;
}

.product-veg-icon__square {
	width: 14px;
	height: 14px;
	border: 1.5px solid #008836;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1px;
	border-radius: 2px;
	background: #ffffff;
}

.product-veg-icon__circle {
	width: 6px;
	height: 6px;
	background-color: #008836;
	border-radius: 50%;
	display: block;
}

.product-meta__weight {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	color: #282828;
	margin: 0;
	display: inline;
}

.product-meta__title {
	font-family: var(--mc-font-serif, "HeroinePro-Regular", Georgia, serif);
	font-size: 28px;
	font-weight: 400;
	line-height: 1.25;
	color: #282828;
	margin: 0 0 12px;
	text-transform: none;
	letter-spacing: -0.5px;
}

.product-meta__price-wrap {
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid #e5e5e5;
}

.product-meta__price {
	font-family: var(--mc-font-sans, "FS Meridian Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 20px;
	font-weight: 600;
	color: #282828;
}

.product-meta__tax-note {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13px;
	color: #666666;
	font-weight: 400;
}

.product-meta__unit-price {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	color: #282828;
	font-weight: 500;
	margin-left: 4px;
}

/* Reviews Badge */
.product-meta__reviews-badge {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
}

.reviews-count-text {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13px;
	color: #666666;
}

/* Dietary Highlights Chips */
.product-highlights {
	margin-bottom: 22px;
}

.product-highlights__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.product-highlights__chip {
	background: #ffffff;
	border: 1px solid #282828;
	border-radius: 0px;
	padding: 5px 12px;
	display: inline-flex;
	align-items: center;
}

.product-highlights__chip-title {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	color: #282828;
}

/* Taste Descriptors Table */
.taste-descriptors {
	background: #ffffff;
	border: 1px solid #e5e5e5;
	border-radius: 0px;
	padding: 16px 20px;
	margin-bottom: 24px;
}

.taste-descriptors__table {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.taste-descriptors__row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 8px;
	border-bottom: 1px solid #f0f0f0;
}

.taste-descriptors__row:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.taste-descriptors__label {
	font-family: var(--mc-font-sans, "FS Meridian Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #282828;
	flex-shrink: 0;
}

.taste-descriptors__value {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	line-height: 1.5;
	color: #404040;
	text-align: right;
}

/* 5. Purchasing Controls (Quantity + Add to Cart) */
.product-purchasing-area {
	margin-bottom: 28px;
}

.purchasing-controls-row {
	display: flex;
	gap: 12px;
	align-items: center;
	width: 100%;
}

/* Quantity Selector */
.quantity-selector-wrap {
	display: inline-flex;
	align-items: center;
	border: 1px solid #282828;
	border-radius: 0px;
	height: 48px;
	background: #ffffff;
	flex-shrink: 0;
}

.qty-btn {
	width: 44px;
	height: 100%;
	background: transparent;
	border: none;
	font-size: 18px;
	color: #282828;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
	user-select: none;
}

.qty-btn:hover {
	background: #f5f5f5;
}

.qty-input {
	width: 48px;
	height: 100%;
	border: none;
	text-align: center;
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 15px;
	font-weight: 600;
	color: #282828;
	background: transparent;
	outline: none;
	appearance: textfield;
	-moz-appearance: textfield;
}

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

/* Single Add to Cart Button */
.product-form__add-button {
	flex: 1;
	height: 48px;
	background: #000000;
	color: #ffffff;
	border: 1px solid #000000;
	border-radius: 0px;
	font-family: "infini romain", var(--mc-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transition: background 0.25s ease;
}

.product-form__add-button:hover:not(.is-disabled) {
	background: #282828;
	border-color: #282828;
}

.product-form__add-button.is-disabled {
	background: #e0e0e0;
	border-color: #e0e0e0;
	color: #888888;
	cursor: not-allowed;
	opacity: 0.75;
}

/* 6. Pincode Delivery Checker */
.pincode-checker-box {
	background: transparent;
	border: none;
	padding: 0;
	margin-bottom: 20px;
}

.pincode-form {
	margin-top: 0;
}

.pincode-input-group {
	display: flex;
	align-items: center;
	border: 1px solid #282828;
	border-radius: 0px;
	background: #ffffff;
	max-width: 100%;
}

.pincode-truck-icon {
	margin-left: 14px;
	color: #282828;
	flex-shrink: 0;
}

.pincode-number-input {
	flex: 1;
	height: 48px;
	padding: 0 14px;
	background: transparent;
	border: none;
	border-radius: 0px;
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	color: #282828;
	outline: none;
	letter-spacing: 0.04em;
}

.pincode-check-btn {
	height: 48px;
	padding: 0 24px;
	background: #000000;
	color: #ffffff;
	border: none;
	border-radius: 0px;
	font-family: "infini romain", var(--mc-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease;
}

.pincode-check-btn:hover {
	background: #333333;
}

.pincode-feedback-message {
	margin-top: 8px;
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
}

.pincode-feedback-message.is-valid {
	color: #008836;
}

.pincode-feedback-message.is-notice {
	color: #555555;
}

.pincode-feedback-message.is-invalid {
	color: #d32f2f;
}

/* 7. Product Information Tabs & Accordions */
.product-info-tabs-section {
	margin-top: 60px;
	padding-top: 40px;
	border-top: 1px solid #e5e5e5;
}

.tabs-nav-bar {
	display: flex;
	align-items: center;
	gap: 36px;
	border-bottom: 1px solid #e5e5e5;
	margin-bottom: 28px;
}

.tab-nav-btn {
	background: none;
	border: none;
	padding: 0 0 14px;
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #767676;
	cursor: pointer;
	position: relative;
	transition: color 0.2s ease;
	white-space: nowrap;
}

.tab-nav-btn:hover {
	color: #000000;
}

.tab-nav-btn.is-active {
	color: #000000;
}

.tab-nav-btn.is-active::after {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	height: 2px;
	background: #000000;
}

/* Accordion Header (Mobile view) */
.mobile-accordion-header {
	display: none; /* hidden on desktop */
	width: 100%;
	padding: 16px 0;
	background: none;
	border: none;
	border-bottom: 1px solid #e5e5e5;
	font-family: var(--mc-font-sans, "FS Meridian Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #282828;
	cursor: pointer;
	justify-content: space-between;
	align-items: center;
	text-align: left;
}

.mobile-accordion-header .accordion-arrow {
	transition: transform 0.25s ease;
}

.mobile-accordion-header[aria-expanded="false"] .accordion-arrow {
	transform: rotate(-90deg);
}

/* Tab Panels */
.tab-panel {
	display: none;
}

.tab-panel.is-active {
	display: block;
}

.tab-panel-inner {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 15px;
	line-height: 1.7;
	color: #333333;
	max-width: 860px;
}

.tab-panel-inner p {
	margin: 0 0 16px;
}

.tab-panel-inner p:last-child {
	margin-bottom: 0;
}

/* Specifications Table in Product Info Tab */
.spec-table {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.spec-row {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid #f0f0f0;
}

.spec-row:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.spec-label {
	font-family: var(--mc-font-sans, "FS Meridian Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #282828;
}

.spec-value {
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 14px;
	color: #404040;
}

/* 8. More in Collection / Related Products */
.more-in-collection-section {
	margin-top: 70px;
	padding-top: 50px;
	border-top: 1px solid #e5e5e5;
}

.more-in-collection-section .section-header {
	margin-bottom: 40px;
}

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

/* 9. Responsive Queries for Phase 12 */
@media screen and (max-width: 1023px) {
	.product-main-layout {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.product__gallery-container.has-thumbnails {
		grid-template-columns: 76px 1fr;
	}

	.related-products-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px 16px;
	}
}

@media screen and (max-width: 767px) {
	.product-meta__title {
		font-size: 1.8rem;
	}

	.product__gallery-container.has-thumbnails {
		grid-template-columns: 1fr;
	}

	.product__thumbnail-list-wrapper {
		order: 2;
		max-height: none;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.product__thumbnail-list {
		flex-direction: row;
		gap: 10px;
	}

	.product__thumbnail-item {
		width: 68px;
		flex-shrink: 0;
	}

	/* Switch Tabs to Mobile Accordion Headers */
	.tabs-nav-bar {
		display: none;
	}

	.mobile-accordion-header {
		display: flex;
	}

	.tab-panel {
		display: block;
	}

	.tab-panel-inner {
		padding: 16px 4px 24px;
	}

	.tab-panel:not(.is-active) .tab-panel-inner {
		display: none;
	}

	.spec-row {
		grid-template-columns: 1fr;
		gap: 4px;
	}

	.purchasing-controls-row {
		flex-direction: column;
		align-items: stretch;
	}

	.quantity-selector-wrap {
		width: 100%;
		justify-content: space-between;
	}

	.product-form__add-button {
		width: 100%;
	}
}

@media screen and (max-width: 480px) {
	.product-meta__title {
		font-size: 1.55rem;
	}

	.product-meta__price {
		font-size: 1.35rem;
	}

	.related-products-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px 10px;
	}
}



/* ==========================================================================
   PHASE 13: ABOUT US & MEDIA (PRESS) PAGES
   ========================================================================== */

/* --------------------------------------------------------------------------
   STAGE 5.13: ABOUT US & MEDIA (PRESS) AUTHENTIC REFERENCE PARITY
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   A. About Us Page Styles
   -------------------------------------------------------------------------- */
.about-page-main {
	background-color: #ffffff;
	color: #282828;
	overflow-x: hidden;
	font-family: "infini romain", "FS Meridian", var(--mc-font-sans), sans-serif;
}

/* 1. Hero Overlay Section */
.about-hero-section {
	position: relative;
	width: 100%;
	min-height: 520px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background-color: #1a1a1a;
}

.about-hero-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

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

.about-hero-scrim {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.32);
}

.about-hero-content-wrap {
	position: relative;
	z-index: 2;
	width: 100%;
	text-align: center;
	padding: 80px 20px;
}

.about-hero-title {
	font-family: "HeroinePro-Regular", "infini gras", Georgia, serif;
	font-size: 44px;
	font-weight: 400;
	line-height: 1.15;
	color: #ffffff;
	max-width: 920px;
	margin: 0 auto;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45);
	letter-spacing: 0.01em;
}

/* 2. WE ARE MANAM */
.about-we-are-section {
	position: relative;
	width: 100%;
	min-height: 540px;
	display: flex;
	align-items: center;
	overflow: hidden;
	background-color: #fef8f4;
}

.about-we-are-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

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

.about-we-are-container {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: flex-end;
	width: 100%;
	padding-top: 64px;
	padding-bottom: 64px;
}

.about-overlay-card {
	max-width: 580px;
	background: rgba(254, 248, 244, 0.94);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	padding: 48px;
	border-radius: 2px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.about-card-title {
	font-family: "infini gras", "HeroinePro-Medium", Georgia, serif;
	font-size: 32px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #282828;
	margin: 0 0 20px;
	line-height: 1.2;
}

.about-card-body p {
	font-family: "infini romain", "FS Meridian", var(--mc-font-sans), sans-serif;
	font-size: 16px;
	line-height: 26px;
	color: #282828;
	margin: 0 0 16px;
}

.about-card-body p:last-child {
	margin-bottom: 0;
}

.about-card-brand-seal {
	margin-top: 24px;
	display: flex;
	justify-content: flex-start;
}

.about-card-brand-seal img {
	max-width: 303px;
	height: auto;
	display: block;
}

/* 3. Section Divider Bands (Dark & Light) */
.about-divider-band {
	width: 100%;
	padding: 38px 0;
	text-align: left;
}

.about-divider-band.band-dark {
	background-color: #282828;
	color: #ffffff;
}

.about-divider-band.band-light {
	background-color: #ffffff;
	color: #282828;
	border-top: 1px solid rgba(40, 40, 40, 0.08);
	border-bottom: 1px solid rgba(40, 40, 40, 0.08);
}

.about-divider-heading {
	font-family: "infini gras", "HeroinePro-Medium", Georgia, serif;
	font-size: 32px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	margin: 0;
	line-height: 1.2;
}

.about-divider-band.band-dark .about-divider-heading {
	color: #ffffff;
}

.about-divider-band.band-light .about-divider-heading {
	color: #282828;
}

/* 4 & 5. Split Feature Rows (Big Chocolate & Bean-to-Bar) */
.about-split-feature {
	width: 100%;
	padding: 0;
	background-color: #ffffff;
}

.about-split-row {
	display: flex;
	align-items: stretch;
	width: 100%;
	min-height: 480px;
}

.about-split-media-col {
	flex: 1 1 50%;
	width: 50%;
	position: relative;
	overflow: hidden;
}

.about-split-photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.about-split-text-col {
	flex: 1 1 50%;
	width: 50%;
	display: flex;
	align-items: center;
	background-color: #ffffff;
}

.about-editorial-box {
	width: 100%;
	height: 100%;
	padding: 56px 48px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: #ffffff;
}

.box-pattern-rectangle1 {
	background: url('/wp-content/uploads/manam-about-media/Rectangle_1.png') repeat !important;
}

.box-pattern-pattern2 {
	background: url('/wp-content/uploads/manam-about-media/pattern_2.0.jpg') repeat !important;
}

.box-pattern-pattern3 {
	background: url('/wp-content/uploads/manam-about-media/Pattern3.jpg') repeat !important;
}

.about-feature-heading {
	font-family: "infini gras", "HeroinePro-Medium", Georgia, serif;
	font-size: 32px;
	font-weight: 700;
	color: #282828;
	margin: 0 0 20px;
	line-height: 1.22;
	letter-spacing: 0.02em;
}

.about-feature-text p {
	font-family: "infini romain", "FS Meridian", var(--mc-font-sans), sans-serif;
	font-size: 16px;
	line-height: 26px;
	color: #282828;
	margin: 0;
}

/* 7, 8, 9. Carousel Sections */
.about-carousel-section {
	width: 100%;
	padding: 0;
	background-color: #ffffff;
}

.about-carousel-col {
	flex: 1 1 50%;
	width: 50%;
	position: relative;
	overflow: hidden;
	max-height: 500px;
}

.about-carousel-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.about-carousel-track {
	display: flex;
	width: 100%;
	height: 100%;
	transition: transform 0.45s ease-in-out;
}

.about-carousel-slide {
	flex: 0 0 100%;
	width: 100%;
	height: 100%;
	position: relative;
}

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

.about-carousel-nav {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 16px;
	pointer-events: none;
	z-index: 5;
}

.about-carousel-arrow {
	pointer-events: auto;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.88);
	border: none;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #282828;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
	transition: background 0.2s, transform 0.15s;
}

.about-carousel-arrow:hover {
	background: #ffffff;
	transform: scale(1.08);
}

.about-carousel-arrow svg {
	width: 14px;
	height: 14px;
	display: block;
}

/* 10. Edition 2023 */
.about-edition-eyebrow {
	font-family: var(--mc-font-sans);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #282828;
	margin-bottom: 16px;
}

/* 11 & 12. Ambient Looping Video Sections */
.about-video-section {
	position: relative;
	width: 100%;
	min-height: 520px;
	display: flex;
	align-items: center;
	overflow: hidden;
	background-color: #121212;
}

.about-video-media-wrap {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.about-video-bg {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	opacity: 0.95;
}

.about-video-container {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: flex-end;
	width: 100%;
	padding-top: 64px;
	padding-bottom: 64px;
}

.about-video-card {
	max-width: 540px;
	background: rgba(254, 248, 244, 0.94);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	padding: 48px;
	border-radius: 2px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* 12B. Karkhana 7 Pillars Info Bar */
.about-karkhana-info-bar {
	background-color: #fef8f4;
	color: #282828;
	padding: 36px 0 40px;
	border-top: 1px solid rgba(40, 40, 40, 0.1);
	font-family: "FS Meridian", var(--mc-font-sans), sans-serif;
}

.karkhana-info-inner {
	max-width: 1200px;
	margin: 0 auto;
}

.karkhana-pillars-row {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding-bottom: 14px;
	border-bottom: 3px solid #000000;
	margin-bottom: 14px;
	line-height: 1.6;
}

.karkhana-address-row {
	padding-bottom: 14px;
	border-bottom: 3px solid #000000;
	margin-bottom: 14px;
}

.karkhana-map-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-decoration: none;
	color: #282828;
	font-size: 15px;
	font-weight: 700;
	padding: 6px 0;
	transition: opacity 0.2s ease;
}

.karkhana-map-link:hover {
	opacity: 0.75;
}

.karkhana-hours {
	font-size: 14px;
	color: #282828;
	margin-top: 4px;
}

.karkhana-contact-row {
	padding-top: 6px;
}

.karkhana-contact-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-decoration: none;
	color: #282828;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 6px 0;
	transition: opacity 0.2s ease;
}

.karkhana-contact-link:hover {
	opacity: 0.75;
}

.karkhana-arrow-icon {
	display: flex;
	align-items: center;
}

/* --------------------------------------------------------------------------
   B. Press / Media ("In the News") Page Styles
   -------------------------------------------------------------------------- */
.press-page-main {
	background-color: #ffffff;
	color: #282828;
	padding-bottom: 96px;
	font-family: "FS Meridian", var(--mc-font-sans), sans-serif;
}

.press-breadcrumbs {
	padding: 24px 0 12px;
	background: transparent;
}

.press-page-header {
	padding: 32px 0 56px;
	text-align: center;
}

.press-page-title {
	font-family: "HeroinePro-Regular", "infini gras", Georgia, serif;
	font-size: 44px;
	font-weight: 800;
	letter-spacing: 0.02em;
	color: #282828;
	margin: 0;
}

.press-feed-section {
	width: 100%;
}

.press-articles-list {
	display: flex;
	flex-direction: column;
	gap: 64px;
}

.press-article-block {
	width: 100%;
	padding-bottom: 64px;
	border-bottom: 1px solid rgba(40, 40, 40, 0.12);
}

.press-article-block:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.press-article-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
}

/* Alternating orientation */
.press-article-block.is-normal .press-article-media {
	order: 1;
}

.press-article-block.is-normal .press-article-content {
	order: 2;
}

.press-article-block.is-reversed .press-article-media {
	order: 2;
}

.press-article-block.is-reversed .press-article-content {
	order: 1;
}

.press-article-image-ratio {
	position: relative;
	width: 100%;
	padding-bottom: 68%;
	overflow: hidden;
	background-color: #f5f5f5;
	border-radius: 2px;
}

.press-article-photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.35s ease;
}

.press-article-block:hover .press-article-photo {
	transform: scale(1.02);
}

.press-article-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

.press-article-meta-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 16px;
	flex-wrap: wrap;
}

.press-article-logo-wrap {
	display: flex;
	align-items: center;
}

.press-pub-logo {
	max-height: 38px;
	width: auto;
	max-width: 140px;
	object-fit: contain;
	display: block;
}

.press-article-date {
	font-family: "FS Meridian", var(--mc-font-sans);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #666666;
}

.press-article-headline {
	font-family: "HeroinePro-Regular", "infini gras", Georgia, serif;
	font-size: 32px;
	font-weight: 800;
	line-height: 1.25;
	color: #282828;
	margin: 0 0 16px;
}

.press-article-headline a {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.2s;
}

.press-article-headline a:hover {
	opacity: 0.8;
	text-decoration: underline;
}

.press-article-description p {
	font-family: "FS Meridian", var(--mc-font-sans);
	font-size: 15px;
	line-height: 1.7;
	color: #333333;
	margin: 0 0 24px;
}

.press-read-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 28px;
	background: transparent;
	border: 1px solid #282828;
	color: #282828;
	font-family: var(--mc-font-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 2px;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.press-read-btn:hover {
	background: #282828;
	color: #ffffff;
	border-color: #282828;
}

/* --------------------------------------------------------------------------
   C. Responsive Breakpoints for Stage 5.13
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1024px) {
	.about-split-row {
		flex-direction: column;
		min-height: auto;
	}

	.about-split-media-col,
	.about-split-text-col,
	.about-carousel-col {
		flex: 1 1 100%;
		width: 100%;
		max-width: 100%;
	}

	.about-carousel-col {
		max-height: 440px;
	}

	.split-image-right .about-split-media-col {
		order: 1;
	}

	.split-image-right .about-split-text-col {
		order: 2;
	}

	.press-article-grid {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.press-article-block.is-reversed .press-article-media,
	.press-article-block.is-normal .press-article-media {
		order: 1 !important;
	}

	.press-article-block.is-reversed .press-article-content,
	.press-article-block.is-normal .press-article-content {
		order: 2 !important;
	}

	.press-article-headline {
		font-size: 26px;
	}

	.about-editorial-box {
		padding: 40px 28px;
	}

	.about-card-title,
	.about-feature-heading,
	.about-divider-heading {
		font-size: 26px;
	}
}

@media screen and (max-width: 999px) {
	.about-we-are-section {
		background: url('/wp-content/uploads/manam-about-media/Pattern1.png') repeat;
	}

	.desktop-only-img {
		display: none;
	}

	.about-we-are-container {
		justify-content: center;
		padding: 48px 16px;
	}

	.about-overlay-card {
		max-width: 100%;
		padding: 32px 24px;
		background: rgba(254, 248, 244, 0.96);
	}
}

@media screen and (max-width: 768px) {
	.about-hero-section {
		min-height: 380px;
	}

	.about-hero-title {
		font-size: 30px;
	}

	.about-video-section {
		min-height: 420px;
	}

	.about-video-container {
		justify-content: center;
		padding: 40px 16px;
	}

	.about-video-card {
		max-width: 100%;
		padding: 32px 24px;
	}

	.about-carousel-col {
		max-height: 340px;
	}

	.press-page-title {
		font-size: 32px;
	}

	.press-page-header {
		padding: 24px 0 36px;
	}

	.press-article-headline {
		font-size: 22px;
	}

	.karkhana-pillars-row {
		font-size: 13px;
	}
}

@media screen and (max-width: 480px) {
	.about-hero-title {
		font-size: 24px;
	}

	.about-card-title,
	.about-feature-heading,
	.about-divider-heading {
		font-size: 22px;
	}

	.press-read-btn {
		width: 100%;
	}
}



/* ==========================================================================
   PHASE 14: EXPERIENCE AND WORKSHOPS STYLES
   ========================================================================== */

/* 1. Workshops Collection Page Header */
.workshops-page-main {
	background-color: #faf7f2;
	color: #382417;
	padding-bottom: 90px;
}

.workshops-header {
	padding: 20px 0 56px;
	border-bottom: 1px solid rgba(43, 22, 12, 0.08);
	margin-bottom: 56px;
}

.workshops-header-grid {
	display: grid;
	grid-template-columns: 52% 48%;
	gap: 48px;
	align-items: center;
}

.workshops-eyebrow {
	display: block;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #8c6239;
	margin-bottom: 14px;
}

.workshops-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 3rem;
	font-weight: 500;
	line-height: 1.18;
	color: #2b160c;
	margin: 0 0 16px;
	letter-spacing: 0.02em;
}

.workshops-desc {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #5c473c;
	margin: 0 0 24px;
}

.workshops-venue-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #f4ecdf;
	border: 1px solid #e0d4c5;
	padding: 8px 16px;
	border-radius: 20px;
	font-size: 0.84rem;
	font-weight: 600;
	color: #2b160c;
}

.workshops-venue-pill svg {
	color: #8c6239;
	flex-shrink: 0;
}

.workshops-header-media {
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 12px 35px rgba(43, 22, 12, 0.1);
	background: #24140b;
}

.workshops-hero-img {
	width: 100%;
	height: auto;
	display: block;
}

/* 2. Workshop Notification Card (Empty State Interface) */
.workshop-notification-card {
	background: #ffffff;
	border: 1px solid #e8decb;
	border-radius: 8px;
	padding: 56px 40px;
	max-width: 820px;
	margin: 0 auto 72px;
	box-shadow: 0 10px 30px rgba(43, 22, 12, 0.05);
}

.workshop-notification-inner {
	max-width: 640px;
	margin: 0 auto;
}

.notification-icon-wrap {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: #faf4ea;
	border: 1px solid #e0d4c2;
	color: #8c6239;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
}

.workshop-notification-heading {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.25;
	color: #2b160c;
	margin: 0 0 14px;
}

.workshop-notification-subtitle {
	font-size: 1rem;
	line-height: 1.65;
	color: #6d584c;
	margin: 0 0 32px;
}

.workshop-notification-form {
	text-align: left;
}

.form-fields-wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-bottom: 20px;
}

.form-field-group {
	display: flex;
	flex-direction: column;
}

.form-field-label {
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #2b160c;
	margin-bottom: 8px;
}

.form-field-label .required {
	color: #c62828;
}

.form-field-input {
	height: 48px;
	padding: 0 16px;
	background: #ffffff;
	border: 1px solid #d4c8be;
	border-radius: 3px;
	font-size: 0.94rem;
	color: #2b160c;
	outline: none;
	width: 100%;
	transition: border-color 0.2s ease;
}

.form-field-input:focus {
	border-color: #2b160c;
}

.whatsapp-input-wrapper {
	display: flex;
	align-items: center;
	border: 1px solid #d4c8be;
	border-radius: 3px;
	background: #ffffff;
	overflow: hidden;
	height: 48px;
	transition: border-color 0.2s ease;
}

.whatsapp-input-wrapper:focus-within {
	border-color: #2b160c;
}

.whatsapp-prefix {
	background: #f4ecdf;
	color: #2b160c;
	font-size: 0.92rem;
	font-weight: 700;
	padding: 0 14px;
	height: 100%;
	display: flex;
	align-items: center;
	border-right: 1px solid #d4c8be;
	user-select: none;
}

.whatsapp-number-field {
	border: none;
	height: 100%;
	padding: 0 14px;
	outline: none;
	width: 100%;
	letter-spacing: 0.05em;
}

.form-consent-group {
	margin-bottom: 24px;
}

.consent-checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 0.86rem;
	line-height: 1.5;
	color: #5c473c;
	cursor: pointer;
}

.consent-checkbox-label input {
	margin-top: 3px;
	accent-color: #2b160c;
}

.workshop-submit-btn {
	width: 100%;
	height: 52px;
	background: #2b160c;
	color: #ffffff;
	border: 1px solid #2b160c;
	border-radius: 3px;
	font-size: 0.92rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	transition: background 0.2s ease;
}

.workshop-submit-btn:hover:not(:disabled) {
	background: #4a2818;
}

.workshop-submit-btn:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.form-feedback-message {
	margin-top: 18px;
	font-size: 0.9rem;
	line-height: 1.5;
	border-radius: 4px;
	display: none;
}

.form-feedback-message.is-success {
	display: block;
	background: #e8f5e9;
	color: #1b5e20;
	border: 1px solid #c8e6c9;
	padding: 14px 18px;
}

.form-feedback-message.is-error {
	display: block;
	background: #ffebee;
	color: #c62828;
	border: 1px solid #ffcdd2;
	padding: 14px 18px;
}

/* 3. What to Expect Section */
.workshop-experience-overview {
	margin-bottom: 72px;
}

.workshop-features-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

.workshop-feature-card {
	background: #ffffff;
	border: 1px solid #e8decb;
	border-radius: 5px;
	padding: 30px 22px;
	text-align: center;
	transition: transform 0.2s ease;
}

.workshop-feature-card:hover {
	transform: translateY(-3px);
	border-color: #8c6239;
}

.workshop-feature-card .feature-icon {
	color: #8c6239;
	margin-bottom: 16px;
	display: flex;
	justify-content: center;
}

.feature-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.22rem;
	font-weight: 600;
	color: #2b160c;
	margin: 0 0 10px;
}

.feature-desc {
	font-size: 0.9rem;
	line-height: 1.6;
	color: #5c473c;
	margin: 0;
}

/* 4. Private Workshops Teaser */
.private-workshop-teaser-section {
	margin-bottom: 30px;
}

.teaser-card {
	border-radius: 6px;
	padding: 60px 36px;
	box-shadow: 0 12px 35px rgba(0, 0, 0, 0.25);
}

.teaser-badge {
	display: inline-block;
	background: rgba(212, 175, 55, 0.15);
	color: #d4af37;
	border: 1px solid rgba(212, 175, 55, 0.35);
	border-radius: 20px;
	padding: 5px 16px;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	margin-bottom: 16px;
}

.teaser-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.4rem;
	font-weight: 500;
	color: #ffffff;
	margin: 0 0 16px;
	letter-spacing: 0.02em;
}

.teaser-desc {
	font-size: 1.05rem;
	line-height: 1.75;
	color: #d4c4b8;
	max-width: 680px;
	margin: 0 auto 30px;
}

/* 5. Karkhana Tours Destination Styles */
.karkhana-tours-main {
	background-color: #faf7f2;
	color: #382417;
	padding-bottom: 90px;
}

.tours-header {
	padding: 20px 0 56px;
	border-bottom: 1px solid rgba(43, 22, 12, 0.08);
	margin-bottom: 56px;
}

.tours-header-grid {
	display: grid;
	grid-template-columns: 52% 48%;
	gap: 48px;
	align-items: center;
}

.tours-eyebrow {
	display: block;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #8c6239;
	margin-bottom: 14px;
}

.tours-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 3rem;
	font-weight: 500;
	line-height: 1.18;
	color: #2b160c;
	margin: 0 0 16px;
	letter-spacing: 0.02em;
}

.tours-subtitle {
	font-size: 1.08rem;
	line-height: 1.7;
	color: #5c473c;
	margin: 0 0 24px;
}

.tours-location-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #f4ecdf;
	border: 1px solid #e0d4c5;
	padding: 8px 16px;
	border-radius: 20px;
	font-size: 0.84rem;
	font-weight: 600;
	color: #2b160c;
}

.tours-header-media {
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 12px 35px rgba(43, 22, 12, 0.1);
	background: #24140b;
}

.tours-hero-image {
	width: 100%;
	height: auto;
	display: block;
}

/* Tour Status Notice Card */
.tour-status-section {
	margin-bottom: 72px;
}

.tour-status-card {
	background: #ffffff;
	border: 1px solid #e8decb;
	border-left: 5px solid #d4af37;
	border-radius: 6px;
	padding: 44px 40px;
	max-width: 900px;
	margin: 0 auto;
	box-shadow: 0 10px 30px rgba(43, 22, 12, 0.05);
}

.tour-status-badge {
	display: inline-block;
	background: #f4ecdf;
	color: #8c6239;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	padding: 4px 12px;
	border-radius: 2px;
	margin-bottom: 14px;
}

.tour-status-heading {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.85rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 14px;
}

.tour-status-text {
	font-size: 1.02rem;
	line-height: 1.7;
	color: #5c473c;
	margin: 0 0 28px;
}

.tour-contact-box {
	background: #faf7f2;
	border: 1px dashed #d4c8be;
	border-radius: 4px;
	padding: 24px 28px;
}

.contact-prompt {
	font-size: 0.94rem;
	color: #2b160c;
	margin: 0 0 16px;
	line-height: 1.6;
}

.contact-links-row {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}

.contact-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #2b160c;
	color: #ffffff;
	padding: 10px 18px;
	border-radius: 3px;
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: background 0.2s ease;
}

.contact-pill:hover {
	background: #4a2818;
	color: #ffffff;
}

/* Tour Highlights */
.tour-highlights-section {
	margin-bottom: 72px;
}

.tour-highlights-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

.tour-highlight-card {
	background: #ffffff;
	border: 1px solid #e8decb;
	border-radius: 5px;
	padding: 32px 24px;
	position: relative;
	transition: transform 0.2s ease;
}

.tour-highlight-card:hover {
	transform: translateY(-3px);
	border-color: #8c6239;
}

.highlight-media {
	margin: -32px -24px 20px -24px;
	border-radius: 5px 5px 0 0;
	overflow: hidden;
	height: 160px;
	background: #24140b;
}

.highlight-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

.tour-highlight-card:hover .highlight-thumb {
	transform: scale(1.05);
}

.highlight-step {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.2rem;
	font-weight: 700;
	color: #d4af37;
	display: block;
	margin-bottom: 12px;
	line-height: 1;
}

.highlight-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.25rem;
	font-weight: 600;
	color: #2b160c;
	margin: 0 0 10px;
}

.highlight-desc {
	font-size: 0.9rem;
	line-height: 1.6;
	color: #5c473c;
	margin: 0;
}

/* Tour Karkhana Destination */
.tour-karkhana-destination {
	border-radius: 6px;
	overflow: hidden;
}

.destination-grid {
	display: grid;
	grid-template-columns: 55% 45%;
	gap: 52px;
	align-items: center;
	padding: 60px 0;
}

.destination-media {
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 12px 35px rgba(0, 0, 0, 0.4);
}

.destination-img {
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 1;
	object-fit: cover;
	display: block;
}

.destination-label {
	display: block;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #d4af37;
	margin-bottom: 12px;
}

.destination-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.4rem;
	font-weight: 500;
	color: #ffffff;
	margin: 0 0 16px;
}

.destination-text {
	font-size: 1.05rem;
	line-height: 1.75;
	color: #d4c4b8;
	margin: 0 0 24px;
}

.destination-details p {
	font-size: 0.92rem;
	line-height: 1.6;
	color: #e0d4c8;
	margin: 0 0 8px;
}

/* --------------------------------------------------------------------------
   Responsive Rules for Phase 14
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1279px) {
	.workshops-title,
	.tours-title {
		font-size: 2.6rem;
	}

	.tour-highlights-grid,
	.workshop-features-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}
}

@media screen and (max-width: 1023px) {
	.workshops-header-grid,
	.tours-header-grid {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.destination-grid {
		grid-template-columns: 1fr;
		gap: 36px;
	}
}

@media screen and (max-width: 767px) {
	.workshops-title,
	.tours-title {
		font-size: 2.2rem;
	}

	.workshop-notification-card {
		padding: 36px 20px;
	}

	.workshop-notification-heading {
		font-size: 1.6rem;
	}

	.form-fields-wrap {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.teaser-card {
		padding: 40px 20px;
	}

	.teaser-title {
		font-size: 1.8rem;
	}

	.tour-status-card {
		padding: 30px 20px;
	}

	.tour-status-heading {
		font-size: 1.5rem;
	}

	.destination-title {
		font-size: 1.9rem;
	}

	.contact-links-row {
		flex-direction: column;
	}

	.contact-pill {
		width: 100%;
		justify-content: center;
	}
}

@media screen and (max-width: 480px) {
	.tour-highlights-grid,
	.workshop-features-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

/* ==========================================================================
   GLOBAL SCROLL REVEAL ANIMATIONS (MANAM CHOCOLATE THEME)
   ========================================================================== */

/* Progressive Enhancement: Initial hidden states apply ONLY when JS is active and ready */
html.has-reveal-ready [data-reveal]:not(.is-revealed) {
	opacity: 0;
	pointer-events: none;
	will-change: opacity, transform;
}

html.has-reveal-ready [data-reveal="up"]:not(.is-revealed) {
	transform: translateY(40px);
}

html.has-reveal-ready [data-reveal="left"]:not(.is-revealed) {
	transform: translateX(-40px);
}

html.has-reveal-ready [data-reveal="right"]:not(.is-revealed) {
	transform: translateX(40px);
}

html.has-reveal-ready [data-reveal="scale"]:not(.is-revealed) {
	transform: scale(1.08);
}

html.has-reveal-ready [data-reveal="fade"]:not(.is-revealed) {
	transform: none;
}

/* Base transition for reveal */
[data-reveal] {
	transition: opacity 0.6s cubic-bezier(0.25, 1, 0.5, 1),
	            transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

/* Revealed state */
[data-reveal].is-revealed {
	opacity: 1 !important;
	transform: none !important;
	pointer-events: auto !important;
}

/* Mobile responsiveness: reduced travel distance to prevent overflow / awkwardness */
@media (max-width: 767px) {
	html.has-reveal-ready [data-reveal="up"]:not(.is-revealed) {
		transform: translateY(24px);
	}
	html.has-reveal-ready [data-reveal="left"]:not(.is-revealed) {
		transform: translateX(-20px);
	}
	html.has-reveal-ready [data-reveal="right"]:not(.is-revealed) {
		transform: translateX(20px);
	}
	html.has-reveal-ready [data-reveal="scale"]:not(.is-revealed) {
		transform: scale(1.04);
	}
}

/* Respect user's reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
	html.has-reveal-ready [data-reveal]:not(.is-revealed),
	[data-reveal],
	[data-reveal].is-revealed {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* ==========================================================================
   OUR CRAFT VIDEO LOOPS
   ========================================================================== */

.craft-video-container {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 480px;
	overflow: hidden;
	background-color: #1a120f;
}

.craft-stage-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	z-index: 2;
	opacity: 0;
	transition: opacity 0.4s ease;
}

.craft-stage-video.is-playing {
	opacity: 1;
}

.craft-stage-poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	z-index: 1;
}

@media (max-width: 999px) {
	.craft-video-container {
		min-height: 340px;
		aspect-ratio: 4 / 3;
	}
}

@media (max-width: 767px) {
	.craft-video-container {
		min-height: 260px;
		aspect-ratio: 1 / 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.craft-stage-video {
		display: none !important;
	}
	.craft-stage-poster {
		opacity: 1 !important;
	}
}

/* ==========================================================================
   EXPERIENCE HUB PAGE STYLES (STAGE 4)
   ========================================================================== */

.experience-page-main {
	background-color: #faf7f2;
	color: #382417;
	padding-bottom: 90px;
}

.experience-hub-header {
	padding: 20px 0 52px;
	text-align: center;
}

.experience-hub-header .experience-eyebrow {
	display: block;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #8c6239;
	margin-bottom: 12px;
}

.experience-hub-header .experience-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.85rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 auto 16px;
	max-width: 820px;
	letter-spacing: 0.02em;
	line-height: 1.2;
}

.experience-hub-header .experience-subtitle {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #5c473c;
	max-width: 740px;
	margin: 0 auto;
}

.experience-cards-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 36px;
	margin-bottom: 72px;
}

.experience-card {
	background: #ffffff;
	border: 1px solid #e8decb;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 8px 25px rgba(43, 22, 12, 0.06);
	display: flex;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
	text-decoration: none;
	color: inherit;
}

.experience-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 35px rgba(43, 22, 12, 0.12);
	border-color: #8c6239;
}

.experience-card-media {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #24140b;
}

.experience-card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.45s ease;
}

.experience-card:hover .experience-card-img {
	transform: scale(1.04);
}

.experience-card-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	background: rgba(43, 22, 12, 0.9);
	color: #f4ecdf;
	padding: 5px 14px;
	border-radius: 3px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	backdrop-filter: blur(4px);
}

.experience-card-body {
	padding: 28px 26px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.experience-card-venue {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.82rem;
	color: #8c6239;
	font-weight: 600;
	margin-bottom: 8px;
}

.experience-card-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.6rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 10px;
	line-height: 1.25;
}

.experience-card-desc {
	font-size: 0.94rem;
	line-height: 1.65;
	color: #5c473c;
	margin: 0 0 20px;
	flex-grow: 1;
}

.experience-card-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 0.86rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #2b160c;
	margin-top: auto;
}

.experience-card-cta .cta-arrow {
	transition: transform 0.2s ease;
}

.experience-card:hover .experience-card-cta .cta-arrow {
	transform: translateX(4px);
}

@media screen and (max-width: 1023px) {
	.experience-cards-grid {
		grid-template-columns: 1fr;
		gap: 28px;
	}
	.experience-hub-header .experience-title {
		font-size: 2.3rem;
	}
}

@media screen and (max-width: 767px) {
	.experience-hub-header .experience-title {
		font-size: 1.95rem;
	}
	.experience-card-body {
		padding: 20px 18px;
	}
	.experience-card-title {
		font-size: 1.35rem;
	}
}

/* ==========================================================================
   STAGE 5: REMAINING PAGES & FUNCTIONALITY STYLES
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Single Product: Gift Card Denominations & Recipient Fields
   -------------------------------------------------------------------------- */
.gift-card-denominations-section {
	margin: 22px 0 18px;
	padding-top: 16px;
	border-top: 1px solid #e5e5e5;
}

.gift-card-field-label {
	display: block;
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: #282828;
	margin-bottom: 10px;
	text-transform: uppercase;
}

.gift-card-denominations-group {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.gift-card-denom-btn {
	background-color: #ffffff;
	border: 1px solid #282828;
	color: #282828;
	padding: 10px 22px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
	border-radius: 0px;
	cursor: pointer;
	transition: all 0.2s ease;
	font-family: var(--mc-font-sans, "FS Meridian", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
}

.gift-card-denom-btn:hover {
	background-color: #f5f5f5;
}

.gift-card-denom-btn.is-active {
	background-color: #000000;
	color: #ffffff;
	border-color: #000000;
}

.gift-card-recipient-fields {
	margin: 20px 0 24px;
	padding: 20px;
	background-color: #fcfcfc;
	border: 1px solid #e5e5e5;
	border-radius: 0px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.gift-card-label {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: #282828;
	margin-bottom: 6px;
	letter-spacing: 0.02em;
}

.gift-card-recipient-fields .form-field-input {
	width: 100%;
	padding: 10px 14px;
	font-size: 14px;
	border: 1px solid #d0d0d0;
	border-radius: 0px;
	background-color: #ffffff;
	color: #282828;
	font-family: inherit;
	transition: border-color 0.2s ease;
}

.gift-card-recipient-fields .form-field-input:focus {
	outline: none;
	border-color: #000000;
}

.btn-add-to-cart--full {
	width: 100% !important;
	justify-content: center;
	padding: 14px 28px !important;
	font-size: 13px !important;
	letter-spacing: 2px !important;
}

.gift-card-terms-section {
	margin-top: 50px;
	padding: 48px 0;
	background-color: #fafafa;
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
}

.gift-card-terms-box {
	max-width: 860px;
	margin: 0 auto;
	padding: 36px 40px;
	background-color: #ffffff;
	border: 1px solid #e5dad0;
	border-radius: 6px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.03);
}

.gift-card-terms-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.7rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 20px;
	padding-bottom: 14px;
	border-bottom: 1px solid #ebdcd0;
}

.gift-card-terms-list {
	padding-left: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.gift-card-terms-list li strong {
	display: block;
	font-size: 0.94rem;
	color: #2b160c;
	margin-bottom: 4px;
}

.gift-card-terms-list li p {
	font-size: 0.9rem;
	line-height: 1.65;
	color: #5c473c;
	margin: 0;
}

/* --------------------------------------------------------------------------
   2. Store Locator Page
   -------------------------------------------------------------------------- */
.store-locator-main {
	background-color: #fbf9f6;
	min-height: 80vh;
	padding-bottom: 90px;
}

.store-locator-header {
	padding: 40px 0 35px;
}

.store-eyebrow {
	display: inline-block;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #8c6239;
	margin-bottom: 10px;
}

.store-main-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.8rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 16px;
	letter-spacing: -0.01em;
}

.store-subtitle {
	max-width: 680px;
	margin: 0 auto 30px;
	font-size: 1rem;
	line-height: 1.65;
	color: #5c473c;
}

.store-filter-tabs {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background-color: #ebdcd0;
	padding: 5px;
	border-radius: 35px;
}

.store-tab {
	padding: 9px 24px;
	border: none;
	background: transparent;
	border-radius: 30px;
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: #4a3b32;
	cursor: pointer;
	transition: all 0.25s ease;
	font-family: inherit;
}

.store-tab:hover {
	color: #2b160c;
}

.store-tab.is-active {
	background-color: #2b160c;
	color: #ffffff;
	box-shadow: 0 2px 8px rgba(43, 22, 12, 0.2);
}

.store-locator-listing {
	padding-top: 10px;
}

.store-cards-list {
	display: flex;
	flex-direction: column;
	gap: 40px;
	max-width: 1140px;
	margin: 0 auto;
}

.store-item-card {
	background-color: #ffffff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 6px 24px rgba(40, 25, 18, 0.06);
	border: 1px solid #ebdcd0;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.store-item-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 36px rgba(40, 25, 18, 0.1);
}

.store-item-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 380px;
}

.store-item-media {
	position: relative;
	height: 100%;
	min-height: 340px;
	background-color: #2b160c;
}

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

.store-city-badge {
	position: absolute;
	top: 18px;
	left: 18px;
	background: rgba(43, 22, 12, 0.88);
	color: #f4ecdf;
	padding: 5px 14px;
	border-radius: 3px;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	backdrop-filter: blur(4px);
}

.store-item-content {
	padding: 40px 45px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.store-item-card .store-type-label {
	font-size: 0.8rem;
	font-weight: 700;
	color: #8c6239;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-bottom: 8px;
}

.store-item-card .store-name {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.85rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 14px;
	line-height: 1.25;
}

.store-item-card .store-desc {
	font-size: 0.94rem;
	line-height: 1.7;
	color: #5c473c;
	margin: 0 0 24px;
}

.store-item-card .store-meta-box {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 28px;
	padding: 16px 0;
	border-top: 1px solid #ebdcd0;
	border-bottom: 1px solid #ebdcd0;
}

.store-item-card .store-meta-row {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 0.92rem;
	color: #4a3b32;
	line-height: 1.5;
}

.store-item-card .store-meta-row svg {
	flex-shrink: 0;
	margin-top: 3px;
	color: #8c6239;
}

.store-item-card .store-phone-link {
	color: #2b160c;
	text-decoration: none;
	font-weight: 600;
	transition: color 0.2s ease;
}

.store-item-card .store-phone-link:hover {
	color: #8c6239;
}

.store-actions-row {
	margin-top: auto;
}

.store-direction-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	font-size: 0.86rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   3. Corporate Gifting & For Professionals Pages
   -------------------------------------------------------------------------- */
.corporate-gifting-main,
.for-professionals-main {
	background-color: #fbf9f6;
	padding-bottom: 90px;
}

.corporate-hero-section {
	position: relative;
	width: 100%;
	overflow: hidden;
	background-color: #1a0e08;
}

.corporate-hero-picture,
.corporate-hero-img {
	width: 100%;
	height: auto;
	display: block;
	max-height: 520px;
	object-fit: cover;
}

.corporate-intro-section,
.professionals-intro-section {
	padding: 50px 0 30px;
}

.corporate-intro-header,
.professionals-intro-header {
	max-width: 860px;
	margin: 0 auto;
}

.corporate-eyebrow,
.professionals-eyebrow {
	display: inline-block;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #8c6239;
	margin-bottom: 12px;
}

.corporate-title,
.professionals-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.7rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 18px;
	line-height: 1.25;
}

.corporate-desc,
.professionals-desc {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #5c473c;
	margin: 0;
}

.corporate-form-card,
.professionals-card-box {
	max-width: 900px;
	margin: 20px auto 0;
	background-color: #ffffff;
	border-radius: 8px;
	padding: 45px 50px;
	box-shadow: 0 8px 30px rgba(40, 25, 18, 0.08);
	border: 1px solid #ebdcd0;
}

.corporate-card-header,
.card-inner-header {
	margin-bottom: 35px;
}

.card-heading,
.card-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.85rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 10px;
}

.card-subtitle,
.card-sub {
	font-size: 0.95rem;
	color: #6d584d;
	margin: 0;
}

.form-grid-2col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px 24px;
	margin-bottom: 22px;
}

.form-field-group {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.form-field-group.full-width {
	grid-column: 1 / -1;
}

.form-field-label {
	font-size: 0.84rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: #4a3b32;
}

.form-field-label .required {
	color: #b33927;
}

.form-field-input,
.form-field-select,
.form-field-textarea {
	width: 100%;
	padding: 11px 15px;
	font-size: 0.94rem;
	border: 1px solid #d4c8bd;
	border-radius: 4px;
	background-color: #ffffff;
	color: #2b160c;
	font-family: inherit;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-field-input:focus,
.form-field-select:focus,
.form-field-textarea:focus {
	outline: none;
	border-color: #2b160c;
	box-shadow: 0 0 0 2px rgba(43, 22, 12, 0.1);
}

.form-field-select {
	appearance: none;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b160c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 14px;
	padding-right: 36px;
}

.corporate-submit-btn,
.professionals-submit-btn,
.contact-submit-btn {
	padding: 14px 34px;
	font-size: 0.92rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.form-feedback-alert {
	padding: 14px 18px;
	border-radius: 4px;
	font-size: 0.92rem;
	line-height: 1.5;
	margin-top: 18px;
}

.form-feedback-alert.is-success {
	background-color: #eaf5ea;
	color: #205c24;
	border: 1px solid #b7e0b9;
}

.form-feedback-alert.is-error {
	background-color: #fceeee;
	color: #9e2a2b;
	border: 1px solid #f2bcbc;
}

/* --------------------------------------------------------------------------
   4. Customer Service Pages (Contact Us, Shipping, Refund, Track Order)
   -------------------------------------------------------------------------- */
.contact-page-main {
	background-color: #fbf9f6;
	padding-bottom: 90px;
}

.contact-section {
	padding: 30px 0 20px;
}

.contact-header {
	margin-bottom: 40px;
}

.contact-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.8rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0;
}

.contact-grid {
	display: grid;
	grid-template-columns: 1fr 1.25fr;
	gap: 40px;
	max-width: 1140px;
	margin: 0 auto;
}

.contact-card {
	background-color: #ffffff;
	border: 1px solid #ebdcd0;
	border-radius: 6px;
	padding: 28px 30px;
	margin-bottom: 22px;
	box-shadow: 0 4px 16px rgba(40, 25, 18, 0.04);
}

.contact-card-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.35rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 10px;
}

.contact-hours-note {
	font-size: 0.85rem;
	color: #8c6239;
	font-weight: 600;
	margin: 0 0 16px;
}

.contact-direct-links {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.contact-link-row {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 0.95rem;
	color: #2b160c;
	text-decoration: none;
	font-weight: 600;
	transition: color 0.2s ease;
}

.contact-link-row:hover {
	color: #8c6239;
}

.contact-address-text {
	font-size: 0.92rem;
	line-height: 1.65;
	color: #5c473c;
	margin: 0;
}

.contact-locations-list {
	padding-left: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin: 0;
}

.contact-locations-list li {
	font-size: 0.88rem;
	line-height: 1.5;
	color: #5c473c;
	padding-bottom: 14px;
	border-bottom: 1px dashed #ebdcd0;
}

.contact-locations-list li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.contact-locations-list li strong {
	color: #2b160c;
	font-size: 0.94rem;
}

.loc-phone {
	color: #8c6239;
	text-decoration: none;
	font-weight: 600;
}

.contact-form-wrapper {
	background-color: #ffffff;
	border: 1px solid #ebdcd0;
	border-radius: 6px;
	padding: 36px 40px;
	box-shadow: 0 4px 18px rgba(40, 25, 18, 0.04);
}

.form-box-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.85rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 8px;
}

.form-box-desc {
	font-size: 0.94rem;
	line-height: 1.6;
	color: #6d584d;
	margin: 0 0 28px;
}

.policy-page-main {
	background-color: #fbf9f6;
	padding-bottom: 90px;
}

.policy-section {
	padding: 30px 0 20px;
}

.policy-header {
	margin-bottom: 35px;
}

.policy-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.8rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0;
}

.policy-article {
	max-width: 820px;
	margin: 0 auto;
	background-color: #ffffff;
	border: 1px solid #ebdcd0;
	border-radius: 8px;
	padding: 45px 50px;
	box-shadow: 0 4px 18px rgba(40, 25, 18, 0.04);
	font-size: 0.98rem;
	line-height: 1.75;
	color: #4a3b32;
}

.policy-article h2 {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.5rem;
	font-weight: 500;
	color: #2b160c;
	margin: 34px 0 14px;
	padding-top: 14px;
	border-top: 1px solid #ebdcd0;
}

.policy-article h2:first-of-type {
	margin-top: 20px;
	border-top: none;
	padding-top: 0;
}

.policy-article p {
	margin: 0 0 16px;
}

.policy-lead {
	font-size: 1.05rem;
	color: #2b160c;
}

.policy-article ul,
.policy-article ol {
	margin: 0 0 18px;
	padding-left: 22px;
}

.policy-article li {
	margin-bottom: 8px;
}

.track-order-main {
	background-color: #fbf9f6;
	padding-bottom: 90px;
}

.track-order-section {
	padding: 40px 0 20px;
}

.track-container {
	max-width: 680px;
	margin: 0 auto;
}

.track-header {
	margin-bottom: 35px;
}

.track-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 2.7rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 10px;
}

.track-subtitle {
	font-size: 0.98rem;
	line-height: 1.6;
	color: #6d584d;
	margin: 0;
}

.track-card-box {
	background-color: #ffffff;
	border: 1px solid #ebdcd0;
	border-radius: 8px;
	padding: 40px 42px;
	box-shadow: 0 6px 24px rgba(40, 25, 18, 0.05);
}

.track-fields-grid {
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin-bottom: 24px;
}

.track-submit-wrap {
	display: flex;
	justify-content: center;
}

.track-submit-btn {
	width: 100%;
	padding: 14px 28px;
	font-size: 0.92rem;
	font-weight: 700;
	letter-spacing: 0.1em;
}

.track-status-box {
	margin-top: 30px;
	padding: 24px;
	background-color: #faf7f2;
	border: 1px solid #ebdcd0;
	border-radius: 6px;
}

.track-status-title {
	font-family: var(--mc-font-serif, "Meridien", Georgia, serif);
	font-size: 1.3rem;
	font-weight: 500;
	color: #2b160c;
	margin: 0 0 16px;
}

.track-status-row {
	display: flex;
	justify-content: space-between;
	padding: 8px 0;
	border-bottom: 1px solid #ebdcd0;
	font-size: 0.92rem;
}

.track-status-row:last-child {
	border-bottom: none;
}

.track-status-label {
	color: #6d584d;
}

.track-status-val {
	font-weight: 600;
	color: #2b160c;
}

.track-status-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 3px;
	background-color: #2b160c;
	color: #ffffff;
	font-size: 0.78rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.track-error-alert {
	margin-top: 24px;
	padding: 14px 18px;
	background-color: #fceeee;
	border: 1px solid #f2bcbc;
	border-radius: 4px;
	color: #9e2a2b;
	font-size: 0.92rem;
	line-height: 1.5;
}

.track-network-note {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid #ebdcd0;
	font-size: 0.85rem;
	line-height: 1.6;
	color: #7d6b60;
}

/* --------------------------------------------------------------------------
   5. Responsive Media Queries for Stage 5
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1023px) {
	.store-item-grid {
		grid-template-columns: 1fr;
	}
	.store-item-media {
		min-height: 280px;
	}
	.store-item-content {
		padding: 30px 28px;
	}
	.contact-grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}
	.corporate-form-card,
	.professionals-card-box {
		padding: 35px 30px;
	}
}

@media screen and (max-width: 767px) {
	.form-grid-2col {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.store-main-title,
	.contact-title,
	.policy-title,
	.track-title,
	.corporate-title,
	.professionals-title {
		font-size: 2.1rem;
	}
	.store-filter-tabs {
		width: 100%;
		justify-content: center;
		flex-wrap: wrap;
	}
	.store-tab {
		padding: 7px 16px;
		font-size: 0.82rem;
	}
	.policy-article,
	.track-card-box,
	.gift-card-terms-box {
		padding: 24px 20px;
	}
}