/* ==========================================================================
   Union West Real Estate — blog editorial layer
   Scope: blog index,
category/date/author archives,
single posts. Nothing else
   on the site is touched.

   Cascade note: Betheme prints its dynamic theme CSS as inline <style> blocks
   in wp_head,
AFTER every enqueued sheet. Position therefore cannot be won.
   Every rule below is prefixed with a body class so it wins on specificity
   instead. !important appears only where Betheme itself used it.
   ========================================================================== */

:root {
  --uw-display:  "Playfair Display", Georgia, "Times New Roman", serif;
  --uw-sans:     "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 Helvetica, Arial, sans-serif;

  --uw-ink:      #17191c;
  --uw-ink-body: #2c3136;
  --uw-ink-soft: #6b7278;
  --uw-ink-mute: #9aa0a6;

  --uw-paper:    #ffffff;
  --uw-paper-2:  #faf8f5;
  --uw-rule:     #e7e3dc;
  --uw-rule-2:   #f1eee9;

  --uw-accent:   #9a7b4f;
  --uw-accent-d: #7d6340;

  --uw-measure:  43rem;
}
/* --------------------------------------------------------------------------
   1. Shared page furniture
   -------------------------------------------------------------------------- */

body.blog #Content,
body.archive #Content,
body.single-post #Content {
  background: var(--uw-paper);
}
/* Subheader: the stock treatment sets 52px uppercase italic Playfair directly
   over a photo,
which long article titles cannot survive. Sentence case,
a
   legibility scrim,
and a sane cap. */

body.blog #Subheader,
body.archive #Subheader,
body.single-post #Subheader {
  position: relative;
  padding: 112px 0 !important;
  background-position: center 38%;
}
body.blog #Subheader::after,
body.archive #Subheader::after,
body.single-post #Subheader::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(12,13,15,.34) 0%, rgba(12,13,15,.52) 100%);
  pointer-events: none;
}
body.blog #Subheader .container,
body.archive #Subheader .container,
body.single-post #Subheader .container {
  position: relative;
  z-index: 2;
}
body.blog #Subheader .title,
body.archive #Subheader .title,
body.single-post #Subheader .title {
  font-family: var(--uw-display);
  font-style: normal;
  font-weight: 400;
  text-transform: none;
  letter-spacing: -0.005em;
  max-width: 22ch;
  margin: 0 auto;
  text-shadow: 0 1px 24px rgba(0,0,0,.28);
}
body.blog #Subheader .title,
body.archive #Subheader .title {
  font-size: 46px;
  line-height: 1.1;
  letter-spacing: .14em;
  text-transform: uppercase;
  max-width: none;
}
body.single-post #Subheader .title {
  font-size: 38px;
  line-height: 1.22;
  max-width: 24ch;
}
/* Breadcrumb / subtitle row under the title */

body.blog #Subheader .subtitle,
body.archive #Subheader .subtitle,
body.single-post #Subheader .subtitle {
  font-family: var(--uw-sans);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .82;
  margin-top: 14px;
}
/* The stock "Do you like it?" heart counter reads as a 2014 blog widget. */

body.blog .button-love,
body.archive .button-love,
body.single-post .button-love {
  display: none !important;
}
/* --------------------------------------------------------------------------
   2. Blog index + archives — editorial card grid
   -------------------------------------------------------------------------- */

body.blog .posts_group,
body.archive .posts_group {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 64px 44px;
  height: auto !important;
}
body.blog .posts_group .post-item,
body.archive .posts_group .post-item {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none;
  display: flex;
  flex-direction: column;
}
/* Image: kill the 8px black frame,
hold a consistent 1.91:1 crop so a mixed
   library of stock photos and pipeline art still lines up. */

body.blog .post-item .image_frame,
body.archive .post-item .image_frame {
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 0 22px;
  background: var(--uw-paper-2);
  /* Betheme sizes the frame to the thumbnail's intrinsic width; in a column
     flex item that leaves a 161px stamp instead of a card image. */

  display: block;
  width: 100% !important;
  max-width: none !important;
  align-self: stretch;
}
body.blog .post-item .image_frame .image_wrapper,
body.archive .post-item .image_frame .image_wrapper {
  border: 0 !important;
  border-radius: 3px;
  overflow: hidden;
  display: block;
  width: 100% !important;
  max-width: none !important;
}
body.blog .post-item .image_frame a,
body.archive .post-item .image_frame a {
  display: block;
  width: 100%;
}
body.blog .post-item .image_frame img,
body.archive .post-item .image_frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.91 / 1;
  object-fit: cover;
  border-radius: 0;
  transition: transform .7s cubic-bezier(.2,.6,.2,1);
}
body.blog .post-item:hover .image_frame img,
body.archive .post-item:hover .image_frame img {
  transform: scale(1.035);
}
/* The zoom / chain-link hover icons and the dark mask are theme-demo furniture */

