/*
Theme Name: Top5Mindset
Theme URI: https://top5mindset.com
Description: Professional trading signals & prop firm education
Version: 3.5.0
Author: Top5Mindset
Text Domain: top5mindset

Design System v3.2 - Dark Theme + Brand Blue
*/

/* ==========================================================================
   1. DESIGN TOKENS
   ========================================================================== */

:root {
    /* ===== BRAND COLORS ===== */

    /* Primary - Brand Blue */
    --t5-primary: #0057CC;
    --t5-primary-dark: #004099;
    --t5-primary-light: #3378D9;
    --t5-primary-glow: rgba(0, 87, 204, 0.15);

    /* Dark Theme Backgrounds */
    --t5-bg-dark: #0B1020;
    --t5-bg-card: #101827;
    --t5-bg-elevated: #1a2332;
    --t5-bg-input: #1c2534;
    --t5-border: #2d3748;
    --t5-border-light: rgba(255, 255, 255, 0.1);

    /* Text */
    --t5-text-primary: #FFFFFF;
    --t5-text-secondary: #AAB4BD;
    --t5-text-muted: #6B7280;

    /* Trading Colors */
    --t5-green: #1FDA9A;
    --t5-green-light: #4AEDB5;
    --t5-green-dark: #17C584;
    --t5-green-glow: rgba(31, 218, 154, 0.12);

    --t5-red: #FF4B4B;
    --t5-red-light: #FF6B6B;
    --t5-red-glow: rgba(255, 75, 75, 0.12);

    --t5-warning: #FFD700;

    /* Candle Colors */
    --t5-candle-green: #1FDA9A;
    --t5-candle-red: #FF4B4B;

    /* ===== SPACING ===== */
    --t5-space-1: 0.25rem;
    --t5-space-2: 0.5rem;
    --t5-space-3: 0.75rem;
    --t5-space-4: 1rem;
    --t5-space-5: 1.25rem;
    --t5-space-6: 1.5rem;
    --t5-space-8: 2rem;
    --t5-space-10: 2.5rem;
    --t5-space-12: 3rem;
    --t5-space-16: 4rem;
    --t5-space-20: 5rem;
    --t5-space-24: 6rem;

    /* ===== TYPOGRAPHY ===== */
    --t5-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --t5-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

    --t5-text-xs: 0.75rem;
    --t5-text-sm: 0.875rem;
    --t5-text-base: 1rem;
    --t5-text-lg: 1.125rem;
    --t5-text-xl: 1.25rem;
    --t5-text-2xl: 1.5rem;
    --t5-text-3xl: 2rem;
    --t5-text-4xl: 2.5rem;
    --t5-text-5xl: 3.5rem;

    /* ===== EFFECTS ===== */
    --t5-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    --t5-shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.6);
    --t5-shadow-primary: 0 4px 20px var(--t5-primary-glow);
    --t5-shadow-green: 0 4px 20px var(--t5-green-glow);
    --t5-glow-primary: 0 0 15px var(--t5-primary-glow);

    --t5-radius: 0.5rem;
    --t5-radius-lg: 1rem;
    --t5-radius-xl: 1.5rem;
    --t5-radius-full: 9999px;

    --t5-transition: all 0.3s ease;
    --t5-transition-fast: all 0.15s ease;
}

/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: var(--t5-font);
    font-size: var(--t5-text-base);
    line-height: 1.6;
    color: var(--t5-text-primary);
    background-color: var(--t5-bg-dark);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

::selection {
    background: var(--t5-primary);
    color: white;
}

img {
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   3. TYPOGRAPHY
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.2;
    color: var(--t5-text-primary);
}

h1 { font-size: clamp(2.5rem, 6vw, 4rem); }
h2 { font-size: clamp(2rem, 4vw, 3rem); }
h3 { font-size: var(--t5-text-xl); }

p {
    color: var(--t5-text-secondary);
    margin-bottom: var(--t5-space-4);
}

a {
    color: var(--t5-primary-light);
    text-decoration: none;
    transition: var(--t5-transition-fast);
}

a:hover {
    color: var(--t5-primary);
}

.t5-text-gradient {
    background: linear-gradient(135deg, var(--t5-primary) 0%, var(--t5-primary-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.t5-text-green {
    color: var(--t5-green);
}

.t5-mono {
    font-family: var(--t5-font-mono);
}

/* ==========================================================================
   4. LAYOUT
   ========================================================================== */

.t5-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--t5-space-4);
}

@media (min-width: 768px) {
    .t5-container {
        padding: 0 var(--t5-space-6);
    }
}

.t5-section {
    padding: var(--t5-space-16) 0;
    position: relative;
}

@media (min-width: 768px) {
    .t5-section {
        padding: var(--t5-space-24) 0;
    }
}

.t5-section--alt {
    background: var(--t5-bg-card);
}

.t5-section-header {
    text-align: center;
    margin-bottom: var(--t5-space-12);
}

.t5-section-header p {
    max-width: 600px;
    margin: 0 auto;
}

/* ==========================================================================
   5. HEADER
   ========================================================================== */

.t5-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: var(--t5-space-4) 0;
    background: rgba(11, 16, 32, 0.8);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    transform: translateY(0);
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
                background 0.4s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1),
                backdrop-filter 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.t5-header--scrolled {
    background: rgba(11, 16, 32, 0.98);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
    border-bottom-color: transparent;
}

/* Hide header on scroll down - smooth slide up */
.t5-header--hidden {
    transform: translateY(-100%);
}

.t5-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--t5-space-4);
}

.t5-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    flex-shrink: 0;
}

.t5-logo img {
    height: 36px;
    width: auto;
}

.t5-logo__text {
    font-size: var(--t5-text-sm);
    font-weight: 700;
    color: var(--t5-text-primary);
    margin-left: var(--t5-space-2);
    letter-spacing: 0.02em;
    display: block;
}

@media (min-width: 640px) {
    .t5-logo img {
        height: 40px;
    }

    .t5-logo__text {
        font-size: var(--t5-text-lg);
        margin-left: var(--t5-space-3);
    }
}

@media (min-width: 768px) {
    .t5-logo img {
        height: 48px;
    }

    .t5-logo__text {
        font-size: var(--t5-text-xl);
    }
}

.t5-nav {
    display: none;
    align-items: center;
    gap: var(--t5-space-2);
}

@media (min-width: 768px) {
    .t5-nav {
        display: flex;
    }
}

.t5-nav__link {
    padding: var(--t5-space-2) var(--t5-space-4);
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    font-weight: 500;
    border-radius: var(--t5-radius);
    transition: var(--t5-transition-fast);
}

.t5-nav__link:hover {
    color: var(--t5-text-primary);
    background: var(--t5-bg-elevated);
}

.t5-nav__buttons {
    display: flex;
    align-items: center;
    gap: var(--t5-space-2);
    margin-left: var(--t5-space-2);
}

.t5-header__mobile-buttons {
    display: none; /* Hidden - login is in mobile menu */
}

@media (min-width: 768px) {
    .t5-header__mobile-buttons {
        display: none;
    }
}

.t5-menu-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: transparent;
    border: none;
    color: var(--t5-text-primary);
    cursor: pointer;
}

@media (min-width: 768px) {
    .t5-menu-toggle {
        display: none;
    }
}

.t5-nav--open {
    display: flex;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    bottom: 0;
    flex-direction: column;
    background: rgba(11, 16, 32, 0.98);
    backdrop-filter: blur(20px);
    padding: var(--t5-space-6);
    z-index: 999;
    overflow-y: auto;
}

.t5-nav--open .t5-nav__link {
    padding: var(--t5-space-4);
    font-size: var(--t5-text-lg);
    border-bottom: 1px solid var(--t5-border);
}

.t5-nav--open .t5-nav__buttons {
    flex-direction: column;
    margin-left: 0;
    margin-top: var(--t5-space-4);
    gap: var(--t5-space-3);
}

.t5-nav--open .t5-nav__buttons .t5-btn {
    width: 100%;
    justify-content: center;
}

body.t5-menu-open {
    overflow: hidden;
}

/* ==========================================================================
   6. BUTTONS
   ========================================================================== */

.t5-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--t5-space-2);
    padding: var(--t5-space-3) var(--t5-space-6);
    font-family: var(--t5-font);
    font-size: var(--t5-text-sm);
    font-weight: 600;
    text-decoration: none;
    border: 2px solid transparent;
    border-radius: var(--t5-radius);
    cursor: pointer;
    transition: var(--t5-transition);
}

.t5-btn--primary {
    background: var(--t5-primary);
    color: white;
    box-shadow: var(--t5-shadow-primary);
}

.t5-btn--primary:hover {
    background: var(--t5-primary-light);
    transform: translateY(-2px);
    box-shadow: var(--t5-glow-primary);
    color: white;
}

.t5-btn--success {
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    box-shadow: var(--t5-shadow-green);
}

.t5-btn--success:hover {
    background: var(--t5-green-light);
    transform: translateY(-2px);
    color: var(--t5-bg-dark);
}

.t5-btn--outline {
    background: transparent;
    color: var(--t5-text-primary);
    border: 1px solid var(--t5-border);
}

.t5-btn--outline:hover {
    background: var(--t5-bg-elevated);
    border-color: var(--t5-text-muted);
    color: var(--t5-text-primary);
}

.t5-btn--icon {
    width: 40px;
    height: 40px;
    padding: 0;
    background: var(--t5-bg-elevated);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius);
    color: var(--t5-text-secondary);
}

.t5-btn--icon:hover {
    background: var(--t5-bg-card);
    color: var(--t5-text-primary);
    border-color: var(--t5-primary);
}

.t5-btn--outline {
    background: transparent;
    color: var(--t5-text-primary);
    border-color: var(--t5-border);
}

.t5-btn--outline:hover {
    border-color: var(--t5-primary);
    color: var(--t5-primary-light);
}

.t5-btn--outline-light {
    background: transparent;
    color: var(--t5-text-primary);
    border-color: rgba(255,255,255,0.3);
}

.t5-btn--outline-light:hover {
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.5);
}

.t5-btn--lg {
    padding: var(--t5-space-4) var(--t5-space-8);
    font-size: var(--t5-text-base);
    border-radius: var(--t5-radius-lg);
}

.t5-btn svg {
    width: 20px;
    height: 20px;
}

/* ==========================================================================
   7. TAGS & BADGES
   ========================================================================== */

.t5-tag {
    display: inline-flex;
    align-items: center;
    gap: var(--t5-space-2);
    padding: var(--t5-space-2) var(--t5-space-4);
    background: rgba(0, 87, 204, 0.15);
    border: 1px solid rgba(0, 87, 204, 0.3);
    color: var(--t5-primary-light);
    font-size: var(--t5-text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border-radius: var(--t5-radius-full);
    margin-bottom: var(--t5-space-4);
}

.t5-badge--green {
    background: var(--t5-green);
    color: var(--t5-bg-dark);
}

.t5-badge--red {
    background: var(--t5-red);
    color: white;
}

/* ==========================================================================
   8. HERO SECTION
   ========================================================================== */

.t5-hero {
    position: relative;
    min-height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 120px 0 0;
    background: var(--t5-bg-dark);
    overflow: hidden;
}

@media (min-width: 768px) {
    .t5-hero {
        padding: 140px 0 0;
    }
}

@media (min-width: 1024px) {
    .t5-hero {
        padding: 160px 0 0;
    }
}

/* Candlestick Background */
.t5-hero__bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 2;
}

.t5-hero__candles {
    display: none !important;
}

.t5-candle {
    width: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.t5-candle__wick {
    width: 2px;
    background: currentColor;
}

.t5-candle__body {
    width: 100%;
    min-height: 20px;
    border-radius: 2px;
}

.t5-candle--green {
    color: var(--t5-candle-green);
}

.t5-candle--green .t5-candle__body {
    background: var(--t5-candle-green);
}

.t5-candle--red {
    color: var(--t5-candle-red);
}

.t5-candle--red .t5-candle__body {
    background: var(--t5-candle-red);
}

/* Chart Line */
.t5-hero__chart-line {
    position: absolute;
    bottom: 20%;
    left: 0;
    right: 0;
    height: 200px;
    opacity: 0.4;
}

.t5-hero__chart-line svg {
    width: 100%;
    height: 100%;
}

.t5-hero__chart-line path {
    fill: none;
    stroke: var(--t5-primary);
    stroke-width: 2;
    filter: drop-shadow(0 0 10px var(--t5-primary-glow));
}

.t5-hero__chart-area {
    fill: url(#chartGradient);
    opacity: 0.3;
}

/* Trading Background with Moving Averages */
.t5-hero__trading-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: 0.8;
}

.t5-hero__trading-bg svg {
    width: 100%;
    height: 100%;
}

/* Moving Average Lines */
.t5-hero__ma {
    transition: opacity 0.3s ease;
}

.t5-hero__ma--200 {
    animation: maFloat 12s ease-in-out infinite;
}

.t5-hero__ma--50 {
    animation: maFloat 10s ease-in-out infinite;
    animation-delay: -3s;
}

.t5-hero__ma--20 {
    animation: maFloat 8s ease-in-out infinite;
    animation-delay: -5s;
}

@keyframes maFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

/* Grid */
.t5-hero__grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(0, 87, 204, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 87, 204, 0.03) 1px, transparent 1px);
    background-size: 50px 50px;
    mask-image: radial-gradient(ellipse at center, black 0%, transparent 70%);
}

/* Subtle ambient light */
.t5-hero__glow {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    height: 400px;
    background: radial-gradient(ellipse, var(--t5-primary-glow) 0%, transparent 70%);
    filter: blur(60px);
    pointer-events: none;
    z-index: 3;
}

/* Hero Content */
.t5-hero__content {
    position: relative;
    z-index: 10;
    max-width: 700px;
    padding: var(--t5-space-6) 0 var(--t5-space-12);
}

@media (min-width: 768px) {
    .t5-hero__content {
        padding: var(--t5-space-8) 0 var(--t5-space-16);
    }
}

.t5-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: var(--t5-space-2);
    padding: var(--t5-space-2) var(--t5-space-4);
    background: rgba(31, 218, 154, 0.1);
    border: 1px solid rgba(31, 218, 154, 0.3);
    border-radius: var(--t5-radius-full);
    color: var(--t5-green);
    font-size: var(--t5-text-sm);
    font-weight: 500;
    margin-bottom: var(--t5-space-6);
}

.t5-hero__badge-dot {
    width: 8px;
    height: 8px;
    background: var(--t5-green);
    border-radius: 50%;
    animation: pulse 2s ease-in-out infinite;
    box-shadow: 0 0 10px var(--t5-green);
}

@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.3); }
}

.t5-hero h1 {
    margin-bottom: var(--t5-space-6);
    line-height: 1.1;
}

.t5-hero__subtitle {
    font-size: var(--t5-text-lg);
    color: var(--t5-text-secondary);
    margin-bottom: var(--t5-space-4);
    max-width: 550px;
}

.t5-hero__tagline {
    font-size: var(--t5-text-base);
    font-weight: 600;
    font-style: italic;
    color: var(--t5-primary-light);
    margin-bottom: var(--t5-space-8);
    letter-spacing: 0.02em;
}

.t5-hero__cta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-12);
}

/* Stats */
.t5-hero__stats {
    display: inline-flex;
    align-items: center;
    gap: var(--t5-space-3);
    margin-top: var(--t5-space-6);
    padding: var(--t5-space-3) var(--t5-space-5);
    background: rgba(255,255,255,0.05);
    border-radius: var(--t5-radius-full);
    border: 1px solid var(--t5-border);
}

.t5-hero__stat-separator {
    font-size: var(--t5-text-sm);
    opacity: 0.5;
}

.t5-hero__stat-value {
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-sm);
    font-weight: 600;
    color: var(--t5-text-primary);
    letter-spacing: 0.5px;
    font-weight: 700;
    color: var(--t5-primary-light);
    text-shadow: none;
}

