/* Hallmark · macrostructure: existing scrollable casebook · genre: editorial · tone: restrained · anchor: FORWHY indigo · enrichment: project media */
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 · scope slop: pass · tokens: pass · contrast: pass · mobile: pass */
:root {
  --text-brand-visual-title: clamp(2.15rem, 3.65vw, 3.65rem);
  --text-brand-launch-refined-title: clamp(2.35rem, 3.8vw, 3.75rem);
  --text-brand-launch-refined-lead: clamp(1.125rem, 1.45vw, 1.5rem);
  --text-brand-launch-refined-body: clamp(0.8125rem, 0.86vw, 0.9375rem);
  --space-case-gallery-gap: clamp(0.4375rem, 0.72vw, 0.75rem);
  --color-case-media-stage: var(--paper);
  --radius-case-media: clamp(0.5625rem, 0.85vw, 0.875rem);
  --scale-prism-summer-background: 1.28;
  --scale-link-click-background: 1.64;
  --scale-earth-day-gallery-detail: 1.02;
  --space-brand-visual-showcase-gap: clamp(0.5rem, 0.8vw, 0.875rem);
  --dur-brand-visual-row-a: 82s;
  --dur-brand-visual-row-b: 76s;
  --color-qr-paper: oklch(100% 0 0);
  --measure-live-case-description: 38em;
}

.rich-gallery figure,
.visual-grid figure,
.brand-launch-media-slot {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-case-media-stage);
  border-radius: var(--radius-case-media);
  overflow: hidden;
}

.rich-gallery img,
.visual-grid img,
.brand-launch-media-slot img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  background: var(--color-case-media-stage);
  border-radius: var(--radius-case-media);
}

.brand-launch-media-slot video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: inherit;
}

.rich-gallery figure,
.visual-grid figure,
.brand-launch-overview-page .brand-launch-media-slot {
  aspect-ratio: 16 / 9;
}

.brand-launch-overview-page .brand-launch-overview-copy h2 {
  font-size: var(--text-brand-launch-refined-title);
  line-height: 1.04;
}

.brand-launch-overview-page .brand-launch-overview-copy h3 {
  font-size: var(--text-brand-launch-refined-lead);
  line-height: 1.28;
}

.brand-launch-overview-page .brand-launch-overview-copy p {
  font-size: var(--text-brand-launch-refined-body);
  line-height: 1.58;
}

.team-member figcaption p {
  max-width: 20em;
  text-wrap: balance;
}

.rich-case-detail-longi-earth-day .rich-gallery-item-3 img {
  transform: scale(var(--scale-earth-day-gallery-detail));
}

:is(
  .standard-case-second-hand-rose-dragon-gate-show,
  .standard-case-zheng-runze-vortex-life-tour,
  .standard-case-huanzi-my-youth-has-you,
  .standard-case-yinlin-gurgling-tour,
  .standard-case-huichundan-rising-wind-water,
  .standard-case-prism-summer-invasion-guangzhou,
  .standard-case-link-click-music-tour
) .standard-description {
  max-inline-size: var(--measure-live-case-description);
  text-wrap: pretty;
}

.rich-detail-heading.has-awards {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(14rem, 28%);
  align-items: start;
  gap: 4%;
}

.rich-detail-heading-copy {
  min-width: 0;
}

.rich-detail-heading-copy > p {
  color: var(--signal);
  letter-spacing: 0.16em;
  margin: 0;
  font-size: clamp(0.5rem, 0.72vw, 0.75rem);
  font-weight: 750;
}

.rich-detail-heading.has-awards .award-block {
  margin-top: 0;
}

.rich-detail-heading.has-awards .award-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-case-gallery-gap);
}

.rich-detail-heading.has-awards .award-list-single {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.technology-ampace-detail-images img {
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-case-media);
}

