@layer components {
  /* ===== HERO SECTION * 
COLORS
violet-950 > Base 
indigo-400 > Medium
indigo-300 > Light
indigo-200 > Very Light
===== */
	
	 /* PALE THIN TEXT
   .EXEMPLE P {
    @apply text-base mb-3 leading-relaxed text-gray-500;
  } */
	

  .section-hero {
    @apply bg-white overflow-hidden;
  }

  .trusted-badge {
    @apply inline-flex items-center w-auto gap-2 px-4 py-2 bg-white/80 backdrop-blur-sm border border-gray-200 rounded-full text-sm font-medium text-gray-700 shadow-sm mb-8;
  }

  .trusted-badge i {
    @apply text-green-400 text-[10px] animate-pulse;
  }

.hero-title {
  @apply text-5xl md:text-6xl lg:text-7xl font-bold leading-tight mb-8 tracking-tight text-center 
  bg-gradient-to-r from-[#7255FB] to-[#BDA9F0] bg-clip-text text-transparent;
}

  .hero-subtitle {
    @apply text-xl md:text-xl mb-12 leading-relaxed max-w-4xl mx-auto font-medium text-center;
  }

	
  /* ===== NAVBAR / HEADER ===== */
  .navbar {
    @apply fixed top-0 w-full z-50 bg-white/95 backdrop-blur-sm border-b border-gray-100;
  }

  .navbar-inner {
    @apply max-w-7xl mx-auto px-6 py-4 flex justify-between items-center;
  }

  .nav-left {
    @apply flex items-center gap-8 flex-none;
  }

  .nav-right {
    @apply flex items-center gap-6;
  }

  .logo {
    @apply object-contain h-auto w-auto;
  }

  .nav-links a {
    @apply text-base font-medium text-gray-500 hover:text-gray-900 transition-colors;
  }
	

  .btn-get-started {
    @apply flex items-center gap-3 px-6 py-2.5 border border-gray-800 rounded-full bg-white text-gray-900 font-medium hover:bg-gray-50 transition-colors;
  }

  .btn-get-started .elementor-button,
  .btn-get-started .elementor-button * {
    @apply text-gray-900;
  }

  .btn-get-started .elementor-button {
    @apply inline-flex items-center gap-3 px-6 py-3 border border-gray-800 rounded-full bg-white text-gray-900 font-medium hover:bg-gray-50 transition-colors;
    line-height: 1.5;
    vertical-align: middle;
  }

  .btn-get-started .elementor-button-content-wrapper {
    @apply flex items-center gap-3;
  }

  .btn-get-started .elementor-button-link.elementor-size-sm {
    border-width: 0 !important;
  }

  /* ===== BUTTONS ===== */

  .btn-primary .elementor-button {
     @apply inline-flex items-center justify-center bg-white text-base  px-7 py-3 rounded-full font-semibold
  transition-all
  transform hover:-translate-y-1;
  }

  .btn-secondary .elementor-button {
	  @apply inline-flex items-center justify-center border text-base text-white px-7 py-3 rounded-full font-semibold hover:text-white transition-all transform hover:-translate-y-1;
  }

  /* ===== FEATURES ===== */
  .section-features {
    @apply py-24 bg-gray-50;
  }
	.logo-card-partner {
    @apply p-7;
  }


	
	 .partners-title {
    @apply text-2xl font-medium mb-6 text-center;
  }

  .features-title {
    @apply text-4xl font-bold mb-6 text-center;
  }

  .features-subtitle {
    @apply text-lg max-w-3xl mx-auto leading-relaxed text-center mb-20;
  }

.feature-card {
  @apply relative rounded-3xl flex flex-col p-10 bg-white text-center transition-transform duration-300;
  border: 1px solid #dde2ec;
  
}

  .feature-card h3 {
    @apply text-lg font-semibold text-gray-900;
  }
 
  .feature-card p {
    @apply text-base mb-3 leading-relaxed text-gray-500;
  }

  .feature-card a {
    @apply text-base px-5 py-2.5 rounded-lg border border-gray-300 bg-white text-gray-700 font-medium hover:bg-gray-50 transition-colors;
  }

.icon-wrapper-features {
  @apply flex items-center justify-center w-12 h-12 rounded-lg bg-white shadow mb-4;
}

.icon-wrapper-features i {
  @apply text-2xl leading-none;
}

/* Gradient Border Variant */
.gradient-border {
  @apply inline-flex items-center justify-center p-[2px] rounded-lg bg-gradient-to-b from-[#dde2ec] to-[#dde2ec00] shadow-[0_24px_48px_#0f172a1f];
}

.gradient-border-inner {
  @apply flex items-center justify-center w-12 h-12 rounded-lg bg-white;
}

  .feature-card a,
  .inline-btn {
    @apply inline-flex items-center px-4 py-2 rounded-lg border border-gray-300 bg-white text-gray-700 font-medium text-sm hover:bg-gray-50 transition-colors;
  }
	  /* ===== Feature icon Cards ===== */


  /* ===== Sub-Feature of Features Home ===== */
.sub-feature-list {
  @apply flex flex-col;
}

  .sub-feature-items {
    @apply flex flex-col space-y-2;
  }

  .sub-feature-line-item {
    @apply flex items-start gap-2 text-sm text-gray-800 hover:text-gray-900 transition-colors border-0 bg-transparent p-0 shadow-none;
  }
a.sub-feature-line-item {
  @apply border-none bg-transparent p-0 shadow-none text-sm text-gray-800 flex items-start gap-2;
  text-decoration: none;
}
a.sub-feature-line-item:hover {
  @apply text-gray-900;
}

  .sub-feature-line-item i {
    @apply text-gray-400 text-xs mt-1 w-4;
  }


  /* ===== MODULES SECTION ===== */
.custom-client-flow,   
.custom-commerce,       
.custom-communications, 
.custom-configuration,
.custom-scheduling,     
.custom-staff-flow,      
.custom-workflow { @apply text-[#6366F1] !important; }        


  .modules-section {
    @apply py-24 bg-white;
  }

  .module-card {
    @apply relative rounded-3xl min-h-[320px] flex flex-col p-8 bg-white transition-shadow hover:shadow-lg;
	    border: 1px solid #dde2ec;
  }

  .module-card > .e-con-inner {
    @apply flex flex-col h-full;
  }
	
	.card-arrow-module {
  @apply opacity-60 group-hover:opacity-100 transition-opacity text-gray-500;
}

  .category-label-module {
    @apply text-sm font-medium text-gray-500 mb-1;
  }

.card-title-module {
  @apply text-lg font-semibold text-gray-900 mb-2;
}

  .card-desc p {
    @apply text-base text-gray-700 leading-relaxed mb-6;
  }

  .pill-group {
    @apply mt-auto flex items-center gap-4;
  }

  .card-top-module {
    @apply flex items-start gap-[5px] mb-6;
  }

.icon-wrapper-module {
  @apply flex items-center justify-center w-12 h-12 rounded-lg bg-white shadow mb-4;
}

.icon-wrapper-module i {
  @apply text-2xl leading-none;
}

/* Gradient Border Variant */
.gradient-border {
  @apply inline-flex items-center justify-center p-[2px] rounded-lg bg-gradient-to-b from-[#dde2ec] to-[#dde2ec00] shadow-[0_24px_48px_#0f172a1f];
}

.gradient-border-inner {
  @apply flex items-center justify-center w-12 h-12 rounded-lg bg-white;
}
	


/* === PILLS === */
/* Parent wrapper of the pills */
.pill-group .elementor-shortcode {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.5rem; /* vertical, horizontal gap */
}	
	
.pill-1-models,
.pill-2-models
 {
  @apply inline-flex w-auto items-center gap-2 px-3 py-1.5 rounded-full text-sm font-medium bg-gray-100 text-gray-800;
}

	
  .elementor-element.pill-1-models,
  .elementor-element.pill-2-models {
    @apply inline-flex w-auto items-center space-y-2 px-4 py-1.5 rounded-full;
  }
	

  /* ===== CTA SECTION ===== */
  .section-cta {
    @apply py-24 bg-gray-900 text-center px-6;
  }

  .cta-title {
    @apply text-4xl font-bold text-white mb-8;
  }

  .cta-subtitle {
    @apply text-xl text-gray-300 mb-10 leading-relaxed;
  }

  /* ===== FOOTER ===== */
  .footer-grid {
    @apply grid grid-cols-1 md:grid-cols-4 gap-12;
  }

  .footer-brand {
    @apply text-gray-600 leading-relaxed;
  }

  .footer-col a {
    @apply text-gray-600 hover:text-gray-900 transition-colors;
  }

  .footer-bottom {
    @apply border-t border-gray-100 mt-16 pt-8 text-center text-gray-600;
  }
}