/* ==========================================================================
   mentally.lol — chrome violet sur noir
   Direction : métal liquide / néon sombre, inspirée du logo.
   ========================================================================== */

:root{
  --bg:#06040b;
  --bg-2:#0b0714;
  --panel:#120b20;
  --panel-2:#180f2b;
  --line:rgba(190,160,255,.09);
  --line-strong:rgba(190,160,255,.18);
  --text:#f2eefc;
  --muted:#a89cc4;
  --muted-2:#6e6389;
  --violet:#7c3aed;
  --violet-bright:#a78bfa;
  --violet-electric:#b388ff;
  --violet-deep:#2e0a7a;
  --violet-ink:#15063d;
  --glow:rgba(124,58,237,.45);
  --glow-soft:rgba(124,58,237,.14);
  --r-lg:28px; --r-md:18px; --r-sm:12px;
  --ease:cubic-bezier(.16,1,.3,1);
  --font-display:'Unbounded', sans-serif;
  --font-body:'Space Grotesk', sans-serif;
  --font-mono:'Space Mono', ui-monospace, monospace;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  background:var(--bg); color:var(--text);
  font-family:var(--font-body); font-size:16px; line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:hidden; max-width:100vw;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
::selection{background:var(--violet); color:#fff;}

h1,h2,h3,.wordmark{font-family:var(--font-display); font-weight:700; letter-spacing:-.02em; line-height:1.08;}
h2{font-size:clamp(1.8rem,3.6vw,2.8rem); font-weight:800; letter-spacing:-.035em;}
.section-title{margin-top:14px; max-width:20ch;}
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-mono); font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--violet-electric);
}
.eyebrow::before{content:''; width:18px; height:1px; background:var(--violet-electric);}

.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
section{padding:84px 0;}

/* ---------- Atmosphère ---------- */
.site-bg-video{
  position:fixed; inset:-24px; z-index:-4;
  width:calc(100% + 48px); height:calc(100% + 48px);
  object-fit:cover; pointer-events:none;
  filter:brightness(.42) saturate(1.3) contrast(1.25) blur(12px);
}
.site-bg-tint{
  position:fixed; inset:0; z-index:-3; pointer-events:none;
  background:var(--violet-ink); mix-blend-mode:multiply; opacity:.4;
}
.site-bg-tint::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(120% 90% at 50% 0%, rgba(0,0,0,0) 0%, rgba(3,1,8,.6) 100%);
}
.bg-fx{
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(55% 40% at 80% -4%, rgba(124,58,237,.18), transparent 62%),
    radial-gradient(35% 26% at 6% 16%, rgba(124,58,237,.08), transparent 65%);
}
.grain{
  position:fixed; inset:0; z-index:-1; 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='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.scroll-progress{
  position:fixed; top:0; left:0; height:2px; width:0%; z-index:200; pointer-events:none;
  background:linear-gradient(90deg, var(--violet-deep), var(--violet-electric), #fff);
  transition:width .12s linear;
}

/* ---------- Navigation ---------- */
header{position:sticky; top:14px; z-index:100; margin:14px auto 0; max-width:1100px; padding:0 20px;}
.nav-pill{
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(14,8,26,.55);
  backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%);
  border:1px solid var(--line-strong); border-radius:999px;
  padding:8px 10px 8px 18px; position:relative; overflow:hidden;
  box-shadow:0 24px 60px -28px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.05);
}
.nav-pill::before{
  content:''; position:absolute; top:0; left:16%; right:16%; height:1px;
  background:linear-gradient(90deg, transparent, var(--violet-bright) 40%, #fff 50%, var(--violet-bright) 60%, transparent);
  opacity:.9;
}
.brand{display:flex; align-items:center; gap:10px; position:relative; z-index:1;}
.brand img{width:34px; height:34px; object-fit:contain; filter:drop-shadow(0 0 10px rgba(167,139,250,.55));}
.brand .wordmark{font-size:.95rem; font-weight:700; letter-spacing:.02em;}
.brand .wordmark em{font-style:normal; color:var(--violet-electric);}
.nav-links{display:flex; align-items:center; gap:28px; font-size:.88rem; font-weight:600; color:var(--muted); position:relative; z-index:1;}
.nav-links a{position:relative; padding:6px 0; transition:color .25s var(--ease);}
.nav-links a:hover{color:var(--text);}
.nav-links a::after{content:''; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--violet-electric); transition:width .3s var(--ease);}
.nav-links a:hover::after{width:100%;}
.nav-cta{display:flex; align-items:center; gap:10px; position:relative; z-index:1;}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 20px; border-radius:999px; font-size:.88rem; font-weight:700;
  border:1px solid transparent; white-space:nowrap; position:relative; overflow:hidden;
  transition:transform .35s var(--ease), background .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.btn:active{transform:scale(.96);}
.btn-primary{
  background:linear-gradient(180deg, var(--violet-bright), var(--violet));
  color:#fff; box-shadow:0 10px 26px -10px var(--glow), inset 0 1px 0 rgba(255,255,255,.25);
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 16px 32px -10px var(--glow), inset 0 1px 0 rgba(255,255,255,.25);}
.btn-primary .cursor-glow{
  position:absolute; width:140px; height:140px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.4), transparent 70%);
  top:var(--gy,50%); left:var(--gx,50%); translate:-50% -50%; opacity:0; transition:opacity .3s ease; pointer-events:none;
}
.btn-primary:hover .cursor-glow{opacity:1;}
.btn-ghost{background:rgba(190,160,255,.05); border-color:var(--line-strong); color:var(--text);}
.btn-ghost:hover{background:rgba(190,160,255,.1); transform:translateY(-2px);}
.btn-sm{padding:9px 16px; font-size:.82rem;}
.btn .price{font-family:var(--font-display); font-weight:700; font-size:.8em; padding-left:8px; margin-left:4px; border-left:1px solid rgba(255,255,255,.3);}

