/* Hub v767 (07/11, agent accueil-v2) : ACCUEIL v2 — fond vivant, exemple reel de temps gagne, fonctions phares (Radar Niches,
   Œil des Niches, automatisations, suivi fournisseurs) avec mini-demos animees. Sombre neutre + accent corail #FF8A5B, aucun violet.
   Les animations ne tournent que si la carte est a l'ecran (.acx-on) ; prefers-reduced-motion = etats finaux, rien ne bouge. */
#lp { --coral: #FF8A5B; --coral-s: rgba(255,138,91,.14); --coral-l: rgba(255,138,91,.28); }

/* ================= FOND : lueurs corail qui suivent les sections, grille discrete, parallaxe ================= */
#lp .acxbg { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; contain: strict; }
#lp .acxbg i { position: absolute; display: block; border-radius: 50%; will-change: transform; transition: transform 2.2s cubic-bezier(.16,1,.3,1), opacity 1.6s ease; }
#lp .acxbg .g1 { width: 70vmax; height: 70vmax; left: -35vmax; top: -35vmax; background: radial-gradient(closest-side, rgba(255,138,91,.085), rgba(255,138,91,.03) 55%, transparent 75%);
  transform: translate3d(var(--g1x, 78vw), var(--g1y, 18vh), 0); opacity: var(--g1o, 1); }
#lp .acxbg .g2 { width: 60vmax; height: 60vmax; left: -30vmax; top: -30vmax; background: radial-gradient(closest-side, rgba(255,255,255,.045), transparent 72%);
  transform: translate3d(var(--g2x, 14vw), var(--g2y, 70vh), 0); }
#lp .acxbg .g3 { width: 44vmax; height: 44vmax; left: -22vmax; top: -22vmax; background: radial-gradient(closest-side, rgba(255,138,91,.05), transparent 70%);
  transform: translate3d(var(--g3x, 40vw), var(--g3y, 110vh), 0); }
#lp .acxbg .gr, #lp .acxbg .dots { position: absolute; inset: 0; border-radius: 0; transition: none; overflow: hidden; }
#lp .acxbg .gr { -webkit-mask-image: radial-gradient(ellipse 75% 60% at 50% 45%, #000 20%, transparent 75%); mask-image: radial-gradient(ellipse 75% 60% at 50% 45%, #000 20%, transparent 75%); }
#lp .acxbg .dots { opacity: .5; -webkit-mask-image: radial-gradient(ellipse 60% 50% at 50% 50%, #000, transparent 70%); mask-image: radial-gradient(ellipse 60% 50% at 50% 50%, #000, transparent 70%); }
#lp .acxbg .gr b, #lp .acxbg .dots b { position: absolute; left: 0; right: 0; top: -200px; bottom: -200px; display: block; will-change: transform; }
#lp .acxbg .gr b { background-image: linear-gradient(rgba(255,255,255,.034) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.034) 1px, transparent 1px); background-size: 64px 64px; transform: translate3d(0, var(--gp, 0px), 0); }
#lp .acxbg .dots b { background-image: radial-gradient(rgba(255,138,91,.35) 1px, transparent 1.4px); background-size: 192px 192px; background-position: 31px 31px; transform: translate3d(0, var(--gd, 0px), 0); }
@media (max-width: 700px) {
  #lp .acxbg .gr { -webkit-mask-image: radial-gradient(ellipse 90% 55% at 50% 45%, #000 15%, transparent 75%); mask-image: radial-gradient(ellipse 90% 55% at 50% 45%, #000 15%, transparent 75%); }
  #lp .acxbg .gr b { background-size: 48px 48px; }
  #lp .acxbg .g1 { width: 120vmax; height: 120vmax; left: -60vmax; top: -60vmax; }
}
/* les sections laissent voir le fond (le haut de page garde son ciel anime) */
#lp .lp-sec { background: transparent; }

/* ================= briques communes ================= */
#lp .acx-chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px !important; border-radius: 999px; font-size: 11.5px; font-weight: 500; letter-spacing: .02em; white-space: nowrap;
  color: rgba(255,255,255,.78); border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); }
