/* ==========================================================================
   WEARZY — BLUORNG Clone Override
   Exact replica of BLUORNG's design system: tokens, layout, components.
   Loaded AFTER styles.css. All values sourced from bluorng.com.
   ========================================================================== */

/* ── BLUORNG Design Tokens + Premium Editorial Scale ── */
:root {
  --wz-black: #121212;
  --wz-white: #FFFFFF;
  --wz-grey-100: #F3F3F3;
  --wz-grey-200: #EFEFEF;
  --wz-grey-300: #E0E0E0;
  --wz-grey-500: #8A8A8A;
  --wz-grey-700: #4A4A4A;
  --wz-grey-900: #1A1A1A;
  --wz-accent: #334FB4;
  --wz-sale: #D32F2F;
  --wz-font: 'Inter', 'Assistant', 'Helvetica Neue', Arial, sans-serif;
  --wz-font-display: 'Inter', 'Anton', 'Helvetica Neue', sans-serif;
  /* Spacing */
  --wz-spacing-section: clamp(60px, 8vw, 120px);
  --wz-spacing-section-mobile: clamp(40px, 6vw, 60px);
  --wz-grid-gap: 8px;
  --wz-grid-gap-mobile: 4px;
  --wz-page-width: 120rem;
  /* Radius */
  --wz-radius: 0px;
  --wz-radius-pill: 40px;
  --wz-radius-badge: 4rem;
  --wz-shadow: none;
  /* Typography scale */
  --wz-fs-display: clamp(36px, 5vw, 64px);
  --wz-fs-h1: clamp(24px, 3.5vw, 42px);
  --wz-fs-h2: clamp(18px, 2.5vw, 28px);
  --wz-fs-body: 15px;
  --wz-fs-caption: 11px;
  --wz-fs-label: 12px;
  /* Animation */
  --wz-transition: 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
  --wz-ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
  --wz-ease-out: cubic-bezier(0.33, 1, 0.68, 1);
}

/* ── Global Body ── */
body {
  font-family: var(--wz-font) !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  letter-spacing: 0.06rem !important;
  color: rgba(18, 18, 18, 0.75) !important;
  background: var(--wz-white) !important;
  margin: 0 !important;
}
@media screen and (min-width: 750px) {
  body { font-size: 16px !important; }
}
.container { max-width: var(--wz-page-width) !important; }

/* ══════════════════════════════════════════════════════════════════
   1. ANNOUNCEMENT BAR
   ══════════════════════════════════════════════════════════════════ */
.top-bar {
  background: var(--wz-black) !important;
  padding: 10px 0 !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  color: var(--wz-white) !important;
}
.top-bar-inner { justify-content: center !important; }
.top-bar-left, .top-bar-right { display: none !important; }
.top-bar-center { font-weight: 500 !important; letter-spacing: 0.14em !important; }
.text-accent { color: var(--wz-white) !important; font-weight: 700 !important; }

/* ══════════════════════════════════════════════════════════════════
   2. HEADER — BLUORNG: Nav LEFT | Logo CENTER | Icons RIGHT
   ══════════════════════════════════════════════════════════════════ */
.site-header {
  padding: 18px 0 !important;
  background: var(--wz-white) !important;
  border-bottom: none !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  transition: background 0.3s ease, box-shadow 0.3s ease !important;
}

/* 3-column grid: nav-left | logo | actions */
.header-inner {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  gap: 0 !important;
}

/* Left: nav links */
.header-nav-left {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
}
.header-nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
}
.header-nav-links a {
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: rgba(18,18,18,0.75) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}
.header-nav-links a:hover {
  color: rgba(18,18,18,1) !important;
}
.header-nav-links .nav-link-wrap {
  position: relative;
}
.header-nav-links .nav-dropdown {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  min-width: 200px !important;
  background: var(--wz-white) !important;
  border: 1px solid rgba(18,18,18,0.08) !important;
  box-shadow: 0 8px 32px rgba(18,18,18,0.08) !important;
  padding: 8px 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(4px) !important;
  transition: all 0.2s ease !important;
  z-index: 100 !important;
}
.header-nav-links .nav-link-wrap:hover .nav-dropdown {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}
.header-nav-links .nav-dropdown a {
  display: block !important;
  padding: 8px 20px !important;
  font-size: 12px !important;
  color: rgba(18,18,18,0.75) !important;
}
.header-nav-links .nav-dropdown a:hover {
  background: var(--wz-grey-100) !important;
  color: rgba(18,18,18,1) !important;
}

/* Center: Logo */
.logo {
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: rgba(18,18,18,1) !important;
  text-align: center !important;
  gap: 0 !important;
  text-decoration: none !important;
  justify-self: center !important;
}
.logo-icon { display: none !important; }

/* Right: Icons */
.header-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 18px !important;
}
.header-action-btn {
  font-size: 0 !important;
  color: rgba(18,18,18,1) !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 0 !important;
}
.icon-wrapper svg { width: 20px !important; height: 20px !important; stroke-width: 1.5 !important; }
.badge {
  background: var(--wz-black) !important;
  width: 16px !important; height: 16px !important;
  font-size: 9px !important;
  border-radius: 50% !important;
}

/* Search — hide inline */
.search-container { display: none !important; }

/* Desktop hamburger (rightmost icon, like BLUORNG) */
.header-hamburger {
  display: block !important;
}

/* Mobile hamburger in nav-left */
.mob-hamburger { display: none !important; }

/* Hide old separate main-nav */
.main-nav { display: none !important; }

/* Transparent header over hero */
body.home-page .site-header:not(.header-scrolled) {
  background: transparent !important;
  border-bottom-color: transparent !important;
}
body.home-page .site-header:not(.header-scrolled) .logo,
body.home-page .site-header:not(.header-scrolled) .header-action-btn,
body.home-page .site-header:not(.header-scrolled) .header-nav-links a,
body.home-page .site-header:not(.header-scrolled) .mob-hamburger {
  color: var(--wz-white) !important;
}
body.home-page .site-header:not(.header-scrolled) .icon-wrapper svg {
  stroke: var(--wz-white) !important;
}
body.home-page .site-header.header-scrolled {
  background: var(--wz-white) !important;
  box-shadow: 0 1px 8px rgba(0,0,0,0.04) !important;
}

