.heading-subtitle { display:block; font-family:var(--font-gothic); font-size:14px; line-height:1.6; font-weight:400; letter-spacing:0; margin-top:8px; }
.product-share { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:16px; }
.product-share__button { display:inline-flex; align-items:center; gap:8px; min-height:44px; font-family:var(--font-gothic); font-size:13px; color:var(--ink-muted); background:transparent; cursor:pointer; }
.product-share__button:hover { color:var(--ink-heading); }
.product-share__button:focus-visible { outline:2px solid var(--ink-heading); outline-offset:4px; }
.product-share__button svg { width:16px; height:16px; }
.share-copy-field { position:fixed; inset:0 auto auto 0; width:1px; height:1px; opacity:0; }
.product-share [data-share-status] { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.footer-social { display:flex; gap:18px; margin-top:20px; font-size:13px; }
/* ==========================================================================
   AVANTE PARFUMS — HAUTE PARFUMERIE DESIGN SYSTEM
   Warm Sunlit Champagne & Roasted Cocoa Palette · Soft Organic Serif Typography
   Self-Hosted GDPR-Compliant Fonts: Cormorant Garamond & Jost
   ========================================================================== */

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('/site/assets/fonts/cormorant-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('/site/assets/fonts/cormorant-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/site/assets/fonts/cormorant-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/site/assets/fonts/cormorant-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('/site/assets/fonts/jost-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('/site/assets/fonts/jost-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Jost';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/site/assets/fonts/jost-italic-latin.woff2') format('woff2');
}

:root {
  /* Warm Sunlit Atelier Surfaces — NEVER True #FFFFFF or Harsh Black #000000 */
  --bg-canvas: #FBF9F5;       /* Soft Product White — used across all pages */
  --bg-card: #FAF6F0;         /* Soft Creamy Silk Parchment */
  --bg-nav: #EBE3D5;          /* Navbar & Footer Cream — deeper warm sand */
  --bg-product: var(--bg-canvas);
  --bg-field: #F0E9DD;         /* Waitlist email field — slightly deeper than canvas */
  --ink-charcoal: var(--ink-heading);
  --bg-stone: #F3EDE2;        /* Warm Cream — same as navbar/footer */
  --bg-stone-hover: var(--bg-stone);  /* Deeper Warm Cream Hover */
  --bg-espresso: #2D231E;     /* Soft Roasted Cocoa-Umber (Never harsh black) */
  --bg-umber: #382C26;        /* Warm Aged Mahogany / Umber Surface */

  /* Softened, Warm Ink Colors (Readable without feeling stark or overly bold) */
  --ink-heading: #2B221D;
  --ink-body: #4E4239;
  --ink-muted: #786A5D;
  --ink-on-dark: #F5EFE6;
  --ink-on-dark-muted: #CBBFB1;

  /* Golden Dusk & Rose-Bronze Accents */
  --accent-bronze: #96623B;
  --accent-copper: #824B26;
  --accent-gold-soft: #D8B48E;
  --border-warm: rgba(150, 98, 59, 0.16);
  --border-warm-strong: rgba(150, 98, 59, 0.28);

  /* Soft, Expressive Haute Parfumerie Typography */
  --font-didot: 'Cormorant Garamond', Georgia, serif;
  --font-gothic: 'Jost', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Smooth Transitions */
  --ease-luxury: cubic-bezier(0.16, 1, 0.3, 1);
  --hero-vignette: linear-gradient(180deg, color-mix(in srgb, oklch(0.18 0 0) 18%, transparent) 0%, color-mix(in srgb, oklch(0.18 0 0) 52%, transparent) 100%);
  --hero-vignette-mobile: linear-gradient(180deg, color-mix(in srgb, oklch(0.18 0 0) 52%, transparent) 0%, color-mix(in srgb, oklch(0.18 0 0) 62%, transparent) 100%);
  --hero-text-shadow: 0 2px 12px color-mix(in srgb, var(--bg-espresso) 80%, transparent);
  --consent-shadow: 0 8px 32px color-mix(in srgb, var(--bg-espresso) 16%, transparent);
}

/* --------------------------------------------------------------------------
   1. RESET, SILKY ANTI-ALIASED FONT RENDERING & ZERO DEFAULT SCROLLBAR
   -------------------------------------------------------------------------- */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  background-color: var(--bg-canvas);
  scrollbar-gutter: stable;
  color: var(--ink-heading);
  font-family: var(--font-gothic);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Hide Default Browser Scrollbar 100% while keeping smooth scroll */
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body {
  background-color: var(--bg-canvas);
  background-image: none;
  color: var(--ink-heading);
  overflow-x: hidden;
  padding-bottom: 90px;
}

::selection {
  background-color: var(--accent-bronze);
  color: var(--bg-card);
}

img, video {
  max-width: 100%;
  display: block;
}

/* Warm Tonal Filter for Studio Product Images so they blend into Creamy Silk (var(--bg-card)) */
.warm-bottle-blend {
  filter: sepia(0.06) brightness(0.98) contrast(1.01);
}

a {
  color: inherit;
  text-decoration: none;
}

button, input, textarea, select {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  outline: none;
}

button {
  cursor: pointer;
}

ul {
  list-style: none;
}

/* Subtle 2px Top Scroll Progress Filament */
.scroll-progress-line {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0%;
  background: linear-gradient(90deg, var(--accent-bronze), var(--accent-gold-soft));
  z-index: 9999;
}

/* --------------------------------------------------------------------------
   2. ANNOUNCEMENT BAR & WARM SILK HEADER
   -------------------------------------------------------------------------- */
.announcement-bar {
  background: var(--bg-espresso);
  color: var(--ink-on-dark);
  text-align: center;
  padding: 10px 20px;
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.announcement-bar button,
.announcement-bar a {
  color: var(--accent-gold-soft);
  margin-left: 12px;
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding-bottom: 1px;
  transition: opacity 0.2s;
}

.announcement-bar button:hover,
.announcement-bar a:hover {
  opacity: 0.85;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 1050;
  height: 82px;
  background-color: var(--bg-nav);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 clamp(20px, 4.5vw, 68px);
}

.header-nav {
  display: flex;
  align-items: center;
  gap: 22px;
}

.header-nav .header-link:last-child {
  display: none;
}

.header-link {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-body);
  white-space: nowrap;
  position: relative;
  padding: 6px 0;
  transition: color 0.14s ease-out;
}

.header-link::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: var(--accent-bronze);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.18s ease-out;
}

.header-link:hover,
.header-link.is-active {
  color: var(--ink-heading);
}

.header-link:hover::after,
.header-link.is-active::after {
  transform: scaleX(1);
  transform-origin: left;
}

.brand-logo {
  font-family: var(--font-didot);
  font-size: 34px;
  font-weight: 400;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-heading);
  text-align: center;
  white-space: nowrap;
}

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


.bag-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: transparent;
  padding: 10px 22px;
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-heading);
  transition: color 0.18s ease;
}

.bag-trigger-btn:hover {
  color: var(--accent-bronze);
}

.bag-count-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: var(--bg-espresso);
  color: var(--ink-on-dark);
  font-size: 11px;
  font-weight: 400;
}

.header-left-group {
  display: flex;
  align-items: center;
  gap: 20px;
}

.mobile-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* --------------------------------------------------------------------------
   3. SOFT, POETIC TYPOGRAPHY & TAILORED TACTILE BUTTONS
   -------------------------------------------------------------------------- */
.container {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4.5vw, 68px);
}

.eyebrow {
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent-bronze);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.eyebrow::before {
  content: '';
  display: inline-block;
  width: 22px;
  height: 1px;
  background-color: var(--accent-bronze);
  opacity: 0.65;
}

.section-header-center .eyebrow::after,
.press-header .eyebrow::after {
  content: '';
  display: inline-block;
  width: 22px;
  height: 1px;
  background-color: var(--accent-bronze);
  opacity: 0.65;
}

.heading-xl {
  font-family: var(--font-didot);
  font-size: clamp(3.2rem, 5.2vw, 4.8rem);
  font-weight: 400;
  line-height: 1.03;
  letter-spacing: 0;
  color: var(--ink-heading);
}

.heading-lg {
  font-family: var(--font-didot);
  font-size: clamp(2.35rem, 3.8vw, 3.5rem);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: 0;
  color: var(--ink-heading);
}

.heading-md {
  font-family: var(--font-didot);
  font-size: clamp(1.85rem, 2.5vw, 2.4rem);
  font-weight: 400;
  line-height: 1.14;
  color: var(--ink-heading);
}

.serif-italic-sub {
  display: block;
  font-family: var(--font-didot);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.25rem, 1.7vw, 1.55rem);
  color: var(--accent-bronze);
  line-height: 1.4;
  margin-top: 8px;
}

/* Primary High-CTA Button: Tailored 56px Height, Soft Roasted Cocoa with Champagne Inner Rim */
.btn-cta-espresso {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  width: 100%;
  background: var(--bg-espresso);
  color: var(--ink-on-dark);
  border: 1px solid color-mix(in srgb, var(--accent-gold-soft) 28%, transparent);
  border-radius: 3px;
  height: 56px;
  padding: 0 32px;
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  box-shadow: 0 8px 24px color-mix(in srgb, var(--bg-espresso) 10%, transparent);
  transition: background 0.16s ease-out, transform 0.16s ease-out, box-shadow 0.16s ease-out, border-color 0.16s ease-out;
}

.btn-cta-espresso:hover {
  background: var(--accent-ink-hover);
  border-color: color-mix(in srgb, var(--accent-gold-soft) 55%, transparent);
  transform: translateY(-1.5px);
  box-shadow: 0 14px 32px color-mix(in srgb, var(--bg-espresso) 16%, transparent);
}

/* Fragrance-specific CTA hovers: Lune D'Or warms to amber, Blanc cools to marine blue */
.btn-cta-espresso[data-waitlist-default="lune-dor"]:hover,
.btn-cta-espresso[data-add-bag="lune-dor"]:hover,
body.page-lune-dor .btn-cta-espresso:hover {
  background: var(--accent-amber);
  border-color: color-mix(in srgb, var(--accent-gold-soft) 62%, transparent);
  box-shadow: 0 14px 32px color-mix(in srgb, var(--accent-amber) 26%, transparent);
}

.btn-cta-espresso[data-waitlist-default="blanc"]:hover,
.btn-cta-espresso[data-add-bag="blanc"]:hover,
body.page-blanc .btn-cta-espresso:hover {
  background: var(--accent-marine);
  border-color: color-mix(in srgb, var(--accent-gold-soft) 48%, transparent);
  box-shadow: 0 14px 32px color-mix(in srgb, var(--accent-marine) 26%, transparent);
}

/* Lune D'Or product page: CTAs wear the fragrance's own amber, deepening on hover */
body.page-lune-dor .btn-cta-espresso {
  background: var(--accent-amber-lift);
  color: var(--bg-espresso);
  border-color: color-mix(in srgb, var(--accent-gold-soft) 62%, transparent);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--accent-amber) 22%, transparent);
}

