/* Fluid media card with the same edge treatment as the home banner. */
.media.media--page-new-home-3 {
  --media-radius: 32px;
  --media-control-gap: 20px;
  --media-height: 363px;
  width: 100%;
  max-width: none;
  padding-inline: 0;
  box-sizing: border-box;
}

.media--page-new-home-3 > .container {
  	margin-inline: auto;
    width: 100% !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

.media--page-new-home-3 .media-slider {
  width: 100%;
  max-width: none;
  height: var(--media-height);
  max-height: none;
}

.media--page-new-home-3 .media-picture {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
  border-radius: 36px;
}
.media--page-new-home-3 .media-picture::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;

  background: linear-gradient(
    226.28deg,
    rgba(255, 255, 255, 0) 38.39%,
    #FFFFFF 77.93%
  );
}

.media--page-new-home-3 .media-picture img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
  border-radius: 36px;
}

.media--page-new-home-3 .media-slide:not(.active) {
  visibility: hidden;
  pointer-events: none;
}

.media--page-new-home-3 .media-button,
.media--page-new-home-3 .media-arrow {
  position: absolute;
  right: 0;
  left: auto;
  margin: 0;
  background: #fff;
  box-sizing: border-box;
}

.media--page-new-home-3 .media-button {
  top: 0;
  bottom: auto;
  z-index: 2;
  max-width: calc(100% - 140px);
  padding: 0 0 var(--media-control-gap) var(--media-control-gap);
  border-radius: 0 0 0 var(--media-radius);
}

.media--page-new-home-3 .media-button a {
  width: max-content !important;
  min-width: 164px;
  max-width: 100%;
  height: auto !important;
  min-height: 41px;
  padding: 7px 24px;
  font-size: 18px !important;
  box-sizing: border-box;
  line-height: 25px;
  text-align: center;
  overflow-wrap: anywhere;
}

.media--page-new-home-3 .media-arrow {
  top: auto;
  bottom: 0;
  padding: var(--media-control-gap) 0 0 var(--media-control-gap);
  border-radius: var(--media-radius) 0 0 0;
}

.media--page-new-home-3 .media-arrow img {
  display: block;
}

.media--page-new-home-3 .media-button::before,
.media--page-new-home-3 .media-button::after,
.media--page-new-home-3 .media-arrow::before,
.media--page-new-home-3 .media-arrow::after {
  width: var(--media-radius);
  height: calc(var(--media-radius) + 1px);
  pointer-events: none;
}

.media--page-new-home-3 .media-button::before,
.media--page-new-home-3 .media-button::after {
  background: radial-gradient(circle at 0 100%, #0000 calc(var(--media-radius) - 1px), #fff var(--media-radius));
}

.media--page-new-home-3 .media-arrow::before,
.media--page-new-home-3 .media-arrow::after {
  background: radial-gradient(circle at 0 0, #0000 calc(var(--media-radius) - 1px), #fff var(--media-radius));
}


.media--page-new-home-3 .media-arrow img { width: 40px; height: 40px; z-index: 1;}
.media--page-new-home-3 .media-dots { right: 110px; left: auto; bottom: 15px; z-index: 1;}
.media--page-new-home-3 .media-logo--acf { left: 70px; top: 0; z-index: 1;}
.media--page-new-home-3 .media-logo--acf img { width: auto; height: auto; max-width: 100px; max-height: 100px; }
.media--page-new-home-3 .media-content { top: auto; bottom: 82px; left: 26px; width: calc(100% - 52px); max-width: 652px; z-index: 1;}
.media--page-new-home-3 .media-date { margin: 0; max-width: none; font-size: 16px; line-height: 22px; z-index: 1;}
.media--page-new-home-3 .media-title { max-width: 606px; margin: 0 0 4px; font-size: 24px !important; line-height: 33px; z-index: 1;}
.media--page-new-home-3 .media-text { display: block; max-width: none; margin: 0; font-size: 14px !important; line-height: 19px; overflow: visible; -webkit-line-clamp: unset; z-index: 1;}

@media (max-width: 1259px) {

  .media--page-new-home-3 .media-logo--acf { left: 50px; }
  .media--page-new-home-3 .media-content { max-width: 500px; bottom: 80px; }
  .media--page-new-home-3 .media-date { font-size: 12px; line-height: 17px; }
  .media--page-new-home-3 .media-title { max-width: 430px; font-size: 18px !important; line-height: 25px; }
  .media--page-new-home-3 .media-text { font-size: 12px !important; line-height: 17px; }
  .media--page-new-home-3 .media-dots { right: 188px; }
}
@media (max-width: 959px) {

  .media--page-new-home-3 .media-logo--acf { left: 40px; }
  .media--page-new-home-3 .media-content { max-width: 420px; bottom: 64px; }
  .media--page-new-home-3 .media-dots { right: 90px; }
}
@media (max-width: 767px) {
  .media.media--page-new-home-3 { --media-radius: 24px; --media-control-gap: 10px; }
  .media--page-new-home-3 .media-logo--acf { left: 96px; }
  .media--page-new-home-3 .media-content { max-width: 330px; bottom: 46px; }
  .media--page-new-home-3 .media-date { margin-bottom: 3px; font-size: 10px; line-height: 14px; }
  .media--page-new-home-3 .media-title { margin-bottom: 8px; font-size: 14px !important; line-height: 19px; }
  .media--page-new-home-3 .media-text { font-size: 10px !important; line-height: 14px; }
  .media--page-new-home-3 .media-button a { min-width: 110px; min-height: 35px; padding: 7px 14px; font-size: 14px !important; line-height: 19px; }
  .media--page-new-home-3 .media-dots { right: 90px; }
}
@media (max-width: 480px) {
  .media.media--page-new-home-3 { --media-height: 333px; }
  .media--page-new-home-3 .media-logo--acf { left: 26px; }
  .media--page-new-home-3 .media-content { left: 10px; width: calc(100% - 40px); bottom: 32px; }
  .media--page-new-home-3 .media-title { margin-bottom: 4px; }
  .media--page-new-home-3 .media-dots { right: 110px; bottom: 12px; }
  .media--page-new-home-3 .media-arrow img { width: 34px; height: 34px; }
}

/* Keep the corner cutouts on the card edges without the legacy negative margins. */
.media--page-new-home-3 .media-arrow,
.media--page-new-home-3 .media-arrow img,
.media--page-new-home-3 .media-arrow::before,
.media--page-new-home-3 .media-arrow::after {
  border: 0;
  box-shadow: none;
}

.media--page-new-home-3 .media-arrow::before,
.media--page-new-home-3 .media-arrow::after {
  margin: 0;
  width: var(--media-radius);
  height: var(--media-radius);
}

.media--page-new-home-3 .media-arrow::before {
  right: calc(100% - 1px);
  bottom: 0;
}

.media--page-new-home-3 .media-arrow::after {
  right: 0;
  bottom: calc(100% - 1px);
}