:root {
  --navy:        #060822;
  --navy-dark:   #0A1929;
  --indigo:      #1A1F6E;
  --indigo-mid:  #2B3299;
  --copper:      #B87333;
  --copper-warm: #D4924A;
  --sand:        #C4A882;
  --sand-pale:   #DDD0BA;
  --slate:       #1F3A52;
  --blue:        #1A5CB8;
  --blue-bright: #2B72D9;
  --cyan:        #00B4FF;
  --white:       #ffffff;
  --gap:         60px;
}

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'DM Sans', sans-serif;
  background: var(--navy);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}


/* ══════════════════
   SECTION GAPS
══════════════════ */

.section-gap {
  display: block;
  height: var(--gap);
  background: var(--navy);
}

.section-gap--light {
  background: #fff;
}

.section-gap--dark {
  background: #0D1B2A;
}

.section-gap--services {
  background: #04111F;
}

.section-gap--grey {
  background: #f8f9fa;
}


/* ══════════════════
   NAVBAR
══════════════════ */

#navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 0 5vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 90px;
  background: rgba(3,4,26,0.94);
  backdrop-filter: blur(20px) saturate(1.6);
  -webkit-backdrop-filter: blur(20px) saturate(1.6);
  border-bottom: 1px solid rgba(196,168,130,0.14);
  transition: background 0.4s;
}

.nav-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}

.nav-logo-img {
  height: 100px;
  width: 100px;
  object-fit: contain;
  filter: brightness(0) invert(1);
  flex-shrink: 0;
}

.nav-logo-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.nav-logo-abbr {
  font-family: 'Manrope', sans-serif;
  font-weight: 800;
  font-size: 18px;
  color: #fff;
  letter-spacing: 4px;
  line-height: 1;
}

.nav-logo-sub {
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--sand);
  line-height: 1;
  font-weight: 400;
}

.nav-links {
  display: flex;
  gap: 0;
  list-style: none;
  align-items: center;
}

.nav-links li > a {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  text-decoration: none;
  padding: 8px 16px;
  transition: color 0.3s;
  position: relative;
}

.nav-links li > a::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 16px;
  right: 16px;
  height: 1px;
  background: var(--copper);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
}

.nav-links li > a:hover {
  color: #fff;
}

.nav-links li > a:hover::after {
  transform: scaleX(1);
}

.nav-cta-btn {
  margin-left: 12px;
  padding: 10px 22px;
  background: transparent;
  border: 1.5px solid var(--copper);
  color: var(--copper) !important;
  border-radius: 2px;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  transition: background 0.3s, color 0.3s !important;
}

.nav-cta-btn:hover {
  background: var(--copper) !important;
  color: #fff !important;
}

.nav-cta-btn::after {
  display: none !important;
}

.hamburger {
  display: none;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  padding: 4px;
  background: none;
  border: none;
}

.hamburger span {
  display: block;
  width: 22px;
  height: 1.5px;
  background: #fff;
  transition: transform 0.3s, opacity 0.3s;
}


/* ══════════════════
   HERO
══════════════════ */

.hero {
  height: 120vh;
  min-height: 700px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.hero-photo {
  position: absolute;
  inset: 0;
  background-image: url("images/background3.webp");
  background-size: cover;
  background-position: center 10%;
  transform: scale(1.04);
  transition: transform 1.2s cubic-bezier(0.4,0,0.2,1);
}

.hero-photo.loaded {
  transform: scale(1);
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    rgba(30, 32, 117, 0.9) 0%,
    rgba(87,91,167,0.78) 40%,
    rgba(60, 69, 145, 0.5) 70%,
    rgba(128, 135, 216, 0.18) 100%
  );
}

.hero-vignette {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 0% 110%, rgba(3,4,26,0.8) 0%, transparent 55%),
    radial-gradient(ellipse at 100% -10%, rgba(26,31,110,0.3) 0%, transparent 50%);
}

.hero-topo {
  position: absolute;
  inset: 0;
  opacity: 0.06;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cellipse cx='300' cy='300' rx='280' ry='180' stroke='%232B3299' stroke-width='1' fill='none'/%3E%3Cellipse cx='300' cy='300' rx='220' ry='140' stroke='%232B3299' stroke-width='1' fill='none'/%3E%3Cellipse cx='300' cy='300' rx='160' ry='100' stroke='%232B3299' stroke-width='1' fill='none'/%3E%3Cellipse cx='300' cy='300' rx='100' ry='60' stroke='%232B3299' stroke-width='1' fill='none'/%3E%3C/svg%3E");
  background-size: 600px 600px;
  background-position: right -80px top -80px;
  background-repeat: no-repeat;
  pointer-events: none;
}

.hero-glow {
  position: absolute;
  bottom: -160px;
  left: -100px;
  width: 700px;
  height: 600px;
  background: radial-gradient(ellipse, rgba(43,50,153,0.28) 0%, transparent 65%);
  pointer-events: none;
}

