/* ==========================================================================
   Mirage Treasures — Design Tokens
   ========================================================================== */
:root {
	--mt-green-deep:   #2f4a23;
	--mt-green-mid:    #4a6b38;
	--mt-green-pale:   #eef2e6;
	--mt-brown:        #4a2c2a;
	--mt-sand:         #f7f3ea;
	--mt-sand-dark:    #ede5d2;
	--mt-gold:         #c9a961;
	--mt-ink:          #1c1b19;
	--mt-ink-soft:     #4b473f;
	--mt-white:        #ffffff;
	--mt-line:         #e2dccb;

	--mt-font-display: 'Marcellus', 'Georgia', serif;
	--mt-font-logo:    'Rye', serif;
	--mt-font-body:    'Jost', -apple-system, BlinkMacSystemFont, sans-serif;

	--mt-radius:       2px;
	--mt-container:    1240px;
	--mt-transition:   200ms ease;
}

/* ==========================================================================
   Reset & base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html, body { max-width: 100%; overflow-x: hidden; }
body {
	margin: 0;
	font-family: var(--mt-font-body);
	font-size: 16px;
	line-height: 1.65;
	color: var(--mt-ink);
	background: var(--mt-white);
	-webkit-font-smoothing: antialiased;
}
body.mt-drawer-is-open { overflow: hidden; }
img { max-width: 100%; height: auto; display: block; }
video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, h5 {
	font-family: var(--mt-font-display);
	font-weight: 400;
	line-height: 1.2;
	margin: 0 0 .5em;
	color: var(--mt-ink);
}
p { margin: 0 0 1em; }
button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; font-size: 1rem; }
.container {
	max-width: var(--mt-container);
	margin: 0 auto;
	padding: 0 24px;
}
.screen-reader-text {
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px,1px,1px,1px);
}
.skip-link {
	position: absolute;
	top: -100px; left: 0;
	background: var(--mt-ink);
	color: var(--mt-white);
	padding: 10px 18px;
	z-index: 10000;
}
.skip-link:focus { top: 0; }
:focus-visible {
	outline: 2px solid var(--mt-gold);
	outline-offset: 2px;
}

/* Buttons */
.mt-btn {
	display: inline-block;
	font-family: var(--mt-font-body);
	font-weight: 500;
	font-size: .95rem;
	letter-spacing: .02em;
	padding: 14px 32px;
	border-radius: var(--mt-radius);
	border: 1px solid transparent;
	transition: background var(--mt-transition), color var(--mt-transition), border-color var(--mt-transition);
}
.mt-btn-primary {
	background: var(--mt-green-deep);
	color: var(--mt-white);
}
.mt-btn-primary:hover { background: var(--mt-brown); }
.mt-btn-outline {
	background: transparent;
	color: var(--mt-ink);
	border-color: var(--mt-ink);
}
.mt-btn-outline:hover {
	background: var(--mt-ink);
	color: var(--mt-white);
}
.mt-btn-sm { padding: 9px 20px; font-size: .85rem; }
.mt-eyebrow {
	display: inline-block;
	font-family: var(--mt-font-body);
	font-size: .8rem;
	letter-spacing: .12em;
	color: var(--mt-green-mid);
	margin-bottom: .75em;
}

/* ==========================================================================
   Announcement bar + Header
   ========================================================================== */
.mt-announcement-bar {
	background: var(--mt-ink);
	color: var(--mt-sand);
	text-align: center;
	padding: 8px 16px;
}
.mt-announcement-bar p {
	margin: 0;
	font-size: .8rem;
	letter-spacing: .04em;
}
.site-header {
	position: sticky;
	top: 0;
	z-index: 500;
	background: var(--mt-white);
	border-bottom: 1px solid var(--mt-line);
}
.site-header-inner {
	display: flex;
	align-items: center;
	gap: 28px;
	padding: 16px 24px;
}
.site-branding { flex: 0 0 auto; }
.site-branding img, .site-branding .custom-logo { max-height: 56px; width: auto; }
.main-navigation { flex: 1 1 auto; }
.primary-menu {
	display: flex;
	gap: 30px;
	justify-content: center;
	flex-wrap: wrap;
}
.primary-menu > li > a {
	font-size: .92rem;
	letter-spacing: .03em;
	padding: 8px 2px;
	position: relative;
}
.primary-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 2px;
	height: 1px;
	background: var(--mt-green-deep);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--mt-transition);
}
.primary-menu > li > a:hover::after { transform: scaleX(1); }
.primary-menu li.menu-item-has-children { position: relative; }
.primary-menu .sub-menu {
	position: absolute;
	top: 100%; left: 0;
	background: var(--mt-white);
	border: 1px solid var(--mt-line);
	min-width: 200px;
	padding: 8px 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--mt-transition), transform var(--mt-transition);
	box-shadow: 0 12px 24px rgba(0,0,0,.06);
}
.primary-menu li.menu-item-has-children:hover .sub-menu {
	opacity: 1; visibility: visible; transform: translateY(0);
}
.primary-menu .sub-menu a { display: block; padding: 8px 18px; }
.primary-menu .sub-menu a:hover { background: var(--mt-sand); }
.mt-submenu-toggle { display: none; }

.site-header-actions {
	display: flex;
	align-items: center;
	gap: 18px;
	flex: 0 0 auto;
}
.site-header-actions button, .site-header-actions a {
	position: relative;
	display: inline-flex;
	color: var(--mt-ink);
	background: transparent;
	border: none;
	box-shadow: none;
	padding: 0;
}
.mt-cart-count {
	position: absolute;
	top: -8px; right: -10px;
	background: var(--mt-green-deep);
	color: var(--mt-white);
	font-size: .65rem;
	line-height: 1;
	min-width: 16px;
	height: 16px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 2px;
}
.mt-menu-toggle {
	display: none;
	flex-direction: column;
	gap: 5px;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 6px;
	appearance: none;
	-webkit-appearance: none;
}
.mt-menu-toggle:hover,
.mt-menu-toggle:focus,
.mt-menu-toggle:focus-visible,
.mt-menu-toggle:active {
	background: transparent !important;
	outline: none;
	box-shadow: none !important;
}
.mt-menu-toggle span {
	width: 22px; height: 2px;
	background: var(--mt-ink);
	display: block;
}

/* Drawer dark overlay behind the mobile menu */
.mt-drawer-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(28, 27, 25, .45);
	z-index: 998;
	opacity: 0;
	transition: opacity var(--mt-transition);
}

/* Drawer head: Menu / Categories tabs + close button */
.mt-drawer-head { display: none; }
.mt-drawer-tabs { display: flex; gap: 26px; }
.mt-drawer-tab {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 0 13px;
	font-family: var(--mt-font-body);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--mt-ink-soft) !important;
	position: relative;
	appearance: none;
	-webkit-appearance: none;
}
.mt-drawer-tab:hover,
.mt-drawer-tab:focus,
.mt-drawer-tab:active {
	background: transparent !important;
	color: var(--mt-ink-soft) !important;
	outline: none;
	box-shadow: none !important;
}
.mt-drawer-tab::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: 2px;
	background: var(--mt-green-deep);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--mt-transition);
}
.mt-drawer-tab.is-active { color: var(--mt-ink) !important; background: transparent !important; }
.mt-drawer-tab.is-active::after { transform: scaleX(1); }
.mt-drawer-close {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 6px;
	color: var(--mt-ink) !important;
	display: flex;
	align-items: center;
	justify-content: center;
	appearance: none;
	-webkit-appearance: none;
}
.mt-drawer-close svg { color: var(--mt-ink) !important; stroke: currentColor; }
.mt-drawer-close:hover,
.mt-drawer-close:focus,
.mt-drawer-close:active {
	background: transparent !important;
	color: var(--mt-green-deep) !important;
	outline: none;
	box-shadow: none !important;
}
.mt-drawer-panel { display: none; }
.mt-drawer-panel.is-active { display: block; }
.mt-search-panel {
	max-height: 0;
	overflow: hidden;
	background: var(--mt-sand);
	transition: max-height var(--mt-transition);
}
.mt-search-panel.is-open { max-height: 120px; }
.mt-search-panel .container { padding-top: 16px; padding-bottom: 16px; }
.mt-search-form { display: flex; gap: 10px; max-width: 480px; }
.mt-search-field {
	flex: 1;
	padding: 10px 14px;
	border: 1px solid var(--mt-line);
	background: var(--mt-white);
	border-radius: var(--mt-radius);
}
.mt-search-submit {
	padding: 10px 20px;
	background: var(--mt-green-deep);
	color: var(--mt-white);
	border: none;
	border-radius: var(--mt-radius);
}

/* ==========================================================================
   Hero
   ========================================================================== */
.mt-hero {
	position: relative;
	background: var(--mt-green-deep);
	background-size: cover;
	background-position: center;
	color: var(--mt-white);
	text-align: center;
	padding: 130px 24px;
	overflow: hidden;
}
.mt-hero .mt-eyebrow { color: var(--mt-gold); }
.mt-hero-inner {
	position: relative;
	z-index: 2;
	max-width: 680px;
	margin: 0 auto;
}
.mt-hero h1 {
	font-size: clamp(2.1rem, 4.2vw, 3.2rem);
	color: var(--mt-white);
	margin-bottom: .4em;
}
.mt-hero p {
	font-size: 1.1rem;
	color: rgba(255,255,255,.86);
	margin-bottom: 1.6em;
}
.mt-hero .mt-btn-primary {
	background: transparent;
	color: var(--mt-white);
	border: 1px solid var(--mt-white);
}
.mt-hero .mt-btn-primary:hover {
	background: var(--mt-white);
	color: var(--mt-ink);
}

/* Hero video background */
.mt-hero-video-wrap {
	position: absolute;
	inset: 0;
	z-index: 1;
	overflow: hidden;
}
.mt-hero-video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	transform: translate(-50%, -50%);
	object-fit: cover;
	display: none;
}
.mt-hero--video .mt-hero-video-desktop { display: block; }
.mt-hero-video-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(20,19,17,.35), rgba(20,19,17,.55));
}
@media (max-width: 780px) {
	.mt-hero--video .mt-hero-video-desktop { display: none; }
	.mt-hero--video .mt-hero-video-mobile { display: block; }
}

.mt-leaf-divider, .footer-leaf-divider {
	color: var(--mt-green-mid);
	line-height: 0;
}
.mt-leaf-divider svg, .footer-leaf-divider svg {
	width: 100%; height: 40px; display: block;
}
.footer-leaf-divider { color: var(--mt-gold); background: var(--mt-ink); padding-top: 6px; }

/* ==========================================================================
   Section shell
   ========================================================================== */
.mt-section { padding: 80px 0; }
.mt-section-title {
	text-align: center;
	font-size: 2rem;
	margin-bottom: .25em;
}
.mt-section-sub {
	text-align: center;
	color: var(--mt-ink-soft);
	margin-bottom: 2.5em;
}
.mt-section-cta { text-align: center; margin-top: 2.5em; }

