.network-page {
  --u: 1px;
  --network-pink: #cf4a7f;
  --network-blush: #f4ccda;
  --network-cream: #fbf8f3;
  --network-ink: #211c1d;
  color: var(--network-ink);
  background: var(--network-cream);
  font-family: Harmony, "Microsoft YaHei", sans-serif;
}

.network-hero {
  position: relative;
  overflow: hidden;
  /* Keep the desktop hero at the PSD's 1920:652 proportion.  A fixed
     aspect-ratio prevents one viewport from stretching it to full screen
     while another leaves it looking like a short card. */
  aspect-ratio: 1920 / 652;
  min-height: 0;
  background:
    radial-gradient(ellipse 72% 115% at 100% 0%, #df839f 0%, #e9a9bd 28%, #f3ccd7 54%, transparent 82%),
    linear-gradient(108deg, #fbf7f0 0%, #f7f0ee 52%, #f5dfe5 100%);
}

.network-hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: calc(650 * var(--u));
  grid-template-columns: minmax(0, 1fr) minmax(calc(300 * var(--u)), calc(450 * var(--u)));
  align-items: center;
  gap: clamp(calc(40 * var(--u)), 5.2vw, calc(110 * var(--u)));
  padding-block: calc(58 * var(--u));
}

/* The PSD places the hero copy and the right navigation independently:
   the English kicker begins near the top of the hero while the Chinese
   heading sits lower on the left.  Centering the whole grid creates the
   large blank band shown in the previous build. */
@media (min-width: 761px) {
  .network-hero {
    height: clamp(560px, 33.9583vw, 652px);
    aspect-ratio: auto;
  }

  .network-hero__inner {
    display: block;
    /*
     * The source PSD is a 1920 × 652 hero.  Keep that ratio as the
     * viewport changes so a narrow capture does not look "full screen"
     * while a wide capture looks like a short, floating block.
     */
    height: 100%;
    min-height: 0;
    padding: 0;
  }

  .network-hero__copy {
    position: absolute;
    top: clamp(82px, 5.7292vw, 110px);
    left: 0;
    width: min(800px, 58vw);
    max-width: none;
  }

  .network-hero__menu-wrap {
    position: absolute;
    top: clamp(28px, 1.927vw, 37px);
    right: 0;
    width: min(450px, 23.4375vw);
  }
}

.network-hero__copy {
  max-width: calc(790 * var(--u));
}

.network-kicker {
  color: #c4c4c4;
  font-size: clamp(14px, 1.04vw, 20px);
  font-weight: 650;
  letter-spacing: 0;
}

.network-hero h1 {
  margin: clamp(15px, 1.0417vw, 20px) 0 clamp(32px, 2.2396vw, 43px);
  font-size: clamp(60px, 4.1667vw, 80px);
  letter-spacing: 0;
}

.network-hero__copy > p,
.network-section-heading > p {
  max-width: min(800px, calc(100vw - 800px));
  color: #6d6663;
  font-size: clamp(18px, 1.1458vw, 22px);
  line-height: 1.8;
}

.network-hero__copy > p strong {
  color: var(--network-pink);
}

.network-hero__menu-wrap {
  display: grid;
  gap: clamp(48px, 2.6563vw, 60px);
  align-content: center;
}

.network-hero__menu-wrap > .network-kicker {
  justify-self: center;
}

.network-hero__menu {
  display: grid;
  gap: clamp(7px, .5208vw, 10px);
  padding: clamp(9px, .625vw, 12px);
  border-radius: clamp(12px, .8333vw, 16px);
  background: #fff;
  box-shadow: 0 12px 32px #6b41501c;
}

.network-hero__menu a {
  display: grid;
  grid-template-columns: clamp(22px, 1.3542vw, 26px) minmax(0, 1fr) clamp(14px, .8333vw, 16px);
  align-items: center;
  gap: clamp(8px, .5208vw, 10px);
  min-height: clamp(62px, 3.9583vw, 76px);
  padding: clamp(7px, .4167vw, 8px) clamp(8px, .5208vw, 10px);
  border-radius: clamp(8px, .5208vw, 10px);
  background: #f4c8d6;
  color: #34292d;
  transition: background-color .2s, color .2s, box-shadow .2s, transform .2s;
  will-change: transform;
}

.network-hero__menu a:nth-child(1):hover,
.network-hero__menu a:nth-child(2):hover,
.network-hero__menu a:nth-child(3):hover,
.network-hero__menu a:nth-child(4):hover,
.network-hero__menu a:nth-child(5):hover,
.network-hero__menu a:nth-child(1):focus-visible,
.network-hero__menu a:nth-child(2):focus-visible,
.network-hero__menu a:nth-child(3):focus-visible,
.network-hero__menu a:nth-child(4):focus-visible,
.network-hero__menu a:nth-child(5):focus-visible {
  position: relative;
  z-index: 2;
  box-shadow:
    16px 12px 34px rgb(111 55 78 / 42%),
    4px 5px 12px rgb(111 55 78 / 26%);
  transform: translate(-4px, -4px);
}

.network-hero__menu a:first-child,
.network-hero__menu a[aria-current="location"] {
  background: #d4537e;
  color: #fff;
}

.network-hero__menu a > span {
  display: grid;
  width: clamp(19px, 1.1458vw, 22px);
  height: clamp(19px, 1.1458vw, 22px);
  place-items: center;
  border-radius: 6px;
  background: #fff;
  color: var(--network-pink);
  font-size: clamp(8px, .4688vw, 9px);
}

.network-hero__menu a div {
  display: grid;
  gap: 1px;
}

.network-hero__menu strong {
  font-size: clamp(13px, 1.04vw, 20px);
  font-weight: 700;
  line-height: 1.25;
}

.network-hero__menu small {
  color: #ffffffb8;
  font-size: clamp(8px, .73vw, 14px);
  line-height: 1.2;
  text-transform: uppercase;
}

.network-hero__menu a:not(:first-child) small {
  color: #c17f96;
}

.network-hero__menu a:nth-child(3) {
  background: #f0b7c9;
}

.network-hero__menu a:nth-child(4) {
  background: #eca5bc;
}

.network-hero__menu a:nth-child(5) {
  background: #e891ac;
}

.network-hero__menu a:nth-child(n+2) {
  color: #6b2d45;
}

.network-hero__menu a[aria-current="location"] small {
  color: #ffffffb8;
}

.network-hero__menu b {
  font-size: clamp(12px, .7292vw, 14px);
  font-weight: 400;
}

.network-hero__watermark {
  position: absolute;
  left: -.28em;
  bottom: clamp(-2px, -.1042vw, -1px);
  color: transparent;
  font-size: clamp(128px, 9.8958vw, 190px);
  font-weight: 600;
  line-height: 1;
  -webkit-text-stroke: 1px #cf4a7f24;
  white-space: nowrap;
  pointer-events: none;
}

.network-section-index {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--network-pink);
  font-size: 12px;
  font-weight: 700;
}

