/* /cocktail-recipes: split banner (copy left, dimmed bottle photo right) and the three-column cocktail grid. */
.recipes-hero{position:relative;display:flex}
.recipes-hero__copy{width:50%;padding:336px 80px 0 var(--pad)}
.recipes-hero h1{max-width:630px;margin-bottom:40px;font-size:min(var(--h1),calc(92vw/var(--fit,1)))}
.recipes-hero h2{margin-bottom:40px}
.recipes-hero h2 span{display:block}
.recipes-hero__arrow{width:152px;height:auto}
.recipes-hero__zigzag{position:absolute;top:50%;left:50%;z-index:1;width:min(12%,192px);height:auto;transform:translate(-50%,-50%)}
.recipes-hero__photo{position:relative;width:50%;height:1052px}
.recipes-hero__photo img{width:100%;height:100%;object-fit:cover}
.recipes-hero__photo::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5)}

.recipes-list{padding-top:100px;padding-bottom:200px}
.recipes-list h2{padding-bottom:112px;text-align:center}
/* As on live: cards cap at 500px. The first row spreads to the gutters, the second sits in 1200px and the third is centred. */
.cocktail-row{display:grid;grid-template-columns:repeat(3,minmax(0,500px));justify-content:space-between;gap:40px;margin-bottom:40px}
.cocktail-row--narrow{max-width:1200px;margin-inline:auto}
.cocktail-row:last-child{max-width:1580px;margin-inline:auto}
.cocktail-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;color:var(--text);text-align:center}
.cocktail-card__spray{position:absolute;top:40px;left:50%;z-index:0;width:min(483px,100%);height:auto;transform:translateX(-50%)}
.cocktail-card__img{position:relative;width:100%;max-width:400px;height:auto;margin:0 auto 32px;opacity:.86}
.cocktail-card--bison-whisper-sour .cocktail-card__img{margin-top:80px}
.cocktail-card__name{position:relative;font:400 var(--t24)/1.3 var(--display);text-transform:uppercase}
.cocktail-card:focus-visible{outline-offset:6px}

@media (min-width:1600px){.recipes-hero h1,.recipes-hero h2,.cocktail-row{margin-bottom:80px}}
@media (max-width:1199px){
  .recipes-hero__copy{padding-top:236px}
  .recipes-hero h1,.recipes-hero h2,.cocktail-row{margin-bottom:46px}
  .recipes-hero__arrow{width:112px}
  .recipes-hero__photo{height:680px}
  .recipes-list{padding-top:102px;padding-bottom:124px}
}
@media (max-width:991px){
  .recipes-hero__copy{padding-top:176px;padding-right:60px}
  .recipes-hero__photo{height:580px}
  .recipes-list{padding-top:76px;padding-bottom:96px}
  .recipes-list h2{padding-bottom:64px}
}
@media (max-width:767px){
  .recipes-hero{flex-direction:column}
  .recipes-hero__copy{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;padding:164px 4% 0;text-align:center}
  .recipes-hero h1{max-width:none;margin-bottom:102px}
  .recipes-hero h2{max-width:320px;margin:0 auto}
  .recipes-hero__arrow,.recipes-hero__zigzag{display:none}
  .recipes-hero__photo{width:100%;height:520px}
  .cocktail-row{grid-template-columns:1fr;gap:48px;margin-bottom:48px}
  .cocktail-row:last-child{margin-bottom:24px}
  .cocktail-card__spray{top:20px;width:263px}
  .cocktail-card__img{max-width:312px;margin-bottom:24px}
  .cocktail-card__name{line-height:1.6}
}