
html,
body{
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  height:auto !important;
  min-height:100% !important;
}
/* =====================================
   CATALOG HERO
===================================== */
.u100-luxe-cat-hero,
.u100-luxe-cat-hero *{
  box-sizing:border-box !important;
}
.u100-luxe-cat-hero{
  position:relative !important;
  left:50% !important;
  width:100vw !important;
  max-width:100vw !important;
  /* 视频上移覆盖白条 */
  margin-left:-50vw !important;
  margin-right:-50vw !important;
  margin-top:-48px !important;
  height:calc(100vh + 48px) !important;
  min-height:calc(760px + 48px) !important;
  margin-bottom:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#000 !important;
  color:#fff !important;
  font-family:Arial, Helvetica, sans-serif !important;
  touch-action:auto !important;
  overscroll-behavior:auto !important;
}
/* =====================================
   REMOVE OLD MARQUEE / WHITE BAR
===================================== */
html body .u100-luxe-cat-marquee,
html body .u100-luxe-cat-marquee-track,
html body .u100-luxe-cat-marquee-group,
html body .u100-luxe-cat-marquee-group span,
html body .u100vhero-marquee,
html body .u100vhero-marquee-track,
html body .u100vhero-marquee-group,
html body .u100vhero-marquee-group span,
html body #u100PcFixedMarqueeJS,
html body #u100PcFixedMarqueeJS *,
html body #u100PcFixedMarqueeStyleJS{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  line-height:0 !important;
  font-size:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
  z-index:-1 !important;
}
/* =====================================
   VIDEO
===================================== */
.u100-luxe-cat-video{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  z-index:1 !important;
  width:100vw !important;
  max-width:100vw !important;
  height:100% !important;
  min-height:100% !important;
  overflow:hidden !important;
  background:#000 !important;
  margin:0 !important;
  padding:0 !important;
  pointer-events:none !important;
}
.u100-luxe-cat-video::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:3 !important;
  width:100% !important;
  height:100% !important;
  pointer-events:none !important;
  background:
    linear-gradient(
      to bottom,
      rgba(0,0,0,0.30) 0%,
      rgba(0,0,0,0.05) 38%,
      rgba(0,0,0,0.55) 100%
    ),
    radial-gradient(
      circle at 50% 50%,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0.14) 72%,
      rgba(0,0,0,0.42) 100%
    ) !important;
}
.u100-luxe-cat-video video,
#u100LuxeCatVideo,
#u100LuxeCatVideoPhoneJS{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:100vw !important;
  height:100% !important;
  min-width:100vw !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:translate(-50%, -50%) !important;
  opacity:1 !important;
  visibility:visible !important;
  background:#000 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  outline:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
}
#u100LuxeCatVideoPhoneJS{
  display:none !important;
}
/* =====================================
   CENTER TITLE
===================================== */
.u100-luxe-cat-center-title{
  position:absolute !important;
  left:50% !important;
  top:48% !important;
  transform:translate(-50%, -50%) !important;
  z-index:8 !important;
  width:min(1100px, calc(100vw - 80px)) !important;
  text-align:center !important;
  pointer-events:none !important;
  opacity:.72 !important;
}
.u100-luxe-cat-center-title span,
.u100-luxe-cat-center-title strong{
  display:block !important;
  margin:0 !important;
  font-size:clamp(42px, 5.4vw, 88px) !important;
  line-height:.92 !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:rgba(255,255,255,.52) !important;
  text-shadow:
    0 2px 4px rgba(0,0,0,.42),
    0 14px 34px rgba(0,0,0,.35) !important;
}
.u100-luxe-cat-center-title span{
  margin-bottom:16px !important;
}
/* =====================================
   SOUND BUTTON
===================================== */
#u100SoundToggle{
  position:absolute !important;
  right:clamp(14px,2vw,26px) !important;
  top:clamp(92px,7vw,108px) !important;
  z-index:999999 !important;
  width:38px !important;
  height:38px !important;
  padding:0 !important;
  border-radius:50% !important;
  border:1px solid rgba(255,255,255,.28) !important;
  background:rgba(0,0,0,.18) !important;
  color:rgba(255,255,255,.9) !important;
  font-size:16px !important;
  line-height:1 !important;
  font-family:Arial, Helvetica, sans-serif !important;
  cursor:pointer !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  box-shadow:0 8px 22px rgba(0,0,0,.16) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
