/* =====================================================
   ABOUT US BANNER
===================================================== */

.aboutBanner {
  position: relative;
  display: flex;
  align-items: flex-end;
  padding: 60px 0 60px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.aboutBannerImage,
.aboutBannerOverlay {
  position: absolute;
  inset: 0;
}

.aboutBannerImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.aboutBannerOverlay {
  background:
    linear-gradient(90deg, rgba(4, 26, 56, .9) 0%, rgba(4, 26, 56, .7) 42%, rgba(4, 26, 56, .12) 78%),
    linear-gradient(0deg, rgba(4, 26, 56, .35), transparent 55%);
}

.aboutBanner .container {
  position: relative;
  z-index: 1;
}

.aboutBannerContent {
  max-width: 650px;
}

.aboutBanner .beLabel {
  color: var(--be-gold-light);
}

.aboutBanner .beLabel::before {
  background: var(--be-gold-light);
}

.aboutBanner h1 {
  margin-bottom: 18px;
  color: var(--be-white);
  font-size: 48px;
}

.aboutBanner p {
  max-width: 510px;
  margin-bottom: 0;
  color: rgba(255, 255, 255, .78);
  font-size: 14px;
  line-height: 1.8;
}

@media (min-width: 768px) {
  .aboutBanner {
    padding: 80px 0 80px;
  }

  .aboutBanner p {
    font-size: 16px;
  }
}

@media (min-width: 992px) {
  .aboutBanner {
    padding: 90px 0 90px;
  }

  .aboutBannerImage {
    object-position: center 42%;
  }
}


.breadcumSection {
  padding: 14px 0;
  border-bottom: 1px solid var(--be-border);
  background: var(--be-paper);
}

.breadcumSection ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.breadcumSection li {
  display: flex;
  align-items: center;
  color: var(--be-muted);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .1em;
}

.breadcumSection li+li::before {
  content: "/";
  margin-right: 8px;
  color: var(--be-gold);
  font-size: 13px;
  font-weight: 400;
}

.breadcumSection li:last-child {
  color: var(--be-primary);
}

.breadcumSection a {
  color: var(--be-muted);
}

.breadcumSection a:hover {
  color: var(--be-gold-dark);
}


/* =====================================================
   ABOUT IMPACT
===================================================== */

.beAboutImpact {
  padding: var(--be-section-space) 0;
  background: var(--be-ivory);
}

.beAboutImpactHead {
  display: grid;
  gap: 18px;
  margin-bottom: 34px;
}

.beAboutImpactHead h2 {
  margin-bottom: 0;
}

.beAboutImpactHead h2 em {
  color: var(--be-gold-dark);
  font-style: normal;
}

.beAboutImpactHead>p {
  max-width: 100%;
  margin: 0;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.75;
}

.beAboutImpactGrid {
  display: grid;
  border-top: 1px solid var(--be-border);
  border-left: 1px solid var(--be-border);
}

.beImpactItem {
  min-height: 242px;
  padding: 27px 23px;
  border-right: 1px solid var(--be-border);
  border-bottom: 1px solid var(--be-border);
  background: rgba(255, 255, 255, .28);
  transition: var(--be-transition);
}

.beImpactItem:hover {
  background: var(--be-paper);
}

.beImpactNo {
  display: block;
  margin-bottom: 35px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
}

.beImpactItem h3 {
  margin-bottom: 12px;
  color: var(--be-primary);
  font-size: 25px;
}

.beImpactItem p {
  margin-bottom: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.7;
}

/* =====================================================
   ENTREPRENEURSHIP RECOGNITION
===================================================== */

.beEntrepreneurRecognition {
  position: relative;
  overflow: hidden;
  padding: var(--be-section-space) 0;
  background: var(--be-primary-dark);
}


.beEntrepreneurRecognition .container {
  position: relative;
  z-index: 1;
}

.beEntrepreneurRecognitionBox {
  display: grid;
  gap: 26px;
}

.beEntrepreneurRecognition .beSectionLabel {
  color: var(--be-gold-light);
}

.beEntrepreneurRecognition .beSectionLabel span {
  background: var(--be-gold-light);
}

.beEntrepreneurRecognition h2 {
  max-width: 610px;
  margin-bottom: 0;
  color: var(--be-white);
}

/* .beEntrepreneurRecognitionContent {
  max-width: 570px;
} */

.beEntrepreneurRecognitionContent p {
  color: rgba(255, 255, 255, .7);
  font-size: 16px;
  line-height: 1.8;
}

.beEntrepreneurRecognitionContent .beBtn {
  margin-top: 8px;
}

.beEntrepreneurRecognitionContent .beBtn span {
  font-size: 17px;
  line-height: 1;
}

@media (min-width: 768px) {
  .beAboutImpactGrid {
    grid-template-columns: repeat(3, 1fr);
  }

  .beImpactItem {
    min-height: 285px;
    padding: 33px 27px;
  }
}

@media (min-width: 992px) {
  .beAboutImpactHead {
    grid-template-columns: 0.75fr 1.25fr;
    gap: 50px;
    margin-bottom: 48px;
  }

  .beImpactItem {
    min-height: 300px;
    padding: 38px 30px;
  }

  .beImpactItem h3 {
    font-size: 28px;
  }

  .beEntrepreneurRecognitionBox {
    grid-template-columns: 0.75fr 1.25fr;
    align-items: start;
    gap: 50px;
  }
}



.brandImpactSection {
  position: relative;
  padding: 60px 0;
  overflow: hidden;
  background: var(--be-paper);
}

.brandImpactGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 35px;
}

.brandImpactContent {
  max-width: 100%;
}

.brandImpactLabel {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.brandImpactLabel::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.brandImpactContent h2 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 31px;
  line-height: 1.17;
  font-weight: 400;
}

.brandImpactContent h2 em {
  display: block;
  color: var(--be-gold);
  font-weight: 400;
}

.brandImpactContent p {
  max-width: 100%;
  margin: 15px 0 0;
  color: #686e77;
  font-size: 14px;
  line-height: 1.8;
}

.brandImpactStats {
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid rgba(0, 31, 63, 0.15);
  border-left: 1px solid rgba(0, 31, 63, 0.15);
}

.brandImpactStat {
  position: relative;
  min-height: 135px;
  padding: 24px;
  overflow: hidden;
  border-right: 1px solid rgba(0, 31, 63, 0.15);
  border-bottom: 1px solid rgba(0, 31, 63, 0.15);
  transition: 0.35s ease;
}

.brandImpactStat::before {
  content: "";
  position: absolute;
  right: -35px;
  bottom: -35px;
  width: 85px;
  height: 85px;
  background: rgba(212, 179, 109, 0.08);
  border-radius: 50%;
  transition: 0.35s ease;
}

.brandImpactStat strong {
  position: relative;
  z-index: 1;
  display: block;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 38px;
  line-height: 1;
  font-weight: 400;
}

.brandImpactStat strong sup {
  position: relative;
  top: -9px;
  margin-left: 2px;
  color: var(--be-gold);
  font-size: 17px;
}

.brandImpactStat span {
  position: relative;
  z-index: 1;
  display: block;
  max-width: 210px;
  margin-top: 12px;
  color: #686e77;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
}

@media (min-width: 576px) {
  .brandImpactStats {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .brandImpactSection {
    padding: 80px 0;
  }

  .brandImpactContent h2 {
    font-size: 36px;
  }

  .brandImpactContent p {
    font-size: 15px;
  }

  .brandImpactStat {
    min-height: 145px;
    padding: 28px;
  }

  .brandImpactStat strong {
    font-size: 43px;
  }
}

@media (min-width: 992px) {
  .brandImpactSection {
    padding: 90px 0;
  }

  .brandImpactGrid {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 40px;
  }

  .brandImpactContent h2 {
    font-size: 36px;
  }
}

@media (hover: hover) {
  .brandImpactStat:hover {
    background: var(--be-primary-dark);
    box-shadow: 0 15px 35px rgba(0, 31, 63, 0.12);
    transform: translateY(-3px);
  }

  .brandImpactStat:hover strong {
    color: var(--be-white);
  }

  .brandImpactStat:hover span {
    color: rgba(255, 255, 255, 0.72);
  }

  .brandImpactStat:hover::before {
    background: rgba(212, 179, 109, 0.15);
    transform: scale(1.5);
  }
}

/* =====================================================
   WHY BRAND EMPOWER AWARDS
===================================================== */

.beAboutWhy {
  position: relative;
  overflow: hidden;
  padding: var(--be-section-space) 0;
  background: var(--be-ivory);
}

.beAboutWhy .container {
  position: relative;
  z-index: 1;
}

.beAboutWhyHead {
  display: grid;
  gap: 18px;
  margin-bottom: 35px;
}

.beAboutWhyHead h2 {
  margin-bottom: 0;
}

.beAboutWhyHead>p {
  max-width: 100%;
  margin: 0;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.75;
}

.beAboutWhyGrid {
  display: grid;
  border-top: 1px solid var(--be-border);
  border-left: 1px solid var(--be-border);
}

.beAboutWhyCard {
  position: relative;
  min-height: 235px;
  padding: 27px 22px;
  border-right: 1px solid var(--be-border);
  border-bottom: 1px solid var(--be-border);
  background: rgba(255, 253, 248, .52);
  transition: var(--be-transition);
}

.beAboutWhyCard:hover {
  z-index: 1;
  background: var(--be-paper);
  box-shadow: 0 12px 28px rgba(4, 26, 56, .07);
  transform: translateY(-4px);
}

.beAboutWhyIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 47px;
  height: 47px;
  margin-bottom: 25px;
  border: 1px solid rgba(185, 141, 58, .45);
  color: var(--be-gold-dark);
}

.beAboutWhyIcon svg {
  width: 28px;
  height: 28px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.beAboutWhyCard h3 {
  margin-bottom: 11px;
  color: var(--be-primary);
  font-size: 25px;
}

.beAboutWhyCard p {
  max-width: 300px;
  margin-bottom: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.7;
}

@media (min-width: 576px) {
  .beAboutWhyGrid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 992px) {
  .beAboutWhyHead {
    grid-template-columns: 0.75fr 1.25fr;
    align-items: center;
    gap: 50px;
    margin-bottom: 48px;
  }

  .beAboutWhyGrid {
    grid-template-columns: repeat(3, 1fr);
  }

  .beAboutWhyCard {
    padding: 34px 29px;
  }

  .beAboutWhyCard h3 {
    font-size: 27px;
  }
}

/* =====================================================
   ABOUT — SUCCESSFUL EVENTS
===================================================== */

.beAboutEvents {
  padding: var(--be-section-space) 0;
  background: var(--be-paper);
  position: relative;
}

.beAboutEventsHead {
  margin-bottom: 34px;
  display: grid;
  grid-template-columns: 0.75fr 1.25fr;
  gap: 50px;
}

.beAboutEventsHead h2 {
  margin-bottom: 0;
  font-size: 42px;
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
}

.beAboutEventsHeadRight {
  margin-top: 18px;
}

.beAboutEventsHeadRight p {
  margin-bottom: 0;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.8;
}

.beAboutEventsSliderWrap {
  position: relative;
}

.beAboutEventsSlider {
  padding-bottom: 48px;
  overflow: hidden;
}

.beAboutEventsPrev,
.beAboutEventsNext {
  position: absolute;
  z-index: 5;
  top: calc(50% - 24px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--be-border);
  border-radius: 0;
  background: var(--be-paper);
  color: var(--be-primary);
  box-shadow: 0 6px 18px rgba(4, 26, 56, 0.12);
  transition: var(--be-transition);
}

.beAboutEventsPrev {
  left: -22px;
}

.beAboutEventsNext {
  right: -22px;
}

.beAboutEventsPrev:hover,
.beAboutEventsNext:hover {
  border-color: var(--be-primary);
  background: var(--be-primary);
  color: var(--be-white);
}

.beAboutEventsPrev svg,
.beAboutEventsNext svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.beAboutEventCard {
  display: block;
  height: 100%;
  overflow: hidden;
  background: var(--be-ivory);
  border: 1px solid var(--be-border);
  margin-bottom: 30px;
}

.beAboutEventImage {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1/1;
  background: var(--be-primary-dark);
}

.beAboutEventImage::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(4, 26, 56, 0.48));
  content: "";
}

.beAboutEventImage img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.6s ease;
}

.beAboutEventCard:hover .beAboutEventImage img {
  transform: scale(1.05);
}

.beAboutEventImage span {
  position: absolute;
  z-index: 1;
  top: 13px;
  left: 13px;
  padding: 7px 9px;
  background: var(--be-gold);
  color: var(--be-primary-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
}

.beAboutEventContent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  /* min-height: 180px; */
  padding: 20px 18px;
}

.beAboutEventContent small {
  display: block;
  margin-bottom: 8px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-transform: uppercase;
}

.beAboutEventContent h3 {
  margin-bottom: 10px;
  color: var(--be-primary);
  font-size: 24px;
  line-height: 1.13;
}

.beAboutEventContent p {
  margin-bottom: 16px;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.65;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.beAboutEventContent i {
  display: inline-flex;
  gap: 8px;
  margin-top: auto;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--be-gold);
  color: var(--be-primary);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.1em;
  transition: var(--be-transition);
}

.beAboutEventContent i b {
  font-size: 15px;
  font-weight: 400;
  line-height: 0.7;
}

.beAboutEventCard:hover .beAboutEventContent i {
  gap: 12px;
  color: var(--be-gold-dark);
}

.beAboutEventsPagination {
  bottom: 0 !important;
  line-height: 1;
}

.beAboutEventsPagination .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  margin: 0 5px !important;
  border-radius: 10px;
  opacity: 1;
  background: var(--be-border);
  transition: var(--be-transition);
}

.beAboutEventsPagination .swiper-pagination-bullet-active {
  width: 28px;
  background: var(--be-gold);
}

@media (min-width: 768px) {
  .beAboutEventsHead {
display: grid;
  grid-template-columns: 0.75fr 1.25fr;
    gap: 50px;
    margin-bottom: 46px;
  }

  .beAboutEventsHeadRight {
    margin-top: 0;
  }

  .beAboutEventContent {
    padding: 22px 20px;
  }
}

@media (min-width: 992px) {
  .beAboutEventContent h3 {
    font-size: 25px;
  }
}

@media (max-width: 767px) {

  .beAboutEventsPrev,
  .beAboutEventsNext {
    display: none;
  }
}


/* =====================================================
   AWARDS BANNER
===================================================== */

.awardsBanner {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.awardsBannerImage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.awardsBannerOverlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 26, 56, 0.96) 0%, rgba(4, 26, 56, 0.82) 42%, rgba(4, 26, 56, 0.26) 75%, rgba(4, 26, 56, 0.1) 100%),
    linear-gradient(0deg, rgba(4, 26, 56, 0.32), rgba(4, 26, 56, 0.08));
}

.awardsBanner .container {
  position: relative;
  z-index: 1;
}

.awardsBannerContent {
  max-width: 670px;
  padding: 80px 0 80px;
}

.awardsBanner .beLabel {
  margin-bottom: 18px;
  color: var(--be-gold-light);
}

.awardsBanner .beLabel::before {
  background: var(--be-gold);
}

.awardsBanner h1 {
  margin-bottom: 20px;
  color: var(--be-white);
}

.awardsBanner p {
  max-width: 540px;
  margin-bottom: 28px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 15px;
  line-height: 1.8;
}

.awardsBannerActions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.awardsBanner .beBtnOutline {
  border-color: rgba(255, 255, 255, 0.55);
  color: var(--be-white);
}

.awardsBanner .beBtnOutline:hover {
  border-color: var(--be-white);
  background: var(--be-white);
  color: var(--be-primary-dark);
}

@media (min-width: 768px) {
  .awardsBannerContent {
    padding: 90px 0 90px;
  }

  .awardsBanner p {
    font-size: 16px;
  }
}

@media (min-width: 992px) {

  .awardsBannerContent {
    padding: 90px 0 90px;
  }
}

@media (max-width: 767px) {
  .awardsBannerImage {
    object-position: 62% center;
  }
}


/* =====================================================
   AWARDS EDITORIAL LISTING
===================================================== */

.awardsEditorialSection {
  padding: var(--be-section-space) 0;
  background:
    radial-gradient(circle at 5% 5%, rgba(185, 141, 58, 0.12), transparent 24%),
    var(--be-paper);
}

.awardsEditorialIntro {
  padding-bottom: 32px;
  border-bottom: 1px solid var(--be-border);
}

.awardsEditorialEyebrow,
.awardsEditorialLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold-dark);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}

.awardsEditorialEyebrow::before,
.awardsEditorialLabel::before {
  width: 20px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.awardsEditorialIntro h2 {
  max-width: 650px;
  margin: 12px 0 0;
  font-size: 42px;
}

.awardsEditorialIntroText {
  margin-top: 20px;
}

.awardsEditorialIntroText p {
  max-width: 100%;
  margin-bottom: 16px;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.75;
  text-align: justify;
}

.awardsEditorialIntroText span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--be-primary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.awardsEditorialIntroText i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--be-gold);
}

.awardsEditorialList {
  padding-top: 34px;
}

.awardsEditorialItem {
  display: grid;
  gap: 28px;
  padding: 0 0 34px;
  margin-bottom: 34px;
  border-bottom: 1px solid var(--be-border);
}

.awardsEditorialMedia {
  position: relative;
  min-height: 254px;
  padding: 11px 13px 17px 0;
}

.awardsEditorialFrame {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: calc(100% - 23px);
  height: calc(100% - 27px);
  border: 1px solid var(--be-gold);
}

.awardsEditorialMainImage {
  position: relative;
  z-index: 1;
  display: block;
  width: calc(100% - 15px);
  /* height: 222px; */
  overflow: hidden;
  /* background: var(--be-primary-dark);
  box-shadow: 13px 14px 0 var(--be-primary); */
}

.awardsEditorialMainImage img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.6s ease;
}

.awardsEditorialItem:hover .awardsEditorialMainImage img {
  transform: scale(1.06);
}


.awardsEditorialNo {
  position: absolute;
  z-index: 4;
  top: 21px;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 37px;
  background: var(--be-gold);
  color: var(--be-white);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.awardsEditorialImageText {
  position: absolute;
  z-index: 4;
  bottom: -2px;
  left: 0;
  padding: 8px 11px;
  background: var(--be-paper);
  color: var(--be-primary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.awardsEditorialContent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.awardsEditorialContent h3 {
  margin: 12px 0 13px;
  font-size: 20px;
  line-height: 1.1;
}

.awardsEditorialContent h3 a {
  color: var(--be-primary);
}

.awardsEditorialContent h3 a:hover {
  color: var(--be-gold-dark);
}

.awardsEditorialContent p {
  /* max-width: 550px; */
  margin-bottom: 21px;
  color: var(--be-muted);
  font-size: 13px;
  line-height: 1.75;
}

.awardsEditorialBottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 22px;
  width: 100%;
  margin-top: auto;
}

.awardsEditorialLink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--be-primary);
  font-size: 14px;
  font-weight: 700;
}

.awardsEditorialLink b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--be-primary);
  color: var(--be-white);
  transition: var(--be-transition);
}

.awardsEditorialLink svg,
.awardsEditorialCta a svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.awardsEditorialItem:hover .awardsEditorialLink b {
  background: var(--be-gold);
  color: var(--be-primary-dark);
  transform: translateX(3px);
}

.awardsEditorialBottom small {
  color: var(--be-muted);
  font-size: 14px;
  font-weight: 700;
}

.awardsEditorialCta {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 44px;
  padding: 28px 22px;
  overflow: hidden;
  background:
    radial-gradient(circle at 96% 90%, transparent 0 44px, rgba(185, 141, 58, 0.42) 45px 46px, transparent 47px),
    var(--be-primary-dark);
}

.awardsEditorialCta>div>span {
  display: block;
  margin-bottom: 8px;
  color: var(--be-gold-light);
  font-size: 12px;
  font-weight: 700;
}

.awardsEditorialCta h3 {
  max-width: 630px;
  margin: 0;
  color: var(--be-white);
  font-size: 26px;
  line-height: 1.15;
}

.awardsEditorialCta p {
  display: block;
  margin-bottom: 8px;
  color: var(--be-gold-light);
  font-size: 12px;
  font-weight: 700;
}

.awardsEditorialCta>a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  align-self: flex-start;
  min-height: 43px;
  padding: 11px 16px;
  background: var(--be-gold);
  color: var(--be-primary-dark);
  font-size: 12px;
  font-weight: 700;
}

.awardsEditorialCta>a:hover {
  background: var(--be-white);
}


/* TABLET */
@media (min-width: 768px) {
  .awardsEditorialIntro {
    display: grid;
    grid-template-columns: 0.75fr 1.25fr;
    gap: 50px;
    padding-bottom: 44px;
  }

  .awardsEditorialIntroText {
    margin-top: 0;
  }

  .awardsEditorialList {
    padding-top: 48px;
  }

  .awardsEditorialItem {
    grid-template-columns: minmax(330px, 0.97fr) minmax(0, 1.03fr);
    align-items: center;
    gap: 55px;
    padding-bottom: 45px;
    margin-bottom: 45px;
  }

  .awardsEditorialItemReverse .awardsEditorialMedia {
    order: 2;
  }

  .awardsEditorialItemReverse .awardsEditorialContent {
    order: 1;
  }

  .awardsEditorialMedia {
    min-height: 300px;
  }

  /* .awardsEditorialMainImage {
    height: 260px;
  } */



  .awardsEditorialContent h3 {
    font-size: 32px;
  }

  .awardsEditorialCta {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 33px 38px;
  }
}


/* DESKTOP */
@media (min-width: 992px) {
  .awardsEditorialItem {
    grid-template-columns: minmax(410px, 0.25fr) minmax(0, 1.05fr);
    gap: 76px;
  }

  .awardsEditorialItem.awardsEditorialItemReverse {
    grid-template-columns: minmax(0, 1.05fr) minmax(410px, 0.25fr);
  }


  .awardsEditorialMedia {
    min-height: 355px;
    padding: 14px 20px 22px 0;
  }

  .awardsEditorialMainImage {
    width: calc(100% - 22px);
    /* height: 400px;
    box-shadow: 18px 18px 0 var(--be-primary);*/
  }



  .awardsEditorialNo {
    top: 28px;
    width: 48px;
    height: 42px;
  }

  .awardsEditorialContent h3 {
    font-size: 36px;
  }

  .awardsEditorialContent p {
    font-size: 16px;
  }
}

.geaDetailSlider {
  position: relative;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.geaDetailSlide {
  position: relative;
  overflow: hidden;
}

.geaDetailSlide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.geaDetailSliderOverlay {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(4, 26, 56, 0.98) 0%,
      rgba(4, 26, 56, 0.88) 36%,
      rgba(4, 26, 56, 0.4) 67%,
      rgba(4, 26, 56, 0.12) 100%),
    linear-gradient(180deg,
      transparent 55%,
      rgba(4, 26, 56, 0.6) 100%);
  background: linear-gradient(90deg,
      rgba(4, 26, 56, 0.98) 0%,
      rgba(4, 26, 56, 0.88) 36%,
      rgba(4, 26, 56, 0.38) 58%,
      transparent 75%);
}

.geaDetailSlider>.container {
  position: absolute;
  z-index: 3;
  top: 50%;
  right: 0;
  left: 0;
  pointer-events: none;
  transform: translateY(-50%);
}

.geaDetailSliderContent {
  max-width: 680px;
  pointer-events: auto;
}

.geaDetailSliderContent>span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  color: var(--be-gold-light);
  font-size: 16px;
  font-weight: 600;
}

.geaDetailSliderContent>span::before {
  width: 27px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.geaDetailSliderContent .geaDetailSliderContentTitle {
  margin-bottom: 18px;
  color: var(--be-white);
  font-size: 42px;
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.03em;
}

.geaDetailSliderContent p {
  margin-bottom: 27px;
  color: rgba(255, 255, 255, 0.82);
  font-family: var(--be-heading-font);
  font-size: 19px;
}

.geaDetailSliderContent>a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 13px 20px;
  background: var(--be-gold);
  color: var(--be-primary-dark);
  font-size: 14px;
  font-weight: 700;
}

.geaDetailSliderContent>a:hover {
  background: var(--be-white);
}

.geaDetailSliderContent>a svg,
.geaDetailSliderPrev svg,
.geaDetailSliderNext svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaDetailSliderPrev,
.geaDetailSliderNext {
  position: absolute;
  z-index: 5;
  top: 50%;
  display: none;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.38);
  background: rgba(4, 26, 56, 0.48);
  color: var(--be-white);
  backdrop-filter: blur(6px);
  transform: translateY(-50%);
  transition: var(--be-transition);
}

.geaDetailSliderPrev {
  left: 22px;
}

.geaDetailSliderNext {
  right: 22px;
}

.geaDetailSliderPrev:hover,
.geaDetailSliderNext:hover {
  border-color: var(--be-gold);
  background: var(--be-gold);
  color: var(--be-primary-dark);
}

.geaDetailSliderPagination {
  position: absolute;
  z-index: 5;
  bottom: 22px !important;
  left: 50% !important;
  width: auto !important;
  line-height: 1;
  transform: translateX(-50%);
}

.geaDetailSliderPagination .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  margin: 0 5px !important;
  border-radius: 10px;
  opacity: 1;
  background: rgba(255, 255, 255, 0.5);
  transition: var(--be-transition);
}

.geaDetailSliderPagination .swiper-pagination-bullet-active {
  width: 28px;
  background: var(--be-gold);
}

@media (min-width: 768px) {
  .geaDetailSlider {}

  .geaDetailSliderContent .geaDetailSliderContentTitle {
    font-size: 36px;
  }

  .geaDetailSliderContent p {
    font-size: 23px;
  }
}

@media (min-width: 1200px) {
  .geaDetailSlider {}

  .geaDetailSliderContent .geaDetailSliderContentTitle {
    font-size: 42px;
  }

  .geaDetailSliderPrev,
  .geaDetailSliderNext {
    display: inline-flex;
  }
}




/* =====================================================
   GEA INTRODUCTION STORY
===================================================== */

.geaIntroStorySection {
  position: relative;
  overflow: hidden;
  padding: var(--be-section-space) 0;
  background:
    radial-gradient(circle at 100% 15%, rgba(185, 141, 58, 0.1), transparent 24%),
    var(--be-paper);
}

.geaIntroStorySectionTitle {
  margin-bottom: 12px;
}

.geaIntroStoryGrid {
  display: grid;
  gap: 48px;
}

.geaIntroStoryVisual {
  position: relative;
  padding: 13px 14px 30px 0;
}

.geaIntroStoryFrame {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(100% - 20px);
  height: calc(100% - 35px);
  border: 1px solid var(--be-gold);
}

.geaIntroStoryImage {
  position: relative;
  z-index: 1;
  min-height: 390px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.geaIntroStoryImage::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
      transparent 55%,
      rgba(4, 26, 56, 0.58) 100%);
  content: "";
}

.geaIntroStoryImage img {
  width: 100%;
  height: 100%;
  min-height: 390px;
  object-fit: cover;
  transition: transform 0.7s ease;
}

.geaIntroStoryVisual:hover .geaIntroStoryImage img {
  transform: scale(1.035);
}

.geaIntroStoryBadge {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 225px;
  padding: 17px 19px;
  background: var(--be-primary-dark);
  color: var(--be-white);
  box-shadow: 0 15px 35px rgba(4, 26, 56, 0.18);
}

.geaIntroStoryBadge strong {
  color: var(--be-gold-light);
  font-family: var(--be-heading-font);
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
}

.geaIntroStoryBadge span {
  padding-left: 13px;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
}

.geaIntroStorySince {
  position: absolute;
  z-index: 3;
  top: 32px;
  left: 0;
  display: flex;
  flex-direction: column;
  padding: 11px 14px;
  background: var(--be-gold);
  color: var(--be-primary-dark);
}

.geaIntroStorySince span {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.13em;
  line-height: 1;
  text-transform: uppercase;
}

.geaIntroStorySince strong {
  margin-top: 4px;
  font-family: var(--be-heading-font);
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

.geaIntroStoryLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.15em;
  line-height: 1.2;
  text-transform: uppercase;
}

.geaIntroStoryLabel::before {
  width: 25px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.geaIntroStorySection h2 {
  max-width: 680px;
  margin-bottom: 15px;
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
  font-size: 32px;
}

.geaIntroStorySection h2 em {
  color: var(--be-gold-dark);
  font-style: italic;
}


.geaIntroStorySection h3 {
  max-width: 680px;
  margin-bottom: 12px;
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
  font-size: 28px;
}

.geaIntroStorySection h3 em {
  color: var(--be-gold-dark);
  font-style: italic;
}


.geaIntroStorySection h4 {
  max-width: 680px;
  margin-bottom: 12px;
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
  font-size: 24px;
}

.geaIntroStorySection h4 em {
  color: var(--be-gold-dark);
  font-style: italic;
}


.contentScroll {
  max-height: 500px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 12px;
  scrollbar-width: thin;
  scrollbar-color: #b98d3a transparent;
}

.contentScroll::-webkit-scrollbar {
  width: 4px;
}

.contentScroll::-webkit-scrollbar-track {
  background: transparent;
}

.contentScroll::-webkit-scrollbar-thumb {
  background: #b98d3a;
  border-radius: 10px;
}

.contentScroll::-webkit-scrollbar-thumb:hover {
  background: #082a5a;
}

.geaIntroStoryContent h2 {
  max-width: 680px;
  margin-bottom: 22px;
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
  font-size: 32px;
}

.geaIntroStoryContent h2 em {
  color: var(--be-gold-dark);
  font-style: italic;
}

.geaIntroStoryContent h2 strong {
  font-weight: 400;
}

.geaIntroStoryContent h3 {
  max-width: 680px;
  margin-bottom: 22px;
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
  font-size: 28px;
}

.geaIntroStoryContent h3 em {
  color: var(--be-gold-dark);
  font-style: italic;
}

.geaIntroStorySection p {
  text-align: left;
}

.geaIntroStoryContent p {
  max-width: 650px;
  color: var(--be-text);
  font-size: 16px;
  line-height: 1.82;
}

.geaIntroStoryContent ul {
  list-style: none;
  padding: 0;
  margin: 15px 0 25px;
  counter-reset: awards;
}

.geaIntroStoryContent ul li {
  position: relative;
  padding: 10px 15px 10px 35px;
  margin-bottom: 10px;
  background: #faf7f0;
  /* border-left: 2px solid #b98d3a; */
  color: #39465a;
  font-size: 15px;
  line-height: 1.7;
  transition: all 0.3s ease;
}

.geaIntroStoryContent ul li::before {
  content: "✦";
  position: absolute;
  left: 10px;
  top: 12px;
  color: #b98d3a;
  font-size: 15px;
}

.geaIntroStoryContent ul li:last-child {
  margin-bottom: 0;
}



.geaIntroStoryContent .geaIntroStoryLead {
  color: var(--be-text);
  font-size: 16px;
  line-height: 1.75;
}

.geaIntroStoryQuote {
  position: relative;
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 13px;
  margin-top: 27px;
  padding: 20px 18px;
  border-left: 3px solid var(--be-gold);
  background: var(--be-ivory);
}

.geaIntroStoryQuote svg {
  width: 25px;
  height: 25px;
  fill: var(--be-gold);
}

.geaIntroStoryQuote p {
  margin: 0;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 22px;
  line-height: 1.45;
}

.geaIntroStoryValues {
  display: grid;
  margin-top: 54px;
  border-top: 1px solid var(--be-border);
  border-left: 1px solid var(--be-border);
}

.geaIntroStoryValue {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 13px;
  padding: 22px 18px;
  border-right: 1px solid var(--be-border);
  border-bottom: 1px solid var(--be-border);
  transition: var(--be-transition);
}

.geaIntroStoryValue:hover {
  background: var(--be-ivory);
}

.geaIntroStoryValue>span {
  color: var(--be-gold-dark);
  font-family: var(--be-heading-font);
  font-size: 18px;
  line-height: 1;
}

.geaIntroStoryValue .geaIntroStoryValueTitle {
  margin-bottom: 7px;
  color: var(--be-primary);
  font-size: 20px;
  line-height: 1.2;
}

.geaIntroStoryValue p {
  margin: 0;
  color: var(--be-muted);
  font-size: 15px;
  line-height: 1.7;
}


/* TABLET */
@media (min-width: 768px) {

  .geaIntroStoryImage,
  .geaIntroStoryImage img {
    min-height: 480px;
  }

  .geaIntroStoryValues {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 65px;
  }

  .geaIntroStoryValue {
    padding: 26px 21px;
  }
}


/* DESKTOP */
@media (min-width: 992px) {
  .geaIntroStorySection p {
    text-align: justify;
  }

  .geaIntroStoryGrid {
    grid-template-columns: minmax(400px, 0.94fr) minmax(0, 1.06fr);
    gap: 55px;
  }

  .geaIntroStoryImage,
  .geaIntroStoryImage img {
    min-height: 540px;
  }

  .geaIntroStoryContent .geaIntroStoryLead {
    font-size: 17px;
  }

  .geaIntroStoryQuote {
    padding: 23px 21px;
  }

  .geaIntroStoryQuote p {
    font-size: 19px;
  }

  .geaIntroStoryValue {
    grid-template-columns: 42px 1fr;
    padding: 30px 26px;
  }
}


/* =====================================================
   GEA UPCOMING EDITION
===================================================== */

.geaNextEditionSection {
  position: relative;
  overflow: hidden;
  padding: var(--be-section-space) 0;
  background:
    radial-gradient(circle at 92% 10%, rgba(185, 141, 58, 0.12), transparent 25%),
    var(--be-ivory);
}

.geaNextEditionCard {
  overflow: hidden;
  border: 1px solid var(--be-border);
  background: var(--be-paper);
  box-shadow: 0 24px 60px rgba(4, 26, 56, 0.09);
}

.geaNextEditionVisual {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.geaNextEditionVisual img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  transition: transform 0.7s ease;
}

.geaNextEditionCard:hover .geaNextEditionVisual img {
  transform: scale(1.035);
}

.geaNextEditionOverlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(4, 26, 56, 0.08), rgba(4, 26, 56, 0.76)),
    linear-gradient(90deg, rgba(4, 26, 56, 0.25), transparent);
}

.geaNextEditionStatus {
  position: absolute;
  z-index: 2;
  top: 20px;
  left: 20px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  background: var(--be-gold);
  color: var(--be-primary-dark);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
}

.geaNextEditionStatus i {
  position: relative;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--be-primary);
}

.geaNextEditionStatus i::after {
  position: absolute;
  inset: -4px;
  border: 1px solid var(--be-primary);
  border-radius: 50%;
  content: "";
  opacity: 0.45;
  animation: geaNextEditionPulse 1.8s infinite;
}

@keyframes geaNextEditionPulse {
  0% {
    opacity: 0.5;
    transform: scale(0.7);
  }

  100% {
    opacity: 0;
    transform: scale(1.5);
  }
}

.geaNextEditionYear {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  min-width: 142px;
  padding: 18px 21px;
  background: var(--be-primary-dark);
  border-top: 2px solid var(--be-gold);
  color: var(--be-white);
}

.geaNextEditionYear small {
  display: block;
  margin-bottom: 4px;
  color: var(--be-gold-light);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.2em;
}

.geaNextEditionYear strong {
  font-family: var(--be-heading-font);
  font-size: 39px;
  font-weight: 400;
  line-height: 1;
}

.geaNextEditionContent {
  padding: 30px 20px;
}

.geaNextEditionLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.15em;
  line-height: 1;
  text-transform: uppercase;
}

