.features-modern, .features-grid { background-color: #ffffff; } .features-modern { background: none; } .features-grid { background: none; } .features-title { margin-bottom: 1rem !important; } .features-subtitle { margin-bottom: 3rem !important; color: #666666; } .features-grid, .features-grid-4 { gap: 2rem; } .feature-column { text-align: center; padding: 2rem; transition: transform 0.3s ease; } .feature-column:hover { transform: translateY(-5px); } .feature-icon { width: 64px; height: 64px; margin: 0 auto 1.5rem; } .feature-title { margin-bottom: 1rem !important; color: #333333; } .feature-description { color: #666666; line-height: 1.6; } /* Responsive Design */ @media (max-width: 1024px) { .features-grid .feature-column, .features-grid-4 .feature-column { width: 50% !important; } } @media (max-width: 768px) { .features-grid .feature-column, .features-grid-4 .feature-column { width: 100% !important; } .features-title { font-size: 28px !important; } .feature-title { font-size: 20px !important; } } .features-cards { background: #fff; padding: 80px 40px; } .features-cards-title { margin-bottom: 1rem !important; font-weight: 800; } .features-cards-subtitle { margin-bottom: 3rem !important; color: #666; } .features-cards-grid { display: flex; gap: 2rem; margin-bottom: 2rem; } .feature-card-column { background: #fff; border-radius: 18px; box-shadow: 0 2px 8px rgba(30, 34, 90, 0.04); padding: 2.5rem 1.5rem 2rem 1.5rem; text-align: left; transition: box-shadow 0.2s, transform 0.2s; border: 1px solid #f0f0f0; min-height: 220px; display: flex; flex-direction: column; align-items: flex-start; } .feature-card-column:hover { box-shadow: 0 8px 24px rgba(30, 34, 90, 0.10); transform: translateY(-4px); } /* Pastel backgrounds for each card */ .feature-card-column:nth-child(1) { background: #ffeaea; } .feature-card-column:nth-child(2) { background: #eaf2ff; } .feature-card-column:nth-child(3) { background: #eafaf1; } .feature-card-column:nth-child(4) { background: #fffbe5; } .feature-card-column:nth-child(5) { background: #f3edff; } .feature-card-column:nth-child(6) { background: #fff3e5; } .feature-card-column:nth-child(7) { background: #ffeaf5; } .feature-card-column:nth-child(8) { background: #f4f6f8; } .feature-card-icon { width: 44px; height: 44px; margin-bottom: 1.2rem; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 2rem; } .feature-card-title { font-size: 1.15rem; font-weight: 700; margin-bottom: 0.5rem; color: #222; } .feature-card-description { color: #5a5a5a; font-size: 1rem; line-height: 1.5; } @media (max-width: 1024px) { .features-cards-grid { flex-wrap: wrap; } .feature-card-column { width: 48% !important; margin-bottom: 2rem; } } @media (max-width: 768px) { .features-cards-grid { flex-direction: column; gap: 1.5rem; } .feature-card-column { width: 100% !important; margin-bottom: 0; } .features-cards-title { font-size: 28px !important; } } /* Pastel backgrounds for each card du bloc Why Choose Us */ .features-modern .feature-column:nth-child(1) { background: #ffeaea; border-radius: 18px; } .features-modern .feature-column:nth-child(2) { background: #eaf2ff; border-radius: 18px; } .features-modern .feature-column:nth-child(3) { background: #eafaf1; border-radius: 18px; } /* Accentue le corner radius pour toutes les feature-column du bloc modern */ .features-modern .feature-column { border-radius: 18px; background: #fff; box-shadow: 0 2px 8px rgba(30, 34, 90, 0.04); border: 1px solid #f0f0f0; padding: 2.5rem 1.5rem 2rem 1.5rem; text-align: left; transition: box-shadow 0.2s, transform 0.2s; min-height: 220px; display: flex; flex-direction: column; align-items: flex-start; } .features-modern .feature-column:hover { box-shadow: 0 8px 24px rgba(30, 34, 90, 0.10); transform: translateY(-4px); } .features-grid-4 .feature-column:nth-child(1) { background: #f3edff; border-radius: 18px; } .features-grid-4 .feature-column:nth-child(2) { background: #eafaf1; border-radius: 18px; } .features-grid-4 .feature-column:nth-child(3) { background: #fffbe5; border-radius: 18px; } .features-grid-4 .feature-column:nth-child(4) { background: #eaf2ff; border-radius: 18px; } .features-grid-4 .feature-column { border-radius: 18px; background: #fff; box-shadow: 0 2px 8px rgba(30, 34, 90, 0.04); border: 1px solid #f0f0f0; padding: 2.5rem 1.5rem 2rem 1.5rem; text-align: left; transition: box-shadow 0.2s, transform 0.2s; min-height: 180px; display: flex; flex-direction: column; align-items: flex-start; } .features-grid-4 .feature-column:hover { box-shadow: 0 8px 24px rgba(30, 34, 90, 0.10); transform: translateY(-4px); } /* Ajout pastel pour Customizable (3), Analytics (1) et 24/7 Support (3e colonne features-modern) */ .features-grid-4 .feature-column:nth-child(3) { background: #ffeaf5; border-radius: 18px; } /* Customizable: rose pastel */ .features-grid-4 .feature-column:nth-child(1) { background: #f3edff; border-radius: 18px; } /* Analytics: violet pastel */ .features-modern .feature-column:nth-child(3) { background: #fffbe5; border-radius: 18px; } /* 24/7 Support: jaune pastel */ .feature-easy { background: #ffeaea !important; border-radius: 18px; } .feature-fast { background: #fffbe5 !important; border-radius: 18px; } .feature-support { background: #eafaf1 !important; border-radius: 18px; } .feature-smart-design { background: #f3edff !important; border-radius: 18px; } .feature-secure { background: #ffeaea !important; border-radius: 18px; } .feature-customizable { background: #ffeaf5 !important; border-radius: 18px; } .feature-analytics { background: #eaf2ff !important; border-radius: 18px; }