/* Trust-strip marquee (below the hero video) */
.mt-marquee {
	background: var(--mt-sand);
	border-top: 1px solid var(--mt-line);
	border-bottom: 1px solid var(--mt-line);
	overflow: hidden;
	white-space: nowrap;
}
.mt-marquee-track {
	display: inline-flex;
	align-items: center;
	width: max-content;
	animation: mt-marquee-scroll 26s linear infinite;
}
.mt-marquee:hover .mt-marquee-track { animation-play-state: paused; }
.mt-marquee-item {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 28px;
	font-family: var(--mt-font-body);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--mt-ink-soft);
	border-right: 1px solid var(--mt-line);
	white-space: nowrap;
}
.mt-marquee-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	color: var(--mt-gold);
}
@keyframes mt-marquee-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.mt-marquee-track { animation: none; }
}
@media (max-width: 600px) {
	.mt-marquee-item { padding: 13px 20px; font-size: .72rem; }
}

/* Explore by Collection — round tiles, as a carousel */
.mt-circle-collections { background: var(--mt-white); }
.mt-carousel { position: relative; }
.mt-circle-grid {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	gap: 36px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	padding: 6px 44px 12px;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.mt-circle-grid::-webkit-scrollbar { display: none; }
.mt-circle-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	width: 160px;
	flex: 0 0 auto;
	text-align: center;
	scroll-snap-align: start;
}

/* Small, premium carousel arrows */
.mt-carousel-arrow {
	position: absolute;
	top: 76px;
	transform: translateY(-50%);
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--mt-white);
	border: 1px solid var(--mt-line);
	color: var(--mt-ink);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	cursor: pointer;
	z-index: 5;
	box-shadow: 0 4px 14px rgba(0,0,0,.08);
	transition: border-color var(--mt-transition), color var(--mt-transition), box-shadow var(--mt-transition);
}
.mt-carousel-arrow:hover { border-color: var(--mt-gold); color: var(--mt-gold); box-shadow: 0 6px 18px rgba(0,0,0,.12); }
.mt-carousel-arrow:active { transform: translateY(-50%) scale(.92); }
.mt-carousel-arrow--prev { left: 0; }
.mt-carousel-arrow--next { right: 0; }
.mt-carousel-arrow[disabled] { opacity: 0; visibility: hidden; pointer-events: none; }
.mt-circle-image {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	background-color: var(--mt-green-mid);
	border: 3px solid var(--mt-sand-dark);
	transition: transform var(--mt-transition), border-color var(--mt-transition);
}
.mt-circle-card:hover .mt-circle-image {
	transform: scale(1.05);
	border-color: var(--mt-gold);
}
.mt-circle-image.mt-category-image--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
}
.mt-circle-image .mt-tile-icon { width: 40%; max-width: 46px; }
.mt-circle-name {
	font-family: var(--mt-font-display);
	font-size: 1.02rem;
	color: var(--mt-ink);
}

/* Category tiles */
.mt-categories { background: var(--mt-sand); }
.mt-category-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.mt-category-card {
	position: relative;
	display: block;
	aspect-ratio: 3/4;
	overflow: hidden;
	border-radius: var(--mt-radius);
	background: var(--mt-green-pale);
}
.mt-category-image {
	position: absolute; inset: 0;
	background-size: cover;
	background-position: center;
	background-color: var(--mt-green-mid);
	transition: transform 400ms ease;
}
.mt-category-card:hover .mt-category-image { transform: scale(1.06); }
.mt-category-card::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(20,19,17,0) 40%, rgba(20,19,17,.65) 100%);
}
.mt-category-name {
	position: absolute; left: 18px; bottom: 16px; z-index: 2;
	color: var(--mt-white);
	font-family: var(--mt-font-display);
	font-size: 1.15rem;
}

/* Placeholder look for tiles that don't have a real photo assigned yet
   (no more flat, empty color blocks) */
.mt-category-image--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(150deg, var(--mt-green-deep), var(--mt-green-mid));
}
.mt-category-card:nth-child(2) .mt-category-image--placeholder { background: linear-gradient(150deg, var(--mt-brown), #6b4340); }
.mt-category-card:nth-child(3) .mt-category-image--placeholder { background: linear-gradient(150deg, var(--mt-green-mid), var(--mt-green-deep)); }
.mt-category-card:nth-child(4) .mt-category-image--placeholder { background: linear-gradient(150deg, #a9863f, var(--mt-gold)); }
.mt-tile-icon {
	width: 34%;
	max-width: 88px;
	color: rgba(255,255,255,.85);
}

/* Full-width promo banner — plain landscape image, same crop on every screen size */
.mt-full-banner {
	line-height: 0;
}
.mt-full-banner-link {
	display: block;
}
/* The banner artwork is a wide landscape image (≈1752×592). It is shown at
 * its own aspect ratio — width:100% + height:auto — so the whole artwork
 * (both models, the headline and the "Explore the Collection" link) stays
 * visible and nothing gets chopped off. That single rule already fits every
 * screen: on desktop it spans edge to edge, on a phone it simply scales
 * down to a shorter strip instead of being cropped. */
.mt-full-banner-img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	object-fit: contain;
	object-position: center;
	background: var(--mt-sand, #f3ece3);
}
/* On very wide desktops don't let the banner grow taller than the artwork
 * itself — keeps it a banner rather than a giant hero block. */
@media (min-width: 1800px) {
	.mt-full-banner-img {
		max-width: 1920px;
		margin: 0 auto;
	}
}

/* Shop by Collection */
.mt-collections { background: var(--mt-green-pale); }
.mt-collection-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.mt-collection-card { display: block; }
.mt-collection-image {
	position: relative;
	aspect-ratio: 4/3;
	border-radius: var(--mt-radius);
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-color: var(--mt-green-mid);
	margin-bottom: 14px;
}
.mt-collection-image.mt-category-image--placeholder {
	position: relative;
	aspect-ratio: 4/3;
	border-radius: var(--mt-radius);
	margin-bottom: 14px;
}
.mt-collection-name {
	display: block;
	font-family: var(--mt-font-display);
	font-size: 1.1rem;
	color: var(--mt-ink);
}
.mt-collection-count {
	display: block;
	font-size: .82rem;
	color: var(--mt-ink-soft);
	margin-top: 2px;
}

/* Story split */
.mt-story { background: var(--mt-white); }
.mt-story-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: center;
}
.mt-story h2 { font-size: 2rem; }
.mt-story p { color: var(--mt-ink-soft); }
.mt-story-image {
	aspect-ratio: 3/4;
	border-radius: var(--mt-radius);
	overflow: hidden;
	background: var(--mt-sand-dark);
}
.mt-story-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	display: block;
}

/* Follow Us — Instagram reels */
.mt-follow-section { background: var(--mt-sand); text-align: center; }
.mt-follow-section .mt-section-sub a { color: var(--mt-green-deep); text-decoration: underline; }
.mt-reel-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 14px;
	max-width: 760px;
	width: 100%;
	margin: 30px auto 0;
	box-sizing: border-box;
}
.mt-reel-card { display: block; min-width: 0; }
.mt-reel-thumb {
	position: relative;
	width: 100%;
	max-width: 100%;
	aspect-ratio: 9/16;
	border-radius: var(--mt-radius);
	background-size: cover;
	background-position: center;
	background-color: var(--mt-ink);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.mt-reel-thumb--placeholder {
	background-image: linear-gradient(150deg, var(--mt-green-deep), var(--mt-ink));
}
.mt-reel-play { opacity: .9; }
.mt-reel-card--video .mt-reel-thumb { background-color: var(--mt-ink); }
.mt-reel-video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.mt-reel-sound {
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: none;
	background: rgba(0,0,0,.45);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0;
}

/* Client Stories */
.mt-eyebrow-pill {
	display: inline-block;
	border: 1px solid var(--mt-gold);
	color: var(--mt-gold);
	font-size: .75rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 7px 16px;
	border-radius: 999px;
	margin-bottom: 1.2em;
}
.mt-client-stories { background: var(--mt-ink); }
.mt-client-stories-inner {
	display: grid;
	grid-template-columns: 0.8fr 1.6fr;
	gap: 50px;
	align-items: start;
}
.mt-client-stories-text { position: sticky; top: 100px; }
.mt-client-stories-heading {
	color: var(--mt-white);
	font-size: clamp(2rem, 3.4vw, 2.7rem);
	line-height: 1.2;
	margin: 0;
}
.mt-client-stories-heading span { color: var(--mt-gold); }
.mt-review-marquee {
	display: flex;
	flex-direction: column;
	gap: 20px;
	overflow: hidden;
}
.mt-review-track {
	position: relative;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.mt-review-row {
	display: flex;
	gap: 20px;
	width: max-content;
	will-change: transform;
}
.mt-review-row--left { animation: mt-marquee-left 32s linear infinite; }
.mt-review-row--right { animation: mt-marquee-right 32s linear infinite; }
.mt-review-track:hover .mt-review-row { animation-play-state: paused; }
@keyframes mt-marquee-left {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@keyframes mt-marquee-right {
	from { transform: translateX(-50%); }
	to   { transform: translateX(0); }
}
.mt-review-card {
	background: rgba(255,255,255,.05);
	border: 1px solid rgba(255,255,255,.1);
	border-radius: var(--mt-radius);
	padding: 24px;
	display: flex;
	flex-direction: column;
	width: 320px;
	flex: 0 0 auto;
}
.mt-review-quote-mark {
	font-family: var(--mt-font-display);
	color: var(--mt-gold);
	font-size: 2rem;
	line-height: 1;
	margin-bottom: 6px;
}
.mt-review-text {
	color: rgba(255,255,255,.9);
	font-size: .95rem;
	flex-grow: 1;
	margin-bottom: 20px;
}
.mt-review-footer { display: flex; align-items: center; gap: 12px; }
.mt-review-avatar {
	width: 34px; height: 34px;
	border-radius: 50%;
	background: var(--mt-gold);
	flex-shrink: 0;
}
.mt-review-meta { display: flex; flex-direction: column; line-height: 1.3; flex-grow: 1; }
.mt-review-meta strong { color: var(--mt-white); font-size: .88rem; }
.mt-review-meta span { color: rgba(255,255,255,.55); font-size: .78rem; }
.mt-review-rating { color: var(--mt-gold); font-size: .82rem; white-space: nowrap; }
.mt-review-source-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	margin-top: 3px;
	color: rgba(255,255,255,.6);
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.14);
	transition: color var(--mt-transition), background var(--mt-transition), border-color var(--mt-transition);
}
.mt-review-source-icon svg { display: block; }
.mt-review-source-icon:hover,
.mt-review-source-icon:focus-visible {
	color: var(--mt-white);
	border-color: var(--mt-gold);
	background: rgba(201,169,97,.18);
}
.mt-review-source-icon--instagram:hover { color: #e1306c; border-color: #e1306c; }
.mt-review-source-icon--facebook:hover { color: #1877f2; border-color: #1877f2; }
.mt-review-source-icon--tiktok:hover { color: var(--mt-white); border-color: var(--mt-white); }

/* Newsletter */
.mt-newsletter-section {
	background: var(--mt-ink);
	color: var(--mt-white);
	text-align: center;
}
.mt-newsletter-section h2 { color: var(--mt-white); }
.mt-newsletter-inner { max-width: 560px; margin: 0 auto; }
.mt-newsletter-form { display: flex; gap: 10px; }
.mt-newsletter-form-large input { padding: 14px 16px; }
.mt-newsletter-form input {
	flex: 1;
	padding: 12px 14px;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	background: var(--mt-white);
	color: var(--mt-ink);
}
.mt-newsletter-form button {
	padding: 12px 26px;
	background: var(--mt-gold);
	color: var(--mt-ink);
	border: none;
	border-radius: var(--mt-radius);
	font-weight: 500;
}

/* ==========================================================================
   WooCommerce — Shop, Archive & Single Product
   ========================================================================== */
.shop-main { padding: 0 0 80px; }

/* The shop is always full-width — never show a leftover widget rail
   (Pages / Archives / Categories / Search) next to or below the products. */
#secondary,
.widget-area,
.woocommerce-widget-area,
aside.sidebar,
.shop-sidebar,
.sidebar-shop {
	display: none !important;
}
/* Full-bleed black banner behind the breadcrumb + title — a single
   continuous wrapper (.mt-shop-banner) so there is no seam / gap
   between the breadcrumb and the "Shop" heading. Same treatment on
   the plain Shop page and on every category page, so "Shop" and
   "Shop All Bracelets" etc. always look identical, edge-to-edge. */
.mt-shop-banner {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: var(--mt-ink);
	text-align: center;
}
.woocommerce-breadcrumb,
.woocommerce-products-header {
	width: auto;
	margin-left: 0;
	margin-right: 0;
	background: none;
	text-align: center;
}
.woocommerce-breadcrumb {
	margin-bottom: 0;
	padding: 56px 40px 6px 24px;
	font-size: .75rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--mt-white);
}
.woocommerce-breadcrumb a { color: var(--mt-white); opacity: .75; }
.woocommerce-breadcrumb a:hover { opacity: 1; }

.page-title, .woocommerce-products-header__title {
	font-size: 2rem;
	margin-bottom: .3em;
	text-align: center;
	color: var(--mt-white);
}
.woocommerce-products-header {
	padding: 6px 24px 40px;
	margin-bottom: 40px;
	border-bottom: none;
}

.woocommerce-notices-wrapper { margin-bottom: 20px; }

/* Toolbar row: "Showing X of Y results" + sort dropdown, grouped inline
   instead of stacking as two separate lines. */
.mt-shop-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 0;
	margin-bottom: 32px;
	background: none;
	border: none;
}
.mt-shop-toolbar .woocommerce-ordering {
	margin: 0;
}
.woocommerce-ordering select {
	padding: 8px 12px;
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	background: var(--mt-white);
	color: var(--mt-ink);
}

/* "Filter" button — replaces the plain result-count text, opens a
   quick category list. Native <details>/<summary>, no JS needed. */
.mt-filter { position: relative; }
.mt-filter-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	background: var(--mt-white);
	font-size: .85rem;
	color: var(--mt-ink);
	cursor: pointer;
	list-style: none;
	user-select: none;
	transition: background var(--mt-transition), color var(--mt-transition);
}
.mt-filter-btn::-webkit-details-marker,
.mt-filter-btn::marker { display: none; content: ''; }
.mt-filter-btn:hover,
.mt-filter[open] .mt-filter-btn {
	background: var(--mt-ink);
	border-color: var(--mt-ink);
	color: var(--mt-white);
}
.mt-filter-panel {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	z-index: 20;
	display: flex;
	flex-direction: column;
	min-width: 200px;
	max-height: 320px;
	overflow-y: auto;
	background: var(--mt-white);
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	box-shadow: 0 8px 24px rgba(0,0,0,.1);
	padding: 8px 0;
}
.mt-filter-panel a {
	padding: 9px 16px;
	font-size: .85rem;
	color: var(--mt-ink);
}
.mt-filter-panel a:hover { background: var(--mt-ink); color: var(--mt-white); }

ul.products {
	display: grid !important;
	/* auto-fit (not auto-fill) so leftover tracks collapse instead of
	   sitting empty — e.g. 3 products fill the row edge-to-edge as 3
	   equal columns instead of leaving a hollow 4th slot. Still caps
	   at 4 columns per row once there are enough products, since the
	   260px minimum won't allow a 5th column to fit the container. */
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
	width: 100% !important;
	gap: 28px;
	margin: 0 0 20px !important;
	padding: 0 !important;
	float: none !important;
}
/* WooCommerce's own stylesheet adds a "clearfix" ::before/::after
   (content:" "; display:table;) to ul.products — leftover from the old
   float-based grid. Once the list is display:grid, those generated
   pseudo-elements become real (empty) grid cells and claim the first and
   last slots, which is exactly what pushed every real product over by one
   and left a blank tile at the start. Switching them off removes the
   phantom cells so products fill the grid from the very first slot. */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
ul.products::before,
ul.products::after {
	content: none !important;
	display: none !important;
}
ul.products li.product {
	list-style: none;
	background: var(--mt-white);
	border-radius: var(--mt-radius);
	position: relative;
	width: 100% !important;
	min-width: 0;
	float: none !important;
	margin: 0 !important;
	transition: transform var(--mt-transition);
	/* Flex column + margin-top:auto on the action row (below) means the
	   Quick View / Add to Cart buttons always sit flush at the bottom of the
	   card and line up across a row, no matter how many lines the title
	   above wraps to. */
	display: flex !important;
	flex-direction: column;
	height: 100%;
}
ul.products li.product:hover { transform: translateY(-4px); }
ul.products li.product a.woocommerce-LoopProduct-link { display: block; }
ul.products li.product img {
	width: 100%;
	aspect-ratio: 1/1.15;
	object-fit: cover;
	border-radius: var(--mt-radius);
	background: var(--mt-sand);
}
ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--mt-font-body);
	font-size: .9rem;
	font-weight: 500;
	color: var(--mt-ink);
	margin: 14px 0 4px;
}
ul.products li.product .price {
	font-family: var(--mt-font-body);
	color: var(--mt-green-deep);
	font-weight: 600;
	font-size: .95rem;
}
ul.products li.product .price del { color: var(--mt-ink-soft); opacity: .6; margin-right: 6px; }
ul.products li.product .price ins { text-decoration: none; }
ul.products li.product .star-rating { font-size: .75rem; margin-bottom: 4px; }
/* Hover action row: Quick View + Add to Cart side by side. */
ul.products li.product .mt-card-actions {
	display: flex;
	gap: 8px;
	margin-top: auto;
	padding-top: 12px;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity var(--mt-transition), transform var(--mt-transition);
}
ul.products li.product:hover .mt-card-actions,
ul.products li.product .mt-card-actions:focus-within { opacity: 1; transform: translateY(0); }

