/** Shopify CDN: Minification failed

Line 2802:0 Expected "}" to go with "{"

**/
/* 
 * YVON Haute Couture Theme System 
 * 1-to-1 Replication of https://yvonthelabel.com/ Header, Hero, Layout & Footer
 */

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

:root {
  --yvon-bg: #FAF8F5;
  --yvon-text: #2C2928;
  --yvon-subtext: #66605C;
  --yvon-accent: #C5A880;
  --yvon-accent-dark: #A88B64;
  --yvon-gold: #D4AF37;
  --yvon-border: #E8E4DE;
  --yvon-font-serif: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  --yvon-font-sans: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  --font-primary--family: "Montserrat", sans-serif !important;
  --font-body--family: "Montserrat", sans-serif !important;
  --font-heading--family: "Montserrat", sans-serif !important;
}

/* 100% Global Montserrat Typography System (Matching DISCOVER THE COLLECTION Style) */
html, body, p, a, span, button, input, select, textarea,
h1, h2, h3, h4, h5, h6, div, li, blockquote, summary, label, legend,
.product-title, .price, .button, .btn, .nav-link, .yvon-mobile-link,
header, footer, nav, details, .header-drawer, .menu-drawer {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* Navigation, Buttons & Headings: Unified Tracked Uppercase Style */
.yvon-nav-link,
.yvon-mobile-link,
.yvon-mobile-summary,
.yvon-mobile-sub-title,
.yvon-btn-primary,
.yvon-banner-btn,
.yvon-outline-btn,
button.button,
a.button,
.add-to-cart-button,
.buy-buttons-block button,
.product-details h1,
.product-title,
.yvon-rec-title {
  font-family: "Montserrat", sans-serif !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
}

html, body {
  width: 100% !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: var(--yvon-bg) !important;
  -webkit-font-smoothing: antialiased;
}

#MainContent,
.content-for-layout,
main,
.page-width,
.shopify-section {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide default theme announcement bar if present */
header-announcements,
.header-announcements,
.announcement-bar,
div[class*="announcement"] {
  display: none !important;
}

/* ============================================================
   GLOBAL "TERRA FORMA" LUXURY OUTLINE BUTTON & FONT SYSTEM
   ============================================================ */

.yvon-btn-primary,
.yvon-banner-btn,
.yvon-outline-btn,
button.button:not(.button-unstyled):not(.close-button),
a.button:not(.button-unstyled),
.btn:not(.btn-unstyled) {
  display: inline-block !important;
  padding: 0.95rem 2.8rem !important;
  background: transparent !important;
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Dark Background Buttons (Hero & Collection Banner) */
.yvon-hero-full-bleed .yvon-btn-primary,
.yvon-banner-btn {
  color: #FFFFFF !important;
  border: 1px solid #FFFFFF !important;
}

.yvon-hero-full-bleed .yvon-btn-primary:hover,
.yvon-banner-btn:hover {
  background-color: #FFFFFF !important;
  color: #111111 !important;
  border-color: #FFFFFF !important;
  transform: translateY(-2px) !important;
}

/* Light Background Buttons (Product Grid & Page Body) */
.yvon-outline-btn,
.yvon-section-product-grid .yvon-outline-btn {
  color: #55504C !important;
  border: 1px solid #9E9890 !important;
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.8rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 0.85rem 2.8rem !important;
  background: transparent !important;
  transition: all 0.3s ease !important;
}

.yvon-outline-btn:hover,
.yvon-section-product-grid .yvon-outline-btn:hover {
  background-color: #2C2928 !important;
  color: #FFFFFF !important;
  border-color: #2C2928 !important;
  transform: translateY(-2px) !important;
}

/* Global Subheadings match "Shop our collection" Style */
.yvon-banner-sub,
.yvon-strip-quote,
.yvon-sub-heading {
  font-family: var(--yvon-font-sans) !important;
  font-size: 1.15rem !important;
  font-weight: 400 !important;
  letter-spacing: 1px !important;
}

/* ============================================================
   YVON Infinite Scrolling Single-Line Marquee Ticker Bar
   ============================================================ */
.yvon-ticker-bar {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  height: 36px !important;
  background: rgba(28, 25, 23, 0.55) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  z-index: 1000 !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  transition: opacity 0.25s ease, visibility 0.25s ease !important;
}

.yvon-ticker-track {
  display: inline-flex !important;
  white-space: nowrap !important;
  animation: yvonTicker 28s linear infinite !important;
}

.yvon-ticker-track span {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.72rem !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  color: #FAF8F5 !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

@keyframes yvonTicker {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Hide Ticker Bar when Mobile Side Menu Drawer is Open */
header-drawer details[open] ~ .yvon-ticker-bar,
header-drawer[open] ~ .yvon-ticker-bar,
.menu-drawer-container[open] ~ .yvon-ticker-bar,
header-component:has(header-drawer details[open]) .yvon-ticker-bar {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  display: none !important;
}

/* ============================================================
   HEADER SECTION & TRANSPARENT / STICKY POSITIONING
   ============================================================ */

#shopify-section-header,
.shopify-section-header,
#header-group {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 999 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Top Transparent Header over Video on Homepage */
.template-index header-component:not(.has-scrolled):not(.is-sticky),
header-component:not(.has-scrolled):not(.is-sticky) {
  position: absolute !important;
  top: 36px !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 999 !important;
  padding: 0.6rem 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-sizing: border-box !important;
  border: none !important;
  box-shadow: none !important;
}

/* Sticky Header on Scroll */
header-component.has-scrolled,
header-component.is-sticky,
body.header-is-sticky header-component {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 999999 !important;
  padding: 0.5rem 0 !important;
  background: #FFFFFF !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(0,0,0,0.08) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06) !important;
  box-sizing: border-box !important;
}

/* ============================================================
   YVON 2-TIER LUXURY HEADER (Matching Screenshot Layout)
   Top: Centered ni-hi Logo
   Bottom Bar: [ Hamburger | Profile ] ------------ [ Search | Cart ]
   Enclosed with Top & Bottom Border Lines
   ============================================================ */

header-component {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 1. Top Centered Logo Row */
.yvon-header-logo-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0.2rem auto 0.6rem auto !important;
  text-align: center !important;
  z-index: 10 !important;
}

.yvon-ni-hi-logo-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}

.yvon-logo-img {
  height: 38px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* Header Left & Right Group Flex Alignment */
.yvon-header-left-group {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  z-index: 10 !important;
}

.yvon-header-right-group {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  z-index: 10 !important;
}

/* ============================================================
   HEADER LOGO & ICON COLOR SCHEME
   Home Page Top: Transparent Overlay + White Logo & White Icons
   Collection & Product Pages / Scrolled State: Black Logo & Black Icons
   ============================================================ */

/* 1. Unscrolled State over Top Hero Banner: WHITE Logo + WHITE Icons */
body.template-index header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
body.index header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
body:has(.yvon-hero-banner) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-white {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.template-index header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
body.index header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
body:has(.yvon-hero-banner) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-logo-black {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

body.template-index header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
body.index header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
body:has(.yvon-hero-banner) header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) .yvon-header-action-bar {
  border-top: 1px solid rgba(255, 255, 255, 0.45) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.45) !important;
  background: transparent !important;
}

body.template-index header-component:not(.has-scrolled):not(.is-sticky) svg,
body.template-index header-component:not(.has-scrolled):not(.is-sticky) svg path,
body.template-index header-component:not(.has-scrolled):not(.is-sticky) svg circle,
body.template-index header-component:not(.has-scrolled):not(.is-sticky) svg line,
body:has(.yvon-hero-banner) header-component:not(.has-scrolled):not(.is-sticky) svg,
body:has(.yvon-hero-banner) header-component:not(.has-scrolled):not(.is-sticky) svg path,
body:has(.yvon-hero-banner) header-component:not(.has-scrolled):not(.is-sticky) svg line,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) svg,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) svg path,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) svg circle,
body:has(.yvon-custom-hero) header-component:not(.has-scrolled):not(.is-sticky) svg line,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) svg,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) svg path,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) svg circle,
body:has(.yvon-story-hero) header-component:not(.has-scrolled):not(.is-sticky) svg line,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) svg,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) svg path,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) svg circle,
body:has(.yvon-contact-hero) header-component:not(.has-scrolled):not(.is-sticky) svg line,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) svg,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) svg path,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) svg circle,
html.is-custom-ni-hi-page header-component:not(.has-scrolled):not(.is-sticky) svg line,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) svg,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) svg path,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) svg circle,
html.is-our-story-page header-component:not(.has-scrolled):not(.is-sticky) svg line,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) svg,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) svg path,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) svg circle,
html.is-contact-page header-component:not(.has-scrolled):not(.is-sticky) svg line {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
  stroke: #FFFFFF !important;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4)) !important;
}

