/*===== Modal Custom Style =====*/
.modal-dialog.modal-xl {
  max-width: 90%;
  margin: auto;
}

.modal-content {
  background: rgb(76 76 76 / 17%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(16px);
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

/* Modal Header */
.modal-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding: 1.25rem 1.5rem;
  background-color: rgba(0, 0, 0, 0.2);
}

.modal-title {
  font-size: 1.5rem;
  font-weight: bold;
  color: #fff;
}

.btn-close {
  filter: invert(1);
  opacity: 0.8;
}
.btn-close:hover {
  opacity: 1;
}

/* Modal Body */
.modal-body {
  padding: 1rem;
}

/* Product Cards */
.products .card {
  border: none;
  background-color: rgba(255, 255, 255, 0.03);
  border-radius: 0.75rem;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.products .card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
}

.card-img-top {
  position: relative;
  aspect-ratio: 16/9;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #1a1a1a;
}

.card-img-top img {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.card-img-top .overlay {
  position: absolute;
  bottom: -20px;
  left: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  transition: all 0.3s ease;
  padding: 1rem;
}

.card:hover .card-img-top .overlay {
  bottom: 0;
  opacity: 1;
}

.card-img-top .overlay .btn {
  width: 100%;
  background-color: rgb(68 92 124 / 62%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(16px);
  border: none;
  color: white;
  font-weight: 500;
}
.card-img-top .overlay .btn:hover {
  background-color: #0b5ed7;
}

/* Card Body Info */
.card-body {
  padding: 1rem;
  color: #e0e0e0;
}

.card-body .info {
  display: flex;
  justify-content: space-between;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
  color: #ccc;
}

.card-body .price {
  font-weight: bold;
  color: #fff;
}

.card-body .text-primary {
  color: #ff4d4f !important;
}

.card-title {
  font-size: 1.1rem;
  color: #fff;
  margin: 0;
}

.halo-background {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 65%;
  aspect-ratio: 1 / 1;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 9999px;
  filter: blur(200px);
  transform: translateY(-66%);
  z-index: 0;
  pointer-events: none;

  animation: pulse-glow 4s ease-in-out infinite;
}
@keyframes pulse-glow {
  0%, 100% {
    background-color: rgba(93, 93, 93, 0.302); 
  }
  50% {
    background-color: rgba(255, 255, 255, 0.248);
  }
}

.accordion-button-2 {
    position: relative;
    display: flex
;
    align-items: center;
    width: 100%;
    padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
    font-size: 1rem;
    color: var(--bs-accordion-btn-color);
    text-align: left;
    background: linear-gradient(135deg, #8f58c547, #5a565600);
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
}

  .searchbar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.05);
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
  }

  .searchbar svg {
    flex-shrink: 0;
    fill: #fff;
    width: 24px;
    height: 24px;
  }

  .searchbar .form-control {
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    width: 100%;
    font-size: 1rem;
    padding: 0;
    box-shadow: none;
}

.footer .logo p.text-muted {
  font-size: 0.95rem;
  opacity: 0.8;
}

.btn-buy-now {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 1rem;
  font-weight: 600;
  font-size: 0.95rem;
  border: none;
  border-radius: 0.5rem;
  background: linear-gradient(135deg, #7d26cd, #6110ac);
  color: white;
  transition: background 0.3s ease, transform 0.2s;
  cursor: pointer;
}

.btn-buy-now:hover {
  background: linear-gradient(135deg, #9438e9, #8e4dcb);
  transform: translateY(-1px);
}

.btn-buy-now .icon {
  transition: transform 0.2s ease;
}

.btn-buy-now:hover .icon {
  transform: translateX(4px);
}
.card-img-top {
  position: relative;
  overflow: hidden;
}

.buy-icon-overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.6);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: 10;
}

.card:hover .buy-icon-overlay {
  opacity: 1;
}

.buy-icon svg {
  color: #512e7d;
  transition: transform 0.2s ease;
}

.buy-icon:hover svg {
  transform: scale(1.1);
}
.tilt-card {
  perspective: 1000px;
  cursor: pointer;
}

.tilt-inner {
  transition: transform 0.2s ease-out;
  transform-style: preserve-3d;
  will-change: transform;
  border-radius: 0.5rem;
  box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}
.tilt-3d {
  perspective: 1000px;
  cursor: pointer;
}

.tilt-3d-inner {
  transition: transform 0.2s ease-out;
  transform-style: preserve-3d;
  will-change: transform;
  background: white;
  padding: 1rem;
  border-radius: 8px;
  box-shadow: 0 15px 30px rgba(0,0,0,0.1);
}

.socials .social {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #111;
  color: #fff;
  padding: 1rem 1.5rem;
  margin: 1rem 0;
  border-radius: 16px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-decoration: none;
}

.socials .social:hover {
  transform: scale(1.05) rotateX(3deg) rotateY(-3deg);
  box-shadow: 0 20px 30px rgba(0,0,0,0.4);
}

.socials .social .left,
.socials .social .right {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: bold;
  font-size: 1.1rem;
  transition: transform 0.3s ease;
}

.socials .social:hover .left svg,
.socials .social:hover .right svg {
  transform: scale(1.2) rotate(5deg);
}

.socials .social svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
  transition: transform 0.3s ease;
}

.socials .social::before {
  content: "";
  position: absolute;
  top: -100%;
  left: -100%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle at center, rgba(255,255,255,0.1) 0%, transparent 70%);
  transform: rotate(45deg);
  transition: all 0.5s ease-in-out;
  opacity: 0;
  pointer-events: none;
}