.hero-rule {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, transparent 10%, var(--copper) 50%, transparent 90%);
  opacity: 0.6;
  z-index: 2;
}

.hero-waves {
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  height: 140px;
  pointer-events: none;
  z-index: 2;
}

.hero-inner {
  position: relative;
  z-index: 3;
  width: 100%;
  padding: 0 5vw 80px;
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 80px;
  align-items: flex-end;
}

.hero-content {
  padding-top: 140px;
}

.hero-title {
  font-family: 'Manrope', sans-serif;
  font-weight: 800;
  font-size: clamp(44px, 5.5vw, 80px);
  line-height: 1.0;
  color: #fff;
  margin-bottom: 36px;
  letter-spacing: -1px;
  opacity: 0;
  animation: fadeUp 0.8s 0.5s forwards;
}

.hero-title .line-thin {
  font-weight: 300;
  font-style: italic;
  color: rgba(4,3,14,0.32);
  letter-spacing: 0;
  font-size: 0.82em;
}

.hero-title .line-accent {
  color: var(--sand);
}

.hero-desc {
  font-size: 16px;
  line-height: 1.8;
  color: #fff;
  max-width: 520px;
  margin-bottom: 52px;
  opacity: 0;
  animation: fadeUp 0.8s 0.7s forwards;
  font-weight: 300;
}

.hero-actions {
   
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  opacity: 0;
  animation: fadeUp 0.8s 0.9s forwards;
}

.btn-primary {
  padding: 16px 36px;
  background: var(--copper);
  color: #fff;
  border: none;
  border-radius: 2px;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: background 0.3s, transform 0.2s;
  position: relative;
  overflow: hidden;
}

.btn-primary:hover {
  background: var(--copper-warm);
  transform: translateY(-2px);
}

.btn-ghost {
  padding: 15px 32px;
  background: transparent;
  color: rgba(255,255,255,0.6);
  border: 1px solid rgba(43,50,153,0.7);
  border-radius: 2px;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: border-color 0.3s, color 0.3s, background 0.3s;
}

.btn-ghost:hover {
  border-color: var(--indigo-mid);
  color: #fff;
  background: rgba(43,50,153,0.18);
}

.hero-stats {
  display: flex;
  flex-direction: column;
  gap: 0;
  opacity: 0;
  animation: fadeUp 0.8s 1.1s forwards;
  align-self: flex-end;
  padding-bottom: 8px;
}

.stat-item {
     margin-left: 150px;
  padding: 20px 0;
  border-bottom: 1px solid rgba(43,50,153,0.35);
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.stat-item:last-child {
  border-bottom: none;
}

.stat-num {
  font-family: 'Manrope', sans-serif;
  font-size: 40px;
  font-weight: 800;
  color: rgba(2, 5, 44, 0.7);
  line-height: 1;
  letter-spacing: -1px;
}

.stat-label {
  font-size: 10.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.3;
  font-weight: 400;
}

.scroll-indicator {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  opacity: 0;
  animation: fadeUp 0.8s 1.5s forwards;
  z-index: 4;
}

.scroll-indicator span {
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.22);
}

.scroll-line {
  width: 1px;
  height: 52px;
  background: linear-gradient(to bottom, rgba(61,69,187,0.7), transparent);
  animation: scrollPulse 2.5s ease-in-out infinite;
}


/* ══════════════════
   ABOUT
══════════════════ */

.ab-root {
  width: 100%;
  background: #ffffff;
  position: relative;
  overflow: hidden;
}

.ab-topo {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.04;
  z-index: 0;
}

.ab-inner {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  min-height: 100vh;
  position: relative;
  z-index: 1;
}

.ab-left {
  position: relative;
  overflow: hidden;
  min-height: 600px;
}

.ab-img-main {
  position: absolute;
  inset: 0;
  background-image: url('https://ionexchangeglobal.com/app/uploads/2026/02/AI-in-Water-Management-Solving-Challenges-Across-the-Sector.jpg');
  background-size: cover;
  background-position: center;
  transition: transform 10s ease;
}

.ab-root:hover .ab-img-main {
  transform: scale(1.03);
}

.ab-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(5,6,26,0.55) 0%, rgba(5,6,26,0.15) 55%, transparent 100%);
}

.ab-inset-single {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 52%;
  z-index: 3;
  border-top: 3px solid #2e36b8;
}

.ab-thumb {
  height: 160px;
  background-size: cover;
  background-position: center;
  background-image: url('https://media.licdn.com/dms/image/v2/D4E12AQHJatR0tzF23A/article-cover_image-shrink_720_1280/B4EZrvPol7IIAI-/0/1764950445012?e=2147483647&v=beta&t=BGMbPDbui_8bvm2ldTujgXBRz7wzw6fTGzOMrzw9zSo');
  position: relative;
  overflow: hidden;
}

.ab-thumb-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px 14px;
  background: linear-gradient(to top, rgba(5,6,26,0.82) 0%, transparent 100%);
}

.ab-thumb-label span {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(157,168,240,0.9);
}

