/** Shopify CDN: Minification failed

Line 120:15 Unexpected "#0d1e0a"

**/
body {
  font-size: 16px;
  font-weight: normal;
  font-family: 'Public Sans', Arial, sans-serif;
}

header {
  top: -1px !important;
  z-index: 15 !important;
  background-color: white;
}

header cart-dot.ss-header-cart {
  position: relative;
}

header cart-dot.header__cart-dot .ss-header-icon-cart-fill {
  display: none;
}

header cart-dot.header__cart-dot.is-visible .ss-header-icon-cart-empty {
  display: none;
}

header cart-dot.header__cart-dot.is-visible .ss-header-icon-cart-fill {
  display: block;
}

header cart-dot.header__cart-dot .ss-header-icon-cart-count {
  display: none;
}

header cart-dot.header__cart-dot.is-visible .ss-header-icon-cart-count {
  display: block;
  position: absolute;
  top: 50%;
  left: -24px;
  width: 20px;
  text-align: right;
  transform: translateY(-50%);
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 14.1px;
  letter-spacing: 1px;
}

/* begin product page style code */

.product-notes-container .notes-content {
  list-style: none;
}

.product-notes-container .notes-content li {
  font-size: 14px;
  padding-left: 22px;
  position: relative;
  line-height: 24px;
}

.product-notes-container .notes-content li::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background-color: #0d1e0a;
}

.button-black {
  font-family: 'Public Sans', Arial, sans-serif;
  width: max-content;
  font-size: 12px;
  font-weight: 700;
  line-height: 12px;
  height: 32px;
  text-align: center;
  padding: 10px 20px;
  gap: 8px;
  border-radius: 3px;
  color: white;
  background: #0d1e0a;
  transition: all 0.5s;
  border: 1px solid #0d1e0a;
}

.button-black:hover {
  background: lightgrey !important;
  color: #0d1e0a;
}

.button-white {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 12px;
  height: 32px;
  text-align: center;
  padding: 10px 20px;
  gap: 8px;
  border-radius: 3px;
  color: #0d1e0a;
  width: max-content;
  background: white;
  transition: all 0.5s;
}

.button-white:hover {
  background: lightgrey !important;
  color: #0d1e0a;
}

.button-border-#0d1e0a {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 12px;
  height: 32px;
  text-align: center;
  padding: 10px 20px;
  gap: 8px;
  border-radius: 3px;
  color: #0d1e0a;
  width: max-content;
  border: 1px solid #0d1e0a;
}

/* begin product recomandation style code */
.product .complementary-products .complementary-products__header {
  cursor: auto;
}

.product .complementary-products .complementary-products__product-list {
  display: flex;
  column-gap: 12px;
  flex-wrap: wrap;
}

