@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600;700;800;900&display=swap');

/* work-sans-300 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/work-sans-v18-latin-300.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-300.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-300.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-300.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-300.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-300.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

/* work-sans-regular - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/work-sans-v18-latin-regular.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-regular.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-regular.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-regular.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-regular.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-regular.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

/* work-sans-500 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/work-sans-v18-latin-500.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-500.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-500.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-500.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-500.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-500.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

/* work-sans-600 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/work-sans-v18-latin-600.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-600.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-600.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-600.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-600.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-600.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

/* work-sans-700 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/work-sans-v18-latin-700.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-700.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-700.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-700.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-700.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-700.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

/* work-sans-800 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/work-sans-v18-latin-800.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-800.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-800.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-800.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-800.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-800.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

/* work-sans-900 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/work-sans-v18-latin-900.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/work-sans-v18-latin-900.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('../fonts/work-sans-v18-latin-900.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('../fonts/work-sans-v18-latin-900.woff') format('woff'),
    /* Modern Browsers */
    url('../fonts/work-sans-v18-latin-900.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('../fonts/work-sans-v18-latin-900.svg#WorkSans') format('svg');
    /* Legacy iOS */
}

* {
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}

:root {
    --themecolor: #005555;
    --themefontcolor: #585b6f;
    /* --txtblue: #3952f7; */
    /* --txtblue: #6576ff; */
    --txtblue: #00008c;
}

.btn-primary {
    background-color: var(--txtblue) !important;
}

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

.text-blue {
    color: #00204a;
}

body {
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
}

a {
    text-decoration: none;
    margin: 0;
    padding: 0;
}

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

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0px;
    padding: 0px;
}

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

.spacer {
    padding: 60px 0;
}

.theme_btn {
    transition: .3s;
}

    .theme_btn a {
        background-color: var(--themecolor);
    }

    .theme_btn:hover,
    .banner_text .btn:hover {
        transform: translateY(-5px);
    }

.row {
    margin: 0;
}

.sec_title {
    color: var(--txtblue);
    /* font-size: 16px; */
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.accordion-button:not(.collapsed) {
    background-color: transparent !important;
}

.accordion-button:focus {
    border-color: transparent !important;
}

/* ============================ header start ========================== */
/* #main-header1 {
     background-color: rgba(255, 255, 255, 0.4);
     -webkit-backdrop-filter: blur(5px);
     backdrop-filter: blur(5px);
} */
#main-header1 {
    position: absolute;
}

.nav-link {
    font-weight: 500;
}

    .nav-link:hover {
        color: var(--txtblue);
    }

.header {
    border-bottom: 1px solid rgba(138, 138, 138, 0.2);
}

.main_logo {
    width: 10%;
}

@media (max-width: 768px) {
    .main_logo {
        width: 20% !important;
    }

        .main_logo img {
            width: 100%;
            height: auto;
        }
}

@media (max-width: 576px) {
    .main_logo {
        width: 30% !important;
    }

        .main_logo img {
            width: 100%;
            height: auto;
        }

    #main-header1 {
        position: unset;
    }

    .spacer {
        padding: 40px 0;
    }

    .main-banner {
        height: auto;
    }
}


.main_logo a {
    display: block;
}

.main_menu a {
    color: var(--txtblue);
    padding: 20px 20px;
    display: inline-block;
    font-weight: 600;
}

.intro-hand i {
    color: var(--txtblue);
}

.into_sutra_prg {
    color: var(--themefontcolor);
    text-align: justify;
}

.sticky-header {
    position: fixed !important;
    top: 0;
    background-color: #ffffff !important;
    z-index: 9999;
}

/* ============================ header end ========================== */
.main-banner {
    height: 100vh;
}
/* =========================================== component section start ========================= */

.main-feature {
    position: relative;
}

.main-feature::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    /* background-image: url(../images/Services_bg.jpg); */
    opacity: 0.3;
}

.pricing-section {
    font-weight: 600;
}

.contact-section {
    font-family: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    background-color: rgba(194, 194, 194, 0.2);
}


.key-features-section {
    z-index: 2;
    padding: 70px 0;
    background: #1c2b46;
}

.section-title {
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 10px;
}

.section-subtitle {
    text-align: center;
    font-size: 17px;
    color: #b7c2d0;
    margin-bottom: 30px;
}