.network-section-index > b {
  display: grid;
  width: 35px;
  height: 29px;
  place-items: center;
  border-radius: 6px;
  background: var(--network-pink);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.network-section-index small {
  color: var(--network-pink);
  font-size: 11px;
  font-weight: 600;
}

.network-page-section {
  padding: 64px 0;
}

.network-split {
  display: grid;
  grid-template-columns: minmax(220px, .7fr) minmax(0, 2.3fr);
  align-items: start;
  gap: clamp(40px, 6vw, 82px);
}

.network-platforms .network-split,
.network-brands .network-split {
  display: block;
}

.network-platforms {
  background: #fff;
  --platform-u: clamp(.65px, .052083333vw, 1px);
}

.network-platforms .network-section-heading h2 {
  font-size: calc(38 * var(--platform-u));
}
.network-platforms .network-section-heading {
  margin-bottom: calc(46 * var(--platform-u));
}

.network-hero > .container,
.network-platforms > .container,
.network-brands > .container,
.network-offline > .container,
.network-creators > .container {
  width: min(1336px, 69.5vw);
  max-width: calc(100% - 40px);
}

.network-products > .container {
  width: min(1336px, 69.5vw);
  max-width: calc(100% - 40px);
}

.network-contact > .container {
  width: min(1240px, 64.6vw);
  max-width: calc(100% - 40px);
}

.network-platforms .network-section-heading,
.network-brands .network-section-heading {
  margin-bottom: 36px;
}

.network-section-heading h2 {
  margin: 16px 0 14px;
  font-size: 26px;
  line-height: 1.3;
}

.network-section-heading > p {
  font-size: 12px;
  line-height: 1.75;
}

.network-channel-list {
  min-width: 0;
  border-top: 1px solid #e9e2dc;
}

.network-channel-row {
  display: grid;
  grid-template-columns: calc(42 * var(--platform-u)) calc(230 * var(--platform-u)) minmax(0, 1fr);
  align-items: center;
  gap: calc(16 * var(--platform-u));
  min-height: calc(110 * var(--platform-u));
  padding: calc(12 * var(--platform-u)) 0;
  border-bottom: 1px solid #e9e2dc;
  background: #fff;
}

.network-channel-row:nth-child(odd) {
  background: #fff;
}

.network-channel-row h3 {
  margin: 0;
  color: #1b1b1b;
  font-size: calc(22 * var(--platform-u));
  font-weight: 600;
}

.network-channel-index {
  color: #e7a1bb;
  font-size: calc(14 * var(--platform-u));
  font-weight: 700;
  line-height: 1;
}

.network-channel-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: calc(44 * var(--platform-u));
}

