/* Fonts */

@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");

/* Global Styling */

* {
  box-sizing: border-box;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;
}

body {
  padding: 0;

  margin: 0;

  width: 100%;

  overflow-x: hidden;

  position: relative;

  font-family: "Plus Jakarta Sans", sans-serif;

  font-style: normal;

  background: #fff;
  cursor: none;
}

html {
  height: 100%;

  width: 100%;

  font-size: 16px;

  overflow-x: hidden;

  scroll-behavior: smooth;
}

ol,
ul {
  margin: 0;

  padding: 0;

  list-style: none;
}

a,
a:hover,
a:focus {
  outline: none;

  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;

  font-style: normal;

  color: #191919;
}

h1,
.h1 {
  color: #191919;

  font-size: 40px;

  line-height: 132%;

  font-weight: 600;
}

h2,
.h2 {
  font-size: 36px;

  line-height: 148%;

  font-weight: 600;
}

h3,
.h3 {
  font-size: 24px;

  line-height: 148%;

  font-weight: 600;
}

h4,
.h4 {
  font-size: 14px;

  font-weight: 700;

  line-height: 140%;

  letter-spacing: 1.68px;

  text-transform: uppercase;
}

p, p a {
  color: #5b5d5f;

  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  margin: 0;
}

a {
  font-size: 14px;

  line-height: normal;

  margin: 0;
}

p a {
    text-decoration: underline !important;
}

textarea {
  resize: none;
}

ul.nav > li a,
a {
  -moz-transition: all 0.3s linear;

  -webkit-transition: all 0.3s linear;

  -o-transition: all 0.3s linear;

  transition: all 0.3s linear;
}

img {
  width: 100%;

  height: 100%;

  padding: 0;

  margin: 0;
}

.container {
  max-width: 1280px;

  width: 100%;

  margin: 0 auto;
}

.btn-primary,
.btn-secondry {
  border-radius: 6px;

  background: #f7d124;

  display: flex;

  align-items: center;

  padding: 14px 20px;

  gap: 8px;

  color: #5e3319;

  font-size: 14px;

  font-weight: 600;

  line-height: normal;

  text-transform: capitalize;

  width: fit-content;
}

.btn-secondry {
  background: #5e3319;

  color: #f7d124;
}

.btn-primary img,
.btn-secondry img {
  position: relative;

  width: 18px;

  height: 18px;

  transition: all 0.3s linear;
}

.btn-primary:hover {
  background: #5e3319;

  color: #f7d124;
}

.btn-secondry:hover {
  background: #f7d124;

  color: #5e3319;
}

/* Global Classes */

.d-flex {
  display: flex;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-col {
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.jc-space-between {
  justify-content: space-between;
}

.jc-center {
  justify-content: center;
}

.jc-start {
  justify-content: flex-start;
}

.jc-end {
  justify-content: flex-end;
}

.ai-start {
  align-items: flex-start;
}

.ai-center {
  align-items: center;
}

.ai-end {
  align-items: flex-end;
}

.pd-120 {
  padding: 120px 0;
}

.pd-80 {
  padding: 80px 0;
}

.r-gap-large {
  gap: 56px;
}

.r-gap-med {
  gap: 48px;
}

#cursor {
  position: fixed;
  width: 14px; height: 14px;
  background: white;
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%) scale(2);
  transition: transform 0.25s cubic-bezier(0.23, 1, 0.32, 1);
  mix-blend-mode: difference;  /* ← this does all the color magic */
  will-change: transform; 
}

#cursor.expanded {
  transform: translate(-50%, -50%) scale(6);  /* adjust scale to taste */
}

a {
    cursor: none !important;
}

/* Header Styles */

#global-header {
  width: 100%;

  position: fixed;

  top: 0;

  left: 0;

  z-index: 999;

  transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1);
}

.header-scrolled {
  background: #ffffff;

  box-shadow: 0px 0px 50px 0px rgba(129, 141, 149, 0.14);

  border-bottom: 1px solid #e6e7e7;
}

.main-header {
  padding: 16px 0;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.48) 0%,

    rgba(0, 0, 0, 0) 100%
  );

  transition: background 0.4s ease;
}

.header-scrolled .main-header {
  background: transparent;
}

.header-logo a {
  display: block;

  width: 196px;

  height: 40px;
}

.logo-scrolled,
.icon-scrolled {
  display: none;
}

.header-scrolled .logo-default,
.header-scrolled .icon-default {
  display: none;
}

.header-scrolled .logo-scrolled,
.header-scrolled .icon-scrolled {
  display: block;
}

.main-header-nav ul {
  gap: 32px;
}

.main-header-nav ul li a {
  color: #ffffff;

  font-size: 16px;

  font-weight: 500;

  line-height: 1.26em;

  letter-spacing: normal;

  text-transform: capitalize;

  display: flex;

  align-items: center;

  gap: 8px;

  transition: color 0.4s ease;
}

.header-scrolled .main-header-nav:not(.mobile-active) ul li a {
  color: #191919;
}

/* Sub-menu icon filter adjustment for scrolled state */

.header-scrolled .main-header-nav:not(.mobile-active) .sub-menu-icon {
  filter: brightness(0.1);
}

.header-scrolled .header-actions .btn-primary {
  background: #5e3319;

  color: #f7d124;
}

/* Update mobile menu toggle color for scrolled header */

.header-scrolled .header-main-mobile-menu-toggle:not(.active) span {
  background: #191919;
}

.header-mobile-cta {
  display: none;
}

.header-scrolled .header-actions .btn-primary {
  background: #5e3319;

  color: #f7d124;
}

.header-scrolled .header-actions .btn-primary:hover {
  background: #f7d124;

  color: #5e3319;
}

.sub-menu-icon {
  transition: transform 0.3s ease;
}

/* Dual-Icon Button Toggle */

.icon-hover {
  display: none;
}

.btn-primary:hover .icon-default,
.btn-secondry:hover .icon-default {
  display: none;
}

.btn-primary:hover .icon-hover,
.btn-secondry:hover .icon-hover {
  display: block;
}

/* Scrolled Header Button Icon logic */

.header-scrolled .header-actions .btn-primary .icon-default {
  display: none;
}

.header-scrolled .header-actions .btn-primary .icon-hover {
  display: block;
}

.header-scrolled .header-actions .btn-primary:hover .icon-default {
  display: block;
}

.header-scrolled .header-actions .btn-primary:hover .icon-hover {
  display: none;
}

.main-header-nav ul li a:hover {
  color: #f7d124;
}

.main-header-nav ul li a:hover .sub-menu-icon {
  filter: invert(78%) sepia(54%) saturate(600%) hue-rotate(350deg)
    brightness(100%) contrast(100%);
}

.header-cta-menu {
  gap: 48px;
}

/* Sub-menu Styling */

.has-sub-menu {
  position: relative;
}

.sub-menu {
  position: absolute;

  top: calc(100% + 10px);

  left: 0;

  width: max-content;

  min-width: 240px;

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

  backdrop-filter: blur(24px);

  -webkit-backdrop-filter: blur(24px);

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

  border-radius: 12px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  gap: 16px;

  opacity: 0;

  visibility: hidden;

  transform: translateY(10px);

  transition: all 0.3s ease;

  z-index: 999;
}

.has-sub-menu:hover .sub-menu {
  opacity: 1;

  visibility: visible;

  transform: translateY(0);
}

.sub-menu li a {
  color: #ffffff !important;

  font-size: 14px;

  font-weight: 500;

  text-transform: capitalize;

  transition: color 0.3s ease;
}

.sub-menu li a:hover {
  color: #f7d124 !important;
}

.header-scrolled .sub-menu {
  background: #fff;

  box-shadow: 0 0 10px #00000017;
}

.header-scrolled .sub-menu li a {
  color: #191919 !important;
}

.header-scrolled .main-header-nav:not(.mobile-active) ul li a:hover {
  color: #5e3319;
}

/* Mobile Menu Toggle */

.header-main-mobile-menu {
  display: none;

  position: relative;

  z-index: 1001;

  /* Above full-screen menu */
}

