:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --gray-900: #171412;
  --gray-700: #6f6862;
  --gray-220: #ebebeb;
  --gray-200: #f1efee;
  --gray-100: #ffffff;
  --gray-75: #fbfaf9;
  --bg: var(--gray-100);
  --shape: var(--gray-75);
  --border: var(--gray-200);
  --text: var(--gray-900);
  --muted: var(--gray-700);
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius: 8px;
  --radius-pill: 999px;
  --max: 1180px;
  --page-gutter: clamp(18px, 4vw, 56px);
  --heading: "Inter Tight", Arial, sans-serif;
  --body: "Inter Tight", Arial, sans-serif;
  --type-h2-size: clamp(30px, 3.4vw, 48px);
  --type-h2-line: 1.08;
  --type-h3-size: 23px;
  --type-h3-line: 1.16;
  --type-h4-weight: 600;
  --type-lead-size: 18px;
  --type-lead-line: 1.35;
  --type-body-size: 16px;
  --type-body-weight: 500;
  --type-body-line: 1.45;
  --type-small-size: 14px;
  --type-small-weight: 500;
  --type-small-line: 1.35;
  --type-regular-weight: 400;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--body);
  font-size: var(--type-body-size);
  font-weight: var(--type-body-weight);
  line-height: var(--type-body-line);
}

a {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3,
p,
ul {
  margin: 0;
}

h1,
h2,
h3 {
  font-family: var(--heading);
  letter-spacing: 0;
}

.page-container.page-container {
  width: 100%;
  max-width: calc(var(--max) + var(--page-gutter) * 2);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--page-gutter);
  padding-right: var(--page-gutter);
}

.section {
  width: 100%;
}

.legal-page {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, var(--max));
  justify-content: center;
  gap: var(--space-5);
  padding-top: calc(var(--space-6) + var(--space-3));
  padding-bottom: calc(var(--space-6) * 4);
}

.legal-page__head,
.legal-docs,
.legal-content {
  width: 100%;
}

.breadcrumbs,
.back-link {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  border-radius: var(--radius-md);
  background: var(--shape);
  color: var(--muted);
  font-size: var(--type-small-size);
  font-weight: var(--type-small-weight);
  line-height: var(--type-small-line);
}

.breadcrumbs {
  margin-left: 0;
  margin-right: auto;
  justify-self: start;
  padding: var(--space-2) var(--space-4);
}

.breadcrumbs svg,
.back-link svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: block;
}

.breadcrumbs span {
  color: var(--text);
}

.legal-page__head {
  display: grid;
  gap: var(--space-6);
}

.breadcrumbs + .legal-page__head,
.breadcrumbs + .legal-content {
  margin-top: var(--space-6);
}

.legal-page__head h1,
.legal-content h1,
.reviews-page__title {
  max-width: none;
  font-size: var(--type-h2-size);
  font-weight: var(--type-h4-weight);
  line-height: var(--type-h2-line);
}

.legal-page__head p {
  color: var(--muted);
  font-size: var(--type-lead-size);
  font-weight: var(--type-regular-weight);
  line-height: var(--type-lead-line);
}

.legal-docs {
  display: grid;
  margin-top: calc(var(--space-6) * 2);
  border-top: 1px solid var(--border);
}

.legal-doc {
  display: grid;
  gap: var(--space-4);
  padding: calc(var(--space-6) + var(--space-3)) 0;
  border-bottom: 1px solid var(--border);
}

.legal-doc:last-child {
  border-bottom: 0;
}

.legal-doc:first-child {
  margin-top: calc(var(--space-6) * 3);
}

.legal-doc__title {
  color: var(--text);
  font-size: var(--type-h3-size);
  font-weight: var(--type-body-weight);
  line-height: var(--type-h3-line);
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

.legal-doc__title svg {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  color: var(--gray-220);
}

.legal-doc__text {
  color: var(--muted);
  font-size: var(--type-lead-size);
  font-weight: var(--type-regular-weight);
  line-height: var(--type-lead-line);
}

.back-link {
  margin-left: 0;
  margin-right: auto;
  justify-self: start;
  margin-bottom: calc(var(--space-6) * 3);
  padding: var(--space-2) var(--space-4);
  color: var(--text);
}

.legal-content {
  display: grid;
  gap: var(--space-6);
}

.legal-content h2 {
  max-width: none;
  font-size: var(--type-h3-size);
  font-weight: var(--type-h4-weight);
  line-height: var(--type-h3-line);
}

.legal-content p,
.legal-content ul {
  color: var(--text);
  font-size: var(--type-lead-size);
  font-weight: var(--type-regular-weight);
  line-height: var(--type-lead-line);
}

.legal-content ul {
  margin: 0;
  padding-left: 1.4em;
  display: grid;
  gap: var(--space-2);
}

.reviews-page {
  max-width: none;
  display: grid;
  gap: var(--space-4);
  padding-top: calc(var(--space-6) + var(--space-3));
  padding-bottom: calc(var(--space-6) * 4);
}

.reviews-count-badge {
  width: fit-content;
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--shape);
  color: var(--muted);
  font-size: var(--type-small-size);
  font-weight: var(--type-small-weight);
  line-height: var(--type-small-line);
}

.reviews-page__grid {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.review-card {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--shape);
  padding: var(--space-4);
  display: grid;
  gap: var(--space-2);
}

.review-card__name {
  font-size: var(--type-body-size);
  font-weight: var(--type-small-weight);
}

.review-card__meta,
.review-card__text {
  color: var(--muted);
}