/* =================================================================
   News (blog) list + single post
   (loads after style.css, about.css and stations.css - the light
    header variant is reused from stations.css)
   ================================================================= */

/* =================================================================
   Shared shell
   ================================================================= */
.page_header_news { background-image: url(../images/news-header-bg.jpg); }
/* a dusk shot of one of our forecourts - lighter scrim than the site default
   of .6 so the canopy and the price board stay readable */
.page_header.page_header_news:before { background-color: rgba(6,18,49,.45); }
.sec_news { background-color: var(--bg_color); }
.bl_wrap { padding: 121px 0 126px; }

.bl_row { display: flex; flex-wrap: wrap; justify-content: space-between; }
.bl_main { width: 65.12%; }
.bl_side { width: 31.78%; }

/* =================================================================
   List: one post
   ================================================================= */
.bl_item + .bl_item { margin-top: 44.2px; }

.bl_thumb { position: relative; overflow: hidden; margin-bottom: 29.75px; }
.bl_thumb img {
  width: 100%; aspect-ratio: 840 / 472; object-fit: cover; display: block;
  transition: transform .6s ease;
}
.bl_thumb .bl_mask {
  position: absolute; z-index: 2; inset: 0;
  background-color: rgba(6,18,49,.35); opacity: 0; transition: opacity .5s ease;
  pointer-events: none;
}
.bl_thumb .bl_link { position: absolute; z-index: 3; inset: 0; }
.bl_item:hover .bl_thumb img { transform: scale(1.05); }
.bl_item:hover .bl_mask { opacity: 1; }

.bl_title {
  font-family: Outfit, sans-serif; font-size: 35px; line-height: 38px; font-weight: 500;
  letter-spacing: -1px; margin: 0;
}
.bl_title a { color: var(--text_dark); }
.bl_title a:hover { color: var(--text_link); }

