:root {
  --g-color-ink: #0b2927;
  --g-color-heading: #062f2c;
  --g-color-muted: #667c78;
  --g-color-primary: #078f78;
  --g-color-primary-strong: #056f60;
  --g-color-green: #49a83e;
  --g-color-mint: #eaf7f3;
  --g-color-mint-soft: #f5faf8;
  --g-color-sun: #ffb21a;
  --g-color-orange: #ff9418;
  --g-color-surface: #fff;
  --g-color-border: #dce9e5;
  --g-color-border-strong: #c8ddd7;
  --g-font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --g-space-1: .25rem;
  --g-space-2: .5rem;
  --g-space-3: .75rem;
  --g-space-4: 1rem;
  --g-space-5: 1.25rem;
  --g-space-6: 1.5rem;
  --g-space-8: 2rem;
  --g-space-10: 2.5rem;
  --g-space-12: 3rem;
  --g-space-16: 4rem;
  --g-radius-sm: .65rem;
  --g-radius-md: .9rem;
  --g-radius-lg: 1.25rem;
  --g-radius-xl: 1.75rem;
  --g-shadow-sm: 0 1px 2px rgba(6, 47, 44, .05), 0 8px 24px rgba(6, 47, 44, .06);
  --g-shadow-md: 0 16px 46px rgba(6, 47, 44, .1);
  --g-content: 1320px;
  --g-transition: 180ms ease;
}

.g-card {
  background: var(--g-color-surface);
  border: 1px solid var(--g-color-border);
  border-radius: var(--g-radius-lg);
  box-shadow: var(--g-shadow-sm);
}

.g-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: .25rem .7rem;
  border-radius: 999px;
  background: var(--g-color-mint);
  color: var(--g-color-primary-strong);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.g-focus:focus-visible,
.home-page :where(a, button, input, select):focus-visible {
  outline: 3px solid rgba(255, 178, 26, .7);
  outline-offset: 3px;
}

@media (max-width: 767px) {
  :root {
    --g-space-12: 2.25rem;
    --g-space-16: 3rem;
    --g-radius-xl: 1.35rem;
  }
}