/* ============================================ RÉFÉRENCE COULEURS DU KIT (Elementor) GLOBALES --e-global-color-primary #...... Couleur primaire --e-global-color-secondary #...... Couleur secondaire --e-global-color-text #...... Texte principal --e-global-color-accent #...... Texte secondaire PERSO --e-global-color-...... #...... ...... --e-global-color-...... #...... ...... ============================================ */ /* ============================================ BASE GLOBALE ============================================ */ /* — Rendu texte — */ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* — Typo : retours à la ligne intelligents — */ p { text-wrap: pretty; } h1, h2, h3, h4, h5, h6 { text-wrap: balance; } p, li, h1, h2, h3, h4, h5, h6, a { overflow-wrap: break-word; } /* — Média : jamais de débordement / déformation */ img, svg, video, canvas { max-width: 100%; height: auto; display: block; } /* — Confort / interaction — */ html { scroll-padding-top: 100px; /* = hauteur du header sticky, à ajuster par site */ -webkit-text-size-adjust: 100%; } /* smooth uniquement si l'utilisateur n'a pas demandé à réduire les animations */ @media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } } ::selection { background: var(--e-global-color-primary); color: #fff; } :focus-visible { outline: 2px solid var(--e-global-color-primary); outline-offset: 2px; } /* — Éléments de base — */ a { text-decoration: none; } b, strong, .elementor-inline-editing b { font-weight: 600 !important; } ul, ol { margin-bottom: 15px; } ::marker { color: var(--e-global-color-primary); font-weight: 600; } blockquote { border-left: 3px solid var(--e-global-color-primary); padding-left: 20px; } /* — Classes utilitaires — */ .color-primary { color: var(--e-global-color-primary) !important; } .color-secondary { color: var(--e-global-color-secondary) !important; } .color-accent { color: var(--e-global-color-accent) !important; } .color-text { color: var(--e-global-color-text) !important; } .cq { container-type: inline-size; } .justify { text-align: justify; -webkit-hyphens: auto; hyphens: auto; /* nécessite lang="fr" sur (WP le pose par défaut) */ hyphenate-limit-chars: 6 3 3; /* ne coupe pas les mots < 6 lettres */ } /* ============================================ LAYOUT ============================================ */ .pad-y { padding-top: 120px; padding-bottom: 120px; } .pad-x { padding-left: 32px; padding-right: 32px; } @media (max-width: 1366px) { .pad-y { padding-top: 96px; padding-bottom: 96px; } .pad-x { padding-left: 24px; padding-right: 24px; } } @media (max-width: 1024px) { .pad-y { padding-top: 72px; padding-bottom: 72px; } } @media (max-width: 767px) { .pad-y { padding-top: 56px; padding-bottom: 56px; } .pad-x { padding-left: 16px; padding-right: 16px; } } /* ============================================ ELEMENTOR — DIVERS ============================================ */ .page-header .entry-title { display: none; } .elementor-widget-image a { width: 100%; } .elementor-nav-menu--layout-vertical .elementor-nav-menu .sub-menu { position: relative !important; left: 0 !important; top: 0 !important; display: none; } .elementor-nav-menu--layout-vertical .elementor-nav-menu li:hover > .sub-menu { display: block; width: 100%; } /* ============================================ FORMS ============================================ */ /* — Placeholders — */ ::placeholder { opacity: 1; } .elementor-field-group .elementor-field-textual:focus { box-shadow: none; } /* — Checkbox & Radio : base custom accessible — */ .elementor-field-option input[type="checkbox"], .elementor-field-option input[type="radio"] { position: absolute; opacity: 0; width: 18px; height: 18px; margin: 0; cursor: pointer; } .elementor-field-option input ~ label::before { content: ""; display: inline-flex; position: relative; top: 4px; width: 18px; height: 18px; margin-right: 8px; border: 2px solid var(--e-global-color-primary); background: #fff; box-sizing: border-box; transition: background-color 0.15s ease, box-shadow 0.15s ease; } /* — Radio : rond + point central — */ .elementor-field-option input[type="radio"] ~ label::before { border-radius: 50%; } .elementor-field-option input[type="radio"]:checked ~ label::before { background-color: var(--e-global-color-primary); box-shadow: inset 0 0 0 3px #fff; } /* — Checkbox : carré arrondi + coche blanche — */ .elementor-field-option input[type="checkbox"] ~ label::before { border-radius: 4px; } .elementor-field-option input[type="checkbox"]:checked ~ label::before { background-color: var(--e-global-color-primary); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); background-size: 12px 12px; background-position: center; background-repeat: no-repeat; } .elementor-field-option input:focus-visible ~ label::before { outline: 2px solid var(--e-global-color-primary); outline-offset: 2px; } /* — Acceptance (RGPD) : label inline, petit texte — */ .elementor-field-type-acceptance .elementor-field-option label { font-size: 14px !important; } .elementor-field-type-acceptance .elementor-field-option label::before { min-width: 18px; top: 2px !important; } /* — Select — */ .elementor-field-type-select select { appearance: none; -webkit-appearance: none; padding-left: 12px; padding-right: 36px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important; background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; } .elementor-field-type-select .select-caret-down-wrapper { display: none; } /* base-select : dropdown stylable (Chrome/Edge 2025+), fallback auto sinon */ @supports (appearance: base-select) { .elementor-field-type-select select { appearance: base-select; background-image: none; } .elementor-field-type-select select::picker(select) { border: 1px solid var(--e-global-color-primary); border-radius: 4px; } .elementor-field-type-select select option:checked { background: var(--e-global-color-primary); color: #fff; } } /* — File upload (bouton) — */ .elementor-field-type-upload input[type="file"] { border: 0 !important; } .elementor-field-type-upload input[type="file"]::file-selector-button { background: var(--e-global-color-primary); border: 0; padding: 8px 16px; margin-right: 12px; font-size: 14px; font-weight: 600; color: #fff; border-radius: 4px; cursor: pointer; transition: opacity 0.15s ease; } .elementor-field-type-upload input[type="file"]::file-selector-button:hover { opacity: 0.85; }