html,body{direction: rtl;font-family: 'Tajawal', sans-serif;scroll-behavior: smooth;}
.main_headers{z-index: 9;}
.main_headers.scrolled{
    background: #f3f3f3;
    -webkit-box-shadow:0 0 10px 1px #d5d5d5;
    -moz-box-shadow:0 0 10px 1px #d5d5d5;
    box-shadow:0 0 10px 1px #d5d5d5;
}
.main_headers #menus a{color:#fff;font-size: 18px;font-weight: bold;}
    .main_headers.scrolled #menus a{color:#111;}
.main_headers button{background:#f59e0b;}
.main_headers button.menu_togglr{
    display: none;
    background: transparent;
    font-size: 40px;
}
.hero_section{position: relative;height: 100vh;}
.hero_section video{object-fit: cover;width: 100%;height: 100%;position: absolute;z-index: -1;top: 0;right: 0;left: 0;opacity: 0.9;}
.hero_section::after{content: "";display: block;background: #000000e5;position: absolute;top: 0;left: 0;z-index: -1;width: 100%;height: 100%;opacity: 0.8;}
.hero_section .container{z-index: 3;}
.hero_section .container h1{margin-top: 10%;color: #fff;font-weight: bold;font-family: 'Tajawal', sans-serif;}
.feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}
.pricing-card {
    transition: all 0.3s ease;
}
.pricing-card:hover {
    transform: scale(1.03);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.popular-badge {
    top: -15px;
    right: 20px;
}
#faq .faq-item {
    border-bottom: 1px solid #e5e7eb;
}
#faq .faq-item p.descripe{display: none;}
.back-to-top{position: fixed;bottom: 2%;left: 2%;
    background: #c84662;
    color: #fff;
    padding: 15px;
    border-radius: 50%;
    width: 48px;
    height: 48px;cursor: pointer;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}
.callwhatsapp{position: fixed;bottom: 10%;left: 2%;}
.callwhatsapp a{
    background: #65c165;
    color: #fff;
    padding: 15px;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}
.menu_togglr{display: none;}
@media screen and (max-width:768px){
    #menus,.main_headers a.tryfree{display: none;}
    #menus{position: fixed;top: 120px;background: #fff;width: 100%;right: 0;left: 0;}
    .main_headers #menus a{display: block;color: #222;margin:10px 5px;}
    .main_headers button.menu_togglr{display: block;}
    .main_headers.scrolled button.menu_togglr{color:rgb(245 158 11 / 1);}
    .hero_section .container h1 {margin-top: 6rem;}
}
footer.bg-secondary{
    
    background-color: rgb(14 43 92 / 1) !important;
}