/* ============================================================
   KACTUS LAB — Design Tokens (tokens.css)
   ============================================================ */

@font-face {
  font-family: 'DIN Condensed';
  src: url('../fonts/DINCondensed-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Myriad Pro';
  src: url('../fonts/MyriadPro-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Raleway';
  src: url('../fonts/Raleway-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --kl-green:           #07AA07;
  --kl-green-600:       #079007;
  --kl-green-700:       #057505;
  --kl-green-100:       #E6F7E6;
  --kl-green-50:        #F2FBF2;
  --kl-black:           #000000;
  --kl-ink:             #111111;
  --kl-white:           #FFFFFF;
  --kl-paper:           #FAFAFA;
  --kl-grey-50:         #F4F4F4;
  --kl-grey-100:        #ECECEC;
  --kl-grey-200:        #DDDDDD;
  --kl-grey-300:        #C4C4C4;
  --kl-grey-400:        #9A9A9A;
  --kl-grey-500:        #6E6E6E;
  --kl-grey-600:        #4A4A4A;
  --kl-grey-700:        #2E2E2E;
  --kl-success:         #07AA07;
  --kl-warning:         #E0A800;
  --kl-danger:          #C8332A;
  --kl-info:            #1D70B8;
  --kl-bg:              var(--kl-white);
  --kl-bg-alt:          var(--kl-grey-50);
  --kl-bg-inverse:      var(--kl-black);
  --kl-fg:              var(--kl-ink);
  --kl-fg-muted:        var(--kl-grey-500);
  --kl-fg-subtle:       var(--kl-grey-400);
  --kl-fg-inverse:      var(--kl-white);
  --kl-border:          var(--kl-grey-200);
  --kl-border-strong:   var(--kl-grey-300);
  --kl-accent:          var(--kl-green);
  --kl-accent-fg:       var(--kl-white);
  --kl-font-display:    'DIN Condensed', 'Oswald', 'Arial Narrow', sans-serif;
  --kl-font-heading:    'Raleway', system-ui, -apple-system, sans-serif;
  --kl-font-body:       'Myriad Pro', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --kl-font-mono:       ui-monospace, 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace;
  --kl-fs-12:    0.75rem;
  --kl-fs-14:    0.875rem;
  --kl-fs-15:    0.9375rem;
  --kl-fs-16:    1rem;
  --kl-fs-18:    1.125rem;
  --kl-fs-20:    1.25rem;
  --kl-fs-24:    1.5rem;
  --kl-fs-30:    1.875rem;
  --kl-fs-36:    2.25rem;
  --kl-fs-48:    3rem;
  --kl-fs-60:    3.75rem;
  --kl-fs-72:    4.5rem;
  --kl-lh-tight:    1.05;
  --kl-lh-snug:     1.2;
  --kl-lh-normal:   1.45;
  --kl-lh-loose:    1.7;
  --kl-ls-tight:    -0.02em;
  --kl-ls-normal:   0;
  --kl-ls-wide:     0.04em;
  --kl-ls-caps:     0.08em;
  --kl-space-2:    2px;
  --kl-space-4:    4px;
  --kl-space-8:    8px;
  --kl-space-12:   12px;
  --kl-space-16:   16px;
  --kl-space-20:   20px;
  --kl-space-24:   24px;
  --kl-space-32:   32px;
  --kl-space-40:   40px;
  --kl-space-48:   48px;
  --kl-space-64:   64px;
  --kl-space-96:   96px;
  --kl-space-128:  128px;
  --kl-radius-0:    0;
  --kl-radius-2:    2px;
  --kl-radius-4:    4px;
  --kl-radius-8:    8px;
  --kl-radius-full: 9999px;
  --kl-shadow-0:     none;
  --kl-shadow-1:     0 1px 2px rgba(0,0,0,0.06), 0 1px 1px rgba(0,0,0,0.04);
  --kl-shadow-2:     0 4px 12px rgba(0,0,0,0.08);
  --kl-shadow-3:     0 12px 32px rgba(0,0,0,0.10);
  --kl-shadow-hover: 0 6px 24px rgba(7,170,7,0.18);
  --kl-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --kl-ease-inout:  cubic-bezier(0.65, 0, 0.35, 1);
  --kl-dur-fast:    140ms;
  --kl-dur-base:    220ms;
  --kl-dur-slow:    360ms;
  --kl-container:       1280px;
  --kl-container-wide:  1440px;
  --kl-gutter:          24px;
}