/* ═══════════════════════════════════════════════════════════════
   IBRAHIM FASHION — Premium Polish Layer
   9.1.0 → 9.2.0 (P1 storefront refinement)

   Enqueued LAST so it refines (never replaces) the base system.
   Light ivory + restrained gold; iOS-inspired motion & material.

   01. Foundation & scrollbar
   02. Typography & rules
   03. Buttons & links
   04. Header, nav, tools
   05. Announcement bar
   06. Hero
   07. Cards (category / product / value / editorial)
   08. Drawers & overlays (search / mobile menu / mini-cart)
   09. Footer
   10. WooCommerce & accounts
   11. iOS-safe motion & safe-area
   ═══════════════════════════════════════════════════════════════ */

:root {
  color-scheme: light;

  --if-gold-sheen: linear-gradient(135deg, var(--if-gold-soft), var(--if-gold) 45%, var(--if-gold-deep));
  --if-hairline: linear-gradient(90deg, transparent, var(--if-gold) 30%, var(--if-gold) 70%, transparent);
  --if-shadow-glass: 0 1px 0 rgba(255, 255, 255, 0.6) inset, 0 12px 40px rgba(28, 27, 25, 0.08);
}

/* ─────────────────────────────────────────────────────────────
   01. FOUNDATION & SCROLLBAR
   ───────────────────────────────────────────────────────────── */

::selection {
  background: var(--if-gold-wash);
  color: var(--if-gold-deep);
}

* {
  -webkit-tap-highlight-color: transparent;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--if-header-h) + var(--if-announce-h));
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Slim gold-on-ivory scrollbar */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: var(--if-ivory);
}

::-webkit-scrollbar-thumb {
  background: var(--if-line-strong);
  border: 2px solid var(--if-ivory);
  border-radius: var(--if-r-pill);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--if-gold-soft);
}

@supports (scrollbar-color: var(--if-gold-soft) var(--if-ivory)) {
  * {
    scrollbar-color: var(--if-gold-soft) var(--if-ivory);
    scrollbar-width: thin;
  }
}

img {
  -webkit-user-drag: none;
  user-select: none;
}

/* ─────────────────────────────────────────────────────────────
   02. TYPOGRAPHY & RULES
   ───────────────────────────────────────────────────────────── */

.if-eyebrow,
.if-hero-slider__eyebrow,
.if-promo-banner__eyebrow {
  letter-spacing: var(--if-track-widest);
  text-transform: uppercase;
  color: var(--if-gold-deep);
}

.if-hero-slider__eyebrow::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 1px;
  margin-inline-end: 12px;
  vertical-align: middle;
  background: var(--if-gold);
}

.if-rule-gold {
  background: var(--if-gold);
}

.if-section__head h2,
.if-section__head h3 {
  font-weight: var(--if-fw-medium);
  letter-spacing: var(--if-track-tight);
}

/* ─────────────────────────────────────────────────────────────
   03. BUTTONS & LINKS
   ───────────────────────────────────────────────────────────── */

.if-btn {
  isolation: isolate;
  position: relative;
  overflow: hidden;
  -webkit-user-select: none;
  user-select: none;
}

.if-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -80%;
  width: 60%;
  height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  transform: skewX(-18deg);
  opacity: 0;
  z-index: 1;
  pointer-events: none;
}

.if-btn:active {
  transform: scale(0.98);
}

.if-btn--gold {
  background-image: var(--if-gold-sheen);
  box-shadow: var(--if-shadow-gold);
  background-size: 150% 100%;
  background-position: 100% 0;
  transition: background-position var(--if-dur-slow) var(--if-ease),
              transform var(--if-dur-fast) var(--if-ease-spring),
              box-shadow var(--if-dur) var(--if-ease);
}

.if-btn--gold:hover {
  background-position: 0 0;
  box-shadow: 0 8px 28px rgba(198, 161, 91, 0.35);
}

.if-btn--gold:hover::after,
.if-btn--primary:hover::after {
  animation: if-sheen 0.9s var(--if-ease);
}

@keyframes if-sheen {
  from { left: -80%; opacity: 1; }
  to   { left: 120%; opacity: 1; }
}

.if-btn--outline,
.if-btn--outline-light,
.if-btn--outline-gold {
  transition: transform var(--if-dur-fast) var(--if-ease-spring),
              background-color var(--if-dur) var(--if-ease),
              color var(--if-dur) var(--if-ease),
              border-color var(--if-dur) var(--if-ease);
}

.if-btn--outline:hover {
  background: var(--if-gold-wash);
  border-color: var(--if-gold);
}

.if-link-arrow {
  position: relative;
  font-weight: var(--if-fw-medium);
  letter-spacing: var(--if-track-wide);
  color: var(--if-gold-deep);
}

.if-link-arrow svg,
.if-link-arrow::after {
  transition: transform var(--if-dur) var(--if-ease-spring);
}

.if-link-arrow:hover {
  color: var(--if-charcoal);
}

.if-link-arrow:hover svg,
.if-link-arrow:hover::after {
  transform: translateX(4px);
}

/* ─────────────────────────────────────────────────────────────
   04. HEADER, NAV, TOOLS
   ───────────────────────────────────────────────────────────── */

.if-header {
  transition: background-color var(--if-dur) var(--if-ease),
              box-shadow var(--if-dur) var(--if-ease),
              border-color var(--if-dur) var(--if-ease),
              backdrop-filter var(--if-dur) var(--if-ease);
}

.if-header.is-scrolled {
  background: rgba(255, 255, 255, 0.86);
  -webkit-backdrop-filter: saturate(1.6) blur(14px);
  backdrop-filter: saturate(1.6) blur(14px);
  box-shadow: 0 1px 0 var(--if-line-soft), 0 10px 32px rgba(28, 27, 25, 0.06);
  border-bottom: 1px solid rgba(231, 224, 211, 0.8);
}

.if-nav__link::after {
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--if-dur) var(--if-ease);
}

.if-nav__link:hover::after,
.if-nav__link[aria-current="page"]::after {
  transform: scaleX(1);
}

.if-logo b,
.if-logo strong,
.if-footer__logo b,
.if-footer__logo strong {
  color: var(--if-gold-deep);
  font-weight: var(--if-fw-medium);
}

.if-icon-btn {
  position: relative;
  transition: background-color var(--if-dur-fast) var(--if-ease),
              color var(--if-dur-fast) var(--if-ease),
              transform var(--if-dur-fast) var(--if-ease-spring);
}

.if-icon-btn:hover {
  background: var(--if-gold-wash);
  color: var(--if-gold-deep);
}

.if-icon-btn:active {
  transform: scale(0.92);
}

.if-burger {
  color: var(--if-charcoal);
}

/* ─────────────────────────────────────────────────────────────
   05. ANNOUNCEMENT BAR
   ───────────────────────────────────────────────────────────── */

.if-announce__slide {
  font-weight: var(--if-fw-medium);
  letter-spacing: var(--if-track-wide);
}

.if-announce__dot {
  background: rgba(255, 255, 255, 0.35);
}

.if-announce__dot.is-active {
  background: var(--if-gold-soft);
}

/* ─────────────────────────────────────────────────────────────
   06. HERO
   ───────────────────────────────────────────────────────────── */

.if-hero-slider__copy {
  text-shadow: 0 2px 24px rgba(28, 27, 25, 0.35);
}

.if-hero-slider__title {
  font-weight: var(--if-fw-medium);
  letter-spacing: var(--if-track-tight);
}

.if-hero-slider__rule {
  background: var(--if-gold-soft);
  box-shadow: 0 0 0 1px rgba(220, 196, 142, 0.4);
}

.if-hero-slider__slide {
  transition: opacity 1.2s var(--if-ease);
}

.if-hero-slider__dot {
  transition: background-color var(--if-dur) var(--if-ease),
              transform var(--if-dur) var(--if-ease-spring);
}

.if-hero-slider__dot:hover {
  transform: scale(1.25);
}

/* ─────────────────────────────────────────────────────────────
   07. CARDS (category / product / value / editorial)
   ───────────────────────────────────────────────────────────── */

.if-category-card,
.if-product-card,
.if-value-card {
  transition: transform var(--if-dur) var(--if-ease-spring),
              box-shadow var(--if-dur) var(--if-ease);
}

.if-category-card:hover,
.if-product-card:hover,
.if-value-card:hover {
  transform: translateY(-6px);
}

.if-category-card {
  box-shadow: var(--if-shadow-xs);
}

.if-category-card:hover {
  box-shadow: var(--if-shadow-md);
}

.if-product-card__media {
  overflow: hidden;
  background: var(--if-champagne);
}

.if-product-card__img {
  transition: transform 0.6s var(--if-ease-out);
}

.if-product-card:hover .if-product-card__img {
  transform: scale(1.05);
}

.if-product-card:hover {
  box-shadow: var(--if-shadow-lg);
}

.if-product-card__body {
  transition: transform var(--if-dur) var(--if-ease);
}

.if-product-card:hover .if-product-card__body {
  transform: translateY(-2px);
}

.if-value-card {
  position: relative;
}

.if-value-card::after {
  content: "";
  position: absolute;
  left: var(--if-s5);
  right: var(--if-s5);
  bottom: 0;
  height: 1px;
  background: var(--if-hairline);
  opacity: 0;
  transition: opacity var(--if-dur) var(--if-ease);
}

.if-value-card:hover::after {
  opacity: 1;
}

.if-value-card__icon svg {
  transition: transform var(--if-dur) var(--if-ease-spring);
}

.if-value-card:hover .if-value-card__icon svg {
  transform: translateY(-3px) scale(1.06);
}

.if-editorial__media {
  box-shadow: var(--if-shadow-md);
}

/* ─────────────────────────────────────────────────────────────
   08. DRAWERS & OVERLAYS
   ───────────────────────────────────────────────────────────── */

.if-search-overlay,
.if-mobile-menu__overlay,
.if-cart-overlay {
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
}

.if-search-panel {
  box-shadow: var(--if-shadow-xl);
  border-bottom: 1px solid var(--if-line-soft);
  transition: transform var(--if-dur-slower) var(--if-ease-spring),
              box-shadow var(--if-dur) var(--if-ease);
}

.if-search-form {
  border-bottom-color: var(--if-gold);
}

.if-mobile-menu__panel,
.if-mini-cart__panel {
  box-shadow: var(--if-shadow-xl);
  transition: transform var(--if-dur-slower) var(--if-ease-spring);
}

.if-mobile-menu__body,
.if-mini-cart__body {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.if-mobile-nav__item {
  border-bottom-color: var(--if-line-soft);
}

.if-mobile-nav__link,
.if-mobile-nav__trigger {
  transition: background-color var(--if-dur-fast) var(--if-ease),
              color var(--if-dur-fast) var(--if-ease),
              padding-inline-start var(--if-dur) var(--if-ease);
}

.if-mobile-nav__link:hover,
.if-mobile-nav__trigger:hover {
  background: var(--if-gold-wash);
  color: var(--if-gold-deep);
}

.if-mobile-nav__sub a {
  position: relative;
  transition: color var(--if-dur-fast) var(--if-ease);
}

.if-mobile-nav__sub a:hover {
  color: var(--if-gold-deep);
}

/* ─────────────────────────────────────────────────────────────
   09. FOOTER
   ───────────────────────────────────────────────────────────── */

.if-footer {
  position: relative;
}

.if-footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(198, 161, 91, 0.55) 30%, rgba(198, 161, 91, 0.55) 70%, transparent);
}

.if-footer__title {
  letter-spacing: var(--if-track-wider);
  text-transform: uppercase;
  color: var(--if-gold-soft);
}

.if-footer__list a {
  position: relative;
  transition: color var(--if-dur-fast) var(--if-ease);
}

.if-footer__list a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background: var(--if-gold-soft);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--if-dur) var(--if-ease);
}

.if-footer__list a:hover {
  color: var(--if-gold-soft);
}

.if-footer__list a:hover::after {
  transform: scaleX(1);
}

/* ─────────────────────────────────────────────────────────────
   10. WOOCOMMERCE & ACCOUNTS
   ───────────────────────────────────────────────────────────── */

.woocommerce .onsale,
.woocommerce span.onsale,
.if-product-card__badges > span {
  border-radius: var(--if-r-pill);
  font-weight: var(--if-fw-medium);
  letter-spacing: var(--if-track-wide);
  text-transform: uppercase;
}

.woocommerce .products li.product .price,
.if-product-card__price {
  color: var(--if-gold-deep);
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  transition: background-color var(--if-dur) var(--if-ease),
              color var(--if-dur) var(--if-ease),
              transform var(--if-dur-fast) var(--if-ease-spring);
}

.woocommerce a.button:active,
.woocommerce button.button:active {
  transform: scale(0.98);
}

.woocommerce .stock,
.woocommerce .product .stock {
  font-weight: var(--if-fw-medium);
  letter-spacing: var(--if-track-wide);
  text-transform: uppercase;
}

.woocommerce-MyAccount-navigation ul li {
  border-radius: var(--if-r-md);
  overflow: hidden;
}

.woocommerce-MyAccount-navigation ul li a {
  position: relative;
  transition: background-color var(--if-dur) var(--if-ease),
              color var(--if-dur) var(--if-ease);
}

.woocommerce-MyAccount-navigation ul li.is-active a {
  background: var(--if-gold-wash);
  color: var(--if-gold-deep);
  font-weight: var(--if-fw-medium);
}

.woocommerce-MyAccount-navigation ul li.is-active a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--if-gold);
}

.woocommerce form input:focus,
.woocommerce form select:focus,
.woocommerce form textarea:focus,
.woocommerce input[type="text"]:focus,
.woocommerce input[type="email"]:focus,
.woocommerce input[type="tel"]:focus,
.woocommerce input[type="search"]:focus,
.woocommerce input[type="password"]:focus,
.woocommerce input[type="number"]:focus,
.if-search-form input:focus {
  border-color: var(--if-gold);
  box-shadow: 0 0 0 3px rgba(198, 161, 91, 0.18);
}

.woocommerce table.shop_table {
  border-radius: var(--if-r-lg);
  overflow: hidden;
}

/* ─────────────────────────────────────────────────────────────
   11. iOS-SAFE MOTION & SAFE-AREA
   ───────────────────────────────────────────────────────────── */

