/* ============================================================
 * SOUTAK HELOU — Premium image + scroll enhancement (Shahid-style)
 * Isolated, additive layer. Loads AFTER the base styles so it only
 * refines them. Safe to delete this file to fully revert.
 * ============================================================ */

/* ---- 1) Cinematic artist cards ------------------------------------ */

/* Sharper, slower, more filmic image motion */
.artist-card img{
  transition: transform 1.1s cubic-bezier(.16,1,.3,1), filter .6s ease;
  backface-visibility: hidden;
}

/* Shahid-style bottom scrim so the name/badge stay legible over any photo */
.artist-card::before{
  content:"";
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to top,
    rgba(0,0,0,.88) 0%,
    rgba(0,0,0,.45) 30%,
    rgba(0,0,0,0)  62%);
  transition:opacity .5s ease;
}
.artist-card:hover::before{
  background:linear-gradient(to top,
    rgba(0,0,0,.92) 0%,
    rgba(0,0,0,.35) 42%,
    rgba(0,0,0,0)  72%);
}

/* Keep text + plus button above the new scrim */
.artist-meta{ z-index:2; }
.artist-card .plus{ z-index:3; }

/* Richer hover: gentle push-in + warm cinematic grade */
.artist-card:hover img{
  transform:scale(1.08);
  filter:brightness(1.06) contrast(1.04) saturate(1.06);
}

/* Premium depth — resting + red glow on hover */
.artist-card{
  box-shadow:0 18px 50px -22px rgba(0,0,0,.85);
}
.artist-card:hover{
  box-shadow:0 34px 80px -26px rgba(229,9,20,.42),
             0 18px 50px -20px rgba(0,0,0,.9);
}

/* ---- 2) Opt-in premium hover for Elementor image widgets ---------- */
/* Only affects images inside a wrapper you tag with the CSS class
   "sh-zoom" in Elementor (Advanced > CSS Classes) — never touches logos. */
.elementor-widget-image img{
  transition:transform .8s cubic-bezier(.16,1,.3,1), filter .5s ease;
}
.sh-zoom .elementor-widget-image img,
.sh-zoom.elementor-widget-image img,
.sh-zoom img{
  will-change:transform;
}
.sh-zoom .elementor-widget-image:hover img,
.sh-zoom.elementor-widget-image:hover img,
.sh-zoom:hover img{
  transform:scale(1.05);
  filter:brightness(1.04) saturate(1.05);
}

/* ---- 3) Scroll reveal for Elementor sections / containers --------- */
/* The .sh-reveal class is added by enhance.js ONLY on the front end, so
   if JS never runs the content is shown normally (no hidden content). */
.sh-reveal{
  opacity:0;
  transform:translateY(40px);
  transition:opacity .9s cubic-bezier(.16,1,.3,1),
             transform .9s cubic-bezier(.16,1,.3,1);
  will-change:opacity, transform;
}
.sh-reveal.in{
  opacity:1;
  transform:none;
}

/* ---- 4) Smooth anchor scrolling (no wheel hijack) ---------------- */
html{ scroll-behavior:smooth; }

/* ---- 5) Cinematic hero — Ken Burns background + stronger gradient - */
/* Applied to the first Elementor top-section by enhance.js.            */
.sh-hero{ position:relative; overflow:hidden; isolation:isolate; min-height:clamp(560px,92vh,900px); }

/* Self-hosted hero video promoted to a full-cover background layer. */
.sh-hero-video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center; z-index:0;
  pointer-events:none; background:#000; border:0;
}

/* Ken Burns layer — image injected by JS from the section's own
   background image, so it stays 100% editable in Elementor. */
.sh-hero-kb{
  position:absolute; inset:-2%; z-index:0;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  transform:scale(1.06); transform-origin:52% 42%;
  animation:sh-kenburns 12s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes sh-kenburns{
  0%   { transform:scale(1.06) translate3d(0,0,0); }
  100% { transform:scale(1.20) translate3d(-2.2%,-3%,0); }
}

/* Stronger cinematic gradient: top darken + heavy bottom fade + vignette
   + a warm red core glow. This is the "dégradé plus fort". */
.sh-hero-grad{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.74) 0%, rgba(0,0,0,.16) 26%,
      rgba(0,0,0,.34) 60%, rgba(6,6,6,.97) 100%),
    radial-gradient(120% 78% at 50% 30%, rgba(229,9,20,.22) 0%, rgba(0,0,0,0) 56%),
    radial-gradient(150% 130% at 50% 46%, rgba(0,0,0,0) 52%, rgba(0,0,0,.72) 100%);
}

/* Keep ALL hero content above the new layers (classic + flex sections). */
.sh-hero > .elementor-container,
.sh-hero > .e-con-inner,
.sh-hero > .elementor-widget-wrap{ position:relative; z-index:2; }

/* No photo set → make the existing red glow breathe slowly (cinematic now). */
.sh-hero-glow > .elementor-background-overlay{
  animation:sh-glow-breathe 9s ease-in-out infinite alternate;
  transform-origin:50% 38%;
  will-change:transform, opacity;
}
@keyframes sh-glow-breathe{
  0%   { transform:scale(1)    translate3d(0,0,0);   opacity:.42; }
  100% { transform:scale(1.22) translate3d(2%,-3%,0); opacity:.66; }
}

/* ---- Accessibility: respect reduced-motion ----------------------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .sh-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  .artist-card img,
  .elementor-widget-image img{ transition:none; }
  .sh-hero-kb,
  .sh-hero-glow > .elementor-background-overlay{ animation:none; }
}

/* ---- Sections retirées : billetterie + sponsoring natifs -----------
   Remplacés par l'appel à candidatures. Supprimer ce bloc pour les
   réafficher. (Artistes, Tournée, « Proposer une ville » et Contact
   « Construisons le show » sont conservés.) --------------------------- */
.elementor-element-2024f693,   /* billetterie — titre « Réservez votre »        */
.elementor-element-ef622d7,    /* billetterie — cartes Standard / Premium / VIP */
.elementor-element-1cfa0f70,   /* sponsoring — titre « Devenez partenaire de »  */
.elementor-element-7395431,    /* sponsoring — cartes Sponsor principal / …     */
.elementor-element-6ae58c9b,   /* sponsoring — CTA « Recevoir le dossier … »    */
.elementor-element-6b346326 {  /* contact natif inachevé (placeholder + ancien mail) */
  display: none !important;
}