:root {
DRFX STUDIO — CATEGORY PRODUCT CARDS V2
--color-bg: #050807;
CATEGORY PRODUCT CARDS V2
--color-brighter-bg: #0b100f;
  --color-text: #f5f8f7;
  --color-secondary-text: #94a09d;
  --color-primary: #4de1c2;
  --color-primary-hover: #76f0d8;
  --color-primary-text: #04110e;
  --color-primary-text-hover: #04110e;
  --color-sale-banner-bg: #4de1c2;
  --color-sale-banner-text: #04110e;
  --content-padding: clamp(20px, 4vw, 48px);
  --widget-padding: 24px;
  --drfx-max: 1240px;
  --drfx-surface: #0a0f0e;
  --drfx-surface-2: #0f1614;
  --drfx-surface-3: #131c19;
  --drfx-border: rgba(116, 255, 226, 0.12);
  --drfx-border-strong: rgba(116, 255, 226, 0.28);
  --drfx-muted: #94a09d;
  --drfx-glow: 0 0 80px rgba(77, 225, 194, 0.16);
  --drfx-shadow: 0 24px 80px rgba(0, 0, 0, 0.38);
  --drfx-hero-image: url("https://cdn.tebex.io/webstore/1189045/images/1189045-868e04b4f0efccafb84de3c5d0cf7b7e10575df2.png");
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--color-bg);
}

body {
  margin: 0;
  color: var(--color-text);
  background:
    radial-gradient(circle at 20% 12%, rgba(77, 225, 194, 0.06), transparent 30%),
    linear-gradient(180deg, #050807 0%, #070b0a 100%);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

body::before {
  display: none !important;
}

::selection {
  color: #03100d;
  background: var(--color-primary);
}

img {
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  color: var(--color-text);
  font-family: "Space Grotesk", system-ui, sans-serif;
  letter-spacing: -0.035em;
}

.site {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  overflow: hidden;
}

.drfx-shell {
  width: min(var(--drfx-max), calc(100% - (var(--content-padding) * 2)));
  margin-inline: auto;
}

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid var(--drfx-border);
  background: rgba(5, 8, 7, 0.86);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(18px);
}

.site-header-inner {
  display: flex;
  align-items: center;
  width: min(var(--drfx-max), calc(100% - (var(--content-padding) * 2)));
  min-height: 74px;
  margin-inline: auto;
  padding: 0;
  font-family: "DM Sans", system-ui, sans-serif;
}

.site-title {
  order: 1;
  position: relative;
  z-index: 4;
  margin: 0 auto 0 0;
  line-height: 1;
}

.site-title a {
  display: inline-flex;
  align-items: center;
}

.site-title img {
  display: block;
  width: auto;
  max-width: 148px;
  max-height: 48px;
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.35));
}

.site-header .actions {
  order: 0;
  display: none;
}

.site-header .user-actions,
.site-header .log-in {
  order: 5;
  position: relative;
  z-index: 4;
  margin-left: 10px;
}

.site-header .info {
  order: 4;
  position: relative;
  z-index: 4;
  display: grid;
  min-height: 44px;
  grid-template-columns: 30px auto;
  grid-template-areas: "icon title" "icon action";
  align-items: center;
  column-gap: 9px;
  margin-left: 12px;
  padding: 7px 12px;
  border: 1px solid var(--drfx-border);
  border-radius: 12px;
  background: rgba(12, 18, 16, 0.76);
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.site-header .info:hover {
  border-color: var(--drfx-border-strong);
  background: rgba(77, 225, 194, 0.08);
  transform: translateY(-1px);
}

.site-header .info .image {
  grid-area: icon;
  width: 28px;
  height: 28px;
}

.site-header .info .title {
  grid-area: title;
  color: var(--color-text);
  font-size: 12px;
  line-height: 1.05;
}

.site-header .info .action {
  grid-area: action;
  padding: 0;
  border: 0;
  color: var(--color-primary);
  background: transparent;
  font-size: 10px;
  line-height: 1.05;
}

.site-sale-banner {
  margin: 0;
  padding: 8px var(--content-padding);
  color: var(--color-sale-banner-text);
  background: var(--color-sale-banner-bg);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (min-width: 961px) {
  .navigation-horizontal {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 3;
    display: flex;
    height: 74px;
    align-items: center;
    transform: translateX(-50%);
  }

  .navigation-horizontal .menu {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 5px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.025);
    list-style: none;
  }

  .navigation-horizontal .menu > li {
    position: relative;
    margin: 0;
  }

  .navigation-horizontal .menu > li > a {
    display: block;
    padding: 9px 13px;
    border-radius: 9px;
    color: #aab3b1;
    font-size: 13px;
    font-weight: 700;
    transition: color 150ms ease, background 150ms ease;
  }

  .navigation-horizontal .menu > li > a:hover,
  .navigation-horizontal .menu > li.active > a,
  .navigation-horizontal a.link-active {
    color: var(--color-text);
    background: rgba(77, 225, 194, 0.1);
  }

  .navigation-horizontal .has-children > ul {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 210px;
    padding: 8px;
    border: 1px solid var(--drfx-border);
    border-radius: 12px;
    background: #09100e;
    box-shadow: var(--drfx-shadow);
  }
}

/* Buttons */
.btn-primary,
.btn-secondary,
.btn-tertiary,
.drfx-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 17px;
  border: 1px solid transparent;
  border-radius: 11px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.btn-primary,
.drfx-button-primary {
  color: var(--color-primary-text);
  background: var(--color-primary);
  box-shadow: 0 10px 30px rgba(77, 225, 194, 0.2);
}

.btn-primary:hover,
.btn-primary:focus,
.drfx-button-primary:hover {
  color: var(--color-primary-text-hover);
  background: var(--color-primary-hover);
  box-shadow: 0 14px 40px rgba(77, 225, 194, 0.28);
  transform: translateY(-2px);
}

.btn-secondary,
.btn-tertiary,
.drfx-button-ghost {
  color: var(--color-text);
  border-color: var(--drfx-border);
  background: rgba(255, 255, 255, 0.035);
}

.btn-secondary:hover,
.btn-tertiary:hover,
.drfx-button-ghost:hover {
  border-color: var(--drfx-border-strong);
  background: rgba(77, 225, 194, 0.07);
  transform: translateY(-2px);
}

.drfx-button-light {
  color: #07110f;
  background: #f5f8f7;
}

.drfx-button-light:hover {
  background: #ffffff;
  transform: translateY(-2px);
}

.drfx-button-outline {
  color: #07110f;
  border-color: rgba(7, 17, 15, 0.32);
  background: transparent;
}

.drfx-button-outline:hover {
  border-color: #07110f;
  background: rgba(7, 17, 15, 0.07);
  transform: translateY(-2px);
}

/* Homepage hero */
.drfx-home {
  flex: 1;
}

.drfx-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 720px;
  align-items: center;
  overflow: hidden;
  padding: 96px 0 82px;
  border-bottom: 1px solid var(--drfx-border);
  background-image:
    linear-gradient(90deg, rgba(3, 7, 6, 0.98) 0%, rgba(3, 7, 6, 0.9) 40%, rgba(3, 7, 6, 0.46) 72%, rgba(3, 7, 6, 0.72) 100%),
    linear-gradient(180deg, rgba(3, 7, 6, 0.15) 0%, #050807 100%),
    var(--drfx-hero-image);
  background-position: center;
  background-size: cover;
}

.drfx-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.3;
  background-image:
    linear-gradient(rgba(77, 225, 194, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(77, 225, 194, 0.07) 1px, transparent 1px);
  background-size: 62px 62px;
  mask-image: linear-gradient(90deg, #000 0%, transparent 72%);
}

.drfx-hero::after {
  content: "";
  position: absolute;
  right: 8%;
  bottom: -180px;
  z-index: -1;
  width: 620px;
  height: 620px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(77, 225, 194, 0.16), transparent 68%);
  filter: blur(8px);
}

.drfx-hero-noise {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.11;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  pointer-events: none;
}

.drfx-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
  align-items: center;
  gap: clamp(48px, 7vw, 110px);
}

.drfx-eyebrow,
.drfx-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--color-primary);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.drfx-eyebrow i {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 18px var(--color-primary);
}

.drfx-hero-copy h1 {
  max-width: 790px;
  margin: 22px 0 24px;
  font-size: clamp(52px, 6.2vw, 86px);
  line-height: 0.98;
}

.drfx-hero-copy h1 span {
  color: transparent;
  background: linear-gradient(110deg, var(--color-primary), #e9fff9 72%);
  -webkit-background-clip: text;
  background-clip: text;
}

.drfx-hero-copy > p {
  max-width: 640px;
  margin: 0;
  color: #b1bcba;
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.75;
}

.drfx-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.drfx-trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  margin-top: 34px;
  color: #8f9997;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.drfx-trust-row b {
  margin-right: 7px;
  color: var(--color-primary);
  font-family: "Space Grotesk", system-ui, sans-serif;
}

.drfx-hero-art {
  position: relative;
  display: grid;
  aspect-ratio: 1;
  place-items: center;
  max-width: 500px;
  margin-inline: auto;
  border: 1px solid rgba(77, 225, 194, 0.14);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, rgba(77, 225, 194, 0.13), rgba(7, 12, 10, 0.28) 48%, transparent 70%);
  box-shadow: inset 0 0 80px rgba(77, 225, 194, 0.05), var(--drfx-glow);
}

.drfx-hero-art::before,
.drfx-hero-art::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.drfx-hero-art::before {
  inset: 9%;
  border: 1px dashed rgba(77, 225, 194, 0.22);
}

.drfx-hero-art::after {
  inset: 24%;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.drfx-orbit {
  position: absolute;
  border: 1px solid rgba(77, 225, 194, 0.16);
  border-radius: 50%;
}

.drfx-orbit-one {
  inset: -7%;
  border-style: dashed;
  animation: drfx-spin 34s linear infinite;
}

.drfx-orbit-two {
  inset: 17%;
  animation: drfx-spin-reverse 22s linear infinite;
}

.drfx-orbit::before {
  content: "";
  position: absolute;
  top: 12%;
  left: 12%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 18px var(--color-primary);
}

.drfx-hero-logo-wrap {
  position: relative;
  z-index: 2;
  display: grid;
  width: 62%;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 34%;
  background: linear-gradient(145deg, rgba(15, 25, 22, 0.86), rgba(4, 8, 7, 0.92));
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5), inset 0 0 70px rgba(77, 225, 194, 0.06);
  transform: rotate(-5deg);
}

.drfx-hero-logo-wrap img {
  width: 76%;
  filter: drop-shadow(0 24px 30px rgba(0, 0, 0, 0.5));
  transform: rotate(5deg);
}

.drfx-art-chip {
  position: absolute;
  z-index: 3;
  padding: 9px 12px;
  border: 1px solid var(--drfx-border-strong);
  border-radius: 9px;
  color: #b9c7c4;
  background: rgba(6, 11, 9, 0.86);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(10px);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.drfx-art-chip-top {
  top: 16%;
  right: -2%;
}

.drfx-art-chip-bottom {
  bottom: 12%;
  left: -4%;
}

@keyframes drfx-spin {
  to { transform: rotate(360deg); }
}

@keyframes drfx-spin-reverse {
  to { transform: rotate(-360deg); }
}

/* Marquee */
.drfx-marquee {
  overflow: hidden;
  padding: 11px 0;
  color: #06100d;
  background: var(--color-primary);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  white-space: nowrap;
}

.drfx-marquee div {
  display: inline-block;
  min-width: 200%;
  animation: drfx-marquee 28s linear infinite;
}

.drfx-marquee span {
  margin-inline: 22px;
}

@keyframes drfx-marquee {
  to { transform: translateX(-50%); }
}

/* Shared homepage sections */
.drfx-section {
  position: relative;
  padding: 112px 0;
}

.drfx-section + .drfx-section {
  border-top: 1px solid rgba(255, 255, 255, 0.035);
}

.drfx-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  margin-bottom: 42px;
}

.drfx-section-heading h2,
.drfx-about-grid h2,
.drfx-faq-grid h2,
.drfx-final-cta h2 {
  margin: 10px 0 0;
  font-size: clamp(36px, 4vw, 58px);
  line-height: 1.05;
}

.drfx-section-heading > p {
  max-width: 530px;
  margin: 0;
  color: var(--drfx-muted);
}

.drfx-section-heading-centered {
  justify-content: center;
  text-align: center;
}

/* Categories */
.drfx-categories-section {
  background:
    radial-gradient(circle at 50% 0%, rgba(77, 225, 194, 0.08), transparent 36%),
    #080c0b;
}

.drfx-category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.drfx-category-card {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 330px;
  align-items: flex-end;
  overflow: hidden;
  padding: 28px;
  border: 1px solid var(--drfx-border);
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(10, 16, 14, 0.2) 20%, rgba(7, 11, 10, 0.98) 90%),
    linear-gradient(145deg, #101915, #080d0b);
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.26);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.drfx-category-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0;
  background: radial-gradient(circle at 70% 25%, rgba(77, 225, 194, 0.22), transparent 50%);
  transition: opacity 220ms ease;
}

.drfx-category-card:hover {
  border-color: var(--drfx-border-strong);
  box-shadow: 0 28px 74px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(77, 225, 194, 0.08);
  transform: translateY(-6px);
}

.drfx-category-card:hover::after {
  opacity: 1;
}

.drfx-category-image {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.64;
  transition: transform 320ms ease;
}

.drfx-category-card:hover .drfx-category-image {
  transform: scale(1.045);
}

.drfx-category-index {
  position: absolute;
  top: 22px;
  left: 24px;
  color: rgba(255, 255, 255, 0.35);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.drfx-category-gridmark {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  width: 160px;
  height: 160px;
  border: 1px solid rgba(77, 225, 194, 0.11);
  border-radius: 36px;
  background:
    linear-gradient(rgba(77, 225, 194, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(77, 225, 194, 0.07) 1px, transparent 1px);
  background-size: 22px 22px;
  box-shadow: inset 0 0 48px rgba(77, 225, 194, 0.06);
  transform: translate(-50%, -58%) rotate(10deg);
}

.drfx-category-content {
  display: flex;
  width: 100%;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.drfx-category-content strong {
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: clamp(25px, 2.2vw, 34px);
  letter-spacing: -0.035em;
}

.drfx-category-content small {
  color: var(--drfx-muted);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.drfx-category-content small b {
  margin-left: 5px;
  color: var(--color-primary);
}

/* Featured spotlight */
.drfx-spotlight-section {
  background: #050807;
}

.drfx-spotlight {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  min-height: 470px;
  overflow: hidden;
  border: 1px solid var(--drfx-border);
  border-radius: 24px;
  background: linear-gradient(135deg, #0d1512, #080c0b 60%);
  box-shadow: var(--drfx-shadow);
}

.drfx-spotlight-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(36px, 5vw, 72px);
}

.drfx-spotlight-copy h2 {
  margin: 14px 0 18px;
  font-size: clamp(40px, 4.5vw, 64px);
  line-height: 1.03;
}

.drfx-spotlight-copy p {
  max-width: 530px;
  margin: 0;
  color: var(--drfx-muted);
  font-size: 17px;
}

.drfx-spotlight-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
}

.drfx-price-pill {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 0 16px;
  border: 1px solid var(--drfx-border-strong);
  border-radius: 999px;
  color: var(--color-primary);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.drfx-spotlight-media {
  position: relative;
  min-height: 100%;
  overflow: hidden;
  background: #030504;
}

.drfx-spotlight-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #0b1210 0%, transparent 28%), linear-gradient(180deg, transparent 55%, rgba(4, 8, 7, 0.75));
}

.drfx-spotlight-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 420ms ease;
}

.drfx-spotlight-media:hover img {
  transform: scale(1.04);
}

.drfx-spotlight-media > span {
  position: absolute;
  right: 24px;
  bottom: 20px;
  z-index: 2;
  color: rgba(255, 255, 255, 0.62);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

/* Value cards */
.drfx-values-section {
  background: linear-gradient(180deg, #080c0b, #060908);
}

.drfx-value-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.drfx-value-grid article {
  min-height: 260px;
  padding: 32px;
  border: 1px solid var(--drfx-border);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(18, 27, 24, 0.88), rgba(8, 13, 11, 0.95));
  transition: border-color 180ms ease, transform 180ms ease;
}

.drfx-value-grid article:hover {
  border-color: var(--drfx-border-strong);
  transform: translateY(-4px);
}

.drfx-value-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid var(--drfx-border-strong);
  border-radius: 13px;
  color: var(--color-primary);
  background: rgba(77, 225, 194, 0.07);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 22px;
}

.drfx-value-grid h3 {
  margin: 46px 0 10px;
  font-size: 24px;
}

.drfx-value-grid p {
  margin: 0;
  color: var(--drfx-muted);
}

/* About, modules, FAQ */
.drfx-about-section {
  background:
    linear-gradient(90deg, rgba(5, 8, 7, 0.9), rgba(5, 8, 7, 0.72)),
    var(--drfx-hero-image) center 56% / cover;
}

.drfx-about-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  align-items: start;
  gap: clamp(42px, 8vw, 120px);
}

.drfx-about-copy {
  padding: 34px;
  border: 1px solid var(--drfx-border);
  border-radius: 18px;
  color: #b9c3c1;
  background: rgba(7, 12, 10, 0.82);
  box-shadow: var(--drfx-shadow);
  backdrop-filter: blur(14px);
}

.drfx-about-copy p:first-child {
  margin-top: 0;
}

.drfx-about-copy p:last-child {
  margin-bottom: 0;
}

.drfx-home-modules {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 18px;
}

.drfx-home-modules .widget {
  margin: 0;
}

.drfx-faq-section {
  background: #080c0b;
}

.drfx-faq-grid {
  display: grid;
  grid-template-columns: 0.75fr 1.25fr;
  gap: clamp(48px, 8vw, 120px);
}

.drfx-faq-grid > div:first-child > p {
  max-width: 400px;
  color: var(--drfx-muted);
}

.drfx-faq-list {
  border-top: 1px solid var(--drfx-border);
}

.drfx-faq-list details {
  border-bottom: 1px solid var(--drfx-border);
}

.drfx-faq-list summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 2px;
  color: var(--color-text);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: 19px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}

.drfx-faq-list summary::-webkit-details-marker {
  display: none;
}

.drfx-faq-list summary span {
  color: var(--color-primary);
  font-size: 24px;
  font-weight: 400;
}

.drfx-faq-list details[open] summary span {
  transform: rotate(45deg);
}

.drfx-faq-list details p {
  max-width: 720px;
  margin: -6px 0 26px;
  color: var(--drfx-muted);
}

.drfx-final-cta {
  position: relative;
  overflow: hidden;
  padding: 86px 0;
  color: #07110f;
  background: var(--color-primary);
}

.drfx-final-cta::after {
  content: "DRFX";
  position: absolute;
  right: -34px;
  bottom: -68px;
  color: rgba(5, 17, 14, 0.08);
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: clamp(150px, 20vw, 330px);
  font-weight: 800;
  line-height: 0.72;
  letter-spacing: -0.08em;
}

.drfx-final-cta-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.drfx-final-cta .drfx-kicker,
.drfx-final-cta h2 {
  color: #07110f;
}

.drfx-final-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* Standard Tebex pages */
.site-content {
  width: min(var(--drfx-max), calc(100% - (var(--content-padding) * 2)));
  margin-inline: auto;
  padding-top: 72px;
  padding-bottom: 96px;
}

.site-content-widgets {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: start;
  gap: 24px;
}

.store-products-grid,
.store-products-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.store-products-list {
  grid-template-columns: 1fr;
}

.store-product,
.store-product-full,
.store-product-tiered,
.category-description,
.store-text,
.no-products,
.store-form,
.widget,
.popup-content {
  border: 1px solid var(--drfx-border);
  border-radius: 17px;
  color: var(--color-text);
  background: linear-gradient(145deg, rgba(16, 24, 21, 0.96), rgba(8, 13, 11, 0.98));
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.28);
}

.category-description,
.store-text,
.no-products,
.store-form,
.widget-content,
.store-product-full,
.store-product-tiered {
  padding: var(--widget-padding);
}

.category-description,
.store-text {
  line-height: 1.75;
}

.category-description h1,
.category-description h2,
.category-description h3,
.store-text h1,
.store-text h2,
.store-text h3,
.store-product .descr h1,
.store-product .descr h2,
.store-product .descr h3 {
  color: var(--color-text);
}

.store-product {
  overflow: hidden;
  padding: 10px;
  transition: transform 190ms ease, border-color 190ms ease, box-shadow 190ms ease;
}

.store-product:hover {
  border-color: var(--drfx-border-strong);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.42);
  transform: translateY(-5px);
}

.store-product > .image,
.store-product .image img,
.store-product img.image {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  object-fit: cover;
}

.store-product .info,
.store-product .descr,
.store-product .actions {
  padding-inline: 10px;
}

.store-product .title,
.store-product h3,
.store-product h4 {
  font-family: "Space Grotesk", system-ui, sans-serif;
  line-height: 1.25;
}

.store-product .price {
  color: var(--color-text);
  font-size: 18px;
  font-weight: 800;
}

.store-product .actions {
  margin-top: auto;
  padding-bottom: 10px;
}

.store-product .btn,
.store-product .btn-primary,
.store-product .btn-secondary {
  width: 100%;
}

.navigation-vertical {
  padding: 12px;
  border: 1px solid var(--drfx-border);
  border-radius: 16px;
  background: var(--drfx-surface);
}

.navigation-vertical .menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.navigation-vertical .menu a {
  display: block;
  padding: 11px 13px;
  border-radius: 9px;
  color: #aab4b1;
  font-weight: 700;
}

.navigation-vertical .menu a:hover,
.navigation-vertical .menu .active a {
  color: var(--color-text);
  background: rgba(77, 225, 194, 0.09);
}

.widget {
  overflow: hidden;
  padding: 0;
}

.widget-title {
  margin: 0;
  padding: 17px 20px;
  border-bottom: 1px solid var(--drfx-border);
  color: var(--color-text);
  font-size: 16px;
}

.widget-content {
  background: transparent;
}

.widget + .widget {
  margin-top: 16px;
}

input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
select,
textarea,
.quantity-field {
  border: 1px solid var(--drfx-border);
  border-radius: 10px;
  color: var(--color-text);
  background: #070b0a;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--color-primary);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(77, 225, 194, 0.1);
}

.popup-content {
  overflow: hidden;
}

.popup-close {
  border-radius: 0 15px 0 12px;
}

.toast {
  border: 1px solid var(--drfx-border);
  border-radius: 12px;
  color: var(--color-text);
  background: #0b1210;
  box-shadow: var(--drfx-shadow);
}

/* Footer */
.site-footer {
  margin-top: auto;
  border-top: 1px solid var(--drfx-border);
  background: #040706;
}

.site-footer-inner {
  display: flex;
  width: min(var(--drfx-max), calc(100% - (var(--content-padding) * 2)));
  min-height: 104px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-inline: auto;
  color: #7f8a87;
  font-size: 12px;
}

.site-footer .copyright {
  margin: 0;
}