.geaNextEditionLabel::before {
  width: 24px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.geaNextEditionContent .geaNextEditionContentTitle {
  max-width: 650px;
  margin-bottom: 15px;
  font-size: 32px;
}

.geaNextEditionContent .geaNextEditionContentTitle em {
  color: var(--be-gold-dark);
  font-style: italic;
}

.geaNextEditionContent>p {
  max-width: 670px;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.8;
}

.geaNextEditionDetails {
  display: grid;
  margin-top: 28px;
  border-top: 1px solid var(--be-border);
  border-left: 1px solid var(--be-border);
}

.geaNextEditionDetail {
  display: grid;
  grid-template-columns: 39px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 83px;
  padding: 15px;
  border-right: 1px solid var(--be-border);
  border-bottom: 1px solid var(--be-border);
  transition: var(--be-transition);
}

.geaNextEditionDetail:hover {
  background: var(--be-ivory);
}

.geaNextEditionIcon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 39px;
  height: 39px;
  border: 1px solid rgba(185, 141, 58, 0.45);
  color: var(--be-gold-dark);
}

.geaNextEditionIcon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaNextEditionDetail small {
  display: block;
  margin-bottom: 6px;
  color: var(--be-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-transform: uppercase;
}

.geaNextEditionDetail strong {
  display: block;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.25;
}

.geaNextEditionActions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 13px 20px;
  margin-top: 28px;
}

.geaNextEditionPrimary,
.geaNextEditionEnquiry {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.geaNextEditionPrimary {
  gap: 9px;
  padding: 13px 19px;
  background: var(--be-gold);
  border: 1px solid var(--be-gold);
  color: var(--be-primary-dark);
}

.geaNextEditionPrimary:hover {
  background: var(--be-primary);
  border-color: var(--be-primary);
  color: var(--be-white);
}

.geaNextEditionPrimary svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaNextEditionEnquiry {
  padding: 13px 0 8px;
  border-bottom: 1px solid var(--be-gold);
  color: var(--be-primary);
}

.geaNextEditionEnquiry:hover {
  color: var(--be-gold-dark);
}

.geaNextEditionContent .geaNextEditionNotice {
  display: flex;
  gap: 6px;
  margin-top: 20px;
  margin-bottom: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.55;
}

.geaNextEditionNotice span {
  color: var(--be-gold-dark);
}


/* TABLET */
@media (min-width: 768px) {
  .geaNextEditionDetails {
    grid-template-columns: repeat(2, 1fr);
  }

  .geaNextEditionContent {
    padding: 42px 36px;
  }

  .geaNextEditionVisual,
  .geaNextEditionVisual img {
    min-height: 470px;
  }
}


/* DESKTOP */
@media (min-width: 992px) {
  .geaNextEditionCard {
    display: grid;
    grid-template-columns: minmax(380px, 0.9fr) minmax(0, 1.1fr);
    align-items: stretch;
  }

  .geaNextEditionVisual,
  .geaNextEditionVisual img {
    min-height: 500px;
    max-height: 500px;
  }

  .geaNextEditionContent {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 30px 32px;
  }

  .geaNextEditionDetails {
    margin-top: 22px;
  }

  .geaNextEditionDetail {
    min-height: 75px;
    padding: 15px;
  }

  .geaNextEditionDetail strong {
    font-size: 18px;
  }
}



/* =====================================================
   GEA AWARD CATEGORIES
===================================================== */

.geaCategoryMatrixSection {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: var(--be-section-space) 0;
  background:
    radial-gradient(circle at 6% 8%, rgba(185, 141, 58, 0.13), transparent 23%),
    radial-gradient(circle at 96% 90%, rgba(18, 63, 120, 0.42), transparent 28%),
    var(--be-primary-dark);
}


.geaCategoryMatrixSection .container {
  position: relative;
  z-index: 2;
}


/* =====================================================
   SECTION HEADING
===================================================== */

.geaCategoryMatrixHead {
  margin-bottom: 34px;
  grid-template-columns: .75fr 1.25fr;
  gap: 50px;
}

.geaCategoryMatrixLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--be-gold-light);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.15em;
  line-height: 1;
  text-transform: uppercase;
}

.geaCategoryMatrixLabel::before {
  width: 25px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.geaCategoryMatrixHead .geaCategoryMatrixHeadTitle {
  max-width: 680px;
  margin: 0;
  color: var(--be-white);
  font-size: 48px;
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.025em;
}

.geaCategoryMatrixHead .geaCategoryMatrixHeadTitle em {
  color: var(--be-gold-light);
  font-style: italic;
}

.geaCategoryMatrixHead>p {
  max-width: 490px;
  margin: 18px 0 0;
  color: rgba(255, 255, 255, 0.64);
  font-size: 14px;
  line-height: 1.8;
}


/* =====================================================
   CATEGORY GRID
===================================================== */

.geaCategoryMatrixGrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  border-left: 1px solid rgba(255, 255, 255, 0.14);
}


/* =====================================================
   CATEGORY CARD
===================================================== */

.geaCategoryMatrixCard {
  position: relative;
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) 28px;
  align-items: start;
  gap: 14px;
  min-height: 164px;
  padding: 24px 17px;
  overflow: hidden;
  border-right: 1px solid rgba(255, 255, 255, 0.14);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.025);
  transition:
    background 0.35s ease,
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

/* .geaCategoryMatrixCard::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 3px;
  background: var(--be-gold);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.geaCategoryMatrixCard::after {
  position: absolute;
  top: -35px;
  right: -35px;
  width: 90px;
  height: 90px;
  border: 1px solid rgba(185, 141, 58, 0.11);
  border-radius: 50%;
  content: "";
  transition: var(--be-transition);
}
*/
.geaCategoryMatrixCard:hover {
  z-index: 2;
  background: rgba(255, 255, 255, 0.075);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.16);
  transform: translateY(-3px);
}

.geaCategoryMatrixCard:hover::before {
  transform: scaleX(1);
}

.geaCategoryMatrixCard:hover::after {
  border-color: rgba(185, 141, 58, 0.35);
  transform: scale(1.15);
}


/* =====================================================
   CATEGORY NUMBER
===================================================== */

.geaCategoryMatrixNumber {
  position: absolute;
  z-index: 1;
  top: 10px;
  right: 12px;
  color: rgba(255, 255, 255, 0.27);
  font-family: var(--be-heading-font);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1;
}


/* =====================================================
   CATEGORY ICON
===================================================== */

.geaCategoryMatrixIcon {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border: 1px solid rgba(185, 141, 58, 0.48);
  background: rgba(185, 141, 58, 0.04);
  color: var(--be-gold-light);
  transition: var(--be-transition);
}

.geaCategoryMatrixIcon img {
  display: block;
  width: 30px;
  height: 30px;
  object-fit: contain;
  filter:
    brightness(0) saturate(100%) invert(72%) sepia(40%) saturate(770%) hue-rotate(359deg) brightness(94%) contrast(86%);
  transition: var(--be-transition);
}

.geaCategoryMatrixIcon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaCategoryMatrixCard:hover .geaCategoryMatrixIcon {
  border-color: var(--be-gold);
  background: var(--be-gold);
  color: var(--be-primary-dark);
}

.geaCategoryMatrixCard:hover .geaCategoryMatrixIcon img {
  filter:
    brightness(0) saturate(100%) invert(11%) sepia(39%) saturate(2107%) hue-rotate(183deg) brightness(87%) contrast(105%);
}


/* =====================================================
   CATEGORY CONTENT
===================================================== */

.geaCategoryMatrixCard>div {
  position: relative;
  z-index: 2;
  min-width: 0;
}

.geaCategoryMatrixCard .geaCategoryMatrixCardTitle {
  margin: 0;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.18;
  transition: var(--be-transition);
}

.geaCategoryMatrixCard p {
  margin: 0;
  color: rgba(255, 255, 255, 0.57);
  font-size: 14px;
  line-height: 1.65;
  transition: var(--be-transition);
}

.geaCategoryMatrixCard:hover .geaCategoryMatrixCardTitle {
  color: var(--be-gold-light);
}

.geaCategoryMatrixCard:hover p {
  color: rgba(255, 255, 255, 0.72);
}


/* =====================================================
   CARD ARROW
===================================================== */

.geaCategoryMatrixArrow {
  position: relative;
  z-index: 2;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.8);
  transition: var(--be-transition);
}

.geaCategoryMatrixArrow svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaCategoryMatrixCard:hover .geaCategoryMatrixArrow {
  border-color: var(--be-gold);
  background: var(--be-gold);
  color: var(--be-primary-dark);
  transform: translateX(3px);
}


/* =====================================================
   BOTTOM CTA
===================================================== */

.geaCategoryMatrixCta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 19px;
  margin-top: 34px;
  padding: 23px 20px;
  border: 1px solid rgba(185, 141, 58, 0.37);
  background: rgba(255, 255, 255, 0.035);
}

.geaCategoryMatrixCta p {
  max-width: 710px;
  margin: 0;
  color: rgba(255, 255, 255, 0.67);
  font-size: 14px;
  line-height: 1.7;
}

.geaCategoryMatrixCta a {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--be-gold);
  color: var(--be-gold-light);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.geaCategoryMatrixCta a:hover {
  color: var(--be-white);
}

.geaCategoryMatrixCta a svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: var(--be-transition);
}

.geaCategoryMatrixCta a:hover svg {
  transform: translateX(4px);
}


/* =====================================================
   TABLET
===================================================== */

@media (min-width: 768px) {
  .geaCategoryMatrixHead {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(290px, 0.92fr);
    align-items: end;
    gap: 48px;
    margin-bottom: 45px;
  }

  .geaCategoryMatrixHead>p {
    margin: 0;
  }

  .geaCategoryMatrixGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .geaCategoryMatrixCard {
    min-height: 174px;
    padding: 27px 20px;
  }

  .geaCategoryMatrixCta {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    padding: 27px 28px;
  }

  .geaCategoryMatrixCta a {
    flex: 0 0 auto;
  }
}


/* =====================================================
   DESKTOP
===================================================== */

@media (min-width: 992px) {
  .geaCategoryMatrixGrid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .geaCategoryMatrixCard {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 14px;
    min-height: 178px;
    padding: 28px 18px 25px;
  }

  .geaCategoryMatrixArrow {
    position: absolute;
    right: 17px;
    bottom: 17px;
  }

  .geaCategoryMatrixCard .geaCategoryMatrixCardTitle {
    padding-right: 10px;
    font-size: 19px;
  }

  .geaCategoryMatrixCard p {
    padding-right: 5px;
  }
}


/* =====================================================
   LARGE DESKTOP
===================================================== */

@media (min-width: 1200px) {
  .geaCategoryMatrixCard {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 16px;
    min-height: max-content;
    padding: 15px 20px 15px;
    align-items: center;
  }

  .geaCategoryMatrixIcon {
    width: 52px;
    height: 52px;
  }

  .geaCategoryMatrixIcon img {
    width: 31px;
    height: 31px;
  }

  .geaCategoryMatrixCard .geaCategoryMatrixCardTitle {
    font-size: 20px;
  }

  .geaCategoryMatrixCard p {
    font-size: 14px;
  }

  .geaCategoryMatrixArrow {
    right: 20px;
    bottom: 19px;
  }
}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 420px) {
  .geaCategoryMatrixCard {
    grid-template-columns: 45px minmax(0, 1fr) 25px;
    gap: 11px;
    min-height: max-content;
    padding: 21px 14px;
  }

  .geaCategoryMatrixIcon {
    width: 45px;
    height: 45px;
  }

  .geaCategoryMatrixIcon img {
    width: 27px;
    height: 27px;
  }

  .geaCategoryMatrixCard .geaCategoryMatrixCardTitle {
    font-size: 18px;
  }

  .geaCategoryMatrixArrow {
    width: 25px;
    height: 25px;
  }
}





/* =====================================================
   GEA WHY PARTICIPATE
===================================================== */

.geaParticipationSection {
  position: relative;
  overflow: hidden;
  padding: var(--be-section-space) 0;
  background:
    radial-gradient(circle at 0 100%, rgba(185, 141, 58, 0.1), transparent 25%),
    var(--be-ivory);
}


.geaParticipationSection .container {
  position: relative;
  z-index: 1;
}


/* =====================================================
   SECTION HEADING
===================================================== */

.geaParticipationHead {
  margin-bottom: 35px;
}

.geaParticipationLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.15em;
  line-height: 1;
  text-transform: uppercase;
}

.geaParticipationLabel::before {
  width: 25px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.geaParticipationHead .geaParticipationHeadTitle {
  max-width: 680px;
  margin: 0;
}

.geaParticipationHead .geaParticipationHeadTitle em {
  color: var(--be-gold-dark);
  font-style: italic;
}

.geaParticipationIntro {
  margin-top: 19px;
}

.geaParticipationIntro p {
  max-width: 100%;
  margin-bottom: 18px;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.8;
}

.geaParticipationIntro a {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--be-gold);
  color: var(--be-primary);
  font-size: 13px;
  font-weight: 700;
}

.geaParticipationIntro a:hover {
  gap: 13px;
  color: var(--be-gold-dark);
}

.geaParticipationIntro a svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* =====================================================
   BENEFIT GRID
===================================================== */

.geaParticipationGrid {
  display: grid;
  border-top: 1px solid var(--be-border);
  border-left: 1px solid var(--be-border);
}

.geaParticipationCard {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 275px;
  padding: 24px 19px;
  overflow: hidden;
  border-right: 1px solid var(--be-border);
  border-bottom: 1px solid var(--be-border);
  background: var(--be-paper);
  transition:
    background 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.35s ease;
}

.geaParticipationCard::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 3px;
  background: var(--be-gold);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.geaParticipationCard::after {
  position: absolute;
  top: -65px;
  right: -65px;
  width: 145px;
  height: 145px;
  border: 1px solid rgba(8, 42, 90, 0.06);
  border-radius: 50%;
  content: "";
}

.geaParticipationCard:hover {
  z-index: 2;
  background: var(--be-white);
  box-shadow: 0 18px 40px rgba(4, 26, 56, 0.1);
  transform: translateY(-5px);
}

.geaParticipationCard:hover::before {
  transform: scaleX(1);
}

.geaParticipationCardTop {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 26px;
}

.geaParticipationIcon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 53px;
  height: 53px;
  border: 1px solid rgba(185, 141, 58, 0.48);
  color: var(--be-gold-dark);
  transition: var(--be-transition);
}

.geaParticipationIcon svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaParticipationCard:hover .geaParticipationIcon {
  background: var(--be-primary);
  border-color: var(--be-primary);
  color: var(--be-white);
}

.geaParticipationNumber {
  color: rgba(8, 42, 90, 0.28);
  font-family: var(--be-heading-font);
  font-size: 15px;
  line-height: 1;
}

.geaParticipationCardBody {
  position: relative;
  z-index: 1;
  display: flex;
  flex: 1;
  flex-direction: column;
}

.geaParticipationCard .geaParticipationCardBodyTitle {
  margin-bottom: 12px;
  color: var(--be-primary);
  font-size: 23px;
  line-height: 1.15;
  font-family: var(--be-heading-font);
  font-weight: 400;

}

.geaParticipationCard p {
  margin-bottom: 23px;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.7;
}

.geaParticipationPoint {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  color: var(--be-primary);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.geaParticipationPoint::before {
  width: 17px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}


/* =====================================================
   BOTTOM STATEMENT
===================================================== */

.geaParticipationStatement {
  position: relative;
  margin-top: 34px;
  padding: 27px 21px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.geaParticipationStatement::after {
  position: absolute;
  right: -45px;
  bottom: -45px;
  width: 125px;
  height: 125px;
  border: 1px solid rgba(185, 141, 58, 0.34);
  border-radius: 50%;
  content: "";
}

.geaParticipationStatementMark {
  margin-bottom: 15px;
}

.geaParticipationStatementMark svg {
  width: 30px;
  height: 30px;
  fill: var(--be-gold);
}

.geaParticipationStatement p {
  position: relative;
  z-index: 1;
  max-width: 870px;
  margin-bottom: 15px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 20px;
  line-height: 1.45;
}

.geaParticipationStatement>span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold-light);
  font-size: 14px;
  font-weight: 600;
}

.geaParticipationStatement>span::before {
  width: 21px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}


/* =====================================================
   TABLET
===================================================== */

@media (min-width: 768px) {
  .geaParticipationHead {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
    align-items: end;
    gap: 50px;
    margin-bottom: 46px;
  }

  .geaParticipationIntro {
    margin-top: 0;
  }

  .geaParticipationGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .geaParticipationCard {
    min-height: 290px;
    padding: 29px 24px;
  }

  .geaParticipationStatement {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 23px;
    padding: 31px 32px;
  }

  .geaParticipationStatementMark {
    margin: 0;
  }

  .geaParticipationStatement p {
    margin: 0;
    font-size: 22px;
  }
}


/* =====================================================
   DESKTOP
===================================================== */

@media (min-width: 992px) {
  .geaParticipationGrid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .geaParticipationCard {
    min-height: 320px;
    padding: 32px 25px;
  }

  .geaParticipationCard .geaParticipationCardBodyTitle {
    font-size: 25px;
  }

  .geaParticipationStatement {
    margin-top: 44px;
    padding: 36px 39px;
  }

  .geaParticipationStatement p {
    font-size: 24px;
  }
}




/* =====================================================
   GEA DETAIL PAGE BANNER
===================================================== */

.geaDetailBanner {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 480px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.geaDetailBannerImg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 65% center;
}

.geaDetailBannerShade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg,
      rgba(4, 26, 56, 0.99) 0%,
      rgba(4, 26, 56, 0.94) 33%,
      rgba(4, 26, 56, 0.63) 58%,
      rgba(4, 26, 56, 0.18) 100%),
    linear-gradient(180deg,
      rgba(4, 26, 56, 0.06) 45%,
      rgba(4, 26, 56, 0.8) 100%);
}

.geaDetailBanner>.container {
  position: relative;
  z-index: 2;
}

.geaDetailBannerBody {
  max-width: 680px;
  padding: 70px 0 118px;
}

.geaDetailBannerTag {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 17px;
  color: var(--be-gold-light);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.17em;
  line-height: 1;
  text-transform: uppercase;
}

.geaDetailBannerTag::before {
  width: 27px;
  height: 1px;
  background: var(--be-gold);
  content: "";
}

.geaDetailBannerBody h1 {
  max-width: 650px;
  margin: 0 0 18px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 48px;
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.02;
  text-shadow: 0 5px 25px rgba(4, 26, 56, 0.3);
}

.geaDetailBannerBody p {
  margin: 0 0 29px;
  color: rgba(255, 255, 255, 0.84);
  font-family: var(--be-heading-font);
  font-size: 19px;
  line-height: 1.45;
}

.geaDetailBannerButtons {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.geaDetailBannerDiscover,
.geaDetailBannerNominate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 47px;
  padding: 13px 19px;
  border: 1px solid transparent;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1;
  text-transform: uppercase;
  transition: var(--be-transition);
}

.geaDetailBannerDiscover {
  background: var(--be-gold);
  border-color: var(--be-gold);
  color: var(--be-primary-dark);
}

.geaDetailBannerDiscover:hover {
  background: var(--be-gold-light);
  border-color: var(--be-gold-light);
  color: var(--be-primary-dark);
}

.geaDetailBannerDiscover svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.geaDetailBannerNominate {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.5);
  color: var(--be-white);
  backdrop-filter: blur(5px);
}

.geaDetailBannerNominate:hover {
  background: var(--be-white);
  border-color: var(--be-white);
  color: var(--be-primary-dark);
}

.geaDetailBannerStrip {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  left: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.17);
  background: rgba(4, 26, 56, 0.76);
  backdrop-filter: blur(8px);
}

.geaDetailBannerHighlights {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 13px;
  min-height: 63px;
  padding-top: 14px;
  padding-bottom: 14px;
}

.geaDetailBannerHighlights span {
  color: rgba(255, 255, 255, 0.78);
  font-size: 12px;
  letter-spacing: 0.11em;
  line-height: 1.4;
}

.geaDetailBannerHighlights i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--be-gold);
}


@media (min-width: 768px) {
  .geaDetailBannerBody {
    padding: 90px 0 90px;
  }

  .geaDetailBannerBody h1 {
    font-size: 48px;
  }

  .geaDetailBannerBody p {
    font-size: 22px;
  }

  .geaDetailBannerDiscover,
  .geaDetailBannerNominate {
    min-height: 50px;
    padding: 14px 23px;
    font-size: 11px;
  }

  .geaDetailBannerHighlights {
    gap: 17px;
    min-height: 68px;
  }

  .geaDetailBannerHighlights span {
    font-size: 12px;
  }
}


@media (min-width: 992px) {
  .geaDetailBannerImg {
    object-position: center;
  }

  .geaDetailBannerBody {
    padding: 90px 0 90px;
  }

  .geaDetailBannerBody h1 {
    font-size: 48px;
  }

  .geaDetailBannerBody p {
    font-size: 25px;
  }

  .geaDetailBannerHighlights {
    min-height: 70px;
  }
}


.otherAwardsSection {
  position: relative;
  padding: 50px 0;
  overflow: hidden;
  background: var(--be-ivory);
}

.otherAwardsHead {
  position: relative;
  max-width: 720px;
  margin: 0 auto 28px;
  text-align: center;
}

.otherAwardsLabel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #a77c15;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.otherAwardsLabel::before,
.otherAwardsLabel::after {
  content: "";
  width: 22px;
  height: 1px;
  background: #c79b32;
}

.otherAwardsHead .otherAwardsHeadTitle {
  margin: 9px 0 10px;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 27px;
  line-height: 1.2;
  font-weight: 500;
}

.otherAwardsHead p {
  margin: 0;
  color: #626874;
  font-size: 13px;
  line-height: 1.7;
}

.otherAwardsGrid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
}

.otherAwardCard {
  position: relative;
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 17px;
  padding: 20px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0, 31, 63, 0.12);
  color: inherit;
  text-decoration: none;
  transition: 0.3s ease;
}

.otherAwardCard::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: #c79b32;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: 0.3s ease;
}

.otherAwardCard:active {
  transform: scale(0.98);
}

.otherAwardLogo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 150px;
  padding: 10px;
  background: #fffaf0;
  border: 1px solid rgba(199, 155, 50, 0.2);
}

.otherAwardLogo img {
  display: block;
  width: 100%;
  object-fit: contain;
}

.otherAwardContent {
  min-width: 0;
}

.otherAwardContent>span {
  display: block;
  margin-bottom: 5px;
  color: #a77c15;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.otherAwardContent .otherAwardContentTitle {
  margin: 0 0 7px;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 18px;
  line-height: 1.3;
  font-weight: 500;
}

.otherAwardContent p {
  margin: 0 0 11px;
  color: #686d76;
  font-size: 14px;
  line-height: 1.6;
}

.otherAwardLink {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--be-primary-dark);
  font-size: 14px;
  font-weight: 700;
}

.otherAwardLink svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

@media (min-width: 576px) {
  .otherAwardsSection {
    padding: 60px 0;
  }

  .otherAwardsGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }

  .otherAwardCard {
    display: block;
    padding: 22px;
  }

  .otherAwardLogo {
    height: 150px;
    margin-bottom: 18px;
  }

  .otherAwardLogo img {
    max-width: 300px;
    height: 100%;
  }

  .otherAwardContent .otherAwardContentTitle {
    font-size: 19px;
  }

  .otherAwardContent p {
    min-height: 63px;
    font-size: 14px;
  }
}

@media (min-width: 992px) {
  .otherAwardsSection {
    padding: 80px 0;
  }

  .otherAwardsHead {
    margin-bottom: 38px;
  }

  .otherAwardsHead .otherAwardsHeadTitle {
    font-size: 38px;
  }

  .otherAwardsHead p {
    font-size: 14px;
  }

  .otherAwardsGrid {
    grid-template-columns: repeat(4, 1fr);
  }

  .otherAwardsGrid.awardMainPage {
    grid-template-columns: repeat(3, 1fr);
  }

  .otherAwardCard {
    padding: 25px;
  }

  .otherAwardCard:hover {
    transform: translateY(-7px);
    border-color: #c79b32;
    box-shadow: 0 18px 40px rgba(0, 31, 63, 0.12);
  }

  .otherAwardCard:hover::before {
    transform: scaleY(1);
  }

  .otherAwardCard:hover .otherAwardLink {
    color: #a77c15;
  }

  .otherAwardCard:hover .otherAwardLink svg {
    transform: translateX(4px);
  }
}


.honoureesHero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 450px;
  padding: 80px 0;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.honoureesHeroMedia,
.honoureesHeroOverlay {
  position: absolute;
  inset: 0;
}

.honoureesHeroMedia img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 64% center;
}

.honoureesHeroOverlay {
  background:
    linear-gradient(90deg,
      rgba(0, 21, 43, 0.98) 0%,
      rgba(0, 31, 63, 0.92) 50%,
      rgba(0, 31, 63, 0.5) 100%),
    linear-gradient(0deg,
      rgba(0, 20, 42, 0.4) 0%,
      transparent 55%);
}

.honoureesHero .container {
  position: relative;
  z-index: 2;
}

.honoureesHeroContent {
  max-width: 680px;
}

.honoureesHeroLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 13px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.honoureesHeroLabel::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.honoureesHeroContent h1 {
  margin: 0 0 16px;
  color: #fff;
  font-size: 34px;
  line-height: 1.12;
  font-weight: 400;
  letter-spacing: -0.5px;
}

.honoureesHeroContent h1 em {
  color: var(--be-gold);
  font-weight: 400;
}

.honoureesHeroContent p {
  max-width: 570px;
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: 16px;
  line-height: 1.75;
}

.honoureesHeroActions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 11px;
  margin-top: 25px;
}

.honoureesHeroBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 11px 19px;
  border: 1px solid var(--be-gold);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-decoration: none;
  transition: 0.3s ease;
}

.honoureesHeroBtn.primary {
  background: var(--be-gold);
  color: var(--be-primary-dark);
}

.honoureesHeroBtn.secondary {
  background: transparent;
  color: #fff;
}

.honoureesHeroBtn svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.honoureesHeroScroll {
  position: absolute;
  z-index: 2;
  right: 18px;
  bottom: 20px;
  display: none;
  align-items: center;
  gap: 9px;
  color: rgba(255, 255, 255, 0.65);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-decoration: none;
  text-transform: uppercase;
}

.honoureesHeroScroll span {
  position: relative;
  width: 1px;
  height: 30px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.25);
}

.honoureesHeroScroll span::after {
  content: "";
  position: absolute;
  top: -100%;
  left: 0;
  width: 1px;
  height: 100%;
  background: var(--be-gold);
  animation: honoureeScrollLine 2s infinite;
}

@keyframes honoureeScrollLine {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(200%);
  }
}

@media (min-width: 480px) {
  .honoureesHeroActions {
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .honoureesHero {
    padding: 90px 0;
  }

  .honoureesHeroMedia img {
    object-position: center;
  }

  .honoureesHeroOverlay {
    background: linear-gradient(90deg,
        rgba(0, 21, 43, 0.98) 0%,
        rgba(0, 31, 63, 0.88) 45%,
        rgba(0, 31, 63, 0.2) 100%);
  }


  .honoureesHeroLabel {
    font-size: 11px;
  }

  .honoureesHeroContent h1 {
    font-size: 48px;
  }

  .honoureesHeroContent p {
    font-size: 16px;
  }

  .honoureesHeroScroll {
    display: flex;
  }
}

@media (min-width: 1200px) {
  .honoureesHeroContent {
    max-width: 780px;
  }

  .honoureesHeroContent h1 {
    font-size: 48px;
  }

  .honoureesHeroContent p {
    max-width: 610px;
    font-size: 16px;
  }

  .honoureesHeroBtn {
    min-height: 48px;
    padding: 14px 23px;
    font-size: 12px;
  }
}

@media (hover: hover) {
  .honoureesHeroBtn.primary:hover {
    background: transparent;
    color: #fff;
  }

  .honoureesHeroBtn.secondary:hover {
    background: var(--be-gold);
    color: var(--be-primary-dark);
  }

  .honoureesHeroBtn:hover svg {
    transform: translateX(4px);
  }
}


.honoureesIntro {
  position: relative;
  padding: 50px 0;
  overflow: hidden;
  background: var(--be-ivory);
}

.honoureesIntro::before {
  content: "";
  position: absolute;
  top: -100px;
  right: -110px;
  width: 220px;
  height: 220px;
  border: 1px solid rgba(195, 150, 45, 0.18);
  border-radius: 50%;
}

.honoureesIntroGrid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.honoureesSectionLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: #a77c15;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.honoureesSectionLabel::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--be-gold);
}

.honoureesIntroHeading h2 {
  max-width: 530px;
  margin: 0;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 29px;
  line-height: 1.2;
  font-weight: 400;
}

.honoureesIntroHeading h2 em {
  display: block;
  color: #a77c15;
  font-weight: 400;
}

.honoureesIntroContent {
  max-width: 100%;
}

.honoureesIntroContent p {
  margin: 0 0 12px;
  color: #606772;
  font-size: 16px;
  line-height: 1.75;
}

.honoureesIntroContent p:last-of-type {
  margin-bottom: 18px;
}

.honoureesIntroLink {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--be-gold);
  color: var(--be-primary-dark);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.honoureesIntroLink svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.honoureesStats {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  margin-top: 32px;
  background: var(--be-primary-dark);
}

.honoureesStatItem {
  display: grid;
  grid-template-columns: 48px 1fr;
  align-items: center;
  gap: 14px;
  min-height: 105px;
  padding: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.honoureesStatItem:last-child {
  border-bottom: 0;
}

.honoureesStatIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(247, 201, 40, 0.45);
  color: var(--be-gold);
}

.honoureesStatIcon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.honoureesStatItem strong {
  display: block;
  color: #fff;
  font-family: Georgia, serif;
  font-size: 25px;
  line-height: 1;
  font-weight: 400;
}

.honoureesStatItem strong sup {
  color: var(--be-gold);
  font-size: 14px;
}

.honoureesStatItem div>span {
  display: block;
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.67);
  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
}

@media (min-width: 576px) {
  .honoureesStats {
    grid-template-columns: repeat(2, 1fr);
  }

  .honoureesStatItem:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, 0.12);
  }

  .honoureesStatItem:nth-last-child(-n+2) {
    border-bottom: 0;
  }
}

@media (min-width: 768px) {
  .honoureesIntro {
    padding: 70px 0;
  }

  .honoureesIntroGrid {
    grid-template-columns: 0.9fr 1.1fr;
    align-items: start;
    gap: 55px;
  }

  .honoureesIntroHeading h2 {
    font-size: 37px;
  }

  .honoureesIntroContent p {
    font-size: 16px;
  }

  .honoureesStats {
    margin-top: 45px;
  }
}

@media (min-width: 992px) {
  .honoureesIntro {
    padding: 90px 0;
  }

  .honoureesIntroGrid {
    gap: 90px;
  }

  .honoureesIntroHeading h2 {
    font-size: 45px;
  }

  .honoureesStats {
    grid-template-columns: repeat(4, 1fr);
  }

  .honoureesStatItem {
    min-height: 125px;
    padding: 24px;
    border-right: 1px solid rgba(255, 255, 255, 0.12);
    border-bottom: 0;
  }

  .honoureesStatItem:last-child {
    border-right: 0;
  }

  .honoureesStatItem strong {
    font-size: 29px;
  }
}

@media (hover: hover) {
  .honoureesIntroLink:hover {
    color: #a77c15;
  }

  .honoureesIntroLink:hover svg {
    transform: translateX(4px);
  }
}




/* LIGHT HONOUREES DESIGN OVERRIDE */

.honoureeShowcase {
  position: relative;
  padding: 50px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 5% 10%, rgba(185, 141, 58, 0.12), transparent 28%),
    radial-gradient(circle at 95% 90%, rgba(8, 42, 90, 0.06), transparent 30%),
    var(--be-ivory);
}

.honoureeShowcase::before {
  content: "";
  position: absolute;
  top: 80px;
  left: -120px;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(185, 141, 58, 0.14);
  border-radius: 50%;
  pointer-events: none;
}

.honoureeShowcase::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: 70px;
  width: 220px;
  height: 220px;
  border: 1px solid rgba(8, 42, 90, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.honoureeShowcase .container {
  position: relative;
  z-index: 1;
}

.honoureeShowcaseHead {
  max-width: 780px;
  margin: 0 auto 25px;
  text-align: center;
}

.honoureeShowcaseHead>span,
.honoureeEditionHead>span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.honoureeShowcaseHead>span::before,
.honoureeShowcaseHead>span::after {
  content: "";
  width: 22px;
  height: 1px;
  background: var(--be-gold);
}

.honoureeShowcaseHead h2 {
  margin: 0 0 9px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 27px;
  line-height: 1.22;
  font-weight: 400;
}

.honoureeShowcaseHead p {
  margin: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.65;
}

/* FILTER */

.honoureeFilter {
  max-width: 980px;
  margin: 0 auto 35px;
  padding: 19px;
  background: rgba(255, 253, 248, 0.88);
  backdrop-filter: blur(8px);
  border: 1px solid var(--be-border);
  border-radius: 16px;
  box-shadow: 0 14px 35px rgba(8, 42, 90, 0.09);
}

.honoureeFilterGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.honoureeFilterGroup label {
  display: block;
  margin-bottom: 6px;
  color: var(--be-primary);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
}

.honoureeFilterGroup input,
.honoureeFilterGroup select {
  width: 100%;
  height: 43px;
  padding: 0 12px;
  color: var(--be-text);
  background: var(--be-white);
  border: 1px solid var(--be-border);
  border-radius: 8px;
  outline: none;
  font-family: var(--be-body-font);
  font-size: 12px;
  transition: var(--be-transition);
}

.honoureeFilterGroup input::placeholder {
  color: var(--be-muted);
}

.honoureeFilterGroup input:focus,
.honoureeFilterGroup select:focus {
  border-color: var(--be-gold);
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.15);
}

.honoureeSearchBox {
  position: relative;
}

.honoureeSearchBox svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--be-muted);
  stroke-width: 1.8;
  transform: translateY(-50%);
}

.honoureeSearchBox input {
  padding-left: 38px;
}

.honoureeFilterButtons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.honoureeSearchButton,
.honoureeResetButton {
  min-height: 43px;
  padding: 10px 16px;
  border-radius: 8px;
  font-family: var(--be-body-font);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: var(--be-transition);
}

.honoureeSearchButton {
  color: var(--be-white);
  background: var(--be-primary);
  border: 1px solid var(--be-primary);
}

.honoureeResetButton {
  color: var(--be-primary);
  background: var(--be-white);
  border: 1px solid var(--be-border);
}

/* EDITION HEADING */

.honoureeEditionHead {
  max-width: 950px;
  margin: 0 auto 23px;
  text-align: center;
}

.honoureeEditionHead h2 {
  margin: 0 0 8px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 25px;
  line-height: 1.3;
  font-weight: 400;
}

.honoureeEditionHead h2 small {
  display: block;
  margin-top: 5px;
  color: var(--be-gold-dark);
  font-family: var(--be-heading-font);
  font-size: 16px;
  font-weight: 400;
}

.honoureeEditionHead p {
  max-width: 800px;
  margin: 0 auto;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.65;
}

/* CHIEF GUEST */

.chief-guest-bx {
  text-align: center;
}

.chief-guest-bx .img-bx {
  max-width: 160px;
  margin: 0 auto 12px;
  padding: 4px;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(120deg,
      var(--be-gold-dark),
      var(--be-gold-light),
      var(--be-gold),
      var(--be-ivory),
      var(--be-gold-dark));
  box-shadow: 0 12px 28px rgba(8, 42, 90, 0.14);
}

.chief-guest-bx .img-bx img {
  width: 100%;
  height: 100%;
  display: block;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  border: 3px solid var(--be-paper);
  border-radius: 50%;
}

.chief-guest-bx .name {
  margin: 0 0 5px;
  color: var(--be-primary-dark);
  font-family: var(--be-heading-font);
  font-size: 24px;
  line-height: 1.15;
  font-weight: 600;
}

.chief-guest-bx .profession {
  margin: 0;
  color: var(--be-muted);
  font-family: var(--be-body-font);
  font-size: 15px;
  line-height: 1.5;
  font-weight: 500;
}

.chief-guest-bx.sm .img-bx {
  max-width: 100px;
  padding: 3px;
}

.chief-guest-bx.sm .name {
  margin-bottom: 2px;
  font-size: 18px;
}

.chief-guest-bx.sm .profession {
  font-size: 13px;
}

/* =====================================================
   HONOUREES SHOWCASE
===================================================== */

