/* ==========================================================================
   TALKERS — child theme overrides (staging-aware)
   ========================================================================== */

/* =============================== 1) VARIABLES ============================ */
:root{
  --talkers-red:#b7000a;      /* category label */
  --talkers-text:#111111;     /* body text */
  --talkers-meta:#2b2b2b;     /* byline/meta */
  --talkers-cap:#666666;      /* captions */

  --container-max:1200px;     /* content cap */
  --container-max-wide:1300px;/* ≥1600px */
  --container-pct:90%;

  --font:18px;  --lh:1.6;
  --font-sm:17px; --lh-sm:1.55;

  --ad-max:900px;
  --ad-nudge:-18px;

  --float-cap-pct:40%;
  --float-cap-px:320px;
  --float-gap:18px;
  --float-top:10px;           /* “invisible border” top/bottom */
}

/* =============================== 2) CONTAINER =========================== */
.site,.site-content,#content,.container,.wrap,.content-area,#primary,.site-main{
  width:var(--container-pct) !important;
  max-width:var(--container-max) !important;
  margin-left:auto !important; margin-right:auto !important;
  box-sizing:border-box;
}
@media (min-width:1600px){
  .site,.site-content,#content,.container,.wrap,.content-area,#primary,.site-main{
    max-width:var(--container-max-wide) !important;
  }
}

/* =============================== 3) TYPOGRAPHY ========================== */
body{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  font-size:var(--font) !important; line-height:var(--lh) !important; color:var(--talkers-text) !important;
}
@media (max-width:1024px){ body{ font-size:var(--font-sm) !important; line-height:var(--lh-sm) !important; }}

/* =========================== 4) CATEGORY / META ======================== */
.blog-feed-category a,
.cat-links a,.entry-categories a,.post-categories a{ color:var(--talkers-red) !important; font-weight:600; }
.blog-feed-meta,.blog-feed-meta *,.entry-meta,.entry-meta a,.byline,.byline a,.posted-on,.posted-on a{
  color:var(--talkers-meta) !important;
}

/* =================== 5) FLOATS / CAPTIONS (single + blog feed) ========= */
/* treat BOTH single post body AND feed/excerpt the same */
.hentry img.alignleft{
  float:left !important; height:auto !important;
  max-width:min(var(--float-cap-px),var(--float-cap-pct)) !important;
  margin:var(--float-top) var(--float-gap) var(--float-gap) 0 !important;
}
.hentry img.alignright{
  float:right !important; height:auto !important;
  max-width:min(var(--float-cap-px),var(--float-cap-pct)) !important;
  margin:var(--float-top) 0 var(--float-gap) var(--float-gap) !important; /* even top/btm = clear gutter */
}

/* fine-tune images specifically when they appear inline inside paragraphs */
.hentry p img.alignright,
.hentry p a > img.alignright{
  float:right !important;
  display:block !important;
  margin:var(--float-top) 0 var(--float-gap) var(--float-gap) !important;
  width:auto !important; height:auto !important;

  /* balanced wrap so the picture sits visually “centered” against the block */
  shape-outside: inset(8% 0 8% 0);
  shape-margin: 0;
}

/* captions */
.entry-content figure,
.blog-feed-post-wrapper figure{ margin-top:8px; }
.entry-content figcaption,.wp-caption .wp-caption-text,
.blog-feed-post-wrapper .wp-caption .wp-caption-text{
  color:var(--talkers-cap); font-size:.9rem; line-height:1.35; margin-top:6px;
}

/* soft-cap tiny logos */
.hentry img.alignright[width*="100"],
.hentry img.alignright[width*="120"],
.hentry img.alignright[width*="140"],
.hentry img.alignright[width*="150"]{ max-width:180px !important; height:auto !important; }

/* Industry Views tweaks (unchanged) */
body.category-industry-views .entry-content > p:first-of-type{
  font-size:.95em; line-height:1.45; margin-bottom:.85em;
}
body.category-industry-views .entry-content img.alignleft:first-of-type,
body.category-industry-views .entry-content .industry-views-headshot{
  float:left !important; width:180px !important; max-width:180px !important; height:auto !important;
  margin:4px 14px 8px 0 !important; border-radius:4px;
}

/* ===================== 6) BETWEEN-POSTS AD LANE ======================== */
.code-block:has(.talkers-between-ad){
  margin-top: var(--ad-nudge) !important;
  margin-bottom: 0 !important;
  clear: both !important;
  text-align: center !important;
}
.talkers-between-ad{ display:block !important; text-align:center !important; margin:0 auto !important; padding:0 !important; }
.talkers-between-ad__inner{ max-width:var(--ad-max) !important; width:100% !important; margin:0 auto !important; }
.talkers-between-ad__inner img,.talkers-between-ad__inner iframe,.talkers-between-ad__inner ins,.talkers-between-ad__inner > *{
  display:block !important; margin-left:auto !important; margin-right:auto !important; max-width:100% !important; height:auto !important;
}
.code-block:has(.talkers-between-ad) + article,
.code-block:has(.talkers-between-ad) + .post,
.code-block:has(.talkers-between-ad) + .hentry{ margin-top:20px !important; }
.talkers-between-ad__inner .g,
.talkers-between-ad__inner .g-1,.talkers-between-ad__inner .g-2,.talkers-between-ad__inner .g-3,
.talkers-between-ad__inner .g-4,.talkers-between-ad__inner .g-5,.talkers-between-ad__inner .g-6,.talkers-between-ad__inner .g-8{
  max-width:var(--ad-max) !important; width:100% !important; margin:0 auto !important; max-height:none !important;
}
.talkers-between-ad__inner .g-dyn{ max-width:var(--ad-max) !important; max-height:none !important; }
.site-main > [id^="ai-block-"]{
  margin: var(--ad-nudge) auto 0 auto !important; text-align:center !important;
  max-width:var(--ad-max) !important; width:100% !important;
}
.site-main > [id^="ai-block-"] img, .site-main > [id^="ai-block-"] iframe{
  display:block !important; width:100% !important; max-width:var(--ad-max) !important; height:auto !important; margin:0 auto !important;
}

