.bruku-hero {
  position: relative;
  min-height: clamp(520px, 72vw, 760px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: #0b0b0b;
  color: #fff;
  isolation: isolate;
}
.bruku-hero-image {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.bruku-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(5,5,5,.88) 0%, rgba(5,5,5,.62) 48%, rgba(5,5,5,.18) 78%), linear-gradient(0deg, rgba(5,5,5,.72), transparent 58%);
}
.bruku-hero-content {
  width: min(100%, 1280px);
  margin: 0 auto;
  padding: clamp(76px, 11vw, 150px) clamp(20px, 5vw, 72px) clamp(56px, 8vw, 100px);
}
.bruku-hero .eyebrow { color: #f0dfaf; }
.bruku-hero h1 {
  max-width: 980px;
  margin: 15px 0 18px;
  font-size: clamp(48px, 7vw, 96px);
  line-height: .86;
  letter-spacing: -.065em;
}
.bruku-hero-meta {
  margin: 0 0 26px;
  color: rgba(255,255,255,.74);
  max-width: 760px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.72;
  letter-spacing: .01em;
}
.bruku-hero .btn {
  border-color: #c99a2f;
  background: #c99a2f;
  color: #111;
}
.bruku-hero .btn:hover { background: #fff; border-color: #fff; }
@media (max-width: 620px) {
  .bruku-hero { min-height: 620px; }
  .bruku-hero h1 { font-size: clamp(40px, 12vw, 62px); }
}