/********** Template CSS **********/
/* ===== FORCE REMOVE GREEN FROM BOOTSTRAP ===== */

/* Override Bootstrap primary color */
:root {
  --bs-primary: #0d0d0d !important;
  --primary: #0d0d0d;
  --secondary: #6c757d;
  --light: #F5F5F5;
  --dark: #14141F;
}

html {
  scroll-behavior: smooth;
}

/* =========================================
   GLOBAL BUTTON STYLES - STRICT CONSISTENCY
   ========================================= */

/* Default Button Reset */
.btn {
  font-family: 'Nunito', sans-serif;
  font-weight: 600;
  transition: all 0.3s ease;
  border-radius: 30px !important;
  /* Standardized Pill Shape */
  padding: 10px 25px;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 0.5px;
  border: 2px solid transparent;
}

/* PRIMARY BUTTON (Black bg, White text) */
.btn-primary,
.read-more-btn {
  background-color: #0d0d0d !important;
  border-color: #0d0d0d !important;
  color: #ffffff !important;
}

.btn-primary:hover,
.read-more-btn:hover {
  background-color: #ffffff !important;
  border-color: #0d0d0d !important;
  color: #0d0d0d !important;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* SECONDARY/LIGHT BUTTON (White bg, Black text) */
.btn-light,
.btn-white {
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  color: #0d0d0d !important;
}

.btn-light:hover,
.btn-white:hover {
  background-color: #0d0d0d !important;
  border-color: #0d0d0d !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* OUTLINE BUTTON (Transparent bg, Black border, Black text) */
.btn-outline-primary,
.btn-outline-dark {
  background-color: transparent !important;
  border-color: #0d0d0d !important;
  color: #0d0d0d !important;
  border-width: 2px !important;
}

.btn-outline-primary:hover,
.btn-outline-dark:hover {
  background-color: #0d0d0d !important;
  border-color: #0d0d0d !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* LINK BUTTON */
.btn-link {
  color: #0d0d0d !important;
  background: transparent !important;
  border: none !important;
  text-decoration: underline !important;
  padding: 0 !important;
}

.btn-link:hover {
  color: #666 !important;
  background: transparent !important;
}

/* FOOTER BUTTONS/LINKS (White text) */
.footer .btn,
.footer a {
  color: #ffffff !important;
}

.footer .btn-social {
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

.footer .btn-social:hover {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0d0d0d !important;
}

/* Clean up Bootstrap focus rings */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus,
.accordion-button:focus {
  box-shadow: none !important;
  outline: none !important;
}

/* =========================================
   TYPOGRAPHY & UTILS
   ========================================= */
body {
  color: #0d0d0d;
}

a {
  text-decoration: none;
  color: inherit;
  transition: 0.3s;
}

a:hover {
  color: inherit !important;
}

.text-primary {
  color: #0d0d0d !important;
}

.bg-primary {
  background-color: #0d0d0d !important;
}

/* Section Title - Black styling */
.section-title {
  position: relative;
  display: inline-block;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1px;
}

.section-title::before,
.section-title::after {
  background: #0d0d0d !important;
}

.section-title::before {
  position: absolute;
  content: "";
  width: calc(100% + 80px);
  height: 2px;
  top: 50%;
  left: -40px;
  z-index: -1;
  transform: translateY(-50%);
}

.section-title::after {
  position: absolute;
  content: "";
  width: calc(100% + 120px);
  height: 2px;
  top: 50%;
  left: -60px;
  z-index: -1;
  transform: translateY(-50%);
}

/* Specific component fixes */
.bg-black {
  background-color: #000 !important;
}



/* Subtle Hover Effects for Cards */
/* Subtle Hover Effects for Cards */
.service-item,
.tech-card,
.team-item,
.value-card {
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.service-item:hover,
.tech-card:hover,
.team-item:hover,
.value-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.05) !important;
}

/* SPINNER */
#spinner {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease-out, visibility 0s linear .5s;
  z-index: 99999;
}

#spinner.show {
  transition: opacity .5s ease-out, visibility 0s linear 0s;
  visibility: visible;
  opacity: 1;
}

/* BACK TO TOP */
.back-to-top {
  position: fixed;
  display: none;
  right: 45px;
  bottom: 45px;
  z-index: 99;
  background-color: #0d0d0d !important;
  border: 2px solid #0d0d0d !important;
  color: #ffffff !important;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.back-to-top:hover {
  background-color: white !important;
  color: #0d0d0d !important;
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* CARDs */
.tech-card:hover {
  border-color: #000000 !important;
}
/* ===== FORCE FIX TESTIMONIAL ARROWS ===== */
.testimonial-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: #000 !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  padding: 12px;
  border-radius: 50%;
  transition: all 0.3s ease;
  outline: none !important;
}

.testimonial-arrow:hover,
.testimonial-arrow:active,
.testimonial-arrow:focus,
.testimonial-arrow:focus-visible {
  background-color: #fff !important;
  color: #000 !important;
  border-color: #000 !important;
  box-shadow: none !important;
}

.testimonial-arrow i {
  color: inherit !important;
}
/* =========================================
   TEAM SOCIAL ICONS HOVER FIX
   ========================================= */
   .team-item .social-icon i {
    color: black; /* default color */
    transition: color 0.3s;
  }
  
  .team-item:hover .social-icon i {
    color: white !important; /* force white on hover */
  }