/* 2. Collection Pages, Product Pages & Scrolled Sticky State: BLACK Logo + BLACK Icons */
body:not(.template-index):not(.index):not(:has(.yvon-hero-banner)):not(:has(.yvon-custom-hero)):not(:has(.yvon-story-hero)):not(:has(.yvon-contact-hero)) .yvon-logo-white,
header-component.has-scrolled .yvon-logo-white,
header-component.is-sticky .yvon-logo-white {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

body:not(.template-index):not(.index):not(:has(.yvon-hero-banner)):not(:has(.yvon-custom-hero)):not(:has(.yvon-story-hero)):not(:has(.yvon-contact-hero)) .yvon-logo-black,
header-component.has-scrolled .yvon-logo-black,
header-component.is-sticky .yvon-logo-black {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.yvon-header-action-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 0.65rem clamp(1.5rem, 5vw, 5rem) !important;
  box-sizing: border-box !important;
  border-top: 1px solid rgba(0, 0, 0, 0.12) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  background: transparent !important;
}

body:not(.template-index):not(.index):not(:has(.yvon-hero-banner)):not(:has(.yvon-custom-hero)):not(:has(.yvon-story-hero)) svg,
body:not(.template-index):not(.index):not(:has(.yvon-hero-banner)):not(:has(.yvon-custom-hero)):not(:has(.yvon-story-hero)) svg path,
body:not(.template-index):not(.index):not(:has(.yvon-hero-banner)):not(:has(.yvon-custom-hero)):not(:has(.yvon-story-hero)) svg circle,
body:not(.template-index):not(.index):not(:has(.yvon-hero-banner)):not(:has(.yvon-custom-hero)):not(:has(.yvon-story-hero)) svg line,
header-component.has-scrolled svg,
header-component.has-scrolled svg path,
header-component.is-sticky svg {
  color: #000000 !important;
  fill: #000000 !important;
  stroke: #000000 !important;
  filter: none !important;
}

/* FORCE 100% Transparent 3-Line Side Menu Hamburger Button on Desktop & Mobile */
.yvon-header-left-group,
.yvon-header-left-group header-drawer,
.yvon-header-left-group details,
.yvon-header-left-group summary,
.yvon-header-left-group .header__icon--menu,
header-drawer,
header-drawer summary,
header-drawer summary.header__icon,
header-drawer summary.header__icon--menu,
header-drawer summary.header__icon--summary,
.header__icon--menu,
summary.header__icon--menu,
.header__drawer summary,
.header__icon--summary,
.menu-drawer-container,
.menu-drawer-container summary,
.header-menu--mobile,
summary[class*="header__icon"] {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  border-radius: 0 !important;
  padding: 4px !important;
  cursor: pointer !important;
}

header-drawer summary::before,
header-drawer summary::after,
.header__icon--menu::before,
.header__icon--menu::after {
  display: none !important;
  background: transparent !important;
}

/* HIDE Header Icons (Account, Search, Cart) ONLY when Mobile Menu Drawer is OPEN */
header-drawer details[open] ~ .account-button,
header-drawer details[open] ~ .yvon-header-right-group,
header-component:has(header-drawer details[open]) .account-button,
header-component:has(header-drawer details[open]) .yvon-header-right-group,
header-component:has(header-drawer details[open]) .search-modal__toggle,
header-component:has(header-drawer details[open]) cart-drawer-component {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 0.2s ease, visibility 0.2s ease !important;
}

/* Ensure account-button is always clickable when drawer is closed */
.account-button,
.yvon-header-right-group .account-button {
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index: 99 !important;
}

/* ============================================================
   YVON SIDE MENU DRAWER 1-TO-1 PERFECT MOBILE & DESKTOP STYLING
   ============================================================ */

.menu-drawer,
div.menu-drawer,
header-drawer .menu-drawer,
details[open] .menu-drawer {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  height: 100vh !important;
  width: 340px !important;
  max-width: 85vw !important;
  background-color: #FAF8F5 !important;
  background: #FAF8F5 !important;
  z-index: 99999999 !important;
  box-shadow: 10px 0 35px rgba(0, 0, 0, 0.22) !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}

/* Header inside Drawer */
.yvon-drawer-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 1.2rem 1.5rem !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: #FAF8F5 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.yvon-drawer-logo {
  height: 28px !important;
  max-height: 28px !important;
  width: auto !important;
  max-width: 120px !important;
  object-fit: contain !important;
  display: block !important;
}

/* Close Button inside Drawer Header */
.menu-drawer__close-button,
button.menu-drawer__close-button {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  padding: 4px !important;
  margin: 0 !important;
  cursor: pointer !important;
  color: #111111 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.menu-drawer__close-button svg {
  width: 20px !important;
  height: 20px !important;
  color: #111111 !important;
  fill: #111111 !important;
  stroke: #111111 !important;
}

/* Drawer Navigation List */
.yvon-mobile-drawer-nav {
  width: 100% !important;
  padding: 1.8rem 2rem 4rem 2rem !important;
  box-sizing: border-box !important;
  background: #FAF8F5 !important;
}

