.hero-carrousel-articles-section {
  height: 630px;
}

.hero-carrousel-articles-section .hero-carrousel-articles,
.hero-carrousel-articles-section .hero-carrousel-articles .slick-list,
.hero-carrousel-articles-section .hero-carrousel-articles .slick-list .slick-track {
  height: 100%;
}

.hero-carrousel-articles.slick-slider {
  margin-bottom: 0;
}

.hero-carrousel-articles .slick-dots {
  bottom: 2rem;
}

@media screen and (max-width: 767px) {
  .hero-carrousel-articles .slick-dots {
    bottom: 15px;
  }
}

.hero-carrousel-articles .slick-dots li {
  margin: 0 8.5px;
}

@media screen and (max-width: 767px) {
  .hero-carrousel-articles .slick-dots li {
    margin: 0 5px;
  }

  .hero-carrousel-articles .slick-dots li,
  .hero-carrousel-articles .slick-dots li button,
  .hero-carrousel-articles .slick-dots li button::before {
    width: 12px;
    height: 12px;
  }
}

.hero-carrousel-articles .slick-dots li button::before {
  content: '';
  border: 1px solid rgb(255, 255, 255);
  opacity: 1;
}

.hero-carrousel-articles .slick-dots li.slick-active button::before {
  opacity: 1;
  background: rgb(255, 255, 255);
}

.hero-carrousel-articles .slick-dots li:not(.slick-active):active button::before,
.hero-carrousel-articles .slick-dots li:not(.slick-active):hover button::before,
.hero-carrousel-articles .slick-dots li:not(.slick-active):focus button::before {
  background: rgb(255, 255, 255, 0.75);
}

.hero-carrousel-articles .slick-arrow {
  cursor: pointer;
  z-index: 100;
  font-size: 0;
  padding: 0;
  width: 32px;
  height: 31px;
  border: none;
  background: transparent;
  opacity: 1;
  transition: opacity 0.25s ease;
}

.hero-carrousel-articles .slick-arrow::before {
  display: none;
}

.hero-carrousel-articles .slick-arrow.slick-prev {
  left: calc(12px + (28 / 1920 * 100vw));
}

.hero-carrousel-articles .slick-arrow.slick-next {
  right: calc(12px + (28 / 1920 * 100vw));
}

@media screen and (max-width: 1024px) {
  .hero-carrousel-articles .slick-arrow {
    transform: scale(0.75);
  }
}

@media screen and (max-width: 767px) {
  .hero-carrousel-articles .slick-arrow {
    transform: scale(0.5);
  }

  .hero-carrousel-articles .slick-arrow.slick-prev {
    left: 12px;
  }

  .hero-carrousel-articles .slick-arrow.slick-next {
    right: 12px;
  }
}

.hero-carrousel-articles__slide,
.hero-carrousel-articles__slide h2,
.hero-carrousel-articles__slide div,
.hero-carrousel-articles__slide p,
.hero-carrousel-articles__slide a {
  color: #ffff;
}

.hero-carrousel-articles__slide {
  width: 100%;
  height: 630px;
  display: flex !important;
  position: relative;
}

.hero-carrousel-articles__slide .trainline-background {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
  z-index: 2;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg width='960' height='380' viewBox='0 0 960 380' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='230.5' cy='175.5' r='8.5' fill='white'/%3E%3Cpath d='M1 56H69C91.5 56 89 61.4 89 91C89 120.6 89 150 89 161C89 176 92 176 120 176C148 176 199.667 176 222 176' stroke='white' stroke-width='2'/%3E%3C/svg%3E%0A"), url("data:image/svg+xml,%3Csvg width='960' height='380' viewBox='0 0 960 380' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M697.5 289.942H766C785 289.942 790.5 281.442 790.5 263.942C790.5 242.888 786 217.442 810 216.442C829.2 215.642 854.335 216.108 864.501 216.442C866.5 216.442 889 216.342 889 235.942C889 255.542 889 315.775 889 343.442C889 351.942 896.6 361.442 913 361.442C929.4 361.442 951.167 361.442 960 361.442' stroke='white' stroke-width='2'/%3E%3Ccircle cx='697.5' cy='289.942' r='8.5' fill='white'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat no-repeat;
  background-position: left top, right bottom;
  background-size: contain;
}

.hero-carrousel-articles__slide .trainline-background {
  right: 50%;
}

.hero-carrousel-articles__slide--reverse  .trainline-background {
  left: 50%;
  right: 0;
}

.hero-carrousel-articles__slide--reverse {
  flex-direction: row-reverse;
}

.hero-carrousel-articles__slide .col {
  width: calc(100% / 2);
}

.hero-carrousel-articles__slide .col--thumb {
  position: relative;
}

.hero-carrousel-articles__slide .col--thumb:before {
  display: block;
  content: "";
  width: 100%;
  padding-top: calc((21 / 32) * 100%);
}

.hero-carrousel-articles__slide .col--thumb img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-carrousel-articles__slide .col--content {
  position: relative;
  width: 100%;
  max-width: 50%;
}

.hero-carrousel-articles__slide .col--content .col--content__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 45.31%;
}

.hero-carrousel-articles__slide .col--content h2 {
  font-size: 4.303rem;

  font-weight: 900;
  line-height: 1;
  color: #FFF;
  padding: 0;
}

.hero-carrousel-articles__slide .col--content div p {
  font-size: 2.155rem;

  font-weight: 400;
  line-height: 1.2;
  margin-bottom: 1.5625rem;
}

