/* AuthMantra design tokens. The single source of truth for colour, type, space, shape, elevation and motion.
   Loaded after the legacy sheets so it wins; legacy names (--teal, --navy, --muted...) are aliased at the bottom.
   Colour values are mirrored in build/contrast.py, which checks every text/background pair against WCAG AA. */
/* Self-hosted Figtree (SIL OFL 1.1, assets/fonts/OFL-Figtree.txt): variable weight 300 to 700, latin (with the rupee sign) plus latin-ext loaded only when a page needs it. */
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("/assets/fonts/figtree-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+20B9, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("/assets/fonts/figtree-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  /* ---- Brand (fixed) ---- */
  --navy: #1A2332;
  --turquoise: #0ABFBC;

  /* ---- Semantic colour ---- */
  --ink: #1A2332;            /* primary text */
  --ink-2: #4A586B;          /* secondary text */
  --ink-3: #5B6B80;          /* captions, meta (still AA on white) */
  --surface: #FFFFFF;
  --surface-2: #F6F9FB;      /* tinted sections, table heads */
  --surface-3: #E7F8F8;      /* accent wash */
  --line: #E4EBF2;           /* decorative hairlines */
  --line-strong: #8795A8;    /* borders of controls (3:1 on white) */
  --accent: #0ABFBC;         /* fills, large graphics, focus glow */
  --accent-ink: #066E6B;     /* accent as text or thin line on light surfaces */
  --accent-soft: #E7F8F8;
  --success: #0B6E43;  --success-soft: #E5F6EC;
  --warning: #8A5200;  --warning-soft: #FFF3DC;
  --danger: #A31F1F;   --danger-soft: #FDECEC;

  /* ---- Depth: gradients (brand navy + turquoise, with a deep teal and an azure for range) ---- */
  --navy-deep: #0E1622;      /* darkest band stop */
  --navy-mid: #14263A;       /* middle band stop */
  --teal-deep: #0B5F63;      /* deep teal: gradient end on dark bands (white text 7:1) */
  --teal-mid: #0B8F8D;       /* icon chips: white glyph at 3:1 */
  --azure: #1F5FBF;          /* secondary gradient stop */
  --wash-teal: #DDF6F5;      /* soft section wash */
  --wash-sky: #E4EEFA;       /* cool section wash */
  --on-dark: #D3DEEA;        /* secondary text on dark bands */
  --grad-hero: radial-gradient(900px 420px at 88% 8%, rgba(10, 191, 188, 0.38), transparent 62%), radial-gradient(700px 400px at 0% 100%, rgba(31, 95, 191, 0.35), transparent 60%), linear-gradient(135deg, var(--navy-deep) 0%, var(--navy-mid) 55%, var(--teal-deep) 100%);
  --grad-band: linear-gradient(120deg, var(--navy-deep) 0%, var(--navy-mid) 60%, #0F3F52 100%);
  --grad-cta: linear-gradient(120deg, var(--teal-deep) 0%, #0A7F82 45%, var(--azure) 100%);
  --grad-wash-a: linear-gradient(180deg, var(--wash-teal) 0%, var(--surface-2) 100%);
  --grad-wash-b: linear-gradient(135deg, var(--wash-sky) 0%, var(--wash-teal) 100%);
  --grad-chip: linear-gradient(135deg, var(--teal-mid) 0%, var(--azure) 100%);
  --grad-line: linear-gradient(90deg, var(--accent), var(--azure));
  --glow: 0 10px 30px rgba(10, 143, 141, 0.28), 0 2px 8px rgba(31, 95, 191, 0.16);

  /* ---- Terminal palette ---- */
  --t-bg: #0B0F14;
  --t-bar: #141B24;
  --t-text: #E6EDF3;         /* commands */
  --t-green: #39FF9B;        /* phosphor: output, ok */
  --t-dim: #5FB48D;          /* dim green: labels, secondary output */
  --t-amber: #FFB547;        /* warnings */
  --t-cyan: #5CE1E6;         /* keys */

  /* ---- Type: Figtree (OFL, self-hosted variable font, 300 to 700) for headings and body; system mono.
         Weights: 300 display, 400 body and h2, 600 labels, buttons, h3. Noto Sans Devanagari and Kannada are
         named as local fallbacks only (never downloaded). ---- */
  --font-head: "Figtree", system-ui, -apple-system, "Segoe UI", "Noto Sans Devanagari", "Noto Sans Kannada", sans-serif;
  --font-body: "Figtree", system-ui, -apple-system, "Segoe UI", "Noto Sans Devanagari", "Noto Sans Kannada", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --w-light: 300;  --w-regular: 400;  --w-strong: 600;  --w-head: 400;
  --track-display: -0.03em;  --track-h2: -0.02em;  --track-eyebrow: 0.08em;
  /* Modular scale, ratio 1.2 up to the body steps, then wider steps for display sizes (base 16px) */
  --fs--1: 0.833rem;   /* 13.3 */
  --fs-0: 1rem;        /* 16 */
  --fs-1: 1.2rem;      /* 19.2 */
  --fs-2: 1.44rem;     /* 23 */
  --fs-3: 1.728rem;    /* 27.6 */
  --fs-4: 2.15rem;     /* 34.4 */
  --fs-5: 2.75rem;     /* 44 */
  --fs-6: 3.4rem;      /* 54.4 */
  --fs-7: 4.5rem;      /* 72 */
  --fs-body: 1.0625rem; /* 17px reading text */
  --lh-body: 1.6;  --lh-head: 1.12;  --lh-display: 1.07;
  --measure: 68ch;     /* reading text: 62 to 72ch */

  /* ---- Space: 8px scale (4px half-step) ---- */
  --sp-half: 4px;  --sp-1: 8px;  --sp-2: 16px;  --sp-3: 24px;  --sp-4: 32px;  --sp-5: 40px;
  --sp-6: 48px;  --sp-8: 64px;  --sp-12: 96px;

  /* ---- Grid: 12 columns ---- */
  --container: 1200px;
  --gutter: 24px;
  --bp-sm: 480px;  --bp-md: 768px;  --bp-lg: 1100px;  --bp-xl: 1280px;  /* documented; media queries use the literals */

  /* ---- Shape ---- */
  --r-1: 8px;  --r-2: 12px;  --r-3: 20px;
  --bd: 1px solid var(--line);
  --bd-strong: 1px solid var(--line-strong);

  /* ---- Elevation (3 levels) ---- */
  --e-1: 0 1px 2px rgba(26, 35, 50, 0.06), 0 1px 1px rgba(26, 35, 50, 0.04);
  --e-2: 0 4px 12px rgba(26, 35, 50, 0.08), 0 2px 4px rgba(26, 35, 50, 0.05);
  --e-3: 0 24px 56px rgba(26, 35, 50, 0.16), 0 6px 16px rgba(26, 35, 50, 0.08);

  /* ---- Motion: three durations, one curve ---- */
  --d-fast: 120ms;  --d-base: 200ms;  --d-slow: 320ms;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);

  /* ---- Focus ---- */
  --focus: 0 0 0 2px var(--surface), 0 0 0 4px var(--accent-ink);

  /* ---- Legacy aliases (older pages) ---- */
  --teal: var(--accent);
  --teal-dark: var(--accent-ink);
  --teal-soft: var(--accent-soft);
  --muted: var(--ink-3);
  --paper: var(--surface-2);
  --white: var(--surface);
  --heading: var(--font-head);
  --body: var(--font-body);
  --am-navy: var(--navy);
  --am-teal: var(--accent);
  --am-teal-text: var(--accent-ink);
  --am-teal-soft: var(--accent-soft);
  --am-line: var(--line);
  --am-muted: var(--ink-2);
  --am-header: 64px;
}

@media (max-width: 640px) {
  :root { --gutter: 16px; }
}

/* ---------------------------------------------------------------- Type system
   Display 300, h2 and body 400, h3 / labels / buttons 600. Numerals in prices and counters are tabular.
   The overrides below re-point the older hard-coded families in chrome.css (loaded before this file). */
.am-skip, .am-header, .am-nav a, .am-trigger, .am-cta a, .am-search, .am-pal-box, .am-pal-input, .am-pal-grp, .am-pal-type, .am-footer { font-family: var(--font-body); }
.am-brand-name, .am-btn, .am-footer h2, .am-foot-brand { font-family: var(--font-head); }
.am-brand-name { font-weight: var(--w-strong); letter-spacing: -0.02em; }
.am-btn, .am-footer h2, .am-foot-brand { font-weight: var(--w-strong); }
svg text[font-family^="Sora"] { font-family: var(--font-head); font-weight: 600; }
.amount, .price-big, .pricing-price, .metrics strong, .c-stat-v, .vz-counter b, .vz-calc-out b, .tnum, [data-count], time, table td, table th { font-variant-numeric: tabular-nums lining-nums; }
code, kbd, samp, pre { font-variant-numeric: normal; }
