/* @import url("https://fonts.googleapis.com/css2?family=Redressed&display=swap");  */
:root {
    --bs-color: #013b71;
    --primary-color: #013b71;
    --primary-dark: #105690;
    --secondary-color: #470c00;
    --font-1: "Inter", sans-serif;
    --font-2: "Inter", sans-serif;
    --font-3: "Lora", serif;
    --font-sp: "Lora", serif;
    --gradient-primary: linear-gradient(135deg, #013b71 0%, #0254a3 100%);
    --gradient-light: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
    --gradient-overlay: linear-gradient(180deg, rgba(1, 59, 113, 0) 0%, rgba(1, 59, 113, 0.8) 100%);
    --bg-g-plight: linear-gradient(135deg, #013b71 0%, #4a90e2 100%);
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    color: #333;
    font-family: var(--font-1);
    font-size: 1rem;
    line-height: 1.7;
    overflow-x: hidden;
}

.f1 {
    font-family: var(--font-1);
}

.f2 {
    font-family: var(--font-2);
}

.fsp {
    font-family: var(--font-sp);
}

.bs-color, .primary-text {
    color: var(--bs-color);
}

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

.accent, .text-pgradient {
    background: linear-gradient(135deg, #013b71 0%, #4a90e2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

ul {
    list-style: none;
    padding: 0px;
}

h1, h2, h3, h4, h5, h6 {
    color: #172541;
    margin-bottom: 0;
    margin-top: 0;
}

p {
    font-weight: 400;
    font-style: normal;
    font-family: var(--font-2);
}

ul, ol {
    margin: 0;
    padding: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
    color: var(--bs-color);
}

strong {
    font-weight: 600
}

.section-label {
    display: inline-block;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--primary-color);
    margin-bottom: 1rem;
    font-family: var(--font-2);
}

.section-title {
    font-family: var(--font-3);
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
    color: #212121;
}

.light .section-title {
    color: #fff;
}

.main-wrapper {
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
}

.bg-sec {
    background: #fff6f6;
}

.section-about-home {
    position: relative;
    padding: 50px 0px 80px;
}

.section-about-home .overlay-bg {
    position: absolute;
    bottom: 0;
    width: 26%;
    right: 13%;
    z-index: -1;
    opacity: 0.2;
}

.section-about-home .content-about-home p {
    color: #242424;
    font-size: 17.9px;
    line-height: 35px;
    opacity: 88%;
    text-align: justify;
    margin-bottom: 6px;
    font-family: var(--font-2);
    font-weight: 400;
}

.ser_1 {
    background: #fff6f6;
}

.img_wrapper {
    border-radius: 12px;
    overflow: hidden;
}

.section-treatment-home h3 {
    font-size: 3em;
}

.logo-txt::before {
    content: "MILITANT";
    position: absolute;
    top: 17px;
    left: 10px;
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
    z-index: 9999;
    font-weight: 700;
    display: none;
}

.menu-toggle {
    color: #549e27;
    font-size: 22px;
    cursor: pointer;
    /* position: absolute;
                                                      right: 20px;
                                                      display: none;
                                                      top: 17px; */
    padding: 3px 13px;
    background-color: var(--bs-color);
    color: #fff;
    border-radius: 6px;
}

.mobile-angle-icon {
    display: none !important;
}

.header-top-area {
    background: #023d6f;
    padding: 9px 0;
}

.odic-header-left ul {
    margin-bottom: 0px;
    list-style: none;
}

.odic-header-left ul li {
    display: inline-block;
    margin-right: 16px;
}

.odic-header-left ul li a {
    color: #e7e7e7;
    font-size: 14.5px;
    letter-spacing: 0.35px;
}

.odic-header-left ul li a i {
    margin-right: 7px;
}

.odic-header-left ul li span {
    /* color: #fff; */
}

.odic-header-left ul li span i {
    margin-right: 7px;
}

.odic-header-right {
    text-align: right;
}

.odic-header-right a {
    color: #fff;
    display: inline-block;
    margin-left: 15px;
}

.sticky-nav1 {
    left: 0;
    margin: auto;
    /* position: sticky; */
    top: 0;
    width: 100%;
    -webkit-box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
    z-index: 999;
    -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    -webkit-transition: .5s !important;
    transition: .5s !important;
    /* background: #549e28 !important; */
}

.sticky-nav .odic-header-menu ul li a {
    color: #000;
}

.main-logo img {
    max-width: 100%;
    padding: 13px 0;
}

.sticky-nav .main-logo {
    /* display: block; */
    max-width: 280px;
}

.sticky-nav .main-logo {
    /* display: none; */
}

.stiky-logo {
    display: none;
}

.mobile-menu-social-icon {
    display: none;
}

.header-area {
    background: #ffffff;
    padding: 10px 0;
}

.odic-header-logo {
    max-width: 320px;
}

.odic-header-menu {
    padding: 4px 0;
}

.odic-header-menu ul {
    display: inline-flex;
    gap: 10px 48px;
}

.odic-header-menu ul li {
    display: inline-block;
    position: relative;
}

.odic-header-menu ul li a {
    display: inline-block;
    font-size: clamp(15px,1.2vw,16px);
    font-weight: 600;
    -webkit-transition: .3s;
    transition: .3s;
    color: #000000;
    font-family: var(--font-2);
    /* text-transform: uppercase; */
}

.odic-header-menu ul li a:not(.active) {
    opacity: 80%;
}

.odic-header-menu ul li a:hover {
    color: var(--bs-color);
}

.odic-header-menu ul li a.active {
    color: var(--bs-color);
}

.odic-header-menu ul li .sub-menu {
    opacity: 0;
    background: #fff;
    width: 205px;
    position: absolute;
    left: 0;
    top: 150%;
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 22;
    overflow: hidden;
    visibility: hidden;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    border-top: 3px solid var(--bs-color);
    padding: 10px 0;
}

.odic-header-menu ul li .sub-menu ul li {
    display: block;
}

.odic-header-menu ul li .sub-menu ul li a {
    visibility: inherit;
    padding: 8px 30px;
    -webkit-transition: .5s;
    transition: .5s;
    display: block;
    font-size: 15px;
    color: #333 !important;
    transition: .5s;
    margin: 0;
}

.odic-header-menu ul li .sub-menu ul li a:hover {
    color: var(--bs-color) !important;
}

.odic-header-menu ul li:hover .sub-menu {
    opacity: 1;
    top: 101%;
    visibility: visible;
}

.header-button {
    display: inline-block;
}

.header-button a {
    font-size: 14px;
    font-weight: 600;
    color: white;
    background: var(--gradient-primary);
    padding: 14px 35px;
    border: 1px solid transparent;
    border-radius: 8px;
    display: inline-block;
    text-align: center;
    margin-left: 16px;
    -webkit-transition: .5s;
    transition: .5s;
    font-family: var(--font-2);
}

.header-button a:hover {
    /* border-color: var(--secondary-color); */
    /* background: var(--secondary-color); */
    /* color: #fff; */
}

.slider-area {
    aspect-ratio: 16/9;
    background: url(../images/slider/slider-1.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 1;
    background-color: #00000057;
    background-blend-mode: darken;
}

.odic-slider-content h1, .odic-slider-content h2, .odic-slider-content h3, .slider-title__sub {
    color: #fff;
}

.odic-slider-content h1, .odic-slider-content h2 {
    font-weight: 500;
    letter-spacing: 1px;
    margin: 0 0 30px;
    text-transform: capitalize;
    font-family: var(--font-3);
    font-size: clamp(35px,4vw,58px);
    font-weight: 600;
}

.slider-title__sub, .odic-slider-content h3 {
    font-size: clamp(0.85rem,3vw,1.25rem);
    max-width: 700px;
    font-weight: 400;
    margin-left: 0;
    text-transform: capitalize;
    display: block;
    margin-top: 20px;
    margin-bottom: 12px;
}

.slider-button a {
    margin-right: 30px;
    margin-bottom: 16px;
}

/*
.slider-button a {
    color: #fff;
    display: inline-block;
    background: transparent;
    border: 2px solid #fff;
    font-size: 17px;
    padding: 18px 50px;
    text-transform: capitalize;
    -webkit-transition: .5s;
    transition: .5s;
}

.slider-button a:hover {
    background: var(--bs-color) !important;
    color: #fff;
    border: 2px solid var(--bs-color) !important;
}

.slider-button .active {
    color: #fff;
    background: var(--bs-color) !important;
    border: 2px solid var(--bs-color);
    -webkit-transition: .5s;
    transition: .5s;
}

.slider-button .active:hover {
    background: transparent !important;
    border: 2px solid #fff !important;
}
*/
.slider3.slider-area:before {
    display: none;
}

.slider-area:before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 0;
    background: rgb(24 35 61 / 55%);
}

.owl-nav {
    position: relative;
}

/* !important */
.owl-nav button {
    position: absolute;
    top: -500px;
    width: 50px;
    height: 50px;
    line-height: 50px !important;
    border: 1px solid var(--secondary-color) !important;
    text-align: center;
    border-radius: 50% !important;
    font-size: 25px !important;
    color: var(--secondary-color) !important;
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 1;
}

.owl-prev {
    left: -58px;
}

.owl-prev:hover {
    background: var(--secondary-color);
    color: #282828;
}

.owl-next {
    position: absolute;
    top: -500px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border: 1px solid var(--secondary-color);
    text-align: center;
    border-radius: 50% !important;
    text-align: center;
    font-size: 25px;
    color: var(--secondary-color);
    -webkit-transition: .5s;
    transition: .5s;
    right: -58px;
}

.owl-next:hover {
    background: var(--secondary-color);
    color: #282828;
}

.slider_list:hover .owl-prev {
    left: 40px;
}

.slider_list:hover .owl-next {
    right: 40px;
}

.nivo_slider_area {
    position: relative;
}

.nivo-caption {
    background: rgba(0, 0, 0, 0.4);
    height: 100%;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.em_slider_inner {
    margin: auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 9999;
}

.em-slider-title {
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 23px;
    text-transform: uppercase;
}

.em-slider-main-title {
    color: #fff;
    font-size: 50px;
    font-weight: 700;
}

.em-slider-sub-title {
    font-size: 19px;
    font-weight: 400;
    color: var(--bs-color);
    letter-spacing: 2px;
}

.em-nav-slider-title-center {
    color: #fff;
    font-size: 55px;
    font-weight: 800;
}

.em-nav-slider-title-centerspan {
    color: #0c5adb;
}

.em-slider-up-title {
    font-size: 38px;
    color: #fff;
    font-weight: 300;
    padding-bottom: 8px;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.em-slider-sub-em-title {
    font-size: 24px;
    color: #fff;
    font-weight: 500;
}

.em-slider-descript p {
    padding: 5px;
    width: 56%;
    font-size: 17px;
    margin: 24px 0 24px;
}

.text-left .em-slider-descript {
    margin-left: 0;
    margin-right: auto;
}

.text-center {
    text-align: center;
}

.text-center .em-slider-descript {
    margin: 22px auto 28px;
    width: 62%;
    font-size: 17px;
}

.text-right .em-slider-descript {
    margin-right: 0;
    margin-left: auto;
    width: 60%;
    font-size: 17px;
    padding-top: 25px;
}

.em-slider-button.wow.bounceInUp.em-button-button-area.animated {
    padding-top: 19px;
}

.em-button-button-area a {
    border: 1px solid #ccc;
    color: #fff;
    display: inline-block;
    font-size: 15px;
    margin-right: 10px;
    margin-top: 12px;
    padding: 15px 41px;
    position: relative;
    text-transform: uppercase;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    z-index: 999;
    letter-spacing: 1px;
    border-radius: 5px;
}

.em-button-button-area a:hover {
    color: #fff;
    background: #0c5adb;
    border-color: #0c5adb;
}

a.em-active-button {
    background: var(--bs-color);
    border-color: var(--bs-color);
}

a.em-active-button:hover {
    background: #fff;
    border-color: #fff;
    color: var(--bs-color);
}

.em-slider-half-width {
    width: 50%;
}

.em-slider-half-width .em-slider-descript {
    width: 100%;
}

.em-slider-left {
    padding-right: 30px;
}

.em-slider-right {
    padding-left: 30px;
}

.em-slider-full-width {
    width: 85%;
}

.nivo-controlNav {
    float: right;
    padding: 15px 0;
    text-align: center;
    position: relative;
    margin-top: -202px;
    z-index: 22;
    background: #fff;
    padding: 10px 20px;
    border-radius: 5px 0 0 5px;
}

.em-nivo-slider-wrapper .nivo-directionNav a {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 75px;
    width: 50px;
    line-height: 68px;
    text-align: center;
    display: block;
    border-radius: 50%;
    color: #0c5adb;
    font-size: 40px;
    left: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
    border-radius: 0;
    background: #fff;
    margin-right: 30px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 78px;
    width: 50px;
    line-height: 74px;
    border: 1px solid var(--bs-color);
    text-align: center;
    display: block;
    color: var(--bs-color);
    font-size: 28px;
    left: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
}

.em-nivo-slider-wrapper .nivo-directionNav a:hover {
    background: var(--bs-color);
    border-color: var(--bs-color);
    color: #fff;
}

.em-nivo-slider-wrapper .nivo-directionNav .nivo-prevNav {
    margin-left: 30px;
}

.em-nivo-slider-wrapper .nivo-directionNav .nivo-nextNav {
    left: auto;
    right: 0;
}

.em-nivo-slider-wrapper:hover .nivo-directionNav a {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
    left: 50px;
}

.em-nivo-slider-wrapper:hover .nivo-directionNav .nivo-nextNav {
    left: auto;
    right: 50px;
}

.em-nivo-slider-wrapper .nivo-controlNav {
    bottom: 50px;
    padding: 0;
    position: absolute;
    width: 100%;
    z-index: 9;
    display: none;
}

.em-nivo-slider-wrapper .nivo-controlNav a {
    background: var(--bs-color);
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    height: 25px;
    margin: 0 5px;
    width: 25px;
    color: #fff;
    line-height: 25px;
}

.em-nivo-slider-wrapper .nivo-controlNav a:hover {
    background: #172541 none repeat scroll 0 0;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.em-nivo-slider-wrapper .nivo-controlNav a.active {
    background: #172541 none repeat scroll 0 0;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.cd-headline.clip span {
    display: inline-block;
    padding: 0 0 0;
}

.cd-headline.clip span b {
    display: inline-block;
    color: #fff;
    text-transform: uppercase;
}

.pricing-area {
    background: #f2f5f8;
}

.odic-pricing-box {
    padding: 51px 40px 70px;
    -webkit-box-shadow: 10px 8px 35px 0px rgba(49, 49, 49, 0.08);
    box-shadow: 10px 8px 35px 0px rgba(49, 49, 49, 0.08);
    text-align: left;
    background: #fff;
    overflow: hidden;
    position: relative;
    -webkit-transition: .5s;
    transition: .5s;
    margin-bottom: 30px;
}

.odic-pricing-box:hover {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}

.odic-pricing-box:hover .pricing-button a {
    background: var(--bs-color);
    color: #fff;
}

.odic-pricing-box:before {
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    background: url(assets/images/pricing.png);
    height: 210px;
    width: 218px;
}

.pricing-title h3 {
    font-size: 25px;
    color: var(--bs-color);
    font-weight: 700;
    margin-bottom: 12px;
}

.pricing-tk h3 {
    font-size: 40px;
    font-weight: 400;
    color: #565872;
    font-family: 'Heebo', sans-serif;
}

.pricing-tk span {
    font-size: 16px;
    font-weight: 400;
}

.pricing-body ul {
    list-style: none;
    display: inline-block;
    padding: 30px 0px 48px 0;
}

.pricing-body ul li {
    display: block;
    font-size: 16px;
    padding: 8px 0;
    font-family: 'Heebo', sans-serif;
}

.pricing-button a {
    font-size: 15px;
    font-weight: 500;
    padding: 16px 44px;
    background: #F2F5F8;
    color: #565872;
}

.row.mtmargin {
    position: relative;
    margin-top: -100px;
    z-index: 1;
}

.odic-feature-box {
    -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.11);
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.11);
    background: #fff;
    padding: 52px 35px 45px 36px;
    margin-bottom: 30px;
}

.odic-feature-box:hover .odic-feature-box-icon {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}

.odic-feature-box:hover .single-feature-content h4 {
    color: var(--bs-color);
}

.odic-feature-box-icon {
    -webkit-transition: .5s;
    transition: .5s;
    text-align: center;
}

.single-feature-content h4 {
    font-weight: 700;
    margin-bottom: 10px;
    font-size: 20px;
}

.feature-button a {
    font-size: 13px;
    font-weight: 400;
    color: var(--bs-color);
    letter-spacing: 2px;
    text-decoration: underline;
    padding: 0 !important;
    -webkit-transition: .5s;
    transition: .5s;
}

.feature-button a:hover {
    text-decoration: underline;
}

.odic-feature-box {
    -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.11);
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.11);
    background: #fff;
    padding: 52px 35px 45px 36px;
    margin-bottom: 30px;
}

.odic-feature-box-icon {
    -webkit-transition: .5s;
    transition: .5s;
    text-align: center;
}

.odic-feature-box:hover .odic-feature-box-icon {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}

.single-feature-content h4 {
    font-weight: 700;
    margin-bottom: 10px;
    font-size: 20px;
}

.odic-feature-box:hover .single-feature-content h4 {
    color: #7BC74D;
}

.feature-button a {
    font-size: 13px;
    font-weight: 400;
    color: #7bc74d;
    letter-spacing: 2px;
    text-decoration: underline;
    padding: 0 !important;
    -webkit-transition: .5s;
    transition: .5s;
}

.feature-button a:hover {
    text-decoration: underline;
}

/* Feature style two */
.odic-feature-box {
    -webkit-box-shadow: -10px 10px 30px rgba(0, 0, 0, 0.03);
    box-shadow: -10px 10px 30px rgba(0, 0, 0, 0.03);
    background: #fff;
    padding: 50px 34px 34px 34px;
    margin-bottom: 30px;
}

.odic-feature-box.d-flex:hover {
    background: rgba(123, 199, 77, 0.37);
}

.feature-icon i {
    color: #3db818;
    font-size: 40px;
    margin-top: 12px;
    margin-right: 15px;
    display: inline-block;
}

.feature-box-title h2 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px;
}