.header-main-mobile-menu-toggle {
  background: transparent;

  border: none;

  cursor: pointer;

  display: flex;

  flex-direction: column;

  gap: 6px;

  padding: 10px;

  margin-right: -10px;
}

.header-main-mobile-menu-toggle span {
  display: block;

  width: 24px;

  height: 2px;

  background: #fff;

  transition:
    transform 0.4s cubic-bezier(0.77, 0, 0.175, 1),
    background 0.4s,
    opacity 0.4s;

  border-radius: 2px;
}

.header-main-mobile-menu-toggle.active span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.header-main-mobile-menu-toggle.active span:nth-child(2) {
  opacity: 0;

  transform: translateX(10px);
}

.header-main-mobile-menu-toggle.active span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

/* Hero Styles */

.home-hero-section {
  position: relative;

  width: 100%;

  min-height: 860px;

  border-radius: 0 0 32px 32px;

  overflow: hidden;

  display: flex;

  align-items: flex-end;

  padding-bottom: 58px;

  padding-top: 150px;

  background: transparent;
}

.hero-video-bg {
  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  z-index: -2;
}

.hero-overlay {
  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.4) 0%,

    rgba(0, 0, 0, 0.64) 100%
  );

  z-index: -1;
}

.home-hero-section .container {
  position: relative;

  z-index: 1;

  height: auto;
}

.home-hero-content-wrap {
  width: 100%;

  gap: 88px;

  flex-wrap: wrap;
}

.hero-content-left {
  flex: 1;

  gap: 16px;

  max-width: 48%;
}

.home-hero-welcome {
  gap: 12px;
}

.welcome-icon {
  width: 24px;

  height: 24px;

  background: rgba(247, 209, 36, 0.16);

  border-radius: 120px;
}

.welcome-icon img {
  width: 24px;

  height: 24px;
}

.welcome-text {
  color: #f7d124;

  font-size: 14px;

  font-weight: 700;

  line-height: 140%;

  letter-spacing: 1.68px;

  text-transform: uppercase;
}

.hero-content-left h1 {
  color: #ffffff;

  font-size: 40px;

  font-weight: 600;

  line-height: 132%;

  margin: 0;
}

.hero-content-right {
  flex: 0 0 auto;

  max-width: 48%;

  gap: 32px;

  padding-bottom: 8px;
}

.hero-content-right p, .home-hero-content-wrap p {
  color: #ffffff;

  font-size: 20px;

  font-weight: 500;

  line-height: 156%;

  margin: 0;
}

.home-hero-btns {
  gap: 12px;
}

/* Partners Slider */

.partners-slider-section {
  padding: 32px 0 0;

  width: 100%;

  background: #f8f8f8;

  overflow: hidden;
}

.partners-swiper .swiper-wrapper {
  /* Critical for smooth continuous marquee scroll */

  transition-timing-function: linear !important;
}

.partner-slide {
  width: 212px !important;

  height: 114px;

  background: #ffffff;

  border-radius: 16px;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 22px;

  box-sizing: border-box;

  cursor: pointer;
}

.partner-slide img {
  max-width: 100%;

  max-height: 100%;

  object-fit: contain;

  filter: grayscale(100%);

  opacity: 0.6;

  transition: all 0.4s ease;
}

.partner-slide:hover img {
  filter: grayscale(0%);

  opacity: 1;
}

/* About Us */

.about-section-home {
  background-color: #f5f5f5;
}

.pd-80 {
  padding: 80px 0;
}

.about-section-flex {
  gap: 48px;
}

.section-header {
  gap: 12px;
}

.section-sub-heading {
  gap: 12px;
}

.sub-heading-icon {
  width: 24px;

  height: 24px;

  border-radius: 120px;
}

.sub-heading-icon.brown-bg {
  background: rgba(94, 51, 25, 0.12);
}

.sub-heading-icon img {
  width: 24px;

  height: 24px;
}

.sub-heading-text {
  font-size: 14px;

  font-weight: 700;

  line-height: 140%;

  letter-spacing: 1.68px;

  text-transform: uppercase;
}

.brown-text {
  color: #5e3319;
}

.section-header h2 {
  color: #191919;

  font-size: 36px;

  font-weight: 600;

  line-height: 148%;

  max-width: 848px;

  margin: 0;

  text-align: center;
}

.about-images-row {
  row-gap: 24px;
}

.about-main-img {
  width: 49%;

  height: 424px;

  object-fit: cover;

  border-radius: 24px;
}

.about-bottom-row {
  gap: 40px;
}

.about-swg-card {
  width: 28%;

  height: 220px;

  background: #ffffff;

  border-radius: 16px;

  padding: 10px;
}

.about-swg-card img {
  width: 175px;

  height: 100px;

  object-fit: contain;
}

.about-text-content {
  width: 68%;

  gap: 40px;
}

.about-text-content p {
  color: #5b5d5f;

  font-size: 20px;

  font-weight: 400;

  line-height: 156%;

  margin: 0;
}

.about-btn-wrap {
  display: flex;

  justify-content: flex-start;
}

/* Services Home Section */

.services-section-home {
  background-color: transparent;
}

.services-section-flex {
  background: #ffffff;

  border-radius: 32px;

  padding: 0;

  gap: 48px;
}

.services-section-home .section-header {
  align-items: flex-end;

  text-align: right;
}

.services-section-home .section-header h2 {
  text-align: right;

  margin-right: 0;

  margin-left: auto;
}

.services-items-wrap {
  gap: 32px;

  width: 100%;
}

.service-item-row {
  gap: 64px;

  border-bottom: 1px solid #cbced3;

  padding-bottom: 32px;
}

.service-item-row:last-child {
  border-bottom: none;

  padding-bottom: 0;
}

.service-item-content {
  flex: 1;

  padding: 40px 0;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  gap: 76px;

  min-width: 300px;
}

.service-text-top {
  gap: 16px;
}

.service-text-top h3 {
  color: #191919;

  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  margin: 0;
}

.yellow-gradient-line {
  width: 300px;

  height: 2px;

  max-width: 100%;

  background: linear-gradient(
    90deg,
    rgba(247, 209, 36, 0) 0%,

    rgba(247, 209, 36, 1) 20%,

    rgba(247, 209, 36, 1) 80%,

    rgba(247, 209, 36, 0) 100%
  );
}

.service-text-top p {
  color: #5b5d5f;

  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  margin: 0;
}

.service-img-wrap {
  flex: 0 0 auto;

  width: 316px;

  height: 356px;

  position: relative;

  border-radius: 16px;

  overflow: hidden;
}

.service-img-wrap > img {
  width: 100%;

  height: 100%;

  object-fit: cover;
}

.service-icon-box {
  position: absolute;

  bottom: 12px;

  right: 12px;

  background: #ffffff;

  border-radius: 12px;

  padding: 8px;

  width: 72px;

  height: 72px;

  display: flex;

  align-items: center;

  justify-content: center;
}

.service-icon-box img {
  width: 56px;

  height: 56px;

  object-fit: contain;
}

.service-btn-wrap {
  display: flex;

  justify-content: flex-start;
}

/* Text Slider Section */

.text-slider-section {
  overflow: hidden;

  background-color: #ffffff;
}

.text-slider-swiper {
  width: 100%;
}

.text-slider-swiper .swiper-wrapper {
  transition-timing-function: linear;
}

.text-slider-swiper .swiper-slide {
  width: auto;
}

.slide-gap {
  gap: 60px;

  margin-right: 60px;

  /* Account for continuous trailing gap in loop */
}

.slider-text {
  font-size: 120px;

  font-weight: 600;

  line-height: 126%;

  color: #191919;

  text-transform: capitalize;

  white-space: nowrap;

  opacity: 1;
}

/* Structurally alternate opacity via slide index */

.swiper-slide:nth-child(odd) .slider-text {
  opacity: 0.4;
}

.slider-dash {
  width: 40px;

  height: 10px;

  background-color: #191919;

  flex-shrink: 0;
}

/* Projects Slider Section */

.projects-slider-section {
  background-color: transparent;

  background-size: cover;

  background-position: center;

  border-radius: 32px;

  position: relative;

  overflow: hidden;

  margin-top: -40px;
}