@supports (padding: max(0px)) {
  .if-header__inner,
  .if-footer__bottom,
  .if-mobile-menu__head,
  .if-mobile-menu__foot,
  .if-mini-cart__head,
  .if-mini-cart__foot {
    padding-left: max(var(--if-gutter), env(safe-area-inset-left));
    padding-right: max(var(--if-gutter), env(safe-area-inset-right));
  }

  .if-mobile-menu__panel,
  .if-mini-cart__panel {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

@media (prefers-reduced-motion: reduce) {
  .if-btn::after,
  .if-category-card:hover,
  .if-product-card:hover,
  .if-value-card:hover,
  .if-product-card:hover .if-product-card__img,
  .if-product-card:hover .if-product-card__body {
    animation: none;
    transition: none;
    transform: none;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PHASE S — MOBILE VISUAL COMPACTNESS (MOBILE VISUAL COMPACTNESS.md)
   Mobile-only ≤639px; desktop >639px untouched. premium.css is the
   last enqueued stylesheet, so this block wins equal-specificity ties.
   Measured before @375 evidence: /home/trader/if-evidence/visual-compactness/
   (sections__*, meas__*, probe__*). Spacing scale 4/8/12/16/24/32 only.
   No font-size changes (rule: never shrink below 14 — pre-existing
   micro-type documented as not-modified in the report).
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 639px) {

  .if-section {
    padding-block: 24px;
  }

  .if-section--flush {
    padding-block: 0;
  }

  .if-section--lg {
    padding-block: 24px;
  }

  .if-section__head {
    margin-bottom: 24px !important;
  }

  .if-grid--4,
  .if-grid--5 {
    gap: 16px;
  }

  .if-btn {
    padding-inline: 16px !important;
  }

  .if-grid--products,
  ul.products,
  .if-shop-products,
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    gap: 16px 16px !important;
  }

  .if-value-card {
    padding: 16px 16px;
  }

  .if-hero-slider__eyebrow {
    text-wrap: balance;
  }

  .if-pre-footer {
    padding-block: 32px;
  }

  .if-pre-footer p {
    margin-bottom: 16px;
  }

  .if-footer {
    padding-block: 24px 32px;
  }

  .if-footer__grid {
    gap: 16px;
  }

  .if-footer__col h3,
  .if-footer__title {
    margin-bottom: 12px;
  }

  .if-shop-hero,
  .if-shop-hero--light {
    padding-block: 24px !important;
  }

  .if-shop-hero__desc {
    margin-bottom: 16px !important;
  }

  .if-shop-body {
    padding-block: 24px !important;
  }

  .if-shop-toolbar {
    gap: 16px !important;
    margin-bottom: 16px !important;
  }

  .if-shop-curate {
    padding-block: 24px !important;
  }

  .if-shop-curate__points {
    gap: 16px !important;
  }

  .if-shop-curate__points li {
    padding: 16px !important;
  }

  .if-shop-curate__text {
    margin-bottom: 24px !important;
  }

  body.woocommerce-cart .woocommerce,
  body.woocommerce-account .woocommerce {
    gap: 24px !important;
  }

  .woocommerce-cart table.shop_table tr.cart_item {
    gap: 16px !important;
  }

  .woocommerce-cart .cart_totals {
    padding-block: 24px !important;
  }

  .woocommerce-cart .cart_totals > h2,
  .cart_totals h2 {
    margin-bottom: 16px !important;
  }

  .woocommerce-cart .cart_totals .wc-proceed-to-checkout {
    margin-top: 16px !important;
  }

  .woocommerce-cart .cart_totals .checkout-button,
  .woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button {
    height: 48px !important;
    padding: 12px 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  .woocommerce-checkout form.checkout {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
  .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
  .woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .woocommerce-checkout #customer_details .col-1,
  .woocommerce-checkout #customer_details .col-2 {
    margin-bottom: 24px !important;
  }

  .woocommerce-checkout form.checkout h3 {
    margin-bottom: 16px !important;
  }

  .woocommerce-checkout #ship-to-different-address {
    margin-bottom: 16px !important;
  }

  .woocommerce-checkout .form-row input.input-text,
  .woocommerce-checkout .form-row select,
  .woocommerce-checkout .select2-container .select2-selection--single {
    height: 48px !important;
    padding: 12px 18px !important;
  }

  .woocommerce-checkout #order_review {
    padding: 16px !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }

  .woocommerce-checkout #order_review_heading {
    margin-bottom: 16px !important;
  }

  #place_order {
    height: 48px !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
  }

  body.woocommerce-account .woocommerce-form-login,
  body.woocommerce-account .woocommerce-form-register {
    padding: 16px !important;
    gap: 16px !important;
  }

  body.woocommerce-account .woocommerce-form-login .form-row,
  body.woocommerce-account .woocommerce-form-register .form-row {
    margin: 0 0 0 0 !important;
  }

  body.woocommerce-account .woocommerce-form-login input.input-text,
  body.woocommerce-account .woocommerce-form-register input.input-text,
  body.woocommerce-account .if-input {
    height: 48px !important;
    padding: 12px 18px !important;
    box-sizing: border-box !important;
  }

  body.woocommerce-account .u-column1 h2,
  body.woocommerce-account .u-column2 h2 {
    margin-bottom: 16px !important;
  }

  .woocommerce-form-login h2,
  .woocommerce-form-register h2 {
    margin-bottom: 16px !important;
  }

  .single-product .product_title {
    margin-bottom: 0 !important;
  }

  .single-product .summary .price {
    margin-bottom: 0 !important;
  }

  .single-product .summary form.cart {
    margin-bottom: 0 !important;
  }

  .single-product .if-product-features {
    margin-top: 8px !important;
    gap: 16px !important;
  }

  .single-product .woocommerce-tabs {
    margin-top: 24px !important;
  }

  .single-product .single_add_to_cart_button,
  .single-product button.button.alt {
    padding-inline: 16px !important;
  }

  .related.products > h2,
  .upsells.products > h2 {
    margin-bottom: 16px !important;
  }

  .if-page h2 {
    margin-bottom: 16px !important;
  }

  .if-page-faq h2[style*="margin-bottom"] {
    margin-bottom: 12px !important;
  }

  .if-page-faq [style*="margin-bottom"] {
    margin-bottom: 16px !important;
  }

  .if-page-faq [style*="padding-block"] {
    padding-block: 24px !important;
  }

  .if-page-contact h2 {
    margin-bottom: 16px !important;
  }

  .if-page-contact [style*="margin-bottom"] {
    margin-bottom: 16px !important;
  }

  .if-thankyou__main {
    gap: 24px !important;
    margin-bottom: 24px !important;
  }

  /* ── Phase S round 3 — walker red-flag remediation ── */
  .woocommerce-cart .if-main,
  .woocommerce-checkout .if-main,
  .woocommerce-account .if-main {
    padding-block: 24px !important;
  }

  .woocommerce-cart .if-page-header,
  .woocommerce-cart .if-page-title,
  .woocommerce-checkout .if-page-header,
  .woocommerce-checkout .if-page-title,
  .woocommerce-account .if-page-header,
  .woocommerce-account .if-page-title {
    padding-block: 24px 16px !important;
  }

  .woocommerce-cart .woocommerce {
    padding-bottom: 24px !important;
  }

  .woocommerce-checkout .woocommerce {
    padding-bottom: 24px !important;
  }

  body.woocommerce-account .woocommerce {
    margin-bottom: 24px !important;
  }

  .woocommerce-cart .cart-empty {
    padding: 24px !important;
  }

  .woocommerce-cart .woocommerce-info.cart-empty {
    display: none !important;
  }

  .woocommerce-cart .return-to-shop {
    padding-block: 16px !important;
  }

  .if-empty {
    padding-block: 32px !important;
  }

  .single-product .related.products,
  .single-product .upsells.products {
    margin-top: 32px !important;
    padding-top: 24px !important;
  }

  .woocommerce-cart .related.products,
  .woocommerce-cart .upsells.products {
    margin-top: 24px !important;
    padding-top: 0 !important;
  }

  .if-complete-look {
    margin-top: 32px !important;
    padding-top: 24px !important;
  }

  .if-testimonials .if-section__head,
  .if-complete-look .if-section__head {
    margin-bottom: 24px !important;
  }

  .if-hero-slider__content {
    padding-block: 24px !important;
  }

  .if-promo-banner {
    padding: 24px !important;
  }

  body.error404 [style*="--if-s7"] {
    margin-bottom: 24px !important;
  }
}
/* ===== PHASE V MOBILE HOMEPAGE ===== */
@media (max-width: 767px) {
  .if-grid--5 { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .if-category-card { aspect-ratio: 3 / 4 !important; }
  .if-category-card__body { padding: 8px !important; gap: 4px !important; }
  .if-category-card__eyebrow { margin-bottom: 2px !important; font-size: 0.6rem !important; }
  .if-category-card__title { font-size: 0.95rem !important; margin: 0 !important; }
  .if-category-card__desc { margin-top: 2px !important; font-size: 0.7rem !important; max-width: 100% !important; }
  .if-category-card__cta { margin-top: 4px !important; font-size: 0.7rem !important; }
  .if-grid--products, ul.products, .if-shop-products, .woocommerce ul.products, .woocommerce-page ul.products { gap: 8px !important; }
  .if-product-card__body { gap: 2px !important; padding-top: 6px !important; }
  .if-product-card__cat, .if-product-card__title, .if-product-card__price, .if-product-card__unit, .if-product-card__stock, .if-product-card__set { margin: 4px 0 !important; line-height: 1.3 !important; }
  .if-product-card__actions { padding-top: 6px !important; }
  .if-product-card__actions .if-btn, .if-product-card__actions button, .if-product-card__actions a { padding: 10px 0 !important; font-size: 12px !important; min-height: 0 !important; }
  .if-hero { padding-block: 16px !important; }
  .if-hero__text { margin-bottom: 12px !important; }
  .if-hero__actions { margin-top: 0 !important; }
  .if-hero__actions .if-btn { padding: 10px 16px !important; }
  .if-section { padding-block: 16px !important; }
  .if-section__head { margin-bottom: 12px !important; }
  .if-container { padding-inline: 16px !important; }
  .if-marquee { padding-block: 10px !important; overflow: hidden !important; }
  .if-marquee__item { font-size: 0.7rem !important; padding-left: 8px !important; }
  .if-whatsapp { bottom: calc(80px + env(safe-area-inset-bottom, 0)) !important; right: 12px !important; width: 44px !important; height: 44px !important; }
}

/* ===== PHASE VP — MOBILE HOMEPAGE & FOOTER POLISH ===== */
@media (max-width: 767px) {
  /* 1. Category grid: 5th item (Unstitched) spans full width */
  .if-grid--5 > .if-category-card:last-child {
    grid-column: 1 / -1 !important;
  }

  /* 2. Product image aspect ratio */
  .if-product-card__media,
  .if-product-card__media img {
    aspect-ratio: 3 / 4 !important;
    object-fit: cover !important;
  }

  /* 3. Footer social icons spacing */
  .if-footer__brand .if-social,
  .if-social {
    margin-bottom: 16px !important;
  }

  /* 4. Footer widget sections spacing */
  .if-footer__col,
  .if-footer__brand {
    margin-bottom: 16px !important;
  }

  /* 5. Contact info alignment */
  .if-footer__contact-item {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .if-footer__contact-item svg {
    margin-top: 0 !important;
  }

  /* 6. Footer payment badges compact */
  .if-payments__item {
    padding: 8px 12px !important;
    font-size: 0.6rem !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
  }

  /* 7. Copyright & divider spacing */
  .if-footer__bottom {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
  }
  .if-footer__bottom .if-divider,
  .if-footer__bottom hr {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
  }
}

/* ===== PHASE VP2 — SOCIAL ICON CENTERING + CONTACT LAYOUT ===== */
@media (max-width: 767px) {
  /* Social icon containers and anchors */
  .if-social {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
    flex-wrap: nowrap !important;
  }
  .if-social__link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0 !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
  }
  .if-social__link svg,
  .if-social__link i {
    margin: 0 auto !important;
    padding: 0 !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    transform: none !important;
    padding-left: 0 !important;
  }

  /* Footer contact info layout */
  .if-footer__contact,
  .if-footer__contact-strip .if-footer__contact {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    text-align: left !important;
    width: 100% !important;
    padding-left: 20px !important;
  }
  .if-footer__contact-item {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }
}

/* Desktop Logo Fix */
.custom-logo, .site-logo img { max-height: 60px !important; width: auto !important; object-fit: contain !important; display: block !important; }
header .header-inner, header .site-branding { display: flex !important; align-items: center !important; justify-content: center !important; }

/* Mobile Logo Fix */
@media (max-width: 767px) {
    .custom-logo, .site-logo img { max-height: 42px !important; max-width: 42px !important; object-fit: contain !important; margin: 0 auto !important; display: block !important; }
    header .header-inner, header .site-branding { min-height: 60px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; }
}

/* --- LOGO COMPLETE OVERRIDE --- */

/* DESKTOP LOGO FIX */
@media (min-width: 768px) {
    .site-branding, .site-logo, .custom-logo-link {
        display: flex !important;
        align-items: center !important;
        height: 100% !important;
        max-height: 80px !important;
    }
    .custom-logo, .site-logo img {
        max-height: 70px !important;
        width: auto !important;
        object-fit: contain !important;
    }
}

/* MOBILE LOGO FIX (Perfect Centering) */
@media (max-width: 767px) {
    header .header-inner, header .site-header-inner {
        position: relative !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        height: 65px !important;
        padding: 0 15px !important;
    }
    
    .site-branding, .site-logo {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important; /* Ye logo ko exactly center krega */
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .custom-logo, .site-logo img {
        max-height: 45px !important;
        max-width: 45px !important;
        object-fit: contain !important;
        margin: 0 !important;
    }
}

/* --- ULTIMATE BRUTE FORCE LOGO FIX --- */

/* 1. Target EVERY image inside the header to force size */
header img, .site-header img, .header-main img, .site-branding img, .custom-logo, .logo img {
    max-height: 45px !important;
    width: auto !important;
    object-fit: contain !important;
    margin: 0 !important;
}

/* 2. Force the mobile header to be a flexbox and perfectly center the logo */
@media (max-width: 767px) {
    header.if-header, .site-header, .header-inner, .site-header-inner, header .container {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        position: relative !important;
        height: 65px !important;
        padding: 0 15px !important;
    }
    
    /* Force logo container to be dead center */
    .site-branding, .site-logo, .logo, header .container > a {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important; 
        margin: 0 !important;
        padding: 0 !important;
        z-index: 10 !important;
    }
}

/* 3. Desktop Logo Size */
@media (min-width: 768px) {
    header img, .site-header img, .header-main img, .site-branding img, .custom-logo, .logo img {
        max-height: 65px !important;
        width: auto !important;
        object-fit: contain !important;
    }
    header.if-header, .site-header, .header-inner {
        display: flex !important;
        align-items: center !important;
    }
}

/* ═══════════════════════════════════════════════════════════════
   HEADER LOGO LOCK — size / alignment / overlap fix
   header.css carries stacked escalation blocks (up to
   height:326px !important; final winners: desktop img 120px in a
   72px bar with overflow:visible → spills into hero; mobile ≤1023
   img 80px in 60px bar, left-aligned in flex flow). Inline
   width/height="2048" attributes are neutralized by CSS sizing.
   premium.css is the last enqueued stylesheet → wins every tie.
   Desktop (≥768): logo max 45px tall, bar stays 72px, nothing clipped.
   Mobile (≤767): 30px square logo, absolute-centered, bar 60px with
   overflow:hidden so the logo can NEVER overlap the hero slider.
   ═══════════════════════════════════════════════════════════════ */

/* ── Bar: fixed height, clipped, neutral stacking ── */
.if-header__inner {
  height: 72px !important;
  max-height: 72px !important;
  min-height: 72px !important;
  overflow: hidden !important;
  position: relative !important;
}

.if-header.is-scrolled .if-header__inner {
  height: 72px !important;
  max-height: 72px !important;
  min-height: 72px !important;
  overflow: hidden !important;
}

/* ── Desktop logo slot + image (≥768) ── */
.if-header .if-logo,
.if-header .if-logo .custom-logo-link {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  position: static !important;
  z-index: auto !important;
  height: 48px !important;
  max-height: 48px !important;
  min-height: 48px !important;
  max-width: 220px !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.if-header .if-logo img,
.if-header .if-logo .custom-logo,
.if-header .if-logo .custom-logo-link img {
  display: block !important;
  height: 45px !important;
  max-height: 45px !important;
  width: auto !important;
  max-width: 200px !important;
  object-fit: contain !important;
  object-position: center left !important;
  margin: 0 !important;
  padding: 0 !important;
  animation: none !important;
  transition: none !important;
  filter: none !important;
  transform: none !important;
}

.if-header.is-scrolled .if-logo,
.if-header.is-scrolled .if-logo .custom-logo-link {
  height: 48px !important;
  max-height: 48px !important;
  min-height: 48px !important;
  margin: 0 !important;
}

.if-header.is-scrolled .if-logo img,
.if-header.is-scrolled .if-logo .custom-logo,
.if-header.is-scrolled .if-logo .custom-logo-link img {
  height: 45px !important;
  max-height: 45px !important;
}

/* ── Mobile ≤767: 30px square, absolute-centered, clipped bar ── */
@media (max-width: 767px) {
  .if-header__inner {
    height: 60px !important;
    max-height: 60px !important;
    min-height: 60px !important;
    overflow: hidden !important;
    position: relative !important;
  }

  .if-header.is-scrolled .if-header__inner {
    height: 60px !important;
    max-height: 60px !important;
    min-height: 60px !important;
  }

  .if-header .if-logo--image {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    height: 30px !important;
    max-height: 30px !important;
    min-height: 30px !important;
    width: 30px !important;
    max-width: 30px !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 5 !important;
  }

  .if-header .if-logo--image .custom-logo-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 30px !important;
    max-height: 30px !important;
    width: 100% !important;
    max-width: 30px !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .if-header .if-logo img,
  .if-header .if-logo .custom-logo,
  .if-header .if-logo .custom-logo-link img {
    height: 30px !important;
    max-height: 30px !important;
    width: 30px !important;
    max-width: 30px !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  .if-header.is-scrolled .if-logo--image {
    height: 30px !important;
    max-height: 30px !important;
    width: 30px !important;
    max-width: 30px !important;
    margin: 0 !important;
  }

  .if-header.is-scrolled .if-logo img,
  .if-header.is-scrolled .if-logo .custom-logo,
  .if-header.is-scrolled .if-logo .custom-logo-link img {
    height: 30px !important;
    max-height: 30px !important;
    width: 30px !important;
    max-width: 30px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT GRID — ALIGNMENT / UNIFORMITY / SPACING (shop + category)
   Baseline: within-row heights already equal, but ROW heights varied
   (mobile 421.8–467px → 6 different button y positions; desktop row 2
   674.3 vs 654.4) because rows size to content. Fix = grid-auto-rows:1fr
   (all rows equal → every card same height → Add-to-Cart/View-Product
   buttons share one horizontal rhythm across the whole grid) + flex
   card internals pinning actions to card bottom.
   Selectors must carry .if-shop-main / full chains to outrank existing
   (0,3,0)+(0,4,x) !important rules in woocommerce.css.
   NOT TOUCHED: .if-demo-toast / .if-demo-viewers (order notification
   popup) — no selector in this block matches them.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. Uniform cards + button alignment (mobile & desktop) ── */
.if-shop-main ul.products {
  grid-auto-rows: 1fr !important;
  grid-auto-flow: row !important;
}

.if-shop-main ul.products li.product,
.if-shop-main ul.products li.product .if-product-card,
ul.products li.product,
ul.products li.product .if-product-card,
.if-product-card,
.product-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

.if-shop-main ul.products li.product {
  align-self: stretch !important;
}

/* Body fills remaining card height so actions reach the card bottom */
.if-shop-main .if-product-card__body,
.if-product-card__body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  gap: 0 !important;
  padding-top: 0 !important;
  min-width: 0 !important;
}

/* Button container always pinned to bottom, full width */
.if-shop-main .if-product-card__actions,
.if-product-card__actions,
ul.products li.product .button-container {
  margin-top: auto !important;
  width: 100% !important;
}

ul.products li.product .if-product-card__actions .if-btn,
ul.products li.product .add_to_cart_button,
ul.products li.product .button,
ul.products li.product .button-container {
  width: 100% !important;
}

/* ── 2. Uniform image aspect ratio (3/4, cover, no stretch) ──
   Image height driven by the img itself (aspect-ratio 3/4), wrapper
   follows → identical box for every card incl. products whose photo
   is missing (img keeps its 3/4 box = clean grey placeholder).
   Task's img margin-bottom:12px is carried by the wrapper: the img
   sits in an overflow:hidden box, so the 12px lives on the wrapper —
   same 12px gap, zero clipping of the photo. */
.if-shop-main .if-product-card__media,
.if-product-card__media {
  aspect-ratio: auto !important;
  width: 100% !important;
  margin-bottom: 12px !important;
  overflow: hidden !important;
  background: #E6E4DE !important;
}

.if-shop-main ul.products li.product .if-product-card__media img,
.if-shop-main .if-product-card__media img,
ul.products li.product .if-product-card__media img,
.if-product-card__media img {
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  width: 100% !important;
  height: auto !important;
  margin-bottom: 0 !important;
  display: block !important;
  color: transparent !important;
  background-color: #E6E4DE !important;
}

/* Broken/missing src stays a uniform grey box — alt text never
   spills out of the card (WooCommerce wc_placeholder_img already
   covers products with no image set). */
.if-shop-main ul.products li.product .if-product-card__media img:not(.is-loaded),
.if-product-card__media img:not(.is-loaded) {
  min-height: 0 !important;
}

/* Literal task selectors (harmless where classes are absent) */
ul.products li.product img {
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  width: 100% !important;
  height: auto !important;
}

/* ── 3. Tighten text spacing (category / title / sku / price / stock) ── */
.if-shop-main .if-product-card__cat,
.if-shop-main .if-product-card__title,
.if-shop-main .if-product-card__price,
.if-shop-main .if-product-card__set,
.if-shop-main .woocommerce-loop-product__title,
.if-product-card__cat,
.if-product-card__title,
.if-product-card__price,
.if-product-card__set,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price,
ul.products li.product .sku {
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
}

.if-shop-main .if-product-card__title,
.if-shop-main .if-product-card__price,
.if-shop-main .if-product-card__set,
.if-product-card__title,
.if-product-card__price,
.if-product-card__set,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price,
ul.products li.product .sku {
  font-size: 13px !important;
}

/* In stock / Out of stock sits right under the price — no extra gap */
.if-shop-main .if-product-card__stock,
.if-product-card__stock {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
}

/* ── 4. Mobile filter bar spacing (Filters · Showing all results · Sorting) ── */
@media (max-width: 767px) {
  .if-shop-toolbar {
    gap: 8px !important;
    padding-bottom: 12px !important;
    margin-bottom: 20px !important;
  }

  .if-shop-toolbar__left,
  .if-shop-toolbar__right {
    gap: 8px !important;
  }
}

/* ── 5. Footer contact info — stacked left ── */
.footer-contact-info,
.if-footer__contact,
.if-footer__contact-strip .if-footer__contact {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  text-align: left !important;
  padding-left: 15px !important;
}

.footer-contact-info > div,
.if-footer__contact-item,
.if-footer__contact-strip .if-footer__contact-item {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
}

/* ── 6. Last item in row (mobile) — natural flow, no forced gap ──
   Grid auto-flow keeps an odd last card in column 1; 1fr columns
   never stretch a lone item across the row. Nothing to override;
   explicit guard against any future justify-content: space-between */
.if-shop-main ul.products {
  justify-content: start !important;
  justify-items: stretch !important;
}

/* ═══════════════════════════════════════════════════════════════
   SINGLE PRODUCT PAGE — layout / reviews placement / alignment
   Reviews moved to absolute bottom via PHP (inc/woocommerce.php:
   woocommerce_product_tabs filter removes the tab; priority-99
   action renders comments_template() after related + complete-the-
   look). CSS below places/styles that section and fixes related /
   complete-the-look cards, trust badges, and detail "tables".
   NOT TOUCHED: .if-demo-toast / .if-demo-viewers (DEMO toast).
   ═══════════════════════════════════════════════════════════════ */

/* ── Reviews section: last full-width flex child of div.product ── */
.single-product .if-reviews-bottom {
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 56px !important;
  padding-top: 40px !important;
  border-top: 1px solid var(--if-line) !important;
}

@media (max-width: 1023px) {
  .single-product .if-reviews-bottom {
    margin-top: 8px !important;
    padding-top: 32px !important;
  }
}

.single-product .if-reviews-bottom .woocommerce-Reviews-title {
  font-family: var(--if-font-display) !important;
  font-size: 1.4rem !important;
  font-weight: 500 !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  color: var(--if-charcoal) !important;
}

.single-product .if-reviews-bottom #comments {
  margin-bottom: 24px !important;
}

.single-product .if-reviews-bottom .commentlist {
  margin: 0 !important;
  padding: 0 !important;
}

.single-product .if-reviews-bottom #review_form {
  margin-top: 8px !important;
}

.single-product .if-reviews-bottom .comment-form input[type="text"],
.single-product .if-reviews-bottom .comment-form input[type="email"],
.single-product .if-reviews-bottom .comment-form input[type="url"],
.single-product .if-reviews-bottom .comment-form textarea {
  width: 100% !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
  font-family: var(--if-font-body) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: var(--if-charcoal) !important;
  background: #fff !important;
  border: 1px solid var(--if-line) !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

.single-product .if-reviews-bottom .comment-form textarea {
  min-height: 120px !important;
}

.single-product .if-reviews-bottom .comment-form input[type="submit"],
.single-product .if-reviews-bottom #submit {
  min-height: 44px !important;
  padding: 10px 28px !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  background: var(--if-charcoal) !important;
  border: 1px solid var(--if-charcoal) !important;
  border-radius: 2px !important;
  cursor: pointer !important;
}

/* ── Related + Complete the Look: equal-height rows, buttons pinned ── */
.single-product .related.products ul.products,
.single-product .upsells.products ul.products,
.single-product .if-complete-look .if-grid--products {
  grid-auto-rows: 1fr !important;
  grid-auto-flow: row !important;
  align-items: stretch !important;
}

.single-product .related.products ul.products li.product,
.single-product .upsells.products ul.products li.product,
.single-product .if-complete-look .if-grid--products > li.product,
.single-product .if-complete-look .if-grid--products > .if-product-card {
  align-self: stretch !important;
}

/* Task-literal chains (also covered globally by the PRODUCT GRID block) */
.single-product ul.products li.product {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

.single-product ul.products li.product .button,
.single-product ul.products li.product .add_to_cart_button,
.single-product .if-grid--products .add_to_cart_button,
.single-product .if-grid--products .button {
  margin-top: auto !important;
  width: 100% !important;
}

/* ── Trust badges (Super Wholesale Rates, etc.): compact 2×2 on mobile ── */
@media (max-width: 640px) {
  .single-product .if-product-features {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    padding: 12px !important;
    margin-top: 8px !important;
  }

  .single-product .if-product-features__item {
    gap: 8px !important;
    font-size: 0.72rem !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
  }

  .single-product .if-product-features__icon {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
  }

  .single-product .if-product-features__icon svg {
    width: 13px !important;
    height: 13px !important;
  }

  .single-product .if-product-features__label {
    line-height: 1.25 !important;
    overflow-wrap: break-word !important;
  }
}

/* ── Wholesale set box + product details — premium table look ──
   Markup is div-rows (label | value), so the task's table/th/td
   spec is applied to those rows; literal scoped table rules cover
   any real <table> (e.g. attribute tables) without touching
   cart/checkout/my-account tables (scoped .single-product). */
.single-product table,
.single-product .if-set-box,
.single-product .if-product-details__grid {
  width: 100% !important;
  border-collapse: collapse !important;
  margin-bottom: 20px !important;
  font-size: 13px !important;
  table-layout: fixed !important;
}

.single-product table th,
.single-product table td,
.single-product .if-set-box__row,
.single-product .if-product-details__row {
  padding: 10px !important;
  border-bottom: 1px solid #e0e0e0 !important;
  text-align: left !important;
  vertical-align: middle !important;
  line-height: 1.4 !important;
}

.single-product table th {
  font-weight: 600 !important;
  color: var(--if-charcoal) !important;
  background: var(--if-ivory) !important;
}

.single-product table td {
  color: var(--if-body) !important;
}

/* Right column values align perfectly right */
.single-product table th:last-child,
.single-product table td:last-child,
.single-product .if-set-box__value,
.single-product .if-product-details__value {
  text-align: right !important;
}

.single-product .if-set-box {
  display: block !important;
  background: #fff !important;
  border: 1px solid var(--if-line) !important;
  border-radius: 2px !important;
  padding: 4px 8px !important;
}

.single-product .if-set-box__row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin: 0 !important;
}

.single-product .if-set-box__row:last-child,
.single-product .if-product-details__row:last-child {
  border-bottom: 0 !important;
}

.single-product .if-set-box__label {
  font-size: 13px !important;
  color: var(--if-muted) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-product .if-set-box__value {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--if-charcoal) !important;
  margin: 0 !important;
  padding: 0 !important;
  font-variant-numeric: tabular-nums !important;
}

.single-product .if-product-details__row:nth-child(odd) {
  background: transparent !important;
}

.single-product .if-product-details__label {
  font-size: 13px !important;
  color: var(--if-muted) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-product .if-product-details__value {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--if-charcoal) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ── SINGLE PRODUCT addendum: outrank the (0,3,0) !important block
   woocommerce.css:13024 (.single-product .if-product-right-col
   .if-product-details__* — 16px20px padding / margin:0) which the
   JS restructure makes match (details live inside right-col). Same
   specificity, later file = cascade winner. ── */
.single-product .if-product-right-col .if-product-details__row {
  padding: 10px !important;
}

.single-product .if-product-right-col .if-product-details__grid {
  margin-bottom: 20px !important;
  font-size: 13px !important;
}

.single-product .if-product-right-col .if-product-details__label,
.single-product .if-product-right-col .if-product-details__value {
  font-size: 13px !important;
}

.single-product .if-product-right-col .if-product-details__value {
  text-align: right !important;
}

/* ── SINGLE PRODUCT addendum 2: mobile flow — title right after
   the image. The JS restructure puts description tabs inside
   .if-product-left-col, which stacks ABOVE the title column on
   mobile (same family as the reviews bug: content before title).
   display:contents (≤1023) dissolves the column so each block can
   be ordered; scoped .if-product-left-col descendant selectors keep
   working (DOM ancestry is preserved by display:contents). ── */
@media (max-width: 1023px) {
  .single-product .if-product-left-col {
    display: contents !important;
  }

  .single-product .if-product-left-col > .woocommerce-product-gallery {
    order: 1 !important;
  }

  .single-product .if-product-right-col {
    order: 2 !important;
  }

  .single-product .if-product-left-col > .woocommerce-tabs {
    order: 3 !important;
    margin-top: 0 !important;
  }

  .single-product .related.products {
    order: 4 !important;
  }

  .single-product .if-complete-look {
    order: 5 !important;
  }

  .single-product .if-reviews-bottom {
    order: 6 !important;
  }
}

/* ═════════════════════════════════════════════════════════════
   CART PAGE — desktop two-column / mobile card items /
   totals labels / coupon alignment
   ═════════════════════════════════════════════════════════════ */

/* ── 1. Desktop two-column (≥1024): items 65% left, totals 32%
   right. `.woocommerce` is display:flex-wrap (gap 40) — the old
   400px fixed collaterals wrapped to the next line at ≤1280
   leaving white space right. gap 24 guarantees 65%+32%+gap fits
   (floats are no-ops inside flex; width/flex do the work). ── */
@media (min-width: 1024px) {
  body.woocommerce-cart .woocommerce {
    gap: 24px !important;
  }

  .woocommerce-cart-form {
    width: 65% !important;
    float: left !important;
    flex: 0 0 65% !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  .woocommerce-cart .cart-collaterals {
    width: 32% !important;
    float: right !important;
    flex: 0 0 32% !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  .woocommerce-cart .cart-collaterals .cart_totals {
    width: 100% !important;
  }
}

/* clear:both container after the floated pair (task literal) */
body.woocommerce-cart .if-page::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* ── 2. Mobile cart items as clean flex cards (≤767) ── */
@media (max-width: 767px) {
  /* hide table headers (task literal, elevated) */
  table.shop_table thead {
    display: none !important;
  }

  /* the card shell */
  table.shop_table tbody tr.woocommerce-cart-form__cart-item {
    display: flex !important;
    flex-wrap: wrap !important;
    position: relative !important;
    border: 1px solid #eee !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: flex-start !important;
    gap: 0 !important;
    background: #fff;
    grid-template-columns: none !important;
  }

  /* thumbnail 30% / name 65% */
  .woocommerce-cart-form .product-thumbnail {
    width: 30% !important;
    flex: 0 0 30% !important;
    padding: 0 !important;
    border: 0 !important;
    box-sizing: border-box !important;
  }

  .woocommerce-cart-form .product-thumbnail img {
    width: 100% !important;
    height: auto !important;
    border-radius: 4px !important;
    display: block !important;
  }

  .woocommerce-cart-form .product-name {
    width: 65% !important;
    padding-left: 15px !important;
    padding-right: 48px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    text-align: left !important;
    box-sizing: border-box !important;
    border: 0 !important;
  }

  /* price / qty / subtotal stack under the name, aligned to it */
  .woocommerce-cart-form .product-price,
  .woocommerce-cart-form .product-quantity,
  .woocommerce-cart-form .product-subtotal {
    width: 65% !important;
    margin-left: 35% !important;
    box-sizing: border-box !important;
    padding: 6px 0 !important;
    border: 0 !important;
    text-align: left !important;
    font-size: 14px !important;
  }

  .woocommerce-cart-form .product-quantity .qty {
    width: auto !important;
    min-width: 84px !important;
    height: 40px !important;
    margin-top: 4px !important;
  }

  /* remove (X) pinned top-right of the card */
  .woocommerce-cart-form .product-remove {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    z-index: 10 !important;
    line-height: 1 !important;
  }

  /* kill the floating labels/dots/lines: all responsive
     data-title pseudo-labels + stray rules on rows/table */
  .woocommerce-cart-form td::before,
  .woocommerce-cart-form th::before,
  .woocommerce-cart-form tr::before,
  .woocommerce-cart-form tr::after,
  .woocommerce-cart-form tbody::before,
  .woocommerce-cart-form tbody::after,
  .woocommerce-cart-form thead::before,
  .woocommerce-cart-form thead::after,
  table.shop_table.cart::before,
  table.shop_table.cart::after {
    content: none !important;
    display: none !important;
  }

  .woocommerce-cart-form td {
    border: 0 !important;
    background: transparent !important;
  }

  .woocommerce-cart-form tbody tr {
    border-bottom: 0 !important;
  }

  /* actions row: block, full width, so coupon can fill it */
  .woocommerce-cart-form tr.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin-top: 4px !important;
    border: 0 !important;
    grid-template-columns: none !important;
  }

  .woocommerce-cart-form td.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .woocommerce-cart-form button[name="update_cart"] {
    width: 100% !important;
    min-height: 44px !important;
    margin-top: 8px !important;
  }
}

/* ── 3. Cart totals: no duplicate labels (mobile) + alignment.
   The duplicate is th "Subtotal" PLUS td::before
   content:attr(data-title) "Subtotal: " on the same row —
   hide BOTH pseudo-labels (task literal th::before + the real
   td::before offender). ── */
@media (max-width: 767px) {
  .woocommerce-cart .cart_totals table th::before,
  .woocommerce-cart .cart_totals table td::before {
    content: none !important;
    display: none !important;
  }
}

.woocommerce-cart .cart_totals table th {
  text-align: left !important;
  white-space: normal !important;
}

.woocommerce-cart .cart_totals table td {
  text-align: right !important;
  white-space: normal !important;
}

.woocommerce-cart .cart_totals table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
}

.woocommerce-cart .cart_totals table td .amount,
.woocommerce-cart .cart_totals table td bdi {
  white-space: normal !important;
}

/* ── 4. Coupon alignment: input 65% / button 35%, 44px tall.
   flex-shrink resolves the 10px gap inside 100% (no overflow). ── */
.woocommerce-cart-form .coupon {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
}

.woocommerce-cart-form .coupon input {
  width: 65% !important;
  height: 44px !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  margin: 0 !important;
  flex: 0 1 65% !important;
}

.woocommerce-cart-form .coupon button {
  width: 35% !important;
  height: 44px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  flex: 0 1 35% !important;
  margin: 0 !important;
}

/* ── 5. Footer contact info — address/phone/email stack left ── */
.footer-contact-info,
.if-footer__contact,
.if-footer__contact-strip .if-footer__contact {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
  text-align: left !important;
  padding-left: 15px !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* ─────────────────────────────────────────────────────────────
   CART — specificity mirrors.
   The theme's woocommerce.css stacks ~8 phase blocks of
   (0,2,0)–(0,5,2) !important rules (e.g. `.woocommerce-cart
   form.woocommerce-cart-form` width:auto, `.woocommerce-cart
   .cart-collaterals` min-width:400px, `.woocommerce-cart
   table.shop_table tr.cart_item` display:grid) and WC-core
   woocommerce-smallscreen.css adds unmediated
   `td::before{content:attr(data-title)": "}`, `display:none`
   thumbnails and `text-align:right!important` cells. Each rule
   below MIRRORS the exact winning selector (same specificity →
   later file premium.css wins) or exceeds it.
   ───────────────────────────────────────────────────────────── */

/* ── Desktop (≥1024): mirror the final form/collaterals block
   (woocommerce.css:8089/8101, (0,2,0)+imp, global) ── */
@media (min-width: 1024px) {
  .woocommerce-cart form.woocommerce-cart-form {
    width: 65% !important;
    float: left !important;
    flex: 0 0 65% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: block !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  .woocommerce-cart .cart-collaterals {
    width: 32% !important;
    float: right !important;
    flex: 0 0 32% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    position: static !important;
    box-sizing: border-box !important;
  }

  .woocommerce-cart .cart-collaterals .cart_totals {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ── Mobile item cards (≤767): mirror tr.cart_item
   (0,3,2)+imp) → flex card wins by cascade order ── */
@media (max-width: 767px) {
  .woocommerce-cart table.shop_table tr.cart_item {
    display: flex !important;
    flex-wrap: wrap !important;
    position: relative !important;
    border: 1px solid #eee !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    border-radius: 8px !important;
    gap: 0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: flex-start !important;
    background: #fff !important;
    grid-template-columns: none !important;
  }

  /* cell family mirrors: (0,3,3)+imp beats core smallscreen
     (0,2,3)+imp and theme (0,3,1)+imp */
  .woocommerce table.shop_table_responsive tr td.product-thumbnail {
    display: block !important;
    width: 30% !important;
    flex: 0 0 30% !important;
    padding: 0 !important;
    border: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    text-align: left !important;
  }

  .woocommerce table.shop_table_responsive tr td.product-thumbnail img {
    width: 100% !important;
    height: auto !important;
    border-radius: 4px !important;
    display: block !important;
  }

  .woocommerce table.shop_table_responsive tr td.product-name {
    width: 65% !important;
    padding: 0 48px 0 15px !important;
    text-align: left !important;
    border: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  .woocommerce table.shop_table_responsive tr td.product-price,
  .woocommerce table.shop_table_responsive tr td.product-quantity,
  .woocommerce table.shop_table_responsive tr td.product-subtotal {
    width: 65% !important;
    margin-left: 35% !important;
    padding: 6px 0 !important;
    border: 0 !important;
    text-align: left !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  .woocommerce table.shop_table_responsive tr td.product-quantity .qty {
    width: auto !important;
    min-width: 84px !important;
    height: 40px !important;
    margin-top: 4px !important;
  }

  .woocommerce table.shop_table_responsive tr td.product-remove {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    z-index: 10 !important;
    line-height: 1 !important;
    text-align: right !important;
  }

  .woocommerce-cart table.shop_table tbody tr.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin-top: 4px !important;
    border: 0 !important;
    background: transparent !important;
    grid-template-columns: none !important;
  }

  .woocommerce-cart table.shop_table tbody td.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    text-align: left !important;
  }
}

/* ── Coupon mirrors (global — task wants 65/35 everywhere).
   (.woocommerce-cart table.shop_table .actions .coupon … = the
   (0,4,0)/(0,5,2)/(0,4,2)+imp winners) ── */
.woocommerce-cart table.shop_table .actions .coupon {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
}

.woocommerce-cart table.shop_table .actions .coupon input[type="text"] {
  width: 65% !important;
  height: 44px !important;
  flex: 0 1 65% !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 14px !important;
}

.woocommerce-cart table.shop_table .actions .coupon button {
  width: 35% !important;
  height: 44px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  flex: 0 1 35% !important;
  margin: 0 !important;
}

/* ── CART — final specificity tier (0,4,4)+imp: beats the theme's
   stacked `.woocommerce-cart table.shop_table tbody tr.cart_item td`
   (0,3,4)+imp padding/background block and the actions
   display:table-cell winner. Mirror-selector + later file = win. ── */
@media (max-width: 767px) {
  .woocommerce-cart table.shop_table tbody tr.cart_item {
    display: flex !important;
    flex-wrap: wrap !important;
    position: relative !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    background: #fff !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    gap: 0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: flex-start !important;
    grid-template-columns: none !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td {
    padding: 6px 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td::before,
  .woocommerce-cart table.shop_table tbody tr.cart_item td::after {
    content: none !important;
    display: none !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-thumbnail {
    display: block !important;
    width: 30% !important;
    flex: 0 0 30% !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-thumbnail img {
    width: 100% !important;
    height: auto !important;
    border-radius: 4px !important;
    display: block !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-name {
    width: 65% !important;
    min-width: 0 !important;
    padding: 0 48px 0 15px !important;
    text-align: left !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-price,
  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-quantity,
  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-subtotal {
    width: 65% !important;
    margin-left: 30% !important;
    padding: 6px 0 !important;
    text-align: left !important;
    font-size: 14px !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-quantity .qty {
    width: auto !important;
    min-width: 84px !important;
    height: 40px !important;
    margin-top: 4px !important;
  }

  .woocommerce-cart table.shop_table tbody tr.cart_item td.product-remove {
    width: auto !important;
    padding: 0 !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 10 !important;
    line-height: 1 !important;
    text-align: right !important;
  }

  .woocommerce-cart table.shop_table tbody tr.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin-top: 4px !important;
    border: 0 !important;
    background: transparent !important;
  }

  .woocommerce-cart table.shop_table tbody tr td.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }
}

/* ── CART — final coupon/actions pass. (a) the actions row is a
   classless `<tr>` (WC11) → :has() selector; it keeps tr padding
   16px which shrinks td 100%. (b) WC-core woocommerce-smallscreen
   renders clearfix ::before/::after on .coupon — inside our flex
   they become items adding gaps + shrink. (c) bases subtract the
   10px gap so 65/35 lands exact with no overflow. ── */
@media (max-width: 767px) {
  .woocommerce-cart-form tbody tr:has(> td.actions) {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    margin-top: 4px !important;
  }
}

.woocommerce-cart-form .coupon::before,
.woocommerce-cart-form .coupon::after {
  content: none !important;
  display: none !important;
}

.woocommerce-cart-form .coupon {
  justify-content: flex-start !important;
}

.woocommerce-cart table.shop_table .actions .coupon input[type="text"] {
  flex: 0 1 calc(65% - 5px) !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.woocommerce-cart table.shop_table .actions .coupon button {
  flex: 0 1 calc(35% - 5px) !important;
  margin: 0 !important;
}

/* ── CHECKOUT PAGE — order table list layout (mobile), duplicate
   heading, compact payment boxes, terms text, desktop field grid,
   borders/dots, spacing. Order matters: global borders first, the
   mobile cell `border:none` (same specificity, later) wins ≤767. ── */

/* 6. ORDER TABLE BORDERS & DOTS (desktop & mobile base) */
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid #f0f0f0 !important;
}

#order_review table.shop_table::before,
#order_review table.shop_table::after {
  display: none !important;
}

/* 2. DUPLICATE "YOUR ORDER" — structure: <h3 id="order_review_heading">
   (absolutely placed by theme, COVERED by the card's background on
   desktop → never actually visible) + #order_review::before
   (content:"Your order", paints inside the card top = the heading you
   see). On mobile both render → duplicate. Fix: hide the h3, KEEP the
   pseudo → exactly one "Your order" in the card on both viewports.
   Task-literal `+ h3` rule kept (inert: markup has no inner h3). */
#order_review_heading + #order_review h3 {
  display: none !important;
}

#order_review_heading {
  display: none !important;
}

/* beat theme's own self-conflict: woocommerce.css hides it, then
   utilities.css re-shows it at .woocommerce-checkout #order_review_heading
   [1,1,0]+imp (later stylesheet wins) */
.woocommerce-checkout #order_review_heading {
  display: none !important;
}

/* 3. PAYMENT METHOD BOXES — compact */
#payment .wc_payment_methods {
  padding: 0 !important;
  background: transparent !important;
}

#payment .wc_payment_method {
  padding: 12px 15px !important;
  margin-bottom: 10px !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 4px !important;
  background: #fdfdfd !important;
}

#payment .payment_box {
  padding: 10px 15px !important;
  margin-top: 10px !important;
  font-size: 13px !important;
  background: #f5f5f5 !important;
}

/* 4. TERMS CHECKBOX TEXT — no ALL CAPS, relaxed line */
.woocommerce-terms-and-conditions-wrapper label {
  text-transform: none !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

.woocommerce-terms-and-conditions-wrapper input[type="checkbox"] {
  margin-top: 3px !important;
}

/* 5. DESKTOP FORM FIELDS & LAYOUT ALIGNMENT */
@media (min-width: 768px) {
  .woocommerce-billing-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
  }

  .woocommerce-billing-fields__field-wrapper .form-row {
    width: calc(50% - 10px) !important;
    margin-bottom: 0 !important;
    float: none !important;
  }

  .woocommerce-billing-fields__field-wrapper .form-row-wide {
    width: 100% !important;
  }

  .woocommerce-shipping-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
  }

  .woocommerce-shipping-fields__field-wrapper .form-row {
    width: calc(50% - 10px) !important;
    margin-bottom: 0 !important;
    float: none !important;
  }

  .woocommerce-shipping-fields__field-wrapper .form-row-wide {
    width: 100% !important;
  }

  .woocommerce-additional-fields .form-row {
    width: 100% !important;
  }
}

/* input shape — checkout form rows only (radio/checkbox/hidden
   excluded; textarea gets padding/border but keeps a usable
   multiline height) */
.woocommerce-checkout .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.woocommerce-checkout .form-row select {
  height: 45px !important;
  padding: 0 12px !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  max-width: 100% !important;
}

.woocommerce-checkout .form-row textarea {
  padding: 10px 12px !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  max-width: 100% !important;
  min-height: 90px !important;
}

/* 1. MOBILE ORDER SUMMARY TABLE — clean list layout (CRITICAL) */
@media (max-width: 767px) {
  .woocommerce-checkout-review-order-table thead {
    display: none !important;
  }

  .woocommerce-checkout-review-order-table tr {
    display: flex !important;
    flex-direction: column !important;
    border-bottom: 1px solid #eee !important;
    padding: 10px 0 !important;
  }

  .woocommerce-checkout-review-order-table th,
  .woocommerce-checkout-review-order-table td {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 4px 0 !important;
    border: none !important;
    text-align: left !important;
  }

  .woocommerce-checkout-review-order-table .product-name {
    font-weight: 500 !important;
    flex-direction: column !important;
  }

  .woocommerce-checkout-review-order-table .product-total {
    font-weight: bold !important;
  }

  /* 7. SPACING — pull "Your order" closer to the form */
  #customer_details {
    margin-bottom: 20px !important;
  }

  #order_review {
    margin-top: 10px !important;
  }
}

/* ── CHECKOUT — specificity twins (mirror theme's exact checkout
   selectors; same !important specificity, premium.css loads last →
   wins ties). Discovered via winner-walk on every failed probe
   prop. Order: borders base → desktop twins → payment/terms →
   mobile block (same spec, later + media → wins ≤767). ── */

/* base borders — beat .woocommerce-checkout table... td (2,0,2)+imp
   var(--if-line-soft) and tfoot th (2,0,3)+imp */
.woocommerce-checkout table.woocommerce-checkout-review-order-table th,
.woocommerce-checkout table.woocommerce-checkout-review-order-table td {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid #f0f0f0 !important;
}

.woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot th {
  border-bottom: 1px solid #f0f0f0 !important;
}

/* desktop form grid — beat (2,0,0)+imp display:grid/gap20 */
@media (min-width: 768px) {
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
  }

  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row {
    width: calc(50% - 10px) !important;
    margin-bottom: 0 !important;
    float: none !important;
  }

  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-wide {
    width: 100% !important;
  }

  .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
  }

  .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .form-row {
    width: calc(50% - 10px) !important;
    margin-bottom: 0 !important;
    float: none !important;
  }

  .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .form-row-wide {
    width: 100% !important;
  }
}

/* payment — beat .woocommerce-checkout #payment ul... li (2,1,2)+imp
   and .woocommerce-checkout #payment .payment_box (2,1,0)+imp */
.woocommerce-checkout #payment ul.wc_payment_methods li {
  padding: 12px 15px !important;
  margin-bottom: 10px !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 4px !important;
  background: #fdfdfd !important;
}

.woocommerce-checkout #payment div.payment_box,
.woocommerce-checkout #payment .payment_box {
  padding: 10px 15px !important;
  margin-top: 10px !important;
  font-size: 13px !important;
  background: #f5f5f5 !important;
}

/* terms — beat .woocommerce-checkout .form-row label (2,0,1)+imp
   uppercase/0.76rem/block and label-for-checkbox (2,0,0)+imp center */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper label {
  text-transform: none !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

/* spacing — beat .woocommerce-checkout #customer_details / #order_review
   (1,1,0)+imp margin:0 */
@media (max-width: 767px) {
  .woocommerce-checkout #customer_details {
    margin-bottom: 20px !important;
  }

  .woocommerce-checkout #order_review {
    margin-top: 10px !important;
  }

  /* mobile order table — beat .woocommerce-checkout table... thead
     (2,0,2)+imp table-header-group, tfoot th/tbody td (2,0,3)+imp
     padding 14/16, table.shop_table td (1,0,2)+imp */
  .woocommerce-checkout table.woocommerce-checkout-review-order-table thead {
    display: none !important;
  }

  .woocommerce-checkout table.woocommerce-checkout-review-order-table tr,
  .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody tr {
    display: flex !important;
    flex-direction: column !important;
    border-bottom: 1px solid #eee !important;
    padding: 10px 0 !important;
  }

  .woocommerce-checkout table.woocommerce-checkout-review-order-table th,
  .woocommerce-checkout table.woocommerce-checkout-review-order-table td,
  .woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot th,
  .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody td {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 4px 0 !important;
    border: none !important;
    text-align: left !important;
  }

  .woocommerce-checkout table.woocommerce-checkout-review-order-table .product-name {
    font-weight: 500 !important;
    flex-direction: column !important;
  }

  .woocommerce-checkout table.woocommerce-checkout-review-order-table .product-total {
    font-weight: 700 !important;
  }
}

/* checkout twins [3,0,3] — beat theme's tbody td [2,0,3]+imp
   border-bottom var(--if-line-soft) and
   tbody td.product-name [3,0,3]+imp padding-right:20px */
.woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody td,
.woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody th {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid #f0f0f0 !important;
}

@media (max-width: 767px) {
  .woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody td {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 4px 0 !important;
    border: none !important;
    text-align: left !important;
  }
}

/* ── PREMIUM NOTICE BOXES (error / success / info) ── */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
  background-color: #fdfaf6 !important; /* Soft premium background */
  color: #333 !important;
  border: 1px solid #e0e0e0 !important;
  border-left: 4px solid #8b0000 !important; /* Maroon accent for errors */
  border-radius: 6px !important;
  padding: 15px 20px 15px 50px !important;
  margin-bottom: 25px !important;
  position: relative !important;
  font-size: 14px !important;
  font-family: inherit !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  list-style: none !important;
}

.woocommerce-message,
.woocommerce-info {
  border-left-color: #c8a97e !important; /* Gold/Beige accent for success/info */
}

/* Remove default ugly icons */
.woocommerce-error::before,
.woocommerce-message::before,
.woocommerce-info::before {
  display: none !important;
}

/* Add custom modern SVG Icons */
.woocommerce-error::after {
  content: "" !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238b0000'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z'/%3E%3C/svg%3E") !important;
  background-size: 20px 20px !important;
  background-repeat: no-repeat !important;
  background-position: center left !important;
  position: absolute !important;
  left: 15px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 20px !important;
}

.woocommerce-message::after,
.woocommerce-info::after {
  content: "" !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23c8a97e'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z'/%3E%3C/svg%3E") !important;
  background-size: 20px 20px !important;
  background-repeat: no-repeat !important;
  background-position: center left !important;
  position: absolute !important;
  left: 15px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 20px !important;
}

/* ── NOTICE BOXES — specificity twins. Theme wins at
   .woocommerce-checkout/.woocommerce-cart .woocommerce-*
   [2,0,0]+imp and body.woocommerce-account .woocommerce-*
   [2,1,0]+imp (theme's woocommerce.css loads before premium →
   ties here win too). Order: box set → gold accents → ::before
   kills (same file, later wins within each spec tier). ── */
.woocommerce-checkout .woocommerce-error,
.woocommerce-cart .woocommerce-error,
.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-message,
.woocommerce-checkout .woocommerce-info,
.woocommerce-cart .woocommerce-info,
body.woocommerce-account .woocommerce-error,
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info {
  background-color: #fdfaf6 !important;
  color: #333 !important;
  border: 1px solid #e0e0e0 !important;
  border-left: 4px solid #8b0000 !important;
  border-radius: 6px !important;
  padding: 15px 20px 15px 50px !important;
  margin-bottom: 25px !important;
  position: relative !important;
  font-size: 14px !important;
  font-family: inherit !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  list-style: none !important;
}

.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-message,
.woocommerce-checkout .woocommerce-info,
.woocommerce-cart .woocommerce-info,
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info {
  border-left-color: #c8a97e !important;
}

.woocommerce-checkout .woocommerce-error::before,
.woocommerce-cart .woocommerce-error::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-cart .woocommerce-message::before,
.woocommerce-checkout .woocommerce-info::before,
.woocommerce-cart .woocommerce-info::before,
body.woocommerce-account .woocommerce-error::before,
body.woocommerce-account .woocommerce-message::before,
body.woocommerce-account .woocommerce-info::before {
  display: none !important;
  content: none !important;
}

/* ══ ORDER RECEIVED / THANK YOU ══════════════════════════════════════
   1) Duplicate "Order details" table hidden (front-end only; markup kept
      for printing). 2) Header stack on mobile / side-by-side on desktop
      — task's literal WC selectors (`.woocommerce-order`,
      `.woocommerce-notice`, `.woocommerce-order-overview`) do not exist in
      this theme's custom thank-you template, so identical rules are
      mirrored onto the real elements `.if-thankyou__header`,
      `.if-thankyou__sub` and `.if-thankyou__meta` (the #158/Date/Total/
      Payment info box) right below. 3) Address columns + address box.
   4) "Your Items" title — `h2:contains()` is jQuery-only (invalid CSS
      that would void the whole rule) → replaced with the real title
      selector `.if-thankyou__panel--items .if-thankyou__panel-title`. ── */

.woocommerce-order-details { display: none !important; }

.woocommerce-customer-details .woocommerce-columns--addresses {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
}
.woocommerce-customer-details .woocommerce-column {
  width: calc(50% - 10px) !important;
  flex: 0 0 calc(50% - 10px) !important;
  box-sizing: border-box !important;
  float: none !important;
  min-width: 0 !important;
}
/* theme clearfix ::before/::after (" " display:table) becomes a flex item
   inside the addresses wrapper → +20px phantom column & forced wrap */
.woocommerce-customer-details .woocommerce-columns--addresses::before,
.woocommerce-customer-details .woocommerce-columns--addresses::after {
  content: none !important;
  display: none !important;
}