.socials .social:hover::before {
  top: -50%;
  left: -50%;
  opacity: 1;
}

.socials .social svg {
  background: #222;
  padding: 0.5rem;
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.05);
}

  @media (max-width: 768px) {
    .character-floating {
      height: 220px;
      top: -40px;
    }
  }

.border-top {
  border-top: 1px solid #ddd;
  padding-top: 1rem;
  margin-top: 1rem;
  margin-bottom: 20px;
  text-align: right;
}


.payment-icon {
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.3s ease, transform 0.3s ease;
  color: white;
}

.payment-icon:hover {
  opacity: 1;
  transform: scale(1.1);
}

.payment-icon svg {
  height: 24px;
  width: auto;
  display: block;
  fill: currentColor;
}

/* Popup*/
.popup-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.popup-content {
  background: rgba(0, 0, 0, 0.597);
  padding: 2rem;
  border-radius: 12px;
  max-width: 90%;
  max-height: 90%;
  overflow: auto;
  position: relative;
}

.popup-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  color: #fff;
  font-size: 1.2rem;
  cursor: pointer;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  transition: background 0.2s;
}
.popup-close:hover {
  background: rgba(255, 255, 255, 0.3);
}

.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(6px);
  background: rgba(0, 0, 0, 0.5);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.popup-box {
  background-color: #7d26cd52;
  border-radius: 1rem;
  border: 2px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: 2rem 2.5rem;
  max-width: 600px;
  width: 90%;
  margin: auto;
  text-align: center;
  position: relative;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
  animation: popup-show 0.4s ease-out;
  color: #fff;
}

.popup-box h3 {
  margin-bottom: 1rem;
  font-size: 1.5rem;
}

.popup-box p {
  margin-bottom: 1.5rem;
  font-size: 1rem;
  color: #ffffff;
}

.popup-close {
  position: absolute;
  top: 12px;
  right: 16px;
  background: transparent;
  border: none;
  font-size: 1.2rem;
  cursor: pointer;
}

.popup-cta {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.75rem 1.75rem;
  font-size: 1rem;
  background: #7d26cd;
  color: white;
  text-decoration: none;
  border-radius: 8px;
  transition: background 0.3s;
}
.popup-cta:hover {
  background: #934cd6;
}