body.blog .post-item .image_frame .image_links,
body.archive .post-item .image_frame .image_links,
body.blog .post-item .image_frame .mask,
body.archive .post-item .image_frame .mask {
  display: none !important;
}
/* Post without a featured image: a quiet typographic plate instead of a hole */

body.blog .post-item.no-img .image_frame,
body.archive .post-item.no-img .image_frame {
  aspect-ratio: 1.91 / 1;
  background: var(--uw-paper-2);
  border-bottom: 1px solid var(--uw-rule) !important;
}
body.blog .post-item .post-desc-wrapper,
body.archive .post-item .post-desc-wrapper {
  display: flex;
  flex: 1 1 auto;
}
body.blog .post-item .post-desc,
body.archive .post-item .post-desc {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 0;
}
/* Meta line: category + date,
small caps,
brass category */

body.blog .post-item .post-head,
body.archive .post-item .post-head {
  margin: 0 0 12px;
}
body.blog .post-item .post-meta,
body.archive .post-item .post-meta {
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--uw-ink-mute);
  border: 0;
  padding: 0;
  margin: 0;
  /* Inline flow, not flex: a post in two categories was wrapping the "/"
     separator onto a line of its own. */

  display: block;
  line-height: 1.7;
}
body.blog .post-item .post-meta .author-date,
body.archive .post-item .post-meta .author-date {
  display: inline;
  float: none;
  margin: 0;
  padding: 0;
}
body.blog .post-item .post-meta .category::before,
body.archive .post-item .post-meta .category::before {
  content: "\00B7";
  margin: 0 8px;
  color: var(--uw-ink-mute);
}
body.blog .post-item .post-meta .post-categories li,
body.archive .post-item .post-meta .post-categories li,
body.blog .post-item .post-meta .post-categories li a,
body.archive .post-item .post-meta .post-categories li a {
  white-space: nowrap;
}
body.blog .post-item .post-meta i,
body.archive .post-item .post-meta i,
body.blog .post-item .post-meta .label,
body.archive .post-item .post-meta .label {
  display: none !important;
}
body.blog .post-item .post-meta .category,
body.archive .post-item .post-meta .category {
  float: none;
  margin: 0;
  padding: 0;
  position: static;
}
/* Betheme renders the categories as a hover dropdown behind a "Categories"
   toggle. On a card the toggle says nothing; show the terms themselves. */

body.blog .post-item .post-meta .cat-btn,
body.archive .post-item .post-meta .cat-btn,
body.single-post .post-header .post-meta .cat-btn {
  display: none !important;
}
body.blog .post-item .post-meta .cat-wrapper,
body.archive .post-item .post-meta .cat-wrapper,
body.single-post .post-header .post-meta .cat-wrapper {
  display: inline !important;
  position: static !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  min-width: 0 !important;
}
body.blog .post-item .post-meta .post-categories,
body.archive .post-item .post-meta .post-categories {
  display: inline;
  list-style: none;
  margin: 0;
  padding: 0;
}
body.blog .post-item .post-meta .post-categories li,
body.archive .post-item .post-meta .post-categories li {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.blog .post-item .post-meta .post-categories li::before,
body.archive .post-item .post-meta .post-categories li::before {
  content: none;
}
body.blog .post-item .post-meta .post-categories li + li::before,
body.archive .post-item .post-meta .post-categories li + li::before {
  content: " / ";
  color: var(--uw-ink-mute);
}
body.blog .post-item .post-meta a,
body.archive .post-item .post-meta a {
  color: var(--uw-accent);
  text-decoration: none;
  border: 0;
}
body.blog .post-item .post-meta a:hover,
body.archive .post-item .post-meta a:hover {
  color: var(--uw-accent-d);
}
body.blog .post-item .post-meta .date,
body.archive .post-item .post-meta .date {
  color: var(--uw-ink-mute);
}
/* Title */

body.blog .post-item .post-title,
body.archive .post-item .post-title {
  margin: 0 0 12px;
}
body.blog .post-item .post-title h2,
body.archive .post-item .post-title h2 {
  font-family: var(--uw-display);
  font-size: 25px;
  line-height: 1.26;
  font-weight: 500;
  letter-spacing: -0.006em;
  margin: 0;
  color: var(--uw-ink);
}
body.blog .post-item .post-title h2 a,
body.archive .post-item .post-title h2 a {
  color: inherit;
  text-decoration: none;
  background-image: linear-gradient(var(--uw-accent), var(--uw-accent));
  background-size: 0% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .45s cubic-bezier(.2,.6,.2,1), color .25s ease;
  padding-bottom: 2px;
}
body.blog .post-item .post-title h2 a:hover,
body.archive .post-item .post-title h2 a:hover {
  color: var(--uw-accent-d);
  background-size: 100% 1px;
}
/* Excerpt — clamped so the grid rows stay level */

body.blog .post-item .post-excerpt,
body.archive .post-item .post-excerpt {
  font-family: var(--uw-sans);
  font-size: 15px;
  line-height: 1.68;
  color: var(--uw-ink-soft);
  margin: 0 0 20px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Footer: drop the grey slab,
keep a single quiet text link */

body.blog .post-item .post-footer,
body.archive .post-item .post-footer {
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--uw-rule-2) !important;
  padding: 16px 0 0 !important;
  margin: auto 0 0;
  display: flex;
  align-items: center;
}
body.blog .post-item .post-footer .post-links i,
body.archive .post-item .post-footer .post-links i {
  display: none !important;
}
body.blog .post-item .post-footer .post-links,
body.archive .post-item .post-footer .post-links {
  float: none;
  margin: 0;
  padding: 0;
  border: 0;
}
body.blog .post-item a.post-more,
body.archive .post-item a.post-more {
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--uw-ink);
  text-decoration: none;
  border: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color .25s ease, gap .25s ease;
}
body.blog .post-item a.post-more::after,
body.archive .post-item a.post-more::after {
  content: "\2192";
  font-size: 13px;
  letter-spacing: 0;
  color: var(--uw-accent);
  transition: transform .3s cubic-bezier(.2,.6,.2,1);
}
body.blog .post-item a.post-more:hover,
body.archive .post-item a.post-more:hover {
  color: var(--uw-accent-d);
}
body.blog .post-item a.post-more:hover::after,
body.archive .post-item a.post-more:hover::after {
  transform: translateX(4px);
}
/* Pagination */