#u100SoundToggle.is-on{
  background:rgba(255,106,0,.28) !important;
  border-color:rgba(255,106,0,.46) !important;
  color:rgba(255,255,255,.96) !important;
}
/* =====================================
   REVEAL AREA
===================================== */
.u100-luxe-cat-reveal{
  position:absolute !important;
  left:50% !important;
  bottom:40px !important;
  z-index:60 !important;
  width:min(1340px, calc(100vw - 70px)) !important;
  max-width:calc(100vw - 70px) !important;
  transform:translate(-50%, 70px) !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:
    opacity 1.05s cubic-bezier(.16, 1, .3, 1),
    transform 1.05s cubic-bezier(.16, 1, .3, 1),
    visibility 0s linear 1.05s !important;
}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-reveal{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translate(-50%, 0) !important;
  transition:
    opacity 1.05s cubic-bezier(.16, 1, .3, 1),
    transform 1.05s cubic-bezier(.16, 1, .3, 1),
    visibility 0s linear 0s !important;
}
/* =====================================
   HEADING
===================================== */
.u100-luxe-cat-heading{
  position:relative !important;
  z-index:60 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:24px !important;
  margin:0 0 18px !important;
  padding:0 4px !important;
  pointer-events:none !important;
  opacity:0 !important;
  transform:translate3d(0, 22px, 0) !important;
  transition:
    opacity .95s cubic-bezier(.16, 1, .3, 1),
    transform .95s cubic-bezier(.16, 1, .3, 1) !important;
}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-heading{
  opacity:1 !important;
  transform:translate3d(0, 0, 0) !important;
}
.u100-luxe-cat-heading-left,
.u100-luxe-cat-hint{
  transition:
    transform 680ms cubic-bezier(.16,1,.3,1),
    opacity 520ms ease !important;
  will-change:transform !important;
}
.u100-luxe-cat-kicker{
  display:inline-flex !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
  font-size:11px !important;
  line-height:1 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  color:rgba(255,255,255,.88) !important;
}
.u100-luxe-cat-kicker::before{
  content:"" !important;
  display:inline-block !important;
  width:72px !important;
  height:1px !important;
  margin-right:18px !important;
  background:rgba(255,255,255,.42) !important;
}
.u100-luxe-cat-hint{
  display:flex !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
  font-size:12px !important;
  line-height:1 !important;
  letter-spacing:.04em !important;
  color:rgba(255,255,255,.75) !important;
  text-transform:uppercase !important;
}
/* =====================================
   GRID
===================================== */
.u100-luxe-cat-grid{
  position:relative !important;
  z-index:50 !important;
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  gap:12px !important;
  touch-action:auto !important;
  overscroll-behavior:auto !important;
}
.u100-luxe-cat-card{
  position:relative !important;
  display:block !important;
  height:230px !important;
  min-height:230px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.22) !important;
  background:rgba(12,12,12,.58) !important;
  color:#fff !important;
  text-decoration:none !important;
  box-shadow:0 18px 45px rgba(0,0,0,.32) !important;
  opacity:0 !important;
  transform:translate3d(0, 65px, 0) scale3d(.94, .94, 1) !important;
  transform-origin:center center !important;
  transition:
    transform 1.15s cubic-bezier(.16,1,.3,1),
    opacity 1.15s cubic-bezier(.16,1,.3,1),
    border-color 520ms ease,
    box-shadow 760ms cubic-bezier(.16,1,.3,1),
    background 520ms ease !important;
  will-change:transform, opacity !important;
}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-card{
  opacity:1 !important;
  transform:translate3d(0,0,0) scale3d(1,1,1) !important;
}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-card:nth-child(1){transition-delay:.12s !important;}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-card:nth-child(2){transition-delay:.28s !important;}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-card:nth-child(3){transition-delay:.44s !important;}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-card:nth-child(4){transition-delay:.60s !important;}
.u100-luxe-cat-hero.is-revealed .u100-luxe-cat-card:nth-child(5){transition-delay:.76s !important;}
.u100-luxe-cat-card img{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:scale3d(1.04,1.04,1) !important;
  filter:brightness(.76) saturate(.9) contrast(1.04) !important;
  transition:
    transform 980ms cubic-bezier(.16,1,.3,1),
    filter 620ms ease !important;
}
.u100-luxe-cat-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.06) 0%, rgba(0,0,0,.18) 45%, rgba(0,0,0,.76) 100%),
    linear-gradient(to right, rgba(0,0,0,.20), rgba(0,0,0,0)) !important;
}
.u100-luxe-cat-content{
  position:absolute !important;
  left:18px !important;
  right:18px !important;
  bottom:18px !important;
  z-index:3 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
}
.u100-luxe-cat-number{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:26px !important;
  min-width:82px !important;
  padding:0 12px !important;
  margin:0 0 66px !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.13) !important;
  color:rgba(255,255,255,.9) !important;
  font-size:10px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}
