/* =====================================================================
   CNC :: article quote CTA card  |  css/cnc-cta-card.css
   ---------------------------------------------------------------------
   Shared styles for aside.artcta on Ghost-built blog articles.
   The card is a white surface with a Care Net red left accent. Inner
   padding keeps the heading, copy and button clear of that accent.

   CNC_SPOTIFY_SHOW_URL = https://open.spotify.com/show/0ZP6DDJw74CPoaaCbgRzIw
   Show name: Bee-Safe Health and Safety Newsletter Explainer Podcast
   Link text: Listen to the Bee-Safe podcast on Spotify
   Plain link only. No iframe, no embed, no third-party script.

   Brand: red #ED1B24, black #0F0F0F, white. Never gold.
   ===================================================================== */

.artcta{
  background:var(--surface,#FFFFFF);
  border:1px solid var(--line,#E5E5E5);
  border-left:4px solid var(--red,#ED1B24);
  border-radius:var(--radius-lg,12px);
  padding:30px 32px;
  margin:30px 0;
  box-shadow:var(--shadow-sm,0 1px 2px rgba(0,0,0,.05));
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.artcta b{
  display:block;
  font-family:var(--font-display,'Bebas Neue',sans-serif);
  font-weight:400;
  font-size:26px;
  letter-spacing:.02em;
  margin:0 0 12px;
  color:var(--ink,#0F0F0F);
}
.artcta p{
  color:var(--muted,#4d4d4d);
  font-size:15px;
  line-height:1.55;
  margin:0 0 16px;
}
.artcta .btn{
  text-decoration:none;
  color:#FFFFFF;
  align-self:flex-start;
}
.artcta .btn-red:hover{color:#FFFFFF}
.artcta .artcta-podcast{
  margin:18px 0 0;
  padding-top:16px;
  border-top:1px solid var(--line,#E5E5E5);
  width:100%;
  font-size:14px;
  line-height:1.45;
  color:var(--ink,#0F0F0F);
}
.artcta .artcta-podcast-heading{
  display:block;
  font-family:var(--font-display,'Bebas Neue',sans-serif);
  font-weight:400;
  font-size:20px;
  letter-spacing:.02em;
  margin:0 0 8px;
  color:var(--ink,#0F0F0F);
}
.artcta .artcta-podcast p{
  margin:0 0 10px;
  font-size:14px;
  line-height:1.45;
  color:var(--ink,#0F0F0F);
}
.artcta .artcta-podcast a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ink,#0F0F0F);
  text-decoration:underline;
  font-weight:600;
  font-family:var(--font-ui,'Montserrat',sans-serif);
  font-size:14px;
}
.artcta .artcta-podcast a:hover,
.artcta .artcta-podcast a:focus-visible{
  color:#ED1B24;
}
.artcta .artcta-podcast svg{
  flex:none;
  width:16px;
  height:16px;
}
@media (max-width:600px){
  .artcta{padding:20px}
}