/** Shopify CDN: Minification failed

Line 6391:8 Unexpected "/"

**/
/* Level Egypt Theme - Built from site-guide.html */


/* ===== CSS TOKENS (from site-guide.html) ===== */
:root {
  --client-brown-dark:    #4a3d2b;
  --client-brown-hover:   #6a593f;
  --client-offwhite:      #eeeeea;
  --client-deal-red:      #a83a32;
  --client-deal-red-dark: #7f2824;
  --client-deal-red-soft: #transparent;
  --client-espresso:      #2a1f17;
  --client-white:         #ffffff;
  --client-cream-light:   #f4f4f1;
  --client-warm-gray:     #e8e8e3;
}

/* ===== RESET ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif; }
body { background: #eeeeea; color: #2a1f17; line-height: 1.5; -webkit-font-smoothing: antialiased; }
input, select, textarea, button { font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; font-weight: 800; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.md-hidden { display: block; }
.md-show { display: none; }
.sm-show { display: none; }
@media (min-width: 640px) { .sm-show { display: block; } }
@media (min-width: 768px) { .md-hidden { display: none !important; } .md-show { display: block; } }
@media (max-width: 767.98px) { body { padding-bottom: 65px; } }

/* ===== ANNOUNCEMENT BAR — #4a3d2b bg, white text ===== */
.announcement-bar { position: relative; display: flex; align-items: center; justify-content: space-between; padding: 8px 16px; background: #4a3d2b; color: #ffffff; font-size: 12px; font-family: 'Montserrat', sans-serif; }
.announcement-bar__left { display: flex; align-items: center; }
.announcement-bar__whatsapp { color: #ffffff; display: flex; align-items: center; }
.announcement-bar__whatsapp svg { fill: #ffffff; stroke: none; width: 18px; height: 18px; }
.announcement-bar__center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; pointer-events: none; white-space: nowrap; }
.announcement-bar__message { font-size: 12px; font-weight: 600; letter-spacing: 0.02em; color: #ffffff; transition: opacity 0.4s; display: inline-block; }
.announcement-bar__right { display: flex; align-items: center; }
.announcement-bar__lang-btn { display: flex; align-items: center; gap: 4px; color: #ffffff; font-size: 12px; font-weight: 500; background: transparent; border: 0; cursor: pointer; font-family: 'Montserrat', sans-serif; }
.announcement-bar__lang-btn svg { stroke: #ffffff; fill: none; width: 12px; height: 12px; }

/* ===== HEADER — #eeeeea bg, logo centered, no shadow ===== */
.header { background: #eeeeea; padding: 12px 16px; position: sticky; top: 0; z-index: 100; border-bottom: none; box-shadow: none; }
@media (min-width: 768px) { .header { padding: 16px 24px; } }
.header__inner { display: flex; align-items: center; justify-content: space-between; }
.header__left, .header__right { display: flex; align-items: center; gap: 12px; width: 33.33%; }
.header__right { justify-content: flex-end; }
.header__center { width: 33.33%; display: flex; justify-content: center; }
.header__logo { height: 48px; width: auto; filter: brightness(0); }
.header__icon, .header__menu-btn, .header__search-btn, .header__search-btn-mobile { color: #2a1f17; display: flex; align-items: center; transition: opacity 0.2s; }
.header__icon:hover, .header__menu-btn:hover, .header__search-btn:hover, .header__search-btn-mobile:hover { opacity: 0.7; }
.header__icon svg, .header__menu-btn svg, .header__search-btn svg, .header__search-btn-mobile svg { stroke: #2a1f17; fill: none; width: 22px; height: 22px; }
.header__cart { position: relative; }
.header__cart-count { position: absolute; top: -6px; right: -6px; background: #4a3d2b; color: #fff; font-size: 10px; font-weight: 700; width: 16px; height: 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: 'Montserrat', sans-serif; }

/* ===== STICKY TABS (Desktop) — #eeeeea bg, hover underline ===== */
.nav-bar { background: #eeeeea; border-top: none; border-bottom: none; padding: 8px 0; display: none; }
@media (min-width: 768px) { .nav-bar { display: block; } }
.nav-bar__inner { display: flex; align-items: center; justify-content: center; gap: 32px; }
.nav-bar__item { position: relative; }
.nav-bar__link { display: flex; align-items: center; gap: 4px; font-size: 13px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; color: #2a1f17; transition: color 0.2s; padding: 4px 0; border-bottom: 2px solid transparent; font-family: 'Montserrat', sans-serif; }
.nav-bar__link:hover { color: #4a3d2b; border-bottom-color: #4a3d2b; }
.nav-bar__link--accent { color: #4a3d2b; }
.nav-bar__pulse { width: 6px; height: 6px; background: #4a3d2b; border-radius: 50%; animation: newPulse 1.4s ease-in-out infinite; display: inline-block; margin-right: 2px; }
.nav-bar__dropdown { display: none; position: absolute; top: 100%; left: 0; margin-top: 8px; background: #eeeeea; border: 1px solid rgba(74,61,43,0.15); border-radius: 12px; min-width: 180px; padding: 8px 0; z-index: 50; box-shadow: 0 8px 24px rgba(74,61,43,0.12); }
.nav-bar__item:hover .nav-bar__dropdown { display: block; }
.nav-bar__dropdown-link { display: block; padding: 8px 16px; font-size: 12px; color: #2a1f17; transition: all 0.2s; font-family: 'Montserrat', sans-serif; }
.nav-bar__dropdown-link:hover { background: rgba(74,61,43,0.06); color: #4a3d2b; }

/* ===== HERO SLIDER ===== */
.hero-slider { position: relative; overflow: hidden; }
.hero-slider__track { display: flex; transition: transform 0.6s cubic-bezier(0.4,0,0.2,1); }
.hero-slider__slide { min-width: 100%; position: relative; height: clamp(260px, 52vw, 460px); }
.hero-slider__image { position: absolute; inset: 0; }
.hero-slider__image img { width: 100%; height: 100%; object-fit: cover; }
.hero-slider__placeholder { width: 100%; height: 100%; background: linear-gradient(135deg, #e8e8e3, #dddcd7); }
.hero-slider__overlay { position: absolute; inset: 0; background: linear-gradient(to right, rgba(250,242,230,0.92) 0%, rgba(250,242,230,0.62) 48%, rgba(42,31,23,0.18) 100%); }
.hero-slider__content { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; height: 100%; padding: 40px; max-width: 600px; }
.hero-slider__tag { font-size: 12px; font-family: 'Montserrat', sans-serif; font-weight: 500; color: rgba(58,40,24,0.72); border: 1px solid rgba(141,101,56,0.28); background: rgba(255,250,241,0.46); padding: 4px 12px; border-radius: 9999px; width: fit-content; margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.06em; }
.hero-slider__title { font-family: 'Bebas Neue', sans-serif; font-size: clamp(36px, 8vw, 64px); color: #2a1f17; line-height: 1; margin-bottom: 12px; font-weight: 400; }
.hero-slider__subtitle { font-size: 14px; font-family: 'Montserrat', sans-serif; color: rgba(58,40,24,0.68); margin-bottom: 24px; max-width: 400px; line-height: 1.6; }
.hero-slider__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-slider__nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,250,241,0.72); border: 1px solid rgba(141,101,56,0.22); color: #2a1f17; display: flex; align-items: center; justify-content: center; }
.hero-slider__nav--prev { left: 16px; }
.hero-slider__nav--next { right: 16px; }
.hero-slider__nav svg { stroke: #2a1f17; fill: none; width: 20px; height: 20px; }
.hero-slider__dots { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 3; }
.hero-slider__dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(42,31,23,0.3); border: none; cursor: pointer; transition: all 0.3s; }
.hero-slider__dot.is-active { background: #4a3d2b; width: 24px; border-radius: 4px; }

/* ===== BUTTONS — pill shape, Montserrat bold uppercase ===== */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 9999px; font-size: 13px; font-weight: 700; font-family: 'Montserrat', sans-serif; letter-spacing: 0.06em; text-transform: uppercase; transition: all 0.2s; cursor: pointer; border: none; padding: 14px 28px; }
.btn--primary { background: #4a3d2b; color: #fff; }
.btn--primary:hover { background: #6a593f; }
.btn--outline { border: 1.5px solid rgba(58,40,24,0.45); color: #2a1f17; background: rgba(255,250,241,0.3); }
.btn--outline:hover { border-color: rgba(74,61,43,0.9); background: rgba(255,250,241,0.72); }
.btn--sm { padding: 8px 16px; font-size: 11px; }
.btn--full { width: 100%; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ===== INFO TICKER — #f4f4f1 bg ===== */
.info-ticker { background: #f4f4f1; padding: 14px 0; overflow: hidden; }
.info-ticker__track { display: flex; width: max-content; animation: marquee 40s linear infinite; }
.info-ticker__group { display: flex; align-items: center; gap: 40px; padding-right: 40px; flex-shrink: 0; }
.info-ticker__item { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.info-ticker__icon { font-size: 14px; color: #2a1f17; }
.info-ticker__text { font-size: 13px; font-weight: 600; color: #2a1f17; font-family: 'Montserrat', sans-serif; }

/* ===== CATEGORIES — #e8e8e3 bg, rounded-2xl on mobile ===== */
.categories { padding: 10px 0 12px; }
@media (max-width: 767.98px) { .categories { background: #e8e8e3; border-radius: 16px; margin: 0 16px; } }
@media (min-width: 768px) { .categories { background: #e8e8e3; border-radius: 16px; margin: 16px auto; max-width: 1200px; } }
.categories__grid { display: flex; gap: 14px; overflow-x: auto; padding: 0 12px; scrollbar-width: none; justify-content: center; max-width: 420px; margin: 0 auto; }
.categories__grid::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .categories__grid { max-width: none; gap: 20px; } }
.categories__item { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 80px; text-align: center; }
.categories__image-wrap { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #fff; border: 1.5px solid rgba(74,61,43,0.15); transition: border-color 0.2s; flex-shrink: 0; }
.categories__item:hover .categories__image-wrap { border-color: #4a3d2b; }
.categories__image-wrap img { width: 100%; height: 100%; object-fit: cover; }
.categories__placeholder { width: 100%; height: 100%; background: #e8e8e3; }
.categories__label { font-size: 12px; font-weight: 500; color: #2a1f17; font-family: 'Montserrat', sans-serif; transition: color 0.2s; }
.categories__item:hover .categories__label { color: #4a3d2b; text-decoration: underline; }

/* ===== SECTION HEADER ===== */
.section-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; gap: 12px; flex-wrap: wrap; }
.section-header__text { flex: 1; }
.section-header__title { font-family: 'Montserrat', sans-serif; font-size: clamp(18px, 4vw, 24px); color: #2a1f17; font-weight: 800; letter-spacing: 0.01em; text-transform: uppercase; margin: 0; }
.section-header__desc { font-size: 12px; font-family: 'Montserrat', sans-serif; color: rgba(42,31,23,0.58); margin-top: 2px; max-width: 360px; line-height: 1.55; font-weight: 400; }
.section-header__link { font-size: 13px; font-weight: 600; color: #2a1f17; white-space: nowrap; font-family: 'Montserrat', sans-serif; align-self: flex-start; margin-top: 4px; }
.section-header__link:hover { color: #4a3d2b; }

/* ===== SECTION TABS — pill, active #4a3d2b ===== */
.section-tabs { display: inline-flex; background: #fff; border-radius: 9999px; padding: 3px; gap: 0; border: 1px solid #dddcd7; flex-shrink: 0; }
.section-tabs__tab { padding: 8px 18px; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #2a1f17; background: #fff; border: 1px solid #dddcd7; border-radius: 9999px; cursor: pointer; transition: all 0.2s; font-family: 'Montserrat', sans-serif; margin: 0 -1px; }
.section-tabs__tab:hover:not(.is-active) { background: #4a3d2b; color: #fff; border-color: #4a3d2b; }
.section-tabs__tab.is-active { background: #4a3d2b; color: #fff; border-color: #4a3d2b; }
@media (max-width: 640px) { .section-tabs__tab { padding: 6px 12px; font-size: 11px; } }
.section-tabs__panel { display: none !important; }
.section-tabs__panel.is-active { display: flex !important; }

/* ===== PRODUCT GRID ===== */
.product-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media (min-width: 640px) { .product-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .product-grid { grid-template-columns: repeat(4, 1fr); } }
.product-grid--slider { display: flex; overflow-x: auto; gap: 16px; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.product-grid--slider::-webkit-scrollbar { display: none; }
.product-grid--slider .product-card { min-width: clamp(155px, 42vw, 210px); scroll-snap-align: start; flex-shrink: 0; }

/* ===== PRODUCT CARD — white bg, rounded-xl, hover shadow ===== */
.product-card { position: relative; border-radius: 12px; overflow: hidden; background: #ffffff; transition: box-shadow 0.3s; }
.product-card:hover { box-shadow: 0 18px 34px rgba(74,61,43,0.22); }
.product-card__link { display: block; }
.product-card__image { aspect-ratio: 1/1; overflow: hidden; background: #eeeeea; position: relative; }
.product-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.product-card:hover .product-card__image img { transform: scale(1.04); }
.product-card__placeholder { width: 100%; height: 100%; background: #eeeeea; display: flex; align-items: center; justify-content: center; }
.product-card__tag-badge { position: absolute; top: 10px; left: 10px; background: #4a3d2b; color: #eeeeea; font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 10px; border-radius: 6px; font-family: 'Montserrat', sans-serif; z-index: 2; }
.product-card__discount-badge { position: absolute; top: 10px; left: 10px; background: #a83a32; color: #fff; font-size: 10px; font-weight: 800; padding: 4px 10px; border-radius: 9999px; font-family: 'Montserrat', sans-serif; z-index: 2; }
.product-card__info { padding: 12px; }
.product-card__vendor { font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(42,31,23,0.6); margin-bottom: 4px; font-family: 'Montserrat', sans-serif; }
.product-card__title { font-size: 13px; font-weight: 600; color: #2a1f17; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-family: 'Montserrat', sans-serif; }
.product-card__rating { display: flex; align-items: center; gap: 1px; margin-bottom: 6px; }
.product-card__rating svg { width: 12px; height: 12px; }
.product-card__price { display: flex; align-items: center; gap: 8px; }
.product-card__price-current { font-size: 15px; font-weight: 800; color: #2a1f17; font-family: 'Montserrat', sans-serif; }
.product-card__price-compare { font-size: 12px; color: rgba(42,31,23,0.4); text-decoration: line-through; font-family: 'Montserrat', sans-serif; }
.product-card__wishlist { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,250,241,0.9); border: 1px solid rgba(104,76,46,0.16); display: flex; align-items: center; justify-content: center; color: #3a2818; z-index: 2; transition: all 0.2s; cursor: pointer; }
.product-card__wishlist:hover { background: #fff; }
.product-card__wishlist svg { width: 16px; height: 16px; stroke: #3a2818; fill: none; }

/* ===== FEATURED COLLECTION ===== */
.featured-collection { padding: 32px 0; background: #eeeeea; }
@media (min-width: 768px) { .featured-collection { padding: 48px 0; } }

/* ===== SECTION FOOTER (View All button) ===== */
.section-footer { display: flex; justify-content: center; margin-top: 24px; }
.section-footer__btn { min-width: 280px; padding: 14px 32px; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; border-radius: 9999px; background: #4a3d2b; color: #fff; font-family: 'Montserrat', sans-serif; border: none; cursor: pointer; transition: background 0.2s; }
.section-footer__btn:hover { background: #6a593f; }
@media (max-width: 640px) { .section-footer__btn { min-width: 0; width: 100%; max-width: 400px; } }

/* ===== DEALS — #transparent bg, red accents ===== */
.deals { padding: 32px 0; background: #eeeeea; }
@media (min-width: 768px) { .deals { padding: 48px 0; } }
.deals__inner { background: #transparent; border-radius: 16px; overflow: hidden; padding: 20px; }
.deals__header { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
@media (min-width: 768px) { .deals__header { flex-direction: row; align-items: center; justify-content: space-between; } }
.deals__eyebrow { font-size: 11px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; color: #a83a32; margin-bottom: 2px; font-family: 'Montserrat', sans-serif; }
.deals__title { font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 800; color: #a83a32; margin-bottom: 2px; text-transform: uppercase; letter-spacing: 0.02em; }
.deals__desc { font-size: 12px; color: rgba(42,31,23,0.6); font-family: 'Montserrat', sans-serif; }
.deals__countdown { display: flex; align-items: center; gap: 6px; }
.deals__count-unit { background: #a83a32; color: #fff; border-radius: 10px; padding: 8px 12px; min-width: 52px; text-align: center; }
.deals__count-num { font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 800; line-height: 1; display: block; }
.deals__count-label { font-size: 8px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; display: block; margin-top: 2px; opacity: 0.8; font-family: 'Montserrat', sans-serif; }
.deals__count-sep { font-size: 18px; font-weight: 800; color: #a83a32; }
.deals__track { display: flex; overflow-x: auto; gap: 16px; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.deals__track::-webkit-scrollbar { display: none; }
.deals__card { min-width: 220px; scroll-snap-align: start; border-radius: 12px; overflow: hidden; background: #ffffff; flex-shrink: 0; position: relative; }
.deals__card-image { position: relative; aspect-ratio: 1/1; overflow: hidden; background: #eeeeea; }
.deals__card-image img { width: 100%; height: 100%; object-fit: cover; }
.deals__badge { position: absolute; top: 10px; left: 10px; background: #a83a32; color: #fff; font-size: 10px; font-weight: 800; padding: 4px 10px; border-radius: 9999px; font-family: 'Montserrat', sans-serif; }
.deals__card-wishlist { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,250,241,0.9); border: 1px solid rgba(104,76,46,0.16); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2; }
.deals__card-wishlist svg { width: 16px; height: 16px; stroke: #3a2818; fill: none; }
.deals__card-info { padding: 12px; }
.deals__card-vendor { font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(42,31,23,0.6); margin-bottom: 4px; font-family: 'Montserrat', sans-serif; }
.deals__card-title { font-size: 13px; font-weight: 600; margin-bottom: 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-family: 'Montserrat', sans-serif; color: #2a1f17; }
.deals__card-price { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.deals__price-current { font-size: 15px; font-weight: 800; color: #2a1f17; font-family: 'Montserrat', sans-serif; }
.deals__price-compare { font-size: 12px; color: rgba(42,31,23,0.4); text-decoration: line-through; font-family: 'Montserrat', sans-serif; }
.deals__add-btn { width: calc(100% - 24px); margin: 0 12px 12px; padding: 10px; border-radius: 8px; background: #a83a32; color: #fff; font-size: 12px; font-weight: 700; font-family: 'Montserrat', sans-serif; text-transform: uppercase; letter-spacing: 0.06em; display: flex; align-items: center; justify-content: center; gap: 6px; transition: background 0.2s; cursor: pointer; border: none; }
.deals__add-btn:hover { background: #7f2824; }

/* ===== SHOP BY BRAND ===== */
.shop-by-brand { background: #eeeeea; padding: 32px 0; border-top: 1px solid rgba(74,61,43,0.08); border-bottom: 1px solid rgba(74,61,43,0.08); }
.shop-by-brand__title { font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #2a1f17; text-align: center; margin-bottom: 24px; }
.shop-by-brand__track-wrap { overflow: hidden; position: relative; }
.shop-by-brand__track-wrap::before, .shop-by-brand__track-wrap::after { content: ''; position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2; pointer-events: none; }
.shop-by-brand__track-wrap::before { left: 0; background: linear-gradient(to right, #eeeeea, transparent); }
.shop-by-brand__track-wrap::after { right: 0; background: linear-gradient(to left, #eeeeea, transparent); }
.shop-by-brand__track { display: flex; width: max-content; animation: marquee 30s linear infinite; }
.shop-by-brand__track:hover { animation-play-state: paused; }
.shop-by-brand__group { display: flex; align-items: center; gap: 40px; padding-right: 40px; flex-shrink: 0; }
.shop-by-brand__item { display: inline-flex; align-items: center; justify-content: center; min-width: 120px; height: 64px; opacity: 0.55; transition: opacity 0.3s; color: #3a2818; }
.shop-by-brand__item:hover { opacity: 1; }
.shop-by-brand__item img { height: 40px; width: auto; object-fit: contain; filter: grayscale(1); transition: filter 0.3s; }
.shop-by-brand__item:hover img { filter: grayscale(0); }
.shop-by-brand__name { font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #3a2818; white-space: nowrap; }

/* ===== COLLECTIONS GRID ===== */
.collections-grid { padding: 32px 0; background: #eeeeea; }
@media (min-width: 768px) { .collections-grid { padding: 48px 0; } }
.collections-grid__grid { display: flex; overflow-x: auto; gap: 16px; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.collections-grid__grid::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .collections-grid__grid { display: grid; grid-template-columns: repeat(3, 1fr); overflow: visible; } }
.collections-grid__item { position: relative; border-radius: 12px; overflow: hidden; min-width: 200px; aspect-ratio: 3/4; scroll-snap-align: start; flex-shrink: 0; }
@media (min-width: 768px) { .collections-grid__item { min-width: 0; } }
.collections-grid__image img { width: 100%; height: 100%; object-fit: cover; }
.collections-grid__placeholder { width: 100%; height: 100%; background: #e8e8e3; }
.collections-grid__overlay { position: absolute; bottom: 0; left: 0; right: 0; height: 80px; background: linear-gradient(to top, rgba(238,238,234,0.96) 0%, transparent 100%); display: flex; align-items: flex-end; padding: 12px; }
.collections-grid__label { font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 700; color: #2a1f17; }

/* ===== FOOTER — #4a3d2b bg, white text, social icons white ===== */
.footer { background: #4a3d2b; border-top: none; padding: 56px 0 32px; margin-top: 40px; }
.footer__grid { display: grid; grid-template-columns: 1fr; gap: 40px; margin-bottom: 48px; }
@media (min-width: 768px) { .footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .footer__grid { grid-template-columns: 1.6fr 1fr 1fr; } }
.footer__logo { height: 56px; width: auto; filter: brightness(0) invert(1); opacity: 0.9; }
.footer__desc { font-size: 12px; font-family: 'Montserrat', sans-serif; color: rgba(255,255,255,0.7); margin-top: 12px; max-width: 200px; line-height: 1.5; }
.footer__socials { display: flex; align-items: center; gap: 8px; margin-top: 16px; }
.footer__socials a { color: #fff; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.15); transition: background 0.2s; }
.footer__socials a:hover { background: rgba(255,255,255,0.25); }
.footer__socials a svg { fill: #fff; stroke: none; width: 15px; height: 15px; }
.footer__heading { font-family: 'Montserrat', sans-serif; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.2em; color: rgba(255,255,255,0.9); margin-bottom: 16px; }
.footer__links ul { display: flex; flex-direction: column; gap: 10px; }
.footer__links a { font-size: 14px; font-family: 'Montserrat', sans-serif; color: rgba(255,255,255,0.65); transition: color 0.2s; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.footer__links a:hover { color: #fff; }
.footer__bottom { border-top: 1px solid rgba(255,255,255,0.15); padding-top: 16px; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.footer__copyright { font-size: 12px; font-family: 'Montserrat', sans-serif; color: rgba(255,255,255,0.4); }
.footer__credit { font-size: 12px; font-family: 'Montserrat', sans-serif; color: rgba(255,255,255,0.4); }
.footer__credit a { color: rgba(255,255,255,0.7); background: transparent !important; }

/* ===== MOBILE BOTTOM NAV — #2a1f17 espresso ===== */
.bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 200; background: #2a1f17; border-top: none; box-shadow: none; padding: 6px 0 max(6px, env(safe-area-inset-bottom)); display: flex; align-items: center; justify-content: space-around; }
@media (min-width: 768px) { .bottom-nav { display: none; } }
.bottom-nav__item { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 12px; color: rgba(238,238,234,0.7); font-size: 10px; font-weight: 500; font-family: 'Montserrat', sans-serif; transition: all 0.2s; }
.bottom-nav__item.is-active { color: #eeeeea; background: rgba(255,255,255,0.14); font-weight: 600; }
.bottom-nav__item svg { width: 22px; height: 22px; stroke: currentColor; fill: transparent; }

/* ===== MOBILE DRAWER — white panel ===== */
.drawer-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.5); backdrop-filter: blur(4px); z-index: 300; opacity: 0; pointer-events: none; transition: opacity 0.3s; }
.drawer-backdrop.is-open { opacity: 1; pointer-events: auto; }
.drawer-menu { position: fixed; top: 0; left: 0; width: 300px; max-width: 85%; bottom: 65px; z-index: 400; background: #ffffff; transform: translateX(-100%); transition: transform 0.3s ease-in-out; display: flex; flex-direction: column; color: #2a1f17; }
.drawer-menu.is-open { transform: translateX(0); }
@media (min-width: 768px) { .drawer-menu, .drawer-backdrop { display: none; } }
.drawer-menu__header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid rgba(74,61,43,0.1); background: #eeeeea; }
.drawer-menu__logo { height: 44px; width: auto; filter: none; }
.drawer-menu__close { width: 36px; height: 36px; border-radius: 50%; background: rgba(74,61,43,0.1); color: #2a1f17; display: flex; align-items: center; justify-content: center; border: 0; cursor: pointer; }
.drawer-menu__close svg { stroke: #2a1f17; fill: none; width: 16px; height: 16px; }
.drawer-menu__body { flex: 1; overflow-y: auto; padding: 8px 0; }
.drawer-menu__home-link, .drawer-menu__btn { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 16px 20px; font-size: 15px; font-weight: 600; color: #2a1f17; border-bottom: 1px solid rgba(74,61,43,0.1); transition: background 0.2s; background: transparent; cursor: pointer; font-family: 'Montserrat', sans-serif; border-left: 0; border-right: 0; border-top: 0; }
.drawer-menu__btn:hover, .drawer-menu__home-link:hover { background: #ffffff; }
.drawer-menu__btn[data-open="true"] { background: #eeeeea; }
.drawer-menu__btn > span { display: flex; align-items: center; gap: 10px; }
.drawer-menu__btn svg { stroke: rgba(42,31,23,0.5); fill: none; width: 16px; height: 16px; }
.drawer-menu__item-icon { display: inline-flex; color: #000; }
.drawer-menu__item-icon svg { width: 18px; height: 18px; fill: #000; stroke: none; }
.drawer-menu__submenu { display: none; background: #eeeeea; padding-bottom: 4px; }
.drawer-menu__item.is-open .drawer-menu__submenu { display: block; }
.drawer-menu__sublink { display: flex; align-items: center; gap: 8px; padding: 12px 32px; font-size: 13px; font-weight: 500; color: #2a1f17; transition: color 0.2s; font-family: 'Montserrat', sans-serif; }
.drawer-menu__sublink:hover { color: #4a3d2b; }
.drawer-menu__dot { width: 4px; height: 4px; border-radius: 50%; background: rgba(42,31,23,0.55); flex-shrink: 0; }
.drawer-menu__footer { flex-shrink: 0; padding: 12px 20px 16px; border-top: 1px solid rgba(74,61,43,0.1); background: #ffffff; display: flex; gap: 24px; }
.drawer-menu__socials-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(42,31,23,0.55); margin: 0 0 6px 0; font-family: 'Montserrat', sans-serif; }
.drawer-menu__socials { display: flex; align-items: center; gap: 10px; }
.drawer-menu__socials a { display: inline-flex; color: #000; transition: transform 0.2s; }
.drawer-menu__socials a:hover { transform: scale(1.1); }
.drawer-menu__socials a svg { fill: #000; stroke: none; width: 22px; height: 22px; }
.drawer-menu__socials-divider { width: 1px; background: rgba(74,61,43,0.1); align-self: stretch; }

/* ===== PAGES ===== */
.collection-page, .product-page, .cart-page, .page-content { padding: 32px 0 80px; background: #eeeeea; }
.collection-page__title, .product-page__title, .cart-page__title, .page-content__title { font-family: 'Montserrat', sans-serif; font-size: 28px; font-weight: 800; color: #2a1f17; text-transform: uppercase; margin-bottom: 16px; }
.product-page__grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 768px) { .product-page__grid { grid-template-columns: 1fr 1fr; gap: 48px; } }
.product-page__main-image { border-radius: 12px; overflow: hidden; background: #eeeeea; aspect-ratio: 1/1; }
.product-page__main-image img { width: 100%; height: 100%; object-fit: cover; }
.product-page__thumbs { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; }
.product-page__thumb { width: 64px; height: 64px; border-radius: 8px; overflow: hidden; border: 2px solid transparent; opacity: 0.6; transition: all 0.2s; cursor: pointer; flex-shrink: 0; }
.product-page__thumb.is-active { border-color: #4a3d2b; opacity: 1; }
.product-page__thumb img { width: 100%; height: 100%; object-fit: cover; }
.product-page__price { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.product-page__price-current { font-size: 24px; font-weight: 800; color: #2a1f17; font-family: 'Montserrat', sans-serif; }
.product-page__price-compare { font-size: 16px; color: rgba(42,31,23,0.4); text-decoration: line-through; }
.product-page__option-btn { padding: 8px 16px; border: 1px solid rgba(74,61,43,0.2); border-radius: 8px; font-size: 13px; font-family: 'Montserrat', sans-serif; cursor: pointer; background: #fff; transition: all 0.2s; }
.product-page__option-btn.is-active { background: #4a3d2b; color: #fff; border-color: #4a3d2b; }
.product-page__qty-wrap { display: flex; align-items: center; border: 1px solid rgba(74,61,43,0.2); border-radius: 8px; width: fit-content; }
.product-page__qty-btn { width: 40px; height: 40px; font-size: 18px; display: flex; align-items: center; justify-content: center; }
.product-page__qty-input { width: 48px; height: 40px; text-align: center; border: none; font-size: 14px; font-weight: 600; background: transparent; font-family: 'Montserrat', sans-serif; }
.cart-page__grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 768px) { .cart-page__grid { grid-template-columns: 2fr 1fr; } }
.cart-page__summary { background: #fff; border-radius: 12px; padding: 24px; border: 1px solid rgba(74,61,43,0.1); }
.pagination { display: flex; justify-content: center; align-items: center; gap: 4px; padding: 40px 0 20px; flex-wrap: wrap; }
.pagination a, .pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; border-radius: 8px; font-size: 13px; font-weight: 600; color: #2a1f17; border: 1px solid rgba(74,61,43,0.15); background: #fff; transition: all 0.2s; font-family: 'Montserrat', sans-serif; }
.pagination a:hover, .pagination .page.current { background: #4a3d2b; color: #fff; border-color: #4a3d2b; }

/* ===== ANIMATIONS ===== */
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.5;transform:scale(1.2);} }
@keyframes newPulse { 0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.5;transform:scale(1.2);} }
@keyframes marquee { from{transform:translateX(0);}to{transform:translateX(-50%);} }

/* ===== SHOPIFY OVERRIDE (force our styles over Shopify defaults) ===== */
body { font-family: 'Montserrat', sans-serif !important; background: #eeeeea !important; color: #2a1f17 !important; }
@media (max-width: 767.98px) { body { padding-bottom: 65px !important; } }
.header { background: #eeeeea !important; box-shadow: none !important; border-bottom: none !important; }
.footer { background: #4a3d2b !important; }
.announcement-bar { background: #4a3d2b !important; }
.bottom-nav { background: #2a1f17 !important; border-top: none !important; box-shadow: none !important; }
.deals__inner { background: #transparent !important; }
.product-card { background: #ffffff !important; border: none !important; }
.section-tabs__tab.is-active { background: #4a3d2b !important; color: #fff !important; border-color: #4a3d2b !important; }
section, main { background-color: #eeeeea !important; }

/* ===== PRODUCT CARD FIXES ===== */
.product-card { background: #ffffff !important; border-radius: 12px !important; overflow: hidden !important; }
.product-card__image { aspect-ratio: 1/1 !important; background: #ffffff !important; }
.product-card__info { background: #eeeeea !important; padding: 10px 12px 12px !important; }
.product-card__rating svg { fill: #dddcd7 !important; }
.product-card__rating svg.filled { fill: #4a3d2b !important; }
.product-card__tag-badge { background: #4a3d2b !important; color: #ffffff !important; }
.product-card__wishlist { background: rgba(255,255,255,0.9) !important; border: 1px solid rgba(104,76,46,0.12) !important; }

/* ===== PRODUCT GRID — 2 columns on mobile ===== */
.product-grid--slider .product-card { min-width: clamp(140px, 42vw, 200px) !important; }
@media (min-width: 768px) { .product-grid--slider .product-card { min-width: 220px !important; } }
.product-grid--slider { gap: 12px !important; }

/* ===== PRODUCT CARD HARD FIXES ===== */
.product-card,
.product-card * { box-sizing: border-box !important; }
.product-card { background: #ffffff !important; border-radius: 12px !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; border: none !important; box-shadow: none !important; }
.product-card:hover { box-shadow: 0 18px 34px rgba(74,61,43,0.22) !important; }
.product-card__link { display: block !important; margin: 0 !important; padding: 0 !important; }
.product-card__image { aspect-ratio: 1/1 !important; background: #ffffff !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; }
.product-card__info { background: #eeeeea !important; padding: 10px 12px 12px !important; margin: 0 !important; border: none !important; }

/* Stars — #dddcd7 بني فاتح */
.product-card__rating { display: flex !important; align-items: center !important; gap: 2px !important; margin-bottom: 6px !important; }
.product-card__rating svg { width: 12px !important; height: 12px !important; fill: #dddcd7 !important; stroke: none !important; }
.product-card__rating svg.filled { fill: #4a3d2b !important; }

/* Card size — smaller on mobile, 2 per row */
.product-grid--slider { gap: 10px !important; }
.product-grid--slider .product-card { min-width: 155px !important; max-width: 200px !important; }
@media (min-width: 768px) {
  .product-grid--slider .product-card { min-width: 210px !important; max-width: 260px !important; }
}

/* Remove any white space below card */
.product-card > *:last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; }
.product-card::after { display: none !important; }

/* ===== DRAWER LOGO — black, not white ===== */
.drawer-menu__logo { height: 44px !important; width: auto !important; filter: brightness(0) !important; opacity: 0.9 !important; }

/* ===== DRAWER MENU ITEMS — font size -2pt ===== */
.drawer-menu__home-link, .drawer-menu__btn { font-size: 13px !important; font-weight: 600 !important; padding: 13px 20px !important; }

/* ===== PRODUCT CARD BORDER (stroke) ===== */
.product-card { border: 1px solid rgba(74,61,43,0.12) !important; }
.product-card:hover { border-color: rgba(74,61,43,0.25) !important; }

/* ===== STROKE DEEPER ===== */
.product-card { border: 1px solid rgba(74,61,43,0.22) !important; }
.product-card:hover { border-color: rgba(74,61,43,0.4) !important; }

/* ===== MARQUEE LIGHTER BG ===== */
.info-ticker { background: #f8f8f5 !important; }
.shop-by-brand { background: #f8f8f5 !important; }
.shop-by-brand__track-wrap::before { background: linear-gradient(to right, #f8f8f5, transparent) !important; }
.shop-by-brand__track-wrap::after { background: linear-gradient(to left, #f8f8f5, transparent) !important; }

/* ===== BRAND NAMES STYLED (when no image) ===== */
.shop-by-brand__name {
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #3a2818;
  white-space: nowrap;
  opacity: 0.6;
  transition: opacity 0.3s;
}
.shop-by-brand__item:hover .shop-by-brand__name { opacity: 1; }

/* ===== CATEGORY IMAGES ===== */
.categories__image-wrap img { width: 100% !important; height: 100% !important; object-fit: cover !important; }

/* ===== SECTION TABS — exact match from original site ===== */
.section-tabs {
  display: inline-flex !important;
  align-items: center !important;
  border: 1px solid #d9d9d3 !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  padding: 0 !important;
  gap: 0 !important;
  flex-shrink: 0;
}
.section-tabs__tab {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111111 !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 8px 18px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  font-family: 'Montserrat', sans-serif !important;
  cursor: pointer !important;
  transition: background-color 0.22s ease, color 0.22s ease !important;
  margin: 0 !important;
}
.section-tabs__tab:hover:not(.is-active) {
  background: #4a3d2b !important;
  color: #ffffff !important;
}
.section-tabs__tab.is-active {
  background: #4a3d2b !important;
  background-color: #4a3d2b !important;
  color: #ffffff !important;
  border: 0 !important;
}
@media (max-width: 640px) {
  .section-tabs__tab { padding: 7px 12px !important; font-size: 11px !important; }
}

/* ===== SECTION TABS — exact visual from screenshots ===== */
.section-tabs {
  display: inline-flex !important;
  align-items: stretch !important;
  border: 1.5px solid #d9d9d3 !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  padding: 0 !important;
  gap: 0 !important;
  height: 40px !important;
}
.section-tabs__tab {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #ffffff !important;
  color: #2a1f17 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 20px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-family: 'Montserrat', sans-serif !important;
  cursor: pointer !important;
  transition: background-color 0.22s ease, color 0.22s ease !important;
  margin: 0 !important;
  white-space: nowrap !important;
  height: 100% !important;
}
.section-tabs__tab.is-active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-radius: 999px !important;
}
.section-tabs__tab:hover:not(.is-active) {
  background: rgba(74,61,43,0.06) !important;
  color: #2a1f17 !important;
}
@media (max-width: 640px) {
  .section-tabs { height: 36px !important; }
  .section-tabs__tab { padding: 0 14px !important; font-size: 11px !important; }
}

/* ===== DRAWER ICONS ALIGNMENT ===== */
.drawer-menu__btn > span,
.drawer-menu__home-link > span { display: flex !important; align-items: center !important; gap: 10px !important; }
.drawer-menu__btn svg, .drawer-menu__home-link svg { flex-shrink: 0; color: #2a1f17; stroke: #2a1f17; }

/* ===== DRAWER PULSE DOT (New Arrivals) ===== */
.drawer-pulse {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2a1f17;
  display: inline-block;
  flex-shrink: 0;
  position: relative;
  animation: drawerPulse 1.4s ease-in-out infinite;
}
@keyframes drawerPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.3; transform: scale(1.4); }
}

/* ===== DRAWER ICONS ===== */
.drawer-menu__btn > span svg,
.drawer-menu__home-link > span svg { flex-shrink: 0; color: #2a1f17; fill: #2a1f17; }

/* ===== SECTION HEADER — title left, View All right (no tabs) ===== */
.section-header { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; margin-bottom: 16px !important; gap: 12px !important; flex-wrap: nowrap !important; }
.section-header__text { flex: 1 !important; min-width: 0 !important; }
.section-header__title { font-family: 'Montserrat', sans-serif !important; font-size: clamp(16px, 4vw, 22px) !important; color: #2a1f17 !important; font-weight: 800 !important; text-transform: uppercase !important; margin: 0 !important; white-space: nowrap !important; }
.section-header__desc { font-size: 12px !important; color: rgba(42,31,23,0.58) !important; margin-top: 2px !important; font-family: 'Montserrat', sans-serif !important; font-weight: 400 !important; }

/* View All link — right side, small, brown, with arrow */
.section-header__link { font-size: 13px !important; font-weight: 600 !important; color: #2a1f17 !important; white-space: nowrap !important; font-family: 'Montserrat', sans-serif !important; align-self: flex-start !important; margin-top: 3px !important; flex-shrink: 0 !important; }
.section-header__link::after { content: ' →' !important; }
.section-header__link:hover { color: #4a3d2b !important; }

/* ===== TABS — exact match: pill container, active fills pill ===== */
.section-tabs { display: inline-flex !important; align-items: stretch !important; border: 1px solid #d9d9d3 !important; border-radius: 999px !important; overflow: hidden !important; background: #ffffff !important; padding: 0 !important; gap: 0 !important; height: 36px !important; flex-shrink: 0 !important; align-self: flex-start !important; }
.section-tabs__tab { display: inline-flex !important; align-items: center !important; justify-content: center !important; background: #ffffff !important; color: #2a1f17 !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 18px !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; font-family: 'Montserrat', sans-serif !important; cursor: pointer !important; transition: background-color 0.22s ease, color 0.22s ease !important; margin: 0 !important; white-space: nowrap !important; height: 100% !important; }
.section-tabs__tab.is-active { background: #4a3d2b !important; color: #ffffff !important; border-radius: 999px !important; }
.section-tabs__tab:hover:not(.is-active) { background: rgba(74,61,43,0.06) !important; }

/* ===== VIEW ALL BUTTON (below section) — outlined pill ===== */
.section-footer { display: flex !important; justify-content: center !important; margin-top: 20px !important; }
.section-footer__btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; background: transparent !important; color: #4a3d2b !important; border: 1.5px solid #4a3d2b !important; border-radius: 999px !important; padding: 10px 32px !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; font-family: 'Montserrat', sans-serif !important; cursor: pointer !important; transition: all 0.2s !important; }
.section-footer__btn:hover { background: #4a3d2b !important; color: #ffffff !important; }

/* ===== PRODUCT BADGES ===== */
.product-card__badge { position: absolute !important; top: 10px !important; left: 10px !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; padding: 4px 10px !important; font-family: 'Montserrat', sans-serif !important; z-index: 2 !important; line-height: 1 !important; }
.product-card__badge--new, .product-card__badge--top { background: #4a3d2b !important; color: #ffffff !important; border-radius: 6px !important; }
.product-card__badge--sale { background: #a83a32 !important; color: #ffffff !important; border-radius: 999px !important; }
.product-card__badge--soldout { background: #2a1f17 !important; color: #ffffff !important; border-radius: 6px !important; opacity: 0.9 !important; }
.product-card__image--soldout img { opacity: 0.5 !important; }

/* ===== VARIANT BUTTONS ===== */
.product-page__option-btn { padding: 10px 18px !important; border: 1.5px solid rgba(74,61,43,0.2) !important; border-radius: 8px !important; font-size: 13px !important; font-weight: 600 !important; font-family: 'Montserrat', sans-serif !important; cursor: pointer !important; background: #fff !important; color: #2a1f17 !important; transition: all 0.2s !important; position: relative !important; min-width: 44px !important; text-align: center !important; }
.product-page__option-btn:hover:not(.is-active):not(.is-unavailable) { border-color: #4a3d2b !important; }
.product-page__option-btn.is-active { background: #4a3d2b !important; color: #fff !important; border-color: #4a3d2b !important; }

/* Unavailable size — faded + strikethrough line */
.product-page__option-btn.is-unavailable { opacity: 0.4 !important; cursor: not-allowed !important; color: rgba(42,31,23,0.4) !important; border-color: rgba(74,61,43,0.1) !important; background: #f5f5f3 !important; }
.product-page__option-btn.is-unavailable::after { content: '' !important; position: absolute !important; top: 50% !important; left: 4px !important; right: 4px !important; height: 1.5px !important; background: rgba(42,31,23,0.5) !important; transform: rotate(-12deg) !important; }

/* Option label */
.product-page__option-label { font-size: 13px !important; font-weight: 700 !important; margin-bottom: 10px !important; display: block !important; font-family: 'Montserrat', sans-serif !important; color: #2a1f17 !important; }
.product-page__option-value { font-weight: 500 !important; color: rgba(42,31,23,0.6) !important; margin-left: 4px !important; }
.product-page__option-values { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }

/* ===== PRODUCT PAGE SLIDER ===== */
.product-page__slider { position: relative; border-radius: 12px; overflow: hidden; background: #fff; }
.product-page__slider-track { display: flex; transition: transform 0.4s ease; touch-action: pan-y; }
.product-page__slider-slide { min-width: 100%; aspect-ratio: 1/1; flex-shrink: 0; }
.product-page__slider-slide img { width: 100%; height: 100%; object-fit: cover; }
.product-page__slider-prev, .product-page__slider-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.9); border: 1px solid rgba(74,61,43,0.15); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.product-page__slider-prev { left: 10px; }
.product-page__slider-next { right: 10px; }
.product-page__slider-prev:hover, .product-page__slider-next:hover { background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.product-page__slider-prev svg, .product-page__slider-next svg { width: 16px; height: 16px; stroke: #2a1f17; }
.product-page__slider-dots { position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; z-index: 3; }
.product-page__slider-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(42,31,23,0.25); border: none; cursor: pointer; transition: all 0.3s; }
.product-page__slider-dot.is-active { background: #4a3d2b; width: 20px; border-radius: 4px; }
@media (min-width: 768px) {
  .product-page__slider-dots { display: none; }
  .product-page__slider-prev, .product-page__slider-next { display: none; }
}
.product-page__thumbs { display: none; }
@media (min-width: 768px) { .product-page__thumbs { display: flex !important; gap: 8px; margin-top: 12px; overflow-x: auto; } }

/* ===== BUTTONS FINAL (pill shape, bold uppercase, smooth hover) ===== */
.btn, .btn--primary, .btn--outline, .section-footer__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  border-radius: 9999px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 12px 28px !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  border: 1.5px solid transparent !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
.btn--primary { background: #4a3d2b !important; color: #ffffff !important; border-color: #4a3d2b !important; }
.btn--primary:hover { background: #6a593f !important; border-color: #6a593f !important; }
.btn--outline { background: transparent !important; color: #4a3d2b !important; border-color: #4a3d2b !important; }
.btn--outline:hover { background: #4a3d2b !important; color: #ffffff !important; }
.section-footer__btn { background: transparent !important; color: #4a3d2b !important; border-color: #4a3d2b !important; padding: 12px 32px !important; }
.section-footer__btn:hover { background: #4a3d2b !important; color: #ffffff !important; }
.btn--full { width: 100% !important; }

/* Add to cart on product page */
.product-page__add-btn { width: 100% !important; padding: 16px 32px !important; font-size: 13px !important; background: #4a3d2b !important; color: #ffffff !important; border: none !important; border-radius: 9999px !important; font-weight: 800 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; font-family: 'Montserrat', sans-serif !important; cursor: pointer !important; transition: background 0.25s !important; }
.product-page__add-btn:hover:not(:disabled) { background: #6a593f !important; }
.product-page__add-btn:disabled { opacity: 0.5 !important; cursor: not-allowed !important; }

/* Arrow after section link */
.section-header__link { color: #4a3d2b !important; font-weight: 700 !important; font-size: 12px !important; letter-spacing: 0.05em !important; text-transform: uppercase !important; }

/* ===== FINAL SECTION TABS — matches level-egypt.com exactly ===== */
.section-tabs {
  display: inline-flex !important;
  align-items: stretch !important;
  background: #ffffff !important;
  border: 1.5px solid #d9d9d3 !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  padding: 0 !important;
  gap: 0 !important;
  height: 40px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}
.section-tabs__tab {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  color: #2a1f17 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 24px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-family: 'Montserrat', sans-serif !important;
  cursor: pointer !important;
  transition: background 0.25s ease, color 0.25s ease !important;
  margin: 0 !important;
  white-space: nowrap !important;
  height: 100% !important;
  min-width: 80px !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.section-tabs__tab.is-active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
}
.section-tabs__tab:not(.is-active):hover {
  color: #4a3d2b !important;
}
@media (max-width: 640px) {
  .section-tabs { height: 36px !important; }
  .section-tabs__tab { padding: 0 18px !important; font-size: 12px !important; min-width: 70px !important; }
}

/* Ensure tab panels only show active one */
.product-grid--slider.section-tabs__panel { display: none !important; }
.product-grid--slider.section-tabs__panel.is-active { display: flex !important; }

/* ===== HEADER BUTTONS VISIBILITY (fix drawer open) ===== */
.header__menu-btn { display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; background: transparent !important; border: 0 !important; padding: 4px !important; color: #2a1f17 !important; }
.header__menu-btn svg { width: 24px !important; height: 24px !important; stroke: #2a1f17 !important; fill: none !important; stroke-width: 2 !important; }
@media (min-width: 768px) { .header__menu-btn { display: none !important; } }

.header__search-btn { display: none !important; }
@media (min-width: 768px) { .header__search-btn { display: flex !important; } }

.header__search-btn-mobile { display: flex !important; }
@media (min-width: 768px) { .header__search-btn-mobile { display: none !important; } }

/* Ensure drawer JS works — button must be clickable */
[data-drawer-open] { cursor: pointer !important; z-index: 10 !important; position: relative !important; }

/* ============ FINAL TABS — absolute priority, no overrides ============ */
div.section-tabs,
section .section-tabs {
  display: inline-flex !important;
  align-items: stretch !important;
  background: #ffffff !important;
  border: 1.5px solid #d9d9d3 !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  padding: 0 !important;
  height: 40px !important;
  flex-shrink: 0 !important;
  gap: 0 !important;
  margin: 0 !important;
}
div.section-tabs button.section-tabs__tab,
section .section-tabs button.section-tabs__tab,
.section-tabs > button.section-tabs__tab {
  all: unset !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 0 24px !important;
  background: transparent !important;
  color: #2a1f17 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  border-radius: 0 !important;
  border: none !important;
  transition: background 0.25s ease, color 0.25s ease !important;
  min-width: 72px !important;
}
div.section-tabs button.section-tabs__tab.is-active,
section .section-tabs button.section-tabs__tab.is-active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
}
@media (max-width: 640px) {
  div.section-tabs, section .section-tabs { height: 36px !important; }
  div.section-tabs button.section-tabs__tab,
  section .section-tabs button.section-tabs__tab { padding: 0 18px !important; font-size: 12px !important; min-width: 64px !important; }
}

/* Tab panels */
.product-grid.section-tabs__panel,
.section-tabs__panel { display: none !important; }
.product-grid.section-tabs__panel.is-active,
.section-tabs__panel.is-active { display: flex !important; }

/* ===== TABS FINAL — active fills left half as half-pill ===== */
div.section-tabs,
section .section-tabs,
.section-tabs {
  display: inline-flex !important;
  align-items: stretch !important;
  background: #ffffff !important;
  border: 1.5px solid #d9d9d3 !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  padding: 0 !important;
  height: 40px !important;
  flex-shrink: 0 !important;
  gap: 0 !important;
  position: relative !important;
}
.section-tabs button.section-tabs__tab,
div.section-tabs button.section-tabs__tab {
  all: unset !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 0 24px !important;
  background: transparent !important;
  color: #2a1f17 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  border-radius: 0 !important;
  border: none !important;
  transition: background 0.3s ease, color 0.3s ease !important;
  min-width: 80px !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Active tab: fills brown, rounded-full so it becomes a half-pill when at the edge */
.section-tabs button.section-tabs__tab.is-active,
div.section-tabs button.section-tabs__tab.is-active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
}

/* Hover for inactive */
.section-tabs button.section-tabs__tab:not(.is-active):hover {
  color: #4a3d2b !important;
}

@media (max-width: 640px) {
  .section-tabs { height: 36px !important; }
  .section-tabs button.section-tabs__tab { padding: 0 18px !important; font-size: 12px !important; min-width: 68px !important; }
}

/* Tab panels — only active shows */
.section-tabs__panel,
.product-grid.section-tabs__panel { display: none !important; }
.section-tabs__panel.is-active,
.product-grid.section-tabs__panel.is-active { display: flex !important; }

/* ===== STOCK STATUS ===== */
.product-page__stock { margin: 12px 0 16px; font-size: 13px; font-family: 'Montserrat', sans-serif; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; display: flex; align-items: center; gap: 8px; }
.product-page__stock--in { color: #1aac59; display: inline-flex; align-items: center; gap: 8px; }
.product-page__stock--out { color: #a83a32; display: inline-flex; align-items: center; gap: 8px; }
.stock-dot { width: 8px; height: 8px; border-radius: 50%; background: #1aac59; box-shadow: 0 0 0 4px rgba(26,172,89,0.2); display: inline-block; animation: stockPulse 2s ease-in-out infinite; }
.stock-dot--out { background: #a83a32; box-shadow: 0 0 0 4px rgba(168,58,50,0.2); }
@keyframes stockPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

/* ===== ADD TO CART — big pill button ===== */
.product-page__add-btn {
  width: 100% !important;
  padding: 16px 32px !important;
  font-size: 13px !important;
  background: #4a3d2b !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 9999px !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  font-family: 'Montserrat', sans-serif !important;
  cursor: pointer !important;
  transition: all 0.25s !important;
  box-shadow: 0 4px 12px rgba(74,61,43,0.18) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
.product-page__add-btn:hover:not(:disabled):not(.is-sold-out) {
  background: #6a593f !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(74,61,43,0.25) !important;
}
.product-page__add-btn:disabled,
.product-page__add-btn.is-sold-out {
  background: #dddcd7 !important;
  color: #9b9589 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* ===== DESCRIPTION — clean, below add-to-cart ===== */
.product-page__description { margin-top: 32px !important; padding-top: 24px !important; border-top: 1px solid rgba(74,61,43,0.12) !important; }
.product-page__desc-title { font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; font-weight: 800 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: #2a1f17 !important; margin-bottom: 12px !important; }
.product-page__desc-content { font-size: 14px !important; line-height: 1.7 !important; color: rgba(42,31,23,0.75) !important; font-family: 'Montserrat', sans-serif !important; }
.product-page__desc-content p { margin-bottom: 12px !important; }

/* ===== PRODUCT GALLERY (main + thumbs below) ===== */
.product-page__gallery { display: flex !important; flex-direction: column !important; gap: 12px !important; }
.product-page__slider { position: relative !important; border-radius: 12px !important; overflow: hidden !important; background: #fff !important; aspect-ratio: 1/1 !important; }
.product-page__slider-track { display: flex !important; transition: transform 0.4s ease !important; height: 100% !important; touch-action: pan-y !important; }
.product-page__slider-slide { min-width: 100% !important; height: 100% !important; flex-shrink: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #fff !important; }
.product-page__slider-slide img { width: 100% !important; height: 100% !important; object-fit: cover !important; cursor: zoom-in !important; }

/* Arrows */
.product-page__slider-prev, .product-page__slider-next {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 5 !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.92) !important;
  border: 1px solid rgba(74,61,43,0.12) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
  transition: all 0.2s !important;
}
.product-page__slider-prev { left: 12px !important; }
.product-page__slider-next { right: 12px !important; }
.product-page__slider-prev:hover, .product-page__slider-next:hover { background: #fff !important; box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important; }
.product-page__slider-prev svg, .product-page__slider-next svg { width: 18px !important; height: 18px !important; stroke: #2a1f17 !important; fill: none !important; stroke-width: 2 !important; }

/* Thumbnails below */
.product-page__thumbs { display: flex !important; gap: 8px !important; overflow-x: auto !important; padding: 0 !important; scrollbar-width: none !important; }
.product-page__thumbs::-webkit-scrollbar { display: none; }
.product-page__thumb { width: 70px !important; height: 70px !important; min-width: 70px !important; border-radius: 8px !important; overflow: hidden !important; border: 2px solid rgba(74,61,43,0.12) !important; opacity: 0.65 !important; transition: all 0.2s !important; cursor: pointer !important; background: #fff !important; padding: 0 !important; flex-shrink: 0 !important; }
.product-page__thumb.is-active { border-color: #4a3d2b !important; opacity: 1 !important; }
.product-page__thumb:hover { opacity: 0.9 !important; }
.product-page__thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; }

/* ===== ZOOM LIGHTBOX ===== */
.product-zoom {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,0.92) !important;
  z-index: 9999 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0;
  transition: opacity 0.3s ease !important;
}
.product-zoom.is-open { display: flex !important; opacity: 1; }
.product-zoom__track { display: flex; width: 100%; height: 100%; transition: transform 0.4s ease; touch-action: pan-y; }
.product-zoom__slide { min-width: 100%; height: 100%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; padding: 40px; }
.product-zoom__slide img { max-width: 100%; max-height: 100%; object-fit: contain; }
.product-zoom__close {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  z-index: 10 !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.12) !important;
  border: none !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}
.product-zoom__close:hover { background: rgba(255,255,255,0.22) !important; }
.product-zoom__close svg { width: 24px !important; height: 24px !important; stroke: #fff !important; fill: none !important; stroke-width: 2 !important; }
.product-zoom__prev, .product-zoom__next {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 10 !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.12) !important;
  border: none !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}
.product-zoom__prev:hover, .product-zoom__next:hover { background: rgba(255,255,255,0.22) !important; }
.product-zoom__prev { left: 20px !important; }
.product-zoom__next { right: 20px !important; }
.product-zoom__prev svg, .product-zoom__next svg { width: 26px !important; height: 26px !important; stroke: #fff !important; fill: none !important; stroke-width: 2 !important; }
.product-zoom__counter { position: absolute !important; bottom: 20px !important; left: 50%; transform: translateX(-50%); color: #fff !important; font-size: 13px !important; font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; background: rgba(255,255,255,0.12); padding: 6px 14px; border-radius: 9999px; z-index: 10; }
@media (max-width: 640px) {
  .product-zoom__slide { padding: 16px; }
  .product-zoom__prev, .product-zoom__next { width: 40px; height: 40px; }
  .product-zoom__prev { left: 10px !important; }
  .product-zoom__next { right: 10px !important; }
}

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

/* ===== FORCE SQUARE GALLERY ===== */
.product-page__slider,
.product-page__gallery .product-page__slider {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  position: relative !important;
}
.product-page__slider-track,
.product-page__gallery .product-page__slider-track {
  width: 100% !important;
  height: 100% !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
}
.product-page__slider-slide {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  aspect-ratio: 1 / 1 !important;
}
.product-page__slider-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  aspect-ratio: 1 / 1 !important;
}

/* Fallback for browsers without aspect-ratio */
@supports not (aspect-ratio: 1 / 1) {
  .product-page__slider { padding-top: 100% !important; height: 0 !important; }
}

/* ===== ZOOM LIGHTBOX — force square container, image inside ===== */
.product-zoom__slide {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 40px !important;
  width: 100% !important;
  height: 100% !important;
}
.product-zoom__slide img {
  max-width: min(90vw, 90vh) !important;
  max-height: min(90vw, 90vh) !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  background: #fff !important;
}
@media (max-width: 640px) {
  .product-zoom__slide { padding: 20px !important; }
  .product-zoom__slide img { max-width: min(94vw, 94vh) !important; max-height: min(94vw, 94vh) !important; }
}

/* ===== CATEGORIES — full width, darker background ===== */
.categories {
  background: #d9d9d3 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 16px 0 20px !important;
}
@media (min-width: 768px) {
  .categories {
    background: #d9d9d3 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    padding: 20px 0 24px !important;
  }
}
.categories__grid {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
}

/* ===== CATEGORIES CIRCLES — bigger (+10%) ===== */
.categories__image-wrap {
  width: 72px !important;
  height: 72px !important;
}
@media (min-width: 768px) {
  .categories__image-wrap {
    width: 80px !important;
    height: 80px !important;
  }
}
.categories__item { min-width: 90px !important; }

/* ===== STICKY HEADER ON MOBILE ===== */
.header {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important;
  background: #eeeeea !important;
  box-shadow: 0 2px 8px rgba(74,61,43,0.06) !important;
}

/* Announcement bar stays at top, header sticks below it */
.announcement-bar {
  position: relative !important;
  z-index: 99 !important;
}

/* On mobile, make announcement bar sticky too so whole top stays */
@media (max-width: 767.98px) {
  .announcement-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 101 !important;
  }
  .header {
    position: sticky !important;
    top: 36px !important; /* below announcement bar */
    z-index: 100 !important;
  }
}

/* ===== CATEGORIES — more padding so circles breathe ===== */
.categories {
  padding: 32px 0 36px !important;
}
@media (min-width: 768px) {
  .categories {
    padding: 40px 0 44px !important;
  }
}
.categories__grid {
  padding: 0 16px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}
.categories__item {
  padding: 4px 0 !important;
  min-width: 90px !important;
}

/* ===== CATEGORIES FULL WIDTH — no container limit on background ===== */
.categories {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: #d9d9d3 !important;
}

/* Remove any container wrapping that limits width */
.categories .container {
  max-width: 100% !important;
  padding: 0 !important;
}

/* Circles row stays centered and padded */
.categories__grid {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
}

/* ===== FIXED HEADER (works everywhere) ===== */
.announcement-bar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 200 !important;
  width: 100% !important;
}

.header {
  position: fixed !important;
  top: 36px !important; /* below announcement bar */
  left: 0 !important;
  right: 0 !important;
  z-index: 199 !important;
  width: 100% !important;
  background: #eeeeea !important;
  box-shadow: 0 2px 10px rgba(74,61,43,0.08) !important;
}

/* Nav bar on desktop — fixed below header */
@media (min-width: 768px) {
  .nav-bar {
    position: fixed !important;
    top: 108px !important; /* announcement(36) + header(72) */
    left: 0 !important;
    right: 0 !important;
    z-index: 198 !important;
    width: 100% !important;
  }
}

/* Push content down to avoid being hidden behind fixed header */
main, #main-content {
  padding-top: 108px !important; /* announcement + header */
}
@media (min-width: 768px) {
  main, #main-content {
    padding-top: 156px !important; /* announcement + header + nav-bar */
  }
}

/* Override parent overflow that breaks sticky/fixed positioning */
html, body { overflow-x: hidden !important; overflow-y: auto !important; }

/* ============================================================
   FINAL OVERRIDES — latest requested changes
   ============================================================ */

/* ===== 1. HEADER STICKY ONLY (announcement scrolls away) ===== */
.announcement-bar {
  position: relative !important;
  top: auto !important;
  z-index: 100 !important;
}
.header {
  position: sticky !important;
  top: 0 !important;
  z-index: 200 !important;
  background: #eeeeea !important;
  box-shadow: 0 2px 10px rgba(74,61,43,0.08) !important;
}
@media (min-width: 768px) {
  .nav-bar {
    position: sticky !important;
    top: 72px !important;
    z-index: 199 !important;
  }
}
/* Reset main padding */
main, #main-content { padding-top: 0 !important; }

/* ===== 2. DRAWER BLUR REMOVED ===== */
.drawer-backdrop {
  background: rgba(0,0,0,0.4) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ===== 3. MEN = MAN FIGURE, WOMEN = QUEEN CROWN ===== */

/* ===== 4. DRAWER SPACING TIGHT ===== */
.drawer-menu__btn, .drawer-menu__home-link {
  padding: 12px 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
.drawer-menu__btn > span { gap: 12px !important; }
.drawer-menu__btn svg { width: 18px !important; height: 18px !important; }
.drawer-menu__sublink { padding: 9px 28px !important; font-size: 12px !important; }
.drawer-menu__footer { padding: 10px 18px 14px !important; gap: 18px !important; }

/* ===== 5. HERO SLIDER — no arrows, lighter dots, smaller buttons ===== */
.hero-slider__nav { display: none !important; }
.hero-slider__dots {
  bottom: 16px !important;
  gap: 6px !important;
}
.hero-slider__dot {
  width: 7px !important;
  height: 7px !important;
  background: rgba(74,61,43,0.3) !important;
}
.hero-slider__dot.is-active {
  background: rgba(74,61,43,0.9) !important;
  width: 20px !important;
  border-radius: 4px !important;
}

/* Hero buttons smaller + closer together */
.hero-slider__actions { gap: 8px !important; flex-wrap: wrap !important; }
.hero-slider__actions .btn,
[data-testid^="btn-hero-cta"] {
  padding: 10px 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  border-radius: 9999px !important;
}
.hero-slider__content { padding: 32px 24px !important; }

/* ===== 6. CATEGORIES — white bg, border, hover brown, first circle starts from left ===== */
.categories {
  background: #ffffff !important;
  padding: 18px 0 20px !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  width: 100vw !important;
  max-width: 100vw !important;
}
@media (min-width: 768px) {
  .categories { padding: 24px 0 !important; }
}
.categories__grid {
  justify-content: flex-start !important;
  gap: 14px !important;
  padding: 0 16px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
@media (min-width: 768px) {
  .categories__grid {
    justify-content: center !important;
    gap: 24px !important;
  }
}
.categories__image-wrap {
  border: 1.5px solid rgba(74,61,43,0.18) !important;
  transition: border-color 0.25s ease !important;
}
.categories__item:hover .categories__image-wrap {
  border-color: #4a3d2b !important;
  border-width: 2px !important;
}
.categories__label {
  color: #2a1f17 !important;
  font-weight: 500 !important;
}
.categories__item:hover .categories__label { color: #4a3d2b !important; }

/* ===== 7. SECTION TABS — smaller, tabs on right, title on left ===== */
.section-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
}
.section-header__text {
  flex: 1 !important;
  min-width: 0 !important;
  text-align: left !important;
}
.section-header__title { text-align: left !important; }
.section-header__desc { text-align: left !important; }

/* Tabs smaller */
.section-tabs { height: 34px !important; }
.section-tabs__tab {
  padding: 0 16px !important;
  font-size: 11px !important;
  min-width: 60px !important;
}
@media (max-width: 640px) {
  .section-tabs { height: 30px !important; }
  .section-tabs__tab { padding: 0 12px !important; font-size: 10px !important; min-width: 50px !important; }
}

/* ===== 8. VIEW ALL — top right for sections WITHOUT tabs ===== */
.section-header__link {
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 8px 16px !important;
  border: 1.5px solid #4a3d2b !important;
  border-radius: 9999px !important;
  color: #4a3d2b !important;
  background: transparent !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  transition: all 0.2s !important;
  white-space: nowrap !important;
}
.section-header__link:hover { background: #4a3d2b !important; color: #ffffff !important; }
.section-header__link::after { content: none !important; }

/* ===== 9. DEALS — smaller countdown boxes, on right ===== */
.deals__header {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
@media (max-width: 640px) {
  .deals__header { flex-direction: column !important; align-items: flex-start !important; }
  .deals__countdown { align-self: flex-end !important; }
}
.deals__countdown { gap: 4px !important; margin-left: auto !important; }
.deals__count-unit {
  padding: 5px 8px !important;
  min-width: 40px !important;
  border-radius: 7px !important;
}
.deals__count-num { font-size: 15px !important; }
.deals__count-label { font-size: 7px !important; margin-top: 1px !important; }
.deals__count-sep { font-size: 14px !important; padding: 0 1px !important; }

/* ============================================================
   LATEST ROUND OF FIXES
   ============================================================ */

/* ===== 1. STICKY HEADER ON ALL DEVICES (announcement scrolls away) ===== */
.announcement-bar {
  position: relative !important;
  top: auto !important;
  z-index: auto !important;
}

.header {
  position: sticky !important;
  position: -webkit-sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 100 !important;
  background: #eeeeea !important;
  box-shadow: 0 2px 10px rgba(74,61,43,0.08) !important;
  width: 100% !important;
}

@media (min-width: 768px) {
  .nav-bar {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 72px !important;
    z-index: 99 !important;
  }
}

/* Ensure no parent clips sticky */
html, body { overflow-x: hidden !important; overflow-y: auto !important; }
body { overflow-y: visible !important; }
main, #main-content, .template-index, .template-product, .template-collection, .template-page, .template-cart { overflow: visible !important; padding-top: 0 !important; }

/* ===== 2. CATEGORIES — warm off-white tone (not pure white) ===== */
.categories {
  background: #f7f4ed !important;
}
@media (min-width: 768px) {
  .categories { background: #f7f4ed !important; }
}

/* ===== 3. PRODUCT CARDS — 10% smaller ===== */
/* Slider card width */
.product-grid--slider .product-card {
  min-width: 140px !important;
  max-width: 180px !important;
}
@media (min-width: 768px) {
  .product-grid--slider .product-card {
    min-width: 190px !important;
    max-width: 230px !important;
  }
}

/* Card info smaller */
.product-card__info { padding: 8px 10px 10px !important; }
.product-card__vendor { font-size: 9px !important; margin-bottom: 2px !important; }
.product-card__title { font-size: 12px !important; margin-bottom: 3px !important; line-height: 1.3 !important; }
.product-card__rating svg { width: 10px !important; height: 10px !important; }
.product-card__rating { margin-bottom: 4px !important; gap: 1px !important; }
.product-card__price-current { font-size: 13px !important; }
.product-card__price-compare { font-size: 11px !important; }
.product-card__tag-badge, .product-card__discount-badge { font-size: 9px !important; padding: 3px 8px !important; top: 8px !important; left: 8px !important; }
.product-card__wishlist { width: 30px !important; height: 30px !important; top: 8px !important; right: 8px !important; }
.product-card__wishlist svg { width: 14px !important; height: 14px !important; }

/* Grid cards smaller gap */
.product-grid { gap: 10px !important; }
.product-grid--slider { gap: 10px !important; }
@media (min-width: 640px) { .product-grid { gap: 14px !important; } }

/* ============================================================
   UI/UX FINAL POLISH — global rules
   ============================================================ */

/* ===== 1. STICKY HEADER (all pages, all devices) ===== */
html { scroll-behavior: smooth; }
html, body { overflow-x: hidden !important; overflow-y: visible !important; }
.template-index, .template-product, .template-collection, .template-list-collections, .template-page, .template-cart, .template-search, main, #main-content, #MainContent {
  overflow: visible !important;
  contain: none !important;
  padding-top: 0 !important;
}

.announcement-bar { position: relative !important; top: auto !important; z-index: 1 !important; }
.header {
  position: sticky !important;
  position: -webkit-sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  background: #eeeeea !important;
  box-shadow: 0 2px 10px rgba(74,61,43,0.08) !important;
  width: 100% !important;
  transform: translateZ(0);
  will-change: transform;
}
@media (min-width: 768px) {
  .nav-bar { position: sticky !important; top: 72px !important; z-index: 99 !important; }
}

/* ===== 2. DRAWER — no blur, smaller items ===== */
.drawer-backdrop { background: rgba(0,0,0,0.4) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.drawer-menu {
  width: 280px !important;
  border-radius: 0 !important;
  background: #ffffff !important;
}
.drawer-menu__header { padding: 12px 16px !important; }
.drawer-menu__logo { height: 36px !important; }
.drawer-menu__close { width: 30px !important; height: 30px !important; }
.drawer-menu__close svg { width: 14px !important; height: 14px !important; }
.drawer-menu__btn, .drawer-menu__home-link {
  padding: 11px 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}
.drawer-menu__btn > span { gap: 10px !important; }
.drawer-menu__btn svg, .drawer-menu__home-link svg { width: 16px !important; height: 16px !important; }
.drawer-menu__item-icon svg { width: 16px !important; height: 16px !important; }
.drawer-menu__sublink { padding: 8px 24px !important; font-size: 12px !important; }
.drawer-menu__footer { padding: 10px 16px 12px !important; gap: 16px !important; }
.drawer-menu__socials-label { font-size: 8px !important; }
.drawer-menu__socials a svg { width: 18px !important; height: 18px !important; }

/* ===== 3. HERO SLIDER — no arrows, light brand dots, smaller buttons ===== */
.hero-slider__nav { display: none !important; }
.hero-slider__dots { bottom: 14px !important; gap: 5px !important; }
.hero-slider__dot {
  width: 6px !important;
  height: 6px !important;
  background: rgba(74,61,43,0.25) !important;
}
.hero-slider__dot.is-active {
  background: #4a3d2b !important;
  width: 18px !important;
  border-radius: 4px !important;
}
.hero-slider__actions { gap: 8px !important; }
.hero-slider__actions .btn,
[data-testid^="btn-hero-cta"] {
  padding: 9px 18px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
}
.hero-slider__tag { font-size: 10px !important; padding: 3px 10px !important; }
.hero-slider__title { font-size: clamp(28px, 7vw, 48px) !important; }
.hero-slider__subtitle { font-size: 13px !important; margin-bottom: 18px !important; }
.hero-slider__content { padding: 24px 20px !important; }

/* ===== 4. CATEGORIES — matches shop-by-brand warm off-white ===== */
.categories,
.shop-by-brand,
.info-ticker {
  background: #f7f4ed !important;
}
.categories { padding: 14px 0 16px !important; margin-left: calc(-50vw + 50%) !important; margin-right: calc(-50vw + 50%) !important; width: 100vw !important; max-width: 100vw !important; }
@media (min-width: 768px) { .categories { padding: 18px 0 !important; } }
.categories__grid { justify-content: flex-start !important; gap: 12px !important; padding: 0 14px !important; max-width: 1200px !important; margin: 0 auto !important; overflow-x: auto !important; scrollbar-width: none !important; }
.categories__grid::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .categories__grid { justify-content: center !important; gap: 22px !important; } }
.categories__item { min-width: 80px !important; flex-shrink: 0 !important; padding: 2px 0 !important; }
.categories__image-wrap {
  width: 72px !important; height: 72px !important;
  border: 1.5px solid rgba(74,61,43,0.18) !important;
  transition: border-color 0.25s ease, border-width 0.25s ease !important;
}
@media (min-width: 768px) { .categories__image-wrap { width: 78px !important; height: 78px !important; } }
.categories__item:hover .categories__image-wrap { border-color: #4a3d2b !important; border-width: 2px !important; }
.categories__label { font-size: 11px !important; font-weight: 500 !important; color: #2a1f17 !important; margin-top: 4px !important; }
.categories__item:hover .categories__label { color: #4a3d2b !important; }

/* ===== 5. SECTION TABS — 20% smaller ===== */
.section-tabs { height: 28px !important; border-width: 1px !important; }
.section-tabs__tab {
  padding: 0 13px !important;
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  min-width: 50px !important;
  font-weight: 800 !important;
}
@media (max-width: 640px) {
  .section-tabs { height: 26px !important; }
  .section-tabs__tab { padding: 0 10px !important; font-size: 9px !important; min-width: 44px !important; }
}

/* Tabs right, title+desc left */
.section-header {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
  flex-wrap: wrap !important;
}
.section-header__text { flex: 1 !important; min-width: 0 !important; text-align: left !important; }
.section-header__title { font-size: 15px !important; }
@media (min-width: 768px) { .section-header__title { font-size: 20px !important; } }
.section-header__desc { font-size: 11px !important; margin-top: 1px !important; }

/* ===== 6. VIEW ALL — smaller horizontal padding, slim pill ===== */
.section-header__link {
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 6px 12px !important;
  border: 1.2px solid #4a3d2b !important;
  border-radius: 9999px !important;
  color: #4a3d2b !important;
  background: transparent !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  white-space: nowrap !important;
}
.section-header__link:hover { background: #4a3d2b !important; color: #ffffff !important; }
.section-header__link::after { content: none !important; }

.section-footer__btn {
  padding: 10px 22px !important;
  font-size: 11px !important;
  min-width: 0 !important;
}

/* ===== 7. PRODUCT CARDS — 10% smaller, 2.5 cards visible on mobile ===== */
.product-grid--slider { gap: 10px !important; padding: 0 0 4px !important; }
.product-grid--slider .product-card {
  min-width: 42vw !important;
  max-width: 45vw !important;
  flex-shrink: 0 !important;
}
@media (min-width: 480px) { .product-grid--slider .product-card { min-width: 36vw !important; max-width: 38vw !important; } }
@media (min-width: 640px) { .product-grid--slider .product-card { min-width: 180px !important; max-width: 200px !important; } }
@media (min-width: 1024px) { .product-grid--slider .product-card { min-width: 200px !important; max-width: 220px !important; } }

/* Container padding for slider — show partial next card */
.featured-collection .container,
.deals .container { padding-right: 0 !important; }
.featured-collection .container .product-grid--slider,
.deals .container .deals__track { padding-right: 16px !important; }

/* Card internals smaller */
.product-card__info { padding: 7px 9px 9px !important; }
.product-card__vendor { font-size: 8.5px !important; margin-bottom: 2px !important; letter-spacing: 0.08em !important; }
.product-card__title { font-size: 11.5px !important; margin-bottom: 2px !important; line-height: 1.3 !important; }
.product-card__rating svg { width: 9px !important; height: 9px !important; }
.product-card__rating { margin-bottom: 3px !important; gap: 1px !important; }
.product-card__price-current { font-size: 12px !important; font-weight: 800 !important; }
.product-card__price-compare { font-size: 10px !important; }
.product-card__tag-badge, .product-card__discount-badge { font-size: 8.5px !important; padding: 2px 7px !important; top: 7px !important; left: 7px !important; border-radius: 4px !important; }
.product-card__wishlist { width: 26px !important; height: 26px !important; top: 7px !important; right: 7px !important; }
.product-card__wishlist svg { width: 12px !important; height: 12px !important; }

/* ===== 8. DEALS — smaller countdown, right aligned ===== */
.deals__inner { padding: 14px !important; border-radius: 12px !important; }
.deals__header { flex-direction: row !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; gap: 8px !important; margin-bottom: 14px !important; }
.deals__eyebrow { font-size: 9px !important; }
.deals__title { font-size: 15px !important; }
.deals__desc { font-size: 11px !important; }
.deals__countdown { margin-left: auto !important; gap: 3px !important; }
.deals__count-unit { padding: 4px 7px !important; min-width: 34px !important; border-radius: 6px !important; }
.deals__count-num { font-size: 12px !important; font-weight: 800 !important; }
.deals__count-label { font-size: 6.5px !important; margin-top: 1px !important; letter-spacing: 0.1em !important; }
.deals__count-sep { font-size: 11px !important; padding: 0 !important; }
.deals__card { min-width: 42vw !important; max-width: 45vw !important; }
@media (min-width: 640px) { .deals__card { min-width: 180px !important; max-width: 200px !important; } }

/* ===== 9. COLLECTION PAGE TOOLBAR — premium look ===== */
.collection-page__header { margin-bottom: 18px !important; padding-bottom: 12px !important; border-bottom: 1px solid rgba(74,61,43,0.1) !important; }
.collection-page__title { font-size: 22px !important; font-weight: 800 !important; text-transform: uppercase !important; margin: 0 !important; font-family: 'Montserrat', sans-serif !important; letter-spacing: 0.04em !important; }
.collection-page__desc { font-size: 12px !important; color: rgba(42,31,23,0.6) !important; margin-top: 4px !important; }
.collection-page__count { font-size: 11px !important; color: rgba(42,31,23,0.5) !important; margin-top: 4px !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; font-weight: 600 !important; }

.collection-page__toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 18px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid rgba(74,61,43,0.08) !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.collection-page__filters,
.collection-page__sort { flex-shrink: 0 !important; }

/* Filter button */
.collection-page__filters .btn,
[data-filter-toggle] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  height: 36px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  border: 1.2px solid rgba(74,61,43,0.25) !important;
  border-radius: 9999px !important;
  background: #ffffff !important;
  color: #2a1f17 !important;
  cursor: pointer !important;
  transition: all 0.2s !important;
  font-family: 'Montserrat', sans-serif !important;
}
[data-filter-toggle]:hover { border-color: #4a3d2b !important; color: #4a3d2b !important; }
[data-filter-toggle] svg { width: 14px !important; height: 14px !important; }

/* Sort dropdown — custom styled */
.collection-page__sort-select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: #ffffff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234a3d2b' stroke-width='2' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 12px center !important;
  background-size: 14px !important;
  padding: 8px 34px 8px 14px !important;
  height: 36px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border: 1.2px solid rgba(74,61,43,0.25) !important;
  border-radius: 9999px !important;
  color: #2a1f17 !important;
  cursor: pointer !important;
  font-family: 'Montserrat', sans-serif !important;
  min-width: 150px !important;
}
.collection-page__sort-select:hover { border-color: #4a3d2b !important; }
.collection-page__sort-select:focus { outline: none !important; border-color: #4a3d2b !important; }

@media (max-width: 480px) {
  .collection-page__toolbar { gap: 8px !important; }
  [data-filter-toggle], .collection-page__sort-select { height: 34px !important; font-size: 10px !important; flex: 1 !important; }
  .collection-page__sort-select { min-width: 0 !important; }
}

/* ===== 10. PAGINATION — premium, small ===== */
.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 32px 0 16px !important;
  flex-wrap: wrap !important;
}
.pagination a,
.pagination span,
.pagination .page {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 10px !important;
  border-radius: 9999px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #2a1f17 !important;
  border: 1px solid rgba(74,61,43,0.15) !important;
  background: #ffffff !important;
  transition: all 0.2s !important;
  font-family: 'Montserrat', sans-serif !important;
  letter-spacing: 0.02em !important;
}
.pagination a:hover { border-color: #4a3d2b !important; color: #4a3d2b !important; }
.pagination .page.current,
.pagination span.page.current,
.pagination .active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-color: #4a3d2b !important;
}
.pagination .prev,
.pagination .next { font-weight: 800 !important; }
.pagination .deco,
.pagination span:not(.page):not(.prev):not(.next) {
  border: none !important;
  background: transparent !important;
  color: rgba(42,31,23,0.4) !important;
}

/* ===== 11. PERFORMANCE ===== */
* { -webkit-tap-highlight-color: transparent; }
img { will-change: auto; }
.hero-slider__track, .product-page__slider-track, .product-zoom__track {
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* ============================================================
   TABS — FINAL SIZE + RADIUS (matches level-egypt.com exactly)
   ============================================================ */

.section-tabs,
div.section-tabs,
section .section-tabs {
  display: inline-flex !important;
  align-items: stretch !important;
  background: #ffffff !important;
  border: 1px solid #d9d9d3 !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  padding: 0 !important;
  height: 24px !important;
  gap: 0 !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}

.section-tabs button.section-tabs__tab,
div.section-tabs button.section-tabs__tab,
section .section-tabs button.section-tabs__tab {
  all: unset !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 0 10px !important;
  background: transparent !important;
  color: #2a1f17 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  border: none !important;
  border-radius: 0 !important;
  transition: background 0.22s ease, color 0.22s ease !important;
  margin: 0 !important;
  min-width: 42px !important;
}

/* Active tab: fills brown + rounded full so it becomes half-pill at edge */
.section-tabs button.section-tabs__tab.is-active,
div.section-tabs button.section-tabs__tab.is-active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
}

.section-tabs button.section-tabs__tab:not(.is-active):hover {
  color: #4a3d2b !important;
}

@media (max-width: 640px) {
  .section-tabs { height: 22px !important; }
  .section-tabs button.section-tabs__tab { padding: 0 8px !important; font-size: 8.5px !important; min-width: 38px !important; }
}

/* ===== TABS MOBILE +2px, not glued to right edge ===== */
@media (max-width: 640px) {
  .section-tabs { height: 24px !important; }
  .section-tabs button.section-tabs__tab { padding: 0 9px !important; font-size: 9.5px !important; min-width: 40px !important; }

  .section-header {
    padding-right: 12px !important;
  }
  .section-tabs { margin-right: 4px !important; }
}

/* ===== VIEW ALL BUTTON — not glued to right edge on mobile ===== */
@media (max-width: 640px) {
  .section-header { padding-right: 12px !important; padding-left: 12px !important; }
  .section-header__link { margin-right: 4px !important; }
}

/* ============================================================
   PRODUCT PAGE — PREMIUM POLISH
   ============================================================ */

/* Title block */
.product-page__info { padding: 4px 0 !important; }
.product-page__breadcrumb { font-size: 11px !important; color: rgba(42,31,23,0.5) !important; margin-bottom: 14px !important; letter-spacing: 0.03em !important; }
.product-page__breadcrumb a { color: rgba(42,31,23,0.6) !important; }
.product-page__breadcrumb a:hover { color: #4a3d2b !important; }
.product-page__breadcrumb > span { color: rgba(42,31,23,0.35) !important; }

.product-page__title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  color: #2a1f17 !important;
  margin: 0 0 6px !important;
}
@media (min-width: 768px) { .product-page__title { font-size: 26px !important; } }

.product-page__vendor {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(42,31,23,0.55) !important;
  margin: 0 0 16px !important;
}

/* Price block — premium */
.product-page__price {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin: 0 0 20px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid rgba(74,61,43,0.08) !important;
}
.product-page__price-current {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #2a1f17 !important;
  letter-spacing: 0.01em !important;
  line-height: 1 !important;
}
.product-page__price-compare {
  font-size: 14px !important;
  color: rgba(42,31,23,0.4) !important;
  text-decoration: line-through !important;
  font-weight: 500 !important;
}
.product-page__price-badge {
  background: #a83a32 !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  padding: 3px 8px !important;
  border-radius: 9999px !important;
  letter-spacing: 0.04em !important;
}

/* Option labels — unified style */
.product-page__option { margin-bottom: 18px !important; }
.product-page__option-label {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-bottom: 10px !important;
  font-family: 'Montserrat', sans-serif !important;
}
.product-page__option-name {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #2a1f17 !important;
}
.product-page__option-name::after { content: ":"; margin-left: 2px; color: rgba(42,31,23,0.55); }
.product-page__option-value {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(42,31,23,0.7) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.product-page__option-values {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

/* ============ SIZE BUTTONS ============ */
.product-page__option--size .product-page__option-btn,
.product-page__option-btn {
  all: unset !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 42px !important;
  height: 38px !important;
  padding: 0 12px !important;
  border: 1.5px solid rgba(74,61,43,0.2) !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #2a1f17 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all 0.2s !important;
  position: relative !important;
}
.product-page__option-btn:hover:not(.is-active):not(.is-unavailable) {
  border-color: #4a3d2b !important;
  color: #4a3d2b !important;
}
.product-page__option-btn.is-active {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-color: #4a3d2b !important;
  box-shadow: 0 2px 8px rgba(74,61,43,0.2) !important;
}
.product-page__option-btn.is-unavailable {
  opacity: 0.35 !important;
  cursor: not-allowed !important;
  background: rgba(74,61,43,0.04) !important;
  color: rgba(42,31,23,0.4) !important;
  border-color: rgba(74,61,43,0.08) !important;
}
.product-page__option-btn.is-unavailable::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 6px !important;
  right: 6px !important;
  height: 1px !important;
  background: rgba(42,31,23,0.4) !important;
  transform: rotate(-14deg) !important;
}

/* ============ COLOR SWATCHES ============ */
.product-page__swatch {
  all: unset !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 5px 12px 5px 5px !important;
  border: 1.5px solid rgba(74,61,43,0.2) !important;
  border-radius: 9999px !important;
  background: #ffffff !important;
  cursor: pointer !important;
  transition: all 0.2s !important;
  font-family: 'Montserrat', sans-serif !important;
}
.product-page__swatch-color {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(74,61,43,0.12) !important;
  flex-shrink: 0 !important;
  background-clip: padding-box !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.5) !important;
}
.product-page__swatch-name {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: #2a1f17 !important;
}
.product-page__swatch:hover:not(.is-active):not(.is-unavailable) {
  border-color: #4a3d2b !important;
}
.product-page__swatch.is-active {
  border-color: #4a3d2b !important;
  border-width: 2px !important;
  padding: 4px 11px 4px 4px !important;
  box-shadow: 0 2px 8px rgba(74,61,43,0.15) !important;
}
.product-page__swatch.is-active .product-page__swatch-color { border-color: #fff !important; box-shadow: 0 0 0 2px #4a3d2b, inset 0 0 0 1px rgba(255,255,255,0.3) !important; }
.product-page__swatch.is-unavailable {
  opacity: 0.4 !important;
  cursor: not-allowed !important;
}
.product-page__swatch.is-unavailable .product-page__swatch-name { text-decoration: line-through !important; }

/* ============ QUANTITY SELECTOR ============ */
.product-page__quantity { margin: 4px 0 20px !important; }
.product-page__qty-wrap {
  display: inline-flex !important;
  align-items: center !important;
  height: 42px !important;
  border: 1.5px solid rgba(74,61,43,0.2) !important;
  border-radius: 9999px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  padding: 0 !important;
}
.product-page__qty-btn {
  all: unset !important;
  box-sizing: border-box !important;
  width: 38px !important;
  height: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #2a1f17 !important;
  cursor: pointer !important;
  background: transparent !important;
  transition: background 0.2s !important;
  user-select: none !important;
}
.product-page__qty-btn:hover { background: rgba(74,61,43,0.05) !important; color: #4a3d2b !important; }
.product-page__qty-input {
  all: unset !important;
  box-sizing: border-box !important;
  width: 40px !important;
  height: 100% !important;
  text-align: center !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #2a1f17 !important;
  background: transparent !important;
  border: none !important;
  -moz-appearance: textfield !important;
}
.product-page__qty-input::-webkit-outer-spin-button,
.product-page__qty-input::-webkit-inner-spin-button { -webkit-appearance: none !important; margin: 0 !important; }

/* ============ STOCK BADGE — compact pill ============ */
.product-page__stock { margin: 10px 0 18px !important; }
.product-page__stock--in,
.product-page__stock--out {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 11px !important;
  border-radius: 9999px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}
.product-page__stock--in {
  background: rgba(26,172,89,0.1) !important;
  color: #0e7a3d !important;
  border: 1px solid rgba(26,172,89,0.25) !important;
}
.product-page__stock--out {
  background: rgba(168,58,50,0.1) !important;
  color: #8a2e28 !important;
  border: 1px solid rgba(168,58,50,0.25) !important;
}
.stock-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #1aac59 !important;
  box-shadow: 0 0 0 3px rgba(26,172,89,0.2) !important;
  display: inline-block !important;
  animation: stockPulse 2s ease-in-out infinite !important;
  margin-right: 2px !important;
}
.stock-dot--out { background: #a83a32 !important; box-shadow: 0 0 0 3px rgba(168,58,50,0.2) !important; }

/* ============ COLOR SWATCHES — circular, no name ============ */
.product-page__option--color .product-page__option-values {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

.product-page__swatch {
  all: unset !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  padding: 3px !important;
  border: 1.5px solid transparent !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  background: transparent !important;
}

.product-page__swatch-color {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  border: 1px solid rgba(74,61,43,0.12) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2) !important;
  background-clip: padding-box !important;
  transition: all 0.25s ease !important;
}

/* Hide the name span entirely */
.product-page__swatch-name { display: none !important; }

/* Hover */
.product-page__swatch:hover:not(.is-active):not(.is-unavailable) {
  border-color: rgba(74,61,43,0.35) !important;
}

/* Active state: brown outer ring with white inner space */
.product-page__swatch.is-active {
  border-color: #4a3d2b !important;
  border-width: 2px !important;
  padding: 3px !important;
  box-shadow: 0 2px 8px rgba(74,61,43,0.15) !important;
}
.product-page__swatch.is-active .product-page__swatch-color {
  border-color: #ffffff !important;
}

/* Unavailable: faded + diagonal strike */
.product-page__swatch.is-unavailable {
  opacity: 0.4 !important;
  cursor: not-allowed !important;
}
.product-page__swatch.is-unavailable::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 4px !important;
  right: 4px !important;
  height: 1.5px !important;
  background: rgba(42,31,23,0.5) !important;
  transform: rotate(-30deg) !important;
  border-radius: 1px !important;
}

/* Special rings for white/very light colors so they stay visible */
.product-page__swatch-color[style*="#ffffff"],
.product-page__swatch-color[style*="#fff"],
.product-page__swatch-color[style*="white"],
.product-page__swatch-color[style*="#f2e8d5"],
.product-page__swatch-color[style*="cream"] {
  border: 1px solid rgba(74,61,43,0.22) !important;
}

/* Mobile: slightly smaller */
@media (max-width: 640px) {
  .product-page__swatch { width: 30px !important; height: 30px !important; padding: 2.5px !important; }
  .product-page__option--color .product-page__option-values { gap: 8px !important; }
}

/* ============ COLOR SWATCHES — clean minimal, no double borders ============ */
.product-page__swatch {
  all: unset !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: inline-block !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

.product-page__swatch-color {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  border: none !important;
  box-shadow: none !important;
}

/* Hover — subtle scale */
.product-page__swatch:hover:not(.is-active):not(.is-unavailable) {
  transform: scale(1.1) !important;
}

/* Active — subtle shadow ring only, no border */
.product-page__swatch.is-active {
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 3.5px #4a3d2b !important;
  transform: scale(1.05) !important;
}

/* Unavailable */
.product-page__swatch.is-unavailable {
  opacity: 0.35 !important;
  cursor: not-allowed !important;
}
.product-page__swatch.is-unavailable::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 2px !important;
  right: 2px !important;
  height: 1.5px !important;
  background: rgba(42,31,23,0.5) !important;
  transform: rotate(-30deg) !important;
  border-radius: 1px !important;
}

/* Gap between swatches */
.product-page__option--color .product-page__option-values {
  gap: 10px !important;
}

/* Mobile */
@media (max-width: 640px) {
  .product-page__swatch { width: 26px !important; height: 26px !important; }
  .product-page__option--color .product-page__option-values { gap: 8px !important; }
}

/* ===== STOCK + READY TO SHIP ===== */
.product-page__stock--in {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}
.product-page__stock-sub {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  color: rgba(42,31,23,0.5) !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  padding-left: 8px !important;
  border-left: 1px solid rgba(42,31,23,0.15) !important;
  line-height: 1 !important;
}

/* ===== SHIPPING INFO LINE ===== */
.product-page__shipping-info {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  margin-top: 12px !important;
  padding: 10px 14px !important;
  background: rgba(74,61,43,0.04) !important;
  border-radius: 8px !important;
  border: 1px solid rgba(74,61,43,0.08) !important;
}
.product-page__shipping-info svg {
  flex-shrink: 0 !important;
  color: rgba(42,31,23,0.55) !important;
  stroke: rgba(42,31,23,0.55) !important;
  margin-top: 1px !important;
  width: 16px !important;
  height: 16px !important;
}
.product-page__shipping-info span {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: rgba(42,31,23,0.65) !important;
  line-height: 1.5 !important;
  letter-spacing: 0.01em !important;
}

/* ===== TABS +15% ===== */
.section-tabs,
div.section-tabs,
section .section-tabs {
  height: 28px !important;
}
.section-tabs button.section-tabs__tab,
div.section-tabs button.section-tabs__tab,
section .section-tabs button.section-tabs__tab {
  padding: 0 12px !important;
  font-size: 10.5px !important;
  min-width: 48px !important;
}
@media (max-width: 640px) {
  .section-tabs { height: 26px !important; }
  .section-tabs button.section-tabs__tab { padding: 0 10px !important; font-size: 10px !important; min-width: 44px !important; }
}

/* ===== DEALS COUNTDOWN +15% ===== */
.deals__countdown { gap: 5px !important; }
.deals__count-unit {
  padding: 6px 10px !important;
  min-width: 40px !important;
  border-radius: 8px !important;
}
.deals__count-num { font-size: 14px !important; }
.deals__count-label { font-size: 7.5px !important; margin-top: 2px !important; }
.deals__count-sep { font-size: 13px !important; }
@media (max-width: 640px) {
  .deals__count-unit { padding: 5px 8px !important; min-width: 36px !important; }
  .deals__count-num { font-size: 13px !important; }
}

/* ===== SHOP COLLECTIONS SLIDER — full fix ===== */
.collections-grid {
  padding: 32px 0 !important;
  background: #eeeeea !important;
  overflow: visible !important;
}
@media (min-width: 768px) { .collections-grid { padding: 48px 0 !important; } }

.collections-grid__slider-wrap {
  overflow: hidden !important;
  padding: 0 16px !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.collections-grid__slider {
  display: flex !important;
  gap: 12px !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: 4px !important;
  cursor: grab !important;
}
.collections-grid__slider::-webkit-scrollbar { display: none !important; }
.collections-grid__slider:active { cursor: grabbing !important; }

.collections-grid__item {
  flex-shrink: 0 !important;
  scroll-snap-align: start !important;
  width: clamp(160px, 42vw, 220px) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  position: relative !important;
  display: block !important;
  text-decoration: none !important;
  transition: transform 0.3s ease !important;
}
.collections-grid__item:hover { transform: translateY(-2px) !important; }
@media (min-width: 768px) {
  .collections-grid__item { width: 220px !important; }
}
@media (min-width: 1024px) {
  .collections-grid__item { width: 260px !important; }
}

.collections-grid__image {
  width: 100% !important;
  aspect-ratio: 3/4 !important;
  overflow: hidden !important;
  background: #e8e8e3 !important;
  display: block !important;
}
.collections-grid__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.4s ease !important;
}
.collections-grid__item:hover .collections-grid__image img { transform: scale(1.04) !important; }

.collections-grid__placeholder {
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(135deg, #e8e8e3, #d4d4cf) !important;
}

.collections-grid__overlay {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 16px 14px 14px !important;
  background: linear-gradient(to top, rgba(42,31,23,0.72) 0%, rgba(42,31,23,0.3) 60%, transparent 100%) !important;
  display: flex !important;
  align-items: flex-end !important;
}

.collections-grid__label {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.3) !important;
}

/* ===== SHOP BY BRAND — image logos ===== */
.shop-by-brand { background: #f7f4ed !important; padding: 32px 0 !important; }
.shop-by-brand__title { font-family: 'Montserrat', sans-serif !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; color: #2a1f17 !important; text-align: center !important; margin-bottom: 24px !important; }
.shop-by-brand__track-wrap { overflow: hidden !important; position: relative !important; }
.shop-by-brand__track-wrap::before, .shop-by-brand__track-wrap::after { content: '' !important; position: absolute !important; top: 0 !important; bottom: 0 !important; width: 60px !important; z-index: 2 !important; pointer-events: none !important; }
.shop-by-brand__track-wrap::before { left: 0 !important; background: linear-gradient(to right, #f7f4ed, transparent) !important; }
.shop-by-brand__track-wrap::after { right: 0 !important; background: linear-gradient(to left, #f7f4ed, transparent) !important; }
.shop-by-brand__track { display: flex !important; width: max-content !important; animation: marquee 30s linear infinite !important; }
.shop-by-brand__track:hover { animation-play-state: paused !important; }
.shop-by-brand__group { display: flex !important; align-items: center !important; gap: 0 !important; flex-shrink: 0 !important; }

/* Each brand item */
.shop-by-brand__item {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 140px !important;
  height: 64px !important;
  padding: 0 20px !important;
  opacity: 0.55 !important;
  transition: opacity 0.3s ease !important;
  flex-shrink: 0 !important;
  border-right: 1px solid rgba(74,61,43,0.1) !important;
}
.shop-by-brand__item:hover { opacity: 1 !important; }

/* Brand logo image */
.shop-by-brand__item img {
  max-width: 100px !important;
  max-height: 40px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  filter: grayscale(1) !important;
  transition: filter 0.3s ease !important;
}
.shop-by-brand__item:hover img { filter: grayscale(0) !important; }

/* Fallback text when no image */
.shop-by-brand__name {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #3a2818 !important;
  white-space: nowrap !important;
}

@media (max-width: 640px) {
  .shop-by-brand__item { width: 110px !important; height: 52px !important; padding: 0 14px !important; }
  .shop-by-brand__item img { max-width: 80px !important; max-height: 32px !important; }
}

/* ===== BRAND SVG LOGOS ===== */
.shop-by-brand__svg-logo {
  max-width: 100px !important;
  max-height: 40px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter: grayscale(1) brightness(0) !important;
  transition: filter 0.3s ease !important;
}
.shop-by-brand__item:hover .shop-by-brand__svg-logo {
  filter: grayscale(0) brightness(1) !important;
}

/* ===== PRODUCT CARD — remove white gap below image ===== */
.product-card { overflow: hidden !important; display: flex !important; flex-direction: column !important; }
.product-card__link { display: flex !important; flex-direction: column !important; flex: 1 !important; }
.product-card__image {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  overflow: hidden !important;
  background: #eeeeea !important;
  flex-shrink: 0 !important;
  display: block !important;
  line-height: 0 !important;
  font-size: 0 !important;
}
.product-card__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  vertical-align: top !important;
  margin: 0 !important;
  padding: 0 !important;
}
.product-card__info {
  flex: 1 !important;
  background: #eeeeea !important;
  margin: 0 !important;
}

/* ============================================================
   SHOP COLLECTIONS — exact match from collections-section.md
   ============================================================ */

.collections-grid {
  padding: 32px 0 !important;
  background: #eeeeea !important;
}
@media (min-width: 768px) { .collections-grid { padding: 48px 0 !important; } }

/* Header row: H2 left, View All right */
.collections-grid__header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 20px !important;
}
.collections-grid__title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: #2a1f17 !important;
  margin: 0 !important;
}
.collections-grid__view-all {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  color: #111111 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}
.collections-grid__view-all:hover { color: #4a3d2b !important; }

/* Viewport — overflow hidden for carousel */
.collections-grid__viewport {
  overflow: hidden !important;
  padding: 0 16px !important;
}

/* Track — flex row, scrollable */
.collections-grid__track {
  display: flex !important;
  gap: 10px !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  cursor: grab !important;
  padding-bottom: 4px !important;
}
.collections-grid__track::-webkit-scrollbar { display: none !important; }
.collections-grid__track:active { cursor: grabbing !important; }

/* Card — 145×190px, radius 12px */
.collections-grid__card {
  position: relative !important;
  flex: none !important;
  width: 145px !important;
  height: 190px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  scroll-snap-align: start !important;
  display: block !important;
  text-decoration: none !important;
  box-shadow: rgba(104, 76, 46, 0.08) 0px 8px 18px 0px !important;
  transition: box-shadow 0.3s ease !important;
}
.collections-grid__card:hover {
  box-shadow: rgba(74, 61, 43, 0.22) 0px 18px 34px 0px !important;
}

/* Image — absolute fill, cover, zoom on hover */
.collections-grid__img-wrap {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.collections-grid__img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 700ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.collections-grid__card:hover .collections-grid__img {
  transform: scale(1.05) !important;
}
.collections-grid__placeholder {
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(135deg, #e8e8e3, #d4d4cf) !important;
}

/* Overlay — creamy gradient, bottom 80px only */
.collections-grid__overlay {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  height: 80px !important;
  background: linear-gradient(
    to top,
    rgba(238, 238, 234, 0.96) 0%,
    rgba(238, 238, 234, 0.72) 58%,
    transparent 100%
  ) !important;
  pointer-events: none !important;
}

/* Label — bottom of card */
.collections-grid__label-wrap {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 12px !important;
}
.collections-grid__label {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #2a1f17 !important;
  line-height: 1.1 !important;
  margin: 0 !important;
}

/* Mobile — same layout, touch scroll */
@media (max-width: 767px) {
  .collections-grid__card { width: 140px !important; height: 185px !important; }
}

/* ===== COLLECTIONS GRID LABEL — 12px, handles long names ===== */
.collections-grid__label {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #2a1f17 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  word-break: break-word !important;
  hyphens: auto !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* ===== COLLECTIONS SLIDER FIX — scroll must be on the track itself ===== */
.collections-grid__viewport {
  overflow: hidden !important;
  padding: 0 16px !important;
}
/* The track needs overflow-x: auto to allow scrollLeft manipulation */
.collections-grid__track {
  overflow-x: scroll !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-behavior: auto !important; /* JS controls smooth manually */
}
/* Hide scrollbar visually but keep scroll functionality */
.collections-grid__track::-webkit-scrollbar { display: none !important; }
.collections-grid__track { scrollbar-width: none !important; }

/* ===== COLLECTIONS SLIDER — viewport scrolls, track is just flex ===== */
.collections-grid__viewport {
  overflow-x: scroll !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;
  padding: 0 16px 4px !important;
  cursor: grab !important;
}
.collections-grid__viewport::-webkit-scrollbar { display: none !important; }
.collections-grid__viewport:active { cursor: grabbing !important; }

.collections-grid__track {
  display: flex !important;
  gap: 10px !important;
  width: max-content !important;
  overflow: visible !important;
}

/* ============================================================
   SHOP COLLECTIONS — CSS MARQUEE (same approach as Shop by Brand)
   Auto-slides by itself + hover to pause + still draggable on touch
   ============================================================ */

/* Wrapper clips the scroll */
.collections-grid__marquee-wrap {
  overflow: hidden !important;
  position: relative !important;
  padding: 0 16px !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Edge fade like shop-by-brand */
.collections-grid__marquee-wrap::before,
.collections-grid__marquee-wrap::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 40px !important;
  z-index: 2 !important;
  pointer-events: none !important;
}
.collections-grid__marquee-wrap::before {
  left: 0 !important;
  background: linear-gradient(to right, #eeeeea, transparent) !important;
}
.collections-grid__marquee-wrap::after {
  right: 0 !important;
  background: linear-gradient(to left, #eeeeea, transparent) !important;
}

/* The marquee track — auto-scroll via keyframes, pause on hover */
.collections-grid__marquee {
  display: flex !important;
  width: max-content !important;
  animation: marquee 60s linear infinite !important;
  will-change: transform !important;
}
.collections-grid__marquee:hover { animation-play-state: paused !important; }
.collections-grid__marquee-wrap:active .collections-grid__marquee { animation-play-state: paused !important; }

/* Each duplicated group — horizontal flex row */
.collections-grid__marquee-group {
  display: flex !important;
  gap: 10px !important;
  padding-right: 10px !important;
  flex-shrink: 0 !important;
}

/* Cards keep their 145×190 shape */
.collections-grid__card {
  position: relative !important;
  flex: none !important;
  width: 145px !important;
  height: 190px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  display: block !important;
  text-decoration: none !important;
  box-shadow: rgba(104, 76, 46, 0.08) 0px 8px 18px 0px !important;
  transition: box-shadow 0.3s ease !important;
}
@media (max-width: 767px) {
  .collections-grid__card { width: 140px !important; height: 185px !important; }
}

/* Neutralize any stale rules from older viewport/track blocks */
.collections-grid__viewport,
.collections-grid__track,
.collections-grid__slider,
.collections-grid__slider-wrap {
  all: unset !important;
}

/* Respect user motion preference */
@media (prefers-reduced-motion: reduce) {
  .collections-grid__marquee { animation-duration: 200s !important; }
}

/* ============================================================
   HERO SLIDER — per-slide framing so product (feet) stays visible
   ============================================================ */

/* Slide 1: Women's flat sandals (landscape 3:2) — product is lower-right.
   Shift crop so feet are in frame, and darken right side for contrast */
.hero-slider__slide--1 .hero-slider__image img {
  object-position: 70% 65% !important;
}

/* Slide 2: Couple in slides (portrait 2:3) — product is at the bottom.
   Pin crop to bottom so both pairs of feet are visible */
.hero-slider__slide--2 .hero-slider__image img {
  object-position: 50% 80% !important;
}

/* Slide 3: Sneakers on stairs (landscape 3:2) — product is center-right */
.hero-slider__slide--3 .hero-slider__image img {
  object-position: 60% 70% !important;
}

/* Slide 4: Black heels from car (square 1:1) — product is lower-center */
.hero-slider__slide--4 .hero-slider__image img {
  object-position: 55% 75% !important;
}

/* Make sure the hero area gives enough room on mobile for the product */
.hero-slider__slide {
  height: clamp(340px, 56vw, 520px) !important;
  background: #eeeeea !important;
}

/* Soften the overlay — gradient from left (text side) to transparent on right (product side) */
.hero-slider__overlay {
  background: linear-gradient(
    to right,
    rgba(247, 244, 237, 0.92) 0%,
    rgba(247, 244, 237, 0.72) 32%,
    rgba(247, 244, 237, 0.36) 56%,
    rgba(247, 244, 237, 0) 75%
  ) !important;
}

/* On narrow screens the overlay becomes bottom-to-top so text sits below the product */
@media (max-width: 640px) {
  .hero-slider__overlay {
    background: linear-gradient(
      to top,
      rgba(247, 244, 237, 0.96) 0%,
      rgba(247, 244, 237, 0.82) 32%,
      rgba(247, 244, 237, 0.36) 62%,
      rgba(247, 244, 237, 0) 88%
    ) !important;
  }
  .hero-slider__content {
    justify-content: flex-end !important;
    padding: 20px 20px 40px !important;
    max-width: 100% !important;
  }
  /* Pull image up a touch on mobile so feet clear the text */
  .hero-slider__slide--1 .hero-slider__image img { object-position: 60% 40% !important; }
  .hero-slider__slide--2 .hero-slider__image img { object-position: 50% 40% !important; }
  .hero-slider__slide--3 .hero-slider__image img { object-position: 55% 45% !important; }
  .hero-slider__slide--4 .hero-slider__image img { object-position: 50% 40% !important; }
}

/* ============================================================
   HERO SLIDER — shorter on desktop only (mobile unchanged)
   ============================================================ */
@media (min-width: 768px) {
  .hero-slider__slide { height: clamp(320px, 36vw, 400px) !important; }
}
@media (min-width: 1280px) {
  .hero-slider__slide { height: 380px !important; }
}

/* ============================================================
   HERO SLIDER — premium padding + contained layout (desktop refresh)
   ============================================================ */

/* Give the section breathing room from page edges on desktop */
@media (min-width: 768px) {
  .hero-slider {
    padding: 20px 24px 0 !important;
    background: transparent !important;
  }
  .hero-slider__track {
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: rgba(104, 76, 46, 0.08) 0px 12px 28px 0px !important;
  }
  .hero-slider__slide {
    height: 380px !important;
    border-radius: 0 !important; /* radius is on track */
  }
  /* Dots sit inside the rounded card */
  .hero-slider__dots {
    bottom: 18px !important;
  }
}
@media (min-width: 1280px) {
  .hero-slider { padding: 24px 32px 0 !important; }
  .hero-slider__slide { height: 400px !important; }
}

/* Re-balance text block padding on desktop — more left inset, vertical centered */
@media (min-width: 768px) {
  .hero-slider__content {
    padding: 40px 48px !important;
    max-width: 520px !important;
  }
  .hero-slider__title { margin-bottom: 14px !important; }
  .hero-slider__subtitle { margin-bottom: 22px !important; max-width: 380px !important; }
  .hero-slider__tag { margin-bottom: 14px !important; }
}

/* Softer overlay — more subtle fade so product stays unobstructed on right */
@media (min-width: 768px) {
  .hero-slider__overlay {
    background: linear-gradient(
      to right,
      rgba(247, 244, 237, 0.88) 0%,
      rgba(247, 244, 237, 0.60) 28%,
      rgba(247, 244, 237, 0.20) 52%,
      rgba(247, 244, 237, 0) 70%
    ) !important;
  }
}

/* Re-tune per-slide framing for the new shorter desktop height */
@media (min-width: 768px) {
  .hero-slider__slide--1 .hero-slider__image img { object-position: 75% 60% !important; }
  .hero-slider__slide--2 .hero-slider__image img { object-position: 50% 75% !important; }
  .hero-slider__slide--3 .hero-slider__image img { object-position: 62% 65% !important; }
  .hero-slider__slide--4 .hero-slider__image img { object-position: 55% 70% !important; }
}

/* ============================================================
   WISHLIST PAGE
   ============================================================ */
.wishlist-page {
  background: #eeeeea;
  padding: 40px 0 64px;
  min-height: 60vh;
}
.wishlist-page__header {
  text-align: center;
  margin-bottom: 24px;
}
.wishlist-page__title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(24px, 4.5vw, 34px);
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #2a1f17;
  margin: 0 0 8px;
  text-transform: uppercase;
}
.wishlist-page__subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: rgba(74,61,43,0.68);
  margin: 0;
}

.wishlist-page__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  margin-bottom: 20px;
  background: #e8e8e3;
  border: 1px solid rgba(74,61,43,0.1);
  border-radius: 10px;
}
.wishlist-page__toolbar[hidden] { display: none; }
.wishlist-page__count {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #2a1f17;
  letter-spacing: 0.04em;
}
.wishlist-page__clear {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #a83a32;
  background: transparent;
  border: none;
  text-transform: uppercase;
  cursor: pointer;
  padding: 4px 8px;
}
.wishlist-page__clear:hover { text-decoration: underline; }

.wishlist-page__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
@media (min-width: 640px) { .wishlist-page__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; } }
@media (min-width: 1024px) { .wishlist-page__grid { grid-template-columns: repeat(4, 1fr); gap: 20px; } }

/* Wishlist item card — mirrors product-card look */
.wl-card {
  position: relative;
  background: #eeeeea;
  border: 1px solid rgba(74,61,43,0.22);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s, box-shadow 0.25s;
}
.wl-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(74,61,43,0.12);
}
.wl-card__img-wrap {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  background: #fff;
  overflow: hidden;
}
.wl-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s;
}
.wl-card:hover .wl-card__img { transform: scale(1.04); }
.wl-card__remove {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid rgba(74,61,43,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #a83a32;
  z-index: 2;
  transition: background 0.2s, transform 0.2s;
}
.wl-card__remove:hover {
  background: #fdecea;
  transform: scale(1.06);
}
.wl-card__remove svg { width: 16px; height: 16px; fill: currentColor; }

.wl-card__info {
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.wl-card__vendor {
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: rgba(74,61,43,0.62);
  text-transform: uppercase;
  margin: 0;
}
.wl-card__title {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #2a1f17;
  line-height: 1.3;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wl-card__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 4px;
}
.wl-card__price-current {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #2a1f17;
}
.wl-card__price-compare {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: rgba(74,61,43,0.45);
  text-decoration: line-through;
}
.wl-card__actions {
  margin-top: 8px;
  display: flex;
  gap: 6px;
}
.wl-card__view {
  flex: 1;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  padding: 8px 10px;
  background: #4a3d2b;
  color: #fff;
  border-radius: 9999px;
  text-decoration: none;
  transition: background 0.2s;
}
.wl-card__view:hover { background: #2a1f17; }

/* Empty state */
.wishlist-page__empty {
  text-align: center;
  padding: 48px 20px;
  background: #e8e8e3;
  border-radius: 16px;
  border: 1px dashed rgba(74,61,43,0.2);
}
.wishlist-page__empty[hidden] { display: none; }
.wishlist-page__empty-icon {
  color: rgba(74,61,43,0.4);
  margin-bottom: 16px;
  display: inline-flex;
}
.wishlist-page__empty-title {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #2a1f17;
  margin: 0 0 6px;
}
.wishlist-page__empty-text {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: rgba(74,61,43,0.68);
  margin: 0 0 20px;
}
.wishlist-page__empty-cta {
  display: inline-block;
  padding: 12px 28px !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
}

/* Active heart state on product cards */
.product-card__wishlist.is-active svg {
  fill: #a83a32 !important;
  stroke: #a83a32 !important;
}

/* Header heart badge (count) */
.header__icon--wishlist {
  position: relative;
}
.header__wishlist-count {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 9999px;
  background: #a83a32;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* ============================================================
   CATEGORIES — background override to #e8e8e3
   ============================================================ */
.categories,
.categories-section {
  background: #e8e8e3 !important;
}
@media (min-width: 768px) {
  .categories { background: #e8e8e3 !important; }
}

/* ============================================================
   SHOP BY BRAND — match Categories background (#e8e8e3)
   ============================================================ */
.shop-by-brand,
.shop-by-brand-section {
  background: #e8e8e3 !important;
}
.shop-by-brand__track-wrap::before {
  background: linear-gradient(to right, #e8e8e3, transparent) !important;
}
.shop-by-brand__track-wrap::after {
  background: linear-gradient(to left, #e8e8e3, transparent) !important;
}

/* ============================================================
   DEALS COUNTDOWN — 4 boxes (Days / Hrs / Min / Sec)
   Futuristic Orbitron font for numbers
   ============================================================ */

/* Countdown container: tight, aligned to right */
.deals__countdown {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-left: auto !important;
}

/* Each time-unit box */
.deals__count-unit {
  background: #a83a32 !important;
  color: #fff !important;
  border-radius: 8px !important;
  padding: 6px 8px !important;
  min-width: 40px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  box-shadow: 0 2px 6px rgba(168, 58, 50, 0.18) !important;
}

/* Futuristic number font */
.deals__count-num {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  line-height: 1 !important;
  display: block !important;
  font-variant-numeric: tabular-nums !important;
  -webkit-font-feature-settings: "tnum" !important;
  font-feature-settings: "tnum" !important;
}

.deals__count-label {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 7px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  margin-top: 3px !important;
  display: block !important;
  opacity: 0.9 !important;
}

.deals__count-sep {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #a83a32 !important;
  padding: 0 1px !important;
}

/* Mobile — shrink boxes a touch so all 4 fit comfortably */
@media (max-width: 640px) {
  .deals__countdown { gap: 3px !important; }
  .deals__count-unit {
    padding: 5px 6px !important;
    min-width: 34px !important;
    border-radius: 6px !important;
  }
  .deals__count-num { font-size: 12px !important; }
  .deals__count-label { font-size: 6px !important; margin-top: 2px !important; }
  .deals__count-sep { font-size: 10px !important; }
}

/* ============================================================
   SHOP COLLECTIONS — match Categories / Shop by Brand bg (#e8e8e3)
   ============================================================ */
.collections-grid,
.collections-grid-section {
  background: #e8e8e3 !important;
}
.collections-grid__marquee-wrap::before {
  background: linear-gradient(to right, #e8e8e3, transparent) !important;
}
.collections-grid__marquee-wrap::after {
  background: linear-gradient(to left, #e8e8e3, transparent) !important;
}

/* ============================================================
   INFO TICKER — news strip background (#eeeeea)
   ============================================================ */
.info-ticker,
.info-ticker-section {
  background: #eeeeea !important;
}
.info-ticker__track-wrap::before {
  background: linear-gradient(to right, #eeeeea, transparent) !important;
}
.info-ticker__track-wrap::after {
  background: linear-gradient(to left, #eeeeea, transparent) !important;
}

/* ============================================================
   STICKY HEADER — FINAL FIX (wins over every previous override)
   Works on desktop + mobile across all templates
   ============================================================ */

/* Ensure no ancestor has overflow that blocks sticky */
html, body {
  overflow-x: clip !important;   /* clip allows sticky, hidden would break it */
  overflow-y: visible !important;
}

/* Announcement bar scrolls away with the page */
.announcement-bar,
.announcement-bar-section {
  position: relative !important;
  top: auto !important;
  z-index: 5 !important;
}

/* Header is sticky on every screen size and template */
.header,
.header-section {
  position: sticky !important;
  position: -webkit-sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 1000 !important;
  background: #eeeeea !important;
  box-shadow: 0 2px 8px rgba(74, 61, 43, 0.05) !important;
}

/* Nav-bar (if present) sits just under the header and also sticks */
@media (min-width: 768px) {
  .nav-bar,
  .nav-bar-section {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 72px !important;
    z-index: 999 !important;
  }
}

/* Make sure the main content container is NOT the scroller —
   the body/window must be the scroll root for sticky to work */
main,
.shopify-section,
#MainContent,
.page-wrap {
  overflow: visible !important;
}

/* ============================================================
   PAGE TEMPLATES — premium styling for FAQ / Contact / Track / Policies
   ============================================================ */

/* Shared page content wrapper */
.page-content {
  background: #eeeeea !important;
  padding: 40px 0 80px !important;
  min-height: 60vh !important;
}
.page-content__title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: clamp(24px, 4vw, 34px) !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  color: #2a1f17 !important;
  text-transform: uppercase !important;
  margin-bottom: 24px !important;
  text-align: center !important;
}

/* RTE / rich text body shared across policies and FAQ */
.page-content__body,
.faq-page,
.rte {
  background: #e8e8e3 !important;
  padding: 28px 24px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(74,61,43,0.08) !important;
  max-width: 820px !important;
  margin: 0 auto !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: #2a1f17 !important;
}
.page-content__body h2,
.faq-page h2,
.rte h2 {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #2a1f17 !important;
  margin: 24px 0 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}
.page-content__body h3,
.faq-page h3,
.rte h3 {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #4a3d2b !important;
  margin: 18px 0 8px !important;
}
.page-content__body p,
.faq-page p,
.rte p {
  margin: 0 0 14px !important;
  color: rgba(42,31,23,0.82) !important;
}
.page-content__body ul,
.page-content__body ol,
.rte ul,
.rte ol {
  padding-left: 20px !important;
  margin: 0 0 14px !important;
}
.page-content__body li,
.rte li {
  margin-bottom: 6px !important;
}
.page-content__body a,
.faq-page a,
.rte a {
  color: #a83a32 !important;
  text-decoration: underline !important;
}
.page-content__body strong,
.rte strong {
  color: #2a1f17 !important;
  font-weight: 700 !important;
}
.page-content__body hr,
.rte hr {
  border: none !important;
  border-top: 1px solid rgba(74,61,43,0.12) !important;
  margin: 24px 0 !important;
}

/* Empty page hint */
.page-content__body:empty::before,
.faq-page:empty::before {
  content: "This page is not filled in yet. Add content from Shopify Admin → Online Store → Pages." !important;
  color: rgba(42,31,23,0.55) !important;
  font-size: 13px !important;
  font-style: italic !important;
  display: block !important;
  text-align: center !important;
  padding: 32px 0 !important;
}

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-page__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  max-width: 900px;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .contact-page__grid { grid-template-columns: 1.2fr 1fr; gap: 32px; }
}
.contact-page__form,
.contact-page__info {
  background: #e8e8e3;
  padding: 28px 24px;
  border-radius: 14px;
  border: 1px solid rgba(74,61,43,0.08);
}
.contact-page__info h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #2a1f17;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0 0 10px;
}
.contact-page__info p {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: rgba(42,31,23,0.72);
  line-height: 1.6;
  margin: 0 0 18px;
}
.contact-page__info .btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.contact-page__success {
  background: #e8f5e9;
  color: #1b5e20;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 13px;
  margin-bottom: 16px;
}

/* Form group — shared */
.form-group {
  margin-bottom: 16px;
}
.form-group label {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #2a1f17;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 6px;
}
.form-group input,
.form-group textarea {
  width: 100%;
  padding: 11px 14px;
  border: 1px solid rgba(74,61,43,0.2);
  border-radius: 10px;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  background: #fff;
  color: #2a1f17;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.form-group input:focus,
.form-group textarea:focus {
  outline: none;
  border-color: #4a3d2b;
  box-shadow: 0 0 0 3px rgba(74,61,43,0.12);
}

/* ============================================================
   TRACK ORDER PAGE
   ============================================================ */
.track-page {
  max-width: 620px;
  margin: 0 auto;
  text-align: center;
}
.track-page__icon {
  color: #4a3d2b;
  margin: 0 auto 14px;
  display: inline-flex;
  width: 72px;
  height: 72px;
  align-items: center;
  justify-content: center;
  background: #e8e8e3;
  border-radius: 50%;
  border: 1px solid rgba(74,61,43,0.1);
}
.track-page__title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(22px, 3.6vw, 30px);
  font-weight: 800;
  color: #2a1f17;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0 0 8px;
}
.track-page__subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: rgba(42,31,23,0.68);
  line-height: 1.6;
  margin: 0 0 24px;
}
.track-page__card {
  background: #e8e8e3;
  padding: 24px;
  border-radius: 14px;
  border: 1px solid rgba(74,61,43,0.08);
  text-align: left;
}
.track-page__form .btn {
  width: 100%;
  margin-top: 4px;
}
.track-page__divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 20px 0;
  color: rgba(42,31,23,0.5);
  font-size: 12px;
  font-family: 'Montserrat', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.track-page__divider::before,
.track-page__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(74,61,43,0.15);
}
.track-page__whatsapp {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 18px;
  background: #25d366;
  color: #fff !important;
  border-radius: 9999px;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: background 0.2s, transform 0.2s;
}
.track-page__whatsapp:hover {
  background: #1ea952;
  transform: translateY(-1px);
}
.track-page__whatsapp svg {
  width: 18px;
  height: 18px;
  fill: #fff;
}
.track-page__notes {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 24px;
  text-align: left;
}
@media (min-width: 640px) {
  .track-page__notes { grid-template-columns: 1fr 1fr; }
}
.track-page__note {
  background: #fff;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid rgba(74,61,43,0.08);
}
.track-page__note strong {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #2a1f17;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}
.track-page__note span {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: rgba(42,31,23,0.68);
  line-height: 1.5;
}

/* ============================================================
   WISHLIST BUTTON ON PRODUCT CARDS — more visible
   ============================================================ */
.product-card__wishlist {
  background: #ffffff !important;
  border: 1px solid rgba(74,61,43,0.2) !important;
  box-shadow: 0 2px 6px rgba(74,61,43,0.08) !important;
}
.product-card__wishlist svg {
  stroke-width: 1.8 !important;
  transition: fill 0.2s, stroke 0.2s, transform 0.2s !important;
}
.product-card__wishlist:hover svg {
  transform: scale(1.08) !important;
}
.product-card__wishlist.is-active {
  background: #fff !important;
  border-color: rgba(168,58,50,0.3) !important;
}
.product-card__wishlist.is-active svg {
  fill: #a83a32 !important;
  stroke: #a83a32 !important;
}

/* ============================================================
   KILL WHITE GAP BELOW FOOTER
   ============================================================ */

/* The html element's default bg bleeds through below the body/footer.
   Set it to the footer brown so any residual space matches. */
html {
  background: #4a3d2b !important;
}

/* Footer sticks to the bottom with no trailing margin */
.footer {
  margin-bottom: 0 !important;
}

/* Mobile bottom-nav spacer — make the reserved area use the footer color */
@media (max-width: 767.98px) {
  body {
    background-color: #eeeeea !important;
  }
  /* The padding-bottom that makes room for the fixed bottom-nav
     should match the bottom-nav background so no stripe shows */
  body::after {
    content: '' !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: env(safe-area-inset-bottom) !important;
    background: #2a1f17 !important;
    z-index: 199 !important;
    pointer-events: none !important;
  }
}

/* ============================================================
   COLLECTION FILTERS — drawer + chips + empty state
   ============================================================ */

/* Filter button badge */
.filter-btn__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9999px;
  background: #a83a32;
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  font-weight: 700;
  margin-left: 6px;
  line-height: 1;
}

/* Active filter chips row */
.collection-page__active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
}
.active-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: #e8e8e3;
  border: 1px solid rgba(74,61,43,0.18);
  border-radius: 9999px;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: #2a1f17;
  text-decoration: none !important;
  transition: background 0.2s, border-color 0.2s;
}
.active-filter-chip:hover {
  background: #fff;
  border-color: #4a3d2b;
}
.active-filter-chip svg { opacity: 0.55; }
.active-filter-chip--clear {
  background: transparent;
  color: #a83a32;
  border-color: rgba(168,58,50,0.3);
}
.active-filter-chip--clear:hover {
  background: #fdecea;
  border-color: #a83a32;
}

/* Empty state when no products match filters */
.collection-page__empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 48px 20px;
  background: #e8e8e3;
  border-radius: 14px;
  border: 1px dashed rgba(74,61,43,0.2);
  color: rgba(74,61,43,0.7);
}
.collection-page__empty svg {
  color: rgba(74,61,43,0.5);
  margin-bottom: 12px;
}
.collection-page__empty h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #2a1f17;
  margin: 0 0 6px;
}
.collection-page__empty p {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  margin: 0 0 16px;
}

/* ============================================================
   FILTER DRAWER
   ============================================================ */
.filter-drawer {
  position: fixed;
  inset: 0;
  z-index: 1500;
  pointer-events: none;
}
.filter-drawer[hidden] { display: none; }

.filter-drawer__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.4);
  opacity: 0;
  transition: opacity 0.25s;
  pointer-events: none;
}
.filter-drawer.is-open .filter-drawer__backdrop {
  opacity: 1;
  pointer-events: auto;
}

.filter-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 92%;
  max-width: 380px;
  background: #e8e8e3;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: -8px 0 24px rgba(0,0,0,0.15);
  pointer-events: auto;
}
.filter-drawer.is-open .filter-drawer__panel {
  transform: translateX(0);
}

.filter-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(74,61,43,0.1);
  background: #fff;
}
.filter-drawer__header h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #2a1f17;
  text-transform: uppercase;
  margin: 0;
}
.filter-drawer__close {
  background: transparent;
  border: none;
  cursor: pointer;
  color: #2a1f17;
  padding: 6px;
  display: flex;
  border-radius: 50%;
  transition: background 0.2s;
}
.filter-drawer__close:hover { background: rgba(74,61,43,0.08); }

.filter-drawer__body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 8px 0;
}

.filter-drawer__empty {
  padding: 40px 24px;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  line-height: 1.6;
  color: rgba(74,61,43,0.7);
}
.filter-drawer__empty strong { color: #2a1f17; }

/* Filter group (accordion) */
.filter-group {
  border-bottom: 1px solid rgba(74,61,43,0.08);
}
.filter-group__summary {
  list-style: none;
  cursor: pointer;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #2a1f17;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  user-select: none;
}
.filter-group__summary::-webkit-details-marker { display: none; }
.filter-group__summary svg {
  transition: transform 0.2s;
  color: rgba(74,61,43,0.55);
}
.filter-group[open] > .filter-group__summary svg {
  transform: rotate(180deg);
}
.filter-group__body {
  padding: 0 20px 16px;
  max-height: 260px;
  overflow-y: auto;
}

/* Filter option (checkbox) */
.filter-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  cursor: pointer;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: #2a1f17;
  position: relative;
}
.filter-option input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}
.filter-option__check {
  width: 18px;
  height: 18px;
  border: 1.5px solid rgba(74,61,43,0.3);
  border-radius: 4px;
  background: #fff;
  flex-shrink: 0;
  position: relative;
  transition: all 0.2s;
}
.filter-option__check::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg) scale(0);
  transition: transform 0.2s;
}
.filter-option input:checked ~ .filter-option__check {
  background: #4a3d2b;
  border-color: #4a3d2b;
}
.filter-option input:checked ~ .filter-option__check::after {
  transform: rotate(45deg) scale(1);
}
.filter-option__label {
  flex: 1;
  line-height: 1.3;
}
.filter-option__count {
  font-size: 11px;
  color: rgba(74,61,43,0.5);
}
.filter-option--disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* Price range */
.filter-price__inputs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.filter-price__field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.filter-price__field span {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: rgba(74,61,43,0.7);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.filter-price__field input {
  padding: 8px 10px;
  border: 1px solid rgba(74,61,43,0.2);
  border-radius: 8px;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  background: #fff;
  color: #2a1f17;
}
.filter-price__field input:focus {
  outline: none;
  border-color: #4a3d2b;
  box-shadow: 0 0 0 3px rgba(74,61,43,0.12);
}
.filter-price__note {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  color: rgba(74,61,43,0.55);
  margin: 8px 0 0;
}

/* Drawer footer (sticky bottom with actions) */
.filter-drawer__footer {
  display: flex;
  gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid rgba(74,61,43,0.1);
  background: #fff;
}
.filter-drawer__clear,
.filter-drawer__apply {
  flex: 1;
  text-align: center;
  justify-content: center;
}

/* ============================================================
   MOBILE DRAWER — must sit above the sticky header (z-index: 1000)
   ============================================================ */
.drawer-backdrop {
  z-index: 1100 !important;
}
.drawer-menu {
  z-index: 1200 !important;
}

/* ============================================================
   PAGINATION — clean premium pill design
   (overrides all previous .pagination rules)
   ============================================================ */
.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 40px 0 24px !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  margin: 0 !important;
}

/* Every clickable page number or arrow */
.pagination a,
.pagination span,
.pagination .page,
.pagination .prev,
.pagination .next {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 36px !important;
  height: 36px !important;
  padding: 0 10px !important;
  border-radius: 9999px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #2a1f17 !important;
  background: #ffffff !important;
  border: 1px solid rgba(74, 61, 43, 0.18) !important;
  text-decoration: none !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 1px 2px rgba(74, 61, 43, 0.04) !important;
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s !important;
}

/* Hover on any link */
.pagination a:hover {
  background: #e8e8e3 !important;
  border-color: #4a3d2b !important;
  color: #4a3d2b !important;
  transform: translateY(-1px) !important;
}

/* Active page — brown filled pill */
.pagination .page.current,
.pagination span.page.current,
.pagination .active,
.pagination [aria-current="page"] {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-color: #4a3d2b !important;
  box-shadow: 0 3px 8px rgba(74, 61, 43, 0.22) !important;
}

/* Prev / Next arrows — slightly larger */
.pagination .prev,
.pagination .next {
  min-width: 40px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

/* Ellipsis (the "…") — no border, no bg, no click */
.pagination .deco,
.pagination span:not(.page):not(.prev):not(.next):not([aria-current]) {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(74, 61, 43, 0.5) !important;
  min-width: 20px !important;
  padding: 0 4px !important;
  cursor: default !important;
}

/* Mobile — compact */
@media (max-width: 480px) {
  .pagination { gap: 4px !important; padding: 28px 0 20px !important; }
  .pagination a,
  .pagination span,
  .pagination .page {
    min-width: 32px !important;
    height: 32px !important;
    font-size: 12px !important;
    padding: 0 8px !important;
  }
}

/* ============================================================
   PRODUCT CARD BADGES — FINAL CLEAN VERSION
   - Sale: single pill top-left, red
   - Sold Out: subtle top-right ribbon + soft light overlay on image
   - Kill the duplicate "-20%" that used to show twice
   ============================================================ */

/* Hide the legacy duplicate badge entirely */
.product-card__discount-badge { display: none !important; }

/* Shared badge base */
.product-card__badge {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  z-index: 3 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

/* SALE — single rounded red pill */
.product-card__badge--sale {
  background: #a83a32 !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
}

/* NEW / TOP — brown square tag */
.product-card__badge--new,
.product-card__badge--top {
  background: #4a3d2b !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}

/* SOLD OUT — lighter, moves to top-right, pill shape with translucent bg */
.product-card__badge--soldout {
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  background: rgba(255, 255, 255, 0.95) !important;
  color: #2a1f17 !important;
  border: 1px solid rgba(42, 31, 23, 0.15) !important;
  border-radius: 9999px !important;
  padding: 5px 11px !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  box-shadow: 0 2px 8px rgba(42, 31, 23, 0.08) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}

/* Soft "Sold Out" visual treatment on the image — lighter fade instead of heavy */
.product-card__image--soldout img {
  opacity: 0.75 !important;
  filter: grayscale(0.25) !important;
  transition: opacity 0.3s, filter 0.3s !important;
}
.product-card__image--soldout::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(255, 255, 255, 0.28) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* ============================================================
   SECTION FOOTER — per-tab View All CTAs
   Only the one matching the active tab is visible at a time.
   ============================================================ */
.section-footer--tabs {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 18px 0 8px !important;
}
.section-footer__btn--tab {
  display: none !important;
}
.section-footer__btn--tab.is-active {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ============================================================
   DEALS / NEW ARRIVALS — JS-rendered cards share product-card style
   ============================================================ */

/* Make the JS-rendered track behave like a horizontal slider */
[data-deals-track],
[data-product-slider] {
  display: flex !important;
  overflow-x: auto !important;
  gap: 12px !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-snap-type: x mandatory !important;
  padding-bottom: 4px !important;
}
[data-deals-track]::-webkit-scrollbar,
[data-product-slider]::-webkit-scrollbar { display: none !important; }

/* Individual JS-rendered deal/product card — premium compact */
[data-deals-track] .deals__card,
[data-product-slider] .deals__card {
  flex: 0 0 auto !important;
  min-width: 42vw !important;
  max-width: 45vw !important;
  scroll-snap-align: start !important;
  background: #ffffff !important;
  border: 1px solid rgba(74,61,43,0.22) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
}
@media (min-width: 640px) {
  [data-deals-track] .deals__card,
  [data-product-slider] .deals__card {
    min-width: 200px !important;
    max-width: 220px !important;
  }
}
@media (min-width: 1024px) {
  [data-deals-track] .deals__card,
  [data-product-slider] .deals__card {
    min-width: 220px !important;
    max-width: 240px !important;
  }
}

/* ============================================================
   DEALS — CSS marquee (same pattern as Shop by Brand / Collections)
   Auto-scroll + pause on hover
   ============================================================ */

/* Wrapper clips the overflow */
.deals__marquee-wrap {
  overflow: hidden !important;
  position: relative !important;
  margin-top: 18px !important;
}

/* Edge fade gradients */
.deals__marquee-wrap::before,
.deals__marquee-wrap::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 40px !important;
  z-index: 2 !important;
  pointer-events: none !important;
}
.deals__marquee-wrap::before {
  left: 0 !important;
  background: linear-gradient(to right, #transparent, transparent) !important;
}
.deals__marquee-wrap::after {
  right: 0 !important;
  background: linear-gradient(to left, #transparent, transparent) !important;
}

/* The marquee track — reuse the same @keyframes marquee */
.deals__marquee {
  display: flex !important;
  width: max-content !important;
  animation: marquee 60s linear infinite !important;
  will-change: transform !important;
  overflow: visible !important;
}
.deals__marquee:hover { animation-play-state: paused !important; }

/* Each duplicated group — horizontal flex row */
.deals__marquee-group {
  display: flex !important;
  gap: 12px !important;
  padding-right: 12px !important;
  flex-shrink: 0 !important;
}

/* Card — fixed width for smooth marquee */
.deals__marquee .deals__card,
.deals__marquee-group .deals__card {
  flex: 0 0 auto !important;
  width: 200px !important;
  min-width: 200px !important;
  max-width: 200px !important;
  scroll-snap-align: none !important;
}
@media (max-width: 767px) {
  .deals__marquee .deals__card,
  .deals__marquee-group .deals__card {
    width: 170px !important;
    min-width: 170px !important;
    max-width: 170px !important;
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .deals__marquee { animation-duration: 200s !important; }
}

/* Override the earlier slider-style rules so they don't fight marquee */
.deals__marquee[data-deals-track],
.deals__marquee[data-deals-slider] {
  overflow: visible !important;
  scroll-snap-type: none !important;
  padding-bottom: 0 !important;
  -webkit-overflow-scrolling: auto !important;
}

/* ============================================================
   SHOP BY BRAND — fix long brand names (PULL & BEAR, LOUIS VUITTON, etc.)
   Give wider logos more space so they don't get squished
   ============================================================ */
.shop-by-brand__item {
  width: auto !important;
  min-width: 120px !important;
  max-width: none !important;
  padding: 0 22px !important;
}
.shop-by-brand__item img,
.shop-by-brand__svg-logo {
  width: auto !important;
  max-width: none !important;
  height: 40px !important;
  max-height: 40px !important;
}
@media (max-width: 640px) {
  .shop-by-brand__item {
    min-width: 100px !important;
    padding: 0 14px !important;
  }
  .shop-by-brand__item img,
  .shop-by-brand__svg-logo {
    height: 32px !important;
    max-height: 32px !important;
  }
}

/* ============================================================
   FINAL OVERRIDES — these win over every rule before
   ============================================================ */

/* ===== PAGINATION — final clean slate ===== */
/* Reset everything first */
.pagination,
.pagination * {
  all: revert !important;
}

.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 32px 0 16px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  list-style: none !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* Every link / span inside pagination is a clean circle chip */
.pagination a,
.pagination span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #2a1f17 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background 0.2s, color 0.2s !important;
}

/* Hover on any link */
.pagination a:hover {
  background: rgba(74, 61, 43, 0.08) !important;
  color: #2a1f17 !important;
}

/* Active page — filled brown circle */
.pagination .page.current,
.pagination span.page.current,
.pagination .active,
.pagination [aria-current="page"] {
  background: #4a3d2b !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* Prev / Next */
.pagination .prev a,
.pagination .next a,
.pagination .prev,
.pagination .next {
  background: transparent !important;
  color: #2a1f17 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}

/* Ellipsis "…" */
.pagination .deco {
  background: transparent !important;
  color: rgba(74, 61, 43, 0.4) !important;
  cursor: default !important;
}

/* Mobile */
@media (max-width: 480px) {
  .pagination a,
  .pagination span {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    font-size: 12px !important;
  }
}

/* ===== SHOP BY BRAND — force wider container for long brands ===== */
.shop-by-brand__item {
  width: auto !important;
  min-width: 130px !important;
  max-width: 260px !important;
  padding: 0 24px !important;
  height: 64px !important;
  box-sizing: border-box !important;
}
.shop-by-brand__item img,
.shop-by-brand__svg-logo {
  width: auto !important;
  max-width: 200px !important;
  height: 36px !important;
  max-height: 36px !important;
  object-fit: contain !important;
}
@media (max-width: 640px) {
  .shop-by-brand__item {
    min-width: 110px !important;
    padding: 0 16px !important;
    height: 56px !important;
  }
  .shop-by-brand__item img,
  .shop-by-brand__svg-logo {
    max-width: 160px !important;
    height: 30px !important;
    max-height: 30px !important;
  }
}

/* ===== SEARCH PAGE ===== */
.search-page {
  background: #eeeeea;
  padding: 40px 0 80px;
  min-height: 60vh;
}
.search-page__header {
  text-align: center;
  margin-bottom: 24px;
}
.search-page__title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(22px, 4vw, 30px);
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #2a1f17;
  margin: 0 0 8px;
  text-transform: uppercase;
}
.search-page__term {
  color: #4a3d2b;
  font-weight: 700;
}
.search-page__count {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: rgba(74, 61, 43, 0.6);
  margin: 0;
}

/* Search form */
.search-page__form {
  max-width: 640px;
  margin: 0 auto 32px;
}
.search-page__input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.15);
  border-radius: 9999px;
  padding: 6px 6px 6px 18px;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.search-page__input-wrap:focus-within {
  border-color: #4a3d2b;
  box-shadow: 0 0 0 3px rgba(74, 61, 43, 0.1);
}
.search-page__input-wrap > svg {
  width: 18px;
  height: 18px;
  stroke: rgba(74, 61, 43, 0.55);
  fill: none;
  flex-shrink: 0;
}
.search-page__input-wrap input[type="search"] {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: #2a1f17;
  padding: 10px 0;
  min-width: 0;
}
.search-page__input-wrap input[type="search"]::-webkit-search-cancel-button { display: none; }
.search-page__clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  color: rgba(74, 61, 43, 0.6);
  transition: background 0.2s, color 0.2s;
  flex-shrink: 0;
}
.search-page__clear:hover {
  background: rgba(74, 61, 43, 0.1);
  color: #a83a32;
}
.search-page__submit {
  background: #4a3d2b;
  color: #ffffff;
  border: none;
  border-radius: 9999px;
  padding: 10px 22px;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.2s;
}
.search-page__submit:hover { background: #2a1f17; }

/* Empty state */
.search-page__empty {
  text-align: center;
  padding: 48px 24px;
  background: #e8e8e3;
  border: 1px dashed rgba(74, 61, 43, 0.2);
  border-radius: 16px;
  max-width: 560px;
  margin: 0 auto;
}
.search-page__empty svg {
  color: rgba(74, 61, 43, 0.5);
  margin-bottom: 16px;
}
.search-page__empty h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #2a1f17;
  margin: 0 0 6px;
}
.search-page__empty p {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: rgba(74, 61, 43, 0.68);
  margin: 0 0 24px;
}
.search-page__suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

/* Placeholder (before any search) */
.search-page__placeholder {
  text-align: center;
  padding: 24px 0 40px;
}
.search-page__placeholder p {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: rgba(74, 61, 43, 0.65);
  margin: 0 0 20px;
}
.search-page__chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.15);
  border-radius: 9999px;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #2a1f17;
  letter-spacing: 0.04em;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, transform 0.15s;
}
.search-page__chip:hover {
  background: #e8e8e3;
  border-color: #4a3d2b;
  transform: translateY(-1px);
}

/* ============================================================
   NEW CLEAN PAGINATION — uses a single BEM class per button
   so there's zero nesting and zero style stacking.
   ============================================================ */
.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  padding: 32px 0 16px !important;
  margin: 0 !important;
  list-style: none !important;
  font-family: 'Montserrat', sans-serif !important;
}

.pagination__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  color: #2a1f17 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background 0.18s, color 0.18s !important;
}

.pagination__btn:hover {
  background: rgba(74, 61, 43, 0.08) !important;
  color: #2a1f17 !important;
}

/* Active page */
.pagination__btn.is-current {
  background: #4a3d2b !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  cursor: default !important;
}
.pagination__btn.is-current:hover { background: #4a3d2b !important; }

/* Prev / Next arrows */
.pagination__btn--prev,
.pagination__btn--next {
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* Dots (…) and disabled arrows */
.pagination__btn--dots,
.pagination__btn.is-disabled {
  color: rgba(74, 61, 43, 0.35) !important;
  cursor: default !important;
  pointer-events: none !important;
}
.pagination__btn--dots:hover,
.pagination__btn.is-disabled:hover {
  background: transparent !important;
}

/* Mobile */
@media (max-width: 480px) {
  .pagination__btn {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    font-size: 12px !important;
  }
  .pagination__btn--prev,
  .pagination__btn--next { font-size: 14px !important; }
}

/* Make pagination span the full grid row so it centers under the products */
.product-grid .pagination,
.product-grid--collection .pagination {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
}

/* ============================================================
   FINAL FIXES — Hero desktop, Drawer global, Dropdown hover
   ============================================================ */

/* ===== HERO SLIDER — clean desktop reset ===== */
.hero-slider {
  position: relative !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #eeeeea !important;
}
.hero-slider__track {
  display: flex !important;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}
.hero-slider__slide {
  flex: 0 0 100% !important;
  min-width: 100% !important;
  position: relative !important;
  height: clamp(340px, 56vw, 520px) !important;
  background: #eeeeea !important;
  border-radius: 0 !important;
}
.hero-slider__image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.hero-slider__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.hero-slider__overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    to right,
    rgba(247, 244, 237, 0.88) 0%,
    rgba(247, 244, 237, 0.55) 32%,
    rgba(247, 244, 237, 0.15) 60%,
    rgba(247, 244, 237, 0) 80%
  ) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
.hero-slider__content {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 40px !important;
  max-width: 560px !important;
}

/* Desktop sizing */
@media (min-width: 768px) {
  .hero-slider__slide {
    height: clamp(360px, 42vw, 460px) !important;
  }
  .hero-slider__content {
    padding: 48px 56px !important;
    max-width: 560px !important;
  }
  .hero-slider__overlay {
    background: linear-gradient(
      to right,
      rgba(247, 244, 237, 0.85) 0%,
      rgba(247, 244, 237, 0.50) 30%,
      rgba(247, 244, 237, 0.12) 55%,
      rgba(247, 244, 237, 0) 75%
    ) !important;
  }
}
@media (min-width: 1280px) {
  .hero-slider__slide { height: 460px !important; }
}

/* Mobile overlay - bottom to top so text sits under product */
@media (max-width: 767px) {
  .hero-slider__overlay {
    background: linear-gradient(
      to top,
      rgba(247, 244, 237, 0.95) 0%,
      rgba(247, 244, 237, 0.78) 30%,
      rgba(247, 244, 237, 0.25) 60%,
      rgba(247, 244, 237, 0) 85%
    ) !important;
  }
  .hero-slider__content {
    justify-content: flex-end !important;
    padding: 20px 20px 40px !important;
    max-width: 100% !important;
  }
}

/* Per-slide crop tuning (desktop) */
@media (min-width: 768px) {
  .hero-slider__slide--1 .hero-slider__image img { object-position: 78% 55% !important; }
  .hero-slider__slide--2 .hero-slider__image img { object-position: 55% 72% !important; }
  .hero-slider__slide--3 .hero-slider__image img { object-position: 62% 62% !important; }
  .hero-slider__slide--4 .hero-slider__image img { object-position: 55% 68% !important; }
}
/* Mobile */
@media (max-width: 767px) {
  .hero-slider__slide--1 .hero-slider__image img { object-position: 60% 40% !important; }
  .hero-slider__slide--2 .hero-slider__image img { object-position: 50% 45% !important; }
  .hero-slider__slide--3 .hero-slider__image img { object-position: 55% 45% !important; }
  .hero-slider__slide--4 .hero-slider__image img { object-position: 50% 45% !important; }
}

/* ===== DESKTOP DROPDOWN — fix hover gap + improve UX ===== */
.nav-bar__item {
  position: relative !important;
}
/* Invisible hover bridge so the dropdown doesn't close when crossing the 8px gap */
.nav-bar__item::after {
  content: '' !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  height: 12px !important;
  background: transparent !important;
  pointer-events: none !important;
}
.nav-bar__item:hover::after {
  pointer-events: auto !important;
}
.nav-bar__dropdown {
  display: block !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(8px) !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  margin-top: 8px !important;
  background: #ffffff !important;
  border: 1px solid rgba(74, 61, 43, 0.1) !important;
  border-radius: 12px !important;
  min-width: 200px !important;
  padding: 8px 0 !important;
  z-index: 500 !important;
  box-shadow: 0 8px 24px rgba(74, 61, 43, 0.12) !important;
  transition: opacity 0.2s, visibility 0.2s, transform 0.2s !important;
}
.nav-bar__item:hover .nav-bar__dropdown,
.nav-bar__item:focus-within .nav-bar__dropdown {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}
.nav-bar__dropdown-link {
  display: block !important;
  padding: 10px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #2a1f17 !important;
  transition: background 0.15s, color 0.15s !important;
  font-family: 'Montserrat', sans-serif !important;
}
.nav-bar__dropdown-link:hover {
  background: #f5f3ee !important;
  color: #4a3d2b !important;
}

/* ===== DRAWER HOVER — keep bg white (mobile) ===== */
.drawer-menu .drawer-menu__btn:hover,
.drawer-menu .drawer-menu__btn:active,
.drawer-menu .drawer-menu__btn:focus,
.drawer-menu .drawer-menu__sublink:hover,
.drawer-menu .drawer-menu__sublink:active,
.drawer-menu .drawer-menu__sublink:focus {
  background: #ffffff !important;
  color: #2a1f17 !important;
}

/* ===== ENSURE DRAWER WORKS ON ALL TEMPLATES ===== */
[data-drawer-open] {
  cursor: pointer !important;
  z-index: 10 !important;
  position: relative !important;
  pointer-events: auto !important;
}
.drawer-backdrop,
.drawer-menu {
  pointer-events: auto !important;
}
.drawer-backdrop:not(.is-open) {
  pointer-events: none !important;
}

/* Force pagination to the center regardless of parent flex/grid */
.pagination {
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  display: flex !important;
}

/* ============================================================
   PAGE HEADER / SUBTITLE
   ============================================================ */
.page-content__header {
  text-align: center;
  margin-bottom: 28px;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
.page-content__subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: rgba(74, 61, 43, 0.65);
  line-height: 1.6;
  margin: 10px 0 0;
}

/* ============================================================
   FAQ — accordion list with default content
   ============================================================ */
.faq-list {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.faq-item {
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.1);
  border-radius: 12px;
  padding: 0;
  overflow: hidden;
  transition: box-shadow 0.2s, border-color 0.2s;
}
.faq-item[open] {
  border-color: rgba(74, 61, 43, 0.22);
  box-shadow: 0 4px 12px rgba(74, 61, 43, 0.06);
}
.faq-item__q {
  list-style: none;
  cursor: pointer;
  padding: 16px 20px;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #2a1f17;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  user-select: none;
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__q svg {
  flex-shrink: 0;
  color: rgba(74, 61, 43, 0.55);
  transition: transform 0.2s;
}
.faq-item[open] .faq-item__q svg {
  transform: rotate(180deg);
}
.faq-item__a {
  padding: 0 20px 18px;
  font-family: 'Montserrat', sans-serif;
  font-size: 13.5px;
  line-height: 1.65;
  color: rgba(42, 31, 23, 0.82);
}
.faq-item__a p { margin: 0; }
.faq-item__a p + p { margin-top: 10px; }
.faq-item__a a {
  color: #a83a32;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.faq-item__a strong { color: #2a1f17; }

/* FAQ CTA block */
.faq-cta {
  max-width: 800px;
  margin: 36px auto 0;
  padding: 28px 24px;
  text-align: center;
  background: #e8e8e3;
  border-radius: 14px;
  border: 1px dashed rgba(74, 61, 43, 0.2);
}
.faq-cta p {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #2a1f17;
  margin: 0 0 14px;
}
.faq-cta .btn {
  margin: 4px 6px;
}

/* ============================================================
   TRACK ORDER — additional stages section
   ============================================================ */
.track-page__section-title {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #2a1f17;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-align: center;
  margin: 36px 0 18px;
}
.track-page__stages {
  max-width: 820px;
  margin: 0 auto;
}
.track-stages {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 640px) {
  .track-stages { grid-template-columns: repeat(2, 1fr); gap: 14px; }
}
@media (min-width: 900px) {
  .track-stages { grid-template-columns: repeat(4, 1fr); }
}
.track-stage {
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.1);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s;
}
.track-stage:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(74, 61, 43, 0.08);
}
.track-stage__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #e8e8e3;
  color: #4a3d2b;
  margin-bottom: 10px;
}
.track-stage h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #2a1f17;
  margin: 0 0 6px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.track-stage p {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  line-height: 1.55;
  color: rgba(42, 31, 23, 0.72);
  margin: 0;
}

/* Track page notes — 3-col on desktop now */
.track-page__notes {
  grid-template-columns: 1fr !important;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 640px) {
  .track-page__notes { grid-template-columns: repeat(3, 1fr) !important; }
}
.track-page__note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.track-page__note-icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #e8e8e3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #4a3d2b;
}

/* ============================================================
   POLICIES — richer default content styling
   ============================================================ */
.page-content--policy .page-content__body h2 {
  margin-top: 8px !important;
}
.page-content--policy .page-content__body h2:first-of-type {
  margin-top: 0 !important;
}
.page-content--policy .page-content__body ol {
  padding-left: 22px !important;
  margin: 0 0 16px !important;
}
.page-content--policy .page-content__body ol li {
  margin-bottom: 8px !important;
}

/* ============================================================
   CART PAGE — redesigned: image left, info right, aligned
   ============================================================ */
.cart-page {
  background: #eeeeea;
  padding: 32px 0 80px;
  min-height: 60vh;
}
.cart-page__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 22px;
  padding: 0 4px;
}
.cart-page__title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(22px, 3.6vw, 30px);
  font-weight: 800;
  color: #2a1f17;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0;
}
.cart-page__count {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: rgba(74, 61, 43, 0.6);
  margin: 0;
}

/* Grid: items left, summary right */
.cart-page__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 900px) {
  .cart-page__grid {
    grid-template-columns: minmax(0, 1.8fr) minmax(280px, 1fr);
    gap: 28px;
    align-items: start;
  }
}

/* Items list */
.cart-page__items {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Single cart item — image left, details right */
.cart-page__item {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 14px;
  padding: 14px;
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.1);
  border-radius: 14px;
  transition: box-shadow 0.2s;
}
@media (min-width: 640px) {
  .cart-page__item {
    grid-template-columns: 140px 1fr;
    gap: 18px;
    padding: 18px;
  }
}
.cart-page__item:hover {
  box-shadow: 0 6px 18px rgba(74, 61, 43, 0.06);
}

/* Product image (LEFT) */
.cart-page__item-image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 10px;
  background: #f5f3ee;
}
.cart-page__item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s;
}
.cart-page__item:hover .cart-page__item-image img {
  transform: scale(1.04);
}

/* Product body (RIGHT) — aligned + split top/bottom */
.cart-page__item-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
}
.cart-page__item-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.cart-page__item-text {
  min-width: 0;
  flex: 1;
}
.cart-page__item-vendor {
  font-family: 'Montserrat', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: rgba(74, 61, 43, 0.6);
  text-transform: uppercase;
  margin: 0 0 4px;
}
.cart-page__item-title {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #2a1f17;
  line-height: 1.35;
  text-decoration: none;
  margin: 0 0 6px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cart-page__item-title:hover { color: #4a3d2b; }
.cart-page__item-variant {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: rgba(74, 61, 43, 0.7);
  line-height: 1.5;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.cart-page__item-variant strong {
  color: #2a1f17;
  font-weight: 600;
}

.cart-page__item-remove {
  background: transparent;
  border: 1px solid rgba(74, 61, 43, 0.15);
  border-radius: 50%;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(168, 58, 50, 0.75);
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  flex-shrink: 0;
}
.cart-page__item-remove:hover {
  background: #fdecea;
  color: #a83a32;
  border-color: rgba(168, 58, 50, 0.3);
}

/* Bottom: qty left, price right */
.cart-page__item-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: auto;
}

/* Quantity pill */
.cart-page__item-qty {
  display: inline-flex;
  align-items: center;
  gap: 0;
  background: #f5f3ee;
  border: 1px solid rgba(74, 61, 43, 0.12);
  border-radius: 9999px;
  padding: 3px;
  height: 36px;
}
.cart-page__qty-btn {
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 700;
  color: #2a1f17;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  line-height: 1;
  padding: 0;
}
.cart-page__qty-btn:hover { background: #ffffff; }
.cart-page__qty-value {
  min-width: 30px;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #2a1f17;
  padding: 0 4px;
}

/* Price group */
.cart-page__item-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  text-align: right;
}
.cart-page__item-compare {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: rgba(74, 61, 43, 0.45);
  text-decoration: line-through;
}
.cart-page__item-total {
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #2a1f17;
}

/* Summary sidebar */
.cart-page__summary {
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.1);
  border-radius: 14px;
  padding: 22px;
  position: sticky;
  top: 80px;
}
.cart-page__summary-title {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: #2a1f17;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(74, 61, 43, 0.08);
}
.cart-page__summary-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: #2a1f17;
  padding: 8px 0;
}
.cart-page__summary-muted { color: rgba(74, 61, 43, 0.55); font-size: 12px; }
.cart-page__summary-row--discount span:last-child { color: #1b8a4c; font-weight: 700; }
.cart-page__summary-row--total {
  margin-top: 10px;
  padding-top: 14px;
  border-top: 1px solid rgba(74, 61, 43, 0.1);
  font-size: 16px;
  font-weight: 800;
}
.cart-page__checkout {
  width: 100%;
  margin-top: 18px;
  padding: 14px 18px !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
}
.cart-page__continue {
  display: block;
  text-align: center;
  margin-top: 12px;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #4a3d2b;
  text-decoration: none !important;
}
.cart-page__continue:hover { text-decoration: underline !important; }

.cart-page__trust {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(74, 61, 43, 0.08);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cart-page__trust-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: rgba(74, 61, 43, 0.72);
}
.cart-page__trust-row svg {
  color: #4a3d2b;
  flex-shrink: 0;
}

/* Empty state */
.cart-page__empty {
  text-align: center;
  padding: 60px 24px;
  background: #e8e8e3;
  border: 1px dashed rgba(74, 61, 43, 0.2);
  border-radius: 16px;
  max-width: 520px;
  margin: 0 auto;
}
.cart-page__empty-icon {
  color: rgba(74, 61, 43, 0.5);
  margin-bottom: 14px;
  display: inline-flex;
}
.cart-page__empty h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: #2a1f17;
  margin: 0 0 6px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.cart-page__empty p {
  font-family: 'Montserrat', sans-serif;
  font-size: 13.5px;
  color: rgba(74, 61, 43, 0.72);
  margin: 0 0 22px;
  line-height: 1.6;
}

/* ============================================================
   FLOATING WHATSAPP BUTTON — on every page
   ============================================================ */
.whatsapp-float {
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #25d366;
  color: #ffffff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(37, 211, 102, 0.4);
  z-index: 900;
  transition: transform 0.2s, box-shadow 0.2s;
  text-decoration: none !important;
}
.whatsapp-float:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 10px 24px rgba(37, 211, 102, 0.5);
}
.whatsapp-float svg {
  width: 26px;
  height: 26px;
  fill: #ffffff;
}
.whatsapp-float__pulse {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid #25d366;
  opacity: 0.6;
  pointer-events: none;
  animation: whatsappPulse 2.2s ease-out infinite;
}
@keyframes whatsappPulse {
  0%   { transform: scale(1);   opacity: 0.55; }
  100% { transform: scale(1.6); opacity: 0; }
}

/* On mobile, lift above the bottom-nav bar */
@media (max-width: 767.98px) {
  .whatsapp-float {
    right: 14px;
    bottom: 80px;
    width: 50px;
    height: 50px;
  }
  .whatsapp-float svg { width: 22px; height: 22px; }
}

/* ============================================================
   PERFORMANCE & ACCESSIBILITY HARDENING
   ============================================================ */

/* Reduce paint cost: lazy-image skeletons */
img[loading="lazy"] {
  background: #f5f3ee;
}

/* Better focus outlines for keyboard users */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #4a3d2b;
  outline-offset: 2px;
  border-radius: 4px;
}
/* Hide outline on mouse click */
:focus:not(:focus-visible) { outline: none; }

/* Smooth scrolling (but respect reduced motion) */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* CLS prevention — reserve image container sizes */
.product-card__image { aspect-ratio: 1 / 1; }
.collections-grid__card { contain: layout paint; }

/* Print-safe */
@media print {
  .header, .footer, .announcement-bar, .mobile-drawer, .whatsapp-float,
  .bottom-nav, .hero-slider__nav, .hero-slider__dots { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
}

/* Respect system dark mode for root bg only */
@media (prefers-color-scheme: dark) {
  html { background: #4a3d2b; }
}

/* ============================================================
   LIST COLLECTIONS PAGE — /collections
   ============================================================ */
.list-collections-page {
  background: #eeeeea;
  padding: 40px 0 80px;
  min-height: 60vh;
}
.list-collections-page__header {
  text-align: center;
  margin-bottom: 32px;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 16px;
}
.list-collections-page__title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(24px, 4.5vw, 34px);
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #2a1f17;
  text-transform: uppercase;
  margin: 0 0 10px;
}
.list-collections-page__subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: rgba(74, 61, 43, 0.65);
  line-height: 1.6;
  margin: 0;
}

.list-collections-page__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
@media (min-width: 640px)  { .list-collections-page__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; } }
@media (min-width: 1024px) { .list-collections-page__grid { grid-template-columns: repeat(4, 1fr); gap: 20px; } }

.collection-tile {
  position: relative;
  display: block;
  background: #ffffff;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(74, 61, 43, 0.1);
  transition: transform 0.25s, box-shadow 0.25s;
  text-decoration: none !important;
}
.collection-tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(74, 61, 43, 0.12);
}

.collection-tile__image-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #e8e8e3;
}
.collection-tile__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.collection-tile:hover .collection-tile__image {
  transform: scale(1.05);
}
.collection-tile__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(74, 61, 43, 0.3);
}
.collection-tile__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(42, 31, 23, 0.55) 0%, transparent 60%);
  pointer-events: none;
}

.collection-tile__info {
  padding: 12px 14px 14px;
}
.collection-tile__title {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #2a1f17;
  margin: 0 0 4px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.collection-tile__count {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: 'Montserrat', sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  color: rgba(74, 61, 43, 0.6);
  margin: 0;
}
.collection-tile__arrow {
  color: #4a3d2b;
  font-weight: 700;
  transition: transform 0.2s;
}
.collection-tile:hover .collection-tile__arrow {
  transform: translateX(4px);
}

/* ============================================================
   SHOP BY BRAND — remove all per-item backgrounds/borders
   Logos sit directly on the section bg, no divider
   ============================================================ */
.shop-by-brand__item,
.shop-by-brand__item:hover,
.shop-by-brand__item:focus,
.shop-by-brand__item:active {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-right: none !important;
  border-left: none !important;
  box-shadow: none !important;
}
.shop-by-brand__svg-logo,
.shop-by-brand__item img {
  background: transparent !important;
  box-shadow: none !important;
}
/* Let the logos stand out more — softer grayscale, full opacity by default */
.shop-by-brand__item { opacity: 0.7 !important; }
.shop-by-brand__item:hover { opacity: 1 !important; }
.shop-by-brand__item img,
.shop-by-brand__svg-logo {
  filter: grayscale(0.3) !important;
}
.shop-by-brand__item:hover img,
.shop-by-brand__item:hover .shop-by-brand__svg-logo {
  filter: grayscale(0) !important;
}

/* ============================================================
   UNIVERSAL MARQUEE + SWIPE — Deals, Shop Collections, Shop by Brand
   Auto-scroll that pauses on hover/touch, drag/swipe resumes auto
   ============================================================ */

/* Any marquee track — JS controls the motion, no CSS animation */
[data-interactive-marquee] {
  display: flex !important;
  width: max-content !important;
  will-change: transform !important;
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}
[data-interactive-marquee]:active { cursor: grabbing !important; }

/* Prevent image drag ghost */
[data-interactive-marquee] img { pointer-events: none !important; }
[data-interactive-marquee] a { -webkit-user-drag: none !important; }

/* ============================================================
   HERO SLIDER — ABSOLUTE FINAL FIX
   Ensure slides are exactly 100% of the TRACK width, not the section
   ============================================================ */
.hero-slider {
  position: relative !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}
.hero-slider__track {
  display: flex !important;
  width: 100% !important;
  overflow: visible !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.hero-slider__slide {
  flex: 0 0 100% !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}

/* ============================================================
   SHOP COLLECTIONS CARDS — smaller images, no border-radius
   ============================================================ */
.collections-grid__card {
  border-radius: 0 !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  width: 180px !important;
  min-width: 180px !important;
  max-width: 180px !important;
  flex-shrink: 0 !important;
}
@media (max-width: 767px) {
  .collections-grid__card {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
  }
}
.collections-grid__img-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px !important;
  background: #ffffff !important;
  aspect-ratio: 1 / 1 !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  flex: 1 !important;
}
.collections-grid__img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  position: relative !important;
  inset: auto !important;
  transition: transform 0.4s ease !important;
}
.collections-grid__card:hover .collections-grid__img {
  transform: scale(1.06) !important;
}
.collections-grid__overlay {
  display: none !important;
}
.collections-grid__label-wrap {
  background: #eeeeee !important;
  padding: 10px 12px !important;
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  border-top: none !important;
}
.collections-grid__label {
  text-align: center !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #2a1f17 !important;
  line-height: 1.3 !important;
}

/* ============================================================
   SHOP COLLECTIONS — View All button matches section-header__link style
   ============================================================ */
.collections-grid__view-all {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #2a1f17 !important;
  background: transparent !important;
  border: 1px solid rgba(74, 61, 43, 0.2) !important;
  border-radius: 9999px !important;
  padding: 7px 16px !important;
  text-decoration: none !important;
  transition: background 0.2s, border-color 0.2s, color 0.2s !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
}
.collections-grid__view-all:hover {
  background: #4a3d2b !important;
  border-color: #4a3d2b !important;
  color: #ffffff !important;
}

/* ============================================================
   CUSTOMER REVIEWS SECTION
   ============================================================ */
.reviews-section {
  background: #e8e8e3;
  padding: 40px 0 44px;
}
.reviews-section__header {
  text-align: center;
  margin-bottom: 20px;
}
.reviews-section__title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(18px, 3vw, 24px);
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #2a1f17;
  text-transform: uppercase;
  margin: 0 0 6px;
}
.reviews-section__subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: rgba(74, 61, 43, 0.6);
  margin: 0;
}

/* Grid — horizontal scroll on mobile, 3-col on desktop */
.reviews-section__grid {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding: 2px 0 6px;
}
.reviews-section__grid::-webkit-scrollbar { display: none; }
@media (min-width: 768px) {
  .reviews-section__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    overflow: visible;
  }
}

/* Review card — compact on mobile */
.review-card {
  background: #ffffff;
  border: 1px solid rgba(74, 61, 43, 0.06);
  border-radius: 12px;
  padding: 14px 16px;
  min-width: 240px;
  max-width: 300px;
  flex-shrink: 0;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media (min-width: 768px) {
  .review-card { min-width: 0; max-width: none; padding: 18px 20px; }
}

.review-card__stars { display: flex; gap: 1px; }
.review-card__text {
  font-family: 'Montserrat', sans-serif;
  font-size: 12.5px;
  line-height: 1.55;
  color: rgba(42, 31, 23, 0.8);
  margin: 0;
  flex: 1;
}
.review-card__author {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
}
.review-card__avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #4a3d2b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  flex-shrink: 0;
}
.review-card__meta { display: flex; flex-direction: column; gap: 1px; }
.review-card__name {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #2a1f17;
}
.review-card__verified {
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  color: #1b8a4c;
  font-weight: 600;
}

/* Style Shopify's built-in language/country selector to match theme */
.shopify-cleanslate { display: block !important; }
localization-form,
.footer__localization,
.disclosure {
  display: block !important;
}

/* ============================================================
   ZOOM LIGHTBOX — pinch-to-zoom + double-tap zoom
   ============================================================ */
.product-zoom__slide {
  touch-action: manipulation !important;
  overflow: hidden !important;
}
.product-zoom__slide img {
  max-width: min(70vw, 70vh) !important;
  max-height: min(70vw, 70vh) !important;
  touch-action: pinch-zoom !important;
  cursor: zoom-in !important;
  transition: transform 0.3s ease !important;
  transform-origin: center center !important;
  object-fit: contain !important;
}
@media (max-width: 640px) {
  .product-zoom__slide img {
    max-width: min(82vw, 82vh) !important;
    max-height: min(82vw, 82vh) !important;
  }
}
.product-zoom__slide img.is-zoomed {
  cursor: zoom-out !important;
  transform: scale(2) !important;
}
.product-zoom__track {
  touch-action: pan-x pan-y pinch-zoom !important;
}

/* Product card hover — disabled */

/* ============================================================
   MOBILE BOTTOM NAV — FORCE horizontal row (fix vertical bug)
   ============================================================ */
.bottom-nav {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-around !important;
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 200 !important;
  background: #2a1f17 !important;
  padding: 6px 0 max(6px, env(safe-area-inset-bottom)) !important;
  height: auto !important;
  width: 100% !important;
  flex-wrap: nowrap !important;
}
.bottom-nav__item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 4px 6px !important;
  font-size: 10px !important;
  color: rgba(238, 238, 234, 0.7) !important;
  flex: 1 !important;
  min-width: 0 !important;
}
.bottom-nav__item.is-active {
  color: #ffffff !important;
}
.bottom-nav__item svg {
  width: 20px !important;
  height: 20px !important;
  stroke: currentColor !important;
  fill: none !important;
}
@media (min-width: 768px) {
  .bottom-nav { display: none !important; }
}

/* ============================================================
   PRODUCT PAGE GALLERY — cap desktop image size
   ============================================================ */
@media (min-width: 768px) {
  .product-page__gallery {
    max-width: 100% !important;
    margin: 0 !important;
  }
}

/* Use object-fit: contain so the shoe fits nicely (not cropped) with padding */
.product-page__slider-slide img {
  object-fit: contain !important;
  padding: 20px !important;
  background: #ffffff !important;
}

/* ============================================================
   MARQUEE — CSS animation auto-scroll (simple, reliable)
   ============================================================ */
/* Wraps clip the overflow */
.shop-by-brand__track-wrap,
.collections-grid__marquee-wrap,
.deals__marquee-wrap {
  overflow: hidden !important;
  position: relative !important;
}

/* Tracks auto-scroll via CSS keyframe */
.shop-by-brand__track,
.collections-grid__marquee,
.deals__marquee,
[data-interactive-marquee] {
  display: flex !important;
  width: max-content !important;
  animation: marquee 60s linear infinite !important;
  will-change: transform !important;
}

/* Pause on hover */
.shop-by-brand__track:hover,
.collections-grid__marquee:hover,
.deals__marquee:hover,
[data-interactive-marquee]:hover {
  animation-play-state: paused !important;
}

/* Groups stay flex rows */
.shop-by-brand__group,
.collections-grid__marquee-group,
.deals__marquee-group {
  display: flex !important;
  flex-shrink: 0 !important;
}

/* Buy It Now button */
.product-page__buy-now-btn {
  display: block !important;
  width: 100% !important;
  padding: 14px 20px !important;
  margin-top: 10px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: #4a3d2b !important;
  background: transparent !important;
  border: 2px solid #4a3d2b !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background 0.2s, color 0.2s !important;
}
.product-page__buy-now-btn:hover {
  background: #4a3d2b !important;
  color: #ffffff !important;
}




/* Announcement bar: final visibility and positioning */
.announcement-bar-section {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 300 !important;
  width: 100% !important;
}

.announcement-bar {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  top: auto !important;
  z-index: 1 !important;
}

.header-section,
.header {
  top: 36px !important;
}


/* Announcement bar: scroll with page and keep message visible */
.announcement-bar-section {
  position: relative !important;
  top: auto !important;
  z-index: 5 !important;
  width: 100% !important;
}

.announcement-bar {
  position: relative !important;
  top: auto !important;
  z-index: 1 !important;
  display: flex !important;
  min-height: 34px !important;
}

.announcement-bar__center {
  position: static !important;
  flex: 1 1 auto !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: none !important;
  overflow: visible !important;
}

.announcement-bar__message {
  position: static !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-align: center !important;
  z-index: 2 !important;
}

.header-section,
.header {
  top: 0 !important;
}


/* Keep the announcement message isolated from promo bubble styles */
.announcement-bar .announcement-bar__center {
  position: static !important;
  display: flex !important;
  flex: 1 1 auto !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  transform: none !important;
  overflow: visible !important;
}

.announcement-bar .announcement-bar__message {
  position: static !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  color: #ffffff !important;
}




sections/hero-slider.liquid/* Match hero slider size to the first 16:9 image */
.hero-slider {
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  min-height: 0 !important;
}

.hero-slider__track,
.hero-slider__slide {
  height: 100% !important;
  min-height: 0 !important;
}

.hero-slider__image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.hero-slider{aspect-ratio:16/9!important;height:auto!important;min-height:0!important}.hero-slider__track,.hero-slider__slide{height:100%!important;min-height:0!important}.hero-slider__image{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}.hero-slider__image img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}

/* Keep multi-image product galleries inside the product column. */
.product-page__slider-slide[hidden],
.product-page__thumb[hidden] { display: none !important; }
.product-page__grid,
.product-page__gallery,
.product-page__slider,
.product-page__slider-track {
  min-width: 0 !important;
    max-width: 100% !important;
    }
    .product-page__gallery,
    .product-page__slider,
    .product-page__slider-track {
      width: 100% !important;
      }
      .product-page__slider-slide {
        box-sizing: border-box !important;
          flex: 0 0 100% !important;
            min-width: 0 !important;
              max-width: 100% !important;
              }
              
.product-zoom__slide[hidden] { display: none !important; }

/* Product gallery: slightly shorter than square, with the full image visible. */
.product-page__gallery .product-page__slider {
  aspect-ratio: 1.15 / 1 !important;
}