/*
Theme Name: Golden Forex Scalping
Theme URI: https://goldenforexscalping.com
Author: Golden Forex Scalping
Author URI: https://goldenforexscalping.com
Description: Premium WordPress theme built exclusively for the Golden Forex Scalping EA — the world's #1 XAUUSD automated trading Expert Advisor. Designed for professional EA license delivery, WooCommerce integration, member area management, and live-verified trading results presentation. Features a dark trading-grade UI, DLM license system, My Account dashboard, and mobile-optimised checkout. No manual trading required — pure automated profit, every session.
Version: 3.1.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: golden-forex-scalping
Tags: forex, trading, expert-advisor, automated-trading, gold-trading, xauusd, scalping, forex-robot, dark-layout, one-page, responsive, full-width-template, custom-header, custom-menu, featured-images, forex-trading, algorithmic-trading, forex-ea, xauusd-trading, gold-scalping, gold-trading-bot, mt4-expert-advisor, mt5-expert-advisor, scalping-bot, trading-automation, forex-signals, high-profit-forex, passive-income-forex, automated-profit, best-forex-ea-2025, gold-trading-expert-advisor, xauusd-scalping-robot, myfxbook-verified-ea, metatrader, financial-trading, currency-trading, forex-software, trading-strategy, trading-bot
*/

/* ============================================
   CSS RESET & BASE STYLES
   ============================================ */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    /* Primary Colors - Blue and Gold Theme */
    --color-primary: #1E3A8A;        /* Deep Blue */
    --color-primary-light: #3B82F6;  /* Bright Blue */
    --color-primary-dark: #1E40AF;   /* Navy Blue */
    --color-accent: #F59E0B;         /* Gold/Amber */
    --color-accent-light: #FCD34D;   /* Light Gold */
    --color-accent-dark: #D97706;    /* Dark Gold */
    
    /* Background Colors */
    --color-bg-dark: #0A0E27;        /* Deep Navy Background */
    --color-bg-darker: #060914;      /* Darker Navy */
    --color-bg-card: #151B3B;        /* Card Background */
    --color-bg-card-hover: #1E2749;  /* Card Hover */
    
    /* Text Colors */
    --color-text-primary: #ffffff;
    --color-text-secondary: #94A3B8;
    --color-text-muted: #64748B;
    
    /* Border Colors */
    --color-border: #1E293B;
    --color-border-light: #334155;
    
    /* Gradient Colors */
    --gradient-primary: linear-gradient(135deg, #1E3A8A 0%, #3B82F6 100%);
    --gradient-accent: linear-gradient(135deg, #F59E0B 0%, #FCD34D 100%);
    --gradient-dark: linear-gradient(135deg, #151B3B 0%, #0A0E27 100%);
    --gradient-hero: linear-gradient(180deg, rgba(10,14,39,0.95) 0%, rgba(6,9,20,0.8) 100%);
    --gradient-gold-blue: linear-gradient(135deg, #F59E0B 0%, #3B82F6 100%);
    
    /* Spacing */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;
    --spacing-xxl: 100px;
    
    /* Typography */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-display: 'Poppins', 'Inter', sans-serif;
    
    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.1);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 40px rgba(0,0,0,0.3);
    --shadow-xl: 0 20px 60px rgba(30,58,138,0.3);
    --shadow-accent: 0 20px 60px rgba(245,158,11,0.3);
    --shadow-glow-blue: 0 0 30px rgba(59,130,246,0.3);
    --shadow-glow-gold: 0 0 30px rgba(245,158,11,0.3);
    
    /* Border Radius */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 30px;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    font-family: var(--font-primary);
    background-color: var(--color-bg-dark);
    color: var(--color-text-primary);
    line-height: 1.6;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   TYPOGRAPHY
   ============================================ */

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--spacing-md);
}

h1 {
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    letter-spacing: -0.02em;
}

h2 {
    font-size: clamp(2rem, 4vw, 3.5rem);
    letter-spacing: -0.01em;
}

h3 {
    font-size: clamp(1.5rem, 3vw, 2.5rem);
}

h4 {
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);
}

p {
    margin-bottom: var(--spacing-sm);
    color: var(--color-text-secondary);
}

a {
    color: var(--color-accent);
    text-decoration: none;
    transition: var(--transition-fast);
}

a:hover {
    color: var(--color-accent-light);
}

/* ============================================
   UTILITY CLASSES
   ============================================ */

.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

.container-wide {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

.section {
    padding: var(--spacing-xxl) 0;
}

.section-dark {
    background-color: var(--color-bg-darker);
}

.text-center {
    text-align: center;
}

.text-gradient {
    background: var(--gradient-gold-blue);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.text-accent {
    color: var(--color-accent);
}

.text-blue {
    color: var(--color-primary-light);
}

.btn {
    display: inline-block;
    padding: 16px 32px;
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: var(--transition-normal);
    cursor: pointer;
    border: none;
    text-decoration: none;
}

.btn-primary {
    background: var(--gradient-primary);
    color: white;
    box-shadow: var(--shadow-xl);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 70px rgba(30,58,138,0.4);
}

.btn-accent {
    background: var(--gradient-accent);
    color: var(--color-bg-dark);
    box-shadow: var(--shadow-accent);
    font-weight: 700;
}

.btn-accent:hover {
    background: linear-gradient(135deg, #FCD34D 0%, #F59E0B 100%);
    transform: translateY(-2px);
    box-shadow: var(--shadow-glow-gold);
}

.btn-outline {
    background: transparent;
    border: 2px solid var(--color-primary-light);
    color: var(--color-primary-light);
}

.btn-outline:hover {
    background: var(--color-primary-light);
    color: white;
    transform: translateY(-2px);
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-20px);
    }
}

@keyframes glow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(59,130,246,0.3);
    }
    50% {
        box-shadow: 0 0 40px rgba(245,158,11,0.5);
    }
}

.animate-fade-in {
    animation: fadeIn 0.6s ease-out forwards;
}

.animate-fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
}

.animate-scale-in {
    animation: scaleIn 0.5s ease-out forwards;
}

/* Stagger animations */
.stagger-1 { animation-delay: 0.1s; }
.stagger-2 { animation-delay: 0.2s; }
.stagger-3 { animation-delay: 0.3s; }
.stagger-4 { animation-delay: 0.4s; }
.stagger-5 { animation-delay: 0.5s; }

/* ============================================
   HEADER & NAVIGATION
   ============================================ */

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: rgba(10, 14, 39, 0.95);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--color-border);
    transition: var(--transition-normal);
}

.site-header.scrolled {
    background: rgba(6, 9, 20, 0.98);
    box-shadow: var(--shadow-lg);
}

.header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-sm) 0;
}

