.elementor-kit-6{--e-global-color-primary:#007D93;--e-global-color-secondary:#277171;--e-global-color-text:#000000;--e-global-color-accent:#25585C;--e-global-color-1176b89:#F5F7F8;--e-global-color-6d49674:#EDF1F3;--e-global-color-ab8763c:#4A4A5A;--e-global-color-40d53e5:#7A7A8A;--e-global-color-48d71d9:#494ED5;--e-global-color-7b1354d:#1BA244;--e-global-color-aaf66ce:#DD9C3B;--e-global-color-b79b44f:#FF5C00;--e-global-color-fe20f9e:#CB32A6;--e-global-color-f3d1d25:#234A4F;--e-global-color-de15ec2:#A6BBBF;--e-global-color-f27fb3a:#000000;--e-global-color-1c2b4f1:#FFFFFF;--e-global-color-d69022d:#D92D20;--e-global-color-e98882c:#0F2050;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-size:18px;--e-global-typography-primary-font-weight:400;--e-global-typography-primary-line-height:120%;--e-global-typography-primary-letter-spacing:-0.5px;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-size:18px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-line-height:120%;--e-global-typography-secondary-letter-spacing:-0.5px;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:120%;--e-global-typography-text-letter-spacing:-0.5px;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-weight:500;color:#000000;font-family:"Inter", Sans-serif;font-size:18px;line-height:120%;letter-spacing:-0.5px;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 a{color:var( --e-global-color-text );text-decoration:underline;}.elementor-kit-6 a:hover{text-decoration:none;}.elementor-kit-6 h1{font-size:80px;font-weight:500;line-height:120%;letter-spacing:-4px;}.elementor-kit-6 h2{font-size:70px;font-weight:500;line-height:100%;letter-spacing:-2px;}.elementor-kit-6 h3{font-size:40px;line-height:100%;letter-spacing:-2px;}.elementor-kit-6 h4{font-size:26px;font-weight:500;line-height:120%;letter-spacing:-1px;}.elementor-kit-6 h5{font-size:24px;font-weight:500;line-height:120%;letter-spacing:-1px;}.elementor-kit-6 h6{font-size:22px;font-weight:500;line-height:120%;letter-spacing:-0.5px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1440px;}.e-con{--container-max-width:1440px;--container-default-padding-top:0px;--container-default-padding-right:20px;--container-default-padding-bottom:0px;--container-default-padding-left:20px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6 h2{font-size:34px;line-height:115%;letter-spacing:-1px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --vcolor-vert:#1BA244; --vcolor-jaune:#DD9C3B; --vcolor-orange:#FF5C00; --vcolor-rose:#CB32A6; --vcolor-bleu:#494ED5; --vcolor-bleu-lagon:#007D93; --vcolor-ceden:#007D93; --vcolor-ceden-accent:#25585C; --vcolor-vert-10:#1BA2441a; --vcolor-vert-15:#1BA24426; --vcolor-jaune-10:#DD9C3B1a; --vcolor-jaune-15:#DD9C3B26; --vcolor-orange-10:#FF5C001a; --vcolor-orange-15:#FF5C0026; --vcolor-rose-10:#CB32A61a; --vcolor-rose-15:#CB32A626; --vcolor-bleu-10:#494ED51a; --vcolor-bleu-15:#494ED526; --vcolor-ceden-10:#007D931a; --vcolor-ceden-15:#007D9326; } /* Start custom CSS */:root { --vcolor-vert: #1BA244; --vcolor-jaune: #DD9C3B; --vcolor-orange: #FF5C00; --vcolor-rose: #CB32A6; --vcolor-bleu: #494ED5; --vcolor-bleu-lagon: #007D93; --vcolor-ceden: #007D93; --vcolor-accent: #25585C; --vc-cta: #D92D20; --vc-cta-hover: #B21E14; --vcolor-ceden-light: #E9F1F4; /* Neutres du template */ --v-text: #1F2A2E; --v-text-invert: #FFFFFF; --v-radius: 12px; } .v-theme-vert { --vc: #1BA244; --vc-5: #1BA2440d; --vc-10: #1BA2441a; --vc-15: #1BA24426; --vc-30: #1BA2444d; --vc-accent: #148036; } .v-theme-jaune { --vc: #DD9C3B; --vc-5: #DD9C3B0d; --vc-10: #DD9C3B1a; --vc-15: #DD9C3B26; --vc-30: #DD9C3B4d; --vc-accent: #A6712A; } .v-theme-orange { --vc: #FF5C00; --vc-5: #FF5C000d; --vc-10: #FF5C001a; --vc-15: #FF5C0026; --vc-30: #FF5C004d; --vc-accent: #C24600; } .v-theme-rose { --vc: #CB32A6; --vc-5: #CB32A60d; --vc-10: #CB32A61a; --vc-15: #CB32A626; --vc-30: #CB32A64d; --vc-accent: #9A247E; } .v-theme-bleu { --vc: #494ED5; --vc-5: #494ED50d; --vc-10: #494ED51a; --vc-15: #494ED526; --vc-30: #494ED54d; --vc-accent: #343899; } .v-theme-bleu-lagon, .v-theme-ceden { --vc: #007D93; --vc-5: #007D930d; --vc-10: #007D931a; --vc-15: #007D9326; --vc-30: #007D934d; --vc-accent: #25585C; --vcolor-ceden-light: #E9F1F4; } /* Fallback : si aucune classe de thème n'est posée, on part sur ceden */ .v-bg-5 { background-color: var(--vc-5); } .v-bg-10 { background-color: var(--vc-10); } .v-bg-15 { background-color: var(--vc-15); } .v-bg-full { background-color: var(--vc); color: var(--v-text-invert); } .v-color { color: var(--vc); } .v-color svg, .v-color svg path{ color: var(--vc); fill: var(--vc); stroke: var(--vc); } .v-color-accent { color: var(--vc-accent); } .v-border { border: 1px solid var(--vc-30); } .v-border-top { border-top: 1px solid var(--vc-30); } .v-border-left{ border-left: 4px solid var(--vc); } .v-title { color: var(--vc) !important; } .v-title a{ color: var(--vc) !important; text-decoration: none; } /* ========================================================================== BOUTONS CTA ========================================================================== */ /* Ciel Eden — Boutons Elementor natifs (le ) Par défaut le bouton prend la couleur de sa thématique (--vc). Deux classes au choix forcent une couleur qui tranche : « cta-primaire » et « cta-secondaire ». À coller dans la même feuille que les blocs .v-theme-*. */ /* ======================================================================== 1) DÉFAUTS de tous les boutons — couleur = celle de la thématique (--vc) Le bouton lit la variable interne --btn (surchargée par les classes ci-dessous). Préfixe « body » = bat les défauts Elementor, mais perd face au widget. ======================================================================== */ body .elementor-button { --btn: var(--vc, #007D93); /* couleur de la thématique (défaut ceden) */ --btn-hover: var(--vc-accent, #25585C); /* teinte foncée pour le survol */ background-color: var(--btn); color: #fff; font-size: 18px; /* surchargeable : Style → Typographie */ font-weight: 600; line-height: 1.2; /* 120% — surchargeable : Style → Typographie */ letter-spacing: -0.5px; /* surchargeable : Style → Typographie */ text-transform: uppercase; /* surchargeable : Style → Typographie → Transformer */ border: 2px solid transparent; /* invisible ; garde la géométrie */ border-radius: 20px; padding: 16px 44px; text-decoration: none; transition: background-color .18s ease, border-color .18s ease, transform .08s ease; } /* Survol — teinte plus foncée + le bouton s'ENFONCE (descend) */ body .elementor-button:hover { background-color: var(--btn-hover); color: #fff; transform: translateY(2px); } /* Focus clavier visible (accessibilité) — sans enfoncement */ body .elementor-button:focus { background-color: var(--btn-hover); color: #fff; } body .elementor-button:focus-visible { outline: 3px solid var(--btn); outline-offset: 3px; } /* ======================================================================== 2) COULEURS AU CHOIX — poser la classe sur le widget (Avancé → CSS Classes). Elles ne font que redéfinir --btn / --btn-hover → tout le reste suit. ======================================================================== */ /* CTA primaire (rouge) */ .cta-primaire .elementor-button, .elementor-button.cta-primaire { --btn: #D92D20; --btn-hover: #B21E14; } /* CTA secondaire (bleu nuit) — volontairement très foncé pour trancher avec le bleu vif des pages .v-theme-bleu (qu'on ne touche pas). */ .cta-secondaire .elementor-button, .elementor-button.cta-secondaire { --btn: #0F2050; --btn-hover: #0A1740; } /* ======================================================================== 3) TAILLE — classe « cta-big » : bouton plus grand ======================================================================== */ .cta-big .elementor-button, .elementor-button.cta-big { padding: 25px 55px !important; font-size: 18px !important; } /* ======================================================================== 4) Adaptation mobile (≤ 767px) — on resserre le padding ======================================================================== */ @media (max-width: 767px) { body .elementor-button { padding: 14px 30px; } .cta-big .elementor-button, .elementor-button.cta-big { padding: 18px 34px !important; } } /* ======================================================================== 5) SECONDAIRE « fantôme » — classe « btn-ghost » : fond blanc, texte + bordure de la couleur active (thème, rouge ou bleu selon les classes). Au survol : se remplit et s'enfonce comme les autres. ======================================================================== */ .btn-ghost .elementor-button, .elementor-button.btn-ghost { background-color: #fff; color: var(--btn); border: 2px solid var(--btn); } .btn-ghost .elementor-button:hover, .btn-ghost .elementor-button:focus, .elementor-button.btn-ghost:hover, .elementor-button.btn-ghost:focus { background-color: var(--btn-hover); color: #fff; border-color: var(--btn-hover); transform: translateY(2px); } /* ========================================================================== TABLEAUX — auto-thématisés dès qu'un ancêtre porte une classe v-theme-* ========================================================================== */ [class*="v-theme-"] table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--vc-30); border-radius: var(--v-radius); overflow: hidden; font-size: 1rem; color: var(--v-text); } [class*="v-theme-"] table thead th { background-color: var(--vc); color: var(--v-text-invert); font-weight: 700; text-align: left; padding: 1rem 1.25rem; border: 0; } [class*="v-theme-"] table tbody td { padding: 1rem 1.25rem; border-top: 1px solid var(--vc-30); vertical-align: middle; } [class*="v-theme-"] table tbody td:first-child { font-weight: 700; border-right: 1px solid var(--vc-30); } [class*="v-theme-"] table thead th + th, [class*="v-theme-"] table tbody td + td + td { border-left: 1px solid var(--vc-30); } /* Modificateurs : ils restent des classes, posées sur la table */ [class*="v-theme-"] table.is-zebra tbody tr:nth-child(even) td { background-color: var(--vc-10); } [class*="v-theme-"] table.is-hover tbody tr:hover td { background-color: var(--vc-15); } /* Échappatoire : ne pas styler une table technique */ [class*="v-theme-"] table.no-theme { all: revert; } /* ========================================================================== 6. LISTES À PUCES AVEC PICTO (cf. image 4) Picto : couleur du thème · fond du picto : 15% ========================================================================== */ .v-list ul { list-style: none; margin: 25px 0 25px 0; padding: 0; display: flex; flex-direction: column; } .v-list li { list-style: none; position: relative; padding-left: 2.2rem; padding-bottom: 1rem; color: var(--v-text); } .v-list li::before { content: ""; position: absolute; left: 0; top: -.1rem; width: 1.5rem; height: 1.5rem; border-radius: 50%; background-color: var(--vc-15); /* Le glyphe est un masque : il prend donc la couleur du thème */ background-image: none; box-shadow: none; } .v-list li::after { content: ""; position: absolute; left: 0; top: -.1rem; width: 1.5rem; height: 1.5rem; background-color: var(--vc); -webkit-mask: var(--v-icon) center / .875rem .875rem no-repeat; mask: var(--v-icon) center / .875rem .875rem no-repeat; } /* Icône par défaut : check */ .v-list { --v-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); } /* Variantes d'icône : il suffit de redéfinir --v-icon */ .v-list--arrow { --v-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E"); } .v-list--plus { --v-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E"); } .v-list--dot { --v-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='6' fill='%23000'/%3E%3C/svg%3E"); } /* Picto plein (fond = couleur, glyphe = blanc) */ .v-list--solid li::before { background-color: var(--vc); } .v-list--solid li::after { background-color: var(--v-text-invert); } /* Liste numérotée thématisée */ .v-list--num { counter-reset: v-num; } .v-list--num li::after { content: none; } .v-list--num li::before { content: counter(v-num); counter-increment: v-num; display: grid; place-items: center; font-size: .8125rem; font-weight: 700; color: var(--vc); background-color: var(--vc-15); } .list-0 ul{ padding: 0; margin: 0; } .list-0 ul li:last-child{ padding-top: 0; padding-bottom: 0; } header{ z-index: 100 !important; } /* LAYER NAVIGATION */ .layerNav{ width: 1200px !important; margin: auto; padding: 0; background: none; } .layerNav a{ color: var(--e-global-color-text); margin: auto; } /* FOOTER */ .footer_page, .footer_page a, .footer_page a:hover{ color: #FFF; } /* ADD ARROW IN TEXT */ .text-arrow { display: inline-flex; align-items: center; } .text-arrow::after { content: " →"; margin-left: 0px; display: inline; /*transition: transform 0.3s ease;*/ } .text-arrow:hover::after { /*transform: translateX(5px);*/ } .fit-content { width: fit-content !important; height: fit-content !important; box-sizing: content-box !important; } .elementor-widget-button{ z-index: 2; } .elementor-widget-button a.elementor-button{ text-decoration: none; font-weight: 500 !important; } /* BT */ .bt_arrow .elementor-button-icon svg { height: unset; width: unset; } /* ======================================== SPACING UTILITIES - Système Tailwind-like ======================================== */ /* MARGIN - Toutes directions */ .m-0 { margin: 0 !important; } .m-1 { margin: 0.25rem !important; } /* 4px */ .m-2 { margin: 0.5rem !important; } /* 8px */ .m-3 { margin: 0.75rem !important; } /* 12px */ .m-4 { margin: 1rem !important; } /* 16px */ .m-5 { margin: 1.25rem !important; } /* 20px */ .m-6 { margin: 1.5rem !important; } /* 24px */ .m-8 { margin: 2rem !important; } /* 32px */ .m-10 { margin: 2.5rem !important; } /* 40px */ .m-12 { margin: 3rem !important; } /* 48px */ .m-16 { margin: 4rem !important; } /* 64px */ /* MARGIN TOP */ .mt-0 { margin-top: 0 !important; } .mt-1 { margin-top: 0.25rem !important; } .mt-2 { margin-top: 0.5rem !important; } .mt-3 { margin-top: 0.75rem !important; } .mt-4 { margin-top: 1rem !important; } .mt-5 { margin-top: 1.25rem !important; } .mt-6 { margin-top: 1.5rem !important; } .mt-8 { margin-top: 2rem !important; } .mt-10 { margin-top: 2.5rem !important; } .mt-12 { margin-top: 3rem !important; } .mt-16 { margin-top: 4rem !important; } /* MARGIN BOTTOM */ .mb-0 { margin-bottom: 0 !important; } .mb-1 { margin-bottom: 0.25rem !important; } .mb-2 { margin-bottom: 0.5rem !important; } .mb-3 { margin-bottom: 0.75rem !important; } .mb-4 { margin-bottom: 1rem !important; } .mb-5 { margin-bottom: 1.25rem !important; } .mb-6 { margin-bottom: 1.5rem !important; } .mb-8 { margin-bottom: 2rem !important; } .mb-10 { margin-bottom: 2.5rem !important; } .mb-12 { margin-bottom: 3rem !important; } .mb-16 { margin-bottom: 4rem !important; } /* MARGIN LEFT */ .ml-0 { margin-left: 0 !important; } .ml-1 { margin-left: 0.25rem !important; } .ml-2 { margin-left: 0.5rem !important; } .ml-3 { margin-left: 0.75rem !important; } .ml-4 { margin-left: 1rem !important; } .ml-5 { margin-left: 1.25rem !important; } .ml-6 { margin-left: 1.5rem !important; } .ml-8 { margin-left: 2rem !important; } /* MARGIN RIGHT */ .mr-0 { margin-right: 0 !important; } .mr-1 { margin-right: 0.25rem !important; } .mr-2 { margin-right: 0.5rem !important; } .mr-3 { margin-right: 0.75rem !important; } .mr-4 { margin-right: 1rem !important; } .mr-5 { margin-right: 1.25rem !important; } .mr-6 { margin-right: 1.5rem !important; } .mr-8 { margin-right: 2rem !important; } /* MARGIN HORIZONTAL (gauche + droite) */ .mx-0 { margin-left: 0 !important; margin-right: 0 !important; } .mx-1 { margin-left: 0.25rem !important; margin-right: 0.25rem !important; } .mx-2 { margin-left: 0.5rem !important; margin-right: 0.5rem !important; } .mx-4 { margin-left: 1rem !important; margin-right: 1rem !important; } .mx-6 { margin-left: 1.5rem !important; margin-right: 1.5rem !important; } .mx-8 { margin-left: 2rem !important; margin-right: 2rem !important; } .mx-auto { margin-left: auto !important; margin-right: auto !important; } /* MARGIN VERTICAL (haut + bas) */ .my-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .my-1 { margin-top: 0.25rem !important; margin-bottom: 0.25rem !important; } .my-2 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; } .my-4 { margin-top: 1rem !important; margin-bottom: 1rem !important; } .my-6 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .my-8 { margin-top: 2rem !important; margin-bottom: 2rem !important; } .my-12 { margin-top: 3rem !important; margin-bottom: 3rem !important; } /* PADDING - Toutes directions */ .p-0 { padding: 0 !important; } .p-0 p { margin-block-end: 0 !important; } .p-1 { padding: 0.25rem !important; } .p-2 { padding: 0.5rem !important; } .p-3 { padding: 0.75rem !important; } .p-4 { padding: 1rem !important; } .p-5 { padding: 1.25rem !important; } .p-6 { padding: 1.5rem !important; } .p-8 { padding: 2rem !important; } .p-10 { padding: 2.5rem !important; } .p-12 { padding: 3rem !important; } .p-16 { padding: 4rem !important; } /* PADDING TOP */ .pt-0 { padding-top: 0 !important; } .pt-1 { padding-top: 0.25rem !important; } .pt-2 { padding-top: 0.5rem !important; } .pt-3 { padding-top: 0.75rem !important; } .pt-4 { padding-top: 1rem !important; } .pt-5 { padding-top: 1.25rem !important; } .pt-6 { padding-top: 1.5rem !important; } .pt-8 { padding-top: 2rem !important; } .pt-10 { padding-top: 2.5rem !important; } .pt-12 { padding-top: 3rem !important; } .pt-16 { padding-top: 4rem !important; } /* PADDING BOTTOM */ .pb-0 { padding-bottom: 0 !important; } .pb-1 { padding-bottom: 0.25rem !important; } .pb-2 { padding-bottom: 0.5rem !important; } .pb-3 { padding-bottom: 0.75rem !important; } .pb-4 { padding-bottom: 1rem !important; } .pb-5 { padding-bottom: 1.25rem !important; } .pb-6 { padding-bottom: 1.5rem !important; } .pb-8 { padding-bottom: 2rem !important; } .pb-10 { padding-bottom: 2.5rem !important; } .pb-12 { padding-bottom: 3rem !important; } .pb-16 { padding-bottom: 4rem !important; } /* PADDING LEFT */ .pl-0 { padding-left: 0 !important; } .pl-1 { padding-left: 0.25rem !important; } .pl-2 { padding-left: 0.5rem !important; } .pl-3 { padding-left: 0.75rem !important; } .pl-4 { padding-left: 1rem !important; } .pl-5 { padding-left: 1.25rem !important; } .pl-6 { padding-left: 1.5rem !important; } .pl-8 { padding-left: 2rem !important; } /* PADDING RIGHT */ .pr-0 { padding-right: 0 !important; } .pr-1 { padding-right: 0.25rem !important; } .pr-2 { padding-right: 0.5rem !important; } .pr-3 { padding-right: 0.75rem !important; } .pr-4 { padding-right: 1rem !important; } .pr-5 { padding-right: 1.25rem !important; } .pr-6 { padding-right: 1.5rem !important; } .pr-8 { padding-right: 2rem !important; } /* PADDING HORIZONTAL */ .px-0 { padding-left: 0 !important; padding-right: 0 !important; } .px-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; } .px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; } .px-4 { padding-left: 1rem !important; padding-right: 1rem !important; } .px-6 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; } .px-8 { padding-left: 2rem !important; padding-right: 2rem !important; } /* PADDING VERTICAL */ .py-0 { padding-top: 0 !important; padding-bottom: 0 !important; } .py-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; } .py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; } .py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; } .py-6 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; } .py-8 { padding-top: 2rem !important; padding-bottom: 2rem !important; } .py-12 { padding-top: 3rem !important; padding-bottom: 3rem !important; } /* CORNER IMAGE BIG */ .corner_right{ background: white; border-top-left-radius: 20px; width: 100%; height: 100%; position: absolute; bottom: 0; right: 0; } /* on crée un calque */ .corner_right::after { content: ""; position: absolute; background: white; right: 0; top: -20px; width: 20px; height: 20px; -webkit-mask: radial-gradient( circle 20px at 0 100%, transparent 19px, black 20px ); mask: radial-gradient( circle 20px at 100% 100%, transparent 19px, black 20px ); transform: rotate(180deg); } .corner_right::before { content: ""; position: absolute; background: white; left: -20px; top: initial; bottom: 0; width: 20px; height: 20px; -webkit-mask: radial-gradient( circle 20px at 0 100%, transparent 19px, black 20px ); mask: radial-gradient( circle 20px at 100% 100%, transparent 19px, black 20px ); transform: rotate(180deg); } .corner_left{ background: white; border-bottom-right-radius: 20px; width: 100%; height: 100%; padding: 0; position: absolute; top: 0; left: 0; } /* on crée un calque */ .corner_left::after { content: ""; position: absolute; background: white; right: -20px; top: 0; width: 20px; height: 20px; -webkit-mask: radial-gradient( circle 20px at 0 100%, transparent 19px, black 20px ); mask: radial-gradient( circle 20px at 100% 100%, transparent 19px, black 20px ); transform: rotate(0deg); } .corner_left::before { content: ""; position: absolute; background: white; left: 0; top: initial; bottom: -20px; width: 20px; height: 20px; -webkit-mask: radial-gradient( circle 20px at 0 100%, transparent 19px, black 20px ); mask: radial-gradient( circle 20px at 100% 100%, transparent 19px, black 20px ); transform: rotate(0deg); } .v-theme-active .corner_right, .v-theme-active .corner_right::after, .v-theme-active .corner_right::before, .v-theme-active .corner_left, .v-theme-active .corner_left::after, .v-theme-active .corner_left::before {background: var(--vcolor-ceden-light) !important} .c-card .corner_right, .c-card .corner_right::after, .c-card .corner_right::before, .c-card .corner_left, .c-card .corner_left::after, .c-card .corner_left::before, .c-cta .corner_right, .c-cta .corner_right::after, .c-cta .corner_right::before, .c-cta .corner_left, .c-cta .corner_left::after, .c-cta .corner_left::before, .c-article-image .corner_right, .c-article-image .corner_right::after, .c-article-image .corner_right::before, .c-article-image .corner_left, .c-article-image .corner_left::after, .c-article-image .corner_left::before, .c-corner-white .corner_right, .c-corner-white .corner_right::after, .c-corner-white .corner_right::before, .c-corner-white .corner_left, .c-corner-white .corner_left::after, .c-corner-white .corner_left::before {background: white;} .c-cta .corner_right, .c-cta .corner_left { width: 50px; height: 50px; } :is(.elementor-widget-text-editor) > *:last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* ====================================================== Bloc de boutons de maillage ====================================================== */ .bts-maillage ul{ display: flex; row-gap: 10px; } .bts-maillage a{ display: inline-block ; background: none; color: var(--vcolor-accent) !important; border: 1px solid var(--vcolor-accent); padding: 8px 20px; text-decoration: none; border-radius: 100px; } .bts-maillage a:hover{ background: var(--vcolor-accent) !important; color: white !important; } .bclick { cursor: pointer; } /* ========================================================================== TEXTE AVEC FLÈCHE ↗ — .bt-arrow La flèche bouge au survol du bloc parent ========================================================================== */ .bt-arrow { --v-arrow: 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.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='6' y1='18' x2='18' y2='6'/%3E%3Cpolyline points='9 6 18 6 18 15'/%3E%3C/svg%3E"); display: flex; align-items: center; gap: .5em; color: var(--v-text, #1F2A2E); font-weight: 500; text-decoration: none; cursor: pointer; } .bt-arrow::after { content: ""; flex: none; width: .7em; height: .7em; background-color: currentColor; -webkit-mask: var(--v-arrow) center / contain no-repeat; mask: var(--v-arrow) center / contain no-repeat; transition: transform .25s cubic-bezier(.4, 0, .2, 1); } /* --- Le mouvement, déclenché par le PARENT ------------------------------- */ .bclick:hover .bt-arrow::after, .bclick.is-focused .bt-arrow::after, .has-arrow:hover .bt-arrow::after, .bt-arrow:hover::after, .bt-arrow:focus-visible::after { transform: translate(.2em, -.2em); } /* Couleur au survol (optionnel) */ .bclick:hover .bt-arrow, .has-arrow:hover .bt-arrow { color: var(--vc, #007D93) !important; } @media (prefers-reduced-motion: reduce) { .bt-arrow::after { transition: none; } .bclick:hover .bt-arrow::after, .has-arrow:hover .bt-arrow::after { transform: none; } } /* ========================================================================== Dernier élément d'un text-editor : aucun espace en bas ========================================================================== */ /* 1. Dernier enfant direct — couvre

,