.bl_content { margin-top: 18.7px; }
.bl_meta {
  font-family: "DM Sans", sans-serif; font-size: 14px; line-height: 21px;
  color: #898A8E; margin: 0;
}
.bl_meta a { color: #898A8E; }
.bl_meta a:hover { color: var(--text_link); }
.bl_meta_item + .bl_meta_item { margin-left: 20px; }
.bl_meta_item.bl_comments:before {
  content: '\e847'; font-family: fontello; font-size: 13px; margin-right: 3.9px;
}
.bl_excerpt { margin-top: 16.15px; font-size: 17px; line-height: 28.05px; color: var(--text); }
.bl_excerpt p { margin: 0; }

/* "Read More" - the label is hidden and slides out from under the arrow */
.bl_more {
  position: relative; display: inline-block; overflow: hidden;
  margin-top: 24px; z-index: 1;
  font-family: Outfit, sans-serif; font-size: 15px; line-height: 21px; font-weight: 500;
  color: var(--text_dark);
}
.bl_more:hover { color: var(--text_link); }
.bl_more .link_text {
  position: relative; display: inline-block; vertical-align: middle;
  margin-right: 0; text-indent: -110px; visibility: hidden; opacity: 0; white-space: nowrap;
  transition: visibility .4s, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s;
}
.bl_more:hover .link_text {
  opacity: 1; text-indent: 0; margin-right: 6px; visibility: visible;
  transition: visibility .4s, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s;
}
.bl_more .link_icon {
  position: relative; display: inline-block; vertical-align: middle; overflow: hidden;
  width: 1.4em; height: 1.4em; line-height: 1.4em; text-align: center;
}
.bl_more .link_icon:before {
  content: '\e9a4'; font-family: fontello; font-size: 11px; line-height: inherit;
  display: inline-block; vertical-align: top; color: currentColor; margin: 0; width: auto;
}

/* =================================================================
   Pagination
   ================================================================= */
.bl_pagination { margin-top: 48px; }
.bl_pagination a, .bl_pagination span {
  display: inline-block; box-sizing: border-box;
  width: 52px; height: 52px; line-height: 49px; text-align: center;
  border: .8px solid var(--bd_color); border-radius: 50%;
  margin: 2px 5px 2px 0;
  font-family: Outfit, sans-serif; font-size: 17px; font-weight: 400;
  color: var(--text_dark); background-color: transparent;
  transition: background-color .3s ease, border-color .3s ease, color .3s ease;
}
.bl_pagination a:hover {
  background-color: var(--text_link); border-color: var(--text_link); color: #fff;
}
.bl_pagination .current {
  background-color: var(--text_dark); border-color: var(--text_dark); color: #fff;
}
.bl_pagination .bl_pag_prev:before { content: '\e907'; font-family: fontello; font-size: 14px; }
.bl_pagination .bl_pag_next:before { content: '\e908'; font-family: fontello; font-size: 14px; }

/* =================================================================
   Sidebar
   ================================================================= */
.bl_side_inner {
  background-color: #FFFFFF; padding: 69.7px 0;
  /* the column is stretched by the flex row, so the card can travel with the scroll */
  position: sticky; top: 145px;
}
.bl_widget { padding: 0 40px; }
.bl_widget + .bl_widget { margin-top: 40px; }
.bl_widget_title {
  font-family: Outfit, sans-serif; font-size: 19px; line-height: 24.7px; font-weight: 500;
  color: var(--text_dark); margin: -7px 0 24.7px;
}

.bl_search { position: relative; }
.bl_search input[type="search"] {
  box-sizing: border-box; width: 100%; height: 50px;
  padding: 12.32px 19.2px 12.32px 48px;
  border: .8px solid var(--bd_color); background-color: transparent; border-radius: 0;
  font-family: "DM Sans", sans-serif; font-size: 16px; line-height: 24px; color: var(--text);
  outline: none; transition: border-color .3s ease;
}
.bl_search input[type="search"]:focus { border-color: var(--text_link); }
.bl_search .bl_search_icon {
  position: absolute; left: 19px; top: 50%; transform: translateY(-50%);
  font-size: 15px; color: var(--text_light); pointer-events: none;
}
.bl_search .bl_search_icon:before { margin: 0; width: auto; }

.bl_recent_item { display: flex; align-items: flex-start; }
.bl_recent_item + .bl_recent_item { margin-top: 27px; }
.bl_recent_thumb { flex: 0 0 100px; width: 100px; height: 100px; overflow: hidden; }
.bl_recent_thumb img { width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .5s ease; }
.bl_recent_item:hover .bl_recent_thumb img { transform: scale(1.06); }
.bl_recent_body { padding-left: 25px; }
.bl_recent_info {
  font-family: Outfit, sans-serif; font-size: 12px; line-height: 18px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase; color: var(--text_light);
}
.bl_recent_info a { color: var(--text_dark); }
.bl_recent_info .bl_sep { margin: 0 7px; }
.bl_recent_title {
  font-family: Outfit, sans-serif; font-size: 19px; line-height: 27.56px; font-weight: 500;
  letter-spacing: -.6px; margin: 8px 0 0;
}
.bl_recent_title a { color: var(--text_dark); }
.bl_recent_title a:hover { color: var(--text_link); }

.bl_tags a {
  display: inline-block;
  font-family: Outfit, sans-serif; font-size: 13px; line-height: 17px; font-weight: 400;
  color: var(--text); background-color: #FFFFFF;
  border: .8px solid var(--bd_color); padding: 7px 18px 9px; margin: 0 5px 5px 0;
  transition: background-color .3s ease, border-color .3s ease, color .3s ease;
}
.bl_tags a:hover { background-color: var(--text_link); border-color: var(--text_link); color: #fff; }

.bl_banner img { width: 100%; height: auto; display: block; }

/* =================================================================
   Single post
   ================================================================= */
.page_header_bare { background: none; }
.page_header_bare:before { display: none; }

.bl_hero {
  position: relative;
  background-position: center center; background-repeat: no-repeat; background-size: cover;
  background-color: #061231;
  min-height: 612px; display: flex; align-items: center;
}
.bl_hero:before { content: ''; position: absolute; inset: 0; background-color: rgba(6,18,49,.55); }
.bl_hero_inner {
  position: relative; z-index: 2; box-sizing: border-box;
  width: 712px; max-width: 100%; margin: 0 auto; padding: 0 50px; text-align: center;
}
.bl_cat a {
  display: inline-block;
  font-family: Outfit, sans-serif; font-size: 11px; line-height: 14px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase;
  color: #FFFFFF; background-color: #3C4E9C; padding: 6px 16px; margin: 3px 0;
  transition: background-color .3s ease;
}
.bl_cat a:hover { background-color: #2C3B78; color: #fff; }
.bl_hero_title {
  font-family: Outfit, sans-serif; font-size: 57px; line-height: 57px; font-weight: 500;
  letter-spacing: -1.7px; color: #FFFFFF; margin: 27px 0 0;
}
.bl_hero_meta {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  font-family: "DM Sans", sans-serif; font-size: 14px; line-height: 21px; color: #898A8E;
  margin-top: 30.8px;
}
.bl_hero_meta a { color: #898A8E; }
.bl_hero_meta a:hover { color: var(--text_link); }
.bl_hero_avatar {
  width: 32px; height: 32px; border-radius: 50%; overflow: hidden; margin-right: 10px;
  background-color: #FFFFFF; flex: 0 0 32px;
}
.bl_hero_avatar img {
  width: 100%; height: 100%; object-fit: contain; display: block;
  padding: 4px; box-sizing: border-box;
}
.bl_hero_meta .bl_meta_item + .bl_meta_item { margin-left: 20px; }

.bl_single_wrap { padding: 106px 0 126px; }
.bl_single { width: 840px; max-width: 100%; margin: 0 auto; }
.bl_article { width: 630px; max-width: 100%; margin: 0 auto; }

.bl_article p { font-size: 17px; line-height: 28.05px; color: var(--text); }
.bl_article h5 {
  font-family: Outfit, sans-serif; font-size: 24px; line-height: 29px; font-weight: 500;
  letter-spacing: -.5px; color: var(--text_dark); margin: 38px 0 19px;
}
.bl_dropcap:first-letter {
  float: left; font-family: Outfit, sans-serif; font-size: 74px; line-height: 62px;
  font-weight: 500; color: var(--text_dark); margin: 6px 16px 0 0;
}
.bl_quote {
  position: relative; margin: 44px 0; padding: 0 0 0 40px;
  border-left: 3px solid var(--text_link);
  font-family: Outfit, sans-serif; font-size: 24px; line-height: 34px; font-weight: 500;
  letter-spacing: -.5px; color: var(--text_dark);
}
.bl_quote cite {
  display: block; margin-top: 16px;
  font-family: "DM Sans", sans-serif; font-size: 15px; line-height: 24px; font-weight: 400;
  font-style: normal; color: var(--text_light);
}

/* galleries break out of the 630px column to the full 1290px content width */
.bl_gallery_wide {
  width: 1290px; max-width: calc(100vw - 60px);
  margin: 40px 0 40px calc((630px - 1290px) / 2);
  display: flex; gap: 8px;
}
.bl_gallery_wide figure { margin: 0; flex: 1 1 0; overflow: hidden; }
.bl_gallery_wide img { width: 100%; aspect-ratio: 641 / 478; object-fit: cover; display: block; }
.bl_gallery_solo { display: block; }
.bl_gallery_solo img { width: 100%; aspect-ratio: 1290 / 950; object-fit: cover; display: block; }
.bl_gallery_solo figcaption {
  font-size: 15px; line-height: 24px; color: var(--text_light); margin-top: 14px; text-align: center;
}

/* ---------------- post footer ---------------- */
.bl_post_footer { margin-top: 47px; }
.bl_post_tags { display: flex; align-items: center; flex-wrap: wrap; }
.bl_post_tags .bl_tags_label { font-size: 17px; line-height: 28.05px; color: var(--text);
  margin-right: 8.5px; }
.bl_post_tags a {
  display: inline-block;
  font-family: Outfit, sans-serif; font-size: 13px; line-height: 16px; font-weight: 400;
  color: var(--text); background-color: var(--bg_color);
  border: .8px solid var(--bd_color); padding: 8px 18px 9px; margin: 3.25px 6.5px 3.25px 0;
  transition: background-color .3s ease, border-color .3s ease, color .3s ease;
}
.bl_post_tags a:hover { background-color: var(--text_link); border-color: var(--text_link); color: #fff; }

.bl_post_share { display: flex; align-items: center; margin-top: 56px; }
.bl_post_share .bl_share_label {
  font-family: "DM Sans", sans-serif; font-size: 14px; color: #898A8E; margin-right: 24px;
}
.bl_post_share a {
  display: inline-block; width: 23.2px; height: 28.85px; line-height: 28.85px;
  font-size: 17px; color: var(--text_link); margin-right: 26px; transition: color .3s ease;
}
.bl_post_share a:last-child { margin-right: 0; }
.bl_post_share a:hover { color: var(--text_hover); }
.bl_post_share a:before { margin: 0; width: auto; }

.bl_post_nav { display: flex; justify-content: space-between; gap: 30px; margin-top: 31px;
  padding: 34px 0; border-top: 1px solid var(--bd_color); border-bottom: 1px solid var(--bd_color); }
.bl_post_nav > div { width: 50%; }
.bl_post_nav .bl_nav_next { text-align: right; }
.bl_nav_label {
  display: block;
  font-family: Outfit, sans-serif; font-size: 12px; line-height: 18px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase; color: var(--text_light);
}
.bl_nav_title {
  font-family: Outfit, sans-serif; font-size: 19px; line-height: 27.56px; font-weight: 500;
  letter-spacing: -.6px; color: var(--text_dark); margin: 8px 0 0;
}
.bl_post_nav a:hover .bl_nav_title { color: var(--text_link); }
.bl_nav_date { display: block; font-size: 14px; line-height: 21px; color: #898A8E; margin-top: 6px; }

.bl_author {
  display: flex; align-items: flex-start; margin-top: 50px;
  background-color: #FFFFFF; padding: 40px;
}
.bl_author_avatar {
  flex: 0 0 78px; width: 78px; height: 78px; border-radius: 50%; overflow: hidden;
  background-color: #FFFFFF; border: .8px solid var(--bd_color); box-sizing: border-box;
}
.bl_author_avatar img {
  width: 100%; height: 100%; object-fit: contain; display: block;
  padding: 9px; box-sizing: border-box;
}
.bl_author_body { padding-left: 20px; }
.bl_author_name {
  font-family: Outfit, sans-serif; font-size: 19px; line-height: 25px; font-weight: 500;
  color: var(--text_dark); margin: 0;
}
.bl_author_label {
  font-family: Outfit, sans-serif; font-size: 12px; line-height: 18px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase; color: var(--text_light); margin-top: 10px;
}
.bl_author_bio { margin-top: 15px; font-size: 17px; line-height: 28.05px; color: var(--text); }
.bl_author_bio p { margin: 0; }

/* ---------------- comments ---------------- */
.bl_comments { margin-top: 86px; }
.bl_section_title {
  font-family: Outfit, sans-serif; font-size: 35px; line-height: 38px; font-weight: 500;
  letter-spacing: -1px; color: var(--text_dark); margin: 0 0 17.5px;
}
.bl_form { display: flex; flex-wrap: wrap; gap: 0 26px; }
.bl_field { width: calc(50% - 13px); margin-top: 12px; }
.bl_field_full { width: 100%; }
.bl_field label {
  display: block;
  font-family: Outfit, sans-serif; font-size: 12px; line-height: 18px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase; color: var(--text_light); margin-bottom: 4px;
}
.bl_field input[type="text"],
.bl_field input[type="email"],
.bl_field textarea {
  box-sizing: border-box; width: 100%;
  padding: 9.6px 0; border: none; border-bottom: 1px solid var(--bd_color);
  background-color: transparent; border-radius: 0;
  font-family: "DM Sans", sans-serif; font-size: 16px; line-height: 24px; color: var(--text);
  outline: none; transition: border-color .3s ease;
}
.bl_field textarea { resize: vertical; min-height: 75px; }
.bl_field input:focus, .bl_field textarea:focus { border-bottom-color: var(--text_link); }
.bl_consent { width: 100%; margin-top: 22px; display: flex; align-items: flex-start;
  font-size: 15px; line-height: 24px; color: var(--text); }
.bl_consent input { margin: 5px 10px 0 0; accent-color: var(--text_link); }
.bl_form_submit { width: 100%; margin-top: 34px; }

/* ---------------- related ---------------- */
.bl_related { margin-top: 85px; }
.bl_related_grid { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.bl_related_col { width: 50%; padding: 0 15px; box-sizing: border-box; }
.bl_related_thumb { position: relative; overflow: hidden; }
.bl_related_thumb img {
  width: 100%; aspect-ratio: 890 / 664; object-fit: cover; display: block;
  transition: transform .6s ease;
}
.bl_related_col:hover .bl_related_thumb img { transform: scale(1.05); }
.bl_related_cat {
  font-family: Outfit, sans-serif; font-size: 12px; line-height: 18px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase; margin-top: 24px;
}
.bl_related_cat a { color: var(--text_dark); }
.bl_related_title {
  font-family: Outfit, sans-serif; font-size: 19px; line-height: 27.56px; font-weight: 500;
  letter-spacing: -.6px; margin: 10px 0 0;
}
.bl_related_title a { color: var(--text_dark); }
.bl_related_title a:hover { color: var(--text_link); }

/* =================================================================
   Responsive
   ================================================================= */
@media (max-width: 1279px) {
  .bl_wrap { padding: 90px 0; }
  .bl_title { font-size: 30px; line-height: 34px; letter-spacing: -.8px; }
  .bl_side_inner { padding: 40px 0; top: 30px; }
  .bl_widget { padding: 0 30px; }

  .bl_hero { min-height: 510px; }
  .bl_hero_title { font-size: 46px; line-height: 48px; letter-spacing: -1.3px; }
  .bl_single_wrap { padding: 85px 0 90px; }
  .bl_single { width: 618px; }
  .bl_article { width: 556px; }
  .bl_gallery_wide { width: 949px; margin-left: calc((556px - 949px) / 2); }
  .bl_related { margin-top: 60px; }
  .bl_comments { margin-top: 64px; }
}

@media (max-width: 1023px) {
  .bl_wrap { padding: 80px 0; }
  .bl_main, .bl_side { width: 100%; }
  .bl_side { margin-top: 60px; }
  .bl_side_inner { padding: 35px 15px; position: static; top: auto; }
  .bl_widget { padding: 0 15px; }
  .bl_title { font-size: 27px; line-height: 31px; }

  .bl_hero { min-height: 476px; }
  .bl_hero_title { font-size: 38px; line-height: 42px; letter-spacing: -1px; }
  .bl_single_wrap { padding: 70px 0 80px; }
  .bl_single { width: 100%; }
  .bl_article { width: 624px; }
  .bl_gallery_wide { width: 693px; margin-left: calc((624px - 693px) / 2); }
}

@media (max-width: 767px) {
  .bl_wrap { padding: 60px 0; }
  .bl_item + .bl_item { margin-top: 34px; }
  .bl_title { font-size: 24px; line-height: 28px; }
  .bl_side { margin-top: 40px; }
  .bl_side_inner { padding: 30px; }
  .bl_widget { padding: 0; }
  .bl_pagination a, .bl_pagination span { width: 44px; height: 44px; line-height: 41px; font-size: 15px; }

  .bl_hero { min-height: 400px; }
  .bl_hero_inner { padding: 0 15px; }
  .bl_hero_title { font-size: 30px; line-height: 34px; letter-spacing: -.8px; }
  .bl_single_wrap { padding: 50px 0 60px; }
  .bl_article { width: 100%; }
  .bl_gallery_wide { width: 100%; margin-left: 0; flex-wrap: wrap; }
  .bl_gallery_wide figure { flex: 0 0 100%; }
  .bl_field { width: 100%; }
  .bl_related_col { width: 100%; }
  .bl_related_col + .bl_related_col { margin-top: 34px; }
  .bl_author { flex-direction: column; padding: 30px; }
  .bl_author_body { padding: 20px 0 0; }
  .bl_post_nav { flex-direction: column; gap: 24px; }
  .bl_post_nav > div { width: 100%; }
  .bl_post_nav .bl_nav_next { text-align: left; }
}

@media (max-width: 479px) {
  .bl_dropcap:first-letter { font-size: 58px; line-height: 50px; margin: 4px 12px 0 0; }
  .bl_quote { font-size: 20px; line-height: 29px; padding-left: 24px; }
  .bl_section_title { font-size: 26px; line-height: 30px; }
}