@media (min-width: 0rem) {
  .standard-case-prism-summer-invasion-guangzhou .standard-background {
    transform: scale(var(--scale-prism-summer-background));
    transform-origin: 46% 50%;
  }

  .standard-case-link-click-music-tour .standard-background {
    transform: scaleX(-1) scale(var(--scale-link-click-background));
  }

  .detail-page .detail-title {
    top: 7.4%;
  }

  .detail-page .detail-title h2,
  .rich-case-detail .rich-detail-heading h2 {
    font-size: clamp(1.375rem, 2.25vw, 2.25rem);
    line-height: 1.08;
  }

  .detail-page .visual-grid {
    grid-template: repeat(2, minmax(0, 1fr)) / minmax(0, 52.5%) minmax(0, 25.5%);
    align-content: stretch;
    justify-content: center;
    height: 48%;
    top: 18%;
    row-gap: var(--space-case-gallery-gap);
    column-gap: var(--space-case-gallery-gap);
  }

  .detail-page .visual-grid > figure {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    align-self: center;
  }

  .detail-page .visual-grid > .frame-panel {
    grid-area: 1 / 1 / 3 / 2 !important;
  }

  .detail-page .visual-grid > .commitment-panel {
    grid-area: 1 / 2 / 2 / 3 !important;
  }

  .detail-page .visual-grid > .portrait-panel {
    grid-area: 2 / 2 / 3 / 3 !important;
  }

  .detail-page .narrative-grid {
    top: 70%;
  }

  .detail-page .narrative-grid section,
  .rich-case-detail .rich-narrative-grid section {
    padding-top: 1.5%;
  }

  .detail-page .narrative-grid p,
  .rich-case-detail .rich-narrative-grid p {
    margin-top: 2.6%;
    font-size: clamp(0.75rem, 0.8vw, 0.8125rem);
    line-height: 1.48;
  }

  .rich-case-detail .rich-detail-heading {
    top: 7.4%;
  }

  .rich-case-detail-zhijiao-not-secondhand .gallery-side-award {
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 6%;
    width: 13.5%;
    margin-top: 0;
  }

  .rich-case-detail-zhijiao-not-secondhand .gallery-side-award .award-list {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .gallery-count-5 .rich-gallery,
  .gallery-count-6 .rich-gallery {
    display: grid;
    grid-template: repeat(2, auto) / repeat(6, minmax(0, 1fr));
    align-content: center;
    top: 16.5%;
    height: 60%;
    gap: var(--space-case-gallery-gap);
    left: 6%;
    right: 6%;
  }

  .rich-case-detail .rich-gallery > figure {
    grid-area: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }

  .gallery-count-5 .rich-gallery figure,
  .gallery-count-6 .rich-gallery figure {
    grid-column: span 2 !important;
  }

  .gallery-count-5 .rich-gallery figure:nth-child(4) {
    grid-column: 2 / span 2 !important;
  }

  .gallery-count-5 .rich-gallery figure:nth-child(5) {
    grid-column: 4 / span 2 !important;
  }

  .gallery-count-5 .rich-narrative-grid,
  .gallery-count-6 .rich-narrative-grid {
    top: 80.5%;
  }

  .gallery-count-4 .rich-gallery {
    grid-template: repeat(2, minmax(0, 1fr)) / repeat(2, minmax(0, 1fr));
    align-content: stretch;
    top: 16.5%;
    right: 21%;
    left: 21%;
    height: 58.6%;
    gap: var(--space-case-gallery-gap);
  }

  .gallery-count-4 .rich-gallery figure {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
  }

  .gallery-count-4 .rich-gallery img {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
  }

  .gallery-count-4 .rich-narrative-grid {
    top: 79.5%;
  }

  .gallery-count-3 .rich-gallery {
    grid-template: auto / repeat(3, minmax(0, 1fr));
    align-content: center;
    top: 22%;
    height: 34%;
  }

  .gallery-count-3 .rich-narrative-grid {
    top: 61%;
  }

  .gallery-count-2 .rich-gallery {
    grid-template: auto / repeat(2, minmax(0, 1fr));
    align-content: center;
    top: 21%;
    height: 45%;
  }

  .gallery-count-2 .rich-narrative-grid {
    top: 71%;
  }

  .brand-launch-overview-page .brand-launch-overview-copy {
    width: 33%;
    top: 14%;
    bottom: 11.5%;
  }

  .brand-launch-overview-page .brand-launch-overview-copy > div {
    gap: var(--space-brand-visual-sm);
    max-width: 30rem;
  }

  .brand-launch-overview-page .brand-launch-overview-gallery {
    grid-template-rows: auto auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-content: center;
    inset: 12.5% 5.2% 9.5% 42.2%;
  }

  .technology-ampace-detail-images {
    gap: 3%;
    width: 44%;
    height: auto;
    top: 13.5%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .technology-ampace-narrative {
    top: 61%;
  }

  .technology-ampace-closing {
    bottom: 11.5%;
  }
}

@media screen and (max-width: 0px) {
  .rich-case-detail-zhijiao-not-secondhand .rich-gallery {
    top: 19.8%;
    height: 57.5%;
  }
}

/* Fixed presentation canvas: every screen keeps the desktop 16:9 composition. */
@media screen {
  html,
  body {
    min-width: 1648px;
    overflow-x: auto !important;
  }

  .deck {
    grid-template-columns: 1600px;
    justify-content: center;
  }

  .case-page {
    width: 1600px !important;
    height: 900px !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
  }
}

@media screen and (max-width: 0px) {
  .rich-case-detail-zhijiao-not-secondhand .gallery-side-award {
    position: absolute;
    z-index: 1;
    top: 13.7%;
    right: 6%;
    left: 6%;
    width: auto;
    margin-top: 0;
  }

  .rich-case-detail-zhijiao-not-secondhand .gallery-side-award .award-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-case-gallery-gap);
  }

  .rich-detail-heading.has-awards {
    display: block;
  }

  .rich-detail-heading.has-awards .award-block {
    margin-top: 1rem;
  }

  .rich-detail-heading.has-awards .award-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-case-gallery-gap);
  }

  .rich-detail-heading.has-awards .award-list-single {
    grid-template-columns: minmax(0, 1fr);
    max-width: 22rem;
  }

  .rich-case-detail-zhijiao-not-secondhand .rich-gallery,
  .rich-case-detail-ngk-brand-film .rich-gallery {
    top: 19.5%;
  }

  .gallery-count-4 .rich-gallery {
    grid-template: repeat(2, auto) / repeat(2, minmax(0, 1fr));
    height: auto;
    gap: var(--space-case-gallery-gap);
  }

  .gallery-count-4 .rich-gallery > figure {
    grid-area: auto !important;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .gallery-count-4 .rich-gallery img {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
  }

  .technology-ampace-detail-images {
    height: auto;
    top: 31.5%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .technology-ampace-narrative {
    top: 58%;
  }
}

@media print {
  .brand-launch-overview-page .brand-launch-media-slot {
    aspect-ratio: 16 / 9 !important;
  }
}

.technology-hdr-copy h2 > span {
  display: block;
}

.technology-hdr-logo {
  position: static;
  width: clamp(180px, 13vw, 210px);
  height: auto;
  margin: 0 0 clamp(16px, 1.4vw, 22px);
  display: block;
}

.technology-hdr-copy > p {
  margin-bottom: clamp(12px, 1vw, 16px);
}

.technology-hdr-hero {
  aspect-ratio: 16 / 9;
  height: auto;
}

.technology-ampace-detail-heading h2 > span {
  display: block;
}

@media screen and (min-width: 0px) {
  .technology-scenarios-heading {
    width: auto;
    right: 5.3%;
  }

  .technology-scenarios-heading > span {
    max-width: none;
    white-space: nowrap;
  }

  .technology-ampace-detail-heading {
    width: 32%;
    top: 13.5%;
  }

  .technology-ampace-detail-images {
    grid-template-columns: minmax(0, 0.51fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 3%;
    width: 57.5%;
    height: 45%;
    top: 13.5%;
    right: 3%;
  }

  .technology-ampace-detail-images img {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: cover;
  }

  .technology-ampace-narrative {
    top: 63%;
    padding-top: 2.4%;
  }

  .technology-ampace-closing {
    bottom: 7%;
  }
}

@media screen and (max-width: 0px) {
  .technology-hdr-logo {
    width: 180px;
  }

  .technology-hdr-copy h2 {
    margin-top: 0;
  }

  .technology-ampace-detail-images {
    grid-template-columns: minmax(0, 0.51fr) minmax(0, 1fr);
    height: auto;
  }

  .technology-ampace-detail-images img:first-child {
    aspect-ratio: 701 / 931;
  }

  .technology-ampace-detail-images img:last-child {
    aspect-ratio: 1375 / 931;
  }
}

/* P57: keep the QR entrances inside the left contact column. */
@media screen and (min-width: 0px) {
  .closing-platforms {
    right: 61%;
    bottom: 7%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .closing-platforms .platform-entry {
    min-width: 0;
    gap: 12px;
    padding-right: 10px;
    padding-left: 10px;
  }

  .closing-platforms .platform-entry figcaption {
    min-width: 0;
  }

  .process-page .process-step {
    padding-right: 8%;
  }

  .process-page .process-step p {
    max-width: 14em;
    text-wrap: balance;
  }
}

.closing-platforms .platform-entry {
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 12px 8px 10px;
  text-align: center;
}

.closing-platforms .platform-entry figcaption {
  align-items: center;
  gap: 2px;
}

.closing-platforms .platform-entry figcaption strong {
  font-size: clamp(12px, 0.88vw, 14px);
  line-height: 1.25;
}

.closing-platforms .platform-entry figcaption span {
  font-size: 7px;
  line-height: 1.4;
  letter-spacing: 0.1em;
}

/* P21: image-led, two-row visual system showcase. */
.brand-visual-showcase-page {
  overflow: hidden;
}

.brand-visual-showcase {
  position: absolute;
  z-index: 1;
  top: 9.5%;
  right: 0;
  left: 0;
  display: grid;
  height: 51%;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: var(--space-brand-visual-showcase-gap);
  overflow: hidden;
}

.brand-visual-showcase-row,
.brand-visual-showcase-track,
.brand-visual-showcase-sequence {
  min-width: 0;
  min-height: 0;
}

.brand-visual-showcase-row {
  display: flex;
  align-items: center;
  overflow: hidden;
}

.brand-visual-showcase-track {
  display: flex;
  width: max-content;
}

.brand-visual-showcase-sequence {
  display: flex;
  flex: none;
  gap: var(--space-brand-visual-showcase-gap);
  padding-right: var(--space-brand-visual-showcase-gap);
}

.brand-visual-showcase-row-a {
  padding-left: 5.2%;
}

.brand-visual-showcase-row-b {
  padding-left: 1.8%;
}

.brand-visual-showcase.is-ready .brand-visual-showcase-row-a .brand-visual-showcase-track {
  animation: brand-visual-showcase-scroll var(--dur-brand-visual-row-a) linear infinite;
}

.brand-visual-showcase.is-ready .brand-visual-showcase-row-b .brand-visual-showcase-track {
  animation: brand-visual-showcase-scroll var(--dur-brand-visual-row-b) linear infinite reverse;
}

.brand-visual-showcase.is-ready.is-frame-marquee .brand-visual-showcase-row .brand-visual-showcase-track {
  animation: none;
}

.brand-visual-showcase-row:hover .brand-visual-showcase-track,
.brand-visual-showcase-row:focus-within .brand-visual-showcase-track {
  animation-play-state: paused;
}

.brand-visual-showcase-item {
  display: block;
  flex: 0 0 clamp(14rem, 21vw, 22rem);
  aspect-ratio: 16 / 9;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-case-media);
  background: var(--color-case-media-stage);
  color: inherit;
  cursor: default;
}

.brand-visual-showcase-item img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: contain;
  background: var(--color-case-media-stage);
}

.brand-visual-summary {
  position: absolute;
  z-index: 1;
  top: 62%;
  right: 5.2%;
  bottom: 9.5%;
  left: 5.2%;
  display: grid;
  grid-template-columns: minmax(0, 31%) minmax(0, 1fr);
  align-items: start;
  gap: 5%;
  border-top: 1px solid var(--color-brand-visual-rule);
  padding-top: 2.2%;
}

.brand-visual-summary-copy > p {
  margin: 0 0 0.65rem;
  color: var(--signal);
  font-size: clamp(0.5rem, 0.66vw, 0.6875rem);
  font-weight: 750;
  letter-spacing: 0.16em;
}

.brand-visual-summary-copy h2 {
  margin: 0;
  font-size: clamp(1.8rem, 3.25vw, 3.35rem);
  font-weight: 720;
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.brand-visual-summary-copy h2 > span {
  display: block;
}

.brand-visual-summary-copy strong {
  display: block;
  max-width: 31rem;
  margin-top: 1.1rem;
  color: var(--color-brand-visual-body);
  font-size: clamp(0.75rem, 0.9vw, 0.9375rem);
  font-weight: 450;
  line-height: 1.55;
}

.brand-visual-summary-services {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  height: 100%;
}

.brand-visual-summary-services > section {
  min-width: 0;
  border-left: 1px solid var(--color-brand-visual-rule);
  padding: 0 8% 0 9%;
}

.brand-visual-summary-services > section > span {
  color: var(--signal);
  font-size: clamp(0.5625rem, 0.68vw, 0.75rem);
  font-weight: 750;
  letter-spacing: 0.12em;
}

.brand-visual-summary-services h3 {
  margin: 0.65rem 0 0.45rem;
  font-size: clamp(0.9375rem, 1.18vw, 1.25rem);
  line-height: 1.15;
}

.brand-visual-summary-services p {
  max-width: 16em;
  margin: 0;
  color: var(--color-brand-visual-body);
  font-size: clamp(0.6875rem, 0.82vw, 0.875rem);
  line-height: 1.55;
  text-wrap: balance;
}

@keyframes brand-visual-showcase-scroll {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-50%, 0, 0);
  }
}