.t5-hero__stat-label {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ==========================================================================
   9. TICKER - TradingView Widget
   ========================================================================== */

.t5-ticker-wrapper {
    background: rgba(16, 24, 39, 0.9);
    border-top: 1px solid var(--t5-border);
    border-bottom: 1px solid var(--t5-border);
    width: 100%;
    overflow: hidden;
    margin-top: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-ticker-wrapper {
        margin-top: var(--t5-space-8);
    }
}

.t5-ticker-wrapper .tradingview-widget-container {
    width: 100% !important;
}

.t5-ticker-wrapper .tradingview-widget-container__widget {
    width: 100% !important;
}

/* Hide TradingView copyright link for cleaner look */
.t5-ticker-wrapper .tradingview-widget-copyright {
    display: none !important;
}

/* Legacy ticker styles (keep for fallback) */
.t5-ticker {
    background: var(--t5-bg-card);
    border-top: 1px solid var(--t5-border);
    border-bottom: 1px solid var(--t5-border);
    padding: var(--t5-space-4) 0;
    overflow: hidden;
}

.t5-ticker__inner {
    display: flex;
    gap: var(--t5-space-8);
    animation: ticker 30s linear infinite;
}

@keyframes ticker {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.t5-ticker__item {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    white-space: nowrap;
}

.t5-ticker__symbol {
    font-weight: 700;
    color: var(--t5-text-primary);
}

.t5-ticker__price {
    font-family: var(--t5-font-mono);
    color: var(--t5-text-secondary);
}

.t5-ticker__change {
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-sm);
    font-weight: 600;
}

.t5-ticker__change--up {
    color: var(--t5-green);
}

.t5-ticker__change--down {
    color: var(--t5-red);
}

/* ==========================================================================
   10. SIGNAL PREVIEW
   ========================================================================== */

.t5-signal-preview {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    box-shadow: var(--t5-shadow-lg);
}

.t5-signal-preview__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--t5-space-5) var(--t5-space-6);
    background: var(--t5-bg-elevated);
    border-bottom: 1px solid var(--t5-border);
}

.t5-signal-preview__channel {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
}

.t5-signal-preview__avatar {
    width: 48px;
    height: 48px;
    background: var(--t5-bg-elevated);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--t5-text-sm);
    color: white;
    overflow: hidden;
}

.t5-signal-preview__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.t5-signal-preview__name {
    font-weight: 600;
    font-size: var(--t5-text-lg);
    color: var(--t5-text-primary);
}

.t5-signal-preview__tag {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
    margin-top: 2px;
}

.t5-signal-preview__time {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
}

.t5-signal-preview__body {
    padding: var(--t5-space-6);
    flex: 1;
}

.t5-signal-preview__type {
    display: inline-flex;
    align-items: center;
    gap: var(--t5-space-2);
    padding: var(--t5-space-2) var(--t5-space-4);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: var(--t5-text-sm);
    font-weight: 700;
    border-radius: var(--t5-radius);
    margin-bottom: var(--t5-space-4);
}

.t5-signal-preview__type--sell {
    background: var(--t5-red);
    color: white;
}

.t5-signal-preview__pair {
    font-size: var(--t5-text-2xl);
    font-weight: 700;
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-4);
}

.t5-signal-preview__levels {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-3);
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-base);
    margin-top: auto;
}

.t5-signal-preview__level {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--t5-space-4) var(--t5-space-5);
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius-lg);
}

.t5-signal-preview__level-label {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
    font-weight: 500;
}

.t5-signal-preview__level-value {
    color: var(--t5-text-primary);
    font-weight: 700;
    font-size: var(--t5-text-lg);
}

.t5-signal-preview__level--entry .t5-signal-preview__level-value {
    color: var(--t5-primary-light);
}

.t5-signal-preview__level--sl .t5-signal-preview__level-value {
    color: var(--t5-red);
}

.t5-signal-preview__level--tp .t5-signal-preview__level-value {
    color: var(--t5-green);
}

.t5-signal-preview__level--size .t5-signal-preview__level-value {
    color: var(--t5-primary);
}

.t5-signal-preview__meta {
    display: flex;
    align-items: center;
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-4);
}

.t5-signal-preview__bot {
    font-size: var(--t5-text-sm);
    font-weight: 500;
    color: var(--t5-text-muted);
    background: var(--t5-bg-elevated);
    padding: var(--t5-space-2) var(--t5-space-3);
    border-radius: var(--t5-radius);
}

.t5-signal-preview__meta .t5-signal-preview__pair {
    font-size: var(--t5-text-2xl);
    font-weight: 700;
    margin-bottom: 0;
}

/* ==========================================================================
   11. FEATURES / CARDS
   ========================================================================== */

.t5-features {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-features {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .t5-features {
        grid-template-columns: repeat(3, 1fr);
    }
}

.t5-feature {
    padding: var(--t5-space-8);
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    transition: var(--t5-transition);
}

.t5-feature:hover {
    border-color: var(--t5-primary);
    box-shadow: 0 0 30px rgba(0, 87, 204, 0.15);
    transform: translateY(-4px);
}

.t5-feature__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: rgba(0, 87, 204, 0.15);
    border: 1px solid rgba(0, 87, 204, 0.3);
    border-radius: var(--t5-radius-lg);
    margin-bottom: var(--t5-space-5);
    color: var(--t5-primary-light);
}

.t5-feature h3 {
    margin-bottom: var(--t5-space-3);
}

.t5-feature p {
    font-size: var(--t5-text-sm);
    margin-bottom: 0;
}

/* ==========================================================================
   12. METHOD / STEPS
   ========================================================================== */

/* ==========================================================================
   SIGNALS SECTION - Clean Two Column Layout
   ========================================================================== */

.t5-signals-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-12);
    align-items: center;
}

@media (min-width: 1024px) {
    .t5-signals-grid {
        grid-template-columns: 1.1fr 0.9fr;
        gap: var(--t5-space-16);
    }
}

.t5-signals-left h2 {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    margin: var(--t5-space-4) 0;
    line-height: 1.2;
}

.t5-signals-left > p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-8);
    line-height: 1.7;
}

.t5-signals-steps {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-5);
}

.t5-signals-step {
    display: flex;
    align-items: flex-start;
    gap: var(--t5-space-4);
}

.t5-signals-step__num {
    min-width: 40px;
    height: 40px;
    background: var(--t5-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--t5-text-base);
    flex-shrink: 0;
}

.t5-signals-step > div {
    flex: 1;
}

.t5-signals-step strong {
    display: block;
    color: var(--t5-text-primary);
    font-size: var(--t5-text-base);
    margin-bottom: var(--t5-space-1);
}

.t5-signals-step p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    margin: 0;
    line-height: 1.5;
}


.t5-signals-step__num {
    width: 36px;
    height: 36px;
    min-width: 36px;
    background: var(--t5-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--t5-text-base);
}

/* Signal Card */
.t5-signal-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    overflow: hidden;
    box-shadow: var(--t5-shadow-lg);
}

.t5-signal-card__header {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    padding: var(--t5-space-4);
    border-bottom: 1px solid var(--t5-border);
}

.t5-signal-card__header img {
    border-radius: 50%;
}

.t5-signal-card__header strong {
    display: block;
    font-size: var(--t5-text-sm);
}

.t5-signal-card__header span {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-secondary);
}

.t5-signal-card__body {
    padding: var(--t5-space-5);
}

.t5-signal-card__pair {
    font-size: var(--t5-text-xl);
    font-weight: 700;
    margin-bottom: var(--t5-space-4);
}

.t5-signal-card__type {
    display: inline-block;
    background: var(--t5-green);
    color: white;
    font-size: var(--t5-text-xs);
    padding: 2px 8px;
    border-radius: var(--t5-radius);
    margin-left: var(--t5-space-2);
}

.t5-signal-card__levels {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--t5-space-3);
}

.t5-signals-right {
    display: flex;
    justify-content: center;
}

@media (min-width: 1024px) {
    .t5-signals-right {
        justify-content: flex-end;
    }
}

.t5-signals-right .t5-signal-card {
    width: 100%;
    max-width: 360px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}

.t5-signal-card__levels > div {
    background: var(--t5-bg-elevated);
    padding: var(--t5-space-3) var(--t5-space-4);
    border-radius: var(--t5-radius);
    border: 1px solid var(--t5-border);
}

.t5-signal-card__levels span {
    display: block;
    font-size: var(--t5-text-xs);
    color: var(--t5-text-secondary);
    margin-bottom: var(--t5-space-1);
}

.t5-signal-card__levels strong {
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-sm);
}

.t5-red { color: var(--t5-red); }
.t5-green { color: var(--t5-green); }

.t5-method__steps {
    list-style: none;
    margin-top: var(--t5-space-8);
}

.t5-method__step {
    display: flex;
    gap: var(--t5-space-5);
    margin-bottom: var(--t5-space-6);
    padding: var(--t5-space-5);
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    transition: var(--t5-transition);
}

.t5-method__step:hover {
    border-color: var(--t5-primary);
}

.t5-method__step-num {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: var(--t5-primary);
    color: white;
    font-weight: 700;
    border-radius: var(--t5-radius);
}

.t5-method__step-content h4 {
    margin-bottom: var(--t5-space-2);
}

.t5-method__step-content p {
    font-size: var(--t5-text-sm);
    margin-bottom: 0;
}

/* ==========================================================================
   13. PAYOUT PROOFS
   ========================================================================== */

.t5-proofs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--t5-space-6);
}

.t5-proof-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    overflow: hidden;
    transition: var(--t5-transition);
}

.t5-proof-card:hover {
    border-color: var(--t5-green);
    box-shadow: var(--t5-shadow-green);
}

.t5-proof-card__image {
    position: relative;
    aspect-ratio: 4/3;
    background: var(--t5-bg-elevated);
    display: flex;
    align-items: center;
    justify-content: center;
}

.t5-proof-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.t5-proof-card__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--t5-space-2);
    color: var(--t5-text-muted);
}

.t5-proof-card__placeholder svg {
    width: 48px;
    height: 48px;
    opacity: 0.5;
}

.t5-proof-card__badge {
    position: absolute;
    top: var(--t5-space-3);
    right: var(--t5-space-3);
    padding: var(--t5-space-1) var(--t5-space-3);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: var(--t5-text-xs);
    font-weight: 700;
    border-radius: var(--t5-radius);
}

.t5-proof-card__content {
    padding: var(--t5-space-5);
}

.t5-proof-card__firm {
    display: flex;
    align-items: center;
    gap: var(--t5-space-2);
    font-weight: 600;
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-2);
}

.t5-proof-card__amount {
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-2xl);
    font-weight: 700;
    color: var(--t5-green);
}

.t5-proof-card__date {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
}

/* ==========================================================================
   13.5 PROP FIRM EDGE - Why Traders Fail / How We Solve It
   ========================================================================== */

.t5-edge {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-8);
    margin-bottom: var(--t5-space-12);
}

@media (min-width: 900px) {
    .t5-edge {
        grid-template-columns: 1fr 1fr;
        gap: var(--t5-space-10);
    }
}

.t5-edge__column {
    background: var(--t5-bg-card);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-8);
    border: 1px solid var(--t5-border);
}

.t5-edge__column--problems {
    border-color: var(--t5-red);
    box-shadow: none;
}

.t5-edge__column--solutions {
    border-color: var(--t5-green);
    box-shadow: none;
}

.t5-edge__title {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    font-size: var(--t5-text-xl);
    font-weight: 700;
    margin-bottom: var(--t5-space-6);
    padding-bottom: var(--t5-space-4);
    border-bottom: 1px solid var(--t5-border);
}

.t5-edge__column--problems .t5-edge__title {
    color: var(--t5-red);
}

.t5-edge__column--solutions .t5-edge__title {
    color: var(--t5-green);
}

.t5-edge__list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
}

.t5-edge__item {
    display: flex;
    gap: var(--t5-space-4);
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius);
    transition: var(--t5-transition);
}

.t5-edge__item:hover {
    transform: translateX(4px);
}

.t5-edge__item--fail:hover {
    background: rgba(255, 75, 75, 0.1);
}

.t5-edge__item--solve:hover {
    background: rgba(31, 218, 154, 0.1);
}

.t5-edge__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: var(--t5-radius);
}

.t5-edge__item--fail .t5-edge__icon {
    background: rgba(255, 75, 75, 0.15);
    color: var(--t5-red);
}

.t5-edge__item--solve .t5-edge__icon {
    background: rgba(31, 218, 154, 0.15);
    color: var(--t5-green);
}

.t5-edge__icon svg {
    width: 18px;
    height: 18px;
}

.t5-edge__content strong {
    display: block;
    font-size: var(--t5-text-sm);
    font-weight: 600;
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-1);
}

.t5-edge__content p {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin: 0;
    line-height: 1.5;
}

/* Bot Features Stats Grid - 2x4 layout */
.t5-bot-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--t5-space-4);
    max-width: 100%;
    margin: var(--t5-space-8) auto 0;
}

@media (min-width: 768px) {
    .t5-bot-features {
        grid-template-columns: repeat(4, 1fr);
    }
}

.t5-bot-feature {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    padding: var(--t5-space-6) var(--t5-space-4);
    text-align: center;
    transition: var(--t5-transition);
}

.t5-bot-feature:hover {
    border-color: var(--t5-primary);
    box-shadow: var(--t5-shadow-primary);
}

.t5-bot-feature__value {
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-2xl);
    font-weight: 700;
    color: var(--t5-primary-light);
    margin-bottom: var(--t5-space-2);
}

.t5-bot-feature__label {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ==========================================================================
   14. PRICING
   ========================================================================== */

.t5-pricing {
    max-width: 480px;
    margin: 0 auto;
}

.t5-pricing-card {
    background: var(--t5-bg-card);
    border: 2px solid var(--t5-primary);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-10);
    text-align: center;
    box-shadow: var(--t5-glow-primary);
    position: relative;
    overflow: hidden;
}

.t5-pricing-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--t5-primary);
}

.t5-pricing-card__header {
    margin-bottom: var(--t5-space-8);
    padding-bottom: var(--t5-space-6);
    border-bottom: 1px solid var(--t5-border);
}

.t5-pricing-card__name {
    font-size: var(--t5-text-lg);
    font-weight: 600;
    color: var(--t5-text-secondary);
    margin-bottom: var(--t5-space-4);
}

.t5-pricing-card__price {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: var(--t5-space-1);
}

.t5-pricing-card__currency {
    font-size: var(--t5-text-2xl);
    font-weight: 600;
    color: var(--t5-text-primary);
}

.t5-pricing-card__amount {
    font-family: var(--t5-font-mono);
    font-size: 4rem;
    font-weight: 700;
    color: var(--t5-primary-light);
    line-height: 1;
    text-shadow: 0 0 30px var(--t5-primary-glow);
}

.t5-pricing-card__period {
    font-size: var(--t5-text-lg);
    color: var(--t5-text-muted);
}

.t5-pricing-card__features {
    list-style: none;
    margin: 0 0 var(--t5-space-8);
    text-align: left;
}

.t5-pricing-card__features li {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    padding: var(--t5-space-3) 0;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
    border-bottom: 1px solid var(--t5-border);
}

.t5-pricing-card__features li:last-child {
    border-bottom: none;
}

.t5-pricing-card__features svg {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--t5-green);
}

.t5-pricing-card__note {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin-top: var(--t5-space-4);
    margin-bottom: 0;
}

/* ==========================================================================
   15. FAQ
   ========================================================================== */

.t5-faq {
    max-width: 700px;
    margin: 0 auto;
}

.t5-faq details {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    margin-bottom: var(--t5-space-3);
    transition: var(--t5-transition);
}

.t5-faq details:hover {
    border-color: var(--t5-primary);
}

.t5-faq details[open] {
    border-color: var(--t5-primary);
    box-shadow: 0 0 20px rgba(0, 87, 204, 0.15);
}

.t5-faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--t5-space-5);
    font-weight: 600;
    color: var(--t5-text-primary);
    cursor: pointer;
    list-style: none;
}

.t5-faq summary::-webkit-details-marker {
    display: none;
}

