/* Presentation fixes for the static build.
   Self-hosted, no framework, no icon font. Scoped to classes this build adds
   (.pp-subscribe) or to the post-grid plugin's own classes, so nothing else on
   the page is affected. */

/* ── Subscribe row on episode pages ──────────────────────────────────────
   Was a bare centred line reading "Apple | Spotify" in link-blue text. */
.pp-subscribe{
  --sub-fg:#1c2530; --sub-line:#d7e0e8; --sub-accent:#4d96b5;
  display:flex; flex-wrap:wrap; gap:10px; justify-content:center;
  margin:18px 0 26px; padding:0; list-style:none;
}
.pp-subscribe a{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 16px; border:1px solid var(--sub-line); border-radius:999px;
  background:#fff; color:var(--sub-fg); text-decoration:none;
  font-size:.86rem; font-weight:600; line-height:1;
  transition:border-color .15s ease, background-color .15s ease, color .15s ease;
}
.pp-subscribe a:hover,.pp-subscribe a:focus-visible{
  border-color:var(--sub-accent); background:#eef5f9; color:#28536b;
}
.pp-subscribe a:focus-visible{outline:2px solid var(--sub-accent); outline-offset:2px}
.pp-subscribe svg{width:16px;height:16px;flex:0 0 16px;display:block}
.pp-subscribe .pp-sub-apple svg{color:#000}
.pp-subscribe .pp-sub-spotify svg{color:#1db954}
.pp-subscribe .pp-sub-pandora svg{color:#3668ff}
.pp-subscribe a:hover svg{color:inherit}
@media (max-width:480px){
  .pp-subscribe{flex-direction:column; align-items:stretch}
  .pp-subscribe a{justify-content:center}
}

/* ── Episode grid cards ──────────────────────────────────────────────────
   The cards had ragged bottoms: the Read More button sat directly under a
   title of variable length, so no two buttons in a row lined up. Make each
   column a full-height flex card and push the button to the bottom. */
.sp-pcp-row{align-items:stretch}
.sp-pcp-row [class*="sp-pcp-col-"]{display:flex}
.sp-pcp-post{
  display:flex; flex-direction:column; width:100%;
  background:#fff; border:1px solid #e6ecf1; border-radius:10px; overflow:hidden;
  box-shadow:0 1px 2px rgba(16,32,48,.05);
  transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.sp-pcp-post:hover{
  box-shadow:0 6px 18px rgba(16,32,48,.10); transform:translateY(-2px);
  border-color:#d3dee7;
}
.sp-pcp-post .sp-pcp-post-thumb-area{margin:0}
.sp-pcp-post .sp-pcp-thumb{display:block; aspect-ratio:3/2; overflow:hidden; background:#eef2f5}
.sp-pcp-post .sp-pcp-thumb img{width:100%; height:100%; object-fit:cover; display:block}
.sp-pcp-post .sp-pcp-title{
  /* Reserve exactly three lines for every title. Relying on margin-top:auto to
     pin the button was not dependable here — the plugin's own rules left the
     link short of the content box in some cards — so make the title block a
     fixed height and the buttons line up by construction. */
  margin:14px 16px 0; font-size:1.02rem; line-height:1.32; font-weight:700;
  /* !important is load-bearing here: the theme sets display:flow-root on this
     heading with higher specificity, and -webkit-line-clamp only takes effect on
     display:-webkit-box. Without it the clamp silently does nothing and a
     four-line title pushes its Read More button out of line with the row. */
  display:-webkit-box !important; -webkit-line-clamp:3; -webkit-box-orient:vertical;
  overflow:hidden; min-height:calc(3 * 1.32em);
}
.sp-pcp-post .sp-pcp-title a{text-decoration:none; color:#1c2530}
.sp-pcp-post .sp-pcp-title a:hover{color:#3b7590}
.sp-pcp-post .sp-pcp-post-content{
  display:flex; flex-direction:column; flex:1 1 auto; margin:0; padding:0 16px 16px;
}
.sp-pcp-post .sp-pcp-readmore{margin-top:auto; padding-top:14px; line-height:1}
.sp-pcp-post .pcp-readmore-link{
  display:inline-block; padding:8px 15px; border:1px solid #4d96b5; border-radius:6px;
  background:#fff; color:#3b7590; text-decoration:none;
  font-size:.72rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  transition:background-color .15s ease, color .15s ease;
}
.sp-pcp-post .pcp-readmore-link:hover,
.sp-pcp-post .pcp-readmore-link:focus-visible{background:#4d96b5; color:#fff}

/* ── Pagination ──────────────────────────────────────────────────────────
   Now that these are real links, give them a sane hit area. */
.pcp-post-pagination{display:flex; flex-wrap:wrap; gap:6px; margin:26px 0 10px}
.pcp-post-pagination .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; height:38px; padding:0 8px; border-radius:6px;
  text-decoration:none; font-size:.85rem; line-height:1;
}

/* ── Button rows (Follow on Apple / Spotify) ─────────────────────────────
   Removing the dead Stitcher button left these Beaver Builder column groups
   with uneven widths (one column 100%, its sibling 50%), so the two surviving
   buttons sat far apart instead of reading as a pair. Centre them as a group
   and let each column size to its button. */
.fl-col-group.pp-btn-row{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:14px;
}
.fl-col-group.pp-btn-row > .fl-col{width:auto !important; flex:0 0 auto; max-width:none}
.fl-col-group.pp-btn-row .fl-col-content{padding-left:0; padding-right:0}
.fl-col-group.pp-btn-row .fl-module{margin-left:0; margin-right:0}
.fl-col-group.pp-btn-row .fl-button-wrap{text-align:center; margin:0}
@media (max-width:520px){
  .fl-col-group.pp-btn-row{flex-direction:column; align-items:stretch}
  .fl-col-group.pp-btn-row .fl-button{display:block; text-align:center}
}

/* ── Adaptive Marketers sidebar CTA ──────────────────────────────────────
   Replaces the retired "Influenced Workshop" widget. Copy and the Marketer's
   Map graphic come from adaptivemarketers.com; the SVG is self-hosted rather
   than hotlinked from GoHighLevel's CDN, since removing exactly that kind of
   third-party dependency is the point of this migration. */
.am-cta .textwidget{
  --am-navy:#032666; --am-blue:#4D96B5; --am-pink:#E5739E; --am-ink:#1c2530;
  border:1px solid #dde5ec; border-radius:12px; background:#fff;
  padding:20px 18px; box-shadow:0 1px 3px rgba(16,32,48,.06);
}
.am-cta .am-eyebrow{
  display:inline-block; margin:0 0 8px; padding:4px 10px; border-radius:999px;
  background:#eef5f9; color:var(--am-blue);
  font-size:.66rem; font-weight:800; letter-spacing:.10em; text-transform:uppercase;
}
.am-cta h2.am-head{
  margin:0 0 10px; font-size:1.24rem; line-height:1.28; font-weight:800; color:var(--am-navy);
}
.am-cta h2.am-head a{color:inherit; text-decoration:none}
.am-cta h2.am-head a:hover{color:var(--am-blue)}
.am-cta p{margin:0 0 12px; font-size:.94rem; line-height:1.55; color:var(--am-ink)}
.am-cta .am-map{display:block; width:100%; height:auto; margin:4px 0 14px}
.am-cta ul.am-points{margin:0 0 16px; padding:0; list-style:none}
.am-cta ul.am-points li{
  position:relative; padding-left:22px; margin-bottom:8px;
  font-size:.9rem; line-height:1.45; color:var(--am-ink);
}
.am-cta ul.am-points li::before{
  content:""; position:absolute; left:0; top:.42em; width:10px; height:10px;
  border-radius:50%; background:var(--am-blue);
}
.am-cta .am-btn{
  display:block; text-align:center; padding:13px 18px; border-radius:8px;
  background:var(--am-navy); color:#fff !important; text-decoration:none;
  font-weight:700; font-size:.95rem; line-height:1.2;
  transition:background-color .15s ease, transform .15s ease;
}
.am-cta .am-btn:hover,.am-cta .am-btn:focus-visible{background:var(--am-blue); transform:translateY(-1px)}
.am-cta .am-fine{margin:10px 0 0; font-size:.78rem; color:#5d6b7a; text-align:center}