.room-page {
  min-height: 100vh;
  color: var(--cream);
  background: var(--ink);
}
.room-page .site-header { background: rgba(10,9,18,.82); border-bottom-color: var(--night-line); border-top: 1px solid rgba(255,255,255,.4); }
.room-page .brand-copy, .room-page .site-nav a { color: var(--cream); }
.room-page .site-nav a { opacity: .68; }
.room-page .site-nav a[aria-current="page"] { opacity: 1; color: var(--gold-pale); }
.room-page .menu-button { color: var(--cream); border-color: var(--night-line); background: transparent; }
.room-hero {
  position: relative;
  min-height: calc(100vh - 80px);
  display: grid;
  align-items: end;
  overflow: hidden;
  background: url("../images/run-up-studio-concept-v1.jpg") center / cover no-repeat;
}
.room-studio .room-hero { background-image: url("../images/v3/room-studio.webp"); }
.room-resonance .room-hero { background-image: url("../images/v3/room-resonance.webp"); }
.room-atelier .room-hero { background-image: url("../images/v3/room-atelier.webp"); }
.room-contact .room-hero { background-image: url("../images/v3/room-contact.webp"); }
.room-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,9,18,.94), rgba(10,9,18,.62) 50%, rgba(10,9,18,.18)); }
.room-hero-inner { position: relative; width: min(var(--max-width), calc(100% - 64px)); margin: 0 auto; padding: 120px 0 84px; }
.room-kicker { color: var(--gold-bright); text-transform: uppercase; letter-spacing: .24em; font-size: 10px; }
.room-hero h1 { max-width: 900px; margin: 16px 0; font: 500 clamp(72px, 11vw, 160px)/.78 var(--serif); letter-spacing: -0.04em; }
.room-hero p { max-width: 610px; color: rgba(246,239,225,.82); font-size: 16px; text-wrap: pretty; }
.room-actions { display: flex; gap: 12px; margin-top: 30px; }
.room-note { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 70px; border: 1px solid var(--night-line); background: var(--night-line); }
.room-note div { min-height: 120px; padding: 24px; background: rgba(10,9,18,.84); }
.room-note strong { display: block; color: var(--gold-pale); font: 500 24px var(--serif); }
.room-note span { color: rgba(246,239,225,.8); font-size: 11px; }
@media (max-width:760px) {
  .room-hero-inner { width: min(100% - 28px, var(--max-width)); padding: 90px 0 40px; }
  .room-hero h1 { font-size: clamp(62px, 22vw, 96px); }
  .room-note { grid-template-columns: 1fr; }
  .room-actions { flex-direction: column; }
}

/* ===== Room Pages Polish ===== */

/* 优化房间 hero 的进入动画 */
.room-hero {
  animation: room-fade-in 1.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes room-fade-in {
  from {
    opacity: 0;
    transform: scale(1.02);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* 房间文字淡入优化 */
.room-hero-inner {
  animation: room-content-fade 1.4s cubic-bezier(0.22, 1, 0.36, 1) 0.2s both;
}

@keyframes room-content-fade {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 按钮优雅过渡 */
.room-actions .button,
.room-actions .button-line {
  transition:
    transform 500ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 500ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.room-actions .button:hover {
  transform: translateY(-2px) scale(1.01) !important;
}

.room-actions .button-line:hover {
  transform: translateY(-2px) scale(1.01) !important;
}

/* ===== 胶片颗粒(静态 feTurbulence) ===== */
/* 暗底必须用 screen——soft-light/overlay 在纯黑上不起作用 */
/* 按区块加,不用 fixed 全屏,避免盖住视频控件和弹层 */
.room-showcase { position: relative; }
.room-hero::after,
.room-showcase::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .07;
  mix-blend-mode: screen;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E") 0 0 / 280px 280px;
}
