/* atlas-club.html · section Atlas Rewards (#rewards) : cartes d'actions (.ac-why-card avec photo), échelle de récompenses (.ac-scale-item), cartes points/niveaux (.l2-ch-card). Additif à atlas-club.css.
   Bordure dégradée qui s'allume, lumière au pointeur + relief 3D (--mx/--my/--rx/--ry/--px/--py par atlas-rewards-premium.js), photo en parallaxe + reflet, icônes avec anneau, échelle qui s'illumine en relais, cascade. Texte blanc inchangé. */
:root{--rwp-ease:cubic-bezier(.22,1,.36,1)}
@keyframes rwpRing{0%{transform:scale(.85);opacity:0}30%{opacity:.9}100%{transform:scale(1.5);opacity:0}}
@keyframes rwpSheen{0%,72%{left:-45%;opacity:0}76%{opacity:1}100%{left:140%;opacity:0}}
@keyframes rwpSheenFast{0%{left:-45%;opacity:0}20%{opacity:1}100%{left:140%;opacity:0}}
@keyframes rwpSwatch{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes rwpBob{0%,100%{translate:0 0}50%{translate:0 -4px}}
@keyframes rwpIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
#rewards .rwp-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(147,197,253,.2),rgba(252,211,77,.05) 55%,transparent 72%)}
#rewards .rwp-sheen{position:absolute;z-index:2;top:-25%;bottom:-25%;left:-45%;width:34%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(190,215,255,.18),transparent);transform:skewX(-18deg);opacity:0}
/* ══ CARTES D'ACTIONS ══ */
#rewards .ac-why-grid{perspective:1400px}
#rewards .ac-why-card{isolation:isolate;border-color:transparent!important;background:linear-gradient(rgba(12,24,64,.5),rgba(8,16,44,.42)) padding-box,linear-gradient(135deg,rgba(147,197,253,.45),rgba(255,255,255,.06) 50%,rgba(252,211,77,.3)) border-box!important;transform-style:preserve-3d;transition:transform .5s var(--rwp-ease),box-shadow .5s,background .5s!important}
#rewards .ac-why-card:hover{transform:translateY(-3px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))!important;background:linear-gradient(rgba(16,32,80,.6),rgba(10,20,56,.5)) padding-box,linear-gradient(135deg,rgba(147,197,253,.95),rgba(255,255,255,.22) 50%,rgba(252,211,77,.85)) border-box!important;box-shadow:0 38px 76px -30px rgba(37,99,235,.6),inset 0 1px 0 rgba(255,255,255,.12)!important}
#rewards .ac-why-card:hover .rwp-light{opacity:1}
#rewards .ac-why-card:hover .rwp-sheen{animation:rwpSheenFast 1s var(--rwp-ease) forwards}
#rewards .ac-why-card>:not(.ac-why-bg):not(.rwp-light):not(.rwp-sheen){position:relative;z-index:3}
#rewards .ac-why-bg img{transform:translate(var(--px,0),var(--py,0)) scale(1.08);transition:transform .7s var(--rwp-ease),filter .5s}
#rewards .ac-why-card:hover .ac-why-bg img{transform:translate(var(--px,0),var(--py,0)) scale(1.06);filter:saturate(1.1)}
#rewards .ac-why-ic{position:relative;transition:transform .5s cubic-bezier(.34,1.56,.64,1),background .45s,box-shadow .45s,color .45s}
#rewards .ac-why-ic::before{content:'';position:absolute;inset:-5px;border-radius:inherit;border:1.5px solid rgba(147,197,253,.45);opacity:0;animation:rwpRing 3.4s ease-in-out infinite;pointer-events:none}
#rewards .ac-why-card:nth-child(2) .ac-why-ic::before{animation-delay:.85s}#rewards .ac-why-card:nth-child(3) .ac-why-ic::before{animation-delay:1.7s}#rewards .ac-why-card:nth-child(4) .ac-why-ic::before{animation-delay:2.55s}
#rewards .ac-why-card:hover .ac-why-ic{transform:translateY(-3px) rotate(-6deg) scale(1.1);background:linear-gradient(145deg,#2563eb,#60a5fa)!important;color:#fff!important;box-shadow:0 16px 32px -12px rgba(37,99,235,.8)}
#rewards .ac-why-card h3{transition:text-shadow .4s}
#rewards .ac-why-card:hover h3{text-shadow:0 0 14px rgba(147,197,253,.35)}
#rewards .ac-why-card h3::after{content:'';display:block;width:22px;height:2px;margin-top:8px;border-radius:2px;background:linear-gradient(90deg,#60a5fa,#fcd34d);transition:width .5s var(--rwp-ease)}
#rewards .ac-why-card:hover h3::after{width:54px}
#rewards .ac-rwd-n{z-index:3;transition:color .35s,letter-spacing .35s}
#rewards .ac-why-card:hover .ac-rwd-n{color:rgba(252,211,77,.9);letter-spacing:1px}
/* ══ ÉCHELLE DES RÉCOMPENSES ══ */
#rewards .ac-scale{position:relative;gap:14px}
#rewards .ac-scale::before{content:'';position:absolute;left:6%;right:6%;top:30px;height:1px;pointer-events:none;background:linear-gradient(90deg,rgba(96,165,250,.35),rgba(34,211,238,.35),rgba(167,139,250,.35),rgba(249,115,22,.4));z-index:0}
#rewards .ac-scale::after{content:'';position:absolute;left:6%;right:6%;top:30px;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent 0,rgba(255,255,255,.9) 50%,transparent 100%);background-size:24% 100%;background-repeat:no-repeat;animation:rwpScan 7s cubic-bezier(.45,0,.2,1) infinite;z-index:0}
@keyframes rwpScan{0%{background-position:-30% 0;opacity:0}10%{opacity:.9}90%{opacity:.9}100%{background-position:130% 0;opacity:0}}
#rewards .ac-scale-item{position:relative;isolation:isolate;overflow:hidden;z-index:1;border-color:transparent!important;background:linear-gradient(rgba(12,24,64,.72),rgba(10,20,54,.6)) padding-box,linear-gradient(135deg,rgba(147,197,253,.4),rgba(255,255,255,.05) 50%,rgba(252,211,77,.25)) border-box!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .45s var(--rwp-ease),box-shadow .45s,background .45s!important;animation:rwpBob 7s ease-in-out infinite}
#rewards .ac-scale-item:nth-child(2){animation-delay:-1.75s}#rewards .ac-scale-item:nth-child(3){animation-delay:-3.5s}#rewards .ac-scale-item:nth-child(4){animation-delay:-5.25s}
#rewards .ac-scale-item:hover{transform:translateY(-3px)!important;background:linear-gradient(rgba(16,32,80,.82),rgba(12,24,64,.7)) padding-box,linear-gradient(135deg,rgba(147,197,253,.95),rgba(255,255,255,.2) 50%,rgba(252,211,77,.8)) border-box!important;box-shadow:0 28px 56px -24px rgba(37,99,235,.6),inset 0 1px 0 rgba(255,255,255,.14)!important}
#rewards .ac-scale-item::after{content:'';position:absolute;z-index:0;top:-30%;bottom:-30%;left:-45%;width:36%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(190,215,255,.16),transparent);transform:skewX(-18deg);animation:rwpSheen 9s var(--rwp-ease) infinite}
#rewards .ac-scale-item:nth-child(2)::after{animation-delay:1.2s}#rewards .ac-scale-item:nth-child(3)::after{animation-delay:2.4s}#rewards .ac-scale-item:nth-child(4)::after{animation-delay:3.6s}
#rewards .ac-scale-item>*{position:relative;z-index:1}
#rewards .ac-scale-item .rwp-light{z-index:0}
#rewards .ac-scale-item:hover .rwp-light{opacity:1}
#rewards .ac-scale-dot{position:relative;transition:transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .45s}
#rewards .ac-scale-dot::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1.5px solid currentColor;opacity:0;animation:rwpRing 3.2s ease-in-out infinite;pointer-events:none}
#rewards .ac-scale-item:nth-child(2) .ac-scale-dot::after{animation-delay:.8s}#rewards .ac-scale-item:nth-child(3) .ac-scale-dot::after{animation-delay:1.6s}#rewards .ac-scale-item:nth-child(4) .ac-scale-dot::after{animation-delay:2.4s}
#rewards .ac-scale-item:hover .ac-scale-dot{transform:scale(1.35);box-shadow:0 0 22px currentColor}
#rewards .ac-scale-item b{transition:text-shadow .4s}
#rewards .ac-scale-item:hover b{text-shadow:0 0 14px rgba(147,197,253,.35)}
#rewards .ac-scale-item:hover span{color:rgba(255,255,255,.78)}
/* ══ POINTS / NIVEAUX ══ */
#rewards .l2-clubhow{perspective:1400px}
#rewards .l2-ch-card{isolation:isolate;overflow:hidden;border-color:transparent!important;background:linear-gradient(rgba(12,24,64,.6),rgba(8,16,44,.5)) padding-box,linear-gradient(135deg,rgba(147,197,253,.45),rgba(255,255,255,.06) 50%,rgba(252,211,77,.3)) border-box!important;transform-style:preserve-3d;transition:transform .5s var(--rwp-ease),box-shadow .5s,background .5s!important}
#rewards .l2-ch-card:hover{transform:translateY(-3px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))!important;background:linear-gradient(rgba(16,32,80,.7),rgba(10,20,56,.6)) padding-box,linear-gradient(135deg,rgba(147,197,253,.95),rgba(255,255,255,.22) 50%,rgba(252,211,77,.85)) border-box!important;box-shadow:0 36px 72px -30px rgba(37,99,235,.6),inset 0 1px 0 rgba(255,255,255,.12)!important}
#rewards .l2-ch-card:hover .rwp-light{opacity:1}
#rewards .l2-ch-card:hover .rwp-sheen{animation:rwpSheenFast 1s var(--rwp-ease) forwards}
#rewards .l2-ch-card>:not(.rwp-light):not(.rwp-sheen){position:relative;z-index:3}
#rewards .l2-ch-card h3::after{content:'';display:block;width:24px;height:2px;margin-top:10px;border-radius:2px;background:linear-gradient(90deg,#60a5fa,#fcd34d);transition:width .5s var(--rwp-ease)}
#rewards .l2-ch-card:hover h3::after{width:60px}
#rewards .l2-ch-chips span{position:relative;overflow:hidden;transition:transform .4s var(--rwp-ease),background .4s,border-color .4s,color .3s}
#rewards .l2-ch-card:hover .l2-ch-chips span{transform:translateY(-2px)}
#rewards .l2-ch-card:hover .l2-ch-chips span:nth-child(2){transition-delay:.05s}#rewards .l2-ch-card:hover .l2-ch-chips span:nth-child(3){transition-delay:.1s}#rewards .l2-ch-card:hover .l2-ch-chips span:nth-child(4){transition-delay:.15s}#rewards .l2-ch-card:hover .l2-ch-chips span:nth-child(5){transition-delay:.2s}
#rewards .l2-ch-chips span:last-child::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,rgba(252,211,77,.35) 50%,transparent 70%);transform:translateX(-120%);animation:rwpSwatch 5s ease-in-out infinite}
/* ══ cascade ══ */
#rewards .ac-why-card.reveal.visible{animation:rwpIn .7s var(--rwp-ease) both}
#rewards .ac-why-card:nth-child(2).reveal.visible{animation-delay:.08s}#rewards .ac-why-card:nth-child(3).reveal.visible{animation-delay:.16s}#rewards .ac-why-card:nth-child(4).reveal.visible{animation-delay:.24s}
/* ══ accessibilité / mobile ══ */
@media(hover:none){#rewards .rwp-light,#rewards .rwp-sheen{display:none}#rewards .ac-why-card,#rewards .ac-scale-item{backdrop-filter:none;-webkit-backdrop-filter:none}#rewards .ac-why-card:hover,#rewards .l2-ch-card:hover{transform:translateY(-4px)!important}}
@media(max-width:900px){#rewards .ac-scale::before,#rewards .ac-scale::after{display:none}}
@media(prefers-reduced-motion:reduce){#rewards .ac-why-ic::before,#rewards .rwp-sheen,#rewards .ac-scale::after,#rewards .ac-scale-item,#rewards .ac-scale-item::after,#rewards .ac-scale-dot::after,#rewards .l2-ch-chips span:last-child::after,#rewards .ac-why-card.reveal.visible{animation:none!important}#rewards .ac-why-card:hover,#rewards .ac-scale-item:hover,#rewards .l2-ch-card:hover{transform:none!important}}
