/* NCODE brand palette — copied from the panel project's brand/ncode-palette.css.
   Single source of truth for Ncode-owned surfaces. Linked AFTER style.css so
   brand-critical overrides win without !important (same specificity, later source
   order). Scope is intentionally minimal and reversible. */
:root {
  /* brand blues */
  --ncode-cyan:  #2098D8;
  --ncode-azure: #0870B8;
  --ncode-royal: #203878;
  --ncode-navy:  #182858;

  /* neutrals */
  --ncode-ink:       #1F2733;
  --ncode-muted:     #64748B;
  --ncode-line:      #E2E8F0;
  --ncode-zebra:     #F5F8FB;
  --ncode-zebra-alt: #E9EEF5;
  --ncode-page:      #F1F5F9;
  --ncode-white:     #FFFFFF;

  /* signature gradient (cyan -> azure -> navy) */
  --ncode-gradient: linear-gradient(90deg, #2098D8, #0870B8, #182858);
}

/* ---- Brand-critical overrides (minimal, reversible) ---- */

/* Top bar background -> Ncode azure */
.theme-bg {
  background: var(--ncode-azure);
}

/* Primary button -> Ncode azure, hover -> navy */
.btn.brand-btn {
  background: var(--ncode-azure);
  color: #fff;
}
.btn.brand-btn:hover {
  background: var(--ncode-navy);
}

/* Section-title headings -> Ncode navy */
.section-title > h2 {
  color: var(--ncode-navy);
}

/* Main-menu active/hover nav color -> Ncode navy */
.main-menu ul li:hover > a {
  color: var(--ncode-navy);
}
.main-menu nav#mobile-menu > ul > li > a.active {
  color: var(--ncode-navy);
}

/* Header logo sizing — the panel logo is wider than the Kormo default */
.header-bottom-area .logo img {
  max-height: 48px;
  width: auto;
}

/* Footer logo sizing — grayscale original-logo PNG (200x50), kept small */
.footer-widget > img.footer-logo {
  max-width: 140px;
  width: auto;
  height: auto;
}

/* Footer rule — Ncode signature gradient */
.copyright-area {
  border-top: 4px solid;
  border-image: var(--ncode-gradient) 1;
}