/* Kira Vitrine — couche d'animation (couleurs de la charte uniquement). */
html.kv-js:not(.kv-ready) #dc-root { opacity: 0; animation: kvFailsafe 0s 1.5s forwards; }
@keyframes kvFailsafe { to { opacity: 1; } }
[id] { scroll-margin-top: 84px; }

/* Barre de progression de lecture */
.kv-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60; background: #9FD4D9;
  transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }

/* En-tête */
.kv-head { transition: box-shadow .3s, padding .3s, background-color .3s; }
.kv-head.kv-scrolled { box-shadow: 0 6px 22px rgba(9, 20, 32, .28); }
.kv-nav a { position: relative; }
.kv-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: #9FD4D9;
  transform: scaleX(0); transform-origin: 0 50%; transition: transform .35s ease; }
.kv-nav a:hover::after, .kv-nav a.kv-active::after { transform: scaleX(1); }

/* Accroche : entrée, halo, tracé du « chemin » */
.kv-hero { position: relative; overflow: hidden; }
.kv-hero > * { position: relative; z-index: 1; }
.kv-hero::before { content: ""; position: absolute; z-index: 0; width: 760px; height: 760px; border-radius: 50%;
  background: radial-gradient(circle, rgba(159, 212, 217, .16), rgba(159, 212, 217, 0) 62%);
  top: -260px; right: -180px; animation: kvGlow 16s ease-in-out infinite alternate; pointer-events: none; }
@keyframes kvGlow { from { transform: translate(0, 0); } to { transform: translate(-260px, 160px); } }
.kv-path { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 90px; z-index: 0; pointer-events: none; }
.kv-path .kv-line { fill: none; stroke: rgba(159, 212, 217, .38); stroke-width: 1.6; stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: kvDraw 3.2s .5s cubic-bezier(.6, .1, .2, 1) forwards; }
@keyframes kvDraw { to { stroke-dashoffset: 0; } }
.kv-path .kv-dot { fill: #9FD4D9; opacity: 0; animation: kvFade .6s 3.4s forwards; }
@keyframes kvFade { to { opacity: 1; } }

.kv-in { opacity: 0; transform: translateY(22px); animation: kvIn .9s cubic-bezier(.2, .7, .2, 1) forwards;
  animation-delay: var(--d, 0s); }
.kv-in-r { opacity: 0; transform: translateX(40px) scale(.97); animation: kvIn 1.1s cubic-bezier(.2, .7, .2, 1) forwards;
  animation-delay: var(--d, 0s); }
@keyframes kvIn { to { opacity: 1; transform: none; } }

/* Carrousel de l'accroche */
.kv-slide { transition: opacity 1.1s ease; opacity: 0; }
.kv-slide.kv-cur { opacity: 1; }
.kv-dots span { position: relative; overflow: hidden; cursor: pointer; background: rgba(255, 255, 255, .35) !important; }
.kv-dots span::after { content: ""; position: absolute; inset: 0; background: #9FD4D9; transform: scaleX(0); transform-origin: 0 50%; }
.kv-dots span.kv-cur::after { animation: kvBar var(--t, 6s) linear forwards; }
.kv-dots span.kv-seen::after { transform: scaleX(1); }
.kv-dots.kv-paused span.kv-cur::after { animation-play-state: paused; }
@keyframes kvBar { to { transform: scaleX(1); } }

/* Apparition au défilement */
.kv-rv { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1);
  transition-delay: var(--d, 0s); }
.kv-rv.kv-zoom { transform: translateY(40px) scale(.94); }
.kv-rv.kv-on { opacity: 1; transform: none; }

/* Cartes : survol */
.kv-lift.kv-done { transition: transform .3s ease, box-shadow .3s ease; }
.kv-lift.kv-done:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(9, 20, 32, .12); }
.kv-pan img { transition: object-position 4s ease-in-out, transform .6s ease; }
.kv-pan:hover img { object-position: bottom !important; }
.kv-shot img { transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.kv-shot:hover img { transform: translateY(-8px) scale(1.04); }

/* Chaîne sûre : progression animée */
.kv-chain { transition: background-color .45s, border-color .45s, color .45s, box-shadow .45s; }
.kv-chain.kv-past { background: rgba(159, 212, 217, .16) !important; border-color: rgba(159, 212, 217, .55) !important; }
.kv-chain.kv-now { background: #087E8B !important; border-color: #9FD4D9 !important; color: #fff;
  box-shadow: 0 0 0 0 rgba(159, 212, 217, .6); animation: kvPing 1.2s ease-out; }
@keyframes kvPing { to { box-shadow: 0 0 0 12px rgba(159, 212, 217, 0); } }
.kv-chain + svg { transition: opacity .45s, transform .45s; opacity: .45; }
.kv-chain.kv-past + svg { opacity: 1; transform: translateX(2px); }

@media (prefers-reduced-motion: reduce) {
  html.kv-js:not(.kv-ready) #dc-root { opacity: 1; animation: none; }
  .kv-in, .kv-in-r, .kv-rv { opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; }
  .kv-hero::before, .kv-path .kv-line, .kv-path .kv-dot { animation: none !important; stroke-dashoffset: 0; opacity: 1; }
  .kv-pan img, .kv-shot img { transition: none !important; }
}