.t5-faq summary::after {
    content: '+';
    font-size: var(--t5-text-xl);
    color: var(--t5-primary-light);
}

.t5-faq details[open] summary::after {
    content: '-';
}

.t5-faq__answer {
    padding: 0 var(--t5-space-5) var(--t5-space-5);
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
}

/* ==========================================================================
   16. CTA
   ========================================================================== */

.t5-cta {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
    padding: var(--t5-space-12);
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
}

.t5-cta h2 {
    margin-bottom: var(--t5-space-4);
}

.t5-cta p {
    margin: 0 auto var(--t5-space-8);
}

/* ==========================================================================
   17. FOOTER - DARK PROFESSIONAL
   ========================================================================== */

.t5-footer {
    background: linear-gradient(180deg, #0a0e1a 0%, #070a12 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 64px 0 32px;
}

@media (min-width: 768px) {
    .t5-footer {
        padding: 80px 0 40px;
    }
}

.t5-footer__top {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

@media (min-width: 768px) {
    .t5-footer__top {
        grid-template-columns: 1.5fr 2.5fr;
        gap: 60px;
        padding-bottom: 48px;
    }
}

.t5-footer__brand {
    max-width: 280px;
}

.t5-footer__brand p {
    color: var(--t5-text-muted);
    font-size: 14px;
    line-height: 1.6;
    margin-top: 16px;
    margin-bottom: 0;
}

.t5-footer__logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.t5-footer__logo img {
    height: 40px;
    width: auto;
}

.t5-footer__logo .t5-logo__text {
    font-size: 18px;
    font-weight: 700;
    color: var(--t5-text-primary);
    letter-spacing: 0.02em;
}

.t5-footer__links {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

@media (min-width: 640px) {
    .t5-footer__links {
        grid-template-columns: repeat(3, 1fr);
        gap: 40px;
    }
}

.t5-footer__col h4 {
    color: var(--t5-text-primary);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 20px;
}

.t5-footer__col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.t5-footer__col li {
    margin-bottom: 12px;
}

.t5-footer__col a {
    color: var(--t5-text-secondary);
    font-size: 14px;
    transition: color 0.2s ease;
}

.t5-footer__col a:hover {
    color: var(--t5-primary-light);
}

.t5-footer__disclaimer {
    padding: 32px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.t5-footer__disclaimer p {
    font-size: 12px;
    color: var(--t5-text-muted);
    margin-bottom: 8px;
    max-width: none;
    line-height: 1.7;
}

.t5-footer__disclaimer p:last-child {
    margin-bottom: 0;
}

.t5-footer__disclaimer strong {
    color: var(--t5-text-secondary);
    font-weight: 600;
}

.t5-footer__bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding-top: 32px;
    font-size: 13px;
    text-align: center;
}

@media (min-width: 768px) {
    .t5-footer__bottom {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }
}

.t5-footer__copy {
    color: var(--t5-text-muted);
}

.t5-footer__legal {
    display: flex;
    gap: 24px;
}

.t5-footer__legal a {
    color: var(--t5-text-secondary);
    transition: color 0.2s ease;
}

.t5-footer__legal a:hover {
    color: var(--t5-primary-light);
}

/* ==========================================================================
   18. ANIMATIONS & UTILITIES
   ========================================================================== */

.t5-fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.t5-fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.t5-fade-in-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.t5-fade-in-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.t5-fade-in-right {
    opacity: 0;
    transform: translateX(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.t5-fade-in-right.visible {
    opacity: 1;
    transform: translateX(0);
}

.t5-stagger > *:nth-child(1) { transition-delay: 0ms; }
.t5-stagger > *:nth-child(2) { transition-delay: 100ms; }
.t5-stagger > *:nth-child(3) { transition-delay: 200ms; }
.t5-stagger > *:nth-child(4) { transition-delay: 300ms; }

.t5-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.t5-divider {
    width: 60px;
    height: 3px;
    background: var(--t5-primary);
    border-radius: var(--t5-radius-full);
    margin: var(--t5-space-4) auto var(--t5-space-6);
}

/* ==========================================================================
   19. LEGAL PAGES (Privacy, Terms, Disclaimer)
   ========================================================================== */

.t5-legal {
    padding: var(--t5-space-20) 0;
    min-height: 80vh;
}

.t5-container--narrow {
    max-width: 800px;
}

.t5-legal__header {
    text-align: center;
    margin-bottom: var(--t5-space-12);
}

.t5-legal__header h1 {
    font-size: var(--t5-text-4xl);
    margin-bottom: var(--t5-space-4);
}

.t5-legal__updated {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
}

.t5-legal__content {
    color: var(--t5-text-secondary);
    line-height: 1.8;
}

.t5-legal__content h2 {
    color: var(--t5-text-primary);
    font-size: var(--t5-text-xl);
    margin-top: var(--t5-space-10);
    margin-bottom: var(--t5-space-4);
    padding-bottom: var(--t5-space-2);
    border-bottom: 1px solid var(--t5-border);
}

.t5-legal__content h3 {
    color: var(--t5-text-primary);
    font-size: var(--t5-text-lg);
    margin-top: var(--t5-space-6);
    margin-bottom: var(--t5-space-3);
}

.t5-legal__content p {
    margin-bottom: var(--t5-space-4);
}

.t5-legal__content ul {
    margin-bottom: var(--t5-space-4);
    padding-left: var(--t5-space-6);
}

.t5-legal__content li {
    margin-bottom: var(--t5-space-2);
}

.t5-legal__content a {
    color: var(--t5-primary-light);
}

.t5-legal__content a:hover {
    text-decoration: underline;
}

.t5-legal__acceptance {
    margin-top: var(--t5-space-10);
    padding: var(--t5-space-6);
    background: var(--t5-bg-card);
    border-radius: var(--t5-radius);
    text-align: center;
}

/* Disclaimer Boxes */
.t5-disclaimer-box {
    padding: var(--t5-space-6);
    border-radius: var(--t5-radius-lg);
    margin: var(--t5-space-8) 0;
    background: var(--t5-bg-card);
    border-left: 4px solid var(--t5-primary);
}

.t5-disclaimer-box h3 {
    margin-top: 0;
    margin-bottom: var(--t5-space-3);
    color: var(--t5-text-primary);
}

.t5-disclaimer-box p {
    margin-bottom: 0;
}

.t5-disclaimer-box--danger {
    border-left-color: var(--t5-red);
    background: rgba(255, 75, 75, 0.1);
}

.t5-disclaimer-box--danger h3 {
    color: var(--t5-red);
}

/* ==========================================================================
   20. MEMBERS AREA
   ========================================================================== */

.t5-members-hero {
    background: linear-gradient(180deg, var(--t5-bg-dark) 0%, var(--t5-bg-card) 100%);
    padding: var(--t5-space-20) 0 var(--t5-space-12);
    text-align: center;
    border-bottom: 1px solid var(--t5-border);
}

.t5-members-hero h1 {
    font-size: var(--t5-text-4xl);
    margin-bottom: var(--t5-space-4);
}

.t5-members-hero p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-lg);
    max-width: 600px;
    margin: 0 auto;
}

/* Quick Links */
.t5-members-quick {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-12);
}

.t5-members-quick__item {
    display: flex;
    align-items: center;
    gap: var(--t5-space-4);
    padding: var(--t5-space-5);
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    transition: var(--t5-transition);
}

.t5-members-quick__item:hover {
    border-color: var(--t5-primary);
    box-shadow: var(--t5-shadow-primary);
}

.t5-members-quick__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius);
    color: var(--t5-primary-light);
}

.t5-members-quick__text strong {
    display: block;
    color: var(--t5-text-primary);
    font-size: var(--t5-text-sm);
}

.t5-members-quick__text span {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-xs);
}

/* Members Sections */
.t5-members-section {
    margin-bottom: var(--t5-space-16);
}

.t5-members-section__header {
    display: flex;
    align-items: flex-start;
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-8);
    padding-bottom: var(--t5-space-6);
    border-bottom: 1px solid var(--t5-border);
}

.t5-members-section__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius);
    color: var(--t5-green);
    flex-shrink: 0;
}

.t5-members-section__icon--primary {
    color: var(--t5-primary-light);
}

.t5-members-section__header h2 {
    margin-bottom: var(--t5-space-1);
}

.t5-members-section__header p {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
    margin: 0;
}

/* Members Grid */
.t5-members-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--t5-space-6);
}

/* Members Cards */
.t5-members-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-6);
    position: relative;
    transition: var(--t5-transition);
}

.t5-members-card:hover {
    border-color: var(--t5-green);
}

.t5-members-card--featured {
    border-color: var(--t5-primary);
}

.t5-members-card--featured:hover {
    border-color: var(--t5-primary-light);
    box-shadow: var(--t5-shadow-primary);
}

.t5-members-card__badge {
    display: inline-block;
    padding: var(--t5-space-1) var(--t5-space-3);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: var(--t5-text-xs);
    font-weight: 700;
    border-radius: var(--t5-radius);
    margin-bottom: var(--t5-space-4);
}

.t5-members-card__badge--primary {
    background: var(--t5-primary);
    color: white;
}

.t5-members-card h3 {
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-3);
}

.t5-members-card > p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    margin-bottom: var(--t5-space-4);
}

.t5-members-card__topics {
    list-style: none;
    padding: 0;
    margin-bottom: var(--t5-space-4);
}

.t5-members-card__topics li {
    padding: var(--t5-space-2) 0;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
    border-bottom: 1px solid var(--t5-border);
}

.t5-members-card__topics li:last-child {
    border-bottom: none;
}

.t5-members-card__status {
    display: inline-block;
    padding: var(--t5-space-2) var(--t5-space-4);
    background: var(--t5-bg-elevated);
    color: var(--t5-text-muted);
    font-size: var(--t5-text-xs);
    border-radius: var(--t5-radius);
}

.t5-members-card__status--live {
    background: var(--t5-green);
    color: var(--t5-bg-dark);
}

/* Resources */
.t5-members-resources {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--t5-space-6);
}

.t5-members-resource {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    padding: var(--t5-space-6);
}

.t5-members-resource h4 {
    font-size: var(--t5-text-base);
    margin-bottom: var(--t5-space-4);
    padding-bottom: var(--t5-space-2);
    border-bottom: 1px solid var(--t5-border);
}

.t5-members-resource ul {
    list-style: none;
}

.t5-members-resource li {
    padding: var(--t5-space-2) 0;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
}

.t5-members-resource a {
    color: var(--t5-primary-light);
}

.t5-members-resource a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   21. AUTH PAGES (Login, Register, Password Reset)
   ========================================================================== */

.t5-auth {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--t5-space-8);
    background: var(--t5-bg-dark);
}

.t5-auth__container {
    width: 100%;
    max-width: 420px;
}

.t5-auth__logo {
    display: flex;
    justify-content: center;
    margin-bottom: var(--t5-space-8);
}

.t5-auth__logo img {
    height: 48px;
    width: auto;
}

.t5-auth__card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-10);
}

.t5-auth__header {
    text-align: center;
    margin-bottom: var(--t5-space-8);
}

.t5-auth__header h1 {
    font-size: var(--t5-text-2xl);
    margin-bottom: var(--t5-space-2);
}

.t5-auth__header p {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
    margin: 0;
}

.t5-auth__form {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-5);
}

.t5-form-group {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-2);
}

.t5-form-group label {
    font-size: var(--t5-text-sm);
    font-weight: 500;
    color: var(--t5-text-secondary);
}

.t5-form-input {
    width: 100%;
    padding: var(--t5-space-4);
    background: var(--t5-bg-input);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius);
    color: var(--t5-text-primary);
    font-size: var(--t5-text-base);
    transition: var(--t5-transition);
}

.t5-form-input:focus {
    outline: none;
    border-color: var(--t5-primary);
    box-shadow: 0 0 0 3px var(--t5-primary-glow);
}

.t5-form-input::placeholder {
    color: var(--t5-text-muted);
}

.t5-auth__options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--t5-text-sm);
}

.t5-auth__remember {
    display: flex;
    align-items: center;
    gap: var(--t5-space-2);
    color: var(--t5-text-secondary);
}

.t5-auth__remember input {
    width: 16px;
    height: 16px;
    accent-color: var(--t5-primary);
}

.t5-auth__forgot {
    color: var(--t5-primary-light);
}

.t5-auth__forgot:hover {
    text-decoration: underline;
}

.t5-auth__submit {
    margin-top: var(--t5-space-2);
}

.t5-auth__footer {
    text-align: center;
    margin-top: var(--t5-space-6);
    padding-top: var(--t5-space-6);
    border-top: 1px solid var(--t5-border);
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
}

.t5-auth__footer a {
    color: var(--t5-primary-light);
    font-weight: 500;
}

.t5-auth__footer a:hover {
    text-decoration: underline;
}

.t5-auth__divider {
    display: flex;
    align-items: center;
    gap: var(--t5-space-4);
    margin: var(--t5-space-6) 0;
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
}

.t5-auth__divider::before,
.t5-auth__divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--t5-border);
}

.t5-auth__social {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-3);
}

.t5-btn--social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--t5-space-3);
    width: 100%;
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius);
    color: var(--t5-text-primary);
    font-weight: 500;
    transition: var(--t5-transition);
}

.t5-btn--social:hover {
    background: var(--t5-bg-input);
    border-color: var(--t5-text-muted);
}

/* Alert Messages */
.t5-alert {
    padding: var(--t5-space-4);
    border-radius: var(--t5-radius);
    font-size: var(--t5-text-sm);
    margin-bottom: var(--t5-space-4);
}

.t5-alert--error {
    background: rgba(255, 75, 75, 0.1);
    border: 1px solid var(--t5-red);
    color: var(--t5-red-light);
}

.t5-alert--success {
    background: rgba(31, 218, 154, 0.1);
    border: 1px solid var(--t5-green);
    color: var(--t5-green-light);
}

.t5-alert--info {
    background: rgba(0, 87, 204, 0.1);
    border: 1px solid var(--t5-primary);
    color: var(--t5-primary-light);
}

/* ==========================================================================
   22. 404 & ERROR PAGES
   ========================================================================== */

.t5-error-page {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--t5-space-8);
}

.t5-error-page__code {
    font-family: var(--t5-font-mono);
    font-size: 8rem;
    font-weight: 700;
    color: var(--t5-primary);
    line-height: 1;
    margin-bottom: var(--t5-space-4);
    text-shadow: var(--t5-glow-primary);
}

.t5-error-page h1 {
    font-size: var(--t5-text-2xl);
    margin-bottom: var(--t5-space-4);
}

.t5-error-page p {
    color: var(--t5-text-muted);
    margin-bottom: var(--t5-space-8);
    max-width: 400px;
}

/* ==========================================================================
   23. PASSWORD PROTECTED PAGE
   ========================================================================== */

.t5-password-page {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--t5-space-8);
}

.t5-password-form {
    width: 100%;
    max-width: 400px;
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-10);
    text-align: center;
}

.t5-password-form__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius-full);
    margin: 0 auto var(--t5-space-6);
    color: var(--t5-primary-light);
}

.t5-password-form h1 {
    font-size: var(--t5-text-xl);
    margin-bottom: var(--t5-space-2);
}

.t5-password-form p {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
    margin-bottom: var(--t5-space-6);
}

.t5-password-form form {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
}

.t5-password-form input[type="password"] {
    width: 100%;
    padding: var(--t5-space-4);
    background: var(--t5-bg-input);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius);
    color: var(--t5-text-primary);
    font-size: var(--t5-text-base);
    text-align: center;
}

.t5-password-form input[type="password"]:focus {
    outline: none;
    border-color: var(--t5-primary);
}

/* ==========================================================================
   24. DEFAULT PAGE TEMPLATE
   ========================================================================== */

.t5-page {
    padding: var(--t5-space-20) 0;
    min-height: 60vh;
}

.t5-page__header {
    text-align: center;
    margin-bottom: var(--t5-space-12);
}