.projects-slider-flex {
  gap: 56px;
}

.projects-slider-section::before,
.hse-certifications-section::before {
  content: "";

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  background: rgba(0, 0, 0, 0.7);

  backdrop-filter: blur(20px);

  -webkit-backdrop-filter: blur(20px);

  z-index: 1;
}

.projects-swiper {
  z-index: 2;

  overflow: visible;

  width: 90%;
}

.projects-nav-row {
  z-index: 2;

  gap: 14px;

  margin-top: 56px;
}

.project-slide-inner {
  width: 100%;

  gap: 32px;
}

.project-img-box {
  border-radius: 24px;

  overflow: hidden;

  width: 100%;

  height: 560px;
}

.project-img-box img {
  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;
}

.project-info-row {
  gap: 80px;
}

.project-info-left {
  width: 308px;

  flex-shrink: 0;

  gap: 16px;
}

.project-titles {
  gap: 8px;
}

.project-titles h3 {
  color: #ffffff;

  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  margin: 0;
}

.project-titles span {
  color: #f7d124;

  font-size: 14px;

  font-weight: 600;

  line-height: 156%;
}

.project-gradient-line {
  width: 240px;

  height: 2px;

  background: linear-gradient(
    90deg,
    rgba(247, 209, 36, 0) 0%,

    rgba(247, 209, 36, 1) 20%,

    rgba(247, 209, 36, 1) 80%,

    rgba(247, 209, 36, 0) 100%
  );

  max-width: 100%;
}

.project-info-right {
  flex: 1;

  gap: 24px;
}

.project-info-right p {
  color: #e6e7e7;

  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  margin: 0;
}

.project-btn-wrap {
  display: flex;

  justify-content: flex-start;
}

/* Project slide dedicated button - Figma: #5E3319 bg, #F7D124 text, padding 14px 20px, br 6px */

.project-see-details {
  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding: 14px 20px;

  background: #5e3319;

  color: #f7d124;

  border-radius: 6px;

  font-size: 14px;

  font-weight: 600;

  line-height: 126%;

  text-transform: uppercase;

  text-decoration: none;

  transition: background 0.3s ease;
}

.project-see-details:hover {
  background: #4a2812;
}

.project-see-details img {
  width: 18px;

  height: 18px;

  flex-shrink: 0;
}

/* Projects Navigation */

.project-nav-container {
  width: 100%;

  max-width: 1280px;

  margin: 0 auto;

  padding: 0 20px;
}

.projects-nav-row {
  gap: 14px;
}

.projects-progress-box {
  flex: 1;

  position: relative;

  height: 2px;

  display: flex;

  align-items: center;
}

.projects-swiper-pagination {
  position: relative !important;

  width: 100%;

  height: 2px !important;

  background: rgba(255, 255, 255, 0.2) !important;

  display: block;

  border-radius: 2px;
}

.projects-swiper-pagination .swiper-pagination-progressbar-fill {
  background: #f7d124 !important;

  border-radius: 2px;
}

.projects-arrows {
  gap: 8px;

  flex-shrink: 0;

  z-index: 1;
}

.proj-nav-btn {
  padding: 10px;

  background: #f7d124;

  border-radius: 6px;

  transition: background 0.3s ease;

  border: none;

  display: flex;

  align-items: center;

  justify-content: center;
}

.proj-nav-btn:hover {
  background: #e0bd10;
}

.proj-nav-btn img {
  width: 18px;

  height: 18px;

  display: block;

  transition: filter 0.3s ease;
}

/* Footer Styles */

.footer-wrapper {
  background: #191919;

  border-radius: 32px;

  padding: 80px 0 32px;

  width: 100%;

  position: relative;

  z-index: 2;
}

.footer-wrapper .container {
  display: flex;

  flex-direction: column;

  gap: 40px;
}

.footer-top {
  gap: 16px;

  width: 100%;
}

.footer-brand-logo {
  width: fit-content;

  height: 70px;
}

.footer-brand-logo img {
  height: 100%;

  width: auto;

  object-fit: contain;
}

.footer-dash-line {
  flex: 1;

  height: 1px;

  border-top: 1.5px dashed #f7d124;
}

.footer-secondary-logo {
  width: 151px;

  height: 60px;
}

.footer-secondary-logo img {
  height: 100%;

  width: auto;

  object-fit: contain;
}

.footer-main {
  padding-top: 40px;

  border-top: 1px solid rgba(255, 255, 255, 0.2);

  gap: 32px;

  align-items: center;
}

.footer-contact-info {
  gap: 24px;
}

.contact-item {
  gap: 10px;
}

.contact-icon {
  width: 24px;

  height: 24px;

  display: flex;

  align-items: center;

  justify-content: center;
}

.contact-text {
  color: #ffffff;

  font-size: 14px;

  font-weight: 500;

  line-height: 1.26em;

  transition: color 0.3s ease;
}

a.contact-text:hover {
  color: #f7d124;
}

.text-lowercase {
  text-transform: lowercase;
}

.footer-nav-links ul {
  gap: 48px;
}

.footer-nav-links ul li a {
  color: #ffffff;

  font-size: 14px;

  font-weight: 500;

  text-transform: capitalize;

  transition: color 0.3s ease;
}

.footer-nav-links ul li a:hover {
  color: #f7d124;
}

.footer-bottom {
  padding-top: 32px;

  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-copyright p {
  color: #ffffff;

  font-size: 13px;

  font-weight: 500;

  margin: 0;

  opacity: 0.8;
}

.footer-legal-links,
.footer-legal-links #menu-terms-menu {
  gap: 48px;
}

.footer-legal-links a {
  color: #ffffff;

  font-size: 14px;

  font-weight: 500;

  transition: color 0.3s ease;
}

.footer-legal-links a:hover {
  color: #f7d124;
}

.back-to-top {
  gap: 4px;

  cursor: pointer;
}

.back-to-top img {
  width: 20px;

  height: 20px;

  transition: transform 0.3s ease;
}

.back-to-top:hover img {
  transform: translateY(-4px);
}

/* Footer Parallax Image */

.parallex-image {
  position: relative;

  width: 100%;

  max-width: 100%;

  height: 700px;

  margin: -60px auto 0;

  overflow: hidden;

  z-index: 1;

  background-size: cover;

  background-position: 50% 0%;

  background-repeat: no-repeat;
}

/* Valued Partners Section */

.home-valued-partners {
  background-color: #f5f5f5;

  overflow: hidden;

  padding-top: 0 !important;
}

.home-valued-flex {
  gap: 56px;
}

.home-valued-visuals {
  position: relative;

  width: 863.6px;

  height: 328.6px;

  max-width: 100%;

  margin: 0 auto;
}

.hvp-line {
  position: absolute;

  width: 1px;

  height: 81px;

  background-color: #cbced3;

  top: 0;
}

.hvp-line-1 {
  left: 187.23px;
}

.hvp-line-2 {
  left: 667.23px;
}

.hvp-img-card {
  position: absolute;

  background: #ffffff;

  border: 0.5px solid #cbced3;

  border-radius: 24px;

  padding: 10px;

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 2;
}

/* Card 1 */

.hvp-img-card:first-of-type {
  width: 360px;

  height: 220px;

  transform: rotate(4deg) !important;

  left: 0;

  top: 66.71px;
}

.hvp-img-card:first-of-type img {
  width: 181.55px;

  height: 111.96px;

  object-fit: contain;
}

/* Card 2 */

.hvp-img-card.hvp-img-card-lg {
  left: 470.87px;

  top: 70px;

  width: 360px;

  height: 220px;

  transform: rotate(-10deg) !important;
}

.hvp-img-card.hvp-img-card-lg img {
  width: 288px;

  height: 100px;

  object-fit: contain;
}

.hvp-col-left {
  width: 30%;
}

.hvp-col-left .section-header {
  gap: 12px;
}

.hvp-col-right {
  width: 60%;

  gap: 56px;
}

/* Sub-heading refinement */

.sub-heading-dot {
  width: 24px;

  height: 24px;

  background-color: rgba(94, 51, 25, 0.12);

  border-radius: 120px;

  margin-right: 10px;
}