.product .complementary-products .complementary-products__product-list .horizontal-product-card {
  flex: 1;
  min-width: calc((100% / 3) - 8px);
  max-width: calc((100% / 3) - 8px);
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.product .complementary-products .horizontal-product-card .horizontal-product-card__figure {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 0.8;
}

.product .complementary-products .horizontal-product-card .horizontal-product-card__figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product .horizontal-product-card .horizontal-product-card__info .product-title {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: #0d1e0a;
}

.product .horizontal-product-card .horizontal-product-card__info .price-list {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 16.45px;
  color: #3c3c3c !important;
}

.font-uppercase {
  text-transform: uppercase;
}

.customize_standards_size-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.customize_standards_size-container .button.btn-customize_standards_size {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 15px;
  min-height: 32px;
  height: auto;
  text-align: center;
  padding: 10px 20px;
  gap: 8px;
  width: 100% !important;
  border-radius: 3px;
}

@media (max-width: 768px) {
  .customize_standards_size-container .button.btn-customize_standards_size {
    padding: 10px 25px;
  }
}

.customize_standards_size-container .explain-text {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 14.1px;
}

.product .product-info__block-item .prose {
  font-size: 15px;
}

.large-heading {
  font-size: 48px;
}

.heading1 {
  font-size: 36px;
  line-height: 40px;
}

.small-heading {
}

.sub-heading {
  font-size: 14px;
}

.title {
  font-size: 16px;
}

.text {
  font-size: 16px;
}

.text2 {
  font-size: 14px;
}

.font-700 {
  font-weight: 700;
}

.font-600 {
  font-weight: 600;
}

.font-500 {
  font-weight: 500;
}

.font-400 {
  font-weight: 400;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.display-flex {
  display: flex;
}

/* begin element alignment */
.disp-flex {
  display: flex;
}

.item-center {
  align-items: center;
}

.item-justify-center {
  justify-content: center;
}

.reviews-container .reviews-stars-rating {
  display: flex;
  gap: 3px;
  margin-bottom: 7px;
}

.reviews-container .reviews-description {
  display: flex;
  font-size: 14px;
  line-height: 24px;
  flex-direction: column;
}

.mt-20 {
  margin-top: 20px;
}

[data-calendar-theme="dark"].vanilla-calendar {
  background-color: transparent !important;
}

.btn-go-to-checkout {
  cursor: pointer;
}

/* begin account page style */
.customer-account-box {
  max-width: 600px;
  margin: auto;
}

/* begin custom cart information options style */
cart-drawer .grid.cart-drawer__items {
  gap: 0 !important;
  padding: 0;
}

cart-drawer line-item .gap-1.v-stack.justify-items-start {
  gap: 5px !important;
}

cart-drawer div:empty {
  display: none !important;
}

cart-drawer line-item > img {
  aspect-ratio: 0.9;
  object-fit: cover;
}

cart-drawer line-item .custom-information-options {
  display: flex;
  flex-direction: column;
}

cart-drawer line-item .custom-information-options .text-subdued {
  display: flex;
  column-gap: 10px;
  row-gap: 5px;
  width: 205px;
  max-width: 205px;
  flex-direction: column;
  font-size: 12px;
}

@media (max-width: 430px) {
  cart-drawer::part(content) {
    margin: 0 !important;
    min-width: 100% !important;
  }

  cart-drawer line-item .custom-information-options .text-subdued {
    max-width: 175px;
    min-width: 175px;
  }
}

cart-drawer line-item .custom-information-options .text-subdued li {
  padding-left: 0 !important;
}

/* begin account page product style */
.shopify-section--main-customers-account .grid.cart-drawer__items,
.customers-order .grid.cart-drawer__items {
  gap: 0 !important;
  padding: 0;
}

.shopify-section--main-customers-account line-item .gap-1.v-stack.justify-items-start,
.customers-order line-item .gap-1.v-stack.justify-items-start {
  gap: 5px !important;
}

.shopify-section--main-customers-account div:empty,
.customers-order div:empty {
  display: none !important;
}

.shopify-section--main-customers-account line-item > img,
.customers-order line-item > img {
  aspect-ratio: 0.9;
  object-fit: cover;
}

.shopify-section--main-customers-account line-item .custom-information-options,
.customers-order line-item .custom-information-options {
  display: flex;
  flex-direction: column;
}

.shopify-section--main-customers-account line-item .price-list + div,
.customers-order line-item .price-list + div {
  display: flex;
  flex-direction: column;
}

.shopify-section--main-customers-account line-item .price-list + div > .text-subdued,
.customers-order line-item .price-list + div > .text-subdued {
  display: flex;
  column-gap: 10px;
  row-gap: 5px;
  min-width: 250px;
  max-width: 500px;
  flex-wrap: wrap;
  font-size: 12px;
  text-transform: uppercase;
}

.shopify-section--main-customers-account line-item .custom-information-options .text-subdued li,
.customers-order line-item .custom-information-options .text-subdued li {
  padding-left: 0 !important;
}

/* product single accordion style */
.single-accordion-container {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.single-accordion-container .single-accordion-header {
  cursor: pointer;
  width: 100%;
  position: relative;
  padding-right: 30px;
}

.single-accordion-container .single-accordion-body {
  display: none;
}

.single-accordion-container .single-accordion-check {
  display: none;
}

.single-accordion-container .single-accordion-check:checked ~ .single-accordion-header {
  margin-bottom: 20px;
}

.single-accordion-container .single-accordion-header:after {
  content: "";
  position: absolute;
  top: calc(50% - 3px);
  right: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #0d1e0a;
  border-right: 2px solid #0d1e0a;
  transform: translate(-50%, -50%) rotate(135deg);
  transition: all 0.5s;
}

.single-accordion-container .single-accordion-check:checked ~ .single-accordion-header:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.single-accordion-container .single-accordion-check:checked ~ .single-accordion-body {
  display: block;
}

/* account page style */
.saved-sizes {
  /* display: none; */
}

/* begin help popup */
.ss-header-help-popup {
  display: flex;
  position: relative;
}

@media (max-width: 767px) {
  .ss-header-help-popup {
    display: none;
  }
}

.ss-header-help-popup-title {
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}

.ss-header-help-popup-body {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  min-width: 300px;
  transform: translateX(-50%);
}

.ss-header-help-popup:hover .ss-header-help-popup-body {
  display: block;
}

.ss-header-help-popup-body-content {
  background: #faf8f6;
  padding: 42px 45px;
  text-align: center;
  gap: 6px;
  display: flex;
  border: 1px solid #d9d9d9;
  flex-direction: column;
  transform: translateY(-2px);
}

.ss-header-help--item {
  font-size: 14px;
}

.ss-header-help--item.i-bold {
  font-weight: 700;
}

.ss-top-triangle {
  display: flex;
  position: relative;
  height: 13px;
}

.ss-top-triangle:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%);
  width: 0;
  height: 0;
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  border-bottom: 12px solid #d9d9d9;
}

.ss-top-triangle:after {
  content: "";
  position: absolute;
  top: 1px;
  left: 50%;
  transform: translate(-50%);
  width: 0;
  height: 0;
  border-left: 21px solid transparent;
  border-right: 21px solid transparent;
  border-bottom: 10px solid #faf8f6;
}

/* begin product short description */
.product-short-description {
  display: flex;
  gap: 4px;
  margin-bottom: 6px;
  align-items: center;
}

.product-short-description img {
  width: 18px;
  height: 18px;
  margin: 3px;
}

.product-short-description .product-short-description-text {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 14.1px;
  text-align: left;
  color: #0d1e0a;
  cursor: auto;
}

.ds-cart-shipping-date {
  margin: 6px 0 0 0;
  padding: 4px 10px;
}

/* begin product info style */
.product-info {
}

@media (max-width: 768px) {
  .ss-product-container {
    padding-bottom: 35px;
  }
}

.product-info .product-info__block-item {
  margin: 0 0 24px 0;
}

.product-info .product-info__block-item:last-child {
  margin-bottom: 0;
}

.product-info .product-info__block-item[data-block-type="description"] {
  margin-bottom: 32px;
}

.product-info .product-info__block-item .customize_standards_size-container {
  margin: 15px 0;
}

.product-info .product-info__block-item[data-block-type="title"] {
  margin-bottom: 15px;
}

.product-info .accordion {
  border-top: 1px solid #3c3c3c4d;
  border-bottom: 1px solid #3c3c3c4d;
}

.product-info .accordion summary {
  padding: 10px 0;
}

.product-info .accordion__toggle {
  padding: 0;
}

.product-info .product-info__block-item[data-block-type="accordion"] {
  margin-bottom: 0;
}

.product-info .accordion.no-border-accordion {
  border-top: none;
}

.product-info .product-info__block-item[data-block-type="accordion"]:first-child .accordion.no-border-accordion {
  border-top: 1px solid #3c3c3c4d;
}

/* begin product ss-complementary-products__header */

.product-info .ss-complementary-products .horizontal-product-card__info form {
  display: none;
}

.product-info .ss-complementary-products {
  border-top: 1px solid #3c3c3c4d;
  padding-top: 10px;
}

/* .product-info .ss-complementary-products {
    border-bottom: 1px solid #3C3C3C4D;
    gap: 20px;
}

.product-info .ss-complementary-products .ss-complementary-products__header {
    display: flex;
    gap: 10px;
    padding-bottom: 10px;
    justify-content: space-between;
} */

/* .product-info .ss-complementary-products input.ss-check-toggles-collapse {
    display: none;
}

.product-info .ss-complementary-products .ss-complementary-products__header .icon-chevron-down {
    transition: all 0.5s;
}

.product-info .ss-complementary-products input.ss-check-toggles-collapse:checked + .ss-complementary-products__header .icon-chevron-down {
    transform: rotate(180deg);
}

.product-info .ss-complementary-products .complementary-products__product-list {
    display: none;
}

.product-info .ss-complementary-products input.ss-check-toggles-collapse:checked  ~ .complementary-products__product-list {
    display: flex;
} */

/***********

    begin collection page style code

*************/

.ss-collection-banner-title {
  margin-bottom: 30px;
  padding-bottom: 0;
}

.ss-article-container {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 768px) {
  .ss-article-container {
    padding: 16px;
  }
}

/* begin cart page */
.cart-recap .cart-recap-content {
  flex: 1;
}

.ss-image-with-text-heading,
.ss-image-with-accordion-heading {
  font-weight: 500;
}

/* begin product hover image opacity animation */
.ss-hover-image-container {
  position: relative;
}

.ss-hover-image-container .ss-product-secondary-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.7s;
}

