/** Shopify CDN: Minification failed

Line 359:4 Unexpected "}"

**/

    /* Media */
    video, img {
      height: 100%;
      width: 100%;
      object-fit: cover;
    }

    /* STORY VIEWER */
    .story-viewer {
      position: fixed;
      inset: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      background: rgba(0,0,0,0);
      opacity: 0;
      pointer-events: none;
      transition: background 0.35s ease, opacity 0.35s ease;
      z-index: 3;
    }

    .story-viewer.active {
background: rgb(0 0 0 / 65%);
    opacity: 1;
    pointer-events: auto;
    backdrop-filter: blur(8px);
    }

    .story-viewer-main {
      height: 100%;
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
    }

    .story-viewer-close {
    position: absolute;
        right: 2vw;
        top: 1.3vw;
        color: #fff;
        cursor: pointer;
        height: 2vw;
        justify-content: center;
        width: 2vw;
        z-index: 2;
        display: flex;
    }
    .story-viewer-close span{
      display:flex;
      align-items:center;
      justify-content:center;
      height:1.5vw;
      width:1.5vw;

    }
    .story-viewer-close span svg{
      height:100%;
      width:100%;
    }
    /* Container & Slider */
    .story-viewer-container {
      aspect-ratio: 3 / 5;
      height: 85svh;
      position: relative;
      overflow: hidden;
    }

    .story-inner-slider {
      height: 100%;
      width: 100%;
      display: flex;
      transition: transform 0.45s ease;
    }

    .story-slide {
      min-width: 100%;
      height: 100%;
      position: relative;
    }

    .story-title {
      position: absolute;
      top: 1vw;
      left: 1.5vw;
      text-transform:uppercase;
      z-index: 15;
      font-size: 1vw;
      font-weight: bold;
      color: #fff;
      mix-blend-mode: difference;
      font-family:var(--ca-font-display);
    }

    .story-full-media {
      height: 100%;
      width: 100%;
      object-fit: cover;
      border-radius: 10px;
    }

    /* Navigation */
    .story-viewer-navigation {
      position: absolute;
      top: 50%;
      width: 100%;
      transform: translateY(-50%);
    }

    .story-prev, .story-next {
cursor: pointer;
    display: none;
    justify-content: center;
    align-items: center;
    height: 3vw;
    width: 3vw;
    color: #000;
    background: #cececeb8;
    border-radius: 50%;
    font-size: 1.5vw;
    user-select: none;
    transition: 0.2s;
    line-height: 0.8;
    font-family: var(--ca-font-body);
    }

    .story-prev { left: calc(50% - 35vh); position:absolute; }
    .story-next { right: calc(50% - 35vh); position:absolute; }

    /* Progress Bar */
    .story-progress-container {
    position: absolute;
        top: 2vw;
        left: 50%;
        transform: translateX(-50%);
        height: 5px;
        width: 30vw;
        display: flex;
        gap: 2px;
        padding: 0 5px;
        box-sizing: border-box;
        z-index: 1;
    }


    .story-progress-segment {

      background: rgba(255, 255, 255, 0.2);
      border-radius: 2px;
      width:0;
    }

    /* Active segment */
    .story-progress-segment.active {
      width: 100%;
    }
    

    .story-viewer-pause{
      position: absolute;
      right: 5vw;
      top: 1.2vw;
      color: #fff;
      cursor: pointer;
      height: 1.8vw;
      justify-content: center;
      width: 1.8vw;
      z-index: 2;
      display: flex;
      align-items:center;
    }
     .story-viewer-pause span{
      height: 100%;
      width: 100%;
      display:none;
    }
    .story-viewer-pause .play-btn{
  display: flex;
      height: 70%;
      width: 70%;
    }
    .story-viewer-pause.pause .pause-btn{
      display:flex;
    }
    .story-viewer-pause.pause .play-btn{
      display:none;
    }

    

    
  .story-progress-container {
    position: absolute;
    top: 3.5vh;
    left: 50%;
    transform: translateX(-50%);
    width: 51vh;
    display: flex;
    gap: 4px;
    padding:0;
    z-index: 20;
  }

  .story-progress-segment {
    flex: 1;
    height: 3px;
    
    background:rgb(180 180 180 / 30%);
    overflow: hidden;
    border-radius: 2px;
  }

  .story-progress-segment span {
    display: block;
    height: 100%;
    width: 0%;
    
    background: #b5b5b5;
  }

    

.story-viewer .story-content-link{
position: absolute;
    z-index: 1;
    color: #ffffff;
    height: fit-content;
    width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
    padding: 0.5vw 0.9vw;
    
    background: #ffffff26;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 8px 32px #0000001a, inset 0 1px #ffffff8c, inset 0 -1px #ffffff54, inset 0 0 20px 10px #00000038;
    border-radius: 5rem;
    bottom: 4vw;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.75vw;
    font-family: var(--ca-font-body);
  }


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

      .story-viewer{
        z-index: 5;
        display:none !important;
        background:#ffffff !important;
        background-color:#ffffff !important;
        height:100dvh;
        top:0;
        left:0;
        width:100%;
      }
      .story-viewer.active{
        display:flex !important;
      }

      .story-viewer-container{
        height: 100%;
        width: 100%;
      }
      .story-progress-container{
        width:100%;
            top: 3vw;
            padding:0 5px;
      }
      .story-viewer-close{
          height: 6vw;
          width: 6vw;
          top: 7.5vw;
          right: 3vw;
          mix-blend-mode: difference;
          align-items: center;
      }
      .story-viewer-close span{
           height: 83%;
        width: 83%;
      }
      .story-title{
  top: 7.5vw;
          font-size: 3.5vw;
          left: 3vw;
      }
      .story-viewer-navigation {
      position: absolute;
      top: 0;
      height:100%;
      width: 100%;
      transform:unset;
      pointer-events:none;
    }

    .story-prev, .story-next {
      height: 100%;
      width: 30%;
      color: transparent;
      background: transparent;
      border-radius: unset;
      
    }
    .story-viewer.active .story-prev,
    .story-viewer.active .story-next {
      pointer-events:all;
    }
    .story-prev,
    .story-next {
      -webkit-tap-highlight-color: transparent; /* For iOS & Chrome mobile */
      outline: none; /* Remove focus outline */
      display:flex !important;
    }
    .story-prev { left: 0;}
    .story-next { right: 0; }

   .story-progress-bar{
      width: 96%;
      height: 3px;
      background: #c6c6c64d;
      position: absolute;
      top: 4px;
      left: 2%;
    }
     .story-progress-bar span{
      display: block;
      width: 0%;
      background: #fff;
      height: 100%;
    }
     .story-progress-bar span.inc-prog{
      width: 100%;
    }

    .story-viewer-pause {
      right: 13vw;
  top: 7.5vw;
          height: 6vw;
          width: 6vw;
          mix-blend-mode: difference;
    }

.story-viewer .story-content-link{
font-size: 3vw;
        padding: 2vw 4.2vw;
        bottom: 18vw;
}
}
    }
