/* ==========================================================================
   MISTER IT — BASE COMMUNE (chargée sur toutes les pages)
   Thème enfant « Mister IT » · v1.0.0 · 01/10/2026
   Remplace hello-elementor/assets/css/mit-site.css.

   Tous les sélecteurs commencent par « .elementor .mit-site » : ils ne touchent
   que le conteneur Elementor qui porte la classe mit-site.

   ⚠ L'ordre des sections compte : certaines règles de même spécificité se
   remplacent l'une l'autre (signalé par « ORDRE » dans les commentaires).

   Sommaire
     1. Variables
     2. Adaptation Elementor et remise à zéro
     3. Typographie
     4. Mise en page
     5. En-tête (pré-header, logo, navigation)
     6. Boutons
     7. Composants
     8. Pied de page
     9. Accessibilité
    10. Ajustements de l'accueil (ORDRE)
    11. Pages légales (cookies, confidentialité)
    12. Responsive
   ========================================================================== */


/* 1. VARIABLES
   -------------------------------------------------------------------------- */
.elementor .mit-site {
  --ink: #10263b;     /* bleu nuit : textes, en-tête, fonds sombres */
  --muted: #536679;   /* texte secondaire */
  --blue: #096caf;    /* bleu principal : liens, boutons */
  --cyan: #9ddafa;    /* accent clair sur fond sombre */
  --line: #dce6ee;    /* bordures */
  --soft: #f2f7fb;    /* fonds de section clairs */
  --radius: 16px;
  --accent: #096caf;
}


/* 2. ADAPTATION ELEMENTOR ET REMISE À ZÉRO
   Neutralise les marges, gaps et largeurs qu'Elementor ajoute aux conteneurs,
   pour que le HTML du site s'affiche comme une page classique.
   -------------------------------------------------------------------------- */
