/*.cen-brand-landing-page__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}*/
.cen-brand-landing-page__quote {
  grid-column: span 2;
  height: 100%;
  box-sizing: border-box;
}
.cen-brand-landing-page-icon img {
  width: 100px;
  height: 100px;
}
.node--type-cen-brand-landing-page header {
  position: relative;
  z-index: 10;
}
/* ----------------------------------------------
   HERO PANEL
   --------------------------------------------- */
   
.cen-brand-landing-page__hero {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 1rem;
  align-items: stretch;
  background: var(--color-bg);
  margin-bottom:2rem;
  /*border: 5px solid red;*/
}

.cen-brand-landing-page__hero-content {
  background: var(--brand-landing-primary);
  padding: 3rem;
  border-radius: 1rem;
  z-index:4;
  position: relative;
}
.cen-brand-landing-page__hero-image {
  /*height: 100%;*/
  z-index:4;
  position: relative;
}
.cen-brand-landing-page__hero-image img {
  width: 100%;
  object-fit: cover;
  border-radius: 1rem;  
  display: block;
  height: 100%;
}
.cen-brand-landing-page__hero-image div {
 height:100%;
 }
/*.cen-brand-landing-page__hero-image .field, .cen-brand-landing-page__hero-image img {
  height: 100%;
}*/
.govuk-heading-xl.brand-landing-title {
  color: var(--color-bg);
  }
/* -- */
.cen-brand-landing-page__hero {
  position: relative;
  padding: /*4rem*/ 2rem 0;
}

/*.cen-brand-landing-page__hero {
overflow: hidden;
}*/
.cen-brand-landing-page__hero::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(-50vw + 50%);
  right: calc(-50vw + 50%);
  background: var(--color-bg);
  z-index: 2;
}

/* ---------------------------------------------
   EXPLORE CARDS
   --------------------------------------------- */
.cen-brand-landing-page__explore {
  position: relative;
  background: #f6f4e7;
  padding: 2rem 0;
  margin-top: 1rem;
  z-index: 99
}
.cen-brand-landing-page__explore-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.explore-card {
  background: /*#f1c04e*/ var(--brand-landing-primary);
  border-radius: 24px;
  overflow: hidden;
  /*height: 100%;*/
  display: flex;
  flex-direction: column;
}
.explore-link {
  text-decoration: none;
  color: #244742;
  }
.explore-card__title {
  font-size: 1.5rem;
  font-weight: 501;
  margin-top:0;
}
.explore-card__content {
  padding: 1.5rem;
}
/*.cen-brand-landing-page__explore-grid > div,
.cen-brand-landing-page__explore-grid > div > div {
display: contents;
}*/
/* MAKE CARD IMAGES CONSISTENT SIZE */
.explore-card__image img {
  width: 100%;
  height: auto;
  display: block;
}
/* MAKE CARDS FILL GRID CELLS */
.explore-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
}
.explore-card__content {
  flex-grow: 1;
}
.explore-card__image-tile div {
  width: 100%;
  aspect-ratio: 16 /7;
  overflow: hidden;
}
.explore-card__image-tile div img {
  width: 100%;
  object-fit: cover;
  height: 100%;
}
.explore-card__image-tile-only {
  max-height: 500px;
}
.explore-card__arrow img {
  width: 50px;
  height: auto;
  float: right;
  padding: 0 1.5rem 1.5rem 0;
}
/* STYE QUOTE CARD */
.cen-brand-landing-page__quote {
  background: #244742;
  padding: 2rem;
  border-radius: 24px;
  font-size: 1.25rem;
}

/* ---------------------------------------------
   QUOTE CARD
   --------------------------------------------- */

.cen-brand-landing-page__quote {
  background: var(--auto-quote-color);
  border-radius: 24px;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cen-brand-landing-page__quote-text {
  font-size: 2.5rem;
  line-height: 1.4;
  color: var(--auto-quote-text);
  font-weight: 400;
  margin: 0;
  font-style:italic;
  vertical-align: top;
  display: inline;
}

 .cen-brand-landing-page__quote p {
  margin-top: 1.5rem;
  font-size: 1.5rem;
  font-weight: 501;
  color: var(--auto-quote-text);
  margin-bottom: 0;
}
/*  OVERSIZED-QUOTE MARKS*/
.cen-brand-landing-page__quote {
  position: relative;
}
.explore-link {
  display: block;
  width: 100%;
  min-width: 0;
  text-decoration: none;
  border-radius: 24px;
}
/* ---------------------------------------------
   MOBILE STYLES
   --------------------------------------------- */
@media (max-width: 768px) {

  .cen-brand-landing-page__hero {
    grid-template-columns: 1fr;
  }

  .cen-brand-landing-page__explore-grid {
    /*display: grid 
    grid-template-columns: 1fr;*/
    display: block;
  }
  .explore-card-image-only {
    display: none;
  }
    .cen-brand-landing-page__hero, .cen-brand-landing-page__explore-header, .cen-brand-landing-page__explore-grid {
    padding: 1rem;
  }
    .cen-brand-landing-page__explore-grid {
    gap: 1rem 0;
  }
  .explore-card {
    height: initial;
  }
  .brand-landing-news, .brand-landing-events {
  /*margin-top: 4rem;
  padding-bottom: 5rem;*/
  padding: 1rem;
}
}

.explore-link:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 20px rgb(0 0 0 / 15%);
}
@media (max-width: 768px) {

  .explore-link,
  .explore-card {
    height: auto;
    min-height: 0;
    margin-bottom: 1rem;
  }

}
@media (max-width: 768px) {

  .explore-card__content {
    flex-grow: 0;
  }

}





@media (max-width: 768px) {

  .explore-card {
    width: 100%;
  }

  .explore-card__content {
    padding: 1.5rem;
  }

  .explore-card__icon img {
    width: 64px;
    height: 64px;
  }

}

@media (max-width: 768px) {

  .explore-card--image img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }

}

@media (max-width: 768px) {

  .cen-brand-landing-page__hero-image {
    order: -1;
  }

}

@media (max-width: 768px) {

  .cen-brand-landing-page__quote {
    padding: 1.5rem;
    font-size: 1.125rem;
  }

}

/* ---------------------------------------------
   BRAND LANDING NEWS
   --------------------------------------------- */
.brand-landing-news, .brand-landing-events {
  margin-top: 4rem;
  padding-bottom: 5rem;
}
.brand-landing-news header, .brand-landing-events header {
  background: unset;
  z-index: 3;
}
.brand-landing-news h2, .brand-landing-events h2 {
  margin-top: 1rem;
}
.brand-landing-news {
  background:#FFFFFF;
  }
.brand-landing-news::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(-50vw + 50%);
  right: calc(-50vw + 50%);
  background: #FFFFFF;
  z-index: 1;
}