/*
 * Product page (Modules\Product, D-094; DESIGN.md §3.5), the owner's design: the path,
 * the gallery (thumbnails, a stage with arrows) and the buying box side by side, a card
 * with tabs, related products; on phones one column and a bar with "Add to cart".
 * Colours, radii and corner smoothing come from the child theme's tokens (style.css
 * :root), with fallbacks.
 *
 * Kadence paints button:hover, :focus and :active (more specific than one class): every
 * button here sets its colours for those states too.
 *
 * Contrast: text --hs-ink 14.85:1 and --hs-muted 6.06:1 on white; the price
 * --hs-orange-600 3.33:1 (large text, 32 px and more); "Add to cart" white 19 px bold
 * on --hs-orange-600 3.33:1 (large text); the discount #be123c on #fde4ea 5.4:1; the
 * active tab's white 17 px bold on the orange gradient (large text).
 */

/* The page's own values; the phone bar sits outside the page's box and takes them too. */
.hs-product,
.hs-buybar {
  --hs-product-r: calc(var(--hs-radius-xl, 28px) * var(--hs-corner-scale, 1));
  --hs-product-field: #d5d9e4;
  --hs-product-orange: linear-gradient(180deg, #f58220, var(--hs-orange-600, #e06c00));
}

.hs-product {
  padding-block: 18px 72px;
  color: var(--hs-ink, #1f2547);
}

/* ─── The path ─────────────────────────────────────────────────────────── */

/* The site's breadcrumb, as the account's (account.css: 13.5 px, 600, icon chevrons). */
.hs-product .hs-crumbs__list {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px 8px;
  align-items: center;
  margin: 0;
  padding: 0;
  overflow: hidden;
  color: var(--hs-muted, #5b6180);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.4;
  list-style: none;
}

.hs-product .hs-crumbs__item {
  display: flex;
  flex: none;
  gap: 8px;
  align-items: center;
  margin: 0;
  white-space: nowrap;
}

.hs-product .hs-crumbs__item + .hs-crumbs__item::before {
  flex: none;
  width: 14px;
  height: 14px;
  margin: 0;
  background-color: var(--hs-muted, #5b6180); /* Not the current item's ink. */
  border: 0;
  content: '';
  transform: none;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.hs-product .hs-crumbs__item a {
  color: var(--hs-muted, #5b6180);
  text-decoration: none;
}

.hs-product .hs-crumbs__item a:hover {
  color: var(--hs-blue-600, #0070e0);
  text-decoration: underline;
}

.hs-product .hs-crumbs__item[aria-current] {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--hs-ink, #1f2547);
  font-weight: 700;
  text-overflow: ellipsis;
}

/* Narrow windows: home, the product's category and the product. */
@media (max-width: 1023px) {
  .hs-product .hs-crumbs__item:not(:first-child, :nth-last-child(-n + 2)) {
    display: none;
  }
}

/* ─── Gallery and box ────────────────────────────────────────────────────── */

.hs-product__top {
  display: grid;
  gap: 28px;
  margin-top: 20px;
}

@media (min-width: 1024px) {
  .hs-product__top {
    grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr);
    gap: 48px;
    align-items: start;
  }
}

@media (min-width: 1280px) {
  .hs-product__top {
    gap: 56px;
  }
}

/* ─── Gallery ────────────────────────────────────────────────────────────── */

.hs-gallery {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.hs-gallery__stage {
  position: relative;
  overflow: hidden;
  background: var(--hs-product-backdrop, #ece6df);
  border-radius: var(--hs-product-r);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-gallery__track {
  display: flex;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  list-style: none;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.hs-gallery__track::-webkit-scrollbar {
  display: none;
}

.hs-gallery__track:focus {
  outline: none;
}

.hs-gallery__slide {
  position: relative;
  flex: 0 0 100%;
  aspect-ratio: 1;
  margin: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

@media (min-width: 768px) {
  .hs-gallery__slide {
    aspect-ratio: 5 / 4;
  }
}

@media (min-width: 1024px) {
  .hs-gallery__slide {
    aspect-ratio: 16 / 15;
  }
}

.hs-gallery__frame {
  display: block;
  width: 100%;
  height: 100%;
}

a.hs-gallery__frame {
  cursor: zoom-in;
}

.hs-gallery__image,
.hs-gallery .hs-gallery__frame img {
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}

.hs-gallery__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #0f1226;
}

.hs-gallery .hs-gallery__arrow,
.hs-gallery .hs-gallery__arrow:is(:hover, :focus, :active) {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin: 0;
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 8px 22px -6px rgb(31 37 71 / 30%);
  cursor: pointer;
  translate: 0 -50%;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.hs-gallery .hs-gallery__arrow[hidden] {
  display: none;
}

.hs-gallery__arrow--prev {
  left: 18px;
}

.hs-gallery__arrow--next {
  right: 18px;
}

@media (hover: hover) {
  .hs-gallery .hs-gallery__arrow:hover {
    box-shadow: 0 12px 28px -6px rgb(31 37 71 / 36%);
    transform: scale(1.06);
  }
}

.hs-gallery .hs-gallery__arrow:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

/* A variation's set not chosen (or the product's while one is): out of the way. */
.hs-gallery__slide[hidden],
.hs-gallery__thumb-item[hidden],
.hs-gallery__thumbs[hidden],
.hs-gallery__count[hidden] {
  display: none !important;
}

.hs-gallery__count {
  position: absolute;
  z-index: 2;
  right: 14px;
  bottom: 14px;
  margin: 0;
  padding: 4px 11px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.4;
  color: #fff;
  background: rgb(31 37 71 / 72%);
  border-radius: var(--hs-r-pill, 999px);
  pointer-events: none;
}

.hs-gallery__thumbs {
  display: flex;
  gap: 12px;
  margin: 0;
  padding: 3px;
  overflow: auto;
  list-style: none;
  scrollbar-width: none;
}

.hs-gallery__thumbs::-webkit-scrollbar {
  display: none;
}

.hs-gallery__thumb-item {
  flex: none;
  width: 84px;
  margin: 0;
}

.hs-gallery__thumb {
  position: relative;
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--hs-product-backdrop, #ece6df);
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1) + 2px);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-gallery__thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 3px solid transparent;
  border-radius: inherit;
  corner-shape: var(--hs-corner-shape, round);
  transition: border-color 0.2s ease;
}

.hs-gallery__thumb:hover::after {
  border-color: rgb(224 108 0 / 45%);
}

.hs-gallery__thumb.is-active::after {
  border-color: var(--hs-orange-600, #e06c00);
}

.hs-gallery__thumb:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-gallery__thumb-image,
.hs-gallery__thumb img {
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}

.hs-gallery__thumb--video img {
  filter: brightness(0.82);
}

.hs-gallery__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: auto;
  padding-left: 2px;
  color: var(--hs-blue-600, #0070e0);
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 6px 16px -4px rgb(31 37 71 / 40%);
}

/* Phones: swipe, the count on the picture, no thumbnails and no arrows. */
@media (max-width: 767px) {
  .hs-gallery__thumbs,
  .hs-gallery .hs-gallery__arrow {
    display: none;
  }
}

@media (min-width: 768px) {
  .hs-gallery__count {
    display: none;
  }

  .hs-gallery__thumbs {
    order: 2;
  }
}

/* Next to the box: the thumbnails in a column as tall as the stage; the gallery stays in
   sight while the (taller) box scrolls. */
@media (min-width: 1024px) {
  .hs-gallery {
    position: sticky;
    top: 24px;
  }

  .hs-gallery.has-many {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 20px;
  }

  .hs-gallery.has-many .hs-gallery__thumbs {
    flex-direction: column;
    order: 0;
    height: 0;
    min-height: 100%;
  }

  .hs-gallery__thumb-item {
    width: auto;
  }
}

@media (min-width: 1280px) {
  .hs-gallery.has-many {
    grid-template-columns: 108px minmax(0, 1fr);
  }
}

/* ─── Zoom window ────────────────────────────────────────────────────────── */

.hs-zoom {
  position: fixed;
  inset: 0;
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  color: #fff;
  background: rgb(15 18 38 / 97%);
  border: 0;
}

.hs-zoom::backdrop {
  background: rgb(15 18 38 / 60%);
  backdrop-filter: blur(6px);
}

html.hs-zoom-open {
  overflow: hidden;
}

.hs-zoom__stage {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  touch-action: pan-y pinch-zoom;
}

.hs-zoom__image {
  display: block;
  max-width: min(94vw, 1400px);
  max-height: 86dvh;
  object-fit: contain;
  cursor: zoom-in;
  border-radius: var(--hs-r-md, 14px);
  transition: transform 0.3s ease;
  user-select: none;
  -webkit-user-drag: none;
}

.hs-zoom.is-zoomed .hs-zoom__image {
  cursor: zoom-out;
  transform: scale(2.2);
}

/* A customer's video plays in the same window. */
.hs-zoom__video {
  display: block;
  max-width: min(94vw, 1400px);
  max-height: 86dvh;
  background: #000;
  border-radius: var(--hs-r-md, 14px);
}

.hs-zoom__image[hidden],
.hs-zoom__video[hidden] {
  display: none;
}

.hs-zoom .hs-zoom__button,
.hs-zoom .hs-zoom__button:is(:hover, :focus, :active) {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin: 0;
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 8px 22px -6px rgb(0 0 0 / 40%);
  cursor: pointer;
}

.hs-zoom .hs-zoom__button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

.hs-zoom__button[hidden] {
  display: none !important;
}

.hs-zoom__close {
  top: calc(16px + env(safe-area-inset-top, 0px));
  right: 16px;
}

.hs-zoom__prev,
.hs-zoom__next {
  top: 50%;
  translate: 0 -50%;
}

.hs-zoom__prev {
  left: 16px;
}

.hs-zoom__next {
  right: 16px;
}

.hs-zoom__count {
  position: absolute;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  left: 50%;
  margin: 0;
  padding: 5px 12px;
  font-size: 14px;
  font-weight: 800;
  z-index: 2;
  /* Dark, so it reads on a light photo zoomed in too. */
  background: rgb(15 18 38 / 62%);
  border-radius: var(--hs-r-pill, 999px);
  translate: -50% 0;
}

/* ─── Buying box ─────────────────────────────────────────────────────────── */

.hs-buy {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

.hs-buy__head {
  display: grid;
  gap: 12px;
}

.hs-buy__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hs-buy__badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 3px 14px;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--hs-orange-700, #c2410c);
  background: #fff1e6;
  border-radius: var(--hs-r-pill, 999px);
}

.hs-buy__badge--personalized {
  color: #fff;
  background: var(--hs-product-orange);
  box-shadow: 0 6px 14px -6px rgb(224 108 0 / 55%);
}

.hs-buy__badge--new {
  color: var(--hs-blue-700, #185c9f);
  background: #e8f1ff;
}

.hs-buy__titlebar {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.hs-buy__title {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: clamp(26px, 1.25rem + 1.1vw, 38px);
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: -0.01em;
  color: var(--hs-ink, #1f2547);
  overflow-wrap: anywhere;
}

.hs-buy__actions {
  display: flex;
  flex: none;
  gap: 10px;
}

.hs-buy .hs-wish.hs-wish--product,
.hs-buy .hs-wish.hs-wish--product:is(:hover, :focus, :active),
.hs-share .hs-share__button,
.hs-share .hs-share__button:is(:hover, :focus, :active) {
  display: inline-grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin: 0;
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 0;
  border-radius: 50%;
  box-shadow:
    0 0 0 1px var(--hs-line, #e6e9f0),
    0 6px 16px -8px rgb(31 37 71 / 30%);
  cursor: pointer;
}

.hs-buy .hs-wish.hs-wish--product[hidden] {
  display: none;
}

.hs-buy .hs-wish.hs-wish--product .hs-wish__icon--off {
  color: var(--hs-wish-on, #e11d48);
}

@media (hover: hover) {
  .hs-buy .hs-wish.hs-wish--product:hover,
  .hs-share .hs-share__button:hover {
    box-shadow:
      0 0 0 1px var(--hs-line, #e6e9f0),
      0 10px 22px -8px rgb(31 37 71 / 36%);
    transform: translateY(-1px);
  }

  .hs-share .hs-share__button:hover {
    color: var(--hs-blue-600, #0070e0);
  }
}

.hs-share .hs-share__button:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

/* "Share": a small menu under the button (phones use the system's sheet). */
.hs-share {
  position: relative;
}

.hs-share__menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 10px);
  right: 0;
  width: 240px;
  padding: 8px;
  background: #fff;
  border-radius: calc(var(--hs-radius-lg, 20px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
  box-shadow:
    0 0 0 1px var(--hs-line, #e6e9f0),
    0 22px 50px -14px rgb(31 37 71 / 32%);
}

.hs-share__menu[hidden] {
  display: none;
}

.hs-share__title {
  margin: 4px 10px 6px;
  font-size: 14px;
  font-weight: 800;
  color: var(--hs-muted, #5b6180);
}

.hs-share__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-share .hs-share__item,
.hs-share .hs-share__item:is(:hover, :focus, :active) {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 10px 12px;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  text-align: start;
  text-decoration: none;
  background: transparent;
  border: 0;
  border-radius: calc(var(--hs-radius-sm, 10px) * var(--hs-corner-scale, 1) + 2px);
  cursor: pointer;
}

.hs-share .hs-share__item:hover,
.hs-share .hs-share__item:focus-visible {
  background: var(--hs-surface-2, #f4f6f9);
}

.hs-share .hs-share__item:focus-visible {
  outline: 2px solid var(--hs-focus, #1f2547);
  outline-offset: -2px;
}

.hs-share__item .hs-icon {
  flex: none;
  color: var(--hs-blue-600, #0070e0);
}

/* The rating. */
.hs-buy__rating {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  width: fit-content;
  font-size: 15px;
  font-weight: 600;
  color: var(--hs-muted, #5b6180);
  text-decoration: none;
}

.hs-buy__score {
  font-weight: 800;
  color: var(--hs-ink, #1f2547);
}

.hs-buy__rating:hover .hs-buy__reviews {
  color: var(--hs-blue-700, #185c9f);
  text-decoration: underline;
}

.hs-stars {
  --hs-stars-size: 19px;

  display: inline-block;
  flex: none;
  width: calc(var(--hs-stars-size) * 26 / 24 * 5);
  height: var(--hs-stars-size);
  background: linear-gradient(90deg, var(--hs-orange, #f09820) var(--hs-stars, 0%), #e1e4ec var(--hs-stars, 0%));
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 24'%3E%3Cpath d='M12 1.9a1.1 1.1 0 0 1 1 .62l2.6 5.28 5.83.85a1.1 1.1 0 0 1 .61 1.88l-4.22 4.1 1 5.8a1.1 1.1 0 0 1-1.6 1.16L12 18.85l-5.22 2.74a1.1 1.1 0 0 1-1.6-1.16l1-5.8-4.22-4.1a1.1 1.1 0 0 1 .61-1.88l5.83-.85L11 2.52a1.1 1.1 0 0 1 1-.62Z'/%3E%3C/svg%3E")
    0 0 / calc(var(--hs-stars-size) * 26 / 24) var(--hs-stars-size) repeat-x;
}

.hs-buy__excerpt {
  font-size: 16px;
  line-height: 1.65;
  color: var(--hs-muted, #5b6180);
}

.hs-buy__excerpt > :first-child {
  margin-top: 0;
}

.hs-buy__excerpt > :last-child {
  margin-bottom: 0;
}

/* The price. */
.hs-buy__price {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 2px 0 0;
}

.hs-buy__now {
  font-size: clamp(32px, 1.5rem + 1.3vw, 46px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--hs-orange-600, #e06c00);
}

.hs-buy__now.is-range {
  font-size: clamp(26px, 1.25rem + 1vw, 34px);
}

.hs-buy__was {
  font-size: 20px;
  font-weight: 700;
  color: var(--hs-muted, #5b6180);
  text-decoration-thickness: 2px;
}

.hs-buy__off {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 4px 14px;
  font-size: 16px;
  font-weight: 800;
  color: #be123c;
  background: #fde4ea;
  border-radius: var(--hs-r-pill, 999px);
}

/* The form. */
.hs-buy__form {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 4px 0 0;
}

.hs-buy__label {
  display: block;
  margin: 0 0 10px;
  padding: 0;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--hs-ink, #1f2547);
}

.hs-buy__optional,
.hs-buy__chosen {
  font-size: 15px;
  font-weight: 600;
  color: var(--hs-muted, #5b6180);
}

.hs-buy__chosen:not(:empty)::before {
  content: '· ';
}

.hs-buy__input-box {
  position: relative;
  display: flex;
  align-items: center;
}

.hs-buy__input-icon {
  position: absolute;
  left: 18px;
  color: var(--hs-muted, #5b6180);
  pointer-events: none;
}

.hs-buy .hs-buy__input {
  width: 100%;
  height: 58px;
  margin: 0;
  padding: 0 76px 0 52px;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 1px solid var(--hs-product-field);
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1) + 2px);
  corner-shape: var(--hs-corner-shape, round);
  box-shadow: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.hs-buy .hs-buy__input::placeholder {
  font-weight: 500;
  color: var(--hs-placeholder, #646a87);
  opacity: 1;
}

.hs-buy .hs-buy__input:focus {
  border-color: var(--hs-blue-600, #0070e0);
  outline: none;
  box-shadow: 0 0 0 3px rgb(0 112 224 / 18%);
}

.hs-buy__field.is-invalid .hs-buy__input {
  border-color: var(--hs-red, #e11d48);
}

.hs-buy__field.is-invalid .hs-buy__input:focus {
  box-shadow: 0 0 0 3px rgb(225 29 72 / 16%);
}

.hs-buy__count {
  position: absolute;
  right: 18px;
  font-size: 14px;
  font-weight: 700;
  color: var(--hs-muted, #5b6180);
  pointer-events: none;
}

.hs-buy__field.is-over .hs-buy__count {
  color: var(--hs-red, #e11d48);
}

.hs-buy__error {
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--hs-red, #e11d48);
}

.hs-buy__error[hidden] {
  display: none;
}

.hs-buy__error--form {
  margin: 0;
}

/* The customer's photos: a dashed drop zone (the file input's label), then previews. */
.hs-photo {
  position: relative;
}

.hs-photo__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.hs-photo__zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 148px;
  margin: 0;
  padding: 22px 18px;
  text-align: center;
  cursor: pointer;
  background: #fafbff;
  border: 1.5px dashed #c9cfdc;
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1) + 2px);
  corner-shape: var(--hs-corner-shape, round);
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}

.hs-photo__zone[hidden] {
  display: none;
}

.hs-photo__zone:hover,
.hs-photo.is-drag .hs-photo__zone {
  background: #f2f6ff;
  border-color: var(--hs-blue-600, #0070e0);
}

.hs-photo__input:focus-visible + .hs-photo__zone {
  border-color: var(--hs-blue-600, #0070e0);
  box-shadow: 0 0 0 3px rgb(0 112 224 / 18%);
}

.hs-photo.is-invalid .hs-photo__zone {
  border-color: var(--hs-red, #e11d48);
}

.hs-photo__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin: 0 0 4px;
  color: var(--hs-blue-600, #0070e0);
  background: #e7f0ff;
  border-radius: 50%;
}

.hs-photo__text {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--hs-ink, #1f2547);
}

.hs-photo__pick {
  font-weight: 800;
  color: var(--hs-blue-600, #0070e0);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.hs-photo__hint {
  font-size: 14px;
  font-weight: 500;
  color: var(--hs-muted, #5b6180);
}

/* Touch screens have nothing to drag. */
@media (hover: none), (pointer: coarse) {
  .hs-photo__drag {
    display: none;
  }
}

.hs-photo__list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-photo__list[hidden] {
  display: none;
}

.hs-photo__tile {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  padding: 10px 8px 10px 10px;
  background: #fff;
  border: 1px solid var(--hs-product-field);
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1) + 2px);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-photo.is-invalid .hs-photo__tile {
  border-color: var(--hs-red, #e11d48);
}

.hs-photo__thumb {
  flex: none;
  width: 64px;
  height: 64px;
  object-fit: cover;
  background: #eef1f7;
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1) - 4px);
}

.hs-photo__meta {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.hs-photo__name {
  overflow: hidden;
  font-size: 15px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hs-photo__size {
  font-size: 14px;
  font-weight: 500;
  color: var(--hs-muted, #5b6180);
}

.hs-photo .hs-photo__remove,
.hs-photo .hs-photo__remove:is(:hover, :focus, :active) {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  margin: 0;
  padding: 0 12px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  color: var(--hs-red, #e11d48);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 10px;
}

.hs-photo .hs-photo__remove {
  color: var(--hs-red, #e11d48);
  background: transparent;
  box-shadow: none;
}

.hs-photo .hs-photo__remove:hover,
.hs-photo .hs-photo__remove:active {
  color: #be123c;
  background: #fff1f3;
}

.hs-photo__remove:focus-visible,
.hs-photo__more:focus-visible {
  outline: 2px solid var(--hs-blue-600, #0070e0);
  outline-offset: 2px;
}

.hs-photo__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin: 10px 0 0;
  padding: 0 16px;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  color: var(--hs-blue-600, #0070e0);
  cursor: pointer;
  background: #fafbff;
  border: 1.5px dashed #c9cfdc;
  border-radius: var(--hs-r-pill, 999px);
}

.hs-photo__more[hidden] {
  display: none;
}

.hs-photo__more:hover {
  border-color: var(--hs-blue-600, #0070e0);
}

/* The options: colours as swatches, the rest as chips. */
.hs-buy__option {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.hs-buy__choices {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
}

.hs-pick {
  position: relative;
  display: inline-grid;
  cursor: pointer;
}

.hs-pick__input {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
  opacity: 0;
}

.hs-pick__dot {
  width: 42px;
  height: 42px;
  background: var(--hs-swatch, #d9dce6);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgb(31 37 71 / 14%);
  transition: box-shadow 0.15s ease;
}

.hs-pick__input:checked + .hs-pick__dot {
  box-shadow:
    inset 0 0 0 1px rgb(31 37 71 / 14%),
    0 0 0 3px #fff,
    0 0 0 5px var(--hs-orange-600, #e06c00);
}

.hs-pick__input:focus-visible + .hs-pick__dot,
.hs-pick__input:focus-visible + .hs-pick__text {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 6px;
}

.hs-pick__text {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border-radius: var(--hs-r-pill, 999px);
  box-shadow: inset 0 0 0 1px var(--hs-product-field);
}

.hs-pick__input:checked + .hs-pick__text {
  color: var(--hs-orange-700, #c2410c);
  background: #fff4ec;
  box-shadow: inset 0 0 0 2px var(--hs-orange-600, #e06c00);
}

.hs-pick.is-unavailable .hs-pick__dot,
.hs-pick.is-unavailable .hs-pick__text {
  opacity: 0.4;
}

.hs-pick.is-unavailable::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 12%;
  width: 76%;
  height: 2px;
  background: var(--hs-ink, #1f2547);
  border-radius: 2px;
  opacity: 0.55;
  transform: rotate(-35deg);
  pointer-events: none;
}

/* The made-to-order notice. */
.hs-buy__legal {
  display: flex;
  gap: 10px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--hs-muted, #5b6180);
  background: var(--hs-surface-2, #f4f6f9);
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
}

.hs-buy__legal .hs-icon {
  flex: none;
  margin-top: 1px;
  color: var(--hs-blue-600, #0070e0);
}

.hs-buy__legal p {
  margin: 0;
}

.hs-buy__stock {
  display: flex;
  margin: 0;
  font-size: 15px;
  font-weight: 800;
}

.hs-buy__stock[hidden] {
  display: none;
}

.hs-buy__stock-text {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hs-buy__stock-text.is-out {
  color: var(--hs-red, #e11d48);
}

.hs-buy__stock-text.is-low {
  color: #b45309;
}

/* The quantity and the buttons. */
.hs-buy__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px 16px;
  align-items: start;
}

.hs-buy__row:not(:has(.hs-qty)) .hs-buy__buttons {
  grid-column: 1 / -1;
}

.hs-buy__buttons {
  display: grid;
  gap: 12px;
  min-width: 0;
}

/*
 * "Buy now" (D-143) before "Add to cart" (the owner's order, 2026-10-06), the same height,
 * not filled: the quantity box's look (white, its line, its corners), the words in ink and
 * a lightning bolt. The order is the eye's only: in the form "Add to cart" stays first, so
 * Enter in a field still adds to the cart. Side by side from tablets up; on phones "Buy
 * now" sits beside the quantity and "Add to cart" takes the whole row under them.
 */
@media (max-width: 599px) {
  .hs-buy__row:has(.hs-qty) .hs-buy__buttons:has(.hs-buy__instant) {
    display: contents;
  }

  .hs-buy__row:has(.hs-qty):has(.hs-buy__instant) .hs-qty {
    order: -2;
  }

  .hs-buy__row:has(.hs-qty):has(.hs-buy__instant) .hs-buy__add {
    grid-column: 1 / -1;
  }
}

.hs-buy__buttons .hs-buy__instant {
  order: -1;
}

@media (min-width: 600px) {
  .hs-buy__buttons:has(.hs-buy__instant) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Two in the quantity's row: a little tighter, so both labels keep to one line. */
  .hs-buy .hs-buy__buttons:has(.hs-buy__instant) .hs-buy__add,
  .hs-buy .hs-buy__buttons:has(.hs-buy__instant) .hs-buy__add:is(:hover, :focus, :active),
  .hs-buy .hs-buy__buttons .hs-buy__instant {
    gap: 8px;
    padding: 0 14px;
    font-size: 17px;
  }
}

/* The theme's button states (its colours, a shadow) stay off it. */
.hs-buy .hs-buy__instant,
.hs-buy .hs-buy__instant:is(:hover, :focus, :active) {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 58px;
  margin: 0;
  padding: 0 20px;
  color: var(--hs-ink, #1f2547);
  font-family: inherit;
  font-size: 18px;
  font-weight: var(--hs-fw-strong, 800);
  line-height: 1.2;
  white-space: nowrap;
  background: #fff;
  border: 1px solid var(--hs-product-field);
  border-radius: calc(var(--hs-radius-lg, 20px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
  box-shadow: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

/* Under the pointer: the quantity buttons' soft orange. */
.hs-buy .hs-buy__instant:hover:not(:disabled) {
  color: var(--hs-orange-700, #c2410c);
  background: #fff4ec;
  border-color: #f3c9a4;
}

.hs-buy .hs-buy__instant:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-buy .hs-buy__instant:disabled {
  color: var(--hs-muted, #5b6180);
  background: #f4f6f9;
  cursor: not-allowed;
}

.hs-buy .hs-buy__instant .hs-icon {
  --hs-icon-accent: var(--hs-orange-600, #e06c00);

  flex: none;
}

.hs-qty {
  display: grid;
  grid-template-columns: 46px 52px 46px;
  align-items: center;
  height: 58px;
  padding: 0 5px;
  background: #fff;
  border: 1px solid var(--hs-product-field);
  border-radius: calc(var(--hs-radius-lg, 20px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
}

.hs-qty .hs-qty__step,
.hs-qty .hs-qty__step:is(:hover, :focus, :active) {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin: 0;
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: transparent;
  border: 0;
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1));
  box-shadow: none;
  cursor: pointer;
}

.hs-qty .hs-qty__step:hover:not(:disabled) {
  color: var(--hs-orange-700, #c2410c);
  background: #fff4ec;
}

.hs-qty .hs-qty__step:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: -2px;
}

.hs-qty .hs-qty__step:disabled {
  color: var(--hs-muted, #5b6180);
  cursor: default;
  opacity: 0.45;
}

.hs-qty .hs-qty__input {
  width: 100%;
  height: 46px;
  margin: 0;
  padding: 0;
  font: inherit;
  font-size: 19px;
  font-weight: 800;
  color: var(--hs-ink, #1f2547);
  text-align: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  appearance: textfield;
}

.hs-qty .hs-qty__input::-webkit-inner-spin-button,
.hs-qty .hs-qty__input::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
}

.hs-qty .hs-qty__input:focus {
  outline: none;
}

.hs-qty:focus-within:has(.hs-qty__input:focus) {
  border-color: var(--hs-blue-600, #0070e0);
  box-shadow: 0 0 0 3px rgb(0 112 224 / 18%);
}

.hs-buy .hs-buy__add,
.hs-buy .hs-buy__add:is(:hover, :focus, :active),
.hs-buybar .hs-buybar__add,
.hs-buybar .hs-buybar__add:is(:hover, :focus, :active) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 58px;
  margin: 0;
  padding: 0 26px;
  font: inherit;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.2;
  color: #fff;
  text-decoration: none;
  background: var(--hs-product-orange);
  border: 0;
  border-radius: var(--hs-r-pill, 999px);
  box-shadow: 0 10px 24px rgb(224 108 0 / 28%);
  cursor: pointer;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
}

@media (hover: hover) {
  .hs-buy .hs-buy__add:hover:not(:disabled),
  .hs-buybar .hs-buybar__add:hover {
    filter: brightness(1.05);
    box-shadow: 0 14px 30px rgb(224 108 0 / 34%);
    transform: translateY(-1px);
  }
}

.hs-buy .hs-buy__add:focus-visible,
.hs-buybar .hs-buybar__add:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 3px;
}

.hs-buy .hs-buy__add:disabled {
  color: var(--hs-muted, #5b6180);
  background: #e6e9f0;
  box-shadow: none;
  cursor: not-allowed;
}

.hs-buy .hs-buy__add[aria-busy='true'] {
  cursor: progress;
}

.hs-buy__add-done,
.hs-buy__add.is-added .hs-buy__add-icon {
  display: none;
}

.hs-buy__add.is-added .hs-buy__add-done {
  display: block;
}

.hs-buy__note {
  display: flex;
  gap: 8px;
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--hs-muted, #5b6180);
}

.hs-buy__note .hs-icon {
  flex: none;
  color: var(--hs-orange-600, #e06c00);
}

.hs-buy__extras > * {
  margin: 0;
}

.hs-buy__extras > * + * {
  margin-top: 12px;
}

.hs-buy__native .quantity,
.hs-buy__native table {
  margin-bottom: 12px;
}

/* The store's promises. */
.hs-buy__promises {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: 16px 12px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.hs-buy__promise {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--hs-muted, #5b6180);
}

.hs-buy__promise .hs-icon {
  --hs-icon-accent: var(--hs-orange-600, #e06c00);

  flex: none;
  color: var(--hs-blue-600, #0070e0);
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .hs-buy__promises {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .hs-buy__promises {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/*
 * Worldwide shipping (D-143): the shipping promise as a button ("Worldwide shipping" over a
 * blue "10 countries ›") that opens the countries: a white box, the zones as grey cards
 * (Türkiye first) with their delivery time and fee, the countries by name.
 *
 * The button sits in line with the other promises (its padding taken back by a margin);
 * under the pointer it shows itself: a soft blue tile (R 14), the arrow steps on and the
 * globe turns a little. The theme's button states (its colours, a shadow) stay off it.
 */
.hs-buy .hs-buy__world,
.hs-buy .hs-buy__world:is(:hover, :focus, :active) {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: -6px -10px -6px -6px;
  padding: 6px 10px 6px 6px;
  font: inherit;
  color: inherit;
  text-align: start;
  background: transparent;
  border: 0;
  border-radius: max(calc(14px * var(--hs-corner-scale, 1)), var(--hs-r-min, 4px));
  corner-shape: var(--hs-corner-shape, round);
  box-shadow: none;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.hs-buy .hs-buy__world:hover {
  background: color-mix(in srgb, var(--hs-blue-600, #0070e0) 8%, var(--hs-surface, #fff));
}

.hs-buy .hs-buy__world > .hs-icon {
  transition: rotate 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.hs-buy .hs-buy__world:hover > .hs-icon {
  rotate: -18deg;
}

.hs-buy__world-words {
  display: flex;
  flex-direction: column;
}

.hs-buy__world-more {
  display: inline-flex;
  gap: 2px;
  align-items: center;
  color: var(--hs-blue-600, #0070e0);
  font-weight: var(--hs-fw-strong, 800);
}

.hs-buy .hs-buy__world .hs-buy__world-arrow {
  flex: none;
  color: currentcolor;
  transition: translate 0.15s ease;
}

.hs-buy .hs-buy__world:hover .hs-buy__world-more {
  color: var(--hs-blue-700, #185c9f);
}

.hs-buy .hs-buy__world:hover .hs-buy__world-arrow {
  translate: 3px 0;
}

.hs-buy .hs-buy__world:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .hs-buy .hs-buy__world > .hs-icon,
  .hs-buy .hs-buy__world .hs-buy__world-arrow {
    transition: none;
  }

  .hs-buy .hs-buy__world:hover > .hs-icon {
    rotate: none;
  }
}

.hs-world {
  width: min(680px, calc(100vw - 32px));
  max-height: min(92vh, 900px);
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 0;
  border-radius: var(--hs-radius-xl, 28px);
  corner-shape: var(--hs-corner-shape, round);
  box-shadow: 0 24px 64px -16px rgb(31 37 71 / 35%);
  overscroll-behavior: contain;
}

.hs-world::backdrop {
  background: rgb(31 37 71 / 45%);
}

.hs-world__box {
  padding: 24px;
}

.hs-world__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hs-world .hs-world__title {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.25;
}

.hs-world .hs-world__close,
.hs-world .hs-world__close:is(:hover, :focus, :active) {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #f4f6f9;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  cursor: pointer;
}

.hs-world .hs-world__close:hover {
  background: #e9edf3;
}

.hs-world .hs-world__close:focus-visible {
  outline: 2px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-world__lead {
  margin: 10px 0 18px;
  color: var(--hs-muted, #5b6180);
  font-size: 15px;
  line-height: 1.55;
}

.hs-world__zones {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-world__zone {
  padding: 14px 16px;
  background: #f6f8fb;
  border-radius: var(--hs-r-lg, 18px);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-world__zone-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 12px;
}

.hs-world__name {
  font-size: 16px;
  font-weight: 800;
}

.hs-world__meta {
  color: var(--hs-muted, #5b6180);
  font-size: 14px;
  font-weight: 700;
}

.hs-world__countries {
  margin: 6px 0 0;
  font-size: 14.5px;
  line-height: 1.6;
}

/*
 * The globe (D-146), while world.js runs (.is-globe; before and without it the cards are
 * the list above). A soft sky behind it (R 18, the cards' radius); under it a line on how
 * it works, the zones as chips (the zone's colour: a dot, Türkiye a heart; pressed: its
 * tint and line) and the chosen zone's card only, with its colour's edge.
 */
.hs-world:not(.is-globe) :is(.hs-world__stage, .hs-world__hint, .hs-world__chips) {
  display: none;
}

.hs-world__stage {
  margin: 0 0 6px;
  padding: 8px 0 0;
  background:
    radial-gradient(circle at 18% 22%, #fff3f8 0, transparent 42%),
    radial-gradient(circle at 84% 78%, #fff6e8 0, transparent 40%), linear-gradient(180deg, #eef6ff 0%, #f8fbff 100%);
  border-radius: var(--hs-r-lg, 18px);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-globe {
  display: block;
  width: min(100%, 460px, 54vh);
  height: auto;
  margin: 0 auto;
  overflow: visible;
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.hs-globe.is-dragging {
  cursor: grabbing;
}

.hs-globe__grid {
  fill: none;
  stroke: #fff;
  stroke-opacity: 0.5;
  stroke-width: 0.8;
}

/* Land: a mint fill with a wide line of its own colour, so its corners come out round. */
.hs-globe__land {
  fill: #c3ebcb;
  stroke: #c3ebcb;
  stroke-width: 3.2;
  stroke-linejoin: round;
}

.hs-globe__lake {
  fill: #a7d1fd;
  stroke: #a7d1fd;
  stroke-width: 1;
  stroke-linejoin: round;
}

.hs-globe__patch {
  fill-opacity: 0.16;
  stroke-opacity: 0.55;
  stroke-width: 1.5;
  stroke-dasharray: 4 4;
  cursor: pointer;
  transition:
    fill-opacity 0.2s ease,
    stroke-opacity 0.2s ease;
}

.hs-globe__patch.is-on {
  fill-opacity: 0.3;
  stroke-opacity: 0.95;
}

.hs-globe__shade,
.hs-globe__shine,
.hs-globe__floor,
.hs-globe__sky,
.hs-globe__flight,
.hs-globe__parcel,
.hs-globe__label,
.hs-globe__pulse {
  pointer-events: none;
}

.hs-globe__rim {
  fill: none;
  stroke: #1f2547;
  stroke-opacity: 0.08;
  stroke-width: 1.5;
}

.hs-globe__dot {
  stroke: #fff;
  stroke-width: 1.3;
  cursor: pointer;
}

.hs-globe__pin,
.hs-globe__home {
  cursor: pointer;
}

.hs-globe__pin.is-on .hs-globe__pin-body,
.hs-globe__home.is-on .hs-globe__home-body {
  animation: hs-globe-bob 1.4s ease-in-out infinite;
}

.hs-globe__pulse {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: hs-globe-pulse 2.2s ease-out infinite;
}

.hs-globe__flight {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 4 6;
  animation: hs-globe-dash 1.1s linear infinite;
}

.hs-globe__label rect {
  filter: drop-shadow(0 4px 8px rgb(31 37 71 / 18%));
}

.hs-globe__label text {
  fill: var(--hs-ink, #1f2547);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 800;
}

.hs-globe__cloud path {
  opacity: 0.95;
  animation: hs-globe-drift 7s ease-in-out infinite alternate;
}

.hs-globe__cloud--2 path {
  animation-duration: 9s;
  animation-delay: -3s;
}

.hs-globe__cloud--3 path {
  animation-duration: 8s;
  animation-delay: -5s;
}

.hs-globe__spark {
  animation: hs-globe-twinkle 2.6s ease-in-out infinite;
}

.hs-globe__spark--2 {
  animation-delay: -0.8s;
}

.hs-globe__spark--3 {
  animation-delay: -1.5s;
}

.hs-globe__spark--4 {
  animation-delay: -2.1s;
}

@keyframes hs-globe-bob {
  50% {
    transform: translateY(-3px);
  }
}

@keyframes hs-globe-pulse {
  0% {
    opacity: 0.45;
    transform: scale(0.6);
  }

  100% {
    opacity: 0;
    transform: scale(2.4);
  }
}

@keyframes hs-globe-dash {
  to {
    stroke-dashoffset: -20;
  }
}

@keyframes hs-globe-drift {
  to {
    transform: translateX(10px);
  }
}

@keyframes hs-globe-twinkle {
  50% {
    opacity: 0.35;
  }
}

.hs-world__hint {
  margin: 0 0 14px;
  color: var(--hs-muted, #5b6180);
  font-size: 13px;
  line-height: 1.45;
  text-align: center;
  text-wrap: balance;
}

.hs-world__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin: 0 0 14px;
}

.hs-world .hs-world__chip,
.hs-world .hs-world__chip:is(:hover, :focus, :active) {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-height: 40px;
  margin: 0;
  padding: 0 16px 0 12px;
  color: var(--hs-ink, #1f2547);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  background: #fff;
  border: 1.5px solid var(--hs-line, #e6e9f0);
  border-radius: 999px;
  box-shadow: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
}

.hs-world .hs-world__chip:hover {
  border-color: color-mix(in srgb, var(--hs-zone) 45%, var(--hs-line, #e6e9f0));
}

.hs-world .hs-world__chip[aria-pressed='true'] {
  font-weight: 800;
  background: color-mix(in srgb, var(--hs-zone) 11%, #fff);
  border-color: var(--hs-zone);
}

.hs-world .hs-world__chip:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-world__dot {
  flex: none;
  width: 10px;
  height: 10px;
  background: var(--hs-zone);
  border-radius: 50%;
  box-shadow: 0 0 0 2px #fff;
}

.hs-world__chip .hs-world__heart {
  flex: none;
  color: var(--hs-zone);
}

.hs-world.is-globe .hs-world__zone:not(.is-current) {
  display: none;
}

.hs-world.is-globe .hs-world__zone {
  background: color-mix(in srgb, var(--hs-zone) 6%, #f6f8fb);
  box-shadow: inset 4px 0 0 var(--hs-zone);
  animation: hs-world-card 0.22s ease;
}

@keyframes hs-world-card {
  from {
    opacity: 0;
  }
}

@media (max-width: 599px) {
  .hs-world__box {
    padding: 20px 18px;
  }

  .hs-world .hs-world__title {
    font-size: 20px;
  }

  .hs-globe {
    width: 100%;
  }

  .hs-world .hs-world__chip {
    min-height: 38px;
    padding: 0 14px 0 10px;
    font-size: 13.5px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hs-globe *,
  .hs-world.is-globe .hs-world__zone {
    animation: none !important;
  }

  .hs-globe__pulse {
    opacity: 0.3;
  }
}

/*
 * Card instalments (D-165): under the price a soft line, what the cards allow and "See
 * the instalment options" (the world button's link style). The dialog the world
 * dialog's frame; the options a table whose rows are soft cards (amounts only, no rate):
 * single payment tinted orange, "at the cash price" green with its tag under the total.
 */
.hs-inst {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  align-items: center;
  margin: 2px 0 0;
  padding: 10px 14px;
  font-size: 15px;
  line-height: 1.4;
  background: color-mix(in srgb, var(--hs-blue-600, #0070e0) 6%, var(--hs-surface, #fff));
  border-radius: max(calc(14px * var(--hs-corner-scale, 1)), var(--hs-r-min, 4px));
  corner-shape: var(--hs-corner-shape, round);
}

.hs-inst[hidden] {
  display: none;
}

.hs-inst__text {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-weight: 700;
}

.hs-inst__text > .hs-icon {
  flex: none;
  color: var(--hs-blue-600, #0070e0);
}

.hs-buy .hs-inst__open,
.hs-buy .hs-inst__open:is(:hover, :focus, :active) {
  display: inline-flex;
  gap: 2px;
  align-items: center;
  margin: 0;
  padding: 0;
  font: inherit;
  font-weight: var(--hs-fw-strong, 800);
  /* The button blue gives 4.4:1 on the box's blue tint, short of 4.5:1 for 15 px text; its
     hover blue gives 6.3:1. */
  color: var(--hs-blue-700, #185c9f);
  background: transparent;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}

.hs-buy .hs-inst__open:hover {
  color: color-mix(in srgb, var(--hs-blue-700, #185c9f) 80%, #000);
}

.hs-buy .hs-inst__open .hs-inst__arrow {
  flex: none;
  transition: translate 0.15s ease;
}

.hs-buy .hs-inst__open:hover .hs-inst__arrow {
  translate: 3px 0;
}

.hs-buy .hs-inst__open:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
  border-radius: 6px;
}

.hs-inst-dialog {
  width: min(600px, calc(100vw - 32px));
  max-height: min(92vh, 900px);
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 0;
  border-radius: var(--hs-radius-xl, 28px);
  corner-shape: var(--hs-corner-shape, round);
  box-shadow: 0 24px 64px -16px rgb(31 37 71 / 35%);
  overscroll-behavior: contain;
}

.hs-inst-dialog::backdrop {
  background: rgb(31 37 71 / 45%);
}

.hs-inst-dialog__box {
  padding: 24px;
}

.hs-inst-dialog__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hs-inst-dialog .hs-inst-dialog__title {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.25;
}

.hs-inst-dialog .hs-inst-dialog__close,
.hs-inst-dialog .hs-inst-dialog__close:is(:hover, :focus, :active) {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  color: var(--hs-ink, #1f2547);
  background: #f4f6f9;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  cursor: pointer;
}

.hs-inst-dialog .hs-inst-dialog__close:hover {
  background: #e9edf3;
}

.hs-inst-dialog .hs-inst-dialog__close:focus-visible {
  outline: 2px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-inst-dialog__lead {
  margin: 10px 0 14px;
  color: var(--hs-muted, #5b6180);
  font-size: 15px;
  line-height: 1.55;
}

.hs-inst-dialog__lead strong {
  color: var(--hs-ink, #1f2547);
  white-space: nowrap;
}

.hs-inst-dialog__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.hs-inst-dialog__card {
  padding: 4px 11px;
  font-size: 13px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 1.5px solid var(--hs-line, #e6e9f0);
  border-radius: 999px;
}

.hs-inst-table {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: separate;
  border-spacing: 0 6px;
  font-size: 15px;
}

.hs-inst-table thead th {
  padding: 0 14px 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--hs-muted, #5b6180);
  text-align: start;
  background: none;
  border: 0;
}

.hs-inst-table thead th:not(:first-child),
.hs-inst-table td {
  text-align: end;
}

.hs-inst-table__row > * {
  padding: 12px 14px;
  vertical-align: middle;
  background: #f6f8fb;
  border: 0;
}

.hs-inst-table__row > :first-child {
  border-start-start-radius: var(--hs-r-lg, 18px);
  border-end-start-radius: var(--hs-r-lg, 18px);
}

.hs-inst-table__row > :last-child {
  border-start-end-radius: var(--hs-r-lg, 18px);
  border-end-end-radius: var(--hs-r-lg, 18px);
}

.hs-inst-table__count {
  font-weight: 600;
  text-align: start;
  white-space: nowrap;
}

.hs-inst-table__count strong {
  font-size: 17px;
  font-weight: 900;
}

.hs-inst-table__each {
  font-size: 16px;
  font-weight: 800;
  white-space: nowrap;
}

.hs-inst-table__total {
  white-space: nowrap;
}

.hs-inst-table__total > span[data-hs-inst-total] {
  display: block;
  font-weight: 700;
}

.hs-inst-table__tag {
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--hs-muted, #5b6180);
}

.hs-inst-table__row.is-cash > * {
  background: color-mix(in srgb, var(--hs-orange-600, #e06c00) 7%, #fff);
}

.hs-inst-table__row.is-cash .hs-inst-table__each {
  color: var(--hs-orange-600, #e06c00);
}

.hs-inst-table__row.is-free > * {
  background: color-mix(in srgb, var(--hs-green, #2b7a3d) 8%, #fff);
}

.hs-inst-table__row.is-free .hs-inst-table__tag {
  color: var(--hs-green, #2b7a3d);
}

.hs-inst-dialog__notes {
  display: grid;
  gap: 6px;
  margin: 14px 0 0;
  padding: 14px 16px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--hs-muted, #5b6180);
  list-style: none;
  background: #f6f8fb;
  border-radius: var(--hs-r-lg, 18px);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-inst-dialog__notes li {
  position: relative;
  padding-inline-start: 14px;
}

.hs-inst-dialog__notes li::before {
  position: absolute;
  inset-inline-start: 0;
  top: 0.62em;
  width: 5px;
  height: 5px;
  content: '';
  background: currentcolor;
  border-radius: 50%;
}

@media (max-width: 599px) {
  .hs-inst-dialog__box {
    padding: 20px 16px;
  }

  .hs-inst-dialog .hs-inst-dialog__title {
    font-size: 20px;
  }

  .hs-inst-table {
    font-size: 14px;
  }

  .hs-inst-table thead th,
  .hs-inst-table__row > * {
    padding-inline: 10px;
  }

  .hs-inst-table__row > * {
    padding-block: 10px;
  }

  .hs-inst-table__count strong {
    font-size: 16px;
  }

  .hs-inst-table__each {
    font-size: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hs-buy .hs-inst__open .hs-inst__arrow {
    transition: none;
  }
}

/* ─── About the product: each part its own card, no menu ──────────────────── */

.hs-info {
  display: grid;
  gap: 20px;
  margin-top: 48px;
}

/* The features and the delivery side by side on wide screens (when both are there). */
@media (min-width: 1024px) {
  .hs-info {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
    margin-top: 64px;
  }

  .hs-info__section {
    grid-column: 1 / -1;
  }

  .hs-info__section--features:has(+ .hs-info__section--delivery),
  .hs-info__section--features + .hs-info__section--delivery {
    grid-column: auto;
  }
}

.hs-info__section {
  min-width: 0;
  padding: 24px 18px 26px;
  background: #fff;
  border-radius: var(--hs-product-r);
  corner-shape: var(--hs-corner-shape, round);
  box-shadow:
    0 0 0 1px rgb(31 37 71 / 5%),
    0 28px 60px -36px rgb(31 37 71 / 26%);
  scroll-margin-top: 24px;
}

@media (min-width: 768px) {
  .hs-info__section {
    padding: 30px 32px 34px;
  }
}

@media (min-width: 1024px) {
  .hs-info__section {
    padding: 34px 40px 40px;
  }
}

.hs-info__section:focus {
  outline: none;
}

/* The title with its icon in a tinted circle (the account's cards). */
.hs-info__heading {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 0 0 20px;
  font-size: 22px;
  font-weight: 900;
  color: var(--hs-ink, #1f2547);
}

.hs-info__icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 44px;
  height: 44px;
  color: var(--hs-blue-600, #0070e0);
  background: #eef4ff;
  border-radius: 50%;
}

.hs-info__icon .hs-icon {
  --hs-icon-accent: var(--hs-orange-600, #e06c00);
}

.hs-info__text {
  max-width: 80ch;
  font-size: 17px;
  line-height: 1.75;
  color: var(--hs-muted, #5b6180);
}

.hs-info__text > :first-child {
  margin-top: 0;
}

.hs-info__text > :last-child {
  margin-bottom: 0;
}

.hs-info__text img {
  height: auto;
  border-radius: var(--hs-r-md, 14px);
}

.hs-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 36px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.hs-info__text + .hs-highlights {
  margin-top: 30px;
}

.hs-highlights:first-child {
  margin-top: 0;
}

.hs-highlight {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--hs-ink, #1f2547);
}

.hs-highlight__icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 54px;
  height: 54px;
  color: var(--hs-red, #e11d48);
  background: #ffe8ee;
  border-radius: 50%;
}

.hs-highlight--2 .hs-highlight__icon {
  color: var(--hs-blue-600, #0070e0);
  background: #e6f0ff;
}

.hs-highlight--3 .hs-highlight__icon {
  color: var(--hs-purple, #7c3aed);
  background: #f1e9ff;
}

.hs-highlight--4 .hs-highlight__icon {
  color: var(--hs-orange-600, #e06c00);
  background: #fff1e6;
}

.hs-highlight__icon .hs-icon {
  --hs-icon-accent: currentColor;
}

/* Features. */
.hs-specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 0 40px;
  margin: 0;
}

.hs-specs__row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  font-size: 16px;
  border-bottom: 1px solid var(--hs-line, #e6e9f0);
}

.hs-specs__row dt {
  font-weight: 600;
  color: var(--hs-muted, #5b6180);
}

.hs-specs__row dd {
  margin: 0;
  font-weight: 800;
  text-align: end;
  color: var(--hs-ink, #1f2547);
}

/* Shipping and delivery. */
.hs-delivery {
  display: grid;
  gap: 14px;
  max-width: 82ch;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-delivery__item {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 16px;
  line-height: 1.55;
  color: var(--hs-muted, #5b6180);
}

.hs-delivery__icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 46px;
  height: 46px;
  color: var(--hs-blue-600, #0070e0);
  background: #eef4ff;
  border-radius: 50%;
}

.hs-delivery__icon .hs-icon {
  --hs-icon-accent: var(--hs-orange-600, #e06c00);
}

/* ─── Reviews (the owner's design) ───────────────────────────────────────── */

.hs-rv {
  display: grid;
  gap: 28px;
}

@media (min-width: 960px) {
  .hs-rv {
    grid-template-columns: minmax(300px, 0.62fr) minmax(0, 1.38fr);
    gap: 32px;
    align-items: start;
  }
}

/* The left card: the score, the stars per rating, the filters, "Write a review". */
.hs-rv-side {
  overflow: hidden;
  padding-bottom: 24px;
  background: #fff;
  border-radius: calc(var(--hs-radius-lg, 20px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
  box-shadow:
    0 0 0 1px var(--hs-line, #e6e9f0),
    0 18px 40px -28px rgb(31 37 71 / 25%);
}

.hs-rv-score {
  position: relative;
  min-height: 190px;
  padding: 30px 28px 24px;
  background:
    radial-gradient(60% 90% at 100% 0%, rgb(255 205 226 / 70%), transparent 70%),
    radial-gradient(50% 80% at 90% 100%, rgb(201 225 255 / 70%), transparent 70%), #fff;
}

.hs-rv-score__picture {
  position: absolute;
  top: 0;
  right: 0;
  width: 52%;
  max-width: 220px;
  height: auto;
  pointer-events: none;
}

.hs-rv-score__value {
  position: relative;
  margin: 0;
  font-size: 64px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--hs-ink, #1f2547);
}

.hs-rv-score .hs-stars {
  --hs-stars-size: 28px;

  position: relative;
  margin-top: 10px;
}

.hs-rv-score__count {
  position: relative;
  margin: 8px 0 0;
  font-size: 17px;
  font-weight: 600;
  color: var(--hs-muted, #5b6180);
}

.hs-rv-bars {
  display: grid;
  gap: 2px;
  margin: 18px 0 0;
  padding: 0 20px;
  list-style: none;
}

.hs-rv .hs-rv-bar,
.hs-rv .hs-rv-bar:is(:hover, :focus, :active) {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 40px;
  gap: 14px;
  align-items: center;
  width: 100%;
  min-height: 34px;
  margin: 0;
  padding: 0 8px;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  color: var(--hs-muted, #5b6180);
  background: transparent;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
  cursor: pointer;
}

.hs-rv .hs-rv-bar:hover:not(:disabled) {
  background: var(--hs-surface-2, #f4f6f9);
}

.hs-rv .hs-rv-bar:disabled {
  cursor: default;
}

.hs-rv .hs-rv-bar:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: -2px;
}

.hs-rv-bar__stars {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.hs-rv-bar__star {
  width: 15px;
  height: 15px;
  background: var(--hs-orange, #f09820);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.9a1.1 1.1 0 0 1 1 .62l2.6 5.28 5.83.85a1.1 1.1 0 0 1 .61 1.88l-4.22 4.1 1 5.8a1.1 1.1 0 0 1-1.6 1.16L12 18.85l-5.22 2.74a1.1 1.1 0 0 1-1.6-1.16l1-5.8-4.22-4.1a1.1 1.1 0 0 1 .61-1.88l5.83-.85L11 2.52a1.1 1.1 0 0 1 1-.62Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.hs-rv .hs-rv-bar:disabled .hs-rv-bar__star {
  background: #cfd4e0;
}

.hs-rv-bar__track {
  height: 9px;
  overflow: hidden;
  background: #e8ebf2;
  border-radius: var(--hs-r-pill, 999px);
}

.hs-rv-bar__track > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #f58220, var(--hs-orange-600, #e06c00));
  border-radius: inherit;
}

.hs-rv-bar__number {
  text-align: end;
}

/* The customers' pictures: a strip of four, each opening in the viewer; "See all" filters. */
.hs-rv-gallery {
  margin: 22px 20px 0;
  padding-top: 20px;
  border-top: 1px solid var(--hs-line, #e6e9f0);
}

.hs-rv-gallery__head {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.hs-rv .hs-rv-gallery__title {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  color: var(--hs-ink, #1f2547);
}

.hs-rv .hs-rv-gallery__all,
.hs-rv .hs-rv-gallery__all:is(:hover, :focus, :active) {
  display: inline-flex;
  flex-shrink: 0;
  gap: 2px;
  align-items: center;
  margin: 0;
  padding: 4px 0;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  color: var(--hs-blue-600, #0070e0);
  background: none;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}

.hs-rv .hs-rv-gallery__all:hover {
  color: var(--hs-blue-700, #185c9f);
  text-decoration: underline;
}

.hs-rv .hs-rv-gallery__all:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
  border-radius: 4px;
}

.hs-rv-gallery__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-rv .hs-rv-gallery__item,
.hs-rv .hs-rv-gallery__item:is(:hover, :focus, :active) {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  background: var(--hs-surface-2, #f4f6f9);
  border: 0;
  border-radius: 12px;
  box-shadow: none;
  cursor: zoom-in;
}

.hs-rv-gallery__item :is(img, video) {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  transition: transform 0.3s ease;
}

.hs-rv .hs-rv-gallery__item:hover :is(img, video) {
  transform: scale(1.06);
}

.hs-rv .hs-rv-gallery__item:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-rv-gallery__play {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding-left: 2px;
  color: #fff;
  background: rgb(15 18 40 / 62%);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

/* The side's parts (the pictures, the filters) open alike: a line, then a 16 px title. */
.hs-rv .hs-rv-side__title {
  margin: 22px 20px 12px;
  padding-top: 20px;
  font-size: 16px;
  font-weight: 800;
  color: var(--hs-ink, #1f2547);
  border-top: 1px solid var(--hs-line, #e6e9f0);
}

/* Filters: what a review has, then its stars. Pressed as the site's chips are (blue tint,
   a check, the count in a blue badge): orange stays for the one action, "Write a review". */
.hs-rv-chips {
  display: grid;
  gap: 8px;
  padding: 0 20px;
}

.hs-rv-chips__row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hs-rv .hs-rv-chip,
.hs-rv .hs-rv-chip:is(:hover, :focus, :active) {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-height: 42px;
  margin: 0;
  padding: 0 7px 0 14px;
  font: inherit;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  background: #f4f6fa;
  border: 0;
  border-radius: var(--hs-r-pill, 999px);
  box-shadow: inset 0 0 0 1px transparent;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    box-shadow 0.15s ease,
    color 0.15s ease;
}

.hs-rv .hs-rv-chip:hover:not(.is-active) {
  background: #e9eef7;
}

.hs-rv .hs-rv-chip.is-active,
.hs-rv .hs-rv-chip.is-active:is(:hover, :focus, :active) {
  color: var(--hs-blue-700, #185c9f);
  background: var(--hs-account-tint-blue, #edf5fe);
  box-shadow: inset 0 0 0 1.5px var(--hs-blue-600, #0070e0);
}

.hs-rv .hs-rv-chip:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-rv-chip__icon,
.hs-rv-chip__check {
  display: inline-flex;
}

.hs-rv-chip__icon {
  color: var(--hs-muted, #5b6180);
}

.hs-rv-chip__check,
.hs-rv-chip.is-active .hs-rv-chip__icon {
  display: none;
}

.hs-rv-chip.is-active .hs-rv-chip__check {
  display: inline-flex;
  color: var(--hs-blue-600, #0070e0);
}

.hs-rv-chip__label {
  display: inline-flex;
  gap: 4px;
  align-items: center;
}

.hs-rv-chip__star {
  width: 15px;
  height: 15px;
  background: var(--hs-orange, #f09820);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.9a1.1 1.1 0 0 1 1 .62l2.6 5.28 5.83.85a1.1 1.1 0 0 1 .61 1.88l-4.22 4.1 1 5.8a1.1 1.1 0 0 1-1.6 1.16L12 18.85l-5.22 2.74a1.1 1.1 0 0 1-1.6-1.16l1-5.8-4.22-4.1a1.1 1.1 0 0 1 .61-1.88l5.83-.85L11 2.52a1.1 1.1 0 0 1 1-.62Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.hs-rv-chip__count {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  font-size: 12.5px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--hs-muted, #5b6180);
  background: #fff;
  border-radius: var(--hs-r-pill, 999px);
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
}

.hs-rv-chip.is-active .hs-rv-chip__count {
  color: #fff;
  background: var(--hs-blue-600, #0070e0);
}

/* A star filter marks its bar too. */
.hs-rv .hs-rv-bar.is-active,
.hs-rv .hs-rv-bar.is-active:is(:hover, :focus, :active) {
  color: var(--hs-blue-700, #185c9f);
  background: var(--hs-account-tint-blue, #edf5fe);
}

.hs-rv-write {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 58px;
  margin: 26px 20px 0;
  font-size: 19px;
  font-weight: 800;
  color: #fff !important;
  text-decoration: none;
  background: linear-gradient(180deg, var(--hs-orange-600, #e06c00), #d05a00);
  border-radius: var(--hs-r-pill, 999px);
  box-shadow: 0 10px 24px rgb(224 108 0 / 28%);
  transition:
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}

.hs-rv-write:hover {
  background: linear-gradient(180deg, #d05a00, var(--hs-orange-700, #c2410c));
  box-shadow: 0 12px 28px rgb(194 65 12 / 30%);
}

.hs-rv-write:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 3px;
}

.hs-rv-write__note {
  margin: 12px 20px 0;
  font-size: 14px;
  color: var(--hs-muted, #5b6180);
  text-align: center;
}

/* The right side: the order and the cards. */
.hs-rv-main {
  min-width: 0;
}

.hs-rv-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.hs-rv-status {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--hs-muted, #5b6180);
}

/* The sort: the catalogue's (its label beside the shop's outlined field; the list in our
   popover where the browser can draw it, field.css). */
.hs-rv-sort {
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  align-items: center;
}

.hs-rv-sort__label {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--hs-muted, #5b6180);
  white-space: nowrap;
}

.hs-rv-sort__field.hs-field--outlined {
  --hs-field-h: 2.75rem;
  --hs-field-bg: var(--hs-surface, #fff);

  width: 14rem;
}

.hs-rv-list {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hs-rv[aria-busy='true'] .hs-rv-list {
  opacity: 0.55;
  transition: opacity 0.2s ease;
}

.hs-rv-card {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 18px;
  padding: 22px 24px;
  background: #fff;
  border-radius: calc(var(--hs-radius-lg, 20px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
  box-shadow:
    0 0 0 1px var(--hs-line, #e6e9f0),
    0 14px 34px -28px rgb(31 37 71 / 30%);
  scroll-margin-top: 110px;
}

.hs-rv-card:focus {
  outline: none;
}

.hs-rv-card:target {
  box-shadow:
    0 0 0 2px var(--hs-orange-600, #e06c00),
    0 14px 34px -28px rgb(31 37 71 / 30%);
}

.hs-rv-card__avatar {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  font-size: 22px;
  font-weight: 800;
  color: var(--hs-blue-700, #185c9f);
  background: #e6f0ff;
  border-radius: 50%;
}

.hs-rv-card__avatar--2 {
  color: #be123c;
  background: #ffe8ee;
}

.hs-rv-card__avatar--3 {
  color: #6d28d9;
  background: #f1e9ff;
}

.hs-rv-card__avatar--4 {
  color: var(--hs-orange-700, #c2410c);
  background: #fff1e6;
}

.hs-rv-card__avatar--5 {
  color: #1f7a3d;
  background: #e8f6ec;
}

.hs-rv-card__avatar--6 {
  color: #0e7490;
  background: #e2f6fa;
}

.hs-rv-card__body {
  min-width: 0;
}

.hs-rv-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 22px;
}

.hs-rv-card__name {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  color: var(--hs-ink, #1f2547);
}

.hs-rv-card__verified {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 600;
  color: var(--hs-green, #2b7a3d);
}

.hs-rv-card__verified .hs-icon {
  --hs-icon-accent: #fff;

  color: #22a55b;
}

.hs-rv-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  margin-top: 8px;
  font-size: 14px;
  color: var(--hs-muted, #5b6180);
}

.hs-rv-card .hs-stars {
  --hs-stars-size: 20px;
}

.hs-rv-card__text {
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.65;
  color: #3a4064;
  overflow-wrap: anywhere;
}

.hs-rv-card__text p {
  margin: 0 0 0.6em;
}

.hs-rv-card__text p:last-child {
  margin-bottom: 0;
}

.hs-rv-card__media {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.hs-rv .hs-rv-media,
.hs-rv .hs-rv-media:is(:hover, :focus, :active) {
  position: relative;
  display: block;
  width: 170px;
  height: 140px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: var(--hs-product-backdrop, #ece6df);
  border: 0;
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
  box-shadow: none;
  cursor: zoom-in;
}

.hs-rv .hs-rv-media.is-video {
  width: 190px;
  cursor: pointer;
}

.hs-rv-media :is(img, video) {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.hs-rv .hs-rv-media:hover :is(img, video) {
  transform: scale(1.04);
}

.hs-rv .hs-rv-media:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

.hs-rv-media__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  margin: auto;
  padding-left: 3px;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 6px 16px -4px rgb(31 37 71 / 45%);
}

.hs-rv-media__time {
  position: absolute;
  right: 8px;
  bottom: 8px;
  padding: 2px 8px;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  background: rgb(15 18 38 / 72%);
  border-radius: 8px;
}

.hs-rv-card__reply {
  margin-top: 14px;
  padding: 14px 16px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--hs-muted, #5b6180);
  background: #fff8f2;
  border-radius: calc(var(--hs-radius-md, 14px) * var(--hs-corner-scale, 1));
  corner-shape: var(--hs-corner-shape, round);
}

.hs-rv-card__reply-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 800;
  color: var(--hs-orange-700, #c2410c);
}

.hs-rv-card__reply p {
  margin: 0;
}

.hs-rv-card__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 14px;
}

.hs-rv .hs-rv-like,
.hs-rv .hs-rv-like:is(:hover, :focus, :active) {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  margin: 0 0 0 -8px;
  padding: 0 10px;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  color: var(--hs-red, #e11d48);
  background: transparent;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
  cursor: pointer;
}

.hs-rv .hs-rv-like:hover {
  background: #fff1f3;
}

.hs-rv .hs-rv-like:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 1px;
}

.hs-rv-like__on,
.hs-rv-like[aria-pressed='true'] .hs-rv-like__off {
  display: none;
}

.hs-rv-like[aria-pressed='true'] .hs-rv-like__on {
  display: block;
}

.hs-rv-card__sep {
  width: 1px;
  height: 22px;
  background: var(--hs-product-field, #d5d9e4);
}

.hs-rv-card__reply-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  text-decoration: none;
}

.hs-rv-card__reply-link:hover {
  color: var(--hs-blue-600, #0070e0);
}

.hs-rv-menu {
  position: relative;
  margin-left: auto;
}

.hs-rv .hs-rv-menu__button,
.hs-rv .hs-rv-menu__button:is(:hover, :focus, :active) {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  color: var(--hs-muted, #5b6180);
  background: transparent;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  cursor: pointer;
}

.hs-rv .hs-rv-menu__button:hover,
.hs-rv .hs-rv-menu__button[aria-expanded='true'] {
  color: var(--hs-ink, #1f2547);
  background: var(--hs-surface-2, #f4f6f9);
}

.hs-rv .hs-rv-menu__button:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 1px;
}

.hs-rv-menu__list {
  position: absolute;
  z-index: 10;
  right: 0;
  bottom: calc(100% + 6px);
  display: grid;
  min-width: 220px;
  padding: 6px;
  background: #fff;
  border-radius: 14px;
  box-shadow:
    0 0 0 1px var(--hs-line, #e6e9f0),
    0 18px 40px -14px rgb(31 37 71 / 32%);
}

.hs-rv-menu__list[hidden] {
  display: none;
}

.hs-rv .hs-rv-menu__list button,
.hs-rv .hs-rv-menu__list button:is(:hover, :focus, :active) {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  margin: 0;
  padding: 0 12px;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  text-align: start;
  background: transparent;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
  cursor: pointer;
}

.hs-rv .hs-rv-menu__list button:hover,
.hs-rv .hs-rv-menu__list button:focus-visible {
  background: var(--hs-surface-2, #f4f6f9);
  outline: none;
}

.hs-rv .hs-rv-more-reviews,
.hs-rv .hs-rv-more-reviews:is(:hover, :focus, :active) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 52px;
  margin: 18px 0 0;
  padding: 0 22px;
  font: inherit;
  font-size: 16px;
  font-weight: 800;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border: 0;
  border-radius: var(--hs-r-pill, 999px);
  box-shadow: inset 0 0 0 1px var(--hs-product-field, #d5d9e4);
  cursor: pointer;
}

.hs-rv .hs-rv-more-reviews:hover {
  background: var(--hs-surface-2, #f4f6f9);
}

.hs-rv-more-reviews[hidden] {
  display: none !important;
}

/*
 * No reviews yet (D-166): across the whole section (not in the score's column), a soft
 * warm panel; five empty stars, the words, what writing one takes as three chips, and
 * "Write a review" as wide as its words (the whole width on phones).
 */
.hs-rv--empty {
  display: block;
}

.hs-rv-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 40px 28px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--hs-orange, #f09820) 12%, #fff) 0, transparent 62%),
    color-mix(in srgb, var(--hs-orange, #f09820) 4%, #fff);
  border-radius: var(--hs-radius-lg, 24px);
  corner-shape: var(--hs-corner-shape, round);
}

.hs-rv-empty__stars {
  display: inline-flex;
  gap: 6px;
  margin-bottom: 4px;
  color: color-mix(in srgb, var(--hs-orange, #f09820) 70%, #fff);
}

.hs-rv-empty__stars > .hs-icon {
  flex: none;
}

.hs-rv-empty__title {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--hs-ink, #1f2547);
}

.hs-rv-empty__text {
  max-width: 460px;
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--hs-muted, #5b6180);
}

.hs-rv-empty__steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  justify-content: center;
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
}

.hs-rv-empty__step {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 8px 14px 8px 11px;
  font-size: 14px;
  font-weight: 700;
  color: var(--hs-ink, #1f2547);
  background: #fff;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1.5px var(--hs-line, #e6e9f0);
}

.hs-rv-empty__step > .hs-icon {
  flex: none;
  color: var(--hs-orange-600, #e06c00);
}

.hs-rv-empty .hs-rv-write {
  min-width: 280px;
  margin: 14px 0 0;
  padding: 0 36px;
}

@media (max-width: 599px) {
  .hs-rv-empty {
    padding: 32px 18px;
  }

  .hs-rv-empty__title {
    font-size: 20px;
  }

  .hs-rv-empty__text {
    font-size: 15px;
  }

  /* Three even columns, the icon over the words. */
  .hs-rv-empty__steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }

  .hs-rv-empty__step {
    flex-direction: column;
    gap: 6px;
    justify-content: center;
    padding: 12px 6px;
    font-size: 12.5px;
    line-height: 1.3;
    border-radius: var(--hs-r-lg, 18px);
    corner-shape: var(--hs-corner-shape, round);
  }

  .hs-rv-empty .hs-rv-write {
    width: 100%;
    min-width: 0;
    padding: 0 20px;
  }
}

/* The zoom window with a review beside its pictures (product.js, Zoom with a panel):
   on wide screens the picture on the left and the review in a white column on the right;
   on narrow ones the review in a white sheet under the picture, its words folded to three
   lines with "Read more". */
.hs-zoom.has-aside[open] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
}

.hs-zoom.has-aside .hs-zoom__stage {
  position: relative;
  inset: auto;
  min-width: 0;
  min-height: 0;
}

.hs-zoom.has-aside :is(.hs-zoom__image, .hs-zoom__video) {
  max-width: calc(100% - 48px);
  max-height: calc(100% - 48px);
}

.hs-zoom__aside {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 84px 28px 32px;
  color: var(--hs-ink, #1f2547);
  background: #fff;
}

.hs-zoom.has-aside .hs-zoom__close,
.hs-zoom.has-aside .hs-zoom__close:is(:hover, :focus, :active) {
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
  color: var(--hs-ink, #1f2547);
  background: #f1f4fa;
  box-shadow: none;
}

.hs-zoom.has-aside .hs-zoom__close:hover {
  background: #e4e9f3;
}

.hs-zoom.has-aside .hs-zoom__close:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
}

.hs-zoom__who {
  display: flex;
  gap: 14px;
  align-items: center;
}

.hs-zoom__who .hs-rv-card__avatar {
  flex: none;
  width: 52px;
  height: 52px;
  font-size: 20px;
}

.hs-zoom__name-box {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.hs-zoom__name {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.hs-zoom__badge .hs-rv-card__verified {
  font-size: 14px;
}

.hs-zoom__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
  margin-top: 16px;
  font-size: 14px;
  color: var(--hs-muted, #5b6180);
}

.hs-zoom__text {
  margin-top: 14px;
  font-size: 15.5px;
  line-height: 1.65;
  color: #2c3354;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.hs-zoom__text p {
  margin: 0 0 10px;
}

.hs-zoom__text p:last-child {
  margin-bottom: 0;
}

.hs-zoom .hs-zoom__more,
.hs-zoom .hs-zoom__more:is(:hover, :focus, :active) {
  margin: 6px 0 0;
  padding: 2px 0;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  color: var(--hs-blue-600, #0070e0);
  background: none;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}

.hs-zoom .hs-zoom__more:hover {
  color: var(--hs-blue-700, #185c9f);
  text-decoration: underline;
}

.hs-zoom__more[hidden] {
  display: none;
}

.hs-zoom__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 20px 0 0;
  padding: 20px 0 0;
  list-style: none;
  border-top: 1px solid var(--hs-line, #e6e9f0);
}

.hs-zoom .hs-zoom__thumb,
.hs-zoom .hs-zoom__thumb:is(:hover, :focus, :active) {
  position: relative;
  display: block;
  overflow: hidden;
  width: 64px;
  height: 64px;
  margin: 0;
  padding: 0;
  background: #1d2327;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
  cursor: pointer;
  opacity: 0.72;
  transition: opacity 0.15s ease;
}

.hs-zoom .hs-zoom__thumb:hover,
.hs-zoom .hs-zoom__thumb[aria-current='true'] {
  opacity: 1;
}

/* The picture on show: the gallery's orange frame. */
.hs-zoom .hs-zoom__thumb[aria-current='true']::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: '';
  border-radius: inherit;
  box-shadow: inset 0 0 0 3px var(--hs-orange-600, #e06c00);
}

.hs-zoom__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hs-zoom__thumb.is-video::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 16px;
  content: '';
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  translate: -40% -50%;
}

.hs-zoom .hs-zoom__thumb:focus-visible {
  outline: 3px solid var(--hs-focus, #1f2547);
  outline-offset: 2px;
}

@media (max-width: 899px) {
  .hs-zoom.has-aside[open] {
    grid-template-rows: minmax(0, 1fr) auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .hs-zoom.has-aside :is(.hs-zoom__image, .hs-zoom__video) {
    max-width: calc(100% - 24px);
    max-height: calc(100% - 24px);
  }

  .hs-zoom__aside {
    max-height: 46dvh;
    padding: 20px 18px calc(18px + env(safe-area-inset-bottom, 0px));
    border-radius: 22px 22px 0 0;
    box-shadow: 0 -12px 32px rgb(0 0 0 / 28%);
    transition: max-height 0.25s ease;
  }

  .hs-zoom__aside.is-open {
    max-height: 78dvh;
  }

  /* Folded: three lines of words, the paragraphs run on. */
  .hs-zoom__aside:not(.is-open) .hs-zoom__text {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    white-space: normal;
  }

  .hs-zoom__aside:not(.is-open) .hs-zoom__text p {
    display: inline;
  }

  .hs-zoom__aside:not(.is-open) .hs-zoom__text p + p::before {
    content: ' ';
  }

  .hs-zoom__who .hs-rv-card__avatar {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }

  .hs-zoom__meta {
    margin-top: 10px;
  }

  .hs-zoom__text {
    margin-top: 10px;
    font-size: 15px;
  }

  .hs-zoom__thumbs {
    margin-top: 14px;
    padding-top: 14px;
  }

  .hs-zoom .hs-zoom__thumb,
  .hs-zoom .hs-zoom__thumb:is(:hover, :focus, :active) {
    width: 52px;
    height: 52px;
  }

  /* Over the picture here, not the white column: the window's own white button. */
  .hs-zoom.has-aside .hs-zoom__close,
  .hs-zoom.has-aside .hs-zoom__close:is(:hover, :focus, :active) {
    top: calc(12px + env(safe-area-inset-top, 0px));
    right: 12px;
    background: #fff;
    box-shadow: 0 8px 22px -6px rgb(0 0 0 / 40%);
  }

  .hs-zoom.has-aside .hs-zoom__close:focus-visible {
    outline-color: #fff;
  }

  .hs-zoom.has-aside :is(.hs-zoom__prev, .hs-zoom__next),
  .hs-zoom.has-aside :is(.hs-zoom__prev, .hs-zoom__next):is(:hover, :focus, :active) {
    width: 44px;
    height: 44px;
  }

  .hs-zoom.has-aside .hs-zoom__prev {
    left: 10px;
  }

  .hs-zoom.has-aside .hs-zoom__next {
    right: 10px;
  }

  .hs-zoom.has-aside .hs-zoom__count {
    bottom: 12px;
  }
}

@media (max-width: 767px) {
  .hs-rv-card {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    padding: 18px 16px;
  }

  .hs-rv-card__avatar {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }

  .hs-rv .hs-rv-media,
  .hs-rv .hs-rv-media:is(:hover, :focus, :active) {
    width: calc(33.33% - 7px);
    height: auto;
    aspect-ratio: 1;
  }

  .hs-rv .hs-rv-media.is-video {
    width: calc(50% - 5px);
    aspect-ratio: 4 / 3;
  }

  .hs-rv-toolbar {
    flex-wrap: wrap;
  }

  .hs-rv-sort {
    width: 100%;
  }

  .hs-rv-sort__field.hs-field--outlined {
    flex: 1;
    width: auto;
  }
}

/* ─── Related products ───────────────────────────────────────────────────── */

.hs-product .hs-product__related {
  margin-top: 64px;
}

/* ─── Phones: the bar with "Add to cart" ─────────────────────────────────── */

.hs-buybar {
  position: fixed;
  z-index: 90;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  visibility: hidden;
  background: rgb(255 255 255 / 96%);
  box-shadow: 0 -10px 30px -12px rgb(31 37 71 / 26%);
  transform: translateY(110%);
  transition:
    transform 0.25s ease,
    visibility 0s linear 0.25s;
  backdrop-filter: blur(12px);
}

.hs-buybar[hidden] {
  display: none;
}

.hs-buybar.is-shown {
  visibility: visible;
  transform: none;
  transition:
    transform 0.25s ease,
    visibility 0s;
}

.hs-buybar__inner {
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 720px;
  margin: 0 auto;
}

.hs-buybar__price {
  display: grid;
  flex: none;
  margin: 0;
  line-height: 1.1;
}

.hs-buybar__price .hs-buy__now {
  font-size: 22px;
}

.hs-buybar__price .hs-buy__now.is-range {
  font-size: 17px;
}

.hs-buybar__price .hs-buy__was {
  font-size: 14px;
}

.hs-buybar__price .hs-buy__off {
  display: none;
}

.hs-buybar .hs-buybar__add,
.hs-buybar .hs-buybar__add:is(:hover, :focus, :active) {
  flex: 1;
  min-height: 52px;
  padding: 0 18px;
  font-size: 17px;
}

@media (min-width: 1024px) {
  .hs-buybar {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  html.hs-buybar-on .hs-toast-region {
    bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  }
}

/* ─── Small phones ───────────────────────────────────────────────────────── */

@media (max-width: 767px) {
  .hs-product {
    padding-top: 12px;
  }

  .hs-product__top {
    margin-top: 14px;
  }

  .hs-gallery__stage {
    border-radius: calc(var(--hs-radius-lg, 20px) * var(--hs-corner-scale, 1));
  }

  .hs-buy .hs-wish.hs-wish--product,
  .hs-buy .hs-wish.hs-wish--product:is(:hover, :focus, :active),
  .hs-share .hs-share__button,
  .hs-share .hs-share__button:is(:hover, :focus, :active) {
    width: 46px;
    height: 46px;
  }

  .hs-qty {
    grid-template-columns: 40px 44px 40px;
    height: 58px;
    padding: 0 3px;
  }

  .hs-qty .hs-qty__step,
  .hs-qty .hs-qty__step:is(:hover, :focus, :active) {
    width: 40px;
  }

  .hs-buy .hs-buy__add,
  .hs-buy .hs-buy__add:is(:hover, :focus, :active) {
    padding: 0 16px;
    font-size: 17px;
  }

  .hs-info__heading {
    font-size: 20px;
  }

  .hs-info__icon {
    width: 40px;
    height: 40px;
  }

  .hs-highlights {
    display: grid;
    gap: 14px;
  }

  .hs-highlight__icon {
    width: 46px;
    height: 46px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hs-gallery .hs-gallery__arrow,
  .hs-zoom__image,
  .hs-buy .hs-buy__add,
  .hs-buybar,
  .hs-gallery__thumb::after {
    transition: none;
  }
}