.sub-heading-text.brown-text {
  font-size: 14px;

  font-weight: 700;

  line-height: 1.4em;

  letter-spacing: 0.12em;

  /* 12% */

  text-transform: uppercase;

  color: #5e3319;
}

.hvp-text-block {
  gap: 24px;
}

.hvp-lead {
  font-size: 24px;

  font-weight: 600;

  line-height: 1.56em;

  color: #5b5d5f;

  margin: 0;
}

.hvp-col-right p {
  font-size: 20px;

  font-weight: 400;

  line-height: 1.56em;

  color: #5b5d5f;

  margin: 0;
}

.hvp-col-left .section-header h2 {
  max-width: 100% !important;

  text-align: left;
}

/* Home Testimonials */

.testimonial-home-sections {
  position: relative;

  z-index: 2;

  border-radius: 32px;

  background: #191919;

  padding-top: 80px;

  padding-bottom: 80px;
}

.testimonial-home-flex {
  gap: 160px;

  align-items: flex-start;

  margin-bottom: 120px;
}

.testimonial-home-slider {
  flex: 1;

  max-width: 100%;

  overflow: hidden;
}

.testimonial-content {
  gap: 48px;
}

.testimonial-quote {
  font-size: 28px;

  font-weight: 600;

  line-height: 1.48em;

  color: #ffffff;

  margin: 0;
}

.testimonial-author-box {
  gap: 16px;

  width: 100%;
}

.testimonial-divider {
  width: 100%;

  height: 1px;

  background: #ffffff;

  opacity: 0.1;
}

.testimonial-author {
  font-size: 18px;

  font-weight: 600;

  line-height: 1.48em;

  color: #f7d124;
}

.testimonial-nav-container {
  gap: 16px;

  margin-top: 48px;
}

.test-nav-btn {
  width: 48px;

  height: 48px;

  border-radius: 50%;

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

  transition: all 0.3s ease;
}

.test-nav-btn:hover {
  background: rgba(255, 255, 255, 0.2);
}

.test-nav-btn img {
  width: 16px;

  height: 16px;

  filter: brightness(0) invert(1);
}

.testimonial-home-header {
  flex: 0 0 auto;
}

.testimonial-home-header .sub-heading-text {
  font-size: 16px;

  font-weight: 600;

  line-height: 1.48em;

  text-transform: capitalize;

  text-align: left !important;
}

.testimonial-home-sections .slider-text {
  color: #fff;
}

.testimonial-home-sections .slider-dash {
  background-color: #fff;
}

.testimonial-parallex-image {
  height: 820px;

  margin-top: -60px;

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  background-attachment: fixed;

  border-bottom-left-radius: 32px;

  border-bottom-right-radius: 32px;
}

/* Home Support SWC */

.home-support-swc-commu {
  padding-top: 80px;

  background-color: #f5f5f5;
}

.home-support-swc-flex {
  gap: 40px;

  margin-bottom: 80px;
}

.home-support-swc-detail {
  gap: 72px;

  width: 100%;
}

.support-swc-img-box {
  width: 30%;

  height: 372px;

  border-radius: 16px;

  overflow: hidden;
}

.support-swc-img-box img {
  width: 100%;

  height: 100%;

  object-fit: cover;
}

.support-swc-text-box {
  width: 60%;

  gap: 40px;
}

.support-swc-text-box p {
  font-size: 20px;

  line-height: 1.56em;

  color: #5b5d5f;

  margin: 0;
}

.support-swc-btn {
  align-self: flex-start;
}

.home-support-swc-flex .section-header h2 {
  max-width: 100%;

  text-align: left;
}

/* =============================

       Leadership Page

============================= */

.leadership-hero-section {
  position: relative;

  height: 360px;

  overflow: hidden;

  border-radius: 0 0 32px 32px;
}

.leadership-hero-bg {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 0 0 32px 32px;
}

.leadership-hero-overlay {
  position: absolute;

  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.4) 0%,

    rgba(0, 0, 0, 0.64) 100%
  );

  border-radius: 0 0 32px 32px;
}

.leadership-hero-content {
  position: absolute;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;
}

.leadership-hero-content h1 {
  color: #ffffff;

  font-weight: 600;

  text-align: center;
}

.leadership-section {
  background: #f5f5f5;
}

.leader-item {
  display: flex;

  flex-direction: column;

  gap: 32px;

  border-bottom: 1px solid #cbced3;

  padding-bottom: 60px;
}

.leader-item:last-child {
  border-bottom: none !important;

  padding-bottom: 0 !important;
}

.leader-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.leader-header.align-right {
  align-items: flex-end;

  text-align: right;
}

.leader-header h2 {
  font-weight: 600;

  color: #191919;
}

.leader-content {
  display: flex;

  align-items: center;

  gap: 48px;
}

.leader-content.reversed {
  flex-direction: row-reverse;
}

.leader-photo-wrap {
  flex: 1;

  height: 648px;

  position: relative;

  border-radius: 24px;

  overflow: hidden;

  display: flex;

  align-items: flex-end;

  justify-content: flex-end;

  padding: 16px;

  flex-shrink: 0;
}

.leader-photo-wrap img.leader-photo {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 24px;
}

.linkedin-btn {
  position: relative;

  z-index: 2;

  display: flex;

  align-items: center;

  gap: 11px;

  padding: 12px 20px;

  border-radius: 6px;

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

  backdrop-filter: blur(42px);

  -webkit-backdrop-filter: blur(42px);

  text-decoration: none;

  transition: background 0.3s ease;
}

.linkedin-btn:hover {
  background: rgba(255, 255, 255, 0.35);
}

.linkedin-btn .li-icon {
  width: 32px;

  height: 32px;

  flex-shrink: 0;
}

.linkedin-btn span {
  color: #f7d124;

  font-size: 14px;

  font-weight: 600;

  line-height: normal;

  text-transform: capitalize;

  white-space: nowrap;
}

.linkedin-btn .li-arrow {
  width: 18px;

  height: 18px;

  flex-shrink: 0;
}

.leader-bio-wrap {
  flex: 1;

  min-width: 0;
}

.leader-bio-wrap p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0 0 28px 0;
}

.leader-bio-wrap p:last-child {
  margin-bottom: 0;
}

.read-more-link {
  color: #5e3319;

  font-size: 18px;

  font-weight: 600;

  line-height: 156%;

  cursor: pointer;

  display: inline;
}

.read-more-ellipsis {
  color: #5e3319;

  font-size: 18px;

  font-weight: 700;

  line-height: 156%;
}

.leader-extra-bio {
  display: none;
}

.leader-extra-bio.open {
  display: inline;
}

.contact-text-slider-section {
  overflow: hidden;

  background-color: #f5f5f5;

  padding: 80px 0 0;
}

.contact-text-slider-section .slider-text {
  color: #191919;
}

/* =============================

   Community Page

============================= */

.community-hero-section {
  position: relative;

  height: 360px;

  overflow: hidden;

  border-radius: 0 0 32px 32px;
}

.community-hero-bg {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 0 0 32px 32px;
}

.community-hero-overlay {
  position: absolute;

  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.4) 0%,

    rgba(0, 0, 0, 0.64) 100%
  );

  border-radius: 0 0 32px 32px;
}

.community-hero-content {
  position: absolute;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;
}

.community-hero-content h1 {
  color: #ffffff;

  font-weight: 600;

  text-align: center;
}

.community-section {
  background: #f5f5f5;
}

/* Supporting SWC block */

.community-intro-block {
  display: flex;

  flex-direction: column;

  gap: 40px;
}

.community-intro-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.community-intro-header h2 {
  font-weight: 600;

  color: #191919;

  margin: 0;
}

.community-content-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.community-main-img {
  flex: 1;

  height: 648px;

  border-radius: 24px;

  object-fit: cover;

  flex-shrink: 0;

  min-width: 0;
}

.community-text-col {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 40px;

  min-width: 0;
}

.community-text-col p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.community-photo-carousel-wrap {
  position: relative;

  overflow: hidden;
}

.community-photo-swiper {
  overflow: visible;

  padding: 0 80px;
}

