/* PATCH_ID: b2c_phase5e17_quick_entry_hover_motion_stage_safe_20260522 */

/* Quick entries only. Do not affect artists/events/products. */
.b2c-home-native-cms .b2c-quick-section a,
.b2c-home-native-cms .b2c-quick-section a:visited,
.b2c-home-native-cms .b2c-quick-section a:hover,
.b2c-home-native-cms .b2c-quick-section a:active,
.b2c-home-native-cms .b2c-quick-section .quick-card,
.b2c-home-native-cms .b2c-quick-section .quick-card *{
  text-decoration:none !important;
}

.b2c-home-native-cms .b2c-quick-section .quick-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  min-height:92px;
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s cubic-bezier(.2,.8,.2,1),
    border-color .28s ease,
    background .28s ease;
  will-change:transform;
}

.b2c-home-native-cms .b2c-quick-section .quick-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:
    radial-gradient(circle at 20% 44%, rgba(228,190,255,.30), transparent 42%),
    linear-gradient(120deg, rgba(255,247,253,.96), rgba(255,255,255,.78));
  opacity:0;
  transform:scale(.98);
  transition:opacity .28s ease, transform .34s cubic-bezier(.2,.8,.2,1);
  z-index:-1;
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible{
  transform:translateY(-5px);
  border-color:rgba(210,168,239,.55);
  background:rgba(255,255,255,.94);
  box-shadow:
    0 22px 54px rgba(116,55,146,.14),
    0 0 0 1px rgba(255,255,255,.70) inset;
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover::before,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible::before{
  opacity:1;
  transform:scale(1);
}

/* Icon becomes the blurred depth layer. */
.b2c-home-native-cms .b2c-quick-section .quick-img{
  position:relative;
  z-index:2;
  transform-origin:center;
  transition:
    width .34s cubic-bezier(.2,.8,.2,1),
    height .34s cubic-bezier(.2,.8,.2,1),
    flex-basis .34s cubic-bezier(.2,.8,.2,1),
    transform .38s cubic-bezier(.2,.8,.2,1),
    filter .34s ease .08s,
    opacity .28s ease,
    box-shadow .32s ease,
    border-radius .32s ease;
  will-change:transform,filter,width,height;
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover .quick-img,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible .quick-img{
  width:64px;
  height:64px;
  flex-basis:64px;
  transform:scale(1.16) translateX(-4px) rotate(-2deg);
  filter:blur(3.2px) saturate(1.06) brightness(1.04);
  opacity:.76;
  border-radius:21px;
  box-shadow:
    0 16px 34px rgba(158,94,196,.20),
    0 0 0 5px rgba(255,255,255,.68);
}

/* Base text layer. Title becomes quiet; subtitle moves down and fades. */
.b2c-home-native-cms .b2c-quick-section .quick-card > span:not(.quick-hover-title){
  position:relative;
  z-index:3;
  transition:opacity .25s ease, transform .28s cubic-bezier(.2,.8,.2,1), filter .25s ease;
  will-change:opacity,transform;
}

.b2c-home-native-cms .b2c-quick-section .quick-card > span:not(.quick-hover-title) > b{
  transition:opacity .24s ease, transform .28s ease;
}

.b2c-home-native-cms .b2c-quick-section .quick-card > span:not(.quick-hover-title) > span{
  transition:opacity .20s ease, transform .26s cubic-bezier(.2,.8,.2,1), filter .22s ease;
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover > span:not(.quick-hover-title) > b,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible > span:not(.quick-hover-title) > b{
  opacity:.18;
  transform:translateY(-2px);
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover > span:not(.quick-hover-title) > span,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible > span:not(.quick-hover-title) > span{
  opacity:0;
  transform:translateY(14px);
  filter:blur(2px);
}

/* New title layer: slides left-to-right over the blurred icon depth. */
.b2c-home-native-cms .b2c-quick-section .quick-hover-title{
  position:absolute;
  left:46px;
  right:18px;
  top:50%;
  transform:translate(-18px,-50%);
  opacity:0;
  pointer-events:none;
  z-index:5;
  display:flex;
  align-items:center;
  min-width:0;
  color:#24162f;
  font-size:16px;
  font-weight:950;
  letter-spacing:-.025em;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-shadow:
    0 3px 10px rgba(255,255,255,.82),
    0 9px 22px rgba(47,20,72,.20);
  transition:
    opacity .30s ease .12s,
    transform .38s cubic-bezier(.2,.8,.2,1) .10s;
}

.b2c-home-native-cms .b2c-quick-section .quick-hover-title::after{
  content:"";
  width:28px;
  height:2px;
  margin-left:10px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(168,85,247,.75), rgba(236,168,220,0));
  box-shadow:0 0 16px rgba(196,120,225,.30);
  flex:0 0 auto;
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover .quick-hover-title,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible .quick-hover-title{
  opacity:1;
  transform:translate(0,-50%);
}

/* Soft sweep, once per hover. */
.b2c-home-native-cms .b2c-quick-section .quick-card::after{
  content:"";
  position:absolute;
  top:12px;
  bottom:12px;
  width:46px;
  left:-58px;
  transform:skewX(-18deg);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
  opacity:0;
  z-index:6;
  pointer-events:none;
  transition:left .62s ease, opacity .26s ease;
}

.b2c-home-native-cms .b2c-quick-section .quick-card:hover::after,
.b2c-home-native-cms .b2c-quick-section .quick-card:focus-visible::after{
  left:calc(100% + 26px);
  opacity:.72;
}

/* Accessibility. */
@media (prefers-reduced-motion: reduce){
  .b2c-home-native-cms .b2c-quick-section .quick-card,
  .b2c-home-native-cms .b2c-quick-section .quick-img,
  .b2c-home-native-cms .b2c-quick-section .quick-hover-title,
  .b2c-home-native-cms .b2c-quick-section .quick-card *{
    transition:none !important;
  }
}

/* Touch: keep stable, no blur hover trap. */
@media (hover:none){
  .b2c-home-native-cms .b2c-quick-section .quick-card:hover{
    transform:none;
  }
  .b2c-home-native-cms .b2c-quick-section .quick-card:hover .quick-img{
    width:48px;
    height:48px;
    flex-basis:48px;
    transform:none;
    filter:none;
    opacity:1;
  }
  .b2c-home-native-cms .b2c-quick-section .quick-card:hover > span:not(.quick-hover-title) > b,
  .b2c-home-native-cms .b2c-quick-section .quick-card:hover > span:not(.quick-hover-title) > span{
    opacity:1;
    transform:none;
    filter:none;
  }
  .b2c-home-native-cms .b2c-quick-section .quick-card:hover .quick-hover-title{
    opacity:0;
    transform:translate(-18px,-50%);
  }
}