section.documents .box {
  background: var(--trafsysblue);
  color: var(--white);
  border-radius: 1.25rem;
  padding: 1.25rem 1.5625rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  gap: 2.5rem;
}
section.documents .box h3 {
  font: var(--body-large-font);
}
section.documents .box .text-link {
  margin-top: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
section.documents .box .text-link p {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-top: auto;
  font: var(--body-small-font);
}
section.documents .box .text-link a {
  margin-top: auto;
  color: var(--white);
  text-decoration: underline;
}
section.documents .box .text-link a [class^=icon]::after {
  background: var(--white);
}
@container main (min-width: 64.0625rem) {
  section.documents .box {
    min-height: 21rem;
  }
  section.documents .box .text-link {
    gap: 30%;
  }
  section.documents .box a [class^=icon] {
    width: 3.875rem;
    height: 3.875rem;
  }
}
@container main (min-width: 48rem) and (max-width: 64rem) {
  section.documents .box {
    min-height: 9.875rem;
  }
  section.documents .box .text-link {
    gap: 1.25rem;
  }
  section.documents .box a [class^=icon] {
    width: 2.625rem;
    height: 2.625rem;
  }
}
@container main (max-width: 47.9375rem) {
  section.documents .box {
    min-height: 11.875rem;
  }
  section.documents .box .text-link {
    gap: 1.25rem;
  }
  section.documents .box a [class^=icon] {
    width: 2.625rem;
    height: 2.625rem;
  }
}