/* atlas-club.html · section « Soutenez l'atelier IT mobile » (.acm) : 4 cartes de soutien (.acm-mode avec photo), pastille, CTA. Additif à atlas-club-inline.css.
   Aurore de fond, bordure dégradée qui s'allume, lumière au pointeur + relief 3D (--mx/--my/--rx/--ry/--px/--py par atlas-acm-premium.js), photo en parallaxe + reflet, icône qui se colore avec anneau, cascade. Texte inchangé. */
:root{--acmp-ease:cubic-bezier(.22,1,.36,1)}
@keyframes acmpRing{0%{transform:scale(.85);opacity:0}30%{opacity:.9}100%{transform:scale(1.5);opacity:0}}
@keyframes acmpSheenFast{0%{left:-45%;opacity:0}20%{opacity:1}100%{left:140%;opacity:0}}
@keyframes acmpSwatch{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes acmpBob{0%,100%{translate:0 0}50%{translate:0 -4px}}
@keyframes acmpAurora{to{transform:rotate(360deg)}}
@keyframes acmpIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.acm{overflow:hidden;isolation:isolate}
/* Fond laissé blanc (demande du 10/09) : pas d'aurore derrière la section */
.acm .acmp-aurora{display:none}
.acm>.container{position:relative;z-index:1}
.acmp-light{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .5s;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(37,99,235,.1),rgba(249,115,22,.03) 55%,transparent 72%)}
.acmp-sheen{position:absolute;z-index:2;top:-25%;bottom:-25%;left:-45%;width:34%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.3),transparent);transform:skewX(-18deg);opacity:0}
body.atlas-dark .acmp-light{background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(147,197,253,.16),transparent 72%)}
body.atlas-dark .acmp-sheen{background:linear-gradient(100deg,transparent,rgba(190,215,255,.18),transparent)}
/* pastille + CTA */
.acm-pill{position:relative;overflow:hidden}
.acm-pill::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,rgba(37,99,235,.18) 50%,transparent 70%);transform:translateX(-120%);animation:acmpSwatch 5s ease-in-out infinite}
.acm-cta{position:relative;overflow:hidden}
.acm-cta::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.32) 50%,transparent 70%);transform:translateX(-120%);animation:acmpSwatch 4.5s ease-in-out infinite}
.acm-cta svg{transition:transform .4s var(--acmp-ease)}
.acm-cta:hover svg{transform:translateX(4px)}
/* ══ cartes de soutien ══ */
.acm-modes{perspective:1400px}
.acm-mode{isolation:isolate;border-color:transparent!important;background:linear-gradient(var(--off,#f5f7ff),var(--off,#f5f7ff)) padding-box,linear-gradient(135deg,rgba(37,99,235,.28),rgba(226,232,240,.9) 50%,rgba(249,115,22,.2)) border-box!important;transform-style:preserve-3d;transition:transform .5s var(--acmp-ease),box-shadow .5s,background .5s!important}
.acm-mode:hover{transform:translateY(-3px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))!important;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,rgba(37,99,235,.85),rgba(96,165,250,.35) 50%,rgba(249,115,22,.75)) border-box!important;box-shadow:0 36px 72px -30px rgba(37,99,235,.42)!important}
.acm-mode:hover .acmp-light{opacity:1}
.acm-mode:hover .acmp-sheen{animation:acmpSheenFast 1s var(--acmp-ease) forwards}
.acm-mode>:not(.acm-mode-media):not(.acmp-light):not(.acmp-sheen){position:relative;z-index:3}
.acm-mode-media img{transform:translate(var(--px,0),var(--py,0)) scale(1.06)!important}
.acm-mode:hover .acm-mode-media img{transform:translate(var(--px,0),var(--py,0)) scale(1.06)!important}
.acm-mode-ico{position:relative;transition:transform .5s cubic-bezier(.34,1.56,.64,1),background .45s,box-shadow .45s}
.acm-mode-ico::before{content:'';position:absolute;inset:-5px;border-radius:inherit;border:1.5px solid rgba(37,99,235,.4);opacity:0;animation:acmpRing 3.4s ease-in-out infinite;pointer-events:none}
.acm-mode:nth-child(2) .acm-mode-ico::before{animation-delay:.85s}.acm-mode:nth-child(3) .acm-mode-ico::before{animation-delay:1.7s}.acm-mode:nth-child(4) .acm-mode-ico::before{animation-delay:2.55s}
.acm-mode:hover .acm-mode-ico{transform:translateY(-3px) rotate(-6deg) scale(1.1);background:linear-gradient(145deg,#2563eb,#60a5fa)!important;box-shadow:0 16px 32px -12px rgba(37,99,235,.65)}
.acm-mode:hover .acm-mode-ico svg{stroke:#fff!important}
.acm-mode:nth-child(3):hover .acm-mode-ico{background:linear-gradient(145deg,#f97316,#fbbf24)!important;box-shadow:0 16px 32px -12px rgba(249,115,22,.65)}
.acm-mode strong{transition:color .3s}
.acm-mode:hover strong{color:var(--blue-b,#2563eb)}
.acm-mode:nth-child(3):hover strong{color:var(--orange-d,#ea6c0a)}
.acm-mode strong::after{content:'';display:block;width:20px;height:2px;margin-top:6px;border-radius:2px;background:linear-gradient(90deg,#2563eb,#f97316);transition:width .5s var(--acmp-ease)}
.acm-mode:hover strong::after{width:48px}
.acm-modes.reveal.visible .acm-mode{animation:acmpIn .7s var(--acmp-ease) both}
.acm-modes.reveal.visible .acm-mode:nth-child(2){animation-delay:.08s}.acm-modes.reveal.visible .acm-mode:nth-child(3){animation-delay:.16s}.acm-modes.reveal.visible .acm-mode:nth-child(4){animation-delay:.24s}
body.atlas-dark .acm-mode{background:linear-gradient(rgba(12,24,60,.7),rgba(10,20,52,.6)) padding-box,linear-gradient(135deg,rgba(96,165,250,.35),rgba(96,165,250,.08) 50%,rgba(255,138,60,.25)) border-box!important}
body.atlas-dark .acm-mode:hover{background:linear-gradient(rgba(16,32,80,.8),rgba(12,24,60,.7)) padding-box,linear-gradient(135deg,rgba(96,165,250,.9),rgba(96,165,250,.3) 50%,rgba(255,138,60,.75)) border-box!important;box-shadow:0 36px 72px -30px rgba(37,99,235,.6)!important}
body.atlas-dark .acm-mode:hover strong{color:#93c5fd}
body.atlas-dark .acm-mode:nth-child(3):hover strong{color:#fdba74}
/* ══ accessibilité / mobile ══ */
@media(hover:none){.acmp-light,.acmp-sheen{display:none}.acm-mode:hover{transform:translateY(-4px)!important}}
@media(max-width:720px){.acm .acmp-aurora{filter:blur(34px);animation-duration:70s}}
@media(prefers-reduced-motion:reduce){.acm .acmp-aurora,.acmp-sheen,.acm-pill::after,.acm-cta::after,.acm-mode-ico::before,.acm-modes.reveal.visible .acm-mode{animation:none!important}.acm-mode:hover{transform:none!important}}