.t5-page__header h1 {
    font-size: var(--t5-text-4xl);
}

.t5-page__content {
    color: var(--t5-text-secondary);
    line-height: 1.8;
}

.t5-page__content h2 {
    color: var(--t5-text-primary);
    font-size: var(--t5-text-2xl);
    margin-top: var(--t5-space-10);
    margin-bottom: var(--t5-space-4);
}

.t5-page__content h3 {
    color: var(--t5-text-primary);
    font-size: var(--t5-text-xl);
    margin-top: var(--t5-space-8);
    margin-bottom: var(--t5-space-3);
}

.t5-page__content p {
    margin-bottom: var(--t5-space-4);
}

.t5-page__content ul,
.t5-page__content ol {
    margin-bottom: var(--t5-space-4);
    padding-left: var(--t5-space-6);
}

.t5-page__content li {
    margin-bottom: var(--t5-space-2);
}

.t5-page__content a {
    color: var(--t5-primary-light);
}

.t5-page__content a:hover {
    text-decoration: underline;
}

.t5-page__content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--t5-radius-lg);
    margin: var(--t5-space-6) 0;
}

.t5-page__content blockquote {
    border-left: 4px solid var(--t5-primary);
    padding-left: var(--t5-space-6);
    margin: var(--t5-space-6) 0;
    color: var(--t5-text-muted);
    font-style: italic;
}

.t5-page__content pre,
.t5-page__content code {
    font-family: var(--t5-font-mono);
    background: var(--t5-bg-card);
    border-radius: var(--t5-radius);
}

.t5-page__content code {
    padding: var(--t5-space-1) var(--t5-space-2);
    font-size: var(--t5-text-sm);
}

.t5-page__content pre {
    padding: var(--t5-space-4);
    overflow-x: auto;
    margin: var(--t5-space-4) 0;
}

.t5-page__content pre code {
    padding: 0;
    background: none;
}

/* ==========================================================================
   25. MEMBERS DASHBOARD
   ========================================================================== */

.t5-dashboard {
    display: flex;
    min-height: 100vh;
    background: var(--t5-bg-dark);
}

/* Sidebar */
.t5-dashboard__sidebar {
    width: 260px;
    background: var(--t5-bg-card);
    border-right: 1px solid var(--t5-border);
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 100;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
}

.t5-dashboard__sidebar.active {
    transform: translateX(0);
}

@media (min-width: 1024px) {
    .t5-dashboard__sidebar {
        position: sticky;
        top: 0;
        height: 100vh;
        transform: translateX(0);
    }
}

.t5-dashboard__logo {
    padding: var(--t5-space-6);
    border-bottom: 1px solid var(--t5-border);
}

.t5-dashboard__logo img {
    height: 36px;
    width: auto;
}

.t5-dashboard__nav {
    flex: 1;
    padding: var(--t5-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-1);
    overflow-y: auto;
}

.t5-dashboard__nav-item {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    padding: var(--t5-space-3) var(--t5-space-4);
    border-radius: var(--t5-radius);
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    font-weight: 500;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    width: 100%;
    text-decoration: none;
    transition: var(--t5-transition);
}

.t5-dashboard__nav-item:hover {
    background: var(--t5-bg-elevated);
    color: var(--t5-text-primary);
}

.t5-dashboard__nav-item.active {
    background: var(--t5-primary);
    color: white;
}

.t5-dashboard__sidebar-footer {
    padding: var(--t5-space-4);
    border-top: 1px solid var(--t5-border);
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-1);
}

/* Main Content */
.t5-dashboard__main {
    flex: 1;
    min-width: 0;
    padding: var(--t5-space-6);
}

@media (min-width: 1024px) {
    .t5-dashboard__main {
        padding: var(--t5-space-8);
    }
}

.t5-dashboard__mobile-header {
    display: flex;
    align-items: center;
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-6);
    padding-bottom: var(--t5-space-4);
    border-bottom: 1px solid var(--t5-border);
}

@media (min-width: 1024px) {
    .t5-dashboard__mobile-header {
        display: none;
    }
}

.t5-dashboard__menu-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius);
    color: var(--t5-text-primary);
    cursor: pointer;
}

.t5-dashboard__mobile-logo {
    height: 32px;
    width: auto;
}

/* Tabs */
.t5-dashboard__tab {
    display: none;
}

.t5-dashboard__tab.active {
    display: block;
}

/* Header */
.t5-dashboard__header {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-8);
}

@media (min-width: 768px) {
    .t5-dashboard__header {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.t5-dashboard__header h1 {
    font-size: var(--t5-text-2xl);
    margin-bottom: var(--t5-space-1);
}

.t5-dashboard__header p {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
    margin: 0;
}

/* Stats Cards */
.t5-dashboard__stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--t5-space-4);
    margin-bottom: var(--t5-space-8);
}

@media (min-width: 768px) {
    .t5-dashboard__stats {
        grid-template-columns: repeat(4, 1fr);
    }
}

.t5-stat-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    padding: var(--t5-space-5);
    display: flex;
    align-items: flex-start;
    gap: var(--t5-space-4);
}

.t5-stat-card__icon {
    width: 44px;
    height: 44px;
    border-radius: var(--t5-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.t5-stat-card__icon--blue {
    background: rgba(0, 87, 204, 0.15);
    color: var(--t5-primary-light);
}

.t5-stat-card__icon--green {
    background: rgba(31, 218, 154, 0.15);
    color: var(--t5-green);
}

.t5-stat-card__icon--purple {
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
}

.t5-stat-card__icon--orange {
    background: rgba(255, 159, 64, 0.15);
    color: #fb923c;
}

.t5-stat-card__label {
    display: block;
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin-bottom: var(--t5-space-1);
}

.t5-stat-card__value {
    font-size: var(--t5-text-xl);
    font-weight: 700;
    color: var(--t5-text-primary);
}

/* Dashboard Grid */
.t5-dashboard__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-6);
    margin-bottom: var(--t5-space-8);
}

@media (min-width: 1024px) {
    .t5-dashboard__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.t5-dashboard__grid--3 {
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .t5-dashboard__grid--3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1200px) {
    .t5-dashboard__grid--3 {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Dashboard Cards */
.t5-dashboard__card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-6);
}

.t5-dashboard__card h3 {
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-5);
    padding-bottom: var(--t5-space-3);
    border-bottom: 1px solid var(--t5-border);
}

/* Quick Actions */
.t5-quick-actions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--t5-space-3);
}

.t5-quick-action {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    cursor: pointer;
    text-decoration: none;
    text-align: left;
    transition: var(--t5-transition);
}

.t5-quick-action:hover {
    border-color: var(--t5-primary);
}

.t5-quick-action__icon {
    width: 40px;
    height: 40px;
    border-radius: var(--t5-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 87, 204, 0.15);
    color: var(--t5-primary-light);
    flex-shrink: 0;
}

.t5-quick-action__icon--green {
    background: rgba(31, 218, 154, 0.15);
    color: var(--t5-green);
}

.t5-quick-action__icon--purple {
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
}

.t5-quick-action__icon--orange {
    background: rgba(255, 159, 64, 0.15);
    color: #fb923c;
}

.t5-quick-action strong {
    display: block;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-primary);
}

.t5-quick-action span {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
}

/* Announcements */
.t5-announcements {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
}

.t5-announcement {
    display: flex;
    gap: var(--t5-space-3);
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius);
}

.t5-announcement__badge {
    padding: var(--t5-space-1) var(--t5-space-2);
    background: var(--t5-primary);
    color: white;
    font-size: 10px;
    font-weight: 700;
    border-radius: var(--t5-radius);
    text-transform: uppercase;
    height: fit-content;
}

.t5-announcement__content strong {
    display: block;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-1);
}

.t5-announcement__content p {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-secondary);
    margin: 0 0 var(--t5-space-2);
}

.t5-announcement__date {
    font-size: 10px;
    color: var(--t5-text-muted);
}

/* Markets */
.t5-markets {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
}

.t5-market {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius-lg);
    flex-wrap: wrap;
    gap: var(--t5-space-3);
}

.t5-market__info {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
}

.t5-market__icon {
    width: 48px;
    height: 48px;
    background: var(--t5-primary);
    color: white;
    border-radius: var(--t5-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--t5-text-sm);
}

.t5-market__icon--gold {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    color: #1a1a1a;
}

.t5-market__info strong {
    display: block;
    color: var(--t5-text-primary);
}

.t5-market__info span {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
}

.t5-market__session {
    text-align: right;
}

.t5-market__badge {
    display: inline-block;
    padding: var(--t5-space-1) var(--t5-space-2);
    font-size: 10px;
    font-weight: 700;
    border-radius: var(--t5-radius);
    text-transform: uppercase;
    background: var(--t5-bg-card);
    color: var(--t5-text-muted);
}

.t5-market__badge--active {
    background: var(--t5-green);
    color: var(--t5-bg-dark);
}

.t5-market__session > span:last-child {
    display: block;
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin-top: var(--t5-space-1);
}

/* Signal Example */
.t5-signal-example {
    background: var(--t5-bg-elevated);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    overflow: hidden;
    max-width: 400px;
}

.t5-signal-example__header {
    padding: var(--t5-space-4);
    background: var(--t5-bg-dark);
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
}

.t5-signal-example__type {
    padding: var(--t5-space-1) var(--t5-space-3);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: var(--t5-text-xs);
    font-weight: 700;
    border-radius: var(--t5-radius);
}

.t5-signal-example__pair {
    font-weight: 700;
    color: var(--t5-text-primary);
}

.t5-signal-example__body {
    padding: var(--t5-space-4);
}

.t5-signal-example__row {
    display: flex;
    justify-content: space-between;
    padding: var(--t5-space-2) 0;
    border-bottom: 1px solid var(--t5-border);
    font-size: var(--t5-text-sm);
}

.t5-signal-example__row:last-child {
    border-bottom: none;
}

.t5-signal-example__row span {
    color: var(--t5-text-muted);
}

.t5-signal-example__row strong {
    color: var(--t5-text-primary);
    font-family: var(--t5-font-mono);
}

.t5-signal-example__row--sl strong {
    color: var(--t5-red);
}

.t5-signal-example__row--tp strong {
    color: var(--t5-green);
}

/* Steps */
.t5-steps {
    list-style: none;
    padding: 0;
    counter-reset: step;
}

.t5-steps li {
    display: flex;
    gap: var(--t5-space-4);
    padding: var(--t5-space-4) 0;
    border-bottom: 1px solid var(--t5-border);
}

.t5-steps li:last-child {
    border-bottom: none;
}

.t5-steps__num {
    width: 32px;
    height: 32px;
    background: var(--t5-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--t5-text-sm);
    flex-shrink: 0;
}

.t5-steps li strong {
    display: block;
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-1);
}

.t5-steps li p {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
    margin: 0;
}

/* Info Box */
.t5-info-box {
    display: flex;
    gap: var(--t5-space-4);
    padding: var(--t5-space-4);
    background: rgba(0, 87, 204, 0.1);
    border: 1px solid var(--t5-primary);
    border-radius: var(--t5-radius-lg);
    margin-bottom: var(--t5-space-6);
}

.t5-info-box__icon {
    color: var(--t5-primary-light);
    flex-shrink: 0;
}

.t5-info-box strong {
    display: block;
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-1);
}

.t5-info-box p {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
    margin: 0;
}

/* Table */
.t5-table {
    width: 100%;
    border-collapse: collapse;
}

.t5-table th,
.t5-table td {
    padding: var(--t5-space-3);
    text-align: left;
    border-bottom: 1px solid var(--t5-border);
    font-size: var(--t5-text-sm);
}

.t5-table th {
    font-weight: 600;
    color: var(--t5-text-muted);
    font-size: var(--t5-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.t5-table td {
    color: var(--t5-text-secondary);
}

/* Course Grid */
.t5-course-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--t5-space-6);
}

.t5-course-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-6);
    transition: var(--t5-transition);
}

.t5-course-card:hover {
    border-color: var(--t5-primary);
}

.t5-course-card--featured {
    border-color: rgba(0, 87, 204, 0.3);
}

.t5-course-card__badge {
    display: inline-block;
    padding: var(--t5-space-1) var(--t5-space-3);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: 10px;
    font-weight: 700;
    border-radius: var(--t5-radius);
    text-transform: uppercase;
    margin-bottom: var(--t5-space-3);
}

.t5-course-card__badge--intermediate {
    background: #fb923c;
}

.t5-course-card__badge--primary {
    background: var(--t5-primary);
    color: white;
}

.t5-course-card h3 {
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-2);
}

.t5-course-card > p {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
    margin-bottom: var(--t5-space-4);
}

.t5-course-card ul {
    list-style: none;
    padding: 0;
    margin-bottom: var(--t5-space-4);
}

.t5-course-card li {
    padding: var(--t5-space-2) 0;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
    border-bottom: 1px solid var(--t5-border);
}

.t5-course-card li:last-child {
    border-bottom: none;
}

.t5-course-card__status {
    display: inline-block;
    padding: var(--t5-space-2) var(--t5-space-4);
    background: var(--t5-bg-elevated);
    color: var(--t5-text-muted);
    font-size: var(--t5-text-xs);
    border-radius: var(--t5-radius);
}

/* Prop Firm List */
.t5-propfirm-list {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-3);
}

.t5-propfirm-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius-lg);
    flex-wrap: wrap;
    gap: var(--t5-space-3);
}

.t5-propfirm-item__info strong {
    display: block;
    color: var(--t5-text-primary);
}

.t5-propfirm-item__info span {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
}

.t5-propfirm-item__details {
    text-align: right;
}

.t5-propfirm-item__tag {
    display: inline-block;
    padding: var(--t5-space-1) var(--t5-space-2);
    background: var(--t5-primary);
    color: white;
    font-size: 10px;
    font-weight: 700;
    border-radius: var(--t5-radius);
    text-transform: uppercase;
}

.t5-propfirm-item__details > span:last-child {
    display: block;
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin-top: var(--t5-space-1);
}

/* Resource List */
.t5-resource-list {
    list-style: none;
    padding: 0;
}

.t5-resource-list li {
    padding: var(--t5-space-3) 0;
    border-bottom: 1px solid var(--t5-border);
}

.t5-resource-list li:last-child {
    border-bottom: none;
}

.t5-resource-list a {
    text-decoration: none;
    display: block;
}

.t5-resource-list a:hover strong {
    color: var(--t5-primary-light);
}

.t5-resource-list strong {
    display: block;
    color: var(--t5-text-primary);
    font-size: var(--t5-text-sm);
    transition: var(--t5-transition);
}

.t5-resource-list span {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
}

/* Button Outline */
.t5-btn--outline {
    background: transparent;
    border: 1px solid var(--t5-border);
    color: var(--t5-text-primary);
}

.t5-btn--outline:hover {
    border-color: var(--t5-primary);
    color: var(--t5-primary-light);
}

/* ==========================================================================
   26. MOBILE-FIRST RESPONSIVE SYSTEM (RTD Best Practices)
   ==========================================================================

   Breakpoint System:
   - Default: Mobile 320px+ (no media query)
   - 640px: Large phones (2-column grids)
   - 768px: Tablets (layout changes)
   - 1024px: Desktop (full features)

   ========================================================================== */

/* ----- MOBILE-FIRST CSS CUSTOM PROPERTIES ----- */
:root {
    /* Mobile-first spacing tokens */
    --t5-section-padding: 36px;
    --t5-container-padding: 20px;
    --t5-card-padding: 16px;
    --t5-card-radius: 12px;

    /* Mobile-first typography clamp values */
    --t5-heading-1: clamp(1.75rem, 5vw + 0.5rem, 4rem);
    --t5-heading-2: clamp(1.5rem, 4vw + 0.25rem, 3rem);
    --t5-heading-3: clamp(1.125rem, 2vw + 0.5rem, 1.5rem);

    /* Mobile-first shadow (reduced on mobile) */
    --t5-shadow-mobile: 0 2px 10px rgba(0, 0, 0, 0.3);
    --t5-shadow-mobile-sm: 0 1px 4px rgba(0, 0, 0, 0.2);
}