.ab-badge {
  position: absolute;
  top: 36px;
  left: -4px;
  background: #0d0f3a;
  padding: 16px 20px;
  border-left: 3px solid #2e36b8;
  min-width: 120px;
  z-index: 4;
}

.ab-badge-n {
  font-size: 32px;
  font-weight: 700;
  color: #9da8f0;
  line-height: 1;
  letter-spacing: -1px;
}

.ab-badge-l {
  font-size: 9px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: rgba(157,168,240,0.55);
  margin-top: 5px;
}

.ab-right {
  background: #ffffff;
  padding: 80px 52px 80px 60px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.ab-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #2e36b8;
  margin-bottom: 16px;
}

.ab-eyebrow-line {
  display: block;
  width: 32px;
  height: 1px;
  background: #2e36b8;
}

.ab-heading {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(28px, 2.8vw, 44px);
  font-weight: 800;
  color: #05061a;
  line-height: 1.08;
  letter-spacing: -0.5px;
  margin-bottom: 14px;
}

.ab-heading em {
  font-style: italic;
  font-weight: 300;
  color: #2e36b8;
}

.ab-lede {
  font-size: 16px;
  font-weight: 600;
  color: #05061a;
  margin-bottom: 10px;
  line-height: 1.5;
}

.ab-body {
  font-size: 14px;
  color: #1a1a2e;
  line-height: 1.8;
  margin-bottom: 8px;
  font-weight: 300;
}

.ab-pillars {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  margin-top: 20px;
}

.ap {
  position: relative;
  overflow: hidden;
  height: 160px;
  cursor: default;
}

.ap-photo {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.6s cubic-bezier(0.4,0,0.2,1);
}

.ap:hover .ap-photo {
  transform: scale(1.06);
}

.ap:nth-child(1) .ap-photo {
  background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSvXHU5BSNGrSktFh36Q0Kx1pixc_Xu7xP3z3_Vvfde4vihGijLDpLdFJEH&s=10');
}

.ap:nth-child(2) .ap-photo {
  background-image: url('https://media.springernature.com/w580h326/nature-cms/uploads/collections/jbfijdhjdj-01bb02c67a0aa6e448b96088164fb71b.jpg');
}

.ap:nth-child(3) .ap-photo {
  background-image: url('https://i0.wp.com/mahabahu.com/wp-content/uploads/2025/12/Water-Climate-AI-.jpg?resize=694%2C375&ssl=1');
}

.ap:nth-child(4) .ap-photo {
  background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTCuIcj6bWJmEdW0ivRqc465_q0_32R9pjZSXLiDLwQ6X9WnBaawI94MHI&s=10');
}

.ap-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(5,6,26,0.78) 0%, rgba(5,6,26,0.32) 50%, rgba(5,6,26,0.08) 100%);
}

.ap-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 14px 16px;
}

.ap-line {
  display: block;
  width: 20px;
  height: 2px;
  background: #5c6ee8;
  margin-bottom: 7px;
}

.ap-title {
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 4px;
  line-height: 1.2;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}

.ap-body {
  font-size: 11px;
  color: rgba(200,210,255,0.85);
  line-height: 1.45;
  text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}


/* ══════════════════
   SERVICES
══════════════════ */

.hegcc-services {
  position: relative;
  min-height: 100vh;
  background:
    radial-gradient(ellipse 80% 60% at 15% 20%, rgba(0,90,160,0.28) 0%, transparent 65%),
    radial-gradient(ellipse 60% 50% at 85% 75%, rgba(0,50,110,0.22) 0%, transparent 60%),
    linear-gradient(160deg, #04111F 0%, #071828 40%, #050F1C 70%, #030C18 100%);
  overflow: hidden;
}

.hs-topo {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='500'%3E%3Cpath d='M0 250 Q225 180 450 250 Q675 320 900 250' stroke='%2300B4FF' stroke-width='0.5' fill='none' opacity='0.06'/%3E%3Cpath d='M0 210 Q225 140 450 210 Q675 280 900 210' stroke='%2300B4FF' stroke-width='0.5' fill='none' opacity='0.04'/%3E%3Cpath d='M0 290 Q225 220 450 290 Q675 360 900 290' stroke='%2300B4FF' stroke-width='0.4' fill='none' opacity='0.04'/%3E%3C/svg%3E");
  background-size: 900px 500px;
  pointer-events: none;
}

.hs-header {
  text-align: center;
  padding: 80px 32px 52px;
  position: relative;
  z-index: 2;
}

.hs-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 4.5px;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 18px;
}

.hs-eyebrow::before,
.hs-eyebrow::after {
  content: '';
  display: block;
  width: 36px;
  height: 1px;
  background: var(--cyan);
  opacity: 0.4;
}

.hs-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(54px, 6.5vw, 88px);
  line-height: 0.93;
  color: #FFFFFF;
  letter-spacing: 2px;
  margin-bottom: 18px;
}

.hs-title span {
  color: var(--cyan);
}