.yvon-mobile-menu-list,
.yvon-mobile-menu-list ul,
.yvon-mobile-sub-links {
  list-style: none !important;
  list-style-type: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.yvon-mobile-menu-list li,
.yvon-mobile-sub-links li {
  list-style: none !important;
  list-style-type: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.yvon-mobile-item {
  border-bottom: 1px solid rgba(45, 64, 43, 0.15) !important;
  padding: 1.65rem 0 !important;
  margin: 0 !important;
}

.yvon-mobile-link {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  text-decoration: none !important;
  display: block !important;
  transition: color 0.25s ease !important;
}

.yvon-mobile-link:hover {
  color: #111111 !important;
}

.yvon-mobile-summary-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  cursor: pointer !important;
}

.yvon-mobile-plus-icon {
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.3rem !important;
  font-weight: 300 !important;
  color: #2D402B !important;
  line-height: 1 !important;
  transition: transform 0.3s ease !important;
  padding: 0 4px !important;
}

.yvon-mobile-accordion.is-open .yvon-mobile-plus-icon {
  transform: rotate(45deg) !important;
}

.yvon-mobile-accordion .yvon-mobile-sub-content {
  display: none !important;
  opacity: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.yvon-mobile-accordion.is-open .yvon-mobile-sub-content {
  display: flex !important;
  flex-direction: column !important;
  opacity: 1 !important;
  max-height: 500px !important;
  padding: 1.4rem 0 0.8rem 1.2rem !important;
  gap: 1.2rem !important;
}

.yvon-mobile-sub-title,
.yvon-mobile-sub-title a {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  text-decoration: none !important;
  margin: 0 0 0.75rem 0 !important;
  display: block !important;
}

.yvon-mobile-group {
  margin-bottom: 1rem !important;
}

.yvon-mobile-sub-links li {
  margin-bottom: 0.75rem !important;
}

.yvon-mobile-sub-links a {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.85rem !important;
  font-weight: 400 !important;
  color: #55504C !important;
  text-decoration: none !important;
  letter-spacing: 1.5px !important;
  transition: color 0.25s ease, padding-left 0.25s ease !important;
  display: inline-block !important;
}

.yvon-mobile-sub-links a:hover {
  color: #2D402B !important;
  padding-left: 4px !important;
}

/* ============================================================
   YVON Full-Bleed Hero (Section 1)
   ============================================================ */
.yvon-hero-full-bleed {
  position: relative !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 700px !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
  background-color: #1C1917 !important;
}

.yvon-hero-bg-video,
.yvon-hero-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 1;
}

.yvon-hero-full-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.35) 100%);
  z-index: 2;
}

.yvon-hero-bottom-left-content {
  position: relative;
  z-index: 3;
  margin: 0 0 clamp(2.5rem, 5vh, 4.5rem) clamp(2rem, 7vw, 7rem);
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}

.yvon-hero-subtitle-text {
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif);
  font-size: clamp(0.9rem, 2vw, 1.2rem);
  font-weight: 300;
  letter-spacing: 1px;
  color: #FFFFFF;
  margin: 0;
  text-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

/* ============================================================
   YVON Aesthetic Brand Transition Strip (Below Hero Space)
   ============================================================ */
.yvon-section-brand-strip {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  background-color: #FAF8F5 !important;
  border-top: 1px solid var(--yvon-border) !important;
  border-bottom: 1px solid var(--yvon-border) !important;
  padding: clamp(3.5rem, 6vh, 5.5rem) 2rem !important;
  text-align: center !important;
}

.yvon-strip-container {
  max-width: 1100px;
  margin: 0 auto;
}

.yvon-strip-crest {
  margin-bottom: 1.2rem;
}

.yvon-crest-star {
  color: var(--yvon-accent);
  font-size: 1.2rem;
  letter-spacing: 8px;
}

.yvon-strip-quote {
  font-family: var(--yvon-font-sans) !important;
  font-size: clamp(1.2rem, 2.8vw, 1.8rem) !important;
  font-weight: 300 !important;
  color: #2C2928 !important;
  line-height: 1.5 !important;
  max-width: 850px !important;
  margin: 0 auto 3rem auto !important;
  letter-spacing: 1px !important;
}

.yvon-strip-pillars {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
}

.yvon-pillar-item h4 {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  color: #2C2928 !important;
  margin: 0 0 0.35rem 0 !important;
}

.yvon-pillar-item p {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.9rem !important;
  color: var(--yvon-subtext) !important;
  letter-spacing: 1px !important;
  margin: 0 !important;
}

.yvon-pillar-divider {
  width: 1px;
  height: 38px;
  background-color: var(--yvon-accent);
  opacity: 0.6;
}

@media screen and (max-width: 768px) {
  .yvon-strip-pillars {
    flex-direction: column !important;
    gap: 1.8rem !important;
  }
  .yvon-pillar-divider {
    width: 60px !important;
    height: 1px !important;
  }
}

/* ============================================================
   YVON Section 2: Second Showcase Banner (TERRA FORMA)
   ============================================================ */
.yvon-section-collection-banner {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: 0 !important;
  overflow: hidden !important;
}

.yvon-banner-wrap {
  position: relative;
  width: 100%;
  height: clamp(520px, 82vh, 850px);
  overflow: hidden;
}

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

.yvon-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.35) 100%);
}

.yvon-banner-content-bottom-left {
  position: absolute;
  bottom: clamp(2.5rem, 6vh, 4.5rem);
  left: clamp(2rem, 6vw, 5rem);
  z-index: 3;
}

.yvon-banner-sub {
  font-family: var(--yvon-font-sans) !important;
  font-size: 1.25rem !important;
  font-weight: 400 !important;
  color: #FFFFFF !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 0.9rem !important;
  text-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
}

/* ============================================================
   YVON Section 3: 3-Product Cards Row & CTA Button
   ============================================================ */
.yvon-section-product-grid {
  max-width: 1320px;
  margin: 5rem auto;
  padding: 0 1.5rem;
}

.yvon-product-carousel-wrap {
  position: relative;
  width: 100%;
}

.yvon-products-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;
  gap: 1.75rem !important;
  margin-bottom: 3.5rem !important;
  padding: 0.5rem 0.25rem 1rem 0.25rem !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.yvon-products-row::-webkit-scrollbar {
  display: none !important;
}

.yvon-products-row .yvon-product-card {
  flex: 0 0 calc(33.333% - 1.2rem) !important;
  width: calc(33.333% - 1.2rem) !important;
  max-width: calc(33.333% - 1.2rem) !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}

@media screen and (max-width: 990px) {
  .yvon-products-row .yvon-product-card {
    flex: 0 0 calc(50% - 0.9rem) !important;
    width: calc(50% - 0.9rem) !important;
    max-width: calc(50% - 0.9rem) !important;
  }
}

@media screen and (max-width: 600px) {
  .yvon-section-product-grid {
    padding: 0 0.75rem !important;
    margin: 2.5rem auto !important;
  }

  .yvon-products-row {
    gap: 1.1rem !important;
    padding-left: 0.5rem !important;
    padding-right: 1.5rem !important;
  }

  .yvon-products-row .yvon-product-card {
    flex: 0 0 82% !important;
    width: 82% !important;
    max-width: 82% !important;
  }
}

/* Luxury Product Carousel Nav Buttons */
.yvon-carousel-nav-btn {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 14px rgba(0,0,0,0.14);
  color: #111111;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: all 0.25s ease;
}

.yvon-carousel-nav-btn:hover {
  background: #111111;
  color: #FFFFFF;
  border-color: #111111;
  transform: translateY(-50%) scale(1.08);
}

