/* Summit — landing V2 : couche Magic UI posée sur landing.css */

/* ——— Scroll Progress ——— */
.v2-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 100; pointer-events: none; }
.v2-progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--action), #75A7FF, var(--gold)); transform: scaleX(0); transform-origin: left; }

/* ——— Animated Shiny Text ——— */
.v2-shiny { position: relative; overflow: hidden; }
.v2-shiny::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.85) 50%, transparent 65%); background-size: 250% 100%; animation: v2-shine 3.4s linear 1.2s infinite; pointer-events: none; mix-blend-mode: soft-light; }
@keyframes v2-shine { from { background-position: 150% 0; } to { background-position: -100% 0; } }

/* ——— Aurora Text ——— */
.v2 .grad.v2-aurora { background-image: linear-gradient(120deg, var(--action), #5C9BFF, #9C7BFF, var(--gold), #5C9BFF, var(--action)); background-size: 300% 100%; animation: rise 1s var(--ease) .24s forwards, v2-aurora 9s ease-in-out 1.2s infinite; filter: drop-shadow(0 6px 24px rgba(53,120,234,.25)); }
@keyframes v2-aurora { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

/* ——— Shimmer Button ——— */
.v2-shimmer { --speed: 3s; position: relative; z-index: 0; overflow: hidden; isolation: isolate; box-shadow: 0 12px 30px -12px rgba(36,99,214,.7), inset 0 -8px 10px rgba(255,255,255,.12); }
.v2-shimmer:hover { box-shadow: 0 16px 36px -12px rgba(36,99,214,.8), inset 0 -6px 10px rgba(255,255,255,.25); }
.v2-shimmer::after { display: none; }
.v2-spark { position: absolute; inset: 0; z-index: -3; overflow: visible; filter: blur(2px); container-type: size; pointer-events: none; }
.v2-spark > span { position: absolute; inset: 0; height: 100cqh; aspect-ratio: 1; animation: v2-slide var(--speed) ease-in-out infinite alternate; }
.v2-spark > span::before { content: ""; position: absolute; inset: -100%; background: conic-gradient(from 225deg, transparent 0, #fff 90deg, transparent 90deg); animation: v2-spin calc(var(--speed) * 2) linear infinite; }
.v2-spark-backdrop { position: absolute; inset: 1.5px; z-index: -2; border-radius: inherit; background: inherit; background-color: var(--action); pointer-events: none; }
.v2-shimmer:hover .v2-spark-backdrop { background-color: var(--action-hover); }
@keyframes v2-slide { to { transform: translateX(calc(100cqw - 100%)); } }
@keyframes v2-spin { 0% { transform: rotate(0); } 15%, 35% { transform: rotate(90deg); } 65%, 85% { transform: rotate(270deg); } 100% { transform: rotate(360deg); } }

/* ——— Border Beam ——— */
.v2-beam { position: absolute; inset: 0; z-index: 3; border: 1.5px solid transparent; border-radius: inherit; pointer-events: none; -webkit-mask: linear-gradient(transparent, transparent) padding-box, linear-gradient(#000, #000) border-box; -webkit-mask-composite: source-in; mask: linear-gradient(transparent, transparent) padding-box, linear-gradient(#000, #000) border-box; mask-composite: intersect; }
.v2-beam > span { position: absolute; width: var(--size); aspect-ratio: 1; background: linear-gradient(to left, var(--action), #75A7FF, transparent); offset-path: rect(0 auto auto 0 round var(--size)); animation: v2-beam var(--duration) linear infinite; }
.v2-beam.gold > span { background: linear-gradient(to left, var(--gold), #F1DDAE, transparent); }
@keyframes v2-beam { from { offset-distance: 0%; } to { offset-distance: 100%; } }
.phone .v2-beam { border-width: 2px; }
#inviteForm { position: relative; }

/* ——— Magic Card ——— */
.v2-magic { position: relative; }
.v2-spot { position: absolute; inset: 0; z-index: 2; border-radius: inherit; padding: 1.5px; pointer-events: none; background: radial-gradient(240px circle at var(--mx, -300px) var(--my, -300px), var(--action), #9CC4FF 45%, transparent 70%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; opacity: 0; transition: opacity .35s; }
.v2-magic:hover .v2-spot { opacity: 1; }
.bento-card.v2-magic:hover { transform: translateY(-3px); }
.bento-card.v2-magic { transition: transform .4s var(--ease); }

/* ——— Blur Fade + Text Animate ——— */
.v2 .reveal { filter: blur(8px); transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); transition-delay: var(--d, 0s); }
.v2 .reveal.in { filter: none; }
.reveal .v2-word { display: inline-block; opacity: 0; filter: blur(10px); transform: translateY(14px); transition: opacity .7s var(--ease), filter .7s var(--ease), transform .7s var(--ease); transition-delay: calc(.15s + var(--i) * .06s); }
.reveal.in .v2-word { opacity: 1; filter: none; transform: none; }

/* ——— Orbiting Circles + Ripple autour de Pico ——— */
.v2-ripple { position: absolute; inset: 0; pointer-events: none; }
.v2-ripple i { position: absolute; left: 50%; top: 52%; width: var(--s); aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(53,120,234,.18); background: rgba(117,167,255,.05); transform: translate(-50%, -50%); animation: v2-ripple 3.4s ease-in-out infinite; animation-delay: var(--d); }
.v2-ripple i:nth-child(1) { --s: 48%; --d: 0s; }
.v2-ripple i:nth-child(2) { --s: 64%; --d: .25s; opacity: .7; }
.v2-ripple i:nth-child(3) { --s: 80%; --d: .5s; opacity: .45; }
@keyframes v2-ripple { 0%, 100% { transform: translate(-50%, -50%) scale(1); } 50% { transform: translate(-50%, -50%) scale(.94); } }
.v2-orbit { --r: .45; position: absolute; inset: 0; container-type: size; pointer-events: none; }
.v2-orbit::before { content: ""; position: absolute; left: 50%; top: 52%; width: calc(var(--r) * 200cqw); aspect-ratio: 1; border-radius: 50%; border: 1px dashed rgba(53,120,234,.22); transform: translate(-50%, -50%); }
.v2-orbit > * { position: absolute; left: 50%; top: 52%; display: grid; place-items: center; margin: -22px 0 0 -22px; width: 44px; height: 44px; border-radius: 50%; background: var(--glass-strong); border: 1px solid var(--glass-line); box-shadow: var(--glass-shadow); color: var(--action); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); animation: v2-orbit 40s linear infinite; }
.v2-orbit svg { width: 20px; height: 20px; }
.v2-orbit-in { --r: .3; }
.v2-orbit-in > * { width: 12px; height: 12px; margin: -6px 0 0 -6px; background: var(--gold); border: 0; animation-duration: 22s; animation-direction: reverse; box-shadow: 0 0 0 5px rgba(181,154,101,.18); }
@keyframes v2-orbit { from { transform: rotate(calc(var(--angle) * 1deg)) translateY(calc(var(--r) * 100cqw)) rotate(calc(var(--angle) * -1deg)); } to { transform: rotate(calc(var(--angle) * 1deg + 360deg)) translateY(calc(var(--r) * 100cqw)) rotate(calc(var(--angle) * -1deg - 360deg)); } }

/* ——— Marquee sur deux rangées ——— */
.v2-marquee { display: grid; gap: 14px; }
.v2-marquee .v2-reverse { animation-direction: reverse; animation-duration: 46s; }
.v2-marquee .v2-reverse span { font-size: .86em; color: var(--muted); }
.v2-marquee .v2-reverse span::before { background: var(--action); border-radius: 50%; rotate: 0deg; width: 6px; height: 6px; }
.v2-marquee:hover .marquee-track { animation-play-state: paused; }

/* ——— Animated Beam : intégrations ——— */
.v2-integrations { padding-top: 40px; }
.v2-beams { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 32px; max-width: 920px; margin: 0 auto; padding: 24px 0; }
.v2-beam-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.v2-beam-svg .base { fill: none; stroke: var(--line); stroke-width: 2; }
.v2-beam-svg .ray { fill: none; stroke: var(--action); stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 16 84; stroke-dashoffset: 100; animation: v2-ray 3.2s linear infinite; filter: drop-shadow(0 0 4px rgba(53,120,234,.7)); }
@keyframes v2-ray { to { stroke-dashoffset: 0; } }
.v2-col { position: relative; z-index: 1; display: grid; gap: 16px; }
.v2-node { display: flex; align-items: center; gap: 12px; min-width: 210px; padding: 12px 16px 12px 12px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 14px 30px -24px rgba(20,50,100,.5); }
.v2-node > svg { width: 40px; height: 40px; padding: 9px; border-radius: 12px; background: var(--soft); color: var(--action); flex-shrink: 0; }
.v2-node.gold > svg { background: #F5EEDD; color: var(--gold-text); }
.v2-node b { display: block; font-size: 15px; }
.v2-node small { color: var(--muted); font-size: 12.5px; }
.v2-hub { position: relative; z-index: 1; display: grid; place-items: center; gap: 4px; width: 136px; aspect-ratio: 1; border-radius: 50%; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 30px 60px -30px rgba(36,99,214,.55), 0 0 0 10px rgba(53,120,234,.06), 0 0 0 22px rgba(53,120,234,.035); align-content: center; font-weight: 800; letter-spacing: -.02em; }
.v2-hub img { width: 62px; }
.v2-hub::after { content: ""; position: absolute; inset: -1px; border-radius: 50%; border: 2px solid var(--action); opacity: 0; animation: v2-hub 2.6s ease-out infinite; }
@keyframes v2-hub { 0% { transform: scale(1); opacity: .5; } 100% { transform: scale(1.45); opacity: 0; } }

/* ——— Number Ticker ——— */
.v2-stats { list-style: none; padding: 0; margin: 56px auto 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 760px; text-align: center; }
.v2-stats b { display: block; font-size: clamp(40px, 5vw, 60px); line-height: 1; font-weight: 800; letter-spacing: -.04em; background: linear-gradient(120deg, var(--action), #75A7FF); -webkit-background-clip: text; background-clip: text; color: transparent; }
.v2-stats span { display: block; margin-top: 8px; color: var(--muted); font-weight: 600; font-size: 14.5px; }

/* ——— Particles + Confetti ——— */
.v2-final-particles { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.v2-final-particles canvas { width: 100%; height: 100%; display: block; }
.final > h2, .final > p, .final > form, .final > img { position: relative; z-index: 1; }
.v2-confetti { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 200; pointer-events: none; }
.legal a { color: var(--action); font-weight: 650; text-decoration: none; }

/* ——— Liste d'attente ——— */
.invite-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.invite-consent { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: 10px; max-width: 520px; margin: 14px auto 0; text-align: left; font-size: 13.5px; line-height: 1.5; color: var(--muted); cursor: pointer; }
.invite-consent input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--action); cursor: pointer; }
.invite-consent a { color: var(--action); font-weight: 650; }
.invite-consent.is-missing { color: #A13A2E; }
.invite-consent.is-missing input { outline: 2px solid #D9574A; outline-offset: 2px; border-radius: 4px; }
.invite-status { position: relative; z-index: 1; max-width: 520px; margin: 14px auto 0; padding: 12px 16px; border-radius: 16px; font-size: 14.5px; font-weight: 600; line-height: 1.45; background: var(--glass-strong); border: 1px solid var(--glass-line); color: var(--ink); }
.invite-status.ok { background: rgba(46,160,103,.12); border-color: rgba(46,160,103,.35); color: #1F6B45; }
.invite-status.error { background: rgba(217,87,74,.1); border-color: rgba(217,87,74,.35); color: #A13A2E; }
#inviteForm[aria-busy="true"] .btn { opacity: .75; pointer-events: none; }
#inviteForm.is-done { opacity: .6; }

@media (max-width: 900px) {
  .v2-orbit > * { width: 36px; height: 36px; margin: -18px 0 0 -18px; }
  .v2-orbit svg { width: 16px; height: 16px; }
}
@media (max-width: 760px) {
  .v2-beams { flex-direction: column; gap: 56px; }
  .v2-col { grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
  .v2-node { min-width: 0; padding: 10px; gap: 10px; }
  .v2-node > svg { width: 34px; height: 34px; padding: 7px; }
  .v2-node b { font-size: 13.5px; } .v2-node small { font-size: 11.5px; }
  .v2-hub { width: 108px; } .v2-hub img { width: 48px; }
  .v2-stats { gap: 8px; margin-top: 40px; } .v2-stats span { font-size: 12.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .v2-spark, .v2-beam, .v2-shiny::after, .v2-hub::after { display: none; }
  .v2-orbit > *, .v2-ripple i, .v2 .grad.v2-aurora, .v2-beam-svg .ray { animation: none; }
  .v2 .grad.v2-aurora { transform: none; }
  .v2 .reveal, .reveal .v2-word { filter: none; transition: none; }
}

/* Connexion toujours accessible : lien compact entre 901 et 1180 px (le menu mobile l'inclut aussi). */
@media (max-width: 1180px) and (min-width: 901px) {
  .v2 .nav-cta .btn-ghost { display: inline-flex; padding: 0 14px; background: transparent; border-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .v2 .nav-links li:last-child { display: none; }
}

/* Visiteur ou compte : la bonne variante est choisie avant le premier rendu (landing-boot.js). */
html:not(.has-account) .when-account, html.has-account .when-visitor { display: none !important; }
html.has-account #inviteStatus { display: none !important; }
html.has-account .nav-cta .btn-ghost { display: none !important; }
.space-cta { position: relative; z-index: 1; margin-top: 30px; min-width: 260px; }