/* ============================================================
   V28 Layout typography trial · 2026-07-23
   Isolated hierarchy and spacing pass. Remove this stylesheet link to revert.
   ============================================================ */

:root {
  --v28-text-xs: 12px;
  --v28-text-sm: 14px;
  --v28-text-base: 16px;
  --v28-text-lg: 20px;
  --v28-text-xl: 24px;
  --v28-text-2xl: 32px;
  --v28-text-3xl: 40px;
  --v28-text-4xl: 56px;
  --v28-space-2: 16px;
  --v28-space-3: 24px;
  --v28-space-4: 32px;
  --v28-space-5: 40px;
  --v28-space-6: 48px;
  --v28-space-10: 80px;
  --v28-leading-tight: 1.2;
  --v28-leading-snug: 1.4;
  --v28-leading-normal: 1.6;
}

@media (min-width: 861px) {
  .hero__title-en {
    font-size: var(--v28-text-lg);
    line-height: var(--v28-leading-snug);
    letter-spacing: 0;
  }

  .hero__title-cn {
    margin-top: var(--v28-space-2);
    font-size: var(--v28-text-4xl);
    line-height: var(--v28-leading-tight);
    letter-spacing: 0;
  }

  .hero__lead {
    margin-top: var(--v28-space-3);
    font-size: var(--v28-text-base);
    line-height: var(--v28-leading-normal);
  }

  .hero__metrics {
    margin-top: var(--v28-space-5);
  }

  .hero__metrics b {
    font-size: var(--v28-text-lg);
    font-weight: 600;
  }

  .hero__metrics small {
    font-size: var(--v28-text-xs);
    font-weight: 400;
    letter-spacing: 0;
    opacity: .72;
  }

  .hero__primary {
    margin-top: var(--v28-space-6);
    font-size: var(--v28-text-base);
    letter-spacing: 0;
  }

  .hero__ticker {
    font-size: var(--v28-text-sm);
    letter-spacing: 0;
  }

  .hero__ticker span {
    opacity: .56;
  }

  html.v20-aurora-bg .value__title,
  .audience__title,
  .visual-sys__title,
  .timetable__title,
  .delivery__title,
  .video-carousel__head h2,
  .signup__title {
    font-size: var(--v28-text-3xl);
    line-height: var(--v28-leading-tight);
    letter-spacing: 0;
  }

  .value .wrap,
  .audience,
  .mentor,
  .timetable,
  .delivery,
  .signup {
    padding-top: var(--v28-space-10);
    padding-bottom: var(--v28-space-10);
  }

  .value__cards,
  .audience__content,
  .timetable__days,
  .delivery__grid {
    margin-top: var(--v28-space-6);
  }

  .value-card__num,
  .audience-item__num,
  .day-card__label,
  .deliver-card__hint,
  .model-photo__pair-head span,
  .cases__tag b {
    font-size: var(--v28-text-sm);
    letter-spacing: 0;
    opacity: .5;
  }

  .value-card h3,
  html.v20-aurora-bg .audience-item__body h3,
  .day-card h3,
  .deliver-card h3,
  .model-photo__pair-head strong {
    font-size: var(--v28-text-xl);
    line-height: 1.3;
    letter-spacing: 0;
  }

  .value-card p,
  .audience-item__body p,
  .mentor__bio,
  .day-card li {
    font-size: var(--v28-text-base);
    line-height: var(--v28-leading-normal);
  }

  .value-card,
  .day-card,
  .deliver-card {
    padding: var(--v28-space-4);
  }

  .audience__en {
    margin-top: var(--v28-space-2);
    font-size: var(--v28-text-base);
    line-height: var(--v28-leading-normal);
    opacity: .5;
  }

  .audience-item__body {
    gap: 12px;
  }

  html.v20-aurora-bg .audience-item,
  html.v20-aurora-bg .audience__list:has(.audience-item:hover) .audience-item:not(:hover),
  html.v20-aurora-bg .audience__list:has(.audience-item:focus) .audience-item:not(:focus) {
    opacity: 1 !important;
    visibility: visible !important;
  }

  html.v20-aurora-bg .audience-item:hover,
  html.v20-aurora-bg .audience-item:focus,
  html.v20-aurora-bg .audience-item.is-active {
    background: linear-gradient(90deg, rgba(255, 255, 255, .16), transparent 84%);
  }

  .mentor-tag {
    font-size: var(--v28-text-sm);
    letter-spacing: 0;
    opacity: .6;
  }

  .mentor__name {
    margin-bottom: var(--v28-text-lg);
    font-size: var(--v28-text-2xl);
    line-height: 1.3;
    letter-spacing: 0;
  }

  .visual-sys__copy {
    font-size: 18px;
    line-height: 1.5;
  }

  .day-card li + li {
    margin-top: 12px;
  }

  .delivery__sub {
    margin-top: var(--v28-space-2);
    font-size: 18px;
    line-height: var(--v28-leading-snug);
    opacity: .75;
  }

  .deliver-card__hint {
    line-height: 1.5;
  }

  .deliver-card h3 {
    margin-top: 12px;
  }

  .deliver-card p {
    margin-top: 12px;
    font-size: var(--v28-text-sm);
    line-height: var(--v28-leading-normal);
    opacity: .72;
  }

  .signup__sub {
    margin-top: var(--v28-space-3);
    font-size: var(--v28-text-base);
    line-height: var(--v28-leading-normal);
    opacity: .75;
  }

  .signup__scarcity {
    margin-top: var(--v28-space-4);
    font-size: var(--v28-text-sm);
    letter-spacing: 0;
  }

  .signup__status > span {
    font-size: var(--v28-text-xs);
    letter-spacing: 0;
    opacity: .5;
  }

  .signup__status strong {
    margin-top: 8px;
    font-size: var(--v28-text-xl);
    line-height: 1.3;
  }

  .signup__status p {
    margin-top: var(--v28-space-3);
    font-size: var(--v28-text-sm);
    line-height: var(--v28-leading-normal);
    opacity: .6;
  }
}

