/* Recipe detail pages (/apple-zu/ … /warsaw-mule/): cocktail image left, ingredients and method right. */
.recipe{padding:230px var(--colpad) 212px}
.recipe__inner{position:relative;max-width:1720px;margin:0 auto;padding-left:40%}
.recipe__back{display:flex;align-items:center;width:fit-content;padding:8px 26px 8px 0;color:var(--white);font:400 20px/normal var(--body)}
.recipe__back img{width:40px;height:40px;margin-right:16px;transition:transform .3s ease-in-out}
.recipe__back:hover img{transform:translateX(-6px)}
.recipe h1{margin:32px 0 40px;font-size:var(--h2);color:var(--white)}
.recipe__art{position:absolute;top:0;left:0;display:flow-root;width:36%;max-width:400px}
.recipe__spray{position:absolute;top:40px;left:50%;z-index:0;width:min(483px,100%);height:auto;transform:translateX(-50%)}
.recipe__img{position:relative;width:100%;height:auto;margin-bottom:32px;opacity:.86}
.recipe__label{margin-bottom:32px;font:400 var(--t32)/1.3 var(--body);color:var(--text);text-transform:none}
.recipe__list{margin:0 0 56px;padding:0;border-top:1px solid rgba(255,255,255,.1);list-style:none}
.recipe__row{position:relative;display:flex;align-items:center;height:76px;padding-right:46px;border-bottom:1px solid rgba(255,255,255,.1)}
.recipe__row--buy{justify-content:space-between;transition:background-color .4s ease-in-out,padding .4s ease-in-out}
.recipe__row--buy span{max-width:50%}
.recipe__row--buy:hover{padding-inline:24px;background:rgba(0,254,0,.08)}
.recipe__poper{position:absolute;top:50%;left:66%;z-index:1;width:24px;height:auto;opacity:0;transform:translate(-50%,-50%);transition:width .4s ease-in-out,opacity .4s ease-in-out}
.recipe__row--buy:hover .recipe__poper{width:112px;opacity:1}
.recipe__method--spaced p+p{margin-top:1.3em}

@media (min-width:1600px){.recipe h1{margin-bottom:80px}}
@media (max-width:1199px){
  .recipe{padding-top:164px;padding-bottom:120px}
  .recipe__back{font-size:18px}
  .recipe__back img{width:32px;height:32px}
  .recipe h1{margin:24px 0 46px}
  .recipe__row{height:64px;padding-right:26px}
  .recipe__row--buy:hover{padding-right:8px;padding-left:18px}
  .recipe__poper{left:60%}
  .recipe__row--buy:hover .recipe__poper{width:76px}
}
@media (max-width:991px){
  .recipe__inner{padding-left:0}
  .recipe h1{text-align:center}
  .recipe__art{position:relative;width:100%;max-width:360px;margin:0 auto 48px}
  .recipe__method{text-align:center}
}
@media (max-width:767px){
  .recipe{padding-bottom:68px}
  .recipe h1{margin-bottom:16px}
  .recipe__spray{top:20px;width:270px}
  /* Live nudges the image right of centre at this size; kept so the page matches. */
  .recipe__img{left:calc((100% - 312px)/2);max-width:312px;margin:0 auto 24px}
  .recipe__label{margin-bottom:24px;line-height:1.6}
  .recipe__list{margin-bottom:24px}
  .recipe__row{padding-right:24px}
  .recipe__row--buy:hover{padding-left:12px}
  .recipe__row--buy:hover .recipe__poper{width:42px}
  .recipe__method--spaced p+p{margin-top:1.6em}
}
@media (prefers-reduced-motion:reduce){.recipe__back img,.recipe__row--buy,.recipe__poper{transition:none}}