/* Blinkit — Polish : barre de progression, boutons magnétiques, soulignés animés, parallaxe, tilt 3D, retour en haut. */

/* 1. Barre de progression de lecture */
#scroll-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:120;pointer-events:none;background:linear-gradient(90deg,var(--accent),var(--accent-lt));transform-origin:0 50%;transform:scaleX(0);will-change:transform}

/* 2. Boutons magnétiques + balayage lumineux */
.btn-primary,.btn-ghost,.btn-solid{will-change:transform}
.btn-primary{position:relative;overflow:hidden}
.btn-primary::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.25) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
@media (prefers-reduced-motion: no-preference){.btn-primary:hover::before{transition:transform .7s ease;transform:translateX(120%)}}

/* 3. Souligné qui se dessine sous les mots accentués */
.section-head h2 em,.cta h2 em{background:linear-gradient(currentColor,currentColor) no-repeat 0 94%/0% 2px;padding-bottom:.06em}
@media (prefers-reduced-motion: no-preference){.section-head h2 em,.cta h2 em{transition:background-size .9s cubic-bezier(.22,1,.36,1) .25s}}
.u-draw{background-size:100% 2px!important}

/* 4. Parallaxe douce sur les médias pleine largeur */
.tb-media video{will-change:transform;transform:scale(1.12)}

/* 5. Tilt 3D sur les cartes points forts */
.feat-card{transform-style:preserve-3d}
.feat-card.tilting{transition:none}
.feat-card.tilt-out{transition:transform .5s cubic-bezier(.22,1,.36,1)}

/* 6. Retour en haut avec anneau de progression */
#back-top{position:fixed;left:22px;bottom:90px;width:52px;height:52px;border-radius:50%;border:0;background:var(--ink);color:var(--bg);cursor:pointer;z-index:80;display:grid;place-items:center;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .35s ease,transform .35s ease,visibility .35s;box-shadow:0 8px 24px rgba(20,25,26,0.25)}
#back-top.on{opacity:1;visibility:visible;transform:translateY(0)}
#back-top:hover{background:var(--accent)}
#back-top svg.ring{position:absolute;inset:-4px;width:60px;height:60px;transform:rotate(-90deg);pointer-events:none}
#back-top svg.ring circle{fill:none;stroke:var(--accent-lt);stroke-width:3;stroke-linecap:round;stroke-dasharray:163.4;stroke-dashoffset:163.4}
#back-top .bt-arrow{font-size:20px;line-height:1;transition:transform .3s ease}
#back-top:hover .bt-arrow{transform:translateY(-3px)}
body.dark #back-top{background:var(--accent);color:#fff}
@media (max-width:720px){#back-top{left:14px;bottom:76px;width:46px;height:46px}}
@media print{#scroll-progress,#back-top{display:none}}
