/* ---- tokens/fonts.css ---- */
/* AKS Autoglass webfonts.
   SUBSTITUTION NOTE: no font binaries were supplied with the brand assets.
   The AKS wordmark is a heavy italic condensed industrial sans; Barlow Condensed
   (Google Fonts) is the closest freely-licensed match, used for display.
   Barlow covers UI/body; JetBrains Mono covers data/spec readouts. */
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,500;0,600;0,700;1,700;1,800&family=Barlow:ital,wght@0,400;0,500;0,600;0,700;1,600&family=JetBrains+Mono:wght@400;600&display=swap");

/* ---- tokens/colors.css ---- */
:root{
  --aks-orange:#F26522;
  --aks-orange-600:#D9520F;
  --aks-orange-700:#B0410B;
  --aks-orange-400:#FF8447;
  --aks-orange-300:#FFA678;
  --aks-orange-100:#FFE3D5;
  --aks-orange-050:#FFF3EC;

  --ink-000:#000000;
  --ink-900:#0D0D0D;
  --ink-850:#141414;
  --ink-800:#1B1B1B;
  --ink-700:#242424;
  --ink-600:#333333;
  --ink-500:#4D4D4D;
  --ink-400:#6E6E6E;
  --ink-300:#9A9A9A;
  --ink-200:#C4C4C4;
  --ink-100:#E4E3E1;
  --ink-050:#F2F1EF;
  --ink-025:#F8F7F5;
  --white:#FFFFFF;

  /* Brushed-metal / glass tint from the logo's windscreen mark.
     Only for glass + chrome illustration accents. */
  --chrome-400:#8E9499;
  --chrome-200:#C9CDD1;
  --glass-tint:#D7E2E4;

  --success:#2E7D4F;
  --success-bg:#E8F3EC;
  --warning:#C98A00;
  --warning-bg:#FDF3DC;
  --danger:#C0341B;
  --danger-bg:#FBE9E5;
  --info:#2C6E8F;
  --info-bg:#E7F1F6;

  --surface-page:var(--white);
  --surface-page-alt:var(--ink-025);
  --surface-card:var(--white);
  --surface-card-alt:var(--ink-050);
  --surface-inverse:var(--ink-900);
  --surface-inverse-alt:var(--ink-800);
  --surface-inverse-card:var(--ink-850);
  --surface-accent:var(--aks-orange);
  --surface-accent-soft:var(--aks-orange-050);

  --text-heading:var(--ink-900);
  --text-body:var(--ink-600);
  --text-muted:var(--ink-400);
  --text-accent:var(--aks-orange-600);
  --text-on-accent:var(--white);
  --text-on-inverse:var(--white);
  --text-on-inverse-muted:var(--ink-300);

  --border-subtle:var(--ink-100);
  --border-strong:var(--ink-900);
  --border-inverse:#2E2E2E;
  --border-accent:var(--aks-orange);
  --rule-hairline:1px; /* @kind spacing */
  --rule-bold:3px; /* @kind spacing */

  --action-primary:var(--aks-orange);
  --action-primary-hover:var(--aks-orange-600);
  --action-primary-active:var(--aks-orange-700);
  --focus-ring:var(--aks-orange);
}

/* ---- tokens/typography.css ---- */
:root{
  --font-display:"Barlow Condensed","Oswald","Arial Narrow",sans-serif;
  --font-body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;

  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-semibold:600; /* @kind font */
  --fw-bold:700; /* @kind font */
  --fw-black:800; /* @kind font */

  /* Display: condensed, uppercase, tight. Italic reserved for hero/impact. */
  --fs-display-1:96px; --lh-display-1:0.88; /* @kind font */ --ls-display-1:-0.02em; /* @kind font */
  --fs-display-2:72px; --lh-display-2:0.90; /* @kind font */ --ls-display-2:-0.015em; /* @kind font */
  --fs-display-3:54px; --lh-display-3:0.94; /* @kind font */ --ls-display-3:-0.01em; /* @kind font */
  --fs-h1:40px;  --lh-h1:1.0; /* @kind font */
  --fs-h2:30px;  --lh-h2:1.06; /* @kind font */
  --fs-h3:23px;  --lh-h3:1.12; /* @kind font */

  /* Body */
  --fs-lead:19px;   --lh-lead:1.55; /* @kind font */
  --fs-body:16px;   --lh-body:1.6; /* @kind font */
  --fs-body-sm:14px;--lh-body-sm:1.55; /* @kind font */
  --fs-caption:12px;--lh-caption:1.45; /* @kind font */

  /* Eyebrow / label — mono or condensed, wide tracking */
  --fs-eyebrow:12px; --ls-eyebrow:0.18em; /* @kind font */
  --fs-label:13px;   --ls-label:0.06em; /* @kind font */
  --fs-data:14px;    --ls-data:0.02em; /* @kind font */

  --text-heading-style:uppercase; /* @kind other */
}

