/* biboo podcast – page [biboo_podcast]. Repose sur la base .bbr (largeur, polices de la charte) ; tout est rangé sous .bbpc.
   Couleur du podcast dans la charte : lilas #AB8BC0, lilas encre #7A5AA6. */
.bbpc {
	--bbpc-lilas: #AB8BC0;
	--bbpc-lilas-hover: #BEA3D0;
	--bbpc-encre: #7A5AA6;
	--bbpc-pale: #EFE8F4;
	--bbpc-white: #fff;
}
.bbpc [hidden] { display: none !important; }
.bbpc a, .bbpc a:hover, .bbpc a:focus { color: inherit; text-decoration: none !important; box-shadow: none; }
.bbpc ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.bbpc li { margin: 0; list-style: none !important; }
.bbpc li::before { content: none; }
.bbpc img { max-width: 100%; }
.bbpc :focus-visible { outline: 3px solid var(--bbpc-encre); outline-offset: 2px; }

/* Bande du haut, bulles lilas */
.bbpc-band { background: var(--bbr-band); color: var(--bbr-band-fg); position: relative; overflow: hidden; padding-block: 56px 64px; }
.bbpc-band::before { content: ""; position: absolute; inset: 0; pointer-events: none;
	background:
		radial-gradient(circle at calc(100% + 40px) -60px, rgba(171, 139, 192, .85) 0 190px, transparent 191px),
		radial-gradient(circle at calc(100% - 250px) calc(var(--bbr-head, 0px) + 150px), rgba(28, 113, 184, .6) 0 40px, transparent 41px),
		radial-gradient(circle at calc(100% - 150px) calc(var(--bbr-head, 0px) + 230px), rgba(231, 30, 115, .75) 0 12px, transparent 13px),
		radial-gradient(circle at -60px calc(100% + 60px), rgba(0, 150, 64, .5) 0 130px, transparent 131px),
		radial-gradient(circle at 170px calc(100% - 36px), rgba(243, 146, 0, .85) 0 9px, transparent 10px); }
