/*!
 * Ascend Solutions : Immersive design tokens (generated).
 * Custom-property declarations only. Safe to load alongside main.css, so
 * standard-shell pages can render immersive-ascent.css without the immersive
 * bundle (which dequeues main.css and would strip their header and footer).
 * Derived from immersive.css. Regenerate: node tools/build-immersive-tokens.cjs
 */
/* ====================================================================
   design-system/tokens/colors.css
   ==================================================================== */
/* ============================================================
   Ascend - Color tokens
   Core: deep navy authority. Solutions accent: teal (growth).
   Advisory accent: gold (premium vCFO). Cool-tinted neutrals.
   ============================================================ */

:root {
  /* ---- Brand navy (core) ---- */
  --navy-950: #06122A;
  --navy-900: #0B1D3A; /* brand core / theme-color */
  --navy-800: #162B52; /* deep navy (canonical, gradients) */
  --navy-700: #1B3A6B;
  --navy-600: #244B85;
  --navy-500: #335F9E;
  --navy-400: #5A82BE;
  --navy-300: #8EA9D4;
  --navy-200: #C0D0E8;
  --navy-100: #E2EAF5;
  --navy-50:  #F2F6FC;

  /* ---- Teal - Solutions accent (canonical #0FA3B1) ---- */
  --teal-700: #0B7F8A; /* dark teal */
  --teal-600: #0C8E9A;
  --teal-500: #0FA3B1; /* primary teal */
  --teal-400: #14C4D4; /* light teal (gradient end) */
  --teal-300: #35D0DE; /* aqua */
  --teal-200: #8FE4EC;
  --teal-100: #D4F4F7;
  --teal-50:  #ECFAFB;

  /* ---- Gold - Advisory accent (canonical #D4A843) ---- */
  --gold-700: #8A6A1F;
  --gold-600: #B8902E; /* dark gold */
  --gold-500: #D4A843; /* primary gold */
  --gold-400: #E8C46A; /* light gold */
  --gold-300: #EFD391;
  --gold-200: #F4E3BB;
  --gold-100: #FAF2DD;
  --gold-50:  #FDF9EF;

  /* ---- Neutrals (cool, navy-tinted) ---- */
  --gray-950: #0C1119;
  --gray-900: #161C28;
  --gray-800: #232B3A;
  --gray-700: #3A4456;
  --gray-600: #586275;
  --gray-500: #7B8597;
  --gray-400: #A2ABBA;
  --gray-300: #C7CDD8;
  --gray-200: #E1E5EC;
  --gray-150: #EBEEF3;
  --gray-100: #F2F4F8;
  --gray-50:  #F8FAFC;
  --white:    #FFFFFF;

  /* ---- Semantic status ---- */
  --success-600: #0C8268;
  --success-500: #16A37F;
  --success-100: #DBF4EE;
  --warning-600: #B6781A;
  --warning-500: #E0962A;
  --warning-100: #FBEFD8;
  --danger-600:  #B4332B;
  --danger-500:  #DA4A40;
  --danger-100:  #FBE4E2;
  --info-600:    #244B85;
  --info-500:    #335F9E;
  --info-100:    #E2EAF5;

  /* ============================================================
     Semantic aliases - reference these in components
     ============================================================ */

  /* Brand */
  --brand:            var(--navy-900);
  --brand-strong:     var(--navy-950);
  --brand-soft:       var(--navy-50);
  --accent:           var(--teal-500);   /* Solutions */
  --accent-strong:    var(--teal-600);
  --accent-soft:      var(--teal-50);
  --premium:          var(--gold-500);   /* Advisory */
  --premium-strong:   var(--gold-600);
  --premium-soft:     var(--gold-50);

  /* Text */
  --text-strong:      var(--navy-900);
  --text-body:        var(--gray-700);
  --text-muted:       var(--gray-500);
  --text-faint:       var(--gray-400);
  --text-on-brand:    #EAF1FB;
  --text-on-accent:   var(--white);
  --text-link:        var(--teal-600);

  /* Surfaces */
  --surface-page:     var(--gray-50);
  --surface-card:     var(--white);
  --surface-sunken:   var(--gray-100);
  --surface-brand:    var(--navy-900);
  --surface-brand-2:  var(--navy-800);
  --surface-inverse:  var(--navy-950);

  /* Borders / lines */
  --border:           var(--gray-200);
  --border-strong:    var(--gray-300);
  --border-brand:     color-mix(in srgb, var(--navy-300) 40%, transparent);
  --ring:             color-mix(in srgb, var(--teal-500) 45%, transparent);

  /* Focus */
  --focus-ring:       0 0 0 3px var(--ring);
}


/* ====================================================================
   design-system/tokens/typography.css
   ==================================================================== */
/* ============================================================
   Ascend - Typography tokens
   ============================================================ */

