@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  --esi-primary: #0052FF;
  --esi-primary-dark: #003FCC;
  --esi-secondary: #0A1628;
  --esi-accent: #00C8FF;
  --esi-accent-2: #6C5CE7;
  --esi-bg-light: #F8FAFC;
  --esi-bg-white: #FFFFFF;
  --esi-text-dark: #0F172A;
  --esi-text-mid: #475569;
  --esi-text-light: #94A3B8;
  --esi-border: #E2E8F0;
  --esi-gradient: linear-gradient(135deg, #0052FF 0%, #00C8FF 100%);
  --esi-gradient-dark: linear-gradient(135deg, #0A1628 0%, #1E293B 100%);
  --esi-shadow-sm: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --esi-shadow-md: 0 4px 20px rgba(0,82,255,0.08), 0 2px 8px rgba(0,0,0,0.04);
  --esi-shadow-lg: 0 10px 40px rgba(0,82,255,0.12), 0 4px 16px rgba(0,0,0,0.06);
  --esi-shadow-xl: 0 20px 60px rgba(0,82,255,0.15), 0 8px 24px rgba(0,0,0,0.08);
  --esi-radius-sm: 8px;
  --esi-radius-md: 12px;
  --esi-radius-lg: 20px;
  --esi-radius-xl: 28px;
  --esi-transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

* {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

html {
  scroll-behavior: smooth !important;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  color: var(--esi-text-dark) !important;
  background: var(--esi-bg-light) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Space Grotesk', 'Inter', sans-serif !important;
  letter-spacing: -0.02em !important;
}

p {
  font-family: 'Inter', sans-serif !important;
  line-height: 1.7 !important;
}

a {
  text-decoration: none !important;
  transition: var(--esi-transition) !important;
}

a:hover {
  text-decoration: none !important;
}

.header-area {
  background: rgba(255,255,255,0.88) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(0,82,255,0.06) !important;
}

.header-area.header--transparent {
  background: rgba(255,255,255,0.88) !important;
}

.header-area.header--sticky.sticky {
  background: rgba(255,255,255,0.95) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,0.06) !important;
}

.header-left .logo a {
  color: var(--esi-text-dark) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 15px !important;
  text-decoration: none !important;
}

.header-left .logo a .logo-text {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

.header-left .logo a .logo-text span:first-child {
  font-size: 14px !important;
  letter-spacing: -0.01em !important;
}

.header-left .logo a .logo-text span:last-child {
  font-size: 12px !important;
  font-weight: 500 !important;
  opacity: 0.8 !important;
}

.header-left .logo a br {
  display: none !important;
}

.header-left .logo a img {
  height: 50px !important;
  width: auto !important;
  flex-shrink: 0 !important;
}

.mainmenunav ul.mainmenu > li > a {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--esi-text-mid) !important;
}

.mainmenunav ul.mainmenu > li > a:hover {
  color: var(--esi-primary) !important;
}

.header-area .header-wrapper a.rn-btn {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #000 !important;
  background: var(--esi-gradient) !important;
  border: none !important;
  border-radius: 50px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 0 4px 15px rgba(0,82,255,0.3) !important;
}

.header-area .header-wrapper a.rn-btn:hover {
  background: var(--esi-gradient) !important;
  border: none !important;
  color: #000 !important;
  box-shadow: 0 8px 25px rgba(0,82,255,0.4) !important;
}

.header-area.header--sticky.sticky .header-wrapper a.rn-btn {
  color: #000 !important;
  border-color: transparent !important;
  background: var(--esi-gradient) !important;
}

.header-area.header--sticky.sticky .header-wrapper a.rn-btn:hover {
  background: var(--esi-gradient) !important;
  border-color: transparent !important;
  color: #000 !important;
}

.header-area.header--sticky.sticky .header-wrapper .mainmenunav ul.mainmenu > li > a {
  color: var(--esi-text-mid) !important;
}

.header-area.header--sticky.sticky .header-wrapper .mainmenunav ul.mainmenu > li > a:hover,
.header-area.header--sticky.sticky .header-wrapper .mainmenunav ul.mainmenu > li > a.active {
  color: var(--esi-primary) !important;
}

.header-area.header--sticky .mainmenunav ul.mainmenu > li > a::after,
.header-area.header--sticky.sticky .header-wrapper .mainmenunav ul.mainmenu > li > a::after {
  background: var(--esi-primary) !important;
}

.header-area.header--sticky.sticky .humberger-menu span.text-white {
  color: var(--esi-text-dark) !important;
}

.header-wrapper {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  padding: 10px 40px !important;
  gap: 40px !important;
}

.logo {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
}

.header-right {
  flex: 1 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 40px !important;
}

.mainmenunav {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
}

.mainmenunav ul.mainmenu {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  gap: 35px !important;
  justify-content: flex-end !important;
}

.mainmenunav ul.mainmenu > li {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.mainmenunav ul.mainmenu > li > a {
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  color: #000 !important;
  font-size: 15px !important;
}

.header-area .header-wrapper a.rn-btn {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #000 !important;
  background: transparent !important;
  border: 1px solid #000 !important;
  border-radius: 6px !important;
  padding: 10px 20px !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  transition: all 0.3s ease !important;
  white-space: nowrap !important;
}

.header-area .header-wrapper a.rn-btn:hover {
  background: rgba(0,0,0,0.1) !important;
  border-color: #000 !important;
  color: #000 !important;
  box-shadow: none !important;
}

.header-btn {
  flex: 0 0 auto !important;
  margin-left: 10px !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

.header-btn a.rn-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
  line-height: normal !important;
}

.logo a {
  color: var(--esi-text-dark) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 15px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.logo-text {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

.mainmenunav, 
.header-btn, 
.humberger-menu {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}


.home-products-section {
  background: url('../images/hero-bg.jpg') no-repeat center center !important;
  background-size: cover !important;
  padding-top: 180px !important;
  padding-bottom: 120px !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 85vh !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

.home-products-section::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(160deg, rgba(2, 6, 23, 0.85) 0%, rgba(10, 22, 40, 0.75) 30%, rgba(12, 30, 58, 0.65) 60%, rgba(10, 22, 40, 0.85) 100%) !important;
  z-index: 1 !important;
}

.home-products-section::after {
  content: '' !important;
  position: absolute !important;
  bottom: -200px !important;
  left: -100px !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(0,200,255,0.12) 0%, rgba(108,92,231,0.06) 40%, transparent 70%) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  animation: heroGlow2 10s ease-in-out infinite alternate !important;
}

@keyframes heroGlow1 {
  0% { transform: translate(0, 0) scale(1); opacity: 0.7; }
  100% { transform: translate(-40px, 30px) scale(1.15); opacity: 1; }
}

@keyframes heroGlow2 {
  0% { transform: translate(0, 0) scale(1); opacity: 0.6; }
  100% { transform: translate(30px, -20px) scale(1.1); opacity: 1; }
}

.homer-products-info {
  position: relative !important;
  z-index: 2 !important;
}

.home-products-h1,
.home-products-section .title {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 72px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  line-height: 1.02 !important;
  letter-spacing: -0.04em !important;
  text-shadow: 0 2px 40px rgba(0,82,255,0.15) !important;
  background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0.85) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

.home-products-section span small {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--esi-accent) !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  display: inline-block !important;
  padding: 6px 20px !important;
  border: 1px solid rgba(0,200,255,0.25) !important;
  border-radius: 50px !important;
  background: rgba(0,200,255,0.06) !important;
  margin-top: 8px !important;
}

.img-container {
  display: none !important;
}

.img-container > .img {
  display: none !important;
}

.home-products-section .homer-products-info::after {
  content: '' !important;
  display: block !important;
  margin-top: 40px !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,0.45) !important;
  letter-spacing: 0.08em !important;
  font-family: 'Inter', sans-serif !important;
}

.home-products-section .homer-products-info .text {
  display: none !important;
}

.home-products-section .container {
  max-width: 100% !important;
  padding: 0 60px !important;
}

.home-products-section .container .row .col-lg-8 {
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

.section-title h2.title,
.section-title h3.title {
  font-size: 42px !important;
  font-weight: 800 !important;
  color: var(--esi-text-dark) !important;
}

.section-title.text-center h2.title::after {
  content: '' !important;
  display: block !important;
  width: 60px !important;
  height: 4px !important;
  background: var(--esi-gradient) !important;
  border-radius: 2px !important;
  margin: 16px auto 0 !important;
}

.section-title p,
.section-title .description {
  font-size: 17px !important;
  color: var(--esi-text-mid) !important;
}

.bg_color--1 {
  background: transparent !important;
}

.bg_color--5 {
  background: var(--esi-bg-light) !important;
}

.rn-section-gap {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

.portfolio {
  border-radius: var(--esi-radius-lg) !important;
  overflow: hidden !important;
  box-shadow: var(--esi-shadow-md) !important;
  transition: var(--esi-transition) !important;
  border: 1px solid var(--esi-border) !important;
  background: transparent !important;
}

.portfolio .content {
  background: transparent !important;
}

.portfolio:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--esi-shadow-xl) !important;
  border-color: rgba(0,82,255,0.2) !important;
}

.portfolio .content {
  background: transparent !important;
}

.portfolio .content .inner p {
  font-size: 14px !important;
  color: var(--esi-text-mid) !important;
}

.portfolio .content .inner h4 a {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--esi-text-dark) !important;
}

.portfolio .content .inner h4 a:hover {
  color: var(--esi-primary) !important;
}

/* Brand and Image container transparency */
.img-container,
.img-container > .img,
.portfolio-image-container,
.portfolio-image-container img,
ul.brand-style,
ul.brand-style li,
ul.brand-style li img,
.brand-style,
.brand-style li,
.brand-style li img {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}



.about-area {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

.about-area .thumbnail img {
  border-radius: var(--esi-radius-lg) !important;
  box-shadow: var(--esi-shadow-lg) !important;
  transition: var(--esi-transition) !important;
}

.about-area .thumbnail img:hover {
  transform: scale(1.02) !important;
  box-shadow: var(--esi-shadow-xl) !important;
}

.about-inner .section-title h2.title {
  font-size: 36px !important;
}

.about-inner .section-title .description {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: var(--esi-text-mid) !important;
}

.about-us-list {
  padding: 24px !important;
  background: var(--esi-bg-light) !important;
  border-radius: var(--esi-radius-md) !important;
  margin-bottom: 20px !important;
  border-left: 4px solid var(--esi-primary) !important;
  transition: var(--esi-transition) !important;
}

.about-us-list:hover {
  box-shadow: var(--esi-shadow-md) !important;
  transform: translateX(4px) !important;
}

.about-us-list h4.title,
.about-us-list h3.title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--esi-text-dark) !important;
}