.burger{display:none; width:36px; height:36px; border-radius:50%; border:1px solid var(--line-strong); background:rgba(190,160,255,.05); align-items:center; justify-content:center; position:relative; z-index:1;}
.burger span, .burger span::before, .burger span::after{content:''; display:block; width:15px; height:2px; background:var(--text); position:relative; transition:.3s var(--ease);}
.burger span::before{position:absolute; top:-5px;}
.burger span::after{position:absolute; top:5px;}
.mobile-menu{
  display:none; flex-direction:column; gap:4px;
  background:rgba(14,8,26,.95); backdrop-filter:blur(18px);
  border:1px solid var(--line-strong); border-radius:20px; margin:10px 20px 0; padding:14px;
}
.mobile-menu.open{display:flex;}
.mobile-menu a{padding:12px 14px; border-radius:12px; font-weight:600; color:var(--muted);}
.mobile-menu a:hover{background:rgba(190,160,255,.06); color:var(--text);}

/* ---------- Hero ---------- */
.hero{padding:96px 28px 48px; display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center;}
.hero-copy{container-type:inline-size; min-width:0;}
.hero-line{display:block; white-space:nowrap;}
.hero h1{font-size:clamp(2rem, 10cqi, 4.6rem); font-weight:800; letter-spacing:-.045em; line-height:1.02; margin-top:18px;}
.hero-dot{color:var(--violet-electric);}