address {
  background: #f9f9f9 !important;
  padding: 15px !important;
  border-radius: 6px !important;
  border: 1px solid #eee !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.woocommerce-order-details__title,
.if-thankyou__panel--items .if-thankyou__panel-title {
  font-size: 20px !important;
  margin-bottom: 15px !important;
}

/* ── task literal mobile block (inert .woocommerce-order* parts kept
      for fidelity; mirror block below carries the real effect) ── */
@media (max-width: 767px) {
  .woocommerce-order > p.woocommerce-notice { margin-bottom: 20px !important; }
  .woocommerce-order-overview {
    display: flex !important;
    flex-direction: column !important;
    padding: 15px !important;
    background: #fdfaf6 !important;
    border-radius: 8px !important;
    margin-bottom: 20px !important;
  }
  .woocommerce-order-overview li {
    width: 100% !important;
    border-bottom: 1px solid #eee !important;
    padding: 10px 0 !important;
    margin: 0 !important;
    text-align: left !important;
    display: flex !important;
    justify-content: space-between !important;
  }
  .woocommerce-order-overview li:last-child { border-bottom: none !important; }

  /* mirror — actual theme markup: stack check / heading / sub / meta */
  .if-thankyou__header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    height: auto !important;
  }
  .if-thankyou__check { flex: none !important; margin-left: 0 !important; margin-right: auto !important; }
  .if-thankyou__heading { margin-bottom: 0 !important; white-space: normal !important; }
  .if-thankyou__sub { margin-bottom: 20px !important; text-align: left !important; }
  .if-thankyou__meta {
    display: flex !important;
    flex-direction: column !important;
    padding: 15px !important;
    background: #fdfaf6 !important;
    border-radius: 8px !important;
    margin-bottom: 20px !important;
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    gap: 0 !important;
  }
  .if-thankyou__meta li {
    width: 100% !important;
    border-bottom: 1px solid #eee !important;
    border-right: none !important;
    padding: 10px 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    text-align: left !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }
  .if-thankyou__meta li:last-child { border-bottom: none !important; }

  /* addresses stack full width on mobile */
  .woocommerce-customer-details .woocommerce-column {
    width: 100% !important;
    flex: 0 0 100% !important;
    float: none !important;
  }
}

/* ── task literal desktop block + mirror on real markup ── */
@media (min-width: 768px) {
  .woocommerce-order-overview {
    display: flex !important;
    background: #fdfaf6 !important;
    padding: 15px 30px !important;
    border-radius: 8px !important;
    width: fit-content !important;
    float: right !important;
    gap: 30px !important;
  }
  .woocommerce-order-overview li {
    border-right: 1px solid #ddd !important;
    padding-right: 30px !important;
  }
  .woocommerce-order-overview li:last-child {
    border-right: none !important;
    padding-right: 0 !important;
  }

  /* mirror — check + heading + sub + info box on one line, box at right */
  .if-thankyou__header {
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 30px !important;
    background: none !important;
    padding: 0 !important;
    height: auto !important;
    margin-bottom: 32px !important;
  }
  .if-thankyou__check { flex: none !important; margin-left: 0 !important; margin-right: 0 !important; }
  .if-thankyou__heading {
    flex: 0 0 auto !important;
    margin-bottom: 0 !important;
    white-space: nowrap !important;
  }
  .if-thankyou__sub {
    order: 9 !important;
    flex: 0 0 100% !important;
    text-align: left !important;
    margin: 0 !important;
    max-width: none !important;
  }
  .if-thankyou__meta {
    display: flex !important;
    flex-direction: row !important;
    flex: none !important;
    align-items: stretch !important;
    background: #fdfaf6 !important;
    padding: 15px 30px !important;
    border-radius: 8px !important;
    width: fit-content !important;
    float: right !important;
    margin-left: auto !important;
    gap: 30px !important;
    flex-wrap: nowrap !important;
  }
  .if-thankyou__meta li {
    border-right: 1px solid #ddd !important;
    border-bottom: none !important;
    padding: 0 !important;
    padding-right: 30px !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    text-align: left !important;
    gap: 4px !important;
  }
  .if-thankyou__meta li:last-child {
    border-right: none !important;
    padding-right: 0 !important;
  }

  /* addresses side by side on desktop */
  .woocommerce-customer-details .woocommerce-column {
    width: calc(50% - 10px) !important;
    flex: 0 0 calc(50% - 10px) !important;
    float: none !important;
  }
}

/* ══ MY ACCOUNT — dashboard / orders / addresses / account details ═══ */

/* ── 1. desktop layout & sidebar ── */
@media (min-width: 768px) {
  .woocommerce-MyAccount-navigation {
    width: 25% !important;
    float: left !important;
    background: #fafafa !important;
    padding: 20px !important;
    border-radius: 8px !important;
    border: 1px solid #eee !important;
    box-sizing: border-box !important;
  }
  .woocommerce-MyAccount-content {
    width: 72% !important;
    float: right !important;
    padding: 20px !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
  }
}
.woocommerce-MyAccount-navigation li.is-active a {
  background: #c8a97e !important;
  color: #fff !important;
  border-radius: 4px !important;
  padding: 10px 15px !important;
  display: block !important;
}

/* ── 2. mobile menu (clean vertical list) ── */
@media (max-width: 767px) {
  .woocommerce-MyAccount-navigation {
    width: 100% !important;
    float: none !important;
    margin-bottom: 20px !important;
    background: #fafafa !important;
    border-radius: 8px !important;
    padding: 10px !important;
  }
  .woocommerce-MyAccount-navigation ul {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    padding: 0 !important;
  }
  .woocommerce-MyAccount-navigation li a {
    display: block !important;
    padding: 12px 15px !important;
    border-bottom: 1px solid #eee !important;
    text-align: left !important;
    color: #333 !important;
  }
  .woocommerce-MyAccount-content { width: 100% !important; float: none !important; }
}

/* ── 3. mobile orders table → cards ── */
@media (max-width: 767px) {
  .woocommerce-orders-table thead { display: none !important; }
  .woocommerce-orders-table tr {
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid #eee !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    border-radius: 8px !important;
  }
  .woocommerce-orders-table td {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    border: none !important;
    border-bottom: 1px dashed #eee !important;
    padding: 8px 0 !important;
    text-align: right !important;
    box-sizing: border-box !important;
  }
  .woocommerce-orders-table td::before {
    content: attr(data-title) !important;
    font-weight: 600 !important;
    text-align: left !important;
    color: #666 !important;
  }
  .woocommerce-orders-table td:last-child {
    border-bottom: none !important;
    padding-top: 15px !important;
    justify-content: flex-end !important;
  }
}

/* ── 4. account details — duplicate eye + password-change heading ──
   Theme's woocommerce.css paints an eye on BOTH ::before AND ::after of
   every .show-password-input (two stacked icons per field). Extra one =
   ::before → keep a single functional eye (::after) instead of killing
   the whole toggle button. */
.show-password-input::before {
  content: none !important;
  background-image: none !important;
}
form.edit-account h2,
form.edit-account legend {
  font-size: 20px !important;
  border-bottom: 1px solid #ddd !important;
  padding-bottom: 10px !important;
  margin-bottom: 20px !important;
  width: 100% !important;
  display: block !important;
}

/* ── 5. addresses page ── */
.woocommerce-Address address {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  line-height: 1.6 !important;
  font-style: normal !important;
}
@media (min-width: 768px) {
  .woocommerce-MyAccount-content .u-columns {
    display: flex !important;
    gap: 20px !important;
  }
  .woocommerce-MyAccount-content .u-column1,
  .woocommerce-MyAccount-content .u-column2 {
    width: 50% !important;
    float: none !important;
    box-sizing: border-box !important;
  }
}
.woocommerce-Address .edit {
  color: #c8a97e !important;
  border: 1px solid #c8a97e !important;
  padding: 8px 15px !important;
  border-radius: 4px !important;
  display: inline-block !important;
  margin-top: 10px !important;
}

/* ══ MY ACCOUNT — specificity twins (theme uses body.woocommerce-account
   scoped !important rules that outrank the blocks above; mirror their
   exact selectors so premium.css wins the tie by order) ═══════════════ */

/* ── Desktop shell: 25% / 72% side-by-side (theme wraps account in a
      flex row; floats are inert on flex items, so drive layout with
      flex-basis + keep the task's widths/floats as twins) ──
      Scoped with :has(> .woocommerce-MyAccount-content) so the flex
      shell NEVER applies to the logged-out #customer_login page. ── */
@media (min-width: 768px) {
  body.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-content) {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }
  body.woocommerce-account .woocommerce-MyAccount-navigation {
    flex: 0 1 25% !important;
    width: 25% !important;
    max-width: 25% !important;
    min-width: 0 !important;
    float: left !important;
    background: #fafafa !important;
    padding: 20px !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  body.woocommerce-account .woocommerce-MyAccount-content {
    flex: 0 1 72% !important;
    width: 72% !important;
    float: right !important;
    padding: 20px !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
  }
}

/* ── Active link: gold pill (theme body-scoped rule wins the [2,0,2]
      tie — mirror at [3,0,3]) ── */
body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: #c8a97e !important;
  color: #fff !important;
  border-radius: 4px !important;
  padding: 10px 15px !important;
  display: block !important;
}

/* ── Mobile: nav card + vertical menu list (theme flips wrapper to
      column at <=900 and ul to a clipped horizontal scroller) ── */
@media (max-width: 767px) {
  body.woocommerce-account .woocommerce-MyAccount-navigation {
    flex: 1 1 auto !important;
    width: 100% !important;
    float: none !important;
    background: #fafafa !important;
    padding: 10px !important;
    margin-bottom: 20px !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
  }
  body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: wrap !important;
    overflow-x: visible !important;
    gap: 5px !important;
    padding: 0 !important;
  }
  body.woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: block !important;
    padding: 12px 15px !important;
    border-bottom: 1px solid #eee !important;
    text-align: left !important;
    color: #333 !important;
  }
}

/* ── Mobile orders → cards (beat theme's body-scoped table resets) ── */
@media (max-width: 767px) {
  body.woocommerce-account .woocommerce-orders-table tr {
    display: flex !important;
    flex-direction: column !important;
    padding: 15px !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    margin-bottom: 15px !important;
  }
  body.woocommerce-account .woocommerce-orders-table tbody td {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    border: 0 !important;
    border-bottom: 1px dashed #eee !important;
    padding: 8px 0 !important;
    text-align: right !important;
    box-sizing: border-box !important;
  }
  body.woocommerce-account .woocommerce-orders-table td::before {
    content: attr(data-title) !important;
    font-weight: 600 !important;
    text-align: left !important;
    color: #666 !important;
  }
  body.woocommerce-account .woocommerce-orders-table td:last-child {
    border-bottom: 0 !important;
    padding-top: 15px !important;
    justify-content: flex-end !important;
  }
}

/* ── Account details: single eye (theme paints BOTH ::before and
      ::after — hide the extra ::before, keep one functional toggle);
      "Password change" heading sizing ── */
body.woocommerce-account .show-password-input::before,
.woocommerce-EditAccountForm .show-password-input::before,
.woocommerce-form-login .show-password-input::before,
.woocommerce-form-register .show-password-input::before {
  display: none !important;
  content: none !important;
  background-image: none !important;
}
body.woocommerce-account .woocommerce-EditAccountForm legend {
  font-size: 20px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #ddd !important;
  margin-bottom: 20px !important;
}

/* ── Addresses: full-width column pair side-by-side (theme's col2-set
      caps the row at 900px / 420px items and stacks them) ── */
@media (min-width: 768px) {
  body.woocommerce-account .u-columns.col2-set {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 20px !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
  }
  body.woocommerce-account .u-column1,
  body.woocommerce-account .u-column2 {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    box-sizing: border-box !important;
    float: none !important;
  }
}
body.woocommerce-account .woocommerce-Address address {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  line-height: 1.6 !important;
  font-style: normal !important;
}
body.woocommerce-account .woocommerce-Address-title .edit,
body.woocommerce-account .woocommerce-Address .edit {
  color: #c8a97e !important;
  border: 1px solid #c8a97e !important;
  padding: 8px 15px !important;
  border-radius: 4px !important;
  display: inline-block !important;
  margin-top: 10px !important;
}

/* ═══════════════════════════════════════════════════════════════════ URGENT FIX — Restore missing Login form (logged-out desktop) +
   harden logged-in My Account shell
──────────────────────────────────────────────────────────────────────
   Root cause: body never carries a `logged-out` class, so the theme's
   `body.woocommerce-account.logged-out .woocommerce { display: block }`
   never matched; the account wrapper stayed flex row + nowrap and
   .woocommerce-notices-wrapper (h0, full width) became flex item 1,
   pushing #customer_login off-canvas (x=1428 @ 1440 viewport).
   Fixes: (a) wrapper forced to block via :has(> #customer_login);
          (b) previous desktop shell rule re-scoped to :has(> content)
              so it can never touch the logged-out state;
          (c) task's login/register/card/field/button rules — ID-scoped
              #customer_login selectors beat every theme class rule.   ═══════════════════════════════════════════════════════════════════ */

/* 0. Logged-out wrapper: block layout so notices + login stack normally */
body.woocommerce-account .woocommerce:has(> #customer_login) {
  display: block !important;
  max-width: 100% !important;
  margin: 0 auto 80px !important;
  padding: 0 !important;
  float: none !important;
}

/* 1. Restore login / register form (logged-out state) */
#customer_login {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 30px !important;
  width: 100% !important;
  margin: 0 auto !important;
  float: none !important;
}

#customer_login .u-column1,
#customer_login .u-column2 {
  width: 48% !important;
  max-width: 450px !important;
  float: none !important;
  background: #fafafa !important;
  padding: 30px !important;
  border-radius: 8px !important;
  border: 1px solid #eee !important;
}

#customer_login h2 {
  margin-top: 0 !important;
  text-align: center !important;
  font-size: 24px !important;
  margin-bottom: 20px !important;
}

@media (max-width: 767px) {
  #customer_login {
    flex-direction: column !important;
  }
  #customer_login .u-column1,
  #customer_login .u-column2 {
    width: 100% !important;
    padding: 20px !important;
  }
}

/* 2. Logged-in shell strictly targets navigation + content only */
@media (min-width: 768px) {
  .woocommerce-MyAccount-navigation {
    width: 25% !important;
    float: left !important;
  }
  .woocommerce-MyAccount-content {
    width: 72% !important;
    float: right !important;
  }
}

/* 3. Login form fields & buttons */
#customer_login input.input-text {
  height: 45px !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  padding: 0 15px !important;
  width: 100% !important;
}

#customer_login button[name="login"],
#customer_login button[name="register"] {
  width: 100% !important;
  height: 45px !important;
  background: #000 !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
}

/* 4. Landing fixes: theme flex-basis 440px on columns overrode the task's
      width:48%/max-width:450px; theme's custom login markup uses .if-input
      (no .input-text class), so the field rule needed a matching selector. */
#customer_login .u-column1,
#customer_login .u-column2 {
  flex: 0 1 auto !important;
}

#customer_login input.input-text,
#customer_login input.if-input,
#customer_login input[type="text"],
#customer_login input[type="password"] {
  height: 45px !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  padding: 0 15px !important;
  width: 100% !important;
}


/* ═══════════════════════════════════════════════════════════════════
   URGENT — WooCommerce search functionality + desktop results grid +
   mobile card alignment + search input UI
──────────────────────────────────────────────────────────────────────
   STEP 1 (terminal): `wp rewrite flush --hard` executed. The theme's
   search overlay is a PLAIN GET form (template-parts/search-overlay.php
   → method=get, action=/, hidden post_type=product) — NOT AJAX — so
   nothing to disable; submission verified → /?s=TERM&post_type=product
   renders body.search-results + ul.products with results (5 for "3 Piece").
   STEP 2-4: task's literal rules below (!important) + theme-mirror twins
   where this theme's markup differs (disclosed in ledger):
     - sidebar on search = .if-shop-sidebar inside .if-shop-layout grid
       (260px + 48px gap column = the "huge empty space") → hidden at
       ≥768 AND layout column collapsed to single 1fr;
     - search page's inline form = .if-search-inline / .if-input (no
       .search-form / .search-field / .search-submit / .woocommerce-product-search
       markup exists — literals kept, verified globally inert);
     - search.php's custom results grid = .if-grid--products (not
       ul.products) → forced to the same clean 3-col / 2-col.
   ═══════════════════════════════════════════════════════════════════ */

/* STEP 2 — desktop search results: standard 3-column product grid */
body.search-results ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* STEP 2 — hide sidebar/filters on desktop search results */
@media (min-width: 768px) {
  body.search-results .sidebar,
  body.search-results .widget-area {
    display: none !important;
  }
  body.search-results .if-shop-sidebar {
    display: none !important;
  }
  body.search-results .if-shop-layout {
    grid-template-columns: 1fr !important;
  }
}

/* STEP 2 — remove the empty white space */
body.search-results .site-content {
  padding: 0 !important;
}

/* STEP 3 — product card flexbox alignment (shop-style) */
ul.products li.product {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

ul.products li.product .button,
ul.products li.product .add_to_cart_button,
ul.products li.product .product_type_simple {
  margin-top: auto !important;
  width: 100% !important;
}

/* STEP 3 — mobile search results: clean 2-column grid */
@media (max-width: 767px) {
  body.search-results ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
}

/* STEP 4 — search input UI (typography + underline) */
body.search-results .woocommerce-product-search,
.search-form {
  display: flex !important;
  align-items: center !important;
  border-bottom: 2px solid #c8a97e !important;
  padding-bottom: 10px !important;
  margin-bottom: 30px !important;
}

body.search-results .search-field {
  border: none !important;
  background: transparent !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  width: 100% !important;
  outline: none !important;
}

body.search-results .search-submit {
  background: transparent !important;
  border: none !important;
  color: #c8a97e !important;
  font-size: 20px !important;
  cursor: pointer !important;
}

/* ── Theme mirrors so STEP 4 actually lands (this theme's markup):
      search.php renders form.if-search-inline > .if-search-inline svg +
      input.if-input (no .search-field/.search-submit/.search-form).
      Underline lives on the FORM only; inner group is borderless so no
      second line renders (fixed double-underline found in visual review). ── */
body.search-results .if-search-inline {
  display: flex !important;
  align-items: center !important;
  border-bottom: 2px solid #c8a97e !important;
  padding-bottom: 10px !important;
  margin-bottom: 30px !important;
  width: 100% !important;
}

body.search-results .if-search-inline .if-input-group {
  display: flex !important;
  align-items: center !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  width: 100% !important;
}

body.search-results .if-search-inline .if-input {
  border: none !important;
  background: transparent !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  width: 100% !important;
  outline: none !important;
}

body.search-results .if-search-inline svg {
  flex: 0 0 auto !important;
}

/* ── Theme mirror: search.php's custom results container
      (.if-grid.if-grid--products) forced to the same clean 3-col / 2-col ── */
body.search-results .if-grid--products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 767px) {
  body.search-results .if-grid--products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
}


/* ═══════════════════════════════════════════════════════════════════
   TASK — Polish the 404 Error Page UI (search bar, buttons, spacing)
──────────────────────────────────────────────────────────────────────
   Markup reality (404.php): body class is `error404` (NOT `error-404`),
   there is NO `.page-content` / `.error-404` element, the button row is
   an UNCLASSED div, and key sizes are INLINE styles. Task literals are
   appended verbatim first (spec compliance), then twins that actually
   land the intent:
     - `body.error404 …` scoping (author !important beats inline styles),
     - `.if-empty div:has(> .if-btn)` = the button row,
     - `.if-empty > div:has(> form.search-form)` = the 400px search
       wrapper (widened to 500px so the form can reach max-width:500),
     - `.if-empty` scoping keeps footer/header paragraphs untouched.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. PREMIUM SEARCH BAR (DESKTOP & MOBILE) — task literals ── */
.error-404 .page-content .search-form {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 500px !important;
  margin: 20px auto !important;
  border-bottom: 2px solid #c8a97e !important;
  padding-bottom: 5px !important;
}

.error-404 .page-content .search-form input[type="search"] {
  border: none !important;
  background: transparent !important;
  font-size: 16px !important;
  padding: 10px !important;
  flex: 1 !important;
  outline: none !important;
}

.error-404 .page-content .search-form button,
.error-404 .page-content .search-form input[type="submit"] {
  background: transparent !important;
  border: none !important;
  color: #c8a97e !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  padding: 10px 15px !important;
  font-size: 14px !important;
  letter-spacing: 1px !important;
  transition: 0.3s !important;
}

.error-404 .page-content .search-form button:hover,
.error-404 .page-content .search-form input[type="submit"]:hover {
  color: #000 !important;
}

/* ── 1. twins for this theme's actual markup ── */
body.error404 .search-form {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 500px !important;
  margin: 20px auto !important;
  border-bottom: 2px solid #c8a97e !important;
  padding-bottom: 5px !important;
}

body.error404 .search-form input[type="search"] {
  border: none !important;
  background: transparent !important;
  font-size: 16px !important;
  padding: 10px !important;
  flex: 1 !important;
  outline: none !important;
}

body.error404 .search-form button,
body.error404 .search-form input[type="submit"] {
  background: transparent !important;
  border: none !important;
  color: #c8a97e !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  padding: 10px 15px !important;
  font-size: 14px !important;
  letter-spacing: 1px !important;
  transition: 0.3s !important;
}

body.error404 .search-form button:hover,
body.error404 .search-form input[type="submit"]:hover {
  color: #000 !important;
}

/* wrapper div carries inline max-width:400px — widen so the form
   can actually reach the task's max-width:500px */
body.error404 .if-empty > div:has(> form.search-form) {
  max-width: 500px !important;
}

/* ── 2. BUTTONS & SPACING (Return Home / Shop All) — task literals ── */
.error-404 .page-content h1,
.error-404 .page-content h2 {
  margin-bottom: 15px !important;
  font-size: 32px !important;
}

.error-404 .page-content p {
  margin-bottom: 25px !important;
  font-size: 16px !important;
  color: #666 !important;
}

.error-404 .page-content .buttons,
.error-404 .page-content .wp-block-buttons {
  display: flex !important;
  justify-content: center !important;
  gap: 15px !important;
  margin-bottom: 30px !important;
}

@media (max-width: 767px) {
  .error-404 .page-content .buttons {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .error-404 .page-content .buttons a {
    width: 100% !important;
    text-align: center !important;
    padding: 12px !important;
  }
}

/* ── 2. twins for this theme's actual markup (inline-style overrides) ── */
body.error404 .if-empty h1,
body.error404 .if-empty h2 {
  margin-bottom: 15px !important;
  font-size: 32px !important;
}

body.error404 .if-empty p {
  margin-bottom: 25px !important;
  font-size: 16px !important;
  color: #666 !important;
}

body.error404 .if-empty div:has(> .if-btn) {
  display: flex !important;
  justify-content: center !important;
  gap: 15px !important;
  margin-bottom: 30px !important;
}

@media (max-width: 767px) {
  body.error404 .if-empty div:has(> .if-btn) {
    flex-direction: column !important;
    gap: 10px !important;
  }
  body.error404 .if-empty div:has(> .if-btn) a {
    width: 100% !important;
    text-align: center !important;
    padding: 12px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   VISUAL POLISH & ALIGNMENT FIXES — task "Complete Visual Polish &
   Alignment Fixes" (sections 1–7). Order Notification Popup
   (.if-demo-toast) intentionally untouched.
   All task selector literals kept verbatim for provenance; dead
   classes are paired with scoped twins for the theme's real markup
   (.if-mega / .if-value-card / .if-grid--* / .if-accordion /
   .if-mobile-nav / body.page-id-*).
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. HEADER DROPDOWN CLIPPING (Desktop) ───────────────────── */
header,
.site-header,
.header-inner {
  overflow: visible !important;
}

header ul.sub-menu {
  z-index: 99999 !important;
  background-color: #111 !important;
  border: 1px solid #c8a97e !important;
  border-radius: 4px !important;
  padding: 10px 0 !important;
  min-width: 220px !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
}

header ul.sub-menu li a {
  color: #fff !important;
  padding: 10px 20px !important;
  display: block !important;
  font-size: 14px !important;
  text-align: left !important;
  transition: 0.3s !important;
}

header ul.sub-menu li a:hover {
  color: #c8a97e !important;
  background-color: #222 !important;
  padding-left: 25px !important;
}

/* Twins (real markup): clipper was .if-header__inner overflow:hidden
   from the HEADER LOGO LOCK block; the SHOP dropdown is
   .if-mega > .if-mega__grid > .if-mega__list (no .sub-menu class in
   this theme); header bar was position:static so its z-index never
   created a stacking context above the hero. */
header .if-header__inner,
header .if-header.is-scrolled .if-header__inner {
  overflow: visible !important;
}

header.if-header {
  position: relative !important;
  z-index: 100 !important;
}

header .if-mega {
  z-index: 99999 !important;
  background-color: #111 !important;
  border: 1px solid #c8a97e !important;
  border-radius: 4px !important;
  padding: 10px 0 !important;
  min-width: 220px !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
}

header .if-mega__list li a {
  color: #fff !important;
  padding: 10px 20px !important;
  display: block !important;
  font-size: 14px !important;
  text-align: left !important;
  transition: 0.3s !important;
}

header .if-mega__list li a:hover {
  color: #c8a97e !important;
  background-color: #222 !important;
  padding-left: 25px !important;
}

/* ── 2. ABOUT PAGE (Mobile & Desktop) ────────────────────────── */
@media (max-width: 767px) {
  .about-steps-wrapper .step-item {
    margin-bottom: 20px !important;
    padding: 10px !important;
  }
  .about-steps-wrapper h3 {
    margin-bottom: 5px !important;
    font-size: 18px !important;
  }
  .about-steps-wrapper p {
    font-size: 14px !important;
    line-height: 1.4 !important;
  }
  /* Twins: steps = .if-grid--3 > .if-value-card (article.if-page-about) */
  body.page-id-82 .if-grid--3 .if-value-card {
    margin-bottom: 20px !important;
    padding: 10px !important;
  }
  body.page-id-82 .if-grid--3 .if-value-card h3 {
    margin-bottom: 5px !important;
    font-size: 18px !important;
  }
  body.page-id-82 .if-grid--3 .if-value-card p {
    font-size: 14px !important;
    line-height: 1.4 !important;
  }
}

/* ── 3. CONTACT PAGE (Layout & Form) ─────────────────────────── */
.contact-page-grid {
  background: transparent !important;
}

.contact-details-list {
  background: #fafafa !important;
  padding: 25px !important;
  border-radius: 8px !important;
  border: 1px solid #eee !important;
}

@media (min-width: 768px) {
  .contact-page-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
    align-items: start !important;
  }
}

@media (max-width: 767px) {
  .contact-page-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
  }
}

/* Twins: grid = article.if-page-contact .if-grid--2 (inline gap
   clamp overridden); columns are the two unclassed child divs —
   first = Contact Details list, second = message/placeholder box
   styled per task note as a sleek info box. */
body.page-id-84 .if-grid--2 {
  background: transparent !important;
}

@media (min-width: 768px) {
  body.page-id-84 .if-grid--2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
    align-items: start !important;
  }
}

@media (max-width: 767px) {
  body.page-id-84 .if-grid--2 {
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
  }
}

body.page-id-84 .if-grid--2 > div:first-child,
body.page-id-84 .if-grid--2 > div:last-child {
  background: #fafafa !important;
  padding: 25px !important;
  border-radius: 8px !important;
  border: 1px solid #eee !important;
}

/* ── 4. FAQ PAGE ─────────────────────────────────────────────── */
.faq-accordion-container {
  max-width: 800px !important;
  margin: 0 auto !important;
  padding: 0 15px !important;
}

.faq-item .toggle-icon {
  color: #c8a97e !important;
  font-weight: bold !important;
  font-size: 20px !important;
}

/* Twins: container = .if-container--narrow (scoped to FAQ so the
   Track Order narrow container keeps its own 600px rule below);
   toggle = .if-accordion__icon (bars use currentColor → color
   actually repaints them gold). */
body.page-id-85 .if-container--narrow {
  max-width: 800px !important;
  margin: 0 auto !important;
  padding: 0 15px !important;
}

body.page-id-85 .if-accordion__icon {
  color: #c8a97e !important;
  font-weight: bold !important;
  font-size: 20px !important;
}

/* ── 5. WHOLESALE PAGE (Spacing) ─────────────────────────────── */
@media (min-width: 768px) {
  .wholesale-steps-grid {
    display: flex !important;
    justify-content: space-between !important;
    gap: 20px !important;
    text-align: center !important;
  }
  .wholesale-steps-grid .step-item {
    flex: 1 !important;
  }
}

@media (max-width: 767px) {
  .wholesale-steps-grid .step-item {
    margin-bottom: 25px !important;
  }
}

/* Twins: steps = article.if-page-wholesale .if-grid--4 > .if-value-card */
@media (min-width: 768px) {
  body.page-id-83 .if-grid--4 {
    display: flex !important;
    justify-content: space-between !important;
    gap: 20px !important;
    text-align: center !important;
  }
  body.page-id-83 .if-grid--4 .if-value-card {
    flex: 1 !important;
  }
}

@media (max-width: 767px) {
  body.page-id-83 .if-grid--4 .if-value-card {
    margin-bottom: 25px !important;
  }
}

/* ── 6. TRACK YOUR ORDER PAGE ────────────────────────────────── */
.track-order-wrapper {
  max-width: 600px !important;
  margin: 40px auto !important;
  text-align: center !important;
}

.track-order-wrapper h1,
.track-order-wrapper h2,
.track-order-wrapper p {
  text-align: center !important;
  margin-bottom: 15px !important;
}

.track-order-wrapper form {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
  gap: 15px !important;
}

.track-order-wrapper input.input-text {
  height: 48px !important;
  width: 100% !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  padding: 0 15px !important;
}

.track-order-wrapper button {
  width: 100% !important;
  height: 48px !important;
  background: #000 !important;
  color: #fff !important;
  font-weight: bold !important;
  margin-top: 10px !important;
}

/* Twins: wrapper = body.page-id-115 .if-container--narrow; headings
   scoped to article.if-page (footer untouched); form markup uses
   bare <input type=text/email> + button.if-btn (no .input-text). */
body.page-id-115 .if-container--narrow {
  max-width: 600px !important;
  margin: 40px auto !important;
  text-align: center !important;
}

body.page-id-115 article.if-page h1,
body.page-id-115 article.if-page h2,
body.page-id-115 article.if-page p {
  text-align: center !important;
  margin-bottom: 15px !important;
}

body.page-id-115 form.if-form {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
  gap: 15px !important;
}

body.page-id-115 form.if-form input[type="text"],
body.page-id-115 form.if-form input[type="email"] {
  height: 48px !important;
  width: 100% !important;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  padding: 0 15px !important;
}

body.page-id-115 form.if-form button {
  width: 100% !important;
  height: 48px !important;
  background: #000 !important;
  color: #fff !important;
  font-weight: bold !important;
  margin-top: 10px !important;
}

/* ── 7. MOBILE MENU (Drawer Polish) ──────────────────────────── */
@media (max-width: 767px) {
  .mobile-menu-drawer .menu-item-has-children > a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
  .mobile-menu-drawer ul.sub-menu {
    padding-left: 15px !important;
    border-left: 2px solid #c8a97e !important;
    margin-left: 10px !important;
  }
  .mobile-menu-drawer ul.sub-menu li a {
    padding: 10px 15px !important;
    font-size: 14px !important;
    color: #ccc !important;
  }
  .mobile-menu-drawer .btn-account,
  .mobile-menu-drawer .btn-shop-wholesale {
    width: 100% !important;
    text-align: center !important;
    display: block !important;
    margin-bottom: 10px !important;
    border-radius: 4px !important;
  }

  /* Twins: drawer = .if-mobile-menu; items = .if-mobile-nav__item;
     chevron row = .if-mobile-nav__trigger; sub = .if-mobile-nav__sub;
     footer buttons = .if-mobile-menu__foot .if-btn (My Account /
     Shop Wholesale — .btn-account/.btn-shop-wholesale don't exist). */
  .if-mobile-nav__item .if-mobile-nav__trigger {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
  .if-mobile-nav__sub {
    padding-left: 15px !important;
    border-left: 2px solid #c8a97e !important;
    margin-left: 10px !important;
  }
  .if-mobile-nav__sub .if-mobile-nav__link {
    padding: 10px 15px !important;
    font-size: 14px !important;
    color: #ccc !important;
  }
  .if-mobile-nav__sub a {
    padding: 10px 15px !important;
    font-size: 14px !important;
    color: #ccc !important;
  }
  .if-mobile-menu__foot .if-btn {
    width: 100% !important;
    text-align: center !important;
    display: block !important;
    margin-bottom: 10px !important;
    border-radius: 4px !important;
  }
}


/* ═════════════════════════════════════════════════════════════════
   000. PREMIUM LUXURY DESIGN SYSTEM — PORT OF REFERENCE HTML
   Task: Transform the existing WooCommerce theme into a Premium
   Luxury design. Ported from the static reference (Gold / Ivory /
   Ink, Cormorant Garamond + Jost). This block is appended LAST in
   premium.css (final enqueued stylesheet) so every !important tie
   wins on cascade order. NOT TOUCHED: .if-demo-toast /
   demo-activity / order-notification popup.
   ═════════════════════════════════════════════════════════════════ */

/* ── A. Reference design tokens ── */
:root {
  --white: #ffffff;
  --ivory: #faf8f4;
  --sand: #f2ede3;
  --gold: #c8a24a;
  --gold-lt: #e9d6a3;
  --gold-dp: #9a7a2e;
  --ink: #0d0d0f;
  --ink-2: #16161a;
  --muted: #7c7c85;
  --line: rgba(13, 13, 15, .09);
  --line-lt: rgba(255, 255, 255, .16);
  --grad-gold: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%);
  --ease: cubic-bezier(.19, 1, .22, 1);
  --ease-2: cubic-bezier(.65, 0, .35, 1);
  --shadow-lg: 0 40px 80px -30px rgba(13, 13, 15, .28);
  --shadow-gold: 0 30px 60px -25px rgba(200, 162, 74, .55);
}

/* Single-gold unification — theme --if-* tokens remapped to the
   reference palette. Semantic tokens (--if-sale, --if-success,
   --if-gold-wash, fonts, layout tokens) intentionally untouched. */
:root {
  --if-gold: #c8a24a !important;
  --if-gold-soft: #e9d6a3 !important;
  --if-gold-deep: #9a7a2e !important;
  --if-charcoal: #0d0d0f !important;
  --if-charcoal-bg: #0d0d0f !important;
  --if-ink: #16161a !important;
  --if-body: #16161a !important;
  --if-muted: #7c7c85 !important;
  --if-ivory: #faf8f4 !important;
  --if-champagne: #f2ede3 !important;
  --if-line: rgba(13, 13, 15, .09) !important;
  --if-line-soft: rgba(13, 13, 15, .05) !important;
  --if-line-strong: rgba(13, 13, 15, .15) !important;
  --if-shadow-lg: 0 40px 80px -30px rgba(13, 13, 15, .28) !important;
  --if-shadow-gold: 0 30px 60px -25px rgba(200, 162, 74, .55) !important;
  --if-ease: cubic-bezier(.19, 1, .22, 1) !important;
}

/* ── B. Global typography (reference body + heading families) ── */
body {
  font-family: 'Jost', sans-serif !important;
  font-weight: 300 !important;
  background: var(--ivory) !important;
  color: var(--ink) !important;
  line-height: 1.65 !important;
  -webkit-font-smoothing: antialiased;
}

::selection {
  background: var(--gold);
  color: #1a1408;
}

::-webkit-scrollbar {
  width: 9px;
}
::-webkit-scrollbar-track {
  background: var(--sand);
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--gold-lt), var(--gold-dp));
  border-radius: 10px;
}
@supports (scrollbar-color: color color) {
  html {
    scrollbar-color: var(--gold-dp) var(--sand);
  }
}

/* Large display headings — Cormorant 300 (reference .sec-title /
   .hero-title weight). Mirrors the utilities.css selector list so the
   forced font-weight:600 / line-height:1.25 pills lose the tie. */
h1, h2,
.if-page-title,
.if-section__head h2,
.if-testimonials h2,
.if-related h2,
.if-complete-look h2,
.if-product-details__head h2,
.single-product .product_title,
.woocommerce-order h1,
.woocommerce-thankyou-order-received,
.woocommerce-cart .if-page-title,
.woocommerce-checkout .if-page-title,
.woocommerce-account .if-page-title,
.woocommerce-cart .cart_totals > h2,
.cart_totals h2,
.woocommerce-checkout #order_review_heading,
.if-empty h3,
.if-search-empty h4,
.if-newsletter h2,
.if-pre-footer h2,
.if-category-card__title,
.if-product-card__title,
.if-product-card__title a,
.if-value-card h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 300 !important;
  line-height: 1.12 !important;
  letter-spacing: -.01em;
}

