/** Shopify CDN: Minification failed

Line 48:9 Expected identifier but found whitespace
Line 48:11 Unexpected "{"
Line 48:20 Expected ":"
Line 48:49 Expected ":"
Line 123:12 Expected identifier but found whitespace
Line 123:14 Unexpected "{"
Line 123:23 Expected ":"
Line 123:50 Expected ":"
Line 742:11 Expected identifier but found whitespace
Line 742:13 Unexpected "{"
... and 6 more hidden warnings

**/
/* =========================================================
   ZAETH ESSENTIAL SHOWCASE
   CLEAN / PREMIUM / RESPONSIVE
   ========================================================= */

.zaeth-essential-showcase {
  --zes-bg: #050505;
  --zes-white: #f2f0eb;
  --zes-muted: #8d8d8d;
  --zes-line: rgba(255,255,255,.16);
  --zes-red: #8f1518;

  position: relative;
  width: 100%;
  background: var(--zes-bg);
  color: var(--zes-white);

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden;
}


/* =========================================================
   HERO
   ========================================================= */

.zaeth-essential-showcase .zes-hero {
  position: relative;

  width: 100%;
  height: {{ section.settings.desktop_height }}px;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden;

  display: grid;
  grid-template-columns: 48% 52%;
}


/* =========================================================
   LEFT CONTENT
   ========================================================= */

.zaeth-essential-showcase .zes-hero-copy {
  position: relative;
  z-index: 5;

  height: 100%;

  padding:
    clamp(50px, 7vw, 105px)
    clamp(30px, 4vw, 70px)
    40px
    clamp(30px, 4vw, 70px);

  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  background: #050505;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.zaeth-essential-showcase .zes-eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;

  margin: 0 0 38px;

  font-size: 11px;
  line-height: 1;
  letter-spacing: .28em;
  text-transform: uppercase;

  color: #a8a8a8;
}

.zaeth-essential-showcase .zes-eyebrow-line {
  width: 28px;
  height: 1px;

  background: var(--zes-red);

  flex: 0 0 auto;
}


/* =========================================================
   HEADING
   ========================================================= */

