/* r10: the coupon itself is a carton of fries. Text remains native HTML. */
.fries-coupon{
  position:relative;flex:0 0 150px;width:150px;height:126px;padding:0;
  color:#fff4d7;background:transparent;border:0;border-radius:0;overflow:visible;
  transform:rotate(5deg);transform-origin:50% 75%;
  filter:drop-shadow(0 4px 0 rgb(112 42 25 / 15%));
  transition:transform .2s ease,filter .2s ease;
}
.header>.fries-coupon{align-self:flex-start;margin-top:10px}
.fries-coupon-art{display:block;width:100%;height:100%;overflow:visible}
.fries-coupon-sticks{transition:transform .2s ease;transform-origin:80px 85px}
.fries-coupon-label{position:absolute;inset:55% 0 auto;display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.15;white-space:nowrap}
.fries-coupon-label strong{font-size:20px;font-weight:900;letter-spacing:.025em}
.fries-coupon-label>span{display:flex;align-items:center;gap:7px;font-size:16px;font-weight:800}
.fries-coupon-label b{color:#ffcf3e;font-size:21px;line-height:1;font-weight:700}
.fries-coupon:focus-visible{outline:3px solid var(--ink);outline-offset:6px;border-radius:14px}
@media(hover:hover){
  .fries-coupon:hover{transform:translateY(-3px) rotate(-3deg);filter:drop-shadow(0 7px 0 rgb(112 42 25 / 13%))}
  .fries-coupon:hover .fries-coupon-sticks{transform:translateY(-3px)}
}
.fries-coupon:active{transform:translateY(1px) rotate(0)}
@media(min-width:1700px){.header>.fries-coupon{margin-top:14px;width:164px;height:138px;flex-basis:164px}.fries-coupon-label strong{font-size:22px}.fries-coupon-label>span{font-size:18px}}
@media(max-width:760px){
  .header>.fries-coupon{display:none}
  .mobile-nav .fries-coupon{align-self:center;flex:none;width:150px;height:126px;margin:14px 0 8px;padding:0;border:0;text-align:center}
  .mobile-nav .fries-coupon-label strong{font-size:20px}
  .mobile-nav .fries-coupon-label>span{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.fries-coupon,.fries-coupon-sticks{transition:none}}
.fries-coupon:focus-visible{transform:none;outline-offset:3px}