/* Tablet breakpoint overrides */
@media (min-width: 768px) {
    :root {
        --t5-section-padding: 48px;
        --t5-container-padding: 32px;
        --t5-card-padding: 20px;
        --t5-card-radius: 14px;
    }
}

/* Desktop breakpoint overrides */
@media (min-width: 1024px) {
    :root {
        --t5-section-padding: 80px;
        --t5-container-padding: 48px;
        --t5-card-padding: 24px;
        --t5-card-radius: 16px;
    }
}

/* ==========================================================================
   26.1 MOBILE-FIRST CONTAINER & SECTION SPACING
   ========================================================================== */

/* Override container padding - mobile first */
.t5-container {
    padding: 0 var(--t5-container-padding);
}

/* Override section padding - mobile first */
.t5-section {
    padding: var(--t5-section-padding) 0;
}

/* ==========================================================================
   26.2 MOBILE-FIRST TYPOGRAPHY WITH CLAMP
   ========================================================================== */

/* Fluid typography using clamp */
h1, .t5-h1 {
    font-size: var(--t5-heading-1);
}

h2, .t5-h2 {
    font-size: var(--t5-heading-2);
}

h3, .t5-h3 {
    font-size: var(--t5-heading-3);
}

/* Body text scaling */
body {
    font-size: clamp(0.875rem, 2vw + 0.25rem, 1rem);
}

/* ==========================================================================
   26.3 HEADER MOBILE-FIRST FIXES (White Bar Glitch Fix)
   ========================================================================== */

/* Fix header gradient background - ensure no white bar */
.t5-header {
    background: linear-gradient(to bottom,
        var(--t5-bg-dark) 0%,
        rgba(11, 16, 32, 0.95) 50%,
        rgba(11, 16, 32, 0) 100%);
    padding: var(--t5-space-3) 0;
}

/* Scrolled state - solid background to prevent any transparency issues */
.t5-header--scrolled {
    background: var(--t5-bg-dark);
    border-bottom: 1px solid var(--t5-border);
}

/* Mobile logo sizing */
.t5-logo img {
    height: 32px;
}

/* Mobile logo text - visible but smaller */
.t5-logo__text {
    font-size: 0.75rem;
    display: block;
}

/* Large phone logo */
@media (min-width: 640px) {
    .t5-logo img {
        height: 36px;
    }

    .t5-logo__text {
        font-size: 0.875rem;
    }
}

/* Tablet logo */
@media (min-width: 768px) {
    .t5-header {
        padding: var(--t5-space-4) 0;
    }

    .t5-logo img {
        height: 44px;
    }

    .t5-logo__text {
        font-size: 1.125rem;
    }
}

/* Desktop logo */
@media (min-width: 1024px) {
    .t5-logo img {
        height: 48px;
    }

    .t5-logo__text {
        font-size: 1.25rem;
    }
}

/* ==========================================================================
   26.4 MOBILE NAVIGATION STYLES
   ========================================================================== */

/* Mobile nav links - increased touch targets */
.t5-nav--open .t5-nav__link {
    min-height: 48px;
    padding: var(--t5-space-4) var(--t5-space-4);
    font-size: 1rem;
    display: flex;
    align-items: center;
}

/* Mobile header buttons container */
.t5-header__mobile-buttons {
    gap: var(--t5-space-2);
}

/* Mobile CTA button in header - ensure touch target */
.t5-header__mobile-buttons .t5-btn {
    min-height: 44px;
    min-width: 44px;
    padding: var(--t5-space-2) var(--t5-space-4);
    font-size: 0.8125rem;
}

/* ==========================================================================
   26.5 TOUCH TARGETS - MINIMUM 44x44px
   ========================================================================== */

/* Buttons minimum touch target */
.t5-btn {
    min-height: 44px;
    min-width: 44px;
    padding: var(--t5-space-3) var(--t5-space-5);
}

/* Large buttons on mobile */
.t5-btn--lg {
    min-height: 48px;
    padding: var(--t5-space-4) var(--t5-space-6);
}

/* Icon buttons touch target */
.t5-btn--icon {
    min-width: 44px;
    min-height: 44px;
    width: 44px;
    height: 44px;
}

/* Menu toggle touch target */
.t5-menu-toggle {
    min-width: 44px;
    min-height: 44px;
}

/* Form inputs touch target */
.t5-form-input {
    min-height: 44px;
}

/* FAQ summary touch target */
.t5-faq summary {
    min-height: 48px;
}

/* Nav links touch target */
.t5-nav__link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}

/* Footer links touch target */
.t5-footer__col a {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
}

/* Dashboard nav items touch target */
.t5-dashboard__nav-item {
    min-height: 44px;
}

/* ==========================================================================
   26.6 DISABLE HOVER EFFECTS ON MOBILE (Touch Devices)
   ========================================================================== */

@media (max-width: 767px) {
    /* Disable transform hovers on cards */
    .t5-feature:hover,
    .t5-proof-card:hover,
    .t5-method__step:hover,
    .t5-edge__item:hover,
    .t5-bot-feature:hover,
    .t5-faq details:hover,
    .t5-members-quick__item:hover,
    .t5-members-card:hover,
    .t5-course-card:hover,
    .t5-quick-action:hover {
        transform: none;
        box-shadow: none;
    }

    /* Disable button lift on hover */
    .t5-btn--primary:hover,
    .t5-btn--success:hover,
    .t5-btn--outline:hover {
        transform: none;
    }

    /* Keep color changes but remove transforms */
    .t5-feature:hover {
        border-color: var(--t5-border);
    }

    .t5-proof-card:hover {
        border-color: var(--t5-border);
    }

    /* Disable edge item slide effect */
    .t5-edge__item:hover {
        transform: none;
        background: var(--t5-bg-elevated);
    }

    /* Disable FAQ glow */
    .t5-faq details:hover,
    .t5-faq details[open] {
        box-shadow: none;
    }

    /* Keep open state indicator */
    .t5-faq details[open] {
        border-color: var(--t5-primary);
    }
}

/* ==========================================================================
   26.7 MOBILE-OPTIMIZED ANIMATIONS (Opacity Only)
   ========================================================================== */

@media (max-width: 767px) {
    /* Simplified fade-in - opacity only, no transforms */
    .t5-fade-in {
        opacity: 0;
        transform: none;
        transition: opacity 0.4s ease;
    }

    .t5-fade-in.visible {
        opacity: 1;
        transform: none;
    }

    /* Simplified left/right fades - opacity only */
    .t5-fade-in-left,
    .t5-fade-in-right {
        opacity: 0;
        transform: none;
        transition: opacity 0.4s ease;
    }

    .t5-fade-in-left.visible,
    .t5-fade-in-right.visible {
        opacity: 1;
        transform: none;
    }

    /* Reduce stagger delays on mobile */
    .t5-stagger > *:nth-child(1) { transition-delay: 0ms; }
    .t5-stagger > *:nth-child(2) { transition-delay: 50ms; }
    .t5-stagger > *:nth-child(3) { transition-delay: 100ms; }
    .t5-stagger > *:nth-child(4) { transition-delay: 150ms; }

    /* Simplified pulse animation */
    @keyframes pulse {
        0%, 100% { opacity: 1; }
        50% { opacity: 0.5; }
    }

    /* Pause ticker animation on mobile for performance */
    .t5-ticker__inner {
        animation-play-state: paused;
    }
}

/* ==========================================================================
   26.8 MOBILE-OPTIMIZED SHADOWS (Reduced Glows)
   ========================================================================== */

@media (max-width: 767px) {
    /* Reduce primary button shadow/glow */
    .t5-btn--primary {
        box-shadow: var(--t5-shadow-mobile-sm);
    }

    .t5-btn--success {
        box-shadow: var(--t5-shadow-mobile-sm);
    }

    /* Reduce card shadows */
    .t5-signal-preview,
    .t5-pricing-card,
    .t5-dashboard__card {
        box-shadow: var(--t5-shadow-mobile);
    }

    /* Reduce pricing card glow */
    .t5-pricing-card {
        box-shadow: 0 0 15px rgba(0, 87, 204, 0.15);
    }

    /* Reduce edge column glows */
    .t5-edge__column--problems {
        box-shadow: 0 0 15px rgba(255, 75, 75, 0.1);
    }

    .t5-edge__column--solutions {
        box-shadow: 0 0 15px rgba(31, 218, 154, 0.1);
    }

    /* Reduce hero glow size */
    .t5-hero__glow {
        width: 300px;
        height: 200px;
        filter: blur(40px);
        opacity: 0.7;
    }

    /* Reduce stat value text shadow */
    .t5-hero__stat-value {
        text-shadow: 0 0 10px var(--t5-primary-glow);
    }

    /* Reduce pricing amount text shadow */
    .t5-pricing-card__amount {
        text-shadow: 0 0 15px var(--t5-primary-glow);
    }
}

/* ==========================================================================
   26.9 CARD LAYOUTS - MOBILE FIRST
   ========================================================================== */

/* Card base - mobile first */
.t5-feature,
.t5-proof-card,
.t5-members-card,
.t5-course-card,
.t5-dashboard__card {
    padding: var(--t5-card-padding);
    border-radius: var(--t5-card-radius);
}

/* Feature cards - stack on mobile */
.t5-features {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-4);
}

/* Large phones - 2 columns */
@media (min-width: 640px) {
    .t5-features {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--t5-space-5);
    }
}

/* Desktop - 3 columns */
@media (min-width: 1024px) {
    .t5-features {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--t5-space-6);
    }
}

/* Proof cards - full width on mobile */
.t5-proofs {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-4);
}