#lp .acx-chip.c { color: #ffd3c1; border-color: var(--coral-l); background: var(--coral-s); }
#lp .acx-chip.s { color: rgba(255,255,255,.55); border-style: dashed; }
#lp .acx-ex { position: absolute; right: 12px; bottom: 10px; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.3); }
#lp .acx-card { position: relative; border-radius: 24px; border: 1px solid var(--line); overflow: hidden;
  background: linear-gradient(165deg, rgba(255,255,255,.05), rgba(255,255,255,.012) 55%, rgba(255,255,255,.02)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 24px 60px -36px rgba(0,0,0,.9);
  transition: border-color .35s, transform .6s cubic-bezier(.16,1,.3,1); }
#lp .acx-card:hover { border-color: rgba(255,255,255,.16); }
#lp .acx-card::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .5s;
  background: radial-gradient(420px 220px at var(--mx, 50%) var(--my, 0%), rgba(255,138,91,.08), transparent 70%); }
#lp .acx-card:hover::before { opacity: 1; }
#lp .acx-scr { position: relative; border-radius: 16px; background: rgba(9,9,10,.72); border: 1px solid rgba(255,255,255,.07); overflow: hidden; }

/* ================= EXEMPLE REEL (temps gagne) ================= */
#lp .acx-reel { margin: 28px 0 0 !important; padding: 0 !important; }
#lp .acx-reel-in { display: grid; grid-template-columns: 1fr; gap: 0; }
#lp .acx-reel-l, #lp .acx-reel-r { padding: 24px 20px !important; }
#lp .acx-reel-r { border-top: 1px solid var(--line); }
#lp .acx-reel h3 { font-size: 22px; font-weight: 450; letter-spacing: -.02em; line-height: 1.2; margin: 14px 0 6px !important; }
#lp .acx-reel .acx-sub { color: rgba(255,255,255,.55); font-size: 13.5px; line-height: 1.5; }
#lp .acx-kp { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 20px !important; }
#lp .acx-kp > div { border-radius: 16px; border: 1px solid rgba(255,255,255,.07); background: rgba(10,10,11,.55); padding: 14px !important; }
#lp .acx-kp > div.big { grid-column: 1 / -1; border-color: var(--coral-l); background: linear-gradient(160deg, rgba(255,138,91,.11), rgba(255,138,91,.02) 60%), rgba(10,10,11,.55); }
#lp .acx-kp small { display: block; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.5); }
#lp .acx-kp b { display: block; margin-top: 6px !important; font-size: 28px; font-weight: 450; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap; }
#lp .acx-kp .big b { font-size: clamp(40px, 11vw, 64px); text-shadow: 0 0 40px rgba(255,138,91,.25); }
#lp .acx-kp .big b em { font-style: normal; color: var(--coral); }
#lp .acx-bk { display: flex; flex-direction: column; gap: 16px; }
#lp .acx-bk-t { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.5); }
#lp .acx-row { display: grid; grid-template-columns: 1fr auto; gap: 7px 12px; align-items: baseline; font-size: 14px; }
#lp .acx-row span { color: rgba(255,255,255,.82); }
#lp .acx-row span small { color: rgba(255,255,255,.45); font-size: 12.5px; margin-left: 4px !important; }
#lp .acx-row b { font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
#lp .acx-row i { grid-column: 1 / -1; display: block; height: 6px; border-radius: 6px; background: rgba(255,255,255,.07); overflow: hidden; }
#lp .acx-row i u { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, rgba(255,138,91,.55), var(--coral)); text-decoration: none; transition: width 1.6s cubic-bezier(.16,1,.3,1) var(--dl, 0s); }
#lp .acx-reel.acx-in .acx-row i u { width: var(--w, 0%); }
#lp .acx-sold { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; margin-top: 4px !important; padding-top: 14px !important; border-top: 1px dashed rgba(255,255,255,.1); font-size: 13.5px; color: rgba(255,255,255,.7); }
#lp .acx-sold b { color: #fff; font-weight: 500; font-variant-numeric: tabular-nums; }
#lp .acx-note { color: rgba(255,255,255,.42); font-size: 12.5px; line-height: 1.55; margin-top: 14px !important; max-width: 900px; }
#lp .acx-then { display: flex; align-items: center; gap: 14px; margin: 34px 0 0 !important; color: rgba(255,255,255,.6); font-size: 14px; }
#lp .acx-then::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(255,255,255,.12), transparent); }
@media (min-width: 900px) {
  #lp .acx-reel-in { grid-template-columns: 1.05fr 1fr; }
  #lp .acx-reel-l, #lp .acx-reel-r { padding: 34px 34px !important; }
  #lp .acx-reel-r { border-top: 0; border-left: 1px solid var(--line); }
  #lp .acx-reel h3 { font-size: 26px; }
  #lp .acx-kp { grid-template-columns: 1fr 1fr; }
}