.about-us-list p {
  font-size: 15px !important;
  color: var(--esi-text-mid) !important;
  margin-bottom: 0 !important;
}

#usa-map {
  background: var(--esi-secondary) !important;
  position: relative !important;
  overflow: hidden !important;
}

#usa-map::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: var(--esi-gradient) !important;
  z-index: 2 !important;
}

.map-title {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  color: #FFFFFF !important;
}

.map-paragraph {
  color: rgba(255,255,255,0.7) !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
}

.map-icon-list-text {
  color: rgba(255,255,255,0.85) !important;
}

.map-icon-list-icon {
  color: var(--esi-accent) !important;
}

.state:hover {
  fill: var(--esi-accent) !important;
}

.rn-counterup.counterup_style--1 {
  text-align: center !important;
  padding: 40px 20px !important;
  background: transparent !important;
  border-radius: var(--esi-radius-lg) !important;
  box-shadow: var(--esi-shadow-md) !important;
  transition: var(--esi-transition) !important;
  border: 1px solid var(--esi-border) !important;
}

.rn-counterup.counterup_style--1:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--esi-shadow-xl) !important;
  border-color: rgba(0,82,255,0.2) !important;
}

.rn-counterup h5.counter,
.counterup_style--1 h5.counter {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 52px !important;
  font-weight: 800 !important;
  background: var(--esi-gradient) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

.rn-counterup .description {
  font-size: 15px !important;
  color: var(--esi-text-mid) !important;
}

.breadcrumb-area {
  padding-top: 160px !important;
  padding-bottom: 80px !important;
}

[data-black-overlay]::before {
  background: linear-gradient(135deg, rgba(10,22,40,0.88) 0%, rgba(0,82,255,0.6) 100%) !important;
}

.breadcrumb-inner .title {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 56px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

.breadcrumb-inner .page-list li {
  color: rgba(255,255,255,0.7) !important;
  font-size: 15px !important;
}

.breadcrumb-inner .page-list li a {
  color: rgba(255,255,255,0.7) !important;
}

.breadcrumb-inner .page-list li a:hover {
  color: var(--esi-accent) !important;
}

.breadcrumb-inner .page-list li.current-page {
  color: var(--esi-accent) !important;
}

.rn-team-area {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

.rn-team-area > .container > h2.title {
  font-size: 42px !important;
  text-align: center !important;
  color: var(--esi-text-dark) !important;
  margin-bottom: 48px !important;
}

.team-static {
  background: transparent !important;
  border-radius: var(--esi-radius-lg) !important;
  overflow: hidden !important;
  box-shadow: var(--esi-shadow-md) !important;
  transition: var(--esi-transition) !important;
  margin-bottom: 30px !important;
  border: 1px solid var(--esi-border) !important;
}

.team-static:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--esi-shadow-xl) !important;
  border-color: rgba(0,82,255,0.2) !important;
}

.team-static .thumbnail {
  overflow: hidden !important;
}

.team-static .thumbnail img {
  width: 100% !important;
  height: 480px !important;
  object-fit: contain !important;
  background-color: transparent !important;
  transition: var(--esi-transition) !important;
}

.team-static:hover .thumbnail img {
  transform: scale(1.05) !important;
}

.team-static .inner {
  padding: 24px !important;
  background: transparent !important;
}

.team-static .inner .content h4.title {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--esi-text-dark) !important;
}