/* Hide compare button globally */
#btnCMPOpen { display: none !important; }

/* ══════════════════════════════════════════════════════════════════
   3. HERO — Full viewport
   ══════════════════════════════════════════════════════════════════ */
.hero-slider { min-height: 100vh !important; margin: 0 !important; }
.hero-slide { min-height: 100vh !important; }
.hero-slide .hero-content h2 {
  font-family: var(--wz-font-display) !important;
  font-size: clamp(36px, 6vw, 72px) !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  line-height: 1.05 !important;
}
.hero-slide .hero-content p {
  font-size: 14px !important;
  letter-spacing: 0.06rem !important;
  opacity: 0.8 !important;
}
.hero-arrow { width: 44px !important; height: 44px !important; background: rgba(255,255,255,0.9) !important; border-radius: var(--wz-radius) !important; }
.slider-dot { width: 32px !important; height: 2px !important; border-radius: var(--wz-radius) !important; background: rgba(255,255,255,0.4) !important; }
.slider-dot.active { background: var(--wz-white) !important; }

/* ══════════════════════════════════════════════════════════════════
   4. SECTION HEADERS — BLUORNG: Title LEFT + "Discover more" RIGHT
   ══════════════════════════════════════════════════════════════════ */
.section-header-bluorng {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  text-align: left !important;
  margin-bottom: 24px !important;
}
.section-header-bluorng .section-title {
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: rgba(18,18,18,1) !important;
}

/* "Discover more" pill button */
.discover-more-btn {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  color: rgba(18,18,18,1) !important;
  border: 1px solid rgba(18,18,18,0.3) !important;
  border-radius: 40px !important;
  padding: 8px 20px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
}
.discover-more-btn:hover {
  background: rgba(18,18,18,1) !important;
  color: var(--wz-white) !important;
  border-color: rgba(18,18,18,1) !important;
}

/* Old centered section headers (for non-BLUORNG sections) */
.section-header:not(.section-header-bluorng) { text-align: center !important; margin-bottom: 24px !important; }
.section-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: rgba(18,18,18,1) !important;
}
.section-padding { padding: var(--wz-spacing-section) !important; }

.tab-btn {
  font-size: 12px !important; font-weight: 600 !important;
  letter-spacing: 0.1em !important; text-transform: uppercase !important;
  color: rgba(18,18,18,0.4) !important; border-radius: var(--wz-radius) !important;
  background: none !important; border-bottom: 2px solid transparent !important;
}
.tab-btn.active, .tab-btn:hover {
  color: rgba(18,18,18,1) !important;
  border-bottom-color: rgba(18,18,18,1) !important;
  background: none !important;
}

/* ══════════════════════════════════════════════════════════════════
   5. HIDE NON-FASHION ELEMENTS
   ══════════════════════════════════════════════════════════════════ */
.gtrust { display: none !important; }
.bulk-cta-section { display: none !important; }
.about-trust-row { display: none !important; }
.pdp-bulk-quote { display: none !important; }
.ts-trust-bar { display: none !important; }

/* ══════════════════════════════════════════════════════════════════
   6. PRODUCT CARDS — BLUORNG-exact (from screenshots)
   ══════════════════════════════════════════════════════════════════ */
.product-slider, .product-grid { gap: var(--wz-grid-gap) !important; }
.product-card {
  border: none !important; border-radius: var(--wz-radius) !important;
  box-shadow: var(--wz-shadow) !important; background: transparent !important;
  position: relative !important;
}
.product-card:hover { transform: none !important; box-shadow: var(--wz-shadow) !important; }
.product-card .card-img-wrap {
  border-radius: var(--wz-radius) !important; overflow: hidden !important;
  aspect-ratio: 3 / 4 !important; background: var(--wz-grey-100) !important;
  padding: 0 !important; position: relative !important;
}
.product-card .card-img-wrap img {
  width: 100% !important; height: 100% !important; object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) !important;
}
.product-card:hover .card-img-wrap img { transform: scale(1.05) !important; }
.product-card .card-body {
  padding: 10px 0 6px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
}
.product-card .card-title {
  font-size: 13px !important; font-weight: 400 !important;
  color: rgba(18,18,18,0.75) !important; -webkit-line-clamp: 1 !important;
  letter-spacing: 0.02em !important;
  flex: 1 !important;
}
.product-card .card-price {
  font-size: 13px !important; font-weight: 400 !important;
  color: rgba(18,18,18,0.75) !important;
}
.product-card .card-price-old { color: rgba(18,18,18,0.4) !important; text-decoration: line-through !important; }
.product-card .card-rating, .product-card .card-compare,
.product-card .quick-view-btn { display: none !important; }
/* Wishlist icon hidden on cards (BLUORNG uses bookmark, handled by Swym) */
.product-card .card-wishlist { display: none !important; }

.product-badge.sale {
  background: var(--wz-black) !important; border-radius: var(--wz-radius-badge) !important;
  font-size: 10px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important;
  color: var(--wz-white) !important;
}

/* Quick add "+" button — BLUORNG style: small icon, bottom-right, always visible */
.product-card .card-add-btn, .product-card .add-to-cart-sm {
  position: absolute !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 28px !important;
  height: 28px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  color: rgba(18,18,18,0.6) !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 20px !important;
  font-weight: 300 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  opacity: 1 !important;
  transform: none !important;
  transition: color 0.2s !important;
  cursor: pointer !important;
}
.product-card .card-add-btn:hover, .product-card .add-to-cart-sm:hover {
  color: rgba(18,18,18,1) !important;
}
.product-card:hover .card-add-btn, .product-card:hover .add-to-cart-sm {
  opacity: 1 !important; transform: none !important;
}

/* ══════════════════════════════════════════════════════════════════
   7. BANNER GRID
   ══════════════════════════════════════════════════════════════════ */
