@import "style_sections.css";
@import "style_top_bar.css";
@import "style_navigation.css";
@import "style_articles.css";
@import "style_accounts.css";

:root {
  /* Brand green, sampled from the 5K-IoT logo */
  --color-primary: #1a7a4c;
  --color-primary-light: #3fae74;
  --color-primary-dark: #10502f;

  /* Neutrals -- near-black "ink" for dark sections/text, grays for muted UI */
  --color-ink: #0e1512;
  --color-ink-soft: #374139;
  --color-accent: #11221c;
  --color-gray-50: #f7f8f7;
  --color-gray-100: #eef0ee;
  --color-gray-200: #dde1dd;
  --color-gray-400: #9aa39d;
  --color-gray-500: #6b756f;

  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-text: #1c211f;
  --color-muted: var(--color-gray-500);

  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --radius: 16px;
  --radius-full: 999px;
  --shadow-soft: 0 1px 2px rgba(14, 21, 18, 0.06);
}

body {
  background-color: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
}

main {
  padding-top: 64px;
}

footer {
  background-color: var(--color-gray-50);
  border-top: 1px solid var(--color-gray-200);
}

.footer a:link, .footer a:visited, .footer a:hover, .footer a:active {
  color: var(--color-gray-500);
  transition: color 0.15s ease;
}
.footer a:hover, .footer a:active {
  color: var(--color-text);
}

.hs-before {padding-left: 5px;}
.hs-before {padding-right: 5px;}