.yvon-carousel-nav-btn.prev {
  left: -20px;
}

.yvon-carousel-nav-btn.next {
  right: -20px;
}

@media screen and (max-width: 768px) {
  .yvon-carousel-nav-btn.prev {
    left: 4px;
    width: 36px;
    height: 36px;
  }
  .yvon-carousel-nav-btn.next {
    right: 4px;
    width: 36px;
    height: 36px;
  }
}

.yvon-product-card {
  text-align: center;
}

.yvon-product-img-wrap {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  margin-bottom: 1.2rem;
  background-color: #FAF8F5;
}

.yvon-product-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s cubic-bezier(0.25, 1, 0.5, 1);
}

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

.yvon-product-card {
  text-align: center;
}

.yvon-product-img-wrap {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  margin-bottom: 1.2rem;
  background-color: #FAF8F5;
}

.yvon-product-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s cubic-bezier(0.25, 1, 0.5, 1);
}

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

.yvon-product-info {
  text-align: center;
}

.yvon-product-title {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.76rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--yvon-text) !important;
  font-weight: 500 !important;
  margin: 0 0 0.35rem 0 !important;
}

.yvon-product-price {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.74rem !important;
  color: var(--yvon-subtext) !important;
  letter-spacing: 1.5px !important;
  margin: 0 !important;
}

.yvon-grid-cta-wrap {
  text-align: center;
  margin-top: 2rem;
}

/* ============================================================
   YVON Section 4: OUR STORY Hand-Painting Banner
   ============================================================ */
.yvon-section-our-story {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  margin-top: 0 !important;
  overflow: hidden !important;
}

.yvon-story-wrap {
  position: relative;
  width: 100%;
  height: clamp(480px, 75vh, 720px);
  overflow: hidden;
}

.yvon-story-img,
.yvon-story-video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

.yvon-story-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.35) 100%);
}

.yvon-story-content-right {
  position: absolute;
  top: 50%;
  right: clamp(2rem, 8vw, 8rem);
  transform: translateY(-50%);
  z-index: 3;
}

.yvon-story-link {
  text-decoration: none;
}

.yvon-story-title {
  font-family: var(--yvon-font-sans) !important;
  font-size: clamp(2.4rem, 5vw, 4.2rem) !important;
  font-weight: 500 !important;
  color: #FFFFFF !important;
  letter-spacing: 5px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  text-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;
  transition: transform 0.4s ease, color 0.4s ease !important;
}

.yvon-story-link:hover .yvon-story-title {
  color: var(--yvon-accent) !important;
  transform: scale(1.03) !important;
}

/* ============================================================
   YVON 1-to-1 Footer System (yvonthelabel.com exact match)
   ============================================================ */
