/* FRAZ shared tokens — canonical copy embedded identically in every bundle page.
   Approved 29–30 October 2026. Page composition and approved exceptions stay local.
   Layer order is declared before page CSS. Existing unlayered page rules remain
   during migration; never use this foundation to conceal competing declarations. */
@layer tokens, base, components, page;
@layer tokens {
  :root {
    --fraz-color-bg: #080b14;
    --fraz-color-panel: #0c111d;
  --fraz-color-card: #0d111b;
    --fraz-color-text: #f1f5f9;
    --fraz-color-muted: #b0bcc8;
    --fraz-color-quiet: #8e9baa;
    --fraz-color-line: rgba(148,163,184,.18);
    --fraz-color-line-strong: rgba(148,163,184,.26);
    --fraz-tint-strong-amount:16%;
    --fraz-color-ice: #b8dbf7;
    --fraz-color-ice-hover: #d1e9ff;
    --fraz-color-steel: #7da8bc;
    --fraz-color-steel-hover: #8eb5c8;
    --fraz-color-light-blue: #8fb7ff;
    --fraz-color-light-blue-hover: #a6c7ff;
    --fraz-color-lavender: #c4b5fd;
    --fraz-color-lavender-hover: #d1c6fe;
    --fraz-color-gold: #c9b458;
    --fraz-color-gold-hover: #d7c576;
    --fraz-color-coral: #b86a58;
    --fraz-color-coral-hover: #d48a7a;
    --fraz-heading-font: "Fraz Fraunces Variable",Georgia,serif;
    --fraz-body-font: "Fraz Sourcesans 3",Arial,sans-serif;
    --fraz-mono-font: "Fraz Jetbrainsmono",monospace;
    --fraz-type-display-size: 88px;
    --fraz-type-display-leading: .88;
    --fraz-type-display-tracking: -.05em;
    --fraz-type-legal-title-size: 60px;
    --fraz-type-legal-title-leading: 1.05;
    --fraz-type-heading-size: 52px;
    --fraz-type-heading-leading: 1.05;
    --fraz-type-heading-tracking: -.04em;
    --fraz-type-service-title-size: 32px;
    --fraz-type-service-title-leading: 1.15;
    --fraz-type-service-title-tracking: -.02em;
    --fraz-type-card-title-size: 24px;
    --fraz-type-card-leading: 1.1;
    --fraz-type-card-tracking: -.02em;
    --fraz-type-card-dense-leading: 1.15;
    --fraz-type-card-dense-tracking: -.02em;
    --fraz-type-meta-size: 12px;
    --fraz-type-meta-leading: 1.5;
    --fraz-type-label-leading: 1.5;
    --fraz-type-brand-size: 22px;
    --fraz-type-subheading-size: 20px;
    --fraz-type-subheading-leading: 1.2;
    --fraz-type-lead-size: 23.2px;
    --fraz-type-lead-leading: 1.6;
    --fraz-type-lead-tracking: -.01em;
    --fraz-type-body-size: 18px;
    --fraz-type-body-small-size: 16px;
    --fraz-type-body-leading: 1.5;
    --fraz-type-label-size: 14px;
    --fraz-type-label-tracking: .3em;
    --fraz-type-control-size: 12px;
    --fraz-type-control-leading: 1.2;
    --fraz-type-control-tracking: .12em;
    --fraz-type-control-weight: 600;
    --fraz-type-navigation-size: 14px;
    --fraz-type-navigation-tracking: .1em;
    --fraz-type-fine-size: 13px;
    --fraz-weight-regular: 400;
    --fraz-space-micro: 4px;
    --fraz-space-tight: 8px;
    --fraz-space-compact: 12px;
    --fraz-space-small: 16px;
    --fraz-space-group: 24px;
    --fraz-space-stack: 32px;
    --fraz-space-wide: 40px;
    --fraz-space-block: 48px;
    --fraz-space-large: 64px;
    --fraz-space-section-tablet: 88px;
    --fraz-space-hero-desktop: 96px;
    --fraz-space-section-desktop: 112px;
    --fraz-layout-container: 1200px;
    --fraz-layout-axis: 1136px;
    --fraz-layout-gutter: 32px;
    --fraz-layout-title-measure: 14ch;
    --fraz-layout-lead-measure: 461px;
    --fraz-layout-legal-measure: 72ch;
    --fraz-layout-hero-top: 96px;
    --fraz-layout-label-gap: 32px;
    --fraz-layout-title-lead-gap: 48px;
    --fraz-layout-lead-action-gap: 40px;
    --fraz-layout-heading-text-gap: 32px;
    --fraz-layout-section-gap: 112px;
    --fraz-layout-panel-space: 48px;
    --fraz-layout-header-height: 80px;
    --fraz-line-hairline: 1px;
    --fraz-line-frame: 2px;
    --fraz-line-accent: 3px;
    --fraz-focus-offset: 4px;
    --fraz-radius: 0;
    --fraz-control-height: 48px;
    --fraz-navigation-control-height: 44px;
    --fraz-motion-feedback: 180ms;
    --fraz-motion-reveal: 560ms;
    --fraz-motion-distance: 16px;
    --fraz-motion-stagger: 60ms;
    --fraz-motion-stagger-limit: 120ms;
    --fraz-motion-ease: cubic-bezier(.2,.65,.3,1);
    /* Existing shared consumers: these declarations now have one owner. */
    --fraz-footer-content-max: var(--fraz-layout-axis);
    --fraz-footer-gutter: var(--fraz-layout-gutter);
    --fraz-footer-legal-size: 11px;
    --fraz-footer-legal-weight: var(--fraz-weight-regular);
    --fraz-footer-legal-leading: var(--fraz-type-body-leading);
    --fraz-footer-legal-tracking: .04em;
    --fraz-footer-legal-font: var(--fraz-body-font);
    --fraz-footer-link-height: 28px;
    --fraz-footer-link-padding: 6px;
    --accents--ice: var(--fraz-color-ice);
  }
  @media (max-width: 991.98px) {
    :root {
      --fraz-type-display-size: 72px;
      --fraz-type-legal-title-size: 48px;
      --fraz-type-heading-size: 48px;
      --fraz-type-service-title-size: 30px;
      --fraz-type-card-title-size: 22px;
      --fraz-type-card-leading: 1.15;
      --fraz-type-card-tracking: -.015em;
      --fraz-type-brand-size: 20px;
      --fraz-layout-gutter: 24px;
      --fraz-layout-hero-top: 64px;
      --fraz-layout-title-lead-gap: 40px;
      --fraz-layout-section-gap: 88px;
      --fraz-layout-panel-space: 40px;
      --fraz-layout-header-height: 72px;
    }
  }
  @media (max-width: 767.98px) {
    :root {
      --fraz-type-display-size: clamp(40px,11.3vw,50px);
      --fraz-type-display-tracking: -.04em;
      --fraz-type-legal-title-size: 36px;
      --fraz-type-heading-size: 36px;
      --fraz-type-service-title-size: 26px;
      --fraz-type-card-title-size: 20px;
      --fraz-type-card-leading: 1.25;
      --fraz-type-card-tracking: -.01em;
      --fraz-layout-title-measure: 100%;
      --fraz-type-subheading-size: 18px;
      --fraz-type-lead-size: 20px;
      --fraz-type-label-size: 12px;
      --fraz-layout-gutter: 20px;
      --fraz-layout-lead-measure: 100%;
      --fraz-layout-hero-top: 48px;
      --fraz-layout-title-lead-gap: 32px;
      --fraz-layout-lead-action-gap: 32px;
      --fraz-layout-section-gap: 64px;
      --fraz-layout-panel-space: 32px;
      --fraz-motion-stagger: 0ms;
      --fraz-motion-stagger-limit: 0ms;
    }
  }
  /* Scoped accents resolve on the element, so nested sections inherit their own
     family and tints rather than a root-computed colour. No default page accent. */
  [data-fraz-foundation-accent="ice"] { --fraz-color-accent: var(--fraz-color-ice); --fraz-color-accent-hover: var(--fraz-color-ice-hover); }
  [data-fraz-foundation-accent="steel"] { --fraz-color-accent: var(--fraz-color-steel); --fraz-color-accent-hover: var(--fraz-color-steel-hover); }
  [data-fraz-foundation-accent="light-blue"] { --fraz-color-accent: var(--fraz-color-light-blue); --fraz-color-accent-hover: var(--fraz-color-light-blue-hover); }
  [data-fraz-foundation-accent="lavender"] { --fraz-color-accent: var(--fraz-color-lavender); --fraz-color-accent-hover: var(--fraz-color-lavender-hover); }
  [data-fraz-foundation-accent="gold"] { --fraz-color-accent: var(--fraz-color-gold); --fraz-color-accent-hover: var(--fraz-color-gold-hover); }
  [data-fraz-foundation-accent="coral"] { --fraz-color-accent: var(--fraz-color-coral); --fraz-color-accent-hover: var(--fraz-color-coral-hover); }
  [data-fraz-foundation-accent] {
    --fraz-tint-soft: color-mix(in srgb,var(--fraz-color-accent) 8%,transparent);
    --fraz-tint-mid: color-mix(in srgb,var(--fraz-color-accent) 12%,transparent);
    --fraz-tint-strong: color-mix(in srgb,var(--fraz-color-accent) var(--fraz-tint-strong-amount),transparent);
  }
}
