/* ===== Habillage "wow" : logo, en-tête sombre, hero aurore, ruptures de section ===== */
:root{--grad:linear-gradient(120deg,#7c5cff,#e84fd0 55%,#ff7a59)}
/* En-tête */
.top{background:rgba(9,11,22,.95);backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid rgba(255,255,255,.08)}
.top-in{min-height:92px}
.brand{gap:14px;color:#fff;font-size:1.9rem;font-weight:700}
.brand .lg{width:60px;height:60px;flex:none;filter:drop-shadow(0 6px 18px rgba(232,79,208,.45));transition:transform .4s cubic-bezier(.2,.8,.2,1.4)}
.brand:hover .lg{transform:rotate(-8deg) scale(1.06)}
.wm b{font-weight:600;letter-spacing:-.03em}
.wm em{font-style:normal;font-weight:800;letter-spacing:-.03em;background:linear-gradient(100deg,#f5b841,#ff7a59 60%,#e84fd0);-webkit-background-clip:text;background-clip:text;color:transparent}
.lg-r{transform-origin:24px 23.4px;animation:lgp 2.2s ease-out infinite}
@keyframes lgp{0%{transform:scale(.9);opacity:.95}100%{transform:scale(2.3);opacity:0}}
.nav a:not(.btn){color:#cfd3e8;font-size:1.02rem}
.nav a:not(.btn):hover{background:rgba(255,255,255,.09);color:#fff}
.nav a[aria-current=page]{color:#fff;box-shadow:inset 0 -3px 0 #e84fd0}
.top .btn{background:#fff;color:#0b0d1a;border-color:#fff}
.top .btn:hover{background:#f5b841;border-color:#f5b841}
.top .link,.top .inl button{color:#cfd3e8}
/* Hero */
.hero2{position:relative;overflow:hidden;isolation:isolate;padding:72px 0 84px}
.hero2::before,.hero2::after{content:"";position:absolute;z-index:-1;pointer-events:none}
.hero2::before{inset:-20% -10%;background:radial-gradient(38% 42% at 18% 30%,rgba(124,92,255,.55),transparent 70%),radial-gradient(34% 40% at 82% 22%,rgba(232,79,208,.42),transparent 70%),radial-gradient(30% 36% at 60% 90%,rgba(255,122,89,.30),transparent 70%);filter:blur(30px);animation:aur 22s ease-in-out infinite alternate}
.hero2::after{inset:0;background-image:radial-gradient(rgba(255,255,255,.22) 1px,transparent 1.4px);background-size:28px 28px;-webkit-mask-image:radial-gradient(70% 70% at 50% 35%,#000,transparent 85%);mask-image:radial-gradient(70% 70% at 50% 35%,#000,transparent 85%);opacity:.5}
@keyframes aur{0%{transform:translate3d(-3%,0,0) scale(1)}100%{transform:translate3d(4%,-4%,0) scale(1.12)}}
.hero2 h1{font-size:clamp(2.4rem,5.6vw,4.6rem);max-width:19ch;line-height:1.02;letter-spacing:-.035em;margin-bottom:.4em}
.hero2 .hero-sub{font-size:clamp(1.1rem,2vw,1.4rem);color:#e3e6f5;max-width:44ch}
.hero2 .cta-row .btn:first-child{box-shadow:0 10px 40px rgba(245,184,65,.35),0 0 0 4px rgba(255,255,255,.08);background:#fff}
.hero2 .cta-row .btn{padding:16px 28px;font-size:1.08rem;border-radius:14px}
.figs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:30px 0 8px;border-radius:18px;overflow:hidden;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px)}
.figs div{background:rgba(12,14,30,.62);padding:18px 20px;display:flex;flex-direction:column;gap:2px}
.figs b{font:800 clamp(1.8rem,3.4vw,2.7rem)/1 var(--f-head);letter-spacing:-.03em;background:linear-gradient(100deg,#fff,#cdb8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.figs span{color:#b9bed2;font-size:.95rem}
/* Sections : titres et ruptures obliques */
h2{font-size:clamp(1.9rem,4vw,3.1rem);letter-spacing:-.03em}
.sec.night{position:relative;clip-path:polygon(0 56px,100% 0,100% calc(100% - 56px),0 100%);margin:-56px 0;padding:136px 0}
.sec.night.cloud{margin:-56px 0}
.sec.tint,.sec:not(.night):not(.tint){position:relative}
.cta-band{position:relative;overflow:hidden;isolation:isolate}
.cta-band::before{content:"";position:absolute;inset:-40% -10%;z-index:-1;background:radial-gradient(40% 50% at 20% 50%,rgba(124,92,255,.5),transparent 70%),radial-gradient(40% 50% at 80% 40%,rgba(232,79,208,.4),transparent 70%);filter:blur(30px);animation:aur 18s ease-in-out infinite alternate}
.btn{transition:transform .2s,box-shadow .2s,background .15s}
.btn:hover{transform:translateY(-2px)}
@media (max-width:900px){.figs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.top-in{min-height:0}.brand{font-size:1.55rem}.brand .lg{width:44px;height:44px}.hero2{padding:44px 0 56px}.sec.night{clip-path:polygon(0 28px,100% 0,100% calc(100% - 28px),0 100%);margin:-28px 0;padding:84px 0}}
@media (prefers-reduced-motion:reduce){.hero2::before,.cta-band::before,.lg-r{animation:none}}