.ss-product-hover-animation:hover .ss-hover-image-container .ss-product-secondary-image {
  opacity: 1;
}

/* begin cart page sticky */
.ss-cart-sticky {
  position: sticky;
  top: 100px;
  height: fit-content;
  padding: 0;
  margin-bottom: 50px;
  margin-top: 50px;
  margin-right: 20px;
}

.secondary-image {
  /* display: none; */
  opacity: 0;
  transition: all 0.3s;
}

.show-secondary-image:has(.secondary-image):hover .secondary-image {
  /* display: block; */
  opacity: 1;
}

/* .show-secondary-image:has(.secondary-image):hover .primary-image {
  display: none;
} */

.ss-article-container {
  max-width: 800px;
}

@media (min-width: 900px) {
  article-toolbar .container {
    max-width: 860px !important;
  }
}

.product-gallery__media,
.js-collection__product-image {
  position: relative;
}

.product-gallery__media .product-badge,
.js-collection__product-image .product-badge {
  position: absolute;
  left: 20px;
  top: 20px;
}

.jx-collection-wrapper {
  text-align: center;
}

.jx-collection-wrapper .pagination {
  margin: 30px;
}




/* begin collection filter style */

.shopify-section--main-collection .container {
  margin-bottom: 30px;
}

.shopify-section--main-collection .js-collection__filter {
  display: flex;
  gap: 15px;
  align-items: center;
}

