:root{
  --bg:#06080d;
  --bg2:#0b0f1a;
  --glass:rgba(12,16,24,0.72);
  --line:rgba(255,255,255,0.10);
  --text:#ffffff;
  --muted:#b8c0cc;
  --green:#39ff6c;
  --pink:#ff1178;
  --shadow:0 0 0 1px rgba(105,255,140,0.10), 0 0 25px rgba(72,255,121,0.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter",sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.container{width:min(1200px, calc(100% - 40px)); margin:0 auto}
.section{padding:100px 0; position:relative; z-index:2}
.bg-grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    linear-gradient(rgba(57,255,108,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(57,255,108,.06) 1px, transparent 1px);
  background-size:48px 48px;
}
.bg-orb{
  position:fixed; border-radius:50%; filter:blur(80px); opacity:.14; pointer-events:none; z-index:0;
  animation:pulseGlow 8s ease-in-out infinite;
}
.orb-1{width:360px;height:360px;left:-80px;top:90px;background:var(--green)}
.orb-2{width:360px;height:360px;right:-90px;top:80px;background:var(--pink)}
.orb-3{width:320px;height:320px;left:40%;bottom:40px;background:var(--green)}
.site-header{
  position:sticky; top:0; z-index:50; backdrop-filter:blur(14px);
  background:rgba(0,0,0,.36); border-bottom:1px solid var(--line);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; min-height:82px; gap:20px}
.brand{display:flex;align-items:center;gap:14px}
.brand-mark{border-radius:16px; box-shadow:0 0 0 1px rgba(105,255,140,.18),0 0 25px rgba(72,255,121,.14),0 0 60px rgba(255,0,122,.08)}
.brand strong{display:block; font-family:"Poppins",sans-serif; letter-spacing:.24em; font-size:20px}
.brand small{display:block; text-transform:uppercase; letter-spacing:.34em; color:rgba(255,255,255,.45); font-size:11px}
.main-nav{display:flex;gap:28px;color:rgba(255,255,255,.75)}
.main-nav a{position:relative;padding:6px 0}
.main-nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:linear-gradient(90deg,var(--green),var(--pink));transition:.3s ease}
.main-nav a:hover{color:var(--green)}
.main-nav a:hover::after{width:100%}
.btn{
  display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:15px 24px; font-weight:800;
  transition:.28s ease; border:1px solid transparent;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--green); color:#000; box-shadow:0 0 30px rgba(57,255,108,.28)}
.btn-pink{background:var(--pink); color:#fff; box-shadow:0 0 30px rgba(255,17,120,.22)}
.btn-secondary{background:rgba(255,255,255,.04); color:#fff; border-color:rgba(255,255,255,.15)}
.btn-secondary:hover{border-color:var(--green); color:var(--green)}
.btn-green-outline{background:rgba(57,255,108,.08); color:#d3ffde; border-color:rgba(57,255,108,.35)}
.btn-green-outline:hover{background:var(--green); color:#000}
.btn-header{white-space:nowrap}
.card-glass{
  position:relative;
  background:var(--glass); border:1px solid var(--line); box-shadow:var(--shadow); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.hero{padding-top:60px}
.parallax-section{overflow:hidden}
.layer{position:absolute; inset:auto; pointer-events:none; z-index:1}
.layer-green{left:0; top:80px; width:380px; height:680px; background:radial-gradient(circle, rgba(57,255,108,.18), transparent 70%); filter:blur(20px)}
.layer-pink{right:0; top:60px; width:360px; height:680px; background:radial-gradient(circle, rgba(255,17,120,.14), transparent 70%); filter:blur(20px)}
.hero-grid{
  position:relative; z-index:2;
  display:grid; grid-template-columns:1.08fr .92fr; gap:50px; align-items:center; min-height:calc(100vh - 82px);
}
.eyebrow,.section-kicker{
  display:inline-flex; align-items:center; gap:10px; border:1px solid rgba(57,255,108,.25); background:rgba(255,255,255,.04);
  color:#b9ffc8; padding:12px 16px; border-radius:999px; font-size:14px; margin-bottom:18px;
}
.hero-copy h1{margin:0; font-family:"Poppins",sans-serif; font-size:clamp(42px, 6vw, 82px); line-height:.94; letter-spacing:-.04em}
.hero-copy p{max-width:720px; color:rgba(255,255,255,.72); font-size:20px; margin:22px 0 0}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap; margin-top:34px}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:42px}
.stat-card{padding:22px; border-radius:24px; background:rgba(255,255,255,.04); border:1px solid var(--line); box-shadow:var(--shadow)}
.stat-card strong{display:block; color:var(--green); font-size:28px; font-weight:900}
.stat-card span{display:block; color:rgba(255,255,255,.65); font-size:14px; margin-top:8px}
.hero-visual{position:relative; padding:14px; border-radius:32px; overflow:hidden; box-shadow:0 0 0 1px rgba(105,255,140,.15),0 0 25px rgba(72,255,121,.14),0 0 60px rgba(255,0,122,.08)}
.hero-visual img{width:100%; height:640px; object-fit:cover; border-radius:24px; animation:floatY 8s ease-in-out infinite}
.hero-badge{position:absolute; left:26px; top:26px; z-index:2; border-radius:999px; padding:10px 14px; border:1px solid var(--line); background:rgba(0,0,0,.42); color:var(--green); font-size:12px; letter-spacing:.24em; text-transform:uppercase}
.hero-float-card{position:absolute; right:18px; top:108px; z-index:2; padding:14px 16px; border-radius:18px; background:rgba(0,0,0,.45); border:1px solid rgba(255,255,255,.10); backdrop-filter:blur(10px); min-width:150px; box-shadow:var(--shadow)}
.hero-float-card span{display:block; color:rgba(255,255,255,.45); text-transform:uppercase; font-size:11px; letter-spacing:.16em}
.hero-float-card strong{display:block; margin-top:6px; color:var(--green); font-size:18px}
.hero-overlay{position:absolute; left:28px; right:28px; bottom:28px; border-radius:28px; padding:18px 22px; background:rgba(0,0,0,.46); backdrop-filter:blur(10px); border:1px solid var(--line)}
.hero-overlay small{display:block; color:rgba(255,255,255,.45); text-transform:uppercase; letter-spacing:.28em}
.hero-overlay h3{margin:8px 0 0; font-size:24px}
.section-head{display:grid; gap:24px; margin-bottom:32px}
.section-head.split{grid-template-columns:.95fr 1.05fr}
.section-title-box,.section-text,.whykick-copy,.whykick-side,.case-card,.contact-card,.contact-form,.cta-box{padding:30px; border-radius:32px}
.section-title-box h2,.promo-box h2,.contact-card h2,.cta-box h2,.whykick-copy h2,.section-head.centered h2{margin:0; font-family:"Poppins",sans-serif; font-size:clamp(32px,4vw,54px); line-height:1.04}
.section-head.centered{text-align:center; max-width:900px; margin:0 auto 40px}
.section-head.centered p{margin:0; color:rgba(255,255,255,.65)}
.features-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.feature{padding:28px; border-radius:28px}
.icon-dot{width:48px; height:48px; display:grid; place-items:center; margin-bottom:16px; border-radius:18px; background:rgba(57,255,108,.10); color:var(--green); font-size:20px}
.feature h3{margin:0 0 8px; font-size:22px}
.feature p,.section-text,.whykick-copy p,.case-card p,.contact-card p,.cta-box p{color:rgba(255,255,255,.72)}
.whykick-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:24px}
.whykick-points{display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:24px}
.whykick-points div,.platform-stat{padding:16px 18px; border-radius:18px; background:rgba(255,255,255,.04); border:1px solid var(--line)}
.whykick-side{display:grid; gap:16px; align-content:center}
.platform-stat strong{display:block; color:var(--green); font-size:30px; font-family:"Poppins",sans-serif}
.platform-stat span{display:block; margin-top:6px; color:rgba(255,255,255,.68); text-transform:uppercase; letter-spacing:.16em; font-size:12px}
.streamer-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px}
.streamer-card{position:relative; min-height:620px; overflow:hidden; border-radius:30px; border:1px solid var(--line); background:rgba(255,255,255,.03); transition:.4s ease; box-shadow:var(--shadow); isolation:isolate}
.streamer-card:hover{transform:translateY(-8px); border-color:rgba(57,255,108,.45); box-shadow:0 0 0 1px rgba(105,255,140,.18),0 0 36px rgba(72,255,121,.18),0 0 90px rgba(255,0,122,.08)}
.streamer-card > img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .65s ease}
.streamer-card:hover > img{transform:scale(1.07)}
.streamer-card::after{content:""; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.20), rgba(0,0,0,.94))}
.streamer-top{position:absolute; top:18px; left:18px; right:18px; z-index:2; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap}
.chip{border-radius:999px; padding:10px 14px; font-size:11px; letter-spacing:.18em; text-transform:uppercase; background:rgba(0,0,0,.38); border:1px solid var(--line)}
.chip-green{background:rgba(57,255,108,.12); border-color:rgba(57,255,108,.28); color:#c9ffd6}
.live-chip{display:flex; align-items:center; gap:8px}
.live-dot{display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--green); box-shadow:0 0 12px rgba(57,255,108,.75)}
.streamer-hover{position:absolute; left:20px; right:20px; top:78px; z-index:2; border-radius:22px; padding:14px 16px; background:rgba(0,0,0,.38); border:1px solid rgba(255,255,255,.10); backdrop-filter:blur(10px); opacity:0; transform:translateY(10px); transition:.35s ease}
.streamer-hover strong{display:block; font-size:14px; letter-spacing:.18em}
.streamer-hover small{display:block; color:rgba(255,255,255,.62); margin-top:4px}
.streamer-card:hover .streamer-hover{opacity:1; transform:translateY(0)}
.streamer-info{position:absolute; left:20px; right:20px; bottom:20px; z-index:2; padding:24px; border-radius:28px; background:rgba(0,0,0,.62); border:1px solid var(--line); backdrop-filter:blur(12px); min-height:220px; display:flex; flex-direction:column}
.streamer-info h3{margin:0; font-size:28px; font-family:"Poppins",sans-serif}
.streamer-role{margin-top:8px; color:var(--green); text-transform:uppercase; letter-spacing:.18em; font-size:12px}
.streamer-tags{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; margin-bottom:18px; min-height:42px}
.streamer-tags span{padding:10px 12px; border-radius:999px; font-size:11px; text-transform:uppercase; letter-spacing:.14em; border:1px solid var(--line); background:rgba(255,255,255,.04); color:rgba(255,255,255,.72); min-width:88px; text-align:center}
.streamer-info .btn{margin-top:auto}
.case-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px}
.case-card small{display:block; color:var(--green); text-transform:uppercase; letter-spacing:.18em; font-size:12px}
.case-card h3{margin:10px 0 12px; font-size:34px; font-family:"Poppins",sans-serif}
.case-metrics{display:grid; grid-template-columns:repeat(2,1fr); gap:18px}
.metric{padding:28px; border-radius:28px}
.metric strong{display:block; color:var(--green); font-size:34px; font-family:"Poppins",sans-serif}
.metric span{display:block; margin-top:8px; color:rgba(255,255,255,.68); text-transform:uppercase; letter-spacing:.14em; font-size:12px}
.clean-logos,.logos-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:36px}
.logo-card{min-height:126px; height:126px; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:20px; padding:20px; overflow:hidden}
.logo-card img{max-width:180px; max-height:60px; width:auto; height:auto; object-fit:contain; filter:none; background:transparent; padding:0; border-radius:0}
.logo-card span{display:block; margin-top:12px; text-align:center; color:rgba(255,255,255,.72); font-size:14px}
.brand-campaign-slider{overflow:hidden; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.03); margin-top:24px; box-shadow:var(--shadow)}
.slider-track{display:flex; gap:16px; width:max-content; padding:16px 18px; animation:marqueeMove 26s linear infinite}
.campaign-pill{padding:12px 18px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid var(--line); white-space:nowrap; color:#d8d8d8}
.cta-box{margin-top:34px; display:grid; grid-template-columns:1.1fr .9fr; gap:24px; align-items:center}
.cta-actions{display:flex; flex-direction:column; align-items:flex-end; gap:14px}
.contact-grid{display:grid; grid-template-columns:.95fr 1.05fr; gap:24px}
.info-box{margin-top:18px; padding:20px; border-radius:22px; background:rgba(0,0,0,.25); border:1px solid var(--line)}
.info-box small{display:block; color:rgba(255,255,255,.45); text-transform:uppercase; letter-spacing:.20em; font-size:11px}
.info-box strong{display:block; margin-top:8px; font-size:19px}
.contact-form{display:grid; gap:16px}
.contact-form label{display:grid; gap:8px; font-size:14px; color:rgba(255,255,255,.72)}
.contact-form input,.contact-form textarea{width:100%; border:none; outline:none; border-radius:18px; padding:16px 18px; background:rgba(0,0,0,.25); color:#fff; border:1px solid var(--line); font:inherit}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(255,255,255,.25)}
.fake-success{display:none; margin-top:14px; padding:14px 16px; border-radius:16px; background:rgba(57,255,108,.12); border:1px solid rgba(57,255,108,.3); color:#c9ffd6; font-weight:600}
.fake-success.show{display:block}
.floating-contact{position:fixed; right:16px; bottom:16px; z-index:90; display:flex; flex-direction:column; gap:10px}
.floating-contact a{width:50px; height:50px; display:grid; place-items:center; border-radius:50%; background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.12); color:#fff; box-shadow:0 0 22px rgba(57,255,108,.18); backdrop-filter:blur(10px); transition:.25s ease}
.floating-contact a:hover{transform:translateY(-2px) scale(1.05); color:var(--green); border-color:rgba(57,255,108,.35)}
.site-footer{margin-top:40px; border-top:1px solid var(--line); background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.18)); color:rgba(255,255,255,.7); padding:0}
.footer-grid{display:grid; grid-template-columns:1.2fr .8fr 1fr; gap:30px; padding:48px 0 34px; align-items:start}
.footer-brand p{max-width:460px; color:rgba(255,255,255,.65)}
.footer-brand-inner{margin-bottom:16px}
.footer-links,.footer-contact{display:flex; flex-direction:column; gap:10px}
.footer-links h4,.footer-contact h4{margin:0 0 8px; font-size:18px; color:#fff}
.footer-links a,.footer-contact p{color:rgba(255,255,255,.65)}
.footer-links a:hover{color:var(--green)}
.footer-socials{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}
.footer-socials a{padding:10px 12px; border-radius:999px; background:rgba(255,255,255,.04); border:1px solid var(--line); color:rgba(255,255,255,.74)}
.footer-socials a:hover{color:var(--green); border-color:rgba(57,255,108,.35)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08); padding:18px 0 26px; color:rgba(255,255,255,.45); text-align:center}
.reveal{opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease}
.reveal.visible{opacity:1; transform:none}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pulseGlow{0%,100%{opacity:.12;transform:scale(1)}50%{opacity:.2;transform:scale(1.08)}}
@keyframes marqueeMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:1100px){
  .hero-grid,.section-head.split,.whykick-grid,.case-grid,.cta-box,.contact-grid,.footer-grid{grid-template-columns:1fr}
  .features-grid,.streamer-grid,.clean-logos,.logos-grid{grid-template-columns:repeat(2,1fr)}
  .case-metrics{grid-template-columns:repeat(2,1fr)}
  .cta-actions{align-items:flex-start}
}
@media (max-width:760px){
  .main-nav,.btn-header{display:none}
  .section{padding:70px 0}
  .container{width:min(100% - 24px, 1200px)}
  .stats-grid,.features-grid,.streamer-grid,.clean-logos,.logos-grid,.whykick-points,.case-metrics{grid-template-columns:1fr}
  .hero-copy h1{font-size:clamp(40px, 12vw, 60px)}
  .hero-visual img{height:460px}
  .hero-overlay{position:static; margin-top:16px}
  .hero-copy p{font-size:17px}
  .streamer-card{min-height:540px}
  .hero-float-card{display:none}
}