.network-channel-logos > div {
  display: grid;
  width: calc(120 * var(--platform-u));
  flex: 0 0 calc(120 * var(--platform-u));
  min-width: 0;
  height: calc(70 * var(--platform-u));
  place-items: center;
  padding: calc(8 * var(--platform-u));
  background: transparent;
}

.network-channel-logos img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(52 * var(--platform-u));
  object-fit: contain;
}

/* Reference layout: moderate logo sizes, left aligned, with a denser last row. */
.network-channel-row:nth-child(2) .network-channel-logos {
  gap: calc(44 * var(--platform-u));
}

.network-channel-row:nth-child(3) .network-channel-logos {
  gap: calc(44 * var(--platform-u));
}

.network-channel-row:nth-child(4) .network-channel-logos {
  gap: calc(12 * var(--platform-u));
}
.network-channel-row:nth-child(4) .network-channel-logos > div {
  width: calc(80 * var(--platform-u));
  flex-basis: calc(80 * var(--platform-u));
}
.network-channel-row:nth-child(4) .network-channel-logos img {
  max-height: calc(46 * var(--platform-u));
}

.network-brands {
  background: #fdfbf9;
}

.network-brand-grid {
  isolation: isolate;
  background: #fdfbf9;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 1px;
  border-top: 1px solid #efd7df;
  border-left: 1px solid #efd7df;
}

.network-brand-grid > div {
  display: grid;
  min-width: 0;
  min-height: 62px;
  place-items: center;
  padding: 8px;
  border-right: 1px solid #efd7df;
  border-bottom: 1px solid #efd7df;
  background: transparent;
}

.network-brand-grid img {
  mix-blend-mode: multiply;
  max-width: 100%;
  max-height: 34px;
  object-fit: contain;
}

.network-brand-grid img[alt="Chloé"] {
  width: min(100%, 100px);
  height: 34px;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

.network-brand-grid .network-brand-word:nth-child(57) > span {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}

.network-products {
  overflow: hidden;
  background: #fff;
}

.network-section-heading--center {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .5fr);
  grid-template-rows: auto auto;
  align-items: end;
  gap: 40px;
  margin: 0 auto 42px;
  text-align: left;
}

.network-section-heading--center .network-section-index {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  width: max-content;
}

.network-section-heading--center h2 {
  grid-column: 1;
  grid-row: 2;
}

.network-section-heading--center > p {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  margin: 0;
  text-align: right;
}

/* Keep the English product heading balanced as the desktop canvas narrows. */
html[lang="en"] .network-section-heading--center {
  grid-template-columns: minmax(0, .92fr) minmax(380px, .72fr);
  gap: clamp(24px, 2.1vw, 40px);
}