@media (max-width: 860px) {
  .hero__title-cn {
    font-size: 36px;
    line-height: var(--v28-leading-tight);
    letter-spacing: 0;
  }

  .hero__lead,
  .value-card p,
  .audience-item__body p,
  .day-card li {
    font-size: var(--v28-text-base);
    line-height: var(--v28-leading-normal);
  }

  html.v20-aurora-bg .value__title,
  .audience__title,
  .visual-sys__title,
  .timetable__title,
  .delivery__title,
  .video-carousel__head h2,
  .signup__title {
    font-size: 28px;
    line-height: var(--v28-leading-tight);
    letter-spacing: 0;
  }

  .value-card,
  .day-card,
  .deliver-card {
    padding: var(--v28-space-3);
  }

  .value-card h3,
  .audience-item__body h3,
  .day-card h3,
  .deliver-card h3 {
    font-size: var(--v28-text-lg);
    line-height: var(--v28-leading-snug);
    letter-spacing: 0;
  }

  .value-card__num,
  .audience-item__num,
  .day-card__label,
  .deliver-card__hint {
    font-size: var(--v28-text-sm);
    letter-spacing: 0;
    opacity: .55;
  }

  .day-card li + li {
    margin-top: 12px;
  }

  .delivery__sub,
  .signup__sub {
    font-size: var(--v28-text-base);
    line-height: var(--v28-leading-normal);
  }
}

/* V28 browser comments pass · 2026-07-23 */
.hero__nav {
  justify-content: flex-start;
}

.hero__menu,
.hero__cta,
.hero__edition,
.hero__title-en {
  display: none;
}

.distill__title {
  display: inline-block;
  width: fit-content;
  padding: 20px 26px;
  border: 1px solid rgba(255, 255, 255, .58);
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .27), rgba(255, 255, 255, .05) 48%, rgba(76, 169, 245, .12)),
    rgba(255, 255, 255, .12);
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, .88),
    inset 0 -12px 28px rgba(17, 79, 132, .08),
    0 18px 42px rgba(3, 29, 59, .12);
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
}

