/** Shopify CDN: Minification failed

Line 99:8 Expected identifier but found whitespace
Line 100:2 Unexpected "{"
Line 101:12 Expected ":"
Line 106:19 Expected identifier but found whitespace
Line 107:2 Unexpected "{"
Line 108:12 Expected ":"
Line 144:2 Unexpected "{"
Line 145:12 Expected ":"
Line 151:13 Expected ":"

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

  .hotspots-section .index-section {
    margin-bottom: 10px
  }
}

.hotspots-section .hotspots-wrapper {
  display: flex;
  flex-wrap: wrap
}

.hotspots-section .hotspots-wrapper.is-reverse {
  flex-direction: row-reverse;
}

.hotspots__title {
  width: 100%;
  padding-top: 1.5rem;
}

.hotspots {
  position: relative;
  width: 50%
}

@media only screen and (min-width: 768px) {
  .hotspots {
    padding-left: 40px;
    margin-left: -20px;
  }
}

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

  .hotspots {
    width: 100%
  }
}

.hotspots .grid__image-ratio img {
  opacity: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

[data-animate_images=true] .hotspots .grid__image-ratio img {
  opacity: 1
}

.hotspots__buttons {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hotspot__button {
  padding: 10px;
  border-radius: 50%;
  position: absolute;
  line-height: 0;
  transform: translate(-50%, -50%)
}

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

  .hotspot__button {
    padding: 6px
  }
}

.hotspot__button:hover .hotspot__button-content {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.hotspot__button-content {
  color: {
  {
    settings.color_body_text | default:
  "#1c1d1d"
  }
  };
  color: var(--colorTextBody);
  background-color: {
  {
    settings.color_body_bg | default:
  "#fff"
  }
  };
  background-color: var(--colorBody);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  padding: 1rem;
  position: absolute;
  top: calc(100% + 1rem);
  left: 50%;
  transform: translateX(-50%);
  transition: opacity 0.3s ease-in-out;
  min-width: 5rem;
  border-radius: 0px;
  box-shadow: 3px 3px 10px 3px rgba(0, 0, 0, 0.2)
}

.hotspot__button-content p, .hotspot__button-content span {
  white-space: nowrap;
  margin-bottom: 0
}

.hotspot__button-content:before {
  position: absolute;
  top: -10px;
  left: 50%;
  content: "";
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 5px 10px 5px;
  transform: translateX(-50%);

  border-color:transparent transparent {
  {
    settings.color_body_bg | default:

  "#fff"
  }
  }

  transparent;
  border-color: transparent transparent var(--colorBody) transparent;
}

.hotspot__button-content .content__prices {
  display: flex;
  flex-wrap: nowrap;
}

.hotspots__content {
  width: 50%;
  display: flex;
  align-items: center
}

.page-width .hotspots__content {
  padding-right: 0;
  padding-left: 40px
}

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

  .page-width .hotspots__content {
    padding-left: 0
  }
}

.page-width.is-reverse .hotspots__content {
  padding-left: 0;
  padding-right: 40px
}

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

  .page-width.is-reverse .hotspots__content {
    padding-right: 20px
  }
}

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

  .hotspots__content {
    width: 100%;
    padding: 1rem 20px 0
  }
}

.hotspot-content__block {
  display: none;
  max-height: 0;
  width: 100%;
  animation: fade-in .5s ease 0s forwards;
  position: sticky;
  top: 0

}

.modal-closing .hotspot-content__block, .modal-open .hotspot-content__block {
  animation: none;
  position: static

}

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

  .hotspot-content__block {
    align-items: center;
    position: relative;
    padding-top: 0

  }
}

.hotspot-content__block.is-active {
  display: block;
  max-height: none;
}

.hotspot-content__block .grid-product__image-wrap {
  margin: 0;
}

.hotspot-content__block .grid__item {
  display: block;
  float: none;
  padding: 0;
}

.hotspot-content__block .grid-product__tags {
  margin-left: 0;
}

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

  .hotspot-content__block .grid-product__tag {
    right: auto;
    left: 0
  }
}

.hotspot-content__block .grid-item__meta, .hotspot-content__block .grid-product__meta {
  display: flex;
  justify-content: center;
  flex-direction: column;
  flex-wrap: wrap;
  padding: 10px;
  text-align: left;
  position: absolute;
  bottom: 10px;
  background: white
}

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

  .hotspot-content__block .grid-item__meta, .hotspot-content__block .grid-product__meta {
    display: flex;
    justify-content: center;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 10px;
    text-align: left;
    position: absolute;
    bottom: 10px;
    background: white;
  }

  .hotspot-content__block .grid-item__meta .grid-item__meta-main, .hotspot-content__block .grid-item__meta .grid-item__meta-secondary, .hotspot-content__block .grid-product__meta .grid-item__meta-main, .hotspot-content__block .grid-product__meta .grid-item__meta-secondary {
    width: 100%;
    flex: none;
  }
}

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

  .hotspot-content__block .grid-product {
    padding-right: 0;
    padding-left: 0;
  }

  .hotspot-content__block .quick-add-btn {
    display: none;
  }

  .hotspot-content__block .grid-item__link, .hotspot-content__block .grid-product__link {
    display: block;
    flex-wrap: nowrap;
  }
  [data-grid-style=grey-round] .hotspot-content__block .grid-item__link {
    border-radius: 10px 0 0 10px
  }
  [data-grid-style=white-round] .hotspot-content__block .grid-item__link {
    border-radius: 10px 0 0 10px
  }

  .hotspot-content__block .grid-product__image-mask, .hotspot-content__block .grid-product__image-wrap, .hotspot-content__block .product-slider {
    width: 100%;
  }

  .hotspot-content__block .grid-product__actions {
    right: auto;
    left: 10px;
    top: 10px;
  }
}

.hotspot-content__block .modal .grid__item {
  float: left;
}
/* ==== Keep corners square on hover/focus/active ==== */