.honoureeShowcase {
  position: relative;
  padding: 50px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 5% 10%, rgba(185, 141, 58, 0.12), transparent 28%),
    radial-gradient(circle at 95% 90%, rgba(8, 42, 90, 0.06), transparent 30%),
    var(--be-ivory);
}

.honoureeShowcase::before {
  content: "";
  position: absolute;
  top: 80px;
  left: -120px;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(185, 141, 58, 0.14);
  border-radius: 50%;
  pointer-events: none;
}

.honoureeShowcase::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: 70px;
  width: 220px;
  height: 220px;
  border: 1px solid rgba(8, 42, 90, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.honoureeShowcase .container {
  position: relative;
  z-index: 1;
}

/* =====================================================
   SHOWCASE HEADING
===================================================== */

.honoureeShowcaseHead {
  max-width: 780px;
  margin: 0 auto 25px;
  text-align: center;
}

.honoureeShowcaseHead>span,
.honoureeEditionHead>span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--be-gold-dark);
  font-size: 10px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.honoureeShowcaseHead>span::before,
.honoureeShowcaseHead>span::after {
  content: "";
  width: 22px;
  height: 1px;
  background: var(--be-gold);
}

.honoureeShowcaseHead h2 {
  margin: 0 0 9px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 27px;
  line-height: 1.22;
  font-weight: 400;
}

.honoureeShowcaseHead p {
  margin: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.65;
}

/* =====================================================
   FILTER
===================================================== */

.honoureeFilter {
  max-width: 980px;
  margin: 0 auto 35px;
  padding: 19px;
  background: rgba(255, 253, 248, 0.9);
  backdrop-filter: blur(8px);
  border: 1px solid var(--be-border);
  border-radius: 16px;
  box-shadow: 0 14px 35px rgba(8, 42, 90, 0.09);
}

.honoureeFilterGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.honoureeFilterGroup label {
  display: block;
  margin-bottom: 6px;
  color: var(--be-primary);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
}

.honoureeFilterGroup input,
.honoureeFilterGroup select {
  width: 100%;
  height: 43px;
  padding: 0 12px;
  color: var(--be-text);
  background: var(--be-white);
  border: 1px solid var(--be-border);
  border-radius: 8px;
  outline: none;
  font-family: var(--be-body-font);
  font-size: 12px;
  transition: var(--be-transition);
}

.honoureeFilterGroup input::placeholder {
  color: var(--be-muted);
}

.honoureeFilterGroup input:focus,
.honoureeFilterGroup select:focus {
  border-color: var(--be-gold);
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.15);
}

.honoureeSearchBox {
  position: relative;
}

.honoureeSearchBox svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--be-muted);
  stroke-width: 1.8;
  transform: translateY(-50%);
  pointer-events: none;
}

.honoureeSearchBox input {
  padding-left: 38px;
}

.honoureeFilterButtons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.honoureeSearchButton,
.honoureeResetButton {
  min-height: 43px;
  padding: 10px 16px;
  border-radius: 8px;
  font-family: var(--be-body-font);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: var(--be-transition);
}

.honoureeSearchButton {
  color: var(--be-white);
  background: var(--be-primary);
  border: 1px solid var(--be-primary);
}

.honoureeResetButton {
  color: var(--be-primary);
  background: var(--be-white);
  border: 1px solid var(--be-border);
}

/* =====================================================
   AWARD EDITION HEADING
===================================================== */

.honoureeEditionHead {
  max-width: 950px;
  margin: 0 auto 23px;
  text-align: center;
}

.honoureeEditionHead h2 {
  margin: 0 0 8px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 25px;
  line-height: 1.3;
  font-weight: 400;
}

.honoureeEditionHead h2 small {
  display: block;
  margin-top: 5px;
  color: var(--be-gold-dark);
  font-family: var(--be-heading-font);
  font-size: 16px;
  font-weight: 400;
}

.honoureeEditionHead p {
  max-width: 800px;
  margin: 0 auto;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.65;
}

/* =====================================================
   CHIEF GUEST
===================================================== */

.chief-guest-bx {
  text-align: center;
}

.chief-guest-bx .img-bx {
  max-width: 160px;
  margin: 0 auto 12px;
  padding: 4px;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(120deg,
      var(--be-gold-dark),
      var(--be-gold-light),
      var(--be-gold),
      var(--be-ivory),
      var(--be-gold-dark));
  box-shadow: 0 12px 28px rgba(8, 42, 90, 0.14);
}

.chief-guest-bx .img-bx img {
  width: 100%;
  height: 100%;
  display: block;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  border: 3px solid var(--be-paper);
  border-radius: 50%;
}

.chief-guest-bx .name {
  margin: 0 0 5px;
  color: var(--be-primary-dark);
  font-family: var(--be-heading-font);
  font-size: 24px;
  line-height: 1.15;
  font-weight: 600;
}

.chief-guest-bx .profession {
  margin: 0;
  color: var(--be-muted);
  font-family: var(--be-body-font);
  font-size: 15px;
  line-height: 1.5;
  font-weight: 500;
}

.chief-guest-bx.sm .img-bx {
  max-width: 100px;
  padding: 3px;
}

.chief-guest-bx.sm .name {
  margin-bottom: 2px;
  font-size: 18px;
}

.chief-guest-bx.sm .profession {
  font-size: 13px;
}

/* =====================================================
   HONOUREE CARDS
===================================================== */

.honoureeCards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.honoureeShowcaseCard {
  position: relative;
  height: 100%;
  padding: 16px;
  overflow: hidden;
  text-align: center;
  background: linear-gradient(145deg,
      rgba(255, 255, 255, 0.94),
      rgba(245, 237, 219, 0.72));
  backdrop-filter: blur(5px);
  border: 1px solid rgba(185, 141, 58, 0.28);
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(8, 42, 90, 0.09);
  transition: all cubic-bezier(0.4, 0, 0.2, 1) 300ms;
}

.honoureeShowcaseCard::before {
  content: "";
  position: absolute;
  top: -70px;
  right: -70px;
  width: 145px;
  height: 145px;
  border: 1px solid rgba(185, 141, 58, 0.16);
  border-radius: 50%;
  pointer-events: none;
}

.honoureeShowcaseCard::after {
  content: "";
  position: absolute;
  right: 15px;
  bottom: 15px;
  width: 55px;
  height: 55px;
  background: radial-gradient(circle,
      rgba(185, 141, 58, 0.1),
      transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

/* =====================================================
   CARD TAGS
===================================================== */

.honoureeCardTop {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
}

.honoureeCardTop span,
.honoureeCardTop strong {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 20px;
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
}

.honoureeCardTop span {
  color: var(--be-primary);
  background: rgba(8, 42, 90, 0.08);
  border: 1px solid rgba(8, 42, 90, 0.1);
}

.honoureeCardTop strong {
  color: var(--be-primary-dark);
  background: linear-gradient(90deg,
      var(--be-gold-dark),
      var(--be-gold-light),
      var(--be-gold));
}

/* =====================================================
   CARD IMAGE
===================================================== */

.honoureeShowcaseImage {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 60 / 49;
  background: var(--be-ivory-dark);
  border-radius: 14px;
}

.honoureeShowcaseImage::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: inherit;
  pointer-events: none;
}

.honoureeShowcaseImage img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform 0.5s ease;
}

/* =====================================================
   CARD CONTENT
===================================================== */

.honoureeShowcaseContent {
  position: relative;
  z-index: 2;
  padding: 0 2px 4px;
  text-align: center;
}

.honoureeShowcaseContent h3 {
  margin: 17px 0 12px;
}

.honoureeShowcaseContent h3 a {
  position: relative;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 15px;
  overflow: hidden;
  color: var(--be-primary);
  background: linear-gradient(135deg,
      var(--be-white),
      var(--be-ivory-dark));
  border: 1px solid rgba(185, 141, 58, 0.3);
  border-radius: 10px;
  box-shadow:
    0 6px 18px rgba(8, 42, 90, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  font-family: var(--be-heading-font);
  font-size: 16px;
  line-height: 1.3;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  transition: var(--be-transition);
}

.honoureeShowcaseContent h3 a::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 7px;
  width: 3px;
  border-radius: 5px;
  background: linear-gradient(to bottom,
      var(--be-gold-light),
      var(--be-gold-dark));
}

.honoureeShowcaseContent h3 a::after {
  content: "";
  position: absolute;
  top: -26px;
  right: -26px;
  width: 65px;
  height: 65px;
  border: 1px solid rgba(185, 141, 58, 0.13);
  border-radius: 50%;
  pointer-events: none;
}

.honoureeShowcaseContent>span {
  display: block;
  margin-bottom: 5px;
  color: var(--be-text);
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
  text-align: center;
  min-height: 48px;
  align-content: center;
}

.honoureeShowcaseContent>p {
  min-height: 39px;
  margin: 0;
  color: var(--be-gold-dark);
  font-size: 14px;
  line-height: 1.55;
  font-weight: 700;
}

/* =====================================================
   VIEW PROFILE
===================================================== */

.honoureeViewProfile {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 13px;
  padding: 6px 0 3px;
  color: var(--be-primary);
  border-bottom: 1px solid rgba(185, 141, 58, 0.6);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: var(--be-transition);
}

.honoureeViewProfile svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: var(--be-transition);
}

/* =====================================================
   PAYMENT RECEIPT
===================================================== */

.paymentReceiptBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
  padding: 6px 12px;
  color: var(--be-text);
  background: var(--be-white);
  border: 1px solid var(--be-border);
  border-radius: 6px;
  font-size: 12px;
  line-height: normal;
  text-decoration: none;
  transition: var(--be-transition);
}

/* =====================================================
   LOAD MORE
===================================================== */

.honoureeLoadMore {
  display: flex;
  align-items: center;
  justify-content: center;
}

.honoureeLoader {
  display: none;
  width: 24px;
  height: 24px;
  border: 3px solid rgba(0, 31, 63, 0.15);
  border-top-color: var(--be-gold-dark);
  border-radius: 50%;
  animation: honoureeLoaderSpin 0.7s linear infinite;
}

#honoureeLoadMoreBtn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 150px;
  min-height: 44px;
  padding: 12px 24px;
  overflow: hidden;
  color: var(--be-white);
  background: var(--be-primary-dark);
  border: 1px solid var(--be-primary-dark);
  border-radius: 30px;
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 10px 25px rgba(0, 31, 63, 0.15);
  transition: 0.3s ease;
}

#honoureeLoadMoreBtn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 55%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.22), transparent);
  transform: skewX(-22deg);
  transition: left 0.55s ease;
}

#honoureeLoadMoreBtn:hover {
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border-color: var(--be-gold);
  box-shadow: 0 13px 30px rgba(0, 31, 63, 0.2);
  transform: translateY(-2px);
}

#honoureeLoadMoreBtn:hover::before {
  left: 150%;
}

.editionVideoCard.videoItemHidden {
  display: none;
}

.editionVideoCard.videoItemVisible {
  animation: videoItemReveal 0.5s ease both;
}

@keyframes honoureeLoaderSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes videoItemReveal {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}



.honoureeShowcaseCard.honoureeCardHidden {
  display: none;
}

.honoureeShowcaseCard.honoureeCardVisible {
  animation: honoureeCardReveal 0.5s ease both;
}

.honoureeLoadMore {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin-top: 30px;
}

.honoureeLoader {
  display: none;
  width: 24px;
  height: 24px;
  border: 3px solid rgba(0, 31, 63, 0.15);
  border-top-color: var(--be-gold-dark);
  border-radius: 50%;
  animation: honoureeLoaderSpin 0.7s linear infinite;
}

#honoureeLoadMoreBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 150px;
  min-height: 44px;
  padding: 12px 24px;
  color: var(--be-white);
  background: var(--be-primary-dark);
  border: 1px solid var(--be-primary-dark);
  border-radius: 30px;
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  cursor: pointer;
  transition: 0.3s ease;
}

#honoureeLoadMoreBtn:hover {
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border-color: var(--be-gold);
  transform: translateY(-2px);
}

@keyframes honoureeLoaderSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes honoureeCardReveal {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =====================================================
   RESPONSIVE: 576PX
===================================================== */

@media (min-width: 576px) {

  .honoureeFilterGrid,
  .honoureeCards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .honoureeEditionHead h2 small {
    display: inline;
    margin: 0;
  }
}

/* =====================================================
   RESPONSIVE: 768PX
===================================================== */

@media (min-width: 768px) {
  .honoureeShowcase {
    padding: 70px 0;
  }

  .honoureeShowcaseHead h2 {
    font-size: 36px;
  }

  .honoureeFilter {
    margin-bottom: 45px;
    padding: 23px;
  }

  .honoureeEditionHead h2 {
    font-size: 32px;
  }
}

/* =====================================================
   RESPONSIVE: 992PX
===================================================== */

@media (min-width: 992px) {
  .honoureeShowcase {
    padding: 85px 0;
  }

  .honoureeShowcaseHead h2 {
    font-size: 42px;
  }

  .honoureeFilterGrid {
    grid-template-columns: 1fr 1fr 1fr auto;
    align-items: end;
  }

  .honoureeFilterButtons {
    grid-template-columns: auto auto;
  }

  .honoureeCards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 21px;
  }
}

/* =====================================================
   HOVER EFFECTS
===================================================== */

@media (hover: hover) {
  .honoureeShowcaseCard:hover {
    border-color: var(--be-gold);
    box-shadow: 0 20px 42px rgba(8, 42, 90, 0.14);
    transform: translateY(-7px);
  }

  .honoureeShowcaseCard:hover .honoureeShowcaseImage img {
    transform: scale(1.05);
  }

  .honoureeShowcaseContent h3 a:hover {
    color: var(--be-white);
    background: linear-gradient(135deg,
        var(--be-primary),
        var(--be-primary-dark));
    border-color: var(--be-gold);
    box-shadow: 0 10px 24px rgba(8, 42, 90, 0.15);
    transform: translateY(-2px);
  }

  .honoureeShowcaseContent h3 a:hover::before {
    background: linear-gradient(to bottom,
        var(--be-gold-light),
        var(--be-gold));
  }

  .honoureeViewProfile:hover {
    color: var(--be-gold-dark);
  }

  .honoureeViewProfile:hover svg {
    transform: translateX(4px);
  }

  .honoureeSearchButton:hover,
  .honoureeLoadMore button:hover {
    color: var(--be-primary-dark);
    background: var(--be-gold);
    border-color: var(--be-gold);
  }

  .honoureeLoadMore button:hover svg {
    stroke: var(--be-primary-dark);
  }

  .honoureeResetButton:hover,
  .paymentReceiptBtn:hover,
  .paymentReceiptBtn:focus {
    color: var(--be-primary-dark);
    background: var(--be-gold-light);
    border-color: var(--be-gold);
  }
}

/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion: reduce) {

  .honoureeShowcaseCard,
  .honoureeShowcaseImage img,
  .honoureeShowcaseContent h3 a,
  .honoureeViewProfile,
  .honoureeViewProfile svg,
  .honoureeSearchButton,
  .honoureeResetButton,
  .honoureeLoadMore button {
    transition: none;
  }
}


/* =====================================================
   HONOUREE DETAIL PAGE
===================================================== */

.honoureeDetailPage {
  color: var(--be-text);
  background: var(--be-paper);
  font-family: var(--be-body-font);
}

.honoureeDetailPage img {
  display: block;
  max-width: 100%;
}

.honoureeDetailPage a {
  color: inherit;
  text-decoration: none;
}

/* HERO */

.honoureeDetailHero {
  position: relative;
  padding: 90px 0;
  overflow: hidden;
  color: var(--be-white);
  background:
    radial-gradient(circle at 90% 15%, rgba(185, 141, 58, 0.2), transparent 27%),
    linear-gradient(135deg, var(--be-primary), var(--be-primary-dark));
}

.honoureeDetailHero::before {
  content: "";
  position: absolute;
  top: -140px;
  right: -130px;
  width: 360px;
  height: 360px;
  border: 1px solid rgba(212, 179, 109, 0.2);
  border-radius: 50%;
}

.honoureeDetailHero::after {
  content: "";
  position: absolute;
  bottom: -170px;
  left: -130px;
  width: 350px;
  height: 350px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 50%;
}

.honoureeDetailHero .container {
  position: relative;
  z-index: 1;
}


.honoureeDetailHeroGrid {
  display: grid;
  gap: 38px;
}

.honoureeDetailLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
  color: var(--be-white);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.honoureeDetailLabel::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--be-gold);
}

.honoureeDetailHeroContent h1 {
  max-width: 720px;
  margin: 0 0 13px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 42px;
  line-height: 1.05;
  font-weight: 400;
}


.goes-tt {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 4px 0 4px;
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--be-body-font);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 600;
}

.goes-tt::after {
  content: "";
  width: 35px;
  height: 1px;
  background: linear-gradient(to right, var(--be-gold), transparent);
}

.honoureeDetailAward {
  margin: 0 0 17px;
  color: var(--be-gold-light);
  font-family: var(--be-heading-font);
  font-size: 32px;
  line-height: 1.2;
  font-weight: 400;
}


.honoureeDetailAward {
  margin: 0 0 15px;
  color: var(--be-gold-light);
  font-family: var(--be-heading-font);
  font-size: 32px;
  line-height: 1.3;
}

.honoureeDetailIntro {
  max-width: 650px;
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 16px;
  line-height: 1.75;
}

.honoureeDetailMeta {
  display: grid;
  gap: 10px;
  margin-top: 27px;
}

.honoureeDetailMeta>div {
  padding: 13px 15px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-left: 2px solid var(--be-gold);
}

.honoureeDetailMeta span,
.honoureeDetailMeta strong {
  display: block;
}

.honoureeDetailMeta span {
  margin-bottom: 4px;
  color: rgba(255, 255, 255, 0.58);
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.honoureeDetailMeta strong {
  color: var(--be-white);
  font-size: 14px;
  font-weight: 600;
}

.honoureeDetailPortrait {
  max-width: 440px;
  margin: auto;
}

.honoureeDetailPortraitFrame {
  position: relative;
  padding: 6px;
  background: linear-gradient(135deg, var(--be-gold-dark), var(--be-gold-light), var(--be-gold));
  box-shadow: 0 24px 55px rgba(0, 0, 0, 0.28);
}

.honoureeDetailPortraitFrame::before {
  content: "";
  position: absolute;
  inset: 13px;
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, 0.4);
  pointer-events: none;
}

.honoureeDetailPortraitFrame img {
  width: 100%;
  aspect-ratio: 60 / 49;
  object-fit: cover;
}

.honoureeDetailPortraitCaption {
  width: calc(100% - 28px);
  position: relative;
  z-index: 2;
  margin: -25px auto 0;
  padding: 13px 16px;
  text-align: center;
  background: var(--be-paper);
  border: 1px solid var(--be-gold);
  box-shadow: 0 12px 30px rgba(4, 26, 56, 0.18);
}

.honoureeDetailPortraitCaption span,
.honoureeDetailPortraitCaption strong {
  display: block;
}

.honoureeDetailPortraitCaption span {
  margin-bottom: 3px;
  color: var(--be-gold-dark);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.honoureeDetailPortraitCaption strong {
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 18px;
}


/* PROFILE */

.honoureeProfileSection {
  padding: 55px 0;
  background:
    radial-gradient(circle at 95% 15%, rgba(185, 141, 58, 0.08), transparent 25%),
    var(--be-paper);
}

.honoureeProfileGrid {
  display: grid;
  gap: 35px;
}

.honoureeSectionTag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--be-gold-dark);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.honoureeSectionTag::before {
  content: "";
  width: 25px;
  height: 1px;
  background: var(--be-gold);
}

.honoureeProfileContent h2,
.honoureeVideoContent h2 {
  margin: 0 0 18px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 29px;
  line-height: 1.2;
  font-weight: 400;
}

.honoureeProfileContent p {
  margin: 0 0 15px;
  color: var(--be-text);
  font-size: 14px;
  line-height: 1.85;
}

.honoureeProfileContent .honoureeLead {
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 18px;
  line-height: 1.55;
}

.honoureeProfileContent blockquote {
  position: relative;
  margin: 25px 0 0;
  padding: 20px 20px 20px 45px;
  color: var(--be-primary);
  background: var(--be-ivory);
  border-left: 3px solid var(--be-gold);
  font-family: var(--be-heading-font);
  font-size: 17px;
  line-height: 1.55;
}

.honoureeProfileContent blockquote span {
  position: absolute;
  top: 8px;
  left: 15px;
  color: var(--be-gold);
  font-size: 45px;
  line-height: 1;
}

.honoureeAwardSummary {
  position: relative;
  overflow: hidden;
  padding: 27px 22px;
  background: linear-gradient(145deg, var(--be-white), var(--be-ivory));
  border: 1px solid var(--be-border);
  border-radius: 16px;
  box-shadow: 0 18px 45px rgba(8, 42, 90, 0.09);
}

.honoureeAwardSummary::before {
  content: "";
  position: absolute;
  top: -80px;
  right: -80px;
  width: 180px;
  height: 180px;
  border: 1px solid rgba(185, 141, 58, 0.16);
  border-radius: 50%;
}

.honoureeAwardSeal {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  margin-bottom: 17px;
  color: var(--be-primary-dark);
  background: linear-gradient(135deg, var(--be-gold-light), var(--be-gold));
  border-radius: 50%;
}

.honoureeAwardSeal svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.honoureeAwardSummaryLabel {
  color: var(--be-gold-dark);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.honoureeAwardSummary h3 {
  margin: 7px 0 20px;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 24px;
  line-height: 1.25;
  font-weight: 600;
}

.honoureeAwardSummary ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.honoureeAwardSummary li {
  display: grid;
  gap: 4px;
  padding: 11px 0;
  border-bottom: 1px solid var(--be-border);
}

.honoureeAwardSummary li span {
  color: var(--be-muted);
  font-size: 12px;
}

.honoureeAwardSummary li strong {
  color: var(--be-primary-dark);
  font-size: 14px;
}

.honoureePrimaryButton,
.honoureeOutlineButton {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 22px;
  padding: 11px 19px;
  color: var(--be-white);
  background: var(--be-primary);
  border: 1px solid var(--be-primary);
  border-radius: 7px;
  font-size: 13px;
  font-weight: 700;
  transition: var(--be-transition);
}

.honoureePrimaryButton svg,
.honoureeOutlineButton svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}



/* COMMON SECTION HEADING */

.honoureeSectionHeading {
  max-width: 700px;
  margin: 0 auto 28px;
  text-align: center;
}

.honoureeSectionHeading>span {
  color: var(--be-gold);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.honoureeSectionHeading h2 {
  margin: 8px 0;
  color: var(--be-gold-light);
  font-family: var(--be-heading-font);
  font-size: 28px;
  line-height: 1.25;
  font-weight: 400;
}

.honoureeSectionHeading p {
  margin: 0;
  color: var(--be-white);
  font-size: 14px;
  line-height: 1.7;
}



/* GALLERY */

.honoureeGallerySection {
  padding: 55px 0;
  background: var(--be-primary);
}

.honoureeGallery {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.honoureeGalleryItem {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: var(--be-ivory-dark);
}

.honoureeGalleryItem img {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.honoureeGalleryItem span {
  position: absolute;
  right: 12px;
  bottom: 12px;
  padding: 7px 10px;
  color: var(--be-white);
  background: rgba(4, 26, 56, 0.88);
  border: 1px solid rgba(212, 179, 109, 0.5);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
}

/* VIDEO */

.honoureeVideoSection {
  padding: 55px 0;
  background: var(--be-ivory);
  border-block: 1px solid var(--be-border);
}

.honoureeVideoGrid {
  display: grid;
  gap: 28px;
  align-items: center;
}

.honoureeVideoContent p {
  margin: 0;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.75;
}

.honoureeVideoBox {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
}

.honoureeVideoBox a {
  position: relative;
  display: block;
}

.honoureeVideoBox img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.honoureeVideoBox a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(4, 26, 56, 0.18);
  transition: background 0.35s ease;
}

.honoureeVideoPlay {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: grid;
  width: 68px;
  height: 68px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border: 5px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  place-items: center;
  transform: translate(-50%, -50%);
  box-shadow: 0 12px 30px rgba(4, 26, 56, 0.3);
  transition: transform 0.35s ease, background 0.35s ease;
}

.honoureeVideoPlay::before {
  content: "";
  position: absolute;
  inset: -12px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 50%;
  animation: honoureeVideoPulse 1.8s infinite;
}

.honoureeVideoPlay svg {
  width: 32px;
  height: 32px;
  fill: currentColor;
}

.honoureeVideoBox:hover img {
  transform: scale(1.05);
}

.honoureeVideoBox:hover a::before {
  background: rgba(4, 26, 56, 0.32);
}

.honoureeVideoBox:hover .honoureeVideoPlay {
  color: var(--be-gold);
  background: var(--be-primary-dark);
  transform: translate(-50%, -50%) scale(1.08);
}

@keyframes honoureeVideoPulse {
  0% {
    opacity: 0.8;
    transform: scale(0.8);
  }

  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

@media (max-width: 575px) {
  .honoureeVideoPlay {
    width: 56px;
    height: 56px;
  }

  .honoureeVideoPlay svg {
    width: 27px;
    height: 27px;
  }
}

/* RELATED HONOUREES */

.relatedHonourees {
  padding: 55px 0;
  background: var(--be-paper);
}

.relatedHonoureesGrid {
  display: grid;
  gap: 18px;
}

.relatedHonoureeCard {
  overflow: hidden;
  background: var(--be-white);
  border: 1px solid var(--be-border);
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(8, 42, 90, 0.07);
  transition: var(--be-transition);
}

.relatedHonoureeImage {
  display: block;
  overflow: hidden;
}

.relatedHonoureeImage img {
  width: 100%;
  aspect-ratio: 60 / 49;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.relatedHonoureeCard>div {
  padding: 18px;
}

.relatedHonoureeCard span {
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.relatedHonoureeCard h3 {
  margin: 7px 0;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 20px;
  line-height: 1.3;
}

.relatedHonoureeCard p {
  margin: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.6;
}

.relatedHonoureeLink {
  display: inline-block;
  margin-top: 13px;
  color: var(--be-primary);
  border-bottom: 1px solid var(--be-gold);
  font-size: 13px;
  font-weight: 700;
}

.relatedHonoureesAction {
  text-align: center;
}

.honoureeOutlineButton {
  margin-top: 30px;
  color: var(--be-primary);
  background: transparent;
  border-color: var(--be-primary);
}

/* RESPONSIVE */

@media (min-width: 576px) {
  .honoureeDetailMeta {
    grid-template-columns: repeat(3, 1fr);
  }


  .honoureeAssociationLogos {
    grid-template-columns: repeat(3, 1fr);
  }

  .honoureeGallery,
  .relatedHonoureesGrid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .honoureeDetailHero {
    padding: 90px 0;
  }

  .honoureeProfileSection,
  .honoureeGallerySection,
  .honoureeVideoSection,
  .relatedHonourees {
    padding: 75px 0;
  }

  .honoureeProfileContent h2,
  .honoureeVideoContent h2,
  .honoureeSectionHeading h2 {
    font-size: 36px;
  }

  .honoureeAssociationLogos {
    grid-template-columns: repeat(5, 1fr);
  }

  .honoureeGallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .honoureeGalleryLarge {
    grid-row: span 1;
  }

  .honoureeGalleryLarge img {
    aspect-ratio: auto;
    min-height: 100%;
  }
}

@media (min-width: 992px) {
  .honoureeDetailHeroGrid {
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
    align-items: center;
    gap: 75px;
  }

  .honoureeDetailPortrait {
    max-width: none;
    margin: 0;
  }

  .honoureeProfileGrid {
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.55fr);
    align-items: start;
    gap: 75px;
  }

  .honoureeAwardSummary {
    position: sticky;
    top: 120px;
  }

  .honoureeVideoGrid {
    grid-template-columns: minmax(280px, 1.5fr) minmax(0, 1.35fr);
    gap: 65px;
  }

  .relatedHonoureesGrid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (hover: hover) {
  .honoureePrimaryButton:hover {
    color: var(--be-primary-dark);
    background: var(--be-gold);
    border-color: var(--be-gold);
    transform: translateY(-2px);
  }

  .honoureeOutlineButton:hover {
    color: var(--be-white);
    background: var(--be-primary);
    transform: translateY(-2px);
  }

  .honoureeGalleryItem:hover img,
  .relatedHonoureeCard:hover img {
    transform: scale(1.05);
  }

  .relatedHonoureeCard:hover {
    border-color: var(--be-gold);
    box-shadow: 0 20px 42px rgba(8, 42, 90, 0.13);
    transform: translateY(-6px);
  }

  .relatedHonoureeLink:hover {
    color: var(--be-gold-dark);
  }
}


/* ======================================================
   AWARDS GALLERY HERO
====================================================== */

.awardsGalleryHero {
  position: relative;
  min-height: 390px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--be-primary-dark);
  isolation: isolate;
}

.awardsGalleryHeroBg {
  position: absolute;
  inset: 0;
  z-index: -3;
}

.awardsGalleryHeroBg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.awardsGalleryHeroOverlay {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3, 21, 42, 0.97) 0%, rgba(3, 21, 42, 0.84) 52%, rgba(3, 21, 42, 0.42) 100%),
    linear-gradient(0deg, rgba(0, 20, 41, 0.38), transparent 60%);
  background: linear-gradient(90deg, rgba(4, 26, 56, .9) 0%, rgba(4, 26, 56, .7) 42%, rgba(4, 26, 56, .12) 78%), linear-gradient(0deg, rgba(4, 26, 56, .35), transparent 55%);
}


.awardsGalleryHero::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 45%;
  height: 3px;
  background: linear-gradient(90deg, var(--be-gold), transparent);
}

.awardsGalleryHeroContent {
  position: relative;
  z-index: 2;
  max-width: 680px;
  padding: 70px 0 105px;
}

.awardsGalleryHeroLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
}

.awardsGalleryHeroLabel::before {
  content: "";
  width: 35px;
  height: 1px;
  background: var(--be-gold);
}

.awardsGalleryHero h1 {
  margin: 0 0 14px;
  color: var(--be-white);
  font-family: Georgia, serif;
  font-size: 38px;
  line-height: 1.12;
  font-weight: 400;
  letter-spacing: -0.7px;
}

.awardsGalleryHeroContent>p {
  max-width: 610px;
  margin: 0 0 22px;
  color: rgba(255, 255, 255, 0.73);
  font-size: 14px;
  line-height: 1.75;
}

.awardsGalleryHeroYears {
  position: absolute;
  right: 15px;
  bottom: 0;
  left: 15px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  min-height: 50px;
  padding: 10px 15px;
  color: rgba(255, 255, 255, 0.73);
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(212, 179, 109, 0.25);
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
  backdrop-filter: blur(12px);
}

.awardsGalleryHeroYears span {
  font-size: 9px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-align: center;
  text-transform: uppercase;
}

.awardsGalleryHeroYears span:first-child,
.awardsGalleryHeroYears span:last-child {
  color: var(--be-gold);
  font-family: Georgia, serif;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0;
}

.awardsGalleryHeroYears i {
  width: 4px;
  height: 4px;
  flex: 0 0 4px;
  background: var(--be-gold);
  border-radius: 50%;
}

@media (min-width: 576px) {
  .awardsGalleryHero {
    min-height: 430px;
  }

  .awardsGalleryHeroContent {
    padding: 85px 0 110px;
  }

  .awardsGalleryHero h1 {
    font-size: 42px;
  }

  .awardsGalleryHeroContent>p {
    font-size: 15px;
  }

  .awardsGalleryHeroYears {
    right: auto;
    left: 50%;
    width: min(520px, calc(100% - 30px));
    transform: translateX(-50%);
  }

  .awardsGalleryHeroYears span {
    font-size: 10px;
  }
}

@media (min-width: 768px) {
  .awardsGalleryHero {
    min-height: 460px;
  }

  .awardsGalleryHeroContent {
    padding: 95px 0 115px;
  }

  .awardsGalleryHero h1 {
    font-size: 48px;
  }

  .awardsGalleryHeroContent>p {
    font-size: 16px;
  }
}

@media (min-width: 992px) {
  .awardsGalleryHero {
    min-height: 500px;
  }

  .awardsGalleryHeroContent {
    max-width: 720px;
    padding: 115px 0 125px;
  }

  .awardsGalleryHero h1 {
    font-size: 48px;
  }

  .awardsGalleryHeroLabel {
    font-size: 11px;
  }

  .awardsGalleryHeroYears {
    width: 590px;
    min-height: 58px;
  }

  .awardsGalleryHeroYears span:first-child,
  .awardsGalleryHeroYears span:last-child {
    font-size: 17px;
  }
}


/* ======================================================
   AWARD EDITIONS
====================================================== */

.awardEditionsSection {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(212, 179, 109, 0.12), transparent 25%),
    var(--be-paper);
}

.awardEditionsHead {
  display: grid;
  grid-template-columns: 1fr;
  gap: 13px;
  margin-bottom: 28px;
}

.awardEditionsLabel {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: var(--be-gold-dark);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.awardEditionsLabel::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.awardEditionsHead h2 {
  max-width: 600px;
  margin: 0;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 29px;
  line-height: 1.2;
  font-weight: 400;
}

.awardEditionsHead p {
  max-width: 560px;
  margin: 0;
  color: #686e77;
  font-size: 16px;
  line-height: 1.75;
}

.awardEditionsGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.awardEditionCard {
  overflow: hidden;
  background: var(--be-white);
  border: 1px solid rgba(0, 31, 63, 0.1);
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(0, 31, 63, 0.07);
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

.awardEditionImage {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.awardEditionImage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(0, 31, 63, 0.02) 40%, rgba(0, 31, 63, 0.72) 100%);
  transition: background 0.35s ease;
}

.awardEditionImage img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 4;
  object-fit: contain;
  transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.awardEditionYear {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  padding: 7px 12px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border-radius: 20px;
  font-family: Georgia, serif;
  font-size: 13px;
  line-height: 1;
}

.awardEditionViewIcon {
  position: absolute;
  right: 15px;
  bottom: 15px;
  z-index: 2;
  display: grid;
  width: 42px;
  height: 42px;
  color: var(--be-primary-dark);
  background: var(--be-ivory);
  border: 1px solid rgba(212, 179, 109, 0.5);
  border-radius: 50%;
  place-items: center;
  transition: color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}

.awardEditionViewIcon svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.awardEditionContent {
  padding: 18px;
}

.awardEditionContent>span {
  display: block;
  margin-bottom: 5px;
  color: var(--be-gold-dark);
  font-size: 9px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.awardEditionContent h3 {
  margin: 0 0 14px;
  font-family: Georgia, serif;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

.awardEditionContent h3 a {
  color: var(--be-primary-dark);
  text-decoration: none;
}

.awardEditionLink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--be-primary-dark);
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-decoration: none;
  text-transform: uppercase;
}

.awardEditionLink svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.awardEditionMedia {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
  margin-top: 15px;
}

.awardEditionMedia a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 37px;
  padding: 8px 10px;
  color: var(--be-primary-dark);
  background: var(--be-ivory);
  border: 1px solid rgba(0, 31, 63, 0.1);
  border-radius: 6px;
  font-size: 13px;
  line-height: 1;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease;
}

.awardEditionMedia svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke 0.3s ease;
}

.awardEditionMedia .awardVideoPlayIcon {
  fill: var(--be-gold-dark);
  stroke: none;
  transition: fill 0.3s ease;
}

.awardEditionMedia a:hover {
  color: var(--be-gold);
  background: var(--be-primary-dark);
  border-color: var(--be-primary-dark);
}

.awardEditionMedia a:hover svg {
  stroke: var(--be-gold);
}

.awardEditionMedia a:hover .awardVideoPlayIcon {
  fill: var(--be-gold);
}

@media (min-width: 576px) {
  .awardEditionsGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .awardEditionsSection {
    padding: 75px 0;
  }

  .awardEditionsHead {
    grid-template-columns: 1.05fr 0.95fr;
    align-items: end;
    gap: 45px;
    margin-bottom: 38px;
  }

  .awardEditionsHead h2 {
    font-size: 38px;
  }

  .awardEditionsHead p {
    padding-left: 25px;
    border-left: 2px solid var(--be-gold);
    font-size: 16px;
  }

  .awardEditionsGrid {
    gap: 22px;
  }
}