.feature-box-title p {
    color: rgba(86, 86, 86, 0.8);
    font-weight: 400;
    margin: 0;
    width: 80%;
}

.odic-about-calender-box {
    background: var(--bs-color);
    width: 65%;
    padding: 40px 30px;
    margin-top: -201px;
    z-index: 1;
    position: relative;
    margin-left: 208px;
    overflow: hidden;
}

.odic-about-content-inner h3 {
    font-weight: 700;
    font-size: 23px;
    margin-bottom: 15px;
    color: #fff;
    margin-top: 0;
}

.odic-about-content-inner ul li {
    list-style: none;
    color: white;
    padding: 7px 0;
    border-bottom: 1px dotted #fff;
}

.odic-about-content-inner ul li span {
    padding-left: 74px;
    float: right;
    display: inline-block;
}

.odic-about-content h4 {
    color: var(--bs-color);
    font-size: 16px;
    font-weight: 600;
}

.odic-about-content h1 {
    font-size: 35px;
    font-weight: 700;
}

.odic-about-content h2 {
    font-size: 33px;
    font-weight: 700;
}

.odic-about-image img {
    /* border-radius: 22px; */
    object-fit: cover;
    max-width: 100%;
    /* margin-right: auto; */
    /* 
    overflow: hidden;*/
}

.odic-about-image {
    max-width: 420px;
    border-radius: 22px;
    overflow: hidden;
    margin: 0 auto;
}

.odic-content-inner ul li {
    list-style: none;
    margin-bottom: 15px;
    font-size: 15px;
}

.odic-content-inner ul li i {
    color: var(--bs-color);
    font-size: 22px;
    margin-right: 16px !important;
    display: inline-block;
}

.site-btn {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 400;
    border: 1px solid var(--bs-color);
    background: var(--gradient-primary);
    color: #fff;
    padding: 16px 40px;
    display: inline-block;
    font-family: var(--font-1);
    font-size: 1rem;
    font-weight: 400;
    font-style: normal;
    line-height: 25px;
    text-decoration: none;
    text-transform: capitalize;
    letter-spacing: 0px;
    transition: all 200ms;
    border-radius: 8px;
    position: relative;
    overflow: hidden
}

.site-btn span {
    z-index: 1;
    position: relative
}

.site-btn:after {
    content: '';
    position: absolute;
    width: 0px;
    height: 0px;
    background: var(--primary-dark);
    z-index: 0;
    transition: all 500ms ease;
    transform: scale(0) translate(-50%,-50%);
    border-radius: 999px;
    left: 50%;
    top: 50%;
}

.site-btn:disabled {
    opacity: 60%;
    cursor: not-allowed
}

.site-btn:not(:disabled):hover:after {
    transform: scale(1) translate(-50%,-50%);
    width: 300px;
    height: 300px;
}

.site-btn:hover {
    /* background: #363636;
    color: #fff;
    border-color: #363636; */
}

.site-btn--light {
    background: #f3f3f3;
    color: var(--bs-color);
    border-width: 2px;
}

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

.dreanit-single-feature-box {
    background: #f2f5f8;
    padding: 10px 30px 55px;
    margin-bottom: 30px;
    text-align: left;
}

.dreanit-single-feature-box:hover {
    background: var(--bs-color);
    -webkit-transition: .5s;
    transition: .5s;
}

.dreanit-single-feature-box:hover .feature-box-content h3 {
    color: #fff;
    -webkit-transition: .5s;
    transition: .5s;
}

.dreanit-single-feature-box:hover .feature-box-content h4 {
    color: #fff;
    -webkit-transition: .5s;
    transition: .5s;
}

.dreanit-single-feature-box:hover .feature-box-content h4:before {
    background: #fff;
    -webkit-transition: .5s;
    transition: .5s;
}

.feature-box-content h3 {
    color: var(--bs-color);
    font-size: 100px;
    -webkit-transition: .5s;
    transition: .5s;
    font-weight: 500;
}

.feature-box-content h4 {
    font-size: 20px;
    font-weight: 700;
    -webkit-transition: .3s;
    transition: .3s;
    position: relative;
    z-index: 1;
}

.feature-box-content h4:before {
    position: absolute;
    content: "";
    left: 0;
    width: 35px;
    height: 3px;
    background: var(--bs-color);
    bottom: -15px;
    -webkit-transition: .5s;
    transition: .5s;
}

.bold-text p {
    font-size: 18px;
    color: #565872;
    font-weight: 600;
}

.odic-setcion-title h4 {
    font-size: 15px;
    color: var(--bs-color);
    padding: 0px 0 3px 0;
    margin: 0;
}

.odic-setcion-title h1 {
    font-size: 30px;
}

.about-name {
    margin: 25px 0 0 0;
}

.counter-up-area {
    background: url(assets/images/counter.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    position: relative;
    z-index: 1;
}

.counter-up-area:before {
    position: absolute;
    content: "";
    z-index: -1;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: rgba(123, 199, 77, 0.92);
}

.odic-counter {
    border-left: 1px solid #fff;
    margin-bottom: 30px;
}

.odic-counter.bd-none {
    border: none;
}

.counter-up-text h1 {
    color: #fff;
    font-size: 60px;
    font-weight: 800;
    margin: 0 0 15px;
    text-align: center;
    font-family: 'Poppins', sans-serif;
}

.counter-up-text h4 {
    color: #fff;
    font-size: 22px;
    font-weight: 500;
    text-align: center;
}

.odic-service-box {
    padding: 0 0 10px 0;
    overflow: hidden;
    margin-bottom: 30px;
    background: #fff;
    -webkit-box-shadow: 0px 6px 40px 0px rgba(148, 146, 245, 0.2);
    box-shadow: 0px 6px 40px 0px rgba(148, 146, 245, 0.2);
}

.odic-service-box:hover .service-box-thumb img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

.odic-service-box h2:hover {
    color: var(--bs-color);
}

.odic-service-content h2 {
    font-size: 35px;
    font-weight: 700;
    margin: 24px 0 0 0;
}

.odic-service-text p {
    margin-top: 14px;
}

.service-box-thumb {
    overflow: hidden;
}

.service-box-thumb img {
    width: 100%;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: .5s;
    transition: .5s;
}

.service-content {
    background: #fff;
    padding: 7px 20px 20px;
}

.service-content h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 23px 0 15px;
    -webkit-transition: .5s;
    transition: .5s;
}

.service-content p {
    margin-bottom: 8px;
}

.service-button a {
    font-size: 14px;
    color: var(--bs-color);
    font-weight: 500;
    position: relative;
    z-index: 1;
    display: inline-block;
}

.service-button a:before {
    position: absolute;
    content: "";
    left: 0;
    height: 2px;
    width: 100%;
    background: #ddd;
    bottom: -2px;
}

.service-button a:after {
    position: absolute;
    content: "";
    left: 0;
    height: 2px;
    width: 0%;
    background: var(--bs-color);
    bottom: -2px;
    -webkit-transition: .5s;
    transition: .5s;
}

.service-button a:hover:after {
    width: 100%;
}

.button a {
    border: 2px solid var(--bs-color);
    padding: 12px 40px;
    background: var(--bs-color);
    color: white;
    text-transform: uppercase;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    -webkit-transition: .5s;
    transition: .5s;
}

.button a:hover {
    background: #fff;
    color: var(--bs-color);
}

.odic-section-title h4 {
    color: var(--bs-color);
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 19px;
}

.odic-section-title p {
    font-size: 16px;
    width: 69%;
    margin: 3px auto 30px;
}

.odic-section-title.text-center h2 {
    position: relative;
    z-index: 1;
    padding: 0 0 40px;
}

.odic-section-title.text-center h2 span {
    color: var(--bs-color);
}

.section-title-bg-bar {
    position: relative;
    z-index: 1;
}

.section-title-bg-bar:before {
    position: absolute;
    z-index: -1;
    content: "";
    height: 2px;
    width: 90px;
    background: var(--bs-color);
    top: -30px;
    margin: auto;
    left: 0;
    right: 0;
}

.section-title-bg-bar:after {
    position: absolute;
    z-index: -1;
    content: "";
    height: 2px;
    width: 58px;
    background: var(--bs-color);
    top: -24px;
    margin: auto;
    left: 0;
    right: 0;
}

.section-title-bar-inner:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    margin: auto;
    height: 2px;
    width: 42px;
    background: var(--bs-color);
    top: -18px;
}

.service-title p a span {
    color: var(--bs-color);
    text-decoration: underline;
    -webkit-transition: .5s;
    transition: .5s;
}

.service-title p a span:hover {
    color: #337ab7;
}

.process-area {
    background: url(assets/images/process.png);
    background-position: center center;
    background-repeat: no-repeat;
}

.odic-single-process {
    padding: 3px 0 0 0;
}

.odic-single-process:hover .odic-process-number {
    top: 20%;
}

.odic-single-process-thum {
    border-radius: 50%;
    border: 4px solid var(--bs-color);
    display: inline-block;
    text-align: center;
    -webkit-transition: .5s;
    transition: .5s;
    position: relative;
    margin-bottom: 25px;
}

.odic-single-process-thum img {
    border-radius: 100%;
    border: 10px solid #fff;
}

.odic-process-number {
    position: absolute;
    left: -8px;
    top: 30%;
    -webkit-transition: .56s;
    transition: .56s;
}