.value__title,
.audience__title {
  display: block;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.value__title span {
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.value__title .band {
  display: none;
}

html.v20-aurora-bg .value__cards {
  align-items: stretch;
}

html.v20-aurora-bg .value-card {
  height: 100%;
  margin: 0;
}

html.v20-aurora-bg .audience__visual[data-audience-visual="2"] {
  background: #071a31;
}

html.v20-aurora-bg .audience__visual[data-audience-visual="2"] img {
  object-fit: contain;
}

html.v20-aurora-bg .cases__title {
  display: grid;
  justify-items: start;
  width: min(100%, 1500px);
  margin: 0 auto var(--v28-space-6);
  padding-bottom: var(--v28-space-4);
  border-bottom: 1px solid var(--line);
  text-align: left;
}

html.v20-aurora-bg .cases__title .cases__foot-cn {
  max-width: 18em;
  margin-top: var(--v28-space-3);
  font-size: var(--v28-text-3xl);
  line-height: var(--v28-leading-tight);
  letter-spacing: 0;
}

html.v20-aurora-bg .cases__title .en-caps {
  width: fit-content;
  margin: 0;
  padding: 7px 13px;
  border: 1px solid rgba(255, 255, 255, .56);
  border-radius: 999px;
  background: rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .9), 0 8px 22px rgba(4, 31, 62, .1);
  font-size: var(--v28-text-xs);
  line-height: 1.5;
  opacity: 1;
  backdrop-filter: blur(10px) saturate(150%);
  -webkit-backdrop-filter: blur(10px) saturate(150%);
}

html.v20-aurora-bg .cases__grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--v28-space-3);
  width: min(100%, 1500px);
  margin-inline: auto;
}

html.v20-aurora-bg .cases__grid > div {
  grid-column: auto;
  margin-top: 0;
}

html.v20-aurora-bg .cases__grid .case-slot--a { grid-column: 1 / 5; }
html.v20-aurora-bg .cases__grid .case-slot--b { grid-column: 5 / 9; }
html.v20-aurora-bg .cases__grid .case-slot--c { grid-column: 9 / 13; }
html.v20-aurora-bg .cases__grid .case-slot--d { grid-column: 1 / 4; }
html.v20-aurora-bg .cases__grid .case-slot--e { grid-column: 4 / 7; }
html.v20-aurora-bg .cases__grid .case-slot--f { grid-column: 7 / 10; }
html.v20-aurora-bg .cases__grid .case-slot--g { grid-column: 10 / 13; }

html.v20-aurora-bg .cases__grid .slot-image,
html.v20-aurora-bg .cases__grid .case-slot--b .slot-image,
html.v20-aurora-bg .cases__grid .case-slot--f .slot-image {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

html.v20-aurora-bg .model-photo .mp-card__media {
  overflow: hidden;
  padding: 0;
}

html.v20-aurora-bg .model-photo .mp-card__media .slot-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

html.v20-aurora-bg .visual-sys,
html.v20-aurora-bg .distill {
  padding: var(--v28-space-10) 4vw;
}

html.v20-aurora-bg .visual-sys__intro,
html.v20-aurora-bg .distill__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr);
  gap: var(--v28-space-3) clamp(48px, 7vw, 120px);
  align-items: end;
  width: min(100%, 1500px);
  margin: 0 auto var(--v28-space-6);
  padding-bottom: var(--v28-space-4);
  border-bottom: 1px solid var(--line);
}

html.v20-aurora-bg .distill__title {
  align-self: start;
}

html.v20-aurora-bg .visual-sys__intro > .en-caps,
html.v20-aurora-bg .distill__head > .en-caps {
  grid-column: 1 / -1;
  width: fit-content;
  padding: 7px 13px;
  border: 1px solid rgba(255, 255, 255, .56);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .24), rgba(255, 255, 255, .04) 45%, rgba(96, 184, 255, .12)),
    rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .9), 0 8px 22px rgba(4, 31, 62, .1);
  backdrop-filter: blur(10px) saturate(150%);
  -webkit-backdrop-filter: blur(10px) saturate(150%);
}