.shopify-section--main-collection .js-collection__filter .ss-clear-filters {
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 14.1px;
  text-align: center;
}

@media (min-width : 768px) {
  .ss-filter-form {
    display: flex;
    flex-wrap: wrap;
    width : 100%;
    gap: 15px;
  }
  
  .ss-filter-form .ss-filter-category {
    text-align: left;
    width: calc(50% - 10px);
  }

  .ss-filter-form .ss-filter-category .ss-fitler-col-lists {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 15px 0;
  }
  
}

@media (min-width : 850px) {
  .ss-filter-form .ss-filter-category {
    text-align: left;
    width: 33.33333%;
  }
}


@media (min-width : 1280px) {
  .ss-filter-form .ss-filter-category {
    text-align: left;
    width: 33.33333%;
  }
}

.ss-filter-form .ss-filter-category-title {
  pointer-events: none;
  font-family: 'Public Sans', Arial, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 23.5px;
  text-align: left;

}

.ss-filter-form .ss-filter-col-header {
  display: none;
}

.ss-filter-form .ss-filter-category .ss-filter-col-content {
  display: flex;
  flex-direction: column;
}

.ss-filter-form .ss-filter-actions {
  min-width: 100%;
  display: flex;
  gap : 20px;
  text-align: left;
  margin-top: 15px;
  flex-wrap: wrap;
}

.ss-filter-form .ss-filter-item {
  padding-left: 30px;
  position: relative;
}

.ss-filter-form .ss-filter-item::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: 1px solid #0d1e0a;
}

.ss-filter-form .ss-filter-item::after {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  left: 5px;
  transform: translateY(-50%) rotate(45deg);
  width: 6px;
  height: 9px;
  border-right: 2px solid white;
  border-bottom: 2px solid white;
  display: none;
}

.ss-filter-form .ss-filter-item:has(input:checked)::before {
  background: #0d1e0a;
}

.ss-filter-form .ss-filter-item:has(input:checked)::after {
  display: block;
}

.ss-filter-form .ss-filter-item input {
  position : absolute;
  top : 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
}


@media (max-width : 767px) {
  .ss-filter-form {
    margin: 20px 0;
  }

  .ss-filter-form .ss-filter-category:first-child {
    padding-top: 10px;
  }
  
  .ss-filter-form .ss-filter-category {
    text-align: left;
    padding: 20px 0;
    border-bottom: 1px solid #3C3C3C2B;
  }

  .ss-filter-form .ss-filter-category .ss-fitler-col-lists {
    display: grid;
    margin: 10px 0;
  }
}




.ss-filter-form .ss-form-submit {
  display: none;
}

.ss-clear-filters-all {
  display: none;
}




button.vanilla-calendar-day__btn.vanilla-calendar-day__btn_weekend:hover,
.vanilla-calendar-day.disabled button.vanilla-calendar-day__btn:hover {
  background-color: rgba(0, 0, 0, 0.1)!important;
}


.vanilla-calendar-arrow:before {
  min-width: 24px;
  max-width: 24px;
  height: 24px;
}

.vanilla-calendar-header .vanilla-calendar-header__content {
  pointer-events: none!important;
}

.cart-drawer__items .line-item-card:not(:first-child) {
  padding-top: 2rem;
}

.cart-drawer__items .line-item-card .remove-line-item-btn,
.cart-drawer__items .line-item-card .edit-line-item-btn {
  transition: all .3s ease;
}

.cart-drawer__items .line-item-card .remove-line-item-btn:hover,
.cart-drawer__items .line-item-card .edit-line-item-btn:hover {
  color: #0d1e0a;
}