.odic-process-number span {
    background: var(--bs-color);
    height: 50px;
    width: 50px;
    display: block;
    text-align: center;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

.odic-process-number span:before {
    position: absolute;
    left: -5px;
    top: -5px;
    width: 60px;
    height: 60px;
    background: var(--bs-color);
    opacity: 0.4;
    content: "";
    margin: auto;
    border-radius: 100%;
    z-index: -1;
}

.odic-process-number span:after {
    position: absolute;
    left: -15px;
    top: -15px;
    width: 80px;
    height: 80px;
    background: var(--bs-color);
    opacity: 0.2;
    content: "";
    margin: auto;
    border-radius: 100%;
    z-index: -1;
}

.odic-process-content {
    text-align: center;
}

.odic-process-content h2 {
    font-size: 20px;
    font-weight: 700;
}

.odic-process-content p {
    padding: 0 18px;
}

.why-choose-us-area {
    background: url(assets/images/choose.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.odic-department-title h5 {
    font-size: 15px;
    font-weight: 700;
    color: var(--bs-color);
    margin-bottom: 15px;
    margin-top: 0;
}

.odic-department-title h2 {
    margin: 0;
}

.choose-us-button a {
    font-size: 14px;
    font-weight: 400;
    border: 2px solid var(--bs-color);
    padding: 15px 40px;
    background: var(--bs-color);
    color: #fff;
    text-transform: uppercase;
    -webkit-transition: .5s;
    transition: .5s;
}

.choose-us-button a:hover {
    background: #fff;
    color: var(--bs-color);
}

.appointment-aera {
    background: #f2f5f8;
}

.appointment-left-box {
    background: var(--bs-color);
    padding: 20px 0 20px;
}

.odic-appointment-box {
    background: #ffffffb3;
    padding: 35px 27px 27px;
    border-radius: 12px;
}

.odic-appointment-box .quote_btn button {
    width: 100%;
    background: var(--bs-color);
    border: 2px solid transparent;
    color: #ffffff;
    padding: 12px 38px;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    font-weight: 500;
    -webkit-transition: .5s;
    transition: .5s;
    margin: 30px 0 35px;
}

.odic-appointment-box .quote_btn button:hover {
    background: transparent;
    border-color: var(--bs-color);
    color: var(--bs-color);
}

.appointment-left-title h1 {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    padding: 10px 60px 0;
}

.appointment-left-title h2 {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    padding: 0px 60px 24px;
}

.from-box input {
    width: 100%;
    height: 55px;
    background: #F2F5F8;
    border: 0;
    padding-left: 20px;
    margin-bottom: 30px;
}

.from-box textarea {
    width: 100%;
    height: 180px;
    background: #F2F5F8;
    border: 0;
    padding-left: 20px;
}

.from-box select {
    width: 100%;
    height: 55px;
    background: #F2F5F8;
    border: 0;
    padding-left: 20px;
    margin-bottom: 30px;
}

.section-title h1 {
    font-size: 16px;
    color: var(--bs-color);
    font-weight: 500;
    margin: 30px 0 10px;
}

.section-title h2 {
    font-size: 35px;
    font-weight: 700;
    padding: 0;
    margin: 0;
    font-size: 35px;
    font-weight: 700;
}

.section-title h5 {
    color: var(--bs-color);
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 15px;
}

.nav-pills .nav-link.active {
    background-color: #f2f5f8 !important;
}

.nav-pills .show>.nav-link {
    background-color: #f2f5f8 !important;
    background-color: var(--bs-color) !important;
}

.odic-department-tab ul li {
    width: 20%;
}

.odic-department-tab ul li a span {
    color: var(--bs-color);
    font-size: 19px;
}

.odic-department-tab li.nav-item a {
    background: transparent;
    border: 1px solid var(--bs-color);
    padding: 28px 30px 27px;
    margin: 0 20px 11px;
    border-radius: 0;
}

.odic-department-tab li.nav-item a img {
    display: block;
    margin-bottom: 15px;
}

.odic-department-tab-box {
    border: 5px solid var(--bs-color) 36;
    padding: 40px;
}

.odic-department-thumb img {
    width: 100%;
}

.odic-department-bottom-content-inner ul li {
    width: 100%;
    list-style: none;
    padding: 0 0 3px;
    width: 100% !important;
}

.odic-department-bottom-content-inner ul li i {
    float: left;
    margin-right: 20px;
    color: var(--bs-color);
    margin-top: 6px;
}

.contact-form-box {
    -webkit-box-shadow: 0 10px 55px 5px rgba(137, 173, 255, 0.2);
    box-shadow: 0 10px 55px 5px rgba(137, 173, 255, 0.2);
    background: #fff;
    padding: 40px 48px 40px;
    position: relative;
    margin-top: -150px;
    z-index: 1;
    border-radius: 7px;
}

.form-box input {
    width: 100%;
    height: 55px;
    margin-bottom: 20px;
    padding-left: 15px;
    border: 0;
    background: #F2F5F8;
    border-radius: 3px;
}

.form-box textarea {
    width: 100%;
    height: 130px;
    padding: 10px 0 0 10px;
    border: 0;
    background: #F2F5F8;
    border-radius: 5px;
}

.form_box input {
    width: 100%;
    height: 55px;
    padding-left: 15px;
    border: 0;
    background: #F2F5F8;
    border-radius: 3px;
}

.form_box textarea {
    width: 100%;
    height: 130px;
    padding: 10px 0 0 10px;
    border: 0;
    background: #F2F5F8;
    border-radius: 5px;
}

.contact-form-button button {
    background: var(--bs-color);
    color: #fff;
    padding: 14px 89px;
    border-radius: 3px;
    border: 0;
    margin: 20px 0 10px;
}

.quote_btn button {
    background: var(--bs-color);
    color: #fff;
    padding: 14px 89px;
    border-radius: 3px;
    border: 0;
    margin: 20px 0 10px;
}

.contact-form-title.text-center h2 {
    font-size: 30px;
    font-weight: 600;
    padding: 0px 0 38px;
    margin-top: 4px;
}

.testimonial-area {
    position: relative;
    z-index: 1;
}

.testimonial-area:before {
    position: absolute;
    content: none;
    z-index: -1;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: rgba(10, 24, 40, 0.81);
}

.testmionial-thumb img {
    height: 100px;
    width: 100px;
    margin: auto;
    border: 5px solid #fff;
    border-radius: 100%;
}

.testimonial-content-text {
    position: relative;
}

.testimonial-content-text p {
    width: 80%;
    margin: auto;
    padding: 30px 0 0 0;
    font-style: italic;
    color: #787878;
}

.testimonial-icon {
    margin: 30px 0 0px;
}

.testimonial-icon i {
    font-size: 35px;
    color: var(--bs-color);
}

.testimonial-content-title h2 {
    color: #787878;
    font-size: 17px;
    font-weight: 600;
    margin: 15px 0 0 0;
}

.testimonial-content-title span {
    color: var(--bs-color);
    font-size: 14px;
    font-weight: 500;
    padding-top: 7px;
}

.testimonial-area.five {
    background: url(assets/images/counter.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    position: relative;
    z-index: 1;
}

.testimonial-area.five:before {
    position: absolute;
    content: "";
    z-index: -1;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: rgba(10, 24, 40, 0.81);
}

.portfolio_nav {
    text-align: center;
}

.portfolio_menu ul li {
    display: inline-block;
    list-style: none;
    background: #fff;
    font-size: 14px;
    text-transform: uppercase;
    padding: 7px 20px;
    margin: 0 3px;
    border: 1px solid #eee;
    cursor: pointer;
    -webkit-transition: .5s;
    transition: .5s;
    border-radius: 3px;
}

.portfolio_menu ul li:hover {
    background: var(--bs-color);
    color: #fff;
}

.portfolio_menu ul li.current_menu_item {
    background: var(--bs-color);
    color: #fff;
    border-color: var(--bs-color);
}

.single_portfolio {
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

.single_portfolio:hover .single_portfolio_thumb img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.single_portfolio:hover .single_portfolio_thumb:before {
    opacity: 1;
}

.single_portfolio:hover .single_portfolio_icon {
    opacity: 1;
    top: 50%;
}

.single_portfolio_thumb {
    position: relative;
}

.single_portfolio_thumb img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .5s;
    transition: .5s;
    width: 100%;
}

.single_portfolio_thumb:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    right: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.7);
    -webkit-transition: .5s;
    transition: .5s;
    opacity: 0;
    z-index: 1;
}

.single_portfolio_icon {
    position: absolute;
    left: 50%;
    top: 40%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    opacity: 0;
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 1;
}

.single_portfolio_icon a {
    height: 60px;
    width: 60px;
    line-height: 60px;
    background: var(--bs-color);
    display: inline-block;
    text-align: center;
    color: #fff;
    border-radius: 100%;
    font-size: 22px;
}

.odic-single-team {
    margin-bottom: 30px;
}

.odic-single-team:hover .single-team-icon {
    opacity: 1;
    top: 50%;
}

.odic-single-team:hover .team-single-thumb:before {
    opacity: 1;
}

.team-single-thumb {
    position: relative;
}

.team-single-thumb:before {
    position: absolute;
    content: "";
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(123, 199, 77, 0.9);
    border-radius: 100%;
    right: 0;
    margin: auto;
    z-index: 2;
    -webkit-transition: .5s;
    transition: .5s;
    opacity: 0;
}

.team-single-thumb img {
    width: 100%;
    border-radius: 100%;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.single-team-icon {
    position: absolute;
    left: 0;
    top: 60%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2;
    right: 0;
    margin: auto;
    opacity: 0;
    -webkit-transition-delay: .7s;
    transition-delay: .7s;
}

.single-team-icon a {
    color: var(--bs-color);
    background: #fff;
    border-radius: 52%;
    display: inline-block;
    font-size: 14px;
    height: 35px;
    width: 35px;
    line-height: 35px;
    margin: 0 3px;
    -webkit-transition: .5s;
    transition: .5s;
}

.single-team-icon a:hover {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
}

.team-button a {
    font-size: 13px;
    font-weight: 500;
    margin: 0px 0;
    text-transform: uppercase;
    color: var(--bs-color);
    display: inline-block;
}

.team-button a span {
    margin-left: 4px;
}

.odic-team-title h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 35px 0 5px;
    -webkit-transition: .5s;
    transition: .5s;
}

.odic-team-title h2:hover {
    color: var(--bs-color);
}

.odic-team-title span {
    font-size: 14px;
    font-weight: 500;
    color: var(--bs-color);
    letter-spacing: 1px;
}

.odic-team-title p {
    margin-top: 15px;
}

.call-do-action-area {
    background: url(../images/bg-call.jpg);
    background-size: cover;
    background-position: center center;
    background-position: 0 59%;
    background-repeat: no-repeat;
    padding: 65px 0 35px;
    position: relative;
    z-index: 1;
}

.call-do-action-area:before {
    position: absolute;
    content: "";
    z-index: -1;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: #fdf7ea;
}

.call-do-action-area .odic-contact-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: 15px;
    align-items: center;
}

.call-do-action-area .odic-contact-content .content-title {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.odic-content i {
    font-size: 50px;
    color: var(--bs-color);
}

.call-do-action-number h1 {
    color: #ffffff;
    font-size: 40px;
    font-weight: 300;
    padding: 25px 0 20px;
    font-family: 'Heebo', sans-serif;
}

.call-do-action-title h1 {
    color: #ffffff;
    font-size: 50px;
    font-weight: 700;
    font-family: 'Heebo', sans-serif;
}

.odic-blog-box {
    margin-bottom: 30px;
}

.odic-blog-box:hover .odic-blog-thumb:before {
    opacity: 1;
}

.odic-blog-box:hover .odic-blog-icon {
    opacity: 1;
    top: 25%;
}

.odic-blog-content h2 {
    font-size: 35px;
    font-weight: 700;
    margin-top: 24px;
}

.odic-blog-text p {
    padding: 10px 0 0 60px;
    overflow: hidden;
    margin: 0 0;
    width: 105%;
}

.odic-blog-thumb {
    position: relative;
}

.odic-blog-thumb:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: rgba(10, 24, 40, 0.8);
    -webkit-transition: .5s;
    transition: .5s;
    opacity: 0;
}

.odic-blog-thumb img {
    width: 100%;
}

.odic-blog-icon {
    position: absolute;
    top: 15%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    left: 50%;
    opacity: 0;
    -webkit-transition: .5s;
    transition: .5s;
}

.odic-blog-icon a {
    font-size: 25px;
    height: 55px;
    width: 55px;
    line-height: 55px;
    background: #fff;
    display: block;
    text-align: center;
    border-radius: 100%;
    color: var(--bs-color);
    -webkit-transition: .5s;
    transition: .5s;
}

.odic-blog-icon a:hover {
    background: var(--bs-color);
    color: #fff;
}

.odic-blog-title {
    background: #F2F5F8;
    padding: 23px 25px 32px;
}

.odic-blog-title h2 a {
    font-size: 19px;
    margin: 0px 0px 20px;
    -webkit-transition: .3s;
    transition: .3s;
    font-weight: 600;
    display: inline-block;
    line-height: 27px;
}

.odic-blog-title h2 a:hover {
    color: var(--bs-color);
}

.blog-meta-box span {
    font-size: 12px;
    color: #565872;
    text-transform: uppercase;
    letter-spacing: 1px;
    display: inline-block;
    font-weight: 500;
    -webkit-transition: .3s;
    transition: .3s;
}

.blog-meta-box span:hover {
    color: var(--bs-color);
}

.blog-meta-box span a {
    color: #565872;
    font-size: 12px;
    font-weight: 500;
}

.blog-meta-box a {
    color: #565872;
    margin-left: 8px;
}

.blog-meta-box a:hover {
    color: var(--bs-color);
}

.blog-button {
    padding: 12px 0 0 0;
}

.blog-button a {
    display: inline-block;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 500;
    text-align: center;
    color: #fff;
    padding: 15px 30px;
    background: var(--bs-color);
    border: 2px solid var(--bs-color);
}

.blog-button a:hover {
    color: var(--bs-color);
    background: #fff;
}

.category-tag a {
    color: var(--bs-color);
    padding: 0 5px 0 0;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    -webkit-transition: .3s;
    transition: .3s;
}

.category-tag a:hover {
    color: #151948;
}

.row.border-line {
    border-top: 1px solid #dddddd;
    padding: 60px 0 60px 0;
}

.contact-address-area {
    background: var(--bs-color);
    padding: 42px 0;
}

.content-icon i {
    font-size: 30px;
    color: #c3af87;
    border: 1px solid #a07f58;
    height: 60px;
    width: 60px;
    line-height: 58px;
    display: inline-block;
    text-align: center;
}

.content-title span {
    font-size: 17px;
    color: #412a12;
    font-weight: 600;
    margin: 4px 20px 4px;
    font-family: "Merriweather", Sans-serif !important;
    display: block;
}

.content-title .h5, .content-title h5 {
    color: #000;
    font-size: 17px;
    margin-left: 20px;
    font-weight: 400;
    line-height: 30px;
    font-family: var(--font-2);
}

.content-title .h5 a, .content-title h5 a {
    display: block;
    line-height: 30px;
}

footer {
    background: #050810;
}

.footer-area {
    padding: 85px 0px 25px;
}

.footer-logo {
    padding-bottom: 14px;
    max-width: 300px;
}

.content-text p {
    font-size: 16px;
    color: #a0a1a2;
    margin: 5px 0 20px;
}

.content-title-text p {
    color: #a0a1a2;
    font-size: 15px;
    margin: 10px;
}

.odic-footer-content h2 {
    color: #e2e2e2;
    font-size: 1.2rem;
    margin: 16px 0 35px;
    font-weight: 700;
    font-family: var(--font-2);
    /* letter-spacing: 0.12rem; */
}

.odic-footer-content h2 span {
    position: relative;
    padding-bottom: 14px;
}

.odic-footer-content h2 span:before {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60px;
    height: 2px;
    margin-right: 6px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-color: #d4af37;
    content: '';
}

.footer-menu ul {
    list-style: none;
}

.footer-menu ul li {
    margin-bottom: 10px;
}

.footer-menu ul li a {
    display: inline-block;
    padding: 0px 0px 8px;
    color: #b8bcc8;
    font-size: 16px;
    -webkit-transition: .3s;
    transition: .3s;
}

.footer-menu ul li a:hover {
    color: #d4af37;
}

.footer-content p {
    color: #a0a1a2;
    font-size: 15px;
}

.subscribe-box input {
    width: 100%;
    border: 1px solid #a0a1a2;
    height: 51px;
    background: transparent;
    font-size: 14px;
    margin: 10px 0 32px;
    padding-left: 15px;
}

.footer-button button {
    font-size: 15px;
    padding: 9px 20px;
    background: var(--bs-color);
    color: #fff;
    -webkit-transition: .3s;
    transition: .3s;
    text-transform: capitalize;
    font-weight: 500;
    display: inline-block;
    border: 1px solid var(--bs-color);
}

.footer-button button:hover {
    color: var(--bs-color);
    background: transparent;
}

.footer-buttom-area {
    padding: 7px 0;
    /* background: #231711; */
}

.copy-right-text p {
    color: #b8bcc8;
    margin-top: 10px;
}

.text-copy {
    color: #f7ffab;
}

.footer-text-menu {
    text-align: right;
}

.footer-text-menu ul {
    list-style: none;
    display: inline-block;
}

.footer-text-menu ul li {
    display: inline;
}

.footer-text-menu ul li a {
    display: inline-block;
    color: #a0a1a2;
    margin-left: 10px;
    -webkit-transition: .3s;
    transition: .3s;
}

.footer-text-menu ul li a:hover {
    color: var(--bs-color);
}

.breatcumb-area {
    position: relative;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #ffffff 100%);
    padding: 90px 0 50px;
}

.breatcumb-area::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(1, 59, 113, 0.1) 0%, rgba(74, 144, 226, 0.08) 50%, rgba(1, 59, 113, 0.1) 100%);
    background-size: 400% 400%;
    animation: gradientShift 15s ease infinite;
}