html[lang="en"] .network-section-heading--center > p {
  max-width: none;
  text-wrap: balance;
}

.network-products .partner-carousel-list {
  gap: 34px;
}

.network-products .partner-carousel {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.network-products .partner-carousel__head {
  display: none;
}

.network-products .partner-carousel__stage {
  display: grid;
  grid-template-columns: clamp(150px, 16vw, 230px) minmax(0, 1fr);
  align-items: start;
  gap: 18px;
}

.network-products .partner-carousel__viewport {
  position: relative;
  overflow: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}

.network-products .partner-carousel__viewport::-webkit-scrollbar {
  display: none;
}

.network-products .partner-carousel__viewport::after {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0;
  width: clamp(28px, 5vw, 72px);
  background: linear-gradient(270deg, #fff 0%, rgb(255 255 255 / 82%) 35%, #fff0 100%);
  content: "";
  pointer-events: none;
}

.network-products .partner-carousel__viewport::before {
  position: absolute;
  z-index: 4;
  top: 0;
  bottom: 0;
  left: 0;
  width: clamp(28px, 5vw, 72px);
  background: linear-gradient(90deg, #fff 0%, rgb(255 255 255 / 82%) 35%, #fff0 100%);
  content: "";
  pointer-events: none;
}

.network-products .partner-carousel__track {
  display: flex;
  align-items: start;
  width: max-content;
  animation: network-product-marquee var(--network-marquee-duration, 72s) linear infinite;
  will-change: transform;
}

.network-products .partner-carousel__marquee-group {
  display: flex;
  flex: 0 0 auto;
  align-items: start;
  gap: 18px;
  width: max-content;
}

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

.network-products .partner-carousel__viewport:hover .partner-carousel__track,
.network-products .partner-carousel__viewport:focus .partner-carousel__track {
  animation-play-state: paused;
}

.network-products .partner-product-card {
  flex: 0 0 clamp(150px, 16vw, 230px);
  min-width: 0;
  margin: 0;
}

.network-products .partner-product-card--cover {
  width: 100%;
}

.network-products .partner-product-card__image,
.network-products .partner-product-card__cover-image {
  height: 214px !important;
  border-radius: 12px;
  background: #f6f6f6;
}

.network-products .partner-product-card__cover-image {
  display: block;
  width: 100%;
  object-fit: cover;
  mix-blend-mode: normal;
}

.network-products .partner-product-card__image {
  display: grid;
  place-items: center;
  overflow: hidden;
}

.network-products .partner-product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Correct only source photos whose product subject is visibly off-center. */
.network-products .partner-product-card__image img.partner-product-card__image--auto-centered {
  transform: var(--product-artwork-transform);
}

.network-products .partner-product-card--cover {
  position: static;
  overflow: hidden;
  border-radius: 12px;
}

/* The source cover artwork contains Chinese labels. Replace only those labels
   on the English page while keeping the product imagery unchanged. */
html[lang="en"] .network-products .partner-product-card--cover {
  position: relative;
}

html[lang="en"] .network-products .partner-product-card--cover::after {
  content: attr(data-label);
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  height: 16%;
  place-items: center;
  padding: 0 8px;
  background: #b9a3ad;
  color: #fff;
  font-size: clamp(15px, 1.2vw, 20px);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.network-offline {
  background: #fbf8f3;
}

.network-offline .network-section-heading {
  transform: translateY(-12px);
}

.network-offline-grid {
  position: relative;
  display: block;
  width: 100%;
  max-width: 1260px;
  height: clamp(430px, 31vw, 650px);
  margin-inline: auto;
  padding: 0 18px;
}

.network-offline-grid article {
  position: relative;
  display: grid;
  position: absolute;
  top: 0;
  left: 18px;
  width: calc(100% - 36px);
  min-width: 0;
  height: clamp(150px, 11.98vw, 230px);
  grid-template-columns: clamp(50px, 4.2vw, 80px) clamp(180px, 18vw, 280px) auto;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 2.3vw, 36px);
  padding: clamp(16px, 1.6vw, 24px) clamp(46px, 5.2vw, 84px);
  border: 1px solid #eed9e0;
  border-radius: 34px;
  background: #fff;
  box-shadow:
    0 10px 16px rgb(78 45 57 / 12%),
    0 3px 6px rgb(78 45 57 / 8%);
}

.network-offline-grid article:first-child {
  z-index: 3;
  background: #f3c6d6;
}

.network-offline-grid article:nth-child(2) {
  z-index: 2;
  top: clamp(108px, 8.333vw, 160px);
  left: 18px;
  width: calc(90% - 36px);
  background: #fae9ef;
  box-shadow:
    0 15px 22px rgb(78 45 57 / 14%),
    0 4px 8px rgb(78 45 57 / 9%);
}

.network-offline-grid article:last-child {
  z-index: 1;
  top: clamp(216px, 16.667vw, 320px);
  left: 18px;
  width: calc(80% - 36px);
}

.network-offline-grid h3 {
  margin: 0;
  color: #514a46;
  font-size: clamp(18px, 1.56vw, 25px);
  font-weight: 600;
}

.network-offline-grid article > span {
  color: transparent;
  font-size: clamp(36px, 3.3vw, 48px);
  font-weight: 700;
  -webkit-text-stroke: 1px #cf4a7f78;
}

.network-offline-grid article > div {
  min-width: 0;
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0;
}

.network-offline-grid article > span,
.network-offline-grid article > h3,
.network-offline-grid article > div {
  position: relative;
  top: auto;
}

.network-offline-grid article > span,
.network-offline-grid article > h3 {
  position: absolute;
  top: 50%;
  z-index: 2;
  margin: 0;
  transform: translateY(-50%);
}

.network-offline-grid article > span {
  left: clamp(28px, 2.2vw, 42px);
}

.network-offline-grid article > h3 {
  left: clamp(120px, 10.4vw, 160px);
  transform: translate(-1em, -50%);
}

.network-offline-grid article:nth-child(2) > span,
.network-offline-grid article:nth-child(2) > h3 {
  top: calc(50% + clamp(20px, 1.4vw, 24px));
}

.network-offline-grid article:nth-child(2) > div {
  position: relative;
  top: clamp(20px, 1.4vw, 24px);
}

.network-offline-grid article > div {
  grid-column: 3;
  width: auto;
  transform: none;
}

.network-offline-grid article:nth-child(2) > div {
  width: clamp(420px, 36vw, 560px);
  justify-content: space-between;
  transform: translateX(clamp(-34px, -2.2vw, -16px));
}

.network-offline-grid article:first-child > div {
  gap: clamp(42px, 3.2vw, 58px);
  transform: translateX(clamp(-34px, -2.2vw, -16px));
}

.network-offline-grid img {
  flex: 0 0 auto;
  max-width: 100%;
  max-height: clamp(28px, 2.5vw, 45px);
  object-fit: contain;
}

.network-offline-grid article:last-child {
  grid-template-columns: 50px clamp(145px, 12vw, 180px) auto;
  justify-content: center;
  gap: 28px;
  padding-inline: clamp(24px, 3vw, 46px);
  box-shadow:
    0 14px 22px rgb(78 45 57 / 13%),
    0 4px 8px rgb(78 45 57 / 8%);
}

.network-offline-grid article:last-child > div {
  width: auto;
  gap: clamp(10px, 1.2vw, 18px);
}

.network-offline-grid article:last-child > span,
.network-offline-grid article:last-child > h3 {
  top: calc(50% + clamp(12px, 1.5vw, 24px));
}

.network-offline-grid article:last-child > div {
  position: relative;
  top: clamp(12px, 1.5vw, 24px);
  transform: translateX(clamp(-32px, -1.8vw, -14px));
}

.network-offline-grid article:last-child img {
  max-height: clamp(18px, 1.7vw, 32px);
}

.network-creators {
  background: #fff;
}

.network-creator-grid {
  display: grid;
  width: min(992px, 51.7vw);
  margin-inline: auto;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  justify-content: space-between;
  gap: 22px;
}

.network-creator-grid figure {
  min-width: 0;
  margin: 0;
}

.network-creator-grid img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 237 / 502;
  border-radius: 10px;
  object-fit: contain;
  object-position: center;
}

.network-creator-grid figcaption {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding-top: 12px;
  font-size: 12px;
}

.network-creator-grid figcaption strong {
  color: var(--network-pink);
}

.network-creator-grid figcaption span {
  color: #8e8785;
}

.network-contact {
  padding: 52px 0 64px;
  background: #282126;
  color: #fff;
}

.network-contact > .container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 32px;
}

.network-contact__eyebrow,
.network-contact > .container > h2 {
  grid-column: 1 / -1;
}

.network-contact__eyebrow {
  color: #f1c5d5;
  font-size: 12px;
}

.network-contact > .container > h2 {
  margin: 0 0 14px;
  font-size: 26px;
}

.network-contact__grid {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}

.network-contact__card {
  min-width: 0;
  padding: 20px;
  border: 1px solid #ffffff24;
  border-radius: 10px;
  background: #ffffff08;
  transition: border-color .2s ease;
}

.network-contact__card:hover {
  border-color: #c9497d;
}

.network-contact__card > span {
  color: #d5c6cc;
  font-size: 10px;
}

.network-contact__card h3 {
  margin: 10px 0;
  font-size: 17px;
}

.network-contact__card p {
  min-height: 38px;
  margin: 0 0 14px;
  color: #c8bec2;
  font-size: 12px;
  line-height: 1.7;
}

.network-contact__card .button {
  min-height: 34px;
  padding: 7px 16px;
  font-size: 12px;
}

.network-contact__card .button.outline {
  color: #f1c5d5;
  border-color: #8a7480;
}

.network-contact__card:hover .button.outline {
  color: #fff;
  border-color: var(--pink);
  background: var(--pink);
}

.network-page .menu-toggle {
  display: none;
}

@media (max-width: 900px) {
  .network-page .header-inner nav {
    gap: 18px;
    font-size: 14px;
  }

  .network-brand-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

}

@media (max-width: 1200px) and (min-width: 761px) {
  .network-page .header-inner {
    gap: 24px;
  }

  .network-page .brand {
    width: 220px;
  }

  .network-page .header-inner nav {
    gap: 22px;
    font-size: 16px;
  }

  .network-page .small-button {
    padding: 11px 16px;
    font-size: 16px;
  }
}

@media (max-width: 760px) {
  .network-hero {
    aspect-ratio: auto;
  }

  .network-page .site-header {
    height: 80px;
  }

  .network-page .header-inner {
    gap: 14px;
  }

  .network-page .brand {
    width: 165px;
  }

  .network-page .menu-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    order: 3;
    width: 32px;
    height: 36px;
    gap: 5px;
    padding: 5px;
    border: 0;
    background: none;
  }

  .network-page .menu-toggle span {
    width: 22px;
    height: 2px;
    background: var(--network-ink);
  }

  .network-page .header-inner nav {
    position: absolute;
    top: 80px;
    right: 0;
    left: 0;
    z-index: 5;
    display: none;
    align-items: flex-start;
    flex-direction: column;
    padding: 24px;
    background: var(--network-cream);
    box-shadow: 0 10px 20px #0001;
  }

  .network-page .header-inner nav.open {
    display: flex;
  }

  .network-page .small-button {
    margin-left: auto;
    padding: 10px 15px;
    font-size: 13px;
  }

  .network-hero__inner {
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 26px;
    padding-block: 54px;
  }

  .network-hero h1 {
    margin: 16px 0;
    font-size: 48px;
  }

  .network-hero__copy > p {
    font-size: 14px;
  }

  .network-hero__menu {
    max-width: 360px;
  }

  .network-hero__menu-wrap {
    gap: 14px;
  }

  .network-page-section {
    padding: 54px 0;
  }

  .network-section-heading--center {
    display: block;
  }

  .network-section-heading--center > p {
    margin-top: 12px;
    text-align: left;
  }

  .network-split {
    display: block;
  }

  .network-split > .network-section-heading {
    margin-bottom: 25px;
  }

  .network-channel-row {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 15px 10px;
  }

  .network-channel-logos > div {
    width: 100%;
    height: 68px;
  }

  .network-brand-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .network-offline-grid {
    height: auto;
    padding-inline: 0;
  }

  .network-offline-grid article,
  .network-offline-grid article:nth-child(2),
  .network-offline-grid article:last-child {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    grid-template-columns: 34px minmax(90px, 1fr);
    margin: 0;
    padding: 16px 13px;
    border-radius: 12px;
  }

  .network-offline-grid article + article {
    margin-top: 10px;
  }

  .network-offline-grid article > div {
    width: auto;
    transform: none;
    top: 0;
    grid-column: 1 / -1;
  }

  .network-offline-grid article:nth-child(2) > div {
    width: auto;
    transform: none;
  }

  .network-offline-grid article:first-child > div {
    gap: 32px;
    transform: none;
  }

  .network-offline-grid article > span,
  .network-offline-grid article > h3 {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
  }

  .network-creator-grid,
  .network-contact__grid {
    grid-template-columns: 1fr 1fr;
  }

  .network-products .partner-carousel__track {
    gap: 0;
  }

  .network-products .partner-carousel__stage {
    grid-template-columns: min(42vw, 174px) minmax(0, 1fr);
    gap: 10px;
  }

  .network-products .partner-carousel__marquee-group {
    gap: 10px;
  }

  .network-products .partner-product-card {
    flex-basis: min(42vw, 174px);
  }

  .network-products .partner-carousel__viewport::after,
  .network-products .partner-carousel__viewport::before {
    width: 30px;
  }

  .network-products .partner-product-card__image,
  .network-products .partner-product-card__cover-image {
    height: 160px !important;
  }

}

