/** Shopify CDN: Minification failed

Line 51:34 Expected ":"

**/
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --color-bg: #ffffff;
  --color-text: #000000;
  --color-primary: #1c0d00;
  --color-accent: #B8965A;
  --font-heading: 'Cormorant Garamond', serif;   /* ← headings */
  --font-body: 'Inter', sans-serif;       /* ← body/para */
}

/* ===== BODY ===== */
body {
  background-color: var(--color-bg);
  font-family: var(--font-body) !important;
  overflow-x: hidden !important;
}

/* ===== HEADINGS - Instrument Serif ===== */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-heading) !important;
}

/* ===== BODY TEXT - Avenir ===== */
p, span, li, div, input, textarea, select {
  font-family: var(--font-body) !important;
}

/* ===== LINKS ===== */
a {
  font-family: var(--font-body) !important;
}

a:hover {
  color: var(--color-primary) !important;
}

.highlight {
  color: var(--color-accent);
}

/* ===== ANNOUNCEMENT BAR - WHITE TEXT ===== */
.custom-announcement-bar,
.custom-announcement-bar * {
  color: #ffffff !important;header
}

/* ============================================================
   ALLURE HEADER OVERRIDES (theme defaults)
   ============================================================ */

.header__icon,
summary.header__icon,
.header__icon--cart,
.header__icon--search,
.header__icon--menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.header__icon:hover,
summary.header__icon:hover {
  background: transparent !important;
}

.header-wrapper {
  background: #fff !important;
}

.header__inline-menu a,
summary.header__menu-item span {
  color: #000 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1px;
  font-family: var(--font-body) !important;
}

.header__heading-link {
  color: #fff !important;
}

.header__icon svg,
summary.header__icon svg {
  fill: none !important;
  stroke: #fff !important;
  stroke-width: 1.8 !important;
}

header a, header span, header button span {
  color: #000000 !important;
}

/* Page-specific header text color overrides */
.header-section--transparent.is-hover .header a, 
.header-section--transparent.is-hover .header a span, 
.header-section--transparent.is-hover .header button,
.template-list-collections .header a, 
.template-list-collections .header a span, 
.template-list-collections .header button,
.template-collection .header a, 
.template-collection .header a span, 
.template-collection .header button,
.template-page .header a, 
.template-page .header a span, 
.template-page .header button,
.template-blog .header a, 
.template-blog .header a span, 
.template-blog .header button,
.template-product .header a, 
.template-product .header a span, 
.template-product .header button {
  color: #000 !important;
}



/* ============================================================
   ALL BUTTONS - Dark Brown
   ============================================================ */

.button,
.btn,
button[type="submit"],
input[type="submit"],
.add-to-cart,
.add-to-cart.button--secondary,
.product-form__submit,
.cart__checkout-button,
.cart-drawer__checkout,
.featured-blog__link,
.featured-blog__link.button--secondary,
[class*="button--"],
[class*="btn-"] {
  background-color: #4a2800 !important;
  color: #ffffff !important;
  border-color: #4a2800 !important;
  border-radius: 30px !important;
  transition: background-color 0.2s ease, border-color 0.2s ease !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  text-shadow: none !important;
  outline: none !important;
}

.button:hover,
.btn:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.add-to-cart:hover,
.add-to-cart.button--secondary:hover,
.product-form__submit:hover,
.cart__checkout-button:hover,
.cart-drawer__checkout:hover,
.featured-blog__link:hover,
.featured-blog__link.button--secondary:hover,
[class*="button--"]:hover,
[class*="btn-"]:hover {
  background-color: #B8965A !important;
  color: #4a2800 !important;
  border-color: #4a2800 !important;
}

.button span,
.btn span,
.add-to-cart span,
.add-to-cart.button--secondary span,
.featured-blog__link span,
[class*="button--"] span {
  color: #ffffff !important;
}

.button::before,
.button::after,
[class*="button--"]::before,
[class*="button--"]::after {
  display: none !important;
  content: none !important;
}

