/* Services Page Styles - FlexNetJSX Architecture */

/* Services Page */
.services-page {
  padding-top: var(--spacing-4xl);
}

/* Services Partners Section */
.services-partners-section {
  padding: var(--spacing-3xl) 0;
  background-color: var(--bg-primary);
}

@media (min-width: 768px) {
  .services-partners-section {
    padding: var(--spacing-5xl) 0;
  }
}

/* Services Partners Container */
.services-partners-container {
  padding: var(--spacing-4xl);
  border-radius: var(--radius-lg);
  text-align: center;
  background-color: var(--bg-card);
}

/* Services Partners Heading */
.services-partners-heading {
  font-size: var(--text-2xl);
  font-weight: 700;
  margin-bottom: var(--spacing-xl);
  color: var(--text-primary);
}

@media (min-width: 640px) {
  .services-partners-heading {
    font-size: var(--text-3xl);
  }
}

/* Services Partners Description */
.services-partners-description {
  font-size: var(--text-lg);
  color: var(--text-muted);
  margin-bottom: var(--spacing-lg);
}

/* Services Partners Subdescription */
.services-partners-subdescription {
  font-size: var(--text-lg);
  color: var(--text-muted);
  margin-bottom: var(--spacing-3xl);
}

/* Services Partners Grid */
.services-partners-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-3xl) var(--spacing-xl);
}

/* Services Partner Item */
.services-partner-item {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Services Partner Logo */
.services-partner-logo {
  width: 11rem;
  height: auto;
  object-fit: contain;
  filter: grayscale(100%);
  transition: filter var(--transition-normal);
}

.services-partner-logo:hover {
  filter: grayscale(0%);
}

/* Services Core Section */
.services-core-section {
  padding: var(--spacing-2xl) 0;
  background-color: var(--bg-primary);
}

@media (min-width: 768px) {
  .services-core-section {
    padding: var(--spacing-3xl) 0;
  }
}

/* Services Core Container */
.services-core-container {
  /* Container styles */
}

/* Services Core Grid */
.services-core-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-lg);
  margin-bottom: var(--spacing-xl);
}

@media (min-width: 768px) {
  .services-core-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .services-core-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Services Core Grid Second */
.services-core-grid--second {
  margin-top: var(--spacing-xl);
}

/* Services Core Card */
.services-core-card {
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Services Core Content */
.services-core-content {
  flex-grow: 1;
}

/* Services Core Icon */
.services-core-icon {
  width: 2rem;
  height: 2rem;
  margin-bottom: var(--spacing-md);
  color: var(--color-primary);
}

/* Services Core Title */
.services-core-title {
  font-size: var(--text-lg);
  font-weight: 600;
  margin-bottom: var(--spacing-sm);
  color: var(--text-primary);
}

/* Services Core Description */
.services-core-description {
  color: var(--text-muted);
  margin-bottom: var(--spacing-md);
}

/* Services Core Features */
.services-core-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

/* Services Core Feature Item */
.services-core-feature-item {
  display: flex;
  align-items: flex-start;
}

/* Services Core Feature Icon */
.services-core-feature-icon {
  width: 1rem;
  height: 1rem;
  margin-right: var(--spacing-sm);
  flex-shrink: 0;
  color: var(--text-muted);
}

/* Services Core Feature Text */
.services-core-feature-text {
  color: var(--text-secondary);
}

/* Services CTA Container */
.services-cta-container {
  margin: var(--spacing-xl) 0;
}

/* Services CTA Card */
.services-cta-card {
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-md);
}

/* Services CTA Button */
.services-cta-button {
  font-weight: 600;
  padding: var(--spacing-sm) var(--spacing-xl);
  border-radius: var(--radius-md);
  transition: all var(--transition-normal);
  transform: translateZ(0);
}

.services-cta-button:hover {
  transform: scale(1.05);
}

/* Services CTA Button Primary */
.services-cta-button--primary {
  background-color: var(--color-primary);
  color: var(--text-dark);
}

.services-cta-button--primary:hover {
  background-color: var(--color-primary-dark);
}

/* Services CTA Button Secondary */
.services-cta-button--secondary {
  background-color: transparent;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
}

.services-cta-button--secondary:hover {
  background-color: var(--color-primary);
  color: var(--text-dark);
}

/* Services AI Enterprise Section */
.services-ai-enterprise-section {
  background-color: var(--bg-primary);
}

/* Services AI Enterprise Container */
.services-ai-enterprise-container {
  /* Container styles */
}

/* Services AI Enterprise Grid */
.services-ai-enterprise-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-lg);
}

