.clip{position:relative;overflow:hidden;background:#0d0d0d}
.clip video,.clip img{
  object-fit:cover !important;
  object-position:center 18% !important;
}
.clip::before{
  content:"";
  position:absolute;inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to bottom,#0d0d0d 0%,rgba(13,13,13,.55) 8%,transparent 18%);
}
.clip-fade{
  height:22% !important;
  background:linear-gradient(to top,#0d0d0d 0%,rgba(13,13,13,.75) 45%,transparent 100%) !important;
  z-index:1;
}
@media (max-width:800px){
  .clip{height:70svh !important}
}

@media (min-width:801px){
  .clip video,
  .clip img,
  #vImg,
  #vImg.poster.on{
    object-fit:cover !important;
    object-position:center 18% !important;
    width:100% !important;
    height:100% !important;
    inset:0 !important;
    position:absolute !important;
  }
}

@media (min-width:801px){
  .clip::before{
    background:
      linear-gradient(to bottom,#0d0d0d 0%,rgba(13,13,13,.45) 7%,transparent 16%),
      linear-gradient(to right,#0d0d0d 0%,rgba(13,13,13,.75) 8%,transparent 18%),
      linear-gradient(to left,#0d0d0d 0%,rgba(13,13,13,.75) 8%,transparent 18%) !important;
  }
}
@media (max-width:800px){
  .clip video, .clip img, #vImg {
    object-fit: cover !important;
  }
}

/* FINAL: mobile cover */
@media (max-width:800px){
  .rest{padding-left:0 !important;padding-right:0 !important}
  .clip{
    width:100% !important;
    height:100svh !important;
    min-height:100svh !important;
    border-radius:0 !important;
  }
  .clip video,
  .clip img,
  #vImg,
  #vImg.poster.on{
    object-fit:cover !important;
    object-position:center 18% !important;
    width:100% !important;
    height:100% !important;
    inset:0 !important;
    left:0 !important;
    top:0 !important;
    transform:none !important;
    position:absolute !important;
  }
}

@media (min-width:801px){
  .clip::before{
    background:
      linear-gradient(to bottom,#0d0d0d 0%,rgba(13,13,13,.4) 7%,transparent 16%),
      linear-gradient(to right,#0d0d0d 0%,rgba(13,13,13,.8) 9%,transparent 20%),
      linear-gradient(to left,#0d0d0d 0%,rgba(13,13,13,.8) 9%,transparent 20%) !important;
  }
}

@media (min-width:801px){
  .hero{
    background-image:url("/img/hero.jpg") !important;
    background-size:84% 86% !important;
    background-position:center 12% !important;
  }
  .clip::before{background:none !important}
  .clip-fade{display:none !important}
}

.hero{
  background-image:url("/img/hero.jpg") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

.hero{
  background-image:
    linear-gradient(to bottom,#0d0d0d 0%,rgba(13,13,13,.7) 7%,transparent 16%,transparent 78%,rgba(13,13,13,.85) 90%,#0d0d0d 100%),
    linear-gradient(to right,#0d0d0d 0%,rgba(13,13,13,.55) 5%,transparent 12%),
    linear-gradient(to left,#0d0d0d 0%,rgba(13,13,13,.55) 5%,transparent 12%),
    url("/img/hero.jpg") !important;
  background-size:auto,auto,auto,84% 86% !important;
  background-position:center,center,center,center 12% !important;
  background-repeat:no-repeat !important;
}
@media (max-width:800px){
  .hero{
    background-size:auto,auto,auto,94% 90% !important;
    background-position:center,center,center,center top !important;
  }
}

.hero{
  background-size:auto,auto,auto,88% 100% !important;
  background-position:center,center,center,center center !important;
}
@media (min-width:801px){
  .hero{background-size:auto,auto,auto,84% 100% !important}
}
@media (max-width:800px){
  .hero{background-size:auto,auto,auto,94% 100% !important}
}

.hero{
  background-size:cover !important;
  background-position:center 12% !important;
  background-repeat:no-repeat !important;
}
@media (max-width:800px){
  .hero{background-position:center top !important}
}

.rest{
  margin-top:12vh !important;
  padding-top:4vh !important;
}
.clip video,
.clip img,
#vImg{
  object-position:center 28% !important;
}
@media (max-width:800px){
  .rest{margin-top:8vh !important;padding-top:2vh !important}
  .clip video,.clip img,#vImg{object-position:center 22% !important}
}

.hero{
  background-image:
    linear-gradient(to right,#0d0d0d 0%,rgba(13,13,13,.55) 5%,transparent 12%),
    linear-gradient(to left,#0d0d0d 0%,rgba(13,13,13,.55) 5%,transparent 12%),
    url("/img/hero.jpg") !important;
}
.hero::after{display:none !important;content:none !important;background:none !important}

.hero{margin-bottom:0 !important}
.page-bridge{
  height:18vh;
  background:linear-gradient(to bottom,#0d0d0d 0%,#000 40%,#000 60%,#0d0d0d 100%);
  pointer-events:none;
}
.rest{margin-top:0 !important;scroll-margin-top:0}
html{scroll-behavior:smooth}

.hero{
  -webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 72%,transparent 100%);
}
.rest{opacity:0}

.hero-copy,
.hero-actions,
.hero .btn,
.float-wrap,
.logo,
.topnav{
  position:relative;
  z-index:8 !important;
}
.hero .btn{z-index:9 !important}
.rest{opacity:0}

.hero{opacity:1 !important}
.hero-dim{
  position:absolute;inset:0;z-index:1;
  background:#0d0d0d;opacity:0;pointer-events:none;
}
.hero-copy,.hero-actions,.hero .btn,.float-wrap,.logo,.topnav{
  position:relative;z-index:8 !important;
  opacity:1 !important;
}

.hero-copy-fixed{
  position:fixed !important;
  left:0;right:0;bottom:0;
  z-index:30 !important;
  padding:0 6% 2.2vh;
  pointer-events:none;
  opacity:1 !important;
}
.hero-copy-fixed .btn,
.hero-copy-fixed a{pointer-events:auto}
body.ms-page2 .hero-copy-fixed{opacity:0 !important;pointer-events:none !important}

#wave, .hero-copy-fixed #wave, .hero-copy #wave{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  left:0 !important;
  display:block !important;
}
.page-bridge{height:9vh !important}
.rest{margin-top:0 !important;padding-top:2vh !important}
.hero-copy-fixed.early-hide{
  opacity:0 !important;
  pointer-events:none !important;
  transition:opacity .25s ease;
}

.clip{position:relative}
.clip::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  left:0;right:0;top:0;
  height:28%;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(to bottom,
    #0d0d0d 0%,
    rgba(13,13,13,.88) 22%,
    rgba(13,13,13,.45) 55%,
    transparent 100%) !important;
}

.clip{position:relative}
.clip::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  left:0;right:0;top:0;
  height:28%;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(to bottom,
    #0d0d0d 0%,
    rgba(13,13,13,.88) 22%,
    rgba(13,13,13,.45) 55%,
    transparent 100%) !important;
}

.clip{position:relative}
.clip::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  left:0;right:0;top:0;
  height:28%;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(to bottom,
    #0d0d0d 0%,
    rgba(13,13,13,.88) 22%,
    rgba(13,13,13,.45) 55%,
    transparent 100%) !important;
}

.clip{position:relative}
.clip::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  left:0;right:0;top:0;
  height:28%;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(to bottom,
    #0d0d0d 0%,
    rgba(13,13,13,.88) 22%,
    rgba(13,13,13,.45) 55%,
    transparent 100%) !important;
}

.page-bridge{
  height:14vh !important;
  background:#000 !important;
}
.hero{
  box-shadow:inset 0 -80px 80px 20px #000;
}
.hero::after{
  content:"" !important;
  display:block !important;
  position:absolute;
  left:0;right:0;bottom:0;
  height:22vh;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.75) 45%,#000 100%) !important;
}
.clip::before{
  height:36% !important;
  background:linear-gradient(to bottom,
    #000 0%,
    rgba(0,0,0,.92) 28%,
    rgba(13,13,13,.5) 62%,
    transparent 100%) !important;
}
.rest{background:#000 !important}

.page-bridge{
  height:4vh !important;
  background:#000 !important;
}
.hero{
  margin-bottom:0 !important;
  box-shadow:none !important;
}
.hero::after{
  height:10vh !important;
  background:linear-gradient(to bottom,transparent 0%,#000 100%) !important;
}
.clip::before{
  height:14% !important;
  background:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.7) 40%,transparent 100%) !important;
}
.rest{
  margin-top:0 !important;
  padding-top:0 !important;
  background:#000 !important;
}
.hero,.rest,.page-bridge{border:0 !important;outline:0 !important}

@media (min-width:801px){
  .clip{
    height:calc(100vh - 20px) !important;
    min-height:calc(100vh - 20px) !important;
    max-height:calc(100svh - 20px) !important;
  }
}
@media (max-width:800px){
  .clip{
    height:calc(100svh - 20px) !important;
    min-height:calc(100svh - 20px) !important;
  }
}

.clip{position:relative !important}
#spkBtn, #spkBtn.spk, .spk,
#playBtn, #pauseBtn, #stopBtn,
.ms-ctl, .playbtn{
  position:absolute !important;
  right:22px !important;
  bottom:22px !important;
  top:auto !important;
  left:auto !important;
  z-index:25 !important;
}
.rest > #spkBtn,
.rest > .spk{
  position:absolute !important;
}

.clip{overflow:hidden;position:relative !important}
body.ms-page2 #playBtn,
body.ms-page2 #playBtn.ms-ctl,
body.ms-page2 #playBtn.show{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  position:absolute !important;
  right:18px !important;
  bottom:18px !important;
  left:auto !important;
  top:auto !important;
  width:46px !important;
  height:46px !important;
  z-index:80 !important;
  margin:0 !important;
  background:transparent !important;
  border:1px solid rgba(255,255,255,.7) !important;
  border-radius:50% !important;
  color:#fff !important;
  pointer-events:auto !important;
}

.clip{position:relative !important;overflow:visible}
body.ms-page2 .ms-ctl,
body.ms-page2 #playBtn,
body.ms-page2 #iiBtn,
body.ms-page2 #pauseBtn,
body.ms-page2 #stopBtn,
body.ms-page2 #spkBtn{
  visibility:visible !important;
  opacity:1 !important;
  z-index:80 !important;
  width:46px !important;
  height:46px !important;
  border:1px solid rgba(255,255,255,.7) !important;
  border-radius:50% !important;
  color:#fff !important;
  background:transparent !important;
  pointer-events:auto !important;
}
body.ms-page2 .ms-ctl.show,
body.ms-page2 #playBtn.show,
body.ms-page2 #iiBtn.show,
body.ms-page2 #pauseBtn.show,
body.ms-page2 #stopBtn.show,
body.ms-page2 #spkBtn.show{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

#playBtn, #iiBtn, #pauseBtn, #stopBtn, #spkBtn, .ms-ctl{
  display:none !important;
}
#playBtn.show, #iiBtn.show, #pauseBtn.show, #stopBtn.show, #spkBtn.show, .ms-ctl.show{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:absolute !important;
  right:18px !important;
  left:auto !important;
  top:auto !important;
  width:46px !important;
  height:46px !important;
  z-index:80 !important;
  border:1px solid rgba(255,255,255,.7) !important;
  border-radius:50% !important;
  color:#fff !important;
  background:rgba(0,0,0,.25) !important;
}