@media screen and (max-width: 0px) {
  .brand-visual-showcase-page {
    min-height: 1180px;
  }

  .brand-visual-showcase {
    top: 7.5%;
    height: 39%;
    gap: 0.65rem;
  }

  .brand-visual-showcase-row-a,
  .brand-visual-showcase-row-b {
    padding-left: 1rem;
  }

  .brand-visual-showcase-item {
    flex-basis: min(76vw, 22rem);
  }

  .brand-visual-summary {
    top: 50%;
    right: 6%;
    bottom: 7%;
    left: 6%;
    display: block;
    padding-top: 1.5rem;
  }

  .brand-visual-summary-copy h2 {
    font-size: clamp(2.35rem, 10vw, 3.5rem);
  }

  .brand-visual-summary-copy strong {
    max-width: 34rem;
    margin-top: 1rem;
    font-size: 0.9rem;
  }

  .brand-visual-summary-services {
    height: auto;
    margin-top: 2rem;
    grid-template-columns: 1fr;
  }

  .brand-visual-summary-services > section {
    display: grid;
    grid-template-columns: 2rem minmax(5.5rem, 0.55fr) minmax(0, 1fr);
    align-items: baseline;
    border-top: 1px solid var(--color-brand-visual-rule);
    border-left: 0;
    padding: 0.85rem 0;
  }

  .brand-visual-summary-services h3,
  .brand-visual-summary-services p {
    margin: 0;
  }

}