ul.products li.product .mt-card-actions .mt-quick-view-btn {
	flex: 1 1 50%;
	padding: 10px 6px;
	text-align: center;
	background: transparent;
	color: var(--mt-ink);
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	font-size: .78rem !important;
	font-family: var(--mt-font-body) !important;
	font-weight: 500 !important;
	letter-spacing: .02em !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	cursor: pointer;
	transition: background var(--mt-transition), color var(--mt-transition);
}
ul.products li.product .mt-card-actions .mt-quick-view-btn:hover,
ul.products li.product .mt-card-actions .mt-quick-view-btn:focus-visible {
	background: var(--mt-ink);
	color: var(--mt-white);
}

ul.products li.product .mt-card-actions .button {
	flex: 1 1 50%;
	display: block;
	margin-top: 0;
	padding: 10px 6px;
	text-align: center;
	background: var(--mt-ink);
	color: var(--mt-white);
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	font-family: var(--mt-font-body) !important;
	font-size: .78rem !important;
	font-weight: 500 !important;
	letter-spacing: .02em !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	opacity: 1;
	transform: none;
	transition: background var(--mt-transition);
}
ul.products li.product .mt-card-actions .button:hover { background: var(--mt-green-deep); }
ul.products li.product .mt-card-actions .button.added_to_cart { opacity: 1; }
ul.products li.product .mt-card-actions .button.loading { opacity: .7; }

/* ==========================================================================
   Quick View modal
   ========================================================================== */
.mt-quickview-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
}
.mt-quickview-modal.is-active { display: flex; }
body.mt-quickview-open { overflow: hidden; }

.mt-quickview-overlay {
	position: absolute;
	inset: 0;
	background: rgba(20, 19, 17, .55);
}

.mt-quickview-dialog {
	position: relative;
	z-index: 1;
	background: var(--mt-white);
	width: 100%;
	max-width: 860px;
	max-height: 88vh;
	overflow-y: auto;
	border-radius: var(--mt-radius);
	padding: 40px;
}

.mt-quickview-close {
	position: absolute;
	top: 14px;
	right: 16px;
	width: 34px;
	height: 34px;
	border: none;
	background: transparent;
	font-size: 1.6rem;
	line-height: 1;
	color: var(--mt-ink-soft);
	cursor: pointer;
}
.mt-quickview-close:hover { color: var(--mt-ink); }

.mt-quickview-loading,
.mt-quickview-error {
	padding: 60px 0;
	text-align: center;
	color: var(--mt-ink-soft);
}

.mt-quickview-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 36px;
	align-items: start;
}
.mt-quickview-image img {
	width: 100%;
	aspect-ratio: 1/1;
	object-fit: cover;
	border-radius: var(--mt-radius);
	background: var(--mt-sand);
}
.mt-quickview-title {
	font-family: var(--mt-font-display);
	font-size: 1.15rem;
	line-height: 1.35;
	margin: 0 0 10px;
	color: var(--mt-ink);
}
.mt-quickview-price {
	font-family: var(--mt-font-body);
	font-weight: 600;
	color: var(--mt-green-deep);
	font-size: 1.1rem;
	margin-bottom: 16px;
}
.mt-quickview-price del { color: var(--mt-ink-soft); opacity: .6; margin-right: 8px; font-weight: 400; }
.mt-quickview-price ins { text-decoration: none; }
.mt-quickview-desc {
	color: var(--mt-ink-soft);
	font-size: .92rem;
	line-height: 1.6;
	margin-bottom: 20px;
}
.mt-quickview-cart-form .variations { margin-bottom: 16px; }
.mt-quickview-cart-form table.variations td,
.mt-quickview-cart-form table.variations th { padding: 0 0 8px; }
.mt-quickview-cart-form select {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	background: var(--mt-white);
	font-family: var(--mt-font-body);
}
.mt-quickview-cart-form .quantity {
	display: inline-block;
	margin-right: 10px;
}
.mt-quickview-cart-form .quantity input {
	width: 64px;
	padding: 10px;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	text-align: center;
}
.mt-quickview-cart-form button[type="submit"],
.mt-quickview-cart-form .single_add_to_cart_button {
	display: inline-block;
	padding: 12px 28px;
	background: var(--mt-ink);
	color: var(--mt-white);
	border: none;
	border-radius: var(--mt-radius);
	font-size: .85rem;
	letter-spacing: .03em;
	cursor: pointer;
	transition: background var(--mt-transition);
}
.mt-quickview-cart-form button[type="submit"]:hover,
.mt-quickview-cart-form .single_add_to_cart_button:hover { background: var(--mt-green-deep); }
.mt-quickview-link {
	display: inline-block;
	margin-top: 16px;
	font-size: .82rem;
	color: var(--mt-ink);
	text-decoration: underline;
}
.mt-quickview-link:hover { color: var(--mt-green-deep); }

@media (max-width: 680px) {
	.mt-quickview-dialog { padding: 24px 20px; max-height: 92vh; }
	.mt-quickview-inner { grid-template-columns: 1fr; gap: 20px; }
	.mt-quickview-title { font-size: 1.05rem; }
}