.breatcumb-areagreen::before {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 800"><defs><linearGradient id="g1" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" style="stop-color:%2315803d;stop-opacity:0.8"/><stop offset="100%" style="stop-color:%234ade80;stop-opacity:0.6"/></linearGradient></defs><rect width="1200" height="800" fill="url(%23g1)"/><circle cx="600" cy="400" r="150" fill="white" opacity="0.1"/><path d="M600 200 L650 350 L800 400 L650 450 L600 600 L550 450 L400 400 L550 350 Z" fill="white" opacity="0.05"/></svg>');
    background-size: cover;
    background-position: center;
}

.breatcumb-content {
    margin: 0 0 2px;
    position: relative;
}

.breatcumb-title :is(h1, h2) {
    font-size: clamp(2rem, 6vw, 4rem);
    font-weight: 700;
    margin-bottom: 1rem;
    color: #1a1a1a;
    font-family: var(--font-3);
}

.light .breatcumb-title :is(h1, h2) {
    color: #fff;
}

.breatcumb-title span {
    color: var(--primary-color)
}

.breatcumb-content-text p {
    font-size: clamp(1.05rem, 2.5vw, 1.35rem);
    color: #4a5568;
    font-weight: 400;
    width: min(98%, 800px);
    margin: 0 auto;
}

.light .breatcumb-content-text p {
    color: #ffffffd9;
}

.breatcumb-content-text ul li {
    list-style: none;
    display: inline-block;
}

.breatcumb-content-text ul li a {
    font-size: 17px;
    color: #fff;
    font-weight: 400;
}

.breatcumb-content-text i {
    font-size: 15px;
    color: #fff;
    margin: 0 6px;
    display: inline-block;
}

.breatcumb-content-text span {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    display: inline-block;
    margin: 0 4px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.75rem;
    background: rgba(1, 59, 113, 0.1);
    border: 1px solid rgba(1, 59, 113, 0.3);
    border-radius: 999px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #013b71;
    margin-bottom: 2rem;
    backdrop-filter: blur(16px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.05);
}

.badge-icon {
    font-size: 1rem;
    animation: pulse 2s infinite;
}

.skill-area {
    background: #f3f6f9;
}

.progress-bar {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    overflow: hidden;
    color: #FFE;
    text-align: center;
    white-space: nowrap;
    background-color: var(--bs-color);
    -webkit-transition: width .6s ease;
    transition: width .6s ease;
}

.row.navigation-top {
    background: #fff;
    -webkit-box-shadow: 0 3px 3px 0 rgba(17, 12, 79, 0.1);
    box-shadow: 0 3px 3px 0 rgba(17, 12, 79, 0.1);
    position: relative;
    margin-top: -100px;
    z-index: 1;
}

.mission-thumb img {
    width: 100%;
}

.mission-title h1 {
    font-size: 27px;
}

.mission-title p {
    padding: 20px 0 6px;
    width: 100%;
    font-size: 14px;
    font-family: 'Heebo', sans-serif;
}

.mission-vision-thumb img {
    width: 100%;
}

.mission-vision-content h2 {
    font-size: 20px;
    color: #444;
    font-weight: 700;
    margin: 0 0 10px;
}

.mission-vision-content p {
    font-size: 14px;
    margin-bottom: 6px;
}

.mission-vision-button a {
    text-transform: uppercase;
    font-size: 12px;
    display: inline-block;
    color: var(--bs-color);
}

.six.call-do-action-area:before {
    display: none;
}

.six .call-do-action-title h3 {
    font-size: 35px;
    font-weight: 700;
}

.six .call-do-action-number i {
    font-size: 30px !important;
}

.six .call-do-action-number span {
    font-size: 35px;
}

.six .call-button a {
    background: var(--bs-color);
    font-size: 14px;
    color: #fff;
    padding: 14px 40px;
    border: 2px solid var(--bs-color);
    font-weight: 400;
    text-transform: uppercase;
    -webkit-transition: .5s;
    transition: .5s;
}

.six .call-button a:hover {
    background: #fff;
    border-color: var(--bs-color);
    color: var(--bs-color);
}

.team-details-thumb img {
    width: 100%;
}

.team-details-title h1 {
    font-size: 20px;
    font-weight: 700;
    padding: 15px 0 7px;
}

.team-details-title p {
    color: var(--bs-color);
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
}

.team-details-icon a {
    background: var(--bs-color);
    border-radius: 3px;
    height: 35px;
    width: 35px;
    line-height: 35px;
    display: inline-block;
    color: #fff;
    margin: 3px;
}

.team-details-icon a i {
    font-size: 15px;
}

.team-details-icon2 i {
    font-size: 30px;
    color: var(--bs-color);
}

.doctor-number {
    border-bottom: 1px solid #ddd;
    padding-bottom: 22px;
}

.doctor-number h3 {
    font-size: 18px;
    font-family: 'Heebo', sans-serif;
    font-weight: 500;
    color: rgba(86, 86, 86, 0.8);
    margin-bottom: 0;
}

.team-details-button a {
    display: inline-block;
    border: 2px solid var(--bs-color);
    font-weight: 500;
    text-transform: uppercase;
    background: var(--bs-color);
    color: #fff;
    padding: 12px 40px;
    margin-top: 40px;
    -webkit-transition: .5s;
    transition: .5s;
}

.team-details-button a:hover {
    background: #fff;
    color: var(--bs-color);
}

.odic-team-details {
    padding: 25px 25px;
    -webkit-box-shadow: 0 10px 30px 0 rgba(17, 12, 79, 0.1);
    box-shadow: 0 10px 30px 0 rgba(17, 12, 79, 0.1);
}

.team-details-text h1 {
    font-size: 35px;
    font-weight: 700;
    margin: 0 0 15px;
}

.bold-color {
    color: #555555;
    font-size: 19px;
    font-weight: 400;
    padding-bottom: 25px;
}

.mkdf-ds-bio-info-title {
    color: #2f3241;
    font-size: 17px;
    font-weight: 600;
    margin-right: 150px;
}

.seven.call-do-action-area:before {
    display: none;
}

.seven .call-do-action-title h3 {
    font-size: 35px;
    font-weight: 700;
}

.seven .call-do-action-number i {
    font-size: 30px !important;
}

.seven .call-do-action-number span {
    font-size: 35px;
}

.seven .call-button a {
    background: var(--bs-color);
    font-size: 14px;
    color: #fff;
    padding: 14px 40px;
    border: 2px solid var(--bs-color);
    font-weight: 400;
    text-transform: uppercase;
    -webkit-transition: .5s;
    transition: .5s;
}

.seven .call-button a:hover {
    background: #fff;
    border-color: var(--bs-color);
    color: var(--bs-color);
}

.our-section-title h1 {
    font-size: 30px;
    font-weight: 700;
}

.our-section-title p {
    padding: 30px 0 32px;
}

.clinic-button a {
    font-weight: 500;
    border: 2px solid var(--bs-color);
    padding: 13px 40px;
    background: var(--bs-color);
    -webkit-transition: .3s;
    transition: .3s;
    text-transform: uppercase;
    color: #fff;
}

.clinic-button a:hover {
    background: #fff;
    color: var(--bs-color);
}

.odic-service-details-menu ul li {
    display: block;
    list-style: none;
}

.odic-service-details-menu ul li a {
    display: block;
    padding: 14px 15px 14px 18px;
    background-color: #F3F6F9;
    font-size: 15px;
    font-weight: 500;
    margin: 0 0 2px;
    color: #172541;
    -webkit-transition: .3s;
    transition: .3s;
    position: relative;
}

.odic-service-details-menu ul li a:before {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    width: 5px;
    height: 100%;
    background: var(--bs-color);
    opacity: 0;
    z-index: 0;
    -webkit-transition: .3s;
    transition: .3s;
}

.odic-service-details-menu ul li a:hover:before {
    color: var(--bs-color);
    opacity: 1;
}

.sevice-opening-hour-box {
    background: url(assets/images/blog2.jpg);
    position: relative;
    z-index: 1;
}

.sevice-opening-hour-box:before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
    background: rgba(123, 199, 77, 0.82);
}

.service-opening-hour {
    padding: 28px 40px 35px;
}

.service-opening-hour h2 {
    font-size: 25px;
    font-weight: 700;
    margin: 12px 0 40px;
    text-align: center;
    color: #fff;
}

.service-opening-hour ul li {
    list-style: none;
    display: block;
    color: #fff;
    padding-bottom: 10px;
    font-size: 16px;
    border-bottom: 1px dotted #fff;
    margin-bottom: 12px;
}

.service-opening-hour span {
    text-align: right;
    float: right;
    display: inline-block;
}

.service-details-thumb img {
    width: 100%;
    margin-bottom: 30px;
}

.service-details-content h1 {
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 25px;
}

.service-details-inner-thumb img {
    width: 100%;
}

.sservice-title h1 {
    font-size: 17px;
    font-weight: 700;
    font-family: "Merriweather", sans-serif;
    text-align: center;
}

.service-details-content-two h1 {
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 25px;
    border-top: 1px solid #dddddd;
    padding-top: 47px;
    margin-top: 16px;
}

.blogquote {
    background: #F6F7FF;
    padding: 50px 50px 50px 108px;
    border-left: 6px solid var(--bs-color);
    margin: 32px 0 32px;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.3;
    font-style: normal;
}

.blog-icon {
    float: left;
    margin: 4px 0 10px 0;
}

.blog-icon i {
    font-size: 41px;
    font-weight: 700;
    color: var(--bs-color);
    margin-left: -68px;
}

.blogquote-text {
    overflow: hidden;
}

.blogquote-text span {
    font-size: 14px;
    font-weight: 500;
    color: var(--bs-color);
    display: block;
    margin-top: 20px;
}

.blogquote-text p {
    font-weight: 500;
}

.inner-content {
    padding-top: 38px;
}

.inner-content-text h4 {
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 15px;
}

.author {
    background: #F6F7FF;
    padding: 40px 60px;
    margin: 98px 0 50px;
    background: #F6F7FF;
    padding: 40px 55px 27px;
    margin: 98px 0 50px;
}

.author-images img {
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    margin: auto;
    padding: 9px;
    border-radius: 100%;
    background: #fff;
    margin-top: -100px;
}

.authir-text h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 32px 0 7px;
    display: block;
}

.author-icon i {
    color: #9498b6;
    margin: 0 5px 0px;
}

.author-title p {
    padding: 22px 0 0 0;
}

.comment-title h3 {
    font-size: 26px;
    font-weight: 700;
    color: #140a20;
    margin: 0px 16px 28px;
}

.contact-inner-title h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 20px 0 10px;
}

.contact-inner-title p {
    color: rgba(86, 86, 86, 0.8);
}

.contact-content-box {
    padding: 34px 20px 34px;
    background: #fff;
    -webkit-box-shadow: 0 5px 30px rgba(222, 222, 222, 0.4);
    box-shadow: 0 5px 30px rgba(222, 222, 222, 0.4);
    border-bottom: 4px solid var(--bs-color);
    margin-bottom: 30px;
}

.section-area li {
    position: relative;
    padding: 12px 2px 0 22px;
    font-size: 17px;
    font-weight: 500;
    color: #000000;
    opacity: 80%;
}

.sec-list-new li {
    padding: 9px 2px 0 15px;
}

.sec-list-new li span {
    font-weight: bold;
    color: #000;
}

