/** Shopify CDN: Minification failed

Line 221:8 Unexpected "{"
Line 221:17 Expected ":"

**/
/* ==========================================================================
   Custom Styles
   User-defined CSS overrides. This file is NOT generated by Tailwind.
   Place your custom styles here to keep them separate from theme.css.
   ========================================================================== */

/* ==========================================================================
   TYPOGRAPHY: Eyebrow / Labels / Navigation → 16px
   ========================================================================== */

/* --- Eyebrow (all sections) — 16px --- */
[class*="__eyebrow"],
[class*="__eyebrow-text"],
[class*="__phase"],
span[class*="__eyebrow"],
p[class*="__eyebrow"],
div[class*="__eyebrow"],
span[class*="__eyebrow-text"],
p[class*="__eyebrow-text"],
span[class*="__phase"] {
  font-size: 16px !important;
  line-height: 1.4 !important;
}

/* Direct overrides for every section's eyebrow class */
.about-visionary__eyebrow,
.split-banner__eyebrow,
.logo-list__eyebrow,
.inspiration-grid__eyebrow,
.step-guide__eyebrow,
.image-banner__eyebrow-text,
.curated-collection__eyebrow,
.scene-solutions__eyebrow,
.transparency-lab__eyebrow,
.store-provenance__eyebrow,
.featured-collection__eyebrow,
.before-after__eyebrow,
.push-banner__eyebrow,
/* image-with-text section uses __label for eyebrow */
.image-with-text__label,
[class*="__label"].text-accent {
  font-size: 16px !important;
  line-height: 1.4 !important;
}

/* --- Labels: product categories, tab buttons, badge text --- */
[class*="__category"],
[class*="__tab-button"],
[class*="__subtitle"],
[class*="__highlight-text"],
.featured-collection-tabs__tab-button,
.collection-icons__item-title {
  font-size: 1rem; /* 16px */
}

/* --- Navigation: desktop top nav --- */
.header__nav-list {
  font-size: 1rem; /* 16px */
}

/* --- Navigation: desktop dropdown links --- */
.desktop-menu__submenu-link,
.desktop-menu__submenu-sublink,
.desktop-menu__highlight-text {
  font-size: 1rem; /* 16px */
}

/* --- Navigation: mobile drawer --- */
.mobile-drawer__toggle,
.mobile-drawer__group-link,
.mobile-drawer__nested-toggle {
  font-size: 1rem; /* 16px */
}

/* ==========================================================================
   HOMEPAGE — Press logos section heading smaller
   ========================================================================== */

.logo-list__heading {
  font-size: 1.5rem !important; /* 24px on mobile */
  line-height: 1.3 !important;
}

@media (min-width: 768px) {
  .logo-list__heading {
    font-size: 2rem !important; /* 32px on desktop */
  }
}

/* ==========================================================================
   ADD TO CART BUTTON COLOR — #087C6D
   ========================================================================== */

.product-action-zone__add.button--primary,
.product-action-zone__add.button--secondary {
  background-color: #087C6D;
  border-color: #087C6D;
  color: #ffffff;
}

.product-action-zone__add.button--primary:hover,
.product-action-zone__add.button--primary:focus,
.product-action-zone__add.button--secondary:hover,
.product-action-zone__add.button--secondary:focus {
  background-color: #066358;
  border-color: #066358;
  color: #ffffff;
}

/* ==========================================================================
   CART — Sale / discounted price colour
   ========================================================================== */

.cart-item__sale-price {
  color: #AC1C15;
}

/* ==========================================================================
   CART DRAWER — Social proof bar background
   ========================================================================== */

.cart-drawer__social-proof {
  background-color: #EFF4EE;
}

/* ==========================================================================
   CART DRAWER — Social proof marquee animation
   ========================================================================== */

@keyframes cart-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.cart-drawer__social-proof-inner {
  animation: cart-marquee 22s linear infinite;
}

/* Cart PAGE — static on desktop, marquee only on mobile */
@media (min-width: 768px) {
  .cart-page .cart-drawer__social-proof-inner {
    animation: none;
    justify-content: center;
  }
}

/* ==========================================================================
   PDP — Price + Reviews on same line
   Pushes Shop Pay installments widget below the reviews badge
   ========================================================================== */

.product-price__installment {
  order: 10;
  flex-basis: 100%;
}

/* ==========================================================================
   COLLECTION PAGE — Product card tag label background
   ========================================================================== */

.product-card__tag {
  background-color: #D8E6E4;
  opacity: 1;
  padding: 0.25rem 0.625rem;
}

/* ==========================================================================
   PDP — Shop Pay installments: hide from between price/reviews,
   show below "More Payment Options" in the action zone
   ========================================================================== */

.product-price__installment {
  display: none !important;
}

.product-action-zone__installments .product-price__installment {
  display: block !important;
}

/* ==========================================================================
   PDP — Mobile: hide breadcrumbs + full-bleed image
   ========================================================================== */

@media (max-width: 767px) {
  /* Hide breadcrumbs */
  .main-product__breadcrumb {
    display: none !important;
  }

  /* Clip overflow from the breakout technique — use clip so position:fixed children (floating ATC) still work on iOS */
  .section-main-product {
    overflow-x: clip !important;
  }

  /* Break image out of the padded container — classic negative margin technique */
  .main-product__media-column {
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    width: 100vw !important;
    max-width: 100vw !important;
    transform: none !important;
  }
}

/* ==========================================================================
   PDP — Price size (Figma: 16px, weight 300, -0.04em, #2C2825)
   High specificity with element + class to beat theme overrides
   ========================================================================== */

