/**
 * Vis'ore Grozio Studija — dark "glam" design layer.
 * Loaded after Astra's core CSS. Drives the whole site to a charcoal + gold
 * palette by overriding both Astra's global color vars and a set of local
 * --vs-* design tokens, then styles the custom homepage and the WooCommerce
 * shopping surfaces. Product images and all form fields sit on light "wells"
 * so photos read cleanly and checkout stays legible on the dark ground.
 */

:root {
	/* Local design tokens (dark glam). */
	--vs-bg:          #14100A; /* page background (deep) */
	--vs-bg-2:        #1A150E; /* alternate section */
	--vs-surface:     #201A12; /* cards, header */
	--vs-surface-2:   #2A2318; /* elevated: inputs, mini-cart */
	--vs-line:        #38301F; /* borders */
	--vs-line-soft:   #2C2417;
	--vs-gold:        #D9B26A;
	--vs-gold-soft:   #E7CF9C;
	--vs-gold-deep:   #C79A54;
	--vs-heading:     #F4ECDD; /* headings / bright text */
	--vs-text:        #C6B99E; /* body text */
	--vs-muted:       #9A8C72; /* captions */
	--vs-light:       #F6EFE1; /* light well background */
	--vs-light-2:     #ECE1CC;
	--vs-ink:         #2C2519; /* dark text on light wells */
	--vs-shadow:      0 24px 60px -30px rgba(0,0,0,.75);
	--vs-shadow-gold: 0 20px 46px -22px rgba(217,178,106,.4);

	/* Push the dark palette into Astra's own global color variables so the
	   theme chrome (menus, widgets, blocks) follows without per-element work. */
	--ast-global-color-0: #D9B26A;
	--ast-global-color-1: #C79A54;
	--ast-global-color-2: #F4ECDD;
	--ast-global-color-3: #C6B99E;
	--ast-global-color-4: #14100A;
	--ast-global-color-5: #201A12;
	--ast-global-color-6: #38301F;
	--ast-global-color-7: #1A150E;
	--ast-global-color-8: #F4ECDD;
}

html body,
body.ast-separate-container,
body.ast-plain-container {
	background-color: var(--vs-bg);
	color: var(--vs-text);
}
body {
	background-color: var(--vs-bg);
	background-image:
		radial-gradient( circle at 8% 6%, rgba(217,178,106,.07) 0, transparent 42% ),
		radial-gradient( circle at 96% 90%, rgba(217,178,106,.06) 0, transparent 40% );
	background-attachment: fixed;
	color: var(--vs-text);
	letter-spacing: .01em;
}
/* Astra content wrappers → transparent so the page ground shows through. */
.site-content,
.ast-separate-container .ast-article-single,
.ast-separate-container #content .ast-container,
#content,
#page { background-color: transparent; }

h1, h2, h3, h4, h5, h6,
.entry-title {
	color: var(--vs-heading);
	letter-spacing: .01em;
}

a { color: var(--vs-gold); }
a:hover { color: var(--vs-gold-soft); }

/* -----------------------------------------------------------------------
 * Shared bits: eyebrow, section header, reveal, helpers
 * --------------------------------------------------------------------- */

.salon-eyebrow {
	font-family: var(--ast-body-font-family, 'Poppins', sans-serif);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--vs-gold-deep);
	display: inline-block;
}

.salon-eyebrow-line {
	display: inline-flex;
	align-items: center;
	gap: 14px;
}
.salon-eyebrow-line::before {
	content: "";
	width: 46px;
	height: 1px;
	background: var(--vs-gold);
}

.salon-section { padding: 92px 20px; }
.salon-section-alt { background: var(--vs-bg-2); }

.salon-section-header {
	max-width: 680px;
	margin: 0 auto 52px;
	text-align: center;
}
.salon-section-title {
	font-size: clamp(30px, 4vw, 46px);
	line-height: 1.12;
	margin: 16px 0 0;
}
.salon-section-desc {
	margin: 16px 0 0;
	color: var(--vs-muted);
}

.salon-leaf { display: block; width: 100%; height: 100%; color: var(--vs-gold); }

.salon-photo-note {
	position: absolute;
	left: 16px;
	bottom: 14px;
	font-size: 11px;
	letter-spacing: .04em;
	color: var(--vs-muted);
	background: rgba(20,16,10,.72);
	border: 1px solid var(--vs-line);
	padding: 5px 11px;
	border-radius: 20px;
	backdrop-filter: blur(4px);
}

.salon-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
}
.salon-reveal.is-visible { opacity: 1; transform: translateY(0); }
.salon-reveal-delay-1.is-visible { transition-delay: .1s; }
.salon-reveal-delay-2.is-visible { transition-delay: .2s; }
.salon-reveal-delay-3.is-visible { transition-delay: .3s; }

@media ( prefers-reduced-motion: reduce ) {
	.salon-reveal { opacity: 1; transform: none; transition: none; }
}

.salon-full-bleed {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
}

/* -----------------------------------------------------------------------
 * Buttons
 * --------------------------------------------------------------------- */

.ast-button,
.salon-hero-actions .ast-button,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-family: var(--ast-body-font-family, 'Poppins', sans-serif);
	font-size: 13.5px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 15px 30px;
	border-radius: 40px;
	border: 1px solid transparent;
	background: var(--vs-gold);
	color: #1c1508;
	transition: transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease;
}
.ast-button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
	background: var(--vs-gold-soft);
	color: #1c1508;
	transform: translateY(-2px);
	box-shadow: var(--vs-shadow-gold);
}

.salon-btn-outline {
	background: transparent !important;
	color: var(--vs-heading) !important;
	border-color: var(--vs-gold) !important;
}
.salon-btn-outline:hover {
	background: var(--vs-gold) !important;
	color: #1c1508 !important;
}