@media print {
  .brand-visual-showcase.is-ready .brand-visual-showcase-track {
    animation: none !important;
    transform: none !important;
  }

  .brand-visual-showcase-sequence[aria-hidden="true"] {
    display: none;
  }

}

/* 2026-07-30: use one horizontal bilingual title system across P35. */
.performance-section-heading h2,
.performance-section-heading h3 {
  display: flex;
  align-items: baseline;
  gap: clamp(12px, 1.25vw, 22px);
  max-width: none;
  margin: 0;
  line-height: 1.08;
  white-space: nowrap;
}

.performance-section-heading h2 > span,
.performance-section-heading h3 > span {
  display: block;
}

.performance-section-heading h2 > small,
.performance-section-heading h3 > small {
  color: var(--signal);
  letter-spacing: 0.14em;
  font-size: clamp(8px, 0.68vw, 11px);
  font-weight: 720;
  line-height: 1;
}

.partner-artist-sequence .is-featured {
  color: var(--signal);
  font-weight: 780;
}

/* P48: two large 16:9 technology stories with captions on a dark image mask. */
@media screen and (min-width: 0px) {
  .technology-overview-page .technology-overview-copy {
    width: 88%;
    top: 11.5%;
  }

  .technology-overview-page .technology-overview-copy > span {
    max-width: none;
    white-space: nowrap;
  }

  .technology-overview-page .technology-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2.2%;
    position: absolute;
    inset: 43% 5.3% 10%;
  }

  .technology-overview-page .technology-overview-item {
    position: relative;
    display: block;
    min-width: 0;
    overflow: hidden;
    border-radius: clamp(12px, 1vw, 16px);
  }

  .technology-overview-page .technology-overview-item::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 42% 0 0;
    background: linear-gradient(180deg, transparent, rgba(5, 9, 18, 0.9));
    pointer-events: none;
  }

  .technology-overview-page .technology-overview-item figure {
    position: absolute;
    inset: 0;
    margin: 0;
    overflow: hidden;
  }

  .technology-overview-page .technology-overview-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .technology-overview-page .technology-overview-item > strong {
    position: absolute;
    z-index: 2;
    top: 5%;
    left: 4.5%;
    color: #fff;
    font-size: clamp(11px, 0.9vw, 15px);
  }

  .technology-overview-page .technology-overview-item > div {
    position: absolute;
    z-index: 2;
    right: 5%;
    bottom: 7%;
    left: 5%;
    color: #fff;
  }

  .technology-overview-page .technology-overview-item h3 {
    font-size: clamp(22px, 2vw, 32px);
    font-weight: 650;
  }

  .technology-overview-page .technology-overview-item p {
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.76);
    font-size: clamp(12px, 0.95vw, 15px);
  }
}

