.translation-general-page {
  color: #17345c;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.translation-general-page .translation-general-hero {
  padding: clamp(4rem, 8vw, 7.5rem) 0;
  color: #fff;
  background: linear-gradient(115deg, #17345c, #245d93 58%, #2d87b7);
}

.translation-general-page .translation-general-hero__grid,
.translation-general-page .translation-general-intro,
.translation-general-page .translation-general-documents,
.translation-general-page .translation-general-cta .wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(270px, .75fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: center;
}

.translation-general-page .translation-general-hero h1 {
  max-width: 880px;
  margin: .2rem 0 1rem;
  font-size: clamp(2.55rem, 5.4vw, 5rem);
}

.translation-general-page .translation-general-hero .lead {
  max-width: 720px;
  margin: 0 0 1.7rem;
  color: #e7f5ff;
  line-height: 1.65;
}

.translation-general-page .translation-general-hero .button,
.translation-general-page .translation-general-cta .button {
  font-family: inherit;
}

.translation-general-page .translation-general-hero .button {
  background: #fff;
  border-color: #fff;
  color: #17345c;
}

.translation-general-page .translation-general-hero__note,
.translation-general-page .translation-general-callout {
  margin: 0;
  padding: clamp(1.25rem, 3vw, 2rem);
  border-left: 3px solid #83e5fb;
  background: rgba(255, 255, 255, .1);
  color: #e6f6ff;
  font-size: .98rem;
  line-height: 1.65;
}

.translation-general-page .translation-general-hero__note p {
  margin: 0 0 .75rem;
  font-weight: 700;
}

.translation-general-page .translation-general-hero__note ul {
  display: grid;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: .9rem;
}

.translation-general-page .translation-general-hero__note li::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 .55rem .08rem 0;
  border-radius: 50%;
  background: #83e5fb;
}

.translation-general-page .translation-general-section {
  padding: clamp(3.5rem, 7vw, 6rem) 0;
}

.translation-general-page .translation-general-section--soft {
  background: #f2f8fc;
  border-block: 1px solid #d7e6f4;
}

.translation-general-page .translation-general-section h2,
.translation-general-page .translation-general-cta h2 {
  max-width: 760px;
  margin: .3rem 0 1rem;
  font-size: clamp(2rem, 4vw, 3.35rem);
}

.translation-general-page .translation-general-intro > div > p:not(.eyebrow),
.translation-general-page .translation-general-cta p:not(.eyebrow) {
  max-width: 740px;
  color: #577391;
  line-height: 1.75;
}

.translation-general-page .translation-general-callout {
  color: #17345c;
  border-color: #3bc0ec;
  background: #edf9ff;
}

.translation-general-page .translation-general-callout strong {
  display: block;
  font-size: 1.15rem;
}

.translation-general-page .translation-general-callout p {
  margin: .6rem 0 1rem;
  color: #486887;
  font-size: .92rem;
}

.translation-general-page .translation-general-callout a {
  color: #7b10b9;
  font-size: .9rem;
  font-weight: 800;
}

.translation-general-page .translation-general-heading {
  max-width: 720px;
  margin-bottom: 2rem;
}

.translation-general-page .translation-general-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.translation-general-page .translation-general-grid article {
  padding: clamp(1.25rem, 2.5vw, 1.75rem);
  border-top: 3px solid #3bc0ec;
  background: #fff;
}

.translation-general-page .translation-general-grid article:nth-child(3n + 2) { border-color: #5688fa; }
.translation-general-page .translation-general-grid article:nth-child(3n) { border-color: #9919df; }

.translation-general-page .translation-general-grid h3 {
  margin: 0 0 .65rem;
  font-size: 1.1rem;
}

.translation-general-page .translation-general-grid p {
  margin: 0;
  color: #577391;
  font-size: .92rem;
  line-height: 1.65;
}

.translation-general-page .translation-general-documents ul {
  display: grid;
  gap: .7rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.translation-general-page .translation-general-documents li {
  padding: .75rem 0;
  border-bottom: 1px solid #d7e6f4;
  color: #486887;
  font-size: .94rem;
  line-height: 1.5;
}

.translation-general-page .translation-general-documents li::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .65rem .08rem 0;
  border-radius: 50%;
  background: #3bc0ec;
}

.translation-general-page .translation-general-cta {
  padding: clamp(3.5rem, 7vw, 5.75rem) 0;
  background: linear-gradient(110deg, #f0eaff, #e5f8ff);
}

.translation-general-page .translation-general-cta .button { justify-self: start; }

@media (max-width: 900px) {
  .translation-general-page .translation-general-hero__grid,
  .translation-general-page .translation-general-intro,
  .translation-general-page .translation-general-documents,
  .translation-general-page .translation-general-cta .wrap { grid-template-columns: 1fr; }
  .translation-general-page .translation-general-hero__note { max-width: 620px; }
  .translation-general-page .translation-general-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .translation-general-page .translation-general-hero { padding: 3.2rem 0; }
  .translation-general-page .translation-general-hero h1 { font-size: clamp(2.25rem, 11vw, 3.1rem); }
  .translation-general-page .translation-general-hero .button,
  .translation-general-page .translation-general-cta .button { width: 100%; text-align: center; }
  .translation-general-page .translation-general-section { padding: 3rem 0; }
  .translation-general-page .translation-general-grid { grid-template-columns: 1fr; }
  .translation-general-page .translation-general-callout,
  .translation-general-page .translation-general-hero__note { padding: 1.15rem; }
}
