:root {
  --cuci-primary: #67b7ff;
  --cuci-secondary: #f2c052;
  --cuci-accent: #7c6cff;
  --cuci-panel: #0b123d;
}
body {
  background:
    radial-gradient(circle at 10% 4%, color-mix(in srgb, var(--cuci-primary) 16%, transparent), transparent 32rem),
    radial-gradient(circle at 92% 20%, color-mix(in srgb, var(--cuci-accent) 12%, transparent), transparent 28rem),
    #030817;
}
.header-alt,
.header-alt__bottom-bar,
.menu-alt,
.footer,
.cuci-site-footer {
  background-color: #040c1d;
  border-color: color-mix(in srgb, var(--cuci-primary) 30%, transparent);
}
.header-alt__logo-img {
  width: auto;
  max-width: 220px;
  height: auto;
  object-fit: contain;
}
.product-details-carousel,
.product__image,
.product-details-carousel__item {
  background: linear-gradient(145deg, var(--cuci-panel), #020714);
  border-color: color-mix(in srgb, var(--cuci-primary) 55%, transparent);
  box-shadow: 0 18px 52px color-mix(in srgb, var(--cuci-primary) 19%, transparent);
}
.product-details-carousel img,
.product__image img,
.js-main-image img {
  filter: saturate(1.1) contrast(1.1) hue-rotate(4deg);
}
.btn-primary,
.m-btn,
.footer-mobile__item a,
.header-alt__quick-bar-link--account {
  background: linear-gradient(135deg, var(--cuci-primary), var(--cuci-accent));
  border-color: var(--cuci-primary);
}
.btn-secondary {
  border-color: var(--cuci-secondary);
  color: var(--cuci-secondary);
}
.breadcrumb__link,
.breadcrumb__inner,
.cuci-article h2,
.cuci-article h3,
.cuci-faq summary,
.section-label {
  color: var(--cuci-secondary);
}
.cuci-article {
  border-color: color-mix(in srgb, var(--cuci-primary) 34%, transparent);
  background: linear-gradient(145deg, color-mix(in srgb, var(--cuci-panel) 93%, black), #050b18);
  box-shadow: 0 24px 70px rgba(0,0,0,.35);
}
.cuci-article .section-label {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.cuci-article section {
  margin: 0 0 42px;
  scroll-margin-top: 120px;
}
.cuci-article .steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.cuci-article .step,
.cuci-article .faq-item,
.cuci-article .cta-panel {
  position: relative;
  padding: 20px;
  border: 1px solid color-mix(in srgb, var(--cuci-primary) 28%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--cuci-panel) 88%, black);
}
.cuci-article .step {
  padding-left: 58px;
}
.cuci-article .step-number {
  position: absolute;
  top: 19px;
  left: 20px;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  color: #03101c;
  background: var(--cuci-primary);
  font-weight: 900;
}
.cuci-article .step strong,
.cuci-article .faq-item h3 {
  display: block;
  margin: 0 0 7px;
}
.cuci-article .step p,
.cuci-article .faq-item p {
  margin: 0;
}
.cuci-article .faq-list {
  display: grid;
  gap: 12px;
}
.cuci-article .cta-panel {
  margin: 16px 0 48px;
  background: linear-gradient(135deg, var(--cuci-panel), #071126);
}
.cuci-article .button {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 20px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 800;
}
.cuci-article .button-primary {
  color: #03101c;
  background: linear-gradient(135deg, var(--cuci-secondary), #fff0a1);
}
@media (max-width: 768px) {
  .header-alt__logo-img { max-width: 170px; }
  .cuci-article .steps { grid-template-columns: 1fr; }
  .cuci-article .cta-panel { padding: 18px; }
}