/* Texte chrome animé (GradientText) */
.chrome, .chrome-static{
  background:linear-gradient(100deg, #fff 0%, #d9ccff 18%, var(--violet-electric) 34%, #5b21b6 50%, #c4b5fd 66%, #fff 82%, #b388ff 100%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 18px rgba(167,139,250,.35));
}
.chrome{animation:chromeShift 7s linear infinite;}
@keyframes chromeShift{from{background-position:0% 50%;} to{background-position:220% 50%;}}

/* Mot qui change (RotatingText) */
.rotator{
  display:inline-grid; vertical-align:bottom; white-space:nowrap;
  transition:width .55s var(--ease);
  clip-path:inset(-.15em -.3em -.25em -.1em);
}
.rotator-word{
  grid-area:1/1; justify-self:start; padding-right:.04em;
  opacity:0; transform:translateY(85%); filter:blur(8px);
  transition:transform .7s var(--ease), opacity .5s ease, filter .6s ease;
}
.rotator-word.is-active{opacity:1; transform:translateY(0); filter:blur(0) drop-shadow(0 0 18px rgba(167,139,250,.35));}
.rotator-word.is-leaving{opacity:0; transform:translateY(-85%); filter:blur(8px);}

/* Reflet qui balaie le texte (ShinyText) */
.shiny{
  background:linear-gradient(110deg, var(--violet-electric) 38%, #fff 50%, var(--violet-electric) 62%);
  background-size:260% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shiny 3.4s linear infinite;
}
@keyframes shiny{from{background-position:130% 0;} to{background-position:-130% 0;}}

/* Lettres qui montent (SplitText) */
.fx-split .fx-word{display:inline-block; white-space:nowrap; perspective:700px;}
.fx-split .fx-char{
  display:inline-block; opacity:0; transform-origin:50% 100%;
  transform:translateY(.55em) rotateX(-80deg); filter:blur(6px);
  transition:opacity .55s ease, transform .9s var(--ease), filter .6s ease;
  transition-delay:calc(var(--i) * 24ms);
}
.fx-split.fx-in .fx-char{opacity:1; transform:none; filter:none;}
.fx-split .fx-unit.chrome, .fx-split .fx-unit.chrome-static{filter:blur(6px);}
.fx-split.fx-in .fx-unit.chrome, .fx-split.fx-in .fx-unit.chrome-static{filter:drop-shadow(0 0 18px rgba(167,139,250,.35));}

/* Mots qui sortent du flou (BlurText) */
.fx-blur .fx-bword{
  display:inline-block; opacity:0; transform:translateY(10px); filter:blur(10px);
  transition:opacity .6s ease, transform .8s var(--ease), filter .7s ease;
  transition-delay:calc(var(--i) * 40ms);
}
.fx-blur.fx-in .fx-bword{opacity:1; transform:none; filter:none;}

/* Texte qui se décrypte (DecryptedText) */
.fx-decrypting{color:var(--violet-electric);}
.nav-links a[data-fx]{font-variant-numeric:tabular-nums;}
.hero p.lede{margin-top:22px; font-size:1.08rem; line-height:1.65; color:var(--muted); max-width:46ch;}
.hero-actions{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
.hero-actions .btn{padding:15px 26px; font-size:.95rem;}
.hero-note{margin-top:14px; font-size:.8rem; color:var(--muted-2);}

.stat-row{display:flex; gap:34px; margin-top:40px; flex-wrap:wrap;}
.stat .num{font-family:var(--font-display); font-weight:700; font-size:1.7rem; color:var(--text);}
.stat .num b{color:var(--violet-electric); font-weight:700;}
.stat .label{margin-top:4px; font-size:.78rem; color:var(--muted-2); font-weight:600; letter-spacing:.04em; text-transform:uppercase;}

.hero-visual{position:relative; display:flex; align-items:center; justify-content:center; min-height:420px;}
.hero-visual .glow{
  position:absolute; width:68%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, var(--glow), transparent 68%);
  filter:blur(40px); animation:breathe 5s ease-in-out infinite;
}
.hero-visual .orbit{
  position:absolute; width:min(92%, 480px); aspect-ratio:1; border-radius:50%;
  border:1px solid rgba(190,160,255,.14);
  mask-image:conic-gradient(from 0deg, #000 0 20%, transparent 35% 65%, #000 80% 100%);
  -webkit-mask-image:conic-gradient(from 0deg, #000 0 20%, transparent 35% 65%, #000 80% 100%);
  animation:spin 22s linear infinite;
}
.hero-visual .orbit.two{width:min(72%, 380px); animation-duration:16s; animation-direction:reverse; opacity:.6;}
/* Logo en relief 3D (TiltedCard + extrusion par couches) */
.logo3d{position:relative; width:min(90%, 460px); perspective:1100px; animation:float 6s ease-in-out infinite;}
.logo3d-stage{position:relative; transform-style:preserve-3d; will-change:transform;}
.logo3d-face{
  position:relative; display:block; width:100%; height:auto;
  transform:translateZ(1px);
  filter:drop-shadow(0 0 26px rgba(124,58,237,.5));
}
.logo3d-depth{position:absolute; inset:0; transform-style:preserve-3d; pointer-events:none;}
.logo3d-layer{position:absolute; inset:0; width:100%; height:100%;}
.logo3d-shadow{
  position:absolute; inset:0; width:100%; height:100%; pointer-events:none;
  transform:translateZ(-80px) translateY(34px) scale(.94);
  filter:blur(24px) brightness(.9); opacity:.75;
}
.logo3d-shine{position:absolute; inset:0; width:100%; height:100%; transform:translateZ(2px); pointer-events:none;}
@keyframes breathe{0%,100%{transform:scale(1); opacity:.75;} 50%{transform:scale(1.12); opacity:1;}}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes float{0%,100%{transform:translateY(0) rotate(0);} 50%{transform:translateY(-14px) rotate(-1.5deg);}}

/* ---------- Pourquoi ---------- */
.why{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:40px;}
.why-item{
  padding:28px 24px; border-radius:var(--r-md);
  background:linear-gradient(160deg, rgba(24,15,43,.75), rgba(14,8,26,.6));
  border:1px solid var(--line);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:border-color .3s ease, transform .4s var(--ease);
}
.why-item:hover{border-color:var(--line-strong); transform:translateY(-4px);}
.why-icon{width:30px; height:30px; stroke:var(--violet-electric); fill:none; stroke-width:1.6; margin-bottom:16px;}
.why-item h4{font-size:1rem; font-weight:700; margin-bottom:8px;}
.why-item p{font-size:.88rem; color:var(--muted); line-height:1.6;}

/* ---------- Produit ---------- */
.product{
  background:linear-gradient(155deg, var(--panel), var(--panel-2));
  border:1px solid var(--line); border-radius:var(--r-lg);
  padding:52px; display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:center;
  position:relative; overflow:hidden;
}
.product::before{
  content:''; position:absolute; top:-30%; right:-10%; width:60%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, var(--glow-soft), transparent 70%); filter:blur(20px); pointer-events:none;
}
.product h3{font-size:clamp(1.6rem,2.8vw,2.3rem); margin-top:16px; max-width:16ch;}
.product p{margin-top:16px; color:var(--muted); max-width:50ch; line-height:1.65;}
.feature-list{list-style:none; margin-top:22px; display:grid; grid-template-columns:1fr 1fr; gap:10px 24px;}
.feature-list li{display:flex; align-items:flex-start; gap:10px; font-size:.9rem; color:var(--text);}
/* Puce en étoile à 4 branches, reprise de l'étincelle du logo */
.feature-list li::before{
  content:''; flex:0 0 auto; width:14px; height:14px; margin-top:4px;
  background:linear-gradient(160deg, #fff, var(--violet-electric) 45%, var(--violet));
  clip-path:polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%);
  filter:drop-shadow(0 0 6px var(--glow));
}
.price-card{
  position:relative; background:rgba(6,4,11,.55); border:1px solid var(--line-strong); border-radius:var(--r-md);
  padding:32px; text-align:center;
  box-shadow:0 30px 60px -30px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.05);
}
.price-card::before{
  content:''; position:absolute; inset:-1px; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(160deg, rgba(255,255,255,.35), transparent 30%, transparent 70%, var(--violet) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
}
.price-card .tag{display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--violet-electric); margin-bottom:14px;}
.price-card .amount{font-family:var(--font-display); font-weight:800; font-size:4rem; line-height:1; letter-spacing:-.03em;}
.price-card .amount small{font-size:.4em; vertical-align:top; margin-left:4px; color:var(--violet-electric);}
.price-card .per{color:var(--muted-2); font-size:.85rem; margin-top:6px;}
.price-card ul{list-style:none; margin:22px 0; text-align:left; display:flex; flex-direction:column; gap:10px; font-size:.88rem; color:var(--muted);}
.price-card ul li{display:flex; gap:10px; align-items:center;}
.price-card ul li svg{width:16px; height:16px; stroke:var(--violet-electric); fill:none; stroke-width:2.2; flex:0 0 auto;}
.price-card .btn{width:100%; padding:15px;}
.price-card .fine{margin-top:12px; font-size:.75rem; color:var(--muted-2);}

/* ---------- Avis ---------- */
.reviews-head{display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:30px; flex-wrap:wrap;}
.reviews-head p{color:var(--muted); font-size:.92rem;}
.reviews-carousel{position:relative;}
.reviews-viewport{position:relative; height:280px; perspective:1400px; perspective-origin:50% 20%; overflow-x:hidden;}
.reviews-track{position:relative; width:100%; height:100%; transform-style:preserve-3d;}
.review-card{
  position:absolute; top:0; left:50%; width:300px; margin-left:-150px; height:100%;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r-md); padding:24px;
  display:flex; flex-direction:column; transform-origin:center center; backface-visibility:hidden;
  transition:transform .55s var(--ease), opacity .55s var(--ease);
}
.review-stars{display:flex; gap:3px; margin-bottom:14px;}
.review-stars svg{width:14px; height:14px; fill:var(--violet-electric);}
.review-card p{font-size:.9rem; line-height:1.6; color:var(--text); opacity:.9; flex:1;}
.review-who{display:flex; align-items:center; gap:10px; margin-top:18px;}
.review-avatar{
  width:30px; height:30px; border-radius:50%; flex:0 0 auto;
  background:linear-gradient(155deg, var(--violet-bright), var(--violet-deep));
  display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:700; color:#fff;
}
.review-who span{font-size:.82rem; font-weight:600; color:var(--muted);}
.rev-arrow{
  position:absolute; top:50%; translate:0 -50%; z-index:200; width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(14,8,26,.85); backdrop-filter:blur(14px); border:1px solid var(--line-strong);
  box-shadow:0 14px 30px -12px rgba(0,0,0,.8); transition:border-color .3s ease, transform .2s ease;
}
.rev-arrow:hover{border-color:var(--glow);}
.rev-arrow:active{transform:translateY(-50%) scale(.94);}
.rev-prev{left:4px;} .rev-next{right:4px;}
.rev-arrow svg{width:16px; height:16px; stroke:var(--text); fill:none; stroke-width:2;}

/* ---------- FAQ ---------- */
.faq-list{max-width:780px; margin-top:34px;}
.faq-item{border-top:1px solid var(--line);}
.faq-item:last-child{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:22px 4px; background:none; border:none; color:var(--text); font-family:var(--font-body); font-size:1rem; font-weight:600;
}
.faq-q .plus{flex:0 0 auto; width:20px; height:20px; position:relative;}
.faq-q .plus::before,.faq-q .plus::after{content:''; position:absolute; background:var(--muted); transition:transform .35s var(--ease), background .3s ease;}
.faq-q .plus::before{top:50%; left:0; width:100%; height:1.5px; translate:0 -50%;}
.faq-q .plus::after{left:50%; top:0; width:1.5px; height:100%; translate:-50% 0;}
.faq-item.open .faq-q{color:var(--violet-electric);}
.faq-item.open .faq-q .plus::before{background:var(--violet-electric);}
.faq-item.open .faq-q .plus::after{transform:rotate(90deg); opacity:0;}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s var(--ease);}
.faq-a p{padding:0 4px 22px; color:var(--muted); font-size:.92rem; line-height:1.65; max-width:62ch;}