body.page-lune-dor .btn-cta-espresso:hover {
  background: var(--accent-amber-deep);
  color: var(--ink-on-dark);
  border-color: color-mix(in srgb, var(--accent-gold-soft) 78%, transparent);
  box-shadow: 0 14px 32px color-mix(in srgb, var(--accent-amber) 34%, transparent);
}

/* Blanc product page: navy CTAs deepen to marine blue on hover */
body.page-blanc .btn-cta-espresso:hover {
  background: var(--accent-marine-deep);
  color: var(--ink-on-dark);
  border-color: color-mix(in srgb, var(--accent-gold-soft) 62%, transparent);
  box-shadow: 0 14px 32px color-mix(in srgb, var(--accent-marine) 36%, transparent);
  transform: translateY(-1.5px);
}

body.page-lune-dor .btn-cta-espresso:active,
body.page-blanc .btn-cta-espresso:active {
  transform: scale(.97);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--bg-espresso) 22%, transparent);
}


/* Secondary High-CTA Button: Tailored 56px Height, Warm Parchment & Bronze Border */
.btn-cta-stone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  width: 100%;
  background-color: var(--bg-card);
  color: var(--ink-heading);
  border: 1px solid var(--border-warm-strong);
  border-radius: 3px;
  height: 56px;
  padding: 0 32px;
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  transition: background-color 0.16s ease-out, color 0.16s ease-out, transform 0.16s ease-out, border-color 0.16s ease-out;
}

.btn-cta-stone:hover {
  background-color: var(--bg-stone);
  border-color: var(--accent-bronze);
  transform: translateY(-1.5px);
}

.link-editorial {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-heading);
  padding-bottom: 3px;
  border-bottom: 1px solid var(--accent-bronze);
  transition: color 0.18s, border-color 0.18s;
}

.link-editorial:hover {
  color: var(--accent-bronze);
}

/* --------------------------------------------------------------------------
   4. HERO SECTION — GOLDEN DUSK ATELIER & ARCHIVAL GALLERY STAGE
   -------------------------------------------------------------------------- */
.hero-section {
  padding: clamp(32px, 4.5vw, 64px) 0 clamp(56px, 6.5vw, 92px);
}

.hero-layout {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: clamp(40px, 5.5vw, 84px);
  align-items: center;
}

.hero-copy {
  max-width: 550px;
}

.hero-price-line {
  margin-top: 16px;
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding-bottom: 16px;
}

.hero-price {
  font-family: var(--font-didot);
  font-size: 32px;
  font-weight: 400;
  color: var(--ink-heading);
}

.hero-volume {
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.hero-description {
  margin-top: 18px;
  font-size: 16.5px;
  font-weight: 400;
  line-height: 1.75;
  color: var(--ink-body);
}

.scent-notes-pills {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.scent-pill {
  background-color: var(--bg-card);
  color: var(--ink-body);
  border: 1px solid var(--border-warm);
  border-radius: 2px;
  padding: 8px 16px;
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.hero-countdown-strip {
  margin-top: 24px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--bg-card) 95%, transparent) 0%, color-mix(in srgb, var(--bg-nav) 75%, transparent) 100%);
  border: 1px solid var(--border-warm-strong);
  border-radius: 3px;
  padding: 16px 22px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.hero-countdown-strip__label {
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--accent-copper);
}

.hero-countdown-strip__digits {
  display: flex;
  align-items: baseline;
  gap: 16px;
  font-family: var(--font-didot);
  font-size: 27px;
  color: var(--ink-heading);
  line-height: 1;
}

.hero-countdown-strip__unit {
  font-family: var(--font-gothic);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  margin-left: 3px;
}

.hero-cta-stack {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.hero-cta-subrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 6px;
}

/* Right Studio Flacon Archival Card with Inner Frame & Live Film Vignette */
.hero-visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  align-self: start;
  position: sticky;
  top: 110px;
}
@media (max-width: 900px) { .hero-visual { position: static; } }

.hero-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-width: 590px;
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm-strong);
  border-radius: 4px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-shadow: 0 28px 68px color-mix(in srgb, var(--bg-espresso) 6.5%, transparent);
}

.hero-stage::after {
  content: '';
  position: absolute;
  inset: 14px;
  border: 1px solid color-mix(in srgb, var(--accent-bronze) 14%, transparent);
  pointer-events: none;
  z-index: 3;
}

.hero-stage-badge {
  position: absolute;
  top: 24px;
  left: 26px;
  z-index: 4;
  background-color: color-mix(in srgb, var(--bg-card) 90%, transparent);
  backdrop-filter: blur(8px);
  border: 1px solid var(--border-warm);
  border-radius: 2px;
  padding: 6px 14px;
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 15px;
  color: var(--ink-body);
}

/* Godly / Mobbin Live Picture-in-Picture Film Trigger inside Hero Stage */
.hero-pip-trigger {
  position: absolute;
  bottom: 24px;
  right: 24px;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 12px;
  background-color: color-mix(in srgb, var(--bg-card) 94%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--border-warm-strong);
  border-radius: 4px;
  padding: 6px 14px 6px 6px;
  box-shadow: 0 12px 32px color-mix(in srgb, var(--bg-espresso) 12%, transparent);
  transition: transform 0.25s var(--ease-luxury), border-color 0.25s ease, box-shadow 0.25s ease;
}

.hero-pip-trigger:hover {
  transform: translateY(-2px);
  border-color: var(--accent-bronze);
  box-shadow: 0 16px 38px color-mix(in srgb, var(--bg-espresso) 18%, transparent);
}

.hero-pip-trigger__thumb {
  width: 58px;
  height: 42px;
  border-radius: 2px;
  overflow: hidden;
  background-color: var(--bg-stone);
  flex-shrink: 0;
}

.hero-pip-trigger__thumb video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-pip-trigger__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

.hero-pip-trigger__label {
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-heading);
}

.hero-pip-trigger__sub {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 13.5px;
  color: var(--accent-bronze);
  line-height: 1.1;
}

.hero-stage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--ease-luxury);
}

.hero-stage:hover img {
  transform: scale(1.025);
}

.hero-video-overlay {
  position: absolute;
  inset: 0;
  background-color: var(--bg-card);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.45s ease;
  z-index: 2;
}

.hero-video-overlay.is-active {
  opacity: 1;
  pointer-events: auto;
}

.hero-video-overlay video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-provenance-bar {
  width: 100%;
  max-width: 590px;
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 4px;
  font-size: 12px;
  color: var(--ink-muted);
}

.hero-provenance-bar em {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 15px;
  color: var(--ink-body);
}

.media-switcher-pills {
  display: inline-flex;
  background-color: var(--bg-stone);
  border: 1px solid var(--border-warm);
  border-radius: 3px;
  padding: 4px;
  gap: 4px;
}

.media-pill-btn {
  padding: 7px 18px;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-body);
  border-radius: 2px;
  transition: background-color 0.2s, color 0.2s;
}

.media-pill-btn.is-active {
  background-color: var(--bg-card);
  color: var(--ink-heading);
  box-shadow: 0 2px 6px color-mix(in srgb, var(--bg-espresso) 6%, transparent);
}

/* --------------------------------------------------------------------------
   4B. EDITORIAL ATELIER RIBBON (WARM PERSONALITY STRIP)
   -------------------------------------------------------------------------- */
.atelier-ribbon {
  background-color: var(--bg-card);
  padding: 15px 0;
}

.atelier-ribbon__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
}

.atelier-ribbon__item {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-body);
  white-space: nowrap;
}

.atelier-ribbon__item em {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 15.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--accent-bronze);
}

.atelier-ribbon__dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--accent-bronze);
  opacity: 0.6;
}

/* --------------------------------------------------------------------------
   5. SWEDISH PRESS & CREDIBILITY STRIP (VIMMERBY TIDNING & DAGENS VIMMERBY)
   -------------------------------------------------------------------------- */
.press-section {
  background-color: var(--bg-stone);
  padding: clamp(56px, 6vw, 88px) 0;
}

.press-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 40px;
}

.press-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
}

.press-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm);
  border-radius: 4px;
  padding: clamp(28px, 3.5vw, 44px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  box-shadow: 0 16px 40px color-mix(in srgb, var(--bg-espresso) 4%, transparent);
  transition: transform 0.35s var(--ease-luxury), border-color 0.25s ease;
}

.press-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent-bronze);
}

.press-publication {
  font-family: var(--font-didot);
  font-size: 22px;
  letter-spacing: 0.04em;
  color: var(--ink-heading);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 14px;
}

.press-date {
  font-family: var(--font-gothic);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent-bronze);
}

.press-headline {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 26px;
  font-weight: 400;
  line-height: 1.25;
  color: var(--ink-heading);
}

.press-excerpt {
  font-size: 15px;
  font-weight: 400;
  color: var(--ink-body);
  line-height: 1.72;
}

/* --------------------------------------------------------------------------
   6. THE COLLECTION — ARCHIVAL CARDS & 1-STEP INLINE WAITLIST
   -------------------------------------------------------------------------- */
.collection-section {
  padding: clamp(72px, 7.5vw, 118px) 0;
}

.section-header-center {
  text-align: center;
  max-width: 660px;
  margin: 0 auto clamp(44px, 5.5vw, 68px);
}

.section-header-center p {
  margin-top: 14px;
  font-size: 16px;
  font-weight: 400;
  color: var(--ink-body);
}

.collection-duo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 4vw, 48px);
}

.fragrance-showcase-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm-strong);
  border-radius: 4px;
  padding: clamp(28px, 3.8vw, 48px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 22px 54px color-mix(in srgb, var(--bg-espresso) 4.5%, transparent);
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.fragrance-showcase-card:hover {
  border-color: var(--accent-bronze);
  box-shadow: 0 26px 64px color-mix(in srgb, var(--bg-espresso) 7.5%, transparent);
}

.showcase-card-toprow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.showcase-edition-tag {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 15px;
  color: var(--ink-muted);
}

.showcase-status-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 7px 15px;
  border-radius: 2px;
}

.showcase-status-badge--oct30 {
  background-color: color-mix(in srgb, var(--accent-bronze) 12%, transparent);
  color: var(--accent-copper);
  border: 1px solid color-mix(in srgb, var(--accent-bronze) 28%, transparent);
}

.showcase-status-badge--tba {
  background-color: var(--bg-stone);
  color: var(--ink-body);
  border: 1px solid var(--border-warm);
}

.showcase-bottle-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  max-height: 390px;
  width: 100%;
  margin: 0 auto 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent-bronze) 10%, transparent);
  border-radius: 3px;
  background-color: var(--bg-card);
}

.showcase-bottle-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.85s var(--ease-luxury), opacity 0.55s var(--ease-luxury);
}

/* Mobbin / Aesop Secondary Ingredient Image Crossfade on Hover */
.showcase-bottle-wrap .img-ingredients-hover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity 0.55s var(--ease-luxury), transform 0.85s var(--ease-luxury);
}

