/* ORAFIRST — systeme de motion partage (toutes les pages) */
/* N'edite jamais de fichier image/video ici : uniquement conteneurs, calques, transitions. */

/* ---------- Retour en haut ---------- */
.back-to-top{
  position:fixed; right:24px; bottom:24px; z-index:500;
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(21,17,12,.72);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(212,175,55,.35);
  color:#f4f1ea;
  font-size:1.1rem;
  line-height:1;
  cursor:pointer;
  opacity:0; pointer-events:none;
  transform:translateY(12px);
  transition:opacity .3s ease, transform .3s ease, border-color .3s ease, background .3s ease;
}
.back-to-top.is-visible{ opacity:1; pointer-events:auto; transform:translateY(0); }
.back-to-top:hover{ border-color:rgba(212,175,55,.7); background:rgba(10,6,18,.85); }
@media (max-width:640px){
  .back-to-top{ right:16px; bottom:16px; width:40px; height:40px; font-size:1rem; }
}

/* ---------- Mention "exemples fictifs" (pages realisations + tarifs) ---------- */
.disclaimer-note{
  max-width:70ch;
  margin:20px auto 0;
  padding:14px 22px;
  text-align:center;
  border:1px solid rgba(212,175,55,.22);
  border-radius:12px;
  background:rgba(212,175,55,.05);
  color:var(--muted,#cdbf9f);
  font-size:.8rem;
  line-height:1.65;
}
.disclaimer-note b{ color:var(--purple,#d4af37); font-weight:700; }
.disclaimer-note--tarifs{ margin:12px auto 0; max-width:900px; }

/* ---------- Reveal au scroll ---------- */
.js [data-reveal]{
  opacity:0;
  transition:
    opacity .7s cubic-bezier(.16,.8,.24,1),
    transform .8s cubic-bezier(.16,.8,.24,1),
    filter .8s cubic-bezier(.16,.8,.24,1);
  transition-delay: var(--reveal-delay, 0s);
  will-change: opacity, transform, filter;
}
.js [data-reveal="up"]{ transform: translateY(28px); }
.js [data-reveal="down"]{ transform: translateY(-20px); }
.js [data-reveal="scale"]{ transform: scale(.96); }
.js [data-reveal="blur"]{ transform: translateY(18px); }   /* sans flou : plus fluide sur les appareils modestes */
.js [data-reveal="left"]{ transform: translateX(-24px); }
.js [data-reveal="right"]{ transform: translateX(24px); }
.js [data-reveal="fade"]{ transform:none; }

.js [data-reveal].is-revealed{
  opacity:1;
  transform:none;
  filter:blur(0);
}

/* ---------- Fil dore lumineux ---------- */
.gold-thread{
  position:relative;
  width:2px;
  margin:0 auto;
  background:rgba(212,175,55,.14);
  overflow:hidden;
  pointer-events:none;
}
.gold-thread-fill{
  position:absolute; left:0; top:0; width:100%;
  height:0%;
  background:linear-gradient(var(--blue,#f0dfa8), var(--purple,#d4af37));
  box-shadow:0 0 12px 1px rgba(212,175,55,.5);
  transition:height .15s linear;
}

/* ---------- Cartes : tilt + lueur au survol ---------- */
[data-tilt]{
  transition: transform .35s cubic-bezier(.16,.8,.24,1), box-shadow .35s ease, border-color .35s ease;
  transform-style: preserve-3d;
  will-change: transform;
}
[data-tilt].tilt-active{ transition: transform .08s linear; }

/* ---------- Boutons magnetiques ---------- */
[data-magnetic]{
  transition: transform .35s cubic-bezier(.16,.8,.24,1);
  will-change: transform;
}
[data-magnetic].magnet-active{ transition: transform .12s ease-out; }
[data-magnetic] [data-magnetic-label]{
  display:inline-block;
  transition: transform .35s cubic-bezier(.16,.8,.24,1);
}
[data-magnetic].magnet-active [data-magnetic-label]{ transition: transform .12s ease-out; }

/* ---------- Conteneurs media (video/image) : reveal doux, jamais le fichier lui-meme ---------- */
.js [data-media-reveal]{
  opacity:0;
  transform: scale(.97);
  transition: opacity .9s cubic-bezier(.16,.8,.24,1), transform 1s cubic-bezier(.16,.8,.24,1);
}
.js [data-media-reveal].is-revealed{ opacity:1; transform:scale(1); }

/* ---------- Compteurs ---------- */
[data-counter]{ font-variant-numeric: tabular-nums; }

/* ---------- Parallax (transform uniquement) ---------- */
[data-parallax]{ will-change: transform; }

/* ---------- Curseur premium (desktop uniquement) ---------- */
.orf-cursor-dot,
.orf-cursor-ring{
  position:fixed; top:0; left:0;
  pointer-events:none;
  z-index:2000;
  transform:translate3d(-100px,-100px,0);
}
.orf-cursor-dot{
  width:6px; height:6px; margin:-3px 0 0 -3px;
  border-radius:50%;
  background:var(--purple,#d4af37);
  transition: opacity .2s ease, background .25s ease;
}
.orf-cursor-ring{
  width:34px; height:34px; margin:-17px 0 0 -17px;
  border-radius:50%;
  border:1px solid rgba(212,175,55,.55);
  transition: width .25s cubic-bezier(.16,.8,.24,1), height .25s cubic-bezier(.16,.8,.24,1),
              margin .25s cubic-bezier(.16,.8,.24,1), border-color .25s ease, opacity .2s ease,
              background .25s ease;
}
.orf-cursor-ring.is-cta{ width:52px; height:52px; margin:-26px 0 0 -26px; background:rgba(212,175,55,.08); border-color:rgba(212,175,55,.85); }
.orf-cursor-ring.is-card{ width:44px; height:44px; margin:-22px 0 0 -22px; border-color:rgba(212,175,55,.4); }
.orf-cursor-ring.is-video{ width:60px; height:60px; margin:-30px 0 0 -30px; background:rgba(10,6,18,.55); backdrop-filter:blur(3px); }
.orf-cursor-ring.is-video::after{
  content:'▶'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:.7rem; color:#f4f1ea;
}
.orf-cursor-ring{ display:flex; align-items:center; justify-content:center; }

html.orf-has-cursor, html.orf-has-cursor a, html.orf-has-cursor button{ cursor:none; }

/* ---------- prefers-reduced-motion : version calme ---------- */
@media (prefers-reduced-motion: reduce){
  [data-reveal]{
    transition: opacity .3s ease !important;
    transform:none !important;
    filter:none !important;
  }
  [data-media-reveal]{ transition: opacity .3s ease !important; transform:none !important; }
  [data-tilt]{ transition:none !important; }
  [data-magnetic]{ transition:none !important; transform:none !important; }
  [data-parallax]{ transform:none !important; }
  .orf-cursor-dot, .orf-cursor-ring{ display:none !important; }
  html.orf-has-cursor, html.orf-has-cursor a, html.orf-has-cursor button{ cursor:auto; }
}

/* ---------- Tactile / pas de pointeur fin : desactive les micro-interactions desktop ---------- */
@media (hover:none), (pointer:coarse){
  .orf-cursor-dot, .orf-cursor-ring{ display:none !important; }
  html.orf-has-cursor, html.orf-has-cursor a, html.orf-has-cursor button{ cursor:auto; }
  [data-magnetic]{ transform:none !important; }
  [data-magnetic] [data-magnetic-label]{ transform:none !important; }
}

@media (max-width:760px){
  [data-parallax]{ transform:none !important; }
  [data-tilt]{ transform:none !important; }
}