/* =========================================================
   EC Grown – Custom Brand Theme
   Logo Colors: Gold #D4A200, Deep Red #9B1C1C, Dark Navy #0A0A1A
   ========================================================= */

:root {
    --theme-color:     #D4A200;       /* Gold – primary accent */
    --theme-color-2:   #F5C518;       /* Bright Gold – dark home accent */
    --secondary-color: #0A0A1A;       /* Deep navy-black background */
    --red-accent:      #9B1C1C;       /* Deep red from logo ring */
    --red-light:       #C41E1E;       /* Lighter red hover */
    --gold-dark:       #A07800;       /* Darker gold for hover/depth */
    --gold-glow:       rgba(212,162,0,0.18);
    --text-color:      #b0b8c8;
    --title-color:     #ffffff;
    --text-font:       "IBM Plex Sans", sans-serif;
    --title-font:      "Ubuntu", sans-serif;
}

/* ── Body & Background ──────────────────────────────────── */
body,
.boxed_wrapper.dark_home {
    background-color: #0A0A1A;
    color: var(--text-color);
}

/* ── Section alternating backgrounds ──────────────────────*/
.banner-bg         { background: linear-gradient(135deg, #0A0A1A 0%, #11102A 60%, #1a0a0a 100%); }
.ab-bg             { background: linear-gradient(135deg, #0f0f22 0%, #160909 100%); }

/* ── Headings ──────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 { color: #ffffff; }

h2 span,
.sec-title h2 span,
.content_block_six .content-box h2 span,
.banner-style-four .content-box h2 span {
    background: linear-gradient(90deg, #D4A200, #F5C518);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ── Subtitle badge ─────────────────────────────────────── */
.sec-title .sub-title,
.banner-style-four .sub-title,
.dark_home .sec-title .sub-title {
    color: var(--theme-color-2);
    border: 1px solid var(--theme-color);
    background: transparent;
    padding: 4px 16px;
    border-radius: 20px;
    display: inline-block;
}
.sec-title .sub-title:before,
.banner-style-four .sub-title:before,
.dark_home .sec-title .sub-title:before {
    background: var(--theme-color);
}
.sec-title .sub-title:after,
.banner-style-four .sub-title:after,
.dark_home .sec-title .sub-title:after {
    border-color: var(--theme-color);
}

/* ── Primary Buttons ────────────────────────────────────── */
.theme-btn.btn-one,
.dark_home .theme-btn.btn-one {
    background: linear-gradient(90deg, #9B1C1C 0%, #D4A200 100%);
    border: none;
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
}
.theme-btn.btn-one:hover,
.dark_home .theme-btn.btn-one:hover {
    background: linear-gradient(90deg, #D4A200 0%, #9B1C1C 100%);
    box-shadow: 0 0 20px rgba(212,162,0,0.45);
}

/* Secondary / outline button */
.theme-btn.btn-two {
    background: transparent;
    border: 2px solid var(--theme-color);
    color: var(--theme-color);
    font-weight: 600;
    transition: all 0.3s ease;
}
.theme-btn.btn-two:hover {
    background: var(--theme-color);
    color: #0A0A1A;
}
.dark_home .theme-btn.btn-two:before,
.dark_home .theme-btn.btn-two:after {
    background: var(--theme-color);
}
.dark_home .theme-btn.btn-two:hover {
    border-color: var(--theme-color);
    color: #0A0A1A;
}

/* ── Navigation ─────────────────────────────────────────── */
.main-header {
    background: rgba(10, 10, 26, 0.97);
    border-bottom: 1px solid rgba(212,162,0,0.15);
    backdrop-filter: blur(8px);
}
.main-menu .navigation > li > a {
    color: #d0d0e0;
    font-weight: 500;
    transition: color 0.3s;
}
.main-menu .navigation > li.current > a,
.main-menu .navigation > li:hover > a {
    color: var(--theme-color);
}

/* ── Sticky header background ───────────────────────────── */
.sticky-header {
    background: rgba(10, 10, 26, 0.99) !important;
    border-bottom: 2px solid var(--theme-color);
}

/* ── Cards / Blocks ─────────────────────────────────────── */
.process-block-one .inner-box,
.trading-block-one .inner-box,
.funfact-block-two .inner-box,
.news-block-one .inner-box {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(212,162,0,0.12);
    border-radius: 12px;
    transition: all 0.35s ease;
}
.process-block-one .inner-box:hover,
.news-block-one .inner-box:hover {
    border-color: var(--theme-color);
    box-shadow: 0 0 28px rgba(212,162,0,0.18);
    transform: translateY(-4px);
}
.process-block-one .inner-box:before,
.dark_home .process-block-one .inner-box:before {
    background: linear-gradient(135deg, #9B1C1C 0%, #D4A200 100%);
}

/* ── Process count numbers ──────────────────────────────── */
.process-block-one .inner-box .count-text {
    background: linear-gradient(135deg, #9B1C1C, #D4A200);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 52px;
    font-weight: 700;
}

/* ── Tab buttons ────────────────────────────────────────── */
.trading-style-six .tab-btns li.active-btn,
.trading-style-six .tab-btns li:hover,
.dark_home .trading-style-six .tab-btns li.active-btn,
.dark_home .trading-style-six .tab-btns li:hover {
    background: linear-gradient(90deg, #9B1C1C, #D4A200);
    color: #ffffff;
    border-radius: 6px;
}

.trading-style-four .tab-btns li,
.dark_home .trading-style-four .tab-btns li {
    background: rgba(212,162,0,0.08);
    border: 1px solid rgba(212,162,0,0.2);
    border-radius: 10px;
    transition: all 0.3s;
}
.dark_home .trading-style-four .tab-btns li.active-btn,
.dark_home .trading-style-four .tab-btns li:hover {
    background: linear-gradient(135deg, #9B1C1C, #D4A200);
    border-color: transparent;
}
.dark_home .trading-style-four .tab-btns li.active-btn h4,
.dark_home .trading-style-four .tab-btns li:hover h4,
.dark_home .trading-style-four .tab-btns li.active-btn .icon-box,
.dark_home .trading-style-four .tab-btns li:hover .icon-box {
    color: #ffffff;
}

/* Platform tabs (About/Mission/Vision) */
.platform-section .tab-btns li.active-btn,
.platform-section .tab-btns li:hover {
    background: linear-gradient(90deg, #9B1C1C, #D4A200);
    color: #ffffff;
    border-radius: 8px;
}

/* ── Progress bars ──────────────────────────────────────── */
.progress-box .bar { background: rgba(255,255,255,0.08); }
.progress-box .bar .bar-inner,
.dark_home .progress-box .bar .bar-inner {
    background: linear-gradient(90deg, #9B1C1C, #D4A200);
}

/* ── Trade button in table ──────────────────────────────── */
.trading-style-six .table-outer .table-content li.table-data .btn-box a {
    color: var(--theme-color);
    border: 1px solid var(--theme-color);
    border-radius: 4px;
    padding: 4px 14px;
    font-weight: 600;
    transition: all 0.3s;
}
.trading-style-six .table-outer .table-content li.table-data .btn-box a:hover {
    background: linear-gradient(90deg, #9B1C1C, #D4A200);
    color: #fff;
    border-color: transparent;
}

/* ── Funfact counter ────────────────────────────────────── */
.funfact-block-two .inner-box .count-outer,
.funfact-block-one .inner-box .count-outer {
    color: #D4A200;
    -webkit-text-fill-color: #D4A200;
    font-size: 48px;
    font-weight: 700;
}

/* ── News section ───────────────────────────────────────── */
.news-block-one .inner-box .post-date,
.dark_home .news-block-one .inner-box .post-date {
    color: var(--theme-color);
}
.news-block-one .inner-box h3 a,
.dark_home .news-block-one .inner-box h3 a {
    color: #ffffff;
    transition: color 0.3s;
}
.news-block-one .inner-box h3 a:hover,
.dark_home .news-block-one .inner-box h3 a:hover {
    color: var(--theme-color);
}
.news-block-one .inner-box .link a,
.dark_home .news-block-one .inner-box .link a {
    color: var(--theme-color);
    font-weight: 600;
}
.news-block-one .inner-box .link a:hover {
    color: var(--theme-color-2);
}

/* ── Scroll to top ──────────────────────────────────────── */
.scroll-to-top .scroll-top-inner path { stroke: var(--theme-color); }
.dark_home .scroll-to-top::after { background: var(--theme-color); }

/* ── Footer ─────────────────────────────────────────────── */
.main-footer {
    background: linear-gradient(180deg, #0D0B1E 0%, #0A0A1A 100%);
    border-top: 1px solid rgba(212,162,0,0.2);
}
.main-footer .links-widget .links-list li a {
    color: #9999bb;
    transition: color 0.3s;
}
.main-footer .links-widget .links-list li a:hover,
.dark_home .main-footer .links-widget .links-list li a:hover {
    color: var(--theme-color);
}
.main-footer .widget-title h3 {
    color: var(--theme-color-2);
    border-bottom: 2px solid rgba(212,162,0,0.3);
    padding-bottom: 8px;
}
.footer-bottom { background: #060610; border-top: 1px solid rgba(212,162,0,0.12); }
.footer-bottom .bottom-inner p { color: #888899; }
.footer-bottom .bottom-inner p a,
.dark_home .footer-bottom .bottom-inner p a { color: var(--theme-color); }
.main-footer .social-links li a:hover,
.dark_home .main-footer .social-links li a:hover {
    background: linear-gradient(135deg, #9B1C1C, #D4A200);
    color: #fff;
}

/* ── Gold divider line utility ──────────────────────────── */
.gold-divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #9B1C1C, #D4A200);
    border-radius: 2px;
    margin: 0 auto 20px;
}

/* ── Mobile nav toggler ─────────────────────────────────── */
.menu-area .mobile-nav-toggler .icon-bar,
.dark_home .menu-area .mobile-nav-toggler .icon-bar {
    background: var(--theme-color);
}

/* ── List bullets ───────────────────────────────────────── */
.list-style-one li:before,
.dark_home .list-style-one li:before {
    background: linear-gradient(135deg, #9B1C1C, #D4A200);
}

/* ── TradingView widget container glow ──────────────────── */
.tradingview-widget-container {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 0 30px rgba(212,162,0,0.12);
}

/* ── Image float animation ─────────────────────────────── */
.float-bob-y { animation: floatBob 4s ease-in-out infinite alternate; }
@keyframes floatBob {
    0%   { transform: translateY(0); }
    100% { transform: translateY(-18px); }
}

/* ── Section backgrounds alternating ──────────────────────*/
section { position: relative; }
.process-section.ab-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 80% 50%, rgba(155,28,28,0.07) 0%, transparent 65%);
    pointer-events: none;
}
.banner-style-four::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 20% 60%, rgba(212,162,0,0.06) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}
.banner-style-four .auto-container { position: relative; z-index: 1; }

/* ── Glow border on hover for feature boxes ────────────── */
.trading-block-three .inner-box {
    border: 1px solid rgba(212,162,0,0.1);
    border-radius: 12px;
    transition: all 0.3s;
}
.trading-block-three .inner-box:hover {
    border-color: var(--theme-color);
    box-shadow: 0 0 20px var(--gold-glow);
}
.trading-block-three .inner-box .icon-box {
    color: var(--theme-color);
}

/* ── Scroll bar styling ─────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0A0A1A; }
::-webkit-scrollbar-thumb { background: linear-gradient(#9B1C1C, #D4A200); border-radius: 3px; }


/* ═══════════════════════════════════════════════════════════
   BUG FIXES — added after initial deployment review
   ═══════════════════════════════════════════════════════════ */

/* FIX 1: Market table — override white background from trading.css */
.dark_home .trading-style-six .tabs-content,
.trading-style-six .tabs-content {
    background: rgba(255, 255, 255, 0.03) !important;
    box-shadow: 0 0 0 1px rgba(212, 162, 0, 0.12) !important;
    border-radius: 12px !important;
}

.dark_home .trading-style-six .table-outer .table-content li,
.trading-style-six .table-outer .table-content li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    background: transparent !important;
}

.dark_home .trading-style-six .table-outer .table-content li.table-title,
.trading-style-six .table-outer .table-content li.table-title {
    background: rgba(212, 162, 0, 0.05) !important;
    border-bottom: 1px solid rgba(212, 162, 0, 0.15) !important;
}

.dark_home .trading-style-six .table-outer .table-content li.table-title p {
    color: #D4A200 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: 0.5px !important;
}

.dark_home .trading-style-six .table-outer .table-content li.table-data h6 {
    color: #ffffff !important;
}

.dark_home .trading-style-six .table-outer .table-content li.table-data .single-item span {
    color: #8888aa !important;
    font-size: 12px !important;
}

/* FIX 2: Odometer digits color in dark home */
.dark_home .funfact-block-two .odometer,
.dark_home .funfact-block-two .odometer .odometer-digit,
.dark_home .funfact-block-two .odometer .odometer-digit .odometer-digit-inner,
.dark_home .funfact-block-two .odometer .odometer-digit .odometer-digit-inner span {
    color: #D4A200 !important;
    background: transparent !important;
}

/* Ensure count-outer (wrapper around odometer + suffix) is gold */
.funfact-block-two .inner-box .count-outer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 48px;
    font-weight: 800;
    line-height: 1;
    color: #D4A200 !important;
    background: none !important;
    -webkit-text-fill-color: #D4A200 !important;
}

.funfact-block-two .inner-box .count-outer .odometer {
    color: #D4A200 !important;
    -webkit-text-fill-color: #D4A200 !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    background: transparent !important;
    display: inline-block !important;
}

/* Suffix spans (K+, %, M+, +) */
.funfact-block-two .inner-box .count-outer > span {
    color: #D4A200 !important;
    -webkit-text-fill-color: #D4A200 !important;
    font-size: 38px !important;
    font-weight: 700 !important;
}