/*
 * BigO Core structural styles. Layout only, using neutral values.
 * The theme owns color, type and personality through these custom properties.
 */
:root {
	--bigo-gap: clamp(16px, 2vw, 28px);
	--bigo-radius: 14px;
	--bigo-card-bg: transparent;
	--bigo-accent: currentColor;
	--bigo-muted: color-mix(in srgb, currentColor 60%, transparent);
	--bigo-badge-bg: #000;
	--bigo-badge-fg: #fff;
}

/* Grids */
.bigo-grid {
	display: grid;
	gap: var(--bigo-gap);
	grid-template-columns: repeat(var(--bigo-cols, 3), minmax(0, 1fr));
}
@media (max-width: 900px) {
	.bigo-grid { grid-template-columns: repeat(min(var(--bigo-cols, 3), 2), minmax(0, 1fr)); }
}
@media (max-width: 560px) {
	.bigo-grid--episodes { grid-template-columns: 1fr; }
	.bigo-grid--guests { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Cards */
.bigo-card { background: var(--bigo-card-bg); border-radius: var(--bigo-radius); overflow: hidden; display: flex; flex-direction: column; }
.bigo-card__media { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--bigo-radius); background: color-mix(in srgb, currentColor 10%, transparent); }
.bigo-card--guest .bigo-card__media { aspect-ratio: 4 / 5; }
.bigo-card__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.bigo-card__img--empty { width: 100%; height: 100%; }
.bigo-card:hover .bigo-card__img { transform: scale(1.04); }
.bigo-card__badge { position: absolute; left: 12px; top: 12px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .06em; background: var(--bigo-badge-bg); color: var(--bigo-badge-fg); }
.bigo-card__body { padding: 14px 2px 0; }
.bigo-card__title { margin: 0 0 6px; font-size: 1.1em; line-height: 1.25; }
.bigo-card__title a { color: inherit; text-decoration: none; }
.bigo-card__meta, .bigo-card__excerpt { margin: 0; font-size: .9em; color: var(--bigo-muted); }
.bigo-card__excerpt { margin-top: 8px; }

/* Player */
.bigo-player { position: relative; aspect-ratio: 16 / 9; border-radius: var(--bigo-radius); overflow: hidden; background: #000; }
.bigo-player__poster, .bigo-player__frame { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.bigo-player__button { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; }
.bigo-player__button::before { content: ""; width: 84px; height: 84px; border-radius: 50%; background: rgba(0,0,0,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / 40px no-repeat; backdrop-filter: blur(6px); transition: transform .25s ease, background-color .25s ease; }
.bigo-player__button:hover::before, .bigo-player__button:focus-visible::before { transform: scale(1.08); background-color: var(--bigo-accent); }
.bigo-player__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Latest episode */
.bigo-latest { display: grid; gap: var(--bigo-gap); }
.bigo-latest__kicker { margin: 0; text-transform: uppercase; letter-spacing: .14em; font-size: .8em; color: var(--bigo-muted); }
.bigo-latest__title { margin: 6px 0 14px; }
.bigo-latest__title a { color: inherit; text-decoration: none; }

/* Meta line */
.bigo-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .9em; color: var(--bigo-muted); }
.bigo-meta span + span::before { content: "•"; margin-right: 14px; opacity: .6; }

/* Listen buttons */
.bigo-listen { display: flex; flex-wrap: wrap; gap: 10px; }

/* Guest links */
.bigo-guest-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.bigo-guest__role { margin: 0; width: 100%; color: var(--bigo-muted); }
.bigo-guest__link { font-weight: 600; }

/* Sponsors */
.bigo-sponsors--logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(20px, 4vw, 56px); }
.bigo-sponsors--logos .bigo-sponsor__logo { max-height: 64px; width: auto; filter: grayscale(1); opacity: .75; transition: filter .3s, opacity .3s; }
.bigo-sponsors--logos .bigo-sponsor:hover .bigo-sponsor__logo { filter: none; opacity: 1; }
.bigo-sponsors--cards { display: grid; gap: var(--bigo-gap); grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.bigo-sponsors--cards .bigo-sponsor { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 24px; border-radius: var(--bigo-radius); border: 1px solid color-mix(in srgb, currentColor 15%, transparent); text-align: center; color: inherit; text-decoration: none; }
.bigo-sponsors--cards .bigo-sponsor__logo { max-height: 80px; width: auto; }
.bigo-sponsor__name { font-weight: 700; }
.bigo-sponsor__tagline { font-size: .85em; color: var(--bigo-muted); }

/* Photo credit */
.bigo-credit p { margin: 0; font-size: .85em; }
.bigo-credit__label { text-transform: uppercase; letter-spacing: .12em; color: var(--bigo-muted); }

/* Editor-only hints */
.bigo-empty { padding: 20px; border: 1px dashed color-mix(in srgb, currentColor 35%, transparent); border-radius: var(--bigo-radius); font-size: 14px; opacity: .8; }
.bigo-empty p { margin: 0; }
.bigo-editor-placeholder { padding: 20px; border: 1px dashed #999; font-size: 13px; }

@media (prefers-reduced-motion: reduce) {
	.bigo-card__img, .bigo-player__button::before { transition: none; }
	.bigo-card:hover .bigo-card__img { transform: none; }
}