/* ---------- CTA final ---------- */
.cta{
  text-align:center; padding:72px 28px; border:1px solid var(--line); border-radius:var(--r-lg); position:relative; overflow:hidden;
  background:radial-gradient(80% 120% at 50% 120%, rgba(124,58,237,.35), transparent 60%), var(--panel);
}
.cta h2{max-width:18ch; margin:0 auto;}
.cta p{color:var(--muted); margin-top:14px;}
.cta .btn{margin-top:28px; padding:15px 28px; font-size:.95rem;}

/* ---------- Footer ---------- */
footer{padding:50px 0 34px; border-top:1px solid var(--line); margin-top:40px;}
.footer-top{display:flex; justify-content:space-between; align-items:flex-start; gap:32px; padding-bottom:32px; flex-wrap:wrap;}
.footer-brand .brand{margin-bottom:12px;}
.footer-brand p{color:var(--muted); max-width:34ch; line-height:1.6; font-size:.9rem;}
.footer-links{display:flex; gap:48px; flex-wrap:wrap;}
.footer-col h4{font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:var(--muted-2); font-weight:700; margin-bottom:14px;}
.footer-col a{display:block; color:var(--muted); font-size:.9rem; margin-bottom:10px; transition:color .25s var(--ease);}
.footer-col a:hover{color:var(--text);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:22px; border-top:1px solid var(--line); font-size:.8rem; color:var(--muted-2); flex-wrap:wrap; gap:12px;}

/* ---------- Pages légales ---------- */
.legal-page{padding-top:120px; padding-bottom:90px; max-width:816px; margin:0 auto;}
.legal-back{display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:.88rem; font-weight:600; margin-bottom:26px; transition:color .25s var(--ease);}
.legal-back:hover{color:var(--violet-electric);}
.legal-page h1{font-size:clamp(1.9rem,3.6vw,2.6rem);}
.legal-updated{color:var(--muted-2); font-size:.85rem; margin-top:10px; margin-bottom:40px;}
.legal-page h2{font-size:1.1rem; margin-top:34px; margin-bottom:12px;}
.legal-page p,.legal-page li{color:var(--muted); line-height:1.75; font-size:.97rem;}
.legal-page ul{padding-left:20px; margin-top:10px; display:flex; flex-direction:column; gap:8px;}
.legal-page a{color:var(--violet-electric); font-weight:600;}
.legal-page strong{color:var(--text);}

/* ---------- Divers ---------- */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}
.to-top{
  position:fixed; right:22px; bottom:22px; z-index:90; width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(14,8,26,.8); backdrop-filter:blur(14px); border:1px solid var(--line-strong);
  box-shadow:0 14px 30px -12px rgba(0,0,0,.8); opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .35s var(--ease), transform .35s var(--ease), border-color .3s ease;
}
.to-top.show{opacity:1; visibility:visible; transform:translateY(0);}
.to-top:hover{border-color:var(--glow);}
.to-top svg{width:16px; height:16px; stroke:var(--text); fill:none; stroke-width:2;}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .hero{grid-template-columns:1fr; padding:60px 20px 40px;}
  .hero-visual{order:-1; min-height:260px;}
  .logo3d{width:min(78%, 360px);}
  .nav-links{display:none;}
  .burger{display:flex;}
  .why{grid-template-columns:1fr 1fr;}
  .product{grid-template-columns:1fr; padding:34px 26px;}
  .feature-list{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .wrap{padding:0 20px;}
  .hero-actions .btn{flex:1; justify-content:center;}
  .footer-top{flex-direction:column;}
  .reviews-viewport{height:250px;}
  .review-card{width:240px; margin-left:-120px;}
  .why{grid-template-columns:1fr;}
  .nav-cta .btn-ghost{display:none;}
  .nav-pill{padding-left:12px;}
}
@media (max-width:480px){
  .brand .wordmark{display:none;}
  .brand img{width:30px; height:30px;}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}


/* ==========================================================================
   Ajouts : boutons, cartes à halo, étapes, FAQ, page d'achat
   ========================================================================== */
.btn-lg{padding:15px 26px; font-size:.95rem;}
.btn-block{width:100%; padding:15px;}
.btn.is-disabled{opacity:.45; filter:saturate(.5); box-shadow:none; cursor:not-allowed;}
.btn.is-disabled:hover{transform:none;}

