/*
Theme Name: AU Unique — Noir
Theme URI: https://au-unique.co.uk
Author: AU Unique
Author URI: https://au-unique.co.uk
Description: Luxury dark redesign of AU Unique — salon furniture first, cinematic hero, premium editorial layout.
Version: 2.0.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: au-unique-noir
Tags: custom-background, custom-logo, custom-menu, featured-images, woocommerce
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Jost:wght@300;400;500;600;700&display=swap');

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
  --dark:       #141412;
  --dark-mid:   #1e1e1b;
  --dark-card:  #252520;
  --dark-hover: #2a2a26;
  --gold:       #b5912a;
  --gold-lt:    #d4ad58;
  --gold-dim:   rgba(181,145,42,.15);
  --cream:      #f5f2ec;
  --white:      #ffffff;
  --border:     #2a2a26;
  --border-lt:  #e8e4de;
  --text:       rgba(255,255,255,.85);
  --text-muted: rgba(255,255,255,.45);
  --text-dim:   rgba(255,255,255,.2);

  --ff-display: 'Cormorant Garamond', Georgia, serif;
  --ff-body:    'Jost', sans-serif;

  --ease:       cubic-bezier(.4,0,.2,1);
  --transition: .3s var(--ease);

  --max-w: 1200px;
  --radius: 0px;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: var(--ff-body);
  background: var(--dark-mid);
  color: var(--text);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: var(--ff-body); cursor: pointer; border: none; }

/* ============================================================
   UTILITY
   ============================================================ */
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 40px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

/* Section spacing */
.section { padding: 80px 0; }
.section-sm { padding: 56px 0; }

/* Eyebrow label */
.eyebrow {
  font-size: 9px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.eyebrow::before {
  content: '';
  display: block;
  width: 24px;
  height: 1px;
  background: var(--gold);
  flex-shrink: 0;
}

/* Display heading */
.display-heading {
  font-family: var(--ff-display);
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.02em;
  color: var(--white);
}
.display-heading em {
  font-style: italic;
  color: var(--gold);
}

/* Section title */
.section-title {
  font-family: var(--ff-display);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -.02em;
  color: var(--white);
}
.section-title.dark { color: var(--dark-mid); }

/* Gold divider */
.gold-line {
  width: 40px;
  height: 1px;
  background: var(--gold);
  margin: 20px 0;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  font-family: var(--ff-body);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  transition: background var(--transition), color var(--transition), border-color var(--transition), transform var(--transition);
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn-gold { background: var(--gold); color: var(--white); }
.btn-gold:hover { background: var(--gold-lt); }
.btn-dark { background: var(--dark-mid); color: var(--white); border: 1px solid var(--dark-mid); }
.btn-dark:hover { background: var(--gold); border-color: var(--gold); }
.btn-outline { background: transparent; color: var(--white); border: 1px solid rgba(255,255,255,.3); }
.btn-outline:hover { border-color: var(--white); background: rgba(255,255,255,.06); }
.btn-outline-gold { background: transparent; color: var(--gold); border: 1px solid var(--gold); }
.btn-outline-gold:hover { background: var(--gold); color: var(--white); }
.btn-cream { background: var(--cream); color: var(--dark-mid); }
.btn-cream:hover { background: var(--white); }
.btn-full { width: 100%; justify-content: center; }

/* Text link */
.text-link {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 2px;
  transition: color var(--transition), border-color var(--transition);
}
.text-link:hover { color: var(--gold-lt); border-color: var(--gold-lt); }

/* ============================================================
   TOP ANNOUNCEMENT BAR
   ============================================================ */
.top-bar {
  background: var(--dark);
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.top-bar .container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 48px;
  flex-wrap: wrap;
}
.top-bar-item {
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
  display: flex;
  align-items: center;
  gap: 8px;
}
.top-bar-item .icon { color: var(--gold); font-size: 10px; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  background: rgba(20,20,18,.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
  position: sticky;
  top: 0;
  z-index: 1000;
  transition: box-shadow var(--transition);
}
.site-header.scrolled {
  box-shadow: 0 4px 40px rgba(0,0,0,.4);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 40px;
}

/* Logo */
.site-logo {
  display: flex;
  align-items: baseline;
  gap: 8px;
  text-decoration: none;
  flex-shrink: 0;
}
.logo-au {
  font-family: var(--ff-display);
  font-size: 28px;
  font-weight: 500;
  color: var(--white);
  letter-spacing: -.03em;
  line-height: 1;
}
.logo-wordmark {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}
.logo-wordmark .name {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--white);
}
.logo-wordmark .sub {
  font-size: 7px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
}

/* Primary nav */
.primary-nav {
  display: flex;
  align-items: center;
  gap: 32px;
}
.primary-nav > li { position: relative; }
.primary-nav > li > a {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.65);
  padding: 8px 0;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: color var(--transition);
  position: relative;
}
.primary-nav > li > a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--gold);
  transition: width var(--transition);
}
.primary-nav > li > a:hover,
.primary-nav > li > a.active {
  color: var(--white);
}
.primary-nav > li > a:hover::after,
.primary-nav > li > a.active::after {
  width: 100%;
}
.primary-nav > li > a.active { color: var(--gold); }
.primary-nav > li > a.active::after { background: var(--gold); width: 100%; }

/* Dropdown */
.primary-nav li ul.sub-menu {
  position: absolute;
  top: calc(100% + 12px);
  left: -16px;
  background: var(--dark);
  border: 1px solid rgba(255,255,255,.08);
  min-width: 220px;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity var(--transition), transform var(--transition);
  z-index: 200;
}
.primary-nav li:hover ul.sub-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.primary-nav li ul.sub-menu li a {
  display: block;
  padding: 11px 20px;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: color var(--transition), background var(--transition), padding-left var(--transition);
}
.primary-nav li ul.sub-menu li:last-child a { border-bottom: none; }
.primary-nav li ul.sub-menu li a:hover {
  color: var(--gold);
  background: rgba(181,145,42,.06);
  padding-left: 28px;
}

/* Header icons */
.header-icons {
  display: flex;
  align-items: center;
  gap: 16px;
}
.header-icons a {
  color: rgba(255,255,255,.5);
  transition: color var(--transition);
  display: flex;
  align-items: center;
  position: relative;
}
.header-icons a:hover { color: var(--gold); }
.header-icons svg { width: 20px; height: 20px; }
.cart-count {
  position: absolute;
  top: -6px;
  right: -6px;
  width: 16px;
  height: 16px;
  background: var(--gold);
  color: var(--white);
  font-size: 8px;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.cart-count.empty { display: none; }

/* Mobile toggle */
.nav-toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--white);
  padding: 4px;
}
.nav-toggle span {
  display: block;
  width: 22px;
  height: 1px;
  background: currentColor;
  margin: 5px 0;
  transition: transform var(--transition), opacity var(--transition);
}

/* ============================================================
   HERO — CINEMATIC SPLIT
   ============================================================ */
.hero {
  display: grid;
  grid-template-columns: 55% 1fr;
  min-height: 600px;
  background: var(--dark);
}

/* Image side */
.hero-media {
  position: relative;
  overflow: hidden;
  background: var(--dark-card);
}
.hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hero-media-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 60%, var(--dark) 100%);
  pointer-events: none;
}
/* Corner decorations */
.hero-corner {
  position: absolute;
  width: 32px;
  height: 32px;
  border-color: var(--gold);
  border-style: solid;
  opacity: .5;
}
.hero-corner.tl { top: 24px; left: 24px; border-width: 1px 0 0 1px; }
.hero-corner.br { bottom: 24px; right: 24px; border-width: 0 1px 1px 0; }

/* Floating label on image */
.hero-label {
  position: absolute;
  bottom: 32px;
  left: 32px;
  background: rgba(20,20,18,.85);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.08);
  border-left: 2px solid var(--gold);
  padding: 12px 16px;
}
.hero-label-title {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--white);
}
.hero-label-sub {
  font-size: 9px;
  color: var(--gold);
  margin-top: 2px;
}

/* Content side */
.hero-content {
  padding: 64px 56px 64px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--dark);
}
.hero-content .eyebrow { margin-bottom: 20px; }
.hero-content .display-heading { margin-bottom: 16px; }
.hero-content .gold-line { margin: 20px 0; }
.hero-p {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.9;
  font-weight: 300;
  margin-bottom: 36px;
  max-width: 400px;
}
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 48px; }

/* Hero stats */
.hero-stats {
  display: flex;
  gap: 32px;
  padding-top: 32px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.hero-stat-num {
  font-family: var(--ff-display);
  font-size: 22px;
  font-weight: 400;
  color: var(--white);
  line-height: 1;
  margin-bottom: 4px;
}
.hero-stat-label {
  font-size: 8px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
}

/* ============================================================
   TRUST STRIP
   ============================================================ */
.trust-strip {
  background: var(--dark);
  border-top: 1px solid rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.04);
  padding: 20px 0;
}
.trust-strip .container {
  display: grid;
  grid-template-columns: repeat(4,1fr);
}
.trust-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 4px 28px;
  border-right: 1px solid rgba(255,255,255,.05);
}
.trust-item:first-child { padding-left: 0; }
.trust-item:last-child { border-right: none; }
.trust-icon-wrap {
  width: 36px;
  height: 36px;
  background: var(--gold-dim);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.trust-icon-wrap svg { width: 18px; height: 18px; color: var(--gold); }
.trust-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 2px;
}
.trust-desc { font-size: 9px; color: rgba(255,255,255,.3); line-height: 1.4; }

