/***
====================================================================
  General
====================================================================
 ***/
@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@700&display=swap');

@font-face {
    font-family: 'Gulf';
    src: url('../fonts/Gulf-Bold.woff2') format('woff2'),
    url('../fonts/Gulf-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


:root {
    --primary: #C01627;
    --btn-primary: #EC1B2F;
    --primary-hover: #90111e;
    --primary-light: #EC1B2F;
}

/* Let's get this party started */
::-webkit-scrollbar {
    width: 6px;
    background: #f6f6f6;
}

/* Track */
::-webkit-scrollbar-track {
    border-radius: 0;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--primary);
}

::-webkit-scrollbar-thumb:window-inactive {
    background: var(--green_light);
}

*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

* {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

html {
    overflow-x: auto !important;
    background-color: #000;
}

body {
    font-family: 'Gulf', sans-serif;
    font-weight: 700;
    font-style: normal;
    background-color: #000;
    font-size: 16px;
    color: #fff;
    overflow-x: auto !important;


}
@media (prefers-color-scheme: dark) {
    body {
        background-color: #000;
    }
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Gulf', sans-serif;
}

::-moz-selection {
    background: rgba(192, 22, 39, 0.78);
    text-shadow: none;
    color: #fff;
}

::selection {
    background: rgba(192, 22, 39, 0.78);
    text-shadow: none;
    color: #fff;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

a, button, .btn {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

a {
    cursor: pointer !important;
    text-decoration: none !important;
    color: inherit;
}

a:hover, a:active, a:focus, a:visited {
    text-decoration: none !important;
}

input, textarea, a, button {
    outline: none !important;
    text-decoration: none;
}


/* img hover */
.img-hover {
    overflow: hidden;
    display: block;
}

.img-hover > img {
    -webkit-transition: all 1s ease-out;
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    -ms-transition: all 1s ease-out;
    transition: all 1s ease-out;
}

.img-hover:hover > img {
    transform: scale(1.2);
}

img {
    max-width: 100%;
}

/* end img hover */
.main-wrapper {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.btn {
    display: flex;
    padding: 14px 0;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.btn-primary {
    display: flex;
    padding: 0 48px;
    justify-content: center;
    align-items: center;
    gap: 8px;

    border: 2px solid transparent;
    background: var(--btn-primary);

    color: #fff;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    border-radius: 0;
    height: 60px;
}

.btn-primary:hover {
    background: var(--primary-hover);
    border-color: var(--primary-light);
}

.btn-outline-light:hover {
    color: var(--btn-primary);
}

.btn-light {
    color: var(--btn-primary);
}

.btn-light:hover {
    color: var(--btn-primary);
}

.btn-outline-primary {
    color: var(--btn-primary);
    border-color: var(--btn-primary);
    border-radius: 0
}

.btn-outline-primary:hover {
    color: #fff;
    border-color: var(--primary-hover);
    background-color: var(--primary-hover);
}

.text-primary {
    color: var(--primary);
!important;
}

.ic-right-arrow-red {
    background-image: url('data:image/svg+xml,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.2673 4.70926C12.9674 4.42357 12.4926 4.43511 12.2069 4.73504C11.9213 5.03497 11.9328 5.5097 12.2327 5.79539L18.4841 11.75H3.75C3.33579 11.75 3 12.0858 3 12.5C3 12.9142 3.33579 13.25 3.75 13.25H18.4842L12.2327 19.2047C11.9328 19.4904 11.9213 19.9651 12.2069 20.2651C12.4926 20.565 12.9674 20.5765 13.2673 20.2908L20.6862 13.2241C20.8551 13.0632 20.9551 12.858 20.9861 12.6446C20.9952 12.5978 21 12.5495 21 12.5C21 12.4504 20.9952 12.402 20.986 12.3551C20.955 12.1419 20.855 11.9368 20.6862 11.776L13.2673 4.70926Z" fill="%2317896E"/></svg>');
    width: 24px;
    height: 25px;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.ic-right-arrow-white {
    background-image: url('data:image/svg+xml,<svg width="37" height="37" viewBox="0 0 37 37" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.954 5.98919C19.4916 5.54876 18.7597 5.56656 18.3193 6.02894C17.8788 6.49133 17.8966 7.22321 18.359 7.66364L27.9966 16.8437H5.28149C4.64292 16.8437 4.12524 17.3613 4.12524 17.9999C4.12524 18.6385 4.64292 19.1562 5.28149 19.1562H27.9968L18.359 28.3363C17.8966 28.7768 17.8788 29.5087 18.3193 29.971C18.7597 30.4334 19.4916 30.4512 19.954 30.0108L31.3915 19.1163C31.6519 18.8682 31.806 18.5518 31.8538 18.2229C31.8679 18.1507 31.8752 18.0762 31.8752 17.9999C31.8752 17.9235 31.8678 17.8488 31.8537 17.7765C31.8058 17.4478 31.6518 17.1316 31.3915 16.8837L19.954 5.98919Z" fill="white"/></svg>');
    width: 37px;
    height: 37px;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

/***
====================================================================
  Loading Transition
====================================================================
 ***/
/* Preloader */
.ctn-preloader {
    align-items: center;
    -webkit-align-items: center;
    display: flex;
    display: -ms-flexbox;
    height: 100%;
    justify-content: center;
    -webkit-justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 99999999;
    background: #000;
}

.ctn-preloader img {
    height: 60px;
}

.txt-loading {
    direction: ltr;
}

.ctn-preloader .animation-preloader {
    position: absolute;
    z-index: 100;
}

/* Spinner cargando */
.ctn-preloader .animation-preloader .spinner {
    animation: spinner 1s infinite linear;
    border-radius: 50%;
    border: 1px solid rgba(30, 181, 188, 0.15);
    border-top-color: var(--primary);
    height: 100px;
    margin: 0 auto 0 auto;
    width: 100px;
}

/* Texto cargando */

.ctn-preloader .animation-preloader .txt-loading {
    text-align: center;
    user-select: none;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:before {
    animation: letters-loading 4s infinite;
    color: var(--primary);
    content: attr(data-text-preloader);
    left: 0;
    opacity: 0;
    top: 0;
    line-height: 50px;
    position: absolute;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 700;
    letter-spacing: 10px;
    display: inline-block;
    color: rgba(12, 58, 86, 0.15);
    position: relative;
    font-size: 50px;
    line-height: 50px;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {
    animation-delay: 0.2s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {
    animation-delay: 0.4s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {
    animation-delay: 0.6s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {
    animation-delay: 0.8s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before {
    animation-delay: 1s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before {
    animation-delay: 1.2s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before {
    animation-delay: 1.4s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(9):before {
    animation-delay: 1.6s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(10):before {
    animation-delay: 1.8s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(11):before {
    animation-delay: 2s;
}

.ctn-preloader .loader-section {
    background-color: #ffffff;
    height: 100%;
    position: fixed;
    top: 0;
    width: calc(50% + 1px);
}

.loaded .animation-preloader {
    opacity: 0;
    transition: 0.3s ease-out;
}

/* AnimaciĂłn del preloader */

@keyframes spinner {
    to {
        transform: rotateZ(360deg);
    }
}

@keyframes letters-loading {
    0%,
    75%,
    100% {
        opacity: 0;
        transform: rotateY(-90deg);
    }
    25%,
    50% {
        opacity: 1;
        transform: rotateY(0deg);
    }
}

@media screen and (max-width: 767px) {
    .ctn-preloader .animation-preloader .spinner {
        height: 80px;
        width: 80px;
    }

    .btn-primary {
        height: 40px;
        padding: 0 16px;
        justify-content: center;
        align-items: center;
        gap: 4px;
        font-size: 14px;
        font-weight: 400;
        line-height: 18px; /* 128.571% */
    }

    .btn-outline-primary {
        height: 40px;
        padding: 0 16px;
        gap: 4px;
        font-size: 14px;
        line-height: 18px; /* 128.571% */
    }
}

@media screen and (max-width: 500px) {
    .ctn-preloader .animation-preloader .spinner {
        height: 80px;
        width: 80px;
    }

    .ctn-preloader .animation-preloader .txt-loading .letters-loading {
        font-size: 30px;
        letter-spacing: 5px;
    }
}


/*
====================================================================
Mobile menu
====================================================================
*/


.menu-mobile {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    width: 100%;

    z-index: 1001;
    overflow: hidden;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: -webkit-transform .4s ease;
    transition: -webkit-transform .4s ease;
    transition: transform .4s ease;
    transition: transform .4s ease, -webkit-transform .4s ease;
    -webkit-box-shadow: -2px 0 20px 0 rgba(33, 23, 23, 0.2);
    box-shadow: -2px 0 20px 0 rgba(33, 23, 23, 0.2);
    box-shadow: 0 9px 72px 0 rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(10px);
    background: #110E10;
    display: flex;
    flex-direction: column;
}

.brand-area {
    position: relative;
    display: flex;
    justify-items: center;
    justify-content: space-between;

    padding: 24px;
    margin: 15px;
    background: #241e22;
    border-radius: 12px;
    border: 1px solid #53454e;
}

.brand-area a {
    margin: 0;
}

.brand-area a > img {
    max-width: 100%;
    max-height: 55px;
    margin: auto;
}

.mmenu > ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.mmenu > ul li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    color: #fff;
    font-size: 16px;
    padding: 10px 20px;
    transition: all .3s;
    font-weight: 600;
    text-transform: capitalize;
}

.mmenu li b {
    color: #fff;
    padding: 0 15px;
    display: none !important
}

.mmenu > ul li a:hover, a.mmenu > ul li.active a {
    background: transparent;
    border-color: transparent;
}

.m-overlay {
    position: fixed;
    content: '';
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    background: #333;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: all .3s;
}

.menu-toggle {
    overflow: hidden;
}

.menu-toggle .m-overlay {
    opacity: 0.6;
    visibility: visible;
}

.menu-toggle .menu-mobile {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);

}


html.menu-toggle {
    overflow: hidden;
}

.menu-trigger {
    display: none;
}

.ic-bars {
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.75257 17.9997H21.2526C21.6668 17.9997 22.0026 18.3355 22.0026 18.7497C22.0026 19.1294 21.7204 19.4432 21.3543 19.4928L21.2526 19.4997H2.75257C2.33835 19.4997 2.00257 19.1639 2.00257 18.7497C2.00257 18.37 2.28472 18.0562 2.6508 18.0065L2.75257 17.9997H21.2526H2.75257ZM2.75257 11.5027H21.2526C21.6668 11.5027 22.0026 11.8385 22.0026 12.2527C22.0026 12.6324 21.7204 12.9462 21.3543 12.9959L21.2526 13.0027H2.75257C2.33835 13.0027 2.00257 12.6669 2.00257 12.2527C2.00257 11.873 2.28472 11.5592 2.6508 11.5095L2.75257 11.5027H21.2526H2.75257ZM2.75171 5.00293H21.2517C21.6659 5.00293 22.0017 5.33872 22.0017 5.75293C22.0017 6.13263 21.7196 6.44642 21.3535 6.49608L21.2517 6.50293H2.75171C2.3375 6.50293 2.00171 6.16714 2.00171 5.75293C2.00171 5.37323 2.28386 5.05944 2.64994 5.00978L2.75171 5.00293H21.2517H2.75171Z" fill="%23ffffff"/></svg>');
    width: 24px;
    height: 24px;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
}


.container {
    max-width: 1270px;
}

.ic-close {
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.39705 4.55379L4.46967 4.46967C4.73594 4.2034 5.1526 4.1792 5.44621 4.39705L5.53033 4.46967L12 10.939L18.4697 4.46967C18.7626 4.17678 19.2374 4.17678 19.5303 4.46967C19.8232 4.76256 19.8232 5.23744 19.5303 5.53033L13.061 12L19.5303 18.4697C19.7966 18.7359 19.8208 19.1526 19.6029 19.4462L19.5303 19.5303C19.2641 19.7966 18.8474 19.8208 18.5538 19.6029L18.4697 19.5303L12 13.061L5.53033 19.5303C5.23744 19.8232 4.76256 19.8232 4.46967 19.5303C4.17678 19.2374 4.17678 18.7626 4.46967 18.4697L10.939 12L4.46967 5.53033C4.2034 5.26406 4.1792 4.8474 4.39705 4.55379L4.46967 4.46967L4.39705 4.55379Z" fill="%23ffffff"/></svg>');
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: contain;
    background-size: contain;
    display: flex;
    align-items: center;
    justify-content: center;
}

.close-menu {
    background: none;
    border: none;
}

.right-mmenu {
    display: flex;
    gap: 8px;
    align-items: center;
}

.ic-saved-items {
    background-image: url('data:image/svg+xml,<svg width="14" height="19" viewBox="0 0 14 19" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.19045 18.8538C0.694316 19.2107 0.00244141 18.8562 0.00244141 18.2449V3.24902C0.00244141 1.4541 1.45752 -0.000976562 3.25244 -0.000976562H10.7508C12.5458 -0.000976562 14.0008 1.4541 14.0008 3.24902V18.2449C14.0008 18.8562 13.309 19.2107 12.8128 18.8538L7.00164 14.6728L1.19045 18.8538ZM12.5008 3.24902C12.5008 2.28253 11.7173 1.49902 10.7508 1.49902H3.25244C2.28594 1.49902 1.50244 2.28253 1.50244 3.24902V16.7814L6.56362 13.1401C6.82529 12.9518 7.17798 12.9518 7.43965 13.1401L12.5008 16.7814V3.24902Z" fill="%23020617"/></svg>');
    width: 14px;
    height: 19px;
    display: flex;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
}

.ic-settings {
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.0124 2.25C12.7464 2.25846 13.4775 2.34326 14.1939 2.50304C14.5067 2.57279 14.7406 2.83351 14.7761 3.15196L14.9463 4.67881C15.0233 5.37986 15.6152 5.91084 16.3209 5.91158C16.5105 5.91188 16.6982 5.87238 16.8734 5.79483L18.2741 5.17956C18.5654 5.05159 18.9057 5.12136 19.1232 5.35362C20.1354 6.43464 20.8892 7.73115 21.3279 9.14558C21.4225 9.45058 21.3137 9.78203 21.0566 9.9715L19.8151 10.8866C19.461 11.1468 19.2518 11.56 19.2518 11.9995C19.2518 12.4389 19.461 12.8521 19.8159 13.1129L21.0585 14.0283C21.3156 14.2177 21.4246 14.5492 21.3299 14.8543C20.8914 16.2685 20.138 17.5649 19.1264 18.6461C18.9091 18.8783 18.569 18.9483 18.2777 18.8206L16.8714 18.2045C16.4691 18.0284 16.007 18.0542 15.6268 18.274C15.2466 18.4937 14.9935 18.8812 14.9452 19.3177L14.7761 20.8444C14.7413 21.1592 14.5124 21.4182 14.2043 21.4915C12.7558 21.8361 11.2467 21.8361 9.79828 21.4915C9.49015 21.4182 9.26129 21.1592 9.22643 20.8444L9.0576 19.32C9.00802 18.8843 8.75459 18.498 8.37467 18.279C7.99475 18.06 7.53345 18.0343 7.13244 18.2094L5.72582 18.8256C5.43446 18.9533 5.09428 18.8833 4.87703 18.6509C3.86487 17.5685 3.11144 16.2705 2.67344 14.8548C2.57911 14.5499 2.68811 14.2186 2.94509 14.0293L4.18842 13.1133C4.54256 12.8531 4.75172 12.4399 4.75172 12.0005C4.75172 11.561 4.54256 11.1478 4.18796 10.8873L2.94541 9.97285C2.68804 9.78345 2.57894 9.45178 2.67361 9.14658C3.11236 7.73215 3.86619 6.43564 4.87837 5.35462C5.09584 5.12236 5.43618 5.05259 5.72749 5.18056L7.12786 5.79572C7.53081 5.97256 7.99404 5.94585 8.37601 5.72269C8.75633 5.50209 9.00953 5.11422 9.05841 4.67764L9.22849 3.15196C9.26401 2.83335 9.49811 2.57254 9.81105 2.50294C10.5283 2.34342 11.2602 2.25865 12.0124 2.25ZM12.0126 3.7499C11.5586 3.75524 11.1058 3.79443 10.6581 3.86702L10.5491 4.84418C10.4473 5.75368 9.92028 6.56102 9.13066 7.01903C8.33622 7.48317 7.36761 7.53903 6.52483 7.16917L5.62654 6.77456C5.0546 7.46873 4.59938 8.25135 4.27877 9.09168L5.07656 9.67879C5.81537 10.2216 6.25172 11.0837 6.25172 12.0005C6.25172 12.9172 5.81537 13.7793 5.07734 14.3215L4.27829 14.9102C4.59863 15.752 5.05392 16.5361 5.62625 17.2316L6.53138 16.8351C7.36947 16.4692 8.33149 16.5227 9.12377 16.9794C9.91606 17.4361 10.4446 18.2417 10.5482 19.1526L10.6572 20.1365C11.5468 20.2878 12.4557 20.2878 13.3453 20.1365L13.4543 19.1527C13.5551 18.2421 14.083 17.4337 14.8762 16.9753C15.6695 16.5168 16.6334 16.463 17.473 16.8305L18.3775 17.2267C18.9493 16.5323 19.4044 15.7495 19.7249 14.909L18.927 14.3211C18.1882 13.7783 17.7518 12.9162 17.7518 11.9995C17.7518 11.0827 18.1882 10.2206 18.9261 9.67847L19.7229 9.09109C19.4023 8.25061 18.947 7.46784 18.375 6.77356L17.4785 7.16737C17.1132 7.32901 16.718 7.4122 16.3189 7.41158C14.8492 7.41004 13.6158 6.30355 13.4554 4.84383L13.3464 3.8667C12.9009 3.7942 12.4529 3.75512 12.0126 3.7499ZM11.9999 8.24995C14.071 8.24995 15.7499 9.92888 15.7499 12C15.7499 14.071 14.071 15.75 11.9999 15.75C9.92887 15.75 8.24994 14.071 8.24994 12C8.24994 9.92888 9.92887 8.24995 11.9999 8.24995ZM11.9999 9.74995C10.7573 9.74995 9.74994 10.7573 9.74994 12C9.74994 13.2426 10.7573 14.25 11.9999 14.25C13.2426 14.25 14.2499 13.2426 14.2499 12C14.2499 10.7573 13.2426 9.74995 11.9999 9.74995Z" fill="%23020617"/></svg>');
    width: 24px;
    height: 24px;
    display: flex;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
}

.ic-logout {
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.75 19.5C15.1642 19.5 15.5 19.1642 15.5 18.75C15.5 18.3358 15.1642 18 14.75 18H8.5C7.39543 18 6.5 17.1046 6.5 16V8C6.5 6.89543 7.39543 6 8.5 6H14.75C15.1642 6 15.5 5.66421 15.5 5.25C15.5 4.83579 15.1642 4.5 14.75 4.5H8.5C6.567 4.5 5 6.067 5 8V16C5 17.933 6.567 19.5 8.5 19.5H14.75ZM15.7413 8.1989C16.0457 7.91795 16.5201 7.93693 16.8011 8.24129L19.8011 11.4913C20.0663 11.7786 20.0663 12.2214 19.8011 12.5087L16.8011 15.7587C16.5201 16.0631 16.0457 16.0821 15.7413 15.8011C15.4369 15.5202 15.4179 15.0457 15.6989 14.7413L17.537 12.75H9.75C9.33579 12.75 9 12.4142 9 12C9 11.5858 9.33579 11.25 9.75 11.25H17.537L15.6989 9.25871C15.4179 8.95435 15.4369 8.47985 15.7413 8.1989Z" fill="%23020617"/></svg>');
    width: 24px;
    height: 24px;
    display: flex;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
}

.user-area-in-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding: 15px 0;
    margin-left: 15px;
    margin-right: 15px;
    border-top: 1px solid #CBD5E1;
}

.menu-user-action {
    display: flex;
    align-items: center;
    gap: 8px;

}

.user-img-and-text {
    display: flex;
    gap: 16px;
}

.user-img-and-text h3 {
    margin: 0;
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; /* 140% */
}

.user-img-and-text p {
    margin: 0;
    color: #020617;

    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px; /* 128.571% */
}

/*
====================================================================
General & Mobile Menu Responsive
====================================================================
*/

@media screen and (max-width: 1366px) {
    .main-menu {
        gap: 16px;
    }
}

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

}

@media screen and (max-width: 767px) {
    .brand-area {
        padding: 15px;
        margin: 15px;
        background: #241e22;
        border-radius: 12px;
        border: 1px solid #53454e;
    }


}

@media screen and (max-width: 640px) {
    body {
        font-size: 14px;
    }
}


/*
====================================================================
Header section
====================================================================
*/
.header {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.50) -10.89%, rgba(0, 0, 0, 0.12) 62.67%, rgba(0, 0, 0, 0.00) 100%);
    backdrop-filter: blur(0);
    position: fixed;
    left: 0;
    width: 100%;
    top: 0;
    z-index: 100;
    transition: all 0.3s ease;
}

.header:hover, .header.fixed {
    background: rgba(0, 0, 0, 0.50);
    backdrop-filter: blur(24px);
}


.content-header {
    padding: 30px 0;
    display: flex;
    transition: all 0.3s ease;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    background: transparent;
}


.header.fixed .content-header {
    padding: 10px;
}

.header.fixed .logo-site img {
    max-height: 60px;
}
.logo-site img{
    max-height: 80px;
}
.header-right {
    display: flex;
    align-items: center;
    gap: 30px;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.search-form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(248, 250, 252, 0.5);

    border-radius: 30px;
    flex-direction: row-reverse;
    padding: 5px 15px;
    transition: all 0.3s ease;
}

.fixed .search-form {
    background: rgba(241, 245, 249, 0.5);
}

.search-form .form-control {
    border: none;
    background: transparent;
    outline: none;
    box-shadow: none;
}

.search-form .form-control:active ~ form {
    background: #fff;
}

.search-form:focus-within {
    background-color: #ffffff; /* Lighter blue background when focused */
}

.search-form .btn {
    background: transparent;
    border: none;

}

.main-menu {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 30px;
}

.main-menu > li {
    height: 56px;
    display: flex;
    align-items: center;
}

.main-menu li > a {
    color:  #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    position: relative;
    display: block;
}
.main-menu li > a.active:before{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30px;
    height: 4px;
    background: #C01627;
    content: '';
}


.main-menu li > a:hover {
    text-decoration: underline !important;
}

.main-menu .dropdown-menu {
    background: #FFF;
    padding: 10px;
    min-width: 250px;
    margin: 0;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    display: block;
    opacity: 0;
    visibility: hidden;
    border: 0;

    border-radius: 0;
    /*box-shadow: 0 9px 72px 0 rgba(0, 0, 0, 0.25);*/
    /*backdrop-filter: blur(24px);*/
    /*background: rgba(248, 250, 252, 0.8);*/

    background: rgba(217, 217, 217, 0.50);
    backdrop-filter: blur(10px);

}

.main-menu .dropdown-menu li:first-child a {
    border-radius: 5px 5px 0 0;
}

.main-menu .dropdown-menu li > a {
    display: block;
    padding: 8px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
    text-transform: capitalize;
    white-space: nowrap;
    height: auto !important;

}

.main-menu .dropdown-menu a.active {
    background-color: var(--primary);
    color: #ffffff;
}

.main-menu .dropdown-menu li > a:hover {
    background-color: var(--primary-hover);
    color: #ffffff;
}

.main-menu li.dropdown:hover .dropdown-menu {
    left: 50% !important;
    visibility: visible;
    opacity: 1;
}

.main-menu li.dropdown:hover > a {
    color: #F8FAFC;
}

.fixed .main-menu li.dropdown:hover > a {
    color: #020617;

}

.has-sub-menu {
    position: relative;
}

.sub-menu {
    position: absolute;
    left: 100%;
    top: 0;
    display: none;
    list-style: none;
    z-index: 100;
    background: #FFF;
    box-shadow: 0px 4px 19px 0px rgba(0, 0, 0, 0.10);
    padding: 0;
    width: 230px;
    margin: 0;
    border-radius: 5px;
    opacity: 0;
    visibility: hidden;
    border: 0;
}

.has-sub-menu:after {
    background-image: url('data:image/svg+xml,<svg width="12" height="8" viewBox="0 0 12 8" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.5031 1.1294C1.60467 1.26388 1.90793 1.66534 2.08853 1.89676C2.45026 2.36027 2.94452 2.97618 3.47769 3.59026C4.01356 4.20744 4.57648 4.80852 5.07658 5.25039C5.32734 5.47195 5.54762 5.64031 5.72939 5.74989C5.90035 5.85296 6.00134 5.87439 6.00134 5.87439C6.00134 5.87439 6.09936 5.85295 6.27031 5.7499C6.45209 5.64032 6.67237 5.47196 6.92313 5.25039C7.42322 4.80852 7.98615 4.20744 8.52201 3.59025C9.05518 2.97616 9.54944 2.36025 9.91117 1.89673C10.0918 1.66531 10.3946 1.26442 10.4962 1.12994C10.7009 0.852004 11.0925 0.792058 11.3705 0.996751C11.6484 1.20145 11.7078 1.59269 11.5031 1.87063L11.5015 1.87273C11.395 2.01376 11.0809 2.42963 10.8966 2.66577C10.5267 3.13975 10.018 3.77384 9.46589 4.40976C8.91646 5.04257 8.31173 5.69149 7.7508 6.18712C7.47105 6.4343 7.18747 6.65656 6.91567 6.82042C6.66102 6.97393 6.33861 7.125 5.99985 7.125C5.66109 7.125 5.33868 6.97393 5.08404 6.82041C4.81223 6.65656 4.52866 6.4343 4.24891 6.18712C3.68798 5.69149 3.08325 5.04258 2.53382 4.40977C1.98169 3.77386 1.473 3.13978 1.1031 2.6658C0.918709 2.42953 0.60464 2.01371 0.4983 1.87292L0.4969 1.87107C0.292204 1.59313 0.351284 1.20149 0.629218 0.996793C0.907143 0.792105 1.2984 0.851493 1.5031 1.1294Z" fill="%23161616"/></svg>');
    width: 12px;
    height: 8px;
    border: none !important;
    position: absolute;
    right: 10px;
    top: 50%;
    content: '';
}

.has-sub-menu:hover .sub-menu {
    display: block;
    opacity: 1;
    visibility: visible;
}


.mmenu .dropdown-menu {
    position: static !important;
    transform: none !important;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.mmenu .dropdown-toggle::after {
    border: 0;
    content: '\f107';
    font-family: 'Font Awesome 6 Free';
    font-weight: 700;
    font-size: 16px;
}

.mmenu .dropdown-menu a {
    font-weight: 400;
}


@media screen and (max-width: 1400px) {
    .section-home-hero img {
        min-height: 100vh;
    }

    .section-home-hero img {
        object-position: center 20%;
    }

}

@media screen and (max-width: 991px) {
    .main-menu {
        display: none;
    }

    .menu-trigger {
        display: flex;
        font-size: 30px;
        color: #fff;
    }


    .header {
        backdrop-filter: blur(24px);
    }


    .main-menu li.dropdown:hover > a {
        color: #020617;
    }

    .main-menu li > a {
        color: #020617;

    }


    .ic-bars {
        background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.75257 17.9997H21.2526C21.6668 17.9997 22.0026 18.3355 22.0026 18.7497C22.0026 19.1294 21.7204 19.4432 21.3543 19.4928L21.2526 19.4997H2.75257C2.33835 19.4997 2.00257 19.1639 2.00257 18.7497C2.00257 18.37 2.28472 18.0562 2.6508 18.0065L2.75257 17.9997H21.2526H2.75257ZM2.75257 11.5027H21.2526C21.6668 11.5027 22.0026 11.8385 22.0026 12.2527C22.0026 12.6324 21.7204 12.9462 21.3543 12.9959L21.2526 13.0027H2.75257C2.33835 13.0027 2.00257 12.6669 2.00257 12.2527C2.00257 11.873 2.28472 11.5592 2.6508 11.5095L2.75257 11.5027H21.2526H2.75257ZM2.75171 5.00293H21.2517C21.6659 5.00293 22.0017 5.33872 22.0017 5.75293C22.0017 6.13263 21.7196 6.44642 21.3535 6.49608L21.2517 6.50293H2.75171C2.3375 6.50293 2.00171 6.16714 2.00171 5.75293C2.00171 5.37323 2.28386 5.05944 2.64994 5.00978L2.75171 5.00293H21.2517H2.75171Z" fill="%23ffffff"/></svg>');
    }
}

@media screen and (max-width: 767px) {
    .search-form {
        /*display: none;*/
    }

    .search-form .form-control {
        font-size: 12px;
    }

    .notifications-panel, .user-panel-ddl {
        display: none;

    }

    .brand-area .notifications-panel {
        display: block;
    }

    .section-home-hero {
        position: relative;
        min-height: 100vh;
    }

    .section-home-hero img {
        min-height: 100vh;
    }

    .hero-text h3 {
        font-size: 40px;
    }

    .section-home-hero img {
        object-position: center 30%;
    }
}

@media screen and (max-width: 640px) {
    .content-header {
        padding: 15px;
    }
}


/*
====================================================================
Hero section
====================================================================
*/
.section-home-hero {
    position: relative;
}

.section-home-hero img {
    max-width: 100%;
    object-fit: contain;
    max-height: 100vh;
    z-index: 1;
    margin: auto;
    display: block;
    /*filter: grayscale(50%);*/
}

.hero-text {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    min-height: 350px;
    flex-shrink: 0;
    background: linear-gradient(0deg, #080000 50%, rgba(8, 0, 0, 0.00) 100%);
    padding-bottom: 100px;
}

.hero-text h2 {
    color: #C01627;
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: 70px; /* 205.882% */
    margin-bottom: 0;
}

.hero-text h3 {
    color: #FFF;
    font-size: 54px;
    font-style: normal;
    font-weight: 700;
    line-height: 70px;
    margin-bottom: 25px;
}

.hero-action {
    justify-content: flex-end;
    width: 100%;
}

.hero-text-inner {
    max-width: 520px;
}

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

}

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

}

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


}

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

}

/***********Services***********/
.services-section {
    background: #000;
    /*background: radial-gradient(circle, rgba(255,0,0,0.45), transparent 70%);*/
    overflow: hidden;
    position: relative;
}

.sec-header {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.sec-header h2 {
    color: #C01627;
    text-align: center;
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: 70px; /* 205.882% */
    margin: 0;
}

.sec-header h3 {
    color: #FFF;
    font-size: 54px;
    font-style: normal;
    font-weight: 700;
    line-height: 70px;
}

.slashes {
    background-image: url('data:image/svg+xml,<svg width="78" height="2" viewBox="0 0 78 2" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="24" height="2" fill="%23C01627"/><rect x="27" width="24" height="2" fill="%23C01627"/><rect x="54" width="24" height="2" fill="%23C01627"/></svg>');
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    width: 100%;
    height: 2px;
}

.services-items {
    margin-top: 78px;
}

.services-items:before {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 70%;
    height: 100%;
    margin: auto;
    background: radial-gradient(circle, #3b0000 0%, #000 80%);
    content: '';
    z-index: 1;
    filter: blur(472px);

}

.services-items > div {
    position: relative;
    z-index: 2;
}

/* أيقونات */
.icon-wrapper img {
    transition: 0.3s;
}

.service-box:hover img {
    transform: scale(1.25) rotate(-5deg);
    filter: drop-shadow(0 0 8px #ff0000);
}

/* صورة السيارة */
.car-img {
    max-width: 370px;
    position: relative;
    z-index: 3;
}

/* إضاءة خلف السيارة */
.car-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(255, 0, 0, 0.45), transparent 70%);
    transform: translate(-50%, -50%);
    filter: blur(40px);
    z-index: 1;
}

.pt-130 {
    padding-top: 130px;
}

.services-items .row > div:first-of-type .service-box:first-child {
    padding-top: 110px;
}

.service-box {
    margin-bottom: 93px;
}

.services-items .row > div .service-box:last-child {
    margin-bottom: 0;
}

.service-box-text {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.services-items .row > div:first-of-type .service-box-text {
    align-items: flex-end;
    text-align: left;
}

.service-box {
    gap: 14px;
}

.service-box h3 {
    margin: 0;
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.service-box p {
    color: #FFF;
    text-align: justify;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 0;
}

.services-items .row > div:first-of-type .service-box-text p {
    direction: ltr;
}

.video-section {
    min-height: 528px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/***************Contact******************/
.contact-section {
    padding: 116px 0 90px 0;
    background: url(../images/contact-bg.png) center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

.contact-text h2 {
    max-width: 423.277px;
    width: 100%;
    flex-shrink: 0;

    color: #FFF;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px; /* 116.667% */
    letter-spacing: -1.06px;
    position: relative;
    margin-bottom: 17px;
}

.contact-text h2:before {
    position: relative;
    content: '';
    background-image: url('data:image/svg+xml,<svg width="59" height="16" viewBox="0 0 59 16" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_7_2227" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="59" height="15"><path d="M59 0H0V14.498H59V0Z" fill="white"/></mask><g mask="url(%23mask0_7_2227)"><path d="M25.6883 0H17.7395L3.11426 14.498H11.0631L25.6883 0Z" fill="%23EC1B2F"/><path d="M41.0457 0H33.097L18.4717 14.498H26.4204L41.0457 0Z" fill="%23EC1B2F"/><path d="M56.4028 0H48.4471L33.8286 14.498H41.7707L56.4028 0Z" fill="%23EC1B2F"/></g></svg>');
    width: 100%;
    height: 16px;
    background-position: right center;
    background-repeat: no-repeat;
    display: flex;
    margin-bottom: 11px;
}

.contact-text p {
    color: #9A9A9A;
    text-align: justify;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; /* 175% */
}

.contact-form .row > div {
    margin-bottom: 30px;
}

.contact-form .btn-primary {
    min-width: 230px;
}

.form-group {
    position: relative;
}

.form-group .form-control {
    height: 53px;
    padding: 17.5px 20px;
    border-radius: 0;

    border: 1px solid #272727;
    background: rgba(39, 39, 39, 0.30);
    box-shadow: none !important;
    outline: none !important;

    color: #6C757D;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.form-group textarea.form-control {
    height: 198px;
}

/* عند التركيز */
.form-group .form-control:focus {
    border-color: #868686;
    background: rgba(39, 39, 39, 0.30);

}

/* الليبل */
.form-group label {
    position: absolute;
    right: 15px;
    top: 15px;
    transform: translateY(0);

    pointer-events: none;
    transition: 0.3s ease;
    background: transparent;

    color: #6C757D;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.form-group textarea.form-control + label {
    top: 15px;
    transform: translateY(0);
}

/* عند focus أو عند وجود نص داخل الحقل */
.form-group .form-control:focus + label,
.form-group .form-control:not(:placeholder-shown) + label {
    top: -1px;
    right: 10px;
    font-size: 13px;
    padding: 0 5px;
    color: #9aaab5;
    background: #000;
    border-radius: 3px;
    transform: translateY(-50%);
}

.form-group textarea.form-control:focus + label,
.form-group textarea.form-control:not(:placeholder-shown) + label {
    top: -12px;
}
.form-group label.error{
    position: relative;
    top:auto;
    color: var(--primary);
    transform: translateY(0);
}
@media (max-width: 992px) {
    .service-box {
        flex-direction: column;
        text-align: center;
    }

    .icon-wrapper {
        margin-bottom: 10px;
    }

    .car-img {
        max-width: 240px;
    }
}


.play-btn {
    width: 110px;
    height: 110px;
    background: rgba(255, 0, 0, 0.9);
    border-radius: 50%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.play-btn .icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
}

/* نبضات خارجية */
.play-btn::before,
.play-btn::after {
    content: "";
    position: absolute;
    width: 110px;
    height: 110px;
    background: rgba(255, 0, 0, 0.4);
    border-radius: 50%;
    animation: pulse 1.8s infinite ease-out;
    z-index: 1;
}

.play-btn::after {
    animation-delay: 0.6s;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        opacity: 0.6;
    }
    70% {
        transform: scale(1.8);
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

/*******************Footer*******************/
.footer {
    margin-top: auto;
    background: #110E10;
    padding: 74px 0 0 0;
}

.footer-logo {
    margin-bottom: 15px;
    display: flex;
}

.footer-logo img {
    max-height: 53px;
}

.footer-contact h2 {
    color: #EC1B2F;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px; /* 185.714% */
    text-transform: uppercase;
}

.footer-contact p {
    color: #FFF;
    font-size: 32px;
    line-height: 36px; /* 112.5% */
    letter-spacing: 1px;
    text-transform: uppercase;

    font-family: "Bai Jamjuree", sans-serif;
    font-weight: 700;
    font-style: normal;
    margin-bottom: 14px;
}

.footer-contact-email h2 {
    color: #EC1B2F;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px; /* 185.714% */
    text-transform: uppercase;
}

.footer-contact-email p {
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 30px; /* 166.667% */
    letter-spacing: -0.18px;
}

.footer-menu h2 {
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px; /* 137.5% */
    letter-spacing: 0.64px;
    text-transform: uppercase;
    position: relative;
    margin-bottom: 36px;
}

.footer-menu h2:before {
    position: relative;
    content: '';
    background-image: url('data:image/svg+xml,<svg width="59" height="16" viewBox="0 0 59 16" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_7_2227" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="59" height="15"><path d="M59 0H0V14.498H59V0Z" fill="white"/></mask><g mask="url(%23mask0_7_2227)"><path d="M25.6883 0H17.7395L3.11426 14.498H11.0631L25.6883 0Z" fill="%23EC1B2F"/><path d="M41.0457 0H33.097L18.4717 14.498H26.4204L41.0457 0Z" fill="%23EC1B2F"/><path d="M56.4028 0H48.4471L33.8286 14.498H41.7707L56.4028 0Z" fill="%23EC1B2F"/></g></svg>');
    width: 100%;
    height: 10px;
    background-position: right center;
    background-repeat: no-repeat;
    display: flex;
    margin-bottom: 5px;
    background-size: contain;
}

.footer-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.footer-menu ul a {
    color: #9A9A9A;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px; /* 185.714% */
    letter-spacing: 0.42px;
    text-transform: uppercase;
    position: relative;
}

.footer-menu li a:before {
    content: '';
    display: inline-block;
    position: absolute;
    right: 0;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

.footer-menu li:hover a {
    opacity: 1;
    padding-right: 15px;
    color: #fff;
}

.footer-menu li:hover a::before {
    content: "\f104";
}

.footer-social {
    display: flex;
    gap: 3px;
}

.footer-social a {
    display: flex;
    width: 50px;
    height: 50px;
    padding: 17px;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.10);

    color: #FFFFFF;
    font-size: 20px;
    position: relative;
    overflow: hidden;
}

@keyframes a-animation-pulse-grow {
    to {
        transform: scale(1.1)
    }
}

.footer-social a:hover {
    background: var(--primary);
    color: #000;
    animation-name: a-animation-pulse-grow;
    animation-duration: .3s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    /*border-radius: 50%;*/
}

/*****************/

/*.footer-social a::before,*/
/*.footer-social a::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    background: var(--primary);*/
/*    transition: 0.4s linear;*/
/*}*/


/*!* الخط الأفقي *!*/
/*.footer-social a::before {*/
/*    height: 2px;*/
/*    width: 0;*/
/*    top: 0;*/
/*    left: 0;*/
/*}*/

/*!* الخط العمودي *!*/
/*.footer-social a::after {*/
/*    width: 2px;*/
/*    height: 0;*/
/*    bottom: 0;*/
/*    right: 0;*/
/*}*/

/*.footer-social a:hover::before {*/
/*    width: 100%;   !* يمشي من اليسار لليمين *!*/
/*}*/

/*.footer-social a:hover::after {*/
/*    height: 100%;  !* يصعد من الأسفل للأعلى *!*/
/*}*/

/*!* إضافة خطين إضافيين لإكمال الدوران *!*/
/*.footer-social a span::before,*/
/*.footer-social a span::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    background: var(--primary);*/
/*    transition: 0.4s linear;*/
/*}*/

/*!* خط عمودي يسار *!*/
/*.footer-social a span::before {*/
/*    width: 2px;*/
/*    height: 0;*/
/*    top: 0;*/
/*    left: 0;*/
/*}*/

/*!* خط أفقي أسفل *!*/
/*.footer-social a span::after {*/
/*    height: 2px;*/
/*    width: 0;*/
/*    bottom: 0;*/
/*    right: 0;*/
/*}*/

/*.footer-social a:hover span::before {*/
/*    height: 100%; !* ينزل من الأعلى للأسفل *!*/
/*}*/

/*.footer-social a:hover span::after {*/
/*    width: 100%; !* يمشي من اليمين لليسار *!*/
/*}*/

.footer-2 {
    margin-top: 79px;
    border-top: 1px solid #272727;
    padding: 35px 0;
}

.footer-2-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-2-inner p {
    margin: 0;
    color: #9A9A9A;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px; /* 212.5% */
}

.footer-2-inner p a {

    color: #EC1B2F;
}

.paymenys {
    display: flex;
    align-items: center;
    gap: 19px;

}

.section-page-header {
    position: relative;
}


.section-page-header img {
    width: 100%;
    object-fit: cover;
    max-height: 100vh;
    z-index: 1;
    margin: auto;
    display: block;
    filter: grayscale(50%);
    mix-blend-mode: luminosity;
}

.section-page-header .hero-text-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    max-width: 100%;
}

.section-page-header .hero-text-inner h1 {
    color: #FFF;
    font-size: 54px;
    font-style: normal;
    font-weight: 700;
    line-height: 70px;
}

.hero-text-inner .breadcrumb-item a {
    color: var(--primary);
}

.hero-text-inner .breadcrumb-item.active {
    color: #fff;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: #fff;
}

.service-item {
    border: 1px solid #272727;
    background: rgb(12, 12, 12);
    padding: 35px 20px;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 13px;
    position: relative;
    z-index: 3;

}

.service-item-icon-wrapper {
    display: flex;
}

.service-item-icon-wrapper img {
    width: 82px;
    height: 82px;
    flex-shrink: 0;
    border-radius: 50%;
}

.service-item h3 {
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.service-item p {
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.service-action {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: auto;
}

.service-action .btn {
    width: 50%;
}

.services-inner-items .row > div {
    transition: all 0.3s ease-in-out;
    position: relative;
}

.services-inner-items .row > div:before {
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(100% + 100px);
    height: calc(100% + 100px);
    background: radial-gradient(circle, rgba(255, 0, 0, 0.45), transparent 70%);
    transform: translate(-50%, -50%);
    filter: blur(40px);
    z-index: 1;
    transition: all 0.3s ease-in-out;
    content: '';
}

.services-inner-items .row > div:hover {
    transform: translateY(-10px);
}

.services-inner-items .row > div:hover:before {
    opacity: 1;
}

.branches-section {
    padding: 0 0 80px 0;
}

.branch-item {
    border: 1px solid #272727;
    background: rgb(12, 12, 12);
    padding: 33px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    height: 100%;
    position: relative;
    z-index: 3;
}

.branch-item h3 {
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.branch-item h4 {
    color: #FFF;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.branch-item h4 a {
    display: flex;
    gap: 8px;
    align-items: center;
}

.branch-item .book-link {
    width: 82px;
    height: 82px;
    flex-shrink: 0;
    border: 1px solid #C01627;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.branch-item .book-link span {
    width: 62px;
    height: 62px;
    flex-shrink: 0;
    background-color: #C01627;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

.ic-address {
    background-image: url('data:image/svg+xml,<svg width="18" height="21" viewBox="0 0 18 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.5 6.7C16.45 2.08 12.42 0 8.87998 0C8.87998 0 8.87998 0 8.86998 0C5.33998 0 1.29998 2.07 0.249978 6.69C-0.920022 11.85 2.23998 16.22 5.09998 18.97C6.15998 19.99 7.51998 20.5 8.87998 20.5C10.24 20.5 11.6 19.99 12.65 18.97C15.51 16.22 18.67 11.86 17.5 6.7ZM8.87998 11.71C7.13998 11.71 5.72998 10.3 5.72998 8.56C5.72998 6.82 7.13998 5.41 8.87998 5.41C10.62 5.41 12.03 6.82 12.03 8.56C12.03 10.3 10.62 11.71 8.87998 11.71Z" fill="%23EC1B2F"/></svg>');
    width: 18px;
    height: 21px;
    display: flex;
    flex-shrink: 0;
}


.branches-items > div {
    transition: all 0.3s ease-in-out;
    position: relative;
}

.branches-items > div:before {
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: 120%;
    background: radial-gradient(circle, rgba(255, 0, 0, 0.45), transparent 70%);
    transform: translate(-50%, -50%);
    filter: blur(40px);
    z-index: 1;
    transition: all 0.3s ease-in-out;
    content: '';
}

.branches-items > div:hover {
    /*transform: translateY(-10px);*/
}

.branches-items > div:hover:before {
    opacity: 1;
}

.alignright {
    float: right;
    margin-left: 15px;
}

.alignleft {
    float: left;
    margin-right: 15px;
}

.aligncenter {
    display: block;
    margin: 15px auto;
}

.page-inner {
    padding: 0 0 80px 0;
    text-align: justify;
}

.page-inner iframe {

}

.video-frame {
    width: 100%;
}

.video-frame iframe {
    width: 100%;
    height: 450px;
    margin-bottom: 30px;
}


.video-wrapper {
    width: 100%;
    height: 450px;
    max-width: 100%;
    position: relative;
    overflow: hidden;
    margin: 30px auto;
}

/* جعل الفيديو يتمركز */
.video-wrapper video {
    width: 100% !important;
    height: 100% !important;
    margin: auto;
}

.layout_inner_content {
    padding-top: 130px;
}

.layout_inner_content-hed {
    background: #111;
    padding: 30px 0;
}

.layout_inner_content-hed .breadcrumb-item.active {
    color: var(--primary);
}

.txt_editor {
    padding: 40px 0;
}
.footer-whats a {
    width: 60px;
    height: 60px;
    background: #25d366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 35px;
}
.footer-whats a.phone-a {
    background: #269d68;
    font-size: 30px;
}
.footer-whats {
    position: fixed;
    right: 15px;
    bottom: 15px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    z-index: 100;
}

.grecaptcha-badge {
    visibility: hidden;
}

@media (max-width: 991px) {

    .section-page-header {
        position: relative;
        min-height: 100vh;
    }

    .section-page-header img {
        min-height: 100vh;
    }

    .section-page-header .hero-text-inner h1 {
        font-size: 25px;
        line-height: normal;
    }

    .section-page-header .hero-text-inner {
        flex-direction: column;
        align-items: self-start;
    }

    .video-section {
        background-size: contain !important;
        background-color: #000 !important;
    }

    .play-btn .icon {
        width: 70px;
        height: 70px;
    }

    .play-btn {
        width: 80px;
        height: 80px;
    }

    .video-section {
        min-height: 308px;
    }

    .contact-section {
        background-size: contain;
    }

}

@media (max-width: 640px) {
    .services-items .row > div:first-of-type .service-box:first-child {
        padding-top: 0;
    }

    .pt-130 {
        padding-top: 30px;
    }

    .service-box {
        margin-bottom: 40px;
    }

    .hero-text h3 {
        font-size: 40px;
    }

    .sec-header h2 {
        font-size: 30px;
        line-height: normal;
    }

    .sec-header h3 {
        font-size: 40px;
    }

    .services-items .row > div:first-of-type .service-box-text {
        align-items: center;
        text-align: center;
    }

    .services-items .row > div:first-of-type .service-box-text p {
        direction: rtl;
    }

    .contact-text h2 {
        font-size: 37px;
        line-height: normal;
    }

    .footer-2-inner {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        gap: 20px;
    }


    .services-items::before {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        transform: translateY(0);
        width: 100%;
        height: 600px;
        margin: auto;
        background: radial-gradient(circle, #b71a1a 0%, #000 80%);
        content: '';
        z-index: 1;
        filter: blur(475px);
    }

    .section-page-header {
        position: relative;
        min-height: 100vh;
    }

    .section-page-header img {
        min-height: 100vh;
    }

    .section-page-header .hero-text-inner h1 {
        font-size: 25px;
        line-height: normal;

    }

    .section-page-header .hero-text-inner {
        flex-direction: column;
        align-items: self-start;
    }


    .aligncenter, .alignright, .alignleft {
        display: block;
        margin: 15px auto;
        float: none;
    }

    .branch-item h3 {
        font-size: 17px;
        line-height: 30px;
    }

    .branch-item {
        padding: 15px;
        gap: 15px;

    }

    .hero-text h3, .hero-text-inner h3 {
        font-size: 30px;
        line-height: normal;
    }

    .hero-text h2, .hero-text-inner h2, .hero-text-inner h1 {
        font-size: 25px;
        line-height: normal;
    }

    .hero-text {
        background: linear-gradient(0deg, #080000 80%, rgba(8, 0, 0, 0.00) 100%);
        padding-bottom: 30px;
    }

    .section-page-header .hero-text{
        background: transparent;
    }
    .section-home-hero {
        min-height: auto;
    }

    .section-home-hero img  {
        min-height: 580px;
    }

   .section-page-header img {
        min-height: 480px;
        object-position: center 130px;
    }
    .section-page-header img {
        object-fit: contain;
    }

    .hero-action {
        justify-content: center;
        width: 100%;
    }


    .play-btn .icon {
        width: 50px;
        height: 50px;
    }

    .play-btn {
        width: 40px;
        height: 40px;
    }

    .contact-section {
        padding: 20px 0 20px 0;
    }

    .contact-text h2 {
        font-size: 25px;
    }

    .section-page-header {
        min-height: auto;
    }

    .contact-form .btn-primary {
        margin: auto;
    }

    .services-items {
        margin-top: 0;
    }

    .car-img {
        max-width: 50%;
    }
    .hero-text-inner {
        max-width: 100%;
        text-align: center;
    }
    .service-box h3 {
        font-size: 20px;
        line-height: 30px;
    }
    .footer-menu ul {
        gap: 15px;
    }
    .footer-menu h2:before {
        background-position: center;
    }
    .footer-menu h2{
        text-align: center;
    }
    .footer-social {
        justify-content: center;
    }
    .footer-menu ul a {
        text-align: center;
        width: 100%;
        display: block;
    }
    .footer-logo {
        justify-content: center;
    }
    .footer-contact , .footer-contact-email{
        text-align: center;
    }
    .footer-2 {
        margin-top: 30px; 
        padding: 30px 0;
    }
}

@media (max-width: 550px) {
    .video-section {
        min-height: 208px;
    }
    .hero-text {
        background: linear-gradient(0deg, #000 90%, rgba(8, 0, 0, 0.00) 100%);
        padding-bottom: 40px;
    }
    .section-home-hero img {
        object-position: center 33%;
    }
}