.hs-subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.55);
  max-width: 520px;
  margin: 0 auto;
  line-height: 1.8;
  font-weight: 300;
}

.hs-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  position: relative;
  z-index: 2;
  border-top: 1px solid rgba(0,180,255,0.08);
}

.hs-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 600px;
}

.hs-card-img {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.7s cubic-bezier(0.4,0,0.2,1);
}

.hs-card:hover .hs-card-img {
  transform: scale(1.04);
}

.hs-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(5,16,30,0.28) 0%, rgba(5,16,30,0.50) 32%, rgba(5,16,30,0.82) 60%, rgba(5,16,30,0.97) 100%);
  transition: background 0.4s;
}

.hs-card:hover .hs-card-overlay {
  background: linear-gradient(to bottom, rgba(5,16,30,0.18) 0%, rgba(5,16,30,0.42) 32%, rgba(5,16,30,0.80) 60%, rgba(5,16,30,0.97) 100%);
}

.hs-card-accent {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--cyan) 0%, rgba(0,180,255,0) 100%);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.45s cubic-bezier(0.4,0,0.2,1);
  z-index: 3;
}

.hs-card:hover .hs-card-accent {
  transform: scaleY(1);
}

.hs-card-body {
  position: relative;
  z-index: 2;
  padding: 36px 34px 42px;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: flex-end;
}

.hs-card-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 12px;
  letter-spacing: 4px;
  color: var(--cyan);
  margin-bottom: 12px;
}

.hs-card-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 30px;
  letter-spacing: 1.5px;
  color: #FFF;
  line-height: 1.06;
  margin-bottom: 14px;
}

.hs-card-desc {
  font-size: 14px;
  color: rgba(255,255,255,0.78);
  line-height: 1.75;
  margin-bottom: 10px;
}

.hs-card-desc2 {
  font-size: 13.5px;
  color: rgba(255,255,255,0.58);
  line-height: 1.72;
  font-weight: 300;
  margin-bottom: 20px;
}

.hs-card-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.hs-card-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  color: rgba(255,255,255,0.72);
  line-height: 1.5;
}

.hs-card-list li::before {
  content: '';
  display: block;
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--cyan);
  margin-top: 6px;
}

.hs-card:nth-child(4),
.hs-card:nth-child(5),
.hs-card:nth-child(6) {
  border-top: 2px solid rgba(0,180,255,0.07);
}

.hs-bottom {
  padding: 52px 32px 64px;
  text-align: center;
  position: relative;
  z-index: 2;
  border-top: 1px solid rgba(0,180,255,0.07);
}

.hs-cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 17px 46px;
  background: var(--cyan);
  color: #04111F;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: background 0.3s, transform 0.2s;
  font-family: 'DM Sans', sans-serif;
  text-decoration: none;
}

.hs-cta:hover {
  background: #33C3FF;
  transform: translateY(-2px);
}


/* ══════════════════
   WHY US
══════════════════ */

.why-section {
  background: #fff;
  font-family: 'DM Sans', sans-serif;
  padding: 100px 40px;
}

.why-wrap {
  max-width: 1360px;
  margin: 0 auto;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.why-left {
  position: relative;
}

.why-photo-main {
  width: 100%;
  overflow: hidden;
  position: relative;
  aspect-ratio: 3/4;
  max-height: 680px;
}

.why-photo-main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.9s cubic-bezier(0.4,0,0.2,1);
}

.why-photo-main:hover img {
  transform: scale(1.04);
}

.why-photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(13,27,42,0.75) 0%, transparent 55%);
}

.why-photo-caption {
  position: absolute;
  bottom: 24px;
  left: 24px;
  right: 24px;
  font-family: 'Manrope', sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.25;
}

.why-photo-caption em {
  font-style: italic;
  font-weight: 300;
  color: #DDD0BA;
  display: block;
  font-size: 0.78em;
  margin-top: 4px;
}

.why-inset {
  position: absolute;
  bottom: -24px;
  right: -24px;
  width: 44%;
  aspect-ratio: 4/3;
  overflow: hidden;
  border: 4px solid #fff;
  box-shadow: 0 16px 48px rgba(13,27,42,0.14);
}

.why-inset img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.why-badge {
  position: absolute;
  top: 28px;
  left: -16px;
  background: #0D1B2A;
  padding: 16px 20px;
  border-left: 3px solid #B87333;
  z-index: 3;
  min-width: 140px;
}

.why-badge-num {
  font-family: 'Manrope', sans-serif;
  font-size: 36px;
  font-weight: 800;
  color: #C4A882;
  line-height: 1;
  letter-spacing: -2px;
}

.why-badge-label {
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  margin-top: 4px;
  line-height: 1.4;
}

.why-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.why-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: #B87333;
  font-weight: 600;
  margin-bottom: 12px;
}

.why-eyebrow-line {
  display: block;
  width: 28px;
  height: 1px;
  background: #B87333;
}

.why-heading {
  font-family: 'Manrope', sans-serif;
  font-size: 46px;
  font-weight: 800;
  color: #0D1B2A;
  line-height: 1.0;
  letter-spacing: -2px;
  margin-bottom: 10px;
}