/* ============================================================
   SALON FEATURE — EDITORIAL SECTION
   ============================================================ */
.salon-editorial {
  background: var(--dark-mid);
  padding: 96px 0;
}
.salon-editorial .container {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 80px;
  align-items: center;
}
.salon-editorial-text .eyebrow { margin-bottom: 16px; }
.salon-editorial-text .section-title { margin-bottom: 20px; }
.salon-editorial-text p {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.95;
  margin-bottom: 32px;
  font-weight: 300;
}
.salon-editorial-text .btn { margin-right: 16px; }

/* Salon product grid */
.salon-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.salon-tile {
  background: var(--dark-card);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: transform var(--transition);
}
.salon-tile:hover { transform: scale(1.02); }
.salon-tile-img {
  aspect-ratio: 1;
  background: var(--dark-hover);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.salon-tile-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.salon-tile:hover .salon-tile-img img { transform: scale(1.06); }
.salon-tile.wide { grid-column: span 2; }
.salon-tile.wide .salon-tile-img { aspect-ratio: 2/1; }
.salon-tile-info {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(255,255,255,.05);
}
.salon-tile-name {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--white);
}
.salon-tile-price { font-size: 11px; color: var(--gold); margin-top: 2px; }
.salon-tile-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  background: var(--gold);
  color: var(--white);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 4px 8px;
  text-transform: uppercase;
}

/* ============================================================
   SECONDARY PRODUCTS — dark section
   ============================================================ */
.secondary-products {
  background: var(--dark);
  padding: 80px 0;
}
.section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 40px;
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.product-card {
  background: var(--dark-card);
  overflow: hidden;
  transition: transform var(--transition), box-shadow var(--transition);
  cursor: pointer;
}
.product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 60px rgba(0,0,0,.4);
}
.product-card-media {
  aspect-ratio: 4/3;
  background: var(--dark-hover);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.product-card:hover .product-card-media img { transform: scale(1.04); }
.product-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--gold);
  color: var(--white);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 4px 8px;
  text-transform: uppercase;
}
.product-card-body { padding: 20px; }
.product-card-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--white);
  margin-bottom: 4px;
  line-height: 1.4;
}
.product-card-desc {
  font-size: 10px;
  color: rgba(255,255,255,.35);
  margin-bottom: 16px;
  line-height: 1.5;
}
.product-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.05);
}
.product-price {
  font-family: var(--ff-display);
  font-size: 18px;
  font-weight: 400;
  color: var(--gold);
}
.product-arrow {
  width: 32px;
  height: 32px;
  background: rgba(181,145,42,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--transition);
}
.product-card:hover .product-arrow { background: var(--gold); }
.product-arrow svg { width: 14px; height: 14px; color: var(--gold); transition: color var(--transition); }
.product-card:hover .product-arrow svg { color: var(--white); }

/* ============================================================
   TV FEATURE CALLOUT
   ============================================================ */
.tv-callout {
  background: var(--dark-mid);
  padding: 80px 0;
}
.tv-callout .container {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 64px;
  align-items: center;
}
.tv-media {
  background: var(--dark-card);
  aspect-ratio: 4/3;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tv-media img { width: 100%; height: 100%; object-fit: cover; }
.tv-media-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to top, rgba(0,0,0,.7) 0%, transparent 100%);
  padding: 20px;
}
.tv-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(255,255,255,.05);
  margin: 28px 0;
}
.tv-stat {
  background: var(--dark-mid);
  padding: 20px 0 20px 20px;
  border-left: 2px solid var(--gold);
}
.tv-stat-num {
  font-family: var(--ff-display);
  font-size: 26px;
  font-weight: 400;
  color: var(--white);
  line-height: 1;
  margin-bottom: 4px;
}
.tv-stat-label {
  font-size: 8px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
}

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how-it-works {
  background: var(--dark);
  padding: 80px 0;
  text-align: center;
}
.how-it-works .eyebrow { justify-content: center; }
.how-it-works .eyebrow::before { display: none; }
.how-it-works .section-title { margin: 8px 0 8px; }
.hiw-sub {
  font-size: 12px;
  color: rgba(255,255,255,.3);
  margin-bottom: 56px;
  letter-spacing: .03em;
}
.steps-row {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 0;
  position: relative;
}
.steps-row::before {
  content: '';
  position: absolute;
  top: 30px;
  left: calc(12.5% + 16px);
  right: calc(12.5% + 16px);
  height: 1px;
  background: rgba(255,255,255,.06);
}
.step { padding: 0 24px; position: relative; }
.step-circle {
  width: 60px;
  height: 60px;
  border: 1px solid rgba(181,145,42,.3);
  background: var(--dark-mid);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  font-family: var(--ff-display);
  font-size: 20px;
  font-weight: 400;
  color: var(--gold);
  position: relative;
  z-index: 1;
}
.step-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 10px;
}
.step-desc {
  font-size: 11px;
  color: rgba(255,255,255,.35);
  line-height: 1.7;
}

/* ============================================================
   REVIEWS
   ============================================================ */
.reviews-section {
  background: var(--dark-mid);
  padding: 80px 0;
}
.reviews-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 40px;
}
.trustpilot-score {
  text-align: right;
}
.tp-num {
  font-family: var(--ff-display);
  font-size: 40px;
  font-weight: 400;
  color: var(--white);
  line-height: 1;
}
.tp-stars { color: #00b67a; letter-spacing: 3px; font-size: 14px; margin: 4px 0; }
.tp-label { font-size: 9px; color: rgba(255,255,255,.3); letter-spacing: .1em; text-transform: uppercase; }
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 16px;
}
.review-card {
  background: var(--dark-card);
  padding: 32px;
  border-left: 2px solid var(--gold);
  transition: background var(--transition);
}
.review-card:hover { background: var(--dark-hover); }
.review-stars { color: var(--gold); font-size: 11px; letter-spacing: 3px; margin-bottom: 16px; }
.review-text {
  font-size: 13px;
  color: rgba(255,255,255,.55);
  line-height: 1.85;
  font-style: italic;
  font-family: var(--ff-display);
  margin-bottom: 20px;
}
.review-meta { padding-top: 16px; border-top: 1px solid rgba(255,255,255,.05); }
.review-author { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.review-location { font-size: 9px; color: rgba(255,255,255,.25); margin-top: 3px; }

/* ============================================================
   CTA BAND
   ============================================================ */
.cta-band {
  background: var(--gold);
  padding: 64px 0;
}
.cta-band .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}
.cta-heading {
  font-family: var(--ff-display);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 400;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 8px;
  letter-spacing: -.02em;
}
.cta-sub { font-size: 12px; color: rgba(255,255,255,.75); font-weight: 300; }
.cta-actions { display: flex; gap: 12px; flex-shrink: 0; }

/* ============================================================
   FOOTER TRUST
   ============================================================ */
.footer-trust {
  background: var(--dark);
  border-top: 1px solid rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.04);
  padding: 28px 0;
}
.footer-trust .container {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 0;
}
.ft-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 24px;
  border-right: 1px solid rgba(255,255,255,.05);
}
.ft-item:first-child { padding-left: 0; }
.ft-item:last-child { border-right: none; }
.ft-icon svg { width: 22px; height: 22px; color: var(--gold); flex-shrink: 0; }
.ft-label { font-size: 10px; font-weight: 600; color: var(--white); margin-bottom: 2px; }
.ft-desc { font-size: 9px; color: rgba(255,255,255,.3); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
  background: var(--dark);
  padding: 64px 0 28px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}
.footer-brand-desc {
  font-size: 11px;
  color: rgba(255,255,255,.3);
  line-height: 1.8;
  margin: 14px 0 20px;
}
.footer-col h4 {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
}
.footer-col ul li { margin-bottom: 10px; }
.footer-col ul li a {
  font-size: 11px;
  color: rgba(255,255,255,.3);
  transition: color var(--transition);
}
.footer-col ul li a:hover { color: var(--gold); }
.social-links { display: flex; gap: 12px; margin-top: 4px; }
.social-link {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color var(--transition), background var(--transition);
}
.social-link:hover { border-color: var(--gold); background: var(--gold-dim); }
.social-link svg { width: 14px; height: 14px; color: rgba(255,255,255,.4); transition: color var(--transition); }
.social-link:hover svg { color: var(--gold); }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.05);
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.footer-bottom span { font-size: 10px; color: rgba(255,255,255,.2); letter-spacing: .04em; }
.footer-bottom a { color: rgba(255,255,255,.2); transition: color var(--transition); }
.footer-bottom a:hover { color: var(--gold); }

/* ============================================================
   WOOCOMMERCE — NOIR OVERRIDES
   ============================================================ */

