/* Typography
   ========================================================================== */
@font-face {
  font-family: 'Titillium Web';
  src: url('./vendor/titillium-web/TitilliumWeb-Regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Titillium Web';
  src: url('./vendor/titillium-web/TitilliumWeb-SemiBold.ttf') format('truetype');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: 'Titillium Web';
  src: url('./vendor/titillium-web/TitilliumWeb-Bold.ttf') format('truetype');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

body,
button,
input,
select,
textarea {
  font-family: 'Titillium Web', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Theme / Brand
   ========================================================================== */
:root {
  /* Typography tokens */
  --bs-body-font-family: 'Titillium Web', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* Brand tokens and Bootstrap overrides */
  --genoa-blue: hsl(214deg 59% 20%);
  --genoa-blue-rgb: 21, 53, 81;
  --genoa-blue-dark: #0f2940;
  --bs-primary: var(--genoa-blue);
  --bs-primary-rgb: var(--genoa-blue-rgb);
  --bs-primary-text-emphasis: var(--genoa-blue-dark);
  --bs-primary-bg-subtle: #d9e2ec;
  --bs-primary-border-subtle: #9cb0c3;
  --bs-link-color: var(--genoa-blue);
  --bs-link-color-rgb: var(--genoa-blue-rgb);
  --bs-link-hover-color: var(--genoa-blue-dark);
  --bs-link-hover-color-rgb: 15, 41, 64;
  --bs-focus-ring-color: rgba(21, 53, 81, 0.35);
}

/* Brand Accessibility Contrast Overrides
   ========================================================================== */
button.bg-primary:hover {
  background: var(--bs-black) !important;
}

/* Particles
   ========================================================================== */
#particles {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  background:
    radial-gradient(circle at 10% 20%, rgba(140, 180, 220, 0.35), transparent 35%),
    radial-gradient(circle at 90% 10%, rgba(21, 53, 81, 0.25), transparent 40%),
    linear-gradient(180deg, #eef3f8 0%, #e3ebf3 100%);
  pointer-events: none;
  z-index: 0;
}

header,
main,
footer {
  position: relative;
  z-index: 1;
}

/* Glassmorphism
   ========================================================================== */
main .card.border-0.shadow-sm {
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 18px 36px rgba(12, 35, 61, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

main .card.border-0.shadow-sm .card-body {
  background: transparent;
}