body.blog .pager_wrapper,
body.archive .pager_wrapper {
  margin-top: 64px;
  padding-top: 32px;
  border-top: 1px solid var(--uw-rule);
}
/* --------------------------------------------------------------------------
   3. Sidebar
   -------------------------------------------------------------------------- */

body.blog .sidebar .widget,
body.archive .sidebar .widget,
body.single-post .sidebar .widget,
body.blog .sidebar .widget {
  border: 0 !important;
  padding: 0 0 34px;
  margin: 0 0 34px;
  border-bottom: 1px solid var(--uw-rule-2) !important;
}
body.blog .sidebar .widget h3,
body.archive .sidebar .widget h3,
body.single-post .sidebar .widget h3 {
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--uw-ink-mute);
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}
body.blog .sidebar .widget ul,
body.archive .sidebar .widget ul,
body.single-post .sidebar .widget ul,
body.blog .sidebar .widget ul li ul,
body.archive .sidebar .widget ul li ul,
body.single-post .sidebar .widget ul li ul {
  margin: 0;
  padding: 0;
  list-style: none;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
/* Betheme paints a filled slab behind the category and archive lists */

body.blog .sidebar .widget_categories,
body.archive .sidebar .widget_categories,
body.single-post .sidebar .widget_categories,
body.blog .sidebar .widget_archive,
body.archive .sidebar .widget_archive,
body.single-post .sidebar .widget_archive,
body.blog .sidebar .widget_recent_entries,
body.archive .sidebar .widget_recent_entries,
body.single-post .sidebar .widget_recent_entries {
  background: none !important;
}
body.blog .sidebar .widget ul li,
body.archive .sidebar .widget ul li,
body.single-post .sidebar .widget ul li {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--uw-rule-2) !important;
  margin: 0;
  padding: 11px 0 !important;
  list-style: none;
  font-family: var(--uw-sans);
  font-size: 14px;
  line-height: 1.45;
  color: var(--uw-ink-soft);
}
body.blog .sidebar .widget ul li:last-child,
body.archive .sidebar .widget ul li:last-child,
body.single-post .sidebar .widget ul li:last-child {
  border-bottom: 0 !important;
}
body.blog .sidebar .widget ul li::before,
body.archive .sidebar .widget ul li::before,
body.single-post .sidebar .widget ul li::before {
  content: none !important;
}
body.blog .sidebar .widget ul li a,
body.archive .sidebar .widget ul li a,
body.single-post .sidebar .widget ul li a {
  color: var(--uw-ink);
  text-decoration: none;
  border: 0;
  transition: color .22s ease;
}
body.blog .sidebar .widget ul li a:hover,
body.archive .sidebar .widget ul li a:hover,
body.single-post .sidebar .widget ul li a:hover {
  color: var(--uw-accent);
}
body.blog .sidebar .widget_categories ul li.current-cat > a,
body.archive .sidebar .widget_categories ul li.current-cat > a {
  color: var(--uw-accent);
  font-weight: 600;
}
/* Search field */