/* Card */
.feature-box {
    background: #ffffff;
    padding: 35px 28px;
    border-radius: 22px;
    text-align: center;
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.07);
    transition: all 0.3s ease;
    height: 100%;
}

    /* Hover effect */
    .feature-box:hover {
        /* transform: translateY(-6px); */
        box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
    }

    /* Icon box */
    .feature-box .icon {
        width: 70px;
        height: 70px;
        margin: 0 auto 20px;
        /* background: linear-gradient(135deg, #f3f6fc 0%, #f9f9ff 100%); */
        background-color: rgba(101, 118, 255, 0.2);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 42px;
        color: var(--txtblue);
        position: relative;
    }

    /* Title */
    .feature-box h3 {
        font-size: 20px;
        font-weight: 700;
        color: #111;
        margin-bottom: 12px;
    }

    /* Paragraph */
    .feature-box p {
        font-size: 15px;
        color: #555;
        line-height: 1.6;
    }

.summary-box {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 12px;
    border-left: 4px solid #0d6efd;
}

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

.summary-text {
    font-size: 16px;
    color: #444;
    line-height: 1.6;
}

.core-components-btn {
    padding: 10px 20px;
    /* background-color: var(--txtblue); */
    color: #fff;
    border: 1px solid #fff;
    border-radius: 8px;
    transition: 0.5s;
}

    .core-components-btn:hover {
        background-color: #fff;
        color: #1c2b46;
    }
/* =========================================== component section end ========================= */
/* =========================================== key feature section start ========================= */
.key-feature-section {
    background: #fff;
}

.feature-icon i {
    font-size: 12px;
    color: #fff;
    background-color: var(--txtblue);
    border-radius: 50%;
    border: 1px solid transparent;
    height: 20px;
    width: 20px;
    line-height: 20px;
    text-align: center;
}

.feature-image-box {
    background: #f4f7ff;
    padding: 40px;
    border-radius: 20px;
}

    .feature-image-box img {
        max-width: 80%;
    }

/* =========================================== key feature section end ========================= */


.sutra-section {
    font-family: "Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    background-color: rgba(194, 194, 194, 0.2);
}

.illustration-panel {
    background: linear-gradient(180deg, #f7fbff, #ffffff);
    border-radius: 14px;
}

.illustration-placeholder {
    width: 120px;
    height: 120px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(2, 6, 23, 0.06);
}

.accordion-button {
    font-weight: 600;
}

/* ===================================== footer =============================== */
.footer-logo {
    width: 40%;
}

.footer-link {
    color: #ccc;
    text-decoration: none;
    transition: 0.3s;
}

    .footer-link:hover {
        color: var(--txtblue);
        padding-left: 4px;
    }

.social-icon {
    display: inline-block;
    width: 38px;
    height: 38px;
    background: rgba(182, 182, 182, 0.2);
    margin-right: 8px;
    border-radius: 50%;
    text-align: center;
    line-height: 38px;
    font-size: 18px;
    color: #ddd;
    transition: 0.3s ease;
}

    .social-icon:hover {
        background: var(--txtblue);
        color: #fff;
    }

/* ================================= service page  ============================ */
#pricing .card {
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

    /* Hover effect */
    #pricing .card:hover {
        border: 2px solid var(--txtblue) !important;
        box-shadow: 0px 10px 28px rgba(0, 0, 0, 0.15);
    }

/* Button hover effect */
/* #pricing .card:hover .btn {
     transform: scale(1.05);
   } */



.sutra-intro-section {
    background: #f8f9fd;
}

.sutra-title {
    font-size: 32px;
    font-weight: 700;
    color: #1b1b2f;
    margin-bottom: 10px;
}

.sutra-line {
    width: 65px;
    height: 4px;
    border-radius: 6px;
    background: linear-gradient(90deg, #3952f7, #005555);
    margin-bottom: 25px;
}

.sutra-text {
    font-size: 16.5px;
    line-height: 1.8;
    color: #4b4b4b;
    margin-bottom: 15px;
}

.sutra-highlight {
    font-size: 18px;
    font-weight: 600;
    padding: 14px 18px;
    background: #ffffff;
    border-left: 5px solid #3952f7;
    border-radius: 8px;
    box-shadow: 0px 6px 18px rgba(0, 0, 0, 0.06);
    margin: 18px 0;
    color: #777;
}

    .sutra-highlight span {
        color: var(--txtblue);
    }

.sutra-image {
    width: 100%;
    border-radius: 18px;
    transition: 0.3s ease;
    box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.12);
}

@media(max-width:768px) {
    .sutra-title {
        font-size: 26px;
    }

    .sutra-text,
    .sutra-highlight {
        font-size: 14.5px;
    }

    .sutra-image {
        margin-top: 20px;
    }
}