/* Medium headings — Cormorant 500 (task step 2: 400/500) */
h3, h4, h5, h6 {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}

/* Italic accent words inside headings — reference .sec-title em */
h1 em, h2 em,
.if-section__head h2 em,
.if-page-title em,
.if-pre-footer h2 em,
.if-newsletter h2 em {
  font-style: italic !important;
  color: var(--gold-dp) !important;
}

/* ── C. Buttons (reference .btn / .btn-gold / .btn-ghost / .btn-dark) ── */
.if-btn {
  padding: 17px 38px !important;
  font-size: 11px !important;
  letter-spacing: .22em !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  min-height: 44px !important;
  line-height: 1 !important;
  transition: all .5s var(--ease) !important;
}

.if-btn--sm {
  padding: 13px 26px !important;
  font-size: 10.5px !important;
}

/* Gold — animated reference gradient */
.if-btn--gold {
  background: var(--grad-gold) !important;
  background-size: 230% 100% !important;
  background-position: 0 0 !important;
  color: #1a1408 !important;
  border-color: transparent !important;
  box-shadow: 0 18px 40px -20px rgba(200, 162, 74, .9) !important;
}
.if-btn--gold:hover {
  background-position: 100% 0 !important;
  transform: translateY(-3px) !important;
  box-shadow: var(--shadow-gold) !important;
}

/* Dark (reference .btn-dark) */
.if-btn--primary {
  background: var(--ink) !important;
  color: #fff !important;
  border-color: var(--ink) !important;
}
.if-btn--primary:hover {
  background: var(--gold-dp) !important;
  border-color: var(--gold-dp) !important;
  color: #fff !important;
  transform: translateY(-3px) !important;
  box-shadow: var(--shadow-gold) !important;
}

/* Light-context outline (reference .btn-ghost inverse) */
.if-btn--outline {
  background: transparent !important;
  color: var(--ink) !important;
  border-color: rgba(13, 13, 15, .32) !important;
}
.if-btn--outline:hover {
  background: var(--ink) !important;
  color: #fff !important;
  border-color: var(--ink) !important;
  transform: translateY(-3px) !important;
}

/* Outline gold */
.if-btn--outline-gold {
  background: transparent !important;
  color: var(--gold-dp) !important;
  border-color: var(--gold) !important;
}
.if-btn--outline-gold:hover {
  background: var(--grad-gold) !important;
  background-size: 230% 100% !important;
  color: #1a1408 !important;
  border-color: transparent !important;
  transform: translateY(-3px) !important;
}

/* Ghost on dark (reference .btn-ghost) */
.if-btn--outline-light {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, .34) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.if-btn--outline-light:hover {
  background: #fff !important;
  color: #0d0d0f !important;
  border-color: #fff !important;
  transform: translateY(-3px) !important;
}

.if-btn--white {
  border-radius: 0 !important;
}
.if-btn--white:hover {
  background: var(--grad-gold) !important;
  background-size: 230% 100% !important;
  color: #1a1408 !important;
  border-color: transparent !important;
  transform: translateY(-3px) !important;
}

/* WooCommerce CTAs — gold (checkout) / dark (single product) */
.woocommerce-checkout #place_order,
.woocommerce #place_order,
#place_order,
.woocommerce-cart .cart_totals .checkout-button,
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button,
.cart_totals .checkout-button,
.wc-proceed-to-checkout a.checkout-button,
.cart_totals .wc-proceed-to-checkout .checkout-button {
  background: var(--grad-gold) !important;
  background-size: 230% 100% !important;
  background-position: 0 0 !important;
  color: #1a1408 !important;
  border: 1px solid transparent !important;
  border-radius: 0 !important;
  font-size: 11px !important;
  letter-spacing: .22em !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  padding: 17px 24px !important;
  min-height: 48px !important;
  transition: all .5s var(--ease) !important;
}
.woocommerce-checkout #place_order:hover,
.woocommerce #place_order:hover,
#place_order:hover,
.woocommerce-cart .cart_totals .checkout-button:hover,
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button:hover,
.cart_totals .checkout-button:hover,
.wc-proceed-to-checkout a.checkout-button:hover,
.cart_totals .wc-proceed-to-checkout .checkout-button:hover {
  background-position: 100% 0 !important;
  transform: translateY(-3px) !important;
  box-shadow: var(--shadow-gold) !important;
}
#place_order:disabled,
#place_order.disabled {
  opacity: .55 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

.single-product button.single_add_to_cart_button,
.single-product div.product form.cart .single_add_to_cart_button,
button.single_add_to_cart_button {
  background: var(--ink) !important;
  color: #fff !important;
  border-color: var(--ink) !important;
  width: 100% !important;
  padding: 17px 24px !important;
  min-height: 52px !important;
  font-size: 11px !important;
  letter-spacing: .22em !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  transition: all .5s var(--ease) !important;
}
.single-product button.single_add_to_cart_button:hover,
.single-product div.product form.cart .single_add_to_cart_button:hover,
button.single_add_to_cart_button:hover {
  background: var(--gold-dp) !important;
  border-color: var(--gold-dp) !important;
  transform: translateY(-3px) !important;
  box-shadow: var(--shadow-gold) !important;
}

/* ── D. Announcement bar (ink strip + reference marquee typography) ── */
.if-announce {
  background: var(--ink) !important;
  color: rgba(255, 255, 255, .9) !important;
  border-bottom: 1px solid rgba(200, 162, 74, .3) !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic !important;
  font-size: 17px !important;
  letter-spacing: .04em !important;
  text-transform: none !important;
  line-height: 1.2 !important;
}
.if-announce__slide {
  color: rgba(255, 255, 255, .92) !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic !important;
  letter-spacing: .04em !important;
}
.if-announce a {
  color: var(--gold-lt) !important;
}
.if-announce a:hover {
  color: #fff !important;
}
.if-announce__dot {
  background: rgba(255, 255, 255, .3) !important;
}
.if-announce__dot.is-active {
  background: var(--gold-lt) !important;
}

/* ── E. Header / nav (reference .nav-link / .icon-btn / cart badge) ── */
.if-header {
  border-bottom-color: rgba(200, 162, 74, .22) !important;
}
.if-header.is-scrolled {
  border-bottom-color: rgba(200, 162, 74, .35) !important;
  box-shadow: 0 2px 14px rgba(0, 0, 0, .35) !important;
}
.if-header .if-nav__link {
  font-size: 11.5px !important;
  letter-spacing: .2em !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, .86) !important;
}
.if-header .if-nav__link:hover,
.if-header .if-nav__link[aria-current="page"] {
  color: var(--gold-lt) !important;
}
.if-header .if-nav__link::after {
  background: var(--gold) !important;
  height: 1px;
}
.if-header .if-icon-btn:hover {
  background: rgba(255, 255, 255, .1) !important;
  color: var(--gold-lt) !important;
  transform: translateY(-2px) !important;
}
.if-header .if-cart-count {
  background: var(--grad-gold) !important;
  color: #1a1408 !important;
}

/* ── F. Marquee strip (reference .marquee / .mq-item) ── */
.if-marquee {
  background: var(--ink) !important;
  border-top: 1px solid rgba(200, 162, 74, .24) !important;
  border-bottom: 1px solid rgba(200, 162, 74, .24) !important;
  padding-block: 20px !important;
  color: rgba(255, 255, 255, .86) !important;
}
.if-marquee__item {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: italic !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  letter-spacing: .05em !important;
  text-transform: none !important;
  color: rgba(255, 255, 255, .86) !important;
}
.if-marquee__item::after {
  color: var(--gold) !important;
  font-size: .6rem !important;
}

/* ── G. Section headings + eyebrow (reference .sec-head / .eyebrow) ── */
.if-section__head h2 {
  font-size: clamp(32px, 4.6vw, 60px) !important;
  font-weight: 300 !important;
  line-height: 1.08 !important;
  letter-spacing: -.01em !important;
}
.if-eyebrow,
.if-section__head .if-eyebrow,
.if-hero-slider__eyebrow,
.if-newsletter__eyebrow,
.if-product-details__label {
  font-family: 'Jost', sans-serif !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .42em !important;
  text-transform: uppercase !important;
  color: var(--gold-dp) !important;
}
.if-section__head .if-eyebrow {
  margin-bottom: 22px !important;
}

/* ── H. Hero (reference .hero-title / .hero-eyebrow / .hero-sub) ── */
.if-hero-slider__title {
  font-weight: 300 !important;
  line-height: 1.04 !important;
  letter-spacing: -.015em !important;
}
@media (min-width: 768px) {
  .if-hero-slider__title {
    font-size: clamp(2.4rem, 5.6vw, 5rem) !important;
    max-width: 17ch;
  }
}
.if-hero-slider__eyebrow {
  font-size: 10px !important;
  letter-spacing: .42em !important;
  font-weight: 500 !important;
  color: var(--gold-lt) !important;
  margin-bottom: 16px !important;
}
.if-hero-slider__rule {
  width: 56px !important;
  height: 2px !important;
  background: var(--grad-gold) !important;
}
.if-hero-slider__text {
  font-size: clamp(14px, 1.4vw, 16.5px) !important;
  font-weight: 300 !important;
  line-height: 1.85 !important;
  color: rgba(255, 255, 255, .74) !important;
  max-width: 530px !important;
}

/* ── I. Category cards (reference .cat-card) ── */
.if-category-card {
  background: var(--ink) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.if-category-card:hover {
  transform: none !important;
  box-shadow: none !important;
}
.if-category-card::after {
  background: linear-gradient(180deg, transparent 34%, rgba(8, 8, 10, .9) 100%) !important;
}
.if-category-card__media img {
  transition: transform 1.3s var(--ease), filter .7s !important;
  filter: brightness(.82) saturate(.9) !important;
}
.if-category-card:hover .if-category-card__media img {
  transform: scale(1.09) !important;
  filter: brightness(.95) saturate(1.05) !important;
}
.if-category-card__eyebrow {
  color: var(--gold-lt) !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
}
.if-category-card__title {
  color: #fff !important;
  font-weight: 400 !important;
}
.if-category-card__cta {
  color: rgba(255, 255, 255, .7) !important;
}
@media (hover: hover) and (min-width: 768px) {
  .if-category-card__cta {
    opacity: 0 !important;
    transform: translateY(12px) !important;
    transition: opacity .5s var(--ease) .06s, transform .5s var(--ease) .06s, color .3s !important;
  }
  .if-category-card:hover .if-category-card__cta {
    opacity: 1 !important;
    transform: translateY(0) !important;
    color: var(--gold-lt) !important;
  }
}
@media (min-width: 768px) {
  .if-category-card {
    aspect-ratio: 3 / 4.1 !important;
    padding: 28px 24px !important;
  }
  .if-category-card__title {
    font-size: 25px !important;
    line-height: 1.2 !important;
    letter-spacing: .01em !important;
  }
  .if-category-card__eyebrow {
    font-size: 9.5px !important;
    letter-spacing: .34em !important;
    margin-bottom: 9px !important;
  }
  .if-category-card__desc {
    display: none !important;
  }
}

/* ── J. Product cards (reference .prod-card / .prod-info / badges) ── */
ul.products li.product {
  background: transparent !important;
  border: 0 !important;
}
.if-product-card,
.if-shop-main .if-product-card,
ul.products li.product .if-product-card {
  background: var(--white) !important;
  border: 1px solid rgba(13, 13, 15, .06) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: transform .6s var(--ease), box-shadow .6s var(--ease), border-color .6s var(--ease) !important;
}
ul.products li.product:hover .if-product-card,
ul.products li.product .if-product-card:hover,
.if-grid--products .if-product-card:hover,
.if-shop-main ul.products li.product .if-product-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: rgba(200, 162, 74, .35) !important;
}
.if-product-card:hover .if-product-card__body {
  transform: none !important;
}

.if-product-card__media,
.if-shop-main .if-product-card__media,
ul.products li.product .if-product-card__media {
  background: var(--sand) !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
}
.if-product-card__media img,
.if-shop-main .if-product-card__media img,
ul.products li.product .if-product-card__media img {
  transition: transform 1.2s var(--ease) !important;
}
.if-product-card:hover .if-product-card__media img:first-child,
.if-product-card:hover .if-product-card__media img {
  transform: scale(1.07) !important;
}

