.tube-xlogo{

}

.cz-card-box{

   
}

.paygo-card h3{
color: #000;

letter-spacing: 0.72px;
    font-size: 18px;
    font-family: ElmsSans-Semibold;
    /* font-weight: 700; */
    letter-spacing: 1.80px;
    text-transform: uppercase;
   
}
.paygo-card h3 span{
    color: #FF2424;

}

.paygo-card .para-txt{
        color: #010101;
    font-family: ElmsSans;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 180%;
    letter-spacing: 0.42px;
}
.tubestreambox{
    background: #fff;
    border-radius: 8px;
        font-family: ElmsSans;
        box-shadow: -1px 4px 5px 0 rgba(0, 0, 0, 0.09);
            box-shadow: 0px 2px 5px 0 rgba(0, 0, 0, 0.09);

}

.paygo-card .heading{
    color: #000;
text-align: justify;
 font-family: ElmsSans-Bold;
font-size: 24px;
font-style: normal;
font-weight: 800;
line-height: 150%; /* 48px */
text-transform: uppercase;
}

.paygo-card .infotext{
    color: #000;
text-align: justify;
    font-family: ElmsSans;
font-size: 15px;
font-style: normal;

line-height: 150%; /* 22.5px */
text-transform: capitalize;
}
.paywatch-about h2{
color: #000;
 font-family: ElmsSans-Bold;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 42px */
text-transform: uppercase;
}

.paywatch-about p{
color: #000;
       font-family:ElmsSans ;
font-size: 14.844px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 25.267px */
}
.movie-info-sec .duration-text{
    color: #2D2D2D;
text-align: justify;
  font-family:ElmsSans-Light ;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 22.5px */
letter-spacing: 0.75px;
}
.paywatch-img-box{
    position: relative;
        overflow: hidden;
    border-radius: 5px;
}
.paywatch-img-box::after{
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0.56) 21.73%, rgba(0, 0, 0, 0.00) 31.03%), linear-gradient(119deg, rgba(0, 0, 0, 0.67) 5.02%, rgba(0, 0, 0, 0.00) 31.74%);


}
.movie-info-sec h4{
    color: #000;
 font-family: ElmsSans-Bold;
font-size: 21px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 31.5px */
letter-spacing: 0.63px;
}
.movie-info-sec .about-text{
    color: #000;
  font-family:ElmsSans-Light ;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 148%; /* 22.2px */
}
.movie-tags li{
    color: #000;
text-align: justify;
 font-family: ElmsSans-semibold;
font-size: 15px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 22.5px */
letter-spacing: 0.45px;
list-style-type: none;

}
.movie-tags{
    gap: 8px;
}
.movie-info-sec .watch-btn{
    color: #FFF;
text-align: justify;
  font-family:ElmsSans ;
font-size: 15px;
font-style: normal;
padding: 4px 12px;
text-decoration: none;
line-height: 150%; /* 22.5px */
letter-spacing: 0.45px;
    border-radius: 5px;
background: linear-gradient(90deg, #F00 0%, #900 100%);
}
.movie-info-sec .more-link{
    color: #272727;
text-align: justify;
    font-family:ElmsSans-Light ;
font-size: 13.343px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 20.014px */
letter-spacing: 0.4px;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: none;
text-decoration-thickness: auto;
text-underline-offset: auto;
text-underline-position: from-font;
}
 .ribbon {
            position: absolute;
            top: 12px;
            left: 12px;
            background-color: #E0352B;
            color: #fff;
            padding: 6px 16px;
            font-size: 11px;
          font-family:ElmsSans-Medium ;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border-radius: 4px;
            z-index: 10;
            box-shadow: 0 2px 8px rgba(0,0,0,0.3);
            text-align: center;
               position: absolute;
            top: 20px;
            left: -29px;
      
            padding: 6px 36px;
          
            transform: rotate(323deg);
           
            font-size: 13px;
           
            border-bottom-left-radius: 2px;
            border-bottom-right-radius: 2px;
            border-top-left-radius: 0px;
            border-top-right-radius: 0px;
            text-transform: capitalize;
        }

      .ribbon{
           
        }

        .parywatch-listgroup > div{
    border-top: 1px solid #B4B4B4;

}
.parywatch-listgroup > div:nth-child(1){
    border-top:0px;

}
          @media (min-width:768px){
    .paywatch-about p{
        font-size: 14.844px;
    }
    .paywatch-about h2{
        font-size: 24px;
    }
     .paygo-card h3{
        font-size:20px;
    }
    .paygo-card .para-txt{
        font-size: 12px;
    }
    .paywatch-sec{
    margin-top: -90px;
    position: relative;
}
.paygo-card .heading{
    color: #f6f6f6;
    font-size: 32px;
}
.paygo-card .infotext{
    color: #f6f6f6;
}
.tubestreambox{
        box-shadow: -1px 4px 5px 0 rgba(0, 0, 0, 0.09);
}
.parywatch-listgroup  > div:nth-child(odd){
    border-right: 1px solid #B4B4B4;
}
.parywatch-listgroup > div{
    border-top: 1px solid #B4B4B4;

}
.parywatch-listgroup > div:nth-child(1),.parywatch-listgroup > div:nth-child(2){
   border-top: 0px;
}
   }
   @media (min-width:992px){
    .paywatch-about p{
        font-size: 16.844px;
    }
    .paywatch-about h2{
        font-size: 28px;
    }
    .paygo-card h3{
        font-size: 25px;
    }
    .paygo-card .para-txt{
        font-size: 14px;
    }
   }
   
        @media (max-width:560px){
                    .ribbon{
                      font-size: 10px;
                     
                   }

        }
        @media (max-width:400px){
            .ribbon{
        padding-left: 0px;
        padding-right: 19px;
        min-width: 48%;
        top: 11px;
        left: -35px;
            }
        }


    /* Logo */
        .logo {
            position: absolute;
            top: 30px;
            left: 50px;
            z-index: 100;
        }

        .logo img {
            height: 80px;
        }

        /* Menu Button */
        .menu-btn {
            position: absolute;
            top: 30px;
            right: 30px;
            z-index: 100;
            color: #333;
            padding: 10px 25px;
            cursor: pointer;
            transition: all 0.3s;
            font-weight: 500;
        }

      

        @media (max-width:560px){
                        .logo img {
    height: 44px;
}
.menu-btn{
        padding: 3px 18px;
            top: 18px;
                right: 15px;
}
.logo{
    top: 18px;
    left: 25px;
}
        }

/* ── Ribbon colour variants ── */
.coming-ribbon {
    background-color: #ffc107;
    color: #1a1a1a;
}

.ready-ribbon {
    background-color: #1DB954;
    color: #fff;
}

/* ── Trailer button (outline, overrides red gradient) ── */
.movie-info-sec .watch-btn.trailer-btn {
    background: transparent;
    color: #E0352B;
    border: 2px solid #E0352B;
}

.movie-info-sec .watch-btn.trailer-btn:hover {
    background: #E0352B;
    color: #fff;
}