.onsale,
span.onsale {
	position: absolute !important;
	top: 10px !important;
	left: 10px !important;
	right: auto !important;
	bottom: auto !important;
	z-index: 2;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	line-height: normal !important;
	background: var(--mt-brown) !important;
	color: var(--mt-white) !important;
	font-size: .68rem !important;
	letter-spacing: .04em;
	padding: 5px 10px !important;
	margin: 0 !important;
	border-radius: var(--mt-radius) !important;
	text-transform: uppercase;
	text-align: left !important;
	white-space: nowrap;
	font-family: var(--mt-font-body) !important;
}

/* Pagination — shared look for the shop (.woocommerce-pagination), the
   blog (.navigation.pagination) and WooCommerce block pagination.
   !important is used throughout because plugin/page-builder stylesheets
   that load after ours otherwise keep the numbers stacked as separate
   block-level lines instead of one inline row. */
.woocommerce-pagination,
.navigation.pagination,
.wc-block-pagination {
	margin-top: 40px !important;
	padding-top: 0 !important;
	border-top: none;
	width: 100%;
}
.woocommerce-pagination ul.page-numbers,
.navigation.pagination .nav-links,
.wc-block-pagination-page-numbers {
	display: flex !important;
	flex-flow: row wrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100%;
	border: none !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	overflow: visible !important;
}
.woocommerce-pagination ul.page-numbers > li,
.navigation.pagination .nav-links > * {
	display: flex !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
}
.woocommerce-pagination .page-numbers,
.navigation.pagination .page-numbers,
.wc-block-pagination-page-numbers li {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 52px;
	height: 52px;
	padding: 0 16px;
	margin: 0 2px;
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	background: var(--mt-ink) !important;
	font-size: 1rem;
	font-weight: 500;
	color: var(--mt-white) !important;
	white-space: nowrap;
	transition: background var(--mt-transition), opacity var(--mt-transition);
}
.woocommerce-pagination a.page-numbers:hover,
.navigation.pagination a.page-numbers:hover {
	background: var(--mt-ink) !important;
	color: var(--mt-white) !important;
	opacity: .8;
}
.woocommerce-pagination .page-numbers.current,
.navigation.pagination .page-numbers.current {
	background: var(--mt-ink) !important;
	color: var(--mt-white) !important;
	border-color: var(--mt-ink);
	box-shadow: 0 0 0 3px var(--mt-line);
}
.woocommerce-pagination .page-numbers.dots,
.navigation.pagination .page-numbers.dots {
	border: none;
	background: none !important;
	color: var(--mt-ink) !important;
	width: auto;
	min-width: 0;
}
/* Previous / Next render as wider labelled pills either side of the numbers */
.woocommerce-pagination .page-numbers.prev,
.woocommerce-pagination .page-numbers.next,
.navigation.pagination .page-numbers.prev,
.navigation.pagination .page-numbers.next {
	width: auto;
	min-width: 0;
	padding: 0 22px;
	border-radius: 999px;
	font-weight: 500;
	letter-spacing: .01em;
	border-color: var(--mt-ink);
	color: var(--mt-white) !important;
	background: var(--mt-ink) !important;
}
.woocommerce-pagination .page-numbers.prev:hover,
.woocommerce-pagination .page-numbers.next:hover,
.navigation.pagination .page-numbers.prev:hover,
.navigation.pagination .page-numbers.next:hover {
	background: var(--mt-ink) !important;
	color: var(--mt-white) !important;
	opacity: .8;
}
.woocommerce-pagination .page-numbers.next,
.navigation.pagination .page-numbers.next {
	order: 2;
}
@media (max-width: 480px) {
	.woocommerce-pagination ul.page-numbers,
	.navigation.pagination .nav-links {
		gap: 6px !important;
	}
	.woocommerce-pagination .page-numbers,
	.navigation.pagination .page-numbers {
		min-width: 34px;
		height: 34px;
		font-size: .8rem;
	}
	.woocommerce-pagination .page-numbers.prev,
	.woocommerce-pagination .page-numbers.next,
	.navigation.pagination .page-numbers.prev,
	.navigation.pagination .page-numbers.next {
		padding: 0 12px;
	}
	.woocommerce-pagination .page-numbers.prev span,
	.woocommerce-pagination .page-numbers.next span,
	.navigation.pagination .page-numbers.prev span,
	.navigation.pagination .page-numbers.next span {
		display: none; /* icon-only Prev/Next on very small screens */
	}
}

/* NOTE: single-product rules now live in the "Single Product Page —
 * monochrome" block further down (search for ".single-product div.product"),
 * which is the one actually in effect. Kept only the shared/global
 * woocommerce rules here. */
.related.products h2 { font-size: 1.6rem; margin: 60px 0 24px; text-align: left; }

/* Cart & Checkout tables */
.woocommerce table.shop_table {
	border-collapse: collapse;
	width: 100%;
	border: 1px solid var(--mt-line);
}
.woocommerce table.shop_table th, .woocommerce table.shop_table td {
	padding: 14px;
	border-bottom: 1px solid var(--mt-line);
	text-align: left;
}
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
	background: var(--mt-green-deep);
	color: var(--mt-white);
	border-radius: var(--mt-radius);
	padding: 12px 26px;
	border: none;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover {
	background: var(--mt-brown);
	color: var(--mt-white);
}
.woocommerce-checkout input.input-text, .woocommerce-checkout select, .woocommerce-checkout textarea,
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
	padding: 10px 12px;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	width: 100%;
}
.star-rating { color: var(--mt-gold); }

/* ==========================================================================
   Checkout — two-column layout (form left, sticky order summary right)
   ========================================================================== */
.woocommerce-checkout .shop-main > .container,
.woocommerce-checkout .mt-page-container,
.woocommerce-cart .mt-page-container { max-width: 1180px; }
.woocommerce-checkout .mt-page-content,
.woocommerce-cart .mt-page-content { font-size: 1rem; color: var(--mt-ink); }
.woocommerce-checkout .mt-page-header { text-align: left; margin-bottom: 8px; }
.woocommerce-checkout .mt-page-title { font-size: 1.8rem; }
.woocommerce-checkout .woocommerce-notices-wrapper { margin-bottom: 18px; }

