/* ============================================================
   FinanceWiki.ai — Custom UI Overrides
   Separated from inline <style> for maintainability.
   ============================================================ */

/* -------- NAVBAR -------- */
.tf-header.header2 .header-inner {
    max-width: 1120px !important;
    padding: 8px 16px 8px 24px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(30px) !important;
    -webkit-backdrop-filter: blur(30px) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: 999px !important;
}

.tf-header .nav-menu-main {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.tf-header .nav-menu-main .item-link {
    color: #18181B !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    transition: color 0.2s ease !important;
    padding: 6px 10px !important;
    border-radius: 8px !important;
}

.tf-header .nav-menu-main .item-link:hover,
.tf-header .nav-menu-main .item-link.active {
    color: #FD3A25 !important;
    background: rgba(253, 58, 37, 0.06) !important;
}

/* -------- HERO SECTION -------- */
.section-hero .content-wrap .title {
    overflow: visible !important;
}

.section-hero .content-wrap .title .title1 {
    display: block !important;
    font-size: clamp(32px, 5.5vw, 72px) !important;
    line-height: 1.15 !important;
    letter-spacing: -1px !important;
}

.section-hero .content-wrap .title2 {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    flex-wrap: nowrap !important;
    margin-top: 4px !important;
}

.section-hero .content-wrap .title2 > .fw-semibold {
    font-size: clamp(32px, 5.5vw, 72px) !important;
    line-height: 1.15 !important;
    letter-spacing: -1px !important;
}

.section-hero .content-wrap .title-icon {
    position: relative !important;
    height: 80px !important;
    width: 255px !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

.section-hero .content-wrap .title-icon .box {
    width: 100% !important;
    height: 100% !important;
    border-radius: 999px !important;
}

.section-hero .content-wrap .title-icon .title-icon-wrap {
    width: 100% !important;
    height: 100% !important;
    overflow: visible !important;
}

.section-hero .content-wrap .text {
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #52525B !important;
    max-width: 680px !important;
    margin: 0 auto !important;
}

/* CTA Buttons */
.section-hero .bot-btns {
    display: flex !important;
    gap: 12px !important;
    justify-content: center !important;
    margin-top: 32px !important;
}

.section-hero .bot-btns .tf-btn {
    background: #09090B !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: 14px 32px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    border: none !important;
}

.section-hero .bot-btns .tf-btn-2 {
    background: #fff !important;
    color: #09090B !important;
    border: 1.5px solid #E4E4E7 !important;
    border-radius: 999px !important;
    padding: 14px 32px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

.section-hero .bot-btns .tf-btn:hover {
    background: #FD3A25 !important;
}

.section-hero .bot-btns .tf-btn-2:hover {
    border-color: #09090B !important;
}

/* -------- DISCLAIMER CARD -------- */
.disclaimer-card {
    background: #FFFFFF !important;
    border: 1.5px solid rgba(253, 58, 37, 0.25) !important;
    border-radius: 24px !important;
    padding: 32px 40px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.04) !important;
    margin-top: 20px !important;
    margin-bottom: 60px !important;
}

.disclaimer-card .disclaimer-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.disclaimer-card .disclaimer-badge .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #FD3A25;
    box-shadow: 0 0 8px rgba(253, 58, 37, 0.4);
    display: inline-block;
}

.disclaimer-card .disclaimer-badge strong {
    color: #FD3A25;
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 800;
}

.disclaimer-card .cn-text {
    color: #09090B;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
    margin-bottom: 12px;
}

.disclaimer-card .en-text {
    color: #71717A;
    font-size: 12px;
    line-height: 1.6;
    margin-bottom: 0;
    font-family: 'Roboto', monospace;
}

/* -------- ABOUT-US SECTION -------- */
.section-about-us {
    padding-top: 0 !important;
}

.section-about-us .heading-section .heading-title {
    font-size: clamp(28px, 4vw, 56px) !important;
    line-height: 1.15 !important;
}

/* -------- GRADIENT TEXT FIX (remove ghosting on CJK characters) -------- */
.heading-title.text-gradient-2,
.text-gradient-2 {
    background: linear-gradient(180deg, #18181B 0%, #3F3F46 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    -webkit-text-stroke: 0px transparent !important;
    background-clip: text !important;
}

.text-gradient-1 {
    background: linear-gradient(180deg, #09090B 10%, #3F3F46 90%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    -webkit-text-stroke: 0px transparent !important;
    background-clip: text !important;
}

.text-gradient-3 {
    background: linear-gradient(180deg, #09090B 0%, #52525B 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    -webkit-text-stroke: 0px transparent !important;
    background-clip: text !important;
}

/* -------- SECTION HEADINGS -------- */
.heading-section .heading-sub {
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
}

/* -------- FEATURED WORKS -------- */
.featured-works-item .heading {
    font-size: clamp(20px, 2.5vw, 32px) !important;
    line-height: 1.3 !important;
}

/* -------- PRICING SECTION -------- */
#pricing .pricing-item {
    border-radius: 24px !important;
}

/* -------- CONTACT SECTION -------- */
.form-contact input,
.form-contact textarea {
    border-radius: 12px !important;
}

.form-contact .tf-btn {
    border-radius: 999px !important;
}

/* -------- FOOTER -------- */
footer .footer-image {
    display: none !important;
}

footer .footer-content .title {
    font-size: clamp(20px, 2.5vw, 28px) !important;
}

/* -------- MOBILE RESPONSIVE -------- */
@media (max-width: 991px) {
    .tf-header.header2 .header-inner {
        max-width: 100% !important;
        padding: 8px 16px !important;
        border-radius: 20px !important;
    }

    .section-hero .content-wrap .title .title1 {
        font-size: 36px !important;
    }

    .section-hero .content-wrap .title2 {
        flex-wrap: wrap !important;
        gap: 12px !important;
    }

    .section-hero .content-wrap .title2 > .fw-semibold {
        font-size: 36px !important;
    }

    .section-hero .content-wrap .title-icon {
        height: 56px !important;
        width: 178px !important;
        transform: scale(0.7) !important;
        transform-origin: center center !important;
    }

    .disclaimer-card {
        padding: 24px !important;
        border-radius: 20px !important;
    }

    .disclaimer-card .cn-text {
        font-size: 13px !important;
    }

    .disclaimer-card .en-text {
        font-size: 11px !important;
    }
}

@media (max-width: 767px) {
    .section-hero .content-wrap .title .title1 {
        font-size: 28px !important;
    }

    .section-hero .content-wrap .title2 > .fw-semibold {
        font-size: 28px !important;
    }

    .section-hero .content-wrap .title-icon {
        height: 48px !important;
        width: 153px !important;
        transform: scale(0.6) !important;
        transform-origin: center center !important;
    }

    .section-hero .bot-btns {
        flex-direction: column !important;
        align-items: center !important;
    }

    .section-hero .bot-btns .tf-btn,
    .section-hero .bot-btns .tf-btn-2 {
        width: 100% !important;
        max-width: 280px !important;
    }

    .disclaimer-card {
        padding: 20px !important;
        border-radius: 16px !important;
        margin-bottom: 40px !important;
    }
}

/* -------- FOCUS STATES (Accessibility) -------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 2px solid #FD3A25 !important;
    outline-offset: 2px !important;
}

/* -------- SCROLL-MORE LINK -------- */
.scroll-more {
    margin-top: 40px !important;
}

/* -------- MOBILE MENU FIX -------- */
.offcanvas-menu .canvas_foot .left a {
    color: #A1A1AA !important;
}