/* ==========================================================================
   ISSNT Hero Slider — Frontend (v1.0.0)
   Slider cinématique auto-contenu (aucune librairie externe).
   Variable d'accent : --issnt-accent (pilotée par le contrôle « accent »).
   ========================================================================== */

.issnt-hero{
	--issnt-accent:#ffd56a;
	--issnt-ink:#ffffff;
	position:relative;width:100%;min-height:88vh;overflow:hidden;isolation:isolate;
	display:flex;color:var(--issnt-ink);
	background:#2a0d4a;
	box-sizing:border-box;
}
.issnt-hero *,.issnt-hero *::before,.issnt-hero *::after{box-sizing:border-box}

/* ---- Fond dégradé de base (violet -> indigo, charte ISSNT) ---- */
.issnt-hero-gradient{
	position:absolute;inset:0;z-index:0;
	background:linear-gradient(125deg,#48106a 0%,#4820a6 46%,#1f3fb9 100%);
}

/* ---- Fond « aurora » animé : nappes lumineuses en mouvement lent ---- */
.issnt-hero--aurora .issnt-hero-gradient::before,
.issnt-hero--aurora .issnt-hero-gradient::after{
	content:'';position:absolute;inset:-25%;pointer-events:none;
	background:
		radial-gradient(38% 44% at 22% 28%,rgba(255,213,106,.28),transparent 60%),
		radial-gradient(42% 48% at 82% 20%,rgba(120,60,220,.42),transparent 62%),
		radial-gradient(46% 52% at 70% 82%,rgba(40,120,230,.40),transparent 60%);
	filter:blur(8px);
	animation:issnt-hero-aurora 22s ease-in-out infinite alternate;
}
.issnt-hero--aurora .issnt-hero-gradient::after{
	background:
		radial-gradient(40% 46% at 60% 30%,rgba(255,120,200,.20),transparent 62%),
		radial-gradient(50% 56% at 18% 78%,rgba(90,30,140,.42),transparent 60%);
	animation-duration:30s;animation-direction:alternate-reverse;
}
@keyframes issnt-hero-aurora{
	0%{transform:translate3d(-3%,-2%,0) scale(1.02) rotate(0deg)}
	50%{transform:translate3d(4%,2%,0) scale(1.08) rotate(2deg)}
	100%{transform:translate3d(-2%,3%,0) scale(1.04) rotate(-2deg)}
}

/* ---- Grain subtil ---- */
.issnt-hero--grain::after{
	content:'';position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- Piste & slides (superposés) ---- */
.issnt-hero-track{position:absolute;inset:0;z-index:2}
.issnt-hero-slide{
	position:absolute;inset:0;opacity:0;visibility:hidden;
	transition:opacity .8s ease,transform .8s cubic-bezier(.16,.84,.24,1);
	display:flex;align-items:center;
}
.issnt-hero-slide.is-active{opacity:1;visibility:visible;z-index:2}

/* Effet « glissement » */
.issnt-hero--slide .issnt-hero-slide{transform:translateX(6%)}
.issnt-hero--slide .issnt-hero-slide.is-active{transform:translateX(0)}
.issnt-hero--slide .issnt-hero-slide.is-prev{transform:translateX(-6%)}

/* Effet « fondu » */
.issnt-hero--fade .issnt-hero-slide{transform:scale(1.02)}
.issnt-hero--fade .issnt-hero-slide.is-active{transform:scale(1)}

/* ---- Média du slide (image + voile) ---- */
.issnt-hero-slide-media{position:absolute;inset:0;z-index:0;overflow:hidden}
.issnt-hero-slide-img{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.04)}
.issnt-hero-slide-media::after{content:'';position:absolute;inset:0;background:rgba(30,10,60,.55)}
/* Le voile se fond dans le dégradé à gauche pour garder le texte lisible */
.issnt-hero-slide-media::before{
	content:'';position:absolute;inset:0;z-index:1;
	background:linear-gradient(90deg,rgba(40,13,74,.92) 0%,rgba(40,13,74,.62) 38%,rgba(40,13,74,.15) 72%,transparent 100%);
}
.issnt-hero-content--center ~ .issnt-hero-slide-media::before,
.issnt-hero-content--center .issnt-hero-slide-media::before{
	background:radial-gradient(120% 120% at 50% 50%,transparent 30%,rgba(40,13,74,.75) 100%);
}

/* Ken Burns : zoom + dérive très lents sur le slide actif uniquement */
.issnt-hero-slide.is-active .issnt-hero-slide-img.issnt-hero-kenburns{
	animation:issnt-hero-kenburns 12s ease-out forwards;
}
@keyframes issnt-hero-kenburns{
	from{transform:scale(1.04) translate(0,0)}
	to{transform:scale(1.16) translate(-1.5%,-1.5%)}
}

/* ---- Contenu ---- */
.issnt-hero-inner{position:relative;z-index:2;width:100%;max-width:1280px;margin:0 auto;padding:0 clamp(20px,5vw,64px)}
.issnt-hero-content{max-width:640px}
.issnt-hero-content--center{margin:0 auto;text-align:center}

.issnt-hero-eyebrow{
	display:inline-flex;align-items:center;gap:10px;
	font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
	color:var(--issnt-accent);margin-bottom:18px;
}
.issnt-hero-eyebrow-line{width:34px;height:2px;background:var(--issnt-accent);display:inline-block;border-radius:2px}
.issnt-hero-content--center .issnt-hero-eyebrow{justify-content:center}

.issnt-hero-title{
	margin:0 0 18px;font-weight:900;line-height:1.02;letter-spacing:-.03em;
	font-size:clamp(34px,6vw,72px);color:#fff;
	text-shadow:0 8px 40px rgba(0,0,0,.28);
}
.issnt-hero-title--uc{text-transform:uppercase;letter-spacing:-.01em}
.issnt-hero-title mark{background:none;color:var(--issnt-accent);
	background-image:linear-gradient(120deg,rgba(255,213,106,0) 60%,rgba(255,213,106,.28) 60%);
	background-repeat:no-repeat;background-size:100% .18em;background-position:0 88%;
}

.issnt-hero-subtitle{
	margin:0 0 26px;max-width:56ch;font-size:clamp(16px,1.6vw,19px);line-height:1.7;
	color:rgba(255,255,255,.9);
}
.issnt-hero-content--center .issnt-hero-subtitle{margin-left:auto;margin-right:auto}

/* ---- Chips de bénéfices (glassmorphisme) ---- */
.issnt-hero-chips{
	list-style:none;margin:0 0 28px;padding:0;
	display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;max-width:620px;
}
.issnt-hero-content--center .issnt-hero-chips{margin-left:auto;margin-right:auto}
.issnt-hero-chip{
	display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;
	background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
	-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
	font-size:14px;line-height:1.35;color:#fff;
}
.issnt-hero-chip-ic{flex:0 0 auto;width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(255,213,106,.16);color:var(--issnt-accent)}
.issnt-hero-chip-ic svg{width:15px;height:15px;fill:currentColor;stroke:none}
.issnt-hero-chip-ic .issnt-ic-accent{fill:currentColor}
@media (max-width:640px){.issnt-hero-chips{grid-template-columns:1fr}}

/* ---- Boutons ---- */
.issnt-hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.issnt-hero-content--center .issnt-hero-actions{justify-content:center}
.issnt-hero-btn{
	display:inline-flex;align-items:center;gap:10px;
	padding:15px 26px;border-radius:999px;font-size:15px;font-weight:800;letter-spacing:.01em;
	text-decoration:none;cursor:pointer;border:2px solid transparent;
	transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,background .25s ease,color .25s ease;
}
.issnt-hero-btn svg{width:18px;height:18px;transition:transform .25s ease}
.issnt-hero-btn-primary{
	background:linear-gradient(135deg,#ffe38f,var(--issnt-accent) 55%,#f0a427);
	color:#2d113f;box-shadow:0 14px 34px rgba(240,164,39,.34),inset 0 1px 0 rgba(255,255,255,.5);
}
.issnt-hero-btn-primary:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(240,164,39,.44)}
.issnt-hero-btn-primary:hover svg{transform:translateX(4px)}
.issnt-hero-btn-secondary{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.5)}
.issnt-hero-btn-secondary:hover{transform:translateY(-3px);background:rgba(255,255,255,.14);border-color:#fff}
.issnt-hero-btn:focus-visible{outline:3px solid var(--issnt-accent);outline-offset:3px}

/* ---- Flèches ---- */
.issnt-hero-arrow{
	position:absolute;top:50%;transform:translateY(-50%);z-index:4;
	width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.28);
	background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
	color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;
	transition:background .25s ease,transform .25s ease,border-color .25s ease;
}
.issnt-hero-arrow:hover{background:rgba(255,255,255,.2);border-color:#fff}
.issnt-hero-arrow:active{transform:translateY(-50%) scale(.94)}
.issnt-hero-arrow svg{width:22px;height:22px}
.issnt-hero-arrow--prev{left:clamp(12px,3vw,32px)}
.issnt-hero-arrow--next{right:clamp(12px,3vw,32px)}
.issnt-hero-arrow:focus-visible{outline:3px solid var(--issnt-accent);outline-offset:3px}
@media (max-width:760px){.issnt-hero-arrow{width:44px;height:44px}}

/* ---- Barre inférieure : compteur + puces de progression ---- */
.issnt-hero-bar{
	position:absolute;left:0;right:0;bottom:clamp(18px,4vh,40px);z-index:4;
	display:flex;align-items:center;justify-content:center;gap:22px;padding:0 24px;
}
.issnt-hero-counter{font-variant-numeric:tabular-nums;font-weight:800;color:rgba(255,255,255,.85);font-size:14px;letter-spacing:.08em}
.issnt-hero-counter-cur{color:var(--issnt-accent)}
.issnt-hero-counter-sep{margin:0 6px;opacity:.5}
.issnt-hero-counter-total{opacity:.7}

.issnt-hero-dots{display:flex;align-items:center;gap:10px}
.issnt-hero-dot{
	position:relative;width:40px;height:5px;border-radius:999px;border:0;padding:0;cursor:pointer;
	background:rgba(255,255,255,.28);overflow:hidden;transition:width .3s ease;
}
.issnt-hero-dot.is-active{width:64px}
.issnt-hero-dot-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--issnt-accent);border-radius:999px}
.issnt-hero-dot.is-active .issnt-hero-dot-fill{width:100%}
/* Remplissage animé pendant l'autoplay (durée injectée en JS via --issnt-delay) */
.issnt-hero.is-autoplaying .issnt-hero-dot.is-active .issnt-hero-dot-fill{
	width:0;animation:issnt-hero-fill var(--issnt-delay,6000ms) linear forwards;
}
@keyframes issnt-hero-fill{from{width:0}to{width:100%}}
.issnt-hero-dot:focus-visible{outline:3px solid var(--issnt-accent);outline-offset:3px}

