/*
overview
1. header
2. 
*/

/*header*/
.fixed-top {
    background: rgba(0, 0, 0, 1) !important;
    transition: all 0.3s ease-in-out;

}


#navLogo {
    transition: height 0.3s ease-in-out;
}

.navbar-scrolled {
    padding: 10px 0;
    background: rgba(0, 0, 0, 1) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 20px rgba(0, 0, 0, 1);
}

.nav-link {
    padding: 0 1rem;
    font-family: var(--base-font-family);
    color: #fff;
}

.skip-link {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffd700;
    color: #000;
    padding: 5px 16px;
    font-weight: 700;
    z-index: 10000;
    border-radius: 0;
    text-decoration: none;
    transition: top 0.3s ease;
    text-align: center;
}

.skip-link:focus {
    top: 0;
}

@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: .75rem;
        padding-left: .75rem;
    }
}

/*stock market advisory*/

.advisory-hero-banner .content-box h1 {
    font-size: var(--hero-heading-font-size);
    font-weight: var(--font-weight-bolder);
    font-family: var(--heading-font-family);
    color: var(--white-color);
    line-height: 1.2;
    padding-bottom: 16px;
}

@media screen and (max-width: 575px) {
    .advisory-hero-banner .content-box h1 {
        font-size: 28px !important;
    }
}

.style-h2 {
    font-size: var(--sub-heading-font-size);
    font-weight: var(--font-weight-normal);
    font-family: var(--base-font-family);
    color: var(--white-color);
    line-height: var(--heading-line-height) 1.5em;
}

@media screen and (max-width: 575px) {
    .style-h2 {
        font-size: 18px !important;
    }
}

.advisory-counter-section .counter-box h3 {
    font-size: var(--counter-font-size);
    line-height: var(--counter-line-height);
    font-weight: var(--font-weight-bolder);
    color: var(--primary-color);
    font-family: var(--territory-font-family);
}

@media screen and (max-width: 1024px) {
    @media screen and (max-width: 575px) {
        .advisory-counter-section .counter-box h3 {
            font-size: var(--heading-font-size) !important;
        }
    }
}

.advisory-counter-section .counter-box h4 {
    font-size: var(--counter-text-font-size);
    line-height: var(--base-line-height);
    font-weight: var(--font-weight-normal);
    color: var(--white-color);
    font-family: var(--base-font-family);
}

.best-stock-market-section h2 {
    font-size: 42px;
    font-family: 'Manrope';
    font-weight: 800;
    color: var(--primary-color);
    margin: 0;
    padding-bottom: 30px;
}

@media screen and (max-width: 575px) {
    .best-stock-market-section h2 {
        font-size: 28px;
    }
}

.best-stock-market-section .card h3 {
    font-size: var(--image-box-font-size);
    font-weight: var(--font-weight-large);
    font-family: var(--heading-font-family);
    color: var(--white-color);
    margin: 0;
    padding: 26px 0 16px;
}

.best-stock-market-section h4 {
    font-size: 26px;
    font-family: 'Manrope';
    font-weight: 800;
    color: var(--primary-color);
    margin: 0;
    padding-bottom: 30px;
}

.our-app-different-section h1 {
    font-size: var(--hero-heading-font-size);
    font-weight: var(--font-weight-bold);
    font-family: var(--base-font-family);
    color: var(--primary-color);
    margin: 0;
}

@media screen and (max-width: 1024px) {
    .our-app-different-section h1 {
        font-size: var(--hero-heading-font-size);
        font-weight: var(--font-weight-bold);
        font-family: var(--base-font-family);
        color: var(--primary-color);
        margin: 0;
    }
}

.our-app-different-section h2 {
    font-size: var(--counter-text-font-size);
    font-weight: var(--font-weight-normal);
    font-family: var(--base-font-family);
    color: var(--white-color);
    margin: 0;
    margin-bottom: 26px;
    text-align: left;
    font-weight: 700;
}

.our-app-different-section h3 {
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    font-family: var(--base-font-family);
    color: var(--white-color);
    margin: 0;
}


/* Professional Typography for Legibility (WCAG 2.1) */
.disclosure-item p {
    line-height: 1.6;
    font-size: 1.05rem;
    color: #ffffff;
    /* Ensure this meets 4.5:1 contrast against your background */
    margin-bottom: 15px;
}

.disclosure-list {
    padding-left: 20px;
    margin-bottom: 20px;
}

.disclosure-list li {
    margin-bottom: 10px;
    color: #ffffff;
}

/* Semantic spacing */
.disclosure-item h2 {
    margin-top: 30px;
    margin-bottom: 15px;
    font-weight: 600;
}


.nav-link:focus,
.nav-link:hover {
    color: var(--bs-primary);
}


:root {
    --bs-primary: #ffdb08;
    --primary-contrast-dark: #000000;
    /* For text inside yellow buttons */
}

/* IAAP: High-visibility buttons */
.btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: var(--primary-contrast-dark) !important;
    /* Black text on yellow background */
    font-weight: 700;
}

/* WCAG 2.1: Interaction States */
.btn-primary:hover,
.btn-primary:focus {
    background-color: #e5c507;
    /* Slightly darker gold to show state change */
    border-color: #e5c507;
    outline: 3px solid #ffffff;
    /* Contrast ring for keyboard users */
    outline-offset: 2px;
}

/* Headings and Emphasis */
.text-primary,
.best-stock-market-section h2 {
    color: var(--bs-primary) !important;
}

/* Accessibility: Selection color */
::selection {
    background: var(--bs-primary);
    color: var(--primary-contrast-dark);
}


.nav-link {
    color: #FFFFFF !important;
    /* White text provides maximum contrast (21:1) */
    font-weight: 600;
}

/* Use your primary yellow (#ffdb08) only for the 'Active' state or Hover */
.nav-link.active,
.nav-link:hover {
    color: #ffdb08 !important;
}

.our-app-different-section {
    background-color: var(--background-color) !important;
    padding-top: 80px;
    padding-bottom: 80px;
}

.whatsapp-fixed {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    background-color: #25D366;
    /* WhatsApp Brand Green */
    color: #FFFFFF;
    /* High Contrast White */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
    z-index: 9999;
    transition: transform 0.3s ease;
}

.whatsapp-fixed:hover,
.whatsapp-fixed:focus {
    transform: scale(1.1);
    outline: 3px solid #ffdb08;
    /* Your Brand Yellow as focus indicator */
    outline-offset: 2px;
}

/* Ensure the icon is centered */
.whatsapp-fixed i {
    line-height: 0;
}

.footer-phone-style {
    color: #fff !important;
}