/* Emerson Lopze — small layer on top of the site design system.
   Restores the nav/search behaviour that originally ran on third-party
   interactions, and styles article prose. No tracking. */

/* ---- brand mark in nav (text, replaces the SVG logo) ---- */
body { overflow-x: clip; }
.brandmark {
  font-family: inherit;
  font-weight: 600;
  font-size: 1.375rem;
  line-height: 1;
  letter-spacing: -.01em;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .brandmark { font-size: 1.125rem; }
}

/* ---- nav: white bar by default, transparent over the home hero ---- */
.nav_component {
  background-color: var(--_colours---base--white, #fff);
  border-bottom: 1px solid color-mix(in srgb, var(--_colours---base--black, #1b1a1a) 12%, transparent);
  transition: background-color .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.nav_component.is-scrolled { box-shadow: 0 6px 24px rgba(0, 0, 0, .08); }
.nav_component.nav--overlay:not(.is-scrolled) {
  background-color: transparent;
  border-bottom-color: transparent;
  box-shadow: none;
}
.nav_logo_wrap.is-brand { color: var(--_colours---base--black, #1b1a1a); }
.nav_component.nav--overlay:not(.is-scrolled) .nav_logo_wrap.is-brand {
  color: var(--_colours---base--brand, #ffee54);
  text-shadow: 0 2px 24px rgba(0, 0, 0, .45);
}

/* ---- category links in nav ---- */
.nav_categories {
  display: flex;
  align-items: center;
  gap: 1.75rem;
  margin-right: auto;
}
.nav_category_link {
  font-family: var(--_typography---font--secondary-family, inherit);
  font-size: .8125rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: inherit;
  opacity: .6;
  white-space: nowrap;
  text-decoration: none;
  transition: opacity .2s ease;
}
.nav_category_link:hover { opacity: 1; }
.nav_category_link[aria-current="page"] {
  opacity: 1;
  font-weight: 600;
  box-shadow: inset 0 -2px 0 currentColor;
}
@media screen and (min-width: 1100px) {
  .nav_container.u-vflex-stretch-between {
    flex-flow: row;
    align-items: center;
    gap: 2rem;
  }
  .nav_logo_contain {
    position: static;
    inset: auto;
    width: auto;
    height: auto;
    transform: none;
  }
  .nav_component.nav--overlay:not(.is-scrolled) .nav_logo_contain {
    position: absolute;
    top: 50%;
    left: 50%;
    right: auto;
    bottom: auto;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
  }
  .nav_layout { flex: 1; align-items: center; }
  .nav_main_wrap { display: none; }
  .nav_component.nav--overlay:not(.is-scrolled) .nav_main_wrap { display: block; }
  .nav_categories {
    margin-left: 0;
    opacity: 1;
    transform: none;
    transition: opacity .3s ease, transform .3s ease;
  }
  .nav_component.nav--overlay:not(.is-scrolled) .nav_categories {
    opacity: 0;
    transform: translateY(-4px);
    pointer-events: none;
  }
  .nav_logo_wrap.is-brand .brandmark { font-size: 1.5rem; }
  .nav_component.nav--overlay:not(.is-scrolled) .nav_logo_wrap.is-brand .brandmark {
    font-size: 2rem;
  }
}
@media screen and (max-width: 1099px) {
  .nav_categories { display: none; }
  .nav_container.u-vflex-stretch-between {
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
  }
  .nav_logo_contain {
    position: static;
    inset: auto;
    width: auto;
    height: auto;
  }
}
@media screen and (min-width: 1100px) and (max-width: 1279px) {
  .nav_container.u-vflex-stretch-between { gap: 1.25rem; }
  .nav_categories { gap: 1rem; }
  .nav_category_link { font-size: .75rem; letter-spacing: .04em; }
}

/* ---- current page in nav ---- */
.nav_dropdown_text_wrap[aria-current="page"] .nav_dropdown_label {
  opacity: 1;
  font-weight: var(--_typography---font--primary-semibold, 600);
}

/* ---- nav mega-menu open state ---- */
.nav_main_wrap.is-active .nav_menu_wrap { pointer-events: auto; }
.nav_main_wrap.is-active .nav_menu_contain {
  opacity: 1;
  pointer-events: auto;
}

/* ---- search overlay ---- */
.nav_search_wrap { transition: opacity .25s; }
.nav_search_wrap.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.nav_search_wrap.is-open .nav_search_component { pointer-events: auto; }
.nav_search_wrap.is-open .nav_search_results_wrap { visibility: visible; opacity: 1; height: auto; overflow: visible; }
.nav_search_results_contain ul { list-style: none; margin: 0; padding: .5rem 0; }
.nav_search_results_contain li a { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem .25rem; color: inherit; }
.nav_search_results_contain li a small { opacity: .6; }

/* ---- page top padding for non-home pages (nav is fixed) ---- */
.page-pad { padding-top: calc(var(--nav--height, 3.125rem) + 3.5rem); }

/* ---- hero stacking (original relied on JS-driven positioning) ---- */
.header_main_wrap { position: relative; overflow: hidden; }
.header_main_title_list { position: relative; z-index: 3; }
.header_main_visual_list { z-index: 0; }
.header_main_title { color: var(--_colours---base--white); text-shadow: 0 1px 24px rgba(0,0,0,.35); }
.header_main_title_paragraph { color: var(--_colours---base--white); }

/* ---- shared bits ---- */
.crumbs { font-size: .875rem; margin-bottom: 1rem; }
.crumbs a { text-decoration: underline; }
.toc { margin: 0 0 2rem; padding: 1.25rem 1.5rem; border: 1px solid var(--_colours---base--black); border-radius: var(--radius--small, 6px); }
.toc ol { margin: .75rem 0 0 1.1rem; }
.toc li { margin: 0 0 .35rem; }
.latest_wrap { padding: 3rem 0; }

/* ---- article body ---- */
.prose { max-width: 46rem; margin: 0 auto; font-size: 1.125rem; line-height: 1.75; }
.prose h2 { font-size: 1.75rem; line-height: 1.2; margin: 2.75rem 0 1rem; }
.prose h3 { font-size: 1.35rem; margin: 2rem 0 .75rem; }
.prose p { margin: 0 0 1.35rem; }
.prose ul, .prose ol { margin: 0 0 1.35rem 1.25rem; padding: 0; }
.prose li { margin: 0 0 .5rem; }
.prose a { text-decoration: underline; text-underline-offset: 2px; }
.prose figure { margin: 2.25rem 0; }
.prose figure img { width: 100%; height: auto; border-radius: var(--radius--small, 6px); display: block; }
.prose figcaption { font-size: .875rem; color: #5a5a5a; margin-top: .625rem; }
.prose blockquote {
  margin: 2rem 0;
  padding: 1.25rem 1.5rem;
  border-left: 3px solid var(--_colours---base--brand);
  background: var(--_colours---base--cream);
  font-size: 1.375rem;
  line-height: 1.4;
}
.prose blockquote cite { display: block; margin-top: .75rem; font-size: .875rem; font-style: normal; color: #5a5a5a; }
.prose .keyfacts { margin: 2rem 0; padding: 1.5rem; border: 1px solid var(--_colours---base--black); border-radius: var(--radius--small, 6px); }
.prose .keyfacts h2 { margin-top: 0; }
.prose .keyfacts dt { font-weight: 600; }
.prose .keyfacts dd { margin: 0 0 .75rem; }

/* article header bits */
.article-header { padding-top: calc(var(--nav--height, 3.125rem) + 4rem); }
.article-tag { width: fit-content; margin-bottom: .9rem; }
.article-title { max-width: 42ch; margin: 0 0 1.1rem; }
.article-meta { color: #5a5a5a; font-size: .9375rem; display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }

/* page headers (article/category/legal/sitemap).
   sections.min.css trims heading boxes with negative-margin ::before/::after
   for Webflow's gap-based layouts; our headers use normal flow, so the trim
   makes the h1 box shorter than its glyphs and the next line overlaps.
   Turn the trim off inside .page-head and set explicit spacing instead. */
.page-head :is([class*="u-text-style-"])::before,
.page-head :is([class*="u-text-style-"])::after { content: none; }
.page-head .crumbs { font-size: .875rem; color: #5a5a5a; margin-bottom: 1.1rem; }
.page-head .crumbs a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.page-head h1 { margin: 0 0 .75rem; }
.page-head .u-text-style-h5 { margin: 0 0 2.5rem; }

/* ---- back to top ---- */
.backtop {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 90;
  width: 2.75rem; height: 2.75rem; border: 1px solid var(--_colours---base--black);
  border-radius: 999px; background: var(--_colours---base--white); color: var(--_colours---base--black);
  cursor: pointer; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; font-size: 1.25rem;
  display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1;
}
.backtop.is-visible { opacity: 1; visibility: visible; }

/* ---- image fit (site.min.css omits object-fit on these classes) ---- */
.g_visual_img,
.header_main_visual_img,
.header_main_thumbs_img,
.latest_item_visual,
.g_card_visual,
.g_article_visual { object-fit: cover; }

/* ---- homepage hero carousel ---- */
.header_main_visual_wrap { width: 100%; height: 100%; }
.header_main_thumbs_button { position: relative; cursor: pointer; }

/* ---- newsletter form (dark panel) ---- */
.newsletter_component .nl_form { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.newsletter_component .nl_input { flex: 1 1 14rem; min-width: 0; padding: .8rem 1rem; border: 1px solid rgba(255,255,255,.3); border-radius: var(--radius--small, 6px); background: rgba(255,255,255,.08); color: #fff; }
.newsletter_component .nl_input::placeholder { color: rgba(255,255,255,.55); }
.newsletter_component .nl_button { padding: .8rem 1.5rem; border: 0; border-radius: var(--radius--small, 6px); background: var(--_colours---base--brand, #f3550e); color: #fff; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; cursor: pointer; }
.newsletter_component .nl_msg { margin-top: .6rem; color: #dcecdb; font-size: .9375rem; }
.newsletter_component .nl_msg.is-error { color: #ffb4a2; }

/* ---- footer tidy ---- */
.footer_nav_layout.u-grid-custom { grid-template-columns: var(--grid-6); }
@media screen and (max-width: 991px) {
  .footer_nav_layout.u-grid-custom { grid-template-columns: var(--grid-3); }
}
@media screen and (max-width: 767px) {
  .footer_nav_layout.u-grid-custom { grid-template-columns: var(--grid-2); }
}
.footer_nav_text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.4;
}
.footer_nav_column li:first-child .footer_nav_text { font-weight: 600; }
@media screen and (min-width: 768px) {
  .footer_legal_list.u-hflex-left-center { justify-content: flex-end; }
}
@media screen and (max-width: 767px) {
  .footer_legal_list.u-hflex-left-center {
    max-width: 17rem;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
  }
}