/* Shared identity: composition 01, monochrome symbol and colored I, local font. */
@font-face {
  font-family: Manrope;
  src: url('../assets/fonts/manrope-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
:root {
  --brand-ink: #17191b;
  --brand-paper: #f7f9f8;
  --brand-blue: #006b85;
  --brand-blue-light: #67d4e5;
  --brand-green: #b4d334;
  --brand-teal: #39a78f;
  --brand-gradient: linear-gradient(135deg, var(--brand-green), var(--brand-teal) 50%, #008cb5);
  --brand-font: Manrope, Arial, Helvetica, sans-serif;
}
.brand {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  background: transparent;
  overflow: visible;
  border-radius: 0;
  text-decoration: none;
  line-height: 1;
}
.brand-logo {
  display: block;
  width: 240px;
  height: auto;
  max-width: none;
}
.brand-logo-dark {
  display: none;
}
[data-theme='dark'] .brand-logo-light {
  display: none;
}
[data-theme='dark'] .brand-logo-dark {
  display: block;
}
.elion-node {
  position: relative;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 12px 18px 17px;
}
.node-logo {
  display: block;
  width: 224px;
  max-width: 100%;
  height: auto;
}
.node-description {
  font-size: 9px;
  color: #c5d8d0;
}
.elion-node .node-pulse {
  position: absolute;
  right: 12px;
  top: 12px;
}
/* Documents share the same calm surfaces and solid action color as the home. */
body:has(.page) {
  background: var(--bg);
}
body:has(.page) .btn-primary {
  background: var(--accent);
  color: var(--surface);
  box-shadow: none;
}
body:has(.page) .btn-primary:hover {
  opacity: 0.9;
}
body:has(.page) .brand {
  margin-inline: 0;
}
.notfound .brand {
  margin-bottom: 28px;
}
@media (min-width: 851px) and (max-width: 1100px) {
  .site-header .brand-logo {
    width: 210px;
  }
}
@media (max-width: 640px) {
  .brand-logo {
    width: min(216px, calc(100vw - 152px));
  }
  .node-description {
    font-size: 8px;
  }
}

.site-footer .footer-inner {
  flex-wrap: wrap;
}
.site-footer .footer-inner > .brand {
  flex-basis: 100%;
  justify-content: center;
}
/* Theme changes apply foreground and background together, avoiding transient low contrast. */
.btn,
.nav-list a,
.theme-toggle,
.menu-toggle {
  transition-property: transform, box-shadow, border-color;
}
