﻿:root {
    --primary-sb-color: #ffd333;
    --font-default: 'Outfit', sans-serif;
    --font-heading: 'Outfit', sans-serif;
    --font-secondary: 'Manrope', sans-serif;
    --fontawesome: "Font Awesome 5 Pro";
    --black: #000000;
    --dark: #0e2769;
    --dark-secondary: #1e3373;
    --white: #ffffff;
    --color-primary: #1351d8;
    --color-secondary: #9c00ff;
    --color-style-two: #B700C4;
    --color-style-three: #FF9B0D;
    --color-heading: #0e0e0e;
    --color-paragraph: #666666;
    --box-shadow-primary: -1px 3px 10px 0 rgba(0, 0, 0, 0.6);
    --box-shadow-secondary: 0 10px 30px 0 rgba(44, 130, 237, 0.4);
    --box-shadow-regular: 0px 2px 12px 0px #e7e7e7;
    --bg-gray: #eff6fe;
    --bg-gradient: linear-gradient(90deg, var(--color-primary) 0%, var(--color-secondary) 100%);
    --bg-gradient-secondary: linear-gradient(0deg, var(--color-primary) 0%, var(--color-secondary) 100%);
    --bg-gradient-two: linear-gradient(90deg, var(--color-style-two) 0%, var(--color-style-three) 100%);
}

body {
    font-family: "Inter", sans-serif !important;
}

.active {
    color: #086AD8 !important;
}

.fw-100 {
    font-weight: 100 !important;
}

.fw-200 {
    font-weight: 200 !important;
}