/* Shop page */
.woocommerce .wc-page-wrap {
  background: var(--dark-mid) !important;
  padding: 3rem 0 5rem !important;
}

/* Page banner */
.noir-page-banner {
  background: var(--dark);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 48px 0;
}
.noir-page-banner h1 {
  font-family: var(--ff-display) !important;
  font-size: clamp(1.8rem, 4vw, 3rem) !important;
  font-weight: 400 !important;
  color: var(--white) !important;
  letter-spacing: -.02em !important;
  margin-bottom: 6px !important;
}
.noir-page-banner .woocommerce-breadcrumb {
  font-size: 9px !important;
  color: rgba(255,255,255,.3) !important;
  letter-spacing: .08em !important;
}
.noir-page-banner .woocommerce-breadcrumb a {
  color: rgba(255,255,255,.3) !important;
  transition: color var(--transition) !important;
}
.noir-page-banner .woocommerce-breadcrumb a:hover { color: var(--gold) !important; }

/* Product loop */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(3,1fr) !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  width: 100% !important;
}
@media (max-width: 900px) {
  .woocommerce ul.products { grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width: 540px) {
  .woocommerce ul.products { grid-template-columns: 1fr !important; }
}

.woocommerce ul.products li.product {
  background: var(--dark-card) !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
  width: auto !important;
  transition: transform var(--transition), box-shadow var(--transition) !important;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.4) !important;
}
.woocommerce ul.products li.product a img {
  margin: 0 !important;
  aspect-ratio: 4/3 !important;
  object-fit: cover !important;
  width: 100% !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--ff-body) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--white) !important;
  padding: 16px 18px 4px !important;
  letter-spacing: .01em !important;
}
.woocommerce ul.products li.product .price {
  color: var(--gold) !important;
  font-family: var(--ff-display) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  padding: 0 18px !important;
}
.woocommerce ul.products li.product .price del {
  color: rgba(255,255,255,.25) !important;
  font-size: 11px !important;
}
.woocommerce ul.products li.product .button {
  background: transparent !important;
  color: var(--gold) !important;
  border: 1px solid rgba(181,145,42,.3) !important;
  font-family: var(--ff-body) !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  margin: 12px 18px 18px !important;
  padding: 10px 20px !important;
  transition: background var(--transition), border-color var(--transition) !important;
}
.woocommerce ul.products li.product .button:hover {
  background: var(--gold) !important;
  color: var(--white) !important;
  border-color: var(--gold) !important;
}
.woocommerce span.onsale {
  background: var(--gold) !important;
  border-radius: 0 !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  padding: 5px 10px !important;
  min-width: auto !important;
  min-height: auto !important;
  line-height: 1 !important;
  top: 12px !important;
  left: 12px !important;
}
.woocommerce .star-rating { color: var(--gold) !important; }
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--white) !important;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  border-color: rgba(255,255,255,.1) !important;
  color: rgba(255,255,255,.4) !important;
  background: var(--dark-card) !important;
}

/* --- SINGLE PRODUCT & CART STYLING --- */
.single-product .woocommerce div.product .product_title { color: var(--white) !important; }
.single-product .woocommerce div.product p.price,
.single-product .woocommerce div.product span.price { color: var(--gold) !important; font-family: var(--ff-display) !important; }
.single-product .woocommerce div.product form.cart .single_add_to_cart_button { background: var(--gold) !important; border-color: var(--gold) !important; }
.single-product .woocommerce div.product form.cart .single_add_to_cart_button:hover { background: var(--gold-lt) !important; border-color: var(--gold-lt) !important; }
.woocommerce-tabs .wc-tabs li.active a { color: var(--gold) !important; }
.woocommerce-cart .cart-collaterals, .woocommerce-cart table.shop_table { background: var(--dark-card) !important; color: var(--text) !important; border-color: rgba(255,255,255,.08) !important; }
.woocommerce-cart table.shop_table th { background: var(--dark) !important; color: var(--white) !important; border-color: rgba(255,255,255,.08) !important; }
.woocommerce-cart table.shop_table td { border-color: rgba(255,255,255,.05) !important; color: var(--text) !important; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row select, .woocommerce form .form-row textarea { background: var(--dark-card) !important; border-color: rgba(255,255,255,.1) !important; color: var(--white) !important; }
.woocommerce form .form-row input.input-text:focus, .woocommerce form .form-row select:focus { border-color: var(--gold) !important; }
#place_order { background: var(--gold) !important; border-color: var(--gold) !important; }
}

/* Infinite scroll */
.au-scroll-spinner span { background: var(--gold) !important; }
.au-scroll-end { color: rgba(255,255,255,.25) !important; }
.au-scroll-end span { color: var(--gold) !important; }
.au-scroll-loading-text { color: rgba(255,255,255,.3) !important; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .hero { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .trust-strip .container { grid-template-columns: repeat(2,1fr); }
  .trust-item:nth-child(2) { border-right: none; }
  .footer-trust .container { grid-template-columns: repeat(2,1fr); }
  .ft-item:nth-child(2) { border-right: none; }
}
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
  .hero-media { min-height: 360px; }
  .salon-editorial .container { grid-template-columns: 1fr; gap: 40px; }
  .tv-callout .container { grid-template-columns: 1fr; gap: 40px; }
  .reviews-grid { grid-template-columns: 1fr; }
  .steps-row { grid-template-columns: repeat(2,1fr); gap: 32px; }
  .steps-row::before { display: none; }
  .product-grid { grid-template-columns: repeat(2,1fr); }
  .primary-nav { display: none; }
  .nav-toggle { display: block; }
  .cta-band .container { flex-direction: column; text-align: center; }
}
@media (max-width: 600px) {
  .container { padding: 0 20px; }
  .hero-content { padding: 40px 24px; }
  .trust-strip .container { grid-template-columns: 1fr; }
  .trust-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.05); padding: 12px 0; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-trust .container { grid-template-columns: 1fr 1fr; }
  .product-grid { grid-template-columns: 1fr; }
  .salon-grid { grid-template-columns: 1fr; }
  .salon-tile.wide { grid-column: span 1; }
  .reviews-header { flex-direction: column; align-items: flex-start; gap: 16px; }
  .hero-stats { gap: 20px; }
}

/* Mobile nav open */
.mobile-nav-open .primary-nav {
  display: flex;
  flex-direction: column;
  position: fixed;
  inset: 0;
  background: var(--dark);
  padding: 80px 32px 32px;
  z-index: 999;
  overflow-y: auto;
  gap: 0;
}
.mobile-nav-open .primary-nav > li {
  width: 100%;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.mobile-nav-open .primary-nav > li > a {
  padding: 16px 0;
  font-size: 11px;
  color: rgba(255,255,255,.6);
}

/* ============================================================
   FIXES — v2.1
   ============================================================ */

/* --- MOBILE NAV — force visible when open --- */
.mobile-nav-open .primary-nav {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    inset: 0 !important;
    background: #141412 !important;
    padding: 80px 32px 40px !important;
    z-index: 9999 !important;
    overflow-y: auto !important;
    gap: 0 !important;
    align-items: flex-start !important;
}
.mobile-nav-open .primary-nav > li {
    width: 100% !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    padding: 0 !important;
}
.mobile-nav-open .primary-nav > li > a {
    display: block !important;
    padding: 18px 0 !important;
    font-size: 13px !important;
    letter-spacing: .12em !important;
    color: rgba(255,255,255,.7) !important;
    text-transform: uppercase !important;
}
.mobile-nav-open .primary-nav > li > a:hover { color: var(--gold) !important; }
.mobile-nav-open .primary-nav li ul.sub-menu {
    position: static !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    padding-left: 16px !important;
    display: none;
}
.mobile-nav-open .primary-nav li.menu-open ul.sub-menu { display: block !important; }
.mobile-nav-open .primary-nav li ul.sub-menu li a {
    color: rgba(255,255,255,.4) !important;
    font-size: 11px !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.04) !important;
    padding-left: 0 !important;
}
/* Close button area */
.mobile-nav-open .nav-toggle {
    position: fixed !important;
    top: 20px !important;
    right: 20px !important;
    z-index: 10000 !important;
}

/* --- TRUST STRIP ICON SIZE FIX --- */
.trust-icon-wrap {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
}
.trust-icon-wrap svg {
    width: 16px !important;
    height: 16px !important;
}

/* --- FOOTER TRUST ICON SIZE --- */
.ft-icon svg {
    width: 18px !important;
    height: 18px !important;
}

/* --- REMOVE TRUSTPILOT SECTION --- */
.trustpilot-score { display: none !important; }
.reviews-header { justify-content: flex-start !important; }

/* --- SOCIAL LINKS — smaller icons, follow us label --- */
.au-social-links {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: 14px !important;
    flex-wrap: wrap !important;
}
.au-social-follow-label {
    font-size: 8px !important;
    font-weight: 700 !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    color: rgba(255,255,255,.3) !important;
    margin-right: 4px !important;
    flex-shrink: 0 !important;
}
.au-social-link {
    width: 30px !important;
    height: 30px !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: border-color .3s, background .3s, color .3s !important;
    text-decoration: none !important;
    flex-shrink: 0 !important;
}
.au-social-link svg {
    width: 12px !important;
    height: 12px !important;
}
.au-social-link:hover {
    border-color: var(--gold) !important;
    background: rgba(181,145,42,.1) !important;
}
.au-social-link:hover svg { color: var(--gold) !important; }