.team-static .inner .content .designation {
  font-size: 14px !important;
  color: var(--esi-primary) !important;
  font-weight: 500 !important;
}

.team-static .social-transparent li a {
  color: var(--esi-text-mid) !important;
  font-size: 13px !important;
  transition: var(--esi-transition) !important;
}

.team-static .social-transparent li a:hover {
  color: var(--esi-primary) !important;
}

.team-static .social-transparent .social-icon {
  width: 20px !important;
  height: 20px !important;
  opacity: 0.6 !important;
  transition: var(--esi-transition) !important;
}

.team-static .social-transparent li a:hover .social-icon {
  opacity: 1 !important;
}

.rn-contact-area {
  background: transparent !important;
}

.contact-form--1 .section-title h2.title {
  font-size: 100px !important;
  color: var(--esi-text-dark) !important;
  font-weight: 900 !important;
  letter-spacing: -0.05em !important;
  line-height: 0.95 !important;
  margin-bottom: 30px !important;
}

.contact-form--1 .section-title .description {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: var(--esi-text-mid) !important;
}

.form-wrapper input,
.form-wrapper textarea {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  padding: 14px 20px !important;
  border: 2px solid var(--esi-border) !important;
  border-radius: var(--esi-radius-md) !important;
  background: var(--esi-bg-light) !important;
  color: var(--esi-text-dark) !important;
  transition: var(--esi-transition) !important;
}