.banner-grid { gap: var(--wz-grid-gap) !important; }
.banner-card { border-radius: var(--wz-radius) !important; overflow: hidden !important; }
.banner-subtitle { font-size: 11px !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; }
.banner-title { font-size: 20px !important; font-weight: 700 !important; letter-spacing: 0.06rem !important; text-transform: uppercase !important; }

/* ══════════════════════════════════════════════════════════════════
   8. SLIDER ARROWS — BLUORNG: circular with border
   ══════════════════════════════════════════════════════════════════ */
.slider-arrow, .hero-arrow {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: var(--wz-white) !important;
  border: 1px solid rgba(18,18,18,0.15) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
}
.slider-arrow:hover, .hero-arrow:hover {
  border-color: rgba(18,18,18,0.4) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

/* ══════════════════════════════════════════════════════════════════
   9. BUTTONS
   ══════════════════════════════════════════════════════════════════ */
.btn-primary, button[type="submit"], .add-to-cart-btn {
  background: rgba(18,18,18,1) !important; color: var(--wz-white) !important;
  border: 1px solid rgba(18,18,18,1) !important; border-radius: var(--wz-radius) !important;
  font-size: 12px !important; font-weight: 700 !important;
  letter-spacing: 0.14em !important; text-transform: uppercase !important;
  padding: 16px 32px !important; box-shadow: var(--wz-shadow) !important;
}
.btn-primary:hover, button[type="submit"]:hover {
  background: var(--wz-white) !important; color: rgba(18,18,18,1) !important;
}
.btn-outline {
  background: transparent !important; color: var(--wz-white) !important;
  border: 1px solid var(--wz-white) !important; border-radius: var(--wz-radius) !important;
  font-size: 12px !important; font-weight: 700 !important;
  letter-spacing: 0.14em !important; text-transform: uppercase !important;
  padding: 14px 28px !important;
}
.btn-outline:hover { background: var(--wz-white) !important; color: rgba(18,18,18,1) !important; }
.about-section .btn-outline { border-color: rgba(18,18,18,1) !important; color: rgba(18,18,18,1) !important; }

/* Buy Now */
.btn-buy-now {
  width: 100% !important; padding: 16px !important;
  font-size: 13px !important; font-weight: 700 !important;
  letter-spacing: 0.14em !important; text-transform: uppercase !important;
  background: var(--wz-white) !important; color: rgba(18,18,18,1) !important;
  border: 1px solid rgba(18,18,18,1) !important; border-radius: var(--wz-radius) !important;
  cursor: pointer; transition: all 0.3s ease !important; margin-top: 8px !important;
}
.btn-buy-now:hover { background: rgba(18,18,18,1) !important; color: var(--wz-white) !important; }

/* ══════════════════════════════════════════════════════════════════
   10. ABOUT / CTA / TESTIMONIALS
   ══════════════════════════════════════════════════════════════════ */
.about-section { padding: 40px 0 !important; background: var(--wz-grey-100) !important; }
.about-subtitle { font-size: 11px !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; color: rgba(18,18,18,0.4) !important; }
.about-title { font-size: clamp(24px, 3vw, 36px) !important; font-weight: 700 !important; text-transform: uppercase !important; line-height: 1.2 !important; color: rgba(18,18,18,1) !important; }
.about-desc { font-size: 15px !important; line-height: 1.8 !important; color: rgba(18,18,18,0.75) !important; }
.cta-banner { min-height: 500px !important; }
.cta-subtitle { font-size: 11px !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; }
.cta-title { font-size: clamp(28px, 4vw, 48px) !important; font-weight: 800 !important; text-transform: uppercase !important; line-height: 1.1 !important; }
.ts-section { padding: 40px 0 !important; }
.ts-eyebrow { font-size: 11px !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; }
.ts-title { font-size: 14px !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; }
.ts-card { border-radius: var(--wz-radius) !important; box-shadow: var(--wz-shadow) !important; border: 1px solid rgba(18,18,18,0.05) !important; }

/* ══════════════════════════════════════════════════════════════════
   11. PDP — BLUORNG product page
   ══════════════════════════════════════════════════════════════════ */
.product-h1 { font-size: clamp(20px, 3vw, 28px) !important; font-weight: 400 !important; line-height: 1.3 !important; color: rgba(18,18,18,1) !important; letter-spacing: 0.06rem !important; }
.product-short-desc { color: rgba(18,18,18,0.75) !important; }
.product-price-large .price-current { font-size: 22px !important; font-weight: 700 !important; color: rgba(18,18,18,1) !important; }
.product-price-large .price-old { font-size: 16px !important; color: rgba(18,18,18,0.4) !important; }
.variant-size-pill, .variant-pill { border-radius: var(--wz-radius-pill) !important; border: 1px solid rgba(18,18,18,0.55) !important; }
.variant-size-pill.active, .variant-pill.active { border-color: rgba(18,18,18,1) !important; background: rgba(18,18,18,1) !important; color: var(--wz-white) !important; }
.add-to-cart-btn-large {
  width: 100% !important; padding: 16px !important;
  font-size: 13px !important; letter-spacing: 0.14em !important; text-transform: uppercase !important;
  background: rgba(18,18,18,1) !important; color: var(--wz-white) !important;
  border: 1px solid rgba(18,18,18,1) !important; border-radius: var(--wz-radius) !important;
}
.add-to-cart-btn-large:hover { background: var(--wz-white) !important; color: rgba(18,18,18,1) !important; }
.qty-selector, .qty-btn { border-radius: var(--wz-radius) !important; }
.pdp-gallery { position: sticky !important; top: 100px !important; align-self: start !important; }
.pdp-gallery img, .pdp-main-img { border-radius: var(--wz-radius) !important; }
.pdp-thumb { border-radius: var(--wz-radius) !important; border: 1px solid transparent !important; }
.pdp-thumb.active, .pdp-thumb:hover { border-color: rgba(18,18,18,1) !important; }
.pdp-trust-badges, .pdp-delivery-box { border-radius: var(--wz-radius) !important; border: 1px solid rgba(18,18,18,0.05) !important; }
.tabs-nav-product { border-bottom: 1px solid rgba(18,18,18,0.1) !important; }
.tab-btn-prod { font-size: 12px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; border-radius: var(--wz-radius) !important; color: rgba(18,18,18,0.4) !important; }
.tab-btn-prod.active { color: rgba(18,18,18,1) !important; border-bottom: 2px solid rgba(18,18,18,1) !important; }
.pdp-sticky-bar { border-top: 1px solid rgba(18,18,18,0.05) !important; }
.pdp-sticky-atc { background: rgba(18,18,18,1) !important; border-radius: var(--wz-radius) !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; }

/* ══════════════════════════════════════════════════════════════════
   12. COLLECTION PAGES
   ══════════════════════════════════════════════════════════════════ */
.product-grid { grid-template-columns: repeat(4, 1fr) !important; gap: var(--wz-grid-gap) !important; }
@media (max-width: 1024px) { .product-grid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 768px) { .product-grid { grid-template-columns: repeat(2, 1fr) !important; gap: var(--wz-grid-gap-mobile) !important; } }

/* ══════════════════════════════════════════════════════════════════
   13. FOOTER — BLUORNG: White background, dark text
   ══════════════════════════════════════════════════════════════════ */
.site-footer {
  background: var(--wz-white) !important;
  color: rgba(18,18,18,0.75) !important;
  padding: 48px 0 16px !important;
  border-top: 1px solid rgba(18,18,18,0.08) !important;
}
.site-footer a { color: rgba(18,18,18,0.6) !important; text-decoration: none !important; }
.site-footer a:hover { color: rgba(18,18,18,1) !important; }
.footer-title, .site-footer h4, .site-footer h3 {
  color: rgba(18,18,18,1) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  margin-bottom: 16px !important;
}
.site-footer li, .site-footer .footer-link {
  font-size: 13px !important;
  color: rgba(18,18,18,0.6) !important;
  margin-bottom: 8px !important;
}
.footer-nl-input {
  border-radius: var(--wz-radius) !important;
  border: 1px solid rgba(18,18,18,0.2) !important;
  background: transparent !important;
  color: rgba(18,18,18,1) !important;
}
.footer-nl-btn {
  border-radius: var(--wz-radius) !important;
  background: rgba(18,18,18,1) !important;
  color: var(--wz-white) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}
/* Footer copyright separator */
.footer-bottom, .site-footer .copyright {
  border-top: 1px solid rgba(18,18,18,0.08) !important;
  padding-top: 16px !important;
  margin-top: 32px !important;
  font-size: 11px !important;
  color: rgba(18,18,18,0.4) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

/* ══════════════════════════════════════════════════════════════════
   14. INPUTS
   ══════════════════════════════════════════════════════════════════ */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="number"], input[type="search"], textarea, select {
  border-radius: var(--wz-radius) !important; border: 1px solid rgba(18,18,18,0.55) !important;
  font-family: var(--wz-font) !important; font-size: 15px !important; letter-spacing: 0.06rem !important;
}
input:focus, textarea:focus, select:focus { border-color: rgba(18,18,18,1) !important; outline: none !important; box-shadow: none !important; }

/* ══════════════════════════════════════════════════════════════════
   15. CONTENT PAGES
   ══════════════════════════════════════════════════════════════════ */
.page-content-title { font-size: 28px !important; font-weight: 400 !important; letter-spacing: 0.06rem !important; color: rgba(18,18,18,1) !important; font-family: var(--wz-font) !important; }
.page-content-body { font-size: 15px !important; line-height: 1.8 !important; color: rgba(18,18,18,0.75) !important; }
.page-content-body h2 { font-size: 16px !important; letter-spacing: 0.06rem !important; color: rgba(18,18,18,1) !important; font-weight: 700 !important; }
.page-content-body a { color: rgba(18,18,18,1) !important; }

/* ══════════════════════════════════════════════════════════════════
   16. BREADCRUMBS / PILLS / MISC
   ══════════════════════════════════════════════════════════════════ */
.breadcrumb a, .breadcrumb span { font-size: 12px !important; color: rgba(18,18,18,0.4) !important; }
.breadcrumb .current { color: rgba(18,18,18,0.75) !important; }
.tab-btn-pill { border-radius: var(--wz-radius-pill) !important; font-size: 11px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; }
.tab-btn-pill.active { background: rgba(18,18,18,1) !important; color: var(--wz-white) !important; }
.trending-cat-card, .trending-cat-card img { border-radius: var(--wz-radius) !important; }
.trending-cat-name { font-size: 12px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: rgba(18,18,18,0.75) !important; }
.blog-card { border-radius: var(--wz-radius) !important; box-shadow: var(--wz-shadow) !important; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-thumb { background: rgba(18,18,18,0.15); border-radius: 0; }

/* ══════════════════════════════════════════════════════════════════
   17. MOBILE
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Header: hide nav links, show hamburger */
  .header-nav-links { display: none !important; }
  .mob-hamburger { display: block !important; }
  .header-hamburger { display: none !important; }

  /* Sections */
  .section-padding { padding: var(--wz-spacing-section-mobile) !important; }
  .hero-slider, .hero-slide { min-height: 85vh !important; }
  .main-nav { display: none !important; }

  /* Bottom bar */
  .mob-bottom-bar { border-top: 1px solid rgba(18,18,18,0.05) !important; background: var(--wz-white) !important; }
  .mob-bottom-btn { font-size: 10px !important; color: rgba(18,18,18,0.4) !important; }
  .mob-bottom-btn.active { color: rgba(18,18,18,1) !important; }

  /* Drawer */
  .mob-drawer {
    width: 100% !important; max-width: 100% !important;
    background: var(--wz-black) !important; color: var(--wz-white) !important;
  }
  .mob-drawer-head { border-bottom: 1px solid rgba(255,255,255,0.1) !important; }
  .mob-drawer-head .logo { color: var(--wz-white) !important; }
  .mob-drawer-close svg { stroke: var(--wz-white) !important; }
  .mob-drawer-nav a {
    color: var(--wz-white) !important; font-size: 18px !important;
    font-weight: 600 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important;
    padding: 16px 20px !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  }
  .mob-drawer-nav a svg { display: none !important; }
  .mob-drawer-cats-title { color: rgba(255,255,255,0.4) !important; font-size: 11px !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; }
  .mob-drawer-cats a { color: rgba(255,255,255,0.7) !important; }
  .logo { font-size: 20px !important; letter-spacing: 0.18em !important; }
  #btnAccount { font-size: 0 !important; }
  .product-card .card-title { font-size: 12px !important; }
  .product-card .card-price { font-size: 12px !important; }
  .product-card .card-body { padding: 8px 0 4px !important; }
  .section-header-bluorng { margin-bottom: 16px !important; }
  .discover-more-btn { font-size: 11px !important; padding: 6px 14px !important; }
  .site-footer { padding: 32px 0 12px !important; }
}

/* ══════════════════════════════════════════════════════════════════
   18. ANIMATIONS
   ══════════════════════════════════════════════════════════════════ */
a, button, .btn-primary, .btn-outline, .product-card img { transition: all var(--wz-transition) !important; }
.banner-card img { transition: transform 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) !important; }
.banner-card:hover img { transform: scale(1.03) !important; }

