/* ==========================================================================
   ContractLab — Design Tokens
   Signature motif: the tied case file. Indian legal chambers bundle and
   tie files with red tape ("laal fita") before they move between desks.
   That ribbon is used here as the literal thread connecting journey
   stages — not decoration, but a structural device that encodes progress.
   ========================================================================== */

:root {
  /* ---- Color: named, not generic ---- */
  --navy-deep:     #0A1626;  /* hero / darkest ground */
  --navy:          #12233F;  /* primary ink surfaces, nav */
  --navy-soft:     #1C3358;  /* hover / raised navy */

  --parchment:      #F6F1E7; /* page ground — brief paper */
  --parchment-dark: #ECE4D2; /* recessed card ground */
  --parchment-line: #DCD2B8; /* hairline on parchment */

  --tape:           #9C3B3B; /* the red tape — signature accent, used sparingly */
  --tape-dark:      #7A2C2C;
  --tape-tint:      #F2DEDE;

  --brass:          #A98544; /* authority / seal / active marker */
  --brass-light:    #C7A566;
  --brass-tint:     #F1E6CC;

  --teal:           #2F5D58; /* secondary accent — current position, links */
  --teal-dark:      #21433F;
  --teal-tint:      #DCE9E6;

  --ink:            #201C16; /* body text, warm black */
  --ink-soft:       #57503F; /* secondary text */
  --ink-faint:      #8A8168; /* tertiary / captions */

  --white:          #FFFCF6;

  --success:        #3D6B4C;
  --warn:            #9C6B2E;
  --danger:          #9C3B3B;

  /* ---- Type ---- */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:    'IBM Plex Mono', 'Courier New', monospace;

  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-md:   1.125rem;
  --fs-lg:   1.375rem;
  --fs-xl:   1.75rem;
  --fs-2xl:  2.25rem;
  --fs-3xl:  3rem;
  --fs-4xl:  4rem;

  /* ---- Spacing (8px base) ---- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;

  /* ---- Shape / elevation ---- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;

  --shadow-card: 0 1px 2px rgba(10, 22, 38, 0.06), 0 4px 16px rgba(10, 22, 38, 0.06);
  --shadow-raised: 0 2px 4px rgba(10, 22, 38, 0.08), 0 12px 32px rgba(10, 22, 38, 0.12);

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
}