/* --- HIDE WC SIDEBAR / WIDGET AREA ON SHOP --- */
.woocommerce-page .widget-area,
.woocommerce-page aside.woocommerce-sidebar,
.woocommerce-page #secondary,
.woocommerce-page .site-sidebar,
.woocommerce-page nav.woocommerce-MyAccount-navigation + * + nav,
.woocommerce .woocommerce-widget-layered-nav,
.woocommerce-page .wp-block-query-pagination { display: none !important; }

/* Hide any stray footer nav widget that WC outputs */
.site-footer ul.menu,
.site-footer .widget_nav_menu,
.wc-page-wrap ~ .widget,
body > .widget { display: none !important; }

/* ============================================================
   BREADCRUMB & PAGE BANNER — v2.2
   ============================================================ */
.noir-page-banner {
    background: var(--dark);
    border-bottom: 1px solid rgba(255,255,255,.05);
    padding: 36px 0 32px;
}
.noir-page-banner h1 {
    font-family: var(--ff-display) !important;
    font-size: clamp(1.6rem, 3vw, 2.6rem) !important;
    font-weight: 400 !important;
    color: var(--white) !important;
    letter-spacing: -.02em !important;
    margin: 8px 0 0 !important;
    line-height: 1.1 !important;
}

/* Breadcrumb */
.noir-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.noir-breadcrumb a {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255,255,255,.35);
    transition: color var(--transition);
    text-decoration: none;
}
.noir-breadcrumb a:hover { color: var(--gold); }
.noir-breadcrumb span:not(.noir-breadcrumb-sep) {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--gold);
}
.noir-breadcrumb-sep {
    font-size: 9px;
    color: rgba(255,255,255,.15);
    margin: 0 10px;
}

/* Remove old page-banner class styles that conflict */
.woocommerce-page .page-banner { display: none !important; }

/* WC page content area padding */
.wc-page-wrap {
    padding: 40px 0 80px !important;
    background: var(--dark-mid) !important;
    min-height: 60vh;
}

/* Hide the WC result count and sorting bar padding fix */
.woocommerce-result-count {
    color: rgba(255,255,255,.3) !important;
    font-size: 11px !important;
    font-family: var(--ff-body) !important;
}
.woocommerce-ordering select {
    background: var(--dark-card) !important;
    color: var(--white) !important;
    border-color: rgba(255,255,255,.1) !important;
    font-family: var(--ff-body) !important;
    font-size: 11px !important;
}

/* ============================================================
   MOBILE NAV — v2.3 complete fix
   ============================================================ */
@media (max-width: 900px) {

    /* Force nav hidden by default on mobile */
    .primary-nav {
        display: none !important;
    }

    /* When open — full screen overlay */
    .mobile-nav-open .primary-nav {
        display: flex !important;
        flex-direction: column !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: #141412 !important;
        padding: 90px 32px 40px !important;
        z-index: 9999 !important;
        overflow-y: auto !important;
        gap: 0 !important;
        align-items: flex-start !important;
        margin: 0 !important;
    }

    /* Nav items */
    .mobile-nav-open .primary-nav > li {
        width: 100% !important;
        border-bottom: 1px solid rgba(255,255,255,.08) !important;
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
    }

    /* Nav links — FORCE visible white text */
    .mobile-nav-open .primary-nav > li > a {
        display: block !important;
        padding: 18px 0 !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        letter-spacing: .12em !important;
        text-transform: uppercase !important;
        color: #ffffff !important;
        text-decoration: none !important;
        background: transparent !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    .mobile-nav-open .primary-nav > li > a::after {
        display: none !important;
    }
    .mobile-nav-open .primary-nav > li > a:hover,
    .mobile-nav-open .primary-nav > li > a.active {
        color: #b5912a !important;
    }

    /* Sub menus */
    .mobile-nav-open .primary-nav li ul.sub-menu {
        position: static !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        padding: 0 0 8px 16px !important;
        display: none !important;
        min-width: 0 !important;
    }
    .mobile-nav-open .primary-nav li.menu-open > ul.sub-menu {
        display: block !important;
    }
    .mobile-nav-open .primary-nav li ul.sub-menu li a {
        display: block !important;
        color: rgba(255,255,255,.5) !important;
        font-size: 11px !important;
        padding: 10px 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.04) !important;
        letter-spacing: .1em !important;
        text-transform: uppercase !important;
        padding-left: 0 !important;
        background: transparent !important;
    }
    .mobile-nav-open .primary-nav li ul.sub-menu li a:hover {
        color: #b5912a !important;
        padding-left: 0 !important;
    }

    /* Nav toggle — stays on top */
    .nav-toggle {
        display: block !important;
        position: relative;
        z-index: 10000;
        color: #ffffff !important;
    }
    .mobile-nav-open .nav-toggle {
        position: fixed !important;
        top: 22px !important;
        right: 20px !important;
        z-index: 10001 !important;
    }
    .nav-toggle span {
        background: #ffffff !important;
    }

    /* Top bar — single line on mobile */
    .top-bar .container {
        gap: 16px !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
    }
    .top-bar-item {
        font-size: 8px !important;
        gap: 4px !important;
    }
    .top-bar-item .icon svg {
        width: 10px !important;
        height: 10px !important;
    }
}

/* ============================================================
   MOBILE NAV — v2.4 full screen, no scrollbar
   ============================================================ */
@media (max-width: 900px) {

    /* Prevent body scroll when nav is open */
    .mobile-nav-open {
        overflow: hidden !important;
    }

    .mobile-nav-open .primary-nav {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        max-width: 100% !important;
        overflow: hidden !important; /* No scrollbar */
        background: #141412 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;       /* Centre items horizontally */
        justify-content: center !important;   /* Centre items vertically */
        padding: 0 32px !important;
        gap: 0 !important;
        z-index: 9999 !important;
        box-sizing: border-box !important;
    }

    .mobile-nav-open .primary-nav > li {
        width: 100% !important;
        max-width: 400px !important;
        border-bottom: 1px solid rgba(255,255,255,.08) !important;
        text-align: center !important;
    }

    .mobile-nav-open .primary-nav > li > a {
        display: block !important;
        padding: 16px 0 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: .16em !important;
        text-transform: uppercase !important;
        color: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        background: transparent !important;
        text-decoration: none !important;
    }
    .mobile-nav-open .primary-nav > li > a:hover { color: #b5912a !important; }
    .mobile-nav-open .primary-nav > li > a::after { display: none !important; }

    /* Sub-menus */
    .mobile-nav-open .primary-nav li ul.sub-menu {
        position: static !important;
        opacity: 1 !important;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        min-width: 0 !important;
        display: none !important;
    }
    .mobile-nav-open .primary-nav li.menu-open > ul.sub-menu {
        display: block !important;
    }
    .mobile-nav-open .primary-nav li ul.sub-menu li a {
        display: block !important;
        color: rgba(255,255,255,.4) !important;
        font-size: 10px !important;
        padding: 8px 0 !important;
        letter-spacing: .12em !important;
        text-transform: uppercase !important;
        text-align: center !important;
        border-bottom: none !important;
    }
    .mobile-nav-open .primary-nav li ul.sub-menu li a:hover {
        color: #b5912a !important;
    }

    /* Close button — top right corner */
    .mobile-nav-open .nav-toggle {
        position: fixed !important;
        top: 20px !important;
        right: 20px !important;
        z-index: 10001 !important;
    }
}

/* ============================================================
   MOBILE NAV OVERLAY — v2.5 dedicated element
   ============================================================ */

/* Desktop nav — hide toggle on desktop */
.nav-toggle { display: none; }
.desktop-nav { display: block; }

@media (max-width: 900px) {
    /* Hide desktop nav, show toggle */
    .desktop-nav { display: none !important; }
    .nav-toggle {
        display: flex !important;
        flex-direction: column;
        gap: 5px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 4px;
        z-index: 100;
    }
    .nav-toggle span {
        display: block;
        width: 24px;
        height: 2px;
        background: #ffffff;
        border-radius: 1px;
        transition: transform .3s ease, opacity .3s ease;
    }
}

/* The overlay itself */
#mobile-nav-overlay {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background: #141412;
    z-index: 99999;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 32px;
    box-sizing: border-box;
    opacity: 0;
    transition: opacity .3s ease;
}
#mobile-nav-overlay.is-open {
    opacity: 1;
}

/* Close button */
#mobile-nav-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: none;
    border: none;
    color: rgba(255,255,255,.5);
    font-size: 22px;
    cursor: pointer;
    padding: 8px;
    line-height: 1;
    transition: color .2s;
}
#mobile-nav-close:hover { color: #b5912a; }

/* Logo in overlay */
#mobile-nav-logo {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}