@media (min-width: 640px) {
    .t5-proofs {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .t5-proofs {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

/* Edge columns - stack on mobile */
.t5-edge {
    grid-template-columns: 1fr;
    gap: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-edge {
        grid-template-columns: 1fr 1fr;
        gap: var(--t5-space-8);
    }
}

/* Edge column padding */
.t5-edge__column {
    padding: var(--t5-card-padding);
}

@media (min-width: 768px) {
    .t5-edge__column {
        padding: var(--t5-space-6);
    }
}

@media (min-width: 1024px) {
    .t5-edge__column {
        padding: var(--t5-space-8);
    }
}

/* Bot features - 2 columns on mobile, expand on larger */
.t5-bot-features {
    gap: var(--t5-space-3);
}

@media (min-width: 768px) {
    .t5-bot-features {
        gap: var(--t5-space-4);
    }
}

/* ==========================================================================
   26.10 HERO SECTION - MOBILE FIRST
   ========================================================================== */

.t5-hero {
    padding: 100px 0 60px;
    min-height: auto;
}

@media (min-width: 768px) {
    .t5-hero {
        padding: 120px 0 80px;
        min-height: 100vh;
    }
}

/* Hero content - full width on mobile */
.t5-hero__content {
    max-width: 100%;
}

@media (min-width: 768px) {
    .t5-hero__content {
        max-width: 600px;
    }
}

@media (min-width: 1024px) {
    .t5-hero__content {
        max-width: 700px;
    }
}

/* Hero subtitle - smaller on mobile */
.t5-hero__subtitle {
    font-size: var(--t5-text-base);
    max-width: 100%;
}

@media (min-width: 768px) {
    .t5-hero__subtitle {
        font-size: var(--t5-text-lg);
        max-width: 550px;
    }
}

/* Hero CTA - stack buttons on mobile */
.t5-hero__cta {
    flex-direction: column;
    gap: var(--t5-space-3);
}

@media (min-width: 640px) {
    .t5-hero__cta {
        flex-direction: row;
        gap: var(--t5-space-4);
    }
}

/* Hero CTA buttons - full width on mobile */
.t5-hero__cta .t5-btn {
    width: 100%;
    justify-content: center;
}

@media (min-width: 640px) {
    .t5-hero__cta .t5-btn {
        width: auto;
    }
}

/* Hero stats - smaller gap on mobile */
.t5-hero__stats {
    gap: var(--t5-space-4);
    padding-top: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-hero__stats {
        gap: var(--t5-space-6);
        padding-top: var(--t5-space-8);
    }
}

/* Hero stat values - smaller on mobile */
.t5-hero__stat-value {
    font-size: var(--t5-text-xl);
}

@media (min-width: 768px) {
    .t5-hero__stat-value {
        font-size: var(--t5-text-2xl);
    }
}

/* Hero candles - hide some on mobile for performance */
@media (max-width: 767px) {
    .t5-hero__candles {
        opacity: 0.1;
    }

    .t5-candle:nth-child(odd) {
        display: none;
    }
}

/* ==========================================================================
   26.11 PRICING CARD - MOBILE FIRST
   ========================================================================== */

.t5-pricing-card {
    padding: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-pricing-card {
        padding: var(--t5-space-8);
    }
}

@media (min-width: 1024px) {
    .t5-pricing-card {
        padding: var(--t5-space-10);
    }
}

/* Pricing amount - responsive */
.t5-pricing-card__amount {
    font-size: clamp(2.5rem, 8vw, 4rem);
}

/* ==========================================================================
   26.12 FAQ - MOBILE FIRST
   ========================================================================== */

.t5-faq summary {
    padding: var(--t5-space-4);
    font-size: var(--t5-text-sm);
}

@media (min-width: 768px) {
    .t5-faq summary {
        padding: var(--t5-space-5);
        font-size: var(--t5-text-base);
    }
}

.t5-faq__answer {
    padding: 0 var(--t5-space-4) var(--t5-space-4);
    font-size: var(--t5-text-sm);
}

@media (min-width: 768px) {
    .t5-faq__answer {
        padding: 0 var(--t5-space-5) var(--t5-space-5);
    }
}

/* ==========================================================================
   26.13 FOOTER - MOBILE FIRST
   ========================================================================== */

.t5-footer {
    padding: var(--t5-space-10) 0 var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-footer {
        padding: var(--t5-space-16) 0 var(--t5-space-8);
    }
}

/* Footer links grid - mobile first */
.t5-footer__links {
    grid-template-columns: 1fr 1fr;
    gap: var(--t5-space-6);
}

@media (min-width: 640px) {
    .t5-footer__links {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--t5-space-8);
    }
}

/* Footer column headings */
.t5-footer__col h4 {
    font-size: var(--t5-text-xs);
    margin-bottom: var(--t5-space-3);
}

@media (min-width: 768px) {
    .t5-footer__col h4 {
        font-size: var(--t5-text-sm);
        margin-bottom: var(--t5-space-4);
    }
}

/* ==========================================================================
   26.14 SIGNAL PREVIEW - MOBILE FIRST
   ========================================================================== */

.t5-signal-preview {
    max-width: 100%;
}

@media (min-width: 640px) {
    .t5-signal-preview {
        max-width: 400px;
    }
}

/* Signal preview body padding */
.t5-signal-preview__body {
    padding: var(--t5-space-4);
}

@media (min-width: 768px) {
    .t5-signal-preview__body {
        padding: var(--t5-space-5);
    }
}

/* ==========================================================================
   26.15 METHOD SECTION - MOBILE FIRST
   ========================================================================== */

.t5-method {
    gap: var(--t5-space-8);
}

@media (min-width: 1024px) {
    .t5-method {
        gap: var(--t5-space-12);
    }
}

/* Method steps - smaller padding on mobile */
.t5-method__step {
    padding: var(--t5-space-4);
    gap: var(--t5-space-4);
}

@media (min-width: 768px) {
    .t5-method__step {
        padding: var(--t5-space-5);
        gap: var(--t5-space-5);
    }
}

/* ==========================================================================
   26.16 CTA SECTION - MOBILE FIRST
   ========================================================================== */

.t5-cta {
    padding: var(--t5-space-8);
}

@media (min-width: 768px) {
    .t5-cta {
        padding: var(--t5-space-10);
    }
}

@media (min-width: 1024px) {
    .t5-cta {
        padding: var(--t5-space-12);
    }
}

/* ==========================================================================
   26.17 DASHBOARD - MOBILE FIRST
   ========================================================================== */

/* Dashboard main padding */
.t5-dashboard__main {
    padding: var(--t5-space-4);
}

@media (min-width: 768px) {
    .t5-dashboard__main {
        padding: var(--t5-space-6);
    }
}

@media (min-width: 1024px) {
    .t5-dashboard__main {
        padding: var(--t5-space-8);
    }
}

/* Dashboard stats grid */
.t5-dashboard__stats {
    grid-template-columns: 1fr;
    gap: var(--t5-space-3);
}

@media (min-width: 480px) {
    .t5-dashboard__stats {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .t5-dashboard__stats {
        grid-template-columns: repeat(4, 1fr);
        gap: var(--t5-space-4);
    }
}

/* Stat card - smaller on mobile */
.t5-stat-card {
    padding: var(--t5-space-4);
    gap: var(--t5-space-3);
}

@media (min-width: 768px) {
    .t5-stat-card {
        padding: var(--t5-space-5);
        gap: var(--t5-space-4);
    }
}

/* Stat card icon - smaller on mobile */
.t5-stat-card__icon {
    width: 36px;
    height: 36px;
}

@media (min-width: 768px) {
    .t5-stat-card__icon {
        width: 44px;
        height: 44px;
    }
}

/* Stat card value - smaller on mobile */
.t5-stat-card__value {
    font-size: var(--t5-text-lg);
}

@media (min-width: 768px) {
    .t5-stat-card__value {
        font-size: var(--t5-text-xl);
    }
}

/* Quick actions - single column on mobile */
.t5-quick-actions {
    grid-template-columns: 1fr;
    gap: var(--t5-space-2);
}

@media (min-width: 480px) {
    .t5-quick-actions {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--t5-space-3);
    }
}

/* ==========================================================================
   26.18 AUTH PAGES - MOBILE FIRST
   ========================================================================== */

.t5-auth {
    padding: 16px;
}

@media (min-width: 768px) {
    .t5-auth {
        padding: var(--t5-space-8);
    }
}

.t5-auth__card {
    padding: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-auth__card {
        padding: var(--t5-space-8);
    }
}

@media (min-width: 1024px) {
    .t5-auth__card {
        padding: var(--t5-space-10);
    }
}

/* ==========================================================================
   26.19 LEGAL PAGES - MOBILE FIRST
   ========================================================================== */

.t5-legal {
    padding: var(--t5-space-12) 0;
}

@media (min-width: 768px) {
    .t5-legal {
        padding: var(--t5-space-16) 0;
    }
}

@media (min-width: 1024px) {
    .t5-legal {
        padding: var(--t5-space-20) 0;
    }
}

.t5-legal__header h1 {
    font-size: clamp(1.75rem, 5vw, 2.5rem);
}

/* ==========================================================================
   26.20 MEMBERS AREA - MOBILE FIRST
   ========================================================================== */

.t5-members-hero {
    padding: var(--t5-space-12) 0 var(--t5-space-8);
}

@media (min-width: 768px) {
    .t5-members-hero {
        padding: var(--t5-space-16) 0 var(--t5-space-12);
    }
}

@media (min-width: 1024px) {
    .t5-members-hero {
        padding: var(--t5-space-20) 0 var(--t5-space-12);
    }
}

.t5-members-hero h1 {
    font-size: clamp(1.75rem, 5vw, 2.5rem);
}

/* Members quick links - stack on mobile */
.t5-members-quick {
    grid-template-columns: 1fr;
    gap: var(--t5-space-3);
}

@media (min-width: 640px) {
    .t5-members-quick {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--t5-space-4);
    }
}

@media (min-width: 1024px) {
    .t5-members-quick {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

/* Members grid */
.t5-members-grid {
    grid-template-columns: 1fr;
    gap: var(--t5-space-4);
}

@media (min-width: 640px) {
    .t5-members-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--t5-space-6);
    }
}

@media (min-width: 1024px) {
    .t5-members-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

/* ==========================================================================
   26.21 ERROR & PASSWORD PAGES - MOBILE FIRST
   ========================================================================== */

.t5-error-page__code {
    font-size: clamp(4rem, 15vw, 8rem);
}

.t5-password-form {
    padding: var(--t5-space-6);
}

@media (min-width: 768px) {
    .t5-password-form {
        padding: var(--t5-space-10);
    }
}

/* ==========================================================================
   26.22 UTILITY CLASSES - MOBILE FIRST
   ========================================================================== */

/* Hide on mobile, show on tablet+ */
.t5-hide-mobile {
    display: none !important;
}

@media (min-width: 768px) {
    .t5-hide-mobile {
        display: block !important;
    }
}

/* Show on mobile, hide on tablet+ */
.t5-show-mobile {
    display: block !important;
}

@media (min-width: 768px) {
    .t5-show-mobile {
        display: none !important;
    }
}

/* Hide on mobile and tablet, show on desktop */
.t5-hide-tablet {
    display: none !important;
}

@media (min-width: 1024px) {
    .t5-hide-tablet {
        display: block !important;
    }
}

/* Text alignment utilities - mobile first */
.t5-text-center-mobile {
    text-align: center;
}

@media (min-width: 768px) {
    .t5-text-center-mobile {
        text-align: left;
    }
}

/* Full width on mobile utility */
.t5-full-mobile {
    width: 100%;
}

@media (min-width: 640px) {
    .t5-full-mobile {
        width: auto;
    }
}

/* ==========================================================================
   26.23 PRINT STYLES
   ========================================================================== */

@media print {
    .t5-header,
    .t5-footer,
    .t5-nav,
    .t5-btn,
    .t5-hero__bg,
    .t5-hero__candles,
    .t5-hero__glow,
    .t5-ticker-wrapper {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }

    .t5-container {
        max-width: 100%;
        padding: 0;
    }

    .t5-section {
        padding: 20px 0;
    }
}

/* ==========================================================================
   26.24 RTD BEST PRACTICE - TOUCH TARGETS & MOBILE INTERACTIONS
   ========================================================================== */

/* Ensure minimum 44x44px touch targets on mobile */
@media (max-width: 767px) {
    /* Dashboard navigation items */
    .t5-dashboard__nav-item {
        min-height: 48px;
        padding: 12px 16px;
    }

    /* Dashboard menu toggle */
    .t5-dashboard__menu-toggle {
        width: 44px;
        height: 44px;
    }

    /* Quick action buttons */
    .t5-quick-action {
        min-height: 56px;
        padding: 12px;
    }

    /* Course cards - larger touch target */
    .t5-course-card {
        padding: 16px;
    }

    /* Prop firm list items */
    .t5-propfirm-item {
        min-height: 80px;
        padding: 14px 16px;
    }

    /* Resource links */
    .t5-resource-list a {
        min-height: 48px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 10px 0;
    }

    /* Form inputs */
    .t5-form-input,
    input[type="text"],
    input[type="email"],
    input[type="password"] {
        min-height: 48px;
        padding: 12px 16px;
    }

    /* Select elements */
    select {
        min-height: 48px;
    }

    /* Checkboxes and radio buttons - larger touch area */
    input[type="checkbox"],
    input[type="radio"] {
        width: 20px;
        height: 20px;
    }

    /* Auth options */
    .t5-auth__remember,
    .t5-auth__forgot {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
}

/* ==========================================================================
   26.25 RTD BEST PRACTICE - DISABLE HOVER ON MOBILE
   ========================================================================== */

@media (max-width: 767px) {
    /* Disable all transform hovers on mobile */
    .t5-propfirm-card:hover,
    .t5-course-card:hover,
    .t5-dashboard__card:hover,
    .t5-stat-card:hover,
    .t5-quick-action:hover,
    .t5-market:hover,
    .t5-propfirm-item:hover {
        transform: none;
        box-shadow: none;
    }

    /* Disable border-color hover changes */
    .t5-quick-action:hover,
    .t5-course-card:hover {
        border-color: var(--t5-border);
    }

    /* Disable table row hover */
    .t5-table tr:hover td,
    .t5-comparison-table tr:hover td {
        background: transparent;
    }

    /* Disable nav item hover background */
    .t5-dashboard__nav-item:hover {
        background: transparent;
        color: var(--t5-text-secondary);
    }

    .t5-dashboard__nav-item.active:hover {
        background: var(--t5-primary);
        color: white;
    }
}

/* ==========================================================================
   26.26 RTD BEST PRACTICE - COURSE CARDS MOBILE
   ========================================================================== */

.t5-course-card {
    padding: 16px;
    border-radius: 12px;
}

@media (min-width: 768px) {
    .t5-course-card {
        padding: var(--t5-space-6);
        border-radius: var(--t5-radius-xl);
    }
}

.t5-course-card h3 {
    font-size: 16px;
    margin-bottom: 8px;
}

@media (min-width: 768px) {
    .t5-course-card h3 {
        font-size: var(--t5-text-lg);
        margin-bottom: var(--t5-space-3);
    }
}

.t5-course-card p {
    font-size: 13px;
    margin-bottom: 12px;
}

@media (min-width: 768px) {
    .t5-course-card p {
        font-size: var(--t5-text-sm);
        margin-bottom: var(--t5-space-4);
    }
}

.t5-course-card ul {
    font-size: 13px;
}

@media (min-width: 768px) {
    .t5-course-card ul {
        font-size: var(--t5-text-sm);
    }
}

.t5-course-card__badge {
    font-size: 10px;
    padding: 4px 8px;
}

@media (min-width: 768px) {
    .t5-course-card__badge {
        font-size: var(--t5-text-xs);
        padding: var(--t5-space-1) var(--t5-space-3);
    }
}

/* Course grid - single column on small mobile */
.t5-course-grid {
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 640px) {
    .t5-course-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--t5-space-4);
    }
}

@media (min-width: 1024px) {
    .t5-course-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: var(--t5-space-6);
    }
}

/* ==========================================================================
   26.27 RTD BEST PRACTICE - FOOTER MOBILE (WHITE THEME)
   ========================================================================== */

/* Footer mobile adjustments are now in main Section 17 */

/* ==========================================================================
   26.27a PRICING SECTION - GLOWING GLOBE BACKGROUND
   ========================================================================== */

.t5-pricing-section {
    position: relative;
    overflow: hidden;
}

.t5-pricing-section__globe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 800px;
    pointer-events: none;
    z-index: 0;
}

@media (min-width: 768px) {
    .t5-pricing-section__globe {
        width: 1000px;
        height: 1000px;
    }
}

@media (min-width: 1024px) {
    .t5-pricing-section__globe {
        width: 1200px;
        height: 1200px;
    }
}

/* Globe SVG styling */
.t5-pricing-section__globe svg {
    width: 100%;
    height: 100%;
    opacity: 0.6;
}

/* Globe glow effect */
.t5-pricing-section__globe-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
    height: 60%;
    background: radial-gradient(
        ellipse at center,
        rgba(0, 87, 204, 0.25) 0%,
        rgba(0, 87, 204, 0.15) 30%,
        rgba(0, 87, 204, 0.05) 60%,
        transparent 80%
    );
    filter: blur(40px);
    animation: globePulse 4s ease-in-out infinite;
}

@keyframes globePulse {
    0%, 100% {
        opacity: 0.6;
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        opacity: 0.8;
        transform: translate(-50%, -50%) scale(1.05);
    }
}

/* Ensure pricing content is above globe */
.t5-pricing-section .t5-container {
    position: relative;
    z-index: 1;
}

/* Center pricing card in the globe */
.t5-pricing-section .t5-section-header {
    margin-bottom: var(--t5-space-8);
}

.t5-pricing-section .t5-pricing {
    max-width: 440px;
    margin: 0 auto;
}

.t5-pricing-section .t5-pricing-card {
    background: rgba(17, 24, 39, 0.95);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 87, 204, 0.4);
    box-shadow:
        0 0 60px rgba(0, 87, 204, 0.2),
        0 20px 50px rgba(0, 0, 0, 0.5);
}

.t5-footer__bottom {
    flex-direction: column;
    gap: 12px;
    text-align: center;
    padding-top: 16px;
}

@media (min-width: 640px) {
    .t5-footer__bottom {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
        padding-top: var(--t5-space-6);
    }
}

.t5-footer__legal {
    gap: 16px;
}

@media (min-width: 768px) {
    .t5-footer__legal {
        gap: var(--t5-space-6);
    }
}

.t5-footer__legal a {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
}

@media (min-width: 768px) {
    .t5-footer__legal a {
        min-height: auto;
    }
}

/* ==========================================================================
   26.28 RTD BEST PRACTICE - DASHBOARD CARDS MOBILE
   ========================================================================== */

.t5-dashboard__card {
    padding: 16px;
    border-radius: 12px;
}

@media (min-width: 768px) {
    .t5-dashboard__card {
        padding: var(--t5-space-6);
        border-radius: var(--t5-radius-xl);
    }
}

.t5-dashboard__card h3 {
    font-size: 15px;
    margin-bottom: 14px;
    padding-bottom: 10px;
}

@media (min-width: 768px) {
    .t5-dashboard__card h3 {
        font-size: var(--t5-text-lg);
        margin-bottom: var(--t5-space-5);
        padding-bottom: var(--t5-space-3);
    }
}

/* Resource list mobile */
.t5-resource-list li {
    padding: 10px 0;
    min-height: 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@media (min-width: 768px) {
    .t5-resource-list li {
        padding: var(--t5-space-3) 0;
        min-height: auto;
    }
}

/* Prop firm list item mobile */
.t5-propfirm-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 14px;
}

@media (min-width: 640px) {
    .t5-propfirm-item {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: var(--t5-space-4);
        padding: var(--t5-space-4);
    }
}

/* ==========================================================================
   26.29 RTD BEST PRACTICE - AUTH PAGE MOBILE
   ========================================================================== */

.t5-auth__container {
    padding: 0;
}

.t5-auth__header h1 {
    font-size: 22px;
}

@media (min-width: 768px) {
    .t5-auth__header h1 {
        font-size: var(--t5-text-2xl);
    }
}

.t5-auth__form {
    gap: 16px;
}

@media (min-width: 768px) {
    .t5-auth__form {
        gap: var(--t5-space-5);
    }
}

.t5-auth__options {
    flex-direction: column;
    gap: 12px;
}

@media (min-width: 480px) {
    .t5-auth__options {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: var(--t5-space-4);
    }
}

.t5-auth__submit {
    min-height: 48px;
}

/* ==========================================================================
   26.30 RTD BEST PRACTICE - PROP FIRMS PAGE MOBILE
   ========================================================================== */

/* Table scroll indicator for mobile */
.t5-comparison-table-wrapper {
    position: relative;
}

.t5-comparison-table-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40px;
    background: linear-gradient(to right, transparent, rgba(var(--t5-bg-dark-rgb), 0.8));
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.3s ease;
}

@media (min-width: 900px) {
    .t5-comparison-table-wrapper::after {
        display: none;
    }
}

/* ==========================================================================
   26.31 RTD BEST PRACTICE - DISCLAIMER & LEGAL BOXES MOBILE
   ========================================================================== */

.t5-disclaimer-box {
    padding: 16px;
    border-radius: 10px;
    margin: 24px 0;
}

@media (min-width: 768px) {
    .t5-disclaimer-box {
        padding: var(--t5-space-6);
        border-radius: var(--t5-radius-lg);
        margin: var(--t5-space-8) 0;
    }
}

.t5-disclaimer-box h3 {
    font-size: 15px;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .t5-disclaimer-box h3 {
        font-size: var(--t5-text-lg);
        margin-bottom: var(--t5-space-3);
    }
}

.t5-disclaimer-box p {
    font-size: 14px;
    line-height: 1.6;
}

@media (min-width: 768px) {
    .t5-disclaimer-box p {
        font-size: var(--t5-text-base);
    }
}

/* Legal content mobile */
.t5-legal__content {
    font-size: 14px;
    line-height: 1.7;
}

@media (min-width: 768px) {
    .t5-legal__content {
        font-size: var(--t5-text-base);
        line-height: 1.8;
    }
}