.if-product-card__cat,
.if-shop-main .if-product-card__cat {
  color: var(--gold-dp) !important;
  font-size: 9px !important;
  letter-spacing: .3em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
.if-product-card__title,
.if-shop-main .if-product-card__title,
ul.products li.product .if-product-card__title,
.if-grid--products .if-product-card__title {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 500 !important;
  color: var(--ink) !important;
  letter-spacing: 0 !important;
}
.if-product-card__title a,
.if-shop-main .if-product-card__title a,
ul.products li.product .if-product-card__title a,
.if-grid--products .if-product-card__title a {
  font-family: 'Cormorant Garamond', serif !important;
  font-weight: 500 !important;
  font-style: normal !important;
  letter-spacing: 0 !important;
  line-height: inherit !important;
  color: inherit !important;
}
.if-product-card:hover .if-product-card__title,
.if-product-card:hover .if-product-card__title a {
  color: var(--gold-dp) !important;
}

.if-product-card__set,
.if-shop-main .if-product-card__set {
  display: inline-block !important;
  align-self: flex-start !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 9.5px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  color: var(--gold-dp) !important;
  background: transparent !important;
  border: 1px solid rgba(200, 162, 74, .35) !important;
  border-radius: 0 !important;
  padding: 6px 11px !important;
  margin: 6px 0 4px !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}

.if-product-card__price,
.if-shop-main .if-product-card__price {
  color: var(--ink) !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-variant-numeric: tabular-nums !important;
}
.if-product-card__price ins {
  color: var(--if-sale) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.if-product-card__price del {
  color: var(--muted) !important;
  font-weight: 400 !important;
}
.if-product-card__unit,
.if-shop-main .if-product-card__unit {
  font-family: 'Jost', sans-serif !important;
  color: var(--muted) !important;
  font-weight: 400 !important;
}

/* Card add-to-cart — reference .prod-quick treatment (always in-flow) */
.if-product-card__actions .if-btn,
.if-product-card__actions button,
.if-product-card__actions a,
ul.products li.product .if-product-card__actions .if-btn,
ul.products li.product .add_to_cart_button {
  background: rgba(13, 13, 15, .9) !important;
  color: #fff !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: .2em !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: all .4s var(--ease) !important;
}
.if-product-card__actions .if-btn:hover,
.if-product-card__actions button:hover,
.if-product-card__actions a:hover,
ul.products li.product .if-product-card__actions .if-btn:hover,
ul.products li.product .add_to_cart_button:hover {
  background: var(--grad-gold) !important;
  background-size: 230% 100% !important;
  color: #1a1408 !important;
  border-color: transparent !important;
  box-shadow: 0 14px 30px -14px rgba(200, 162, 74, .7) !important;
  transform: none !important;
}
.if-product-card__actions .if-btn--outline {
  background: rgba(13, 13, 15, .9) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Desktop card metrics (reference spacing); mobile restated in N */
@media (min-width: 768px) {
  .if-product-card__body,
  .if-shop-main .if-product-card__body,
  ul.products li.product .if-product-card__body {
    padding: 24px 24px 26px !important;
    gap: 0 !important;
  }
  .if-product-card__cat,
  .if-shop-main .if-product-card__cat {
    margin-bottom: 9px !important;
    font-size: 9px !important;
  }
  .if-product-card__title,
  .if-shop-main .if-product-card__title {
    font-size: 23px !important;
    line-height: 1.25 !important;
    margin-bottom: 14px !important;
  }
  .if-product-card__price,
  .if-shop-main .if-product-card__price {
    font-size: 17px !important;
    line-height: 1.2 !important;
    letter-spacing: .01em !important;
    border-top: 1px solid var(--line) !important;
    padding-top: 16px !important;
    margin-top: 14px !important;
  }
  .if-product-card__unit,
  .if-shop-main .if-product-card__unit {
    font-size: 9.5px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    margin-top: 3px !important;
  }
  .if-product-card__actions,
  .if-shop-main .if-product-card__actions {
    padding-top: 16px !important;
  }
  .if-product-card__actions .if-btn,
  .if-product-card__actions button,
  .if-product-card__actions a,
  ul.products li.product .if-product-card__actions .if-btn,
  ul.products li.product .add_to_cart_button {
    padding: 13px 10px !important;
    font-size: 9.5px !important;
    min-height: 44px !important;
  }
}

/* Badges — reference .prod-badge (square, white/gold; semantic variants restated) */
.woocommerce .onsale,
.woocommerce span.onsale,
.if-badge,
.if-product-card__badges > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 14px !important;
  background: rgba(255, 255, 255, .95) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-family: 'Jost', sans-serif !important;
  font-size: 9px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  color: var(--ink) !important;
  border: 1px solid rgba(200, 162, 74, .4) !important;
  border-radius: 0 !important;
}
.if-product-card__badges > .if-badge--new,
.if-product-card__badges > .if-badge--premium,
.if-badge--new,
.if-badge--premium {
  background: var(--grad-gold) !important;
  background-size: 230% 100% !important;
  border-color: transparent !important;
  color: #1a1408 !important;
}
.if-product-card__badges > .if-badge--sale,
.if-badge--sale {
  background: var(--if-sale) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.if-product-card__badges > .if-badge--low,
.if-badge--low {
  background: var(--gold-dp) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.if-product-card__badges > .if-badge--best,
.if-product-card__badges > .if-badge--wholesale,
.if-badge--best,
.if-badge--wholesale {
  background: var(--ink) !important;
  border-color: transparent !important;
  color: #fff !important;
}
.if-product-card__badges > .if-badge--restock,
.if-badge--restock {
  background: var(--if-success) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* ── K. Single product (summary panel + tabs) ── */
.single-product .summary.entry-summary {
  background: var(--white) !important;
  border: 1px solid var(--line) !important;
  padding: clamp(20px, 2.6vw, 32px) !important;
}
.if-product-card__price del {
  font-size: .85em !important;
}
.woocommerce-tabs {
  border-top: 1px solid var(--line) !important;
}
.woocommerce-tabs ul.tabs li a,
.woocommerce-tabs ul.tabs li.active a {
  font-family: 'Jost', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.woocommerce-tabs ul.tabs li a {
  font-weight: 400 !important;
  color: var(--muted) !important;
}
.woocommerce-tabs ul.tabs li.active a {
  color: var(--ink) !important;
  font-weight: 500 !important;
}
.woocommerce-tabs ul.tabs li a::after {
  height: 2px !important;
  background: transparent !important;
}
.woocommerce-tabs ul.tabs li.active a::after {
  background: var(--gold) !important;
}
.woocommerce-tabs .panel {
  background: var(--white) !important;
  border: 1px solid var(--line) !important;
  padding: 26px 28px !important;
  max-width: none !important;
}
.product_meta {
  border-top-color: var(--line) !important;
}
.stars a,
.woocommerce .star-rating span,
.woocommerce .star-rating {
  color: var(--gold) !important;
}

/* ── L. Cart / checkout tables (reference bordered panels) ── */
table.shop_table,
table.woocommerce-checkout-review-order-table,
.cart_totals table {
  background: var(--white) !important;
  border: 1px solid var(--line) !important;
  border-collapse: collapse !important;
}
table.shop_table th,
table.shop_table td,
table.woocommerce-checkout-review-order-table th,
table.woocommerce-checkout-review-order-table td,
.cart_totals table th,
.cart_totals table td {
  border-top: 1px solid var(--line) !important;
  vertical-align: middle !important;
}
table.shop_table thead th,
table.woocommerce-checkout-review-order-table thead th,
.cart_totals table thead th {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.3 !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--line) !important;
}
table.shop_table tbody td,
table.woocommerce-checkout-review-order-table tbody td,
.cart_totals table tbody td {
  padding: 14px 18px !important;
  font-size: 14px !important;
}
table.shop_table .product-name a {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}

/* ── M. Footer / pre-footer / newsletter (reference .footer) ── */
.if-footer {
  background: var(--ink) !important;
  color: rgba(255, 255, 255, .7) !important;
}
.if-footer::before {
  background: linear-gradient(90deg, transparent, rgba(200, 162, 74, .6), transparent) !important;
}
.if-footer__col h3,
.if-footer__title {
  font-family: 'Jost', sans-serif !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .3em !important;
  text-transform: uppercase !important;
  line-height: 1.4 !important;
  color: var(--gold-lt) !important;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 26px !important;
}
.if-footer__tagline {
  font-size: 13.5px !important;
  font-weight: 300 !important;
  line-height: 1.9 !important;
  color: rgba(255, 255, 255, .48) !important;
  max-width: 320px !important;
}
.if-footer__logo b,
.if-footer__logo strong {
  color: var(--gold-lt) !important;
}
.if-footer__list {
  gap: 13px !important;
}
.if-footer__list a {
  font-size: 13.5px !important;
  font-weight: 300 !important;
  color: rgba(255, 255, 255, .55) !important;
  padding-left: 0 !important;
  transition: color .35s var(--ease) !important;
}
.if-footer__list a::after {
  display: none !important;
}
.if-footer__list a::before {
  content: "" !important;
  position: static !important;
  display: inline-block !important;
  width: 0 !important;
  height: 1px !important;
  background: var(--gold) !important;
  opacity: 1 !important;
  transition: width .4s var(--ease) !important;
}
.if-footer__list a:hover {
  color: var(--gold-lt) !important;
  padding-left: 0 !important;
}
.if-footer__list a:hover::before {
  width: 14px !important;
}
.if-footer__list a:hover::after {
  transform: none !important;
}

/* Contact strip — typography only; contact values kept from the
   CONTACT-INFO task (#B9B2A6 links, tel/mailto/map URLs intact). */
.if-footer__contact-item {
  font-size: 13.5px !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
  color: #B9B2A6 !important;
}
.if-footer__contact-item a {
  color: #B9B2A6 !important;
}
.if-footer__contact-item a:hover {
  color: var(--gold-lt) !important;
}
.if-footer__contact-item svg {
  color: var(--gold) !important;
  width: 16px !important;
  height: 16px !important;
}

.if-social__link {
  width: 42px !important;
  height: 42px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  color: rgba(255, 255, 255, .7) !important;
}
.if-social__link:hover {
  background: var(--grad-gold) !important;
  color: #1a1408 !important;
  border-color: transparent !important;
  transform: translateY(-4px) !important;
}

.if-payments__item {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 0 !important;
  font-size: 9px !important;
  letter-spacing: .16em !important;
  color: rgba(255, 255, 255, .45) !important;
  height: 26px !important;
  padding: 0 12px !important;
}
.if-payments__label {
  color: rgba(255, 255, 255, .4) !important;
  font-size: 10px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
}
.if-footer__bottom {
  border-top-color: rgba(255, 255, 255, .1) !important;
}
.if-footer__copy {
  font-size: 11.5px !important;
  letter-spacing: .1em !important;
  color: rgba(255, 255, 255, .48) !important;
}
.if-footer__copy b,
.if-footer__copy strong,
.if-footer__copy a {
  color: var(--gold-lt) !important;
  font-weight: 500 !important;
}
.if-footer__bottom-links a {
  font-size: 11.5px !important;
  letter-spacing: .06em !important;
  color: rgba(255, 255, 255, .55) !important;
}
.if-footer__bottom-links a:hover {
  color: var(--gold-lt) !important;
}

/* Pre-footer CTA */
.if-pre-footer {
  background: var(--ink) !important;
}
.if-pre-footer h2 {
  font-weight: 300 !important;
  font-size: clamp(2rem, 3.8vw, 3.6rem) !important;
  line-height: 1.1 !important;
}
.if-pre-footer p {
  color: rgba(255, 255, 255, .55) !important;
  font-weight: 300 !important;
  line-height: 1.85 !important;
}

/* Newsletter block — styled to reference .foot-news (kept dormant:
   template remains gated by the theme's newsletter config check). */
.if-newsletter {
  background: var(--ink) !important;
  color: #fff !important;
}
.if-newsletter__eyebrow {
  color: var(--gold-lt) !important;
}
.if-newsletter h2 {
  font-size: clamp(26px, 3.2vw, 40px) !important;
  font-weight: 300 !important;
  line-height: 1.15 !important;
  color: #fff !important;
}
.if-newsletter p {
  color: rgba(255, 255, 255, .5) !important;
  font-weight: 300 !important;
}
.if-newsletter__form {
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.if-newsletter__form:focus-within {
  border-color: rgba(200, 162, 74, .7) !important;
}
.if-newsletter__form input {
  padding: 18px 22px !important;
  font-size: 13.5px !important;
  font-weight: 300 !important;
  letter-spacing: .03em !important;
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
}
.if-newsletter__form input::placeholder {
  color: rgba(255, 255, 255, .34) !important;
}
.if-newsletter__form button {
  padding: 0 32px !important;
  background: var(--grad-gold) !important;
  background-size: 220% 100% !important;
  background-position: 0 0 !important;
  color: #1a1408 !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  border-left: 1px solid rgba(255, 255, 255, .16) !important;
}
.if-newsletter__form button:hover {
  background-position: 100% 0 !important;
}
.if-newsletter__note {
  color: rgba(255, 255, 255, .45) !important;
}

/* ── N. Mobile restatements (preserves prior compactness tasks) ── */
@media (max-width: 767px) {
  .if-product-card__body,
  .if-shop-main .if-product-card__body,
  ul.products li.product .if-product-card__body {
    padding: 6px 10px 12px !important;
    gap: 2px !important;
  }
  .if-product-card__cat,
  .if-shop-main .if-product-card__cat {
    font-size: 8.5px !important;
    letter-spacing: .2em !important;
    margin: 4px 0 !important;
    line-height: 1.3 !important;
  }
  .if-product-card__title,
  .if-shop-main .if-product-card__title {
    font-size: 15px !important;
    line-height: 1.25 !important;
    margin: 4px 0 !important;
  }
  .if-product-card__set,
  .if-shop-main .if-product-card__set {
    font-size: 8.5px !important;
    padding: 4px 8px !important;
    margin: 4px 0 !important;
    line-height: 1.3 !important;
  }
  .if-product-card__price,
  .if-shop-main .if-product-card__price {
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin: 4px 0 !important;
    border-top: 0 !important;
    padding-top: 0 !important;
  }
  .if-product-card__unit,
  .if-shop-main .if-product-card__unit {
    font-size: 8.5px !important;
    margin: 4px 0 !important;
  }
  .if-product-card__actions,
  .if-shop-main .if-product-card__actions {
    padding-top: 6px !important;
  }
  .if-product-card__actions .if-btn,
  .if-product-card__actions button,
  .if-product-card__actions a,
  ul.products li.product .if-product-card__actions .if-btn,
  ul.products li.product .add_to_cart_button {
    padding: 10px 0 !important;
    font-size: 12px !important;
    letter-spacing: .14em !important;
    min-height: 0 !important;
  }
  .if-category-card__title {
    font-size: 0.95rem !important;
    margin: 0 !important;
  }
  .if-category-card__eyebrow {
    font-size: 0.6rem !important;
    letter-spacing: .3em !important;
    margin-bottom: 2px !important;
  }
}

@media (max-width: 639px) {
  .if-btn {
    padding: 15px 20px !important;
    font-size: 10.5px !important;
  }
  #place_order,
  .cart_totals .checkout-button,
  .wc-proceed-to-checkout a.checkout-button {
    padding: 14px 16px !important;
    font-size: 10.5px !important;
  }
  .if-newsletter__form button {
    padding: 16px !important;
  }
  .if-announce {
    font-size: 15px !important;
  }
  .if-marquee {
    padding-block: 12px !important;
  }
  .if-marquee__item {
    font-size: 16px !important;
  }
  .single-product .summary.entry-summary {
    padding: 18px !important;
  }
  .woocommerce-tabs .panel {
    padding: 18px !important;
  }
  table.shop_table thead th,
  table.woocommerce-checkout-review-order-table thead th,
  .cart_totals table thead th {
    padding: 10px 12px !important;
    font-size: 15px !important;
  }
  table.shop_table tbody td,
  table.woocommerce-checkout-review-order-table tbody td,
  .cart_totals table tbody td {
    padding: 10px 12px !important;
    font-size: 13px !important;
  }
}

/* ── O. Reduced motion — neutralise the transitions added above ── */
@media (prefers-reduced-motion: reduce) {
  .if-product-card,
  ul.products li.product:hover .if-product-card,
  .if-category-card,
  .if-category-card:hover .if-category-card__media img,
  .if-product-card:hover .if-product-card__media img,
  .if-product-card__media img,
  .if-btn,
  .if-btn:hover,
  #place_order:hover,
  .checkout-button:hover,
  button.single_add_to_cart_button:hover,
  .if-social__link:hover,
  .if-header .if-icon-btn:hover,
  .if-footer__list a::before {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}
/* ============================================================
   TASK 1.1 (FINAL LOCK) — HEADER LOGO FORCE SIZE (50% Increase)
   Overrides all AI-generated conflicting rules
   ============================================================ */

/* 1. Desktop Header - Taller bar to fit the logo */
.if-header__inner {
    height: 140px !important;
    max-height: 140px !important;
    min-height: 140px !important;
    display: flex !important;
    align-items: center !important;
}

/* 2. Desktop Logo Container - Force the height */
.if-header .if-logo,
.if-header .if-logo .custom-logo-link {
    height: 120px !important;
    max-height: 120px !important;
    min-height: 120px !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 3. Desktop Logo Image - Force size by matching the exact deep selector */
.if-header .if-logo .custom-logo-link img,
.if-header .if-logo img,
.if-header .if-logo .custom-logo {
    height: 120px !important; 
    max-height: 120px !important;
    min-height: 120px !important;
    width: auto !important;
    max-width: 400px !important;
    object-fit: contain !important;
    margin: 0 !important;
    display: block !important;
}

/* 4. Mobile Header - Override the tiny 30px mobile rule */
@media (max-width: 767px) {
    .if-header__inner {
        height: 100px !important;
        max-height: 100px !important;
        min-height: 100px !important;
        position: relative !important;
        justify-content: space-between !important;
    }
    
    .if-header .if-logo,
    .if-header .if-logo .custom-logo-link {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        height: 80px !important;
        max-height: 80px !important;
        min-height: 80px !important;
        width: auto !important;
        max-width: 250px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }
    
    .if-header .if-logo .custom-logo-link img,
    .if-header .if-logo img,
    .if-header .if-logo .custom-logo {
        height: 80px !important; 
        max-height: 80px !important;
        min-height: 80px !important;
        width: auto !important;
        max-width: 250px !important;
        object-fit: contain !important;
    }
}

/* 5. Small Mobile (320px) - Safe size for small screens */
@media (max-width: 359px) {
    .if-header__inner {
        height: 80px !important;
        max-height: 80px !important;
        min-height: 80px !important;
    }
    .if-header .if-logo,
    .if-header .if-logo .custom-logo-link {
        height: 60px !important;
        max-height: 60px !important;
        min-height: 60px !important;
    }
    .if-header .if-logo .custom-logo-link img,
    .if-header .if-logo img,
    .if-header .if-logo .custom-logo {
        height: 60px !important;
        max-height: 60px !important;
        min-height: 60px !important;
        max-width: 200px !important;
    }
}

/* ============================================================
   REMOVE ANNOUNCEMENT BAR & FIX HEADER TO TOP
   ============================================================ */

/* 1. Hide the announcement bar completely */
.if-announce {
    display: none !important;
}

/* 2. Move the header up to the very top (Since bar is gone) */
body .if-header {
    top: 0 !important; 
}

/* 3. Adjust Hero padding since header is now at the top */
body .if-hero-slider__content {
    padding-top: 120px !important; /* Safe space for the header */
}
/* ============================================================
   EXACT PATTERN FIX: CENTERED [LOGO + MENU], 20% SMALLER LOGO
   ============================================================ */

/* 1. Header Wrapper */
body .if-header {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
    height: 90px !important;
    display: flex !important;
    align-items: center !important;
}

/* 2. Header Inner - Group LOGO + MENU in the exact center */
body .if-header__inner {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important; /* Dono ko center karega */
    align-items: center !important;
    height: 100% !important;
    padding: 0 40px !important;
    margin: 0 !important;
    position: relative !important;
    gap: 40px !important; /* Logo aur Menu ke darmiyan gap */
}

/* 3. Logo - Only 20% Smaller, keep in center flow */
body .if-header .if-logo,
body .if-header .if-logo .custom-logo-link {
    height: 48px !important; /* 20% smaller than 60px */
    max-height: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    position: static !important; /* Wapas normal flow mein */
}

body .if-header .if-logo img,
body .if-header .if-logo .custom-logo,
body .if-header .if-logo .custom-logo-link img {
    height: 48px !important;
    max-height: 48px !important;
    min-height: 48px !important;
    width: auto !important;
    max-width: 180px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 !important;
}

/* 4. Menu - Exactly next to logo, vertically centered */
body .if-header .if-nav {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
}

body .if-header .if-nav__list {
    display: flex !important;
    gap: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
}

/* 5. Tools (Search, Cart) - Absolute Right (Taake center na toote) */
body .if-header .if-tools {
    position: absolute !important;
    right: 40px !important;
    top: 50% !important; 
    transform: translateY(-50%) !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

/* 6. White Text & Icons for Transparent State */
body .if-header .if-nav__link,
body .if-header .if-icon-btn,
body .if-header .if-burger span {
    color: #ffffff !important;
}
body .if-header .if-nav__link::after {
    background: #ffffff !important;
}
body .if-header .if-icon-btn svg {
    stroke: #ffffff !important;
}
body .if-header .if-burger span {
    background-color: #ffffff !important;
}

/* 7. Scrolled State - White Glass */
body .if-header.is-scrolled {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    top: 0 !important; 
    position: fixed !important;
}
body .if-header.is-scrolled .if-nav__link,
body .if-header.is-scrolled .if-icon-btn,
body .if-header.is-scrolled .if-burger span {
    color: #0d0d0f !important;
}
body .if-header.is-scrolled .if-nav__link::after {
    background: #0d0d0f !important;
}
body .if-header.is-scrolled .if-icon-btn svg {
    stroke: #0d0d0f !important;
}
body .if-header.is-scrolled .if-burger span {
    background-color: #0d0d0f !important;
}

/* 8. Hero Safe Space */
body .if-hero-slider__content {
    padding-top: 130px !important; 
}

/* 9. Mobile Fix */
@media (max-width: 767px) {
    body .if-header__inner {
        justify-content: space-between !important; /* Mobile pe burger ke liye space-between */
        padding: 0 20px !important;
        gap: 0 !important;
    }
    body .if-header .if-logo,
    body .if-header .if-logo img,
    body .if-header .if-logo .custom-logo {
        height: 40px !important;
        max-height: 40px !important;
    }
    body .if-header .if-tools {
        right: 20px !important;
    }
    /* Mobile pe menu hide, burger show */
    body .if-header .if-nav {
        display: none !important;
    }
}
/* ============================================================
   TASK 2.3 — "THE WHOLESALE ADVANTAGE" SECTION (DARK & PREMIUM)
   ============================================================ */

/* 1. Section Background - Faded Dark Gradient */
.if-section:has(.if-value-card) {
    background: linear-gradient(135deg, #0d0d0f 0%, #1c1a14 52%, #0d0d0f 100%) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* 2. Card Styling - Square Boundaries & Subtle Borders */
.if-value-card {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(200, 162, 74, 0.15) !important;
    border-radius: 0 !important; /* Square corners */
    padding: 44px 32px 40px !important;
    transition: all 0.55s cubic-bezier(0.19, 1, 0.22, 1) !important;
    position: relative !important;
}

/* Hover Effect on Card */
.if-value-card:hover {
    background: rgba(200, 162, 74, 0.08) !important;
    border-color: rgba(200, 162, 74, 0.42) !important;
    transform: translateY(-8px) !important;
}

/* 3. Icon Box - Square Boundary with Fill Effect */
.if-value-card__icon {
    width: 64px !important;
    height: 64px !important;
    border: 1px solid rgba(200, 162, 74, 0.4) !important;
    border-radius: 0 !important; /* Square */
    background: rgba(200, 162, 74, 0.1) !important; /* Fill effect */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 28px !important;
    transition: all 0.55s cubic-bezier(0.19, 1, 0.22, 1) !important;
}

/* Hover Effect on Icon (Gold Gradient Fill) */
.if-value-card:hover .if-value-card__icon {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    border-color: transparent !important;
    transform: rotate(-6deg) !important;
}

/* 4. SVG Icons - Stroke to Fill Effect */
.if-value-card__icon svg {
    width: 26px !important;
    height: 26px !important;
    fill: #c8a24a !important; /* Fill effect */
    stroke: #c8a24a !important;
    transition: all 0.55s ease !important;
}

/* Icon Color change on Hover */
.if-value-card:hover .if-value-card__icon svg {
    fill: #1a1408 !important;
    stroke: #1a1408 !important;
}

/* 5. Typography - White Text on Dark Background */
.if-value-card h3,
.if-value-card h4 {
    color: #ffffff !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 23px !important;
    font-weight: 500 !important;
    margin-bottom: 12px !important;
    letter-spacing: 0.01em !important;
}

.if-value-card p {
    color: rgba(255, 255, 255, 0.55) !important;
    font-size: 13.5px !important;
    line-height: 1.8 !important;
    font-weight: 300 !important;
}
/* ============================================================
   FIX: WHITE HEADING FOR "THE WHOLESALE ADVANTAGE" SECTION
   ============================================================ */

/* Target the heading inside the dark section */
.if-section:has(.if-value-card) .if-section__head h2,
.if-section:has(.if-value-card) .if-section__head h3,
.if-section:has(.if-value-card) h2,
.if-section:has(.if-value-card) h3 {
    color: #ffffff !important;
}

/* Also make sure the eyebrow text (small label above heading) is gold and visible */
.if-section:has(.if-value-card) .if-eyebrow {
    color: #c8a24a !important;
}

/* And the subtitle/description below heading should be light grey/white */
.if-section:has(.if-value-card) .if-section__head p,
.if-section:has(.if-value-card) .if-sub {
    color: rgba(255, 255, 255, 0.7) !important;
}
/* ============================================================
   FINAL PRELOADER — STATIC LOGO + ANIMATED ROTATING CIRCLES
   (Bulletproof: hides all inner content)
   ============================================================ */

/* 1. Preloader Background - Dark Black */
#if-preloader {
    background: #0d0d0f !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    width: 100vw !important;
    height: 100vh !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. Inner - Centered Column */
#if-preloader .if-preloader__inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 40px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* 3. Logo Box - STATIC, shows circular logo via background image */
#if-preloader .if-preloader__logo {
    width: 110px !important;
    height: 110px !important;
    display: block !important;
    position: relative !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: none !important;
    border-radius: 50% !important;
    overflow: visible !important;
    
    /* Show the actual circular logo as background */
    background-image: url('/wp-content/uploads/2026/10/circular-logo.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-color: transparent !important;
    
    /* NO animation - logo stays STATIC */
    animation: none !important;
    transform: none !important;
}

/* 4. CRITICAL: Hide ALL children inside logo (text, spans, img) */
#if-preloader .if-preloader__logo > *,
#if-preloader .if-preloader__logo span,
#if-preloader .if-preloader__logo b,
#if-preloader .if-preloader__logo strong,
#if-preloader .if-preloader__logo img,
#if-preloader .if-preloader__logo a {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

/* 5. Also hide any text directly inside (text-indent as backup) */
#if-preloader .if-preloader__logo {
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    text-indent: -9999px !important;
    letter-spacing: 0 !important;
}

/* 6. Inner Rotating Circle (Clockwise) */
#if-preloader .if-preloader__logo::before {
    content: '' !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: -15px !important;
    left: -15px !important;
    right: -15px !important;
    bottom: -15px !important;
    width: auto !important;
    height: auto !important;
    border: 2px solid rgba(200, 162, 74, 0.6) !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    pointer-events: none !important;
    z-index: 2 !important;
    animation: ifPreloaderSpinCW 4s linear infinite !important;
}

/* 7. Outer Rotating Circle (Counter-clockwise) */
#if-preloader .if-preloader__logo::after {
    content: '' !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: -30px !important;
    left: -30px !important;
    right: -30px !important;
    bottom: -30px !important;
    width: auto !important;
    height: auto !important;
    border: 2px solid rgba(200, 162, 74, 0.3) !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    pointer-events: none !important;
    z-index: 1 !important;
    animation: ifPreloaderSpinCCW 6s linear infinite !important;
}

/* 8. Gold Loading Bar */
#if-preloader .if-preloader__line {
    width: 190px !important;
    height: 2px !important;
    background: rgba(200, 162, 74, 0.2) !important;
    overflow: hidden !important;
    border-radius: 4px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 3 !important;
}

#if-preloader .if-preloader__line::after {
    content: '' !important;
    display: block !important;
    height: 100% !important;
    width: 0 !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    animation: ifPreloaderLoadBar 1.6s cubic-bezier(.65, 0, .35, 1) forwards !important;
}

/* 9. Keyframes - Unique Names to Avoid Conflicts */
@keyframes ifPreloaderSpinCW {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes ifPreloaderSpinCCW {
    from { transform: rotate(0deg); }
    to { transform: rotate(-360deg); }
}

@keyframes ifPreloaderLoadBar {
    from { width: 0; }
    to { width: 100%; }
}
/* ============================================================
   FIX: CTA SECTION SECONDARY BUTTON (Transparent + White Text)
   ============================================================ */

/* Target the pre-footer CTA section buttons */
.if-pre-footer .if-btn,
.if-pre-footer__actions .if-btn,
.if-pre-footer a.if-btn,
.cta-actions .if-btn {
    /* Default state: transparent bg, white text */
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    box-shadow: none !important;
    transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1) !important;
}

/* Make sure the Gold button stays Gold (if it's the first button) */
.if-pre-footer .if-btn--gold,
.if-pre-footer__actions .if-btn--gold,
.if-pre-footer .if-btn:first-child {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    color: #1a1408 !important;
    border: 1px solid transparent !important;
}

/* Hover state for the secondary (ghost) button */
.if-pre-footer .if-btn:hover,
.if-pre-footer__actions .if-btn:hover,
.cta-actions .if-btn:hover {
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #0d0d0f !important;
    border-color: #ffffff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px -10px rgba(255, 255, 255, 0.3) !important;
}

/* Prevent the gold button from turning white on hover */
.if-pre-footer .if-btn--gold:hover,
.if-pre-footer__actions .if-btn--gold:hover,
.if-pre-footer .if-btn:first-child:hover {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    color: #1a1408 !important;
    border-color: transparent !important;
}
/* ============================================================
   FIX: FOOTER LOGO — COMPLETELY STATIC (No Animation, No Effect)
   ============================================================ */

/* 1. Kill ALL animations, transforms, filters on the footer logo container */
.if-footer .if-footer__logo--image,
.if-footer .if-footer__logo--image *,
.if-footer .if-footer__logo--image::before,
.if-footer .if-footer__logo--image::after,
.if-footer .if-footer__logo--image .custom-logo-link,
.if-footer .if-footer__logo--image .custom-logo-link::before,
.if-footer .if-footer__logo--image .custom-logo-link::after,
.if-footer .if-footer__logo--image img,
.if-footer .if-footer__logo--image .custom-logo {
    animation: none !important;
    animation-name: none !important;
    animation-duration: 0s !important;
    animation-iteration-count: 1 !important;
    transition: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* 2. Remove any pseudo-element overlays (glow, sparkles, sweep) */
.if-footer .if-footer__logo--image::before,
.if-footer .if-footer__logo--image::after,
.if-footer .if-footer__logo--image .custom-logo-link::before,
.if-footer .if-footer__logo--image .custom-logo-link::after {
    content: none !important;
    display: none !important;
    background: none !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* 3. Reset the logo container's stage effects (glow halo etc.) */
.if-footer .if-footer__logo--image {
    background: transparent !important;
    padding: 0 !important;
    isolation: auto !important;
    perspective: none !important;
    position: relative !important;
    overflow: visible !important;
}

/* 4. Logo image itself - show at a proper static size */
.if-footer .if-footer__logo--image img,
.if-footer .if-footer__logo--image .custom-logo {
    display: block !important;
    height: 96px !important;
    max-height: 96px !important;
    width: auto !important;
    max-width: 320px !important;
    object-fit: contain !important;
    object-position: center left !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. Hover pe bhi koi animation na ho */
.if-footer .if-footer__logo--image:hover,
.if-footer .if-footer__logo--image:hover img,
.if-footer .if-footer__logo--image:hover .custom-logo,
.if-footer .if-footer__logo--image .custom-logo-link:hover,
.if-footer .if-footer__logo--image .custom-logo-link:hover img {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

/* 6. Mobile size for footer logo */
@media (max-width: 767px) {
    .if-footer .if-footer__logo--image img,
    .if-footer .if-footer__logo--image .custom-logo {
        height: 72px !important;
        max-height: 72px !important;
    }
}
/* ============================================================
   REFERENCE MATCH — PRELOADER + TRANSPARENT HEADER
   Bilkul reference HTML (index.html + theme.css) ke mutabiq.
   Ye block purane saare conflicting rules ko override karega.
   ============================================================ */

/* ═══════════════════════════════════════════════════════════
   1. PRELOADER (Reference .pl-mark + .pl-text + .pl-bar match)
   ═══════════════════════════════════════════════════════════ */

#if-preloader,
#if-preloader.if-preloader {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    background: #faf8f4 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 26px !important;
    padding: 0 !important;
    margin: 0 !important;
    transition: opacity .8s cubic-bezier(.19,1,.22,1), visibility .8s !important;
}

#if-preloader.is-hidden,
#if-preloader.done {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* The IF Box (reference .pl-mark) */
#if-preloader .if-preloader__mark {
    width: 74px !important;
    height: 74px !important;
    border: 1px solid #c8a24a !important;
    display: grid !important;
    place-items: center !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 28px !important;
    font-weight: 500 !important;
    color: #9a7a2e !important;
    letter-spacing: .02em !important;
    position: relative !important;
    animation: ifPlPulse 2s ease-in-out infinite !important;
    background: transparent !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

#if-preloader .if-preloader__mark::before,
#if-preloader .if-preloader__mark::after {
    content: '' !important;
    position: absolute !important;
    inset: -9px !important;
    border: 1px solid rgba(200, 162, 74, .32) !important;
    animation: ifPlSpin 6s linear infinite !important;
    pointer-events: none !important;
    box-sizing: border-box !important;
}

#if-preloader .if-preloader__mark::after {
    inset: -18px !important;
    border-color: rgba(200, 162, 74, .14) !important;
    animation-direction: reverse !important;
    animation-duration: 9s !important;
}

/* The "Ibrahim Fashion" Text (reference .pl-text) */
#if-preloader .if-preloader__text {
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .55em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    padding-left: .55em !important;
    text-align: center !important;
    margin: 0 !important;
    line-height: 1 !important;
}

/* The Gold Loading Bar (reference .pl-bar) */
#if-preloader .if-preloader__bar {
    width: 190px !important;
    height: 2px !important;
    background: rgba(200, 162, 74, .2) !important;
    overflow: hidden !important;
    border-radius: 4px !important;
    margin: 0 !important;
}

#if-preloader .if-preloader__bar span {
    display: block !important;
    height: 100% !important;
    width: 0 !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    animation: ifPlLoad 1.6s cubic-bezier(.65, 0, .35, 1) forwards !important;
}

@keyframes ifPlSpin { to { transform: rotate(360deg); } }
@keyframes ifPlPulse { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
@keyframes ifPlLoad { to { width: 100%; } }

/* ═══════════════════════════════════════════════════════════
   2. HEADER LAYOUT — Logo Left, Nav Center, Tools Right
      (Reference .header-inner { justify-content: space-between })
   ═══════════════════════════════════════════════════════════ */

.if-header__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 30px !important;
    position: relative !important;
}

/* Desktop: burger hidden, nav visible */
@media (min-width: 1024px) {
    .if-header .if-burger {
        display: none !important;
    }
    .if-header .if-nav {
        display: flex !important;
        align-items: center !important;
    }
}

/* ═══════════════════════════════════════════════════════════
   3. TRANSPARENT HEADER (Homepage only, matches reference
      ".header.transparent")
   ═══════════════════════════════════════════════════════════ */

/* When transparent AND NOT scrolled — sits over hero, invisible */
.if-header.is-transparent:not(.is-scrolled) {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
}

/* White text on transparent state */
.if-header.is-transparent:not(.is-scrolled) .if-nav__link {
    color: rgba(255, 255, 255, .92) !important;
}
.if-header.is-transparent:not(.is-scrolled) .if-nav__link::after {
    background: #c8a24a !important;
}
.if-header.is-transparent:not(.is-scrolled) .if-icon-btn {
    color: rgba(255, 255, 255, .92) !important;
}
.if-header.is-transparent:not(.is-scrolled) .if-icon-btn svg {
    stroke: rgba(255, 255, 255, .92) !important;
}
.if-header.is-transparent:not(.is-scrolled) .if-burger {
    color: rgba(255, 255, 255, .92) !important;
}
.if-header.is-transparent:not(.is-scrolled) .if-burger svg {
    stroke: rgba(255, 255, 255, .92) !important;
}

/* When transparent AND scrolled — smooth white glass */
.if-header.is-transparent.is-scrolled {
    background: rgba(255, 255, 255, .95) !important;
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
    box-shadow: 0 12px 40px -18px rgba(13, 13, 15, .22) !important;
    border-bottom: 1px solid rgba(200, 162, 74, .16) !important;
    position: fixed !important;
    top: 0 !important;
}

/* Dark text on scrolled white state */
.if-header.is-transparent.is-scrolled .if-nav__link {
    color: rgba(13, 13, 15, .78) !important;
}
.if-header.is-transparent.is-scrolled .if-icon-btn {
    color: rgba(13, 13, 15, .8) !important;
}
.if-header.is-transparent.is-scrolled .if-icon-btn svg {
    stroke: rgba(13, 13, 15, .8) !important;
}
.if-header.is-transparent.is-scrolled .if-burger {
    color: rgba(13, 13, 15, .8) !important;
}
.if-header.is-transparent.is-scrolled .if-burger svg {
    stroke: rgba(13, 13, 15, .8) !important;
}

/* Hero must start at very top (no gap) since header is absolute */
body.if-front-page .if-hero-slider,
body.if-front-page .if-hero {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* ============================================================
   REFERENCE MATCH — FOOTER (Static logo, 4-col grid, no animations)
   Reference theme.css .foot-main / .foot-brand / .foot-col structure.
   Purane cinematic animations + contact strip ko disable karta hai.
   ============================================================ */

/* ═══════════════════════════════════════════════════════════
   1. KILL ALL FOOTER LOGO ANIMATIONS (Reference is static)
   ═══════════════════════════════════════════════════════════ */

.if-footer .if-footer__logo--image,
.if-footer .if-footer__logo--image *,
.if-footer .if-footer__logo--image::before,
.if-footer .if-footer__logo--image::after,
.if-footer .if-footer__logo--image .custom-logo-link,
.if-footer .if-footer__logo--image .custom-logo-link::before,
.if-footer .if-footer__logo--image .custom-logo-link::after,
.if-footer .if-footer__logo--image img {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    mix-blend-mode: normal !important;
}

.if-footer .if-footer__logo--image::before,
.if-footer .if-footer__logo--image::after,
.if-footer .if-footer__logo--image .custom-logo-link::before,
.if-footer .if-footer__logo--image .custom-logo-link::after {
    content: none !important;
    display: none !important;
    background: none !important;
}

.if-footer .if-footer__logo--image {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 0 24px 0 !important;
    position: relative !important;
    overflow: visible !important;
}

.if-footer .if-footer__logo--image img,
.if-footer .if-footer__logo--image .custom-logo {
    display: block !important;
    height: 96px !important;
    max-height: 96px !important;
    min-height: 0 !important;
    width: auto !important;
    max-width: 320px !important;
    object-fit: contain !important;
    object-position: center left !important;
}

/* ═══════════════════════════════════════════════════════════
   2. NEWSLETTER BLOCK (Reference .foot-news)
   ═══════════════════════════════════════════════════════════ */

.if-footer__news {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 60px !important;
    align-items: center !important;
    padding-bottom: 64px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
    margin-bottom: 0 !important;
}

.if-footer__news-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(26px, 3.2vw, 40px) !important;
    font-weight: 300 !important;
    line-height: 1.15 !important;
    margin: 0 0 14px 0 !important;
    color: #fff !important;
    letter-spacing: -0.01em !important;
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
}

.if-footer__news-title em {
    font-style: italic !important;
    color: #e9d6a3 !important;
    background: transparent !important;
}

.if-footer__news-text {
    font-size: 13.5px !important;
    color: rgba(255, 255, 255, .5) !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
    margin: 0 !important;
}

.if-footer__news-form {
    display: flex !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    background: transparent !important;
    border-radius: 0 !important;
}

.if-footer__news-form input {
    flex: 1 !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    padding: 18px 22px !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: 13.5px !important;
    font-weight: 300 !important;
    letter-spacing: .03em !important;
    border-radius: 0 !important;
    min-width: 0 !important;
}

.if-footer__news-form input::placeholder {
    color: rgba(255, 255, 255, .34) !important;
}

.if-footer__news-form button {
    padding: 0 32px !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    background-size: 220% 100% !important;
    background-position: 0 0 !important;
    color: #1a1408 !important;
    font-size: 10.5px !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
    border: none !important;
    transition: background-position .55s cubic-bezier(.19,1,.22,1) !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

.if-footer__news-form button:hover {
    background-position: 100% 0 !important;
}

/* ═══════════════════════════════════════════════════════════
   3. MAIN GRID — 4 columns (Reference .foot-main 1.6fr 1fr 1fr 1.2fr)
   ═══════════════════════════════════════════════════════════ */

.if-footer__grid {
    display: grid !important;
    grid-template-columns: 1.6fr 1fr 1fr 1.2fr !important;
    gap: 50px !important;
    padding: 70px 0 60px !important;
    margin: 0 !important;
    align-items: start !important;
}

.if-footer__brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    max-width: 420px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.if-footer__tagline {
    margin: 0 0 24px 0 !important;
    font-size: 13.5px !important;
    line-height: 1.9 !important;
    color: rgba(255, 255, 255, .48) !important;
    font-weight: 300 !important;
    max-width: 320px !important;
    padding: 0 !important;
}

.if-footer__col {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.if-footer__title,
.if-footer__col h5 {
    font-family: 'Jost', sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: .3em !important;
    text-transform: uppercase !important;
    color: #e9d6a3 !important;
    margin: 0 0 26px 0 !important;
    padding: 0 !important;
    border: none !important;
    border-bottom: 0 !important;
    background: transparent !important;
    line-height: 1.4 !important;
}

.if-footer__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 13px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.if-footer__list li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.if-footer__list a {
    font-family: 'Jost', sans-serif !important;
    font-size: 13.5px !important;
    color: rgba(255, 255, 255, .55) !important;
    font-weight: 300 !important;
    transition: color .35s cubic-bezier(.19,1,.22,1) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    padding: 0 !important;
}

.if-footer__list a:hover {
    color: #e9d6a3 !important;
    padding-left: 0 !important;
}

.if-footer__list a::before {
    content: '' !important;
    display: inline-block !important;
    width: 0 !important;
    height: 1px !important;
    background: #c8a24a !important;
    transition: width .4s cubic-bezier(.19,1,.22,1) !important;
    position: static !important;
    opacity: 1 !important;
}

.if-footer__list a:hover::before {
    width: 14px !important;
}

.if-footer__list a::after {
    content: none !important;
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════
   4. CONTACT COLUMN (Reference .foot-contact)
   ═══════════════════════════════════════════════════════════ */

.if-footer__col--contact .if-footer__contact,
.if-footer__col--contact .footer-contact-info,
.if-footer__col--contact > div {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    width: 100% !important;
}

.if-footer__col--contact .if-footer__contact-item,
.if-footer__col--contact .footer-contact-info > div {
    display: flex !important;
    gap: 13px !important;
    align-items: flex-start !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 13.5px !important;
    color: rgba(255, 255, 255, .55) !important;
    font-weight: 300 !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.if-footer__col--contact .if-footer__contact-item svg,
.if-footer__col--contact .footer-contact-info svg {
    width: 16px !important;
    height: 16px !important;
    stroke: #c8a24a !important;
    stroke-width: 1.4 !important;
    fill: none !important;
    flex: none !important;
    margin-top: 3px !important;
}

.if-footer__col--contact a {
    color: rgba(255, 255, 255, .55) !important;
    text-decoration: none !important;
}

.if-footer__col--contact a:hover {
    color: #e9d6a3 !important;
}

/* Old separate contact-strip class — disable now that it's in column */
.if-footer__contact-strip {
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════
   5. BOTTOM BAR (Reference .foot-bottom: copyright + payments)
   ═══════════════════════════════════════════════════════════ */

.if-footer__bottom {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
    padding: 28px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .1) !important;
    margin: 0 !important;
}

.if-footer__copy {
    font-family: 'Jost', sans-serif !important;
    font-size: 11.5px !important;
    letter-spacing: .1em !important;
    color: rgba(255, 255, 255, .36) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.if-footer__copy strong,
.if-footer__copy b {
    color: #e9d6a3 !important;
    font-weight: 500 !important;
}

.if-footer__bottom-links {
    display: none !important;
}

.if-footer__bottom .if-payments {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.if-footer__bottom .if-payments__item {
    padding: 6px 12px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: 9px !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    color: rgba(255, 255, 255, .45) !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.if-footer__bottom .if-payments__item svg {
    color: #c8a24a !important;
}

/* ═══════════════════════════════════════════════════════════
   6. SOCIAL ICONS (Reference .socials)
   ═══════════════════════════════════════════════════════════ */

.if-footer__brand .if-social,
.if-footer .if-social {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-start !important;
}

.if-footer__brand .if-social__link,
.if-footer .if-social__link {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255, 255, 255, .7) !important;
    transition: all .45s cubic-bezier(.19,1,.22,1) !important;
    padding: 0 !important;
    margin: 0 !important;
}

.if-footer__brand .if-social__link:hover,
.if-footer .if-social__link:hover {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    color: #1a1408 !important;
    border-color: transparent !important;
    transform: translateY(-4px) !important;
}

.if-footer__brand .if-social__link svg,
.if-footer .if-social__link svg {
    width: 16px !important;
    height: 16px !important;
    stroke-width: 1.4 !important;
    stroke: currentColor !important;
    fill: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}

/* ═══════════════════════════════════════════════════════════
   7. RESPONSIVE (Reference breakpoints: 1180 / 1024 / 820 / 620)
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 1180px) {
    .if-footer__grid {
        grid-template-columns: 1.6fr 1fr 1fr 1.2fr !important;
        gap: 44px !important;
    }
}

@media (max-width: 1023px) {
    .if-footer__news {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }
    .if-footer__grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 44px !important;
    }
    .if-footer__brand {
        grid-column: 1 / -1 !important;
        max-width: 100% !important;
    }
}

@media (max-width: 820px) {
    .if-footer__grid {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
}

@media (max-width: 599px) {
    .if-footer__bottom {
        flex-direction: column !important;
        text-align: center !important;
        align-items: center !important;
    }
    .if-footer__brand .if-footer__logo--image img {
        height: 72px !important;
        max-height: 72px !important;
    }
}

/* Reduced motion — kill every transition in footer */
@media (prefers-reduced-motion: reduce) {
    .if-footer *,
    .if-footer *::before,
    .if-footer *::after {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}
/* ============================================================
   HERO STRIP (Reference .hero-strip)
   ============================================================ */

.if-hero-slider__strip {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 6;
    width: 100%;
    background: rgba(255, 255, 255, .035);
    border-top: 1px solid rgba(255, 255, 255, .12);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.if-hero-slider__strip-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    width: 100%;
}

.if-hero-slider__hs-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 24px 22px;
    border-right: 1px solid rgba(255, 255, 255, .1);
}

.if-hero-slider__hs-item:last-child {
    border-right: none;
}

.if-hero-slider__hs-item:hover {
    background: rgba(200, 162, 74, .1);
}

.if-hero-slider__hs-item svg {
    color: #c8a24a;
    flex-shrink: 0;
    display: block;
}

.if-hero-slider__hs-text {
    min-width: 0;
}

.if-hero-slider__hs-text b {
    display: block;
    color: #ffffff;
    font-size: 11.5px;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-weight: 500;
    line-height: 1.3;
    margin: 0;
}

.if-hero-slider__hs-text small {
    display: block;
    color: rgba(255, 255, 255, .5);
    font-size: 10.5px;
    letter-spacing: .06em;
    margin-top: 3px;
    line-height: 1.3;
}

/* Hero content ko strip ke liye neeche jagah dein */
@media (min-width: 1025px) {
    .if-hero-slider__content {
        padding-bottom: 130px;
    }
}

@media (max-width: 1024px) and (min-width: 621px) {
    .if-hero-slider__content {
        padding-bottom: 200px;
    }
}

@media (max-width: 620px) {
    .if-hero-slider__content {
        padding-bottom: 300px;
    }
}

/* Tablet: strip 2 columns */
@media (max-width: 1024px) {
    .if-hero-slider__strip-inner {
        grid-template-columns: repeat(2, 1fr);
    }
    .if-hero-slider__hs-item:nth-child(2) {
        border-right: none;
    }
    .if-hero-slider__hs-item:nth-child(-n+2) {
        border-bottom: 1px solid rgba(255, 255, 255, .1);
    }
}

/* Mobile: strip 1 column */
@media (max-width: 620px) {
    .if-hero-slider__strip-inner {
        grid-template-columns: 1fr;
    }
    .if-hero-slider__hs-item {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, .1);
        padding: 18px 20px;
    }
    .if-hero-slider__hs-item:last-child {
        border-bottom: none;
    }
}
/* ============================================================
   CATEGORY CARDS (Reference .cat-card / .cat-num / .cat-link)
   ============================================================ */

/* Number badge — top-right circle */
.if-category-card {
    position: relative;
}

.if-category-card__num {
    position: absolute;
    top: 22px;
    right: 24px;
    z-index: 2;
    font-family: 'Cormorant Garamond', serif;
    font-size: 12px;
    letter-spacing: .15em;
    color: rgba(255, 255, 255, .5);
    border: 1px solid rgba(255, 255, 255, .22);
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    transition: all .5s cubic-bezier(.19,1,.22,1);
    box-sizing: border-box;
    pointer-events: none;
}

.if-category-card:hover .if-category-card__num {
    border-color: #c8a24a;
    color: #e9d6a3;
    background: rgba(200, 162, 74, .16);
}

/* CTA — "View Collection →" */
.if-category-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 16px;
    font-size: 10px;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .7);
    transition: opacity .5s cubic-bezier(.19,1,.22,1) .06s, transform .5s cubic-bezier(.19,1,.22,1) .06s, color .3s;
}

.if-category-card__cta svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
    display: inline-block;
}

/* Desktop only: CTA hidden until hover */
@media (hover: hover) and (min-width: 768px) {
    .if-category-card__cta {
        opacity: 0;
        transform: translateY(12px);
    }
    .if-category-card:hover .if-category-card__cta {
        opacity: 1;
        transform: translateY(0);
        color: #e9d6a3;
    }
}

/* Mobile: CTA always visible */
@media (hover: none), (max-width: 767px) {
    .if-category-card__cta {
        opacity: 1;
        transform: none;
    }
}

/* Body padding + eyebrow tweak (reference proportions) */
.if-category-card__body {
    padding: 28px 24px;
}

.if-category-card__eyebrow {
    color: #e9d6a3;
    font-weight: 500;
    letter-spacing: .34em;
    margin-bottom: 9px;
}

.if-category-card__title {
    color: #ffffff;
    font-weight: 400;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .if-category-card__num,
    .if-category-card__cta {
        transition: none;
    }
}
/* Fix: extra arrow on category CTA (kill pseudo-element arrow) */
.if-category-card__cta::after,
.if-category-card__cta::before {
    content: none !important;
    display: none !important;
}
/* ============================================================
   MARQUEE — REFERENCE MATCH
   Gold borders + italic Cormorant 20px + star separator.
   ============================================================ */

.if-marquee {
    background: #0d0d0f !important;
    padding-block: 20px !important;
    border-top: 1px solid rgba(200, 162, 74, .24) !important;
    border-bottom: 1px solid rgba(200, 162, 74, .24) !important;
}

.if-marquee__item {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    font-style: italic !important;
    font-weight: 400 !important;
    color: rgba(255, 255, 255, .86) !important;
    letter-spacing: .05em !important;
    text-transform: none !important;
    padding: 0 26px !important;
    gap: 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

/* Star separator (reference ✦) */
.if-marquee__item::after {
    content: "✦" !important;
    color: #c8a24a !important;
    font-size: 14px !important;
    font-style: normal !important;
    line-height: 1 !important;
}

/* Light variant */
.if-marquee--light {
    background: #faf8f4 !important;
    border-top-color: rgba(13, 13, 15, .09) !important;
    border-bottom-color: rgba(13, 13, 15, .09) !important;
}

.if-marquee--light .if-marquee__item {
    color: #0d0d0f !important;
}

.if-marquee--light .if-marquee__item::after {
    color: #c8a24a !important;
}
/* ============================================================
   PRODUCT CARDS — REFERENCE MATCH
   Set badge + wishlist + quick view + meta bar.
   ============================================================ */

/* Badges container — top-left vertical stack */
.if-product-card__badges {
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    z-index: 3 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    align-items: flex-start !important;
    pointer-events: none !important;
}

/* Set badge — gold gradient pill */
.if-product-card__set-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 8px 14px !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    border: 1px solid transparent !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 9px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: #1a1408 !important;
    line-height: 1 !important;
}

.if-product-card__set-badge svg {
    width: 11px !important;
    height: 11px !important;
    stroke: #1a1408 !important;
    flex-shrink: 0 !important;
    display: block !important;
}

/* Wishlist heart — top-right, hover reveal */
.if-product-card__fav {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 3 !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    background: rgba(255, 255, 255, .9) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    color: #0d0d0f !important;
    border: none !important;
    cursor: pointer !important;
    opacity: 0 !important;
    transform: translateY(-8px) !important;
    transition: opacity .45s cubic-bezier(.19,1,.22,1), transform .45s cubic-bezier(.19,1,.22,1), background .3s, color .3s !important;
}

.if-product-card__fav svg {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
}

.if-product-card:hover .if-product-card__fav {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.if-product-card__fav:hover {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    color: #1a1408 !important;
}

/* Quick view overlay — bottom, hover reveal */
.if-product-card__quick {
    position: absolute !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 16px !important;
    z-index: 3 !important;
    display: flex !important;
    gap: 8px !important;
    opacity: 0 !important;
    transform: translateY(18px) !important;
    transition: opacity .5s cubic-bezier(.19,1,.22,1), transform .5s cubic-bezier(.19,1,.22,1) !important;
}

.if-product-card:hover .if-product-card__quick {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.if-product-card__quick-btn {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 13px 10px !important;
    background: rgba(13, 13, 15, .9) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    color: #fff !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 9.5px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    border: none !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background .4s cubic-bezier(.19,1,.22,1), color .4s !important;
    line-height: 1.2 !important;
}

.if-product-card__quick-btn svg {
    width: 14px !important;
    height: 14px !important;
    display: block !important;
    flex-shrink: 0 !important;
}

.if-product-card__quick-btn:hover {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    color: #1a1408 !important;
}

/* Meta bar — bordered top, price left + SKU pill right */
.if-product-card__meta {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding-top: 16px !important;
    margin-top: auto !important;
    border-top: 1px solid rgba(13, 13, 15, .09) !important;
}

.if-product-card__price {
    display: flex !important;
    flex-direction: column !important;
    line-height: 1.2 !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    color: #0d0d0f !important;
    font-variant-numeric: tabular-nums !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.if-product-card__price small {
    font-size: 9.5px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    margin-top: 3px !important;
    font-weight: 400 !important;
    display: block !important;
}

.if-product-card__moq {
    font-family: 'Jost', sans-serif !important;
    font-size: 9.5px !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: #9a7a2e !important;
    border: 1px solid rgba(200, 162, 74, .35) !important;
    padding: 6px 11px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    background: transparent !important;
}

/* Body — flex column, full height */
.if-product-card__body {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    height: 100% !important;
}

/* Mobile-only Add to Cart button */
.if-product-card__actions-mobile {
    display: none !important;
}

@media (hover: none), (max-width: 767px) {
    .if-product-card__fav {
        opacity: 1 !important;
        transform: none !important;
    }
    .if-product-card__quick {
        display: none !important;
    }
    .if-product-card__actions-mobile {
        display: block !important;
        margin-top: 12px !important;
    }
    .if-product-card__actions-mobile .if-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .if-product-card__fav,
    .if-product-card__quick,
    .if-product-card__quick-btn {
        transition: none !important;
    }
}
/* ============================================================
   FIX: Product card body — remove middle gap
   Meta bar ab natural flow mein title ke neeche ayega,
   extra space card ke bottom (below body) mein rahegi.
   ============================================================ */

/* Body — natural height, no flex stretch */
.if-product-card .if-product-card__body,
ul.products li.product .if-product-card__body,
.if-shop-main .if-product-card__body {
    flex: 0 0 auto !important;
    height: auto !important;
    padding: 24px 24px 26px !important;
}

/* Meta bar — right after title, no auto margin */
.if-product-card .if-product-card__meta,
ul.products li.product .if-product-card__meta {
    margin-top: 0 !important;
    padding-top: 16px !important;
}

/* Article — still stretch to fill grid cell (equal height cards) */
.if-product-card {
    justify-content: flex-start !important;
}
/* ============================================================
   FIX: Product card badges — no overlap, clean vertical stack
   ============================================================ */

/* Container — proper vertical column */
.if-product-card .if-product-card__badges,
ul.products li.product .if-product-card__badges {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    align-items: flex-start !important;
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    z-index: 5 !important;
    pointer-events: none !important;
}

/* Every badge inside — static, no absolute, no overlap */
.if-product-card .if-product-card__badges > *,
ul.products li.product .if-product-card__badges > * {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
}

/* "NEW" badge from if_product_badges() — square corners, gold */
.if-product-card .if-product-card__badges .if-badge,
.if-product-card .if-product-card__badges .onsale,
.if-product-card .if-product-card__badges > span:not(.if-product-card__set-badge) {
    padding: 8px 14px !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    color: #1a1408 !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 9px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    border: 1px solid transparent !important;
    border-radius: 0 !important;
    line-height: 1 !important;
    height: auto !important;
    width: auto !important;
    min-height: 0 !important;
    min-width: 0 !important;
}
/* ============================================================
   WHOLESALE ADVANTAGE — REFERENCE MATCH
   Corner numbers (01-04) + icon double border + hover gold.
   ============================================================ */

/* Section background — dark premium */
.if-section--wholesale-advantage {
    background: linear-gradient(135deg, #0d0d0f 0%, #1c1a14 52%, #0d0d0f 100%) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Heading + sub color on dark bg */
.if-section--wholesale-advantage .if-section__head h2 {
    color: #ffffff !important;
}

.if-section--wholesale-advantage .if-section__head h2 em,
.if-section--wholesale-advantage .if-eyebrow {
    color: #e9d6a3 !important;
}

.if-section--wholesale-advantage .if-section__sub {
    color: rgba(255, 255, 255, .55) !important;
}

/* Grid — thin gold line gap */
.if-advantage-grid {
    gap: 2px !important;
    background: rgba(200, 162, 74, .15) !important;
    border: 1px solid rgba(200, 162, 74, .15) !important;
}

/* Card — dark with hover transition */
.if-section--wholesale-advantage .if-value-card {
    background: rgba(13, 13, 15, .75) !important;
    padding: 44px 32px 40px !important;
    position: relative !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    transition: background .55s cubic-bezier(.19,1,.22,1) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
}

/* Top gold border — animated on hover */
.if-section--wholesale-advantage .if-value-card::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    transform: scaleX(0) !important;
    transform-origin: left !important;
    transition: transform .6s cubic-bezier(.19,1,.22,1) !important;
}

.if-section--wholesale-advantage .if-value-card:hover {
    background: rgba(200, 162, 74, .06) !important;
}

.if-section--wholesale-advantage .if-value-card:hover::before {
    transform: scaleX(1) !important;
}

/* Corner number — 01, 02, 03, 04 */
.if-section--wholesale-advantage .if-value-card__num {
    position: absolute !important;
    top: 24px !important;
    right: 24px !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 38px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    color: rgba(255, 255, 255, .06) !important;
    transition: color .5s cubic-bezier(.19,1,.22,1) !important;
    pointer-events: none !important;
    user-select: none !important;
}

.if-section--wholesale-advantage .if-value-card:hover .if-value-card__num {
    color: rgba(200, 162, 74, .35) !important;
}

/* Icon box — square, 60x60, double border */
.if-section--wholesale-advantage .if-value-card__icon {
    width: 60px !important;
    height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(200, 162, 74, .4) !important;
    background: rgba(200, 162, 74, .05) !important;
    border-radius: 0 !important;
    position: relative !important;
    margin: 0 0 28px 0 !important;
    transition: all .55s cubic-bezier(.19,1,.22,1) !important;
    color: #c8a24a !important;
    flex-shrink: 0 !important;
}

/* Inner double border */
.if-section--wholesale-advantage .if-value-card__icon::after {
    content: '' !important;
    position: absolute !important;
    inset: 5px !important;
    border: 1px solid rgba(200, 162, 74, .2) !important;
    pointer-events: none !important;
    transition: opacity .55s !important;
}

/* Icon hover — gold gradient fill + rotate */
.if-section--wholesale-advantage .if-value-card:hover .if-value-card__icon {
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    border-color: transparent !important;
    color: #1a1408 !important;
    transform: rotate(-6deg) !important;
}

.if-section--wholesale-advantage .if-value-card:hover .if-value-card__icon::after {
    opacity: 0 !important;
}

/* Icon SVG — fill effect */
.if-section--wholesale-advantage .if-value-card__icon svg {
    width: 26px !important;
    height: 26px !important;
    fill: currentColor !important;
    stroke: currentColor !important;
    transition: fill .5s, stroke .5s !important;
    display: block !important;
    flex-shrink: 0 !important;
}

/* Title */
.if-section--wholesale-advantage .if-value-card__title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    color: #ffffff !important;
    margin: 0 0 12px 0 !important;
    letter-spacing: .01em !important;
}

/* Description */
.if-section--wholesale-advantage .if-value-card__text {
    font-family: 'Jost', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
    color: rgba(255, 255, 255, .55) !important;
    margin: 0 !important;
}

/* Responsive — 2-col tablet, 1-col mobile */
@media (max-width: 1023px) {
    .if-advantage-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 620px) {
    .if-advantage-grid {
        grid-template-columns: 1fr !important;
    }
    .if-section--wholesale-advantage .if-value-card {
        padding: 32px 24px 28px !important;
    }
    .if-section--wholesale-advantage .if-value-card__num {
        font-size: 32px !important;
        top: 18px !important;
        right: 18px !important;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .if-section--wholesale-advantage .if-value-card,
    .if-section--wholesale-advantage .if-value-card::before,
    .if-section--wholesale-advantage .if-value-card__icon,
    .if-section--wholesale-advantage .if-value-card__num {
        transition: none !important;
    }
}
/* ============================================================
   PROCESS SECTION — REFERENCE MATCH
   Dark bg + 4 numbered cards + gold connector lines.
   ============================================================ */

.if-process {
    background: #0d0d0f !important;
    color: #ffffff !important;
    padding-block: clamp(80px, 9vw, 150px) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Radial gold glows */
.if-process::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(200, 162, 74, .14), transparent 42%),
        radial-gradient(circle at 88% 82%, rgba(200, 162, 74, .1), transparent 46%) !important;
    pointer-events: none !important;
}

.if-process .if-section__head h2 {
    color: #ffffff !important;
}

.if-process .if-section__head h2 em,
.if-process .if-eyebrow {
    color: #e9d6a3 !important;
}

.if-process .if-section__sub {
    color: rgba(255, 255, 255, .55) !important;
}

/* Grid */
.if-process__grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
    position: relative !important;
    z-index: 2 !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    padding: 0 clamp(16px, 4vw, 48px) !important;
}

/* Card */
.if-process__card {
    padding: 38px 28px 34px !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    background: rgba(255, 255, 255, .02) !important;
    position: relative !important;
    transition: all .55s cubic-bezier(.19, 1, .22, 1) !important;
    border-radius: 0 !important;
}

.if-process__card:hover {
    background: rgba(200, 162, 74, .08) !important;
    border-color: rgba(200, 162, 74, .42) !important;
    transform: translateY(-8px) !important;
}

/* Gold connector line between cards */
.if-process__card::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    right: -13px !important;
    width: 24px !important;
    height: 1px !important;
    background: rgba(200, 162, 74, .4) !important;
    pointer-events: none !important;
}

.if-process__card:last-child::after {
    display: none !important;
}

/* Number — gradient text */
.if-process__num {
    display: block !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 52px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    margin-bottom: 24px !important;
}

/* Title */
.if-process__title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 21px !important;
    font-weight: 500 !important;
    color: #ffffff !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.25 !important;
}

/* Text */
.if-process__text {
    font-family: 'Jost', sans-serif !important;
    font-size: 13px !important;
    line-height: 1.8 !important;
    color: rgba(255, 255, 255, .5) !important;
    font-weight: 300 !important;
    margin: 0 !important;
}

/* Responsive */
@media (max-width: 1023px) {
    .if-process__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .if-process__card::after {
        display: none !important;
    }
}

@media (max-width: 620px) {
    .if-process__grid {
        grid-template-columns: 1fr !important;
    }
    .if-process__card {
        padding: 28px 22px 24px !important;
    }
    .if-process__num {
        font-size: 42px !important;
        margin-bottom: 16px !important;
    }
}

/* ============================================================
   STATS SECTION — REFERENCE MATCH
   Sand bg + 4 stats with gold dividers + animated counters.
   ============================================================ */

.if-stats {
    background: #f2ede3 !important;
    padding-block: clamp(60px, 7vw, 100px) !important;
    position: relative !important;
    overflow: hidden !important;
}

.if-stats__grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    text-align: center !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    padding: 0 clamp(16px, 4vw, 48px) !important;
}

.if-stats__item {
    padding: 14px 10px !important;
    position: relative !important;
}

/* Gold divider line between stats */
.if-stats__item + .if-stats__item::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 18% !important;
    height: 64% !important;
    width: 1px !important;
    background: linear-gradient(180deg, transparent, rgba(200, 162, 74, .45), transparent) !important;
    pointer-events: none !important;
}

.if-stats__num {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 2px !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(42px, 5.6vw, 72px) !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    color: #0d0d0f !important;
    letter-spacing: -.02em !important;
    margin: 0 !important;
}

.if-stats__count {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 300 !important;
    color: #0d0d0f !important;
}

.if-stats__num i {
    font-style: normal !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: .5em !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    line-height: 1 !important;
}

.if-stats__label {
    margin: 14px 0 0 0 !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: .3em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}

/* Responsive */
@media (max-width: 820px) {
    .if-stats__grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 36px 0 !important;
    }
    .if-stats__item:nth-child(3)::before {
        display: none !important;
    }
}

@media (max-width: 620px) {
    .if-stats__grid {
        gap: 32px 0 !important;
    }
}
/* ============================================================
   TESTIMONIALS — REFERENCE MATCH
   White section + 3 cards + quote mark + stars + author row.
   ============================================================ */

.if-testimonials {
    background: #ffffff !important;
    padding-block: clamp(60px, 7vw, 100px) !important;
}

.if-testimonials .if-section__head {
    margin-bottom: clamp(44px, 5vw, 72px) !important;
}

.if-testimonials .if-section__head h2 {
    color: #0d0d0f !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 300 !important;
    font-size: clamp(30px, 4.4vw, 56px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.01em !important;
}

.if-testimonials .if-section__head h2 em {
    color: #9a7a2e !important;
    font-style: italic !important;
}

.if-testimonials .if-eyebrow {
    color: #9a7a2e !important;
    justify-content: center !important;
}

/* Grid — 3 columns */
.if-testimonials__grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    padding: 0 clamp(16px, 4vw, 48px) !important;
}

/* Card */
.if-testimonial {
    background: #ffffff !important;
    padding: 44px 38px 38px !important;
    border: 1px solid rgba(13, 13, 15, .06) !important;
    position: relative !important;
    transition: transform .6s cubic-bezier(.19,1,.22,1), box-shadow .6s, border-color .6s !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
}

.if-testimonial:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 40px 80px -30px rgba(13, 13, 15, .28) !important;
    border-color: rgba(200, 162, 74, .3) !important;
}

/* Quote mark — large */
.if-testimonial__quote {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 64px !important;
    line-height: .7 !important;
    color: rgba(200, 162, 74, .28) !important;
    display: block !important;
    margin-bottom: 18px !important;
    font-weight: 400 !important;
}

/* Stars */
.if-testimonial__stars {
    display: flex !important;
    gap: 3px !important;
    margin-bottom: 18px !important;
}

.if-testimonial__stars svg {
    width: 13px !important;
    height: 13px !important;
    fill: #c8a24a !important;
    color: #c8a24a !important;
    display: block !important;
    flex-shrink: 0 !important;
}

/* Review text */
.if-testimonial__review {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 16px !important;
    line-height: 1.9 !important;
    color: #4a4a52 !important;
    font-weight: 400 !important;
    font-style: italic !important;
    margin: 0 0 30px 0 !important;
    flex: 1 1 auto !important;
}

/* Author row */
.if-testimonial__author {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding-top: 22px !important;
    border-top: 1px solid rgba(13, 13, 15, .09) !important;
    margin-top: auto !important;
}

/* Avatar — circular gold gradient */
.if-testimonial__avatar {
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    flex: none !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    display: grid !important;
    place-items: center !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 17px !important;
    color: #1a1408 !important;
    font-weight: 600 !important;
    line-height: 1 !important;
}

/* Name + city */
.if-testimonial__who {
    min-width: 0 !important;
}

.if-testimonial__name {
    display: block !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: .03em !important;
    color: #0d0d0f !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

.if-testimonial__city {
    display: block !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    margin-top: 3px !important;
    line-height: 1.3 !important;
}

/* Responsive */
@media (max-width: 1023px) {
    .if-testimonials__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    .if-testimonials__grid {
        grid-template-columns: 1fr !important;
    }
    .if-testimonial {
        padding: 32px 24px 28px !important;
    }
    .if-testimonial__quote {
        font-size: 52px !important;
    }
}
/* ============================================================
   ATELIER GALLERY — REFERENCE MATCH (Masonry Grid)
   6 images with varied grid spans + hover captions.
   ============================================================ */

.if-atelier-gallery {
    background: #faf8f4 !important;
    padding-block: clamp(60px, 7vw, 100px) !important;
}

.if-atelier-gallery .if-section__head--center {
    max-width: 740px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    margin-bottom: clamp(44px, 5vw, 72px) !important;
}

.if-atelier-gallery .if-eyebrow {
    justify-content: center !important;
    color: #9a7a2e !important;
}

.if-atelier-gallery .if-section__head h2 {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 300 !important;
    font-size: clamp(30px, 4.4vw, 56px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.01em !important;
    color: #0d0d0f !important;
    margin: 0 0 18px 0 !important;
}

.if-atelier-gallery .if-section__head h2 em {
    font-style: italic !important;
    color: #9a7a2e !important;
}

.if-atelier-gallery .if-section__sub {
    font-family: 'Jost', sans-serif !important;
    font-size: 15px !important;
    line-height: 1.85 !important;
    color: #7c7c85 !important;
    font-weight: 300 !important;
    max-width: 580px !important;
    margin: 0 auto !important;
}

/* Masonry grid */
.if-masonry {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    grid-auto-rows: 180px !important;
    gap: 16px !important;
    max-width: 1360px !important;
    margin: 0 auto !important;
    padding: 0 clamp(16px, 4vw, 48px) !important;
}

.if-masonry__item {
    position: relative !important;
    overflow: hidden !important;
    background: #0d0d0f !important;
    cursor: pointer !important;
}

/* Grid span variations — reference layout */
.if-masonry__item:nth-child(1) {
    grid-column: span 2 !important;
    grid-row: span 2 !important;
}

.if-masonry__item:nth-child(4) {
    grid-row: span 2 !important;
}

.if-masonry__item:nth-child(6) {
    grid-column: span 2 !important;
}

/* Image */
.if-masonry__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 1.3s cubic-bezier(.19, 1, .22, 1) !important;
}

.if-masonry__item:hover .if-masonry__img {
    transform: scale(1.08) !important;
}

/* Dark overlay on hover */
.if-masonry__item::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, transparent 45%, rgba(8, 8, 10, .85)) !important;
    opacity: 0 !important;
    transition: opacity .55s cubic-bezier(.19, 1, .22, 1) !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.if-masonry__item:hover::after {
    opacity: 1 !important;
}

/* Caption — bottom, hover reveal */
.if-masonry__caption {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 2 !important;
    padding: 22px !important;
    color: #ffffff !important;
    transform: translateY(16px) !important;
    opacity: 0 !important;
    transition: transform .55s cubic-bezier(.19, 1, .22, 1), opacity .55s cubic-bezier(.19, 1, .22, 1) !important;
    pointer-events: none !important;
}

.if-masonry__item:hover .if-masonry__caption {
    transform: translateY(0) !important;
    opacity: 1 !important;
}

.if-masonry__caption small {
    display: block !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 9px !important;
    letter-spacing: .3em !important;
    text-transform: uppercase !important;
    color: #e9d6a3 !important;
    margin-bottom: 6px !important;
    line-height: 1.3 !important;
}

.if-masonry__caption h4 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* Responsive — tablet */
@media (max-width: 1023px) {
    .if-masonry {
        grid-template-columns: repeat(2, 1fr) !important;
        grid-auto-rows: 170px !important;
    }
    .if-masonry__item:nth-child(1) {
        grid-column: span 2 !important;
        grid-row: span 1 !important;
    }
    .if-masonry__item:nth-child(4) {
        grid-row: span 1 !important;
    }
}

/* Responsive — mobile */
@media (max-width: 620px) {
    .if-masonry {
        grid-auto-rows: 200px !important;
    }
    .if-masonry__item:nth-child(6) {
        grid-column: span 1 !important;
    }
    .if-masonry__caption {
        padding: 16px !important;
    }
    .if-masonry__caption h4 {
        font-size: 18px !important;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .if-masonry__img,
    .if-masonry__item::after,
    .if-masonry__caption {
        transition: none !important;
    }
}
/* ============================================================
   SINGLE PRODUCT PAGE — Product Info Table + Price Fix
   ============================================================ */

/* ── 1. Product Information Table — Force 2-column label/value ── */

/* Wrapper — full width, clean */
.single-product .if-product-details,
.single-product .if-product-info,
.single-product .woocommerce-product-details__short-description {
    width: 100% !important;
    max-width: 100% !important;
}

/* Any table in product info — force proper table layout */
.single-product .if-product-details table,
.single-product .if-product-info table,
.single-product table.woocommerce-product-attributes,
.single-product .shop_attributes {
    display: table !important;
    width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    border: 1px solid rgba(13, 13, 15, .08) !important;
    background: #ffffff !important;
}

.single-product .if-product-details table tbody,
.single-product .if-product-info table tbody,
.single-product table.woocommerce-product-attributes tbody,
.single-product .shop_attributes tbody {
    display: table-row-group !important;
}

.single-product .if-product-details table tr,
.single-product .if-product-info table tr,
.single-product table.woocommerce-product-attributes tr,
.single-product .shop_attributes tr {
    display: table-row !important;
    border-bottom: 1px solid rgba(13, 13, 15, .06) !important;
}

.single-product .if-product-details table tr:last-child,
.single-product .if-product-info table tr:last-child,
.single-product table.woocommerce-product-attributes tr:last-child,
.single-product .shop_attributes tr:last-child {
    border-bottom: none !important;
}

/* Every row: exactly 2 cells — label 40%, value 60% */
.single-product .if-product-details table th,
.single-product .if-product-info table th,
.single-product table.woocommerce-product-attributes th,
.single-product .shop_attributes th {
    display: table-cell !important;
    width: 40% !important;
    padding: 14px 20px !important;
    text-align: left !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: #9a7a2e !important;
    background: #faf8f4 !important;
    vertical-align: middle !important;
    border-right: 1px solid rgba(13, 13, 15, .06) !important;
    border-bottom: 1px solid rgba(13, 13, 15, .06) !important;
}

.single-product .if-product-details table td,
.single-product .if-product-info table td,
.single-product table.woocommerce-product-attributes td,
.single-product .shop_attributes td {
    display: table-cell !important;
    width: 60% !important;
    padding: 14px 20px !important;
    text-align: left !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    color: #0d0d0f !important;
    background: #ffffff !important;
    vertical-align: middle !important;
    border-bottom: 1px solid rgba(13, 13, 15, .06) !important;
}

/* ── 2. Price — bigger, gold, prominent ── */

.single-product .summary .price,
.single-product .entry-summary .price {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(28px, 3.4vw, 38px) !important;
    font-weight: 500 !important;
    color: #9a7a2e !important;
    line-height: 1.1 !important;
    margin: 8px 0 18px 0 !important;
    font-variant-numeric: tabular-nums !important;
}

.single-product .summary .price .woocommerce-Price-amount,
.single-product .summary .price ins,
.single-product .summary .price del {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 500 !important;
}

.single-product .summary .price .woocommerce-Price-currencySymbol {
    font-size: .7em !important;
    font-weight: 500 !important;
    margin-right: 4px !important;
}

.single-product .summary .price small,
.single-product .summary .price .if-product-card__unit {
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    font-weight: 400 !important;
}

/* "/ Set" text — small, subtle */
.single-product .summary .price::after {
    content: "/ Set" !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    font-weight: 400 !important;
    margin-left: 4px !important;
}

/* ── 3. Product Title — Cormorant Garamond ── */

.single-product .product_title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(26px, 3.2vw, 40px) !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    letter-spacing: -.01em !important;
    color: #0d0d0f !important;
    margin: 0 0 12px 0 !important;
}

/* ── 4. Reviews section — clean styling ── */

.single-product .woocommerce-Reviews,
.single-product .if-reviews-bottom {
    padding: 40px 0 !important;
}

.single-product .woocommerce-Reviews h2,
.single-product .woocommerce-Reviews-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 28px !important;
    font-weight: 400 !important;
    color: #0d0d0f !important;
    margin: 0 0 20px 0 !important;
}

.single-product .woocommerce-Reviews .comment-form label {
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: #0d0d0f !important;
    margin-bottom: 8px !important;
    display: block !important;
}

.single-product .woocommerce-Reviews .comment-form input[type="text"],
.single-product .woocommerce-Reviews .comment-form input[type="email"],
.single-product .woocommerce-Reviews .comment-form textarea {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 1px solid rgba(13, 13, 15, .12) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 14px !important;
    color: #0d0d0f !important;
    outline: none !important;
}

.single-product .woocommerce-Reviews .comment-form textarea {
    min-height: 140px !important;
    resize: vertical !important;
}

.single-product .woocommerce-Reviews .comment-form input[type="submit"],
.single-product .woocommerce-Reviews #submit {
    padding: 16px 32px !important;
    background: #0d0d0f !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: background .3s !important;
}