body.blog .sidebar .widget_search input[type="text"],
body.archive .sidebar .widget_search input[type="text"],
body.single-post .sidebar .widget_search input[type="text"],
body.blog .sidebar .widget_search input[type="search"],
body.archive .sidebar .widget_search input[type="search"],
body.single-post .sidebar .widget_search input[type="search"] {
  font-family: var(--uw-sans);
  font-size: 14px;
  border: 1px solid var(--uw-rule) !important;
  border-radius: 2px;
  background: var(--uw-paper-2) !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
  color: var(--uw-ink);
}
body.blog .sidebar .widget_search input:focus,
body.archive .sidebar .widget_search input:focus,
body.single-post .sidebar .widget_search input:focus {
  border-color: var(--uw-accent) !important;
  outline: none;
}
/* --------------------------------------------------------------------------
   4. Single post
   -------------------------------------------------------------------------- */

/* Post header meta,
centred over the measure */

body.single-post .post-header .post-meta {
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--uw-ink-mute);
  border: 0 !important;
  padding: 0;
  margin: 0 auto 6px;
  max-width: var(--uw-measure);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 0 16px;
  text-align: center;
}
body.single-post .post-header .post-meta i,
body.single-post .post-header .post-meta .label {
  display: none !important;
}
body.single-post .post-header .post-meta .category,
body.single-post .post-header .post-meta .author-date {
  float: none;
  margin: 0;
  padding: 0;
}
body.single-post .post-header .post-meta ul,
body.single-post .post-header .post-meta .post-categories {
  display: inline;
  list-style: none;
  margin: 0;
  padding: 0;
}
body.single-post .post-header .post-meta li {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.single-post .post-header .post-meta li::before {
  content: none;
}
body.single-post .post-header .post-meta li + li::before {
  content: " / ";
  color: var(--uw-ink-mute);
}
body.single-post .post-header .post-meta a {
  color: var(--uw-accent);
  text-decoration: none;
  border: 0;
}
body.single-post .post-header .post-meta a:hover {
  color: var(--uw-accent-d);
}
/* Tags row is noise above the fold */

body.single-post .post-header .post-meta .mata-tags {
  display: none !important;
}
/* Prev / next / index nav — quiet it down */

body.single-post .post-nav {
  border-bottom: 1px solid var(--uw-rule-2);
  padding-bottom: 18px;
  margin-bottom: 30px;
  opacity: .55;
  transition: opacity .3s ease;
}
body.single-post .post-nav:hover {
  opacity: 1;
}
/* Featured image: full column width,
no black frame */

body.single-post .single-photo-wrapper .image_frame {
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 0 12px;
}
body.single-post .single-photo-wrapper .image_frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  object-fit: cover;
}
body.single-post .single-photo-wrapper .image_frame .image_links,
body.single-post .single-photo-wrapper .image_frame .mask {
  display: none !important;
}
/* Share buttons: pull them out of the floating stack into a tidy row */

body.single-post .share_wrapper {
  position: static !important;
  float: none !important;
  width: auto !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  opacity: .85;
}
body.single-post .share_wrapper > span {
  float: none !important;
  display: inline-block !important;
  margin: 0 !important;
}
/* ---- Body copy: the main event -------------------------------------------
   Playfair Display is the brand face and stays on headings,
but it was also
   carrying every paragraph at 17px across a 916px measure. Long-form body
   copy moves to a reading face at a controlled measure. */

body.single-post .the_content_wrapper {
  max-width: var(--uw-measure);
  margin-left: auto;
  margin-right: auto;
  font-family: var(--uw-sans);
  font-size: 18px;
  line-height: 1.78;
  color: var(--uw-ink-body);
  letter-spacing: .001em;
}
body.single-post .the_content_wrapper p {
  font-family: var(--uw-sans);
  font-size: 18px;
  line-height: 1.78;
  color: var(--uw-ink-body);
  margin: 0 0 1.5em;
}
/* Lead paragraph */

body.single-post .the_content_wrapper > p:first-of-type {
  font-size: 20.5px;
  line-height: 1.62;
  color: var(--uw-ink);
}
body.single-post .the_content_wrapper h1,
body.single-post .the_content_wrapper h2,
body.single-post .the_content_wrapper h3,
body.single-post .the_content_wrapper h4 {
  font-family: var(--uw-display);
  color: var(--uw-ink);
  letter-spacing: -0.008em;
}
body.single-post .the_content_wrapper h2 {
  font-size: 31px;
  line-height: 1.24;
  font-weight: 500;
  margin: 2.1em 0 .55em;
}
/* Hairline above each section break */