.why-heading span {
  color: #C4A882;
  font-style: italic;
  font-weight: 300;
  display: block;
  font-size: 0.72em;
  letter-spacing: -1px;
}

.why-lead {
  font-size: 15px;
  line-height: 1.7;
  color: #6B7C8F;
  font-weight: 300;
  margin-bottom: 16px;
  max-width: 500px;
}

.why-features {
  display: flex;
  flex-direction: column;
}

.why-feat {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  align-items: start;
  padding: 12px 0;
  border-bottom: 1px solid rgba(13,27,42,0.07);
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
  cursor: default;
}

.why-feat:last-child {
  border-bottom: none;
}

.why-feat:hover {
  transform: translateX(6px);
}

.why-feat-icon {
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  background: rgba(184,115,51,0.06);
  transition: background 0.3s;
}

.why-feat:hover .why-feat-icon {
  background: rgba(184,115,51,0.12);
}

.why-feat-icon svg {
  width: 18px;
  height: 18px;
  stroke: #B87333;
  stroke-width: 1.5;
  fill: none;
}

.why-feat-title {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: #0D1B2A;
  margin-bottom: 3px;
  line-height: 1.2;
}

.why-feat-text {
  font-size: 12.5px;
  color: #6B7C8F;
  line-height: 1.65;
  font-weight: 300;
}

.why-feat-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.why-feat-tag {
  font-size: 9px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #B87333;
  border: 1px solid rgba(184,115,51,0.25);
  padding: 2px 7px;
  font-weight: 600;
}

.why-cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  font-family: 'Manrope', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #0D1B2A;
  text-decoration: none;
  cursor: pointer;
  padding-bottom: 5px;
  border-bottom: 1.5px solid #B87333;
  transition: color 0.3s, gap 0.3s;
}

.why-cta:hover {
  color: #B87333;
  gap: 20px;
}

.why-cta-line {
  width: 24px;
  height: 1.5px;
  background: #B87333;
  transition: width 0.3s;
}

.why-cta:hover .why-cta-line {
  width: 38px;
}


/* ══════════════════
   PROJECTS
══════════════════ */

.pj-section {
  background: #0D1B2A;
  padding: 100px 0 120px;
  font-family: 'DM Sans', sans-serif;
}

.pj-wrap {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 40px;
}

.pj-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 64px;
}

.pj-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 10px;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #B87333;
  font-weight: 600;
  margin-bottom: 18px;
}

.pj-eyebrow-line {
  display: block;
  width: 32px;
  height: 1px;
  background: #B87333;
}

.pj-main-title {
  font-family: 'Manrope', sans-serif;
  font-size: 52px;
  font-weight: 800;
  color: #fff;
  line-height: 1.05;
  letter-spacing: -1px;
  margin: 0;
}

.pj-main-title span {
  color: #C4A882;
  font-weight: 300;
  font-style: italic;
  font-size: 0.78em;
  display: block;
}

.pj-view-all {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  text-decoration: none;
  cursor: pointer;
  padding-bottom: 8px;
  transition: color 0.3s;
}

.pj-view-all:hover {
  color: #C4A882;
}

.pj-view-all-line {
  width: 36px;
  height: 1px;
  background: currentColor;
  transition: width 0.3s;
}

.pj-view-all:hover .pj-view-all-line {
  width: 52px;
}

.pj-featured {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  gap: 3px;
  margin-bottom: 3px;
}

.pj-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3px;
}

.pj-card {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.pj-featured .pj-card {
  height: 520px;
}

.pj-row .pj-card {
  height: 340px;
}

.pj-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: #B87333;
  opacity: 0;
  transition: opacity 0.35s;
  z-index: 3;
}

.pj-card:hover::before {
  opacity: 1;
}

.pj-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.85s cubic-bezier(0.4,0,0.2,1);
}

.pj-card:hover .pj-bg {
  transform: scale(1.07);
}

.img-seismic {
  background-image: url('https://images.unsplash.com/photo-1446776811953-b23d57bd21aa?w=1200&q=85&auto=format');
}

.img-env {
  background-image: url('https://images.unsplash.com/photo-1569428034239-f9565e32e224?w=900&q=85&auto=format');
  background-position: center 40%;
}

.img-drill {
  background-image: url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=900&q=85&auto=format');
}

.img-urban {
  background-image: url('https://images.unsplash.com/photo-1486325212027-8081e485255e?w=900&q=85&auto=format');
}

.img-aquifer {
  background-image: url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=900&q=85&auto=format');
}

.pj-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(7,17,28,0.92) 0%, rgba(7,17,28,0.48) 42%, rgba(7,17,28,0.08) 100%);
  z-index: 1;
}

.pj-info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 32px 36px;
  z-index: 2;
}

.pj-cat {
  display: inline-block;
  font-size: 9px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 600;
  color: #C4A882;
  border: 1px solid rgba(196,168,130,0.4);
  padding: 5px 11px;
  margin-bottom: 14px;
}