/* Carte avec halo qui suit la souris (SpotlightCard) */
.spotlight-card{position:relative; overflow:hidden; isolation:isolate;}
.spotlight-card::after{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:0;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%), rgba(167,139,250,.16), transparent 70%);
  transition:opacity .35s ease;
}
.spotlight-card:hover::after{opacity:1;}

/* Étapes */
.steps{list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:40px; counter-reset:none;}
.step{
  display:flex; gap:18px; align-items:flex-start;
  padding:28px 24px; border-radius:var(--r-md);
  background:linear-gradient(160deg, rgba(24,15,43,.75), rgba(14,8,26,.6));
  border:1px solid var(--line);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.step-n{
  font-family:var(--font-display); font-weight:800; font-size:1.6rem; line-height:1; letter-spacing:-.04em;
  background:linear-gradient(180deg, #fff, var(--violet-electric) 70%, var(--violet-deep));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.step h4{font-size:1rem; font-weight:700; margin-bottom:6px;}
.step p{font-size:.88rem; color:var(--muted); line-height:1.6;}
.steps-compact{grid-template-columns:1fr; gap:10px; margin-top:18px;}
.steps-compact .step{padding:18px 20px;}

/* FAQ en deux colonnes */
.faq-wrap{display:grid; grid-template-columns:.8fr 1.2fr; gap:56px; align-items:start;}
.faq-intro p{color:var(--muted); margin-top:16px; max-width:34ch; line-height:1.6;}
.faq-wrap .faq-list{margin-top:0;}
.faq-a a{color:var(--violet-electric); font-weight:600;}

/* Cartes un peu plus « verre » sur la vidéo */
.product, .cta, .review-card, .price-card{backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);}
.product{background:linear-gradient(155deg, rgba(18,11,32,.82), rgba(24,15,43,.7));}
.review-card{background:rgba(18,11,32,.85);}

/* ---------- Page d'achat ---------- */
.buy-page{padding-top:110px; padding-bottom:80px;}
.buy-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:start;}
.buy-info h1{font-size:clamp(2.2rem,5vw,3.6rem); font-weight:800; letter-spacing:-.045em; margin-top:16px;}
.buy-info .lede{margin-top:16px; font-size:1.05rem; color:var(--muted); line-height:1.65; max-width:46ch;}
.buy-sub{font-size:1.05rem; font-weight:700; letter-spacing:-.01em; margin-top:40px;}
.buy-info .feature-list{margin-top:16px;}
.buy-visual{position:relative; display:flex; justify-content:center; align-items:center; min-height:260px; margin-top:24px;}
.buy-visual .glow{
  position:absolute; width:55%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, var(--glow), transparent 68%); filter:blur(40px);
  animation:breathe 5s ease-in-out infinite;
}
.buy-visual .logo3d{width:min(70%, 340px);}

.order-card{
  position:sticky; top:96px;
  background:linear-gradient(160deg, rgba(20,12,36,.9), rgba(12,7,22,.88));
  border:1px solid var(--line-strong); border-radius:var(--r-lg);
  padding:30px; box-shadow:0 40px 80px -40px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.order-card .tag{display:inline-block; font-family:var(--font-mono); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--violet-electric);}
.order-product{display:flex; align-items:center; gap:14px; margin-top:20px; padding:16px; border-radius:var(--r-sm); background:rgba(190,160,255,.05); border:1px solid var(--line);}
.order-product img{width:52px; height:auto; filter:drop-shadow(0 0 10px rgba(167,139,250,.5));}
.order-product div{flex:1; display:flex; flex-direction:column; gap:2px;}
.order-product strong{font-size:.98rem;}
.order-product div span{font-size:.8rem; color:var(--muted-2);}
.order-price{font-family:var(--font-display); font-weight:700; font-size:1rem;}
.order-lines{margin-top:18px; display:flex; flex-direction:column; gap:10px;}
.order-line{display:flex; justify-content:space-between; font-size:.88rem; color:var(--muted);}
.order-line .ok{color:var(--violet-electric); font-weight:600;}
.order-total{display:flex; justify-content:space-between; align-items:baseline; margin-top:18px; padding-top:18px; border-top:1px solid var(--line);}
.order-total > span:first-child{font-weight:700;}
.amount-sm{font-family:var(--font-display); font-weight:800; font-size:2rem; letter-spacing:-.03em;}
.pay-methods{display:flex; gap:8px; flex-wrap:wrap; margin-top:20px;}
.pay-chip{font-family:var(--font-mono); font-size:.72rem; font-weight:700; letter-spacing:.06em; padding:7px 12px; border-radius:999px; border:1px solid var(--line-strong); color:var(--muted); background:rgba(190,160,255,.04);}