/* -----------------------------------------------------------------------
 * Announcement bar (marquee) + header chrome
 * --------------------------------------------------------------------- */

.salon-announce {
	background: #0F0C07;
	border-bottom: 1px solid var(--vs-line);
	overflow: hidden;
	white-space: nowrap;
}
.salon-announce-track {
	display: inline-flex;
	animation: salon-marquee 30s linear infinite;
	will-change: transform;
}
.salon-announce-track span {
	display: inline-block;
	padding: 9px 34px;
	font-size: 12px;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--vs-gold-soft);
}
@keyframes salon-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media ( prefers-reduced-motion: reduce ) {
	.salon-announce-track { animation: none; }
}

.site-header,
.main-header-bar,
.ast-primary-header-bar {
	background-color: var(--vs-surface) !important;
	border-bottom: 1px solid var(--vs-line);
	transition: box-shadow .3s ease;
}

/* The uploaded logo is a large image (1162x912) with no size cap set in the
   Customizer, which blew the header up to ~950px tall. Constrain it hard so
   the header is a normal bar. The source logo has a cream background, so a
   small radius + light chip keeps it tidy on the dark header (ideally replace
   it with a transparent-PNG gold wordmark later). */
.custom-logo,
img.custom-logo,
.site-logo-img .custom-logo,
.ast-logo-title-inline img,
.site-branding img {
	max-height: 52px !important;
	width: auto !important;
	height: auto !important;
	border-radius: 6px;
}
.ast-site-identity { padding: 0; }
/* The wordmark logo already says the name — drop the redundant text title. */
.site-header .site-title { display: none; }
body.salon-scrolled .main-header-bar {
	box-shadow: 0 10px 30px rgba(0,0,0,.5);
}
.main-header-menu,
.ast-header-break-point .main-header-bar-navigation {
	background-color: var(--vs-surface) !important;
}
.main-header-menu a,
.ast-header-menu a {
	color: var(--vs-text);
}
.main-header-menu a:hover,
.main-header-menu .current-menu-item > a {
	color: var(--vs-gold);
}

/* Header icons */
.ast-header-account-wrap .ahfb-svg-iconset svg,
.astra-search-icon svg,
.ast-site-header-cart .ast-cart-menu-wrap svg {
	color: var(--vs-heading);
	fill: var(--vs-heading);
	transition: fill .2s ease, color .2s ease;
}
.ast-header-account-wrap:hover .ahfb-svg-iconset svg,
.astra-search-icon:hover svg { fill: var(--vs-gold); color: var(--vs-gold); }

.ast-site-header-cart .count {
	border: 2px solid var(--vs-gold);
	color: var(--vs-gold);
	border-radius: 8px;
	font-weight: 600;
	transition: background-color .25s ease, color .25s ease;
}
.ast-site-header-cart .cart-container:hover .count {
	background-color: var(--vs-gold);
	color: #1c1508;
}
.salon-cart-bump { animation: salon-cart-bump .35s ease; }
@keyframes salon-cart-bump { 0%,100% { transform: scale(1); } 40% { transform: scale(1.25); } }
@media ( prefers-reduced-motion: reduce ) { .salon-cart-bump { animation: none; } }

/* Slide-out search */
.ast-search-menu-icon .search-form {
	border: 1px solid var(--vs-line);
	border-radius: 30px;
	background-color: var(--vs-surface-2);
}
.ast-search-menu-icon .search-field { background: transparent; color: var(--vs-heading); }

/* Mini-cart dropdown */
.ast-site-header-cart .widget_shopping_cart,
.ast-site-header-cart .ast-site-header-cart-data {
	background-color: var(--vs-surface);
	border: 1px solid var(--vs-line);
	border-radius: 12px;
	color: var(--vs-text);
}
.ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__buttons a { border-radius: 30px; }
.ast-site-header-cart .widget_shopping_cart .woocommerce-mini-cart__empty-message {
	padding: 18px; text-align: center; color: var(--vs-muted);
}

/* -----------------------------------------------------------------------
 * HERO
 * --------------------------------------------------------------------- */

.salon-hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(160deg, #1A150E 0%, #14100A 55%, #0F0C07 100%);
	padding: 12px 20px 0;
}
.salon-hero-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: 48px;
	align-items: center;
	padding: 78px 0 88px;
}
.salon-hero-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(10px);
	pointer-events: none;
	background: radial-gradient(circle, rgba(217,178,106,.22), transparent 70%);
}
.salon-hero-orb-1 { width: 380px; height: 380px; top: -120px; left: -80px; }
.salon-hero-orb-2 { width: 460px; height: 460px; bottom: -180px; right: -120px; background: radial-gradient(circle, rgba(217,178,106,.16), transparent 70%); }

.salon-hero-copy { position: relative; z-index: 2; }
.salon-hero-title {
	font-size: clamp(42px, 6vw, 80px);
	line-height: 1.03;
	letter-spacing: -.01em;
	margin: 22px 0 0;
}
.salon-hero-title em { font-style: italic; color: var(--vs-gold); }
.salon-hero-sub {
	font-size: 18px;
	max-width: 36ch;
	margin: 26px 0 34px;
	color: var(--vs-text);
}
.salon-hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }

.salon-hero-visual { position: relative; aspect-ratio: 4/5; z-index: 2; }
.salon-hero-frame {
	position: absolute;
	inset: 0;
	border-radius: 50% 50% 16px 16px / 42% 42% 16px 16px;
	overflow: hidden;
	border: 1px solid var(--vs-line);
	box-shadow: var(--vs-shadow);
	background:
		radial-gradient(120% 90% at 30% 12%, #2A2216 0%, #201A11 55%, #14100A 100%);
	display: grid;
	place-items: center;
}
.salon-hero-frame.has-image { background-size: cover; background-position: center; }
.salon-bottle { width: 46%; filter: drop-shadow(0 24px 30px rgba(0,0,0,.5)); }
.salon-hero-leaf-lg {
	position: absolute;
	top: -6%;
	right: -4%;
	width: 120px;
	height: 120px;
	color: var(--vs-gold);
	opacity: .55;
	z-index: 3;
}
.salon-hero-badge {
	position: absolute;
	left: -14px;
	top: 20%;
	background: var(--vs-surface);
	border: 1px solid var(--vs-line);
	border-radius: 16px;
	padding: 14px 18px;
	box-shadow: var(--vs-shadow);
	z-index: 4;
}
.salon-hero-badge-n {
	display: block;
	font-family: var(--ast-heading-font-family, 'Playfair Display', serif);
	font-size: 26px;
	color: var(--vs-gold);
	line-height: 1;
}
.salon-hero-badge-l {
	display: block;
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--vs-muted);
	margin-top: 4px;
}

/* -----------------------------------------------------------------------
 * TRUST STRIP
 * --------------------------------------------------------------------- */

.salon-trust {
	background: var(--vs-surface);
	border-top: 1px solid var(--vs-line);
	border-bottom: 1px solid var(--vs-line);
}
.salon-trust-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	padding: 26px 20px;
}
.salon-trust-item { display: flex; align-items: center; gap: 14px; }
.salon-trust-icon svg { width: 26px; height: 26px; color: var(--vs-gold); flex: none; }
.salon-trust-text { display: flex; flex-direction: column; line-height: 1.4; }
.salon-trust-text strong { color: var(--vs-heading); font-size: 14px; font-weight: 600; }
.salon-trust-text span { color: var(--vs-muted); font-size: 12.5px; }

/* -----------------------------------------------------------------------
 * CATEGORY MOSAIC
 * --------------------------------------------------------------------- */

.salon-cats {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: 210px;
	gap: 18px;
}
.salon-cat {
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	border: 1px solid var(--vs-line);
	display: flex;
	align-items: flex-end;
	padding: 22px;
	isolation: isolate;
	text-decoration: none;
	background: var(--vs-surface);
}
.salon-cat-feature { grid-row: span 2; grid-column: span 2; }
.salon-cat-media { position: absolute; inset: 0; z-index: -2; }
.salon-cat-img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.salon-cat:hover .salon-cat-img { transform: scale(1.06); }
.salon-cat-leaf {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 46%;
	max-width: 120px;
	color: var(--vs-gold);
	opacity: .32;
}
.salon-cat::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to top, rgba(15,12,7,.92) 4%, rgba(15,12,7,.45) 42%, transparent 78%);
}
.salon-cat-label { position: relative; z-index: 1; transition: transform .35s ease; }
.salon-cat:hover .salon-cat-label { transform: translateY(-4px); }
.salon-cat-label h3 { font-size: 22px; color: var(--vs-heading); margin: 0; }
.salon-cat-feature .salon-cat-label h3 { font-size: 32px; }
.salon-cat-count {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--vs-gold);
}
.salon-cat-go {
	display: inline-flex;
	margin-top: 12px;
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--vs-heading);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity .35s ease, transform .35s ease;
}
.salon-cat:hover .salon-cat-go { opacity: 1; transform: translateX(0); }

/* -----------------------------------------------------------------------
 * BESTSELLER SHOWCASE (horizontal rail) + deluxe product cards
 * --------------------------------------------------------------------- */

.salon-showcase { background: var(--vs-bg-2); }
.salon-showcase-inner { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.salon-showcase-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
}
.salon-showcase-head .salon-section-title { margin-top: 12px; }

.salon-rail {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 300px;
	gap: 22px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding: 40px 4px 18px;
	scrollbar-width: thin;
	scrollbar-color: var(--vs-gold-deep) transparent;
}
.salon-rail::-webkit-scrollbar { height: 6px; }
.salon-rail::-webkit-scrollbar-thumb { background: var(--vs-gold-deep); border-radius: 3px; }

.salon-pcard {
	scroll-snap-align: start;
	background: var(--vs-surface);
	border: 1px solid var(--vs-line);
	border-radius: 18px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.salon-pcard:hover {
	transform: translateY(-8px);
	box-shadow: var(--vs-shadow);
	border-color: var(--vs-gold-deep);
}
.salon-pcard-media {
	position: relative;
	display: block;
	aspect-ratio: 1/1;
	background: var(--vs-light); /* light well so product photos read */
	overflow: hidden;
}
.salon-pcard-media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 14px;
	transition: transform .5s ease;
}
.salon-pcard:hover .salon-pcard-media img { transform: scale(1.05); }
.salon-pcard-tag {
	position: absolute;
	top: 12px;
	left: 12px;
	background: var(--vs-gold);
	color: #1c1508;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: 6px 12px;
	border-radius: 20px;
	z-index: 2;
}
.salon-pcard-body { padding: 18px 18px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.salon-pcard-cat { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--vs-gold-deep); }
.salon-pcard-body h4 { font-size: 16px; line-height: 1.35; margin: 0; }
.salon-pcard-body h4 a { color: var(--vs-heading); }
.salon-pcard-body h4 a:hover { color: var(--vs-gold); }
.salon-pcard-foot {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 8px;
}
.salon-pcard-price { font-weight: 600; font-size: 17px; color: var(--vs-gold); }
.salon-pcard-price del { color: var(--vs-muted); font-weight: 400; font-size: 14px; margin-right: 6px; }
.salon-pcard-price ins { text-decoration: none; }
/* Compact round "+" add-to-cart. High specificity + !important on geometry so
   WooCommerce's default button padding can't stretch it into an oval. */
