/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');

:root {
    /* Core Colors - Light Mode */
    --bg-body: #f9fafb;
    --bg-hero: #f3f4f6;
    --bg-card: #ffffff;
    --bg-card-hover: #f9fafb;
    --text-main: #1f2937;
    /* gray-800 */
    --text-secondary: #4b5563;
    /* gray-600 */
    --text-muted: #6b7280;
    /* gray-500 */
    --border-color: #e5e7eb;
    /* gray-200 */

    /* Brand Colors */
    --primary-indigo: #4f46e5;
    --primary-indigo-hover: #4338ca;

    /* Glass Effects */
    --glass-bg: rgba(255, 255, 255, 0.5);
    --glass-border: rgba(255, 255, 255, 0.3);
    --glass-shadow: rgba(31, 38, 135, 0.15);

    /* Nav & Footer */
    --nav-bg: rgba(255, 255, 255, 0.72);
    --nav-border: rgba(229, 231, 235, 0.9);
    --footer-bg: #111827;
    /* gray-900 */
    --footer-text: #f3f4f6;
    /* gray-100 */
    --footer-text-muted: #9ca3af;
    /* gray-400 */
}

[data-theme="dark"] {
    /* Core Colors - Dark Mode (Rich Slate/Blue) */
    --bg-body: #0f172a;
    --bg-hero: #0f172a;
    /* slate-900 */
    --bg-card: #1e293b;
    /* slate-800 */
    --bg-card-hover: #334155;
    /* slate-700 */
    --text-main: #f8fafc;
    /* slate-50 - brighter for premium feel */
    --text-secondary: #cbd5e1;
    /* slate-200 - more vibrant */
    --text-muted: #94a3b8;
    /* slate-300 - less dull */
    --border-color: #475569;
    /* slate-600 - more visible */

    /* Brand Colors - More Vibrant */
    --primary-indigo: #6366f1;
    /* indigo-500 - more saturated */
    --primary-indigo-hover: #818cf8;
    /* indigo-400 - lighter on hover */

    /* Glass Effects */
    --glass-bg: rgba(30, 41, 59, 0.6);
    /* slate-800 with better opacity */
    --glass-border: rgba(71, 85, 105, 0.5);
    /* slate-600 more visible */
    --glass-shadow: rgba(0, 0, 0, 0.3);

    /* Nav & Footer */
    --nav-bg: rgba(15, 23, 42, 0.8);
    /* slate-900 slightly more opaque */
    --nav-border: rgba(71, 85, 105, 0.5);
    /* slate-600 */
    --footer-bg: #020617;
    /* slate-950 */
    --footer-text: #e2e8f0;
    /* slate-200 - brighter */
    --footer-text-muted: #94a3b8;
    /* slate-400 */
}

/* Base Styles */
body {
    font-family: 'Poppins', sans-serif;
    overflow-x: hidden;
    background-color: var(--bg-body);
    color: var(--text-main);
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Tabular numerals for finance-grade consistency */
.proof-stat,
.plan-price,
.countup,
.pricing-suffix,
.how-step__digit {
    font-variant-numeric: tabular-nums;
}

html {
    scroll-behavior: smooth;
}

.force-break {
    display: inline-block;
    white-space: normal;
}

/* Utility Classes */
.gradient-text {
    /* Premium indigo→purple gradient (removed cyan for a more editorial, Apple/Bloomberg tone) */
    background: linear-gradient(90deg, #4338ca, #6b46c1);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

[data-theme="dark"] .gradient-text {
    background: linear-gradient(90deg, #a5b4fc, #c084fc);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.glass-effect {
    background: var(--glass-bg);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--glass-border);
    box-shadow: 0 2px 8px var(--glass-shadow);
    border-bottom: 1px solid var(--glass-border);
    /* Simplified to use same border var or create a new one if needed, but this is cleaner */
    transition: backdrop-filter 0.3s ease, background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.section-title {
    margin-bottom: 3rem;
    line-height: 1.12;
    letter-spacing: -0.012em;
    font-weight: 600;
    /* match hero H1 tone */
}

/* Tighten all h2 headings for consistent rhythm (Jobs-like) */
h2 {
    line-height: 1.12;
    letter-spacing: -0.012em;
    font-weight: 600;
    /* semibold for calmer section titles */
}

.cta-button {
    background: linear-gradient(145deg, #4338ca, #6b46c1);
    color: white;
    padding: 12px 24px;
    border-radius: 30px;
    font-weight: 600;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
    font-size: 1rem;
    display: inline-block;
}

/* Premium indigo variant (keeps base spacing/shape, overrides background) */
.cta-button.cta-button--indigo {
    background: #4f46e5;
    /* indigo-600 */
}

.cta-button.cta-button--indigo:hover {
    background: #4338ca;
    /* indigo-700 */
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(17, 24, 39, 0.12);
}

.cta-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(17, 24, 39, 0.12);
    background: linear-gradient(145deg, #3730a3, #5a3cbf);
}