/*
 * Arqivis skin: dark product bar, light canvas, gold accent, rectangular surfaces.
 *
 * Gold #d5a32e only reaches 2.29:1 against white, so it never carries body text and never acts as
 * a focus ring on the canvas. It is used as a button background with dark #222 text (6.90:1) and
 * as the active cue on the dark bar (6.90:1). Body links use the darker gold-brown #8a6a1c
 * (5.05:1 on white).
 */

@font-face {
  font-family: 'Frutiger';
  src: url('fonts/frutiger/2F8E78_0_0.woff2') format('woff2'),
       url('fonts/frutiger/2F8E78_0_0.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-heading: 'Frutiger', Arial, Helvetica, sans-serif;
  --font-body: 'Frutiger', Arial, Helvetica, sans-serif;
  /* Only the 400 weight is bundled, so hierarchy comes from size, not from synthesised bold. */
  --font-weight-heading: 400;
  --font-weight-header-title: 400;

  --bg: #f8f8f8;
  --surface: #ffffff;
  --text: #444444;
  /* #888 misses 4.5:1 on both the canvas and the footer band; darkened to #666. */
  --text-muted: #666666;
  --border: #dcdcdc;

  --link: #8a6a1c;
  --accent: #d5a32e;
  --accent-hover: #e6b43f;
  --accent-text: #222222;
  --focus: #222222;

  --header-bg: #222222;
  --header-text: #ffffff;
  --header-rule: 0 solid transparent;
  --header-height: 50px;
  --logo-height: 30px;

  --footer-bg: #ebebeb;
  --footer-text: #666666;

  --radius: 2px;
}

h1,
h2,
h3 {
  color: #333333;
}

.site-header__inner {
  padding-top: 4px;
  padding-bottom: 4px;
}

.language-switch a {
  padding-left: 8px;
  padding-right: 8px;
}

.language-switch a:hover {
  background: #252525;
  border-bottom-color: var(--accent);
}

.language-switch a[aria-current='page'] {
  color: var(--accent);
}

@media (max-width: 40rem) {
  :root {
    --header-height: 40px;
    --logo-height: 24px;
  }
}