@media (min-width: 768px) {
  .services-ai-enterprise-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Services Enterprise Section */
.services-enterprise-section {
  height: 100%;
}

/* Services Enterprise Container */
.services-enterprise-container {
  padding: var(--spacing-xl);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
  height: 100%;
}

/* Services Enterprise Title */
.services-enterprise-title {
  font-size: var(--text-xl);
  font-weight: 600;
  margin-bottom: var(--spacing-sm);
  color: var(--text-primary);
}

/* Services Enterprise Subtitle */
.services-enterprise-subtitle {
  font-size: var(--text-base);
  color: var(--text-secondary);
  margin-bottom: var(--spacing-2xl);
}

/* Services Enterprise Icon */
.services-enterprise-icon {
  width: 1.5rem;
  height: 1.5rem;
  margin-right: var(--spacing-md);
  flex-shrink: 0;
  color: var(--text-primary);
}

/* Services Enterprise Description */
.services-enterprise-description {
  font-size: var(--text-base);
  color: var(--text-secondary);
  margin-top: var(--spacing-lg);
}

/* Services AI Section */
.services-ai-section {
  height: 100%;
}

/* Services AI Container */
.services-ai-container {
  padding: var(--spacing-xl);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
  height: 100%;
}

/* Services AI Title */
.services-ai-title {
  font-size: var(--text-xl);
  font-weight: 600;
  margin-bottom: var(--spacing-sm);
  color: var(--text-primary);
}

/* Services AI Subtitle */
.services-ai-subtitle {
  font-size: var(--text-base);
  color: var(--text-secondary);
  margin-bottom: var(--spacing-2xl);
}

/* Services Methodology Section */
.services-methodology-section {
  padding: var(--spacing-2xl) 0;
  background-color: var(--bg-primary);
}

@media (min-width: 768px) {
  .services-methodology-section {
    padding: var(--spacing-3xl) 0;
  }
}

/* Services Methodology Container */
.services-methodology-container {
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
}

/* Services Pricing Section */
.services-pricing-section {
  padding: var(--spacing-2xl) 0;
  background-color: var(--bg-primary);
}

@media (min-width: 768px) {
  .services-pricing-section {
    padding: var(--spacing-3xl) 0;
  }
}

/* Services Pricing Container */
.services-pricing-container {
  /* Container styles */
}

/* Services Pricing Heading */
.services-pricing-heading {
  font-size: var(--text-xl);
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--spacing-md);
  color: var(--text-primary);
}

@media (min-width: 640px) {
  .services-pricing-heading {
    font-size: var(--text-2xl);
  }
}

/* Services Pricing Description */
.services-pricing-description {
  font-size: var(--text-sm);
  text-align: center;
  color: var(--text-secondary);
  margin-bottom: var(--spacing-2xl);
}

/* Services Pathfinder Card */
.services-pathfinder-card {
  margin-bottom: var(--spacing-2xl);
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
}

/* Services Pathfinder Title */
.services-pathfinder-title {
  font-size: var(--text-xl);
  font-weight: 600;
  text-align: center;
  margin-bottom: var(--spacing-md);
  color: var(--text-primary);
}

/* Services Pathfinder Price */
.services-pathfinder-price {
  font-size: var(--text-lg);
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--spacing-sm);
  color: var(--text-primary);
}

/* Services Pathfinder Subtitle */
.services-pathfinder-subtitle {
  font-size: var(--text-sm);
  text-align: center;
  color: var(--text-muted);
  margin-bottom: var(--spacing-md);
}

/* Services Pathfinder Features */
.services-pathfinder-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-lg);
  text-align: center;
}

