/**
 * HNHACA design system
 *
 * Canonical tokens for the Claude-derived visual language. Component and page
 * CSS in theme.css must consume these variables instead of introducing local
 * brand values. Breakpoint tokens are documentation metadata because native
 * CSS custom properties cannot be evaluated inside media-query conditions.
 */

/* Self-hosted DM Sans preserves the Claude body type and supplies a licensed,
   privacy-friendly fallback for its General Sans display face. */
@font-face{font-family:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url("../fonts/dm-sans-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:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url("../fonts/dm-sans-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:"DM Sans";font-style:italic;font-weight:100 1000;font-display:swap;src:url("../fonts/dm-sans-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:"DM Sans";font-style:italic;font-weight:100 1000;font-display:swap;src:url("../fonts/dm-sans-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}

:root {
  /* Colors. */
  --primary-color:#0f3d5c;--primary-hover-color:#14507a;--primary-light-color:#1b6a9c;
  --primary-tint-color:#eaf1f6;--primary-tint-strong-color:#d6e3ec;
  --secondary-color:#082638;--secondary-soft-color:#123349;
  --accent-color:#bc5a0e;--accent-hover-color:#a94e0a;--accent-tint-color:#fdf2e7;
  --background-color:#fff;--surface-color:#f5f8fa;--surface-alt-color:#edf3f7;
  --text-color:#3e5361;--heading-color:#0b1d28;--muted-text-color:#5f7484;--inverse-text-color:#f4f8fb;
  --border-color:#dee7ed;--soft-border-color:#ebf1f5;--input-border-color:#b9c9d3;
  --success-color:#3f8f3b;--success-dark-color:#267228;--error-color:#9b2c2c;--error-tint-color:rgba(155,44,44,.12);
  --dark-muted-text-color:#c9d8e1;--dark-soft-text-color:#d7e4eb;--dark-eyebrow-color:#9bc4dd;--light-eyebrow-color:#a9d0e8;
  --inverse-link-color:#eaf3f8;--footer-cta-text-color:#dbe8ef;--footer-text-color:#aec2ce;--footer-link-color:#d9e8ef;
  --placeholder-background-color:#fff0b8;--placeholder-text-color:#594400;
  --hero-start-color:#f7fafc;--hero-middle-color:#eef5f9;
  --brand-start-color:#071d36;--brand-end-color:#123e65;--brand-accent-color:#f0ad72;
  --white:#fff;--black:#000;

  /* Typography and heading scale. */
  --heading-font:"General Sans","DM Sans",system-ui,sans-serif;
  --body-font:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;
  --line-height-heading:1.15;--line-height-body:1.65;--line-height-relaxed:1.75;
  --letter-spacing-heading:-.025em;--letter-spacing-overline:.14em;
  --fs-display:clamp(2.6rem,1.4rem + 3.4vw,4.5rem);--fs-h1:clamp(2.15rem,1.35rem + 2.4vw,3.4rem);
  --fs-h2:clamp(1.65rem,1.2rem + 1.4vw,2.35rem);--fs-h3:clamp(1.15rem,1rem + .5vw,1.4rem);
  --fs-lede:clamp(1.05rem,.98rem + .4vw,1.28rem);--fs-body:1rem;--fs-sm:.9375rem;--fs-xs:.8125rem;--fs-over:.6875rem;

  /* Spacing scale and layout widths. */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:28px;--space-8:32px;--space-10:40px;--space-12:48px;--space-14:56px;--space-16:64px;
  --container-width:1240px;--container-narrow-width:820px;--prose-width:820px;
  --section-spacing:clamp(56px,4vw + 32px,104px);--content-gutter:clamp(20px,4vw,40px);

  /* Borders, radii and elevation. */
  --border-width:1px;--focus-ring-width:3px;--focus-ring-offset:3px;
  --small-radius:4px;--button-radius:8px;--border-radius:12px;--large-radius:20px;--pill-radius:999px;
  --shadow-sm:0 1px 2px rgba(11,29,40,.06);--shadow-md:0 8px 24px rgba(11,29,40,.08);--shadow-lg:0 18px 48px rgba(11,29,40,.12);

  /* Links. */
  --link-color:var(--primary-light-color);--link-hover-color:var(--accent-color);--link-decoration-thickness:.09em;--link-decoration-offset:.16em;

  /* Buttons. */
  --button-min-height:48px;--button-padding-block:12px;--button-padding-inline:22px;--button-font-size:var(--fs-sm);--button-font-weight:760;
  --button-background:var(--accent-color);--button-background-hover:var(--accent-hover-color);--button-text-color:var(--white);--button-border-color:var(--accent-color);
  --button-shadow-color:rgba(217,106,21,.22);--button-hover-shadow-color:rgba(217,106,21,.28);--button-shadow:var(--button-shadow-color);--button-box-shadow:0 7px 20px var(--button-shadow-color);--button-hover-box-shadow:0 11px 25px var(--button-hover-shadow-color);--button-hover-translate:-2px;

  /* Cards. */
  --card-background:var(--white);--card-border:var(--border-width) solid var(--border-color);--card-radius:var(--border-radius);--card-padding:28px;--card-gap:20px;
  --card-hover-border-color:var(--primary-tint-strong-color);--card-hover-shadow:var(--shadow-md);--card-hover-translate:-3px;

  /* Forms. */
  --form-max-width:900px;--form-gap:19px;--form-padding:clamp(24px,4vw,42px);--form-radius:var(--large-radius);
  --control-min-height:48px;--control-padding-block:12px;--control-padding-inline:13px;--control-border:var(--border-width) solid var(--input-border-color);--control-radius:var(--button-radius);
  --control-focus-border-color:var(--primary-light-color);--control-focus-ring:0 0 0 3px var(--primary-tint-color);--control-error-ring:0 0 0 3px var(--error-tint-color);

  /* Animation and interaction. */
  --ease:cubic-bezier(.4,0,.2,1);--duration:200ms;--reveal-duration:450ms;--reveal-distance:10px;--hover-duration:200ms;

  /* Breakpoint contract (documentation metadata; media queries use these exact literals). */
  --breakpoint-small:620px;--breakpoint-form:760px;--breakpoint-tablet:800px;--breakpoint-content:900px;
  --breakpoint-navigation:1079px;--breakpoint-desktop:1080px;--breakpoint-wide:1100px;

  /* Translucent and component-support colors. */
  --header-background:rgba(255,255,255,.97);--caption-background:rgba(8,38,56,.86);--primary-grid-line:rgba(15,61,92,.035);
  --white-85:rgba(255,255,255,.85);--white-74:rgba(255,255,255,.74);--white-72:rgba(255,255,255,.72);--white-55:rgba(255,255,255,.55);--white-45:rgba(255,255,255,.45);--white-40:rgba(255,255,255,.4);--white-15:rgba(255,255,255,.15);
  --white-10:rgba(255,255,255,.1);--white-09:rgba(255,255,255,.09);--white-055:rgba(255,255,255,.055);--white-025:rgba(255,255,255,.025);--white-018:rgba(255,255,255,.018);--brand-card-shadow:rgba(1,12,26,.16);

  /* Claude aliases retained for imported sections and child-theme compatibility. */
  --primary-hover:var(--primary-hover-color);--primary-light:var(--primary-light-color);--primary-tint:var(--primary-tint-color);--primary-tint-2:var(--primary-tint-strong-color);
  --secondary-soft:var(--secondary-soft-color);--accent-hover:var(--accent-hover-color);--accent-tint:var(--accent-tint-color);
  --text-dark:var(--heading-color);--text-body:var(--text-color);--text-light:var(--muted-text-color);--text-invert:var(--inverse-text-color);
  --background:var(--background-color);--surface:var(--surface-color);--surface-2:var(--surface-alt-color);--border:var(--border-color);--border-soft:var(--soft-border-color);
  --font-heading:var(--heading-font);--font-body:var(--body-font);--section-y:var(--section-spacing);--container:var(--container-width);--gutter:var(--content-gutter);
  --radius-sm:var(--small-radius);--radius-md:var(--button-radius);--radius-lg:var(--border-radius);--radius-xl:var(--large-radius);--radius-pill:var(--pill-radius);--dur:var(--duration);
}
