/* A clearer brand mark, shorter eyebrow and quieter photographic hero. */
@media (min-width: 1101px) {
  .studio[data-page="/"] .header-inner { height: 82px; gap: clamp(24px, 3vw, 46px); }
  .studio[data-page="/"] .brand { width: 214px; height: 78px; display: flex; align-items: center; }
  .studio[data-page="/"] .hero-premium { height: calc(100svh - 82px); min-height: max(600px, calc(100svh - 82px)); }
  .studio[data-page="/"] .hero-premium h1 { max-width: 630px; }
}

.studio[data-page="/"] .hero-media img { object-position: 52% 54%; }
.studio[data-page="/"] .hero-premium::before {
  background:
    linear-gradient(90deg, rgba(6, 25, 35, .91) 0%, rgba(7, 28, 39, .78) 39%, rgba(7, 28, 39, .36) 82%, rgba(7, 28, 39, .31) 100%),
    linear-gradient(0deg, rgba(5, 20, 29, .61), transparent 42%);
}
.studio[data-page="/"] .hero-premium .eyebrow {
  gap: 13px;
  margin-bottom: 22px;
  font-size: 12px;
  line-height: 1.45;
  letter-spacing: .12em;
}
.studio[data-page="/"] .hero-premium .eyebrow::before { width: 27px; }

@media (max-width: 1100px) {
  .studio[data-page="/"] .header-inner { height: 76px; gap: 24px; }
  .studio[data-page="/"] .brand { width: 190px; height: 70px; display: flex; align-items: center; }
  .studio[data-page="/"] #main-nav { top: 76px; }
  .studio[data-page="/"] .menu-backdrop { inset: 77px 0 0; }
  .studio[data-page="/"] .hero-premium { height: calc(100svh - 76px); min-height: max(600px, calc(100svh - 76px)); }
}

@media (max-width: 760px) {
  .studio[data-page="/"] .header-inner { height: 72px; }
  .studio[data-page="/"] .brand { width: 174px; height: 66px; }
  .studio[data-page="/"] #main-nav { top: 72px; }
  .studio[data-page="/"] .menu-backdrop { inset: 73px 0 0; }
  .studio[data-page="/"] .hero-premium { height: calc(100svh - 72px); min-height: 570px; max-height: none; }
  .studio[data-page="/"] .hero-premium .eyebrow { font-size: 10px; letter-spacing: .11em; margin-bottom: 20px; }
  .studio[data-page="/"] .hero-media img { object-position: 59% center; }
}

@media (max-width: 420px) {
  .studio[data-page="/"] .brand { width: 158px; }
  .studio[data-page="/"] .hero-premium .eyebrow { font-size: 9px; letter-spacing: .09em; }
}
