/* ============================================================
   Acceleon Website - Design Tokens
   tokens.css  (v1, locked 2026-07)
   ------------------------------------------------------------
   Single source of truth for colour, type and spacing.
   Base = shared house colours used on every page.
   Accent = one theme per solution family, switched by the
   [data-accent="..."] attribute on any wrapping element.
   ============================================================ */

:root{
  /* ---- Brand base (shared, never overridden) ---- */
  --navy:        #07213E;   /* Acceleon Navy - primary ink + dark panels */
  --navy-2:      #173C67;   /* Deep Blue - secondary dark surface */
  --green:       #2ACA8B;   /* Mint Green - house accent / gradients */
  --green-deep:  #0A855C;   /* Mint text-on-white (AA) */
  --green-tint:  #E7F9F1;

  /* ---- Neutrals ---- */
  --slate:       #566B82;   /* Dark Grey - muted text */
  --grey-line:   #DFE3ED;   /* borders / rules */
  --grey-100:    #F0F4FD;   /* Light Grey - section wash */
  --grey-50:     #F4F7FF;   /* page background */
  --white:       #FFFFFF;

  /* ---- Semantic text ---- */
  --ink:         var(--navy);
  --ink-muted:   var(--slate);
  --on-dark:     #FFFFFF;
  --on-dark-mut: #9BB4CF;

  /* ---- Typography ---- */
  --font-head: "Roboto Slab", Georgia, serif;
  --font-body: "Open Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-product: "Manrope", system-ui, sans-serif;   /* product names / logo wordmark suffix */
  --fs-hero:   clamp(32px, 4.4vw, 54px);
  --fs-h1:     clamp(28px, 3.4vw, 40px);
  --fs-h2:     clamp(22px, 2.4vw, 30px);
  --fs-h3:     20px;
  --fs-body:   16px;
  --fs-small:  14px;
  --lh-tight:  1.15;
  --lh-body:   1.6;

  /* ---- Spacing / radius / shadow ---- */
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 40px;
  --sp-5: 64px; --sp-6: 96px;
  --radius:   14px;
  --radius-sm: 8px;
  --radius-pill: 999px;
  --shadow-1: 0 1px 2px rgba(7,33,62,.06), 0 6px 20px rgba(7,33,62,.06);
  --shadow-2: 0 10px 40px rgba(7,33,62,.12);
  --maxw: 1160px;

  /* ---- Accent default (falls back to house green) ----
     Any element with a [data-accent] value below overrides these. */
  --accent:        var(--green);
  --accent-deep:   var(--green-deep);
  --accent-on-dark:#3EE0A0;
  --accent-tint:   var(--green-tint);
}

/* ============================================================
   Accent themes - one per solution family.
   Apply on a wrapper, e.g. <section data-accent="fraud"> ...
   All descendants pick up the accent via the vars below.
   ============================================================ */

[data-accent="collections"]{        /* Collections / AR / Skip Tracing (flagship) */
  --accent:        #2ACA8B;
  --accent-deep:   #0A855C;
  --accent-on-dark:#3EE0A0;
  --accent-tint:   #E7F9F1;
}

[data-accent="fraud"]{              /* Fraud Detection & Investigations */
  --accent:        #F5566B;
  --accent-deep:   #D63B54;
  --accent-on-dark:#FF7183;
  --accent-tint:   #FFECEF;
}

[data-accent="list-finder"]{        /* List Finder (Real Estate) */
  --accent:        #0066CC;
  --accent-deep:   #0052A6;
  --accent-on-dark:#4D97E6;
  --accent-tint:   #E6F0FB;
}

[data-accent="data"]{               /* Data Cleaning & Enrichment */
  --accent:        #7B61FF;
  --accent-deep:   #5E45E0;
  --accent-on-dark:#A18CFF;
  --accent-tint:   #EFECFF;
}

[data-accent="asic"]{               /* ASIC / Compliance & Verification */
  --accent:        #F5A623;
  --accent-deep:   #8A5A00;
  --accent-on-dark:#FFC15C;
  --accent-tint:   #FEF3E0;
}

[data-accent="consulting"]{         /* Consulting / Integration (Acceleon Australia) */
  --accent:        #0FB5C9;
  --accent-deep:   #0A7581;
  --accent-on-dark:#35D3E4;
  --accent-tint:   #E4F7FA;
}

[data-accent="lockbox"]{            /* Lock Box (secure data clean room for PII) */
  --accent:        #9D2BB0;
  --accent-deep:   #7E2090;
  --accent-on-dark:#C579D6;
  --accent-tint:   #F6EAF9;
}
