/* ======================================================
   ART CONCEPT RENOV — ANIMATIONS & TRANSITIONS
   ====================================================== */

/* ── PAGE TRANSITION ── */
#page-transition {
  position: fixed; inset: 0; z-index: 9999;
  pointer-events: none;
  display: flex;
}
#page-transition .pt-panel {
  flex: 1;
  background: var(--red);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform .5s cubic-bezier(.77,0,.18,1);
}
#page-transition .pt-panel:nth-child(1) { transition-delay: 0s; }
#page-transition .pt-panel:nth-child(2) { transition-delay: .04s; }
#page-transition .pt-panel:nth-child(3) { transition-delay: .08s; }
#page-transition .pt-panel:nth-child(4) { transition-delay: .12s; }
#page-transition .pt-panel:nth-child(5) { transition-delay: .16s; }
#page-transition.entering .pt-panel {
  transform: scaleY(1);
  transform-origin: bottom;
}
#page-transition.leaving .pt-panel {
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .45s cubic-bezier(.77,0,.18,1);
}
#page-transition.leaving .pt-panel:nth-child(1) { transition-delay: 0s; }
#page-transition.leaving .pt-panel:nth-child(2) { transition-delay: .04s; }
#page-transition.leaving .pt-panel:nth-child(3) { transition-delay: .08s; }
#page-transition.leaving .pt-panel:nth-child(4) { transition-delay: .12s; }
#page-transition.leaving .pt-panel:nth-child(5) { transition-delay: .16s; }

/* ── SCROLL REVEAL ── */
[data-reveal] {
  opacity: 0;
  transition: opacity .7s ease, transform .7s cubic-bezier(.25,.46,.45,.94);
}
[data-reveal="up"]    { transform: translateY(40px); }
[data-reveal="left"]  { transform: translateX(-40px); }
[data-reveal="right"] { transform: translateX(40px); }
[data-reveal="scale"] { transform: scale(.93); }
[data-reveal].revealed {
  opacity: 1;
  transform: translate(0) scale(1);
}
/* Délais en cascade */
[data-delay="1"] { transition-delay: .1s; }
[data-delay="2"] { transition-delay: .2s; }
[data-delay="3"] { transition-delay: .3s; }
[data-delay="4"] { transition-delay: .4s; }
[data-delay="5"] { transition-delay: .5s; }
[data-delay="6"] { transition-delay: .6s; }

/* ── NAVBAR SCROLL ── */
.acr-nav {
  transition: background .3s, box-shadow .3s, height .3s;
}
.acr-nav.scrolled {
  background: rgba(10,10,10,.96) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 2px 20px rgba(0,0,0,.4);
  height: 60px !important;
}

/* ── HERO AMÉLIORÉ ── */
.acr-hero .tag {
  animation: slideInTag .6s cubic-bezier(.25,.46,.45,.94) both;
  animation-delay: .3s;
}
.acr-hero h1 {
  animation: heroReveal .8s cubic-bezier(.25,.46,.45,.94) both;
  animation-delay: .5s;
}
.acr-hero .sub {
  animation: heroReveal .7s cubic-bezier(.25,.46,.45,.94) both;
  animation-delay: .75s;
}
.acr-hero .hero-btns {
  animation: heroReveal .6s cubic-bezier(.25,.46,.45,.94) both;
  animation-delay: .95s;
}
.acr-hero .stats {
  animation: heroReveal .6s cubic-bezier(.25,.46,.45,.94) both;
  animation-delay: 1.1s;
}
@keyframes slideInTag {
  from { opacity:0; transform: translateX(-20px); }
  to   { opacity:1; transform: translateX(0); }
}
@keyframes heroReveal {
  from { opacity:0; transform: translateY(30px); }
  to   { opacity:1; transform: translateY(0); }
}

/* ── BARRE ROUGE HERO ANIMATE ── */
.acr-hero .red-bar {
  animation: barGrow 1s cubic-bezier(.77,0,.18,1) both;
  animation-delay: .2s;
}
@keyframes barGrow {
  from { transform: scaleY(0); transform-origin: top; }
  to   { transform: scaleY(1); transform-origin: top; }
}

/* ── SERVICE CARDS ── */
.service-card {
  transition: background .25s, transform .25s, box-shadow .25s !important;
}
.service-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 40px rgba(192,57,43,.12) !important;
  border-color: var(--red) !important;
  z-index: 1;
}
.service-card .sc-icon {
  transition: transform .3s, background .3s;
}
.service-card:hover .sc-icon {
  transform: scale(1.08) rotate(-3deg);
  background: var(--red-d) !important;
}
.service-card .sc-link {
  transition: gap .2s, color .2s;
}
.sc-link i {
  transition: transform .2s;
}
.service-card:hover .sc-link i {
  transform: translateX(4px);
}

/* ── WHY CARDS ── */
.why-card {
  transition: background .2s, transform .2s, border-color .2s !important;
  position: relative; overflow: hidden;
}
.why-card::before {
  content: '';
  position: absolute; left: 0; top: 0;
  width: 3px; height: 0;
  background: var(--red);
  transition: height .3s;
}
.why-card:hover::before { height: 100%; }
.why-card:hover {
  background: #fff !important;
  transform: translateY(-3px) !important;
}

/* ── ZONE CITIES ── */
.zone-city {
  transition: background .2s, color .2s, transform .15s !important;
}
.zone-city:hover {
  background: var(--red) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}

/* ── BUTTONS ── */
.btn-red, .btn-outline-red, .btn-white, .nav-cta {
  transition: background .2s, color .2s, transform .15s, box-shadow .15s !important;
}
.btn-red:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 20px rgba(192,57,43,.35) !important; }
.btn-outline-red:hover { transform: translateY(-2px) !important; }
.btn-white:hover { transform: translateY(-2px) !important; }

/* ── COUNTERS ── */
.stat-num {
  transition: color .3s;
}

/* ── HERO GRID PARALLAX ── */
.acr-hero::before {
  transform: translateY(0);
  transition: transform .1s linear;
  will-change: transform;
}

/* ── SECTION LABEL LINE ── */
.section-label::before {
  transition: width .5s cubic-bezier(.25,.46,.45,.94);
  width: 0;
}
.section-label.revealed::before { width: 28px; }

/* ── LOGO FOOTER HOVER ── */
.footer-brand img {
  transition: opacity .2s, filter .2s;
  opacity: .7;
}
.footer-brand img:hover { opacity: 1; }

/* ── CURSOR LINE HOVER NAV ── */
.acr-nav .nav-links a {
  position: relative;
}
.acr-nav .nav-links a::after {
  content: '';
  position: absolute; left: 0; bottom: -4px;
  width: 0; height: 2px; background: var(--red);
  transition: width .25s;
}
.acr-nav .nav-links a:hover::after { width: 100%; }