.agree{display:flex; gap:12px; align-items:flex-start; margin:22px 0 18px; font-size:.84rem; color:var(--muted); line-height:1.55; cursor:pointer;}
.agree input{position:absolute; opacity:0; width:1px; height:1px;}
.agree-box{
  flex:0 0 auto; width:20px; height:20px; margin-top:1px; border-radius:6px;
  border:1.5px solid var(--line-strong); background:rgba(190,160,255,.04);
  display:flex; align-items:center; justify-content:center; transition:background .2s ease, border-color .2s ease;
}
.agree-box svg{width:13px; height:13px; stroke:#fff; fill:none; stroke-width:3; opacity:0; transform:scale(.6); transition:opacity .2s ease, transform .25s var(--ease);}
.agree input:checked + .agree-box{background:var(--violet); border-color:var(--violet-bright);}
.agree input:checked + .agree-box svg{opacity:1; transform:none;}
.agree input:focus-visible + .agree-box{outline:2px solid var(--violet-electric); outline-offset:2px;}
.agree a{color:var(--violet-electric); font-weight:600;}
.agree.shake{animation:shake .4s ease;}
@keyframes shake{20%,60%{transform:translateX(-5px);} 40%,80%{transform:translateX(5px);}}

.order-card .fine{margin-top:12px; font-size:.78rem; color:var(--muted-2); text-align:center;}
.order-card .fine.warn{color:var(--violet-electric);}
.trust{list-style:none; display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-top:18px; padding-top:18px; border-top:1px solid var(--line);}
.trust li{display:flex; align-items:center; gap:6px; font-size:.76rem; color:var(--muted);}
.trust svg{width:14px; height:14px; stroke:var(--violet-electric); fill:none; stroke-width:2.4;}

@media (max-width:900px){
  .steps{grid-template-columns:1fr;}
  .faq-wrap{grid-template-columns:1fr; gap:28px;}
  .buy-grid{grid-template-columns:1fr;}
  .order-card{position:relative; top:0;}
  .buy-page{padding-top:80px;}
}
@media (prefers-reduced-motion: reduce){
  .site-bg-video{display:none;}
}

/* État final garanti des effets de texte (posé par fx.js après l'animation) */
.fx-done .fx-char:not(.fx-unit), .fx-done .fx-bword{transition:none !important; opacity:1 !important; transform:none !important; filter:none !important;}
.fx-done .fx-unit{transition:none !important; opacity:1 !important; transform:none !important;}

/* ==========================================================================
   Passe « lisibilité » : plus de petites écritures, texte plus grand,
   pied de page sur une ligne
   ========================================================================== */
body{font-size:17px;}
section{padding:96px 0;}
.section-title{margin-top:0; max-width:22ch;}
h2{font-size:clamp(2rem,4vw,3.1rem);}

/* Hero */
.hero{padding-top:110px; padding-bottom:80px;}
.hero p.lede{font-size:clamp(1.12rem,1.6vw,1.3rem); line-height:1.6; max-width:40ch; margin-top:26px; color:#c9bfe2;}
.hero-actions{margin-top:36px;}
.btn-lg{padding:17px 30px; font-size:1rem;}
.btn-sm{padding:10px 18px; font-size:.88rem;}

/* Cartes */
.why{gap:18px; margin-top:44px;}
.why-item{padding:32px 26px;}
.why-item h4{font-size:1.15rem; margin-bottom:10px;}
.why-item p{font-size:1rem; line-height:1.6;}
.why-icon{width:34px; height:34px; margin-bottom:20px;}
.steps{margin-top:44px; gap:18px;}
.step{padding:30px 26px;}
.step h4{font-size:1.15rem;}
.step p{font-size:1rem;}
.step-n{font-size:1.9rem;}

/* Produit */
.product h3{margin-top:0; font-size:clamp(1.9rem,3.2vw,2.6rem);}
.product p{font-size:1.08rem;}
.feature-list{margin-top:26px; gap:14px 28px;}
.feature-list li{font-size:1.02rem;}
.price-card{padding:40px 32px;}
.price-card .amount{font-size:5rem;}
.price-sub{margin:14px 0 28px; font-size:1.05rem; color:var(--muted); line-height:1.5;}

/* Avis */
#tab-reviews .section-title{margin-bottom:34px;}
.review-card p{font-size:1rem;}
.review-who span{font-size:.92rem;}

/* FAQ */
.faq-q{font-size:1.1rem; padding:24px 4px;}
.faq-a p{font-size:1.02rem;}

/* Appel final */
.cta{padding:84px 28px;}
.cta .btn{margin-top:32px;}

/* Pied de page : une seule ligne, texte normal */
footer{padding:36px 0; margin-top:24px; border-top:1px solid var(--line); background:rgba(6,4,11,.55); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);}
.footer-row{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;}
.footer-nav{display:flex; gap:28px; flex-wrap:wrap;}
.footer-nav a{color:var(--muted); font-size:1rem; font-weight:600; transition:color .25s var(--ease);}
.footer-nav a:hover{color:var(--text);}
.footer-copy{color:var(--muted); font-size:1rem;}

/* Pages légales */
.legal-page p, .legal-page li{font-size:1.04rem;}
.legal-updated{font-size:1rem; margin-bottom:36px;}
.legal-page h2{font-size:1.3rem;}

/* Page d'achat */
.buy-info h1{margin-top:0;}
.buy-info .lede{font-size:1.15rem;}
.buy-sub{font-size:1.35rem; margin-top:44px;}
.order-card{padding:32px;}
.order-product{margin-top:0; padding:18px;}
.order-product strong{flex:1; font-size:1.1rem;}
.order-product img{width:56px;}
.order-price{font-size:1.15rem;}
.order-lines{margin-top:22px; gap:12px;}
.order-line{font-size:1rem;}
.order-total{margin-top:22px; padding-top:22px;}
.order-total > span:first-child{font-size:1.1rem;}
.amount-sm{font-size:2.4rem;}
.agree{font-size:1rem; margin:24px 0 20px;}
.checkout-note{display:none; margin-top:14px; text-align:center; font-size:1rem; color:var(--violet-electric);}
.checkout-note.warn{display:block;}

@media (max-width:640px){
  .footer-row{flex-direction:column; align-items:flex-start; gap:18px;}
  .footer-nav{gap:20px;}
  .price-card .amount{font-size:4.2rem;}
  section{padding:72px 0;}
}

/* Logo en vrai 3D (logo3d.js) : le canvas WebGL remplace la version CSS */
.logo3d-gl{
  position:absolute; left:-22%; top:-26%; width:144%; height:152%;
  pointer-events:none;
  filter:
    drop-shadow(0 0 6px rgba(196,168,255,.55))
    drop-shadow(0 0 22px rgba(139,92,246,.75))
    drop-shadow(0 0 60px rgba(124,58,237,.55))
    drop-shadow(0 22px 40px rgba(0,0,0,.55));
}
.logo3d.gl-ready .logo3d-stage{visibility:hidden;}
.logo3d.gl-ready{animation-duration:7s;}

/* Fenêtre « Out of stock » (app.js) */
.stock-modal{
  position:fixed; inset:0; z-index:500; display:flex; align-items:center; justify-content:center; padding:20px;
  background:rgba(4,2,10,.6); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
}
.stock-modal.open{opacity:1; visibility:visible;}
.stock-card{
  width:min(420px, 100%); text-align:center; padding:36px 30px 30px;
  background:linear-gradient(160deg, rgba(24,14,44,.96), rgba(12,7,22,.96));
  border:1px solid var(--line-strong); border-radius:var(--r-lg);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.95), 0 0 60px -20px var(--glow), inset 0 1px 0 rgba(255,255,255,.06);
  transform:translateY(16px) scale(.97); transition:transform .45s var(--ease);
}
.stock-modal.open .stock-card{transform:none;}
.stock-card img{width:110px; margin:0 auto 18px; filter:drop-shadow(0 0 18px rgba(124,58,237,.6));}
.stock-card h3{font-size:1.8rem; font-weight:800;}
.stock-card p{color:var(--muted); font-size:1.05rem; line-height:1.6; margin:12px 0 26px;}