/* ══════════════════════════════════════════════════════════════════
   19. CART & CHECKOUT
   ══════════════════════════════════════════════════════════════════ */
.cart-item-img { border-radius: var(--wz-radius) !important; }
.cart-item-title { font-weight: 400 !important; color: rgba(18,18,18,0.75) !important; letter-spacing: 0.06rem !important; }
.cart-item-price { font-weight: 700 !important; color: rgba(18,18,18,1) !important; }
.cart-summary { border-radius: var(--wz-radius) !important; border: 1px solid rgba(18,18,18,0.05) !important; }
.checkout-section { border-radius: var(--wz-radius) !important; }
.order-summary { border-radius: var(--wz-radius) !important; }

/* ══════════════════════════════════════════════════════════════════
   20. FOOTER PREMIUM RENDERER (.ft-*) — Dark → White override
   ══════════════════════════════════════════════════════════════════ */
.ft-premium, .ft-shell {
  background: var(--wz-white) !important;
  color: rgba(18,18,18,0.75) !important;
}
.ft-glow { display: none !important; }
.ft-brand-row { border-bottom: 1px solid rgba(18,18,18,0.06) !important; }
.ft-logo-text {
  color: rgba(18,18,18,1) !important;
  font-weight: 800 !important;
  letter-spacing: 0.2em !important;
}
.ft-tagline { color: rgba(18,18,18,0.5) !important; }
.ft-address, .ft-address span { color: rgba(18,18,18,0.6) !important; }
.ft-address svg { stroke: rgba(18,18,18,0.4) !important; }
.ft-social-link {
  background: rgba(18,18,18,0.06) !important;
  color: rgba(18,18,18,0.6) !important;
}
.ft-social-link:hover { background: rgba(18,18,18,0.12) !important; color: rgba(18,18,18,1) !important; }
.ft-social-link svg { stroke: rgba(18,18,18,0.6) !important; fill: none !important; }
.ft-social-link:hover svg { stroke: rgba(18,18,18,1) !important; }
.ft-pay {
  background: rgba(18,18,18,0.02) !important;
  border: 1px solid rgba(18,18,18,0.06) !important;
  border-radius: var(--wz-radius) !important;
}
.ft-pay-head, .ft-pay-title { color: rgba(18,18,18,0.6) !important; }
.ft-pay-secure { color: rgba(18,18,18,0.4) !important; }
.ft-pay-secure svg { stroke: rgba(18,18,18,0.4) !important; }
.ft-pay-card {
  background: var(--wz-white) !important;
  border: 1px solid rgba(18,18,18,0.06) !important;
}
.ft-pay-cod { color: rgba(18,18,18,0.5) !important; }
.ft-pay-cod svg { stroke: rgba(18,18,18,0.4) !important; }
/* Link columns */
.ft-col-head {
  color: rgba(18,18,18,1) !important;
  font-weight: 700 !important;
  border-bottom-color: rgba(18,18,18,0.06) !important;
}
.ft-col-head .ft-col-chev svg { stroke: rgba(18,18,18,0.3) !important; }
.ft-col-list a {
  color: rgba(18,18,18,0.6) !important;
}
.ft-col-list a:hover { color: rgba(18,18,18,1) !important; }
/* Trust strip */
.ft-trust-strip { border-top: 1px solid rgba(18,18,18,0.06) !important; }
.ft-trust-card { background: rgba(18,18,18,0.02) !important; border: 1px solid rgba(18,18,18,0.04) !important; }
.ft-trust-card-ico svg { stroke: rgba(18,18,18,0.4) !important; }
.ft-trust-card-lbl { color: rgba(18,18,18,0.8) !important; }
.ft-trust-card-sub { color: rgba(18,18,18,0.4) !important; }
.ft-trust-ind { border-color: rgba(18,18,18,0.06) !important; }
.ft-trust-ind-ico svg { stroke: rgba(18,18,18,0.4) !important; }
.ft-trust-ind-lbl { color: rgba(18,18,18,0.8) !important; }
.ft-trust-ind-sub { color: rgba(18,18,18,0.4) !important; }
/* Contact cards */
.ft-contact-card { background: rgba(18,18,18,0.02) !important; border: 1px solid rgba(18,18,18,0.04) !important; }
.ft-contact-ico svg { stroke: rgba(18,18,18,0.4) !important; }
.ft-contact-main { color: rgba(18,18,18,0.8) !important; }
.ft-contact-sub { color: rgba(18,18,18,0.4) !important; }
/* Copyright */
.ft-bottom {
  border-top: 1px solid rgba(18,18,18,0.06) !important;
  color: rgba(18,18,18,0.4) !important;
}
.ft-bottom a { color: rgba(18,18,18,0.4) !important; }
.ft-bottom a:hover { color: rgba(18,18,18,0.7) !important; }
/* Digital strip */
.gd-strip { border-top: 1px solid rgba(18,18,18,0.06) !important; }
.gd-strip-card { background: rgba(18,18,18,0.02) !important; border: 1px solid rgba(18,18,18,0.04) !important; }
.gd-strip-brand-eyebrow { color: rgba(18,18,18,0.4) !important; }
.gd-strip-brand-name { color: rgba(18,18,18,0.8) !important; }
.gd-strip-headline { color: rgba(18,18,18,0.7) !important; }
.gd-strip-sub { color: rgba(18,18,18,0.5) !important; }
.gd-strip-logo svg { stroke: rgba(18,18,18,0.4) !important; }
.gd-strip a { color: rgba(18,18,18,0.5) !important; }
.gd-strip a:hover { color: rgba(18,18,18,0.8) !important; }
.gd-strip svg { stroke: rgba(18,18,18,0.4) !important; }

