/* V85 — centered in-stock experience + rewards motion */
.brand-showcase > div{
  text-align:center !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  padding:clamp(28px,5vw,64px) clamp(18px,4vw,52px) !important;
}
.brand-showcase > div > span,
.brand-showcase > div > strong,
.brand-showcase > div > p{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.brand-showcase > div > span{display:block}
.brand-showcase > div > strong{max-width:900px;line-height:.96}
.brand-showcase > div > p{max-width:720px;line-height:1.65}

/* Homepage member card: longer, readable side-to-side shake, then calm float */
#rewards .loyalty-card-wrap{
  transform-origin:center center;
  animation:v85-member-enter .9s cubic-bezier(.18,.9,.25,1.08) both,
            v85-member-shake 2.8s 1s cubic-bezier(.36,.07,.19,.97) both,
            v85-member-float 4.8s 3.9s ease-in-out infinite !important;
  will-change:transform;
}
#rewards .loyalty-card{
  box-shadow:0 28px 72px rgba(0,0,0,.48),0 0 30px rgba(239,38,54,.18);
}
@keyframes v85-member-enter{
  0%{opacity:0;transform:translateY(42px) scale(.94)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes v85-member-shake{
  0%,100%{transform:translateX(0) rotate(0)}
  7%{transform:translateX(-12px) rotate(-.8deg)}
  14%{transform:translateX(12px) rotate(.8deg)}
  21%{transform:translateX(-10px) rotate(-.65deg)}
  28%{transform:translateX(10px) rotate(.65deg)}
  35%{transform:translateX(-8px) rotate(-.5deg)}
  42%{transform:translateX(8px) rotate(.5deg)}
  49%{transform:translateX(-6px) rotate(-.35deg)}
  56%{transform:translateX(6px) rotate(.35deg)}
  63%{transform:translateX(-4px) rotate(-.2deg)}
  70%{transform:translateX(4px) rotate(.2deg)}
  78%{transform:translateX(-2px)}
  86%{transform:translateX(2px)}
}
@keyframes v85-member-float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-9px)}
}

/* Free enrollment: animated entrance, breathing border and soft light pass */
#rewards .join-rewards{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  animation:v85-enroll-enter 1s .3s cubic-bezier(.16,1,.3,1) both,
            v85-enroll-breathe 4.6s 1.4s ease-in-out infinite !important;
}
#rewards .join-rewards::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-2;
  border-radius:inherit;
  background:linear-gradient(115deg,transparent 10%,rgba(239,38,54,.12) 38%,rgba(255,255,255,.18) 50%,rgba(239,38,54,.13) 62%,transparent 90%);
  background-size:240% 100%;
  animation:v85-enroll-sheen 4.2s 1.2s linear infinite;
  pointer-events:none;
}
#rewards .join-rewards::after{
  content:"";
  position:absolute;
  left:50%;bottom:-38%;
  width:68%;aspect-ratio:1;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(239,38,54,.22),transparent 68%);
  filter:blur(18px);
  z-index:-1;
  animation:v85-enroll-glow 3.8s ease-in-out infinite;
  pointer-events:none;
}
#rewards .join-rewards .join-icon{
  animation:v85-enroll-icon 2.5s ease-in-out infinite;
}
#rewards .join-rewards .button{
  animation:v85-enroll-button 2.8s ease-in-out infinite;
}
@keyframes v85-enroll-enter{
  0%{opacity:0;transform:translateY(48px) scale(.96)}
  100%{opacity:1;transform:none}
}
@keyframes v85-enroll-breathe{
  0%,100%{box-shadow:0 24px 62px rgba(0,0,0,.38),0 0 0 rgba(239,38,54,0)}
  50%{box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 34px rgba(239,38,54,.2)}
}
@keyframes v85-enroll-sheen{to{background-position:-140% 0}}
@keyframes v85-enroll-glow{
  0%,100%{opacity:.45;transform:translateX(-50%) scale(.9)}
  50%{opacity:1;transform:translateX(-50%) scale(1.12)}
}
@keyframes v85-enroll-icon{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-7px) scale(1.05)}
}
@keyframes v85-enroll-button{
  0%,100%{filter:brightness(1);box-shadow:0 14px 30px rgba(239,38,54,.2)}
  50%{filter:brightness(1.12);box-shadow:0 18px 44px rgba(239,38,54,.38)}
}

@media (max-width:720px){
  .brand-showcase > div{padding:34px 18px !important}
  .brand-showcase > div > strong{font-size:clamp(2.55rem,13vw,4rem) !important;max-width:100%}
  .brand-showcase > div > p{font-size:1rem !important;max-width:34rem}
  #rewards .loyalty-card-wrap{
    animation:v85-member-enter .8s cubic-bezier(.18,.9,.25,1.08) both,
              v85-member-shake-mobile 2.4s .9s cubic-bezier(.36,.07,.19,.97) both,
              v85-member-float 5s 3.4s ease-in-out infinite !important;
  }
  @keyframes v85-member-shake-mobile{
    0%,100%{transform:translateX(0)}
    10%{transform:translateX(-7px)}20%{transform:translateX(7px)}
    30%{transform:translateX(-6px)}40%{transform:translateX(6px)}
    50%{transform:translateX(-4px)}60%{transform:translateX(4px)}
    72%{transform:translateX(-2px)}84%{transform:translateX(2px)}
  }
}

@media (prefers-reduced-motion:reduce){
  #rewards .loyalty-card-wrap,
  #rewards .join-rewards,
  #rewards .join-rewards::before,
  #rewards .join-rewards::after,
  #rewards .join-rewards .join-icon,
  #rewards .join-rewards .button{animation:none !important}
}


/* V86 — dedicated mobile menu close control */
.nav-close{display:none}
@media(max-width:900px){
  .site-header.open nav{
    overflow-y:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding-bottom:max(42px,env(safe-area-inset-bottom))!important;
  }
  .site-header.open nav .nav-close{
    display:flex!important;
    width:min(560px,100%);
    min-height:72px;
    margin:10px auto 0;
    padding:17px 22px;
    align-items:center;
    justify-content:center;
    gap:14px;
    border:1px solid rgba(237,28,36,.72);
    border-radius:14px;
    background:linear-gradient(145deg,rgba(18,20,24,.98),rgba(7,8,10,.99));
    color:#fff;
    box-shadow:0 0 28px rgba(237,28,36,.28),inset 0 0 20px rgba(237,28,36,.08);
    font:800 clamp(1.25rem,5.4vw,1.75rem) "Barlow Condensed",sans-serif;
    letter-spacing:.08em;
    text-transform:uppercase;
    cursor:pointer;
    animation:v86ClosePulse 2.2s ease-in-out infinite;
  }
  .site-header.open nav .nav-close span{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#ed1c24;
    color:#fff;
    font:500 2rem/1 Inter,sans-serif;
    box-shadow:0 0 20px rgba(237,28,36,.55);
  }
  .site-header.open nav .nav-close b{font:inherit}
  body.menu-open{overflow:hidden;touch-action:none}
}
@keyframes v86ClosePulse{
  0%,100%{transform:translateY(0);box-shadow:0 0 20px rgba(237,28,36,.22),inset 0 0 16px rgba(237,28,36,.05)}
  50%{transform:translateY(-2px);box-shadow:0 0 36px rgba(237,28,36,.48),inset 0 0 22px rgba(237,28,36,.12)}
}