.salon-pcard-foot a.button,
.salon-pcard-foot a.button.add_to_cart_button,
.salon-pcard-foot a.button.added {
	font-size: 0 !important; /* hide text, show the "+" glyph below */
	background: var(--vs-surface-2);
	border: 1px solid var(--vs-line);
	color: var(--vs-gold);
	width: 44px !important;
	min-width: 44px !important;
	max-width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	padding: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 44px !important;
	position: relative;
	transition: background .25s ease, color .25s ease, transform .2s ease;
}
.salon-pcard-foot a.button::before {
	content: "+";
	font-size: 22px !important;
	font-weight: 400;
	line-height: 1 !important;
}
.salon-pcard-foot a.button:hover { background: var(--vs-gold); color: #1c1508; transform: translateY(-2px); }
.salon-pcard-foot .button.loading,
.salon-pcard-foot .button.added { color: var(--vs-gold-soft); }
/* The AJAX "view cart" link WooCommerce injects after adding — hide in the
   compact rail (the header cart icon already updates + bumps). */
.salon-pcard-foot .added_to_cart { display: none !important; }

/* Fly-to-cart ghost image */
.salon-fly {
	position: fixed;
	z-index: 999;
	border-radius: 8px;
	object-fit: contain;
	background: var(--vs-light);
	padding: 4px;
	pointer-events: none;
	box-shadow: var(--vs-shadow);
	transition: all .8s cubic-bezier(.55,-0.2,.35,1);
}

/* -----------------------------------------------------------------------
 * BRAND STORY
 * --------------------------------------------------------------------- */

.salon-story-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: .9fr 1.1fr;
	gap: 56px;
	align-items: center;
}
.salon-story-visual {
	position: relative;
	aspect-ratio: 5/6;
	border-radius: 20px;
	overflow: hidden;
	border: 1px solid var(--vs-line);
	box-shadow: var(--vs-shadow);
	background: radial-gradient(130% 100% at 20% 10%, #2A2216 0%, #1A150E 60%, #14100A 100%);
	display: grid;
	place-items: center;
}
.salon-story-leaf { width: 50%; max-width: 220px; color: var(--vs-gold); opacity: .5; }
.salon-story-copy .salon-section-title { text-align: left; font-size: clamp(28px, 3.6vw, 44px); }
.salon-story-text { margin-top: 18px; color: var(--vs-text); }
.salon-story-text p { margin: 0 0 14px; }
.salon-story-sign {
	margin-top: 22px;
	font-family: var(--ast-heading-font-family, 'Playfair Display', serif);
	font-style: italic;
	font-size: 22px;
	color: var(--vs-gold);
}

/* -----------------------------------------------------------------------
 * TESTIMONIAL
 * --------------------------------------------------------------------- */

.salon-quote { max-width: 760px; margin: 0 auto; text-align: center; }
.salon-quote-mark {
	font-family: var(--ast-heading-font-family, 'Playfair Display', serif);
	font-size: 90px;
	line-height: .4;
	color: var(--vs-gold-deep);
	display: block;
}
.salon-quote blockquote {
	font-family: var(--ast-heading-font-family, 'Playfair Display', serif);
	font-style: italic;
	font-size: clamp(23px, 3vw, 33px);
	color: var(--vs-heading);
	line-height: 1.4;
	margin: 22px auto 0;
	border: none;
	padding: 0;
}
.salon-quote-stars { color: var(--vs-gold); letter-spacing: 4px; margin-top: 16px; }
.salon-quote-who {
	margin-top: 12px;
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--vs-muted);
}

/* -----------------------------------------------------------------------
 * NEWSLETTER / CTA
 * --------------------------------------------------------------------- */

.salon-cta {
	max-width: 1000px;
	margin: 0 auto;
	background: linear-gradient(160deg, #201A12, #14100A);
	border: 1px solid var(--vs-line);
	border-radius: 26px;
	padding: 66px 40px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.salon-cta-glow {
	position: absolute;
	width: 440px;
	height: 440px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(217,178,106,.28), transparent 70%);
	top: -200px;
	left: 50%;
	transform: translateX(-50%);
	pointer-events: none;
}
.salon-cta-title { position: relative; font-size: clamp(28px, 3.6vw, 44px); margin: 16px auto 0; max-width: 20ch; }
.salon-cta-desc { position: relative; color: var(--vs-muted); margin: 14px auto 28px; max-width: 46ch; }
.salon-cta-actions { position: relative; justify-content: center; }

/* -----------------------------------------------------------------------
 * STICKY OFFER PILL
 * --------------------------------------------------------------------- */

.salon-offer-pill {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 90;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--vs-gold);
	color: #1c1508;
	padding: 14px 22px;
	border-radius: 40px;
	box-shadow: 0 16px 34px -12px rgba(217,178,106,.6);
	font-family: var(--ast-body-font-family, 'Poppins', sans-serif);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none;
	opacity: 0;
	transform: translateY(20px);
	pointer-events: none;
	transition: opacity .35s ease, transform .35s ease;
}
.salon-offer-pill.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.salon-offer-pill:hover { color: #1c1508; transform: translateY(-3px) scale(1.02); }
.salon-offer-dot { width: 8px; height: 8px; border-radius: 50%; background: #1c1508; animation: salon-pulse 1.6s infinite; }
@keyframes salon-pulse { 0%,100% { opacity: .4; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.3); } }
@media ( prefers-reduced-motion: reduce ) { .salon-offer-dot { animation: none; } }

/* -----------------------------------------------------------------------
 * FOOTER
 * --------------------------------------------------------------------- */

.salon-footer {
	background: #0F0C07;
	color: rgba(244,236,221,.72);
	padding: 66px 24px 52px;
	margin-top: 0;
	border-top: 1px solid var(--vs-line);
}
.salon-footer-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	gap: 44px;
}
.salon-footer-logo {
	font-family: var(--ast-heading-font-family, 'Playfair Display', serif);
	font-size: 30px;
	letter-spacing: .05em;
	color: var(--vs-gold);
	margin-bottom: 14px;
}
.salon-footer-tagline { font-size: 14px; line-height: 1.7; margin: 0; max-width: 320px; }
.salon-footer-heading {
	font-family: var(--ast-body-font-family, 'Poppins', sans-serif);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--vs-gold-soft);
	margin: 4px 0 18px;
}
.salon-footer-links { list-style: none; margin: 0; padding: 0; }
.salon-footer-links li { margin: 0 0 10px; font-size: 14px; }
.salon-footer-links a { color: rgba(244,236,221,.72); text-decoration: none; transition: color .2s ease; }
.salon-footer-links a:hover { color: var(--vs-gold); }