html.v20-aurora-bg .visual-sys__title,
html.v20-aurora-bg .distill__title {
  display: block;
  width: auto;
  max-width: 12em;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font-size: var(--v28-text-3xl);
  line-height: var(--v28-leading-tight);
  letter-spacing: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html.v20-aurora-bg .visual-sys__copy-group,
html.v20-aurora-bg .distill__copy-group {
  display: grid;
  gap: var(--v28-space-2);
  align-self: end;
}

html.v20-aurora-bg .visual-sys__copy,
html.v20-aurora-bg .visual-sys__copy + .visual-sys__copy,
html.v20-aurora-bg .distill__lead,
html.v20-aurora-bg .distill__sub {
  max-width: 42em;
  margin: 0;
  font-family: var(--font-cn);
  font-size: var(--v28-text-base);
  font-weight: 400;
  line-height: var(--v28-leading-normal);
}

html.v20-aurora-bg .visual-sys__grid,
html.v20-aurora-bg .distill__grid {
  display: block;
  width: min(100%, 1500px);
  margin-inline: auto;
}

html.v20-aurora-bg .visual-sys__shots {
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr);
  gap: var(--v28-space-3);
}

html.v20-aurora-bg .distill__row {
  gap: var(--v28-space-3);
  margin-top: 0;
}

html.v20-aurora-bg .distill > .wrap {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: 0;
}

html.v20-aurora-bg .workflow-experience__head {
  width: min(100%, 1500px);
  padding: 0 0 var(--v28-space-4);
  border-bottom: 1px solid var(--line);
  text-align: left;
}

html.v20-aurora-bg .workflow-experience__lead {
  width: min(100%, 62em);
  margin: 0;
  font-size: var(--v28-text-lg);
  line-height: var(--v28-leading-normal);
}

html.v20-aurora-bg .model-studio__head,
html.v20-aurora-bg .portrait-lab__head,
html.v20-aurora-bg .category-flow__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr);
  gap: var(--v28-space-4) clamp(48px, 7vw, 120px);
  align-items: end;
  padding: 0 0 var(--v28-space-4);
  border-bottom: 1px solid var(--line);
}

html.v20-aurora-bg .model-studio__head .en-caps,
html.v20-aurora-bg .portrait-lab__head .en-caps,
html.v20-aurora-bg .category-flow__head > .en-caps {
  grid-column: 1 / -1;
  width: fit-content;
}

html.v20-aurora-bg .category-flow__head > .en-caps {
  padding: 7px 13px;
  border: 1px solid rgba(255, 255, 255, .56);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .24), rgba(255, 255, 255, .04) 45%, rgba(96, 184, 255, .12)),
    rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .9), 0 8px 22px rgba(4, 31, 62, .1);
  backdrop-filter: blur(10px) saturate(150%);
  -webkit-backdrop-filter: blur(10px) saturate(150%);
}

html.v20-aurora-bg .model-studio__head h3,
html.v20-aurora-bg .portrait-lab__head h3,
html.v20-aurora-bg .category-flow__title {
  max-width: 11em;
  margin: 0;
  font-size: var(--v28-text-3xl);
  line-height: var(--v28-leading-tight);
  letter-spacing: 0;
  text-align: left;
}

html.v20-aurora-bg .model-studio__head p,
html.v20-aurora-bg .portrait-lab__intro,
html.v20-aurora-bg .category-flow__copy {
  max-width: 38em;
  margin: 0;
  font-size: var(--v28-text-base);
  line-height: var(--v28-leading-normal);
}

html.v20-aurora-bg .video-generation__head {
  grid-template-columns: 1fr;
  align-items: start;
  padding-bottom: var(--v28-space-4);
  border-bottom: 1px solid var(--line);
}

