/* 冷白展厅 / 炭黑文字 / 单一电光蓝：全站最终主题。 */
:root,
body.home-page {
  color-scheme: light;
  --bg: #f7f8fa;
  --surface: #eff0f3;
  --text: #202124;
  --muted: #61646d;
  --accent: #2341f0;
  --line: #20212428;
  background: var(--bg);
  color: var(--text);
}
::selection { background: #2341f0; color: #fff; }
body { background: var(--bg); }
.skip-link { color: #fff; }
.lang-switch { background: #ffffff80; }
.lang-btn.is-active { color: #fff; background: var(--accent); }
.brand-symbol { color: var(--accent); }
.live-dot { background: var(--accent); box-shadow: none; }
.button { background: var(--accent); color: #fff; border-radius: 0; }
.button:hover { background: #172eb6; color: #fff; }
.ghost { border-color: #20212460; }
.ghost:hover { color: var(--accent); border-color: var(--accent); }
.site-footer { border-color: var(--line); }

/* 首屏用超大字与留白制造尺度，蓝色曲面像展厅里的悬置作品。 */
.home-page.composition .sidebar { border-bottom: 1px solid var(--line); }
.home-page.composition .hero {
  min-height: 850px;
  padding-top: 165px;
  padding-bottom: 125px;
}
.home-page.composition .hero-copy { max-width: 1200px; width: 100%; }
.home-page.composition .hero-kicker { color: var(--muted); margin-bottom: 42px; font-size: 12px; }
.home-page.composition .hero h1 {
  font-size: clamp(70px, 8.4vw, 134px);
  line-height: 1.03;
  max-width: 1200px;
  font-weight: 500;
  letter-spacing: -.07em;
}
.home-page.composition .hero h1 > em {
  color: var(--accent);
  font-weight: 400;
  margin-left: 6%;
}
.home-page.composition .hero-description { max-width: 405px; margin-top: 40px; line-height: 1.8; }
.home-page.composition .hero-art {
  right: -2%;
  top: 34%;
  width: 51%;
  height: 60%;
  opacity: .85;
  mask-image: linear-gradient(90deg, transparent, #000 18%, #000 94%, transparent);
}
.aurora-haze { display: none; }
.orbit-label { color: var(--accent); }
.home-page.composition .hero-bottom { border-top: 1px solid var(--line); font-size: 11px; }
.home-page.composition .button { border-radius: 0; }
.home-page.composition .section-index { color: var(--accent); }
.home-page.composition .section-head h3 { font-weight: 400; letter-spacing: -.065em; }
.home-page.composition #projects > .section-head { margin-bottom: 65px; }
.home-page.composition .project-info .folio { color: var(--accent); }
.home-page.composition .project-info h4 { color: var(--text); }
.home-page.composition .card-actions .button {
  background: transparent;
  color: var(--text);
  border-color: #20212480;
}
.home-page.composition .card-actions .button:hover { color: var(--accent); border-color: var(--accent); }
.home-page.composition .card-actions .ghost { color: var(--muted); }
.home-page.composition .card-actions .ghost:hover { color: var(--accent); }

/* 封面像同一场展览的不同作品，只有主色的深浅与正负形变化。 */
.case-cover { border-radius: 0; }
.cover-potemkin { --cover-bg: #e9ebef; --cover-ink: #202124; }
.cover-starmax { --cover-bg: #2341f0; --cover-ink: #fff; }
.cover-quickaid { --cover-bg: #e9ebef; --cover-ink: #202124; }
.cover-soulspirit { --cover-bg: #242529; --cover-ink: #f7f8fa; }
.cover-cybermaster { --cover-bg: #e6eaff; --cover-ink: #2341f0; }
.memory-node { background: #fff; border-color: #20212426; box-shadow: 0 8px 18px #20212408; }
.node-core { background: #dce1ef; }
.node-long { color: #fff; background: var(--accent); border-color: var(--accent); }
.memory-thread { background: #2341f066; }
.memory-caption { color: var(--accent); }
.decision-active { background: #fff; color: #2341f0; }
.care-diagram { color: var(--accent); }
.care-options { color: var(--text); }
.taste-choices span { border-color: #ffffff60; }
.taste-choices span:nth-child(2) { background: #fff; color: #242529; }
.home-page.composition .project-card:hover .case-cover,
.home-page.composition .project-card:focus-within .case-cover { box-shadow: 0 20px 45px #2021240c; }
.home-page.composition .project-grid > .project-card:nth-child(2) .case-cover {
  transform: rotate(-1.4deg);
  transform-origin: 50% 100%;
  transition: transform .8s var(--ease), box-shadow .8s var(--ease);
}
.home-page.composition .project-grid > .project-card:nth-child(2):hover .case-cover,
.home-page.composition .project-grid > .project-card:nth-child(2):focus-within .case-cover { transform: rotate(0); }
.home-page.composition #playground > .section-head .section-index { color: var(--accent); }
.home-page.composition .contact {
  color: #fff;
  background: var(--accent);
  padding-top: 70px;
  padding-bottom: 85px;
}
.home-page.composition .contact > .section-index { color: #fff; }
.home-page.composition .contact h3 { color: #fff; }
.home-page.composition .contact p { color: #e6eaff; }
.home-page.composition .contact p a { color: #fff; border-color: #ffffff80; }
.home-page.composition .contact-arrow { color: #fff; }

/* 开场是电光蓝的揭幕，文字保持静定，离场时整块幕布向上收起。 */
.opening {
  background: #2341f0;
  color: #fff;
  clip-path: inset(0 0 0 0);
  transition: clip-path .75s cubic-bezier(.76, 0, .24, 1);
}
.opening::backdrop { background: transparent; }
.opening.is-exiting { opacity: 1; filter: none; transform: none; clip-path: inset(0 0 100% 0); }
.opening h2 { color: #fff; font-weight: 500; }
.opening h2 span { color: #fff; }
.opening-symbol { color: #fff; }
.opening-kicker, .opening-sub, .opening #opening-hint { color: #edf0ff; }
.opening-corner, .opening-corner span, .opening-bottom { color: #edf0ff; }
.opening-line { background: #ffffff40; }
.opening-line span { background: #fff; }
.opening-actions button { border: 1px solid #ffffff65; border-radius: 0; color: #fff; background: transparent; }
.opening-actions button.is-active { color: #2341f0; background: #fff; border-color: #fff; }
.opening-actions button:hover { color: #2341f0; background: #fff; border-color: #fff; }
.opening button:focus-visible { outline-color: #fff; }
.opening-skip { color: #fff; }
.opening-skip:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
.opening-space { background: none; }
.opening-space i,
.opening-space i:nth-child(2),
.opening-space i:nth-child(3),
.opening-space i:nth-child(4) { border-color: #ffffff1f; box-shadow: none; }
.opening-space i:nth-child(2) { border-color: #ffffff40; }
.detail-page .detail-header { border-color: var(--line); }
.detail-page .detail-sub, .detail-page .tech-line { color: var(--accent); }
.detail-page .button { color: #fff; }
.detail-page .ghost { color: var(--text); }
.detail-page .video-wrap { background: #e9ebef; border-color: var(--line); }
html[lang=zh-CN] .home-page.composition .hero h1 {
  font-size: clamp(64px, 8vw, 120px);
  line-height: 1.18;
  max-width: 1200px;
}
html[lang=zh-CN] .home-page.composition .contact h3 { font-family: 'Songti SC', 'STSong', serif; font-style: normal; }
@media(max-width:1000px) and (min-width:681px) {
  .home-page.composition .hero { min-height: 830px; }
  .home-page.composition .hero h1 { font-size: 8.7vw; }
  .home-page.composition .hero-art { top: 40%; right: -4%; width: 58%; opacity: .65; }
}
@media(max-width:680px) {
  .home-page.composition .hero { min-height: 800px; padding-top: 195px; padding-bottom: 130px; }
  .home-page.composition .hero-kicker { font-size: 11px; margin-bottom: 30px; }
  .home-page.composition .hero h1 { font-size: clamp(38px, 8.6vw, 60px); line-height: 1.15; }
  .home-page.composition .hero h1 > em { margin-left: 3%; }
  .home-page.composition .hero-description { margin-top: 33px; max-width: 95%; font-size: 15px; }
  .home-page.composition .hero-art { top: 40%; right: -7%; width: 75%; height: 53%; opacity: .2; }
  .home-page.composition .hero-bottom { font-size: 11px; }
  .home-page.composition .contact { padding: 38px 8% 48px; }
  .home-page.composition .contact h3 { font-size: 44px; }
  .home-page.composition .project-grid > .project-card:nth-child(2) .case-cover { transform: rotate(-.7deg); }
  html[lang=zh-CN] .home-page.composition .hero h1 { font-size: clamp(36px, 8.8vw, 62px); line-height: 1.3; }
}
@media(prefers-reduced-motion:reduce) {
  .opening { transition: none; }
  .home-page.composition .project-grid > .project-card:nth-child(2) .case-cover { transform: none; }
}
/* XxXaurora 文字标识：高低交错的 XxX 与紧凑字身组成固定签名。 */
.brand-lockup { display: inline-flex; align-items: baseline; gap: 0; font-family: 'Space Grotesk', Arial, sans-serif; font-weight: 700; line-height: 1; letter-spacing: -.065em; white-space: nowrap; }
.brand-lockup .logo-prefix { color: var(--accent); letter-spacing: -.115em; margin-right: .075em; }
.brand-lockup .logo-cross { display: inline-block; font-size: .84em; transform: translateY(.025em); transition: transform .6s var(--ease); }
.brand-lockup .logo-name { color: var(--text); }
.brand-lockup .logo-stop { display: inline-block; width: .095em; height: .095em; background: var(--accent); margin-left: .11em; }
.brand-lockup:hover .logo-cross, .brand-lockup:focus-visible .logo-cross { transform: translateY(-.025em) rotate(180deg); }
.home-page.composition .wordmark { font-size: 34px; font-weight: 700; letter-spacing: -.065em; }
.detail-page .detail-brand { font-size: 34px; font-weight: 700; letter-spacing: -.065em; }
.opening .opening-symbol { display: none; }
.opening .opening-kicker { margin-bottom: 22px; }
.opening h2.brand-lockup { display: inline-flex; font-size: clamp(72px, 14vw, 220px); font-weight: 700; letter-spacing: -.065em; line-height: 1.1; margin: 12px 0 30px; }
.opening h2.brand-lockup .logo-prefix, .opening h2.brand-lockup .logo-name, .opening h2.brand-lockup .logo-cross { color: #fff; }
.opening h2.brand-lockup .logo-stop { background: #fff; }
.site-footer { display: grid; grid-template-columns: 1fr auto auto; column-gap: 35px; row-gap: 32px; padding: 38px 0 28px; }
.site-footer .footer-brand { grid-column: 1 / -1; width: fit-content; font-size: clamp(70px, 14.5vw, 220px); line-height: 1; font-weight: 700; letter-spacing: -.065em; padding-bottom: 20px; }
.site-footer .footer-brand .logo-prefix { color: var(--accent); }
.site-footer .footer-brand .logo-name { color: var(--text); }
.site-footer .footer-brand .logo-stop { background: var(--accent); }
@media(min-width:681px) and (max-width:1050px) { .home-page.composition .wordmark { font-size: 28px; } .home-page.composition .sidebar { gap: 24px; } }
@media(max-width:680px) { .home-page.composition .wordmark, .detail-page .detail-brand { font-size: 29px; } .opening h2.brand-lockup { font-size: 14vw; } .opening .opening-kicker { font-size: 10px; letter-spacing: .8px; } .site-footer { grid-template-columns: 1fr auto; gap: 20px; } .site-footer .footer-brand { font-size: 14vw; padding-bottom: 8px; } }