/* Services Pathfinder Feature Item */
.services-pathfinder-feature-item {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Services Pathfinder Feature Icon */
.services-pathfinder-feature-icon {
  width: 1rem;
  height: 1rem;
  margin-right: var(--spacing-sm);
  flex-shrink: 0;
  color: var(--text-primary);
}

/* Services Pathfinder Feature Text */
.services-pathfinder-feature-text {
  color: var(--text-primary);
}

/* Services Pathfinder Button */
.services-pathfinder-button {
  font-weight: 600;
  margin: 0 auto;
  display: block;
  padding: var(--spacing-sm) var(--spacing-xl);
  border-radius: var(--radius-md);
  transition: all var(--transition-normal);
  transform: translateZ(0);
}

.services-pathfinder-button:hover {
  transform: scale(1.05);
}

/* Services Packages Grid */
.services-packages-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-lg);
  margin-bottom: var(--spacing-2xl);
}

@media (min-width: 768px) {
  .services-packages-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Services Package Card */
.services-package-card {
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
}

/* Services Package Featured */
.services-package-featured {
  border: 1px solid var(--color-primary);
}

/* Services Package Title */
.services-package-title {
  font-size: var(--text-lg);
  font-weight: 600;
  text-align: center;
  margin-bottom: var(--spacing-sm);
  color: var(--text-primary);
}

/* Services Package Price */
.services-package-price {
  font-size: var(--text-sm);
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--spacing-sm);
  color: var(--text-primary);
}

/* Services Package Subtitle */
.services-package-subtitle {
  font-size: var(--text-xs);
  text-align: center;
  color: var(--text-muted);
  margin-bottom: var(--spacing-md);
}

/* Services Package Features */
.services-package-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-lg);
}

/* Services Package Feature Item */
.services-package-feature-item {
  display: flex;
  align-items: flex-start;
}

/* Services Package Feature Icon */
.services-package-feature-icon {
  width: 1.25rem;
  height: 1.25rem;
  margin-right: var(--spacing-sm);
  flex-shrink: 0;
  color: var(--text-primary);
}

/* Services Package Feature Text */
.services-package-feature-text {
  color: var(--text-primary);
}

/* Services Package Button */
.services-package-button {
  font-weight: 600;
  width: 100%;
  padding: var(--spacing-sm) var(--spacing-xl);
  border-radius: var(--radius-md);
  transition: all var(--transition-normal);
  transform: translateZ(0);
}

.services-package-button:hover {
  transform: scale(1.05);
}

/* Services Support Card */
.services-support-card {
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
}

/* Services Support Title */
.services-support-title {
  font-size: var(--text-xl);
  font-weight: 600;
  text-align: center;
  margin-bottom: var(--spacing-md);
  color: var(--text-primary);
}

/* Services Support Description */
.services-support-description {
  font-size: var(--text-sm);
  text-align: center;
  color: var(--text-secondary);
  margin-bottom: var(--spacing-md);
}

/* Services Support Price */
.services-support-price {
  font-size: var(--text-lg);
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--spacing-md);
  color: var(--text-primary);
}

/* Services Support Features */
.services-support-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-lg);
  text-align: center;
}