footer.site-footer {
	background-color: #0B0906;
	border-top: 1px solid var(--vs-line);
}
footer.site-footer,
footer.site-footer .ast-builder-html-element { color: rgba(244,236,221,.55); font-size: 13px; }
footer.site-footer a { color: rgba(244,236,221,.8); }
footer.site-footer a:hover { color: var(--vs-gold); }

/* =======================================================================
 * WOOCOMMERCE SHOPPING SURFACES
 * ===================================================================== */

.woocommerce-result-count { color: var(--vs-muted); font-size: 14px; }
.woocommerce-ordering select,
select.orderby {
	background-color: var(--vs-surface-2);
	border: 1px solid var(--vs-line);
	border-radius: 30px;
	padding: 8px 36px 8px 16px;
	font-size: 14px;
	color: var(--vs-heading);
}

/* Shop grid product cards (dark card, light image well) */
.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 26px;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	width: 100% !important;
	margin: 0 !important;
	float: none !important;
	background-color: var(--vs-surface);
	border: 1px solid var(--vs-line);
	border-radius: 16px;
	padding: 0;
	overflow: hidden;
	transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease;
}
.woocommerce ul.products li.product:hover {
	box-shadow: var(--vs-shadow);
	border-color: var(--vs-gold-deep);
	transform: translateY(-6px);
}
.woocommerce ul.products li.product a img {
	background: var(--vs-light);
	border-radius: 0;
	margin: 0 0 14px;
	padding: 16px;
	object-fit: contain;
	aspect-ratio: 1/1;
	transition: transform .5s ease;
}
.woocommerce ul.products li.product:hover a img { transform: scale(1.05); }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .star-rating,
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .ast-woo-product-category {
	margin-left: 18px;
	margin-right: 18px;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--ast-heading-font-family, 'Playfair Display', serif);
	font-size: 16px;
	color: var(--vs-heading);
	margin-top: 6px;
}
.woocommerce ul.products li.product .price { color: var(--vs-gold); font-weight: 600; }
.woocommerce ul.products li.product .price del { color: var(--vs-muted); opacity: .7; font-weight: 400; }
.woocommerce ul.products li.product .star-rating { color: var(--vs-gold); }
.woocommerce ul.products li.product .button { margin-bottom: 20px; }
/* Equal-height cards: push the "Į krepšelį" button to the bottom so buttons
   line up across a row even when product names differ in length. */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}
.woocommerce ul.products li.product .astra-shop-summary-wrap .button {
	margin-top: auto;
}

/* Sale badges (classic + modern) */
.woocommerce span.onsale {
	position: absolute; top: 14px; left: 14px;
	box-shadow: 0 4px 14px rgba(217,178,106,.4);
	animation: salon-badge-pulse 2.4s ease-in-out infinite;
	z-index: 2;
}
.woocommerce span.onsale,
.woocommerce span.ast-onsale-card,
.ast-onsale-card {
	background-color: var(--vs-gold);
	color: #1c1508;
	border-radius: 20px;
	min-width: auto; height: auto; line-height: 1;
	padding: 7px 14px;
	font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
@keyframes salon-badge-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }
@media ( prefers-reduced-motion: reduce ) { .woocommerce span.onsale { animation: none; } }

.astra-shop-thumbnail-wrap .ast-on-card-button:not(.ast-onsale-card) {
	background-color: var(--vs-surface);
	color: var(--vs-gold);
	box-shadow: var(--vs-shadow);
	border-radius: 50%;
}
.astra-shop-thumbnail-wrap .ast-on-card-button:not(.ast-onsale-card):hover {
	background-color: var(--vs-gold); color: #1c1508;
}

/* Filter sidebar */
#secondary .widget {
	background-color: var(--vs-surface);
	border: 1px solid var(--vs-line);
	border-radius: 12px;
	padding: 24px 22px;
	margin-bottom: 24px;
}
#secondary .widget-title {
	font-size: 17px;
	color: var(--vs-heading);
	margin-bottom: 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--vs-line);
}
#secondary .widget ul { list-style: none; margin: 0; padding: 0; }
#secondary .widget ul li { margin: 0 0 8px; font-size: 14px; }
#secondary .widget ul li a { color: var(--vs-text); text-decoration: none; }
#secondary .widget ul li a:hover,
#secondary .widget_product_categories li.current-cat > a { color: var(--vs-gold); }
#secondary .widget_product_categories li .count { color: var(--vs-muted); font-size: 12px; }

#secondary .price_slider_wrapper .ui-slider {
	background-color: var(--vs-surface-2);
	border: none; height: 6px; border-radius: 3px; margin-bottom: 18px;
}
#secondary .price_slider_wrapper .ui-slider .ui-slider-range { background-color: var(--vs-gold); }
#secondary .price_slider_wrapper .ui-slider .ui-slider-handle {
	background-color: var(--vs-gold); border: 2px solid var(--vs-surface);
	width: 16px; height: 16px; top: -5px; border-radius: 50%;
}
#secondary .price_slider_amount .price_label { font-size: 13px; color: var(--vs-text); }
#secondary .widget_layered_nav_filters ul li a {
	display: inline-block;
	background-color: var(--vs-surface-2);
	border: 1px solid var(--vs-line);
	border-radius: 20px; padding: 5px 12px; font-size: 13px; color: var(--vs-heading);
}
#secondary .widget_rating_filter .star-rating { color: var(--vs-gold); }