.section-area li::before {
    content: "\f18c";
    font-family: 'Font Awesome 5 Brands';
    left: -14px;
    position: absolute;
    background: linear-gradient(80deg, #026838, #7bc750);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 22px;
    top: 8px;
}

.serv-section {
    /* background: -webkit-gradient(linear, left top, left bottom, from(#fdf95130), to(#7bc75042));
      background: linear-gradient(to bottom, #fdf95130, #7bc75042); */
    position: relative;
}

.serv-section__bg {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    z-index: -1;
    opacity: 13%;
    pointer-events: none;
}

.serv-section__bg img {
    width: 80%;
    /* filter: hue-rotate(55deg); */
    max-width: 500px;
    margin-top: 5%;
}

.serv-section__bg2 {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    z-index: -1;
    opacity: 9%;
    pointer-events: none;
}

.serv-section__bg2 img {
    width: 80%;
    /* filter: hue-rotate(55deg); */
    max-width: 260px;
    margin-top: 5%;
}

.section-inner-title {
    font-size: 1.3rem;
}

.main-logo img {
    /* image-rendering: optimizeSpeed;
                                        image-rendering: -moz-crisp-edges;
                                        image-rendering: -o-crisp-edges;
                                        image-rendering: -webkit-optimize-contrast;
                                        image-rendering: crisp-edges;
                                        -ms-interpolation-mode: bicubic; */
}

body.active-nav .mobile-sidebar {
    left: 0px;
}

.mobile-sidebar {
    position: fixed;
    top: 0;
    z-index: 10001;
    background: #fff;
    left: -100%;
    transition: .5s;
    width: 280px;
    height: 100%;
    padding-right: 31px;
    padding: 10px 10px;
}

.mobile-sidebar ul {
    margin: 0px 0 10px;
}

.mobile-sidebar ul li a {
    padding: 13px 0 6px 20px;
    display: block;
    color: #4f4f4f;
}

.mobile-sidebar a.active {
    color: var(--bs-color);
}

@media only screen and (max-width: 768px) {
    .odic-feature-box {
        padding: 16px 16px 13px 16px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 576px) {
    .header-area {
        padding: 6px 0;
    }

    .odic-slider-content h2 {
        font-size: 16px;
    }

    .slider-button a {
        font-size: 17px;
        /* padding: 8px 28px; */
    }
}

@media only screen and (max-width: 992px) {
    .odic-header-left ul li {
        margin-bottom: 8px;
    }
}

@media only screen and (min-width: 1300px) {
    .container {
        max-width: min(85%, 1290px);
    }
}

@media only screen and (min-width: 1400px) {
    .container {
        max-width: 1250px;
    }

    .slider-area {
        aspect-ratio: 2.8/1;
    }
}

.about-home h2 {
    font-weight: 300;
    font-family: Roboto Slab;
    color: #555;
    line-height: 50px;
}

.about-home .lead-text+p {
    font-size: 1.011rem;
    letter-spacing: 0.01rem;
}

.sec-title {
    margin-bottom: 45px;
}

.sec-title__label {
    text-transform: uppercase;
    /* opacity: 0.55; */
    letter-spacing: 0.55px;
    line-height: 1.2;
    font-weight: 700;
    font-size: 15px;
    color: var(--bs-color);
    padding: 0px 0 3px 0;
    margin-bottom: 24px;
    font-family: var(--font-1);
    letter-spacing: 3.2px;
}

.sec-title .sec-title__label .label {
    display: inline-block;
    padding: 9px 20px;
    border-radius: 25px;
    letter-spacing: 2.98px;
    line-height: 1.5;
    background-color: var(--bs-green);
    color: #fff;
}

.sec-title .sec-title__label {
    color: #d3d5d3;
    font-size: 14px;
}

.sec-title--light .sec-title__label .label {
    background-color: var(--bs-green);
}

.sec-title__text {
    font-family: var(--font-1);
    color: #555;
    line-height: 1.6;
    font-weight: 500;
    font-size: 2.2rem;
    letter-spacing: 1px;
}

.sec-title p {
    font-size: 1.25rem;
    font-weight: 490;
    margin-top: 8px;
    color: #242424;
    line-height: 35px;
    opacity: 88%;
    font-weight: 400;
}

.sec-title--light .sec-title__text {
    color: #fff;
}

.about-two {
    position: absolute;
    width: 320px;
    bottom: -80px;
    right: 0;
    animation: moveX 2000ms linear infinite alternate;
}

.about-two img {
    width: 100%;
    border-radius: 12px;
    object-fit: cover;
}

@keyframes moveX {
    100% {
        transform: translateX(10px)
    }
}

@keyframes moveY {
    100% {
        transform: translateY(10px)
    }
}

/*  */
.section-service {
    padding: 60px 0px 40px;
    background: linear-gradient(to bottom, #fff, #daede4d1 50%, #fff 130%);
}

.service--second {
    /* background-color: #ffffff; */
}

.service-card {
    flex-direction: column;
    padding-bottom: 1px;
    display: block;
    border-radius: 10px;
    overflow: hidden;
}

.service-card__img {
    margin-bottom: 0px;
    position: relative;
    border-radius: 17px;
    overflow: hidden;
}

.service-card__img:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #1d6e2175;
    top: 0px;
    left: 0px;
    opacity: 0;
    transition: all 200ms linear
}

.service-card:hover .service-card__img:after {
    opacity: 1;
}

.service-card__img img {
    width: 100%;
    aspect-ratio: 0.5/0.4;
    object-fit: cover;
}

.service-card__body {
    background-color: #fff;
    padding: 16px 12px;
}

.service-card__body h2 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 10px;
    margin-top: 0;
    color: var(--primary-color);
}

.serviceone-card {
    background: #ffffff00;
    padding: 10px 11px;
    border-radius: 20px;
    border: 1px solid #d2d2d2;
}

/*  */
.footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 10px;
    margin-top: 20px;
}

.footer-social li a {
    color: rgb(255 255 255 / 83%);
    width: 45px;
    height: 45px;
    background-color: hsl(0deg 0% 28.79%);
    display: inline-block;
    line-height: 47px;
    text-align: center;
    transition: .5s;
    border-radius: 50%;
    font-size: 17px
}

.footer-social li a:hover {
    background: var(--primary-dark);
    color: #fff
}

/*  */
.section-review {
    padding: 80px 0px 80px;
}

/*  */
.footer-contentinfo {
    padding: 0px 0px 12px;
    color: #cfcfcf;
    font-size: 16px;
    line-height: 35px;
}

.sec-innercontent p {
    font-size: 17.7px;
    margin-top: 18px;
    font-family: var(--font-2);
    color: #515151;
}

.service-innercontent p {
    color: #c6c6c6d6;
    font-family: var(--font-1);
    font-size: 16px;
    line-height: 30px;
}

.sec-innercontent h2 {
    color: #ffffffe6;
    font-size: 18px;
    font-weight: 500;
    font-family: var(--font-1);
}

.sec-innercontent--light h3 {
}

/*  */
.title-s2 {
    font-weight: 200;
    font-family: var(--font-1);
    font-size: 46px;
}

.ul-list {
    color: #333333d6;
    font-family: var(--font-1);
    font-size: 16px;
    line-height: 30px;
    margin-top: 0.5rem;
}

.ul-list--light {
    color: #bcbcbcd6;
}

.ul-service {
    color: #333333d6;
}

.ul-service--light {
    color: #bcbcbcd6;
}

.ul-service li {
    position: relative;
    padding-left: 20px;
}

.ul-service li:before {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    background-color: var(--primary-color);
    left: 0px;
    border-radius: 50%;
    top: 8px;
}

.serv-section ul {
    padding-left: 16px;
    margin-bottom: 13px;
}

.serv-section h3 {
    font-size: 18px;
    color: #362424e0;
    font-weight: 500;
    margin-bottom: 10px;
}

.serv-section p {
    font-family: var(--font-1);
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 0.013rem;
    font-weight: 400;
}

body.active-nav {
    overflow: hidden;
}

.mobile-overlay {
    position: absolute;
    top: 0;
    z-index: 1000;
    background: #151515db;
    right: -100%;
    transition: .5s;
    width: 100%;
    height: 100%;
}

body.active-nav .mobile-overlay {
    right: 0%;
}

.mobile-sidebar__logo {
    margin-top: 4px;
    max-width: 200px;
    margin-bottom: 40px;
}

.mobile-menu__close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 35px;
    height: 35px;
    background: #d7d7d7;
    color: #4c4c4c;
    text-align: center;
    line-height: 37px
}

/*  */
.section-padding {
    background-color: #ffffff;
    padding: 80px 0px;
}

.contact-item {
    flex: 1;
    background-color: #e6ebf48a;
    padding: 22px 20px 24px;
    border-radius: 15px;
    display: flex;
    gap: 1rem 1rem;
}

.contact-item__icon {
}

.contact-item__contact {
    margin-top: 0px;
    font-size: 16px;
    margin-left: 0px;
}

.contact-item__contact .phone {
    margin: 8px 0 5px
}

.contact-item__contact p {
    margin: 0
}

.contact-item__contact a {
    font-weight: 500;
}

.contact-item__contact h2 {
    font-size: 1.2rem;
    margin-bottom: 5px;
    color: var(--primary-dark);
}

.contact-item {
    flex: 1;
}

.contact-item__icon svg {
    color: #5e8dc4;
    width: 29px;
}

.section--gallery {
    padding: 100px 0px;
    background-color: #fff8f8;
}

.album-wrap {
    background-color: #eee;
    display: block;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    border: 3px solid #ffffff;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
}

.album-wrap__img {
}

.album-wrap__img img {
    width: 100%;
}

.album-wrap__text {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #ffffff;
    padding: 9px 0;
    text-align: center;
    font-size: 20px;
    font-weight: 400;
}

.album-wrap:hover .album-wrap__text {
    color: var(--primary-dark);
}

.gallery-wrap {
    padding-bottom: 53.833%;
    padding-bottom: 63.833%;
    background-color: #eee;
    background-size: cover;
    background-image: var(--img-url);
    position: relative;
    background-position: center center;
}

.gallery-wrap__link {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 1;
    border: 5px solid #fff;
}

.gallery-wrap__icon {
    opacity: 0;
}

.gallery-wrap:hover .gallery-wrap__link {
    background-color: var(--primary-color);
    opacity: 0.5;
    z-index: 1;
}

.gallery-wrap:hover .gallery-wrap__icon {
    opacity: 1;
    z-index: 11;
    color: white;
    font-size: 28px;
}

@media only screen and (max-width: 768px) {
    .sec-title__text {
        font-size: 2rem;
    }

    .about-two {
        width: 220px;
        bottom: -120px;
        animation: moveY 2000ms linear infinite alternate;
    }

    .slider-title__sub, .odic-slider-content h3 {
    }

    .odic-slider-content h1, .odic-slider-content h2 {
        letter-spacing: 1px;
        margin: 0 0 19px;
        font-size: 27px;
    }

    .slider_list .owl-nav {
        display: none
    }

    .sec-title {
        margin-bottom: 10px;
    }

    .sec-title__label {
        margin-bottom: 14px;
        font-size: 14px;
    }

    .sec-title__text span {
        display: block;
    }

    .section-about-home .content-about-home p {
        word-spacing: -2.4px;
    }
}

.wp_wave {
    position: fixed;
    bottom: 25px;
    text-align: center;
    width: 60px;
    height: 60px;
    right: 25px;
    border-radius: 50%;
    z-index: 999;
    background: #34d13b;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    box-shadow: 0px 4px 9px 3px rgb(0 0 0 / 17%);
}

.wp_icon {
    font-size: 31px;
    color: #fff;
    line-height: 1px;
    /* animation: wp_anim 2s linear infinite 1s; */
}

.owl-video-testimonial .owl-dots {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 1rem;
}

.owl-video-testimonial .owl-dot span {
    width: 12px;
    height: 12px;
    display: inline-block;
    border-radius: 50%;
    background-color: #b8b8b8;
}

.owl-video-testimonial .owl-dot.active span {
    background-color: #a8c84e;
}

.banner-nav button {
    position: absolute;
    top: 50%;
    width: 50px;
    height: 50px;
    line-height: 40px !important;
    border: 1px solid var(--bs-green) !important;
    text-align: center;
    border-radius: 50% !important;
    color: var(--bs-green) !important;
    -webkit-transition: .5s;
    transition: .5s;
    z-index: 1;
    transform: translateY(-50%);
    background-color: transparent;
}

.banner-nav button svg {
    width: 35px;
    height: 35px
}

.banner-nav button {
}

.banner-nav button:hover {
    background: var(--bs-green);
    color: #ffffff !important;
}

.banner-nav__left {
    left: -58px;
}

.banner-nav__right {
    right: -58px;
}

.section-banner:hover .banner-nav__left {
    left: 10px;
}

.section-banner:hover .banner-nav__right {
    right: 10px;
}

.section-album {
    background-color: #d5e6d5c7;
}

.album-item {
    background-color: #fff;
    border-radius: 16px;
    overflow: hidden;
}

.album-item__content {
    padding: 10px 20px;
}

.album-item__content h2 {
    font-size: 18px;
    font-weight: 400;
    text-align: center;
}

.footer-link {
    display: inline-block;
    margin-bottom: 18px;
    font-size: 1rem;
    color: #cfcfcf;
}

.footer-link:hover {
    color: #d4af37;
}

.footer-link.phone {
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none'%3E%3Cpath fill='%23000' d='M20 16v4c-2.758 0-5.07-.495-7-1.325c-3.841-1.652-6.176-4.63-7.5-7.675C4.4 8.472 4 5.898 4 4h4l1 4l-3.5 3c1.324 3.045 3.659 6.023 7.5 7.675L16 15z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M13 18.675c1.93.83 4.242 1.325 7 1.325v-4l-4-1zm0 0C9.159 17.023 6.824 14.045 5.5 11m0 0C4.4 8.472 4 5.898 4 4h4l1 4z'/%3E%3C/g%3E%3C/svg%3E");
}

.footer-link.email {
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2m0 4l-8 5l-8-5V6l8 5l8-5z'/%3E%3C/svg%3E");
}

.footer-link:before {
    content: '';
    display: inline-block;
    width: 26px;
    height: 26px;
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    position: relative;
    top: 8px;
    margin-right: 17px;
}

.blog_item img {
    border-radius: 25px;
    overflow: hidden;
    margin-bottom: 19px;
}

.blog_item ul .date span {
    margin-right: 7px;
    vertical-align: text-bottom;
}

.blog_item {
}

.blog_item .title {
    font-size: 17px;
    margin-top: 8px;
    display: block;
}

.blog_item ul .date {
    color: gray;
    color: var(--bs-color);
}

.page-title {
    text-align: center;
    padding: 20px 0;
    background: #eee;
}

.page-title ul {
    display: none
}

.content {
}

.content .item {
    background-color: #eee;
    background: #ffa68647;
    border-radius: 78px;
    padding: 15px 27px;
    margin-bottom: 13px;
    color: #712408;
    font-weight: 400;
}

