/* =========================================================
   HOOLALA.TM — ÉVÉNEMENTS V3
   Hero affiche en vedette + compte à rebours, agenda filtrable,
   soirées passées. Clair en mode clair, sombre en mode sombre.
   Les affiches gardent toujours leur format (jamais rognées).
   ========================================================= */

/* ---------- HERO ---------- */
.evx-hero{position:relative;overflow:hidden;isolation:isolate;background:var(--hd-bg);color:var(--hd-fg);border-bottom:1px solid var(--hd-line)}
.evx-bg{position:absolute;inset:0;z-index:-1}
.evx-bg-i{position:absolute;inset:-60px;background-size:cover;background-position:center;filter:blur(60px) saturate(1.4);opacity:0;transform:scale(1.15);transition:opacity 1.2s ease,transform 6s ease-out}
.evx-bg-i.is-on{opacity:.4;transform:scale(1)}
.evx-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--hd-bg) 18%,color-mix(in srgb,var(--hd-bg) 55%,transparent) 60%,color-mix(in srgb,var(--hd-bg) 30%,transparent)),linear-gradient(0deg,var(--hd-bg),transparent 35%)}
@media (prefers-color-scheme:dark){.evx-bg-i.is-on{opacity:.5}}

.evx-hero-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,72px);align-items:center;min-height:min(calc(100svh - var(--hd-hdr)),880px);padding-top:clamp(24px,4vw,56px);padding-bottom:clamp(28px,4vw,56px)}
.evx-copy{display:grid;gap:clamp(18px,2.4vw,30px);min-width:0}
.evx-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.evx-kick{display:inline-flex;align-items:center;gap:10px;margin:0;font:600 13px var(--hd-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--hd-fg-2)}
.evx-live{width:9px;height:9px;border-radius:50%;background:#ef4444;animation:evx-ping 1.6s ease-out infinite}
@keyframes evx-ping{0%{box-shadow:0 0 0 0 rgba(239,68,68,.55)}100%{box-shadow:0 0 0 12px rgba(239,68,68,0)}}
.evx-num{font:600 13px var(--hd-sans);letter-spacing:.08em;color:var(--hd-fg-2)}
.evx-num b{color:var(--hd-fg)}

.evx-slides{display:grid}
.evx-slide{grid-area:1/1;display:grid;gap:clamp(16px,2.2vw,26px);align-content:start;visibility:hidden;pointer-events:none}
.evx-slide.is-on{visibility:visible;pointer-events:auto}
.evx-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.evx-meta span{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--hd-line-2);font:600 13px var(--hd-sans);letter-spacing:.03em}
.evx-title{margin:0;font:400 clamp(54px,8.4vw,150px)/.86 var(--ev-display);text-transform:uppercase;letter-spacing:-.01em;overflow-wrap:anywhere}
.evx-title a{color:inherit;text-decoration:none}

/* Entrée animée des éléments d'une vedette */
.evx-slide>*{opacity:0;transform:translateY(34px);transition:opacity .5s ease,transform .5s var(--hd-ease)}
.evx-slide.is-on>*{opacity:1;transform:none;transition:opacity .8s ease,transform 1s var(--hd-ease)}
.evx-slide.is-on>:nth-child(2){transition-delay:.08s}
.evx-slide.is-on>:nth-child(3){transition-delay:.16s}
.evx-slide.is-on>:nth-child(4){transition-delay:.24s}
.evx-slide .evx-title{clip-path:inset(0 0 100% 0)}
.evx-slide.is-on .evx-title{clip-path:inset(-10% -5% -10% -5%);transition:opacity .8s ease,transform 1s var(--hd-ease),clip-path 1.1s var(--hd-ease) .08s}

/* Compte à rebours */
.evx-count{display:flex;gap:clamp(8px,1vw,14px)}
.evx-count>div{display:grid;justify-items:center;gap:6px;min-width:clamp(64px,7vw,96px);padding:clamp(12px,1.4vw,18px) 8px;border-radius:20px;background:color-mix(in srgb,var(--hd-bg) 70%,transparent);border:1px solid var(--hd-line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.evx-count b{display:block;font:400 clamp(34px,3.6vw,58px)/1 var(--ev-display);font-variant-numeric:tabular-nums}
.evx-count b.is-tick{animation:evx-tick .45s var(--hd-ease)}
@keyframes evx-tick{0%{transform:translateY(-40%);opacity:0}100%{transform:none;opacity:1}}
.evx-count span{font:600 11px var(--hd-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--hd-fg-2)}
.evx-count.is-now{display:inline-flex}
.evx-count.is-now>div{min-width:0;padding:14px 22px}
.evx-count.is-now b{font-size:clamp(28px,2.6vw,40px)}

.evx-ctas{display:flex;flex-wrap:wrap;gap:10px}
.evx-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:58px;padding:0 30px;border-radius:999px;background:var(--hd-fg);color:var(--hd-bg);font:700 15px var(--hd-sans);letter-spacing:.03em;text-decoration:none;transition:transform .35s var(--hd-ease)}
.evx-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,color-mix(in srgb,var(--hd-bg) 35%,transparent) 50%,transparent 70%);transform:translateX(-120%);animation:evx-shine 3.4s var(--hd-ease) infinite}
@keyframes evx-shine{60%,100%{transform:translateX(120%)}}
.evx-btn:hover{transform:translateY(-3px)}
.evx-btn--o{background:transparent;color:var(--hd-fg);border:1.5px solid var(--hd-line-2)}
.evx-btn--o::after{display:none}