.collection-banner-content-header {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

@media (min-width: 740px) {
  .collection-banner-content-header {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

@media (min-width: 1280px) {
  .mega-menu__linklist {
    gap: 40px;
  }
}

@media (min-width: 1400px) {
  .mega-menu__linklist {
    gap: 80px;
  }
}

@media (min-width: 1500px) {
  .mega-menu__linklist {
    gap: 135px;
  }
  .jx-collection-wrapper {
    max-width: 100% !important;
  }
}

::-webkit-scrollbar {
  width: 4px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: rgb(13 30 10);
  border-radius: 10px;
  border: transparent;
}

.product {
  align-items: unset;
}

.custom-max-w-xs {
  max-width: 660px;
}
.custom-max-w-sm {
  max-width: 760px;
}
.custom-max-w-md {
  max-width: 860px;
}
.custom-max-w-lg {
  max-width: 1150px;
}
.product-info .ss-complementary-products.hide-border {
  border-top: none;
  border-left: none;
  border-bottom: none;
  border-right: none;
}

.line-item-mtm-block {
  display: flex;
  align-items: center;
  background-color: #FAF8F6;
  border-radius: 3px;
  padding: 4px 12px;
  max-width: 370px;
}
@media (min-width: 768px) {
  .main-cart .line-item-mtm-block {
    padding: 12px;
    margin-top: 6px;
    margin-left: 9rem;
  }
}
.line-item-mtm-title {
  cursor: pointer;
  font-size: 12px;
  font-weight: 400;
}
.line-item-mtm-checkbox {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-right: 10px;
}

.form-status-hidden, .form-submited * {
  display: none;
}
.form-submited .form-status-hidden, .form-submited .form-status-hidden > * {
  display: block;
}

.spf-product-card-item {
  display: flex;
  width: 100%;
  height: 100%;
}
@media (min-width: 560px) {
  .spf-product-card-item {
    height: auto;
  }
}
.spf-product-card-item .spf-product-card__inner {
  width: 100%;
}
.spf-product-card-item .spf-product-card-item__content {
  padding: 0 5px;
}
.spf-product-card-item .spf-product-card-item__content h2 {
  font-size: 16px;
  line-height: 1.3;
}
.spf-product-card-item .spf-product-card-item__content-text {
  font-size: 12px;
  line-height: 1.2;
}
.spf-product-card-item .spf-product-card-item__content .link {
  font-size: 10px;
}
@media (min-width: 768px) {
  .spf-product-card-item .spf-product-card-item__content {
    padding: 0 .25rem;
  }
  .spf-product-card-item .spf-product-card-item__content .link {
    font-size: .75rem;
    line-height: 1rem;
  }
}
@media (min-width: 1024px) {
  .spf-product-card-item .spf-product-card-item__content {
    padding: 0 1.25rem;
  }
  .spf-product-card-item .spf-product-card-item__content h2 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
  .spf-product-card-item .spf-product-card-item__content-text {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (min-width: 700px) {
  .footer-social-media-block {
    margin-left: auto;
  }
}

/* Klaviyo popup title */
.klaviyo-form h1 span,
.klaviyo-form h1 span span {
  font-family: 'Cormorant Garamond', serif !important;
}

/* Klaviyo popup body - Public Sans */
.klaviyo-form p,
.klaviyo-form p span,
.klaviyo-form input,
.klaviyo-form button,
.klaviyo-form label {
  font-family: 'Public Sans', sans-serif !important;
}

@media screen and (max-width: 639px) {
  .shopify-section--image-with-text .prose {
    text-align: center;
  }
}

@media screen and (max-width: 639px) {
  .shopify-section--video-with-text .prose {
    text-align: center;
  }
}

/* =============================================
   HEADER — BOOKING CTA BUTTON
   ============================================= */

.header-booking-cta-wrap {
  display: none;
}

@media screen and (min-width: 768px) {
  .header-booking-cta-wrap {
    display: flex;
    align-items: center;
  }
}

/* ── HEADER – GRADIENT TRANSPARENCY (HOMEPAGE) ── */
:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.50) 0%,
    rgba(0, 0, 0, 0.00) 100%
  ) !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  transition: background 0.5s ease, border-color 0.5s ease !important;
}

:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .header__nav-icon,
:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .header__primary-nav a:not(.ss-header-help-popup-body a),
:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .header__primary-nav summary {
  color: #ffffff !important;
}

:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .header__secondary-nav svg path {
  fill: #ffffff !important;
}

.header.is-solid {
  transition: background 0.5s ease, border-color 0.5s ease !important;
}

/* Booking CTA — solid white when header is transparent */
:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .header-booking-cta-wrap .button {
  background-color: #ffffff !important;
  background-image: none !important;
  background-size: 0 !important;
  border: 1px solid #ffffff !important;
  color: #0d1e0a !important;
}

:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .header-booking-cta-wrap .button:hover {
  background-color: #f2f2f2 !important;
  border-color: #f2f2f2 !important;
  color: #0d1e0a !important;
}

/* How Can We Help — white text when header is transparent */
:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])) .ss-header-help-popup-title {
  color: #ffffff !important;
}

:has(.shopify-section:first-child [allow-transparent-header]) .header:not(.is-solid, :has([open])):hover {
  --header-show-transparent-logo: 1;
}
/* ==================================================================================================================
   HEADER NAVIGATION — desktop mega menu + mobile drawer
   ================================================================================================================== */

/* ------------------------------------------------------------------ Desktop mega menu */

.ss-mega-menu {
  --ss-promo-columns: 2;
  --ss-promo-gap: 2.5rem;
  --ss-promo-media-height: 24.3rem;

  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  row-gap: 3.25rem;
  padding-block: 2.5rem 3rem;
}

/* The base component is a row, so the "images on the left" modifier moves down to the body */
.ss-mega-menu.mega-menu--reverse,
.header__menu-disclosure .ss-mega-menu {
  flex-direction: column;
  justify-content: flex-start;
}

.ss-mega-menu__body {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  column-gap: var(--mega-menu-gap);
  width: 100%;
}

.ss-mega-menu.mega-menu--reverse .ss-mega-menu__body {
  flex-direction: row-reverse;
}

/* Utility row — booking button + inline search */

.ss-mega-menu__utility {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 1.75rem;
  row-gap: 1rem;
}