/* ══════════════════════════════════════════════════════════════════
   ████  PHASE 2: PREMIUM EDITORIAL FASHION  ████
   ══════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════════
   21. SCROLL REVEAL ANIMATIONS
   ══════════════════════════════════════════════════════════════════ */
[data-reveal] {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s var(--wz-ease-premium), transform 0.8s var(--wz-ease-premium);
  will-change: opacity, transform;
}
[data-reveal].revealed {
  opacity: 1;
  transform: translateY(0);
}
/* Stagger children */
[data-stagger] > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s var(--wz-ease-premium), transform 0.6s var(--wz-ease-premium);
}
[data-stagger] > *.stagger-in {
  opacity: 1;
  transform: translateY(0);
}

/* ══════════════════════════════════════════════════════════════════
   22. HERO — PREMIUM EDITORIAL
   ══════════════════════════════════════════════════════════════════ */
.hero-slider {
  position: relative !important;
  overflow: hidden !important;
}
.hero-slides {
  aspect-ratio: auto !important;
  min-height: 100vh !important;
  max-height: none !important;
}
.hero-slide {
  min-height: 100vh !important;
}
/* Dark gradient overlay for text readability */
.hero-slide::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.15) 0%,
    rgba(0,0,0,0.05) 40%,
    rgba(0,0,0,0.3) 100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
