:root {
  --color-forest: #1E6935;
  --color-forest-ink: #17512A;
  --color-forest-deep: #123329;
  --color-cyan: #20B7EA;
  --color-cyan-deep: #0C6187;
  --color-lime: #8CC242;
  --color-lime-bright: #9FE06A;
  --color-mint: #7FD6C0;
  --color-white: #FAFCFB;
  --color-mist: #E8F3F5;
  --color-slate: #5A6B63;
  --color-ink: #14231D;
  
  --font-sans: 'Figtree', sans-serif;
  --font-display: 'Schibsted Grotesk', sans-serif;
  --font-mono: 'Source Code Pro', monospace;
}

body {
  font-family: var(--font-sans);
  color: var(--color-ink);
  background-color: var(--color-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6, .font-display {
  font-family: var(--font-display);
}

.font-mono {
  font-family: var(--font-mono);
}

/* Wordmark */
.logo-mark {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
}

.logo-icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.logo-everseal {
  font-family: var(--font-display);
  color: var(--color-forest);
  font-style: italic;
  font-weight: 800;
  font-size: 1.5rem;
  letter-spacing: -0.02em;
}

.logo-subtext {
  font-family: var(--font-sans);
  color: var(--color-forest-ink);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Footer Wordmark Override */
.footer-logo .logo-everseal {
  color: var(--color-white);
}
.footer-logo .logo-subtext {
  color: var(--color-mint);
}

/* Section Kickers */
.kicker-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-forest-ink);
  font-weight: 600;
}

.kicker-icon {
  width: 16px;
  height: 16px;
  color: var(--color-forest);
}

/* Base interactive transitions */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-forest);
  color: var(--color-white);
  padding: 0.625rem 1.5rem;
  border-radius: 0.375rem;
  font-weight: 600;
  transition: all 0.2s ease-in-out;
}
.btn-primary:hover {
  background-color: var(--color-forest-deep);
  transform: translateY(-1px);
}
.btn-primary:active {
  transform: translateY(0) scale(0.98);
}