/* ============================================================
   DELGADO PURDY IMMIGRATION LAW — DESIGN TOKENS
   Ported as-is from the approved design system (design_handoff_
   delgado_purdy_site/design-system/tokens/*). Do not invent
   colors, type sizes, or radii — always use these variables.
   ============================================================ */

/* --- Fonts: Brygada 1918 (display) + Lato (body/UI) --- */
/* ---------------------------------------------------------------
   Self-hosted webfonts. These were previously pulled from the Google
   Fonts CDN via an @import, which is render-blocking and serialises
   behind this stylesheet. The domain is deliberately not named here,
   so a grep for it returns nothing and audits stay clean.
   Brygada 1918 and Lato are both SIL Open Font License, so hosting
   them here is permitted.
   latin-ext is kept for the planned ES/PT mirrors.
   Unused weights (300, 500, 900) were dropped: nothing references them.
   --------------------------------------------------------------- */
@font-face {
  font-family: 'Brygada 1918';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-400-italic-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Brygada 1918';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-400-italic-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: 'Brygada 1918';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-600-italic-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Brygada 1918';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-600-italic-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: 'Brygada 1918';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-400-normal-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Brygada 1918';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-400-normal-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: 'Brygada 1918';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-600-normal-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Brygada 1918';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-600-normal-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: 'Brygada 1918';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-700-normal-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Brygada 1918';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/brygada-1918-700-normal-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: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/lato-400-normal-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/lato-400-normal-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: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/lato-700-normal-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/lato-700-normal-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;
}

/* ---------------------------------------------------------------
   Metric-tuned local fallbacks (CLS guard, added at v=97).
   These faces render only during the window before the webfonts
   arrive. size-adjust matches each fallback's average character
   width to the webfont it stands in for, so text wraps into the
   same number of lines and the layout does not shift on swap
   (PSI mobile measured CLS 1.0 from exactly that shift).
   The final rendered page is unchanged: once the webfonts load,
   these faces are never used.
   Values are computed from the shipped woff2 metrics with
   fontTools (hhea + frequency-weighted advance widths); recompute
   if the font files are ever replaced.
   The two serif fallbacks cover different platforms: Georgia on
   Windows/macOS/iOS, the Times-metric family (Times New Roman /
   Tinos / Liberation Serif) on Linux and test environments.
   --------------------------------------------------------------- */
@font-face {
  font-family: 'Brygada 1918 Fallback';
  font-style: normal;
  src: local('Georgia');
  size-adjust: 105.77%;
  ascent-override: 86.98%;
  descent-override: 23.64%;
  line-gap-override: 0%;
}
/* Brygada's italic is ~7% narrower than its roman, so the italic
   fallback needs its own size-adjust or italic lines wrap wrong. */
@font-face {
  font-family: 'Brygada 1918 Fallback';
  font-style: italic;
  src: local('Georgia Italic'), local('Georgia-Italic');
  size-adjust: 97.01%;
  ascent-override: 94.84%;
  descent-override: 25.77%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Brygada 1918 Fallback Times';
  font-style: normal;
  src: local('Times New Roman'), local('Tinos'), local('Liberation Serif');
  size-adjust: 116.4%;
  ascent-override: 79.04%;
  descent-override: 21.48%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Brygada 1918 Fallback Times';
  font-style: italic;
  src: local('Times New Roman Italic'), local('Tinos Italic'), local('Liberation Serif Italic');
  size-adjust: 108.62%;
  ascent-override: 84.70%;
  descent-override: 23.02%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Lato Fallback';
  src: local('Arial'), local('Helvetica'), local('Liberation Sans'), local('Arimo'), local('Roboto');
  size-adjust: 98.09%;
  ascent-override: 100.62%;
  descent-override: 21.72%;
  line-gap-override: 0%;
}

