body[data-page="shop"] .shop-section.catalog-section {
  --shop-accent: #c6a5ff;
  padding-block-start: clamp(13px, 1.6vw, 24px);
  background: radial-gradient(ellipse 820px 500px at 86% 0, #271739, transparent 86%),
    radial-gradient(ellipse 620px 410px at 9% 38%, #22152e, transparent 87%), #100d16;
}

body[data-page="shop"] .catalog-heading.shop-stage {
  min-height: clamp(150px, 14.3vw, 199px);
  margin-bottom: 9px;
  border-color: transparent;
  background: linear-gradient(100deg, #160e22, #100a1c) padding-box,
    linear-gradient(115deg, #a06de1, #542e70 42%, #a78bdd 72%, #85e9d7) border-box;
  box-shadow: 0 14px 45px #09050f8a, 0 0 22px #8f57d82b;
}

.shop-stage-art {
  inset: 0;
  width: 100%;
  object-position: 66% 47%;
}

.shop-stage::before {
  background: linear-gradient(90deg, #140d20 0%, #140d20ec 22%, #140d2094 42%, transparent 68%),
    linear-gradient(0deg, #100a1e88, transparent 45%);
}

.shop-stage-optics {
  position: absolute;
  z-index: 2;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.shop-stage-optics::before {
  position: absolute;
  inset: 8px;
  border: 1px solid #d9b8fb24;
  border-radius: clamp(9px, 1.35vw, 17px);
  content: "";
  mask-image: linear-gradient(96deg, #0009, transparent 40%, transparent 68%, #000);
}

.shop-stage-orbit {
  position: absolute;
  right: 9%;
  top: -59%;
  width: min(56%, 640px);
  aspect-ratio: 1.8;
  border: 1px solid #ecd6ff42;
  border-radius: 50%;
  rotate: -17deg;
  box-shadow: 0 0 0 15px #d9bcff12, 0 0 0 35px #92f5d914;
}

.shop-stage-spark {
  position: absolute;
  right: 20%;
  top: 19%;
  width: 13px;
  aspect-ratio: 1;
  color: #e4fff7;
  filter: drop-shadow(0 0 6px #a4f7df);
}

.shop-stage-spark:last-child {
  right: 43%;
  top: 70%;
  width: 10px;
  color: #e5c9ff;
  filter: drop-shadow(0 0 6px #c795ff);
}

.shop-stage-spark::before {
  display: block;
  height: 100%;
  background: currentColor;
  clip-path: polygon(50% 0, 57% 43%, 100% 50%, 57% 57%, 50% 100%, 43% 57%, 0 50%, 43% 43%);
  content: "";
}

.shop-stage-copy,
.shop-stage #product-count.catalog-result-count { z-index: 3; }

.shop-stage-copy { max-width: min(55%, 600px); }
.shop-stage h1 {
  font-size: clamp(35px, 5.55vw, 78px);
  line-height: .94;
  letter-spacing: -.075em;
}

@supports (background-clip: text) {
  .shop-stage h1 {
    color: transparent;
    background: linear-gradient(110deg, #fff 12%, #f1dbff 61%, var(--shop-accent)) no-repeat;
    background-clip: text;
  }
}

.filter-button[data-filter="listen"] { --filter-accent: #c7a9ff; }
.filter-button[data-filter="unwind"] { --filter-accent: #e9b8f3; }
.filter-button[data-filter="create"] { --filter-accent: #a8b5ff; }
.filter-button[data-filter="move"] { --filter-accent: #8be7d4; }
.filter-button[data-filter="home"] { --filter-accent: #d5b8ff; }

.catalog-section > .wrap:has([data-filter="listen"][aria-pressed="true"]) { --shop-accent: #c7a9ff; }
.catalog-section > .wrap:has([data-filter="unwind"][aria-pressed="true"]) { --shop-accent: #f1b7f5; }
.catalog-section > .wrap:has([data-filter="create"][aria-pressed="true"]) { --shop-accent: #a8b5ff; }
.catalog-section > .wrap:has([data-filter="move"][aria-pressed="true"]) { --shop-accent: #9cf9e2; }
.catalog-section > .wrap:has([data-filter="home"][aria-pressed="true"]) { --shop-accent: #d5b8ff; }

body[data-page="shop"] .catalog-panel {
  gap: 7px 10px;
  padding: 6px;
  margin-bottom: 13px;
  border: 1px solid #4e3c66;
  border-radius: 14px;
  background: linear-gradient(110deg, #241733, #17111f 76%);
  box-shadow: inset 0 1px #e1bdff20, 0 6px 18px #09071077;
}

body[data-page="shop"] .catalog-panel .filter-button,
body[data-page="shop"] .catalog-panel :is(.search-field, .sort-field select) { border-radius: 9px; }

body[data-page="shop"] .catalog-panel .filter-button svg { color: var(--filter-accent, #d9bdff); }
body[data-page="shop"] .catalog-panel .filter-button.active svg { color: #28574e; }

body[data-page="shop"] .catalog-panel .search-field:focus-within {
  outline: none;
  border-color: var(--shop-accent);
  box-shadow: inset 0 1px #fff2, 0 0 0 2px #c7a9ff46;
}

body[data-page="shop"] .catalog-group-header {
  padding: 8px 10px;
  margin-bottom: 9px;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(104deg, color-mix(in srgb, var(--collection-accent) 14%, #1a1321), transparent 82%);
}

body[data-page="shop"] .catalog-group-header::after {
  width: min(58%, 490px);
  background: linear-gradient(90deg, var(--collection-accent), #a5f5db49 55%, transparent);
}

body[data-page="shop"] .catalog-section .catalog-items { gap: clamp(9px, 1.05vw, 15px); }

body[data-page="shop"] .curated-card {
  overflow: hidden;
  border-radius: 15px;
  background: linear-gradient(166deg, #231a31, #1b1424 72%) padding-box,
    linear-gradient(147deg, color-mix(in srgb, var(--collection-accent) 42%, #40304b), #33263d 54%, #513866) border-box;
}

body[data-page="shop"] .curated-card:is(:hover, :focus-within) {
  border-color: color-mix(in srgb, var(--collection-accent) 76%, #493259);
  box-shadow: 0 10px 30px #0a071198, 0 0 24px color-mix(in srgb, var(--collection-accent) 19%, transparent);
}

body[data-page="shop"] .curated-card .product-picture { aspect-ratio: 1.78; border-radius: 0; }

body[data-page="shop"] .curated-card .product-picture:not(.product-picture--lifestyle)::before {
  inset: 15% 21%;
  border-color: #5d44742c;
  box-shadow: 0 0 0 9px #6645810e, 0 0 0 20px #5d44740c, 0 0 0 34px #5d447408;
}

body[data-page="shop"] .curated-card-copy {
  gap: 4px;
  padding: clamp(8px, .95vw, 13px);
  border-top: 1px solid #eee4ff25;
}

body[data-page="shop"] .curated-quick {
  margin-block: 1px;
  padding-inline: 8px;
  border-color: #e0c1ff33;
  border-radius: 9px;
  background: #ead5ff0a;
}

body[data-page="shop"] .curated-quick:is(:hover, :focus-visible) {
  border-color: #e0c1ff85;
  background: #3b2a4b;
}

body[data-page="shop"] .curated-quick:focus-visible,
body[data-page="shop"] .curated-card .product-title a:focus-visible { outline-offset: 2px; }

body[data-page="shop"] .catalog-more { justify-content: flex-end; gap: 9px; }

@media (max-width: 999px) {
  body[data-page="shop"] .catalog-panel { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
  body[data-page="shop"] .catalog-heading.shop-stage {
    min-height: 151px;
    padding: 15px 13px 29px;
  }

  .shop-stage::before {
    background: linear-gradient(90deg, #140d20 0%, #140d20df 31%, #140d208a 64%, #140d201f 100%);
  }

  .shop-stage-orbit { top: -20%; }
  .shop-stage-copy { max-width: 85%; }
  .shop-stage h1 { font-size: clamp(34px, 8.35vw, 49px); }

  .shop-stage #product-count.catalog-result-count {
    inset: auto 8px 7px auto;
    padding: 3px 7px;
    font-size: 10px;
  }

  body[data-page="shop"] .catalog-panel .filter-tabs {
    width: auto;
    margin-inline: -2px;
    padding: 3px 2px;
  }

  body[data-page="shop"] .catalog-panel .filter-button { padding-inline: 9px; }
  body[data-page="shop"] .catalog-group-header { padding-inline: 7px; }
  body[data-page="shop"] .curated-card { border-radius: 12px; }
  body[data-page="shop"] .curated-card .product-picture { aspect-ratio: 1.36; }
}

@media (prefers-reduced-motion: no-preference) {
  body[data-page="shop"] .shop-stage-copy { animation: none; }

  .shop-stage-copy > * {
    animation: shop-copy-arrive 590ms cubic-bezier(.16, 1, .3, 1) both;
  }

  .shop-stage-copy > h1 { animation-delay: 45ms; }
  .shop-stage-copy > .catalog-description { animation-delay: 90ms; }

  body[data-page="shop"] .shop-stage-art {
    scale: 1.06;
    translate: var(--shop-drift-x, 0px) var(--shop-drift-y, 0px);
    animation: shop-prism-arrive 1100ms cubic-bezier(.16, 1, .3, 1) backwards;
    transition: translate .65s cubic-bezier(.16, 1, .3, 1);
  }

  .shop-stage-orbit {
    translate: var(--shop-orbit-x, 0px) var(--shop-orbit-y, 0px);
    animation: shop-orbit-arrive 1300ms cubic-bezier(.16, 1, .3, 1) backwards;
    transition: translate .78s cubic-bezier(.16, 1, .3, 1);
  }

  .shop-stage-spark { animation: shop-spark-flare 1300ms ease-in-out 180ms 2 both; }
  .shop-stage-spark:last-child { animation-delay: 480ms; }

  body[data-page="shop"] .shop-stage::after,
  .shop-stage-optics::after,
  body[data-page="shop"] .product-photo-link::before {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
  }

  body[data-page="shop"] .shop-stage::after,
  body[data-page="shop"] .product-photo-link::before {
    background: radial-gradient(circle at var(--shop-x, 65%) var(--shop-y, 45%), #d6a1ff45, #a9ffec16 22%, transparent 43%);
    opacity: 0;
    mix-blend-mode: screen;
    transition: opacity .45s ease;
  }

  body[data-page="shop"] .shop-stage::after { z-index: 2; animation: none; }
  body[data-page="shop"] .product-photo-link::before { z-index: 1; }

  body[data-page="shop"] .shop-stage[data-shop-pointed]::after,
  body[data-page="shop"] .product-picture[data-shop-pointed] .product-photo-link::before { opacity: 1; }

  .shop-stage-optics::after {
    left: 28%;
    background: linear-gradient(116deg, transparent 34%, #a18aff1e 46%, #e2fbff58 50%, #8aefdb1f 54%, transparent 66%);
    opacity: 0;
    animation: shop-stage-glint 1050ms cubic-bezier(.2, .65, .24, 1) 125ms both;
  }

  body[data-page="shop"] .catalog-group-header { animation: none; }

  body[data-page="shop"] .catalog-group-header.experience-inview::after {
    transform-origin: left;
    animation: shop-accent-draw 620ms cubic-bezier(.16, 1, .3, 1) both;
  }
}

@keyframes shop-prism-arrive {
  from { opacity: .48; scale: 1.13; }
  to { opacity: 1; scale: 1.06; }
}

@keyframes shop-orbit-arrive {
  from { opacity: 0; scale: .87; rotate: -22deg; }
  to { opacity: 1; scale: 1; rotate: -17deg; }
}

@keyframes shop-spark-flare {
  0%, 100% { opacity: .63; scale: .82; }
  47% { opacity: 1; scale: 1.3; }
}

@keyframes shop-accent-draw {
  from { opacity: .22; scale: .15 1; }
  to { opacity: .75; scale: 1 1; }
}