.elementor .mit-site,
.elementor .mit-site .mit-box { display: block; flex: none; min-height: 0; min-width: 0; max-width: none; --container-widget-width: 100%; --widgets-spacing: 0px; --gap: 0px; gap: 0; margin: 0; padding: 0; width: 100%; align-self: auto; }
.elementor .mit-site { color: var(--ink); font: 16px/1.65 Arial, Helvetica, sans-serif; background: #fff; }
.elementor .mit-site * { box-sizing: border-box; }

.elementor .mit-site .elementor-widget { margin-bottom: 0; min-width: 0; max-width: 100%; }
.elementor .mit-site .elementor-widget-text-editor { color: inherit; font: inherit; }
.elementor .mit-site .elementor-widget-image { text-align: left; }
.elementor .mit-site .elementor-widget-image img { display: block; max-width: 100%; }
.elementor .mit-site .mit-copy .elementor-widget-container > :last-child { margin-bottom: 0; }
.elementor .mit-site .mit-html,
.elementor .mit-site .mit-heading,
.elementor .mit-site .mit-copy { width: 100%; }

/* Widgets image : l'image remplit son bloc */
.elementor .mit-site .mit-image { height: 100%; width: 100%; align-self: stretch; }
.elementor .mit-site .mit-image .elementor-widget-container { height: 100%; }
.elementor .mit-site .mit-image img { width: 100%; height: 100%; object-fit: cover; }

.elementor .mit-site a { color: inherit; text-decoration: none; }
.elementor .mit-site button { font: inherit; }
.elementor .mit-site img { max-width: 100%; display: block; }


/* 3. TYPOGRAPHIE
   Chaque titre est stylé deux fois : balise HTML brute (h1) et widget Titre
   d'Elementor (h1.elementor-heading-title).
   -------------------------------------------------------------------------- */
.elementor .mit-site .elementor-widget-heading .elementor-heading-title { font-family: Arial, Helvetica, sans-serif; color: inherit; font-weight: 700; line-height: 1.12; letter-spacing: -.035em; }
.elementor .mit-site h1,
.elementor .mit-site h2,
.elementor .mit-site h3 { line-height: 1.12; letter-spacing: -.035em; }
.elementor .mit-site h1,
.elementor .mit-site h1.elementor-heading-title { font-size: clamp(38px, 4.7vw, 66px); margin: 20px 0 24px; }
.elementor .mit-site h2,
.elementor .mit-site h2.elementor-heading-title { font-size: clamp(29px, 3vw, 42px); margin: 13px 0 21px; }
.elementor .mit-site h3,
.elementor .mit-site h3.elementor-heading-title { font-size: 22px; margin: 14px 0; }

.elementor .mit-site p { color: var(--muted); margin: 0 0 20px; }
.elementor .mit-site .eyebrow { display: block; font-size: 12px; letter-spacing: .13em; font-weight: 800; text-transform: uppercase; color: var(--accent); } /* petit surtitre en capitales */
.elementor .mit-site .lead { font-size: 19px; max-width: 750px; line-height: 1.65; }                                                                   /* chapeau sous le H1 */
.elementor .mit-site .large-text { font-size: 22px; color: var(--ink); line-height: 1.6; }
.elementor .mit-site .big-phone { font-size: clamp(26px, 3.2vw, 41px); font-weight: 800; letter-spacing: -.04em; display: block; margin: 16px 0; }
.elementor .mit-site .fine { font-size: 13px; color: var(--muted); }                                                                                  /* mentions en petit */


/* 4. MISE EN PAGE
   -------------------------------------------------------------------------- */
.elementor .mit-site .container { max-width: 1200px; margin: 0 auto; width: calc(100% - 64px); }
.elementor .mit-site .narrow { max-width: 820px; }
.elementor .mit-site .section { padding: 88px 0; }
.elementor .mit-site .soft { background: var(--soft); }
.elementor .mit-site .section-title { max-width: 690px; margin-bottom: 35px; }


/* 5. EN-TÊTE
   -------------------------------------------------------------------------- */

/* 5a. Pré-header (bandeau bleu nuit avec téléphone, e-mail, réseaux) */
.elementor .mit-site .utility { background: var(--ink); color: #e2edf5; font-size: 12px; letter-spacing: .015em; padding: 8px 0; }
.elementor .mit-site .utility .container { display: flex; justify-content: space-between; gap: 20px; }
.elementor .mit-site .utility-contacts { display: flex; align-items: center; gap: 20px; row-gap: 6px; flex-shrink: 0; flex-wrap: wrap; max-width: 100%; min-width: 0; }
.elementor .mit-site .utility-contacts a { white-space: nowrap; }
.elementor .mit-site .utility-contacts a + a,
.elementor .mit-site .utility-contacts .mit-mail + a { border-left: 1px solid #6e899e; padding-left: 20px; } /* séparateur vertical */
.elementor .mit-site .mit-mail { white-space: nowrap; }
.elementor .mit-site .utility-contacts svg { display: block; width: 14px; height: 14px; }

/* Icônes Facebook et Instagram du pré-header — ORDRE : le décalage Instagram vient après */
.elementor .mit-site .utility-contacts a[aria-label="Facebook"],
.elementor .mit-site .utility-contacts a[aria-label="Instagram"] { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0 !important; border: 0 !important; flex: 0 0 24px; margin: 0; }
.elementor .mit-site .utility-contacts a[aria-label="Instagram"] { margin-left: -12px; }
.elementor .mit-site .utility-contacts a[aria-label="Facebook"] svg,
.elementor .mit-site .utility-contacts a[aria-label="Instagram"] svg { display: block; width: 17px !important; height: 17px !important; flex-shrink: 0; }
.elementor .mit-site a[aria-label="Facebook"]:hover,
.elementor .mit-site a[aria-label="Instagram"]:hover { color: #6ec5ff !important; } /* aussi dans le pied de page */

/* 5b. Barre principale */
.elementor .mit-site header { position: sticky; top: 0; z-index: 10; background: #fff; border-bottom: 1px solid var(--line); }
.elementor .mit-site .header-inner { min-height: 92px; display: flex; align-items: center; justify-content: space-between; gap: 25px; }

/* 5c. Logo texte « Mister IT. » */
.elementor .mit-site .brand { background: transparent; border-radius: 0; padding: 0; flex-shrink: 0; }
.elementor .mit-site header .brand { font: 800 30px/1.65 Arial, Helvetica, sans-serif; letter-spacing: -1px; color: #10263b; white-space: nowrap; text-decoration: none; }
.elementor .mit-site header .brand b { font-weight: 900; color: #096caf; } /* bleu principal : contraste 5:1 sur blanc */
.elementor .mit-site .brand img { width: 154px; max-height: 66px; object-fit: contain; }

/* 5d. Navigation (le bouton Menu n'apparaît que sur mobile, voir section 12) */
.elementor .mit-site nav { display: flex; gap: 24px; align-items: center; font-size: 14px; font-weight: 700; }
.elementor .mit-site nav a { padding: 9px 0; }
.elementor .mit-site nav a:hover,
.elementor .mit-site nav a[aria-current] { color: var(--blue); }
.elementor .mit-site nav .nav-contact { background: var(--ink); color: #fff; padding: 11px 20px; }   /* bouton « Contact » */
.elementor .mit-site nav .nav-contact[aria-current] { color: var(--cyan); }
.elementor .mit-site .nav-contact { align-self: center; }
.elementor .mit-site .menu-toggle { display: none; }


/* 6. BOUTONS
   -------------------------------------------------------------------------- */

/* Coins arrondis identiques partout (10 px) — !important pour passer devant Elementor */
.elementor .mit-site .btn,
.elementor .mit-site .mit-button,
.elementor .mit-site .elementor-button,
.elementor .mit-site button,
.elementor .mit-site input[type=submit],
.elementor .mit-site .nav-contact,
.elementor .mit-site .mit-directions { border-radius: 10px !important; }

/* Les boutons prennent la largeur de leur texte, sur ordinateur comme sur mobile */
.elementor .mit-site .mit-button .elementor-button,
.elementor .mit-site .btn,
.elementor .mit-site .mit-directions,
.elementor .mit-site .nav-contact,
.elementor .mit-site input[type=submit] { width: fit-content !important; max-width: 100% !important; min-width: 0 !important; flex: 0 1 auto; justify-self: start; white-space: normal; }

/* 6a. Widget Bouton d'Elementor (.mit-button) : le cadre extérieur est invisible, le style est sur .elementor-button */
.elementor .mit-site .mit-button { width: fit-content !important; max-width: 100% !important; min-width: 0 !important; flex: 0 1 auto !important; justify-self: start; --container-widget-width: auto; background: transparent !important; border: 0 !important; padding: 0 !important; }
.elementor .mit-site .mit-button .elementor-button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding-top: 13px; padding-bottom: 13px; padding-left: 18px !important; padding-right: 18px !important; font: 800 14px/1.65 Arial, Helvetica, sans-serif; background: #096caf; color: #fff; border: 0; }
.elementor .mit-site .mit-button .elementor-button-content-wrapper { flex: 0 1 auto; min-width: 0; }
.elementor .mit-site .mit-button .elementor-button-text { flex-grow: 0; }
.elementor .mit-site .mit-button.outline .elementor-button { border: 1px solid #b6cbd9; color: #10263b; background: #fff; }          /* variante contour */
.elementor .mit-site .mit-button.white .elementor-button { background: #fff; color: #10263b; }                                       /* variante blanche */
.elementor .mit-site .mit-button.text .elementor-button { color: #096caf; padding-left: 0 !important; padding-right: 0 !important; background: none; } /* variante lien */
.elementor .mit-site .choice.web .mit-button.text .elementor-button { color: #a9ddfb; }

/* 6b. Boutons en HTML brut (.btn) */
.elementor .mit-site .btn { display: inline-flex; gap: 18px; justify-content: center; align-items: center; padding: 13px 20px; font-size: 14px; font-weight: 800; transition: background .2s, transform .2s; }
.elementor .mit-site .btn:hover { transform: translateY(-2px); }
.elementor .mit-site .primary { background: var(--blue); color: #fff; }
.elementor .mit-site .outline { border: 1px solid #b6cbd9; color: var(--ink); background: #fff; }
.elementor .mit-site .white { background: #fff; color: var(--ink); }
.elementor .mit-site .text { color: var(--blue); padding-left: 0; padding-right: 0; }

/* 6c. Groupe de boutons */
.elementor .mit-site .actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 28px; }


/* 7. COMPOSANTS
   -------------------------------------------------------------------------- */

/* 7a. Héros de l'accueil */
.elementor .mit-site .home-hero { padding: 66px 0 54px; background: linear-gradient(110deg, #f7fbff, #edf5fb); }
.elementor .mit-site .home-hero h1 { max-width: 1020px; }
.elementor .mit-site .home-hero h1 span { color: var(--blue); }
.elementor .mit-site .home-hero .lead { max-width: 770px; }

/* 7b. Cartes de choix « Dépannage / Sites internet » (accueil) */
.elementor .mit-site .choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 23px; margin-top: 36px; }
.elementor .mit-site .choice { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.2fr .8fr; min-height: 320px; border-radius: var(--radius); background: #fff; border: 1px solid var(--line); transition: transform .2s, box-shadow .2s; }
.elementor .mit-site .choice:hover { transform: translateY(-4px); box-shadow: 0 18px 35px #10263b14; }
.elementor .mit-site .choice-content { position: relative; padding: 30px; z-index: 1; }
.elementor .mit-site .choice h2 { font-size: 34px; margin: 15px 0; line-height: 1.3; }
.elementor .mit-site .choice h2.elementor-heading-title { font-size: 34px; margin: 15px 0; }
.elementor .mit-site .choice p { font-size: 15px; line-height: 1.6; margin: 0 0 22px; }
.elementor .mit-site .choice-link { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; font-weight: 800; color: var(--blue); }
.elementor .mit-site .choice img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.elementor .mit-site .choice.web { background: var(--ink); border-color: var(--ink); color: #fff; }   /* carte sombre « Sites internet » */
.elementor .mit-site .choice.web p { color: #c6d7e6; }
.elementor .mit-site .choice.web .eyebrow,
.elementor .mit-site .choice.web .choice-link { color: #a9ddfb; }

/* 7c. Bandeau de réassurance (coches) */
.elementor .mit-site .trust-strip { border-bottom: 1px solid var(--line); padding: 21px 0; font-size: 14px; font-weight: 700; }
.elementor .mit-site .trust-strip .container { display: flex; justify-content: space-between; gap: 22px; }
.elementor .mit-site .trust-strip .mit-copy { width: auto; }
.elementor .mit-site .trust-strip span:before { content: "✓"; color: var(--blue); margin-right: 10px; }

/* 7d. Grilles deux colonnes texte */
.elementor .mit-site .intro-grid,
.elementor .mit-site .local-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.elementor .mit-site .intro-grid .section-title { margin-bottom: 0; }

/* 7e. Liens de services avec icône (accueil) */
.elementor .mit-site .service-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.elementor .mit-site .service-links a { position: relative; border: 1px solid var(--line); border-radius: 10px; background: #fff; padding: 27px 42px 27px 24px; height: 100%; display: block; }
.elementor .mit-site .service-links a:hover { border-color: var(--blue); }
.elementor .mit-site .service-links span { font-size: 18px; font-weight: 750; display: block; line-height: 1.35; margin-bottom: 8px; }
.elementor .mit-site .service-links small { font-size: 14px; color: var(--muted); }
.elementor .mit-site .service-links b { position: absolute; right: 20px; top: 23px; color: var(--blue); }  /* flèche */
.elementor .mit-site .service-links .mit-copy { height: 100%; align-self: stretch; }

/* Icônes : forme commune ici, dessin SVG choisi par élément via --mit-icon */
.elementor .mit-site .service-links .mit-copy a::before { content: ""; display: block; width: 34px; height: 34px; margin-bottom: 19px; background-color: #096caf; -webkit-mask-image: var(--mit-icon); mask-image: var(--mit-icon); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; }
.elementor .mit-site .service-links .elementor-element-8c6240c a::before { /* compteur */ --mit-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%2014-4-4%22%2F%3E%3Cpath%20d%3D%22M3.34%2019a10%2010%200%201%201%2017.32%200Z%22%2F%3E%3C%2Fsvg%3E"); }
.elementor .mit-site .service-links .elementor-element-4c39450 a::before { /* écran barré */ --mit-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%2021h8M12%2017v4M9%208l6%206M15%208l-6%206%22%2F%3E%3C%2Fsvg%3E"); }
.elementor .mit-site .service-links .elementor-element-5a99aaa a::before { /* fenêtre code */ --mit-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222%22%20y%3D%223%22%20width%3D%2220%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M2%208h20M9%2012l-3%203%203%203M15%2012l3%203-3%203%22%2F%3E%3C%2Fsvg%3E"); }
.elementor .mit-site .service-links .elementor-element-ca986d1 a::before { /* pinceau */ --mit-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m14.06%209.94%206.92-6.92a2.12%202.12%200%200%201%203%203l-6.92%206.92%22%20transform%3D%22translate(-2%200)%22%2F%3E%3Cpath%20d%3D%22M12%2010a4%204%200%200%201%204%204c0%204-4%206-8%206-2%200-4-1-4-1s2-1%202-3a4%204%200%200%201%206-6Z%22%2F%3E%3C%2Fsvg%3E"); }
.elementor .mit-site .service-links .elementor-element-6e99d1c a::before { /* écran + engrenage */ --mit-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2017H4a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h14a2%202%200%200%201%202%202v3M8%2021h4M10%2017v4%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2216%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M18%2011v2m0%206v2m5-5h-2m-6%200h-2m8.5-3.5L20%2014m-4%204-1.5%201.5m7%200L20%2018m-4-4-1.5-1.5%22%2F%3E%3C%2Fsvg%3E"); }
.elementor .mit-site .service-links .elementor-element-3d2d6f2 a::before { /* toque de diplômé */ --mit-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%209l10-5%2010%205-10%205L2%209ZM6%2011v6c4%203%208%203%2012%200v-6M22%209v7%22%2F%3E%3C%2Fsvg%3E"); }

/* 7f. Encadré local (bordure bleue à gauche) */
.elementor .mit-site .local-note { background: var(--soft); border-left: 3px solid var(--blue); padding: 34px; }

/* 7g. Bandeau de contact bleu en bas de page */
.elementor .mit-site .contact-band { background: var(--blue); color: #fff; padding: 56px 0; }
.elementor .mit-site .contact-band .eyebrow { color: #fff; } /* blanc : contraste 5,6:1 (#b9e3ff ne donnait que 4,1:1) */
.elementor .mit-site .contact-band p { color: #e0effa; max-width: 660px; margin: 0; }
.elementor .mit-site .contact-band h2 { margin: 12px 0; }
.elementor .mit-site .band-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 36px; } /* texte à gauche, bouton à droite */
.elementor .mit-site .band-inner > .mit-button { justify-self: end; align-self: center; white-space: nowrap; }
.elementor .mit-site .band-inner .btn { flex-shrink: 0; }

/* 7h. Héros des pages de service (texte + photo) */
.elementor .mit-site .hero { background: var(--soft); padding: 65px 0; }
.elementor .mit-site .hero-grid { display: grid; grid-template-columns: 1.12fr 1fr; gap: 56px; align-items: center; }
.elementor .mit-site .hero h1,
.elementor .mit-site .hero h1.elementor-heading-title { font-size: clamp(36px, 4.1vw, 57px); }
.elementor .mit-site .hero .lead { font-size: 18px; }
.elementor .mit-site .hero-photo { margin: 0; background: var(--ink); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.elementor .mit-site .hero-photo img,
.elementor .mit-site .hero-photo .mit-image { object-fit: cover; flex: 1; height: 340px; width: 100%; }
.elementor .mit-site .hero-photo img[src*="depannage"] { object-position: 75% center; } /* ORDRE : avant la règle 10 « depannage » */
.elementor .mit-site .hero-photo figcaption { display: flex; justify-content: space-between; gap: 10px; color: #fff; padding: 4px 21px; font-size: 11px; font-weight: 800; line-height: 1.6; }
.elementor .mit-site .hero-photo figcaption span { font-weight: 400; color: #c9d9e6; }
.elementor .mit-site .repair img { object-position: 78% center; }

/* 7i. Cartes (3 colonnes) */
.elementor .mit-site .cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.elementor .mit-site .card { padding: 29px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.elementor .mit-site .card .index { font-size: 13px; font-weight: 800; color: var(--blue); } /* remplacé par une icône sur Dépannage et À propos */
.elementor .mit-site .card h3,
.elementor .mit-site .card h3.elementor-heading-title { margin: 24px 0 14px; }
.elementor .mit-site .card p { margin: 0; }

/* 7j. FAQ (balises details/summary) */
.elementor .mit-site .faq details { border-bottom: 1px solid var(--line); padding: 21px 0; }
.elementor .mit-site .faq summary { font-weight: 750; font-size: 18px; cursor: pointer; }
.elementor .mit-site .faq p { margin: 17px 0 0; }

/* 7k. Section sombre et frise d'étapes */
.elementor .mit-site .ink { background: var(--ink); color: #fff; padding: 88px 0; }
.elementor .mit-site .ink p { color: #bfd0df; }
.elementor .mit-site .ink .eyebrow { color: #92d4ff; }
.elementor .mit-site .timeline > div { display: flex; gap: 26px; border-bottom: 1px solid #ffffff24; padding: 0 0 23px; margin-bottom: 25px; }
.elementor .mit-site .timeline > div > span,
.elementor .mit-site .timeline > div > .mit-copy { font-size: 14px; color: #92d4ff; font-weight: 800; padding-top: 7px; width: 30px; flex-shrink: 0; } /* numéro d'étape */
.elementor .mit-site .timeline h3,
.elementor .mit-site .timeline h3.elementor-heading-title { margin: 0 0 12px; }
.elementor .mit-site .timeline p { margin: 0; }

/* 7l. En-tête des pages intérieures */
.elementor .mit-site .page-head { padding: 66px 0; background: var(--soft); text-align: left; }
.elementor .mit-site .page-head h1 { font-size: clamp(37px, 4.5vw, 61px); text-align: left; }

/* 7m. Grille de tarifs */
.elementor .mit-site .price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.elementor .mit-site .price-card { padding: 30px; border: 1px solid var(--line); border-radius: 14px; display: flex; flex-direction: column; align-items: flex-start; }
.elementor .mit-site .price-card > span { font-size: 17px; font-weight: 700; }
.elementor .mit-site .price-card h2,
.elementor .mit-site .price-card h2.elementor-heading-title { font-size: 49px; margin: 24px 0; }
.elementor .mit-site .price-card small { font-size: 14px; letter-spacing: 0; display: block; margin-top: 8px; font-weight: 400; }
.elementor .mit-site .price-card .btn { margin-top: auto; }  /* bouton calé en bas de carte */
.elementor .mit-site .featured { background: var(--blue); color: #fff; border-color: var(--blue); } /* carte mise en avant */
.elementor .mit-site .featured p { color: #e1effa; }

/* 7n. Tableaux */
.elementor .mit-site .table-wrap { margin-top: 43px; overflow-x: auto; }
.elementor .mit-site table { border-collapse: collapse; width: 100%; font-size: 15px; }
.elementor .mit-site caption { text-align: left; font-size: 22px; font-weight: 700; margin-bottom: 20px; }
.elementor .mit-site th,
.elementor .mit-site td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.elementor .mit-site th { background: var(--soft); }
.elementor .mit-site td:last-child,
.elementor .mit-site th:last-child { text-align: right; white-space: nowrap; } /* colonne prix */

/* 7o. Cartes de contact */
.elementor .mit-site .contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.elementor .mit-site .contact-card { padding: 38px; border: 1px solid var(--line); border-radius: 16px; }
.elementor .mit-site .contact-card h2 { font-size: 32px; }
.elementor .mit-site .contact-card .btn { margin: 7px 5px 7px 0; }
.elementor .mit-site .web-contact { background: var(--soft); }

/* 7p. Bloc adresse sombre (Contact) — !important pour passer devant le conteneur Elementor */
.elementor .mit-site .address { position: relative; overflow: hidden; background: radial-gradient(circle at 100% 0, #174c70 0, transparent 45%), #10263b !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 24px !important; align-items: center !important; padding: 36px !important; margin-bottom: 48px !important; border-radius: 16px; color: #fff; }
.elementor .mit-site .address .mit-heading { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; margin-bottom: 4px !important; }
.elementor .mit-site .address h2 { color: #fff !important; font-size: 28px !important; margin: 0 !important; }
.elementor .mit-site .address p { color: #d9e8f3; margin: 8px 0; font-size: 16px; }
.elementor .mit-site .address .fine { color: #9ddafa; font-size: 14px; }
.elementor .mit-site .address a { color: #fff; }
.elementor .mit-site .mit-directions { display: inline-flex; align-items: center; gap: 10px; padding: 11px 18px; font-size: 14px; font-weight: 800; color: #10263b !important; background: #6ec5ff; border: 0; } /* bouton itinéraire */
/* Les deux sous-blocs « Adresse » et « Contact direct » (identifiants Elementor) */
.elementor .mit-site .address .elementor-element-5a501cb,
.elementor .mit-site .address .elementor-element-3f81bfb { border: 1px solid #436079; border-radius: 10px; padding: 24px; background: #ffffff08; align-self: stretch; }
.elementor .mit-site .address .elementor-element-5a501cb:before { content: "ADRESSE"; display: block; color: #8bd1ff; font-size: 11px; font-weight: 800; letter-spacing: .12em; margin-bottom: 12px; }
.elementor .mit-site .address .elementor-element-3f81bfb:before { content: "CONTACT DIRECT"; display: block; color: #8bd1ff; font-size: 11px; font-weight: 800; letter-spacing: .12em; margin-bottom: 12px; }
.elementor .mit-site .address .elementor-element-5a501cb p { font-size: 20px; max-width: 290px; line-height: 1.6; font-weight: 700; }
.elementor .mit-site .address .elementor-element-3f81bfb p { display: flex; flex-wrap: wrap; gap: 10px 16px; font-size: 18px; }

/* 7q. Formulaire de contact (Contact Form 7) */
.elementor .mit-site .mit-form-fields { display: grid; gap: 18px; }
.elementor .mit-site .mit-form-fields p { margin: 0; }
.elementor .mit-site .mit-form-fields label { display: block; color: #10263b; font: 700 14px/1.5 Arial, Helvetica, sans-serif; }
.elementor .mit-site .mit-form-fields input:not([type=submit]),
.elementor .mit-site .mit-form-fields select,
.elementor .mit-site .mit-form-fields textarea { display: block; width: 100%; max-width: 100%; min-height: 46px; margin-top: 7px; padding: 11px 13px; border: 1px solid #bfd0dc; border-radius: 6px; background: #fff; color: #10263b; font: 400 16px/1.5 Arial, Helvetica, sans-serif; }
.elementor .mit-site .mit-form-fields textarea { min-height: 135px; resize: vertical; }
.elementor .mit-site .mit-form-fields input[type=submit] { background: #096caf; color: #fff; border: 0; padding: 14px 20px; font: 700 14px/1.5 Arial, Helvetica, sans-serif; cursor: pointer; }
.elementor .mit-site .mit-form-fields .mit-form-note { font: 400 12px/1.6 Arial, Helvetica, sans-serif; margin: 0; color: #536679; }
.elementor .mit-site .wpcf7-not-valid-tip { font-size: 13px; }


/* 8. PIED DE PAGE
   -------------------------------------------------------------------------- */

/* 8a. Pied de page standard */
.elementor .mit-site footer { background: #0b1e30; color: #d4e3ed; padding: 54px 0 0; }
.elementor .mit-site footer p { color: #aebecd; font-size: 14px; }
.elementor .mit-site footer a { font-size: 14px; }
.elementor .mit-site footer a:hover { color: #fff; }
.elementor .mit-site footer .mit-mail { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: 400; line-height: 1.65; color: #d4e3ed; }
.elementor .mit-site footer a[aria-label="Facebook"],
.elementor .mit-site footer a[aria-label="Instagram"] { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; margin-bottom: 8px; }
.elementor .mit-site footer a[aria-label="Facebook"] svg,
.elementor .mit-site footer a[aria-label="Instagram"] svg { display: block; width: 20px; height: 20px; }
.elementor .mit-site .footer-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr 1fr; gap: 35px; }
.elementor .mit-site .footer-grid h3 { color: #fff; font-size: 16px; font-weight: 800; letter-spacing: 0; margin: 0 0 19px; }
.elementor .mit-site .footer-grid > div > a:not(.footer-brand) { display: inline-block; margin-bottom: 8px; }
.elementor .mit-site .footer-grid > div:not(:first-child) > a { display: block; }  /* un lien par ligne */
.elementor .mit-site .footer-brand { font-size: 30px; font-weight: 800; color: #fff; display: block; margin-bottom: 17px; letter-spacing: -1px; }
.elementor .mit-site .footer-brand b { color: #096caf; }
.elementor .mit-site .footer-bottom { border-top: 1px solid #ffffff20; display: flex; justify-content: space-between; gap: 20px; font-size: 12px; margin-top: 43px; padding: 22px 0; }
.elementor .mit-site .footer-bottom a { font-size: 12px !important; }

/* 8b. Pied de page « unifié » (Contact, Confidentialité, Cookies).
   N'agit que sur footer.mit-footer-unified ; la page Contact retire la marge haute. */
.elementor .mit-site footer.mit-footer-unified { background: #0b1e30; color: #d4e3ed; padding: 54px 0 0; font: 16px/1.65 Arial, Helvetica, sans-serif; }
.elementor .mit-site .mit-footer-unified .container { max-width: 1200px; width: calc(100% - 64px); margin-left: auto; margin-right: auto; }
.elementor .mit-site .mit-footer-unified .footer-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr 1fr; gap: 35px; }
.elementor .mit-site .mit-footer-unified p { color: #aebecd; font-size: 14px; }
.elementor .mit-site .mit-footer-unified a { color: #d4e3ed; font-size: 14px; text-decoration: none; }
.elementor .mit-site .mit-footer-unified a:hover { color: #fff; }
.elementor .mit-site .mit-footer-unified .footer-grid h3 { color: #fff; font-size: 16px; font-weight: 800; margin: 0 0 19px; }
.elementor .mit-site .mit-footer-unified .footer-grid > div:not(:first-child) > a { display: block; margin-bottom: 8px; }
.elementor .mit-site .mit-footer-unified a.footer-brand { display: block; font-size: 30px; font-weight: 800; color: #fff; letter-spacing: -1px; margin-bottom: 17px; }
.elementor .mit-site .mit-footer-unified .footer-brand b { color: #096caf; }
.elementor .mit-site .mit-footer-unified .footer-bottom { border-top: 1px solid #ffffff20; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; font-size: 12px; margin-top: 43px; padding: 22px 0; }
.elementor .mit-site .mit-footer-unified .footer-bottom a { font-size: 12px !important; }


/* 9. ACCESSIBILITÉ
   -------------------------------------------------------------------------- */
.elementor .mit-site :focus-visible,
.elementor .mit-site a:focus-visible,
.elementor .mit-site button:focus-visible { outline: 3px solid #ed9b2d; outline-offset: 4px; } /* contour orange au clavier */
.elementor .mit-site .skip { position: absolute; top: -100px; background: #fff; padding: 14px; z-index: 100; }      /* lien « aller au contenu » */
.elementor .mit-site .skip:focus { top: 0; }


/* 10. AJUSTEMENTS DE L'ACCUEIL — ORDRE
   Ces règles doivent rester après les sections 2 à 7 qu'elles corrigent.
   -------------------------------------------------------------------------- */
.elementor .mit-site .mit-copy p { margin-bottom: 20px; }                                      /* passe devant .card p, .faq p, etc. */
.elementor .mit-site .mit-image img[src*="depannage"] { object-position: 78% center; }         /* passe devant 7h */
.elementor .mit-site .section.soft .section-title { max-width: 100%; width: 100%; }
@media (min-width: 1000px) {
  .elementor .mit-site .section.soft .section-title h2 { white-space: nowrap; font-size: clamp(29px, 3vw, 42px); } /* titre sur une ligne */
}
/* Bandeau de contact : grille forcée par-dessus Elementor */
.elementor .mit-site .contact-band .band-inner { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; }
.elementor .mit-site .contact-band .band-inner > .mit-button { justify-self: end; align-self: center; }
/* Photos des cartes de choix : léger zoom pour recadrer — passe devant la règle « depannage » ci-dessus */
.elementor .mit-site .choice .mit-image { overflow: hidden; background: #eaf5fc; }
.elementor .mit-site .choice.web .mit-image { background: #fff; opacity: 1 !important; }
.elementor .mit-site .choice.web .mit-image .elementor-widget-container { opacity: 1 !important; }
.elementor .mit-site .choice .mit-image img { transform: scale(1.15); transform-origin: 50% 50%; object-fit: cover; object-position: center; }


/* 11. PAGES LÉGALES
   Gardées ici (et non dans les fichiers de page) pour rester actives même si
   le CSS d'une page est modifié dans Elementor.
   -------------------------------------------------------------------------- */

/* 11a. Texte généré par Complianz dans .cookie-wrap — !important pour écraser le plugin */
.elementor .mit-site .cookie-wrap,
.elementor .mit-site .cookie-wrap p,
.elementor .mit-site .cookie-wrap li,
.elementor .mit-site .cookie-wrap td,
.elementor .mit-site .cookie-wrap th,
.elementor .mit-site .cookie-wrap span,
.elementor .mit-site .cookie-wrap div { font-family: Arial, Helvetica, sans-serif !important; font-size: 16px !important; line-height: 1.85 !important; color: #405469; }
.elementor .mit-site .cookie-wrap h2 { font-family: Arial, Helvetica, sans-serif !important; font-size: 22px !important; line-height: 1.4 !important; font-weight: 700 !important; letter-spacing: 0 !important; color: #096caf !important; margin: 44px 0 16px !important; }
.elementor .mit-site .cookie-wrap h3,
.elementor .mit-site .cookie-wrap h4 { font-family: Arial, Helvetica, sans-serif !important; font-size: 18px !important; line-height: 1.4 !important; font-weight: 700 !important; letter-spacing: 0 !important; color: #10263b !important; margin: 28px 0 12px !important; }
.elementor .mit-site .cookie-wrap a { color: #096caf !important; font-weight: 700; }

/* 11b. Politique de cookies (page 320) : pré-header clair sur fond sombre, typographie alignée sur les CGV */
body.page-id-320 .elementor .mit-site .utility .utility-contacts,
body.page-id-320 .elementor .mit-site .utility .utility-contacts a,
body.page-id-320 .elementor .mit-site .utility .utility-contacts .mit-mail { color: #fff; }
body.page-id-320 .elementor .mit-site .utility .utility-contacts a:hover,
body.page-id-320 .elementor .mit-site .utility .utility-contacts a:focus-visible { color: #6ec5ff; }
body.page-id-320 .elementor .mit-site .page-head h1 { font-family: Arial, Helvetica, sans-serif; font-size: clamp(36px, 4vw, 56px); line-height: 1.12; letter-spacing: -1.5px; font-weight: 700; }
body.page-id-320 .elementor .mit-site .page-head p,
body.page-id-320 .elementor .mit-site .cookie-wrap,
body.page-id-320 .elementor .mit-site #cmplz-document { font: 400 16px/1.85 Arial, Helvetica, sans-serif; }
body.page-id-320 .elementor .mit-site #cmplz-document p,
body.page-id-320 .elementor .mit-site #cmplz-document li,
body.page-id-320 .elementor .mit-site #cmplz-document td,
body.page-id-320 .elementor .mit-site #cmplz-document th { font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.85; color: #405469; }
body.page-id-320 .elementor .mit-site #cmplz-document h2,
body.page-id-320 .elementor .mit-site #cmplz-document h3 { font-family: Arial, Helvetica, sans-serif; font-size: 22px; line-height: 1.4; letter-spacing: 0; font-weight: 700; color: #096caf; }


/* 12. RESPONSIVE
   Toujours en fin de fichier pour passer devant les règles ci-dessus.
   -------------------------------------------------------------------------- */

/* 12a. Tablette (≤ 1050 px) */
@media (max-width: 1050px) {
  .elementor .mit-site nav { gap: 14px; font-size: 13px; }
  .elementor .mit-site .brand img { width: 130px; }
  .elementor .mit-site .choice { grid-template-columns: 1fr; }                       /* photo au-dessus du texte */
  .elementor .mit-site .choice img { height: 170px; grid-row: 1; }
  .elementor .mit-site .choice .mit-image { height: 170px; grid-row: 1; }
  .elementor .mit-site .choice h2 { font-size: 31px; line-height: 1.3; }
  .elementor .mit-site .hero-grid { gap: 30px; }
  .elementor .mit-site .intro-grid,
  .elementor .mit-site .local-grid { gap: 35px; }
}

/* 12b. Mobile (≤ 800 px) — le pré-header est masqué, la navigation passe en menu déroulant */
@media (max-width: 800px) {
  /* Mise en page */
  .elementor .mit-site .container { width: calc(100% - 36px); }
  .elementor .mit-site .section,
  .elementor .mit-site .ink { padding: 60px 0; }
  .elementor .mit-site .home-hero,
  .elementor .mit-site .page-head { padding: 43px 0; }
  .elementor .mit-site .hero { padding: 40px 0; }
  .elementor .mit-site .contact-band { padding: 40px 0; }
  .elementor .mit-site .lead { font-size: 17px; }

  /* En-tête */
  .elementor .mit-site .utility { display: none; }
  .elementor .mit-site .header-inner { min-height: 76px; flex-wrap: wrap; }
  .elementor .mit-site .brand img { width: 126px; max-height: 52px; }
  .elementor .mit-site .menu-toggle { display: block; background: #fff; border: 1px solid var(--line); padding: 9px 13px; font-size: 14px; font-weight: 700; }
  .elementor .mit-site .menu-toggle,
  .elementor .mit-site .menu-toggle:hover,
  .elementor .mit-site .menu-toggle:focus,
  .elementor .mit-site .menu-toggle:active { color: #096caf !important; }
  .elementor .mit-site nav { display: none; position: absolute; top: 100%; left: 0; right: 0; width: 100%; flex-direction: column; align-items: stretch; padding: 10px 18px 18px; font-size: 16px; gap: 3px; background: #fff; box-shadow: 0 12px 24px rgba(16, 38, 59, .15); max-height: calc(100vh - 76px); overflow-y: auto; z-index: 20; }
  .elementor .mit-site nav.open { display: flex; }                                  /* ouvert par le bouton Menu */
  .elementor .mit-site nav a { padding: 11px 8px; }
  .elementor .mit-site .nav-contact { align-self: flex-start; }

  /* Grilles sur une colonne */
  .elementor .mit-site .choice-grid,
  .elementor .mit-site .intro-grid,
  .elementor .mit-site .local-grid,
  .elementor .mit-site .hero-grid,
  .elementor .mit-site .price-grid { grid-template-columns: 1fr; }
  .elementor .mit-site .contact-grid,
  .elementor .mit-site .address { grid-template-columns: 1fr !important; }
  .elementor .mit-site .cards,
  .elementor .mit-site .service-links,
  .elementor .mit-site .footer-grid { grid-template-columns: 1fr 1fr; }

  /* Accueil */
  .elementor .mit-site .home-hero h1,
  .elementor .mit-site .home-hero h1.elementor-heading-title { font-size: 40px; }
  .elementor .mit-site .choice { grid-template-columns: 1.2fr 1fr; }                 /* photo de nouveau à côté */
  .elementor .mit-site .choice img { height: 100%; grid-row: auto; }
  .elementor .mit-site .choice .mit-image { height: 100%; grid-row: auto; }
  .elementor .mit-site .choice h2 { font-size: 30px; line-height: 1.3; }
  .elementor .mit-site .choice-content { padding: 24px; }
  .elementor .mit-site .trust-strip .container { display: grid; grid-template-columns: 1fr 1fr; font-size: 12px; gap: 13px; }

  /* Composants */
  .elementor .mit-site .hero-photo img { height: 280px; }
  .elementor .mit-site .price-card { padding: 26px; }
  .elementor .mit-site .price-card h2 { margin: 17px 0; }
  .elementor .mit-site .band-inner { grid-template-columns: 1fr; gap: 22px; }
  .elementor .mit-site .band-inner > .mit-button { justify-self: start; white-space: normal; }
  .elementor .mit-site .contact-band .band-inner { grid-template-columns: 1fr !important; }
  .elementor .mit-site .contact-band .band-inner > .mit-button { justify-self: start; }

  /* Pieds de page */
  .elementor .mit-site .footer-bottom { flex-direction: column; gap: 8px; align-items: center; text-align: center; }
  .elementor .mit-site .footer-bottom span { justify-content: center; }
  .elementor .mit-site .mit-footer-unified .container { width: calc(100% - 36px); }
  .elementor .mit-site .mit-footer-unified .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .elementor .mit-site .mit-footer-unified .footer-bottom { flex-direction: column; align-items: center; text-align: center; }
  .elementor .mit-site .mit-footer-unified .footer-bottom span { justify-content: center; }

  /* Pages légales */
  .elementor .mit-site .cookie-wrap h2 { font-size: 20px !important; }
  body.page-id-320 .elementor .mit-site #cmplz-document h2,
  body.page-id-320 .elementor .mit-site #cmplz-document h3 { font-size: 20px; }
}

/* 12c. Petit mobile (≤ 480 px) */
@media (max-width: 480px) {
  .elementor .mit-site .home-hero h1,
  .elementor .mit-site .home-hero h1.elementor-heading-title { font-size: 35px; }
  .elementor .mit-site .choice { grid-template-columns: 1fr; min-height: 0; }
  .elementor .mit-site .choice img { height: 160px; grid-row: 1; }
  .elementor .mit-site .choice .mit-image { height: 210px; grid-row: 1; overflow: hidden; }
  .elementor .mit-site .choice .mit-image img { height: 210px; width: 100%; object-fit: cover; transform: scale(1.03) !important; object-position: 50% 57% !important; }
  .elementor .mit-site .choice.web .mit-image img { object-position: 50% 48% !important; }
  .elementor .mit-site .choice h2.elementor-heading-title { font-size: 30px; }
  .elementor .mit-site .choice p { margin-bottom: 18px; }
  .elementor .mit-site .cards,
  .elementor .mit-site .service-links { grid-template-columns: 1fr; }
  .elementor .mit-site .footer-grid { gap: 32px 20px; }
  .elementor .mit-site .mit-footer-unified .footer-grid { grid-template-columns: 1fr; }
  .elementor .mit-site .contact-card { padding: 26px; }
  .elementor .mit-site .hero-photo figcaption { flex-direction: column; }
  .elementor .mit-site .local-note { padding: 24px; }
  .elementor .mit-site .actions { align-items: stretch; }
  .elementor .mit-site .price-card h2 { font-size: 43px; }
}

/* 12d. Animations réduites à la demande du système */
@media (prefers-reduced-motion: reduce) {
  .elementor .mit-site * { transition: none !important; }
}