/** Shopify CDN: Minification failed

Line 23:0 Unexpected "<"
Line 36:0 All "@import" rules must come first
Line 53:20 Unexpected "<"

**/
/* ==================== GLOBAL STYLES ==================== */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --primary-color: #000;
  --text-color: #333333;
  --background-color: #ffffff;
  --light-gray: #f5f5f5;
  --border-color: #e0e0e0;
}
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Kantumruy+Pro&display=swap" rel="stylesheet">

@font-face {
  font-family: 'Livingst';
  src: url('/cdn/shop/files/Livingst.ttf?v=1779222088') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


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






html, body {
  width: 100%;
  height: 100%;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, Livingst, Cormorant Garamond, sans-serif;
  color: var(--text-color);
  background: var(--background-color);
  line-height: 1.6;
}


.cormorant-garamond-<uniquifier> {
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


h1, h2, h4,
.section-title,
.collection-header h1,
.hero-title,
.footer-title {
  font-family: 'Cormorant Garamond', serif !important;
}

.hl-section-title h2{
  font-size:36px !important;
}


.hl-bs-heading h2{
  font-weight: 500 !important;
  font-size:36px !important;
}

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

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ==================== TYPOGRAPHY ==================== */

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  line-height: 1.2;
}

h1 {
  font-size: 48px;
}

h2 {
  font-size: 36px;
}

h3 {
  font-size: 24px;
}

p {
  color: #666;
  margin-bottom: 15px;
}

/* ==================== SECTIONS ==================== */

.section-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ==================== BUTTONS ==================== */

button, .button {
  font-family: inherit;
  
  transition: all 0.3s ease;
}

/* ==================== FORMS ==================== */

input, select, textarea {
  font-family: inherit;
  font-size: 14px;
}

/* ==================== UTILITY ==================== */

.text-center {
  text-align: center;
}

.mt-40 {
  margin-top: 40px;
}

.mb-40 {
  margin-bottom: 40px;
}

/* ==================== CART DRAWER ==================== */

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  
  text-decoration: none;
  border: none;
  cursor: pointer;
}

.button.primary {
  background: var(--primary-color);
  color: #fff;
}

.button.secondary {
  background: #f4f1e8;
  color: #333;
}

.cart-drawer {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: none;
}

.cart-drawer.active {
  display: block;
}

.cart-drawer__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}

.cart-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  width: min(420px, 100%);
  height: 100%;
  background: #fff;
  padding: 28px;
  display: flex;
  flex-direction: column;
  box-shadow: -24px 0 70px rgba(0, 0, 0, 0.18);
  transform: translateX(100%);
  animation: slideIn 0.3s forwards ease-out;
}

@keyframes slideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.cart-drawer__close {
  align-self: flex-end;
  border: none;
  background: transparent;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
  color: #222;
}

.cart-drawer__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 700;
  color: #222;
}

.cart-drawer__items {
  flex: 1;
  overflow-y: auto;
  padding-right: 4px;
}

.cart-drawer__empty {
  color: #555;
  line-height: 1.7;
}

.cart-item {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 16px;
  margin-bottom: 24px;
  border-bottom: 1px solid #eee;
  padding-bottom: 20px;
}