/* P53: keep the new industrial aerial frame full-bleed. */
.technology-ampace-hero .technology-ampace-background {
  object-fit: cover;
  object-position: center;
}

/* P51: keep the immersive-production specification line legible. */
.technology-immersive-page .technology-immersive-specs small {
  font-size: clamp(10px, 0.92vw, 15px);
  letter-spacing: 0.025em;
  line-height: 1.35;
  white-space: nowrap;
}

/* P55: two-founder editorial layout with complete biographies. */
.founders-roster .team-member-bio {
  display: block;
}

@media screen and (min-width: 0px) {
  .founders-page .team-heading {
    top: 10.5%;
    max-width: 66%;
  }

  .founders-page .team-heading h2 {
    font-size: clamp(44px, 4.7vw, 72px);
  }

  .founders-page .team-heading > span {
    margin-top: 12px;
    color: var(--signal);
    font-size: clamp(14px, 1.05vw, 17px);
    font-weight: 620;
  }

  .founders-roster {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 5%;
    top: 35%;
    right: 6.2%;
    bottom: 6%;
    left: 6.2%;
  }

  .founders-roster .team-member {
    display: grid;
    grid-template-columns: minmax(118px, 27%) minmax(0, 1fr);
    align-items: start;
    gap: 5%;
    text-align: left;
  }

  .founders-roster .team-portrait {
    width: 100%;
    margin: 0;
  }

  .founders-roster .team-member figcaption {
    margin-top: 0;
    padding-top: 10px;
  }

  .founders-roster .team-member figcaption > div {
    justify-content: flex-start;
  }

  .founders-roster .team-member figcaption strong {
    font-size: clamp(24px, 2vw, 32px);
    letter-spacing: 0.02em;
  }

  .founders-roster .team-member figcaption small {
    min-height: 0;
    margin-top: 5px;
    font-size: clamp(10px, 0.76vw, 12px);
  }

  .founders-roster .team-member-bio {
    display: block;
    margin-top: 10px;
  }

  .founders-roster .team-member-bio p {
    max-width: none;
    margin: 0 0 7px;
    color: rgba(29, 29, 29, 0.68);
    font-size: clamp(11px, 0.78vw, 12.5px);
    line-height: 1.62;
    text-align: left;
    text-wrap: pretty;
  }
}