.pj-title {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  color: #fff;
  line-height: 1.25;
  margin: 0 0 10px;
  font-size: 20px;
}

.pj-featured .pj-card:first-child .pj-title {
  font-size: 26px;
}

.pj-featured .pj-card:last-child .pj-title {
  font-size: 22px;
}

.pj-detail {
  font-size: 13.5px;
  color: rgba(255,255,255,0.62);
  line-height: 1.7;
  margin: 0 0 14px;
  max-width: 420px;
}

.pj-loc {
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  display: flex;
  align-items: center;
  gap: 8px;
}

.pj-loc::before {
  content: '';
  display: block;
  width: 18px;
  height: 1px;
  background: rgba(196,168,130,0.45);
}

.pj-arrow {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #C4A882;
  margin-top: 18px;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.35s, transform 0.35s;
}

.pj-arrow-line {
  width: 20px;
  height: 1px;
  background: #C4A882;
}

.pj-card:hover .pj-arrow {
  opacity: 1;
  transform: translateY(0);
}


/* ══════════════════
   PROCESS
══════════════════ */

.process-section {
  background: #ffffff;
  padding: 100px 5vw 100px;
  font-family: 'DM Sans', sans-serif;
}

.proc-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--blue);
  margin-bottom: 16px;
}

.proc-eyebrow-line {
  display: block;
  width: 28px;
  height: 1.5px;
  background: var(--blue);
}

.proc-heading {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(32px, 3.8vw, 56px);
  font-weight: 800;
  line-height: 1.15;
  color: #0D2B55;
  letter-spacing: -0.8px;
  margin-bottom: 52px;
  max-width: 700px;
}

.proc-heading span {
  color: var(--blue);
}

.process-flow {
  display: flex;
  align-items: flex-start;
  gap: 0;
}

.step-wrapper {
  flex: 1;
  min-width: 0;
}

.step-card {
  background: #fff;
  border: 1.5px solid #D6E4F7;
  border-radius: 12px;
  overflow: hidden;
  transition: border-color 0.3s, box-shadow 0.3s, transform 0.3s;
  box-shadow: 0 2px 12px rgba(26,92,184,0.07);
}

.step-card:hover {
  border-color: var(--blue);
  box-shadow: 0 6px 28px rgba(26,92,184,0.16);
  transform: translateY(-4px);
}

.step-image {
  width: 100%;
  aspect-ratio: 14/11;
  overflow: hidden;
  position: relative;
}

.step-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(0.88) saturate(0.85);
  transition: filter 0.3s, transform 0.3s;
}

.step-card:hover .step-image img {
  filter: brightness(0.95) saturate(1);
  transform: scale(1.03);
}

.step-image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(13,43,85,0.55) 100%);
}

.step-body {
  padding: 16px 16px 20px;
  border-top: 2px solid rgba(26,92,184,0.15);
}

.step-title {
  font-family: 'Manrope', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #0D2B55;
  line-height: 1.35;
  margin-bottom: 8px;
}

.step-desc {
  font-size: 13.5px;
  line-height: 1.7;
  color: #3A5A80;
}

.arrow-connector {
  flex-shrink: 0;
  width: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 70px;
}

.arrow-inner {
  display: flex;
  align-items: center;
}

.arrow-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--blue);
  flex-shrink: 0;
  margin-right: -2px;
}

.arrow-shaft {
  width: 18px;
  height: 2px;
  background: linear-gradient(90deg, #1E4FA0 0%, var(--blue-bright) 100%);
}

.arrow-head {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 10px solid var(--blue-bright);
  margin-left: -1px;
}


/* ══════════════════
   CONTACT
══════════════════ */

.contact-section {
  background: #f8f9fa;
  padding: 100px 0 120px;
  font-family: 'DM Sans', sans-serif;
}

.contact-inner {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 5vw;
}

.contact-header {
  max-width: 700px;
  margin-bottom: 80px;
}

.contact-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #1F3A52;
  margin-bottom: 24px;
}

.contact-eyebrow-line {
  display: block;
  width: 32px;
  height: 1.5px;
  background: #1F3A52;
}

.contact-heading {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 800;
  line-height: 1.15;
  color: #1F3A52;
  margin-bottom: 20px;
  letter-spacing: -0.5px;
}

.contact-description {
  font-size: 16px;
  line-height: 1.8;
  color: #6B7C8F;
  font-weight: 300;
}

.contact-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}

.contact-info-block {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.contact-map-container {
  width: 100%;
  height: 280px;
  background-color: #F5F3F0;
  border: 1px solid rgba(31,58,82,0.1);
  margin-bottom: 48px;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}

#contactMap {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}

.contact-details-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.contact-detail-item {
  padding: 10px 2px;
  border-bottom: 1px solid rgba(31,58,82,0.1);
  display: flex;
  gap: 10px;
  align-items: flex-start;
  transition: all 0.3s ease;
}

.contact-detail-item:hover {
  transform: translateX(8px);
}

.contact-detail-item:last-child {
  border-bottom: none;
}

.contact-detail-icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #1F3A52;
  border-radius: 50%;
  background: rgba(31,58,82,0.05);
}

