*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html , body{
  height: 100%;
  width: 100%;
}
html{
scroll-behavior: smooth;
}
body{
/* font-family: "Archivo Black", serif; */
font-family: sans-serif; 
font-size: 12px;
}
a{
text-decoration: none;
font-family: sans-serif; 
color: black;
}
button{
border: none;
background: none;
}
img,video{
width: 100%;
height: 100%;
}
.section{
width: 100%;
max-width: 1440px;
margin: 0 auto;
}
:root{
--text-shadow-p: 0px 2px 4px #00000038;
--text-shadow:0px 2px 2.8px  #00000033;
--img-shadow:0px 4.55px 4.55px 0px #00000066;
--box-shadow: 2.91px 3.88px 3.88px 0px #00000057;

}
header{
  background: #DEEBF7;
  padding-top: 15px;
}
nav{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-inline: 15px;
  background: #000000D9;
  border-radius: 15px;
  padding: 15px;
  gap: 1rem;
  
}
.main-logo{
  flex-shrink: 1;
  max-width: 190px;
}
.nav-link{
  font-size: 18px;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
  padding: 5px 15px;
  border-radius: 15px;
  background: white;
  box-shadow: 0px 0px 1.4px 0px #0000002E;
  word-break: keep-all;
}
.hero{
  display: grid;
  gap: 1rem;
}
.hero-content{
  display: grid;
  gap: 1rem;
  justify-content: center;
  padding: 30px;
}
.hero-h{
  color: #212121;
  text-align: center;
}
.hero-h h2{
  font-family: sans-serif; 
font-size: 40px;
font-weight: 600;
line-height: 60px;
text-shadow: var(--text-shadow-p);


}
.hero-h h3{
font-size: 26px;
font-weight: 400;
line-height: 36px;
text-shadow: var(--text-shadow-p);
}
.hero-h p{
font-size: 14px;
font-weight: 400;
line-height: 24px;
color: #202020;

}
.hero-link{
  font-size: 18px;
  font-weight: 400;
  line-height: 42px;
  text-align: center;
  padding: 5px 15px;
  border-radius: 15px;
  background: #232323;
  color: white;
  box-shadow: 0px 0px 1.4px 0px #0000002E;
  word-break: keep-all;
  justify-self: center;
  box-shadow: var(--box-shadow);
}
/* reasons */
.reason-section{
  padding: 30px 15px;
  display: grid;
  gap: 1.5rem;
}
.reason-h{
  color: #232323;
font-size: 32px;
font-weight: 600;
line-height: 43px;
text-align: left;
text-shadow: var(--text-shadow);

}
.reason-cards{
  display: grid;
  gap: 1.5rem;
}
.reason-cards article{
  background: #F3F3F3;
  padding: 40px 20px;
  border-radius: 7px;
  box-shadow: var(--box-shadow);
  color: #282828;
  height: 300px;
  display: flex;
  align-items: center;
}
.reason-cards p{
  width: 100%;
font-size: 28px;
font-weight: 600;
line-height: 41.04px;
text-align: center;
text-shadow: var(--text-shadow);

}

/* holdem section */
.holdem-section{
  padding: 30px 15px;
}
.holdem-h{
font-size: 42px;
font-weight: 600;
line-height: 63px;
text-align: center;
color: #232323;
text-shadow: var(--text-shadow-p);

}
.holdem-cards{
  display: grid;
  gap: 1rem;
  justify-content: center;
  color: #282828;
  margin-block: 1rem;
}
.holdem-cards article{
  background: #f3f3f3;
  padding: 10px;
  border-radius: 7px;
  box-shadow: var(--box-shadow);
  width: 100%;
  max-width: 360px;
}
.holdem-cards div{
  display: flex;
  gap: 10px;
}
.holdem-cards p{
font-size: 23.25px;
font-weight: 600;
line-height: 34.88px;
text-align: left;
color: #282828;
}
.holdem-cards h3{
  color: #282828;
font-size: 40.69px;
font-weight: 600;
line-height: 61.04px;
text-align: center;
padding: 20px;
text-shadow: var(--text-shadow);
}
.holdem-logo{
  max-width: 33px;
}
/* video container */
.video-container{
background: #f3f3f3;

}
.video-section {
  padding: 30px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
overflow: hidden;

}
.video-section video{
  z-index: 10000;
  max-width: 900px;
  border-radius: 5px;
  box-shadow: var(--box-shadow);
}
.video-bg{
  z-index: 500;
  position: absolute;
  object-fit: contain;
  width: fit-content;
}
.video-bg1{
top: -7rem;
left: 0;
}
.video-bg2{
  bottom: -15rem;
  left: 0rem;

}
.video-bg3{
  bottom: 0;
  right: 0;
}
/* profit section */
.profit-section{
  padding: 30px 15px;
  display: grid;
  gap: 2rem;
}