/* Nav links */
#mobile-nav-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    width: 100%;
    max-width: 320px;
}
.mobile-nav-item {
    display: block;
    width: 100%;
    text-align: center;
    padding: 16px 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(255,255,255,.8);
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,.07);
    transition: color .2s;
}
.mobile-nav-item:hover { color: #b5912a; }
.mobile-nav-item:last-child { border-bottom: none; }

/* Footer area */
#mobile-nav-footer {
    margin-top: 32px;
    text-align: center;
}

/* Top bar — single row on mobile */
@media (max-width: 600px) {
    .top-bar .container {
        gap: 12px !important;
        justify-content: center !important;
    }
    .top-bar-item {
        font-size: 8px !important;
    }
}




/* ============================================================
   CUSTOM LIGHTBOX
   ============================================================ */
#noir-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.95);
    z-index: 99999;
    align-items: center;
    justify-content: center;
    padding: 20px;
    cursor: zoom-out;
}
#noir-lightbox.is-open { display: flex; }
#noir-lightbox img {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    display: block;
    cursor: default;
}
#noir-lightbox-close {
    position: absolute;
    top: 20px;
    right: 24px;
    background: none;
    border: none;
    color: rgba(255,255,255,.6);
    font-size: 28px;
    cursor: pointer;
    line-height: 1;
    transition: color .2s;
    z-index: 2;
}
#noir-lightbox-close:hover { color: var(--gold); }
#noir-lightbox-prev,
#noir-lightbox-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.6);
    font-size: 18px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s, color .2s;
}
#noir-lightbox-prev { left: 20px; }
#noir-lightbox-next { right: 20px; }
#noir-lightbox-prev:hover,
#noir-lightbox-next:hover { background: var(--gold); color: var(--white); border-color: var(--gold); }

/* ============================================================
   PRODUCT SUMMARY — properly styled
   ============================================================ */
.single-product .woocommerce div.product .summary {
    padding: 0 !important;
    color: var(--text) !important;
}

/* Breadcrumb */
.single-product .woocommerce-breadcrumb {
    font-size: 9px !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    color: rgba(255,255,255,.3) !important;
    margin-bottom: 12px !important;
}
.single-product .woocommerce-breadcrumb a {
    color: rgba(255,255,255,.3) !important;
    transition: color .2s !important;
}
.single-product .woocommerce-breadcrumb a:hover { color: var(--gold) !important; }

/* Title */
.single-product .product_title {
    font-family: var(--ff-display) !important;
    font-size: clamp(1.5rem, 2.5vw, 2rem) !important;
    font-weight: 400 !important;
    color: var(--white) !important;
    line-height: 1.15 !important;
    letter-spacing: -.02em !important;
    margin-bottom: 12px !important;
}

/* Price */
.single-product p.price,
.single-product span.price {
    font-family: var(--ff-display) !important;
    font-size: 1.8rem !important;
    font-weight: 400 !important;
    color: var(--gold) !important;
    display: block !important;
    margin-bottom: 16px !important;
    line-height: 1 !important;
}
.single-product p.price del,
.single-product span.price del {
    color: rgba(255,255,255,.25) !important;
    font-size: 1.1rem !important;
    margin-right: 8px !important;
}

/* Short description */
.single-product .woocommerce-product-details__short-description {
    font-size: 13px !important;
    color: rgba(255,255,255,.5) !important;
    line-height: 1.9 !important;
    font-weight: 300 !important;
    margin-bottom: 20px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* Star rating */
.single-product .woocommerce-product-rating {
    margin-bottom: 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}
.single-product .star-rating { color: var(--gold) !important; }
.single-product .woocommerce-review-link {
    font-size: 10px !important;
    color: rgba(255,255,255,.3) !important;
    text-decoration: underline !important;
}

/* Variation dropdowns */
.single-product form.cart table.variations {
    border: none !important;
    width: 100% !important;
    margin-bottom: 16px !important;
    border-collapse: separate !important;
    border-spacing: 0 8px !important;
}
.single-product form.cart table.variations td,
.single-product form.cart table.variations th {
    border: none !important;
    padding: 0 !important;
    vertical-align: middle !important;
}
.single-product form.cart table.variations th.label {
    width: 80px !important;
    padding-right: 12px !important;
}
.single-product form.cart table.variations label {
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: rgba(255,255,255,.5) !important;
}
.single-product form.cart table.variations select {
    width: 100% !important;
    background: var(--dark-card) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    color: var(--white) !important;
    padding: 11px 14px !important;
    font-family: var(--ff-body) !important;
    font-size: 13px !important;
    border-radius: 0 !important;
    transition: border-color .2s !important;
    cursor: pointer !important;
}
.single-product form.cart table.variations select:focus {
    border-color: var(--gold) !important;
    outline: none !important;
}
.single-product .reset_variations {
    font-size: 9px !important;
    color: rgba(255,255,255,.3) !important;
    text-decoration: underline !important;
}

/* Variation price */
.single-product .woocommerce-variation-price .price {
    font-family: var(--ff-display) !important;
    font-size: 1.6rem !important;
    color: var(--gold) !important;
}

/* Quantity + Add to cart */
.single-product form.cart {
    display: flex !important;
    gap: 10px !important;
    align-items: stretch !important;
    margin: 20px 0 !important;
    flex-wrap: wrap !important;
}
.single-product form.cart .quantity {
    display: flex !important;
    align-items: center !important;
}
.single-product form.cart .qty {
    width: 64px !important;
    height: 100% !important;
    min-height: 50px !important;
    background: var(--dark-card) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    color: var(--white) !important;
    text-align: center !important;
    font-family: var(--ff-display) !important;
    font-size: 18px !important;
    padding: 0 !important;
    border-radius: 0 !important;
}
.single-product form.cart .qty:focus {
    border-color: var(--gold) !important;
    outline: none !important;
}
.single-product form.cart .single_add_to_cart_button {
    flex: 1 !important;
    min-height: 50px !important;
    background: var(--gold) !important;
    border: none !important;
    color: var(--white) !important;
    font-family: var(--ff-body) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background .25s !important;
    border-radius: 0 !important;
    padding: 0 28px !important;
}
.single-product form.cart .single_add_to_cart_button:hover {
    background: var(--gold-lt) !important;
}
.single-product form.cart .single_add_to_cart_button.disabled {
    background: rgba(255,255,255,.1) !important;
    color: rgba(255,255,255,.3) !important;
    cursor: not-allowed !important;
}

/* ============================================================
   REASSURANCE STRIP — Noir styled
   ============================================================ */
.au-reassurance {
    background: transparent !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    padding: 16px !important;
    margin: 4px 0 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}
.au-reassurance-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 11px !important;
    color: rgba(255,255,255,.45) !important;
    line-height: 1.4 !important;
}
.au-reassurance-item svg {
    width: 14px !important;
    height: 14px !important;
    color: var(--gold) !important;
    flex-shrink: 0 !important;
}
.au-reassurance-item strong {
    color: rgba(255,255,255,.7) !important;
    font-weight: 600 !important;
}

