/* 2026-10-31 draft: shared SWELL-native section heading.
   Only heading placement; body/card/form layout stays in its normal flow.
   Concerts (/concerts/) is the reference, and is NOT overridden here. */
#body_wrap:is(.page-id-16,.page-id-22,.blog) #main_content {
  width:100%!important;
  max-width:760px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  float:none!important;
}
#body_wrap:is(.page-id-16,.page-id-22,.blog) #main_content > .l-mainContent__inner > .oy-native-title-synced.c-pageTitle {
  display:block!important;
}
#body_wrap:is(.page-id-16,.page-id-22,.blog) #main_content > .l-mainContent__inner > .oy-native-title-synced .c-pageTitle__inner {
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
}
#body_wrap:is(.page-id-16,.page-id-22,.blog) #main_content > .l-mainContent__inner > .oy-native-title-synced .c-pageTitle__inner::after {
  display:block;
  margin-top:7px;
  color:rgba(0,0,0,.42);
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.14em;
  line-height:1;
}
#body_wrap.page-id-16 .oy-native-title-synced .c-pageTitle__inner::after {content:"ABOUT"}
#body_wrap.page-id-22 .oy-native-title-synced .c-pageTitle__inner::after {content:"CONTACT"}
#body_wrap.blog .oy-native-title-synced .c-pageTitle__inner::after {content:"BLOG"}

/* Artists index: mirror the existing Concerts native SWELL H1 exactly. */
#body_wrap.page-id-10460 .c-pageTitle {margin-bottom:2.2rem}
#body_wrap.page-id-10460 .c-pageTitle__inner {
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
}
#body_wrap.page-id-10460 .c-pageTitle__inner::after {
  content:"ARTISTS";
  margin-top:7px;
  color:rgba(0,0,0,.42);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.14em;
  line-height:1;
}
/* The blog uses a JS-inserted native heading. On desktop the post tabs
   start directly beneath its border unless the H1 itself owns bottom spacing. */
#body_wrap.blog #main_content > .l-mainContent__inner > .oy-native-title-synced.c-pageTitle {
  margin-bottom: 54px !important;
}
#body_wrap.blog .p-homeContent {margin-top:0!important;padding-top:0!important}

/* Mobile comparison against /concerts/, /profile/, /contact/, /artists/:
   the blog title was 5 CSS px too far right and 11 CSS px too high. */
@media (max-width: 599px) {
  /* Shift only the heading to the same x=34–649 screenshot span;
     leave article cards at their original edge. */
  #body_wrap.blog #main_content > .l-mainContent__inner {
    padding-top: 11px !important;
  }
  #body_wrap.blog #main_content > .l-mainContent__inner > .oy-native-title-synced.c-pageTitle {
    width: calc(100% + 10px) !important;
    margin-left: -5px !important;
    margin-right: -5px !important;
    margin-bottom: 2.2rem !important;
  }
  #body_wrap.blog .p-postListTab {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    padding-top: 0 !important;
  }
  #body_wrap.blog .p-postListTab .c-tabList {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #body_wrap.blog .p-postListTab .c-tabList__item {
    display: block !important;
    flex: 1 1 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  #body_wrap.blog .p-postListTab .c-tabList__button {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 9px 8px !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
  }
}