/* ================= RADAR NICHES + ŒIL DES NICHES ================= */
#lp .acx-duo { display: grid; grid-template-columns: 1fr; gap: 16px; }
#lp .acx-big { display: flex; flex-direction: column; gap: 16px; padding: 24px 20px !important; }
#lp .acx-big header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
#lp .acx-name { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--coral); font-weight: 500; }
#lp .acx-big h3 { font-size: 23px; font-weight: 450; letter-spacing: -.02em; line-height: 1.18; }
#lp .acx-big > p { color: var(--mute); font-size: 14.5px; line-height: 1.55; }
#lp .acx-pts { display: grid; gap: 8px; }
#lp .acx-pts li { list-style: none; display: flex; gap: 10px; font-size: 14px; line-height: 1.45; color: rgba(255,255,255,.82); }
#lp .acx-pts li::before { content: ''; flex: none; width: 16px; height: 16px; margin-top: 2px !important; border-radius: 50%; background: var(--coral-s) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF8A5B' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 10px no-repeat; }
/* demo radar : produits qui arrivent, ligne de scan */
#lp .acx-rad { padding: 12px !important; display: flex; flex-direction: column; gap: 8px; min-height: 248px; }
#lp .acx-rad::after { content: ''; position: absolute; left: 0; right: 0; top: -30%; height: 30%; pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(255,138,91,.10) 70%, rgba(255,138,91,.35) 99%, transparent); opacity: 0; }
#lp .acx-on .acx-rad::after { animation: acxscan 4.8s cubic-bezier(.45,0,.55,1) infinite; }
@keyframes acxscan { 0% { top: -30%; opacity: 0; } 12% { opacity: 1; } 80% { opacity: 1; } 100% { top: 100%; opacity: 0; } }
#lp .acx-p { display: grid; grid-template-columns: 46px 1fr auto; gap: 12px; align-items: center; padding: 8px 10px 8px 8px !important; border-radius: 12px; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.05); }
#lp .acx-p img { width: 46px; height: 58px; border-radius: 8px; object-fit: cover; background: #1a1a1c; display: block; }
#lp .acx-p b { display: block; font-size: 13.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#lp .acx-p small { display: block; margin-top: 3px !important; font-size: 12.5px; color: rgba(255,255,255,.6); font-variant-numeric: tabular-nums; white-space: nowrap; }
#lp .acx-p small em { font-style: normal; color: #fff; }
#lp .acx-p small strong { font-weight: 500; color: var(--coral); }
#lp .acx-p > span { min-width: 0; }
#lp .acx-x { font-size: 12px; font-weight: 600; color: #160904; background: var(--coral); border-radius: 7px; padding: 4px 7px !important; font-variant-numeric: tabular-nums; }
#lp .acx-p.t .acx-x { background: transparent; color: #ffd3c1; border: 1px solid var(--coral-l); }
#lp .acx-on .acx-p { animation: acxpin .8s cubic-bezier(.16,1,.3,1) both; }
#lp .acx-on .acx-p:nth-child(2) { animation-delay: .25s; } #lp .acx-on .acx-p:nth-child(3) { animation-delay: .5s; } #lp .acx-on .acx-p:nth-child(4) { animation-delay: .75s; }
@keyframes acxpin { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
/* demo œil : ventes chez les meilleurs vendeurs */
#lp .acx-eye { padding: 12px !important; min-height: 248px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; align-content: start; }
#lp .acx-eye-h { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: rgba(255,255,255,.55); padding: 2px 2px 4px !important; }
#lp .acx-eye-h b { color: #fff; font-weight: 500; }
#lp .acx-s { position: relative; border-radius: 12px; overflow: hidden; background: #141416; border: 1px solid rgba(255,255,255,.06); }
#lp .acx-s img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
#lp .acx-s span { position: absolute; left: 6px; right: 6px; bottom: 6px; display: flex; justify-content: space-between; gap: 4px; align-items: center; font-size: 11.5px; padding: 5px 7px !important; border-radius: 8px; background: rgba(10,10,11,.78); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
#lp .acx-s span b { font-weight: 600; font-variant-numeric: tabular-nums; }
#lp .acx-s span em { font-style: normal; color: rgba(255,255,255,.6); }
#lp .acx-s .acx-sb { position: absolute; top: 6px; left: 6px; font-size: 10.5px; font-weight: 600; padding: 3px 7px !important; border-radius: 6px; background: var(--coral); color: #160904; }
#lp .acx-s .acx-sb.f { background: rgba(10,10,11,.8); color: #ffd3c1; border: 1px solid var(--coral-l); }
#lp .acx-on .acx-s { animation: acxpin .8s cubic-bezier(.16,1,.3,1) both; }
#lp .acx-on .acx-s:nth-of-type(2) { animation-delay: .12s; } #lp .acx-on .acx-s:nth-of-type(3) { animation-delay: .24s; } #lp .acx-on .acx-s:nth-of-type(4) { animation-delay: .36s; } #lp .acx-on .acx-s:nth-of-type(5) { animation-delay: .48s; } #lp .acx-on .acx-s:nth-of-type(6) { animation-delay: .6s; }
@media (min-width: 980px) { #lp .acx-duo { grid-template-columns: 1fr 1fr; } #lp .acx-big { padding: 30px !important; } #lp .acx-big h3 { font-size: 26px; } }
@media (max-width: 420px) { #lp .acx-eye { grid-template-columns: repeat(2, 1fr); } #lp .acx-eye .acx-s:nth-of-type(n+6) { display: none; } }

/* ================= AUTOMATISATIONS : 9 tuiles avec mini-demo ================= */
#lp .acx-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 720px) { #lp .acx-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1080px) { #lp .acx-grid { grid-template-columns: repeat(3, 1fr); } }
#lp .acx-t { display: flex; flex-direction: column; gap: 12px; padding: 20px !important; border-radius: 22px; }
#lp .acx-t header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
#lp .acx-t h3 { font-size: 17.5px; font-weight: 450; letter-spacing: -.015em; line-height: 1.25; }
#lp .acx-t > p { color: var(--mute); font-size: 14px; line-height: 1.5; }
#lp .acx-d { height: 150px; padding: 12px !important; display: flex; flex-direction: column; justify-content: center; gap: 7px; font-size: 12.5px; margin-top: auto !important; }
#lp .acx-b { max-width: 88%; padding: 7px 11px !important; border-radius: 12px; line-height: 1.35; }
#lp .acx-b.in { align-self: flex-start; background: rgba(255,255,255,.08); }
#lp .acx-b.out { align-self: flex-end; background: #E9E9E9; color: #0A0707; }
#lp .acx-b.sys { align-self: center; font-size: 11.5px; padding: 5px 10px !important; color: #ffd3c1; background: var(--coral-s); border: 1px solid var(--coral-l); }
#lp .acx-b.ok { align-self: center; font-size: 11.5px; padding: 5px 10px !important; color: #9df5c7; background: rgba(46,204,113,.1); border: 1px solid rgba(46,204,113,.25); }
#lp .acx-n { display: flex; align-items: center; gap: 8px; align-self: flex-start; padding: 6px 10px !important; border-radius: 10px; background: rgba(255,255,255,.05); color: rgba(255,255,255,.8); font-size: 12px; }
#lp .acx-n svg { width: 14px; height: 14px; color: var(--coral); flex: none; }
/* sequence : chaque element .q apparait a son tour (--q = rang), la boucle repart toutes les --L secondes */
#lp .acx-d .q { opacity: 0; }
#lp .acx-on .acx-d .q { animation: acxseq var(--L, 7s) cubic-bezier(.16,1,.3,1) infinite; animation-delay: calc(var(--q, 0) * .9s); }
@keyframes acxseq { 0% { opacity: 0; transform: translateY(8px); } 6% { opacity: 1; transform: none; } 82% { opacity: 1; transform: none; } 92%, 100% { opacity: 0; transform: translateY(-4px); } }
/* offres : barre a seuils + 3 cas qui tournent */
#lp .acx-off { position: relative; height: 150px; }
#lp .acx-bar { position: absolute; left: 14px; right: 14px; top: 64px; height: 8px; border-radius: 8px; overflow: hidden; display: flex; }
#lp .acx-bar i { display: block; height: 100%; }
#lp .acx-bar .z1 { width: 60%; background: rgba(239,68,68,.35); } #lp .acx-bar .z2 { width: 20%; background: rgba(255,138,91,.45); } #lp .acx-bar .z3 { width: 20%; background: rgba(46,204,113,.45); }
#lp .acx-lg { position: absolute; left: 14px; right: 14px; top: 78px; height: 16px; font-size: 10.5px; color: rgba(255,255,255,.45); font-variant-numeric: tabular-nums; }
#lp .acx-lg span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
#lp .acx-case { position: absolute; left: 14px; right: 14px; top: 14px; bottom: 10px; opacity: 0; }
#lp .acx-case .pin { position: absolute; top: 40px; width: 2px; height: 32px; margin-left: -1px !important; background: #fff; box-shadow: 0 0 10px rgba(255,255,255,.6); }
#lp .acx-case .pin::before { content: ''; position: absolute; top: -5px; left: -4px; width: 10px; height: 10px; border-radius: 50%; background: #fff; }
#lp .acx-case .lbl { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; font-size: 12px; padding: 4px 9px !important; border-radius: 9px; background: rgba(255,255,255,.08); }
#lp .acx-case .res { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); white-space: nowrap; font-size: 12px; padding: 5px 11px !important; border-radius: 9px; }
#lp .acx-case .res.ok { color: #9df5c7; background: rgba(46,204,113,.1); border: 1px solid rgba(46,204,113,.25); }
#lp .acx-case .res.co { color: #ffd3c1; background: var(--coral-s); border: 1px solid var(--coral-l); }
#lp .acx-case .res.no { color: #fca5a5; background: rgba(239,68,68,.1); border: 1px solid rgba(239,68,68,.25); }
#lp .acx-off .acx-case.c1 { opacity: 1; }
#lp .acx-on .acx-off .acx-case { opacity: 0; animation: acxcase 9s ease-in-out infinite; }
#lp .acx-on .acx-off .acx-case.c2 { animation-delay: 3s; } #lp .acx-on .acx-off .acx-case.c3 { animation-delay: 6s; }
@keyframes acxcase { 0% { opacity: 0; transform: translateY(6px); } 5% { opacity: 1; transform: none; } 30% { opacity: 1; } 34%, 100% { opacity: 0; } }
/* baisse de prix : etiquette qui descend vers le plancher */
#lp .acx-drop { position: relative; height: 150px; }
#lp .acx-floor { position: absolute; left: 14px; right: 14px; bottom: 30px; border-top: 1px dashed rgba(255,138,91,.55); }
#lp .acx-floor span { position: absolute; right: 0; top: 4px; font-size: 10.5px; color: #ffd3c1; }
#lp .acx-tag { position: absolute; left: 22px; display: flex; align-items: center; gap: 8px; font-size: 13px; padding: 6px 10px !important; border-radius: 9px; background: #E9E9E9; color: #0A0707; font-weight: 600; font-variant-numeric: tabular-nums; opacity: 0; }
#lp .acx-tag s { font-weight: 400; color: rgba(10,7,7,.5); font-size: 11.5px; }
#lp .acx-drop .acx-tag.t1 { top: 14px; opacity: 1; } #lp .acx-drop .acx-tag.t2 { top: 44px; left: 70px; } #lp .acx-drop .acx-tag.t3 { top: 74px; left: 118px; }
#lp .acx-on .acx-drop .acx-tag { opacity: 0; animation: acxseq 8s cubic-bezier(.16,1,.3,1) infinite; }
#lp .acx-on .acx-drop .acx-tag.t2 { animation-delay: 1.2s; } #lp .acx-on .acx-drop .acx-tag.t3 { animation-delay: 2.4s; }
#lp .acx-bell { position: absolute; right: 14px; top: 14px; display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: rgba(255,255,255,.7); padding: 5px 9px !important; border-radius: 9px; background: rgba(255,255,255,.05); }
#lp .acx-bell svg { width: 13px; height: 13px; color: var(--coral); }
#lp .acx-on .acx-bell svg { animation: acxring 2.6s ease-in-out infinite; transform-origin: 50% 10%; }
@keyframes acxring { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(16deg); } 82% { transform: rotate(-14deg); } 89% { transform: rotate(8deg); } }
/* relances : frise */
#lp .acx-tl { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding-top: 22px !important; }
#lp .acx-tl::before { content: ''; position: absolute; left: 12%; right: 12%; top: 29px; height: 2px; background: rgba(255,255,255,.1); }
#lp .acx-tl::after { content: ''; position: absolute; left: 12%; top: 29px; height: 2px; width: 0; background: var(--coral); }
#lp .acx-on .acx-tl::after { animation: acxline 7s cubic-bezier(.16,1,.3,1) infinite; }
@keyframes acxline { 0% { width: 0; } 40% { width: 76%; } 85% { width: 76%; opacity: 1; } 95%, 100% { width: 76%; opacity: 0; } }
#lp .acx-tl div { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; font-size: 11.5px; color: rgba(255,255,255,.65); }
#lp .acx-tl div::before { content: ''; width: 16px; height: 16px; border-radius: 50%; background: #0D0D0F; border: 2px solid rgba(255,138,91,.8); position: relative; z-index: 1; }
#lp .acx-tl div b { display: block; color: #fff; font-weight: 500; font-size: 12px; }
/* modifs intelligentes : mini grille d'annonces */
#lp .acx-mg { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
#lp .acx-mg i { position: relative; display: block; height: 34px; border-radius: 8px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.05); }
#lp .acx-mg i::after { content: '−10 %'; position: absolute; inset: 0; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 600; color: #160904; background: var(--coral); border-radius: 7px; opacity: 0; }
#lp .acx-on .acx-mg i::after { animation: acxseq 8s cubic-bezier(.16,1,.3,1) infinite; animation-delay: calc(var(--k, 0) * .35s); }
#lp .acx-mgt { display: flex; justify-content: space-between; font-size: 11.5px; color: rgba(255,255,255,.55); }
#lp .acx-mgt b { color: #fff; font-weight: 500; }
/* photos sur demande */
#lp .acx-ph { display: grid; grid-template-columns: 1fr 64px; gap: 10px; align-items: center; }
#lp .acx-ph img { width: 64px; height: 84px; object-fit: cover; border-radius: 10px; display: block; border: 1px solid rgba(255,255,255,.12); }
/* autres fonctions + bientot */
#lp .acx-more { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px !important; }
#lp .acx-more .acx-chip { height: auto; min-height: 30px; padding: 6px 12px !important; white-space: normal; line-height: 1.3; font-size: 12.5px; }
#lp .acx-moreh { margin-top: 26px !important; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.5); }
#lp .acx-soon { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 10px !important; }
@media (min-width: 720px) { #lp .acx-soon { grid-template-columns: repeat(3, 1fr); } }
#lp .acx-so { display: flex; flex-direction: column; gap: 6px; padding: 16px !important; border-radius: 18px; border: 1px dashed rgba(255,255,255,.14); background: rgba(255,255,255,.015); }
#lp .acx-so b { font-size: 15px; font-weight: 450; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#lp .acx-so p { color: rgba(255,255,255,.55); font-size: 13.5px; line-height: 1.45; }

/* ================= SUIVI FOURNISSEURS ================= */
#lp .acx-fo { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: stretch; }
#lp .acx-fo-l { display: flex; flex-direction: column; gap: 16px; padding: 24px 20px !important; }
#lp .acx-fo-l h3 { font-size: 23px; font-weight: 450; letter-spacing: -.02em; line-height: 1.2; }
#lp .acx-fo-r { padding: 16px !important; display: flex; flex-direction: column; gap: 12px; }
#lp .acx-fp { display: grid; grid-template-columns: 64px 1fr; gap: 12px; align-items: center; }
#lp .acx-fp img { width: 64px; height: 82px; border-radius: 10px; object-fit: cover; display: block; }
#lp .acx-fp b { display: block; font-size: 14.5px; font-weight: 500; }
#lp .acx-fp small { display: block; font-size: 12px; color: rgba(255,255,255,.5); margin-top: 3px !important; }
#lp .acx-fp small i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #2ecc71; margin-right: 5px !important; vertical-align: 1px; box-shadow: 0 0 8px rgba(46,204,113,.7); }
#lp .acx-ct { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
#lp .acx-ct div { border-radius: 10px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06); padding: 8px 4px !important; text-align: center; }
#lp .acx-ct small { display: block; font-size: 10.5px; letter-spacing: .06em; color: rgba(255,255,255,.5); }
#lp .acx-ct b { display: block; margin-top: 3px !important; font-size: 12.5px; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
#lp .acx-on .acx-ct div { animation: acxpin .7s cubic-bezier(.16,1,.3,1) both; }
#lp .acx-on .acx-ct div:nth-child(2) { animation-delay: .1s; } #lp .acx-on .acx-ct div:nth-child(3) { animation-delay: .2s; } #lp .acx-on .acx-ct div:nth-child(4) { animation-delay: .3s; } #lp .acx-on .acx-ct div:nth-child(5) { animation-delay: .4s; }
#lp .acx-calc { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 6px; align-items: center; text-align: center; }
#lp .acx-calc > div { border-radius: 12px; padding: 10px 6px !important; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06); }
#lp .acx-calc > div.m { border-color: var(--coral-l); background: var(--coral-s); }
#lp .acx-calc small { display: block; font-size: 10.5px; color: rgba(255,255,255,.55); letter-spacing: .04em; }
#lp .acx-calc b { display: block; margin-top: 3px !important; font-size: 16px; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
#lp .acx-calc .m b { color: var(--coral); }
#lp .acx-calc em { font-style: normal; color: rgba(255,255,255,.4); font-size: 14px; }
#lp .acx-mbar { height: 8px; border-radius: 8px; background: rgba(255,255,255,.07); overflow: hidden; display: flex; }
#lp .acx-mbar i { display: block; height: 100%; width: 0; transition: width 1.4s cubic-bezier(.16,1,.3,1) .3s; }
#lp .acx-mbar .c1 { background: rgba(255,255,255,.35); } #lp .acx-mbar .c2 { background: linear-gradient(90deg, rgba(255,138,91,.6), var(--coral)); }
#lp .acx-on .acx-mbar .c1 { width: 38%; } #lp .acx-on .acx-mbar .c2 { width: 62%; }
#lp .acx-mleg { display: flex; justify-content: space-between; font-size: 11.5px; color: rgba(255,255,255,.55); }
@media (min-width: 980px) { #lp .acx-fo { grid-template-columns: 1fr 1fr; } #lp .acx-fo-l { padding: 32px !important; } #lp .acx-fo-r { padding: 22px !important; } #lp .acx-fo-l h3 { font-size: 26px; } }
@media (max-width: 400px) { #lp .acx-calc b { font-size: 14px; } #lp .acx-ct b { font-size: 11.5px; } }

/* ================= sans animation ================= */
@media (prefers-reduced-motion: reduce) {
  #lp .acxbg i { transition: none !important; }
  #lp .acx-d .q, #lp .acx-tag, #lp .acx-mg i::after, #lp .acx-p, #lp .acx-s, #lp .acx-ct div { opacity: 1 !important; animation: none !important; transform: none !important; }
  #lp .acx-mg i:nth-child(-n+5)::after { opacity: 1 !important; }
  #lp .acx-mg i:nth-child(n+6)::after { opacity: 0 !important; }
  #lp .acx-off .acx-case { animation: none !important; opacity: 0 !important; }
  #lp .acx-off .acx-case.c2 { opacity: 1 !important; }
  #lp .acx-rad::after, #lp .acx-tl::after, #lp .acx-bell svg { animation: none !important; }
  #lp .acx-tl::after { width: 76%; }
  #lp .acx-row i u, #lp .acx-mbar i { transition: none !important; }
  #lp .acx-mbar .c1 { width: 38%; } #lp .acx-mbar .c2 { width: 62%; }
  #lp .acx-reel .acx-row i u { width: var(--w, 0%); }
}