/* Pagination */
.woocommerce nav.woocommerce-pagination ul { border: none; display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.woocommerce nav.woocommerce-pagination ul li { border: none; overflow: visible; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	width: 40px; height: 40px; line-height: 40px; padding: 0; text-align: center;
	border-radius: 50%; border: 1px solid var(--vs-line);
	background-color: var(--vs-surface); color: var(--vs-heading); transition: all .2s ease;
}
.woocommerce nav.woocommerce-pagination ul li a:hover {
	background-color: var(--vs-surface-2); border-color: var(--vs-gold); color: var(--vs-gold);
}
.woocommerce nav.woocommerce-pagination ul li span.current {
	background-color: var(--vs-gold); border-color: var(--vs-gold); color: #1c1508; font-weight: 700;
}

/* -----------------------------------------------------------------------
 * Single product
 * --------------------------------------------------------------------- */

.woocommerce .woocommerce-breadcrumb { font-size: 13px; color: var(--vs-muted); }
.woocommerce .woocommerce-breadcrumb a { color: var(--vs-gold); }

.woocommerce div.product .product_title { font-size: 34px; margin-bottom: 10px; }
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--vs-gold); font-size: 26px; font-weight: 600; }
.woocommerce div.product p.price del { color: var(--vs-muted); opacity: .6; font-weight: 400; font-size: 20px; }
.woocommerce div.product .woocommerce-product-details__short-description { color: var(--vs-text); line-height: 1.8; }

/* Gallery: light well + hard height cap so very tall product photos (some are
   600×1209) don't blow up the column. Image is centered and contained. */
.woocommerce div.product div.images { max-width: 460px; }
.woocommerce div.product div.images .woocommerce-product-gallery__image {
	background: var(--vs-light);
	border-radius: 12px;
	text-align: center;
	padding: 20px;
	overflow: hidden;
}
.woocommerce div.product div.images img.wp-post-image {
	max-height: 460px !important;
	width: auto !important;
	height: auto !important;
	margin: 0 auto !important;
	display: inline-block !important;
	border-radius: 6px;
}
.woocommerce div.product div.images .flex-control-thumbs { background: transparent; margin-top: 12px; }
.woocommerce div.product div.images .flex-control-thumbs li img {
	border-radius: 8px; border: 2px solid transparent; opacity: .7;
	transition: opacity .2s ease, border-color .2s ease; background: var(--vs-light);
}
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs li img:hover { border-color: var(--vs-gold); opacity: 1; }

/* Quantity + add to cart */
.woocommerce div.product form.cart .quantity {
	display: inline-flex; align-items: center;
	border: 1px solid var(--vs-line); border-radius: 30px; overflow: hidden;
	background-color: var(--vs-surface-2);
}
.woocommerce div.product form.cart .quantity .qty {
	border: none; background: transparent; width: 52px; text-align: center;
	font-weight: 600; color: var(--vs-heading);
}
.ast-qty-placeholder {
	display: inline-block; width: 38px; line-height: 38px; text-align: center;
	font-size: 18px; color: var(--vs-gold); text-decoration: none; user-select: none;
}
.ast-qty-placeholder:hover { background-color: var(--vs-gold); color: #1c1508; }
.woocommerce div.product form.cart .button.single_add_to_cart_button { padding: 14px 34px; white-space: normal; }
.woocommerce div.product .product_meta {
	font-size: 13px; color: var(--vs-muted);
	border-top: 1px solid var(--vs-line); padding-top: 16px; margin-top: 20px;
}
.woocommerce div.product .product_meta a { color: var(--vs-gold); }

/* Info tabs: gold underline nav */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0; margin: 0 0 0; border-bottom: 1px solid var(--vs-line); background: none;
	display: flex; flex-wrap: nowrap; overflow-x: auto;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: none; border: none; border-radius: 0; margin: 0 28px 0 0; padding: 0; white-space: nowrap;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	padding: 14px 2px; color: var(--vs-muted); font-weight: 500;
	border-bottom: 2px solid transparent; transition: color .2s ease, border-color .2s ease;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--vs-heading); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--vs-heading); border-bottom-color: var(--vs-gold); }
.woocommerce div.product .woocommerce-tabs .panel {
	background: none; border: none; padding: 28px 0 0; margin: 0; color: var(--vs-text); line-height: 1.8;
}
.woocommerce div.product .woocommerce-tabs .panel h2:first-of-type { font-size: 22px; margin-bottom: 16px; }

.woocommerce .related.products > h2,
.woocommerce .up-sells.products > h2 { font-size: 26px; margin: 56px 0 28px; text-align: center; }

/* -----------------------------------------------------------------------
 * Cart / checkout / account — dark, on-brand panels (match the whole site)
 * Product photos keep their own light wells elsewhere; here the surfaces are
 * dark with light text + gold accents, and inputs are dark inset wells.
 * --------------------------------------------------------------------- */

.woocommerce-cart table.shop_table,
.woocommerce-cart .cart_totals,
.woocommerce-checkout .woocommerce-checkout-review-order-table,
.woocommerce-checkout #payment,
.woocommerce-checkout #customer_details,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-navigation ul,
.woocommerce .woocommerce-form-login,
.woocommerce .woocommerce-form-register {
	background-color: var(--vs-surface);
	border: 1px solid var(--vs-line);
	border-radius: 12px;
	color: var(--vs-text);
}

/* Body text inside those panels */
.woocommerce-cart table.shop_table td,
.woocommerce-cart .cart_totals td,
.woocommerce-checkout .woocommerce-checkout-review-order-table td,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-checkout #payment,
.woocommerce-checkout #payment label { color: var(--vs-text); }

