:root {
  color-scheme: light;

  --rz-white: #ffffff;
  --rz-mist-50: #f8fcfa;
  --rz-mist-100: #f4faf7;
  --rz-mist-200: #eaf4ef;
  --rz-border: #dce8e1;

  --rz-green-950: #032718;
  --rz-green-900: #063f2a;
  --rz-green-800: #075536;
  --rz-green-700: #0b6a45;
  --rz-green-600: #107c52;

  --rz-teal-700: #05676f;
  --rz-teal-600: #087b83;
  --rz-blue-600: #2478a8;
  --rz-blue-500: #2d8dbe;
  --rz-copper-500: #c9792b;
  --rz-amber-400: #d9a441;

  --rz-graphite-950: #111a17;
  --rz-graphite-900: #17211d;
  --rz-graphite-700: #35433d;
  --rz-graphite-600: #5b6963;
  --rz-graphite-500: #74817b;

  --rz-font-sans: Inter, Manrope, "Helvetica Neue", Arial, sans-serif;
  --rz-font-mono: "Roboto Mono", "SFMono-Regular", Consolas, monospace;

  --rz-display-size: clamp(2.75rem, 4.3vw, 4rem);
  --rz-display-line: 1.04;
  --rz-h1-size: clamp(2.35rem, 3.6vw, 3.5rem);
  --rz-h2-size: clamp(1.85rem, 2.4vw, 2.5rem);
  --rz-h3-size: 1.5rem;
  --rz-body-lg-size: 1.125rem;
  --rz-body-size: 1rem;
  --rz-small-size: 0.875rem;

  --rz-space-1: 0.25rem;
  --rz-space-2: 0.5rem;
  --rz-space-3: 0.75rem;
  --rz-space-4: 1rem;
  --rz-space-5: 1.25rem;
  --rz-space-6: 1.5rem;
  --rz-space-8: 2rem;
  --rz-space-10: 2.5rem;
  --rz-space-12: 3rem;
  --rz-space-16: 4rem;
  --rz-space-20: 5rem;
  --rz-space-24: 6rem;

  --rz-radius-sm: 0.375rem;
  --rz-radius-md: 0.5rem;
  --rz-radius-lg: 0.75rem;

  --rz-shadow-soft: 0 16px 40px rgba(6, 63, 42, 0.08);
  --rz-shadow-media: 0 20px 50px rgba(17, 26, 23, 0.12);

  --rz-duration-fast: 160ms;
  --rz-duration-base: 260ms;
  --rz-ease-standard: cubic-bezier(0.2, 0, 0, 1);
}

body {
  margin: 0;
  font-family: var(--rz-font-sans);
  color: var(--rz-graphite-900);
  background: var(--rz-white);
}

.rz-container {
  width: min(1240px, calc(100% - 40px));
  margin-inline: auto;
}

.rz-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: var(--rz-radius-sm);
  border: 1px solid transparent;
  padding: 0 22px;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition:
    background var(--rz-duration-fast) var(--rz-ease-standard),
    border-color var(--rz-duration-fast) var(--rz-ease-standard),
    color var(--rz-duration-fast) var(--rz-ease-standard),
    transform var(--rz-duration-fast) var(--rz-ease-standard);
}

.rz-button:hover {
  transform: translateY(-1px);
}

.rz-button-primary {
  color: var(--rz-white);
  background: var(--rz-green-800);
  box-shadow: 0 10px 20px rgba(6, 63, 42, 0.12);
}

.rz-button-primary:hover {
  background: var(--rz-green-700);
}

.rz-button-secondary {
  color: var(--rz-green-900);
  background: var(--rz-white);
  border-color: var(--rz-green-800);
}

.rz-card {
  border: 1px solid var(--rz-border);
  border-radius: var(--rz-radius-md);
  background: var(--rz-white);
}

.rz-spec {
  font-family: var(--rz-font-mono);
  font-size: 0.8125rem;
  line-height: 1.55;
}

@media (max-width: 720px) {
  .rz-container {
    width: min(100% - 32px, 1240px);
  }

  .rz-button {
    min-height: 44px;
    padding-inline: 18px;
  }
}