/* Ken Burns effect */
.hero-slide img {
  transition: transform 8s ease-out !important;
}
.hero-slide img.ken-burns {
  animation: kenBurns 12s ease-in-out infinite alternate !important;
}
@keyframes kenBurns {
  0%   { transform: scale(1) translate3d(0, 0, 0); }
  100% { transform: scale(1.08) translate3d(-1%, -1%, 0); }
}
/* Hero text stagger animation */
.hero-content, .hero-slide .banner-content {
  z-index: 2 !important;
  position: relative !important;
}
.hero-slide.is-active .hero-subtitle,
.hero-slide.is-active .banner-subtitle {
  animation: heroTextIn 0.8s var(--wz-ease-premium) 0.2s both !important;
}
.hero-slide.is-active .hero-title,
.hero-slide.is-active .banner-title {
  animation: heroTextIn 0.8s var(--wz-ease-premium) 0.4s both !important;
}
.hero-slide.is-active .btn-primary,
.hero-slide.is-active .btn-outline {
  animation: heroTextIn 0.8s var(--wz-ease-premium) 0.6s both !important;
}
@keyframes heroTextIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* Hero dots — thin line style */
.slider-dots {
  bottom: 28px !important;
  z-index: 3 !important;
}
.slider-dot {
  width: 32px !important;
  height: 3px !important;
  border-radius: 2px !important;
  background: rgba(255,255,255,0.35) !important;
  border: none !important;
  transition: all 0.4s var(--wz-ease-out) !important;
}
.slider-dot.active {
  background: var(--wz-white) !important;
  width: 48px !important;
}
/* Hero arrows — editorial */
.hero-arrow {
  width: 48px !important;
  height: 48px !important;
  background: rgba(255,255,255,0.1) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 50% !important;
  color: var(--wz-white) !important;
  z-index: 3 !important;
  transition: all 0.3s ease !important;
}
.hero-arrow:hover {
  background: rgba(255,255,255,0.2) !important;
  border-color: rgba(255,255,255,0.4) !important;
}

/* ══════════════════════════════════════════════════════════════════
   23. TRANSPARENT HEADER — HOME PAGE HERO
   ══════════════════════════════════════════════════════════════════ */
.home-page .site-header:not(.header-scrolled) {
  background: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
}
.home-page .site-header:not(.header-scrolled) .logo {
  color: var(--wz-white) !important;
}
.home-page .site-header:not(.header-scrolled) .header-nav-links a {
  color: rgba(255,255,255,0.85) !important;
}
.home-page .site-header:not(.header-scrolled) .header-nav-links a:hover {
  color: var(--wz-white) !important;
}
.home-page .site-header:not(.header-scrolled) .header-action-btn svg {
  stroke: var(--wz-white) !important;
}
.home-page .site-header:not(.header-scrolled) .header-hamburger svg {
  stroke: var(--wz-white) !important;
}
.home-page .site-header.header-scrolled {
  background: var(--wz-white) !important;
  box-shadow: 0 1px 0 rgba(18,18,18,0.06) !important;
}

/* ══════════════════════════════════════════════════════════════════
   24. SECTION SPACING — LUXURY WHITESPACE
   ══════════════════════════════════════════════════════════════════ */
.section-padding {
  padding: var(--wz-spacing-section) 0 !important;
}
.section-title {
  font-size: var(--wz-fs-h1) !important;
  font-weight: 300 !important;
  letter-spacing: 0.04em !important;
  color: rgba(18,18,18,1) !important;
  line-height: 1.2 !important;
}
.section-header-bluorng {
  margin-bottom: clamp(24px, 4vw, 48px) !important;
}