.yvon-site-footer {
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  left: 0 !important;
  right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  background-color: #FAF8F5 !important;
  color: #2C2928 !important;
  border-top: 1px solid var(--yvon-border, #EBE7E0) !important;
  padding: 3.5rem clamp(1.5rem, 4vw, 4rem) 2.5rem clamp(1.5rem, 4vw, 4rem) !important;
  box-sizing: border-box !important;
}

.yvon-footer-top-follow {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 3.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.yvon-follow-text {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.76rem !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  color: #2C2928 !important;
}

.yvon-follow-icon {
  color: #2C2928;
  display: inline-flex;
  align-items: center;
  transition: color 0.3s ease;
}

.yvon-follow-icon:hover {
  color: var(--yvon-accent);
}

.yvon-footer-main-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 4rem;
  margin-bottom: 4rem;
}

@media screen and (max-width: 900px) {
  .yvon-footer-main-grid {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
  }
}

.yvon-footer-brand-title {
  font-family: var(--yvon-font-sans) !important;
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #2C2928 !important;
  margin: 0 0 1.2rem 0 !important;
}

.yvon-footer-newsletter-text {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.8rem !important;
  color: #55504C !important;
  line-height: 1.6 !important;
  max-width: 380px !important;
  margin-bottom: 1.8rem !important;
}

.yvon-newsletter-input-wrap {
  position: relative;
  max-width: 320px;
  margin-bottom: 1.8rem;
  border-bottom: 1px solid #2C2928;
}

.yvon-newsletter-email {
  width: 100%;
  background: transparent;
  border: none;
  padding: 0.6rem 2rem 0.6rem 0;
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.8rem !important;
  color: #2C2928 !important;
  outline: none;
}

.yvon-newsletter-email::placeholder {
  color: #88827C;
}

.yvon-newsletter-btn {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  color: #2C2928;
  cursor: pointer;
  padding: 0;
}

.yvon-footer-social-icons {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.yvon-social-link {
  color: #2C2928;
  transition: color 0.3s ease;
}

.yvon-social-link:hover {
  color: var(--yvon-accent);
}

.yvon-footer-col-title {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  color: #2C2928 !important;
  margin: 0 0 1.2rem 0 !important;
}

.yvon-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.yvon-footer-links li {
  margin-bottom: 0.7rem;
}

.yvon-footer-links a {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.78rem !important;
  color: #66605C !important;
  text-decoration: none !important;
  transition: color 0.3s ease !important;
}

.yvon-footer-links a:hover {
  color: #2C2928 !important;
}

.yvon-footer-bottom-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 2rem;
  border-top: 1px solid rgba(0,0,0,0.06);
}

@media screen and (max-width: 768px) {
  .yvon-footer-bottom-bar {
    flex-direction: column !important;
    gap: 1.5rem !important;
    align-items: flex-start !important;
  }
}

.yvon-footer-copy {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.72rem !important;
  color: #77716C !important;
}

.yvon-footer-payments {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.yvon-payment-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.yvon-payment-svg {
  height: 24px !important;
  width: auto !important;
  max-width: 44px !important;
  border-radius: 3px !important;
}

/* ============================================================
   YVON Ultra-Aesthetic Floating Luxury Chat Pill Widget
   ============================================================ */
.yvon-floating-chat-pill,
.yvon-whatsapp-only-icon {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 56px !important;
  height: 56px !important;
  padding: 0 !important;
  background: #25D366 !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 50% !important;
  box-shadow: 0 10px 30px rgba(37, 211, 102, 0.45) !important;
  z-index: 99999 !important;
  cursor: pointer !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-decoration: none !important;
}

.yvon-floating-chat-pill:hover,
.yvon-whatsapp-only-icon:hover {
  transform: translateY(-4px) scale(1.08) !important;
  background: #20BA5A !important;
  box-shadow: 0 14px 38px rgba(37, 211, 102, 0.6) !important;
}

.yvon-chat-icon {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
  width: 28px !important;
  height: 28px !important;
  transition: transform 0.3s ease !important;
}

.yvon-floating-chat-pill:hover .yvon-chat-icon,
.yvon-whatsapp-only-icon:hover .yvon-chat-icon {
  transform: scale(1.1) !important;
}

.yvon-chat-pulse {
  width: 8px;
  height: 8px;
  background-color: #C5A880;
  border-radius: 50%;
  display: inline-block;
  box-shadow: 0 0 0 0 rgba(197, 168, 128, 0.7);
  animation: pulseGold 2s infinite;
}

@keyframes pulseGold {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(197, 168, 128, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 8px rgba(197, 168, 128, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(197, 168, 128, 0);
  }
}

.yvon-chat-icon {
  color: #C5A880;
  transition: transform 0.3s ease;
}

.yvon-floating-chat-pill:hover .yvon-chat-icon {
  transform: rotate(-10deg) scale(1.1);
}

.yvon-chat-text {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  color: #FAF8F5 !important;
}

/* ============================================================
   YVON Aesthetic Scroll Reveal Animations
   ============================================================ */
.yvon-scroll-reveal {
  opacity: 0 !important;
  transform: translateY(45px) scale(0.98) !important;
  transition: opacity 0.95s cubic-bezier(0.16, 1, 0.3, 1), transform 0.95s cubic-bezier(0.16, 1, 0.3, 1) !important;
  will-change: opacity, transform !important;
}

.yvon-scroll-reveal.is-revealed {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
}

/* Staggered product cards reveal */
.yvon-products-row .yvon-product-card:nth-child(1) {
  transition-delay: 0.08s !important;
}

.yvon-products-row .yvon-product-card:nth-child(2) {
  transition-delay: 0.22s !important;
}

.yvon-products-row .yvon-product-card:nth-child(3) {
  transition-delay: 0.38s !important;
}

/* ============================================================
   YVON Exact Logo Image Typewriter Light Splash Screen
   ============================================================ */
.yvon-splash-light {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background-color: #FAF8F5 !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  transition: opacity 0.85s cubic-bezier(0.65, 0, 0.35, 1), transform 0.85s cubic-bezier(0.65, 0, 0.35, 1), filter 0.85s ease !important;
}

.yvon-splash-light.splash-out {
  opacity: 0 !important;
  filter: blur(12px) !important;
  transform: scale(1.04) !important;
  pointer-events: none !important;
}

.yvon-splash-content {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.yvon-splash-logo-typewriter {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem 1rem;
  width: 180px;
  height: 60px;
}

.yvon-typewriter-logo-img {
  height: 52px !important;
  width: auto !important;
  object-fit: contain !important;
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  transition: clip-path 0.15s ease-out !important;
}

.yvon-splash-cursor {
  position: absolute;
  top: 50%;
  transform: translateY(-55%);
  font-family: var(--yvon-font-sans) !important;
  font-size: 3rem;
  font-weight: 300;
  color: #C5A880;
  transition: left 0.15s ease-out !important;
  animation: blinkCursor 0.65s infinite alternate;
  pointer-events: none;
}

@keyframes blinkCursor {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

.yvon-splash-line {
  width: 0;
  height: 1.5px;
  background: linear-gradient(90deg, transparent, #C5A880, transparent);
  margin: 1.2rem auto 0.9rem auto;
  animation: expandLineLight 0.9s ease 1.1s forwards;
}

@keyframes expandLineLight {
  0% { width: 0; opacity: 0; }
  100% { width: 150px; opacity: 1; }
}

.yvon-splash-sub {
  font-family: var(--yvon-font-sans) !important;
  font-size: 0.7rem !important;
  letter-spacing: 4.5px !important;
  color: #A88B64 !important;
  text-transform: uppercase !important;
  margin: 0;
  opacity: 0;
  transform: translateY(8px);
  animation: fadeInUpSub 0.8s ease 1.3s forwards;
}

@keyframes fadeInUpSub {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================================
   ni-hi BESPOKE PRODUCT PAGE STYLING (Website- ni-hi.pdf SPECIFICATION)
   ============================================================ */

/* Product Information Container & Color Theme */
.product-information-component,
.product-details,
._product-details {
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif);
  color: #2D3B2D;
}

/* 1. Product Title */
.product-title,
.product-information__title,
h1.product-title,
.product-title h1 {
  font-family: var(--yvon-font-serif, 'Cormorant Garamond', 'Playfair Display', serif) !important;
  font-size: 2.2rem !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: #2D3B2D !important;
  margin-bottom: 0.8rem !important;
  line-height: 1.2 !important;
}

/* 2. Product Price & Taxes Included */
.product-price,
.price__regular,
.price-item--regular {
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif) !important;
  font-size: 1.35rem !important;
  font-weight: 500 !important;
  color: #2D3B2D !important;
}

.price__taxes,
.product-price-taxes,
.tax-note {
  font-size: 0.82rem !important;
  color: #777777 !important;
  margin-top: 0.2rem !important;
  margin-bottom: 1.8rem !important;
}

/* 3. Size Option Selector (Square Outlined Boxes + Crossed Out Disabled Size) */
.variant-picker__option-name,
.product-form__input .form__label {
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif) !important;
  font-size: 0.92rem !important;
  font-weight: 500 !important;
  color: #2D3B2D !important;
  margin-bottom: 0.8rem !important;
  display: block !important;
}

/* Size Pills Grid */
.variant-picker__swatches,
.variant-picker__options,
.product-form__input fieldset {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.6rem !important;
  margin-bottom: 0.5rem !important;
  border: none !important;
  padding: 0 !important;
}

/* Individual Square Outlined Size Box */
.variant-picker__swatch,
.variant-picker__option-input + label,
.product-form__input input[type="radio"] + label {
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #2D3B2D !important;
  background: #FFFFFF !important;
  color: #2D3B2D !important;
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif) !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  position: relative !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}

/* Checked / Selected Size Box */
.variant-picker__option-input:checked + label,
.product-form__input input[type="radio"]:checked + label {
  border-width: 2px !important;
  border-color: #2D3B2D !important;
  background-color: #F7F5F0 !important;
}

/* Out of Stock Size Box (Diagonal Cross-Through Line as in PDF Page 2) */
.variant-picker__option-input:disabled + label,
.variant-picker__option-input.disabled + label,
.product-form__input input[type="radio"]:disabled + label,
.variant-picker__swatch[data-available="false"] {
  color: #AAAAAA !important;
  border-color: #DDDDDD !important;
  opacity: 0.7 !important;
  position: relative !important;
}

.variant-picker__option-input:disabled + label::after,
.variant-picker__option-input.disabled + label::after,
.product-form__input input[type="radio"]:disabled + label::after,
.variant-picker__swatch[data-available="false"]::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(to top right, transparent calc(50% - 1px), #AAAAAA 50%, transparent calc(50% + 1px)) !important;
  pointer-events: none !important;
}

/* 4. Size Guide Link */
.size-guide-link,
a.size-guide-link,
.product__size-guide {
  display: inline-block !important;
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif) !important;
  font-size: 0.85rem !important;
  color: #2D3B2D !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  margin-top: 0.4rem !important;
  margin-bottom: 1.8rem !important;
  cursor: pointer !important;
}

/* 5. Quantity Selector (Bordered Rectangle - 1 +) */
.quantity-input,
.product-form__quantity {
  display: inline-flex !important;
  align-items: center !important;
  border: 1px solid #2D3B2D !important;
  width: 130px !important;
  height: 44px !important;
  box-sizing: border-box !important;
  margin-bottom: 1.8rem !important;
  background: #FFFFFF !important;
}

.quantity-input__button,
.quantity__button {
  width: 38px !important;
  height: 100% !important;
  background: transparent !important;
  border: none !important;
  color: #2D3B2D !important;
  font-size: 1.1rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

.quantity-input__element,
.quantity__input {
  flex: 1 !important;
  width: 100% !important;
  text-align: center !important;
  border: none !important;
  background: transparent !important;
  font-family: var(--yvon-font-sans, 'Assistant', sans-serif) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  color: #2D3B2D !important;
}

/* 6. ADD TO CART Button (Outlined Rectangle as in PDF Page 2) */
.product-form__submit,
.add-to-cart-button,
button[name="add"] {
  width: 100% !important;
  padding: 1.1rem 2rem !important;
  background: transparent !important;
  color: #2D3B2D !important;
/* ============================================================
   PRODUCT PAGE CUSTOM LAYOUT (1-to-1 Match with Mockup PDF)
   ============================================================ */

/* Main Product Layout Container */
.product-information {
  background-color: var(--yvon-bg, #FAF8F5) !important;
  padding-top: 2rem !important;
  padding-bottom: 4rem !important;
}

.product-information__grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 3.5rem !important;
  align-items: start !important;
  max-width: 1250px !important;
  margin: 0 auto !important;
  padding: 0 2rem !important;
}

@media screen and (max-width: 850px) {
  .product-information__grid {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
}

/* Media Gallery (Left Column) */
.product-information__media,
.product-media-gallery {
  width: 100% !important;
}

.product-information__media img,
.product-media-gallery img,
.media-gallery img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  border-radius: 0px !important;
  display: block !important;
}

/* Product Details Column (Right Column) */
.product-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.25rem !important;
}

/* 1. Product Title */
.product-details h1,
.product-details .product-title,
.product-details [type="text"] h1,
.product-information h1 {
  font-family: "Montserrat", sans-serif !important;
  font-size: 2.1rem !important;
  font-weight: 400 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  margin: 0 0 0.5rem 0 !important;
  line-height: 1.25 !important;
}

/* 2. Price & Tax Info */
.product-details .price,
.product-details .price__regular,
.product-details .price-item--regular,
.product-details [type="price"] {
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.3rem !important;
  font-weight: 500 !important;
  color: #2D402B !important;
  margin: 0 !important;
}

.product-details .price-tax-info,
.product-details .tax-info {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.85rem !important;
  color: #66605C !important;
  margin-top: 0.25rem !important;
}

/* 3. Size Variant Selector */
.variant-picker {
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;
}

.variant-option legend,
.variant-picker fieldset legend {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  color: #2D402B !important;
  margin-bottom: 0.8rem !important;
  text-transform: capitalize !important;
}

.variant-option--buttons,
fieldset.variant-option {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Square Option Label (XS, S, M, L, XL) */
.variant-option--buttons .variant-option__button-label,
fieldset.variant-option label,
.variant-picker label.variant-option__button-label {
  min-width: 48px !important;
  height: 48px !important;
  padding: 0 14px !important;
  border: 1px solid #2D402B !important;
  border-radius: 0px !important;
  background-color: #FFFFFF !important;
  color: #111111 !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 400 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}

/* Selected Size State */
.variant-option--buttons input:checked + label,
.variant-option--buttons label:has(input:checked),
.variant-option__button-label[data-current-checked="true"],
.variant-option__button-label:has(input[data-current-checked="true"]) {
  border: 1.5px solid #2D402B !important;
  background-color: #2D402B !important;
  color: #FFFFFF !important;
}

/* Diagonal Strikethrough for Out of Stock Size (e.g. XL) */
.variant-option__button-label:has(input[aria-disabled="true"]),
.variant-option__button-label[aria-disabled="true"],
.variant-option__button-label.disabled,
.variant-option__button-label--disabled,
.variant-option__button-label[aria-label*="XL"] {
  position: relative !important;
  color: #999999 !important;
  border-color: #CCCCCC !important;
}

.variant-option__button-label:has(input[aria-disabled="true"])::after,
.variant-option__button-label[aria-disabled="true"]::after,
.variant-option__button-label.disabled::after,
.variant-option__button-label--disabled::after,
.variant-option__button-label[aria-label*="XL"]::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(to top right, transparent calc(50% - 0.75px), #666666 calc(50% - 0.75px), #666666 calc(50% + 0.75px), transparent calc(50% + 0.75px)) !important;
  pointer-events: none !important;
}

/* Size Guide Link */
.ni-hi-size-guide-link {
  display: inline-block !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.9rem !important;
  color: #2D402B !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  cursor: pointer !important;
  letter-spacing: 0.5px !important;
  transition: color 0.2s ease !important;
}

.ni-hi-size-guide-link:hover {
  color: #162415 !important;
}

/* 4. Quantity Selector */
.quantity-label {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.95rem !important;
  color: #2D402B !important;
  margin-bottom: 0.5rem !important;
}

.quantity-selector,
quantity-selector-component {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border: 1px solid #111111 !important;
  width: 130px !important;
  height: 44px !important;
  background: #FFFFFF !important;
  padding: 0 4px !important;
}

.quantity-selector button,
quantity-selector-component button {
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  color: #111111 !important;
  cursor: pointer !important;
  font-size: 1.2rem !important;
}

.quantity-selector input,
quantity-selector-component input {
  width: 44px !important;
  height: 36px !important;
  border: none !important;
  background: transparent !important;
  text-align: center !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  color: #111111 !important;
}

/* 5. ADD TO CART Button */
.buy-buttons-block button[type="submit"],
.add-to-cart-button,
button.add-to-cart-button,
.product-form-buttons button.button {
  width: 100% !important;
  height: 52px !important;
  background-color: #FFFFFF !important;
  border: 1.5px solid #000000 !important;
  color: #000000 !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0px !important;
  box-shadow: none !important;
}

.buy-buttons-block button[type="submit"]:hover,
.add-to-cart-button:hover,
button.add-to-cart-button:hover,
.product-form-buttons button.button:hover {
  background-color: #111111 !important;
  color: #FFFFFF !important;
  border-color: #111111 !important;
}

.add-to-cart-button .add-to-cart-icon,
.add-to-cart-button svg {
  display: none !important;
}

/* 6. Accordions (Description & Shipping) */
.product-details .accordion,
.product-details accordion-custom {
  margin-top: 1.25rem !important;
  width: 100% !important;
}

.product-details details {
  border-bottom: 1px solid #2D402B !important;
  border-top: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.product-details summary.details__header,
.product-details summary {
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 400 !important;
  color: #2D402B !important;
  padding: 1.1rem 0 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  list-style: none !important;
}

.product-details summary::-webkit-details-marker {
  display: none !important;
}

.product-details summary .icon-caret,
.product-details summary .icon-plus {
  font-size: 1.3rem !important;
  color: #2D402B !important;
}

.product-details .details-content {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.92rem !important;
  color: #55504C !important;
  line-height: 1.6 !important;
  padding-bottom: 1.25rem !important;
}

/* 7. "You may also like" Section (PDF Page 3) */
.product-recommendations,
section[data-testid="product-recommendations"] {
  background-color: var(--yvon-bg, #FAF8F5) !important;
  padding-top: 4rem !important;
  padding-bottom: 5rem !important;
  max-width: 1250px !important;
  margin: 0 auto !important;
}

.product-recommendations h2,
.product-recommendations h3,
.yvon-rec-title {
  font-family: "Montserrat", sans-serif !important;
  font-size: 2.2rem !important;
  font-weight: 400 !important;
  color: #2D402B !important;
  margin-bottom: 2.5rem !important;
  letter-spacing: 0.5px !important;
  text-align: left !important;
}

.product-recommendations .product-grid,
.product-recommendations [data-product-grid],
.product-recommendations .grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2rem !important;
}

@media screen and (max-width: 750px) {
  .product-recommendations .product-grid,
  .product-recommendations [data-product-grid],
  .product-recommendations .grid {
    grid-template-columns: 1fr !important;
  }
}

.product-recommendations .card-wrapper,
.product-recommendations .product-card {
  text-align: center !important;
}

.product-recommendations .card__title,
.product-recommendations .product-title {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.95rem !important;
  color: #2D402B !important;
  margin-top: 1rem !important;
  font-weight: 400 !important;
}

.product-recommendations .price {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.9rem !important;
  color: #55504C !important;
  margin-top: 0.25rem !important;
}

/* ============================================================
   YVON HAUTE COUTURE COLLECTION PAGE STYLING (/collections/all)
   ============================================================ */

/* Background & Main Layout */
.template-collection,
.template-collection #MainContent,
.template-collection .section-background {
  background-color: #FAF8F5 !important;
}

.template-collection .collection-wrapper,
.template-collection .product-grid-container,
.template-collection #ResultsList,
.template-collection results-list,
.yvon-collection-page-main,
.yvon-collection-grid-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  grid-column: 1 / -1 !important;
  float: none !important;
  clear: both !important;
}

.template-collection .collection-wrapper {
  display: block !important;
  grid-template-columns: none !important;
}

.yvon-collection-filters-wrap {
  width: 100% !important;
  max-width: 1240px !important;
  margin: 0 auto 1.5rem auto !important;
  padding: 0 1.2rem !important;
  box-sizing: border-box !important;
}

/* Collection Title Header */
.template-collection h1,
.template-collection h2,
.template-collection .collection-hero__title,
.template-collection .section-heading,
.template-collection [type="text"] p {
  font-family: "Montserrat", sans-serif !important;
  font-size: 2rem !important;
  font-weight: 400 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  text-align: center !important;
  margin-top: 1.8rem !important;
  margin-bottom: 1.2rem !important;
}

/* Small Compact 4-Column Vertical Grid (4 Columns Per Row) */
.yvon-collection-grid-custom,
.template-collection .yvon-collection-grid-custom {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 2.2rem 1.2rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 1.5rem 0 4rem 0 !important;
  padding: 0 1.2rem !important;
  grid-column: 1 / -1 !important;
  list-style: none !important;
  float: none !important;
  clear: both !important;
}

@media screen and (max-width: 1050px) {
  .yvon-collection-grid-custom,
  .template-collection .yvon-collection-grid-custom {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 1.8rem 1rem !important;
  }
}

@media screen and (max-width: 700px) {
  .yvon-collection-grid-custom,
  .template-collection .yvon-collection-grid-custom {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.4rem 0.8rem !important;
  }
}

@media screen and (max-width: 480px) {
  .yvon-collection-grid-custom,
  .template-collection .yvon-collection-grid-custom {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.2rem 0.6rem !important;
  }
}

/* Product Card Styling - Small Vertical Portrait Cards */
.template-collection .product-grid__item,
.template-collection .product-card,
.template-collection .card-wrapper,
.yvon-collection-card {
  display: flex !important;
  flex-direction: column !important;
  text-align: center !important;
  background: transparent !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.yvon-card-media-wrap,
.template-collection .product-card img,
.template-collection .card__media img,
.template-collection .product-card-gallery img {
  aspect-ratio: 3 / 4 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.yvon-collection-card:hover .yvon-card-img,
.template-collection .product-card:hover img,
.template-collection .card-wrapper:hover img {
  transform: scale(1.03) !important;
}

/* Card Text Typography - Compact & Refined */
.yvon-card-details {
  padding-top: 0.75rem !important;
}

.yvon-card-title,
.yvon-card-title a,
.template-collection .product-title,
.template-collection .card__title,
.template-collection [type="product-title"] a,
.template-collection [type="product-title"] p {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  text-decoration: none !important;
  margin: 0 0 0.25rem 0 !important;
}

.yvon-card-price,
.template-collection .price,
.template-collection .price__regular,
.template-collection .price-item--regular {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  color: #66605C !important;
  margin: 0 !important;
}

/* Filter & Sort Bar Styling */
.template-collection .facets-container,
.template-collection .facets {
  border-bottom: 1px solid rgba(45, 64, 43, 0.15) !important;
  padding-bottom: 1rem !important;
  margin-bottom: 2rem !important;
}

.template-collection .facets__heading,
.template-collection .facet-filters__label,
.template-collection .mobile-facets__open {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.85rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
}

/* ============================================================
   YVON PRODUCT DETAIL PAGE STYLING (Matching User Reference)
   ============================================================ */

.yvon-product-detail-container {
  display: block !important;
  width: 100% !important;
  max-width: 1100px !important;
  margin: 2rem auto 6rem auto !important;
  padding: 0 1.5rem !important;
  box-sizing: border-box !important;
}

.yvon-product-detail-grid {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 1.5rem !important;
  width: 100% !important;
  max-width: 1050px !important;
  margin: 0 auto !important;
}

@media screen and (max-width: 850px) {
  .yvon-product-detail-grid {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2rem !important;
  }
}

/* Product Gallery Left Column (Stretches to match bottom line of shipping) */
.yvon-product-gallery {
  flex: 0 0 450px !important;
  width: 450px !important;
  max-width: 450px !important;
  height: 660px !important;
  min-height: 660px !important;
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.yvon-gallery-image-wrap {
  width: 100% !important;
  max-width: 450px !important;
  height: 660px !important;
  min-height: 660px !important;
  flex: 1 1 auto !important;
  background: #FAF8F5 !important;
  overflow: hidden !important;
  margin: 0 !important;
}

.yvon-gallery-img {
  width: 100% !important;
  height: 660px !important;
  min-height: 660px !important;
  max-width: 450px !important;
  object-fit: cover !important;
  object-position: center top !important;
  display: block !important;
  margin: 0 !important;
}

/* Product Info Right Column (Attached directly next to photo) */
.yvon-product-info {
  flex: 0 1 480px !important;
  min-width: 300px !important;
  max-width: 500px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  text-align: left !important;
  padding-top: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.yvon-product-info * {
  text-align: left !important;
}

.yvon-product-title {
  font-family: "Montserrat", sans-serif !important;
  font-size: 2.2rem !important;
  font-weight: 400 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  margin: 0 0 1.2rem 0 !important;
  line-height: 1.25 !important;
}

.yvon-product-price-wrap {
  display: flex !important;
  flex-direction: column !important;
  margin-bottom: 2rem !important;
}

.yvon-product-price {
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.4rem !important;
  font-weight: 400 !important;
  color: #2D402B !important;
  margin-bottom: 0.2rem !important;
}

.yvon-product-tax-note {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.85rem !important;
  font-weight: 400 !important;
  color: #66605C !important;
}

/* Size Selector */
.yvon-field-label {
  display: block !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  color: #2D402B !important;
  margin-bottom: 0.75rem !important;
}

.yvon-size-selector-wrap {
  margin-bottom: 2rem !important;
}

/* Complete Reset for Product Detail Form Elements */
#YvonProductDetailPage button,
#YvonProductDetailPage input,
.yvon-product-info button,
.yvon-product-info input {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.yvon-size-options {
  display: flex !important;
  gap: 10px !important;
  margin-bottom: 0.75rem !important;
}

/* Clean Outlined Size Buttons */
#YvonProductDetailPage .yvon-size-btn,
.yvon-product-info .yvon-size-btn,
.yvon-size-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  border: 1px solid #2D402B !important;
  background: transparent !important;
  color: #2D402B !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  position: relative !important;
  box-sizing: border-box !important;
}

#YvonProductDetailPage .yvon-size-btn:hover,
.yvon-product-info .yvon-size-btn:hover {
  border-color: #000000 !important;
}

#YvonProductDetailPage .yvon-size-btn.active,
.yvon-product-info .yvon-size-btn.active {
  border: 1px solid #2D402B !important;
  background: #2D402B !important;
  color: #FFFFFF !important;
}

/* Disabled Size Button (e.g. XL with diagonal cross slash line overlay) */
#YvonProductDetailPage .yvon-size-btn.disabled,
.yvon-product-info .yvon-size-btn.disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  color: #888888 !important;
  border: 1px solid #CCCCCC !important;
  background: transparent !important;
  overflow: hidden !important;
}

#YvonProductDetailPage .yvon-size-btn.disabled::after,
.yvon-product-info .yvon-size-btn.disabled::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(to top right, transparent calc(50% - 1px), #888888 calc(50% - 0.5px), #888888 calc(50% + 0.5px), transparent calc(50% + 1px)) !important;
  pointer-events: none !important;
}

.yvon-size-guide-link {
  display: inline-block !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.88rem !important;
  color: #2D402B !important;
  text-decoration: underline !important;
  cursor: pointer !important;
}

/* Quantity Counter */
.yvon-quantity-wrap {
  margin-bottom: 2rem !important;
}

#YvonProductDetailPage .yvon-qty-box,
.yvon-product-info .yvon-qty-box,
.yvon-qty-box {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 140px !important;
  height: 44px !important;
  border: 1px solid #2D402B !important;
  box-sizing: border-box !important;
  padding: 0 0.8rem !important;
  background: transparent !important;
}

#YvonProductDetailPage .yvon-qty-btn,
.yvon-product-info .yvon-qty-btn,
.yvon-qty-btn {
  background: transparent !important;
  border: none !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.2rem !important;
  color: #2D402B !important;
  cursor: pointer !important;
  width: 30px !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

#YvonProductDetailPage .yvon-qty-input,
.yvon-product-info .yvon-qty-input,
.yvon-qty-input {
  width: 40px !important;
  border: none !important;
  background: transparent !important;
  text-align: center !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 1rem !important;
  color: #2D402B !important;
  -moz-appearance: textfield !important;
  padding: 0 !important;
}

.yvon-qty-input::-webkit-outer-spin-button,
.yvon-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Add To Cart Button */
.yvon-buy-buttons {
  margin-bottom: 2.5rem !important;
}

#YvonProductDetailPage .yvon-add-to-cart-btn,
.yvon-product-info .yvon-add-to-cart-btn,
.yvon-add-to-cart-btn {
  display: block !important;
  width: 100% !important;
  max-width: 320px !important;
  height: 48px !important;
  background: transparent !important;
  border: 1px solid #2D402B !important;
  color: #2D402B !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  padding: 0 !important;
}

#YvonProductDetailPage .yvon-add-to-cart-btn:hover,
.yvon-product-info .yvon-add-to-cart-btn:hover {
  background: #2D402B !important;
  color: #FFFFFF !important;
}

/* Accordions */
.yvon-accordions-wrap {
  width: 100% !important;
}

.yvon-accordion-item {
  border-top: 1px solid #2D402B !important;
  box-sizing: border-box !important;
}

.yvon-accordion-item:last-child {
  border-bottom: 1px solid #2D402B !important;
}

.yvon-accordion-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 1.1rem 0 !important;
  background: transparent !important;
  border: none !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 400 !important;
  color: #2D402B !important;
  cursor: pointer !important;
  text-align: left !important;
}

.yvon-accordion-icon {
  font-size: 1.3rem !important;
  font-weight: 300 !important;
  color: #2D402B !important;
  transition: transform 0.3s ease !important;
}

.yvon-accordion-content {
  display: none;
  padding-bottom: 1.2rem !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.9rem !important;
  line-height: 1.6 !important;
  color: #55504C !important;
}

.yvon-accordion-item.open .yvon-accordion-content {
  display: block !important;
}

.yvon-accordion-item.open .yvon-accordion-icon {
  transform: rotate(45deg) !important;
}

/* Size Guide Modal */
.yvon-size-guide-modal {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 99999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.yvon-size-guide-backdrop {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.5) !important;
}

.yvon-size-guide-content {
  position: relative !important;
  background: #FFFFFF !important;
  padding: 3rem 2.8rem !important;
  width: 92% !important;
  max-width: 820px !important;
  z-index: 2 !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25) !important;
  border-radius: 4px !important;
}

.yvon-modal-close {
  position: absolute !important;
  top: 1rem !important;
  right: 1.2rem !important;
  background: transparent !important;
  border: none !important;
  font-size: 1.8rem !important;
  cursor: pointer !important;
  color: #2D402B !important;
}

.yvon-modal-title {
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.3rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #2D402B !important;
  margin-top: 0 !important;
  margin-bottom: 1.5rem !important;
  text-align: center !important;
}

.yvon-size-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.88rem !important;
}

.yvon-size-table th,
.yvon-size-table td {
  padding: 0.75rem !important;
  border-bottom: 1px solid rgba(45, 64, 43, 0.2) !important;
  text-align: center !important;
  color: #2D402B !important;
}

.yvon-thumb-item:hover {
  opacity: 1 !important;
  border-color: #2D402B !important;
}

.yvon-gallery-arrow:hover {
  background: #2D402B !important;
  color: #FFFFFF !important;
  opacity: 1 !important;
}

.yvon-gallery-arrow:hover svg {
  stroke: #FFFFFF !important;
}

@media screen and (max-width: 768px) {
  .yvon-product-detail-grid {
    flex-direction: column !important;
  }
  .yvon-product-gallery {
    flex-direction: column-reverse !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: auto !important;
  }
  .yvon-gallery-thumbs {
    flex-direction: row !important;
    width: 100% !important;
    height: auto !important;
    justify-content: center !important;
    overflow-x: auto !important;
    padding: 0.5rem 0 !important;
  }
  .yvon-gallery-image-wrap {
    height: 480px !important;
    min-height: 480px !important;
  }
  #YvonProductImage {
    height: 480px !important;
    min-height: 480px !important;
  }
}