.product-price .product-price__current,
.product-price .product-price__current *,
#Price-{{ section.id }} .product-price__current,
div.product-price .product-price__current {
  font-size: 16px !important;
  font-weight: 300 !important;
  letter-spacing: -0.04em !important;
  line-height: 21px !important;
  color: #2C2825 !important;
}

/* Compare-at / strikethrough price */
.product-price .product-price__compare {
  font-size: 14px !important;
  font-weight: 300 !important;
  letter-spacing: -0.04em !important;
}

/* Sale price — dark red when on sale */
.product-price .product-price__current--sale,
.product-price .product-price__current--sale *,
div.product-price .product-price__current--sale {
  color: #AC1C15 !important;
}

/* ==========================================================================
   PDP — Title → Price row gap (Figma: 1px between title and price row)
   ========================================================================== */

.main-product__details .product-title + .product-price-row,
.product-title + .product-price-row {
  margin-top: 2px !important;
}

/* Remove any bottom margin on title that adds to the gap */
.main-product__details .product-title {
  margin-bottom: 0 !important;
}

/* ==========================================================================
   PDP — Accordions: full width, no extra padding — align with Try Risk-Free section
   ========================================================================== */

/* ==========================================================================
   PDP — Right column sticky: ensure sticky holds through the full image gallery scroll.
   The details-column must NOT stretch to flex parent height — it should only
   be as tall as the image gallery (left column). The inner sticky div handles
   its own sticking within that container.
   ========================================================================== */

@media (min-width: 768px) {
  .main-product__details-column {
    align-self: flex-start;
    position: sticky;
    top: 128px;
  }
  /* Inner div no longer needs its own sticky — column handles it */
  .main-product__details {
    position: static !important;
  }
}

/* ==========================================================================
   PDP — Product subtitle (Figma: 14px, weight 400, line-height 18px, #2C2825)
   ========================================================================== */

.product-subtitle {
  font-size: 14px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  color: #2C2825 !important;
  opacity: 1 !important;
}

/* ==========================================================================
   PDP — Free shipping bar text → red (#E50000)
   ========================================================================== */

[data-free-shipping-bar] span,
.product-action-zone__free-shipping span {
  color: #E50000 !important;
  font-weight: 500 !important;
}

/* ==========================================================================
   PDP — Judge.me preview badge (Figma spec)
   ========================================================================== */

/* Stars — gold */
.jdgm-prev-badge .jdgm-star,
.jdgm-prev-badge__stars {
  font-size: 13px !important;
  color: #C9A876 !important;
  letter-spacing: -0.04em !important;
  line-height: 17px !important;
}

/* Review count — gold to match stars (client request) */
/* Judge.me uses .jdgm-prev-badge__text for the "X reviews" span */
.jdgm-prev-badge__count,
.jdgm-prev-badge__count a,
.jdgm-prev-badge__count a:visited,
.jdgm-prev-badge__count a:hover,
.jdgm-prev-badge__text,
.jdgm-prev-badge__text a,
.jdgm-prev-badge__text a:visited,
.jdgm-prev-badge__text a:hover {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #C9A876 !important;
  letter-spacing: -0.04em !important;
  line-height: 16px !important;
  text-decoration: none !important;
}

/* Badge container alignment */
.jdgm-prev-badge {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

/* ==========================================================================
   PDP — TRY RISK-FREE block (Figma spec)
   ========================================================================== */

.product-action-zone__guarantee {
  background: rgba(201, 168, 118, 0.07) !important;
  border: 0.2px solid #D9D9D9 !important;
  border-radius: 0 !important;
}

.product-action-zone__guarantee-title {
  font-family: 'Newsreader', serif !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  line-height: 12px !important;
  letter-spacing: -0.03em !important;
  text-transform: none !important;
  color: #2C2825 !important;
}

.product-action-zone__guarantee-text {
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 13px !important;
  letter-spacing: -0.02em !important;
  color: #2C2825 !important;
  opacity: 1 !important;
}

/* ==========================================================================
   Cart — Free shipping bar turns green when unlocked
   ========================================================================== */

free-shipping-progress.free-has-unlocked .cart-drawer__progress-fill {
  background-color: rgb(var(--color-success)) !important;
}

/* ==========================================================================
   PDP — Appstle subscription price: reorder + style
   When subscribe is selected, Appstle prepends its price div BEFORE our
   theme price div (which it marks with data-appstle-price-modified + strikes
   through). We use CSS flex order to put the struck price first and the
   subscription price second (larger, right-hand side).

   Result: ~~£29.99 £24.49~~ → £22.04 → [SAVE 10%] → reviews
   ========================================================================== */

/* 1. Struck theme price — first */
.product-price-row [data-appstle-price-modified] {
  order: 1;
}

/* 1b. Hide the regular variant price when subscribe is active — toggled by JS inline style */

/* 2. Appstle subscription price — second, larger than struck price */
.product-price-row .appstle_subscription_final_price {
  order: 2;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: #AC1C15 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.2 !important;
}

/* 3. SAVE badge — third */
.product-price-row .appstle_subscription_save,
.product-price-row .appstle_subscription_element {
  order: 3;
}

/* 4. Reviews badge — stays last */
.product-price-row > [id^="shopify-block"] {
  order: 10;
}

/* ==========================================================================
   PDP — Product Benefits block: responsive font sizes
   Figma spec: title 12px weight 600 / items 12px weight 400 (both mobile + desktop)
   ========================================================================== */

.product-benefits__title {
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: -0.03em;
}

.product-benefits__text {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.02em;
}