.evx-bars{display:flex;gap:6px;max-width:420px}
.evx-bars button{flex:1;height:22px;padding:0;border:0;background:none;cursor:pointer}
.evx-bars i{display:block;height:4px;border-radius:9px;background:var(--hd-line);overflow:hidden}
.evx-bars i::after{content:"";display:block;height:100%;width:100%;background:var(--hd-fg);transform:scaleX(0);transform-origin:left}
.evx-bars .is-done i::after{transform:scaleX(1)}
.evx-bars .is-on i::after{animation:evx-bar var(--evx-dur,7s) linear forwards}
.evx-hero.is-paused .evx-bars .is-on i::after{animation-play-state:paused}
@keyframes evx-bar{to{transform:scaleX(1)}}

/* Affiche : format d'origine, jamais rognée */
.evx-stage{position:relative;display:grid;place-items:center;min-height:min(72vh,680px);perspective:1400px}
.evx-poster{grid-area:1/1;display:block;max-width:100%;opacity:0;transform:translateX(18%) rotateY(-24deg) scale(.86);transition:opacity .7s ease,transform 1.1s var(--hd-ease);pointer-events:none}
.evx-poster.is-on{opacity:1;transform:none;pointer-events:auto}
.evx-poster.is-out{opacity:0;transform:translateX(-14%) rotateY(18deg) scale(.9)}
.evx-poster img{display:block;width:auto;height:auto;max-width:100%;max-height:min(72vh,680px);border-radius:22px;box-shadow:0 40px 90px rgba(0,0,0,.28);animation:evx-float 7s ease-in-out infinite}
@keyframes evx-float{50%{transform:translateY(-12px) rotate(-.6deg)}}

