/* Paula's September component review, adapted to the production markup.
   Loaded with the v7 skin. Article content and section anchors stay unchanged. */

/* Side title and copy share a row on desktop, including legacy column variants. */
.b-content-title-text:is(.u-bg-primary-dark-blue, .u-bg-secondary-dark-blue)
  :is(.b-content-title-text__description, .c-wysiwyg, .c-wysiwyg p) {
  color: var(--ou-on-navy-body, rgba(255, 255, 255, .85)) !important;
  opacity: 1 !important;
}
.b-content-title-text > .container > .flex:has(> .b-content-title-text__title-col):has(> .b-content-title-text__description-col) {
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
.b-content-title-text :is(.b-content-title-text__title-col, .b-content-title-text__description-col) {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin: 0 !important;
}
.b-content-title-text .b-content-title-text__title-col {
  margin-bottom: 24px !important;
}
@media (min-width: 1024px) {
  .b-content-title-text > .container > .flex:has(> .b-content-title-text__title-col):has(> .b-content-title-text__description-col) {
    flex-direction: row !important;
  }
  .b-content-title-text .b-content-title-text__title-col {
    flex-basis: 38% !important;
    max-width: 38% !important;
    margin-bottom: 0 !important;
  }
  .b-content-title-text .b-content-title-text__description-col {
    flex-basis: 56% !important;
    max-width: 56% !important;
    margin-left: 4% !important;
  }
}

/* Archive illustrations sit beside the heading. Retain the mobile image rules. */
@media (min-width: 1024px) {
  .o-main-hero--column > .s-hero-banner__wrapper > .container > .flex:has(> .left-column):has(> .right-column),
  .o-main-hero--column > .container > .flex:has(> .left-column):has(> .right-column) {
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  .o-main-hero--column .left-column {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    min-width: 0;
  }
  .o-main-hero--column .right-column {
    flex: 0 0 41.666% !important;
    width: 41.666% !important;
    max-width: 41.666% !important;
    min-width: 0;
  }
  .o-main-hero--column .o-main-hero__img-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .o-main-hero--column .o-main-hero__img img {
    max-width: 100%;
    height: auto;
  }
}
.o-main-hero__search :is(.c-search-filter, .c-search-filter__header) {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.o-main-hero__search .c-search-filter__input {
  background: #fff !important;
  border: 1px solid rgba(21, 35, 97, .14) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  padding-right: 60px !important;
}
.o-main-hero__search .c-search-filter__input:focus {
  border-color: #152361 !important;
}
.o-main-hero__search .c-search-filter__input:focus-visible {
  outline: 2px solid #152361;
  outline-offset: 3px;
}
.o-main-hero__search .c-search-filter__header .c-btn-round {
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Keep navigation readable on the dark Space hero, without changing light variants. */
.s-single-space:is(.u-bg-tertiary-dark-blue, .u-bg-primary-dark-blue, .u-bg-secondary-dark-blue) :is(.s-single-space__back-btn, .c-breadcrumbs, .c-breadcrumbs a, .c-breadcrumbs span) {
  color: #fff !important;
}
.s-single-space:is(.u-bg-tertiary-dark-blue, .u-bg-primary-dark-blue, .u-bg-secondary-dark-blue) .s-single-space__back-btn span {
  background: #fff !important;
}
.s-single-space:is(.u-bg-tertiary-dark-blue, .u-bg-primary-dark-blue, .u-bg-secondary-dark-blue) .s-single-space__back-btn span::after {
  border-color: #152361 !important;
}
.s-single-space:is(.u-bg-tertiary-dark-blue, .u-bg-primary-dark-blue, .u-bg-secondary-dark-blue) :is(.s-single-space__back-btn, .c-breadcrumbs a):is(:hover, :focus-visible) {
  color: #48b4ff !important;
}
.s-single-space:is(.u-bg-tertiary-dark-blue, .u-bg-primary-dark-blue, .u-bg-secondary-dark-blue) .s-single-space__back-btn:hover span {
  background: #48b4ff !important;
}

/* One glass surface for each TOC. ArticlePage already includes only H2 headings;
   legacy nested lists are hidden without removing their destination headings. */
.simpletoc,
.b-post-content__sidebar-section-toc,
.b-post-content__sticky-toc {
  background: linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .84)) !important;
  border: 1px solid rgba(21, 35, 97, .08) !important;
  border-radius: 20px !important;
  box-shadow: 0 1px 2px rgba(21, 35, 97, .04), 0 8px 20px -14px rgba(21, 35, 97, .2) !important;
  min-width: 0;
}
.simpletoc,
.b-post-content__sidebar-section-toc {
  padding: 22px 26px !important;
  margin: 0 0 36px !important;
}
/* Standalone podcast TOCs follow the same centred measure as the body copy. */
.entry-content.is-layout-constrained > .simpletoc {
  max-width: min(100%, var(--wp--style--global--content-size, 770px));
  margin-inline: auto !important;
}
.b-post-content__sidebar-section-toc .simpletoc,
.b-post-content__sticky-toc .simpletoc {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.simpletoc-title,
.b-post-content__sidebar-section-toc .b-post-content__sidebar-section-title,
.b-post-content__sticky-toc-title {
  color: #00a885 !important;
  font: 600 13px/1.4 Montserrat, sans-serif !important;
  letter-spacing: 0 !important;
  margin: 0 0 14px !important;
}
.b-post-content__sticky-toc-title {
  margin-bottom: 0 !important;
}
/* Preserve native details/summary disclosure and its keyboard focus indicator. */
.simpletoc > summary {
  cursor: pointer;
}
.simpletoc > summary:focus-visible {
  outline: 2px solid #152361;
  outline-offset: 4px;
}
.simpletoc .simpletoc-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  counter-reset: review-toc;
  display: grid;
  gap: 12px;
}
.simpletoc .simpletoc-list > li {
  counter-increment: review-toc;
  display: flex;
  align-items: baseline;
  gap: 12px;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0;
}
/* The list is unnumbered by request; the counter stays reset so nothing else
   inherits it. */
.simpletoc .simpletoc-list > li::before { content: none; display: none; }
.simpletoc .simpletoc-list > li > a {
  color: #152361 !important;
  font: 400 16px/1.5 Montserrat, sans-serif !important;
  text-decoration: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0;
  overflow-wrap: anywhere;
}
.simpletoc .simpletoc-list > li > a:is(:hover, :focus-visible) {
  color: #48b4ff !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
.simpletoc .simpletoc-list > li > a.active {
  font-weight: 700 !important;
}
.simpletoc .simpletoc-list ol,
.simpletoc .simpletoc-list ul {
  display: none !important;
}

/* Preserve the existing editorial CTA copy and links in a flat tint panel. */
.b-section-text__box.b-section-text__box--panel {
  background: #f7faf9 !important;
  background-image: none !important;
  border: 1px solid rgba(21, 35, 97, .08) !important;
  border-radius: 20px !important;
  padding: 28px 32px !important;
  margin: 40px 0 8px !important;
  box-shadow: none !important;
  color: #152361 !important;
}
.b-section-text__box--panel .s-wave__icon,
.b-section-text__box--panel::before,
.b-section-text__box--panel::after {
  display: none !important;
}
.b-section-text__box--panel .c-wysiwyg p {
  color: #152361 !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
  margin: 0 0 8px !important;
}
.b-section-text__box--panel .c-wysiwyg p:last-child {
  margin-bottom: 0 !important;
}
.b-section-text__box--panel .c-wysiwyg a {
  color: #48b4ff !important;
  font-weight: 700;
  text-decoration: none;
}
.b-section-text__box--panel .c-wysiwyg a:is(:hover, :focus-visible) {
  color: #152361 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width: 575px) {
  .simpletoc,
  .b-post-content__sidebar-section-toc {
    padding: 20px !important;
  }
  .b-post-content__sidebar-section-toc .simpletoc,
  .b-post-content__sticky-toc .simpletoc {
    padding: 0 !important;
  }
  .b-section-text__box.b-section-text__box--panel {
    padding: 24px 20px !important;
  }
}

/* The FAQ block is the last child of .entry-content, so the article's h3
   rhythm leaked into the accordion questions: a 1.6em top margin pushed each
   question away from the top of its own frame and off centre. */
.entry-content .b-faq .c-accordion__btn-label { margin-top: 0; }