* {
    font-family: "Wix Madefor Text", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

/*********** font family ************/

.wix-madefor-display-regular {
    font-family: "Wix Madefor Display", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
.wix-madefor-display-semibold {
    font-family: "Wix Madefor Display", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.wix-madefor-text-regular {
    font-family: "Wix Madefor Text", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.wix-madefor-text-semibold {
    font-family: "Wix Madefor Text", sans-serif;
    font-optical-sizing: auto;
    font-weight:600;
    font-style: normal;
}

.familjen-grotesk-700 {
    font-family: "Familjen Grotesk", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}
/************** Font Size Variants *******************/
.font-xs {
    font-size: 0.75rem; /* 12px */
}

.font-sm {
    font-size: 0.875rem; /* 14px */
}

.font-md {
    font-size: 1rem; /* 16px */
}

.font-lg {
    font-size: 1.125rem; /* 18px */
}

.font-xl {
    font-size: 1.25rem; /* 20px */
}

.font-2xl {
    font-size: 1.5rem; /* 24px */
}

.font-3xl {
    font-size: 1.875rem; /* 30px */
}

.font-4xl {
    font-size: 2.25rem; /* 36px */
}
.font-4xl-lg{
    font-size:40px;
}
.font-5xl {
    font-size: 3rem; /* 48px */
}

.font-6xl {
    font-size: 4rem; /* 64px */
}

.font-7xl {
    font-size: 5rem; /* 64px */
}

.font-8xl {
    font-size: 6rem; /* 64px */
}
/*==================== colour ===============*/
.themePrimary {
    color: #12142B;
}

.themePrimary-bg {
    background-color: #12142B;
}

.themeSecondary {
    color: #6387C5;
}

.themeSecondary-bg {
    background-color: #6387C5;
}

.colour-blue {
    color: #3551BF;
}

.bg-grey {
    background-color: #EDEDED;
}
/*================ custom clases =========================*/
.l-p {
    letter-spacing: -0.03em;
}
.mt-6{
    margin-top:150px;
}
.w-90 {
    width: 90% !important;
}
.w-custom-75{
    width: 75%;
}
.custom-btn {
    background: #ffffff;
    border: none;
    padding: 8px 5px 8px 25px;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition:all 0.3s ease-in;
}

    .custom-btn .arrow-icon {
        background: #000;
        color: #fff;
        padding: 10px 14px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease-in;
    }
    .custom-btn:hover{
        background:#000;
        color:#fff;
    }
    .custom-btn:hover .arrow-icon{
        background:#fff;
        color:#000;
    }
/*======================= layout page ===========================*/
/*----------header---------------*/
.logo{
    height:70px;
}
.nav-item .nav-link {
    color: #fff;
}
    .nav-item .nav-link:hover {
        color: #6387C5;
    }
    .nav-item .nav-link:active{
        color:#6387C5;
    }
    .overlay-menu {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: #111;
        color: white;
        display: none;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        z-index: 999;
        transition: all 0.3s ease;
    }

    .overlay-menu.show {
        display: flex;
    }

.overlay-links {
    list-style: none;
    padding: 0;
    text-align: center;
}

    .overlay-links li {
        margin: 20px 0;
    }

        .overlay-links li a {
            color: white;
            font-size: 1.5rem;
            text-decoration: none;
            transition: color 0.3s;
        }

            .overlay-links li a:hover {
                color: #6387C5;
            }

.close-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 2rem;
    background: none;
    border: none;
    color: white !important;
    cursor: pointer;
}

/*----------footer ------------*/
.rbfa-footer {
    background-color: #111111;
    border-radius: 35px 35px 0 0;
    color: #DEDEDE;
}

.footer-logo {
    height: 180px;
}

.footer-title {
    font-size: 17px;
    letter-spacing: 1px;
    margin-bottom:15px;
    text-transform:uppercase;
}

.footer-input {
    background: transparent;
    border: none;
    border-bottom: 1px solid #666;
    border-radius: 0;
    color: white;
}

    .footer-input:focus {
        box-shadow: none;
        border-bottom: 1px solid #fff;
    }

.footer-links {
    list-style: none;
    padding: 0;
}

    .footer-links li {
        margin-bottom: 8px;
    }

    .footer-links a {
        color: #DEDEDE !important;
        text-decoration: none;
    }

        .footer-links a:hover {
            color: #6387C5 !important;
        }

.custom-square {    
    background-color:transparent !important;
    border: 0.3px solid #fff !important;
    border-radius: 0 !important; 
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}
    .custom-square:checked {
        background-color: #6387C5 !important; 
    }

/*======================================= Home Page =======================*/
.hero-section {
    height: 90vh;
    background-image: url('../images/home-banner.png');
    background-repeat: no-repeat;
    background-size: cover;
    color: white;
}

.strip {
    background-color:#fff;
    height:50px;
    margin-top: -20px;
    border-radius: 35px 35px 0 0 ;
}

.left-sticky {
    position: sticky;
    top: 180px;
}

/* WRAPPER FOR SCROLL */
.cards-wrapper {
    position: relative;
}

/* CARD BASE */
.wix-card {
    border-radius: 32px;
    padding: 60px 50px;
    min-height: 430px;
    position: sticky;
    top: 180px;
    margin-bottom: 40px; /* GAP between stacks */
    opacity: 0;
    transform: translateY(60px);
    transition: all 0.6s ease;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.card-01 {
    background: #12142B; 
    color:#fff;
    z-index: 1;
}
.card-02 {
    background: #6387C5;
    color: #000;
    z-index: 2;
}
.card-03 {
    background: #12142B;
    color: #fff;
    z-index: 3;
}
.card-04 {
    background: #6387C5;
    color: #000;
    z-index: 4;
}
.card-05 {
    background: #EDEDED;
    color: #000;
    z-index: 4;
}

/* SHOW ANIMATION */
.wix-card.show {
    opacity: 1;
    transform: translateY(0);
}

.wix-card-v2 {
    border-radius: 32px;
    padding: 60px 50px;
    min-height: 430px;
    position: sticky;
    top: 180px;
    margin-bottom: 40px; /* GAP between stacks */
    transform: translateY(60px);
    transition: all 0.6s ease;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Contact Form Style Starts */
.contact-form-wrapper {
    max-width: 100%;
    margin: 0 auto;
}

.contact-form .form-label {
    color: #171717;
    font-weight: 500;
    margin-bottom: 0.35rem;
}

.contact-form .form-control {
    border-radius: 999px; /* “enough rounded” */
    border: 1px solid #171717;
    box-shadow: none;
    background-color:transparent;
    padding: 0.55rem 1rem;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.contact-form textarea.form-control {
    border-radius: 18px; /* softer round for textarea */
    min-height: 120px;
    resize: vertical;
}

.contact-form .form-control:hover,
.contact-form .form-control:focus {
    background-color: #92ABD7;
    outline: none;
    border-color: #171717;
}

.btn-contact {
    background-color: #171717;
    color: #ffffff;
    border-radius: 999px;
    border: 1px solid #171717;
    padding: 0.6rem 2rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

    .btn-contact:hover {
        background-color: #ffffff;
        color: #171717;
    }