.content-img {
    border-radius: 25px;
    overflow: hidden;
    aspect-ratio: 2/1.4;
    object-fit: cover;
    object-position: center;
}

.sec-yoga ul li {
    display: flex;
    align-items: center;
}

.sec-yoga ul li:before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='m14.571 15.004l.858 1.845s3.857.819 3.857 2.767C19.286 21 17.57 21 17.57 21H13l-2.25-1.25'/%3E%3Cpath d='m9.429 15.004l-.857 1.845s-3.858.819-3.858 2.767C4.714 21 6.43 21 6.43 21H8.5l2.25-1.25L13.5 18'/%3E%3Cpath d='M3 15.926s2.143-.461 3.429-.922C7.714 8.546 11.57 9.007 12 9.007s4.286-.461 5.571 5.997c1.286.46 3.429.922 3.429.922M12 7a2 2 0 1 0 0-4a2 2 0 0 0 0 4'/%3E%3C/g%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    /* position: relative; */
    -webkit-background-clip: initial;
    -webkit-text-fill-color: initial;
    top: 10px;
}

.blog_details_img_1 {
    /* height: 430px; */
    aspect-ratio: 16/7;
    background-color: #eee;
}

.blog_details_img_1 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media only screen and (max-width: 768px) {
    .blog_details_img_1 {
        height: auto
    }
}

.blog_details_img_1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}

.blog_details_engage {
    gap: 25px;
    margin-top: 25px;
    font-size: 15px;
    letter-spacing: .25px;
    font-weight: 600;
    color: #fd550d;
}

.blog_details_engage li span {
    display: inline-block;
    position: relative;
    top: -2px
}

.blog_details_left h2 {
    font-size: 27px;
    font-weight: 500;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #2e7296;
}

.blog_details_decsr, .blog_details_left p {
    font-size: 16px;
    line-height: 28px;
    margin-top: 15px;
    color: #121212c7;
    letter-spacing: 0.35px;
}

.blog_details_decsr p {
    margin-top: 0
}

.blog_details_decsr :where(ul, ol, li) {
    list-style: revert;
    padding-left: 20px
}

.blog_details_decsr li {
    padding-left: 0
}

.blog_details_right {
    border: 1px solid rgba(3, 26, 38, .1);
    overflow: hidden
}

.blog_details_right_header {
    padding: 25px 20px;
    border-top: 1px solid rgba(3, 26, 38, .1)
}

.blog_details_right_header h3 {
    font-size: 20px;
    font-weight: 600;
    text-transform: capitalize
}

.popular_blog {
    margin-top: 16px;
    align-items: center;
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #bcbcbc42;
    color: #000
}

.popular_blog.active {
    border: 1px solid #bcbcbc;
    color: var(--secondary-color)
}

.popular_blog_img {
    width: 90px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    background-color: #eee;
}

.popular_blog_text {
    width: 70%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: 18px
}

.popular_blog_text .item_title {
    font-weight: 500;
    font-family: var(--font-2)
}

.popular_blog_text p {
    font-weight: 500;
    font-size: 14px;
    color: #676767
}

.popular_blog_text p span {
    width: 14px;
    height: 16px;
    display: inline-block;
    margin-right: 5px
}

.popular_blog_text a {
    color: #202020;
    font-weight: 500;
    font-size: 1rem;
    margin-top: 0
}

/* about */
.about-home {
    max-width: 614px;
}

.about-text {
    /* line-height: 1.6; */
}

.lead-text {
    font-size: 1.25rem;
    font-weight: 500;
    color: #495057;
    line-height: 1.7;
    margin-bottom: 1.5rem;
}

.founder-quote {
    position: relative;
    padding: 1.0rem 2rem;
    border-left: 4px solid #013b71;
    border-radius: 0.75rem;
    margin-top: 2rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.quote-icon {
    position: absolute;
    top: -10px;
    left: var(--space-6);
    font-size: var(--text-6xl);
    font-family: var(--font-display);
    color: var(--color-primary);
    opacity: 0.2;
}

.quote-text {
    font-size: 1.125rem;
    font-style: italic;
    color: #495057;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
}

.quote-author {
    font-weight: 600;
    color: var(--primary-color);
}

.sec-maintitle {
    font-size: 2.58rem;
    font-family: var(--font-2);
    font-weight: 400;
    color: var(--primary-color);
    background: linear-gradient(135deg, #013b71 0%, #0254a3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-family: var(--font-3);
}

/* welcome */
.welcome {
    background: #f8f9fa;
    padding: 60px 0 40px;
}

/* Welcome Grid - Using Flexbox */
.welcome-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 6rem;
    align-items: center;
}

.welcome-image {
    flex: 1 1 45%;
    min-width: 300px;
    /* text-align: center; */
    border-radius: 15px;
    overflow: hidden;
}

.welcome-img-wrapper0 {
    border-radius: 18px;
    overflow: hidden
}

.welcome-content {
    flex: 1 1 45%;
    min-width: 300px;
}

.welcome-img-wrapper {
    width: 100%;
    aspect-ratio: 4/3;
    background-size: cover;
    background-position: center;
    border-radius: 24px;
    box-shadow: 0 8px 32px rgba(1, 59, 113, 0.16);
    display: flex;
    align-items: center;
    max-width: 480px;
    padding: 0 100px;
}

.welcome-text {
    font-size: 1.0625rem;
    color: #4a5568;
    line-height: 1.8;
    margin-bottom: 2rem;
}

.welcome-features {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2rem;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 500;
    color: #1a1a1a;
}

.feature-item svg {
    flex-shrink: 0;
    color: #013b71;
}

.welcome-quote {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 2rem;
    background: #e6f0f8;
    border-left: 4px solid #013b71;
    border-radius: 8px;
    margin-top: 4rem;
}

.welcome-quote svg {
    color: #013b71;
    flex-shrink: 0;
}

.welcome-quote p {
    font-family: var(--font-2);
    font-size: 1.25rem;
    font-style: italic;
    color: #013b71;
    margin: 0;
}

.odic-footer-content.img {
    max-width: 160px;
    margin-bottom: 20px;
}

.social-links {
    display: flex;
    gap: 1.5rem;
    margin-top: 1rem;
}

.social-link {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(212, 175, 55, 0.1);
    border: 1px solid rgba(212, 175, 55, 0.3);
    border-radius: 50%;
    color: #d4af37;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.social-link:hover {
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    color: #0a0e1a;
    border-color: #d4af37;
    /* transform: translateY(-5px) scale(1.1); */
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

.why-choose-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 3rem;
    /* --spacing-xl */
}

.why-card {
    padding: 3rem;
    /* --spacing-xl */
    background: rgba(20, 24, 36, 0.6);
    /* --color-bg-card */
    border: 1px solid rgba(212, 175, 55, 0.15);
    border-radius: 1.5rem;
    /* --radius-lg */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* --transition-base */
    backdrop-filter: blur(20px) saturate(180%);
    text-align: center;
}

.why-card:hover {
    transform: translateY(-10px);
    border-color: #D4AF37;
    /* --color-primary */
    border-color: #3790d4;
    box-shadow: 0 8px 32px rgba(212, 175, 55, 0.25), 0 0 64px rgba(212, 175, 55, 0.1);
    /* --shadow-gold */
    box-shadow: 0 8px 32px rgb(55 71 212 / 25%), 0 0 64px rgba(212, 175, 55, 0.1);
}

.why-icon {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgb(55 190 212 / 20%), rgba(168, 85, 247, 0.2));
    /* --gradient-card */
    border-radius: 1.5rem;
    /* --radius-lg */
    color: #D4AF37;
    /* --color-primary */
    color: #3790d4;
    margin: 0 auto 1.5rem;
    /* --spacing-md */
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* --transition-base */
}

.why-card:hover .why-icon {
    /* transform: scale(1.1) rotate(5deg); */
    /* box-shadow: 0 0 30px rgba(212, 175, 55, 0.4); */
}

.why-title {
    font-size: 1.375rem;
    margin-bottom: 1rem;
    /* --spacing-sm */
    color: #ffffff;
    /* --color-text-primary */
}

.why-description {
    color: #b8bcc8;
    /* --color-text-secondary */
    line-height: 1.7;
}

/* zz */
.pt-70 {
    padding-top: 70px;
}

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

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

.pb-70 {
    padding-bottom: 70px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-10 {
    padding-bottom: 10px;
}

.pl-70 {
    padding-left: 70px;
}

.pl-20 {
    padding-left: 20px;
}

.pl-10 {
    padding-left: 10px;
}

.pr-70 {
    padding-right: 70px;
}

.pr-20 {
    padding-right: 20px;
}

.pr-10 {
    padding-right: 10px;
}

.space {
    padding: 60px 0px;
}

@media only screen and (max-width: 768px) {
    .section-about-home {
        position: relative;
        padding: 0px 0px 30px;
    }

    .section-service {
        padding: 30px 0px 40px;
    }

    .banner-nav {
        display: none
    }
}

.section-dark {
    background-color: var(--primary-color);
}

.why-choose {
    padding: 60px 0px 80px;
}

.section-description {
    font-size: 1.125rem;
    color: #494949;
    max-width: 750px;
    margin: 0 auto;
    line-height: 1.8;
}

.light .section-description {
    color: #b8bcc8;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 3rem;
    margin-bottom: 6rem;
}

.product-card {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.7);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: var(--shadow-md);
    border: 1px solid rgba(1, 59, 113, 0.2);
    backdrop-filter: blur(20px);
}

.section-dark .product-card {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(1, 59, 113, 0.25);
}

.product-card:hover {
    /* transform: translateY(-10px) scale(1.02); */
    box-shadow: var(--shadow-xl);
    border-color: var(--color-primary);
    background: rgba(1, 59, 113, 0.08);
}

.product-image {
    position: relative;
    height: 250px;
    overflow: hidden;
    background: rgba(1, 59, 113, 0.05);
}

.product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.product-card:hover .product-image img {
    transform: scale(1.1);
}

.product-badge {
    position: absolute;
    top: var(--spacing-sm);
    right: var(--spacing-sm);
    padding: 0.375rem 0.875rem;
    background: var(--gradient-primary);
    color: var(--color-bg-dark);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: var(--radius-full);
    box-shadow: var(--shadow-md);
    z-index: 2;
}

.product-content {
    padding: var(--spacing-lg);
    text-align: center;
}

.product-name {
    font-size: 1.25rem;
    margin-bottom: 10px;
    color: var(--primary-dark);
    margin-top: 16px;
}

.product-description {
    color: var(--color-text-secondary);
    font-size: 0.95rem;
    line-height: 1.6;
}

.store-cta {
    text-align: center;
}

/* membership */
.membership-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
    align-items: center;
}

.membership-description {
    font-size: 1.375rem;
    color: #ffffff;
    margin-bottom: 1.5rem;
}

.membership-description strong {
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.membership-text {
    font-size: 1.125rem;
    color: #b8bcc8;
    margin-bottom: 3rem;
    line-height: 1.8;
}

.membership-text strong {
    color: #D4AF37;
    font-weight: 600;
}

.membership-benefits {
    margin-bottom: 3rem;
}

.membership-benefits li {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: #cbcbcb;
}

.membership-benefits li:hover {
    padding-left: 1rem;
    border-bottom-color: rgb(55 105 212 / 30%);
}

.membership-benefits li:last-child {
    border-bottom: none;
}

.benefit-icon {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    color: #0a0e1a;
    border-radius: 50%;
    font-weight: 700;
    flex-shrink: 0;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.4);
}

/* Holographic ID Card */
.membership-visual {
    perspective: 1500px;
}

.id-card {
    position: relative;
    width: 100%;
    max-width: 460px;
    aspect-ratio: 2.1/1.4;
    background: linear-gradient(135deg, #1a1f2e 0%, #0f1419 100%);
    border-radius: 2rem;
    padding: 2rem 3rem;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.3);
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
    border: 1px solid rgba(212, 175, 55, 0.3);
    overflow: hidden;
}

.id-card:hover {
    transform: rotateY(10deg) rotateX(5deg) scale(1.05);
    box-shadow: 0 0 40px rgba(212, 175, 55, 0.3), 0 0 80px rgba(212, 175, 55, 0.1);
}

.id-card-shine {
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, #D4AF37, #A855F7, #3B82F6, #EC4899, #D4AF37);
    background-size: 400% 400%;
    opacity: 0.15;
    animation: holographic 8s ease infinite;
    pointer-events: none;
    mix-blend-mode: overlay;
}

.id-card-content {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.id-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.id-card-logo {
    font-family: var(--font-2);
    font-size: clamp(1.2rem, 5vw, 2rem);
    font-weight: 700;
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.id-card-badge {
    padding: 0.5rem 1rem;
    background: var(--gradient-primary);
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 0.5rem;
    letter-spacing: 2px;
    box-shadow: 0 0 20px rgb(55 145 212 / 50%);
}

.id-card-chip {
    width: 55px;
    height: 45px;
    background: linear-gradient(135deg, #d4af37 0%, #f4d03f 100%);
    border-radius: 8px;
    margin-bottom: 1rem;
    position: relative;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    display: none;
}

.id-card-chip::before {
    content: '';
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    background: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.15) 0px, rgba(0, 0, 0, 0.15) 2px, transparent 2px, transparent 4px);
}

.id-card-info {
    margin-bottom: 1rem;
}

.id-card-label {
    font-size: 0.75rem;
    color: #c7c7c7;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 0.25rem;
}

.id-card-value {
    font-size: 1.125rem;
    font-weight: 600;
    color: #ffffff;
}

.id-card-footer {
    padding-top: 1.5rem;
    border-top: 1px solid rgba(212, 175, 55, 0.2);
    display: none;
}

.id-card-tagline {
    font-size: 0.875rem;
    font-style: italic;
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* review */
.testimonials-slider {
    max-width: 950px;
    margin: 0 auto;
}

.testimonial-track {
    position: relative;
    min-height: 380px;
}

.testimonial-card {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 4rem;
    background: rgb(255 255 255 / 90%);
    border: 1px solid rgba(212, 175, 55, 0.15);
    border-radius: 2rem;
    backdrop-filter: blur(20px) saturate(180%);
    opacity: 0;
    transform: translateX(100px) scale(0.95);
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2), 0 2px 8px rgba(0, 0, 0, 0.1);
}

.testimonial-card.active {
    opacity: 1;
    transform: translateX(0) scale(1);
    pointer-events: auto;
}

.testimonial-rating {
    display: flex;
    gap: 0.375rem;
    margin-bottom: 1.5rem;
    color: var(--primary-dark);
    font-size: 1.375rem;
}

.testimonial-text {
    font-size: 1.375rem;
    line-height: 1.8;
    color: #383838;
    margin-bottom: 3rem;
    font-style: italic;
    font-weight: 300;
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.author-avatar {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gradient-primary);
    color: #ffffff;
    font-weight: 700;
    font-size: 1.375rem;
    border-radius: 50%;
    box-shadow: 0 0 30px rgb(55 161 212 / 40%);
}

.author-name {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--primary-color);
    margin-bottom: 0.25rem;
}

