/* Typography. Brand face is Open Sans (style guide, "Datenblatt Seite 1",
   specimen weights Light / Regular / Medium / Bold / ExtraBold).
   The px sizes below are measured off the live desktop render of
   hoegerle-bau.de at a 1664px viewport. */
:root{
  --hg-font:"Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --hg-font-display:var(--hg-font);
  --hg-font-body:var(--hg-font);

  --hg-weight-light:300;
  --hg-weight-regular:400;
  --hg-weight-medium:500;
  --hg-weight-bold:800; /* the brand sets every bold weight to Open Sans ExtraBold */
  --hg-weight-extrabold:800;

  /* Sizes */
  --hg-size-hero:60px;      /* slider headline, light */
  --hg-size-hero-accent:60px; /* slider headline, bold */
  --hg-size-display:64px;
  --hg-size-h2:40px;
  --hg-size-h3:24px;
  --hg-size-subhead:20px;   /* orange bold sub-headline under an eyebrow */
  --hg-size-eyebrow:18px;   /* small uppercase orange label */
  --hg-size-card-title:19px;
  --hg-size-body:16px;
  --hg-size-nav:15px;
  --hg-size-label:14px;     /* chips, buttons, job links */
  --hg-size-small:13px;

  /* Line heights */
  --hg-leading-tight:1.1;
  --hg-leading-snug:1.25;
  --hg-leading-normal:1.5;
  --hg-leading-body:1.8;

  /* Tracking */
  --hg-tracking-none:0;
  --hg-tracking-label:0.02em;
  --hg-tracking-eyebrow:0.05em;
  --hg-tracking-hero:0.08em;
  --hg-tracking-wordmark:0.3em; /* "BETONWERK" under the logo */

  /* Roles */
  --hg-type-hero:var(--hg-weight-light) var(--hg-size-hero)/var(--hg-leading-tight) var(--hg-font-display);
  --hg-type-hero-accent:var(--hg-weight-bold) var(--hg-size-hero-accent)/var(--hg-leading-tight) var(--hg-font-display);
  --hg-type-h2:var(--hg-weight-bold) var(--hg-size-h2)/var(--hg-leading-snug) var(--hg-font-display);
  --hg-type-h3:var(--hg-weight-bold) var(--hg-size-h3)/var(--hg-leading-snug) var(--hg-font-display);
  --hg-type-subhead:var(--hg-weight-bold) var(--hg-size-subhead)/var(--hg-leading-snug) var(--hg-font-body);
  --hg-type-eyebrow:var(--hg-weight-bold) var(--hg-size-eyebrow)/var(--hg-leading-normal) var(--hg-font-body);
  --hg-type-body:var(--hg-weight-regular) var(--hg-size-body)/var(--hg-leading-body) var(--hg-font-body);
  --hg-type-nav:var(--hg-weight-bold) var(--hg-size-nav)/var(--hg-leading-normal) var(--hg-font-body);
  --hg-type-label:var(--hg-weight-bold) var(--hg-size-label)/var(--hg-leading-normal) var(--hg-font-body);
  --hg-type-card-title:var(--hg-weight-bold) var(--hg-size-card-title)/var(--hg-leading-snug) var(--hg-font-body);
}