@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/* RESET */
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family: "Oswald", sans-serif;
    /*font-family: "Montserrat", sans-serif;*/
    /*font-family: "Poppins", sans-serif;*/
}

.container{
    margin: 0px auto;
    padding: 0px 15px;
    width: 71%;
    
}
h2{
    font-family: "Montserrat", sans-serif;
    font-size: 3.8vw;
    font-weight: bold;
}
img{
  max-width: 100%;
  height: auto;
}



/** banner **/

.banner{
    margin: 0px 0px 0px 0px; 
    padding: 75px 0px 90px 0px;
    background: #000 url(../banner-bg-new.png) center -23vw no-repeat;
    background-size: cover;
    width: 100%;
    overflow: hidden;
}
img.banner-bottle {
  position: absolute;
  left: 50%;
  top: clamp(90px,25vw,15%);
  transform: translateX(-50%);
  width: clamp(180px,40vw,438px);
  filter: drop-shadow(0 0 35px rgba(255,180,0,0.6));
  animation: bottleFloat 4.5s ease-in-out infinite;
  width: 17vw;
}
a{
    text-decoration: none;
}
/** header **/


/* HEADER */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 25px 0;
    z-index: 9;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    background: rgba(255, 255, 255, 0);
    transition: 
        transform 0.6s cubic-bezier(.77,0,.18,1),
        backdrop-filter 0.4s ease,
        background 0.4s ease,
        box-shadow 0.4s ease;
}