.mt-checkout-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
	gap: 56px;
	align-items: start;
	padding: 10px 0 70px;
}
.mt-checkout-main { min-width: 0; }
.mt-checkout-aside { min-width: 0; }
.mt-checkout-summary {
	position: sticky;
	top: 24px;
	background: var(--mt-sand, #f6f1ea);
	border: 1px solid var(--mt-line, #e3ded6);
	border-radius: var(--mt-radius);
	padding: 24px 22px;
}
.mt-checkout-summary #order_review_heading {
	font-size: 1.05rem;
	margin: 0 0 18px;
	letter-spacing: .02em;
}

/* --- Section headings inside the form --- */
.mt-co-heading {
	font-size: 1.1rem;
	margin: 30px 0 12px;
	letter-spacing: .01em;
}
.mt-co-heading--first { margin-top: 0; }
.mt-co-section-head { margin: 34px 0 12px; }
.mt-co-section-head .mt-co-heading { margin: 0 0 4px; }
.mt-co-subnote {
	font-size: .84rem;
	color: var(--mt-ink-soft);
	margin: 0;
}
/* WooCommerce prints its own "Billing details" heading — we supply our
   own "Contact" / "Delivery" headings instead. */
.woocommerce-billing-fields > h3,
.woocommerce-checkout #customer_details h3#order_review_heading { display: none; }

/* --- Fields --- */
.mt-co-label-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.woocommerce-checkout .col2-set,
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 12px;
}
.woocommerce-checkout .form-row {
	width: 100% !important;
	float: none !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
	grid-column: 1 / -1;
}
.woocommerce-checkout .form-row-first { grid-column: 1 / 2; }
.woocommerce-checkout .form-row-last  { grid-column: 2 / 3; }
.woocommerce-billing-fields__field-wrapper > .mt-co-heading,
.woocommerce-shipping-fields__field-wrapper > .mt-co-heading { grid-column: 1 / -1; }

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row .select2-container .select2-selection--single,
.woocommerce-checkout .form-row select {
	width: 100%;
	min-height: 48px;
	padding: 13px 14px;
	border: 1px solid var(--mt-line, #d9d3c9);
	border-radius: 10px;
	background: var(--mt-white, #fff);
	font-size: .95rem;
	color: var(--mt-ink);
}
.woocommerce-checkout .form-row input.input-text::placeholder,
.woocommerce-checkout .form-row textarea::placeholder { color: #9a948b; }
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus {
	outline: none;
	border-color: var(--mt-green-deep, #2f4f3a);
	box-shadow: 0 0 0 3px rgba(47, 79, 58, .12);
}
/* select2 (country / state dropdowns) matched to the same box */
.woocommerce-checkout .select2-container--default .select2-selection--single {
	height: auto;
	display: flex;
	align-items: center;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 1.4;
	padding: 0;
	color: var(--mt-ink);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { top: 50%; transform: translateY(-50%); right: 10px; }
.woocommerce-checkout .form-row label:not(.mt-co-label-hidden) {
	display: block;
	font-size: .78rem;
	color: var(--mt-ink-soft);
	margin-bottom: 5px;
}
.woocommerce-checkout .form-row.woocommerce-invalid input.input-text { border-color: #c0392b; }

/* "Ship to a different address?" / save-info checkboxes */
.woocommerce-checkout .woocommerce-shipping-fields > h3,
.woocommerce-checkout .woocommerce-additional-fields > h3 {
	font-size: 1.1rem;
	margin: 30px 0 12px;
}
.woocommerce-checkout .woocommerce-shipping-fields > h3 label,
.woocommerce-checkout .form-row.mt-co-check label { font-size: .92rem; font-weight: 400; }

/* --- Payment box --- */
.woocommerce-checkout #payment {
	background: transparent;
	border-radius: 0;
	padding: 0;
}
.woocommerce-checkout #payment ul.payment_methods {
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
	border: 1px solid var(--mt-line, #d9d3c9);
	border-radius: 10px;
	margin: 0 0 10px;
	padding: 14px 16px;
	background: var(--mt-white, #fff);
	transition: border-color .2s ease, background .2s ease;
}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:has(input:checked) {
	border-color: var(--mt-green-deep, #2f4f3a);
	background: var(--mt-green-pale, #f2f5f1);
}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: .95rem;
	font-weight: 500;
	margin: 0;
	cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > input[type="radio"] {
	margin-right: 8px;
	accent-color: var(--mt-green-deep, #2f4f3a);
	width: 16px;
	height: 16px;
}
.woocommerce-checkout #payment ul.payment_methods li .payment_box {
	background: transparent;
	margin: 10px 0 0;
	padding: 10px 0 0;
	border-top: 1px dashed var(--mt-line, #e3ded6);
	font-size: .88rem;
	color: var(--mt-ink-soft);
}
.woocommerce-checkout #payment ul.payment_methods li .payment_box::before { display: none; }
.woocommerce-checkout #payment .place-order { padding: 0; margin-top: 18px; }
.woocommerce-checkout #payment #place_order,
.woocommerce-checkout #payment .button.alt {
	width: 100%;
	display: block;
	padding: 16px 20px;
	font-size: 1rem;
	letter-spacing: .04em;
	border-radius: 10px;
}
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper {
	font-size: .82rem;
	color: var(--mt-ink-soft);
}

/* Advance delivery-charge note inside the payment box */
.mt-co-note { margin: 16px 0 0; }

/* --- Order summary panel --- */
.mt-checkout-summary table.shop_table {
	border: none;
	background: transparent;
	margin: 0;
}
.mt-checkout-summary table.shop_table th,
.mt-checkout-summary table.shop_table td {
	border: none;
	padding: 10px 0;
	font-size: .9rem;
	vertical-align: middle;
}
.mt-checkout-summary table.shop_table thead { display: none; }
.mt-checkout-summary table.shop_table tfoot tr th { font-weight: 400; color: var(--mt-ink-soft); }
.mt-checkout-summary table.shop_table tfoot tr td { text-align: right; }
.mt-checkout-summary table.shop_table tfoot tr.order-total th,
.mt-checkout-summary table.shop_table tfoot tr.order-total td {
	border-top: 1px solid var(--mt-line, #e3ded6);
	padding-top: 14px;
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--mt-ink);
}
.mt-checkout-summary table.shop_table tbody tr.cart_item td {
	border-bottom: 1px solid rgba(0, 0, 0, .06);
	padding: 14px 0;
}
.mt-checkout-summary td.product-total { text-align: right; white-space: nowrap; }
.mt-checkout-summary .product-quantity { display: none; }

.mt-co-item { display: flex; align-items: center; gap: 12px; }
.mt-co-item-thumb {
	position: relative;
	flex: 0 0 56px;
	width: 56px;
	height: 56px;
}
.mt-co-item-thumb img {
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid var(--mt-line, #e3ded6);
	background: var(--mt-white, #fff);
	display: block;
	margin: 0;
}
.mt-co-item-qty {
	position: absolute;
	top: -7px;
	right: -7px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--mt-ink, #1c1c1c);
	color: var(--mt-white, #fff);
	font-size: .7rem;
	line-height: 20px;
	text-align: center;
}
.mt-co-item-name { font-size: .88rem; line-height: 1.35; }

/* Discount code row */
.woocommerce-checkout .checkout_coupon.woocommerce-form-coupon {
	border: none;
	padding: 0;
	margin: 0 0 18px;
	/* The coupon form ships hidden behind a "Have a coupon?" toggle; we
	   show it inline in the summary instead, so force it visible. */
	display: flex !important;
	gap: 8px;
	align-items: stretch;
}
.woocommerce-checkout .checkout_coupon.woocommerce-form-coupon p { margin: 0; }
.woocommerce-checkout .checkout_coupon.woocommerce-form-coupon p:first-of-type { flex: 1 1 auto; }
.woocommerce-checkout .checkout_coupon .form-row { margin: 0 !important; }
.woocommerce-checkout .checkout_coupon input#coupon_code {
	width: 100%;
	min-height: 46px;
	padding: 12px 14px;
	border: 1px solid var(--mt-line, #d9d3c9);
	border-radius: 10px;
	background: var(--mt-white, #fff);
}
.woocommerce-checkout .checkout_coupon button[name="apply_coupon"] {
	min-height: 46px;
	border-radius: 10px;
	padding: 12px 20px;
	white-space: nowrap;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle { display: none; }

@media (max-width: 980px) {
	.mt-checkout-layout {
		grid-template-columns: 1fr;
		gap: 30px;
		padding-bottom: 50px;
	}
	/* Summary first on phones, so people see what they're paying for. */
	.mt-checkout-aside { order: -1; }
	.mt-checkout-summary { position: static; padding: 18px 16px; }
}
@media (max-width: 560px) {
	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper,
	.woocommerce-additional-fields__field-wrapper { grid-template-columns: 1fr; }
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last { grid-column: 1 / -1; }
}



/* ==========================================================================
   Blog / Pages
   ========================================================================== */
.mt-post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	padding: 50px 0;
}
.mt-post-card { background: var(--mt-white); }
.mt-post-thumb img { border-radius: var(--mt-radius); aspect-ratio: 4/3; object-fit: cover; }
.mt-post-title { font-size: 1.2rem; margin: 14px 0 6px; }
.mt-post-meta { font-size: .8rem; color: var(--mt-ink-soft); margin-bottom: 8px; }
.mt-post-excerpt { color: var(--mt-ink-soft); font-size: .95rem; }
.mt-pagination { padding-bottom: 40px; }
.mt-pagination .navigation.pagination { margin-top: 10px; }

.page-main { padding: 60px 0 90px; }
.mt-page-container { max-width: 860px; }
.mt-page-title { font-size: 2.2rem; }
.mt-page-thumb img { border-radius: var(--mt-radius); margin: 24px 0; }
.mt-page-content { color: var(--mt-ink-soft); font-size: 1.05rem; }
.mt-page-content h2, .mt-page-content h3 { color: var(--mt-ink); margin-top: 1.4em; }
.mt-archive-header { padding-top: 50px; }

/* Contact page */
.mt-contact-page .mt-page-header { text-align: center; }
.mt-contact-topinfo {
	text-align: justify;
	margin: 10px 0 40px;
}
.mt-contact-topinfo p { margin: 0 0 8px; color: var(--mt-ink); }
.mt-contact-topinfo a { color: var(--mt-green-mid); }
.mt-contact-topinfo a:hover { color: var(--mt-brown); }

.mt-contact-form-grid {
	display: flex;
	flex-direction: column;
	gap: 18px;
	max-width: 760px;
	margin: 0 auto;
}
.mt-contact-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}
.mt-contact-form-grid input,
.mt-contact-form-grid textarea {
	width: 100%;
	padding: 14px 16px;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	font-family: var(--mt-font-body);
	background: var(--mt-white);
	color: var(--mt-ink);
}
.mt-contact-form-grid textarea { resize: vertical; }
.mt-contact-form-notice {
	max-width: 760px;
	margin: 0 auto 20px;
	padding: 14px 18px;
	border-radius: var(--mt-radius);
	font-size: .92rem;
	text-align: center;
}
.mt-contact-form-notice--success { background: var(--mt-green-pale); color: var(--mt-green-deep); border: 1px solid var(--mt-green-mid); }
.mt-contact-form-notice--error { background: #fbe9e7; color: #8a2c22; border: 1px solid #d98d80; }
.mt-btn-dark {
	align-self: flex-start;
	background: var(--mt-ink);
	color: var(--mt-white);
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: .85rem;
	padding: 12px 30px;
}
.mt-btn-dark:hover { background: var(--mt-brown); }

.mt-contact-features {
	background: var(--mt-brown);
	color: var(--mt-white);
	padding: 60px 24px;
	margin-top: 60px;
}
.mt-contact-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	text-align: center;
}
.mt-contact-feature h3 {
	font-family: var(--mt-font-display);
	color: var(--mt-white);
	font-size: 1.4rem;
	margin-bottom: .5em;
}
.mt-contact-feature p {
	color: rgba(255,255,255,.85);
	font-size: .92rem;
	margin: 0;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { background: var(--mt-ink); color: rgba(255,255,255,.75); }
.footer-grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
	gap: 40px;
	padding: 60px 0 40px;
}
.footer-logo { filter: brightness(0) invert(1); margin-bottom: 16px; }
.footer-brand p { font-size: .92rem; }
.footer-social { display: flex; gap: 12px; margin-top: 16px; }
.footer-social a {
	width: 34px; height: 34px;
	border: 1px solid rgba(255,255,255,.25);
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: .7rem;
	color: var(--mt-white);
	transition: background-color .2s ease, border-color .2s ease;
}
.footer-social a:hover {
	background: var(--mt-gold);
	border-color: var(--mt-gold);
	color: var(--mt-ink);
}
.footer-social a svg { display: block; }
.footer-widget-title, .footer-col h4 {
	color: var(--mt-white);
	font-size: 1rem;
	margin-bottom: 16px;
}
.footer-col ul li { margin-bottom: 10px; font-size: .92rem; }
.footer-col ul li a:hover { color: var(--mt-gold); }
.footer-newsletter .mt-newsletter-form input { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); color: var(--mt-white); }
.footer-newsletter .mt-newsletter-form input::placeholder { color: rgba(255,255,255,.5); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 20px 0; }
.footer-bottom-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	font-size: .82rem;
}
.footer-menu { display: flex; gap: 20px; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1024px) {
	ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
	.mt-category-grid { grid-template-columns: repeat(2, 1fr); }
	.mt-collection-grid { grid-template-columns: repeat(2, 1fr); }
	.mt-post-grid { grid-template-columns: repeat(2, 1fr); }
	.footer-grid { grid-template-columns: 1fr 1fr; }
	.mt-story-inner { grid-template-columns: 1fr; }
	.mt-client-stories-inner { grid-template-columns: 1fr; }
	.mt-client-stories-text { position: static; }
	.mt-reel-grid { grid-template-columns: repeat(4, 1fr); max-width: 600px; }
	.single-product div.product { grid-template-columns: 1fr; }
	.mt-contact-grid { grid-template-columns: 1fr; }
	.mt-contact-form-row { grid-template-columns: 1fr; }
	.mt-contact-feature-grid { grid-template-columns: 1fr; gap: 30px; }
}
@media (max-width: 780px) {
	.mt-circle-grid {
		gap: 22px;
		padding: 4px 12px 16px;
		overflow-x: visible;
		flex-wrap: wrap;
		justify-content: center;
		scroll-snap-type: none;
	}
	.mt-circle-card { width: 96px; }
	.mt-circle-image { width: 88px; height: 88px; }
	.mt-circle-name { font-size: .88rem; }
	.mt-carousel-arrow { display: none; }

	/* Client Stories: no more horizontal auto-scroll on mobile — cards stack in a static list */
	.mt-review-marquee { margin: 0; gap: 14px; }
	.mt-review-track {
		overflow: visible;
		-webkit-mask-image: none;
		mask-image: none;
	}
	.mt-review-row--left,
	.mt-review-row--right {
		animation: none;
		transform: none;
		flex-direction: column;
		width: 100%;
		gap: 14px;
	}
	.mt-review-card {
		width: 100%;
		max-width: none;
	}
	.mt-review-card--dup { display: none; }
}
@media (max-width: 780px) {
	.main-navigation {
		position: fixed;
		top: 0; left: -100%;
		width: 82%; max-width: 340px;
		height: 100vh;
		background: var(--mt-white);
		z-index: 999;
		padding: 0 0 40px;
		transition: left var(--mt-transition);
		overflow-y: auto;
	}
	.main-navigation.is-open { left: 0; }

	.mt-drawer-overlay.is-open { display: block; opacity: 1; }

	/* Drawer head: Menu / Categories tabs + close button */
	.mt-drawer-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 26px 24px 0;
		margin-bottom: 8px;
		border-bottom: 1px solid var(--mt-line);
	}

	/* Mobile menu: stacked list rows, chevron arrow opens a drawer, label still navigates */
	.primary-menu, .categories-menu { flex-direction: column; gap: 0; width: 100%; }
	.primary-menu > li, .categories-menu > li {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		border-bottom: 1px solid var(--mt-line);
	}
	.primary-menu > li > a::after { content: none; }
	.primary-menu > li > a, .categories-menu > li > a {
		flex: 1 1 auto;
		display: block;
		padding: 15px 24px;
		font-size: .88rem;
		font-weight: 600;
		letter-spacing: .04em;
		text-transform: uppercase;
		color: var(--mt-ink);
	}
	.mt-submenu-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 auto;
		width: 44px;
		height: 44px;
		margin-right: 8px;
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
		color: var(--mt-ink-soft) !important;
		transition: transform var(--mt-transition), color var(--mt-transition);
		appearance: none;
		-webkit-appearance: none;
	}
	.mt-submenu-toggle:hover,
	.mt-submenu-toggle:focus,
	.mt-submenu-toggle:active {
		background: transparent !important;
		color: var(--mt-ink-soft) !important;
		outline: none;
		box-shadow: none !important;
	}
	.mt-submenu-toggle svg { transform: rotate(-90deg); transition: transform var(--mt-transition); stroke: currentColor; }
	.primary-menu li.menu-item-has-children.is-open .mt-submenu-toggle,
	.categories-menu li.menu-item-has-children.is-open .mt-submenu-toggle { color: var(--mt-green-deep) !important; }
	.primary-menu li.menu-item-has-children.is-open .mt-submenu-toggle svg,
	.categories-menu li.menu-item-has-children.is-open .mt-submenu-toggle svg { transform: rotate(0deg); }

	.primary-menu .sub-menu, .categories-menu .sub-menu {
		flex: 1 0 100%;
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		border: none;
		box-shadow: none;
		background: var(--mt-white);
		padding: 0;
		max-height: 0;
		overflow: hidden;
		transition: max-height 280ms ease;
	}
	.primary-menu li.menu-item-has-children.is-open .sub-menu,
	.categories-menu li.menu-item-has-children.is-open .sub-menu { max-height: 720px; }
	.primary-menu .sub-menu li, .categories-menu .sub-menu li { border-top: 1px solid var(--mt-line); border-bottom: none; }
	.primary-menu .sub-menu a, .categories-menu .sub-menu a {
		display: block;
		padding: 15px 24px 15px 44px;
		font-size: .85rem;
		font-weight: 500;
		letter-spacing: .02em;
		line-height: 1.3;
		text-transform: none;
		color: var(--mt-ink) !important;
	}
	.primary-menu .sub-menu a:hover, .categories-menu .sub-menu a:hover { background: var(--mt-sand); color: var(--mt-green-deep) !important; }
	.mt-menu-toggle { display: flex; }
	.site-header-inner { flex-wrap: nowrap; justify-content: space-between; gap: 12px; }
	.mt-menu-toggle { order: 1; min-width: 54px; }
	.site-branding { order: 2; flex: 1 1 auto; display: flex; justify-content: center; }
	.site-branding a { display: inline-flex; }
	.site-header-actions { order: 3; min-width: 54px; justify-content: flex-end; gap: 16px; }
	.site-header-actions .mt-account-link { display: none; }
	ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px; }
	.mt-testimonial-grid { grid-template-columns: 1fr; }
	.mt-post-grid { grid-template-columns: 1fr; }
	.mt-reel-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; max-width: 420px; }
	.mt-collection-grid { grid-template-columns: 1fr; }
	.footer-grid { grid-template-columns: 1fr; }
	.mt-hero { padding: 90px 20px; }
	/* No hover on touch — show the action row (stacked, one button per line) at all times. */
	ul.products li.product .woocommerce-loop-product__title { font-size: .82rem; margin: 10px 0 4px; }
	ul.products li.product .mt-card-actions {
		flex-direction: column;
		opacity: 1;
		transform: none;
		position: static;
	}
	ul.products li.product .mt-card-actions .mt-quick-view-btn,
	ul.products li.product .mt-card-actions .button { flex: 1 1 100%; font-size: .78rem; padding: 10px 6px; }
}
@media (max-width: 480px) {
	ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px; }
	ul.products li.product .woocommerce-loop-product__title { font-size: .76rem; }
	.mt-category-grid { grid-template-columns: 1fr; }
	.mt-reel-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; max-width: 340px; }
	.mt-reel-sound { width: 24px; height: 24px; right: 6px; bottom: 6px; }
	.mt-reel-sound svg { width: 12px; height: 12px; }
}

/* ==========================================================================
   Mobile bottom tab bar
   ========================================================================== */
.mt-mobile-tabbar { display: none; }
@media (max-width: 780px) {
	body { padding-bottom: 62px; }
	.mt-mobile-tabbar {
		display: flex;
		position: fixed;
		bottom: 0; left: 0; right: 0;
		z-index: 900;
		background: var(--mt-white);
		border-top: 1px solid var(--mt-line);
		box-shadow: 0 -6px 18px rgba(0,0,0,.05);
		padding: 7px 4px calc(6px + env(safe-area-inset-bottom));
	}
	.mt-tabbar-item {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 3px;
		padding: 4px 2px;
		color: var(--mt-ink-soft);
	}
	.mt-tabbar-item svg { display: block; }
	.mt-tabbar-item span:last-child {
		font-family: var(--mt-font-body);
		font-size: .62rem;
		letter-spacing: .02em;
	}
	.mt-tabbar-item.is-active { color: var(--mt-green-deep); }
	.mt-tabbar-item.is-active svg { color: var(--mt-gold); }
	.mt-tabbar-icon-wrap { position: relative; display: inline-flex; }
	.mt-tabbar-badge {
		position: absolute;
		top: -4px; right: -8px;
		background: var(--mt-green-deep);
		color: var(--mt-white);
		font-size: .58rem;
		line-height: 1;
		min-width: 14px;
		height: 14px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 2px;
	}
}

/* ==========================================================================
   Single Product Page — monochrome (black & white) redesign
   ========================================================================== */
.single-product .woocommerce-breadcrumb {
	width: auto;
	background: none;
	text-align: left;
	padding: 28px 0 0;
	margin: 0 auto;
	max-width: var(--mt-container);
	color: var(--mt-ink-soft);
}
.single-product .woocommerce-breadcrumb a { color: var(--mt-ink-soft); opacity: .85; }
.single-product .woocommerce-breadcrumb a:hover { opacity: 1; color: var(--mt-ink); }

.single-product div.product {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 40px;
	padding-top: 28px;
}
/* Only the gallery and the summary belong in the two-column top row.
 * Everything WooCommerce prints after the summary (accordion tabs, the
 * reviews block, the "Complete the Look" eyebrow and the "You May Also
 * Like" products) is a direct child of div.product too, so without this
 * each of them was being dropped into a single half-width grid cell —
 * which is what squeezed the related products into one narrow column and
 * made them stack one under another. Span them across both tracks. */
.single-product div.product > .mt-reviews-section,
.single-product div.product > .mt-related-eyebrow,
.single-product div.product > .related.products,
.single-product div.product > .up-sells.products {
	grid-column: 1 / -1;
	width: 100%;
	min-width: 0;
}
/* WooCommerce's own CSS puts a hard "width: 48%; float: left/right"
 * on these two boxes (leftover from its classic 2-column layout).
 * That fights our CSS grid above — the image/summary boxes were only
 * filling 48% of their grid column, leaving a dead strip of blank
 * space on the right of each side. Reset both explicitly so they
 * fill their grid column fully. */
.single-product div.images,
.single-product div.summary {
	float: none !important;
	width: 100% !important;
	margin: 0;
}
.single-product div.images img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--mt-radius);
	background: var(--mt-sand);
	object-fit: cover;
}
.single-product div.images .flex-viewport img { aspect-ratio: 1 / 1; }
.single-product div.images .flex-control-thumbs {
	display: flex;
	gap: 10px;
	margin-top: 10px;
	padding: 0;
}
.single-product div.images .flex-control-thumbs li { list-style: none; width: 76px; }
.single-product div.images .flex-control-thumbs img {
	aspect-ratio: 1 / 1;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	opacity: .7;
	cursor: pointer;
}
.single-product div.images .flex-control-thumbs img.flex-active,
.single-product div.images .flex-control-thumbs img:hover { opacity: 1; border-color: var(--mt-ink); }

/* Desktop: thumbnail rail on the LEFT (bigger tiles, stacked one under
 * the other), big active image on the right filling the column. */
@media (min-width: 901px) {
	.single-product div.images.woocommerce-product-gallery {
		display: flex;
		align-items: flex-start;
		gap: 16px;
	}
	.single-product div.images .flex-viewport {
		order: 2;
		flex: 1 1 auto;
		min-width: 0;
	}
	.single-product div.images .flex-control-thumbs {
		order: 1;
		flex: 0 0 110px;
		flex-direction: column;
		margin-top: 0;
		max-height: 620px;
		overflow-y: auto;
	}
	.single-product div.images .flex-control-thumbs li { width: 100%; }
}

.single-product div.summary { padding-top: 0; }
/* Scope used below: body.single-product div.product div.summary — the extra
 * classes are on purpose, WooCommerce's own stylesheet uses selectors like
 * ".woocommerce div.product .product_title" / "button.button.alt" that would
 * otherwise win (that is where the purple Add to Cart button came from). */
body.single-product div.product div.summary .product_title {
	font-family: var(--mt-font-body);
	font-size: 1.15rem;
	font-weight: 400;
	letter-spacing: .12em;
	line-height: 1.5;
	text-transform: uppercase;
	color: var(--mt-ink);
	margin: 0 0 .5em;
	padding: 0;
}
body.single-product div.product div.summary p.price {
	font-size: .95rem;
	font-weight: 400;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--mt-ink-soft);
	margin: 0 0 14px;
}
body.single-product div.product div.summary p.price del { color: var(--mt-ink-soft); opacity: .55; font-weight: 400; margin-right: 8px; }
body.single-product div.product div.summary p.price ins { text-decoration: none; color: var(--mt-ink); font-weight: 500; }

