/** Shopify CDN: Minification failed

Line 377:0 All "@import" rules must come first

**/
/* Premium product title size hierarchy + one-of-a-kind badge.
   Feet/inches are shown as the primary size figure (target market: US & Canada),
   with centimeters shown smaller and muted as a secondary reference. */

.product-title__name {
  display: block;
}

.product-title__size-block {
  display: block;
  margin-top: .375rem;
  text-align: center;
}

.product-title__size-label {
  display: block;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .625rem;
  color: rgb(var(--text-color) / .5);
  margin-bottom: .125rem;
}

.product-title__size-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: .375rem;
  flex-wrap: wrap;
}

.product-title__size-ftin {
  font-size: .9375rem;
  font-weight: 500;
  color: rgb(var(--text-color));
  letter-spacing: .01em;
}

.product-title__size-cm {
  font-size: .75rem;
  color: rgb(var(--text-color) / .5);
}

.one-of-a-kind-badge {
  display: inline-flex;
  align-items: center;
  margin-top: .5rem;
  padding: .1875rem .625rem;
  border: 1px solid rgb(179 141 84 / .55);
  border-radius: 999px;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .5625rem;
  color: rgb(139 100 45 / .95);
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Variant used on collection cards: sits right below the image, above the title,
   so the one-of-a-kind message is the first thing a shopper reads.
   No extra margin here — .product-card__info is a CSS grid with its own
   .75rem gap between children, so adding margin on top of that doubles the gap. */
.one-of-a-kind-badge--top {
  display: flex;
  margin: 0;
  margin-inline: auto;
  justify-content: center;
}

/* A touch more breathing room between collection cards for a less cramped, more
   gallery-like feel at desktop widths. */
@media screen and (min-width: 700px) {
  .product-list {
    --product-list-default-column-gap: 2rem;
    --product-list-default-row-gap: 3.75rem;
  }
}

@media screen and (min-width: 1000px) {
  .product-list {
    --product-list-default-column-gap: 3.5rem;
    --product-list-default-row-gap: 4.75rem;
  }

  .product-title__size-ftin {
    font-size: 1rem;
  }

  .one-of-a-kind-badge {
    white-space: normal;
    font-size: .625rem;
  }
}

/* Warm, very soft shadow under each rug photo — a low-opacity brown tint instead
   of neutral black, so it reads as a gentle lift off the floor rather than a
   generic UI drop-shadow. Kept faint so it doesn't pull attention from the rug. */
.product-card__figure {
  box-shadow: 0 6px 16px rgb(90 55 35 / .05);
}

/* Quick-add button: transparent background, icon-only in the brand maroon,
   with a soft drop-shadow on the icon itself (not a filled shape) so it stays
   legible over busy rug photography without sitting on top as a solid disc. */
.product-card__quick-add-button {
  background: transparent !important;
  color: rgb(122 31 44) !important;
  border-radius: 50%;
  inset-block-end: .75rem;
  inset-inline-end: .75rem;
  filter: drop-shadow(0 1px 3px rgb(0 0 0 / .35));
}

.product-card__quick-add-button:hover,
.product-card__quick-add-button:focus {
  color: rgb(139 100 45) !important;
}

/* On touch devices, the quick-add button has no hover state to fade it in/out
   (that only applies at @media (pointer: fine) in the base theme), so it's
   always visible — keep it small and light-footprint here since there's no
   filled background to help it recede. */
@media screen and (max-width: 699px) {
  .product-card__quick-add-button {
    padding: .4375rem;
    inset-block-end: .5rem;
    inset-inline-end: .5rem;
  }

  .product-card__quick-add-button svg {
    width: 11px;
  }
}

/* Collection description — default styling is a refined italic placard caption,
   intended for SHORT one-line taglines (e.g. "A curated edit of rare, hand-knotted
   pieces..." on the Clearance page). */
.collection-description {
  font-style: italic;
  font-size: .9375rem;
  letter-spacing: .02em;
  color: rgb(var(--text-color) / .62);
  max-width: 34rem;
  margin-inline: auto;
  margin-top: .5rem;
}

.collection-description p {
  margin: 0;
}

@media screen and (min-width: 700px) {
  .collection-description {
    font-size: 1.0625rem;
  }
}

/* Longer, multi-sentence descriptions (auto-detected in collection-banner.liquid
   by word count) switch to upright text instead — italic becomes hard to read
   past a sentence or two. Kept the same muted color/letter-spacing for cohesion,
   just dropped italic, a touch smaller, and wider so it doesn't wrap too tightly. */
.collection-description--long {
  font-style: normal;
  font-size: .875rem;
  max-width: 46rem;
  line-height: 1.7;
}

@media screen and (min-width: 700px) {
  .collection-description--long {
    font-size: .9375rem;
  }
}

/* Collection page title (e.g. "Clearance - Limited Time") — scoped to this class
   only, so other h1 headings on the site are untouched. Moves away from the
   plain, heavy sans-serif default toward a refined serif treatment with a thin
   rule beneath, closer to a gallery/auction-house placard than a generic
   ecommerce category header. */
.collection-page-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 400;
  font-style: normal;
  text-transform: none;
  letter-spacing: .01em;
  font-size: 1.75rem;
  line-height: 1.25;
  padding-bottom: .875rem;
  position: relative;
  display: inline-block;
}