.form-wrapper input:focus,
.form-wrapper textarea:focus {
  border-color: var(--esi-primary) !important;
  box-shadow: 0 0 0 4px rgba(0,82,255,0.1) !important;
  outline: none !important;
  background: transparent !important;
}

.form-wrapper textarea {
  min-height: 140px !important;
}

.rn-button-style--2.btn_solid {
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #fff !important;
  background: var(--esi-gradient) !important;
  border: none !important;
  padding: 14px 36px !important;
  border-radius: 50px !important;
  transition: var(--esi-transition) !important;
  box-shadow: 0 4px 15px rgba(0,82,255,0.3) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.rn-button-style--2.btn_solid:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(0,82,255,0.4) !important;
}

/* Career Page Contact Button Resize */
.service-btn a.rn-btn-dark,
.service-btn a.btn-transparent.rn-btn-dark {
  font-size: 18px !important;
  padding: 18px 45px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: var(--esi-transition) !important;
  border-radius: 50px !important;
  background: var(--esi-gradient) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 15px rgba(0,82,255,0.3) !important;
  text-transform: none !important;
  margin-top: 20px !important;
}

.service-btn a.rn-btn-dark span,
.service-btn a.btn-transparent.rn-btn-dark span {
  color: #fff !important;
}

.service-btn a.rn-btn-dark:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 30px rgba(0,82,255,0.4) !important;
  color: #fff !important;
}


