/* bossplus.fr — landing (premium) */
:root{
  --bg:#07070d;
  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.72);
  --accent:#ff1232;
  --accent2:#ff7a18;
  --font-head:"Unbounded", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-body:"Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background: radial-gradient(1200px 800px at 20% 10%, rgba(255,18,50,.20), transparent 55%),
              radial-gradient(900px 700px at 80% 20%, rgba(255,122,24,.12), transparent 55%),
              radial-gradient(900px 900px at 40% 90%, rgba(112,0,255,.10), transparent 60%),
              var(--bg);
  overflow-x:hidden;
}
.wrap{ width:min(1040px, 92vw); margin:0 auto; }
.bg{position:fixed; inset:0; pointer-events:none; z-index:-1;}
.glow{
  position:absolute;
  width:520px; height:520px;
  filter: blur(42px);
  opacity:.55;
  transform: translate3d(0,0,0);
  animation: float 10s ease-in-out infinite;
}
.g1{left:-160px; top:-160px; background:radial-gradient(circle at 30% 30%, rgba(255,18,50,.70), transparent 60%);}
.g2{right:-180px; top:120px; background:radial-gradient(circle at 40% 40%, rgba(255,122,24,.55), transparent 62%); animation-duration:12s;}
.g3{left:35%; bottom:-220px; background:radial-gradient(circle at 40% 40%, rgba(112,0,255,.40), transparent 64%); animation-duration:14s;}
@keyframes float{ 0%,100%{transform: translate3d(0,0,0) scale(1);} 50%{transform: translate3d(0,-16px,0) scale(1.03);} }
.noise{
  position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
  opacity:.28;
}
.header{ padding:18px 0; }
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; }
.brand-logo{
  width:38px;height:38px;border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  padding:6px;
}
.brand-name{ font-family:var(--font-head); letter-spacing:-.04em; font-weight:700; }
.plus{ color:var(--accent); }
.pill{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.82);
  font-size: .92rem;
}
.dot{opacity:.65}
.main{ padding:42px 0 30px; }
.card{
  position:relative;
  padding:34px;
  border-radius:26px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 80px rgba(0,0,0,.55);
  backdrop-filter: blur(14px);
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .18s ease;
  overflow:hidden;
}
.card:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(600px 300px at 30% 0%, rgba(255,18,50,.22), transparent 60%),
              radial-gradient(520px 320px at 90% 40%, rgba(255,122,24,.16), transparent 62%);
  opacity:.9;
  z-index:0;
}
.card > *{position:relative; z-index:1;}
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 12px; border-radius:999px;
  background: rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.86);
  font-size:.92rem;
  margin-bottom:14px;
}
.spark{ width:10px;height:10px;border-radius:999px; background: var(--accent); box-shadow: 0 0 22px rgba(255,18,50,.65); }
h1{
  margin:0 0 10px;
  font-family:var(--font-head);
  letter-spacing:-.05em;
  font-size: clamp(28px, 4.2vw, 54px);
  line-height:1.06;
}
h1 .line{display:block; opacity:.96}
.lead{ margin: 10px 0 18px; font-size: 1.05rem; color: var(--muted); max-width: 70ch; }
.stats{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:12px; margin: 18px 0 22px; }
.stat{ padding:14px; border-radius:18px; background: rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.10); }
.stat-num{ font-family: var(--font-head); font-weight:700; letter-spacing:-.03em; font-size: 1.15rem; }
.stat-lbl{ margin-top:6px; color: rgba(255,255,255,.72); font-size:.92rem; }
.cta{ display:flex; flex-direction:column; gap:10px; margin-top: 8px; }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 16px; border-radius:16px;
  text-decoration:none; color:white; font-weight:800;
  letter-spacing:.06em; text-transform:uppercase;
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  box-shadow: 0 16px 40px rgba(255,18,50,.26);
  border:1px solid rgba(255,255,255,.14);
  transition: transform .18s ease, filter .18s ease;
}
.btn:hover{ transform: translateY(-1px); filter: brightness(1.03); }
.arrow{ font-size: 1.1em; }
.hint{ color: rgba(255,255,255,.68); font-size:.92rem; }
.footer{
  display:flex; justify-content:space-between; gap:18px;
  padding:18px 2px 0; margin-top: 18px;
  color: rgba(255,255,255,.72); font-size:.92rem;
}
.footer-title{ font-family: var(--font-head); font-size:.92rem; color: rgba(255,255,255,.82); margin-bottom: 8px; }
.footer-item{ margin:6px 0; }
.footer a{ color: rgba(255,255,255,.82); text-decoration:none; }
.footer a:hover{ color:white; text-decoration:underline; }
@media (max-width: 820px){
  .stats{grid-template-columns: 1fr; }
  .card{padding:24px}
  .footer{flex-direction:column}
}