/* Glass effect after scroll */
.header.scrolled {
  
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    background: rgba(0, 0, 0, .35);
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

/* Hide animation */
.header.hide {
    transform: translateY(-120%);
}


.header-row{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 9;
}
a.logo{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    width: max-content;
}
.header-menu{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
}
.header-menu ul{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    display: flex;
    list-style-type: none;
}
.header-menu ul li{
    margin: 0px 10px 0px 0px; 
    padding: 0px 0px 0px 0px;
}
.header-menu ul li a{
    margin: 0px 0px 0px 0px; 
    padding: 0px 5px 0px 5px;
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    display: block;
}
.header-menu ul li a:hover{
    color: #fff;
}
.header-menu ul li.last{
    margin: 0px 0px 0px 0px; 
} 




.btn{
    display:inline-block;
    padding:14px 32px;
    background: linear-gradient(120deg,#ff7a18,#ffb347,#ff7a18);
    background-size:200%;
    color:#fff;
    text-decoration:none;
    font-family: "Poppins", sans-serif;
    font-size: 20px;
    font-weight:bold;
    border: 2px solid #e7ae3d;
    border-radius:10px;
    position:relative;
    overflow:hidden;
    animation: pulse 2s infinite;
    transition:all 0.4s ease;
}

/* BUTTON GLOW */
.btn::after{
    content:'';
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background: radial-gradient(circle, rgba(255,255,255,0.35), transparent 60%);
    animation: shine 3s infinite;
}

/* BUTTON HOVER */
.btn:hover{
    background-position:100%;
    transform:scale(1.08);
}

/* BUTTON ANIMATIONS */
@keyframes pulse{
    0%{box-shadow:0 0 0 0 rgba(255,180,0,0.6);}
    70%{box-shadow:0 0 0 20px rgba(255,180,0,0);}
    100%{box-shadow:0 0 0 0 rgba(255,180,0,0);}
}

@keyframes shine{
    0%{transform:translateX(-100%);}
    100%{transform:translateX(100%);}
}





/** banner-upper **/

.banner-upper{
    margin: 160px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    z-index: 5;
}
.banner-upper1{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
}
.banner-upper1 h2 {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  font-family: "Oswald", sans-serif;
  font-size: 3.5vw;
  font-weight: 600;
  color: #fff;
  line-height: 90px;
}
.banner-upper1 h2 span {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  display: block;
  font-size: 7vw;
  font-weight: 600;
}
.banner-upper2{
    margin: 12vw 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
}
.glow-box{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 30px;
    background: url(../glow-box.png) center no-repeat;
    background-size: 100%; 
    width: 22.8vw;
    height: 8.1vw;
    display: flex;
    align-items: center;
}
.glow-box ul{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    list-style-type: none;
} 
.glow-box ul li{
    margin: 0px 0px 5px 0px; 
    padding: 0px 0px 0px 40px;
    font-family: "Poppins", sans-serif;
    font-size: 0.9vw;
    font-weight:600;
    color: #fff;
    background: url(../thunder.png) left center no-repeat;
    background-size: 39px 46px; 
}
.glow-box ul li.last{
    margin: 0px 0px 0px 0px; 
}

.banner-text{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    position: relative;
    z-index: 5;
}
.banner-text h3 {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  font-size: 52px;
  font-weight: 600;
  color: #fff;
}
.banner-text h1 {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  font-family: "Montserrat", sans-serif !important;
  font-size: 70px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient( 90deg, #ff3c2f, #ff8c2b, #ffd45a, #ff8c2b, #ff3c2f );
    background-size: auto;
    background-clip: border-box;
  background-size: 300% 100%;
  background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  line-height: 74px;
  animation: energyMove 6s linear infinite;
}

/* Gradient animation */
@keyframes energyMove{
    0%{
        background-position: 0% 50%;
    }
    100%{
        background-position: 300% 50%;
    }
}
.banner-text h1 span{
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif !important;
    color: #fff !important;
    background: transparent;
     -webkit-text-stroke:0px ;
    -webkit-text-fill-color:#fff;
}
a.buy-btn {
  margin: 60px auto 0px auto;
  display: flex;
  align-items: center;
  padding: 10px 32px;
  background: linear-gradient(120deg,#ff7a18,#ffb347,#ff7a18);
    background-size: auto;
  background-size: 200%;
  color: #fff;
  text-decoration: none;
  font-family: "Poppins", sans-serif;
  font-size: 29px;
  font-weight: bold;
  border: 2px solid #e7ae3d;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  animation: pulse 2s infinite;
  transition: all 0.4s ease;
  width: max-content;
}

/* BUTTON GLOW */
.btn-btn::after{
    content:'';
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background: radial-gradient(circle, rgba(255,255,255,0.35), transparent 60%);
    animation: shine 3s infinite;
}

/* BUTTON HOVER */
.btn-btn:hover{
    background-position:100%;
    transform:scale(1.08);
}

/* BUTTON ANIMATIONS */
@keyframes pulse{
    0%{box-shadow:0 0 0 0 rgba(255,180,0,0.6);}
    70%{box-shadow:0 0 0 20px rgba(255,180,0,0);}
    100%{box-shadow:0 0 0 0 rgba(255,180,0,0);}
}

@keyframes shine{
    0%{transform:translateX(-100%);}
    100%{transform:translateX(100%);}
}
a.buy-btn img.arrow-pic{
    margin: 0px 0px 0px 12px;
}


/* ===============================
   BOTTLE FLOAT + GLOW
================================ */

img.banner-bottle{
    animation: bottleFloat 4.5s ease-in-out infinite;
    filter: drop-shadow(0 0 35px rgba(255,180,0,0.6));
}

/* FLOATING EFFECT */
@keyframes bottleFloat{
    0%{
        transform: translate(-50%, 0);
    }
    50%{
        transform: translate(-50%, -18px);
    }
    100%{
        transform: translate(-50%, 0);
    }
}

/** what **/

.what{
    margin: 0px 0px 0px 0px;
    padding: 160px 0px 180px 0px;
    background: #f4f4f4;
}
.what-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.what-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}
.what1-text{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.what1-text h2{
    margin: 0px 0px 40px 0px;
    padding: 0px 0px 0px 0px;
}
.gradient-text{
    font-family: "Montserrat", sans-serif;
    background: linear-gradient( 90deg,
        #ff3c2f,
        #ff8c2b,
        #ffd45a,
        #ff8c2b,
        #ff3c2f);
    background-size: auto;
    background-clip: border-box;
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    background-size: 300% 100%;
    animation: energyMove 6s linear infinite;
}
.what1-text p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Poppins", sans-serif;
    font-size: 1.6vw;
    font-weight: normal;
}
.what1-text p.last{
    margin: 25px 0px 0px 0px;
} 
.what-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 60%;
}
img.what-bottle{
    width: 100%;
    animation: Floatbottle 4.5s ease-in-out infinite;
}
@keyframes Floatbottle{
    0%{
        transform: translateY(-3%);
    }
    50%{
        transform: translateY(0%);
    }
    100%{
        transform: translateY(-3%);
    }
}

/** who **/

.who{
    margin: 0px 0px 0px 0px;
    padding: 200px 0px 200px 0px;
}
.who h2{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    text-align: center;
} 
.who-row{
    margin: 90px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
    column-gap: 45px;
}
.who1{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
} 
img.who-profile{
    width: 100%;
    border-radius: 25px 25px 0px 0px;
}
.who1-text{
    margin: -5px 0px 0px 0px;
    padding: 15px 25px 15px 25px;
    width: 100%;
    height: 110px;
    background: linear-gradient(90deg, #793F19, #CF7D2F, #71421D, #1F1511);
    border-radius: 0px 0px 25px 25px;
    background-size: 300% 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
    position: relative;
    justify-content: center;
}
.who1-text2{
    width: 100%;
}
.who1-text::after{
    content:'';
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background: radial-gradient(circle, #CF7D2F, transparent 60%);
    animation: bgMove 3s linear infinite;
}

/* Gradient animation */
@keyframes bgMove{
    0%{transform:translateX(-100%);}
    100%{transform:translateX(100%);}
}   
.who1-text h4{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 1.4vw;
    font-weight: bold;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: 9;
} 
.who1-text h6{
    margin: 5px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 1vw;
    font-weight: 500;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: 9;
} 

/** feel **/

.feel {
  margin: 0px 0px 0px 0px;
  padding: 100px 0px 100px 0px;
  background: #000 url(../feel-bg.png) center bottom no-repeat;
  background-size: cover;
}
.feel h2{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    color: #fff;
} 
.feel-row{
    margin: 90px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: end;
}
.feel-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}
.feel-icons{
    margin: 150px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.feel-icon1{
    margin: 0px 0px 70px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
}
.feel-icon3{
    margin: 0px 0px 0px 0px;
}
img.feel-icon{
    margin: 0px 0px 0px 0px;
}
.feel-icon1-text{
    margin: 0px 0px 0px 30px;
    padding: 0px 0px 0px 0px;
}
.feel-icon1-text h4{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 1.8vw;
    font-weight: 600;
    color: #FFE6C0;
}
.feel-icon1-text p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 1vw;
    font-weight: 500;
    color: #FFE6C0;
}
.feel-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 20%;
}
img.feel-botle{
    width: auto;
    animation: Floatbottle 4.5s ease-in-out infinite;
}

/** use **/

.use{
    margin: 0px 0px 0px 0px;
    padding: 180px 0px 180px 0px;
    background: #eeeef0;
}
.use h2{
    text-align: center;
}
.use-row{
    margin: 0px 0px 0px 0px;
    padding: 50px 0px 0px 190px;
    display: flex;
} 
.use-left{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
    column-gap: 20px;
}
.use1{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
} 
.use-bx{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 8.5vw;
    height: 8.5vw;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #FFDD70, #F58312);
    background-size: 300% 100%;
    overflow: hidden;
    position: relative;
}
.use-bx::after {
    content: '';
    position: absolute;
    top: -40%;
    left: -50%;
    width: 190%;
    height: 190%;
    background: radial-gradient(circle, #FFFFFF9C, transparent 60%);
    animation: bgMove 3s linear infinite;
}
img.use-bx-icon{
    position: relative;
    z-index: 9;
}
.use1 h4{
    margin: 10px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Poppins", sans-serif;
    font-size: 1.7vw;
    font-weight: 600;
    color: #000;
    text-align: center;
} 
img.arrow-forward{
    margin: -40px 0px 0px 0px;
}
.use-right{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
img.use-bottle{
    margin: 0px 0px 0px -80px;
    animation: Floatbottle 4.5s ease-in-out infinite;
}

/** footer **/

.footer{
    margin: 0px 0px 0px 0px;
    padding: 30px 0px 0px 0px;
    background: url(../footer-bg.png) center no-repeat;
    background-size: cover;
}
.footer-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
}
.footer1{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
}
.footer1-bx {
    margin: 0px 0px 0px 0px;
    padding: 0px 25px 0px 25px;
    background: url(../availabe-box.png) center no-repeat;
    background-size: 100%;
    width: 23vw;
    height: 13.2vw;
    display: flex;
    align-items: center;
}
.footer1-bx h4{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 2.2vw;
    font-weight: bold;
    color: #fff;
} 
.footer1-bx p{
    margin: 20px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 1.1vw;
    font-weight: 500;
    color: #fff;
} 
.business-box{
    margin: 0px 0px 0px 0px;
    padding: 35px 20px 20px 20px;
    background: rgba(0,0,0,.31);
    border-radius: 14px;
}
.business-box h4{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 2vw;
    font-weight: bold;
    color: #fff;
    text-align: center;
} 
.business-box p{
    margin: 20px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    line-height: 31px;
} 
.form-box{
    margin: 20px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.form-box input{
    margin: 0px 0px 15px 0px;
    padding: 15px 10px 15px 20px;
    background: #5f4b46;
    border-radius: 11px;
    border: none;
    width: 100%;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: #fff;
}
input.send-btn{
    margin: 0px 0px 0px 0px;
    padding: 15px 10px 15px 10px;
    background: linear-gradient(90deg, #FE6526, #983C17);
    border-radius: 11px;
    border: none;
    width: 100%;
    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: bold;
    color: #fff;
    animation: pulse 2s infinite;
    cursor: pointer;
}

input.send-btn::after{
    content:'';
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background: radial-gradient(circle, rgba(255,255,255,0.35), transparent 60%);
    animation: shine 3s infinite;
}

img.footer-bottle{
    animation: Floatbottle 4.5s ease-in-out infinite;
    width: 21vw;
}

/** contact **/

.contact{
    margin: -5px 0px 0px 0px;
    padding: 18px 0px 18px 0px;
    background: #653721;
}
.contact-row{
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 70%;
}
.contact-row h4{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: bold;
    color: #FFBD5B;
    text-transform: uppercase;
}
.contact1{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: flex;
    align-items: center;
}
img.mail-pic{
    margin: 0px 0px 0px 0px;
}
.contact1 a{
    margin: 0px 0px 0px 14px;
    padding: 0px 0px 0px 0px;
    font-family: "Poppins", sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
}

/** disclaimer **/

.disclaimer{
    margin: 0px 0px 0px 0px;
    padding: 40px 0px 40px 0px;
    background: #000;
}
.disclaimer-row{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.disclaimer-row p{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 32px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #737373;
    text-align: center;
    border-bottom: 1px solid #242424;
}
.disclaimer-row h6{
    margin: 25px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #AEAEAE;
    text-align: center;
}
.error{
    color: #fff;
}