@keyframes popup-show {
  0% {
    transform: scale(0.95);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
/* Refined storefront — uses the existing editable SellAuth palette. */
:root { --store-text: #f7f5fa; --store-muted: #b9b4c2; --store-line: rgba(255,255,255,.1); --store-radius: 18px; }
html { scroll-behavior: smooth; scroll-padding-top: 125px; }
body { background: radial-gradient(ellipse at 50% 0%,rgba(var(--cl-accent-rgb),.17),transparent 680px),#0b0b0b; color:var(--store-text); animation:none; cursor:auto; -webkit-font-smoothing:antialiased; }
a,button { cursor:pointer; }
::selection { background:var(--cl-accent); color:white; }
:focus-visible { outline:3px solid #c59aee!important; outline-offset:4px; }
.skip-link { position:fixed; left:16px; top:-100px; z-index:9999; padding:12px 20px; background:var(--cl-accent); color:white; border-radius:8px; }
.skip-link:focus { top:16px; }
.container { max-width:1240px; }
header.sticky-top { z-index:1020; }
.navbar { background:rgba(11,11,11,.92); backdrop-filter:blur(18px); border:0; border-bottom:1px solid var(--store-line); border-radius:0; padding:12px 0; margin:0; }
.navbar .navbar-brand img { max-height:44px; width:auto; object-fit:contain; }
.navbar .nav-item a.nav-link { font-size:14px; font-weight:500; color:var(--store-muted); padding:12px 16px; }
.navbar .nav-item a.nav-link.active,.navbar .nav-item a.nav-link:hover { color:#fff; }
.navbar .cart .btn,.navbar .user .btn { min-height:44px; min-width:44px; border:1px solid var(--store-line); border-radius:12px; background:rgba(255,255,255,.035); }
.announcement { border-bottom:1px solid rgba(var(--cl-accent-rgb),.3); background:rgba(var(--cl-accent-rgb),.12); }
.btn { border-radius:10px; font-weight:500; transition:background .18s,border-color .18s,transform .18s; }
.btn-primary,.btn-buy-now,.popup-cta { background:var(--cl-accent); border:1px solid rgba(255,255,255,.12); color:#fff; box-shadow:0 4px 18px rgba(var(--cl-accent-rgb),.14); }
.btn-primary:hover,.btn-buy-now:hover { background:#6110ac; border-color:#9438e9; color:#fff; transform:translateY(-2px); }
.btn-outline-primary { border-color:var(--store-line); color:var(--store-text); background:rgba(255,255,255,.025); }
.btn-outline-primary:hover { color:white; background:rgba(var(--cl-accent-rgb),.18); border-color:var(--cl-accent); }
.hero { min-height:0!important; border-bottom:1px solid var(--store-line); }
.hero .container { padding:88px 24px 72px; }
.hero .content { width:100%; max-width:880px; }
.hero .bg-overlay { background:linear-gradient(180deg,rgba(11,11,11,.2),rgba(11,11,11,.92)); }
.hero .halo-background { width:720px; max-width:90%; height:320px; background:rgba(var(--cl-accent-rgb),.16); filter:blur(100px); transform:none; top:0; bottom:auto; animation:none; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:9px; padding:8px 13px; border:1px solid rgba(var(--cl-accent-rgb),.35); border-radius:99px; color:#d7c1ec; background:rgba(var(--cl-accent-rgb),.09); font-size:10px; font-weight:500; letter-spacing:1.8px; margin-bottom:26px; }
.hero-eyebrow span { width:6px; height:6px; background:#b97feb; border-radius:100%; box-shadow:0 0 12px rgba(var(--cl-accent-rgb),.5); }
.hero .content h1 { font-size:clamp(36px,5.7vw,72px); font-weight:700; line-height:1.07; letter-spacing:-2.5px; margin:0 auto 24px; text-wrap:balance; }
.hero .highlight { color:#b77dea; background:linear-gradient(100deg,#c69ced,#7d26cd); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hero .content .hero-description { font-size:17px; line-height:1.8; max-width:590px; color:var(--store-muted); margin:0 auto 28px; }
.hero-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; }
.hero .content .hero-actions a { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:50px; padding:12px 22px; margin:0; font-size:14px; }
.hero .fake-searchbar { display:flex; align-items:center; gap:12px; width:100%; max-width:500px; margin:28px auto 0; padding:15px 17px; border-radius:12px; border:1px solid var(--store-line); background:rgba(20,20,20,.8); color:var(--store-muted); font-size:13px; text-align:left; }
.hero .fake-searchbar svg { width:20px; height:20px; fill:none; color:#b78ae0; }
.hero .fake-searchbar:hover { border-color:rgba(var(--cl-accent-rgb),.8); background:#141414; }
.search-hint { margin-left:auto; font-size:10px; border:1px solid var(--store-line); padding:3px 6px; border-radius:4px; color:#b9b4c2; white-space:nowrap; }
.hero .image img { max-height:340px; object-fit:contain; }
.py-20 { padding-top:64px; padding-bottom:64px; }
.section-title { margin-bottom:12px; }
.section-title h1,.section-title h2 { font-size:clamp(26px,3vw,38px); font-weight:600; letter-spacing:-1px; line-height:1.2; color:var(--store-text); text-shadow:none; }
.section-subtitle { color:var(--store-muted); margin-bottom:32px; }
.section-subtitle p { font-size:15px; color:var(--store-muted); }
.offer-strip { display:flex; align-items:center; gap:20px; max-width:1192px; margin:28px auto 0; padding:20px 24px; border:1px solid rgba(var(--cl-accent-rgb),.3); border-radius:14px; background:linear-gradient(100deg,rgba(var(--cl-accent-rgb),.14),rgba(20,20,20,.65)); }
.offer-tag { font-size:11px; font-weight:600; letter-spacing:1px; border-radius:7px; padding:8px 10px; background:var(--cl-accent); color:white; white-space:nowrap; }
.offer-strip p { margin:0; font-size:14px; line-height:1.7; }
.offer-strip p span { color:var(--store-muted); }
.offer-strip strong { color:#e2cbf7; letter-spacing:1px; }
.offer-strip a { margin-left:auto; white-space:nowrap; color:#e2cbf7; font-size:12px; text-decoration:none; }
.products { --bs-gutter-x:24px; --bs-gutter-y:0; }
.products > [class*="col-"] { display:flex; }
.products .store-product-card { width:100%; height:100%; border:1px solid var(--store-line); border-radius:var(--store-radius); background:var(--cl-background-secondary); box-shadow:none; transition:transform .2s,border-color .2s,box-shadow .2s; }
.products .store-product-card:hover,.products .store-product-card:focus-visible { transform:translateY(-4px); border-color:rgba(var(--cl-accent-rgb),.7); box-shadow:0 14px 34px rgba(0,0,0,.3); }
.store-product-card .tilt-inner { height:100%; display:flex; flex-direction:column; box-shadow:none; transform:none; will-change:auto; }
.store-product-card .card-img-top { aspect-ratio:16/10; border-bottom:1px solid var(--store-line); background:radial-gradient(ellipse at center,rgba(var(--cl-accent-rgb),.15),#101010); border-radius:0; }
.store-product-card .card-img-top img { object-fit:cover; transition:transform .3s; }
.store-product-card:hover .card-img-top img { transform:scale(1.035); }
.store-product-card .product-img-placeholder { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.store-product-card .product-img-placeholder svg { width:56px; height:56px; opacity:.75; }
.store-product-card .card-body { display:flex; flex-direction:column; padding:20px; gap:14px; }
.store-product-card .card-body > .d-flex { order:-1; gap:12px; margin-top:0!important; }
.store-product-card .card-title { font-size:16px; font-weight:500; line-height:1.4; overflow-wrap:anywhere; }
.store-product-card .info { align-items:center; gap:10px; flex-wrap:wrap; margin:0; margin-top:auto; }
.store-product-card .info p { margin:0; }
.store-product-card .info .price { font-size:15px; font-weight:500; }
.store-product-card .info .text-primary { color:#c3a0e4!important; font-size:11px; }
.store-product-card .btn-buy-now { width:32px; height:32px; display:inline-flex; justify-content:center; align-items:center; padding:6px; border-radius:8px; flex-shrink:0; background:rgba(var(--cl-accent-rgb),.15); color:#cba1ef; box-shadow:none; }
.features .list { row-gap:20px; }
.features .list .feature { height:100%; border:1px solid var(--store-line); border-radius:var(--store-radius); background:linear-gradient(140deg,rgba(var(--cl-accent-rgb),.065),#141414); padding:32px; text-align:left; box-shadow:none; transform:none; }
.features .list .feature:hover { transform:none; border-color:rgba(var(--cl-accent-rgb),.45); }
.features .list .feature i { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; background:rgba(var(--cl-accent-rgb),.15); color:#c496ea; border-radius:11px; font-size:18px; margin-bottom:24px; }
.features .list .feature .title { font-size:18px; margin-bottom:12px; }
.features .list .feature .description { color:var(--store-muted); font-size:14px; line-height:1.8; margin:0; }
.socials .social { background:#141414; border:1px solid var(--store-line); box-shadow:none; padding:22px; }
.socials .social:hover { transform:translateY(-2px); box-shadow:none; border-color:var(--cl-accent); }
.accordion-item { border:1px solid var(--store-line); border-radius:12px!important; overflow:hidden; margin-bottom:12px; background:var(--cl-background-secondary); }
.accordion-button,.accordion-button-2 { background:#141414; color:var(--store-text); padding:22px; font-size:15px; line-height:1.5; }
.accordion-button:not(.collapsed) { color:#ddc3f4; background:rgba(var(--cl-accent-rgb),.09); box-shadow:none; }
.accordion-body { color:var(--store-muted); font-size:14px; line-height:1.85; padding:0 22px 22px; }
.modal-content { background:#141414; border:1px solid rgba(var(--cl-accent-rgb),.3); box-shadow:0 24px 100px rgba(0,0,0,.6); }
.modal-header { gap:16px; }
.btn-close { filter:none; min-width:24px; }
.search-empty { padding:24px; text-align:center; color:var(--store-muted); }
.hero .search-modal .product { padding:14px; border-radius:10px; border:1px solid var(--store-line); background:rgba(255,255,255,.02); }
.hero .search-modal .product:hover { background:rgba(var(--cl-accent-rgb),.1); }
.hero .search-modal .product h3 { font-size:15px; overflow-wrap:anywhere; }
.hero .search-modal .product-thumb { height:56px; width:72px; flex-shrink:0; }
.hero .search-modal .product-thumb img { width:100%; height:100%; object-fit:cover; border-radius:7px; }
.form-control,.form-select { border-color:var(--store-line); border-radius:10px; min-height:44px; }
.form-control:focus,.form-select:focus { border-color:var(--cl-accent); box-shadow:0 0 0 3px rgba(var(--cl-accent-rgb),.2); }
footer.footer { border-top:1px solid var(--store-line); background:rgba(20,20,20,.55); margin-top:32px; }
.footer .logo p { max-width:420px; line-height:1.8; }
.footer h5 { font-size:13px; font-weight:500; color:#f7f5fa; }
.footer .nav li a { color:var(--store-muted); font-size:13px; }
.footer .border-top { border-color:var(--store-line)!important; }
@media(min-width:992px) { .hero.alignment-left .hero-actions { justify-content:flex-start; } .hero.alignment-right .hero-actions { justify-content:flex-end; } }
@media(max-width:991px) { .navbar .navbar-collapse { padding:16px 0 8px; } .navbar .navbar-nav { align-items:stretch; gap:4px!important; } .navbar .navbar-collapse .navbar-nav { width:100%; } .navbar .currency-selector { width:100%; } .offer-strip { margin-left:20px; margin-right:20px; } }
@media(max-width:575px) { .container { padding-left:20px; padding-right:20px; } .hero .container { padding:56px 20px 44px; } .hero .content h1 { letter-spacing:-1.3px; } .hero .content .hero-description { font-size:15px; } .hero-eyebrow { font-size:8px; letter-spacing:1.2px; } .hero-actions { gap:10px; } .hero .content .hero-actions a { width:100%; } .search-hint { display:none; } .py-20 { padding-top:40px; padding-bottom:40px; } .offer-strip { align-items:flex-start; flex-wrap:wrap; gap:12px; padding:18px; } .offer-strip p { flex:1; min-width:170px; font-size:12px; } .offer-strip a { margin-left:0; } .modal-dialog.modal-xl { max-width:calc(100% - 24px); } .store-product-card .card-img-top { aspect-ratio:16/9; } .features .list .feature { padding:24px; } .search-modal .product .left { min-width:0; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }

.custom-html:has(.offer-strip) { padding:0; }

/* Collection redesign: generous imagery, clearer prices and useful browsing. */
.catalog-section .section-title,.catalog-section .section-subtitle { text-align:left; }
.catalog-section .section-title h2 { font-size:clamp(30px,3.5vw,44px); letter-spacing:-1.6px; }
.catalog-section .section-subtitle { margin-bottom:30px; }
.catalog-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding:16px; background:rgba(20,20,20,.8); border:1px solid var(--store-line); border-radius:16px; }
.catalog-filters { display:flex; gap:4px; flex-wrap:wrap; }
.catalog-filter { min-height:42px; padding:10px 16px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--store-muted); font-size:13px; font-weight:500; transition:background .2s,color .2s; }
.catalog-filter:hover { color:white; background:rgba(255,255,255,.04); }
.catalog-filter.is-active { color:#eee0fa; background:rgba(var(--cl-accent-rgb),.23); border-color:rgba(var(--cl-accent-rgb),.35); }
.catalog-controls { display:flex; gap:10px; flex-wrap:wrap; }
.catalog-search { display:flex; align-items:center; gap:10px; padding:0 13px; background:#0b0b0b; border:1px solid var(--store-line); border-radius:10px; color:#b6a0c9; }
.catalog-search:focus-within { border-color:#b77dea; }
.catalog-search input { width:180px; max-width:100%; min-height:42px; color:#f7f5fa; background:none; border:0; font:inherit; font-size:13px; }
.catalog-search input::placeholder { color:#a59cab; }
.catalog-sort { min-height:44px; padding:8px 30px 8px 12px; background:#0b0b0b; color:#ddd3e6; border:1px solid var(--store-line); border-radius:10px; font-size:12px; }
.catalog-result-line { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#a59cab; font-size:11px; letter-spacing:.2px; padding:20px 2px; }
.catalog-result-count { color:#d9cbe6; }
.products > .catalog-item[hidden],.catalog-toolbar[hidden],.catalog-result-line[hidden],.catalog-empty[hidden] { display:none!important; }
.products .catalog-card { border-radius:20px; border-color:rgba(255,255,255,.1); background:linear-gradient(150deg,#19151d,#121212 70%); }
.products .catalog-card:hover,.products .catalog-card:focus-visible { border-color:rgba(var(--cl-accent-rgb),.9); box-shadow:0 18px 48px rgba(0,0,0,.35),0 0 0 1px rgba(var(--cl-accent-rgb),.12); transform:translateY(-5px); }
.products .catalog-card .card-img-top { aspect-ratio:16/9; background:#17111d; border-bottom:1px solid rgba(255,255,255,.08); }
.products .catalog-card .card-img-top img { border-radius:0; object-fit:contain; }
.products .catalog-card .card-body { padding:24px; gap:0; }
.catalog-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:13px; }
.catalog-kind { color:#b59acb; font-size:9px; font-weight:500; letter-spacing:1.3px; }
.catalog-stock { display:inline-flex; align-items:center; gap:6px; color:#c7bed0; font-size:10px; white-space:nowrap; }
.stock-dot { width:5px; height:5px; background:#9cd4b8; border-radius:50%; }
.catalog-stock.is-unavailable { color:#b9a6b2; }
.catalog-stock.is-unavailable .stock-dot { background:#b9a6b2; }
.products .catalog-card .card-title { min-height:2.7em; margin:0 0 18px; color:#f7f5fa; font-size:19px; font-weight:600; line-height:1.35; letter-spacing:-.35px; }
.catalog-price-row { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:auto; padding-top:17px; border-top:1px solid rgba(255,255,255,.075); }
.catalog-price-label { display:block; color:#b6acbf; font-size:11px; margin-bottom:4px; }
.products .catalog-card .catalog-price { color:#eee0fc!important; font-size:25px; font-weight:600; font-style:normal!important; line-height:1.3; margin:0; letter-spacing:-.65px; }
.catalog-price s { display:inline-block; margin-left:6px; color:#998fa3; font-size:13px; font-weight:400; letter-spacing:0; }
.catalog-arrow { display:grid; place-items:center; width:38px; height:38px; color:#c397e9; border:1px solid rgba(var(--cl-accent-rgb),.2); background:rgba(var(--cl-accent-rgb),.07); border-radius:50%; font-size:21px; }
.catalog-cta { display:flex; justify-content:space-between; align-items:center; gap:14px; min-height:44px; padding:11px 14px; margin-top:20px; border-radius:10px; border:1px solid rgba(var(--cl-accent-rgb),.32); background:rgba(var(--cl-accent-rgb),.13); color:#dfc5f5; font-size:12px; font-weight:500; transition:background .2s,border-color .2s; }
.catalog-card:hover .catalog-cta,.catalog-card:focus-visible .catalog-cta { color:white; background:var(--cl-accent); border-color:var(--cl-accent); }
.catalog-empty { text-align:center; padding:56px 24px; border:1px dashed rgba(var(--cl-accent-rgb),.35); border-radius:18px; background:rgba(var(--cl-accent-rgb),.04); }
.catalog-empty h3 { font-size:24px; }.catalog-empty p { color:var(--store-muted); font-size:14px; }
@media(max-width:767px) { .catalog-toolbar { padding:12px; gap:12px; } .catalog-controls { width:100%; } .catalog-search { flex:1; min-width:150px; } .catalog-search input { width:100%; min-width:0; } .catalog-filter { padding:10px 12px; font-size:12px; } .products .catalog-card .card-body { padding:19px; } .products .catalog-card .card-title { font-size:17px; } .catalog-sort { max-width:140px; } }
@media(max-width:575px) { .catalog-section .section-title h2 { letter-spacing:-1px; } .catalog-result-line > span:last-child { display:none; } .products .catalog-card .card-title { min-height:0; } .catalog-controls { flex-wrap:nowrap; gap:8px; } .catalog-sort { width:108px; padding-right:8px; } }

/* Ambient depth: transform-only motion, no canvas rendering loop. */
body { isolation:isolate; }
.ambient-scene { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.ambient-orb { position:absolute; width: min(850px,90vw); aspect-ratio:1; border-radius:50%; opacity:.7; background:radial-gradient(circle,rgba(var(--cl-accent-rgb),.2),rgba(var(--cl-accent-rgb),.055) 42%,transparent 68%); animation:ambient-drift 22s ease-in-out infinite alternate; }
.ambient-orb-one { top:-25%; left:-20%; }
.ambient-orb-two { bottom:-30%; right:-24%; animation-delay:-11s; animation-duration:28s; opacity:.5; }
.ambient-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(var(--cl-accent-rgb),.055) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--cl-accent-rgb),.055) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(transparent,#000 35%,transparent 95%); }
@keyframes ambient-drift { from { transform:translate3d(0,0,0) scale(1); } to { transform:translate3d(15%,12%,0) scale(1.2); } }
.motion-controls { padding:12px 20px 24px; text-align:center; }
.motion-toggle { color:#b8a7c6; background:transparent; border:1px solid var(--store-line); border-radius:99px; padding:8px 14px; font-size:11px; }
.motion-toggle[hidden] { display:none; }
.motion-paused .ambient-orb,.motion-paused .product-stage::before,.page-inactive .ambient-orb,.page-inactive .product-stage::before { animation-play-state:paused!important; }
.product-experience .product-layout { padding:28px 0 64px; }
.product-breadcrumb { display:flex; flex-wrap:wrap; gap:12px; align-items:center; color:#978bA3; font-size:12px; margin-bottom:30px; }
.product-breadcrumb a { color:#bcaaca; text-decoration:none; transition:color .2s; }
.product-breadcrumb a:hover { color:#e5c9fc; }.product-breadcrumb [aria-current] { color:#e0d3ea; overflow-wrap:anywhere; }
.product-experience .product-main-grid { align-items:flex-start; row-gap:28px; }
.product-stage { position:relative; padding:20px; border:1px solid rgba(var(--cl-accent-rgb),.35); border-radius:24px; background:linear-gradient(150deg,rgba(var(--cl-accent-rgb),.14),#131015 75%); overflow:hidden; margin-bottom:24px; }
.product-stage::before { content:""; position:absolute; width:80%; aspect-ratio:1; top:-55%; right:-35%; border:1px solid rgba(var(--cl-accent-rgb),.28); box-shadow:0 0 0 35px rgba(var(--cl-accent-rgb),.035),0 0 0 75px rgba(var(--cl-accent-rgb),.025); border-radius:50%; animation:stage-orbit 15s ease-in-out infinite alternate; pointer-events:none; }
@keyframes stage-orbit { to { transform:translate(-20%,30%) rotate(20deg); } }
.stage-caption { position:relative; display:flex; justify-content:space-between; color:#c3a3dd; font-size:9px; letter-spacing:2px; margin:0 4px 18px; }
.stage-caption > span:last-child { font-size:15px; }
.product-stage > img,.product-stage > .product-img-placeholder,.product-stage .carousel-inner { position:relative; border-radius:15px; border:1px solid rgba(255,255,255,.08); }
.product-experience .product-stage > .card-img-top { width:100%; height:auto; aspect-ratio:16/11; object-fit:contain; background:rgba(11,11,11,.35); margin:0!important; }
.product-stage .carousel { margin-bottom:0!important; }
.product-stage .carousel-item img { aspect-ratio:16/11; object-fit:contain; background:rgba(11,11,11,.35); }
.product-stage .product-img-placeholder { display:grid; place-items:center; }
.product-stage .product-img-placeholder svg { width:100px; height:100px; }
.product-stage .thumbnails { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:16px 0 0; }
.product-stage .thumbnails button { width:64px; height:48px; padding:3px; background:#17111d; border:1px solid var(--store-line); border-radius:8px; transition:transform .2s,border-color .2s; }
.product-stage .thumbnails button img { width:100%; height:100%; object-fit:contain; border-radius:5px; }
.product-stage .thumbnails button.active { border-color:#b77dea; box-shadow:0 0 0 2px rgba(var(--cl-accent-rgb),.16); }
.product-stage .thumbnails button:hover { transform:translateY(-3px); border-color:#b77dea; }
.product-details { padding:28px; border:1px solid var(--store-line); border-radius:20px; background:rgba(20,20,20,.85); }
.product-eyebrow { display:block; color:#bb8de1; font-size:10px; letter-spacing:1.8px; font-weight:500; margin-bottom:13px; }
.details-heading h2 { color:#f4edf9; font-size:24px; letter-spacing:-.65px; margin-bottom:24px; }
.product-details .editor { font-size:14px; line-height:1.85; color:#c8bdcf; overflow-wrap:anywhere; }
.product-details .editor img,.product-details .editor video { max-width:100%; height:auto; }
.product-details .editor table { display:block; max-width:100%; overflow-x:auto; }
.product-details .editor h2,.product-details .editor h3 { color:#f4edf9; font-size:20px; }
.product-details .product-tabs { margin-bottom:0!important; }
.product-details .product-tabs .btn { font-size:12px; padding:10px 14px; }
.product-purchase-panel { position:relative; padding:34px; border:1px solid rgba(var(--cl-accent-rgb),.33); border-radius:24px; background:linear-gradient(160deg,#201527,#141414 50%); box-shadow:0 24px 80px rgba(0,0,0,.25); }
.product-purchase-panel::before { content:""; position:absolute; height:2px; top:-1px; left:12%; right:12%; background:linear-gradient(90deg,transparent,#b47ae2,transparent); }
.product-purchase-panel h1 { color:#fbf7ff; font-size:clamp(30px,3.3vw,44px); line-height:1.12; letter-spacing:-1.6px; margin:0 0 15px; overflow-wrap:anywhere; }
.product-intro { font-size:13px; color:#b9a9c3; line-height:1.7; margin-bottom:24px; }
.product-total { padding:22px 0; border-top:1px solid var(--store-line); border-bottom:1px solid var(--store-line); }
.product-total-label { display:block; font-size:11px; color:#b4a2c0; margin-bottom:8px; }
.product-total .fs-5 { font-size:34px!important; font-weight:600; letter-spacing:-1px; color:#ead3ff; }
.product-total .stock-indicator { font-size:10px; background:rgba(var(--cl-accent-rgb),.1); border:1px solid rgba(var(--cl-accent-rgb),.3); color:#c9a9e1; border-radius:99px; padding:6px 10px; cursor:default; }
.product-purchase-panel .form-label { font-size:12px; font-weight:500; color:#d1bddf; margin-bottom:10px; }
.product-purchase-panel .variants { gap:10px; }
.product-purchase-panel .variant { position:relative; width:100%; margin:0; padding:16px 42px 16px 16px; display:flex; justify-content:space-between; align-items:center; gap:12px; text-align:left; color:#eee4f5; background:rgba(11,11,11,.4); border:1px solid rgba(255,255,255,.1); border-radius:12px; box-shadow:none; transition:transform .2s,border-color .2s,background .2s; }
.product-purchase-panel .variant.active { background:linear-gradient(110deg,rgba(var(--cl-accent-rgb),.23),rgba(var(--cl-accent-rgb),.055)); border-color:var(--cl-accent); box-shadow:inset 3px 0 0 var(--cl-accent); }
.product-purchase-panel .variant .name { font-size:14px; font-weight:500; margin:0; }
.product-purchase-panel .variant .description,.product-purchase-panel .variant .stock { font-size:10px; margin:5px 0 0; line-height:1.6; }
.product-purchase-panel .variant .price { font-size:14px; color:#ddc0f3; font-style:normal; text-align:right; white-space:nowrap; }
.product-purchase-panel .variant .active-indicator { position:absolute; top:50%; right:12px; transform:translateY(-50%); }
.product-purchase-panel .variant .active-indicator svg { width:18px; height:18px; }
.product-purchase-panel .variant:disabled { opacity:.4; cursor:not-allowed; }
.product-purchase-panel .input-group .btn { min-width:44px; }
.product-purchase-panel form button[type="submit"] { position:relative; min-height:52px; overflow:hidden; color:#fff; background:var(--cl-accent); border:1px solid #9a50dc; box-shadow:0 6px 24px rgba(var(--cl-accent-rgb),.2); }
.product-purchase-panel form button[type="submit"]::after { content:""; position:absolute; top:0; bottom:0; width:30%; left:-60%; background:linear-gradient(110deg,transparent,rgba(255,255,255,.18),transparent); transform:skewX(-20deg); transition:left .65s; pointer-events:none; }
.product-purchase-panel form button[type="submit"]:hover:not(:disabled)::after { left:130%; }
.product-purchase-panel form .w-100.btn { min-height:52px; }
.product-help { display:flex; justify-content:space-between; align-items:center; gap:16px; text-decoration:none; margin-top:24px; padding:18px; background:rgba(var(--cl-accent-rgb),.06); border:1px solid var(--store-line); border-radius:12px; color:#dfc5f3; transition:border-color .2s,background .2s; }
.product-help strong { display:block; font-size:12px; font-weight:500; }.product-help small { display:block; font-size:11px; color:#b6a7c0; margin-top:4px; }
.product-help:hover { background:rgba(var(--cl-accent-rgb),.14); border-color:var(--cl-accent); color:white; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .product-purchase-panel .variant:hover:not(:disabled) { transform:translateX(3px); border-color:#a262da; } .catalog-card .card-img-top::after { content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%); transform:translateX(-110%); transition:transform .7s; pointer-events:none; } .catalog-card:hover .card-img-top::after { transform:translateX(110%); } }
@media(max-width:991px) { .product-purchase-column { order:-1; } .product-purchase-panel { padding:26px; } .product-experience .product-layout { padding-top:20px; } }
@media(max-width:575px) { .product-purchase-panel,.product-details { padding:22px; border-radius:18px; } .product-stage { padding:14px; border-radius:18px; } .product-purchase-panel h1 { letter-spacing:-1px; } .product-breadcrumb { font-size:10px; gap:8px; } .product-purchase-panel .variant { flex-wrap:wrap; } .product-experience .product-layout { padding-bottom:36px; } .ambient-grid { background-size:48px 48px; } }
@media(prefers-reduced-motion:reduce) { .ambient-orb,.product-stage::before { animation:none!important; } .product-experience *, .catalog-card * { transition:none!important; } }
