/* Nyx tokens: the Agent-design-1 hero tokens (design-systems/systems/epiminds, observed from the epiminds.com hero),
   with Nyx's stage colour and a single mono face for every type role. */
/* Nyx uses one face for every word: Azeret Mono (SIL OFL 1.1, assets/fonts/AzeretMono-OFL.txt), variable 100 to 900. */
@font-face { font-family: "Nyx Mono"; src: url("../assets/fonts/AzeretMono-Variable.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }

:root {
  /* Colour */
  --ah-color-stage: #04030a;               /* Nyx: violet-black stage, fog and loader screen */
  --ah-color-loader-page: #04030a;         /* page behind the loader screen */
  --ah-color-ink-inverse: #ffffff;         /* text on the stage */
  --ah-color-ink: #000000;                 /* text on light surfaces */
  --ah-color-surface-light: #ffffff;       /* solid CTA, mobile menu, exit overlay */
  --ah-color-header-scrim: rgba(0, 0, 0, 0.1);      /* #0000001a */
  --ah-color-hairline-on-dark: rgba(255, 255, 255, 0.2);  /* #ffffff33 */
  --ah-color-hairline-on-light: rgba(0, 0, 0, 0.2);       /* #00000033 */
  --ah-color-loader-track: rgba(255, 255, 255, 0.05);     /* #ffffff0d */
  --ah-color-loader-progress: #ffffff;
  --ah-color-shade: rgba(0, 0, 0, 0.5);    /* bottom edge of the hero (bg.png / bg3.png gradients, max alpha 128) */
  /* Scene (WebGL) */
  --ah-scene-light: #520bff;               /* all nine point lights */
  --ah-scene-persona: #f7b0ff;             /* persona colour and emissive */
  --ah-scene-saturation: -0.67;            /* post-process saturation */

  /* Type */
  --nyx-mono: "Nyx Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --ah-font-sans: var(--nyx-mono);
  --ah-font-label: var(--nyx-mono);
  --ah-font-serif: var(--nyx-mono);
  --ah-font-loader: var(--nyx-mono);
  --ah-text-body: 16px;                    /* nav links, buttons */
  --ah-text-label: 12px;                   /* hero label (10px at 480px and below) */
  --ah-text-label-mobile: 10px;
  --ah-text-title: 72px;                   /* 48px at 992px and below, 32px at 480px and below */
  --ah-text-title-tablet: 48px;
  --ah-text-title-mobile: 32px;
  --ah-text-loader: 18px;
  --ah-tracking-label: 1px;
  --ah-tracking-title: -0.02em;
  --ah-leading: 1;                         /* reference resets body line-height to 1 */

  /* Space and size */
  --ah-header-height: 75px;                /* every reference block has a 75px minimum height */
  --ah-header-padding-x: 40px;             /* 24px at 480px and below */
  --ah-header-padding-x-mobile: 24px;
  --ah-header-max-width: 1600px;
  --ah-nav-gap: 40px;
  --ah-nav-end-padding: 32px;
  --ah-logo-width: 49px;                   /* the NYX wordmark */
  --ah-copy-left: 5vw;                     /* 24px at 480px and below */
  --ah-copy-bottom: 5vh;                   /* 12vh at 480px and below */
  --ah-label-gap: 20px;                    /* 12px at 992px and below */
  --ah-name-gap: 6px;
  --ah-button-padding-y: 12px;
  --ah-button-padding-x: 24px;
  --ah-button-gap: 8px;
  --ah-button-height: 56px;                /* hero CTA: 46px at 992px and below */
  --ah-button-height-tablet: 46px;
  --ah-header-cta-width: 230px;            /* 250px at 992px and below; flex-shrinks in the row */
  --ah-header-cta-width-tablet: 250px;
  --ah-menu-button-size: 36px;
  --ah-hero-height: 160dvh;
  --ah-hero-marker: 120dvh;                /* copy fades once this passes the bottom of the viewport */
  --ah-loader-size: 242px;

  /* Shape and effect */
  --ah-radius: 12px;
  --ah-radius-round: 999px;
  --ah-header-blur: 30px;
  --ah-hairline: 1px;

  /* Motion (observed timing; springs are solved to linear() curves in components/agent-hero.mjs) */
  --ah-ease-in-out: cubic-bezier(0.42, 0, 0.58, 1); /* framer easeInOut */
  --ah-duration-exit: 500ms;               /* white exit overlay, easeInOut */
  --ah-duration-label: 600ms;              /* label slide-in, easeInOut, 100ms delay */
  --ah-duration-loader-fade: 300ms;        /* declared transition on the loader wrapper */
  --ah-z-header: 9999999;
  --ah-z-hero: 9999;
}