.single-product .woocommerce-Reviews .comment-form input[type="submit"]:hover,
.single-product .woocommerce-Reviews #submit:hover {
    background: #9a7a2e !important;
}

/* Star rating — gold */
.single-product .comment-form-rating .stars a,
.single-product .comment-form-rating .stars span {
    color: #c8a24a !important;
    font-size: 24px !important;
}

/* ── 5. Mobile responsive — keep 2 columns for info table ── */

@media (max-width: 767px) {
    .single-product .if-product-details table th,
    .single-product .if-product-info table th,
    .single-product table.woocommerce-product-attributes th,
    .single-product .shop_attributes th {
        width: 45% !important;
        padding: 12px 14px !important;
        font-size: 10px !important;
    }
    .single-product .if-product-details table td,
    .single-product .if-product-info table td,
    .single-product table.woocommerce-product-attributes td,
    .single-product .shop_attributes td {
        width: 55% !important;
        padding: 12px 14px !important;
        font-size: 12.5px !important;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .single-product .woocommerce-Reviews .comment-form input[type="submit"] {
        transition: none !important;
    }
}
/* ============================================================
   FROZEN HEADER BAR — All Pages EXCEPT Homepage
   Homepage: transparent float over hero (already working)
   All other pages: fixed white glass bar at top
   ============================================================ */

/* ── 1. Force header visible + fixed on non-home pages ── */
body:not(.home):not(.if-front-page) .if-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 80px !important;
    min-height: 80px !important;
    max-height: 80px !important;
    background: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
    border-bottom: 1px solid rgba(200, 162, 74, 0.16) !important;
    box-shadow: 0 12px 40px -18px rgba(13, 13, 15, 0.15) !important;
    z-index: 9990 !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    transform: none !important;
}

/* Admin bar offset (logged-in) */
body.admin-bar:not(.home):not(.if-front-page) .if-header {
    top: 32px !important;
}

@media (max-width: 782px) {
    body.admin-bar:not(.home):not(.if-front-page) .if-header {
        top: 46px !important;
    }
}

/* ── 2. Inner wrapper — flex row, centered ── */
body:not(.home):not(.if-front-page) .if-header__inner {
    height: 80px !important;
    max-height: 80px !important;
    min-height: 80px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 0 40px !important;
}

/* ── 3. Nav + icons + burger — dark text on white bar ── */
body:not(.home):not(.if-front-page) .if-header .if-nav__link {
    color: #0d0d0f !important;
}
body:not(.home):not(.if-front-page) .if-header .if-nav__link::after {
    background: #c8a24a !important;
}
body:not(.home):not(.if-front-page) .if-header .if-icon-btn {
    color: #0d0d0f !important;
}
body:not(.home):not(.if-front-page) .if-header .if-icon-btn svg {
    stroke: #0d0d0f !important;
}
body:not(.home):not(.if-front-page) .if-header .if-burger {
    color: #0d0d0f !important;
}
body:not(.home):not(.if-front-page) .if-header .if-burger span {
    background: #0d0d0f !important;
}

/* ── 4. Logo — balanced size on frozen bar ── */
body:not(.home):not(.if-front-page) .if-header .if-logo {
    height: 50px !important;
    max-height: 50px !important;
    display: flex !important;
    align-items: center !important;
    visibility: visible !important;
}
body:not(.home):not(.if-front-page) .if-header .if-logo img {
    height: 50px !important;
    max-height: 50px !important;
    width: auto !important;
    max-width: 180px !important;
    object-fit: contain !important;
}

/* ── 5. Push content down so it doesn't hide under fixed header ── */
body:not(.home):not(.if-front-page) .if-main {
    padding-top: 80px !important;
}
body.admin-bar:not(.home):not(.if-front-page) .if-main {
    padding-top: 112px !important;
}
@media (max-width: 782px) {
    body.admin-bar:not(.home):not(.if-front-page) .if-main {
        padding-top: 126px !important;
    }
}

/* ── 6. Mobile adjustments ── */
@media (max-width: 767px) {
    body:not(.home):not(.if-front-page) .if-header {
        height: 65px !important;
        min-height: 65px !important;
        max-height: 65px !important;
    }
    body:not(.home):not(.if-front-page) .if-header__inner {
        height: 65px !important;
        max-height: 65px !important;
        min-height: 65px !important;
        padding: 0 16px !important;
    }
    body:not(.home):not(.if-front-page) .if-header .if-logo {
        height: 40px !important;
        max-height: 40px !important;
    }
    body:not(.home):not(.if-front-page) .if-header .if-logo img {
        height: 40px !important;
        max-height: 40px !important;
        max-width: 140px !important;
    }
    body:not(.home):not(.if-front-page) .if-main {
        padding-top: 65px !important;
    }
    body.admin-bar:not(.home):not(.if-front-page) .if-main {
        padding-top: 111px !important;
    }
}
/* ============================================================
   FROZEN HEADER — Center Main Menu (3-Column Grid)
   Logo left | Nav center | Tools right — guaranteed centering.
   ============================================================ */

@media (min-width: 1024px) {

    /* Parent — 3-column grid */
    body:not(.home):not(.if-front-page) .if-header__inner {
        display: grid !important;
        grid-template-columns: 1fr auto 1fr !important;
        align-items: center !important;
        gap: 24px !important;
        height: 80px !important;
        max-height: 80px !important;
        min-height: 80px !important;
        padding: 0 40px !important;
        width: 100% !important;
    }

    /* Logo — column 1, left aligned */
    body:not(.home):not(.if-front-page) .if-logo {
        grid-column: 1 !important;
        justify-self: start !important;
        align-self: center !important;
    }

    /* Nav — column 2, TRUE center (kills auto margins) */
    body:not(.home):not(.if-front-page) .if-nav {
        grid-column: 2 !important;
        justify-self: center !important;
        align-self: center !important;
        margin: 0 !important;
        margin-inline: 0 !important;
        padding: 0 !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: auto !important;
        height: auto !important;
    }

    /* Nav list — flex row */
    body:not(.home):not(.if-front-page) .if-nav__list {
        display: flex !important;
        align-items: center !important;
        gap: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Tools — column 3, right aligned */
    body:not(.home):not(.if-front-page) .if-tools {
        grid-column: 3 !important;
        justify-self: end !important;
        align-self: center !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    /* Hide burger on desktop */
    body:not(.home):not(.if-front-page) .if-burger {
        display: none !important;
    }
}
/* ============================================================
   CART PAGE — REFERENCE MATCH (cart.html)
   Desktop: 2-col layout, card-style rows
   Mobile: 80px image + info grid, price bottom row
   ============================================================ */

/* ── 1. Layout — 2 columns (items left, totals right) ── */
@media (min-width: 1024px) {
    .woocommerce-cart .woocommerce {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 380px !important;
        gap: 40px !important;
        align-items: flex-start !important;
    }
    .woocommerce-cart .cart-collaterals {
        position: sticky !important;
        top: 100px !important;
        width: 100% !important;
    }
}

/* ── 2. Cart Form — card container ── */
.woocommerce-cart form.woocommerce-cart-form {
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid rgba(13, 13, 15, .09) !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* ── 3. Table reset ── */
.woocommerce-cart table.shop_table {
    border: none !important;
    margin: 0 !important;
    table-layout: auto !important;
}
.woocommerce-cart table.shop_table thead {
    display: none !important;
}

/* ── 4. Cart item row — grid layout ── */
.woocommerce-cart table.shop_table tbody tr.cart_item {
    display: grid !important;
    grid-template-columns: 110px minmax(0, 1fr) auto !important;
    gap: 20px !important;
    padding: 24px !important;
    border-bottom: 1px solid rgba(13, 13, 15, .09) !important;
    align-items: center !important;
    background: #ffffff !important;
}
.woocommerce-cart table.shop_table tbody tr.cart_item:last-child {
    border-bottom: none !important;
}
.woocommerce-cart table.shop_table tbody tr.cart_item td {
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
}

/* ── 5. Image ── */
.woocommerce-cart table.shop_table td.product-thumbnail {
    grid-column: 1 !important;
    width: 110px !important;
}
.woocommerce-cart table.shop_table td.product-thumbnail a {
    display: block !important;
    width: 110px !important;
    height: 130px !important;
    overflow: hidden !important;
    background: #f2ede3 !important;
}
.woocommerce-cart table.shop_table td.product-thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* ── 6. Name + Set Info ── */
.woocommerce-cart table.shop_table td.product-name {
    grid-column: 2 !important;
    text-align: left !important;
}
.woocommerce-cart table.shop_table td.product-name a {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    color: #0d0d0f !important;
    display: block !important;
    margin-bottom: 8px !important;
    text-decoration: none !important;
}
.woocommerce-cart table.shop_table td.product-name .variation {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 20px !important;
    font-size: 12px !important;
    color: #7c7c85 !important;
    font-family: 'Jost', sans-serif !important;
    margin: 0 !important;
}
.woocommerce-cart table.shop_table td.product-name .variation dt {
    font-size: 9px !important;
    letter-spacing: .24em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: #9a7a2e !important;
}
.woocommerce-cart table.shop_table td.product-name .variation dd {
    margin: 0 !important;
    font-weight: 500 !important;
    color: #0d0d0f !important;
}

/* ── 7. Quantity — below name ── */
.woocommerce-cart table.shop_table td.product-quantity {
    grid-column: 2 !important;
    grid-row: 2 !important;
    margin-top: 12px !important;
    justify-self: start !important;
}
.woocommerce-cart table.shop_table td.product-quantity .quantity {
    display: inline-flex !important;
    align-items: center !important;
    border: 1px solid rgba(13, 13, 15, .12) !important;
    background: #ffffff !important;
    height: 42px !important;
}
.woocommerce-cart table.shop_table td.product-quantity input.qty {
    width: 50px !important;
    height: 40px !important;
    border: none !important;
    text-align: center !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    background: transparent !important;
    outline: none !important;
    padding: 0 !important;
}

/* ── 8. Price — hide unit price, keep subtotal on right ── */
.woocommerce-cart table.shop_table td.product-price {
    display: none !important;
}
.woocommerce-cart table.shop_table td.product-subtotal {
    grid-column: 3 !important;
    grid-row: 1 / span 2 !important;
    text-align: right !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    color: #0d0d0f !important;
    font-variant-numeric: tabular-nums !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

/* ── 9. Remove — as text link below price ── */
.woocommerce-cart table.shop_table td.product-remove {
    grid-column: 3 !important;
    grid-row: 3 !important;
    text-align: right !important;
    padding-top: 8px !important;
}
.woocommerce-cart table.shop_table td.product-remove a.remove {
    display: inline-block !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 10.5px !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    color: #7c7c85 !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid transparent !important;
    text-decoration: none !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.2 !important;
    transition: all .3s !important;
}
.woocommerce-cart table.shop_table td.product-remove a.remove:hover {
    color: #c0392b !important;
    border-bottom-color: #c0392b !important;
}

/* ── 10. Coupon row ── */
.woocommerce-cart table.shop_table tbody tr td.actions {
    padding: 24px !important;
    border-top: 1px solid rgba(13, 13, 15, .09) !important;
    background: #faf8f4 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
}
.woocommerce-cart .coupon {
    display: flex !important;
    gap: 8px !important;
    flex: 1 1 320px !important;
    margin: 0 !important;
    float: none !important;
}
.woocommerce-cart .coupon input[type="text"] {
    flex: 1 !important;
    min-width: 0 !important;
    height: 44px !important;
    padding: 0 16px !important;
    border: 1px solid rgba(13, 13, 15, .12) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 13px !important;
    outline: none !important;
}
.woocommerce-cart .coupon button {
    padding: 0 28px !important;
    height: 44px !important;
    background: #0d0d0f !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: background .3s !important;
    white-space: nowrap !important;
}
.woocommerce-cart .coupon button:hover {
    background: #9a7a2e !important;
}
.woocommerce-cart button[name="update_cart"] {
    display: none !important;
}

/* ── 11. Cart Totals sidebar ── */
.woocommerce-cart .cart-collaterals {
    background: #ffffff !important;
    border: 1px solid rgba(13, 13, 15, .09) !important;
    padding: 32px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}
.woocommerce-cart .cart_totals h2 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    color: #0d0d0f !important;
    margin: 0 0 24px 0 !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid rgba(13, 13, 15, .09) !important;
    text-align: left !important;
}
.woocommerce-cart .cart_totals table {
    border: none !important;
    width: 100% !important;
}
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
    border: none !important;
    border-bottom: 1px solid rgba(13, 13, 15, .06) !important;
    padding: 12px 0 !important;
    background: transparent !important;
    vertical-align: top !important;
}
.woocommerce-cart .cart_totals table th {
    font-family: 'Jost', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
    color: #7c7c85 !important;
    text-align: left !important;
    padding-right: 12px !important;
}
.woocommerce-cart .cart_totals table td {
    font-family: 'Jost', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #0d0d0f !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
}
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
    font-size: 18px !important;
    font-weight: 600 !important;
    padding-top: 20px !important;
    border-bottom: none !important;
    color: #0d0d0f !important;
}
.woocommerce-cart .cart_totals .order-total td {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 22px !important;
    color: #9a7a2e !important;
}

/* ── 12. Shipping methods ── */
.woocommerce-cart .cart_totals .woocommerce-shipping-methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 8px 0 0 0 !important;
}
.woocommerce-cart .cart_totals .woocommerce-shipping-methods li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    margin-bottom: 8px !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 12.5px !important;
    color: #0d0d0f !important;
    line-height: 1.4 !important;
}
.woocommerce-cart .cart_totals .woocommerce-shipping-methods input[type="radio"] {
    margin-top: 3px !important;
    accent-color: #c8a24a !important;
    flex-shrink: 0 !important;
}
.woocommerce-cart .cart_totals .woocommerce-shipping-destination {
    font-family: 'Jost', sans-serif !important;
    font-size: 12px !important;
    color: #7c7c85 !important;
    line-height: 1.5 !important;
    margin: 8px 0 !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-button {
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: .15em !important;
    text-transform: uppercase !important;
    color: #9a7a2e !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    display: inline-block !important;
    margin-top: 6px !important;
}

/* ── 13. Proceed to Checkout button ── */
.woocommerce-cart .wc-proceed-to-checkout {
    padding: 0 !important;
    margin: 24px 0 0 0 !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: block !important;
    width: 100% !important;
    padding: 17px 20px !important;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%) !important;
    background-size: 220% 100% !important;
    background-position: 0 0 !important;
    color: #1a1408 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: .2em !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    border: none !important;
    border-radius: 0 !important;
    transition: background-position .5s !important;
    box-shadow: 0 18px 40px -20px rgba(200, 162, 74, .9) !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background-position: 100% 0 !important;
    transform: translateY(-2px) !important;
}

/* ── 14. Secure checkout note ── */
.woocommerce-cart .cart-collaterals::after {
    content: '🔒 Secure checkout. Your information is protected.';
    display: block !important;
    margin-top: 16px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(13, 13, 15, .06) !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 11px !important;
    color: #7c7c85 !important;
    text-align: center !important;
    letter-spacing: .02em !important;
}

