/*
  Shared color tokens for blog.css, careers.css, hubspot-form.css,
  architecture.css, 404.css, bunker.css, eula.css, gatekeeper.css, and
  castle.css. Loaded (via <helmet>) by every page that loads any of those
  nine — every blog-*.html post, blog.html, careers.html, every
  careers-*.html posting, architectures.html, bunker-architectures.html,
  castle-architectures.html, every architecture-*.html deep dive,
  404.html, bunker.html, bunker-comparison.html, bunker-eula.html,
  castle-eula.html, gatekeeper-eula.html, gatekeeper.html, castle.html,
  and castle-comparison.html — right alongside them.

  These are not sitewide brand tokens (those live in colors_and_type.css:
  `--s70-orange`, `--border-default`, `--bg-1`, etc., synced from the
  design system) — they're a plain opacity ladder over the same two hues
  (brand orange, white) that each of those stylesheets' inline-style
  extraction produced independently of the others. Consolidated here once
  the token sets turned out to overwhelmingly duplicate the same values
  under different names (e.g. `--blog-orange-35`, `--careers-orange-35`,
  and `--hsform-orange-35` were all `rgba(255,64,0,0.35)`) — one
  `--tint-orange-35` now serves all four. Some values are only used by one
  consumer file today (`--tint-input-bg` by hubspot-form.css alone, for
  instance) but stay in this shared file anyway for consistency — the
  point is one place to look, not strict one-token-per-consumer.

  Naming: `--tint-orange-NN` / `--tint-white-NN` are the brand orange /
  white at NN% opacity (rgba, not filter/opacity) — the number is the alpha
  as whole-number percent, not a scale step. `--tint-accent-soft` (#ff7a4d)
  and `--tint-fade` (transparent) are opaque/keyword one-offs kept in the
  same file since they're just as shared across the consumers.
*/

:root {
  --tint-accent-soft: #ff7a4d;
  --tint-fade: transparent;
  --tint-media-bg: #101010;
  --tint-input-bg: #0f0f0f;
  --tint-box-bg: #111111;
  --tint-header-bg: #161616;
  --tint-section-alt-bg: #0b0b0b; /* alternating section background, distinct from --s70-black (#0d0d0d) */
  --tint-ember-box-bg: #161210; /* dark ember-tinted badge/callout background */
  --tint-mask-solid: #000; /* opaque marker for mask-image gradient stops — not a paint color */

  --tint-orange-03: rgba(255,64,0,0.03);
  --tint-orange-04: rgba(255,64,0,0.04);
  --tint-orange-05: rgba(255,64,0,0.05);
  --tint-orange-06: rgba(255,64,0,0.06);
  --tint-orange-08: rgba(255,64,0,0.08);
  --tint-orange-10: rgba(255,64,0,0.10);
  --tint-orange-12: rgba(255,64,0,0.12);
  --tint-orange-14: rgba(255,64,0,0.14);
  --tint-orange-16: rgba(255,64,0,0.16);
  --tint-orange-20: rgba(255,64,0,0.2);
  --tint-orange-22: rgba(255,64,0,0.22);
  --tint-orange-25: rgba(255,64,0,0.25);
  --tint-orange-28: rgba(255,64,0,0.28);
  --tint-orange-35: rgba(255,64,0,0.35);
  --tint-orange-40: rgba(255,64,0,0.4);
  --tint-orange-45: rgba(255,64,0,0.45);
  --tint-orange-50: rgba(255,64,0,0.5);
  --tint-orange-60: rgba(255,64,0,0.6);
  --tint-orange-70: rgba(255,64,0,0.7);
  --tint-orange-80: rgba(255,64,0,0.8);

  --tint-surface-60: rgba(20,20,20,0.6); /* --s70-ink-700 (#141414) at 60% opacity */

  --tint-white-02: rgba(255,255,255,0.02);
  --tint-white-03: rgba(255,255,255,0.03);
  --tint-white-035: rgba(255,255,255,0.035);
  --tint-white-04: rgba(255,255,255,0.04);
  --tint-white-06: rgba(255,255,255,0.06);
  --tint-white-07: rgba(255,255,255,0.07);
  --tint-white-08: rgba(255,255,255,0.08);
  --tint-white-12: rgba(255,255,255,0.12);
  --tint-white-14: rgba(255,255,255,0.14);
  --tint-white-18: rgba(255,255,255,0.18);
  --tint-white-20: rgba(255,255,255,0.2);
  --tint-white-22: rgba(255,255,255,0.22);
  --tint-white-25: rgba(255,255,255,0.25);
  --tint-white-30: rgba(255,255,255,0.3);
  --tint-white-32: rgba(255,255,255,0.32);
  --tint-white-35: rgba(255,255,255,0.35);
  --tint-white-40: rgba(255,255,255,0.4);
  --tint-white-42: rgba(255,255,255,0.42);
  --tint-white-45: rgba(255,255,255,0.45);
  --tint-white-50: rgba(255,255,255,0.5);
  --tint-white-55: rgba(255,255,255,0.55);
  --tint-white-60: rgba(255,255,255,0.6);
  --tint-white-65: rgba(255,255,255,0.65);
  --tint-white-66: rgba(255,255,255,0.66);
  --tint-white-68: rgba(255,255,255,0.68);
  --tint-white-70: rgba(255,255,255,0.7);
  --tint-white-75: rgba(255,255,255,0.75);
  --tint-white-82: rgba(255,255,255,0.82);
  --tint-white-85: rgba(255,255,255,0.85);
  --tint-white-88: rgba(255,255,255,0.88);
  --tint-white-90: rgba(255,255,255,0.9);
}