/* Lead time */
.au-lead-time {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 11px !important;
    color: rgba(255,255,255,.4) !important;
    padding: 10px 0 !important;
    border-top: 1px solid rgba(255,255,255,.06) !important;
    margin-top: 8px !important;
    background: transparent !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
.au-lead-time strong { color: rgba(255,255,255,.6) !important; }

/* Product meta (category/tags) */
.single-product .product_meta {
    font-size: 10px !important;
    color: rgba(255,255,255,.25) !important;
    margin-top: 16px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(255,255,255,.06) !important;
}
.single-product .product_meta a {
    color: rgba(255,255,255,.4) !important;
    transition: color .2s !important;
}
.single-product .product_meta a:hover { color: var(--gold) !important; }

/* ============================================================
   DESCRIPTION TAB — Noir styled
   ============================================================ */
.single-product .woocommerce-tabs {
    grid-column: 1 / -1 !important;
    margin-top: 48px !important;
    border-top: 1px solid rgba(255,255,255,.06) !important;
    padding-top: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs {
    display: flex !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    background: transparent !important;
}
.single-product .woocommerce-tabs ul.tabs::before { display: none !important; }
.single-product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    margin-bottom: -1px !important;
    padding: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs li a {
    font-family: var(--ff-body) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    color: rgba(255,255,255,.3) !important;
    padding: 16px 24px !important;
    display: block !important;
    background: transparent !important;
}
.single-product .woocommerce-tabs ul.tabs li.active {
    border-bottom-color: var(--gold) !important;
    background: transparent !important;
}
.single-product .woocommerce-tabs ul.tabs li.active a {
    color: var(--white) !important;
    background: transparent !important;
}
.single-product .woocommerce-tabs .panel {
    background: var(--dark-card) !important;
    border: none !important;
    padding: 32px !important;
    margin: 0 !important;
    color: rgba(255,255,255,.55) !important;
    font-size: 13px !important;
    line-height: 1.9 !important;
}
.single-product .woocommerce-tabs .panel h2 {
    display: none !important;
}
.single-product .woocommerce-tabs .panel h3 {
    font-family: var(--ff-display) !important;
    font-size: 1.1rem !important;
    font-weight: 400 !important;
    color: var(--white) !important;
    margin: 20px 0 8px !important;
    letter-spacing: -.01em !important;
}
.single-product .woocommerce-tabs .panel p {
    color: rgba(255,255,255,.5) !important;
    margin-bottom: 12px !important;
}
.single-product .woocommerce-tabs .panel strong,
.single-product .woocommerce-tabs .panel b {
    color: rgba(255,255,255,.75) !important;
    font-weight: 600 !important;
}
.single-product .woocommerce-tabs .panel a {
    color: var(--gold) !important;
    text-decoration: underline !important;
}



/* ============================================================
   SINGLE PRODUCT — v2.8 price size + mobile improvements
   ============================================================ */

/* Larger price */
body.single-product p.price,
body.single-product span.price,
.single-product p.price,
.single-product span.price {
    font-size: 2.8rem !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    color: #b5912a !important;
    font-weight: 400 !important;
    letter-spacing: -.02em !important;
    line-height: 1 !important;
    display: block !important;
    margin-bottom: 20px !important;
}
body.single-product p.price del,
body.single-product span.price del {
    font-size: 1.4rem !important;
    color: rgba(255,255,255,.2) !important;
    margin-right: 10px !important;
}
body.single-product .woocommerce-variation-price .price {
    font-size: 2.4rem !important;
}


/* ============================================================
   RELATED PRODUCTS — v3.0 smart grid, no empty tiles
   ============================================================ */

/* Desktop & tablet — auto-fill columns so no orphan gaps */
@media (min-width: 901px) {
    .single-product .related.products ul.products,
    .single-product .upsells.products ul.products {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
        gap: 16px !important;
        float: none !important;
        width: 100% !important;
        overflow: visible !important;
        flex-wrap: unset !important;
        flex: unset !important;
    }
    .single-product .related.products ul.products li.product,
    .single-product .upsells.products ul.products li.product {
        flex: unset !important;
        max-width: none !important;
        min-width: 0 !important;
        width: auto !important;
        float: none !important;
    }
}

/* Tablet — 2 or 3 columns depending on space */
@media (min-width: 601px) and (max-width: 900px) {
    .single-product .related.products ul.products,
    .single-product .upsells.products ul.products {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
        display: grid !important;
        gap: 12px !important;
        overflow-x: visible !important;
        flex-wrap: unset !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }
    .single-product .related.products ul.products li.product,
    .single-product .upsells.products ul.products li.product {
        flex: unset !important;
        max-width: none !important;
        scroll-snap-align: unset !important;
    }
    /* Swipe hint not needed on tablet grid */
    .single-product .related.products > h2::after,
    .single-product .upsells.products > h2::after {
        display: none !important;
    }
}

/* ============================================================
   RECENTLY VIEWED — styles
   ============================================================ */
.au-recently-viewed {
    background: #141412;
    padding: 56px 0;
    border-top: 1px solid rgba(255,255,255,.06);
}
.au-rv-header {
    margin-bottom: 32px;
}
.au-rv-header .eyebrow {
    margin-bottom: 8px;
}
.au-rv-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}
.au-rv-card {
    background: #252520;
    display: block;
    text-decoration: none;
    transition: transform .3s ease, box-shadow .3s ease;
    overflow: hidden;
}
.au-rv-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,.4);
}
.au-rv-img {
    aspect-ratio: 4/3;
    overflow: hidden;
    background: #1e1e1b;
    display: flex;
    align-items: center;
    justify-content: center;
}
.au-rv-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.au-rv-card:hover .au-rv-img img {
    transform: scale(1.04);
}
.au-rv-placeholder {
    color: #b5912a;
    opacity: .2;
    font-size: 32px;
}
.au-rv-body {
    padding: 14px 16px 18px;
}
.au-rv-name {
    font-size: 12px;
    font-weight: 500;
    color: rgba(255,255,255,.8);
    line-height: 1.4;
    margin-bottom: 6px;
    font-family: 'Jost', sans-serif;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.au-rv-price {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 16px;
    font-weight: 400;
    color: #b5912a;
}

@media (max-width: 600px) {
    .au-rv-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

/* ============================================================
   STICKY ADD TO CART BAR
   ============================================================ */
.au-sticky-atc {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #141412;
    border-top: 1px solid rgba(255,255,255,.1);
    z-index: 9000;
    transform: translateY(100%);
    transition: transform .35s cubic-bezier(.4,0,.2,1);
    box-shadow: 0 -8px 40px rgba(0,0,0,.5);
}
.au-sticky-atc.is-visible {
    transform: translateY(0);
}
.au-sticky-atc-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 12px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.au-sticky-atc-product {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.au-sticky-atc-product img {
    width: 48px;
    height: 48px;
    object-fit: cover;
    flex-shrink: 0;
    background: #252520;
}
.au-sticky-atc-info { min-width: 0; overflow: hidden; }
.au-sticky-atc-name {
    font-size: 11px;
    font-weight: 600;
    color: rgba(255,255,255,.8);
    font-family: 'Jost', sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.au-sticky-atc-price {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 16px;
    color: #b5912a;
    line-height: 1.2;
}
.au-sticky-atc-actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
    align-items: center;
}
.au-sticky-atc-btn {
    background: #b5912a;
    color: #ffffff;
    border: none;
    padding: 11px 24px;
    font-family: 'Jost', sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .2s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}
.au-sticky-atc-btn:hover { background: #d4ad58; }
.au-sticky-atc-scroll {
    background: transparent;
    color: rgba(255,255,255,.4);
    border: 1px solid rgba(255,255,255,.15);
    padding: 10px 18px;
    font-family: 'Jost', sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color .2s, color .2s;
    white-space: nowrap;
}
.au-sticky-atc-scroll:hover {
    border-color: #b5912a;
    color: #b5912a;
}

/* Hide product info on mobile to save space */
@media (max-width: 600px) {
    .au-sticky-atc-inner { padding: 10px 16px; gap: 10px; }
    .au-sticky-atc-product img { display: none; }
    .au-sticky-atc-name { font-size: 10px; }
    .au-sticky-atc-scroll { display: none; }
    .au-sticky-atc-btn { padding: 12px 20px; flex: 1; justify-content: center; }
}

/* ============================================================
   INSTAGRAM FEED
   ============================================================ */
.au-instagram-section {
    background: #f5f2ec;
    padding: 80px 0;
}
.au-instagram-section .eyebrow { color: #b5912a; }
.au-instagram-section .section-title.dark { color: #1e1e1b; }
.au-instagram-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 32px;
    gap: 20px;
    flex-wrap: wrap;
}
.au-instagram-sub {
    font-size: 13px;
    color: #7a7569;
    margin-top: 6px;
    font-family: 'Jost', sans-serif;
}
.au-instagram-follow {
    color: #b5912a !important;
    border-color: #b5912a !important;
    flex-shrink: 0;
    font-size: 11px !important;
}

/* Grid — 3 cols on desktop, auto-responsive */
.au-instagram-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}
@media (min-width: 900px) {
    .au-instagram-grid[data-count="9"]  { grid-template-columns: repeat(3, 1fr); }
    .au-instagram-grid[data-count="12"] { grid-template-columns: repeat(4, 1fr); }
    .au-instagram-grid[data-count="6"]  { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
    .au-instagram-grid { grid-template-columns: repeat(3, 1fr); gap: 2px; }
}

/* Individual item */
.au-instagram-item {
    display: block;
    position: relative;
    overflow: hidden;
    background: #252520;
}
.au-instagram-img {
    aspect-ratio: 1;
    overflow: hidden;
    position: relative;
}
.au-instagram-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}
.au-instagram-item:hover .au-instagram-img img {
    transform: scale(1.06);
}

/* Overlay on hover */
.au-instagram-overlay {
    position: absolute;
    inset: 0;
    background: rgba(20,20,18,.75);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .3s ease;
}
.au-instagram-item:hover .au-instagram-overlay {
    opacity: 1;
}
.au-instagram-type {
    font-size: 20px;
    color: #ffffff;
    margin-bottom: 8px;
    display: block;
}
.au-instagram-caption {
    font-size: 11px;
    color: rgba(255,255,255,.8);
    text-align: center;
    line-height: 1.5;
    font-family: 'Jost', sans-serif;
    margin: 0;
}

/* ============================================================
   UNIFORM IMAGE TREATMENT — v3.1
   Makes all product images look consistent and premium
   regardless of original photography style.
   ============================================================ */

/* ---- SHOP / CATEGORY LOOP CARDS ---- */

/* Dark background behind all product images */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .woocommerce-loop-product__link img {
    background: #252520 !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    width: 100% !important;
    display: block !important;
    /* Slight desaturation — makes inconsistent photos feel cohesive */
    filter: saturate(.85) brightness(.95) !important;
    transition: filter .5s ease, transform .5s ease !important;
}
.woocommerce ul.products li.product:hover a img {
    filter: saturate(1) brightness(1) !important;
    transform: scale(1.03) !important;
}

/* Dark background on the image container itself */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
    background: #252520 !important;
    display: block !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Subtle dark vignette overlay on loop images */
.woocommerce ul.products li.product .woocommerce-loop-product__link::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(
        to bottom,
        transparent 50%,
        rgba(20,20,18,.35) 100%
    ) !important;
    pointer-events: none !important;
    z-index: 1 !important;
    transition: opacity .3s !important;
}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__link::after {
    opacity: .5 !important;
}
/* ---- SINGLE PRODUCT GALLERY ---- */

/* Dark background so white-background product shots
   don't look jarring on the dark page */
.single-product .woocommerce-product-gallery,
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
    background: #1e1c18 !important;
}

/* Consistent treatment on main image */
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img {
    filter: saturate(.9) brightness(.97) !important;
    transition: filter .4s ease, transform .5s ease !important;
}
.single-product .woocommerce-product-gallery:hover .woocommerce-product-gallery__image img {
    filter: saturate(1) brightness(1) !important;
}

/* Thumbnails — slightly muted until active */
.single-product .flex-control-thumbs li {
    background: #1e1c18 !important;
}
.single-product .flex-control-thumbs li img {
    filter: saturate(.7) brightness(.8) !important;
    transition: filter .2s, opacity .2s, border-color .2s !important;
}
.single-product .flex-control-thumbs li img:hover,
.single-product .flex-control-thumbs li img.flex-active {
    filter: saturate(1) brightness(1) !important;
}

/* ---- RECENTLY VIEWED CARDS ---- */
.au-rv-img img {
    filter: saturate(.85) brightness(.95) !important;
    transition: filter .4s ease, transform .5s ease !important;
}
.au-rv-card:hover .au-rv-img img {
    filter: saturate(1) brightness(1) !important;
}

/* ---- SALON TILES ON HOMEPAGE ---- */
.salon-tile-img img {
    filter: saturate(.8) brightness(.85) !important;
    transition: filter .5s ease, transform .6s ease !important;
}
.salon-tile:hover .salon-tile-img img {
    filter: saturate(1) brightness(.95) !important;
}

/* ---- SECONDARY PRODUCT CARDS ---- */
.product-card-media img {
    filter: saturate(.85) brightness(.9) !important;
    transition: filter .4s ease, transform .6s ease !important;
}
.product-card:hover .product-card-media img {
    filter: saturate(1) brightness(1) !important;
}

/* ---- COLLECTION TILES (if any remain) ---- */
.collection-card img {
    filter: saturate(.8) brightness(.75) !important;
    transition: filter .5s ease, transform .6s ease !important;
}
.collection-card:hover img {
    filter: saturate(.95) brightness(.85) !important;
}

/* ---- INSTAGRAM FEED ---- */
.au-instagram-img img {
    filter: saturate(.8) brightness(.9) !important;
    transition: filter .4s ease, transform .5s ease !important;
}
.au-instagram-item:hover .au-instagram-img img {
    filter: saturate(1) brightness(1) !important;
    transform: scale(1.06) !important;
}
/* --- DESCRIPTION TAB: REMOVE BOXED LOOK --- */
.single-product .woocommerce-tabs .panel {
    background: transparent !important; /* Removes the dark box background */
    padding: 0 !important;             /* Removes the internal padding */
    border: none !important;           /* Removes any border */
}

/* Optional: Make the text easier to read if the background box is gone */
.single-product .woocommerce-tabs .panel p {
    color: rgba(255,255,255,0.9) !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}
/* ============================================================
   SALE BADGE — consistent Noir style
   ============================================================ */
.woocommerce span.onsale {
    background: #b5912a !important;
    color: #ffffff !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 8px !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    border-radius: 0 !important;
    padding: 5px 10px !important;
    min-width: auto !important;
    min-height: auto !important;
    line-height: 1 !important;
    top: 12px !important;
    left: 12px !important;
}

/* ============================================================
   PLACEHOLDER — products with no image
   ============================================================ */
.woocommerce ul.products li.product .woocommerce-loop-product__link:not(:has(img)) {
    min-height: 200px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: rgba(181,145,42,.2) !important;
    font-size: 40px !important;
}

/* ============================================================
   FIXES v3.2 — grid, recently viewed, description, upsells
   ============================================================ */

/* --- FIX: Related products desktop grid --- */
@media (min-width: 901px) {
    .single-product .related.products ul.products,
    .single-product .upsells.products ul.products {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
        gap: 16px !important;
        float: none !important;
        width: 100% !important;
        overflow: visible !important;
        flex-wrap: unset !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .single-product .related.products ul.products li.product,
    .single-product .upsells.products ul.products li.product {
        float: none !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        flex: unset !important;
    }
}

/* --- FIX: Hide upsells entirely — prevents same product showing twice --- */
.single-product .upsells.products {
    display: none !important;
}

/* --- FIX: Recently viewed — smaller, more compact --- */
.au-recently-viewed {
    padding: 40px 0 !important;
}
.au-rv-header { margin-bottom: 20px !important; }
.au-rv-header .section-title { font-size: 1.4rem !important; }
.au-rv-grid {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
    gap: 10px !important;
}
.au-rv-body { padding: 10px 12px 14px !important; }
.au-rv-name { font-size: 11px !important; }
.au-rv-price { font-size: 14px !important; }

/* --- FIX: Mobile description text size --- */
@media (max-width: 900px) {
    .single-product .woocommerce-tabs .panel p,
    .single-product .woocommerce-tabs .panel li {
        font-size: 13px !important;
        line-height: 1.7 !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }
    .single-product .woocommerce-tabs .panel h3 {
        font-size: 1rem !important;
    }
    /* Panel padding tighter on mobile */
    .single-product .woocommerce-tabs .panel {
        padding: 16px !important;
    }
    /* Accordion trigger visible */
    .noir-accordion-trigger {
        display: flex !important;
    }
}

/* --- FIX: Short description styling --- */
.single-product .woocommerce-product-details__short-description {
    font-size: 13px !important;
    color: rgba(255,255,255,.5) !important;
    line-height: 1.85 !important;
    margin-bottom: 16px !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
.single-product .woocommerce-product-details__short-description p {
    margin-bottom: 8px !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 13px !important;
}
/* Hide full description from summary — it belongs in the tab only */
.single-product .woocommerce-product-details__short-description ul,
.single-product .woocommerce-product-details__short-description ol {
    padding-left: 16px !important;
    margin-bottom: 8px !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 12px !important;
}

/* --- FIX: Description tab full width on mobile --- */
@media (max-width: 900px) {
    .single-product .woocommerce-tabs {
        width: 100% !important;
        overflow: hidden !important;
    }
    .single-product .woocommerce-tabs .panel {
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    .single-product .woocommerce-tabs .panel * {
        max-width: 100% !important;
        word-break: break-word !important;
    }
}

/* ============================================================
   SHORT DESCRIPTION — truncate with read more v3.3
   ============================================================ */

/* Truncate short description to 3 lines */
.single-product .woocommerce-product-details__short-description {
    position: relative !important;
}
.single-product .woocommerce-product-details__short-description.is-truncated {
    max-height: 80px !important;
    overflow: hidden !important;
}
.single-product .woocommerce-product-details__short-description.is-truncated::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 40px !important;
    background: linear-gradient(to bottom, transparent, #1e1e1b) !important;
    pointer-events: none !important;
}
.noir-read-more-btn {
    background: none !important;
    border: none !important;
    color: #b5912a !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    padding: 6px 0 !important;
    display: block !important;
    margin-top: 4px !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}
.noir-read-more-btn:hover { color: #d4ad58 !important; }

/* --- DESCRIPTION TABS — RESTORED VISIBILITY --- */
@media (max-width: 900px) {
    .single-product .woocommerce-tabs ul.tabs { display: flex !important; flex-wrap: wrap !important; }
    .single-product .woocommerce-tabs .panel { padding: 16px !important; box-sizing: border-box !important; width: 100% !important; overflow: hidden !important; background: #252520 !important; }
    .single-product .woocommerce-tabs .panel p, .single-product .woocommerce-tabs .panel li { font-size: 13px !important; line-height: 1.75 !important; color: rgba(255,255,255,.55) !important; word-break: break-word !important; }
    .single-product .woocommerce-tabs .panel h3 { font-size: 1rem !important; color: #ffffff !important; margin: 16px 0 6px !important; }
    .single-product .woocommerce-tabs .panel strong, .single-product .woocommerce-tabs .panel b { color: rgba(255,255,255,.8) !important; }
}

/* ============================================================
   RECENTLY VIEWED — compact on all devices v3.4
   ============================================================ */
.au-recently-viewed {
    padding: 32px 0 !important;
}
.au-rv-header {
    margin-bottom: 16px !important;
}
.au-rv-header .eyebrow {
    font-size: 8px !important;
    margin-bottom: 4px !important;
}
.au-rv-header .section-title {
    font-size: 1.1rem !important;
}
.au-rv-grid {
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)) !important;
    gap: 8px !important;
}
.au-rv-img {
    aspect-ratio: 1 !important;
}
.au-rv-body {
    padding: 8px 10px 10px !important;
}
.au-rv-name {
    font-size: 10px !important;
    -webkit-line-clamp: 1 !important;
    margin-bottom: 3px !important;
}
.au-rv-price {
    font-size: 12px !important;
}
@media (max-width: 600px) {
    .au-rv-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 6px !important;
    }
}

/* ============================================================
   PRODUCT GALLERY — v3.6 natural image dimensions
   Remove forced aspect ratio — let image breathe naturally
   ============================================================ */

/* Remove all forced aspect ratios from gallery container */
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a {
    display: block !important;
    aspect-ratio: unset !important;
    position: static !important;
    height: auto !important;
    background: #1e1c18 !important;
    overflow: hidden !important;
}

/* Image fills container naturally — no cropping, no forcing */
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img,
.woocommerce-product-gallery .woocommerce-product-gallery__image img {
    width: 100% !important;
    height: auto !important;
    max-height: 600px !important;
    aspect-ratio: unset !important;
    min-height: unset !important;
    object-fit: contain !important;
    object-position: center !important;
    position: static !important;
    display: block !important;
    background: #1e1c18 !important;
}

/* Flexslider — remove any height constraints */
.single-product .woocommerce-product-gallery .flex-viewport {
    max-height: none !important;
    height: auto !important;
}
.single-product .woocommerce-product-gallery .flexslider {
    margin: 0 !important;
    border: none !important;
    background: #1e1c18 !important;
}

/* Mobile — cap height sensibly */
@media (max-width: 900px) {
    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img,
    .woocommerce-product-gallery .woocommerce-product-gallery__image img {
        max-height: 400px !important;
    }
}

/* ============================================================
   GALLERY — v3.8 FINAL — fixed square box, no zoom, click to enlarge
   ============================================================ */

/* Fixed square container — everything constrained here */
body.single-product .woocommerce-product-gallery,
.single-product .woocommerce-product-gallery {
    width: 100% !important;
    background: #1e1c18 !important;
}

/* The image slide wrapper — fixed square box */
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    background: #1e1c18 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}

/* The anchor inside — fills the box */
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a,
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;
    inset: 0 !important;
    cursor: zoom-in !important;
    background: #1e1c18 !important;
}

/* The image — contained within the square, no crop, no zoom */
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img,
.woocommerce-product-gallery .woocommerce-product-gallery__image img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important; /* Added to force-limit width */
    object-fit: contain !important;
    object-position: center center !important;
    aspect-ratio: unset !important;
    min-height: unset !important;
    max-height: 100% !important; /* Forces image to respect the parent container's height */
    position: absolute !important; /* Changed from static to ensure it sits inside the aspect-ratio box */
    inset: 0 !important;
    display: block !important;
    transform: none !important;
    transition: none !important;
    filter: none !important;
}

/* Absolutely no hover zoom on main image */
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image:hover img,
body.single-product .woocommerce-product-gallery:hover .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image:hover img {
    transform: none !important;
    filter: none !important;
    transition: none !important;
}

/* Flexslider — remove any height it tries to set */
body.single-product .woocommerce-product-gallery .flex-viewport,
.single-product .woocommerce-product-gallery .flex-viewport {
    overflow: hidden !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
}
body.single-product .woocommerce-product-gallery .flexslider,
.single-product .woocommerce-product-gallery .flexslider {
    margin: 0 !important;
    border: none !important;
    background: #1e1c18 !important;
    box-shadow: none !important;
}
/* Thumbnails — small square row below */
body.single-product .flex-control-thumbs,
.single-product .flex-control-thumbs {
    display: flex !important;
    gap: 6px !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
}
body.single-product .flex-control-thumbs li,
.single-product .flex-control-thumbs li {
    flex: 0 0 calc(25% - 5px) !important;
    min-width: 60px !important;
    aspect-ratio: 1 !important;
    overflow: hidden !important;
    background: #1e1c18 !important;
    cursor: pointer !important;
}
body.single-product .flex-control-thumbs li img,
.single-product .flex-control-thumbs li img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    aspect-ratio: unset !important;
    display: block !important;
    opacity: .6 !important;
    border: 2px solid transparent !important;
    transform: none !important;
    transition: opacity .2s, border-color .2s !important;
    filter: none !important;
}
body.single-product .flex-control-thumbs li img.flex-active,
body.single-product .flex-control-thumbs li img:hover,
.single-product .flex-control-thumbs li img.flex-active,
.single-product .flex-control-thumbs li img:hover {
    opacity: 1 !important;
    border-color: #b5912a !important;
    transform: none !important;
}
/* --- MOBILE ASPECT RATIO TWEAK --- */
@media (max-width: 480px) {
    .single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
        aspect-ratio: 4 / 5 !important; /* Taller, more visual impact */
    }
}

/*
Theme Name: AU Unique — Noir
Theme URI: https://au-unique.co.uk
Author: AU Unique
Description: Luxury dark redesign of AU Unique.
Version: 2.1.0
License: GNU General Public License v2 or later
Text Domain: au-unique-noir
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Jost:wght@300;400;500;600;700&display=swap');

/* --- DESIGN TOKENS --- */
:root {
  --dark: #141412; --dark-mid: #1e1e1b; --dark-card: #252520; --gold: #b5912a; --white: #ffffff;
  --ff-display: 'Cormorant Garamond', Georgia, serif; --ff-body: 'Jost', sans-serif;
}

/* --- BASE & UTILITY --- */
*, *::before, *::after { box-sizing: border-box; }
body { font-family: var(--ff-body); background: var(--dark-mid); color: rgba(255,255,255,.85); margin: 0; }
img { max-width: 100%; height: auto; display: block; }

/* --- HEADER & NAV --- */
.site-header { background: rgba(20,20,18,.95); border-bottom: 1px solid rgba(255,255,255,.06); position: sticky; top: 0; z-index: 1000; }
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; padding: 0 40px; max-width: 1200px; margin: 0 auto; }
.nav-toggle { display: none; }

