/* ============================================================================
   MemberWeb — DEFAULT THEME PALETTE
   ----------------------------------------------------------------------------
   This is the ONE file you change to reskin a site. It defines only design
   tokens (colours, fonts, spacing, radius, motion) as CSS custom properties.
   mw-core.css references these via var(--mw-*) and never hard-codes a brand
   value, so a reskin needs NO rebuild — copy this file, edit the values, and
   serve it per microsite (see the layout's theme-resolution convention).

   To brand a microsite: copy to  wwwroot/css/themes/<microsite>.css  and the
   layout will load it instead of this default.
   ========================================================================== */
:root {
    /* ---- Brand ---------------------------------------------------------- */
    --mw-color-primary: #5b2d8e;          /* hero / brand purple              */
    --mw-color-primary-rgb: 91, 45, 142;
    --mw-color-primary-dark: #3f1d68;
    --mw-color-primary-light: #7a4fb0;
    --mw-color-secondary: #16b8c6;        /* teal — tags, highlights          */
    --mw-color-secondary-rgb: 22, 184, 198;
    --mw-color-accent: #2a9fd6;           /* action blue — buttons, links     */
    --mw-color-accent-dark: #1f87b9;

    /* ---- Surfaces / neutrals ------------------------------------------- */
    --mw-color-bg: #f3f4f7;               /* page canvas                      */
    --mw-color-surface: #ffffff;          /* cards / panels                   */
    --mw-color-surface-alt: #f7f8fa;
    --mw-color-border: #e4e7ec;
    --mw-color-footer-bg: #2a2f37;
    --mw-color-footer-fg: #c7ccd4;
    --mw-color-footer-heading: #ffffff;

    /* ---- Text ----------------------------------------------------------- */
    --mw-color-text: #23262d;
    --mw-color-heading: #1b1e24;
    --mw-color-muted: #6b7280;
    --mw-color-on-primary: #ffffff;
    --mw-color-link: var(--mw-color-accent);
    --mw-color-link-hover: var(--mw-color-accent-dark);

    /* ---- Typography ----------------------------------------------------- */
    /* System stack by default: zero font download => zero CLS, best PageSpeed.
       To use a brand webfont, self-host it and set --mw-font-sans here. */
    --mw-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    --mw-font-heading: var(--mw-font-sans);
    --mw-line-height: 1.6;
    --mw-fw-normal: 400;
    --mw-fw-medium: 500;
    --mw-fw-semibold: 600;
    --mw-fw-bold: 700;

    /* Fluid type scale (clamp = no breakpoint jank, no layout shift) */
    --mw-h1: clamp(2rem, 1.45rem + 2.2vw, 3rem);
    --mw-h2: clamp(1.5rem, 1.25rem + 1vw, 2rem);
    --mw-h3: clamp(1.2rem, 1.08rem + 0.5vw, 1.4rem);
    --mw-h4: 1.1rem;

    /* ---- Spacing scale -------------------------------------------------- */
    --mw-space-1: 0.25rem;
    --mw-space-2: 0.5rem;
    --mw-space-3: 0.75rem;
    --mw-space-4: 1rem;
    --mw-space-5: 1.5rem;
    --mw-space-6: 2rem;
    --mw-space-7: 3rem;
    --mw-space-8: 4rem;

    /* ---- Radius / shadow / layout / motion ------------------------------ */
    --mw-radius-sm: 4px;
    --mw-radius: 8px;
    --mw-radius-lg: 14px;
    --mw-radius-pill: 999px;
    --mw-shadow-sm: 0 1px 2px rgba(20, 23, 28, 0.06);
    --mw-shadow: 0 4px 14px rgba(20, 23, 28, 0.08);
    --mw-shadow-lg: 0 14px 34px rgba(20, 23, 28, 0.13);
    --mw-container-max: 1200px;
    --mw-header-height: 76px;
    --mw-transition: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --mw-transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
}