/* HARD REPLACE FIX */
.clean-logos{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:24px !important;
  margin-top:40px !important;
}
.clean-logos .logo-card{
  min-height:140px !important;
  height:140px !important;
  padding:22px 18px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}
.clean-logos .logo-card::before,
.clean-logos .logo-card::after{
  display:none !important;
  content:none !important;
}
.clean-logos .logo-card img{
  display:block !important;
  max-width:220px !important;
  max-height:70px !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.clean-logos .logo-card span{
  display:block !important;
  margin-top:12px !important;
  text-align:center !important;
  color:rgba(255,255,255,.78) !important;
  font-size:14px !important;
}
.brand-campaign-slider{
  width:100% !important;
  overflow:hidden !important;
  margin-top:26px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.03) !important;
  box-shadow:0 0 0 1px rgba(105,255,140,.10), 0 0 25px rgba(72,255,121,.10) !important;
}
.slider-track{
  display:flex !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
  gap:16px !important;
  width:max-content !important;
  white-space:nowrap !important;
  padding:16px 18px !important;
  animation:marqueeMove 24s linear infinite !important;
}
.campaign-pill{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  white-space:nowrap !important;
  flex:0 0 auto !important;
  padding:12px 18px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  color:#e7e7e7 !important;
}
@media (max-width:1100px){
  .clean-logos{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media (max-width:760px){
  .clean-logos{grid-template-columns:1fr !important;}
}


/* STABLE IMAGE-BASED REFERENCES */
.reference-board,
.reference-strip{
  overflow: hidden;
}
.reference-board{
  margin-top: 40px;
  padding: 16px;
  border-radius: 32px;
}
.reference-board::before,
.reference-board::after,
.reference-strip::before,
.reference-strip::after{
  display:none !important;
  content:none !important;
}
.reference-board img{
  display:block;
  width:100%;
  height:auto;
  border-radius:24px;
}
.reference-strip{
  margin-top:24px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  box-shadow:0 0 0 1px rgba(105,255,140,.10), 0 0 25px rgba(72,255,121,.10);
  padding:10px;
}
.reference-strip img{
  display:block;
  width:100%;
  height:auto;
  border-radius:999px;
}


/* SPEED OPTIMIZED OVERRIDES */
.bg-orb{filter:blur(45px)!important; opacity:.09!important; animation:none!important}
.site-header{backdrop-filter:blur(8px)!important}
.card-glass{backdrop-filter:blur(8px)!important; -webkit-backdrop-filter:blur(8px)!important}
.hero-visual{box-shadow:0 0 0 1px rgba(105,255,140,.10),0 0 18px rgba(72,255,121,.10)!important}
.hero-visual img{animation:none!important}
.hero-float-card{display:none!important}
.reveal{opacity:1!important; transform:none!important; transition:none!important}
.streamer-card:hover{transform:none!important; box-shadow:var(--shadow)!important}
.streamer-card > img{transition:none!important}
.streamer-card:hover > img{transform:none!important}
.main-nav a::after{transition:none!important}
.floating-contact a{box-shadow:none!important}
.brand-campaign-slider,.reference-board,.reference-strip{display:none!important}
.marquee-shell{margin-top:38px}
.marquee-row{
  overflow:hidden!important;
  width:100%!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(255,255,255,.03)!important;
}
.marquee-track{
  display:inline-flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:14px!important;
  white-space:nowrap!important;
  width:max-content!important;
  min-width:max-content!important;
  padding:16px 18px!important;
  animation:textMarqueeMove 24s linear infinite!important;
}
.marquee-pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:11px 16px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.05)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  color:#ececec!important;
  font-size:14px!important;
}
@keyframes textMarqueeMove{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}