:root{
  --accent:#9c6b3e; --accent-light:#c3986a; --gold:#cfa15c; --deep:#2c2115;
  --ink:#3a352c; --muted:#6b6358;
  --cream:#fdfbf6; --line:#ece2d0; --white:#fff;
  --surface:#fff; --surface-soft:#f5ecdc;
  --font-display:'Fraunces','Georgia','Times New Roman',serif;
  --font-body:'Work Sans',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--accent:#dba566;--accent-light:#e3bd87;--gold:#e2b467;--deep:#f2e9da;--ink:#f1e7d8;--muted:#b9ac97;--cream:#17130c;--line:#3a2e1f;--surface:#241c13;--surface-soft:#2c2216;}}:root[data-theme="dark"]{--accent:#dba566;--accent-light:#e3bd87;--gold:#e2b467;--deep:#f2e9da;--ink:#f1e7d8;--muted:#b9ac97;--cream:#17130c;--line:#3a2e1f;--surface:#241c13;--surface-soft:#2c2216;}body{transition:background-color .25s ease,color .25s ease}.themeToggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);background:var(--surface);border-radius:11px;cursor:pointer;color:var(--accent);flex:none;transition:background-color .2s,border-color .2s}.themeToggle:hover{background:var(--surface-soft)}.themeToggle svg{width:19px;height:19px;display:block}.themeToggle .iconMoon{display:none}:root[data-theme="dark"] .themeToggle .iconSun{display:none}:root[data-theme="dark"] .themeToggle .iconMoon{display:block}@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .themeToggle .iconSun{display:none}:root:not([data-theme="light"]) .themeToggle .iconMoon{display:block}}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--cream);padding-top:87px}
h1,h2,h3{font-family:var(--font-display);font-weight:600}
a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 40px));margin:auto}
.topstrip{position:fixed;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--accent) 0 33%,var(--gold) 33% 66%,var(--deep) 66%);z-index:21}
nav{position:fixed;top:5px;left:0;right:0;height:82px;background:rgba(255,255,255,.94);backdrop-filter:blur(15px);border-bottom:1px solid var(--line);z-index:20}
.navin{height:100%;display:flex;align-items:center;justify-content:space-between}
.logoMini{width:170px;height:auto;display:block}
.links{display:flex;align-items:center;gap:6px;color:#8a806f;font-size:14px;font-weight:400}
.links a{color:inherit;padding:8px 10px;border-radius:8px;background:transparent;transition:background .3s ease,color .3s ease}
.links a:hover{background:#f0e2cf;color:var(--accent)}
.links a.navLinkActive{color:var(--accent);background:#f0e2cf}
.navShop{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:15px;color:#8a806f;padding:8px 10px;border-radius:8px;background:transparent;transition:background .3s ease,color .3s ease}
.navShop:hover{background:#f0e2cf;color:#7a5230}
.navShop svg{display:none}
.actions{display:flex;align-items:center;gap:10px}.login{padding:11px 12px;color:var(--muted);font-weight:700;font-size:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:11px;background:var(--accent);color:#fff;padding:13px 19px;font-weight:850;box-shadow:0 10px 22px #9c6b3e22}.btn:hover{background:#2c2115}.btn.orange{background:linear-gradient(135deg,#cfa15c,#a97a3a)}.btn.white{background:var(--surface);color:var(--accent);box-shadow:none}
nav .btn,.mobilePanel .btn{background:#f6ece0;color:var(--ink);border:1px solid #ece2d0;box-shadow:none;font-weight:500;transform:none!important}
nav .btn:hover,.mobilePanel .btn:hover{background:#f6ece0;border-color:#c3986a;color:var(--accent);box-shadow:none;transform:none!important}
.hero{position:relative;overflow:hidden;background:
 radial-gradient(circle at 82% 15%,var(--surface-soft) 0,transparent 25%),
 radial-gradient(circle at 8% 75%,var(--surface-soft) 0,transparent 28%),
 linear-gradient(180deg,var(--cream),var(--surface-soft));
 padding:72px 0 82px}
.hero:after{content:"";position:absolute;width:500px;height:500px;border:1px solid var(--line);border-radius:50%;right:-250px;bottom:-300px}
.heroGrid{position:relative;z-index:1;display:grid;grid-template-columns:1.02fr .98fr;gap:65px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--surface-soft);border:1px solid #ece2d0;color:var(--accent);padding:7px 12px;border-radius:999px;font-size:12px;font-weight:850}
.pill i{width:7px;height:7px;border-radius:50%;background:#c3986a}
h1{font-size:59px;line-height:1.01;letter-spacing:-.5px;margin:19px 0;color:var(--deep)}
h1 .green{color:var(--accent)}h1 .orange{color:#cfa15c}
.lead{font-size:18px;line-height:1.72;color:var(--muted);max-width:600px}
.heroBtns{display:flex;gap:11px;margin:29px 0 22px}.heroNote{font-size:12px;color:var(--muted)}.heroNote b{color:var(--accent)}
.logoStage{position:relative;background:var(--surface);border:1px solid #ece2d0;border-radius:28px;padding:26px;box-shadow:0 28px 70px #2c211520}
.logoStage:before{content:"";position:absolute;inset:11px;border:1px dashed #ece2d0;border-radius:21px;pointer-events:none}
.logoMain{position:relative;width:100%;display:block;border-radius:17px}
.demoPreview{position:relative;background:var(--surface-soft);border:1px solid #ece2d0;border-radius:17px;overflow:hidden}
.demoPreview img{display:block;width:100%;height:auto}
.demoPreviewTop{display:flex;align-items:center;gap:6px;margin-bottom:16px}
.demoDot{width:8px;height:8px;border-radius:50%;background:var(--line)}
.demoDot:nth-child(1){background:#a63f2f}.demoDot:nth-child(2){background:#c7962c}.demoDot:nth-child(3){background:#0f4a2a}
.demoPreviewTitle{margin-left:8px;font-size:12px;font-weight:800;color:var(--ink)}
.demoKpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.demoKpi{background:var(--surface);border:1px solid #ece2d0;border-radius:12px;padding:10px 12px}
.demoKpiLabel{display:block;font-size:10px;color:var(--muted);margin-bottom:4px}
.demoKpiValue{display:block;font-size:15px;font-weight:800;color:var(--ink)}
.demoChart{background:var(--surface);border:1px solid #ece2d0;border-radius:12px;padding:10px 10px 0}
.demoChart span{display:block;font-size:10px;color:var(--muted);padding:2px 2px 6px;font-weight:700}
.demoChart svg{display:block;width:100%;height:70px}
.logoCaption{display:flex;align-items:center;justify-content:space-between;padding:15px 5px 2px;font-size:11px;color:var(--muted)}
.flagline{display:flex;gap:5px}.flagline i{width:20px;height:4px;border-radius:10px}.flagline i:nth-child(1){background:var(--accent)}.flagline i:nth-child(2){background:var(--gold)}.flagline i:nth-child(3){background:var(--deep)}
.trustbar{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0}.trustin{display:flex;justify-content:space-between;align-items:center;gap:20px}.trustText{font-size:13px;color:var(--muted)}.trustText strong{color:var(--ink)}.trustItems{display:flex;gap:30px;font-size:12px;font-weight:800;color:var(--muted)}.trustItems span{display:flex;gap:7px;align-items:center}.check{color:var(--accent)}
.section{padding:88px 0}.soft{background:var(--cream)}
.head{text-align:center;max-width:720px;margin:0 auto 45px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--accent);font-weight:950}.head h2{font-size:40px;line-height:1.08;letter-spacing:-.3px;margin:11px 0}.head p{color:var(--muted);line-height:1.7}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.card{border:1px solid var(--line);border-radius:18px;padding:25px;background:var(--surface);box-shadow:0 12px 32px #2c211510}.icon{width:47px;height:47px;border-radius:50%;display:grid;place-items:center;font-size:21px;margin-bottom:18px;box-shadow:0 6px 14px rgba(44,33,21,.18)}.icon svg{width:23px;height:23px}.card h3{margin:0 0 8px;font-size:17px}.card p{margin:0;color:var(--muted);font-size:14px;line-height:1.65}
.aboutGrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}.visual{background:linear-gradient(145deg,#2c2115,#9c6b3e);border-radius:25px;padding:28px;color:#fff;position:relative;overflow:hidden;min-height:350px}.visual:before{content:"";position:absolute;width:250px;height:250px;border:1px solid #ffffff20;border-radius:50%;right:-80px;top:-90px}.visualLogo{width:260px;filter:brightness(0) invert(1);opacity:.96;position:relative}.visual .cardTitle{font-size:27px;max-width:380px;line-height:1.15;margin:28px 0 8px;position:relative;font-family:var(--font-display);font-weight:600}.visual p{color:#cdbfa4;line-height:1.6;font-size:13px;max-width:410px;position:relative}.about h2{font-size:39px;line-height:1.1;letter-spacing:-.3px;margin:8px 0 16px}.about>p{color:var(--muted);line-height:1.75}.checks{display:grid;gap:14px;margin-top:24px}.row{display:flex;gap:12px}.row .tick{width:24px;height:24px;border-radius:50%;background:var(--surface-soft);color:var(--accent);display:grid;place-items:center;font-weight:900;flex:none}.row b{display:block;font-size:14px}.row span{display:block;color:var(--muted);font-size:13px;margin-top:3px}
.featureShow{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}.screen{background:#2c2115;border-radius:23px;padding:9px;box-shadow:0 28px 60px #2c21151c}.screenInner{background:var(--surface-soft);border-radius:15px;overflow:hidden}.screenInner img{display:block;width:100%;height:auto}.bar{height:43px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 13px;font-size:9px;color:var(--muted)}.bar strong{color:var(--accent)}
.featureText h2{font-size:39px;line-height:1.1;letter-spacing:-.3px;margin:8px 0 14px}.featureText p{color:var(--muted);line-height:1.7}.featureList{display:grid;gap:12px;margin-top:22px}.fl{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:750}.fl i{font-style:normal;color:var(--accent);font-size:17px}
.infy{background:#2c2115;color:#fff;padding:78px 0}.infyGrid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.infy h2{font-size:40px;line-height:1.08;letter-spacing:-.3px;margin:10px 0}.infy p{color:#cdbfa4;line-height:1.7}.infyLogo{font-size:35px;font-weight:950}.infyLogo span{color:#55b2ff}.badgeInfy{display:inline-block;border:1px solid #4a3c28;border-radius:999px;padding:7px 11px;color:#cdbfa4;font-size:11px;margin-top:15px}.quote{border-left:3px solid var(--gold);padding-left:18px;color:#ece2d0;font-size:15px;line-height:1.7}.contactCard{background:var(--surface);color:var(--ink);border-radius:20px;padding:28px;box-shadow:0 20px 55px #00000030}.contactCard h3{margin:0 0 7px;font-size:21px}.contactCard p{color:var(--muted);font-size:13px;margin-bottom:20px}.contactRow{display:grid;grid-template-columns:1fr 1fr;gap:10px}.input{border:1px solid var(--line);border-radius:9px;padding:12px;background:var(--surface-soft);color:var(--muted);font-size:12px}.contactCard .btn{width:100%;margin-top:10px}
.cta{padding:76px 0;background:linear-gradient(135deg,#241a10,#2c2115);color:#fff}.ctain{display:flex;justify-content:space-between;align-items:center;gap:30px}.ctain h2{font-size:39px;letter-spacing:-.3px;margin:0 0 9px}.ctain p{margin:0;color:#cdbfa4}.ctain .btn{background:var(--surface);color:var(--accent);box-shadow:none}
footer{background:#2c2115;color:#cdbfa4;padding:16px 0;font-size:11.5px}.foot{display:flex;justify-content:space-between;align-items:center;gap:14px}.footBrand{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}.footLogo{font-size:15px;color:#fff;font-weight:950;line-height:1}.footLogo span{color:#cfa15c}.footTagline{opacity:.85}.footCredit{white-space:nowrap}
@media(max-width:980px){.heroGrid,.aboutGrid,.featureShow,.infyGrid{grid-template-columns:1fr}.dashboard{max-width:700px;margin:auto}.cards{grid-template-columns:1fr 1fr}.visual{min-height:300px}.ctain{display:block}.ctain .btn{margin-top:20px}}
@media(max-width:650px){.container{width:calc(100% - 28px)}h1{font-size:43px;letter-spacing:-.4px}.hero{padding:52px 0 60px}.heroBtns{flex-direction:column}.logoStage{padding:14px}.trustin{display:block}.trustItems{flex-wrap:wrap;margin-top:13px;gap:14px}.cards{grid-template-columns:1fr}.section{padding:62px 0}.head h2,.about h2,.featureText h2,.infy h2,.ctain h2{font-size:31px}.appbody{grid-template-columns:1fr}.appside,.appcart{display:none}.miniProducts{grid-template-columns:1fr 1fr}.contactRow{grid-template-columns:1fr}.foot{flex-direction:column;align-items:flex-start;gap:6px}.actions .login{display:none}}

/* ===== RESPONSIVITÉ ABSOLUE — LOGO MALIPOS ===== */
.logoMini,
.logoMain,
.visualLogo {
  display: block;
  height: auto !important;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

/* Logo de navigation : jamais étiré, jamais rogné */
.logoMini {
  width: min(170px, 28vw);
  max-height: 58px;
  aspect-ratio: auto;
}

/* Logo principal : conserve strictement son ratio d'origine */
.logoMain {
  width: 100%;
  max-width: 100%;
  height: auto !important;
  aspect-ratio: auto;
}

/* Zone qui contient le logo : s'adapte au contenu sans déformation */
.logoStage {
  min-width: 0;
  overflow: hidden;
}
.logoStage .logoMain {
  object-fit: contain;
}

/* Logo sur le bloc vert */
.visualLogo {
  width: min(260px, 75%);
  max-height: 110px;
}

/* Empêche les grilles de casser le logo sur petits écrans */
.heroGrid,
.aboutGrid,
.featureShow,
.infyGrid,
.navin {
  min-width: 0;
}
.heroGrid > *,
.aboutGrid > *,
.featureShow > *,
.navin > * {
  min-width: 0;
}

/* Tablette */
@media (max-width: 980px) {
  .logoMini {
    width: clamp(125px, 22vw, 165px);
    max-height: 52px;
  }

  .logoStage {
    width: 100%;
    padding: clamp(14px, 3vw, 26px);
  }

  .logoMain {
    width: 100%;
    max-width: 100%;
  }

  .visualLogo {
    width: min(250px, 70%);
  }
}

/* Mobile */
@media (max-width: 650px) {
  .navin {
    gap: 10px;
  }

  .logoMini {
    width: clamp(112px, 38vw, 150px);
    max-width: 150px;
    max-height: 45px;
  }

  .logoStage {
    padding: 12px;
    border-radius: 18px;
  }

  .logoStage:before {
    inset: 7px;
    border-radius: 14px;
  }

  .logoMain {
    width: 100%;
    height: auto !important;
  }

  .visualLogo {
    width: min(220px, 82%);
    max-height: 90px;
  }
}

/* Très petits téléphones */
@media (max-width: 380px) {
  .container {
    width: calc(100% - 22px);
  }

  .logoMini {
    width: 115px;
    max-height: 40px;
  }

  .logoStage {
    padding: 9px;
  }

  .logoCaption {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* Accessibilité : réduction des animations si demandée */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* ===== CONTACT STATIQUE + WHATSAPP ===== */
.contactSection{padding:88px 0;background:linear-gradient(180deg,var(--cream),var(--surface))}
.contactGrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:28px;align-items:stretch}
.contactIntro{background:linear-gradient(145deg,#2c2115,#9c6b3e);border-radius:24px;padding:34px;color:#fff;position:relative;overflow:hidden}
.contactIntro:after{content:"";position:absolute;width:280px;height:280px;border:1px solid #ffffff20;border-radius:50%;right:-150px;bottom:-140px}
.contactIntro h2{font-size:36px;line-height:1.1;letter-spacing:-.3px;margin:10px 0 14px;position:relative;z-index:1}
.contactIntro p{color:#cdbfa4;line-height:1.7;font-size:14px;position:relative;z-index:1}
.contactPoints{display:grid;gap:12px;margin-top:25px;position:relative;z-index:1}
.contactPoint{display:flex;gap:11px;align-items:center;font-size:13px}.contactPoint i{width:35px;height:35px;border-radius:10px;background:#ffffff15;display:grid;place-items:center;font-style:normal}
.whatsapp{display:inline-flex;align-items:center;justify-content:center;gap:9px;margin-top:24px;background:#25D366;color:#07351f;border-radius:11px;padding:12px 17px;font-weight:900;font-size:13px;position:relative;z-index:1;box-shadow:0 10px 25px #25d3662e}
.contactForm{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:30px;box-shadow:0 18px 45px #2c211510}
.contactForm h3{margin:0 0 7px;font-size:22px}.contactForm>p{margin:0 0 22px;color:var(--muted);font-size:13px;line-height:1.6}
.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:11px;font-weight:800;color:var(--muted)}.field input,.field select,.field textarea{width:100%;border:1px solid #ece2d0;border-radius:10px;padding:12px 13px;background:var(--surface-soft);color:var(--ink);font:inherit;font-size:13px;outline:none}.field textarea{min-height:115px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#c3986a;box-shadow:0 0 0 3px rgba(156,107,62,.35)}.formBottom{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:17px}.formHint{font-size:10px;color:var(--muted);line-height:1.5}.submitBtn{border:0;cursor:pointer}.success{display:none;margin-top:12px;padding:10px 12px;border-radius:9px;background:var(--surface-soft);color:#c3986a;font-size:12px;font-weight:700}.floatingWhatsApp:hover{transform:translateY(-3px)}
@media(max-width:900px){.contactGrid{grid-template-columns:1fr}.contactIntro{min-height:auto}}
@media(max-width:600px){.contactSection{padding:60px 0}.contactForm,.contactIntro{padding:22px;border-radius:18px}.formGrid{grid-template-columns:1fr}.field.full{grid-column:auto}.formBottom{align-items:stretch;flex-direction:column}.formBottom .btn{width:100%}}


/* ===== DYNAMIC UI ===== */
html{scroll-padding-top:90px}
body.navOpen{overflow:hidden}
.mobileToggle{display:none;position:relative;flex:none;width:44px;height:44px;border:1px solid #ece2d0;background:var(--surface);border-radius:11px;cursor:pointer;padding:0}
.mobileToggle .bar{position:absolute;left:11px;width:22px;height:2px;background:var(--accent);border-radius:2px;transition:transform .3s ease,opacity .2s ease,top .3s ease}
.mobileToggle .bar:nth-child(1){top:16px}
.mobileToggle .bar:nth-child(2){top:21px}
.mobileToggle .bar:nth-child(3){top:26px}
.mobileToggle.open .bar:nth-child(1){top:21px;transform:rotate(45deg)}
.mobileToggle.open .bar:nth-child(2){opacity:0}
.mobileToggle.open .bar:nth-child(3){top:21px;transform:rotate(-45deg)}
.navBackdrop{display:none;position:fixed;inset:0;background:#2c2115;opacity:0;pointer-events:none;transition:opacity .35s ease;z-index:30}
.navBackdrop.open{opacity:.45;pointer-events:auto}
.mobilePanel{display:none;position:fixed;top:0;right:0;height:100vh;width:min(340px,88vw);background:var(--surface);box-shadow:-25px 0 60px rgba(44,33,21,.18);padding:28px 22px 26px;flex-direction:column;gap:4px;transform:translateX(100%);transition:transform .4s cubic-bezier(.16,1,.3,1);z-index:31;overflow-y:auto}
.mobilePanel.open{transform:translateX(0)}
.mobilePanelHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.mobilePanelHead img{width:132px;height:auto}
.mobilePanelClose{width:36px;height:36px;border:1px solid var(--line);background:var(--surface);border-radius:10px;color:var(--accent);font-size:18px;line-height:1;cursor:pointer}
.mobilePanel a{padding:14px 13px;border-radius:10px;font-weight:750;color:var(--ink);font-size:15px}
.mobilePanel a:hover{background:#f0e2cf;color:var(--accent)}
.mobilePanel .navShop{margin-top:8px;padding-top:22px;border-top:1px solid var(--line);border-radius:0;font-weight:400}
.mobilePanel .btn{margin-top:14px;justify-content:center}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
.reveal.visible{opacity:1;transform:none}
.faq{max-width:850px;margin:0 auto;display:grid;gap:10px}
.faqItem{border:1px solid #ece2d0;border-radius:13px;background:var(--surface);overflow:hidden}
.faqQ{width:100%;border:0;background:var(--surface);text-align:left;padding:17px 18px;font-weight:800;color:var(--ink);display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.faqQ span{font-size:20px;color:var(--accent);transition:transform .2s}
.faqItem.open .faqQ span{transform:rotate(45deg)}
.faqA{max-height:0;overflow:hidden;padding:0 18px;color:var(--muted);line-height:1.65;font-size:14px;transition:max-height .3s ease,padding .3s ease}
.faqItem.open .faqA{max-height:180px;padding:0 18px 17px}
.formStatus{display:none;margin-top:12px;padding:11px 13px;border-radius:9px;font-size:12px;font-weight:700}
.formStatus.ok{display:block;background:var(--surface-soft);color:#c3986a}
.formStatus.error{display:block;background:#f6e6e2;color:#7c2c22}
.fieldError{border-color:#a63f2f!important;box-shadow:0 0 0 3px #a63f2f12}
.toast{position:fixed;right:22px;bottom:22px;z-index:100;background:#2c2115;color:#fff;padding:13px 16px;border-radius:11px;box-shadow:0 15px 35px #0003;font-size:13px;transform:translateY(20px);opacity:0;pointer-events:none;transition:.25s}
.toast.show{opacity:1;transform:none}
.whatsappFloat{position:fixed;right:22px;bottom:22px;width:55px;height:55px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;font-size:27px;z-index:90;box-shadow:0 10px 28px #25d36655;transition:.2s}
.whatsappFloat:hover{transform:translateY(-3px)}
.whatsappFloat + .toast{bottom:90px}
.counter{font-variant-numeric:tabular-nums}
@media(max-width:1140px){
 .mobileToggle{display:flex;align-items:center;justify-content:center}
 .links{display:none!important}
 .actions .login{display:none}
 .actions .btn{display:none}
 .navBackdrop{display:block}
 .mobilePanel{display:flex}
}
@media(max-width:650px){
 .whatsappFloat{right:15px;bottom:15px;width:50px;height:50px;font-size:24px}
 .mobilePanel{width:100%;padding:22px 18px 24px}
}


/* LOGO FIX — fichier image local, ratio intact */
.logoMini,.logoMain,.visualLogo{display:block!important;height:auto!important;max-width:100%;object-fit:contain;object-position:center;}
.logoMini{width:min(170px,28vw)!important;max-height:58px;}
.logoMain{width:100%!important;max-width:100%!important;}
.visualLogo{width:min(260px,75%)!important;}

/* ===== MALIPOS PREMIUM ===== */
body{overflow-x:hidden}
::selection{background:#9c6b3e;color:#fff}
.logoStage{background:linear-gradient(145deg,var(--surface),var(--surface-soft));border-color:var(--line);box-shadow:0 35px 85px rgba(44,33,21,.14)}
.card{transition:transform .25s,box-shadow .25s,border-color .25s}
.card:hover{transform:translateY(-6px);border-color:var(--line);box-shadow:0 22px 45px rgba(44,33,21,.1)}
.card .icon{transition:transform .25s}.card:hover .icon{transform:scale(1.07) rotate(-3deg)}
.screen{box-shadow:0 30px 70px rgba(44,33,21,.17);transition:transform .3s}.screen:hover{transform:translateY(-4px)}
.contactCard{transition:transform .25s,box-shadow .25s}.contactCard:hover{transform:translateY(-3px);box-shadow:0 28px 65px rgba(0,0,0,.25)}
.input{transition:border-color .2s,box-shadow .2s}.input:focus{outline:none;border-color:#c3986a!important;box-shadow:0 0 0 4px rgba(156,107,62,.35)}
.btn{transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 13px 28px rgba(156,107,62,.25)}
.whatsappFloat{display:grid;place-items:center;font-weight:900;position:fixed}
.whatsappFloat:after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(37,211,102,.45);animation:waPulse 2.2s infinite}
@keyframes waPulse{0%{transform:scale(1);opacity:.8}70%,100%{transform:scale(1.38);opacity:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:650px){.logoStage{box-shadow:0 20px 45px rgba(44,33,21,.11)}}

@media(max-width:650px){#mp-benefits .container{grid-template-columns:1fr 1fr!important}}@media(max-width:380px){#mp-benefits .container{grid-template-columns:1fr!important}}

/* ===== ICÔNE DE CONTACT UNIQUE MALIPOS ===== */
.whatsappFloat.maliContact{
  width:64px;
  height:64px;
  border-radius:20px;
  background:linear-gradient(145deg,#9c6b3e 0%,#c3986a 62%,#cfa15c 100%);
  color:#fff;
  box-shadow:0 14px 32px rgba(156,107,62,.30);
  overflow:visible;
  text-decoration:none;
  transition:transform .25s ease,box-shadow .25s ease,border-radius .25s ease;
}
.whatsappFloat.maliContact:hover{
  transform:translateY(-5px) rotate(-2deg);
  border-radius:23px;
  box-shadow:0 19px 38px rgba(156,107,62,.38);
}
.whatsappFloat.maliContact:after{
  border:2px solid rgba(156,107,62,.35);
  animation:waPulse 2.5s infinite;
}
.maliContactIcon{
  position:relative;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  z-index:2;
}
.maliContactBubble{
  width:31px;
  height:31px;
  border-radius:11px 11px 11px 4px;
  background:var(--surface);
  color:var(--accent);
  display:grid;
  place-items:center;
  font-size:17px;
  font-weight:950;
  box-shadow:0 4px 10px rgba(0,0,0,.16);
}
.maliContactWave{
  position:absolute;
  right:-2px;
  bottom:-4px;
  width:15px;
  height:15px;
  border-radius:50%;
  background:#cfa15c;
  color:#fff;
  display:grid;
  place-items:center;
  font-size:13px;
  font-weight:950;
  line-height:1;
  border:2px solid #c3986a;
}
.maliContactLabel{
  position:absolute;
  right:74px;
  white-space:nowrap;
  background:#2c2115;
  color:#fff;
  padding:7px 10px;
  border-radius:8px;
  font-size:11px;
  font-weight:850;
  opacity:0;
  transform:translateX(7px);
  pointer-events:none;
  transition:.2s ease;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}
.maliContactLabel:after{
  content:"";
  position:absolute;
  right:-5px;
  top:50%;
  width:9px;
  height:9px;
  background:#2c2115;
  transform:translateY(-50%) rotate(45deg);
}
.whatsappFloat.maliContact:hover .maliContactLabel{
  opacity:1;
  transform:none;
}
@media(max-width:650px){
  .whatsappFloat.maliContact{
    width:57px;
    height:57px;
    border-radius:17px;
    right:15px;
    bottom:15px;
  }
  .maliContactLabel{display:none}
}


/* Correction logo section "Technologie conçue..." */
.visualLogo{
  display:block!important;
  width:min(270px,82%)!important;
  height:auto!important;
  max-width:100%!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:left center!important;
  filter:none!important;
  opacity:1!important;
  position:relative;
  z-index:3;
}
.visual{
  overflow:hidden;
}


/* ===== MALIPOS FINAL UX POLISH ===== */
.hero{min-height:640px;display:flex;align-items:center}
.heroGrid{width:100%}
.hero h1{max-width:700px}
.hero .lead{max-width:650px}
.pill{box-shadow:0 6px 18px rgba(156,107,62,.08)}
.heroBtns .btn:first-child{background:linear-gradient(135deg,#9c6b3e,#c3986a)}
.logoStage{transition:transform .35s ease,box-shadow .35s ease}
.logoStage:hover{transform:translateY(-5px);box-shadow:0 40px 90px rgba(44,33,21,.17)}
.section{scroll-margin-top:90px}
.head p{max-width:650px;margin-left:auto;margin-right:auto}
.card{position:relative;overflow:hidden}
.card:after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#9c6b3e,#cfa15c,#2c2115);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.card:hover:after{transform:scaleX(1)}
.visual{background:radial-gradient(circle at 80% 20%,rgba(245,196,0,.18),transparent 24%),linear-gradient(145deg,#2c2115,#9c6b3e)}
.featureText .featureList{gap:15px}
.featureText .fl{padding:10px 12px;border:1px solid #ece2d0;border-radius:10px;background:var(--surface-soft)}
.faq{margin-top:10px}
.contactCard{border:1px solid #ece2d0}
.contactCard .btn{font-size:14px;padding:14px 18px}
.whatsappQuoteBtn{position:relative;overflow:hidden}
.whatsappQuoteBtn:before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent,rgba(255,255,255,.16),transparent);transform:translateX(-100%);animation:mpShine 3.2s infinite}
@keyframes mpShine{45%,100%{transform:translateX(100%)}}
footer a:hover{color:#fff!important}
@media(max-width:650px){
 .hero{min-height:auto}
 .heroGrid{padding-top:10px}
 .hero h1{font-size:42px}
 .heroBtns .btn{width:100%}
 .logoStage:hover{transform:none}
}





/* ===== UN SEUL BOUTON WHATSAPP / CONTACT ===== */
.whatsappFloat.maliContact{
  right:22px!important;
  bottom:22px!important;
  z-index:90!important;
}
@media(max-width:650px){
  .whatsappFloat.maliContact{
    right:15px!important;
    bottom:15px!important;
  }
}


/* ===== MINI BOT WHATSAPP MALIPOS ===== */
.waBotOverlay{
  position:fixed;inset:0;z-index:200;
  display:none;align-items:flex-end;justify-content:flex-end;
  padding:24px;background:rgba(4,20,15,.38);
  backdrop-filter:blur(5px);
}
.waBotOverlay.open{display:flex}
.waBot{
  width:min(430px,100%);max-height:min(720px,calc(100vh - 48px));
  background:var(--surface);border:1px solid #ece2d0;border-radius:22px;
  box-shadow:0 30px 90px rgba(0,40,25,.25);
  overflow:hidden;display:flex;flex-direction:column;
  animation:waBotIn .25s ease;
}
@keyframes waBotIn{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
.waBotHead{display:flex;align-items:center;gap:11px;padding:17px 20px;background:linear-gradient(135deg,#9c6b3e,#c3986a);color:#fff}
.waBotAvatar{width:42px;height:42px;border-radius:13px 13px 13px 5px;background:var(--surface);color:var(--accent);display:grid;place-items:center;font-size:19px;font-weight:950}
.waBotBrand{font-size:18px;font-weight:950}.waBotBrand span{color:#cfa15c}
.waBotStatus{font-size:10px;color:#f5ecdc;margin-top:2px}
.waBotClose{position:absolute;right:14px;top:13px;width:30px;height:30px;border:0;background:#ffffff1c;color:#fff;border-radius:50%;font-size:21px;cursor:pointer;z-index:2}
.waBotProgress{height:4px;background:var(--surface-soft)}.waBotProgress span{display:block;height:100%;width:14%;background:#cfa15c;transition:width .25s}
.waBotBody{padding:22px 20px;overflow:auto;min-height:300px}
.waStep{display:none}.waStep.active{display:block;animation:waStepIn .2s ease}
@keyframes waStepIn{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
.waBotQuestion{font-size:15px;line-height:1.55;color:var(--muted);margin-bottom:16px}.waBotQuestion strong{color:var(--ink);font-size:19px}
.waInput{width:100%;border:1px solid #ece2d0;background:var(--surface-soft);border-radius:11px;padding:13px 14px;font:inherit;font-size:14px;color:var(--ink);outline:none;resize:vertical}
.waInput:focus{border-color:#c3986a;box-shadow:0 0 0 4px rgba(156,107,62,.35);background:var(--surface)}
.waInput.invalid{border-color:#a63f2f;box-shadow:0 0 0 4px #a63f2f12}
.waChoices{display:grid;gap:9px}.waChoices button{border:1px solid #ece2d0;background:var(--surface);border-radius:11px;padding:13px;text-align:left;font:inherit;font-size:13px;font-weight:750;color:var(--ink);cursor:pointer;transition:.18s}
.waChoices button:hover,.waChoices button.selected{border-color:var(--accent);background:var(--surface-soft);color:var(--accent);transform:translateX(2px)}
.waBotFooter{display:flex;justify-content:space-between;gap:10px;padding:14px 20px;border-top:1px solid #ece2d0;background:var(--surface-soft)}
.waSecondary,.waPrimary{border:0;border-radius:10px;padding:12px 16px;font-weight:850;cursor:pointer}
.waSecondary{background:var(--surface-soft);color:var(--muted)}.waPrimary{background:#9c6b3e;color:#fff;min-width:125px}
.waPrimary.send{background:#9c6b3e}
.waSummary{background:var(--surface-soft);border:1px solid #ece2d0;border-radius:12px;padding:13px;font-size:12px;line-height:1.7;color:var(--muted)}
.waSummary b{color:var(--ink)}
@media(max-width:650px){
 .waBotOverlay{padding:10px;align-items:flex-end}
 .waBot{width:100%;max-height:calc(100vh - 20px);border-radius:20px}
 .waBotBody{min-height:280px}
}


.waMultiChoices{display:grid;gap:8px}
.waMultiChoices label{display:flex;align-items:center;gap:10px;border:1px solid #ece2d0;background:var(--surface);border-radius:11px;padding:11px 12px;font-size:12px;font-weight:750;color:var(--ink);cursor:pointer;transition:.18s}
.waMultiChoices label:hover{border-color:#c3986a;background:var(--surface-soft)}
.waMultiChoices label.selected{border-color:var(--accent);background:var(--surface-soft);color:var(--accent)}
.waMultiChoices input{position:absolute;opacity:0;pointer-events:none}
.waMultiChoices label:before{content:"";width:19px;height:19px;flex:0 0 19px;border:2px solid #ece2d0;border-radius:5px;background:var(--surface);box-sizing:border-box}
.waMultiChoices label.selected:before{content:"✓";display:grid;place-items:center;background:#9c6b3e;border-color:var(--accent);color:#fff;font-size:12px;font-weight:950}
.waSelectHint{font-size:11px;color:var(--muted);margin-top:9px}
.waSelectHint.error{color:#a63f2f}


/* ===== ASSISTANT CHATBOT MALIPOS ===== */
.whatsappFloat.chatbotContact{
  width:86px!important;
  height:86px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:0 14px 32px rgba(44,33,21,.22)!important;
  overflow:visible!important;
  cursor:pointer;
}
.chatbotContactImage{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:50%;
  transition:transform .25s ease,filter .25s ease;
  filter:drop-shadow(0 8px 13px rgba(44,33,21,.18));
}
.chatbotContact:hover .chatbotContactImage{
  transform:translateY(-5px) scale(1.04);
  filter:drop-shadow(0 13px 18px rgba(44,33,21,.25));
}
.chatbotContact:after{display:none!important}.whatsappFloat.chatbotContact{animation:chatbotFloat 3.4s ease-in-out infinite}.whatsappFloat.chatbotContact:hover{animation-play-state:paused}@keyframes chatbotFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}@media(prefers-reduced-motion:reduce){.whatsappFloat.chatbotContact{animation:none}}
.chatbotContact .maliContactLabel{display:none!important}
@media(max-width:650px){
  .whatsappFloat.chatbotContact{
    width:72px!important;
    height:72px!important;
    right:14px!important;
    bottom:14px!important;
  }
}


/* Chatbot image inside the MaliPOS assistant header */
.waBotAvatar.waBotChatbotAvatar{
  width:52px!important;
  height:52px!important;
  min-width:52px;
  border-radius:50%!important;
  background:transparent!important;
  overflow:hidden!important;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  border:2px solid rgba(255,255,255,.8);
}
.waBotChatbotAvatar img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
}


/* ===== IMAGE PATHS + PLACEMENT ===== */
img{max-width:100%;height:auto}
.logoMini,.logoMain,.heroLogo,.visualLogo{display:block;object-fit:contain}
.logoMini{max-height:46px;width:auto}
.logoMain,.heroLogo{max-height:190px;width:auto;margin-left:auto;margin-right:auto}
.visualLogo{max-width:270px!important;width:100%!important;height:auto!important;object-fit:contain!important}
.chatbotContactImage{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
.waBotChatbotAvatar img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
@media(max-width:650px){
  .logoMini{max-height:40px}
  .logoMain,.heroLogo{max-height:130px}
  .visualLogo{max-width:220px!important}
}


/* ============================================================
   MALIPOS — RESPONSIVE MASTER FIX
   Nothing may overflow the viewport.
   ============================================================ */
html{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  scroll-behavior:smooth;
}
body{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden;
}
*,*::before,*::after{
  box-sizing:border-box;
  min-width:0;
}
img,svg,video,canvas{
  max-width:100%;
  height:auto;
}
.container{
  width:min(1180px, calc(100% - 40px));
  max-width:1180px;
  margin-left:auto;
  margin-right:auto;
}
section,.section,.hero,.trustbar,footer{
  width:100%;
  max-width:100%;
  overflow:hidden;
}
.heroGrid,.aboutGrid,.featureShow,.cards,.trustItems,.ctain{
  max-width:100%;
}
.heroGrid > *, .aboutGrid > *, .featureShow > *, .cards > *,
.trustItems > *, .ctain > *{
  min-width:0;
  max-width:100%;
}
h1,h2,h3,h4,p,li,a,button,span{
  overflow-wrap:anywhere;
}
h1,h2,h3{
  text-wrap:balance;
}
.btn,button{
  max-width:100%;
}
input,textarea,select{
  max-width:100%;
  min-width:0;
}

/* Desktop/tablet grids must collapse before they can overflow. */
@media(max-width:1050px){
  .heroGrid{
    grid-template-columns:minmax(0,1fr) minmax(280px,.8fr)!important;
    gap:38px!important;
  }
  .aboutGrid,.featureShow{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:38px!important;
  }
  .cards{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .trustItems{
    flex-wrap:wrap!important;
  }
}

/* Tablet / large mobile. */
@media(max-width:800px){
  .container{
    width:min(100% - 32px,680px);
  }
  .heroGrid,
  .aboutGrid,
  .featureShow{
    grid-template-columns:1fr!important;
  }
  .hero{
    min-height:auto!important;
    padding-top:50px!important;
    padding-bottom:55px!important;
  }
  .heroGrid{
    gap:42px!important;
  }
  .heroCopy{
    max-width:100%!important;
  }
  .hero h1{
    max-width:100%!important;
    font-size:clamp(34px,8vw,54px)!important;
    line-height:1.08!important;
  }
  .hero .lead{
    max-width:100%!important;
  }
  .heroBtns{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:10px!important;
  }
  .heroBtns .btn{
    flex:1 1 210px;
  }
  .logoStage{
    width:100%!important;
    max-width:560px!important;
    margin:0 auto!important;
  }
  .cards{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .aboutGrid,.featureShow{
    align-items:center!important;
  }
  .visual{
    width:100%!important;
    max-width:560px!important;
    margin:0 auto!important;
  }
  .featureText{
    width:100%!important;
  }
  .contactCard{
    width:100%!important;
    max-width:650px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .waBotOverlay{
    width:100vw!important;
    max-width:100vw!important;
    overflow:hidden!important;
  }
}

/* Phones. */
@media(max-width:600px){
  .container{
    width:calc(100% - 24px)!important;
  }
  header .container{
    width:calc(100% - 24px)!important;
  }
  .navLinks{
    max-width:100vw;
    overflow:hidden;
  }
  .hero{
    padding-top:36px!important;
    padding-bottom:42px!important;
  }
  .heroGrid{
    gap:30px!important;
  }
  .hero h1{
    font-size:clamp(30px,9.5vw,42px)!important;
  }
  .hero .lead{
    font-size:14px!important;
    line-height:1.65!important;
  }
  .heroBtns{
    width:100%!important;
    flex-direction:column!important;
  }
  .heroBtns .btn{
    width:100%!important;
    flex:0 0 auto!important;
  }
  .pill{
    max-width:100%!important;
    white-space:normal!important;
  }
  .cards{
    grid-template-columns:1fr!important;
  }
  .card{
    width:100%!important;
  }
  .trustItems{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }
  .trustItems span{
    width:100%!important;
    text-align:center!important;
  }
  .section{
    padding-top:58px!important;
    padding-bottom:58px!important;
  }
  .head h2,.about h2,.featureText h2{
    font-size:clamp(27px,8vw,36px)!important;
    line-height:1.15!important;
  }
  .head p{
    font-size:14px!important;
    line-height:1.65!important;
  }
  .aboutGrid,.featureShow{
    gap:28px!important;
  }
  .visual{
    padding:20px!important;
  }
  .visualLogo{
    max-width:210px!important;
  }
  .screen{
    width:100%!important;
    max-width:100%!important;
  }
  .featureList,.fl{
    width:100%!important;
  }
  .faqItem{
    width:100%!important;
  }
  .cta{
    border-radius:18px!important;
  }
  .ctain{
    width:100%!important;
  }
  .ctain .btn{
    width:100%!important;
  }
  .contactCard{
    padding:20px!important;
  }
  .waBot{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100vh - 20px)!important;
  }
  .waBotBody{
    padding:18px 15px!important;
  }
  .waBotFooter{
    padding:12px 15px!important;
  }
  .waBotFooter button{
    min-width:0!important;
    flex:1 1 0!important;
  }
  .waBotQuestion strong{
    font-size:17px!important;
  }
  .waChoices button,
  .waMultiChoices label{
    width:100%!important;
    max-width:100%!important;
  }
  .whatsappFloat.chatbotContact{
    width:68px!important;
    height:68px!important;
    right:12px!important;
    bottom:12px!important;
  }
}

/* Very small phones. */
@media(max-width:380px){
  .container{
    width:calc(100% - 18px)!important;
  }
  .trustItems{
    grid-template-columns:1fr!important;
  }
  .hero h1{
    font-size:30px!important;
  }
  .heroBtns .btn{
    padding-left:12px!important;
    padding-right:12px!important;
    font-size:13px!important;
  }
  .logoStage{
    padding:18px!important;
  }
  .waBot{
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
  }
}

/* Prevent accidental horizontal overflow from decorative elements. */
.hero::before,.hero::after,.cta::before,.cta::after{
  max-width:100vw;
  pointer-events:none;
}


body{
  scroll-padding-top:78px;
}

/* Mobile app showcase */
.phoneShow{display:grid;grid-template-columns:.95fr 1.05fr;gap:50px;align-items:center}
.phoneWrap{display:flex;justify-content:center;gap:22px;flex-wrap:wrap}
.phone{width:210px;background:#2c2115;border-radius:34px;padding:10px;box-shadow:0 28px 60px #2c21151c}
.phoneNotch{width:70px;height:18px;background:#2c2115;border-radius:0 0 12px 12px;margin:0 auto;position:relative;z-index:2;margin-bottom:-18px}
.phoneScreen{background:var(--surface-soft);border-radius:24px;overflow:hidden}
.phoneScreen img{display:block;width:100%;height:auto}
.phoneStatus{display:flex;justify-content:space-between;padding:2px 16px 6px;font-size:9px;font-weight:800;color:var(--ink)}
.phoneTopbar{background:var(--surface);border-bottom:1px solid var(--line);padding:9px 14px;display:flex;align-items:center;justify-content:space-between}
.phoneTopbar strong{font-size:12px;color:var(--accent)}
.phoneTopbar span{font-size:13px}
.phoneCats{display:flex;gap:6px;padding:10px 12px 4px;overflow:hidden}
.phoneCat{font-size:8px;font-weight:800;padding:6px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.phoneCat.on{background:var(--accent);border-color:var(--accent);color:#fff}
.phoneGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:8px 12px 78px}
.phoneCard{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:7px}
.phoneCard .pic{height:44px;border-radius:7px;background:var(--surface-soft);display:grid;place-items:center;font-size:19px;margin-bottom:5px}
.phoneCard b{font-size:8px;display:block}
.phoneCard span{font-size:8px;color:var(--gold);font-weight:900}
.phoneCartBar{position:absolute;left:10px;right:10px;bottom:10px;background:var(--accent);border-radius:14px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 10px 22px #9c6b3e33}
.phoneCartBar .ci{color:#fff;font-size:9px;font-weight:800}
.phoneCartBar .ci small{display:block;font-size:7px;opacity:.8;font-weight:700}
.phoneCartBar .cb{background:var(--surface);color:var(--accent);font-size:9px;font-weight:900;padding:6px 12px;border-radius:9px}
.phoneScreenInner{position:relative}
@media(max-width:900px){.phoneShow{grid-template-columns:1fr;text-align:center}.phoneWrap{order:-1}.featureList{text-align:left;display:inline-block}}

/* ===== Bannière d'ouverture ===== */
.banner{
  position:relative;width:100%;overflow:hidden;
  display:flex;flex-direction:column;
  background:
    radial-gradient(ellipse 900px 560px at 18% -10%, rgba(242,193,78,.16), transparent 60%),
    radial-gradient(ellipse 700px 700px at 100% 100%, rgba(232,73,29,.10), transparent 55%),
    linear-gradient(160deg, #15140f 0%, #20261c 46%, #15140f 100%);
}
.banner:before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:3px 3px;opacity:.4;mix-blend-mode:overlay;pointer-events:none;
}
.bglow{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;z-index:1}
.bglow1{width:520px;height:520px;background:radial-gradient(circle,rgba(242,193,78,.30),transparent 70%);top:-180px;right:-120px;animation:bglowDrift1 22s ease-in-out infinite}
.bglow2{width:420px;height:420px;background:radial-gradient(circle,rgba(60,72,52,.4),transparent 70%);bottom:-160px;left:-100px;animation:bglowDrift2 26s ease-in-out infinite}
@keyframes bglowDrift1{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,25px)}}
@keyframes bglowDrift2{0%,100%{transform:translate(0,0)}50%{transform:translate(25px,-20px)}}

.banner-content{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;text-align:center;padding:72px 28px 56px;gap:20px}
.banner-eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(242,193,78,.35);background:rgba(242,193,78,.08);color:#e8c878;font-family:var(--font-body);font-size:11.5px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;padding:7px 14px;border-radius:999px}
.banner-eyebrow i{width:6px;height:6px;border-radius:50%;background:#f2c14e;display:block;box-shadow:0 0 8px #f2c14e}
.banner-title{font-family:var(--font-display);font-weight:700;font-size:clamp(44px,8vw,80px);line-height:.97;letter-spacing:-1.5px;color:#fdfbf6}
.banner-title span{background:linear-gradient(120deg,#f2c14e 10%,#e8491d 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.banner-slogan{font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(19px,2.6vw,26px);color:#b3aea0;max-width:560px;line-height:1.45}
.banner-slogan .highlight{font-style:normal;color:#fdfbf6;position:relative}
.banner-slogan .highlight:after{content:"";position:absolute;left:0;right:0;bottom:1px;height:1px;background:linear-gradient(90deg,#f2c14e,transparent)}
.banner-actions{display:flex;gap:12px;margin-top:6px;flex-wrap:wrap;justify-content:center}
.banner-btn{border-radius:11px;padding:14px 26px;font-size:14.5px;font-weight:700;font-family:var(--font-body);cursor:pointer;border:1px solid transparent;display:inline-flex;align-items:center}
.banner-btn-primary{background:#fdfbf6;color:#15140f;box-shadow:0 14px 34px rgba(242,193,78,.18)}
.banner-btn-primary:hover{background:#f2c14e}
.banner-btn-ghost{background:transparent;color:#fdfbf6;border-color:rgba(255,255,255,.22)}
.banner-btn-ghost:hover{border-color:rgba(255,255,255,.5)}

.banner-stats{position:relative;z-index:3;display:flex;border-top:1px solid rgba(255,255,255,.08)}
.bstat{flex:1;text-align:center;padding:20px 12px;border-right:1px solid rgba(255,255,255,.08)}
.bstat:last-child{border-right:0}
.bstat b{display:block;font-family:var(--font-display);font-size:20px;font-weight:600;color:#e8c878}
.bstat span{display:block;font-size:11.5px;color:#b3aea0;margin-top:3px}

.banner .fade-in{opacity:0;transform:translateY(16px);animation:fadeInUp .8s ease forwards}
.banner-eyebrow.fade-in{animation-delay:.1s}
.banner-title.fade-in{animation-delay:.22s}
.banner-slogan.fade-in{animation-delay:.36s}
.banner-actions.fade-in{animation-delay:.5s}
.banner-stats.fade-in{animation-delay:.62s}
@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}

@media(max-width:768px){.banner-stats{flex-wrap:wrap}.bstat{flex:1 1 50%;border-bottom:1px solid rgba(255,255,255,.08)}}
@media(max-width:650px){.banner-content{padding:52px 20px 40px}}
/* ===== Captures d'écran agrandissables ===== */
img.zoomable{cursor:zoom-in;transition:filter .2s ease}
img.zoomable:hover{filter:brightness(1.04)}
.zoomHint{position:absolute;right:10px;bottom:10px;background:rgba(44,33,21,.75);color:#fff;font-size:11px;font-weight:700;padding:6px 11px;border-radius:999px;display:flex;align-items:center;gap:5px;pointer-events:none;opacity:0;transition:opacity .2s ease}
.zoomFrame{position:relative}
.zoomFrame:hover .zoomHint{opacity:1}
.lightbox{display:none;position:fixed;inset:0;z-index:200;background:rgba(20,15,10,.88);align-items:center;justify-content:center;padding:26px}
.lightbox.open{display:flex}
.lightbox img{max-width:min(1100px,94vw);max-height:90vh;width:auto;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.4);cursor:zoom-out}
.lightboxClose{position:absolute;top:20px;right:24px;width:42px;height:42px;border-radius:50%;background:var(--surface);border:0;color:var(--deep);font-size:22px;line-height:1;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.25)}
@media(max-width:650px){.lightboxClose{top:12px;right:12px;width:36px;height:36px;font-size:19px}}

/* ===== Bandeau cookies ===== */
.cookieBanner{position:fixed;right:22px;bottom:22px;z-index:150;width:min(380px,calc(100vw - 32px));background:var(--surface);border:1px solid #ece2d0;border-radius:18px;box-shadow:0 20px 50px rgba(44,33,21,.18);padding:22px;display:none}
.cookieBanner.open{display:block}
.cookieBanner h3{margin:0 26px 10px 0;font-family:var(--font-display);font-size:17px;color:var(--deep)}
.cookieBanner p{margin:0 0 14px;font-size:12.5px;line-height:1.6;color:var(--muted)}
.cookieClose{position:absolute;top:16px;right:16px;background:none;border:0;font-size:18px;color:var(--muted);cursor:pointer;line-height:1;padding:0}
.cookiePrefs{display:grid;gap:12px;margin-bottom:14px;padding-top:12px;border-top:1px solid #ece2d0}
.cookiePrefs[hidden]{display:none}
.cookieToggle{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;font-size:12px;color:var(--ink)}
.cookieToggle b{display:block}
.cookieToggle small{display:block;color:var(--muted);font-weight:400;margin-top:2px;line-height:1.5}
.cookieToggle input{margin-top:3px;flex:none}
.cookieActions{display:flex;flex-wrap:wrap;gap:8px}
.cookieBtn{border-radius:9px;padding:10px 14px;font-size:12.5px;font-weight:700;cursor:pointer;border:1px solid transparent;font-family:inherit}
.cookieBtn-primary{background:#9c6b3e;color:#fff;flex:1 1 auto}
.cookieBtn-primary:hover{background:#7a5230}
.cookieBtn-outline{background:var(--surface);border-color:var(--line);color:var(--ink)}
.cookieBtn-outline:hover{background:var(--surface-soft)}
.cookieLinks{margin-top:12px;font-size:11px;color:var(--muted)}
.cookieLinks a{color:var(--accent);text-decoration:underline}
@media(max-width:480px){.cookieBanner{right:10px;left:10px;bottom:10px;width:auto;padding:18px}}