.contact-detail-icon svg {
  width: 22px;
  height: 22px;
  stroke: #1F3A52;
  stroke-width: 1.5;
  fill: none;
}

.contact-detail-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #1F3A52;
  margin-bottom: 8px;
}

.contact-detail-value {
  font-size: 16px;
  line-height: 1.6;
  color: #1F3A52;
}

.contact-detail-value a {
  color: #1F3A52;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: all 0.3s ease;
}

.contact-detail-value a:hover {
  color: #B87333;
  border-bottom-color: #B87333;
}

.contact-form-container {
  padding: 0;
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.form-row.full {
  grid-template-columns: 1fr;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: relative;
}

.form-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #1F3A52;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.form-label .required {
  color: #FF6B6B;
  margin-left: 4px;
}

.form-input,
.form-select,
.form-textarea {
  background: #fff;
  border: 1.5px solid rgba(31,58,82,0.15);
  border-radius: 4px;
  padding: 14px 16px;
  color: #1F3A52;
  font-size: 15px;
  font-family: 'DM Sans', sans-serif;
  transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
  outline: none;
  appearance: none;
}

.form-input::placeholder,
.form-textarea::placeholder {
  color: #A0A8B0;
  font-weight: 300;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color: #1F3A52;
  background: rgba(31,58,82,0.02);
  box-shadow: 0 0 0 3px rgba(31,58,82,0.08);
}

.form-input.error,
.form-select.error,
.form-textarea.error {
  border-color: #FF6B6B;
  background: rgba(255,107,107,0.08);
}

.form-input.success,
.form-select.success,
.form-textarea.success {
  border-color: #06A77D;
  background: rgba(6,168,125,0.08);
}

.form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231F3A52' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 40px;
  cursor: pointer;
}

.form-textarea {
  resize: vertical;
  min-height: 140px;
  font-family: 'DM Sans', sans-serif;
}

.form-error {
  display: none;
  font-size: 12px;
  color: #FF9B9B;
  margin-top: -6px;
  font-weight: 500;
}

.form-error.show {
  display: block;
}

.form-success {
  display: none;
  font-size: 12px;
  color: #5FD5B8;
  margin-top: -6px;
  font-weight: 500;
}

.form-success.show {
  display: block;
}

.form-submit-wrapper {
  margin-top: 12px;
}

.form-submit {
  width: 100%;
  padding: 16px 32px;
  background: #0A1929;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
  position: relative;
  overflow: hidden;
}

.form-submit:hover:not(:disabled) {
  background: #1A2F4A;
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(10,25,41,0.25);
}

.form-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.form-global-message {
  display: none;
  padding: 14px 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 20px;
  animation: slideDown 0.3s ease;
  border-left: 4px solid;
}

.form-global-message.error {
  background: rgba(255,107,107,0.08);
  color: #D64545;
  border-left-color: #D64545;
  display: block;
}

.form-global-message.success {
  background: rgba(6,168,125,0.08);
  color: #05875A;
  border-left-color: #05875A;
  display: block;
}


/* ══════════════════
   FOOTER
══════════════════ */

footer {
  background: linear-gradient(135deg, #0A1929 0%, #0F2A45 100%);
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(212,165,116,0.2);
}

footer::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 50%, rgba(212,165,116,0.03) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(212,165,116,0.02) 0%, transparent 50%);
  pointer-events: none;
}

.footer-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 100px 5vw 50px;
  position: relative;
  z-index: 1;
}

.footer-top {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr;
  gap: 80px;
  padding-bottom: 80px;
  border-bottom: 1px solid rgba(212,165,116,0.15);
  margin-bottom: 50px;
}

