/* ============================================================
   Rapide IPTV — Couche premium : animations & micro-interactions
   100% transform/opacity/filter · GPU · respecte reduced-motion
   ============================================================ */

/* --- Fond : aurora + noise (subtils) --- */
.fx-aurora,.fx-noise{position:fixed;inset:0;pointer-events:none;}
.fx-aurora{z-index:-2;overflow:hidden;}
.fx-aurora::before,.fx-aurora::after{content:"";position:absolute;width:62vmax;height:62vmax;border-radius:50%;filter:blur(90px);will-change:transform;}
.fx-aurora::before{background:radial-gradient(circle,rgba(47,107,255,0.9),transparent 60%);opacity:0.30;top:-22vmax;right:-12vmax;}
.fx-aurora::after{background:radial-gradient(circle,rgba(23,224,176,0.9),transparent 60%);opacity:0.22;bottom:-24vmax;left:-14vmax;}
.fx-noise{z-index:-1;opacity:0.04;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* --- Micro-interactions : toujours actives (sans mouvement d'entrée) --- */
.btn{position:relative;overflow:hidden;transition:transform .22s cubic-bezier(.22,.61,.36,1),box-shadow .25s ease,background .25s ease,border-color .2s ease,color .2s ease;}
.btn:active{transform:scale(.96);}
.btn--primary::before,.btn--accent::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,transparent 25%,rgba(255,255,255,0.28),transparent 75%);transform:translateX(-130%);transition:transform .6s ease;pointer-events:none;}
.btn--primary:hover::before,.btn--accent:hover::before{transform:translateX(130%);}

.card{transition:transform .32s cubic-bezier(.22,.61,.36,1),border-color .3s ease,background .3s ease,box-shadow .32s ease;}
.card:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:var(--shadow-lg);}
.icon-badge{transition:transform .32s cubic-bezier(.34,1.56,.64,1),background .3s ease,box-shadow .3s ease;}
.card:hover .icon-badge{transform:translateY(-3px) scale(1.08);box-shadow:0 10px 24px rgba(23,224,176,0.18);}

.plan{transition:transform .32s cubic-bezier(.22,.61,.36,1),border-color .3s ease,box-shadow .32s ease;}
.plan:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);}
.plan--featured{isolation:isolate;}
.plan--featured::after{content:"";position:absolute;inset:-1.5px;border-radius:inherit;background:linear-gradient(135deg,#17e0b0,#2f6bff);opacity:.55;z-index:-1;filter:blur(14px);}
.plan__flag{will-change:box-shadow;}

.quote{transition:transform .3s cubic-bezier(.22,.61,.36,1),border-color .3s ease,box-shadow .3s ease;}
.quote:hover{transform:translateY(-5px);border-color:var(--color-border-strong);box-shadow:var(--shadow-md);}
.quote__avatar{transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
.quote:hover .quote__avatar{transform:scale(1.08) rotate(-3deg);}

.info-item{transition:transform .3s ease,border-color .3s ease,background .3s ease;}
.info-item:hover{transform:translateY(-3px);border-color:var(--color-border-strong);background:var(--color-surface-2);}
.info-item:hover .icon-badge{transform:scale(1.08);}

.faq__item{transition:border-color .3s ease,background .3s ease;}
.faq__item:hover{border-color:var(--color-border-strong);}
.faq__item[open]{background:var(--color-surface-2);}
.faq__answer{animation:ri-faq .38s cubic-bezier(.22,.61,.36,1);}

.nav__links a{position:relative;}
.nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gradient-accent);border-radius:var(--radius-pill);transform:scaleX(0);transform-origin:left center;transition:transform .32s cubic-bezier(.22,.61,.36,1);}
.nav__links a:hover::after,.nav__links a[aria-current="page"]::after{transform:scaleX(1);}

.site-header{transition:background .3s ease,box-shadow .3s ease,border-color .3s ease;}
.nav{transition:min-height .3s ease;}
.site-header.is-scrolled{background:rgba(10,14,26,0.9);box-shadow:0 10px 34px rgba(0,0,0,0.4);}
.site-header.is-scrolled .nav{min-height:60px;}

.footer-col a{display:inline-block;transition:transform .25s ease,color .25s ease;}
.footer-col a:hover{transform:translateX(5px);color:var(--color-accent);}
.socials a{transition:transform .3s cubic-bezier(.34,1.56,.64,1),border-color .3s ease,color .3s ease,box-shadow .3s ease;}
.socials a:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 10px 22px rgba(23,224,176,0.22);}