/* Add to Cart sizing */
.add-to-cart.button--secondary {
  height: 54px !important;
  min-height: 54px !important;
}

/* Shopify Pay Button */
.shopify-payment-button__button--unbranded {
  background-color: #000000 !important;
  color: #ffffff !important;
  border-radius: 0px !important;
  height: 54px !important;
  min-height: 54px !important;
  width: 100% !important;
}

.shopify-payment-button__button--unbranded:hover {
  background-color: #4a2800 !important;
  color: #ffffff !important;
}

/* ============================================================
   FOOTER FORM (Allure default)
   ============================================================ */

.footer-form__button {
  background: #B8965A !important;
  color: #4a2800 !important;
  font-weight: 700 !important;
  border: solid 2px #4a2800 !important;
  border-radius: 10px !important;
}

.footer-form__button:hover {
  background: #4a2800 !important;
  color: #B8965A !important;
  border: solid 2px #B8965A !important;
}

.footer-form__button span {
  color: #4a2800 !important;
}

.footer-form__button:hover span {
  color: #ffffff !important;
}

.footer-form__input {
  border: 1.5px solid #ffffff !important;
  background: transparent !important;
  color: #ffffff !important;
}

.footer-form__input::placeholder {
  color: #ffffff !important;
}

.footer__bottom-content-wrapper {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ============================================================
   PRODUCT PAGE DETAILS
   ============================================================ */

.product-drawers__item,
details summary {
  font-family: var(--font-body) !important;
  font-size: 16px !important;
  color: #111 !important;
  font-weight: 400 !important;
  letter-spacing: 0px !important;
  text-transform: none !important;
}

.product-options__option-label {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: #111 !important;
  font-weight: 500 !important;
  letter-spacing: 0px !important;
  text-transform: none !important;
}

details p {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: #1C4D3A !important;
  line-height: 1.7 !important;
}

.product-sales-point__text,
.product-sales-point__text strong,
.height-detail-summary {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: #111111 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.product-sales-point__text strong {
  font-weight: 700 !important;
}

.height-detail-accordion p {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: #555 !important;
  font-style: italic !important;
  line-height: 1.7 !important;
}



/* ============================================================
   ============================================================
   MELODIA PELLE — CUSTOM FOOTER
   ============================================================
   ============================================================ */

.mp-footer {
  background: linear-gradient(135deg, #1c0d00 0%, #4a2800 50%, #3a1f00 100%);
  color: #fff;
  font-family: var(--font-body) !important;
  padding: 60px 40px 0;
  margin-top: 0;
}


/* ===== 4 COLUMNS ===== */
.mp-footer-main {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.2fr;
  gap: 60px;
  padding: 50px 0;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.mp-footer-col {
  color: #d4c8b8;
}

/* ===== BRAND COLUMN ===== */
.mp-footer-logo {
  text-decoration: none;
  display: block;
  margin-bottom: 20px;
}

.mp-footer-logo h2 {
  color: #ffffff !important;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 2px;
  margin: 0;
  font-family: var(--font-body) !important;
}

.mp-footer-logo h2 span {
  color: #FCF5EE !important;
  font-family: var(--font-body) !important;
}

.mp-footer-tagline {
  color: #C6A76B !important;
  font-size: 11px;
  letter-spacing: 4px;
  margin: 5px 0 0 0;
  text-transform: uppercase;
}

.mp-footer-about {
  color: #b8ad9a !important;
  font-size: 14px;
  line-height: 1.8;
  margin-bottom: 25px;
}

/* ===== SOCIAL ICONS ===== */
.mp-footer-socials {
  display: flex;
  gap: 12px;
}

.mp-footer-socials a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff !important;
  transition: all 0.3s;
}

.mp-footer-socials a:hover {
  background: #C6A76B;
  border-color: #C6A76B;
  color: #fff !important;
}

/* ===== COLUMN HEADINGS ===== */
.mp-footer-heading {
  color: #fff !important;
  font-size: 14px !important;
  letter-spacing: 3px;
  font-weight: 700;
  margin: 0 0 25px 0;
  font-family: var(--font-body) !important;
  text-transform: uppercase;
}

/* ===== FOOTER LINKS ===== */
.mp-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mp-footer-links li {
  margin-bottom: 12px;
}

.mp-footer-links a {
  color: #b8ad9a !important;
  text-decoration: none;
  font-size: 14px;
  transition: color 0.3s;
  font-family: var(--font-body) !important;
}

.mp-footer-links a:hover {
  color: #C6A76B !important;
}

/* ===== CONTACT INFO ===== */
.mp-contact-item {
  margin-bottom: 18px;
}

.mp-contact-item h5 {
  color: #C6A76B !important;
  font-size: 13px;
  letter-spacing: 2px;
  font-weight: 600;
  margin: 0 0 5px 0;
  font-family: var(--font-body) !important;
  text-transform: uppercase;
}

.mp-contact-item p {
  color: #d4c8b8 !important;
  font-size: 14px;
  margin: 0;
  line-height: 1.6;
}

/* ===== BOTTOM BAR ===== */
.mp-footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  flex-wrap: wrap;
  gap: 20px;
}

.mp-footer-bottom-left p {
  color: #b8ad9a !important;
  font-size: 13px;
  margin: 0;
}

.mp-footer-bottom-center {
  display: flex;
  gap: 25px;
}

.mp-footer-bottom-center a {
  color: #b8ad9a !important;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.3s;
}

.mp-footer-bottom-center a:hover {
  color: #C6A76B !important;
}

.mp-footer-bottom-right {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.mp-payment-icon {
  background: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 46px;
  height: 28px;
  transition: transform 0.2s ease;
}

.mp-payment-icon:hover {
  transform: translateY(-2px);
}

.mp-payment-icon svg {
  width: 100%;
  height: 100%;
  max-width: 38px;
  max-height: 22px;
}

/* ============================================================
   HIDE SHOPIFY ORIGINAL FOOTER
   ============================================================ */

.shopify-section-footer-group > .footer,
.shopify-section--footer > .footer,
.shopify-section-footer > footer:not(.mp-footer),
footer.footer:not(.mp-footer) {
  display: none !important;
}

.footer-section,
.shopify-section-footer,
.shopify-section--footer {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ============================================================
   RESPONSIVE — FOOTER
   ============================================================ */

/* Tablet */
@media (max-width: 1024px) {
  .mp-footer {
    padding: 50px 25px 0;
  }
  
  .mp-footer-main {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  
  .mp-footer-brand {
    grid-column: 1 / -1;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .mp-footer {
    padding: 40px 20px 0;
  }
  
  .mp-newsletter-title {
    font-size: 15px !important;
    letter-spacing: 3px;
  }
  
  .mp-newsletter-desc {
    font-size: 14px;
    padding: 0 10px;
  }
  
  .mp-newsletter-form {
    flex-direction: column;
    gap: 10px;
  }
  
  .mp-newsletter-input,
  .mp-newsletter-btn {
    width: 100%;
  }
  
  .mp-footer-main {
    grid-template-columns: 1fr;
    gap: 35px;
    padding: 40px 0;
  }
  
  .mp-footer-logo h2 {
    font-size: 22px;
  }
  
  .mp-footer-about {
    font-size: 13px;
  }
  
  .mp-footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 15px;
  }
  
  .mp-footer-bottom-center {
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
  }
  
  .mp-footer-bottom-right {
    justify-content: center;
  }
}

/* Small Mobile */
@media (max-width: 480px) {
  .mp-footer {
    padding: 30px 15px 0;
  }
  
  .mp-footer-heading {
    font-size: 13px !important;
  }
  
  .mp-payment-icon {
    font-size: 10px;
    padding: 4px 8px;
  }
}


/* ============================================================
   FIX: Home page footer ke neeche white space remove
   ============================================================ */

/* Footer ke baad jo bhi empty space/section ho, hide kar */
.mp-footer ~ * {
  display: none !important;
}

/* Shopify ka footer wrapper aur uske parents space na le */
.shopify-section-footer-group,
.shopify-section-footer,
.shopify-section--footer,
.footer-section {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

/* Body aur main content ke baad ki extra space */
body > *:empty {
  display: none !important;
}

/* Footer ke andar content ke baad koi extra padding na ho */
.mp-footer {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.mp-footer-bottom {
  padding-bottom: 20px !important;
  margin-bottom: 0 !important;
}

/* Home page specific: agar koi empty white section ho footer ke neeche */
.template-index .shopify-section:last-child:empty,
.template-index .shopify-section-footer ~ section,
.template-index .shopify-section-footer ~ div {
  display: none !important;
}

/* Body ke last child ke baad koi space na aaye */
html, body {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#shopify-section-footer,
[id*="shopify-section-footer"] {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* ===== SINGLE LINE HEADER FIX ===== */
.header__container {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: 100% !important;
}

.header__logo {
  flex: 0 0 auto !important;
  min-width: fit-content !important;
}

/* Correct class - header-menu not header__nav */
.header-menu {
  flex: 1 1 auto !important;
  display: flex !important;
  justify-content: center !important;
  overflow: visible !important;
}

.header-menu__list--main {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
}

.header__utils {
  flex: 0 0 auto !important;
  min-width: fit-content !important;
}

/* Desktop - compress karo agar space kam ho */
@media screen and (min-width: 991px) and (max-width: 1200px) {
  .header-menu__item span span,
  .header-menu__item > span {
    font-size: 12px !important;
    letter-spacing: 0.3px !important;
  }

  .header__logo img {
    width: 90px !important;
  }

  .header-menu__list--main {
    gap: 4px !important;
  }
}

/* Mobile - nav hide, burger show */
@media screen and (max-width: 990px) {
  .header__container .header-menu {
    display: none !important;
    
  }


  .header__mobile-menu-wrapper {
    display: flex !important;
  }
}
.header-menu__item span,
.header-menu__item span span,
.header-menu__list--main > li a span,
.header-menu__list--main > li button span {
  white-space: nowrap !important;
}

.header-menu__list--main {
  gap: 2px !important; /* thoda aur compress */
}

/* Logo ko thoda chota karo space ke liye */
.header__logo img {
  width: 200px !important;
}


/* Menu items ke beech gap do */
.header-menu__list--main {
  gap: 20px !important;
}

.header__container {
  padding: 0 20px !important;
}

.header__logo {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

.header-menu__item span span {
  font-size: 14px !important; /* 👈 apni marzi ka size daal */
}
.header-menu__item:hover span,
.header-menu__item:hover span span,
.header-menu__item--active span,
.header-menu__item--active span span {
  font-weight: 400 !important;
  font-size: 10px !important;
}

.header-menu__list--nested .header-menu__item span,
.header-menu__list--nested a span {
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: 0.5px !important;
}

.header__icons svg {
  width: 18px !important;
  height: 18px !important;
}

.header__localization span,
.header__localization button span {
  font-size: 11px !important;
}

@media screen and (min-width: 991px) {
  .header__mobile-menu-wrapper {
    display: none !important;
  }
}

/* Logo ko thoda right shift karo */
.header__logo {
  margin-left: 50px !important;
  padding-left: 0 !important;
}

/* Menu left align karo - center se hata do */
.header-menu {
  flex: 1 1 auto !important;
  display: flex !important;
  justify-content: flex-start !important;
  margin-left: 32px !important;
}

/* Header padding upar neeche kam karo */
.header__container {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.header__container {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  padding-right:50px !important;
}

.header__logo img {
  height: 60px !important;
  width: auto !important;
}

.header-menu__item span::before,
.header-menu__item span::after,
.header-menu__item::before,
.header-menu__item::after {
  display: none !important;
  content: none !important;
  animation: none !important;
  transition: none !important;
}

.header-menu__item span {
  transition: none !important;
}

.header-menu__item:hover span {
  transform: none !important;
  transition: none !important;
}

.header-menu__list-nested-wrapper {
  width: 350px !important;
  background: #fff !important;
  padding: 2px !important;
}

.header-menu__list--nested {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 1px 1px !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-y: visible !important;
}

.header-menu__list--nested .header-menu__item,
.header-menu__list--nested a,
.header-menu__list--nested span {
  white-space: nowrap !important;
}

.header-menu__list--nested {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 1px 1px !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-y: visible !important;
  border: none !important;
  border-right: none !important;
  border-left: none !important;
}

.header-menu__list--nested .header-menu__item-wrapper {
  border: none !important;
}

/* ── Product Name — Cormorant Garamond ── */
.product__title,
.product-card__title,
.card__heading,
.card__heading a,
.product-item__title,
.product-item__title a {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.5px !important;
}

/* HEADER mobile responsive*/

/* =============================================
   MOBILE HEADER — logo center only
   ============================================= */
@media screen and (max-width: 990px) {

  .header__container {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    padding: 5px 40px !important;
  }

  .header__mobile-menu-wrapper {
    display: flex !important;
    justify-content: flex-start !important;
  }

  .header__logo {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
  }

  .header__logo img {
    height: 45px !important;
    width: auto !important;
  }

  .header__utils,
  .header__icons {
    display: flex !important;
    justify-content: flex-end !important;
  }

  .header-menu {
    display: none !important;
  }
}

/* =============================================
   MOBILE DRAWER — submenu header button
   ============================================= */
@media screen and (max-width: 990px) {
  button.button.button--secondary.button--with-icon.header-mobile__menu-item.header-mobile__menu-item--back {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    font-size: 11px !important;
    min-height: 32px !important;
    max-width:200px !important;
    margin-top: 4px !important;
    margin-bottom: 4px !important;
    margin-left:2px !important;
  }
}

/* ── Cart item count hide ── */
.header__cart-count,
.cart-count,
.cart-count-bubble,
[class*="cart-count"],
[class*="cart__count"] {
  display: none !important;
}

/* ── Account icon mobile header mein ── */
@media screen and (max-width: 990px) {
  .header__icon--account,
  .header__account-link,
  a[href*="/account"] {
    display: flex !important;
    pointer-events: auto !important;
    order: 2 !important;
  }
}

/* ── Header icons size ── */
@media screen and (max-width: 990px) {
  .header__icon svg,
  .header__icon--cart svg,
  .header__icon--account svg,
  .header__icons svg {
    width: 20px !important;
    height: 20px !important;
  }
}

/* Contact Info ke links - gold color, hover par underline nahi */
.mp-contact-item a {
  color: #b8ad9a !important;
  text-decoration: none !important;
  transition: opacity 0.2s ease;
}

.mp-contact-item a:hover,
.mp-contact-item a:focus {
  color: #C6A76B !important;
  text-decoration: none !important;
  opacity: 0.7;
}

/* ------------------------------------------------------------------------ */
/* Menu me flicker issue shi krne ke liye */
/* Nav elements ka area fix karo - sirf text shrink ho */
.header__nav-item a,
.site-nav__link,
.header__navigation a {
  display: inline-block;
  padding: 8px 12px; /* jo bhi original padding ho */
  min-width: max-content; /* ya ek fixed value jaise 80px */
  text-align: center;
  transition: font-size 0.2s ease;
}

/* Active page text small */
.header__nav-item.is-active a,
.header__nav-item a.is-active {
  font-size: 0.85em; /* jo bhi size tune kiya tha */
}

/* Hover pe sirf text small, area nahi */
.header__nav-item a:hover {
  font-size: 0.85em;
}