.author-location {
    color: #6b7280;
    font-size: 0.95rem;
}

.testimonial-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    margin-top: 6rem;
}

.testimonial-btn {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(55 175 212 / 10%);
    border: 1px solid rgb(55 176 212 / 30%);
    border-radius: 50%;
    color: var(--primary-dark);
    font-size: 1.5rem;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.testimonial-btn:hover {
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    color: #0a0e1a;
    border-color: #D4AF37;
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

.testimonial-dots {
    display: flex;
    gap: 1rem;
}

.dot {
    width: 10px;
    height: 10px;
    background: rgba(212, 175, 55, 0.3);
    border-radius: 50%;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.dot:hover {
    background: rgba(212, 175, 55, 0.6);
    transform: scale(1.2);
}

.dot.active {
    background: linear-gradient(135deg, #D4AF37 0%, #E5C965 100%);
    width: 32px;
    border-radius: 9999px;
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.5);
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse"><path d="M 100 0 L 0 0 0 100" fill="none" stroke="rgba(255,255,255,0.02)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');
    opacity: 0;
    z-index: 2;
    background: #09032eb8;
    pointer-events: none;
}

.odic-slider-content {
    position: relative;
    z-index: 9999
}

.prd-img {
    border-radius: 15px;
    overflow: hidden;
    /* aspect-ratio: 4/3; */
    object-fit: cover;
    object-position: center;
}

.about-hero {
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #ffffff 100%);
    overflow: hidden;
    padding-top: 100px;
}

.about-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(1, 59, 113, 0.1) 0%, rgba(74, 144, 226, 0.08) 50%, rgba(1, 59, 113, 0.1) 100%);
    background-size: 400% 400%;
    animation: gradientShift 15s ease infinite;
}

.about-hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 6rem 0;
}

.about-hero-title {
    font-size: clamp(3rem, 6vw, 5rem);
    font-weight: 700;
    margin-bottom: 1.5rem;
    color: #1a1a1a;
}

.about-hero-subtitle {
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);
    color: #4a5568;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
}

/* About Story Section */
.about-story {
    padding: 6rem 0;
}

.story-intro {
    max-width: 900px;
    margin: 0 auto 1rem;
    text-align: center;
}

.story-content {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.2rem 0rem;
}

.story-content p {
    font-size: clamp(1rem, 1.5vw, 1.125rem);
    line-height: 1.8;
    color: #4a5568;
}

.highlight-text {
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    color: #013b71;
    font-weight: 400;
    padding: 2rem;
    background: linear-gradient(135deg, rgba(1, 59, 113, 0.05) 0%, rgba(74, 144, 226, 0.05) 100%);
    border-left: 4px solid #013b71;
    border-radius: 1rem;
    margin: 1rem 0;
}

.purpose-text {
    font-size: clamp(1.125rem, 2vw, 1.25rem);
    color: #1a1a1a;
    font-weight: 600;
    padding: 3rem;
    background: linear-gradient(135deg, rgba(1, 59, 113, 0.15) 0%, rgba(168, 85, 247, 0.15) 100%);
    border-radius: 1.5rem;
    text-align: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.05);
    margin-top: 2rem;
}

/* About Intro Section */
.about-intro {
    padding: 6rem 0;
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
    align-items: center;
}

.about-content .section-title {
    margin-bottom: 2rem;
}

.about-text {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.ablead-text {
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    color: #1a1a1a;
    line-height: 1.8;
}

.about-image-card {
    position: relative;
}

.intro-text {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    line-height: 1.8;
    color: #1a1a1a;
}

/* why ride97 */
.features-grid {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    margin-top: 4rem;
}

.feature-card {
    background: #ffffff;
    padding: 3rem 2rem;
    border-radius: 1.5rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    /* transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); */
    border: 2px solid transparent;
    position: relative;
    overflow: hidden;
    /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06); */
    transition: all 500ms;
}

.feature-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(1, 59, 113, 0.02) 0%, rgba(74, 144, 226, 0.02) 100%);
    opacity: 0;
    transition: opacity 0.4s;
    pointer-events: none;
}

.feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px rgba(1, 59, 113, 0.15);
    border-color: rgba(1, 59, 113, 0.2);
}

.feature-card:hover::before {
    opacity: 1;
}

.feature-header {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.feature-number {
    width: 64px;
    height: 64px;
    background: linear-gradient(135deg, #013b71 0%, #4a90e2 100%);
    color: #ffffff;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.75rem;
    flex-shrink: 0;
    box-shadow: 0 8px 24px rgba(1, 59, 113, 0.3);
}

.feature-title {
    margin: 0;
    color: #3f3f3f;
    font-size: clamp(1.375rem, 2.5vw, 1.575rem);
    letter-spacing: 0.038rem;
    /* color: #1E4FD8; */
    line-height: 1.5;
}

.feature-content {
    padding-left: 80px;
}

.feature-text {
    color: #4a5568;
    line-height: 1.8;
    margin-bottom: 1rem;
    font-size: 1.0625rem;
}

.feature-text strong {
    color: #013b71;
    font-weight: 600;
}

.feature-list {
    list-style: none;
    margin-top: 1.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.feature-list li {
    --c: #0F3D6E;
    padding: 0.75rem 1rem;
    padding-left: 2.5rem;
    position: relative;
    color: var(--c, #4a5568);
    background: rgba(1, 59, 113, 0.03);
    border-radius: 0.5rem;
    transition: all 0.3s;
}

.feature-list li:hover {
    background: rgba(1, 59, 113, 0.08);
    transform: translateX(4px);
}

.feature-list li:before {
    content: "✓";
    position: absolute;
    left: 1rem;
    color: #013b71;
    font-weight: 700;
    font-size: 1.125rem;
    color: #0F3D6E;
}

.feature-badge {
    display: inline-block;
    background: linear-gradient(135deg, #4a90e2 0%, #013b71 100%);
    color: #ffffff;
    padding: 0.5rem 1rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 600;
    margin-top: 1rem;
    box-shadow: 0 4px 12px rgba(1, 59, 113, 0.2);
}

.tagline-sec-content {
    /* rgba(255, 255, 255, 0.9) */
    background: var(--bg-g-plight);
    border-radius: 39px;
}

.tagline-quote {
    font-size: clamp(1.5rem, 5vw, 2.5rem);
    font-weight: 300;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
    color: #fff;
    letter-spacing: 0.1rem;
    font-family: var(--font-3);
}

.tagline-sub {
    font-size: clamp(1rem, 1.5vw, 25px);
    /* opacity: .95; */
    color: rgba(255, 255, 255, .9);
    font-weight: 500;
    text-transform: uppercase;
    margin-top: 3vw;
    margin-bottom: 9px;
    letter-spacing: 0.05rem;
}

.tagline-sub span {
    display: inline-block;
    position: relative;
    background: linear-gradient(135deg, #ffffff 0%, #f0f0f0 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    padding: 10px 0;
}

.tagline-sub span:before, .tagline-sub span:after {
    content: '';
    position: absolute;
    width: min(19vw, 100px);
    height: 1px;
    background-color: #fff;
    left: 50%;
    transform: translateX(-50%)
}

.tagline-sub span:before {
    top: 0;
}

.tagline-sub span:after {
    bottom: 0px
}

/* Intro */
.intro {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    padding: 3rem 0;
}

.intro-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.intro-text {
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    line-height: 1.8;
    color: #2d3748;
    margin-bottom: 1.5rem;
}

.intro-highlight {
    background: linear-gradient(135deg, rgba(1, 59, 113, 0.08) 0%, rgba(74, 144, 226, 0.08) 100%);
    padding: 1.5rem 2rem;
    border-radius: 12px;
    border-left: 4px solid #013b71;
    margin-top: 2rem;
}

.intro-highlight p {
    font-size: 1.125rem;
    color: #1a1a1a;
    font-weight: 500;
}

/* Highlights Grid */
.highlights {
    padding: 4rem 0;
}

.highlights-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    margin-top: 3rem;
    position: relative;
    z-index: 1;
}

.highlight-item {
    background: #ffffff;
    padding: 2.2rem 1.5rem;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 2px solid transparent;
    text-align: center;
}

.highlight-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 1.25rem;
    display: block;
}

.highlight-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(1, 59, 113, 0.12);
    border-color: rgba(1, 59, 113, 0.15);
}

.highlight-icon {
    font-size: 2rem;
    margin-bottom: 0.75rem;
}

.highlight-item h3 {
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
    color: #013b71;
}

.highlight-item p {
    font-size: 1rem;
    color: #4a5568;
    line-height: 1.7;
    margin-bottom: 0;
}

/* Image Section */
.image-section {
    background: #f8f9fa;
    padding: 4rem 0;
}

.image-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.image-card {
    position: relative;
    height: 280px;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.image-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #013b71 0%, #4a90e2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: 1.125rem;
}

/* Benefits */
.benefits {
    padding: 4rem 0;
    background: linear-gradient(135deg, #013b71 0%, #4a90e2 100%);
    color: white;
    margin-top: 4rem;
}

.benefits .section-title, .benefits .section-subtitle {
    color: white;
}

.benefits-list {
    max-width: 1005px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
    justify-content: center;
}

.benefit-item {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    padding: 1.25rem 1.5rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    gap: 0.75rem;
    transition: all 0.3s;
}

.benefit-item:hover {
    background: rgba(255, 255, 255, 0.15);
    transform: translateX(4px);
}

.benefit-icon {
    font-size: 1.25rem;
    flex-shrink: 0;
}

.benefit-text {
    font-size: 0.9375rem;
    font-weight: 500;
}

.room-header {
    text-align: center;
    margin-bottom: 3rem;
}

.room-title {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    color: #013b71;
    margin-bottom: 0.5rem;
}

.room-description {
    font-size: 1.125rem;
    color: #4a5568;
}

.room-swiper {
    padding: 2rem 0 3rem;
}

.swiper-slide {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.room-photo {
    width: 100%;
    /* max-width: 600px; */
    /* height: 400px; */
    border-radius: 16px;
    overflow: hidden;
    /* box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); */
    transition: all 0.4s;
    cursor: pointer;
    aspect-ratio: 2/1.3;
}

.room-photo:hover {
    /* transform: scale(1.05); */
    box-shadow: 0 12px 32px rgba(1, 59, 113, 0.2);
}

.room-photo-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #ffffff 0%, #e0e0e0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0rem;
}

.swiper-button-next, .swiper-button-prev {
    color: #013b71 !important;
    background: white;
    width: 48px !important;
    height: 48px !important;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 20px !important;
    font-weight: 700;
}

.swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: #013b71;
    opacity: 0.3;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #013b71;
}

.cta {
    padding: 4rem 0;
    text-align: center;
    background: #ffffff;
}

.cta-content {
    max-width: 700px;
    margin: 0 auto;
}

.cta h2 {
    font-size: clamp(2rem, 4vw, 3rem);
    margin-bottom: 1rem;
}

.cta p {
    font-size: clamp(1rem, 1.5vw, 1.25rem);
    color: #4a5568;
    margin-bottom: 2rem;
}

.cta-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-secondary {
    background: white;
    color: #013b71;
    padding: 0.875rem 2rem;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none;
    border: 2px solid #013b71;
    transition: all 0.3s;
}

.btn-secondary:hover {
    background: #013b71;
    color: white;
}

/* store */
/* Products Grid */
.products {
    padding: 3rem 0;
}

.section-title {
    font-size: clamp(2rem, 4vw, 3rem);
    margin-bottom: 1rem;
    color: #166534;
}

.section-subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: #4a5568;
    margin-bottom: 4rem;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
}

.sproduct-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 2.5rem 2rem;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transition: all 0.4s;
    border: 1px solid #f0fdf4;
}

.sproduct-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 16px 32px rgba(22, 101, 52, 0.15);
    border-color: #bbf7d0;
}

.product-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 1.5rem;
}

.product-title {
    font-size: 1.25rem;
    color: #166534;
    margin-bottom: 0.5rem;
}

.product-desc {
    font-size: 0.9375rem;
    color: #4a5568;
}

/* Exclusive Access */
.exclusive {
    padding: 6rem 0;
    background: linear-gradient(135deg, #166534 0%, #15803d 100%);
    color: white;
    position: relative;
    overflow: hidden;
}

.exclusive::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.exclusive-content {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.exclusive h2 {
    font-size: clamp(2rem, 4vw, 3.5rem);
    margin-bottom: 1.5rem;
    color: #fff;
}

.exclusive p {
    font-size: 1.25rem;
    opacity: 0.9;
    margin-bottom: 2.5rem;
    line-height: 1.6;
}

.exclusive-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(4px);
    padding: 1rem 2rem;
    border-radius: 50px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    font-size: 1.125rem;
    font-weight: 600;
}

/* Quality Promise */
.promise {
    padding: 5rem 0;
    text-align: center;
    background: #f8fafc;
}

.promise-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 3rem;
    max-width: 1000px;
    margin: 3rem auto 0;
}

.promise-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.promise-item h3 {
    font-size: 1.2rem;
    font-family: var(--font-3);
    margin-bottom: 7px;
}

.promise-icon {
    width: 64px;
    height: 64px;
    margin-bottom: 1rem;
    color: #166534;
}

/* contact */
/* Form Section */
.form-section {
    background: #fcfcfc;
    padding: 2rem clamp(1rem, 1.5vw,6rem);
    /* padding-left: clamp(1rem, 3vw,6rem); */
    /* padding-right: clamp(1rem, 3vw,6rem); */
    border-radius: 16px;
    /* box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 4px 16px rgba(0, 0, 0, 0.08); */
    border: 1px solid #d3d3d3;
}

.section-header {
    margin-bottom: 2.5rem;
}

.section-header h2 {
    font-size: 2rem;
    color: #013b71;
    margin-bottom: 1rem;
}