body.single-post .the_content_wrapper h2::before {
  content: "";
  display: block;
  width: 46px;
  height: 1px;
  background: var(--uw-accent);
  margin-bottom: 26px;
  opacity: .75;
}
body.single-post .the_content_wrapper h3 {
  font-size: 23px;
  line-height: 1.32;
  font-weight: 500;
  margin: 1.9em 0 .5em;
}
body.single-post .the_content_wrapper h4 {
  font-size: 19px;
  line-height: 1.35;
  font-weight: 600;
  margin: 1.7em 0 .45em;
}
body.single-post .the_content_wrapper strong,
body.single-post .the_content_wrapper b {
  font-weight: 600;
  color: var(--uw-ink);
}
body.single-post .the_content_wrapper a {
  color: var(--uw-accent-d);
  text-decoration: none;
  border-bottom: 1px solid rgba(154,123,79,.4);
  transition: border-color .25s ease, color .25s ease;
}
body.single-post .the_content_wrapper a:hover {
  color: var(--uw-ink);
  border-bottom-color: var(--uw-ink);
}
body.single-post .the_content_wrapper ul,
body.single-post .the_content_wrapper ol {
  margin: 0 0 1.5em;
  padding-left: 1.2em;
}
body.single-post .the_content_wrapper li {
  font-family: var(--uw-sans);
  font-size: 18px;
  line-height: 1.72;
  color: var(--uw-ink-body);
  margin-bottom: .55em;
  padding-left: .2em;
}
body.single-post .the_content_wrapper ul li::marker {
  color: var(--uw-accent);
}
/* Pull quote */

body.single-post .the_content_wrapper blockquote {
  font-family: var(--uw-display);
  font-size: 24px;
  line-height: 1.44;
  font-style: italic;
  font-weight: 400;
  color: var(--uw-ink);
  background: none !important;
  border: 0 !important;
  border-left: 2px solid var(--uw-accent) !important;
  margin: 2.2em 0;
  padding: 4px 0 4px 30px;
}
body.single-post .the_content_wrapper blockquote::before,
body.single-post .the_content_wrapper blockquote::after {
  content: none !important;
}
body.single-post .the_content_wrapper blockquote p {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  font-style: inherit;
  color: inherit;
  margin: 0 0 .5em;
}
body.single-post .the_content_wrapper blockquote p:last-child {
  margin-bottom: 0;
}
/* Pipeline summary block */

body.single-post .the_content_wrapper .rt-summary {
  background: var(--uw-paper-2);
  border: 0;
  border-left: 2px solid var(--uw-accent);
  border-radius: 0 3px 3px 0;
  padding: 26px 30px;
  margin: 0 0 2.2em;
}
body.single-post .the_content_wrapper .rt-summary p {
  margin: 0;
  font-size: 17px;
  line-height: 1.7;
  color: var(--uw-ink-body);
}
body.single-post .the_content_wrapper img {
  border-radius: 3px;
}
body.single-post .the_content_wrapper hr {
  border: 0;
  border-top: 1px solid var(--uw-rule);
  margin: 2.6em 0;
}
/* Author block at the foot of the article */

body.single-post .the_content_wrapper h2:last-of-type ~ p {
  color: var(--uw-ink-soft);
}
/* --------------------------------------------------------------------------
   5. Related posts
   -------------------------------------------------------------------------- */

body.single-post .related_wrapper,
body.single-post .section.related-posts {
  background: var(--uw-paper-2);
  margin-top: 72px;
  padding: 56px 0 !important;
  border-top: 1px solid var(--uw-rule);
}
body.single-post .related_wrapper h4,
body.single-post .related_wrapper .title {
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--uw-ink-mute);
  margin: 0 0 30px;
}
body.single-post .related_wrapper .post-item .image_frame,
body.single-post .related_wrapper .image_frame {
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 16px;
}
body.single-post .related_wrapper .image_frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.91 / 1;
  object-fit: cover;
}
body.single-post .related_wrapper .image_frame .image_links,
body.single-post .related_wrapper .image_frame .mask {
  display: none !important;
}
body.single-post .related_wrapper .desc h5,
body.single-post .related_wrapper h5 {
  font-family: var(--uw-display);
  font-size: 18px;
  line-height: 1.32;
  font-weight: 500;
  margin: 0 0 12px;
}
body.single-post .related_wrapper h5 a,
body.single-post .related_wrapper .desc h5 a {
  color: var(--uw-ink);
  text-decoration: none;
}
body.single-post .related_wrapper h5 a:hover,
body.single-post .related_wrapper .desc h5 a:hover {
  color: var(--uw-accent);
}
/* The stock blue pill button */

