/* Layout only; type and brand colours inherit the site's Divi/child theme. */
.df-video-container { padding-block: 3rem; }
.df-video-channel h1 { margin-bottom: 1rem; overflow-wrap: anywhere; }
.df-video-channel a:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
.df-video-breadcrumb { margin-bottom: 1rem; }
.df-video-player { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #000; }
.df-video-embed { aspect-ratio: 16 / 9; }
.df-video-embed iframe { width: 100%; height: 100%; border: 0; }
.df-video-details { max-width: 75ch; margin-top: 1.5rem; overflow-wrap: anywhere; }
.df-video-categories { display: flex; gap: .75rem 1.5rem; flex-wrap: wrap; margin-block: 1rem 2rem; }
.df-video-categories a { display: inline-block; padding-block: .4rem; }
.df-video-categories a[aria-current="page"] { font-weight: bold; text-decoration: underline; text-underline-offset: .3em; }
.df-video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
.df-video-card { min-width: 0; }
.df-video-card > a { display: flex; flex-direction: column; height: 100%; border: 1px solid #ddd; color: inherit; }
.df-video-card > a:hover { background: #f5f5f5; }
.df-video-card__media { position: relative; aspect-ratio: 16 / 9; background: #222; overflow: hidden; }
.df-video-card__media img { display: block; width: 100%; height: 100%; object-fit: contain; }
.df-video-card__play { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%); color: #fff; background: #000b; border-radius: 50%; width: 3rem; height: 3rem; display: grid; place-items: center; }
.df-video-card__duration { position: absolute; right: .5rem; bottom: .5rem; background: #000b; color: #fff; padding: .15rem .5rem; }
.df-video-card__body { padding: 1.25rem; display: flex; flex-direction: column; flex: 1; }
#page-container #main-content .df-video-card h2,
#page-container #main-content .df-video-card h3 { font-size: 1.5rem; overflow-wrap: anywhere; }
.df-video-card__cta { margin-top: auto; padding-top: 1rem; text-decoration: underline; text-underline-offset: .2em; }
.df-video-transcript { margin-top: 2rem; }
.df-video-transcript__note { font-size: .875em; font-style: italic; }
@media (max-width: 980px) { .df-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .df-video-grid { grid-template-columns: minmax(0, 1fr); } .df-video-container { padding-block: 2rem; } }
/* Divi reserves a sidebar divider on native templates; this view is full width. */
#main-content .df-video-container::before { display: none; }
.df-video-channel .pagination { margin-top: 2rem; }

/* Watch pages: a two-thirds player column and a readable transcript beside it. */
.single-gk_content_item .df-video-container { max-width: 1600px; }
.df-video-watch-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: clamp(2rem, 3vw, 3rem); align-items: start; }
.df-video-stage { min-width: 0; position: relative; }
.df-video-watch-layout .df-video-details { margin-top: 0; min-width: 0; max-width: none; }
.df-video-watch-layout .df-video-categories { margin-top: 0; margin-bottom: 1.25rem; }
#page-container #main-content .df-video-transcript h2 { font-size: clamp(1.5rem, 2vw, 2rem); }
.df-video-transcript > p:not(:last-child) { margin-bottom: 1em; padding-bottom: 0; }
.df-video-sound { position: absolute; top: .75rem; left: .75rem; padding: .55rem .8rem; border: 1px solid #fff; border-radius: .2rem; background: #171717; color: #fff; font: inherit; font-size: .875rem; line-height: 1.3; cursor: pointer; }
.df-video-sound[hidden] { display: none; }
.df-video-sound:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 980px) { .df-video-watch-layout { grid-template-columns: minmax(0, 1fr); } }

.df-video-suggestions { margin-top: clamp(3rem, 5vw, 5rem); padding-top: 2.5rem; border-top: 1px solid #ddd; }
.df-video-suggestions > h2 { margin-bottom: 1.5rem; }

/* Match the 8px corners on the testimonial carousel. */
.df-video-channel { --democracy-fitness-media-radius: 8px; }
.df-video-player,
.df-video-embed { border-radius: var(--democracy-fitness-media-radius); }
.df-video-embed { overflow: hidden; }
.df-video-card > a { border-radius: var(--democracy-fitness-media-radius); }
.df-video-card__media { border-radius: calc(var(--democracy-fitness-media-radius) - 1px) calc(var(--democracy-fitness-media-radius) - 1px) 0 0; }
.df-video-player:fullscreen { border-radius: 0; }
.df-video-player:-webkit-full-screen { border-radius: 0; }