/* ============================================================
   PAGE HERO
   ============================================================ */

.bee-page-hero {
   position: relative;

   display: flex;
   align-items: flex-end;

   overflow: hidden;

   min-height: 320px;

   padding:
      calc(var(--bee-space-2xl) * 2) 0 calc(var(--bee-space-2xl) * 1.4);

   background:
      linear-gradient(180deg,
         var(--bee-dark-soft) 0%,
         var(--bee-dark) 100%);

   isolation: isolate;
}

/* ============================================================
   Background
   ============================================================ */

.bee-page-hero__background {
   position: absolute;
   inset: 0;

   z-index: 1;
}

.bee-page-hero__background img {
   width: 100%;
   height: 100%;

   object-fit: cover;

   opacity: 0.38;

   transform: scale(1.05);

   filter:
      saturate(1) contrast(1.05) brightness(0.7);
}

/* ============================================================
   Overlay
   ============================================================ */

.bee-page-hero__overlay {
   position: absolute;
   inset: 0;

   z-index: 2;

   background: linear-gradient(180deg, rgba(2, 16, 31, 0.18) 0%, rgba(2, 16, 31, 0.42) 35%, rgba(2, 16, 31, 0.72) 75%, rgba(2, 16, 31, 0.92) 100%), radial-gradient(circle at top right, rgba(255, 219, 27, 0.10), transparent 35%), radial-gradient(circle at left center, rgba(127, 212, 255, 0.10), transparent 40%);
}

/* ============================================================
   Golden Ambient Glow
   ============================================================ */

.bee-page-hero__glow {
   position: absolute;

   top: -20%;
   right: -10%;

   width: 700px;
   height: 700px;

   border-radius: 50%;

   background:
      radial-gradient(circle,
         rgba(255, 219, 27, 0.10) 0%,
         transparent 70%);

   z-index: 1;

   pointer-events: none;
}

/* ============================================================
   Container
   ============================================================ */

.bee-page-hero .bee-container {
   position: relative;
   z-index: 5;

   width: 100%;
}

/* ============================================================
   Breadcrumb
   ============================================================ */

.bee-breadcrumb {
   display: inline-flex;
   align-items: center;
   gap: var(--bee-space-xs);

   padding:
      12px 18px;

   margin-bottom: var(--bee-space-xl);

   border:
      1px solid rgba(255, 255, 255, 0.08);

   border-radius:
      var(--bee-radius-pill);

   background:
      rgba(255, 255, 255, 0.04);

   backdrop-filter:
      blur(12px);

   color: var(--bee-text-muted);

   font-size: var(--bee-text-sm);
   font-weight: 600;

   letter-spacing: 0.08em;
   text-transform: uppercase;
}

.bee-breadcrumb a {
   color: var(--bee-text-muted);

   transition:
      color var(--bee-duration-base) var(--bee-ease);
}

.bee-breadcrumb a:hover {
   color: var(--bee-gold);
}

.bee-breadcrumb__separator {
   opacity: 0.3;
}

.bee-breadcrumb__current {
   color: var(--bee-gold);
}

/* ============================================================
   Content
   ============================================================ */

.bee-page-hero__content {
   position: relative;

   max-width: 920px;

   z-index: 5;
}

/* ============================================================
   Eyebrow
   ============================================================ */

.bee-page-hero__eyebrow {
   display: inline-block;

   margin-bottom: var(--bee-space-md);

   color: var(--bee-gold);

   font-size: var(--bee-text-sm);
   font-weight: 700;

   letter-spacing: 0.22em;
   text-transform: uppercase;
}

/* ============================================================
   Title
   ============================================================ */

.bee-page-hero__title {
   margin: 0;

   color: #fff;

   font-size:
      clamp(4rem, 8vw, 4rem);

   font-weight: 600;

   line-height: 0.92;

   letter-spacing: -0.06em;

   text-wrap: balance;

   text-shadow:
      0 10px 30px rgba(0, 0, 0, 0.45);
}

/* ============================================================
   Description
   ============================================================ */

.bee-page-hero__description {
   margin-top: var(--bee-space-xl);

   max-width: 720px;

   color: var(--bee-text-muted);

   font-size: var(--bee-text-lg);

   line-height: 1.8;
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 991px) {

   .bee-page-hero {
      min-height: 420px;

      padding:
         calc(var(--bee-space-3xl) * 1.5) 0 var(--bee-space-3xl);
   }

   .bee-page-hero__title {
      font-size:
         clamp(3rem, 10vw, 5rem);
   }
}

@media (max-width: 767px) {

   .bee-page-hero {
      padding-top: 6rem;
      padding-bottom: 3rem;
      min-height: 315px;
   }

   .bee-page-hero__title {
      line-height: 1;
   }



   .bee-breadcrumb {
      padding: 6px 12px;
      margin-bottom:
         var(--bee-space-lg);
   }
}