body.single-post .related_wrapper a.button,
body.single-post .related_wrapper .button_wrapper a {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--uw-accent) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 3px !important;
  margin: 0;
  font-family: var(--uw-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--uw-ink) !important;
  line-height: 1.4;
}
body.single-post .related_wrapper a.button:hover {
  color: var(--uw-accent) !important;
}
body.single-post .related_wrapper a.button .button_label {
  background: none !important;
  color: inherit !important;
  padding: 0 !important;
}
/* --------------------------------------------------------------------------
   6. Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1240px) {body.blog .posts_group,
body.archive .posts_group {
    gap: 52px 34px;
  }

}
@media (max-width: 959px) {body.blog .posts_group,
body.archive .posts_group {
    grid-template-columns: minmax(0, 1fr);
    gap: 48px;
  }
body.blog #Subheader .title,
body.archive #Subheader .title {
    font-size: 34px;
  }
body.single-post #Subheader .title {
    font-size: 27px;
    line-height: 1.28;
  }
body.blog #Subheader,
body.archive #Subheader,
body.single-post #Subheader {
    padding: 76px 0 !important;
  }
body.single-post .the_content_wrapper,
body.single-post .the_content_wrapper p,
body.single-post .the_content_wrapper li {
    font-size: 17px;
  }
body.single-post .the_content_wrapper > p:first-of-type {
    font-size: 19px;
  }
body.single-post .the_content_wrapper h2 {
    font-size: 26px;
  }
body.single-post .the_content_wrapper h3 {
    font-size: 21px;
  }
body.single-post .the_content_wrapper blockquote {
    font-size: 21px;
  }

}
@media (max-width: 767px) {body.blog .post-item .post-title h2,
body.archive .post-item .post-title h2 {
    font-size: 22px;
  }
body.single-post .post-header .post-meta {
    gap: 0 12px;
  }

}

/* --------------------------------------------------------------------------
   7. Sidebar link colour
   Betheme paints the category/archive lists as filled slabs with white text.
   Section 3 removes the slab, so the white has to go with it or the links
   turn invisible. The theme sets these from an ID-scoped inline rule, which
   no class selector can outrank; !important is the only lever here.
   -------------------------------------------------------------------------- */

body.blog .sidebar .widget li a,
body.archive .sidebar .widget li a,
body.single-post .sidebar .widget li a {
  color: var(--uw-ink) !important;
}

body.blog .sidebar .widget li a:hover,
body.archive .sidebar .widget li a:hover,
body.single-post .sidebar .widget li a:hover {
  color: var(--uw-accent) !important;
}

body.blog .sidebar .widget_categories li.current-cat > a,
body.archive .sidebar .widget_categories li.current-cat > a {
  color: var(--uw-accent) !important;
  font-weight: 600;
}

body.blog .sidebar .widget li,
body.archive .sidebar .widget li,
body.single-post .sidebar .widget li {
  color: var(--uw-ink-soft) !important;
}

/* Betheme renders .category as a block, which dropped the terms (and the
   separator dot) onto their own lines under the date. Keep the meta on one
   flowing line. */

body.blog .post-item .post-meta .category,
body.archive .post-item .post-meta .category,
body.single-post .post-header .post-meta .category {
  display: inline !important;
}

body.blog .post-item .post-meta .author-date,
body.archive .post-item .post-meta .author-date,
body.single-post .post-header .post-meta .author-date {
  display: inline !important;
}

/* Betheme floats the subheader title left, so the max-width cap above left it
   hanging off-centre instead of centred over the hero. */

body.blog #Subheader .title,
body.archive #Subheader .title,
body.single-post #Subheader .title {
  float: none !important;
  width: auto;
}

body.blog #Subheader .column,
body.archive #Subheader .column,
body.single-post #Subheader .column {
  text-align: center;
}

/* Cards show the primary category only, so every meta line is one tidy row.
   A post in two categories still shows both on the article itself and still
   appears under both archives; this is presentation, not assignment. */

body.blog .post-item .post-meta .post-categories li + li,
body.archive .post-item .post-meta .post-categories li + li {
  display: none !important;
}

/* The <li> was still list-item, which forced a block break inside the inline
   category wrapper and dropped the term onto its own line. */

body.blog .post-item .post-meta .post-categories li,
body.archive .post-item .post-meta .post-categories li,
body.single-post .post-header .post-meta .post-categories li {
  display: inline !important;
  list-style: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Betheme's category wrapper resists sitting inline next to the date no matter
   what display it reports. Rather than fight it, make the stack deliberate:
   date on top, category beneath, both flush left, no dangling separator. */

body.blog .post-item .post-meta .category::before,
body.archive .post-item .post-meta .category::before {
  content: none !important;
}

body.blog .post-item .post-meta .category,
body.archive .post-item .post-meta .category {
  display: block !important;
  text-align: left !important;
  text-indent: 0 !important;
  margin-top: 3px !important;
}

body.blog .post-item .post-meta .cat-wrapper,
body.archive .post-item .post-meta .cat-wrapper {
  text-align: left !important;
  text-indent: 0 !important;
}

body.blog .post-item .post-meta .date,
body.archive .post-item .post-meta .date {
  display: block;
}

/* The <ul> itself was still centring the term inside a left-aligned box. */

body.blog .post-item .post-meta .post-categories,
body.archive .post-item .post-meta .post-categories,
body.blog .post-item .post-meta .category *,
body.archive .post-item .post-meta .category * {
  text-align: left !important;
}


/* ==========================================================================
   8. Heroes — rebuilt
   Replaces the flat "photo + grey wash + centred italic caps" treatment.
   Bottom-left editorial stack: brass rule, eyebrow, title, standfirst.
   The eyebrow/standfirst text and (on articles) the background image are
   injected per page by uw_blog_hero_dressing() in the child functions.php,
   so a new post dresses its own hero with no work.
   ========================================================================== */

body.blog #Subheader,
body.archive #Subheader,
body.single-post #Subheader {
  /* the theme prints style="padding:150px 0" inline on the element */
  padding: 0 !important;
  min-height: clamp(400px, 44vw, 560px);
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

/* Photo breathes at the top, goes solid where the type sits */
body.blog #Subheader::after,
body.archive #Subheader::after,
body.single-post #Subheader::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(10,11,13,.10) 0%,
    rgba(10,11,13,.26) 34%,
    rgba(10,11,13,.62) 74%,
    rgba(10,11,13,.86) 100%
  );
  pointer-events: none;
  z-index: 1;
}