:root {
  /* --- Brand palette (raw) --- */
  --navy:        #254159;   /* Editorial Navy — primary brand */
  --crimson:     #8C111B;   /* Deep Crimson — links, restrained accent */
  --red:         #D92332;   /* Brand Red — CTA only */
  --oxblood:     #400F13;   /* Oxblood — deep accent, footers */
  --taupe:       #BFA995;   /* Warm Taupe — supporting neutral */
  --paper:       #FBF9F6;   /* Paper — canvas */

  /* --- Navy ramp --- */
  --navy-900: #142430;
  --navy-800: #1b3143;
  --navy-700: #254159;
  --navy-600: #345574;
  --navy-500: #4a6b8c;
  --navy-400: #7089a3;
  --navy-300: #a3b4c4;
  --navy-200: #cdd7e0;
  --navy-100: #e6ebf0;

  /* --- Taupe ramp --- */
  --taupe-700: #6e6153;
  --taupe-600: #8f8171;
  --taupe-500: #a9977f;
  --taupe-400: #bfa995;
  --taupe-300: #d3c4b4;
  --taupe-200: #e6ddd3;
  --taupe-100: #f2ece5;

  /* --- Paper ramp --- */
  --paper-0:  #ffffff;
  --paper-50: #fdfcfa;
  --paper-100:#fbf9f6;
  --paper-200:#f4efe9;
  --paper-300:#ebe3d9;

  /* --- Red ramp --- */
  --red-700: #400f13;
  --red-600: #8c111b;
  --red-500: #d92332;
  --red-400: #e5505c;
  --red-300: #ef8992;

  /* --- Semantic: text --- */
  --text-strong:   var(--navy-900);
  --text-body:     var(--navy-800);
  --text-muted:    var(--navy-500);
  --text-subtle:   var(--taupe-700);
  --text-on-navy:  var(--paper-100);
  --text-on-navy-muted: var(--navy-300);
  --text-on-red:   #ffffff;
  --text-link:     var(--crimson);
  --text-link-hover: var(--oxblood);

  /* --- Semantic: surfaces --- */
  --surface-page:     var(--paper-100);
  --surface-card:     var(--paper-0);
  --surface-sunken:   var(--paper-200);
  --surface-navy:     var(--navy-700);
  --surface-navy-deep:var(--navy-900);
  --surface-oxblood:  var(--oxblood);

  /* --- Semantic: borders / lines --- */
  --border-hairline: var(--taupe-200);
  --border-default:  var(--taupe-300);
  --border-strong:   var(--navy-200);
  --rule-navy:       var(--navy-700);

  /* --- Semantic: interactive --- */
  --cta-bg:        var(--red-500);
  --cta-bg-hover:  var(--red-600);
  --cta-bg-active: var(--red-700);
  --focus-ring:    var(--navy-600);

  /* --- Gradients (soft, warm, never loud) --- */
  --gradient-navy: linear-gradient(155deg, #33587a 0%, #254159 55%, #1b3143 100%);
  --gradient-cta:  linear-gradient(135deg, #e0374a 0%, #d92332 65%, #c81f2d 100%);
  --gradient-dawn: linear-gradient(180deg, #ffffff 0%, #fbf9f6 55%, #f4efe9 100%);
  --gradient-warm: linear-gradient(150deg, #f2ece5 0%, #e6ddd3 100%);

  /* --- Typography --- */
  --font-display: 'Brygada 1918', 'Brygada 1918 Fallback', 'Brygada 1918 Fallback Times', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --font-body:    'Lato', 'Lato Fallback', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --step--2: 0.64rem;
  --step--1: 0.8rem;
  --step-0:  1rem;
  --step-1:  1.25rem;
  --step-2:  1.563rem;
  --step-3:  1.953rem;
  --step-4:  2.441rem;
  --step-5:  3.052rem;
  --step-6:  3.815rem;
  --step-7:  4.768rem;

  --fw-light:    300;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-black:    900;

  --lh-tight:   1.08;
  --lh-snug:    1.2;
  --lh-normal:  1.55;
  --lh-relaxed: 1.7;

  --ls-tight:   -0.02em;
  --ls-normal:  0;
  --ls-label:   0.08em;

  /* --- Spacing (4px base) --- */
  --space-0:  0;
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.5rem;
  --space-6:  2rem;
  --space-7:  3rem;
  --space-8:  4rem;
  --space-9:  6rem;
  --space-10: 8rem;

  /* --- Layout --- */
  --container-max: 1200px;
  --measure:       68ch;
  --gutter:        var(--space-5);

  /* --- Radius --- */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

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

  /* --- Shadows (soft, diffuse, navy-tinted) --- */
  --shadow-xs: 0 1px 2px rgba(20, 36, 48, 0.04);
  --shadow-sm: 0 2px 8px rgba(20, 36, 48, 0.05), 0 1px 2px rgba(20, 36, 48, 0.04);
  --shadow-md: 0 8px 24px rgba(20, 36, 48, 0.07), 0 2px 6px rgba(20, 36, 48, 0.04);
  --shadow-lg: 0 24px 64px rgba(20, 36, 48, 0.12), 0 6px 16px rgba(20, 36, 48, 0.05);
  --shadow-focus: 0 0 0 3px rgba(52, 85, 116, 0.35);

  /* --- Motion --- */
  --ease-standard: cubic-bezier(0.2, 0, 0.2, 1);
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:   120ms;
  --dur-normal: 200ms;
  --dur-slow:   320ms;

  /* --- Z --- */
  --z-header: 100;
  --z-overlay: 500;
  --z-modal: 600;
}