.ss-mega-menu__cta.button {
  min-width: 12.75rem;
  padding-block: 0.75rem;
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ss-mega-menu__search {
  display: flex;
  align-items: center;
  column-gap: 0.75rem;
  flex: 0 1 33.5rem;
  min-width: 14rem;
  padding: 0 1.25rem;
  border: 1px solid rgb(var(--border-color, 217 217 217));
  background: #ffffff;
}

.ss-mega-menu__search-input {
  flex: 1 1 auto;
  min-width: 0;
  height: 2.75rem;
  border: 0;
  background: transparent;
  font-size: 0.875rem;
  color: rgb(var(--text-color));
}

.ss-mega-menu__search-input::placeholder {
  color: rgb(var(--text-color) / 0.5);
}

.ss-mega-menu__search-input:focus {
  outline: none;
}

.ss-mega-menu__search-submit {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  color: rgb(var(--text-color) / 0.6);
  transition: color 0.2s ease-in-out;
}

.ss-mega-menu__search-submit:hover {
  color: rgb(var(--text-color));
}

/* Link columns — three across, wrapping onto as many rows as needed */

.ss-mega-menu__linklist {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 2.75rem;
  row-gap: 3.25rem;
  flex: 1 1 auto;
  max-width: 45rem;
}

.ss-mega-menu__linklist > * {
  max-width: none;
}

.ss-mega-menu__group-title {
  display: block;
  margin-block-end: 0.875rem;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
  color: rgb(var(--text-color));
}

.ss-mega-menu__sublist {
  display: grid;
  row-gap: 0.625rem;
}

.ss-mega-menu__link {
  display: block;
  text-align: start;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.5;
}

/* Promotional cards */

.ss-mega-menu__promo {
  display: grid;
  grid-auto-flow: row;
  grid-template-columns: repeat(var(--ss-promo-columns), minmax(0, 1fr));
  column-gap: var(--ss-promo-gap);
  flex: 0 1 auto;
}

.ss-mega-menu--promo-only .ss-mega-menu__promo {
  flex: 1 1 auto;
  width: 100%;
}

.ss-mega-menu__promo > * {
  display: flex;
  flex-direction: column;
  row-gap: 1.25rem;
  min-width: 0;
  max-width: none;
  text-align: start;
}

.ss-mega-menu__promo-media {
  height: var(--ss-promo-media-height);
  overflow: hidden;
}

.ss-mega-menu__promo-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ss-mega-menu__promo-heading {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25;
}

.ss-mega-menu__promo-text {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
}

@media screen and (max-width: 1399px) {
  .ss-mega-menu {
    --ss-promo-media-height: 19rem;
    --ss-promo-gap: 1.5rem;
  }

  .ss-mega-menu__linklist {
    column-gap: 2rem;
    row-gap: 2.5rem;
  }
}

/* ------------------------------------------------------------------ Mobile drawer */

/* Sit flush under the header, using dvh so mobile browser chrome is accounted for */
.ss-sidebar.drawer::part(base) {
  top: var(--header-height, 60px);
  height: calc(100dvh - var(--header-height, 60px));
}

.ss-sidebar::part(overlay) {
  top: var(--header-height, 60px);
  min-height: calc(100dvh - var(--header-height, 60px));
}

.ss-sidebar {
  --drawer-max-width: 100vw;
}

/* Both panels fill the drawer exactly, so the scroller scrolls and the footer stays pinned.
   The dialog element sets `display` inline, so the collapsible panel is only re-laid out while open. */
.ss-sidebar .header-sidebar__main-panel,
.ss-sidebar .header-sidebar__collapsible-panel {
  height: calc(100dvh - var(--header-height, 60px));
  width: 100%;
  background: #ffffff;
}

.ss-sidebar .header-sidebar__main-panel {
  grid-template-rows: minmax(0, 1fr) auto;
  grid-template-columns: minmax(0, 1fr);
}

.ss-sidebar .header-sidebar__collapsible-panel[open] {
  display: flex !important;
  flex-direction: column;
}

/* The theme takes the sub-panel scroller out of flow above 1000px; keep it in flow so the footer stays below it */
.ss-sidebar .header-sidebar__collapsible-panel .header-sidebar__scroller {
  position: static;
  inset: auto;
  flex: 1 1 auto;
  min-height: 0;
}

.ss-sidebar__scroller {
  padding-block-start: 1.5rem;
}

.ss-sidebar__scroller--sub {
  padding-block-start: 0;
  padding-inline: 0;
}

/* First level items */

.ss-sidebar__item {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25;
  color: rgb(var(--text-color));
}

/* Sub-panels */

.ss-sidebar__panel:not([hidden]) {
  animation: ss-sidebar-panel-in 0.2s ease both;
}

@keyframes ss-sidebar-panel-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.ss-sidebar__back.header-sidebar__back-button {
  margin-block-end: 0;
  padding-inline: var(--drawer-body-padding-inline);
  background: #faf8f6;
  border-block-end-color: rgb(var(--border-color) / 0.6);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgb(var(--text-color));
}

.ss-sidebar__panel-body {
  padding-block: 1.5rem 2rem;
  padding-inline: var(--drawer-body-padding-inline);
}

.ss-sidebar__panel-title {
  margin-block-end: 1rem;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.25;
  color: rgb(var(--text-color));
}

.ss-sidebar__search {
  flex: 1 1 auto;
  width: 100%;
  margin-block-end: 1.75rem;
}

/* Two-column group grid */

.ss-sidebar__groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.25rem;
  row-gap: 2.25rem;
}