/* Star rating + "0 ( 0 Reviews )" link, under the price */
body.single-product div.product div.summary .mt-product-rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 16px;
}
body.single-product div.product div.summary .mt-product-rating .star-rating {
	float: none;
	flex: 0 0 auto;
	margin: 0;
	font-size: .82rem;
}
body.single-product div.product div.summary .mt-product-rating .star-rating::before { color: #d6cfbf; }
body.single-product div.product div.summary .mt-product-rating .star-rating span::before { color: var(--mt-gold); }
.mt-rating-score { font-weight: 400; color: var(--mt-ink); font-size: .78rem; }
.mt-review-link { font-size: .78rem; color: var(--mt-ink-soft); text-decoration: none; }
.mt-review-link:hover { color: var(--mt-ink); text-decoration: underline; }

/* Trust-pill container: COD · Free over Rs. X · Easy Returns — one filled pill */
body.single-product div.product div.summary .mt-badge-pills {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 18px;
	width: fit-content;
	max-width: 100%;
	background: var(--mt-sand-dark);
	border: 0;
	border-radius: 999px;
	padding: 10px 18px;
	margin: 0 0 16px;
}
.mt-badge-pills li {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: .72rem;
	letter-spacing: .02em;
	color: var(--mt-ink);
	white-space: nowrap;
	padding: 0;
	border: 0;
}
.mt-badge-pills svg { flex-shrink: 0; color: var(--mt-ink-soft); }

/* Stock line: "In Stock — 12 available" */
.mt-product-meta-row {
	display: flex;
	align-items: center;
	margin: 0 0 18px;
}
.mt-stock-badge { display: inline-flex; align-items: center; gap: 8px; font-size: .8rem; letter-spacing: .02em; color: var(--mt-ink); }
.mt-stock-dot { width: 8px; height: 8px; border-radius: 50%; background: #2f7d3a; display: inline-block; flex-shrink: 0; }
.mt-low-stock { color: #8a5210; }
.mt-low-stock .mt-stock-dot { background: #d98b1f; }
.mt-out-of-stock .mt-stock-dot { background: #a3282f; }
.mt-out-of-stock { color: #a3282f; }
/* the variation's own "N in stock" line is replaced by the stock line above */
.single-product div.summary .woocommerce-variation-availability { display: none; }

.single-product .woocommerce-product-details__short-description {
	color: var(--mt-ink-soft);
	font-size: .88rem;
	line-height: 1.6;
	margin: 0 0 20px;
}

/* Variation / swatch selector — replaces "Size" with round or pill swatches */
.single-product table.variations { width: 100%; margin-bottom: 4px; }
.single-product table.variations tr { display: block; margin-bottom: 18px; }
.single-product table.variations th {
	display: block;
	text-align: left;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--mt-ink);
	padding: 0 0 10px;
}
.single-product table.variations td { display: block; padding: 0; }
.single-product table.variations .reset_variations {
	display: inline-block;
	margin-top: 8px;
	font-size: .8rem;
	color: var(--mt-ink-soft);
	text-decoration: underline;
}
.mt-swatch-field { position: relative; }
.mt-swatch-field select {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}
.mt-swatch-group { display: flex; flex-wrap: wrap; gap: 10px; }
.mt-swatch {
	min-width: 44px;
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	background: var(--mt-white);
	color: var(--mt-ink);
	font-size: .88rem;
	font-family: var(--mt-font-body);
	transition: border-color var(--mt-transition), background var(--mt-transition), color var(--mt-transition);
}
.mt-swatch:hover { border-color: var(--mt-ink); }
.mt-swatch.is-selected { background: var(--mt-ink); border-color: var(--mt-ink); color: var(--mt-white); }
/* Round colour swatches */
.mt-swatch-group--color .mt-swatch {
	min-width: 0;
	width: 38px;
	height: 38px;
	padding: 0;
	border-radius: 50%;
	background: var(--mt-swatch-color, var(--mt-white));
	border: 1px solid var(--mt-line);
	box-shadow: inset 0 0 0 2px var(--mt-white);
	position: relative;
}
.mt-swatch-group--color .mt-swatch:hover { border-color: var(--mt-ink); }
.mt-swatch-group--color .mt-swatch.is-selected {
	border-color: var(--mt-ink);
	box-shadow: inset 0 0 0 2px var(--mt-white), 0 0 0 2px var(--mt-ink);
}
/* Colour swatches shown as that variation's own product photo */
.mt-swatch-group--color .mt-swatch--image {
	background-image: var(--mt-swatch-image);
	background-size: cover;
	background-position: center;
	box-shadow: none;
}
.mt-swatch-group--color .mt-swatch--image.is-selected { box-shadow: 0 0 0 2px var(--mt-ink); }

body.single-product div.product div.summary form.cart { display: block; margin: 22px 0 0; }
body.single-product div.product div.summary form.cart .woocommerce-variation-add-to-cart { display: block; }

/* Quantity ( − 1 + ) and Add to Cart on ONE inline row */
.mt-cart-row {
	display: flex;
	align-items: stretch;
	gap: 12px;
	margin: 0 0 12px;
}
body.single-product div.product div.summary form.cart .quantity {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	float: none;
	margin: 0;
	border: 1px solid rgba(28, 27, 25, .35);
	border-radius: var(--mt-radius);
	background: var(--mt-white);
}
body.single-product div.product div.summary form.cart .quantity input.qty {
	width: 42px;
	min-width: 0;
	height: 100%;
	min-height: 46px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	text-align: center;
	font-size: .9rem;
	color: var(--mt-ink);
	-moz-appearance: textfield;
	appearance: textfield;
}
body.single-product div.product div.summary form.cart .quantity input.qty::-webkit-outer-spin-button,
body.single-product div.product div.summary form.cart .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.mt-qty-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 38px;
	align-self: stretch;
	padding: 0;
	border: 0;
	background: none;
	color: var(--mt-ink);
	transition: background var(--mt-transition), opacity var(--mt-transition);
}
.mt-qty-btn:hover:not(:disabled) { background: var(--mt-sand); }
.mt-qty-btn:disabled { opacity: .3; cursor: not-allowed; }

/* NOTE box (advance payment) */
.mt-note-box {
	display: block;
	background: var(--mt-sand);
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	padding: 12px 16px;
	font-size: .8rem;
	color: var(--mt-ink-soft);
	margin: 4px 0 18px;
}
.mt-note-box strong { color: var(--mt-ink); margin-right: 4px; }

/* Add to Cart — BLACK (beats WooCommerce's purple button.alt in every state) */
body.single-product div.product div.summary form.cart button.single_add_to_cart_button.button.alt {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 auto;
	float: none;
	width: auto;
	min-height: 48px;
	margin: 0;
	padding: 0 24px;
	background: var(--mt-ink);
	color: var(--mt-white);
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	font-family: var(--mt-font-body);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .16em;
	line-height: 1;
	text-transform: uppercase;
	transition: background var(--mt-transition), color var(--mt-transition);
}
body.single-product div.product div.summary form.cart button.single_add_to_cart_button.button.alt:hover {
	background: #000;
	color: var(--mt-white);
}
body.single-product div.product div.summary form.cart button.single_add_to_cart_button.button.alt.disabled,
body.single-product div.product div.summary form.cart button.single_add_to_cart_button.button.alt:disabled,
body.single-product div.product div.summary form.cart button.single_add_to_cart_button.button.alt.wc-variation-selection-needed {
	background: var(--mt-ink);
	color: var(--mt-white);
	opacity: .45;
	cursor: not-allowed;
}

/* Buy It Now — full width, right under the Add to Cart row */
body.single-product div.product div.summary form.cart .mt-buy-now-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 48px;
	margin: 0 0 12px;
	padding: 0 24px;
	background: var(--mt-white);
	color: var(--mt-ink);
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	font-family: var(--mt-font-body);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .16em;
	line-height: 1;
	text-transform: uppercase;
	text-align: center;
}
body.single-product div.product div.summary form.cart .mt-buy-now-btn:hover { background: var(--mt-ink); color: var(--mt-white); }

/* Order on WhatsApp — right under Buy It Now */
body.single-product div.product div.summary .mt-whatsapp-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 0 24px;
	background: #25d366;
	color: var(--mt-white);
	border: 1px solid #25d366;
	border-radius: var(--mt-radius);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .16em;
	line-height: 1;
	text-transform: uppercase;
}
body.single-product div.product div.summary .mt-whatsapp-btn:hover { background: #1ebc59; border-color: #1ebc59; }

/* Accordion — Product Details / Care Instructions / Shipping & Return.
   Every row is a button that opens / closes its own panel (+ turns into −). */
.mt-accordion {
	margin: 24px 0 8px;
	border-top: 1px solid var(--mt-line);
}
.mt-acc-item { border-bottom: 1px solid var(--mt-line); }
.mt-acc-heading { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }
.mt-acc-trigger {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 18px 2px;
	margin: 0;
	background: none;
	border: 0;
	border-radius: 0;
	text-align: left;
	color: var(--mt-ink);
	font-family: var(--mt-font-body);
	font-size: .72rem;
	font-weight: 400;
	letter-spacing: .14em;
	line-height: 1.4;
	text-transform: uppercase;
}
.mt-acc-icon { flex: 0 0 auto; color: var(--mt-ink-soft); }
.mt-acc-title { flex: 1 1 auto; }
.mt-acc-toggle { position: relative; flex: 0 0 12px; width: 12px; height: 12px; }
.mt-acc-toggle::before,
.mt-acc-toggle::after {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 12px;
	height: 1.5px;
	margin-top: -.75px;
	background: currentColor;
	transition: transform .25s ease;
}
.mt-acc-toggle::after { transform: rotate(90deg); }
.mt-acc-item.is-open .mt-acc-toggle::after { transform: rotate(0deg); }

.mt-acc-panel {
	display: grid;
	grid-template-rows: 0fr;
	visibility: hidden;
	transition: grid-template-rows .3s ease, visibility 0s linear .3s;
}
.mt-acc-item.is-open .mt-acc-panel {
	grid-template-rows: 1fr;
	visibility: visible;
	transition: grid-template-rows .3s ease, visibility 0s;
}
.mt-acc-panel-inner { overflow: hidden; min-height: 0; }
.mt-acc-content {
	padding: 0 2px 20px 28px;
	color: var(--mt-ink-soft);
	font-size: .88rem;
	line-height: 1.7;
}
.mt-acc-content > :last-child { margin-bottom: 0; }
.mt-acc-specs { margin: 0 0 1em; }
.mt-acc-specs li { margin: 0 0 2px; }
.mt-acc-content strong { color: var(--mt-ink); font-weight: 500; }
@media (prefers-reduced-motion: reduce) {
	.mt-acc-panel, .mt-acc-item.is-open .mt-acc-panel, .mt-acc-toggle::before, .mt-acc-toggle::after { transition: none; }
}

/* Reviews section */
.mt-reviews-section {
	max-width: var(--mt-container);
	margin: 40px auto 0;
	padding: 0 24px;
}
.mt-reviews-heading { font-size: 1.6rem; margin-bottom: 20px; }

/* Rating breakdown: overall score · 5→1 star bars · actions */
.mt-rating-summary {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 32px;
	padding: 24px 0;
	border-top: 1px solid var(--mt-line);
	border-bottom: 1px solid var(--mt-line);
	margin-bottom: 32px;
}
.mt-rating-summary__score { flex: 0 0 auto; text-align: left; }
.mt-rating-summary__score .star-rating { margin-bottom: 4px; }
.mt-rating-summary__total { font-size: .85rem; color: var(--mt-ink-soft); }
.mt-rating-summary__total a { color: var(--mt-ink); text-decoration: underline; }
.mt-rating-summary__bars { flex: 1 1 260px; min-width: 220px; display: flex; flex-direction: column; gap: 6px; }
.mt-rating-bar-row { display: flex; align-items: center; gap: 10px; font-size: .8rem; color: var(--mt-ink-soft); }
.mt-rating-bar-label { width: 26px; flex-shrink: 0; }
.mt-rating-bar-track { flex: 1; height: 6px; background: var(--mt-sand); border-radius: 999px; overflow: hidden; }
.mt-rating-bar-fill { display: block; height: 100%; background: var(--mt-gold); border-radius: 999px; }
.mt-rating-bar-count { width: 36px; text-align: right; flex-shrink: 0; }
.mt-rating-summary__actions { display: flex; flex-direction: column; gap: 10px; flex: 0 0 auto; margin-left: auto; }
.mt-rating-summary__actions .mt-btn { padding: 11px 24px; font-size: .85rem; text-align: center; white-space: nowrap; }

#reviews.woocommerce-Reviews { max-width: 640px; margin: 0 auto; text-align: center; }
#reviews .woocommerce-Reviews-title { display: none; }
#reviews .comment-form-rating { text-align: left; }
#reviews #respond input[type="submit"] {
	background: var(--mt-ink);
	color: var(--mt-white);
	border: 1px solid var(--mt-ink);
	padding: 12px 26px;
	border-radius: var(--mt-radius);
}

/* Related products */
.mt-related-eyebrow {
	display: block;
	text-align: center;
	max-width: var(--mt-container);
	margin: 0 auto;
	padding: 0 24px;
}
.related.products {
	max-width: var(--mt-container);
	margin: 0 auto;
	padding: 60px 24px 0;
}
.related.products h2 { text-align: center; font-size: 2rem; margin-bottom: 32px; }

/* --- "You May Also Like" carousel -------------------------------------
 * One horizontal row on every screen size: the cards sit side by side and
 * the row swipes / scrolls sideways, instead of stacking one under the
 * other. Arrow buttons are injected by main.js (mt-carousel-nav) and are
 * only shown when the row actually overflows. */
.related.products .mt-carousel {
	position: relative;
}
.related.products ul.products {
	display: flex !important;
	flex-wrap: nowrap !important;
	grid-template-columns: none !important;
	align-items: stretch;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scroll-padding-left: 2px;
	gap: 24px;
	padding: 2px 2px 12px !important;
	margin-bottom: 0 !important;
	justify-content: flex-start;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.related.products ul.products::-webkit-scrollbar { display: none; }
/* 4 cards visible on desktop, then fewer as the screen narrows. calc()
 * subtracts the gaps so the last visible card never gets clipped. */
.related.products ul.products li.product {
	flex: 0 0 calc((100% - 72px) / 4);
	max-width: calc((100% - 72px) / 4);
	scroll-snap-align: start;
}

/* Prev / next arrows */
.mt-carousel-nav {
	position: absolute;
	top: 34%;
	transform: translateY(-50%);
	z-index: 3;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 1px solid var(--mt-line, #e3ded6);
	background: var(--mt-white, #fff);
	color: var(--mt-ink, #1c1c1c);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
	transition: opacity var(--mt-transition, .25s ease), background .25s ease;
	padding: 0;
}
.mt-carousel-nav:hover { background: var(--mt-sand, #f3ece3); }
.mt-carousel-nav svg { width: 16px; height: 16px; display: block; }
.mt-carousel-nav--prev { left: -8px; }
.mt-carousel-nav--next { right: -8px; }
.mt-carousel-nav[disabled] {
	opacity: 0;
	pointer-events: none;
}

@media (max-width: 1024px) {
	.related.products ul.products li.product {
		flex: 0 0 calc((100% - 40px) / 3);
		max-width: calc((100% - 40px) / 3);
	}
	.related.products ul.products { gap: 20px; }
}
@media (max-width: 768px) {
	.related.products { padding: 40px 16px 0; }
	.related.products h2 { font-size: 1.5rem; margin-bottom: 20px; }
	.related.products ul.products { gap: 14px; }
	/* 2.2 cards in view so the cut-off third card hints "swipe me". */
	.related.products ul.products li.product {
		flex: 0 0 calc((100% - 28px) / 2.2);
		max-width: calc((100% - 28px) / 2.2);
	}
	.related.products ul.products li.product .woocommerce-loop-product__title { font-size: .8rem; }
	.related.products ul.products li.product .price { font-size: .85rem; }
	.mt-carousel-nav { display: none; }
}

@media (max-width: 900px) {
	.single-product div.product { grid-template-columns: 1fr; gap: 28px; }
	body.single-product div.product div.summary .mt-badge-pills { width: 100%; justify-content: space-between; gap: 6px 12px; padding: 10px 16px; }
	.mt-badge-pills li { font-size: .72rem; }
}
@media (max-width: 400px) {
	body.single-product div.product div.summary .mt-badge-pills { border-radius: 22px; }
	.mt-rating-summary { flex-direction: column; align-items: flex-start; gap: 20px; }
	.mt-rating-summary__actions { flex-direction: row; margin-left: 0; width: 100%; }
	.mt-rating-summary__actions .mt-btn { flex: 1; }
}

/* ==========================================================================
   Thank You page (WooCommerce "order received")
   Template: woocommerce/checkout/thankyou.php
   ========================================================================== */
.mt-order-received .mt-page-container { max-width: 860px; }

/* The real page heading stays in the DOM for screen readers; the template
   shows its own large "Thank you" heading. */
.mt-order-received .mt-page-header {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.mt-ty { padding: 12px 0 70px; }

/* --- Hero --- */
.mt-ty-hero {
	text-align: center;
	padding: 46px 24px 38px;
	background: var(--mt-sand);
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
}
.mt-ty-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin: 0 auto 22px;
	border-radius: 50%;
	background: var(--mt-green-deep);
	color: var(--mt-white);
	box-shadow: 0 0 0 8px var(--mt-green-pale);
	animation: mt-ty-pop .55s cubic-bezier(.2, .9, .3, 1.3) both;
}
.mt-ty-icon svg { width: 34px; height: 34px; }
@keyframes mt-ty-pop {
	from { transform: scale(.4); opacity: 0; }
	to   { transform: scale(1);  opacity: 1; }
}
.mt-ty-eyebrow {
	display: block;
	margin-bottom: 8px;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--mt-gold);
}
.mt-ty .mt-ty-title {
	margin: 0 0 12px;
	font-family: var(--mt-font-display);
	font-weight: 400;
	font-size: 2.1rem;
	line-height: 1.2;
	color: var(--mt-ink);
}
.mt-ty-lead {
	max-width: 520px;
	margin: 0 auto 6px;
	color: var(--mt-ink-soft);
}
.mt-ty-lead--sub { font-size: .92rem; margin-bottom: 0; }
.mt-ty-lead strong { color: var(--mt-ink); word-break: break-all; }

.mt-ty-hero--failed { background: #fbf1f1; border-color: #ecc9cb; }
.mt-ty-hero--failed .mt-ty-icon {
	background: #a3282f;
	box-shadow: 0 0 0 8px #f6e0e1;
	animation: none;
}
.mt-ty-hero--failed .mt-ty-lead { margin-bottom: 22px; }

/* --- Order overview strip (number / date / total / payment) --- */
ul.mt-ty-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 1px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
	background: var(--mt-line);
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	overflow: hidden;
}
ul.mt-ty-overview li {
	margin: 0;
	padding: 16px 18px;
	background: var(--mt-white);
	border: 0;
	float: none;
	font-size: .95rem;
}
.mt-ty-label {
	display: block;
	margin-bottom: 2px;
	font-size: .72rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--mt-ink-soft);
}
ul.mt-ty-overview li strong { display: block; font-weight: 500; color: var(--mt-ink); overflow-wrap: anywhere; }

/* --- Payment instructions + order details / addresses (printed by WooCommerce) --- */
.mt-ty .woocommerce-order-details,
.mt-ty .woocommerce-customer-details,
.mt-ty .woocommerce-bacs-bank-details { margin-top: 34px; }
.mt-ty .woocommerce-order-details__title,
.mt-ty .woocommerce-column__title,
.mt-ty .wc-bacs-bank-details-heading,
.mt-ty .woocommerce-customer-details h2 {
	margin: 0 0 14px;
	font-family: var(--mt-font-display);
	font-weight: 400;
	font-size: 1.25rem;
	color: var(--mt-ink);
}
.mt-ty table.shop_table {
	width: 100%;
	margin: 0;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.mt-ty table.shop_table thead th {
	background: var(--mt-sand);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--mt-ink-soft);
}
.mt-ty table.shop_table th,
.mt-ty table.shop_table td {
	padding: 14px 16px;
	border-bottom: 1px solid var(--mt-line);
	text-align: left;
	vertical-align: top;
}
.mt-ty table.shop_table tfoot tr:last-child th,
.mt-ty table.shop_table tfoot tr:last-child td { border-bottom: 0; }
.mt-ty table.shop_table td:last-child,
.mt-ty table.shop_table thead th:last-child { text-align: right; }
.mt-ty table.shop_table tfoot th { font-weight: 400; color: var(--mt-ink-soft); }
.mt-ty table.shop_table tfoot tr:last-child th,
.mt-ty table.shop_table tfoot tr:last-child td { font-weight: 600; color: var(--mt-ink); }
.mt-ty table.shop_table .product-name a { color: var(--mt-green-deep); font-weight: 500; }
.mt-ty table.shop_table .product-name a:hover { color: var(--mt-brown); }
.mt-ty table.shop_table .product-quantity { color: var(--mt-ink-soft); font-weight: 400; }
.mt-ty .wc-item-meta { margin: 6px 0 0; padding: 0; list-style: none; font-size: .85rem; color: var(--mt-ink-soft); }

/* Billing / shipping address cards. The checkout rules above force .col2-set
   to a single stacked column, so re-apply a two-column grid for this page. */
.mt-ty .woocommerce-columns--addresses {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}
.woocommerce-checkout .mt-ty .col2-set .col-1,
.woocommerce-checkout .mt-ty .col2-set .col-2 {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.mt-ty .woocommerce-columns--addresses .woocommerce-column {
	display: flex;
	flex-direction: column;
}
.mt-ty .woocommerce-customer-details address {
	flex: 1 1 auto;
	margin: 0;
	padding: 18px 20px;
	font-style: normal;
	line-height: 1.7;
	background: var(--mt-sand);
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	overflow-wrap: anywhere;
}
.mt-ty .woocommerce-customer-details .woocommerce-customer-details--phone,
.mt-ty .woocommerce-customer-details .woocommerce-customer-details--email { margin: 8px 0 0; padding: 0; }
.mt-ty .woocommerce-bacs-bank-details ul.order_details {
	margin: 0 0 8px;
	padding: 14px 18px;
	list-style: none;
	background: var(--mt-sand);
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
}

/* --- What happens next --- */
.mt-ty-next { margin-top: 40px; }
.mt-ty .mt-ty-next-title {
	margin: 0 0 16px;
	font-family: var(--mt-font-display);
	font-weight: 400;
	font-size: 1.25rem;
	text-align: center;
}
.mt-ty-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mt-ty-steps li {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 20px 18px;
	text-align: center;
	align-items: center;
	background: var(--mt-white);
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	font-size: .9rem;
	color: var(--mt-ink-soft);
}
.mt-ty-steps li strong { color: var(--mt-ink); font-weight: 500; font-size: .98rem; }
.mt-ty-step-no {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin-bottom: 6px;
	border-radius: 50%;
	background: var(--mt-gold);
	color: var(--mt-white);
	font-size: .85rem;
	font-weight: 600;
}

/* --- Buttons + help --- */
.mt-ty-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 32px;
}
.mt-ty-hero .mt-ty-actions { margin-top: 0; }
.mt-ty-actions .mt-btn { text-align: center; }
.mt-ty-help {
	margin: 22px 0 0;
	text-align: center;
	font-size: .92rem;
	color: var(--mt-ink-soft);
}
.mt-ty-help-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: 4px;
	font-weight: 500;
	color: #128c4a;
	border-bottom: 1px solid currentColor;
}
.mt-ty-help-link:hover { color: #0c6b38; }

@media (max-width: 640px) {
	.mt-ty { padding-bottom: 50px; }
	.mt-ty-hero { padding: 34px 18px 28px; }
	.mt-ty-title { font-size: 1.6rem; }
	ul.mt-ty-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mt-ty-steps { grid-template-columns: 1fr; }
	.mt-ty .woocommerce-columns--addresses { grid-template-columns: 1fr; }
	.mt-ty-actions { flex-direction: column; }
	.mt-ty-actions .mt-btn { width: 100%; }
	.mt-ty table.shop_table th,
	.mt-ty table.shop_table td { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
	.mt-ty-icon { animation: none; }
}