.we-accept {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.we-accept img {
  max-width: 42px;
  max-height: 24px;
  opacity: 0.8;
}

.tebex-footer-wrapper {
  border-top: 1px solid rgba(255, 255, 255, 0.035);
  color: #69726f;
  background: #030504;
}

/* Responsive */
@media (max-width: 1100px) {
  .drfx-hero-grid {
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 40px;
  }

  .drfx-hero-copy h1 {
    font-size: clamp(48px, 6vw, 68px);
  }

  .drfx-category-content {
    display: block;
  }

  .drfx-category-content small {
    display: block;
    margin-top: 6px;
  }

  .store-products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 960px) {
  .site-header {
    position: relative;
  }

  .site-header-inner {
    min-height: 68px;
  }

  .site-header .actions {
    display: block;
    margin-right: 10px;
  }

  .site-title {
    margin-right: auto;
  }

  .site-title img {
    max-width: 110px;
    max-height: 40px;
  }

  .site-header .info.server,
  .site-header .info.discord .title,
  .site-header .info.discord .action {
    display: none;
  }

  .site-header .info.discord {
    display: grid;
    min-width: 42px;
    grid-template-columns: 1fr;
    place-items: center;
    padding: 6px;
  }

  .site-header .info.discord .image {
    grid-area: auto;
  }

  .drfx-hero {
    min-height: auto;
    padding: 76px 0;
  }

  .drfx-hero-grid {
    grid-template-columns: 1fr;
    gap: 68px;
  }

  .drfx-hero-copy {
    text-align: center;
  }

  .drfx-hero-copy > p {
    margin-inline: auto;
  }

  .drfx-hero-actions,
  .drfx-trust-row {
    justify-content: center;
  }

  .drfx-hero-art {
    width: min(440px, 82vw);
  }

  .drfx-section {
    padding: 84px 0;
  }

  .drfx-section-heading,
  .drfx-final-cta-inner {
    align-items: flex-start;
    flex-direction: column;
  }

  .drfx-category-grid,
  .drfx-value-grid {
    grid-template-columns: 1fr;
  }

  .drfx-category-card {
    min-height: 280px;
  }

  .drfx-spotlight {
    grid-template-columns: 1fr;
  }

  .drfx-spotlight-media {
    min-height: 360px;
    order: -1;
  }

  .drfx-spotlight-media::after {
    background: linear-gradient(180deg, transparent 58%, #0d1512 100%);
  }

  .drfx-about-grid,
  .drfx-faq-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .site-content-widgets {
    grid-template-columns: 1fr;
  }

  .store-sidebar {
    order: -1;
  }
}

@media (max-width: 640px) {
  :root {
    --content-padding: 18px;
    --widget-padding: 20px;
  }

  .site-header .log-in,
  .site-header .user-name {
    display: none;
  }

  .site-header .user-actions {
    margin-left: 6px;
  }

  .site-header .btn-primary,
  .site-header .btn-secondary,
  .site-header .btn-tertiary {
    min-height: 40px;
    padding: 9px 12px;
    font-size: 12px;
  }

  .drfx-hero {
    padding: 62px 0 70px;
    background-position: 58% center;
  }

  .drfx-hero-copy h1 {
    margin-top: 18px;
    font-size: clamp(42px, 12vw, 58px);
  }

  .drfx-hero-copy > p {
    font-size: 16px;
  }

  .drfx-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .drfx-button {
    width: 100%;
  }

  .drfx-trust-row {
    gap: 9px 14px;
  }

  .drfx-art-chip {
    display: none;
  }

  .drfx-section {
    padding: 70px 0;
  }

  .drfx-section-heading h2,
  .drfx-about-grid h2,
  .drfx-faq-grid h2,
  .drfx-final-cta h2 {
    font-size: 38px;
  }

  .drfx-category-card {
    min-height: 245px;
    padding: 22px;
    border-radius: 16px;
  }

  .drfx-category-content strong {
    font-size: 28px;
  }

  .drfx-spotlight {
    border-radius: 18px;
  }

  .drfx-spotlight-media {
    min-height: 240px;
  }

  .drfx-spotlight-copy {
    padding: 28px 22px 34px;
  }

  .drfx-spotlight-copy h2 {
    font-size: 38px;
  }

  .drfx-value-grid article {
    min-height: 230px;
    padding: 26px;
  }

  .drfx-about-copy {
    padding: 24px;
  }

  .drfx-final-actions {
    width: 100%;
  }

  .drfx-final-actions .drfx-button {
    width: 100%;
  }

  .site-content {
    padding-top: 42px;
    padding-bottom: 64px;
  }

  .store-products-grid {
    grid-template-columns: 1fr;
  }

  .site-footer-inner {
    min-height: 140px;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}


/* DrFx compact custom header */
.drfx-site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  max-width: none;
  border-bottom: 1px solid var(--drfx-border);
  background: rgba(5, 8, 7, .84);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.drfx-site-header .site-header-inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 30px;
  width: min(var(--drfx-max), calc(100% - (var(--content-padding) * 2)));
  height: 82px !important;
  min-height: 82px;
  margin-inline: auto;
  padding: 0 !important;
}
.drfx-site-header .site-title {
  position: relative !important;
  inset: auto !important;
  order: initial;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  line-height: 1 !important;
  font-size: 20px !important;
}
.drfx-site-header .site-title a {
  display: inline-flex;
  align-items: center;
  height: 48px;
}
.drfx-site-header .site-title img {
  width: auto !important;
  max-width: 132px !important;
  height: auto !important;
  max-height: 44px !important;
  margin: 0 !important;
}
.drfx-site-header .site-title span {
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 800;
}
.drfx-site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 2.2vw, 34px);
  min-width: 0;
}
.drfx-site-nav a {
  position: relative;
  color: #c4cecb;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color .2s ease;
}
.drfx-site-nav a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -11px;
  left: 0;
  height: 2px;
  background: var(--color-primary);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .2s ease;
}
.drfx-site-nav a:hover,
.drfx-site-nav a:focus-visible {
  color: #fff;
}
.drfx-site-nav a:hover::after,
.drfx-site-nav a:focus-visible::after {
  transform: scaleX(1);
}
.drfx-account {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.drfx-site-header .drfx-account .log-in,
.drfx-site-header .drfx-account .open-basket,
.drfx-site-header .drfx-account .drfx-user {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  margin: 0 !important;
  white-space: nowrap;
}
.drfx-site-header .site-sale-banner {
  margin: 0;
  padding: 10px var(--content-padding);
  text-align: center;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
@media (max-width: 900px) {
  .drfx-site-header { position: relative; }
  .drfx-site-header .site-header-inner {
    grid-template-columns: 1fr auto;
    gap: 10px 18px;
    height: auto !important;
    min-height: 72px;
    padding: 10px 0 0 !important;
  }
  .drfx-site-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: flex-start;
    gap: 24px;
    width: 100%;
    padding: 11px 0 14px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .drfx-site-nav::-webkit-scrollbar { display: none; }
  .drfx-site-nav a { font-size: 11px; }
  .drfx-site-header .site-title img { max-width: 108px !important; max-height: 38px !important; }
}
@media (max-width: 520px) {
  .drfx-site-header .site-header-inner { width: calc(100% - 32px); }
  .drfx-site-header .drfx-account .drfx-user { display: none; }
  .drfx-site-header .drfx-account .log-in,
  .drfx-site-header .drfx-account .open-basket { min-height: 40px; padding: 8px 13px; font-size: 12px; }
}


/* DrFx catalog pages */
.drfx-catalog-hero {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--drfx-border);
  background:
    linear-gradient(90deg, rgba(5,8,7,.9), rgba(5,8,7,.7)),
    var(--drfx-hero-image) center 43% / cover no-repeat;
}
.drfx-catalog-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(77,225,194,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(77,225,194,.035) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(90deg, #000, transparent 70%);
}
.drfx-catalog-hero-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  min-height: 310px;
  padding: 82px 0 58px;
}
.drfx-catalog-hero h1 {
  max-width: 820px;
  margin: 10px 0 12px;
  font-size: clamp(54px, 7vw, 104px);
  line-height: .92;
}
.drfx-catalog-hero p {
  max-width: 620px;
  margin: 0;
  color: var(--drfx-muted);
  font-size: 17px;
}
.drfx-catalog-count {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid var(--drfx-border-strong);
  border-radius: 999px;
  color: var(--color-primary);
  background: rgba(77,225,194,.06);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  white-space: nowrap;
}
.site-content.drfx-catalog-shell {
  display: block !important;
  width: min(var(--drfx-max), calc(100% - (var(--content-padding) * 2)));
  max-width: none;
  min-height: 520px;
  margin: 0 auto;
  padding: 72px 0 110px;
}
.drfx-catalog-shell .store-products {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
.drfx-catalog-shell .category-description {
  max-width: 780px;
  margin: 0 0 42px;
  padding: 24px 28px;
  border: 1px solid var(--drfx-border);
  border-radius: 16px;
  background: var(--drfx-surface);
}
.drfx-product-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 360px)) !important;
  justify-content: start;
  gap: 24px !important;
}
.drfx-product-grid .store-product {
  width: 100% !important;
  max-width: none !important;
  min-height: 100%;
}
.drfx-empty-state {
  display: grid;
  place-items: start;
  min-height: 360px;
  padding: 54px;
  border: 1px solid var(--drfx-border);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(77,225,194,.06), transparent 55%), var(--drfx-surface);
}
.drfx-empty-state h2 {
  max-width: 620px;
  margin: 12px 0 28px;
  font-size: clamp(34px, 5vw, 64px);
}
@media (max-width: 720px) {
  .drfx-catalog-hero-inner { align-items: flex-start; flex-direction: column; min-height: 270px; padding: 58px 0 42px; }
  .drfx-catalog-hero h1 { font-size: clamp(48px, 15vw, 76px); }
  .site-content.drfx-catalog-shell { padding: 42px 0 76px; }
  .drfx-product-grid { grid-template-columns: 1fr !important; }
  .drfx-empty-state { padding: 30px 22px; }
}


/* Keep every page section full-width inside the Exo shell */
.site { align-items: stretch !important; }
.drfx-catalog-hero,
.site-footer { width: 100%; }