.offer-badge {
    background: #ecfdf5;
    color: #059669;
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-size: 0.875rem;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 1rem;
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-group input.error, .form-group textarea.error {
    border-color: #ff3333;
}

.form-group label.error, #form-alert p, #file-alert p {
    color: #e14343;
    font-size: 0.90rem;
    font-weight: 400;
    margin-top: 7px;
    line-height: 1;
}

.form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #121121;
    font-size: 0.85rem;
}

.mform-control {
    width: 100%;
    padding: 0.575rem 1rem;
    border: 1px solid rgb(33 33 33 / 20%);
    border-radius: 5px;
    font-family: var(--font-2);
    font-size: 0.95rem;
    transition: all 0.3s;
}

.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
    outline: none;
    border-color: var(--primary-color);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 0 0px rgba(212, 175, 55, 0.1);
}

.radio-group {
    display: flex;
    gap: 2rem;
    margin-top: 0.5rem;
}

.radio-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.file-upload {
    /* border: 2px dashed #cbd5e1; */
    /* padding: 1.5rem 2rem; */
    /* text-align: center; */
    /* border-radius: 8px; */
    /* cursor: pointer; */
    /* transition: all 0.3s; */
    /* width: 100%; */
}

.file-upload > .upload-fileinp {
    border: 2px dashed #cbd5e1;
    padding: 0.5rem 2rem;
    /* text-align: center; */
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s;
    display: block;
}

.file-upload:hover {
    border-color: #013b71;
    background: #f8fafc;
}

.file-form {
    /* display: flex; */
    gap: 1rem;
}

.file-form__upload {
    width: min(100%, 100%);
    position: relative;
}

.disclaimer {
    font-size: 0.975rem;
    color: #5f6a7a;
    margin: 1.5rem 0;
    padding-top: 1.5rem;
    border-top: 1px solid #e2e8f0;
}

.member-form {
    /* display: grid; */
    /* grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); */
    /* gap: 0.2rem 1.5rem; */
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.invalid-feedback {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #dc3545;
}

.form-control.is-invalid {
    border-color: #dc3545;
}

.form-control.is-invalid ~ .invalid-feedback {
    display: block;
}

.fileinput-proof {
    /* opacity: 0;
    visibility: hidden;
    position: absolute;
    left: 99999px; */
}

.fileinput-proof {
    outline: none !important;
    padding: 4px !important;
    margin: -4px !important;
    display: block;
    width: 100%;
}

.fileinput-proof:focus-within::file-selector-button, .fileinput-proof:focus::file-selector-button {
    outline: 2px solid #0964b0 !important;
    outline-offset: 2px !important;
}

.fileinput-proof::before {
    top: 11px !important;
}

.fileinput-proof::after {
    top: 14px !important;
}

.fileinput-proof {
    position: relative !important;
}

.fileinput-proof::file-selector-button {
    width: 136px !important;
    color: transparent !important;
}

.fileinput-proof::before {
    position: absolute !important;
    pointer-events: none !important;
    left: 40px !important;
    color: #0964b0 !important;
    content: "Upload File" !important;
}

.fileinput-proof::after {
    position: absolute !important;
    pointer-events: none !important;
    left: 16px !important;
    height: 20px !important;
    width: 20px !important;
    content: "" !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230964B0'%3E%3Cpath d='M18 15v3H6v-3H4v3c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-3h-2zM7 9l1.41 1.41L11 7.83V16h2V7.83l2.59 2.58L17 9l-5-5-5 5z'/%3E%3C/svg%3E") !important;
}

.fileinput-proof::file-selector-button {
    border-radius: 4px !important;
    padding: 0 16px !important;
    height: 40px !important;
    cursor: pointer !important;
    background-color: white !important;
    border: 1px solid rgba(0, 0, 0, 0.16) !important;
    box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.05) !important;
    margin-right: 16px !important;
    transition: background-color 200ms !important;
}

/* hover state */
.fileinput-proof::file-selector-button:hover {
    background-color: #f3f4f6 !important;
}

/* active state */
.fileinput-proof::file-selector-button:active {
    background-color: #e5e7eb !important;
}

div#form-alert {
    border: 2px dashed #e1cbd1;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    margin-bottom: 17px;
}

.icon-uae {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 72'%3E%3Cpath fill='%23fff' d='M5 17h62v38H5z'/%3E%3Cpath d='M5 42h62v13H5z'/%3E%3Cpath fill='%235c9e31' d='M5 17h62v13H5z'/%3E%3Cpath fill='%23d22f27' d='M5 17h21v38H5z'/%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 17h62v38H5z'/%3E%3C/svg%3E");
}

.icon-india {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23f2b200' d='M31.8 2c-13 0-24.1 8.4-28.2 20h56.6C56 10.4 44.9 2 31.8 2'/%3E%3Cpath fill='%2383bf4f' d='M31.8 62c13.1 0 24.2-8.3 28.3-20H3.6c4.1 11.7 15.2 20 28.2 20'/%3E%3Cpath fill='%23fff' d='M3.6 22c-1.1 3.1-1.7 6.5-1.7 10s.6 6.9 1.7 10h56.6c1.1-3.1 1.7-6.5 1.7-10s-.6-6.9-1.7-10z'/%3E%3Ccircle cx='31.8' cy='32' r='8' fill='%23428bc1'/%3E%3Ccircle cx='31.8' cy='32' r='7' fill='%23fff'/%3E%3Cg fill='%23428bc1'%3E%3Ccircle cx='29.2' cy='25.5' r='.5'/%3E%3Ccircle cx='27.6' cy='26.4' r='.5'/%3E%3Ccircle cx='26.3' cy='27.7' r='.5'/%3E%3Ccircle cx='25.4' cy='29.3' r='.5'/%3E%3Ccircle cx='24.9' cy='31.1' r='.5'/%3E%3Ccircle cx='24.9' cy='32.9' r='.5'/%3E%3Ccircle cx='25.4' cy='34.7' r='.5'/%3E%3Ccircle cx='26.3' cy='36.3' r='.5'/%3E%3Ccircle cx='27.6' cy='37.6' r='.5'/%3E%3Ccircle cx='29.2' cy='38.5' r='.5'/%3E%3Ccircle cx='30.9' cy='38.9' r='.5'/%3E%3Cpath d='M32.3 39c0-.3.2-.5.4-.6c.3 0 .5.2.6.4c0 .3-.2.5-.4.6c-.4.1-.6-.1-.6-.4'/%3E%3Ccircle cx='34.5' cy='38.5' r='.5'/%3E%3Ccircle cx='36.1' cy='37.6' r='.5'/%3E%3Ccircle cx='37.4' cy='36.3' r='.5'/%3E%3Ccircle cx='38.3' cy='34.7' r='.5'/%3E%3Ccircle cx='38.8' cy='32.9' r='.5'/%3E%3Cpath d='M38.8 31.6c-.3 0-.5-.2-.6-.4c0-.3.2-.5.4-.6c.3 0 .5.2.6.4c.1.3-.1.5-.4.6'/%3E%3Ccircle cx='38.3' cy='29.3' r='.5'/%3E%3Ccircle cx='37.4' cy='27.7' r='.5'/%3E%3Ccircle cx='36.1' cy='26.4' r='.5'/%3E%3Cpath d='M35 25.7c-.1.3-.4.4-.7.3s-.4-.4-.3-.7s.4-.4.7-.3c.3.2.4.5.3.7m-1.8-.6c0 .3-.3.5-.6.4c-.3 0-.5-.3-.4-.6c0-.3.3-.5.6-.4s.5.4.4.6m-1.8-.1c0 .3-.2.5-.4.6c-.3 0-.5-.2-.6-.4c0-.3.2-.5.4-.6c.3-.1.6.1.6.4'/%3E%3Ccircle cx='31.8' cy='32' r='1.5'/%3E%3Cpath d='m31.8 25l-.2 4.3l.2 2.7l.3-2.7zm-1.8.2l.9 4.3l.9 2.5l-.4-2.7z'/%3E%3Cpath d='m28.3 25.9l2 3.9l1.5 2.2l-1.1-2.5zM26.9 27l2.9 3.3l2 1.7l-1.7-2.1z'/%3E%3Cpath d='m25.8 28.5l3.6 2.4l2.4 1.1l-2.2-1.6z'/%3E%3Cpath d='m25.1 30.2l4.1 1.3l2.6.5l-2.5-.9zm-.3 1.8l4.4.2l2.6-.2l-2.6-.2z'/%3E%3Cpath d='m25.1 33.8l4.2-.9l2.5-.9l-2.6.5zm.7 1.7l3.8-1.9l2.2-1.6l-2.4 1.1z'/%3E%3Cpath d='m26.9 36.9l3.2-2.8l1.7-2.1l-2 1.7zm1.4 1.2l2.4-3.7l1.1-2.4l-1.5 2.2z'/%3E%3Cpath d='m30 38.8l1.4-4.1l.4-2.7l-.9 2.5zm1.8.2l.3-4.3l-.3-2.7l-.2 2.7zm1.8-.2l-.8-4.3l-1-2.5l.5 2.7z'/%3E%3Cpath d='m35.3 38.1l-1.9-3.9l-1.6-2.2l1.2 2.5zm1.5-1.2l-2.9-3.2l-2.1-1.7l1.8 2.1z'/%3E%3Cpath d='m37.9 35.5l-3.6-2.4l-2.5-1.1l2.2 1.6zm.7-1.7l-4.1-1.3l-2.7-.5l2.6.9zm.2-1.8l-4.3-.3l-2.7.3l2.7.2zm-.2-1.8l-4.2.9l-2.6.9l2.7-.5z'/%3E%3Cpath d='M37.9 28.5L34 30.4L31.8 32l2.5-1.1zm-1.1-1.4l-3.2 2.8l-1.8 2.1l2.1-1.7z'/%3E%3Cpath d='M35.3 25.9L33 29.6L31.8 32l1.6-2.2z'/%3E%3Cpath d='m33.7 25.2l-1.4 4.1l-.5 2.7l1-2.5z'/%3E%3C/g%3E%3C/svg%3E");
}

.icon-singapore {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23f9f9f9' d='M32 62c16.6 0 30-13.4 30-30H2c0 16.6 13.4 30 30 30'/%3E%3Cpath fill='%23ed4c5c' d='M32 2C15.4 2 2 15.4 2 32h60C62 15.4 48.6 2 32 2'/%3E%3Cg fill='%23f9f9f9'%3E%3Cpath d='m21.2 17.5l-1.2-1h1.5L22 15l.5 1.5H24l-1.2 1l.4 1.5l-1.2-.9l-1.2.9zm8 0l-1.2-1h1.5L30 15l.5 1.5H32l-1.2 1l.4 1.5l-1.2-.9l-1.2.9zm-7 5l-1.2-1h1.5L23 20l.5 1.5H25l-1.2 1l.4 1.5l-1.2-.9l-1.2.9zm6 0l-1.2-1h1.5L29 20l.5 1.5H31l-1.2 1l.4 1.5l-1.2-.9l-1.2.9zm-3-8l-1.2-1h1.5L26 12l.5 1.5H28l-1.2 1l.4 1.5l-1.2-.9l-1.2.9z'/%3E%3Cpath d='M24.4 28c-4.8 0-8.6-4.1-8.6-9.1s3.9-9.1 8.6-9.1c.4 0 .7 0 1 .1Q23.6 9 21.5 9C16.3 9 12 13.5 12 19s4.3 10 9.5 10c1.6 0 3.2-.4 4.5-1.2c-.5.1-1 .2-1.6.2'/%3E%3C/g%3E%3C/svg%3E");
}

.flagicon {
    /* content: ''; */
    display: inline-block;
    width: 42px;
    height: 32px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: relative;
    /* top: 6px; */
}

.note-box {
    background: #dbebff;
    padding: 1.5rem;
    border-radius: 8px;
    margin-top: 2rem;
    font-size: 0.9975rem;
    line-height: 1.6;
    border-left: 3px solid #4a90e2;
}

.swal-footer {
    text-align: center;
}

.swal-button {
    background-color: var(--primary-color);
}

.swal-text {
    text-align: center;
    font-weight: 400;
    color: #1a1a1a;
    line-height: 1.6;
}

.captch-btn, span.captcha-text {
    display: inline-block;
    margin-left: 10px
}

span.captcha-text {
    background-color: #e9e9e9;
    font-size: 17px;
    padding: 8px 13px;
    font-weight: 400;
    font-style: italic;
    color: #112e6a;
    letter-spacing: 2.25px;
    max-width: 130px;
    min-width: 97px;
    text-align: center;
    font-weight: 700;
}

.captch-btn {
    padding: 0 7px;
    border: 1px solid #adc1ef;
    background: #c0d3ff
}

/* xx */
@media (max-width: 1199px) {
    .welcome-img-wrapper0 {
        max-width: 550px
    }
}

@media (max-width: 1199px) {
    .odic-header-menu ul {
        gap: 10px 28px;
    }
}

@media (max-width: 1024px) {
    .membership-wrapper {
        grid-template-columns: 1fr;
    }

    .id-card {
        max-width: 500px;
        margin: 0 auto;
    }

    .testimonial-controls {
        margin-top: 3rem;
    }

    .sec-maintitle {
        font-size: 2.28rem;
    }
}

@media only screen and (max-width: 992px) {
    .odic-header-logo {
        max-width: 250px;
    }
}

@media only screen and (max-width: 768px) {
    .slider-area {
        aspect-ratio: 3.8/4;
    }

    .why-choose {
        padding: 10px 0px 40px;
    }

    .about-home .lead-text+p {
        font-size: 0.90rem;
        letter-spacing: 0.01rem;
    }

    .testimonial-card {
        padding: 1.2rem;
    }

    .testimonial-text {
        font-size: 1.075rem;
    }

    .testimonial-rating {
        margin-bottom: 0.5rem;
    }

    .welcome-grid {
        gap: 3rem;
    }

    .tagline-sec-content {
        border-radius: 25px;
    }
}

@media (max-width: 568px) {
    .id-card {
        padding: 1.2rem 1.8rem;
    }

    .breatcumb-area {
        padding: 30px 0 30px;
    }

    .feature-card {
        padding: 2rem 1.2rem;
    }

    .feature-number {
        width: 44px;
        height: 44px;
        font-size: 1.05rem;
        border-radius: 0.55rem;
    }

    .feature-content {
        padding-left: 10px;
    }
}