/**
 * Brand Pack: JD Stride
 *
 * Extracted from 8 high-converting landing pages.
 * Overrides the GP Agency framework defaults.
 *
 * Load order: after tokens.css, components.css, layout.css
 * Activated via: mu-plugin--gp-brand.php returning 'client-jdstride'
 */

:root {

    /* ─── Brand Colors ─── */
    --brand-primary:   #0A1628;   /* Navy — foundation */
    --brand-secondary: #2E5BFF;   /* Blue — links, highlights */
    --brand-accent:    #FF6B35;   /* Orange — primary CTA */

    /* ─── Extended Palette ─── */
    --brand-primary-light:    #1E293B;
    --brand-primary-dark:     #050B14;
    --brand-secondary-light:  #4DA3FF;
    --brand-secondary-dark:   #1E40BF;
    --brand-accent-light:     #FF8A65;
    --brand-accent-dark:      #E65A2B;

    /* ─── Semantic ─── */
    --brand-success:  #10b981;
    --brand-warning:  #f59e0b;
    --brand-error:    #ef4444;
    --brand-border:   #E5E3DF;

    /* ─── Typography ─── */
    --font-heading: "DM Serif Display", Georgia, serif;
    --font-body:    "Inter", -apple-system, BlinkMacSystemFont, sans-serif;

    /* ─── Section Backgrounds ─── */
    --section-light:  #ffffff;
    --section-muted:  #F8F7F5;   /* Warm grey — JDS signature bg */
    --section-dark:   #0A1628;   /* Navy */

    /* ─── Gradient ─── */
    --gradient-primary: linear-gradient(135deg, #0A1628 0%, #1a2942 100%);

    /* ─── Component Overrides ─── */
    --button-radius:  4px;        /* Subtle — not pill, not sharp */
    --card-radius:    4px;
    --card-shadow:    0 4px 20px rgba(0,0,0,0.06);

    /* ─── Neutrals (warm, not cool) ─── */
    --grey-50:  #F8F7F5;
    --grey-100: #E5E3DF;
    --grey-200: #D1CEC9;
    --grey-300: #B8B5B0;
    --grey-400: #8B8680;          /* Body text — warm grey */
    --grey-500: #6B6760;
    --grey-600: #4A4740;
    --grey-700: #2A2720;
    --grey-800: #1A1710;
    --grey-900: #0A0700;

    /* ─── Service Accent Colors ─── */
    /* Used for service-specific CTAs — override per page with Additional CSS */
    --color-security:       #3b82f6;
    --color-google:         #4285F4;
    --color-growth:         #10b981;
    --color-ecommerce:      #C59D5F;
    --color-infrastructure: #14B8A6;
    --color-shopify:        #96bf48;
    --color-audit:          #0052cc;
}