/* Panel headings + payment method label in cream */
.woocommerce-cart .cart_totals h2,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #customer_details h3,
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3,
.woocommerce .woocommerce-form-login h2,
.woocommerce .woocommerce-form-register h2,
.woocommerce-checkout #payment ul.payment_methods li label { color: var(--vs-heading); }

/* Amounts stand out */
.woocommerce-cart table.shop_table td.product-subtotal,
.woocommerce .cart_totals .order-total td,
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total td { color: var(--vs-heading); font-weight: 600; }

/* Table header rows */
.woocommerce-cart table.shop_table thead th,
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
	background-color: var(--vs-surface-2);
	color: var(--vs-heading);
}

/* Cell / row separators */
.woocommerce-cart table.shop_table td,
.woocommerce-cart table.shop_table th,
.woocommerce .cart_totals table th,
.woocommerce .cart_totals table td,
.woocommerce-checkout .woocommerce-checkout-review-order-table td,
.woocommerce-checkout .woocommerce-checkout-review-order-table th { border-color: var(--vs-line); }
.woocommerce-cart .cart_totals th { color: var(--vs-text); background-color: transparent; }

/* Cart-totals heading: WooCommerce/Astra give it a near-white background —
   clear it so the cream heading reads on the dark card. */
.woocommerce-cart .cart_totals h2 {
	background-color: transparent !important;
	padding: 22px 24px 14px;
	margin: 0;
	border-bottom: 1px solid var(--vs-line);
}
.woocommerce-cart .cart_totals table.shop_table { margin: 0; }

.woocommerce-cart table.cart img { border-radius: 6px; width: 64px; }

/* Product links inside cart / checkout stay gold */
.woocommerce-cart td.product-name a,
.woocommerce-checkout .product-name a { color: var(--vs-gold); }

/* Remove-item "×" */
.woocommerce-cart td.product-remove a.remove {
	color: var(--vs-muted) !important;
	font-size: 20px;
	font-weight: 400;
	transition: color .2s ease, background-color .2s ease;
}
.woocommerce-cart td.product-remove a.remove:hover {
	color: #fff !important;
	background-color: #b0402e !important;
}

/* Form fields — dark inset wells with light text */
.woocommerce form .form-row label { color: var(--vs-text); font-size: 14px; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-cart table.cart td.actions .coupon .input-text,
.select2-container--default .select2-selection--single {
	border: 1px solid var(--vs-line);
	border-radius: 8px;
	padding: 11px 14px;
	background-color: var(--vs-bg-2);
	color: var(--vs-heading);
}
.woocommerce form .form-row input.input-text::placeholder,
.woocommerce form .form-row textarea::placeholder { color: var(--vs-muted); }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	border-color: var(--vs-gold); outline: none;
	box-shadow: 0 0 0 3px rgba(217,178,106,.22);
}

/* select2 country dropdown — !important + extra specificity because select2's
   own stylesheet can load after ours and win an otherwise-tied rule. */
.woocommerce .select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--single {
	background-color: var(--vs-bg-2) !important;
	border: 1px solid var(--vs-line) !important;
	color: var(--vs-heading);
}
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--vs-heading) !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: var(--vs-muted) transparent transparent transparent; }
.select2-dropdown { background-color: var(--vs-surface-2) !important; border-color: var(--vs-line) !important; color: var(--vs-text); }
.select2-container--default .select2-results__option { color: var(--vs-text); }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: var(--vs-gold) !important; color: #1c1508 !important; }
.select2-search--dropdown .select2-search__field { background-color: var(--vs-bg-2); border-color: var(--vs-line); color: var(--vs-heading); }

/* Quantity stepper */
.woocommerce .quantity input.qty,
.woocommerce .quantity .minus,
.woocommerce .quantity .plus {
	background-color: var(--vs-surface-2);
	border: 1px solid var(--vs-line);
	color: var(--vs-heading);
}

/* Payment method box (bank transfer description). Doubled class + !important
   because WooCommerce sets its light #efefef background with equal/!important
   specificity that otherwise wins. */
.woocommerce-checkout #payment ul.payment_methods { border-bottom-color: var(--vs-line); }
.woocommerce-checkout #payment div.payment_box.payment_box {
	background-color: var(--vs-bg-2) !important;
	color: var(--vs-text) !important;
}
.woocommerce-checkout #payment div.payment_box.payment_box::before { border-bottom-color: var(--vs-bg-2) !important; }
.woocommerce-checkout #payment .payment_box a,
.woocommerce-checkout #payment .woocommerce-privacy-policy-text a { color: var(--vs-gold); }

/* Full-width primary buttons */
.woocommerce #payment #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { display: block; width: 100%; text-align: center; padding: 16px 20px; }
.woocommerce-cart .cart_totals table.shop_table { border: none; }

/* Checkout billing column: full width inside its panel */
.woocommerce-checkout #customer_details { padding: 30px 32px 16px; }
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	width: 100%;
	max-width: 100%;
	float: none;
	padding: 0;
}
.woocommerce-checkout #customer_details label,
.woocommerce-checkout #customer_details .woocommerce-form__label-for-checkbox,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper label { color: var(--vs-text); }
.woocommerce-checkout #customer_details .woocommerce-additional-fields { margin-top: 4px; }

/* Order summary: auto column widths so the product name gets the room and the
   amounts stay tight. (A fixed split pinned the paštomatas selector into a
   narrow column and truncated the selected location.) */
.woocommerce-checkout .woocommerce-checkout-review-order-table { width: 100%; }
.woocommerce-checkout .woocommerce-checkout-review-order-table th.product-total,
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td { white-space: nowrap; text-align: right; }
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name {
	overflow: hidden; /* contains the floated thumbnail */
	overflow-wrap: anywhere;
	font-size: 13.5px;
	line-height: 1.45;
}