/* ══════════════════════════════════════════════════════════════════
   25. TRUST SECTION — MINIMAL STRIP
   ══════════════════════════════════════════════════════════════════ */
.gtrust {
  padding: clamp(20px, 3vw, 40px) 0 !important;
  border-bottom: 1px solid rgba(18,18,18,0.06) !important;
  background: var(--wz-white) !important;
}
.gtrust-title {
  font-size: var(--wz-fs-caption) !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: rgba(18,18,18,0.35) !important;
  font-weight: 500 !important;
  margin-bottom: 16px !important;
}
.gtrust-badges {
  display: flex !important;
  gap: clamp(16px, 3vw, 40px) !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
}
.gtrust-badge {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(18,18,18,0.55) !important;
  letter-spacing: 0.06em !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.gtrust-badge svg {
  width: 16px !important;
  height: 16px !important;
  stroke: rgba(18,18,18,0.35) !important;
}
.gtrust-chips {
  margin-top: 16px !important;
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
}
.gtrust-chip {
  font-size: 10px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  padding: 4px 14px !important;
  border: 1px solid rgba(18,18,18,0.1) !important;
  border-radius: var(--wz-radius-pill) !important;
  color: rgba(18,18,18,0.4) !important;
  background: transparent !important;
}

/* ══════════════════════════════════════════════════════════════════
   26. CATEGORY BANNERS — EDITORIAL GRID
   ══════════════════════════════════════════════════════════════════ */
.category-banners {
  padding: var(--wz-spacing-section) 0 !important;
}
.banner-card {
  overflow: hidden !important;
  position: relative !important;
}
.banner-card img {
  transition: transform 0.8s var(--wz-ease-premium) !important;
}
.banner-card:hover img {
  transform: scale(1.06) !important;
}
.banner-content {
  z-index: 2 !important;
}
.banner-title {
  font-size: var(--wz-fs-h2) !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
}
.banner-subtitle {
  font-size: var(--wz-fs-caption) !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  opacity: 0.7 !important;
}

/* ══════════════════════════════════════════════════════════════════
   27. ABOUT SECTION — EDITORIAL WHITESPACE
   ══════════════════════════════════════════════════════════════════ */
.about-section {
  padding: var(--wz-spacing-section) 0 !important;
}
.about-subtitle {
  font-size: var(--wz-fs-caption) !important;
  letter-spacing: 0.25em !important;
  text-transform: uppercase !important;
  color: rgba(18,18,18,0.4) !important;
  margin-bottom: 12px !important;
}
.about-title {
  font-size: var(--wz-fs-h1) !important;
  font-weight: 300 !important;
  letter-spacing: 0.02em !important;
  color: rgba(18,18,18,1) !important;
  line-height: 1.2 !important;
  margin-bottom: 20px !important;
}
.about-desc {
  font-size: var(--wz-fs-body) !important;
  line-height: 1.8 !important;
  color: rgba(18,18,18,0.6) !important;
  max-width: 520px !important;
}
.about-trust-pill {
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  color: rgba(18,18,18,0.5) !important;
  border: 1px solid rgba(18,18,18,0.1) !important;
  border-radius: var(--wz-radius-pill) !important;
  padding: 6px 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.about-trust-pill svg {
  width: 14px !important;
  height: 14px !important;
  stroke: rgba(18,18,18,0.35) !important;
}

/* ══════════════════════════════════════════════════════════════════
   28. CTA BANNER — FULL BLEED EDITORIAL
   ══════════════════════════════════════════════════════════════════ */
.cta-banner {
  min-height: clamp(320px, 45vw, 560px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}
.cta-banner::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0,0,0,0.35) !important;
  z-index: 1 !important;
}
.cta-content {
  position: relative !important;
  z-index: 2 !important;
}
.cta-subtitle {
  font-size: var(--wz-fs-caption) !important;
  letter-spacing: 0.3em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.65) !important;
  margin-bottom: 12px !important;
}
.cta-title {
  font-size: var(--wz-fs-display) !important;
  font-weight: 300 !important;
  letter-spacing: 0.02em !important;
  color: var(--wz-white) !important;
  line-height: 1.1 !important;
  margin-bottom: 28px !important;
}
.cta-banner .btn-primary {
  background: var(--wz-white) !important;
  color: var(--wz-black) !important;
  border: none !important;
  padding: 16px 40px !important;
  font-size: 12px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}
.cta-banner .btn-primary:hover {
  background: rgba(255,255,255,0.9) !important;
  transform: translateY(-2px) !important;
}

/* ══════════════════════════════════════════════════════════════════
   29. TESTIMONIALS — EDITORIAL
   ══════════════════════════════════════════════════════════════════ */
.ts-section {
  padding: var(--wz-spacing-section) 0 !important;
  background: var(--wz-grey-100) !important;
}
.ts-eyebrow {
  font-size: var(--wz-fs-caption) !important;
  letter-spacing: 0.25em !important;
  text-transform: uppercase !important;
  color: rgba(18,18,18,0.35) !important;
}
.ts-title {
  font-size: var(--wz-fs-h1) !important;
  font-weight: 300 !important;
  letter-spacing: 0.02em !important;
  color: rgba(18,18,18,1) !important;
}

/* ══════════════════════════════════════════════════════════════════
   30. BULK CTA — EDITORIAL
   ══════════════════════════════════════════════════════════════════ */
.bulk-cta-section {
  padding: var(--wz-spacing-section) 0 !important;
}
.bulk-eyebrow {
  font-size: var(--wz-fs-caption) !important;
  letter-spacing: 0.2em !important;
  color: rgba(18,18,18,0.4) !important;
}
.bulk-title {
  font-size: var(--wz-fs-h2) !important;
  font-weight: 400 !important;
  color: rgba(18,18,18,1) !important;
}

/* ══════════════════════════════════════════════════════════════════
   31. PRODUCT CARD HOVER — PREMIUM INTERACTIONS
   ══════════════════════════════════════════════════════════════════ */