.showcase-hover-hint {
  position: absolute;
  bottom: 14px;
  right: 14px;
  z-index: 3;
  background-color: color-mix(in srgb, var(--bg-card) 90%, transparent);
  backdrop-filter: blur(6px);
  border: 1px solid var(--border-warm);
  border-radius: 2px;
  padding: 5px 12px;
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 13.5px;
  color: var(--ink-body);
  transition: background-color 0.25s ease, color 0.25s ease;
}

.fragrance-showcase-card:hover .showcase-bottle-wrap .img-ingredients-hover {
  opacity: 1;
  transform: scale(1);
}

.fragrance-showcase-card:hover .showcase-hover-hint {
  background-color: var(--bg-espresso);
  color: var(--ink-on-dark);
  border-color: var(--bg-espresso);
}

.showcase-header-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}

.showcase-price {
  font-family: var(--font-didot);
  font-size: 27px;
  color: var(--ink-heading);
}

.showcase-meta {
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent-bronze);
  margin-bottom: 14px;
  display: block;
}

.showcase-desc {
  font-size: 15.5px;
  font-weight: 400;
  color: var(--ink-body);
  line-height: 1.72;
  margin-bottom: 20px;
}

.showcase-notes-box {
  background-color: var(--bg-canvas);
  border: 1px solid var(--border-warm);
  border-radius: 3px;
  padding: 18px 22px;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  gap: 9px;
  font-size: 14.5px;
  font-weight: 400;
  color: var(--ink-body);
}

.showcase-notes-box strong {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--accent-bronze);
  display: inline-block;
  width: 68px;
}

.showcase-cta-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Direct 1-Step Waitlist Box inside Cards */
.direct-waitlist-box {
  background-color: var(--bg-canvas);
  border: 1px solid var(--border-warm);
  border-radius: 3px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.direct-waitlist-input {
  width: 100%;
  height: 50px;
  padding: 0 16px;
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm);
  border-radius: 2px;
  font-size: 14.5px;
  color: var(--ink-heading);
}

.direct-waitlist-input:focus {
  border-color: var(--accent-bronze);
}

/* Blanc page: explicit, always-visible marine-navy submit button */
body.page-blanc .direct-waitlist-box button[type="submit"] {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  background-color: #12284C !important;
  color: #FFFFFF !important;
  border: none;
  border-radius: 4px;
}

/* --------------------------------------------------------------------------
   6B. HOMEPAGE ATELIER CRAFT & ATMOSPHERE SECTION (GRASSE TO HULTSFRED)
   -------------------------------------------------------------------------- */
.craft-editorial-section {
  padding: clamp(68px, 7.5vw, 112px) 0;
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg-nav) 55%, transparent) 0%, color-mix(in srgb, var(--bg-card) 90%, transparent) 100%);
}

.craft-editorial-grid {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: clamp(36px, 5.5vw, 76px);
  align-items: center;
}

.craft-visual-collage {
  position: relative;
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: 20px;
  align-items: center;
}

.craft-video-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm-strong);
  border-radius: 4px;
  padding: 10px;
  box-shadow: 0 22px 52px color-mix(in srgb, var(--bg-espresso) 7%, transparent);
}

.craft-video-card video {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 2px;
}

.craft-still-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm-strong);
  border-radius: 4px;
  padding: 10px;
  margin-top: 32px;
  box-shadow: 0 18px 44px color-mix(in srgb, var(--bg-espresso) 6%, transparent);
}

.craft-still-card img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center 35%;
  border-radius: 2px;
}

.craft-caption {
  padding: 10px 6px 2px;
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 14.5px;
  color: var(--ink-muted);
}

.craft-quote-box {
  margin-top: 24px;
  padding: 20px 24px;
  background-color: var(--bg-card);
  border-left: 2px solid var(--accent-bronze);
  border-right: 1px solid var(--border-warm);
  border-radius: 0 3px 3px 0;
}

.craft-quote-box p {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 20px;
  line-height: 1.45;
  color: var(--ink-heading);
}

.craft-quote-box cite {
  display: block;
  margin-top: 8px;
  font-family: var(--font-gothic);
  font-style: normal;
  font-size: 11.5px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent-bronze);
}

/* --------------------------------------------------------------------------
   7. OLFACTORY NOTES & RAW INGREDIENTS (WARM ROASTED COCOA EDITORIAL)
   -------------------------------------------------------------------------- */
.olfactory-section {
  background: linear-gradient(165deg, var(--bg-espresso) 0%, var(--bg-espresso) 100%);
  color: var(--ink-on-dark);
  padding: clamp(76px, 8.5vw, 124px) 0;
}

.olfactory-top-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: clamp(44px, 5.5vw, 68px);
}

.olfactory-switch-pills {
  display: inline-flex;
  background-color: var(--bg-umber);
  border: 1px solid color-mix(in srgb, var(--accent-gold-soft) 20%, transparent);
  border-radius: 3px;
  padding: 5px;
  gap: 5px;
}

.olfactory-switch-btn {
  padding: 10px 26px;
  font-family: var(--font-didot);
  font-size: 20px;
  color: var(--ink-on-dark-muted);
  border-radius: 2px;
  transition: background-color 0.25s, color 0.25s;
}

.olfactory-switch-btn.is-active {
  background-color: var(--bg-card);
  color: var(--ink-heading);
}

.olfactory-split {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(40px, 5.5vw, 80px);
  align-items: center;
}

.olfactory-image-card {
  overflow: hidden;
  background-color: var(--bg-umber);
  border: 1px solid color-mix(in srgb, var(--accent-gold-soft) 22%, transparent);
  border-radius: 4px;
  padding: 10px;
}

.olfactory-image-card img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 2px;
}

.note-cards-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.dark-note-card {
  background-color: color-mix(in srgb, var(--bg-espresso) 78%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent-gold-soft) 16%, transparent);
  border-radius: 3px;
  padding: 24px 28px;
}

.dark-note-card__tier {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent-gold-soft);
  margin-bottom: 6px;
}

.dark-note-card__title {
  font-family: var(--font-didot);
  font-size: 27px;
  font-weight: 400;
  color: var(--ink-on-dark);
  margin-bottom: 6px;
}

.dark-note-card__desc {
  font-size: 15px;
  font-weight: 400;
  color: var(--ink-on-dark-muted);
  line-height: 1.68;
}

/* Diptyque / Mobbin Sensory Accord Profile Bars */
.sensory-accord-box {
  margin-top: 16px;
  background-color: color-mix(in srgb, var(--bg-espresso) 55%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent-gold-soft) 16%, transparent);
  border-radius: 3px;
  padding: 20px 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sensory-accord-row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.sensory-accord-labels {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-on-dark);
}

.sensory-accord-labels em {
  font-family: var(--font-didot);
  font-style: italic;
  font-size: 15px;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--accent-gold-soft);
}

.sensory-accord-track {
  width: 100%;
  height: 3px;
  background-color: color-mix(in srgb, var(--bg-card) 12%, transparent);
  border-radius: 2px;
  overflow: hidden;
}

.sensory-accord-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent-bronze), var(--accent-gold-soft));
  border-radius: 2px;
  transition: width 0.65s var(--ease-luxury);
}

/* --------------------------------------------------------------------------
   8. FAQ SECTION (WARM IVORY CARDS)
   -------------------------------------------------------------------------- */
.faq-section {
  background-color: var(--bg-canvas);
  padding: clamp(72px, 8vw, 116px) 0;
}

.faq-container {
  max-width: 860px;
  margin: 0 auto;
}

.faq-stack {
  margin-top: 38px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.faq-item {
  background-color: var(--bg-card);
  border: 1px solid var(--border-warm);
  border-radius: 3px;
  padding: 0 30px;
}

.faq-trigger {
  width: 100%;
  padding: 22px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: left;
  font-family: var(--font-didot);
  font-size: 22px;
  font-weight: 400;
  color: var(--ink-heading);
}

.faq-plus {
  font-size: 22px;
  color: var(--accent-bronze);
  transition: transform 0.3s ease;
}

.faq-item.is-open .faq-plus {
  transform: rotate(45deg);
}

.faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s var(--ease-luxury);
}

.faq-item.is-open .faq-content {
  max-height: 280px;
}

.faq-content__inner {
  padding-bottom: 22px;
  font-size: 15.5px;
  font-weight: 400;
  color: var(--ink-body);
  line-height: 1.72;
}

/* --------------------------------------------------------------------------
   9. DEDICATED SUB-PAGE LAYOUTS (PRODUCT PAGES, STORY, LEGAL)
   -------------------------------------------------------------------------- */
.subpage-hero {
  background-color: var(--bg-canvas);
  background-image: linear-gradient(
    180deg,
    var(--bg-stone) 0%,
    var(--bg-stone) 42%,
    color-mix(in srgb, var(--bg-stone) 68%, var(--bg-canvas)) 62%,
    color-mix(in srgb, var(--bg-stone) 26%, var(--bg-canvas)) 82%,
    var(--bg-canvas) 100%
  );
  padding: clamp(56px, 7vw, 96px) 0 clamp(76px, 8vw, 116px);
  text-align: center;
}

.subpage-content {
  max-width: 820px;
  margin: 0 auto;
  padding: clamp(48px, 6vw, 88px) clamp(20px, 4vw, 40px);
}

.subpage-content h2 {
  font-family: var(--font-didot);
  font-size: 29px;
  font-weight: 400;
  color: var(--ink-heading);
  margin: 36px 0 14px;
}

.subpage-content h3 {
  font-family: var(--font-didot);
  font-size: 22px;
  font-weight: 400;
  color: var(--ink-heading);
  margin: 24px 0 10px;
}

.subpage-content p,
.subpage-content li {
  font-size: 16px;
  font-weight: 400;
  color: var(--ink-body);
  line-height: 1.78;
  margin-bottom: 14px;
}

.subpage-content ul {
  padding-left: 20px;
  list-style: disc;
  margin-bottom: 18px;
}

/* --------------------------------------------------------------------------
   10. FOOTER
   -------------------------------------------------------------------------- */
 .site-footer {
  background: var(--bg-nav);
  color: var(--ink-heading);
  padding: 76px 0 110px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr 1.5fr;
  gap: 36px;
  padding-bottom: 52px;
}

.footer-heading {
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent-bronze);
  margin-bottom: 18px;
}

.footer-links {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 14.5px;
  font-weight: 400;
  color: var(--ink-body);
}

.footer-links a:hover {
  color: var(--ink-heading);
}

.site-footer input[type="email"] {
  background-color: var(--bg-canvas);
  border: 1px solid var(--border-warm-strong);
  color: var(--ink-heading);
  min-width: 0;
}

.site-footer input[type="email"]::placeholder {
  color: var(--ink-muted);
  opacity: 1;
}

#waitlistDrawer { justify-content: flex-start; }
#waitlistDrawer .drawer-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.waitlist-option { padding-right: 44px; }
.waitlist-option-meta { letter-spacing: 0; line-height: 1.5; }


/* --------------------------------------------------------------------------
   12. CUSTOM SLIDE-OVER DRAWERS
   -------------------------------------------------------------------------- */
