@charset "utf-8";
/* CSS Document */
/* ==========================================================
   VARIABLES
   ========================================================== */

/*<resources>
    <color name="black">#FF000000</color>
    <color name="white">#FFFFFFFF</color>
    <color name="dark_blue">#469dd4</color>
    <color name="darker_blue">#467db4</color>
    <color name="dark_red">#9c323c</color>
    <color name="toast_yellow">#eef455</color>
    <color name="light_yellow">#cad834</color>
    <color name="dashboard_bg">#021526</color>
    <color name="surface_bg">#122D42</color>
    <color name="accent_teal">#2EC4B6</color>
    <color name="accent_purple">#7D5FFF</color>
    <color name="text_grey">#94A3B8</color>
    <color name="dashboard_promo_bg">#243447</color>
    <color name="header_dark_blue">#2211182A</color>
    <color name="real_dark_blue">#3d87b9</color>
    <color name="card_default">#1F2937</color>      <!-- your current dark -->
    <color name="card_highlight">#afd5ed</color>   <!-- brighter blue -->
    <color name="card_highlight_text">#a7342e</color>
</resources>*/

:root {

    /* Brand */

    --primary: #467db4;
    --primary-hover: #469dd4;
    --primary-light: #f7ead3;
	--read-more: #EFECEC;
	
	--footer-back: #f0f0f0;
	--footer-height: 60px;
	
    --secondary: #444444;
    --secondary-hover: #2f2f2f;
	--light-hover: #6565ff;

    /* Backgrounds */

    --background: #f8f7f4;
    --surface: #ffffff;
    --surface-alt: #efede8;

    /* Text */

    --text: #2b2b2b;
    --text-muted: #666666;
    --text-light: #ffffff;

    /* Borders */

    --border: #ddd8cf;
    --border-light: #ebe8e2;

    /* Status */

    --success: #2f8f46;
    --warning: #e2a100;
    --error: #c93636;
    --info: #2979c9;

    /* Layout */

    --container-width: 1200px;

    /* Typography */

    --font-family: 'Play', 'Trebuchet MS', Calibri, Arial, sans-serif;

    --font-size-h1: clamp(2.4rem, 5vw, 4.2rem);
	--font-size-h2: clamp(1.4rem, 2vw, 3rem);
    --font-size-h3: 1.3rem;
    --font-size-body: 1rem;
    --font-size-small: .9rem;

    /* Spacing */

    --space-xs: 8px;
    --space-sm: 16px;
    --space-md: 24px;
    --space-lg: 40px;
    --space-xl: 64px;

    /* Radius */

    --radius-button: 10px;
    --radius-card: 18px;
    --radius-panel: 24px;
    --radius-pill: 999px;

    /* Shadows */

    --shadow-soft: 0 8px 20px rgba(0,0,0,.08);
    --shadow-medium: 0 12px 30px rgba(0,0,0,.12);

    /* Animation */

    --transition: .25s ease;

}