/* ===== Cioraderm Hero Slide ===== */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
  overflow: hidden;
  color: var(--cio-slide-text, #ffffff);
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__media {
  position: absolute;
  inset: 0;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__media-link {
  display: block;
  width: 100%;
  height: 100%;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__inner {
  position: relative;
  height: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 48px 24px;
  display: flex;
  /* Let clicks fall through the empty inner area to the media link beneath;
     interactive children re-enable pointer-events below. */
  pointer-events: none;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__content, .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta, .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product {
  pointer-events: auto;
}

/* horizontal alignment of content */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-left .cio-slide__inner {
  justify-content: flex-start;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-center .cio-slide__inner {
  justify-content: center;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-right .cio-slide__inner {
  justify-content: flex-end;
}

/* vertical alignment of content */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--v-top .cio-slide__inner {
  align-items: flex-start;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--v-middle .cio-slide__inner {
  align-items: center;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--v-bottom .cio-slide__inner {
  align-items: flex-end;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__content {
  max-width: 480px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-center .cio-slide__content {
  align-items: center;
  text-align: center;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-right .cio-slide__content {
  align-items: flex-end;
  text-align: right;
}

/* ===== Mobile alignment overrides ===== */
@media (max-width: 767px) {
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-left .cio-slide__inner {
    justify-content: flex-start;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-center .cio-slide__inner {
    justify-content: center;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-right .cio-slide__inner {
    justify-content: flex-end;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mv-top .cio-slide__inner {
    align-items: flex-start;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mv-middle .cio-slide__inner {
    align-items: center;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mv-bottom .cio-slide__inner {
    align-items: flex-end;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__content {
    align-items: flex-start;
    text-align: left;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-center .cio-slide__content {
    align-items: center;
    text-align: center;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-right .cio-slide__content {
    align-items: flex-end;
    text-align: right;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-left .cio-slide__cta {
    align-self: flex-start;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-center .cio-slide__cta {
    align-self: center;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--mh-right .cio-slide__cta {
    align-self: flex-end;
  }
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__eyebrow {
  font-size: var(--cio-eb-size-m, 12px);
  font-weight: var(--cio-eb-weight, 600);
  color: var(--cio-eb-color, inherit);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  opacity: 0.9;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__title {
  margin: 0;
  font-size: var(--cio-title-size-m, 32px);
  line-height: 1.1;
  font-weight: var(--cio-title-weight-m, 500);
  color: var(--cio-title-color, inherit);
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__subtitle {
  margin: 0;
  font-size: var(--cio-sub-size-m, 14px);
  font-weight: var(--cio-sub-weight-m, inherit);
  color: var(--cio-sub-color, inherit);
  line-height: 1.6;
  opacity: 0.92;
  max-width: 380px;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta {
  align-self: flex-start;
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #4b2f4f;
  color: #fff;
  text-decoration: none;
  font-size: var(--cio-cta-size-m, 13px);
  font-weight: var(--cio-cta-weight, 500);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 13px 30px;
  border-radius: 2px;
  transition: opacity 0.2s ease;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-center .cio-slide__cta {
  align-self: center;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide--h-right .cio-slide__cta {
  align-self: flex-end;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta:hover {
  opacity: 0.9;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta:focus-visible, .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* Anchor = positioning wrapper only; the card visual lives on the inner card */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product {
  display: block;
  position: absolute;
  right: 16px;
  top: 16%;
  transform: none;
  z-index: 2;
  text-decoration: none;
  color: #1a1a1a;
}
/* Floating product spotlight card — tall, image-led */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-card {
  width: 140px;
  background: linear-gradient(180deg, #ffffff 0%, #f4f1f4 100%);
  border-radius: 4px;
  padding: 12px 12px 14px;
  box-shadow: 0 18px 48px rgba(20, 12, 20, 0.24);
}

/* L-shaped connector line: horizontal run along the top + vertical drop into
   the card's top-right corner. Mirrors the Figma pin. */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-pin {
  position: absolute;
  bottom: 100%;
  right: var(--cio-pin-offset, 50%);
  width: var(--cio-pin-w, 190px);
  height: var(--cio-pin-h, 64px);
  border-top: 1px solid var(--cio-pin-color, #ffffff);
  border-right: 1px solid var(--cio-pin-color, #ffffff);
  pointer-events: none;
}

/* Mobile pin marker: soft white disc with a small dark center dot (matches the
   catalog pin design). Hidden on desktop; shown on mobile in place of the card. */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot {
  display: none;
  position: relative;
  width: var(--cio-pin-w, 34px);
  height: var(--cio-pin-w, 34px);
  border-radius: 50%;
  background: var(--cio-pin-bg, #ffffff);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
  box-sizing: border-box;
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 34%;
  height: 34%;
  border-radius: 50%;
  background: var(--cio-pin-dot, #14263f);
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-media {
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  margin-bottom: 16px;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-img--empty {
  background: #ece7ec;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: center;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-brand {
  font-size: var(--cio-pcbrand-size-m, 10px);
  font-weight: var(--cio-pcbrand-weight, 600);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cio-pcbrand-color, #4b2f4f);
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-name {
  font-size: var(--cio-pcname-size-m, 14px);
  line-height: 1.4;
  font-weight: var(--cio-pcname-weight, 400);
  color: #2a2a2a;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-price {
  font-size: var(--cio-pcprice-size-m, 15px);
  font-weight: var(--cio-pcprice-weight, 600);
  color: var(--cio-pcprice-color, #1a1a1a);
  margin-top: 2px;
}

.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-btn {
  margin-top: 12px;
  text-align: center;
  font-size: var(--cio-pcbtn-size-m, 12px);
  font-weight: var(--cio-pcbtn-weight, 500);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cio-pcbtn-color, #fff);
  background: #4b2f4f;
  padding: 10px 12px;
  border-radius: 3px;
}

/* Mobile: swap the full product card for the compact target dot. The dot is
   positioned by the mobile X/Y coords (--cio-card-mx/my) via --pos-m. */
@media (max-width: 767px) {
  /* mobile: same desktop-style card; the dot is anchored to a chosen point of
     the card (9 positions). Anchor box shrinks to the card, so absolute dot
     coords map to the card's corners/edges/center. */
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product {
    display: inline-block;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-pin {
    display: none !important;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot {
    display: block;
    position: absolute;
    z-index: 3;
    width: var(--cio-pin-w-m, var(--cio-pin-w, 34px));
    height: var(--cio-pin-w-m, var(--cio-pin-w, 34px));
    --cio-pin-gap: 0px;
  }
  /* 9 anchor points — dot sits OUTSIDE the card edge with a gap */
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--tl { right: 100%; bottom: 100%; margin: 0 var(--cio-pin-gap) var(--cio-pin-gap) 0; }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--tc { bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: var(--cio-pin-gap); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--tr { left: 100%; bottom: 100%; margin: 0 0 var(--cio-pin-gap) var(--cio-pin-gap); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--ml { right: 100%; top: 50%; transform: translateY(-50%); margin-right: var(--cio-pin-gap); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--cc { top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--mr { left: 100%; top: 50%; transform: translateY(-50%); margin-left: var(--cio-pin-gap); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--bl { right: 100%; top: 100%; margin: var(--cio-pin-gap) var(--cio-pin-gap) 0 0; }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--bc { top: 100%; left: 50%; transform: translateX(-50%); margin-top: var(--cio-pin-gap); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-dot--br { left: 100%; top: 100%; margin: var(--cio-pin-gap) 0 0 var(--cio-pin-gap); }
  /* collapsible: only the dot shows until tapped; the card expands on open */
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible .cio-slide__product-dot {
    cursor: pointer;
    pointer-events: auto;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible .cio-slide__product-card {
    display: none;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open
    .cio-slide__product-card {
    display: block;
  }
  /* When open, the box grows to the card. Anchor the card so its dot-corner
     stays on the placed coordinate instead of re-centering the whole box. */
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-tl { transform: translate(0, 0); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-tc { transform: translate(-50%, 0); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-tr { transform: translate(-100%, 0); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-ml { transform: translate(0, -50%); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-cc { transform: translate(-50%, -50%); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-mr { transform: translate(-100%, -50%); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-bl { transform: translate(0, -100%); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-bc { transform: translate(-50%, -100%); }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--collapsible.cio-slide__product--open.cio-slide__product--anchor-br { transform: translate(-100%, -100%); }

  /* position the CARD on the mobile X/Y coordinate */
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--pos-m {
    right: auto;
    left: var(--cio-card-mx, var(--cio-card-x, 16px));
    top: var(--cio-card-my, var(--cio-card-y, 16%));
    transform: translate(-50%, -50%);
  }
}

@media (min-width: 768px) {
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__title {
    font-size: var(--cio-title-size, 44px);
    font-weight: var(--cio-title-weight, 500);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__subtitle {
    font-size: var(--cio-sub-size, 14px);
    font-weight: var(--cio-sub-weight, inherit);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__eyebrow {
    font-size: var(--cio-eb-size, 12px);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta {
    font-size: var(--cio-cta-size, 13px);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-brand {
    font-size: var(--cio-pcbrand-size, 10px);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-name {
    font-size: var(--cio-pcname-size, 14px);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-price {
    font-size: var(--cio-pcprice-size, 15px);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-btn {
    font-size: var(--cio-pcbtn-size, 12px);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__inner {
    padding-bottom: 72px;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product {
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-card {
    width: 230px;
    padding: 18px 18px 22px;
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product--pos {
    right: auto;
    left: var(--cio-card-x, 24px);
    top: var(--cio-card-y, 50%);
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta {
    transition: none;
  }
}

/* merchant HTML may carry inline fonts — force the theme (inherited) font */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__subtitle, .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__subtitle * {
  font-family: inherit !important;
}

/* Merchant-controlled side gutters. Appended last so they win over the layout
   rules above (breakpoint blocks included); the fallbacks are exactly what
   those rules already produce, so an unset prop changes nothing. */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__inner {
  padding-left: var(--cio-sidepad-l, 24px);
  padding-right: var(--cio-sidepad-r, 24px);
}
@media (max-width: 767px) {
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__inner {
    padding-left: var(--cio-sidepad-l-m, var(--cio-sidepad-l, 24px));
    padding-right: var(--cio-sidepad-r-m, var(--cio-sidepad-r, 24px));
  }
}

/* Merchant-controlled button side padding. Appended last so it wins over the
   rules above (breakpoint blocks included); the fallbacks are what those
   rules already produce, so an unset prop leaves the button unchanged. */
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta {
  padding-left: var(--cio-btn-cta-l, 30px);
  padding-right: var(--cio-btn-cta-r, 30px);
}
.cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-btn {
  padding-left: var(--cio-btn-cardBtn-l, 12px);
  padding-right: var(--cio-btn-cardBtn-r, 12px);
}
@media (max-width: 767px) {
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__cta {
    padding-left: var(--cio-btn-cta-l-m, var(--cio-btn-cta-l, 30px));
    padding-right: var(--cio-btn-cta-r-m, var(--cio-btn-cta-r, 30px));
  }
  .cc_MdNZYCy9lp_r7CewddGC6 .cio-slide__product-btn {
    padding-left: var(--cio-btn-cardBtn-l-m, var(--cio-btn-cardBtn-l, 12px));
    padding-right: var(--cio-btn-cardBtn-r-m, var(--cio-btn-cardBtn-r, 12px));
  }
}