.u100-luxe-cat-name{
  display:block !important;
  max-width:100% !important;
  color:#fff !important;
  font-size:19px !important;
  line-height:1 !important;
  font-weight:800 !important;
  letter-spacing:-.03em !important;
  white-space:nowrap !important;
  text-shadow:0 2px 12px rgba(0,0,0,.45) !important;
}
.u100-luxe-cat-card[data-long="true"] .u100-luxe-cat-name{
  font-size:15px !important;
}
.u100-luxe-cat-link{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
  margin-top:12px !important;
  padding-top:12px !important;
  border-top:1px solid rgba(255,255,255,.22) !important;
  color:rgba(255,255,255,.78) !important;
  font-size:11px !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}
.u100-luxe-cat-link::after{
  content:"→" !important;
  font-size:18px !important;
  line-height:1 !important;
  color:rgba(255,255,255,.95) !important;
}
.u100-luxe-cat-card.is-active{
  z-index:20 !important;
  opacity:1 !important;
  border-color:rgba(255,106,0,.98) !important;
  background:rgba(18,18,18,.82) !important;
  box-shadow:0 38px 100px rgba(0,0,0,.72) !important;
  transform:translate3d(0,-18px,0) scale3d(1.075,1.075,1) !important;
}
.u100-luxe-cat-card.is-active img{
  transform:scale3d(1.12,1.12,1) !important;
  filter:brightness(.98) saturate(1.08) contrast(1.08) !important;
}
.u100-luxe-cat-card.is-muted{
  z-index:1 !important;
  opacity:.78 !important;
  border-color:rgba(255,255,255,.14) !important;
  background:rgba(8,8,8,.56) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.26) !important;
  transform:translate3d(0,6px,0) scale3d(.948,.948,1) !important;
}
.u100-luxe-cat-card.is-muted img{
  transform:scale3d(1.02,1.02,1) !important;
  filter:brightness(.62) saturate(.78) contrast(.96) !important;
}
/* =====================================
   RESPONSIVE
===================================== */
@media(max-width:1280px){
  .u100-luxe-cat-reveal{
    width:calc(100vw - 40px) !important;
    max-width:calc(100vw - 40px) !important;
    bottom:28px !important;
  }
  .u100-luxe-cat-grid{
    grid-template-columns:repeat(5, minmax(220px, 1fr)) !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding-bottom:8px !important;
    scroll-snap-type:x proximity !important;
    overscroll-behavior-x:contain !important;
    overscroll-behavior-y:auto !important;
    touch-action:auto !important;
  }
  .u100-luxe-cat-card{
    scroll-snap-align:start !important;
  }
}
@media(max-width:768px){
  .u100-luxe-cat-hero{
    margin-top:-40px !important;
    height:calc(100svh + 40px) !important;
    min-height:calc(638px + 40px) !important;
  }
  .u100-luxe-cat-video{
    height:100% !important;
    min-height:100% !important;
  }
  .u100-luxe-cat-video video,
  #u100LuxeCatVideo,
  #u100LuxeCatVideoPhoneJS{
    height:100% !important;
    min-height:100% !important;
  }
  #u100LuxeCatVideo{
    display:none !important;
  }
  #u100LuxeCatVideoPhoneJS{
    display:block !important;
  }
  #u100SoundToggle{
    top:88px !important;
    right:16px !important;
    width:36px !important;
    height:36px !important;
  }
  .u100-luxe-cat-center-title{
    top:42% !important;
    width:calc(100vw - 40px) !important;
  }
  .u100-luxe-cat-center-title span,
  .u100-luxe-cat-center-title strong{
    font-size:clamp(34px, 13vw, 62px) !important;
    line-height:.94 !important;
  }
  .u100-luxe-cat-reveal{
    width:calc(100vw - 28px) !important;
    max-width:calc(100vw - 28px) !important;
    bottom:18px !important;
  }
  .u100-luxe-cat-heading{
    display:block !important;
    margin-bottom:10px !important;
  }
  .u100-luxe-cat-kicker{
    font-size:10px !important;
  }
  .u100-luxe-cat-kicker::before{
    width:44px !important;
    margin-right:12px !important;
  }
  .u100-luxe-cat-hint{
    margin-top:8px !important;
    font-size:10px !important;
  }
  .u100-luxe-cat-grid{
    grid-template-columns:repeat(5, minmax(170px, 170px)) !important;
    gap:10px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x proximity !important;
    overscroll-behavior-x:contain !important;
    overscroll-behavior-y:auto !important;
    touch-action:auto !important;
  }
  .u100-luxe-cat-card{
    height:210px !important;
    min-height:210px !important;
  }
  .u100-luxe-cat-card.is-active,
  .u100-luxe-cat-card.is-muted{
    opacity:1 !important;
    transform:translate3d(0,0,0) scale3d(1,1,1) !important;
  }
  .u100-luxe-cat-number{
    margin-bottom:58px !important;
  }
}
