/** Shopify CDN: Minification failed

Line 232:0 Unexpected "<"
Line 237:2 Comments in CSS use "/* ... */" instead of "//"
Line 246:2 Comments in CSS use "/* ... */" instead of "//"

**/
.deferred-media__poster {
  background-color: transparent;
  border: none;
  cursor: pointer;
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
  border-radius: calc(var(--border-radius) - var(--border-width));
}

.media > .deferred-media__poster {
  display: flex;
  align-items: center;
  justify-content: center;
}

.deferred-media__poster img {
  width: auto;
  max-width: 100%;
  height: 100%;
}

.deferred-media {
  overflow: hidden;
}

.deferred-media:not([loaded]) template {
  z-index: -1;
}

.deferred-media[loaded] > .deferred-media__poster {
  display: none;
}

.deferred-media__poster:focus-visible {
  outline: none;
  box-shadow: 0 0 0 var(--media-border-width) rgba(var(--color-foreground), var(--media-border-opacity)),
    0 0 0 calc(var(--media-border-width) + 0.3rem) rgb(var(--color-background)),
    0 0 0 calc(var(--media-border-width) + 0.5rem) rgba(var(--color-foreground), 0.5);
  border-radius: calc(var(--media-radius) - var(--media-border-width));
}

.deferred-media__poster:focus {
  outline: none;
  box-shadow: 0 0 0 var(--media-border-width) rgba(var(--color-foreground), var(--media-border-opacity)),
    0 0 0 calc(var(--media-border-width) + 0.3rem) rgb(var(--color-background)),
    0 0 0 calc(var(--media-border-width) + 0.5rem) rgba(var(--color-foreground), 0.5);
  border-radius: calc(var(--media-radius) - var(--media-border-width));
}

.global-media-settings--full-width .deferred-media__poster,
.global-media-settings--full-width .deferred-media__poster:is(:focus, :focus-visible) {
  border-radius: 0;
}

/* outline styling for Windows High Contrast Mode */
@media (forced-colors: active) {
  .deferred-media__poster:focus {
    outline: transparent solid 1px;
  }
}
.deferred-media__poster:focus:not(:focus-visible) {
  outline: 0;
  box-shadow: none;
}

.deferred-media__poster-button {
  background-color: rgb(var(--color-background));
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
  border-radius: 50%;
  color: rgb(var(--color-foreground));
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6.2rem;
  width: 6.2rem;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(1);
  transition: transform var(--duration-short) ease, color var(--duration-short) ease;
  z-index: 1;
}

.deferred-media__poster-button:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.deferred-media__poster-button .icon {
  width: 2rem;
  height: 2rem;
}

.deferred-media__poster-button .icon-play {
  margin-left: 0.2rem;
}

/* ======================= ALD OVERRIDES (stick these at the end) ======================= */

/* 3-column grid on desktop. The middle can’t collapse anymore. */
@media (min-width: 1400px){
  .template-product .product{
    display: grid !important;
    grid-template-columns: 300px minmax(820px, 1fr) 360px !important;
    gap: 24px !important;
    align-items: start;
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px){
  .template-product .product{
    display: grid !important;
    grid-template-columns: 280px minmax(700px, 1fr) 340px !important;
    gap: 24px !important;
  }
}
@media (min-width: 990px) and (max-width: 1199.98px){
  .template-product .product{
    display: grid !important;
    grid-template-columns: 240px minmax(560px, 1fr) 300px !important;
    gap: 24px !important;
  }
}
/* Mobile stacks cleanly */
@media (max-width: 989.98px){
  .template-product .product{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}

/* Kill Dawn’s 65/35 split widths that interfere with the grid. */
@media (min-width: 990px){
  .template-product .product--large:not(.product--no-media) .product__media-wrapper,
  .template-product .product--medium:not(.product--no-media) .product__media-wrapper,
  .template-product .product--small:not(.product--no-media) .product__media-wrapper,
  .template-product .product--large:not(.product--no-media) .product__info-wrapper,
  .template-product .product--medium:not(.product--no-media) .product__info-wrapper,
  .template-product .product--small:not(.product--no-media) .product__info-wrapper{
    max-width: none !important;
    width: auto !important;
    padding: 0 !important;
  }
}

/* Put Dawn parts into our columns. Sticky buy box like ALD. */
@media (min-width: 990px){
  .template-product .product__media-wrapper{ grid-column: 2; min-width: 0; }
  .template-product .product__info-wrapper{ grid-column: 3; position: sticky; top: 96px; }
  /* We’ll park accordions in the left (grid-column:1) via JS later if needed */
}

/* Keep your debug colours (no, I’m not letting them go). */
.template-product .product__media-wrapper{ background: rgba(0,128,255,.12); border: 2px solid rgba(0,128,255,.35); padding: 20px; box-sizing: border-box; }
.template-product .product__info-wrapper{  background: rgba(0,255,0,.12);  border: 2px solid rgba(0,255,0,.35);  padding: 20px; }
.template-product .product__accordion{      background: rgba(255,0,0,.12);  border: 2px solid rgba(255,0,0,.35);  padding: 20px; }

/* ======================= GALLERY: make it a big stacked column ======================= */

/* Dawn hides non-active slides. Reverse that so all images show stacked. */
.template-product.product--thumbnail .product__media-item:not(.is-active),
.template-product.product--thumbnail_slider .product__media-item:not(.is-active){
  display: block !important;
}

/* Hide sliders, counters, and thumbnail rails inside the media wrapper. */
.template-product .product__media-wrapper .thumbnail-slider,
.template-product .product__media-wrapper .thumbnail-list,
.template-product .product__media-wrapper .slider-buttons,
.template-product .product__media-wrapper .slider-counter{
  display: none !important;
}

/* Turn the list into a vertical stack. */
.template-product .product__media-wrapper .product__media-list,
.template-product .product__media-wrapper .product-media-list{
  display: block !important;
  padding-right: 0 !important;
}

/* Each media item fills the column width. */
.template-product .product__media-wrapper .product__media,
.template-product .product__media-wrapper .product-media-container,
.template-product .product__media-wrapper .product__media-item,
.template-product .product__media-wrapper .product__media-item > *{
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 24px;
  box-sizing: border-box;
}

/* Actual images/videos behave like sane citizens. */
.template-product .product__media-wrapper img,
.template-product .product__media-wrapper video{
  width: 100% !important;
  height: auto !important;
  object-fit: contain;
}

/* Safety: let the media custom element shrink within the grid cell. */
.template-product media-gallery,
.template-product .media-gallery{
  display: block;
  width: 100%;
  min-width: 0;
}

/* Title safety: no vertical writing nonsense. */
.template-product .product__title .h1,
.template-product .product__title h1{
  writing-mode: horizontal-tb !important;
  text-orientation: initial !important;
  transform: none !important;
}

/* Optional: hide Related Products while we build */
.template-product .related-products,
.template-product [data-section-type="related-products"]{
  display: none !important;
}

<script>
document.addEventListener('DOMContentLoaded', function(){
  const product = document.querySelector('.template-product .product');
  if (!product) return;

  // Ensure a left column exists
  let left = product.querySelector('.ald-left-slot');
  if (!left){
    left = document.createElement('aside');
    left.className = 'ald-left-slot product__accordion';
    left.style.gridColumn = '1';
    product.prepend(left);
  }

  // Move accordions into the left slot
  product.querySelectorAll('.product__accordion').forEach(function(acc){
    if (acc !== left) left.appendChild(acc);
  });
});
</script>