/*! Honor Society brand 0.6.4 | tokens.css: every --hs-* custom property | https://brand.honorsociety.org */
/*
 * HonorSociety.org design tokens. One prefix: --hs-.
 * Source of truth for hs_theme, Laravel, Shopify and Zendesk Guide.
 * tokens.json holds the same values. Change both together.
 * #162351 is not a brand colour. Never use it.
 */

:root {
  /* Color: blue scale. 700 and 600 are navy mixed with 25% and 50% of blue-500. */
  --hs-blue-900: #172456;
  --hs-blue-800: #1f2f6e;
  --hs-blue-700: #1d3a92;
  --hs-blue-600: #1b46b6;
  --hs-blue-500: #175cff;

  /* Color: brand roles. Blue is for icons, illustration and status bars only, never text. */
  --hs-navy: var(--hs-blue-800);
  --hs-navy-deep: var(--hs-blue-900);
  --hs-blue: var(--hs-blue-500);

  /* Color: action gold = buttons, link underlines, focus, heading rule. */
  --hs-action-gold: #faf053;
  --hs-action-gold-hover: #f2e63a;

  /* Color: honor gold = recognition (plates, credential cards, rules under member names). */
  --hs-honor-gold: #c9a227;
  --hs-gold-ink: #8a5a00;

  /* Color: text and lines on light grounds. */
  --hs-ink: #2b3142;
  --hs-slate: #596172;
  --hs-slate-500: #7e858e;
  --hs-slate-400: #949fb7;
  --hs-line: #e6e8ef;
  --hs-line-strong: #d9dde7;

  /* Color: grounds. */
  --hs-white: #ffffff;
  --hs-soft: #f7f8fb;
  --hs-plate: #faf3e9;
  --hs-plate-line: #eadfc8;
  --hs-plate-muted: #5d6478;
  --hs-footer: #222222;

  /* Color: text, lines and surfaces on navy. */
  --hs-on-navy: rgba(255, 255, 255, 0.86);
  --hs-on-navy-line: rgba(255, 255, 255, 0.24);
  --hs-on-navy-surface: rgba(255, 255, 255, 0.08);

  /* Ground: navy treatment B. Deep navy to navy to a touch of blue, light from the lower right.
     Paint it as background-image over background-color var(--hs-navy), so flat navy is the fallback.
     Body text on it: 6.4:1 at the lightest corner. */
  --hs-ground-navy: linear-gradient(135deg, var(--hs-blue-900) 0%, var(--hs-blue-800) 45%, var(--hs-blue-700) 78%, var(--hs-blue-600) 100%);

  /* Color: status. */
  --hs-success: #0f7a41;
  --hs-success-surface: #e9f5ee;
  --hs-danger: #c0392b;
  --hs-danger-surface: #fdecec;
  --hs-warning: #8a6d1a;
  --hs-warning-surface: #fdf7d6;
  --hs-info-surface: #eaf0ff;

  /* Color: tiers. Free uses --hs-slate. */
  --hs-tier-bronze: #8b5a2b;
  --hs-tier-silver: #c0c0c0;
  --hs-tier-gold: #ffd700;
  --hs-tier-signature: #1c2841;

  /* Type: families. Didot LT Std is always weight 700. */
  --hs-font-display: "Didot LT Std", "Hoefler Text", Garamond, "Times New Roman", serif;
  --hs-font-body: "Mukta", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --hs-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; /* codes a member copies */

  /* Type: sizes. */
  --hs-text-xs: 0.75rem;
  --hs-text-eyebrow: 0.8125rem;
  --hs-text-sm: 0.875rem;
  --hs-text-md: 1rem;
  --hs-text-body: 1.0625rem;
  --hs-text-lead: 1.125rem;
  --hs-text-question: 1.25rem; /* FAQ question */
  --hs-text-h3: 1.375rem;
  --hs-text-h2: clamp(1.75rem, 1.6vw + 1.1rem, 2.5rem);
  --hs-text-h1: clamp(2.25rem, 2.2vw + 1.1rem, 3.25rem);

  /* Type: weights, leading, tracking. */
  --hs-weight-regular: 400;
  --hs-weight-medium: 500;
  --hs-weight-semibold: 600;
  --hs-weight-bold: 700;
  --hs-leading-tight: 1.05;
  --hs-leading-snug: 1.25;
  --hs-leading-body: 1.5;
  --hs-leading-prose: 1.7;
  --hs-tracking-eyebrow: 0.12em;

  /* Space: 4px steps up to 64px. */
  --hs-space-1: 4px;
  --hs-space-2: 8px;
  --hs-space-3: 12px;
  --hs-space-4: 16px;
  --hs-space-5: 24px;
  --hs-space-6: 32px;
  --hs-space-7: 48px;
  --hs-space-8: 64px;
  --hs-band-pad: clamp(2.5rem, 5vw, 4rem);
  --hs-card-pad: 1.25rem;
  --hs-card-pad-lg: 1.5rem; /* from 48rem */

  /* Control heights: tap targets. A button is 48px; a small button and a form control are 40px. */
  --hs-button-h: 48px;
  --hs-control-h: 40px;

  /* Radius: no 12px or 30px. */
  --hs-radius-sm: 4px;
  --hs-radius-md: 8px;
  --hs-radius-pill: 999px;
  --hs-radius-round: 50%;

  /* Shadow. A plain panel has none. card: link cards only. gold: the gold button.
     dialog: a dialog, the video play disc, and a panel that floats over two bands
     (the award deadline card, a form card that overlaps two bands). */
  --hs-shadow-card: 0 1px 2px rgba(31, 47, 110, 0.06);
  --hs-shadow-dialog: 0 12px 30px rgba(31, 47, 110, 0.14);
  --hs-shadow-gold: 0 6px 18px rgba(250, 240, 83, 0.28);
  /* Letterpress: text pressed into the plate. A warm shade above, a paper highlight below. */
  --hs-shadow-letterpress: 0 -1px 0 rgba(103, 75, 43, 0.16), 0 1px 0 rgba(255, 255, 255, 0.9);
  --hs-shadow-letterpress-date: 0 -1px 0 rgba(45, 49, 61, 0.25), 0 1px 0 rgba(255, 255, 255, 0.98);

  /* Focus: outline in action gold, plus a navy ring on light grounds. */
  --hs-focus-width: 3px;
  --hs-focus-offset: 3px;
  --hs-focus-color: var(--hs-action-gold);
  --hs-focus-ring: 0 0 0 1px var(--hs-navy);

  /* Heading rule: a bar under a page H1 or a band's H2. */
  --hs-rule-width: 56px;
  --hs-rule-height: 4px;
  --hs-rule-radius: 2px;
  --hs-rule-gap: clamp(0.7rem, 1.5vw, 1.05rem);

  /* Motion: colour, border, shadow and transform only. */
  --hs-duration: 200ms;
  --hs-ease: ease;
  --hs-transition: 200ms ease;

  /* Layout. */
  --hs-header-h: 64px;
  --hs-header-h-lg: 72px; /* from 992px */
  --hs-gutter: 12px;
  --hs-container-sm: 540px;
  --hs-container-md: 720px;
  --hs-container-lg: 960px;
  --hs-container-xl: 1140px;
  --hs-container-xxl: 1320px;
  /* Body text fills its container. Only display headings keep a ch cap, set in their own component. */
  --hs-measure: none;
  --hs-measure-lead: none;

  /* Breakpoints (media queries cannot read custom properties):
     sm 36rem (576px), md 48rem (768px), lg 62rem (992px),
     xl 75rem (1200px), xxl 87.5rem (1400px). Mobile-first min-width. */
}