.drawer-backdrop {
  position: fixed;
  inset: 0;
  background-color: color-mix(in srgb, var(--bg-espresso) 44%, transparent);
  backdrop-filter: blur(4px);
  z-index: 1000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

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

.luxury-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  max-width: 480px;
  background-color: var(--bg-card);
  border-left: 1px solid var(--border-warm-strong);
  z-index: 9600;
  transform: translateX(100%);
  transition: transform 0.45s var(--ease-luxury);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: -24px 0 80px color-mix(in srgb, var(--bg-espresso) 15%, transparent);
}

.luxury-drawer.is-open {
  transform: translateX(0);
}

.drawer-header {
  padding: 24px 32px;
  background-color: var(--bg-canvas);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.drawer-title {
  font-family: var(--font-didot);
  font-size: 25px;
  color: var(--ink-heading);
}

.drawer-close {
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-heading);
  padding: 8px 14px;
  background-color: var(--bg-stone);
  border: 1px solid var(--border-warm);
  border-radius: 2px;
}

.drawer-shipping-bar {
  padding: 16px 32px;
  background-color: var(--bg-stone);
  font-size: 13px;
  font-weight: 400;
  color: var(--ink-heading);
}

.drawer-shipping-track {
  height: 3px;
  background-color: color-mix(in srgb, var(--bg-espresso) 14%, transparent);
  margin-top: 8px;
}

.drawer-shipping-fill {
  height: 100%;
  background-color: var(--accent-bronze);
  width: 0%;
  transition: width 0.35s ease;
}

.drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 30px 32px;
}

.waitlist-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.waitlist-form[hidden], .waitlist-feedback[hidden] { display: none !important; }

.waitlist-options {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
  display: grid;
  gap: 10px;
}

.waitlist-options legend {
  margin-bottom: 12px;
}

.waitlist-option {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 20px 22px;
  border: 1px solid var(--border-warm-strong);
  border-radius: 3px;
  background: var(--bg-card);
  color: var(--ink-heading);
  cursor: pointer;
  transition: border-color 0.16s ease-out, background-color 0.16s ease-out;
}

.waitlist-option-title {
  font-family: var(--font-didot);
  font-size: 19px;
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

.waitlist-option-meta {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.waitlist-option::after {
  content: "";
  position: absolute;
  top: 24px;
  right: 22px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid var(--border-warm-strong);
  background: transparent;
  transition: border-color 0.16s ease-out, background-color 0.16s ease-out;
}

.waitlist-option:hover {
  border-color: var(--accent-bronze);
  background: var(--bg-stone);
}

.waitlist-option:has(input:checked) {
  border-color: var(--ink-heading);
  box-shadow: inset 0 0 0 1px var(--ink-heading);
  background: var(--bg-stone);
}

.waitlist-option:has(input:checked)::after {
  border-color: var(--accent-bronze);
  background: var(--accent-bronze);
}

.waitlist-option input {
  appearance: none;
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  flex-shrink: 0;
}

.waitlist-option:focus-within {
  outline: 2px solid var(--accent-bronze);
  outline-offset: 3px;
}

.waitlist-email-label {
  margin-bottom: -8px;
}

.waitlist-form input[type="email"] {
  width: 100%;
  height: 58px;
  padding: 0 16px;
  background: var(--bg-field);
  font-size: 16px;
}

.waitlist-feedback {
  margin-top: 20px;
  font-size: 14px;
  color: var(--ink-heading);
}

.drawer-footer {
  padding: 24px 32px;
  background-color: var(--bg-canvas);
}

/* --------------------------------------------------------------------------
   13. RESPONSIVE & MOBILE STACKED STICKY BAR
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .site-header {
    grid-template-columns: auto 1fr auto;
  }
  .mobile-menu-btn {
    display: inline-flex;
  }
  .hero-layout,
  .collection-duo-grid,
  .craft-editorial-grid,
  .olfactory-split,
  .press-grid {
    grid-template-columns: 1fr;
  }
  .hero-visual {
    order: -1;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 680px) {
  body {
    padding-bottom: 136px;
  }
  .site-header {
    height: 70px;
    padding: 0 14px;
  }
  .brand-logo {
    font-size: 30px;
    letter-spacing: 0.22em;
  }
  .brand-word-sub { display: none; }
  .bag-trigger-btn {
    padding: 8px 13px;
    font-size: 11px;
    gap: 7px;
  }
  .craft-visual-collage {
    grid-template-columns: 1fr;
  }
  .atelier-ribbon__inner {
    justify-content: center;
    text-align: center;
  }
  .footer-grid {
    grid-template-columns: 1fr;
  }

}

/* --------------------------------------------------------------------------
   14. COOKIEBOT PRIOR-CONSENT BANNER & EU/SWEDISH LEGAL DECLARATION SHEET
   -------------------------------------------------------------------------- */
.cb-banner {
  position: fixed;
  left: 16px;
  right: auto;
  bottom: 16px;
  width: calc(100% - 32px);
  max-width: 560px;
  z-index: 9500;
  background-color: var(--bg-card);
  color: var(--ink-heading);
  border: 1px solid var(--border-warm-strong);
  border-radius: 4px;
  box-shadow: var(--consent-shadow);
  transform: translateY(calc(100% + 32px));
  visibility: hidden;
  transition: transform 0.45s var(--ease-luxury);
  max-height: 90vh;
  overflow-y: auto;
}

.cb-banner { transition: transform 0.45s var(--ease-luxury); }

.cb-banner.is-visible {
  transform: translateY(0);
  visibility: visible;
}

.cb-banner__inner {
  max-width: 1360px;
  margin: 0 auto;
  padding: 16px 20px;
}

.cb-banner__top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: center;
}

.cb-banner__badge-row {
  display: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.cb-banner__badge {
  background-color: var(--bg-espresso);
  color: var(--ink-on-dark);
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 2px;
}

.cb-banner__law {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent-bronze);
}

.cb-banner__title {
  font-family: var(--font-didot);
  font-size: 20px;
  font-weight: 400;
  color: var(--ink-heading);
  margin-bottom: 6px;
}

.cb-banner__desc {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--ink-body);
}

.cb-banner__link {
  text-decoration: underline;
  font-weight: 400;
  color: var(--ink-heading);
}

.cb-banner__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.cb-btn {
  height: 50px;
  padding: 0 20px;
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition: background-color 0.2s, color 0.2s, transform 0.15s;
}

/* Equal prominence for Accept All and Necessary Only per IMY & EDPB guidelines */
.cb-btn--accept {
  background-color: var(--bg-espresso);
  color: var(--ink-on-dark);
}

.cb-btn--accept:hover {
  background-color: var(--accent-bronze);
}

.cb-btn--necessary {
  background-color: var(--bg-espresso);
  color: var(--ink-on-dark);
}

.cb-btn--necessary:hover {
  background-color: var(--accent-bronze);
}

.cb-btn--customize {
  grid-column: 1 / -1;
  height: 24px;
  background-color: transparent;
  color: var(--ink-body);
  font-size: 11px;
}

.cb-btn--customize:hover {
  background-color: var(--bg-stone);
  color: var(--ink-heading);
}

.cb-banner__details {
  margin-top: 24px;
  padding-top: 24px;
}

.cb-categories-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 20px;
}

.cb-cat-card {
  background-color: var(--bg-canvas);
  border: 1px solid var(--border-warm);
  border-radius: 3px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cb-cat-card--interactive {
  cursor: pointer;
  transition: background-color 0.2s;
}

.cb-cat-card--interactive:hover {
  background-color: var(--bg-stone);
}

.cb-cat-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.cb-cat-card__title {
  display: block;
  font-family: var(--font-didot);
  font-size: 19px;
  font-weight: 400;
  color: var(--ink-heading);
}

.cb-cat-card__meta {
  display: block;
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent-bronze);
  margin-top: 2px;
}

.cb-cat-card__desc {
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--ink-body);
}

.cb-status-pill--locked {
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  background-color: var(--bg-stone);
  color: var(--ink-heading);
  padding: 4px 8px;
  white-space: nowrap;
}

.cb-checkbox {
  width: 20px;
  height: 20px;
  accent-color: var(--bg-espresso);
  cursor: pointer;
  flex-shrink: 0;
}

.cb-declaration-table-wrap {
  overflow-x: auto;
  margin-bottom: 18px;
  background-color: var(--bg-canvas);
  border: 1px solid var(--border-warm);
  padding: 14px 18px;
}

.cb-declaration-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  text-align: left;
}

.cb-declaration-table th {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  padding: 8px 10px;
}

.cb-declaration-table td {
  padding: 9px 10px;
  color: var(--ink-body);
}

.cb-banner__save-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.cb-receipt-readout {
  font-size: 12px;
  color: var(--ink-muted);
}

.cb-btn--save {
  background-color: var(--bg-espresso);
  color: var(--ink-on-dark);
  min-width: 260px;
}

.cb-btn--save:hover {
  background-color: var(--accent-bronze);
}

@media (max-width: 1024px) {
  .cb-banner__top {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .cb-categories-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 680px) {
  .cb-banner__actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .cb-btn { padding: 0 8px; font-size: 10px; letter-spacing: 0.08em; }
  .cb-categories-grid {
    grid-template-columns: 1fr;
  }
  .cb-btn--save {
    width: 100%;
  }
}

/* --------------------------------------------------------------------------
   15. TOP-DOWN ARCHITECTURAL DROPDOWN MENU CURTAIN (REPLACES SIDE HAMBURGER)
   -------------------------------------------------------------------------- */
.mobile-menu-btn {
  position: relative;
  gap: 8px;
  padding: 8px 14px;
  background-color: transparent;
  color: var(--ink-heading);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  width: auto;
  height: 38px;
  transition: color 0.18s ease;
}

.mobile-menu-btn:hover,
.mobile-menu-btn.is-open {
  color: var(--accent-bronze);
}

.mobile-menu-btn svg g {
  transition: opacity 0.2s ease;
}

.top-dropdown-curtain {
  position: fixed;
  top: 82px;
  left: 0;
  right: 0;
  z-index: 1040;
  background-color: var(--bg-card);
  border-bottom: 1px solid var(--border-warm-strong);
  box-shadow: 0 24px 60px color-mix(in srgb, var(--bg-espresso) 14%, transparent);
  clip-path: inset(0 0 100% 0);
  opacity: 0;
  pointer-events: none;
  transition: clip-path 0.28s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease-out;
  max-height: calc(100vh - 82px);
  overflow-y: auto;
}

.top-dropdown-curtain.is-open {
  clip-path: inset(0 0 0% 0);
  opacity: 1;
  pointer-events: auto;
}

body.top-menu-open {
  overflow: hidden;
}

body.top-menu-open .site-header {
  position: fixed;
  inset: 0 0 auto;
}

body.top-menu-open .top-dropdown-curtain {
  top: var(--menu-header-height, 82px);
  max-height: calc(100dvh - var(--menu-header-height, 82px));
  overscroll-behavior: contain;
}

.top-dropdown-curtain__inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 36px clamp(24px, 5vw, 68px) 42px;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(32px, 6vw, 88px);
  align-items: start;
}

