/* Extracted from BESONG_Group_Website/assets/css/styles.css — unit hero only */
:root {
  --navy-950: #061225;
  --orange-600: #ed5425;
  --orange-500: #f36434;
  --blue-600: #0062fe;
  --header-height: 84px;
  --container: 1560px;
}

.unit-hero .container {
  width: min(var(--container), calc(100% - 32px));
  margin-inline: auto;
}

.unit-hero .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 24px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 650;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease, border-color .22s ease;
}
.unit-hero .btn:hover { transform: translateY(-2px); }
.unit-hero .btn-orange { color: #fff; background: var(--orange-500); box-shadow: 0 12px 30px rgba(243, 100, 52, .28); }
.unit-hero .btn-orange:hover { background: var(--orange-600); }
.unit-hero .btn-ghost { color: #fff; border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.06); }
.unit-hero .btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,.12); }
.unit-hero .actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }

.page-hero.unit-hero {
  position: relative;
  min-height: 530px;
  padding: calc(var(--header-height) + 76px) 0 76px;
  overflow: hidden;
  color: #fff;
  background: var(--navy-950);
  display: block;
}
.page-hero.unit-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(90deg,rgba(5,17,38,.98) 0%,rgba(5,17,38,.84) 48%,rgba(5,17,38,.23) 100%), var(--page-image);
  background-size: cover;
  background-position: center;
}
.page-hero.unit-hero::after {
  content: '';
  position: absolute;
  left: -5%;
  right: -5%;
  bottom: -100px;
  height: 150px;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  background: #fff;
}
.page-hero.unit-hero .page-hero-inner {
  position: relative;
  z-index: 2;
  display: block;
  text-align: left;
  padding-bottom: 50px;
  grid-template-columns: none;
}
.page-hero.unit-hero .page-hero-inner h1,
.page-hero.unit-hero .page-hero-inner .unit-badge,
.page-hero.unit-hero .page-hero-inner .breadcrumb,
.page-hero.unit-hero .page-hero-inner .actions,
.page-hero.unit-hero .page-hero-inner .unit-hero-stats { margin-inline-start: 0; }
.page-hero.unit-hero .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
  margin-bottom: 30px;
  color: #aebed3;
  font-size: .82rem;
}
.page-hero.unit-hero .breadcrumb a { color: inherit; text-decoration: none; }
.page-hero.unit-hero .breadcrumb span { color: var(--orange-500); }
.page-hero.unit-hero h1 {
  margin: 0;
  font-size: clamp(3rem,6.3vw,6.4rem);
  line-height: .98;
  letter-spacing: -.05em;
  color: #fff;
  max-width: none;
}
.page-hero.unit-hero p {
  max-width: 700px;
  margin: 24px 0 0;
  color: #c6d3e6;
  font-size: 1.13rem;
}

.unit-hero { min-height: 670px; }
.unit-hero::before {
  background-image: linear-gradient(90deg,rgba(5,17,38,.98) 0%,rgba(5,17,38,.85) 50%,rgba(5,17,38,.24) 100%), var(--page-image);
}
.unit-badge {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
  color: #dce7f6;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.unit-badge strong {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  color: #fff;
  background: var(--unit-accent,var(--blue-600));
}
.unit-hero h1 span { color: var(--unit-accent,var(--orange-500)); }
.unit-hero-stats { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.unit-hero-stats span {
  padding: 9px 13px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  color: #d5e0ef;
  background: rgba(255,255,255,.06);
  font-size: .77rem;
}

@media (max-width: 900px) {
  .page-hero.unit-hero { min-height: 520px; }
  .page-hero.unit-hero h1 { font-size: clamp(2.7rem,13vw,4.6rem); }
  .unit-hero { min-height: 650px; }
}