@media (prefers-reduced-motion: reduce) {
  .network-products .partner-carousel__viewport {
    overflow-x: auto;
  }

  .network-products .partner-carousel__track {
    animation: none;
    will-change: auto;
  }
}

@media (max-width: 380px) {
  .network-page .small-button {
    padding-inline: 10px;
  }

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

  .network-creator-grid,
  .network-contact__grid {
    grid-template-columns: 1fr;
  }
}

/* ===== 窄画布（手机等比缩放 = 1440）下：线下渠道 logo 缩小 + 组内留出间隔；结构与位置不变 ===== */
@media (max-width:1700px){
  /* 01 组 */
  .network-offline-grid article:first-child > div{transform:none!important;gap:clamp(34px,2.8vw,50px)!important}
  .network-offline-grid article:first-child > div img{max-height:30px!important}
  /* 02 组：原来这组 logo 之间的间隔是 0，挨在一起；这里给足间隔 */
  .network-offline-grid article:nth-child(2) > div{
    width:auto!important;min-width:0!important;transform:none!important;
    justify-content:space-between!important;gap:clamp(26px,2.6vw,40px)!important;
  }
  .network-offline-grid article:nth-child(2) > div img{max-height:17px!important}
  /* 03 组 */
  .network-offline-grid article:last-child > div img{max-height:15px!important}
  html[lang="en"] .network-offline-grid article:last-child > div{
    left:calc(50% + 78px)!important;right:12px!important;transform:none!important;
    justify-content:space-between!important;gap:clamp(12px,1.15vw,18px)!important;
  }
  html[lang="en"] .network-offline-grid article:last-child > div img{max-height:14px!important}
  .network-offline-grid article:last-child > div{gap:clamp(18px,1.8vw,28px)!important;justify-content:space-between!important}
}
/* 达人资源 4 图：桌面档每张 195–245px 随屏放大、空隙 34px、整排居中；框比例取最宽源图，保证不裁切且高度齐平 */
@media (min-width: 681px) {
  .network-creator-grid {
    width: max-content;
    max-width: 100%;
    margin-inline: auto;
    grid-template-columns: repeat(4, clamp(195px, 13.9vw, 245px));
    gap: 34px;
    justify-content: center;
  }
  .network-creator-grid img {
    aspect-ratio: 390 / 762;
  }
}