/* ==========================================================================
   Maxelik, page fille Meta Ads (/referencement-payant/facebook-ads/, classes ma-)
   S'appuie sur contenus.css (cn-ek, cn-top, cn-def, cn-px, cn-lx).
   Hero clair : un téléphone avec une publicité, un formulaire instantané.
   ========================================================================== */

/* ---------- hero ---------- */
.ma-hero{position:relative;overflow:clip;isolation:isolate;padding-block:clamp(22px,3.6vh,48px) clamp(26px,4vh,60px);background:radial-gradient(50% 80% at 80% 30%,rgba(0,131,255,.18),transparent 70%),radial-gradient(40% 60% at 0% 100%,rgba(0,186,255,.1),transparent 70%),#eef5fc}
.ma-hero-g{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(28px,4.5vw,72px);align-items:center}
.ma-k{display:inline-flex;align-items:center;gap:10px;font-size:.86rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.ma-k .ico{width:24px;height:24px}
.ma-hero h1{margin-top:12px}
.ma-lead{margin-top:16px;font-size:1.08rem;line-height:1.65;color:var(--ink-2)}
.ma-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.ma-acts .btn-line{background:#fff;box-shadow:none}
.ma-acts .btn-line:hover{box-shadow:none;background:var(--soft-b)}
.ma-proofs{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ma-proofs li{padding:8px 14px;border-radius:999px;background:#fff;font-size:.9rem;color:var(--ink-2);box-shadow:0 10px 24px -18px rgba(10,40,80,.45)}
.ma-proofs b{color:var(--slate)}

/* téléphone, formulaire, emplacements */
.ma-vis{position:relative;height:clamp(380px,60vh,460px)}
.ma-ph{position:absolute;left:12%;top:0;bottom:0;aspect-ratio:9/18;max-width:62%;padding:12px;border-radius:30px;background:#141d22;box-shadow:0 40px 80px -36px rgba(10,40,80,.75)}
.ma-ph-s{height:100%;display:grid;grid-template-rows:auto auto 1fr auto auto;border-radius:20px;background:#fff;overflow:clip}
.ma-po-h{display:grid;grid-template-columns:30px 1fr;gap:0 10px;align-items:center;padding:14px 14px 8px;font-size:.84rem;color:var(--slate)}
.ma-po-h span{grid-row:1/3;width:30px;height:30px;border-radius:50%;background:var(--grad)}
.ma-po-h em{font-style:normal;font-size:.7rem;color:#6b777d}
.ma-po-t{padding:0 14px 10px;font-size:.84rem;line-height:1.45;color:var(--ink-2)}
.ma-po-i{position:relative;display:grid;place-items:end start;padding:12px 14px;background:radial-gradient(70% 80% at 75% 20%,#ffd28a,transparent 70%),linear-gradient(150deg,#ffb35c,#e0573a 60%,#7a2e3a);color:#fff;font-size:.82rem;font-weight:900}
.ma-po-i span{padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.35)}
.ma-po-c{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;background:#f3f6f8;font-size:.8rem;color:var(--ink-2)}
.ma-po-c b{padding:6px 12px;border-radius:6px;background:var(--blue);color:#fff}
.ma-po-r{display:flex;gap:16px;padding:10px 14px 14px}
.ma-po-r i{width:44px;height:8px;border-radius:999px;background:#e3eaef}
.ma-form{position:absolute;right:0;top:9%;width:min(220px,48%);padding:16px;border-radius:var(--r);background:#fff;box-shadow:0 30px 60px -30px rgba(10,40,80,.6);display:grid;gap:8px}
.ma-form-h{font-size:.74rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.ma-form-f{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:6px;background:var(--soft);font-size:.82rem;font-weight:700;color:var(--slate)}
.ma-form-f i{font-style:normal;font-size:.7rem;font-weight:800;color:#2e9e5b}
.ma-form-b{padding:9px;border-radius:6px;background:var(--grad);font-size:.84rem;font-weight:900;text-align:center;color:#fff}
.ma-pl{position:absolute;right:0;bottom:3%;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;width:min(196px,40%)}
.ma-pl li{padding:6px 12px;border-radius:999px;background:var(--slate);font-size:.78rem;font-weight:800;color:#fff}
.ma-pl li:nth-child(even){background:#fff;color:var(--slate);box-shadow:0 10px 20px -14px rgba(10,40,80,.5)}
@media (prefers-reduced-motion:no-preference){
  .ma-form{animation:ma-up .7s var(--ease) .5s both}
  .ma-pl li{animation:ma-up .5s var(--ease) both}
  .ma-pl li:nth-child(1){animation-delay:.8s}.ma-pl li:nth-child(2){animation-delay:.9s}.ma-pl li:nth-child(3){animation-delay:1s}.ma-pl li:nth-child(4){animation-delay:1.1s}.ma-pl li:nth-child(5){animation-delay:1.2s}
}
@keyframes ma-up{from{transform:translateY(16px)}to{transform:none}}

/* ---------- définition + emplacements ---------- */
.ma-def{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.ma-def-t{display:grid;gap:16px}
.ma-def-t>p:not(.cn-ek){font-size:1.04rem;line-height:1.75;color:var(--ink-2)}
.ma-def-t a{font-weight:700}
.ma-em{margin:0;display:grid;gap:16px;padding:clamp(24px,3vw,36px);border-radius:var(--r);background:var(--soft)}
.ma-em figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:1.08rem;color:var(--slate)}
.ma-em figcaption span{font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.ma-em-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ma-em-c{display:grid;align-content:start;gap:8px;padding:16px;border-radius:var(--r);background:#fff}
.ma-em-k{display:flex;align-items:center;gap:8px;font-size:1rem;font-weight:900;color:var(--slate)}
.ma-em-k .ico{width:24px;height:24px}
.ma-em-c ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.ma-em-c li{padding:4px 10px;border-radius:999px;background:var(--soft-b);font-size:.8rem;font-weight:700;color:var(--slate)}
.ma-em-n{font-size:.92rem;line-height:1.6;font-weight:700;color:var(--slate)}

/* ---------- objectifs ---------- */
.ma-ob{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,22px)}
.ma-ob li{display:grid;grid-template-rows:auto auto 1fr auto;gap:10px;padding:clamp(22px,2.4vw,28px);border-radius:var(--r);background:#fff;box-shadow:0 20px 44px -36px rgba(19,40,60,.5)}
.ma-ob-n{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--soft-b);font-size:1.1rem;font-weight:900;color:var(--blue)}
.ma-ob h3{font-size:1.2rem}
.ma-ob li>p:not(.ma-ob-u){font-size:.94rem;line-height:1.6;color:var(--ink-2)}
.ma-ob-u{display:grid;gap:3px;padding:12px 14px;border-radius:var(--r);background:var(--soft);font-size:.88rem;line-height:1.5;color:var(--ink-2)}
.ma-ob-u b{font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
.ma-ob li.is-key{background:var(--slate)}
.ma-ob li.is-key h3{color:#fff}
.ma-ob li.is-key>p:not(.ma-ob-u){color:#c8d3d9}
.ma-ob li.is-key .ma-ob-n{background:var(--grad);color:#fff}
.ma-ob li.is-key .ma-ob-u{background:rgba(255,255,255,.07);color:#dbe4e8}
.ma-ob li.is-key .ma-ob-u b{color:#7fd8ff}

/* ---------- ciblage ---------- */
.ma-ci-s{position:relative;overflow:clip;isolation:isolate;background:radial-gradient(60% 80% at 100% 100%,rgba(0,131,255,.24),transparent 70%),#0f1a22}
.ma-ci-s::after{content:"";position:absolute;z-index:-1;left:-110px;top:-120px;width:420px;aspect-ratio:1;background:url("img/maxelik-symbole.svg") no-repeat center/contain;opacity:.05;filter:brightness(3)}
.ma-ci-s .cn-ek{color:#7fd8ff}
.ma-ci{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:center}
.ma-ci-t{display:grid;gap:16px}
.ma-ci-t>p:not(.cn-ek){font-size:1.04rem;line-height:1.7;color:#c8d3d9}
.ma-ci-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ma-ci-c{display:grid;align-content:start;gap:14px;padding:clamp(22px,2.4vw,28px);border-radius:var(--r);background:rgba(255,255,255,.05)}
.ma-ci-c.is-auto{background:radial-gradient(120% 120% at 100% 0%,#0a4a91 0%,#112a40 60%,#141d22 100%)}
.ma-ci-k{font-size:.76rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#7fd8ff}
.ma-ci-c ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.ma-ci-c li{display:grid;gap:3px;font-size:.92rem;line-height:1.55;color:#b8c5cc}
.ma-ci-c li b{font-size:1rem;color:#fff}

/* ---------- formats ---------- */
.ma-fo{list-style:none;margin:clamp(32px,4vw,52px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,22px)}
.ma-fo li{display:grid;grid-template-rows:auto auto 1fr;gap:10px;padding:clamp(20px,2.2vw,26px);border-radius:var(--r);background:var(--soft)}
.ma-fo h3{font-size:1.15rem;margin-top:4px}
.ma-fo p{font-size:.94rem;line-height:1.6;color:var(--ink-2)}
.ma-fo-v{position:relative;display:flex;justify-content:center;align-items:center;gap:8px;height:110px;border-radius:var(--r);background:#fff;overflow:clip}
.ma-fo-v i{display:block;border-radius:6px;background:linear-gradient(150deg,#9cc7ff,#0083ff)}
.v-img i{width:78px;height:78px}
.v-reel i{width:48px;height:86px;background:linear-gradient(170deg,#ffb35c,#e0573a 70%)}
.v-reel span{position:absolute;left:50%;top:50%;margin:-8px 0 0 -5px;border-style:solid;border-width:8px 0 8px 12px;border-color:transparent transparent transparent #fff}
.v-car i{width:56px;height:70px;opacity:.55}.v-car i:nth-child(2){width:64px;height:80px;opacity:1}
.v-col{display:grid;grid-template-columns:repeat(3,26px);grid-template-rows:46px 26px;gap:6px;justify-content:center;align-content:center;align-items:stretch}
.v-col .big{grid-column:1/-1;height:auto}
.v-col i{background:linear-gradient(150deg,#d7e8fb,#7fb8f5)}
.v-lead{flex-direction:column;gap:6px}
.v-lead span{width:120px;height:14px;border-radius:4px;background:var(--soft-b)}
.v-lead b{width:120px;height:18px;border-radius:4px;background:var(--grad)}
.v-msg{flex-direction:column;align-items:stretch;padding:14px 30px;gap:6px}
.v-msg span{height:16px;border-radius:999px}
.v-msg .a{width:60%;background:var(--soft-b)}
.v-msg .b{width:55%;align-self:flex-end;background:var(--grad)}
.v-msg .s{width:40%}

/* ---------- mesure ---------- */
.ma-me{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,80px);align-items:center}
.ma-me-t{display:grid;gap:16px}
.ma-me-t>p:not(.cn-ek){font-size:1.04rem;line-height:1.75;color:var(--ink-2)}
.ma-fl{margin:0;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) minmax(0,1fr);grid-template-rows:auto auto auto;gap:14px;padding:clamp(24px,3vw,36px);border-radius:var(--r);background:#fff;box-shadow:0 30px 60px -40px rgba(19,40,60,.55)}
.ma-fl>div{display:grid;gap:2px;align-content:center;padding:14px;border-radius:var(--r);background:var(--soft)}
.ma-fl b{font-size:.98rem;font-weight:900;color:var(--slate)}
.ma-fl span{font-size:.8rem;line-height:1.4;color:var(--ink-2)}
.ma-fl-s{grid-row:1/3}
.ma-fl-b{grid-row:1/3;display:grid;gap:10px!important;background:none!important;padding:0!important}
.ma-fl-b p{display:grid;gap:2px;padding:14px;border-radius:var(--r);background:var(--soft-b)}
.ma-fl-d{grid-row:1/2}
.ma-fl-m{grid-row:2/3;background:var(--slate)!important}
.ma-fl-m b{color:#fff}
.ma-fl-m span{color:#c8d3d9}
.ma-fl-m .ico{width:22px;height:22px;padding:3px;box-sizing:content-box;border-radius:6px;background:#fff}
.ma-fl-n{grid-column:1/-1;font-size:.86rem;font-weight:700;color:var(--slate)}

/* ---------- responsive ---------- */
@media (max-width:1100px){.ma-ob,.ma-fo{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1000px){
  .ma-hero-g,.ma-def,.ma-ci,.ma-me{grid-template-columns:1fr}
}
@media (max-width:700px){
  .ma-ob,.ma-fo,.ma-ci-g,.ma-em-g{grid-template-columns:1fr}
  .ma-vis{height:420px}
  .ma-ph{left:0;max-width:60%}
  .ma-form{width:52%;top:6%}
  .ma-pl{display:none}
  .ma-fl{grid-template-columns:1fr;grid-template-rows:none}
  .ma-fl>div,.ma-fl-b,.ma-fl-d,.ma-fl-m,.ma-fl-s{grid-row:auto}
}

/* 04/11/2026 : section de zone */
.ma-zn-s .cn-zn-c li:has(a){padding:0}
.ma-zn-s .cn-zn-c li a{display:block;padding:7px 14px;border-radius:999px;color:#fff;text-decoration:none}
.ma-zn-s .cn-zn-c li a:hover{background:rgba(0,131,255,.45)}
.ma-zn-s .cn-zn-t a{font-weight:700;color:#7fd8ff}