.zaeth-essential-showcase .zes-heading {
  margin: 0;

  max-width: 700px;

  font-size: {{ section.settings.heading_size }}px;
  line-height: .88;

  letter-spacing: -.045em;
  font-weight: 800;

  color: var(--zes-white);

  text-transform: uppercase;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.zaeth-essential-showcase .zes-description {
  margin-top: 28px;

  max-width: 590px;

  white-space: pre-line;

  font-size: 13px;
  line-height: 2.05;

  letter-spacing: .22em;

  color: #858585;
}


/* =========================================================
   EXPLORE
   ========================================================= */

.zaeth-essential-showcase .zes-explore {
  display: inline-flex;
  align-items: center;
  gap: 24px;

  width: max-content;

  margin-top: 38px;
  padding-bottom: 11px;

  border-bottom: 1px solid rgba(255,255,255,.45);

  color: var(--zes-white);
  text-decoration: none;

  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;

  transition:
    gap .35s ease,
    opacity .35s ease;
}

.zaeth-essential-showcase .zes-explore:hover {
  gap: 32px;
  opacity: .7;
}

.zaeth-essential-showcase .zes-arrow {
  font-size: 20px;
  line-height: 1;
}


/* =========================================================
   ACTIVE PRODUCT
   ========================================================= */

.zaeth-essential-showcase .zes-product-information {
  margin-top: auto;

  padding-top: 38px;
}


.zaeth-essential-showcase .zes-product-number {
  display: flex;
  align-items: center;
  gap: 12px;

  margin-bottom: 18px;

  color: #a90000;

  font-size: 13px;
  letter-spacing: .2em;
}

.zaeth-essential-showcase .zes-number-line {
  width: 30px;
  height: 1px;

  background: #a90000;
}


.zaeth-essential-showcase .zes-active-title {
  margin: 0 0 8px;

  font-size: 25px;
  line-height: 1.1;

  font-weight: 500;

  letter-spacing: .02em;
}


.zaeth-essential-showcase .zes-active-details {
  font-size: 11px;
  letter-spacing: .2em;

  color: #969696;
}


.zaeth-essential-showcase .zes-active-price {
  margin-top: 18px;

  font-size: 28px;
  line-height: 1;

  letter-spacing: .02em;
}


.zaeth-essential-showcase .zes-view-piece {
  display: inline-flex;
  align-items: center;
  gap: 18px;

  margin-top: 26px;
  padding-bottom: 10px;

  border-bottom: 1px solid rgba(255,255,255,.38);

  color: white;
  text-decoration: none;

  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;

  transition: gap .3s ease;
}

.zaeth-essential-showcase .zes-view-piece:hover {
  gap: 28px;
}


/* =========================================================
   HERO IMAGE
   IMPORTANT:
   Image is now contained INSIDE the hero visual.
   No bottom positioning.
   No giant empty area.
   ========================================================= */

.zaeth-essential-showcase .zes-hero-visual {
  position: relative;

  width: 100%;
  height: 100%;

  min-height: 0 !important;

  overflow: hidden;

  background: #080808;
}


.zaeth-essential-showcase .zes-main-hero-image {
  position: absolute;

  inset: 0;

  display: block;

  width: 100%;
  height: 100%;

  max-width: none !important;

  object-fit: cover;

  /*
    Slightly favor the upper/center part of the image.
    This prevents the model head from being pushed
    outside the desktop frame.
  */
  object-position: center 32%;

  transform:
    scale(calc({{ section.settings.desktop_image_scale }} / 100));

  transform-origin: center center;

  transition: transform .8s cubic-bezier(.22,.61,.36,1);

  will-change: transform;
}


/* Placeholder */

.zaeth-essential-showcase .zes-image-placeholder {
  position: absolute;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #111;

  color: #555;

  font-size: 10px;
  letter-spacing: .3em;
}


/* =========================================================
   COUNTER
   ========================================================= */

.zaeth-essential-showcase .zes-counter {
  position: absolute;

  right: 24px;
  top: 50%;

  z-index: 10;

  transform: translateY(-50%);

  display: flex;
  flex-direction: column;
  align-items: center;

  gap: 16px;

  font-size: 10px;
  letter-spacing: .16em;

  color: #9a9a9a;
}

.zaeth-essential-showcase .zes-counter-current {
  color: white;
}

.zaeth-essential-showcase .zes-counter-line {
  width: 1px;
  height: 78px;

  background: rgba(255,255,255,.5);
}


/* =========================================================
   PRODUCT AREA
   ========================================================= */

.zaeth-essential-showcase .zes-products {
  position: relative;

  display: grid;

  grid-template-columns: 145px minmax(0,1fr);

  width: 100%;

  margin: 0 !important;
  padding: 16px 30px 24px !important;

  border-top: 1px solid rgba(255,255,255,.15);

  background: #050505;
}


/* =========================================================
   PRODUCTS INTRO
   ========================================================= */

.zaeth-essential-showcase .zes-products-intro {
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  padding: 42px 20px 8px 18px;
}


.zaeth-essential-showcase .zes-intro-text {
  white-space: pre-line;

  font-size: 11px;
  line-height: 2;

  letter-spacing: .25em;

  color: #8d8d8d;
}


/* =========================================================
   CONTROLS
   ========================================================= */

.zaeth-essential-showcase .zes-controls {
  display: flex;
  gap: 10px;
}


.zaeth-essential-showcase .zes-control {
  width: 38px;
  height: 34px;

  padding: 0;

  border: 1px solid rgba(255,255,255,.2);

  background: transparent;

  color: white;

  cursor: pointer;

  font-size: 16px;

  transition:
    background .25s ease,
    color .25s ease,
    border-color .25s ease;
}

.zaeth-essential-showcase .zes-control:hover {
  background: white;
  color: black;
  border-color: white;
}


/* =========================================================
   PRODUCT TRACK
   ========================================================= */

.zaeth-essential-showcase .zes-product-track {
  display: grid;

  grid-template-columns: repeat(6, minmax(0,1fr));

  gap: 18px;

  min-width: 0;

  align-items: start;
}


/* =========================================================
   PRODUCT CARD
   ========================================================= */

.zaeth-essential-showcase .zes-product-card {
  position: relative;

  min-width: 0;

  padding: 0;

  border: 0;

  background: transparent;

  color: white;

  text-align: left;

  cursor: pointer;

  appearance: none;

  transition: opacity .3s ease;
}

.zaeth-essential-showcase .zes-product-card:not(.is-active) {
  opacity: .82;
}

.zaeth-essential-showcase .zes-product-card:hover,
.zaeth-essential-showcase .zes-product-card.is-active {
  opacity: 1;
}


/* =========================================================
   CARD IMAGE
   ========================================================= */

.zaeth-essential-showcase .zes-card-image {
  position: relative;

  width: 100%;

  aspect-ratio: .72;

  overflow: hidden;

  background: #101010;
}


.zaeth-essential-showcase .zes-card-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform .45s ease;
}

.zaeth-essential-showcase .zes-product-card:hover .zes-card-image img {
  transform: scale(1.025);
}


.zaeth-essential-showcase .zes-card-number {
  position: absolute;

  top: 14px;
  left: 14px;

  z-index: 2;

  font-size: 10px;
  letter-spacing: .18em;

  color: #ddd;
}


.zaeth-essential-showcase .zes-card-placeholder {
  width: 100%;
  height: 100%;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #444;

  font-size: 9px;
  letter-spacing: .2em;
}


