/* Mozalami PoC - accueil - v1 - tout est limite a .mz pour ne pas toucher le reste du theme */
:root{--mz-red:#C8102E;--mz-red-dark:#9E0C24;--mz-ink:#17181C;--mz-gold:#FBBC04;--mz-gold-hover:#E3AE22;--mz-gold-soft:#FFF6DD;--mz-gold-line:#7A5C00;--mz-ink2:#4A4F59;--mz-line:#E6E3DF;--mz-soft:#F7F5F3;--mz-dark:#16181D;--mz-r:14px}
html{scroll-behavior:smooth}

/* accueil : on masque l'en-tete et le pied du theme, et on libere la largeur */
body.home .site-header,body.home .site-footer,body.home .entry-header,body.home #generate-slideout-menu{display:none!important}
body.home .site-content{display:block;padding:0}
body.home .grid-container,body.home .site.grid-container{max-width:none}
body.home .inside-article,body.home .entry-content,body.home .separate-containers .inside-article{padding:0!important;margin:0!important;background:transparent}
body.home .site-main>*{margin-bottom:0}
body.home.separate-containers .site-main{margin:0}

.mz{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--mz-ink);background:#fff;line-height:1.6;font-size:17px}
.mz *{box-sizing:border-box}
.mz a{color:inherit;text-decoration:none}
.mz h1,.mz h2,.mz h3{line-height:1.15;letter-spacing:-.02em;margin:0;color:var(--mz-ink)}
.mz p{margin:0 0 16px}
.mz section{padding:96px 0}
.mz-wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.mz h2{font-size:clamp(28px,3.4vw,40px);margin-bottom:16px}
.mz-eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mz-red);margin-bottom:12px}
.mz-soft{background:var(--mz-soft)}
.mz-narrow{max-width:900px;color:var(--mz-ink2)}
.mz .mz-btn{display:inline-block;padding:14px 26px;border-radius:999px;font-weight:700;font-size:15px;letter-spacing:.04em;border:2px solid var(--mz-red);background:var(--mz-red);color:#fff;transition:.2s;cursor:pointer;font-family:inherit}
.mz .mz-btn:hover{background:var(--mz-red-dark);border-color:var(--mz-red-dark)}
.mz .mz-btn.ghost{background:transparent;color:var(--mz-ink);border-color:var(--mz-ink)}
.mz .mz-btn.ghost:hover{background:var(--mz-ink);color:#fff}

/* en-tete */
.mz-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--mz-line)}
.mz-nav{display:flex;align-items:center;justify-content:space-between;height:72px;gap:28px}
.mz-logo{font-weight:800;font-size:22px;letter-spacing:-.03em}
.mz-logo b{color:var(--mz-red)}
.mz-menu{flex:1;display:flex;justify-content:center}
.mz-menu ul{display:flex;gap:26px;list-style:none;margin:0;padding:0;font-size:15px;font-weight:600}
.mz-menu a:hover{color:var(--mz-red)}
.mz-right{display:flex;gap:12px;align-items:center}
.mz .mz-lang{font-size:14px;font-weight:700;border:1.5px solid var(--mz-line);border-radius:999px;padding:6px 12px}
.mz-lang span{color:var(--mz-red)}
.mz-right .mz-btn{padding:10px 20px}

