/* =========================
   KPI brand tokens
   ========================= */
:root {
  --kpi-blue-dark: #1c396e;   /* Pantone 288 C */
  --kpi-blue-hover: #50AFDE;  /* hover for links */
  --kpi-orange: #f07d00;      /* accent */
  --text-inverse: #ffffff;
}

/* =========================
   EXO 2 FONT FAMILY (Thin → Black, Normal + Italic)
   Path: ../fonts/exo2/*.woff2
   ========================= */
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Thin.woff2') format('woff2'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-ThinItalic.woff2') format('woff2'); font-weight: 100; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-ExtraLight.woff2') format('woff2'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-ExtraLightItalic.woff2') format('woff2'); font-weight: 200; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Light.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-LightItalic.woff2') format('woff2'); font-weight: 300; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-MediumItalic.woff2') format('woff2'); font-weight: 500; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-SemiBoldItalic.woff2') format('woff2'); font-weight: 600; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-BoldItalic.woff2') format('woff2'); font-weight: 700; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-ExtraBold.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-ExtraBoldItalic.woff2') format('woff2'); font-weight: 800; font-style: italic; font-display: swap; }

@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-Black.woff2') format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Exo 2'; src: url('../fonts/exo2/Exo2-BlackItalic.woff2') format('woff2'); font-weight: 900; font-style: italic; font-display: swap; }

/* Global typography */
html, body { font-family: 'Exo 2', 'Helvetica Neue', Arial, sans-serif; font-weight: 400; }
h1 { font-weight: 700; }
h2 { font-weight: 600; }
h3 { font-weight: 500; }

/* Links: no underline, hover light blue */
a { text-decoration: none !important; color: inherit; }
a:hover, a:focus { color: var(--kpi-blue-hover) !important; text-decoration: none !important; }

/* Node / View titles colored */
h1.page-title,
h1.node__title,
.node__title,
.article .title,
.page-header h1,
.view h2,
h2.node__title a {
  color: var(--kpi-blue-dark) !important;
  text-decoration: none;
}
h2.node__title a:hover, .view h2 a:hover { color: var(--kpi-blue-hover) !important; }

/* =========================
   Header layout
   ========================= */

/* Make header full-width dark blue */
.region-header,
.region-primary-menu,
header#navbar,
header.navbar,
.navbar.navbar-expand-lg {
  background: var(--kpi-blue-dark) !important;
  color: var(--text-inverse);
  margin-bottom: 0 !important;
}

/* Header region as 3-column grid: logo | title | right widgets */
.region-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 16px;
  padding: 10px 20px;
}

/* Branding block sits in first two columns (logo + title) by default */
.region-header .block-system-branding-block {
  grid-column: 1 / span 2;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 20px;
}

/* Logo sizing */
.site-logo img {
  max-height: 68px;
  height: auto;
  width: auto;
  display: block;
}

/* Centered faculty title */
.site-branding__title {
  text-align: center;
  color: var(--text-inverse);
  line-height: 1.2;
}
.site-branding__title .line-1 {
  font-size: clamp(18px, 2.2vw, 28px);
  font-weight: 700;
}
.site-branding__title .line-2 {
  font-size: clamp(14px, 1.6vw, 20px);
  font-weight: 400;
  opacity: .95;
}

/* Ensure other header blocks (e.g., social icons) align right */
.region-header > .block:not(.block-system-branding-block) {
  grid-column: 3;
  justify-self: end;
}

/* Navbar links color override */
.navbar a, .navbar-nav .nav-link { color: var(--text-inverse) !important; }
.navbar a:hover, .navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus { color: var(--kpi-blue-hover) !important; text-decoration: none; }
.navbar-nav .dropdown-menu { background: var(--kpi-blue-dark) !important; border: none; }
.navbar-nav .dropdown-menu a { color: var(--text-inverse) !important; }
.navbar-nav .dropdown-menu a:hover { background: rgba(255,255,255,.1) !important; }