/* Advanced Technologies — Design System tokens (consolidated for WordPress)
   Generated from the design system. Edit upstream tokens, then re-export.
   Order: colors → typography → spacing → base. */

/* ===== tokens/colors.css ===== */
/* Advanced Technologies — Color tokens
   Brand: Navy #303C56 · Steel Blue #577591 · Signal Red #DA2129 */
:root {
  /* ---- Brand: Navy (primary) ---- */
  --navy-950: #141a26;
  --navy-900: #1c2435;
  --navy-800: #232d42;
  --navy-700: #303c56; /* brand base */
  --navy-600: #3c4b6c;
  --navy-500: #4c5e84;
  --navy-400: #6c7c9e;
  --navy-300: #9aa6bf;
  --navy-200: #c3cbdb;
  --navy-100: #e2e6ee;
  --navy-50:  #f1f3f8;

  /* ---- Brand: Steel Blue (secondary) ---- */
  --steel-900: #2f4254;
  --steel-800: #3d5670;
  --steel-700: #496885;
  --steel-600: #577591; /* brand base */
  --steel-500: #6a87a3;
  --steel-400: #88a0b8;
  --steel-300: #abbecf;
  --steel-200: #cfdae4;
  --steel-100: #e7eef3;
  --steel-50:  #f3f7fa;

  /* ---- Brand: Signal Red (accent / action) ---- */
  --red-900: #7e1116;
  --red-800: #9c171d;
  --red-700: #ba1c23;
  --red-600: #da2129; /* brand base */
  --red-500: #e54249;
  --red-400: #ec6a70;
  --red-300: #f29a9e;
  --red-200: #f8c6c8;
  --red-100: #fce6e7;
  --red-50:  #fef4f4;

  /* ---- Neutrals (cool, navy-tinted gray) ---- */
  --neutral-0:   #ffffff;
  --neutral-50:  #f6f8fb;
  --neutral-100: #eef1f6;
  --neutral-200: #e0e5ee;
  --neutral-300: #ccd4e0;
  --neutral-400: #a3aebf;
  --neutral-500: #76829a;
  --neutral-600: #566175;
  --neutral-700: #3e4757;
  --neutral-800: #28303d;
  --neutral-900: #171d27;

  /* ---- Semantic: status ---- */
  --success-600: #1f8a5b;
  --success-100: #dcf3e8;
  --warning-600: #c97a12;
  --warning-100: #fbeed5;
  --danger-600:  #da2129;
  --danger-100:  #fce6e7;
  --info-600:    #577591;
  --info-100:    #e7eef3;

  /* ---- Semantic aliases ---- */
  --color-brand:           var(--navy-700);
  --color-brand-strong:    var(--navy-800);
  --color-accent:          var(--red-600);
  --color-accent-hover:    var(--red-700);
  --color-accent-active:   var(--red-800);

  --surface-page:          var(--neutral-50);
  --surface-card:          var(--neutral-0);
  --surface-raised:        var(--neutral-0);
  --surface-sunken:        var(--neutral-100);
  --surface-inverse:       var(--navy-700);
  --surface-inverse-soft:  var(--navy-800);
  --surface-brand-tint:    var(--navy-50);
  --surface-steel-tint:    var(--steel-50);

  --text-strong:    var(--navy-900);
  --text-body:      var(--neutral-700);
  --text-muted:     var(--neutral-500);
  --text-subtle:    var(--neutral-400);
  --text-on-brand:  var(--neutral-0);
  --text-on-accent: var(--neutral-0);
  --text-link:      var(--steel-700);
  --text-link-hover:var(--navy-700);

  --border-subtle:  var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-brand:   var(--navy-700);
  --border-focus:   var(--steel-600);

  --focus-ring:     0 0 0 3px color-mix(in srgb, var(--steel-600) 45%, transparent);
}