.product-card .card-img-wrap img {
  transition: transform 0.8s var(--wz-ease-premium) !important;
}
.product-card:hover .card-img-wrap img {
  transform: scale(1.08) !important;
}
/* Quick-add "+" scale-in on hover */
.product-card .card-add-btn, .product-card .add-to-cart-sm {
  transform: scale(0) !important;
  transition: transform 0.3s var(--wz-ease-premium), opacity 0.3s ease !important;
  opacity: 0 !important;
}
.product-card:hover .card-add-btn, .product-card:hover .add-to-cart-sm {
  transform: scale(1) !important;
  opacity: 1 !important;
}
/* Text opacity shift */
.product-card .card-title {
  transition: color 0.3s ease !important;
}
.product-card:hover .card-title {
  color: rgba(18,18,18,1) !important;
}

/* ══════════════════════════════════════════════════════════════════
   32. COLLECTION PAGE — FILTER & SORT EDITORIAL
   ══════════════════════════════════════════════════════════════════ */
.filter-pill, .filter-tag {
  border-radius: var(--wz-radius-pill) !important;
  border: 1px solid rgba(18,18,18,0.2) !important;
  background: transparent !important;
  font-size: var(--wz-fs-label) !important;
  letter-spacing: 0.06em !important;
  padding: 8px 20px !important;
  color: rgba(18,18,18,0.7) !important;
  transition: all 0.2s ease !important;
}
.filter-pill.active, .filter-tag.active {
  background: var(--wz-black) !important;
  color: var(--wz-white) !important;
  border-color: var(--wz-black) !important;
}
.filter-pill:hover, .filter-tag:hover {
  border-color: rgba(18,18,18,0.5) !important;
}
.sort-select, .sort-dropdown select {
  border: none !important;
  font-size: 13px !important;
  color: rgba(18,18,18,0.6) !important;
  background: transparent !important;
}
/* Load more button */
.load-more-btn, .btn-load-more {
  width: 100% !important;
  max-width: 320px !important;
  margin: 40px auto 0 !important;
  display: block !important;
  padding: 16px !important;
  font-size: 12px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  background: transparent !important;
  border: 1px solid rgba(18,18,18,0.2) !important;
  color: rgba(18,18,18,0.7) !important;
  transition: all 0.3s ease !important;
}
.load-more-btn:hover, .btn-load-more:hover {
  background: var(--wz-black) !important;
  color: var(--wz-white) !important;
  border-color: var(--wz-black) !important;
}

/* ══════════════════════════════════════════════════════════════════
   33. PDP — ACCORDION TABS
   ══════════════════════════════════════════════════════════════════ */
.pdp-accordion {
  border-top: 1px solid rgba(18,18,18,0.08) !important;
}
.pdp-accordion-item {
  border-bottom: 1px solid rgba(18,18,18,0.08) !important;
}
.pdp-accordion-btn {
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 18px 0 !important;
  background: none !important;
  border: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(18,18,18,1) !important;
  cursor: pointer !important;
}
.pdp-accordion-btn svg {
  width: 16px !important;
  height: 16px !important;
  transition: transform 0.3s ease !important;
  stroke: rgba(18,18,18,0.4) !important;
}
.pdp-accordion-item.open .pdp-accordion-btn svg {
  transform: rotate(180deg) !important;
}
.pdp-accordion-body {
  max-height: 0 !important;
  overflow: hidden !important;
  transition: max-height 0.4s var(--wz-ease-out) !important;
  padding: 0 !important;
}
.pdp-accordion-item.open .pdp-accordion-body {
  max-height: 600px !important;
  padding-bottom: 20px !important;
}
.pdp-accordion-body-inner {
  font-size: 14px !important;
  line-height: 1.8 !important;
  color: rgba(18,18,18,0.6) !important;
}

/* ══════════════════════════════════════════════════════════════════
   34. PERFORMANCE — CONTENT VISIBILITY
   ══════════════════════════════════════════════════════════════════ */
.ts-section,
.about-section,
.cta-banner,
.bulk-cta-section,
#blogSection,
.site-footer {
  content-visibility: auto !important;
  contain-intrinsic-size: auto 500px !important;
}

/* ══════════════════════════════════════════════════════════════════
   35. MOBILE — PHASE 2 REFINEMENTS
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Section spacing */
  .section-padding { padding: var(--wz-spacing-section-mobile) 0 !important; }
  .hero-slides { min-height: 85vh !important; }
  .hero-slide { min-height: 85vh !important; }

  /* Trust strip: horizontal scroll */
  .gtrust-badges {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding-bottom: 8px !important;
    justify-content: flex-start !important;
  }
  .gtrust-badges::-webkit-scrollbar { display: none !important; }
  .gtrust-badge { white-space: nowrap !important; flex-shrink: 0 !important; }

  /* About section */
  .about-section { padding: var(--wz-spacing-section-mobile) 0 !important; }

  /* CTA banner */
  .cta-title { font-size: clamp(28px, 7vw, 42px) !important; }

  /* Product card "+" always visible on mobile */
  .product-card .card-add-btn, .product-card .add-to-cart-sm {
    transform: scale(1) !important;
    opacity: 1 !important;
  }

  /* Bottom bar: thinner */
  .mob-bottom-bar {
    padding: 6px 0 !important;
    border-top: 1px solid rgba(18,18,18,0.04) !important;
  }
  .mob-bottom-btn svg {
    width: 20px !important;
    height: 20px !important;
  }
  .mob-bottom-btn {
    font-size: 9px !important;
    min-height: 44px !important;
    min-width: 44px !important;
  }

  /* Drawer: editorial */
  .mob-drawer {
    width: 100% !important;
    max-width: 100% !important;
    background: var(--wz-black) !important;
  }
  .mob-drawer-nav a {
    font-size: 20px !important;
    font-weight: 300 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    padding: 18px 24px !important;
    border-bottom: 1px solid rgba(255,255,255,0.04) !important;
  }

  /* Section titles */
  .section-title { font-size: clamp(20px, 5vw, 28px) !important; }
}