/* ==========================================================================
   FULL REDESIGN — Digital Marketing + AI Program & Affiliate Marketing
   Loaded after main.css; overrides the old "trading platform" template with
   a modern SaaS / course-launch look: navy + emerald green, rounded cards,
   soft shadows, Sora/Inter type.
   ========================================================================== */

:root {
    --navy: #06111F;
    --navy-2: #0B1B33;
    --navy-soft: #10233F;
    --green: #16C784;
    --green-dark: #0EA36B;
    --teal: #22C1DC;
    --ink: #0B1220;
    --muted: #5B6B7B;
    --bg-soft: #F5FAF8;
    --card-border: #E7EEEA;
    --radius: 20px;
    --radius-sm: 12px;
    --shadow: 0 24px 60px -24px rgba(6, 17, 31, .28);
    --shadow-sm: 0 10px 30px -12px rgba(6, 17, 31, .18);
}

body, html { background:#fff; }
body { font-family:'Inter', -apple-system, sans-serif; color: var(--ink); }
h1, h2, h3, h4, h5, .navbar-brand, .btn { font-family:'Sora', 'Inter', sans-serif; }
h1, h2, h3, h4, h5 { font-weight: 700; letter-spacing: -0.02em; color: var(--ink); }
p { color: var(--muted); line-height: 1.7; }
a { color: var(--green-dark); }
::selection { background-color: var(--green); color:#fff; }

.container { max-width: 1180px; }

/* ---------- Buttons ---------- */
.btn { border-radius: 999px !important; font-weight: 600; letter-spacing: .01em; padding: 12px 28px !important; border-width: 2px; }
.btn-primary {
    background: linear-gradient(90deg, var(--green) 0%, var(--teal) 100%) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 14px 30px -12px rgba(22,199,132,.55);
}
.btn-primary:hover, .btn-primary:focus { filter: brightness(1.06); transform: translateY(-1px); color:#fff !important; }
.btn-outline-light { border-color: rgba(255,255,255,.5); color:#fff; }
.btn-outline-light:hover { background: rgba(255,255,255,.12); border-color:#fff; }
.btn-outline-dark { border-radius: 999px !important; border-width: 2px; font-weight: 600; }
.btn-lg { padding: 14px 34px !important; font-size: 16px; }

/* ---------- Top utility bar + nav ---------- */
body > div[style*="background-color: #333"] { background: var(--navy) !important; }

header.sticky-top { background: #fff !important; border-bottom: 1px solid var(--card-border); box-shadow: none !important; }
.navbar .nav-item .nav-link { font-weight: 600; color: var(--ink) !important; padding: .6rem 1rem !important; }
.navbar .nav-item .nav-link.active, .navbar .nav-item .nav-link:hover { color: var(--green-dark) !important; }

/* ---------- Hero slider ---------- */
#slider .hero-image {
    min-height: 620px;
    display: flex;
    align-items: center;
    position: relative;
    background-color: var(--navy);
}
#slider .hero-image::before {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(100deg, rgba(6,17,31,.92) 20%, rgba(6,17,31,.55) 55%, rgba(6,17,31,.25) 100%);
}
#slider .hero-image .container { position: relative; z-index: 2; }
.hero-text { padding: 70px 0 !important; }
.hero-text span.text-primary {
    display: inline-block;
    background: rgba(22,199,132,.15);
    border: 1px solid rgba(22,199,132,.4);
    color: #4FE3A6 !important;
    padding: 6px 16px;
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: .06em;
    font-size: 12px !important;
}
.hero-text h1 { color:#fff; font-size: 52px; line-height: 1.12; }
.hero-text h1 .text-primary { color: #4FE3A6 !important; }
.hero-text p { color: rgba(255,255,255,.78) !important; font-size: 18px; max-width: 520px; }

.hero-visual-card {
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    border: 6px solid rgba(255,255,255,.08);
    transform: rotate(1.2deg);
}
.hero-visual-card img { display:block; width:100%; height:100%; object-fit:cover; }

/* ---------- Section rhythm ---------- */
.section-pad { padding: 90px 0; }
.bg-soft { background: var(--bg-soft); }
.eyebrow {
    display:inline-flex; align-items:center; gap:8px;
    color: var(--green-dark); text-transform: uppercase; font-weight: 700;
    letter-spacing: .08em; font-size: 12px; margin-bottom: 14px;
}
.eyebrow::before { content:""; width:22px; height:2px; background: var(--green); display:inline-block; }
.divider { background: linear-gradient(90deg, var(--green), var(--teal)); height: 4px; width: 56px; border-radius:4px; }

/* Old ttm dark sections -> deep navy panels, rounded */
.ttm-bgcolor-darkgrey.ttm-bg,
.ttm-bgcolor-darkgrey.ttm-bg.ttm-bgimage-yes {
    background: var(--navy) !important;
}
.ttm-bgcolor-darkgrey > .ttm-bg-layer { background: linear-gradient(160deg, var(--navy) 0%, var(--navy-2) 100%) !important; opacity: 1; }
.ttm-row { padding: 90px 0; }

/* ---------- Feature / icon cards ---------- */
.featured-icon-box.style3 {
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.09);
    border-radius: var(--radius-sm);
    padding: 32px 22px;
    transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.text-light .featured-icon-box.style3 { background: rgba(255,255,255,.04); }
.bg-white .featured-icon-box.style3,
.featured-icon-box.style3.on-light {
    background:#fff; border:1px solid var(--card-border); box-shadow: var(--shadow-sm);
}
.featured-icon-box.style3:hover { transform: translateY(-6px); border-color: var(--green); }
.featured-icon-box.style3 .ttm-icon {
    width: 56px; height: 56px; line-height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--green), var(--teal));
    display: inline-flex; align-items:center; justify-content:center;
    margin: 0 auto 18px;
    box-shadow: 0 10px 24px -10px rgba(22,199,132,.6);
}
.featured-icon-box.style3 .ttm-icon i { color:#fff !important; font-size: 22px; }
.featured-icon-box.style3 .featured-title h5,
.featured-icon-box.style3 .featured-title h3 { color:#fff; font-size: 18px; }
.text-light .featured-icon-box.style3 .featured-desc p,
.featured-icon-box.style3 .featured-desc p { color: rgba(255,255,255,.68); font-size: 14.5px; }
.on-light .featured-title h5, .bg-white .featured-title h5 { color: var(--ink); }
.on-light .featured-desc p, .bg-white .featured-desc p { color: var(--muted); }

/* ---------- Process / how it works ---------- */
.ttm-processbox-wrapper .ttm-processbox { position: relative; padding: 10px 6px; }
.ttm-processbox-wrapper .ttm-processbox .process-num {
    background: linear-gradient(135deg, var(--green), var(--teal)) !important;
    box-shadow: 0 10px 24px -10px rgba(22,199,132,.6);
    font-family:'Sora',sans-serif;
}
.ttm-processbox-wrapper .ttm-processbox:hover .process-num { background: var(--navy) !important; }
.ttm-box-description { color: var(--muted); }
.spiderweb { background: #fff !important; padding: 90px 0; }

/* ---------- Team / testimonial cards ---------- */
.featured-imagebox-team {
    border-radius: var(--radius-sm);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--card-border);
}
.featured-imagebox-team .featured-thumbnail img { border-radius: 0; aspect-ratio: 1/1; object-fit: cover; }
.featured-imagebox-team .featured-content-team { background:#fff !important; padding: 18px 10px 20px; }
.featured-imagebox-team .featured-title h5 { margin-bottom: 2px; }
.featured-imagebox-team .category { color: var(--green-dark); font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; }

/* ---------- Pricing / plan cards ---------- */
.bg-light-blue { background: var(--bg-soft) !important; }
.feature-10 { border-radius: var(--radius-sm); overflow: hidden; box-shadow: var(--shadow-sm); background:#fff; }
.feature-10 img { display:block; width:100%; height: 170px; object-fit: cover; }
.feature-10-desc { padding: 18px 20px 22px; }
.feature-10-desc h5 { font-size: 16px; }
.feature-10-desc p { font-size: 14px; }

/* ---------- FAQ accordion ---------- */
#accordion .card { border: 1px solid var(--card-border); border-radius: var(--radius-sm) !important; overflow:hidden; box-shadow:none; }
#accordion .card-header { background:#fff; border:none; padding: 4px 0; }
#accordion .card-link { display:block; padding: 16px 22px; font-weight: 600; color: var(--ink); }
#accordion .card-link:hover { color: var(--green-dark); text-decoration:none; }
#accordion .card-body { padding: 0 22px 20px; }

/* ---------- CTA band ---------- */
.cta-band {
    background: linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 60%, #0c3a2c 100%);
    border-radius: var(--radius);
    color:#fff;
    padding: 60px 50px;
}
.cta-band h2 { color:#fff; }
.cta-band p { color: rgba(255,255,255,.75); }

/* ---------- Footer ---------- */
footer { background: var(--navy) !important; }
footer h5 { color:#fff; font-family:'Sora',sans-serif; }
footer .divider { background: linear-gradient(90deg, var(--green), var(--teal)); }
footer a { color: rgba(255,255,255,.72); }
footer a:hover { color: var(--green); text-decoration:none; }

/* ---------- Misc ---------- */
.text-primary, .text-primary a { color: var(--green-dark) !important; }
.bg-primary { background: linear-gradient(90deg, var(--green), var(--teal)) !important; }
.card-link { color: var(--green-dark); }
.badge-danger { background-color: var(--green); }
.custom-popup-container { background-color: var(--navy); border-radius: 14px; }
.popup-amount, #popup-country, #popup-username { color: var(--green); }

@media (max-width: 767px) {
    .hero-text h1 { font-size: 36px; }
    #slider .hero-image { min-height: 520px; }
    .cta-band { padding: 40px 26px; text-align:center; }
    .section-pad { padding: 56px 0; }
}

/* ---------- New hero (split layout) ---------- */
.hero-split {
    background: radial-gradient(circle at 15% 20%, rgba(22,199,132,.18), transparent 45%),
                radial-gradient(circle at 85% 80%, rgba(34,193,220,.14), transparent 40%),
                var(--navy);
    padding: 110px 0 90px;
    position: relative;
    overflow: hidden;
}
.hero-split .eyebrow { color: #4FE3A6; }
.hero-split .eyebrow::before { background: #4FE3A6; }
.hero-split h1 { color:#fff; font-size: 50px; line-height: 1.14; }
.hero-split h1 .grad-text {
    background: linear-gradient(90deg, #4FE3A6, var(--teal));
    -webkit-background-clip: text; background-clip:text; color: transparent;
}
.hero-split p.lead-copy { color: rgba(255,255,255,.75); font-size: 18px; max-width: 480px; margin: 18px 0 30px; }
.hero-visual-wrap { position: relative; }
.hero-floating-card {
    position: absolute;
    bottom: -22px; left: -22px;
    background:#fff;
    border-radius: 16px;
    padding: 16px 20px;
    box-shadow: var(--shadow);
    display:flex; align-items:center; gap:12px;
    max-width: 230px;
}
.hero-floating-card .icon-dot {
    width:44px; height:44px; border-radius:12px;
    background: linear-gradient(135deg, var(--green), var(--teal));
    display:flex; align-items:center; justify-content:center; color:#fff; font-size:18px; flex-shrink:0;
}
.hero-floating-card strong { display:block; font-size: 15px; color: var(--ink); }
.hero-floating-card span { font-size: 12.5px; color: var(--muted); }

/* ---------- Trust / platform bar ---------- */
.trust-bar { background: var(--navy-soft); border-top: 1px solid rgba(255,255,255,.06); padding: 26px 0; }
.trust-bar p { color: rgba(255,255,255,.55); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 16px; text-align:center; }
.trust-bar .platform-row { display:flex; justify-content:center; align-items:center; gap: 34px; flex-wrap:wrap; }
.trust-bar .platform-row i { font-size: 26px; color: rgba(255,255,255,.55); transition: color .2s ease, transform .2s ease; }
.trust-bar .platform-row i:hover { color: #fff; transform: translateY(-2px); }

/* ---------- Stat strip ---------- */
.stat-strip { padding: 50px 0; }
.stat-block { text-align:center; }
.stat-block .num { font-family:'Sora',sans-serif; font-weight:800; font-size: 36px; background: linear-gradient(90deg, var(--green-dark), var(--teal)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat-block .lbl { color: var(--muted); font-size: 14px; font-weight:600; }

/* ---------- Testimonials ---------- */
.testimonial-card {
    background:#fff; border:1px solid var(--card-border); border-radius: var(--radius-sm);
    padding: 28px 26px; box-shadow: var(--shadow-sm); height:100%;
}
.testimonial-card .quote-mark { font-size: 34px; color: var(--green); font-family: Georgia, serif; line-height:1; }
.testimonial-card p.quote { color: var(--ink); font-size: 15px; margin: 10px 0 18px; }
.testimonial-card .who { display:flex; align-items:center; gap:12px; }
.testimonial-card .who img { width:46px; height:46px; border-radius:50%; object-fit:cover; }
.testimonial-card .who strong { display:block; font-size:14px; }
.testimonial-card .who span { font-size:12.5px; color: var(--muted); }

/* ---------- Pricing ribbon ---------- */
.pricing-card { position: relative; }
.pricing-card.popular .featured-icon-box.style3 { border-color: var(--green); background: rgba(22,199,132,.08); }
.pricing-card .ribbon {
    position:absolute; top:-12px; left:50%; transform:translateX(-50%);
    background: linear-gradient(90deg, var(--green), var(--teal));
    color:#fff; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
    padding:5px 14px; border-radius: 999px; z-index:2;
}

/* ---------- Simple inner-page hero (about/faq/contact) ---------- */
.hero-section {
    background: radial-gradient(circle at 15% 20%, rgba(22,199,132,.18), transparent 45%),
                radial-gradient(circle at 85% 80%, rgba(34,193,220,.14), transparent 40%),
                var(--navy) !important;
    padding: 90px 0 !important;
}
.hero-section h1 { color:#fff; font-size: 40px; text-align:center; }