.site-logo {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.site-logo span.logo-gold {
    color: var(--color-accent);
}

.site-logo span.logo-blue {
    color: var(--color-primary-light);
}

/* G = Gold, F = Yellow, S = Semi Blue */
.logo-g  { color: #E8820A !important; }   /* Gold-Orange */
.logo-f  { color: #E8820A !important; }   /* Gold-Orange */
.logo-s  { color: #3B82F6 !important; }   /* Blue */
.gfs-mob-logo .logo-g { color: #E8820A !important; }
.gfs-mob-logo .logo-f { color: #E8820A !important; }
.gfs-mob-logo .logo-s { color: #3B82F6 !important; }

.main-nav ul {
    display: flex;
    list-style: none;
    gap: var(--spacing-md);
    align-items: center;
}

.main-nav a {
    color: var(--color-text-secondary);
    font-weight: 500;
    font-size: 0.95rem;
    transition: var(--transition-fast);
}

.main-nav a:hover {
    color: var(--color-accent);
}

.nav-home-icon {
    font-size: 1.25rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 10px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: var(--color-surface, rgba(255,255,255,0.05));
    transition: var(--transition-fast);
    text-decoration: none !important;
    font-size: 0.95rem;
    font-weight: 500;
}

.nav-home-icon:hover {
    border-color: var(--color-accent);
    background: rgba(245, 158, 11, 0.12);
    color: inherit !important;
}

.nav-cta {
    background: var(--gradient-accent);
    color: var(--color-bg-dark) !important;
    padding: 10px 24px;
    border-radius: var(--radius-sm);
    font-weight: 700;
}

.nav-cta:hover {
    background: var(--color-accent-light);
    transform: translateY(-2px);
}

/* Mobile Menu Toggle */
.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 10px;
}

.mobile-menu-toggle span {
    width: 25px;
    height: 3px;
    background: var(--color-accent);
    border-radius: 2px;
    transition: var(--transition-fast);
}

/* ============================================
   HERO SECTION
   ============================================ */

.hero-section {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding-top: 120px;
    overflow: hidden;
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.hero-background::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(circle at 30% 20%, rgba(59,130,246,0.15) 0%, transparent 50%),
                radial-gradient(circle at 70% 60%, rgba(245,158,11,0.15) 0%, transparent 50%);
    animation: pulse 8s ease-in-out infinite;
}

.hero-content {
    position: relative;
    z-index: 1;
    max-width: 900px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    background: rgba(59,130,246,0.1);
    border: 1px solid rgba(59,130,246,0.3);
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-primary-light);
    margin-bottom: var(--spacing-md);
}

.hero-title {
    font-size: clamp(2.137rem, 5.13vw, 4.275rem);
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: var(--spacing-md);
}

.hero-subtitle {
    font-size: clamp(1.1rem, 2vw, 1.4rem);
    color: var(--color-text-secondary);
    margin-bottom: var(--spacing-lg);
    line-height: 1.6;
}

.hero-features {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.hero-feature-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: 1rem;
    color: var(--color-text-secondary);
}

.hero-feature-item::before {
    content: '●';
    color: var(--color-accent);
    font-size: 1.2rem;
}

.hero-cta-group {
    display: flex;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.hero-trust-badges {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-top: var(--spacing-xl);
    padding-top: var(--spacing-lg);
    border-top: 1px solid var(--color-border);
}

.trust-avatars {
    display: flex;
    margin-right: var(--spacing-sm);
}

.trust-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid var(--color-bg-dark);
    margin-left: -12px;
    background: var(--color-bg-card);
}

.trust-avatar:first-child {
    margin-left: 0;
}

/* ══════════════════════════════════════════════════════
   GFS HERO — Split Layout (DowGold-inspired)
   ══════════════════════════════════════════════════════ */

.gfs-hero-split {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 48px;
    align-items: center;
    min-height: calc(100vh - 100px);
    padding: 60px 0 40px;
}

/* ── LEFT ── */
.gfs-hero-left {
    position: relative;
    z-index: 1;
}

.gfs-hero-sub {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--color-text-secondary);
    margin-bottom: 6px;
    margin-top: 4px;
}

.gfs-hero-proof-link {
    display: inline-block;
    color: #FFC857;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    margin-bottom: 0;
    transition: opacity 0.2s;
}
.gfs-hero-proof-link:hover { opacity: 0.8; }

/* Price notice box */
.gfs-hero-price-notice {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: rgba(255,200,87,0.06);
    border: 1px solid rgba(255,200,87,0.2);
    border-radius: 10px;
    padding: 14px 16px;
    font-size: 0.82rem;
    color: var(--color-text-secondary);
    margin-top: 20px;
    line-height: 1.5;
}
.gfs-hero-price-notice strong { color: #FFC857; }
.gfs-hero-price-icon { font-size: 1.1rem; flex-shrink: 0; margin-top: 1px; }

/* Trust bar */
.gfs-hero-trust-bar {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin-top: 16px;
    font-size: 0.82rem;
    color: var(--color-text-muted);
}
.gfs-hero-trust-bar span { display: flex; align-items: center; gap: 5px; }

/* ── RIGHT: Brand Card ── */
.gfs-hero-right {
    position: relative;
    z-index: 1;
}

.gfs-brand-card {
    background: linear-gradient(160deg, #0d1220 0%, #070c18 100%);
    border: 1px solid rgba(255,200,87,0.3);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 64px rgba(0,0,0,0.6), 0 0 40px rgba(255,200,87,0.06);
}

.gfs-brand-card-top {
    padding: 32px 32px 24px;
    text-align: center;
    border-bottom: 1px solid rgba(255,200,87,0.15);
    background: linear-gradient(180deg, rgba(255,200,87,0.05) 0%, transparent 100%);
}

.gfs-brand-logo-text {
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.15;
    color: #ffffff;
    letter-spacing: -0.5px;
    font-family: var(--font-display, 'Syne', sans-serif);
    margin-bottom: 10px;
}

.gfs-brand-card-sub {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 3px;
    color: #FFC857;
    text-transform: uppercase;
}

/* Checklist */
.gfs-brand-checklist {
    padding: 24px 32px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    border-bottom: 1px solid rgba(255,200,87,0.12);
}

.gfs-brand-check-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.95rem;
    color: #E2E8F0;
    font-weight: 500;
}

.gfs-check-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(255,200,87,0.15);
    border: 1px solid rgba(255,200,87,0.4);
    color: #FFC857;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* MyFXBook badge */
.gfs-myfxbook-badge {
    margin: 20px 32px;
    background: rgba(0,0,0,0.4);
    border: 1px solid rgba(255,200,87,0.2);
    border-radius: 12px;
    padding: 16px 20px;
    text-align: center;
}

.gfs-myfxbook-label {
    font-size: 0.65rem;
    letter-spacing: 2px;
    color: #64748B;
    text-transform: uppercase;
    margin-bottom: 6px;
}

.gfs-myfxbook-logo {
    font-size: 1.6rem;
    color: #E2E8F0;
    font-family: Georgia, serif;
}

.gfs-brand-card-bottom {
    text-align: center;
    padding: 14px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 2.5px;
    color: #FFC857;
    text-transform: uppercase;
    border-top: 1px solid rgba(255,200,87,0.12);
}

/* ══════════════════════════════════════════════════
   HERO LEFT — Setup line, Ticker, Sessions, Telegram
   ══════════════════════════════════════════════════ */

.gfs-setup-line {
    font-size: 0.82rem;
    color: var(--color-text-secondary);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.gfs-setup-line strong { color: #FFC857; }

/* ── Shared widget header ── */
.gfs-live-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #22C55E;
    border-radius: 50%;
    box-shadow: 0 0 8px #22C55E;
    animation: pulse 2s infinite;
    flex-shrink: 0;
}
.gfs-ticker-title {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: #64748B;
    text-transform: uppercase;
}

/* ── Live Market Ticker ── */
.gfs-ticker-block {
    background: rgba(13,18,32,0.85);
    border: 1px solid rgba(255,200,87,0.15);
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 14px;
    backdrop-filter: blur(8px);
}
.gfs-ticker-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}
.gfs-ticker-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}
.gfs-tk-item {
    display: flex;
    flex-direction: column;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.05);
    border-radius: 8px;
    padding: 8px 10px;
    transition: border-color 0.2s;
}
.gfs-tk-item:hover { border-color: rgba(255,200,87,0.2); }
.gfs-tk-gold { border-color: rgba(255,200,87,0.2) !important; background: rgba(255,200,87,0.04) !important; }
.gfs-tk-sym {
    font-size: 0.65rem;
    font-weight: 700;
    color: #64748B;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin-bottom: 2px;
}
.gfs-tk-price {
    font-size: 0.82rem;
    font-weight: 600;
    color: #E2E8F0;
    margin-bottom: 2px;
    font-variant-numeric: tabular-nums;
}
.gfs-tk-chg {
    font-size: 0.68rem;
    font-weight: 700;
}
.gfs-tk-chg.pos { color: #4ADE80; }
.gfs-tk-chg.neg { color: #F87171; }

/* ── Trading Sessions ── */
.gfs-sessions-block {
    background: rgba(13,18,32,0.85);
    border: 1px solid rgba(255,200,87,0.15);
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 20px;
    backdrop-filter: blur(8px);
}
.gfs-sessions-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}
.gfs-sessions-timeline {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.gfs-sessions-hours {
    display: flex;
    justify-content: space-between;
    padding-left: 72px;
    margin-bottom: 4px;
}
.gfs-sessions-hours span {
    font-size: 0.6rem;
    color: #475569;
    font-weight: 500;
}
.gfs-session-row {
    display: flex;
    align-items: center;
    gap: 8px;
}
.gfs-session-name {
    width: 64px;
    font-size: 0.72rem;
    font-weight: 600;
    color: #94A3B8;
    text-align: right;
    flex-shrink: 0;
}
.gfs-session-bar-wrap {
    flex: 1;
    position: relative;
    height: 22px;
    background: rgba(255,255,255,0.03);
    border-radius: 6px;
    display: flex;
    align-items: center;
}
.gfs-session-bar {
    position: absolute;
    height: 100%;
    border-radius: 6px;
    opacity: 0.85;
}
.gfs-session-bar.sydney  { background: linear-gradient(90deg,#1E40AF,#3B82F6); }
.gfs-session-bar.tokyo   { background: linear-gradient(90deg,#6D28D9,#8B5CF6); }
.gfs-session-bar.london  { background: linear-gradient(90deg,#065F46,#10B981); }
.gfs-session-bar.newyork { background: linear-gradient(90deg,#92400E,#F59E0B); }
.gfs-session-time {
    position: absolute;
    right: 8px;
    font-size: 0.65rem;
    color: rgba(255,255,255,0.7);
    font-weight: 600;
    white-space: nowrap;
    pointer-events: none;
}

/* ══════════════════════════════════════════════════
   TELEGRAM — Fixed top-right AI-styled button
   ══════════════════════════════════════════════════ */
.gfs-tg-fixed {
    position: fixed !important;
    top: 80px;
    right: 20px;
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px 10px 14px;
    background: linear-gradient(135deg, #0088cc 0%, #00b0f4 100%);
    border-radius: 50px;
    text-decoration: none !important;
    color: #fff !important;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.2px;
    box-shadow: 0 4px 20px rgba(0,136,204,0.4), 0 0 0 1px rgba(0,176,244,0.3);
    transition: transform 0.2s, box-shadow 0.2s;
    white-space: nowrap;
    animation: gfsTgEntrance 0.6s cubic-bezier(0.34,1.56,0.64,1) both;
    animation-delay: 0.8s;
    opacity: 0;
}
@keyframes gfsTgEntrance {
    0%   { opacity:0; transform:translateY(-12px) scale(0.9); }
    100% { opacity:1; transform:translateY(0)     scale(1);   }
}
.gfs-tg-fixed:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 8px 28px rgba(0,136,204,0.55), 0 0 0 2px rgba(0,176,244,0.4);
    color: #fff !important;
    text-decoration: none !important;
}
/* AI pulse ring */
.gfs-tg-ai-pulse {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: 100%;
    border-radius: 50px;
    border: 2px solid rgba(0,176,244,0.5);
    animation: gfsPulseRing 2.5s ease-out infinite;
    pointer-events: none;
}
@keyframes gfsPulseRing {
    0%   { transform:translate(-50%,-50%) scale(1);    opacity:0.6; }
    100% { transform:translate(-50%,-50%) scale(1.18); opacity:0;   }
}
.gfs-tg-text { line-height: 1; }
.gfs-tg-badge {
    background: rgba(255,255,255,0.22);
    border-radius: 20px;
    padding: 2px 8px;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.5px;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .gfs-tg-fixed { display: none !important; }
    .gfs-ticker-grid { grid-template-columns: repeat(2, 1fr); }
    .gfs-sessions-hours { padding-left: 60px; }
    .gfs-session-name { width: 52px; font-size: 0.65rem; }
}
@media (max-width: 480px) {
    .gfs-ticker-grid { grid-template-columns: repeat(2, 1fr); }
}


@media (max-width: 960px) {
    .gfs-hero-split {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 20px 0 32px;
    }
    .gfs-hero-right {
        display: flex;
        justify-content: center;
    }
    .gfs-brand-card {
        max-width: 420px;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .gfs-brand-logo-text { font-size: 1.5rem; }
    .gfs-brand-card-top { padding: 24px 20px 18px; }
    .gfs-brand-checklist { padding: 18px 20px; }
    .gfs-myfxbook-badge { margin: 14px 20px; }
    .gfs-brand-card-bottom { padding: 12px; }
    .gfs-hero-trust-bar { gap: 12px; font-size: 0.76rem; }
    .gfs-hero-price-notice { font-size: 0.76rem; padding: 12px; }
}

.trust-text {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.trust-stars {
    color: var(--color-accent);
    font-size: 1.1rem;
}

.trust-count {
    font-size: 0.9rem;
    color: var(--color-text-secondary);
}

/* ============================================
   EDITABLE CONTENT SECTIONS
   ============================================ */

.editable-section {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    margin: var(--spacing-lg) 0;
}

.editable-heading {
    font-size: 2rem;
    margin-bottom: var(--spacing-md);
    color: var(--color-accent);
}

.editable-text {
    color: var(--color-text-secondary);
    line-height: 1.8;
    font-size: 1.1rem;
}

/* ============================================
   CALCULATOR SECTION
   ============================================ */

.calculator-section {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    margin: var(--spacing-xl) 0;
}

.calculator-title {
    text-align: center;
    margin-bottom: var(--spacing-lg);
}

.calculator-controls {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.calculator-result {
    background: rgba(59,130,246,0.1);
    border: 2px solid rgba(59,130,246,0.3);
    border-radius: var(--radius-md);
    padding: var(--spacing-lg);
    text-align: center;
}

.calculator-result-value {
    font-size: 3rem;
    font-weight: 800;
    background: var(--gradient-gold-blue);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ============================================
   TRADING MODES SECTION
   ============================================ */

.trading-modes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-md);
}

.mode-card {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    transition: var(--transition-normal);
    position: relative;
    overflow: hidden;
}

.mode-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--gradient-primary);
    opacity: 0;
    transition: var(--transition-normal);
}

.mode-card:hover {
    transform: translateY(-10px);
    border-color: var(--color-primary-light);
    box-shadow: var(--shadow-glow-blue);
}

.mode-card:hover::before {
    opacity: 1;
}

.mode-badge {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: var(--spacing-sm);
}

.mode-badge.highest-risk {
    background: rgba(239,68,68,0.2);
    color: #EF4444;
}

.mode-badge.high-risk {
    background: rgba(251,146,60,0.2);
    color: #FB923C;
}

.mode-badge.low-risk {
    background: rgba(59,130,246,0.2);
    color: #3B82F6;
}

.mode-badge.ultra-low-risk {
    background: rgba(245,158,11,0.2);
    color: #F59E0B;
}

.mode-icon {
    font-size: 2.5rem;
    margin-bottom: var(--spacing-sm);
    text-align: center;
}

.mode-returns {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--color-accent);
    text-align: center;
}

.mode-returns-label {
    font-size: 0.9rem;
    color: var(--color-text-muted);
    margin-bottom: var(--spacing-md);
    text-align: center;
}

.mode-features {
    list-style: none;
}

.mode-features li {
    padding: 8px 0;
    color: var(--color-text-secondary);
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-xs);
}

.mode-features li::before {
    content: '✓';
    color: var(--color-accent);
    font-weight: bold;
    flex-shrink: 0;
}

/* ============================================
   VERIFICATION BADGES
   ============================================ */

.verification-badges {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-lg);
    flex-wrap: wrap;
}

.verification-badge {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    background: rgba(59,130,246,0.1);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.verification-badge img {
    height: 30px;
}

/* ============================================
   FEATURES GRID
   ============================================ */

.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-lg);
}

.feature-card {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    transition: var(--transition-normal);
}

.feature-card:hover {
    border-color: var(--color-accent);
    transform: translateY(-5px);
    box-shadow: var(--shadow-glow-gold);
}

.feature-icon {
    font-size: 2.5rem;
    margin-bottom: var(--spacing-sm);
}

.feature-title {
    font-size: 1.3rem;
    margin-bottom: var(--spacing-sm);
    color: var(--color-accent);
}

.feature-description {
    color: var(--color-text-secondary);
}

/* ============================================
   FAQ SECTION
   ============================================ */

.faq-list {
    max-width: 900px;
    margin: 0 auto;
}

.faq-item {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    margin-bottom: var(--spacing-sm);
    overflow: hidden;
    transition: var(--transition-normal);
}

.faq-item:hover {
    border-color: var(--color-primary-light);
}

.faq-question {
    width: 100%;
    padding: var(--spacing-md);
    background: transparent;
    border: none;
    color: var(--color-text-primary);
    font-size: 1.1rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: var(--transition-fast);
}

.faq-question:hover {
    color: var(--color-accent);
}

.faq-icon {
    transition: var(--transition-fast);
    color: var(--color-accent);
    font-size: 1.5rem;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq-item.active .faq-answer {
    max-height: 1000px;
}

.faq-answer-content {
    padding: 0 var(--spacing-md) var(--spacing-md);
    color: var(--color-text-secondary);
    line-height: 1.7;
}

/* ============================================
   PRICING SECTION - KEEP AS IS
   ============================================ */

.pricing-section-title {
    text-align: center;
    font-size: 3rem;
    margin-bottom: var(--spacing-md);
}

.pricing-section-subtitle {
    text-align: center;
    color: var(--color-text-secondary);
    font-size: 1.2rem;
    margin-bottom: var(--spacing-xl);
}

.pricing-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: var(--spacing-xl);
    align-items: start;
}

@media (max-width: 1100px) {
    .pricing-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .pricing-cards {
        grid-template-columns: 1fr;
    }
}

.pricing-card {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 20px 16px 18px;
    transition: var(--transition-normal);
    position: relative;
    display: flex;
    flex-direction: column;
}

.pricing-card:hover {
    transform: translateY(-6px);
    border-color: var(--color-primary-light);
    box-shadow: var(--shadow-glow-blue);
}

.pricing-card.featured {
    border: 2px solid var(--color-accent);
    background: linear-gradient(135deg, rgba(245,158,11,0.05) 0%, rgba(10,14,39,0.9) 100%);
}

.pricing-card.featured:hover {
    box-shadow: var(--shadow-glow-gold);
}

.pricing-badge {
    position: absolute;
    top: -13px;
    right: 14px;
    background: var(--gradient-accent);
    color: var(--color-bg-dark);
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.pricing-header {
    text-align: center;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-border);
}

.pricing-plan-name {
    font-size: 0.72rem;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 8px;
    line-height: 1.4;
}

.pricing-price {
    font-size: 2.6rem;
    font-weight: 800;
    background: var(--gradient-gold-blue);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 4px;
    line-height: 1.1;
}

.pricing-period {
    color: var(--color-text-muted);
    font-size: 0.75rem;
}

.pricing-features {
    list-style: none;
    margin-bottom: 16px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    flex: 1;
}

.pricing-features li {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 7px 4px 7px 0;
    color: var(--color-text-secondary);
    font-size: 0.78rem;
    line-height: 1.3;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}

.pricing-features li:nth-last-child(-n+2) {
    border-bottom: none;
}

.pricing-features li::before {
    content: '✓';
    color: var(--color-accent);
    font-weight: bold;
    font-size: 0.85rem;
    flex-shrink: 0;
    margin-top: 1px;
}

.pricing-features li strong {
    font-weight: 600;
}

.pricing-features li.unavailable {
    color: var(--color-text-muted);
    opacity: 0.7;
}

.pricing-features li.unavailable::before {
    content: '✗';
    color: #EF4444;
}

.pricing-button {
    width: 100%;
    margin-top: auto;
    padding: 11px 16px;
    font-size: 0.82rem;
}

/* ============================================
   WHAT YOU GET SECTION
   ============================================ */

.what-you-get-section {
    background: var(--gradient-dark);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-xl);
    margin-top: var(--spacing-xl);
}

.what-you-get-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--spacing-md);
    margin-top: var(--spacing-lg);
}

.package-item {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm);
    color: var(--color-text-secondary);
}

.package-item::before {
    content: '✓';
    color: var(--color-accent);
    font-weight: bold;
    font-size: 1.3rem;
    flex-shrink: 0;
}

/* ============================================
   FOOTER
   ============================================ */

.site-footer {
    background: var(--color-bg-darker);
    border-top: 1px solid var(--color-border);
    padding: var(--spacing-xl) 0 var(--spacing-md);
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--spacing-xl);
    margin-bottom: var(--spacing-xl);
}

.footer-section h4 {
    margin-bottom: var(--spacing-md);
    font-size: 1.2rem;
    color: var(--color-accent);
}

.footer-links {
    list-style: none;
}

.footer-links li {
    margin-bottom: var(--spacing-xs);
}

.footer-links a {
    color: var(--color-text-secondary);
    transition: var(--transition-fast);
}

.footer-links a:hover {
    color: var(--color-accent);
}

.footer-bottom-link {
    transition: color 0.2s ease;
}

.footer-bottom-link:hover {
    color: #FCA311 !important;
}

.social-link-telegram,
.social-link-live,
.social-link-youtube,
.social-link-facebook {
    transition: color 0.2s ease;
}

.social-link-telegram:hover { color: #0077B5 !important; }
.social-link-live:hover     { color: #B8780A !important; }
.social-link-youtube:hover  { color: #CC0000 !important; }
.social-link-facebook:hover { color: #1565C0 !important; }

.footer-bottom {
    text-align: center;
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-muted);
    font-size: 0.9rem;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

@media (max-width: 1024px) {
    .vip-community-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    :root {
        --spacing-xxl: 60px;
        --spacing-xl: 40px;
    }
    
    .main-nav {
        display: none;
    }
    
    .mobile-menu-toggle {
        display: flex;
    }
    
    .hero-cta-group {
        flex-direction: column;
    }
    
    .hero-cta-group .btn {
        width: 100%;
        text-align: center;
    }
    
    .trading-modes,
    .features-grid {
        grid-template-columns: 1fr;
    }
    
    .verification-badges {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.75rem;
    }
    
    .pricing-price {
        font-size: 2.5rem;
    }
    
    .mode-returns {
        font-size: 2rem;
    }
}

/* ============================================
   PRINT STYLES
   ============================================ */

@media print {
    .site-header,
    .mobile-menu-toggle {
        display: none;
    }
}


/* ═══════════════════════════════════════════════
   PREMIUM UPGRADE v3 — Red + Light Green Palette
   No existing rules changed — appended only.
   ═══════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

/* ── Root: deeper navy + red + mint accents ── */
:root {
    --color-bg-dark:       #04060F;
    --color-bg-darker:     #020408;
    --color-bg-card:       #0B0E1C;
    --color-bg-card-hover: #101526;
    --color-border:        #161B30;
    --color-border-light:  #202840;

    /* NEW accent palette */
    --color-red:           #DC2626;
    --color-red-light:     #EF4444;
    --color-red-glow:      rgba(220,38,38,0.25);
    --color-mint:          #4ADE80;
    --color-mint-light:    #86EFAC;
    --color-mint-glow:     rgba(74,222,128,0.2);

    /* Keep gold but richer */
    --color-accent:        #F59E0B;
    --color-accent-light:  #FCD34D;
    --gradient-accent:     linear-gradient(135deg,#FFC857 0%,#F59E0B 55%,#D97706 100%);

    /* Red-gold hero gradient */
    --gradient-hero-accent:linear-gradient(135deg,#DC2626 0%,#F59E0B 50%,#FCD34D 100%);
    /* Mint-blue card gradient */
    --gradient-mint-blue:  linear-gradient(135deg,#4ADE80 0%,#60A5FA 100%);

    /* Updated fonts */
    --font-display:        'Syne','Poppins',sans-serif;
    --font-primary:        'DM Sans','Inter',sans-serif;

    /* Glow shadows */
    --shadow-red:          0 0 40px rgba(220,38,38,0.3),0 20px 60px rgba(220,38,38,0.1);
    --shadow-mint:         0 0 40px rgba(74,222,128,0.3),0 20px 60px rgba(74,222,128,0.1);
    --shadow-gold-deep:    0 0 50px rgba(245,158,11,0.35),0 25px 70px rgba(245,158,11,0.12);
}

/* ── Grain overlay ────────────────────────────── */
body {
    font-family: var(--font-primary);
    background: var(--color-bg-dark);
}
body::before {
    content:'';
    position:fixed;
    inset:0;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
    pointer-events:none;
    z-index:9999;
    opacity:0.5;
}

/* ── Hero: red-left / gold-right atmospheric ─── */
.hero-section {
    background:
        radial-gradient(ellipse 70% 55% at 5%  15%, rgba(220,38,38,0.12) 0%,transparent 65%),
        radial-gradient(ellipse 55% 45% at 90% 80%, rgba(245,158,11,0.10) 0%,transparent 60%),
        radial-gradient(ellipse 40% 35% at 55% 40%, rgba(74,222,128,0.05) 0%,transparent 60%),
        var(--color-bg-dark);
}
.hero-background::after {
    content:'';
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle 500px at 0%   30%, rgba(220,38,38,0.07) 0%,transparent 70%),
        radial-gradient(circle 350px at 100% 70%, rgba(245,158,11,0.07) 0%,transparent 70%);
}

/* ── Hero title: Syne + red gradient ─────────── */
.hero-title {
    font-family:'Syne',var(--font-display);
    font-weight:800;
    letter-spacing:-0.03em;
    line-height:1.05;
}
.hero-title .text-gradient {
    background:linear-gradient(135deg,#DC2626 0%,#F59E0B 50%,#FCD34D 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    filter:drop-shadow(0 2px 18px rgba(220,38,38,0.35));
}

/* ── Hero badge: red glass pill ──────────────── */
.hero-badge {
    background:rgba(220,38,38,0.08);
    border:1px solid rgba(220,38,38,0.28);
    backdrop-filter:blur(14px);
    color:#FCA5A5;
    box-shadow:0 2px 20px rgba(220,38,38,0.08);
}

/* ── CTA Buttons ──────────────────────────────── */
.btn-accent {
    background:linear-gradient(135deg,#FFC857 0%,#F59E0B 60%,#D97706 100%);
    color:#04060F;
    font-family:var(--font-display);
    font-weight:800;
    letter-spacing:0.4px;
    box-shadow:0 4px 24px rgba(245,158,11,0.38),0 1px 0 rgba(255,255,255,0.14) inset;
    border:none;
}
.btn-accent:hover {
    transform:translateY(-3px);
    box-shadow:0 8px 40px rgba(245,158,11,0.52),0 1px 0 rgba(255,255,255,0.18) inset;
    background:linear-gradient(135deg,#FFD580 0%,#FFC857 60%,#F59E0B 100%);
    color:#04060F;
}
.btn-outline {
    border:1.5px solid rgba(220,38,38,0.4);
    color:#FCA5A5;
    backdrop-filter:blur(8px);
    background:rgba(220,38,38,0.04);
}
.btn-outline:hover {
    background:rgba(220,38,38,0.12);
    border-color:rgba(220,38,38,0.7);
    color:white;
    transform:translateY(-3px);
    box-shadow:0 8px 30px rgba(220,38,38,0.18);
}

/* ── Nav CTA: gold still ──────────────────────── */
.nav-cta {
    background:linear-gradient(135deg,#FFC857,#F59E0B);
    color:#04060F !important;
    font-weight:800;
    box-shadow:0 2px 16px rgba(245,158,11,0.3);
}
.nav-cta:hover {
    box-shadow:0 4px 24px rgba(245,158,11,0.5);
    transform:translateY(-1px);
}
.main-nav a:hover { color:#FCA5A5; }

/* ── Header: glass ───────────────────────────── */
.site-header {
    background:rgba(4,6,15,0.72);
    backdrop-filter:blur(28px) saturate(180%);
    border-bottom:1px solid rgba(255,255,255,0.04);
}
.site-header.scrolled {
    background:rgba(4,6,15,0.94);
    box-shadow:0 4px 40px rgba(0,0,0,0.6);
}

/* ── Section dark: red tint top ─────────────── */
.section-dark {
    background:
        radial-gradient(ellipse 100% 30% at 50% 0%, rgba(220,38,38,0.05) 0%,transparent 70%),
        var(--color-bg-darker);
}

/* ── Cards: unified premium glass ───────────── */
.pricing-card,
.mode-card,
.feature-card,
.faq-item,
.what-you-get-section,
.calculator-section {
    background:linear-gradient(160deg,rgba(11,14,28,0.97) 0%,rgba(4,6,15,0.99) 100%);
    border:1px solid rgba(255,255,255,0.045);
    box-shadow:0 2px 30px rgba(0,0,0,0.35),0 1px 0 rgba(255,255,255,0.035) inset;
    backdrop-filter:blur(4px);
}

/* Hover: mint border glow on feature cards */
.feature-card:hover {
    border-color:rgba(74,222,128,0.3);
    box-shadow:0 8px 40px rgba(74,222,128,0.08),0 0 0 1px rgba(74,222,128,0.12);
    transform:translateY(-6px) translateX(3px);
}

/* Hover: red/gold on mode cards */
.mode-card:hover {
    border-color:rgba(220,38,38,0.25);
    box-shadow:0 8px 40px rgba(220,38,38,0.08),0 0 0 1px rgba(220,38,38,0.1);
}

/* Hover: gold glow on pricing */
.pricing-card:hover {
    border-color:rgba(245,158,11,0.2);
    box-shadow:0 8px 40px rgba(245,158,11,0.08),0 0 0 1px rgba(245,158,11,0.1);
}

/* Featured card: gold halo */
.pricing-card.featured {
    background:linear-gradient(160deg,rgba(20,14,5,0.99) 0%,rgba(10,7,2,0.99) 100%);
    border:1px solid rgba(245,158,11,0.35);
    box-shadow:0 0 0 1px rgba(245,158,11,0.1),0 8px 60px rgba(245,158,11,0.14),0 40px 80px rgba(0,0,0,0.5);
}
.pricing-card.featured:hover {
    box-shadow:0 0 0 1px rgba(245,158,11,0.25),0 12px 80px rgba(245,158,11,0.22),0 40px 80px rgba(0,0,0,0.6);
}

/* ── Mode card top lines: red spectrum ───────── */
.mode-card::before { height:3px; border-radius:0 0 3px 3px; }
.mode-card.mode-flipping::before   { background:linear-gradient(90deg,#DC2626,#EF4444); }
.mode-card.mode-aggressive::before { background:linear-gradient(90deg,#EF4444,#F59E0B); }
.mode-card.mode-low-risk::before   { background:linear-gradient(90deg,#4ADE80,#22C55E); }
.mode-card.mode-prop::before       { background:linear-gradient(90deg,#FFC857,#F59E0B); }

/* Mode returns: Syne + gold */
.mode-returns {
    font-family:'Syne',var(--font-display);
    font-size:2.8rem;
    letter-spacing:-0.03em;
    color:#FFC857;
    filter:drop-shadow(0 2px 10px rgba(245,158,11,0.28));
}

/* Mode badge colours: red spectrum */
.mode-badge.highest-risk  { background:rgba(220,38,38,0.15); color:#F87171; }
.mode-badge.high-risk     { background:rgba(239,68,68,0.12);  color:#FCA5A5; }
.mode-badge.low-risk      { background:rgba(74,222,128,0.12); color:#4ADE80; }
.mode-badge.ultra-low-risk{ background:rgba(245,158,11,0.12); color:#FCD34D; }

/* ── Feature card: red left reveal ───────────── */
.feature-card { position:relative; overflow:hidden; }
.feature-card::after {
    content:'';
    position:absolute;
    left:0; top:0; bottom:0;
    width:3px;
    background:linear-gradient(180deg,#DC2626,#F59E0B,#4ADE80);
    opacity:0;
    transition:opacity 0.3s ease;
}
.feature-card:hover::after { opacity:1; }

/* Feature title: mint on hover */
.feature-card:hover .feature-title { color:var(--color-mint); }

/* ── Pricing: Syne display font ──────────────── */
.pricing-price {
    font-family:'Syne',var(--font-display);
    font-size:3.8rem;
    letter-spacing:-0.03em;
    background:linear-gradient(135deg,#FFC857 0%,#F59E0B 50%,#FCA5A5 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    filter:drop-shadow(0 2px 12px rgba(245,158,11,0.22));
}
.pricing-section-title {
    font-family:'Syne',var(--font-display);
    letter-spacing:-0.03em;
    background:linear-gradient(135deg,#ffffff 0%,#CBD5E1 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
}
.pricing-badge {
    background:linear-gradient(135deg,#FFC857 0%,#F59E0B 50%,#D97706 100%);
    color:#04060F;
    font-weight:800;
    box-shadow:0 2px 16px rgba(245,158,11,0.42);
    background-size:200% auto;
    animation:shimmer 3s linear infinite;
}
@keyframes shimmer {
    0%   { background-position:-200% center; }
    100% { background-position: 200% center; }
}

/* ── Pricing feature checkmarks: mint ───────── */
.pricing-features li::before { color:#008000; }
.pricing-features li.unavailable::before { color:#fb4f14; }

/* ── Package items: mint left rule ───────────── */
.package-item { border-left:2px solid rgba(74,222,128,0.2); padding-left:var(--spacing-sm); }
.package-item:hover { border-left-color:var(--color-mint); }
.package-item::before { color:#4ADE80; }

/* ── What You Get box: mint border ───────────── */
.what-you-get-section {
    border:1px solid rgba(74,222,128,0.15);
    box-shadow:0 0 50px rgba(74,222,128,0.04) inset;
}

/* ── Calculator result: red tint ─────────────── */
.calculator-result {
    background:linear-gradient(160deg,rgba(220,38,38,0.08) 0%,rgba(4,6,15,0.6) 100%);
    border:1px solid rgba(220,38,38,0.2);
    box-shadow:0 0 40px rgba(220,38,38,0.05) inset;
}
.calculator-result-value {
    font-family:'Syne',var(--font-display);
    font-size:3.5rem;
    letter-spacing:-0.03em;
    background:linear-gradient(135deg,#FFC857 0%,#F59E0B 50%,#4ADE80 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    filter:drop-shadow(0 2px 16px rgba(245,158,11,0.25));
}

/* ── Verification badges: refined ────────────── */
.verification-badge {
    background:rgba(11,14,28,0.7);
    border:1px solid rgba(255,255,255,0.055);
    backdrop-filter:blur(12px);
    box-shadow:0 2px 16px rgba(0,0,0,0.2);
    transition:all 0.3s ease;
}
.verification-badge:hover {
    border-color:rgba(74,222,128,0.25);
    background:rgba(74,222,128,0.04);
}

/* ── FAQ: mint open state ─────────────────────── */
.faq-item { border:1px solid rgba(255,255,255,0.04); }
.faq-item:hover  { border-color:rgba(220,38,38,0.2); }
.faq-item.active { border-color:rgba(74,222,128,0.25); box-shadow:0 4px 30px rgba(74,222,128,0.05); }
.faq-item.active .faq-question { color:#4ADE80; }
.faq-icon {
    width:28px; height:28px;
    border:1.5px solid rgba(220,38,38,0.3);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:1.1rem; flex-shrink:0;
    transition:all 0.3s ease;
}
.faq-item.active .faq-icon { background:rgba(74,222,128,0.1); border-color:#4ADE80; }

/* ── Section headings: Syne ──────────────────── */
h2 { font-family:'Syne',var(--font-display); letter-spacing:-0.025em; }

/* ── Footer: red-top glow ─────────────────────── */
.site-footer {
    background:var(--color-bg-darker);
    border-top:1px solid rgba(220,38,38,0.1);
    box-shadow:0 -1px 0 rgba(255,255,255,0.02);
}
.footer-section h4 { color:#FCA5A5; }

/* ── "Live" pulse badge ───────────────────────── */
@keyframes pulse {
    0%,100% { opacity:1; box-shadow:0 0 10px #22C55E; }
    50%      { opacity:0.6; box-shadow:0 0 20px #22C55E,0 0 40px rgba(34,197,94,0.4); }
}

/* ── Hero feature item bullets: red ─────────── */
.hero-feature-item::before { color:#EF4444; }

/* ── Scrollbar: red → mint → gold ────────────── */
@media (min-width:769px) {
    ::-webkit-scrollbar { width:5px; }
    ::-webkit-scrollbar-track { background:var(--color-bg-darker); }
    ::-webkit-scrollbar-thumb {
        background:linear-gradient(180deg,#DC2626,#4ADE80,#F59E0B);
        border-radius:3px;
    }
}

/* ── Text selection: red tint ────────────────── */
::selection { background:rgba(220,38,38,0.22); color:#FCA5A5; }

/* ── Mobile ───────────────────────────────────── */
@media (max-width:768px){
    .pricing-price { font-size:3rem; }
    .mode-returns  { font-size:2.2rem; }
    .hero-title    { letter-spacing:-0.02em; }
    .calculator-result-value { font-size:2.8rem; }
}


/* ═══════════════════════════════════════════════════════════════
   MOBILE OPTIMISATION — v24
   Targets: iPhone Pro (390×844, 393×852) & Pixel 7 (412×915)
   Rules appended only — zero existing rules modified.
   ═══════════════════════════════════════════════════════════════ */

/* ── Shared small-screen base (≤480px) ─────────────────────── */
@media (max-width: 480px) {

    /* Root spacing scale-down */
    :root {
        --spacing-xxl: 48px;
        --spacing-xl:  32px;
        --spacing-lg:  24px;
        --spacing-md:  16px;
        --spacing-sm:  12px;
    }

    /* Prevent horizontal overflow */
    body, .container, .container-wide {
        overflow-x: hidden;
        max-width: 100%;
    }

    .container,
    .container-wide {
        padding: 0 16px;
    }

    /* ── Hero ─────────────────────────────────────────── */
    .hero-section {
        padding-top: 80px;
        min-height: auto;
        padding-bottom: 40px;
    }

    .hero-content {
        max-width: 100%;
        text-align: center;
    }

    .hero-badge {
        font-size: 0.78rem;
        padding: 6px 14px;
    }

    .hero-subtitle {
        font-size: 1rem;
    }

    .hero-features {
        flex-direction: column;
        gap: 8px;
        align-items: center;
    }

    .hero-trust-badges {
        flex-direction: column;
        align-items: center;
        gap: 12px;
        text-align: center;
    }

    /* ── Buttons ──────────────────────────────────────── */
    .btn {
        padding: 14px 20px;
        font-size: 0.9rem;
    }

    /* ── Inline 2-col grids → 1 col on mobile ─────────── */
    /* Stats row inside live-account cards */
    [style*="grid-template-columns:1fr 1fr"] {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        font-size: 0.78rem !important;
    }

    /* Comparison grid (What Other EAs Do vs What We Do) */
    [style*="grid-template-columns:1fr 1fr;gap:var(--spacing-lg)"] {
        grid-template-columns: 1fr !important;
    }

    /* ── Cards & sections ─────────────────────────────── */
    .mode-card,
    .feature-card,
    .pricing-card,
    .editable-section,
    .calculator-section,
    .what-you-get-section {
        padding: var(--spacing-md);
    }

    .pricing-price {
        font-size: 2.6rem;
    }

    .mode-returns {
        font-size: 1.8rem;
    }

    .calculator-result-value {
        font-size: 2.2rem;
    }

    /* ── Typography fine-tune ────────────────────────── */
    h2 { font-size: clamp(1.5rem, 7vw, 2rem); }
    h3 { font-size: clamp(1.2rem, 5.5vw, 1.6rem); }

    /* ── Footer ─────────────────────────────────────── */
    .footer-content {
        gap: var(--spacing-lg);
    }

    .footer-bottom {
        font-size: 0.8rem;
    }

    /* ── Header ─────────────────────────────────────── */
    .site-header {
        padding: 0;
    }

    .site-logo {
        font-size: 1.2rem;
    }
}

/* ── iPhone Pro — 390 / 393 px wide ────────────────────────── */
@media (max-width: 393px) {

    .hero-badge {
        font-size: 0.72rem;
        padding: 5px 12px;
    }

    .btn {
        padding: 13px 16px;
        font-size: 0.85rem;
        letter-spacing: 0.5px;
    }

    .pricing-price    { font-size: 2.2rem; }
    .mode-returns     { font-size: 1.6rem; }
    .calculator-result-value { font-size: 2rem; }
}

/* ── Pixel 7 — 412 px wide (between 393 and 480) ───────────── */
@media (min-width: 394px) and (max-width: 430px) {

    :root {
        --spacing-xxl: 52px;
        --spacing-xl:  36px;
        --spacing-lg:  28px;
    }

    .hero-section {
        padding-top: 80px;
    }

    .hero-content {
        text-align: center;
    }
}

/* ── Touch-device interaction improvements ──────────────────── */
@media (hover: none) and (pointer: coarse) {

    /* Disable hover lift effects on touch — prevents sticky hover state */
    .mode-card:hover,
    .feature-card:hover,
    .pricing-card:hover {
        transform: none;
        box-shadow: none;
    }

    /* Make tap targets comfortably large (WCAG 2.5.5) */
    .btn,
    .nav-cta,
    .faq-question,
    .mobile-menu-toggle {
        min-height: 48px;
    }

    a {
        -webkit-tap-highlight-color: rgba(245,158,11,0.15);
    }
}

/* ── Landscape phone fix ────────────────────────────────────── */
@media (max-height: 500px) and (orientation: landscape) {
    .hero-section {
        min-height: auto;
        padding-top: 70px;
        padding-bottom: 30px;
    }
}


/* ═══════════════════════════════════════════════════════════════
   TELEGRAM BUTTON — Mobile Fix v25
   iPhone SE (375px), iPhone Pro (390/393px), Pixel 7 (412px)
   Rules appended only — zero existing rules modified.
   ═══════════════════════════════════════════════════════════════ */

/* Desktop — keep the original absolute-right feel using flex flow */
.telegram-channel-btn {
    position: absolute;
    right: 15%;
    top: 72%;
    transform: translateY(-50%);
}

/* Tablet & below — remove absolute positioning */
@media (max-width: 768px) {
    .telegram-channel-btn {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        transform: none !important;
        display: flex !important;
        justify-content: center;
        margin: var(--spacing-md) auto 0 auto !important;
        width: fit-content;
        max-width: 90%;
    }
}

/* iPhone SE (375px) — compact sizing */
@media (max-width: 375px) {
    .telegram-channel-btn {
        font-size: 0.82rem !important;
        padding: 12px 18px !important;
        gap: 8px !important;
        max-width: 95%;
    }

    .telegram-channel-btn svg {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }

    .telegram-channel-btn span:last-child {
        font-size: 0.62rem !important;
        padding: 2px 7px !important;
    }
}

/* iPhone Pro / Pixel 7 (376px–430px) */
@media (min-width: 376px) and (max-width: 430px) {
    .telegram-channel-btn {
        font-size: 0.86rem !important;
        padding: 13px 20px !important;
        gap: 9px !important;
    }

    .telegram-channel-btn svg {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }
}


/* ═══════════════════════════════════════════════════════════════
   TELEGRAM BUTTON — Full Rebuild v26
   Appended only — zero existing rules modified.
   ═══════════════════════════════════════════════════════════════ */

/* Wrapper — positions button relative to hero on desktop */
.telegram-btn-wrap {
    margin-top: var(--spacing-lg);
    display: flex;
    justify-content: flex-start;
}

/* Button base */
.telegram-channel-btn {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    background: linear-gradient(135deg,#0088cc 0%,#0099dd 50%,#006faa 100%);
    color: #fff;
    font-weight: 700;
    font-size: 0.92rem;
    letter-spacing: 0.03em;
    text-decoration: none;
    padding: 15px 26px;
    border-radius: 50px;
    box-shadow: 0 4px 28px rgba(0,136,204,0.5), 0 0 0 1px rgba(255,255,255,0.1);
    white-space: nowrap;
    position: static;
    transform: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.telegram-channel-btn:hover {
    opacity: 0.9;
    transform: translateY(-2px);
    color: #fff;
}

.telegram-free-badge {
    background: rgba(255,255,255,0.2);
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 20px;
    font-weight: 700;
}

/* ── Tablet (≤768px) — full width, centered ── */
@media (max-width: 768px) {
    .telegram-btn-wrap {
        justify-content: center;
        margin-top: var(--spacing-md);
    }

    .telegram-channel-btn {
        width: 100%;
        max-width: 420px;
        justify-content: center;
        font-size: 0.88rem;
        padding: 14px 20px;
    }
}

/* ── iPhone SE (375px) ── */
@media (max-width: 375px) {
    .telegram-channel-btn {
        font-size: 0.78rem;
        padding: 12px 14px;
        gap: 7px;
        max-width: 100%;
    }

    .telegram-channel-btn svg {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }

    .telegram-free-badge {
        font-size: 0.6rem;
        padding: 2px 7px;
    }
}

/* ── iPhone Pro / Pixel 7 (376–430px) ── */
@media (min-width: 376px) and (max-width: 430px) {
    .telegram-channel-btn {
        font-size: 0.83rem;
        padding: 13px 18px;
        gap: 9px;
    }

    .telegram-channel-btn svg {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }
}


/* ═══════════════════════════════════════════════════════════════
   TELEGRAM BUTTON — v27 Desktop Scroll-Reveal + Mobile In-Flow
   Appended only — zero existing rules modified.
   ═══════════════════════════════════════════════════════════════ */

/* ── Desktop: absolute right, hidden until revealed ─────────── */
.telegram-desktop-only {
    display: none; /* hidden by default; JS + media query enables */
}

@media (min-width: 769px) {
    .telegram-desktop-only {
        display: inline-flex;
        position: absolute;
        right: 15%;
        top: 72%;
        transform: translateY(-50%);
        /* scroll-reveal: starts invisible, slides in */
        opacity: 0;
        translate: 0 20px;
        pointer-events: none;
        transition: opacity 0.55s ease, translate 0.55s ease;
    }

    .telegram-desktop-only.tg-revealed {
        opacity: 1;
        translate: 0 0;
        pointer-events: auto;
    }

    /* hide mobile-only wrap on desktop */
    .telegram-mobile-only {
        display: none !important;
    }
}

/* ── Mobile: in-flow below CTA buttons ──────────────────────── */
@media (max-width: 768px) {
    .telegram-desktop-only {
        display: none !important;
    }

    .telegram-mobile-only {
        display: flex !important;
        justify-content: center;
        margin-top: var(--spacing-md);
    }

    .telegram-mobile-only .telegram-channel-btn {
        width: 100%;
        max-width: 420px;
        justify-content: center;
        font-size: 0.88rem;
        padding: 14px 20px;
    }
}

/* ── iPhone SE (≤375px) ─────────────────────────────────────── */
@media (max-width: 375px) {
    .telegram-mobile-only .telegram-channel-btn {
        font-size: 0.78rem;
        padding: 12px 14px;
        gap: 7px;
        max-width: 100%;
    }

    .telegram-mobile-only .telegram-channel-btn svg {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }

    .telegram-mobile-only .telegram-free-badge {
        font-size: 0.6rem;
        padding: 2px 7px;
    }
}

/* ── iPhone Pro / Pixel 7 (376–430px) ──────────────────────── */
@media (min-width: 376px) and (max-width: 430px) {
    .telegram-mobile-only .telegram-channel-btn {
        font-size: 0.83rem;
        padding: 13px 18px;
        gap: 9px;
    }

    .telegram-mobile-only .telegram-channel-btn svg {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }
}

/* ═══════════════════════════════════════════════
   MOBILE MENU DRAWER — v1
   Appended only. No existing rules changed.
   ═══════════════════════════════════════════════ */

/* Overlay backdrop */
.gfs-mob-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.65);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    z-index: 9998;
    opacity: 0;
    transition: opacity 0.28s ease;
}
.gfs-mob-overlay.gfs-mob-open {
    display: block;
    opacity: 1;
}

/* Drawer panel */
.gfs-mob-drawer {
    position: fixed;
    top: 0;
    left: 0;
    width: 78vw;
    max-width: 320px;
    height: 100dvh;
    background: #0A0E1A;
    z-index: 9999;
    transform: translateX(-100%);
    transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    box-shadow: 6px 0 32px rgba(0,0,0,0.6);
    border-right: 1px solid rgba(255,200,87,0.10);
}
.gfs-mob-drawer.gfs-mob-open {
    transform: translateX(0);
}

/* Drawer header — logo + close button */
.gfs-mob-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
}
.gfs-mob-logo a {
    font-size: 1.4rem;
    font-weight: 800;
    text-decoration: none;
    letter-spacing: 1px;
}
.gfs-mob-logo .logo-gold { color: #FFC857; }
.gfs-mob-logo .logo-blue { color: #60A5FA; }

.gfs-mob-close {
    background: rgba(255,255,255,0.06);
    border: none;
    color: #94A3B8;
    font-size: 1.1rem;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, color 0.2s;
    line-height: 1;
}
.gfs-mob-close:hover {
    background: rgba(255,255,255,0.12);
    color: #E2E8F0;
}

/* Nav list */
.gfs-mob-nav {
    flex: 1;
    padding: 10px 0 24px;
}
.gfs-mob-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.gfs-mob-menu-list li {
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.gfs-mob-menu-list li a {
    display: block;
    padding: 15px 24px;
    color: #CBD5E1;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    transition: color 0.2s, background 0.2s;
    letter-spacing: 0.2px;
}
.gfs-mob-menu-list li a:hover {
    color: #FFC857;
    background: rgba(255,200,87,0.05);
}

/* Get License CTA button in drawer */
.gfs-mob-menu-list li a.gfs-mob-cta,
.gfs-mob-menu-list li a.nav-cta {
    display: inline-block;
    margin: 10px 24px;
    padding: 12px 28px;
    background: linear-gradient(135deg, #FFC857, #D97706);
    color: #0A0E1A !important;
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.95rem;
    text-align: center;
    letter-spacing: 0.3px;
    box-shadow: 0 4px 14px rgba(255,200,87,0.28);
}
.gfs-mob-menu-list li a.gfs-mob-cta:hover,
.gfs-mob-menu-list li a.nav-cta:hover {
    opacity: 0.88;
    background: linear-gradient(135deg, #FFC857, #D97706) !important;
}

/* Cart badge in mobile menu */
.gfs-mob-menu-list .gfs-cart-count {
    background: #EF4444;
    color: #fff;
    border-radius: 50%;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 1px 5px;
    margin-left: 4px;
    vertical-align: middle;
}

/* Logged-in user items */
.gfs-mob-menu-list .gfs-el-menu a {
    color: #94A3B8;
}
.gfs-mob-menu-list .xoo-el-username-menu a,
.gfs-mob-menu-list .xoo-el-firstname-menu a {
    color: #FFC857 !important;
    font-weight: 600;
}

/* Only show drawer on mobile */
.gfs-mob-drawer,
.gfs-mob-overlay {
    display: none;
}
@media (max-width: 768px) {
    .gfs-mob-overlay {
        display: none; /* controlled by JS open class */
    }
    .gfs-mob-drawer {
        display: flex;
    }
    .gfs-mob-overlay.gfs-mob-open {
        display: block;
    }
}

/* ═══════════════════════════════════════════════════════════════
   HOME PAGE — Full Mobile Text Alignment & Layout Fix v28
   Matches desktop layout exactly on all mobile screens.
   Appended only — zero existing rules modified.
   ═══════════════════════════════════════════════════════════════ */

/* ── Hero Title: ensure proper centering & no orphan words ──── */
@media (max-width: 768px) {

    .hero-content {
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .hero-title {
        font-size: clamp(2rem, 8.5vw, 2.8rem) !important;
        line-height: 1.08 !important;
        letter-spacing: -0.02em !important;
        text-align: center !important;
        width: 100% !important;
    }

    .hero-subtitle {
        text-align: center !important;
        font-size: clamp(0.95rem, 3.8vw, 1.1rem) !important;
        line-height: 1.7 !important;
        max-width: 100% !important;
    }

    .hero-badge {
        text-align: center !important;
        white-space: normal !important;
        word-break: break-word !important;
        text-overflow: unset !important;
        overflow: visible !important;
        width: auto !important;
        max-width: 95% !important;
    }

    /* Hero feature items — stack as single column, left-aligned bullet */
    .hero-features {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        text-align: left !important;
    }

    .hero-feature-item {
        display: flex !important;
        align-items: flex-start !important;
        gap: 10px !important;
        font-size: clamp(0.88rem, 3.5vw, 1rem) !important;
        line-height: 1.55 !important;
        text-align: left !important;
        width: 100% !important;
    }

    .hero-feature-item::before {
        flex-shrink: 0 !important;
        margin-top: 3px !important;
    }

    /* CTA group: full width buttons */
    .hero-cta-group {
        flex-direction: column !important;
        width: 100% !important;
        gap: 12px !important;
    }
    .hero-cta-group .btn {
        width: 100% !important;
        text-align: center !important;
        justify-content: center !important;
    }

    /* Live Proof section headings + paragraphs: center */
    .section .text-center h2,
    .section-dark .text-center h2 {
        text-align: center !important;
    }

    /* Comparison grid: What Other EAs Do vs What We Do
       inline style uses space variants — cover all patterns */
    [style*="grid-template-columns:1fr 1fr"],
    [style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }

    /* Exception: keep 2-col for stat cards inside account cards
       (those have gap:10px not gap:var(--spacing-lg)) */
    [style*="grid-template-columns:1fr 1fr"][style*="gap:10px"],
    [style*="grid-template-columns: 1fr 1fr"][style*="gap: 10px"],
    [style*="grid-template-columns:1fr 1fr"][style*="gap:8px"],
    [style*="grid-template-columns: 1fr 1fr"][style*="gap: 8px"] {
        grid-template-columns: 1fr 1fr !important;
    }

    /* Community cards: full width single column */
    [style*="grid-template-columns:repeat(auto-fit,minmax(240px,1fr))"] {
        grid-template-columns: 1fr !important;
    }

    /* 3-step cards: single column */
    [style*="grid-template-columns:repeat(auto-fit,minmax(290px,1fr))"] {
        grid-template-columns: 1fr !important;
    }

    /* Steps cards: ensure number badge doesn't clip */
    [style*="position:relative;box-shadow"] {
        margin-top: 28px !important;
    }

    /* Section text paragraphs: center on mobile */
    .section > .container > div[style*="text-align:center"] p,
    .section-dark > .container > div[style*="text-align:center"] p {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Live account account cards two-col stat grid: keep 2 cols */
    .section-dark .container > div > div[style*="border-radius:var(--radius-lg)"] > div[style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr 1fr !important;
    }

    /* pricing section title */
    .pricing-section-title,
    .pricing-section-subtitle {
        text-align: center !important;
    }

    /* What you get grid: 2 col on mobile */
    .what-you-get-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    /* Final CTA heading */
    [style*="font-size:2rem;margin-bottom"] {
        font-size: clamp(1.5rem, 6.5vw, 2rem) !important;
        text-align: center !important;
    }
}

/* ── Tightest phones (≤390px) ───────────────────────────────── */
@media (max-width: 390px) {

    .hero-title {
        font-size: clamp(1.8rem, 8vw, 2.4rem) !important;
    }

    .hero-subtitle {
        font-size: 0.93rem !important;
    }

    .hero-feature-item {
        font-size: 0.85rem !important;
    }

    /* What you get: single col on very small phones */
    .what-you-get-grid {
        grid-template-columns: 1fr !important;
    }

    /* FAQ text */
    .faq-question {
        font-size: 0.92rem !important;
    }
}

/* ── Inline style section headings: always center on mobile ─── */
@media (max-width: 768px) {

    /* Section-level inline h2/h3 */
    .section h2,
    .section h3,
    .section-dark h2,
    .section-dark h3 {
        text-align: center !important;
    }

    /* Section paragraph text */
    .section > .container > * > p[style],
    .section-dark > .container > * > p[style] {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 100% !important;
    }

    /* Trading modes section subtext */
    .trading-modes + p {
        text-align: center !important;
    }

    /* Verification badges: wrap nicely */
    .verification-badges {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 12px !important;
    }

    .verification-badge {
        flex: 0 1 auto !important;
        white-space: nowrap !important;
    }

    /* Calculator controls: single column */
    .calculator-controls {
        grid-template-columns: 1fr !important;
    }

    /* Bottom CTA: center align text */
    [style*="text-align:center;margin-bottom:var(--spacing-xl)"] a.btn {
        display: inline-block !important;
        min-width: 260px !important;
    }
}

/* ═══════════════════════════════════════════════════════════════
   HOME PAGE — COMPLETE MOBILE OPTIMISATION v29
   Coverage: Hero → Final CTA (full page, top to bottom)
   Target:   ≤768px tablets / ≤480px phones / ≤390px small phones
   Rule:     APPEND ONLY — zero existing rules modified
   Desktop:  untouched (all rules are inside media queries)
   ═══════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────
   SHARED BASE — ≤768px
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* Prevent ALL horizontal overflow */
    html, body {
        overflow-x: hidden !important;
        max-width: 100% !important;
    }

    .container,
    .container-wide {
        padding: 0 18px !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* Section vertical padding */
    .section,
    .section-dark {
        padding: 48px 0 !important;
    }

    /* ── Global typography scale ── */
    h1 { font-size: clamp(1.9rem, 7.5vw, 2.6rem) !important; line-height: 1.1 !important; }
    h2 { font-size: clamp(1.5rem, 6vw,  2.1rem) !important; line-height: 1.15 !important; }
    h3 { font-size: clamp(1.15rem, 4.5vw, 1.6rem) !important; line-height: 1.25 !important; }
    p  { font-size: clamp(0.9rem, 3.5vw, 1rem) !important; }
}

/* ───────────────────────────────────────────────────────────────
   1. HERO SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .hero-section {
        padding-top: 90px !important;
        padding-bottom: 48px !important;
        min-height: auto !important;
        align-items: flex-start !important;
    }

    .hero-content {
        position: relative !important;
        z-index: 1 !important;
        max-width: 100% !important;
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    /* Badge */
    .hero-badge {
        display: inline-flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        text-align: center !important;
        font-size: 0.78rem !important;
        padding: 6px 14px !important;
        max-width: 95% !important;
        white-space: normal !important;
        line-height: 1.5 !important;
    }

    /* Title */
    .hero-title {
        font-size: clamp(2rem, 8vw, 2.8rem) !important;
        line-height: 1.08 !important;
        letter-spacing: -0.02em !important;
        text-align: center !important;
        width: 100% !important;
        margin-bottom: 16px !important;
    }

    /* Subtitle */
    .hero-subtitle {
        font-size: clamp(0.93rem, 3.5vw, 1.05rem) !important;
        line-height: 1.72 !important;
        text-align: center !important;
        max-width: 100% !important;
        margin-bottom: 20px !important;
    }

    /* Feature bullets */
    .hero-features {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        margin-bottom: 20px !important;
    }

    .hero-feature-item {
        display: flex !important;
        align-items: flex-start !important;
        gap: 10px !important;
        font-size: clamp(0.88rem, 3.4vw, 0.98rem) !important;
        line-height: 1.55 !important;
        text-align: left !important;
        width: 100% !important;
    }

    .hero-feature-item strong {
        white-space: nowrap !important;
    }

    .hero-feature-item::before {
        flex-shrink: 0 !important;
        margin-top: 2px !important;
    }

    /* CTA buttons */
    .hero-cta-group {
        flex-direction: column !important;
        width: 100% !important;
        gap: 12px !important;
        align-items: center !important;
    }

    .hero-cta-group .btn {
        width: 100% !important;
        text-align: center !important;
        justify-content: center !important;
        font-size: 0.92rem !important;
        padding: 15px 20px !important;
        letter-spacing: 0.5px !important;
    }

    /* Telegram mobile button wrapper */
    .telegram-mobile-only {
        width: 100% !important;
    }

    .telegram-mobile-only .telegram-channel-btn {
        width: 100% !important;
        max-width: 100% !important;
        justify-content: center !important;
        font-size: 0.88rem !important;
        padding: 14px 18px !important;
        box-sizing: border-box !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   2. LIVE PROOF SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* Section header */
    .section-dark .text-center h2,
    .section .text-center h2 {
        text-align: center !important;
    }

    /* "Live Performance" badge + description */
    .section-dark .text-center p,
    .section .text-center p {
        text-align: center !important;
        font-size: clamp(0.9rem, 3.5vw, 1.05rem) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Account cards container: 2-col → 1-col */
    [style*="grid-template-columns:repeat(auto-fit,minmax(320px"] {
        grid-template-columns: 1fr !important;
    }

    /* Inside each account card: stat 2×2 grid — KEEP 2 cols */
    [style*="grid-template-columns:1fr 1fr"][style*="gap:10px"],
    [style*="grid-template-columns:1fr 1fr"][style*="gap: 10px"] {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    /* Stat card font scale */
    [style*="font-size:1.6rem"][style*="font-weight:800"] {
        font-size: 1.25rem !important;
    }

    /* Extra stats 2-col (Profit/Abs Gain etc) — keep 2 col */
    [style*="grid-template-columns:1fr 1fr"][style*="gap:8px"],
    [style*="grid-template-columns:1fr 1fr"][style*="gap: 8px"] {
        grid-template-columns: 1fr 1fr !important;
        font-size: 0.78rem !important;
    }

    /* Comparison grid (What Other EAs Do / What We Do) */
    [style*="display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg)"],
    [style*="display:grid"][style*="grid-template-columns:1fr 1fr"][style*="gap:var(--spacing-lg)"] {
        grid-template-columns: 1fr !important;
    }

    /* Comparison card text */
    [style*="grid-template-columns:1fr 1fr"] ul li {
        font-size: 0.88rem !important;
        padding: 8px 0 !important;
    }

    /* View on MyFXBook buttons */
    .section-dark a.btn,
    .section a.btn {
        font-size: 0.85rem !important;
        padding: 13px 16px !important;
        letter-spacing: 0.3px !important;
    }

    /* Bottom CTA row */
    [style*="text-align:center;margin-bottom:var(--spacing-xl)"] .btn {
        width: 100% !important;
        display: block !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   3. CALCULATOR SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .calculator-section {
        padding: 24px 18px !important;
        margin: 0 !important;
    }

    .calculator-title {
        font-size: clamp(1.3rem, 5.5vw, 1.8rem) !important;
        text-align: center !important;
        margin-bottom: 12px !important;
    }

    .calculator-controls {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .calculator-controls select,
    .calculator-controls input[type="number"] {
        width: 100% !important;
        font-size: 0.93rem !important;
        padding: 13px 14px !important;
    }

    .calculator-controls label {
        font-size: 0.88rem !important;
    }

    .calculator-result {
        padding: 20px 16px !important;
    }

    .calculator-result h3 {
        font-size: 1.1rem !important;
        margin-bottom: 10px !important;
    }

    .calculator-result-value {
        font-size: 2.2rem !important;
        line-height: 1.2 !important;
    }

    .calculator-result p {
        font-size: 0.85rem !important;
        margin-top: 10px !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   4. TRADING MODES SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .trading-modes {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    .mode-card {
        padding: 20px 18px !important;
    }

    .mode-badge {
        font-size: 0.68rem !important;
        padding: 5px 12px !important;
    }

    .mode-icon {
        font-size: 2rem !important;
        margin-bottom: 10px !important;
        text-align: center !important;
    }

    .mode-card h3 {
        font-size: 1.25rem !important;
        margin-bottom: 4px !important;
    }

    .mode-returns {
        font-size: 2rem !important;
        line-height: 1.1 !important;
        text-align: center !important;
    }

    .mode-returns-label {
        font-size: 0.83rem !important;
        text-align: center !important;
        margin-bottom: 14px !important;
    }

    .mode-features li {
        font-size: 0.88rem !important;
        padding: 6px 0 !important;
        line-height: 1.45 !important;
    }

    /* Section description text */
    .section-dark .container > .text-center > p,
    .section .container > .text-center > p {
        font-size: clamp(0.92rem, 3.5vw, 1.05rem) !important;
        text-align: center !important;
        max-width: 100% !important;
    }

    /* Prop-firm note paragraph */
    .section-dark .container > .text-center > p:nth-child(3) {
        font-size: 0.88rem !important;
        line-height: 1.65 !important;
    }

    /* Bottom note: "All four modes…" */
    .trading-modes + p {
        font-size: 0.9rem !important;
        text-align: center !important;
        margin-top: 20px !important;
    }

    /* Verification badges */
    .verification-badges {
        flex-wrap: wrap !important;
        gap: 10px !important;
        padding: 16px 0 !important;
        justify-content: center !important;
    }

    .verification-badge {
        flex: 0 1 auto !important;
        padding: 8px 14px !important;
        font-size: 0.83rem !important;
        white-space: nowrap !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   5. WHY WE DOMINATE — FEATURES GRID
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .features-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .feature-card {
        padding: 20px 18px !important;
    }

    .feature-icon {
        font-size: 2rem !important;
        margin-bottom: 10px !important;
        text-align: center !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .feature-title {
        font-size: 1.1rem !important;
        margin-bottom: 8px !important;
    }

    .feature-description {
        font-size: 0.88rem !important;
        line-height: 1.65 !important;
    }

    /* "Advanced Features" pill badge */
    .section .container > .text-center > div[style*="display:inline-block"] {
        font-size: 0.72rem !important;
    }

    /* Section heading & subtitle */
    .section .container .text-center h2 {
        text-align: center !important;
        font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important;
    }
    .section .container .text-center p {
        text-align: center !important;
        font-size: 0.92rem !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   6. START IN 3 STEPS
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* 3-step cards grid */
    [style*="grid-template-columns:repeat(auto-fit,minmax(290px"] {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }

    /* Each card: add top margin for the number badge that sticks out */
    [style*="position:absolute;top:-20px"] ~ * {
        margin-top: 0 !important;
    }

    /* Step card inner */
    [style*="border-radius:var(--radius-lg);padding:var(--spacing-xl);position:relative"] {
        padding: 20px 18px !important;
        margin-top: 24px !important;
    }

    /* Step heading */
    [style*="margin-top:var(--spacing-md);font-size:1.25rem;color:var(--color-accent)"] {
        font-size: 1.1rem !important;
        margin-top: 14px !important;
    }

    /* Step paragraph */
    [style*="color:var(--color-text-secondary)"] {
        font-size: 0.88rem !important;
        line-height: 1.65 !important;
    }

    /* "Steps" section heading */
    .section-dark .container > .text-center > h2 {
        font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important;
        text-align: center !important;
    }

    .section-dark .container > .text-center > p {
        font-size: 0.92rem !important;
        text-align: center !important;
    }

    /* Free installation notice box */
    [style*="background:rgba(74,222,128,0.05);border:1px solid rgba(74,222,128"] {
        padding: 18px 16px !important;
        text-align: center !important;
    }

    [style*="background:rgba(74,222,128,0.05)"] p {
        font-size: 0.88rem !important;
        line-height: 1.6 !important;
        text-align: center !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   7. COMMUNITY SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* 4 community cards grid → 1 col */
    [style*="grid-template-columns:repeat(auto-fit,minmax(240px"] {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    /* Community card inner */
    [style*="border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center"] {
        padding: 22px 18px !important;
    }

    /* Card emoji */
    [style*="font-size:2.8rem;margin-bottom:var(--spacing-sm)"] {
        font-size: 2.2rem !important;
    }

    /* Card heading */
    [style*="color:#29B6F6;margin-bottom:10px;font-size:1.15rem"],
    [style*="color:#60A5FA;margin-bottom:10px;font-size:1.15rem"],
    [style*="color:#F87171;margin-bottom:10px;font-size:1.15rem"] {
        font-size: 1.05rem !important;
        margin-bottom: 8px !important;
    }

    /* Card paragraph */
    [style*="color:var(--color-text-secondary);font-size:0.88rem;margin-bottom:var(--spacing-md)"] {
        font-size: 0.85rem !important;
        line-height: 1.55 !important;
    }

    /* Platform handle / CTA span */
    [style*="display:inline-block;padding:9px 18px"] {
        font-size: 0.78rem !important;
        padding: 9px 14px !important;
    }

    /* Section heading + subtext */
    .section .container > .text-center > h2 {
        font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important;
        text-align: center !important;
    }
    .section .container > .text-center > p {
        font-size: 0.92rem !important;
        text-align: center !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   8. FAQ SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .faq-list {
        max-width: 100% !important;
    }

    .faq-item {
        margin-bottom: 10px !important;
        border-radius: 12px !important;
    }

    .faq-question {
        padding: 16px 14px !important;
        font-size: 0.93rem !important;
        font-weight: 600 !important;
        line-height: 1.45 !important;
        gap: 10px !important;
    }

    /* Question text: allow wrap */
    .faq-question > span:first-child {
        text-align: left !important;
        flex: 1 !important;
        word-break: break-word !important;
    }

    .faq-icon {
        font-size: 1.3rem !important;
        flex-shrink: 0 !important;
    }

    .faq-answer-content {
        padding: 0 14px 16px !important;
        font-size: 0.88rem !important;
        line-height: 1.68 !important;
    }

    /* List inside FAQ answer */
    .faq-answer-content ul {
        margin: 8px 0 0 16px !important;
        line-height: 2 !important;
    }

    .faq-answer-content ul li {
        font-size: 0.87rem !important;
    }

    /* Section heading */
    .section-dark #FAQ + div h2,
    .section-dark .container .text-center h2 {
        font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important;
        text-align: center !important;
    }
    .section-dark .container .text-center p {
        font-size: 0.92rem !important;
        text-align: center !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   9. PRICING SECTION
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .pricing-section-title {
        font-size: clamp(1.6rem, 6.5vw, 2.2rem) !important;
        text-align: center !important;
    }

    .pricing-section-subtitle {
        font-size: 0.93rem !important;
        text-align: center !important;
    }

    .pricing-cards {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
        margin-top: 32px !important;
    }

    .pricing-features {
        grid-template-columns: 1fr !important;
    }

    .pricing-card {
        padding: 18px 14px !important;
    }

    .pricing-card.featured {
        margin-top: 16px !important;
    }

    .pricing-badge {
        font-size: 0.68rem !important;
        padding: 7px 16px !important;
    }

    .pricing-plan-name {
        font-size: 0.78rem !important;
        letter-spacing: 1px !important;
        line-height: 1.4 !important;
    }

    .pricing-price {
        font-size: 2.8rem !important;
        margin-bottom: 4px !important;
    }

    .pricing-period {
        font-size: 0.82rem !important;
    }

    .pricing-features {
        margin-bottom: 20px !important;
    }

    .pricing-features li {
        font-size: 0.88rem !important;
        padding: 9px 0 !important;
        line-height: 1.45 !important;
        gap: 10px !important;
    }

    .pricing-features li::before {
        font-size: 1rem !important;
        margin-top: 1px !important;
    }

    .pricing-button {
        font-size: 0.9rem !important;
        padding: 14px 20px !important;
    }

    /* What You Get section */
    .what-you-get-section {
        padding: 24px 18px !important;
        margin-top: 32px !important;
    }

    .what-you-get-section h2 {
        font-size: clamp(1.3rem, 5vw, 1.7rem) !important;
        text-align: center !important;
    }

    .what-you-get-section > p {
        font-size: 0.9rem !important;
        text-align: center !important;
    }

    .what-you-get-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
        margin-top: 16px !important;
    }

    .package-item {
        font-size: 0.83rem !important;
        padding: 8px !important;
        gap: 8px !important;
        line-height: 1.4 !important;
    }

    .package-item::before {
        font-size: 1rem !important;
    }

    /* Footnote (*Skyrocket Mode…) */
    [style*="text-align:center;margin-top:var(--spacing-lg);font-size:0.9rem"] {
        font-size: 0.8rem !important;
        line-height: 1.6 !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   10. FINAL CTA BLOCK
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* "Ready to Start Profiting" CTA box */
    [style*="background:linear-gradient(135deg,rgba(220,38,38,0.08)"] {
        padding: 28px 18px !important;
        text-align: center !important;
    }

    [style*="font-size:2rem;margin-bottom:var(--spacing-md)"] {
        font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important;
        text-align: center !important;
        line-height: 1.2 !important;
    }

    [style*="font-size:1.1rem;margin-bottom:var(--spacing-lg)"] {
        font-size: 0.9rem !important;
        text-align: center !important;
        line-height: 1.65 !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* "Get My License Now" button */
    [style*="font-size:1.05rem;padding:18px 44px"] {
        font-size: 0.93rem !important;
        padding: 16px 28px !important;
        display: inline-block !important;
        width: auto !important;
        max-width: 100% !important;
    }

    /* Social links row */
    [style*="margin-top:var(--spacing-md);color:var(--color-text-muted);font-size:0.88rem"] {
        font-size: 0.82rem !important;
        text-align: center !important;
        line-height: 2 !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   SMALL PHONES — ≤480px additional tighten
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 480px) {

    .container,
    .container-wide {
        padding: 0 14px !important;
    }

    /* Hero */
    .hero-title {
        font-size: clamp(1.8rem, 7.5vw, 2.4rem) !important;
    }
    .hero-subtitle {
        font-size: 0.9rem !important;
    }
    .hero-feature-item {
        font-size: 0.85rem !important;
    }
    .hero-cta-group .btn {
        font-size: 0.87rem !important;
        padding: 14px 16px !important;
    }

    /* Calculator */
    .calculator-result-value {
        font-size: 1.9rem !important;
    }

    /* Trading modes */
    .mode-returns {
        font-size: 1.8rem !important;
    }

    /* Pricing */
    .pricing-price {
        font-size: 2.4rem !important;
    }

    /* What you get: single col on very small */
    .what-you-get-grid {
        grid-template-columns: 1fr !important;
    }

    /* FAQ */
    .faq-question {
        font-size: 0.88rem !important;
        padding: 14px 12px !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   SMALLEST PHONES — ≤390px
   ─────────────────────────────────────────────────────────────── */
@media (max-width: 390px) {

    .container,
    .container-wide {
        padding: 0 12px !important;
    }

    h1 { font-size: 1.75rem !important; }
    h2 { font-size: 1.35rem !important; }
    h3 { font-size: 1.1rem !important; }

    .hero-title {
        font-size: 1.8rem !important;
        line-height: 1.1 !important;
    }

    .hero-badge {
        font-size: 0.72rem !important;
        padding: 5px 12px !important;
    }

    .hero-subtitle {
        font-size: 0.88rem !important;
    }

    .hero-feature-item {
        font-size: 0.83rem !important;
    }

    .hero-cta-group .btn {
        font-size: 0.85rem !important;
        padding: 13px 14px !important;
    }

    .telegram-mobile-only .telegram-channel-btn {
        font-size: 0.78rem !important;
        padding: 12px 14px !important;
        gap: 7px !important;
    }

    .telegram-free-badge {
        font-size: 0.6rem !important;
        padding: 2px 7px !important;
    }

    .pricing-price {
        font-size: 2.1rem !important;
    }

    .pricing-plan-name {
        font-size: 0.72rem !important;
    }

    .mode-returns {
        font-size: 1.6rem !important;
    }

    .calculator-result-value {
        font-size: 1.7rem !important;
    }

    .faq-question {
        font-size: 0.84rem !important;
    }

    .verification-badge {
        font-size: 0.78rem !important;
        padding: 6px 10px !important;
    }
}

/* ── OTP / Verification Input Fields Fix ──────── */
.xoo-el-otp-input,
.xoo-el-otp-wrap input,
.xoo-el-verify input,
.xoo-cp-otp-input,
input.otp-input,
input[class*="otp"],
input[class*="pin"],
input[class*="digit"],
.xoo-el-form-popup input[maxlength="1"] {
    color: #ffffff !important;
    caret-color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
    text-align: center !important;
}

/* ═══════════════════════════════════════════════════════════
   GFS PREMIUM LOGIN / SIGNUP POPUP — COMPLETE OVERRIDE
   Golden Forex Scalping Brand · Deep Navy Theme
   ═══════════════════════════════════════════════════════════ */

/* ── Backdrop overlay ── */
.xoo-el-popup-active body,
body.xoo-el-popup-active {
    overflow: hidden;
}

.xoo-el-container:not(.xoo-el-style-slider) .xoo-el-modal {
    background: rgba(6, 9, 20, 0.88) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

/* ── Popup inner wrapper ── */
.xoo-el-container:not(.xoo-el-style-slider) .xoo-el-inmodal {
    background: linear-gradient(160deg, #151B3B 0%, #0A0E27 60%, #060914 100%) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    border-radius: 20px !important;
    box-shadow:
        0 0 0 1px rgba(59, 130, 246, 0.08),
        0 30px 80px rgba(0, 0, 0, 0.7),
        0 0 60px rgba(245, 158, 11, 0.06) !important;
    overflow: hidden !important;
    max-width: 440px !important;
    width: 100% !important;
}

/* ── Close button ── */
span.xoo-el-close {
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1px solid rgba(245, 158, 11, 0.3) !important;
    color: #F59E0B !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
    top: 14px !important;
    right: 14px !important;
}
span.xoo-el-close:hover {
    background: rgba(245, 158, 11, 0.25) !important;
    color: #FCD34D !important;
    border-color: rgba(245, 158, 11, 0.6) !important;
}

/* ── Tabs: Login / Sign Up ── */
.xoo-el-form-container ul.xoo-el-tabs {
    display: flex !important;
    padding: 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(245, 158, 11, 0.15) !important;
    background: rgba(6, 9, 20, 0.6) !important;
    list-style: none !important;
}

.xoo-el-form-container ul.xoo-el-tabs li {
    flex: 1 !important;
    padding: 18px 20px !important;
    text-align: center !important;
    cursor: pointer !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    color: #64748B !important;
    background: transparent !important;
    border: none !important;
    transition: all 0.25s ease !important;
    position: relative !important;
    list-style: none !important;
    margin: 0 !important;
}

.xoo-el-form-container ul.xoo-el-tabs li::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) scaleX(0) !important;
    width: 70% !important;
    height: 2px !important;
    background: linear-gradient(90deg, #F59E0B, #FCD34D) !important;
    border-radius: 2px 2px 0 0 !important;
    transition: transform 0.25s ease !important;
}

.xoo-el-form-container ul.xoo-el-tabs li.xoo-el-active {
    color: #F59E0B !important;
    background: rgba(245, 158, 11, 0.06) !important;
    pointer-events: none !important;
    font-weight: 700 !important;
}

.xoo-el-form-container ul.xoo-el-tabs li.xoo-el-active::after {
    transform: translateX(-50%) scaleX(1) !important;
}

.xoo-el-form-container ul.xoo-el-tabs li:not(.xoo-el-active):hover {
    color: #94A3B8 !important;
    background: rgba(255, 255, 255, 0.03) !important;
}

/* ── Form sections padding ── */
.xoo-el-main,
.xoo-el-section,
.xoo-el-form-container {
    background: transparent !important;
}

.xoo-el-main {
    padding: 28px 28px 24px !important;
}

/* ── Input fields ── */
.xoo-aff-input-group {
    display: flex !important;
    align-items: center !important;
    background: rgba(21, 27, 59, 0.8) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    margin-bottom: 14px !important;
}

.xoo-aff-input-group:focus-within {
    border-color: rgba(245, 158, 11, 0.5) !important;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.08) !important;
}

.xoo-aff-input-group svg.xoo-aff-input-icon {
    padding: 10px 12px !important;
    max-width: 42px !important;
    min-width: 42px !important;
    background: rgba(245, 158, 11, 0.08) !important;
    border-right: 1px solid rgba(245, 158, 11, 0.12) !important;
    fill: #F59E0B !important;
    color: #F59E0B !important;
}

.xoo-aff-input-group input,
.xoo-aff-input-group input[type="text"],
.xoo-aff-input-group input[type="email"],
.xoo-aff-input-group input[type="password"],
.xoo-aff-input-group input[type="tel"] {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.92rem !important;
    padding: 14px 16px !important;
    flex: 1 !important;
    width: 100% !important;
    -webkit-text-fill-color: #ffffff !important;
}

.xoo-aff-input-group input::placeholder {
    color: #64748B !important;
    opacity: 1 !important;
}

/* Password toggle eye icon */
.xoo-aff-input-group .xoo-aff-password-eye,
.xoo-aff-input-group .xoo-el-pw-eye {
    padding: 0 14px !important;
    color: #64748B !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
}
.xoo-aff-input-group .xoo-aff-password-eye:hover,
.xoo-aff-input-group .xoo-el-pw-eye:hover {
    color: #F59E0B !important;
}

/* ── Labels ── */
label.xoo-el-form-label,
.xoo-el-form-label {
    color: #94A3B8 !important;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    margin-bottom: 6px !important;
    display: block !important;
}

/* ── Checkbox + Terms ── */
.xoo-el-login-btm-fields,
.xoo-el-fields-cont {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 8px 0 18px !important;
}

.xoo-el-login-btm-fields input[type="checkbox"],
.xoo-el-fields-cont input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    accent-color: #F59E0B !important;
    cursor: pointer !important;
}

.xoo-el-login-btm-fields label,
.xoo-el-fields-cont label {
    color: #94A3B8 !important;
    font-size: 0.85rem !important;
    margin: 0 !important;
}

.xoo-el-login-btm-fields label a,
.xoo-el-fields-cont label a,
.xoo-el-form-txt a {
    color: #F59E0B !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: color 0.2s ease !important;
}

.xoo-el-login-btm-fields label a:hover,
.xoo-el-fields-cont label a:hover,
.xoo-el-form-txt a:hover {
    color: #FCD34D !important;
}

/* Forgot Password link */
a.xoo-el-lostpw-tgr {
    color: #F59E0B !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
    margin-left: auto !important;
}
a.xoo-el-lostpw-tgr:hover {
    color: #FCD34D !important;
}

/* ── Submit buttons: SIGN IN / SIGN UP / EMAIL RESET LINK ── */
.xoo-el-form-container button.button.btn.xoo-el-action-btn,
button.xoo-el-action-btn,
.xoo-el-action-btn {
    background: linear-gradient(135deg, #F59E0B 0%, #FCD34D 100%) !important;
    color: #0A0E27 !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 15px 24px !important;
    font-family: 'Poppins', 'Inter', sans-serif !important;
    font-size: 0.92rem !important;
    font-weight: 800 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    width: 100% !important;
    margin-top: 6px !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 20px rgba(245, 158, 11, 0.3) !important;
    position: relative !important;
    overflow: hidden !important;
}

.xoo-el-form-container button.button.btn.xoo-el-action-btn:hover,
button.xoo-el-action-btn:hover,
.xoo-el-action-btn:hover {
    background: linear-gradient(135deg, #D97706 0%, #F59E0B 100%) !important;
    box-shadow: 0 6px 28px rgba(245, 158, 11, 0.45) !important;
    transform: translateY(-1px) !important;
}

/* ── Lost Password description text ── */
.xoo-el-form-resetpw .xoo-el-form-txt,
.xoo-el-form-txt {
    color: #94A3B8 !important;
    font-size: 0.88rem !important;
    line-height: 1.7 !important;
    text-align: center !important;
    margin-bottom: 20px !important;
    font-style: normal !important;
    background: rgba(59, 130, 246, 0.06) !important;
    border: 1px solid rgba(59, 130, 246, 0.12) !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
}

/* ── Alerts / Notices ── */
.xoo-el-notice,
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
    border-radius: 8px !important;
    font-size: 0.85rem !important;
    padding: 10px 14px !important;
    border: none !important;
    margin-bottom: 14px !important;
}

.xoo-el-notice.xoo-el-alert-error {
    background: rgba(220, 38, 38, 0.12) !important;
    border: 1px solid rgba(220, 38, 38, 0.3) !important;
    color: #FCA5A5 !important;
}

.xoo-el-notice.xoo-el-alert-success {
    background: rgba(74, 222, 128, 0.1) !important;
    border: 1px solid rgba(74, 222, 128, 0.25) !important;
    color: #86EFAC !important;
}

.xoo-el-notice.xoo-el-alert-warning {
    background: rgba(245, 158, 11, 0.1) !important;
    border: 1px solid rgba(245, 158, 11, 0.25) !important;
    color: #FCD34D !important;
}

/* ── Remember me row alignment ── */
.xoo-el-login-btm-fields {
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}

/* ── OTP / Verification digit inputs ── */
.xoo-el-otp-input,
.xoo-el-otp-wrap input,
.xoo-el-verify input,
.xoo-cp-otp-input,
input.otp-input,
input[class*="otp"],
input[class*="pin"],
input[class*="digit"],
.xoo-el-form-popup input[maxlength="1"] {
    background: rgba(59, 130, 246, 0.15) !important;
    border: 2px solid rgba(59, 130, 246, 0.4) !important;
    border-radius: 50% !important;
    color: #ffffff !important;
    caret-color: #F59E0B !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
    text-align: center !important;
    width: 44px !important;
    height: 44px !important;
    transition: border-color 0.2s ease !important;
}

.xoo-el-form-popup input[maxlength="1"]:focus {
    border-color: #F59E0B !important;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15) !important;
    outline: none !important;
}

/* ── OTP input — force visible text on ALL devices ── */
.xoo-el-otp-input,
.xoo-el-otp-wrap input,
.xoo-el-verify input,
.xoo-cp-otp-input,
input.otp-input,
input[class*="otp"],
input[class*="pin"],
input[class*="digit"],
.xoo-el-form-popup input[maxlength="1"],
.xoo-el-fields input[maxlength="1"] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #F59E0B !important;
    background: rgba(30, 58, 138, 0.35) !important;
    background-color: rgba(30, 58, 138, 0.35) !important;
    border: 2px solid rgba(59, 130, 246, 0.5) !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
    text-align: center !important;
    width: 44px !important;
    height: 44px !important;
    opacity: 1 !important;
}

/* Autofill override — prevents browser from overriding bg/color */
.xoo-el-otp-input:-webkit-autofill,
.xoo-el-otp-wrap input:-webkit-autofill,
.xoo-el-form-popup input[maxlength="1"]:-webkit-autofill,
.xoo-el-fields input[maxlength="1"]:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px rgba(30, 58, 138, 0.35) inset !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #F59E0B !important;
}

/* Email input fix — white text on dark bg */
.xoo-el-fields input[type="email"],
.xoo-el-fields input[type="text"],
.xoo-el-fields input[type="password"] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: rgba(15, 23, 60, 0.85) !important;
    background-color: rgba(15, 23, 60, 0.85) !important;
}

.xoo-el-fields input[type="email"]:-webkit-autofill,
.xoo-el-fields input[type="text"]:-webkit-autofill,
.xoo-el-fields input[type="password"]:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px rgba(15, 23, 60, 0.85) inset !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* ── Scrollbar inside popup ── */
.xoo-el-srcont::-webkit-scrollbar { width: 5px !important; }
.xoo-el-srcont::-webkit-scrollbar-track { background: #0A0E27 !important; }
.xoo-el-srcont::-webkit-scrollbar-thumb {
    background: rgba(245, 158, 11, 0.3) !important;
    border-radius: 50px !important;
}

/* ── Golden accent top border on popup ── */
.xoo-el-container:not(.xoo-el-style-slider) .xoo-el-inmodal::before {
    content: '' !important;
    display: block !important;
    height: 3px !important;
    background: linear-gradient(90deg, #1E3A8A 0%, #F59E0B 50%, #1E3A8A 100%) !important;
    border-radius: 20px 20px 0 0 !important;
}

/* ── Small screen responsive ── */
@media (max-width: 600px) {
    .xoo-el-container:not(.xoo-el-style-slider) .xoo-el-inmodal {
        border-radius: 14px !important;
        max-width: 94vw !important;
    }
    .xoo-el-main {
        padding: 20px 16px !important;
    }
}

/* ═══════════════════════════════════════════════════════════════
   HERO CTA + TELEGRAM BUTTONS — Mobile Size Reduce
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {

    /* GET INSTANT ACCESS + VIEW LIVE ACCOUNT */
    .hero-cta-group .btn {
        font-size: 0.80rem !important;
        padding: 11px 14px !important;
        letter-spacing: 0.02em !important;
    }

    /* Join Official Telegram Channel FREE */
    .telegram-channel-btn,
    .telegram-mobile-only .telegram-channel-btn {
        font-size: 0.80rem !important;
        padding: 11px 16px !important;
        gap: 8px !important;
    }

    .telegram-free-badge {
        font-size: 0.62rem !important;
        padding: 2px 8px !important;
    }

    .telegram-channel-btn svg {
        width: 18px !important;
        height: 18px !important;
        flex-shrink: 0 !important;
    }
}

@media (max-width: 390px) {

    .hero-cta-group .btn {
        font-size: 0.75rem !important;
        padding: 10px 12px !important;
    }

    .telegram-channel-btn,
    .telegram-mobile-only .telegram-channel-btn {
        font-size: 0.74rem !important;
        padding: 10px 13px !important;
        gap: 7px !important;
    }

    .telegram-free-badge {
        font-size: 0.58rem !important;
        padding: 2px 6px !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   CALCULATOR — Premium Slider v2 (Full Rebuild)
   ═══════════════════════════════════════════════════════════════ */

/* ── Mode select ── */
.gfs-calc-mode-wrap { margin-bottom: 24px; }

.gfs-calc-label {
    display: block;
    margin-bottom: 8px;
    color: #94A3B8;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.gfs-calc-select-wrap { position: relative; }

.gfs-calc-select {
    width: 100%;
    padding: 14px 44px 14px 16px;
    background: rgba(255,255,255,0.04);
    border: 1.5px solid rgba(255,200,87,0.18);
    border-radius: 12px;
    color: #E2E8F0;
    font-size: 0.95rem;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    font-family: inherit;
}
.gfs-calc-select:focus {
    border-color: rgba(255,200,87,0.5);
    box-shadow: 0 0 0 3px rgba(255,200,87,0.08);
}
.gfs-calc-select option { background: #0D1220; color: #E2E8F0; }

.gfs-select-arrow {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    color: #FFC857;
    pointer-events: none;
    flex-shrink: 0;
}

/* ── Slider card ── */
.gfs-slider-wrap {
    background: rgba(10,14,26,0.85);
    border: 1px solid rgba(255,200,87,0.12);
    border-radius: 18px;
    padding: 24px 28px 20px;
    margin-bottom: 24px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.04);
    position: relative;
    overflow: visible;
}

/* Subtle glow accent */
.gfs-slider-wrap::before {
    content: '';
    position: absolute;
    top: -1px; left: 10%; right: 10%;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(255,200,87,0.4), transparent);
    border-radius: 50%;
}

.gfs-slider-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 20px;
    flex-wrap: nowrap;
    gap: 12px;
}

.gfs-slider-label {
    font-size: 0.75rem;
    font-weight: 800;
    color: #94A3B8;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    flex-shrink: 0;
}

.gfs-slider-value {
    font-size: 1.6rem;
    font-weight: 900;
    color: #FFC857;
    font-family: 'Poppins', sans-serif;
    letter-spacing: -0.03em;
    line-height: 1;
    text-align: right;
    transition: color 0.15s;
}

/* ── Slider track container ── */
.gfs-slider-track-wrap {
    position: relative;
    height: 28px;
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

/* Track background */
.gfs-slider-track-wrap::before {
    content: '';
    position: absolute;
    left: 0; right: 0;
    height: 5px;
    background: rgba(255,255,255,0.07);
    border-radius: 50px;
    pointer-events: none;
}

/* Golden fill overlay */
.gfs-slider-track-wrap::after {
    content: '';
    position: absolute;
    left: 0;
    width: var(--gfs-fill, 9.1%);
    height: 5px;
    background: linear-gradient(to right, #F59E0B, #FFC857);
    border-radius: 50px;
    pointer-events: none;
    transition: width 0.05s;
    box-shadow: 0 0 8px rgba(255,200,87,0.4);
}

/* Range input — fully transparent, sits above track */
.gfs-slider {
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    z-index: 3;
    width: 100%;
    height: 28px;
    background: transparent;
    outline: none;
    cursor: pointer;
    margin: 0;
    padding: 0;
    border: none;
}

/* Thumb — WebKit */
.gfs-slider::-webkit-slider-runnable-track {
    background: transparent;
    height: 28px;
}

.gfs-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #fff 0%, #F8F0D8 100%);
    border: 2.5px solid #FFC857;
    box-shadow:
        0 0 0 5px rgba(255,200,87,0.15),
        0 2px 12px rgba(0,0,0,0.6),
        inset 0 1px 2px rgba(255,255,255,0.8);
    cursor: grab;
    transition: box-shadow 0.2s, transform 0.15s;
    margin-top: 2px;
}

.gfs-slider::-webkit-slider-thumb:hover {
    box-shadow:
        0 0 0 9px rgba(255,200,87,0.18),
        0 2px 16px rgba(0,0,0,0.6),
        inset 0 1px 2px rgba(255,255,255,0.8);
    transform: scale(1.12);
}

.gfs-slider:active::-webkit-slider-thumb {
    cursor: grabbing;
    transform: scale(1.05);
    box-shadow:
        0 0 0 12px rgba(255,200,87,0.12),
        0 2px 16px rgba(0,0,0,0.6),
        inset 0 1px 2px rgba(255,255,255,0.8);
}

/* Thumb — Firefox */
.gfs-slider::-moz-range-track {
    background: transparent;
    height: 5px;
    border-radius: 50px;
}
.gfs-slider::-moz-range-thumb {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #fff;
    border: 2.5px solid #FFC857;
    box-shadow: 0 0 0 5px rgba(255,200,87,0.15), 0 2px 12px rgba(0,0,0,0.6);
    cursor: grab;
    transition: box-shadow 0.2s, transform 0.15s;
}
.gfs-slider::-moz-range-progress {
    background: linear-gradient(to right, #F59E0B, #FFC857);
    height: 5px;
    border-radius: 50px;
}

/* Range labels */
.gfs-slider-range-labels {
    display: flex;
    justify-content: space-between;
    font-size: 0.72rem;
    color: #475569;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 0 2px;
    margin-top: 4px;
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .gfs-slider-wrap {
        padding: 18px 16px 16px;
        border-radius: 14px;
    }
    .gfs-slider-value {
        font-size: 1.25rem;
    }
    .gfs-calc-select {
        font-size: 0.88rem;
        padding: 12px 38px 12px 13px;
        border-radius: 10px;
    }
    .gfs-slider::-webkit-slider-thumb {
        width: 28px;
        height: 28px;
    }
    .gfs-slider-label { font-size: 0.70rem; }
    .gfs-slider-range-labels { font-size: 0.68rem; }
}

@media (max-width: 390px) {
    .gfs-slider-value { font-size: 1.1rem; }
    .gfs-slider-wrap { padding: 14px 14px 12px; }
    .gfs-calc-select { font-size: 0.82rem; }
}




/* ═══════════════════════════════════════════════════════════════
   CALCULATOR + MT5 IMAGE — Two Column Layout v4 (Premium Panel)
   ═══════════════════════════════════════════════════════════════ */

.gfs-calc-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 60px;
    align-items: center;
}

.gfs-calc-panel { min-width: 0; }

/* ── Premium mockup panel ── */
.gfs-mockup-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    position: relative;
    padding-top: 24px;
    overflow: visible;
}

/* Outer glow card */
.gfs-mockup-panel::before {
    content: '';
    position: absolute;
    inset: -28px -24px;
    background: radial-gradient(
        ellipse at 50% 40%,
        rgba(255,200,87,0.07) 0%,
        rgba(255,150,30,0.04) 40%,
        transparent 70%
    );
    border-radius: 32px;
    pointer-events: none;
    z-index: 0;
}

/* Premium border frame around image */
.gfs-mt5-frame {
    position: relative;
    display: inline-block;
    z-index: 1;
    overflow: visible;
    border-radius: 28px;
    padding: 3px;
    background: linear-gradient(
        135deg,
        rgba(255,200,87,0.5) 0%,
        rgba(255,150,30,0.2) 30%,
        rgba(255,255,255,0.05) 60%,
        rgba(255,200,87,0.3) 100%
    );
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.10),
        0 30px 80px rgba(0,0,0,0.6),
        0 10px 30px rgba(0,0,0,0.4),
        0 0 60px rgba(255,200,87,0.06);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.gfs-mt5-frame:hover {
    transform: translateY(-6px) scale(1.015);
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.18),
        0 40px 100px rgba(0,0,0,0.65),
        0 14px 40px rgba(0,0,0,0.45),
        0 0 80px rgba(255,200,87,0.10);
}

/* Inner dark background behind image */
.gfs-mt5-frame-inner {
    border-radius: 26px;
    overflow: visible;
    background: #000;
    position: relative;
    line-height: 0;
}

/* Screen glare overlay */
.gfs-mt5-frame-inner::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 35%;
    background: linear-gradient(
        160deg,
        rgba(255,255,255,0.06) 0%,
        rgba(255,255,255,0.02) 50%,
        transparent 100%
    );
    pointer-events: none;
    z-index: 2;
    border-radius: 26px 26px 0 0;
}

/* Top badge — LIVE indicator */
.gfs-mt5-live-badge {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #1a1f36, #0D1220);
    border: 1px solid rgba(255,200,87,0.3);
    border-radius: 20px;
    padding: 4px 14px 4px 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.68rem;
    font-weight: 700;
    color: #E2E8F0;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    z-index: 4;
    box-shadow: 0 2px 12px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,200,87,0.08);
}

.gfs-mt5-live-dot {
    width: 7px;
    height: 7px;
    background: #22c55e;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(34,197,94,0.25);
    animation: gfs-pulse-dot 2s ease-in-out infinite;
}

@keyframes gfs-pulse-dot {
    0%, 100% { box-shadow: 0 0 0 2px rgba(34,197,94,0.25); }
    50%       { box-shadow: 0 0 0 5px rgba(34,197,94,0.10); }
}

/* Bottom ambient glow */
.gfs-mt5-glow {
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    width: 220px;
    height: 60px;
    background: radial-gradient(ellipse,
        rgba(255,200,87,0.13) 0%,
        transparent 70%
    );
    filter: blur(14px);
    pointer-events: none;
    z-index: 0;
}

/* The actual image */
.gfs-mt5-img {
    width: 100%;
    max-width: 354px;
    height: auto;
    display: block;
    position: relative;
    z-index: 1;
    border-radius: 24px;
}

/* Caption */
.gfs-mockup-caption {
    font-size: 0.73rem;
    color: #475569;
    text-align: center;
    letter-spacing: 0.04em;
    z-index: 1;
    position: relative;
}

/* ── Tablet ── */
@media (max-width: 1024px) {
    .gfs-calc-layout {
        grid-template-columns: 1fr 290px;
        gap: 40px;
    }
    .gfs-mt5-img  { max-width: 284px; border-radius: 18px; }
    .gfs-mt5-frame { border-radius: 22px; overflow: visible; }
    .gfs-mt5-frame-inner { border-radius: 20px; }
    .gfs-mt5-frame-inner::after { border-radius: 20px 20px 0 0; }
    .gfs-mockup-panel { padding-top: 24px; overflow: visible; }
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .gfs-calc-layout {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .gfs-calc-panel .calculator-title { text-align: center !important; }
    .gfs-calc-panel > p { text-align: center !important; }
    .gfs-mockup-panel {
        order: -1;
        padding-top: 28px;
        overflow: visible;
    }
    .gfs-mockup-panel::before { inset: -16px -12px; }
    .gfs-mt5-img  { max-width: 240px; border-radius: 16px; }
    .gfs-mt5-frame {
        border-radius: 20px;
        padding: 2px;
        overflow: visible;
        z-index: 2;
    }
    .gfs-mt5-frame-inner { border-radius: 18px; }
    .gfs-mt5-frame-inner::after { border-radius: 18px 18px 0 0; }
    .gfs-mt5-glow { width: 160px; height: 45px; }
    .gfs-mt5-live-badge {
        font-size: 0.62rem;
        padding: 3px 10px 3px 8px;
        z-index: 10;
        top: -16px;
    }
}

@media (max-width: 390px) {
    .gfs-mt5-img  { max-width: 205px; border-radius: 14px; }
    .gfs-mt5-frame { border-radius: 18px; overflow: visible; }
    .gfs-mt5-frame-inner { border-radius: 16px; }
    .gfs-mockup-panel { padding-top: 26px; overflow: visible; }
    .gfs-mt5-live-badge { z-index: 10; top: -16px; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE MENU — Active/Current Item Fix
   ═══════════════════════════════════════════════════════════════ */

/* Current page item — full width, centered text */
.gfs-mob-menu-list li.current-menu-item > a,
.gfs-mob-menu-list li.current_page_item > a,
.gfs-mob-menu-list li.current-menu-ancestor > a,
.gfs-mob-menu-list li.current-menu-parent > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
    background: rgba(255,200,87,0.08) !important;
    color: #FFC857 !important;
    border-left: none !important;
    border-bottom: 2px solid rgba(255,200,87,0.25) !important;
    padding: 15px 24px !important;
    font-weight: 700 !important;
    text-align: center !important;
    letter-spacing: 0.3px !important;
}

.gfs-mob-menu-list li.current-menu-item,
.gfs-mob-menu-list li.current_page_item {
    background: transparent !important;
}

/* ═══ BGGolden Watermark — Mobile Fix ═══
   The source image is very wide (~1920px). The robot figure occupies
   roughly the right-side 50% of the image. On mobile the div was
   only 55vw wide, so only the black left portion was visible.
   Fix: expand the div to fill the whole hero, then use
   background-size + background-position to zoom into the figure area.
*/
@media (max-width: 768px) {
    #BGGolden {
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        transform: none !important;
        /* auto height keeps aspect ratio; 160% width zooms in so the
           robot figure fills the viewport rather than the whole wide image */
        background-size: 160% auto !important;
        /* push the crop window to the right where the figure lives */
        background-position: 120% 40% !important;
        background-repeat: no-repeat !important;
        opacity: 0.22 !important;
    }
}

/* ═══ BGGolden v3 — img tag mobile fix ═══ */
@media (max-width: 768px) {
    #BGGolden {
        /* Full hero coverage */
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }
    #BGGoldenImg {
        /* Image is ~1920px wide; robot+text is in right ~45%.
           width:220% pushes total image wider than viewport,
           then translate shifts it so right portion is centered */
        width: 220% !important;
        height: auto !important;
        max-width: none !important;
        object-fit: unset !important;
        object-position: unset !important;
        position: absolute !important;
        top: 50% !important;
        /* shift left so robot figure + "Golden Forex" text centers on screen */
        left: -55% !important;
        transform: translateY(-50%) !important;
        opacity: 0.22 !important;
    }
}

/* ═══ HERO TEXT — MOBILE LEFT ALIGN FIX ═══ */
@media (max-width: 768px) {
    .hero-content {
        text-align: left !important;
        align-items: flex-start !important;
    }
    .hero-badge {
        text-align: left !important;
        justify-content: flex-start !important;
    }
    .hero-title {
        text-align: left !important;
    }
    .hero-subtitle {
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .hero-features {
        text-align: left !important;
        align-items: flex-start !important;
    }
    .hero-feature-item {
        text-align: left !important;
    }
    .hero-cta-group {
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }
    .telegram-btn-wrap {
        justify-content: flex-start !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   GFS MEMBER ZONE — Dashboard Welcome Panel
   ═══════════════════════════════════════════════════════════════ */

.gfs-member-welcome-panel {
    background: linear-gradient(135deg, rgba(30, 58, 138, 0.35) 0%, rgba(21, 27, 59, 0.85) 100%);
    border: 1px solid rgba(245, 158, 11, 0.25);
    border-radius: 16px;
    padding: 36px 40px 40px;
    margin-bottom: 36px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(245, 158, 11, 0.1);
    position: relative;
    overflow: hidden;
}

.gfs-member-welcome-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(245, 158, 11, 0.6), rgba(59, 130, 246, 0.6), transparent);
    pointer-events: none;
}

.gfs-member-welcome-inner {
    text-align: center;
}

.gfs-member-welcome-title {
    font-family: var(--font-display, 'Syne', sans-serif);
    font-size: 1.75rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 10px 0;
    letter-spacing: -0.3px;
}

.gfs-member-welcome-sub {
    font-size: 0.95rem;
    color: var(--color-text-secondary, #94A3B8);
    margin: 0 0 32px 0;
    line-height: 1.6;
}

/* ── Quick Link Cards Grid ── */
.gfs-member-quicklinks {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 8px;
}

.gfs-member-ql-card {
    background: rgba(10, 14, 39, 0.6);
    border: 1px solid rgba(59, 130, 246, 0.2);
    border-radius: 12px;
    padding: 24px 16px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none !important;
    color: #ffffff !important;
    transition: all 0.25s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.gfs-member-ql-card::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 12px;
    opacity: 0;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.08), rgba(59, 130, 246, 0.08));
    transition: opacity 0.25s ease;
    pointer-events: none;
}

.gfs-member-ql-card:hover {
    border-color: rgba(245, 158, 11, 0.5) !important;
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4), 0 0 20px rgba(245, 158, 11, 0.12);
    text-decoration: none !important;
    color: #ffffff !important;
}

.gfs-member-ql-card:hover::after {
    opacity: 1;
}

.gfs-member-ql-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.18), rgba(59, 130, 246, 0.18));
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    color: var(--color-accent, #F59E0B);
    flex-shrink: 0;
}

.gfs-member-ql-icon svg {
    width: 22px;
    height: 22px;
    stroke: var(--color-accent, #F59E0B);
}

.gfs-member-ql-label {
    font-weight: 700;
    font-size: 0.9rem;
    color: #ffffff;
    display: block;
    margin-bottom: 6px;
    letter-spacing: 0.2px;
}

.gfs-member-ql-desc {
    font-size: 0.78rem;
    color: var(--color-text-secondary, #94A3B8);
    display: block;
    line-height: 1.4;
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .gfs-member-quicklinks {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 520px) {
    .gfs-member-welcome-panel {
        padding: 20px 16px 22px;
    }
    .gfs-member-welcome-title {
        font-size: 1.05rem;
        margin-bottom: 8px;
    }
    .gfs-member-welcome-sub {
        font-size: 0.74rem;
        margin-bottom: 18px;
        line-height: 1.5;
    }
    .gfs-member-quicklinks {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .gfs-member-ql-card {
        padding: 14px 10px 12px;
    }
    .gfs-member-ql-icon {
        width: 40px;
        height: 40px;
        margin-bottom: 10px;
    }
    .gfs-member-ql-icon svg {
        width: 18px;
        height: 18px;
    }
    .gfs-member-ql-label {
        font-size: 0.70rem;
        margin-bottom: 4px;
    }
    .gfs-member-ql-desc {
        font-size: 0.60rem;
        line-height: 1.35;
    }
}

@media (max-width: 375px) {
    .gfs-member-welcome-title {
        font-size: 0.95rem;
    }
    .gfs-member-welcome-sub {
        font-size: 0.70rem;
        margin-bottom: 14px;
    }
    .gfs-member-ql-label {
        font-size: 0.65rem;
    }
    .gfs-member-ql-desc {
        font-size: 0.56rem;
    }
    .gfs-member-ql-card {
        padding: 12px 8px 10px;
    }
    .gfs-member-ql-icon {
        width: 36px;
        height: 36px;
        margin-bottom: 8px;
    }
    .gfs-member-ql-icon svg {
        width: 16px;
        height: 16px;
    }
}


/* ═══════════════════════════════════════════════════════════════
   VIP PROFESSIONAL PREMIUM THEME — COMPLETE VISUAL OVERHAUL v2
   Style Match: Golden Forex Scalping Hero Design Reference
   — Deep Space Navy + Neon Gold + Purple Accent Palette
   — Premium Box Shadows, Gradient Borders, Glass Morphism Cards
   — Full Mobile + Desktop Responsive
   APPEND ONLY — no existing rules deleted
   ═══════════════════════════════════════════════════════════════ */

/* ── VIP Design System Variables ── */
:root {
    /* Core VIP Palette — matches screenshot exactly */
    --vip-bg-void:          #050811;        /* deepest background */
    --vip-bg-base:          #080D1A;        /* main background */
    --vip-bg-surface:       #0D1428;        /* card surfaces */
    --vip-bg-elevated:      #111C35;        /* elevated panels */
    --vip-bg-glass:         rgba(13,20,40,0.82);

    /* Gold System */
    --vip-gold-primary:     #F59E0B;
    --vip-gold-bright:      #FFC857;
    --vip-gold-pale:        #FFE0A0;
    --vip-gold-dim:         #D97706;
    --vip-gold-glow:        rgba(255,200,87,0.20);
    --vip-gold-gradient:    linear-gradient(135deg, #FFC857 0%, #F59E0B 55%, #D97706 100%);

    /* Orange accent (hero title "70%-150%") */
    --vip-orange:           #FF6B2B;
    --vip-orange-bright:    #FF8C42;
    --vip-hero-number-grad: linear-gradient(135deg, #FF6B2B 0%, #FF9A3C 50%, #FFC857 100%);

    /* Purple / Violet secondary accent */
    --vip-purple:           #7C3AED;
    --vip-purple-light:     #A78BFA;
    --vip-purple-glow:      rgba(124,58,237,0.18);

    /* Green success */
    --vip-green:            #22C55E;
    --vip-green-light:      #4ADE80;
    --vip-green-glow:       rgba(34,197,94,0.15);

    /* Border system */
    --vip-border-subtle:    rgba(255,200,87,0.10);
    --vip-border-normal:    rgba(255,200,87,0.22);
    --vip-border-strong:    rgba(255,200,87,0.45);

    /* Shadows */
    --vip-shadow-card:      0 4px 32px rgba(0,0,0,0.55), 0 1px 0 rgba(255,255,255,0.03) inset;
    --vip-shadow-gold:      0 0 40px rgba(255,200,87,0.15), 0 20px 60px rgba(0,0,0,0.5);
    --vip-shadow-glow:      0 0 60px rgba(255,200,87,0.12), 0 0 120px rgba(255,200,87,0.05);
    --vip-shadow-purple:    0 0 40px rgba(124,58,237,0.18);
    --vip-shadow-btn:       0 4px 24px rgba(255,200,87,0.38), 0 1px 0 rgba(255,255,255,0.15) inset;
    --vip-shadow-btn-hover: 0 8px 48px rgba(255,200,87,0.55), 0 2px 0 rgba(255,255,255,0.20) inset;

    /* Typography */
    --vip-font-display:     'Syne', 'Poppins', sans-serif;
    --vip-font-body:        'DM Sans', 'Inter', sans-serif;
}

/* ════════════════════════════════════════
   1. BASE & BODY
   ════════════════════════════════════════ */

html, body {
    font-family: var(--vip-font-body) !important;
    background-color: var(--vip-bg-void) !important;
    color: #E2E8F0 !important;
    overflow-x: hidden !important;
}

/* Deep space background with subtle nebula */
body {
    background-image:
        radial-gradient(ellipse 80% 50% at 20% 10%, rgba(124,58,237,0.06) 0%, transparent 55%),
        radial-gradient(ellipse 60% 40% at 80% 80%, rgba(245,158,11,0.05) 0%, transparent 50%),
        radial-gradient(ellipse 40% 30% at 50% 50%, rgba(5,8,17,0) 0%, transparent 100%) !important;
    background-attachment: fixed !important;
}

/* Remove grain overlay brightness to reveal cleaner look */
body::before {
    opacity: 0.25 !important;
}

/* ════════════════════════════════════════
   2. HERO SECTION — VIP Redesign
   ════════════════════════════════════════ */

.hero-section {
    background:
        radial-gradient(ellipse 60% 45% at 5%  15%, rgba(124,58,237,0.12) 0%, transparent 60%),
        radial-gradient(ellipse 50% 40% at 90% 75%, rgba(245,158,11,0.08) 0%, transparent 55%),
        radial-gradient(ellipse 30% 25% at 50% 30%, rgba(255,107,43,0.04) 0%, transparent 60%),
        var(--vip-bg-void) !important;
    position: relative !important;
}

/* Animated hero background gradients */
.hero-background::before {
    background:
        radial-gradient(circle at 25% 20%, rgba(124,58,237,0.10) 0%, transparent 45%),
        radial-gradient(circle at 75% 70%, rgba(245,158,11,0.08) 0%, transparent 45%) !important;
    animation: vipHeroGlow 10s ease-in-out infinite alternate !important;
}

@keyframes vipHeroGlow {
    0%   { opacity: 0.6; transform: scale(1);    }
    100% { opacity: 1.0; transform: scale(1.08); }
}

/* Hero title: massive, Syne font, white */
.hero-title {
    font-family: var(--vip-font-display) !important;
    font-weight: 900 !important;
    font-size: clamp(2.4rem, 6vw, 5rem) !important;
    letter-spacing: -0.035em !important;
    line-height: 1.04 !important;
    color: #FFFFFF !important;
    text-shadow: 0 2px 40px rgba(0,0,0,0.5) !important;
    margin-bottom: 24px !important;
}

/* The orange percentage numbers — matches reference image */
.hero-title .text-gradient,
.hero-title [style*="color:#FF"],
.hero-title [style*="color: #FF"] {
    background: var(--vip-hero-number-grad) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 2px 20px rgba(255,107,43,0.45)) !important;
}

/* Hero subtitle */
.hero-subtitle {
    font-size: clamp(1rem, 2.2vw, 1.25rem) !important;
    color: #94A3B8 !important;
    line-height: 1.75 !important;
    max-width: 680px !important;
    letter-spacing: 0.01em !important;
}

/* Hero badge: subtle glass */
.hero-badge {
    background: rgba(124,58,237,0.08) !important;
    border: 1px solid rgba(167,139,250,0.25) !important;
    color: #C4B5FD !important;
    backdrop-filter: blur(16px) !important;
    box-shadow: 0 2px 24px rgba(124,58,237,0.08) !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
}

/* Trust bar */
.hero-trust-badges {
    border-top: 1px solid rgba(255,200,87,0.10) !important;
}

/* ════════════════════════════════════════
   3. VIP BRAND CARD (right panel)
   ════════════════════════════════════════ */

.gfs-brand-card {
    background: linear-gradient(165deg, #0E1629 0%, #080D1A 100%) !important;
    border: 1px solid var(--vip-border-normal) !important;
    border-radius: 22px !important;
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.06),
        0 32px 80px rgba(0,0,0,0.7),
        0 0 60px rgba(255,200,87,0.08),
        var(--vip-shadow-purple) !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Gold top edge glow */
.gfs-brand-card::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 10% !important;
    right: 10% !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, var(--vip-gold-bright), transparent) !important;
}

.gfs-brand-card-top {
    background: linear-gradient(180deg, rgba(255,200,87,0.06) 0%, rgba(255,200,87,0.01) 100%) !important;
    border-bottom: 1px solid var(--vip-border-subtle) !important;
    padding: 36px 32px 28px !important;
}

.gfs-brand-logo-text {
    font-family: var(--vip-font-display) !important;
    font-size: 2.2rem !important;
    font-weight: 900 !important;
    color: #FFFFFF !important;
    letter-spacing: -0.04em !important;
    text-shadow: 0 2px 20px rgba(255,200,87,0.15) !important;
}

.gfs-brand-card-sub {
    font-size: 0.68rem !important;
    letter-spacing: 4px !important;
    color: var(--vip-gold-bright) !important;
    font-weight: 800 !important;
    margin-top: 8px !important;
}

/* Checklist items */
.gfs-brand-check-item {
    font-size: 1rem !important;
    color: #E2E8F0 !important;
    font-weight: 600 !important;
}

.gfs-check-icon {
    background: rgba(255,200,87,0.12) !important;
    border: 1px solid rgba(255,200,87,0.35) !important;
    color: var(--vip-gold-bright) !important;
    box-shadow: 0 0 12px rgba(255,200,87,0.12) !important;
    width: 26px !important;
    height: 26px !important;
}

/* MyFXBook badge */
.gfs-myfxbook-badge {
    background: rgba(0,0,0,0.5) !important;
    border: 1px solid rgba(255,200,87,0.18) !important;
    border-radius: 14px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

.gfs-myfxbook-label {
    color: #475569 !important;
    font-size: 0.62rem !important;
    letter-spacing: 3px !important;
}

.gfs-myfxbook-logo {
    font-size: 1.8rem !important;
    color: #F0F4F8 !important;
    font-weight: 700 !important;
}

.gfs-brand-card-bottom {
    background: rgba(255,200,87,0.04) !important;
    border-top: 1px solid var(--vip-border-subtle) !important;
    color: var(--vip-gold-bright) !important;
    font-size: 0.70rem !important;
    letter-spacing: 3px !important;
    font-weight: 800 !important;
    padding: 16px !important;
}

/* ════════════════════════════════════════
   4. BUTTONS — VIP Grade
   ════════════════════════════════════════ */

/* Primary gold CTA */
.btn-accent {
    background: var(--vip-gold-gradient) !important;
    color: #050811 !important;
    font-family: var(--vip-font-display) !important;
    font-weight: 900 !important;
    font-size: 0.95rem !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: 12px !important;
    box-shadow: var(--vip-shadow-btn) !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.25s cubic-bezier(0.34,1.56,0.64,1) !important;
}

.btn-accent::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 60% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent) !important;
    transform: skewX(-20deg) !important;
    transition: left 0.5s ease !important;
}

.btn-accent:hover {
    transform: translateY(-3px) scale(1.03) !important;
    box-shadow: var(--vip-shadow-btn-hover) !important;
    background: linear-gradient(135deg, #FFD97D 0%, #FFC857 55%, #F59E0B 100%) !important;
    color: #050811 !important;
}

.btn-accent:hover::before {
    left: 150% !important;
}

/* Outline / secondary button */
.btn-outline {
    background: rgba(255,200,87,0.04) !important;
    border: 1.5px solid rgba(255,200,87,0.30) !important;
    color: #FFC857 !important;
    border-radius: 12px !important;
    backdrop-filter: blur(8px) !important;
    font-weight: 700 !important;
}

.btn-outline:hover {
    background: rgba(255,200,87,0.10) !important;
    border-color: rgba(255,200,87,0.65) !important;
    color: #FFE0A0 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 30px rgba(255,200,87,0.15) !important;
}

/* ════════════════════════════════════════
   5. HEADER — Refined Glass
   ════════════════════════════════════════ */

.site-header {
    background: rgba(5,8,17,0.75) !important;
    backdrop-filter: blur(32px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(32px) saturate(200%) !important;
    border-bottom: 1px solid rgba(255,200,87,0.08) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,0.03) !important;
}

.site-header.scrolled {
    background: rgba(5,8,17,0.96) !important;
    border-bottom-color: rgba(255,200,87,0.12) !important;
    box-shadow: 0 4px 40px rgba(0,0,0,0.7) !important;
}

.nav-cta {
    background: var(--vip-gold-gradient) !important;
    color: #050811 !important;
    font-weight: 900 !important;
    font-family: var(--vip-font-display) !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 16px rgba(255,200,87,0.30) !important;
    letter-spacing: 0.03em !important;
    padding: 10px 22px !important;
    font-size: 0.88rem !important;
}

.nav-cta:hover {
    box-shadow: 0 4px 28px rgba(255,200,87,0.50) !important;
    transform: translateY(-1px) !important;
    color: #050811 !important;
}

.main-nav a {
    font-weight: 500 !important;
    color: #94A3B8 !important;
    letter-spacing: 0.02em !important;
    font-size: 0.92rem !important;
}

.main-nav a:hover {
    color: var(--vip-gold-bright) !important;
}

/* Site logo */
.site-logo {
    font-family: var(--vip-font-display) !important;
    font-weight: 900 !important;
    font-size: 1.4rem !important;
    letter-spacing: -0.03em !important;
}

.logo-gold { color: var(--vip-gold-bright) !important; }
.logo-blue { color: var(--vip-purple-light) !important; }
.logo-g    { color: #E8820A !important; }
.logo-f    { color: #E8820A !important; }
.logo-s    { color: #3B82F6 !important; }

/* ════════════════════════════════════════
   6. PREMIUM CARDS — All card types
   ════════════════════════════════════════ */

/* Universal card base */
.pricing-card,
.mode-card,
.feature-card,
.faq-item,
.what-you-get-section,
.calculator-section,
.editable-section {
    background: linear-gradient(160deg, var(--vip-bg-surface) 0%, var(--vip-bg-void) 100%) !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
    border-radius: 18px !important;
    box-shadow:
        0 2px 0 rgba(255,255,255,0.03) inset,
        0 4px 30px rgba(0,0,0,0.45),
        0 1px 0 rgba(255,255,255,0.02) !important;
    backdrop-filter: blur(4px) !important;
    transition: all 0.30s cubic-bezier(0.34,1.20,0.64,1) !important;
}

/* Mode cards — color top bar */
.mode-card::before {
    height: 3px !important;
    border-radius: 18px 18px 0 0 !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
}

.mode-card:hover {
    border-color: rgba(255,200,87,0.22) !important;
    box-shadow:
        0 12px 50px rgba(0,0,0,0.55),
        0 0 0 1px rgba(255,200,87,0.12),
        0 0 40px rgba(255,200,87,0.07) !important;
    transform: translateY(-8px) !important;
}

.mode-card:hover::before {
    opacity: 1 !important;
}

/* Feature cards */
.feature-card:hover {
    border-color: rgba(255,200,87,0.20) !important;
    box-shadow:
        0 12px 50px rgba(0,0,0,0.55),
        0 0 0 1px rgba(255,200,87,0.10),
        0 0 40px rgba(255,200,87,0.06) !important;
    transform: translateY(-8px) !important;
}

.feature-card:hover .feature-title {
    color: var(--vip-gold-bright) !important;
}

.feature-card::after {
    background: linear-gradient(180deg, var(--vip-gold-bright), var(--vip-purple-light)) !important;
}

/* Pricing card base */
.pricing-card:hover {
    border-color: rgba(255,200,87,0.20) !important;
    box-shadow:
        0 12px 50px rgba(0,0,0,0.55),
        0 0 0 1px rgba(255,200,87,0.12),
        0 0 60px rgba(255,200,87,0.08) !important;
    transform: translateY(-10px) !important;
}

/* Featured pricing card */
.pricing-card.featured {
    background: linear-gradient(160deg, rgba(22,18,5,0.98) 0%, rgba(8,6,0,0.99) 100%) !important;
    border: 1px solid rgba(255,200,87,0.32) !important;
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.08),
        0 8px 64px rgba(255,200,87,0.12),
        0 40px 80px rgba(0,0,0,0.6) !important;
}

.pricing-card.featured:hover {
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.22),
        0 12px 80px rgba(255,200,87,0.20),
        0 40px 80px rgba(0,0,0,0.7) !important;
}

/* Pricing badge — BLUE, Left→Right glow sweep */
.pricing-badge {
    position: absolute !important;
    top: -15px !important;
    right: var(--spacing-md) !important;
    background: linear-gradient(135deg, #1E90FF 0%, #0066CC 50%, #004B99 100%) !important;
    background-size: 200% auto !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-family: var(--vip-font-display) !important;
    border-radius: 20px !important;
    letter-spacing: 1px !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    padding: 8px 20px !important;
    overflow: hidden !important;
    animation:
        badgeShimmerBlue  3s   linear       infinite,
        badgeGlowPulse    2s   ease-in-out  infinite !important;
    box-shadow: 0 2px 16px rgba(30,144,255,0.5) !important;
}

/* Left → Right glow sweep */
.pricing-badge::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -75% !important;
    width: 60% !important;
    height: 100% !important;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.6) 50%,
        transparent 100%
    ) !important;
    border-radius: inherit !important;
    animation: badgeGlowSweepLR 2.2s ease-in-out infinite !important;
    pointer-events: none !important;
}

@keyframes badgeShimmerBlue {
    0%   { background-position: -200% center; }
    100% { background-position:  200% center; }
}

/* Left → Right sweep */
@keyframes badgeGlowSweepLR {
    0%   { left: -75%; opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { left: 120%; opacity: 0; }
}

@keyframes badgeGlowPulse {
    0%,100% {
        box-shadow:
            0 2px 16px rgba(30,144,255,0.45),
            0 0  0px  0px rgba(30,144,255,0.0);
    }
    50% {
        box-shadow:
            0 4px 28px rgba(30,144,255,0.75),
            0 0  0px 10px rgba(30,144,255,0.0);
    }
}

/* Pricing price */
.pricing-price {
    font-family: var(--vip-font-display) !important;
    font-size: 4rem !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em !important;
    background: linear-gradient(135deg, #FFC857 0%, #F59E0B 55%, #FFE0A0 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 2px 12px rgba(255,200,87,0.25)) !important;
}

/* Pricing section title */
.pricing-section-title {
    font-family: var(--vip-font-display) !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em !important;
    background: linear-gradient(135deg, #FFFFFF 0%, #CBD5E1 80%, #94A3B8 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Checkmarks */
.pricing-features li::before {
    color: var(--vip-green) !important;
    font-size: 1.1rem !important;
}

.pricing-features li.unavailable::before {
    color: #EF4444 !important;
}

/* ════════════════════════════════════════
   7. SECTION STYLING
   ════════════════════════════════════════ */

.section-dark {
    background:
        radial-gradient(ellipse 100% 25% at 50% 0%, rgba(124,58,237,0.05) 0%, transparent 65%),
        var(--vip-bg-void) !important;
}

/* Section headings */
h1, h2 {
    font-family: var(--vip-font-display) !important;
    font-weight: 900 !important;
    letter-spacing: -0.03em !important;
}

h3, h4 {
    font-family: var(--vip-font-display) !important;
    font-weight: 700 !important;
}

/* Accent text color */
.text-accent {
    color: var(--vip-gold-bright) !important;
}

/* Mode returns: big gold number */
.mode-returns {
    font-family: var(--vip-font-display) !important;
    font-size: 3rem !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em !important;
    color: var(--vip-gold-bright) !important;
    filter: drop-shadow(0 2px 12px rgba(255,200,87,0.30)) !important;
}

/* ════════════════════════════════════════
   8. FAQ — VIP Style
   ════════════════════════════════════════ */

.faq-item {
    border: 1px solid rgba(255,255,255,0.04) !important;
    border-radius: 14px !important;
    margin-bottom: 10px !important;
}

.faq-item:hover {
    border-color: rgba(255,200,87,0.18) !important;
}

.faq-item.active {
    border-color: rgba(255,200,87,0.28) !important;
    box-shadow: 0 4px 30px rgba(255,200,87,0.07), 0 0 0 1px rgba(255,200,87,0.08) !important;
}

.faq-item.active .faq-question {
    color: var(--vip-gold-bright) !important;
}

.faq-icon {
    width: 28px !important;
    height: 28px !important;
    border: 1.5px solid rgba(255,200,87,0.28) !important;
    background: rgba(255,200,87,0.05) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--vip-gold-bright) !important;
    font-size: 1rem !important;
    flex-shrink: 0 !important;
}

.faq-item.active .faq-icon {
    background: rgba(255,200,87,0.12) !important;
    border-color: var(--vip-gold-bright) !important;
    box-shadow: 0 0 12px rgba(255,200,87,0.20) !important;
}

/* ════════════════════════════════════════
   9. CALCULATOR — Premium Dark Panel
   ════════════════════════════════════════ */

.calculator-section {
    background: linear-gradient(160deg, #0D1428 0%, #080D1A 100%) !important;
    border: 1px solid rgba(255,200,87,0.12) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.02),
        0 8px 60px rgba(0,0,0,0.5),
        inset 0 1px 0 rgba(255,200,87,0.06) !important;
    position: relative !important;
    overflow: hidden !important;
}

.calculator-section::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 8% !important; right: 8% !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255,200,87,0.35), transparent) !important;
}

.calculator-result {
    background: linear-gradient(160deg, rgba(255,200,87,0.07) 0%, rgba(5,8,17,0.6) 100%) !important;
    border: 1px solid rgba(255,200,87,0.18) !important;
    border-radius: 14px !important;
    box-shadow: inset 0 1px 0 rgba(255,200,87,0.06) !important;
}

.calculator-result-value {
    font-family: var(--vip-font-display) !important;
    font-size: 3.5rem !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em !important;
    background: var(--vip-gold-gradient) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 2px 16px rgba(255,200,87,0.28)) !important;
}

/* ════════════════════════════════════════
   10. WHAT YOU GET — Premium
   ════════════════════════════════════════ */

.what-you-get-section {
    background: linear-gradient(160deg, rgba(13,20,40,0.97) 0%, rgba(5,8,17,0.99) 100%) !important;
    border: 1px solid rgba(34,197,94,0.15) !important;
    box-shadow: 0 0 60px rgba(34,197,94,0.04) inset !important;
}

.package-item {
    border-left: 2px solid rgba(34,197,94,0.20) !important;
    padding-left: 14px !important;
    transition: border-left-color 0.25s ease !important;
}

.package-item:hover {
    border-left-color: var(--vip-green-light) !important;
}

.package-item::before {
    color: var(--vip-green-light) !important;
    font-size: 1.2rem !important;
}

/* ════════════════════════════════════════
   11. FOOTER — VIP Dark
   ════════════════════════════════════════ */

.site-footer {
    background: var(--vip-bg-void) !important;
    border-top: 1px solid rgba(255,200,87,0.08) !important;
    position: relative !important;
}

.site-footer::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 5% !important; right: 5% !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(255,200,87,0.25), transparent) !important;
}

.footer-section h4 {
    color: var(--vip-gold-bright) !important;
    font-family: var(--vip-font-display) !important;
    font-weight: 800 !important;
    font-size: 1rem !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
}

.footer-links a {
    color: #64748B !important;
    font-size: 0.9rem !important;
    transition: color 0.2s ease !important;
}

.footer-links a:hover {
    color: var(--vip-gold-bright) !important;
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.04) !important;
    color: #374151 !important;
    font-size: 0.82rem !important;
}

/* ════════════════════════════════════════
   12. LIVE DOT & TICKER — VIP
   ════════════════════════════════════════ */

.gfs-live-dot {
    background: var(--vip-green) !important;
    box-shadow: 0 0 10px var(--vip-green), 0 0 20px rgba(34,197,94,0.3) !important;
}

.gfs-ticker-block,
.gfs-sessions-block {
    background: rgba(8,13,26,0.90) !important;
    border: 1px solid rgba(255,200,87,0.10) !important;
    border-radius: 14px !important;
    backdrop-filter: blur(12px) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.40) !important;
}

.gfs-tk-gold {
    border-color: rgba(255,200,87,0.22) !important;
    background: rgba(255,200,87,0.05) !important;
}

.gfs-tk-price {
    color: #E2E8F0 !important;
    font-weight: 700 !important;
}

/* ════════════════════════════════════════
   13. MOBILE MENU DRAWER — VIP
   ════════════════════════════════════════ */

.gfs-mob-drawer {
    background: linear-gradient(165deg, #0D1428 0%, #080D1A 100%) !important;
    border-right: 1px solid rgba(255,200,87,0.12) !important;
    box-shadow: 8px 0 48px rgba(0,0,0,0.8) !important;
}

.gfs-mob-header {
    border-bottom: 1px solid rgba(255,200,87,0.10) !important;
    padding: 20px 20px 16px !important;
}

.gfs-mob-logo .logo-gold { color: var(--vip-gold-bright) !important; }
.gfs-mob-logo .logo-blue { color: var(--vip-purple-light) !important; }
.gfs-mob-logo .logo-g    { color: #E8820A !important; }
.gfs-mob-logo .logo-f    { color: #E8820A !important; }
.gfs-mob-logo .logo-s    { color: #3B82F6 !important; }

.gfs-mob-close {
    background: rgba(255,200,87,0.06) !important;
    border: 1px solid rgba(255,200,87,0.15) !important;
    color: var(--vip-gold-bright) !important;
}

.gfs-mob-menu-list li a {
    color: #94A3B8 !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
}

.gfs-mob-menu-list li a:hover {
    color: var(--vip-gold-bright) !important;
    background: rgba(255,200,87,0.06) !important;
}

.gfs-mob-menu-list li a.gfs-mob-cta,
.gfs-mob-menu-list li a.nav-cta {
    background: var(--vip-gold-gradient) !important;
    color: #050811 !important;
    border-radius: 50px !important;
    font-weight: 900 !important;
    box-shadow: 0 4px 18px rgba(255,200,87,0.30) !important;
}

/* ════════════════════════════════════════
   14. VERIFICATION BADGES — VIP
   ════════════════════════════════════════ */

.verification-badge {
    background: rgba(13,20,40,0.80) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(16px) !important;
    box-shadow: 0 2px 16px rgba(0,0,0,0.3) !important;
    transition: all 0.3s ease !important;
}

.verification-badge:hover {
    border-color: rgba(255,200,87,0.25) !important;
    background: rgba(255,200,87,0.05) !important;
    box-shadow: 0 4px 24px rgba(255,200,87,0.08) !important;
}

/* ════════════════════════════════════════
   15. SCROLLBAR & SELECTION
   ════════════════════════════════════════ */

@media (min-width: 769px) {
    ::-webkit-scrollbar { width: 5px !important; }
    ::-webkit-scrollbar-track { background: var(--vip-bg-void) !important; }
    ::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, var(--vip-purple), var(--vip-gold-dim)) !important;
        border-radius: 5px !important;
    }
}

::selection {
    background: rgba(255,200,87,0.18) !important;
    color: #FFE0A0 !important;
}

/* ════════════════════════════════════════
   16. VIP GLOW PULSE KEYFRAME
   ════════════════════════════════════════ */

@keyframes vipGoldPulse {
    0%, 100% { box-shadow: 0 0 20px rgba(255,200,87,0.15); }
    50%       { box-shadow: 0 0 40px rgba(255,200,87,0.35); }
}

@keyframes vipPurplePulse {
    0%, 100% { box-shadow: 0 0 20px rgba(124,58,237,0.12); }
    50%       { box-shadow: 0 0 40px rgba(124,58,237,0.28); }
}

/* Featured card: gold breathe */
.pricing-card.featured {
    animation: vipGoldPulse 5s ease-in-out infinite !important;
}

/* ════════════════════════════════════════
   17. LOGIN POPUP — VIP
   ════════════════════════════════════════ */

.xoo-el-container:not(.xoo-el-style-slider) .xoo-el-inmodal {
    background: linear-gradient(160deg, #0E1629 0%, #080D1A 60%, #050811 100%) !important;
    border: 1px solid rgba(255,200,87,0.20) !important;
    border-radius: 22px !important;
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.06),
        0 30px 80px rgba(0,0,0,0.80),
        0 0 60px rgba(255,200,87,0.06) !important;
}

.xoo-el-container:not(.xoo-el-style-slider) .xoo-el-inmodal::before {
    background: linear-gradient(90deg, var(--vip-purple), var(--vip-gold-bright), var(--vip-purple)) !important;
}

/* ════════════════════════════════════════
   18. GLOBAL TEXT REFINEMENT
   ════════════════════════════════════════ */

p {
    color: #94A3B8 !important;
    line-height: 1.72 !important;
}

a {
    color: var(--vip-gold-bright) !important;
    transition: color 0.2s ease !important;
}

a:hover {
    color: var(--vip-gold-pale) !important;
}

/* Feature title gold */
.feature-title {
    color: var(--vip-gold-bright) !important;
    font-family: var(--vip-font-display) !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
}

/* Mode badge refinement */
.mode-badge {
    font-family: var(--vip-font-display) !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    border-radius: 20px !important;
}

/* ════════════════════════════════════════
   19. MOBILE RESPONSIVE — VIP
   ════════════════════════════════════════ */

@media (max-width: 768px) {

    /* Body background on mobile */
    body {
        background-image:
            radial-gradient(ellipse 100% 40% at 50% 5%, rgba(124,58,237,0.08) 0%, transparent 60%),
            radial-gradient(ellipse 80% 30% at 50% 95%, rgba(245,158,11,0.05) 0%, transparent 55%) !important;
    }

    /* Hero title on mobile */
    .hero-title {
        font-size: clamp(2rem, 8.5vw, 2.8rem) !important;
        letter-spacing: -0.025em !important;
        line-height: 1.08 !important;
    }

    /* Cards on mobile */
    .pricing-card,
    .mode-card,
    .feature-card {
        border-radius: 14px !important;
    }

    /* Pricing price mobile */
    .pricing-price {
        font-size: 3rem !important;
    }

    /* Calculator result mobile */
    .calculator-result-value {
        font-size: 2.5rem !important;
    }

    /* Mode returns mobile */
    .mode-returns {
        font-size: 2.2rem !important;
    }

    /* Featured card pulse off on mobile (performance) */
    .pricing-card.featured {
        animation: none !important;
    }

    /* Hero background effect mobile */
    .hero-section {
        background:
            radial-gradient(ellipse 100% 40% at 50% 5%, rgba(124,58,237,0.10) 0%, transparent 55%),
            radial-gradient(ellipse 60% 30% at 80% 80%, rgba(245,158,11,0.06) 0%, transparent 50%),
            var(--vip-bg-void) !important;
    }

    /* Nav mobile */
    .mobile-menu-toggle span {
        background: var(--vip-gold-bright) !important;
    }
}

@media (max-width: 480px) {
    .pricing-price { font-size: 2.6rem !important; }
    .mode-returns  { font-size: 1.9rem !important; }
    .calculator-result-value { font-size: 2rem !important; }
    .gfs-brand-logo-text { font-size: 1.6rem !important; }
}

@media (max-width: 390px) {
    .pricing-price { font-size: 2.2rem !important; }
    .mode-returns  { font-size: 1.7rem !important; }
    .hero-title    { font-size: 1.85rem !important; }
}

/* ════════════════════════════════════════
   20. VIP SHIMMER ANIMATION FOR BADGES
   ════════════════════════════════════════ */

@keyframes vipShimmer {
    0%   { background-position: -200% center; }
    100% { background-position:  200% center; }
}

.pricing-badge {
    background-size: 200% auto !important;
    animation:
        badgeShimmerBlue  3s   linear       infinite,
        badgeGlowPulse    2s   ease-in-out  infinite !important;
}

/* END VIP PROFESSIONAL PREMIUM THEME v2 */

/* ═══════════════════════════════════════════
   HERO — 70% and 150% separate colors
   ═══════════════════════════════════════════ */

/* 70% — Banana Yellow to Dark Green */
.gfs-pct-70 {
    background: linear-gradient(135deg, #F5E642 0%, #D4C800 40%, #4CAF50 75%, #1B7A2F 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
    filter: drop-shadow(0 2px 16px rgba(212,200,0,0.4));
}

/* 150% — Dark Green to Banana Yellow */
.gfs-pct-150 {
    background: linear-gradient(135deg, #1B7A2F 0%, #4CAF50 35%, #D4C800 70%, #F5E642 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 900;
    filter: drop-shadow(0 2px 16px rgba(76,175,80,0.45));
}
   ═══════════════════════════════════════════ */

/* Starter — Light Gold / Champagne */
.gfs-price-starter {
    background: linear-gradient(135deg,
        #FFE8A0 0%,
        #FFD055 40%,
        #FFC040 70%,
        #FFD878 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 0 8px rgba(255,224,128,0.45));
}

/* Growing — Mid Gold / Classic Gold */
.gfs-price-growing {
    background: linear-gradient(135deg,
        #FFC857 0%,
        #F59E0B 40%,
        #E8820A 70%,
        #FFC040 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 0 10px rgba(245,158,11,0.5));
}

/* Mastery — Deep Gold / Rich Amber */
.gfs-price-mastery {
    background: linear-gradient(135deg,
        #F59E0B 0%,
        #D97706 35%,
        #B45309 65%,
        #E8820A 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    filter: drop-shadow(0 0 12px rgba(180,83,9,0.6));
}


/* ═══════════════════════════════════════════════════════════════
   HERO ALIGNMENT FIX — Live Markets & Sessions Removed
   Hero left column now vertically centered with brand card
   ═══════════════════════════════════════════════════════════════ */

/* Hero split: vertically center both columns */
.gfs-hero-split {
    align-items: center !important;
    min-height: calc(100vh - 80px) !important;
    padding: 40px 0 60px !important;
}

/* Left: no extra top spacing needed */
.gfs-hero-left {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 0 !important;
}

/* Hero trust bar — compact pill row */
.gfs-hero-trust-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px 20px !important;
    margin-top: 28px !important;
    padding: 16px 20px !important;
    background: rgba(13,20,40,0.70) !important;
    border: 1px solid rgba(255,200,87,0.10) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(10px) !important;
}

.gfs-hero-trust-bar span {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    color: #94A3B8 !important;
    letter-spacing: 0.02em !important;
}

/* Brand card right: ensure full height centering */
.gfs-hero-right {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* CTA group spacing */
.hero-cta-group {
    margin-bottom: 20px !important;
}

/* Mobile: stack vertically, trust bar full width */
@media (max-width: 960px) {
    .gfs-hero-split {
        min-height: auto !important;
        padding: 24px 0 40px !important;
        gap: 36px !important;
    }
    .gfs-hero-trust-bar {
        justify-content: flex-start !important;
        gap: 10px 16px !important;
        padding: 14px 16px !important;
    }
    .gfs-hero-trust-bar span {
        font-size: 0.78rem !important;
    }
}

@media (max-width: 768px) {
    .gfs-hero-trust-bar {
        flex-direction: column !important;
        gap: 8px !important;
        align-items: flex-start !important;
    }
    .gfs-hero-split {
        padding-top: 16px !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   TELEGRAM INFINITE SLIDER BANNER — Full Width Strip
   Positioned between Hero and Live Proof sections
   ═══════════════════════════════════════════════════════════════ */

/* ── Outer wrapper — full width strip ── */
.gfs-tg-slider-banner {
    width: 100%;
    overflow: hidden;
    background: linear-gradient(90deg, #0077b6 0%, #0096c7 25%, #00b4d8 50%, #0096c7 75%, #0077b6 100%);
    background-size: 200% auto;
    border-top: 1px solid rgba(255,255,255,0.15);
    border-bottom: 1px solid rgba(0,0,0,0.25);
    box-shadow:
        0 4px 30px rgba(0,150,200,0.30),
        0 -1px 0 rgba(255,255,255,0.08),
        inset 0 1px 0 rgba(255,255,255,0.15);
    position: relative;
    z-index: 10;
    animation: tgBannerShift 8s linear infinite;
}

@keyframes tgBannerShift {
    0%   { background-position: 0% center; }
    100% { background-position: 200% center; }
}

/* Soft edge fade masks */
.gfs-tg-slider-banner::before,
.gfs-tg-slider-banner::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 80px;
    z-index: 2;
    pointer-events: none;
}
.gfs-tg-slider-banner::before {
    left: 0;
    background: linear-gradient(to right, #0077b6, transparent);
}
.gfs-tg-slider-banner::after {
    right: 0;
    background: linear-gradient(to left, #0077b6, transparent);
}

/* ── Inner scroll container ── */
.gfs-tg-slider-inner {
    display: flex;
    align-items: center;
    width: 100%;
    overflow: hidden;
    padding: 0;
}

/* ── Moving track ── */
.gfs-tg-slider-track {
    display: flex;
    align-items: center;
    gap: 0;
    white-space: nowrap;
    animation: gfsTgScroll 28s linear infinite;
    will-change: transform;
    padding: 14px 0;
}

.gfs-tg-slider-track:hover {
    animation-play-state: paused;
    cursor: pointer;
}

@keyframes gfsTgScroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ── Individual slide item ── */
.gfs-tg-slide-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 28px 8px 20px;
    text-decoration: none !important;
    color: #ffffff !important;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    white-space: nowrap;
    border-radius: 50px;
    margin: 0 6px;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.20);
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.20);
}

.gfs-tg-slide-item:hover {
    background: rgba(255,255,255,0.20) !important;
    border-color: rgba(255,255,255,0.45) !important;
    transform: scale(1.04);
    color: #ffffff !important;
    text-decoration: none !important;
}

/* ── Telegram icon ── */
.gfs-tg-slide-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    filter: drop-shadow(0 1px 4px rgba(0,0,0,0.3));
}

/* ── FREE badge ── */
.gfs-tg-slide-badge {
    background: rgba(255,255,255,0.25);
    color: #ffffff;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    padding: 2px 9px;
    border-radius: 20px;
    text-transform: uppercase;
    border: 1px solid rgba(255,255,255,0.35);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.25);
}

/* ── Separator ── */
.gfs-tg-slide-sep {
    color: rgba(255,255,255,0.35);
    font-size: 0.75rem;
    flex-shrink: 0;
    margin: 0 8px;
    user-select: none;
}

/* ── Mobile responsive ── */
@media (max-width: 768px) {
    .gfs-tg-slider-track {
        animation-duration: 22s;
        padding: 12px 0;
    }

    .gfs-tg-slide-item {
        font-size: 0.80rem;
        padding: 7px 18px 7px 14px;
        gap: 8px;
    }

    .gfs-tg-slide-icon {
        width: 16px;
        height: 16px;
    }

    .gfs-tg-slide-badge {
        font-size: 0.56rem;
        padding: 2px 7px;
    }

    .gfs-tg-slider-banner::before,
    .gfs-tg-slider-banner::after {
        width: 40px;
    }
}

@media (max-width: 390px) {
    .gfs-tg-slide-item {
        font-size: 0.75rem;
        padding: 6px 14px 6px 12px;
    }
    .gfs-tg-slider-track {
        animation-duration: 18s;
    }
}

/* Also hide old fixed/mobile telegram buttons since slider replaces them */
.gfs-tg-fixed,
.telegram-desktop-only,
.telegram-mobile-only,
.telegram-btn-wrap {
    display: none !important;
}



/* ═══════════════════════════════════════════════════════════════
   BRAND CARD — VIP ZOOM / ENLARGED VERSION
   Golden Forex Scalping right panel — bigger, bolder, premium
   ═══════════════════════════════════════════════════════════════ */

/* Hero grid: give brand card column more room */
.gfs-hero-split {
    grid-template-columns: 1fr 500px !important;
    gap: 56px !important;
    align-items: center !important;
}

/* Brand card: larger, more imposing */
.gfs-brand-card {
    border-radius: 28px !important;
    border: 1px solid rgba(255,200,87,0.28) !important;
    background: linear-gradient(165deg, #0F1830 0%, #080D1A 60%, #040610 100%) !important;
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.08),
        0 40px 100px rgba(0,0,0,0.80),
        0 0 80px rgba(255,200,87,0.10),
        0 0 40px rgba(124,58,237,0.12) !important;
    overflow: hidden !important;
    position: relative !important;
    transition: transform 0.35s ease, box-shadow 0.35s ease !important;
}

.gfs-brand-card:hover {
    transform: translateY(-6px) scale(1.012) !important;
    box-shadow:
        0 0 0 1px rgba(255,200,87,0.18),
        0 50px 120px rgba(0,0,0,0.85),
        0 0 100px rgba(255,200,87,0.16),
        0 0 50px rgba(124,58,237,0.18) !important;
}

/* Gold top edge — thicker and brighter */
.gfs-brand-card::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 8% !important;
    right: 8% !important;
    height: 2px !important;
    background: linear-gradient(90deg,
        transparent,
        rgba(255,200,87,0.6),
        #FFC857,
        rgba(255,200,87,0.6),
        transparent) !important;
    box-shadow: 0 0 20px rgba(255,200,87,0.4) !important;
}

/* Side ambient glow line — purple left accent */
.gfs-brand-card::after {
    content: '' !important;
    position: absolute !important;
    top: 15% !important;
    bottom: 15% !important;
    left: 0 !important;
    width: 2px !important;
    background: linear-gradient(180deg,
        transparent,
        rgba(124,58,237,0.5),
        rgba(255,200,87,0.3),
        transparent) !important;
}

/* ── TOP SECTION: Logo + subtitle ── */
.gfs-brand-card-top {
    padding: 44px 40px 36px !important;
    text-align: center !important;
    background: linear-gradient(180deg,
        rgba(255,200,87,0.07) 0%,
        rgba(255,200,87,0.02) 100%) !important;
    border-bottom: 1px solid rgba(255,200,87,0.12) !important;
    position: relative !important;
}

/* Subtle radial behind logo */
.gfs-brand-card-top::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 120px !important;
    background: radial-gradient(ellipse 60% 80% at 50% 0%,
        rgba(255,200,87,0.10) 0%, transparent 70%) !important;
    pointer-events: none !important;
}

/* Logo text: much larger */
.gfs-brand-logo-text {
    font-family: 'Syne', var(--vip-font-display) !important;
    font-size: 2.8rem !important;
    font-weight: 900 !important;
    color: #FFFFFF !important;
    letter-spacing: -0.05em !important;
    line-height: 1.10 !important;
    text-shadow:
        0 0 40px rgba(255,200,87,0.20),
        0 2px 20px rgba(0,0,0,0.5) !important;
    margin-bottom: 12px !important;
    position: relative !important;
    z-index: 1 !important;
}

/* PRIVATE ACCESS SYSTEM subtitle */
.gfs-brand-card-sub {
    font-size: 0.72rem !important;
    letter-spacing: 5px !important;
    color: #FFC857 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    opacity: 0.90 !important;
    position: relative !important;
    z-index: 1 !important;
    text-shadow: 0 0 16px rgba(255,200,87,0.35) !important;
}

/* ── CHECKLIST ── */
.gfs-brand-checklist {
    padding: 30px 40px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    border-bottom: 1px solid rgba(255,200,87,0.10) !important;
    background: rgba(255,255,255,0.01) !important;
}

.gfs-brand-check-item {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    font-size: 1.08rem !important;
    color: #E2E8F0 !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
}

.gfs-check-icon {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: rgba(255,200,87,0.12) !important;
    border: 1.5px solid rgba(255,200,87,0.40) !important;
    color: #FFC857 !important;
    font-size: 0.88rem !important;
    font-weight: 900 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    box-shadow:
        0 0 14px rgba(255,200,87,0.15),
        inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

/* ── MYFXBOOK BADGE ── */
.gfs-myfxbook-badge {
    margin: 24px 40px !important;
    background: rgba(0,0,0,0.55) !important;
    border: 1px solid rgba(255,200,87,0.22) !important;
    border-radius: 16px !important;
    padding: 20px 24px !important;
    text-align: center !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.05),
        0 4px 20px rgba(0,0,0,0.3) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Subtle inner glow */
.gfs-myfxbook-badge::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: 16px !important;
    background: radial-gradient(ellipse 80% 60% at 50% 100%,
        rgba(255,200,87,0.05) 0%, transparent 70%) !important;
    pointer-events: none !important;
}

.gfs-myfxbook-label {
    font-size: 0.64rem !important;
    letter-spacing: 3.5px !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    margin-bottom: 8px !important;
    font-weight: 700 !important;
}

.gfs-myfxbook-logo {
    font-size: 2rem !important;
    color: #F0F4F8 !important;
    font-family: Georgia, serif !important;
    letter-spacing: -0.02em !important;
    position: relative !important;
    z-index: 1 !important;
}

/* ── BOTTOM STRIP ── */
.gfs-brand-card-bottom {
    text-align: center !important;
    padding: 18px 20px !important;
    font-size: 0.72rem !important;
    font-weight: 900 !important;
    letter-spacing: 4px !important;
    color: #FFC857 !important;
    text-transform: uppercase !important;
    border-top: 1px solid rgba(255,200,87,0.12) !important;
    background: rgba(255,200,87,0.03) !important;
    text-shadow: 0 0 20px rgba(255,200,87,0.30) !important;
}

/* ════════════════════════════════════════
   BRAND CARD — TABLET RESPONSIVE
   ════════════════════════════════════════ */

@media (max-width: 1100px) {
    .gfs-hero-split {
        grid-template-columns: 1fr 440px !important;
        gap: 40px !important;
    }
    .gfs-brand-logo-text { font-size: 2.4rem !important; }
    .gfs-brand-card-top  { padding: 36px 32px 28px !important; }
    .gfs-brand-checklist { padding: 24px 32px !important; gap: 14px !important; }
    .gfs-myfxbook-badge  { margin: 20px 32px !important; }
    .gfs-brand-check-item { font-size: 1rem !important; }
}

/* Stack vertically on tablet */
@media (max-width: 960px) {
    .gfs-hero-split {
        grid-template-columns: 1fr !important;
        gap: 40px !important;
    }
    .gfs-hero-right {
        display: flex !important;
        justify-content: center !important;
    }
    .gfs-brand-card {
        max-width: 500px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
    .gfs-brand-logo-text { font-size: 2.6rem !important; }
}

/* Mobile */
@media (max-width: 600px) {
    .gfs-brand-card {
        border-radius: 20px !important;
        max-width: 100% !important;
    }
    .gfs-brand-logo-text  { font-size: 2rem !important; }
    .gfs-brand-card-top   { padding: 28px 24px 22px !important; }
    .gfs-brand-checklist  { padding: 20px 24px !important; gap: 14px !important; }
    .gfs-brand-check-item { font-size: 0.95rem !important; gap: 12px !important; }
    .gfs-check-icon       { width: 26px !important; height: 26px !important; }
    .gfs-myfxbook-badge   { margin: 18px 24px !important; padding: 16px 20px !important; }
    .gfs-myfxbook-logo    { font-size: 1.7rem !important; }
    .gfs-brand-card-bottom { padding: 14px !important; font-size: 0.66rem !important; letter-spacing: 3px !important; }
}

@media (max-width: 390px) {
    .gfs-brand-logo-text  { font-size: 1.75rem !important; }
    .gfs-brand-card-top   { padding: 24px 18px 18px !important; }
    .gfs-brand-checklist  { padding: 18px 18px !important; }
    .gfs-myfxbook-badge   { margin: 14px 18px !important; }
    .gfs-brand-card-sub   { font-size: 0.60rem !important; letter-spacing: 3.5px !important; }
}



/* ═══════════════════════════════════════════════════════════════
   BRAND CARD — EXTRA LARGE BOOST v3
   ═══════════════════════════════════════════════════════════════ */

.gfs-hero-split {
    grid-template-columns: 1fr 580px !important;
    gap: 60px !important;
}

.gfs-brand-card-top {
    padding: 52px 48px 42px !important;
}

.gfs-brand-logo-text {
    font-size: 3.4rem !important;
    line-height: 1.08 !important;
    margin-bottom: 16px !important;
}

.gfs-brand-card-sub {
    font-size: 0.80rem !important;
    letter-spacing: 6px !important;
}

.gfs-brand-checklist {
    padding: 36px 48px !important;
    gap: 22px !important;
}

.gfs-brand-check-item {
    font-size: 1.18rem !important;
    gap: 18px !important;
}

.gfs-check-icon {
    width: 36px !important;
    height: 36px !important;
    font-size: 1rem !important;
}

.gfs-myfxbook-badge {
    margin: 28px 48px !important;
    padding: 24px 30px !important;
    border-radius: 18px !important;
}

.gfs-myfxbook-label {
    font-size: 0.70rem !important;
    letter-spacing: 4px !important;
    margin-bottom: 10px !important;
}

.gfs-myfxbook-logo {
    font-size: 2.4rem !important;
}

.gfs-brand-card-bottom {
    padding: 22px 24px !important;
    font-size: 0.78rem !important;
    letter-spacing: 5px !important;
}

/* Tablet */
@media (max-width: 1200px) {
    .gfs-hero-split {
        grid-template-columns: 1fr 500px !important;
        gap: 44px !important;
    }
    .gfs-brand-logo-text  { font-size: 2.9rem !important; }
    .gfs-brand-card-top   { padding: 44px 40px 36px !important; }
    .gfs-brand-checklist  { padding: 30px 40px !important; }
    .gfs-myfxbook-badge   { margin: 22px 40px !important; }
    .gfs-brand-check-item { font-size: 1.08rem !important; }
}

@media (max-width: 960px) {
    .gfs-hero-split        { grid-template-columns: 1fr !important; }
    .gfs-brand-card        { max-width: 540px !important; }
    .gfs-brand-logo-text   { font-size: 2.8rem !important; }
}

@media (max-width: 600px) {
    .gfs-brand-card        { max-width: 100% !important; }
    .gfs-brand-logo-text   { font-size: 2.2rem !important; }
    .gfs-brand-card-top    { padding: 32px 26px 26px !important; }
    .gfs-brand-checklist   { padding: 24px 26px !important; gap: 16px !important; }
    .gfs-brand-check-item  { font-size: 1rem !important; }
    .gfs-check-icon        { width: 30px !important; height: 30px !important; }
    .gfs-myfxbook-badge    { margin: 18px 26px !important; padding: 18px 22px !important; }
    .gfs-myfxbook-logo     { font-size: 2rem !important; }
    .gfs-brand-card-bottom { padding: 16px !important; }
}

@media (max-width: 390px) {
    .gfs-brand-logo-text  { font-size: 1.9rem !important; }
    .gfs-brand-card-top   { padding: 26px 20px 20px !important; }
    .gfs-brand-checklist  { padding: 20px 20px !important; }
    .gfs-myfxbook-badge   { margin: 14px 20px !important; }
    .gfs-brand-check-item { font-size: 0.95rem !important; }
}



/* ═══════════════════════════════════════════════════════════════
   HERO LEFT — Text Size Reduce & Balance Fix v4
   ═══════════════════════════════════════════════════════════════ */

/* Hero title — smaller, tighter */
.hero-title {
    font-size: clamp(1.9rem, 3.8vw, 3.2rem) !important;
    line-height: 1.10 !important;
    letter-spacing: -0.030em !important;
    margin-bottom: 18px !important;
}

/* Subtitle paragraph — compact */
.hero-subtitle {
    font-size: clamp(0.88rem, 1.4vw, 1.05rem) !important;
    line-height: 1.70 !important;
    color: #8896A8 !important;
    margin-bottom: 28px !important;
    max-width: 560px !important;
}

/* CTA buttons — slightly smaller */
.hero-cta-group .btn {
    font-size: 0.88rem !important;
    padding: 13px 26px !important;
    letter-spacing: 0.06em !important;
}

/* Hero badge — compact */
.hero-badge {
    font-size: 0.80rem !important;
    padding: 7px 16px !important;
    margin-bottom: 18px !important;
}

/* Trust bar — slim */
.gfs-hero-trust-bar {
    margin-top: 22px !important;
    padding: 13px 18px !important;
}

.gfs-hero-trust-bar span {
    font-size: 0.78rem !important;
}

/* Tablet */
@media (max-width: 1200px) {
    .hero-title    { font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important; }
    .hero-subtitle { font-size: 0.95rem !important; }
}

/* Mobile */
@media (max-width: 768px) {
    .hero-title    { font-size: clamp(1.7rem, 7vw, 2.4rem) !important; }
    .hero-subtitle { font-size: 0.92rem !important; max-width: 100% !important; }
    .hero-cta-group .btn { font-size: 0.84rem !important; padding: 12px 20px !important; }
}

@media (max-width: 390px) {
    .hero-title    { font-size: 1.65rem !important; }
    .hero-subtitle { font-size: 0.86rem !important; }
    .hero-cta-group .btn { font-size: 0.80rem !important; padding: 11px 16px !important; }
}



/* ═══════════════════════════════════════════════════════════════
   HERO LAYOUT — COMPLETE FIX v5
   Fix: Brand card cut off, blank space, container overflow
   ═══════════════════════════════════════════════════════════════ */

/* Container: full width with proper padding */
.hero-section .container {
    max-width: 1320px !important;
    width: 100% !important;
    padding: 0 32px !important;
    overflow: visible !important;
}

/* Hero split: balanced 55/45 ratio, no overflow */
.gfs-hero-split {
    display: grid !important;
    grid-template-columns: 55fr 45fr !important;
    gap: 48px !important;
    align-items: center !important;
    min-height: calc(100vh - 80px) !important;
    padding: 60px 0 60px !important;
    width: 100% !important;
    overflow: visible !important;
}

/* Left column: vertically centered */
.gfs-hero-left {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-width: 0 !important;
}

/* Right column: card fills column width */
.gfs-hero-right {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    width: 100% !important;
}

/* Brand card: fills column, no fixed pixel width */
.gfs-brand-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ── Element sizes tuned for 45% column ── */
.gfs-brand-card-top {
    padding: 44px 40px 36px !important;
}

.gfs-brand-logo-text {
    font-size: clamp(2rem, 3vw, 3rem) !important;
    line-height: 1.10 !important;
    margin-bottom: 14px !important;
}

.gfs-brand-card-sub {
    font-size: 0.72rem !important;
    letter-spacing: 5px !important;
}

.gfs-brand-checklist {
    padding: 30px 40px !important;
    gap: 20px !important;
}

.gfs-brand-check-item {
    font-size: 1.05rem !important;
    gap: 16px !important;
}

.gfs-check-icon {
    width: 32px !important;
    height: 32px !important;
    font-size: 0.95rem !important;
    flex-shrink: 0 !important;
}

.gfs-myfxbook-badge {
    margin: 22px 40px !important;
    padding: 20px 28px !important;
}

.gfs-myfxbook-logo {
    font-size: 2.1rem !important;
}

.gfs-brand-card-bottom {
    padding: 18px 20px !important;
    font-size: 0.72rem !important;
    letter-spacing: 4px !important;
}

/* Hero section: no min-height clipping */
.hero-section {
    overflow: visible !important;
    min-height: 100vh !important;
}

/* ── 1280px — shrink gap slightly ── */
@media (max-width: 1280px) {
    .gfs-hero-split {
        gap: 36px !important;
        grid-template-columns: 56fr 44fr !important;
    }
    .gfs-brand-logo-text  { font-size: clamp(1.8rem, 2.8vw, 2.6rem) !important; }
    .gfs-brand-card-top   { padding: 36px 32px 28px !important; }
    .gfs-brand-checklist  { padding: 24px 32px !important; gap: 16px !important; }
    .gfs-myfxbook-badge   { margin: 18px 32px !important; padding: 18px 24px !important; }
    .gfs-brand-check-item { font-size: 1rem !important; }
}

/* ── 1024px ── */
@media (max-width: 1024px) {
    .gfs-hero-split {
        gap: 28px !important;
        grid-template-columns: 58fr 42fr !important;
    }
    .gfs-brand-logo-text { font-size: clamp(1.6rem, 2.5vw, 2.2rem) !important; }
    .hero-section .container { padding: 0 24px !important; }
}

/* ── 960px — stack vertically ── */
@media (max-width: 960px) {
    .gfs-hero-split {
        grid-template-columns: 1fr !important;
        min-height: auto !important;
        padding: 40px 0 48px !important;
        gap: 36px !important;
    }
    .gfs-hero-right {
        width: 100% !important;
    }
    .gfs-brand-card {
        max-width: 500px !important;
        margin: 0 auto !important;
    }
    .gfs-brand-logo-text { font-size: 2.4rem !important; }
    .gfs-brand-card-top  { padding: 36px 32px 28px !important; }
    .gfs-brand-checklist { padding: 24px 32px !important; }
    .gfs-myfxbook-badge  { margin: 18px 32px !important; }
}

/* ── 768px mobile ── */
@media (max-width: 768px) {
    .hero-section .container { padding: 0 16px !important; }
    .gfs-hero-split { padding: 28px 0 40px !important; gap: 28px !important; }
    .gfs-brand-card { max-width: 100% !important; border-radius: 18px !important; }
    .gfs-brand-logo-text  { font-size: 2rem !important; }
    .gfs-brand-card-top   { padding: 28px 24px 22px !important; }
    .gfs-brand-checklist  { padding: 20px 24px !important; gap: 14px !important; }
    .gfs-brand-check-item { font-size: 0.95rem !important; }
    .gfs-check-icon       { width: 28px !important; height: 28px !important; }
    .gfs-myfxbook-badge   { margin: 16px 24px !important; padding: 16px 20px !important; }
    .gfs-myfxbook-logo    { font-size: 1.8rem !important; }
    .gfs-brand-card-bottom { padding: 14px !important; }
}

/* ── 390px small phones ── */
@media (max-width: 390px) {
    .gfs-brand-logo-text  { font-size: 1.75rem !important; }
    .gfs-brand-card-top   { padding: 22px 18px 18px !important; }
    .gfs-brand-checklist  { padding: 16px 18px !important; gap: 12px !important; }
    .gfs-brand-check-item { font-size: 0.88rem !important; gap: 12px !important; }
    .gfs-check-icon       { width: 24px !important; height: 24px !important; font-size: 0.75rem !important; }
    .gfs-myfxbook-badge   { margin: 12px 18px !important; padding: 14px 16px !important; }
    .gfs-myfxbook-logo    { font-size: 1.55rem !important; }
}



/* ═══════════════════════════════════════════════════════════════
   "GET LICENSE" BUTTON — Exact Style Match v5
   Warm amber-gold gradient, rounded pill, dark text
   ═══════════════════════════════════════════════════════════════ */

/* ── Universal button base override ── */
.btn-accent,
.nav-cta,
.pricing-button.btn-accent,
a.btn-accent,
button.btn-accent,
.hero-cta-group .btn-accent,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: linear-gradient(
        160deg,
        #F5B731 0%,
        #E8A020 35%,
        #D4890E 70%,
        #C07A00 100%
    ) !important;
    color: #1A1000 !important;
    font-family: 'Syne', 'Poppins', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    letter-spacing: 0.02em !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 14px 30px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    position: relative !important;
    overflow: hidden !important;
    transition: transform 0.20s ease, box-shadow 0.20s ease, filter 0.20s ease !important;

    /* Outer warm glow — matches screenshot amber halo */
    box-shadow:
        0 0 0 1px rgba(200,140,0,0.25),
        0 4px 16px rgba(220,150,0,0.40),
        0 1px 0 rgba(255,235,150,0.30) inset,
        0 -2px 0 rgba(120,70,0,0.35) inset !important;

    /* Top highlight stripe — the bright band seen in image */
    background-image:
        linear-gradient(
            180deg,
            rgba(255,240,160,0.18) 0%,
            transparent 45%
        ),
        linear-gradient(
            160deg,
            #F5B731 0%,
            #E8A020 35%,
            #D4890E 70%,
            #C07A00 100%
        ) !important;
}

.btn-accent:hover,
.nav-cta:hover,
a.btn-accent:hover,
button.btn-accent:hover {
    filter: brightness(1.08) !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 0 0 1px rgba(200,140,0,0.35),
        0 8px 28px rgba(220,150,0,0.55),
        0 1px 0 rgba(255,235,150,0.40) inset,
        0 -2px 0 rgba(120,70,0,0.40) inset !important;
    color: #100A00 !important;
}

.btn-accent:active,
.nav-cta:active {
    transform: translateY(0px) !important;
    filter: brightness(0.96) !important;
}

/* Nav CTA — slightly smaller for header */
.nav-cta {
    font-size: 0.87rem !important;
    padding: 10px 22px !important;
    border-radius: 9px !important;
}

/* Pricing button — full width, slightly taller */
.pricing-button.btn-accent,
.pricing-card .btn-accent {
    width: 100% !important;
    padding: 16px 30px !important;
    font-size: 0.97rem !important;
    border-radius: 11px !important;
}

/* Hero CTA pair */
.hero-cta-group .btn-accent {
    padding: 14px 28px !important;
    font-size: 0.92rem !important;
}

/* Mobile */
@media (max-width: 768px) {
    .btn-accent,
    a.btn-accent {
        font-size: 0.88rem !important;
        padding: 13px 22px !important;
    }
    .nav-cta {
        font-size: 0.82rem !important;
        padding: 9px 18px !important;
    }
}

@media (max-width: 390px) {
    .btn-accent,
    a.btn-accent {
        font-size: 0.84rem !important;
        padding: 12px 18px !important;
    }
}



/* ═══════════════════════════════
   BUTTON TEXT — Pure Black
   ═══════════════════════════════ */

.btn-accent,
.nav-cta,
a.btn-accent,
button.btn-accent,
.pricing-button.btn-accent,
.hero-cta-group .btn-accent,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    text-shadow: none !important;
}

.btn-accent:hover,
.nav-cta:hover,
a.btn-accent:hover {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}



/* ═══════════════════════════════════════════════════════════════
   BRAND CARD — SPLIT ROW: MyFXBook + Mini Stats
   ═══════════════════════════════════════════════════════════════ */

/* Split row wrapper */
.gfs-brand-split-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255,200,87,0.10) !important;
}

/* MyFXBook side */
.gfs-brand-split-row .gfs-myfxbook-badge {
    margin: 20px 0 20px 28px !important;
    padding: 18px 20px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255,200,87,0.20) !important;
    background: rgba(0,0,0,0.45) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Mini stats side */
.gfs-brand-mini-stats {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 20px 24px 20px 20px !important;
    background: rgba(255,200,87,0.03) !important;
    border-left: 1px solid rgba(255,200,87,0.10) !important;
}

.gfs-brand-stat-item {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
}

/* Live green dot */
.gfs-brand-stat-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #22C55E !important;
    box-shadow: 0 0 8px rgba(34,197,94,0.7) !important;
    flex-shrink: 0 !important;
    animation: statDotPulse 2s ease-in-out infinite !important;
}

@keyframes statDotPulse {
    0%, 100% { box-shadow: 0 0 6px rgba(34,197,94,0.6); }
    50%       { box-shadow: 0 0 14px rgba(34,197,94,0.9); }
}

.gfs-brand-stat-icon {
    font-size: 0.82rem !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}

.gfs-brand-stat-text {
    font-size: 0.80rem !important;
    font-weight: 600 !important;
    color: #CBD5E1 !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
}

/* Mobile: stack vertically */
@media (max-width: 600px) {
    .gfs-brand-split-row {
        grid-template-columns: 1fr !important;
    }
    .gfs-brand-split-row .gfs-myfxbook-badge {
        margin: 16px 18px 0 18px !important;
    }
    .gfs-brand-mini-stats {
        padding: 16px 18px !important;
        border-left: none !important;
        border-top: 1px solid rgba(255,200,87,0.10) !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 10px 20px !important;
    }
}



/* ═══════════════════════════════════════════════════════════════
   BRAND CHECKLIST — 2 Column Layout (checks + stats in red box)
   ═══════════════════════════════════════════════════════════════ */

/* Checklist becomes a 2-col grid */
.gfs-brand-checklist {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
    padding: 0 !important;
}

/* Left check column */
.gfs-brand-check-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    padding: 28px 24px 28px 32px !important;
    border-right: 1px solid rgba(255,200,87,0.10) !important;
}

/* Right stat column */
.gfs-brand-stat-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    padding: 28px 24px 28px 24px !important;
    justify-content: center !important;
}

/* MyFXBook: full width, no second column */
.gfs-brand-split-row {
    grid-template-columns: 1fr !important;
}

.gfs-brand-split-row .gfs-myfxbook-badge {
    margin: 16px 28px 20px 28px !important;
}

/* Mobile — keep 2-column layout on phone */
@media (max-width: 600px) {
    .gfs-brand-checklist {
        grid-template-columns: 1fr 1fr !important;
    }
    .gfs-brand-check-col {
        padding: 18px 12px 18px 16px !important;
        border-right: 1px solid rgba(255,200,87,0.10) !important;
        border-bottom: none !important;
        gap: 14px !important;
    }
    .gfs-brand-stat-col {
        padding: 18px 12px 18px 12px !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 14px !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }
}



/* ═══════════════════════════════════════════════════════════════
   BRAND CHECKLIST — Uniform Size Both Columns v6
   ═══════════════════════════════════════════════════════════════ */

/* Both columns: equal text size */
.gfs-brand-check-col .gfs-brand-check-item,
.gfs-brand-stat-col .gfs-brand-check-item {
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #E2E8F0 !important;
    gap: 14px !important;
    line-height: 1.35 !important;
}

/* Check icon: uniform across both columns */
.gfs-brand-check-col .gfs-check-icon,
.gfs-brand-stat-col .gfs-check-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 0.85rem !important;
    flex-shrink: 0 !important;
    align-self: flex-start !important;
    margin-top: 1px !important;
}

/* Column padding: balanced */
.gfs-brand-check-col {
    padding: 22px 28px 22px 28px !important;
    gap: 14px !important;
}

.gfs-brand-stat-col {
    padding: 22px 28px 22px 28px !important;
    gap: 14px !important;
}

/* Mobile: 2-column, smaller font for phone */
@media (max-width: 600px) {
    .gfs-brand-stat-col .gfs-brand-check-item,
    .gfs-brand-check-col .gfs-brand-check-item {
        font-size: 0.78rem !important;
        justify-content: flex-start !important;
        text-align: left !important;
        gap: 8px !important;
    }
    .gfs-brand-stat-col .gfs-check-icon,
    .gfs-brand-check-col .gfs-check-icon {
        width: 22px !important;
        height: 22px !important;
        font-size: 0.72rem !important;
    }
    .gfs-brand-stat-col {
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }
}



/* ═══════════════════════════════════════════════════════════════
   TELEGRAM SLIDER — Theme-Matched Dark Gold Style
   ═══════════════════════════════════════════════════════════════ */

.gfs-tg-slider-banner {
    background: linear-gradient(90deg, #080D1A 0%, #0D1428 30%, #111C35 50%, #0D1428 70%, #080D1A 100%) !important;
    border-top: 1px solid rgba(255,200,87,0.15) !important;
    border-bottom: 1px solid rgba(255,200,87,0.15) !important;
    box-shadow:
        0 4px 30px rgba(0,0,0,0.5),
        inset 0 1px 0 rgba(255,200,87,0.08) !important;
    animation: none !important;
}

.gfs-tg-slider-banner::before {
    background: linear-gradient(to right, #080D1A, transparent) !important;
}
.gfs-tg-slider-banner::after {
    background: linear-gradient(to left, #080D1A, transparent) !important;
}

.gfs-tg-slide-item {
    background: rgba(255,200,87,0.06) !important;
    border: 1px solid rgba(255,200,87,0.18) !important;
    color: #E2E8F0 !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.3) !important;
}

.gfs-tg-slide-item:hover {
    background: rgba(255,200,87,0.12) !important;
    border-color: rgba(255,200,87,0.40) !important;
    color: #FFC857 !important;
}

.gfs-tg-slide-badge {
    background: rgba(255,200,87,0.15) !important;
    color: #FFC857 !important;
    border: 1px solid rgba(255,200,87,0.30) !important;
    font-size: 0.60rem !important;
}

.gfs-tg-slide-sep {
    color: rgba(255,200,87,0.25) !important;
}



/* ═══════════════════════════════════════════════════════════════
   BRAND CARD — Stats Row + Social Icons + Bottom Row
   ═══════════════════════════════════════════════════════════════ */

/* ── 4-column stats row ── */
.gfs-brand-stats-row {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    border-top: 1px solid rgba(255,200,87,0.10) !important;
    border-bottom: 1px solid rgba(255,200,87,0.10) !important;
}

.gfs-brand-stat-box {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 14px 8px !important;
    gap: 4px !important;
    border-right: 1px solid rgba(255,200,87,0.08) !important;
    transition: background 0.2s ease !important;
}

.gfs-brand-stat-box:last-child {
    border-right: none !important;
}

.gfs-brand-stat-box:hover {
    background: rgba(255,200,87,0.04) !important;
}

.gfs-bstat-value {
    font-family: 'Syne', sans-serif !important;
    font-size: 1.05rem !important;
    font-weight: 900 !important;
    color: #FFC857 !important;
    letter-spacing: -0.02em !important;
    line-height: 1 !important;
    text-shadow: 0 0 12px rgba(255,200,87,0.25) !important;
}

.gfs-bstat-label {
    font-size: 0.60rem !important;
    font-weight: 700 !important;
    color: #64748B !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}

/* ── Bottom row: MyFXBook + Socials ── */
.gfs-brand-bottom-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    border-bottom: 1px solid rgba(255,200,87,0.10) !important;
}

/* MyFXBook in bottom row */
.gfs-brand-bottom-row .gfs-myfxbook-badge {
    margin: 16px 0 16px 24px !important;
    padding: 14px 18px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255,200,87,0.18) !important;
    background: rgba(0,0,0,0.45) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Social panel */
.gfs-brand-socials {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 16px 16px 16px 12px !important;
    border-left: 1px solid rgba(255,200,87,0.08) !important;
}

.gfs-social-label {
    font-size: 0.58rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em !important;
    color: #475569 !important;
    text-transform: uppercase !important;
}

.gfs-social-icons {
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
}

/* Individual social icon button */
.gfs-social-icon {
    width: 34px !important;
    height: 34px !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}

.gfs-social-icon svg {
    width: 16px !important;
    height: 16px !important;
}

.gfs-social-icon:hover {
    transform: translateY(-2px) !important;
}

/* Telegram */
.gfs-si-tg {
    background: rgba(0,136,204,0.15) !important;
    color: #29B6F6 !important;
    border-color: rgba(0,136,204,0.25) !important;
}
.gfs-si-tg:hover {
    background: rgba(0,136,204,0.28) !important;
    box-shadow: 0 4px 16px rgba(0,136,204,0.30) !important;
    color: #29B6F6 !important;
}

/* YouTube */
.gfs-si-yt {
    background: rgba(255,0,0,0.12) !important;
    color: #F87171 !important;
    border-color: rgba(255,0,0,0.22) !important;
}
.gfs-si-yt:hover {
    background: rgba(255,0,0,0.25) !important;
    box-shadow: 0 4px 16px rgba(255,0,0,0.25) !important;
    color: #F87171 !important;
}

/* Facebook */
.gfs-si-fb {
    background: rgba(24,119,242,0.12) !important;
    color: #60A5FA !important;
    border-color: rgba(24,119,242,0.22) !important;
}
.gfs-si-fb:hover {
    background: rgba(24,119,242,0.25) !important;
    box-shadow: 0 4px 16px rgba(24,119,242,0.25) !important;
    color: #60A5FA !important;
}

/* MyFXBook icon */
.gfs-si-mfx {
    background: rgba(255,200,87,0.10) !important;
    color: #FFC857 !important;
    border-color: rgba(255,200,87,0.22) !important;
}
.gfs-si-mfx:hover {
    background: rgba(255,200,87,0.22) !important;
    box-shadow: 0 4px 16px rgba(255,200,87,0.22) !important;
    color: #FFC857 !important;
}

/* ── Mobile responsive ── */
@media (max-width: 600px) {
    .gfs-brand-stats-row {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .gfs-brand-stat-box:nth-child(2) { border-right: none !important; }
    .gfs-brand-stat-box:nth-child(3) { border-top: 1px solid rgba(255,200,87,0.08) !important; }

    .gfs-brand-bottom-row {
        grid-template-columns: 1fr !important;
    }
    .gfs-brand-bottom-row .gfs-myfxbook-badge {
        margin: 14px 18px 0 18px !important;
    }
    .gfs-brand-socials {
        border-left: none !important;
        border-top: 1px solid rgba(255,200,87,0.08) !important;
        padding: 12px 18px 14px !important;
    }
    .gfs-bstat-value { font-size: 0.95rem !important; }
}



/* ═══════════════════════════════════════════════════════════════
   SLIDER — Social Color Variants + Stat Items
   ═══════════════════════════════════════════════════════════════ */

/* Telegram */
.gfs-slide-tg { color: #29B6F6 !important; border-color: rgba(0,136,204,0.30) !important; background: rgba(0,136,204,0.10) !important; }
.gfs-slide-tg:hover { background: rgba(0,136,204,0.22) !important; color: #29B6F6 !important; }

/* Facebook */
.gfs-slide-fb { color: #74B0FF !important; border-color: rgba(24,119,242,0.30) !important; background: rgba(24,119,242,0.10) !important; }
.gfs-slide-fb:hover { background: rgba(24,119,242,0.22) !important; color: #74B0FF !important; }

/* YouTube */
.gfs-slide-yt { color: #F87171 !important; border-color: rgba(255,0,0,0.25) !important; background: rgba(255,0,0,0.08) !important; }
.gfs-slide-yt:hover { background: rgba(255,0,0,0.18) !important; color: #F87171 !important; }

/* MyFXBook */
.gfs-slide-mfx { color: #FFC857 !important; border-color: rgba(255,200,87,0.28) !important; background: rgba(255,200,87,0.08) !important; }
.gfs-slide-mfx:hover { background: rgba(255,200,87,0.16) !important; color: #FFC857 !important; }

/* Stat items — not links */
.gfs-slide-stat {
    flex-direction: column !important;
    gap: 2px !important;
    padding: 6px 20px !important;
    background: rgba(255,200,87,0.06) !important;
    border-color: rgba(255,200,87,0.18) !important;
    cursor: default !important;
}

.gfs-slide-stat-val {
    font-family: 'Syne', sans-serif !important;
    font-size: 1.05rem !important;
    font-weight: 900 !important;
    color: #FFC857 !important;
    line-height: 1.1 !important;
}

.gfs-slide-stat-lbl {
    font-size: 0.60rem !important;
    font-weight: 700 !important;
    color: #64748B !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}




/* ═══════════════════════════════════════════════════════════════
   MOBILE TEXT OPTIMISATION v30 — Home Page Full Coverage
   Target: ≤768px tablets · ≤480px phones · ≤390px small phones
   Rule: APPEND ONLY — desktop layouts completely unchanged
   All rules inside media queries — zero global/desktop impact
   ═══════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────
   SHARED BASE — ≤768px
   ────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* ── HERO: badge, title, subtitle, trust bar ── */
    .hero-badge {
        font-size: 0.74rem !important;
        padding: 5px 12px !important;
        line-height: 1.55 !important;
        white-space: normal !important;
        word-break: break-word !important;
        text-align: center !important;
        max-width: 100% !important;
    }

    .hero-title {
        font-size: clamp(1.65rem, 6.8vw, 2.2rem) !important;
        line-height: 1.10 !important;
        letter-spacing: -0.025em !important;
        text-align: center !important;
        margin-bottom: 14px !important;
    }

    .hero-subtitle {
        font-size: 0.88rem !important;
        line-height: 1.70 !important;
        text-align: center !important;
        max-width: 100% !important;
        margin-bottom: 18px !important;
    }

    /* CTA buttons — stack, full width */
    .hero-cta-group {
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        align-items: stretch !important;
        margin-bottom: 16px !important;
    }
    .hero-cta-group .btn {
        width: 100% !important;
        font-size: 0.86rem !important;
        padding: 13px 18px !important;
        text-align: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        letter-spacing: 0.04em !important;
    }

    /* Trust bar — column stack, compact */
    .gfs-hero-trust-bar {
        flex-direction: column !important;
        gap: 7px !important;
        padding: 12px 14px !important;
        font-size: 0.78rem !important;
        margin-top: 18px !important;
    }
    .gfs-hero-trust-bar span {
        font-size: 0.78rem !important;
        gap: 6px !important;
        line-height: 1.4 !important;
        word-break: break-word !important;
    }

    /* ── BRAND CARD ── */
    .gfs-brand-card {
        max-width: 100% !important;
        border-radius: 16px !important;
        box-sizing: border-box !important;
    }
    .gfs-brand-logo-text {
        font-size: 1.85rem !important;
        line-height: 1.12 !important;
        margin-bottom: 10px !important;
    }
    .gfs-brand-card-sub {
        font-size: 0.58rem !important;
        letter-spacing: 3px !important;
    }
    .gfs-brand-card-top {
        padding: 24px 20px 18px !important;
    }

    /* Checklist: 2 columns still ok at 768px */
    .gfs-brand-check-col,
    .gfs-brand-stat-col {
        padding: 18px 16px !important;
        gap: 14px !important;
    }
    .gfs-brand-check-col .gfs-brand-check-item,
    .gfs-brand-stat-col .gfs-brand-check-item {
        font-size: 0.88rem !important;
        gap: 10px !important;
    }
    .gfs-brand-check-col .gfs-check-icon,
    .gfs-brand-stat-col .gfs-check-icon {
        width: 24px !important;
        height: 24px !important;
        font-size: 0.72rem !important;
    }

    /* Stats row: 2×2 grid on mobile (not 4×1) */
    .gfs-brand-stats-row {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .gfs-brand-stat-box:nth-child(2) {
        border-right: none !important;
    }
    .gfs-brand-stat-box:nth-child(3) {
        border-top: 1px solid rgba(255,200,87,0.08) !important;
    }
    .gfs-bstat-value {
        font-size: 0.90rem !important;
    }
    .gfs-bstat-label {
        font-size: 0.55rem !important;
    }
    .gfs-brand-stat-box {
        padding: 12px 6px !important;
    }

    /* Bottom row: stack vertically */
    .gfs-brand-bottom-row {
        grid-template-columns: 1fr !important;
    }
    .gfs-brand-bottom-row .gfs-myfxbook-badge {
        margin: 12px 16px 0 16px !important;
        padding: 12px 14px !important;
    }
    .gfs-myfxbook-label {
        font-size: 0.58rem !important;
        letter-spacing: 1.5px !important;
    }
    .gfs-myfxbook-logo {
        font-size: 1.5rem !important;
    }
    .gfs-brand-socials {
        border-left: none !important;
        border-top: 1px solid rgba(255,200,87,0.08) !important;
        padding: 10px 14px 12px !important;
        gap: 6px !important;
    }
    .gfs-social-icons {
        gap: 6px !important;
    }
    .gfs-social-icon {
        width: 30px !important;
        height: 30px !important;
    }
    .gfs-social-icon svg {
        width: 14px !important;
        height: 14px !important;
    }
    .gfs-brand-card-bottom {
        font-size: 0.58rem !important;
        letter-spacing: 2.5px !important;
        padding: 12px !important;
    }

    /* MyFXBook standalone badge */
    .gfs-myfxbook-badge {
        margin: 14px 18px !important;
        padding: 14px 16px !important;
    }

    /* ── TELEGRAM SLIDER ── */
    .gfs-tg-slide-item {
        font-size: 0.76rem !important;
        padding: 6px 14px 6px 12px !important;
        gap: 7px !important;
        margin: 0 4px !important;
    }
    .gfs-tg-slide-icon {
        width: 14px !important;
        height: 14px !important;
    }
    .gfs-tg-slide-badge {
        font-size: 0.52rem !important;
        padding: 2px 6px !important;
    }
    .gfs-tg-slide-sep {
        font-size: 0.65rem !important;
        margin: 0 4px !important;
    }

    /* ── LIVE PROOF: account stat numbers ── */
    [style*="font-size:1.6rem;font-weight:800"] {
        font-size: 1.2rem !important;
    }

    /* ── SECTION HEADINGS ── */
    .section h2,
    .section-dark h2 {
        font-size: clamp(1.35rem, 5.5vw, 1.8rem) !important;
        line-height: 1.18 !important;
    }
    .section h3,
    .section-dark h3 {
        font-size: clamp(1.05rem, 4vw, 1.35rem) !important;
    }
    .section p,
    .section-dark p {
        font-size: clamp(0.85rem, 3.3vw, 0.95rem) !important;
        line-height: 1.70 !important;
    }

    /* ── TRADING MODES ── */
    .mode-icon { font-size: 1.8rem !important; }
    .mode-card h3 { font-size: 1.1rem !important; }
    .mode-returns { font-size: 1.75rem !important; }
    .mode-returns-label { font-size: 0.80rem !important; }
    .mode-features li { font-size: 0.84rem !important; }
    .mode-badge { font-size: 0.65rem !important; }

    /* ── FEATURES GRID ── */
    .feature-icon { font-size: 1.8rem !important; }
    .feature-title { font-size: 1.02rem !important; }
    .feature-description { font-size: 0.84rem !important; line-height: 1.65 !important; }

    /* ── STEPS (3 step cards) ── */
    [style*="margin-top:var(--spacing-md);font-size:1.25rem;color:var(--color-accent)"] {
        font-size: 1.05rem !important;
    }

    /* ── COMMUNITY CARDS ── */
    [style*="font-size:2.8rem;margin-bottom:var(--spacing-sm)"] {
        font-size: 2rem !important;
    }
    [style*="display:inline-block;padding:9px 18px"] {
        font-size: 0.75rem !important;
        padding: 8px 12px !important;
    }

    /* ── FAQ ── */
    .faq-question {
        font-size: 0.88rem !important;
        padding: 14px 12px !important;
    }
    .faq-answer-content {
        font-size: 0.85rem !important;
    }

    /* ── PRICING ── */
    .pricing-plan-name {
        font-size: 0.74rem !important;
        line-height: 1.45 !important;
    }
    .pricing-price {
        font-size: 2.5rem !important;
    }
    .pricing-period { font-size: 0.80rem !important; }
    .pricing-badge { font-size: 0.65rem !important; }
    .pricing-features li { font-size: 0.84rem !important; }
    .pricing-button { font-size: 0.86rem !important; }
    .package-item { font-size: 0.80rem !important; }
    .what-you-get-section h2 { font-size: clamp(1.2rem, 4.5vw, 1.6rem) !important; }

    /* ── FINAL CTA — handled by inline <style> in index.php ── */
    .gfs-tb-content {
        font-size: 0.60rem !important;
        white-space: nowrap !important;
    }

    /* ── VERIFICATION BADGES ── */
    .verification-badge {
        font-size: 0.80rem !important;
        padding: 7px 12px !important;
        white-space: nowrap !important;
    }
}

/* ──────────────────────────────────────────────────────────────
   PHONES — ≤480px
   ────────────────────────────────────────────────────────────── */
@media (max-width: 480px) {

    .hero-title {
        font-size: clamp(1.5rem, 6.5vw, 1.9rem) !important;
    }
    .hero-subtitle {
        font-size: 0.84rem !important;
    }
    .hero-badge {
        font-size: 0.70rem !important;
    }
    .hero-cta-group .btn {
        font-size: 0.82rem !important;
        padding: 12px 14px !important;
    }

    .gfs-brand-logo-text {
        font-size: 1.6rem !important;
    }
    .gfs-brand-card-top {
        padding: 20px 16px 14px !important;
    }
    .gfs-brand-check-col,
    .gfs-brand-stat-col {
        padding: 14px 13px !important;
        gap: 12px !important;
    }
    .gfs-brand-check-col .gfs-brand-check-item,
    .gfs-brand-stat-col .gfs-brand-check-item {
        font-size: 0.82rem !important;
        gap: 8px !important;
    }
    .gfs-bstat-value { font-size: 0.82rem !important; }
    .gfs-bstat-label { font-size: 0.50rem !important; }

    .section h2,
    .section-dark h2 {
        font-size: clamp(1.2rem, 5.5vw, 1.6rem) !important;
    }
    .mode-returns { font-size: 1.55rem !important; }
    .pricing-price { font-size: 2.1rem !important; }
    .calculator-result-value { font-size: 1.85rem !important; }

    /* What you get: single col on small phones */
    .what-you-get-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ──────────────────────────────────────────────────────────────
   SMALLEST PHONES — ≤390px
   ────────────────────────────────────────────────────────────── */
@media (max-width: 390px) {

    .hero-title {
        font-size: 1.45rem !important;
        letter-spacing: -0.02em !important;
    }
    .hero-badge {
        font-size: 0.66rem !important;
        padding: 4px 10px !important;
    }
    .hero-subtitle {
        font-size: 0.80rem !important;
        line-height: 1.65 !important;
    }
    .hero-cta-group .btn {
        font-size: 0.78rem !important;
        padding: 11px 12px !important;
    }
    .gfs-hero-trust-bar span {
        font-size: 0.72rem !important;
    }

    .gfs-brand-logo-text {
        font-size: 1.4rem !important;
    }
    .gfs-brand-card-sub {
        font-size: 0.52rem !important;
        letter-spacing: 2px !important;
    }
    .gfs-brand-card-top {
        padding: 16px 14px 12px !important;
    }
    .gfs-brand-check-col,
    .gfs-brand-stat-col {
        padding: 12px !important;
        gap: 10px !important;
    }
    .gfs-brand-check-col .gfs-brand-check-item,
    .gfs-brand-stat-col .gfs-brand-check-item {
        font-size: 0.78rem !important;
        gap: 7px !important;
    }
    .gfs-check-icon {
        width: 20px !important;
        height: 20px !important;
        font-size: 0.62rem !important;
    }
    .gfs-bstat-value { font-size: 0.75rem !important; }
    .gfs-bstat-label { font-size: 0.46rem !important; }
    .gfs-brand-stat-box { padding: 9px 4px !important; }

    .gfs-myfxbook-logo { font-size: 1.3rem !important; }
    .gfs-brand-card-bottom {
        font-size: 0.50rem !important;
        letter-spacing: 1.8px !important;
        padding: 10px !important;
    }

    .gfs-tg-slide-item {
        font-size: 0.70rem !important;
        padding: 5px 10px 5px 9px !important;
        gap: 6px !important;
    }
    .gfs-tg-slide-icon {
        width: 12px !important;
        height: 12px !important;
    }
    .gfs-tg-slide-badge {
        font-size: 0.48rem !important;
        padding: 2px 5px !important;
    }

    .section h2,
    .section-dark h2 {
        font-size: 1.18rem !important;
    }
    h3,
    .section h3,
    .section-dark h3 {
        font-size: 1.00rem !important;
    }

    .faq-question { font-size: 0.82rem !important; }
    .mode-returns { font-size: 1.40rem !important; }
    .pricing-price { font-size: 1.85rem !important; }
    .pricing-plan-name { font-size: 0.68rem !important; }
    .pricing-features li { font-size: 0.78rem !important; }
    .verification-badge { font-size: 0.72rem !important; padding: 6px 9px !important; }
    .feature-title { font-size: 0.95rem !important; }
    .feature-description { font-size: 0.80rem !important; }
    .calculator-result-value { font-size: 1.65rem !important; }
}



/* ═══════════════════════════════════════════════════════════════
   FINAL CTA LINKS — Individual Color Fix
   Overrides global  a { color: var(--vip-gold-bright) !important }
   ═══════════════════════════════════════════════════════════════ */

a.gfs-cta-link-tg,
a.gfs-cta-link-tg:link,
a.gfs-cta-link-tg:visited {
    color: #9CA3AF !important;
    -webkit-text-fill-color: #9CA3AF !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}
a.gfs-cta-link-tg:hover { color: #CBD5E1 !important; -webkit-text-fill-color: #CBD5E1 !important; }

a.gfs-cta-link-lr,
a.gfs-cta-link-lr:link,
a.gfs-cta-link-lr:visited {
    color: #4ADE80 !important;
    -webkit-text-fill-color: #4ADE80 !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}
a.gfs-cta-link-lr:hover { color: #86EFAC !important; -webkit-text-fill-color: #86EFAC !important; }

a.gfs-cta-link-yt,
a.gfs-cta-link-yt:link,
a.gfs-cta-link-yt:visited {
    color: #EF4444 !important;
    -webkit-text-fill-color: #EF4444 !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}
a.gfs-cta-link-yt:hover { color: #FCA5A5 !important; -webkit-text-fill-color: #FCA5A5 !important; }

a.gfs-cta-link-fb,
a.gfs-cta-link-fb:link,
a.gfs-cta-link-fb:visited {
    color: #60A5FA !important;
    -webkit-text-fill-color: #60A5FA !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}
a.gfs-cta-link-fb:hover { color: #93C5FD !important; -webkit-text-fill-color: #93C5FD !important; }



/* ═══════════════════════════════════════════════════════════════
   FOOTER LINKS — Bright White Color Fix
   Overrides global gold anchor color
   ═══════════════════════════════════════════════════════════════ */

a.gfs-footer-link,
a.gfs-footer-link:link,
a.gfs-footer-link:visited {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

a.gfs-footer-link:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-decoration: underline !important;
}



/* ═══════════════════════════════════════════════════════════════
   FINAL CTA LINKS — 4 Individual Colors (v2 stronger override)
   ═══════════════════════════════════════════════════════════════ */

.gfs-final-cta-links a.gfs-cta-link-tg,
a.gfs-cta-link-tg, a.gfs-cta-link-tg:link, a.gfs-cta-link-tg:visited,
body a.gfs-cta-link-tg {
    color: #9CA3AF !important;
    -webkit-text-fill-color: #9CA3AF !important;
}
.gfs-final-cta-links a.gfs-cta-link-tg:hover,
a.gfs-cta-link-tg:hover { color: #CBD5E1 !important; -webkit-text-fill-color: #CBD5E1 !important; }

.gfs-final-cta-links a.gfs-cta-link-lr,
a.gfs-cta-link-lr, a.gfs-cta-link-lr:link, a.gfs-cta-link-lr:visited,
body a.gfs-cta-link-lr {
    color: #4ADE80 !important;
    -webkit-text-fill-color: #4ADE80 !important;
}
.gfs-final-cta-links a.gfs-cta-link-lr:hover,
a.gfs-cta-link-lr:hover { color: #86EFAC !important; -webkit-text-fill-color: #86EFAC !important; }

.gfs-final-cta-links a.gfs-cta-link-yt,
a.gfs-cta-link-yt, a.gfs-cta-link-yt:link, a.gfs-cta-link-yt:visited,
body a.gfs-cta-link-yt {
    color: #EF4444 !important;
    -webkit-text-fill-color: #EF4444 !important;
}
.gfs-final-cta-links a.gfs-cta-link-yt:hover,
a.gfs-cta-link-yt:hover { color: #FCA5A5 !important; -webkit-text-fill-color: #FCA5A5 !important; }

.gfs-final-cta-links a.gfs-cta-link-fb,
a.gfs-cta-link-fb, a.gfs-cta-link-fb:link, a.gfs-cta-link-fb:visited,
body a.gfs-cta-link-fb {
    color: #60A5FA !important;
    -webkit-text-fill-color: #60A5FA !important;
}
.gfs-final-cta-links a.gfs-cta-link-fb:hover,
a.gfs-cta-link-fb:hover { color: #93C5FD !important; -webkit-text-fill-color: #93C5FD !important; }


/* ═══════════════════════════════════════════════════════════════
   FOOTER LINKS — Bright White (v2 stronger override)
   ═══════════════════════════════════════════════════════════════ */

.site-footer a.gfs-footer-link,
footer a.gfs-footer-link,
a.gfs-footer-link, a.gfs-footer-link:link, a.gfs-footer-link:visited,
body a.gfs-footer-link {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
    text-decoration: none !important;
}
.site-footer a.gfs-footer-link:hover,
a.gfs-footer-link:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-decoration: underline !important;
}


/* ═══════════════════════════════════════════════════════════════
   TOP EA 2026 BADGE — Mint Green Border
   ═══════════════════════════════════════════════════════════════ */

.gfs-mockup-badge {
    border: 2px solid #4ADE80 !important;
    box-shadow: 0 4px 16px rgba(74,222,128,0.4), 0 0 0 0 transparent !important;
}



/* ═══════════════════════════════════════════════════════════════
   HERO — LEFT ALIGN FIX (Mobile + Desktop)
   Overrides all previous center-align rules for hero text
   ═══════════════════════════════════════════════════════════════ */

.hero-title,
.hero-subtitle,
.hero-badge,
.gfs-hero-left .hero-title,
.gfs-hero-left .hero-subtitle,
.gfs-hero-left .hero-badge {
    text-align: left !important;
}

.gfs-hero-left,
.hero-content,
.gfs-hero-left .hero-content {
    text-align: left !important;
    align-items: flex-start !important;
}

@media (max-width: 960px) {
    .hero-title,
    .hero-subtitle,
    .hero-badge,
    .gfs-hero-left .hero-title,
    .gfs-hero-left .hero-subtitle,
    .gfs-hero-left .hero-badge {
        text-align: left !important;
    }
    .gfs-hero-left,
    .hero-content {
        text-align: left !important;
        align-items: flex-start !important;
    }
}

@media (max-width: 768px) {
    .hero-title,
    .hero-subtitle,
    .hero-badge,
    .gfs-hero-left .hero-title,
    .gfs-hero-left .hero-subtitle,
    .gfs-hero-left .hero-badge {
        text-align: left !important;
    }
    .hero-content,
    .gfs-hero-left {
        text-align: left !important;
        align-items: flex-start !important;
    }
    .hero-cta-group {
        align-items: stretch !important;
    }
}

@media (max-width: 480px) {
    .hero-title,
    .hero-subtitle,
    .hero-badge {
        text-align: left !important;
    }
    .hero-content,
    .gfs-hero-left {
        text-align: left !important;
        align-items: flex-start !important;
    }
}

@media (max-width: 390px) {
    .hero-title,
    .hero-subtitle,
    .hero-badge {
        text-align: left !important;
    }
    .hero-content,
    .gfs-hero-left {
        text-align: left !important;
        align-items: flex-start !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   TOP EA 2026 BADGE — Mint Green BG + Border, Text/Star same color
   ═══════════════════════════════════════════════════════════════ */

.gfs-mockup-badge,
div.gfs-mockup-badge {
    background: #4ADE80 !important;
    background-image: none !important;
    border: 2px solid #4ADE80 !important;
    color: #022c1a !important;
    -webkit-text-fill-color: #022c1a !important;
    box-shadow: 0 4px 20px rgba(74,222,128,0.5) !important;
}


/* ═══════════════════════════════════════════════════════════════
   FINAL CTA LINKS — 4 Colors (strongest override)
   ═══════════════════════════════════════════════════════════════ */

html body a.gfs-cta-link-tg,
html body a.gfs-cta-link-tg:link,
html body a.gfs-cta-link-tg:visited {
    color: #9CA3AF !important;
    -webkit-text-fill-color: #9CA3AF !important;
    text-decoration: none !important;
}
html body a.gfs-cta-link-tg:hover {
    color: #CBD5E1 !important;
    -webkit-text-fill-color: #CBD5E1 !important;
}

html body a.gfs-cta-link-lr,
html body a.gfs-cta-link-lr:link,
html body a.gfs-cta-link-lr:visited {
    color: #4ADE80 !important;
    -webkit-text-fill-color: #4ADE80 !important;
    text-decoration: none !important;
}
html body a.gfs-cta-link-lr:hover {
    color: #86EFAC !important;
    -webkit-text-fill-color: #86EFAC !important;
}

html body a.gfs-cta-link-yt,
html body a.gfs-cta-link-yt:link,
html body a.gfs-cta-link-yt:visited {
    color: #EF4444 !important;
    -webkit-text-fill-color: #EF4444 !important;
    text-decoration: none !important;
}
html body a.gfs-cta-link-yt:hover {
    color: #FCA5A5 !important;
    -webkit-text-fill-color: #FCA5A5 !important;
}

html body a.gfs-cta-link-fb,
html body a.gfs-cta-link-fb:link,
html body a.gfs-cta-link-fb:visited {
    color: #60A5FA !important;
    -webkit-text-fill-color: #60A5FA !important;
    text-decoration: none !important;
}
html body a.gfs-cta-link-fb:hover {
    color: #93C5FD !important;
    -webkit-text-fill-color: #93C5FD !important;
}


/* ═══════════════════════════════════════════════════════════════
   FOOTER LINKS — Bright White (strongest override)
   ═══════════════════════════════════════════════════════════════ */

html body a.gfs-footer-link,
html body a.gfs-footer-link:link,
html body a.gfs-footer-link:visited {
    color: #E2E8F0 !important;
    -webkit-text-fill-color: #E2E8F0 !important;
    text-decoration: none !important;
}
html body a.gfs-footer-link:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-decoration: underline !important;
}


/* ═══════════════════════════════════════════════════════════════
   BRAND CHECKLIST — Final Override (2-column, Desktop + Mobile)
   ═══════════════════════════════════════════════════════════════ */
.gfs-brand-checklist {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    flex-direction: unset !important;
    gap: 0 !important;
    padding: 0 !important;
}

.gfs-brand-check-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    padding: 26px 20px 26px 28px !important;
    border-right: 1px solid rgba(255,200,87,0.10) !important;
}

.gfs-brand-stat-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    padding: 26px 24px 26px 20px !important;
    justify-content: center !important;
}

.gfs-brand-check-col .gfs-brand-check-item,
.gfs-brand-stat-col .gfs-brand-check-item {
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #E2E8F0 !important;
    gap: 14px !important;
    line-height: 1.35 !important;
}

.gfs-brand-check-col .gfs-check-icon,
.gfs-brand-stat-col .gfs-check-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 0.85rem !important;
    flex-shrink: 0 !important;
}

/* Mobile — keep 2-column on phone */
@media (max-width: 600px) {
    .gfs-brand-checklist {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        flex-direction: unset !important;
    }
    .gfs-brand-check-col {
        padding: 18px 10px 18px 16px !important;
        border-right: 1px solid rgba(255,200,87,0.10) !important;
        border-bottom: none !important;
        gap: 14px !important;
    }
    .gfs-brand-stat-col {
        padding: 18px 12px 18px 10px !important;
        gap: 14px !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }
    .gfs-brand-check-col .gfs-brand-check-item,
    .gfs-brand-stat-col .gfs-brand-check-item {
        font-size: 0.78rem !important;
        gap: 8px !important;
    }
    .gfs-brand-check-col .gfs-check-icon,
    .gfs-brand-stat-col .gfs-check-icon {
        width: 22px !important;
        height: 22px !important;
        font-size: 0.72rem !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   HOME PAGE — Full Mobile Optimisation (All Sections)
   Targets: All phones ≤480px | Small phones ≤390px
   Desktop untouched — mobile only via media queries.
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 480px) {

    /* ── Overflow prevention ─────────────────────────────────── */
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
    }

    /* ── Hero Section ────────────────────────────────────────── */
    .hero-section {
        padding-top: 72px !important;
        padding-bottom: 32px !important;
        min-height: unset !important;
    }
    .gfs-hero-split {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding: 0 !important;
    }
    .gfs-hero-left {
        text-align: center !important;
        padding: 0 4px !important;
    }
    .hero-badge {
        font-size: 0.72rem !important;
        padding: 5px 12px !important;
        letter-spacing: 0.8px !important;
    }
    .hero-title {
        font-size: clamp(1.9rem, 8.5vw, 2.4rem) !important;
        line-height: 1.15 !important;
        margin-bottom: 12px !important;
    }
    .hero-subtitle {
        font-size: 0.92rem !important;
        line-height: 1.55 !important;
        margin-bottom: 18px !important;
    }
    .hero-cta-group {
        flex-direction: column !important;
        gap: 10px !important;
        align-items: stretch !important;
    }
    .hero-cta-group .btn {
        width: 100% !important;
        text-align: center !important;
        font-size: 0.88rem !important;
        padding: 13px 18px !important;
    }
    .gfs-hero-trust-bar {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 8px !important;
        font-size: 0.72rem !important;
        margin-top: 16px !important;
    }

    /* ── Brand Card (GFS card) ───────────────────────────────── */
    .gfs-hero-right {
        display: flex !important;
        justify-content: center !important;
        padding: 0 !important;
    }
    .gfs-brand-card {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 14px !important;
    }
    .gfs-brand-card-top {
        padding: 20px 18px 14px !important;
    }
    .gfs-brand-logo-text {
        font-size: 1.4rem !important;
        line-height: 1.2 !important;
    }
    .gfs-brand-card-sub {
        font-size: 0.6rem !important;
        letter-spacing: 2px !important;
        margin-top: 4px !important;
    }

    /* ── Stats Row (Rating/Feedback/Orders/Members) ──────────── */
    .gfs-brand-stats-row {
        grid-template-columns: 1fr 1fr !important;
        gap: 1px !important;
        padding: 0 !important;
    }
    .gfs-brand-stat-box {
        padding: 12px 8px !important;
    }
    .gfs-bstat-value {
        font-size: 1.05rem !important;
    }
    .gfs-bstat-label {
        font-size: 0.6rem !important;
        letter-spacing: 1px !important;
    }

    /* ── MyFXBook + Socials ──────────────────────────────────── */
    .gfs-brand-bottom-row {
        flex-direction: column !important;
        gap: 12px !important;
        padding: 14px 16px !important;
    }
    .gfs-myfxbook-badge {
        margin: 12px 16px !important;
        padding: 12px 16px !important;
    }
    .gfs-myfxbook-logo {
        font-size: 1.3rem !important;
    }
    .gfs-brand-socials {
        gap: 8px !important;
    }
    .gfs-social-label {
        font-size: 0.6rem !important;
        letter-spacing: 2px !important;
    }
    .gfs-social-icons {
        gap: 8px !important;
    }
    .gfs-social-icon {
        width: 34px !important;
        height: 34px !important;
    }
    .gfs-brand-card-bottom {
        font-size: 0.65rem !important;
        padding: 10px !important;
        letter-spacing: 2px !important;
    }

    /* ── Telegram Slider Banner ──────────────────────────────── */
    .gfs-tg-slider-banner {
        padding: 10px 0 !important;
    }
    .gfs-tg-slide-item {
        font-size: 0.8rem !important;
        padding: 8px 16px !important;
        gap: 6px !important;
    }
    .gfs-tg-slide-icon {
        width: 18px !important;
        height: 18px !important;
    }

    /* ── Section headings ────────────────────────────────────── */
    .section {
        padding: 48px 0 !important;
    }
    h2 {
        font-size: clamp(1.45rem, 7vw, 1.9rem) !important;
        line-height: 1.2 !important;
        margin-bottom: 10px !important;
    }
    h3 {
        font-size: clamp(1.1rem, 5.5vw, 1.4rem) !important;
    }
    .section-header {
        margin-bottom: 28px !important;
    }
    .section-header p {
        font-size: 0.9rem !important;
        line-height: 1.55 !important;
    }

    /* ── Live Results Section ────────────────────────────────── */
    .gfs-results-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    /* ── Features Grid ───────────────────────────────────────── */
    .features-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .feature-card {
        padding: 18px 16px !important;
    }
    .feature-icon {
        font-size: 1.6rem !important;
        margin-bottom: 8px !important;
    }
    .feature-card h3 {
        font-size: 1rem !important;
    }
    .feature-card p {
        font-size: 0.85rem !important;
    }

    /* ── Trading Modes ───────────────────────────────────────── */
    .trading-modes {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .mode-card {
        padding: 18px 16px !important;
    }
    .mode-returns {
        font-size: 1.7rem !important;
    }
    .mode-label {
        font-size: 0.75rem !important;
    }

    /* ── Pricing Cards ───────────────────────────────────────── */
    .pricing-cards {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .pricing-card {
        padding: 18px 14px !important;
    }
    .pricing-features {
        grid-template-columns: 1fr !important;
    }
    .pricing-price {
        font-size: 2.2rem !important;
    }
    .pricing-period {
        font-size: 0.8rem !important;
    }

    /* ── FAQ ─────────────────────────────────────────────────── */
    .faq-item {
        padding: 0 !important;
    }
    .faq-question {
        font-size: 0.9rem !important;
        padding: 16px !important;
    }
    .faq-answer {
        font-size: 0.85rem !important;
        padding: 0 16px 16px !important;
        line-height: 1.6 !important;
    }

    /* ── Calculator ──────────────────────────────────────────── */
    .calculator-section {
        padding: 20px 16px !important;
    }
    .calculator-result-value {
        font-size: 2rem !important;
    }
    .calculator-label {
        font-size: 0.78rem !important;
    }

    /* ── CTA Section — handled by inline <style> in index.php ── */

    /* ── Footer ──────────────────────────────────────────────── */
    .footer-content {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        text-align: center !important;
    }
    .footer-links {
        flex-direction: column !important;
        align-items: center !important;
        gap: 10px !important;
    }
    .footer-bottom {
        font-size: 0.75rem !important;
        text-align: center !important;
    }
}

/* ── Extra small phones ≤390px ──────────────────────────────── */
@media (max-width: 390px) {

    .hero-title {
        font-size: clamp(1.7rem, 8vw, 2rem) !important;
    }
    .hero-subtitle {
        font-size: 0.85rem !important;
    }
    .gfs-brand-logo-text {
        font-size: 1.25rem !important;
    }
    .gfs-brand-check-col .gfs-brand-check-item,
    .gfs-brand-stat-col .gfs-brand-check-item {
        font-size: 0.72rem !important;
    }
    .gfs-brand-check-col .gfs-check-icon,
    .gfs-brand-stat-col .gfs-check-icon {
        width: 20px !important;
        height: 20px !important;
        font-size: 0.65rem !important;
    }
    h2 {
        font-size: clamp(1.3rem, 7vw, 1.6rem) !important;
    }
    .btn {
        font-size: 0.82rem !important;
        padding: 11px 14px !important;
    }
    .pricing-price {
        font-size: 1.9rem !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   CHROME DESKTOP SITE MODE — Mobile Optimization v26
   Targets Chrome "Request Desktop Site" on mobile phones/tablets.
   Desktop PC layout is NOT modified — rules only apply at
   viewport widths that appear in Desktop Site mode on mobile.
   ═══════════════════════════════════════════════════════════════ */

/* ── Preserve 2-column hero down to 769px ──────────────────────
   Chrome Desktop Site typically renders at 980px-1280px.
   Keeping 2-col until 768px ensures Desktop Site shows the full
   side-by-side layout instead of collapsing to single column.      */
@media (min-width: 769px) and (max-width: 960px) {
    .gfs-hero-split {
        display: grid !important;
        grid-template-columns: 55fr 45fr !important;
        gap: 24px !important;
        align-items: center !important;
        min-height: auto !important;
        padding: 32px 0 40px !important;
    }

    .gfs-hero-right {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
    }

    .gfs-brand-card {
        max-width: 100% !important;
        margin: 0 !important;
    }

    /* Slightly scale down brand card text for tight widths */
    .gfs-brand-logo-text {
        font-size: clamp(1.5rem, 2.2vw, 2rem) !important;
    }

    .gfs-brand-card-top   { padding: 28px 24px 22px !important; }
    .gfs-brand-checklist  { padding: 20px 24px !important; gap: 12px !important; }
    .gfs-brand-check-item { font-size: 0.9rem !important; }
    .gfs-myfxbook-badge   { margin: 14px 24px !important; }
    .gfs-myfxbook-logo    { font-size: 1.6rem !important; }
}

/* ── Reduce excessive hero blank space in Desktop Site mode ─────
   100vh on a mobile in Desktop Site mode = full physical height,
   creating a large empty area. Cap it to content + comfortable
   padding instead.                                                 */
@media (min-width: 769px) and (max-width: 1100px) {
    .hero-section {
        min-height: calc(100vh - 60px) !important;
        padding-top: 90px !important;
    }

    /* Reduce hero title size slightly so it fits without wrapping */
    .hero-title {
        font-size: clamp(1.9rem, 3.4vw, 2.8rem) !important;
        line-height: 1.2 !important;
    }

    .hero-subtitle {
        font-size: clamp(0.88rem, 1.4vw, 1rem) !important;
        line-height: 1.6 !important;
    }

    /* Trust bar: keep horizontal in this range */
    .gfs-hero-trust-bar {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px 16px !important;
    }

    .gfs-hero-trust-bar span {
        font-size: 0.78rem !important;
    }

    /* CTA buttons: keep side by side */
    .hero-cta-group {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
    }

    .hero-cta-group .btn {
        padding: 13px 20px !important;
        font-size: 0.9rem !important;
    }
}

/* ── Container padding for mid-range Desktop Site widths ─────── */
@media (min-width: 769px) and (max-width: 960px) {
    .container,
    .container-wide {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

/* ── Navigation: ensure desktop nav shows (not hamburger) ───────
   Some mobile browsers in Desktop Site mode still trigger the
   mobile hamburger. This forces the desktop nav visible.          */
@media (min-width: 769px) {
    .mobile-menu-toggle { display: none !important; }
    .main-nav           { display: flex !important; }
}

/* ── Touch-device: restore card hover lift in desktop-site mode ─
   When pointer is coarse (touch) but viewport is wide (desktop
   site), re-enable subtle hover transforms for visual quality.    */
@media (hover: none) and (pointer: coarse) and (min-width: 769px) {
    .mode-card:hover,
    .feature-card:hover,
    .pricing-card:hover {
        transform: translateY(-4px) !important;
        box-shadow: 0 12px 40px rgba(0,0,0,0.4) !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   HERO TITLE — Mobile Size Increase v27
   Makes the main heading larger on mobile screens only.
   Desktop layout untouched.
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
    .hero-title {
        font-size: clamp(2.2rem, 9vw, 3rem) !important;
        line-height: 1.15 !important;
        letter-spacing: -0.03em !important;
    }
}

@media (max-width: 390px) {
    .hero-title {
        font-size: clamp(2rem, 8.5vw, 2.6rem) !important;
        line-height: 1.15 !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   HERO TITLE ONLY — Further Mobile Size Boost v28
   Only .hero-title enlarged — nothing else changed.
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
    .hero-title {
        font-size: clamp(2.7rem, 11vw, 3.6rem) !important;
        line-height: 1.12 !important;
        letter-spacing: -0.04em !important;
    }
}

@media (max-width: 390px) {
    .hero-title {
        font-size: clamp(2.4rem, 10.5vw, 3rem) !important;
        line-height: 1.12 !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   HERO TITLE — Maximum Impact Size v29
   Match large bold headline style (like DowGold reference)
   Mobile only — desktop untouched.
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
    .hero-title {
        font-size: clamp(3.2rem, 13vw, 4.2rem) !important;
        line-height: 1.05 !important;
        letter-spacing: -0.05em !important;
        font-weight: 900 !important;
    }
}

@media (max-width: 390px) {
    .hero-title {
        font-size: clamp(2.9rem, 12vw, 3.6rem) !important;
        line-height: 1.05 !important;
        letter-spacing: -0.05em !important;
        font-weight: 900 !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   HERO TITLE — Maximum Impact Size ALL SCREENS v30
   Match large bold headline style across desktop + mobile.
   ═══════════════════════════════════════════════════════════════ */

.hero-title {
    font-size: clamp(3.2rem, 6.5vw, 5.5rem) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.05em !important;
}

@media (max-width: 768px) {
    .hero-title {
        font-size: clamp(3.2rem, 13vw, 4.2rem) !important;
        line-height: 1.05 !important;
        letter-spacing: -0.05em !important;
        font-weight: 900 !important;
    }
}

@media (max-width: 390px) {
    .hero-title {
        font-size: clamp(2.9rem, 12vw, 3.6rem) !important;
        line-height: 1.05 !important;
        letter-spacing: -0.05em !important;
        font-weight: 900 !important;
    }
}


/* ═══════════════════════════════════════════════════════════════
   HERO TITLE — Desktop Size Fine-tune v31
   Slightly reduce title size on desktop only. Mobile untouched.
   ═══════════════════════════════════════════════════════════════ */

@media (min-width: 769px) {
    .hero-title {
        font-size: clamp(2.6rem, 4.8vw, 4rem) !important;
    }
}