/* ============================================================
   MSFR · Design tokens (synced from the MSFR Design System
   project — tokens/colors.css + tokens/typography.css +
   tokens/fonts.css). Do not hand-edit values here; re-sync
   from the design project instead.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Manrope:wght@200;300;400;500;600;700;800&display=swap');

:root {
  /* ---- Base palette (brand book) ---- */
  --msfr-white:        #FFFFFF;
  --msfr-off-white:    #F1F1EF;   /* app background */
  --msfr-light-sand:   #F0EDE2;   /* warm tint surface */
  --msfr-sand:         #C5BC9B;   /* neutral warm / khaki */
  --msfr-sand-deep:    #A99F7C;   /* darker sand for text-on-light */
  --msfr-grey:         #6B6B6B;   /* muted text */
  --msfr-near-black:   #171717;   /* primary text / inverse surface */

  /* ---- Secondary / signature accents (brand book) ---- */
  --msfr-coral:        #F75C46;   /* primary action + accent */
  --msfr-yellow:       #FFC800;   /* secondary accent / highlight */
  --msfr-teal:         #17E39E;   /* "consulting" sub-brand accent */

  /* ---- Program / category accents ---- */
  --msfr-blue:         #378ADD;   /* Entrepreneurship / info */
  --msfr-green:        #1D9E75;   /* Civic Engagement / success */
  --msfr-purple:       #534AB7;   /* Leadership */

  /* ---- Coral ramp ---- */
  --msfr-coral-100:    #FDE4DF;
  --msfr-coral-200:    #FBC4B8;
  --msfr-coral-500:    #F75C46;
  --msfr-coral-600:    #E5432B;   /* hover */
  --msfr-coral-700:    #C4341F;   /* press */

  /* ---- Neutral ramp (warm-tinted greys) ---- */
  --msfr-n-50:   #FAFAF8;
  --msfr-n-100:  #F1F1EF;
  --msfr-n-150:  #EAE8E2;
  --msfr-n-200:  #E0DDD4;
  --msfr-n-300:  #C9C4B6;
  --msfr-n-400:  #A5A198;
  --msfr-n-500:  #6B6B6B;
  --msfr-n-600:  #565654;
  --msfr-n-700:  #3A3A39;
  --msfr-n-800:  #262625;
  --msfr-n-900:  #171717;

  /* ---- Semantic roles — build against these ---- */
  --surface-app:        var(--msfr-off-white);
  --surface-card:       var(--msfr-white);
  --surface-raised:     var(--msfr-white);
  --surface-sunken:     var(--msfr-n-50);
  --surface-tint:       var(--msfr-light-sand);
  --surface-inverse:    var(--msfr-near-black);
  --surface-hover:      var(--msfr-n-100);

  --text-primary:       var(--msfr-near-black);
  --text-secondary:     var(--msfr-n-600);
  --text-muted:         var(--msfr-grey);
  --text-inverse:       var(--msfr-off-white);
  --text-on-accent:     var(--msfr-white);
  --text-on-yellow:     var(--msfr-near-black);
  --text-link:          var(--msfr-coral-600);
  --text-link-hover:    var(--msfr-coral-700);

  --border-subtle:      #E7E4DC;
  --border-default:     var(--msfr-n-200);
  --border-strong:      var(--msfr-n-300);
  --border-inverse:     rgba(255,255,255,0.14);

  --accent:             var(--msfr-coral);
  --accent-hover:       var(--msfr-coral-600);
  --accent-press:       var(--msfr-coral-700);
  --accent-soft:        var(--msfr-coral-100);
  --accent-2:           var(--msfr-yellow);

  --focus-ring:         rgba(247,92,70,0.32);

  --success:            var(--msfr-green);
  --success-soft:       #E1F3EC;
  --success-text:       #14684E;
  --warning:            var(--msfr-yellow);
  --warning-soft:       #FFF3CC;
  --warning-text:       #7A5B00;
  --danger:             var(--msfr-coral-600);
  --danger-soft:        var(--msfr-coral-100);
  --danger-text:        var(--msfr-coral-700);
  --info:               var(--msfr-blue);
  --info-soft:          #E3EEFB;
  --info-text:          #1F5AA0;

  /* Role / tier accents (People module) */
  --tier-member:        var(--msfr-grey);
  --tier-volunteer:     var(--msfr-blue);
  --tier-coordinator:   var(--msfr-purple);
  --tier-admin:         var(--msfr-coral);
  --tier-staff:         var(--msfr-near-black);

  /* ---- Typography ---- */
  --font-display: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ui:      'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Cabin', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --fw-extralight: 200;
  --fw-light:      300;
  --fw-regular:    400;
  --fw-medium:     500;
  --fw-semibold:   600;
  --fw-bold:       700;
  --fw-extrabold:  800;

  --fs-display-2xl: 4.5rem;
  --fs-display-xl:  3.75rem;
  --fs-display-lg:  3rem;
  --fs-h1:          2.25rem;
  --fs-h2:          1.75rem;
  --fs-h3:          1.375rem;
  --fs-h4:          1.125rem;
  --fs-body-lg:     1.125rem;
  --fs-body:        1rem;
  --fs-body-sm:     0.875rem;
  --fs-caption:     0.8125rem;
  --fs-overline:    0.75rem;

  --lh-tight:   1.05;
  --lh-heading: 1.18;
  --lh-snug:    1.35;
  --lh-body:    1.6;
  --lh-relaxed: 1.75;

  --ls-tighter: -0.03em;
  --ls-tight:   -0.015em;
  --ls-normal:  0;
  --ls-wide:    0.04em;
  --ls-overline: 0.12em;
}