/* P57: circular office portrait and three balanced contact entrances. */
.closing-platforms .platform-entry > .platform-qr-image {
  box-sizing: border-box;
  flex: 0 0 auto;
  width: clamp(92px, 7.2vw, 116px);
  height: clamp(92px, 7.2vw, 116px);
  padding: 6px;
  background: var(--color-qr-paper);
  object-fit: contain;
}

@media screen and (min-width: 0px) {
  .closing-page .closing-copy {
    top: 13%;
    width: 42%;
  }

  .closing-page .closing-copy h2 {
    font-size: clamp(48px, 5.2vw, 82px);
  }

  .closing-page .closing-office {
    aspect-ratio: 1;
    width: 52%;
    height: auto;
    top: -13%;
    right: -4%;
    bottom: auto;
    border-radius: 50%;
    overflow: hidden;
  }

  .closing-page .closing-office img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 58% center;
  }

  .closing-page .closing-platforms {
    right: 50%;
    bottom: 7%;
    left: 5.6%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
  }

  .closing-page .closing-platforms .platform-entry {
    min-width: 0;
    padding: 10px 6px 8px;
    border-top: 1px solid rgba(29, 29, 29, 0.2);
  }

}

@media screen and (max-width: 0px) {
  .technology-overview-page .technology-overview-grid {
    top: 38%;
  }

  .performance-section-heading h2,
  .performance-section-heading h3 {
    gap: 9px;
  }

  .performance-section-heading h2 {
    font-size: 20px;
  }

  .performance-section-heading h3 {
    font-size: 19px;
  }

  .performance-section-heading h2 > small,
  .performance-section-heading h3 > small {
    letter-spacing: 0.08em;
    font-size: 7px;
  }

  .technology-overview-page .technology-overview-item {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    min-height: 220px;
  }

  .technology-overview-page .technology-overview-item figure {
    position: absolute;
    inset: 0;
  }

  .technology-overview-page .technology-overview-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .technology-overview-page .technology-overview-item > strong,
  .technology-overview-page .technology-overview-item > div {
    position: relative;
    z-index: 2;
    color: #fff;
  }

  .technology-overview-page .technology-overview-item > strong {
    display: block;
    padding: 18px 18px 0;
  }

  .technology-overview-page .technology-overview-item > div {
    position: absolute;
    right: 18px;
    bottom: 18px;
    left: 18px;
  }

  .founders-page {
    min-height: 1500px;
  }

  .founders-page .team-heading {
    max-width: 88%;
  }

  .founders-roster {
    grid-template-columns: 1fr;
    gap: 44px;
    top: 27%;
    bottom: 6%;
  }

  .founders-roster .team-member {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: start;
    gap: 18px;
    text-align: left;
  }

  .founders-roster .team-portrait {
    width: 112px;
    margin: 0;
  }

  .founders-roster .team-member figcaption {
    margin-top: 0;
  }

  .founders-roster .team-member figcaption > div {
    justify-content: flex-start;
  }

  .founders-roster .team-member-bio p {
    max-width: none;
    text-align: left;
  }

  .closing-page {
    min-height: 1120px;
  }

  .closing-page .closing-office {
    aspect-ratio: 1;
    width: 72%;
    height: auto;
    top: 27%;
    right: -12%;
    border-radius: 50%;
  }

  .closing-page .closing-platforms {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    right: 6%;
    bottom: 7%;
    left: 6%;
  }
}