.ss-sidebar__group-title {
  display: block;
  margin-block-end: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25;
  color: rgb(var(--text-color));
}

.ss-sidebar__sublist {
  display: grid;
  row-gap: 0.25rem;
}

.ss-sidebar__link {
  display: block;
  text-align: start;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: rgb(var(--text-color));
}

/* Promotional cards, two per row */

.ss-sidebar__promo.header-sidebar__promo {
  display: grid;
  /* the base component flows by column — reset it, or the explicit tracks collapse to zero */
  grid-auto-flow: row;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.25rem;
  row-gap: 1.75rem;
  margin-block-start: 0;
}

.ss-sidebar__promo > * {
  display: flex;
  flex-direction: column;
  row-gap: 0.625rem;
  min-width: 0;
  text-align: start;
}

.ss-sidebar__promo .ss-mega-menu__promo-media {
  height: auto;
  aspect-ratio: 3 / 4;
}

.ss-sidebar__promo .ss-mega-menu__promo-heading {
  font-size: 0.875rem;
}

.ss-sidebar__promo .ss-mega-menu__promo-text {
  font-size: 0.875rem;
  color: rgb(var(--text-color) / 0.75);
}

/* Footer CTAs. Both panels lay their children out so the footer already sits at the bottom —
   no sticky positioning, which would otherwise detach it while the page behind is scrolled. */

.ss-sidebar__footer.header-sidebar__footer {
  position: relative;
  background: #faf8f6;
  border-block-start: 1px solid rgb(var(--border-color) / 0.6);
  box-shadow: none;
}

.ss-sidebar__footer.header-sidebar__footer::before {
  display: none;
}

.ss-sidebar__footer-inner {
  display: grid;
  row-gap: 0.75rem;
  padding-block: 1.25rem;
  padding-inline: var(--drawer-footer-padding-inline);
}