.rn-button-style--2.btn_solid::before,
.rn-button-style--2::before {
  display: none !important;
}

.rn-contact-address-area {
  background: var(--esi-bg-light) !important;
}

.rn-address {
  padding: 20px 16px !important;
  margin-top: 10px !important;
  background: transparent !important;
  border-radius: var(--esi-radius-lg) !important;
  box-shadow: var(--esi-shadow-md) !important;
  text-align: center !important;
  transition: var(--esi-transition) !important;
  border: 1px solid var(--esi-border) !important;
}

.rn-address:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--esi-shadow-xl) !important;
  border-color: rgba(0,82,255,0.2) !important;
}

.rn-address .icon {
  width: 64px !important;
  height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(0,82,255,0.1) !important;
  border-radius: 50% !important;
  margin: 0 auto 10px !important;
  font-size: 24px !important;
  color: #0052FF !important;
  opacity: 1 !important;
  visibility: visible !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  line-height: 64px !important;
  border: none !important;
  overflow: visible !important;
}

.rn-address .icon *,
.rn-address .icon i,
.rn-address .icon i::before,
.rn-address .icon svg {
  color: #0052FF !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 24px !important;
  display: inline-block !important;
}

.rn-address:hover .icon {
  background: #0052FF !important;
  color: #fff !important;
  border-color: #0052FF !important;
}

.rn-address:hover .icon *,
.rn-address:hover .icon i,
.rn-address:hover .icon i::before,
.rn-address:hover .icon svg {
  color: #fff !important;
}

.rn-address .inner h4.title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--esi-text-dark) !important;
}

.rn-address .inner p {
  font-size: 15px !important;
  color: var(--esi-text-mid) !important;
}

.rn-address .inner p a {
  color: var(--esi-text-mid) !important;
}

.rn-address .inner p a:hover {
  color: var(--esi-primary) !important;
}

.single-service.service__style--4 {
  background: transparent !important;
  border-radius: var(--esi-radius-lg) !important;
  box-shadow: var(--esi-shadow-md) !important;
  transition: var(--esi-transition) !important;
  border: 1px solid var(--esi-border) !important;
}

.single-service.service__style--4::before {
  background: var(--esi-primary) !important;
}

.single-service.service__style--4:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--esi-shadow-xl) !important;
  border-color: rgba(0,82,255,0.2) !important;
}

.single-service.service__style--4 .icon,
.single-service.service__style--4 .icon svg {
  color: var(--esi-primary) !important;
  stroke: var(--esi-primary) !important;
}

.single-service.service__style--4 .content h3.title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--esi-text-dark) !important;
}

.single-service.service__style--4 .content p {
  font-size: 14px !important;
  color: var(--esi-text-mid) !important;
}

.single-service.service__style--4:hover .content h3.title {
  color: #fff !important;
}

.single-service.service__style--4:hover .content p {
  color: rgba(255,255,255,0.8) !important;
}

.single-service.service__style--4:hover .icon,
.single-service.service__style--4:hover .icon svg {
  color: #fff !important;
  stroke: #fff !important;
}

a.btn-transparent.rn-btn-dark,
.btn-transparent.rn-btn-dark {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--esi-primary) !important;
  border: 2px solid var(--esi-primary) !important;
  border-radius: 50px !important;
  transition: var(--esi-transition) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

a.btn-transparent.rn-btn-dark:hover,
.btn-transparent.rn-btn-dark:hover {
  background: var(--esi-primary) !important;
  color: #fff !important;
  box-shadow: 0 6px 20px rgba(0,82,255,0.3) !important;
}

.btn-transparent.rn-btn-dark::before,
a.btn-transparent::after {
  display: none !important;
}

.slide.slide-style-2[data-black-overlay]::before {
  background: linear-gradient(135deg, rgba(10,22,40,0.9) 0%, rgba(0,82,255,0.5) 100%) !important;
}