/* ==========================================================================
   Onglets (app.js) : une page par onglet, transition en « swipe »
   ========================================================================== */
.tabs{position:relative; min-height:calc(100vh - 160px);}
.tab-panel{display:none;}
.tab-panel.is-active{display:block;}
.tab-panel.is-entering{animation:tabIn .6s var(--ease) both;}
/* l'onglet qui part est figé à sa place à l'écran pendant qu'il glisse */
.tab-panel.is-leaving{display:block; position:fixed; z-index:1; pointer-events:none; animation:tabOut .45s var(--ease) both;}
@keyframes tabIn{
  from{opacity:0; transform:translateX(calc(var(--dir, 1) * 38%)) scale(.97); filter:blur(10px);}
  to{opacity:1; transform:none; filter:none;}
}
@keyframes tabOut{
  from{opacity:1; transform:none; filter:none;}
  to{opacity:0; transform:translateX(calc(var(--dir, 1) * -38%)) scale(.97); filter:blur(10px);}
}
.nav-links a.is-active{color:var(--text);}
.nav-links a.is-active::after{width:100%;}
.mobile-menu a.is-active{background:rgba(190,160,255,.06); color:var(--text);}
/* une section visée (#how) s'arrête sous le menu collant */
.tab-panel section[id]{scroll-margin-top:90px;}

/* ==========================================================================
   Espace utilisateur (account/index.html + account.js)
   ========================================================================== */
.account-page{padding-top:100px; padding-bottom:80px; min-height:calc(100vh - 160px);}
.account-loading{color:var(--muted); text-align:center; padding:80px 0;}
[hidden]{display:none !important;}

.login-card{
  max-width:460px; margin:20px auto 0; text-align:center; padding:44px 34px 34px;
  background:linear-gradient(160deg, rgba(24,14,44,.9), rgba(12,7,22,.88));
  border:1px solid var(--line-strong); border-radius:var(--r-lg);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.9), 0 0 60px -24px var(--glow), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.login-logo{width:96px; margin:0 auto 18px; filter:drop-shadow(0 0 18px rgba(124,58,237,.6));}
.login-card h1{font-size:clamp(2rem,5vw,2.8rem); font-weight:800; letter-spacing:-.04em;}
.login-card .lede{color:var(--muted); margin:14px 0 28px; line-height:1.6;}
.btn-discord svg{width:20px; height:20px; fill:currentColor;}
.login-fine{margin-top:16px; font-size:.88rem; color:var(--muted-2);}

.account-head{display:flex; align-items:center; gap:18px; margin-bottom:28px; flex-wrap:wrap;}
.account-avatar{width:64px; height:64px; border-radius:50%; object-fit:cover; border:1px solid var(--line-strong); box-shadow:0 0 30px -6px var(--glow); background:var(--panel);}
.account-id{flex:1; min-width:0;}
.account-id h1{font-size:clamp(1.6rem,3.4vw,2.3rem); font-weight:800; letter-spacing:-.035em; overflow-wrap:anywhere;}
.account-id p{color:var(--muted); margin-top:4px;}

