/*
Theme Name: JulienLISS
Description: Thème du site JulienLISS
Author: Julien LISS
Author URI: https://julienliss.fr
Template: astra
Version: 1.0.75
*/
:root { --blank-color: #fff; --off-white: #fff7f4; --primary-color: #f78348; --secondary-color: #f9Af91; --blue-color: #0050aD; --blue-title: #172254; --text-color: #443E60; } /* Barre de défilement personnalisée - Webkit browsers uniquement */ ::-webkit-scrollbar { width: 15px; } /* Couleur de fond de la scrollbar (piste) */ ::-webkit-scrollbar-track { background: var(--secondary-color); } /* Couleur du curseur de défilement */ ::-webkit-scrollbar-thumb { background-color: var(--primary-color); border-radius: 4px; border: 2px solid var(--off-white); padding: 2px; } /* Optionnel : Hover du curseur */ ::-webkit-scrollbar-thumb:hover { background-color: var(--primary-color); } body { background-color: var(--blank-color) !important; font-family: 'Poppins' !important; } a { text-decoration: none !important; } /********************************/ /*            HEADER            */ /********************************/ .site-header { margin: 5px auto 0 auto; width: 85%; } .header-container { display: flex; justify-content: space-between; align-items: center; } .header-container a:first-child { margin-right: auto; } .main-navigation { display: flex; justify-content: flex-end; width: 100%; } .main-navigation-responsive { display: none; } .main-navigation.show-menu { display: flex; /* Affiché lorsqu'il a la classe 'show-menu' */ } .main-navigation ul { display: flex; align-items: center; justify-content: flex-end; list-style: none; margin: 0; padding: 0; } .main-navigation ul li { display: inline-block; position: relative; margin: 0 20px; } /* Conteneur pour la bordure */ .menu-border { position: relative; padding: 14px 10px; background-color: var(--blue-color); } .menu-border:hover { position: relative; background-color: var(--secondary-color); } .main-navigation #services .menu-border { clip-path: polygon(70% 8%, 120% 38%, 80% 78%, 63% 70%, 13% 79%, 0 37%); } .main-navigation #portfolio .menu-border { clip-path: polygon(30% 11%, 100% 28%, 92% 79%, 56% 67%, 0% 80%, 11% 36%); } .main-navigation #about .menu-border { clip-path: polygon(35% 30%, 76% 20%, 110% 82%, 65% 67%, 4% 73%, 12% 18%); } .main-navigation #blog .menu-border { clip-path: polygon(65% 13%, 100% 38%, 83% 79%, 20% 85%, 0% 38%); } /* Bouton Contact */ .main-navigation #contact { background-color: var(--blue-color); border: var(--blue-color) 0.125em solid; border-radius: 0.7em; box-shadow: 0 0 7px 0.125em var(--blue-color); padding: 10px 15px; display: flex; align-items: center; justify-content: center; height: 47px; } .main-navigation #contact:hover { background-color: var(--off-white); border: var(--blue-color) 0.125em solid; box-shadow: 0 0 7px 0.125em var(--blue-color); color: var(--blue-color); } .main-navigation #contact a { color: var(--blank-color); text-transform: uppercase; text-align: center; text-decoration: none; display: block; background-color: transparent; } .main-navigation #contact a:hover { color: var(--blue-color); } /* Styles pour les liens */ .main-navigation ul li a { color: var(--blank-color); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; text-decoration: none; display: block; padding: 15px 20px; background-color: var(--primary-color); clip-path: inherit; /* Hérite du clip-path du conteneur */ } .main-navigation ul li:hover a { background-color: var(--blank-color); transition: all .4s ease; color: var(--primary-color); } /************************/ /*        GLOBAL        */ /************************/ #one-page span:nth-child(1), #one-page span:nth-child(5) { font-size: 0.85em; font-weight: normal; } #one-page span:nth-child(3) { color: var(--primary-color); font-size: 1.20em; } #slogan { font-family: 'Poppins' !important; font-size: 1.3em !important; } /* Effet machine à écrire */ #typewriter { color: var(--blue-title) !important; visibility: hidden; font-size: 1em !important; display: inline-block; animation: blink 0.6s step-end infinite; margin-top: 10px; } #cursor { visibility: hidden; display: inline-block; font-weight: bold; width: 3px; height: 1em; vertical-align: middle; background-color: var(--blue-title); margin-left: 5px; animation: blink 0.6s step-end infinite; position: relative; } @keyframes blink { 50% { background-color: transparent; } } #title-effect { cursor: pointer; background-color: var(--primary-color); box-shadow: -4px 4px 0 0 var(--secondary-color); border-radius: 10px; margin-top: -5px; padding: .15rem 1rem; display: inline-block; transform: rotate(-1deg); transition: transform 0.3s ease; } #title-effect:hover { transform: rotate(1deg); } .white-text { box-shadow: none; font-weight: bold; color: var(--blank-color); border-radius: 5px; padding: .1rem .3rem; } .link-button-contact { background-color: var(--blue-color); border: var(--blue-color) 0.125em solid; border-radius: 0.7em; box-shadow: 0 0 7px 0.125em var(--blue-color) !important; color: #fff; padding: 10px 15px; display: flex; font-weight: bold; align-items: center; letter-spacing: 2px; justify-content: center; text-decoration: none !important; text-transform: uppercase !important; } .link-button-contact { height: 70px; margin: 70px auto 0 auto; width: 500px; } .link-button-contact:hover { background-color: var(--off-white); border: var(--blue-color) 0.125em solid; box-shadow: 0 0 7px 0.125em var(--blue-color); color: var(--blue-color); } .link-button-contact a { color: var(--blank-color); text-transform: uppercase; text-align: center; text-decoration: none; display: block; background-color: transparent; } .link-button-contact a:hover { color: var(--blue-color); } .link-button-services { letter-spacing: 2px !important; } hr { border: none; border-bottom: 2px dashed var(--off-white); } h2, h3, h4 { letter-spacing: 2px; } /* Menus : les problèmes */ #button-services { background-color: var(--primary-color); border: var(--off-white) 0.125em solid; border-radius: 0.7em; box-shadow: 0 0 7px 0.125em var(--off-white); color: var(--blank-color); font-weight: bold; margin: 0 auto; padding: 10px 15px; display: flex; align-items: center; letter-spacing: 1px; text-align: center; justify-content: center; text-decoration: none; text-transform: uppercase; height: 47px; width: 160px; } #button-services:hover { background-color: var(--blank-color); border: 1px solid var(--primary-color); color: var(--primary-color); } /* Tableaux des services */ .elementor-price-table__header { border-radius: 10px; } .elementor-price-table__subheading { display: none; } [data-id="1c94b57"] .elementor-price-table__subheading { display: block; } [data-id="1c94b57"] { margin-top: -50px; } h4 { font-family: 'Poppins' !important; font-size: 1.15em !important; } .elementor-price-table__original-price { color: var(--blue-title) !important; } /* Ajoute €* uniquement au prix actuel et pas au prix barré */ /*.elementor-price-table__integer-part:not(.elementor-price-table__original-price)::after { content: "€*"; }*/ .elementor-price-table__integer-part:not(.elementor-price-table__original-price)::after { content: "€"; } /* Supprime le €* du prix barré */ .elementor-price-table__original-price::after { content: "€"; } /* Supprime le * du prix barré et de la 4ème offre */ .elementor-price-table__original-price::after, [data-id="b0431df"] .elementor-price-table__integer-part::after { content: "€"; } [data-id="1c94b57"] .elementor-price-table__integer-part { color: var(--primary-color) !important; } .elementor-price-table__features-list li { text-align: left; } .elementor-price-table__footer .elementor-price-table__button { text-decoration: none !important; letter-spacing: 1px; text-transform: uppercase; } .elementor-price-table__footer .elementor-price-table__button:hover { background-color: var(--blue-color); } .elementor-price-table__features-list li { font-size: 1rem !important; } /* Offre maintenance */ [data-id="db45ba2"] h3 { font-size: 1.7rem !important; } [data-id="db45ba2"] .elementor-price-table__features-list li { font-size: 1.2rem !important; line-height: 30px !important; } [data-id="db45ba2"] .elementor-price-table__period { font-size: 1.2rem !important; } .offer-link { color: var(--off-white); } .offer-link:hover { color: var(--blank-color); } /* FAQ */ .ha-toggle__wrapper { border: 1px solid var(--blue-color); } /* Titre FAQ Local */ [data-id="cfaef64"] .ha-toggle__item-title-text { font-size: 1.313em !important; } /* Bouton scroll top */ #ast-scroll-top { display: none !important; } .certification { color: var(--blank-color); font-weight: bold; text-decoration: none; } .certification:hover { color: var(--text-color); } /********************************/ /*            FOOTER            */ /********************************/ #site-footer { background-color: var(--blue-title); color: var(--blank-color); padding: 40px 20px 0 20px; margin: 0; margin-top: -64px; } #logo-footer-text { margin-top: 10px; font-size: 0.9em; } .footer-container { display: flex; flex-wrap: wrap; justify-content: space-between; } .footer-column ul { list-style: none; padding: 0; margin: 0; } .footer-column ul li { margin: 0 0 8px 13px; } .footer-column ul li a { font-size: 0.9em; text-decoration: none; color: #ffffff; transition: color 0.3s ease; } .footer-column ul li a:hover { color: #F18E25; /* Orange clair au survol */ } .footer-column h4 { font-size: 0.9em !important; margin-bottom: 10px; color: var(--blank-color) !important; border-left: 4px solid var(--primary-color); border-bottom: 2px solid var(--primary-color); padding: 2px 0 10px 10px; position: relative; } .footer-column h4:first-letter { color: var(--primary-color); font-size: 1.1em; font-weight: bold; } .flex { display: flex; } #ast-scroll-top { background-color: var(--primary-color); border-radius: 50%; } /********************************/ /*        MENU HAMBURGER        */ /********************************/ .menu-toggle { display: none; /* Caché par défaut sur les grands écrans */ background: var(--primary-color); color: var(--blank-color); padding: 10px 15px; font-size: 1.5em; border: none; cursor: pointer; border-radius: 5px; } /* Règles pour les écrans ≤ 1215px */ @media (max-width: 1215px) { .site-header { margin: 5px auto 50px auto; width: 100%; } .header-container { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 10px; } .menu-border { margin: 0 auto; padding: 10px; } .main-navigation { display: none !important; } .main-navigation-responsive { border-radius: 10px; border-top-right-radius: 0; display: none; flex-direction: column; background: var(--primary-color); position: absolute; top: 50px; right: 20px; left: auto; width: 20%; z-index: 1000; padding: 10px; } /* Afficher le menu mobile lorsqu'il est actif */ .main-navigation-responsive.show-menu { display: flex; } /* Bouton menu burger */ .menu-toggle { display: block; position: absolute; right: 20px; top: 8px; background: var(--primary-color); color: var(--blank-color); padding: 10px 15px; font-size: 1.5em; border: 1px solid var(--primary-color); cursor: pointer; border-radius: 5px; z-index: 1001; transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease; /* Transition fluide */ } .menu-toggle:hover { background: var(--secondary-color); color: var(--primary-color); border-color: var(--secondary-color); } .main-navigation-responsive ul { list-style: none; margin: 0; padding: 0; } .main-navigation-responsive a { list-style: none; color: var(--off-white); } #tabServices { flex-direction: column; align-items: center; gap: 15px; /* Réduit l'espacement entre les cartes */ } .service-card { width: 90%; } } /* Règles pour les écrans ≤ 480px */ @media (max-width: 480px) { #one-page span:nth-child(1), #one-page span:nth-child(5) { font-size: 0.8em; font-weight: normal; } #one-page span:nth-child(3) { color: var(--primary-color); font-size: 0.9em; } .link-button-services { margin-top: 0 !important; } .service-card { width: 100%; padding: 15px; } .main-navigation-responsive { width: 30%; } .bulleted-list-problems h3 { font-size: 1.7em !important; } .service-price { height: 65px !important; } .service-card .price { font-size: 1.8em; } .maintenance .service-price { height: 110px !important; } .offer { font-size: 1em; } .offers li { padding: 0 !important; } [data-id="d3b137a"] .elementor-price-table__header h3 { font-size: 1.3em !important; } [data-id="d3b137a"] .elementor-price-table__header span { font-size: 0.75em !important; } .advantage-list { font-size: 1.2em !important; } .subtitle-advantage { font-size: 1.2em !important; width: 95%; } .text-certification { font-size: 1.2em !important; width: 90% !important; margin: 0 auto !important; padding: 0 !important; } .description-wordpress ul { margin: auto !important; width: 90% !important; } .description-wordpress ul li { font-size: 1.2em !important; margin :0; padding: 25px 0; } .why-me ul { margin: 0; } .why-me ul li { font-size: 0.8em !important; } .link-button-contact { width: 300px; font-size: 0.8em !important; } .offer-link { color: var(--off-white); } .offer-link:hover { color: var(--blank-color); } #nf-form-title-3 { font-weight: bold; font-size: 26px; text-align: center; } .foot-text-city p { font-size: 1.2em !important; } .foot-text-city h2 { font-size: 1.8em !important; } .foot-text-city h3 { font-size: 1.6em !important; } .footer-container { padding-top: 20px; } } /* Menus présentation des prestations : site vitrine/one-page/e-commerce */ .prestations-locales { background: #fffdfa; padding: 50px 0; color: #242043; } .prestations-locales .container { max-width: 1000px; margin: 0 auto; padding: 0 20px; text-align: center; } .section-title { font-size: 2.5rem; color: var(--blue-title); margin-bottom: 10px; } .section-intro { margin-bottom: 35px; } .prestations-cards { display: flex; flex-wrap: wrap; gap: 30px; justify-content: center; margin-bottom: 32px; } .card { flex: 1 1 260px; max-width: 310px; min-width: 220px; background: #fbe8db; border-radius: 16px; box-shadow: 0 6px 20px #ebdbcc60; padding: 26px 22px 20px 22px; text-align: left; position: relative; transition: transform 0.2s, box-shadow 0.2s; display: flex; flex-direction: column; align-items: flex-start; } .card:hover { transform: translateY(-7px) scale(1.03); box-shadow: 0 16px 32px #e79051a0; } .card .icon { display: block; margin-bottom: 13px; } .card h4 { font-size: 1.1rem; color: var(--blue-title); margin-bottom: 7px; font-weight: 800; letter-spacing: 0.5px; } .card p { color: var(--blue-title); font-size: 1rem; line-height: 1.52; } .cta-wrapper { margin-top: 10px;} .btn { background: linear-gradient(90deg, var(--primary-color) 40%, #ef4036 100%); color: #fff; padding: 13px 32px; border-radius: 24px; font-weight: 700; letter-spacing: 1px; font-size: 1.05rem; text-decoration: none; box-shadow: 0 2px 6px #cb6d42a1; transition: background 0.22s, transform 0.15s; } .btn:hover { background: linear-gradient(90deg, #ef4036 45%, var(--primary-color) 100%); transform: translateY(-2px) scale(1.028); color: var(--blank-color) } /* Responsive */ @media (max-width:950px) { .prestations-cards { flex-direction: column; align-items: center; gap: 28px;} .card { max-width: 97%; min-width: unset;} } .transition-illustration { display: flex; flex-direction: column; align-items: center; margin-bottom: 10px; } .transition-illustration img { width: 500px; height: auto; margin-bottom: 12px; filter: drop-shadow(0 5px 16px #efd7c4b7); /* effet subtile d'ombre */ } .transition-illustration p { font-size: 1.13rem; color: var(--blue-title); margin: 40px 0 12px 0; font-weight: 500; letter-spacing: 0.03em; } @media (max-width: 700px) { .btn { width: 90vw; /* largeur adaptative */ max-width: 320px; font-size: 1.07rem; white-space: normal; /* permet le retour à la ligne */ padding-left: 0.8em; padding-right: 0.8em; text-align: center; /* centrer le texte même sur deux lignes */ box-sizing: border-box; /* sécurité pour le padding */ } .transition-illustration img { width: 300px; } .transition-illustration p { text-align: center; margin-bottom: 0; } } /* Politique de confidentialité & Mentions légales */ #post-1454, #post-1897 { margin: -50px 0 50px 0 } .page-id-1454 h1, .page-id-1897 h1 { border-bottom: 1px solid var(--blue-color); font-weight: bold; line-height: 2.5em; } .page-id-1454 h2, .page-id-1897 h2 { font-family: 'Poppins' !important; } /* Pages : Béthune - Béthune - Lens */ .bloc-seo { background-color: var(--off-white); border-radius: 10px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1); margin: auto; text-align: center; } .page-id-2095 .elementor-headline-dynamic-text, .page-id-3572 .elementor-headline-dynamic-text, .page-id-3627 .elementor-headline-dynamic-text { font-weight: 900 !important; } .page-id-2095 h2, .page-id-3572 h2, .page-id-3627 h2 { border: 1px solid var(--blue-title); border-radius: 7px; box-shadow: 0px 0px 6px 0px var(--blank-color); padding: 10px !important; background-color: var(--blue-title); } .page-id-2095 h3 span, .page-id-3572 h3 span, .page-id-3627 h3 span { color: var(--blue-title) !important; font-family: "Caveat Brush" !important; font-size: 1.5em !important; } .button-estimate { background-color: var(--primary-color); border: 1px solid var(--off-white); border-radius: 0.7em; box-shadow: 0 0 10px 0.125em var(--off-white) !important; color: var(--blank-color); font-size: 1.2em !important; font-weight: bold; padding: 30px 15px; display: flex; align-items: center; letter-spacing: 1px; text-align: center; justify-content: center; text-decoration: none !important; text-transform: uppercase; height: 47px; width: auto; } .button-estimate:hover { background-color: var(--blank-color); border: 1px solid var(--primary-color); color: var(--primary-color); } .foot-text-city h2 { background-color: var(--blue-color); border: 1px solid var(--blue-color); color: var(--off-white) !important; font-size: 2em; text-align: center; } .foot-text-city hr { border: none; border: 1px solid var(--blue-title); margin-bottom: 30px; } .foot-text-city p { font-size: 1.3em; } .foot-text-city hr { margin-bottom: 30px !important; } /* Certification */ .text-certification { font-size: 1.2em; } .text-certification span { font-size: 1.2em; } /* Liste des avantages */ ul.advantage-list { font-size: 1.2em; } .advantage-list li { font-size: 1.2em !important; list-style: none; margin-bottom: 30px; padding: 30px !important; opacity: 0; transform: translateY(20px); transition: all 0.6s ease-in-out; } .advantage-list li span { font-size: 1.2em !important; } .advantage-list li.visible { opacity: 1; transform: translateY(0); } .advantage-list li:nth-child(1) { transition-delay: 0.2s; } .advantage-list li:nth-child(2) { transition-delay: 0.4s; } .advantage-list li:nth-child(3) { transition-delay: 0.6s; } .advantage-list li:nth-child(4) { transition-delay: 0.8s; } .advantage-list h4 { font-weight: bold; display: inline !important; font-family: 'Poppins' !important; font-size: 1.2em !important; letter-spacing: ormal !important; } .subtitle-advantage { font-size: 1.2em; } /* Formulaire de contact : labels */ .elementor-field-type-checkbox label { margin-bottom: 20px !important; } .elementor-field-type-checkbox label b { font-family: 'Caveat Brush' !important; font-size: 2em !important; letter-spacing: 2px !important; margin-bottom: 50px !important; } /* Liste des problèmes */ .bulleted-list-problems { font-size: 1.1em; } .bulleted-list-problems span { display: block; opacity: 0; transform: translateY(20px); transition: all 0.6s ease-in-out; } .bulleted-list-problems span.visible { opacity: 1; transform: translateY(0); } /* Effet de décalage progressif */ .bulleted-list-problems span:nth-child(1) { transition-delay: 0.2s; } .bulleted-list-problems span:nth-child(2) { transition-delay: 0.4s; } .bulleted-list-problems span:nth-child(3) { transition-delay: 0.6s; } .bulleted-list-problems span:nth-child(4) { transition-delay: 0.8s; } /* Pourquoi utiliser WordPress ? */ .why-wordpress { font-size: 1.1em; } .why-wordpress span { display: block; opacity: 0; transform: translateY(20px); transition: all 0.6s ease-in-out; } .why-wordpress span.visible { opacity: 1; transform: translateY(0); } /* Effet de décalage progressif */ .why-wordpress span:nth-child(1) { transition-delay: 0.2s; } .why-wordpress span:nth-child(2) { transition-delay: 0.4s; } .why-wordpress span:nth-child(3) { transition-delay: 0.6s; } .why-wordpress span:nth-child(4) { transition-delay: 0.8s; } /* Description de WordPress */ .description-wordpress ul { list-style: none; padding: 0; width: 900px; } .description-wordpress li { display: flex; align-items: center; gap: 15px; font-size: 1.2em !important; margin-bottom: 20px; opacity: 0; transform: translateY(20px); transition: all 0.6s ease-in-out; word-wrap: break-word; white-space: normal; } .description-wordpress li.visible { opacity: 1; transform: translateY(0); } .description-wordpress li span { font-size: 1.2em; display: flex; align-items: center; } .description-wordpress li span { font-size: 1.2em; display: flex; align-items: center; } .description-wordpress li div { flex: 1; /* Prend tout l'espace restant */ } .description-wordpress h4 { font-weight: bold; display: inline !important; font-family: 'Poppins' !important; font-size: 1.2em !important; letter-spacing: normal !important; } .description-wordpress strong { font-weight: bold; display: inline !important; } /* Effet de décalage progressif */ .description-wordpress span:nth-child(1) { transition-delay: 0.1s; } .description-wordpress span:nth-child(2) { transition-delay: 0.3s; } .description-wordpress span:nth-child(3) { transition-delay: 0.5s; } .description-wordpress span:nth-child(4) { transition-delay: 0.7s; } .description-wordpress span:nth-child(5) { transition-delay: 0.9s; } .description-wordpress span:nth-child(6) { transition-delay: 1.1s; } .why-me ul, .offers ul { list-style: none; padding: 0; margin: auto; } .why-me li, .offers li { display: flex; align-items: center; gap: 15px; font-size: 1em !important; margin-bottom: 50px; opacity: 0; transform: translateY(20px); transition: all 0.6s ease-in-out; word-wrap: break-word; white-space: normal; } .why-me li.visible, .offers li.visible { opacity: 1; transform: translateY(0); } .why-me li span, .offers li span { font-size: 1em !important; display: flex; align-items: center; } .why-me li div, .offers li div { flex: 1; /* Prend tout l'espace restant */ } .why-me ul li div h4, .offers ul li div h4 { font-weight: bold; display: inline !important; font-family: 'Poppins' !important; font-size: 1em !important; letter-spacing: normal !important; } .why-me strong, .offers strong { font-weight: bold; display: inline !important; } /* Effet de décalage progressif */ .why-me span:nth-child(1), .offers span:nth-child(1) { transition-delay: 0.1s; } .why-me span:nth-child(2), .offers span:nth-child(2) { transition-delay: 0.3s; } .why-me span:nth-child(3), .offers span:nth-child(3) { transition-delay: 0.5s; } .why-me span:nth-child(4), .offers span:nth-child(4) { transition-delay: 0.7s; } .offers span:nth-child(5) { transition-delay: 0.9s; } .why-me, .description-wordpress li { padding: 25px 0; } [data-id="1ec527e"] .elementor-widget-container { font-size: 1.2em !important; } /********************************************/ /*            Page "Maintenance"            */ /********************************************/ .page-id-4501 h1 { font-size: 3em !important; color: var(--blue-title) !important; text-align: center; text-shadow: 2px 2px 0px var(--off-white); } .page-id-4501 h3 { font-size: 2.5em !important; color: var(--blue-title) !important; text-align: center; text-shadow: 2px 2px 0px var(--blue-color); } .page-id-4501 h4 { font-size: 1.5em !important; color: var(--primary-color) !important; text-align: left; font-weight: normal !important; text-shadow: 1px 1px 0px var(--secondary-color); } .page-id-4501 .services-wrapper { max-width: 1200px; margin: auto; padding: 2rem; border-radius: 30px; background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } .page-id-4501 .services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2rem; } .page-id-4501 .services-grid div:hover { transform: translateY(-5px); transition: transform 0.3s ease; } .page-id-4501 .services-grid h2 { color: var(--blue-color); font-size: 1.25rem; margin-bottom: 0.3rem; font-weight: 700; font-family: 'Poppins', sans-serif; } .page-id-4501 .services-grid p { font-size: 1rem; color: #333; margin: 0; line-height: 1.5; font-family: 'Poppins', sans-serif; } .page-id-4501 .maintenance-sections { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; background: linear-gradient(90deg, var(--blue-title), var(--blue-color)); padding: 2rem; border-radius: 20px; color: var(--off-white); font-family: 'Poppins', sans-serif; } .page-id-4501 .maintenance-box h4 { color: var(--primary-color) !important; font-size: 1.1rem !important; margin-bottom: 1rem !important; } .page-id-4501 .maintenance-box ul { padding-left: 1.2rem; list-style-type: disc; } .page-id-4501 .maintenance-box ul li { margin-bottom: 0.8rem; line-height: 1.5; } .page-id-4501 .devis-wrapper { grid-column: 1 / -1; /* s'étend sur toutes les colonnes */ display: flex; justify-content: center; margin-top: 1rem; } .page-id-4501 .devis-btn { background-color: var(--primary-color); border: var(--off-white) 0.125em solid; border-radius: 0.7em; box-shadow: 0 0 7px 0.125em #FDE6DB; color: var(--blank-color); font-weight: bold; margin: 0 auto; padding: 10px 15px; display: flex; align-items: center; letter-spacing: 1px; text-align: center; justify-content: center; text-decoration: none; text-transform: uppercase; height: 47px; width: auto; } .page-id-4501 .devis-btn:hover { background-color: var(--blank-color); border: 1px solid var(--primary-color); color: var(--primary-color); } .page-id-4501 .confiance { margin-top: 1.5rem; font-weight: bold; text-align: left; } .page-id-4501 .price-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; padding: 2rem; font-family: 'Poppins', sans-serif; align-items: stretch; } .page-id-4501 .price-card { background-color: #f9f9f9; border-radius: 25px; box-shadow: 0 5px 25px rgba(0, 0, 0, 0.05); display: flex; flex-direction: column; padding: 10px; text-align: center; min-height: 100%; box-shadow: 0 0 7px 0.125em var(--off-white); } .page-id-4501 .price-card h4 { background-color: var(--blue-title); color: var(--off-white) !important; padding: 0.8rem; border-radius: 14px; font-size: 1.25em !important; text-transform: uppercase; text-align: center; margin: 0 auto 20px auto; width: 100%; } .page-id-4501 .price-card ul { list-style-type: disc; text-align: left; padding-left: 1.2rem; margin: 0 0 1rem; color: var(--text-color); font-size: 0.95rem; } .page-id-4501 .price-card ul li { margin-bottom: 0.5rem; } .page-id-4501 .price-footer { margin-top: auto; text-align: center; padding-top: 1rem; } .page-id-4501 .price { font-size: 1.8rem; color: var(--blue-title); font-weight: bold; margin: 0; } /********/ /* BLOG */ /********/ .breadcrumb { text-align: center !important; } /* Cibler les pages de blog */ .single-post h1, .blog h1, .archive h1, .category h1, .tag h1 { text-align: center !important; font-family: 'Poppins' !important; font-size: 3em !important; } .single-post h2, .blog h2, .archive h2, .category h2, .tag h2 { font-family: 'Poppins' !important; font-size: 2.5em !important; } .single-post h3, .blog h3, .archive h3, .category h3, .tag h3 { font-family: 'Poppins' !important; font-size: 2em !important; } .single-post h4, .blog h4, .archive h4, .category h4, .tag h4 { font-family: 'Poppins' !important; font-size: 1.5em !important; } /* Personnalisation supplémentaire pour les titres dans les articles */ .single-post .entry-title { font-family: 'Poppins' !important; } /* Ne pas afficher les boutons de partage social sur les autres pages autres que les articles */ body:not(.single) .a2a_floating_style { display: none !important; } /* Ne pas afficher "Posté par" */ .entry-meta { display: none !important; } /* Marges sur /blog/ */ .blog .ast-container { padding-left: 32px; padding-right: 32px; } /* Version typique Astra */ .blog .content-area { padding-left: 50px; padding-right: 50px; } /* Variante souvent utilisée */ .blog .site-main { padding-left: 50px; padding-right: 50px; } /* Pour toutes les pages de blog/archives/articles */ .archive .content-area, .archive .site-main { padding-left: 50px; padding-right: 50px; } /* Changer la couleur des boutons de la section "Contact" */ [data-id="bfecb3f"] a { color: var(--blue-title) !important; font-weight: 900; } [data-id="1311e5b"] a { color: var(--blank-color) !important; }