html.v20-aurora-bg .video-generation__head h2 {
  margin-top: var(--v28-space-2);
  font-size: var(--v28-text-3xl);
  line-height: var(--v28-leading-tight);
  letter-spacing: 0;
}

html.v20-aurora-bg .prompt-video__head {
  grid-template-columns: 1fr;
  margin-bottom: var(--v28-space-4);
}

html.v20-aurora-bg .prompt-video__head h2 {
  max-width: none;
  margin: 0;
  font-size: var(--v28-text-4xl);
  line-height: var(--v28-leading-tight);
  letter-spacing: 0;
  white-space: nowrap;
}

html.v20-aurora-bg .prompt-video__demo figcaption {
  justify-content: flex-end;
}

html.v20-aurora-bg .site-building {
  padding-top: var(--v28-space-3);
}

html.v20-aurora-bg .site-building__head {
  align-items: start;
  margin-top: 0;
}

html.v20-aurora-bg .site-building__head > div:first-child {
  align-self: start;
}

/* V28 glass clarity pass · 2026-07-24 */
:root {
  --v8-vessel: color-mix(in srgb, var(--card) 11%, transparent);
  --v8-solid: color-mix(in srgb, var(--card) 48%, transparent);
}

html.v20-aurora-bg .promo-page > section:not([hidden]),
html.v20-aurora-bg .partners-title {
  background-color: color-mix(in srgb, var(--card) 20%, transparent);
}

html.v20-aurora-bg .hero__metrics > div,
html.v20-aurora-bg .value-card,
html.v20-aurora-bg .workflow-experience__signal,
html.v20-aurora-bg .signup__status,
html.v20-aurora-bg .logo-roller__item,
html.v20-aurora-bg .build-note {
  background: color-mix(in srgb, var(--card) 44%, transparent);
}

html.v20-aurora-bg .site-building__head {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .015) 50%, rgba(60, 158, 241, .05)),
    color-mix(in srgb, var(--card) 18%, transparent);
}

@media (min-width: 861px) {
  html.v20-aurora-bg .audience__title {
    font-size: var(--v28-text-4xl);
    line-height: var(--v28-leading-tight);
  }

  html.v20-aurora-bg .video-generation,
  html.v20-aurora-bg .video-carousel {
    padding-top: var(--v28-space-5);
  }
}

@media (max-width: 860px) {
  .distill__title {
    padding: 16px 18px;
    border-radius: 18px;
  }

  html.v20-aurora-bg .model-studio__head,
  html.v20-aurora-bg .portrait-lab__head,
  html.v20-aurora-bg .category-flow__head,
  html.v20-aurora-bg .visual-sys__intro,
  html.v20-aurora-bg .distill__head {
    grid-template-columns: 1fr;
    gap: var(--v28-space-3);
  }

  html.v20-aurora-bg .cases__title .cases__foot-cn {
    font-size: 28px;
  }

  html.v20-aurora-bg .cases__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--v28-space-2);
  }

  html.v20-aurora-bg .cases__grid > div {
    grid-column: auto !important;
  }

  html.v20-aurora-bg .visual-sys__shots,
  html.v20-aurora-bg .distill__row {
    grid-template-columns: 1fr;
  }

  html.v20-aurora-bg .visual-sys__shots .ui-frame--large {
    grid-column: auto;
    grid-row: auto;
  }

  html.js-motion .visual-sys__title[data-reveal="lines"] {
    overflow: visible;
  }

  html.js-motion .visual-sys__title[data-reveal="lines"] > span {
    white-space: normal;
  }

  html.v20-aurora-bg .prompt-video__head h2 {
    font-size: 36px;
    white-space: normal;
  }

  html.v20-aurora-bg .site-building {
    padding-top: var(--v28-space-2);
  }

  html.v20-aurora-bg .audience__title {
    font-size: 36px;
  }

  html.v20-aurora-bg .video-generation,
  html.v20-aurora-bg .video-carousel {
    padding-top: var(--v28-space-3);
  }
}