@media (min-width: 992px) {
  .awardEditionsSection {
    padding: 90px 0;
  }

  .awardEditionsGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
  }

  .awardEditionContent {
    padding: 21px;
  }

  .awardEditionContent h3 {
    font-size: 24px;
  }
}

@media (hover: hover) {
  .awardEditionCard:hover {
    border-color: rgba(212, 179, 109, 0.7);
    box-shadow: 0 18px 45px rgba(0, 31, 63, 0.13);
    transform: translateY(-6px);
  }

  .awardEditionCard:hover .awardEditionImage img {
    transform: scale(1.06);
  }

  .awardEditionCard:hover .awardEditionViewIcon {
    color: var(--be-gold);
    background: var(--be-primary-dark);
    transform: rotate(8deg);
  }

  .awardEditionLink:hover svg {
    transform: translateX(4px);
  }
}


/* ======================================================
   GEA 2025 PHOTO GALLERY HERO
====================================================== */

.editionGalleryHero {
  position: relative;
  min-height: 440px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--be-primary-dark);
  isolation: isolate;
}

.editionGalleryHeroBg {
  position: absolute;
  inset: 0;
  z-index: -3;
}

.editionGalleryHeroBg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.editionGalleryHeroOverlay {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3, 21, 42, 0.98) 0%, rgba(3, 21, 42, 0.89) 45%, rgba(3, 21, 42, 0.48) 100%),
    linear-gradient(0deg, rgba(0, 20, 41, 0.4), transparent 60%);
}

.editionGalleryHero::before {
  content: "2025";
  position: absolute;
  right: -10px;
  bottom: 20px;
  z-index: -1;
  color: rgba(255, 255, 255, 0.035);
  font-family: Georgia, serif;
  font-size: 125px;
  line-height: 0.8;
  font-weight: 700;
  pointer-events: none;
}

.editionGalleryHero::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42%;
  height: 3px;
  background: linear-gradient(90deg, var(--be-gold), transparent);
}

.editionGalleryHeroContent {
  position: relative;
  z-index: 2;
  max-width: 720px;
  padding: 65px 0 125px;
}

.editionGalleryBack {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 24px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 10px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0.7px;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 0.3s ease;
}

.editionGalleryBack svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.editionGalleryBack:hover {
  color: var(--be-gold);
}

.editionGalleryBack:hover svg {
  transform: translateX(-4px);
}

.editionGalleryLabel {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.editionGalleryLabel::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--be-gold);
}

.editionGalleryHero h1 {
  max-width: 650px;
  margin: 0 0 16px;
  color: var(--be-white);
  font-family: Georgia, serif;
  font-size: 36px;
  line-height: 1.12;
  font-weight: 400;
  letter-spacing: -0.6px;
}

.editionGalleryHero h1 em {
  display: block;
  color: var(--be-gold);
  font-style: normal;
}

.editionGalleryHeroContent>p {
  max-width: 620px;
  margin: 0 0 22px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 16px;
  line-height: 1.75;
}

.editionGalleryHeroInfo {
  position: absolute;
  right: 15px;
  bottom: 0;
  left: 15px;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  align-items: center;
  padding: 14px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(212, 179, 109, 0.25);
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
  backdrop-filter: blur(12px);
}

.editionGalleryHeroInfo>div {
  text-align: center;
}

.editionGalleryHeroInfo>div:last-of-type {
  display: none;
}

.editionGalleryHeroInfo>i:last-of-type {
  display: none;
}

.editionGalleryHeroInfo small,
.editionGalleryHeroInfo strong {
  display: block;
}

.editionGalleryHeroInfo small {
  margin-bottom: 5px;
  color: var(--be-gold);
  font-size: 12px;
  line-height: 1;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.editionGalleryHeroInfo strong {
  color: var(--be-white);
  font-family: Georgia, serif;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 400;
}

.editionGalleryHeroInfo i {
  width: 1px;
  height: 32px;
  background: rgba(212, 179, 109, 0.35);
}

@media (min-width: 576px) {
  .editionGalleryHero {
    min-height: 470px;
  }

  .editionGalleryHeroContent {
    padding: 80px 0 130px;
  }

  .editionGalleryHero h1 {
    font-size: 36px;
  }

  .editionGalleryHeroInfo {
    left: 50%;
    width: min(620px, calc(100% - 30px));
    grid-template-columns: 1fr 1px 1fr 1px 1fr;
    transform: translateX(-50%);
  }

  .editionGalleryHeroInfo>div:last-of-type,
  .editionGalleryHeroInfo>i:last-of-type {
    display: block;
  }
}

@media (min-width: 768px) {
  .editionGalleryHero {
    min-height: 500px;
  }

  .editionGalleryHeroContent {
    padding: 90px 0 140px;
  }

  .editionGalleryHero h1 {
    font-size: 42px;
  }

  .editionGalleryHeroContent>p {
    font-size: 16px;
  }

  .editionGalleryHeroInfo {
    width: 690px;
    padding: 17px 20px;
  }

  .editionGalleryHeroInfo strong {
    font-size: 18px;
  }
}

@media (min-width: 992px) {
  .editionGalleryHero {
    min-height: 540px;
  }

  .editionGalleryHeroContent {
    padding: 105px 0 145px;
  }

  .editionGalleryHero h1 {
    font-size: 48px;
  }

  .editionGalleryHero::before {
    right: 30px;
    bottom: 25px;
    font-size: 210px;
  }
}

/* ======================================================
   GEA 2025 PHOTO GALLERY
====================================================== */

.editionPhotosSection {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(212, 179, 109, 0.1), transparent 24%),
    var(--be-paper);
}

.editionPhotosHead {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-bottom: 28px;
}

.editionPhotosLabel {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: var(--be-gold-dark);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.editionPhotosLabel::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.editionPhotosHead .editionPhotosHeadTitle {
  max-width: 620px;
  margin: 0;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 29px;
  line-height: 1.2;
  font-weight: 400;
}

.editionPhotosHeadRight p {
  max-width: 560px;
  margin: 0 0 13px;
  color: #686e77;
  font-size: 14px;
  line-height: 1.75;
}

.editionPhotosCount {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  color: var(--be-primary-dark);
  background: var(--be-ivory);
  border: 1px solid rgba(0, 31, 63, 0.1);
  border-radius: 20px;
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
}

.editionPhotosCount svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.editionPhotosGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.editionPhotoItem {
  position: relative;
  display: block;
  min-height: 260px;
  overflow: hidden;
  background: var(--be-primary-dark);
  border: 1px solid rgba(212, 179, 109, 0.24);
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(0, 31, 63, 0.09);
  isolation: isolate;
}

.editionPhotoItem::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(0, 31, 63, 0.03) 35%, rgba(0, 31, 63, 0.9) 100%);
  transition: background 0.4s ease;
}

.editionPhotoItem::after {
  content: "";
  position: absolute;
  inset: 9px;
  z-index: 2;
  border: 1px solid transparent;
  border-radius: 9px;
  pointer-events: none;
  transition: border-color 0.35s ease;
}

.editionPhotoItem img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 260px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.editionPhotoNumber {
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 3;
  display: grid;
  width: 36px;
  height: 36px;
  color: var(--be-white);
  background: rgba(0, 31, 63, 0.72);
  border: 1px solid rgba(212, 179, 109, 0.5);
  border-radius: 50%;
  place-items: center;
  backdrop-filter: blur(7px);
  font-size: 9px;
  font-weight: 700;
}

.editionPhotoOverlay {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 3;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding: 18px;
}

.editionPhotoOverlay>div {
  min-width: 0;
}

.editionPhotoOverlay small {
  display: block;
  margin-bottom: 4px;
  color: var(--be-gold);
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.editionPhotoOverlay strong {
  display: block;
  overflow: hidden;
  color: var(--be-white);
  font-family: Georgia, serif;
  font-size: 17px;
  line-height: 1.25;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.editionPhotoView {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border-radius: 50%;
  place-items: center;
  transition: color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}

.editionPhotoView svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (min-width: 576px) {
  .editionPhotosGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .editionPhotoLarge,
  .editionPhotoWide {
    grid-column: span 2;
  }
}

@media (min-width: 768px) {
  .editionPhotosSection {
    padding: 75px 0;
  }

  .editionPhotosHead {
    grid-template-columns: 1.05fr 0.95fr;
    align-items: end;
    gap: 45px;
    margin-bottom: 38px;
  }

  .editionPhotosHead .editionPhotosHeadTitle {
    font-size: 38px;
  }

  .editionPhotosHeadRight {
    padding-left: 24px;
    border-left: 2px solid var(--be-gold);
  }

  .editionPhotosGrid {
    gap: 15px;
  }
}

@media (min-width: 992px) {
  .editionPhotosSection {
    padding: 90px 0;
  }

  .editionPhotosGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 270px;
  }

  .editionPhotoItem,
  .editionPhotoItem img {
    min-height: 0;
  }

  .editionPhotoItem img {
    aspect-ratio: auto;
  }

  .editionPhotoLarge {
    grid-column: span 2;
    grid-row: span 2;
  }

  .editionPhotoWide {
    grid-column: span 1;
  }

  .editionPhotoLarge .editionPhotoOverlay strong {
    font-size: 24px;
  }
}

@media (hover: hover) {
  .editionPhotoItem:hover::before {
    background: linear-gradient(180deg, rgba(0, 31, 63, 0.08) 25%, rgba(0, 31, 63, 0.96) 100%);
  }

  .editionPhotoItem:hover::after {
    border-color: rgba(212, 179, 109, 0.55);
  }

  .editionPhotoItem:hover img {
    transform: scale(1.06);
  }

  .editionPhotoItem:hover .editionPhotoView {
    color: var(--be-gold);
    background: var(--be-primary-dark);
    transform: rotate(8deg);
  }
}

.editionGalleryLoadMore {
  margin-top: 30px;
}

.leadingBtn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 150px;
  min-height: 44px;
  padding: 12px 22px;
  overflow: hidden;
  color: var(--be-white);
  background: var(--be-primary-dark);
  border: 1px solid var(--be-primary-dark);
  border-radius: 30px;
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 10px 25px rgba(0, 31, 63, 0.15);
  transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

.leadingBtn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 55%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.22), transparent);
  transform: skewX(-22deg);
  transition: left 0.55s ease;
}

.leadingBtn svg {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.leadingBtn:hover {
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border-color: var(--be-gold);
  box-shadow: 0 13px 30px rgba(0, 31, 63, 0.2);
  transform: translateY(-2px);
}

.leadingBtn:hover::before {
  left: 150%;
}

.leadingBtn:hover svg {
  transform: translateY(3px);
}

.leadingBtn:active {
  transform: translateY(0);
}

.leadingBtn:focus-visible {
  outline: 3px solid rgba(212, 179, 109, 0.35);
  outline-offset: 3px;
}

.leadingBtn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

#load-more-gallery {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 145px;
}

#load-more-gallery svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

#load-more-gallery:hover svg {
  transform: translateY(3px);
}

.galleryLoader {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 42px;
  color: var(--be-primary-dark);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.galleryLoader span {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(0, 31, 63, 0.18);
  border-top-color: var(--be-gold-dark);
  border-radius: 50%;
  animation: galleryLoaderSpin 0.7s linear infinite;
}

.editionPhotoItem.galleryItemHidden {
  display: none;
}

.editionPhotoItem.galleryItemVisible {
  animation: galleryItemReveal 0.5s ease both;
}

@keyframes galleryLoaderSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes galleryItemReveal {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


.editionVideoGalleryHero::before {
  content: "2025";
}

.editionVideoGalleryHero .editionGalleryHeroOverlay {
  background:
    linear-gradient(90deg, rgba(3, 21, 42, 0.98) 0%, rgba(3, 21, 42, 0.88) 45%, rgba(3, 21, 42, 0.4) 100%),
    linear-gradient(0deg, rgba(0, 20, 41, 0.48), transparent 65%);
}

/* ======================================================
   GEA 2025 VIDEO GALLERY
====================================================== */

.editionVideosSection {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(212, 179, 109, 0.1), transparent 25%),
    var(--be-paper);
}

.editionVideosHead {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-bottom: 28px;
}

.editionVideosLabel {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: var(--be-gold-dark);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.editionVideosLabel::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.editionVideosHead .editionVideosHeadTitle {
  max-width: 620px;
  margin: 0;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 29px;
  line-height: 1.2;
  font-weight: 400;
}

.editionVideosHeadRight p {
  max-width: 560px;
  margin: 0 0 13px;
  color: #686e77;
  font-size: 16px;
  line-height: 1.75;
}

.editionVideosCount {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  color: var(--be-primary-dark);
  background: var(--be-ivory);
  border: 1px solid rgba(0, 31, 63, 0.1);
  border-radius: 20px;
  font-size: 12px;
  line-height: 1;
  font-weight: 600;
}

.editionVideosCount svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.editionVideosCount svg path {
  fill: var(--be-gold-dark);
  stroke: none;
}

.editionVideosGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.editionVideoCard {
  overflow: hidden;
  background: var(--be-white);
  border: 1px solid rgba(0, 31, 63, 0.1);
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(0, 31, 63, 0.08);
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

.editionVideoThumb {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.editionVideoThumb::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 31, 63, 0.2);
  transition: background 0.35s ease;
}

.editionVideoThumb img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform 0.55s ease;
}

.editionVideoDuration {
  position: absolute;
  top: 13px;
  right: 13px;
  z-index: 3;
  padding: 7px 10px;
  color: var(--be-white);
  background: rgba(0, 31, 63, 0.82);
  border: 1px solid rgba(212, 179, 109, 0.38);
  border-radius: 20px;
  backdrop-filter: blur(6px);
  font-size: 8px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.editionVideoPlay {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  width: 58px;
  height: 58px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border: 5px solid rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  place-items: center;
  transform: translate(-50%, -50%);
  box-shadow: 0 12px 30px rgba(0, 31, 63, 0.3);
  transition: color 0.35s ease, background 0.35s ease, transform 0.35s ease;
}

.editionVideoPlay::before {
  content: "";
  position: absolute;
  inset: -11px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  animation: editionVideoPulse 1.8s infinite;
}

.editionVideoPlay svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.editionVideoContent {
  padding: 18px;
}

.editionVideoContent>span {
  display: block;
  margin-bottom: 6px;
  color: var(--be-gold-dark);
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.editionVideoContent .editionVideoContentTitle {
  margin: 0 0 15px;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 19px;
  line-height: 1.35;
  font-weight: 400;
}

.editionVideoContent>a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--be-primary-dark);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-decoration: none;
  text-transform: uppercase;
}

.editionVideoContent>a svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.editionVideoCard.videoItemHidden {
  display: none;
}

.editionVideoCard.videoItemVisible {
  animation: videoItemReveal 0.5s ease both;
}

.editionVideoLoadMore {
  margin-top: 30px;
}

@keyframes editionVideoPulse {
  from {
    opacity: 0.8;
    transform: scale(0.8);
  }

  to {
    opacity: 0;
    transform: scale(1.35);
  }
}

@keyframes videoItemReveal {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (min-width: 576px) {
  .editionVideosGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .editionVideosSection {
    padding: 75px 0;
  }

  .editionVideosHead {
    grid-template-columns: 1.05fr 0.95fr;
    align-items: end;
    gap: 45px;
    margin-bottom: 38px;
  }

  .editionVideosHead .editionVideosHeadTitle {
    font-size: 38px;
  }

  .editionVideosHeadRight {
    padding-left: 24px;
    border-left: 2px solid var(--be-gold);
  }

  .editionVideosGrid {
    gap: 22px;
  }

  .editionVideoContent {
    padding: 21px;
  }
}

@media (min-width: 992px) {
  .editionVideosSection {
    padding: 90px 0;
  }

  .editionVideosGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
  }
}

@media (hover: hover) {
  .editionVideoCard:hover {
    border-color: rgba(212, 179, 109, 0.65);
    box-shadow: 0 18px 45px rgba(0, 31, 63, 0.14);
    transform: translateY(-6px);
  }

  .editionVideoCard:hover .editionVideoThumb::before {
    background: rgba(0, 31, 63, 0.38);
  }

  .editionVideoCard:hover .editionVideoThumb img {
    transform: scale(1.06);
  }

  .editionVideoCard:hover .editionVideoPlay {
    color: var(--be-gold);
    background: var(--be-primary-dark);
    transform: translate(-50%, -50%) scale(1.08);
  }

  .editionVideoContent>a:hover svg {
    transform: translateX(4px);
  }
}

.mediaPageBanner {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 360px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.mediaPageBannerImage,
.mediaPageBannerOverlay {
  position: absolute;
  inset: 0;
}

.mediaPageBannerImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mediaPageBannerOverlay {
  z-index: 1;
  background:
    linear-gradient(90deg,
      rgba(0, 31, 63, 0.98) 0%,
      rgba(0, 31, 63, 0.9) 42%,
      rgba(0, 31, 63, 0.48) 72%,
      rgba(0, 31, 63, 0.18) 100%);
}

.mediaPageBanner .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.mediaPageBannerContent {
  max-width: 650px;
  padding: 55px 0;
}

.mediaPageBannerLabel {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 15px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.mediaPageBannerLabel::before {
  content: "";
  width: 35px;
  height: 1px;
  background: var(--be-gold);
}

.mediaPageBannerContent h1 {
  margin: 0;
  color: var(--be-white);
  font-family: Georgia, serif;
  font-size: 38px;
  line-height: 1.12;
  font-weight: 400;
}

.mediaPageBannerContent h1 em {
  display: block;
  color: var(--be-gold);
  font-weight: 400;
}

.mediaPageBannerContent p {
  max-width: 570px;
  margin: 18px 0 24px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  line-height: 1.75;
}

.mediaPageBannerLine {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  width: 55%;
  height: 4px;
  background: linear-gradient(90deg, transparent, var(--be-gold));
}

@media (min-width: 768px) {
  .mediaPageBanner {
    min-height: 430px;
  }

  .mediaPageBannerContent {
    padding: 75px 0;
  }

  .mediaPageBannerContent h1 {
    font-size: 48px;
  }

  .mediaPageBannerContent p {
    font-size: 15px;
  }
}

@media (min-width: 992px) {
  .mediaPageBanner {
    min-height: 500px;
  }

  .mediaPageBannerContent h1 {
    font-size: 48px;
  }
}

@media (max-width: 575px) {
  .mediaPageBannerOverlay {
    background: rgba(0, 31, 63, 0.83);
  }
}


.brandMediaSection {
  padding: 60px 0;
  background: var(--be-paper);
}

.brandMediaHead {
  max-width: 790px;
  margin: 0 auto 30px;
  text-align: center;
}

.brandMediaHead>span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 13px;
  color: var(--be-gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.brandMediaHead>span::before,
.brandMediaHead>span::after {
  content: "";
  width: 25px;
  height: 1px;
  background: var(--be-gold);
}

.brandMediaHead h2 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: Georgia, serif;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 400;
}

.brandMediaHead h2 em {
  display: block;
  margin-top: 3px;
  color: var(--be-gold);
  font-weight: 400;
}

.brandMediaHead p {
  max-width: 680px;
  margin: 18px auto 0;
  color: #686e77;
  font-size: 14px;
  line-height: 1.75;
}

.brandMediaFilters {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  margin-bottom: 30px;
  padding-bottom: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}

.brandMediaFilters::-webkit-scrollbar {
  display: none;
}

.brandMediaFilters button {
  flex: 0 0 auto;
  padding: 10px 16px;
  color: var(--be-primary-dark);
  background: transparent;
  border: 1px solid rgba(0, 31, 63, 0.18);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.7px;
  cursor: pointer;
  text-transform: uppercase;
  transition: 0.3s ease;
}

.brandMediaFilters button.active,
.brandMediaFilters button:hover {
  color: var(--be-white);
  background: var(--be-primary-dark);
  border-color: var(--be-primary-dark);
}

.brandMediaGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
}

.brandMediaCard {
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0, 31, 63, 0.12);
  transition: 0.35s ease;
}

.brandMediaCard.mediaHidden {
  display: none;
}

.brandMediaImage {
  position: relative;
  display: block;
  height: 250px;
  overflow: hidden;
  background: #eeeae0;
}

.brandMediaImage img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  transition: transform 0.5s ease;
}

.brandMediaBadge {
  position: absolute;
  top: 14px;
  left: 14px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  color: var(--be-white);
  background: rgba(0, 31, 63, 0.92);
  border: 1px solid rgba(212, 179, 109, 0.45);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.brandMediaBadge svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.7;
}

.brandMediaBadge .mediaPlayFill {
  fill: var(--be-gold);
  stroke: none;
}

.brandMediaAction {
  position: absolute;
  right: 14px;
  bottom: 14px;
  padding: 8px 11px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(8px);
  transition: 0.3s ease;
}

.brandMediaPlay {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border: 5px solid rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: 0.3s ease;
}

.brandMediaPlay svg {
  width: 23px;
  height: 23px;
  fill: currentColor;
  stroke: none;
}

.brandMediaContent {
  position: relative;
  min-height: 135px;
  padding: 20px;
  border-top: 3px solid var(--be-gold);
}

.brandMediaSource {
  display: block;
  margin-bottom: 9px;
  color: var(--be-gold);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.brandMediaContent h3 {
  margin: 0;
  font-family: Georgia, serif;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 400;
}

.brandMediaContent h3 a {
  color: var(--be-primary-dark);
  text-decoration: none;
  transition: color 0.3s ease;
}

.brandMediaLoadMore {
  margin-top: 35px;
  text-align: center;
}

.brandMediaLoadMore .leadingBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}

.brandMediaLoadMore .leadingBtn svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

.brandMediaCard.mediaHidden {
  display: none;
}

#load-more-media:disabled {
  opacity: 0.65;
  cursor: wait;
}


@media (min-width: 576px) {
  .brandMediaGrid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .brandMediaSection {
    padding: 80px 0;
  }

  .brandMediaHead {
    margin-bottom: 38px;
  }

  .brandMediaHead h2 {
    font-size: 40px;
  }

  .brandMediaHead p {
    font-size: 15px;
  }

  .brandMediaFilters {
    justify-content: center;
    margin-bottom: 38px;
  }

  .brandMediaImage {
    height: 285px;
  }
}

@media (min-width: 992px) {
  .brandMediaSection {
    padding: 90px 0;
  }

  .brandMediaGrid {
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
  }

  .brandMediaLarge {
    grid-column: span 2;
  }

  .brandMediaLarge .brandMediaImage {
    height: 340px;
  }

  .brandMediaImage {
    height: 300px;
  }
}

@media (hover: hover) {
  .brandMediaCard:hover {
    border-color: rgba(212, 179, 109, 0.7);
    box-shadow: 0 18px 40px rgba(0, 31, 63, 0.12);
    transform: translateY(-5px);
  }

  .brandMediaCard:hover .brandMediaImage img {
    transform: scale(1.04);
  }

  .brandMediaCard:hover .brandMediaAction {
    opacity: 1;
    transform: translateY(0);
  }

  .brandMediaCard:hover .brandMediaPlay {
    transform: translate(-50%, -50%) scale(1.08);
  }

  .brandMediaContent h3 a:hover {
    color: var(--be-gold);
  }
}

.contactPageBanner {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 360px;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.contactPageBannerImage,
.contactPageBannerOverlay {
  position: absolute;
  inset: 0;
}

.contactPageBannerImage img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.contactPageBannerOverlay {
  z-index: 1;
  background: linear-gradient(90deg,
      rgba(4, 26, 56, 0.98) 0%,
      rgba(4, 26, 56, 0.9) 42%,
      rgba(4, 26, 56, 0.48) 72%,
      rgba(4, 26, 56, 0.16) 100%);
}

.contactPageBanner .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.contactPageBannerContent {
  max-width: 680px;
  padding: 55px 0;
}

.contactPageBannerLabel {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 16px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.contactPageBannerLabel::before {
  content: "";
  flex: 0 0 35px;
  width: 35px;
  height: 1px;
  background: var(--be-gold);
}

.contactPageBannerContent h1 {
  margin: 0;
  color: var(--be-white);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 38px;
  line-height: 1.12;
  font-weight: 700;
}

.contactPageBannerContent h1 em {
  display: block;
  color: var(--be-gold);
  font-style: italic;
  font-weight: 700;
}

.contactPageBannerContent p {
  max-width: 570px;
  margin: 19px 0 25px;
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  line-height: 1.75;
}

.contactPageBannerLine {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  width: 55%;
  height: 4px;
  background: linear-gradient(90deg, transparent, var(--be-gold));
}

@media (min-width: 768px) {
  .contactPageBanner {
    min-height: 430px;
  }

  .contactPageBannerContent {
    padding: 75px 0;
  }

  .contactPageBannerContent h1 {
    font-size: 48px;
  }

  .contactPageBannerContent p {
    font-size: 16px;
  }
}

@media (min-width: 992px) {
  .contactPageBanner {
    min-height: 500px;
  }

  .contactPageBannerContent h1 {
    font-size: 48px;
  }
}

@media (max-width: 575px) {
  .contactPageBanner {
    min-height: 410px;
  }

  .contactPageBannerOverlay {
    background: rgba(4, 26, 56, 0.84);
  }

  .contactPageBannerContent h1 {
    font-size: 34px;
  }

  .contactPageBannerContent p {
    margin-top: 16px;
  }
}


/* CONTACT SECTION */

.contactConnectSection {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background: var(--be-paper);
}

.contactConnectSection::before {
  content: "";
  position: absolute;
  top: 0;
  right: -160px;
  width: 420px;
  height: 420px;
  border: 1px solid rgba(185, 141, 58, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.contactConnectSection::after {
  content: "";
  position: absolute;
  top: 65px;
  right: -110px;
  width: 290px;
  height: 290px;
  border: 1px solid rgba(185, 141, 58, 0.07);
  border-radius: 50%;
  pointer-events: none;
}

.contactConnectSection .container {
  position: relative;
  z-index: 1;
}

/* SECTION HEADING */

.contactConnectHead {
  max-width: 760px;
  margin: 0 auto 32px;
  text-align: center;
}

.contactConnectHead>span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 13px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.contactConnectHead>span::before,
.contactConnectHead>span::after {
  content: "";
  width: 25px;
  height: 1px;
  background: var(--be-gold);
}

.contactConnectHead h2 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 31px;
  line-height: 1.2;
  font-weight: 400;
}

.contactConnectHead h2 em {
  color: var(--be-gold);
  font-style: italic;
  font-weight: 400;
}

.contactConnectHead p {
  max-width: 650px;
  margin: 16px auto 0;
  color: #686e77;
  font-size: 16px;
  line-height: 1.75;
}

/* DEPARTMENT CARDS */

.contactDepartmentGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-bottom: 42px;
}

.contactDepartmentCard {
  position: relative;
  display: flex;
  align-items: center;
  gap: 15px;
  min-height: 125px;
  padding: 21px;
  overflow: hidden;
  color: var(--be-white);
  background:
    radial-gradient(circle at 100% 0,
      rgba(185, 141, 58, 0.15),
      transparent 40%),
    var(--be-primary-dark);
  border: 1px solid rgba(185, 141, 58, 0.4);
  text-decoration: none;
  transition: 0.35s ease;
}

.contactDepartmentCard::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: var(--be-gold);
}

.contactDepartmentCard::after {
  content: "";
  position: absolute;
  right: -45px;
  bottom: -55px;
  width: 125px;
  height: 125px;
  border: 1px solid rgba(185, 141, 58, 0.13);
  border-radius: 50%;
  pointer-events: none;
}

.contactDepartmentIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  color: var(--be-gold);
  background: rgba(185, 141, 58, 0.08);
  border: 1px solid rgba(185, 141, 58, 0.48);
  border-radius: 50%;
  transition: 0.3s ease;
}

.contactDepartmentIcon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.contactDepartmentCard>div:nth-child(2) {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.contactDepartmentCard span {
  display: block;
  margin-bottom: 7px;
  color: var(--be-gold);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 800;
  ;
}

.contactDepartmentCard strong {
  display: block;
  margin-bottom: 5px;
  color: var(--be-white);
  font-family: var(--be-heading);
  font-size: 22px;
  line-height: 1.3;
  font-weight: 400;
}

.contactDepartmentCard small {
  overflow-wrap: anywhere;
  color: rgba(255, 255, 255, 0.68);
  font-size: 13px;
  line-height: 1.65;
}

.contactDepartmentArrow {
  position: relative;
  z-index: 1;
  flex: 0 0 19px;
  width: 19px;
  height: 19px;
  margin-left: auto;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

/* CONTACT GRID */

.contactConnectGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}

.contactConnectInfo {
  min-width: 0;
}

.contactSectionLabel {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.contactSectionLabel::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.contactConnectInfo h2 {
  max-width: 560px;
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 29px;
  line-height: 1.2;
  font-weight: 400;
}

.contactConnectInfo h2 em {
  color: var(--be-gold);
  font-style: italic;
  font-weight: 400;
}

.contactConnectIntro {
  max-width: 550px;
  margin: 17px 0 25px;
  color: #686e77;
  font-size: 14px;
  line-height: 1.75;
}

/* CONTACT INFORMATION */

.contactInfoList {
  display: grid;
  gap: 1px;
  overflow: hidden;
  background: rgba(4, 26, 56, 0.13);
  border: 1px solid rgba(4, 26, 56, 0.13);
}

.contactInfoItem {
  display: flex;
  align-items: center;
  gap: 15px;
  min-width: 0;
  padding: 16px;
  background: var(--be-paper);
  transition: background 0.3s ease;
}

.contactAddressItem {
  align-items: flex-start;
}

.contactInfoIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  color: var(--be-gold);
  background: rgba(185, 141, 58, 0.07);
  border: 1px solid rgba(185, 141, 58, 0.35);
  border-radius: 50%;
  transition: 0.3s ease;
}

.contactInfoIcon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.contactInfoItem>div:last-child {
  min-width: 0;
}

.contactInfoItem span {
  display: block;
  margin-bottom: 0;
  color: #858990;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.contactInfoItem a {
  display: inline-block;
  overflow-wrap: anywhere;
  color: var(--be-primary-dark);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.3s ease;
}

.contactInfoItem address {
  margin: 0;
  color: var(--be-primary-dark);
  font-size: 14px;
  line-height: 1.65;
  font-style: normal;
  font-weight: 600;
}

/* GOOGLE MAP */

.contactMapBox {
  position: relative;
  height: 265px;
  margin-top: 22px;
  overflow: hidden;
  background: #e6e2d9;
  border: 1px solid rgba(4, 26, 56, 0.13);
}

.contactMapBox iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(0.15);
}

.contactMapBox>a {
  position: absolute;
  top: 13px;
  left: 13px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 12px;
  color: var(--be-primary-dark);
  background: #fff;
  border: 1px solid rgba(4, 26, 56, 0.1);
  box-shadow: 0 7px 20px rgba(4, 26, 56, 0.16);
  font-size: 9px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-decoration: none;
  text-transform: uppercase;
  transition: 0.3s ease;
}

.contactMapBox>a svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* CONTACT FORM */

.contactFormBox {
  position: relative;
  min-width: 0;
  padding: 25px 20px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(4, 26, 56, 0.12);
  box-shadow: 0 20px 50px rgba(4, 26, 56, 0.09);
}

.contactFormBox::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 85px;
  height: 3px;
  background: var(--be-gold);
}

.contactFormBox::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -75px;
  width: 180px;
  height: 180px;
  background: rgba(185, 141, 58, 0.035);
  border-radius: 50%;
  pointer-events: none;
}

.contactFormHead {
  position: relative;
  z-index: 1;
  margin-bottom: 23px;
}

.contactFormHead>span {
  display: block;
  margin-bottom: 8px;
  color: var(--be-gold);
  font-size: 9px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.contactFormHead h3 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 25px;
  line-height: 1.25;
  font-weight: 400;
}

.contactFormHead p {
  margin: 9px 0 0;
  color: #747981;
  font-size: 14px;
  line-height: 1.65;
}

.contactEnquiryForm {
  position: relative;
  z-index: 1;
}

.contactFormGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 17px;
}

.contactFormField {
  min-width: 0;
}

.contactFormField label {
  display: block;
  margin-bottom: 7px;
  color: var(--be-primary-dark);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
}

.contactFormField label sup {
  color: #a32b2b;
  font-size: 10px;
}

.contactFormField input,
.contactFormField select,
.contactFormField textarea {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 13px 14px;
  color: var(--be-primary-dark);
  background: var(--be-paper);
  border: 1px solid rgba(4, 26, 56, 0.15);
  border-radius: 4px;
  outline: none;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.45;
  transition: 0.3s ease;
}

.contactFormField input {
  height: 45px;
}

.contactFormField select {
  height: 45px;
  cursor: pointer;
}

.contactFormField textarea {
  min-height: 110px;
  resize: vertical;
}

.contactFormField input::placeholder,
.contactFormField textarea::placeholder {
  color: #999da3;
  opacity: 1;
}

.contactFormField input:focus,
.contactFormField select:focus,
.contactFormField textarea:focus {
  background: #fff;
  border-color: var(--be-gold);
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.1);
}

.contactFormField input:invalid:not(:placeholder-shown),
.contactFormField textarea:invalid:not(:placeholder-shown) {
  border-color: rgba(163, 43, 43, 0.55);
}

/* INTL TEL INPUT */

.contactFormField .iti {
  display: block;
  width: 100%;
}

.contactFormField .iti input {
  width: 100%;
}

.contactFormField .iti__selected-country-primary {
  padding: 0 9px;
}

.contactFormField .iti__country-container {
  height: 45px;
  font-size: 13px;
}

/* CONSENT */

.contactConsent {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 17px;
  color: var(--be-primary-dark);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 600;
  cursor: pointer;
}

.contactConsent input {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin: 1px 0 0;
  accent-color: var(--be-gold);
}

.contactConsent span {
  display: block;
}

/* CAPTCHA */

.contactCaptcha {
  min-height: 1px;
  margin-top: 17px;
}

.contactCaptcha .g-recaptcha {
  transform-origin: left top;
}

/* SUBMIT BUTTON */

.contactSubmitBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 45px;
  margin-top: 19px;
  padding: 12px 21px;
  color: var(--be-white);
  background: var(--be-primary-dark);
  border: 1px solid var(--be-primary-dark);
  font-family: inherit;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1px;
  cursor: pointer;
  text-transform: uppercase;
  transition: 0.3s ease;
}

.contactSubmitBtn svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: 0.3s ease;
}

.contactSubmitBtn:disabled {
  opacity: 0.6;
  cursor: wait;
}

/* TABLET */

@media (min-width: 576px) {
  .contactDepartmentGrid {
    grid-template-columns: repeat(2, 1fr);
  }

  .contactFormGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .contactFormFull {
    grid-column: 1 / -1;
  }

  .contactFormBox {
    padding: 30px;
  }
}

@media (min-width: 768px) {
  .contactConnectSection {
    padding: 75px 0;
  }

  .contactConnectHead {
    margin-bottom: 40px;
  }

  .contactConnectHead h2 {
    font-size: 40px;
  }

  .contactConnectHead p {
    font-size: 16px;
  }

  .contactDepartmentGrid {
    gap: 20px;
    margin-bottom: 55px;
  }

  .contactDepartmentCard {
    min-height: 140px;
    padding: 25px;
  }

  .contactDepartmentIcon {
    flex-basis: 54px;
    width: 54px;
    height: 54px;
  }

  .contactDepartmentCard strong {
    font-size: 20px;
  }

  .contactConnectInfo h2 {
    font-size: 38px;
  }

  .contactConnectIntro {
    font-size: 15px;
  }

  .contactInfoItem {
    padding: 18px;
  }

  .contactMapBox {
    height: 310px;
  }

  .contactFormBox {
    padding: 38px;
  }

  .contactFormHead h3 {
    font-size: 30px;
  }
}

/* DESKTOP */