.top-dropdown-nav-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.top-dropdown-link {
  font-family: var(--font-didot);
  font-size: clamp(1.65rem, 2.3vw, 2.2rem);
  font-weight: 400;
  color: var(--ink-heading);
  display: inline-flex;
  align-items: center;
  padding: 8px 0;
  transition: color 0.12s ease-out, transform 0.12s ease-out;
}

.top-dropdown-link:hover {
  color: var(--accent-bronze);
  transform: translateX(6px);
}

.top-dropdown-secondary-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 8px;
}

.top-dropdown-secondary-link {
  font-family: var(--font-didot);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  padding: 6px 0;
  transition: color 0.12s ease-out, transform 0.12s ease-out;
}

.top-dropdown-secondary-link:hover {
  color: var(--ink-heading);
  transform: translateX(4px);
}

/* --------------------------------------------------------------------------
   16. UNIVERSAL SMOOTH SCROLL-REVEAL ANIMATIONS ACROSS ALL 9 PAGES
   -------------------------------------------------------------------------- */
.reveal-on-scroll {
  opacity: 1 !important;
  transform: none !important;
  transition: none;
}

.reveal-on-scroll.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 1024px) {
  .top-dropdown-curtain__inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* --------------------------------------------------------------------------
   17. ULTRA-CLEAN FULL-SCREEN HERO, MINIMAL 2-COLUMN DISCOVER & STORY BANNER
       (Zero Text Clutter · Maximum Visual Personality like Dior / Byredo / Avante)
   -------------------------------------------------------------------------- */
.fullscreen-hero {
  position: relative;
  width: 100%;
  height: calc(100svh - var(--site-header-height, 124px));
  min-height: 620px;
  max-height: 960px;
  overflow: hidden;
  background-color: var(--bg-espresso);
  display: flex;
  align-items: flex-end;
}

.fullscreen-hero__slides {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.fullscreen-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: none;
  transform: none;
}

.fullscreen-hero__slide.is-active {
  opacity: 1;
  visibility: visible;
}

.fullscreen-hero__slide img,
.fullscreen-hero__slide video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.fullscreen-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: none;
  pointer-events: none;
}
.fullscreen-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--hero-vignette);
  pointer-events: none;
}
body:has(.cb-banner.is-visible) .fullscreen-hero__content {
  padding-bottom: max(84px, calc(var(--consent-banner-height, 220px) + 32px));
}
@media (max-width: 768px) {
  .fullscreen-hero__slide img, .fullscreen-hero__slide video { object-position: 65% 30%; }
  .fullscreen-hero__content { gap: 16px; }
  .fullscreen-hero__title, .fullscreen-hero__title em,
  .fullscreen-hero__eyebrow, .fullscreen-hero__sub { color: var(--ink-on-dark); text-shadow: var(--hero-text-shadow); }
}

.fullscreen-hero__content {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(24px, 5vw, 72px) clamp(52px, 7vh, 84px);
  color: var(--ink-on-dark);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 36px;
}

.fullscreen-hero__left {
  max-width: 620px;
}

.fullscreen-hero__eyebrow {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ink-on-dark) 78%, transparent);
  margin-bottom: 16px;
  display: block;
}

.fullscreen-hero__title {
  font-family: var(--font-gothic);
  font-size: clamp(3.2rem, 6.2vw, 5.6rem);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: 0;
  color: var(--ink-on-dark);
}

.fullscreen-hero__title em {
  font-style: italic;
  font-weight: 400;
  color: var(--accent-gold-soft);
}

.fullscreen-hero__sub {
  margin-top: 18px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: color-mix(in srgb, var(--ink-on-dark) 84%, transparent);
  max-width: 440px;
}

.fullscreen-hero__actions {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px;
}

.btn-hero-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background-color: var(--bg-card);
  color: var(--bg-espresso);
  height: 52px;
  padding: 0 32px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  transition: background-color 0.25s ease, color 0.25s ease, transform 0.2s ease;
}

.btn-hero-pill:hover {
  background-color: var(--accent-bronze);
  color: var(--bg-card);
  transform: translateY(-1.5px);
}

.link-hero-minimal {
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--ink-on-dark);
  padding-bottom: 5px;
  border-bottom: 1px solid color-mix(in srgb, var(--ink-on-dark) 65%, transparent);
  transition: color 0.2s ease, border-color 0.2s ease;
}

.link-hero-minimal:hover {
  color: var(--accent-gold-soft);
  border-color: var(--accent-gold-soft);
}

.fullscreen-hero__countdown {
  background-color: color-mix(in srgb, var(--bg-espresso) 52%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid color-mix(in srgb, var(--ink-on-dark) 18%, transparent);
  border-radius: 4px;
  padding: 20px 28px;
}

.fullscreen-hero__cd-label {
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ink-on-dark) 78%, transparent);
  margin-bottom: 10px;
}

.fullscreen-hero__cd-grid {
  display: flex;
  align-items: baseline;
  gap: 22px;
}

.fullscreen-hero__cd-cell {
  text-align: center;
  min-width: 48px;
}

.fullscreen-hero__cd-num {
  font-family: var(--font-didot);
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 400;
  line-height: 1;
  color: var(--ink-on-dark);
}

.fullscreen-hero__cd-unit {
  margin-top: 5px;
  font-size: 9.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ink-on-dark) 68%, transparent);
}

.fullscreen-hero__dots {
  position: absolute;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 10px;
}

.fullscreen-hero__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--ink-on-dark) 80%, transparent);
  background-color: transparent;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.fullscreen-hero__dot.is-active {
  background-color: var(--ink-on-dark);
  transform: scale(1.15);
}

/* Minimalist 2-Column Product Showcase (#discover) — Zero Wall of Text */
.minimal-discover-section {
  background-color: var(--bg-canvas);
  padding: 0;
}
#discover, .collection-grid, .minimal-discover-grid { scroll-margin-top: 88px; }

.minimal-discover-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.minimal-scent-card {
  display: flex;
  flex-direction: column;
}

.minimal-scent-card__media {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background-color: var(--bg-card);
  display: block;
}

.minimal-scent-card__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s var(--ease-luxury), opacity 0.55s var(--ease-luxury);
}

.minimal-scent-card__media .img-hover-notes {
  opacity: 0;
  transform: scale(1.04);
}

.minimal-scent-card:hover .minimal-scent-card__media img:first-child {
  transform: scale(1.04);
}

.minimal-scent-card:hover .minimal-scent-card__media .img-hover-notes {
  opacity: 1;
  transform: scale(1);
}

.minimal-scent-card__badge {
  position: absolute;
  top: 28px;
  left: 28px;
  z-index: 3;
  background-color: color-mix(in srgb, var(--bg-espresso) 68%, transparent);
  backdrop-filter: blur(8px);
  color: var(--ink-on-dark);
  font-size: 10.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: 999px;
}

.minimal-scent-card__body {
  padding: clamp(22px, 3vw, 36px) clamp(24px, 4vw, 48px) clamp(28px, 3.5vw, 44px);
  background-color: var(--bg-canvas);
}

.minimal-scent-card__row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.minimal-scent-card__title {
  font-family: var(--font-gothic);
  font-size: clamp(1.85rem, 2.5vw, 2.35rem);
  font-weight: 400;
  color: var(--ink-heading);
  line-height: 1.1;
}

.minimal-scent-card__sub {
  margin-top: 4px;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.minimal-scent-card__discover {
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-heading);
  padding-bottom: 4px;
  border-bottom: 1px solid color-mix(in srgb, var(--bg-espresso) 50%, transparent);
  white-space: nowrap;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.minimal-scent-card:hover .minimal-scent-card__discover {
  color: var(--accent-bronze);
  border-color: var(--accent-bronze);
}


/* FAQ eyebrow label */
.faq-eyebrow {
  font-size: 11px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--ink-muted);
}


@media (max-width: 900px) {
  .minimal-discover-grid {
    grid-template-columns: 1fr;
  }
}


/* --------------------------------------------------------------------------
   HEADER POLISH — clean text buttons, correct close (X) icon, tidy phone header
   -------------------------------------------------------------------------- */
.mobile-menu-btn,
.mobile-menu-btn:hover,
.mobile-menu-btn.is-open {
  background-color: transparent;
  color: var(--ink-heading);
  padding: 8px 4px;
}
.mobile-menu-btn span { position: relative; }
.mobile-menu-btn:hover span::after,
.mobile-menu-btn.is-open span::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -4px;
  height: 1px; background: currentColor;
}
.mobile-menu-btn .mm-bars,
.mobile-menu-btn .mm-cross { transition: opacity 0.18s ease; }
.mobile-menu-btn .mm-cross { opacity: 0; }
.mobile-menu-btn.is-open .mm-bars { opacity: 0; }
.mobile-menu-btn.is-open .mm-cross { opacity: 1; }

.bag-trigger-btn,
.bag-trigger-btn:hover {
  background-color: transparent;
  padding: 8px 2px;
  border-bottom: 1px solid var(--ink-heading);
}
.bag-trigger-btn:hover { opacity: 0.7; }

@media (max-width: 680px) {
  .site-header { grid-template-columns: auto 1fr auto; gap: 10px; }
  .brand-logo { font-size: 30px; letter-spacing: 0.22em; text-align: center; white-space: nowrap; }
  .bag-trigger-btn { padding: 6px 0; font-size: 10.5px; letter-spacing: 0.14em; }
  .mobile-menu-btn { font-size: 10.5px; gap: 6px; }
  .top-dropdown-curtain { top: 70px; }
}
@media (max-width: 380px) {
  .mobile-menu-btn span { display: none; }
  .brand-logo { font-size: 28px; letter-spacing: 0.2em; }
}
@media (max-width: 680px) {
  body { padding-bottom: 0; }
}
/* Compact cookie banner on phones so it doesn't cover the page */
@media (max-width: 680px) {
  .cb-banner__badge-row { display: none !important; }
  .cb-banner__title { font-size: 20px !important; margin-bottom: 6px !important; }
  .cb-banner__desc { font-size: 12.5px !important; line-height: 1.5 !important; }
  .cb-banner__desc strong { font-weight: 500; }
  .cb-banner__actions { gap: 8px !important; }
  .cb-banner__actions button { height: 46px !important; min-height: 0 !important; }
}



