.az-category-home {
  padding-block: clamp(1.4rem, 4vw, 3.4rem) 1.4rem;
  background: radial-gradient(ellipse at 80% 5%, #e9dbf5, transparent 55%), #f9f5fc;
  color: #25143d;
}
.az-category-heading { display: flex; align-items: end; justify-content: space-between; gap: .7rem; margin-block-end: .9rem; }
.az-category-heading :is(h1, h2) { color: inherit; font-size: clamp(2rem, 4.2vw, 3.6rem); line-height: 1.1; margin: .2rem 0; }
.az-category-heading p { margin: 0; }
.az-category-kicker { color: #614481; font-size: .72rem; letter-spacing: .16em; font-weight: 800; }
.az-category-controls { display: flex; flex-wrap: wrap; justify-content: end; gap: .35rem; }
.az-category-controls[hidden] { display: none; }
.az-category-controls button {
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid #d4c2e7;
  background: #fff; color: #321b50; cursor: pointer; font-size: 1.1rem;
}
.az-category-controls button[aria-pressed="true"] { background: #43246b; color: #fff; }
[dir="ltr"] .az-category-controls [data-category-step] span,
[dir="ltr"] .az-category-cta b { display: inline-block; transform: scaleX(-1); }
.az-category-track {
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2rem) / 3.18);
  gap: 1rem; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory;
  scrollbar-color: #ad91ca transparent; list-style: none; margin: 0; padding: .35rem .25rem .8rem;
}
.az-category-slot { scroll-snap-align: start; min-width: 0; }
.az-category-card {
  display: block; position: relative; isolation: isolate; overflow: hidden;
  min-height: clamp(260px, 31vw, 360px); border-radius: 1.3rem; color: white;
  background: radial-gradient(ellipse at 50% 10%, var(--az-card-glow), transparent 74%), var(--az-card-base);
  text-decoration: none;
}
.az-category-creatine { --az-card-glow: #986bd0; --az-card-base: #321758; }
.az-category-protein { --az-card-glow: #a16b57; --az-card-base: #442248; }
.az-category-vitamins { --az-card-glow: #7b68b1; --az-card-base: #30255c; }
.az-category-performance { --az-card-glow: #7668bb; --az-card-base: #242451; }
.az-category-sports-food { --az-card-glow: #a65e91; --az-card-base: #542642; }
.az-category-accessories { --az-card-glow: #827092; --az-card-base: #30233f; }
.az-category-card::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, #20112c25 32%, #180e27f5 100%);
}
.az-category-media { position: absolute; inset: 0; z-index: -2; display: block; overflow: hidden; }
.az-category-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.az-category-pack .az-category-media { inset: 8% 10% 18%; border-radius: 1.1rem; }
.az-category-pack .az-category-media img { object-fit: contain; }
.az-category-protein .az-category-media img:first-child { object-position: 48% 45%; }
.az-category-protein .az-category-media img + img { object-fit: contain; background: #683c57; }
.az-category-media img + img { opacity: 0; }
.az-category-home[data-animate] .az-category-slot[data-visible] img + img { animation: az-category-crossfade 9s infinite; }
.az-category-home[data-paused] .az-category-slot[data-visible] img + img,
.az-category-card:hover .az-category-media img + img,
.az-category-card:focus-visible .az-category-media img + img { animation-play-state: paused; }
@keyframes az-category-crossfade {
  0%, 36%, 100% { opacity: 0; }
  48%, 86% { opacity: 1; }
}
.az-category-caption { position: absolute; inset-inline: 1rem; inset-block-end: .9rem; display: grid; gap: .3rem; }
.az-category-caption strong { color: #fff; font-size: clamp(1.3rem, 2.4vw, 2rem); line-height: 1.16; }
.az-category-cta { display: flex; align-items: center; gap: .55rem; font-size: .85rem; color: #f0e3ff; }
.az-category-card:focus-visible, .az-category-controls button:focus-visible { outline: 3px solid #824bb9; outline-offset: 3px; }
.az-category-links { display: flex; flex-wrap: wrap; gap: .8rem 1.3rem; font-weight: 700; font-size: .9rem; }
.az-category-links a { color: #542887; }
@media (max-width: 850px) {
  .az-category-track { grid-auto-columns: 44%; }
}
@media (max-width: 560px) {
  .az-category-track { grid-auto-columns: 80%; gap: .7rem; }
  .az-category-card { min-height: clamp(250px, 86vw, 380px); }
}
@media (prefers-reduced-motion: reduce) {
  .az-category-home[data-animate] .az-category-slot[data-visible] img + img { animation: none; }
}

/* Category artwork already includes its title. Keep the HTML title accessible. */
.az-category-card.az-category-art { aspect-ratio: 665 / 659; min-height: 0; }
.az-category-art .az-category-media img { object-fit: cover; object-position: center; }
.az-category-art::after { content: none; }
.az-category-art .az-category-caption {
  position: absolute; inset: auto; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}