.articles-wrapper {
  background-color: #ecf0f6;
}

.block--default {
  position: relative;
  z-index: 100;
}

.block--padding {
  padding-bottom: clamp(40px, 40px + 80 * ((100vw - 360px) / 1240), 120px);
  padding-top: clamp(40px, 40px + 80 * ((100vw - 360px) / 1240), 120px);
}

.articles-wrapper.block--padding {
  padding-top: 40px;
  padding-bottom: 0;
}

.no-overflow {
  overflow: hidden;
}

.block__header--center {
  text-align: center;
}

.block__header:not(:last-child) {
  margin-bottom: clamp(32px, 32px + 8 * ((100vw - 360px) / 1240), 40px);
}

.wrap {
  box-sizing: content-box;
  margin: 0 auto;
  max-width: 1136px;
  padding: 0 7.778%;
}

.wrap--large {
  max-width: 1380px;
}

.articles-wrapper h2 {
  font-family: Gotham SSm A, Gotham SSm B, Arial, sans-serif;
  font-weight: 800;
}

.h2.big,
h2.big {
  font-size: clamp(40px, 40px + 24 * ((100vw - 360px)/1240), 64px);
  line-height: 1;
  text-transform: uppercase;
}

.block__title:not(:last-child) {
  margin-bottom: 16px;
}

.block__title.big {
  word-wrap: break-word;
}

.h1 .highlight,
.h2 .highlight,
.h3 .highlight,
.h4 .highlight,
.h5 .highlight,
.h6 .highlight,
h1 .highlight,
h2 .highlight,
h3 .highlight,
h4 .highlight,
h5 .highlight,
h6 .highlight {
  color: #a2b5d1;
}

.intro {
  font-family: Gotham SSm A, Gotham SSm B, Arial, sans-serif;
  font-size: clamp(16px, 16px + 5 * ((100vw - 360px)/1240), 21px);
  font-weight: 500;
  line-height: 1.125;
}

.u-text-black {
  font-weight: 800;
}

.u-text-uppercase {
  text-transform: uppercase;
}

.grid {
  display: flex;
  flex-wrap: wrap;
}

.grid__cell {
  width: 100%;
}

@media (min-width: 42.5em) {
  .u-1of2--md > .grid__cell {
    width: 50%;
  }
}

@media (min-width: 53.75em) {
  .u-1of3--lg > .grid__cell {
    width: 33.3333333333%;
  }
}

@media (min-width: 75em) {
  .u-1of4--xxl > .grid__cell {
    width: 25%;
  }
}

.js-link {
  cursor: pointer;
}

.branche {
  flex: 1;
  min-width: 250px;
  overflow: hidden;
  position: relative;
  display: block;
}

.branche:focus.js-link,
.branche:hover.js-link {
  cursor: pointer;
}

.branche:focus .branche__image,
.branche:hover .branche__image {
  transform: scale(1.05);
}

.branche:focus .branche__image:after,
.branche:hover .branche__image:after {
  box-shadow: inset 0 -200px 80px -120px rgba(0, 0, 0, 0.64);
}

.branche:focus .branche__title,
.branche:hover .branche__title,
.branche__image {
  transform: scale(1.16);
}

.branche__image {
  display: block;
  height: 50vw;
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}

.branche__image:after {
  bottom: 0;
  box-shadow: inset 0 -200px 80px -120px rgba(0, 0, 0, 0.5);
  content: "";
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 33.3333333333%;
  transition: box-shadow 0.3s cubic-bezier(0.65, 0, 0.35, 1);
  width: 100%;
}

.branche__title {
  font-family: Gotham SSm A, Gotham SSm B, Arial, sans-serif;
  font-weight: 800;
  bottom: 32px;
  left: 32px;
  position: absolute;
  right: 32px;
  text-align: center;
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
  word-break: break-word;
  z-index: 100;
}

@media (min-width: 53.75em) {
  .branche__image {
    height: 25vw;
    max-height: 500px;
  }

  .branche__image:after {
    box-shadow: inset 0 -300px 100px -200px rgba(0, 0, 0, 0.5);
  }
}

.u-text-color-white {
  color: #fff;
}

.is-hidden {
  display: none;
}
