body {
  margin: 0;
  min-height: 100vh;
  background: var(--cg-color-surface-app);
  color: var(--cg-color-text-primary);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", sans-serif;
}

a {
  color: inherit;
}

.cg-public-shell {
  width: min(1120px, calc(100vw - 32px));
  margin: 0 auto;
  padding: var(--cg-layout-page-padding-expanded) 0;
}

.cg-hero {
  min-height: 72vh;
  display: grid;
  align-content: center;
  gap: var(--cg-space-4);
}

.cg-kicker {
  margin: 0;
  color: var(--cg-color-action-primary);
  font-size: var(--cg-font-size-caption);
  line-height: var(--cg-line-height-caption);
  font-weight: var(--cg-font-weight-caption);
  text-transform: uppercase;
}

h1,
h2,
p {
  margin-top: 0;
}

h1 {
  max-width: 760px;
  margin-bottom: 0;
  font-size: var(--cg-font-size-display-large);
  line-height: var(--cg-line-height-display-large);
}

h2 {
  margin-bottom: var(--cg-space-2);
  font-size: var(--cg-font-size-title-large);
  line-height: var(--cg-line-height-title-large);
}

p {
  max-width: 620px;
  color: var(--cg-color-text-secondary);
  font-size: var(--cg-font-size-body-large);
  line-height: var(--cg-line-height-body-large);
}

.cg-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--cg-space-3);
}

.cg-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--cg-button-size-large-height);
  padding: 0 var(--cg-button-size-large-padding-x);
  border: var(--cg-border-default) solid transparent;
  border-radius: var(--cg-button-state-radius);
  font-size: var(--cg-font-size-button);
  line-height: var(--cg-line-height-button);
  font-weight: var(--cg-font-weight-button);
  text-decoration: none;
}

.cg-button-primary {
  background: var(--cg-button-variant-primary-background);
  color: var(--cg-button-variant-primary-foreground);
}

.cg-button-secondary {
  background: var(--cg-button-variant-secondary-background);
  color: var(--cg-button-variant-secondary-foreground);
  border-color: var(--cg-button-variant-secondary-border-color);
}

.cg-panel {
  padding: var(--cg-surface-panel-padding);
  background: var(--cg-surface-panel-background);
  border: var(--cg-surface-panel-border-width) solid var(--cg-surface-panel-border-color);
  border-radius: var(--cg-surface-panel-radius);
}