/* hero */
.mz .mz-hero{padding:88px 0 72px;background:linear-gradient(180deg,#fff 0%,var(--mz-soft) 100%)}
.mz-hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center}
.mz .mz-hero h1{font-size:clamp(38px,5.2vw,64px);margin-bottom:22px}
.mz-hero h1 em{font-style:normal;color:var(--mz-red)}
.mz-hero .mz-btn.ghost{margin-left:10px}
.mz-lead{font-size:20px;color:var(--mz-ink2);max-width:620px;margin-bottom:30px}
.mz-tag{font-size:14px;color:var(--mz-ink2);margin-bottom:18px;font-weight:600}
.mz-kpis{display:grid;gap:14px}
.mz-kpi{background:#fff;border:1px solid var(--mz-line);border-left:5px solid var(--mz-red);border-radius:var(--mz-r);padding:20px 24px}
.mz-kpi strong{display:block;font-size:30px;letter-spacing:-.02em}
.mz-kpi span{color:var(--mz-ink2);font-size:15px}

/* a propos */
.mz-two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.mz-two p{color:var(--mz-ink2)}
.mz-two p a{color:var(--mz-red);font-weight:700}
.mz .mz-pull{font-size:26px;font-weight:700;line-height:1.3;color:var(--mz-ink);border-left:5px solid var(--mz-red);padding-left:22px;margin-bottom:26px}
.mz-refs{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.mz-refs span{padding:12px 22px;border:1px solid var(--mz-line);border-radius:999px;font-weight:700;background:#fff}

/* etapes */
.mz-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.mz-step{background:#fff;border:1px solid var(--mz-line);border-radius:var(--mz-r);padding:26px}
.mz-step i{font-style:normal;font-size:13px;font-weight:800;color:var(--mz-red);letter-spacing:.1em}
.mz-step h3{font-size:22px;margin:8px 0 14px}
.mz-bar{height:8px;border-radius:8px;background:var(--mz-line);overflow:hidden}
.mz-bar b{display:block;height:100%;width:100%;background:var(--mz-red)}
.mz-step small{display:block;margin-top:8px;color:var(--mz-ink2);font-size:13px}

/* comment */
.mz-cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.mz-card{background:#fff;border:1px solid var(--mz-line);border-radius:var(--mz-r);padding:30px;display:block}
.mz-card h3{font-size:22px;margin-bottom:12px}
.mz-card p{color:var(--mz-ink2);font-size:16px}
.mz-card small{color:var(--mz-red);font-weight:700}
.mz-card .n{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--mz-red);color:#fff;font-weight:800;margin-bottom:16px}

/* defilement horizontal */
.mz-swipe{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 2px 22px;margin-top:30px;-webkit-overflow-scrolling:touch}
.mz-swipe::-webkit-scrollbar{height:8px}
.mz-swipe::-webkit-scrollbar-thumb{background:var(--mz-red);border-radius:8px}
.mz-swipe::-webkit-scrollbar-track{background:var(--mz-line);border-radius:8px}
.mz-svc{flex:0 0 300px;scroll-snap-align:start;background:var(--mz-dark);color:#fff;border-radius:var(--mz-r);padding:30px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.mz-svc::after{content:"";position:absolute;right:-40px;top:-40px;width:130px;height:130px;border-radius:50%;background:var(--mz-red);opacity:.9}
.mz-svc i{font-style:normal;font-size:14px;font-weight:800;letter-spacing:.12em;position:relative;z-index:1;color:#fff}
.mz .mz-svc h3{font-size:22px;position:relative;z-index:1;color:#fff}
.mz-hint{font-size:14px;color:var(--mz-ink2);margin-top:6px}
.mz-intro p{color:var(--mz-ink2);max-width:880px}
.mz-quote{flex:0 0 420px;scroll-snap-align:start;background:#fff;border:1px solid var(--mz-line);border-radius:var(--mz-r);padding:30px;display:flex;flex-direction:column;gap:18px}
.mz-quote p{font-size:16px;color:var(--mz-ink2);margin:0}
.mz-quote footer{margin-top:auto;font-size:14px}
.mz-quote footer b{display:block;color:var(--mz-ink);font-size:16px}
.mz-rating{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:26px;padding:22px 26px;background:#fff;border:1px solid var(--mz-line);border-radius:var(--mz-r)}
.mz-rating strong{font-size:34px;color:var(--mz-red)}
.mz-rating .mz-q{flex:1;min-width:260px;color:var(--mz-ink2)}
.mz-rating .mz-btn{padding:10px 20px}

/* faq */
.mz-faq{margin-top:30px;border-top:1px solid var(--mz-line)}
.mz-faq a{display:flex;justify-content:space-between;align-items:center;padding:22px 4px;border-bottom:1px solid var(--mz-line);font-size:20px;font-weight:700}
.mz-faq a:hover{color:var(--mz-red)}
.mz-faq a span{color:var(--mz-red);font-size:24px}
.mz-arch{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:30px}
.mz-arch .mz-card h3{font-size:19px}
.mz-arch .mz-card img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;border-radius:10px;margin-bottom:18px}

/* contact */
.mz .mz-contact{background:var(--mz-dark);color:#fff}
.mz-contact h2{color:#fff}
.mz-contact p{color:#C9CCD3}
.mz-form{display:grid;gap:14px}
.mz-form input,.mz-form textarea{width:100%;padding:15px 18px;border-radius:12px;border:1px solid #3A3E48;background:#1F222A;color:#fff;font:inherit}
.mz-form textarea{min-height:130px}
.mz-coords{display:grid;gap:10px;margin-top:22px;font-size:18px;color:#fff}
.mz-area{margin-top:22px;font-size:15px}

.mz-foot{background:#0E1013;color:#9EA3AD;padding:44px 0;font-size:15px}
.mz-foot .mz-row{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.mz-foot a:hover{color:#fff}

/* barre fixe du pouce (mobile) */
.mz-thumb{display:none}
@media (max-width:860px){
  .mz section{padding:64px 0}
  .mz-menu,.mz-kpis{display:none}
  .mz-hero-grid,.mz-two,.mz-cols3,.mz-steps,.mz-arch{grid-template-columns:1fr}
  .mz-svc{flex-basis:78%}.mz-quote{flex-basis:88%}
  body.home{padding-bottom:78px}
  .mz-thumb{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--mz-line);padding:8px 6px calc(8px + env(safe-area-inset-bottom))}
  .mz-thumb a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:700;color:var(--mz-ink2)}
  .mz-thumb a svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8}
  .mz-thumb a.on,.mz-thumb a:hover{color:var(--mz-red)}
}

/* correctifs staging (GeneratePress) : colonne laterale, fond, graisse des titres */
body.home{background:#fff}
body.home #right-sidebar,body.home #left-sidebar,body.home .widget-area{display:none!important}
body.home #primary,body.home .content-area{width:100%!important;float:none!important;max-width:none!important}
.mz h1,.mz h2,.mz h3{font-weight:800}
.mz-step h3,.mz-card h3,.mz-svc h3{font-weight:800}
body.home #lang_sel_footer,body.home .wpml-ls-statics-footer{display:none!important}
body.admin-bar .mz-header{top:32px}
@media (max-width:782px){body.admin-bar .mz-header{top:46px}}

/* carrousels : fleches et glisser a la souris ; FAQ en accordeon ; ancres sous l'en-tete collant */
.mz-swipe{cursor:grab}
.mz-ctrl{display:flex;gap:10px;justify-content:flex-end;margin-top:6px}
.mz .mz-ctrl button{width:46px;height:46px;border-radius:50%;border:2px solid var(--mz-ink);background:#fff;color:var(--mz-ink);cursor:pointer;display:grid;place-items:center;padding:0}
.mz .mz-ctrl button:hover{background:var(--mz-red);border-color:var(--mz-red);color:#fff}
.mz-ctrl svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.4}
.mz-acc{margin-top:30px;border-top:1px solid var(--mz-line)}
.mz-acc details{border-bottom:1px solid var(--mz-line)}
.mz-acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;font-size:20px;font-weight:700}
.mz-acc summary::-webkit-details-marker{display:none}
.mz-acc summary:hover{color:var(--mz-red)}
.mz-acc summary span{color:var(--mz-red);font-size:28px;line-height:1;transition:transform .2s}
.mz-acc details[open] summary span{transform:rotate(45deg)}
.mz-ans{padding:0 4px 24px;max-width:860px}
.mz-ans p{color:var(--mz-ink2);margin:0}
.mz section[id]{scroll-margin-top:76px}
body.admin-bar .mz section[id]{scroll-margin-top:108px}

/* logo, portrait du hero, logos clients */
.mz-logo{display:flex;align-items:center;gap:10px}
.mz-logo-img{height:46px;width:auto;display:block}
.mz-hero-grid{grid-template-columns:1.05fr .95fr}
.mz-hero-img{display:block}
.mz-hero-img img{width:100%;height:auto;max-height:560px;object-fit:cover;object-position:top center;border-radius:24px;display:block}
.mz-hero .mz-kpis{grid-template-columns:repeat(3,1fr);margin-top:40px}
.mz-client{background:#fff;border:1px solid var(--mz-line);border-radius:var(--mz-r);overflow:hidden;aspect-ratio:7/5}
.mz-client img{width:100%;height:100%;object-fit:contain;display:block}
.mz-refs:has(.mz-client){display:grid;grid-template-columns:repeat(6,1fr);gap:14px}

/* cartes retournables (Comment je le fais) : le texte reste dans le HTML */
.mz-flips{perspective:none}
.mz-flip{height:330px;perspective:1100px;cursor:pointer;outline-offset:4px}
.mz-flip-in{position:relative;width:100%;height:100%;transition:transform .6s;transform-style:preserve-3d}
.mz-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:var(--mz-r);padding:30px;display:flex;flex-direction:column;overflow:auto}
.mz-front{background:#fff;border:1px solid var(--mz-line);justify-content:space-between}
.mz-front h3{font-size:26px}
.mz-front small{color:var(--mz-red);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:12px}
.mz-front .n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--mz-red);color:#fff;font-weight:800}
.mz-back{background:var(--mz-dark);color:#fff;transform:rotateY(180deg)}
.mz .mz-back h3{color:#fff;font-size:20px;margin-bottom:12px}
.mz-back p{color:#D6D9DF;font-size:15px;line-height:1.55;margin:0}
.mz-flip.is-flipped .mz-flip-in{transform:rotateY(180deg)}
@media (hover:hover){.mz-flip:hover .mz-flip-in,.mz-flip:focus-visible .mz-flip-in{transform:rotateY(180deg)}}
@media (max-width:860px){

  .mz-hero-img img{max-height:340px}
  .mz-refs:has(.mz-client){grid-template-columns:repeat(2,1fr)}
  .mz-flip{height:360px}
}
@media (prefers-reduced-motion:reduce){.mz-flip-in{transition:none}}

/* menu : une seule ligne meme avec le logo ; titre du hero un peu plus petit avec le portrait */
.mz-menu ul{gap:18px;flex-wrap:nowrap;font-size:14px}
.mz-menu a{white-space:nowrap}
.mz .mz-hero h1{font-size:clamp(36px,4.4vw,56px)}
@media (max-width:1180px){.mz-logo>span{display:none}.mz-menu ul{gap:14px;font-size:13px}}

/* correctifs d'ordre : selecteur de langue sur une ligne, hero en une colonne sur mobile */
.mz .mz-lang{white-space:nowrap}
.mz-hero-grid{grid-template-columns:1.15fr .85fr}
@media (max-width:860px){.mz-hero-grid{grid-template-columns:1fr}.mz-hero .mz-btn.ghost{margin-left:0;margin-top:10px}}
@media (max-width:860px){.mz .mz-hero{padding:40px 0 48px}.mz-hero-img img{max-height:380px}}
.mz-rating .mz-g{width:30px;height:30px;display:block}

/* portrait : l'image source est large (1920x960), on cadre sur le visage a droite */
.mz-hero-img img{aspect-ratio:5/6;max-height:none;object-position:86% 50%;background:#EDEDED}
@media (max-width:860px){.mz-hero-img img{aspect-ratio:1/1;max-height:none}}

/* Services : le texte complet s'ouvre dans un bloc large sous les cartes */
.mz-swipe{align-items:stretch}
.mz-svc{justify-content:flex-start;gap:14px;cursor:pointer}
.mz-svc .mz-more{position:relative;z-index:1;margin-top:auto;font-weight:800;font-size:14px;letter-spacing:.04em;color:#fff;text-decoration:underline}
.mz-svc.on{outline:3px solid var(--mz-red);outline-offset:-3px}
.mz-svc:focus-visible{outline:3px solid var(--mz-red)}
.mz-svc-panels{margin-top:10px}
.mz-svc-panel{position:relative;background:#fff;border:1px solid var(--mz-line);border-left:6px solid var(--mz-red);border-radius:var(--mz-r);padding:34px 38px;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.mz-svc-panel[hidden]{display:none}
.mz-svc-panel h3{font-size:26px;margin:0 70px 16px 0}
.mz-close{position:absolute;right:20px;top:20px;border:1px solid var(--mz-line);background:#fff;border-radius:999px;padding:8px 16px;font:inherit;font-weight:700;cursor:pointer}
.mz-svc-txt{font-size:16px;line-height:1.65}
.mz-svc-txt h4{font-size:17px;margin:18px 0 6px}
.mz-svc-txt p{margin:0 0 12px}
@media(min-width:1000px){.mz-svc-txt{column-count:2;column-gap:44px}.mz-svc-txt h4{break-after:avoid}}
@media(max-width:700px){.mz-svc-panel{padding:24px 20px}.mz-svc-panel h3{font-size:21px}}
.mz-form{position:relative}
.mz-formmsg{margin:0;min-height:1.2em;color:#fff;font-weight:700}

/* T50 : zone Contact de l'accueil (FR et EN), palette or, mise en page inchangee */
.home .mz .mz-contact{background:var(--mz-gold);color:var(--mz-ink)}
.home .mz-contact h2,.home .mz-contact p,.home .mz-contact .mz-coords,.home .mz-contact .mz-coords b{color:var(--mz-ink)}
.home .mz-contact .mz-form input,.home .mz-contact .mz-form textarea{background:var(--mz-gold-soft);color:var(--mz-ink);border:1px solid var(--mz-gold-line)}
.home .mz-contact .mz-form input::placeholder,.home .mz-contact .mz-form textarea::placeholder{color:#5A4A1A}
.home .mz .mz-contact .mz-btn{background:var(--mz-red);border-color:var(--mz-red);color:#FFFFFF}
.home .mz .mz-contact .mz-btn:hover{background:var(--mz-red-dark);border-color:var(--mz-red-dark)}