@media (min-width: 992px) {
  .contactConnectSection {
    padding: 90px 0;
  }

  .contactConnectGrid {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: start;
    gap: 55px;
  }

  .contactConnectInfo {
    position: sticky;
    top: 120px;
  }

  .contactFormBox {
    padding: 42px;
  }

  .contactFormHead h3 {
    font-size: 32px;
  }
}

@media (min-width: 1200px) {
  .contactConnectGrid {
    gap: 70px;
  }

  .contactDepartmentCard {
    padding: 28px 30px;
  }

  .contactFormBox {
    padding: 45px;
  }
}

/* MOBILE CAPTCHA */

@media (max-width: 374px) {
  .contactCaptcha .g-recaptcha {
    transform: scale(0.82);
  }
}

/* HOVER EFFECTS */

@media (hover: hover) {
  .contactDepartmentCard:hover {
    border-color: var(--be-gold);
    box-shadow: 0 15px 35px rgba(4, 26, 56, 0.16);
    transform: translateY(-4px);
  }

  .contactDepartmentCard:hover .contactDepartmentIcon {
    color: var(--be-primary-dark);
    background: var(--be-gold);
    border-color: var(--be-gold);
  }

  .contactDepartmentCard:hover .contactDepartmentArrow {
    transform: translateX(5px);
  }

  .contactInfoItem:hover {
    background: #fff;
  }

  .contactInfoItem:hover .contactInfoIcon {
    color: var(--be-white);
    background: var(--be-primary-dark);
    border-color: var(--be-primary-dark);
  }

  .contactInfoItem a:hover {
    color: var(--be-gold);
  }

  .contactMapBox>a:hover {
    color: var(--be-white);
    background: var(--be-primary-dark);
  }

  .contactSubmitBtn:hover {
    color: var(--be-primary-dark);
    background: var(--be-gold);
    border-color: var(--be-gold);
  }

  .contactSubmitBtn:hover svg {
    stroke: var(--be-primary-dark);
    transform: translateX(3px);
  }
}

.placeholder {
  background: transparent;
  opacity: 1;
  display: block;
  height: auto;
}

.SumoSelect>.CaptionCont,
.SumoSelect {
  display: block;
  width: 100%;
  min-width: 0;
  color: var(--be-primary-dark);
  background: var(--be-paper);
  border: 1px solid rgba(4, 26, 56, 0.15);
  border-radius: 4px;
  outline: none;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.45;
  transition: 0.3s ease;
  height: 45px;
}

.SumoSelect {
  border: 0;
}

.SelectBox {
  padding: 0 14px;
}

.SumoSelect>.CaptionCont>label {
  margin: 0;
}

.SumoSelect>.CaptionCont>span,
.SumoSelect>.CaptionCont>span.placeholder {
  height: 45px;
  line-height: 45px;
  font-style: normal;
}

.SumoSelect.open>.CaptionCont,
.SumoSelect:focus>.CaptionCont,
.SumoSelect:hover>.CaptionCont {
  border-color: var(--be-gold);
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.1);

}

.SumoSelect>.optWrapper>.options li label {
  font-weight: normal;
}

.SumoSelect>.optWrapper>.options {
  max-height: 270px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--be-gold) #edf0f4;
}

/* Chrome, Edge, Safari */
.SumoSelect>.optWrapper>.options::-webkit-scrollbar {
  width: 7px;
}

.SumoSelect>.optWrapper>.options::-webkit-scrollbar-track {
  background: #edf0f4;
  border-radius: 10px;
}

.SumoSelect>.optWrapper>.options::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg,
      var(--be-gold),
      #96702b);
  border: 1px solid #edf0f4;
  border-radius: 10px;
}

.SumoSelect>.optWrapper>.options::-webkit-scrollbar-thumb:hover {
  background: var(--be-primary);
}

.SumoSelect>.optWrapper>.options::-webkit-scrollbar-corner {
  background: transparent;
}


/* ======================================================
   CONTACT FAQ - DARK
====================================================== */

.contactFaqSection {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 15%, rgba(185, 141, 58, 0.14), transparent 30%),
    linear-gradient(135deg, #061f43 0%, var(--be-primary-dark) 100%);
}

.contactFaqSection::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 90%;
  max-width: 1320px;
  height: 1px;
  background: linear-gradient(90deg,
      transparent,
      rgba(185, 141, 58, 0.65),
      transparent);
  transform: translateX(-50%);
}

.contactFaqSection::after {
  content: "?";
  position: absolute;
  right: -15px;
  bottom: -75px;
  color: rgba(255, 255, 255, 0.025);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 330px;
  line-height: 1;
  pointer-events: none;
}

.contactFaqSection .container {
  position: relative;
  z-index: 1;
}

.contactFaqGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 35px;
}


/* ======================================================
   FAQ CONTENT
====================================================== */

.contactFaqContent {
  max-width: 500px;
}

.contactFaqContent .contactSectionLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.contactFaqContent .contactSectionLabel::before {
  content: "";
  width: 25px;
  height: 1px;
  background: var(--be-gold);
}

.contactFaqContent h2 {
  margin: 12px 0 18px;
  color: #fff;
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 34px;
  line-height: 1.13;
  font-weight: 400;
}

.contactFaqContent h2 em {
  color: var(--be-gold);
  font-weight: 400;
  font-style: italic;
}

.contactFaqContent>p {
  max-width: 460px;
  margin: 0;
  color: rgba(255, 255, 255, 0.66);
  font-size: 16px;
  line-height: 1.75;
}


/* ======================================================
   HELP LINK
====================================================== */

.contactFaqHelp {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  margin-top: 28px;
  padding-left: 18px;
  border-left: 2px solid var(--be-gold);
}

.contactFaqHelp span {
  color: rgba(255, 255, 255, 0.55);
  font-size: 14px;
  line-height: 1.4;
  font-weight: 500;
}

.contactFaqHelp a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.3s ease;
}

.contactFaqHelp svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}


/* ======================================================
   FAQ LIST
====================================================== */

.contactFaqList {
  overflow: hidden;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(185, 141, 58, 0.3);
  border-radius: 16px;
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}

.contactFaqItem {
  position: relative;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.contactFaqItem:last-child {
  border-bottom: 0;
}


/* ======================================================
   FAQ QUESTION
====================================================== */

.contactFaqQuestion {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 68px;
  padding: 17px 16px;
  color: rgba(255, 255, 255, 0.9);
  background: transparent;
  border: 0;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  transition:
    color 0.3s ease,
    background 0.3s ease;
}

.contactFaqNumber {
  color: var(--be-white);
  font-size: 18px;
  line-height: 1;
  font-weight: 400;
}

.contactFaqIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: var(--be-gold);
  background: rgba(185, 141, 58, 0.1);
  border: 1px solid rgba(185, 141, 58, 0.35);
  border-radius: 50%;
  transition:
    color 0.3s ease,
    background 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}

.contactFaqIcon svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* ======================================================
   FAQ ANSWER
====================================================== */

.contactFaqAnswer {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  transition:
    grid-template-rows 0.4s ease,
    opacity 0.3s ease,
    visibility 0.3s ease;
}

.contactFaqAnswer>div {
  min-height: 0;
  overflow: hidden;
}

.contactFaqAnswer p {
  margin: 0;
  padding: 0 58px 0 56px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 13px;
  line-height: 1.75;
  transition: padding 0.4s ease;
}


/* ======================================================
   ACTIVE STATE
====================================================== */

.contactFaqItem.active {
  background: rgba(185, 141, 58, 0.08);
}

.contactFaqItem.active .contactFaqQuestion {
  color: #fff;
  background: linear-gradient(90deg,
      rgba(185, 141, 58, 0.16),
      rgba(185, 141, 58, 0.03));
  background: var(--be-gold);
}

.contactFaqItem.active .contactFaqIcon {
  color: var(--be-white);
  background: var(--be-primary);
  border-color: var(--be-primary-dark);
  transform: rotate(45deg);
}

.contactFaqItem.active .contactFaqAnswer {
  grid-template-rows: 1fr;
  opacity: 1;
  visibility: visible;
}

.contactFaqItem.active .contactFaqAnswer>div {
  background: linear-gradient(90deg,
      rgba(185, 141, 58, 0.16),
      rgba(185, 141, 58, 0.03));
}

.contactFaqItem.active .contactFaqAnswer p {
  padding-top: 8px;
  padding-bottom: 20px;
}


/* ======================================================
   RESPONSIVE
====================================================== */

@media (min-width: 576px) {
  .contactFaqQuestion {
    grid-template-columns: 34px minmax(0, 1fr) 34px;
    gap: 12px;
    padding-right: 20px;
    padding-left: 20px;
  }

  .contactFaqAnswer p {
    padding-right: 70px;
    padding-left: 66px;
  }
}

@media (min-width: 768px) {
  .contactFaqSection {
    padding: 75px 0;
  }

  .contactFaqSection::after {
    right: 15px;
    bottom: -95px;
    font-size: 420px;
  }

  .contactFaqGrid {
    gap: 45px;
  }

  .contactFaqContent h2 {
    font-size: 43px;
  }

  .contactFaqContent>p {
    font-size: 16px;
  }

  .contactFaqQuestion {
    grid-template-columns: 38px minmax(0, 1fr) 36px;
    gap: 14px;
    min-height: 60px;
    padding: 15px 22px;
    font-size: 16px;
  }

  .contactFaqNumber {
    font-size: 16px;
  }

  .contactFaqIcon {
    width: 36px;
    height: 36px;
  }

  .contactFaqAnswer p {
    padding-right: 25px;
    padding-left: 25px;
    font-size: 16px;
  }

  .contactFaqItem.active .contactFaqAnswer p {
    padding-bottom: 23px;
  }
}

@media (min-width: 992px) {
  .contactFaqSection {
    padding: 90px 0;
  }

  .contactFaqGrid {
    grid-template-columns: 0.75fr 1.25fr;
    align-items: start;
    gap: 70px;
  }

  .contactFaqContent {
    position: sticky;
    top: 120px;
  }

  .contactFaqContent h2 {
    font-size: 48px;
  }
}

@media (min-width: 1200px) {
  .contactFaqGrid {
    grid-template-columns: 0.72fr 1.28fr;
    gap: 90px;
  }

  .contactFaqContent h2 {
    font-size: 52px;
  }

  .contactFaqQuestion {
    padding-right: 25px;
    padding-left: 25px;
  }

  .contactFaqAnswer p {
    padding-right: 25px;
    padding-left: 25px;
  }
}


/* ======================================================
   HOVER
====================================================== */

@media (hover: hover) {
  .contactFaqQuestion:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.045);
  }

  .contactFaqQuestion:hover .contactFaqIcon {
    color: var(--be-white);
    background: var(--be-primary-dark);
    border-color: var(--be-primary);
  }

  .contactFaqHelp a:hover {
    color: var(--be-gold);
  }

  .contactFaqHelp a:hover svg {
    transform: translateX(4px);
  }
}


/* ======================================================
   REDUCED MOTION
====================================================== */

@media (prefers-reduced-motion: reduce) {

  .contactFaqAnswer,
  .contactFaqAnswer p,
  .contactFaqIcon,
  .contactFaqHelp svg {
    transition: none;
  }
}

/* ======================================================
   AWARD PLATFORM SELECTOR - MOBILE FIRST
====================================================== */

.awardPlatformSelector {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background: var(--be-paper);
}

.awardPlatformSelector::before {
  content: "";
  position: absolute;
  top: -130px;
  right: -130px;
  width: 300px;
  height: 300px;
  background: rgba(185, 141, 58, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.awardPlatformSelector .container {
  position: relative;
  z-index: 1;
}

.awardPlatformHead {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
  margin-bottom: 28px;
}

.awardSectionLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.awardSectionLabel::before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--be-gold);
}

.awardPlatformHead h2 {
  margin: 11px 0 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 34px;
  line-height: 1.13;
  font-weight: 400;
}

.awardPlatformHead h2 em {
  color: var(--be-gold);
  font-weight: 400;
  font-style: italic;
}

.awardPlatformHead>p {
  max-width: 540px;
  margin: 0;
  color: #686e77;
  font-size: 14px;
  line-height: 1.75;
}

.awardPlatformGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.awardPlatformCard {
  position: relative;
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 14px;
  min-height: 190px;
  padding: 22px 18px;
  overflow: hidden;
  color: inherit;
  background: #fff;
  border: 1px solid rgba(8, 42, 90, 0.12);
  border-radius: 14px;
  text-decoration: none;
  box-shadow: 0 12px 35px rgba(4, 26, 56, 0.06);
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;
}

.awardPlatformCard::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 0;
  background: var(--be-gold);
  transition: height 0.35s ease;
}

.awardPlatformCard.active::before {
  height: 100%;
}

.awardPlatformNumber {
  position: absolute;
  top: 13px;
  right: 15px;
  color: rgba(8, 42, 90, 0.14);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 23px;
  line-height: 1;
}

.awardPlatformLogo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  padding: 10px;
  background: var(--be-ivory);
  border: 1px solid rgba(185, 141, 58, 0.22);
  border-radius: 50%;
}

.awardPlatformLogo img {
  display: block;
  max-width: 100%;
  max-height: 48px;
  object-fit: contain;
}

.awardPlatformContent {
  min-width: 0;
}

.awardPlatformContent>span {
  display: block;
  margin-bottom: 6px;
  color: var(--be-gold);
  font-size: 9px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
}

.awardPlatformContent h3 {
  margin: 0 0 9px;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 400;
}

.awardPlatformContent p {
  margin: 0;
  color: #717680;
  font-size: 12px;
  line-height: 1.65;
}

.awardPlatformArrow {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: end;
  width: 34px;
  height: 34px;
  color: var(--be-primary-dark);
  background: var(--be-ivory);
  border: 1px solid rgba(185, 141, 58, 0.28);
  border-radius: 50%;
  transition:
    color 0.3s ease,
    background 0.3s ease,
    transform 0.3s ease;
}

.awardPlatformArrow svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* ======================================================
   ACTIVE CARD
====================================================== */

.awardPlatformCard.active {
  background:
    linear-gradient(135deg,
      rgba(255, 248, 231, 0.8),
      #fff 65%);
  border-color: rgba(185, 141, 58, 0.5);
}

.awardPlatformCard.active .awardPlatformArrow {
  color: #fff;
  background: var(--be-primary);
  border-color: var(--be-primary);
}


/* ======================================================
   RESPONSIVE
====================================================== */

@media (min-width: 576px) {
  .awardPlatformCard {
    grid-template-columns: 84px minmax(0, 1fr) 38px;
    gap: 18px;
    padding: 24px 22px;
  }

  .awardPlatformLogo {
    width: 84px;
    height: 84px;
    padding: 13px;
  }

  .awardPlatformLogo img {
    max-height: 56px;
  }

  .awardPlatformContent h3 {
    font-size: 23px;
  }

  .awardPlatformContent p {
    font-size: 13px;
  }

  .awardPlatformArrow {
    width: 38px;
    height: 38px;
  }
}

@media (min-width: 768px) {
  .awardPlatformSelector {
    padding: 75px 0;
  }

  .awardPlatformHead {
    grid-template-columns: 1.1fr 0.9fr;
    align-items: end;
    gap: 50px;
    margin-bottom: 35px;
  }

  .awardPlatformHead h2 {
    font-size: 43px;
  }

  .awardPlatformHead>p {
    font-size: 15px;
  }

  .awardPlatformGrid {
    gap: 17px;
  }
}

@media (min-width: 992px) {
  .awardPlatformSelector {
    padding: 90px 0;
  }

  .awardPlatformHead {
    margin-bottom: 42px;
  }

  .awardPlatformHead h2 {
    font-size: 48px;
  }

  .awardPlatformGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }

  .awardPlatformCard {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 370px;
    padding: 30px 26px 26px;
  }

  .awardPlatformNumber {
    top: 21px;
    right: 22px;
    font-size: 30px;
  }

  .awardPlatformLogo {
    width: 92px;
    height: 92px;
    margin-bottom: 24px;
  }

  .awardPlatformLogo img {
    max-height: 62px;
  }

  .awardPlatformContent h3 {
    min-height: 58px;
    font-size: 25px;
  }

  .awardPlatformContent p {
    font-size: 13px;
  }

  .awardPlatformArrow {
    margin-top: auto;
    align-self: flex-end;
  }
}

@media (min-width: 1200px) {
  .awardPlatformHead h2 {
    font-size: 52px;
  }

  .awardPlatformCard {
    min-height: 385px;
    padding: 34px 30px 28px;
  }

  .awardPlatformContent h3 {
    font-size: 27px;
  }
}


/* ======================================================
   HOVER
====================================================== */

@media (hover: hover) {
  .awardPlatformCard:hover {
    border-color: rgba(185, 141, 58, 0.55);
    box-shadow: 0 22px 45px rgba(4, 26, 56, 0.12);
    transform: translateY(-6px);
  }

  .awardPlatformCard:hover::before {
    height: 100%;
  }

  .awardPlatformCard:hover .awardPlatformArrow {
    color: #fff;
    background: var(--be-gold);
    transform: translateX(3px);
  }
}



/* ======================================================
   AWARD CATEGORY INTRO - MOBILE FIRST
====================================================== */

.awardCategoryIntro {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background: var(--be-paper);
}

.awardCategoryIntro::before {
  content: "";
  position: absolute;
  top: -140px;
  right: -140px;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle,
      rgba(185, 141, 58, 0.12),
      transparent 68%);
  pointer-events: none;
}

.awardCategoryIntroGrid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 35px;
}

.awardCategoryIntroContent {
  order: 2;
}

.awardSectionLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1.7px;
  text-transform: uppercase;
}

.awardSectionLabel::before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--be-gold);
}

.awardCategoryIntroContent h2 {
  margin: 12px 0 20px;
  color: var(--be-primary-dark);
  font-size: 33px;
  line-height: 1.14;
  font-weight: 400;
}

.awardCategoryIntroContent h2 em {
  color: var(--be-gold);
  font-weight: 400;
  font-style: italic;
}

.awardCategoryIntroContent p {
  margin: 0 0 14px;
  color: #686e77;
  font-size: 16px;
  line-height: 1.8;
  text-align: justify;
}

.awardCategoryIntroContent p:last-of-type {
  margin-bottom: 0;
}


/* ======================================================
   ACTION
====================================================== */

.awardCategoryIntroActions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 13px;
  margin-top: 25px;
}

.awardCategoryExploreBtn,
.awardCategoryNominateBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 18px;
  color: #fff;
  background: var(--be-primary);
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s ease;
}

.awardCategoryExploreBtn svg,
.awardCategoryNominateBtn svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.awardCategoryIntroActions>span {
  max-width: 330px;
  color: #858a92;
  font-size: 14px;
  line-height: 1.6;
}


/* ======================================================
   INTRO VISUAL
====================================================== */

.awardCategoryIntroVisual {
  position: relative;
  order: 1;
  max-width: 560px;
}

.awardCategoryImage {
  position: relative;
  overflow: hidden;
  background: var(--be-primary-dark);
  border-radius: 14px;
  box-shadow: 0 20px 45px rgba(4, 26, 56, 0.16);
}

.awardCategoryImage::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
      transparent 50%,
      rgba(4, 26, 56, 0.35));
  pointer-events: none;
}

.awardCategoryImage img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.awardCategoryImageBadge {
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 16px;
  display: flex;
  flex-direction: column;
  padding: 10px 13px;
  color: #fff;
  background: rgba(4, 26, 56, 0.9);
  border-left: 2px solid var(--be-gold);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.awardCategoryImageBadge span {
  margin-bottom: 2px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.awardCategoryImageBadge strong {
  color: var(--be-gold);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 400;
}

.awardCategoryNominateBtn {
  position: relative;
  z-index: 3;
  width: calc(100% - 30px);
  margin: -23px 15px 0;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  box-shadow: 0 12px 30px rgba(4, 26, 56, 0.18);
}


/* ======================================================
   RESPONSIVE
====================================================== */

@media (min-width: 576px) {
  .awardCategoryIntroContent h2 {
    font-size: 32px;
  }

  .awardCategoryIntroActions {
    flex-direction: row;
    align-items: center;
    gap: 18px;
  }

  .awardCategoryNominateBtn {
    width: auto;
    margin-right: 22px;
    margin-left: auto;
    padding-right: 23px;
    padding-left: 23px;
  }
}

@media (min-width: 768px) {
  .awardCategoryIntro {
    padding: 75px 0;
  }

  .awardCategoryIntroGrid {
    gap: 45px;
  }

  .awardCategoryIntroContent h2 {
    font-size: 36px;
  }

  .awardCategoryIntroContent p {
    font-size: 16px;
  }

  .awardCategoryImageBadge {
    top: 22px;
    left: 22px;
    padding: 12px 16px;
  }

  .awardCategoryImageBadge strong {
    font-size: 21px;
  }
}

@media (min-width: 992px) {
  .awardCategoryIntro {
    padding: 90px 0;
  }

  .awardCategoryIntroGrid {
    grid-template-columns: 1.12fr 0.88fr;
    display: block;
    gap: 65px;
  }

  .awardCategoryIntroContent {
    order: 1;

  }

  .awardCategoryIntroVisual {
    order: 2;
    float: right;
    margin: 0 0 20px 20px;
  }

  .awardCategoryIntroContent h2 {
    font-size: 42px;
  }
}

@media (min-width: 1200px) {
  .awardCategoryIntroGrid {
    gap: 90px;
  }

  .awardCategoryIntroContent h2 {
    font-size: 42px;
  }
}


/* ======================================================
   HOVER
====================================================== */

@media (hover: hover) {
  .awardCategoryExploreBtn:hover {
    color: var(--be-primary-dark);
    background: var(--be-gold);
  }

  .awardCategoryNominateBtn:hover {
    color: #fff;
    background: var(--be-primary);
  }

  .awardCategoryExploreBtn:hover svg,
  .awardCategoryNominateBtn:hover svg {
    transform: translateX(4px);
  }
}


/* ======================================================
   ALL AWARD CATEGORIES - MOBILE FIRST
====================================================== */

.awardSvgLibrary {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.allAwardCategories {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 92% 8%,
      rgba(185, 141, 58, 0.08),
      transparent 24%),
    var(--be-paper);
}

.allAwardCategories::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 90%;
  max-width: 1320px;
  height: 1px;
  background: linear-gradient(90deg,
      transparent,
      rgba(185, 141, 58, 0.45),
      transparent);
  transform: translateX(-50%);
}

.allAwardCategories::after {
  content: "";
  position: absolute;
  top: 150px;
  right: -170px;
  width: 340px;
  height: 340px;
  border: 1px solid rgba(185, 141, 58, 0.08);
  border-radius: 50%;
  box-shadow:
    0 0 0 45px rgba(185, 141, 58, 0.025),
    0 0 0 90px rgba(185, 141, 58, 0.015);
  pointer-events: none;
}

.allAwardCategories .container {
  position: relative;
  z-index: 1;
}


/* ======================================================
   MAIN HEADING
====================================================== */

.allAwardCategoriesHead {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
  margin-bottom: 34px;
}

.awardCategoriesLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1.7px;
  text-transform: uppercase;
}

.awardCategoriesLabel::before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--be-gold);
}

.allAwardCategoriesHead h2 {
  margin: 12px 0 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 33px;
  line-height: 1.14;
  font-weight: 400;
}

.allAwardCategoriesHead h2 em {
  color: var(--be-gold);
  font-weight: 400;
  font-style: italic;
}

.allAwardCategoriesHead>p {
  max-width: 540px;
  margin: 0;
  color: #686e77;
  font-size: 16px;
  line-height: 1.75;
}


/* ======================================================
   INFORMATION SECTIONS - NO BOX DESIGN
====================================================== */

.awardInformationBlock,
.additionalAwardCategories {
  margin: 0;
  padding: 34px 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(185, 141, 58, 0.32);
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.awardInformationBlock:first-of-type {
  padding-top: 0;
}

.additionalAwardCategories {
  border-bottom: 0;
}


/* ======================================================
   INFORMATION HEADING
====================================================== */

.awardInformationHeading {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 23px;
  padding: 0;
  border: 0;
}

.awardInformationHeading>span {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  color: var(--be-gold);
  background: transparent;
  border: 1px solid rgba(185, 141, 58, 0.58);
  border-radius: 50%;
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 13px;
  line-height: 1;
}

.awardInformationHeading div {
  min-width: 0;
}

.awardInformationHeading small {
  display: block;
  margin-bottom: 4px;
  color: #8b9098;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 700;
}

.awardInformationHeading h3 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 19px;
  line-height: 1.3;
  font-weight: 400;
}


/* ======================================================
   INFORMATION LIST GRID
====================================================== */

.awardListGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.awardInformationList {
  margin: 0;
  padding: 0;
  list-style: none;
}

.awardInformationList li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 34px;
  padding: 7px 0;
  color: #4f5661;
  border-bottom: 1px solid rgba(8, 42, 90, 0.075);
  font-size: 14px;
  line-height: 1.55;
  transition:
    color 0.25s ease,
    padding-left 0.25s ease;
}

.awardInformationList li svg {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.awardInformationList:last-child li:last-child {
  border-bottom: 0;
}


/* ======================================================
   ADDITIONAL AWARD CATEGORIES - FLAT DESIGN
====================================================== */

.additionalAwardGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.additionalAwardCard {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 22px 8px 0;
  color: var(--be-primary-dark);
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(8, 42, 90, 0.1);
  border-radius: 0;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
  text-decoration: none;
  transition:
    color 0.3s ease,
    padding-left 0.3s ease;
}

.additionalAwardCard>span {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  color: var(--be-gold);
  background: transparent;
  border: 0;
  border-radius: 0;
}

.additionalAwardCard svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.additionalAwardCard::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 4px;
  width: 7px;
  height: 7px;
  border-top: 1px solid var(--be-gold);
  border-right: 1px solid var(--be-gold);
  opacity: 0;
  transform: translate(-5px, -50%) rotate(45deg);
  transition:
    opacity 0.3s ease,
    transform 0.3s ease;
}


/* ======================================================
   CTA - OPEN DESIGN
====================================================== */

.awardCategoryCta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  margin-top: 10px;
  padding: 30px 0 0;
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(185, 141, 58, 0.38);
  border-radius: 0;
}

.awardCategoryCta div>span {
  display: block;
  margin-bottom: 6px;
  color: var(--be-gold);
  font-size: 9px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.awardCategoryCta h3 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 21px;
  line-height: 1.3;
  font-weight: 400;
}

.awardCategoryCta>a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 45px;
  padding: 0 18px;
  color: #fff;
  background: var(--be-primary);
  border: 1px solid var(--be-primary);
  font-size: 13px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition:
    color 0.3s ease,
    background 0.3s ease,
    border-color 0.3s ease;
}

.awardCategoryCta>a svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}


/* ======================================================
   RESPONSIVE - 480PX
====================================================== */

@media (min-width: 480px) {
  .additionalAwardGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 25px;
  }
}


/* ======================================================
   RESPONSIVE - 576PX
====================================================== */

@media (min-width: 576px) {

  .awardCategoryListGrid,
  .awardIndustryListGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 34px;
  }

  .awardCategoryListGrid .awardInformationList:last-child,
  .awardIndustryListGrid .awardInformationList:last-child {
    grid-column: 1 / -1;
    columns: 2;
    column-gap: 34px;
  }

  .awardCategoryListGrid .awardInformationList:last-child li,
  .awardIndustryListGrid .awardInformationList:last-child li {
    break-inside: avoid;
  }

  .awardCategoryCta {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}


/* ======================================================
   RESPONSIVE - 768PX
====================================================== */

@media (min-width: 768px) {
  .allAwardCategories {
    padding: 75px 0;
  }

  .allAwardCategoriesHead {
    grid-template-columns: 1.1fr 0.9fr;
    align-items: end;
    gap: 50px;
    margin-bottom: 42px;
  }

  .allAwardCategoriesHead h2 {
    font-size: 36px;
  }

  .allAwardCategoriesHead>p {
    font-size: 16px;
  }

  .awardInformationBlock,
  .additionalAwardCategories {
    padding: 44px 0;
  }

  .awardInformationBlock:first-of-type {
    padding-top: 0;
  }

  .awardInformationHeading {
    margin-bottom: 28px;
  }

  .awardInformationHeading>span {
    flex-basis: 42px;
    width: 42px;
    height: 42px;
    font-size: 14px;
  }

  .awardInformationHeading h3 {
    font-size: 23px;
  }

  .awardInformationList li {
    min-height: 37px;
    padding: 8px 0;
    font-size: 14px;
  }

  .additionalAwardGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 32px;
  }

  .additionalAwardCard {
    font-size: 14px;
  }

  .awardCategoryCta {
    padding-top: 36px;
  }

  .awardCategoryCta h3 {
    font-size: 26px;
  }
}


/* ======================================================
   RESPONSIVE - 992PX
====================================================== */

@media (min-width: 992px) {
  .allAwardCategories {
    padding: 90px 0;
  }

  .allAwardCategoriesHead h2 {
    font-size: 42px;
  }

  .awardCategoryListGrid,
  .awardIndustryListGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 50px;
  }

  .awardCategoryListGrid .awardInformationList:last-child,
  .awardIndustryListGrid .awardInformationList:last-child {
    grid-column: auto;
    columns: auto;
  }

  .additionalAwardGrid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 38px;
  }
}


/* ======================================================
   RESPONSIVE - 1200PX
====================================================== */

@media (min-width: 1200px) {
  .allAwardCategoriesHead h2 {
    font-size: 48px;
  }

  .awardInformationBlock,
  .additionalAwardCategories {
    padding: 50px 0;
  }

  .awardInformationBlock:first-of-type {
    padding-top: 0;
  }

  .awardInformationHeading {
    margin-bottom: 32px;
  }

  .awardInformationHeading h3 {
    font-size: 25px;
  }

  .awardListGrid {
    column-gap: 65px;
  }

  .additionalAwardGrid {
    column-gap: 45px;
  }

}


/* ======================================================
   HOVER
====================================================== */

@media (hover: hover) {
  .awardInformationList li:hover {
    padding-left: 4px;
    color: var(--be-gold);
  }

  .additionalAwardCard:hover {
    padding-left: 5px;
    color: var(--be-gold);
  }

  .additionalAwardCard:hover::after {
    opacity: 1;
    transform: translate(0, -50%) rotate(45deg);
  }

  .awardCategoryCta>a:hover {
    color: var(--be-primary-dark);
    background: var(--be-gold);
    border-color: var(--be-gold);
  }

  .awardCategoryCta>a:hover svg {
    transform: translateX(4px);
  }
}


/* ======================================================
   REDUCED MOTION
====================================================== */

@media (prefers-reduced-motion: reduce) {

  .awardInformationList li,
  .additionalAwardCard,
  .additionalAwardCard::after,
  .awardCategoryCta>a,
  .awardCategoryCta>a svg {
    transition: none;
  }
}

/* ======================================================
   AWARD SELECTION PROCESS - MOBILE FIRST
====================================================== */

.awardSelectionProcess {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 92% 10%,
      rgba(185, 141, 58, 0.09),
      transparent 25%),
    var(--be-paper);
}

.awardSelectionProcess::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 90%;
  max-width: 1320px;
  height: 1px;
  background: linear-gradient(90deg,
      transparent,
      rgba(185, 141, 58, 0.48),
      transparent);
  transform: translateX(-50%);
}

.awardSelectionProcess::after {
  content: "";
  position: absolute;
  right: -150px;
  bottom: 100px;
  width: 340px;
  height: 340px;
  border: 1px solid rgba(185, 141, 58, 0.09);
  border-radius: 50%;
  box-shadow:
    0 0 0 45px rgba(185, 141, 58, 0.02),
    0 0 0 90px rgba(185, 141, 58, 0.015);
  pointer-events: none;
}

.awardSelectionProcess .container {
  position: relative;
  z-index: 1;
}


/* ======================================================
   SECTION HEADING
====================================================== */

.selectionProcessHead {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
  margin-bottom: 35px;
}

.selectionSectionLabel {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 1.7px;
  text-transform: uppercase;
}

.selectionSectionLabel::before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--be-gold);
}

.selectionProcessHead h2 {
  margin: 12px 0 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 33px;
  line-height: 1.14;
  font-weight: 400;
}

.selectionProcessHead h2 em {
  color: var(--be-gold);
  font-weight: 400;
  font-style: italic;
}

.selectionProcessHead>p {
  max-width: 570px;
  margin: 0;
  color: #686e77;
  font-size: 14px;
  line-height: 1.75;
}


/* ======================================================
   SELECTION PROCESS GRID
====================================================== */

.selectionProcessTimeline {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.selectionProcessTimeline::before {
  display: none;
}


/* ======================================================
   PROCESS CARD
====================================================== */

.selectionProcessStep {
  position: relative;
  display: block;
  min-height: 240px;
  padding: 72px 22px 24px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(8, 42, 90, 0.11);
  border-radius: 12px;
  box-shadow: 0 14px 35px rgba(4, 26, 56, 0.07);
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;
}

.selectionProcessStep::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg,
      var(--be-gold),
      rgba(185, 141, 58, 0.18));
}

.selectionProcessStep::after {
  content: "";
  position: absolute;
  right: -45px;
  bottom: -45px;
  width: 125px;
  height: 125px;
  background: rgba(185, 141, 58, 0.055);
  border-radius: 50%;
  pointer-events: none;
}