.community-photo-swiper .swiper-slide img {
  height: 324px;

  width: 100%;

  object-fit: cover;

  border-radius: 16px;

  display: block;
}

.community-photo-carousel-nav {
  /* display: flex; */

  display: none;

  justify-content: center;

  align-items: center;

  gap: 8px;

  margin-top: 24px;
}

.community-photo-carousel-nav .proj-nav-btn {
  padding: 10px;

  background: #f7d124;

  border-radius: 6px;

  cursor: pointer;

  transition: background 0.3s ease;

  border: none;

  display: flex;

  align-items: center;

  justify-content: center;
}

.community-photo-carousel-nav .proj-nav-btn:hover {
  background: #e0bd10;
}

.community-photo-carousel-nav .proj-nav-btn img {
  width: 18px;

  height: 18px;

  display: block;
}

.community-bottom-blocks {
  display: flex;

  flex-direction: column;

  gap: 60px;
}

.community-reversed-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.community-surrey-img-wrap {
  flex: 1;

  height: 560px;

  border-radius: 24px;

  position: relative;

  overflow: hidden;

  display: flex;

  align-items: flex-end;

  justify-content: flex-end;

  padding: 16px;

  flex-shrink: 0;

  min-width: 0;
}

.community-surrey-img-wrap img.surrey-bg {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 24px;
}

.surrey-logo-badge {
  position: relative;

  z-index: 2;

  background: #ffffff;

  padding: 10px;

  display: flex;

  align-items: center;
}

.surrey-logo-badge img {
  width: 150px;

  height: 39px;

  object-fit: contain;
}

/* Divider */

.community-divider {
  height: 0.5px;

  background: #cbced3;

  width: 100%;

  flex-shrink: 0;
}

.community-proud-block {
  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 40px;
}

.community-proud-header {
  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 12px;
}

.community-proud-header h2 {
  font-weight: 600;

  color: #191919;

  text-align: center;

  margin: 0;
}

.community-logos-row {
  display: flex;

  gap: 20px;

  width: 100%;
}

.community-logo-card {
  flex: 1;

  height: 200px;

  background: #ffffff;

  border-radius: 24px;

  overflow: hidden;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 24px;

  min-width: 0;
}

.community-logo-card img {
  max-width: 209px;

  max-height: 117px;

  width: 100%;

  height: auto;

  object-fit: contain;
}

.community--text-slider-section {
  background: #f5f5f5;
}

/* =============================

         Page Hero

============================= */

.page-hero-section {
  position: relative;

  height: 360px;

  overflow: hidden;

  border-radius: 0 0 32px 32px;
}

.page-hero-bg {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 0 0 32px 32px;
}

.page-hero-overlay {
  position: absolute;

  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.4) 0%,

    rgba(0, 0, 0, 0.64) 100%
  );

  border-radius: 0 0 32px 32px;
}

.page-hero-content {
  position: absolute;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;
}

.page-hero-content h1 {
  color: #ffffff;

  font-weight: 600;

  text-align: center;

  margin: 0;
}

/* =============================

       Services Page

============================= */

.services-page-section {
  background: #f5f5f5;
}

.services-intro-block {
  display: flex;

  flex-direction: column;

  gap: 40px;
}

.services-intro-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.services-intro-header h2 {
  font-weight: 600;

  color: #191919;
}

.services-intro-row {
  display: flex;

  align-items: center;

  gap: 120px;
}

.services-intro-text {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 24px;

  line-height: 1.56;
}

.services-intro-text h3 {
  font-size: 20px;

  font-weight: 600;

  color: #191919;

  line-height: 1.56;

  margin: 0;
}

.services-intro-text p {
  font-size: 18px;

  font-weight: 400;

  color: #5b5d5f;

  line-height: 156%;

  margin: 0;
}

.services-intro-image {
  width: 524px;

  height: 432px;

  border-radius: 24px;

  overflow: hidden;

  flex-shrink: 0;

  position: relative;
}

.services-intro-image img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Section Divider --- */

.section-divider {
  height: 0.5px;

  background: #cbced3;

  width: 100%;

  flex-shrink: 0;
}

/* --- Services List --- */

.services-list {
  display: flex;

  flex-direction: column;

  gap: 32px;
}

.service-row {
  display: flex;

  align-items: center;

  gap: 64px;

  border-bottom: 1px solid #cbced3;

  padding-bottom: 32px;
}

.service-row:last-child {
  border-bottom: none !important;

  padding-bottom: 0 !important;
}

.service-img-card {
  width: 316px;

  height: 356px;

  border-radius: 16px;

  overflow: hidden;

  position: relative;

  flex-shrink: 0;

  display: flex;

  align-items: flex-end;

  justify-content: flex-end;

  padding: 12px;
}

.service-img-card > img.service-card-photo {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 16px;
}

.service-icon-badge {
  position: relative;

  z-index: 2;

  background: #ffffff;

  border-radius: 12px;

  padding: 8px;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 72px;

  height: 72px;

  flex-shrink: 0;
}

.service-icon-badge img {
  width: 56px;

  height: 56px;

  object-fit: contain;
}

.service-text-panel {
  flex: 1;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  padding: 40px 0;

  min-height: 356px;
}

.service-text-top {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.service-text-top h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.service-text-top p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.services-text-slider-section {
  background: #f5f5f5;
}

/* =============================

      Service Detail Hero

============================= */

.sd-hero-section {
  position: relative;

  height: 360px;

  overflow: hidden;

  border-radius: 0 0 32px 32px;
}

.sd-hero-bg {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 0 0 32px 32px;
}

.sd-hero-overlay {
  position: absolute;

  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.4) 0%,

    rgba(0, 0, 0, 0.64) 100%
  );

  border-radius: 0 0 32px 32px;
}

.sd-hero-content {
  position: absolute;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;
}

.sd-hero-content h1 {
  color: #ffffff;

  font-weight: 600;

  text-align: center;
}

.sd-section {
  background: #f5f5f5;
}

.sd-intro-header {
  display: flex;

  flex-direction: column;

  gap: 12px;

  margin-bottom: 40px;
}

.sd-intro-header h2 {
  font-weight: 600;

  color: #191919;

  margin: 0;
}

.sd-intro-body {
  display: flex;

  align-items: center;

  gap: 120px;
}

.sd-intro-text {
  flex: 1;

  min-width: 0;
}

.sd-intro-text p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0 0 28px 0;
}

.sd-intro-text p:last-child {
  margin-bottom: 0;
}

.sd-intro-img {
  flex-shrink: 0;

  width: 524px;

  height: 432px;

  border-radius: 24px;

  object-fit: cover;
}

.sd-bottom-section {
  background: #f5f5f5;
}

.sd-bottom-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.sd-bottom-img-wrap {
  flex: 1;

  height: 560px;

  border-radius: 24px;

  position: relative;

  overflow: hidden;

  display: flex;

  align-items: flex-end;

  justify-content: flex-end;

  padding: 16px;

  flex-shrink: 0;

  min-width: 0;
}

.sd-bottom-img-wrap img.sd-bottom-bg {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 24px;
}

.sd-service-icon-badge {
  position: relative;

  z-index: 2;

  background: #ffffff;

  border-radius: 12px;

  padding: 8px;

  width: 72px;

  height: 72px;

  display: flex;

  align-items: center;

  justify-content: center;
}

.sd-service-icon-badge img {
  width: 56px;

  height: 56px;

  object-fit: contain;
}

.sd-bottom-text-col {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 16px;

  min-width: 0;
}

.sd-bottom-text-col p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.sd-bottom-text-col .sd-intro-header {
  margin-bottom: 0 !important;
}

.projects-slider-non-bg-section {
  background-image: none !important;

  background: linear-gradient(
    180deg,
    #fff 0%,

    rgba(255, 255, 255, 0) 100%
  ) !important;

  z-index: 2;

  border-bottom-left-radius: 0 !important;

  border-bottom-right-radius: 0 !important;
}

.projects-slider-non-bg-section::before {
  background-color: #f5f5f5;
}

.projects-slider-non-bg-section .project-info-right p {
  color: #5b5d5f;
}