.profit-h{
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.profit-h h2{
font-size: 28px;
font-weight: 600;
line-height: 35px;
text-align: center;
color: #232323;
text-shadow: var(--text-shadow);
}

.profit-cards{
  display: grid;
  gap: 2rem;
}
.profit-cards article{
  background: #f3f3f3;
  color: white;
  border-radius: 10px;
  padding: 30px 20px;
  box-shadow: var(--img-shadow);
  display: grid;

}
.profit-card-h{
  background: linear-gradient(280.24deg, #004797 0%, #0060AF 100%);
  margin-inline: 20px;
  padding: 5px 10px;
  border-radius: 20px;
  box-shadow: var(--box-shadow);
font-size: 27.21px;
font-weight: 600;
line-height: 40.81px;
text-align: center;
margin-bottom: 2rem;

}
.profit-card-content{
  display: grid;
  gap: 2rem;
}
.profit-card-content p{
 
font-size: 20.93px;
font-weight: 400;
line-height: 31.39px;
text-align: left;
color: #1c1c1c;

}
/* comparision */
.comp-section{
  padding: 30px 15px;

}
.comp-h{
  color: #232323;
  text-shadow: var(--text-shadow);
font-size: 32px;
font-weight: 600;
line-height: 45px;
text-align: center;
margin-bottom: 3rem;
}
.comp-content-container{
  background: #f3f3f3;
}
.comp-content{
  text-align: center;
  display: grid;
  gap: 2rem;
  padding: 60px 15px 30px 15px;

}
.comp-img{
  max-width: 1018px;
  margin: 0 auto;
  position: relative;
}
.comp-label{
  color: #515151;
font-size: 20px;
font-weight: 600;
line-height: 34px;
display: flex;
align-items: center;
justify-content: space-around;
text-shadow: var(--text-shadow);
padding-inline: 5%;
}

.comp-perc{
font-size: 14px;
font-weight: 800;
line-height: 20px;
text-align: center;
color: #515151;
text-shadow: var(--text-shadow);
position: absolute;
inset: 0;
display: flex;
justify-content: space-around;
align-items: center;
text-shadow: var(--text-shadow);
}
.comp-perc h5:first-child{
  margin-top: -10%;
}
.comp-perc h5:nth-child(2){
  margin-top: -5%;
}


.comp-perc h4{
  color:#014C9D;
  font-size: 16px;
font-weight: 800;
line-height: 40px;
text-shadow: var(--text-shadow);
-webkit-text-stroke: 1px #FFFFFF8F;

}

.comp-label h4{
  color: #014C9D;
font-size: 20px;
font-weight: 600;
line-height: 48px;
text-shadow: var(--text-shadow);

}
.comp-content p{
color: #171717;
font-size: 20px;
font-weight: 400;
line-height: 30px;
/* text-shadow: var(--text-shadow); */
}
/* ggr */
.ggr-container{
  background: #f3f3f3;
  margin-top: 3rem;
}
.ggr-section{
  padding: 30px 15px;
  display: grid;
  gap: 1rem;
}
.ggr-h{
font-size: 32px;
font-weight: 600;
line-height: 50px;
text-align: left;
color: #232323;
text-shadow: var(--text-shadow);

}
.ggr-table,.sect11-table{
  background: #EFEFEF;
  box-shadow: var(--box-shadow);
  outline: none;
  border: none;
  border-radius: 5px;
  border-collapse: collapse;
}

.ggr-table th,.sect11-table th{
font-size: 14px;
font-weight: 800;
line-height: 18.09px;
text-align: center;
color: #383838;
padding: 5px 5px;
border: none;
border-bottom: 2px solid #8D8D8D;
outline: none;


}

.ggr-table tr td:first-child,.sect11-table tr td:first-child{
  background: linear-gradient(280.24deg, #E6EDF3 0%, #E1EDF9 100%);
color: #383838;
font-size: 14px;
font-weight: 400;
line-height: 15.75px;
text-align: center;
padding: 5px 5px;
border: none;
border-bottom: 2px solid #8D8D8D;
outline: none;
}
.ggr-table tr td:nth-child(2),.ggr-table tr td:nth-child(3),.sect11-table tr td:nth-child(2){
color: #383838;
font-size: 12px;
font-weight: 400;
line-height: 18.75px;
text-align: center;
padding: 5px 5px;
border-bottom: 2px solid #8D8D8D;
outline: none;

}
.ggr-footer{
font-size: 16.11px;
font-weight: 400;
line-height: 25.67px;
text-align: left;
color: #171717;
margin-top: 1rem;

}
/* section 11 */

.sect11{
  padding: 30px 15px;
  display: grid;
  gap: 1rem;
  color: #171717;
}
.sect11-h h3{
font-size: 32px;
font-weight: 600;
line-height: 43px;
text-align: left;
text-shadow: var(--text-shadow);
color: #232323;

}
.sect11-content{
  display: grid;
  gap: 1rem
}


.sect11-table th:nth-child(2) {
  width: 70%;
}

.sect11-h p,.sect11-content p{
font-size: 18px;
font-weight: 400;
line-height: 24px;
text-align: left;
color: #171717;

}
.sect11-table tr th:last-child,.sect11-table tr td:last-child{
  column-span: 2;
}
/* notes section */
.note-container{
  background: #F3F3F3;
}
.note-section{
  padding: 30px 15px;
  display: grid;
  align-items: center;
  justify-content: center;
}
.note{
  display: grid;
  gap: 1rem;
  text-align: center;
  padding: 30px;
  border-radius: 5px;
  border: 2px solid black;
}
.note p{
font-size: 16px;
font-weight: 400;
line-height: 25px;
color: #171717;


}
.note-link{
  font-size: 18px;
  font-weight: 400;
  line-height: 42px;
  text-align: center;
  padding: 5px 15px;
  border-radius: 20px;
  background: #232323;
  color: white;
  box-shadow: 0px 0px 1.4px 0px #0000002E;
  word-break: keep-all;
  justify-self: center;
  box-shadow: var(--box-shadow);
  margin-top: 1rem;
}
/* services */


.services-section{
  padding: 30px 15px;
  display: grid;
  gap: 1rem;
}
.service-h{
  font-size: 42px;
  font-weight: 600;
  line-height: 63px;
  text-align: center;
  text-shadow: var(--text-shadow);
  color: #232323;
  
}
.services-cards{
  display: grid;
  gap: 2rem;
}
.services-cards article{
  background: #f3f3f3;
  padding:  20px;
  display: flex;
  align-items: center;
  gap: 1rem;
  border-radius: 5.5px;
  box-shadow: var(--box-shadow);
}
.service-img{
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(243, 243, 243, 0.5) 100%);
  padding: 10px;
  max-width: fit-content;
  border-radius: 4.5px;
box-shadow: 0px 3.46px 3.46px 0px #00000040;
  flex-shrink: 0;
}
.service-img img{
max-width: 80px;
}
.service-content h3{
font-size: 20px;
font-weight: 600;
line-height: 30.81px;
text-align: left;
color: #014C9D;
}
.service-content p{
  color: #232323;
font-size: 14.84px;
font-weight: 400;
line-height: 20.25px;
text-align: left;

}
/* footter */
footer{
  display: grid;
  gap: 2rem;
}
.footer-top{
  padding: 30px 15px;
  display: grid;
  gap: 1rem;
  justify-content: center;
  background: #f3f3f3;
  margin-top: 4rem;
}
.footer-top p{
font-size: 16px;
font-weight: 400;
line-height: 24px;
text-align: center;
color: #262626;

}
.footer-top a{
background: #232323;
  padding: 5px 25px;
font-size: 18px;
font-weight: 400;
line-height: 27px;
text-align: center;
color: white;
border-radius: 15px;
max-width: fit-content;
justify-self: center;

}
.footer-bottom{
  padding-inline: 15px;
  display: grid;
  gap: 1rem;
}
.footer-card  p{
font-size: 22.93px;
font-weight: 400;
line-height: 29.91px;
text-align: center;
color: #2a2a2a;

}
.footer-card article div{
  display: flex;
  align-items: center;
  justify-content: center;

}
.footer-card article div p{
  font-size: 23px;
font-weight: 700;
text-align: center;
max-width: fit-content;
color: #383838;

}
.footer-card article{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.footer-card article h3{
font-size: 20px;
font-weight: 700;
line-height: 69.36px;
text-align: center;
color: #383838;
word-wrap: break-word;

}
.footer-card{
  padding: 35px 25px;
  border-radius: 15px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.footer-card img{
  max-width: 40px;
  justify-self: center;
}
.footer-bottom-content{
  background: #DEEBF7;
  box-shadow: var(--box-shadow);

font-size: 18px;
font-weight: 500;
line-height: 26.4px;
text-align: center;
display: grid;
gap: 1rem;
padding: 20px;
color: #383838;

}
.footer-h{
  padding: 30px 15px ;
  display: grid;
  gap: 1rem;
}
.footer-h h3{
font-size: 32px;
font-weight: 600;
line-height: 43px;
text-align: center;
text-shadow: var(--text-shadow);
color: #014C9D;
}
.footer-h p{
  color: #232323;
font-size: 18.11px;
font-weight: 400;
line-height: 27.67px;
text-align: center;

}
.footer-h h4{
  margin-top: 2rem;
font-size: 34px;
font-weight: 700;
line-height: 43.58px;
text-align: center;
color: #383838;

}
/* timeline */
.timeline-container{
  background: #f3f3f3;
}
.timeline{
  padding: 30px 15px;
  
}
.timeline-cards{
  position: relative;
  display: grid;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.time-bus{
  position: absolute;
  top: 0;
  bottom: 0;
  right: 50%;
  z-index: 100;
  height: 100%;
  width: 2px;
  background: #014C9D;
}

.timeline-cards article{
  z-index: 5000;
}

.timeline img{
  width: 95px;
  height: 95px;
  object-fit: cover;
  border-radius: 50%;
  border: 1.5px solid #8E8E8E;
}

.timeline-cards article:first-child img,.timeline-cards article:nth-child(2) img{
  border: 1.5px solid #014C9D
}
.timeline-cards article:first-child h4,.timeline-cards article:nth-child(2) h4{
  color: #014C9D;
}
.timeline-cards h4{
font-size: 16px;
font-weight: 600;
line-height: 24px;
text-align: center;
text-shadow: var(--text-shadow);
color: #353535;
background: #f3f3f3;

}
.timeline-cards span{
display: inline-block;
width: 10px;
height: 10px;
background: white;
border: 1px solid #014C9D;
border-radius: 50%;
justify-self: center;
z-index: 5000;
}
.timeline-cards article:last-child{
color: #014C9D;
font-size: 28px;
font-weight: 600;
line-height: 42px;
text-align: left;
background: #f3f3f3;


}
@media screen and (min-width:440px) {
  .footer-card article div{
    display: grid;
  
  }
  .footer-card img{
    max-width: 78px;
    justify-self: center;
  }
}
@media screen and (min-width:768px) {
    nav{
      margin-inline: 30px;
    }
    .nav-link{
      padding-inline: 40px;
    }
    .hero{
      grid-template-columns: 1fr 1fr;
    }
    .hero-content{
      padding: 30px;
      padding-left: 60px;
      justify-self: flex-start;
      align-self: start;
    }
    .hero-h h2{
    font-size: 80px;
    line-height: 120px;
    text-align: left;
    
    }
    .hero-h h3{
    font-size: 52px;
    line-height: 78px;
    text-align: left;
    
    }
    .hero-h p{
    font-size: 24px;
    line-height: 36px;
    text-align: left;
    
    }
    .hero-link{
      font-size: 28px;
      padding: 10px 30px;
      width: 280px;
      align-self: flex-start;
      border-radius: 25px;
    }
    .hero-img{
      padding-top: 30px;
    }
    .reason-section{
      padding: 60px;
    }
    .reason-h{
    font-size: 42px;
    line-height: 63px;
    
    }
    .reason-cards p{
      font-size: 40.69px;
      line-height: 61.04px;
      
      }
      .reason-cards{
        grid-template-columns: repeat(2,1fr);
        gap: 2rem;
      }
      
      .reason-cards article:nth-child(even){
        margin-top: 100px;
      }
      .holdem-section{
        padding: 30px 60px;
      }
      .holdem-h{
        margin-bottom: 2rem;
        
        }
      .holdem-cards{
        display: flex;
        align-items: start;
        justify-content: space-between;
        flex-shrink: 0;
        flex-wrap: wrap;
      }
      
      .holdem-cards article{
        max-width: 300px;
        
      }
      .video-section{
        padding: 60px;
      }
      .profit-section{
        padding: 40px 60px;
      }
      .profit-h h2{
        font-size: 42px;
        line-height: 63px;
        
        }
      
      .profit-cards{
        grid-template-columns: repeat(3,1fr);
      }
      .profit-card-h{
        align-self: self-start;
      }
      .comp-section{
        padding: 40px 60px;
        margin-bottom: -19rem;
      }
      .comp-h{
      font-size: 42px;
      line-height: 63px;
      }
      .comp-label h4{
      font-size: 44px;
      line-height: 68px;
      }
      .comp-content{
        padding: 60px;
        padding-top: 20rem;
      }
      .comp-content p{
      font-size: 32px;
      line-height: 48px;
      }
      .comp-label{
      font-size: 32px;
      line-height: 48px;
    }
    .comp-perc{
      font-size: 32px;
      line-height: 48px;
      width: 95%;
      margin-left: auto;
      
    }
    .comp-perc h4{
      font-size: 58px;
      line-height: 87px;
      -webkit-text-stroke: 3px #FFFFFF8F;
    }
    .ggr-section{
      padding: 30px 60px 60px 60px;
     }
     .ggr-h{
      font-size: 43.95px;
      line-height: 65.93px;
      
      }
      .ggr-table th,.sect11-table th{
        font-size: 17.47px;
        line-height: 20.09px;
        padding: 15px 10px;
        
        }
        
        .ggr-table tr td:first-child,.sect11-table tr td:first-child{
        font-size: 17.47px;
        line-height: 25.75px;
        padding: 15px 10px;
        }
        .ggr-table tr td:nth-child(2),.ggr-table tr td:nth-child(3),.sect11-table tr td:nth-child(2){
        font-size: 17.47px;
        line-height: 25.75px;
        padding: 15px 10px;
        
        }
        .ggr-footer{
          font-size: 25.11px;
          line-height: 37.67px;
          
          }
          .sect11{
            padding: 30px 60px;
          }
          .sect11-h h3{
            font-size: 42px;
            line-height: 63px;
            
            }
            .sect11-h p,.sect11-content p{
            font-size: 25.11px;
            line-height: 37.67px;
            
            }
            .note-section{
              padding: 60px;
            }
            .note{
              padding: 60px;
            }
            .note p{
              font-size: 25.11px;
              line-height: 37.67px;
              
              
              }
              .note-link{
                margin-top: 2rem;
                font-size: 22.15px;
                font-weight: 400;
                line-height: 33.23px;
                width: 220px;
                align-self: flex-start;
                
              }
              .services-section{
                padding: 40px 60px;
              }
              .services-cards{
                display: grid;
                justify-content: space-between;
                grid-template-columns: 1fr 1fr;
                
              }
              .services-cards article:nth-child(even){
                justify-self: end;
              }
              .services-cards article{
                max-width: 580px;
              }
              .service-content h3{
                font-size: 27.21px;
                line-height: 40.81px;
                
                }
                .service-content p{
                font-size: 18.84px;
                line-height: 28.25px;
                }
                .footer-bottom{
                  grid-template-columns: 1fr 1fr;
                  gap: 0;
                  padding: 0;
                  
                }
                .footer-card article h3{
                  font-size: 48px;}
                .footer-card{
                  padding: 40px 10px;
                  border-top-left-radius: 0;
                  border-bottom-left-radius: 0;
                }
                .footer-bottom-content{
                  max-height: fit-content;
                  align-self: center;
                  font-size: 22px;
                }
                .footer-card  p{
                  font-size: 29.93px;
                  line-height: 35.91px;
                  
                  }
                .footer-h{
                  padding: 60px;
                  padding-bottom: 0;
                }
                .footer-h h3{
                  font-size: 42px;
                  line-height: 63px;
                  }
                  .footer-h p{
                  font-size: 25.11px;
                  line-height: 37.67px;
                  
                  }
                  .footer-h h4{
                    margin-top: 3rem;
                  font-size: 44px;
                  line-height: 63.58px;
                  
                  }
                  .timeline{
                    padding: 60px;
                  }
                  
}


@media screen and (min-width:1000px){
  .timeline-cards{
    display: flex;
    gap: 0;
    justify-content: space-around;
  }
  .timeline-cards article img{
    margin-bottom: 1rem;

  }
  .timeline-cards span{
    margin-top: -2rem;
  }
  
  .time-bus{
    width: 100%;
    height: 2px;
    left: 0;
    right: 0;
    top: 38%;
    
  }
  .timeline-cards article:last-child{
    margin-top: -25px;
    margin-right: -10px;
  }
}
@media screen and (min-width:1200px){
 
  .hero{
    grid-template-columns: 40% 60%;
    overflow: hidden;
    max-height: 500px;
  }
  .hero-img{
    max-width: 900px;
  }
  .reason-cards{
    grid-template-columns: repeat(4,1fr);
  }
  .profit-cards{
    gap: 4rem;
  }
  .note{
    padding: 60px 120px;
    gap: 2.5rem;
  }
  .services-cards{
    column-gap: 5rem;
    
  }

}