.hero-carrousel-articles__slide .col--content a {
  font-size: 19px;

  font-weight: 600;
  line-height: 1.27;
  letter-spacing: 0.02em;
}

.hero-carrousel-articles__slide .col--content a svg {
  width: 21px;
  height: 21px;
}

@media screen and (max-width: 1024px) {
  .hero-carrousel-articles-section {
    height: 764px;
  }

  .hero-carrousel-articles__slide {
    height: 764px;
  }

  .hero-carrousel-articles__slide .col {
    width: unset;
  }

  .hero-carrousel-articles__slide .col--thumb:before {
    padding-top: 382px;
  }

  .hero-carrousel-articles__slide {
    flex-direction: column;
  }

  .hero-carrousel-articles__slide .trainline-background {
    right: 0;
    left: 0;
    bottom: 50%;
  }

  .hero-carrousel-articles__slide .trainline-background {
    background-image: url("data:image/svg+xml,%3Csvg width='1024' height='382' viewBox='0 0 1024 382' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_21_158)'%3E%3Ccircle cx='263' cy='118' r='8' fill='white'/%3E%3Cpath d='M-70 -60H30C63.0882 -60 59.4118 -52.0588 59.4118 -8.52941C59.4118 35 59.4118 78.2353 59.4118 94.4117C59.4118 116.471 63.8235 116.471 105 116.471C146.176 116.471 222.157 116.471 255 116.471' stroke='white' stroke-width='2'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_21_158'%3E%3Crect width='1024' height='382' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"), url("data:image/svg+xml,%3Csvg width='1024' height='382' viewBox='0 0 1024 382' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_21_158)'%3E%3Cpath d='M768.741 313.238H887.542C920.494 313.238 930.033 298.497 930.033 268.146C930.033 231.633 922.228 187.5 963.852 185.766C997.151 184.379 1040.74 185.188 1058.37 185.766C1061.84 185.766 1100.86 185.593 1100.86 219.585C1100.86 253.578 1100.86 358.042 1100.86 406.024C1100.86 420.766 1114.04 437.242 1142.49 437.242C1170.93 437.242 1208.68 437.242 1224 437.242' stroke='white' stroke-width='2'/%3E%3Ccircle cx='762' cy='313.496' r='8' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_21_158'%3E%3Crect width='1024' height='382' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    background-position: left top, right bottom;
  }

  .hero-carrousel-articles__slide .col--content {
    max-width: 100%;
    height: 382px;
    max-height: 382px;
  }

  .hero-carrousel-articles__slide .col--content .col--content__content {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .hero-carrousel-articles__slide .col--content h2 {
    font-size: calc(2.813rem + 100%);

    text-align: center;
  }

  .hero-carrousel-articles__slide .col--content div p {
    font-size: calc(1.563rem + 100%);
  }
}

@media screen and (max-width: 767px) {
  .hero-carrousel-articles-section {
    height: 420px;
  }

  .hero-carrousel-articles__slide {
    height: 420px;
  }

  .hero-carrousel-articles__slide {
    flex-direction: column;
  }

  /* .hero-carrousel-articles__slide--reverse {
    flex-direction: column;
  } */

  .hero-carrousel-articles__slide .col {
    width: 100%;
    max-width: 100%;
    height: 210px;
    max-height: 210px;
  }

  .hero-carrousel-articles__slide .col--content {
    max-width: 100%;
    height: 210px;
    max-height: 210px;
  }

  .hero-carrousel-articles__slide .col--content .col--content__content {
    width: 100%;
    max-width: 300px;
    padding: 0 10px;
  }

  .hero-carrousel-articles__slide .trainline-background {
    background-image: url("data:image/svg+xml,%3Csvg width='320' height='211' viewBox='0 0 320 211' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_21_161)'%3E%3Ccircle cx='124' cy='20' r='3' fill='white'/%3E%3Cpath d='M50.1549 -0.5C50.1549 23.0842 50.1549 -1.10429 50.1549 7.6601C50.1549 19.6115 51.7625 19.6115 66.7663 19.6115C81.7702 19.6115 109.456 19.6115 121.423 19.6115' stroke='white' stroke-width='2'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_21_161'%3E%3Crect width='320' height='211' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"), url("data:image/svg+xml,%3Csvg width='320' height='211' viewBox='0 0 320 211' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_21_161)'%3E%3Ccircle cx='236.915' cy='197.915' r='2.91503' fill='white'/%3E%3Cpath d='M239.83 197.727H283.119C295.126 197.727 298.601 192.356 298.601 181.297C298.601 167.992 295.758 151.911 310.924 151.279C323.058 150.774 338.942 151.068 345.366 151.279C346.629 151.279 360.848 151.216 360.848 163.602C360.848 175.988 360.848 214.053 360.848 231.537C360.848 236.908 365.651 242.912 376.015 242.912C386.379 242.912 400.134 242.912 405.717 242.912' stroke='white' stroke-width='2'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_21_161'%3E%3Crect width='320' height='211' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    background-position: left top, right bottom;
  }

  .hero-carrousel-articles__slide .col--content h2 {
    font-size: calc(1.625rem + 37.5%);
  }

  .hero-carrousel-articles__slide .col--content div p {
    font-size: calc(1rem + 37.5%);
  }

  .hero-carrousel-articles__slide .col--content a {
    font-size: 15px;
  }

  .hero-carrousel-articles__slide .col--content a svg {
    width: 18px;
    height: 18px;
  }
}