.slide .inner h1.title {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 56px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  line-height: 1.1 !important;
}

.slide .inner .description {
  color: rgba(255,255,255,0.7) !important;
  font-size: 18px !important;
}

.home-logos-section {
  background: #ffffff !important;
  padding: 60px 0 !important;
}

.cb-tagreel-item img.home-logo {
  border-radius: 0 !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
  transition: var(--esi-transition) !important;
  background: #ffffff !important;
  max-width: 180px !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

.cb-tagreel-item img.home-logo:hover {
  box-shadow: none !important;
  transform: scale(1.05) !important;
}

.contact-form--1 .mb_md--40.mb_sm--40 img,
.rn-contact-area img {
  border-radius: var(--esi-radius-lg) !important;
  box-shadow: var(--esi-shadow-lg) !important;
}

.portfolio .thumbnail-inner {
  border-radius: var(--esi-radius-lg) var(--esi-radius-lg) 0 0 !important;
  overflow: hidden !important;
}

.rn-slick-dot .slick-dots li button,
.portfolio-sacousel-inner .slick-dots li button {
  background: var(--esi-border) !important;
}

.rn-slick-dot .slick-dots li.slick-active button,
.portfolio-sacousel-inner .slick-dots li.slick-active button {
  background: var(--esi-primary) !important;
}

.rn-slick-dot .slick-dots li button::after,
.portfolio-sacousel-inner .slick-dots li button::after {
  background: var(--esi-primary) !important;
}

.footer-style-2 {
  background: var(--esi-secondary) !important;
  position: relative !important;
}

.footer-style-2[data-black-overlay]::before {
  background: transparent !important;
}

.footer-style-2::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--esi-gradient) !important;
  z-index: 2 !important;
}

.footer-style-2 .logo img {
  height: 48px !important;
  width: auto !important;
}

.footer-style-2 p,
.footer-style-2 .text p {
  color: rgba(255,255,255,0.6) !important;
  font-size: 14px !important;
}

.ft-link li a {
  color: rgba(255,255,255,0.7) !important;
  font-size: 14px !important;
  transition: var(--esi-transition) !important;
}

.ft-link li a:hover {
  color: var(--esi-accent) !important;
}

a.rn-btn,
button.rn-btn,
.rn-btn {
  font-family: 'Inter', sans-serif !important;
  color: #fff !important;
  background: var(--esi-gradient) !important;
  border: none !important;
  border-radius: 50px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 0 4px 15px rgba(0,82,255,0.3) !important;
}

a.rn-btn:hover,
button.rn-btn:hover,
.rn-btn:hover {
  box-shadow: 0 8px 25px rgba(0,82,255,0.4) !important;
  color: #fff !important;
}

a.rn-btn::before,
.rn-btn::before {
  display: none !important;
}

#scrollUp {
  width: 48px !important;
  height: 48px !important;
  background: var(--esi-gradient) !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 15px rgba(0,82,255,0.3) !important;
  transition: var(--esi-transition) !important;
}

#scrollUp:hover {
  box-shadow: 0 8px 25px rgba(0,82,255,0.4) !important;
}

#scrollUp i {
  color: #fff !important;
}

.breadcrumb-area.rn-bg-color {
  position: relative !important;
}

.breadcrumb-area.rn-bg-color.bg_image {
  background-size: cover !important;
  background-position: center !important;
}

::selection {
  background: rgba(0,82,255,0.15) !important;
  color: var(--esi-text-dark) !important;
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--esi-bg-light);
}

::-webkit-scrollbar-thumb {
  background: var(--esi-text-light);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--esi-primary);
}

.main-page {
  overflow-x: hidden !important;
}

