/* ==========================================================================
   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 ==================== */
/* 0) Remove the old reserve spacer that created the blank area */
.entry-content p:has(> img.alignright)::before,
.entry-content p:has(> a > img.alignright)::before {
  content: none !important;
  display: none !important;
  float: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* 1) Shared spacing vars (edit to taste) */
:root{
  --inline-gap-x: 14px;     /* left gap between image and copy */
  --inline-gap-y: 10px;     /* even top/bottom “gutter” */
}

/* 2) Baseline float rules — apply to single + blog/index/category */
.single-post .entry-content img.alignright,
.blog .entry-content img.alignright,
.archive .entry-content img.alignright,
.category .entry-content img.alignright,
.home .entry-content img.alignright {
  float: right !important;
  display: block !important;
  height: auto !important;
  margin: var(--inline-gap-y) 0 var(--inline-gap-y) var(--inline-gap-x) !important;
  max-width: min(320px, 40%) !important;         /* never eat too much column */
  object-fit: contain;
}

/* 3) Logos inserted inline (your <img class="inline-logo alignright">) */
.single-post .entry-content img.inline-logo.alignright,
.blog .entry-content img.inline-logo.alignright,
.archive .entry-content img.inline-logo.alignright,
.category .entry-content img.inline-logo.alignright,
.home .entry-content img.inline-logo.alignright {
  width: clamp(120px, 18vw, 210px) !important;    /* responsive width */
  height: auto !important;
  max-width: 40% !important;
  margin-top: var(--inline-gap-y) !important;
  margin-bottom: var(--inline-gap-y) !important;
  /* Balanced wrapping above/below so it LOOKS vertically centered */
  shape-outside: inset(8% 0 8% 0) !important;
  shape-margin: 0 !important;
}

/* 4) Slightly smaller on narrow layouts, and drop floats on phones if needed */
@media (max-width: 700px){
  .single-post .entry-content img.alignright,
  .blog .entry-content img.alignright,
  .archive .entry-content img.alignright,
  .category .entry-content img.alignright,
  .home .entry-content img.alignright {
    width: clamp(100px, 28vw, 160px) !important;
  }
}
@media (max-width: 560px){
  .single-post .entry-content img.alignright,
  .blog .entry-content img.alignright,
  .archive .entry-content img.alignright,
  .category .entry-content img.alignright,
  .home .entry-content img.alignright {
    float: none !important;               /* stack for very small screens */
    display: block !important;
    margin: 8px auto 14px auto !important;
    max-width: 70% !important;
  }
}

/* 5) Category label color consistency (belt & suspenders) */
.blog-feed-category a,
.entry-cate a,
.entry-box .entry-cate a,
.single-post .entry-categories a { color:#b7000a !important; background:transparent !important; }