.footer-brand {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.footer-brand-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.footer-logo-img {
  height: 100px;
  width: 100px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.footer-brand-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.footer-brand-name {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 3px;
  color: #F5F5F5;
  line-height: 1;
}

.footer-brand-tagline {
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #D4A574;
  font-weight: 600;
}

.footer-mission {
  font-size: 15px;
  line-height: 1.75;
  color: #E0E0E0;
  font-weight: 300;
  max-width: 320px;
  margin-top: 8px;
}

.footer-column {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.footer-col-title {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #F5F5F5;
  margin-bottom: 28px;
  padding-bottom: 14px;
  border-bottom: 2px solid #D4A574;
  display: inline-block;
}

.footer-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.footer-links li a {
  font-size: 15px;
  color: #E0E0E0;
  text-decoration: none;
  font-weight: 400;
  transition: all 0.35s cubic-bezier(0.4,0,0.2,1);
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.footer-links li a::before {
  content: '';
  width: 0;
  height: 1.5px;
  background: #D4A574;
  transition: width 0.35s cubic-bezier(0.4,0,0.2,1);
}

.footer-links li a:hover {
  color: #E8C9A0;
  padding-left: 8px;
}

.footer-links li a:hover::before {
  width: 8px;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.footer-copy {
  font-size: 14px;
  color: #E0E0E0;
  font-weight: 300;
  line-height: 1.6;
  flex: 1;
}

.footer-copy strong {
  color: #D4A574;
  font-weight: 600;
}

.footer-meta {
  display: flex;
  align-items: center;
  gap: 24px;
}

.footer-year {
  font-size: 13px;
  color: #E0E0E0;
  font-weight: 500;
  letter-spacing: 1px;
}

.footer-divider {
  width: 1px;
  height: 24px;
  background: rgba(212,165,116,0.2);
}

.footer-tagline {
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #D4A574;
  font-weight: 600;
}

.footer-accent {
  position: absolute;
  width: 120px;
  height: 120px;
  border: 1px solid rgba(212,165,116,0.08);
  border-radius: 50%;
  bottom: 40px;
  right: 60px;
  pointer-events: none;
}

.footer-accent::after {
  content: '';
  position: absolute;
  inset: 15px;
  border: 1px solid rgba(212,165,116,0.06);
  border-radius: 50%;
}


/* ══════════════════
   ANIMATIONS
══════════════════ */

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes scrollPulse {
  0%, 100% {
    opacity: 0.5;
    transform: scaleY(1);
  }
  50% {
    opacity: 1;
    transform: scaleY(0.75);
  }
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ripple {
  from {
    transform: scale(0);
    opacity: 1;
  }
  to {
    transform: scale(1);
    opacity: 0;
  }
}


/* ══════════════════
   RESPONSIVE
══════════════════ */

@media (max-width: 1200px) {
  .hero-inner {
    grid-template-columns: 1fr;
  }
  .hero-stats {
    display: none;
  }
  .ab-inner {
    grid-template-columns: 1fr 1.3fr;
  }
  .ab-right {
    padding: 60px 36px 60px 40px;
  }
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 60px;
  }
}

@media (max-width: 1000px) {
  .hs-cards {
    grid-template-columns: 1fr 1fr;
  }
  .hs-card {
    min-height: 520px;
  }
  .why-wrap {
    grid-template-columns: 1fr;
  }
  .why-inset {
    display: none;
  }
  .pj-featured {
    grid-template-columns: 1fr 1fr;
  }
  .pj-main-title {
    font-size: 40px;
  }
  .process-flow {
    flex-direction: column;
    gap: 16px;
  }
  .arrow-connector {
    width: 100%;
    height: 28px;
    padding-top: 0;
    padding-left: 40px;
    flex-direction: row;
  }
  .arrow-inner {
    flex-direction: column;
  }
  .arrow-dot {
    margin-right: 0;
    margin-bottom: -2px;
  }
  .arrow-shaft {
    width: 2px;
    height: 14px;
    background: linear-gradient(180deg, var(--blue) 0%, var(--blue-bright) 100%);
  }
  .arrow-head {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 10px solid var(--blue-bright);
    border-bottom: none;
    margin-left: 0;
    margin-top: -1px;
  }
  .contact-layout {
    grid-template-columns: 1fr;
    gap: 60px;
  }
}

@media (max-width: 768px) {
  .nav-links {
    display: none;
  }
  .hamburger {
    display: flex;
  }
  .ab-inner {
    grid-template-columns: 1fr;
  }
  .ab-left {
    min-height: 50vh;
  }
  .ab-right {
    padding: 44px 28px;
  }
  .ab-inset-single {
    width: 60%;
  }
  .hs-cards {
    grid-template-columns: 1fr;
  }
  .hs-card {
    min-height: 440px;
  }
  .pj-section {
    padding: 60px 0 80px;
  }
  .pj-wrap {
    padding: 0 20px;
  }
  .pj-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .pj-main-title {
    font-size: 32px;
  }
  .pj-featured {
    grid-template-columns: 1fr;
  }
  .pj-row {
    grid-template-columns: 1fr;
  }
  .pj-featured .pj-card {
    height: 420px;
  }
  .pj-row .pj-card {
    height: 300px;
  }
  .why-heading {
    font-size: 38px;
  }
  .form-row {
    grid-template-columns: 1fr;
  }
  .footer-top {
    grid-template-columns: 1fr;
    gap: 40px;
    padding-bottom: 40px;
    margin-bottom: 30px;
  }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .footer-meta {
    flex-direction: column;
    gap: 16px;
  }
}

@media (max-width: 480px) {
  .why-section {
    padding: 60px 20px;
  }
  .why-heading {
    font-size: 30px;
  }
  .why-badge {
    display: none;
  }
  .ab-right {
    padding: 32px 18px;
  }
  .ab-heading {
    font-size: 26px;
  }
  .ab-pillars {
    grid-template-columns: 1fr;
  }
  .hero-inner {
    padding: 0 5vw 60px;
  }
  .hero-title {
    font-size: 38px;
  }
  .process-section {
    padding: 60px 5vw 60px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  ::before,
  ::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}