.video-carousel{padding-bottom:28px}
.video-carousel .films__head{margin-bottom:20px}
.video-carousel .films__head h2{margin-top:0}
.video-heading{display:flex;align-items:center;justify-content:center;padding:0 20px}
.video-heading h3{font-size:26px;color:#fff;margin:0 22px 0 0;flex:0 0 120px;width:120px;text-align:center}
.video-full{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;background:#fff;color:#111;border:1px solid #fff;flex:0 0 190px;width:190px;height:48px;padding:0 20px;border-radius:24px;line-height:1;white-space:nowrap;appearance:none;box-shadow:none;transition:background-color .2s}
.video-full:hover{background:#eee;color:#111;transform:none}
.video-full:focus-visible{outline:2px solid #fff;outline-offset:3px}
.video-resume{color:#fff;text-decoration:underline;font-size:13px;margin-left:18px}
.video-resume[hidden]{display:none}
.video-hint{text-align:center;color:#aaa;font-size:13px;margin:16px 20px 28px;min-height:22px}
.video-stage{position:relative}
.video-window{width:100%;overflow:hidden}
.video-track{position:relative;display:block;isolation:isolate}
.video-slide{position:relative;flex:0 0 auto;margin-left:20px;border-radius:16px;overflow:hidden;background:#151515;opacity:.4;cursor:pointer}
.video-slide:first-child{margin-left:0}
.video-slide.is-active{opacity:1;cursor:default}
.video-slide video{display:block;width:100%;height:100%;background:#111}
.video-status{position:absolute;left:12px;right:12px;bottom:16px;padding:9px 14px;border-radius:8px;color:#fff;background:rgba(0,0,0,.75);font-size:13px;text-align:center;pointer-events:none}
.video-status[hidden]{display:none}
.video-arrow{position:absolute;top:50%;margin-top:-23px;width:46px;height:46px;z-index:3;border:1px solid #777;border-radius:50%;background:rgba(0,0,0,.8);color:#fff;padding:0;display:flex;align-items:center;justify-content:center;font-size:0;line-height:normal}
.video-arrow:hover,.video-arrow:focus{background:#fff;color:#111}
.video-prev{left:22px}.video-next{right:22px}
.video-dots{display:flex;justify-content:center;padding:22px 0 0}
.video-dots button{width:30px;height:30px;padding:0;margin:0 6px;border-radius:50%;border:1px solid #666;color:#aaa;font-size:12px}
.video-dots button.is-active{background:#fff;color:#111;border-color:#fff}
@media(max-width:760px){
  .video-heading{flex-wrap:wrap}
  .video-heading h3{font-size:22px;margin-right:14px}
  .video-full{padding:10px 16px;font-size:13px}
  .video-resume{width:100%;margin:14px 0 0}
  .video-prev{left:8px}.video-next{right:8px}
  .video-arrow{width:36px;height:36px;margin-top:-18px}
  .video-status{font-size:11px;bottom:10px;padding:6px 8px}
}

.video-arrow svg{display:block;width:18px;height:18px;flex-shrink:0}

/* Every slide fills the complete section, with controls above the footage. */
.video-carousel{position:relative;height:82vh;min-height:620px;max-height:1000px;padding:0;overflow:hidden}
.video-carousel .films__head{position:absolute;top:36px;left:0;right:0;z-index:2;margin:0 auto;pointer-events:none}
.video-carousel .films__head h2{font-size:38px}
.video-heading{position:absolute;top:112px;left:0;right:0;z-index:3}
.video-hint{position:absolute;top:175px;left:15%;right:15%;z-index:2;margin:0;color:#fff;text-shadow:0 1px 4px #000}
.video-stage{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}
.video-window,.video-track{height:100%}
.video-slide{position:absolute;top:0;left:0;margin:0;border-radius:0;opacity:0;z-index:0;pointer-events:none;cursor:default;transition:opacity .4s ease}
.video-slide.is-active{opacity:1;z-index:1;pointer-events:auto}
.video-carousel:not(.is-full) .video-slide video{display:none}
@media(prefers-reduced-motion:reduce){.video-slide{transition:none}}
.video-slide video,.video-slide .video-poster{position:absolute;display:block;max-width:none;max-height:none;background:#111}
.video-slide .video-poster{z-index:1}
.video-poster-frame{position:absolute;overflow:hidden;z-index:1}
.video-poster-frame[hidden]{display:none}
.video-backdrop{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.35;pointer-events:none}
.video-carousel.is-full .video-backdrop{display:none}
.video-slide .video-poster[hidden]{display:none}
.video-slide:after{content:'';position:absolute;left:0;top:0;right:0;bottom:0;background:linear-gradient(180deg,rgba(0,0,0,.72),rgba(0,0,0,.04) 48%,rgba(0,0,0,.58));pointer-events:none;z-index:1}
.video-status{z-index:2;left:20%;right:20%;bottom:65px}
.video-dots{position:absolute;bottom:20px;left:0;right:0;z-index:3;padding:0}
.video-arrow{z-index:4}
.video-controls{position:absolute;left:12%;right:12%;bottom:65px;z-index:3;display:flex;align-items:center;padding:10px 14px;background:rgba(0,0,0,.7);border-radius:8px;color:#fff}
.video-controls[hidden]{display:none}
.video-controls button{min-width:44px;color:#fff;font-size:13px}
.video-controls input{flex:1;min-width:0;margin:0 12px}
.video-controls span{font-size:12px;white-space:nowrap;margin-right:12px}
.video-carousel.is-full .video-status{bottom:125px}
@media(max-width:760px){
 .video-carousel{height:78vh;min-height:520px;max-height:800px}
 .video-carousel .films__head{display:none}
 .video-heading{top:10px}
 .video-heading h3{font-size:16px;flex-basis:80px;width:80px;margin-right:8px}
 .video-full{flex-basis:160px;width:160px;height:40px;padding:0 12px;border-radius:20px;font-size:12px}
 .video-hint{display:none}
 .video-dots{bottom:8px}
 .video-controls{bottom:44px}
 .video-carousel .films__head{top:24px}
 .video-carousel .films__head h2{font-size:30px}
 .video-heading{top:10px}
 .video-hint{top:214px;left:15%;right:15%;font-size:12px}
 .video-status{left:12%;right:12%;bottom:65px}
 .video-controls{left:10px;right:10px;padding:10px 6px}
 .video-controls span{font-size:10px;margin-right:4px}
 .video-controls input{margin:0 6px}
}