/* ===== tokens/typography.css ===== */
/* Advanced Technologies — Typography tokens */
:root {
  /* Families */
  /* Brand/logo + display: ITC Avant Garde Gothic (licensed, self-hosted). */
  --font-logo:    'ITC Avant Garde Gothic', 'Segoe UI', system-ui, sans-serif;
  --font-display: 'ITC Avant Garde Gothic', 'Segoe UI', system-ui, sans-serif;
  --font-display-condensed: 'ITC Avant Garde Gothic Condensed', 'ITC Avant Garde Gothic', system-ui, sans-serif;
  --font-body:    'Figtree', 'Segoe UI', system-ui, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Weights */
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-extra:    800;

  /* Type scale (1.25 major-third-ish, tuned) */
  --text-2xs: 0.6875rem;  /* 11px */
  --text-xs:  0.75rem;    /* 12px */
  --text-sm:  0.875rem;   /* 14px */
  --text-md:  1rem;       /* 16px base */
  --text-lg:  1.125rem;   /* 18px */
  --text-xl:  1.375rem;   /* 22px */
  --text-2xl: 1.75rem;    /* 28px */
  --text-3xl: 2.25rem;    /* 36px */
  --text-4xl: 2.875rem;   /* 46px */
  --text-5xl: 3.75rem;    /* 60px */
  --text-6xl: 4.75rem;    /* 76px */

  /* Line heights */
  --leading-tight:   1.08;
  --leading-snug:    1.2;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  /* Letter spacing */
  --tracking-tight:  -0.02em;
  --tracking-snug:   -0.01em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-caps:   0.12em;  /* eyebrows / overlines */

  /* Semantic roles */
  --role-logo-font:    var(--font-logo);
  --role-display-font: var(--font-display);
  --role-heading-font: var(--font-display);
  --role-body-font:    var(--font-body);
}


/* ===== tokens/spacing.css ===== */
/* Advanced Technologies — Spacing, radius, shadow, layout tokens */
:root {
  /* Spacing — 4px base grid */
  --space-0:  0;
  --space-1:  0.25rem;  /* 4 */
  --space-2:  0.5rem;   /* 8 */
  --space-3:  0.75rem;  /* 12 */
  --space-4:  1rem;     /* 16 */
  --space-5:  1.5rem;   /* 24 */
  --space-6:  2rem;     /* 32 */
  --space-7:  2.5rem;   /* 40 */
  --space-8:  3rem;     /* 48 */
  --space-9:  4rem;     /* 64 */
  --space-10: 5rem;     /* 80 */
  --space-12: 7rem;     /* 112 */

  /* Radius — restrained, mostly square/soft (IT-utility feel) */
  --radius-none: 0;
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   10px;
  --radius-xl:   16px;
  --radius-2xl:  24px;
  --radius-pill: 999px;

  /* Borders */
  --border-width: 1px;
  --border-width-strong: 2px;

  /* Shadows — cool navy-tinted, low-spread */
  --shadow-xs: 0 1px 2px rgba(23, 29, 39, 0.06);
  --shadow-sm: 0 1px 3px rgba(23, 29, 39, 0.08), 0 1px 2px rgba(23, 29, 39, 0.05);
  --shadow-md: 0 4px 12px rgba(23, 29, 39, 0.09), 0 2px 4px rgba(23, 29, 39, 0.05);
  --shadow-lg: 0 12px 28px rgba(23, 29, 39, 0.12), 0 4px 10px rgba(23, 29, 39, 0.06);
  --shadow-xl: 0 24px 56px rgba(23, 29, 39, 0.16), 0 8px 18px rgba(23, 29, 39, 0.08);
  --shadow-focus: var(--focus-ring);

  /* Layout */
  --container-sm: 640px;
  --container-md: 880px;
  --container-lg: 1120px;
  --container-xl: 1320px;
  --header-height: 72px;

  /* Motion */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 200ms; /* @kind other */
  --duration-slow: 320ms; /* @kind other */
}


/* ===== tokens/base.css ===== */
/* Advanced Technologies — Base element defaults
   Lightweight resets + brand defaults. Consumers get sane typography for free. */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-md);
  line-height: var(--leading-normal);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  color: var(--text-strong);
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  margin: 0 0 0.5em;
  text-wrap: balance;
}
h1 { font-size: var(--text-4xl); }
h2 { font-size: var(--text-3xl); }
h3 { font-size: var(--text-2xl); }
h4 { font-size: var(--text-xl); }

p { margin: 0 0 1em; text-wrap: pretty; }

a {
  color: var(--text-link);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-standard);
}
a:hover { color: var(--text-link-hover); }

code, kbd, samp, pre { font-family: var(--font-mono); font-size: 0.92em; }

/* Eyebrow / overline — recurring brand device */
.at-eyebrow {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--color-accent);
}

::selection { background: color-mix(in srgb, var(--steel-600) 28%, transparent); }

:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }


