/* .r4xd / mise en avant de la boutique (boutique.r4xd.tech). Complète r4xd-horizon.css. */

/* Lien du menu */
.desktop-nav>a.nav-shop{position:relative;display:inline-flex;align-items:center;gap:8px;color:#fff;padding:8px 14px;border:1px solid #4f8dff66;background:linear-gradient(105deg,#387ffe2e,#215adc14);clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);transition:background .25s,border-color .25s}
.desktop-nav>a.nav-shop:hover{background:linear-gradient(105deg,#387ffe55,#215adc33);border-color:#7fb2ff}
.nav-shop-dot{width:6px;height:6px;border-radius:50%;background:#81b9ff;box-shadow:0 0 10px #478fff;animation:shop-pulse 1.8s ease-in-out infinite}
@keyframes shop-pulse{50%{opacity:.35;transform:scale(.7)}}

/* Ruban d'annonce sous l'en-tête */
.shop-ribbon{display:block;position:relative;z-index:39;border-block:1px solid #4f8dff33;background:linear-gradient(90deg,#0a1a3a,#0c2554 50%,#0a1a3a);overflow:hidden}
.shop-ribbon::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(157,206,255,.14) 50%,transparent 70%);transform:translateX(-100%);animation:shop-shine 5s ease-in-out infinite;pointer-events:none}
@keyframes shop-shine{60%,100%{transform:translateX(100%)}}
.shop-ribbon-inner{display:flex;align-items:center;gap:22px;min-height:44px;font-size:12px;color:#c8dbf7}
.shop-ribbon-tag{display:inline-flex;align-items:center;gap:8px;font:600 9px/1 var(--mono);letter-spacing:.14em;color:#fff;padding:6px 9px;background:linear-gradient(105deg,#387ffe,#215adc);clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.shop-ribbon-tag i{width:5px;height:5px;border-radius:50%;background:#fff;animation:shop-pulse 1.8s ease-in-out infinite}
.shop-ribbon-text{flex:1;min-width:0}
.shop-ribbon-cta{display:inline-flex;align-items:center;gap:10px;font-weight:600;color:#fff;white-space:nowrap}
.shop-ribbon-cta svg{width:15px;height:15px;color:#9dceff;transition:transform .3s var(--ease)}
.shop-ribbon:hover .shop-ribbon-cta svg{transform:translate(3px,-3px)}

/* Section boutique */
.shop-feature{position:relative;border-top:1px solid var(--line)}
.shop-feature::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 74% 55%,#1764c84a,transparent 62%);pointer-events:none;z-index:-1}
.shop-live{display:inline-flex;align-items:center;gap:8px;margin-left:auto;color:#8fe3c1}
.shop-live i{width:6px;height:6px;border-radius:50%;background:#3bd39a;box-shadow:0 0 10px #3bd39a;animation:shop-pulse 1.8s ease-in-out infinite}
.shop-feature-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:80px;align-items:center}
.shop-feature-copy .large-copy{margin-top:30px;max-width:470px}
.shop-points{list-style:none;padding:0;margin:34px 0 0;border-top:1px solid var(--line)}
.shop-points li{display:flex;gap:20px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px;color:#a9bad3}
.shop-points span{font:10px var(--mono);letter-spacing:.12em;color:#608ee1}
.shop-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px 34px;margin-top:36px}
.shop-window{position:relative;display:block;background:linear-gradient(160deg,#0c1527,#070b14);border:1px solid rgba(156,191,241,.16);box-shadow:0 40px 100px -40px #1c58c4aa,0 0 0 1px rgba(0,0,0,.4);transition:transform .5s var(--ease),box-shadow .5s,border-color .4s}
.shop-window:hover{transform:translateY(-6px);border-color:rgba(126,188,255,.4);box-shadow:0 50px 110px -40px #2f74f4cc}
.shop-window-bar{display:flex;align-items:center;gap:7px;height:38px;padding:0 14px;border-bottom:1px solid rgba(156,191,241,.1);background:#070c16}
.shop-window-bar i{width:9px;height:9px;border-radius:50%;background:#1d2b44}
.shop-window-bar i:first-child{background:#3a5a8f}
.shop-window-url{margin-left:14px;flex:1;max-width:260px;padding:5px 12px;font:10px var(--mono);letter-spacing:.06em;color:#8fb1dc;background:#0d1626;border:1px solid rgba(156,191,241,.08)}
.shop-window-stage{position:relative;display:grid;place-items:center;aspect-ratio:16/9;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,#1764c86b,transparent 60%),#05070d}
.shop-window-flow{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;animation:flow-drift 20s ease-in-out infinite alternate}
.shop-window-logo{position:relative;width:78%;filter:drop-shadow(0 0 22px rgba(41,108,246,.35));animation:signature-float 10s ease-in-out infinite}
.shop-window-meta{display:flex;flex-wrap:wrap;gap:10px 22px;padding:18px 22px 0;font:9px var(--mono);letter-spacing:.12em;color:#6393d6}
.shop-window-meta span::before{content:"/";margin-right:8px;color:#345685}
.shop-window-cta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:18px 22px 22px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;font-weight:600;color:#d7e7ff}
.shop-window-cta svg{width:17px;height:17px;color:#9dceff;transition:transform .35s var(--ease)}
.shop-window:hover .shop-window-cta svg{transform:translate(3px,-3px)}

@media(max-width:1100px){.shop-feature-grid{gap:50px}}
@media(max-width:850px){
.shop-feature-grid{grid-template-columns:1fr;gap:48px}
.desktop-nav>a.nav-shop{align-self:flex-start}
.shop-ribbon-text{display:none}
.shop-ribbon-inner{justify-content:space-between}
}
@media(max-width:600px){
.shop-ribbon-inner{min-height:40px;gap:12px;font-size:11px}
.shop-points li{font-size:13px;gap:14px}
.shop-actions .button{width:100%}
.shop-live{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.nav-shop-dot,.shop-ribbon::after,.shop-ribbon-tag i,.shop-live i,.shop-window-flow,.shop-window-logo{animation:none}}
.motion-reduced .nav-shop-dot,.motion-reduced .shop-ribbon::after,.motion-reduced .shop-window-flow,.motion-reduced .shop-window-logo{animation:none}
