:root {
  --greitt-primary: #047857;
  --greitt-primary-hover: #065f46;
  --greitt-primary-dark: #065f46;
  --greitt-primary-light: #ecfdf5;
  --greitt-primary-muted: #6ee7b7;
  --greitt-primary-alpha-15: rgba(4, 120, 87, .15);
  --greitt-primary-alpha-30: rgba(4, 120, 87, .3);
  --greitt-primary-alpha-35: rgba(4, 120, 87, .35);
  --greitt-warning: #f59e0b;
  --greitt-warning-light: #fffbeb;
  --greitt-error: #dc2626;
  --greitt-error-hover: #b91c1c;
  --greitt-error-light: #fef2f2;
  --greitt-error-dark: #b91c1c;
  --greitt-neutral-50: #fafafa;
  --greitt-neutral-100: #f4f4f5;
  --greitt-neutral-200: #e4e4e7;
  --greitt-neutral-300: #d4d4d8;
  --greitt-neutral-400: #71717a;
  --greitt-neutral-500: #52525b;
  --greitt-neutral-600: #3f3f46;
  --greitt-neutral-700: #27272a;
  --greitt-neutral-800: #18181b;
  --greitt-neutral-900: #0f0f10;
  --greitt-text-xs: clamp(.651rem, .62rem + .1364vw, .725rem);
  --greitt-text-sm: clamp(.7813rem, .7392rem + .1856vw, .8813rem);
  --greitt-text-base: clamp(.9375rem, .8807rem + .25vw, 1.0725rem);
  --greitt-text-md: clamp(1.125rem, 1.0483rem + .3371vw, 1.3069rem);
  --greitt-text-lg: clamp(1.35rem, 1.246rem + .4576vw, 1.5975rem);
  --greitt-text-xl: clamp(1.62rem, 1.4787rem + .622vw, 1.9556rem);
  --greitt-text-2xl: clamp(1.944rem, 1.751rem + .8492vw, 2.4025rem);
  --greitt-space-3xs: clamp(.25rem, .2386rem + .05vw, .2775rem);
  --greitt-space-2xs: clamp(.4688rem, .4403rem + .125vw, .5363rem);
  --greitt-space-xs: clamp(.7188rem, .6676rem + .2254vw, .8406rem);
  --greitt-space-s: clamp(.9375rem, .8807rem + .25vw, 1.0725rem);
  --greitt-space-m: clamp(1.4063rem, 1.3211rem + .375vw, 1.6088rem);
  --greitt-space-l: clamp(1.875rem, 1.7614rem + .5vw, 2.145rem);
  --greitt-space-xl: clamp(2.8125rem, 2.6421rem + .75vw, 3.2175rem);
  --greitt-space-2xl: clamp(3.75rem, 3.5227rem + 1vw, 4.29rem);
  --greitt-radius-sm: .375rem;
  --greitt-radius-md: .5rem;
  --greitt-radius-lg: .75rem;
  --greitt-radius-xl: 1rem;
  --greitt-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .03);
  --greitt-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .06), 0 1px 2px -1px rgba(0, 0, 0, .06);
  --greitt-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .07), 0 2px 4px -2px rgba(0, 0, 0, .07);
  --greitt-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -4px rgba(0, 0, 0, .08);
  --greitt-transition: .15s cubic-bezier(.4, 0, .2, 1);
  --greitt-paper: #f3f6f0;
  --greitt-ink: #15211b;
  --greitt-muted: #5d6b62;
  --greitt-faint: #8a968d;
  --greitt-line: #e4e9e0;
  --greitt-line-strong: #d6ddd2;
  --greitt-green: #1c8a55;
  --greitt-green-dark: #0f5a36;
  --greitt-green-ink: #0c3b25;
  --greitt-mint: #e7f3ec;
  --greitt-mint-deep: #d6ebde;
  --greitt-mint-line: #bfdfcb;
  --greitt-gold: #c79a1e;
  --greitt-gold-soft: #f6eecf;
  --greitt-gold-line: #e3cf86;
  --greitt-gold-ink: #7e6310;
  --greitt-r-card: 16px;
  --greitt-r-md: 11px;
  --greitt-r-sm: 8px;
  --greitt-shadow-card: 0 1px 2px rgba(15, 40, 28, .05), 0 12px 30px -12px rgba(15, 40, 28, .16);
  --greitt-shadow-pop: 0 1px 2px rgba(15, 40, 28, .06), 0 6px 16px -6px rgba(15, 40, 28, .18);
}

body {
  background: var(--greitt-paper);
  font-family: Hanken Grotesk, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif;
  font-size: var(--greitt-text-base);
  color: var(--greitt-ink);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}

h1, h2, h3 {
  margin-bottom: var(--greitt-space-2xs);
  letter-spacing: -.02em;
  font-family: Schibsted Grotesk, -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 700;
}

h3 {
  color: var(--greitt-neutral-800);
  font-size: var(--greitt-text-md);
}

.greitt-header {
  align-items: center;
  gap: var(--greitt-space-2xs);
  padding: var(--greitt-space-xs) 0;
  margin-bottom: var(--greitt-space-s);
  background: none;
  display: flex;
}

.greitt-header h1 {
  font-size: var(--greitt-text-lg);
  color: var(--greitt-neutral-800);
  letter-spacing: -.03em;
  margin: 0;
  font-weight: 700;
}

.greitt-header h1 span {
  color: var(--greitt-primary);
}

.greitt-logo-link {
  align-items: center;
  gap: var(--greitt-space-2xs);
  color: inherit;
  text-decoration: none;
  display: flex;
}

.greitt-logo-link:hover {
  text-decoration: none;
}

.greitt-logo {
  flex-shrink: 0;
  width: max(1.625rem, min(1.5rem + .5vw, 2rem));
  height: max(1.625rem, min(1.5rem + .5vw, 2rem));
}

.greitt-header-nav {
  margin-left: auto;
}

.greitt-header-link {
  color: var(--greitt-primary);
  font-size: var(--greitt-text-base);
  padding: var(--greitt-space-3xs) var(--greitt-space-xs);
  border-radius: var(--greitt-radius-sm);
  transition: background-color var(--greitt-transition), color var(--greitt-transition);
  font-weight: 500;
  text-decoration: none;
}

.greitt-header-link:hover {
  background-color: var(--greitt-primary-light);
  color: var(--greitt-primary-hover);
}

.topbar-share-btn {
  white-space: nowrap;
  flex-shrink: 0;
}

main {
  max-width: 40rem;
  padding: 0 var(--greitt-space-s);
  margin: 0 auto;
}

@media (min-width: 1024px) {
  main {
    max-width: 44rem;
  }
}

.greitt-footer {
  margin-top: var(--greitt-space-l);
  padding: var(--greitt-space-m) 0;
  text-align: center;
  color: var(--greitt-neutral-500);
  font-size: var(--greitt-text-sm);
}

.greitt-footer a {
  color: var(--greitt-neutral-600);
  transition: color var(--greitt-transition);
  font-weight: 500;
  text-decoration: none;
}

.greitt-footer a:hover {
  color: var(--greitt-primary);
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.page-fade-in {
  animation: .3s ease-out forwards fadeIn;
}

@keyframes toast-fade {
  0%, 30% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.visually-hidden {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