.t5-legal__content h2 {
    font-size: 18px;
    margin-top: 28px;
    margin-bottom: 14px;
}

@media (min-width: 768px) {
    .t5-legal__content h2 {
        font-size: var(--t5-text-xl);
        margin-top: var(--t5-space-10);
        margin-bottom: var(--t5-space-4);
    }
}

.t5-legal__content h3 {
    font-size: 16px;
    margin-top: 20px;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .t5-legal__content h3 {
        font-size: var(--t5-text-lg);
        margin-top: var(--t5-space-6);
        margin-bottom: var(--t5-space-3);
    }
}

.t5-legal__content ul,
.t5-legal__content ol {
    padding-left: 20px;
}

@media (min-width: 768px) {
    .t5-legal__content ul,
    .t5-legal__content ol {
        padding-left: var(--t5-space-8);
    }
}

.t5-legal__content li {
    margin-bottom: 8px;
}

@media (min-width: 768px) {
    .t5-legal__content li {
        margin-bottom: var(--t5-space-2);
    }
}

.t5-legal__acceptance {
    padding: 16px;
    background: var(--t5-bg-card);
    border-radius: 10px;
    margin-top: 32px;
    text-align: center;
}

@media (min-width: 768px) {
    .t5-legal__acceptance {
        padding: var(--t5-space-6);
        border-radius: var(--t5-radius-lg);
        margin-top: var(--t5-space-10);
    }
}

/* ==========================================================================
   26.32 RTD BEST PRACTICE - 404 PAGE MOBILE
   ========================================================================== */

.t5-error-page {
    padding: 100px 20px 60px;
    text-align: center;
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (min-width: 768px) {
    .t5-error-page {
        padding: 150px 0 80px;
    }
}

.t5-error-page__code {
    font-size: clamp(5rem, 20vw, 10rem);
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--t5-gold) 0%, var(--t5-primary-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .t5-error-page__code {
        margin-bottom: var(--t5-space-6);
    }
}

.t5-error-page h1 {
    font-size: clamp(1.5rem, 5vw, 2.5rem);
    margin-bottom: 12px;
}

@media (min-width: 768px) {
    .t5-error-page h1 {
        margin-bottom: var(--t5-space-4);
    }
}

.t5-error-page p {
    font-size: 14px;
    color: var(--t5-text-secondary);
    margin-bottom: 24px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .t5-error-page p {
        font-size: var(--t5-text-base);
        margin-bottom: var(--t5-space-8);
    }
}

.t5-error-page .t5-btn {
    min-height: 48px;
}

@media (min-width: 768px) {
    .t5-error-page .t5-btn {
        min-height: 44px;
    }
}

/* ==========================================================================
   26.33 MOBILE SLIDE-OUT NAV (RTD STYLE)
   ========================================================================== */

.t5-mobile-nav {
    position: fixed;
    inset: 0;
    z-index: 2000;
    pointer-events: none;
    visibility: hidden;
}

.t5-mobile-nav.active {
    pointer-events: auto;
    visibility: visible;
}

/* Overlay */
.t5-mobile-nav__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.t5-mobile-nav.active .t5-mobile-nav__overlay {
    opacity: 1;
}

/* Panel */
.t5-mobile-nav__panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 320px;
    background: var(--t5-bg-card);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: -10px 0 40px rgba(0, 0, 0, 0.3);
}

.t5-mobile-nav.active .t5-mobile-nav__panel {
    transform: translateX(0);
}

/* Header */
.t5-mobile-nav__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--t5-border);
}

.t5-mobile-nav__tagline {
    font-size: 14px;
    font-weight: 600;
    color: var(--t5-gold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.t5-mobile-nav__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--t5-bg-elevated);
    border: 1px solid var(--t5-border);
    border-radius: 10px;
    color: var(--t5-text-primary);
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.t5-mobile-nav__close:hover {
    background: var(--t5-bg-dark);
    border-color: var(--t5-text-muted);
}

/* Body */
.t5-mobile-nav__body {
    flex: 1;
    padding: 24px;
    overflow-y: auto;
}

.t5-mobile-nav__links {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
}

.t5-mobile-nav__links li {
    margin-bottom: 4px;
}

.t5-mobile-nav__links a {
    display: flex;
    align-items: center;
    padding: 14px 16px;
    font-size: 16px;
    font-weight: 500;
    color: var(--t5-text-primary);
    border-radius: 10px;
    transition: background 0.2s ease, color 0.2s ease;
}

.t5-mobile-nav__links a:hover {
    background: var(--t5-bg-elevated);
    color: var(--t5-gold);
}

.t5-mobile-nav__account {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    font-size: 15px;
    font-weight: 500;
    color: var(--t5-text-secondary);
    border-radius: 10px;
    border: 1px solid var(--t5-border);
    transition: all 0.2s ease;
}

.t5-mobile-nav__account:hover {
    background: var(--t5-bg-elevated);
    border-color: var(--t5-primary);
    color: var(--t5-text-primary);
}

/* Footer */
.t5-mobile-nav__footer {
    padding: 24px;
    border-top: 1px solid var(--t5-border);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.t5-mobile-nav__telegram {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px;
    font-size: 15px;
    font-weight: 500;
    color: var(--t5-text-secondary);
    background: var(--t5-bg-elevated);
    border-radius: 10px;
    transition: all 0.2s ease;
}

.t5-mobile-nav__telegram:hover {
    background: #0088cc;
    color: white;
}

.t5-mobile-nav__telegram svg {
    color: #0088cc;
    transition: color 0.2s ease;
}

.t5-mobile-nav__telegram:hover svg {
    color: white;
}

/* Hide on desktop */
@media (min-width: 768px) {
    .t5-mobile-nav {
        display: none;
    }
}

/* ==========================================================================
   AUTH PAGES (Login, Reset Password)
   ========================================================================== */

.t5-auth-page {
    min-height: 100vh;
    background: var(--t5-bg-dark);
    display: flex;
    align-items: center;
    justify-content: center;
}

.t5-auth {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--t5-space-6);
    background:
        radial-gradient(ellipse at 50% 0%, rgba(0, 87, 204, 0.08) 0%, transparent 50%),
        var(--t5-bg-dark);
}

.t5-auth__container {
    width: 100%;
    max-width: 420px;
}

.t5-auth__logo {
    display: flex;
    justify-content: center;
    margin-bottom: var(--t5-space-8);
}

.t5-auth__logo img {
    height: 48px;
    width: auto;
}

.t5-auth__card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-8);
    box-shadow: var(--t5-shadow-lg);
}

.t5-auth__header {
    text-align: center;
    margin-bottom: var(--t5-space-6);
}

.t5-auth__header h1 {
    font-size: var(--t5-text-2xl);
    margin-bottom: var(--t5-space-2);
}

.t5-auth__header p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    margin: 0;
}

.t5-auth__form {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-5);
}

.t5-auth__options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--t5-text-sm);
}

.t5-auth__remember {
    display: flex;
    align-items: center;
    gap: var(--t5-space-2);
    color: var(--t5-text-secondary);
    cursor: pointer;
}

.t5-auth__remember input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--t5-primary);
    cursor: pointer;
}

.t5-auth__forgot {
    color: var(--t5-primary-light);
    font-size: var(--t5-text-sm);
}

.t5-auth__forgot:hover {
    text-decoration: underline;
}

.t5-auth__submit {
    margin-top: var(--t5-space-2);
}

.t5-auth__footer {
    text-align: center;
    margin-top: var(--t5-space-6);
    padding-top: var(--t5-space-6);
    border-top: 1px solid var(--t5-border);
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
}

.t5-auth__footer a {
    color: var(--t5-primary-light);
    font-weight: 500;
}

.t5-auth__footer a:hover {
    text-decoration: underline;
}

/* Form Elements */
.t5-form-group {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-2);
}

.t5-form-group label {
    font-size: var(--t5-text-sm);
    font-weight: 500;
    color: var(--t5-text-primary);
}

.t5-form-input {
    width: 100%;
    padding: var(--t5-space-3) var(--t5-space-4);
    background: var(--t5-bg-input);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius);
    color: var(--t5-text-primary);
    font-size: var(--t5-text-base);
    font-family: var(--t5-font);
    transition: var(--t5-transition-fast);
}

.t5-form-input::placeholder {
    color: var(--t5-text-muted);
}

.t5-form-input:focus {
    outline: none;
    border-color: var(--t5-primary);
    box-shadow: 0 0 0 3px rgba(0, 87, 204, 0.15);
}

.t5-form-input:hover:not(:focus) {
    border-color: var(--t5-text-muted);
}

/* Alert Messages */
.t5-alert {
    padding: var(--t5-space-4);
    border-radius: var(--t5-radius);
    font-size: var(--t5-text-sm);
    margin-bottom: var(--t5-space-4);
}

.t5-alert--error {
    background: rgba(255, 75, 75, 0.1);
    border: 1px solid rgba(255, 75, 75, 0.3);
    color: var(--t5-red-light);
}

.t5-alert--success {
    background: rgba(31, 218, 154, 0.1);
    border: 1px solid rgba(31, 218, 154, 0.3);
    color: var(--t5-green-light);
}

/* ==========================================================================
   ENHANCED MOBILE RESPONSIVENESS
   ========================================================================== */

/* Mobile-first improvements */
@media (max-width: 767px) {
    /* Hero Section Mobile */
    .t5-hero {
        padding-top: 100px;
        padding-bottom: 0;
        min-height: auto;
    }

    .t5-hero__content {
        padding-bottom: var(--t5-space-10);
    }

    .t5-hero h1 {
        font-size: clamp(1.75rem, 7vw, 2.5rem);
        line-height: 1.2;
        margin-bottom: var(--t5-space-4);
    }

    .t5-hero__subtitle {
        font-size: var(--t5-text-base);
        line-height: 1.6;
        margin-bottom: var(--t5-space-3);
    }

    .t5-hero__tagline {
        font-size: var(--t5-text-sm);
        margin-bottom: var(--t5-space-6);
    }

    .t5-hero__cta {
        flex-direction: column;
        gap: var(--t5-space-3);
    }

    .t5-hero__cta .t5-btn {
        width: 100%;
        justify-content: center;
    }

    /* Ticker spacing on mobile */
    .t5-ticker-wrapper {
        margin-top: var(--t5-space-8);
        padding: var(--t5-space-3) 0;
    }

    /* Sections Mobile */
    .t5-section {
        padding: var(--t5-space-12) 0;
    }

    .t5-section-header {
        margin-bottom: var(--t5-space-8);
    }

    .t5-section-header h2 {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }

    /* Signal Card Mobile */
    .t5-signal-card {
        border-radius: var(--t5-radius-lg);
    }

    .t5-signals-grid {
        grid-template-columns: 1fr;
        gap: var(--t5-space-10);
    }

    .t5-signals-left {
        text-align: left;
        order: 1;
    }

    .t5-signals-right {
        order: 2;
        justify-content: center;
    }

    .t5-signals-right .t5-signal-card {
        max-width: 100%;
    }

    .t5-signals-steps {
        text-align: left;
    }

    /* Proof Cards Mobile */
    .t5-proofs {
        grid-template-columns: 1fr;
        gap: var(--t5-space-4);
    }

    .t5-proof-card {
        max-width: 100%;
    }

    /* Features Mobile */
    .t5-features {
        grid-template-columns: 1fr;
        gap: var(--t5-space-4);
    }

    .t5-feature {
        padding: var(--t5-space-5);
    }

    /* Edge Section Mobile */
    .t5-edge {
        grid-template-columns: 1fr;
        gap: var(--t5-space-6);
    }

    .t5-edge__column {
        padding: var(--t5-space-5);
    }

    /* Bot Features Mobile */
    .t5-bot-features {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--t5-space-3);
    }

    .t5-bot-feature {
        padding: var(--t5-space-4);
    }

    /* Pricing Mobile */
    .t5-pricing-card {
        padding: var(--t5-space-6);
    }

    .t5-pricing-card__amount {
        font-size: 3rem;
    }

    /* FAQ Mobile */
    .t5-faq details summary {
        padding: var(--t5-space-4);
        font-size: var(--t5-text-base);
    }

    .t5-faq__answer {
        padding: 0 var(--t5-space-4) var(--t5-space-4);
    }

    /* CTA Mobile */
    .t5-cta {
        padding: var(--t5-space-8);
        border-radius: var(--t5-radius-lg);
    }

    .t5-cta h2 {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }

    /* Footer Mobile */
    .t5-footer__top {
        flex-direction: column;
        gap: var(--t5-space-8);
        text-align: center;
    }

    .t5-footer__links {
        flex-direction: column;
        gap: var(--t5-space-6);
    }

    .t5-footer__col {
        text-align: center;
    }

    .t5-footer__col ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--t5-space-4);
    }

    .t5-footer__col li {
        margin-bottom: 0;
    }
}

/* Touch-friendly tap targets */
@media (max-width: 767px) {
    .t5-btn {
        min-height: 48px;
        padding: var(--t5-space-3) var(--t5-space-5);
    }

    .t5-btn--lg {
        min-height: 52px;
        padding: var(--t5-space-4) var(--t5-space-6);
    }

    .t5-nav__link {
        min-height: 48px;
        display: flex;
        align-items: center;
    }

    .t5-form-input {
        min-height: 48px;
        font-size: 16px; /* Prevents iOS zoom */
    }
}

/* Small phones */
@media (max-width: 374px) {
    .t5-container {
        padding: 0 var(--t5-space-3);
    }

    .t5-hero h1 {
        font-size: 1.5rem;
    }

    .t5-bot-features {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   VISUAL POLISH & MICRO-INTERACTIONS
   ========================================================================== */

/* Enhanced button hover states */
.t5-btn {
    position: relative;
    overflow: hidden;
}

.t5-btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.1), transparent);
    transform: translateX(-100%);
    transition: transform 0.5s ease;
}

.t5-btn:hover::after {
    transform: translateX(100%);
}

/* Card hover effects */
.t5-proof-card,
.t5-feature,
.t5-pricing-card,
.t5-signal-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

@media (min-width: 768px) {
    .t5-proof-card:hover,
    .t5-feature:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
    }

    .t5-pricing-card:hover {
        transform: translateY(-8px);
        box-shadow: var(--t5-glow-primary), 0 20px 60px rgba(0, 0, 0, 0.5);
    }
}

/* Smooth focus states for accessibility */
.t5-btn:focus-visible,
.t5-form-input:focus-visible,
.t5-nav__link:focus-visible {
    outline: 2px solid var(--t5-primary);
    outline-offset: 2px;
}

/* Enhanced FAQ accordion */
.t5-faq details {
    transition: background 0.2s ease;
}

.t5-faq details[open] {
    background: var(--t5-bg-elevated);
}

.t5-faq details summary {
    transition: color 0.2s ease, background 0.2s ease;
}

.t5-faq details summary:hover {
    color: var(--t5-primary-light);
}

/* Signal card glow effect */
.t5-signal-card {
    position: relative;
}


/* Smooth text gradient animation */
.t5-text-gradient {
    background-size: 200% auto;
    animation: gradientShift 3s ease infinite;
}

@keyframes gradientShift {
    0%, 100% { background-position: 0% center; }
    50% { background-position: 100% center; }
}


/* Loading state for buttons */
.t5-btn--loading {
    position: relative;
    color: transparent !important;
    pointer-events: none;
}

.t5-btn--loading::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Scroll indicator - REMOVED */

