/* ========== DESIGN SYSTEM: STACKD ========== */

/* ----- Self-Hosted Fonts ----- */
@font-face {
    font-family: 'Archivo Black';
    src: url('../fonts/archivo-black-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/work-sans-400.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/work-sans-500.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/work-sans-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/work-sans-700.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ----- Custom Properties ----- */
:root {
    --font-display: 'Archivo Black', sans-serif;
    --font-body: 'Work Sans', sans-serif;

    --bg: #ffffff;
    --bg-card: #ffffff;
    --bg-input: #ffffff;
    --border: #e0e0e0;
    --text: #0a0a0a;
    --text-muted: #6b7280;

    --accent: #00bf63;
    --accent-glow: rgba(0, 191, 99, 0.3);
    --accent-soft: rgba(0, 191, 99, 0.1);

    --secondary: #00bf63;
    --secondary-glow: rgba(0, 191, 99, 0.3);

    --bg-glass: rgba(255, 255, 255, 0.7);

    /* Layout */
    --max-width: 1100px;
    --section-gap: 100px;
    --radius: 8px;
    --radius-lg: 12px;

    /* Danger / Loss */
    --red: #ef4444;
    --red-glow: rgba(239, 68, 68, 0.15);

    /* Transitions */
    --ease: 0.2s ease;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #0a0a0a;
        --bg-card: #161616;
        --bg-input: #1a1a1a;
        --border: #2a2a2a;
        --text: #ededed;
        --text-muted: #888888;
        --bg-glass: rgba(10, 10, 10, 0.7);
    }
}