/* --- Effets animes (uniquement si mouvement autorise) --- */
@media (prefers-reduced-motion: no-preference){
  .fx-aurora::before{animation:ri-auroraA 26s ease-in-out infinite alternate;}
  .fx-aurora::after{animation:ri-auroraB 32s ease-in-out infinite alternate;}

  .cta-band{background-size:200% 200%;animation:ri-grad 14s ease infinite;}

  .hero__floating{animation:ri-float 6s ease-in-out 1.2s infinite;will-change:transform;}

  /* Entree Hero (accueil) : blur + fade en cascade */
  .js-motion .hero__content > *{opacity:0;animation:ri-heroIn .9s cubic-bezier(.22,.61,.36,1) forwards;}
  .js-motion .hero__content > .badge{animation-delay:.05s;}
  .js-motion .hero__content > .hero__title{animation-delay:.16s;}
  .js-motion .hero__content > .hero__lead{animation-delay:.32s;}
  .js-motion .hero__content > .hero__actions{animation-delay:.48s;}
  .js-motion .hero__content > .hero__trust{animation-delay:.62s;}
  .js-motion .hero__media{opacity:0;animation:ri-heroMedia 1.1s cubic-bezier(.22,.61,.36,1) .3s forwards;will-change:transform,opacity;}

  /* Entree Page-hero (pages internes) */
  .js-motion .page-hero .container > *{opacity:0;animation:ri-heroIn .8s cubic-bezier(.22,.61,.36,1) forwards;}
  .js-motion .page-hero .container > *:nth-child(1){animation-delay:.05s;}
  .js-motion .page-hero .container > *:nth-child(2){animation-delay:.14s;}
  .js-motion .page-hero .container > *:nth-child(3){animation-delay:.24s;}
  .js-motion .page-hero .container > *:nth-child(4){animation-delay:.36s;}
  .js-motion .page-hero .container > *:nth-child(5){animation-delay:.48s;}

  /* Reveals au scroll (classes ajoutees par motion.js) */
  .js-motion .reveal{opacity:0;transition:opacity .7s cubic-bezier(.22,.61,.36,1) var(--rd,0s),transform .7s cubic-bezier(.22,.61,.36,1) var(--rd,0s),filter .7s ease var(--rd,0s);will-change:transform,opacity;}
  .js-motion .reveal--up{transform:translate3d(0,34px,0);}
  .js-motion .reveal--down{transform:translate3d(0,-30px,0);}
  .js-motion .reveal--left{transform:translate3d(40px,0,0);}
  .js-motion .reveal--right{transform:translate3d(-40px,0,0);}
  .js-motion .reveal--scale{transform:scale(.92);}
  .js-motion .reveal--blur{filter:blur(16px);}
  .js-motion .reveal.is-in{opacity:1;transform:none;filter:none;}
}

@keyframes ri-heroIn{from{opacity:0;transform:translate3d(0,26px,0);filter:blur(9px);}to{opacity:1;transform:none;filter:blur(0);}}
@keyframes ri-heroMedia{from{opacity:0;transform:translate3d(0,32px,0) scale(.96);}to{opacity:1;transform:none;}}
@keyframes ri-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
@keyframes ri-faq{from{opacity:0;transform:translateY(-7px);}to{opacity:1;transform:none;}}
@keyframes ri-grad{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
@keyframes ri-auroraA{to{transform:translate3d(-9vmax,11vmax,0) scale(1.22);}}
@keyframes ri-auroraB{to{transform:translate3d(11vmax,-9vmax,0) scale(1.18);}}
@keyframes ri-flag{0%,100%{box-shadow:0 0 0 0 rgba(23,224,176,0);}50%{box-shadow:0 0 0 9px rgba(23,224,176,0.14);}}
@media (prefers-reduced-motion: no-preference){.plan__flag{animation:ri-flag 2.6s ease-in-out infinite;}}