body.blog #Subheader .container,
body.archive #Subheader .container,
body.single-post #Subheader .container {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-top: 140px;
  padding-bottom: 58px;
}

body.blog #Subheader .column.one,
body.archive #Subheader .column.one,
body.single-post #Subheader .column.one {
  text-align: left !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* Brass hairline + eyebrow. Content comes from the PHP injector; with no
   content declared the pseudo-element generates no box at all. */
body.blog #Subheader .column.one::before,
body.archive #Subheader .column.one::before,
body.single-post #Subheader .column.one::before {
  display: block;
  font-family: var(--uw-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: #cbab77;
  margin: 0 0 20px;
  padding-top: 22px;
  border-top: 1px solid rgba(203,171,119,.55);
  width: fit-content;
  min-width: 46px;
}

body.blog #Subheader .title,
body.archive #Subheader .title,
body.single-post #Subheader .title {
  font-family: var(--uw-display);
  font-style: normal;
  font-weight: 400;
  text-transform: none;
  letter-spacing: -0.012em;
  color: #fff;
  text-align: left;
  margin: 0;
  float: none !important;
  max-width: 17ch;
  text-shadow: 0 2px 30px rgba(0,0,0,.42);
}

body.blog #Subheader .title,
body.archive #Subheader .title {
  font-size: clamp(34px, 3.4vw, 50px);
  line-height: 1.06;
  letter-spacing: .02em;
  text-transform: uppercase;
  max-width: 20ch;
}

body.single-post #Subheader .title {
  font-size: clamp(28px, 3.1vw, 46px);
  line-height: 1.14;
  max-width: 19ch;
}

/* Standfirst: the date on an article, a descriptive line on the index */
body.blog #Subheader .column.one::after,
body.archive #Subheader .column.one::after,
body.single-post #Subheader .column.one::after {
  display: block;
  font-family: var(--uw-sans);
  font-size: 15px;
  line-height: 1.6;
  font-weight: 400;
  color: rgba(255,255,255,.84);
  margin-top: 22px;
  max-width: 48ch;
}

body.single-post #Subheader .column.one::after {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255,255,255,.68);
  margin-top: 20px;
}

/* --------------------------------------------------------------------------
   9. Single post: the hero now carries the image, category and date, so the
   in-page duplicates come out.
   -------------------------------------------------------------------------- */

body.single-post .single-photo-wrapper,
body.single-post .post-header .post-meta {
  display: none !important;
}

body.single-post .post-header {
  padding-top: 0;
}

body.single-post .post-wrapper-content .section.the_content {
  padding-top: 54px;
}

@media (max-width: 959px) {
  body.blog #Subheader,
  body.archive #Subheader,
  body.single-post #Subheader {
    min-height: 340px;
  }

  body.blog #Subheader .container,
  body.archive #Subheader .container,
  body.single-post #Subheader .container {
    padding-top: 96px;
    padding-bottom: 40px;
  }

  body.blog #Subheader .column.one::after,
  body.archive #Subheader .column.one::after {
    font-size: 14px;
    margin-top: 16px;
  }

  body.single-post .post-wrapper-content .section.the_content {
    padding-top: 36px;
  }
}

/* Single-axis scrim washed out on bright imagery (Scott's heroes are sunlit
   hillsides). Type sits bottom-left, so the scrim reads on both axes: a solid
   left column for legibility, fading right so the photograph still carries. */