/* ---- Révélation en cascade du contenu du slide actif ---- */
.issnt-hero .issnt-hero-reveal>*{opacity:0;transform:translateY(22px)}
.issnt-hero-slide.is-active .issnt-hero-reveal>*{
	animation:issnt-hero-rise .7s cubic-bezier(.16,.84,.24,1) forwards;
}
.issnt-hero-slide.is-active .issnt-hero-reveal>*:nth-child(1){animation-delay:.10s}
.issnt-hero-slide.is-active .issnt-hero-reveal>*:nth-child(2){animation-delay:.20s}
.issnt-hero-slide.is-active .issnt-hero-reveal>*:nth-child(3){animation-delay:.30s}
.issnt-hero-slide.is-active .issnt-hero-reveal>*:nth-child(4){animation-delay:.40s}
.issnt-hero-slide.is-active .issnt-hero-reveal>*:nth-child(5){animation-delay:.50s}
@keyframes issnt-hero-rise{to{opacity:1;transform:translateY(0)}}

/* ---- Accessibilité : mouvement réduit ---- */
@media (prefers-reduced-motion:reduce){
	.issnt-hero-slide,.issnt-hero-btn,.issnt-hero-arrow{transition:none}
	.issnt-hero--aurora .issnt-hero-gradient::before,
	.issnt-hero--aurora .issnt-hero-gradient::after,
	.issnt-hero-slide-img.issnt-hero-kenburns,
	.issnt-hero.is-autoplaying .issnt-hero-dot.is-active .issnt-hero-dot-fill,
	.issnt-hero-slide.is-active .issnt-hero-reveal>*{animation:none}
	.issnt-hero .issnt-hero-reveal>*{opacity:1;transform:none}
	.issnt-hero-dot.is-active .issnt-hero-dot-fill{width:100%}
}

/* ---- Responsive ---- */
@media (max-width:760px){
	.issnt-hero{min-height:78vh}
	.issnt-hero-inner{padding:0 20px}
	.issnt-hero-content{max-width:100%}
	.issnt-hero-btn{padding:13px 20px;font-size:14px}
}

/* ==========================================================================
   Isolation & robustesse éditeur (v1.1.0)
   - Les classes de révélation sont désormais préfixées (issnt-hero-reveal) pour ne
     jamais entrer en collision avec d'autres addons (ex. ISSNT Reasons Addon).
   - Dans l'aperçu de l'éditeur Elementor, on force l'affichage du contenu :
     l'animation d'entrée peut ne pas se rejouer lors des re-rendus d'édition,
     donc le contenu reste visible quoi qu'il arrive.
   ========================================================================== */
.elementor-editor-active .issnt-hero-slide.is-active{opacity:1;visibility:visible}
.elementor-editor-active .issnt-hero-slide.is-active .issnt-hero-reveal>*{opacity:1;transform:none;animation:none}
/* Filet de sécurité : le conteneur de contenu du hero n'est jamais masqué par
   une règle externe, car il n'utilise plus la classe de révélation générique. */
.issnt-hero-content{opacity:1}