/* Image loading placeholder */
.t5-proof-card__image img {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.t5-proof-card__image img.loaded {
    opacity: 1;
}

/* Gold accent color variable */
:root {
    --t5-gold: #D4AF37;
    --t5-gold-light: #E5C158;
    --t5-gold-glow: rgba(212, 175, 55, 0.3);
}

/* ==========================================================================
   SUBTLE ANIMATIONS (No glow)
   ========================================================================== */

/* 1. FLOATING CARD - Gentle movement */
.t5-float {
    animation: floatCard 5s ease-in-out infinite;
}

@keyframes floatCard {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

.t5-float:hover {
    animation-play-state: paused;
}

/* 2. STAGGER REVEAL - Cards appear sequentially */
.t5-stagger > *:nth-child(1) { transition-delay: 0ms; }
.t5-stagger > *:nth-child(2) { transition-delay: 100ms; }
.t5-stagger > *:nth-child(3) { transition-delay: 200ms; }
.t5-stagger > *:nth-child(4) { transition-delay: 300ms; }

/* 3. LIVE DOT - Simple blink, no glow */
.t5-live-dot {
    width: 8px;
    height: 8px;
    background: var(--t5-green);
    border-radius: 50%;
    animation: dotBlink 2s ease-in-out infinite;
}

@keyframes dotBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* 4. CARD LIFT - Simple hover lift */
.t5-lift {
    transition: transform 0.3s ease;
}

.t5-lift:hover {
    transform: translateY(-4px);
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
    .t5-float,
    .t5-live-dot {
        animation: none;
    }
}

/* ==========================================================================
   404 ERROR PAGE
   ========================================================================== */

.t5-error-page {
    min-height: calc(100vh - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--t5-space-16) var(--t5-space-4);
    background:
        radial-gradient(ellipse at 50% 30%, rgba(0, 87, 204, 0.06) 0%, transparent 60%),
        var(--t5-bg-dark);
}

.t5-error-page__code {
    font-size: clamp(6rem, 20vw, 12rem);
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--t5-primary) 0%, var(--t5-primary-light) 50%, var(--t5-text-muted) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: var(--t5-space-4);
    animation: errorPulse 3s ease-in-out infinite;
}

@keyframes errorPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(0.98); }
}

.t5-error-page h1 {
    font-size: clamp(1.5rem, 4vw, 2.5rem);
    margin-bottom: var(--t5-space-4);
}

.t5-error-page p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-lg);
    max-width: 400px;
    margin: 0 auto var(--t5-space-8);
}

/* ==========================================================================
   THANK YOU PAGE
   ========================================================================== */

.t5-thank-you {
    min-height: calc(100vh - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--t5-space-16) var(--t5-space-4);
    background:
        radial-gradient(ellipse at 50% 30%, rgba(31, 218, 154, 0.06) 0%, transparent 60%),
        var(--t5-bg-dark);
}

.t5-thank-you__icon {
    width: 100px;
    height: 100px;
    margin: 0 auto var(--t5-space-6);
    background: rgba(31, 218, 154, 0.15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--t5-green);
    animation: checkmarkPop 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes checkmarkPop {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); opacity: 1; }
}

.t5-thank-you h1 {
    font-size: clamp(1.75rem, 5vw, 2.5rem);
    margin-bottom: var(--t5-space-4);
}

.t5-thank-you p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-lg);
    max-width: 500px;
    margin: 0 auto var(--t5-space-6);
}

.t5-thank-you__next {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    padding: var(--t5-space-6);
    max-width: 400px;
    margin: 0 auto var(--t5-space-8);
}

.t5-thank-you__next h3 {
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-4);
}

.t5-thank-you__steps {
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-3);
}

.t5-thank-you__step {
    display: flex;
    align-items: flex-start;
    gap: var(--t5-space-3);
    font-size: var(--t5-text-sm);
    color: var(--t5-text-secondary);
}

.t5-thank-you__step-num {
    min-width: 24px;
    height: 24px;
    background: var(--t5-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--t5-text-xs);
    font-weight: 600;
}

/* ==========================================================================
   SIGNAL CARD COMPONENT
   ========================================================================== */

.t5-signal-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    overflow: hidden;
    box-shadow: var(--t5-shadow-lg);
}

.t5-signal-card__header {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    padding: var(--t5-space-4);
    background: var(--t5-bg-elevated);
    border-bottom: 1px solid var(--t5-border);
}

.t5-signal-card__header img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

.t5-signal-card__header strong {
    display: block;
    font-size: var(--t5-text-sm);
    color: var(--t5-text-primary);
}

.t5-signal-card__header span {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
}

.t5-signal-card__body {
    padding: var(--t5-space-5);
}

.t5-signal-card__pair {
    font-size: var(--t5-text-xl);
    font-weight: 700;
    margin-bottom: var(--t5-space-4);
}

.t5-signal-card__type {
    display: inline-block;
    padding: var(--t5-space-1) var(--t5-space-3);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: var(--t5-text-xs);
    font-weight: 700;
    border-radius: var(--t5-radius);
    margin-left: var(--t5-space-2);
    vertical-align: middle;
}

.t5-signal-card__type--sell {
    background: var(--t5-red);
    color: white;
}

.t5-signal-card__levels {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--t5-space-3);
}

.t5-signal-card__levels > div {
    padding: var(--t5-space-3);
    background: var(--t5-bg-elevated);
    border-radius: var(--t5-radius);
}

.t5-signal-card__levels span {
    display: block;
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin-bottom: var(--t5-space-1);
}

.t5-signal-card__levels strong {
    font-family: var(--t5-font-mono);
    font-size: var(--t5-text-sm);
}

.t5-green { color: var(--t5-green); }
.t5-red { color: var(--t5-red); }

/* ==========================================================================
   SIGNALS SECTION GRID
   ========================================================================== */

.t5-signals-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-12);
    align-items: center;
}

@media (min-width: 1024px) {
    .t5-signals-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--t5-space-16);
    }
}

.t5-signals-left h2 {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    margin-bottom: var(--t5-space-4);
}

.t5-signals-left > p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-8);
}

.t5-signals-steps {
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-5);
}

.t5-signals-step {
    display: flex;
    gap: var(--t5-space-4);
    align-items: flex-start;
}

.t5-signals-step__num {
    min-width: 36px;
    height: 36px;
    background: var(--t5-primary);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: var(--t5-text-sm);
}

.t5-signals-step strong {
    display: block;
    color: var(--t5-text-primary);
    margin-bottom: var(--t5-space-1);
}

.t5-signals-step p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    margin: 0;
}

.t5-signals-right {
    display: flex;
    justify-content: center;
}

/* ==========================================================================
   DEFAULT PAGE TEMPLATE
   ========================================================================== */

.t5-page {
    padding: 140px 0 var(--t5-space-16);
    min-height: 70vh;
}

@media (min-width: 768px) {
    .t5-page {
        padding: 160px 0 var(--t5-space-20);
    }
}

.t5-page__header {
    text-align: center;
    margin-bottom: var(--t5-space-10);
}

.t5-page__header h1 {
    font-size: clamp(2rem, 5vw, 3rem);
    margin-bottom: var(--t5-space-4);
}

.t5-page__content {
    color: var(--t5-text-secondary);
    line-height: 1.8;
}

.t5-page__content h2 {
    color: var(--t5-text-primary);
    font-size: var(--t5-text-2xl);
    margin-top: var(--t5-space-10);
    margin-bottom: var(--t5-space-4);
}

.t5-page__content h3 {
    color: var(--t5-text-primary);
    font-size: var(--t5-text-xl);
    margin-top: var(--t5-space-6);
    margin-bottom: var(--t5-space-3);
}

.t5-page__content p {
    margin-bottom: var(--t5-space-4);
}

.t5-page__content ul,
.t5-page__content ol {
    margin-bottom: var(--t5-space-4);
    padding-left: var(--t5-space-6);
}

.t5-page__content li {
    margin-bottom: var(--t5-space-2);
}

.t5-page__content a {
    color: var(--t5-primary-light);
}

.t5-page__content a:hover {
    text-decoration: underline;
}

.t5-page__content img {
    border-radius: var(--t5-radius-lg);
    margin: var(--t5-space-6) 0;
}

.t5-page__content blockquote {
    border-left: 4px solid var(--t5-primary);
    padding-left: var(--t5-space-6);
    margin: var(--t5-space-6) 0;
    font-style: italic;
    color: var(--t5-text-muted);
}

/* ==========================================================================
   PROOF CARDS (Payout Screenshots)
   ========================================================================== */

.t5-proofs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--t5-space-6);
}

.t5-proof-card {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.t5-proof-card__image {
    position: relative;
    aspect-ratio: 16/10;
    background: var(--t5-bg-elevated);
    overflow: hidden;
}

.t5-proof-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.t5-proof-card__placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--t5-space-3);
    color: var(--t5-text-muted);
    background: var(--t5-bg-elevated);
}

.t5-proof-card__placeholder svg {
    width: 48px;
    height: 48px;
    opacity: 0.5;
}

.t5-proof-card__placeholder span {
    font-size: var(--t5-text-sm);
}

.t5-proof-card__badge {
    position: absolute;
    top: var(--t5-space-3);
    right: var(--t5-space-3);
    padding: var(--t5-space-1) var(--t5-space-3);
    background: var(--t5-green);
    color: var(--t5-bg-dark);
    font-size: var(--t5-text-xs);
    font-weight: 700;
    border-radius: var(--t5-radius);
}

.t5-proof-card__content {
    padding: var(--t5-space-5);
}

.t5-proof-card__firm {
    display: flex;
    align-items: center;
    gap: var(--t5-space-2);
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
    margin-bottom: var(--t5-space-2);
}

.t5-proof-card__firm svg {
    color: var(--t5-primary-light);
}

.t5-proof-card__amount {
    font-size: var(--t5-text-2xl);
    font-weight: 700;
    color: var(--t5-green);
    margin-bottom: var(--t5-space-1);
}

.t5-proof-card__date {
    font-size: var(--t5-text-sm);
    color: var(--t5-text-muted);
}

/* ==========================================================================
   FEATURES GRID
   ========================================================================== */

.t5-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--t5-space-6);
}

.t5-feature {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-8);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.t5-feature:hover {
    border-color: var(--t5-primary);
}

.t5-feature__icon {
    width: 56px;
    height: 56px;
    margin: 0 auto var(--t5-space-5);
    background: rgba(0, 87, 204, 0.1);
    border-radius: var(--t5-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--t5-primary-light);
}

.t5-feature h3 {
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-3);
}

.t5-feature p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    margin: 0;
    line-height: 1.6;
}

/* ==========================================================================
   EDGE SECTION (Why Traders Fail vs Solutions)
   ========================================================================== */

.t5-edge {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--t5-space-6);
}

@media (min-width: 1024px) {
    .t5-edge {
        grid-template-columns: 1fr 1fr;
    }
}

.t5-edge__column {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-8);
}

.t5-edge__column--problems {
    border-color: rgba(255, 75, 75, 0.3);
}

.t5-edge__column--solutions {
    border-color: rgba(31, 218, 154, 0.3);
}

.t5-edge__title {
    display: flex;
    align-items: center;
    gap: var(--t5-space-3);
    font-size: var(--t5-text-lg);
    margin-bottom: var(--t5-space-6);
    padding-bottom: var(--t5-space-4);
    border-bottom: 1px solid var(--t5-border);
}

.t5-edge__column--problems .t5-edge__title {
    color: var(--t5-red);
}

.t5-edge__column--solutions .t5-edge__title {
    color: var(--t5-green);
}

.t5-edge__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
}

.t5-edge__item {
    display: flex;
    gap: var(--t5-space-3);
}

.t5-edge__icon {
    min-width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.t5-edge__icon svg {
    width: 14px;
    height: 14px;
}

.t5-edge__item--fail .t5-edge__icon {
    background: rgba(255, 75, 75, 0.15);
    color: var(--t5-red);
}

.t5-edge__item--solve .t5-edge__icon {
    background: rgba(31, 218, 154, 0.15);
    color: var(--t5-green);
}

.t5-edge__content strong {
    display: block;
    color: var(--t5-text-primary);
    font-size: var(--t5-text-sm);
    margin-bottom: var(--t5-space-1);
}

.t5-edge__content p {
    color: var(--t5-text-muted);
    font-size: var(--t5-text-sm);
    margin: 0;
    line-height: 1.5;
}

/* ==========================================================================
   BOT FEATURES GRID
   ========================================================================== */

.t5-bot-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: var(--t5-space-4);
    margin-top: var(--t5-space-10);
}

.t5-bot-feature {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    padding: var(--t5-space-5);
    text-align: center;
    transition: border-color 0.2s ease;
}

.t5-bot-feature:hover {
    border-color: var(--t5-primary);
}

.t5-bot-feature__value {
    font-size: var(--t5-text-xl);
    font-weight: 700;
    color: var(--t5-primary-light);
    margin-bottom: var(--t5-space-2);
    display: flex;
    align-items: center;
    justify-content: center;
}

.t5-bot-feature__value svg {
    color: var(--t5-primary-light);
}

.t5-bot-feature__label {
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ==========================================================================
   PRICING SECTION
   ========================================================================== */

.t5-pricing-section {
    position: relative;
    overflow: hidden;
}

.t5-pricing-section__globe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    pointer-events: none;
    opacity: 0.5;
}

.t5-pricing-section__globe svg {
    width: 100%;
    height: 100%;
}

.t5-pricing-section__globe-glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle, rgba(0, 87, 204, 0.1) 0%, transparent 60%);
}

.t5-pricing {
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.t5-pricing-card {
    background: var(--t5-bg-card);
    border: 2px solid var(--t5-primary);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-10);
    max-width: 420px;
    width: 100%;
    box-shadow: var(--t5-glow-primary);
}

.t5-pricing-card__header {
    text-align: center;
    margin-bottom: var(--t5-space-8);
}

.t5-pricing-card__name {
    font-size: var(--t5-text-lg);
    font-weight: 600;
    color: var(--t5-text-secondary);
    margin-bottom: var(--t5-space-4);
}

.t5-pricing-card__price {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: var(--t5-space-1);
}

.t5-pricing-card__currency {
    font-size: var(--t5-text-2xl);
    font-weight: 600;
    color: var(--t5-text-primary);
}

.t5-pricing-card__amount {
    font-size: 4rem;
    font-weight: 800;
    color: var(--t5-text-primary);
    line-height: 1;
}

.t5-pricing-card__period {
    font-size: var(--t5-text-lg);
    color: var(--t5-text-muted);
}

.t5-pricing-card__features {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--t5-space-8);
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-4);
}

.t5-pricing-card__features li {
    display: flex;
    align-items: flex-start;
    gap: var(--t5-space-3);
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
}

.t5-pricing-card__features svg {
    min-width: 20px;
    color: var(--t5-green);
    margin-top: 2px;
}

.t5-pricing-card__note {
    text-align: center;
    font-size: var(--t5-text-xs);
    color: var(--t5-text-muted);
    margin-top: var(--t5-space-4);
}

/* ==========================================================================
   FAQ SECTION
   ========================================================================== */

.t5-faq {
    max-width: 700px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--t5-space-3);
}

.t5-faq details {
    background: var(--t5-bg-card);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-lg);
    overflow: hidden;
}

.t5-faq details[open] {
    border-color: var(--t5-primary);
}

.t5-faq summary {
    padding: var(--t5-space-5) var(--t5-space-6);
    font-weight: 600;
    color: var(--t5-text-primary);
    cursor: pointer;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.t5-faq summary::-webkit-details-marker {
    display: none;
}

.t5-faq summary::after {
    content: '+';
    font-size: var(--t5-text-xl);
    color: var(--t5-text-muted);
    transition: transform 0.2s ease;
}

.t5-faq details[open] summary::after {
    content: '−';
    color: var(--t5-primary);
}

.t5-faq__answer {
    padding: 0 var(--t5-space-6) var(--t5-space-5);
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-sm);
    line-height: 1.7;
}

/* ==========================================================================
   CTA SECTION
   ========================================================================== */

.t5-cta {
    background: linear-gradient(135deg, var(--t5-bg-card) 0%, rgba(0, 87, 204, 0.1) 100%);
    border: 1px solid var(--t5-border);
    border-radius: var(--t5-radius-xl);
    padding: var(--t5-space-12);
    text-align: center;
}

.t5-cta h2 {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    margin-bottom: var(--t5-space-4);
}

.t5-cta p {
    color: var(--t5-text-secondary);
    font-size: var(--t5-text-lg);
    max-width: 500px;
    margin: 0 auto var(--t5-space-8);
}