@media (max-width: 768px) {
  .home-products-h1,
  .home-products-section .title {
    font-size: 40px !important;
  }

  .home-products-section {
    padding-top: 140px !important;
    padding-bottom: 60px !important;
    min-height: auto !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }

  .home-products-section .container {
    padding: 0 24px !important;
  }
  }

  .section-title h2.title {
    font-size: 32px !important;
  }

  .breadcrumb-inner .title {
    font-size: 38px !important;
  }

  .team-static {
  height: 600px !important; /* Increased height */
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.team-static .thumbnail {
  height: 400px !important; /* Increased height for image area */
  width: 100% !important;
  overflow: hidden !important;
  background: #f8f8f8 !important;
}

.team-static .thumbnail img {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
  transition: var(--esi-transition) !important;
}

.team-static .inner {
  padding: 25px !important; /* Increased padding */
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  background: #fff !important;
}

.team-static .inner .content {
  margin-bottom: 10px !important;
}

.team-static .inner .content h4.title {
  font-size: 24px !important; /* Larger text */
  margin-bottom: 5px !important;
}

.team-static .inner .content p.designation {
  font-size: 16px !important; /* Larger text */
}

.rn-team-area .row {
  display: flex !important;
  flex-wrap: wrap !important;
}

/* Officers section: 3 cards per row */
#team-officers .row [class*="col-"] {
  display: flex !important;
  flex: 0 0 33.333% !important;
  max-width: 33.333% !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  margin-bottom: 40px !important;
}

/* Sales & Purchasing section: 4 cards per row */
#team-sales .row [class*="col-"] {
  display: flex !important;
  flex: 0 0 25% !important;
  max-width: 25% !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  margin-bottom: 30px !important;
}


  .rn-counterup h5.counter,
  .counterup_style--1 h5.counter {
    font-size: 38px !important;
  }

  .slide .inner h1.title {
    font-size: 36px !important;
  }

  .map-title {
    font-size: 28px !important;
  }

  .contact-form--1 .section-title h2.title {
    font-size: 28px !important;
  }
}

@media (max-width: 500px) {
  .home-products-h1,
  .home-products-section .title {
    font-size: 30px !important;
  }

  .breadcrumb-inner .title {
    font-size: 30px !important;
  }
}

.hero-buttons {
  display: flex !important;
  gap: 24px !important;
  justify-content: center !important;
  margin-top: 48px !important;
}

.hero-buttons .rn-btn {
  padding: 18px 42px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  border-radius: 50px !important;
  letter-spacing: 0.5px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  text-transform: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
  line-height: normal !important;
}

.hero-buttons .rn-btn:first-child {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}

.hero-buttons .rn-btn:first-child:hover {
  background: #000 !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}

.btn-white {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}

.btn-white:hover {
  background: #000 !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}

/* Slick Slider Dots Redesign */
.slick-dots {
  bottom: -40px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 12px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}

.slick-dots li {
  margin: 0 !important;
  padding: 0 !important;
  width: 12px !important;
  height: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
}

.slick-dots li button {
  width: 10px !important;
  height: 10px !important;
  background: #cbd5e1 !important;
  border: none !important;
  border-radius: 50% !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  position: relative !important;
  opacity: 0.5 !important;
  box-shadow: none !important;
  margin: 0 !important;
}

.slick-dots li button::before,
.slick-dots li button::after {
  display: none !important;
}

.slick-dots li.slick-active button {
  background: var(--esi-primary) !important;
  opacity: 1 !important;
  transform: scale(1.2) !important;
}

/* Portfolio Specific Dots */
.portfolio-sacousel-inner .slick-dots li,
.rn-slick-dot .slick-dots li {
  background: transparent !important;
}

.portfolio-sacousel-inner .slick-dots li button,
.rn-slick-dot .slick-dots li button {
  background: #cbd5e1 !important;
  opacity: 0.5 !important;
}

.portfolio-sacousel-inner .slick-dots li.slick-active button,
.rn-slick-dot .slick-dots li.slick-active button {
  background: var(--esi-primary) !important;
  opacity: 1 !important;
}

.main-page-wrapper,
.page-wrapper {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.footer-style-2 {
  margin-bottom: 0 !important;
  padding-bottom: 10px !important;
}

.footer-style-2.ptb--30 {
  padding-top: 15px !important;
  padding-bottom: 10px !important;
}

.footer-style-2 .ft-link li {
  margin-bottom: 2px !important;
}

.footer-style-2 .ft-link {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.footer-style-2 .logo img {
  height: 36px !important;
}

body,
html {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.backto-top {
  background: transparent !important;
}