.selectionProcessStep:nth-child(2),
.selectionProcessStep:nth-child(5) {
  background:
    linear-gradient(145deg,
      rgba(255, 248, 231, 0.88),
      #fff 70%);
  border-color: rgba(185, 141, 58, 0.34);
}


/* ======================================================
   PROCESS NUMBER
====================================================== */

.selectionStepNumber {
  position: absolute;
  z-index: 1;
  top: 17px;
  right: 19px;
  color: rgba(8, 42, 90, 0.07);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 54px;
  line-height: 1;
  font-weight: 400;
}


/* ======================================================
   PROCESS ICON
====================================================== */

.selectionStepIcon {
  position: absolute;
  z-index: 2;
  top: 20px;
  left: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  color: var(--be-gold);
  background: var(--be-ivory);
  border: 1px solid rgba(185, 141, 58, 0.45);
  border-radius: 50%;
  transition:
    color 0.3s ease,
    background 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}

.selectionStepIcon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* ======================================================
   PROCESS CONTENT
====================================================== */

.selectionStepContent {
  position: relative;
  z-index: 2;
  padding: 0;
}

.selectionStepContent>span {
  display: block;
  margin-bottom: 6px;
  color: var(--be-gold);
  font-size: 12px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.selectionStepContent h3 {
  margin: 0 0 10px;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 23px;
  line-height: 1.25;
  font-weight: 400;
}

.selectionStepContent p {
  margin: 0;
  color: #6c727c;
  font-size: 14px;
  line-height: 1.75;
}


/* ======================================================
   PROCESS DETAILS
====================================================== */

.selectionProcessDetails {
  position: relative;
  margin-top: 45px;
  padding: 35px 20px 22px;
  overflow: hidden;
  background: var(--be-primary-dark);
  border: 1px solid rgba(185, 141, 58, 0.32);
  border-radius: 14px;
  box-shadow: 0 22px 50px rgba(4, 26, 56, 0.16);
}

.selectionProcessDetails::before {
  content: "";
  position: absolute;
  top: -80px;
  right: -80px;
  width: 210px;
  height: 210px;
  background: rgba(185, 141, 58, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.selectionDetailsHeading {
  position: relative;
  z-index: 1;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.11);
}

.selectionDetailsHeading>span {
  display: block;
  margin-bottom: 7px;
  color: var(--be-gold);
  font-size: 9px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.selectionDetailsHeading h3 {
  margin: 0;
  color: #fff;
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 26px;
  line-height: 1.25;
  font-weight: 400;
}


/* ======================================================
   DETAILS LIST
====================================================== */

.selectionDetailsList {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr;
}

.selectionDetailsItem {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  padding: 15px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.selectionDetailsItem:last-child {
  border-bottom: 0;
}

.selectionDetailsItem>span {
  color: var(--be-gold);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 13px;
  line-height: 1.7;
}

.selectionDetailsItem p {
  margin: 0;
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
  line-height: 1.75;
}

.selectionDetailsItem strong {
  color: #fff;
  font-weight: 700;
}


/* ======================================================
   PROCESS NOTE
====================================================== */

.selectionProcessNote {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 20px;
  padding: 16px;
  background: rgba(185, 141, 58, 0.1);
  border-left: 3px solid var(--be-gold);
}

.selectionProcessNote svg {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  color: var(--be-gold);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.selectionProcessNote p {
  margin: 0;
  color: rgba(255, 255, 255, 0.68);
  font-size: 11px;
  line-height: 1.7;
}


/* ======================================================
   TABLET - 576PX
====================================================== */

@media (min-width: 576px) {
  .selectionProcessTimeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .selectionProcessStep {
    min-height: 255px;
  }

  .selectionProcessDetails {
    padding: 30px 25px 25px;
  }
}


/* ======================================================
   TABLET - 768PX
====================================================== */

@media (min-width: 768px) {
  .awardSelectionProcess {
    padding: 75px 0;
  }

  .selectionProcessHead {
    grid-template-columns: 1.05fr 0.95fr;
    align-items: end;
    gap: 50px;
    margin-bottom: 45px;
  }

  .selectionProcessHead h2 {
    font-size: 43px;
  }

  .selectionProcessHead>p {
    font-size: 15px;
  }

  .selectionProcessTimeline {
    gap: 20px;
  }

  .selectionProcessStep {
    min-height: 260px;
    padding: 78px 25px 27px;
  }

  .selectionStepIcon {
    top: 23px;
    left: 25px;
    width: 46px;
    height: 46px;
  }

  .selectionStepIcon svg {
    width: 22px;
    height: 22px;
  }

  .selectionStepNumber {
    top: 19px;
    right: 23px;
    font-size: 60px;
  }

  .selectionStepContent h3 {
    font-size: 25px;
  }

  .selectionStepContent p {
    font-size: 14px;
  }

  .selectionProcessDetails {
    margin-top: 60px;
    padding: 38px 32px 30px;
  }

  .selectionDetailsHeading {
    margin-bottom: 26px;
    padding-bottom: 22px;
  }

  .selectionDetailsHeading h3 {
    font-size: 33px;
  }

  .selectionDetailsList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 42px;
  }

  .selectionDetailsItem {
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 18px 0;
  }

  .selectionDetailsItem:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .selectionDetailsItem p {
    font-size: 14px;
  }

  .selectionProcessNote {
    margin-top: 26px;
    padding: 19px;
  }

  .selectionProcessNote p {
    font-size: 13px;
  }
}


/* ======================================================
   DESKTOP - 992PX
====================================================== */

@media (min-width: 992px) {
  .awardSelectionProcess {
    padding: 90px 0;
  }

  .selectionProcessHead h2 {
    font-size: 48px;
  }

  .selectionProcessTimeline {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
  }

  .selectionProcessStep {
    min-height: 275px;
    padding: 82px 27px 30px;
  }

  .selectionStepIcon {
    top: 25px;
    left: 27px;
    width: 48px;
    height: 48px;
  }

  .selectionStepNumber {
    top: 21px;
    right: 25px;
    font-size: 65px;
  }

  .selectionStepContent h3 {
    font-size: 27px;
  }

  .selectionProcessDetails {
    padding: 45px 42px 36px;
  }

  .selectionDetailsList {
    column-gap: 60px;
  }
}


/* ======================================================
   LARGE DESKTOP - 1200PX
====================================================== */

@media (min-width: 1200px) {
  .selectionProcessHead h2 {
    font-size: 52px;
  }

  .selectionProcessTimeline {
    gap: 25px;
  }

  .selectionProcessStep {
    min-height: 280px;
    padding: 86px 30px 32px;
  }

  .selectionStepIcon {
    left: 30px;
  }

  .selectionStepNumber {
    right: 28px;
    font-size: 70px;
  }

  .selectionProcessDetails {
    padding: 50px 48px 40px;
  }

  .selectionDetailsHeading h3 {
    font-size: 36px;
  }

  .selectionDetailsList {
    column-gap: 75px;
  }
}


/* ======================================================
   HOVER
====================================================== */

@media (hover: hover) {
  .selectionProcessStep:hover {
    border-color: rgba(185, 141, 58, 0.58);
    box-shadow: 0 22px 45px rgba(4, 26, 56, 0.13);
    transform: translateY(-6px);
  }

  .selectionProcessStep:hover .selectionStepIcon {
    color: #fff;
    background: var(--be-primary);
    border-color: var(--be-primary);
    transform: rotate(-6deg);
  }
}


/* ======================================================
   REDUCED MOTION
====================================================== */

@media (prefers-reduced-motion: reduce) {

  .selectionProcessStep,
  .selectionStepIcon {
    transition: none;
  }
}


/* ======================================================
   TERMS & CONDITIONS BANNER - MOBILE FIRST
====================================================== */

.legalPageBanner {
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.legalPageBannerImage,
.legalPageBannerOverlay {
  position: absolute;
  inset: 0;
}

.legalPageBannerImage img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.legalPageBannerOverlay {
  z-index: 1;
  background:
    linear-gradient(90deg,
      rgba(4, 26, 56, 0.98) 0%,
      rgba(4, 26, 56, 0.88) 52%,
      rgba(4, 26, 56, 0.45) 100%),
    linear-gradient(0deg,
      rgba(4, 26, 56, 0.58) 0%,
      transparent 60%);
}

.legalPageBanner .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.legalPageBannerContent {
  max-width: 680px;
  padding: 65px 0 52px;
}

.legalPageBannerLabel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 17px;
  color: #e0b656;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.legalPageBannerLabel::before {
  content: "";
  width: 31px;
  height: 1px;
  flex-shrink: 0;
  background: var(--be-gold);
}

.legalPageBannerContent h1 {
  margin: 0;
  color: var(--be-white, #fff);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 40px;
  line-height: 1.05;
  font-weight: 400;
  letter-spacing: -1px;
}

.legalPageBannerContent h1 em {
  color: #d8aa4e;
  font-weight: 400;
}

.legalPageBannerContent p {
  max-width: 580px;
  margin: 20px 0 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 14px;
  line-height: 1.75;
}

.legalPageBannerLine {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  width: 38%;
  height: 3px;
  background: linear-gradient(90deg,
      transparent,
      var(--be-gold));
}

/* ======================================================
   RESPONSIVE
====================================================== */

@media (min-width: 576px) {

  .legalPageBannerContent {
    padding: 80px 0 62px;
  }

  .legalPageBannerContent h1 {
    font-size: 36px;
  }

  .legalPageBannerContent p {
    font-size: 16px;
  }
}

@media (min-width: 768px) {
  .legalPageBannerContent {
    padding: 100px 0 78px;
  }

  .legalPageBannerLabel {
    margin-bottom: 21px;
    font-size: 11px;
  }

  .legalPageBannerContent h1 {
    font-size: 42px;
  }

  .legalPageBannerContent p {
    margin-top: 24px;
    font-size: 16px;
  }


}

@media (min-width: 992px) {
  .legalPageBannerContent {
    padding: 120px 0 90px;
  }

  .legalPageBannerContent h1 {
    font-size: 48px;
  }

  .legalPageBannerContent p {
    font-size: 17px;
  }
}

@media (min-width: 1200px) {
  .legalPageBannerContent h1 {
    font-size: 48px;
  }
}


/* ======================================================
   TERMS CONTENT - MOBILE FIRST
====================================================== */

.termsContentSection {
  position: relative;
  padding: 50px 0;
  background: var(--be-paper);
}

.termsContentIntro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(4, 26, 56, 0.12);
}

.termsSectionLabel {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  color: var(--be-gold);
  font-size: 10px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.termsSectionLabel::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--be-gold);
}

.termsContentIntro h2 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 30px;
  line-height: 1.18;
  font-weight: 400;
}

.termsContentIntro h2 em {
  color: var(--be-gold);
  font-weight: 400;
}

.termsContentIntro>p {
  max-width: 580px;
  margin: 0;
  color: #68717e;
  font-size: 14px;
  line-height: 1.75;
}

.termsContentLayout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  margin-top: 30px;
}


/* SIDEBAR */

.termsSidebarInner {
  padding: 22px;
  background: var(--be-primary-dark);
  border-left: 3px solid var(--be-gold);
}

.termsSidebarInner>span {
  display: block;
  margin-bottom: 16px;
  color: var(--be-gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.termsSidebar nav {
  display: grid;
  grid-template-columns: 1fr;
}

.termsSidebar a {
  position: relative;
  padding: 10px 18px 10px 0;
  color: rgba(255, 255, 255, 0.72);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 14px;
  line-height: 1.45;
  text-decoration: none;
  transition: 0.3s ease;
}

.termsSidebar a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 2px;
  width: 5px;
  height: 5px;
  border-top: 1px solid var(--be-gold);
  border-right: 1px solid var(--be-gold);
  transform: translateY(-50%) rotate(45deg);
}

.termsSidebar a:last-child {
  border-bottom: 0;
}


/* MAIN CONTENT */

.termsMainContent {
  min-width: 0;
}

.termsNotice {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  margin-bottom: 30px;
  padding: 18px;
  background: var(--be-ivory);
  border-left: 3px solid var(--be-gold);
}

.termsNotice svg {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  color: var(--be-gold);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
}

.termsNotice p {
  margin: 0;
  color: #59626e;
  font-size: 13px;
  line-height: 1.7;
}

.termsArticle {
  scroll-margin-top: 120px;
  padding: 0 0 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid rgba(4, 26, 56, 0.13);
}

.termsArticleHead {
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.termsArticleHead>span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  color: var(--be-gold);
  background: var(--be-ivory);
  border: 1px solid rgba(185, 141, 58, 0.4);
  border-radius: 50%;
  font-size: 10px;
  font-weight: 700;
}

.termsArticleHead h3 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 21px;
  line-height: 1.3;
  font-weight: 400;
}

.termsArticle p {
  margin: 0 0 15px;
  color: #626b77;
  font-size: 13px;
  line-height: 1.8;
}

.termsArticle ul {
  display: grid;
  gap: 11px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.termsArticle li {
  position: relative;
  padding-left: 21px;
  color: #626b77;
  font-size: 14px;
  line-height: 1.75;
}

.termsArticle li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 0;
  width: 7px;
  height: 7px;
  border: 1px solid var(--be-gold);
  border-radius: 50%;
}

.termsArticle strong {
  color: var(--be-primary-dark);
  font-weight: 700;
}

.termsSubSection {
  padding: 18px 0;
  border-top: 1px dashed rgba(4, 26, 56, 0.14);
}

.termsSubSection:first-of-type {
  border-top: 0;
}

.termsSubSection h4,
.termsPermissionBlock h4,
.termsRestrictionBlock h4 {
  margin: 0 0 9px;
  color: var(--be-primary-dark);
  font-size: 14px;
  line-height: 1.4;
  font-weight: 700;
}

.termsSubSection p {
  margin: 0;
}

.termsPermissionBlock,
.termsRestrictionBlock {
  margin-top: 23px;
  padding: 20px;
}

.termsPermissionBlock {
  background: var(--be-ivory);
  border-left: 3px solid var(--be-gold);
}

.termsRestrictionBlock {
  background: #f7f1ec;
  border-left: 3px solid #a55c42;
}

.termsRestrictionBlock h4 {
  color: #85422f;
}


/* PAYMENT BOX */

.termsPaymentBox {
  scroll-margin-top: 120px;
  padding: 24px;
  color: #fff;
  background:
    radial-gradient(circle at 100% 0%, rgba(185, 141, 58, 0.15), transparent 35%),
    var(--be-primary-dark);
  border-top: 3px solid var(--be-gold);
}

.termsPaymentHead>span {
  color: var(--be-gold);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.termsPaymentHead h3 {
  margin: 7px 0 10px;
  color: var(--be-white);
  font-size: 27px;
  font-weight: 400;
}

.termsPaymentHead p {
  max-width: 580px;
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  line-height: 1.7;
}

.termsBankDetails {
  display: grid;
  grid-template-columns: 1fr;
  margin: 23px 0;
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.termsBankDetails div {
  padding: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.termsBankDetails div:last-child {
  border-bottom: 0;
}

.termsBankDetails span,
.termsBankDetails strong {
  display: block;
}

.termsBankDetails span {
  margin-bottom: 4px;
  color: var(--be-gold);
  font-size: 13px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.termsBankDetails strong {
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
}

.termsPaymentBox .leadingBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 11px 20px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border: 1px solid var(--be-gold);
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  transition: 0.3s ease;
}

.termsPaymentBox .leadingBtn svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.termsPaymentBox small {
  display: block;
  max-width: 100%;
  margin-top: 14px;
  color: rgba(255, 255, 255, 0.54);
  font-size: 13px;
  line-height: 1.6;
}


/* RESPONSIVE */

@media (min-width: 576px) {
  .termsContentIntro h2 {
    font-size: 36px;
  }

  .termsBankDetails {
    grid-template-columns: repeat(2, 1fr);
  }

  .termsBankDetails div {
    border-right: 1px solid rgba(255, 255, 255, 0.12);
  }
}

@media (min-width: 768px) {
  .termsContentSection {
    padding: 70px 0;
  }

  .termsContentIntro {
    grid-template-columns: 1.05fr 0.95fr;
    align-items: end;
    gap: 50px;
    padding-bottom: 38px;
  }

  .termsContentIntro h2 {
    font-size: 43px;
  }

  .termsContentIntro>p {
    font-size: 15px;
  }

  .termsContentLayout {
    gap: 40px;
    margin-top: 40px;
  }

  .termsSidebar nav {
    grid-template-columns: repeat(2, 1fr);
    gap: 0 22px;
  }

  .termsArticle {
    padding-bottom: 38px;
    margin-bottom: 38px;
  }

  .termsArticleHead h3 {
    font-size: 24px;
  }

  .termsArticle p,
  .termsArticle li {
    font-size: 14px;
  }

  .termsPaymentBox {
    padding: 35px;
  }

  .termsPaymentHead h3 {
    font-size: 34px;
  }
}

@media (min-width: 992px) {
  .termsContentSection {
    padding: 85px 0;
  }

  .termsContentLayout {
    grid-template-columns: 245px minmax(0, 1fr);
    gap: 55px;
  }

  .termsSidebarInner {
    position: sticky;
    top: 110px;
  }

  .termsSidebar nav {
    grid-template-columns: 1fr;
  }

  .termsArticleHead {
    grid-template-columns: 46px 1fr;
  }

  .termsArticleHead>span {
    width: 46px;
    height: 46px;
  }

  .termsBankDetails {
    grid-template-columns: repeat(3, 1fr);
  }

  .termsBankDetails div {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }
}

@media (min-width: 1200px) {
  .termsContentLayout {
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 70px;
  }

  .termsContentIntro h2 {
    font-size: 48px;
  }

  .termsArticleHead h3 {
    font-size: 24px;
  }
}

@media (hover: hover) {
  .termsSidebar a:hover {
    color: var(--be-gold);
    padding-left: 6px;
  }

  .termsPaymentBox .leadingBtn:hover {
    color: #fff;
    background: transparent;
  }
}



/* ======================================================
   HOW TO PAY BANNER - MOBILE FIRST
====================================================== */

.paymentPageBanner {
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.paymentPageBannerImage,
.paymentPageBannerOverlay {
  position: absolute;
  inset: 0;
}

.paymentPageBannerImage img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.paymentPageBannerOverlay {
  z-index: 1;
  background:
    linear-gradient(90deg,
      rgba(4, 26, 56, 0.98) 0%,
      rgba(4, 26, 56, 0.9) 48%,
      rgba(4, 26, 56, 0.45) 100%),
    linear-gradient(0deg,
      rgba(4, 26, 56, 0.65) 0%,
      transparent 62%);
}

.paymentPageBanner .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.paymentPageBannerContent {
  max-width: 690px;
  padding: 65px 0 52px;
}

.paymentPageBannerContent>span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 17px;
  color: #dfb352;
  font-size: 9px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.9px;
  text-transform: uppercase;
}

.paymentPageBannerContent>span::before {
  content: "";
  width: 31px;
  height: 1px;
  flex-shrink: 0;
  background: var(--be-gold);
}

.paymentPageBannerContent h1 {
  margin: 0;
  color: #fff;
  font-size: 36px;
  line-height: 1.04;
  font-weight: 400;
  letter-spacing: -1px;
}

.paymentPageBannerContent h1 em {
  color: #d7a94b;
  font-weight: 400;
}

.paymentPageBannerContent p {
  max-width: 560px;
  margin: 19px 0 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 13px;
  line-height: 1.75;
}

.paymentPageBannerAccent {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  width: 38%;
  height: 3px;
  background: linear-gradient(90deg,
      transparent,
      var(--be-gold));
}

/* ======================================================
   RESPONSIVE
====================================================== */

@media (min-width: 576px) {
  .paymentPageBannerContent {
    padding: 80px 0 62px;
  }

  .paymentPageBannerContent h1 {
    font-size: 42px;
  }

  .paymentPageBannerContent p {
    font-size: 14px;
  }
}

@media (min-width: 768px) {

  .paymentPageBannerContent {
    padding: 100px 0 78px;
  }

  .paymentPageBannerContent>span {
    margin-bottom: 21px;
    font-size: 10px;
  }

  .paymentPageBannerContent h1 {
    font-size: 42px;
  }

  .paymentPageBannerContent p {
    margin-top: 23px;
    font-size: 16px;
  }


}

@media (min-width: 992px) {

  .paymentPageBannerContent {
    padding: 120px 0 90px;
  }

  .paymentPageBannerContent h1 {
    font-size: 48px;
  }

  .paymentPageBannerContent p {
    font-size: 17px;
  }
}

@media (min-width: 1200px) {
  .paymentPageBannerContent h1 {
    font-size: 48px;
  }
}




/* ======================================================
   HOW TO PAY - MOBILE FIRST
====================================================== */

.howToPaySection {
  position: relative;
  padding: 55px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%,
      rgba(185, 141, 58, 0.1),
      transparent 28%),
    var(--be-paper);
}

.howToPayHeading {
  max-width: 720px;
  margin-bottom: 30px;
}

.howToPayHeading>span {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  color: var(--be-gold);
  font-size: 9px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.howToPayHeading>span::before {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--be-gold);
}

.howToPayHeading h2 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 31px;
  line-height: 1.17;
  font-weight: 400;
}

.howToPayHeading h2 em {
  color: var(--be-gold);
  font-weight: 400;
}

.howToPayHeading p {
  max-width: 630px;
  margin: 16px 0 0;
  color: #68717e;
  font-size: 16px;
  line-height: 1.75;
}

.howToPayLayout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.howToPayDetails {
  display: grid;
  gap: 20px;
}


/* PAYMENT METHOD */

.paymentMethod {
  position: relative;
  padding: 23px 20px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(4, 26, 56, 0.11);
  box-shadow: 0 14px 35px rgba(4, 26, 56, 0.06);
}

.paymentMethod::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 55px;
  height: 3px;
  background: var(--be-gold);
}

.paymentMethodHead {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 22px;
}

.paymentMethodIcon {
  display: grid;
  width: 43px;
  height: 43px;
  flex: 0 0 43px;
  place-items: center;
  color: var(--be-gold);
  background: var(--be-ivory);
  border: 1px solid rgba(185, 141, 58, 0.35);
  border-radius: 50%;
}

.paymentMethodIcon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.paymentMethodHead span {
  display: block;
  margin-bottom: 3px;
  color: var(--be-gold);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.paymentMethodHead h3 {
  margin: 0;
  color: var(--be-primary-dark);
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 19px;
  line-height: 1.3;
  font-weight: 400;
}


/* BANK DETAILS */

.bankInformation {
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid rgba(4, 26, 56, 0.1);
  border-left: 1px solid rgba(4, 26, 56, 0.1);
}

.bankInformationItem {
  padding: 13px 14px;
  background: var(--be-paper);
  border-right: 1px solid rgba(4, 26, 56, 0.1);
  border-bottom: 1px solid rgba(4, 26, 56, 0.1);
}

.bankInformationItem span,
.bankInformationItem strong {
  display: block;
}

.bankInformationItem span {
  margin-bottom: 4px;
  color: #878d96;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.bankInformationItem strong {
  color: var(--be-primary-dark);
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
}

.paymentMethodNote {
  position: relative;
  margin: 17px 0 0;
  padding-left: 17px;
  color: #767d87;
  font-size: 14px;
  line-height: 1.65;
}

.paymentMethodNote::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 0;
  width: 6px;
  height: 6px;
  background: var(--be-gold);
  border-radius: 50%;
}


/* ONLINE PAYMENT */

.paymentMethodOnline {
  color: #fff;
  background:
    radial-gradient(circle at 100% 0%,
      rgba(185, 141, 58, 0.18),
      transparent 38%),
    var(--be-primary-dark);
  border-color: transparent;
}

.paymentMethodOnline .paymentMethodIcon {
  background: rgba(255, 255, 255, 0.06);
}

.paymentMethodOnline .paymentMethodHead h3 {
  color: #fff;
}

.paymentMethodOnline>p {
  max-width: 650px;
  margin: 0 0 20px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 14px;
  line-height: 1.7;
}

.paymentGatewayBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  min-height: 44px;
  padding: 11px 19px;
  color: var(--be-primary-dark);
  background: var(--be-gold);
  border: 1px solid var(--be-gold);
  font-size: 10px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-decoration: none;
  text-transform: uppercase;
  transition: 0.3s ease;
}

.paymentGatewayBtn svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/* UPI PAYMENT */

.upiPaymentBox {
  position: relative;
  padding: 23px 20px;
  overflow: hidden;
  color: #fff;
  background: var(--be-primary-dark);
  border-top: 3px solid var(--be-gold);
  box-shadow: 0 18px 40px rgba(4, 26, 56, 0.15);
}

.upiPaymentBox::after {
  content: "";
  position: absolute;
  top: -75px;
  right: -75px;
  width: 180px;
  height: 180px;
  border: 1px solid rgba(185, 141, 58, 0.16);
  border-radius: 50%;
}

.upiPaymentHead {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

.upiPaymentHead span {
  display: block;
  margin-bottom: 4px;
  color: var(--be-gold);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.upiPaymentHead h3 {
  margin: 0;
  color: #fff;
  font-family: "Libre Caslon Display", Georgia, serif;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 400;
}

.upiSecureIcon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  color: var(--be-gold);
  border: 1px solid rgba(185, 141, 58, 0.45);
  border-radius: 50%;
}

.upiSecureIcon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.upiPaymentBox>p {
  position: relative;
  z-index: 1;
  margin: 13px 0 20px;
  color: rgba(255, 255, 255, 0.65);
  font-size: 11px;
  line-height: 1.6;
}

.upiQrWrapper {
  position: relative;
  z-index: 1;
  padding: 12px;
  background: var(--be-paper);
}

.upiQrImage {
  overflow: hidden;
  background: #fff;
}

.upiQrImage img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 440px;
  object-fit: contain;
}

.upiScanLabel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding-top: 11px;
  color: var(--be-primary-dark);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.upiScanLabel svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--be-gold);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.upiApps {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 15px;
}

.upiApps span {
  padding: 6px 9px;
  color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 13px;
  font-weight: 600;
}

.upiPaymentNotice {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 17px;
  padding-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.upiPaymentNotice svg {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  color: var(--be-gold);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
}

.upiPaymentNotice p {
  margin: 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 13px;
  line-height: 1.6;
}

.upiPaymentNotice strong {
  color: #fff;
}


/* SECURITY NOTE */

.paymentSecurityNote {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 22px;
  padding: 16px 18px;
  background: var(--be-ivory);
  border-left: 3px solid var(--be-gold);
}

.paymentSecurityNote svg {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  color: var(--be-gold);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.paymentSecurityNote p {
  margin: 0;
  color: #626b77;
  font-size: 12px;
  line-height: 1.65;
}

.paymentSecurityNote a {
  color: var(--be-primary);
  font-weight: 700;
  text-decoration: none;
}


/* ======================================================
   RESPONSIVE
====================================================== */

@media (min-width: 576px) {
  .howToPayHeading h2 {
    font-size: 37px;
  }

  .bankInformation {
    grid-template-columns: repeat(2, 1fr);
  }

  .paymentMethod,
  .upiPaymentBox {
    padding: 27px;
  }
}

@media (min-width: 768px) {
  .howToPaySection {
    padding: 75px 0;
  }

  .howToPayHeading {
    margin-bottom: 38px;
  }

  .howToPayHeading h2 {
    font-size: 44px;
  }

  .howToPayHeading p {
    font-size: 16px;
  }

  .paymentMethodHead h3 {
    font-size: 23px;
  }

  .bankInformation {
    grid-template-columns: repeat(3, 1fr);
  }

  .paymentMethodOnline>p {
    font-size: 14px;
  }

  .paymentSecurityNote p {
    font-size: 13px;
  }
}

@media (min-width: 992px) {
  .howToPaySection {
    padding: 90px 0;
  }

  .howToPayLayout {
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.55fr);
    align-items: stretch;
    gap: 25px;
  }

  .paymentMethod {
    padding: 30px;
  }

  .paymentMethodBank {
    min-height: 335px;
  }

  .paymentMethodOnline {
    min-height: 225px;
  }

  .upiPaymentBox {
    padding: 30px;
  }

  .upiQrImage img {
    max-height: 390px;
  }
}

@media (min-width: 1200px) {
  .howToPayHeading h2 {
    font-size: 49px;
  }

  .howToPayLayout {
    grid-template-columns: minmax(0, 1.55fr) 390px;
    gap: 30px;
  }

  .bankInformationItem {
    padding: 16px;
  }
}

@media (hover: hover) {
  .paymentGatewayBtn:hover {
    color: #fff;
    background: transparent;
  }

  .paymentSecurityNote a:hover {
    color: var(--be-gold);
  }
}



.marketAreaBanner {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #041a38;
}

.marketAreaBanner>img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.marketAreaBannerOverlay {
  position: absolute;
  inset: 0;
  background: rgba(4, 26, 56, 0.8);
}

.marketAreaBanner .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.marketAreaBannerContent {
  max-width: 100%;
  padding: 65px 0;
  color: #fff;
  text-align: center;
}

.marketAreaBannerLabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-bottom: 14px;
  color: #d5ad5d;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.marketAreaBannerLabel::before {
  content: "";
  width: 28px;
  height: 1px;
  flex-shrink: 0;
  background: #d5ad5d;
}

.marketAreaBannerContent h1 {
  margin: 0 0 15px;
  color: #fff;
  font-size: 38px;
  font-weight: 400;
  line-height: 1.1;
  font-family: var(--be-heading-font);
}

.marketAreaBannerContent p {
  max-width: 650px;
  margin: 0 auto 25px;
  color: rgba(255, 255, 255, 0.88);
  font-size: 15px;
  line-height: 1.65;
}

.marketAreaBreadcrumb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #d5ad5d;
  font-size: 13px;
  font-weight: 600;
}

.marketAreaBreadcrumb a {
  color: #fff;
  text-decoration: none;
  transition: color 0.3s ease;
}

.marketAreaBreadcrumb a:hover {
  color: #d5ad5d;
}

/* Large Mobile */

@media (min-width: 480px) {
  .marketAreaBannerContent {
    padding: 75px 0;
  }

  .marketAreaBannerLabel {
    font-size: 13px;
    letter-spacing: 2.5px;
  }

  .marketAreaBannerLabel::before {
    width: 34px;
  }

  .marketAreaBannerContent h1 {
    font-size: 36px;
  }

  .marketAreaBannerContent p {
    font-size: 16px;
  }
}

/* Tablet */

@media (min-width: 768px) {
  .marketAreaBanner>img {
    object-position: center;
  }

  .marketAreaBannerOverlay {
    background: linear-gradient(90deg,
        rgba(4, 26, 56, 0.96) 0%,
        rgba(4, 26, 56, 0.82) 42%,
        rgba(4, 26, 56, 0.35) 75%,
        rgba(4, 26, 56, 0.1) 100%);
  }

  .marketAreaBannerContent {
    max-width: 650px;
    padding: 90px 0;
    text-align: left;
  }

  .marketAreaBannerLabel {
    justify-content: flex-start;
    gap: 12px;
    margin-bottom: 18px;
    font-size: 14px;
    letter-spacing: 3px;
  }

  .marketAreaBannerLabel::before {
    width: 42px;
  }

  .marketAreaBannerContent h1 {
    margin-bottom: 18px;
    font-size: 42px;
    line-height: 1.08;
  }

  .marketAreaBannerContent p {
    margin: 0 0 30px;
    font-size: 17px;
    line-height: 1.7;
  }

  .marketAreaBreadcrumb {
    justify-content: flex-start;
    gap: 11px;
    font-size: 14px;
  }
}

/* Desktop */

@media (min-width: 1200px) {

  .marketAreaBannerContent {
    max-width: 720px;
    padding: 100px 0;
  }

  .marketAreaBannerContent h1 {
    font-size: 48px;
  }

  .marketAreaBannerContent p {
    font-size: 18px;
  }
}




.marketAreaSection {
  position: relative;
  padding: 60px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 0 0, rgba(185, 141, 58, 0.09), transparent 22%),
    #fffdf8;
}

.marketAreaHeading {
  max-width: 100%;
  margin: 0 auto 38px;
  padding: 0 5px;
  text-align: center;
}

.marketAreaHeading>span {
  display: block;
  margin-bottom: 10px;
  color: #b98d3a;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.marketAreaHeading h2 {
  margin: 0 0 14px;
  color: #082a5a;
  font-family: var(--be-ivory);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.2;
}

.marketAreaHeading h2 em {
  display: block;
  color: #b98d3a;
  font-style: normal;
}

.marketAreaHeading p {
  max-width: 680px;
  margin: 0 auto;
  color: #626a75;
  font-size: 15px;
  line-height: 1.7;
}

.market_area {
  width: 100%;
}

.market_area h2,
.market_area h3 {
  position: relative;
  margin: 34px 0 17px;
  padding: 0 0 11px 18px;
  color: #082a5a;
  font-family: "Libre Caslon Display", serif;
  font-size: 21px;
  font-weight: 400;
  line-height: 1.35;
}

.market_area h2:first-child {
  margin-top: 0;
}

.market_area h2::before,
.market_area h3::before {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 12px;
  left: 0;
  width: 3px;
  background: #b98d3a;
}

.market_area h2::after,
.market_area h3::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg,
      rgba(185, 141, 58, 0.65),
      rgba(185, 141, 58, 0));
}

.market_area .market-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.market_area .market-list li {
  min-width: 0;
  margin: 0;
  padding: 0;
}

.market_area .market-list li a {
  position: relative;
  min-height: 45px;
  display: flex;
  align-items: center;
  padding: 11px 34px 11px 14px;
  overflow: hidden;
  border: 1px solid rgba(8, 42, 90, 0.1);
  background: #fff;
  color: #26374f;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(4, 26, 56, 0.045);
  transition:
    color 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    transform 0.3s ease;
}

.market_area .market-list li a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: #b98d3a;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.3s ease;
}

.market_area .market-list li a::after {
  content: "\2192";
  position: absolute;
  right: 13px;
  color: #b98d3a;
  font-size: 17px;
  font-weight: 400;
  transition: transform 0.3s ease;
}

.market_area .market-list li a:hover {
  border-color: rgba(185, 141, 58, 0.65);
  color: #082a5a;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(4, 26, 56, 0.09);
}

.market_area .market-list li a:hover::before {
  transform: scaleY(1);
}

.market_area .market-list li a:hover::after {
  transform: translateX(4px);
}

/* Large Mobile */

@media (min-width: 480px) {
  .marketAreaHeading h2 {
    font-size: 36px;
  }

  .marketAreaHeading h2 em {
    display: inline;
  }

  .market_area .market-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Tablet */

@media (min-width: 768px) {
  .marketAreaSection {
    padding: 80px 0;
  }

  .marketAreaHeading {
    margin-bottom: 48px;
  }

  .marketAreaHeading>span {
    font-size: 13px;
    letter-spacing: 2.5px;
  }

  .marketAreaHeading h2 {
    font-size: 42px;
  }

  .marketAreaHeading p {
    font-size: 16px;
  }

  .market_area h2,
  .market_area h3 {
    margin-top: 40px;
    padding-left: 21px;
    font-size: 23px;
  }

  .market_area h2::before,
  .market_area h3::before {
    width: 4px;
  }

  .market_area .market-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
  }

  .market_area .market-list li a {
    min-height: 45px;
    padding: 12px 38px 12px 16px;
    font-size: 14px;
  }

  .market_area .market-list li a::after {
    right: 15px;
    font-size: 18px;
  }
}

/* Desktop */

@media (min-width: 1200px) {
  .marketAreaSection {
    padding: 100px 0;
  }

  .marketAreaHeading {
    margin-bottom: 55px;
  }

  .marketAreaHeading h2 {
    font-size: 48px;
  }

  .marketAreaHeading p {
    font-size: 17px;
  }

  .market_area h2,
  .market_area h3 {
    margin: 46px 0 20px;
    padding: 0 0 13px 23px;
    font-size: 25px;
  }

  .market_area .market-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .market_area .market-list li a {
    min-height: 45px;
    padding: 13px 42px 13px 18px;
  }

  .market_area .market-list li a::after {
    right: 17px;
  }
}



/* ==========================================
   BRAND EMPOWER LOGIN HEADER
   IVORY + NAVY + GOLD | MOBILE FIRST
========================================== */

.beLoginHeader {
  position: relative;
  width: 100%;
  background: var(--be-ivory);
  border-bottom: 3px solid var(--be-primary-dark);
  font-family: var(--be-body-font);
}

.beLoginHeaderInner {
  width: 100%;
  min-height: 75px;
  padding: 10px 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

/* LOGO */

.beLoginLogo {
  flex: 0 0 auto;
}

.beLoginLogo a {
  display: inline-flex;
  align-items: center;
}

.beLoginLogo img {
  display: block;
  width: auto;
  max-width: 145px;
  max-height: 60px;
  object-fit: contain;
}

/* RIGHT SIDE */

.beLoginHeaderRight {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
}

/* SUPPORT */

.beLoginSupport {
  display: none;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  font-size: 13px;
}

.beLoginSupport span {
  color: var(--be-text);
}

.beLoginSupport a {
  color: var(--be-primary);
  font-weight: 700;
  text-decoration: none;
  transition: var(--be-transition);
}

.beLoginSupport a:hover {
  color: var(--be-gold);
}

/* MEMBER */

.beLoginMember {
  display: flex;
  align-items: center;
  gap: 12px;
}

.beLoginMember>span {
  display: none;
  color: var(--be-primary);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}

/* BUTTON */

.beLoginBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 15px;

  background: var(--be-gold);
  border: 1px solid var(--be-gold);
  border-radius: 2px;

  color: var(--be-white);
  font-family: var(--be-body-font);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;

  transition: var(--be-transition);
}

.beLoginBtn:hover {
  background: var(--be-gold-dark);
  border-color: var(--be-gold-dark);
  color: var(--be-white);
}

/* TABLET */

@media (min-width: 576px) {

  .beLoginHeaderInner {
    padding: 10px 25px;
  }

  .beLoginLogo img {
    max-width: 170px;
  }

  .beLoginSupport {
    display: flex;
  }
}

/* DESKTOP */

@media (min-width: 992px) {

  .beLoginHeaderInner {
    min-height: 85px;
    padding: 8px 40px;
  }

  .beLoginLogo img {
    max-width: 200px;
    max-height: 70px;
  }

  .beLoginHeaderRight {
    gap: 20px;
  }

  .beLoginSupport {
    font-size: 14px;
  }

  .beLoginMember>span {
    display: inline-block;
    font-size: 14px;
  }

  .beLoginBtn {
    min-height: 40px;
    padding: 0 18px;
    font-size: 12px;
  }
}



.loginPageBanner {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #041a38;
}

.loginPageBannerImage,
.loginPageBannerImage img,
.loginPageBannerOverlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.loginPageBannerImage img {
  display: block;
  object-fit: cover;
  object-position: center;
}

