/* ==================================================================
   colors.css — design tokens
   ------------------------------------------------------------------
   The single source of truth for colour on the site. Loaded first, so
   every other stylesheet can reference these variables and no rule
   anywhere else needs a raw hex value. Re-theming happens here only.
   ================================================================== */

:root{

  /* ---- brand blues, dark → light ---- */
  --c-navy-900:#00234b;
  --c-navy-800:#013b78;
  --c-navy-700:#0a5bb0;
  --c-blue-600:#004b98;   /* primary action / link */
  --c-blue-500:#2565a8;   /* primary hover */
  --c-blue-400:#5284b9;   /* eyebrow labels */
  --c-blue-300:#7fb0e6;   /* accents on navy */
  --c-blue-200:#a7ccf2;
  --c-blue-150:#c7d8ec;
  --c-blue-100:#cfe0f3;
  --c-blue-50:#eaf2fb;

  /* ---- text on light ---- */
  --c-ink:#0f1b2d;        /* headings */
  --c-ink-700:#22334a;    /* nav links */
  --c-ink-600:#33455e;
  --c-ink-500:#455568;
  --c-text-muted:#5d6b7e; /* body copy */
  --c-text-faint:#9db2ca; /* placeholder icons */

  /* ---- text on navy ---- */
  --c-on-dark:#ffffff;
  --c-on-dark-strong:#cfe0f3;
  --c-on-dark-muted:#a9c6e6;
  --c-on-dark-faint:#8fa9c6;
  --c-on-dark-dim:#7ea3cc;

  /* ---- surfaces ---- */
  --c-surface:#ffffff;
  --c-surface-tint:#f5f8fc;      /* alternating section background */
  --c-surface-soft:#f2f6fb;      /* hover fill, skeleton blocks */
  --c-surface-soft-hover:#e6eef7;
  --c-surface-field:#f8fafd;     /* form inputs */

  /* ---- borders ---- */
  --c-border:#eef2f8;
  --c-border-strong:#dbe6f4;
  --c-border-field:#e2eaf3;
  --c-border-faint:#f4f7fb;

  /* ---- feedback ---- */
  --c-success-bg:#eaf6ee;
  --c-success-fg:#1f9d55;

  /* ---- translucent white, for use over the navy hero / footer ---- */
  --c-white-05:rgba(255,255,255,.05);
  --c-white-08:rgba(255,255,255,.08);
  --c-white-12:rgba(255,255,255,.12);
  --c-white-14:rgba(255,255,255,.14);
  --c-white-16:rgba(255,255,255,.16);
  --c-white-18:rgba(255,255,255,.18);
  --c-white-22:rgba(255,255,255,.22);
  --c-white-28:rgba(255,255,255,.28);
  --c-white-40:rgba(255,255,255,.40);
  --c-header-bg:rgba(255,255,255,.9);

  /* ---- gradients ---- */
  --g-hero:linear-gradient(135deg,var(--c-navy-900) 0%,var(--c-navy-800) 55%,var(--c-navy-700) 100%);
  --g-brand:linear-gradient(135deg,var(--c-blue-600),var(--c-blue-500));
  --g-navy:linear-gradient(135deg,var(--c-navy-900),var(--c-navy-800));
  --g-rule:linear-gradient(90deg,var(--c-blue-600),var(--c-blue-400));
  --g-hero-glow:radial-gradient(circle,rgba(82,132,185,.55),transparent 65%);

  /* ---- elevation ---- */
  --sh-header:0 10px 30px -14px rgba(0,30,80,.18);
  --sh-drop:0 24px 50px -18px rgba(0,35,90,.28);
  --sh-nav-panel:0 26px 44px -30px rgba(0,30,80,.45);
  --sh-card:0 30px 60px -30px rgba(0,40,100,.35);
  --sh-card-sm:0 26px 50px -28px rgba(0,40,100,.35);
  --sh-card-lg:0 34px 64px -34px rgba(0,40,100,.4);
  --sh-featured:0 30px 60px -28px rgba(0,30,80,.5);
  --sh-cta:0 12px 24px -10px rgba(0,75,152,.7);
  --sh-cta-hover:0 18px 30px -10px rgba(0,75,152,.85);
  --sh-btn-light:0 16px 32px -14px rgba(0,0,0,.5);
  --sh-submit:0 16px 30px -14px rgba(0,75,152,.7);
  --sh-submit-hover:0 22px 38px -14px rgba(0,75,152,.85);
  --sh-form:0 40px 80px -50px rgba(0,40,100,.5);
  --sh-glow-marker:0 0 16px 2px rgba(127,176,230,.6);
  --sh-glow-marker-white:0 0 10px rgba(255,255,255,.55);
  --sh-glow-line:0 0 12px 1px rgba(127,176,230,.6);

  /* ---- layout constants shared by every page ---- */
  --layout-max:1240px;
  --layout-pad:32px;
  --header-h:104px;
  --header-h-mobile:72px;
}