/* ---------- AGENDA ---------- */
.evx-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-bottom:clamp(28px,3vw,44px)}
.hd-page .evx-filters .ev-filters{margin:0}
.evx-filters .ev-filters button{transition:background .25s,color .25s,transform .25s var(--hd-ease)}
.evx-filters .ev-filters button:active{transform:scale(.94)}
.evx-venue{display:inline-flex;align-items:center;gap:10px;font:600 13px var(--hd-sans);letter-spacing:.04em;text-transform:uppercase}
.evx-venue select{min-height:42px;padding:0 36px 0 16px;border-radius:999px;border:1px solid var(--hd-line-2);background:var(--hd-bg);color:var(--hd-fg);font:600 13px var(--hd-sans);appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.evx-none{grid-column:1/-1;margin:0;padding:40px 0;text-align:center;font:500 16px var(--hd-sans);color:var(--hd-fg-2)}

/* Cartes : affiche entière sur fond flouté de la même affiche */
.evx-card .ev-card-media{isolation:isolate}
.evx-card-blur{position:absolute;inset:-30px;z-index:-1;background-size:cover;background-position:center;filter:blur(28px) saturate(1.3);opacity:.6;transform:scale(1.1)}
.evx-card .ev-card-media img{position:relative;width:100%;height:100%;object-fit:contain}
.evx-card .ev-card-flag.evx-hot{background:#ef4444;color:#fff;animation:evx-ping 1.8s ease-out infinite}
.evx-card.is-filtered-in{animation:evx-card-in .6s var(--hd-ease) both}
@keyframes evx-card-in{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}

/* ---------- SOIRÉES PASSÉES ---------- */
.evx-past{padding:clamp(56px,7vw,110px) 0;overflow:hidden;background:var(--hd-bg);border-top:1px solid var(--hd-line)}
.evx-past-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:18px;margin-bottom:clamp(26px,3vw,44px)}
.evx-dot{display:inline-block;animation:evx-blink 1.4s steps(2) infinite}
@keyframes evx-blink{50%{opacity:.2}}
.evx-row{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.evx-row+.evx-row{margin-top:clamp(10px,1.2vw,16px)}
.evx-track{display:flex;gap:clamp(10px,1.2vw,16px);width:max-content;animation:evx-marq 60s linear infinite}
.evx-row.is-rev .evx-track{animation-direction:reverse;animation-duration:70s}
.evx-row:hover .evx-track{animation-play-state:paused}
@keyframes evx-marq{to{transform:translateX(-50%)}}
.evx-shot{display:block;flex:none;height:clamp(200px,24vw,320px);border-radius:18px;overflow:hidden;background:var(--hd-bg-2);transition:transform .5s var(--hd-ease)}
.evx-shot img{display:block;height:100%;width:auto;max-width:none}
.evx-shot:hover{transform:translateY(-6px) rotate(-1deg)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
  .evx-hero-in{grid-template-columns:1fr;min-height:0;gap:22px}
  .evx-stage{order:-1;min-height:0}
  .evx-poster img{max-height:46vh}
  .evx-bg::after{background:linear-gradient(0deg,var(--hd-bg) 30%,color-mix(in srgb,var(--hd-bg) 45%,transparent))}
}
@media (max-width:560px){
  .evx-count{gap:6px}
  .evx-count>div{flex:1;min-width:0;border-radius:16px}
  .evx-ctas .evx-btn{flex:1 1 100%}
  .evx-filters{gap:10px}
  .evx-filters .ev-filters{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:none;padding-bottom:2px}
  .evx-filters .ev-filters::-webkit-scrollbar{display:none}
  .evx-filters .ev-filters button{flex:none}
  .evx-venue{width:100%}.evx-venue select{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .evx-hero *,.evx-past *,.evx-card *{animation:none!important;transition:none!important}
  .evx-track{flex-wrap:wrap;width:auto}
}
/* Priorité sur les styles de liens génériques de la page */
.hd-page .evx-btn{color:var(--hd-bg)}
.hd-page .evx-btn--o{color:var(--hd-fg)}

/* =========================================================
   ÉPURÉ : moins d'éléments, plus d'air
   ========================================================= */
/* Hero : infos en une ligne, compte à rebours léger, lien discret */
.evx-copy{gap:clamp(20px,2.6vw,34px)}
.evx-meta{gap:0;font:600 13px var(--hd-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--hd-fg-2)}
.evx-meta span{min-height:0;padding:0;border:0;border-radius:0;font:inherit;letter-spacing:inherit}
.evx-meta span+span::before{content:"·";margin:0 10px;opacity:.6}
.evx-count{gap:0}
.evx-count>div{min-width:0;padding:0 clamp(14px,1.8vw,26px) 0 0;margin-right:clamp(14px,1.8vw,26px);border:0;border-right:1px solid var(--hd-line);border-radius:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;justify-items:start}
.evx-count>div:last-child{border-right:0;margin-right:0;padding-right:0}
.evx-count b{font-size:clamp(34px,3.4vw,54px)}
.evx-count span{font-size:10px}
.evx-ctas{align-items:center;gap:12px 26px}
.hd-page .evx-btn--o{min-height:0;padding:0 0 4px;border:0;border-radius:0;background:none;color:var(--hd-fg);font:600 13px var(--hd-sans);letter-spacing:.06em;text-transform:uppercase;box-shadow:inset 0 -1px 0 currentColor;transition:box-shadow .3s}
.hd-page .evx-btn--o:hover{transform:none;box-shadow:inset 0 -2px 0 currentColor}

/* Agenda : filtres sur une ligne */
.evx-filters{gap:10px 14px}
.hd-page .evx-filters .ev-filters button{min-height:38px;padding:0 16px;border-color:var(--hd-line);font-size:12px}
.hd-page .evx-filters .ev-filters button.is-active{border-color:var(--hd-fg)}
.evx-venue select{min-height:38px;border-color:var(--hd-line)}
.evx-venue span{display:none}

/* Cartes : titre, une ligne d'infos, prix + flèche */
.evx-card{border-color:transparent;background:transparent}
.evx-card:hover{box-shadow:none}
.evx-card .ev-card-media{border-radius:22px}
.evx-card .ev-card-body{gap:6px;padding:16px 4px 0}
.evx-card-line{margin:0;font:500 14px var(--hd-sans);color:var(--hd-fg-2)}
.evx-card .ev-card-foot{margin-top:10px;padding-top:12px;border-top:1px solid var(--hd-line)}
.evx-card .ev-card-price{font-size:24px}
.hd-page .evx-card-go{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;border:1px solid var(--hd-line-2);color:var(--hd-fg);transition:background .25s,color .25s,transform .35s var(--hd-ease)}
.evx-card:hover .evx-card-go{background:var(--hd-fg);color:var(--hd-bg);transform:rotate(-45deg)}
.evx-card .ev-card-title{margin:0}
.hd-page .evx-card-go{border-bottom:1px solid var(--hd-line-2)}
/* Grand mot « ÉVÉNEMENTS » au-dessus de la vedette */
.ev-hero--word{padding-bottom:clamp(10px,1.4vw,20px)}
.ev-hero--word + .evx-hero .evx-hero-in{min-height:0;padding-top:clamp(18px,2.6vw,40px)}
.ev-hero--word + .evx-hero .evx-bg::after{background:linear-gradient(180deg,var(--hd-bg),transparent 30%),linear-gradient(90deg,var(--hd-bg) 18%,color-mix(in srgb,var(--hd-bg) 55%,transparent) 60%,color-mix(in srgb,var(--hd-bg) 30%,transparent)),linear-gradient(0deg,var(--hd-bg),transparent 35%)}