body.blog #Subheader::after,
body.archive #Subheader::after,
body.single-post #Subheader::after {
  background:
    linear-gradient(
      90deg,
      rgba(9,10,12,.82) 0%,
      rgba(9,10,12,.66) 26%,
      rgba(9,10,12,.34) 55%,
      rgba(9,10,12,.06) 84%,
      rgba(9,10,12,0) 100%
    ),
    linear-gradient(
      180deg,
      rgba(9,10,12,.20) 0%,
      rgba(9,10,12,.16) 30%,
      rgba(9,10,12,.44) 72%,
      rgba(9,10,12,.72) 100%
    );
}

body.blog #Subheader .column.one::before,
body.archive #Subheader .column.one::before,
body.single-post #Subheader .column.one::before {
  color: #dcbe8e;
  border-top-color: rgba(220,190,142,.7);
  text-shadow: 0 1px 14px rgba(0,0,0,.6);
}

body.blog #Subheader .column.one::after,
body.archive #Subheader .column.one::after,
body.single-post #Subheader .column.one::after {
  color: rgba(255,255,255,.9);
  text-shadow: 0 1px 16px rgba(0,0,0,.55);
}

body.single-post #Subheader .column.one::after {
  color: rgba(255,255,255,.78);
}

/* Betheme uses #Subheader::after as a 3px divider rule and sets an explicit
   height on it. inset:0 cannot stretch a box that already has a height, so the
   scrim was painting as a 1440x3px sliver. Force the box, not just the offsets. */
body.blog #Subheader::after,
body.archive #Subheader::after,
body.single-post #Subheader::after {
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  border: 0 !important;
  opacity: 1 !important;
}

/* --------------------------------------------------------------------------
   10. Related posts (real selectors: .section-post-related, NOT .related_wrapper)
   The hero now carries the article's featured image, so the in-article copy is
   hidden. IMPORTANT: related cards reuse .single-photo-wrapper for their own
   thumbnails, so the hide must be scoped to the main one, which is the only
   one carrying .column.one.
   -------------------------------------------------------------------------- */

body.single-post .single-photo-wrapper {
  display: block !important;
}

body.single-post .single-photo-wrapper.one {
  display: none !important;
}

/* Theme author box duplicates the About the Author section already in the copy */
body.single-post .author-box {
  display: none !important;
}

body.single-post .section-post-related {
  background: var(--uw-paper-2);
  border-top: 1px solid var(--uw-rule);
  margin-top: 64px;
  padding: 58px 0 !important;
}

body.single-post .section-related-adjustment h4 {
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--uw-ink-mute);
  margin: 0 0 32px;
  padding: 0;
  border: 0;
}

body.single-post .section-related-ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px 34px;
}

body.single-post .column.post-related {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}

body.single-post .column.post-related .image_frame {
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 0 18px;
  width: 100% !important;
  max-width: none !important;
  display: block;
}

body.single-post .column.post-related .image_frame .image_wrapper {
  border: 0 !important;
  width: 100% !important;
  display: block;
}

body.single-post .column.post-related .image_frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.91 / 1;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.2,.6,.2,1);
}

body.single-post .column.post-related:hover .image_frame img {
  transform: scale(1.035);
}

body.single-post .column.post-related .image_frame .image_links,
body.single-post .column.post-related .image_frame .mask {
  display: none !important;
}

body.single-post .column.post-related .date_label {
  display: block !important;
  position: static !important;
  background: none !important;
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--uw-ink-mute);
  padding: 0 !important;
  margin: 0 0 9px;
}

body.single-post .column.post-related .desc h4 {
  font-family: var(--uw-display);
  font-size: 19px;
  line-height: 1.3;
  font-weight: 500;
  letter-spacing: -0.004em;
  margin: 0 0 16px;
  text-transform: none;
  color: var(--uw-ink);
}

body.single-post .column.post-related .desc h4 a {
  color: inherit;
  text-decoration: none;
  transition: color .25s ease;
}

body.single-post .column.post-related .desc h4 a:hover {
  color: var(--uw-accent);
}

body.single-post .column.post-related hr.hr_color {
  display: none !important;
}

/* The navy pill with a grid glyph becomes a quiet text link */
body.single-post .column.post-related a.button {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: auto 0 0 !important;
  min-width: 0 !important;
  line-height: 1.4 !important;
  display: inline-flex;
  align-items: center;
}

body.single-post .column.post-related a.button .button_icon {
  display: none !important;
}

body.single-post .column.post-related a.button .button_label {
  background: none !important;
  color: var(--uw-ink) !important;
  padding: 0 !important;
  font-family: var(--uw-sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  transition: color .25s ease;
}

body.single-post .column.post-related a.button .button_label::after {
  content: " \2192";
  color: var(--uw-accent);
  letter-spacing: 0;
}

body.single-post .column.post-related a.button:hover .button_label {
  color: var(--uw-accent-d) !important;
}

@media (max-width: 959px) {
  body.single-post .section-related-ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 24px;
  }
}

@media (max-width: 639px) {
  body.single-post .section-related-ul {
    grid-template-columns: minmax(0, 1fr);
  }
}