/* =========================== 7) HEADER / MENU ========================== */
#site-navigation{
  background:#111111;
  width:100vw !important;
  position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
}
#site-navigation .top-nav.container{
  width:100% !important; max-width:none !important;
  padding-left:clamp(12px,2vw,24px) !important;
  padding-right:clamp(12px,2vw,24px) !important;
  box-sizing:border-box;
}
@media (min-width:1281px){
  #site-navigation .menu{ display:flex !important; flex-wrap:nowrap; gap:18px; justify-content:center; white-space:nowrap; }
  #site-navigation .menu li{ flex:0 0 auto; }
  #site-navigation .menu-toggle{ display:none !important; }
}
@media (min-width:1025px) and (max-width:1280px){
  #site-navigation .menu-toggle{ display:none !important; }
  #site-navigation .menu{
    display:flex !important; flex-wrap:nowrap; gap:16px; justify-content:flex-start;
    overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; scrollbar-width:thin;
  }
  #site-navigation .top-nav.container{ position:relative; }
  #site-navigation .top-nav.container::before,
  #site-navigation .top-nav.container::after{
    content:""; position:absolute; top:0; bottom:0; width:24px; pointer-events:none;
    background:linear-gradient(to right, rgba(17,17,17,1), rgba(17,17,17,0));
  }
  #site-navigation .top-nav.container::after{ right:0; left:auto; transform:scaleX(-1); }
}
@media (max-width:1024px){
  #site-navigation .menu-toggle{ display:inline-block !important; }
  #site-navigation .menu{ display:none !important; }
  #site-navigation.toggled .menu{
    display:block !important;
    position:absolute; left:0; right:0; top:100%;
    background:#111111; z-index:9999;
    padding:8px 14px;
  }
  #site-navigation.toggled .menu li{ display:block; border-top:1px solid rgba(255,255,255,.08); }
  #site-navigation.toggled .menu li a{ display:block; padding:10px 6px; }
  .site-header,.sticky-header,.is-sticky{ position:static !important; top:auto !important; }
  .main-navigation{ margin-top:0 !important; }
}
@media (max-width:1024px){ body.admin-bar #masthead{ margin-top:0 !important; } }
.home .site-main, .blog .site-main{ margin-top:10px !important; }

/* =========================== 8) BRAND / SMALL FIXES ==================== */
/* TALKERS red — force everywhere */
.blog-feed-category a,
.single-post .cat-links a,
.single-post .entry-categories a,
.entry-cate, .entry-cate a, .entry-box .entry-cate{
  color:#b7000a !important;
  background:transparent !important;
  border-color:transparent !important;
}

/* inline logos/headshots: SAME rules in single + feed */
.hentry img.inline-logo.alignright{
  float:right;
  margin:0 0 .5rem .8rem !important;
  height:auto;
  width:clamp(110px,18vw,200px); /* responsive like ads */
  max-width:40%;
  object-fit:contain;
}
/* optional downscale on narrow content widths */
@media (max-width:700px){
  .hentry img.inline-logo.alignright{ width:clamp(100px,28vw,160px); }
}
/* ==================== INLINE LOGOS / HEADSHOTS — EVERYWHERE ==================== */

/* ==================== INLINE LOGOS / HEADSHOTS — EVERYWHERE (CLEAN) ==================== */
/* Uses the variables you set at the top: --float-cap-px, --float-cap-pct, --float-gap, --float-top, etc. */

/* 0) BLOG/ARCHIVE column safety — remove any old fixed widths that created the big right gutter */
.blog .blog-feed-post-wrapper .text-left,
.archive .blog-feed-post-wrapper .text-left {
  width: auto !important;
  max-width: none !important;
  float: none !important;
  display: block !important;
  padding-right: 0 !important;
}

/* 1) Meta on lists: keep the DATE, hide auto “By TALKERS | …” (real bylines live in the copy) */
.blog .blog-feed-meta .posted-on,
.archive .blog-feed-meta .posted-on { 
  display: inline !important;
  visibility: visible !important;
  font-style: italic;
  color: var(--talkers-meta);
}
.blog .blog-feed-meta a[href*="/author/"],
.archive .blog-feed-meta a[href*="/author/"],
.blog .blog-feed-meta .post-author,
.archive .blog-feed-meta .post-author {
  display: none !important;
}

/* 2) Consistent floats/margins for inline images in BOTH single posts and feed cards */
:is(.entry-content, .blog-feed-post-wrapper .text-left) img.alignright {
  float: right !important;
  display: block !important;
  height: auto !important;
  max-width: min(var(--float-cap-px), var(--float-cap-pct)) !important;
  margin: var(--float-top) 0 var(--float-top) var(--float-gap) !important;  /* even top/bottom, gap on the left */
}
:is(.entry-content, .blog-feed-post-wrapper .text-left) img.alignleft {
  float: left !important;
  display: block !important;
  height: auto !important;
  max-width: min(var(--float-cap-px), var(--float-cap-pct)) !important;
  margin: var(--float-top) var(--float-gap) var(--float-top) 0 !important;  /* even top/bottom, gap on the right */
}

/* 2a) Inline logos (e.g., RTNA) — responsive width cap + balanced wrap */
:is(.entry-content, .blog-feed-post-wrapper .text-left) img.inline-logo.alignright {
  width: clamp(120px, 18vw, 210px) !important;
  max-width: 40% !important;
  object-fit: contain;
  /* “invisible” extra buffer and balanced wrap so it sits visually centered against the paragraph block */
  shape-outside: inset(8% 0 8% 0) !important;
  shape-margin: 0 !important;
  /* a touch more vertical breathing room */
  margin-top: calc(var(--float-top) + 2px) !important;
  margin-bottom: calc(var(--float-top) + 2px) !important;
}

/* 3) Headings (incl. subheads) should NOT wrap beside floated media (author mug/headshot, logos, etc.) */
:is(.entry-content, .blog-feed-post-wrapper .text-left) h1,
:is(.entry-content, .blog-feed-post-wrapper .text-left) h2,
:is(.entry-content, .blog-feed-post-wrapper .text-left) h3,
:is(.entry-content, .blog-feed-post-wrapper .text-left) h4,
:is(.entry-content, .blog-feed-post-wrapper .text-left) .wp-block-heading {
  clear: both !important;
}

/* 4) First paragraph tight to the top so the Y-alignment with the author image looks the same everywhere */
:is(.entry-content, .blog-feed-post-wrapper .text-left) p:first-of-type { margin-top: 0 !important; }

/* 5) Search results — restore readable body text (some themes fade excerpts) */
.search .site-main article .entry-summary,
.search .site-main article .entry-content,
.search .site-main .blog-feed-post-wrapper {
  color: var(--talkers-text) !important;
  opacity: 1 !important;
  filter: none !important;
}
.search .blog-feed-meta,
.search .blog-feed-meta * {
  color: var(--talkers-meta) !important;
}

/* 6) Mobile stacking: drop floats on narrow screens so nothing feels cramped */
@media (max-width: 560px){
  :is(.entry-content, .blog-feed-post-wrapper .text-left) img.alignright,
  :is(.entry-content, .blog-feed-post-wrapper .text-left) img.alignleft {
    float: none !important;
    display: block !important;
    margin: 8px auto 14px auto !important;
    max-width: 85% !important;
  }
}

/* 7) Tidy, consistent spacing for meta rows */
.single .entry-meta,
.blog .blog-feed-meta { margin: .25rem 0 1rem; }

/* 8) Safety for WP captions */
.wp-caption { max-width: 100%; }
.wp-caption .wp-caption-text { color: var(--talkers-cap); font-size: .9rem; line-height: 1.35; margin-top: 6px; }

/* ===== FINAL TOUCHES (append at end of talkers.css) ===================== */

/* A) SINGLE POSTS — show only the date, hide any "By ..." remnants */
.single .entry-meta > * { display: none !important; }           /* hide all */
.single .entry-meta .posted-on { display: inline !important; }  /* keep date */
.single .entry-meta { font-style: italic; color:#666; }         /* match style */

/* B) SINGLE POSTS — make inline right logos (e.g., RTNA) match blog cards */
.single-post .entry-content p img.alignright,
.single-post .entry-content p a > img.alignright,
.single-post .entry-content img.inline-logo.alignright {
  float: right !important;
  display: block !important;
  height: auto !important;
  margin: 10px 0 10px 14px !important;      /* even top/bottom, gap on the left */
  max-width: min(320px, 40%) !important;     /* same cap as feed */
  shape-outside: inset(8% 0 8% 0) !important;/* balanced wrap look */
  shape-margin: 0 !important;
}

/* C) SINGLE POSTS — allow subheads to wrap beside the mugshot (like blog) */
.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content .wp-block-heading {
  clear: none !important;                    /* no forced drop below image */
  margin-top: .6rem;                         /* a touch of breathing room */
}

/* D) BLOG/FEED — keep dates visible and hide auto "By TALKERS" if present */
.blog .blog-feed-meta .posted-on,
.archive .blog-feed-meta .posted-on { 
  display: inline !important; visibility: visible !important;
}
.blog .blog-feed-meta a[href*="/author/"],
.archive .blog-feed-meta a[href*="/author/"] { display: none !important; }

/* (Optional) a consistent look for any inline date next to category (see JS below) */
.blog .feed-date-inline,
.archive .feed-date-inline { 
  margin-left: .6rem; font-style: italic; color:#666;
}

/* ===== FIX 1: remove stray “By”, keep only the date ===================== */

/* BLOG cards */
.blog .blog-feed-post-wrapper .blog-feed-meta { font-size: 0 !important; } /* hides any loose text like "By |" */
.blog .blog-feed-post-wrapper .blog-feed-meta .post-author,
.blog .blog-feed-post-wrapper .blog-feed-meta .byline,
.blog .blog-feed-post-wrapper .blog-feed-meta a[href*="/author/"] { display: none !important; }
.blog .blog-feed-post-wrapper .blog-feed-meta .posted-on {
  display: inline !important;
  font-size: 1rem !important;
  font-style: italic; color:#666 !important;
}
.blog .blog-feed-post-wrapper .blog-feed-meta .posted-on:before { content: "" !important; } /* kill any CSS-injected “By ” */

/* SINGLE post */
.single .entry-meta { font-size: 0 !important; }  /* hides any loose "By" text node */
.single .entry-meta .byline,
.single .entry-meta a[href*="/author/"] { display: none !important; }
.single .entry-meta .posted-on {
  display: inline !important;
  font-size: 1rem !important;
  font-style: italic; color:#666 !important;
}
.single .entry-meta .posted-on:before { content: "" !important; }

/* ===== FIX 2: right-aligned logos — identical wrap + +1 text line buffer = 6 lines total ===== */
:root { --logo-extra-lines: .5lh; } /* .5lh top + .5lh bottom = +1 line overall */

.entry-content img.inline-logo.alignright,
.blog-feed-post-wrapper .text-left img.inline-logo.alignright,
.entry-content p img.alignright.inline-logo,
.blog-feed-post-wrapper .text-left p img.alignright.inline-logo {
  float: right !important;
  display: block !important;
  max-width: min(var(--float-cap-px), var(--float-cap-pct)) !important;
  margin: var(--float-top) 0 var(--float-top) var(--float-gap) !important;  /* even top/bottom, gap on left */
  padding-block: var(--logo-extra-lines) !important;                          /* invisible spacer (line-height based) */
  background-clip: content-box !important;                                   /* keep the padding as blank space */
  shape-outside: inset(8% 0 8% 0) !important;                                /* balanced wrap (looks vertically centered) */
}

/* ===== FIX 3: let the subhead wrap beside the headshot on SINGLE ===== */
.single .entry-content h2,
.single .entry-content h3,
.single .entry-content .wp-block-heading { clear: none !important; }
/* ===== BLOG FEED META — keep the date, kill the stray "By" ===== */
.blog .blog-feed-post-wrapper .blog-feed-meta{
  font-style: italic; color:#666;
}
.blog .blog-feed-post-wrapper .blog-feed-meta > *{ display:none !important; }  /* hide everything… */
.blog .blog-feed-post-wrapper .blog-feed-meta .posted-on{ display:inline !important; } /* …except the date */

/* ===== BLOG FEED IMAGES — add a little more bottom breathing room ===== */
.blog .blog-feed-post-wrapper .text-left img.alignright,
.blog .blog-feed-post-wrapper .text-left img.inline-logo.alignright{
  float:right !important;
  margin: .2rem 0 1.25rem 1rem !important;   /* bigger bottom space than single page */
  height:auto !important; width:auto !important;
  shape-outside: inset(8% 0 8% 0) !important; /* balanced wrap like the single page */
  shape-margin: 0 !important;
}
/* === UNIVERSAL cleanups (blog, single, archive, search) ================= */

/* A) kill any old fixed widths that caused a right gutter on cards */
.blog  .blog-feed-post-wrapper .text-left,
.archive .blog-feed-post-wrapper .text-left,
.search .blog-feed-post-wrapper .text-left{
  width:auto !important; max-width:none !important;
  float:none !important; display:block !important; padding-right:0 !important;
}

/* B) show only the DATE in meta for lists; strip any “By …” */
.blog  .blog-feed-post-wrapper .blog-feed-meta > * ,
.archive .blog-feed-post-wrapper .blog-feed-meta > * ,
.search .blog-feed-post-wrapper .blog-feed-meta > * { display:none !important; }
.blog  .blog-feed-post-wrapper .blog-feed-meta .posted-on,
.archive .blog-feed-post-wrapper .blog-feed-meta .posted-on,
.search .blog-feed-post-wrapper .blog-feed-meta .posted-on { display:inline !important; }

/* C) on single pages: keep only the date in the meta row */
.single .entry-meta > *{ display:none !important; }
.single .entry-meta .posted-on{ display:inline !important; font-style:italic; color:#666; }

/* D) right-aligned inline images/logos behave the same everywhere */
.single  .entry-content img.alignright,
.blog    .blog-feed-post-wrapper .text-left img.alignright,
.archive .blog-feed-post-wrapper .text-left img.alignright,
.search  .blog-feed-post-wrapper .text-left img.alignright{
  float:right !important;
  margin:.2rem 0 1rem 1rem !important;     /* base spacing */
  height:auto !important; width:auto !important;
  shape-outside: inset(8% 0 8% 0) !important; shape-margin:0 !important;
}

/* a bit more bottom room on list views so the wrap feels airy */
.blog    .blog-feed-post-wrapper .text-left img.alignright,
.archive .blog-feed-post-wrapper .text-left img.alignright,
.search  .blog-feed-post-wrapper .text-left img.alignright{
  margin-bottom:1.25rem !important;
}

/* optional: treat “inline logos” (e.g., RTNA) the same way */
.single  .entry-content img.inline-logo.alignright,
.blog    .blog-feed-post-wrapper .text-left img.inline-logo.alignright,
.archive .blog-feed-post-wrapper .text-left img.inline-logo.alignright,
.search  .blog-feed-post-wrapper .text-left img.inline-logo.alignright{
  float:right !important;
  margin:.2rem 0 1.25rem 1rem !important;
  height:auto !important; width:auto !important;
  shape-outside: inset(8% 0 8% 0) !important; shape-margin:0 !important;
}

/* headings: keep wrapping like the blog (no forced drop below the mugshot) */
.single .entry-content h2,
.single .entry-content h3,
.single .entry-content .wp-block-heading{ clear:none !important; margin-top:.6rem; }

/* mobile: stack images */
@media (max-width:560px){
  .single  .entry-content img.alignright,
  .blog    .blog-feed-post-wrapper .text-left img.alignright,
  .archive .blog-feed-post-wrapper .text-left img.alignright,
  .search  .blog-feed-post-wrapper .text-left img.alignright{
    float:none !important; display:block !important;
    margin:.5rem auto 1rem auto !important; max-width:85% !important;
  }
}

/* style for the inline date we inject beside the category */
.meta-inline-date{ margin-left:.6rem; font-style:italic; color:#666; }
/* Style for the inline date next to the category */
.blog .blog-feed-category .meta-inline-date,
.archive .blog-feed-category .meta-inline-date,
.search .blog-feed-category .meta-inline-date,
.single-post .entry-categories .meta-inline-date,
.single-post .cat-links .meta-inline-date{
  margin-left:.6rem; font-style:italic; color:#666;
}

/* Right-aligned inline images/logos — shared baseline */
:is(.entry-content, .blog-feed-post-wrapper .text-left) p img.alignright,
:is(.entry-content, .blog-feed-post-wrapper .text-left) p a > img.alignright,
:is(.entry-content, .blog-feed-post-wrapper .text-left) img.inline-logo.alignright{
  float:right !important;
  display:block !important;
  height:auto !important;
  margin:10px 0 10px 14px !important;        /* even top/btm, gap on the left */
  max-width:min(320px,40%) !important;
  shape-outside: inset(8% 0 8% 0) !important; /* visually centered wrap */
  shape-margin:0 !important;
}

/* Blog/archive/search cards only — give a hair more room below the image */
.blog  .blog-feed-post-wrapper p img.alignright,
.blog  .blog-feed-post-wrapper p a > img.alignright,
.archive .blog-feed-post-wrapper p img.alignright,
.search  .blog-feed-post-wrapper p img.alignright{
  margin-bottom: 1.1rem !important; /* slightly larger than singles */
}

/* Safety: remove any old fixed widths that caused right-side gaps */
.blog .blog-feed-post-wrapper .text-left,
.archive .blog-feed-post-wrapper .text-left,
.search .blog-feed-post-wrapper .text-left{
  width:auto !important; max-width:none !important; float:none !important; padding-right:0 !important;
}

/* Keep subheads from colliding with floats on singles only where needed */
.single-post .entry-content .wp-block-heading,
.single-post .entry-content h2,
.single-post .entry-content h3{ clear:none; margin-top:.6rem; }
/* Inline date next to category (all views) */
.blog .blog-feed-category .meta-inline-date,
.archive .blog-feed-category .meta-inline-date,
.search .blog-feed-category .meta-inline-date,
.single-post .entry-categories .meta-inline-date,
.single-post .cat-links .meta-inline-date{
  margin-left:.6rem; font-style:italic; color:#666;
}

/* Shared right-aligned inline image baseline */
:is(.entry-content, .blog-feed-post-wrapper .text-left) p img.alignright,
:is(.entry-content, .blog-feed-post-wrapper .text-left) p a > img.alignright,
:is(.entry-content, .blog-feed-post-wrapper .text-left) img.inline-logo.alignright{
  float:right !important;
  display:block !important;
  height:auto !important;
  margin:10px 0 10px 14px !important;         /* even top/bottom, gap on the left */
  max-width:min(320px,40%) !important;
  shape-outside: inset(8% 0 8% 0) !important; /* balanced wrap */
  shape-margin:0 !important;
}

/* Lists (blog/archive/search): a touch more room below image than single */
.blog  .blog-feed-post-wrapper p img.alignright,
.blog  .blog-feed-post-wrapper p a > img.alignright,
.archive .blog-feed-post-wrapper p img.alignright,
.search  .blog-feed-post-wrapper p img.alignright{
  margin-bottom: 1.25rem !important;
}

/* Safety: remove any old fixed widths that caused right-side gaps */
.blog .blog-feed-post-wrapper .text-left,
.archive .blog-feed-post-wrapper .text-left,
.search .blog-feed-post-wrapper .text-left{
  width:auto !important; max-width:none !important; float:none !important; padding-right:0 !important;
}
/* Inline date next to category (all views incl. singles using .entry-cate) */
.blog .blog-feed-category .meta-inline-date,
.archive .blog-feed-category .meta-inline-date,
.search .blog-feed-category .meta-inline-date,
.single-post .entry-cate .meta-inline-date,
.single-post .entry-categories .meta-inline-date,
.single-post .cat-links .meta-inline-date{
  margin-left:.6rem; font-style:italic; color:#666;
}

/* Lists (blog/archive/search): a tad more room below right-aligned images */
.blog  .blog-feed-post-wrapper p img.alignright,
.blog  .blog-feed-post-wrapper p a > img.alignright,
.archive .blog-feed-post-wrapper p img.alignright,
.search  .blog-feed-post-wrapper p img.alignright{
  margin-bottom: 1.25rem !important;
}
/* FEED (blog/archive/search) — match single-post spacing on right-floated images */
.blog .blog-feed-post-wrapper .text-left p img.alignright,
.blog .blog-feed-post-wrapper .text-left p a > img.alignright,
.archive .blog-feed-post-wrapper .text-left p img.alignright,
.search  .blog-feed-post-wrapper .text-left p img.alignright{
  float: right !important;
  display: block !important;
  width: auto !important; height: auto !important;
  max-width: min(var(--float-cap-px), var(--float-cap-pct)) !important;
  /* even top, a touch more bottom so the wrap matches single */
  margin: var(--float-top) 0 calc(var(--float-top) + .35em) var(--float-gap) !important;
  shape-outside: inset(8% 0 8% 0) !important;
  shape-margin: 0 !important;
}

/* Give inline brand logos the same invisible top/bottom buffer in feeds */
.blog .blog-feed-post-wrapper .text-left img.inline-logo.alignright,
.archive .blog-feed-post-wrapper .text-left img.inline-logo.alignright,
.search  .blog-feed-post-wrapper .text-left img.inline-logo.alignright{
  padding-block: .5em !important;  /* ≈ extra line split above/below */
}

/* Ensure the first paragraph sits tight to the top so Y-alignment matches single */
.blog .blog-feed-post-wrapper .text-left p:first-of-type,
.archive .blog-feed-post-wrapper .text-left p:first-of-type,
.search  .blog-feed-post-wrapper .text-left p:first-of-type{
  margin-top: 0 !important;
}
/* === INDUSTRY VIEWS — left headshot consistency (single, blog, archive, search) === */

/* 1) Same size/spacing for the first left-aligned image */
:is(.single, .blog, .archive, .search)
  .post.category-industry-views
  :is(.entry-content, .blog-feed-post-wrapper .text-left, .blog-feed-thumbnail-entry-content)
  img.alignleft:first-of-type{
  float: left !important;
  width: 150px !important;      /* unify to 150 so the H2 lines up */
  max-width: 150px !important;
  height: auto !important;
  margin: 2px 14px 12px 0 !important;  /* top | right | bottom | left  (extra bottom to fix feed tightness) */
  border-radius: 4px;
}

/* 2) First paragraph sits tight to the top so the headshot aligns to line 1 */
:is(.single, .blog, .archive, .search)
  .post.category-industry-views
  :is(.entry-content, .blog-feed-post-wrapper .text-left, .blog-feed-thumbnail-entry-content)
  > p:first-of-type{
  margin-top: 0 !important;
}

/* 3) Subheads can wrap beside the headshot (don’t force them to drop) */
:is(.single, .blog, .archive, .search)
  .post.category-industry-views
  :is(.entry-content, .blog-feed-post-wrapper .text-left, .blog-feed-thumbnail-entry-content)
  :is(h2, h3, .wp-block-heading){
  clear: none !important;
}
/* === FEED/ARCHIVE: compact vertical spacing (safe, reversible) === */
:root{
  --feed-gap: 14px;         /* gap between story cards (was ~20px+) */
  --ad-gap-top: -26px;      /* pulls ad lane up toward story above (was -18px) */
  --ad-gap-after: 12px;     /* gap after ad before next story (was 20px) */
}

/* 1) Outer gap for cards (blog, archive, search only) */
.blog #primary article.post,
.archive #primary article.post,
.search #primary article.post{
  margin-bottom: var(--feed-gap) !important;
  padding-bottom: calc(var(--feed-gap) - 2px) !important; /* keeps the thin divider visible */
}

/* 2) Between-post ad lane — pull up and tighten after */
.code-block:has(.talkers-between-ad){
  margin-top: var(--ad-gap-top) !important; /* closer to story above */
  margin-bottom: 0 !important;
}
/* Gap from ad lane down to next card */
.code-block:has(.talkers-between-ad) + article,
.code-block:has(.talkers-between-ad) + .post,
.code-block:has(.talkers-between-ad) + .hentry{
  margin-top: var(--ad-gap-after) !important;
}

/* If you also use Ad Inserter blocks (ids like #ai-block-XX), compress those too */
.site-main > [id^="ai-block-"]{
  margin-top: var(--ad-gap-top) !important;
  margin-bottom: 0 !important;
}

/* 3) Slightly tighter text rhythm inside feed cards */
.blog .blog-feed-post-wrapper p,
.archive .blog-feed-post-wrapper p,
.search .blog-feed-post-wrapper p{
  margin: .6em 0 .65em !important;  /* gentle tighten without cramping */
}
/* === After-ad bottom gap fix (feed, archive, search only) === */
:root{
  --ad-gap-after: 10px;        /* space from ad to next card */
  --ad-follow-top-pad: 10px;   /* top padding inside the next card */
}

/* AdRotate lane */
.code-block:has(.talkers-between-ad){ margin-bottom: 0 !important; }
.code-block:has(.talkers-between-ad) + article{
  margin-top: var(--ad-gap-after) !important;
}
.code-block:has(.talkers-between-ad) + article .blog-feed-post-wrapper{
  padding-top: var(--ad-follow-top-pad) !important;
}

/* Ad Inserter blocks (ids like #ai-block-12) – same treatment */
.site-main > [id^="ai-block-"]{ margin-bottom: 0 !important; }
.site-main > [id^="ai-block-"] + article{
  margin-top: var(--ad-gap-after) !important;
}
.site-main > [id^="ai-block-"] + article .blog-feed-post-wrapper{
  padding-top: var(--ad-follow-top-pad) !important;
}
/* === tighten the space BELOW between-post ads (AdRotate + Ad Inserter) === */

/* AdRotate wrapper (.code-block) — remove its bottom margin */
.code-block { margin-bottom: 0 !important; }

/* The post card immediately AFTER an ad: reduce its top gap */
.code-block + article,
.code-block + .post,
.code-block + .hentry { margin-top: 8px !important; }

/* Trim the card’s internal top padding/margin when it follows an ad */
.code-block + article .blog-feed-post-wrapper,
.code-block + .post .blog-feed-post-wrapper,
.code-block + .hentry .blog-feed-post-wrapper {
  margin-top: 0 !important;
  padding-top: 10px !important;
}

/* Ad Inserter blocks: ids like #ai-block-12 */
.site-main > [id^="ai-block-"] { margin-bottom: 0 !important; }
.site-main > [id^="ai-block-"] + article,
.site-main > [id^="ai-block-"] + .post,
.site-main > [id^="ai-block-"] + .hentry { margin-top: 8px !important; }
.site-main > [id^="ai-block-"] + article .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + .post .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + .hentry .blog-feed-post-wrapper {
  margin-top: 0 !important;
  padding-top: 10px !important;
}
/* === BETWEEN-POST AD — tighten space BELOW the ad ===================== */

/* Kill default margin on the legacy u003ccenter> the ad plugin outputs */
.talkers-between-ad__inner center { 
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  line-height:0 !important;
}

/* Make sure the ad wrapper itself isn't adding bottom space */
.code-block { margin-bottom: 0 !important; }
.site-main > [id^="ai-block-"] { margin-bottom: 0 !important; }

/* Pull the next post card up a bit */
.code-block + article,
.code-block + .post,
.code-block + .hentry,
.site-main > [id^="ai-block-"] + article,
.site-main > [id^="ai-block-"] + .post,
.site-main > [id^="ai-block-"] + .hentry {
  margin-top: 6px !important;             /* was larger via theme */
}

/* Trim the card’s *internal* top padding when it follows an ad */
.code-block + article .blog-feed-post-wrapper,
.code-block + .post .blog-feed-post-wrapper,
.code-block + .hentry .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + article .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + .post .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + .hentry .blog-feed-post-wrapper {
  margin-top: 0 !important;
  padding-top: 8px !important;            /* adjust to taste: 6–12px */
}

/* Make sure the ad image itself contributes no extra gap */
.talkers-between-ad__inner img {
  display:block !important;
  margin:0 auto !important;
}
/* === tighten the gap BELOW the between-post ad ====================== */

/* legacy u003ccenter> in ad HTML shouldn't add extra space */
.talkers-between-ad__inner center { margin:0 !important; padding:0 !important; line-height:0 !important; }
.talkers-between-ad__inner img   { display:block !important; margin:0 auto !important; }

/* ensure ad wrapper itself isn't adding bottom margin */
.code-block,
.site-main > [id^="ai-block-"] { margin-bottom: 0 !important; }

/* 1) kill the large *outside* gap above the next article */
.code-block + article,
.code-block + .post,
.site-main > [id^="ai-block-"] + article,
.site-main > [id^="ai-block-"] + .post { margin-top: 4px !important; }  /* adjust 2–8px to taste */

/* 2) trim the card's *internal* top padding (this is the big one) */
.code-block + article .blog-feed-post-wrapper,
.code-block + .post .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + article .blog-feed-post-wrapper,
.site-main > [id^="ai-block-"] + .post .blog-feed-post-wrapper,
.code-block + article .blog-feed-thumbnail-entry-content,
.code-block + .post .blog-feed-thumbnail-entry-content,
.site-main > [id^="ai-block-"] + article .blog-feed-thumbnail-entry-content,
.site-main > [id^="ai-block-"] + .post .blog-feed-thumbnail-entry-content {
  padding-top: 8px !important;   /* this is what visually closes the gap */
  margin-top: 0 !important;
}

/* 3) keep the first line of meta snug as well */
.code-block + article .blog-feed-category,
.site-main > [id^="ai-block-"] + article .blog-feed-category { margin-top: 0 !important; }
/* ================== BETWEEN-POST AD → NEXT STORY GAP (Y-axis) ================== */
/* Tweak this to taste */
:root{ --between-ad-gap: 8px; }  /* 8–12px usually looks good */

/* 1) Strip the ad block’s bottom margin so it doesn’t push the next card down */
.code-block:has(.talkers-between-ad){ margin-bottom:0 !important; }
.code-block:has(.talkers-between-ad) > .talkers-between-ad{ margin-bottom:0 !important; }

/* 2) Pull the *next* article up (this controls the background gap you’re seeing) */
.code-block:has(.talkers-between-ad) + article,
.code-block:has(.talkers-between-ad) + .post,
.code-block:has(.talkers-between-ad) + .hentry{
  margin-top: var(--between-ad-gap) !important;
  padding-top: 0 !important;          /* prevent margin-collapsing tricks */
}

/* 3) If the theme adds top margin on the inner wrapper, stop it from collapsing upward */
.code-block:has(.talkers-between-ad) + article .blog-feed-post-wrapper{
  margin-top: 0 !important;
}

/* 4) Cover Ad Inserter blocks too (their wrapper IDs start with ai-block-) */
.site-main > [id^="ai-block-"]{ margin-bottom:0 !important; }
.site-main > [id^="ai-block-"] + article,
.site-main > [id^="ai-block-"] + .post,
.site-main > [id^="ai-block-"] + .hentry{
  margin-top: var(--between-ad-gap) !important;
}

/* tighten ONLY the gap *below* between-post ads */
:root { --between-post-gap: 8px; }  /* adjust to taste */

.code-block { margin-bottom: 0 !important; }                           /* kill ad block's bottom margin */
.code-block + article {                                                 /* pull next story up */
  margin-top: var(--between-post-gap) !important;
  display: flow-root;                                                   /* stops margin-collapsing */
}

/* if some ad slots come from Ad Inserter rather than code-block */
.site-main > [id^="ai-block-"] { margin-bottom: 0 !important; }
.site-main > [id^="ai-block-"] + article {
  margin-top: var(--between-post-gap) !important;
  display: flow-root;
}
/* === TALKERS Patch 2025-09-10-D — tiny, safe overrides (color, date size, compact ad gap) === */

/* Quick knobs */
:root{
  --talkers-red: #b7000a;
  --date-font: 0.95rem;
  --ad-gap-top: 3px;
  --ad-gap-bottom: 3px;
  --after-ad-gap: 6px;
}

/* 1) Single-post category label: red text, no yellow pill */
.single-post .entry-header .entry-categories a,
.single-post .entry-header .cat-links a,
.single-post .entry-categories a,
.single-post .cat-links a{
  color: var(--talkers-red) !important;
  background: transparent !important;
  border-color: transparent !important;
}

/* 2) Date size everywhere */
.single .entry-meta .posted-on,
.blog .blog-feed-post-wrapper .blog-feed-meta .posted-on,
.archive .blog-feed-post-wrapper .blog-feed-meta .posted-on,
.search .blog-feed-post-wrapper .blog-feed-meta .posted-on,
.meta-inline-date,
.feed-date-inline{
  font-size: var(--date-font) !important;
}

/* 3) Between-post ad spacing: small & even, no width changes */
/* Remove the prior article's bottom gap when an ad follows */
article:has(+ .code-block .talkers-between-ad){
  margin-bottom: 0 !important;
}

/* Ad lane trim + white to eliminate grey seam */
.code-block:has(.talkers-between-ad){
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: var(--ad-gap-top) !important;
  padding-bottom: var(--ad-gap-bottom) !important;
  background: #ffffff !important;
}

/* Tiny space before next article */
.code-block:has(.talkers-between-ad) + article,
.code-block:has(.talkers-between-ad) + .post,
.code-block:has(.talkers-between-ad) + .hentry{
  margin-top: var(--after-ad-gap) !important;
}

/* Fallbacks without :has() */
.code-block .talkers-between-ad{ background:#fff !important; padding-top: var(--ad-gap-top) !important; padding-bottom: var(--ad-gap-bottom) !important; }
.code-block{ margin-top: 0 !important; margin-bottom: 0 !important; }
.code-block + article,
.code-block + .post,
.code-block + .hentry{ margin-top: var(--after-ad-gap) !important; }

/* === TALKERS Patch 2025-09-10-F — kill dot separators; keep gap; gray date === */

/* Tweaks */
:root{
  --date-gap: .6em;      /* visual space between category and date */
  --date-gray: #707070;  /* date color */
}

/* 1) Neutralize pseudo-element separators on common meta wrappers */
.entry-meta > span::before,
.entry-meta > span::after,
.blog-feed-meta > span::before,
.blog-feed-meta > span::after,
.blog-feed-category::after,
.cat-links::after,
.entry-categories::after,
.entry-meta .posted-on::before,
.entry-meta .posted-on::after,
.blog-feed-meta .posted-on::before,
.blog-feed-meta .posted-on::after {
  content: "" !important;
}

/* 2) Hide classic <span class="sep">•</span> nodes if present */
.entry-meta .sep,
.blog-feed-meta .sep {
  display: none !important;
}

/* 3) Spacing + gray styling on the date */
.entry-meta .posted-on,
.blog-feed-meta .posted-on,
.meta-inline-date,
.feed-date-inline {
  display: inline-block !important;
  margin-left: var(--date-gap) !important;
  color: var(--date-gray) !important;
}

/* 4) If your date sits immediately after the category element, enforce the gap */
.blog-feed-category + .posted-on,
.cat-links + .posted-on,
.entry-categories + .posted-on {
  margin-left: var(--date-gap) !important;
}


/* inline date spacing (no bullet) */
.meta-inline-date{ margin-left:.55em; font-style:italic; color:#666; }

/* collapse the old meta row entirely on single posts */
.single-post .entry-meta{ display:none !important; margin:0 !important; padding:0 !important; height:0 !important; }

/* trim the headline-to-body gap on single posts */
.single-post .entry-title{ margin-bottom:.35rem !important; }
/* Force left-aligned post titles & category line on mobile */
@media (max-width: 768px) {
  .blog .blog-feed-post-wrapper h2.entry-title,
  .archive .blog-feed-post-wrapper h2.entry-title,
  .search .blog-feed-post-wrapper h2.entry-title,
  .home.blog .blog-feed-post-wrapper h2.entry-title,
  .blog .entry-title { 
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .blog .blog-feed-category,
  .archive .blog-feed-category,
  .search .blog-feed-category {
    text-align: left !important;
  }
}
/* Ensure the between-post ad group never collapses */
.talkers-between-ad { margin: 8px 0; }
.g-8 { 
  min-height: 150px;           /* your group 8 is 600x150 */
  max-height: 150px;
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  overflow: hidden;
}

/* Fallback: if the slider JS doesn't boot, show the first creative */
.g-8 .g-dyn { display: none; }
.g-8 .g-dyn:first-child { display: block; }

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

/***************
 * HEADER SPACING (balanced)
 ***************/
.site-header { margin-bottom: 0 !important; }

/* Gentle space between menu and the header widgets */
#content.site-content { padding-top: 18px !important; }   /* adjust 14–22px to taste */

/* Make sure the first header widget doesn't add extra space on top */
#header-widget-area{ margin-top: 10px !important; padding-top: 0 !important; }
#header-widget-area .widget:first-child,
#header-widget-area .widget > *:first-child,
#header-widget-area figure:first-child{
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* === TALKERS NAV: one-line → two-lines → hamburger (clean) === */

/* Keep the inner nav content at the same width as stories */
#site-navigation .top-nav.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 12px;
}

/* Base link sizing (small + tight) */
#site-navigation .menu > li > a{
  font-size:12px !important;
  line-height:1.1;
  padding:10px 12px !important;
  white-space:nowrap;
}

/* Remove stray spacing theme adds */
#site-navigation .menu > li{ margin:0 !important; }
#site-navigation .menu{ gap:0 !important; }

/* --- 1) DESKTOP (≥1240px): single row --- */
@media (min-width:1240px){
  #site-navigation .menu{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:space-between;
    align-items:center;
  }
  /* show full menu, hide hamburger */
  #site-navigation .menu-toggle{ display:none !important; }
}

/* --- 2) TABLET/WIDE (900–1239px): TWO ROWS, 6 COLUMNS --- */
/* You have 12 items, so 6 columns = 2 perfect rows */
@media (min-width:900px) and (max-width:1239px){
  #site-navigation .menu{
    display:grid !important;
    grid-template-columns:repeat(6, minmax(0, 1fr));
    grid-auto-flow:row;           /* fill across first row, then second */
    grid-auto-rows:auto;
    align-items:center;
    justify-items:start;          /* left align link text */
  }
  #site-navigation .menu-toggle{ display:none !important; } /* force burger off */
}

/* --- 3) MOBILE (≤899px): hamburger only --- */
@media (max-width:899px){
  /* hide the grid/list; let the theme's toggle open it */
  #site-navigation .menu{ display:none !important; }
  #site-navigation .menu-toggle{ display:block !important; }
}

/* Keep the bar height tight (prevents tall black/gray band) */
#site-navigation{ padding:0 !important; }
.admin-bar .main-navigation{ top:32px; }
@media (max-width:782px){ .admin-bar .main-navigation{ top:46px; } }


/* === 8) HERO IMAGE (first centered image auto-fills content width) ======= */
/* Recognize 3 common patterns for the first centered image:
   - <figure class="aligncenter ..."><img ...></figure>
   - <p><img class="aligncenter"></p>
   - <img class="aligncenter"> directly under the content container
   Also provide an explicit opt-in class .talkers-hero in case editors want to force it.
*/

/* Wrapper as hero block (figure/p/standalone) */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(figure.aligncenter, p:has(> img.aligncenter), img.aligncenter):first-of-type,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(figure.talkers-hero, p:has(> img.talkers-hero), img.talkers-hero){
  /* spacing harmonized with cards */
  margin: 10px 0 18px 0 !important;
  clear: both;                 /* make sure it sits on its own line */
  width: 100% !important;      /* allow the block to span the text column */
  max-width: 100% !important;
}

/* The image itself fills the text column, responsive */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure.aligncenter:first-of-type img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > p:first-of-type > img.aligncenter,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > img.aligncenter:first-of-type,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  :is(figure.talkers-hero img, p > img.talkers-hero, img.talkers-hero){
  display: block !important;
  width: 100% !important;      /* fills the content box like the ad lane */
  max-width: 100% !important;  /* never overflow */
  height: auto !important;
  margin: 0 auto !important;   /* centered */
  object-fit: contain;         /* preserve aspect ratio */
}

/* Caption under hero stays full-width and centered */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure.aligncenter:first-of-type figcaption,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure.talkers-hero figcaption{
  text-align: center;
  font-size: .95em;
  line-height: 1.35;
  color: #666;
  margin-top: 8px;
}

/* Safety: ensure hero treatment does NOT accidentally apply to floats */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  img.alignleft:first-of-type,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  img.alignright:first-of-type,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  figure.alignleft:first-of-type,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  figure.alignright:first-of-type{
  width: auto !important;
  max-width: min(150px, 40%) !important;  /* headshot/logo sizing from earlier rules */
}

/* Mobile: hero stays full-width; floats already center from earlier rules */
@media (max-width: 780px){
  :where(.entry-content, .blog-feed-post-wrapper .text-left)
    > :is(figure.aligncenter, p:has(> img.aligncenter), img.aligncenter):first-of-type{
    margin: 10px 0 16px 0 !important;
  }
}
/* === HERO IMAGE: add Gutenberg wrapper support ========================== */
/* Treat the first centered Gutenberg image block as hero. */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image.aligncenter:first-of-type,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type:has(> figure.aligncenter){
  clear: both;
  width: 100% !important;
  max-width: 100% !important;
  margin: 10px 0 18px 0 !important;
}

/* Make the inner image fill the column */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image.aligncenter:first-of-type figure > img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image.aligncenter:first-of-type figure > a > img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type figure.aligncenter > img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type figure.aligncenter > a > img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  object-fit:contain;
  margin:0 auto !important;
}

/* Center the caption under hero images from Gutenberg */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image.aligncenter:first-of-type figcaption,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type figure.aligncenter > figcaption{
  text-align:center;
  font-size:.95em;
  line-height:1.35;
  color:#666;
  margin-top:8px;
}

/* === HERO IMAGE: catch Gutenberg blocks without aligncenter ============== */
/* Treat the first image block as hero when it's not explicitly left/right. */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type:not(.alignleft):not(.alignright),
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure:first-of-type:not(.alignleft):not(.alignright):has(> img),
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > p:first-of-type:has(> img.aligncenter),
/* explicit opt-in still works anywhere */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image, figure, p, img).talkers-hero{
  clear: both;
  width: 100% !important;
  max-width: 100% !important;
  margin: 10px 0 18px 0 !important;
}