.loginPageBannerOverlay {
  background: rgba(4, 26, 56, 0.91);
}

.loginPageBanner .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.loginPageBannerGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 38px;
  padding: 65px 0;
}

/* LEFT CONTENT */

.loginPageBannerContent {
  color: #fff;
  text-align: center;
}

.loginPageBannerContent>span,
.loginPageFormLabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-bottom: 14px;
  color: #d5ad5d;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.loginPageBannerContent>span::before,
.loginPageFormLabel::before {
  content: "";
  width: 28px;
  height: 1px;
  flex-shrink: 0;
  background: currentColor;
}

.loginPageBannerContent h1 {
  max-width: 620px;
  margin: 0 auto 18px;
  color: #fff;
  font-family: "Libre Caslon Display", serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.12;
}

.loginPageBannerContent h1 em {
  color: #d5ad5d;
  font-style: normal;
}

.loginPageBannerIntro {
  max-width: 560px;
  margin: 0 auto 24px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 1.7;
}

.loginPageBannerIntro strong {
  color: #fff;
}

.loginPageBenefits {
  max-width: 520px;
  display: grid;
  gap: 11px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  text-align: left;
}

.loginPageBenefits li {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

.loginPageBenefits li svg {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  padding: 5px;
  border: 1px solid rgba(213, 173, 93, 0.55);
  border-radius: 50%;
  fill: none;
  stroke: #d5ad5d;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.loginPageClosing {
  max-width: 560px;
  display: block;
  margin: 24px auto 0;
  color: #fff;
  font-size: 14px;
  line-height: 1.6;
}

/* FORM CARD */

.loginPageFormCard {
  position: relative;
  padding: 30px 22px;
  overflow: hidden;
  border-top: 4px solid #b98d3a;
  border-radius: 5px;
  background: #fffdf8;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.25);
}

.loginPageFormCard::after {
  content: "";
  position: absolute;
  right: -75px;
  bottom: -75px;
  width: 170px;
  height: 170px;
  border: 1px solid rgba(185, 141, 58, 0.16);
  border-radius: 50%;
  pointer-events: none;
}

.loginPageFormLabel {
  position: relative;
  z-index: 1;
  justify-content: flex-start;
  margin-bottom: 10px;
  color: #b98d3a;
  letter-spacing: 1.5px;
}

.loginPageFormLabel::before {
  width: 24px;
}

.loginPageFormCard h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 9px;
  color: #082a5a;
  font-family: "Libre Caslon Display", serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.25;
}

.loginPageFormCard p,
#emailLoginSection>p {
  position: relative;
  z-index: 1;
  margin: 0 0 24px;
  color: #667080;
  font-size: 14px;
  line-height: 1.65;
}

.loginPageForm {
  position: relative;
  z-index: 1;
}

.loginPageField label {
  display: block;
  margin-bottom: 8px;
  color: #26364d;
  font-size: 13px;
  font-weight: 700;
}

.loginPageField label span {
  color: red;
  font-weight: normal;
}

.loginPageBannerGrid {
  position: relative;
}

.loginPageBannerGrid>svg {
  position: absolute;
  top: 50%;
  left: 15px;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #b98d3a;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: translateY(-50%);
  pointer-events: none;
}

.loginPageBannerGrid input {
  width: 100%;
  height: 54px;
  padding: 0 15px 0 45px;
  border: 1px solid #d8dce2;
  border-radius: 3px;
  outline: none;
  background: #fff;
  color: #1f2937;
  font: inherit;
  font-size: 14px;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.loginPageBannerGrid input::placeholder {
  color: #979da7;
}

.loginPageBannerGrid input:focus {
  border-color: #b98d3a;
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.12);
}

.loginPageSubmit {
  width: 100%;
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 14px;
  padding: 12px 20px;
  border: 1px solid #b98d3a;
  border-radius: 3px;
  background: #b98d3a;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.3s ease, border-color 0.3s ease;
}

.loginPageSubmit svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.loginPageSubmit:hover {
  border-color: #082a5a;
  background: #082a5a;
}

.loginPageSubmit:hover svg {
  transform: translateX(4px);
}

.loginPageSubmit:disabled {
  opacity: .65;
  cursor: not-allowed;
}

.loginPageSecure {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 17px;
  color: #737b87;
  font-size: 12px;
  text-align: center;
}

.loginPageSecure svg {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  fill: none;
  stroke: #b98d3a;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ERRORS */

.loginPageError,
.otpError {
  margin-top: 6px;
  color: #c63b3b;
  font-size: 12px;
  line-height: 1.4;
}

/* OTP */

.loginOtpVerification {
  position: relative;
  z-index: 1;
}

.backWithOtp {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 13px;
}

.backWithOtp strong {
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.3;
}

.backBtn2 {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--be-border);
  border-radius: 50%;
  background: var(--be-paper);
  color: var(--be-primary);
  cursor: pointer;
  transition: var(--be-transition);
}

.backBtn2:hover {
  border-color: var(--be-primary);
  background: var(--be-primary);
  color: var(--be-white);
}

.oneTimeText {
  margin: 0 0 20px;
  color: #667080;
  font-size: 13px;
  line-height: 1.7;
}

.otpViewEmail {
  color: var(--be-primary);
  font-weight: 700;
}

.otpInputs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}

.loginPageBannerGrid input.otp-input {
  width: 100%;
  height: 54px;
  padding: 0;
  border: 1px solid #d8dce2;
  border-radius: 4px;
  outline: none;
  background: #fff;
  color: var(--be-primary);
  font-family: var(--be-body-font);
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.otp-input:focus {
  border-color: var(--be-gold);
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.12);
}

.didnotReceive {
  margin-top: 5px;
}

.didnotReceive p {
  margin: 0;
  color: var(--be-muted);
  font-size: 12px;
  line-height: 1.6;
}

.resendOtpButton {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--be-gold);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: var(--be-transition);
}

.resendOtpButton:hover {
  color: var(--be-primary);
}

.resendOtpButton:disabled {
  color: #a9adb3;
  cursor: default;
}

#timer {
  margin-left: 3px;
  color: var(--be-muted);
}

/* BOTTOM ACCENT */

.loginPageBannerAccent {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 3;
  height: 4px;
  background: linear-gradient(90deg,
      transparent,
      #b98d3a 30%,
      #d5ad5d 50%,
      #b98d3a 70%,
      transparent);
}

/* RESPONSIVE */

@media (min-width: 576px) {
  .loginPageBannerGrid {
    padding: 75px 0;
  }

  .loginPageBannerContent>span,
  .loginPageFormLabel {
    font-size: 12px;
    letter-spacing: 2.5px;
  }

  .loginPageBannerContent h1 {
    font-size: 42px;
  }

  .loginPageFormCard {
    padding: 36px 32px;
  }
}

@media (min-width: 768px) {
  .loginPageBannerContent h1 {
    font-size: 48px;
  }

  .loginPageBannerIntro {
    font-size: 16px;
  }

  .loginPageBenefits li {
    font-size: 15px;
  }

  .loginPageFormCard {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
  }
}

@media (min-width: 992px) {
  .loginPageBannerOverlay {
    background: linear-gradient(90deg,
        rgba(4, 26, 56, 0.98) 0%,
        rgba(4, 26, 56, 0.94) 42%,
        rgba(4, 26, 56, 0.84) 68%,
        rgba(4, 26, 56, 0.9) 100%);
  }

  .loginPageBannerGrid {
    grid-template-columns: 1.30fr 0.70fr;
    align-items: center;
    gap: 28px;
    padding: 70px 0;
  }

  .loginPageBannerContent {
    text-align: left;
  }

  .loginPageBannerContent>span {
    justify-content: flex-start;
  }

  .loginPageBannerContent h1,
  .loginPageBannerIntro,
  .loginPageBenefits,
  .loginPageClosing {
    margin-left: 0;
    margin-right: 0;
  }

  .loginPageBannerContent h1 {
    font-size: 48px;
  }

  .loginPageFormCard {
    max-width: 100%;
    margin: 0;
  }
}

@media (min-width: 1200px) {
  .loginPageBannerGrid {
    grid-template-columns: 1.30fr 0.70fr;
    gap: 40px;
    padding: 60px 0;
  }

  .loginPageBannerContent h1 {
    font-size: 48px;
  }

  .loginPageFormCard {
    padding: 30px;
  }

  .loginPageFormCard h2 {
    font-size: 30px;
  }
}

@media (min-width: 1400px) {
  .loginPageBannerGrid {
    grid-template-columns: 1.30fr 0.70fr;
    gap: 50px;
  }

  .loginPageBannerContent h1 {
    font-size: 48px;
  }
}

@media (max-width: 575px) {
  .otpInputs {
    gap: 7px;
  }

  .otp-input {
    height: 48px;
    font-size: 18px;
  }

  .backWithOtp strong {
    font-size: 20px;
  }
}


/* =========================================================
   HOW BRAND EMPOWER WORKS - IVORY THEME
========================================================= */

.loginHowWorks {
  position: relative;
  padding: 60px 0;
  overflow: hidden;
  background: var(--be-ivory);
}

.loginHowWorks::before {
  content: "";
  position: absolute;
  top: -140px;
  left: -140px;
  width: 340px;
  height: 340px;
  border: 1px solid rgba(185, 141, 58, 0.14);
  border-radius: 50%;
  pointer-events: none;
}

.loginHowWorks::after {
  content: "";
  position: absolute;
  right: -100px;
  bottom: -100px;
  width: 260px;
  height: 260px;
  border: 1px solid rgba(8, 42, 90, 0.06);
  border-radius: 50%;
  pointer-events: none;
}

/* HEADING */

.loginHowWorksHeading {
  position: relative;
  z-index: 1;
  max-width: 820px;
  margin: 0 auto 34px;
  text-align: center;
}

.loginHowWorksHeading>span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.loginHowWorksHeading>span::before,
.loginHowWorksHeading>span::after {
  content: "";
  width: 24px;
  height: 1px;
  background: var(--be-gold);
}

.loginHowWorksHeading h2 {
  margin: 0 0 13px;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.15;
}

.loginHowWorksHeading h2 em {
  color: var(--be-gold-dark);
  font-style: normal;
}

.loginHowWorksHeading p {
  max-width: 760px;
  margin: 0 auto;
  color: var(--be-muted);
  font-size: 16px;
  line-height: 1.8;
}

/* GRID */

.loginHowWorksGrid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

/* CARD */

.loginHowWorksCard {
  position: relative;
  min-height: 100%;
  padding: 22px 18px;
  overflow: hidden;
  border: 1px solid var(--be-border);
  border-radius: 5px;
  background: var(--be-paper);
  box-shadow: 0 8px 25px rgba(8, 42, 90, 0.04);
  transition: var(--be-transition);
}

.loginHowWorksCard::before {
  content: "";
  position: absolute;
  right: -45px;
  bottom: -45px;
  width: 100px;
  height: 100px;
  border: 1px solid rgba(185, 141, 58, 0.10);
  border-radius: 50%;
  pointer-events: none;
  transition: var(--be-transition);
}

.loginHowWorksCard:hover {
  border-color: rgba(185, 141, 58, 0.55);
  box-shadow: 0 16px 35px rgba(8, 42, 90, 0.08);
  transform: translateY(-4px);
}

.loginHowWorksCard:hover::before {
  width: 125px;
  height: 125px;
}

/* STEP */

.loginHowWorksStep {
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px 11px;
  border-radius: 0 4px 0 8px;
  background: var(--be-gold);
  color: var(--be-white);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

/* ICON */

.loginHowWorksIcon {
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 17px;
  border: 1px solid rgba(185, 141, 58, 0.30);
  border-radius: 4px;
  background: rgba(185, 141, 58, 0.07);
}

.loginHowWorksIcon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: var(--be-gold-dark);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* CONTENT */

.loginHowWorksCard h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 7px;
  color: var(--be-primary);
  font-family: var(--be-body-font);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
}

.loginHowWorksCard p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.7;
}

/* =========================================================
   576px+
========================================================= */

@media (min-width: 576px) {
  .loginHowWorks {
    padding: 70px 0;
  }

  .loginHowWorksHeading h2 {
    font-size: 36px;
  }

  .loginHowWorksGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}

/* =========================================================
   768px+
========================================================= */

@media (min-width: 768px) {
  .loginHowWorksHeading {
    margin-bottom: 38px;
  }

  .loginHowWorksHeading h2 {
    font-size: 40px;
  }

  .loginHowWorksHeading p {
    font-size: 16px;
  }

  .loginHowWorksCard {
    padding: 24px 20px;
  }
}

/* =========================================================
   992px+
========================================================= */

@media (min-width: 992px) {
  .loginHowWorks {
    padding: 80px 0;
  }

  .loginHowWorksHeading h2 {
    font-size: 44px;
  }

  .loginHowWorksGrid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
}

/* =========================================================
   1200px+
========================================================= */

@media (min-width: 1200px) {
  .loginHowWorks {
    padding: 90px 0;
  }

  .loginHowWorksHeading h2 {
    font-size: 46px;
  }

  .loginHowWorksCard {
    padding: 26px 22px;
  }
}


.registrationPage {
  position: relative;
  min-height: 100vh;
  padding: 42px 0;
  overflow: hidden;
  background: var(--be-primary-dark);
}

.registrationPageBg,
.registrationPageBg img,
.registrationPageOverlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.registrationPageBg img {
  display: block;
  object-fit: cover;
  object-position: center;
}

.registrationPageOverlay {
  background: linear-gradient(135deg,
      rgba(4, 26, 56, 0.98),
      rgba(8, 42, 90, 0.94));
}

.registrationPage .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.registrationPageWrap {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

.registrationPageHeading {
  max-width: 700px;
  margin: 0 auto 26px;
  text-align: center;
}

.registrationPageHeading>span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-bottom: 10px;
  color: var(--be-gold-light);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.registrationPageHeading>span::before,
.registrationPageHeading>span::after {
  content: "";
  width: 20px;
  height: 1px;
  background: currentColor;
}

.registrationPageHeading h1 {
  margin: 0 0 10px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.15;
}

.registrationPageHeading h1 em {
  color: var(--be-gold-light);
  font-style: normal;
}

.registrationPageHeading p {
  max-width: 560px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  line-height: 1.6;
}

/* CARD */

.registrationPageCard {
  padding: 22px 16px;
  border-top: 4px solid var(--be-gold);
  border-radius: 6px;
  background: var(--be-paper);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.25);
}

/* CARD TOP */

.registrationCardTop {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding-bottom: 20px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--be-border);
}

.registrationLabel {
  display: block;
  margin-bottom: 6px;
  color: var(--be-gold-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.registrationCardTop h2 {
  margin: 0 0 5px;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 25px;
  font-weight: 400;
  line-height: 1.2;
}

.registrationCardTop p {
  margin: 0;
  color: var(--be-muted);
  font-size: 13px;
  line-height: 1.6;
}

.registrationVerifiedEmail {
  width: 100%;
  min-width: 0;
  padding: 11px 13px;
  border: 1px solid rgba(185, 141, 58, 0.28);
  border-radius: 4px;
  background: rgba(185, 141, 58, 0.06);
}

.registrationVerifiedEmail small {
  display: block;
  margin-bottom: 3px;
  color: var(--be-muted);
  font-size: 9px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.registrationVerifiedEmail strong {
  display: block;
  color: var(--be-primary);
  font-size: 12px;
  line-height: 1.4;
  word-break: break-all;
}

/* FORM GRID */

.registrationFormGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 15px;
}

.registrationField label {
  display: block;
  margin-bottom: 7px;
  color: #26364d;
  font-size: 12px;
  font-weight: 700;
}

.registrationField label span {
  color: #d22;
}

.registrationField input,
.registrationField select,
.occupationFields input,
.occupationFields select {
  width: 100%;
  height: 45px;
  padding: 0 13px;
  border: 1px solid #d8dce2;
  border-radius: 4px;
  outline: none;
  background: var(--be-white);
  color: #1f2937;
  font-family: var(--be-body-font);
  font-size: 13px;
  transition: var(--be-transition);
}

.registrationField input::placeholder,
.occupationFields input::placeholder {
  color: #979da7;
}

.registrationField input:focus,
.registrationField select:focus,
.occupationFields input:focus,
.occupationFields select:focus {
  border-color: var(--be-gold);
  box-shadow: 0 0 0 3px rgba(185, 141, 58, 0.1);
}

/* OCCUPATION */

.registrationOccupation {
  margin-top: 24px;
}

.registrationSectionTitle {
  margin-bottom: 13px;
}

.registrationSectionTitle h3 {
  margin: 0 0 4px;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.25;
}

.registrationSectionTitle p {
  margin: 0;
  color: var(--be-muted);
  font-size: 13px;
  line-height: 1.5;
}

.occupationRadioGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
}

.occupationRadio {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--be-border);
  border-radius: 4px;
  background: var(--be-white);
  cursor: pointer;
  transition: var(--be-transition);
}

.occupationRadio:hover {
  border-color: rgba(185, 141, 58, 0.55);
}

.occupationRadio:has(input:checked) {
  border-color: var(--be-gold);
  background: rgba(185, 141, 58, 0.06);
}

.occupationRadio input {
  flex: 0 0 auto;
  margin-top: 3px;
  accent-color: var(--be-gold);
}

.occupationRadio span {
  min-width: 0;
}

.occupationRadio strong {
  display: block;
  margin-bottom: 2px;
  color: var(--be-primary);
  font-size: 14px;
  line-height: 1.4;
}

.occupationRadio small {
  display: block;
  color: var(--be-muted);
  font-size: 12px;
  line-height: 1.45;
}

.occupationFields {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

/* AGREEMENT */

.registrationAgreement {
  display: grid;
  gap: 10px;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--be-border);
}

.registrationAgreement label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  color: var(--be-muted);
  font-size: 14px;
  line-height: 1.55;
  cursor: pointer;
}

.registrationAgreement input {
  flex: 0 0 auto;
  margin-top: 3px;
  accent-color: var(--be-gold);
}

.registrationAgreement a {
  color: var(--be-gold-dark);
  font-weight: 600;
  text-decoration: none;
}

.registrationAgreement a:hover {
  color: var(--be-primary);
}

/* ERROR */

.registrationError {
  min-height: 18px;
  margin-top: 10px;
  color: #c63b3b;
  font-size: 11px;
  line-height: 1.4;
}

/* SUBMIT */

.registrationSubmit {
  width: 100%;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
  padding: 11px 18px;
  border: 1px solid var(--be-gold);
  border-radius: 3px;
  background: var(--be-gold);
  color: var(--be-white);
  font-family: var(--be-body-font);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: var(--be-transition);
}

.registrationSubmit:hover {
  border-color: var(--be-primary);
  background: var(--be-primary);
}

.registrationSubmit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.registrationSubmit svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.registrationSubmit:hover svg {
  transform: translateX(3px);
}

/* =========================================================
   576px+
========================================================= */

@media (min-width: 576px) {
  .registrationPage {
    padding: 50px 0;
  }

  .registrationPageHeading {
    margin-bottom: 30px;
  }

  .registrationPageHeading>span {
    font-size: 11px;
    letter-spacing: 1.8px;
  }

  .registrationPageHeading>span::before,
  .registrationPageHeading>span::after {
    width: 24px;
  }

  .registrationPageHeading h1 {
    font-size: 36px;
  }

  .registrationPageHeading p {
    font-size: 14px;
  }

  .registrationPageCard {
    padding: 28px 24px;
  }

  .registrationCardTop h2 {
    font-size: 28px;
  }

  .registrationFormGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .occupationRadioGrid {
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
}

/* =========================================================
   768px+
========================================================= */

@media (min-width: 768px) {
  .registrationPage {
    padding: 60px 0;
  }

  .registrationPageHeading h1 {
    font-size: 40px;
  }

  .registrationPageCard {
    padding: 32px;
  }

  .registrationCardTop {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
  }

  .registrationVerifiedEmail {
    width: auto;
    min-width: 220px;
    max-width: 300px;
  }

  .registrationField input,
  .registrationField select,
  .occupationFields input,
  .occupationFields select {
    height: 45px;
  }


  .registrationSectionTitle h3 {
    font-size: 21px;
  }
}

/* =========================================================
   992px+
========================================================= */

@media (min-width: 992px) {
  .registrationPage {
    padding: 65px 0;
  }

  .registrationPageOverlay {
    background: linear-gradient(135deg,
        rgba(4, 26, 56, 0.98) 0%,
        rgba(8, 42, 90, 0.93) 55%,
        rgba(4, 26, 56, 0.96) 100%);
  }

  .registrationPageHeading {
    margin-bottom: 32px;
  }

  .registrationPageHeading h1 {
    font-size: 44px;
  }

  .registrationPageCard {
    padding: 36px;
  }

  .registrationFormGrid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }

  .registrationCardTop h2 {
    font-size: 30px;
  }

  .registrationVerifiedEmail {
    min-width: 240px;
  }
}

/* =========================================================
   1200px+
========================================================= */

@media (min-width: 1200px) {
  .registrationPage {
    padding: 70px 0;
  }

  .registrationPageHeading h1 {
    font-size: 46px;
  }

  .registrationPageCard {
    padding: 38px;
  }

  .registrationFormGrid {
    gap: 18px;
  }



  .registrationAgreement {
    margin-top: 26px;
    padding-top: 22px;
  }

  .registrationSubmit {
    min-height: 52px;
    margin-top: 20px;
  }
}

.beGovernanceStepContentTitle {
  margin-top: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
  line-height: 1.08;
  font-size: 28px;
}


/* GEA INTRO LIST - MOBILE FIRST */
.geaIntroStorySection ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 22px 0 30px;
}

.geaIntroStorySection ul li {
  position: relative;
  margin: 0;
  padding: 10px 18px 10px 30px;
  background: var(--be-paper);
  /* border: 1px solid var(--be-border); */
  border-radius: 10px;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 14px;
  line-height: 1.7;
  transition: var(--be-transition);
}

.geaIntroStorySection ul li::before {
  content: "✓";
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--be-gold);
  color: var(--be-white);
  font-size: 13px;
}

.geaIntroStorySection ul li strong {
  color: var(--be-primary);
  font-weight: 700;
}

/* .geaIntroStorySection ul li:hover {
    background: var(--be-white);
    border-color: var(--be-gold);
    box-shadow: 0 8px 24px rgba(8, 42, 90, 0.08);
    transform: translateY(-3px);
} */

/* TABLET & DESKTOP */
@media (min-width: 768px) {
  .geaIntroStorySection ul {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 10px;
  }

  .geaIntroStorySection ul li {
    padding: 0px 20px 0px 30px;
    font-size: 15px;
  }

}

.beAwardees.finalPageSection {
  background: var(--be-ivory);
}

.editionVideosSection.finalPageSection {
  background: var(--be-white);
}

.geaParticipationSection.finalPageSection {
  background: var(--be-white);
}



/* =========================================
   PREVIOUS AWARDEES - CATEGORY SLIDER FIX
========================================= */

#previous-awardees .beAwardeesPanel {
    position: relative;
    width: 100%;
    min-width: 0;
}

#previous-awardees .beAwardeesSwiper {
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

#previous-awardees .beAwardeesSwiper .swiper-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
}

#previous-awardees .beAwardeesSwiper .swiper-slide {
    flex-shrink: 0;
    height: auto;
}

#previous-awardees .beAwardeesSwiper .beAwardeeItem {
    height: 100%;
}

#previous-awardees .beAwardeesSliderControls {
    display: flex;
    z-index: 20;
}



/* ==========================================
   BRAND EMPOWER - OTP SECTION
   NAVY BLUE + GOLD | MOBILE FIRST
========================================== */

#mobileOpt,
.showHide {
  display: none;
}

/* BACK BUTTON */

.backWithOtp {
  display: flex;
  align-items: center;
}

/* OTP TITLE */
.verifyOTP {
  margin: 0;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.3;
}

/* OTP DESCRIPTION */

.oneTimeText {
  margin: 10px 0 18px;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 14px;
  line-height: 1.7;
  font-weight: 400;
  text-align: left;
}

.oneTimeText .otpViewNumber {
  color: var(--be-primary);
  font-size: 14px;
  font-weight: 700;
}

/* OTP INPUT CONTAINER */

.otp-input-container-styles,
#otpInputs {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}

/* NUMBER INPUT */

input[type="number"] {
  -webkit-appearance: none;
  -moz-appearance: textfield;
  appearance: textfield;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* OTP INPUT */
.form-group {
  margin-bottom: 15px;
}

/* PLACEHOLDER */

.form-group .iti+.placeholder {
  cursor: auto;
}

/* DISABLED BUTTON */

.continueBtn:disabled,
.readMoreBtn:disabled {
  cursor: not-allowed;
  background: var(--be-ivory-dark);
  border-color: var(--be-border);
  color: var(--be-muted);
  opacity: 0.75;
}

/* ERROR MESSAGE */

#phoneNumberError {
  color: #c62828;
  font-family: var(--be-body-font);
  font-size: 12px;
  line-height: 1.5;
}

/* DID NOT RECEIVE OTP */

.didnotReceive {
  display: block;
  margin-bottom: 5px;
}

.didnotReceive p {
  margin: 12px 0 5px;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: normal;
}

/* RESEND OTP */

.didnotReceive .resend {
  color: var(--be-muted);
  cursor: text;
}

.didnotReceive .resend.otpResend {
  color: var(--be-gold-dark);
  font-weight: 700;
  cursor: pointer;
  transition: var(--be-transition);
}

.didnotReceive .resend.otpResend:hover {
  color: var(--be-primary);
  text-decoration: underline;
}

/* MOBILE */

@media (max-width: 575px) {

  .verifyOTP {
    font-size: 24px;
  }

  .oneTimeText {
    font-size: 13px;
  }

  .otp-input-container-styles,
  #otpInputs {
    gap: 8px;
  }

  .otpInput,
  #otpInputs input {
    width: 38px !important;
    height: 42px !important;
    font-size: 16px;
  }

  .didnotReceive p {
    font-size: 13px;
  }
}

.iti {
  width: 100%;
}



/* =====================================================
   BRAND EMPOWER - BLOG LISTING
   NEW DESIGN - MOBILE FIRST
   IMAGE TOP + CONTENT BOTTOM
===================================================== */

.blog_page {
  position: relative;
  width: 100%;
  padding: 40px 0;
  background: var(--be-ivory);
  font-family: var(--be-body-font);
}

.blog_page *,
.blog_page *::before,
.blog_page *::after {
  box-sizing: border-box;
}

/* =====================================================
   SECTION TITLE
===================================================== */

.blog_page .title_1 {
  position: relative;
  margin: 0 0 30px;
  padding: 0 0 16px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2;
  text-align: center;
}

.blog_page .title_1::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 55px;
  height: 2px;
  background: var(--be-gold);
  transform: translateX(-50%);
}

/* =====================================================
   BLOG GRID
===================================================== */

.blog_page .row {
  row-gap: 25px;
}

.blog_page .row>[class*="col-"] {
  display: flex;
  flex-direction: column;
}

/* =====================================================
   BLOG CARD
===================================================== */

.blog_page .blog-bx {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--be-paper);
  border: 1px solid var(--be-border);
  border-radius: 6px;
  transition: var(--be-transition);
}

/* =====================================================
   BLOG IMAGE - NO CROPPING
===================================================== */

.blog_page .img-bx {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--be-ivory-dark);
  border-bottom: 1px solid var(--be-border);
}

.blog_page .img-bx img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transition: transform 0.4s ease;
}

/* =====================================================
   DATE BADGE
===================================================== */

.blog_page .img-bx .date {
  position: absolute;
  left: 15px;
  bottom: 15px;
  z-index: 2;
  min-width: 58px;
  padding: 9px 12px;
  background: var(--be-primary);
  color: var(--be-white);
  border-bottom: 3px solid var(--be-gold);
  font-family: var(--be-body-font);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.5px;
  text-align: center;
  text-transform: uppercase;
}

.blog_page .img-bx .date span {
  display: inline-block;
  margin-bottom: 3px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 25px;
  font-weight: 400;
  line-height: 1;
}

/* =====================================================
   BLOG CONTENT
===================================================== */

.blog_page .blog-des {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  min-width: 0;
  padding: 22px 20px;
}

/* BLOG HEADING */

.blog_page .blog-des .head {
  margin: 0 0 12px;
  padding: 0;
  font-family: var(--be-heading-font);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.35;
}

.blog_page .blog-des .head a {
  display: block;
  color: var(--be-heading);
  font: inherit;
  text-decoration: none;
  transition: var(--be-transition);
}

/* BLOG DESCRIPTION */

.blog_page .blog-des p {
  margin: 0 0 20px;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.75;
}

/* =====================================================
   READ MORE
===================================================== */

.blog_page .read_more {
  position: relative;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 9px;
  margin-top: auto;
  padding: 0 0 6px;
  color: var(--be-primary);
  font-family: var(--be-body-font);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.6px;
  text-decoration: none;
  text-transform: uppercase;
  border-bottom: 1px solid var(--be-gold);
  transition: var(--be-transition);
}

.blog_page .read_more span {
  display: inline-block;
}

.blog_page .read_more::after {
  content: "→";
  color: var(--be-gold);
  font-size: 18px;
  line-height: 1;
  transition: transform 0.3s ease;
}

/* =====================================================
   HOVER EFFECTS
===================================================== */

@media (hover: hover) {

  .blog_page .blog-bx:hover {
    border-color: var(--be-gold-light);
    box-shadow: 0 12px 30px rgba(8, 42, 90, 0.08);
    transform: translateY(-4px);
  }

  .blog_page .blog-bx:hover .img-bx img {
    transform: scale(1.02);
  }

  .blog_page .blog-des .head a:hover {
    color: var(--be-gold-dark);
  }

  .blog_page .read_more:hover {
    color: var(--be-gold-dark);
  }

  .blog_page .read_more:hover::after {
    transform: translateX(5px);
  }
}

/* =====================================================
   MIN WIDTH 576PX
===================================================== */

@media (min-width: 576px) {

  .blog_page {
    padding: 50px 0;
  }

  .blog_page .title_1 {
    font-size: 36px;
    margin-bottom: 35px;
  }

  .blog_page .blog-des {
    padding: 25px;
  }

  .blog_page .blog-des .head {
    font-size: 24px;
  }

  .blog_page .blog-des p {
    font-size: 14px;
  }
}

/* =====================================================
   MIN WIDTH 768PX - TABLET
===================================================== */

@media (min-width: 768px) {

  .blog_page {
    padding: 55px 0;
  }

  .blog_page .title_1 {
    font-size: 40px;
    margin-bottom: 40px;
  }

  .blog_page .row {
    row-gap: 28px;
  }

  .blog_page .img-bx {
    aspect-ratio: 16 / 9;
  }

  .blog_page .blog-des {
    padding: 24px;
  }

  .blog_page .blog-des .head {
    font-size: 23px;
  }

  .blog_page .blog-des p {
    font-size: 14px;
  }
}

/* =====================================================
   MIN WIDTH 992PX - DESKTOP
===================================================== */

@media (min-width: 992px) {

  .blog_page {
    padding: var(--be-section-space) 0;
  }

  .blog_page .title_1 {
    font-size: 44px;
    margin-bottom: 45px;
  }

  .blog_page .row {
    row-gap: 32px;
  }

  .blog_page .img-bx {
    aspect-ratio: 16 / 9;
  }

  .blog_page .blog-des {
    padding: 27px 28px;
  }

  .blog_page .blog-des .head {
    font-size: 25px;
  }

  .blog_page .blog-des p {
    font-size: 14px;
    line-height: 1.8;
  }
}

/* =====================================================
   MIN WIDTH 1200PX - LARGE DESKTOP
===================================================== */

@media (min-width: 1200px) {

  .blog_page .blog-des {
    padding: 30px;
  }

  .blog_page .blog-des .head {
    font-size: 27px;
  }

  .blog_page .blog-des p {
    font-size: 14px;
  }
}


/* =====================================================
   BRAND EMPOWER - BLOG DETAILS PAGE
   CLEAN EDITORIAL DESIGN | MOBILE FIRST
   NO WHITE BOX / NO CARD
===================================================== */

.blogDetailsPage {
  position: relative;
  width: 100%;
  padding: 35px 0 50px;
  background: var(--be-ivory);
  font-family: var(--be-body-font);
}

.blogDetailsPage *,
.blogDetailsPage *::before,
.blogDetailsPage *::after {
  box-sizing: border-box;
}

/* =====================================================
   PAGE TITLE
===================================================== */

.blogDetailsPage .title_1 {
  position: relative;
  max-width: 1100px;
  margin: 0 auto 22px;
  padding: 0 0 22px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.25;
  text-align: center;
}

.blogDetailsPage .title_1::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 140px;
  height: 1px;
  background: var(--be-gold);
  transform: translateX(-50%);
}

.blogDetailsPage .title_1::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 9px;
  height: 9px;
  border: 2px solid var(--be-gold);
  border-radius: 50%;
  background: var(--be-ivory);
  transform: translateX(-50%);
}

/* =====================================================
   ARTICLE WRAPPER - NO WHITE BOX
===================================================== */

.blogDetailsPage .fullDetails {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

/* =====================================================
   AUTHOR AND DATE
===================================================== */

.blogDetailsPage .fullDetails>ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 22px;
  margin: 0 0 25px;
  padding: 0;
  list-style: none;
  background: transparent;
  border: none;
}

.blogDetailsPage .fullDetails>ul li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}

.blogDetailsPage .fullDetails>ul li svg {
  display: block;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  fill: var(--be-gold-dark);
}

.blogDetailsPage .fullDetails>ul li+li {
  padding-left: 18px;
  border-left: 1px solid var(--be-gold);
}

/* =====================================================
   ARTICLE CONTENT
===================================================== */

.blogDetailsPage .detailsInfo {
  position: relative;
  width: 100%;
  padding: 0;
  margin: 0;
  background: transparent;
  color: var(--be-text);
  font-family: var(--be-body-font);
  overflow-wrap: break-word;
}

/* =====================================================
   FEATURED IMAGE - NO CROPPING
===================================================== */

.blogDetailsPage .blogImg {
  position: relative;
  width: 100%;
  margin: 0 0 25px;
  padding: 0;
  overflow: hidden;
  background: transparent;
  border: none;
  border-radius: 5px;
  box-shadow: none;
}

.blogDetailsPage .blogImg img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

/* =====================================================
   ARTICLE PARAGRAPHS
===================================================== */

.blogDetailsPage .detailsInfo p {
  margin: 0 0 17px;
  padding: 0;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.85;
  text-align: left;
}

.blogDetailsPage .detailsInfo p:last-child {
  margin-bottom: 0;
}

/* =====================================================
   ARTICLE HEADINGS
===================================================== */

.blogDetailsPage .detailsInfo h2,
.blogDetailsPage .detailsInfo h3,
.blogDetailsPage .detailsInfo h4 {
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-weight: 400;
}

.blogDetailsPage .detailsInfo h2 {
  margin: 30px 0 16px;
  font-size: 27px;
  line-height: 1.3;
}

.blogDetailsPage .detailsInfo h3 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 30px 0 17px;
  padding: 0 0 0 15px;
  color: var(--be-heading);
  font-size: 25px;
  line-height: 1.3;
}

.blogDetailsPage .detailsInfo h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  bottom: 2px;
  width: 4px;
  background: var(--be-gold);
}

.blogDetailsPage .detailsInfo h3::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 8px;
  background: var(--be-gold-light);
}

.blogDetailsPage .detailsInfo h4 {
  margin: 23px 0 12px;
  font-size: 21px;
  line-height: 1.4;
}

/* =====================================================
   STRONG TEXT
===================================================== */

.blogDetailsPage .detailsInfo strong,
.blogDetailsPage .detailsInfo b {
  color: var(--be-text);
  font-weight: 700;
}

/* =====================================================
   ARTICLE LINKS
===================================================== */

.blogDetailsPage .detailsInfo a {
  color: var(--be-primary);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--be-gold);
  text-underline-offset: 3px;
  transition: var(--be-transition);
}

.blogDetailsPage .detailsInfo a:hover {
  color: var(--be-gold-dark);
  text-decoration-color: var(--be-gold-dark);
}

