.is-ghx-scenes { background: #0d0d0d; }
.ghxs-study { --ghxs-space: clamp(48px, 6vw, 112px); font-family: var(--sans); color: #fff; }
.ghxs-study figure, .ghxs-study h1, .ghxs-study h2, .ghxs-study p { margin: 0; }
.ghxs-study img, .ghxs-study video { display: block; width: 100%; height: auto; }
.ghxs-study section { display: block; min-height: 0; }
.ghxs-hero { position: relative; }
.ghxs-hero > img { aspect-ratio: 2.5; object-fit: cover; }
.ghxs-body { width: 80%; max-width: 1600px; margin-inline: auto; display: grid; gap: var(--ghxs-space); padding-block: var(--ghxs-space); }
.ghxs-copy { max-width: 860px; }
.ghxs-copy h1, .ghxs-copy h2 { font-size: clamp(26px, 3vw, 48px); line-height: 1.08; text-transform: uppercase; font-weight: 700; letter-spacing: -.025em; margin-bottom: 24px; }
.ghxs-copy p { font-size: clamp(14px, 1.05vw, 18px); line-height: 1.7; color: #c7c7c7; }
.ghxs-copy p + p { margin-top: 16px; }
.ghxs-film { position: relative; }
.ghxs-film figcaption { position: absolute; bottom: 20px; left: 20px; padding: 8px 12px; background: #111d; font-size: 13px; }
.ghxs-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ghxs-gallery > figure:not(.ghxs-wide) img { aspect-ratio: 16/9; object-fit: cover; }
.ghxs-wide { grid-column: 1/-1; }
.ghxs-two, .ghxs-comparison { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.ghxs-three { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.ghxs-process { display: grid; gap: 32px; }
.ghxs-process video { aspect-ratio: 16/9; object-fit: contain; background: #080808; cursor: pointer; }
.ghxs-process video:focus-visible { outline: 2px solid #e37e38; outline-offset: 3px; }
.ghxs-process figcaption { font-size: 12px; line-height: 1.5; color: #a4a4a4; padding-top: 10px; }
.ghxs-ending img { max-height: 70vh; object-fit: cover; }
.ghxs-footer { width: 80%; max-width: 1600px; margin-inline: auto; padding-block: var(--ghxs-space); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 24px; }
.ghxs-footer > a:last-child { color: #aaa; font-size: 13px; }
@media (max-width: 700px) {
  .ghxs-body, .ghxs-footer { width: 90%; }
  .ghxs-hero > img { aspect-ratio: 16/10; }
  .ghxs-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .ghxs-two, .ghxs-three { grid-template-columns: 1fr; gap: 20px; }
  .ghxs-comparison { gap: 8px; }
  .ghxs-process figcaption { font-size: 10px; }
}