/* DrFx package detail */
.drfx-package-page {
  width: 100%;
  min-height: 760px;
  padding: 62px 0 112px;
  background:
    radial-gradient(circle at 76% 18%, rgba(77,225,194,.08), transparent 26%),
    var(--color-bg);
}
.drfx-back-link {
  display: inline-flex;
  align-items: center;
  margin-bottom: 34px;
  color: var(--drfx-muted);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  transition: color .2s ease, transform .2s ease;
}
.drfx-back-link:hover { color: var(--color-primary); transform: translateX(-3px); }
.drfx-package-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
  align-items: start;
  gap: clamp(28px, 4vw, 58px);
}
.drfx-package-media {
  position: relative;
  overflow: hidden;
  min-height: 480px;
  border: 1px solid var(--drfx-border);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(77,225,194,.07), transparent 55%),
    var(--drfx-surface);
  box-shadow: var(--drfx-shadow);
}
.drfx-package-media > .image {
  display: block;
  width: 100%;
  min-height: 480px;
  object-fit: cover;
}
.drfx-package-media .image-default {
  background: linear-gradient(135deg, rgba(77,225,194,.13), transparent), var(--drfx-surface-2);
}
.drfx-package-media .swiper,
.drfx-package-media swiper-container {
  width: 100%;
  min-height: 480px;
}
.drfx-package-buy {
  position: sticky;
  top: 112px;
  padding: clamp(28px, 3vw, 42px);
  border: 1px solid var(--drfx-border);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(77,225,194,.08), transparent 52%),
    rgba(10,15,14,.94);
  box-shadow: var(--drfx-shadow);
}
.drfx-package-buy .product-title {
  margin: 13px 0 16px;
  font-size: clamp(38px, 4.2vw, 66px);
  line-height: .98;
}
.drfx-package-buy .countdown {
  display: block;
  margin-top: 15px;
  color: var(--color-primary);
  font-size: 13px;
  letter-spacing: .08em;
}
.drfx-package-note {
  margin: 0 0 26px;
  color: var(--drfx-muted);
}
.drfx-package-buy .product-actions {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 24px 0;
  border-top: 1px solid var(--drfx-border);
  border-bottom: 1px solid var(--drfx-border);
}
.drfx-package-buy .product-actions .price {
  margin: 0 0 6px;
  color: #fff;
}
.drfx-package-buy .product-actions .price strong {
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-size: clamp(24px, 3vw, 38px);
  letter-spacing: -.03em;
}
.drfx-package-buy .product-actions .wide,
.drfx-package-buy .product-actions .btn-primary,
.drfx-package-buy .product-actions .btn-secondary {
  width: 100%;
  min-height: 52px;
}
.drfx-package-trust {
  display: grid;
  gap: 13px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
  color: #c2ceca;
  font-size: 13px;
}
.drfx-package-trust li { display: flex; align-items: center; gap: 12px; }
.drfx-package-trust span {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--drfx-border-strong);
  border-radius: 999px;
  color: var(--color-primary);
  font-size: 9px;
  font-weight: 900;
}
.drfx-package-description {
  margin-top: 90px;
  padding-top: 72px;
  border-top: 1px solid var(--drfx-border);
}
.drfx-package-description .drfx-section-heading { margin-bottom: 34px; }
.drfx-package-description .descr {
  max-width: 900px;
  padding: clamp(28px, 4vw, 52px);
  border: 1px solid var(--drfx-border);
  border-radius: 22px;
  color: #c6cfcc;
  background: var(--drfx-surface);
}
.drfx-package-description .descr img,
.drfx-package-description .descr iframe,
.drfx-package-description .descr video {
  max-width: 100%;
  border-radius: 14px;
}
.drfx-package-description .descr a { color: var(--color-primary); }
.drfx-package-description .descr h1,
.drfx-package-description .descr h2,
.drfx-package-description .descr h3,
.drfx-package-description .descr strong { color: #fff; }
@media (max-width: 940px) {
  .drfx-package-grid { grid-template-columns: 1fr; }
  .drfx-package-buy { position: relative; top: auto; }
  .drfx-package-media,
  .drfx-package-media > .image,
  .drfx-package-media .swiper,
  .drfx-package-media swiper-container { min-height: 340px; }
}
@media (max-width: 560px) {
  .drfx-package-page { padding: 36px 0 76px; }
  .drfx-package-media,
  .drfx-package-media > .image,
  .drfx-package-media .swiper,
  .drfx-package-media swiper-container { min-height: 230px; border-radius: 16px; }
  .drfx-package-buy { padding: 24px 20px; border-radius: 16px; }
  .drfx-package-description { margin-top: 58px; padding-top: 48px; }
  .drfx-package-description .descr { padding: 24px 20px; border-radius: 16px; }
}


/* =========================================================
   DRFX V2 — product-first storefront
   ========================================================= */
:root {
  --drfx-v2-bg: #080a0a;
  --drfx-v2-panel: #101313;
  --drfx-v2-panel-2: #151918;
  --drfx-v2-line: #242b29;
  --drfx-v2-text: #f2f4f3;
  --drfx-v2-muted: #909a96;
  --drfx-v2-accent: #4bdabb;
  --drfx-v2-accent-dark: #052018;
  --drfx-v2-width: 1200px;
}
body {
  color: var(--drfx-v2-text) !important;
  background: var(--drfx-v2-bg) !important;
  font-family: "Inter", Arial, sans-serif !important;
}
body::before { display: none !important; }
.site { align-items: stretch !important; }
.drfx-v2-home,
.drfx-package-page,
.drfx-catalog-hero,
.site-footer { width: 100%; }
.drfx-v2-wrap {
  width: min(var(--drfx-v2-width), calc(100% - 48px));
  margin-inline: auto;
}
.drfx-v2-label {
  display: inline-block;
  color: var(--drfx-v2-accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
}
.drfx-v2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 11px 18px;
  border: 1px solid transparent;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 800;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.drfx-v2-btn-main {
  color: var(--drfx-v2-accent-dark);
  background: var(--drfx-v2-accent);
}
.drfx-v2-btn-main:hover { background: #72e7cd; }
.drfx-v2-btn-plain {
  color: var(--drfx-v2-text);
  border-color: var(--drfx-v2-line);
  background: #101312;
}
.drfx-v2-btn-plain:hover { border-color: #4a5752; background: #151a18; }
.drfx-v2-btn-light { color: #07100d; background: #fff; }

/* Header */
.drfx-site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid #1b211f;
  background: rgba(8,10,10,.96) !important;
  backdrop-filter: none !important;
}
.drfx-site-header .site-header-inner {
  width: min(var(--drfx-v2-width), calc(100% - 48px));
  height: 74px !important;
  min-height: 74px !important;
  gap: 28px;
}
.drfx-site-header .site-title img {
  max-width: 112px !important;
  max-height: 36px !important;
  filter: none !important;
}
.drfx-site-nav { gap: clamp(20px, 2vw, 30px); }
.drfx-site-nav a {
  color: #a9b2ae;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: none;
}
.drfx-site-nav a::after { bottom: -9px; background: var(--drfx-v2-accent); }
.drfx-site-nav a:hover { color: #fff; }
.drfx-site-header .drfx-account .log-in,
.drfx-site-header .drfx-account .open-basket,
.drfx-site-header .drfx-account .drfx-user {
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid var(--drfx-v2-line);
  border-radius: 7px;
  background: #101312;
  color: #fff;
  font-size: 12px;
}

/* Home hero */
.drfx-v2-hero {
  padding: 72px 0 82px;
  border-bottom: 1px solid var(--drfx-v2-line);
  background: #090b0b;
}
.drfx-v2-hero-grid {
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  align-items: center;
  gap: clamp(44px, 6vw, 84px);
}
.drfx-v2-hero-copy h1 {
  max-width: 560px;
  margin: 16px 0 24px;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: clamp(64px, 7vw, 100px);
  font-weight: 700;
  line-height: .84;
  letter-spacing: -.025em;
  text-transform: uppercase;
}
.drfx-v2-hero-copy h1 em {
  color: var(--drfx-v2-accent);
  font-style: normal;
}
.drfx-v2-hero-copy > p {
  max-width: 510px;
  margin: 0;
  color: var(--drfx-v2-muted);
  font-size: 17px;
  line-height: 1.7;
}
.drfx-v2-actions { display: flex; gap: 10px; margin-top: 30px; }
.drfx-v2-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin: 34px 0 0;
  padding: 0;
  list-style: none;
  color: #aab3af;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.drfx-v2-meta li { display: flex; align-items: center; gap: 8px; }
.drfx-v2-meta li::before { content: ""; width: 5px; height: 5px; background: var(--drfx-v2-accent); }
.drfx-v2-release {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  border: 1px solid #2b322f;
  border-radius: 12px;
  background: #121514;
}
.drfx-v2-release::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,.9));
}
.drfx-v2-release > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.drfx-v2-release:hover > img { transform: scale(1.025); }
.drfx-v2-release-tag {
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 16px;
  padding: 7px 9px;
  border-radius: 5px;
  color: #04150f;
  background: var(--drfx-v2-accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
}
.drfx-v2-release-info {
  position: absolute;
  z-index: 2;
  right: 24px;
  bottom: 22px;
  left: 24px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
}
.drfx-v2-release-info strong {
  color: #fff;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1;
  text-transform: uppercase;
}
.drfx-v2-release-info small { color: #c8cfcc; font-size: 12px; white-space: nowrap; }

/* Catalog block */
.drfx-v2-catalog { padding: 88px 0 104px; background: var(--drfx-v2-bg); }
.drfx-v2-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 34px;
}
.drfx-v2-section-head h2,
.drfx-v2-support h2 {
  margin: 8px 0 0;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: clamp(46px, 5vw, 66px);
  line-height: .95;
  text-transform: uppercase;
}
.drfx-v2-category-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.drfx-v2-category-links a {
  padding: 8px 12px;
  border: 1px solid var(--drfx-v2-line);
  border-radius: 6px;
  color: #b2bbb7;
  font-size: 12px;
  font-weight: 700;
}
.drfx-v2-category-links a:hover { color: #07110d; border-color: var(--drfx-v2-accent); background: var(--drfx-v2-accent); }
.drfx-v2-product {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
  overflow: hidden;
  border: 1px solid var(--drfx-v2-line);
  border-radius: 12px;
  background: var(--drfx-v2-panel);
}
.drfx-v2-product-image { min-height: 390px; background: #0b0d0c; }
.drfx-v2-product-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.drfx-v2-product-body { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(32px, 5vw, 60px); }
.drfx-v2-badges,
.drfx-v2-deps { display: flex; flex-wrap: wrap; gap: 7px; }
.drfx-v2-badges span,
.drfx-v2-deps span {
  padding: 6px 8px;
  border: 1px solid #303835;
  border-radius: 4px;
  color: #aeb8b4;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
}
.drfx-v2-badges span:last-child { color: #07130f; border-color: var(--drfx-v2-accent); background: var(--drfx-v2-accent); }
.drfx-v2-product-body h3 {
  margin: 18px 0 13px;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: clamp(42px, 4vw, 58px);
  line-height: .95;
  text-transform: uppercase;
}
.drfx-v2-product-body p { max-width: 450px; margin: 0; color: var(--drfx-v2-muted); }
.drfx-v2-deps { margin: 22px 0 28px; }

/* Support */
.drfx-v2-support { padding: 64px 0; color: #07130f; background: var(--drfx-v2-accent); }
.drfx-v2-support .drfx-v2-label { color: #0a4a39; }
.drfx-v2-support h2 { color: #07130f; }
.drfx-v2-support p { max-width: 650px; margin: 12px 0 0; color: #174235; }
.drfx-v2-support-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; }

/* Compact category page */
.drfx-catalog-hero {
  background: #0b0e0d !important;
  border-bottom: 1px solid var(--drfx-v2-line) !important;
}
.drfx-catalog-hero::after { display: none !important; }
.drfx-catalog-hero-inner {
  min-height: 230px !important;
  padding: 52px 0 42px !important;
}
.drfx-catalog-hero h1 {
  margin: 8px 0 10px !important;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
  font-size: clamp(62px, 7vw, 88px) !important;
  line-height: .9 !important;
  text-transform: uppercase;
}
.drfx-catalog-hero p { color: var(--drfx-v2-muted) !important; }
.drfx-catalog-count {
  border-color: var(--drfx-v2-line) !important;
  border-radius: 6px !important;
  color: #b7c1bd !important;
  background: #111514 !important;
}
.site-content.drfx-catalog-shell { min-height: 520px; padding: 54px 0 92px !important; }
.drfx-product-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 360px)) !important; gap: 20px !important; }
.drfx-product-grid .store-product {
  overflow: hidden;
  border-color: var(--drfx-v2-line) !important;
  border-radius: 10px !important;
  background: var(--drfx-v2-panel) !important;
  box-shadow: none !important;
}
.drfx-product-grid .store-product:hover { transform: none !important; border-color: #46524e !important; }
.drfx-product-grid .store-product .image { border-radius: 0 !important; }

/* Compact package page */
.drfx-package-page {
  min-height: 700px;
  padding: 48px 0 96px !important;
  background: var(--drfx-v2-bg) !important;
}
.drfx-back-link { margin-bottom: 24px !important; }
.drfx-package-grid { grid-template-columns: minmax(0, 1.2fr) minmax(330px, .8fr) !important; gap: 30px !important; }
.drfx-package-media {
  min-height: 420px !important;
  border-color: var(--drfx-v2-line) !important;
  border-radius: 12px !important;
  background: var(--drfx-v2-panel) !important;
  box-shadow: none !important;
}
.drfx-package-media > .image { min-height: 420px !important; }
.drfx-package-buy {
  top: 98px !important;
  padding: 32px !important;
  border-color: var(--drfx-v2-line) !important;
  border-radius: 12px !important;
  background: var(--drfx-v2-panel) !important;
  box-shadow: none !important;
}
.drfx-package-buy .product-title {
  margin: 10px 0 14px !important;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
  font-size: clamp(42px, 4vw, 56px) !important;
  line-height: .9 !important;
  text-transform: uppercase;
}
.drfx-package-buy .product-actions { border-color: var(--drfx-v2-line) !important; }
.drfx-package-description { margin-top: 70px !important; padding-top: 56px !important; border-color: var(--drfx-v2-line) !important; }
.drfx-package-description .descr {
  border-color: var(--drfx-v2-line) !important;
  border-radius: 10px !important;
  background: var(--drfx-v2-panel) !important;
}

.site-footer { border-top: 1px solid var(--drfx-v2-line) !important; background: #080a0a !important; }

@media (max-width: 900px) {
  .drfx-site-header .site-header-inner { width: calc(100% - 32px); min-height: 68px !important; height: auto !important; }
  .drfx-v2-hero { padding: 52px 0 60px; }
  .drfx-v2-hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .drfx-v2-hero-copy h1 { max-width: 680px; }
  .drfx-v2-release { max-width: 720px; }
  .drfx-v2-product { grid-template-columns: 1fr; }
  .drfx-v2-product-image { min-height: 320px; }
  .drfx-v2-support-inner { align-items: flex-start; flex-direction: column; }
  .drfx-package-grid { grid-template-columns: 1fr !important; }
  .drfx-package-buy { position: relative !important; top: auto !important; }
}
@media (max-width: 620px) {
  .drfx-v2-wrap { width: calc(100% - 32px); }
  .drfx-v2-hero-copy h1 { font-size: 60px; }
  .drfx-v2-section-head { align-items: flex-start; flex-direction: column; }
  .drfx-v2-category-links { justify-content: flex-start; }
  .drfx-v2-release-info { right: 16px; bottom: 16px; left: 16px; align-items: flex-start; flex-direction: column; gap: 5px; }
  .drfx-v2-release-info strong { font-size: 28px; }
  .drfx-v2-product-image { min-height: 230px; }
  .drfx-v2-product-body { padding: 28px 22px; }
  .drfx-v2-support { padding: 50px 0; }
  .drfx-catalog-hero-inner { align-items: flex-start !important; flex-direction: column !important; min-height: 220px !important; }
}


/* One-product category: use the space intentionally */
.drfx-product-grid.is-single {
  grid-template-columns: 1fr !important;
  max-width: 920px;
}
.drfx-product-grid.is-single .store-product {
  display: grid !important;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  grid-template-rows: auto 1fr;
  min-height: 350px;
}
.drfx-product-grid.is-single .store-product .image-link {
  grid-column: 1;
  grid-row: 1 / 3;
  min-height: 350px;
}
.drfx-product-grid.is-single .store-product .image-link .image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.drfx-product-grid.is-single .store-product .product-title {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  padding: 34px 32px 12px;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: 34px;
  line-height: 1;
  text-transform: uppercase;
}
.drfx-product-grid.is-single .store-product .product-actions {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  margin: 0;
  padding: 12px 32px 32px;
}
@media (max-width: 720px) {
  .drfx-product-grid.is-single .store-product { grid-template-columns: 1fr; grid-template-rows: auto auto auto; min-height: 0; }
  .drfx-product-grid.is-single .store-product .image-link { grid-column: 1; grid-row: 1; min-height: 220px; }
  .drfx-product-grid.is-single .store-product .product-title { grid-column: 1; grid-row: 2; padding: 22px 20px 8px; font-size: 30px; }
  .drfx-product-grid.is-single .store-product .product-actions { grid-column: 1; grid-row: 3; padding: 8px 20px 22px; }
}


/* =========================================================
   DRFX — LIVE CITY EDITION
   Built from the store's real content; September 2026
   ========================================================= */
:root {
  --color-bg: #121418;
  --color-brighter-bg: #191c21;
  --color-primary: #50e3c2;
  --color-primary-hover: #77ecd3;
  --drfx-live-bg: #121418;
  --drfx-live-panel: #1a1d22;
  --drfx-live-panel-2: #20242a;
  --drfx-live-line: rgba(255,255,255,.1);
  --drfx-live-teal: #50e3c2;
  --drfx-live-ink: #090d0c;
  --drfx-live-paper: #f0f1ec;
}

html, body { background: var(--drfx-live-bg) !important; }
body {
  background-image: linear-gradient(180deg, #121418 0%, #17191e 100%) !important;
  color: #f5f6f3;
  font-family: "Inter", system-ui, sans-serif !important;
}
.site-main { background: transparent !important; }

/* Header: compact, readable, branded */
.drfx-site-header {
  position: relative !important;
  z-index: 30;
  background: rgba(8,9,11,.98) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px);
}
.drfx-site-header .site-header-inner {
  min-height: 72px !important;
  width: min(1320px, calc(100% - 48px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
.drfx-site-header .site-title { margin: 0 !important; }
.drfx-site-header .site-title a {
  display: inline-flex !important;
  align-items: center;
  gap: 11px;
  min-width: max-content;
}
.drfx-site-header .site-title img {
  display: block !important;
  width: 31px !important;
  height: 31px !important;
  max-height: 31px !important;
  object-fit: contain;
}
.drfx-wordmark {
  color: #f6f7f4;
  font-family: "Inter", system-ui, sans-serif;
  font-size: 15px;
  font-weight: 850;
  letter-spacing: -.04em;
  line-height: 1;
  white-space: nowrap;
}
.drfx-wordmark b { color: var(--drfx-live-teal); font-weight: 850; }
.drfx-site-nav { gap: 30px !important; }
.drfx-site-nav a {
  color: rgba(255,255,255,.66) !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
}
.drfx-site-nav a:hover { color: var(--drfx-live-teal) !important; }
.drfx-account .btn-primary,
.drfx-account .btn-tertiary,
.drfx-account .log-in {
  min-height: 38px !important;
  padding: 0 17px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.drfx-account .btn-primary:hover,
.drfx-account .btn-tertiary:hover,
.drfx-account .log-in:hover {
  border-color: var(--drfx-live-teal) !important;
  color: var(--drfx-live-teal) !important;
}

/* Home */
.drfx-live-home { overflow: hidden; background: var(--drfx-live-bg); }
.drfx-live-wrap {
  width: min(1320px, calc(100% - 64px));
  margin-inline: auto;
}
.drfx-live-hero {
  position: relative;
  min-height: clamp(530px, 58vw, 650px);
  overflow: hidden;
  isolation: isolate;
  background: #25272c;
}
.drfx-live-hero-image {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
  transform: scale(1.025);
  filter: saturate(1.2) contrast(1.04) brightness(1.05);
}
.drfx-live-hero-shade {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(6,8,9,.96) 0%, rgba(6,8,9,.88) 27%, rgba(6,8,9,.58) 48%, rgba(6,8,9,.13) 74%, rgba(6,8,9,.05) 100%),
    linear-gradient(180deg, rgba(0,0,0,.05) 45%, rgba(5,7,8,.48) 100%);
}
.drfx-live-hero-inner {
  min-height: inherit;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  padding-block: 76px 66px;
}
.drfx-live-copy { width: min(650px, 58vw); }
.drfx-live-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,.72);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  line-height: 1;
  text-transform: uppercase;
}
.drfx-live-eyebrow i {
  width: 24px;
  height: 2px;
  background: var(--drfx-live-teal);
  box-shadow: 0 0 16px rgba(80,227,194,.8);
}
.drfx-live-copy h1 {
  max-width: 760px;
  margin: 20px 0 18px !important;
  color: #f8f8f5 !important;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
  font-size: clamp(72px, 8.2vw, 124px) !important;
  font-weight: 800 !important;
  letter-spacing: -.055em !important;
  line-height: .78 !important;
  text-transform: uppercase;
  text-shadow: 0 8px 40px rgba(0,0,0,.35);
}
.drfx-live-copy h1 em {
  color: var(--drfx-live-teal);
  font-style: normal;
  font-weight: 800;
}
.drfx-live-copy > p {
  max-width: 540px;
  margin: 0;
  color: rgba(255,255,255,.74);
  font-size: 16px;
  line-height: 1.7;
}
.drfx-live-actions { display: flex; gap: 11px; margin-top: 30px; }
.drfx-live-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  min-height: 50px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
  transition: transform .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.drfx-live-btn:hover { transform: translateY(-2px); }
.drfx-live-btn.is-primary { background: var(--drfx-live-teal); color: var(--drfx-live-ink); }
.drfx-live-btn.is-primary:hover { background: #82efd8; color: var(--drfx-live-ink); }
.drfx-live-btn.is-ghost { border-color: rgba(255,255,255,.26); background: rgba(8,10,11,.3); color: #fff; backdrop-filter: blur(10px); }
.drfx-live-btn.is-ghost:hover { border-color: #fff; background: #fff; color: #0b0d0f; }
.drfx-live-btn.is-dark { margin-top: 4px; background: #111418; color: #fff; }
.drfx-live-btn.is-dark:hover { background: #23272d; color: var(--drfx-live-teal); }
.drfx-live-release {
  align-self: flex-end;
  width: 286px;
  margin-bottom: 4px;
  padding: 19px 20px 18px;
  border: 1px solid rgba(255,255,255,.18);
  border-left: 3px solid var(--drfx-live-teal);
  border-radius: 3px;
  background: rgba(8,10,11,.62);
  box-shadow: 0 18px 55px rgba(0,0,0,.25);
  backdrop-filter: blur(16px);
  transition: background .2s ease, transform .2s ease;
}
.drfx-live-release:hover { background: rgba(8,10,11,.86); transform: translateY(-3px); }
.drfx-live-release > span { display: block; margin-bottom: 7px; color: var(--drfx-live-teal); font-size: 9px; font-weight: 900; letter-spacing: .17em; }
.drfx-live-release strong { display: block; color: #fff; font-family: "Barlow Condensed", sans-serif; font-size: 23px; letter-spacing: .01em; line-height: 1.1; }
.drfx-live-release small { display: flex; justify-content: space-between; margin-top: 12px; color: rgba(255,255,255,.55); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.drfx-live-release small b { color: #fff; }

/* Moving brand strip */
.drfx-live-ticker {
  position: relative;
  z-index: 5;
  height: 54px;
  overflow: hidden;
  background: var(--drfx-live-teal);
  border-block: 1px solid rgba(0,0,0,.18);
  color: #08110f;
}
.drfx-live-ticker-track {
  display: flex;
  width: max-content;
  height: 100%;
  will-change: transform;
  animation: drfxLiveTicker 25s linear infinite;
}
.drfx-live-ticker-track > div {
  flex: 0 0 100vw;
  min-width: 100vw;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 22px;
  padding: 0 22px;
}
.drfx-live-ticker span {
  white-space: nowrap;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.drfx-live-ticker i { font-size: 11px; font-style: normal; opacity: .62; }
@keyframes drfxLiveTicker { to { transform: translateX(-50%); } }

/* Product area: charcoal canvas + editorial light card */
.drfx-live-catalog {
  position: relative;
  padding: 100px 0 112px;
  background:
    radial-gradient(circle at 85% 10%, rgba(80,227,194,.08), transparent 28%),
    #171a1f;
}
.drfx-live-catalog::before {
  content: "DRFX";
  position: absolute;
  right: -28px;
  top: 30px;
  color: rgba(255,255,255,.022);
  font-family: "Barlow Condensed", sans-serif;
  font-size: 280px;
  font-weight: 900;
  letter-spacing: -.07em;
  line-height: 1;
  pointer-events: none;
}
.drfx-live-section-head {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 36px;
  margin-bottom: 42px;
}
.drfx-live-section-head h2 {
  margin: 15px 0 6px !important;
  color: #fff !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(48px, 5vw, 72px) !important;
  font-weight: 750 !important;
  letter-spacing: -.04em !important;
  line-height: .95 !important;
}
.drfx-live-section-head p { margin: 0; color: rgba(255,255,255,.48); font-size: 14px; }
.drfx-live-category-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.drfx-live-category-links a {
  padding: 9px 13px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  color: rgba(255,255,255,.68);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.drfx-live-category-links a:hover { border-color: var(--drfx-live-teal); color: var(--drfx-live-teal); }
.drfx-live-product {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr);
  max-width: 1120px;
  min-height: 490px;
  margin: 0 auto;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 35px 90px rgba(0,0,0,.28);
}
.drfx-live-product::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 4px;
  background: var(--drfx-live-teal);
}
.drfx-live-product-media { position: relative; display: block; min-height: 490px; overflow: hidden; background: #0b0d10; }
.drfx-live-product-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 58%, rgba(6,8,9,.48)); pointer-events: none; }
.drfx-live-product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1), filter .4s ease; }
.drfx-live-product:hover .drfx-live-product-media img { transform: scale(1.035); filter: saturate(1.1); }
.drfx-live-product-media > span {
  position: absolute;
  z-index: 2;
  left: 20px;
  bottom: 18px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 3px;
  background: rgba(8,10,11,.55);
  color: #fff;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .12em;
  backdrop-filter: blur(10px);
}
.drfx-live-product-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(34px, 4vw, 56px);
  background: var(--drfx-live-paper);
  color: #17191c;
}
.drfx-live-badges { display: flex; gap: 7px; margin-bottom: 18px; }
.drfx-live-badges span { padding: 6px 9px; border-radius: 3px; background: #dce2dd; color: #22302c; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.drfx-live-badges span:last-child { background: var(--drfx-live-teal); color: #07110e; }
.drfx-live-product-body h3 { margin: 0 0 15px !important; color: #101215 !important; font-family: "Barlow Condensed", sans-serif !important; font-size: clamp(38px, 4vw, 54px) !important; font-weight: 750 !important; letter-spacing: -.035em !important; line-height: .94 !important; }
.drfx-live-product-body p { margin: 0 0 20px; color: #5a6061; font-size: 14px; line-height: 1.65; }
.drfx-live-deps { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 25px; }
.drfx-live-deps span { color: #5d6464; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; }
.drfx-live-deps span::before { content: ""; margin-right: 5px; color: #0a9f82; }

/* Teal support band */
.drfx-live-support { background: var(--drfx-live-teal); color: var(--drfx-live-ink); }
.drfx-live-support-inner { min-height: 196px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.drfx-live-support span { display: block; margin-bottom: 9px; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.drfx-live-support h2 { margin: 0 !important; color: var(--drfx-live-ink) !important; font-family: "Barlow Condensed", sans-serif !important; font-size: clamp(38px, 4vw, 58px) !important; font-weight: 750 !important; letter-spacing: -.035em !important; line-height: 1 !important; }
.drfx-live-support a { display: inline-flex; align-items: center; justify-content: space-between; gap: 40px; min-width: 205px; min-height: 52px; padding: 0 18px; border: 1px solid rgba(6,17,14,.35); border-radius: 4px; color: var(--drfx-live-ink); font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.drfx-live-support a:hover { background: var(--drfx-live-ink); color: var(--drfx-live-teal); }

/* Carry the lighter visual language through category and package pages */
.drfx-v2-category-page,
.drfx-package-page { background: #15181c !important; }
.drfx-v2-category-hero,
.drfx-category-hero { background: #1d2126 !important; border-color: rgba(255,255,255,.1) !important; }
.drfx-v2-category-hero::before,
.drfx-category-hero::before { opacity: .16 !important; }
.drfx-v2-category-products,
.drfx-category-products { background: #171a1f !important; }
.drfx-v2-product-card,
.drfx-category-card,
.drfx-package-media,
.drfx-package-buy,
.drfx-package-description { background: #20242a !important; border-color: rgba(255,255,255,.12) !important; }
.drfx-package-media { background: #101317 !important; }
.drfx-package-description .descr,
.drfx-package-description .text-content { color: rgba(255,255,255,.72) !important; }
.site-footer { background: #0c0e11 !important; border-color: rgba(255,255,255,.08) !important; }

@media (max-width: 900px) {
  .drfx-site-header .site-header-inner { width: min(100% - 32px, 1320px) !important; min-height: 66px !important; }
  .drfx-wordmark { font-size: 14px; }
  .drfx-site-nav { display: none !important; }
  .drfx-live-wrap { width: min(100% - 40px, 1320px); }
  .drfx-live-hero { min-height: 610px; }
  .drfx-live-hero-image { object-position: 62% center; }
  .drfx-live-hero-shade { background: linear-gradient(90deg, rgba(6,8,9,.94) 0%, rgba(6,8,9,.72) 58%, rgba(6,8,9,.24) 100%), linear-gradient(180deg, rgba(0,0,0,.02) 35%, rgba(5,7,8,.72) 100%); }
  .drfx-live-hero-inner { align-items: flex-end; padding-block: 74px 56px; }
  .drfx-live-copy { width: 100%; max-width: 590px; }
  .drfx-live-copy h1 { font-size: clamp(66px, 14vw, 98px) !important; }
  .drfx-live-release { display: none; }
  .drfx-live-ticker-track > div { flex-basis: 140vw; min-width: 140vw; }
  .drfx-live-catalog { padding: 76px 0 84px; }
  .drfx-live-section-head { align-items: flex-start; flex-direction: column; }
  .drfx-live-category-links { justify-content: flex-start; }
  .drfx-live-product { grid-template-columns: 1fr; max-width: 680px; }
  .drfx-live-product-media { min-height: 380px; }
  .drfx-live-support-inner { padding-block: 45px; }
}

@media (max-width: 600px) {
  .drfx-site-header .site-header-inner { width: calc(100% - 28px) !important; }
  .drfx-site-header .site-title img { width: 27px !important; height: 27px !important; }
  .drfx-account .log-in, .drfx-account .btn-tertiary { display: none !important; }
  .drfx-account .btn-primary { min-height: 35px !important; padding: 0 13px !important; }
  .drfx-live-wrap { width: calc(100% - 32px); }
  .drfx-live-hero { min-height: 575px; }
  .drfx-live-hero-image { object-position: 66% center; }
  .drfx-live-hero-shade { background: linear-gradient(90deg, rgba(6,8,9,.92) 0%, rgba(6,8,9,.68) 70%, rgba(6,8,9,.32) 100%), linear-gradient(180deg, rgba(0,0,0,.08) 20%, rgba(5,7,8,.82) 100%); }
  .drfx-live-hero-inner { padding-block: 58px 42px; }
  .drfx-live-copy h1 { margin-top: 17px !important; font-size: clamp(59px, 19vw, 82px) !important; line-height: .8 !important; }
  .drfx-live-copy > p { max-width: 390px; font-size: 14px; line-height: 1.6; }
  .drfx-live-actions { flex-wrap: wrap; margin-top: 24px; }
  .drfx-live-btn { min-height: 47px; padding: 0 17px; gap: 17px; }
  .drfx-live-ticker { height: 48px; }
  .drfx-live-ticker-track { animation-duration: 17s; }
  .drfx-live-ticker-track > div { flex-basis: 245vw; min-width: 245vw; gap: 18px; }
  .drfx-live-ticker span { font-size: 15px; }
  .drfx-live-catalog { padding: 64px 0 70px; }
  .drfx-live-catalog::before { font-size: 160px; }
  .drfx-live-section-head { gap: 24px; margin-bottom: 30px; }
  .drfx-live-section-head h2 { font-size: 48px !important; }
  .drfx-live-product { min-height: 0; }
  .drfx-live-product-media { min-height: 245px; }
  .drfx-live-product-body { padding: 30px 25px 32px; }
  .drfx-live-product-body h3 { font-size: 40px !important; }
  .drfx-live-support-inner { min-height: 0; align-items: flex-start; flex-direction: column; gap: 24px; padding-block: 40px; }
  .drfx-live-support a { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .drfx-live-ticker-track { animation: none; }
  .drfx-live-product-media img,
  .drfx-live-btn,
  .drfx-live-release { transition: none; }
}

/* Final rhythm correction: hero connects directly to the header */
.drfx-live-page .site { gap: 0 !important; }


/* =========================================================
   DRFX — COMPLETE STOREFRONT FLOW
   Category, product, authentication and basket experience
   ========================================================= */

/* Honest home depth: feature facts + FAQ */
.drfx-home-features {
  padding: 96px 0 104px;
  background: #f0f1ec;
  color: #111418;
}
.drfx-home-block-head > span {
  display: block;
  margin-bottom: 12px;
  color: #0b9e82;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.drfx-home-block-head h2 {
  margin: 0 !important;
  color: inherit !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(48px, 5vw, 72px) !important;
  font-weight: 760 !important;
  letter-spacing: -.045em !important;
  line-height: .95 !important;
}
.drfx-home-block-head > p { max-width: 460px; margin: 16px 0 0; color: #69706f; font-size: 14px; line-height: 1.7; }
.drfx-home-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 42px; }
.drfx-home-feature-grid article {
  min-height: 250px;
  padding: 28px;
  border: 1px solid #cfd4cf;
  border-radius: 5px;
  background: #f7f8f4;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.drfx-home-feature-grid article:hover { transform: translateY(-5px); border-color: #49cdb1; box-shadow: 0 24px 55px rgba(24,35,31,.09); }
.drfx-home-feature-grid article > b { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #111418; color: #50e3c2; font-size: 10px; letter-spacing: .06em; }
.drfx-home-feature-grid h3 { margin: 52px 0 11px !important; color: #111418 !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 31px !important; font-weight: 760 !important; letter-spacing: -.025em !important; }
.drfx-home-feature-grid p { margin: 0; color: #646b69; font-size: 13px; line-height: 1.7; }
.drfx-home-faq, .drfx-product-faq-section { padding: 104px 0; background: #171a1f; }
.drfx-home-faq .drfx-home-block-head, .drfx-product-faq-section .drfx-home-block-head { color: #fff; }
.drfx-home-faq .drfx-home-block-head > p { color: rgba(255,255,255,.48); }
.drfx-home-faq-layout { display: grid; grid-template-columns: minmax(280px,.72fr) minmax(460px,1.28fr); gap: clamp(50px,8vw,120px); align-items: start; }
.drfx-faq-list { border-top: 1px solid rgba(255,255,255,.13); }
.drfx-faq-list details { border-bottom: 1px solid rgba(255,255,255,.13); color: #fff; }
.drfx-faq-list summary { display: grid; grid-template-columns: 42px 1fr 24px; gap: 16px; align-items: center; min-height: 78px; cursor: pointer; list-style: none; }
.drfx-faq-list summary::-webkit-details-marker { display: none; }
.drfx-faq-list summary b { color: #50e3c2; font-size: 10px; letter-spacing: .08em; }
.drfx-faq-list summary span { font-family: "Inter", sans-serif; font-size: 14px; font-weight: 720; }
.drfx-faq-list summary i { color: #50e3c2; font-size: 22px; font-style: normal; font-weight: 300; text-align: center; transition: transform .2s ease; }
.drfx-faq-list details[open] summary i { transform: rotate(45deg); }
.drfx-faq-list details p { margin: -4px 40px 24px 58px; color: rgba(255,255,255,.56); font-size: 13px; line-height: 1.7; }

/* Category / collection pages */
.drfx-collection-page .site { gap: 0 !important; }
.drfx-collection { background: #171a1f; }
.drfx-collection-hero { position: relative; min-height: 360px; overflow: hidden; isolation: isolate; }
.drfx-collection-hero > img { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; filter: saturate(1.15) brightness(.93); }
.drfx-collection-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(7,9,10,.95) 0%, rgba(7,9,10,.72) 48%, rgba(7,9,10,.25) 100%), linear-gradient(180deg, rgba(0,0,0,.12), rgba(7,9,10,.55)); }
.drfx-collection-hero-inner { min-height: 360px; display: flex; flex-direction: column; justify-content: flex-end; padding-block: 64px; }
.drfx-collection-hero h1 { margin: 15px 0 18px !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: clamp(64px,8vw,108px) !important; font-weight: 800 !important; letter-spacing: -.05em !important; line-height: .82 !important; text-transform: uppercase; }
.drfx-collection-meta { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.drfx-collection-meta p { max-width: 560px; margin: 0; color: rgba(255,255,255,.64); font-size: 14px; }
.drfx-collection-meta strong { color: #50e3c2; font-size: 10px; font-weight: 900; letter-spacing: .14em; white-space: nowrap; }
.drfx-collection-line { min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 34px; overflow: hidden; background: #50e3c2; color: #08110f; }
.drfx-collection-line span { font-family: "Barlow Condensed", sans-serif; font-size: 15px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.drfx-collection-line i { font-size: 9px; font-style: normal; opacity: .55; }
.drfx-collection-products { min-height: 520px; padding: 84px 0 100px; background: radial-gradient(circle at 82% 3%, rgba(80,227,194,.08), transparent 28%), #171a1f; }
.drfx-collection-heading { margin-bottom: 34px; }
.drfx-collection-heading > span { color: #50e3c2; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.drfx-collection-heading h2 { margin: 10px 0 0 !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: clamp(44px,5vw,66px) !important; font-weight: 760 !important; letter-spacing: -.04em !important; line-height: 1 !important; }
.drfx-collection-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px !important; }
.drfx-collection-grid.is-single { grid-template-columns: minmax(0,520px) !important; justify-content: center; }
.drfx-store-card { display: flex !important; flex-direction: column; min-width: 0 !important; padding: 0 !important; border: 1px solid rgba(255,255,255,.11) !important; border-radius: 6px !important; overflow: hidden; background: #20242a !important; box-shadow: 0 25px 65px rgba(0,0,0,.2); }
.drfx-store-card-media { position: relative; display: block !important; aspect-ratio: 16/10; overflow: hidden; background: #0e1114; }
.drfx-store-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(5,7,8,.72)); pointer-events: none; }
.drfx-store-card-media .image { width: 100% !important; height: 100% !important; max-height: none !important; margin: 0 !important; object-fit: cover !important; border-radius: 0 !important; transition: transform .55s cubic-bezier(.2,.7,.2,1), filter .3s ease; }
.drfx-store-card:hover .drfx-store-card-media .image { transform: scale(1.045); filter: saturate(1.12); }
.drfx-store-card-media > span { position: absolute; z-index: 2; right: 17px; bottom: 15px; display: flex; gap: 22px; color: #fff; font-size: 9px; font-weight: 850; letter-spacing: .11em; }
.drfx-store-card-body { display: flex; flex: 1; flex-direction: column; padding: 22px 22px 20px; }
.drfx-store-card-label { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 13px; color: rgba(255,255,255,.36); font-size: 8px; font-weight: 850; letter-spacing: .12em; }
.drfx-store-card-label span { color: #50e3c2; }
.drfx-store-card-label i { font-style: normal; }
.drfx-store-card .product-title { margin: 0 0 22px !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 27px !important; font-weight: 720 !important; letter-spacing: -.025em !important; line-height: 1.02 !important; }
.drfx-store-card .product-actions { margin-top: auto !important; }
.drfx-store-card .product-actions .price { margin: 0 0 15px !important; color: #fff !important; font-size: 17px !important; font-weight: 800 !important; }
.drfx-store-card .product-actions .btn-primary,
.drfx-store-card .product-actions .btn-secondary,
.drfx-store-card .product-actions .open-basket-cta {
  width: 100% !important;
  min-height: 47px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: #f0f1ec !important;
  color: #111418 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.drfx-store-card .product-actions .btn-primary:hover,
.drfx-store-card .product-actions .btn-secondary:hover,
.drfx-store-card .product-actions .open-basket-cta:hover { background: #50e3c2 !important; color: #08110f !important; }
.drfx-collection-empty { max-width: 700px; margin: 40px auto; padding: 75px 40px !important; border: 1px solid rgba(255,255,255,.11) !important; border-radius: 6px; background: #20242a !important; text-align: center; }
.drfx-collection-empty h2 { margin: 20px 0 10px !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 48px !important; }
.drfx-collection-empty p { max-width: 490px; margin: 0 auto 28px; color: rgba(255,255,255,.5); font-size: 13px; }

/* Product detail page */
.drfx-product-page .site { gap: 0 !important; }
.drfx-product-experience { background: #15181c; }
.drfx-product-banner { position: relative; min-height: 300px; overflow: hidden; isolation: isolate; }
.drfx-product-banner > img { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; filter: saturate(1.15) brightness(.88); transform: scale(1.02); }
.drfx-product-banner-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(7,9,10,.96) 0%, rgba(7,9,10,.74) 48%, rgba(7,9,10,.25) 100%), linear-gradient(180deg, rgba(0,0,0,.08), rgba(7,9,10,.52)); }
.drfx-product-banner-inner { min-height: 300px; display: flex; flex-direction: column; justify-content: flex-end; padding-block: 42px; }
.drfx-product-back { position: absolute; top: 38px; color: rgba(255,255,255,.52); font-size: 10px; font-weight: 800; letter-spacing: .09em; }
.drfx-product-back:hover { color: #50e3c2; }
.drfx-product-banner h1 { max-width: 960px; margin: 15px 0 0 !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: clamp(58px,7vw,96px) !important; font-weight: 800 !important; letter-spacing: -.05em !important; line-height: .88 !important; text-transform: uppercase; }
.drfx-product-primary { padding: 76px 0 96px; background: radial-gradient(circle at 12% 0%, rgba(80,227,194,.06), transparent 25%), #15181c; }
.drfx-product-primary-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(370px,.85fr); gap: 28px; align-items: start; }
.drfx-product-gallery { position: relative; min-height: 540px; overflow: hidden; border: 1px solid rgba(255,255,255,.11); border-radius: 6px; background: #0d1013; box-shadow: 0 30px 80px rgba(0,0,0,.24); }
.drfx-product-gallery > .image { width: 100%; height: 100%; min-height: 540px; object-fit: cover; }
.drfx-product-gallery-tag { position: absolute; left: 18px; bottom: 18px; padding: 8px 10px; border: 1px solid rgba(255,255,255,.28); border-radius: 3px; background: rgba(7,9,10,.65); color: #fff; font-size: 9px; font-weight: 850; letter-spacing: .12em; backdrop-filter: blur(10px); }
.drfx-product-purchase { min-height: 540px; padding: clamp(34px,4vw,50px); border-radius: 6px; background: #f0f1ec; color: #121518; box-shadow: 0 30px 80px rgba(0,0,0,.2); }
.drfx-product-small-label { color: #079f82; font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.drfx-product-purchase h2 { margin: 14px 0 16px !important; color: #111418 !important; font-family: "Barlow Condensed", sans-serif !important; font-size: clamp(42px,4vw,60px) !important; font-weight: 780 !important; letter-spacing: -.04em !important; line-height: .92 !important; text-transform: uppercase; }
.drfx-product-lead { margin: 0 0 26px; color: #626967; font-size: 13px; line-height: 1.7; }
.drfx-product-purchase .product-actions { margin: 0 !important; padding: 0 !important; }
.drfx-product-purchase .product-actions .price { margin: 0 0 18px !important; color: #111418 !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 30px !important; font-weight: 760 !important; }
.drfx-product-purchase .product-actions .btn-primary,
.drfx-product-purchase .product-actions .btn-secondary,
.drfx-product-purchase .product-actions .open-basket-cta {
  width: 100% !important;
  min-height: 52px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: #50e3c2 !important;
  color: #08110f !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.drfx-product-purchase .product-actions .btn-secondary { margin-top: 8px !important; border: 1px solid #cad0cc !important; background: transparent !important; color: #343a39 !important; }
.drfx-product-purchase .product-actions .btn-primary:hover,
.drfx-product-purchase .product-actions .open-basket-cta:hover { background: #111418 !important; color: #50e3c2 !important; }
.drfx-product-facts { margin: 28px 0 0; padding: 0; list-style: none; border-top: 1px solid #d5d9d4; }
.drfx-product-facts li { display: flex; align-items: center; gap: 14px; min-height: 46px; border-bottom: 1px solid #d5d9d4; color: #4e5553; font-size: 11px; }
.drfx-product-facts b { color: #079f82; font-size: 9px; letter-spacing: .08em; }
.drfx-product-details-section { padding: 100px 0; background: #f0f1ec; color: #111418; }
.drfx-product-details-grid { display: grid; grid-template-columns: minmax(280px,.65fr) minmax(480px,1.35fr); gap: clamp(50px,8vw,120px); align-items: start; }
.drfx-product-description { padding: clamp(28px,4vw,48px) !important; border: 1px solid #d1d6d1; border-radius: 5px; background: #f8f9f5 !important; color: #4e5553 !important; font-size: 14px; line-height: 1.8; }
.drfx-product-description h1,
.drfx-product-description h2,
.drfx-product-description h3,
.drfx-product-description h4 { color: #111418 !important; font-family: "Barlow Condensed", sans-serif !important; letter-spacing: -.025em !important; }
.drfx-product-description a { color: #078f76 !important; text-decoration: underline; text-underline-offset: 3px; }
.drfx-product-description img { border-radius: 4px; }
.drfx-product-faq-section { background: #171a1f; }

/* Full basket page and popup basket share one system */
.drfx-checkout-body .site { gap: 0 !important; }
.drfx-checkout-site { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 64px 0 96px !important; background: radial-gradient(circle at 85% 5%, rgba(80,227,194,.08), transparent 28%), #15181c !important; }
.drfx-basket { width: min(1240px, calc(100% - 64px)) !important; max-width: none !important; margin: 0 auto !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
.drfx-checkout-head { display: flex !important; align-items: center; justify-content: space-between; gap: 35px; min-height: 146px; margin: 0 0 18px !important; padding: 28px 34px !important; border: 0 !important; border-radius: 6px !important; background: #50e3c2 !important; color: #08110f !important; }
.drfx-checkout-head > div:first-child > span { font-size: 9px; font-weight: 900; letter-spacing: .16em; }
.drfx-checkout-head h1 { margin: 8px 0 4px !important; color: #08110f !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 42px !important; font-weight: 780 !important; letter-spacing: -.035em !important; line-height: .95 !important; }
.drfx-checkout-head p { margin: 0; color: rgba(8,17,15,.64); font-size: 12px; }
.drfx-checkout-head-total { min-width: 160px; padding: 14px 18px; border-radius: 4px; background: rgba(8,17,15,.1); text-align: right; }
.drfx-checkout-head-total small { display: block; margin-bottom: 3px; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.drfx-checkout-head-total strong { font-size: 18px; }
.drfx-basket-layout { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 18px; align-items: start; }
.drfx-basket-card { min-width: 0; padding: 28px; border: 1px solid rgba(255,255,255,.1); border-radius: 6px; background: #20242a; }
.drfx-basket-card-head { display: flex !important; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 0 22px !important; padding: 0 0 20px !important; border-bottom: 1px solid rgba(255,255,255,.1) !important; background: transparent !important; }
.drfx-basket-card-head span { color: #50e3c2; font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.drfx-basket-card-head h2 { margin: 8px 0 0 !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 36px !important; font-weight: 750 !important; letter-spacing: -.035em !important; }
.drfx-basket-card-head .count { color: rgba(255,255,255,.5); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.drfx-basket .basket-content, .drfx-basket .basket-items { padding: 0 !important; background: transparent !important; }
.drfx-basket-item { display: grid !important; grid-template-columns: 48px minmax(0,1fr) auto auto 34px; gap: 18px; align-items: center; min-height: 106px; margin: 0 !important; padding: 18px !important; border: 1px solid rgba(255,255,255,.08) !important; border-left: 3px solid #50e3c2 !important; border-radius: 4px !important; background: #181b20 !important; }
.drfx-basket-index { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; color: #50e3c2; font-size: 9px; font-weight: 900; }
.drfx-basket-label { display: block; margin-bottom: 5px; color: rgba(255,255,255,.36); font-size: 8px; font-weight: 850; letter-spacing: .11em; }
.drfx-basket-item .title { margin: 0 !important; color: #fff !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 22px !important; font-weight: 720 !important; letter-spacing: -.015em !important; }
.drfx-basket-item .options { display: flex; flex-wrap: wrap; gap: 10px; margin: 7px 0 0 !important; padding: 0 !important; color: rgba(255,255,255,.4); font-size: 9px; list-style: none; }
.drfx-basket-item .quantity-field { display: flex; align-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 4px; overflow: hidden; }
.drfx-basket-item .quantity-field button,
.drfx-basket-item .quantity-field input { width: 34px !important; height: 34px !important; min-height: 34px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: #fff !important; text-align: center; }
.drfx-basket-item .quantity-field button { color: #50e3c2 !important; }
.drfx-basket-item > .price { min-width: 70px; color: #fff !important; font-size: 13px !important; font-weight: 780 !important; text-align: right; }
.drfx-basket-item .remove { display: grid !important; place-items: center; width: 32px !important; height: 32px !important; min-height: 32px !important; padding: 0 !important; border: 1px solid rgba(255,255,255,.1) !important; border-radius: 4px !important; background: transparent !important; color: rgba(255,255,255,.55) !important; font-size: 18px !important; }
.drfx-basket-item .remove:hover { border-color: #ff776e !important; color: #ff776e !important; }
.drfx-basket-summary { position: sticky; top: 24px; margin: 0 !important; padding: 28px !important; border: 0 !important; border-radius: 6px !important; background: #f0f1ec !important; color: #111418 !important; }
.drfx-basket-summary > span { color: #078f76; font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.drfx-summary-row, .drfx-summary-total { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 0; border-bottom: 1px solid #d4d8d3; color: #565d5b; font-size: 12px; }
.drfx-summary-total { margin-top: 4px; border-bottom: 0; color: #111418; }
.drfx-summary-total strong { font-family: "Barlow Condensed", sans-serif; font-size: 30px; }
.drfx-basket-summary .checkout { display: flex !important; align-items: center; justify-content: space-between; width: 100% !important; min-height: 52px !important; margin: 7px 0 22px !important; padding: 0 18px !important; border: 0 !important; border-radius: 4px !important; background: #111418 !important; color: #fff !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .06em; text-transform: uppercase; }
.drfx-basket-summary .checkout:hover { background: #50e3c2 !important; color: #08110f !important; }
.drfx-basket-summary ul { margin: 0; padding: 18px 0 0; border-top: 1px solid #d4d8d3; list-style: none; }
.drfx-basket-summary li { display: flex; gap: 9px; margin: 9px 0; color: #666d6b; font-size: 10px; }
.drfx-basket-summary li i { color: #078f76; font-style: normal; font-weight: 900; }
.drfx-basket-empty { padding: 55px 25px; border: 1px dashed rgba(255,255,255,.14); border-radius: 4px; text-align: center; }
.drfx-basket-empty span { color: #fff; font-family: "Barlow Condensed", sans-serif; font-size: 28px; font-weight: 760; }
.drfx-basket-empty p { color: rgba(255,255,255,.45); font-size: 12px; }
.drfx-basket-empty a { color: #50e3c2; font-size: 11px; font-weight: 800; }

/* Basket dropdown / popup loaded by Tebex */
.popup { backdrop-filter: blur(8px); }
.popup .popup-content { border: 1px solid rgba(255,255,255,.11) !important; border-radius: 7px !important; background: #171a1f !important; box-shadow: 0 35px 100px rgba(0,0,0,.5) !important; }
.popup .popup-close { top: 14px !important; right: 14px !important; z-index: 10; width: 34px !important; height: 34px !important; overflow: hidden; border: 1px solid rgba(255,255,255,.12) !important; border-radius: 50% !important; background: #20242a !important; color: transparent !important; }
.popup .popup-close::after { content: ""; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 20px; }
.basket-popup .popup-content, .basket-popup-content { width: min(820px, calc(100vw - 32px)) !important; max-width: 820px !important; padding: 0 !important; overflow: hidden; }
.basket-popup .drfx-basket { width: 100% !important; }
.basket-popup .drfx-checkout-head { min-height: 112px; margin: 0 !important; padding: 22px 26px !important; border-radius: 0 !important; }
.basket-popup .drfx-checkout-head h1 { font-size: 34px !important; }
.basket-popup .drfx-checkout-head p { display: none; }
.basket-popup .drfx-basket-layout { grid-template-columns: 1fr; gap: 0; }
.basket-popup .drfx-basket-card { border: 0; border-radius: 0; }
.basket-popup .drfx-basket-summary { position: static; border-radius: 0; }

/* Login page and login popup */
.drfx-auth-body .site { gap: 0 !important; }
.drfx-auth-site { display: grid !important; place-items: center; min-height: 620px; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 70px 20px !important; background: radial-gradient(circle at 70% 20%, rgba(80,227,194,.12), transparent 30%), linear-gradient(rgba(10,12,14,.9), rgba(10,12,14,.95)), url("https://dunb17ur4ymx4.cloudfront.net/packages/images/6c677a41b056d8c520ab13adf0318b241033c958.png") center/cover no-repeat !important; }
.drfx-auth-card { width: min(470px,100%); margin: 0 !important; padding: 42px !important; border: 0 !important; border-radius: 7px !important; background: #f0f1ec !important; color: #111418 !important; box-shadow: 0 35px 100px rgba(0,0,0,.38); text-align: left; }
.drfx-auth-mark {
  display: block;
  width: 96px;
  height: 96px;
  margin-bottom: 16px;
  padding: 0;
  overflow: visible !important;
  border-radius: 0;
  background: transparent;
  color: #50e3c2;
}
.drfx-auth-mark .drfx-auth-logo {
  display: block;
  width: 96px !important;
  height: 96px !important;
  max-width: 96px !important;
  max-height: 96px !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}
.drfx-auth-logo-fallback { width: 56px; height: 34px; }
.drfx-auth-label { color: #078f76; font-size: 9px; font-weight: 900; letter-spacing: .16em; }
.drfx-auth-card h2 { margin: 10px 0 14px !important; color: #111418 !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 48px !important; font-weight: 780 !important; letter-spacing: -.04em !important; line-height: .95 !important; }
.drfx-auth-copy { margin: 0 0 28px; color: #636a68; font-size: 12px; line-height: 1.7; }
.drfx-auth-card .field { margin: 0 !important; }
.drfx-auth-button { display: flex !important; align-items: center; justify-content: space-between; width: 100% !important; min-height: 52px !important; padding: 0 18px !important; border: 0 !important; border-radius: 4px !important; background: #111418 !important; color: #fff !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .06em; text-transform: uppercase; }
.drfx-auth-button:hover { background: #50e3c2 !important; color: #08110f !important; }
.drfx-auth-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.drfx-auth-form input { min-height: 52px; border: 1px solid #cbd0cc; border-radius: 4px; background: #fff; color: #111418; }
.drfx-auth-foot { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; padding-top: 18px; border-top: 1px solid #d4d8d3; color: #747b79; font-size: 8px; font-weight: 850; letter-spacing: .1em; }
.login-popup .popup-content { width: min(470px, calc(100vw - 32px)) !important; max-width: 470px !important; padding: 0 !important; overflow: hidden; }
.login-popup .drfx-auth-card { width: 100%; padding: 40px !important; border-radius: 7px !important; }

@media (max-width: 980px) {
  .drfx-home-feature-grid { grid-template-columns: 1fr; }
  .drfx-home-feature-grid article { min-height: 210px; }
  .drfx-home-feature-grid h3 { margin-top: 34px !important; }
  .drfx-home-faq-layout, .drfx-product-details-grid { grid-template-columns: 1fr; gap: 48px; }
  .drfx-collection-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .drfx-product-primary-grid { grid-template-columns: 1fr; }
  .drfx-product-gallery, .drfx-product-gallery > .image { min-height: 440px; }
  .drfx-product-purchase { min-height: 0; }
  .drfx-basket-layout { grid-template-columns: 1fr; }
  .drfx-basket-summary { position: static; }
}

@media (max-width: 650px) {
  .drfx-home-features, .drfx-home-faq, .drfx-product-faq-section, .drfx-product-details-section { padding: 68px 0; }
  .drfx-home-feature-grid { margin-top: 30px; }
  .drfx-home-faq-layout { gap: 34px; }
  .drfx-faq-list summary { grid-template-columns: 32px 1fr 20px; gap: 10px; min-height: 70px; }
  .drfx-faq-list summary span { font-size: 12px; }
  .drfx-faq-list details p { margin: 0 28px 22px 42px; font-size: 12px; }
  .drfx-collection-hero, .drfx-collection-hero-inner { min-height: 310px; }
  .drfx-collection-hero-inner { padding-block: 44px; }
  .drfx-collection-hero h1 { font-size: 65px !important; }
  .drfx-collection-meta { align-items: flex-start; flex-direction: column; gap: 16px; }
  .drfx-collection-line { gap: 16px; }
  .drfx-collection-line span { font-size: 12px; }
  .drfx-collection-products { padding: 60px 0 72px; }
  .drfx-collection-grid, .drfx-collection-grid.is-single { grid-template-columns: 1fr !important; }
  .drfx-product-banner, .drfx-product-banner-inner { min-height: 270px; }
  .drfx-product-banner h1 { font-size: 56px !important; }
  .drfx-product-primary { padding: 48px 0 65px; }
  .drfx-product-gallery, .drfx-product-gallery > .image { min-height: 265px; }
  .drfx-product-purchase { padding: 30px 24px; }
  .drfx-product-details-grid { gap: 32px; }
  .drfx-product-description { padding: 24px !important; }
  .drfx-checkout-site { padding: 28px 0 60px !important; }
  .drfx-basket { width: calc(100% - 28px) !important; }
  .drfx-checkout-head { align-items: flex-start; flex-direction: column; min-height: 0; padding: 24px !important; }
  .drfx-checkout-head h1 { font-size: 34px !important; }
  .drfx-checkout-head-total { width: 100%; text-align: left; }
  .drfx-basket-card { padding: 18px; }
  .drfx-basket-item { grid-template-columns: 34px 1fr 30px; gap: 12px; }
  .drfx-basket-item .quantity-field { grid-column: 2; width: max-content; }
  .drfx-basket-item > .price { grid-column: 2; text-align: left; }
  .drfx-basket-item .remove { grid-column: 3; grid-row: 1; }
  .drfx-auth-card, .login-popup .drfx-auth-card { padding: 30px 24px !important; }
  .drfx-auth-card h2 { font-size: 42px !important; }
  .drfx-auth-form { grid-template-columns: 1fr; }
}


/* QA corrections: old FAQ rule + authentication inside either popup type */
.drfx-faq-list details[open] summary span { transform: none !important; }
.popup .popup-close::before { content: none !important; display: none !important; }
.popup .popup-close::after { content: "" !important; }
.login-popup .popup-scroll-cont,
.basket-popup:has(.drfx-auth-mark) .popup-scroll-cont { align-items: center !important; justify-content: center !important; }
.login-popup .login-popup-content,
.basket-popup .basket-popup-content:has(.drfx-auth-mark) {
  width: min(470px, calc(100vw - 32px)) !important;
  max-width: 470px !important;
  min-height: 0 !important;
  padding: 40px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: #f0f1ec !important;
  color: #111418 !important;
  box-shadow: 0 35px 100px rgba(0,0,0,.45) !important;
  text-align: left !important;
}
.login-popup .popup-content h2,
.basket-popup .popup-content:has(.drfx-auth-mark) h2 { margin: 10px 0 14px !important; color: #111418 !important; font-family: "Barlow Condensed", sans-serif !important; font-size: 48px !important; font-weight: 780 !important; letter-spacing: -.04em !important; line-height: .95 !important; }
.login-popup .drfx-auth-copy,
.basket-popup .popup-content:has(.drfx-auth-mark) .drfx-auth-copy { color: #636a68 !important; }
.login-popup .drfx-auth-foot,
.basket-popup .popup-content:has(.drfx-auth-mark) .drfx-auth-foot { border-color: #d4d8d3 !important; color: #747b79 !important; }
.login-popup .popup-close,
.basket-popup .popup-content:has(.drfx-auth-mark) .popup-close { background: #111418 !important; }
@media (max-width:650px) {
  .login-popup .login-popup-content,
  .basket-popup .basket-popup-content:has(.drfx-auth-mark) { padding: 30px 24px !important; }
  .login-popup .popup-content h2,
  .basket-popup .popup-content:has(.drfx-auth-mark) h2 { font-size: 42px !important; }
}


/* Product popup: preserve the full editorial product layout */
.store-product-popup .popup-scroll-cont {
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(24px, 4vw, 60px) 24px 90px !important;
}
.store-product-popup .store-product-popup-content.store-product-full {
  display: block !important;
  width: min(1500px, calc(100vw - 64px)) !important;
  max-width: 1500px !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: 10px 10px 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 12px !important;
  background: #11171b !important;
  box-shadow: 0 45px 140px rgba(0,0,0,.62) !important;
}
.store-product-popup-content.store-product-full > .drfx-product-banner,
.store-product-popup-content.store-product-full > .drfx-product-primary,
.store-product-popup-content.store-product-full > .drfx-product-details-section,
.store-product-popup-content.store-product-full > .drfx-product-faq-section,
.store-product-popup-content.store-product-full > .drfx-live-support {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}
.store-product-popup-content .drfx-live-wrap {
  width: min(calc(100% - 80px), 1260px) !important;
}
.store-product-popup-content .drfx-product-primary-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(430px, .85fr) !important;
}
.store-product-popup-content .drfx-product-details-grid {
  grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr) !important;
}
.store-product-popup-content .drfx-product-banner h1 {
  max-width: 1050px !important;
}
.store-product-popup .popup-close {
  z-index: 20 !important;
  top: 24px !important;
  right: 24px !important;
}
@media (max-width: 1050px) {
  .store-product-popup .store-product-popup-content.store-product-full {
    width: calc(100vw - 32px) !important;
  }
  .store-product-popup-content .drfx-product-primary-grid,
  .store-product-popup-content .drfx-product-details-grid,
  .store-product-popup-content .drfx-home-faq-layout {
    grid-template-columns: 1fr !important;
  }
  .store-product-popup-content .drfx-product-purchase {
    min-height: 0 !important;
  }
}
@media (max-width: 650px) {
  .store-product-popup .popup-scroll-cont {
    padding: 12px 8px 64px !important;
  }
  .store-product-popup .store-product-popup-content.store-product-full {
    width: calc(100vw - 16px) !important;
    padding: 6px 6px 0 !important;
    border-radius: 8px !important;
  }
  .store-product-popup-content .drfx-live-wrap {
    width: calc(100% - 32px) !important;
  }
  .store-product-popup .popup-close {
    top: 14px !important;
    right: 14px !important;
  }
}

/* DrFx marketplace home — equal-weight catalog */
.drfx-market-home .site-header { background:rgba(7,9,11,.9)!important; backdrop-filter:blur(18px); }
.drfx-marketplace-home { background:#101418; color:#f2f4ef; overflow:hidden; }
.drfx-marketplace-home *, .drfx-marketplace-home *::before, .drfx-marketplace-home *::after { box-sizing:border-box; }
.drfx-market-hero { position:relative; min-height:650px; display:flex; align-items:center; background:radial-gradient(circle at 72% 36%,rgba(73,216,190,.16),transparent 34%),linear-gradient(135deg,#0a0d10 0%,#10161a 58%,#0d1415 100%); overflow:hidden; }
.drfx-market-hero::before { content:""; position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px); background-size:70px 70px; mask-image:linear-gradient(90deg,#000,transparent 78%); }
.drfx-market-hero::after { content:"DRFX"; position:absolute; left:-28px; bottom:-116px; color:rgba(255,255,255,.025); font:800 290px/.8 "Barlow Condensed",sans-serif; letter-spacing:-.07em; }
.drfx-market-hero-grid { position:relative; z-index:2; min-height:650px; display:grid; grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr); align-items:center; gap:72px; padding-block:72px; }
.drfx-market-hero-copy { position:relative; z-index:3; }
.drfx-market-hero-copy h1 { margin:24px 0 24px!important; max-width:720px; color:#f5f6f2!important; font:800 clamp(72px,7.4vw,122px)/.78 "Barlow Condensed",sans-serif!important; letter-spacing:-.055em!important; text-transform:uppercase; }
.drfx-market-hero-copy h1 em { color:#4ad9be; font-style:normal; }
.drfx-market-hero-copy>p { max-width:575px; margin:0; color:#98a29f; font-size:16px; line-height:1.75; }
.drfx-market-hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.drfx-market-primary,.drfx-market-secondary { min-height:50px; display:inline-flex; align-items:center; justify-content:center; gap:22px; padding:0 22px; border-radius:6px; font-size:11px; font-weight:800; letter-spacing:.08em; text-decoration:none!important; transition:transform .2s ease,background .2s ease,border-color .2s ease; }
.drfx-market-primary { background:#4ad9be; color:#0b1012!important; box-shadow:0 14px 38px rgba(74,217,190,.16); }
.drfx-market-secondary { border:1px solid rgba(255,255,255,.14); color:#fff!important; background:rgba(255,255,255,.025); }
.drfx-market-primary:hover,.drfx-market-secondary:hover { transform:translateY(-2px); }
.drfx-market-proof { display:flex; flex-wrap:wrap; gap:24px; margin-top:42px; padding-top:22px; border-top:1px solid rgba(255,255,255,.08); }
.drfx-market-proof span { display:flex; align-items:center; gap:8px; color:#6f7a78; font-size:9px; font-weight:800; letter-spacing:.11em; }
.drfx-market-proof b { color:#4ad9be; font:800 18px/1 "Barlow Condensed",sans-serif; }
.drfx-market-visual { position:relative; height:520px; }
.drfx-market-shot { position:absolute; display:block; overflow:hidden; border:1px solid rgba(255,255,255,.15); border-radius:9px; background:#12171b; box-shadow:0 35px 90px rgba(0,0,0,.48); transition:transform .35s ease,border-color .35s ease; }
.drfx-market-shot:hover { border-color:rgba(74,217,190,.65); }
.drfx-market-shot img { width:100%; height:100%; object-fit:cover; filter:saturate(.85) brightness(.8); transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .3s ease; }
.drfx-market-shot:hover img { transform:scale(1.045); filter:saturate(1) brightness(.95); }
.drfx-market-shot::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(7,9,11,.78)); }
.drfx-market-shot span { position:absolute; z-index:2; left:18px; bottom:16px; color:#fff; font-size:9px; font-weight:800; letter-spacing:.14em; }
.drfx-market-shot-main { width:66%; height:330px; left:1%; top:42px; transform:rotate(-2.5deg); }
.drfx-market-shot-main:hover { transform:rotate(-1deg) translateY(-6px); }
.drfx-market-shot-small { width:47%; height:235px; left:9%; bottom:10px; transform:rotate(3deg); }
.drfx-market-shot-small:hover { transform:rotate(1deg) translateY(-6px); }
.drfx-market-shot-tall { width:43%; height:390px; right:0; top:78px; transform:rotate(3.5deg); }
.drfx-market-shot-tall:hover { transform:rotate(1.5deg) translateY(-6px); }
.drfx-market-ticker { position:relative; z-index:4; width:100%; overflow:hidden; background:#4ad9be; color:#0b1113; border-block:1px solid rgba(0,0,0,.15); }
.drfx-market-ticker>div { width:max-content; min-width:200%; display:flex; align-items:center; gap:28px; min-height:39px; animation:drfxMarketTicker 26s linear infinite; }
.drfx-market-ticker span { font-size:10px; font-weight:900; letter-spacing:.1em; }
.drfx-market-ticker i { font-style:normal; font-size:9px; }
@keyframes drfxMarketTicker { to { transform:translateX(-50%); } }
.drfx-market-catalog { position:relative; padding:88px 0 110px; background:radial-gradient(circle at 90% 10%,rgba(74,217,190,.055),transparent 28%),#101418; }
.drfx-market-catalog::after { content:""; position:absolute; inset:auto 0 0; height:180px; pointer-events:none; background:linear-gradient(transparent,rgba(0,0,0,.1)); }
.drfx-market-catalog>.drfx-live-wrap { position:relative; z-index:2; }
.drfx-market-catalog-head { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:38px; }
.drfx-market-catalog-head span,.drfx-market-values-head>span { display:block; margin-bottom:10px; color:#4ad9be; font-size:10px; font-weight:850; letter-spacing:.16em; }
.drfx-market-catalog-head h2,.drfx-market-values-head h2 { margin:0!important; color:#f2f4ef!important; font:800 clamp(48px,5vw,76px)/.88 "Barlow Condensed",sans-serif!important; letter-spacing:-.045em!important; }
.drfx-market-catalog-head>p { max-width:380px; margin:0 0 5px; color:#75817e; font-size:13px; line-height:1.65; text-align:right; }
.drfx-market-toolbar { display:grid; grid-template-columns:minmax(280px,1fr) auto; gap:14px; padding:14px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#0b0e11; box-shadow:0 18px 50px rgba(0,0,0,.18); }
.drfx-market-search { min-height:50px; display:grid; grid-template-columns:22px 1fr auto; align-items:center; gap:12px; padding:0 14px; border:1px solid rgba(255,255,255,.08); border-radius:7px; background:#11161a; }
.drfx-market-search>span { color:#4ad9be; font:400 25px/1 Arial,sans-serif; transform:rotate(-18deg); }
.drfx-market-search input { width:100%; border:0!important; outline:0!important; box-shadow:none!important; background:transparent!important; color:#eef1ec!important; font-size:12px!important; }
.drfx-market-search input::placeholder { color:#5f6b68; }
.drfx-market-search kbd { padding:5px 7px; border:1px solid rgba(255,255,255,.09); border-radius:4px; color:#66706e; background:#0c1012; font:700 9px/1 Arial,sans-serif; }
.drfx-market-filters { display:flex; align-items:center; gap:6px; }
.drfx-market-filters button { min-height:50px; padding:0 17px; border:1px solid transparent; border-radius:7px; color:#687370; background:transparent; font-size:9px; font-weight:850; letter-spacing:.1em; cursor:pointer; transition:.2s ease; }
.drfx-market-filters button:hover { color:#eef2ee; background:rgba(255,255,255,.04); }
.drfx-market-filters button.is-active { border-color:rgba(74,217,190,.32); color:#4ad9be; background:rgba(74,217,190,.09); }
.drfx-market-status { min-height:52px; display:flex; align-items:center; justify-content:space-between; gap:20px; color:#66716f; }
.drfx-market-status span,.drfx-market-status strong { font-size:9px; font-weight:800; letter-spacing:.13em; }
.drfx-market-status span { display:flex; align-items:center; gap:8px; color:#89938f; }
.drfx-market-status span i { width:6px; height:6px; border-radius:50%; background:#4ad9be; box-shadow:0 0 12px rgba(74,217,190,.65); }
.drfx-market-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.drfx-market-grid .drfx-store-card { min-width:0!important; width:auto!important; display:flex!important; flex-direction:column; overflow:hidden; border:1px solid rgba(255,255,255,.085)!important; border-radius:9px!important; background:#151a1f!important; box-shadow:0 18px 55px rgba(0,0,0,.2); transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease; }
.drfx-market-grid .drfx-store-card:hover { transform:translateY(-5px); border-color:rgba(74,217,190,.36)!important; box-shadow:0 28px 70px rgba(0,0,0,.32); }
.drfx-market-grid .drfx-store-card-media { position:relative; width:100%; height:270px!important; min-height:270px!important; display:block; overflow:hidden; border:0!important; border-radius:0!important; background:#0b0e10; }
.drfx-market-grid .drfx-store-card-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,rgba(7,10,12,.78)); pointer-events:none; }
.drfx-market-grid .drfx-store-card-media img,.drfx-market-grid .drfx-store-card-media .image { width:100%!important; height:100%!important; object-fit:cover!important; transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .3s ease; }
.drfx-market-grid .drfx-store-card:hover .drfx-store-card-media img { transform:scale(1.04); filter:saturate(1.06); }
.drfx-market-grid .drfx-store-card-media>span { z-index:2; right:14px!important; bottom:14px!important; left:auto!important; display:flex!important; align-items:center; gap:8px; padding:7px 9px; border:1px solid rgba(255,255,255,.16); border-radius:5px; color:#fff!important; background:rgba(8,11,13,.72); backdrop-filter:blur(8px); font-size:8px!important; font-weight:850; letter-spacing:.11em; }
.drfx-market-grid .drfx-store-card-body { flex:1; display:flex; flex-direction:column; padding:17px 17px 0!important; background:linear-gradient(180deg,#171c21,#14191d)!important; }
.drfx-market-grid .drfx-store-card-label { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 0 11px!important; color:#4ad9be; font-size:8px!important; font-weight:850; letter-spacing:.13em; }
.drfx-market-grid .drfx-store-card-label i { color:#626d6a!important; font-style:normal; }
.drfx-market-grid .product-title { min-height:46px; margin:0!important; font:750 22px/1.02 "Barlow Condensed",sans-serif!important; letter-spacing:-.025em!important; }
.drfx-market-grid .product-title a { color:#f1f3ef!important; text-decoration:none!important; }
.drfx-market-grid .drfx-store-card:hover .product-title a { color:#4ad9be!important; }
.drfx-market-grid .product-actions { margin:auto -17px 0!important; padding:13px 17px 16px!important; display:grid!important; grid-template-columns:1fr 46px!important; align-items:center; gap:12px; border-top:1px solid rgba(255,255,255,.07); background:#12171b!important; }
.drfx-market-grid .product-actions .price { margin:0!important; color:#f1f3ef!important; font:800 21px/1 "Barlow Condensed",sans-serif!important; }
.drfx-market-grid .product-actions .price strong { font:inherit!important; color:inherit!important; }
.drfx-market-grid .product-actions .add.btn-primary.wide { position:relative; width:46px!important; min-width:46px!important; height:42px!important; min-height:42px!important; padding:0!important; border-radius:6px!important; color:transparent!important; font-size:0!important; background:#4ad9be!important; box-shadow:none!important; }
.drfx-market-grid .product-actions .add.btn-primary.wide::after { content:""; position:absolute; inset:0; display:grid; place-items:center; color:#0c1113; font:800 24px/1 Arial,sans-serif; }
.drfx-market-grid .quantity-field { grid-column:1/-1; }
.drfx-market-skeleton { min-height:390px; overflow:hidden; border:1px solid rgba(255,255,255,.06); border-radius:9px; background:#14191d; }
.drfx-market-skeleton i { height:270px; display:block; background:linear-gradient(110deg,#151b1f 25%,#1d2529 45%,#151b1f 65%); background-size:250% 100%; animation:drfxMarketShimmer 1.5s linear infinite; }
.drfx-market-skeleton span,.drfx-market-skeleton b { display:block; height:11px; margin:20px 18px 0; border-radius:3px; background:#20272a; }
.drfx-market-skeleton b { width:45%; margin-top:12px; }
@keyframes drfxMarketShimmer { to { background-position-x:-250%; } }
.drfx-market-empty { min-height:210px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; border:1px dashed rgba(255,255,255,.1); border-radius:9px; color:#687370; }
.drfx-market-empty[hidden] { display:none!important; }
.drfx-market-empty b { color:#eef1ec; font:800 30px/1 "Barlow Condensed",sans-serif; }
.drfx-market-empty span { font-size:12px; }
.drfx-market-noscript { display:flex; gap:10px; padding-top:18px; }
.drfx-market-noscript a { color:#4ad9be; }
.drfx-market-values { padding:100px 0 112px; background:#eff1ec; color:#111518; }
.drfx-market-values-head { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:48px; }
.drfx-market-values-head h2 { color:#111518!important; }
.drfx-market-value-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #d5dad5; border-radius:9px; overflow:hidden; }
.drfx-market-value-grid>a { position:relative; min-height:310px; padding:32px; display:flex; flex-direction:column; color:#111518!important; text-decoration:none!important; background:#f5f6f2; border-right:1px solid #d5dad5; transition:background .25s ease,color .25s ease; }
.drfx-market-value-grid>a:last-child { border-right:0; }
.drfx-market-value-grid>a:hover { color:#f4f6f1!important; background:#12171b; }
.drfx-market-value-grid b { color:#47cdb4; font:800 17px/1 "Barlow Condensed",sans-serif; }
.drfx-market-value-grid span { margin-top:55px; color:#707976; font-size:9px; font-weight:850; letter-spacing:.15em; }
.drfx-market-value-grid h3 { margin:10px 0!important; color:inherit!important; font:800 36px/.95 "Barlow Condensed",sans-serif!important; letter-spacing:-.035em!important; }
.drfx-market-value-grid p { max-width:290px; margin:0; color:#747c79; font-size:12px; line-height:1.65; }
.drfx-market-value-grid>a:hover p,.drfx-market-value-grid>a:hover span { color:#a6b0ac; }
.drfx-market-value-grid i { margin-top:auto; color:#3fc9af; font-size:9px; font-weight:850; font-style:normal; letter-spacing:.12em; }
.drfx-market-faq { background:#11161a!important; }
@media (max-width:1100px) {
  .drfx-market-hero-grid { grid-template-columns:1fr; gap:20px; padding-top:90px; }
  .drfx-market-hero-copy { max-width:780px; }
  .drfx-market-visual { height:470px; max-width:760px; width:100%; margin:0 auto; }
  .drfx-market-toolbar { grid-template-columns:1fr; }
  .drfx-market-filters { display:grid; grid-template-columns:repeat(4,1fr); }
  .drfx-market-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .drfx-market-hero,.drfx-market-hero-grid { min-height:0; }
  .drfx-market-hero-grid { width:calc(100% - 34px)!important; padding:76px 0 48px; }
  .drfx-market-hero-copy h1 { font-size:63px!important; }
  .drfx-market-proof { gap:15px; }
  .drfx-market-visual { height:365px; }
  .drfx-market-shot-main { width:72%; height:230px; top:26px; }
  .drfx-market-shot-small { width:52%; height:165px; left:5%; }
  .drfx-market-shot-tall { width:44%; height:270px; top:58px; }
  .drfx-market-catalog { padding:66px 0 78px; }
  .drfx-market-catalog-head,.drfx-market-values-head { align-items:flex-start; flex-direction:column; gap:16px; }
  .drfx-market-catalog-head>p { text-align:left; }
  .drfx-market-toolbar { padding:10px; }
  .drfx-market-search kbd { display:none; }
  .drfx-market-filters { grid-template-columns:repeat(2,1fr); }
  .drfx-market-filters button { min-height:42px; }
  .drfx-market-grid { grid-template-columns:1fr; }
  .drfx-market-grid .drfx-store-card-media { height:245px!important; min-height:245px!important; }
  .drfx-market-value-grid { grid-template-columns:1fr; }
  .drfx-market-value-grid>a { min-height:250px; border-right:0; border-bottom:1px solid #d5dad5; }
  .drfx-market-value-grid>a:last-child { border-bottom:0; }
  .drfx-market-values { padding:72px 0; }
}
@media (prefers-reduced-motion:reduce) {
  .drfx-market-ticker>div,.drfx-market-skeleton i { animation:none!important; }
}

/* Visual hierarchy: Graphics leads; Pawn Shop remains an equal catalogue item. */
.drfx-market-shot-main { width:72%; height:360px; left:0; top:66px; z-index:3; }
.drfx-market-shot-small { width:44%; height:224px; left:11%; bottom:0; z-index:4; }
.drfx-market-shot-tall { width:34%; height:270px; right:1%; top:150px; z-index:2; }
@media (max-width:760px) {
  .drfx-market-shot-main { width:78%; height:280px; left:0; top:24px; }
  .drfx-market-shot-small { width:50%; height:180px; left:9%; bottom:0; }
  .drfx-market-shot-tall { width:34%; height:205px; right:0; top:128px; }
}


/* Fully dynamic home showcase: every live product receives equal visual weight. */
.drfx-market-visual.is-dynamic {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  height:520px;
  padding:54px 0 36px;
}
.drfx-market-visual.is-dynamic .drfx-market-shot-dynamic {
  position:relative!important;
  inset:auto!important;
  width:auto!important;
  height:330px!important;
  flex:1 1 0;
  min-width:0;
  transform:none;
  z-index:2;
}
.drfx-market-visual.is-dynamic .drfx-market-shot-slot-1 { transform:translateY(-22px) rotate(-1.5deg); }
.drfx-market-visual.is-dynamic .drfx-market-shot-slot-2 { transform:translateY(24px); }
.drfx-market-visual.is-dynamic .drfx-market-shot-slot-3 { transform:translateY(-8px) rotate(1.5deg); }
.drfx-market-visual.is-dynamic .drfx-market-shot-dynamic:hover { transform:translateY(-8px); z-index:5; }
.drfx-market-visual.is-dynamic[data-count="1"] .drfx-market-shot-dynamic { flex:0 1 68%; }
.drfx-market-visual.is-dynamic[data-count="2"] .drfx-market-shot-dynamic { flex:0 1 45%; }
.drfx-market-visual-loading { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; width:100%; align-items:center; }
.drfx-market-visual-loading i { display:block; height:330px; border:1px solid rgba(255,255,255,.08); border-radius:9px; background:linear-gradient(105deg,#11171a 20%,#192224 40%,#11171a 60%); background-size:220% 100%; animation:drfxMarketSkeleton 1.5s linear infinite; }
.drfx-market-visual-loading i:first-child { transform:translateY(-22px); }
.drfx-market-visual-loading i:nth-child(2) { transform:translateY(24px); }
.drfx-market-visual-loading i:last-child { transform:translateY(-8px); }
.drfx-market-visual-empty { display:flex; flex-direction:column; justify-content:center; width:100%; min-height:300px; padding:42px; border:1px solid rgba(74,217,190,.18); border-radius:10px; background:linear-gradient(145deg,rgba(74,217,190,.08),rgba(255,255,255,.015)); }
.drfx-market-visual-empty i { color:#4ad9be; font-style:normal; font-size:10px; font-weight:900; letter-spacing:.18em; }
.drfx-market-visual-empty b { max-width:420px; margin-top:18px; color:#f2f4ef; font:800 clamp(30px,4vw,52px)/.96 "Barlow Condensed",sans-serif; }
.drfx-market-visual-empty span { margin-top:14px; color:#7f8a88; font-size:13px; }
.drfx-market-more { position:absolute; right:2px; bottom:12px; z-index:8; padding:8px 11px; border:1px solid rgba(74,217,190,.28); border-radius:5px; background:#101719; color:#4ad9be!important; font-size:9px; font-weight:900; letter-spacing:.11em; }
.drfx-market-value-grid { grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.drfx-market-filters { flex-wrap:wrap; }
@media (max-width:760px) {
  .drfx-market-visual.is-dynamic { height:360px; gap:8px; padding:28px 0 22px; }
  .drfx-market-visual.is-dynamic .drfx-market-shot-dynamic { height:245px!important; }
  .drfx-market-visual.is-dynamic .drfx-market-shot-slot-1 { transform:translateY(-14px) rotate(-1deg); }
  .drfx-market-visual.is-dynamic .drfx-market-shot-slot-2 { transform:translateY(16px); }
  .drfx-market-visual.is-dynamic .drfx-market-shot-slot-3 { transform:translateY(-4px) rotate(1deg); }
  .drfx-market-visual-loading i { height:245px; }
  .drfx-market-visual-empty { min-height:245px; padding:28px; }
  .drfx-market-more { bottom:0; }
}


/* Dynamic store dropdown navigation */
.drfx-site-header { overflow:visible!important; }
.drfx-site-header .site-header-inner { overflow:visible!important; }
.drfx-site-nav { overflow:visible!important; }
.drfx-nav-store { position:relative; z-index:80; }
.drfx-nav-store > summary {
  display:flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:0 16px;
  border:1px solid transparent;
  border-radius:999px;
  color:#c4cecb;
  cursor:pointer;
  list-style:none;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:color .2s ease,background .2s ease,border-color .2s ease;
}
.drfx-nav-store > summary::-webkit-details-marker { display:none; }
.drfx-nav-store > summary::marker { display:none; content:""; }
.drfx-nav-store > summary i { color:#4ad9be; font-style:normal; font-size:14px; transition:transform .24s ease; }
.drfx-nav-store:hover > summary,
.drfx-nav-store[open] > summary,
.drfx-nav-store > summary:focus-visible { color:#fff; border-color:rgba(255,255,255,.12); background:rgba(255,255,255,.075); outline:none; }
.drfx-nav-store[open] > summary i { transform:rotate(180deg); }
.drfx-nav-dropdown {
  display:block!important;
  position:absolute;
  top:calc(100% + 13px);
  left:50%;
  width:318px;
  padding:10px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:10px;
  background:rgba(10,14,16,.98);
  box-shadow:0 28px 75px rgba(0,0,0,.58),0 0 0 1px rgba(74,217,190,.025) inset;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,-8px);
  transition:opacity .18s ease,visibility .18s ease,transform .18s ease;
}
.drfx-nav-store:hover .drfx-nav-dropdown,
.drfx-nav-store:focus-within .drfx-nav-dropdown,
.drfx-nav-store[open] .drfx-nav-dropdown { opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0); }
.drfx-nav-dropdown::before { content:""; position:absolute; right:0; bottom:100%; left:0; height:15px; }
.drfx-nav-dropdown-head { display:flex; align-items:center; justify-content:space-between; padding:8px 10px 12px; border-bottom:1px solid rgba(255,255,255,.08); }
.drfx-nav-dropdown-head span { color:#6f7a78; font-size:9px; font-weight:900; letter-spacing:.16em; }
.drfx-nav-dropdown-head b { display:grid; place-items:center; min-width:23px; height:20px; padding:0 6px; border-radius:999px; background:rgba(74,217,190,.1); color:#4ad9be; font-size:10px; }
.drfx-nav-dropdown-list { display:grid; gap:3px; padding:7px 0; }
.drfx-nav-dropdown-list > a,
.drfx-nav-all { display:flex!important; align-items:center; justify-content:space-between; min-height:50px; padding:0 11px!important; border-radius:6px; color:#a8b2b0!important; transition:background .18s ease,color .18s ease,transform .18s ease!important; }
.drfx-nav-dropdown-list > a::after,
.drfx-nav-all::after { display:none!important; }
.drfx-nav-dropdown-list > a > span { display:flex; align-items:center; gap:12px; }
.drfx-nav-dropdown-list small { display:grid; place-items:center; width:25px; height:25px; border:1px solid rgba(255,255,255,.1); border-radius:4px; color:#4ad9be; font-size:9px; font-weight:900; }
.drfx-nav-dropdown-list strong { font-size:12px; font-weight:800; letter-spacing:.045em; text-transform:uppercase; }
.drfx-nav-dropdown-list > a > i,
.drfx-nav-all > i { color:#697371; font-style:normal; transition:transform .18s ease,color .18s ease; }
.drfx-nav-dropdown-list > a:hover,
.drfx-nav-dropdown-list > a:focus-visible { background:rgba(255,255,255,.06); color:#fff!important; transform:translateX(2px); outline:none; }
.drfx-nav-dropdown-list > a:hover > i { color:#4ad9be; transform:translateX(3px); }
.drfx-nav-dropdown-list p { margin:0; padding:18px 11px; color:#76817f; font-size:12px; }
.drfx-nav-all { min-height:43px; border-top:1px solid rgba(255,255,255,.08); border-radius:0 0 5px 5px; color:#4ad9be!important; font-size:9px!important; font-weight:900!important; letter-spacing:.13em!important; }
.drfx-nav-all:hover { background:rgba(74,217,190,.07); }
@media (max-width:900px) {
  .drfx-site-header .site-header-inner { grid-template-columns:auto 1fr auto!important; gap:10px!important; }
  .drfx-site-nav { display:flex!important; justify-content:flex-end; gap:0!important; }
  .drfx-site-nav > a { display:none!important; }
  .drfx-nav-store > summary { min-height:38px; padding:0 12px; font-size:10px; }
  .drfx-nav-dropdown { position:fixed; top:72px; right:16px; left:16px; width:auto; max-height:calc(100vh - 92px); overflow:auto; transform:translateY(-8px); }
  .drfx-nav-store:hover .drfx-nav-dropdown,
  .drfx-nav-store:focus-within .drfx-nav-dropdown,
  .drfx-nav-store[open] .drfx-nav-dropdown { transform:translateY(0); }
  .drfx-account { gap:5px; }
  .drfx-site-header .drfx-account .log-in,
  .drfx-site-header .drfx-account .open-basket { min-width:auto!important; padding-inline:12px!important; font-size:9px!important; }
}


/* Compact store menu — quiet, cohesive, and easy to scan. */
.drfx-nav-store > summary { min-height:36px; padding:0 13px; gap:7px; }
.drfx-nav-store[open] > summary,
.drfx-nav-store:hover > summary { background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.08); }
.drfx-nav-dropdown { width:250px; padding:8px; border-radius:14px; background:rgba(16,18,20,.985); }
.drfx-nav-dropdown-list { gap:1px; padding:0; }
.drfx-nav-dropdown-list > a { min-height:42px; padding:0 10px!important; border-radius:8px; }
.drfx-nav-dropdown-list > a > strong { color:#aeb7b5; font-size:12.5px; font-weight:750; letter-spacing:.01em; text-transform:none; }
.drfx-nav-dropdown-list > a > i { color:#7e8987; font-size:19px; line-height:1; }
.drfx-nav-dropdown-list > a:hover,
.drfx-nav-dropdown-list > a:focus-visible { background:rgba(255,255,255,.18); color:#fff!important; transform:none; }
.drfx-nav-dropdown-list > a:hover > strong,
.drfx-nav-dropdown-list > a:focus-visible > strong { color:#fff; }
.drfx-nav-dropdown-list > a:hover > i,
.drfx-nav-dropdown-list > a:focus-visible > i { color:#fff; transform:translateX(2px); }
@media (max-width:900px) {
  .drfx-nav-dropdown { top:68px; right:auto; left:50%; width:min(250px,calc(100vw - 32px)); transform:translate(-50%,-8px); }
  .drfx-nav-store:hover .drfx-nav-dropdown,
  .drfx-nav-store:focus-within .drfx-nav-dropdown,
  .drfx-nav-store[open] .drfx-nav-dropdown { transform:translate(-50%,0); }
}


/* Crisp SVG chevrons — consistent across fonts and browsers. */
.drfx-nav-store > summary .drfx-chevron-down {
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:#4ad9be;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .22s ease;
}
.drfx-nav-store[open] > summary .drfx-chevron-down { transform:rotate(180deg); }
.drfx-nav-dropdown-list > a > .drfx-chevron-right {
  width:15px;
  height:15px;
  flex:0 0 15px;
  fill:none;
  stroke:#7e8987;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .18s ease,stroke .18s ease;
}
.drfx-nav-dropdown-list > a:hover > .drfx-chevron-right,
.drfx-nav-dropdown-list > a:focus-visible > .drfx-chevron-right {
  stroke:#fff;
  transform:translateX(2px);
}


/* Slimmer dropdown footprint */
.drfx-nav-dropdown {
  width: 214px;
  padding: 6px;
}

.drfx-nav-dropdown-list > a {
  min-height: 40px;
  padding: 0 9px !important;
}

.drfx-nav-dropdown-list > a > strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.drfx-nav-dropdown-list > a > .drfx-chevron-right {
  width: 14px;
  height: 14px;
  flex-basis: 14px;
}

@media (max-width: 900px) {
  .drfx-nav-dropdown {
    width: min(214px, calc(100vw - 32px));
  }
}


/* DRFX icon system — all interface glyphs are real SVGs, never font characters. */
.drfx-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
  pointer-events: none;
}

.drfx-icon-spark {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
  fill: currentColor;
  stroke: none;
}

.drfx-market-search > .drfx-icon-search {
  width: 19px;
  height: 19px;
  color: #4ad9be;
  stroke-width: 1.8;
}

.drfx-market-hero-actions .drfx-icon,
.drfx-live-support a .drfx-icon,
.drfx-auth-button .drfx-icon,
.drfx-market-value-grid a i .drfx-icon,
.drfx-store-card-media > span .drfx-icon {
  width: 15px;
  height: 15px;
  flex-basis: 15px;
}

.drfx-market-ticker .drfx-icon-spark {
  color: currentColor;
}

.drfx-market-value-grid a i {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.drfx-store-card-media > span,
.drfx-product-back,
.drfx-basket-empty a,
.drfx-auth-button {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
}

.drfx-faq-list summary > .drfx-icon-plus {
  width: 19px;
  height: 19px;
  flex-basis: 19px;
  color: #50e3c2;
  stroke-width: 1.75;
  transition: transform .2s ease;
}

.drfx-faq-list details[open] summary > .drfx-icon-plus {
  transform: rotate(45deg);
}

.quantity-field .drfx-icon,
.drfx-basket-item .remove .drfx-icon {
  width: 15px;
  height: 15px;
  flex-basis: 15px;
}

.drfx-basket-summary .checkout .drfx-icon,
.drfx-basket-empty a .drfx-icon {
  width: 15px;
  height: 15px;
  flex-basis: 15px;
}

.drfx-basket-summary li > .drfx-icon-check {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  margin-top: 1px;
  color: #078f76;
  stroke-width: 2.4;
}

.popup .popup-close::after {
  content: "" !important;
  inset: 50% auto auto 50% !important;
  width: 17px;
  height: 17px;
  transform: translate(-50%, -50%);
  background: center / 17px 17px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 6 12 12M18 6 6 18'/%3E%3C/svg%3E");
}

.drfx-market-grid .product-actions .add.btn-primary.wide::after {
  content: "" !important;
  background-color: #0c1113;
  -webkit-mask: center / 20px 20px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  mask: center / 20px 20px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
}

.drfx-live-deps span::before {
  content: "" !important;
  display: inline-block;
  width: 6px;
  height: 1px;
  margin: 0 6px 2px 0;
  background: #0a9f82;
  transform: rotate(-55deg);
  transform-origin: center;
}

/* DS Home — brand-led storefront, September 2026 */
.ds-home-page .site-header {
  background: rgba(5, 9, 8, .88) !important;
  border-bottom-color: rgba(102, 236, 208, .1) !important;
  backdrop-filter: blur(16px) saturate(115%);
}

.ds-home {
  overflow: hidden;
  color: #eef5f1;
  background: #07100e;
}

.ds-home *,
.ds-home *::before,
.ds-home *::after {
  box-sizing: border-box;
}

.ds-hero {
  position: relative;
  min-height: 650px;
  isolation: isolate;
  overflow: hidden;
  background: #06100d;
}

.ds-hero-art,
.ds-hero-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.ds-hero-art {
  z-index: -3;
  background-image: var(--drfx-hero-image);
  background-repeat: no-repeat;
  background-position: 83% 50%;
  background-size: auto 138%;
  filter: saturate(.94) contrast(1.04);
  transform: scale(1.01);
}

.ds-hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(4, 9, 8, .98) 0%, rgba(4, 9, 8, .92) 27%, rgba(4, 9, 8, .48) 53%, rgba(4, 9, 8, .08) 77%),
    linear-gradient(180deg, rgba(3, 7, 6, .18), transparent 55%, rgba(3, 8, 7, .72));
}

.ds-hero::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(78, 225, 194, .6), transparent);
}

.ds-hero-inner {
  min-height: 650px;
  display: flex;
  align-items: center;
}

.ds-hero-copy {
  width: min(590px, 52%);
  padding: 86px 0 102px;
}

.ds-hero-kicker {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 25px;
  color: #afbbb7;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .025em;
}

.ds-hero-kicker > span {
  width: 24px;
  height: 2px;
  background: #50dfc1;
  box-shadow: 0 0 14px rgba(80, 223, 193, .48);
}

.ds-hero-copy h1 {
  max-width: 570px;
  margin: 0 !important;
  color: #f4f7f5 !important;
  font: 720 clamp(64px, 6.1vw, 102px) / .86 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.045em !important;
  text-wrap: balance;
}

.ds-hero-lede {
  max-width: 510px;
  margin: 28px 0 0;
  color: #a5afac;
  font-size: 16px;
  line-height: 1.75;
}

.ds-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 31px;
}

.ds-button {
  min-height: 49px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 0 19px;
  border: 1px solid transparent;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none !important;
  transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}

.ds-button .drfx-icon {
  width: 15px;
  height: 15px;
  flex-basis: 15px;
}

.ds-button-primary {
  color: #07110e !important;
  background: #51ddc0;
}

.ds-button-primary:hover {
  color: #07110e !important;
  background: #75ead2;
  transform: translateY(-2px);
}

.ds-button-ghost {
  color: #edf4f1 !important;
  border-color: rgba(234, 246, 241, .2);
  background: rgba(5, 12, 10, .38);
  backdrop-filter: blur(8px);
}

.ds-button-ghost:hover {
  border-color: rgba(81, 221, 192, .55);
  background: rgba(81, 221, 192, .08);
  transform: translateY(-2px);
}

.ds-live-note {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 33px 0 0;
  color: #899591;
  font-size: 11px;
}

.ds-live-note > span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #50dfc1;
  box-shadow: 0 0 12px rgba(80, 223, 193, .72);
}

.ds-live-note strong {
  color: #eaf4f0;
  font-weight: 800;
}

.ds-live-note small {
  margin-left: 8px;
  padding-left: 16px;
  border-left: 1px solid rgba(255, 255, 255, .14);
  color: #66716e;
  font-size: 10px;
}

.ds-hero-scroll {
  position: absolute;
  right: clamp(24px, 4vw, 68px);
  bottom: 28px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(232, 242, 238, .7) !important;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none !important;
}

.ds-hero-scroll .drfx-icon {
  width: 16px;
  height: 16px;
}

.ds-ticker {
  position: relative;
  z-index: 3;
  overflow: hidden;
  color: #06110e;
  background: #51ddc0;
  border-block: 1px solid rgba(0, 0, 0, .18);
}

.ds-ticker-track {
  width: max-content;
  min-width: 200%;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 27px;
  padding-right: 27px;
  animation: dsTicker 28s linear infinite;
}

.ds-ticker-track > span {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ds-ticker-mark {
  width: 11px;
  height: 11px;
  flex-basis: 11px;
  fill: currentColor;
  stroke: none;
}

@keyframes dsTicker {
  to { transform: translateX(-50%); }
}

.ds-catalog {
  padding: 94px 0 112px;
  color: #111714;
  background:
    linear-gradient(rgba(11, 33, 27, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11, 33, 27, .035) 1px, transparent 1px),
    #e9eeeb;
  background-size: 72px 72px;
}

.ds-catalog-head {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
  align-items: end;
  gap: 56px;
  margin-bottom: 42px;
}

.ds-catalog-head h2 {
  max-width: 760px;
  margin: 0 !important;
  color: #0d1512 !important;
  font: 720 clamp(52px, 5.3vw, 82px) / .9 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.045em !important;
}

.ds-catalog-head p {
  max-width: 430px;
  margin: 0 0 5px;
  color: #59645f;
  font-size: 14px;
  line-height: 1.7;
}

.ds-catalog-tools {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 15px 0;
  border-block: 1px solid #c9d2cd;
}

.ds-search {
  min-height: 50px;
  display: grid;
  grid-template-columns: 20px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  border: 1px solid #cbd4cf;
  border-radius: 4px;
  background: rgba(255, 255, 255, .74);
  transition: border-color .18s ease, background .18s ease;
}

.ds-search:focus-within {
  border-color: #13977d;
  background: #fff;
}

.ds-search .drfx-icon {
  width: 18px;
  height: 18px;
  color: #108c74;
}

.ds-search input {
  width: 100%;
  height: 48px;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  color: #111714 !important;
  background: transparent !important;
  font-size: 13px !important;
}

.ds-search input::placeholder {
  color: #79837e;
}

.ds-search kbd {
  padding: 5px 7px;
  border: 1px solid #d3dad6;
  border-radius: 3px;
  color: #77817c;
  background: #edf1ef;
  font: 700 9px / 1 "DM Sans", sans-serif;
}

.ds-filters {
  display: flex;
  align-items: center;
  gap: 6px;
}

.ds-filters button {
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid transparent;
  border-radius: 4px;
  color: #59635e;
  background: transparent;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
  white-space: nowrap;
  transition: color .18s ease, background .18s ease, border-color .18s ease;
}

.ds-filters button:hover {
  color: #0b1511;
  border-color: #bdc8c2;
  background: rgba(255, 255, 255, .55);
}

.ds-filters button.is-active {
  color: #ecf7f2;
  border-color: #0c1a16;
  background: #0c1a16;
}

.ds-catalog-status {
  min-height: 57px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: #65716b;
  font-size: 10px;
  font-weight: 750;
}

.ds-catalog-status span {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ds-catalog-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #129b80;
}

.ds-catalog-status strong {
  color: #33403a;
  font-size: 10px;
  font-weight: 800;
}

.ds-product-grid.drfx-market-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.ds-product-grid.drfx-market-grid .drfx-store-card {
  overflow: hidden;
  border: 1px solid #ccd4d0 !important;
  border-radius: 5px !important;
  background: #f7f9f6 !important;
  box-shadow: 0 14px 34px rgba(16, 33, 27, .08);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ds-product-grid.drfx-market-grid .drfx-store-card:hover {
  transform: translateY(-4px);
  border-color: #8fa49a !important;
  box-shadow: 0 22px 48px rgba(16, 33, 27, .14);
}

.ds-product-grid.drfx-market-grid .drfx-store-card-media {
  height: 252px !important;
  min-height: 252px !important;
  border-radius: 0 !important;
  background: #07100e;
}

.ds-product-grid.drfx-market-grid .drfx-store-card-media::after {
  background: linear-gradient(180deg, transparent 58%, rgba(4, 9, 8, .58));
}

.ds-product-grid.drfx-market-grid .drfx-store-card-media img,
.ds-product-grid.drfx-market-grid .drfx-store-card-media .image {
  filter: saturate(.92) contrast(1.02);
}

.ds-product-grid.drfx-market-grid .drfx-store-card:hover .drfx-store-card-media img {
  filter: saturate(1.06) contrast(1.02);
}

.ds-product-grid.drfx-market-grid .drfx-store-card-body {
  padding: 18px 18px 0 !important;
  color: #101613;
  background: #f7f9f6 !important;
}

.ds-product-grid.drfx-market-grid .drfx-store-card-label {
  color: #0d8e74;
}

.ds-product-grid.drfx-market-grid .drfx-store-card-label i {
  color: #7b8781 !important;
}

.ds-product-grid.drfx-market-grid .product-title {
  min-height: 46px;
  color: #111714 !important;
  font-size: 23px !important;
}

.ds-product-grid.drfx-market-grid .product-title a {
  color: #111714 !important;
}

.ds-product-grid.drfx-market-grid .drfx-store-card:hover .product-title a {
  color: #087d67 !important;
}

.ds-product-grid.drfx-market-grid .product-actions {
  margin: auto -18px 0 !important;
  padding: 14px 18px 17px !important;
  border-top: 1px solid #d9dfdc;
  background: #f1f4f1 !important;
}

.ds-product-grid.drfx-market-grid .product-actions .price,
.ds-product-grid.drfx-market-grid .product-actions .price strong {
  color: #111714 !important;
}

.ds-product-grid.drfx-market-grid .product-actions .add.btn-primary.wide {
  background: #0c1a16 !important;
}

.ds-product-grid.drfx-market-grid .product-actions .add.btn-primary.wide::after {
  background-color: #51ddc0 !important;
}

.ds-product-skeleton {
  min-height: 380px;
  overflow: hidden;
  border: 1px solid #ccd4d0;
  border-radius: 5px;
  background: #f7f9f6;
}

.ds-product-skeleton i {
  height: 252px;
  display: block;
  background: linear-gradient(105deg, #dfe6e2 20%, #eef2ef 40%, #dfe6e2 60%);
  background-size: 220% 100%;
  animation: dsShimmer 1.5s linear infinite;
}

.ds-product-skeleton span,
.ds-product-skeleton b {
  display: block;
  height: 11px;
  margin: 20px 18px 0;
  border-radius: 2px;
  background: #dce3df;
}

.ds-product-skeleton b {
  width: 44%;
  margin-top: 12px;
}

@keyframes dsShimmer {
  to { background-position-x: -220%; }
}

.ds-empty {
  min-height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px dashed #adbab3;
  color: #66726c;
  text-align: center;
}

.ds-empty[hidden] {
  display: none !important;
}

.ds-empty strong {
  color: #15201b;
  font: 700 30px / 1 "Barlow Condensed", sans-serif;
}

.ds-empty span {
  font-size: 12px;
}

.ds-noscript {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.ds-noscript a {
  padding: 8px 12px;
  border: 1px solid #c4cec8;
  color: #0a7d67 !important;
}

.ds-route {
  position: relative;
  overflow: hidden;
  padding: 78px 0;
  background: #07110e;
}

.ds-route::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(90deg, #07110e 10%, rgba(7, 17, 14, .8), #07110e 92%), var(--drfx-hero-image);
  background-repeat: no-repeat;
  background-position: center, 82% 48%;
  background-size: cover, auto 230%;
  opacity: .28;
  pointer-events: none;
}

.ds-route-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 48px;
}

.ds-route h2 {
  margin: 0 !important;
  color: #f0f5f2 !important;
  font: 700 clamp(40px, 4.2vw, 64px) / .92 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.035em !important;
}

.ds-route p {
  max-width: 630px;
  margin: 16px 0 0;
  color: #87938e;
  font-size: 14px;
  line-height: 1.7;
}

.ds-route nav {
  display: flex;
  gap: 9px;
}

.ds-route nav a {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 0 16px;
  border: 1px solid rgba(235, 246, 241, .16);
  border-radius: 4px;
  color: #eaf3ef !important;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none !important;
  transition: border-color .18s ease, background .18s ease;
}

.ds-route nav a:hover {
  border-color: rgba(81, 221, 192, .55);
  background: rgba(81, 221, 192, .08);
}

.ds-route nav .drfx-icon {
  width: 14px;
  height: 14px;
  flex-basis: 14px;
  color: #51ddc0;
}

.ds-home a:focus-visible,
.ds-home button:focus-visible,
.ds-home input:focus-visible {
  outline: 2px solid #51ddc0 !important;
  outline-offset: 3px;
}

@media (max-width: 1080px) {
  .ds-hero-art {
    background-position: 108% 50%;
    background-size: auto 124%;
    opacity: .78;
  }

  .ds-hero-shade {
    background: linear-gradient(90deg, rgba(4, 9, 8, .98) 0%, rgba(4, 9, 8, .9) 42%, rgba(4, 9, 8, .38) 78%, rgba(4, 9, 8, .1));
  }

  .ds-hero-copy {
    width: min(570px, 64%);
  }

  .ds-catalog-tools {
    grid-template-columns: 1fr;
  }

  .ds-filters {
    overflow-x: auto;
    scrollbar-width: thin;
  }

  .ds-product-grid.drfx-market-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .ds-hero,
  .ds-hero-inner {
    min-height: 690px;
  }

  .ds-hero-art {
    background-position: center -28px;
    background-size: auto 63%;
    opacity: .95;
  }

  .ds-hero-shade {
    background: linear-gradient(180deg, rgba(4, 9, 8, .08) 0%, rgba(4, 9, 8, .18) 30%, rgba(4, 9, 8, .98) 57%, #040908 100%);
  }

  .ds-hero-inner {
    align-items: flex-end;
  }

  .ds-hero-copy {
    width: 100%;
    padding: 330px 0 58px;
  }

  .ds-hero-kicker {
    margin-bottom: 17px;
    font-size: 11px;
  }

  .ds-hero-copy h1 {
    font-size: clamp(51px, 15vw, 68px) !important;
    line-height: .89 !important;
  }

  .ds-hero-lede {
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.65;
  }

  .ds-hero-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 24px;
  }

  .ds-button {
    min-height: 47px;
    gap: 11px;
    padding: 0 12px;
    font-size: 11px;
  }

  .ds-live-note {
    margin-top: 24px;
  }

  .ds-live-note small,
  .ds-hero-scroll {
    display: none;
  }

  .ds-ticker-track {
    min-height: 40px;
    gap: 22px;
    padding-right: 22px;
  }

  .ds-catalog {
    padding: 68px 0 76px;
    background-size: 54px 54px;
  }

  .ds-catalog-head {
    grid-template-columns: 1fr;
    gap: 17px;
    margin-bottom: 30px;
  }

  .ds-catalog-head h2 {
    font-size: 52px !important;
  }

  .ds-catalog-head p {
    font-size: 13px;
  }

  .ds-catalog-tools {
    gap: 11px;
    padding: 12px 0;
  }

  .ds-search kbd {
    display: none;
  }

  .ds-filters {
    margin-right: -20px;
    padding-right: 20px;
  }

  .ds-filters button {
    flex: 0 0 auto;
  }

  .ds-product-grid.drfx-market-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .ds-product-grid.drfx-market-grid .drfx-store-card-media {
    height: 236px !important;
    min-height: 236px !important;
  }

  .ds-product-skeleton i {
    height: 236px;
  }

  .ds-route {
    padding: 62px 0;
  }

  .ds-route-inner {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 27px;
  }

  .ds-route nav {
    width: 100%;
  }

  .ds-route nav a {
    flex: 1;
    justify-content: space-between;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ds-ticker-track,
  .ds-product-skeleton i {
    animation: none !important;
  }

  .ds-button,
  .ds-product-grid.drfx-market-grid .drfx-store-card {
    transition: none !important;
  }
}


/* =========================================================
   DRFX CATEGORY / SCRIPTS — editorial collection system
   ========================================================= */
.ds-category-page .site-header {
  background: rgba(5, 9, 8, .9) !important;
  border-bottom-color: rgba(102, 236, 208, .1) !important;
  backdrop-filter: blur(16px) saturate(115%);
}

.ds-category {
  overflow: hidden;
  color: #eef5f1;
  background: #e9eeeb;
}

.ds-category *,
.ds-category *::before,
.ds-category *::after {
  box-sizing: border-box;
}

.ds-category-hero {
  position: relative;
  min-height: 505px;
  isolation: isolate;
  overflow: hidden;
  background: #06100d;
}

.ds-category-art,
.ds-category-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.ds-category-art {
  z-index: -3;
  background-image: var(--drfx-hero-image);
  background-repeat: no-repeat;
  background-position: 84% 49%;
  background-size: auto 154%;
  filter: saturate(.82) contrast(1.08);
  transform: scale(1.02);
}

.ds-category-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3, 8, 7, .99) 0%, rgba(3, 8, 7, .91) 35%, rgba(3, 8, 7, .42) 65%, rgba(3, 8, 7, .14) 100%),
    linear-gradient(180deg, rgba(3, 7, 6, .26), transparent 42%, rgba(3, 8, 7, .82));
}

.ds-category-hero::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(80, 223, 193, .62), transparent);
}

.ds-category-hero-inner {
  min-height: 505px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  grid-template-rows: auto 1fr auto;
  column-gap: 76px;
  padding-top: 42px;
  padding-bottom: 52px;
}

.ds-category-back {
  grid-column: 1 / -1;
  width: max-content;
  align-self: start;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #a8b2ae !important;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none !important;
  transition: color .18s ease;
}

.ds-category-back:hover {
  color: #f3f7f5 !important;
}

.ds-category-back .drfx-icon {
  width: 15px;
  height: 15px;
}

.ds-category-title {
  grid-column: 1;
  grid-row: 3;
  align-self: end;
}

.ds-category-title p {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  color: #aab5b1;
  font-size: 13px;
  font-weight: 700;
}

.ds-category-title p::before {
  content: "";
  width: 27px;
  height: 2px;
  background: #50dfc1;
  box-shadow: 0 0 15px rgba(80, 223, 193, .45);
}

.ds-category-title h1 {
  max-width: 820px;
  margin: 0 !important;
  color: #f4f7f5 !important;
  font: 720 clamp(76px, 8.2vw, 132px) / .78 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.05em !important;
  text-transform: uppercase;
  text-wrap: balance;
}

.ds-category-summary {
  grid-column: 2;
  grid-row: 3;
  align-self: end;
  padding-left: 24px;
  border-left: 1px solid rgba(216, 231, 224, .2);
}

.ds-category-summary > p {
  max-width: 275px;
  margin: 0 0 24px;
  color: #abb6b2;
  font-size: 13px;
  line-height: 1.65;
}

.ds-category-total {
  display: flex;
  align-items: flex-end;
  gap: 13px;
}

.ds-category-total strong {
  color: #50dfc1;
  font: 720 62px / .74 "Barlow Condensed", sans-serif;
  letter-spacing: -.035em;
}

.ds-category-total span {
  max-width: 80px;
  padding-bottom: 1px;
  color: #d2dbd7;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
}

.ds-category-switcher {
  position: relative;
  z-index: 3;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  background: #50dfc1;
  box-shadow: 0 12px 32px rgba(4, 20, 15, .14);
}

.ds-category-switcher::-webkit-scrollbar {
  display: none;
}

.ds-category-switcher .drfx-live-wrap {
  min-width: max-content;
  display: flex;
  align-items: stretch;
}

.ds-category-switcher a {
  min-width: 210px;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: 0 20px;
  border-right: 1px solid rgba(5, 17, 13, .16);
  color: #09221b !important;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none !important;
  transition: color .16s ease, background .16s ease;
}

.ds-category-switcher a:first-child {
  border-left: 1px solid rgba(5, 17, 13, .16);
}

.ds-category-switcher a:hover {
  background: rgba(255, 255, 255, .18);
}

.ds-category-switcher a.is-active {
  color: #f3f7f5 !important;
  background: #07110e;
}

.ds-category-switcher .drfx-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  opacity: .72;
}

.ds-category-catalog {
  position: relative;
  padding: 86px 0 108px;
  color: #111714;
  background:
    linear-gradient(rgba(12, 44, 34, .038) 1px, transparent 1px),
    linear-gradient(90deg, rgba(12, 44, 34, .038) 1px, transparent 1px),
    #e9eeeb;
  background-size: 48px 48px;
}

.ds-category-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 42px;
  margin-bottom: 36px;
  padding-bottom: 28px;
  border-bottom: 1px solid #c5cfca;
}

.ds-category-heading h2 {
  margin: 0 !important;
  color: #101613 !important;
  font: 720 clamp(44px, 4.2vw, 67px) / .94 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.025em !important;
}

.ds-category-heading p {
  max-width: 580px;
  margin: 13px 0 0;
  color: #59665f;
  font-size: 13px;
  line-height: 1.65;
}

.ds-category-heading > span {
  min-width: 92px;
  padding: 10px 13px;
  border: 1px solid #bfcac4;
  border-radius: 4px;
  color: #314039;
  background: rgba(247, 249, 246, .72);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.ds-category-description {
  max-width: 780px;
  margin: -4px 0 38px !important;
  padding: 18px 20px !important;
  border-left: 3px solid #18a98c;
  color: #46524c !important;
  background: rgba(247, 249, 246, .72) !important;
  font-size: 13px;
  line-height: 1.7;
}

.ds-category-description > :first-child {
  margin-top: 0 !important;
}

.ds-category-description > :last-child {
  margin-bottom: 0 !important;
}

.ds-category-grid.drfx-market-grid {
  align-items: stretch;
}

.ds-category-grid.drfx-market-grid.is-single {
  grid-template-columns: minmax(0, 430px);
}

.ds-category-grid.drfx-market-grid .drfx-store-card {
  min-width: 0;
}

.ds-category-empty {
  min-height: 330px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 52px;
  border: 1px solid #bdc9c3;
  background: rgba(247, 249, 246, .76);
}

.ds-category-empty > div {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  margin-bottom: 25px;
  border: 1px solid #aebcb5;
  color: #087d67;
  background: #edf2ef;
}

.ds-category-empty > div .drfx-icon {
  width: 21px;
  height: 21px;
}

.ds-category-empty h2 {
  margin: 0 !important;
  color: #101613 !important;
  font: 720 44px / .94 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.02em !important;
}

.ds-category-empty p {
  max-width: 520px;
  margin: 14px 0 27px;
  color: #59665f;
  font-size: 13px;
  line-height: 1.7;
}

.ds-category-empty > a {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 24px;
  padding: 0 17px;
  border-radius: 4px;
  color: #f3f7f5 !important;
  background: #0c1a16;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none !important;
}

.ds-category-empty > a .drfx-icon {
  width: 14px;
  height: 14px;
  color: #50dfc1;
}

.ds-category-next {
  color: #eef5f1;
  background: #07100e;
}

.ds-category-next > .drfx-live-wrap {
  min-height: 290px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(440px, 560px);
  align-items: center;
  gap: 86px;
  padding-top: 54px;
  padding-bottom: 54px;
}

.ds-category-next-copy h2 {
  max-width: 520px;
  margin: 0 !important;
  color: #f2f6f4 !important;
  font: 720 clamp(42px, 4vw, 62px) / .92 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.028em !important;
}

.ds-category-next-copy p {
  max-width: 480px;
  margin: 17px 0 0;
  color: #9faaa6;
  font-size: 13px;
  line-height: 1.7;
}

.ds-category-next-links {
  border-top: 1px solid rgba(220, 232, 227, .16);
}

.ds-category-next-links a {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 4px 0 0;
  border-bottom: 1px solid rgba(220, 232, 227, .16);
  color: #eef5f1 !important;
  text-decoration: none !important;
  transition: padding .18s ease, color .18s ease;
}

.ds-category-next-links a:hover {
  padding-left: 11px;
  color: #50dfc1 !important;
}

.ds-category-next-links span {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.ds-category-next-links strong {
  color: inherit;
  font-size: 14px;
  font-weight: 800;
}

.ds-category-next-links small {
  color: #8e9b96;
  font-size: 11px;
  font-weight: 600;
}

.ds-category-next-links .drfx-icon {
  width: 16px;
  height: 16px;
  color: #50dfc1;
}

.ds-category a:focus-visible {
  outline: 2px solid #50dfc1;
  outline-offset: 3px;
}

@media (max-width: 980px) {
  .ds-category-hero-inner {
    grid-template-columns: minmax(0, 1fr) 240px;
    column-gap: 38px;
  }

  .ds-category-title h1 {
    font-size: clamp(70px, 10vw, 104px) !important;
  }

  .ds-category-grid.drfx-market-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ds-category-next > .drfx-live-wrap {
    grid-template-columns: 1fr 1fr;
    gap: 45px;
  }
}

@media (max-width: 700px) {
  .ds-category-hero,
  .ds-category-hero-inner {
    min-height: 510px;
  }

  .ds-category-art {
    background-position: 72% 50%;
    background-size: auto 116%;
    opacity: .88;
  }

  .ds-category-shade {
    background:
      linear-gradient(90deg, rgba(3, 8, 7, .96), rgba(3, 8, 7, .61)),
      linear-gradient(180deg, rgba(3, 7, 6, .12), transparent 35%, rgba(3, 8, 7, .94));
  }

  .ds-category-hero-inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-end;
    padding-top: 30px;
    padding-bottom: 34px;
  }

  .ds-category-back {
    margin-bottom: auto;
  }

  .ds-category-title p {
    margin-bottom: 15px;
  }

  .ds-category-title h1 {
    font-size: clamp(62px, 22vw, 92px) !important;
    line-height: .8 !important;
  }

  .ds-category-summary {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 22px;
    margin-top: 26px;
    padding: 20px 0 0;
    border-top: 1px solid rgba(216, 231, 224, .2);
    border-left: 0;
  }

  .ds-category-summary > p {
    max-width: 230px;
    margin: 0;
    font-size: 11px;
  }

  .ds-category-total {
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
    text-align: right;
  }

  .ds-category-total strong {
    font-size: 48px;
  }

  .ds-category-total span {
    max-width: none;
    font-size: 9px;
  }

  .ds-category-switcher .drfx-live-wrap {
    padding-right: 16px;
    padding-left: 16px;
  }

  .ds-category-switcher a {
    min-width: 165px;
    min-height: 54px;
    padding: 0 15px;
  }

  .ds-category-catalog {
    padding: 58px 0 74px;
    background-size: 38px 38px;
  }

  .ds-category-heading {
    grid-template-columns: 1fr auto;
    gap: 18px;
    margin-bottom: 25px;
    padding-bottom: 21px;
  }

  .ds-category-heading h2 {
    font-size: 41px !important;
  }

  .ds-category-heading p {
    display: none;
  }

  .ds-category-heading > span {
    min-width: auto;
    padding: 8px 10px;
  }

  .ds-category-grid.drfx-market-grid,
  .ds-category-grid.drfx-market-grid.is-single {
    grid-template-columns: minmax(0, 1fr);
  }

  .ds-category-empty {
    min-height: 300px;
    padding: 32px 24px;
  }

  .ds-category-empty h2 {
    font-size: 38px !important;
  }

  .ds-category-next > .drfx-live-wrap {
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 36px;
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .ds-category-next-copy h2 {
    font-size: 44px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ds-category-switcher a,
  .ds-category-back,
  .ds-category-next-links a {
    transition: none !important;
  }
}

/* Opaque empty state prevents stale composited product art during Tebex soft navigation. */
.ds-category-empty { background: #f7f9f6; }


/* =========================================================
   DRFX RELEASE PAGE — product dossier
   ========================================================= */
.ds-release-page .site-header {
  background: rgba(5, 9, 8, .91) !important;
  border-bottom-color: rgba(102, 236, 208, .1) !important;
  backdrop-filter: blur(16px) saturate(115%);
}

.ds-release {
  width: 100%;
  overflow: hidden;
  color: #111714;
  background: #e9eeeb;
}

.ds-release *,
.ds-release *::before,
.ds-release *::after {
  box-sizing: border-box;
}

.ds-release-hero {
  position: relative;
  min-height: 455px;
  isolation: isolate;
  overflow: hidden;
  color: #eef5f1;
  background: #06100d;
}

.ds-release-hero-image,
.ds-release-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.ds-release-hero-image {
  z-index: -3;
  object-fit: cover;
  object-position: center 43%;
  filter: saturate(.68) contrast(1.08);
  transform: scale(1.025);
}

.ds-release-hero-image.is-default {
  background-image: var(--drfx-hero-image);
  background-repeat: no-repeat;
  background-position: 83% 50%;
  background-size: auto 150%;
}

.ds-release-hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3, 8, 7, .99) 0%, rgba(3, 8, 7, .91) 36%, rgba(3, 8, 7, .48) 67%, rgba(3, 8, 7, .2) 100%),
    linear-gradient(180deg, rgba(3, 7, 6, .22), transparent 42%, rgba(3, 8, 7, .82));
}

.ds-release-hero::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(80, 223, 193, .64), transparent);
}

.ds-release-hero-inner {
  min-height: 455px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  grid-template-rows: auto 1fr auto;
  column-gap: 72px;
  padding-top: 38px;
  padding-bottom: 46px;
}

.ds-release-back {
  grid-column: 1 / -1;
  width: max-content;
  display: inline-flex;
  align-items: center;
  align-self: start;
  gap: 9px;
  color: #a9b4b0 !important;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none !important;
  transition: color .18s ease;
}

.ds-release-back:hover {
  color: #f4f7f5 !important;
}

.ds-release-back .drfx-icon {
  width: 15px;
  height: 15px;
}

.ds-release-title {
  grid-column: 1;
  grid-row: 3;
  align-self: end;
}

.ds-release-title p {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  color: #aab5b1;
  font-size: 13px;
  font-weight: 700;
}

.ds-release-title p span {
  width: 27px;
  height: 2px;
  flex: 0 0 27px;
  background: #50dfc1;
  box-shadow: 0 0 15px rgba(80, 223, 193, .45);
}

.ds-release-title h1 {
  max-width: 980px;
  margin: 0 !important;
  color: #f4f7f5 !important;
  font: 720 clamp(64px, 7vw, 112px) / .83 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.045em !important;
  text-transform: uppercase;
  text-wrap: balance;
}

.ds-release-hero-note {
  grid-column: 2;
  grid-row: 3;
  align-self: end;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 0 2px 24px;
  border-left: 1px solid rgba(218, 231, 225, .2);
}

.ds-release-hero-note > .drfx-icon {
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  color: #50dfc1;
}

.ds-release-hero-note span {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.ds-release-hero-note strong {
  color: #eef5f1;
  font-size: 13px;
  font-weight: 800;
}

.ds-release-hero-note small {
  color: #94a29c;
  font-size: 10px;
  font-weight: 600;
}

.ds-release-primary {
  position: relative;
  padding: 82px 0 98px;
  background:
    linear-gradient(rgba(12, 44, 34, .036) 1px, transparent 1px),
    linear-gradient(90deg, rgba(12, 44, 34, .036) 1px, transparent 1px),
    #e9eeeb;
  background-size: 48px 48px;
}

.ds-release-primary-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.24fr) minmax(390px, .76fr);
  align-items: start;
  gap: 22px;
}

.ds-release-gallery {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #c5cfca;
  border-radius: 5px;
  background: #f7f9f6;
  box-shadow: 0 18px 42px rgba(16, 33, 27, .09);
}

.ds-release-gallery-head {
  min-height: 57px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 18px;
  border-bottom: 1px solid #cbd4cf;
  color: #15201b;
  background: #f7f9f6;
  font-size: 11px;
  font-weight: 800;
}

.ds-release-gallery-head strong {
  color: #65716b;
  font-size: 10px;
  font-weight: 750;
}

.ds-release-gallery-stage {
  position: relative;
  overflow: hidden;
  background: #08100e;
}

.ds-release-gallery-stage > .image {
  width: 100%;
  min-height: 560px;
  display: block;
  object-fit: cover;
  object-position: center;
}

.ds-release-gallery-stage > .image-default {
  background-image: var(--drfx-hero-image);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.ds-release-gallery-stage .media-slider {
  width: 100%;
  display: block;
  margin: 0;
  padding: 0;
}

.ds-release-gallery-stage swiper-container,
.ds-release-gallery-stage .slider {
  width: 100%;
  min-height: 560px !important;
  display: block;
  background: #08100e;
}

.ds-release-gallery-stage swiper-slide,
.ds-release-gallery-stage .slide {
  min-height: 560px;
  display: grid;
  place-items: center;
}

.ds-release-gallery-stage .slide-image,
.ds-release-gallery-stage .slide-frame {
  width: 100%;
  height: 560px;
  display: block;
  border: 0;
  object-fit: cover;
}

.ds-release-gallery-stage .thumbs {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 12px;
  overflow-x: auto;
  list-style: none;
  background: #0c1512;
}

.ds-release-gallery-stage .thumb {
  width: 76px;
  height: 52px;
  flex: 0 0 76px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 3px;
  cursor: pointer;
}

.ds-release-gallery-stage .thumb img,
.ds-release-gallery-stage .thumb-youtube {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.ds-release-gallery-stage .open-lightbox {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 4;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 3px;
  color: #eef5f1;
  background: rgba(5, 10, 8, .8);
  font-size: 10px;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.ds-release-buy {
  position: sticky;
  top: 96px;
  min-width: 0;
  padding: 35px;
  border: 1px solid #c5cfca;
  border-radius: 5px;
  color: #111714;
  background: #f7f9f6;
  box-shadow: 0 18px 42px rgba(16, 33, 27, .09);
}

.ds-release-availability {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #276051;
  font-size: 11px;
  font-weight: 800;
}

.ds-release-availability i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #18a98c;
  box-shadow: 0 0 0 5px rgba(24, 169, 140, .1);
}

.ds-release-buy h2 {
  margin: 21px 0 13px !important;
  color: #101613 !important;
  font: 720 clamp(43px, 4vw, 59px) / .92 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.028em !important;
}

.ds-release-buy-copy {
  max-width: 410px;
  margin: 0 0 27px;
  color: #5b6861;
  font-size: 13px;
  line-height: 1.65;
}

.ds-release-buy .product-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 0 !important;
  padding: 24px 0 !important;
  border-top: 1px solid #d1d9d5;
  border-bottom: 1px solid #d1d9d5;
  background: transparent !important;
}

.ds-release-buy .product-actions .price {
  grid-column: 1 / -1;
  margin: 0 0 8px !important;
  color: #101613 !important;
  font: 720 32px / 1 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.02em;
}

.ds-release-buy .product-actions .price strong,
.ds-release-buy .product-actions .price .currency {
  color: #101613 !important;
  font: inherit !important;
}

.ds-release-buy .product-actions .discount {
  margin-right: 8px;
  color: #7c8982 !important;
  font-size: 18px;
}

.ds-release-buy .product-actions .wide {
  grid-column: 1 / -1;
}

.ds-release-buy .product-actions .half {
  width: 100% !important;
}

.ds-release-buy .product-actions .btn-primary,
.ds-release-buy .product-actions .btn-secondary,
.ds-release-buy .product-actions .open-basket-cta,
.ds-release-buy .product-actions .gift {
  min-height: 51px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 17px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .015em;
  text-transform: uppercase;
  text-decoration: none !important;
}

.ds-release-buy .product-actions .btn-primary,
.ds-release-buy .product-actions .open-basket-cta {
  border: 1px solid #0c1a16 !important;
  color: #f2f7f4 !important;
  background: #0c1a16 !important;
}

.ds-release-buy .product-actions .btn-primary:hover,
.ds-release-buy .product-actions .open-basket-cta:hover {
  border-color: #17a88b !important;
  color: #07110e !important;
  background: #50dfc1 !important;
}

.ds-release-buy .product-actions .btn-secondary,
.ds-release-buy .product-actions .gift {
  border: 1px solid #b8c4be !important;
  color: #22312a !important;
  background: transparent !important;
}

.ds-release-buy .product-actions .btn-secondary:hover,
.ds-release-buy .product-actions .gift:hover {
  border-color: #718179 !important;
  background: #edf1ee !important;
}

.ds-release-buy .quantity-field {
  grid-column: 1 / -1;
  min-height: 51px;
  display: grid;
  grid-template-columns: 44px 1fr 62px 44px;
  border: 1px solid #b8c4be;
  border-radius: 4px;
  overflow: hidden;
}

.ds-release-buy .quantity-field > * {
  min-height: 49px;
  border: 0 !important;
  color: #14211b !important;
  background: #eef2ef !important;
}

.ds-release-trust {
  display: grid;
  gap: 0;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.ds-release-trust li {
  min-height: 67px;
  display: flex;
  align-items: center;
  gap: 13px;
  border-bottom: 1px solid #d8dfdc;
}

.ds-release-trust li:last-child {
  border-bottom: 0;
}

.ds-release-trust .drfx-icon {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  color: #118d74;
}

.ds-release-trust span {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ds-release-trust strong {
  color: #17231d;
  font-size: 12px;
  font-weight: 800;
}

.ds-release-trust small {
  color: #748079;
  font-size: 10px;
  font-weight: 600;
}

.ds-release-details {
  padding: 105px 0 116px;
  color: #111714;
  background: #f7f9f6;
}

.ds-release-details-grid {
  display: grid;
  grid-template-columns: minmax(260px, .6fr) minmax(0, 1.4fr);
  align-items: start;
  gap: clamp(60px, 8vw, 120px);
}

.ds-release-details-grid > header {
  position: sticky;
  top: 112px;
}

.ds-release-details-grid > header h2 {
  max-width: 350px;
  margin: 0 !important;
  color: #101613 !important;
  font: 720 clamp(47px, 4.6vw, 70px) / .9 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.03em !important;
}

.ds-release-details-grid > header p {
  max-width: 330px;
  margin: 18px 0 27px;
  color: #607069;
  font-size: 13px;
  line-height: 1.7;
}

.ds-release-details-grid > header a {
  width: max-content;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  padding-bottom: 7px;
  border-bottom: 1px solid #9baba3;
  color: #183b31 !important;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none !important;
}

.ds-release-details-grid > header a:hover {
  color: #087d67 !important;
}

.ds-release-details-grid > header .drfx-icon {
  width: 14px;
  height: 14px;
  color: #0e9f82;
}

.ds-release-description {
  min-width: 0;
  padding: clamp(30px, 4vw, 54px) !important;
  border: 1px solid #cbd4d0;
  border-radius: 5px;
  color: #334039 !important;
  background: #eef2ef !important;
  font-size: 14px;
  line-height: 1.8;
}

.ds-release-description > :first-child {
  margin-top: 0 !important;
}

.ds-release-description > :last-child {
  margin-bottom: 0 !important;
}

.ds-release-description h1,
.ds-release-description h2,
.ds-release-description h3,
.ds-release-description h4 {
  margin-top: 1.5em !important;
  color: #101613 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  line-height: 1 !important;
  letter-spacing: -.02em !important;
}

.ds-release-description h2 { font-size: 40px !important; }
.ds-release-description h3 { font-size: 30px !important; }

.ds-release-description a {
  color: #087d67 !important;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ds-release-description img,
.ds-release-description video,
.ds-release-description iframe {
  max-width: 100%;
  border-radius: 4px;
}

.ds-release-description ul,
.ds-release-description ol {
  padding-left: 22px;
}

.ds-release-description li + li {
  margin-top: 7px;
}

.ds-release-help {
  color: #eef5f1;
  background: #07100e;
}

.ds-release-help > .drfx-live-wrap {
  min-height: 235px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 60px;
  padding-top: 50px;
  padding-bottom: 50px;
}

.ds-release-help h2 {
  margin: 0 !important;
  color: #f2f6f4 !important;
  font: 720 clamp(42px, 4vw, 60px) / .92 "Barlow Condensed", sans-serif !important;
  letter-spacing: -.028em !important;
}

.ds-release-help p {
  max-width: 560px;
  margin: 14px 0 0;
  color: #9faaa6;
  font-size: 13px;
  line-height: 1.65;
}

.ds-release-help > .drfx-live-wrap > a {
  min-width: 172px;
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  padding: 0 17px;
  border: 1px solid rgba(234, 244, 239, .24);
  border-radius: 4px;
  color: #eef5f1 !important;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none !important;
}

.ds-release-help > .drfx-live-wrap > a:hover {
  border-color: #50dfc1;
  color: #50dfc1 !important;
}

.ds-release-help .drfx-icon {
  width: 15px;
  height: 15px;
  color: #50dfc1;
}

.ds-release a:focus-visible,
.ds-release button:focus-visible {
  outline: 2px solid #50dfc1;
  outline-offset: 3px;
}

/* Fallback: if another Tebex component opens the product as a popup, keep it full and readable. */
.store-product-popup-content.store-product-full:has(.ds-release) {
  width: min(1500px, calc(100vw - 48px)) !important;
  max-width: 1500px !important;
  min-width: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  background: #e9eeeb !important;
}

.store-product-popup-content.store-product-full:has(.ds-release) > .popup-close {
  z-index: 30 !important;
  top: 18px !important;
  right: 18px !important;
}

.store-product-popup-content.store-product-full .ds-release {
  width: 100% !important;
  max-width: none !important;
}

@media (max-width: 1050px) {
  .ds-release-hero-inner {
    grid-template-columns: minmax(0, 1fr) 250px;
    column-gap: 38px;
  }

  .ds-release-primary-grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
  }

  .ds-release-gallery-stage > .image,
  .ds-release-gallery-stage swiper-container,
  .ds-release-gallery-stage .slider,
  .ds-release-gallery-stage swiper-slide,
  .ds-release-gallery-stage .slide,
  .ds-release-gallery-stage .slide-image,
  .ds-release-gallery-stage .slide-frame {
    min-height: 480px !important;
    height: 480px;
  }
}

@media (max-width: 820px) {
  .ds-release-primary-grid,
  .ds-release-details-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .ds-release-buy,
  .ds-release-details-grid > header {
    position: static;
  }

  .ds-release-primary-grid {
    gap: 18px;
  }

  .ds-release-details-grid {
    gap: 38px;
  }
}

@media (max-width: 700px) {
  .ds-release-hero,
  .ds-release-hero-inner {
    min-height: 470px;
  }

  .ds-release-hero-inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-end;
    padding-top: 29px;
    padding-bottom: 32px;
  }

  .ds-release-back {
    margin-bottom: auto;
  }

  .ds-release-title p {
    margin-bottom: 14px;
  }

  .ds-release-title h1 {
    max-width: 100%;
    font-size: clamp(55px, 18vw, 82px) !important;
    line-height: .82 !important;
  }

  .ds-release-hero-note {
    margin-top: 24px;
    padding: 18px 0 0;
    border-top: 1px solid rgba(218, 231, 225, .2);
    border-left: 0;
  }

  .ds-release-primary {
    padding: 54px 0 68px;
    background-size: 38px 38px;
  }

  .ds-release-gallery-stage > .image,
  .ds-release-gallery-stage swiper-container,
  .ds-release-gallery-stage .slider,
  .ds-release-gallery-stage swiper-slide,
  .ds-release-gallery-stage .slide,
  .ds-release-gallery-stage .slide-image,
  .ds-release-gallery-stage .slide-frame {
    min-height: 330px !important;
    height: 330px;
  }

  .ds-release-buy {
    padding: 28px 24px;
  }

  .ds-release-buy h2 {
    font-size: 44px !important;
  }

  .ds-release-details {
    padding: 72px 0 78px;
  }

  .ds-release-details-grid > header h2 {
    font-size: 49px !important;
  }

  .ds-release-description {
    padding: 26px 22px !important;
  }

  .ds-release-help > .drfx-live-wrap {
    min-height: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
    padding-top: 62px;
    padding-bottom: 62px;
  }

  .ds-release-help h2 {
    font-size: 45px !important;
  }

  .store-product-popup-content.store-product-full:has(.ds-release) {
    width: calc(100vw - 14px) !important;
    border-radius: 6px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ds-release-back,
  .ds-release-buy .product-actions a,
  .ds-release-help a {
    transition: none !important;
  }
}

/* Preserve Tebex basket visibility rules inside the redesigned purchase panel. */
.ds-release-buy .product-actions [hidden] { display: none !important; }
.ds-release-buy .product-actions .wide { width: 100% !important; }

/* Gift action must behave like a full purchase action, not the base square glyph button. */
.ds-release-buy .product-actions .gift {
  grid-column: 1 / -1;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  white-space: nowrap;
}

/* Keep the gallery fullscreen control compact and clear of the slider chrome. */
.ds-release-gallery-stage .open-lightbox {
  top: auto !important;
  right: 14px !important;
  bottom: 14px !important;
  left: auto !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  overflow: visible !important;
  white-space: nowrap;
}


/* Product gift action: explicit SVG icon, never the Tebex glyph mask. */
.ds-release-buy .product-actions .gift::before {
  content: none !important;
  display: none !important;
}

.ds-release-buy .product-actions .gift {
  gap: 10px;
}

.ds-release-buy .product-actions .gift .ds-release-gift-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: #168f77;
}


/* =========================================================
   DRFX CART + ACCESS / 2026-09-11
   Compact checkout flow using Tebex's native basket actions.
   ========================================================= */

.ds-cart-body .site { gap: 0 !important; }

.ds-cart-site {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(32px, 5vw, 76px) 0 100px !important;
  background:
    radial-gradient(circle at 82% 4%, rgba(80, 223, 193, .10), transparent 27%),
    #0e1513 !important;
}

.ds-cart-site .ds-cart {
  display: block !important;
  width: min(1120px, calc(100% - 40px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(215, 231, 223, .16) !important;
  border-radius: 10px !important;
  background: #edf2ee !important;
  box-shadow: 0 36px 110px rgba(0, 0, 0, .36) !important;
}

.ds-cart-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 28px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 26px 30px !important;
  border: 0 !important;
  border-bottom: 1px solid #ccd7d0 !important;
  border-radius: 0 !important;
  background: #f4f7f3 !important;
  color: #111815 !important;
}

.ds-cart-brand {
  display: flex;
  align-items: center;
  gap: 15px;
  min-width: 0;
}

.ds-cart-mark {
  display: grid;
  place-items: center;
  flex: 0 0 45px;
  width: 45px;
  height: 45px;
  border-radius: 5px;
  background: #0d1814;
  color: #50dfc1;
}

.ds-cart-mark .drfx-icon { width: 20px; height: 20px; }

.ds-cart-kicker,
.ds-cart-section-head > div > span,
.ds-cart-summary-top > span {
  display: block;
  color: #168f77;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
  line-height: 1;
}

.ds-cart-head h1 {
  max-width: 430px;
  margin: 6px 0 0 !important;
  overflow: hidden;
  color: #111815 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(29px, 3vw, 38px) !important;
  font-weight: 780 !important;
  letter-spacing: -.035em !important;
  line-height: .95 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ds-cart-steps {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #89928d;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ds-cart-steps span { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.ds-cart-steps span b { color: #a8b0ac; font-variant-numeric: tabular-nums; }
.ds-cart-steps .is-current { color: #111815; }
.ds-cart-steps .is-current b { color: #168f77; }
.ds-cart-steps i { width: 38px; height: 1px; background: #c9d2cd; }

.ds-cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  align-items: stretch;
  min-height: 420px;
}

.ds-cart-items {
  min-width: 0;
  padding: 30px;
  background:
    linear-gradient(rgba(18, 28, 24, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 28, 24, .035) 1px, transparent 1px),
    #e7ede8;
  background-size: 34px 34px;
}

.ds-cart-section-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 0 0 20px !important;
  padding: 0 0 17px !important;
  border: 0 !important;
  border-bottom: 1px solid #c8d2cc !important;
  background: transparent !important;
  text-align: left !important;
}

.ds-cart-section-head h2 {
  margin: 7px 0 0 !important;
  color: #111815 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: 35px !important;
  font-weight: 770 !important;
  letter-spacing: -.035em !important;
  line-height: .95 !important;
}

.ds-cart-section-head .count {
  color: #68736e;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .1em;
  white-space: nowrap;
}

.ds-cart-items .basket-content,
.ds-cart-items .basket-items {
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

.ds-cart-items .basket-items {
  display: flex !important;
  flex-direction: column;
  gap: 10px !important;
}

.ds-cart-item {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) auto auto 36px;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  min-height: 92px;
  margin: 0 !important;
  padding: 16px !important;
  border: 1px solid #cbd6cf !important;
  border-radius: 5px !important;
  background: rgba(248, 250, 247, .96) !important;
  box-shadow: 0 10px 26px rgba(20, 37, 30, .045) !important;
}

.ds-cart-index {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 4px;
  background: #d9eee6;
  color: #0d7f69;
  font-size: 9px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.ds-cart-item .info { min-width: 0; margin: 0 !important; }
.ds-cart-item-label { display: block; margin-bottom: 5px; color: #7f8984; font-size: 8px; font-weight: 850; letter-spacing: .12em; }

.ds-cart-item .title {
  margin: 0 !important;
  color: #111815 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(19px, 2vw, 23px) !important;
  font-weight: 750 !important;
  letter-spacing: -.02em !important;
  line-height: 1 !important;
}

.ds-cart-item .title a { color: inherit !important; text-decoration: none !important; }
.ds-cart-item .title a:hover { color: #168f77 !important; }

.ds-cart-item .options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 7px 0 0 !important;
  padding: 0 !important;
  color: #7c8681;
  font-size: 9px;
  list-style: none;
}

.ds-cart-item .options li::before { background: #50bfa6 !important; }

.ds-cart-item .trial {
  display: inline-block !important;
  margin: 7px 0 0 !important;
  padding: 5px 7px !important;
  border-radius: 3px;
  background: #d9eee6 !important;
  color: #0d7f69 !important;
  font-size: 8px !important;
}

.ds-cart-item .quantity-field {
  display: flex !important;
  align-items: center;
  overflow: hidden;
  border: 1px solid #c8d2cc !important;
  border-radius: 4px;
  background: #edf2ee;
}

.ds-cart-item .quantity-field button,
.ds-cart-item .quantity-field input {
  display: grid !important;
  place-items: center;
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111815 !important;
  text-align: center;
}

.ds-cart-item .quantity-field button:not(:disabled):hover { background: #d9eee6 !important; color: #0d7f69 !important; }
.ds-cart-item .quantity-field button:disabled { opacity: .32; }
.ds-cart-item .quantity-field .drfx-icon { width: 14px; height: 14px; }

.ds-cart-item > .price {
  min-width: 66px;
  color: #111815 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.ds-cart-item .remove {
  display: grid !important;
  place-items: center;
  width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border: 1px solid #cbd5cf !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #77817c !important;
}

.ds-cart-item .remove::before { content: none !important; display: none !important; }
.ds-cart-item .remove .drfx-icon { width: 15px; height: 15px; }
.ds-cart-item .remove:hover { border-color: #c85e58 !important; background: #fff1ef !important; color: #b94742 !important; }

.ds-cart-summary {
  position: relative !important;
  top: auto !important;
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0 !important;
  padding: 32px 28px 27px !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 100% 0, rgba(80, 223, 193, .14), transparent 31%),
    #101815 !important;
  color: #f3f6f3 !important;
}

.ds-cart-summary::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: #50dfc1;
}

.ds-cart-summary-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ds-cart-summary-top > span { color: #50dfc1; }
.ds-cart-summary-top small { color: #7f918a; font-size: 9px; font-weight: 750; }

.ds-cart-summary h2 {
  margin: 24px 0 30px !important;
  color: #f3f6f3 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: 46px !important;
  font-weight: 770 !important;
  letter-spacing: -.04em !important;
  line-height: .84 !important;
}

.ds-cart-total {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-top: auto;
  padding: 17px 0;
  border-top: 1px solid rgba(226, 240, 233, .13);
  border-bottom: 1px solid rgba(226, 240, 233, .13);
}

.ds-cart-total span { color: #91a099; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.ds-cart-total strong { color: #fff !important; font-size: 23px !important; font-weight: 850 !important; font-variant-numeric: tabular-nums; }

.ds-cart-summary .checkout {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100% !important;
  min-height: 52px !important;
  margin: 18px 0 20px !important;
  padding: 0 17px !important;
  border: 1px solid #50dfc1 !important;
  border-radius: 4px !important;
  background: #50dfc1 !important;
  color: #0b1713 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ds-cart-summary .checkout:hover { transform: translateY(-1px); background: #78ead2 !important; }
.ds-cart-summary .checkout:active { transform: translateY(0); }
.ds-cart-summary .checkout:disabled { opacity: .35; transform: none; }
.ds-cart-summary .checkout .drfx-icon { width: 15px; height: 15px; }

.ds-cart-assurances {
  display: grid;
  gap: 13px;
  margin: 0 !important;
  padding: 0 0 19px !important;
  border: 0 !important;
  list-style: none;
}

.ds-cart-assurances li {
  display: grid !important;
  grid-template-columns: 25px 1fr;
  align-items: start;
  gap: 10px !important;
  margin: 0 !important;
  color: #7e8f87 !important;
  font-size: 9px !important;
  line-height: 1.45;
}

.ds-cart-assurances li > .drfx-icon {
  width: 18px !important;
  height: 18px !important;
  margin: 1px 0 0 !important;
  color: #50dfc1 !important;
  stroke-width: 1.7;
}

.ds-cart-assurances li span { display: grid; gap: 1px; }
.ds-cart-assurances li b { color: #dce5e0; font-size: 10px; font-weight: 750; }

.ds-cart-continue {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: max-content;
  color: #8ea097 !important;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .05em;
  text-decoration: none !important;
  text-transform: uppercase;
}

.ds-cart-continue:hover { color: #50dfc1 !important; }
.ds-cart-continue .drfx-icon { width: 13px; height: 13px; }

.ds-cart-empty {
  display: grid;
  justify-items: start;
  min-height: 210px;
  padding: 28px;
  border: 1px dashed #bcc9c1;
  border-radius: 5px;
  background: rgba(248, 250, 247, .72);
}

.ds-cart-empty > .drfx-icon { width: 28px; height: 28px; color: #168f77; }
.ds-cart-empty > span { align-self: end; color: #111815; font-family: "Barlow Condensed", sans-serif; font-size: 27px; font-weight: 760; }
.ds-cart-empty p { margin: 5px 0 18px; color: #6d7872; font-size: 11px; }
.ds-cart-empty a { display: inline-flex; align-items: center; gap: 8px; color: #0d7f69 !important; font-size: 10px; font-weight: 850; text-decoration: none !important; text-transform: uppercase; }
.ds-cart-empty a .drfx-icon { width: 14px; height: 14px; }

.basket-popup { background: rgba(4, 8, 7, .84) !important; backdrop-filter: blur(11px); }
.basket-popup .popup-scroll-cont { align-items: center !important; justify-content: center !important; min-height: 100% !important; padding: 24px !important; }

.basket-popup .basket-popup-content {
  display: block !important;
  width: min(1080px, calc(100vw - 48px)) !important;
  max-width: 1080px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 48px) !important;
  padding: 0 !important;
  overflow: auto !important;
  border: 1px solid rgba(226, 240, 233, .16) !important;
  border-radius: 10px !important;
  background: #edf2ee !important;
  box-shadow: 0 42px 130px rgba(0, 0, 0, .58) !important;
}

.basket-popup .ds-cart-head { padding-right: 72px !important; }
.basket-popup .popup-close { top: 17px !important; right: 17px !important; background: #101815 !important; }

/* Access step shown when a product needs account identification. */
.ds-auth-site {
  display: grid;
  place-items: center;
  width: 100% !important;
  max-width: none !important;
  min-height: 65vh;
  margin: 0 !important;
  padding: 48px 20px 88px !important;
  background: #0e1513;
}

.ds-auth-card {
  display: grid !important;
  grid-template-columns: 190px minmax(0, 1fr);
  width: min(680px, 100%) !important;
  max-width: 680px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(16, 31, 25, .18) !important;
  border-radius: 9px !important;
  background: #f2f5f1 !important;
  color: #111815 !important;
  box-shadow: 0 38px 110px rgba(0, 0, 0, .42) !important;
  text-align: left !important;
}

.ds-auth-brand {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 390px;
  padding: 28px 24px;
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 95%, rgba(80, 223, 193, .18), transparent 34%),
    #101815;
  color: #f2f7f4;
}

.ds-auth-brand-line { position: absolute; top: 0; right: 0; left: 0; height: 3px; background: #50dfc1; }
.ds-auth-logo-wrap { display: flex; align-items: center; width: 112px; height: 64px; }
.ds-auth-logo { display: block; width: auto !important; max-width: 112px !important; height: auto !important; max-height: 64px !important; object-fit: contain !important; object-position: left center !important; filter: none !important; }
.ds-auth-logo-fallback { color: #50dfc1; }
.ds-auth-wordmark { position: relative; z-index: 1; font-family: "Barlow Condensed", sans-serif; font-size: 32px; font-weight: 780; letter-spacing: -.025em; line-height: .83; }

.ds-auth-route {
  position: absolute;
  right: -18px;
  bottom: 35px;
  width: 165px;
  height: auto;
  color: rgba(80, 223, 193, .4);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.3;
}
.ds-auth-route circle { fill: #50dfc1; stroke: none; }

.ds-auth-content { display: flex; flex-direction: column; min-width: 0; padding: 42px 40px 28px; }
.ds-auth-kicker { display: inline-flex; align-items: center; gap: 8px; color: #168f77; font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.ds-auth-kicker i { width: 16px; height: 2px; background: #50c5a9; }

.ds-auth-card h2 {
  max-width: 380px;
  margin: 24px 0 13px !important;
  color: #111815 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(42px, 5vw, 57px) !important;
  font-weight: 780 !important;
  letter-spacing: -.045em !important;
  line-height: .86 !important;
  text-wrap: balance;
}

.ds-auth-copy { max-width: 390px; margin: 0 !important; color: #67716c !important; font-size: 12px; line-height: 1.65; text-wrap: pretty; }
.ds-auth-card .field { margin: 25px 0 0 !important; }

.ds-auth-button {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100% !important;
  min-height: 52px !important;
  padding: 0 17px !important;
  border: 1px solid #101815 !important;
  border-radius: 4px !important;
  background: #101815 !important;
  color: #f4f7f4 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .055em;
  text-decoration: none !important;
  text-transform: uppercase;
}
.ds-auth-button:hover { transform: translateY(-1px); border-color: #168f77 !important; background: #50dfc1 !important; color: #0b1713 !important; }
.ds-auth-button .drfx-icon { width: 15px; height: 15px; }

.ds-auth-form > label { display: block; margin-bottom: 8px; color: #4c5751; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.ds-auth-form > div { display: grid; grid-template-columns: 1fr 52px; }
.ds-auth-form input { min-width: 0; height: 52px; padding: 0 14px; border: 1px solid #bfcac3 !important; border-right: 0 !important; border-radius: 4px 0 0 4px !important; background: #fff !important; color: #111815 !important; font-size: 13px; }
.ds-auth-form .ds-auth-button { width: 52px !important; padding: 0 !important; border-radius: 0 4px 4px 0 !important; }

.ds-auth-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 25px; border-top: 1px solid #d2dad5; color: #8b948f; font-size: 8px; font-weight: 800; letter-spacing: .09em; }
.ds-auth-foot span { display: inline-flex; align-items: center; gap: 6px; }
.ds-auth-foot .drfx-icon { width: 12px; height: 12px; color: #168f77; }

.login-popup { background: rgba(4, 8, 7, .84) !important; backdrop-filter: blur(11px); }
.login-popup .popup-scroll-cont { align-items: center !important; justify-content: center !important; padding: 24px !important; }
.login-popup .login-popup-content,
.login-popup .popup-content {
  width: min(680px, calc(100vw - 48px)) !important;
  max-width: 680px !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  box-shadow: none !important;
}
.login-popup .ds-auth-card { width: 100% !important; }
.login-popup .popup-close { z-index: 30; top: 16px !important; right: 16px !important; background: #101815 !important; }

@media (max-width: 820px) {
  .ds-cart-head { grid-template-columns: 1fr !important; gap: 18px !important; }
  .ds-cart-steps { display: none; }
  .ds-cart-layout { grid-template-columns: 1fr; }
  .ds-cart-summary { min-height: 390px; }
  .basket-popup .basket-popup-content { width: min(680px, calc(100vw - 32px)) !important; }
  .basket-popup .popup-scroll-cont { padding: 16px !important; }
}

@media (max-width: 640px) {
  .ds-cart-site { padding: 20px 0 54px !important; }
  .ds-cart-site .ds-cart { width: calc(100% - 20px) !important; border-radius: 7px !important; }
  .ds-cart-head { padding: 20px 58px 20px 18px !important; }
  .ds-cart-mark { flex-basis: 40px; width: 40px; height: 40px; }
  .ds-cart-head h1 { font-size: 30px !important; }
  .ds-cart-items { padding: 18px; background-size: 28px 28px; }
  .ds-cart-section-head h2 { font-size: 31px !important; }
  .ds-cart-item { grid-template-columns: 34px minmax(0, 1fr) 34px; gap: 11px !important; padding: 14px !important; }
  .ds-cart-index { width: 32px; height: 32px; }
  .ds-cart-item .remove { grid-column: 3; grid-row: 1; }
  .ds-cart-item .quantity-field { grid-column: 2; width: max-content; }
  .ds-cart-item > .price { grid-column: 2; min-width: 0; text-align: left; }
  .ds-cart-summary { min-height: 380px; padding: 28px 23px 24px !important; }
  .basket-popup .popup-scroll-cont { align-items: flex-end !important; padding: 0 !important; }
  .basket-popup .basket-popup-content { width: 100% !important; max-height: calc(100dvh - 14px) !important; border-radius: 8px 8px 0 0 !important; }

  .ds-auth-site { padding: 24px 12px 60px !important; }
  .ds-auth-card { grid-template-columns: 1fr; }
  .ds-auth-brand { display: grid; grid-template-columns: 1fr auto; align-items: center; min-height: 108px; padding: 21px 22px; }
  .ds-auth-logo-wrap { width: 95px; height: 48px; }
  .ds-auth-logo { max-width: 95px !important; max-height: 48px !important; }
  .ds-auth-wordmark { font-size: 25px; text-align: right; }
  .ds-auth-route { display: none; }
  .ds-auth-content { min-height: 360px; padding: 30px 23px 24px; }
  .ds-auth-card h2 { margin-top: 20px !important; font-size: 44px !important; }
  .login-popup .popup-scroll-cont { align-items: flex-end !important; padding: 0 !important; }
  .login-popup .login-popup-content,
  .login-popup .popup-content { width: 100% !important; max-width: none !important; border-radius: 8px 8px 0 0 !important; }
}

@media (prefers-reduced-motion: reduce) {
  .ds-auth-button,
  .ds-cart-summary .checkout { transition: none !important; transform: none !important; }
}


/* Tebex removes the data-popup root before injecting auth into an overlay. */
.login-popup .popup-content:has(.ds-auth-brand),
.basket-popup .basket-popup-content:has(.ds-auth-brand) {
  display: grid !important;
  grid-template-columns: 190px minmax(0, 1fr) !important;
  width: min(680px, calc(100vw - 48px)) !important;
  max-width: 680px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 48px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: auto !important;
  border: 1px solid rgba(16, 31, 25, .18) !important;
  border-radius: 9px !important;
  background: #f2f5f1 !important;
  color: #111815 !important;
  box-shadow: 0 38px 110px rgba(0, 0, 0, .52) !important;
  text-align: left !important;
}

.basket-popup:has(.ds-auth-brand) .popup-scroll-cont {
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
}

.login-popup .popup-content:has(.ds-auth-brand) .ds-auth-content h2,
.basket-popup .popup-content:has(.ds-auth-brand) .ds-auth-content h2 {
  max-width: 380px;
  margin: 24px 0 13px !important;
  color: #111815 !important;
  font-family: "Barlow Condensed", sans-serif !important;
  font-size: clamp(42px, 5vw, 57px) !important;
  font-weight: 780 !important;
  letter-spacing: -.045em !important;
  line-height: .86 !important;
  text-wrap: balance;
}

.login-popup .popup-content:has(.ds-auth-brand) .field,
.basket-popup .popup-content:has(.ds-auth-brand) .field { margin: 25px 0 0 !important; }

.login-popup .popup-content:has(.ds-auth-brand) .popup-close,
.basket-popup .popup-content:has(.ds-auth-brand) .popup-close {
  z-index: 30;
  top: 16px !important;
  right: 16px !important;
  background: #101815 !important;
}

@media (max-width: 640px) {
  .login-popup .popup-content:has(.ds-auth-brand),
  .basket-popup .basket-popup-content:has(.ds-auth-brand) {
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: none !important;
    max-height: calc(100dvh - 12px) !important;
    border-radius: 8px 8px 0 0 !important;
  }
  .basket-popup:has(.ds-auth-brand) .popup-scroll-cont {
    align-items: flex-end !important;
    padding: 0 !important;
  }
  .login-popup .popup-content:has(.ds-auth-brand) .ds-auth-content h2,
  .basket-popup .popup-content:has(.ds-auth-brand) .ds-auth-content h2 {
    margin-top: 20px !important;
    font-size: 44px !important;
  }
}


/* =========================================================
   DRFX HEADER / compact resource dock
   ========================================================= */

.site { gap: 0 !important; }

.ds-site-header {
  position: sticky !important;
  top: 0;
  z-index: 300;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(199, 224, 213, .12) !important;
  background: rgba(7, 13, 11, .96) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16) !important;
  backdrop-filter: blur(16px);
}

.ds-site-header::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 7%, rgba(80, 223, 193, .55) 29%, rgba(80, 223, 193, .08) 58%, transparent 92%);
}

.ds-header-shell {
  display: grid;
  grid-template-columns: minmax(230px, 1fr) auto minmax(320px, 1fr);
  align-items: center;
  gap: 28px;
  width: min(1360px, calc(100% - 48px));
  min-height: 76px;
  margin: 0 auto;
}

.ds-header-brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  width: max-content;
  color: #f2f6f3 !important;
  text-decoration: none !important;
}

.ds-header-logo {
  display: grid;
  place-items: center;
  flex: 0 0 31px;
  width: 31px;
  height: 31px;
  overflow: hidden;
  border: 1px solid rgba(213, 232, 223, .12);
  border-radius: 5px;
  background: #111a17;
  color: #50dfc1;
}

.ds-header-logo img {
  display: block;
  width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  max-height: 24px !important;
  object-fit: contain !important;
  object-position: center !important;
}

.ds-header-logo svg { width: 23px; height: auto; fill: currentColor; }

.ds-header-brand-copy {
  display: grid;
  gap: 2px;
  line-height: 1;
}

.ds-header-brand-copy strong {
  color: #f3f7f4;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 17px;
  font-weight: 760;
  letter-spacing: -.025em;
}

.ds-header-brand-copy strong b { color: #50dfc1; font-weight: inherit; }
.ds-header-brand-copy small { color: #6e7c76; font-size: 8px; font-weight: 650; letter-spacing: .035em; }

.ds-header-nav {
  display: flex;
  align-items: stretch;
  align-self: stretch;
  gap: 8px;
}

.ds-header-link,
.ds-header-scripts > summary {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 72px;
  height: 100%;
  padding: 0 12px;
  color: #8e9a95 !important;
  font-size: 11px;
  font-weight: 720;
  letter-spacing: .005em;
  line-height: 1;
  text-decoration: none !important;
  cursor: pointer;
  transition: color 160ms ease, background-color 160ms ease;
}

.ds-header-link::after,
.ds-header-scripts > summary::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: -1px;
  left: 12px;
  height: 2px;
  background: #50dfc1;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 180ms ease;
}

.ds-header-link:hover,
.ds-header-scripts > summary:hover,
.ds-header-scripts[open] > summary { color: #f3f7f4 !important; background: rgba(255, 255, 255, .025); }

.ds-header-link:hover::after,
.ds-header-scripts > summary:hover::after,
.ds-header-scripts[open] > summary::after,
.page-index .ds-header-home::after,
.page-category .ds-header-scripts > summary::after,
.page-package .ds-header-scripts > summary::after { transform: scaleX(1); }

.page-index .ds-header-home,
.page-category .ds-header-scripts > summary,
.page-package .ds-header-scripts > summary { color: #f3f7f4 !important; }

.ds-header-scripts { position: relative; }
.ds-header-scripts > summary { list-style: none; }
.ds-header-scripts > summary::-webkit-details-marker { display: none; }
.ds-header-scripts > summary .drfx-icon { width: 13px; height: 13px; color: #50dfc1; transition: transform 160ms ease; }
.ds-header-scripts[open] > summary .drfx-icon { transform: rotate(180deg); }

.ds-header-dropdown {
  position: absolute;
  top: calc(100% - 7px);
  left: 50%;
  width: 270px;
  padding: 9px;
  border: 1px solid rgba(211, 230, 221, .14);
  border-radius: 7px;
  background: #101715;
  box-shadow: 0 26px 72px rgba(0, 0, 0, .52);
  opacity: 0;
  transform: translate(-50%, 8px);
  pointer-events: none;
  transition: opacity 150ms ease, transform 150ms ease;
}

.ds-header-scripts[open] .ds-header-dropdown { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }

.ds-header-dropdown-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 10px 11px;
  color: #75827c;
  font-size: 9px;
  font-weight: 760;
}

.ds-header-dropdown-head small {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  background: #19231f;
  color: #50dfc1;
  font-size: 8px;
  font-variant-numeric: tabular-nums;
}

.ds-header-dropdown-list { display: grid; gap: 3px; }
.ds-header-dropdown-list > a,
.ds-header-dropdown-docs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 42px;
  padding: 0 11px;
  border-radius: 4px;
  color: #aab4af !important;
  font-size: 11px;
  font-weight: 670;
  text-decoration: none !important;
  transition: color 140ms ease, background-color 140ms ease;
}

.ds-header-dropdown-list > a:hover { background: #1b2521; color: #fff !important; }
.ds-header-dropdown-list > a .drfx-icon,
.ds-header-dropdown-docs .drfx-icon { width: 14px; height: 14px; color: #60706a; }
.ds-header-dropdown-list > a:hover .drfx-icon { color: #50dfc1; transform: translateX(1px); }
.ds-header-dropdown-list > p { margin: 0; padding: 12px 10px; color: #718078; font-size: 10px; }

.ds-header-dropdown-docs {
  margin-top: 8px;
  border-top: 1px solid rgba(210, 230, 220, .1);
  border-radius: 0 0 4px 4px;
  color: #50dfc1 !important;
}
.ds-header-dropdown-docs:hover { background: rgba(80, 223, 193, .07); }

.ds-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  min-width: 0;
}

.ds-header-account,
.ds-header-discord,
.ds-header-basket {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid rgba(207, 228, 218, .13) !important;
  border-radius: 5px !important;
  background: #0d1512 !important;
  color: #a9b5af !important;
  font-size: 9px !important;
  font-weight: 790 !important;
  letter-spacing: .025em;
  line-height: 1;
  text-decoration: none !important;
  white-space: nowrap;
  transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease, transform 150ms ease;
}

.ds-header-account .drfx-icon,
.ds-header-discord .drfx-icon,
.ds-header-basket .drfx-icon { width: 15px; height: 15px; flex: 0 0 15px; }

.ds-header-account span { max-width: 105px; overflow: hidden; text-overflow: ellipsis; }
.ds-header-account:hover,
.ds-header-discord:hover { border-color: rgba(80, 223, 193, .38) !important; color: #f5f8f6 !important; background: #131e1a !important; }
.ds-header-discord .drfx-icon { color: #50dfc1; }

.ds-header-basket {
  min-width: 102px;
  border-color: #50dfc1 !important;
  background: #50dfc1 !important;
  color: #0b1713 !important;
}

.ds-header-basket:hover { transform: translateY(-1px); border-color: #78ead2 !important; background: #78ead2 !important; color: #08110e !important; }
.ds-header-basket:active { transform: translateY(0); }

.ds-header-basket em {
  display: grid;
  place-items: center;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 3px;
  background: rgba(7, 18, 14, .13);
  color: inherit;
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.ds-site-header a:focus-visible,
.ds-site-header button:focus-visible,
.ds-site-header summary:focus-visible {
  outline: 2px solid #50dfc1 !important;
  outline-offset: 3px;
}

.ds-site-header .site-sale-banner {
  margin: 0 !important;
  padding: 8px 18px !important;
  border: 0 !important;
  background: #50dfc1 !important;
  color: #08110e !important;
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

@media (max-width: 980px) {
  .ds-header-shell { grid-template-columns: auto 1fr auto; gap: 14px; width: calc(100% - 28px); }
  .ds-header-nav { justify-content: flex-end; gap: 0; }
  .ds-header-home,
  .ds-header-docs { display: none !important; }
  .ds-header-scripts > summary { min-width: 74px; padding: 0 10px; }
  .ds-header-dropdown { position: fixed; top: 69px; right: 14px; left: 14px; width: auto; transform: translateY(8px); }
  .ds-header-scripts[open] .ds-header-dropdown { transform: translateY(0); }
  .ds-header-account span { display: none; }
  .ds-header-account { width: 40px; padding: 0 !important; }
}

@media (max-width: 620px) {
  .ds-header-shell { min-height: 68px; gap: 8px; width: calc(100% - 20px); }
  .ds-header-logo { flex-basis: 29px; width: 29px; height: 29px; }
  .ds-header-logo img { width: 22px !important; height: 22px !important; }
  .ds-header-brand-copy small { display: none; }
  .ds-header-brand-copy strong { font-size: 15px; }
  .ds-header-actions { gap: 5px; }
  .ds-header-discord { display: none !important; }
  .ds-header-basket { min-width: 42px; width: auto; padding: 0 9px !important; }
  .ds-header-basket > span { display: none; }
  .ds-header-scripts > summary { min-width: 68px; font-size: 10px; }
  .ds-header-dropdown { top: 62px; right: 10px; left: 10px; }
}

@media (max-width: 390px) {
  .ds-header-brand-copy { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ds-site-header *,
  .ds-site-header *::before,
  .ds-site-header *::after { transition: none !important; }
}


/* Keep the header surface full-bleed; only its inner shell is constrained. */
.ds-site-header {
  max-width: none !important;
  align-self: stretch !important;
  flex: 0 0 auto !important;
  box-sizing: border-box !important;
}