.cart-item__media img {
  border-radius: 18px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cart-item__details {
  display: grid;
  gap: 10px;
}

.cart-item__title {
  font-size: 15px;
  font-weight: 700;
  color: #222;
}

.cart-item__variant {
  font-size: 13px;
  color: #777;
}

.cart-item__price {
  font-size: 15px;
  font-weight: 700;
  color: #222;
}

.cart-item__quantity {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cart-item-qty-btn {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #ddd;
  background: #f7f4ef;
  cursor: pointer;
  font-size: 16px;
  color: #333;
}

.cart-item__remove {
  font-size: 13px;
}

.cart-item__remove a {
  color: var(--color-primary);
}

.cart-drawer__subtotal {
  display: flex;
  justify-content: space-between;
  margin-bottom: 18px;
  font-weight: 700;
}

.cart-drawer__actions {
  display: grid;
  gap: 12px;
}

@media (max-width: 768px) {
  .cart-drawer__panel {
    width: 100%;
  }

  .cart-item {
    grid-template-columns: 1fr;
  }
}

/* ==================== RESPONSIVE ==================== */

@media (max-width: 1024px) {
  h1 {
    font-size: 36px;
  }

  h2 {
    font-size: 28px;
  }
}

@media (max-width: 768px) {
  h1 {
    font-size: 28px;
  }

  h2 {
    font-size: 22px;
  }

  .section-container {
    padding: 0 15px;
  }
}

@media (max-width: 480px) {
  h1 {
    font-size: 22px;
  }

  h2 {
    font-size: 18px;
  }
}

/* ==================== ANIMATIONS ==================== */

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeIn 0.5s ease-out;
}

/* Editable product card styles */
.product-card { position: relative; background: #fff; border: 1px solid rgba(0,0,0,.08); overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; }
.product-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(0,0,0,.08); }
.product-card__media { position: relative; display: block; background: #f6f3ef; aspect-ratio: 1 / 1.18; overflow: hidden; text-decoration: none; }
.product-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.product-card:hover .product-card__media img { transform: scale(1.04); }
.product-card__placeholder { width: 100%; height: 100%; display:flex; align-items:center; justify-content:center; padding:20px; text-align:center; color:#999; }
.product-card__badge { position:absolute; top:12px; left:12px; background: var(--color-primary); color:#fff; border-radius:999px; padding:5px 10px; font-size:12px; font-weight:700; }
.product-card__info { padding:16px; text-align:center; }
.product-card__vendor { margin:0 0 6px; color: var(--color-light-text); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.product-card__title { margin:0 0 8px; font-size:16px; line-height:1.35; }
.product-card__title a { color: var(--color-text); text-decoration:none; }
.product-card__price { margin:0; color: #000; font-weight:700; }
.product-card__compare { color: var(--color-light-text); text-decoration: line-through; margin-right:6px; font-weight:400; }

/* Product card add to cart */
.product-card__form { margin-top: 14px; }
.product-card__cart-button {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 12px 18px;
  border: 1px solid var(--color-primary);
  border-radius: 999px;
  background: var(--color-primary);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  cursor: pointer;
  transition: transform .2s ease, opacity .2s ease, background .2s ease;
}
.product-card__cart-button:hover { transform: translateY(-1px); opacity: .92; }
.product-card__cart-button--soldout { background: #d5d0c7; border-color: #d5d0c7; cursor: not-allowed; opacity: .75; }

/* ==================== SUPER JOCK BROS DARK THEME ==================== */

:root {
  --sjb-dark: #0d0b08;
  --sjb-dark-2: #161310;
  --sjb-dark-3: #1e1a15;
  --sjb-gold: #c9a96e;
  --sjb-gold-light: #e2c898;
  --sjb-cream: #f4ede0;
  --sjb-muted: #8a7f74;
  --sjb-border: rgba(201, 169, 110, 0.18);
}

/* BODY */
html, body {
  background: var(--sjb-dark) !important;
  color: var(--sjb-cream) !important;
}

/* ---- ANNOUNCEMENT BAR ---- */
.announcement-bar {
  background: var(--sjb-dark-2) !important;
  border-bottom: 1px solid var(--sjb-border) !important;
  padding: 9px 0 !important;
}
.announcement-bar a,
.announcement-bar span,
.announcement-bar p,
.announcement-bar__message {
  color: var(--sjb-muted) !important;
  font-size: 11px !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
.announcement-bar svg,
.announcement-bar__icon {
  color: var(--sjb-gold) !important;
  fill: var(--sjb-gold) !important;
}

/* ---- HEADER ---- */
.site-header,
.header,
.header-wrapper {
  background: var(--sjb-dark) !important;
  border-bottom: 1px solid var(--sjb-border) !important;
}

.site-header a,
.header a,
.nav-link,
.header-link,
.cart-link {
  color: var(--sjb-cream) !important;
  letter-spacing: 1.5px !important;
}

.site-header a:hover,
.nav-link:hover,
.header-link:hover,
.cart-link:hover {
  color: var(--sjb-gold) !important;
  opacity: 1 !important;
}

.diamond-icon {
  color: var(--sjb-gold) !important;
}

.cart-count {
  background: var(--sjb-gold) !important;
  color: var(--sjb-dark) !important;
  font-weight: 800 !important;
}

/* Mega menu dark */
.sf-mega-menu {
  background: var(--sjb-dark-2) !important;
  border-top: 1px solid var(--sjb-border) !important;
  border-bottom: 2px solid var(--sjb-gold) !important;
}

.sf-mega-listing-heading {
  color: var(--sjb-cream) !important;
  border-bottom-color: var(--sjb-border) !important;
}
.sf-mega-listing-heading:hover {
  color: var(--sjb-gold) !important;
}
.sf-mega-listing-list a {
  color: var(--sjb-muted) !important;
}
.sf-mega-listing-list a:hover {
  color: var(--sjb-gold) !important;
}

/* Mobile nav dark */
.mobile-nav {
  background: var(--sjb-dark-2) !important;
  border-top: 1px solid var(--sjb-border) !important;
}
.mobile-nav-link,
.mobile-nav-sublink {
  color: var(--sjb-cream) !important;
  border-bottom-color: var(--sjb-border) !important;
}

/* Mobile toggle */
.mobile-menu-toggle {
  color: var(--sjb-cream) !important;
}

/* ---- HERO SLIDER ---- */
.hero-slider {
  background: var(--sjb-dark) !important;
}

.hero-slider__subheading {
  color: var(--sjb-gold) !important;
  font-family: 'Kantumruy Pro', sans-serif !important;
  letter-spacing: 4px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

.hero-slider__heading {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  color: #ffffff !important;
  font-weight: 300 !important;
  line-height: 1.0 !important;
  letter-spacing: -1px !important;
}

.hero-slider__description {
  color: rgba(244, 237, 224, 0.75) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  max-width: 520px !important;
}

/* Hero primary button → gold filled */
.hero-slider__button {
  background: var(--sjb-gold) !important;
  color: var(--sjb-dark) !important;
  border-color: var(--sjb-gold) !important;
  border-radius: 0 !important;
  padding: 14px 32px !important;
  font-size: 11px !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  font-family: 'Kantumruy Pro', sans-serif !important;
  transition: background 0.3s, color 0.3s !important;
}
.hero-slider__button:hover {
  background: var(--sjb-gold-light) !important;
  color: var(--sjb-dark) !important;
  border-color: var(--sjb-gold-light) !important;
  transform: none !important;
}

/* Hero secondary button → ghost gold */
.hero-slider__button--secondary {
  background: transparent !important;
  color: var(--sjb-cream) !important;
  border-color: rgba(244, 237, 224, 0.45) !important;
  border-radius: 0 !important;
  padding: 14px 32px !important;
  font-size: 11px !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
}
.hero-slider__button--secondary:hover {
  background: rgba(255,255,255,0.06) !important;
  border-color: var(--sjb-cream) !important;
  color: var(--sjb-cream) !important;
}

/* Hero dots */
.hero-slider__dot {
  border-color: rgba(201,169,110,0.5) !important;
}
.hero-slider__dot.is-active {
  background: var(--sjb-gold) !important;
  border-color: var(--sjb-gold) !important;
}

/* Hero arrows */
.hero-slider__arrow {
  border-color: rgba(201,169,110,0.35) !important;
  background: rgba(13,11,8,0.6) !important;
  color: var(--sjb-gold) !important;
}
.hero-slider__arrow:hover {
  background: rgba(201,169,110,0.15) !important;
}

/* ---- DISCOVER COLLECTIONS ---- */
.hl-collections-section {
  background: var(--sjb-dark-2) !important;
}

.hl-section-title h2 {
  color: var(--sjb-cream) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 300 !important;
  letter-spacing: 4px !important;
  font-size: 28px !important;
  text-transform: uppercase !important;
  position: relative !important;
  display: inline-block !important;
}

/* Gold underline decoration on section title */
.hl-section-title {
  position: relative !important;
}
.hl-section-title h2::after {
  content: "" !important;
  display: block !important;
  width: 40px !important;
  height: 1px !important;
  background: var(--sjb-gold) !important;
  margin: 10px auto 0 !important;
}

.hl-masonry-card {
  background: var(--sjb-dark-3) !important;
}

.hl-masonry-overlay {
  background: linear-gradient(to top, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.1) 60%) !important;
}

.hl-masonry-content h3 {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 300 !important;
  font-size: 26px !important;
  letter-spacing: 1px !important;
  text-transform: none !important;
  color: #ffffff !important;
  margin-bottom: 6px !important;
}

/* Collection badge (label above title) */
.hl-masonry-content p {
  font-size: 10px !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: var(--sjb-gold) !important;
  margin-bottom: 14px !important;
  font-weight: 600 !important;
}

/* Card shop button */
.hl-card-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: transparent !important;
  border: 1px solid rgba(201,169,110,0.5) !important;
  color: var(--sjb-cream) !important;
  padding: 8px 18px !important;
  font-size: 10px !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  border-radius: 0 !important;
  transition: background 0.3s, border-color 0.3s !important;
}
.hl-card-button::after {
  content: "→" !important;
  margin-left: 4px !important;
  color: var(--sjb-gold) !important;
}
.hl-masonry-card:hover .hl-card-button {
  background: rgba(201,169,110,0.12) !important;
  border-color: var(--sjb-gold) !important;
  color: var(--sjb-gold) !important;
}

/* Bottom "View all" link */
.hl-center-link a {
  color: var(--sjb-gold) !important;
  letter-spacing: 2px !important;
  font-size: 11px !important;
  border-bottom: 1px solid var(--sjb-border) !important;
  padding-bottom: 2px !important;
}
.hl-center-link a::after {
  content: " →" !important;
  color: var(--sjb-gold) !important;
}
.hl-center-link a:hover {
  border-bottom-color: var(--sjb-gold) !important;
}

/* ---- TRUST BAR (features bar) ---- */
.trust-bar,
.icon-with-text,
.features-bar,
[class*="icon-bar"],
[class*="usp-bar"] {
  background: var(--sjb-dark-3) !important;
  border-top: 1px solid var(--sjb-border) !important;
  border-bottom: 1px solid var(--sjb-border) !important;
}
.trust-bar *,
.features-bar *,
.icon-with-text * {
  color: var(--sjb-muted) !important;
}
.trust-bar svg,
.features-bar svg,
.icon-with-text svg {
  fill: var(--sjb-gold) !important;
  color: var(--sjb-gold) !important;
}

/* ---- GENERAL SECTIONS ---- */
.shopify-section {
  background: var(--sjb-dark) !important;
}

/* Rich text / tagline section */
.rich-text,
[class*="rich-text"] {
  color: var(--sjb-dark) !important;
}
.rich-text h1,
.rich-text h2,
.rich-text h3 {
  color: var(--sjb-cream) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 300 !important;
}
.rich-text p {
  color: var(--sjb-muted) !important;
}
/* Gold italic accent like "MADE TO LAST A LIFETIME" */
.rich-text em,
.rich-text__text em {
  color: var(--sjb-gold) !important;
  font-style: italic !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
}

/* ---- PRODUCT CARDS ---- */
.product-card {
  background: var(--sjb-dark-3) !important;
  border-color: var(--sjb-border) !important;
}
.product-card__title,
.product-card__title a {
  color: var(--sjb-cream) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 400 !important;
  font-size: 17px !important;
}
.product-card__price {
  color: var(--sjb-gold) !important;
  font-weight: 600 !important;
}
.product-card__vendor {
  color: var(--sjb-muted) !important;
}
.product-card__cart-button {
  background: transparent !important;
  border: 1px solid var(--sjb-border) !important;
  color: var(--sjb-cream) !important;
  border-radius: 0 !important;
  letter-spacing: 2px !important;
  font-size: 10px !important;
}
.product-card__cart-button:hover {
  background: var(--sjb-gold) !important;
  border-color: var(--sjb-gold) !important;
  color: var(--sjb-dark) !important;
}

/* ---- CART DRAWER ---- */
.cart-drawer__panel {
  background: var(--sjb-dark-2) !important;
  border-left: 1px solid var(--sjb-border) !important;
}
.cart-drawer__head {
  border-bottom-color: var(--sjb-border) !important;
}
.cart-drawer__head h3 {
  color: var(--sjb-cream) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 300 !important;
}
.cart-drawer__head p {
  color: var(--sjb-muted) !important;
}
.cart-drawer__close {
  background: rgba(201,169,110,0.1) !important;
  color: var(--sjb-cream) !important;
}
.cart-drawer__item {
  border-bottom-color: var(--sjb-border) !important;
}
.cart-drawer__title {
  color: var(--sjb-cream) !important;
}
.cart-drawer__variant {
  color: var(--sjb-muted) !important;
}
.cart-drawer__price {
  color: var(--sjb-gold) !important;
}
.cart-drawer__qty {
  background: rgba(201,169,110,0.08) !important;
}
.cart-drawer__qty a {
  background: var(--sjb-dark-3) !important;
  border-color: var(--sjb-border) !important;
  color: var(--sjb-cream) !important;
}
.cart-drawer__qty span {
  color: var(--sjb-cream) !important;
}
.cart-drawer__remove {
  color: var(--sjb-muted) !important;
}
.cart-drawer__foot {
  background: var(--sjb-dark-2) !important;
  border-top-color: var(--sjb-border) !important;
}
.cart-drawer__subtotal span {
  color: var(--sjb-cream) !important;
}
.cart-drawer__subtotal strong {
  color: var(--sjb-gold) !important;
}
.cart-drawer__btn--light {
  background: rgba(201,169,110,0.1) !important;
  color: var(--sjb-cream) !important;
}
.cart-drawer__btn--dark {
  background: var(--sjb-gold) !important;
  color: var(--sjb-dark) !important;
  font-weight: 800 !important;
}
.cart-drawer__btn--dark:hover {
  background: var(--sjb-gold-light) !important;
}
.cart-drawer__empty h4 {
  color: var(--sjb-cream) !important;
}
.cart-drawer__empty p {
  color: var(--sjb-muted) !important;
}
.cart-drawer__empty a {
  background: var(--sjb-gold) !important;
  color: var(--sjb-dark) !important;
}

/* ---- FOOTER ---- */
.site-footer,
.footer {
  background: #080705 !important;
  border-top: 1px solid var(--sjb-border) !important;
  color: var(--sjb-muted) !important;
}
.site-footer h2,
.site-footer h3,
.site-footer h4,
.footer h2,
.footer h3,
.footer h4 {
  color: var(--sjb-cream) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  font-size: 13px !important;
}
.site-footer a,
.footer a {
  color: var(--sjb-muted) !important;
  font-size: 13px !important;
  letter-spacing: 0.5px !important;
}
.site-footer a:hover,
.footer a:hover {
  color: var(--sjb-gold) !important;
}
.site-footer p,
.footer p {
  color: var(--sjb-muted) !important;
  font-size: 13px !important;
}

/* ---- SCROLLBAR ---- */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--sjb-dark-2); }
::-webkit-scrollbar-thumb { background: var(--sjb-border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--sjb-gold); }

/* ---- SELECTION ---- */
::selection {
  background: rgba(201,169,110,0.25);
  color: var(--sjb-cream);
}


/* =========================================================
   TWO SKIES HEADER ZOOM + MOBILE RESPONSIVE FIX
   Paste this at the very end of your complete CSS file
========================================================= */

/* Desktop compact fix for browser zoom / medium screens */
@media screen and (max-width: 1450px) {
  .site-header .header-container,
  .header-container {
    grid-template-columns: minmax(120px, 180px) minmax(0, 1fr) auto !important;
    gap: 18px !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  .site-header .logo,
  .logo {
    justify-content: flex-start !important;
    min-width: 0 !important;
  }

  .site-header .logo img,
  .logo img {
    max-width: 150px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .site-header .main-nav,
  .main-nav {
    gap: 24px !important;
    justify-content: center !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  .site-header .nav-link,
  .nav-link {
    font-size: 13px !important;
    letter-spacing: 2px !important;
    white-space: nowrap !important;
  }

  .site-header .header-right,
  .header-right {
    width: auto !important;
    min-width: 80px !important;
    gap: 16px !important;
    justify-content: flex-end !important;
    margin-top: 0 !important;
  }
}

/* More compact for zoomed desktop / small laptops */
@media screen and (max-width: 1280px) {
  .site-header .header-container,
  .header-container {
    grid-template-columns: minmax(100px, 145px) minmax(0, 1fr) auto !important;
    gap: 14px !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .site-header .logo img,
  .logo img {
    max-width: 125px !important;
  }

  .site-header .main-nav,
  .main-nav {
    gap: 18px !important;
  }

  .site-header .nav-link,
  .nav-link {
    font-size: 12px !important;
    letter-spacing: 1.6px !important;
  }

  .site-header .header-link--account,
  .site-header .header-link--register,
  .header-link--account,
  .header-link--register {
    display: none !important;
  }
}

/* Force mobile header earlier so browser zoom does not break layout */
@media screen and (max-width: 1180px) {
  .site-header {
    padding: 8px 0 !important;
  }

  .site-header .header-container,
  .header-container {
    grid-template-columns: 44px minmax(0, 1fr) 44px !important;
    gap: 10px !important;
    min-height: 58px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    align-items: center !important;
  }

  .site-header .main-nav,
  .main-nav {
    display: none !important;
  }

  .site-header .mobile-menu-toggle,
  .mobile-menu-toggle {
    display: inline-flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  .site-header .logo,
  .logo {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .site-header .logo-link,
  .logo-link,
  .site-header .logo a,
  .logo a {
    justify-content: center !important;
    max-width: 100% !important;
  }

  .site-header .logo img,
  .logo img {
    max-width: 135px !important;
    max-height: 42px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .site-header .header-right,
  .header-right {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 0 !important;
    margin-top: 0 !important;
  }

  .site-header .header-link--account,
  .site-header .header-link--register,
  .header-link--account,
  .header-link--register {
    display: none !important;
  }

  .site-header .cart-link,
  .cart-link {
    min-width: 36px !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
  }

  .site-header .cart-link svg,
  .cart-link svg {
    width: 21px !important;
    height: 21px !important;
  }

  .site-header .cart-count,
  .cart-count {
    position: absolute !important;
    top: -2px !important;
    right: -4px !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    font-size: 9px !important;
    line-height: 1 !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .site-header .sf-mega-menu,
  .sf-mega-menu {
    display: none !important;
  }

  body.mobile-nav-open {
    overflow: hidden !important;
  }

  .site-header .mobile-nav,
  .mobile-nav {
    display: none !important;
    background: var(--header-bg-color, #0d0b08) !important;
    border-top: 1px solid rgba(201, 169, 110, 0.18) !important;
  }

  .site-header .mobile-nav.is-open,
  .mobile-nav.is-open {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    max-height: calc(100vh - 70px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    background: var(--header-bg-color, #0d0b08) !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35) !important;
  }

  .site-header .mobile-nav-inner,
  .mobile-nav-inner {
    padding: 10px 18px 24px !important;
  }

  .site-header .mobile-nav-link,
  .mobile-nav-link {
    color: var(--header-text-color, #f4ede0) !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 15px 0 !important;
    border-bottom: 1px solid rgba(201, 169, 110, 0.18) !important;
    font-size: 13px !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
  }

  .site-header .mobile-nav-sublink,
  .mobile-nav-sublink {
    color: var(--header-text-color, #f4ede0) !important;
  }
}

/* Small mobile */
@media screen and (max-width: 480px) {
  .site-header .header-container,
  .header-container {
    grid-template-columns: 40px minmax(0, 1fr) 40px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    min-height: 54px !important;
  }

  .site-header .logo img,
  .logo img {
    max-width: 118px !important;
    max-height: 38px !important;
  }

  .site-header .menu-icon,
  .menu-icon {
    font-size: 26px !important;
    line-height: 1 !important;
  }

  .site-header .cart-link svg,
  .cart-link svg {
    width: 20px !important;
    height: 20px !important;
  }
}

/* Extra small mobile */
@media screen and (max-width: 360px) {
  .site-header .header-container,
  .header-container {
    grid-template-columns: 38px minmax(0, 1fr) 38px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .site-header .logo img,
  .logo img {
    max-width: 108px !important;
  }

  .site-header .cart-link,
  .cart-link {
    min-width: 32px !important;
    min-height: 32px !important;
  }
}

@media (max-width: 860px) {
  .header-right {
    grid-column: 1 / -1;
    justify-content: center;
    margin-top: 12px;
  }
}


.fic-card__text  p,.sgpb-card__text p{
  color:#000000 !important;
}


main,
#MainContent,
.main-content {
  min-height: 0 !important;
  height: auto !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Footer ko sirf content jitna rakho */
.site-footer,
.footer,
footer {
  min-height: 0 !important;
  height: auto !important;
  margin-bottom: 0 !important;
  padding-bottom: 40px !important;
}

/* Footer ke inner wrappers ka extra bottom remove */
.site-footer > *,
.footer > *,
footer > *,
.footer__content-top,
.footer__content-bottom,
.footer-bottom,
.site-footer__bottom,
.footer__bottom {
  min-height: 0 !important;
  height: auto !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Page ke last section ka bottom gap remove */
#MainContent .shopify-section:last-child,
main .shopify-section:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Kisi empty bottom spacer ko hide karo */
.footer-spacer,
.bottom-spacer,
.page-spacer,
.shopify-section:empty {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* =========================================================
   REAL STICKY FOOTER FIX
   
========================================================= */

html {
  min-height: 100% !important;
  height: auto !important;
  background: #ffffff !important;
}

body {
  min-height: 100vh !important;
  min-height: 100svh !important;
  height: auto !important;
  
  flex-direction: column !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #ffffff !important;
}

/* Main content viewport ka remaining space le */
main,
#MainContent,
.main-content {
  flex: 1 0 auto !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  background: #ffffff !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Shopify footer group / custom footer ko bottom par push karo */
.shopify-section-group-footer-group,
[id*="shopify-section-sections"][id*="footer"],
#shopify-section-footer,
footer,
.simple-footer,
.site-footer,
.footer {
  flex-shrink: 0 !important;
  margin-bottom: 0 !important;
}

/* Agar footer direct body child/group mein hai to auto margin kaam karega */
body > .shopify-section-group-footer-group,
body > [id*="shopify-section-sections"][id*="footer"],
body > footer,
body > .simple-footer,
body > .site-footer,
body > .footer {
  margin-top: auto !important;
}

/* Footer ke parents ko black background na lene do */
.shopify-section-group-footer-group,
[id*="shopify-section-sections"][id*="footer"] {
  background: transparent !important;
}

/* Last content section ka unnecessary bottom gap remove */
#MainContent > .shopify-section:last-child,
main > .shopify-section:last-child {
  margin-bottom: 0 !important;
}

/* Empty spacer remove */
.footer-spacer,
.page-spacer,
.bottom-spacer,
.shopify-section:empty {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}