/* 1) Interactive elements (buttons, inputs, badges, pagination) */
:is(
  button,
  .button,
  .btn,
  .btn--primary,
  .btn--secondary,
  .btn--tertiary,
  .product-form__submit,
  .shopify-payment-button__button,
  .cart__checkout,
  .pagination__item,
  .badge,
  .tag,
  input,
  select,
  textarea,
  .field,
  .form__input,
  .quantity__input,
  .select__select
):is(:hover, :focus, :active, :focus-visible) {
  border-radius: 0 !important;
}

/* 2) Cards, images, banners and their wrappers */
:is(
  img,
  .media,
  .media img,
  .card,
  .card__media,
  .product-card,
  .product-item,
  .product-item__image-wrapper,
  .collection-grid-item,
  .collection-list__item,
  .article-card,
  .article-card__image,
  .banner,
  .banner__media,
  .slideshow,
  .slideshow__media,
  .image-with-text__media
):is(:hover, :focus-within) {
  border-radius: 0 !important;
}

/* 3) If the theme uses overlays/pseudo-elements that change radius on hover */
:is(
  .button,
  .btn,
  .card,
  .media,
  .banner,
  .slideshow,
  .product-card,
  .article-card
)::before,
:is(
  .button,
  .btn,
  .card,
  .media,
  .banner,
  .slideshow,
  .product-card,
  .article-card
)::after,
:is(
  .button,
  .btn,
  .card,
  .media,
  .banner,
  .slideshow,
  .product-card,
  .article-card
):is(:hover, :focus)::before,
:is(
  .button,
  .btn,
  .card,
  .media,
  .banner,
  .slideshow,
  .product-card,
  .article-card
):is(:hover, :focus)::after {
  border-radius: 0 !important;
}

/* 4) Some themes animate the border-radius on hover — cancel that animation */
:is(
  button,
  .button,
  .btn,
  .card,
  .media,
  .banner,
  .slideshow
) {
  transition: border-radius 0s !important;
}

/* 5) Rare case: radius applied via clip-path (used by a few Impulse versions) */
:is(
  .card,
  .card__media,
  .media,
  .banner__media,
  .slideshow__media,
  .product-item__image-wrapper,
  .image-with-text__media
) {
  -webkit-clip-path: inset(0 round 0) !important;
          clip-path: inset(0 round 0) !important;
}

/* 6) Quick add / app buttons that sometimes round on hover */
.quick-add__submit,
.quick-add__submit:is(:hover, :focus),
.shopify-payment-button__button--unbranded:is(:hover, :focus) {
  border-radius: 0 !important;
}
/* --- Lock square corners in the base state too --- */
:is(
  button, .button, .btn, .btn--primary, .btn--secondary, .btn--tertiary,
  .product-form__submit, .shopify-payment-button__button, .cart__checkout,
  .pagination__item, .badge, .tag,
  input, select, textarea, .field, .form__input, .quantity__input, .select__select,
  img, .media, .media img,
  .card, .card__media, .product-card, .product-item, .product-item__image-wrapper,
  .collection-grid-item, .collection-list__item,
  .article-card, .article-card__image,
  .banner, .banner__media, .slideshow, .slideshow__media, .image-with-text__media
):not(:hover):not(:focus):not(:active) {
  border-radius: 0 !important;
  -webkit-clip-path: inset(0 round 0) !important;
          clip-path: inset(0 round 0) !important;
}

/* --- If the theme resets corner variables per-component, force them back to 0 --- */
:root,
*, *::before, *::after {
  --radius: 0 !important;
  --border-radius: 0 !important;
  --buttons-radius: 0 !important;
  --inputs-radius: 0 !important;
  --card-radius: 0 !important;
  --image-radius: 0 !important;
  --badge-radius: 0 !important;
}

/* --- Overwrite inline styles that set a radius or radius vars --- */
[style*="border-radius"],
[style*="--radius"],
[style*="--border-radius"] {
  border-radius: 0 !important;
  --radius: 0 !important;
  --border-radius: 0 !important;
}

/* --- Cancel any border-radius animations in base state --- */
:is(button, .button, .btn, .card, .media, .banner, .slideshow) {
  transition: border-radius 0s !important;
}