:root {
  /* ---- Families (canonical: Plus Jakarta Sans + Inter) ---- */
  --font-display: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-sans:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* No serif/mono in the brand. Aliases kept for back-compat; eyebrows are
     display-cased Plus Jakarta Sans, numerics are Inter with tabular figures. */
  --font-serif: var(--font-display);
  --font-mono:  ui-monospace, 'SF Mono', Menlo, monospace;

  /* ---- Weights ---- */
  --fw-regular:  400; /* @kind other */
  --fw-medium:   500; /* @kind other */
  --fw-semibold: 600; /* @kind other */
  --fw-bold:     700; /* @kind other */
  --fw-black:    800; /* @kind other */

  /* ---- Type scale (1.250 major-third, 16px base) ---- */
  --text-2xs:  0.6875rem; /* 11 */
  --text-xs:   0.75rem;   /* 12 */
  --text-sm:   0.875rem;  /* 14 */
  --text-base: 1rem;      /* 16 */
  --text-md:   1.125rem;  /* 18 */
  --text-lg:   1.375rem;  /* 22 */
  --text-xl:   1.75rem;   /* 28 */
  --text-2xl:  2.25rem;   /* 36 */
  --text-3xl:  2.875rem;  /* 46 */
  --text-4xl:  3.625rem;  /* 58 */
  --text-5xl:  4.5rem;    /* 72 */

  /* ---- Line heights ---- */
  --leading-tight:   1.08;
  --leading-snug:    1.2;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  /* ---- Letter spacing ---- */
  --tracking-tight:  -0.02em;
  --tracking-snug:   -0.01em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-eyebrow: 0.14em; /* mono eyebrows, all-caps */

  /* ---- Semantic roles ---- */
  --display-font: var(--font-display);
  --display-weight: var(--fw-black);
  --display-tracking: var(--tracking-tight);

  --heading-font: var(--font-display);
  --heading-weight: var(--fw-bold);

  --body-font: var(--font-sans);
  --eyebrow-font: var(--font-display);  /* uppercase + tracked, per brand wordmark */
  --quote-font: var(--font-display);
  --numeric-font: var(--font-sans);     /* Inter, with font-feature-settings: 'tnum' */
}


/* ====================================================================
   design-system/tokens/spacing.css
   ==================================================================== */
/* ============================================================
   Ascend - Spacing & radius tokens (4px base grid)
   ============================================================ */

:root {
  --space-0:   0;
  --space-1:   0.25rem;  /* 4 */
  --space-2:   0.5rem;   /* 8 */
  --space-3:   0.75rem;  /* 12 */
  --space-4:   1rem;     /* 16 */
  --space-5:   1.5rem;   /* 24 */
  --space-6:   2rem;     /* 32 */
  --space-7:   2.5rem;   /* 40 */
  --space-8:   3rem;     /* 48 */
  --space-9:   4rem;     /* 64 */
  --space-10:  5rem;     /* 80 */
  --space-11:  6rem;     /* 96 */
  --space-12:  8rem;     /* 128 */

  /* Layout */
  --container:    1200px;
  --container-wide: 1320px;
  --gutter:       max(1.25rem, 4vw); /* @kind spacing */
  --section-y:    var(--space-11);

  /* Radius */
  --radius-xs:  4px;
  --radius-sm:  8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-2xl: 32px;
  --radius-pill: 999px;

  /* Borders */
  --border-w: 1px;
  --border-w-2: 1.5px;
}


/* ====================================================================
   design-system/tokens/elevation.css
   ==================================================================== */
/* ============================================================
   Ascend - Elevation (cool, navy-tinted soft shadows)
   ============================================================ */

:root {
  --shadow-xs: 0 1px 2px rgba(11, 29, 58, 0.06);
  --shadow-sm: 0 1px 3px rgba(11, 29, 58, 0.08), 0 1px 2px rgba(11, 29, 58, 0.05);
  --shadow-md: 0 4px 12px rgba(11, 29, 58, 0.08), 0 2px 4px rgba(11, 29, 58, 0.05);
  --shadow-lg: 0 12px 28px rgba(11, 29, 58, 0.12), 0 4px 8px rgba(11, 29, 58, 0.06);
  --shadow-xl: 0 24px 56px rgba(11, 29, 58, 0.16), 0 8px 16px rgba(11, 29, 58, 0.07);
  --shadow-accent: 0 10px 24px rgba(15, 158, 132, 0.25);
  --shadow-brand:  0 16px 40px rgba(11, 29, 58, 0.28);

  /* Inset / hairline */
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}


/* ====================================================================
   design-system/tokens/motion.css
   ==================================================================== */
/* ============================================================
   Ascend - Motion tokens
   Confident, smooth. Gentle rise + fade. No bounce.
   ============================================================ */

:root {
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */

  --dur-fast:   140ms; /* @kind other */
  --dur-base:   220ms; /* @kind other */
  --dur-slow:   360ms; /* @kind other */
  --dur-slower: 560ms; /* @kind other */

  --hover-lift: -2px; /* @kind other */
  --press-scale: 0.98; /* @kind other */
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms; /* @kind other */
    --dur-base: 0ms; /* @kind other */
    --dur-slow: 0ms; /* @kind other */
    --dur-slower: 0ms; /* @kind other */
  }
}



/* ====================================================================
   local additions (gold ramp, from immersive.css)
   ==================================================================== */
:root{
  /* Advisory gold aligned to theme.ts / style.css brand gold (#C6A35B) */
  --gold-500: #C6A35B; /* theme --color-gold (was #D4A843) */
  --gold-400: #D4B878; /* theme --color-gold-light (was #E8C46A) */
  --gold-300: #E0CBA0; /* lighter tint (was #EFD391) */
  --gold-600: #B8902E; /* theme --color-gold-dark (unchanged) */
}

/* ====================================================================
   alias: --ease (declared in design/styles.css, needed by .btn transitions)
   ==================================================================== */
:root{ --ease: var(--ease-out); }
