:root{
  --ink:#05060d;
  --text:#eef1ff;
  --muted:#9aa3c4;
  --gold:#f5c06a;
  --pink:#ec6fd0;
  --violet:#8b5cf6;
  --blue:#4cc9ff;
  --line:rgba(255,255,255,.12);
  --glass:rgba(255,255,255,.045);
  --shell:min(1080px,100%);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--ink);
  color:var(--text);
  font-family:"Sora",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* ---------- fond ---------- */
.bg,.bg-veil,.grain{position:fixed;inset:0;pointer-events:none}
.bg{
  background:url("../img/background.jpg") center/cover no-repeat;
  transform:scale(1.06);
  animation:drift 26s ease-in-out infinite alternate;
  will-change:transform;
}
.bg-veil{
  background:
    radial-gradient(120% 90% at 50% 42%, rgba(5,6,13,.18) 0%, rgba(5,6,13,.62) 55%, rgba(5,6,13,.92) 100%),
    linear-gradient(180deg, rgba(5,6,13,.85) 0%, rgba(5,6,13,.25) 30%, rgba(5,6,13,.75) 78%, #05060d 100%);
}
.grain{
  opacity:.05;
  background-image:radial-gradient(rgba(255,255,255,.65) .5px, transparent .5px);
  background-size:3px 3px;
  mix-blend-mode:overlay;
}
@keyframes drift{
  from{transform:scale(1.06) translate3d(-1.2%,0,0)}
  to{transform:scale(1.12) translate3d(1.2%,-1.4%,0)}
}

/* ---------- structure ---------- */
.shell{
  position:relative;
  z-index:1;
  width:var(--shell);
  margin:0 auto;
  min-height:100svh;
  padding:clamp(20px,4vw,40px);
  display:flex;
  flex-direction:column;
  gap:clamp(28px,6vh,64px);
}

.top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.mark{
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.42em;
  color:rgba(255,255,255,.72);
}

.hero{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:clamp(14px,2.4vh,24px);
}

/* ---------- logo ---------- */
.logo-wrap{position:relative;display:grid;place-items:center}
.logo{
  position:relative;
  z-index:1;
  width:clamp(150px,26vw,232px);
  height:auto;
  mix-blend-mode:screen;
  filter:drop-shadow(0 18px 42px rgba(139,92,246,.35));
  animation:float 7s ease-in-out infinite;
}
.logo-glow{
  position:absolute;
  width:clamp(230px,40vw,360px);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(139,92,246,.34) 0%, rgba(76,201,255,.16) 45%, transparent 70%);
  filter:blur(14px);
  animation:pulse 6s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pulse{0%,100%{opacity:.65;transform:scale(.96)}50%{opacity:1;transform:scale(1.06)}}

/* ---------- texte ---------- */
.wordmark{
  margin:0;
  font-size:clamp(2.6rem,10vw,5.6rem);
  font-weight:700;
  letter-spacing:.14em;
  line-height:1;
  background:linear-gradient(100deg,var(--gold) 0%,var(--pink) 34%,var(--violet) 64%,var(--blue) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  background-size:220% 100%;
  animation:sheen 9s ease-in-out infinite;
}
@keyframes sheen{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

.tagline{
  margin:0;
  max-width:34ch;
  font-size:clamp(1rem,2.4vw,1.24rem);
  font-weight:300;
  line-height:1.6;
  color:rgba(238,241,255,.86);
}

.soon{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:9px 18px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--glass);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:.82rem;
  letter-spacing:.08em;
  color:rgba(238,241,255,.8);
}
.soon strong{font-weight:600;color:#fff}
.dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--blue);
  box-shadow:0 0 0 0 rgba(76,201,255,.6);
  animation:ping 2.4s ease-out infinite;
}
@keyframes ping{
  0%{box-shadow:0 0 0 0 rgba(76,201,255,.55)}
  70%{box-shadow:0 0 0 12px rgba(76,201,255,0)}
  100%{box-shadow:0 0 0 0 rgba(76,201,255,0)}
}

/* ---------- pied ---------- */
.foot{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:.76rem;
  letter-spacing:.05em;
  color:rgba(154,163,196,.8);
}

/* ---------- utilitaires ---------- */
.reveal{opacity:0;transform:translateY(14px);animation:rise .9s cubic-bezier(.22,1,.36,1) forwards}
.reveal[data-delay="1"]{animation-delay:.10s}
.reveal[data-delay="2"]{animation-delay:.22s}
.reveal[data-delay="3"]{animation-delay:.34s}
.reveal[data-delay="4"]{animation-delay:.46s}
.reveal[data-delay="5"]{animation-delay:.58s}
@keyframes rise{to{opacity:1;transform:none}}

@media (max-width:520px){
  .wordmark{letter-spacing:.1em}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}