.page3{height:auto;min-height:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;background:#0d0d0d}
.p3-track{display:flex;width:300vw;height:auto;align-items:stretch}
.p3-slide{flex:0 0 100vw;height:auto;padding:28px 0 36px;scroll-snap-align:start;display:flex;align-items:center;justify-content:center}
.p3-slide figure{margin:0;width:70%;max-width:1100px}
.p3-slide img{border-radius:28px;display:block;width:100%;height:min(78vh,820px);object-fit:cover;background:#222;border-radius:0}
.p3-slide figcaption{padding:16px 4px 0;color:#ddd}
.p3-more{color:#ffd000}
@media (max-width:400px){
  .p3-slide figure{width:90%;max-width:none}
  .p3-slide img{border-radius:28px;height:min(62vh,520px);border-radius:0}
}


.p3-slide figure{position:relative}
.p3-slide figcaption{
  position:static;
  padding:14px 4px 0;
  background:none;
  color:#ddd;
}
.p3-slide figcaption p{margin:0 0 10px;font-size:1.12rem;line-height:1.45}
.p3-more{
  display:inline-block;padding:8px 16px;border-radius:8px;
  background:#ffd000;color:#111;font-weight:700;text-decoration:none;
}

@media (max-width:700px){
  .p3-slide figure{width:100%;max-width:none}
  .p3-slide img{border-radius:28px;height:min(68vh,720px)}
}

.p3-slide img{border-radius:28px !important}

.p3-slide figure{position:relative;width:100%;max-width:none}
.p3-slide img{width:100%;height:min(78vh,860px);object-fit:cover;border-radius:0 !important}
.p3-slide figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:22px 28px 28px;
  background:linear-gradient(transparent,rgba(0,0,0,.75));
  color:#fff;
}
@media (max-width:700px){
  .p3-slide figure{width:100%}
  .p3-slide img{height:min(68vh,720px);border-radius:0 !important}
}

.p3-slide{padding:0}
.p3-slide img{height:92vh;max-height:none;object-fit:cover;object-position:center 28%}
@media (max-width:700px){
  .p3-slide img{height:82vh;object-position:center 30%}
}

@media (max-width:700px){
  .p3-slide figcaption{bottom:12px;padding-bottom:36px}
}