/* =====================================================
   LISTS
===================================================== */

.blogDetailsPage .detailsInfo ul,
.blogDetailsPage .detailsInfo ol {
  margin: 0 0 20px;
  padding-left: 22px;
}

.blogDetailsPage .detailsInfo li {
  margin-bottom: 8px;
  color: var(--be-text);
  font-size: 14px;
  line-height: 1.8;
}

.blogDetailsPage .detailsInfo li::marker {
  color: var(--be-gold);
}

/* =====================================================
   BLOCKQUOTE
===================================================== */

.blogDetailsPage .detailsInfo blockquote {
  margin: 25px 0;
  padding: 8px 0 8px 20px;
  background: transparent;
  border: none;
  border-left: 3px solid var(--be-gold);
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 21px;
  line-height: 1.6;
}

/* =====================================================
   MIN WIDTH 576PX
===================================================== */

@media (min-width: 576px) {

  .blogDetailsPage {
    padding: 45px 0 60px;
  }

  .blogDetailsPage .title_1 {
    font-size: 36px;
    margin-bottom: 26px;
  }

  .blogDetailsPage .fullDetails>ul {
    margin-bottom: 30px;
  }

  .blogDetailsPage .detailsInfo p {
    font-size: 15px;
  }

  .blogDetailsPage .detailsInfo h3 {
    font-size: 28px;
  }
}

/* =====================================================
   MIN WIDTH 768PX - TABLET
===================================================== */

@media (min-width: 768px) {

  .blogDetailsPage {
    padding: 55px 0 70px;
  }

  .blogDetailsPage .title_1 {
    max-width: 1000px;
    font-size: 42px;
    margin-bottom: 30px;
  }

  .blogDetailsPage .fullDetails>ul {
    margin-bottom: 35px;
  }

  .blogDetailsPage .fullDetails>ul li {
    font-size: 13px;
  }

  .blogDetailsPage .blogImg {
    margin-bottom: 30px;
  }

  .blogDetailsPage .detailsInfo p {
    font-size: 15px;
    line-height: 1.9;
  }

  .blogDetailsPage .detailsInfo h3 {
    font-size: 30px;
    margin-top: 35px;
  }
}

/* =====================================================
   MIN WIDTH 992PX - DESKTOP
===================================================== */

@media (min-width: 992px) {

  .blogDetailsPage {
    padding: var(--be-section-space) 0;
  }

  .blogDetailsPage .title_1 {
    max-width: 1100px;
    font-size: 48px;
    line-height: 1.2;
    margin-bottom: 35px;
  }

  .blogDetailsPage .fullDetails>ul {
    margin-bottom: 40px;
  }

  .blogDetailsPage .blogImg {
    margin-bottom: 35px;
  }

  .blogDetailsPage .detailsInfo p {
    font-size: 16px;
    line-height: 1.9;
    margin-bottom: 20px;
  }

  .blogDetailsPage .detailsInfo h2 {
    font-size: 33px;
  }

  .blogDetailsPage .detailsInfo h3 {
    font-size: 33px;
    margin-top: 38px;
    margin-bottom: 20px;
  }

  .blogDetailsPage .detailsInfo h4 {
    font-size: 24px;
  }
}

/* =====================================================
   MIN WIDTH 1200PX - LARGE DESKTOP
===================================================== */

@media (min-width: 1200px) {

  .blogDetailsPage .title_1 {
    font-size: 52px;
  }

  .blogDetailsPage .detailsInfo p {
    font-size: 16px;
    line-height: 1.95;
  }

  .blogDetailsPage .detailsInfo h3 {
    font-size: 35px;
  }
}

/* =====================================================
   BRAND EMPOWER - AWARDS OVERVIEW
   PREMIUM IVORY / NAVY / GOLD
   MOBILE FIRST
===================================================== */

.beAwardsOverview {
  position: relative;
  width: 100%;
  padding: 45px 0;
  background: var(--be-ivory);
  font-family: var(--be-body-font);
}

.beAwardsOverview *,
.beAwardsOverview *::before,
.beAwardsOverview *::after {
  box-sizing: border-box;
}

/* =====================================================
   SECTION HEADING
===================================================== */

.beAwardsHeading {
  position: relative;
  margin: 0 0 30px;
  text-align: center;
}

.beAwardsEyebrow {
  display: block;
  margin-bottom: 8px;
  color: var(--be-gold-dark);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.beAwardsHeading h2 {
  position: relative;
  margin: 0;
  padding-bottom: 18px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2;
}

.beAwardsHeading h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 65px;
  height: 2px;
  background: var(--be-gold);
  transform: translateX(-50%);
}

/* =====================================================
   INTRO LAYOUT
===================================================== */

.beAwardsIntro {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 25px;
  align-items: start;
  margin-bottom: 30px;
}

/* =====================================================
   IMAGE
===================================================== */

.beAwardsImage {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 5px;
  background: var(--be-ivory-dark);
}

.beAwardsImage img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* =====================================================
   INTRO CONTENT
===================================================== */

.beAwardsContent {
  min-width: 0;
}

.beAwardsContent p {
  margin: 0 0 14px;
  color: var(--be-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.85;
  text-align: justify;
}

.beAwardsContent p:last-child {
  margin-bottom: 0;
}

/* =====================================================
   DETAILS
===================================================== */

.beAwardsDetails {
  display: flex;
  flex-direction: column;
  gap: 25px;
  margin-bottom: 35px;
}

.beAwardsDetail {
  position: relative;
  width: 100%;
}

.beAwardsDetail h3 {
  position: relative;
  margin: 0 0 13px;
  padding-left: 14px;
  color: var(--be-heading);
  font-family: var(--be-heading-font);
  font-size: 24px;
  font-weight: 400;
  line-height: 1.3;
}

.beAwardsDetail h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 3px;
  background: var(--be-gold);
}

.beAwardsDetail p {
  margin: 0;
  color: var(--be-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.85;
}

/* =====================================================
   CONTACT STRIP
===================================================== */

.beAwardsContact {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  padding: 22px 20px;
  background: var(--be-primary);
  border-left: 4px solid var(--be-gold);
  border-radius: 4px;
}

.beAwardsContactText strong {
  display: block;
  margin-bottom: 5px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 23px;
  font-weight: 400;
  line-height: 1.3;
}

.beAwardsContactText p {
  margin: 0;
  color: var(--be-ivory-dark);
  font-size: 13px;
  line-height: 1.7;
}

/* =========================================
   CONTACT BUTTONS - MOBILE FIRST
========================================= */

.beAwardsContactLinks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.beAwardsContactLinks a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 43px;
  padding: 11px 18px;

  color: var(--be-gold-light);
  background: transparent;
  border: 1px solid var(--be-gold);
  border-radius: 4px;

  font-family: var(--be-body-font);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;

  transition: var(--be-transition);
}

.beAwardsContactLinks a:hover {
  color: var(--be-primary-dark);
  background: var(--be-gold-light);
  border-color: var(--be-gold-light);
  text-decoration: none;
}

.beAwardsContactLinks a:focus-visible {
  outline: 2px solid var(--be-white);
  outline-offset: 3px;
}

/* TABLET */

@media (min-width: 768px) {

  .beAwardsContactLinks a {
    min-height: 46px;
    padding: 12px 20px;
    font-size: 14px;
  }
}

/* DESKTOP */

@media (min-width: 992px) {

  .beAwardsContactLinks {
    gap: 14px;
  }

  .beAwardsContactLinks a {
    min-height: 48px;
    padding: 12px 22px;
    font-size: 15px;
  }
}

/* =====================================================
   MIN WIDTH 576PX
===================================================== */

@media (min-width: 576px) {

  .beAwardsOverview {
    padding: 50px 0;
  }

  .beAwardsHeading h2 {
    font-size: 36px;
  }

  .beAwardsDetail h3 {
    font-size: 26px;
  }

  .beAwardsContact {
    padding: 25px;
  }
}

/* =====================================================
   MIN WIDTH 768PX - TABLET
===================================================== */

@media (min-width: 768px) {

  .beAwardsOverview {
    padding: 60px 0;
  }

  .beAwardsHeading {
    margin-bottom: 38px;
  }

  .beAwardsHeading h2 {
    font-size: 40px;
  }

  .beAwardsIntro {
    grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
    gap: 30px;
    margin-bottom: 35px;
  }

  .beAwardsContent p,
  .beAwardsDetail p {
    font-size: 14px;
  }

  .beAwardsDetails {
    gap: 30px;
    margin-bottom: 40px;
  }

  .beAwardsDetail h3 {
    font-size: 28px;
  }

  .beAwardsContact {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 25px 30px;
  }

  .beAwardsContactLinks {
    justify-content: flex-end;
  }
}

/* =====================================================
   MIN WIDTH 992PX - DESKTOP
===================================================== */

@media (min-width: 992px) {

  .beAwardsOverview {
    padding: var(--be-section-space) 0;
  }

  .beAwardsHeading {
    margin-bottom: 42px;
  }

  .beAwardsHeading h2 {
    font-size: 44px;
  }

  .beAwardsIntro {
    grid-template-columns: minmax(0, 36%) minmax(0, 1fr);
    gap: 35px;
    margin-bottom: 40px;
  }

  .beAwardsContent p,
  .beAwardsDetail p {
    font-size: 15px;
    line-height: 1.9;
  }

  .beAwardsDetail h3 {
    font-size: 30px;
  }

  .beAwardsContact {
    padding: 30px 35px;
  }

  .beAwardsContactText strong {
    font-size: 30px;
  }
}

/* =====================================================
   MIN WIDTH 1200PX - LARGE DESKTOP
===================================================== */

@media (min-width: 1200px) {

  .beAwardsIntro {

    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
  }
.beAwardsIntro.beAwardsLeftImg{
grid-template-columns: minmax(0, 34%) minmax(0, 1fr);
}
  .beAwardsContent p,
  .beAwardsDetail p {
    font-size: 15px;
  }

  .beAwardsHeading h2 {
    font-size: 46px;
  }
}



/* =========================================
   BRAND EMPOWER - CUSTOM RADIO GROUP
   MOBILE FIRST
========================================= */

/* =====================================================
   BRAND EMPOWER - REGISTRATION BANNER
   NAVY BLUE + GOLD | MOBILE FIRST
===================================================== */

.beRegisterBanner {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 180px;
  padding: 35px 0;
  overflow: hidden;

  background-color: var(--be-primary-dark);

  /* Replace with your existing banner image */
  background-image:
    linear-gradient(90deg,
      rgba(4, 26, 56, 0.98) 0%,
      rgba(4, 26, 56, 0.92) 45%,
      rgba(4, 26, 56, 0.55) 100%),
    url("../images/register-banner.jpg");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.beRegisterBanner .container {
  position: relative;
  z-index: 2;
}

/* =========================================
   CONTENT
========================================= */

.beRegisterBannerContent {
  position: relative;
  width: 100%;
  max-width: 550px;
}

/* =========================================
   SMALL LABEL
========================================= */

.beRegisterBannerLabel {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;

  color: var(--be-gold-light);
  font-family: var(--be-body-font);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.beRegisterBannerLabel::before {
  content: "";
  width: 25px;
  height: 1px;
  background: var(--be-gold);
}

/* =========================================
   HEADING
========================================= */

.beRegisterBannerContent h1 {
  margin: 0 0 12px;
  color: var(--be-white);
  font-family: var(--be-heading-font);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.5px;
}

.beRegisterBannerContent h1 em {
  color: var(--be-gold-light);
  font-family: inherit;
  font-weight: 400;
  font-style: italic;
}

/* =========================================
   DESCRIPTION
========================================= */

.beRegisterBannerContent p {
  max-width: 460px;
  margin: 0;
  color: var(--be-ivory-dark);
  font-family: var(--be-body-font);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
}

/* =========================================
   TABLET - 576PX
========================================= */

@media (min-width: 576px) {

  .beRegisterBanner {
    min-height: 190px;
    padding: 38px 0;
  }

  .beRegisterBannerContent h1 {
    font-size: 35px;
  }

  .beRegisterBannerContent p {
    font-size: 14px;
  }
}

/* =========================================
   TABLET - 768PX
========================================= */

@media (min-width: 768px) {

  .beRegisterBanner {
    min-height: 205px;
    padding: 40px 0;
    background-position: center right;
  }

  .beRegisterBannerContent {
    max-width: 520px;
  }

  .beRegisterBannerContent h1 {
    font-size: 40px;
  }
}

/* =========================================
   DESKTOP - 992PX
========================================= */

@media (min-width: 992px) {

  .beRegisterBanner {
    min-height: 220px;
    padding: 45px 0;
  }

  .beRegisterBannerContent {
    max-width: 600px;
  }

  .beRegisterBannerContent h1 {
    font-size: 44px;
  }

  .beRegisterBannerContent p {
    font-size: 14px;
  }
}

/* =========================================
   LARGE DESKTOP - 1200PX
========================================= */

@media (min-width: 1200px) {

  .beRegisterBanner {
    min-height: 230px;
  }

  .beRegisterBannerContent h1 {
    font-size: 46px;
  }
}


.registerDetials {
  position: relative;
  width: 100%;
  padding: 45px 0;
  background: var(--be-ivory);
  font-family: var(--be-body-font);
}

.radioGroup.newText {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  margin: 0;
}

/* RADIO LABEL */

.radioGroup.newText .radio {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 0;
  padding: 11px 15px;
  background: var(--be-white);
  border: 1px solid var(--be-border);
  border-radius: 5px;
  cursor: pointer;
  transition: var(--be-transition);
}

/* HIDE DEFAULT RADIO */

.radioGroup.newText .radio input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: 0;
  opacity: 0;
  overflow: hidden;
}

/* CUSTOM RADIO CIRCLE */

.radioGroup.newText .radio::before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 17px;
  height: 17px;
  border: 2px solid var(--be-border);
  border-radius: 50%;
  background: var(--be-white);
  transition: var(--be-transition);
}

/* LABEL TEXT */

.radioGroup.newText .radio span {
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  transition: var(--be-transition);
}

/* HOVER */

@media (hover: hover) {

  .radioGroup.newText .radio:hover {
    border-color: var(--be-gold);
    background: var(--be-ivory);
  }
}

/* SELECTED RADIO */

.radioGroup.newText .radio:has(input:checked) {
  background: var(--be-ivory);
  border-color: var(--be-gold);
}

.radioGroup.newText .radio:has(input:checked)::before {
  border-color: var(--be-gold);
  background: var(--be-gold);
  box-shadow: inset 0 0 0 3px var(--be-white);
}

.radioGroup.newText .radio:has(input:checked) span {
  color: var(--be-primary);
  font-weight: 600;
}

/* KEYBOARD FOCUS */

.radioGroup.newText .radio:has(input:focus-visible) {
  outline: 2px solid var(--be-primary);
  outline-offset: 3px;
}

/* =========================================
   TABLET
========================================= */

@media (min-width: 768px) {

  .radioGroup.newText {
    gap: 12px;
  }

  .radioGroup.newText .radio {
    min-height: 46px;
    padding: 12px 17px;
  }

  .radioGroup.newText .radio span {
    font-size: 14px;
  }
}

/* =========================================
   BRAND EMPOWER - CUSTOM CHECKBOX
   MOBILE FIRST
========================================= */

.singleCheck {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

/* CHECKBOX INPUT */

.singleCheck input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  opacity: 0;
}

/* CHECKBOX LABEL TEXT */

.singleCheck span {
  position: relative;
  display: block;
  padding-left: 30px;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.6;
  cursor: pointer;
  transition: var(--be-transition);
}

/* CUSTOM CHECKBOX */

.singleCheck span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 19px;
  height: 19px;
  background: var(--be-white);
  border: 1px solid var(--be-border);
  border-radius: 3px;
  transition: var(--be-transition);
}

/* CHECKED STATE */

.singleCheck input[type="checkbox"]:checked+span {
  color: var(--be-primary);
}

.singleCheck input[type="checkbox"]:checked+span::before {
  background: var(--be-gold);
  border-color: var(--be-gold);
}

/* CHECKMARK */

.singleCheck input[type="checkbox"]:checked+span::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 5px;
  width: 7px;
  height: 11px;
  border: solid var(--be-primary-dark);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* LINKS */

.singleCheck span a {
  display: inline;
  color: var(--be-primary);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--be-gold);
  text-underline-offset: 3px;
  transition: var(--be-transition);
}

.singleCheck span a:hover {
  color: var(--be-gold-dark);
}

/* HOVER */

@media (hover: hover) {
  .singleCheck:hover span::before {
    border-color: var(--be-gold);
  }
}

/* KEYBOARD FOCUS */

.singleCheck input[type="checkbox"]:focus-visible+span::before {
  outline: 2px solid var(--be-primary);
  outline-offset: 3px;
}

/* DISABLED */

.singleCheck input[type="checkbox"]:disabled+span {
  opacity: 0.5;
  cursor: not-allowed;
}

/* VALIDATION ERROR */

.checkbox-error {
  margin-top: 6px;
  padding-left: 30px;
  color: #c62828;
  font-family: var(--be-body-font);
  font-size: 12px;
  line-height: 1.5;
}

/* FORM GROUP SPACING */

.form-group:has(> .singleCheck) {
  margin-bottom: 12px;
  position: relative;
}

/* =========================================
   TABLET / DESKTOP
========================================= */

@media (min-width: 768px) {

  .singleCheck span {
    padding-left: 32px;
    font-size: 14px;
  }

  .singleCheck span::before {
    width: 20px;
    height: 20px;
  }

  .singleCheck input[type="checkbox"]:checked+span::after {
    left: 7px;
  }
}


/* =====================================================
   BRAND EMPOWER - LOGIN IMAGE & TRUST STATS
   MOBILE FIRST | NAVY + GOLD + IVORY
===================================================== */

/* =========================================
   LOGIN IMAGE
========================================= */

.loginImage {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0 0 22px;
  padding: 15px;
  overflow: hidden;
  background: var(--be-ivory);
  border: 1px solid var(--be-border);
  border-radius: 8px;
}

.loginImage img {
  display: block;
  width: 100%;
  max-width: 380px;
  height: auto;
  object-fit: contain;
}

/* =========================================
   TRUST STATS GRID
========================================= */

.trustStats {
  margin-top: 0;
  row-gap: 10px;
}

/* =========================================
   TRUST CARD
========================================= */

.trustStats .trustCard {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 95px;
  height: 100%;
  padding: 15px 10px;
  overflow: hidden;

  background: var(--be-paper);
  border: 1px solid var(--be-border);
  border-radius: 5px;

  text-align: center;
  transition: var(--be-transition);
}

/* TOP GOLD LINE */

.trustStats .trustCard::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 35px;
  height: 2px;
  background: var(--be-gold);
  transform: translateX(-50%);
  transition: var(--be-transition);
}

/* =========================================
   STAT NUMBER
========================================= */

.trustStats .trustCard strong {
  display: block;
  margin: 0 0 5px;
  color: var(--be-primary);
  font-family: var(--be-heading-font);
  font-size: 27px;
  font-weight: 400;
  line-height: 1.1;
}

/* =========================================
   STAT LABEL
========================================= */

.trustStats .trustCard span {
  display: block;
  color: var(--be-text);
  font-family: var(--be-body-font);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.2px;
}

/* =========================================
   HOVER EFFECT
========================================= */

@media (hover: hover) {

  .trustStats .trustCard:hover {
    background: var(--be-ivory);
    border-color: var(--be-gold-light);
    box-shadow: 0 8px 22px rgba(8, 42, 90, 0.07);
    transform: translateY(-3px);
  }

  .trustStats .trustCard:hover::before {
    width: 65px;
  }

  .trustStats .trustCard:hover strong {
    color: var(--be-gold-dark);
  }
}

/* =========================================
   MIN WIDTH 576PX
========================================= */

@media (min-width: 576px) {

  .loginImage {
    margin-bottom: 25px;
    padding: 20px;
  }

  .loginImage img {
    max-width: 420px;
  }

  .trustStats .trustCard {
    min-height: 105px;
    padding: 18px 12px;
  }

  .trustStats .trustCard strong {
    font-size: 30px;
  }

  .trustStats .trustCard span {
    font-size: 12px;
  }
}

/* =========================================
   MIN WIDTH 768PX - TABLET
========================================= */

@media (min-width: 768px) {

  .loginImage {
    margin-bottom: 25px;
    padding: 20px;
  }

  .loginImage img {
    max-width: 100%;
  }

  .trustStats .trustCard {
    min-height: 100px;
    padding: 15px 8px;
  }

  .trustStats .trustCard strong {
    font-size: 28px;
  }

  .trustStats .trustCard span {
    font-size: 11px;
  }
}

/* =========================================
   MIN WIDTH 992PX - DESKTOP
========================================= */

@media (min-width: 992px) {

  .loginImage {
    margin-bottom: 30px;
    padding: 25px;
  }

  .trustStats .trustCard {
    min-height: 115px;
    padding: 20px 12px;
  }

  .trustStats .trustCard strong {
    font-size: 34px;
  }

  .trustStats .trustCard span {
    font-size: 12px;
  }
}

/* =========================================
   MIN WIDTH 1200PX - LARGE DESKTOP
========================================= */

@media (min-width: 1200px) {

  .loginImage {
    padding: 30px;
  }

  .trustStats .trustCard {
    min-height: 120px;
  }

  .trustStats .trustCard strong {
    font-size: 37px;
  }

  .trustStats .trustCard span {
    font-size: 13px;
  }
}

.contactFormField div.error {
  color: red;
  font-weight: normal;
}

.contactFormField div#country-error.error {
  position: absolute;
  bottom: -26px;
}

.contactFormField div.error#businessTypeSelect-error,
.contactFormField div.error#professionalsTypeSelect-error,
.contactFormField div.error#otherTypeSelect-error {
  position: absolute;
  bottom: -16px;
}

#occupation_type-error.error {
  position: absolute;
  top: -28px;
  color: red;
  font-weight: normal;
  font-size: 14px;
  right: 0;
}

.loginPageBannerGrid .otpInputs {
  display: grid !important;
  grid-template-columns: repeat(8, 1fr);
  gap: 10px;
}

#term-error {
  position: relative;
  color: red;
  font-weight: normal;
  font-size: 14px;
}
.otherBackground{
background: var(--be-paper)!important;
}





/* =========================================
   BRAND EMPOWER - RECOGNIZED LEADERS
   NAVY / GOLD / IVORY | MOBILE FIRST
========================================= */

.fewWinners {
    position: relative;
    width: 100%;
    padding: 45px 0;
    background: var(--be-paper);
    font-family: var(--be-body-font);
}

.fewWinners .container {
    max-width: var(--be-container);
}

/* =========================================
   SECTION TITLE
========================================= */

.fewWinners .h2_title_1 {
    position: relative;
    margin: 0 0 28px;
    padding: 0 0 17px;
    color: var(--be-heading);
    font-family: var(--be-heading-font);
    font-size: 29px;
    font-weight: 400;
    line-height: 1.25;
    text-align: center;
}

.fewWinners .h2_title_1::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 65px;
    height: 2px;
    background: var(--be-gold);
}

/* =========================================
   WINNER GRID
========================================= */

.fewWinners #photo-list {
    row-gap: 22px !important;
}

.fewWinners #photo-list > div {
    display: flex;
}

/* =========================================
   WINNER CARD
========================================= */

.fewWinners .winner {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: var(--be-white);
    border: 1px solid var(--be-border);
    border-radius: 4px;
    transition: var(--be-transition);
}

.fewWinners .winner:hover {
    border-color: var(--be-gold);
    box-shadow: 0 10px 28px rgba(8, 42, 90, 0.09);
    transform: translateY(-4px);
}

/* =========================================
   WINNER IMAGE
========================================= */

.fewWinners .winner .image {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--be-ivory-dark);
}

.fewWinners .winner .image a {
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.fewWinners .winner .image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.45s ease;
}

.fewWinners .winner:hover .image img {
    transform: scale(1.045);
}

/* GOLD ACCENT ON IMAGE */

.fewWinners .winner .image::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--be-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
    pointer-events: none;
}

.fewWinners .winner:hover .image::after {
    transform: scaleX(1);
}

/* =========================================
   WINNER INFORMATION
========================================= */

.fewWinners .winnerInfo {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
    min-height: 76px;
    padding: 17px 16px;
    background: var(--be-white);
    text-align: center;
}

.fewWinners .winnerName {
    margin: 0;
    color: var(--be-primary);
    font-family: var(--be-body-font);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

/* =========================================
   VIEW MORE BUTTON
========================================= */

.fewWinners .text-center {
    margin-top: 32px;
}

.fewWinners .read_more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 155px;
    min-height: 45px;
    padding: 11px 26px;
    background: var(--be-primary);
    border: 1px solid var(--be-primary);
    border-radius: 3px;
    color: var(--be-white);
    font-family: var(--be-body-font);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: var(--be-transition);
}

.fewWinners .read_more span {
    color: inherit;
}

.fewWinners .read_more:hover {
    background: var(--be-gold);
    border-color: var(--be-gold);
    color: var(--be-white);
    text-decoration: none;
}

/* =========================================
   RESPONSIVE
========================================= */

@media (min-width: 768px) {

    .fewWinners {
        padding: 55px 0;
    }

    .fewWinners .h2_title_1 {
        font-size: 34px;
        margin-bottom: 32px;
    }

    .fewWinners .winnerInfo {
        padding: 18px 15px;
    }

}

@media (min-width: 1200px) {

    .fewWinners {
        padding: var(--be-section-space) 0;
    }

    .fewWinners .h2_title_1 {
        font-size: 38px;
        margin-bottom: 36px;
    }

}

@media (max-width: 575.98px) {

    .fewWinners {
        padding: 38px 0;
    }

    .fewWinners .h2_title_1 {
        font-size: 27px;
        padding-bottom: 15px;
        margin-bottom: 25px;
    }

    .fewWinners #photo-list {
        row-gap: 16px !important;
    }

    .fewWinners .winner .image {
        aspect-ratio: 4 / 3;
    }

    .fewWinners .winnerInfo {
        min-height: 65px;
        padding: 14px;
    }

    .fewWinners .winnerName {
        font-size: 14px;
    }

    .fewWinners .text-center {
        margin-top: 25px;
    }

}

@media (prefers-reduced-motion: reduce) {

    .fewWinners .winner,
    .fewWinners .winner .image img,
    .fewWinners .winner .image::after,
    .fewWinners .read_more {
        transition: none;
    }

    .fewWinners .winner:hover,
    .fewWinners .winner:hover .image img {
        transform: none;
    }

}



/* =========================================
   BRAND EMPOWER - VIDEO GLIMPSES
   NAVY / GOLD / IVORY | MOBILE FIRST
========================================= */

.previousGlimpses {
    position: relative;
    width: 100%;
    padding: 45px 0;
    background: var(--be-ivory);
    font-family: var(--be-body-font);
}

.previousGlimpses .container {
    max-width: var(--be-container);
}

/* =========================================
   SECTION TITLE
========================================= */

.previousGlimpses .title_2 {
    position: relative;
    margin: 0 0 28px;
    padding: 0 0 17px;
    color: var(--be-heading);
    font-family: var(--be-heading-font);
    font-size: 29px;
    font-weight: 400;
    line-height: 1.25;
    text-align: center;
}

.previousGlimpses .title_2 span {
    color: inherit;
    font: inherit;
}

.previousGlimpses .title_2::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 65px;
    height: 2px;
    background: var(--be-gold);
}

/* =========================================
   VIDEO GRID
========================================= */

.previousGlimpses #video-list {
    row-gap: 22px !important;
}

.previousGlimpses #video-list > div {
    display: flex;
}

/* =========================================
   VIDEO CARD
========================================= */

.previousGlimpses .videoGlimpses {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: var(--be-white);
    border: 1px solid var(--be-border);
    border-radius: 4px;
    transition: var(--be-transition);
}

.previousGlimpses .videoGlimpses:hover {
    border-color: var(--be-gold);
    box-shadow: 0 10px 28px rgba(8, 42, 90, 0.09);
    transform: translateY(-4px);
}

/* =========================================
   VIDEO THUMBNAIL
========================================= */

.previousGlimpses .videoGlimpses > a {
    display: block;
    width: 100%;
    text-decoration: none;
}

.previousGlimpses .videoGlimpses .image {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--be-primary-dark);
}

.previousGlimpses .videoGlimpses .image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.45s ease;
}

.previousGlimpses .videoGlimpses:hover .image img {
    transform: scale(1.05);
}

/* DARK IMAGE OVERLAY */

.previousGlimpses .videoGlimpses .image::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(4, 26, 56, 0.25);
    transition: background 0.3s ease;
    pointer-events: none;
}

.previousGlimpses .videoGlimpses:hover .image::before {
    background: rgba(4, 26, 56, 0.4);
}

/* =========================================
   PLAY BUTTON
========================================= */

.previousGlimpses .videoGlimpses .image svg {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    width: 54px;
    height: 54px;
    padding: 15px;
    transform: translate(-50%, -50%);
    background: var(--be-primary);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    color: var(--be-white);
    fill: currentColor;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.2);
    transition: var(--be-transition);
    pointer-events: none;
}

.previousGlimpses .videoGlimpses:hover .image svg {
    background: var(--be-gold);
    border-color: var(--be-gold-light);
    transform: translate(-50%, -50%) scale(1.1);
}

/* GOLD BOTTOM ACCENT */

.previousGlimpses .videoGlimpses .image::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 3px;
    background: var(--be-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
    pointer-events: none;
}

.previousGlimpses .videoGlimpses:hover .image::after {
    transform: scaleX(1);
}

/* =========================================
   VIDEO TITLE
========================================= */

.previousGlimpses .glimpsesTitle {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-height: 76px;
    margin: 0;
    padding: 17px 16px;
    background: var(--be-white);
    color: var(--be-primary);
    font-family: var(--be-body-font);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
    overflow-wrap: anywhere;
}

/* =========================================
   VIEW MORE BUTTON
========================================= */

.previousGlimpses .text-center {
    margin-top: 32px;
}

.previousGlimpses .read_more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 155px;
    min-height: 45px;
    padding: 11px 26px;
    background: var(--be-primary);
    border: 1px solid var(--be-primary);
    border-radius: 3px;
    color: var(--be-white);
    font-family: var(--be-body-font);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: var(--be-transition);
}

.previousGlimpses .read_more span {
    color: inherit;
}

.previousGlimpses .read_more:hover {
    background: var(--be-gold);
    border-color: var(--be-gold);
    color: var(--be-white);
    text-decoration: none;
}

/* =========================================
   RESPONSIVE - TABLET
========================================= */

@media (min-width: 768px) {

    .previousGlimpses {
        padding: 55px 0;
    }

    .previousGlimpses .title_2 {
        font-size: 34px;
        margin-bottom: 32px;
    }

    .previousGlimpses .glimpsesTitle {
        padding: 18px 15px;
    }

}

/* =========================================
   RESPONSIVE - DESKTOP
========================================= */

@media (min-width: 1200px) {

    .previousGlimpses {
        padding: var(--be-section-space) 0;
    }

    .previousGlimpses .title_2 {
        font-size: 38px;
        margin-bottom: 36px;
    }

}

/* =========================================
   RESPONSIVE - MOBILE
========================================= */

@media (max-width: 575.98px) {

    .previousGlimpses {
        padding: 38px 0;
    }

    .previousGlimpses .title_2 {
        font-size: 27px;
        padding-bottom: 15px;
        margin-bottom: 25px;
    }

    .previousGlimpses #video-list {
        row-gap: 16px !important;
    }

    .previousGlimpses .videoGlimpses .image svg {
        width: 48px;
        height: 48px;
        padding: 13px;
    }

    .previousGlimpses .glimpsesTitle {
        min-height: 65px;
        padding: 14px;
        font-size: 14px;
    }

    .previousGlimpses .text-center {
        margin-top: 25px;
    }

}

/* =========================================
   REDUCED MOTION
========================================= */

@media (prefers-reduced-motion: reduce) {

    .previousGlimpses .videoGlimpses,
    .previousGlimpses .videoGlimpses .image img,
    .previousGlimpses .videoGlimpses .image svg,
    .previousGlimpses .videoGlimpses .image::after,
    .previousGlimpses .read_more {
        transition: none;
    }

    .previousGlimpses .videoGlimpses:hover,
    .previousGlimpses .videoGlimpses:hover .image img {
        transform: none;
    }

}



/* =========================================
   BRAND EMPOWER - MORE AWARDS CATEGORIES
   NAVY / GOLD / IVORY | MOBILE FIRST
========================================= */

.moreAwardsCategories {
    position: relative;
    width: 100%;
    padding: 35px 0 45px;
    background: var(--be-paper);
    font-family: var(--be-body-font);
}

.moreAwardsCategories .container {
    max-width: var(--be-container);
}

/* ACCORDION BUTTON */

.moreAwardsCategories .custom-accordion {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 19px 22px;
    margin: 0;
    border: 1px solid var(--be-border);
    border-left: 4px solid var(--be-gold);
    border-radius: 4px;
    background: var(--be-ivory);
    color: var(--be-primary);
    font-family: var(--be-heading-font);
    font-size: 23px;
    font-weight: 400;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: var(--be-transition);
}

.moreAwardsCategories .custom-accordion:hover {
    background: var(--be-ivory-dark);
    border-color: var(--be-gold-light);
    border-left-color: var(--be-gold);
}

/* PLUS / MINUS ICON */

.moreAwardsCategories .custom-accordion::after {
    content: "+";
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    margin-left: 15px;
    border: 1px solid var(--be-border);
    border-radius: 3px;
    background: var(--be-white);
    color: var(--be-primary);
    font-family: var(--be-body-font);
    font-size: 23px;
    font-weight: 400;
    line-height: 1;
    transition: var(--be-transition);
}

.moreAwardsCategories .custom-accordion.active {
    background: var(--be-primary);
    border-color: var(--be-primary);
    border-left-color: var(--be-gold);
    color: var(--be-white);
    border-radius: 4px 4px 0 0;
}

.moreAwardsCategories .custom-accordion.active::after {
    content: "−";
    background: var(--be-gold);
    border-color: var(--be-gold);
    color: var(--be-white);
}

/* ACCORDION PANEL */

.moreAwardsCategories .custom-panel {
    display: none;
    width: 100%;
    padding: 22px;
    background: var(--be-white);
    border: 1px solid var(--be-border);
    border-top: 0;
    border-radius: 0 0 4px 4px;
}

/* CATEGORY LINKS */

.moreAwardsCategories .links2 {
    color: var(--be-gold);
    font-size: 14px;
    line-height: 2.5;
}

.moreAwardsCategories .links2 a {
    display: inline;
    padding: 0 5px;
    color: var(--be-text);
    font-family: var(--be-body-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 2;
    text-decoration: none;
    transition: var(--be-transition);
}

.moreAwardsCategories .links2 a:first-child {
    padding-left: 0;
}

.moreAwardsCategories .links2 a:hover {
    color: var(--be-gold-dark);
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* FOCUS ACCESSIBILITY */

.moreAwardsCategories .custom-accordion:focus-visible,
.moreAwardsCategories .links2 a:focus-visible {
    outline: 2px solid var(--be-gold);
    outline-offset: 3px;
}

/* TABLET */

@media (min-width: 768px) {

    .moreAwardsCategories {
        padding: 45px 0 55px;
    }

    .moreAwardsCategories .custom-accordion {
        padding: 22px 26px;
        font-size: 26px;
    }

    .moreAwardsCategories .custom-panel {
        padding: 25px 28px;
    }

}

/* DESKTOP */

@media (min-width: 1200px) {

    .moreAwardsCategories {
        padding: 50px 0 65px;
    }

}

/* MOBILE */

@media (max-width: 575.98px) {

    .moreAwardsCategories {
        padding: 30px 0 40px;
    }

    .moreAwardsCategories .custom-accordion {
        padding: 16px;
        font-size: 21px;
    }

    .moreAwardsCategories .custom-panel {
        padding: 16px;
    }

    .moreAwardsCategories .links2 {
        font-size: 13px;
        line-height: 2.3;
    }

    .moreAwardsCategories .links2 a {
        font-size: 13px;
        padding: 0 3px;
    }

}
