/**
 * Global design tokens — use across the child theme and widgets.
 * Include via functions.php; reference with var(--token-name).
 */
:root {
  /* Typography */
  --font-menu: "Stack Sans Headline", sans-serif;
  --font-body: "Stack Sans Headline", sans-serif;
  --font-hero: "Alex Brush", cursive;

  /* Menu / header colors */
  --color-normal: #c3d7da;
  --color-hover: #ffffff;
  --color-active: #ffffff;

  /* Surfaces */
  --panel-bg: #014759;
  --header-bg: transparent;

  /* Layout */
  --container-max-width: 1680px;
  --container-padding-x: 20px;
  --header-padding-y: 35px;
  --logo-height: 70px;
  --nav-gap: 24px;
  --nav-font-size: 20px;
  --nav-font-size-mobile: 24px;
  --burger-size: 25px;
  --z-header: 1000;
  --z-burger: 2000;

  /* Breakpoints (documentation only — media queries cannot use CSS vars) */
  --bp-nav: 1150px;
}

.container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding-x);
} 

.container-full {
  max-width: 100%;
  width: 100%;
  padding: 0;
}

.container-full .svg-container-inner {
  max-width: 100%;
  width: 100%;
  padding: 0;
}

body {
  background-color: var(--panel-bg);
}