/* ============================================================
   Mimino Robotics — Design Tokens
   Colors, type, spacing, motion. Editorial restraint.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,300;8..60,400;8..60,500;8..60,600;8..60,700&family=JetBrains+Mono:wght@400;500&display=swap');

/* ------------------------------------------------------------
   Brand-uploaded "Google Sans" — single family, three subsets
   (Latin, Latin-Extended, Georgian) selected by unicode-range.
   ------------------------------------------------------------ */

/* ── Weight 400 ─────────────────────────────────────────── */
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/google-sans-latin-400-normal.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Google Sans"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/google-sans-latin-400-italic.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/google-sans-latin-ext-400-normal.ttf") format("truetype");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Google Sans"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/google-sans-latin-ext-400-italic.ttf") format("truetype");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/google-sans-georgian-400-normal.ttf") format("truetype");
  unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }
@font-face { font-family: "Google Sans"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/google-sans-georgian-400-italic.ttf") format("truetype");
  unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }

/* ── Weight 500 ─────────────────────────────────────────── */
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/google-sans-latin-500-normal.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Google Sans"; font-style: italic; font-weight: 500; font-display: swap;
  src: url("fonts/google-sans-latin-500-italic.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/google-sans-latin-ext-500-normal.ttf") format("truetype");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Google Sans"; font-style: italic; font-weight: 500; font-display: swap;
  src: url("fonts/google-sans-latin-ext-500-italic.ttf") format("truetype");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/google-sans-georgian-500-normal.ttf") format("truetype");
  unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }
@font-face { font-family: "Google Sans"; font-style: italic; font-weight: 500; font-display: swap;
  src: url("fonts/google-sans-georgian-500-italic.ttf") format("truetype");
  unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }

/* ── Weight 600 ─────────────────────────────────────────── */
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("fonts/google-sans-latin-600-normal.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("fonts/google-sans-latin-ext-600-normal.ttf") format("truetype");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("fonts/google-sans-georgian-600-normal.ttf") format("truetype");
  unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }

/* ── Weight 700 ─────────────────────────────────────────── */
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("fonts/google-sans-latin-700-normal.ttf") format("truetype");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("fonts/google-sans-latin-ext-700-normal.ttf") format("truetype");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Google Sans"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("fonts/google-sans-georgian-700-normal.ttf") format("truetype");
  unicode-range: U+10A0-10FF, U+1C90-1CBF, U+2D00-2D2F; }


:root {
  /* ── Color: Surfaces ─────────────────────────────────────── */
  --color-bg:           #F8F9FA;   /* cool off-white. NEVER #FFFFFF */
  --color-bg-sunk:      #F1F2F4;
  --color-bg-raised:    #FCFCFD;
  --color-paper:        #EFEAE0;

  /* ── Color: Ink (text) ───────────────────────────────────── */
  --color-ink:          #1A1814;
  --color-ink-2:        #4A453E;
  --color-ink-3:        #807A70;
  --color-ink-4:        #B8B2A6;

  /* ── Color: Rule lines ───────────────────────────────────── */
  --color-rule:         #D9D4C9;
  --color-rule-strong:  #1A1814;

  /* ── Color: Accent (Georgian wine red) ───────────────────── */
  --color-accent:       #7B1E1E;
  --color-accent-hover: #5E1616;
  --color-accent-tint:  #F3E5E5;

  /* ── Color: Status ───────────────────────────────────────── */
  --color-positive:     #2E5D3A;
  --color-warning:      #8A6A1F;
  --color-critical:     #7B1E1E;

  /* ── Type: Families ──────────────────────────────────────── */
  --font-serif:    "Source Serif 4", "Tiempos Headline", "GT Sectra", Georgia, serif;
  --font-sans:     "Google Sans", "Inter", "Söhne", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-georgian: "Google Sans", sans-serif;   /* same family covers Georgian */
  --font-mono:     "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* ── Type: Scale ─────────────────────────────────────────── */
  --fs-display-1:  72px;
  --fs-display-2:  56px;
  --fs-h1:         44px;
  --fs-h2:         32px;
  --fs-h3:         24px;
  --fs-h4:         20px;
  --fs-body-lg:    18px;
  --fs-body:       16px;
  --fs-body-sm:    14px;
  --fs-caption:    13px;
  --fs-eyebrow:    12px;
  --fs-micro:      11px;

  --lh-display:    1.05;
  --lh-heading:    1.15;
  --lh-body:       1.55;
  --lh-tight:      1.3;

  --ls-display:    -0.02em;
  --ls-body:       0;
  --ls-eyebrow:    0.14em;

  /* ── Spacing ─────────────────────────────────────────────── */
  --space-1:   4px;  --space-2:   8px;  --space-3:   12px;
  --space-4:  16px;  --space-5:  24px;  --space-6:   32px;
  --space-7:  48px;  --space-8:  64px;  --space-9:   96px;
  --space-10: 128px; --space-11: 192px;

  /* ── Layout ──────────────────────────────────────────────── */
  --col-narrow:   640px;
  --col-text:     760px;
  --col-wide:     1080px;
  --col-max:      1280px;
  --gutter:       32px;

  /* ── Radii ───────────────────────────────────────────────── */
  --radius-0:   0px;
  --radius-1:   2px;
  --radius-2:   4px;
  --radius-pill: 999px;

  /* ── Borders ─────────────────────────────────────────────── */
  --border-hair:    1px solid var(--color-rule);
  --border-strong:  1px solid var(--color-rule-strong);

  /* ── Shadow ──────────────────────────────────────────────── */
  --shadow-0: none;
  --shadow-1: 0 1px 0 rgba(26,24,20,0.04);
  --shadow-2: 0 1px 2px rgba(26,24,20,0.06), 0 0 0 1px rgba(26,24,20,0.04);

  /* ── Motion ──────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    120ms;
  --dur-base:    200ms;
  --dur-slow:    320ms;
}

/* ============================================================
   Semantic resets — typography roles
   ============================================================ */

html {
  background: var(--color-bg);
  color: var(--color-ink);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body { margin: 0; }
::selection { background: var(--color-accent-tint); color: var(--color-ink); }

.display-1, .display-2, h1, h2, h3, h4 {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: var(--ls-display);
  line-height: var(--lh-heading);
  color: var(--color-ink);
  margin: 0;
}
.display-1 { font-size: var(--fs-display-1); line-height: var(--lh-display); }
.display-2 { font-size: var(--fs-display-2); line-height: var(--lh-display); }
h1, .h1 { font-size: var(--fs-h1); }
h2, .h2 { font-size: var(--fs-h2); }
h3, .h3 { font-size: var(--fs-h3); line-height: var(--lh-tight); }
h4, .h4 { font-size: var(--fs-h4); line-height: var(--lh-tight); }

p, .body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-ink);
  margin: 0;
  text-wrap: pretty;
}
.body-lg { font-size: var(--fs-body-lg); line-height: 1.5; }
.body-sm { font-size: var(--fs-body-sm); }

.eyebrow {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--color-ink-2);
}

.caption {
  font-family: var(--font-sans);
  font-size: var(--fs-caption);
  color: var(--color-ink-3);
  line-height: 1.45;
}

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

.ka, .ka-mixed { font-family: var(--font-georgian); }

a {
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out);
}
a:hover { border-bottom-color: var(--color-accent); }
a:active { color: var(--color-accent-hover); }

.rule       { border: 0; border-top: 1px solid var(--color-rule); margin: var(--space-7) 0; }
.rule-heavy { border: 0; border-top: 1px solid var(--color-rule-strong); margin: var(--space-7) 0; }