/* CG152 · the podcasts on the Group site. cultureai.com's follow row (follow-b287.css) and its episode art, in the Group's
   tokens: the official Spotify and Apple Podcasts marks untouched as quiet buttons, the newest Lab episode's art with its
   number, and a compact Listen strip on the home. cultureai.com stays the place to read and listen. */

/* ---------- the follow row ---------- */
.px-follow{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:22px 0 0;font-family:var(--px-sans)}
.px-follow .px-fl{font:500 14px/1.2 var(--px-sans);color:var(--px-mute);margin-right:4px}
.px-fbtn{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 16px 0 13px;border-radius:999px;background:#fff;color:#0a1633;
  font:500 15px/1 var(--px-sans);text-decoration:none;box-shadow:0 0 0 1px #0a16331a,0 1px 2px #0a16330f;transition:box-shadow .15s,transform .15s}
.px-fbtn svg{width:20px;height:20px;flex:none;display:block}
.px-fbtn:hover{box-shadow:0 0 0 1px #0a16332e,0 4px 12px #0a16331a}
.px-fbtn:focus-visible{outline:3px solid #1559F5;outline-offset:2px}
a.px-fbtn,a.px-fbtn:visited,a.px-fbtn:hover,.prose a.px-fbtn{color:#0a1633!important;text-decoration:none!important;border-bottom:0!important;background-image:none!important}

/* ---------- the episode art: the cover is the card ---------- */
.tg-ep{display:grid;grid-template-columns:160px minmax(0,1fr);gap:20px;align-items:center;margin:32px 0 0;color:inherit;text-decoration:none}
.tg-ep img{width:100%;height:auto;aspect-ratio:1;border-radius:14px;display:block;box-shadow:0 0 0 1px #0a163314,0 18px 36px -24px #0b153059;transition:transform .25s var(--ease-out,ease)}
.tg-ep-tx{display:grid;gap:6px;align-content:center}
.tg-ep-k{font:500 11px/1.3 var(--px-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--px-mute)}
.tg-ep-t{font:480 23px/1.15 var(--px-serif);letter-spacing:-.012em;color:var(--px-ink);text-wrap:balance}
.tg-ep-go{font:500 14px/1.3 var(--px-sans);color:var(--px-blue);margin-top:4px}
.tg-ep:hover img{transform:translateY(-2px)}
.tg-ep:hover .tg-ep-go{text-decoration:underline;text-underline-offset:4px}
.tg-ep:focus-visible{outline:3px solid #1559F5;outline-offset:6px;border-radius:16px}
.tg-whead .tg-ep{grid-template-columns:120px minmax(0,1fr);gap:18px;max-width:420px}
.tg-whead .tg-ep-t{font-size:21px}
.tg-ep-go{white-space:nowrap}
.tg-whead .px-follow{margin-top:20px}
.tg-whead .px-follow .px-fl{width:100%;margin:0 0 2px}

/* ---------- the home: a compact Listen strip, one solid surface ---------- */
.tg-listen{display:grid;grid-template-columns:120px minmax(0,1fr) auto;grid-template-areas:"art tx f" "art two two";gap:6px 28px;align-items:center;
  margin:clamp(48px,6vw,72px) 0 0;padding:24px 28px;border-radius:20px;background:var(--px-card);box-shadow:var(--sh-hi),var(--sh-1)}
.tg-listen .tg-ep-art{grid-area:art;margin:0;display:block;align-self:start}
.tg-listen .tg-ep-art img{border-radius:12px}
.tg-listen-tx{grid-area:tx;min-width:0}
.tg-listen-k{font:500 11px/1.3 var(--px-mono)!important;letter-spacing:.1em;text-transform:uppercase;color:var(--px-blue)!important;margin:0 0 6px!important}
.tg-listen-t{font:480 26px/1.15 var(--px-serif)!important;letter-spacing:-.015em;margin:0!important;text-wrap:balance}
.tg-listen-t a{color:var(--px-ink);text-decoration:none}
.tg-listen-t a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px}
.tg-listen-d{font:400 15px/1.5 var(--px-sans)!important;color:var(--px-char)!important;margin:8px 0 0!important}
.tg-listen-d a{color:var(--px-ink);text-underline-offset:3px}
.tg-listen-f{grid-area:f;margin:0;justify-content:flex-end}
.tg-listen-2{grid-area:two;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;margin-top:16px;padding-top:16px;border-top:1px solid var(--px-line)}
.tg-listen-2 .tg-listen-d{margin:0!important}
.tg-listen-2 .px-follow{margin:0}
.tg-listen-2 .px-fbtn{min-height:44px;font-size:14px}

/* ---------- the letter: under the player ---------- */
.prose .tg-lfollow{margin:-8px 0 40px}

/* ---------- the footer: LinkedIn and the Lab, under the motto ---------- */
.tg-ft-follow{margin-top:24px;gap:8px}
.tg-ft-follow .px-fbtn{font-size:14px;padding:0 14px 0 11px}
.tg-ft-follow .px-fbtn svg{width:18px;height:18px}

@media (max-width:1000px){
  .tg-listen{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"art tx" "f f" "two two";gap:16px 20px}
  .tg-listen-f{justify-content:flex-start}
}
@media (max-width:640px){
  .px-follow{gap:8px}
  .px-follow .px-fl{width:100%;margin:0 0 2px}
  .px-fbtn{font-size:14px;padding:0 14px 0 11px}
  .tg-ep{grid-template-columns:112px minmax(0,1fr);gap:16px}
  .tg-ep-t{font-size:21px}
  .tg-listen{grid-template-columns:84px minmax(0,1fr);padding:20px;border-radius:18px;margin-left:calc(var(--px-gut) * -.25);margin-right:calc(var(--px-gut) * -.25)}
  .tg-listen-t{font-size:22px!important}
  .tg-listen-2{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.px-fbtn,.tg-ep img{transition:none}.tg-ep:hover img{transform:none}}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .px-fbtn{background:var(--px-card);box-shadow:0 0 0 1px var(--px-line2)}
  :root:not([data-theme="light"]) a.px-fbtn,:root:not([data-theme="light"]) a.px-fbtn:visited,:root:not([data-theme="light"]) a.px-fbtn:hover{color:var(--px-ink)!important}
  :root:not([data-theme="light"]) .px-fbtn:hover{box-shadow:0 0 0 1px var(--px-mute)}
  :root:not([data-theme="light"]) .tg-ep img{box-shadow:0 0 0 1px #ffffff1a}
  :root:not([data-theme="light"]) .tg-ep-go{color:#8fb0ff}
  :root:not([data-theme="light"]) .tg-listen{background:var(--px-card);box-shadow:0 0 0 1px var(--px-line)}
  :root:not([data-theme="light"]) .tg-listen-k{color:#8fb0ff!important}
}
@media print{.px-follow,.tg-listen{display:none!important}}
