/* ============================================
   PROFESSIONAL ENHANCEMENTS
   Clean, credible, subtle interactions for B2B
   ============================================ */

/* === PROFESSIONAL ANIMATION PRINCIPLES ===
   - Subtle, not flashy
   - Fast transitions (200-300ms)
   - Purposeful, not decorative
   - Builds trust, not distracts
*/

/* === SMOOTH FADE-IN FOR SECTIONS === */
.section {
  animation: gentleFadeIn 0.6s ease-out;
}

@keyframes gentleFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* === PROFESSIONAL HOVER STATES === */

/* Service Cards - Subtle lift */
.service-card {
  transition: all 0.25s ease;
}

.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.12);
}

/* Project Cards - Minimal interaction */
.project-card {
  transition: all 0.25s ease;
}

.project-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Partner Logos - Professional subtle color */
.partner-logo {
  transition: all 0.25s ease;
  opacity: 0.85;
}

.partner-logo:hover {
  opacity: 1;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.08);
}

/* === PROFESSIONAL BUTTON STYLES === */
.hero-buttons a,
button,
.carousel-nav {
  transition: all 0.2s ease;
}

.hero-buttons a:hover {
  transform: translateY(-2px);
}

/* === SUBTLE ICON ANIMATIONS === */
.service-icon,
.trust-icon {
  transition: transform 0.25s ease;
}

.service-card:hover .service-icon,
.trust-item:hover .trust-icon {
  transform: scale(1.05);
}

/* === CLEAN FOCUS STATES === */
*:focus-visible {
  outline: 2px solid #2563EB;
  outline-offset: 2px;
}

/* === PROFESSIONAL LOADING STATE === */
@keyframes subtleLoad {
  from { opacity: 0.95; }
  to { opacity: 1; }
}

/* === REMOVE ANY DISTRACTING ELEMENTS === */
.hero-particles,
.custom-cursor,
.floating-cta {
  display: none !important;
}

/* === PROFESSIONAL SCROLL BEHAVIOR === */
html {
  scroll-behavior: smooth;
}

/* === TRUST-BUILDING ELEMENTS === */
.trust-item {
  transition: transform 0.2s ease;
}

.trust-item:hover {
  transform: translateY(-2px);
}

/* === PROFESSIONAL CAROUSEL === */
.carousel-nav {
  transition: all 0.2s ease;
}

.carousel-nav:hover {
  background: #2563EB;
  color: white;
  transform: translateY(-50%) scale(1.05);
}

/* === INDUSTRY ORBS - KEEP PROFESSIONAL === */
.industry-orb {
  transition: transform 0.25s ease, filter 0.25s ease;
}

.industry-orb:hover {
  transform: scale(1.1);
  filter: brightness(1.1);
}

/* === CLEAN SHADOWS === */
.service-card,
.project-card,
.partner-logo {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* === RESPONSIVE PROFESSIONAL === */
@media (max-width: 768px) {
  .service-card:hover,
  .project-card:hover,
  .trust-item:hover {
    transform: translateY(-2px);
  }
}

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

/* === CREDIBILITY ENHANCEMENTS === */

/* Professional spacing */
.section {
  padding: 80px 20px;
}

/* Clean typography */
body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Professional images */
img {
  image-rendering: -webkit-optimize-contrast;
}

/* Clean gradients only where appropriate */
.hero-section {
  background: linear-gradient(135deg, #1E40AF 0%, #2563EB 50%, #14B8A6 100%);
}

/* === TRUST BADGES ENHANCEMENT === */
.trust-container {
  background: rgba(255, 255, 255, 0.95);
  padding: 30px;
  border-radius: 12px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

/* === PROFESSIONAL SECTION HEADERS === */
.section-title {
  position: relative;
  padding-bottom: 20px;
}

.section-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, #2563EB, #14B8A6);
  border-radius: 2px;
}

/* === REMOVE SCROLL PROGRESS BAR === */
.scroll-progress {
  display: none !important;
}

/* === PROFESSIONAL FORM STYLING === */
input:focus,
textarea:focus,
select:focus {
  outline: 2px solid #2563EB;
  outline-offset: 2px;
}

/* === CLEAN PRINT STYLES === */
@media print {
  .hero-section {
    background: white;
    color: black;
  }

  button,
  .carousel-nav {
    display: none;
  }
}
