.elementor-3020 .elementor-element.elementor-element-b3afd28{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-3020 .elementor-element.elementor-element-b3afd28:not(.elementor-motion-effects-element-type-background), .elementor-3020 .elementor-element.elementor-element-b3afd28 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://aphelio.fr/wp-content/uploads/2026/01/fond_contact.jpg");background-repeat:no-repeat;background-size:cover;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3020 .elementor-element.elementor-element-524a741{padding:0px 0px 50px 0px;text-align:center;}.elementor-3020 .elementor-element.elementor-element-524a741 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:35px;font-weight:600;color:#B7EAFF;}/* Start custom CSS for container, class: .elementor-element-b3afd28 *//* ========================================= NINJA FORMS – STYLE IA COMPLET (BLANC + GLASS + BOUTON DEGRADE + REFLET) Scope : uniquement dans .formulaire-ia ========================================= */ /* 1) Texte global : tout en blanc */ .formulaire-ia, .formulaire-ia * { color: #ffffff !important; } /* Conteneurs Ninja Forms : fond transparent */ .formulaire-ia .nf-form-cont, .formulaire-ia .ninja-forms-form-wrap, .formulaire-ia .nf-form-content, .formulaire-ia .nf-field-container, .formulaire-ia .nf-field-element, .formulaire-ia .nf-after-field, .formulaire-ia .nf-form-fields-required, .formulaire-ia .nf-input-limit { background: transparent !important; } /* Labels */ .formulaire-ia label, .formulaire-ia .nf-field-label label { color: #ffffff !important; font-weight: 500 !important; } /* Messages Ninja Forms (erreurs / validation) */ .formulaire-ia .nf-error-msg, .formulaire-ia .nf-help, .formulaire-ia .nf-response-msg, .formulaire-ia .nf-error-field-errors, .formulaire-ia .nf-form-errors, .formulaire-ia .nf-field-description { color: #ffffff !important; } /* ========================================= 2) Champs : glass transparent + texte blanc ========================================= */ .formulaire-ia input[type="text"], .formulaire-ia input[type="email"], .formulaire-ia input[type="tel"], .formulaire-ia input[type="url"], .formulaire-ia input[type="number"], .formulaire-ia textarea, .formulaire-ia select { /* Fond très transparent */ background: rgba(255,255,255,0.15) !important; /* Texte tapé + curseur en blanc */ color: #ffffff !important; caret-color: #ffffff !important; /* Bordure + forme */ border: 1px solid rgba(255,255,255,0.35) !important; border-radius: 10px !important; padding: 12px 14px !important; /* Effet glass */ backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important; /* Lisibilité */ text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important; outline: none !important; box-shadow: none !important; } /* Placeholder */ .formulaire-ia input::placeholder, .formulaire-ia textarea::placeholder { color: rgba(255,255,255,0.60) !important; } /* Focus */ .formulaire-ia input:focus, .formulaire-ia textarea:focus, .formulaire-ia select:focus { border-color: #0380ff !important; box-shadow: 0 0 0 2px rgba(3,128,255,0.22) !important; } /* ========================================= 3) BOUTON SUBMIT : dégradé + reflet garanti (sans ::after, fonctionne sur input submit) ========================================= */ .formulaire-ia .nf-form-cont input[type="submit"], .formulaire-ia .nf-form-cont input[type="button"], .formulaire-ia .nf-form-cont button, .formulaire-ia .nf-form-cont .nf-element[type="button"], .formulaire-ia .nf-form-cont .nf-element[type="submit"] { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 14px 34px !important; font-size: 16px !important; font-weight: 600 !important; line-height: 1 !important; color: #ffffff !important; border: none !important; border-radius: 12px !important; cursor: pointer !important; overflow: hidden !important; text-transform: none !important; /* ✅ 2 backgrounds : dégradé IA + reflet */ background-image: linear-gradient( 90deg, #015CBB, #0380ff, #4dbeff, #0380ff, #015CBB ), linear-gradient( 120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.22) 50%, rgba(255,255,255,0) 100% ) !important; background-size: 300% 300%, 22% 100% !important; /* reflet fin */ background-position: 0% 50%, -120% 0% !important; background-repeat: no-repeat !important; /* ✅ 2 animations : dégradé + reflet */ animation: nfBtnGradient 7s ease infinite, nfShine 4.5s ease-in-out infinite !important; box-shadow: 0 0 10px rgba(3,128,255,0.35), 0 0 26px rgba(1,92,187,0.30) !important; transition: transform 0.2s ease, box-shadow 0.2s ease !important; -webkit-appearance: none !important; appearance: none !important; } /* Hover */ .formulaire-ia .nf-form-cont input[type="submit"]:hover, .formulaire-ia .nf-form-cont input[type="button"]:hover, .formulaire-ia .nf-form-cont button:hover { transform: scale(1.05) !important; box-shadow: 0 0 14px rgba(3,128,255,0.45), 0 0 34px rgba(1,92,187,0.38) !important; } /* Animation du dégradé (1er background) */ @keyframes nfBtnGradient { 0% { background-position: 0% 50%, -120% 0%; } 50% { background-position: 100% 50%, -120% 0%; } 100% { background-position: 0% 50%, -120% 0%; } } /* Animation du reflet (2e background) */ @keyframes nfShine { 0% { background-position: 0% 50%, -120% 0%; } 45% { background-position: 100% 50%, 120% 0%; } 100% { background-position: 100% 50%, 120% 0%; } }/* End custom CSS */