.account-grid{display:grid; grid-template-columns:1.5fr 1fr; gap:18px; align-items:start;}
.account-side{display:flex; flex-direction:column; gap:18px;}
.account-card{
  padding:30px 28px; border-radius:var(--r-md);
  background:linear-gradient(160deg, rgba(24,15,43,.8), rgba(14,8,26,.7));
  border:1px solid var(--line); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.account-card h2{font-size:1.5rem; letter-spacing:-.03em; margin-bottom:18px;}
.account-card h3{font-size:1.1rem; margin-bottom:8px;}
.account-card p{color:var(--muted); line-height:1.6;}
.account-card .btn-block{margin-top:18px;}

.key-list{display:flex; flex-direction:column; gap:12px;}
.key-item{padding:18px; border-radius:var(--r-sm); border:1px solid var(--line-strong); background:rgba(6,4,11,.45);}
.key-item.is-revoked{opacity:.55;}
.key-top{display:flex; align-items:center; justify-content:space-between; gap:12px;}
.key-code{font-family:var(--font-mono); font-size:1.02rem; font-weight:700; letter-spacing:.04em; color:var(--text); overflow-wrap:anywhere;}
.key-copy{
  flex:0 0 auto; font-family:var(--font-mono); font-size:.78rem; font-weight:700; letter-spacing:.06em;
  padding:7px 12px; border-radius:999px; border:1px solid var(--line-strong); background:rgba(190,160,255,.05); color:var(--muted);
  transition:color .2s ease, border-color .2s ease;
}
.key-copy:hover:not(:disabled){color:var(--text); border-color:var(--glow);}
.key-copy:disabled{opacity:.4; cursor:not-allowed;}
.key-chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
.chip{font-size:.8rem; font-weight:600; padding:4px 10px; border-radius:999px; border:1px solid var(--line); color:var(--muted);}
.chip-on{color:var(--violet-electric); border-color:rgba(179,136,255,.35);}
.chip-off{color:#ff8fa3; border-color:rgba(255,143,163,.35);}
.key-actions{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:14px;}
.key-actions .btn:disabled{cursor:not-allowed;}
.key-empty{color:var(--muted); padding:6px 0 4px;}

.form-note{display:none; font-size:.92rem; color:var(--violet-electric);}
.form-note.show{display:block;}
.form-note.warn{color:#ff8fa3;}
#loginNote.warn{color:#ff8fa3;}

.redeem{margin-top:26px; padding-top:22px; border-top:1px solid var(--line);}
.redeem label{display:block; font-weight:600; margin-bottom:10px;}
.redeem-row{display:flex; gap:10px;}
.redeem .form-note{margin-top:10px;}
.field{
  flex:1; min-width:0; padding:12px 16px; border-radius:999px; font:inherit; font-size:.95rem; color:var(--text);
  background:rgba(6,4,11,.6); border:1px solid var(--line-strong); outline:none; transition:border-color .2s ease, box-shadow .2s ease;
}
.field::placeholder{color:var(--muted-2);}
.field:focus{border-color:var(--violet-bright); box-shadow:0 0 0 3px var(--glow-soft);}
#redeemInput{font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.04em;}

.admin-panel{margin-top:18px;}
.admin-create{display:flex; gap:10px; flex-wrap:wrap;}
.admin-create #adminCount{flex:0 0 90px;}
.admin-created{margin-top:14px; padding:14px 16px; border-radius:var(--r-sm); background:rgba(6,4,11,.6); border:1px solid var(--line-strong); font-family:var(--font-mono); font-size:.9rem; white-space:pre-wrap; user-select:all;}
.admin-table-wrap{margin-top:18px; overflow-x:auto;}
.admin-table{width:100%; border-collapse:collapse; font-size:.88rem;}
.admin-table th{text-align:left; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted-2); padding:8px 10px; border-bottom:1px solid var(--line);}
.admin-table td{padding:10px; border-bottom:1px solid var(--line); color:var(--muted); white-space:nowrap;}
.admin-table code{font-family:var(--font-mono); color:var(--text);}
.admin-table tr.is-revoked td{opacity:.5;}

@media (max-width:900px){
  .account-grid{grid-template-columns:1fr;}
  .account-page{padding-top:70px;}
}
@media (max-width:640px){
  .redeem-row{flex-direction:column;}
  .account-card{padding:24px 20px;}
  .login-card{padding:36px 22px 28px;}
}

/* Admin · Script */
#adminScript > p{margin-bottom:16px;}
.script-field{display:block; width:100%; border-radius:var(--r-sm); font-family:var(--font-mono); font-size:.85rem; line-height:1.5; resize:vertical; min-height:200px; white-space:pre; tab-size:2;}
.script-bar{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; flex-wrap:wrap;}
.script-info{color:var(--muted); font-size:.9rem;}
#scriptNote{margin-top:10px;}
.key-actions .form-note{flex-basis:100%; overflow-wrap:anywhere; font-family:inherit;}

/* ---------- Features (onglet Product) ---------- */
#features{padding-top:24px; padding-bottom:24px;}
.features-grid{columns:2; column-gap:18px; margin-top:40px;}
.feat-card{
  break-inside:avoid; margin-bottom:18px; padding:28px 26px 22px; border-radius:var(--r-md);
  background:linear-gradient(160deg, rgba(24,15,43,.78), rgba(14,8,26,.66));
  border:1px solid var(--line); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:border-color .3s ease;
}
.feat-card:hover{border-color:var(--line-strong);}
.feat-card h3{display:flex; align-items:center; gap:12px; font-size:1.35rem; letter-spacing:-.03em; margin-bottom:6px;}
.feat-card h3::before{
  content:''; flex:0 0 auto; width:16px; height:16px;
  background:linear-gradient(160deg, #fff, var(--violet-electric) 45%, var(--violet));
  clip-path:polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%);
  filter:drop-shadow(0 0 6px var(--glow));
}
.feat-count{margin-left:auto; font-family:var(--font-mono); font-size:.72rem; font-weight:700; letter-spacing:.08em; color:var(--violet-electric); padding:3px 9px; border-radius:999px; border:1px solid rgba(179,136,255,.3);}
.feat-list{list-style:none;}
.feat-list li{padding:14px 0; border-top:1px solid var(--line);}
.feat-list li:first-child{border-top:none; padding-top:10px;}
.feat-list h4{font-size:1.02rem; font-weight:700; color:var(--text);}
.feat-list p{color:var(--muted); font-size:.95rem; line-height:1.55; margin-top:4px;}
.feat-list .feat-opts{color:var(--muted-2); font-size:.88rem;}
@media (max-width:900px){
  .features-grid{columns:1;}
}
.admin-actions{display:flex; gap:6px;}
.hwid-src{color:var(--muted-2); font-size:.78rem;}
.hwid-miss{display:block; margin-top:3px; color:#ff8fa3; font-size:.78rem;}

/* Admin · Script : envoi d'un dossier */
#scriptInfo{margin:0 0 16px;}
.upload-pick{display:flex; gap:10px; flex-wrap:wrap;}
.upload-pick .btn{cursor:pointer;}
.upload-review{margin-top:18px;}
.entry-pick{display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.9rem;}
.entry-pick .field{flex:0 0 auto; padding:8px 14px; font-family:var(--font-mono); font-size:.85rem;}
.upload-list{list-style:none; max-height:220px; overflow:auto; margin:14px 0; padding:8px 14px; border-radius:var(--r-sm); background:rgba(6,4,11,.6); border:1px solid var(--line);}
.upload-list li{display:flex; justify-content:space-between; gap:12px; padding:5px 0; font-size:.86rem; color:var(--muted); border-bottom:1px solid var(--line);}
.upload-list li:last-child{border-bottom:none;}
.upload-list code{font-family:var(--font-mono); color:var(--text); overflow-wrap:anywhere;}
.upload-progress{height:6px; border-radius:999px; background:rgba(190,160,255,.08); overflow:hidden; margin-bottom:14px;}
.upload-progress span{display:block; height:100%; width:0; background:linear-gradient(90deg, var(--violet-deep), var(--violet-electric)); transition:width .2s ease;}