/* Small product thumbnail beside each order-summary line (image is prepended
   in salon-shop.php, scoped to the review table). */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name img.vs-review-thumb {
	float: left;
	width: 46px;
	height: 46px;
	margin: 2px 12px 2px 0;
	border-radius: 6px;
	border: 1px solid var(--vs-line);
	object-fit: cover;
	background: var(--vs-light);
}

/* Comfortable horizontal padding — cells were flush to the card edge. */
.woocommerce-checkout .woocommerce-checkout-review-order-table th:first-child,
.woocommerce-checkout .woocommerce-checkout-review-order-table td:first-child { padding-left: 22px; }
.woocommerce-checkout .woocommerce-checkout-review-order-table th:last-child,
.woocommerce-checkout .woocommerce-checkout-review-order-table td:last-child { padding-right: 22px; }

/* Shipping row spans the full summary width so the paštomatas selector shows
   the whole selected location instead of truncating in the narrow column. */
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals {
	display: block;
	padding: 8px 22px 12px;
	border-bottom: 1px solid var(--vs-line);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals td {
	display: block;
	width: 100%;
	padding: 2px 0;
	text-align: left !important;
	border: 0;
}
/* The paštomatas picker is a select2 widget — force it (and its wrapper) to
   fill the full-width row so the selected location isn't truncated. */
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals .woo_lithuaniapost_lpexpress_terminal_select_container,
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals .select2-container,
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals select {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
	margin-top: 8px;
}

/* My account nav pills */
.woocommerce-account .woocommerce-MyAccount-navigation ul { padding: 10px; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li { margin: 0; border: none; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
	display: block; padding: 11px 16px; border-radius: 8px; color: var(--vs-text);
	text-decoration: none; transition: background-color .2s ease, color .2s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover { background-color: var(--vs-surface-2); color: var(--vs-heading); }
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a { background-color: var(--vs-gold); color: #1c1508; font-weight: 600; }
.woocommerce-account .woocommerce-MyAccount-content { padding: 30px; }
.woocommerce-account .woocommerce-MyAccount-content a { color: var(--vs-gold); }

/* Notices */
.woocommerce-message, .woocommerce-info {
	border-top-color: var(--vs-gold);
	background-color: var(--vs-surface);
	color: var(--vs-heading);
}
.woocommerce-message::before, .woocommerce-info::before { color: var(--vs-gold); }

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

@media ( max-width: 1024px ) {
	.salon-cats { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 190px; }
	.salon-cat-feature { grid-row: span 2; grid-column: span 2; }
	.salon-footer-inner { grid-template-columns: 1fr 1fr; }
	.woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(2, 1fr); }
}

@media ( max-width: 921px ) {
	/* Left shop sidebar drops below products */
	.ast-left-sidebar #content > .ast-container { display: flex; flex-direction: column; }
	.ast-left-sidebar #content > .ast-container > #secondary { order: 2; width: 100%; max-width: 100%; }
	.ast-left-sidebar #content > .ast-container > #primary { order: 1; }
}

@media ( max-width: 900px ) {
	.salon-hero-inner { grid-template-columns: 1fr; padding: 44px 0 60px; gap: 30px; }
	.salon-hero-visual { max-width: 400px; width: 100%; margin: 8px auto 0; }
	.salon-hero-badge { left: 6px; }
	.salon-trust-inner { grid-template-columns: 1fr 1fr; }
	.salon-story-inner { grid-template-columns: 1fr; gap: 30px; }
	.salon-story-copy .salon-section-title { text-align: center; }
}

@media ( max-width: 768px ) {
	.salon-section { padding: 62px 20px; }
	body { background-attachment: scroll; }
	/* Prevent iOS zoom + comfortable touch targets */
	.woocommerce form .form-row input.input-text,
	.woocommerce form .form-row textarea,
	.woocommerce form .form-row select,
	.ast-search-menu-icon .search-field { font-size: 16px; }
	.woocommerce a.button, .woocommerce button.button, .ast-button,
	.woocommerce #payment #place_order,
	.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { min-height: 44px; }
	.woocommerce .woocommerce-result-count,
	.woocommerce .woocommerce-ordering { float: none; text-align: center; margin-bottom: 14px; }
	.woocommerce-ordering select, select.orderby { width: 100%; max-width: 320px; }
	/* Classic cart stacks */
	.woocommerce-cart table.shop_table_responsive thead { display: none; }
	.woocommerce-cart table.shop_table_responsive tr { display: block; border-bottom: 1px solid var(--vs-line); }
	.woocommerce-cart table.shop_table_responsive tr td { display: block; text-align: right; border: none; }
	.woocommerce-cart table.shop_table_responsive tr td::before { content: attr(data-title) ": "; float: left; font-weight: 600; color: var(--vs-text); }
	.woocommerce-cart table.shop_table_responsive tr td.actions::before,
	.woocommerce-cart table.shop_table_responsive tr td.product-remove::before { content: ""; }
	/* Checkout single column */
	.woocommerce-checkout #customer_details .col-1,
	.woocommerce-checkout #customer_details .col-2 { width: 100%; float: none; }
	/* Account nav above content */
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content { width: 100%; float: none; }
	.woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 20px; }
}

@media ( max-width: 600px ) {
	.salon-cats { grid-template-columns: 1fr; grid-auto-rows: 200px; }
	.salon-cat-feature { grid-row: span 1; grid-column: span 1; }
	.salon-trust-inner { grid-template-columns: 1fr; }
	.salon-footer-inner { grid-template-columns: 1fr; gap: 30px; }
	.salon-footer { padding: 48px 20px 40px; }
	.salon-cta { padding: 44px 24px; }
	.salon-showcase-head { flex-direction: column; align-items: flex-start; gap: 14px; }
	.woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: 1fr; }
	.woocommerce div.product .product_title { font-size: 28px; }
	.salon-offer-pill { right: 14px; bottom: 14px; padding: 12px 18px; }
}