/* 2026-07-31: flatten image-heavy pages for mobile reliability. */
.flattened-static-page {
  overflow: hidden;
  background: var(--paper);
}

.flattened-page-image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}

html.offline-motion-enabled:not(.offline-reduced-motion)
  .flattened-static-page:not(.is-motion-active)
  .flattened-page-image,
html.offline-motion-enabled:not(.offline-reduced-motion)
  .flattened-page-image:not(.is-loaded) {
  opacity: 0;
  transform: translateY(10px);
}

html.offline-motion-enabled:not(.offline-reduced-motion)
  .flattened-static-page.is-motion-active
  .flattened-page-image.is-loaded {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 620ms cubic-bezier(.22, 1, .36, 1),
    transform 620ms cubic-bezier(.22, 1, .36, 1);
}

.brand-visual-strip-showcase .brand-visual-showcase-track {
  gap: 0;
  will-change: transform;
}

.brand-visual-strip-image {
  display: block;
  flex: none;
  width: auto;
  max-width: none;
  height: 220px;
}

@media print {
  .flattened-page-image {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .brand-visual-strip-showcase .brand-visual-showcase-track {
    animation: none !important;
    transform: none !important;
  }

  .brand-visual-strip-showcase .brand-visual-strip-image[aria-hidden="true"] {
    display: none;
  }
}


/* P35: two precomposed poster strips, original text marquees retained. */
.p35-poster-strip-sequence {
  gap: 0;
}

.p35-poster-strip-sequence .p35-poster-strip {
  display: block;
  width: auto;
  max-width: none;
  height: 180px;
  border-radius: 0;
  object-fit: contain;
}

/* Keep the requested marquees perceptible after the fixed 1600px canvas is
   scaled down inside mobile WebViews such as WeChat. */
@media screen and (hover: none) and (pointer: coarse) {
  :root {
    --dur-brand-visual-row-a: 42s;
    --dur-brand-visual-row-b: 38s;
  }

  .performance-poster-track {
    animation-duration: 34s;
  }

  .performance-poster-row:nth-child(2) .performance-poster-track {
    animation-duration: 38s;
  }

  .partner-artist-track {
    animation-duration: 44s;
  }

  .partner-artist-row:nth-child(2) .partner-artist-track {
    animation-duration: 48s;
  }
}

/* Important-case video covers: enlarge the shared 1.83:1 card to the
   approved top-right viewing area while preserving its existing controls. */
.case-page .video-card {
  width: 50%;
  top: 17.5%;
  right: 4.8%;
}