/* JVMH | pages villes MPG, nouveau design (chargé par le widget HTML en tête du template) */
:root{--mp-bg:#F9F7F5;--mp-surface:#F2EEE9;--mp-ink:#211D1A;--mp-muted:#5E6570;--mp-navy:#1D3863;--mp-navy-deep:#152B4D;--mp-steel:#8697A6;--mp-copper:#BF793B;--mp-copper-strong:#A5622A;--mp-copper-light:#D99559;--mp-line:rgba(33,29,26,.12);--mp-ease:cubic-bezier(.16,1,.3,1);--mp-display:"Federo",serif;--mp-sans:"Hind Madurai",system-ui,sans-serif}
.mp-sec{font-family:var(--mp-sans);color:var(--mp-ink);font-size:17px;line-height:1.7}
.mp-sec > .elementor-container{max-width:1320px!important;padding-inline:clamp(16px,4vw,48px)}
.mp-sec.elementor-section-full_width > .elementor-container{max-width:none!important}
.mp-sec .elementor-widget:not(:last-child){margin-bottom:0}
.mp-sec .elementor-heading-title{font-family:var(--mp-display);font-weight:400;color:inherit;line-height:1.15;letter-spacing:.005em}
.mp-sec p{margin:0 0 14px}
.mp-sec a{transition:color .3s}

/* ---------- boutons ---------- */
.mp-btn .elementor-button{background:var(--mp-copper-strong)!important;color:#fff!important;font-family:var(--mp-display);font-size:.92rem;letter-spacing:.08em;text-transform:uppercase;padding:16px 28px;border-radius:4px;border:0;fill:#fff;transition:background .4s var(--mp-ease),transform .4s var(--mp-ease)}
.mp-btn .elementor-button:hover{background:var(--mp-navy)!important}
.mp-btn .elementor-button:active{transform:scale(.98)}
.mp-btn-line .elementor-button{background:transparent!important;color:var(--mp-ink)!important;border:1px solid var(--mp-ink)}
.mp-btn-line .elementor-button:hover{background:var(--mp-ink)!important;color:var(--mp-bg)!important}

/* ---------- titres de section ---------- */
.mp-title .elementor-heading-title{font-size:clamp(1.8rem,3vw,2.8rem)!important;color:var(--mp-ink)}
.mp-title .elementor-heading-title::before{content:"";display:block;width:44px;height:2px;background:var(--mp-copper);margin-bottom:18px}
.mp-center{text-align:center}
.mp-center .elementor-heading-title::before{margin-inline:auto}
.mp-sub .elementor-heading-title{font-size:clamp(1.15rem,1.6vw,1.4rem)!important;color:var(--mp-copper-strong)!important;margin:14px 0 18px}
.mp-prose a,.mp-intro a{color:var(--mp-copper-strong);text-decoration:underline;text-underline-offset:3px}
.mp-prose a:hover,.mp-intro a:hover{color:var(--mp-navy)}
.mp-prose strong{color:var(--mp-ink)}

/* ---------- 1. hero plein écran ---------- */
.mp-hero{position:relative;min-height:min(88vh,820px);display:flex;align-items:flex-end;overflow:hidden;background-color:var(--mp-navy-deep)}
.mp-hero::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(0deg,rgba(21,43,77,.96) 0%,rgba(21,43,77,.7) 45%,rgba(21,43,77,.25) 100%),linear-gradient(90deg,rgba(21,43,77,.7) 0%,rgba(21,43,77,0) 70%)}
.mp-hero > .elementor-container{position:relative;z-index:1;width:100%;max-width:1320px!important;margin:0 auto}
.mp-hero-copy > .elementor-widget-wrap{max-width:780px}
.mp-kicker .elementor-heading-title{display:inline-flex;align-items:center;gap:12px;font-size:.8rem!important;letter-spacing:.16em;text-transform:uppercase;color:#D99559!important;background:none!important;padding:0!important;border:0!important;box-shadow:none!important}
.mp-kicker .elementor-heading-title::before{content:"";width:28px;height:1px;background:var(--mp-copper)}
.mp-h1 .elementor-heading-title{font-size:clamp(2.4rem,5.2vw,4.8rem)!important;line-height:1.04!important;margin:18px 0 10px;color:#fff!important;letter-spacing:0!important;text-align:left!important}
.mp-hero .mp-sub .elementor-heading-title{color:#D99559!important;font-size:clamp(1.05rem,1.4vw,1.25rem)!important;margin:6px 0 18px}
.mp-hero .mp-intro{color:rgba(249,247,245,.82);font-size:1.05rem;line-height:1.75;margin-bottom:28px!important;max-width:62ch}
.mp-hero .mp-intro p{margin:0 0 8px}
.mp-btn-light .elementor-button{background:transparent!important;color:#fff!important;border:1px solid rgba(249,247,245,.6)!important}
.mp-btn-light .elementor-button:hover{background:#fff!important;color:var(--mp-ink)!important}

/* ---------- 2. slogan entre les photos ---------- */
.mp-statement{padding:clamp(80px,10vw,140px) 0!important}
.mp-statement > .elementor-container{align-items:center;gap:clamp(24px,4vw,64px)}
.mp-statement > .elementor-container > .elementor-column{width:auto!important;flex:1 1 0}
.mp-statement > .elementor-container > .mp-st-copy{flex:1.6 1 0}
.mp-slogan{text-align:center}
.mp-slogan .elementor-heading-title{font-size:clamp(1.7rem,3.2vw,3rem)!important;line-height:1.15!important;text-transform:uppercase;letter-spacing:.02em;color:var(--mp-ink)!important;-webkit-text-stroke:0!important;text-align:center!important}
.mp-slogan .elementor-heading-title::after{content:"";display:block;width:90px;height:2px;background:var(--mp-copper);margin:26px auto 0}
.mp-house{position:relative;padding:3px;background:var(--mp-copper);clip-path:polygon(0 100%,0 26%,50% 0,100% 26%,100% 100%)}
.mp-house img{width:100%;aspect-ratio:3/4.2;object-fit:cover;display:block;clip-path:polygon(0 100%,0 26.2%,50% .4%,100% 26.2%,100% 100%);box-shadow:none!important}
.mp-offset img{width:100%;aspect-ratio:3/4.2;object-fit:cover;display:block;margin-top:60px;box-shadow:0 30px 60px -30px rgba(29,56,99,.45)!important}

/* ---------- 3. nos solutions ---------- */
.mp-split{padding:clamp(80px,10vw,140px) 0}
.mp-split > .elementor-container{align-items:center}
.mp-split-media > .elementor-widget-wrap{padding-right:clamp(20px,4vw,70px)}
.mp-bracket{position:relative}
.mp-bracket img{width:100%;aspect-ratio:4/4.4;height:auto!important;object-fit:cover;display:block;box-shadow:none!important}
.mp-bracket::after{content:"";position:absolute;right:-14px;bottom:-14px;width:46%;height:34%;border-right:2px solid var(--mp-copper);border-bottom:2px solid var(--mp-copper);pointer-events:none}
.mp-split-copy .mp-prose{color:#3b3f46}

/* ---------- 4. cartes aménagements ---------- */
.mp-cards-head{padding-top:clamp(70px,9vw,120px);background:var(--mp-surface)}
.mp-cards{padding:clamp(36px,4vw,56px) 0 clamp(80px,10vw,130px);background:var(--mp-surface)}
.mp-cards-grid > .elementor-widget-wrap{display:grid!important;grid-template-columns:repeat(12,1fr);gap:18px}
.mp-card{grid-column:span 4;width:auto!important;margin:0!important}
.mp-card:nth-child(-n+4){grid-column:span 3}
.mp-card .elementskit-info-image-box{display:flex;flex-direction:column;height:100%;text-align:left!important;background:var(--mp-bg)!important;padding:0!important;border:0!important;box-shadow:none!important;overflow:hidden;transition:transform .5s var(--mp-ease),box-shadow .5s var(--mp-ease)}
.mp-card .elementskit-info-image-box:hover{transform:translateY(-4px);box-shadow:0 30px 60px -36px rgba(29,56,99,.5)!important}
.mp-card .elementskit-box-header{overflow:hidden;margin:0!important;padding:0!important}
.mp-card .elementskit-box-header img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform 1.2s var(--mp-ease)}
.mp-card .elementskit-info-image-box:hover .elementskit-box-header img{transform:scale(1.05)}
.mp-card .elementskit-box-body{flex:1;display:flex;flex-direction:column;padding:22px 22px 24px!important;margin:0!important;background:transparent!important}
.mp-card .elementskit-box-content,.mp-card .ekit-image-box-body-inner{flex:1;display:flex;flex-direction:column}
.mp-card .elementskit-info-box-title{font-family:var(--mp-display)!important;font-weight:400!important;font-size:1.35rem!important;color:var(--mp-ink)!important;margin:0 0 10px!important}
.mp-card .elementskit-box-style-content,.mp-card .elementskit-box-body p{color:var(--mp-muted)!important;font-size:.98rem;line-height:1.6;margin-bottom:18px}
.mp-card .elementskit-box-footer{margin-top:auto!important}
.mp-card .elementskit-btn{display:inline-flex!important;align-items:center;gap:10px;background:transparent!important;color:var(--mp-ink)!important;padding:0 0 4px!important;border:0!important;border-bottom:1px solid var(--mp-copper)!important;border-radius:0!important;font-family:var(--mp-display);font-size:.88rem!important;letter-spacing:.06em;text-transform:uppercase;box-shadow:none!important;transition:gap .4s var(--mp-ease),color .3s}
.mp-card .elementskit-btn::after{content:"\2192";color:var(--mp-copper)}
.mp-card .elementskit-btn:hover{color:var(--mp-copper-strong)!important;gap:16px}

/* ---------- 5. vidéo ---------- */
.mp-video-sec{padding:clamp(70px,9vw,120px) 0}
.mp-video{max-width:1100px;margin:0 auto!important}
.mp-video .elementor-wrapper{overflow:hidden;border-radius:4px;box-shadow:0 40px 80px -40px rgba(29,56,99,.55)}

/* ---------- 6. notre approche ---------- */
.mp-steps-head{background:var(--mp-navy-deep);padding-top:clamp(70px,9vw,120px)}
.mp-on-dark .elementor-heading-title{color:var(--mp-bg)!important}
.mp-steps{background:var(--mp-navy-deep);padding:clamp(36px,4vw,56px) 0 clamp(80px,10vw,130px)}
.mp-steps > .elementor-container{max-width:1320px!important;margin:0 auto;gap:18px}
.mp-step > .elementor-widget-wrap{position:relative;background:rgba(255,255,255,.04);border:1px solid rgba(134,151,166,.28);padding:clamp(28px,3vw,40px)!important;height:100%;transition:background .4s,border-color .4s}
.mp-step:hover > .elementor-widget-wrap{background:rgba(255,255,255,.07);border-color:rgba(191,121,59,.6)}
.mp-step-box .elementor-image-box-title{font-family:var(--mp-display);font-weight:400;font-size:1.35rem;margin:0 0 10px;line-height:1.25;padding-right:76px}
.mp-step-box .elementor-image-box-title a{color:var(--mp-bg)!important;pointer-events:none}
.mp-step-box .elementor-image-box-description{color:rgba(249,247,245,.75)!important;margin:0}
.mp-step-box .elementor-image-box-wrapper{text-align:left!important}
.mp-step-n{position:absolute!important;top:18px;right:22px;width:auto!important;margin:0!important}
.mp-step-n .elementor-heading-title{font-size:3.4rem!important;line-height:1;color:transparent!important;-webkit-text-stroke:1px var(--mp-copper)}

/* ---------- 7. pourquoi nous choisir ---------- */
.mp-why{padding:clamp(80px,10vw,140px) 0}
.mp-why > .elementor-container{align-items:center}
.mp-house-wide{position:relative;z-index:0}
.mp-house-wide img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;box-shadow:none!important;clip-path:polygon(0 100%,0 24%,50% 0,100% 24%,100% 100%)}
.mp-why-copy > .elementor-widget-wrap{position:relative;z-index:1;margin-left:-70px;background:var(--mp-navy);color:rgba(249,247,245,.85);padding:clamp(30px,4vw,56px)!important;box-shadow:0 40px 80px -40px rgba(21,43,77,.6)}
.mp-why-text h2{font-family:var(--mp-display);font-weight:400;font-size:clamp(1.7rem,2.6vw,2.4rem);color:var(--mp-bg);margin:0 0 18px;line-height:1.15}
.mp-why-text h2 strong{font-weight:400;color:inherit}
.mp-why-text h2::before{content:"";display:block;width:44px;height:2px;background:var(--mp-copper);margin-bottom:18px}
.mp-why-text strong{color:#fff}
.mp-why-text a{color:var(--mp-copper-light)!important}
.mp-why-text a:hover{color:#fff!important}
.mp-why-text ul{list-style:none;padding:0;display:grid;gap:8px;margin:12px 0 0}
.mp-why-text ul li{position:relative;padding-left:24px}
.mp-why-text ul li::before{content:"";position:absolute;left:0;top:.75em;width:12px;height:1px;background:var(--mp-copper)}

/* ---------- 8. avis ---------- */
.mp-reviews-sec{background:var(--mp-surface);padding:clamp(70px,9vw,120px) 0}
.mp-reviews-sec > .elementor-container{max-width:1320px!important;margin:0 auto}
.mp-reviews{margin-top:36px!important}

/* ---------- 9. zone d'intervention ---------- */
.mp-zone{padding:clamp(80px,10vw,140px) 0}
.mp-zone-copy > .elementor-widget-wrap{padding-right:clamp(20px,4vw,60px)}
.mp-cities{color:#3b3f46;margin-top:18px!important}
.mp-cities ul{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mp-cities li a{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--mp-line);background:#fff;color:var(--mp-ink);font-size:.95rem;line-height:1.3;transition:border-color .3s,color .3s,transform .4s var(--mp-ease)}
.mp-cities li a::before{content:"";flex:none;width:8px;height:8px;border:2px solid var(--mp-copper);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.mp-cities li a:hover{border-color:var(--mp-copper);color:var(--mp-copper-strong);transform:translateX(3px)}
.mp-map{position:relative}
.mp-map iframe{display:block;width:100%;height:clamp(340px,40vw,480px)!important;border:0;filter:grayscale(.35) contrast(1.05)}
.mp-map::after{content:"";position:absolute;right:-14px;bottom:-14px;width:40%;height:30%;border-right:2px solid var(--mp-copper);border-bottom:2px solid var(--mp-copper);pointer-events:none}

/* ---------- 10. appel à l'action ---------- */
.mp-cta{position:relative;padding:clamp(100px,13vw,180px) 0;text-align:center;overflow:hidden}
.mp-cta::before{content:"";position:absolute;inset:0;background:rgba(21,43,77,.86)}
.mp-cta > .elementor-container{position:relative;z-index:1}
.mp-cta-title .elementor-heading-title{font-size:clamp(2.2rem,5.4vw,4.8rem)!important;color:var(--mp-bg)!important;white-space:pre-line;font-family:var(--mp-display)!important;font-weight:400!important;letter-spacing:0!important;line-height:1.1!important}
.mp-cta-title .elementor-heading-title::before{content:"";display:block;width:min(420px,70%);height:60px;margin:0 auto 30px;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--mp-copper) 50%,transparent calc(50% + 1px)) left/64% 100% no-repeat,linear-gradient(to bottom right,transparent calc(50% - 1px),var(--mp-copper) 50%,transparent calc(50% + 1px)) right/36% 100% no-repeat}
.mp-cta-text{color:rgba(249,247,245,.82);max-width:60ch;margin:22px auto 34px!important;font-size:1.1rem}
.mp-cta .mp-btn{text-align:center}

/* ---------- apparitions (seulement si JS actif, jamais dans l'éditeur Elementor) ---------- */
.mp-js .mp-r{opacity:0;transform:translateY(26px);transition:opacity 1s var(--mp-ease),transform 1.1s var(--mp-ease)}
.mp-js .mp-r.mp-in{opacity:1;transform:none}
.mp-js .mp-house.mp-r{transform:translateY(40px) scale(.96)}
.mp-js .mp-house.mp-r.mp-in{transform:none}

/* ---------- tablette / mobile ---------- */
@media (max-width:1024px){
  .mp-card,.mp-card:nth-child(-n+4){grid-column:span 6}
  .mp-why-copy > .elementor-widget-wrap{margin-left:-40px}
}
@media (max-width:767px){
  .mp-hero-copy > .elementor-widget-wrap,.mp-split-media > .elementor-widget-wrap,.mp-zone-copy > .elementor-widget-wrap{padding-right:0}
  .mp-statement > .elementor-container > .elementor-column{flex:1 1 100%}
  .mp-st-media{max-width:60%;margin:0 auto}
  .mp-offset img{margin-top:0}
  .mp-split-media{margin-bottom:40px}
  .mp-cards-grid > .elementor-widget-wrap{grid-template-columns:1fr}
  .mp-card,.mp-card:nth-child(-n+4){grid-column:auto}
  .mp-steps > .elementor-container{gap:14px}
  .mp-why-copy > .elementor-widget-wrap{margin:-60px 12px 0}
  .mp-cities ul{grid-template-columns:1fr}
  .mp-zone-map{margin-top:36px}
}
@media (prefers-reduced-motion:reduce){
  .mp-js .mp-r{opacity:1;transform:none;transition:none}
}

/* ---------- garde-fous : les réglages Elementor par élément ne doivent pas écraser les espacements du design ---------- */
.mp-sec.elementor-section{margin:0!important}
.mp-hero{padding:150px 0 clamp(60px,9vh,110px)!important}
.mp-split,.mp-why,.mp-zone{padding:clamp(80px,10vw,140px) 0!important}
.mp-cards-head,.mp-steps-head{padding:clamp(70px,9vw,120px) 0 0!important}
.mp-cards,.mp-steps{padding:clamp(36px,4vw,56px) 0 clamp(80px,10vw,130px)!important}
.mp-video-sec,.mp-reviews-sec{padding:clamp(70px,9vw,120px) 0!important}
.mp-cta{padding:clamp(100px,13vw,180px) 0!important}
.mp-sec .elementor-column > .elementor-widget-wrap{padding:0!important}
.mp-sec .mp-zone-copy > .elementor-widget-wrap{padding-right:clamp(20px,4vw,60px)!important}
.mp-sec .mp-step > .elementor-widget-wrap{padding:clamp(28px,3vw,40px)!important}
.mp-sec .mp-why-copy > .elementor-widget-wrap{padding:clamp(32px,4vw,60px)!important}
.mp-sec .elementor-widget{margin-block-end:0}
@media (max-width:767px){
  .mp-hero-copy > .elementor-widget-wrap,.mp-split-media > .elementor-widget-wrap,.mp-zone-copy > .elementor-widget-wrap{padding-right:0!important}
}

/* ---------- lisibilité des textes (liens discrets, plus de gras cuivre partout) ---------- */
.mp-prose,.mp-intro{font-size:1.04rem;line-height:1.8;color:#41464e;max-width:62ch}
.mp-prose a,.mp-intro a,.mp-cities a{color:var(--mp-ink)!important;font-weight:inherit!important;text-decoration:underline;text-decoration-color:rgba(191,121,59,.55);text-decoration-thickness:1px;text-underline-offset:4px}
.mp-prose a:hover,.mp-intro a:hover{color:var(--mp-copper-strong)!important;text-decoration-color:var(--mp-copper)}
.mp-prose strong,.mp-intro strong{font-weight:600;color:var(--mp-ink)}
.mp-prose a strong,.mp-prose strong a{font-weight:600}
.mp-why-text a{color:#fff!important;text-decoration-color:rgba(217,149,89,.7)}
.mp-why-text{font-size:1.02rem;line-height:1.8}

/* ---------- section « nos solutions » : vraie respiration entre image et texte, équerre côté extérieur ---------- */
.mp-split > .elementor-container{gap:clamp(40px,6vw,96px)}
.mp-split-media > .elementor-widget-wrap{padding-right:0!important}
.mp-split > .elementor-container > .elementor-column{width:calc(50% - clamp(20px,3vw,48px))!important}
.mp-bracket::after{right:auto;left:-14px;border-right:0;border-left:2px solid var(--mp-copper)}
.mp-split-copy .mp-sub .elementor-heading-title{font-size:clamp(1.05rem,1.4vw,1.25rem)!important}

/* ---------- cartes : même hauteur, bouton lisible qui ne déborde plus ---------- */
.mp-card,.mp-card > .elementor-widget-container,.mp-card .ekit-wid-con{height:100%}
.mp-card .elementskit-box-style-content,.mp-card .elementskit-box-body p{color:#4a4f57!important}
.mp-card .elementskit-btn{white-space:normal!important;text-transform:none!important;letter-spacing:0!important;font-family:var(--mp-sans)!important;font-weight:600!important;font-size:.95rem!important;line-height:1.4!important;text-align:left}
.mp-card .elementskit-box-footer,.mp-card .box-footer,.mp-card .btn-wraper{max-width:100%}
@media (max-width:767px){
  .mp-split > .elementor-container > .elementor-column{width:100%!important}
  .mp-split > .elementor-container{gap:0}
}

/* encart « Pourquoi nous choisir » : texte clair sur fond marine */
.mp-why-text.mp-prose,.mp-why-text.mp-prose p,.mp-why-text.mp-prose li{color:rgba(249,247,245,.86)!important}
.mp-why-text.mp-prose strong{color:#fff}
.mp-why-text.mp-prose a{color:#fff!important;text-decoration-color:rgba(217,149,89,.8)}
.mp-why-text.mp-prose a:hover{color:#D99559!important}
@media (max-width:767px){.mp-sec .mp-zone-copy > .elementor-widget-wrap{padding-right:0!important}}
