/* ---------------------------------------------------------------------------
   brand.css — the single source of truth for design tokens on the web.

   Served at /styles/brand.css on BOTH Hosting targets: the `app` site
   (myjrny.app — share, link, reset, legal) and the `landing` site. The build
   scripts overlay hosting_shared/ onto each target's output, so this file is
   byte-identical on both origins.

   Values mirror lib/core/utils/app_colors.dart and app_text_styles.dart. The
   Dart side stays authoritative: when a token changes there, change it here in
   the same PR. Pages must never redeclare these in a local :root block — that
   is exactly the drift this file exists to prevent (the legal pages had
   invented an --ink of #1A1D29 against the real neutralInk of #091E42).
   --------------------------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Nunito:wght@700;800&display=swap');

:root {
  /* Brand — parent palette. The child (orange) palette is deliberately absent:
     every public web page is parent-facing. */
  --brand:        #4A56C7; /* AppColors.parentPrimary */
  --brand-dark:   #2F3A8F; /* AppColors.parentDark */
  --brand-step:   #3C49C4; /* AppColors.tertiaryStep */

  /* Ink */
  --ink:          #091E42; /* AppColors.neutralInk */
  --muted:        #42526D; /* AppColors.textSecondary */
  --muted-soft:   #7A8699; /* AppColors.neutral100 */

  /* Long-form body copy. Web-only: there is no AppColors equivalent, because
     the app has no screen with multi-paragraph running text. */
  --ink-body:     #333A47;

  /* Surfaces */
  --surface:      #F5F6F7; /* AppColors.neutralSurface */
  --card:         #FFFFFF;
  --border:       #EBEDF0; /* AppColors.neutral30 — form/card borders */
  --border-brand: #E9EBF8; /* AppColors.border */

  /* AppGradients.parent */
  --gradient-parent: linear-gradient(90deg, var(--brand) 0%, var(--brand-dark) 100%);

  /* Brand at low alpha. Spelled out rather than color-mix()'d so the tints are
     greppable and cannot silently fall back to transparent. */
  --brand-wash:     rgba(74, 86, 199, 0.06); /* callout / note background */
  --brand-tint:     rgba(74, 86, 199, 0.10); /* icon badge background */
  --brand-hairline: rgba(74, 86, 199, 0.18); /* callout border */

  /* Typography — AppTextStyles. Nunito for display/headings, Inter for body.
     Plus Jakarta Sans is app-only (list labels) and has no web use yet. */
  --font-display: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  Helvetica, Arial, sans-serif;
  --font-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  Helvetica, Arial, sans-serif;

  --shadow-card:  0 12px 32px rgba(9, 30, 66, 0.08);
  --shadow-brand: 0 8px 18px rgba(74, 86, 199, 0.30); /* lift under a gradient badge */
  --radius-card:  20px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font-body);
  background: var(--surface);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.2px;
}

/* The "myJRNY" lockup. Kept here rather than per-page so the JRNY half is the
   same brand blue everywhere it appears. */
.wordmark {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 20px;
  letter-spacing: -0.2px;
  color: var(--ink);
}
.wordmark span { color: var(--brand); }
