.work-showcase {
  padding-bottom:130px
}
.showcase-head {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  align-items:end;
  gap:80px;
  margin-bottom:46px
}
.showcase-head h2 {
  margin:0
}
.showcase-head p {
  color:#a9a9af;
  max-width:520px;
  margin:0 0 .7rem
}
.work-slider {
  position:relative
}
.work-slides {
      height: 463px;
  position:relative;
  overflow:hidden;
  background:#151518
}
.work-slide {
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transform:scale(1.025);
  transition:opacity .65s ease,transform 1.1s ease,visibility .65s
}
.work-slide.active {
  opacity:1;
  visibility:visible;
  transform:scale(1);
  z-index:1
}
.work-slide>img {
  width:100%;
  height:100%;
  object-fit:cover
}
.work-slide:after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.72),transparent 55%),linear-gradient(0deg,rgba(0,0,0,.82),transparent 55%)
}
.slide-caption {
  position:absolute;
  z-index:2;
  left:48px;
  right:48px;
  bottom:42px;
  display:grid;
  grid-template-columns:90px 1fr;
  align-items:end;
  color:#fff
}
.slide-caption>span {
  font-size:.7rem;
  letter-spacing:.15em;
  color:#bbb
}
.slide-caption small {
  color:#ff6f76;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:900
}
.slide-caption h3 {
  font-size:clamp(2.5rem,5vw,5rem);
  margin:.25rem 0
}
.slide-caption p {
  color:#ddd;
  margin:0
}
.slider-controls {
  position:absolute;
  z-index:4;
  right:28px;
  bottom:-34px;
  background:#fff;
  display:flex;
  align-items:center;
  box-shadow:0 16px 35px rgba(0,0,0,.28)
}
.slider-arrow {
  width:68px;
  height:68px;
  border:0;
  background:#fff;
  color:#111;
  font-size:1.4rem;
  transition:.25s
}
.slider-arrow:hover,.slider-arrow:focus-visible {
  background:var(--red);
  color:#fff
}
.slider-dots {
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 20px
}
.slider-dots button {
  width:28px;
  height:3px;
  border:0;
  padding:0;
  background:#d0d0d0;
  transition:.3s
}
.slider-dots button.active {
  width:50px;
  background:var(--red)
}
 .booking-process {
  background:#f5f4f1
}
.booking-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid #cfcec9;
  border-bottom:1px solid #cfcec9
}
.booking-grid article {
  padding:46px 42px;
  border-right:1px solid #cfcec9
}
.booking-grid article:last-child {
  border-right:0
}
.booking-grid article>span {
  display:inline-flex;
  width:42px;
  height:42px;
  align-items:center;
  justify-content:center;
  background:#111;
  color:#fff;
  font-weight:900;
  font-size:.72rem;
  margin-bottom:45px
}
.booking-grid article:nth-child(2)>span {
  background:var(--red)
}
.booking-grid h3 {
  font-size:1.75rem
}
.booking-grid p {
  color:#666;
  margin:0
}
.availability-band {
  background:linear-gradient(105deg,#121214 0 62%,#e20d17 62%);
  color:#fff;
  padding:90px 0
}
.availability-band .container-xl {
  display:grid;
  grid-template-columns:1fr 400px;
  gap:100px;
  align-items:center
}
.availability-copy {
  max-width:680px
}
.availability-copy h2 {
  margin-bottom:1rem
}
.availability-copy p {
  color:#b7b7bb
}
.hours-card {
  background:#fff;
  color:#111;
  padding:40px;
  box-shadow:0 20px 55px rgba(0,0,0,.28)
}
.hours-card small {
  display:block;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:#888;
  font-weight:900
}
.hours-card>strong {
  display:block;
  font:900 3.5rem/1 Impact,Arial,sans-serif;
  margin:14px 0 4px
}
.hours-card>span {
  color:#666
}
.hours-card>a {
  display:flex;
  justify-content:space-between;
  color:#fff;
  background:#111;
  margin:28px -40px -40px;
  padding:22px 40px;
  font-weight:900;
  font-size:1.2rem
}
.hours-card>a:hover {
  background:var(--red)
}
 @media(max-width:1199px) {
  .work-slides {
    height:610px
  }
  .availability-band .container-xl {
    gap:55px
  }
}
 @media(max-width:991px) {
  .showcase-head {
    grid-template-columns:1fr;
    gap:20px
  }
  .work-slides {
    height:560px
  }
  .booking-grid {
    grid-template-columns:1fr
  }
  .booking-grid article {
    border-right:0;
    border-bottom:1px solid #cfcec9
  }
  .availability-band {
    background:#121214
  }
  .availability-band .container-xl {
    grid-template-columns:1fr;
    gap:45px
  }
  .hours-card {
    max-width:520px
  }
}
 @media(max-width:767px) {
  .work-showcase {
    padding-bottom:105px
  }
  .work-slides {
    height:470px
  }
  .slide-caption {
    left:24px;
    right:24px;
    bottom:30px;
    display:block
  }
  .slide-caption>span {
    display:block;
    margin-bottom:12px
  }
  .slide-caption h3 {
    font-size:2.8rem
  }
  .slide-caption p {
    font-size:.85rem;
    max-width:280px
  }
  .slider-controls {
    right:12px;
    bottom:-28px
  }
  .slider-arrow {
    width:56px;
    height:56px
  }
  .slider-dots {
    padding:0 12px
  }
  .slider-dots button {
    width:18px
  }
  .slider-dots button.active {
    width:30px
  }
  .booking-grid article {
    padding:35px 25px
  }
  .booking-grid article>span {
    margin-bottom:25px
  }
  .availability-band {
    padding:70px 0
  }
  .hours-card {
    padding:30px
  }
  .hours-card>strong {
    font-size:3rem
  }
  .hours-card>a {
    margin:25px -30px -30px;
    padding:20px 30px
  }
}
 @media(max-width:430px) {
  .work-slides {
    height:420px
  }
  .slider-dots {
    display:none
  }
  .slide-caption h3 {
    font-size:2.4rem
  }
}
 /* Premium showcase composition */ .work-showcase {
  position:relative;
  background:#09090b;
  padding-top:130px
}
.work-showcase:before {
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:32%;
  height:7px;
  background:var(--red)
}
.showcase-head {
  position:relative;
  grid-template-columns:minmax(0,1fr) 470px;
  gap:110px;
  align-items:center;
  margin-bottom:64px
}
.showcase-head:after {
  content:"";
  position:absolute;
  left:55%;
  top:0;
  bottom:0;
  width:1px;
  background:#2b2b2f
}
.showcase-head .eyebrow {
  margin-bottom:20px
}
.showcase-head h2 {
  font-size:clamp(3.8rem,6.4vw,5rem);
  line-height:.82;
  letter-spacing:-.045em
}
.showcase-message {
  position:relative;
  padding-left:10px
}
.showcase-message>strong {
  display:block;
  font:900 5.4rem/.85 Impact,"Arial Narrow",sans-serif;
  color:#fff;
  letter-spacing:-.04em
}
.showcase-message>strong sup {
  font-size:1.8rem;
  color:var(--red);
  vertical-align:top;
  margin-left:4px
}
.showcase-message>span {
  display:block;
  margin:14px 0 24px;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:.7rem;
  font-weight:900
}
.showcase-message p {
  color:#99999f;
  line-height:1.75;
  margin:0 0 25px
}
.showcase-message a {
  display:inline-flex;
  align-items:center;
  gap:35px;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.7rem;
  font-weight:900;
  border-bottom:2px solid var(--red);
  padding-bottom:9px
}
.showcase-message a b {
  color:var(--red);
  font-size:1.1rem;
  transition:transform .25s
}
.showcase-message a:hover b {
  transform:translateX(5px)
}
 @media(max-width:991px) {
  .work-showcase {
    padding-top:90px
  }
  .showcase-head {
    grid-template-columns:1fr 360px;
    gap:55px
  }
  .showcase-head:after {
    left:53%
  }
  .showcase-head h2 {
    font-size:4.4rem
  }
  .showcase-message>strong {
    font-size:4rem
  }
}
 @media(max-width:767px) {
  .work-showcase {
    padding-top:75px
  }
  .showcase-head {
    display:grid;
    grid-template-columns:1fr;
    gap:35px;
    margin-bottom:45px
  }
  .showcase-head:after {
    display:none
  }
  .showcase-head h2 {
    font-size:3.2rem
  }
  .showcase-message {
    border-left:3px solid var(--red);
    padding-left:22px
  }
  .showcase-message>strong {
    font-size:3.8rem
  }
  .showcase-message>span {
    margin-bottom:15px
  }
  .showcase-message p {
    font-size:.9rem
  }
}
.home-hero {
  background-image:linear-gradient(90deg,rgba(5,5,7,.76) 0%,rgba(5,5,7,.48) 46%,rgba(5,5,7,.12) 100%),url('../images/background-2.jpg');
  background-position:center,center;
  background-size:100% 100%,cover;
  background-repeat:no-repeat,no-repeat
}
@media(max-width:767px) {
  .home-hero {
    background-image:linear-gradient(90deg,rgba(5,5,7,.72),rgba(5,5,7,.34)),url('../images/background-2.jpg');
    background-position:center,58% center
  }
}
