/* Shared tokens & global design system tokens */
:root {
  /* Brand colors: edit these two values to retheme the whole site. */
  --willus-primary: #122244;
  --willus-secondary: #9B7439;
  --willus-primary-rgb: 18 34 68;
  --willus-secondary-rgb: 155 116 57;
  --willus-primary-soft: #e9ebf0;
  --willus-secondary-soft: #f1ece3;
  --willus-on-dark-muted: #d0cec8;
  --willus-navy: var(--willus-primary);
  --willus-accent: var(--willus-secondary);
  --willus-ink: #25272b;
  --willus-muted: #65635e;
  --willus-white: #fff;
  --willus-surface: #f4f2ed;
  --willus-border: #dedbd3;
  --willus-font: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --willus-container: 1240px;
  --willus-gutter: clamp(20px, 4vw, 48px);
  --willus-space-1: 4px;
  --willus-space-2: 8px;
  --willus-space-3: 12px;
  --willus-space-4: 16px;
  --willus-space-6: 24px;
  --willus-space-8: 32px;
  --willus-space-12: 48px;
  --willus-space-16: 64px;
  --willus-radius: 6px;
  --willus-shadow: 0 12px 32px rgb(var(--willus-primary-rgb) / 12%);
  --willus-transition: 180ms ease;
}

/* Global Font Enforcement: Ensure entire theme uses Barlow */
html,
body {
  font-family: var(--willus-font) !important;
  font-size: 16px;
  line-height: 1.6;
  color: var(--willus-ink);
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*, *::before, *::after {
  box-sizing: border-box;
}

/* Force Barlow typography across all elements, headings, inputs, and controls */
h1, h2, h3, h4, h5, h6,
button, input, select, textarea, optgroup,
p, span, a, li, td, th, label, figcaption, blockquote, address {
  font-family: var(--willus-font);
}

.willus-ui {
  font-family: var(--willus-font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--willus-ink);
}

.willus-container {
  width: min(var(--willus-container), calc(100% - var(--willus-gutter) * 2));
  margin-inline: auto;
}

.willus-ui :is(a, button, input, textarea, select):focus-visible {
  outline: 3px solid var(--willus-accent);
  outline-offset: 4px;
}

.willus-section {
  padding-block: clamp(40px, 6vw, 80px);
}

.willus-section--muted {
  background: var(--willus-surface);
}

.willus-section--navy {
  background: var(--willus-navy);
  color: var(--willus-white);
}

.willus-heading {
  font-family: var(--willus-font);
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 var(--willus-space-6);
  color: inherit;
}

.willus-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: var(--willus-space-8);
}

.willus-card {
  padding: var(--willus-space-8);
  border: 1px solid var(--willus-border);
  border-radius: var(--willus-radius);
  background: var(--willus-white);
}

.willus-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 44px;
  padding: 12px 24px;
  background: var(--willus-navy);
  color: var(--willus-white);
  border: 1px solid transparent;
  border-radius: var(--willus-radius);
  font: inherit;
  font-family: var(--willus-font);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--willus-transition);
}

.willus-button:hover {
  color: var(--willus-navy);
  background: var(--willus-accent);
}

.willus-button--outline {
  background: transparent;
  color: var(--willus-navy);
  border-color: currentColor;
}

@media (prefers-reduced-motion: reduce) {
  .willus-ui *, .willus-ui *::before, .willus-ui *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}