/* Services Support Feature Item */
.services-support-feature-item {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Services Support Feature Icon */
.services-support-feature-icon {
  width: 1rem;
  height: 1rem;
  margin-right: var(--spacing-sm);
  flex-shrink: 0;
  color: var(--text-primary);
}

/* Services Support Feature Text */
.services-support-feature-text {
  color: var(--text-primary);
}

/* Services Support Button */
.services-support-button {
  font-weight: 600;
  margin: 0 auto;
  display: block;
  padding: var(--spacing-sm) var(--spacing-xl);
  border-radius: var(--radius-md);
  transition: all var(--transition-normal);
  transform: translateZ(0);
}

.services-support-button:hover {
  transform: scale(1.05);
}

/* Services Consultation Section */
.services-consultation-section {
  padding-top: var(--spacing-xl);
  padding-bottom: var(--spacing-2xl);
  background-color: var(--bg-primary);
}

@media (min-width: 768px) {
  .services-consultation-section {
    padding-bottom: var(--spacing-4xl);
  }
}

/* Services Consultation Container */
.services-consultation-container {
  text-align: center;
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
}

/* Services Consultation Heading */
.services-consultation-heading {
  font-size: var(--text-xl);
  font-weight: 700;
  margin-bottom: var(--spacing-md);
  color: var(--text-primary);
}

@media (min-width: 640px) {
  .services-consultation-heading {
    font-size: var(--text-2xl);
  }
}

/* Services Consultation Description */
.services-consultation-description {
  font-size: var(--text-sm);
  color: var(--text-primary);
  margin-bottom: var(--spacing-xl);
}

/* Services Consultation Button */
.services-consultation-button {
  font-weight: 600;
  padding: var(--spacing-sm) var(--spacing-xl);
  border-radius: var(--radius-md);
  transition: all var(--transition-normal);
  transform: translateZ(0);
}

.services-consultation-button:hover {
  transform: scale(1.05);
}

/* Services Project Consultation Section */
.services-project-consultation-section {
  padding: var(--spacing-2xl) 0;
  background-color: var(--bg-primary);
}

@media (min-width: 768px) {
  .services-project-consultation-section {
    padding: var(--spacing-3xl) 0;
  }
}

/* Services Project Consultation Container */
.services-project-consultation-container {
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  background-color: var(--bg-card);
}

/* Services Project Consultation Heading */
.services-project-consultation-heading {
  font-size: var(--text-xl);
  font-weight: 700;
  margin-bottom: var(--spacing-lg);
  text-align: center;
  color: var(--text-primary);
}

@media (min-width: 640px) {
  .services-project-consultation-heading {
    font-size: var(--text-2xl);
  }
}

/* Services Project Consultation Description */
.services-project-consultation-description {
  font-size: var(--text-sm);
  line-height: 1.6;
  margin-bottom: var(--spacing-xl);
  text-align: center;
  color: var(--text-primary);
}

/* Services Project Consultation Button Container */
.services-project-consultation-button-container {
  display: flex;
  justify-content: center;
}

/* Services Project Consultation Button */
.services-project-consultation-button {
  font-weight: 600;
  padding: var(--spacing-sm) var(--spacing-xl);
  border-radius: var(--radius-md);
  transition: all var(--transition-normal);
  transform: translateZ(0);
}

.services-project-consultation-button:hover {
  transform: scale(1.05);
}

/* Responsive adjustments */
@media (max-width: 640px) {
  .services-page {
    padding-top: var(--spacing-3xl);
  }
  
  .services-partners-container {
    padding: var(--spacing-lg);
  }
  
  .services-partners-heading {
    font-size: var(--text-xl);
    margin-bottom: var(--spacing-lg);
  }
  
  .services-partners-description,
  .services-partners-subdescription {
    font-size: var(--text-base);
  }
  
  .services-partners-grid {
    gap: var(--spacing-lg) var(--spacing-md);
  }
  
  .services-partner-logo {
    width: 8rem;
  }
  
  .services-core-grid {
    grid-template-columns: 1fr;
  }
  
  .services-ai-enterprise-grid {
    grid-template-columns: 1fr;
  }
  
  .services-packages-grid {
    grid-template-columns: 1fr;
  }
  
  .services-cta-card {
    flex-direction: column;
    gap: var(--spacing-sm);
  }
  
  .services-cta-button {
    width: 100%;
  }
}

/* Focus states for accessibility */
.services-core-card:focus,
.services-package-card:focus,
.services-pathfinder-card:focus,
.services-support-card:focus,
.services-cta-button:focus,
.services-pathfinder-button:focus,
.services-package-button:focus,
.services-support-button:focus,
.services-consultation-button:focus,
.services-project-consultation-button:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Animation for sections */
@keyframes servicesFadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.services-partners-section,
.services-core-section,
.services-ai-enterprise-section,
.services-methodology-section,
.services-pricing-section,
.services-consultation-section,
.services-project-consultation-section {
  animation: servicesFadeInUp 0.6s ease-out;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  .services-partners-section,
  .services-core-section,
  .services-ai-enterprise-section,
  .services-methodology-section,
  .services-pricing-section,
  .services-consultation-section,
  .services-project-consultation-section {
    animation: none;
  }
  
  .services-core-card:hover,
  .services-package-card:hover,
  .services-cta-button:hover,
  .services-pathfinder-button:hover,
  .services-package-button:hover,
  .services-support-button:hover,
  .services-consultation-button:hover,
  .services-project-consultation-button:hover {
    transform: none;
  }
}