.huage-static {
  --huage-gutter: clamp(20px, 4.4vw, 64px);
  --huage-gap: clamp(20px, 3.2vw, 48px);
  --huage-section: clamp(36px, 6vw, 96px);
  --huage-rule: #8e795b52;
}

.huage-static [data-huage-editorial] .huage-list-heading {
  margin-block-end: clamp(26px, 4vw, 48px);
}

.huage-static [data-huage-editorial] .huage-list-heading h1 {
  max-inline-size: 24ch;
  margin-block-end: 0;
}

.huage-static [data-huage-editorial] .huage-list-heading .huage-lead {
  max-inline-size: 65ch;
  margin-block: 1rem 0;
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.7;
}

.huage-static .huage-catalogue-groups {
  display: grid;
  gap: var(--huage-section);
}

.huage-static .huage-catalogue-group {
  border-block-start: 1px solid var(--huage-rule);
  padding-block-start: clamp(18px, 3vw, 32px);
  scroll-margin-block-start: calc(var(--huage-header-height, 0px) + 20px);
}

.huage-static .huage-catalogue-group:not(:has(.huage-reference-card:not([hidden]))) {
  display: none;
}

.huage-static .huage-catalogue-group > h2 {
  margin: 0 0 clamp(14px, 2.5vw, 28px);
  font-size: clamp(22px, 2.6vw, 36px);
  font-weight: 500;
  line-height: 1.25;
}

.huage-static .huage-list-products .huage-catalogue-group .huage-reference-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--huage-gap);
}

.huage-static .huage-list-products .huage-catalogue-group:first-child .huage-reference-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.huage-static [data-huage-editorial] .huage-reference-card-media {
  background: #ebe4db;
  aspect-ratio: 4/3;
}

.huage-static[data-huage-site="CN"] [data-huage-editorial] .huage-reference-card-media {
  border-radius: 8px;
}

.huage-static[data-huage-site="UK"] [data-huage-editorial="catalogue"] .huage-reference-card-media {
  aspect-ratio: 5/4;
}

.huage-static [data-huage-editorial] .huage-reference-card-media img[data-huage-photo="technical"],
.huage-static [data-huage-editorial] .huage-reference-card-media img[data-huage-photo="product-sample"] {
  object-fit: contain;
  padding: clamp(8px, 1.2vw, 16px);
}

.huage-static [data-huage-editorial] .huage-reference-card :is(h2, h3) {
  margin-block: clamp(12px, 1.5vw, 20px) 6px;
  font-size: clamp(16px, 1.6vw, 22px);
  font-weight: 500;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.huage-static [data-huage-editorial] .huage-reference-card p {
  font-size: clamp(13px, 1.1vw, 16px);
  line-height: 1.65;
  margin-block: 6px 0;
  opacity: .9;
}

.huage-static .huage-image-kind {
  display: inline-block;
  margin-block-start: 8px;
  font-size: .78rem;
  line-height: 1.45;
  opacity: .85;
}

.huage-static [data-huage-editorial="product"] .huage-product-lead {
  max-inline-size: 62ch;
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.65;
  margin-block: 16px 24px;
}

.huage-static [data-huage-editorial] :is(.huage-frame-body, .huage-article-body) {
  --huage-block-gap: clamp(24px, 4vw, 52px);
}

.huage-static [data-huage-editorial] :is(.huage-frame-body, .huage-article-body) > section {
  margin-block-end: var(--huage-block-gap);
}

.huage-static [data-huage-editorial] :is(.huage-frame-body, .huage-article-body) figcaption {
  margin-block-start: .65rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.huage-static [data-huage-editorial] :is(.huage-frame-body, .huage-article-body) figure img[data-huage-photo="product-sample"],
.huage-static [data-huage-editorial] :is(.huage-frame-body, .huage-article-body) figure img[data-huage-photo="technical"] {
  object-fit: contain;
  max-inline-size: 100%;
  max-block-size: min(70vh, 540px);
}

.huage-static .huage-editorial-hero {
  overflow: hidden;
  isolation: isolate;
}

.huage-static .huage-editorial-hero .huage-hero-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 58%;
  z-index: -2;
}

.huage-static .huage-editorial-hero::before {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, #1b130d17 12%, #21170e33 45%, #21170eb0 100%);
  z-index: -1;
  pointer-events: none;
}

.huage-static .huage-editorial-hero .huage-hero-caption {
  position: absolute;
  inset-inline-end: var(--huage-gutter);
  inset-block-end: 12px;
  font-size: 12px;
  line-height: 1.5;
  color: white;
}

.huage-static [data-huage-editorial="contact"] [data-huage-brief] .huage-enquiry-send {
  border-block-start: 1px solid var(--huage-rule);
  padding-block-start: clamp(14px, 2.5vw, 26px);
}

@media (max-width: 970px) {
  .huage-static .huage-list-products .huage-catalogue-group .huage-reference-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .huage-static[data-huage-site="UK"] .huage-list-products .huage-catalogue-group .huage-reference-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 360px) {
  .huage-static[data-huage-site="CN"] .huage-list-products .huage-catalogue-group .huage-reference-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}