/* Shared wordmark and simplified product pages */
.brand-word-sub { display: none; }
.product-page .hero-layout {
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  align-items: start;
  gap: 36px;
}
.product-gallery {
  min-width: 0;
  display: grid;
  gap: 12px;
  position: sticky;
  top: 106px;
  align-self: start;
  width: 100%;
}
.product-gallery__photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; align-items: start; }
.product-gallery__photos img { display: block; width: 100%; height: auto; min-width: 0; aspect-ratio: 1 / 1; object-fit: cover; object-position: center; }
.product-gallery__photos > img:last-child:nth-child(odd) { grid-column: 1 / -1; aspect-ratio: 2 / 1; }
.product-gallery__film { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: center; background: var(--bg-card); pointer-events: none; }
.product-gallery__film::-webkit-media-controls,
.product-gallery__film::-webkit-media-controls-panel,
.product-gallery__film::-webkit-media-controls-play-button,
.product-gallery__film::-webkit-media-controls-start-playback-button { display: none !important; -webkit-appearance: none; }
.product-title { font-family: var(--font-didot); font-size: 42px; font-weight: 400; line-height: 1.2; letter-spacing: 0; margin-top: 16px; color: var(--ink-heading); }
.product-page .hero-copy { min-width: 0; width: 100%; }
.product-page .hero-price-line { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; padding-bottom: 20px; }
.product-page .hero-volume { letter-spacing: 0; font-size: 13px; text-transform: none; line-height: 1.5; }
.product-page .hero-description { margin-top: 24px; font-size: 15px; line-height: 1.7; text-wrap: pretty; }
.product-page .showcase-notes-box { margin-top: 28px; margin-bottom: 0; padding: 0; border: 0; background: transparent; gap: 14px; font-size: 14px; line-height: 1.6; }
.product-page .showcase-notes-box > div { display: grid; grid-template-columns: 60px minmax(0, 1fr); gap: 14px; align-items: baseline; }
.product-page .showcase-notes-box strong { width: auto; letter-spacing: 0; font-size: 12px; font-weight: 600; color: var(--ink-heading); }
.product-page .showcase-notes-box span { min-width: 0; text-wrap: pretty; }
.product-page .hero-cta-stack { margin-top: 32px; }
.product-page .hero-countdown-strip { background: transparent; border: 0; border-radius: 0; padding: 18px 0; gap: 12px; }
.product-page .hero-countdown-strip__label { letter-spacing: 0; }
.product-page .hero-price { font-family: var(--font-didot); font-weight: 400; letter-spacing: 0.01em; }
.product-page .hero-countdown-strip__digits { font-family: var(--font-didot); font-weight: 400; letter-spacing: 0.01em; }
.product-page .direct-waitlist-box { padding: 0; border: 0; background: transparent; }
.product-ingredients { margin-top: 28px; padding-top: 20px; }
@media (max-width: 1024px) {
  .product-page .hero-layout { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 28px; }
}
@media (max-width: 760px) {
  .product-page .hero-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .product-gallery { position: static; width: 100%; }
}
@media (max-width: 680px) {
  .product-gallery { gap: 12px; }
  .product-gallery__photos { gap: 10px; }
  .product-title { font-size: 32px; }
  .product-page .hero-volume { letter-spacing: 0; }
}

/* Product pages: whiter canvas, navbar keeps its own color */
html:has(body.product-page) { background-color: var(--bg-product); }
.product-page {
  background-color: var(--bg-product);
  background-image: none;
}
.product-page .product-gallery__film { background: var(--bg-product); }
.product-reassurance { font-size: 11px; line-height: 1.7; color: var(--ink-muted); text-transform: uppercase; letter-spacing: 0; }
.waitlist-confirmation { display: block !important; background: transparent !important; padding: 16px 0 !important; }
.waitlist-confirmation h2 { font-family: var(--font-didot); font-size: 28px; font-weight: 400; color: var(--ink-charcoal); }
.waitlist-confirmation p { margin-top: 12px; font-size: 14px; line-height: 1.7; color: var(--ink-body); }
.waitlist-confirmation nav { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 16px; font-size: 12px; }
.waitlist-confirmation a { text-decoration: underline; text-underline-offset: 4px; }
.site-footer .waitlist-confirmation h2, .site-footer .waitlist-confirmation p, .site-footer .waitlist-confirmation a { color: var(--ink-heading); }

/* Keep first-visit choices clear without changing the wordmark or title sizes. */
@media (max-width: 768px) {
  .fullscreen-hero { height: auto; min-height: calc(100svh - var(--site-header-height, 124px)); }
  .fullscreen-hero::after { background: var(--hero-vignette-mobile); }
  .fullscreen-hero__content { gap: 16px; }
  .fullscreen-hero__left { min-width: 0; }
  .fullscreen-hero__title, .fullscreen-hero__title em,
  .fullscreen-hero__eyebrow, .fullscreen-hero__sub { color: var(--ink-on-dark); }
  .fullscreen-hero__countdown { max-width: 100%; padding: 12px 16px; }
  .fullscreen-hero__cd-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
  .fullscreen-hero__cd-cell { min-width: 0; }
  .fullscreen-hero__cd-label { letter-spacing: 0.12em; }
  .cb-banner__actions .cb-btn--customize { height: 24px !important; }
}
@media (max-width: 380px) {
  .cb-banner__inner { padding: 12px 16px; }
  .cb-banner__title { font-size: 18px; margin-bottom: 4px; }
  .cb-banner__desc { font-size: 11px; line-height: 1.4; }
  .cb-banner__row { gap: 8px; }
  .cb-banner__actions .cb-btn { height: 40px !important; }
  .fullscreen-hero__eyebrow { margin-bottom: 8px; }
  .fullscreen-hero__sub { margin-top: 10px; }
  .fullscreen-hero__actions { margin-top: 12px; }
  .fullscreen-hero__actions { gap: 12px; }
  .fullscreen-hero__actions .btn-hero-pill { padding: 0 16px; letter-spacing: 0.1em; }
  .fullscreen-hero__actions .link-hero-minimal { letter-spacing: 0.1em; }
}

/* Shared typography and light-surface form roles across every public page. */
h1, h2, h3, .scent-card__title { font-family: var(--font-didot); }
p, .header-link, .eyebrow, .showcase-status-badge,
.showcase-notes-box, .subpage-content li, .subpage-content code,
button, input, textarea, select, code, pre, .faq-trigger { font-family: var(--font-gothic); }
.top-dropdown-curtain a, #mobileNavDrawer a { font-family: var(--font-didot); }
input[type="text"], input[type="email"], textarea {
  background-color: var(--bg-field);
  color: var(--ink-heading);
  border: 1px solid var(--border-warm-strong);
}
input::placeholder, textarea::placeholder { color: var(--ink-muted); opacity: 1; }
input:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent-bronze); outline-offset: 2px; }
.site-footer p { color: var(--ink-body); }
.site-footer [data-open-cookiebot] { color: var(--ink-heading); }
.footer-newsletter { display: flex; gap: 6px; background: transparent; }
.footer-newsletter input { flex: 1; width: 0; padding: 0 12px; font-size: 14px; }
.footer-newsletter button { padding: 11px 18px; font-size: 11.5px; text-transform: uppercase; }
.btn-hero-pill, .footer-newsletter button { background: var(--bg-espresso); color: var(--ink-on-dark); }
.btn-hero-pill:hover, .footer-newsletter button:hover { background: var(--accent-bronze); color: var(--ink-on-dark); }

/* Countdown numbers and prices share the body font (Jost). */
.fullscreen-hero__cd-num,
.hero-countdown-strip__digits,
.product-page .hero-price,
.product-page .hero-countdown-strip__digits { font-family: var(--font-gothic); font-weight: 400; letter-spacing: 0; }

