/* =========================================================
   Hero block
   ========================================================= */
.hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(64px, 12vw, 140px) clamp(48px, 8vw, 90px);
  isolation: isolate;
}

.hero__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11, 16, 28, 0.55) 0%, rgba(11, 16, 28, 0.88) 100%);
  z-index: -1;
}

.hero__inner { max-width: 760px; }

.hero__breadcrumb { margin-bottom: var(--space-lg); }

.hero__rating {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  background: rgba(240, 74, 79, 0.15);
  border: 1px solid rgba(240, 74, 79, 0.4);
  border-radius: var(--radius-pill);
  padding: 0.5em 1.1em;
  margin-bottom: var(--space-lg);
}

.hero__rating-stars { color: #ffb100; letter-spacing: 2px; font-size: var(--font-size-sm); }
.hero__rating-text { color: var(--color-white); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); }

.hero__title { margin-bottom: var(--space-md); }

.hero__subtitle {
  color: var(--color-text-primary);
  font-size: clamp(15px, 1.6vw, 18px);
  max-width: 62ch;
}

.hero__cta { margin-top: var(--space-xl); }