/*
Theme Name: Landing Page
Theme URI: https://example.com
Description: YBIAJ — Your Brain Is A Jerk | SC Suicide Prevention Campaign (#13815)
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: landing-page
*/

/* Rubik loaded via wp_enqueue_style in functions.php (preconnect + variable range) */

/*
 * ─── DESIGN TOKENS ──────────────────────────────────────────────────────────
 *
 * Colors extracted via pixel sampling from campaign assets:
 *   YBIAJ_look_02campaign look.jpg
 *   YBIAJ_outdoor_02_purple/yellow/green 400x1400 full.jpg
 *
 * Fonts: Rubik confirmed from PSD Character panel (Chernoff Newman source files).
 *   Hero headline:  Rubik Bold   (700)
 *   Outdoor taglines: Rubik Black (900)
 *   Body copy:      Rubik Regular (400)
 * Available free via Google Fonts — no license required.
 * ─────────────────────────────────────────────────────────────────────────────
 */

:root {
    /* Brand colors */
    --color-cyan:       #00FEFF;
    --color-dark:       #070314;
    --color-purple:     #D73ADF;
    --color-yellow:     #FFDA05;
    --color-green:      #00DE63;
    --color-black:      #000000;
    --color-white:      #FFFFFF;

    /* Semantic aliases */
    --color-headline:   var(--color-cyan);
    --color-bg-dark:    var(--color-dark);
    --color-bg-accent:  var(--color-purple);  /* default colorway; swap per section */
    --color-text-dark:  var(--color-black);
    --color-text-light: var(--color-white);

    /* Typography */
    --font-display: 'Rubik', sans-serif;  /* all text — Rubik Bold / Black */
    --font-body:    'Rubik', sans-serif;

    --fw-regular:  400;
    --fw-bold:     700;   /* hero headline */
    --fw-black:    900;   /* outdoor taglines */
}

/* ─── RESET ──────────────────────────────────────────────────────────────── */

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

body {
    font-family: var(--font-body);
    font-weight: var(--fw-regular);
    line-height: 1.5;
    background-color: var(--color-dark);
    color: var(--color-white);
}