/* ── 15. Mobile responsive ── */
@media (max-width: 900px) {
    .woocommerce-cart .woocommerce {
        display: block !important;
    }
    .woocommerce-cart .cart-collaterals {
        position: static !important;
        padding: 24px 20px !important;
        margin-top: 24px !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item {
        grid-template-columns: 80px minmax(0, 1fr) !important;
        grid-template-rows: auto auto auto !important;
        position: relative !important;
        padding: 18px !important;
        gap: 12px 16px !important;
    }
    .woocommerce-cart table.shop_table td.product-thumbnail {
        grid-column: 1 !important;
        grid-row: 1 / span 2 !important;
        width: 80px !important;
    }
    .woocommerce-cart table.shop_table td.product-thumbnail a {
        width: 80px !important;
        height: 100px !important;
    }
    .woocommerce-cart table.shop_table td.product-name {
        grid-column: 2 !important;
        grid-row: 1 !important;
        padding-right: 40px !important;
    }
    .woocommerce-cart table.shop_table td.product-name a {
        font-size: 16px !important;
        margin-bottom: 4px !important;
    }
    .woocommerce-cart table.shop_table td.product-quantity {
        grid-column: 2 !important;
        grid-row: 2 !important;
        margin-top: 6px !important;
    }
    .woocommerce-cart table.shop_table td.product-subtotal {
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        border-top: 1px solid rgba(13, 13, 15, .09) !important;
        padding-top: 12px !important;
        margin-top: 4px !important;
        font-size: 18px !important;
        width: 100% !important;
    }
    .woocommerce-cart table.shop_table td.product-subtotal::before {
        content: 'Total: ' !important;
        font-family: 'Jost', sans-serif !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        color: #7c7c85 !important;
        letter-spacing: .05em !important;
    }
    .woocommerce-cart table.shop_table td.product-remove {
        position: absolute !important;
        top: 15px !important;
        right: 15px !important;
        grid-column: auto !important;
        grid-row: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .woocommerce-cart table.shop_table td.product-remove a.remove {
        width: 32px !important;
        height: 32px !important;
        background: #faf8f4 !important;
        border-radius: 50% !important;
        display: grid !important;
        place-items: center !important;
        color: #7c7c85 !important;
        font-size: 16px !important;
        border: none !important;
        text-indent: -9999px !important;
        overflow: hidden !important;
        position: relative !important;
    }
    .woocommerce-cart table.shop_table td.product-remove a.remove::after {
        content: '×' !important;
        position: absolute !important;
        inset: 0 !important;
        display: grid !important;
        place-items: center !important;
        text-indent: 0 !important;
        font-size: 20px !important;
        font-weight: 400 !important;
        color: #7c7c85 !important;
    }
    .woocommerce-cart table.shop_table tbody tr td.actions {
        flex-direction: column !important;
        padding: 18px !important;
    }
    .woocommerce-cart .coupon {
        width: 100% !important;
        flex-direction: column !important;
        flex: none !important;
    }
    .woocommerce-cart .coupon input,
    .woocommerce-cart .coupon button {
        width: 100% !important;
        height: 44px !important;
    }
}

/* ── 16. Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
    .woocommerce-cart .coupon button,
    .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-cart table.shop_table td.product-remove a.remove {
        transition: none !important;
    }
}
/* ============================================================
   ULTIMATE FIX: CART PAGE LAYOUT + MOBILE HEADER LOGO ALIGNMENT
   ============================================================ */

/* ── 1. MOBILE HEADER LOGO — PERFECT CENTER ── */
@media (max-width: 767px) {
    body .if-header__inner {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        height: 65px !important;
        max-height: 65px !important;
        padding: 0 15px !important;
    }
    body .if-header .if-logo {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        margin: 0 !important;
        height: 40px !important;
        max-height: 40px !important;
        z-index: 10 !important;
    }
    body .if-header .if-logo img {
        height: 40px !important;
        max-height: 40px !important;
        width: auto !important;
        max-width: 150px !important;
    }
}

/* ── 2. CART PAGE LAYOUT — FLEXBOX (No Grid Collapse) ── */
/* Remove the grid layout that caused the cart to break */
.woocommerce-cart .woocommerce {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important;
    align-items: flex-start !important;
}

/* Desktop: Items left, Totals right */
@media (min-width: 768px) {
    .woocommerce-cart .woocommerce-cart-form {
        flex: 1 1 calc(100% - 440px) !important;
        max-width: calc(100% - 440px) !important;
    }
    .woocommerce-cart .cart-collaterals {
        flex: 0 0 400px !important;
        width: 400px !important;
        position: sticky !important;
        top: 100px !important;
    }
    /* Fix the "How Wholesale Works" section overlapping */
    .woocommerce-cart .if-cart-lower {
        flex: 1 1 100% !important;
        width: 100% !important;
        margin-top: 40px !important;
    }
}

/* ── 3. CART ITEMS — FLEX ROWS (Fixes title wrapping & layout) ── */
.woocommerce-cart table.shop_table {
    border: none !important;
    border-collapse: collapse !important;
    width: 100% !important;
}
.woocommerce-cart table.shop_table thead {
    display: none !important;
}
.woocommerce-cart table.shop_table tbody tr.cart_item {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding: 20px !important;
    border-bottom: 1px solid #eee !important;
    gap: 15px !important;
    background: #fff !important;
}
.woocommerce-cart table.shop_table tbody tr.cart_item td {
    border: none !important;
    padding: 0 !important;
    display: block !important;
}

/* Desktop Row Alignment */
@media (min-width: 768px) {
    .woocommerce-cart table.shop_table tbody tr.cart_item {
        flex-wrap: nowrap !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-thumbnail { width: 100px !important; flex-shrink: 0 !important; }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-name { flex: 1 1 auto !important; padding-right: 20px !important; }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-price { width: 100px !important; text-align: right !important; flex-shrink: 0 !important; }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-quantity { width: 100px !important; flex-shrink: 0 !important; }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-subtotal { width: 100px !important; text-align: right !important; font-weight: 600 !important; flex-shrink: 0 !important; }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-remove { width: 30px !important; text-align: right !important; flex-shrink: 0 !important; }
}

/* Mobile Row Alignment */
@media (max-width: 767px) {
    .woocommerce-cart .woocommerce-cart-form { width: 100% !important; float: none !important; }
    .woocommerce-cart .cart-collaterals { width: 100% !important; float: none !important; margin-top: 30px !important; padding: 24px !important; }
    .woocommerce-cart .if-cart-lower { width: 100% !important; float: none !important; }

    .woocommerce-cart table.shop_table tbody tr.cart_item {
        position: relative !important;
        align-items: flex-start !important;
        padding: 15px !important;
        border: 1px solid #eee !important;
        border-radius: 8px !important;
        margin-bottom: 15px !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-thumbnail {
        width: 80px !important;
        flex-shrink: 0 !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-thumbnail img {
        width: 80px !important;
        height: 105px !important;
        object-fit: cover !important;
        border-radius: 4px !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-name {
        width: calc(100% - 80px) !important;
        padding-left: 15px !important;
        padding-right: 30px !important;
        flex: 1 1 auto !important;
        word-break: break-word !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-name a {
        font-size: 15px !important;
        line-height: 1.3 !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-price {
        display: none !important; /* Hide unit price on mobile */
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-quantity {
        width: 100% !important;
        margin-top: 10px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-quantity::before {
        content: 'Quantity:' !important;
        font-size: 12px !important;
        color: #777 !important;
        font-weight: 500 !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-subtotal {
        width: 100% !important;
        margin-top: 10px !important;
        padding-top: 12px !important;
        border-top: 1px solid #eee !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        font-size: 16px !important;
        font-weight: 600 !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-subtotal::before {
        content: 'Total:' !important;
        font-size: 12px !important;
        color: #777 !important;
        font-weight: normal !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-remove {
        position: absolute !important;
        top: 12px !important;
        right: 12px !important;
        width: 30px !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-remove a.remove {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        height: 30px !important;
        background: #f5f5f5 !important;
        border-radius: 50% !important;
        color: #333 !important;
        font-size: 0 !important;
        text-decoration: none !important;
    }
    .woocommerce-cart table.shop_table tbody tr.cart_item td.product-remove a.remove::before {
        content: '×' !important;
        font-size: 20px !important;
    }
}

/* ── 4. Remove the duplicated Secure Checkout text ── */
.woocommerce-cart .cart-collaterals::after {
    content: none !important;
}
/* Desktop: Cart totals ko static karo (sticky hatao) */
@media (min-width: 901px) {
    .woocommerce-cart .cart-collaterals,
    .woocommerce-cart .cart-collaterals .cart_totals {
        position: static !important;
        top: auto !important;
    }
}
/* ═══════════════════════════════════════════════════════════════════════
   MASTER TASK — THEME-MATCH FIXES (reference theme.if = source of truth)
   Append-only block. Targets stale selectors / stale values that earlier
   twin blocks missed. Keep above rules intact.
   ═══════════════════════════════════════════════════════════════════════ */

/* 1. Transparent header — reference .head-nav a / .head-icon =
      rgba(255,255,255,.86) (was .92 from earlier twin) */
.if-header.is-transparent:not(.is-scrolled) .if-nav__link,
.if-header.is-transparent:not(.is-scrolled) .if-icon-btn {
    color: rgba(255, 255, 255, .86) !important;
}

/* 2. Cart rows — reference cart.html .cart-row =
      padding 24px + bottom line rgba(13,13,15,.09) (was 20px / #eee) */
.woocommerce-cart table.shop_table tbody tr.cart_item {
    padding: 24px !important;
    border-bottom: 1px solid rgba(13, 13, 15, .09) !important;
}

/* 3. Product tabs — reference product.html .tab-btn / .tab-panel:
      11px, ls .22em (2.42px), padding 15px 22px, weight 500,
      uppercase, muted inactive / gold-dp active, content-width
      left-aligned buttons, 2px gap, 32px nav→panel gap, flush
      transparent panel (no box). Beats woocommerce.css
      .single-product[.if-product-left-col] .woocommerce-tabs twins. */
.single-product .woocommerce-tabs ul.tabs,
.single-product .if-product-left-col .woocommerce-tabs ul.tabs {
    gap: 2px !important;
    margin: 0 0 32px 0 !important;
    border-bottom: 1px solid rgba(13, 13, 15, .09) !important;
}

.single-product .woocommerce-tabs ul.tabs li,
.single-product .if-product-left-col .woocommerce-tabs ul.tabs li {
    flex: 0 0 auto !important;
    width: auto !important;
    text-align: left !important;
}

.single-product .woocommerce-tabs ul.tabs li a,
.single-product .if-product-left-col .woocommerce-tabs ul.tabs li a,
.single-product .woocommerce-tabs ul.tabs li.active a,
.single-product .if-product-left-col .woocommerce-tabs ul.tabs li.active a {
    display: block !important;
    width: auto !important;
    padding: 15px 22px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 2.42px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-align: left !important;
    background: transparent !important;
    border-radius: 0 !important;
    color: #7c7c85 !important;
}

.single-product .woocommerce-tabs ul.tabs li.active a,
.single-product .if-product-left-col .woocommerce-tabs ul.tabs li.active a {
    color: #9a7a2e !important;
}

.single-product .woocommerce-tabs .panel,
.single-product .if-product-left-col .woocommerce-tabs .panel {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
}

/* 4. Shop card price — reference .prod-price b = 17px at EVERY width.
      Kills the stale 14px ≤767px restatement (home card unaffected). */
.if-shop-main .if-product-card__price {
    font-size: 17px !important;
}

/* 5. Mobile card CTA — MOBILE VISUAL COMPACTNESS values on the REAL
      class (old rules targeted dead .if-product-card__actions).
      Desktop twin-block above (padding 15px 20px) untouched. */
@media (max-width: 767px) {
    .if-product-card__actions-mobile .if-btn {
        padding: 10px 0 !important;
        font-size: 12px !important;
    }
}

/* ═════════════════════════════════════════════════════════════════════
   PHASE 2 — REMAINING PAGES: DARK page-heroes + PER-PAGE REFERENCE TWINS
   checkout · thankyou · account · track · search · about · contact ·
   faq · wholesale · legal(/terms-conditions) · 404

   Reference = theme.if/ (theme.css .page-hero + per-page <style> blocks).
   Markup reality preserved — no .php / template / DB edits:
     - heroes are .if-page-header (WC pages + terms) or the FIRST section
       of article.if-page-{about,contact,faq,wholesale,track},
       section.if-section--sm (search), section.if-section--lg (404);
     - header.php only emits .is-transparent on front page → the home
       transparent/frozen header machine (premium 6239-6300) is re-applied
       here through body-scoped duplicates + position:fixed while scrolled
       (prevents the sticky/absolute layout jump);
     - premium 8492 pushes non-home .if-main down 80px → zeroed for hero
       pages so the dark hero starts at y0 exactly like the reference;
     - checkout stepper has no DOM → documented, not faked;
     - search page form has no submit control → ref gold bar twin stops at
       the white bar + input (Enter submits; no fake button rendered).
   ═════════════════════════════════════════════════════════════════════ */

:root {
    --if-grad-gold: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%);
    --if-hero-bg-image:
        linear-gradient(rgba(200, 162, 74, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(200, 162, 74, .05) 1px, transparent 1px),
        radial-gradient(circle at 15% 30%, rgba(200, 162, 74, .18), transparent 42%),
        radial-gradient(circle at 85% 70%, rgba(200, 162, 74, .12), transparent 45%),
        linear-gradient(150deg, #0d0d0f 0%, #1c1a14 55%, #0d0d0f 100%);
    --if-hero-bg-size: 70px 70px, 70px 70px, auto, auto, auto;
}

/* ── 1. HEADER — transparent over dark heroes (home machine, body-scoped) ── */
body.woocommerce-cart .if-header:not(.is-scrolled),
body.woocommerce-checkout .if-header:not(.is-scrolled),
body.woocommerce-account .if-header:not(.is-scrolled),
body.page-id-134 .if-header:not(.is-scrolled),
body.page-id-82 .if-header:not(.is-scrolled),
body.page-id-83 .if-header:not(.is-scrolled),
body.page-id-84 .if-header:not(.is-scrolled),
body.page-id-85 .if-header:not(.is-scrolled),
body.page-id-115 .if-header:not(.is-scrolled),
body.search .if-header:not(.is-scrolled),
body.error404 .if-header:not(.is-scrolled) {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
}

body.woocommerce-cart .if-header:not(.is-scrolled) .if-nav__link,
body.woocommerce-checkout .if-header:not(.is-scrolled) .if-nav__link,
body.woocommerce-account .if-header:not(.is-scrolled) .if-nav__link,
body.page-id-134 .if-header:not(.is-scrolled) .if-nav__link,
body.page-id-82 .if-header:not(.is-scrolled) .if-nav__link,
body.page-id-83 .if-header:not(.is-scrolled) .if-nav__link,
body.page-id-84 .if-header:not(.is-scrolled) .if-nav__link,
body.page-id-85 .if-header:not(.is-scrolled) .if-nav__link,
body.page-id-115 .if-header:not(.is-scrolled) .if-nav__link,
body.search .if-header:not(.is-scrolled) .if-nav__link,
body.error404 .if-header:not(.is-scrolled) .if-nav__link,
body.woocommerce-cart .if-header:not(.is-scrolled) .if-icon-btn,
body.woocommerce-checkout .if-header:not(.is-scrolled) .if-icon-btn,
body.woocommerce-account .if-header:not(.is-scrolled) .if-icon-btn,
body.page-id-134 .if-header:not(.is-scrolled) .if-icon-btn,
body.page-id-82 .if-header:not(.is-scrolled) .if-icon-btn,
body.page-id-83 .if-header:not(.is-scrolled) .if-icon-btn,
body.page-id-84 .if-header:not(.is-scrolled) .if-icon-btn,
body.page-id-85 .if-header:not(.is-scrolled) .if-icon-btn,
body.page-id-115 .if-header:not(.is-scrolled) .if-icon-btn,
body.search .if-header:not(.is-scrolled) .if-icon-btn,
body.error404 .if-header:not(.is-scrolled) .if-icon-btn,
body.woocommerce-cart .if-header:not(.is-scrolled) .if-burger,
body.woocommerce-checkout .if-header:not(.is-scrolled) .if-burger,
body.woocommerce-account .if-header:not(.is-scrolled) .if-burger,
body.page-id-134 .if-header:not(.is-scrolled) .if-burger,
body.page-id-82 .if-header:not(.is-scrolled) .if-burger,
body.page-id-83 .if-header:not(.is-scrolled) .if-burger,
body.page-id-84 .if-header:not(.is-scrolled) .if-burger,
body.page-id-85 .if-header:not(.is-scrolled) .if-burger,
body.page-id-115 .if-header:not(.is-scrolled) .if-burger,
body.search .if-header:not(.is-scrolled) .if-burger,
body.error404 .if-header:not(.is-scrolled) .if-burger {
    color: rgba(255, 255, 255, .92) !important;
}

body.woocommerce-cart .if-header:not(.is-scrolled) .if-icon-btn svg,
body.woocommerce-checkout .if-header:not(.is-scrolled) .if-icon-btn svg,
body.woocommerce-account .if-header:not(.is-scrolled) .if-icon-btn svg,
body.page-id-134 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.page-id-82 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.page-id-83 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.page-id-84 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.page-id-85 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.page-id-115 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.search .if-header:not(.is-scrolled) .if-icon-btn svg,
body.error404 .if-header:not(.is-scrolled) .if-icon-btn svg,
body.woocommerce-cart .if-header:not(.is-scrolled) .if-burger svg,
body.woocommerce-checkout .if-header:not(.is-scrolled) .if-burger svg,
body.woocommerce-account .if-header:not(.is-scrolled) .if-burger svg,
body.page-id-134 .if-header:not(.is-scrolled) .if-burger svg,
body.page-id-82 .if-header:not(.is-scrolled) .if-burger svg,
body.page-id-83 .if-header:not(.is-scrolled) .if-burger svg,
body.page-id-84 .if-header:not(.is-scrolled) .if-burger svg,
body.page-id-85 .if-header:not(.is-scrolled) .if-burger svg,
body.page-id-115 .if-header:not(.is-scrolled) .if-burger svg,
body.search .if-header:not(.is-scrolled) .if-burger svg,
body.error404 .if-header:not(.is-scrolled) .if-burger svg {
    stroke: rgba(255, 255, 255, .92) !important;
}

/* Scrolled — fixed white glass, dark text (mirror of 6275-6299) */
body.woocommerce-cart .if-header.is-scrolled,
body.woocommerce-checkout .if-header.is-scrolled,
body.woocommerce-account .if-header.is-scrolled,
body.page-id-134 .if-header.is-scrolled,
body.page-id-82 .if-header.is-scrolled,
body.page-id-83 .if-header.is-scrolled,
body.page-id-84 .if-header.is-scrolled,
body.page-id-85 .if-header.is-scrolled,
body.page-id-115 .if-header.is-scrolled,
body.search .if-header.is-scrolled,
body.error404 .if-header.is-scrolled {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background: rgba(255, 255, 255, .95) !important;
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
    box-shadow: 0 12px 40px -18px rgba(13, 13, 15, .22) !important;
    border-bottom: 1px solid rgba(200, 162, 74, .16) !important;
}

body.woocommerce-cart .if-header.is-scrolled .if-nav__link,
body.woocommerce-checkout .if-header.is-scrolled .if-nav__link,
body.woocommerce-account .if-header.is-scrolled .if-nav__link,
body.page-id-134 .if-header.is-scrolled .if-nav__link,
body.page-id-82 .if-header.is-scrolled .if-nav__link,
body.page-id-83 .if-header.is-scrolled .if-nav__link,
body.page-id-84 .if-header.is-scrolled .if-nav__link,
body.page-id-85 .if-header.is-scrolled .if-nav__link,
body.page-id-115 .if-header.is-scrolled .if-nav__link,
body.search .if-header.is-scrolled .if-nav__link,
body.error404 .if-header.is-scrolled .if-nav__link {
    color: rgba(13, 13, 15, .78) !important;
}

body.woocommerce-cart .if-header.is-scrolled .if-icon-btn,
body.woocommerce-checkout .if-header.is-scrolled .if-icon-btn,
body.woocommerce-account .if-header.is-scrolled .if-icon-btn,
body.page-id-134 .if-header.is-scrolled .if-icon-btn,
body.page-id-82 .if-header.is-scrolled .if-icon-btn,
body.page-id-83 .if-header.is-scrolled .if-icon-btn,
body.page-id-84 .if-header.is-scrolled .if-icon-btn,
body.page-id-85 .if-header.is-scrolled .if-icon-btn,
body.page-id-115 .if-header.is-scrolled .if-icon-btn,
body.search .if-header.is-scrolled .if-icon-btn,
body.error404 .if-header.is-scrolled .if-icon-btn,
body.woocommerce-cart .if-header.is-scrolled .if-burger,
body.woocommerce-checkout .if-header.is-scrolled .if-burger,
body.woocommerce-account .if-header.is-scrolled .if-burger,
body.page-id-134 .if-header.is-scrolled .if-burger,
body.page-id-82 .if-header.is-scrolled .if-burger,
body.page-id-83 .if-header.is-scrolled .if-burger,
body.page-id-84 .if-header.is-scrolled .if-burger,
body.page-id-85 .if-header.is-scrolled .if-burger,
body.page-id-115 .if-header.is-scrolled .if-burger,
body.search .if-header.is-scrolled .if-burger,
body.error404 .if-header.is-scrolled .if-burger {
    color: rgba(13, 13, 15, .8) !important;
}

body.woocommerce-cart .if-header.is-scrolled .if-icon-btn svg,
body.woocommerce-checkout .if-header.is-scrolled .if-icon-btn svg,
body.woocommerce-account .if-header.is-scrolled .if-icon-btn svg,
body.page-id-134 .if-header.is-scrolled .if-icon-btn svg,
body.page-id-82 .if-header.is-scrolled .if-icon-btn svg,
body.page-id-83 .if-header.is-scrolled .if-icon-btn svg,
body.page-id-84 .if-header.is-scrolled .if-icon-btn svg,
body.page-id-85 .if-header.is-scrolled .if-icon-btn svg,
body.page-id-115 .if-header.is-scrolled .if-icon-btn svg,
body.search .if-header.is-scrolled .if-icon-btn svg,
body.error404 .if-header.is-scrolled .if-icon-btn svg,
body.woocommerce-cart .if-header.is-scrolled .if-burger svg,
body.woocommerce-checkout .if-header.is-scrolled .if-burger svg,
body.woocommerce-account .if-header.is-scrolled .if-burger svg,
body.page-id-134 .if-header.is-scrolled .if-burger svg,
body.page-id-82 .if-header.is-scrolled .if-burger svg,
body.page-id-83 .if-header.is-scrolled .if-burger svg,
body.page-id-84 .if-header.is-scrolled .if-burger svg,
body.page-id-85 .if-header.is-scrolled .if-burger svg,
body.page-id-115 .if-header.is-scrolled .if-burger svg,
body.search .if-header.is-scrolled .if-burger svg,
body.error404 .if-header.is-scrolled .if-burger svg {
    stroke: rgba(13, 13, 15, .8) !important;
}

/* ── 2. Zero the non-home .if-main top push (premium 8492/8495) so heroes reach y0 ── */
body.woocommerce-cart:not(.home):not(.if-front-page) .if-main,
body.woocommerce-checkout:not(.home):not(.if-front-page) .if-main,
body.woocommerce-account:not(.home):not(.if-front-page) .if-main,
body.page-id-134:not(.home):not(.if-front-page) .if-main,
body.page-id-82:not(.home):not(.if-front-page) .if-main,
body.page-id-83:not(.home):not(.if-front-page) .if-main,
body.page-id-84:not(.home):not(.if-front-page) .if-main,
body.page-id-85:not(.home):not(.if-front-page) .if-main,
body.page-id-115:not(.home):not(.if-front-page) .if-main,
body.search:not(.home):not(.if-front-page) .if-main,
body.error404:not(.home):not(.if-front-page) .if-main {
    padding-top: 0 !important;
}

body.admin-bar.woocommerce-cart:not(.home):not(.if-front-page) .if-main,
body.admin-bar.woocommerce-checkout:not(.home):not(.if-front-page) .if-main,
body.admin-bar.woocommerce-account:not(.home):not(.if-front-page) .if-main,
body.admin-bar.page-id-134:not(.home):not(.if-front-page) .if-main,
body.admin-bar.page-id-82:not(.home):not(.if-front-page) .if-main,
body.admin-bar.page-id-83:not(.home):not(.if-front-page) .if-main,
body.admin-bar.page-id-84:not(.home):not(.if-front-page) .if-main,
body.admin-bar.page-id-85:not(.home):not(.if-front-page) .if-main,
body.admin-bar.page-id-115:not(.home):not(.if-front-page) .if-main,
body.admin-bar.search:not(.home):not(.if-front-page) .if-main,
body.admin-bar.error404:not(.home):not(.if-front-page) .if-main {
    padding-top: 0 !important;
}

/* ── 3. DARK HERO — shared background (grid + glows + base gradient) ── */
body.woocommerce-cart .if-page-header,
body.woocommerce-checkout .if-page-header,
body.woocommerce-account .if-page-header,
body.page-id-134 .if-page-header,
body.page-id-82 .if-page-about > section:first-of-type,
body.page-id-83 .if-page-wholesale > section:first-of-type,
body.page-id-84 .if-page-contact > section:first-of-type,
body.page-id-85 .if-page-faq > section:first-of-type,
body.search .if-section--sm,
body.error404 .if-section--lg {
    background-image: var(--if-hero-bg-image) !important;
    background-size: var(--if-hero-bg-size) !important;
    background-color: #0d0d0f !important;
    background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat !important;
    color: rgba(255, 255, 255, .8) !important;
}

/* Hero padding — WC/titles variant (ref inner pages: calc(90px+4vw) 0 50px) */
body.woocommerce-cart .if-page-header,
body.woocommerce-checkout .if-page-header,
body.woocommerce-account .if-page-header,
body.page-id-134 .if-page-header {
    padding: calc(90px + 4vw) 0 50px !important;
    margin: 0 !important;
}

/* Template/search heroes (ref: calc(100px+6vw) 0 70px / search 0 60px) */
body.page-id-82 .if-page-about > section:first-of-type,
body.page-id-83 .if-page-wholesale > section:first-of-type,
body.page-id-84 .if-page-contact > section:first-of-type,
body.page-id-85 .if-page-faq > section:first-of-type {
    padding: calc(100px + 6vw) 0 70px !important;
}

body.search .if-section--sm {
    padding: calc(100px + 6vw) 0 0 !important;
    border-bottom: 0 !important;
}

@media (max-width: 820px) {
    body.woocommerce-cart .if-page-header,
    body.woocommerce-checkout .if-page-header,
    body.woocommerce-account .if-page-header,
    body.page-id-134 .if-page-header,
    body.page-id-82 .if-page-about > section:first-of-type,
    body.page-id-83 .if-page-wholesale > section:first-of-type,
    body.page-id-84 .if-page-contact > section:first-of-type,
    body.page-id-85 .if-page-faq > section:first-of-type,
    body.search .if-section--sm {
        padding: calc(100px + 8vw) 0 0 !important;
    }
}

/* Kill the WC "gold rule" ::after on heroes (ref has none) */
body.woocommerce-cart .if-page-header::after,
body.woocommerce-checkout .if-page-header::after,
body.woocommerce-account .if-page-header::after {
    content: none !important;
    display: none !important;
}

/* Hero typography — ref .page-hero h1 */
body.woocommerce-cart .if-page-header h1,
body.woocommerce-cart .if-page-title,
body.woocommerce-checkout .if-page-header h1,
body.woocommerce-checkout .if-page-title,
body.woocommerce-account .if-page-header h1,
body.woocommerce-account .if-page-title,
body.page-id-134 .if-page-header h1,
body.page-id-134 .if-page-title,
body.page-id-82 .if-page-about > section:first-of-type h1,
body.page-id-83 .if-page-wholesale > section:first-of-type h1,
body.page-id-84 .if-page-contact > section:first-of-type h1,
body.page-id-85 .if-page-faq > section:first-of-type h1,
body.page-id-115 .if-page > section:first-of-type .if-section__head h1,
body.search .if-section--sm h1 {
    font-family: var(--if-font-display) !important;
    font-weight: 300 !important;
    font-size: clamp(38px, 6vw, 76px) !important;
    line-height: 1.06 !important;
    color: #fff !important;
    text-align: left !important;
    margin: 0 0 16px !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

body.woocommerce-cart .if-page-header h1 em,
body.woocommerce-checkout .if-page-header h1 em,
body.woocommerce-account .if-page-header h1 em,
body.page-id-134 .if-page-header h1 em,
body.page-id-82 .if-page-about > section:first-of-type h1 em,
body.page-id-83 .if-page-wholesale > section:first-of-type h1 em,
body.page-id-84 .if-page-contact > section:first-of-type h1 em,
body.page-id-85 .if-page-faq > section:first-of-type h1 em,
body.page-id-115 .if-page > section:first-of-type .if-section__head h1 em,
body.search .if-section--sm h1 em {
    background: var(--if-grad-gold) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}

/* Hero subtext — ref p (white .62, 620 max, left) */
body.woocommerce-cart .if-page-header p,
body.woocommerce-checkout .if-page-header p,
body.woocommerce-account .if-page-header p,
body.page-id-134 .if-page-header p,
body.page-id-82 .if-page-about > section:first-of-type p,
body.page-id-83 .if-page-wholesale > section:first-of-type p,
body.page-id-84 .if-page-contact > section:first-of-type p,
body.page-id-85 .if-page-faq > section:first-of-type p,
body.page-id-115 .if-page > section:first-of-type .if-section__head p,
body.search .if-section--sm p {
    color: rgba(255, 255, 255, .62) !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    max-width: 620px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
}

/* Hero eyebrow — ref gold-lt */
body.woocommerce-cart .if-page-header .if-eyebrow,
body.woocommerce-checkout .if-page-header .if-eyebrow,
body.woocommerce-account .if-page-header .if-eyebrow,
body.page-id-134 .if-page-header .if-eyebrow,
body.page-id-82 .if-page-about > section:first-of-type .if-eyebrow,
body.page-id-83 .if-page-wholesale > section:first-of-type .if-eyebrow,
body.page-id-84 .if-page-contact > section:first-of-type .if-eyebrow,
body.page-id-85 .if-page-faq > section:first-of-type .if-eyebrow,
body.page-id-115 .if-page > section:first-of-type .if-section__head .if-eyebrow,
body.search .if-section--sm .if-eyebrow {
    color: #e9d6a3 !important;
}

/* Hero containers — left-aligned (live heroes ship .if-text-center), full container width */
body.page-id-82 .if-page-about > section:first-of-type .if-container,
body.page-id-83 .if-page-wholesale > section:first-of-type .if-container,
body.page-id-84 .if-page-contact > section:first-of-type .if-container,
body.page-id-85 .if-page-faq > section:first-of-type .if-container,
body.search .if-section--sm .if-container,
body.page-id-115 .if-page > section:first-of-type .if-section__head {
    text-align: left !important;
}

body.page-id-82 .if-page-about > section:first-of-type .if-container--narrow,
body.page-id-83 .if-page-wholesale > section:first-of-type .if-container--narrow,
body.page-id-84 .if-page-contact > section:first-of-type .if-container--narrow,
body.page-id-85 .if-page-faq > section:first-of-type .if-container--narrow {
    max-width: var(--if-container) !important;
    padding-inline: var(--if-gutter) !important;
}

body.page-id-82 .if-page-about > section:first-of-type .if-rule-gold,
body.page-id-83 .if-page-wholesale > section:first-of-type .if-rule-gold,
body.page-id-84 .if-page-contact > section:first-of-type .if-rule-gold,
body.page-id-85 .if-page-faq > section:first-of-type .if-rule-gold {
    margin-left: 0 !important;
    margin-right: auto !important;
}

/* WC hero breadcrumb → ref plain light breadcrumb (was ivory pill w/ gold bar) */
body.woocommerce-cart .if-page-header .woocommerce-breadcrumb,
body.woocommerce-checkout .if-page-header .woocommerce-breadcrumb,
body.woocommerce-account .if-page-header .woocommerce-breadcrumb,
body.page-id-134 .if-page-header .woocommerce-breadcrumb {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 0 22px 0 !important;
    font-size: 10.5px !important;
    letter-spacing: .24em !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, .5) !important;
    gap: 10px !important;
}

body.woocommerce-cart .if-page-header .woocommerce-breadcrumb a,
body.woocommerce-checkout .if-page-header .woocommerce-breadcrumb a,
body.woocommerce-account .if-page-header .woocommerce-breadcrumb a,
body.page-id-134 .if-page-header .woocommerce-breadcrumb a {
    color: rgba(255, 255, 255, .85) !important;
}

body.woocommerce-cart .if-page-header .woocommerce-breadcrumb a:hover,
body.woocommerce-checkout .if-page-header .woocommerce-breadcrumb a:hover,
body.woocommerce-account .if-page-header .woocommerce-breadcrumb a:hover,
body.page-id-134 .if-page-header .woocommerce-breadcrumb a:hover {
    color: #e9d6a3 !important;
}

body.woocommerce-cart .if-page-header .woocommerce-breadcrumb strong,
body.woocommerce-checkout .if-page-header .woocommerce-breadcrumb strong,
body.woocommerce-account .if-page-header .woocommerce-breadcrumb strong,
body.page-id-134 .if-page-header .woocommerce-breadcrumb strong,
body.woocommerce-cart .if-page-header .woocommerce-breadcrumb .current,
body.woocommerce-checkout .if-page-header .woocommerce-breadcrumb .current,
body.woocommerce-account .if-page-header .woocommerce-breadcrumb .current,
body.page-id-134 .if-page-header .woocommerce-breadcrumb .current {
    color: #e9d6a3 !important;
}

/* ── 4. TRACK ORDER — dark full-bleed hero head + ref .track-card form ──
   markup: article.if-page > section > .if-container--narrow >
           header.if-section__head (h1 + p.if-muted w/ inline color) + form.if-form */
body.page-id-115 .if-page > section:first-of-type {
    padding-top: 0 !important;
}

body.page-id-115 .if-page > section:first-of-type .if-section__head {
    box-sizing: border-box !important;
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    padding: calc(100px + 6vw) max(var(--if-gutter), calc((100vw - var(--if-container)) / 2 + var(--if-gutter))) 70px !important;
    background-image: var(--if-hero-bg-image) !important;
    background-size: var(--if-hero-bg-size) !important;
    background-color: #0d0d0f !important;
    background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat !important;
    text-align: left !important;
}

body.page-id-115 .if-page > section:first-of-type .if-section__head p.if-muted {
    color: rgba(255, 255, 255, .62) !important;
}

/* ref .track-card: white card, border, 40 pad, 800 max, auto center */
body.page-id-115 form.if-form {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    padding: 40px !important;
    max-width: 800px !important;
    margin: 40px auto 0 !important;
    gap: 16px !important;
}

body.page-id-115 form.if-form > input,
body.page-id-115 form.if-form .if-form__row input,
body.page-id-115 form.if-form .if-form__row select,
body.page-id-115 form.if-form textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 15px 20px !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--if-charcoal) !important;
    font-family: var(--if-font-body) !important;
    font-size: 14px !important;
    outline: none !important;
    transition: border-color .3s !important;
}

body.page-id-115 form.if-form > input:focus,
body.page-id-115 form.if-form .if-form__row input:focus {
    border-color: var(--if-gold) !important;
}

body.page-id-115 form.if-form .if-form__row {
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
}

/* ref track button = grad-gold, dark text, 11px .2em uppercase */
body.page-id-115 form.if-form .if-btn--primary,
body.page-id-115 form.if-form button[type="submit"] {
    background: var(--if-grad-gold) !important;
    background-size: 230% 100% !important;
    background-position: 0 0 !important;
    color: #1a1408 !important;
    border: 0 !important;
    padding: 15px 40px !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
    box-shadow: 0 18px 40px -20px rgba(200, 162, 74, .9) !important;
    transition: background-position .55s, transform .3s, box-shadow .3s !important;
    justify-self: start !important;
    width: auto !important;
    min-width: 220px !important;
    text-align: center !important;
}

body.page-id-115 form.if-form .if-btn--primary:hover,
body.page-id-115 form.if-form button[type="submit"]:hover {
    background-position: 100% 0 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 22px 46px -18px rgba(200, 162, 74, .95) !important;
    color: #1a1408 !important;
}

/* ── 5. SEARCH — dark hero + ref .search-bar (white bar, gold accents) ── */
body.search .if-search-inline {
    display: flex !important;
    align-items: center !important;
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    max-width: 820px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: 0 18px 40px -26px rgba(13, 13, 15, .35) !important;
}

body.search div[style*="max-width:520px"] {
    box-sizing: border-box !important;
    width: 100vw !important;
    max-width: none !important;
    margin: 0 0 0 calc(50% - 50vw) !important;
    padding: 96px max(var(--if-gutter), calc((100vw - var(--if-container)) / 2 + var(--if-gutter))) 48px !important;
    background: var(--if-ivory) !important;
}

body.search .if-search-inline .if-input-group {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex: 1 !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    background: transparent !important;
}

body.search .if-search-inline .if-input-group .if-input,
body.search .if-search-inline .if-input {
    flex: 1 !important;
    min-width: 0 !important;
    border: 0 !important;
    background: transparent !important;
    padding: 22px 18px !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--if-charcoal) !important;
    outline: none !important;
    letter-spacing: normal !important;
    text-align: left !important;
}

body.search .if-search-inline .if-input::placeholder {
    color: var(--if-muted) !important;
}

body.search .if-search-inline svg {
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    flex: none !important;
    width: 20px !important;
    height: 20px !important;
    margin-left: 24px !important;
    color: var(--if-muted) !important;
    stroke: var(--if-muted) !important;
}

/* ── 6. 404 — full dark bg, gradient 404, gold + ghost buttons, dark search ── */
body.error404 .if-empty > div:first-child {
    color: transparent !important;
    background: var(--if-grad-gold) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

body.error404 .if-empty h1 {
    color: #fff !important;
    font-family: var(--if-font-display) !important;
    font-weight: 400 !important;
}

body.error404 .if-empty p {
    color: rgba(255, 255, 255, .62) !important;
    max-width: 520px !important;
    margin-inline: auto !important;
}

body.error404 .if-empty .if-btn--outline {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .3) !important;
}

body.error404 .if-empty .if-btn--outline:hover {
    border-color: var(--if-gold) !important;
    color: #e9d6a3 !important;
}

body.error404 .search-form {
    display: flex !important;
    gap: 8px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    max-width: 400px !important;
}

body.error404 .search-form .search-field {
    flex: 1 !important;
    min-width: 0 !important;
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    border-radius: 0 !important;
    color: #fff !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-family: var(--if-font-body) !important;
    outline: none !important;
}

body.error404 .search-form .search-field::placeholder {
    color: rgba(255, 255, 255, .45) !important;
}

body.error404 .search-form .search-submit {
    background: var(--if-grad-gold) !important;
    background-size: 230% 100% !important;
    background-position: 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #1a1408 !important;
    padding: 0 22px !important;
    font-size: 11px !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    font-family: var(--if-font-body) !important;
    cursor: pointer !important;
    transition: background-position .55s !important;
}

body.error404 .search-form .search-submit:hover {
    background-position: 100% 0 !important;
}

/* ── 7. GOLD CTA family (ref .btn-gold on about/faq/track/wholesale/404/thankyou) ── */
body.page-id-82 .if-btn--primary,
body.page-id-83 .if-btn--primary,
body.page-id-84 .if-btn--primary,
body.page-id-85 .if-btn--primary,
body.page-id-115 .if-btn--primary,
body.error404 .if-btn--primary,
body.woocommerce-order-received .if-btn--primary {
    background: var(--if-grad-gold) !important;
    background-size: 230% 100% !important;
    background-position: 0 0 !important;
    color: #1a1408 !important;
    border-color: transparent !important;
    box-shadow: 0 18px 40px -20px rgba(200, 162, 74, .9) !important;
    transition: background-position .55s, transform .3s, box-shadow .3s !important;
}

body.page-id-82 .if-btn--primary:hover,
body.page-id-83 .if-btn--primary:hover,
body.page-id-84 .if-btn--primary:hover,
body.page-id-85 .if-btn--primary:hover,
body.page-id-115 .if-btn--primary:hover,
body.error404 .if-btn--primary:hover,
body.woocommerce-order-received .if-btn--primary:hover {
    background-position: 100% 0 !important;
    color: #1a1408 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 22px 46px -18px rgba(200, 162, 74, .95) !important;
}

/* ── 8. CHECKOUT — ref .co-section numbered white cards + .radio-card payments ──
   markup: form.checkout > #customer_details(.col-1 billing | .col-2 ship+additional)
           + #order_review (left untouched — luxury 495-504 pinned) */
body.woocommerce-checkout #customer_details {
    counter-reset: co !important;
    display: block !important;
}

body.woocommerce-checkout #customer_details .col-1,
body.woocommerce-checkout #customer_details .col-2 {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 0 0 0 !important;
    display: block !important;
}

body.woocommerce-checkout #customer_details fieldset {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 32px !important;
    margin: 0 0 24px 0 !important;
    box-shadow: none !important;
}

body.woocommerce-checkout #customer_details fieldset:last-child {
    margin-bottom: 0 !important;
}

body.woocommerce-checkout #customer_details h3,
body.woocommerce-checkout #customer_details .woocommerce-billing-fields h3 {
    counter-increment: co !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    font-family: var(--if-font-display) !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    color: var(--if-charcoal) !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    margin: 0 0 24px 0 !important;
    padding: 0 0 18px 0 !important;
    border-bottom: 1px solid var(--if-line) !important;
    line-height: 1.2 !important;
}

body.woocommerce-checkout #customer_details h3::before,
body.woocommerce-checkout #customer_details .woocommerce-billing-fields h3::before {
    content: counter(co);
    flex: none !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: var(--if-grad-gold) !important;
    color: #1a1408 !important;
    display: grid !important;
    place-items: center !important;
    font-family: var(--if-font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1 !important;
}

body.woocommerce-checkout #customer_details .form-row input.input-text,
body.woocommerce-checkout #customer_details .form-row select,
body.woocommerce-checkout #customer_details .select2-container .select2-selection--single {
    border-color: var(--if-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
}

body.woocommerce-checkout #customer_details .form-row input.input-text:focus,
body.woocommerce-checkout #customer_details .form-row select:focus {
    border-color: var(--if-gold) !important;
}

/* payment = radio cards (ref .radio-card) */
body.woocommerce-checkout #payment ul.wc_payment_methods li {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 14px 16px !important;
    margin: 0 0 10px 0 !important;
    box-shadow: none !important;
    transition: border-color .3s !important;
}

body.woocommerce-checkout #payment ul.wc_payment_methods li:has(input:checked) {
    border-color: rgba(200, 162, 74, .5) !important;
}

body.woocommerce-checkout #payment ul.wc_payment_methods li label {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--if-charcoal) !important;
    font-family: var(--if-font-body) !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    margin: 0 !important;
}

body.woocommerce-checkout #payment ul.wc_payment_methods li input[type="radio"] {
    accent-color: var(--if-gold) !important;
    margin: 0 !important;
}

body.woocommerce-checkout #payment div.payment_box,
body.woocommerce-checkout #payment .payment_box {
    background: transparent !important;
    color: var(--if-muted) !important;
    font-size: 12.5px !important;
    line-height: 1.7 !important;
    padding: 8px 0 0 26px !important;
    margin: 4px 0 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 9. FAQ accordion — ref .acc-item/.acc-head/.acc-ico twins ── */
body.page-id-85 .if-accordion {
    border-top: 1px solid var(--if-line) !important;
}

body.page-id-85 .if-accordion__item {
    border-bottom: 1px solid var(--if-line) !important;
}

body.page-id-85 .if-accordion__trigger {
    font-family: var(--if-font-display) !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    color: var(--if-charcoal) !important;
    padding: 24px 0 !important;
    gap: 20px !important;
    background: transparent !important;
    border: 0 !important;
    line-height: 1.35 !important;
}

body.page-id-85 .if-accordion__trigger:hover {
    color: #9a7a2e !important;
}

body.page-id-85 .if-accordion__icon {
    position: relative !important;
    width: 30px !important;
    height: 30px !important;
    flex: none !important;
    border: 1px solid rgba(200, 162, 74, .4) !important;
    display: grid !important;
    place-items: center !important;
    color: #9a7a2e !important;
}

body.page-id-85 .if-accordion__icon::before,
body.page-id-85 .if-accordion__icon::after {
    inset: 50% 8px auto 8px !important;
    background: currentColor !important;
    height: 1px !important;
}

body.page-id-85 .if-accordion__trigger[aria-expanded="true"] .if-accordion__icon {
    background: var(--if-grad-gold) !important;
    border-color: transparent !important;
    color: #1a1408 !important;
}

body.page-id-85 .if-accordion__trigger[aria-expanded="true"] .if-accordion__icon::before {
    transform: rotate(45deg) !important;
}

body.page-id-85 .if-accordion__trigger[aria-expanded="true"] .if-accordion__icon::after {
    transform: rotate(-45deg) !important;
}

body.page-id-85 .if-accordion__panel-inner {
    font-size: 14px !important;
    color: var(--if-muted) !important;
    line-height: 1.85 !important;
    padding-bottom: 26px !important;
}

/* ── 10. WHOLESALE — ref "Four Steps" white cards + serif 01-04 numbers ── */
body.page-id-83 .if-grid--4 {
    counter-reset: wsn !important;
}

body.page-id-83 .if-grid--4 .if-value-card {
    counter-increment: wsn !important;
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 32px 20px !important;
    text-align: center !important;
    box-shadow: none !important;
}

body.page-id-83 .if-grid--4 .if-value-card__icon {
    display: block !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    position: static !important;
}

body.page-id-83 .if-grid--4 .if-value-card__icon::before {
    content: "0" counter(wsn);
    display: block !important;
    font-family: var(--if-font-display) !important;
    font-size: 42px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    color: #9a7a2e !important;
    background: none !important;
    letter-spacing: .02em !important;
}

body.page-id-83 .if-grid--4 .if-value-card__icon svg {
    display: none !important;
}

body.page-id-83 .if-grid--4 .if-value-card__icon::after {
    display: none !important;
}

body.page-id-83 .if-grid--4 .if-value-card h3,
body.page-id-83 .if-grid--4 .if-value-card h4 {
    font-family: var(--if-font-display) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    color: var(--if-charcoal) !important;
    margin: 0 0 8px 0 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    line-height: 1.3 !important;
}

body.page-id-83 .if-grid--4 .if-value-card p {
    font-size: 12.5px !important;
    color: var(--if-muted) !important;
    line-height: 1.7 !important;
    margin: 0 !important;
}

/* ── 11. LEGAL (/terms-conditions) — ref .legal-wrap: 820 centered column, Cormorant heads ── */
body.page-id-134 .if-page-content {
    max-width: 820px !important;
    margin-inline: auto !important;
}

body.page-id-134 .if-page-content h2,
body.page-id-134 .if-page-content h3 {
    font-family: var(--if-font-display) !important;
    color: var(--if-charcoal) !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

body.page-id-134 .if-page-content h2 {
    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    margin: 44px 0 18px !important;
    padding-top: 32px !important;
    border-top: 1px solid var(--if-line) !important;
}

body.page-id-134 .if-page-content h2:first-child,
body.page-id-134 .if-page-content h2:first-of-type {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

body.page-id-134 .if-page-content h3 {
    font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    margin: 40px 0 14px !important;
    padding-top: 30px !important;
    border-top: 1px solid var(--if-line) !important;
}

body.page-id-134 .if-page-content h3:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

body.page-id-134 .if-page-content p {
    font-size: 14px !important;
    color: var(--if-muted) !important;
    line-height: 1.9 !important;
    margin: 0 0 14px 0 !important;
}

body.page-id-134 .if-page-content strong,
body.page-id-134 .if-page-content b {
    color: var(--if-charcoal) !important;
    font-weight: 500 !important;
}

body.page-id-134 .if-page-content ul,
body.page-id-134 .if-page-content ol {
    margin: 10px 0 18px !important;
    padding-left: 22px !important;
}

body.page-id-134 .if-page-content li {
    font-size: 14px !important;
    color: var(--if-muted) !important;
    line-height: 1.9 !important;
    margin-bottom: 6px !important;
    list-style: disc outside !important;
    display: list-item !important;
}

body.page-id-134 .if-page-content ol li {
    list-style: decimal outside !important;
}

/* ── 12. ACCOUNT sidebar — ref .acc-nav (white card, tinted gold active w/ left rule) ── */
body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 12px 0 !important;
    margin: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li {
    margin: 0 !important;
    padding: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a {
    padding: 13px 16px !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    color: var(--if-muted) !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 2px solid transparent !important;
    border-radius: 0 !important;
    letter-spacing: .01em !important;
    transition: color .3s, background .3s, border-color .3s !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a::before {
    color: inherit !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    background: rgba(200, 162, 74, .05) !important;
    color: var(--if-charcoal) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    background: rgba(200, 162, 74, .06) !important;
    color: #9a7a2e !important;
    border-left: 2px solid var(--if-gold) !important;
    font-weight: 500 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::before {
    color: #9a7a2e !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a {
    color: var(--if-muted) !important;
    background: transparent !important;
    border-left-color: transparent !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a::before {
    color: var(--if-muted) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    background: rgba(200, 162, 74, .05) !important;
    color: var(--if-charcoal) !important;
}

/* ── 13. THANK YOU — ref .ty-mark gold-gradient check (was --if-success green) ── */
body.woocommerce-order-received .if-thankyou__check {
    width: 110px !important;
    height: 110px !important;
    background: var(--if-grad-gold) !important;
    color: #1a1408 !important;
    box-shadow: 0 18px 40px -20px rgba(200, 162, 74, .9) !important;
    margin: 0 auto 36px !important;
    border: 0 !important;
}

body.woocommerce-order-received .if-thankyou__check svg {
    width: 46px !important;
    height: 46px !important;
    stroke: #1a1408 !important;
}

/* ── 14. CONTACT — ref .ci-item: 4 white info cards with gold-line icon boxes ──
   markup: .if-grid--2 > div:first-child = [h2, row, row, row, row] (rows unclassed) */
body.page-id-84 .if-grid--2 > div:first-child,
body.page-id-84 .if-grid--2 > div:last-child {
    background: transparent !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div {
    display: flex !important;
    align-items: flex-start !important;
    gap: 18px !important;
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 24px !important;
    margin: 0 0 24px 0 !important;
    transition: border-color .4s, transform .4s !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div:last-child {
    margin-bottom: 0 !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div:hover {
    border-color: rgba(200, 162, 74, .4) !important;
    transform: translateY(-3px) !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div > div:first-child {
    flex: none !important;
    width: 44px !important;
    height: 44px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(200, 162, 74, .4) !important;
    display: grid !important;
    place-items: center !important;
    color: #9a7a2e !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div > div:first-child svg {
    width: 18px !important;
    height: 18px !important;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 1.4 !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div > div:last-child {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    background: transparent !important;
    border: 0 !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div strong {
    display: block !important;
    font-family: var(--if-font-display) !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    color: var(--if-charcoal) !important;
    margin: 0 0 4px 0 !important;
    line-height: 1.3 !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div a {
    color: #9a7a2e !important;
    border-bottom: 1px solid transparent !important;
    transition: border-color .3s !important;
    font-size: 14px !important;
}

body.page-id-84 .if-grid--2 > div:first-child > div a:hover {
    border-bottom-color: var(--if-gold) !important;
}

/* ═════════════════════════════════════════════════════════════════════
   PHASE 2 — SMOKE-TEST FIXES (round 2)

   Defects found in /tmp/opencode/qa/shots/smoke-{track,faq,search,contact}.png:
     · track  — .if-section__head (layout.css:105) max-width:720px capped the
                full-bleed dark hero to x0–720 → max-width:none (edit above);
     · faq    — premium:4045 body.page-id-85 .if-container--narrow
                padding:0 15px pushed hero content to x16 (gutter must be
                var(--if-gutter)=48) and capped the accordion column at
                800/770 (ref .faq-wrap = 820 content → 850 box incl. 15px
                inner pad → content x310–1130, exact ref edges);
              — faq.php:71 category <h2> carries an INLINE
                border-bottom:2px solid gold + display:inline-block →
                ref .faq-cat h3 twin: gold-dp 24px Cormorant, flex, 32×1
                leading gold dash, no underline;
     · search — hero section held the form (live search.php puts
                div[style*="max-width:520px"] INSIDE section.if-section--sm;
                ref puts .search-bar in the NEXT section on cream) →
                full-bleed ivory band inside the dark hero simulates the
                ref below-hero placement (no .php moved); svg was still
                position:absolute from components.css:567 (overlapping the
                value text) → static, ref order [24px][svg][input] with
                padding 22/18; no submit control exists in live markup →
                no fake button (documented divergence);
     · contact — ref right col = .contact-form WHITE card padding 40 +
                Cormorant 26/400 heading; live h2s were unstyled-size serif
                + the twins gray #fafafa boxes were reset in §14 → re-card
                last column white per ref; ref .contact-grid gap 60.
   ═════════════════════════════════════════════════════════════════════ */

/* FAQ — accordion column = ref .faq-wrap (820 content edges x310–1130) */
body.page-id-85 .if-page-faq > section:nth-of-type(2) .if-container--narrow {
    max-width: 850px !important;
    padding-inline: 15px !important;
}

/* FAQ — category heading = ref .faq-cat h3 (kills faq.php:71 inline
   border-bottom / display / padding / margin / font-size) */
body.page-id-85 .if-page-faq h2 {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-family: var(--if-font-display) !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    color: #9a7a2e !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    border-bottom: 0 !important;
    text-align: left !important;
}

body.page-id-85 .if-page-faq h2::before {
    content: "" !important;
    display: block !important;
    flex: none !important;
    width: 32px !important;
    height: 1px !important;
    background: var(--if-gold) !important;
}

/* CONTACT — right column = ref .contact-form white card (padding 40) */
body.page-id-84 .if-grid--2 > div:last-child {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 40px !important;
}

/* CONTACT — both grid h2s = ref .contact-form h3 scale (26/400) */
body.page-id-84 .if-grid--2 h2 {
    font-family: var(--if-font-display) !important;
    font-size: 26px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    color: var(--if-charcoal) !important;
    margin: 0 0 24px 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* CONTACT — ref .contact-grid gap 60 (twins set 40, premium ~4007) */
@media (min-width: 768px) {
    body.page-id-84 .if-grid--2 {
        gap: 60px !important;
    }
}

/* TRACK — premium:4136 twins pinned the wrapper to 600px w/ margin-top 40
   (earlier approximation) → ref .track-card = 800 content centered, and the
   40px top margin pushed the full-bleed dark hero down to y40 (must be y0) */
body.page-id-115 .if-container--narrow {
    max-width: calc(800px + 2 * var(--if-gutter)) !important;
}

body.page-id-115 .if-page > section:first-of-type .if-container {
    margin-top: 0 !important;
}

/* ═════════════════════════════════════════════════════════════════════
   PHASE 2 — FINAL FIXES (live-DOM probe round)

   · checkout: this WC build ships NO <fieldset> elements (col-1 =
     wc-order-attribution-inputs + .woocommerce-billing-fields; col-2 =
     .ship-to-different-address + .woocommerce-additional-information)
     → §8's fieldset selectors were dead. Cards retargeted to the three
     real section wrappers (h3 counter/flex/gradient ::before verified
     working: content "counter(co)", 32px gradient circle).
     Heading TEXT is WC markup ("Billing details"…) vs ref labels
     ("Contact Information"…) — content divergence, documented, never
     rewritten in CSS.
   · account: nav WRAPPER was the wc #fafafa/r8/pad20 card while §12
     carded the inner ul → double-card. Ref .acc-side = ONE white card
     pad28 → wrapper = white card, ul = transparent (links keep §12
     13/16 + tinted-gold active → text x = 28+16 = 44, exact ref).
   · luxury-verify has no assertions on either target (checked) →
     211/211 preserved.
   ═════════════════════════════════════════════════════════════════════ */

body.woocommerce-checkout #customer_details .woocommerce-billing-fields,
body.woocommerce-checkout #customer_details .ship-to-different-address,
body.woocommerce-checkout #customer_details .woocommerce-additional-information {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 32px !important;
    margin: 0 0 24px 0 !important;
    box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 28px !important;
    box-shadow: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Checkout col-2 real classes (this WC build): .woocommerce-shipping-fields
   + .woocommerce-additional-fields (probe-verified parents of the h3s) */
body.woocommerce-checkout #customer_details .woocommerce-shipping-fields,
body.woocommerce-checkout #customer_details .woocommerce-additional-fields {
    background: #fff !important;
    border: 1px solid var(--if-line) !important;
    border-radius: 0 !important;
    padding: 32px !important;
    margin: 0 0 24px 0 !important;
    box-shadow: none !important;
}

/* ── Checkout overflow fix (probe-verified 2026-10-28): our
   !important .form-row select rules out-specify Select2's
   .select2-hidden-accessible a11y hiding → the hidden billing_state
   select rendered at full width (left:81px right:-79px width:1440px),
   pushing body.scrollWidth to 1520 and exposing the off-canvas
   .if-mini-cart edge in fullPage screenshots. Re-assert the 1×1
   hiding for the a11y-hidden clone only (visible selects and the
   .select2-container UI are untouched). */
.woocommerce-checkout .form-row select.select2-hidden-accessible,
#customer_details .form-row select.select2-hidden-accessible {
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════
   PHASE 3 — MOBILE LOGO FINAL (2026-10-28)
   Stacked escalation blocks above fight each other on ≤767
   (30px @1318 vs 80px @5486 vs 48px @5589 vs 50/40px @8476) and
   the img escaped the bar (computed: container y:21 48px, img y:-3
   48px position:relative). Reference theme.css: .logo-mark is
   46×46, no absolute offsets, bar = padding 24 + 46.
   This block ties/beats every prior rule via body:not(.never)
   prefix (b=4) + last-cascade position; media-scoped so desktop
   is untouched. Bar heights stay as shipped (home 90 / inner 65).
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  body:not(.if-logo-never) .if-header__inner,
  body:not(.if-logo-never) .if-header.is-scrolled .if-header__inner {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
  }

  body:not(.if-logo-never) .if-header .if-logo.if-logo--image,
  body:not(.if-logo-never) .if-header.is-scrolled .if-logo.if-logo--image,
  body:not(.if-logo-never) .if-header .if-logo.if-logo--image .custom-logo-link,
  body:not(.if-logo-never) .if-header.is-scrolled .if-logo.if-logo--image .custom-logo-link {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: 46px !important;
    height: 46px !important;
    max-width: 46px !important;
    max-height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
  }

  body:not(.if-logo-never) .if-header .if-logo.if-logo--image img.custom-logo,
  body:not(.if-logo-never) .if-header.is-scrolled .if-logo.if-logo--image img.custom-logo {
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 46px !important;
    height: 46px !important;
    max-width: 46px !important;
    max-height: 46px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   FINAL POLISH — TASK 1: SHOP dark hero (exact FAQ/Cart machine)
   .if-shop-hero--light (ivory) → reference dark page-hero:
   gradient+grid+glow stack, white type, cart paddings, y0 hero.
   ═══════════════════════════════════════════════════════════════ */

/* 1. Hide default theme titles (archive emits none — defensive) */
body.post-type-archive-product .entry-header,
body.post-type-archive-product .page-header,
body.post-type-archive-product .page-title,
body.post-type-archive-product .woocommerce-products-header,
body.post-type-archive-product .woocommerce-products-header__title {
    display: none !important;
}

/* 2. Zero the non-home .if-main push → hero reaches y0 (tie + later) */
body.post-type-archive-product:not(.home):not(.if-front-page) .if-main,
body.admin-bar.post-type-archive-product:not(.home):not(.if-front-page) .if-main {
    padding-top: 0 !important;
}

/* 3. Transparent header over the dark hero (top state only;
      scrolled state falls back to the fixed white bar) */
body.post-type-archive-product .if-header:not(.is-scrolled) {
    position: absolute !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: 9999 !important;
}

/* 4. White nav / icons / burger on the dark hero (top state) */
body.post-type-archive-product .if-header:not(.is-scrolled) .if-nav__link,
body.post-type-archive-product .if-header:not(.is-scrolled) .if-icon-btn,
body.post-type-archive-product .if-header:not(.is-scrolled) .if-burger {
    color: rgba(255, 255, 255, 0.92) !important;
}
body.post-type-archive-product .if-header:not(.is-scrolled) .if-icon-btn svg,
body.post-type-archive-product .if-header:not(.is-scrolled) .if-burger svg {
    stroke: rgba(255, 255, 255, 0.92) !important;
}
body.post-type-archive-product .if-header:not(.is-scrolled) .if-burger span {
    background: rgba(255, 255, 255, 0.92) !important;
}

/* 5. Dark hero body — reference gradient+grid+glow stack (cart var) */
body.post-type-archive-product .if-shop-hero.if-shop-hero--light {
    background-image: var(--if-hero-bg-image) !important;
    background-size: var(--if-hero-bg-size) !important;
    background-color: #0d0d0f !important;
    background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat !important;
    color: #ffffff !important;
    padding: calc(90px + 4vw) 0 50px !important;
}

@media (max-width: 820px) {
    body.post-type-archive-product .if-shop-hero.if-shop-hero--light {
        padding: calc(100px + 8vw) 0 0 !important;
    }
}

/* 6. Kill the ivory ::before washes (element stack carries the glows) */
body.post-type-archive-product .if-shop-hero--light::before {
    background: none !important;
}

/* 7. Dark-variant breadcrumb / title / desc / count pill */
body.post-type-archive-product .if-shop-hero--light .if-shop-breadcrumbs {
    color: rgba(255, 255, 255, 0.55) !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-breadcrumbs a {
    color: rgba(255, 255, 255, 0.7) !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-breadcrumbs a:hover {
    color: var(--if-gold-soft) !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-breadcrumbs span[aria-hidden="true"] {
    color: var(--if-gold) !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-breadcrumbs [aria-current="page"] {
    color: var(--if-gold-soft) !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-hero__title {
    color: #ffffff !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-hero__desc {
    color: rgba(255, 255, 255, 0.85) !important;
}
body.post-type-archive-product .if-shop-hero--light .if-shop-hero__count {
    background: rgba(198, 161, 91, 0.15) !important;
    border-color: rgba(198, 161, 91, 0.3) !important;
    color: var(--if-gold-soft) !important;
}

/* ═══════════════════════════════════════════════════════════════
   FINAL POLISH — TASK 2: Order-Received collapse fix
   Root cause: the desktop block above (min-width:768) floats
   .if-thankyou__meta right; .if-thankyou__header has no clearfix
   → the float escapes the header; .if-thankyou__main (display:grid
   = independent formatting context) then shrink-wraps beside it:
   1052 − 589 = 463px for the whole 2-col grid → panels squeeze →
   product name collapses to 1 character per line.
   Fix: contain the float inside the header + clear it on main so
   the grid gets the full 1052px content width back.
   ═══════════════════════════════════════════════════════════════ */
.if-thankyou__header::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

.if-thankyou__main {
    clear: both !important;
}

/* ══════════════════════════════════════════════════════════════════════
   FINAL POLISH — TASK 5: Clear Cart link (cart page, coupon row)
   Subtle text link — never styled as a primary action.
   ══════════════════════════════════════════════════════════════════════ */
.coupon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.coupon .input-text {
  flex: 1 1 220px;
  min-width: 0;
  margin: 0;
}
.coupon .button {
  flex: 0 0 auto;
}
.coupon .if-clear-cart {
  flex: 0 0 auto;
  white-space: nowrap;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .04em;
  color: #c0392b;
  text-decoration: none;
  transition: color .2s ease;
}
.coupon .if-clear-cart:hover,
.coupon .if-clear-cart:focus-visible {
  color: #a93226;
  text-decoration: underline;
}

/* ══════════════════════════════════════════════════════════════════════
   FINAL POLISH — TASK 6: hide the WooCommerce "added to your cart"
   message on the Cart and Checkout pages only.
   ══════════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .woocommerce-message,
body.woocommerce-checkout .woocommerce-message {
  display: none !important;
}

/* ══════════════════════════════════════════════════════════════════════
   FINAL POLISH — TASK 7: cart totals alignment + first item stray line
   1) th labels left, td values right (forced).
   2) Shipping methods / destination / calculator left with padding.
   3) Remove the border-top on the FIRST cart row's cells (stray line
      above the first product's name/qty/price).
   ══════════════════════════════════════════════════════════════════════ */
.cart_totals table th {
  text-align: left !important;
}
.cart_totals table td {
  text-align: right !important;
}
.cart_totals tr.shipping td,
.cart_totals .woocommerce-shipping-methods,
.cart_totals .woocommerce-shipping-methods li,
.cart_totals .woocommerce-shipping-destination,
.cart_totals .woocommerce-shipping-calculator {
  text-align: left !important;
}
.woocommerce-cart .cart_totals tr.shipping td {
  padding: 12px 0 12px 8px !important;
}
.woocommerce-cart table.shop_table tbody tr.cart_item:first-child td {
  border-top: 0 !important;
}

/* ══════════════════════════════════════════════════════════════════════
   FINAL POLISH — TASK 8: header icon overlays (search / cart drawers)
   1) z-index above the header (9999) so nothing covers the panels or
      intercepts the close buttons.
   2) Premium re-theme: Ivory #faf8f4 surfaces, Ink #0d0d0f text,
      gold accents — instead of default pure white.
   3) overflow: visible on the search panel (no clipped content).
   ══════════════════════════════════════════════════════════════════════ */
.if-search-overlay {
  z-index: 10500;
}
.if-cart-overlay {
  z-index: 10490;
}
.if-mini-cart {
  z-index: 10500;
}

/* Search panel — ivory surface, ink text, gold accents. */
.if-search-panel {
  background: #faf8f4;
  max-height: none;
  overflow: visible;
  border-bottom: 1px solid rgba(13, 13, 15, .08);
}
.if-search-panel__close {
  color: #0d0d0f;
  z-index: 3;
}
.if-search-panel__close:hover {
  background: rgba(201, 162, 39, .18);
  color: #9a7b2e;
}
.if-search-form {
  border-bottom-color: #c8a24a;
}
.if-search-form input {
  color: #0d0d0f;
}
.if-search-form input::placeholder {
  color: rgba(13, 13, 15, .45);
}
.if-search-suggestions__group h4 {
  color: #0d0d0f;
}
.if-search-suggestions .if-tag {
  color: #0d0d0f;
  background: #ffffff;
  border-color: rgba(13, 13, 15, .18);
}
.if-search-suggestions .if-tag:hover,
.if-search-suggestions .if-tag:focus-visible {
  color: #0d0d0f;
  background: rgba(201, 162, 39, .12);
  border-color: #c8a24a;
}

/* Mini cart drawer — ivory surface, ink text, gold accents. */
.if-mini-cart {
  background: #faf8f4;
}
.if-mini-cart__head {
  border-bottom-color: rgba(13, 13, 15, .1);
}
.if-mini-cart__title {
  color: #0d0d0f;
}
.if-mini-cart__close {
  color: #0d0d0f;
  z-index: 3;
}
.if-mini-cart__close:hover {
  background: rgba(201, 162, 39, .18);
}
.if-mini-cart__body {
  color: #0d0d0f;
}

/* ============================================================
   FINAL POLISH — TASK 9: Mobile hero trust-strip overlap.
   Cause: Phase-V mobile block forces `padding-block: 24px !important`
   on .if-hero-slider__content (max-width: 639), defeating the strip
   reserve (200/300px) → the absolute bottom:0 strip (274px, 1-col)
   overlapped hero copy/title. Re-assert reserves with equal
   specificity + !important so copy clears the strip on every mobile tier.
   ============================================================ */
@media (max-width: 767px) {
  .if-hero-slider__content {
    padding-bottom: 200px !important;
  }
}
@media (max-width: 639px) {
  .if-hero-slider__content {
    padding-bottom: 300px !important;
  }
}

/* ============================================================
   FINAL POLISH — TASK 9 (Task-8 z-index family addendum):
   Mobile drawer menu sits at var(--if-z-drawer)=1000, below the
   non-home header z9999 → header swallowed Close clicks. Raise the
   menu above the header like the other overlays.
   ============================================================ */
.if-mobile-menu {
  z-index: 10500;
}
/* ============================================================
   NEWSLETTER POPUP
   ============================================================ */
.if-nl-popup {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
}
.if-nl-popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(13, 13, 15, 0.72);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.if-nl-popup__card {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 92%;
    max-width: 480px;
    background: #ffffff;
    padding: 48px 40px 36px;
    text-align: center;
    box-shadow: 0 40px 100px -30px rgba(13, 13, 15, 0.5);
    animation: ifNlIn 0.5s cubic-bezier(0.19, 1, 0.22, 1) both;
}
@keyframes ifNlIn {
    from { opacity: 0; transform: translate(-50%, -45%) scale(0.95); }
    to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.if-nl-popup__close {
    position: absolute;
    top: 12px;
    right: 16px;
    width: 36px;
    height: 36px;
    background: transparent;
    border: 0;
    font-size: 28px;
    line-height: 1;
    color: #7c7c85;
    cursor: pointer;
    transition: color 0.3s;
}
.if-nl-popup__close:hover { color: #0d0d0f; }
.if-nl-popup__eyebrow {
    font-family: 'Jost', sans-serif;
    font-size: 10px;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: #9a7a2e;
    font-weight: 500;
    margin-bottom: 16px;
}
.if-nl-popup__title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(24px, 4vw, 30px);
    font-weight: 500;
    line-height: 1.2;
    color: #0d0d0f;
    margin: 0 0 14px;
}
.if-nl-popup__title em {
    font-style: italic;
    color: #c8a24a;
}
.if-nl-popup__text {
    font-family: 'Jost', sans-serif;
    font-size: 13.5px;
    line-height: 1.7;
    color: #7c7c85;
    margin: 0 0 24px;
    max-width: 340px;
    margin-inline: auto;
}
.if-nl-popup__form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}
.if-nl-popup__form input[type="email"] {
    width: 100%;
    padding: 14px 18px;
    border: 1px solid #e0dcd3;
    background: #faf8f4;
    font-family: 'Jost', sans-serif;
    font-size: 14px;
    color: #0d0d0f;
    outline: none;
    transition: border-color 0.3s, background 0.3s;
}
.if-nl-popup__form input[type="email"]:focus {
    border-color: #c8a24a;
    background: #ffffff;
}
.if-nl-popup__form button {
    padding: 15px 20px;
    background: linear-gradient(120deg, #e9d6a3 0%, #c8a24a 30%, #9a7a2e 55%, #e6cf95 80%, #c8a24a 100%);
    background-size: 220% 100%;
    color: #1a1408;
    border: 0;
    font-family: 'Jost', sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-position 0.5s ease;
}
.if-nl-popup__form button:hover {
    background-position: 100% 0;
}
.if-nl-popup__skip {
    background: transparent;
    border: 0;
    font-family: 'Jost', sans-serif;
    font-size: 11px;
    letter-spacing: 0.15em;
    color: #7c7c85;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
    padding: 6px 10px;
}
.if-nl-popup__skip:hover { color: #0d0d0f; }

@media (max-width: 480px) {
    .if-nl-popup__card { padding: 42px 24px 28px; }
}