/* Make the inner image fill the column (handles <a><img> too). */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type:not(.alignleft):not(.alignright) img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure:first-of-type:not(.alignleft):not(.alignright) > img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure:first-of-type:not(.alignleft):not(.alignright) > a > img,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > p:first-of-type > img.aligncenter,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image, figure, p) img.talkers-hero,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > img.talkers-hero{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain;
  margin: 0 auto !important;
}

/* Center Gutenberg figcaptions under hero images */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > .wp-block-image:first-of-type:not(.alignleft):not(.alignright) figcaption,
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > figure:first-of-type:not(.alignleft):not(.alignright) > figcaption{
  text-align: center;
  font-size: .95em;
  line-height: 1.35;
  color: #666;
  margin-top: 8px;
}
/* === HERO IMAGE — robust detection for Gutenberg & Classic =============== */
/* Treat the first in-flow media block near the top as hero when it's not explicitly
   left/right aligned. We look within the first 3 children of the content. */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image, figure, div.wp-caption, p.has-text-align-center, center):nth-child(-n+3)
  :is(img, a > img):not(.alignleft):not(.alignright),
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > img[align="center"]:nth-child(-n+3){
  /* image itself */
  display:block !important;
  width:100% !important;         /* fill the text column like the ad lane */
  max-width:100% !important;
  height:auto !important;
  object-fit:contain;
  margin:0 auto !important;
}

/* Make the outer block span the column and clear floats */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image, figure, div.wp-caption, p.has-text-align-center, center):nth-child(-n+3)
  :has(> img:not(.alignleft):not(.alignright)),
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > img[align="center"]:nth-child(-n+3){
  clear:both;
  width:100% !important;
  max-width:100% !important;
  margin:10px 0 18px 0 !important;
}

/* Center Gutenberg/Classic captions when present */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image, figure, div.wp-caption):nth-child(-n+3) figcaption{
  text-align:center;
  font-size:.95em;
  line-height:1.35;
  color:#666;
  margin-top:8px;
}

/* Guard: never hero images that are explicitly left/right floats */
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image.alignleft, figure.alignleft, div.wp-caption.alignleft),
:where(.entry-content, .blog-feed-post-wrapper .text-left)
  > :is(.wp-block-image.alignright, figure.alignright, div.wp-caption.alignright){
  width:auto !important;
  max-width:none !important;
}