.projects-slider-non-bg-section .project-titles h3 {
  color: #191919;
}

.projects-slider-non-bg-section .project-titles span {
  color: #5b5d5f;
}

.projects-slider-non-bg-section .projects-swiper-pagination {
  background: #e6e7e7 !important;
}

.services-detail-2-text-slider {
  padding-bottom: 32px;
}

/* =============================

Health Safety & Environment

============================= */

.hse-page-section {
  background: #f5f5f5;
}

/* --- Vision Card --- */

.hse-vision-card {
  background: #ffffff;

  border-radius: 16px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  gap: 24px;
}

.hse-section-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.hse-section-header h2 {
  font-size: 36px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.hse-vision-card p,
.hse-description {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Large Image --- */

.hse-large-image {
  width: 100%;

  height: 700px;

  border-radius: 32px;

  overflow: hidden;

  position: relative;
}

.hse-large-image img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Philosophy Section --- */

.hse-philosophy-header {
  display: flex;

  flex-direction: column;

  gap: 24px;
}

.hse-philosophy-text p {
  font-size: 20px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.hse-philosophy-text strong {
  font-weight: 700;
}

/* --- Policy Row --- */

.hse-policy-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.hse-policy-image {
  flex: 1;

  height: 560px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;
}

.hse-policy-image img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

.hse-policy-content {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 32px;
}

.hse-policy-content .hse-policy-text-block {
  display: flex;

  flex-direction: column;

  gap: 24px;
}

.hse-policy-content p {
  font-size: 20px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Section Divider --- */

.section-divider {
  height: 0.5px;

  background: #cbced3;

  width: 100%;

  flex-shrink: 0;
}

/* --- Marquee Label --- */

.hse-marquee-label {
  font-size: 120px;

  font-weight: 600;

  line-height: 128%;

  color: #191919;

  text-transform: capitalize;

  white-space: nowrap;

  overflow: hidden;

  text-align: right;
}

/* --- Certifications Section --- */

.hse-certifications-section {
  width: 100%;

  border-radius: 32px;

  overflow: hidden;

  position: relative;

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

  margin-top: -40px;
}

.hse-certifications-flex {
  position: relative;

  z-index: 2;
}

.hse-cert-row {
  display: flex;

  align-items: center;

  gap: 32px;
}

.hse-cert-image {
  width: 401px;

  height: 360px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;

  flex-shrink: 0;
}

.hse-cert-image img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

.hse-cert-image-iso {
  width: 401px;

  height: 360px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;

  flex-shrink: 0;

  background: #ffffff;

  display: flex;

  align-items: center;

  justify-content: center;
}

.hse-cert-image-iso img {
  width: 75%;

  height: auto;

  object-fit: contain;
}

.hse-cert-content {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 24px;
}

.hse-cert-content-header {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.hse-cert-content-header h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #ffffff;

  margin: 0;
}

.hse-cert-content p {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #e6e7e7;

  margin: 0;
}

.hse-cert-list {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.hse-cert-list-item {
  display: flex;

  align-items: center;

  gap: 8px;
}

.hse-cert-list-item img {
  width: 16px;

  height: 20px;

  flex-shrink: 0;
}

.hse-cert-list-item p {
  flex: 1;

  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #e6e7e7;

  margin: 0;
}

/* --- Bottom Cards --- */

.hse-bottom-cards {
  display: flex;

  gap: 24px;
}

.hse-bottom-card {
  flex: 1;

  background: #ffffff;

  border-radius: 16px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  min-height: 260px;
}

.hse-bottom-card-top {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.hse-bottom-card-top h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.hse-bottom-card-top p {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.hse-bottom-card-footer {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.hse-slider-section {
  padding: 0 0 32px 0 !important;
}

.hse-bottom-card-footer .btn-primary {
  padding: 0 !important;

  background: transparent !important;
}

.hse-vision-philosophy-section-flex {
  gap: 60px;
}

/* =============================

   Safety in Practice Page

============================= */

.safety-page-section {
  background: #f5f5f5;
}

/* --- Two-Column Rows --- */

.safety-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.safety-row-content {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 24px;
}

.safety-row-image {
  flex: 1;

  height: 560px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;
}

.safety-row-image img {
  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Section Header --- */

.safety-section-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.safety-section-header h2 {
  font-weight: 600;

  color: #191919;

  margin: 0;
}

/* --- Body Text --- */

.safety-body-text {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.safety-body-text p {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Checklist --- */

.safety-checklist {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.safety-checklist-item {
  display: flex;

  align-items: center;

  gap: 8px;
}

.safety-checklist-item img {
  width: 16px;

  height: 20px;

  flex-shrink: 0;
}

.safety-checklist-item p {
  flex: 1;

  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Section Divider --- */

.section-divider {
  height: 0.5px;

  background: #cbced3;

  width: 100%;

  flex-shrink: 0;
}

/* --- White Card Block --- */

.safety-white-card {
  background: #ffffff;

  border-radius: 16px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  gap: 24px;
}

.safety-white-card .safety-section-header h2 {
  font-size: 36px;
}

.safety-white-card p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Large Image --- */

.safety-large-image {
  width: 100%;

  height: 700px;

  border-radius: 32px;

  overflow: hidden;

  position: relative;
}

.safety-large-image img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Vision Card (bottom) --- */

.safety-vision-card {
  background: #ffffff;

  border-radius: 16px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  gap: 32px;
}

.safety-vision-card-top {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.safety-vision-card-top h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.safety-vision-card-top p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.safety-vision-card-footer {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.safety-page-section-flex {
  gap: 60px;
}

.supervision-planning-flex {
  gap: 40px;
}

.safety-vision-card-footer .btn-primary {
  padding: 0 !important;

  background: transparent !important;
}

/* =============================

 Environmental Stewardship Page

============================= */

.env-page-section {
  background: #f5f5f5;
}

/* --- Two-Column Row --- */

.env-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.env-row-content {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 24px;
}

.env-row-image {
  flex: 1;

  height: 560px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;
}

.env-row-image img {
  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Section Header --- */

.env-section-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.env-section-header h2 {
  font-weight: 600;

  color: #191919;

  margin: 0;
}

/* --- Body Text --- */

.env-body-text {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.env-body-text p {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Checklist --- */

.env-checklist {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.env-checklist-item {
  display: flex;

  align-items: center;

  gap: 8px;
}

.env-checklist-item img {
  width: 16px;

  height: 20px;

  flex-shrink: 0;
}

.env-checklist-item p {
  flex: 1;

  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Section Divider --- */

.section-divider {
  height: 0.5px;

  background: #cbced3;

  width: 100%;

  flex-shrink: 0;
}

/* --- Large Image --- */

.env-large-image {
  width: 100%;

  height: 560px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;
}

.env-large-image img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Land Management Block --- */

.env-land-block {
  display: flex;

  flex-direction: column;

  gap: 48px;
}

.env-land-text {
  display: flex;

  flex-direction: column;

  gap: 24px;
}

/* --- Vision Card (bottom) --- */

.env-vision-card {
  background: #ffffff;

  border-radius: 16px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  gap: 32px;
}

.env-vision-card-top {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.env-vision-card-top h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.env-vision-card-top p {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.env-vision-card-footer {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.env-page-section-flex {
  gap: 60px;
}

/* =============================

           Projects Page

        ============================= */

.projects-page-section {
  background: #f5f5f5;
}

/* --- Projects List --- */

.projects-list {
  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 48px;
}

.project-card {
  display: flex;

  align-items: center;

  gap: 48px;

  width: 100%;

  padding-bottom: 48px;

  border-bottom: 1px solid #cbced3;

  transition: opacity 0.4s ease;
}

.project-card:last-child {
  padding-bottom: 0;

  border-bottom: none;
}

.project-card-content {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 40px;

  align-self: stretch;

  justify-content: center;
}

.project-card-info {
  display: flex;

  flex-direction: column;

  gap: 24px;
}

.project-card-header {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.project-card-titles {
  display: flex;

  flex-direction: column;

  gap: 8px;
}

.project-card-titles h2 {
  font-size: 36px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.project-card-titles .project-location {
  font-size: 18px;

  font-weight: 600;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.project-card-info p.project-excerpt {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Project Thumbnail --- */

.project-card-thumbnail {
  flex: 1;

  height: 400px;

  border-radius: 16px;

  overflow: hidden;

  position: relative;
}

.project-card-thumbnail img {
  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Loader --- */

.projects-loader {
  display: none;

  align-items: center;

  justify-content: center;

  padding: 16px 0;
}

.projects-loader.visible {
  display: flex;
}

.projects-loader img {
  width: 48px;

  height: 48px;

  animation: spin 1.2s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

/* =============================

       Careers Page

============================= */

.careers-page-section {
  background: #f5f5f5;
}

/* --- Intro Block --- */

.careers-intro-block {
  display: flex;

  flex-direction: column;

  gap: 40px;
}

.careers-intro-row {
  display: flex;

  align-items: center;

  gap: 48px;
}

.careers-intro-image {
  flex: 1;

  height: 648px;

  border-radius: 24px;

  overflow: hidden;

  position: relative;
}

.careers-intro-image img {
  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

.careers-intro-text {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 40px;
}

.careers-intro-text-body {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.careers-intro-text-body a {
  font-size: 18px;

  color: #5e3319;

  font-weight: 600;

  text-decoration: none;

  text-transform: unset;
}

.careers-intro-text-body a:hover {
  text-decoration: underline;
}

/* --- Section Header --- */

.careers-section-header {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.careers-section-header h2 {
  font-weight: 600;

  color: #191919;

  margin: 0;
}

/* --- Section Divider --- */

.section-divider {
  height: 0.5px;

  background: #cbced3;

  width: 100%;

  flex-shrink: 0;
}

.jobs-row {
  row-gap: 24px;

  align-items: stretch !important;
}

.job-card {
  width: 100%;

  max-width: 49%;

  background: #ffffff;

  border-radius: 16px;

  padding: 24px;

  display: flex;

  flex-direction: column;

  gap: 32px;

  justify-content: space-between;
}

.job-card-top {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.job-card-top h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.job-card-top p {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Job Card Footer --- */

.job-card-footer {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.job-card-meta-row {
  display: flex;

  align-items: center;

  justify-content: space-between;
}

.job-card-meta {
  display: flex;

  align-items: center;

  gap: 32px;
}

.job-meta-item {
  display: flex;

  align-items: center;

  gap: 6px;
}

.job-meta-item img {
  width: 20px;

  height: 20px;

  flex-shrink: 0;
}

.job-meta-item span {
  font-size: 14px;

  font-weight: 500;

  line-height: 140%;

  color: #5b5d5f;
}

.careers-page-section-flex {
  gap: 60px;
}

.career-open-position-section {
  gap: 40px;
}

/* =============================

   Contact Page

============================= */

.contact-page-section {
  background: #f5f5f5;
}

.contact-intro-text {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Contact Info Cards --- */

.contact-info-grid {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.contact-info-row {
  display: flex;

  row-gap: 12px;

  flex-wrap: wrap;

  justify-content: space-between;

  align-items: stretch;
}

.contact-info-card {
  width: 100%;

  max-width: 49.5%;

  background: #ffffff;

  border-radius: 12px;

  padding: 16px;

  display: flex;

  flex-direction: column;

  gap: 16px;
}

.contact-info-card-label {
  font-size: 14px;

  font-weight: 700;

  line-height: 140%;

  color: #5e3319;

  text-transform: uppercase;

  letter-spacing: 1.68px;

  margin: 0;
}

.contact-info-card-value {
  display: flex;

  align-items: center;

  gap: 12px;
}

.contact-info-card-value img {
  width: 24px;

  height: 24px;

  flex-shrink: 0;
}

.contact-info-card-value p,
.contact-info-card-value a {
  font-size: 18px;

  font-weight: 500;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;

  text-decoration: none;

  text-transform: unset;
}

.contact-info-card-value a:hover {
  color: #5e3319;
}

/* Full-width office hours card */

.contact-info-card-full {
  background: #ffffff;

  border-radius: 12px;

  padding: 16px;

  display: flex;

  flex-direction: column;

  gap: 16px;
}

.contact-hours-row {
  display: flex;

  align-items: center;

  gap: 24px;
}

.contact-hours-item {
  flex: 1;

  display: flex;

  align-items: center;

  gap: 12px;
}

.contact-hours-item img {
  width: 24px;

  height: 24px;

  flex-shrink: 0;
}

.contact-hours-item p {
  font-size: 18px;

  font-weight: 500;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.contact-hours-text {
  flex: 1;

  font-size: 18px;

  font-weight: 500;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Large Site Photo --- */

.contact-site-photo {
  width: 100%;

  height: 820px;

  border-radius: 32px;

  overflow: hidden;

  position: relative;

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  background-attachment: fixed;
}

.contact-site-photo img {
  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

/* --- Form Section --- */

.contact-form-section {
  display: flex;

  flex-direction: column;

  gap: 32px;
}

.contact-form-header {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.contact-form-header-titles {
  display: flex;

  flex-direction: column;

  gap: 12px;
}

.contact-form-header-titles h2 {
  font-weight: 600;

  color: #191919;

  margin: 0;
}

.contact-form-desc {
  font-size: 18px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* --- Form Card --- */

.contact-form-card {
  background: #ffffff;

  border-radius: 12px;

  padding: 32px;

  display: flex;

  flex-direction: column;

  gap: 24px;

  align-items: flex-end;
}

.contact-form-fields {
  display: flex;

  flex-direction: column;

  gap: 24px;

  width: 100%;
}

.contact-form-row {
  display: flex;

  gap: 16px;
}

.contact-form-group {
  flex: 1;

  display: flex;

  flex-direction: column;

  gap: 12px;
}

.contact-form-group label {
  font-size: 14px;

  font-weight: 500;

  line-height: 140%;

  color: #191919;
}

.contact-form-group label span {
  color: #5e3319;
}

.contact-form-group input,
.contact-form-group textarea, 
.contact-form-group select {
  background: #ffffff;

  border: 1px solid #e6e7e7;

  border-radius: 6px;

  padding: 12px 16px;

  font-family: "Plus Jakarta Sans", sans-serif;

  font-size: 14px;

  font-weight: 400;

  line-height: 156%;

  color: #191919;

  outline: none;

  transition: border-color 0.2s ease;

  width: 100%;
}

.contact-form-group input::placeholder,
.contact-form-group textarea::placeholder, 
.contact-form-group select::placeholder {
  color: #5b5d5f;
}

.contact-form-group input:focus,
.contact-form-group textarea:focus, 
.contact-form-group select:focus {
  border-color: #5e3319;
}

.contact-form-group textarea {
  min-height: 140px;

  resize: vertical;
}

.contact-page-section-flex {
  gap: 32px;
}

button.btn-secondry {
  outline: none !important;

  border: none !important;

  box-shadow: none !important;

  cursor: pointer;

  transition: all 0.3s linear;
}

/* =============================

           Project Detail Page

        ============================= */

.pd-page-section {
  background: #f5f5f5;
}

/* =============================

           Two-Column Layout

        ============================= */

.pd-layout {
  display: flex;

  row-gap: 48px;

  align-items: flex-start;

  justify-content: space-between;

  flex-wrap: wrap;
}

/* -------------------------

           LEFT SIDEBAR — sticky

           Sticks while right gallery scrolls.

           Disabled at ≤991px (see media query).

        ------------------------- */

.pd-sidebar {
  width: 48%;

  position: sticky;

  top: 100px;

  /* Sidebar scrolls internally if taller than viewport */

  max-height: calc(100vh - 120px);

  overflow-y: auto;

  overflow-x: hidden;

  scrollbar-width: none;

  -ms-overflow-style: none;

  display: flex;

  flex-direction: column;

  gap: 40px;
}

.pd-sidebar::-webkit-scrollbar {
  display: none;
}

/* -------------------------

           RIGHT GALLERY — scrollable

        ------------------------- */

.pd-gallery {
  width: 48%;

  display: flex;

  flex-direction: column;

  gap: 16px;
}

/* =============================

           Sidebar internals

        ============================= */

.pd-sidebar-header {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.pd-sidebar-titles {
  display: flex;

  flex-direction: column;

  gap: 8px;
}

.pd-sidebar-titles h2 {
  font-size: 36px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.pd-sidebar-titles .pd-location {
  font-size: 18px;

  font-weight: 600;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* Meta Card */

.pd-meta-card {
  background: #ffffff;

  border-radius: 24px;

  padding: 20px 24px;

  display: flex;

  flex-direction: column;

  gap: 40px;
}

.pd-meta-row {
  display: flex;

  align-items: stretch;

  justify-content: space-between;

  flex-wrap: wrap;

  row-gap: 24px;
}

.pd-meta-item {
  width: 48%;

  display: flex;

  flex-direction: column;

  gap: 8px;
}

.pd-meta-item .pd-meta-label {
  font-size: 18px;

  font-weight: 600;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

.pd-meta-item .pd-meta-value {
  font-size: 20px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

/* Description */

.pd-description {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.pd-description h3 {
  font-size: 24px;

  font-weight: 600;

  line-height: 148%;

  color: #191919;

  margin: 0;
}

.pd-description p {
  font-size: 16px;

  font-weight: 400;

  line-height: 156%;

  color: #5b5d5f;

  margin: 0;
}

/* =============================

           Gallery Item (image + video)

           ACF repeater → each item maps

           to one .pd-gallery-item

        ============================= */

.pd-gallery-item {
  position: relative;

  width: 100%;

  height: 420px;

  border-radius: 16px;

  overflow: hidden;

  display: block;

  /* Smooth reveal when loaded via JS */

  transition: opacity 0.4s ease;
}

/* ---- IMAGE type ---- */

.pd-gallery-item img.pd-gallery-img {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;
}

.pd-gallery-item .pd-gallery-overlay {
  position: absolute;

  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.08) 0%,

    rgba(0, 0, 0, 0.32) 100%
  );

  border-radius: 16px;
}

.pd-gallery-item .pd-gallery-actions {
  position: absolute;

  bottom: 24px;

  right: 24px;

  z-index: 2;
}

.pd-enlarge-btn {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 36px;

  height: 36px;

  border-radius: 120px;

  background: rgba(35, 31, 32, 0.24);

  backdrop-filter: blur(60px);

  -webkit-backdrop-filter: blur(60px);

  border: none;

  cursor: pointer;

  transition: background 0.2s ease;

  text-decoration: none;
}

.pd-enlarge-btn:hover {
  background: rgba(35, 31, 32, 0.5);
}

.pd-enlarge-btn img {
  width: 20px;

  height: 20px;
}

/* ---- VIDEO type ---- */

.pd-yt-player {
  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  border-radius: 16px;

  overflow: hidden;
}

.pd-yt-player iframe {
  width: 100%;

  height: 100%;

  border: none;
}

.pd-gallery-video-controls {
  position: absolute;

  bottom: 24px;

  left: 24px;

  right: 24px;

  z-index: 2;

  display: flex;

  align-items: center;

  justify-content: space-between;
}

.pd-video-left-controls {
  display: flex;

  gap: 8px;
}

.pd-video-btn {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 36px;

  height: 36px;

  border-radius: 120px;

  background: rgba(35, 31, 32, 0.24);

  backdrop-filter: blur(60px);

  -webkit-backdrop-filter: blur(60px);

  border: none;

  cursor: pointer;

  transition: background 0.2s ease;
}

.pd-video-btn:hover {
  background: rgba(35, 31, 32, 0.5);
}

.pd-video-btn img {
  width: 20px;

  height: 20px;
}

.pd-video-item .pd-video-overlay {
  pointer-events: all;

  cursor: default;
}
video.pd-sh-video {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    object-position: center;
}

/* =============================

           Placeholder / skeleton

           shown inside each item while

           the real media loads (image lazy

           or YT player init).

           Replace the bg color with your

           own loader image if needed.

        ============================= */

.pd-media-placeholder {
  position: absolute;

  inset: 0;

  background: #d8d8d8;

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 1;

  border-radius: 16px;

  transition: opacity 0.35s ease;
}

/* Shimmer animation on placeholder */

.pd-media-placeholder::after {
  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(
    90deg,
    transparent 0%,

    rgba(255, 255, 255, 0.35) 50%,

    transparent 100%
  );

  background-size: 200% 100%;

  animation: shimmer 1.6s infinite;

  border-radius: 16px;
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }

  100% {
    background-position: 200% 0;
  }
}

/* Spinner icon inside placeholder */

.pd-media-placeholder .ph-spinner {
  width: 40px;

  height: 40px;

  border: 3px solid rgba(255, 255, 255, 0.6);

  border-top-color: #ffffff;

  border-radius: 50%;

  animation: spin 0.9s linear infinite;

  z-index: 2;

  position: relative;
}

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

/* Hide placeholder once media is ready */

.pd-media-placeholder.is-loaded {
  opacity: 0;

  pointer-events: none;
}

/* =============================

           Load More — bottom of gallery

           Shown after the 9th item.

           Clicking reveals next batch.

        ============================= */

.pd-load-more-wrap {
  width: 100%;

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 20px;

  padding: 8px 0 16px;
}

/* The button — hidden while loading */

.pd-load-more-btn {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  padding: 14px 32px;

  background: #191919;

  color: #ffffff;

  font-family: "Plus Jakarta Sans", sans-serif;

  font-size: 16px;

  font-weight: 600;

  border: none;

  border-radius: 120px;

  cursor: pointer;

  transition:
    background 0.2s ease,
    transform 0.15s ease;
}

.pd-load-more-btn:hover {
  background: #333333;
}

.pd-load-more-btn:active {
  transform: scale(0.97);
}

.pd-load-more-btn.is-loading {
  pointer-events: none;

  opacity: 0.6;
}

/* Spinner inside load-more button */

.pd-load-more-btn .btn-spinner {
  width: 18px;

  height: 18px;

  border: 2px solid rgba(255, 255, 255, 0.5);

  border-top-color: #ffffff;

  border-radius: 50%;

  animation: spin 0.8s linear infinite;

  display: none;
}

.pd-load-more-btn.is-loading .btn-spinner {
  display: block;
}

.pd-load-more-btn.is-loading .btn-label {
  display: none;
}

/* "All loaded" message */

.pd-all-loaded {
  font-family: "Plus Jakarta Sans", sans-serif;

  font-size: 15px;

  color: #5b5d5f;

  display: none;
}

.pd-all-loaded.visible {
  display: block;
}

div#pdGalleryList {
  display: flex;

  flex-direction: column;

  gap: 16px;
}

.single-project {
  overflow-x: visible !important;
}

.text-slider-swiper {
  pointer-events: none !important;
}

section.contact-text-slider-section.hse-slider-section {
  pointer-events: none !important;
}


.breadcrumb{
    display:flex;
    align-items:center;
    gap:8px;
    color:#f7d124;
    font-size:10px;
    font-weight:700;
    line-height:140%;
    letter-spacing:1.68px;
    text-transform:uppercase;
}

.breadcrumb a,
.breadcrumb span{
    color:#f7d124;
    text-decoration:none;
	font-size:10px;
}

.breadcrumb a:hover{
    color:#fff;
}
.page-id-1389 .page-hero-content h1 {
        margin-top: 0 !important;
    }
.page-id-1389  .page-hero-content , .community-hero-content , .leadership-hero-content , .sd-hero-content , .page-hero-content {
    flex-direction: column;
    gap: 15px;
}
.page-id-107 .services-intro-block .services-intro-header {
    display: none;
}
.single-service .services-detail-intro h2, .single-service .sd-intro-header h2 {
    display: none;
}

.single-service .sd-intro-header {
    display: none;
}
section.home-valued-partners.pd-80 {
    display: none;
}
section.division-section.home-hero-section .home-hero-content-wrap {
    display: none;
}
section#home-legacy-projects {
    display: none;
}
.community-hero-content h1, .leadership-hero-content h1, .sd-hero-content h1 , .page-hero-content h1 {
        margin-top: 0px !important;
    }