.ss-sidebar__footer-button.button {
  width: 100%;
  min-width: 0;
  padding-block: 0.875rem;
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ss-sidebar__footer .localization-selectors {
  padding: 0;
  border-block-start: 0;
  justify-content: center;
}

/* ------------------------------------------------------------------ Tablet uses the mobile drawer

   The header grid centres the logo by giving both side columns an equal 1fr, so the primary nav only
   ever gets half the space left over from the logo, gutters and grid gaps. The four top-level items
   need ~450px, which means the inline nav does not fit until roughly 1230px — not ~980px as a naive
   sum of the parts suggests. So the hamburger and drawer are used below `xl`; the theme's own
   utilities switch at `md` (768px), which is far too early and leaves the nav wrapping. */

@media screen and (max-width: 1279px) {
  .header__primary-nav > button[aria-controls='sidebar-menu'] {
    display: block;
  }

  .header__primary-nav > ul,
  .header__secondary-nav > ul,
  .header__secondary-nav .localization-selectors {
    display: none;
  }
}

/* ==================================================================================================================
   MTM PRODUCT TEMPLATE (templates/product.mtm.json)
   ================================================================================================================== */

/* Design: each section heading sits left, full width, above a hairline rule.
   section-header centres itself by default, so stretch it on this template. */

.template-product-mtm .section-header {
  justify-self: stretch;
  width: 100%;
  text-align: left;
  border-block-end: 1px solid rgb(var(--border-color) / 0.6);
  padding-block-end: 0.875rem;
  /* .section-stack already provides the gap below the header; a margin here doubles it */
  margin-block-end: 0;
}

.template-product-mtm .section-header .prose,
.template-product-mtm .section-header .prose > * {
  text-align: left;
}

/* ----------------------------------------------------------------------------------------------------------------
   MTM FEATURE SECTION
   Heading over a full width rule, a narrow column of copy beside a media grid, and optional copy under the media.
   Mobile stacks media first, then the copy, matching the design.
   ---------------------------------------------------------------------------------------------------------------- */

.mtm-feature {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.mtm-feature__grid {
  order: 1;
  display: grid;
  grid-template-columns: repeat(var(--mtm-feature-columns, 2), minmax(0, 1fr));
  gap: var(--mtm-feature-gap, 1.5rem);
}

.mtm-feature__caption {
  order: 2;
}

.mtm-feature__text {
  order: 3;
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

/* The theme already makes the info column sticky on desktop (theme.css sets position:sticky on
   .product-info above 1000px, and <safe-sticky> handles a column taller than the viewport).
   A global `.product { align-items: unset }` further up this file stretches the column to the full
   row height, which leaves it nothing to scroll past. Restore the theme's value on this template
   only, so the existing sticky behaviour works without touching other product pages. */
@media screen and (min-width: 1000px) {
  .template-product-mtm .product {
    align-items: start;
  }
}

/* main-product's wrapper carries `overflow-hidden`, which makes it a scroll container and stops
   position:sticky working on anything inside it. `clip` clips the same way without creating one,
   so the horizontal clipping is kept. Guarded, so a browser without `clip` keeps today's
   behaviour rather than gaining a horizontal scrollbar. */
@supports (overflow: clip) {
  @media screen and (min-width: 1000px) {
    .template-product-mtm .shopify-section--main-product > .section-spacing {
      overflow-x: clip;
      overflow-y: visible;
    }
  }
}

/* The supporting line under the CTA is secondary to it, so set it below body size. */
.template-product-mtm .product-info__block-item[data-block-type='text'] .prose,
.template-product-mtm .product-info__block-item[data-block-type='text'] .prose p {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: rgb(var(--text-color) / 0.75);
}

/* ----------------------------------------------------------------------------------------------------------------
   MTM VIDEOS SECTION
   ---------------------------------------------------------------------------------------------------------------- */

.mtm-videos {
  display: grid;
  grid-template-columns: repeat(var(--mtm-videos-columns, 1), minmax(0, 1fr));
  gap: var(--mtm-videos-gap, 1.875rem);
}

.mtm-videos__item {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.mtm-videos__media {
  overflow: hidden;
}

.mtm-videos__media :is(video-media, video, img, svg) {
  display: block;
  width: 100%;
  height: auto;
}

.mtm-videos__embed {
  display: block;
  position: relative;
  width: 100%;
  padding: 0;
  border: 0;
  cursor: pointer;
  background: none;
  overflow: hidden;
}

.mtm-videos__embed img {
  display: block;
  width: 100%;
  height: auto;
}

.mtm-videos__play {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  translate: -50% -50%;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #fff center / 0.9rem no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 12'%3E%3Cpath d='M10 6 0 12V0z' fill='%230d1e0a'/%3E%3C/svg%3E");
  box-shadow: 0 2px 12px rgb(0 0 0 / 0.25);
  transition: scale 0.2s;
}

.mtm-videos__embed:hover .mtm-videos__play {
  scale: 1.08;
}

.mtm-videos__iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}

.mtm-videos__title {
  display: block;
  margin-block-end: 0.5rem;
  font-weight: 600;
}

.mtm-videos__text > * + * {
  margin-block-start: 1.25rem;
}

/* multi-column only pads its own bottom (pb-9 md:pb-[70px]) and has no setting for the top, so
   Videos and More MTM sat flush against the section above. Give them the same leading space the
   theme's .section-spacing sections use, and let that variable drive the gap on both sides. */
.template-product-mtm .shopify-section--multi-column > div:first-of-type {
  margin-block-start: var(--section-vertical-spacing);
  padding-block-end: 0;
}

/* The design shows the More MTM row two-up on mobile; multi-column stacks it to one.
   The id suffix comes from the section key in templates/product.mtm.json, so it is stable. */
@media screen and (max-width: 699px) {
  /* the section's own inline style sets these on an id selector, so override explicitly */
  .template-product-mtm [id$='__more_mtm'] {
    --multi-column-gap: 1.5rem !important;
    --multi-column-column-width: calc(50% - 0.75rem) !important;
  }
}

/* Tailwind preflight zeroes paragraph margins and .prose does not restore them,
   so give this section's copy its own rhythm rather than changing .prose globally. */
.mtm-feature .prose > * + * {
  margin-block-start: 1.25rem;
}

.mtm-feature__buttons {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}

.mtm-feature__item {
  display: block;
  overflow: hidden;
  aspect-ratio: var(--mtm-feature-aspect-ratio, auto);
}

.mtm-feature__item :is(img, video, svg) {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (min-width: 1000px) {
  .mtm-feature {
    display: grid;
    grid-template-columns: var(--mtm-feature-text-width, 27%) minmax(0, 1fr);
    column-gap: 4rem;
    row-gap: 2.5rem;
  }

  .mtm-feature--media-only {
    grid-template-columns: minmax(0, 1fr);
  }

  .mtm-feature__text {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }

  .mtm-feature--media-only .mtm-feature__grid,
  .mtm-feature--media-only .mtm-feature__caption {
    grid-column: 1;
  }

  .mtm-feature__grid {
    grid-column: 2;
    grid-row: 1;
  }

  .mtm-feature__caption {
    grid-column: 2;
    grid-row: 2;
  }
}

/* Reserve a Fitting menu: set the image shape instead of a fixed height */
.ss-mega-menu--promo-only .ss-mega-menu__promo-media {
  height: auto;
  aspect-ratio: 1 / 1;
}