@media (max-width: 900px) {
    .nav-toggle { display: flex !important; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; }
    .nav-toggle span { display: block; width: 24px; height: 2px; background: #ffffff; }
    .primary-nav { display: none !important; }
}

/* --- PRODUCT GRID (LOOP) --- */
.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 16px !important; }
@media (max-width: 900px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 540px) { .woocommerce ul.products { grid-template-columns: 1fr !important; } }
.woocommerce ul.products li.product { background: var(--dark-card) !important; padding: 0 !important; }
.woocommerce ul.products li.product a img { aspect-ratio: 4/3 !important; object-fit: cover !important; }

/* --- CLEANUP --- */
.trustpilot-score { display: none !important; }
.single-product .upsells.products { display: none !important; }

/* --- CLEANUP --- */
.trustpilot-score { display: none !important; }
.single-product .upsells.products { display: none !important; }

/* --- AU UNIQUE NOIR: FINAL MOBILE OVERRIDE --- */

@media (max-width: 900px) {
/* 1. IMAGE FIX: Smash the column and force full mobile width */
    body.single-product div.product {
        display: block !important; 
    }

    body.single-product .woocommerce-product-gallery,
    body.single-product div.product div.images {
        width: 100% !important;
        max-width: 100% !important; 
        margin: 0 auto 30px auto !important;
        float: none !important;
        display: block !important;
    }

    /* Keep the image box a structured square so it doesn't collapse */
    body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image {
        width: 100% !important;
        aspect-ratio: 1 / 1 !important;
        position: relative !important;
        overflow: hidden !important;
    }

    /* Force the actual photo to anchor properly and show the whole thing */
    body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: contain !important; /* Prevents the massive zoom */
        object-position: center !important; /* Centers the actual furniture */
        margin: 0 !important;
        transform: none !important; /* Stops the slider script from offsetting it */
    }
    
    body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image,
    body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a {
        width: 100% !important; 
    }
    /* 2. DESCRIPTION FIX: Break the Accordion Lock entirely */
    body.single-product .woocommerce-tabs,
    body.single-product .noir-accordion-trigger,
    body.single-product .woocommerce-tabs .panel,
    body.single-product #tab-description,
    body.single-product .woocommerce-tabs ul.tabs,
    body.single-product .woocommerce-tabs ul.tabs li {
        display: block !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100vw !important;
        box-sizing: border-box !important;
        clear: both !important;
        position: static !important;
        margin: 0 !important;
    }

    /* 3. TEXT FIX: Allow the text to spread naturally across the screen */
    body.single-product .woocommerce-tabs .panel *,
    body.single-product #tab-description * {
        max-width: 100% !important;
        white-space: normal !important;
        word-break: break-word !important;
    }

    /* 4. SCROLL FIX: Keep the description tidy so users don't scroll forever */
    body.single-product #tab-description {
        max-height: 350px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: 20px 15px !important;
        background: transparent !important;
        border-top: 1px solid rgba(255,255,255,0.05) !important;
        border-bottom: 1px solid rgba(255,255,255,0.05) !important;
    }

    /* 5. CLEANUP: Remove the weird white box from the tab title */
    body.single-product .woocommerce-tabs ul.tabs li {
        background: transparent !important;
        padding: 0 !important;
        border: none !important;
    }
}