/* AVANTE FLAGSHIP — restrained light, coastal sage and obsidian editorial. */
:root {
  --bg-canvas: oklch(1 0 0);
  --bg-card: oklch(0.976 0.004 90);
  --bg-nav: color-mix(in oklab, var(--bg-canvas) 90%, transparent);
  --bg-stone: oklch(0.96 0.004 90);
  --bg-field: oklch(0.944 0.004 90);
  --bg-espresso: oklch(0.26 0.055 255);
  --bg-umber: oklch(0.34 0.05 252);
  --ink-heading: oklch(0.225 0.006 260);
  --ink-body: oklch(0.36 0.006 260);
  --ink-muted: oklch(0.49 0.008 90);
  --ink-on-dark: oklch(0.96 0.012 85);
  --ink-on-dark-muted: oklch(0.77 0.012 85);
  --accent-bronze: oklch(0.5 0.066 81);
  --accent-copper: oklch(0.45 0.055 81);
  --accent-gold-soft: oklch(0.77 0.09 83);
  --accent-ink-hover: oklch(0.37 0.06 252);
  --accent-amber: oklch(0.74 0.175 50);
  --accent-amber-lift: oklch(0.78 0.165 52);
  --accent-amber-deep: oklch(0.63 0.185 44);
  --accent-marine: oklch(0.55 0.11 250);
  --accent-marine-lift: oklch(0.60 0.11 250);
  --accent-marine-deep: oklch(0.44 0.13 252);
  --accent-sage: oklch(0.43 0.04 149);
  --border-warm: color-mix(in oklab, var(--ink-heading) 8%, transparent);
  --border-warm-strong: color-mix(in oklab, var(--ink-heading) 22%, transparent);
  --hero-vignette: linear-gradient(90deg, color-mix(in oklab,oklch(0.18 0 0) 70%,transparent), transparent 75%), linear-gradient(0deg, color-mix(in oklab,oklch(0.18 0 0) 65%,transparent), transparent 65%);
  --hero-vignette-mobile: linear-gradient(0deg,color-mix(in oklab,oklch(0.18 0 0) 75%,transparent),color-mix(in oklab,oklch(0.18 0 0) 20%,transparent));
}
body { padding-bottom: 0; }
button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible,a:focus-visible { outline: 2px solid var(--accent-bronze); outline-offset: 4px; }
button:disabled { opacity: .5; cursor: not-allowed; }
.scroll-progress-line { display:none; }
.warm-bottle-blend { filter:none; }
.brand-logo { font-size: 38px; letter-spacing:0; line-height:1; }
.site-header { height:88px; padding-inline:48px; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--border-warm); }
.header-left-group { gap:22px; min-width:0; }
.header-nav { gap:20px; }
.header-link, .mobile-menu-btn, .bag-trigger-btn { letter-spacing:0; font-size:13.5px; text-transform:uppercase; }
.mobile-menu-btn { min-height:44px; }
.header-actions { gap:24px; }
.bag-trigger-btn { border:0; min-height:44px; }
.announcement-bar { padding:8px 20px; font-size:10px; letter-spacing:0; line-height:1.6; }
.announcement-bar button,.announcement-bar a { letter-spacing:0; font-size:10px; }
.top-dropdown-curtain { background:var(--bg-nav); border:0; }
.top-dropdown-curtain__inner { padding-block:48px; }
.top-dropdown-link { font-size:36px; }
.top-dropdown-secondary-link { font-family:var(--font-gothic); letter-spacing:0; }
.eyebrow { letter-spacing:0; font-size:11px; font-weight:500; }
.eyebrow::before,.eyebrow::after { display:none; }
.heading-xl { font-size:68px; }
.heading-lg { font-size:52px; }
.heading-md { font-size:36px; }
.btn-cta-espresso,.btn-cta-stone,.btn-hero-pill { border-radius:2px; box-shadow:none; min-height:52px; font-size:12px; letter-spacing:0; font-weight:500; }
.btn-cta-espresso { border:0; }
.btn-cta-espresso:hover,.btn-cta-stone:hover,.btn-hero-pill:hover { transform:none; box-shadow:none; }
.btn-hero-pill { background:var(--ink-on-dark); color:var(--bg-espresso); border-radius:2px; padding-inline:28px; }
.link-editorial,.link-hero-minimal { letter-spacing:0; font-size:12px; }
.fullscreen-hero { height:calc(100svh - var(--site-header-height, 166px)); min-height:590px; max-height:none; }
.fullscreen-hero__slides { background:var(--bg-espresso); }
.fullscreen-hero__content { max-width:1440px; padding:60px 64px; gap:40px; align-items:flex-end; }
body:has(.cb-banner.is-visible) .fullscreen-hero__content { padding-bottom:60px; }
.fullscreen-hero__left { max-width:600px; }
.fullscreen-hero__title { font-family:var(--font-didot); font-size:80px; line-height:1.08; font-weight:400; letter-spacing:0; }
.fullscreen-hero__eyebrow { letter-spacing:0; font-size:12px; margin-bottom:22px; }
.fullscreen-hero__sub { font-size:16px; max-width:350px; margin-top:22px; }
.fullscreen-hero__actions { margin-top:32px; }
.fullscreen-hero__countdown { background:transparent; backdrop-filter:none; border:0; padding:0; }
.fullscreen-hero__cd-label { letter-spacing:0; font-size:11px; margin-bottom:16px; }
.fullscreen-hero__cd-num { font-family:var(--font-gothic); font-size:40px; font-variant-numeric:tabular-nums; }
.fullscreen-hero__cd-unit { letter-spacing:0; font-size:10px; }
.fullscreen-hero__cd-grid { display:flex; gap:8px; font-family:var(--font-gothic); font-size:18px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.fullscreen-hero__cd-label { color:color-mix(in srgb, var(--accent-amber) 58%, var(--ink-on-dark)); text-transform:uppercase; letter-spacing:.22em; font-size:10.5px; margin-bottom:10px; }
.fullscreen-hero__cd-note { margin-top:10px; font-size:11.5px; letter-spacing:.06em; color:color-mix(in srgb, var(--ink-on-dark) 84%, transparent); }
.fullscreen-hero__countdown { background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; border:0; border-radius:0; padding:0; text-shadow:0 1px 14px color-mix(in srgb, var(--bg-espresso) 55%, transparent); }
.minimal-discover-section { padding:76px 48px 84px; max-width:1536px; margin:auto; }
.collection-intro { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:36px; }
.collection-intro h2 { font-size:48px; font-weight:400; line-height:1.12; }
.collection-intro p { font-size:13px; color:var(--ink-muted); }
.minimal-discover-grid { gap:28px; }
.minimal-scent-card__media { aspect-ratio:1; background:var(--bg-canvas); border:1px solid var(--border-warm); }
.minimal-scent-card__badge { top:20px; left:20px; border-radius:2px; background:var(--bg-canvas); color:var(--ink-heading); font-size:10px; letter-spacing:0; padding:7px 12px; backdrop-filter:none; }
.minimal-scent-card__body { padding:24px 0 0; }
.minimal-scent-card__row { align-items:center; gap:12px; margin-bottom:24px; }
.minimal-scent-card__title { font-family:var(--font-didot); font-size:30px; }
.scent-family { color:var(--accent-sage); font-size:11px; margin-bottom:8px; }
.minimal-scent-card__sub { font-size:12px; text-transform:none; letter-spacing:0; margin-top:10px; }
.minimal-scent-card__discover { font-size:11px; letter-spacing:0; }
.minimal-scent-card .btn-cta-espresso { background:transparent; border:1px solid var(--border-warm-strong); color:var(--ink-heading); }
.minimal-scent-card .btn-cta-espresso:hover { color:var(--ink-on-dark); }
.faq-section { background:var(--bg-card); padding:76px 0; }
.faq-container { max-width:1000px; }
.faq-stack { gap:0; }
.faq-item { background:transparent; border:0; border-bottom:1px solid var(--border-warm); padding:0; }
.faq-trigger { font-size:17px; line-height:1.5; gap:24px; min-height:72px; }
.faq-content__inner { padding-right:40px; font-size:14px; }
.faq-item.is-open .faq-content { max-height:600px; }
.site-footer { padding:68px 0 44px; background:var(--bg-espresso); --ink-heading:var(--ink-on-dark); --ink-body:var(--ink-on-dark-muted); --ink-muted:var(--ink-on-dark-muted); --bg-field:var(--bg-umber); --border-warm-strong:color-mix(in oklab,var(--ink-on-dark) 22%,transparent); }
.footer-grid { grid-template-columns:1.6fr 1fr 1fr 1.4fr; gap:32px; padding-bottom:32px; }
.footer-grid>div:last-child { grid-column:1/-1; max-width:500px; }
.footer-heading { font-size:11px; color:var(--ink-heading); letter-spacing:0; margin-bottom:16px; }
.footer-links { font-size:13px; gap:10px; }
.footer-newsletter { max-width:440px; }
.footer-newsletter input { min-height:50px; }
.footer-newsletter button { padding-inline:22px; letter-spacing:0; }
.luxury-drawer { max-width:500px; background:var(--bg-canvas); border:0; }
.drawer-header { padding:28px 32px; background:var(--bg-nav); }
.drawer-title { font-size:32px; }
.drawer-close { background:transparent; border:0; min-height:44px; font-size:11px; letter-spacing:0; }
.drawer-body { padding:32px; }
.waitlist-option { background:var(--bg-card); border-radius:2px; padding:22px; }
.waitlist-option-title { font-family:var(--font-gothic); font-size:19px; letter-spacing:0; }
.waitlist-option-meta { letter-spacing:0; font-size:10px; }
.waitlist-option:has(input:checked) { background:var(--bg-stone); box-shadow:none; border-color:var(--accent-sage); }
.waitlist-option:has(input:checked)::after { background:var(--accent-sage); border-color:var(--accent-sage); }
.waitlist-email-label { font-size:12px; }
.cb-banner { border-radius:4px; background:var(--bg-canvas); }
.cb-btn { border-radius:2px; letter-spacing:0; }
.cb-banner__title { font-family:var(--font-gothic); }
.product-page .hero-section { padding:28px 0 76px; }
.product-breadcrumb { display:flex; gap:14px; margin-bottom:30px; color:var(--ink-muted); font-size:11px; }
.product-page .hero-layout { grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:64px; }
.product-gallery { top:112px; gap:8px; }
.product-gallery__photos { gap:8px; }
.product-page .hero-copy { padding:8px 0 0; }
.product-page h1.product-title { font-size:48px; letter-spacing:0; margin-top:18px; }
.product-page .hero-price-line { display:flex; gap:20px; align-items:baseline; padding:0; margin:18px 0; }
.product-page .hero-price { font-size:25px; letter-spacing:0; }
.product-page .hero-description { margin-top:22px; font-size:14px; line-height:1.85; }
.showcase-status-badge { padding:0; background:transparent; border:0; letter-spacing:0; color:var(--accent-sage); font-size:11px; }
.note-profile { margin-top:30px; }
.note-profile__heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.note-profile__heading>span:last-child { color:var(--ink-muted); font-size:10px; }
.note-profile [role="tablist"] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin:6px 0 20px; }
.note-profile [role="tab"] { min-height:44px; background:var(--bg-stone); font-weight:500; font-size:12px; border-radius:4px; border:1px solid transparent; cursor:pointer; transition:background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .12s ease; }
.note-profile [role="tab"]:hover { background:color-mix(in srgb, var(--accent-amber) 18%, var(--bg-stone)); border-color:color-mix(in srgb, var(--accent-amber) 45%, transparent); color:var(--ink-heading); }
.note-profile [role="tab"]:active { transform:none; box-shadow:inset 0 0 0 2px var(--accent-amber); }
body.page-blanc .note-profile [role="tab"]:active { box-shadow:inset 0 0 0 2px var(--accent-marine); }
.note-profile [role="tab"][aria-selected="true"] { background:var(--accent-amber); color:var(--bg-espresso); border-color:transparent; font-weight:600; box-shadow:none; }
body.page-blanc .note-profile [role="tab"]:hover { background:color-mix(in srgb, var(--accent-marine) 18%, var(--bg-stone)); border-color:color-mix(in srgb, var(--accent-marine) 45%, transparent); }
body.page-blanc .note-profile [role="tab"][aria-selected="true"] { background:var(--accent-marine); color:var(--ink-on-dark); box-shadow:none; }
.note-profile [role="tabpanel"] { min-height:96px; }
.note-profile [role="tabpanel"][hidden] { display:none; }
.note-phase { font-size:10px; color:var(--accent-sage); text-transform:uppercase; }
.note-profile h2 { font-family:var(--font-gothic); font-size:19px; font-weight:400; line-height:1.5; margin:6px 0; }
.note-profile p { color:var(--ink-muted); font-size:13px; line-height:1.7; }
.product-page .showcase-notes-box { margin-top:16px; font-size:12px; gap:12px; }
.product-page .showcase-notes-box>div { grid-template-columns:56px minmax(0,1fr); gap:14px; }
.product-page .hero-countdown-strip { padding:18px; margin-top:28px; background:var(--bg-stone); }
.product-page .hero-countdown-strip__digits { font-family:var(--font-gothic); font-size:24px; letter-spacing:0; }
.product-page .hero-countdown-strip__unit,.product-page .hero-countdown-strip__label { letter-spacing:0; }
.product-page .hero-cta-stack { margin-top:24px; }
.product-page .direct-waitlist-box { gap:12px; }
.direct-waitlist-input { font-size:16px; height:54px; border-radius:2px; }
.product-reassurance { margin-top:18px; font-size:10px; text-transform:none; }
.product-ingredients { margin-top:20px; padding:0; }
.counterpart-section { background:var(--bg-stone); padding:56px 0; }
.counterpart-section h2 { font-size:42px; font-weight:400; }
.counterpart-section p { color:var(--ink-muted); font-size:14px; margin:14px 0 20px; }
.subpage-hero { padding:68px 0 96px; }
.subpage-hero .heading-lg { font-size:52px; }
.subpage-content { max-width:900px; padding-block:64px; }
.subpage-content h2 { font-size:32px; margin-top:38px; }
.subpage-content p,.subpage-content li { font-size:15px; line-height:1.85; }
.legal-translation-notice { background:var(--bg-stone); border:1px solid var(--border-warm-strong); border-radius:4px; padding:20px 24px; margin-bottom:36px; color:var(--ink-body); overflow-wrap:anywhere; }
.legal-translation-notice p { font-size:13px; line-height:1.75; margin:0 0 12px; }
.legal-translation-notice a { font-size:13px; color:var(--ink-heading); text-decoration:underline; text-underline-offset:3px; }
.house-cover { position:relative; height:570px; background:var(--bg-espresso); overflow:hidden; }
.house-cover img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.house-cover::after { content:''; position:absolute; inset:0; background:var(--hero-vignette-mobile); }
.house-cover>div { position:absolute; bottom:60px; left:64px; z-index:1; color:var(--ink-on-dark); }
.house-cover .eyebrow { color:var(--ink-on-dark-muted); }
.house-cover h1 { font-size:96px; font-weight:400; line-height:1; }
.house-cover p { margin-top:18px; }
.contact-content { max-width:740px; }
#contactPageForm { background:transparent!important; padding:0!important; }
.contact-content input,.contact-content textarea { border-radius:2px; }
.fragrance-showcase-card { border:0; background:transparent; box-shadow:none; padding:0; gap:24px; }
.fragrance-showcase-card:hover { box-shadow:none; }
.collection-section { padding:76px 0; }
@media(min-width:1500px) { .fullscreen-hero__content { padding-block:76px; } }
@media(max-width:900px) {
  .header-nav { display:none; }
  .header-actions__story { display:none; }
}
@media(max-width:1150px) {
  .site-header { padding-inline:28px; }
  .fullscreen-hero__content { padding:48px; }
  .fullscreen-hero__title { font-size:68px; }
  .fullscreen-hero__cd-grid { gap:12px; }
  .product-page .hero-layout { gap:36px; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); }
  .footer-grid { grid-template-columns:1.5fr 1fr 1fr; }
  .footer-grid>div:first-child { grid-column:1/-1; }
}
@media(max-width:900px) {
  .minimal-discover-grid { grid-template-columns:1fr 1fr; gap:20px; }
  .minimal-discover-section { padding:56px 28px; }
  .collection-intro h2 { font-size:40px; }
  .minimal-scent-card__row { flex-wrap:wrap; }
  .fullscreen-hero { height:auto; min-height:650px; max-height:none; }
  .fullscreen-hero__content { flex-direction:column; align-items:flex-start; gap:32px; padding:48px 32px; }
  .fullscreen-hero__countdown { order:0; align-self:flex-end; }
  .fullscreen-hero__left { max-width:100%; }
  .product-page .hero-price-line { flex-wrap:wrap; gap:8px 18px; }
  .product-page h1.product-title { font-size:38px; }
}
@media(max-width:760px) {
  .product-page .hero-layout { grid-template-columns:minmax(0,1fr); gap:32px; }
  .product-gallery { position:static; }
}
@media(max-width:600px) {
  .site-header { height:72px; padding-inline:18px; gap:12px; }
  .brand-logo { font-size:32px; }
  .header-actions { gap:12px; }
  .mobile-menu-btn span { display:none; }
  .header-left-group { gap:0; }
  .bag-trigger-btn { font-size:12.5px; }
  .announcement-bar { font-size:9px; padding:8px 14px; }
  .announcement-bar button,.announcement-bar a { display:none; }
  .fullscreen-hero { min-height:calc(100svh - 132px); }
  .fullscreen-hero__content { padding:36px 24px; gap:28px; }
  body:has(.cb-banner.is-visible) .fullscreen-hero__content { padding-bottom:36px; }
  .fullscreen-hero__title { font-size:48px; }
  .fullscreen-hero__eyebrow { font-size:10px; margin-bottom:14px; }
  .fullscreen-hero__sub { font-size:14px; margin-top:16px; }
  .fullscreen-hero__actions { gap:20px; margin-top:24px; }
  .btn-hero-pill { padding-inline:20px; }
  .fullscreen-hero__cd-label { font-size:10px; margin-bottom:12px; }
  .fullscreen-hero__cd-num { font-size:30px; }
  .fullscreen-hero__cd-grid { gap:24px; }
  .fullscreen-hero__cd-cell { min-width:30px; }
  .minimal-discover-section { padding:44px 20px 52px; }
  .collection-intro { display:block; margin-bottom:28px; }
  .collection-intro h2 { font-size:34px; }
  .collection-intro p { margin-top:16px; font-size:12px; }
  .minimal-discover-grid { grid-template-columns:1fr; gap:40px; }
  .minimal-scent-card__row { flex-wrap:nowrap; }
  .minimal-scent-card__title { font-size:28px; }
  .minimal-scent-card__badge { top:14px; left:14px; }
  .faq-section { padding:48px 0; }
  .heading-lg,.subpage-hero .heading-lg { font-size:36px; }
  .heading-xl { font-size:44px; }
  .faq-trigger { font-size:15px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px 20px; }
  .footer-grid>div:first-child { grid-column:1/-1; }
  .site-footer { padding:48px 0 40px; }
  .footer-grid>div:nth-child(4) { grid-column:1/-1; }
  .product-page .hero-section { padding:22px 0 44px; }
  .product-breadcrumb { margin-bottom:22px; }
  .product-page h1.product-title { font-size:38px; }
  .product-page .hero-copy { padding:0; }
  .product-page .hero-description { font-size:14px; }
  .counterpart-section { padding:44px 0; }
  .counterpart-section h2 { font-size:34px; }
  .subpage-hero { padding:44px 0 64px; }
  .subpage-content { padding-block:40px; }
  .house-cover { height:440px; }
  .house-cover>div { left:24px; bottom:40px; }
  .house-cover h1 { font-size:64px; }
  .house-cover p { font-size:14px; }
  .drawer-header { padding:20px 24px; }
  .drawer-body { padding:28px 24px; }
  .drawer-title { font-size:28px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
@media(max-width:600px) {
  body:has(.cb-banner.is-visible) .fullscreen-hero__content { padding-bottom:max(220px,calc(var(--consent-banner-height,220px) + 28px)); }
}

/* Story photo pair — two editorial frames under the Our Story hero */
.story-cover {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px;
}
.story-cover img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 4px;
  border: none;
  background: var(--bg-stone);
}
@media (max-width: 680px) {
  .story-cover { padding: 0 16px; }
}

/* Studio campaign layout shared by the public gallery pages. */
.minimal-scent-card__identity { display:flex; align-items:baseline; gap:12px; min-width:0; }
.minimal-scent-card__volume { font-size:12px; color:var(--ink-muted); white-space:nowrap; }
.minimal-scent-card__price { font-size:14px; white-space:nowrap; }
.minimal-scent-card__media img { transition:opacity .5s ease; transform:none!important; }
.minimal-scent-card__media img:first-child,.studio-bottle { filter:brightness(1.03) contrast(1.03); mix-blend-mode:multiply; }
.product-gallery__photos { background:var(--bg-canvas); }
.fragrance-duo-photo img { display:block; }
.fragrance-duo-photo--making { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.fragrance-duo-photo--making img { width:100%; height:520px; object-fit:cover; }
@media(max-width:760px) { .fragrance-duo-photo--making img { height:250px; } }

.minimal-scent-card,.faq-item { opacity:1!important; transform:none!important; }
.fullscreen-hero__countdown { align-self:flex-end; }
.fullscreen-hero__cd-grid { display:flex!important; gap:8px; font-size:18px; }
.product-page .product-gallery { top:calc(var(--site-header-height,88px) + 16px); }
.product-page h1.product-title { font-family:var(--font-didot); font-weight:400; }
.footer-newsletter button { background:var(--bg-stone); color:var(--bg-espresso); }
@media(max-width:600px) {
 .minimal-scent-card__identity { gap:8px; }
 .minimal-scent-card__row { flex-wrap:nowrap; }
 .fullscreen-hero__content { flex-direction:column; align-items:flex-start; }
 .fullscreen-hero__countdown { order:0; align-self:flex-end; }
 .fullscreen-hero__cd-grid { font-size:16px; }
}

/* Polish: no wireframe lines, soft 4px corners */
.minimal-scent-card__media { border:none!important; box-shadow:none; border-radius:4px; overflow:hidden; }
.minimal-scent-card__media img,.product-gallery__photos img,.product-gallery__film,.fragrance-duo-photo img,.story-cover img { border-radius:4px; overflow:hidden; }
.minimal-scent-card .btn-cta-espresso { background:var(--bg-espresso); color:var(--ink-on-dark); border:none; transition:background .25s ease, opacity .25s ease; }
.minimal-scent-card .btn-cta-espresso:hover { opacity:.88; }
.site-header { border-bottom:none; box-shadow:0 1px 0 color-mix(in oklab, var(--ink-heading) 3%, transparent); }
.faq-item { border:none; margin-bottom:8px; background:var(--bg-canvas); padding:0 24px; border-radius:4px; }
.direct-waitlist-input,.footer-newsletter input { border:1px solid transparent; background-color:var(--bg-canvas); }
.direct-waitlist-input:focus,.footer-newsletter input:focus { outline:none; border-color:var(--ink-heading); }
.btn-cta-espresso,.btn-hero-pill,.btn-cta-stone,.minimal-scent-card__badge,.note-profile [role="tab"],.hero-countdown-strip,.direct-waitlist-input,input[type="email"] { border-radius:4px; }
.product-gallery__photos { gap:12px; }
.product-gallery__photos img { aspect-ratio:1/1; object-fit:cover; }
.product-gallery__photos img.lune-portrait { object-position:35% center; }

/* Smooth header pin when menu/waitlist opens */
@keyframes header-pin { from { transform: translateY(var(--header-from, 0px)); } to { transform: translateY(0); } }
body.top-menu-open .site-header.is-pinning { animation: header-pin .45s cubic-bezier(.22,1,.36,1); }

/* Tactile click feedback */
button, .btn, [role="button"], a.button, .site-header a, .product-card, [data-open-drawer], [data-add-bag] {
  transition: transform .18s cubic-bezier(.22,1,.36,1), background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease, opacity .25s ease;
}
button:active, .btn:active, [role="button"]:active, a.button:active, [data-open-drawer]:active, [data-add-bag]:active, .site-header a:active { transform: scale(.96); }
.product-card:active { transform: scale(.985); }
@media (prefers-reduced-motion: reduce) {
  body.top-menu-open .site-header.is-pinning { animation: none; }
  button:active, .btn:active, [role="button"]:active, a.button:active, [data-open-drawer]:active, [data-add-bag]:active, .site-header a:active, .product-card:active { transform: none; }
}

/* Mobile hero polish */
@media (max-width: 680px) {
  .fullscreen-hero { min-height: 560px; max-height: none; }
  .fullscreen-hero__slide img, .fullscreen-hero__slide video { object-position: 50% 18%; }
  .fullscreen-hero::after { background: linear-gradient(180deg, transparent 0%, transparent 35%, color-mix(in srgb, oklch(0.18 0 0) 55%, transparent) 62%, color-mix(in srgb, oklch(0.18 0 0) 82%, transparent) 100%); }
  .fullscreen-hero__content { flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 22px; padding: 0 22px 32px; }
  .fullscreen-hero__left { max-width: 100%; }
  .fullscreen-hero__title { font-size: clamp(40px, 12vw, 52px); line-height: 1; }
  .fullscreen-hero__sub { font-size: 14px; margin-top: 10px; }
  .fullscreen-hero__actions { margin-top: 18px; }
  .fullscreen-hero__countdown { width: 100%; padding: 16px 0 0; border-top: 1px solid color-mix(in srgb, var(--ink-on-dark) 22%, transparent); text-align: left; }
  .fullscreen-hero__cd-grid { gap: 8px; }
}
.subpage-content h1, .subpage-content h2, .subpage-content h3 { overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 1024px), (pointer: coarse) { html { scrollbar-gutter: auto; } }
.luxury-drawer:not(.is-open) { box-shadow: none; visibility: hidden; transition: transform 0.45s var(--ease-luxury), visibility 0s linear 0.45s; }
.luxury-drawer.is-open { visibility: visible; transition: transform 0.45s var(--ease-luxury); }