.bbpc-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; position: relative; }
.bbpc-hero > * { min-width: 0; }
.bbpc-eyebrow { font: 800 12px/1 var(--bbr-display); letter-spacing: .1em; text-transform: uppercase; display: flex; align-items: center; gap: 8px; color: var(--bbpc-encre); }
.bbpc-band .bbpc-eyebrow { color: var(--bbpc-lilas); }
.bbpc-eyebrow i { width: 9px; height: 9px; border-radius: 50%; background: currentColor; }
.bbpc .bbpc-h1 { font: 700 clamp(2.1rem, 5vw, 3.5rem)/1.05 var(--bbr-signature) !important; letter-spacing: -.01em !important; margin: 16px 0 0 !important; color: var(--bbr-band-fg) !important; text-transform: none !important; }
.bbpc .bbpc-h1 em { font-style: normal; color: var(--bbpc-lilas); font-family: inherit; }
.bbpc-lead { color: var(--bbr-band-muted); font-size: 1.1rem; max-width: 34em; margin: 18px 0 28px !important; }
.bbpc-lead strong, .bbpc-lead b { color: var(--bbr-band-fg); font-weight: 700; }
.bbpc-cta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.bbpc .bbpc-play { display: inline-flex; align-items: center; gap: 14px; background: var(--bbpc-lilas); color: var(--bbr-fg) !important; border-radius: 999px; padding: 8px 26px 8px 8px; font: 800 1.05rem/1.2 var(--bbr-display); cursor: pointer; transition: transform .15s, background-color .15s; }
.bbpc .bbpc-play:hover, .bbpc .bbpc-play:focus-visible { background: var(--bbpc-lilas-hover); transform: translateY(-2px); }
.bbpc-disc { width: 46px; height: 46px; border-radius: 50%; background: var(--bbr-fg); color: var(--bbpc-lilas); display: grid; place-items: center; flex: none; }
.bbpc-disc svg { width: 20px; height: 20px; }
.bbpc .bbpc-ghost { color: var(--bbr-band-fg) !important; border: 1px solid var(--bbr-band-line); border-radius: 999px; padding: 12px 20px; font: 800 .95rem var(--bbr-display); }
.bbpc .bbpc-ghost:hover { border-color: var(--bbr-band-muted); }
.bbpc-feat { background: var(--bbr-band-surface); border: 1px solid var(--bbr-band-line); border-radius: 20px; padding: 22px; display: grid; gap: 16px; }
.bbpc-label { font: 800 12px/1 var(--bbr-display); letter-spacing: .1em; text-transform: uppercase; color: var(--bbr-band-muted); }
.bbpc-feat-main { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 18px; align-items: center; }
.bbpc-feat-cover { aspect-ratio: 1; border-radius: 14px; background: #333 center / cover no-repeat; display: block; }
.bbpc .bbpc-feat h3 { font: 800 1.15rem/1.25 var(--bbr-display) !important; margin: 8px 0 0 !important; color: var(--bbr-band-fg) !important; text-transform: none !important; letter-spacing: normal !important; }
.bbpc-feat .bbpc-tag { color: var(--bbr-band-fg); }
.bbpc-sub { color: var(--bbr-band-muted); font-size: .9rem; margin-top: 6px !important; }
.bbpc-feat-player { display: flex; gap: 16px; align-items: center; }
.bbpc .bbpc-feat-play { width: 56px; height: 56px; flex: none; }
.bbpc .bbpc-feat-play::before { width: 22px; height: 22px; }
.bbpc .bbpc-feat .bbpc-feat-play:hover, .bbpc .bbpc-feat .bbpc-feat-play:focus-visible { background: var(--bbpc-lilas-hover); color: var(--bbr-fg) !important; }
.bbpc .bbpc-feat.qtmplayer-played .bbpc-feat-play, .bbpc .bbpc-feat .bbpc-feat-play.bbpc-playing { background: var(--bbr-band-fg); color: var(--bbr-fg) !important; }
.bbpc-wave { display: flex; gap: 3px; align-items: center; height: 40px; flex: 1; min-width: 0; }
.bbpc-wave b { flex: 1; background: var(--bbpc-lilas); opacity: .45; border-radius: 2px; transform-origin: center; transition: opacity .2s; }
.bbpc-feat.qtmplayer-played .bbpc-wave b, .bbpc-feat:has(.bbpc-playing) .bbpc-wave b { opacity: 1; animation: bbpc-wave .9s ease-in-out infinite alternate; }
.bbpc-wave b:nth-child(3n) { animation-delay: -.3s !important; }
.bbpc-wave b:nth-child(3n+1) { animation-delay: -.6s !important; }
.bbpc-wave b:nth-child(4n) { animation-duration: 1.2s !important; }
@keyframes bbpc-wave { from { transform: scaleY(.35); } to { transform: scaleY(1); } }
.bbpc-feat-foot { display: flex; justify-content: space-between; gap: 12px; font-size: .85rem; color: var(--bbr-band-muted); }
.bbpc-feat-foot a:hover { color: var(--bbr-band-fg); }

/* Sections */
.bbpc-head { display: flex; justify-content: space-between; align-items: end; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.bbpc .bbpc-h2 { font: 900 clamp(1.4rem, 2.6vw, 1.8rem)/1.15 var(--bbr-display) !important; margin: 8px 0 0 !important; color: var(--bbr-fg) !important; text-transform: none !important; letter-spacing: normal !important; }
.bbpc-head p { color: var(--bbr-muted); margin-top: 6px !important; max-width: 40em; }
.bbpc .bbpc-more { font: 800 .95rem var(--bbr-display); color: var(--bbpc-encre) !important; }

.bbpc-series { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 18px; }
.bbpc-serie { background: var(--bbpc-white); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--bbr-line); transition: transform .15s, border-color .15s; }
.bbpc-serie:hover { transform: translateY(-3px); border-color: var(--c); }
.bbpc-cover { aspect-ratio: 1; background: #ddd center / cover no-repeat; display: block; }
.bbpc-sbody { padding: 16px; display: grid; gap: 8px; flex: 1; align-content: start; }
.bbpc-sname { font: 900 1.05rem/1.2 var(--bbr-display); display: flex; align-items: center; gap: 8px; color: var(--bbr-fg); }
.bbpc-sname::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex: none; }
.bbpc-sdesc { color: var(--bbr-muted); font-size: .9rem; line-height: 1.45; }
.bbpc-motto { font-family: var(--bbr-signature); font-style: normal; font-weight: 700; color: var(--c); }
.bbpc-badge { justify-self: start; font: 800 .72rem/1.3 var(--bbr-body); letter-spacing: .02em; color: var(--c); background: color-mix(in srgb, var(--c) 12%, #fff); border-radius: 50px; padding: 3px 10px; }
.bbpc-badge.bbpc-muted { color: var(--bbr-muted); background: var(--bbr-bg); }
.bbpc-slast { font-size: .8rem; font-weight: 700; color: var(--bbr-fg); margin-top: auto; padding-top: 4px; }

/* Publicité */
.bbr-section.bbpc-adsec { padding-block: 24px; }
.bbpc-adsec .bbr-ad { margin-top: 0; border-top: 0; }
.bbpc-adsec:has(ins[data-ad-status="unfilled"]) { display: none; }

/* Épisodes */
.bbpc-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.bbpc .bbpc-chip:not(#bbr-a):not(#bbr-b) { font: 700 .88rem/1.3 var(--bbr-body) !important; border: 1px solid var(--bbr-line) !important; background-color: var(--bbpc-white) !important; color: var(--bbr-fg) !important; border-radius: 999px !important; padding: 8px 14px !important; margin: 0 !important; cursor: pointer; display: inline-flex !important; align-items: center; gap: 8px; height: auto !important; }
.bbpc .bbpc-chip[data-bbpc-f]:not([data-bbpc-f="all"])::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.bbpc .bbpc-chip:not(#bbr-a):not(#bbr-b):hover { border-color: var(--bbr-fg) !important; background-color: var(--bbpc-white) !important; color: var(--bbr-fg) !important; }
.bbpc .bbpc-chip.bbpc-on:not(#bbr-a):not(#bbr-b) { background-color: var(--bbr-fg) !important; border-color: var(--bbr-fg) !important; color: #fff !important; }
.bbpc .bbpc-eps { background: var(--bbpc-white); border: 1px solid var(--bbr-line); border-radius: 16px; }
.bbpc .bbpc-eps > li { display: grid; grid-template-columns: 44px 64px minmax(0, 1fr); gap: 16px; align-items: center; padding: 14px 18px; border-top: 1px solid var(--bbr-line); }
.bbpc .bbpc-eps > li.bbpc-first { border-top: 0; }
.bbpc-pbtn { width: 44px; height: 44px; border-radius: 50%; background: var(--bbpc-lilas); color: var(--bbr-fg); display: grid !important; place-items: center; cursor: pointer; position: relative; transition: background-color .15s; }
.bbpc-pbtn i { font-size: 0 !important; width: 0; height: 0; overflow: hidden; position: absolute; }
.bbpc-pbtn::before { content: ""; width: 18px; height: 18px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l10.5-6.5z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l10.5-6.5z'/%3E%3C/svg%3E") center / contain no-repeat; }
.bbpc .bbpc-pbtn:hover, .bbpc .bbpc-pbtn:focus-visible { background: var(--bbpc-encre); color: #fff !important; }
.bbpc .qtmplayer-played .bbpc-pbtn, .bbpc .bbpc-pbtn.bbpc-playing { background: var(--bbr-fg); color: var(--bbpc-lilas) !important; }
.bbpc .qtmplayer-played .bbpc-pbtn::before, .bbpc .bbpc-pbtn.bbpc-playing::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6.5' y='5' width='4' height='14' rx='1'/%3E%3Crect x='13.5' y='5' width='4' height='14' rx='1'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6.5' y='5' width='4' height='14' rx='1'/%3E%3Crect x='13.5' y='5' width='4' height='14' rx='1'/%3E%3C/svg%3E"); }
.bbpc-ecover { width: 64px; height: 64px; border-radius: 10px; background: #ddd; object-fit: cover; display: block; margin: 0 !important; }
.bbpc-ebody { min-width: 0; display: grid; gap: 4px; }
.bbpc-emeta { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: .82rem; color: var(--bbr-muted); font-variant-numeric: tabular-nums; }
.bbpc-tag { font: 800 .7rem/1 var(--bbr-display); letter-spacing: .06em; text-transform: uppercase; color: var(--bbr-fg); display: inline-flex; align-items: center; gap: 6px; }
.bbpc-tag::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.bbpc .bbpc-etitle { font: 800 1rem/1.3 var(--bbr-display); color: var(--bbr-fg) !important; }
.bbpc .bbpc-etitle:hover { color: var(--bbpc-encre) !important; }
.bbpc-loadmore { display: flex; justify-content: center; margin-top: 20px; }
.bbpc .bbpc-loadmore button:not(#bbr-a):not(#bbr-b) { font: 800 .95rem/1.2 var(--bbr-display) !important; border: 1px solid var(--bbr-fg) !important; background-color: transparent !important; color: var(--bbr-fg) !important; border-radius: 999px !important; padding: 12px 22px !important; margin: 0 !important; cursor: pointer; height: auto !important; }
.bbpc .bbpc-loadmore button:not(#bbr-a):not(#bbr-b):hover { background-color: var(--bbr-fg) !important; color: #fff !important; }

/* Autopromo */
.bbr-section.bbpc-promo { padding-block: 32px; }
.bbpc-promo .bbp-slot { max-width: 970px; margin: 0 auto; }

/* Abonnements */
.bbpc .bbpc-subs { background: var(--bbpc-white); border: 1px solid var(--bbr-line); border-radius: 16px; }
.bbpc .bbpc-subs > li { display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 14px 18px; border-top: 1px solid var(--bbr-line); }
.bbpc .bbpc-subs > li:first-child { border-top: 0; }
.bbpc-subname { font: 900 1rem var(--bbr-display); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; color: var(--bbr-fg); }
.bbpc-subname::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--c); }
.bbpc-subname small { font: 700 .75rem var(--bbr-body); color: var(--bbr-muted); }
.bbpc-subapps { display: flex; gap: 8px; flex-wrap: wrap; }
.bbpc .bbpc-subapps a { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--bbr-line); border-radius: 999px; padding: 7px 14px 7px 10px; font: 700 .85rem/1.2 var(--bbr-body); color: var(--bbr-fg) !important; }
.bbpc-subapps a svg { color: var(--bbpc-encre); flex: none; }
.bbpc .bbpc-subapps a:hover { border-color: var(--bbpc-encre); }

/* Articles */
.bbpc-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.bbpc-card { display: grid; gap: 12px; align-content: start; }
.bbpc-cimg { aspect-ratio: 16 / 10; border-radius: 14px; background: #ddd center / cover no-repeat; position: relative; display: block; transition: transform .15s; }
.bbpc-card:hover .bbpc-cimg { transform: translateY(-3px); }
.bbpc-ctag { position: absolute; left: 12px; bottom: 12px; background: var(--c); color: #fff; font: 800 .7rem/1 var(--bbr-display); letter-spacing: .06em; text-transform: uppercase; padding: 6px 10px; border-radius: 999px; }
.bbpc-ctitle { font: 800 1.02rem/1.3 var(--bbr-display); color: var(--bbr-fg); }
.bbpc-card:hover .bbpc-ctitle { color: var(--bbpc-encre); }

/* Renvoi vers la radio */
.bbr-section.bbpc-radio { background: var(--bbpc-white); }
.bbpc-radio-in { display: flex; gap: 20px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.bbpc-radio p { font: 800 1.15rem/1.3 var(--bbr-display); color: var(--bbr-fg); }
.bbpc-radio p small { display: block; font: 400 .95rem var(--bbr-body); color: var(--bbr-muted); margin-top: 4px; }
.bbpc .bbpc-radio a { display: inline-flex; align-items: center; gap: 10px; background: var(--bbr-red); color: #fff !important; border-radius: 999px; padding: 12px 22px; font: 800 1rem var(--bbr-display); transition: background-color .15s; }
.bbpc .bbpc-radio a:hover { background: var(--bbr-red-bright); }
.bbpc-radio a i { width: 9px; height: 9px; border-radius: 50%; background: #fff; }

@media (max-width: 860px) {
	.bbpc-hero { grid-template-columns: 1fr; gap: 28px; }
	.bbpc-band { padding-block: 36px 44px; }
	.bbpc .bbr-section { padding-block: 40px; }
	.bbpc-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bbpc-band::before {
		background:
			radial-gradient(circle at calc(100% + 50px) -50px, rgba(171, 139, 192, .85) 0 120px, transparent 121px),
			radial-gradient(circle at -40px calc(100% + 40px), rgba(0, 150, 64, .5) 0 80px, transparent 81px);
	}
}
@media (max-width: 620px) { .bbpc .bbpc-subs > li { flex-direction: column; align-items: flex-start; gap: 10px; } }
@media (max-width: 520px) {
	.bbpc .bbpc-eps > li { grid-template-columns: 44px minmax(0, 1fr); }
	.bbpc .bbpc-eps .bbpc-ecover { display: none; }
	.bbpc-feat-main { grid-template-columns: 88px minmax(0, 1fr); }
	.bbpc-cards { grid-template-columns: 1fr; }
	.bbpc-series { grid-template-columns: 1fr; gap: 12px; }
	.bbpc-serie { flex-direction: row; }
	.bbpc-cover { width: 96px; flex: none; aspect-ratio: 1; align-self: flex-start; margin: 12px 0 12px 12px; border-radius: 10px; }
	.bbpc-sbody { padding: 12px 14px; gap: 6px; }
	.bbpc-sdesc { font-size: .85rem; }
	.bbpc-subapps a span { display: none; }
	.bbpc .bbpc-subapps a { padding: 9px; }
}
@media (prefers-reduced-motion: reduce) { .bbpc *, .bbpc *::before, .bbpc *::after { transition: none !important; } }
