/* Rajdhani + Inter — Google Fonts (OFL), self-hosted woff2, latin + latin-ext */
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/rajdhani-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/rajdhani-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/rajdhani-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/rajdhani-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/rajdhani-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Rajdhani';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/rajdhani-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/inter-var-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/inter-var-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* Imperio Diesel — color tokens.
   Master-file (logo) values take priority over brief approximations:
   brief Rojo #FF0808 → logo master #E21E1A; crown/facet shade #BC1E1F; logo graphite #313332; flat-logo steel #595352. */
:root{
  /* Brand base */
  --id-red:#E21E1A;          /* Rojo Imperio (logo master) */
  --id-red-deep:#BC1E1F;     /* sombra de faceta (corona / D) */
  --id-red-dark:#962624;     /* faceta más oscura del D */
  --id-black:#111315;        /* Negro técnico */
  --id-graphite:#313332;     /* Grafito (contorno del logo) */
  --id-industrial:#384548;   /* Gris industrial */
  --id-steel:#595352;        /* Gris acero (logo plano) */
  --id-light:#ECEFF0;        /* Gris claro */
  --id-white:#FFFFFF;

  /* Neutral ramp (neutral, derived from black → light) */
  --id-n-950:#0B0C0D;
  --id-n-900:#111315;
  --id-n-850:#181A1C;
  --id-n-800:#1F2224;
  --id-n-700:#2A2D2F;
  --id-n-600:#313332;
  --id-n-500:#5E6466;
  --id-n-400:#8A9093;
  --id-n-300:#B4B9BB;
  --id-n-200:#D6DADB;
  --id-n-100:#ECEFF0;
  --id-n-50:#F6F7F7;

  /* Semantic — surfaces */
  --surface-page:var(--id-white);
  --surface-subtle:var(--id-n-50);
  --surface-muted:var(--id-light);
  --surface-dark:var(--id-black);
  --surface-dark-raised:var(--id-n-850);
  --surface-graphite:var(--id-graphite);
  --surface-industrial:var(--id-industrial);
  --surface-accent:var(--id-red);

  /* Semantic — text */
  --text-strong:var(--id-black);
  --text-body:#2A2D2F;
  --text-muted:#5E6466;
  --text-on-dark:var(--id-white);
  --text-on-dark-muted:#B4B9BB;
  --text-accent:var(--id-red);
  --text-on-accent:var(--id-white);

  /* Semantic — lines */
  --border-subtle:var(--id-n-200);
  --border-strong:var(--id-n-300);
  --border-dark:#2E3234;
  --border-dark-strong:#454A4C;
  --border-accent:var(--id-red);

  /* Interaction */
  --action-primary:var(--id-red);
  --action-primary-hover:var(--id-red-deep);
  --action-primary-press:var(--id-red-dark);
  --action-secondary:var(--id-black);
  --action-secondary-hover:var(--id-graphite);
  --focus-ring:var(--id-red);

  /* Status — kept inside the palette (no green/blue/orange) */
  --status-ok:var(--id-graphite);
  --status-alert:var(--id-red);
  --status-info:var(--id-industrial);

  /* Controlled gradients (black → graphite → gray only) */
  --gradient-dark:linear-gradient(135deg,#111315 0%,#1F2224 55%,#313332 100%); /* @kind other */
  --gradient-graphite:linear-gradient(180deg,#384548 0%,#1F2224 100%); /* @kind other */
  --gradient-red:linear-gradient(135deg,#E21E1A 0%,#BC1E1F 100%); /* @kind other */
  --gradient-steel:linear-gradient(180deg,#ECEFF0 0%,#B4B9BB 100%); /* @kind other */
}
:root{
  --font-display:'Rajdhani','Arial Narrow',sans-serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;

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

  /* Display scale — Rajdhani, uppercase, tight */
  --fs-display-xl:96px; /* @kind font */--lh-display-xl:0.92; /* @kind font */
  --fs-display-l:72px; /* @kind font */--lh-display-l:0.95; /* @kind font */
  --fs-h1:56px; /* @kind font */--lh-h1:1; /* @kind font */
  --fs-h2:40px; /* @kind font */--lh-h2:1.05; /* @kind font */
  --fs-h3:28px; /* @kind font */--lh-h3:1.1; /* @kind font */
  --fs-h4:22px; /* @kind font */--lh-h4:1.15; /* @kind font */
  /* Body — Inter */
  --fs-lead:20px; /* @kind font */--lh-lead:1.5; /* @kind font */
  --fs-body:16px; /* @kind font */--lh-body:1.6; /* @kind font */
  --fs-small:14px; /* @kind font */--lh-small:1.5; /* @kind font */
  --fs-caption:12px; /* @kind font */--lh-caption:1.4; /* @kind font */
  /* Overline / eyebrow — Rajdhani, wide tracking */
  --fs-overline:13px; /* @kind font */--ls-overline:0.32em; /* @kind font */
  --ls-display:0.01em; /* @kind font */--ls-heading:0.02em; /* @kind font */--ls-button:0.08em; /* @kind font */
}
:root{
  /* 4-px base spacing */
  --space-0:0;--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;
  /* Layout */
  --container-max:1240px; /* @kind spacing */--gutter:24px; /* @kind spacing */--grid-cols:12; /* @kind spacing */
  /* Radii — straight or barely rounded */
  --radius-0:0;--radius-1:2px;--radius-2:4px;--radius-3:6px;
  --radius-control:2px;--radius-card:4px;
  /* Angular cut (clip-path) sizes */
  --cut-s:8px; /* @kind spacing */--cut-m:16px; /* @kind spacing */--cut-l:28px; /* @kind spacing */
  /* Strokes */
  --stroke-hair:1px; /* @kind spacing */--stroke-ui:1.5px; /* @kind spacing */--stroke-bar:4px; /* @kind spacing */
  /* Elevation — restrained, neutral */
  --shadow-1:0 1px 2px rgba(17,19,21,.08);
  --shadow-2:0 4px 16px rgba(17,19,21,.10);
  --shadow-3:0 16px 40px rgba(17,19,21,.18);
  --shadow-dark:0 16px 40px rgba(0,0,0,.45);
  --inset-line:inset 0 1px 0 rgba(255,255,255,.06); /* @kind shadow */
  /* Motion — precise, no bounce */
  --ease-out:cubic-bezier(.2,.7,.2,1); /* @kind other */
  --ease-in-out:cubic-bezier(.6,0,.3,1); /* @kind other */
  --dur-fast:120ms; /* @kind other */--dur-base:200ms; /* @kind other */--dur-slow:360ms; /* @kind other */
}
/* Graphic resources as tokens: diagonals (30°/45°), technical grids, brushed texture. Use as background-image. */
:root{
  --pattern-diag-45-dark:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 1px,transparent 1px 14px); /* @kind other */
  --pattern-diag-45-light:repeating-linear-gradient(135deg,rgba(17,19,21,.05) 0 1px,transparent 1px 14px); /* @kind other */
  --pattern-diag-30-dark:repeating-linear-gradient(120deg,rgba(255,255,255,.04) 0 1px,transparent 1px 22px); /* @kind other */
  --pattern-grid-dark:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px) 0 0/32px 32px,linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px) 0 0/32px 32px; /* @kind other */
  --pattern-grid-light:linear-gradient(rgba(17,19,21,.06) 1px,transparent 1px) 0 0/32px 32px,linear-gradient(90deg,rgba(17,19,21,.06) 1px,transparent 1px) 0 0/32px 32px; /* @kind other */
  --texture-brushed:repeating-linear-gradient(180deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px); /* @kind other */
  --clip-cut-tr:polygon(0 0,calc(100% - var(--cut-m)) 0,100% var(--cut-m),100% 100%,0 100%); /* @kind other */
  --clip-cut-br:polygon(0 0,100% 0,100% calc(100% - var(--cut-m)),calc(100% - var(--cut-m)) 100%,0 100%); /* @kind other */
  --clip-tab:polygon(0 0,calc(100% - 28px) 0,100% 100%,0 100%); /* @kind other */
}