.collection-page-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 2.5rem;
  height: 1px;
  background: rgb(179 141 84 / .55);
}

@media screen and (min-width: 700px) {
  .collection-page-title {
    font-size: 2.375rem;
  }
}

/* "Clearance – Limited Time" — the Shop mega-menu's top entry, driving ~80% of
   sales. Rendered as a solid brand-maroon panel (mega-menu.liquid swaps in the
   .mega-menu__clearance-panel markup for this column specifically, matched by
   collection handle "clearance") instead of a plain text link, so it reads as
   a featured placement rather than one item among many. Deliberately plain
   solid color, no product photo — a clean, premium block in the brand's own
   maroon rather than a busy catalog photo. Content top-aligned with a thin
   gold rule and an outlined (not filled) CTA for a more restrained, boutique
   feel than a solid button would give. The whole panel is a click target via
   a full-cover "stretched link" underneath the content (rather than the panel
   itself being an <a>), matching the pattern needed for the review badge
   below it to stay a fully separate, independently-styled link. */
.mega-menu__clearance-li {
  width: 100%;
  min-width: 14rem;
  flex: 1 1 14rem;
  align-self: stretch;
}

.mega-menu__clearance-panel {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 17.5rem;
  border-radius: .25rem;
  overflow: hidden;
  background: linear-gradient(160deg, rgb(112 26 39) 0%, rgb(64 12 22) 100%);
}

.mega-menu__clearance-stretched-link {
  position: absolute;
  inset: 0;
  z-index: 1;
  text-decoration: none;
}

.mega-menu__clearance-content {
  position: relative;
  z-index: 2;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  height: 100%;
  padding: 1.375rem;
}

.mega-menu__clearance-eyebrow {
  color: rgb(179 141 84);
  font-size: .6875rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .625rem;
}

.mega-menu__clearance-title {
  font-family: Georgia, 'Times New Roman', serif;
  color: #fff;
  font-size: 1.4375rem;
  line-height: 1.2;
  margin-bottom: .625rem;
}

.mega-menu__clearance-rule {
  width: 1.75rem;
  height: 1px;
  background: rgb(179 141 84);
  opacity: .7;
  margin-bottom: .875rem;
}

.mega-menu__clearance-desc {
  color: rgb(255 255 255 / .82);
  font-size: .8125rem;
  line-height: 1.5;
  margin-bottom: 1.375rem;
}

.mega-menu__clearance-cta {
  align-self: flex-start;
  font-size: .78125rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  border: 1px solid rgb(255 255 255 / .55);
  padding: .6875rem 1.375rem;
  background: transparent;
}

