/* nav setting  */
/* div#navbarNav {
    background: transparent;
} */
/* nav setting  */

/* Hero Section */
.hero-section {
  background: linear-gradient(to bottom, transparent 65%, #fff 65%),
              linear-gradient(136deg, #E9282A 25.57%, #890002 91.87%);
  color: #fff;
  padding: 200px 20px 90px;
  text-align: center;
}

.hero-content {
  max-width: 1920px;
  margin: 0 auto;
}

/* Breadcrumb */
.hero-breadcrumb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 32px;
}

.hero-breadcrumb a,
.hero-breadcrumb span {
  color: #FFF;
  font-family: Ubuntu;
  font-size: 18.667px;
  line-height: 37.333px;
  opacity: 0.5;
}

.hero-breadcrumb span {
  opacity: 1;
}

.hero-breadcrumb a:hover {
  opacity: 1;
  text-decoration: none;
}

/* Title */
.hero-title {
  font-family: Ubuntu;
  font-size: 85.333px;
  line-height: 55.663px;
  margin-bottom: 42px;
}

/* Subtext */
.hero-subtext {
  max-width: 1109px;
  font-family: Ubuntu;
  font-size: 24px;
  line-height: 42.667px;
  margin: 0 auto 130px;
}

.hero-img-wrapper {
    padding: 0 80px;
}

img.hero-img {
    width: 100%;
    max-width: 1451px;
box-shadow: -127.568px 196.484px 65.25px 0px rgba(0, 0, 0, 0.00), -81.379px 125.368px 60.118px 0px rgba(0, 0, 0, 0.01), -45.455px 70.382px 50.587px 0px rgba(0, 0, 0, 0.05), -20.528px 31.525px 37.391px 0px rgba(0, 0, 0, 0.09), -5.132px 8.065px 20.528px 0px rgba(0, 0, 0, 0.10);
}


@media (max-width: 1760px) {
  .hero-section {
    padding: 150px 20px 70px;
  }

  .hero-breadcrumb a,
  .hero-breadcrumb span {
    font-size: 14px;
    line-height: 28px;
  }

  .hero-title {
    font-size: 64px;
    line-height: 41.747px;
    margin-bottom: 32px;
  }

  .hero-subtext {
    font-size: 18px;
    line-height: 32px;
    margin: 0 auto 96px;
  }
}

@media (max-width: 1290px) {
  .hero-section {
    padding: 125px 20px 45px;
  }

  .hero-breadcrumb {
    gap: 8px;
  }

  .hero-breadcrumb a,
  .hero-breadcrumb span {
    font-size: 16px;
    line-height: 19.911px;
  }

  .hero-title {
    font-size: 56px;
    line-height: 29.687px;
    margin-bottom: 23px;
  }

  .hero-subtext {
    max-width: 726px;
    font-size: 16px;
    line-height: 26px;
    margin: 0 auto 69px;
  }
}

@media (max-width: 700px) {
  .hero-title {
    font-size: 38.929px;
    line-height: 41.219px;
    letter-spacing: -1.055px;
    margin-bottom: 29px;
  }

  .hero-subtext {
    font-size: 18px;
    line-height: 32px;
    margin: 0 auto 86px;
  }
}

@media (max-width: 400px) {
  .hero-subtext {
    font-size: 16px;
    line-height: 24px;
    margin: 0 auto 65px;
  }
}



/* ////// */


.opportunity-details-section {
    padding: 50px 20px 110px;
    background-color: #fff;
    font-family: 'Ubuntu';
}

/* Top Row: Description + Sidebar */
.opportunity-wrapper {
  max-width: 1451px;
  margin: 0 auto;
  display: flex;
  gap: 105px;
  align-items: flex-start;
  flex-wrap: wrap;
}

/* Left Column */
.opportunity-left {
  flex: 2;
  min-width: 300px;
}

.opportunity-left h2 {
    color: #000;
    font-size: 30px;
    font-weight: 700;
    line-height: 41.747px;
    margin-bottom: 22px;
}

.opportunity-left p {
    color: #535353;
    font-size: 22px;
    line-height: 36px;
    margin-bottom: 0;
}

/* Right Column - Sidebar */
.opportunity-right {
  flex: 1;
  min-width: 280px;
}

.sidebar-box {
    width: 100%;
    max-width: 417.548px;
    background: #fff;
    padding: 27.93px;
    box-shadow: 0px 23.74px 48.877px 0px rgba(0, 0, 0, 0.10);
}

.sidebar-item {
  margin-bottom: 1.25rem;
}

.sidebar-item .label {
 	color: rgba(0, 0, 0, 0.75);
    font-size: 22px;
    font-weight: 500;
    line-height: 58.299px;
    margin: 0;
}

.sidebar-item .value {
	font-size: 28px;
    font-weight: 700;
    line-height: 58.299px;
    margin-bottom: 20px;
}

/* Compensation Block */
.compensation-box {
    background-color: #F5F6FA;
    padding: 25.137px;
    margin: 0 0 20px;
    text-align: left;
}

.compensation-box .amount {
    color: #000;
    font-size: 48px;
    font-weight: 700;
    line-height: 58.299px;
    margin: 0;
}

.compensation-box .comp-label {
    color: rgba(0, 0, 0, 0.75);
    font-size: 22.344px;
    font-weight: 500;
    line-height: 58.299px;
    margin: 0;
}

/* Location Row */
.location-row {
    display: flex;
    align-items: center;
    gap: 17px;
    color: #000;
    font-size: 28px;
    font-weight: 700;
    line-height: 58.299px;
    margin-bottom: 34px;
}

.location-row img {
	width: 100%;
    max-width: 39.101px;
}

/* Button */
.join-btn {    
	width: 100%;
    background: #020202;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 14.259px;
    display: flex;
    height: 79.599px;
    padding: 8.555px 7.605px;
    justify-content: center;
    align-items: center;
    gap: 20.913px;
    align-self: stretch;
    transition: background 0.2s ease;
}

.join-btn:hover {
  background: #333;
    color: #fff;
    text-decoration: unset;
}

/* Map Block */
.map-block {
    max-width: 1451px;
    margin: 110px auto 0;
    overflow: hidden;
}

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

.inclusive-cta-button {
  background: #fff;
  color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 205.333px;
  height: 58.667px;
  padding: 7.508px 6.674px;
  font-family: Ubuntu;
  font-size: 20px;
  font-weight: 700;
  line-height: 12.514px;
  margin: auto;
  transition: background 0.3s ease;
}

.inclusive-cta-button:hover {
  background: #ddd;
    color: #000;
    text-decoration: unset;
}

@media (max-width: 1760px) {
  .inclusive-cta-button {
    max-width: 154px;
    height: 44px;
    padding: 5.631px 5.006px;
    font-size: 18px;
    line-height: 9.386px;
  }
}

@media (max-width: 1290px) {
  .inclusive-cta-button {
    max-width: 130px;
    height: 34px;
    padding: 4.005px 3.56px;
    font-size: 16px;
    line-height: 6.674px;
  }
}

.inclusive-cta-banner {
  position: relative;
  background-color: #F5F6FA;
  background-image: url('/wp-content/uploads/2025/03/Rectangle-992-1.png');
  background-position: top, center;
  background-repeat: no-repeat;
  background-size: cover;

  padding: 133px 20px;
  color: #fff;
  text-align: center;

  display: flex;
  justify-content: center;
}

.inclusive-cta-content {
  position: relative;
  z-index: 3;
}

.inclusive-cta-content h2 {
  font-family: Ubuntu;
	    max-width: 1232px;
  font-size: 40px;
  font-weight: 500;
  line-height: 54.667px;
  margin-bottom: 46px;
}

.inclusive-cta-button {
  background: #fff;
  color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 205.333px;
  height: 58.667px;
  padding: 7.508px 6.674px;
  font-family: Ubuntu;
  font-size: 20px;
  font-weight: 700;
  line-height: 12.514px;
  margin: auto;
  transition: background 0.3s ease;
}

.inclusive-cta-button:hover {
  background: #ddd;
}

@media (max-width: 1760px) {
  .inclusive-cta-banner {
    padding: 100px 20px;
  }

  .inclusive-cta-content h2 {
	max-width: 924px;
    font-size: 30px;
    line-height: 41px;
    margin-bottom: 37px;
  }

  .inclusive-cta-button {
    max-width: 154px;
    height: 44px;
    padding: 5.631px 5.006px;
    font-size: 18px;
    line-height: 9.386px;
  }
}

@media (max-width: 1290px) {
  .inclusive-cta-banner {
    padding: 83px 20px 65px;
  }

  .inclusive-cta-content h2 {
    max-width: 706px;
    font-size: 28px;
    line-height: 34px;
    margin-bottom: 19.2px;
  }

  .inclusive-cta-button {
    max-width: 130px;
    height: 34px;
    padding: 4.005px 3.56px;
    font-size: 16px;
    line-height: 6.674px;
  }
}

@media (max-width: 540px) {
  .inclusive-cta-banner {
    padding: 64px 20px 46px;
  }

  .inclusive-cta-content h2 {
        max-width: 752px;
        font-size: 22px;
        line-height: 34px;
        margin-bottom: 27px;
  }
}



@media (max-width:1760px) {


img.hero-img {
    max-width: 1143px;
}

.opportunity-wrapper {
    max-width: 1143px;
    gap: 113px;
}

.opportunity-details-section {
    padding: 30px 20px 110px;
}

.opportunity-left h2 {
    font-size: 24px;
    margin-bottom: 6px;
}

.opportunity-left p {
    font-size: 16px;
    line-height: 24px;
}

.map-block {
    max-width: 1143px;
}

.sidebar-box {
    max-width: 299px;
    padding: 20px;
}

.sidebar-item .label {
    font-size: 18px;
    line-height: 41.747px;
}

.sidebar-item .value {
    font-size: 22px;
    line-height: 41.747px;
    margin-bottom: 16px;
}

.compensation-box {
    padding: 18px;
    margin: 0 0 16px;
}

.compensation-box .amount {
    font-size: 38px;
    line-height: 41.747px;
}

.compensation-box .comp-label {
    font-size: 16px;
    line-height: 41.747px;
}

.location-row {
    gap: 8px;
    font-size: 22px;
    line-height: 41.747px;
    margin-bottom: 24px;
}

.location-row img {
    max-width: 28px;
}

.join-btn {
    font-size: 17.018px;
    line-height: 10.211px;
    height: 57px;
    padding: 6.126px 5.446px;
}



}


@media (max-width: 1290px) {

img.hero-img {
    width: unset;
}

.hero-img-wrapper {
         display: flex;
        max-width: 859px;
        align-items: self-start;
        justify-content: center;
        margin: auto;
        overflow: hidden;
        box-shadow: -12px 12px 11px rgba(0, 0, 0, 0.2);
}

.opportunity-wrapper {
        max-width: 849px;
        gap: 79px;
    }


    .sidebar-box {
        max-width: 263.395px;
        padding: 17.618px;
    }

    .sidebar-item .label {
        font-size: 15.857px;
        line-height: 36.776px;
    }

    .sidebar-item .value {
        font-size: 19.38px;
        line-height: 36.776px;
        margin-bottom: 14px;
    }

    .compensation-box {
        padding: 15px;
        margin: 0 0 14px;
    }

.compensation-box .amount {
        font-size: 33.475px;
        line-height: 36.776px;
    }

.compensation-box .comp-label {
        font-size: 14.095px;
        line-height: 36.776px;
    }


    .location-row {
        gap: 7px;
        font-size: 18px;
        line-height: 36.776px;
        margin-bottom: 21px;
    }

.join-btn {
        font-size: 16px;
        line-height: 8.995px;
        height: 50.212px;
        padding: 5.397px 4.797px;
    }

.map-block {
        max-width: 849px;
    }


}


@media (max-width: 992px) {

    .hero-section {
        padding: 125px 40px 45px;
    }

.opportunity-details-section {
        padding: 30px 0 110px;
    }

.inclusive-cta-banner {
        padding: 83px 40px 65px;
    }

.opportunity-right {
    width: 100%;
}

    .opportunity-wrapper {
        flex-direction: column;
    }

    .sidebar-box {
        max-width: unset;
    }

.compensation-box {
/*         max-width: 260px; */
    }

.opportunity-left, .opportunity-right {
    padding: 0 40px;
}

}


@media (max-width: 540px) {
    .hero-section {
        padding: 125px 35px 45px;
    }

    .opportunity-left, .opportunity-right {
        padding: 0 35px;
    }

.hero-breadcrumb a:nth-of-type(2) {
    display: inline-block;
    max-width: 50px; 
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .opportunity-details-section {
        padding: 5px 0 0px;
    }

.opportunity-wrapper {
        gap: 53px;
    }

    .inclusive-cta-banner {
        padding: 76px 15px;
    }

}

@media (max-width: 400px) {
    .hero-section {
        padding: 125px 25px 45px;
    }

.opportunity-left, .opportunity-right {
        padding: 0 25px;
    }

.map-block {
    margin: 80px auto 0;
}

    .inclusive-cta-banner {
        padding: 60px 15px;
    }

    .inclusive-cta-content h2 {
        font-size: 20px;
        line-height: 30px;
    }






}