/* =========================================================
   ACTIVE CARD
   Clean premium indicator instead of ugly outline
   ========================================================= */

.zaeth-essential-showcase .zes-product-card.is-active .zes-card-image::after {
  content: "";

  position: absolute;

  inset: 0;

  border: 1px solid rgba(255,255,255,.55);

  pointer-events: none;
}


/* =========================================================
   CARD CONTENT
   ========================================================= */

.zaeth-essential-showcase .zes-card-content {
  padding-top: 13px;
}


.zaeth-essential-showcase .zes-card-name {
  font-size: 11px;
  line-height: 1.25;

  letter-spacing: .12em;

  color: #f0f0f0;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.zaeth-essential-showcase .zes-card-details {
  margin-top: 6px;

  font-size: 9px;

  letter-spacing: .16em;

  color: #747474;
}


.zaeth-essential-showcase .zes-card-price {
  margin-top: 9px;

  font-size: 11px;

  color: #ddd;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media screen and (min-width: 1100px) {

  .zaeth-essential-showcase .zes-main-hero-image {
    /*
      Keep the image visually high enough that the
      model's head does not disappear.
    */
    object-position: center 28%;
  }

}


/* =========================================================
   TABLET
   ========================================================= */

@media screen and (min-width: 750px) and (max-width: 1099px) {

  .zaeth-essential-showcase .zes-hero {
    height: 600px;
    grid-template-columns: 48% 52%;
  }

  .zaeth-essential-showcase .zes-hero-copy {
    padding:
      55px
      35px
      30px;
  }

  .zaeth-essential-showcase .zes-heading {
    font-size: 58px;
  }

  .zaeth-essential-showcase .zes-product-track {
    grid-template-columns: repeat(3, minmax(0,1fr));
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 749px) {

  .zaeth-essential-showcase {
    overflow: hidden;
  }


  .zaeth-essential-showcase .zes-hero {

    /*
      IMPORTANT:
      No 100vh.
      No min-height.
      No artificial vertical gap.
    */

    height: auto !important;
    min-height: 0 !important;

    display: flex;
    flex-direction: column;

    margin: 0 !important;
    padding: 0 !important;
  }


  /*
    Image FIRST on mobile.
  */

  .zaeth-essential-showcase .zes-hero-visual {

    order: 1;

    width: 100%;

    height: {{ section.settings.mobile_height }}px;

    min-height: 0 !important;

    flex: none;

    background: #070707;
  }


  .zaeth-essential-showcase .zes-main-hero-image {

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center center;

    transform: scale(1.04);

  }


  /*
    Text BELOW image.
  */

  .zaeth-essential-showcase .zes-hero-copy {

    order: 2;

    height: auto;

    padding:
      42px
      20px
      38px;

    background: #050505;
  }


  .zaeth-essential-showcase .zes-eyebrow {

    margin-bottom: 24px;

    font-size: 9px;
  }


  .zaeth-essential-showcase .zes-heading {

    max-width: 100%;

    font-size: {{ section.settings.mobile_heading_size }}px;

    line-height: .9;

    letter-spacing: -.04em;
  }


  .zaeth-essential-showcase .zes-description {

    margin-top: 22px;

    font-size: 10px;

    line-height: 1.9;

    letter-spacing: .17em;
  }


  .zaeth-essential-showcase .zes-explore {

    margin-top: 28px;
  }


  .zaeth-essential-showcase .zes-product-information {

    margin-top: 45px;

    padding-top: 0;
  }


  .zaeth-essential-showcase .zes-active-title {

    font-size: 20px;
  }


  .zaeth-essential-showcase .zes-active-price {

    font-size: 24px;
  }


  /*
    Counter stays on image.
  */

  .zaeth-essential-showcase .zes-counter {

    top: auto;
    right: 16px;
    bottom: 20px;

    transform: none;

    gap: 10px;

    z-index: 20;
  }


  .zaeth-essential-showcase .zes-counter-line {

    height: 55px;
  }


  /*
    Product area.
  */

  .zaeth-essential-showcase .zes-products {

    display: block;

    padding:
      38px
      20px
      36px !important;

    border-top: 1px solid rgba(255,255,255,.12);
  }


  .zaeth-essential-showcase .zes-products-intro {

    padding: 0 0 28px;

    display: flex;

    flex-direction: row;

    align-items: flex-end;

    justify-content: space-between;
  }


  .zaeth-essential-showcase .zes-intro-text {

    font-size: 9px;

    line-height: 1.9;
  }


  .zaeth-essential-showcase .zes-controls {

    gap: 7px;
  }


  /*
    No big outlined boxes on mobile.
  */

  .zaeth-essential-showcase .zes-control {

    width: 34px;
    height: 30px;

    border: 0;

    border-bottom: 1px solid rgba(255,255,255,.35);
  }


  .zaeth-essential-showcase .zes-product-track {

    display: flex;

    gap: 12px;

    overflow-x: auto;

    overscroll-behavior-x: contain;

    scroll-snap-type: x mandatory;

    scrollbar-width: none;

    padding: 0 0 4px;
  }

  .zaeth-essential-showcase .zes-product-track::-webkit-scrollbar {
    display: none;
  }


  .zaeth-essential-showcase .zes-product-card {

    flex: 0 0 64%;

    scroll-snap-align: start;
  }


  /*
    Remove ugly desktop outline.
  */

  .zaeth-essential-showcase .zes-product-card.is-active .zes-card-image::after {

    border: 0;

    border-bottom: 1px solid rgba(255,255,255,.5);
  }


  .zaeth-essential-showcase .zes-card-image {

    aspect-ratio: .73;
  }


  .zaeth-essential-showcase .zes-card-name {

    font-size: 10px;
  }


  .zaeth-essential-showcase .zes-card-details {

    font-size: 8px;
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .zaeth-essential-showcase *,
  .zaeth-essential-showcase *::before,
  .zaeth-essential-showcase *::after {

    transition: none !important;

    scroll-behavior: auto !important;
  }

}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE — REMOVE TOP BLACK VOID
   ========================================================= */

.zaeth-essential-showcase,
.zaeth-essential-showcase * {
  box-sizing: border-box;
}

.zaeth-essential-showcase {
  margin-top: 0 !important;
  padding-top: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

/* Kill artificial spacing / ratio containers */
.zaeth-essential-showcase .hero,
.zaeth-essential-showcase .hero-inner,
.zaeth-essential-showcase .hero-content,
.zaeth-essential-showcase .showcase-hero,
.zaeth-essential-showcase .showcase-hero-inner,
.zaeth-essential-showcase .hero-media,
.zaeth-essential-showcase .hero-image-wrap,
.zaeth-essential-showcase .main-hero,
.zaeth-essential-showcase .main-hero-image {
  margin-top: 0 !important;
  padding-top: 0 !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

/* The actual hero area */
.zaeth-essential-showcase .showcase-hero,
.zaeth-essential-showcase .hero,
.zaeth-essential-showcase .main-hero {
  position: relative !important;
  overflow: hidden !important;
}

/* Image must begin at the top */
.zaeth-essential-showcase .hero-media,
.zaeth-essential-showcase .hero-image-wrap,
.zaeth-essential-showcase .main-hero-image {
  position: relative !important;
  top: 0 !important;
  transform: none !important;
  margin: 0 !important;
}

/* Actual image */
.zaeth-essential-showcase .hero-media img,
.zaeth-essential-showcase .hero-image-wrap img,
.zaeth-essential-showcase .main-hero-image img {
  display: block !important;
  position: relative !important;
  top: 0 !important;
  margin: 0 !important;
  transform: none !important;
}

/* Remove empty pseudo-element spacing */
.zaeth-essential-showcase .showcase-hero::before,
.zaeth-essential-showcase .showcase-hero::after,
.zaeth-essential-showcase .hero::before,
.zaeth-essential-showcase .hero::after,
.zaeth-essential-showcase .hero-media::before,
.zaeth-essential-showcase .hero-media::after {
  display: none !important;
  content: none !important;
}

/* Desktop */
@media screen and (min-width: 750px) {

  .zaeth-essential-showcase {
    padding-top: 0 !important;
  }

  .zaeth-essential-showcase .showcase-hero,
  .zaeth-essential-showcase .hero,
  .zaeth-essential-showcase .main-hero {
    min-height: 0 !important;
    height: 680px !important;
  }

  .zaeth-essential-showcase .hero-media,
  .zaeth-essential-showcase .hero-image-wrap,
  .zaeth-essential-showcase .main-hero-image {
    height: 680px !important;
  }

  .zaeth-essential-showcase .hero-media img,
  .zaeth-essential-showcase .hero-image-wrap img,
  .zaeth-essential-showcase .main-hero-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }
}

/* Mobile */
@media screen and (max-width: 749px) {

  .zaeth-essential-showcase {
    padding-top: 0 !important;
  }

  .zaeth-essential-showcase .showcase-hero,
  .zaeth-essential-showcase .hero,
  .zaeth-essential-showcase .main-hero {
    min-height: 0 !important;
    height: auto !important;
  }

  .zaeth-essential-showcase .hero-media,
  .zaeth-essential-showcase .hero-image-wrap,
  .zaeth-essential-showcase .main-hero-image {
    height: auto !important;
  }

  .zaeth-essential-showcase .hero-media img,
  .zaeth-essential-showcase .hero-image-wrap img,
  .zaeth-essential-showcase .main-hero-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    object-position: center top !important;
  }
}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE
   FINAL HERO POSITION / BLACK BAR FIX
   ========================================================= */

/* REMOVE OUTER SECTION SPACE */
.section-zaeth-essential-showcase,
.shopify-section:has(.zaeth-essential-showcase) {
  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================================
   HERO
   ========================================================= */

.zaeth-essential-showcase {
  display: block !important;
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  background: #050607 !important;
}


.zaeth-essential-showcase .zes-hero {
  position: relative !important;

  width: 100% !important;
  height: 660px !important;
  min-height: 660px !important;
  max-height: 660px !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;
}


/* =========================================================
   HERO IMAGE CONTAINER
   ========================================================= */

.zaeth-essential-showcase .zes-hero-visual {
  position: absolute !important;

  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;

  width: 63% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;

  z-index: 1 !important;
}


/* =========================================================
   HERO IMAGE
   ========================================================= */

.zaeth-essential-showcase .zes-main-hero-image {
  position: absolute !important;

  display: block !important;

  top: 0 !important;
  left: 0 !important;

  width: 100% !important;
  height: 100% !important;

  min-width: 100% !important;
  min-height: 100% !important;

  max-width: none !important;
  max-height: none !important;

  margin: 0 !important;
  padding: 0 !important;

  object-fit: cover !important;

  /*
    THIS controls the model position.
    50% = horizontal center
    50% = vertical center
  */
  object-position: 50% 50% !important;

  transform: none !important;

  z-index: 1 !important;
}


/* =========================================================
   LEFT CONTENT
   ========================================================= */

.zaeth-essential-showcase .zes-hero-copy {
  position: absolute !important;

  top: 50% !important;
  left: 3.5% !important;

  transform: translateY(-50%) !important;

  margin: 0 !important;
  padding: 0 !important;

  z-index: 5 !important;
}


/* =========================================================
   COUNTER
   ========================================================= */

.zaeth-essential-showcase .zes-counter {
  position: absolute !important;

  top: 50% !important;
  right: 2.5% !important;

  transform: translateY(-50%) !important;

  z-index: 6 !important;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media screen and (min-width: 990px) {

  .zaeth-essential-showcase .zes-hero {
    height: 660px !important;
    min-height: 660px !important;
    max-height: 660px !important;
  }

  .zaeth-essential-showcase .zes-hero-visual {
    top: 0 !important;
    bottom: 0 !important;

    width: 63% !important;
    height: 100% !important;
  }

  .zaeth-essential-showcase .zes-main-hero-image {
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;

    object-position: 50% 50% !important;
  }

}


/* =========================================================
   LARGE DESKTOP
   ========================================================= */

@media screen and (min-width: 1400px) {

  .zaeth-essential-showcase .zes-hero {
    height: 700px !important;
    min-height: 700px !important;
    max-height: 700px !important;
  }

  .zaeth-essential-showcase .zes-hero-visual {
    width: 64% !important;
  }

  .zaeth-essential-showcase .zes-main-hero-image {
    object-position: 50% 50% !important;
  }

}


/* =========================================================
   TABLET
   ========================================================= */

@media screen and (min-width: 750px) and (max-width: 989px) {

  .zaeth-essential-showcase .zes-hero {
    height: 600px !important;
    min-height: 600px !important;
    max-height: 600px !important;
  }

  .zaeth-essential-showcase .zes-hero-visual {
    width: 60% !important;
  }

  .zaeth-essential-showcase .zes-main-hero-image {
    object-position: 50% 50% !important;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 749px) {

  .zaeth-essential-showcase .zes-hero {
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;

    margin: 0 !important;
    padding: 0 !important;
  }

  .zaeth-essential-showcase .zes-hero-visual {
    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
  }

  .zaeth-essential-showcase .zes-main-hero-image {
    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
    object-position: 50% 50% !important;
  }

}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE — MOBILE TEXT OVERLAY FIX
   Makes the text area transparent instead of a heavy block
   ========================================================= */

@media (max-width: 749px) {

  .zaeth-essential-showcase .zes-hero {
    position: relative !important;
    overflow: hidden !important;
    background: #050505 !important;
  }

  /* Keep the model visible behind the text */
  .zaeth-essential-showcase .zes-hero-visual {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }

  .zaeth-essential-showcase .zes-main-hero-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
  }

  /* TEXT — remove the ugly solid black box */
  .zaeth-essential-showcase .zes-hero-copy {
    position: relative !important;
    z-index: 3 !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  /* Very subtle readability gradient only behind text */
  .zaeth-essential-showcase .zes-hero-copy::before {
    content: "" !important;
    position: absolute !important;
    z-index: -1 !important;
    inset: -20px -20px -20px -20px !important;
    background: linear-gradient(
      90deg,
      rgba(0,0,0,.72) 0%,
      rgba(0,0,0,.48) 45%,
      rgba(0,0,0,.12) 78%,
      rgba(0,0,0,0) 100%
    ) !important;
    pointer-events: none !important;
  }

  /* Remove any solid backgrounds from inner text elements */
  .zaeth-essential-showcase .zes-eyebrow,
  .zaeth-essential-showcase .zes-heading,
  .zaeth-essential-showcase .zes-description,
  .zaeth-essential-showcase .zes-explore,
  .zaeth-essential-showcase .zes-product-information {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }

  /* Product information should NOT create another black rectangle */
  .zaeth-essential-showcase .zes-product-information {
    position: relative !important;
    z-index: 4 !important;
  }

  /* Keep the image behind everything */
  .zaeth-essential-showcase .zes-counter {
    position: absolute !important;
    z-index: 5 !important;
  }
}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE — MOBILE HERO FIX
   Larger hero + better model visibility + lighter text layer
   ========================================================= */

@media screen and (max-width: 749px) {

  /* Make the entire hero taller so the model has room */
  .zaeth-essential-showcase .zes-hero {
    position: relative !important;
    min-height: 820px !important;
    height: 820px !important;
    overflow: hidden !important;
    background: #050505 !important;
  }

  /* -------------------------------------------------------
     HERO IMAGE
     ------------------------------------------------------- */

  .zaeth-essential-showcase .zes-hero-visual {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
    overflow: hidden !important;
    display: block !important;
  }

  .zaeth-essential-showcase .zes-main-hero-image {
    position: absolute !important;

    /* Give the model much more vertical room */
    width: 100% !important;
    height: 100% !important;

    /* Prevent the image from being distorted */
    object-fit: cover !important;

    /* Keep the model centered and show more of the body */
    object-position: center center !important;

    display: block !important;

    /* Slightly enlarge the image */
    transform: scale(1.03) !important;
    transform-origin: center center !important;
  }


  /* -------------------------------------------------------
     TEXT / CONTENT LAYER
     ------------------------------------------------------- */

  .zaeth-essential-showcase .zes-hero-copy {
    position: relative !important;
    z-index: 5 !important;

    width: 100% !important;
    min-height: 820px !important;
    height: 820px !important;

    /* IMPORTANT:
       Remove the heavy black rectangle */
    background: transparent !important;

    /* No solid background */
    box-shadow: none !important;
  }


  /* Make the copy itself readable without creating a giant
     black block over the model */
  .zaeth-essential-showcase .zes-hero-copy::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;

    background:
      linear-gradient(
        to bottom,
        rgba(0,0,0,0.48) 0%,
        rgba(0,0,0,0.28) 30%,
        rgba(0,0,0,0.12) 55%,
        rgba(0,0,0,0.18) 100%
      ) !important;

    pointer-events: none !important;
  }


  /* -------------------------------------------------------
     COPY SPACING
     ------------------------------------------------------- */

  .zaeth-essential-showcase .zes-hero-copy {
    padding: 72px 20px 42px !important;
  }


  /* Keep heading clean */
  .zaeth-essential-showcase .zes-heading {
    position: relative !important;
    z-index: 6 !important;
    margin-top: 28px !important;
  }


  /* Description */
  .zaeth-essential-showcase .zes-description {
    position: relative !important;
    z-index: 6 !important;
  }


  /* Explore */
  .zaeth-essential-showcase .zes-explore {
    position: relative !important;
    z-index: 6 !important;
  }


  /* Product information */
  .zaeth-essential-showcase .zes-product-information {
    position: absolute !important;
    left: 20px !important;
    right: 20px !important;
    bottom: 38px !important;

    z-index: 7 !important;

    /* No rectangle */
    background: transparent !important;
    box-shadow: none !important;
  }


  /* -------------------------------------------------------
     COUNTER
     ------------------------------------------------------- */

  .zaeth-essential-showcase .zes-counter {
    position: absolute !important;
    right: 20px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    z-index: 8 !important;
  }


  /* -------------------------------------------------------
     PRODUCT STRIP
     ------------------------------------------------------- */

  .zaeth-essential-showcase .zes-products {
    position: relative !important;
    z-index: 10 !important;

    margin-top: 0 !important;
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE
   DESKTOP — FULL MODEL / NO HEAD CROP
   ========================================================= */

@media screen and (min-width: 750px) {

  /* HERO */
  .zaeth-essential-showcase .zes-hero {
    position: relative !important;
    overflow: hidden !important;
  }

  /* IMAGE AREA */
  .zaeth-essential-showcase .zes-hero-visual {
    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    width: 58% !important;
    height: 100% !important;

    overflow: hidden !important;

    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;

    z-index: 1 !important;
  }

  /* MAIN IMAGE
     IMPORTANT: DO NOT USE COVER */
  .zaeth-essential-showcase .zes-main-hero-image {
    display: block !important;

    height: 100% !important;
    width: auto !important;

    max-width: none !important;
    max-height: 100% !important;

    object-fit: contain !important;
    object-position: center top !important;

    transform: none !important;

    margin: 0 !important;
    padding: 0 !important;
  }

  /* Keep text above image */
  .zaeth-essential-showcase .zes-hero-copy {
    position: relative !important;
    z-index: 5 !important;
  }

  /* Counter above image */
  .zaeth-essential-showcase .zes-counter {
    position: absolute !important;
    z-index: 6 !important;
  }

}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE — TEXT READABILITY BOOST
   ========================================================= */

/* Main description */
.zaeth-essential-showcase .zes-description {
  font-size: 16px !important;
  line-height: 1.7 !important;
}

/* Eyebrow / small label */
.zaeth-essential-showcase .zes-eyebrow {
  font-size: 13px !important;
  line-height: 1.4 !important;
}

/* Active product title */
.zaeth-essential-showcase .zes-active-title {
  font-size: 19px !important;
  line-height: 1.15 !important;
}

/* Active product details */
.zaeth-essential-showcase .zes-active-details {
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Active product price */
.zaeth-essential-showcase .zes-active-price {
  font-size: 23px !important;
}

/* Explore / View links */
.zaeth-essential-showcase .zes-explore,
.zaeth-essential-showcase .zes-view-piece {
  font-size: 14px !important;
}

/* Product card names */
.zaeth-essential-showcase .zes-card-name {
  font-size: 16px !important;
}

/* Product card details */
.zaeth-essential-showcase .zes-card-details {
  font-size: 12px !important;
  line-height: 1.45 !important;
}

/* Product card prices */
.zaeth-essential-showcase .zes-card-price {
  font-size: 16px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 749px) {

  .zaeth-essential-showcase .zes-description {
    font-size: 15px !important;
    line-height: 1.65 !important;
  }

  .zaeth-essential-showcase .zes-eyebrow {
    font-size: 11px !important;
  }

  .zaeth-essential-showcase .zes-active-title {
    font-size: 18px !important;
  }

  .zaeth-essential-showcase .zes-active-details {
    font-size: 12px !important;
  }

  .zaeth-essential-showcase .zes-active-price {
    font-size: 22px !important;
  }

  .zaeth-essential-showcase .zes-explore,
  .zaeth-essential-showcase .zes-view-piece {
    font-size: 13px !important;
  }

  .zaeth-essential-showcase .zes-card-name {
    font-size: 15px !important;
  }

  .zaeth-essential-showcase .zes-card-details {
    font-size: 11px !important;
  }

  .zaeth-essential-showcase .zes-card-price {
    font-size: 15px !important;
  }

}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE — BOLD EDITORIAL HEADING
   ========================================================= */

.zaeth-essential-showcase .zes-heading {
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  line-height: 0.88 !important;
  text-transform: uppercase !important;
}


/* MOBILE */
@media screen and (max-width: 749px) {

  .zaeth-essential-showcase .zes-heading {
    font-weight: 900 !important;
    letter-spacing: 0.02em !important;
    line-height: 0.88 !important;
    text-transform: uppercase !important;
  }

}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE
   FORCE CLEAN BOLD HEADING
   ========================================================= */

section.zaeth-essential-showcase .zes-heading,
.zaeth-essential-showcase .zes-heading {
  display: block !important;

  font-weight: 900 !important;
  font-style: normal !important;
  font-family: inherit !important;

  font-size: 82px !important;
  line-height: 0.9 !important;
  letter-spacing: 0.02em !important;

  transform: none !important;
  opacity: 1 !important;

  text-shadow: none !important;
  filter: none !important;

  position: relative !important;
  z-index: 10 !important;

  white-space: normal !important;
}

/* Remove any duplicate generated text */
section.zaeth-essential-showcase .zes-heading::before,
section.zaeth-essential-showcase .zes-heading::after,
.zaeth-essential-showcase .zes-heading::before,
.zaeth-essential-showcase .zes-heading::after {
  content: none !important;
  display: none !important;
  transform: none !important;
}

/* Stop animation from creating the doubled appearance */
section.zaeth-essential-showcase .zes-heading *,
.zaeth-essential-showcase .zes-heading * {
  transform: none !important;
  animation: none !important;
  opacity: 1 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 749px) {

  section.zaeth-essential-showcase .zes-heading,
  .zaeth-essential-showcase .zes-heading {
    font-size: 46px !important;
    font-weight: 900 !important;
    line-height: 0.9 !important;
    letter-spacing: 0.02em !important;

    transform: none !important;
    opacity: 1 !important;

    white-space: normal !important;
  }

}

/* =========================================================
   ZAETH ESSENTIAL SHOWCASE — FINAL RESPONSIVE TYPE FIX
   Desktop stays bold / Mobile becomes compact + readable
   ========================================================= */

/* =========================
   DESKTOP
   ========================= */

@media screen and (min-width: 769px) {

  .zaeth-essential-showcase .zes-heading {
    font-size: clamp(64px, 5.2vw, 92px) !important;
    line-height: 0.92 !important;
    letter-spacing: -0.035em !important;
    max-width: 680px !important;
  }

  .zaeth-essential-showcase .zes-description {
    font-size: 15px !important;
    line-height: 1.65 !important;
    letter-spacing: 0.16em !important;
    max-width: 560px !important;
  }

  .zaeth-essential-showcase .zes-eyebrow {
    font-size: 12px !important;
    letter-spacing: 0.28em !important;
  }

  .zaeth-essential-showcase .zes-explore {
    font-size: 13px !important;
    letter-spacing: 0.16em !important;
  }

  .zaeth-essential-showcase .zes-active-title {
    font-size: 18px !important;
    line-height: 1.15 !important;
    letter-spacing: 0.015em !important;
  }

  .zaeth-essential-showcase .zes-active-details {
    font-size: 12px !important;
    line-height: 1.5 !important;
    letter-spacing: 0.16em !important;
  }

  .zaeth-essential-showcase .zes-active-price {
    font-size: 27px !important;
    line-height: 1.1 !important;
  }

  .zaeth-essential-showcase .zes-view-piece {
    font-size: 12px !important;
    letter-spacing: 0.18em !important;
  }
}


/* =========================
   MOBILE
   ========================= */

@media screen and (max-width: 768px) {

  /* Main heading */
  .zaeth-essential-showcase .zes-heading {
    font-size: 38px !important;
    line-height: 0.98 !important;
    letter-spacing: -0.025em !important;
    max-width: 88% !important;
    margin-bottom: 26px !important;
  }

  /* Description */
  .zaeth-essential-showcase .zes-description {
    font-size: 13px !important;
    line-height: 1.75 !important;
    letter-spacing: 0.13em !important;
    max-width: 92% !important;
  }

  /* Eyebrow */
  .zaeth-essential-showcase .zes-eyebrow {
    font-size: 10px !important;
    line-height: 1.4 !important;
    letter-spacing: 0.25em !important;
  }

  /* Explore button */
  .zaeth-essential-showcase .zes-explore {
    font-size: 11px !important;
    line-height: 1.4 !important;
    letter-spacing: 0.15em !important;
  }

  /* Product number */
  .zaeth-essential-showcase .zes-product-number {
    font-size: 12px !important;
  }

  /* Product title */
  .zaeth-essential-showcase .zes-active-title {
    font-size: 15px !important;
    line-height: 1.25 !important;
    letter-spacing: 0.01em !important;
  }

  /* Product details */
  .zaeth-essential-showcase .zes-active-details {
    font-size: 11px !important;
    line-height: 1.5 !important;
    letter-spacing: 0.13em !important;
  }

  /* Price */
  .zaeth-essential-showcase .zes-active-price {
    font-size: 25px !important;
    line-height: 1.15 !important;
  }

  /* View piece */
  .zaeth-essential-showcase .zes-view-piece {
    font-size: 11px !important;
    line-height: 1.4 !important;
    letter-spacing: 0.17em !important;
  }

  /* Counter */
  .zaeth-essential-showcase .zes-counter {
    font-size: 10px !important;
    letter-spacing: 0.1em !important;
  }
}


/* =========================
   SMALL PHONES
   ========================= */

@media screen and (max-width: 768px) {

  .zaeth-essential-showcase .zes-heading {
    font-size: 38px !important;
    line-height: 0.98 !important;
    letter-spacing: -0.025em !important;
    font-weight: 800 !important;
    font-family: inherit !important;
    max-width: 88% !important;
    margin-bottom: 26px !important;
  }

}

  .zaeth-essential-showcase .zes-description {
    font-size: 12px !important;
    line-height: 1.7 !important;
    letter-spacing: 0.11em !important;
    max-width: 94% !important;
  }

  .zaeth-essential-showcase .zes-explore {
    font-size: 10px !important;
  }

  .zaeth-essential-showcase .zes-active-title {
    font-size: 14px !important;
  }

  .zaeth-essential-showcase .zes-active-details {
    font-size: 10px !important;
  }

  .zaeth-essential-showcase .zes-active-price {
    font-size: 23px !important;
  }

  /* =========================================================
   ESSENTIAL SHOWCASE
   MOBILE HEADING — MATCH DESKTOP DISPLAY TYPEFACE
   ========================================================= */

@media screen and (max-width: 768px) {

  .zaeth-essential-showcase .zes-heading,
  .zaeth-essential-showcase .zes-heading * {
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif !important;
    font-weight: 900 !important;
    font-style: normal !important;

    /* keep the mobile sizing */
    font-size: 38px !important;
    line-height: 0.92 !important;
    letter-spacing: -0.025em !important;

    max-width: 90% !important;
  }

}