.fw-300 {
    font-weight: 300 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-700 {
    font-weight: 700 !important;
}

.fw-800 {
    font-weight: 800 !important;
}

.fw-900 {
    font-weight: 900 !important;
}

.btn.btn-theme {
    color: var(--white);
    border: none;
    background: var(--bg-gradient);
}

.color-style-two .btn.btn-theme {
    background: var(--bg-gradient-two);
}

.btn.btn-theme::after {
    position: absolute;
    top: inherit;
    right: inherit;
    bottom: inherit;
    left: -5%;
    content: "";
    height: 150px;
    width: 115%;
    z-index: -1;
    background-color: var(--dark);
    -webkit-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    -webkit-transform: translateY(-45%) skew(25deg) scale(0);
    transform: translateY(-45%) skew(25deg) scale(0);
}

.shadow .btn.btn-theme::after,
.bg-dark .btn.btn-theme::after {
    background-color: var(--white) !important;
}

.shadow .btn.btn-theme:hover,
.bg-dark .btn.btn-theme:hover {
    color: var(--color-heading);
}

.btn-theme:hover {
    /* -webkit-transform: translateY(-45%) skew(25deg) scale(1.2);
	transform: translateY(-45%) skew(25deg) scale(1.2); */
    background: var(--dark-secondary);
}

.btn.radius {
    border-radius: 6px;
}

.btn-md {
    padding: 14px 35px;
    font-size: 18px;
}

.btn-warning {
    border-color: var(--primary-sb-color) !important;
    background-color: var(--primary-sb-color) !important;
    color: #212529 !important;
    font-weight: 800 !important;
}

    .btn-warning:hover {
        background-color: #f5c000 !important;
        border-color: #f5c000 !important;
    }

.bg-primary-custom {
    color: #fff !important;
    background-color: #086ad8 !important;
}
.bg-custom-1 {
    color: #fff !important;
    background-color: #25283D !important;
}

.bg-custom-2 {
    color: #000 !important;
    background-color: #f8f8f8 !important;
}

.bg-custom-3 {
    background-color: #454545 !important;
}

.bg-custom-4 {
    background-color: #002fa6;
    background-image: url('../img/banner1-3.webp');
    background-repeat: no-repeat;
    background-position: left bottom;
}

.bg-custom-5 {
    background-color: #f6f2ed !important;
}

.bg-custom-6 {
    background-color: #eff3f8 !important;
    background-image: url('../img/banner1-6.webp') !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.hero-section {
    background-color: transparent;
    background: url('../img/banner1-1.webp'); /* Replace with a high-res image */
    background-size: cover;
    background-position: center;
    height: 100vh;
}

/* Hero Section */
.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.custom-boxshadow {
    box-shadow: rgba(43, 52, 59, 0.1) 0px 0px 15px 0px, rgba(43, 52, 59, 0.1) 0px 0px 0px !important;
}

.br-15 {
    border-radius: 15px !important;
}

.text-dark-custom {
    color: #001746 !important;
    
}

.text-muted-custom {
    color: #5e7582 !important;
}

.text-custom-primary {
    color: #001746 !important;
}

.text-muted2 {
    color: #696969 !important;
}

.accent-button {
    background: linear-gradient(to right, #00c6ff, #0072ff);
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}

.icon-gradient {
    /* Apply similar gradient to SVG icons if possible, or use one of the solid accent colors */
    color: #0072ff; /* Fallback for solid color */
    background: linear-gradient(to right, #00c6ff, #0072ff);
}

.nav-link {
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.18;
}

.btn-primary {
    background-color: #086ad8 !important;
    border-radius: 5px !important;
    border: 1px solid #086AD8 !important;
    font-weight: 500 !important;
    letter-spacing: 0em;
}

    .btn-primary:hover {
        background-color: #0561ca !important;
        border: 1px solid #0561ca !important;
    }

.btn-custom-primary {
    color: #fff !important;
    background-color: #d2a98e !important;
    border-radius: 5px !important;
    border: 1px solid #d2a98e !important;
    font-weight: 600 !important;
    letter-spacing: 0em;
}

    .btn-custom-primary:hover {
        background-color: #0561ca !important;
        border: 1px solid #0561ca !important;
    }

.section-sub-title {
    color: #ababab;
    font-size: 14px;
    letter-spacing: 3px;
    text-transform: uppercase;
    line-height: 1.43;
    margin-top: -5px;
}

.heading {
    color: #333333;
    font-family: "Inter", sans-serif;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
    line-height: 1.3;
}

.text-primary {
    color: #086ad8 !important;
}

.text-custom-1 {
    color: #333333 !important;
}

.text-custom-2 {
    color: #696969 !important;
    font-weight: 400 !important;
}

.text-custom-3 {
    color: #d2a98e !important;
}

.fs14 {
    font-size: 14px !important;
}

.fs15 {
    font-size: 15px !important;
}

.fs18 {
    font-size: 18px !important;
}

.fs20 {
    font-size: 20px !important;
}

.fs48 {
    font-size: 48px;
}

.cta-bg-image_one {
    background-color: #454545;
    background-image: url('../img/banner1-2.webp');
    background-repeat: no-repeat;
    background-position: top 35% right -68px;
}


.home-tab .nav-tabs .nav-item .nav-link {
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    color: #212121;
    padding: 12px 14px;
    border: none;
    border-right: 1px solid #dee2e6;
    background: transparent;
}

.breadcrumb-area {
    padding-top: 114px;
    padding-bottom: 114px;
    background-color: #f6f2ed;
    background-repeat: no-repeat;
    background-position: center center;
    border-bottom-width: 0px;
    padding-top: 136px;
    padding-bottom: 131px;
    background-size: cover;
    z-index: 3;
    position: relative;
    background-image: url('../img/banner1-4.webp');
}

@media only screen and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .breadcrumb-area {
        padding-top: 80px;
        padding-bottom: 80px;
    }
}

.mycard {
    background: #fff !important;
    border-radius: 5px !important;
}

.feature-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    border: none !important;
    border-radius: 15px !important;
}

    .feature-card:hover {
        transform: translateY(-5px) !important;
        box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
    }

.modern-number-01 span.mark-text {
    font-size: 180px;
    line-height: 0.8;
    font-weight: 900;
    margin: 0 5px -5px -5px;
    color: #d2a98e;
}

.modern-number-01 h2 {
    position: relative !important;
    font-size: 12px !important;
    line-height: 2em !important;
    letter-spacing: 2px !important;
    color: #ababab !important;
    text-transform: uppercase !important;
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: end !important;
    -webkit-align-items: flex-end !important;
    -ms-flex-align: end !important;
    align-items: flex-end !important;
}

.about-card {
    position: relative !important;
    background: #fff !important;
    border-radius: 5px !important;
    -webkit-box-shadow: 0 0 20px rgba(51, 51, 51, 0.1) !important;
    box-shadow: 0 0 20px rgba(51, 51, 51, 0.1) !important;
    -webkit-transition: all 0.3s ease-in-out !important;
    -o-transition: all 0.3s ease-in-out !important;
    transition: all 0.3s ease-in-out !important;
    -webkit-transform: translateY(0px) !important;
    -ms-transform: translateY(0px) !important;
    transform: translateY(0px) !important;
}
.badge-success {
    background: #def2d0;
    color: #245900;
}

.badge-warning {
    background: #f9f1c8 !important;
    color: #5e4f00 !important;
}
@media only screen and (max-width: 767px) {
    .modern-number-01 span.mark-text {
        font-size: 140px !important;
    }
}

.modern-number-01 h3 {
    margin-top: 25px;
    font-size: 38px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .modern-number-01 h3 {
        font-size: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .modern-number-01 h3 {
        font-size: 28px;
    }
}

@media only screen and (max-width: 767px) {
    .modern-number-01 h3 {
        font-size: 24px;
    }
}