/* ---- tokens/spacing.css ---- */
:root{
  --space-0:0px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:40px;
  --space-9:56px;
  --space-10:72px;
  --space-11:96px;
  --space-12:128px;

  --gutter:24px;
  --page-pad:40px;
  --page-pad-mobile:20px;
  --section-y:96px;
  --section-y-tight:56px;
  --container-max:1280px;
  --measure:64ch; /* @kind spacing */
  --grid-cols:12; /* @kind other */
}

/* ---- tokens/radius.css ---- */
:root{
  /* AKS is a hard-edged, industrial brand: squares and slivers, not pills.
     The only pill is the status chip. */
  --radius-0:0px;
  --radius-1:2px;
  --radius-2:4px;
  --radius-3:8px;
  --radius-pill:999px;

  --radius-button:2px;
  --radius-input:2px;
  --radius-card:4px;
  --radius-chip:999px;
  --radius-media:0px;
}

/* ---- tokens/elevation.css ---- */
:root{
  /* Shadows are low, neutral and tight — glass shop, not glossy SaaS. */
  --shadow-0:none;
  --shadow-1:0 1px 2px rgba(13,13,13,0.08);
  --shadow-2:0 2px 8px rgba(13,13,13,0.10);
  --shadow-3:0 10px 28px rgba(13,13,13,0.14);
  --shadow-inset-hairline:inset 0 0 0 1px var(--border-subtle);
  --shadow-accent:0 8px 24px rgba(242,101,34,0.30);

  /* Protection scrim for text over photography */
  --scrim-bottom:linear-gradient(180deg,rgba(13,13,13,0) 0%,rgba(13,13,13,0.75) 70%,rgba(13,13,13,0.92) 100%); /* @kind other */
  --scrim-left:linear-gradient(90deg,rgba(13,13,13,0.90) 0%,rgba(13,13,13,0.55) 55%,rgba(13,13,13,0) 100%); /* @kind other */
  --blur-glass:saturate(120%) blur(14px); /* @kind other */
}

/* ---- tokens/motion.css ---- */
:root{
  --dur-instant:90ms; /* @kind other */
  --dur-fast:140ms; /* @kind other */
  --dur-base:220ms; /* @kind other */
  --dur-slow:420ms; /* @kind other */
  --ease-out:cubic-bezier(0.2,0.8,0.2,1); /* @kind other */
  --ease-in-out:cubic-bezier(0.4,0,0.2,1); /* @kind other */
  --ease-mech:cubic-bezier(0.16,1,0.3,1); /* @kind other */
  --press-scale:0.98; /* @kind other */
}

/* ---- tokens/base.css ---- */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--fw-bold);text-transform:uppercase;color:var(--text-heading);margin:0;letter-spacing:-0.01em}
p{margin:0}
a{color:var(--text-accent);text-decoration:none;border-bottom:1px solid transparent;transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--aks-orange-700);border-bottom-color:var(--aks-orange)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.aks-eyebrow{font-family:var(--font-mono);font-size:var(--fs-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-accent)}

/* ---- styles.css ---- */
@import url("tokens/fonts.css");
@import url("tokens/colors.css");
@import url("tokens/typography.css");
@import url("tokens/spacing.css");
@import url("tokens/radius.css");
@import url("tokens/elevation.css");
@import url("tokens/motion.css");
@import url("tokens/base.css");
