/* Enginir tokens · generated from the ENGINIR Figma file (Enginir/Semantic, Scale, Motion) */

@font-face { font-family: "SUSE"; src: url("/fonts/suse-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "SUSE"; src: url("/fonts/suse-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "SUSE"; src: url("/fonts/suse-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "SUSE Mono"; src: url("/fonts/suse-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "SUSE Mono"; src: url("/fonts/suse-mono-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  /* Semantic color */
  --en-surface-base: #F7F7F7;
  --en-surface-raised: #FFFFFF;
  --en-surface-sunken: #EFEFEF;
  --en-surface-inverse: #181818;
  --en-text-primary: #181818;
  --en-text-secondary: #525252;
  --en-text-muted: #A1A1A1;
  --en-text-inverse: #F7F7F7;
  --en-line-hairline: #E3E3E3;
  --en-line-strong: #181818;
  --en-mark-ink: #181818;
  --en-action-primary-bg: #181818;
  --en-action-primary-fg: #F7F7F7;
  --en-action-secondary-bg: #FFFFFF;
  --en-status-available: #2FBF71;
  --en-status-available-soft: #D9F3E5;

  /* Space + radius */
  --en-space-1: 0.25rem;  --en-space-2: 0.5rem;  --en-space-3: 0.75rem; --en-space-4: 1rem;
  --en-space-6: 1.5rem; --en-space-8: 2rem; --en-space-12: 3rem; --en-space-16: 4rem; --en-space-24: 6rem;
  --en-radius-sm: 0.375rem; --en-radius-md: 0.625rem; --en-radius-lg: 1rem; --en-radius-xl: 1.5rem; --en-radius-pill: 62.4375rem;

  /* Type */
  --en-font-sans: "SUSE", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --en-font-mono: "SUSE Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Motion */
  --en-motion-duration-instant: 120ms;
  --en-motion-duration-fast: 200ms;
  --en-motion-duration-base: 450ms;
  --en-motion-duration-slow: 700ms;
  --en-motion-duration-focus: 820ms;
  --en-motion-stagger-letter: 70ms;
  --en-motion-stagger-word: 90ms;
  --en-motion-stagger-block: 110ms;
  --en-motion-blur-in: 12px;
  --en-motion-blur-out: 8px;
  --en-motion-offset-y: 0.5rem;
  --en-motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --en-motion-ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --en-motion-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --en-motion-ease-snap: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Text styles (Enginir/*) */
.logo-wordmark  { font: 600 4rem/1 var(--en-font-sans); letter-spacing: 0; }
.display-xl     { font: 600 4.5rem/0.94 var(--en-font-sans); letter-spacing: -0.015em; text-transform: uppercase; }
.display-l      { font: 600 3.25rem/0.96 var(--en-font-sans); letter-spacing: -0.01em; text-transform: uppercase; }
.heading-l      { font: 600 2rem/1.05 var(--en-font-sans); letter-spacing: -0.005em; text-transform: uppercase; }
.heading-m      { font: 500 1.5rem/1.15 var(--en-font-sans); text-transform: uppercase; }
.heading-s      { font: 500 1.125rem/1.25 var(--en-font-sans); letter-spacing: 0.01em; text-transform: uppercase; }
.body-l         { font: 400 1.125rem/1.5 var(--en-font-sans); letter-spacing: -0.005em; }
.body-m         { font: 400 1rem/1.5 var(--en-font-sans); }
.body-s         { font: 400 0.875rem/1.45 var(--en-font-sans); }
.label-button   { font: 500 0.9375rem/1 var(--en-font-sans); }
.label-eyebrow  { font: 500 0.75rem/1.2 var(--en-font-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.mono-meta      { font: 400 0.8125rem/1.4 var(--en-font-mono); }
.mobile-display { font: 600 2.125rem/0.98 var(--en-font-sans); letter-spacing: -0.01em; text-transform: uppercase; }
.mobile-heading { font: 600 1.5rem/1.1 var(--en-font-sans); letter-spacing: -0.005em; text-transform: uppercase; }