.mega-menu__clearance-panel:hover .mega-menu__clearance-cta {
  background: rgb(255 255 255 / .1);
  border-color: #fff;
}

/* Mobile / sidebar drawer — scoped to the "Shop" sub-panel only, so it doesn't
   affect the top-level panel (where "Shop" itself is a button, not a link).
   Mobile stays a plain styled link, not a photo panel, by design. */
.header-sidebar__sub-panel .header-sidebar__linklist > li:first-child > a.header-sidebar__linklist-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgb(122 31 44);
  font-weight: 700;
  background: rgb(122 31 44 / .06);
  border-left: 3px solid rgb(122 31 44);
  border-radius: .25rem;
  padding-left: .75rem;
  padding-right: .75rem;
}

/* "Shop by Collection" mega-menu thumbnails — small circular photo crops next
   to each collection name, pulled from that collection's own image (so no
   separate image upload/maintenance needed; keeping it in sync with whatever
   photo is set on the collection in Shopify already). Scoped to the
   "Shop by Collection" column only via mega-menu.liquid's is_collection_column
   check, so "Shop by Size" keeps its plain text list. */
.mega-menu__collection-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .875rem 1.25rem;
}

.mega-menu__collection-link {
  display: flex !important;
  align-items: center;
  gap: .75rem;
  padding: .25rem;
  border-radius: .25rem;
}

.mega-menu__collection-link:hover {
  background: rgb(122 31 44 / .04);
}

.mega-menu__collection-thumb {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  flex-shrink: 0;
  border: 1.5px solid rgb(179 141 84);
  background-size: cover;
  background-position: center;
}

.mega-menu__collection-label {
  font-size: .84375rem;
  line-height: 1.25;
}

/* Desktop top nav (Shop / Home / About Us / Review / Journal / Contact Us) —
   switched from the theme's default heading font to Cormorant Garamond,
   sized up and given more letter-spacing/weight so it carries visual weight
   next to the logo card instead of reading as small body text. Scoped to
   .header__primary-nav-item only, so mobile sidebar and other headings
   elsewhere on the site (which use the theme's own heading font) are
   untouched. */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600&display=swap');

.header__primary-nav-item a,
.header__primary-nav-item summary {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
  font-size: 1.1875rem !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
}

.header__primary-nav-item + .header__primary-nav-item {
  margin-inline-start: .5rem;
}

/* 4th "Why Shop With Us" mega-menu column — hardcoded (not menu-driven, since
   it's not a real navigable link), scoped to the "Shop" menu only via
   mega-menu.liquid's link.title check. Reuses copy already used elsewhere on
   product pages (triple deep washed, hand-knotted, duty-free shipping) and
   the theme's own built-in picto icons, plus the same live store-review-badge
   snippet used elsewhere in this menu — nothing new to write or maintain. */
.mega-menu__trust-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mega-menu__trust-item {
  display: flex;
  align-items: flex-start;
  gap: .625rem;
}

.mega-menu__trust-item svg {
  flex-shrink: 0;
  color: rgb(122 31 44);
  margin-top: .125rem;
}

.mega-menu__trust-item span {
  font-size: .875rem;
  color: #3a332d;
  line-height: 1.35;
}

.mega-menu__trust-reviews {
  display: block;
  margin-top: 1rem;
}

.mega-menu__trust-reviews .smallcaps {
  font-size: .5625rem !important;
  letter-spacing: .04em !important;
  line-height: 1.3;
}

/* "Why Shop With Us" heading is a <span> (no link target), unlike the other
   column headers which are <a class="h6">. The theme's heading font/weight
   apparently doesn't fully apply to a bare span with just the .h6 class, so
   it renders lighter than "Shop by Size" / "Shop by Collection". Forcing the
   same heading font variables the theme uses elsewhere to match exactly. */
.mega-menu__linklist > li > span.h6 {
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
}