|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>TMT - Traffic Monsters Team</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap"> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
:root { |
|
|
--bg-dark: #0B0B0F; |
|
|
--accent: #13FFAA; |
|
|
--secondary: #4477FF; |
|
|
} |
|
|
|
|
|
body { |
|
|
font-family: 'Space Grotesk', sans-serif; |
|
|
background-color: var(--bg-dark); |
|
|
color: white; |
|
|
overflow-x: hidden; |
|
|
} |
|
|
|
|
|
.inter-font { |
|
|
font-family: 'Inter', sans-serif; |
|
|
} |
|
|
|
|
|
.glow-text { |
|
|
text-shadow: 0 0 8px rgba(19, 255, 170, 0.6); |
|
|
} |
|
|
|
|
|
.glow-box { |
|
|
box-shadow: 0 0 15px rgba(19, 255, 170, 0.3); |
|
|
} |
|
|
|
|
|
.border-glow { |
|
|
box-shadow: 0 0 10px rgba(19, 255, 170, 0.5); |
|
|
} |
|
|
|
|
|
.grid-bg { |
|
|
background-image: |
|
|
linear-gradient(rgba(68, 119, 255, 0.1) 1px, transparent 1px), |
|
|
linear-gradient(90deg, rgba(68, 119, 255, 0.1) 1px, transparent 1px); |
|
|
background-size: 40px 40px; |
|
|
} |
|
|
|
|
|
.data-stream { |
|
|
position: absolute; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background: linear-gradient(180deg, rgba(11,11,15,0) 0%, rgba(19,255,170,0.1) 50%, rgba(11,11,15,0) 100%); |
|
|
animation: stream 8s linear infinite; |
|
|
opacity: 0.3; |
|
|
} |
|
|
|
|
|
@keyframes stream { |
|
|
0% { transform: translateY(-100%); } |
|
|
100% { transform: translateY(100%); } |
|
|
} |
|
|
|
|
|
.card-hover { |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.card-hover:hover { |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 10px 25px rgba(19, 255, 170, 0.2); |
|
|
} |
|
|
|
|
|
.glitch-effect { |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
.glitch-effect::before, .glitch-effect::after { |
|
|
content: attr(data-text); |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background: var(--bg-dark); |
|
|
} |
|
|
|
|
|
.glitch-effect::before { |
|
|
left: 2px; |
|
|
text-shadow: -2px 0 #ff00c1; |
|
|
clip: rect(44px, 450px, 56px, 0); |
|
|
animation: glitch-anim 5s infinite linear alternate-reverse; |
|
|
} |
|
|
|
|
|
.glitch-effect::after { |
|
|
left: -2px; |
|
|
text-shadow: -2px 0 #00fff9, 2px 2px #ff00c1; |
|
|
clip: rect(44px, 450px, 56px, 0); |
|
|
animation: glitch-anim2 5s infinite linear alternate-reverse; |
|
|
} |
|
|
|
|
|
@keyframes glitch-anim { |
|
|
0% { clip: rect(31px, 9999px, 94px, 0); } |
|
|
10% { clip: rect(112px, 9999px, 76px, 0); } |
|
|
20% { clip: rect(85px, 9999px, 77px, 0); } |
|
|
30% { clip: rect(27px, 9999px, 97px, 0); } |
|
|
40% { clip: rect(64px, 9999px, 98px, 0); } |
|
|
50% { clip: rect(61px, 9999px, 85px, 0); } |
|
|
60% { clip: rect(99px, 9999px, 114px, 0); } |
|
|
70% { clip: rect(34px, 9999px, 115px, 0); } |
|
|
80% { clip: rect(98px, 9999px, 129px, 0); } |
|
|
90% { clip: rect(43px, 9999px, 96px, 0); } |
|
|
100% { clip: rect(82px, 9999px, 64px, 0); } |
|
|
} |
|
|
|
|
|
@keyframes glitch-anim2 { |
|
|
0% { clip: rect(65px, 9999px, 119px, 0); } |
|
|
10% { clip: rect(79px, 9999px, 85px, 0); } |
|
|
20% { clip: rect(74px, 9999px, 79px, 0); } |
|
|
30% { clip: rect(116px, 9999px, 113px, 0); } |
|
|
40% { clip: rect(90px, 9999px, 72px, 0); } |
|
|
50% { clip: rect(98px, 9999px, 102px, 0); } |
|
|
60% { clip: rect(59px, 9999px, 108px, 0); } |
|
|
70% { clip: rect(92px, 9999px, 76px, 0); } |
|
|
80% { clip: rect(106px, 9999px, 99px, 0); } |
|
|
90% { clip: rect(115px, 9999px, 120px, 0); } |
|
|
100% { clip: rect(114px, 9999px, 103px, 0); } |
|
|
} |
|
|
|
|
|
.counter { |
|
|
font-size: 3.5rem; |
|
|
font-weight: 700; |
|
|
color: var(--accent); |
|
|
} |
|
|
|
|
|
.cursor-trail { |
|
|
position: fixed; |
|
|
width: 20px; |
|
|
height: 20px; |
|
|
border-radius: 50%; |
|
|
background: rgba(19, 255, 170, 0.3); |
|
|
pointer-events: none; |
|
|
transform: translate(-50%, -50%); |
|
|
z-index: 9999; |
|
|
mix-blend-mode: screen; |
|
|
} |
|
|
|
|
|
.scroll-indicator { |
|
|
position: absolute; |
|
|
bottom: 30px; |
|
|
left: 50%; |
|
|
transform: translateX(-50%); |
|
|
animation: bounce 2s infinite; |
|
|
} |
|
|
|
|
|
@keyframes bounce { |
|
|
0%, 20%, 50%, 80%, 100% { transform: translateY(0) translateX(-50%); } |
|
|
40% { transform: translateY(-20px) translateX(-50%); } |
|
|
60% { transform: translateY(-10px) translateX(-50%); } |
|
|
} |
|
|
|
|
|
.case-study-card { |
|
|
min-width: 320px; |
|
|
background: rgba(11, 11, 15, 0.7); |
|
|
backdrop-filter: blur(10px); |
|
|
border: 1px solid rgba(68, 119, 255, 0.2); |
|
|
} |
|
|
|
|
|
.team-card { |
|
|
background: rgba(11, 11, 15, 0.6); |
|
|
border: 1px solid rgba(68, 119, 255, 0.1); |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.team-card:hover { |
|
|
border-color: var(--accent); |
|
|
transform: translateY(-5px); |
|
|
} |
|
|
|
|
|
.partner-logo { |
|
|
filter: grayscale(100%) brightness(0.5); |
|
|
transition: all 0.3s ease; |
|
|
opacity: 0.7; |
|
|
} |
|
|
|
|
|
.partner-logo:hover { |
|
|
filter: grayscale(0%) brightness(1); |
|
|
opacity: 1; |
|
|
} |
|
|
|
|
|
.scrollbar-hide::-webkit-scrollbar { |
|
|
display: none; |
|
|
} |
|
|
|
|
|
.scrollbar-hide { |
|
|
-ms-overflow-style: none; |
|
|
scrollbar-width: none; |
|
|
} |
|
|
|
|
|
.team-scroll { |
|
|
scroll-snap-type: x mandatory; |
|
|
} |
|
|
|
|
|
.team-item { |
|
|
scroll-snap-align: start; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="relative"> |
|
|
|
|
|
<div id="cursor-trail" class="cursor-trail hidden md:block"></div> |
|
|
|
|
|
|
|
|
<section class="relative h-screen overflow-hidden grid-bg flex items-center justify-center"> |
|
|
<div class="absolute inset-0 overflow-hidden"> |
|
|
<div class="data-stream"></div> |
|
|
<div class="absolute inset-0 bg-gradient-to-b from-transparent via-transparent to-black opacity-30"></div> |
|
|
</div> |
|
|
|
|
|
<div class="container mx-auto px-6 relative z-10 text-center"> |
|
|
<h1 class="text-5xl md:text-7xl font-bold mb-4 glow-text"> |
|
|
<span class="glitch-effect" data-text="TRAFFIC MONSTERS TEAM">TRAFFIC MONSTERS TEAM</span> |
|
|
</h1> |
|
|
<p class="text-xl md:text-2xl mb-10 inter-font max-w-2xl mx-auto"> |
|
|
Elite arbitrage unit. We scale what others fear to touch. |
|
|
</p> |
|
|
<div class="flex flex-col sm:flex-row gap-4 justify-center"> |
|
|
<a href="#" class="px-8 py-3 bg-transparent border-2 border-accent text-accent font-bold rounded-none hover:bg-accent hover:text-black transition-all duration-300 glow-box"> |
|
|
<i class="fab fa-telegram mr-2"></i> Talk via Telegram |
|
|
</a> |
|
|
<a href="#case-studies" class="px-8 py-3 bg-transparent border-2 border-secondary text-white font-bold rounded-none hover:bg-secondary transition-all duration-300"> |
|
|
See Case Studies |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="scroll-indicator"> |
|
|
<svg width="30px" height="30px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> |
|
|
<path d="M7 10L12 15L17 10" stroke="#13FFAA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> |
|
|
</svg> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-16 text-center glow-text"> |
|
|
<span class="border-b-2 border-accent pb-2">What We Do</span> |
|
|
</h2> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> |
|
|
|
|
|
<div class="card-hover p-6 bg-black bg-opacity-50 border border-gray-800 rounded-none relative overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-accent opacity-10"></div> |
|
|
<div class="relative z-10"> |
|
|
<div class="w-12 h-12 mb-4 flex items-center justify-center bg-accent bg-opacity-20 text-accent"> |
|
|
<i class="fas fa-chess-queen text-xl"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-3">Strategic Offer Selection</h3> |
|
|
<p class="text-gray-300 inter-font"> |
|
|
Identifying high-potential offers with the perfect balance of payout, conversion potential, and scalability. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover p-6 bg-black bg-opacity-50 border border-gray-800 rounded-none relative overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-secondary opacity-10"></div> |
|
|
<div class="relative z-10"> |
|
|
<div class="w-12 h-12 mb-4 flex items-center justify-center bg-secondary bg-opacity-20 text-secondary"> |
|
|
<i class="fas fa-rocket text-xl"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-3">Paid Traffic Scaling</h3> |
|
|
<p class="text-gray-300 inter-font"> |
|
|
Dominating FB, TikTok, Push, Pop, Native with proprietary scaling methods that bypass common bottlenecks. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover p-6 bg-black bg-opacity-50 border border-gray-800 rounded-none relative overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-accent opacity-10"></div> |
|
|
<div class="relative z-10"> |
|
|
<div class="w-12 h-12 mb-4 flex items-center justify-center bg-accent bg-opacity-20 text-accent"> |
|
|
<i class="fas fa-project-diagram text-xl"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-3">Full-Funnel Engineering</h3> |
|
|
<p class="text-gray-300 inter-font"> |
|
|
From lander → app → monetization, we architect complete conversion systems that print at scale. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover p-6 bg-black bg-opacity-50 border border-gray-800 rounded-none relative overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-secondary opacity-10"></div> |
|
|
<div class="relative z-10"> |
|
|
<div class="w-12 h-12 mb-4 flex items-center justify-center bg-secondary bg-opacity-20 text-secondary"> |
|
|
<i class="fas fa-chart-line text-xl"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-3">Advanced Analytics</h3> |
|
|
<p class="text-gray-300 inter-font"> |
|
|
Keitaro masters, API feeds, postback control - we see the numbers before they happen. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover p-6 bg-black bg-opacity-50 border border-gray-800 rounded-none relative overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-accent opacity-10"></div> |
|
|
<div class="relative z-10"> |
|
|
<div class="w-12 h-12 mb-4 flex items-center justify-center bg-accent bg-opacity-20 text-accent"> |
|
|
<i class="fas fa-film text-xl"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-3">In-House Creative Production</h3> |
|
|
<p class="text-gray-300 inter-font"> |
|
|
UGC, video editing, deepfake tools - we create assets that convert at 3-5x industry average. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="card-hover p-6 bg-black bg-opacity-50 border border-gray-800 rounded-none relative overflow-hidden"> |
|
|
<div class="absolute inset-0 bg-gradient-to-br from-transparent via-transparent to-secondary opacity-10"></div> |
|
|
<div class="relative z-10"> |
|
|
<div class="w-12 h-12 mb-4 flex items-center justify-center bg-secondary bg-opacity-20 text-secondary"> |
|
|
<i class="fas fa-handshake text-xl"></i> |
|
|
</div> |
|
|
<h3 class="text-xl font-bold mb-3">Direct Advertiser Relations</h3> |
|
|
<p class="text-gray-300 inter-font"> |
|
|
We work directly with product owners to create custom monetization strategies. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 bg-gradient-to-b from-black to-gray-900 relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-16 text-center glow-text"> |
|
|
<span class="border-b-2 border-accent pb-2">By The Numbers</span> |
|
|
</h2> |
|
|
|
|
|
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center"> |
|
|
|
|
|
<div class="mb-8"> |
|
|
<div class="counter mb-2" data-target="5">0</div> |
|
|
<p class="text-lg uppercase tracking-wider">Million+ in managed spend</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mb-8"> |
|
|
<div class="counter mb-2" data-target="200">0</div> |
|
|
<p class="text-lg uppercase tracking-wider">Live offers</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mb-8"> |
|
|
<div class="counter mb-2" data-target="70">0</div> |
|
|
<p class="text-lg uppercase tracking-wider">Specialists globally</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="mb-8"> |
|
|
<div class="counter mb-2" data-target="15">0</div> |
|
|
<p class="text-lg uppercase tracking-wider">Traffic platforms mastered</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mt-16 grid grid-cols-1 md:grid-cols-2 gap-8"> |
|
|
|
|
|
<div class="bg-black bg-opacity-50 p-6 border border-gray-800"> |
|
|
<h3 class="text-xl font-bold mb-4 text-accent">Monthly Ad Spend Growth</h3> |
|
|
<div class="h-64 bg-gray-900 flex items-center justify-center"> |
|
|
<div class="w-full h-48 relative"> |
|
|
<div class="absolute bottom-0 left-0 w-1/5 h-3/4 bg-accent"></div> |
|
|
<div class="absolute bottom-0 left-1/5 w-1/5 h-full bg-accent"></div> |
|
|
<div class="absolute bottom-0 left-2/5 w-1/5 h-5/6 bg-accent"></div> |
|
|
<div class="absolute bottom-0 left-3/5 w-1/5 h-2/3 bg-accent"></div> |
|
|
<div class="absolute bottom-0 left-4/5 w-1/5 h-1/2 bg-accent"></div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-black bg-opacity-50 p-6 border border-gray-800"> |
|
|
<h3 class="text-xl font-bold mb-4 text-secondary">Platform Distribution</h3> |
|
|
<div class="h-64 bg-gray-900 flex items-center justify-center"> |
|
|
<div class="w-48 h-48 rounded-full relative"> |
|
|
<div class="absolute inset-0 border-4 border-accent rounded-full" style="clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%);"></div> |
|
|
<div class="absolute inset-0 border-4 border-secondary rounded-full" style="clip-path: polygon(0 35%, 100% 35%, 100% 65%, 0 65%);"></div> |
|
|
<div class="absolute inset-0 border-4 border-accent rounded-full" style="clip-path: polygon(0 65%, 100% 65%, 100% 100%, 0 100%);"></div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section id="case-studies" class="py-20 relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-16 text-center glow-text"> |
|
|
<span class="border-b-2 border-accent pb-2">Case Studies</span> |
|
|
</h2> |
|
|
|
|
|
<div class="flex overflow-x-auto pb-10 -mx-6 px-6 scrollbar-hide"> |
|
|
<div class="flex space-x-6"> |
|
|
|
|
|
<div class="case-study-card p-6 flex-shrink-0"> |
|
|
<div class="flex justify-between items-start mb-4"> |
|
|
<h3 class="text-xl font-bold text-accent">TikTok Gambling</h3> |
|
|
<span class="bg-gray-800 px-2 py-1 text-xs">SEA GEO</span> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<p class="text-sm text-gray-400 mb-2">Vertical: Gambling</p> |
|
|
<p class="text-sm text-gray-400 mb-2">Strategy: UGC Creatives → Whitelabel App → Custom Lander</p> |
|
|
</div> |
|
|
<div class="grid grid-cols-3 gap-2 mb-4"> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CTR</p> |
|
|
<p class="font-bold text-accent">4.8%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CR</p> |
|
|
<p class="font-bold text-accent">12%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">ROI</p> |
|
|
<p class="font-bold text-accent">137%</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-chart-line text-3xl text-accent"></i> |
|
|
</div> |
|
|
<div class="text-xs text-gray-500"> |
|
|
<p>Scaled to $120k/day before platform policy changes</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="case-study-card p-6 flex-shrink-0"> |
|
|
<div class="flex justify-between items-start mb-4"> |
|
|
<h3 class="text-xl font-bold text-secondary">Facebook Nutra</h3> |
|
|
<span class="bg-gray-800 px-2 py-1 text-xs">Tier 1</span> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<p class="text-sm text-gray-400 mb-2">Vertical: Nutra</p> |
|
|
<p class="text-sm text-gray-400 mb-2">Strategy: Quiz Funnel → VSL → Upsell Flow</p> |
|
|
</div> |
|
|
<div class="grid grid-cols-3 gap-2 mb-4"> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CTR</p> |
|
|
<p class="font-bold text-secondary">3.2%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CR</p> |
|
|
<p class="font-bold text-secondary">8.5%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">ROI</p> |
|
|
<p class="font-bold text-secondary">89%</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-chart-pie text-3xl text-secondary"></i> |
|
|
</div> |
|
|
<div class="text-xs text-gray-500"> |
|
|
<p>Stable 5:1 ROAS across 14 countries</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="case-study-card p-6 flex-shrink-0"> |
|
|
<div class="flex justify-between items-start mb-4"> |
|
|
<h3 class="text-xl font-bold text-accent">Push Finance</h3> |
|
|
<span class="bg-gray-800 px-2 py-1 text-xs">Tier 3</span> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<p class="text-sm text-gray-400 mb-2">Vertical: Finance</p> |
|
|
<p class="text-sm text-gray-400 mb-2">Strategy: Fear-Based Creatives → One-Click Flow</p> |
|
|
</div> |
|
|
<div class="grid grid-cols-3 gap-2 mb-4"> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CTR</p> |
|
|
<p class="font-bold text-accent">1.8%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CR</p> |
|
|
<p class="font-bold text-accent">22%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">ROI</p> |
|
|
<p class="font-bold text-accent">210%</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-chart-bar text-3xl text-accent"></i> |
|
|
</div> |
|
|
<div class="text-xs text-gray-500"> |
|
|
<p>Profit margin maintained at 65% for 9 months</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="case-study-card p-6 flex-shrink-0"> |
|
|
<div class="flex justify-between items-start mb-4"> |
|
|
<h3 class="text-xl font-bold text-secondary">UAC Utilities</h3> |
|
|
<span class="bg-gray-800 px-2 py-1 text-xs">Global</span> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<p class="text-sm text-gray-400 mb-2">Vertical: Utilities</p> |
|
|
<p class="text-sm text-gray-400 mb-2">Strategy: App Install → Subscription Model</p> |
|
|
</div> |
|
|
<div class="grid grid-cols-3 gap-2 mb-4"> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CTR</p> |
|
|
<p class="font-bold text-secondary">2.1%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">CR</p> |
|
|
<p class="font-bold text-secondary">15%</p> |
|
|
</div> |
|
|
<div class="bg-gray-900 p-2 text-center"> |
|
|
<p class="text-xs text-gray-400">ROI</p> |
|
|
<p class="font-bold text-secondary">75%</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-mobile-alt text-3xl text-secondary"></i> |
|
|
</div> |
|
|
<div class="text-xs text-gray-500"> |
|
|
<p>LTV:CAC ratio of 4.3x at scale</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 bg-gradient-to-b from-gray-900 to-black relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-16 text-center glow-text"> |
|
|
<span class="border-b-2 border-accent pb-2">The Unit</span> |
|
|
</h2> |
|
|
|
|
|
<div class="flex overflow-x-auto pb-10 -mx-6 px-6 scrollbar-hide team-scroll"> |
|
|
<div class="flex space-x-6"> |
|
|
|
|
|
<div class="team-card p-6 flex-shrink-0 team-item" style="min-width: 280px;"> |
|
|
<div class="mb-4"> |
|
|
<h3 class="text-xl font-bold text-accent mb-1">@bm_architect</h3> |
|
|
<p class="text-sm text-gray-400">48 business managers in rotation</p> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-user-secret text-4xl text-accent"></i> |
|
|
</div> |
|
|
<p class="text-sm text-gray-300 inter-font"> |
|
|
Structures accounts that survive 6-9 months before replacement needed. Specializes in cloaking patterns that evade ML detection. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="team-card p-6 flex-shrink-0 team-item" style="min-width: 280px;"> |
|
|
<div class="mb-4"> |
|
|
<h3 class="text-xl font-bold text-secondary mb-1">@tiktok_splicer</h3> |
|
|
<p class="text-sm text-gray-400">12 creatives → 180k$ payout</p> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-cut text-4xl text-secondary"></i> |
|
|
</div> |
|
|
<p class="text-sm text-gray-300 inter-font"> |
|
|
Video editing savant who creates 50-70 variants daily. CTRs consistently 40-60% above network averages. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="team-card p-6 flex-shrink-0 team-item" style="min-width: 280px;"> |
|
|
<div class="mb-4"> |
|
|
<h3 class="text-xl font-bold text-accent mb-1">@roi_ripper</h3> |
|
|
<p class="text-sm text-gray-400">Scaling UAC in Tier 3 for finance</p> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-bolt text-4xl text-accent"></i> |
|
|
</div> |
|
|
<p class="text-sm text-gray-300 inter-font"> |
|
|
Turns $5k/day into $8k/day like clockwork. Specializes in finding the exact scaling ceiling for each vertical. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="team-card p-6 flex-shrink-0 team-item" style="min-width: 280px;"> |
|
|
<div class="mb-4"> |
|
|
<h3 class="text-xl font-bold text-secondary mb-1">@data_ghost</h3> |
|
|
<p class="text-sm text-gray-400">Postback whisperer</p> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-ghost text-4xl text-secondary"></i> |
|
|
</div> |
|
|
<p class="text-sm text-gray-300 inter-font"> |
|
|
Makes tracking systems sing. Reduces data discrepancies from 15-20% to 3-5% across all platforms. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="team-card p-6 flex-shrink-0 team-item" style="min-width: 280px;"> |
|
|
<div class="mb-4"> |
|
|
<h3 class="text-xl font-bold text-accent mb-1">@cloak_smith</h3> |
|
|
<p class="text-sm text-gray-400">Anti-detection systems</p> |
|
|
</div> |
|
|
<div class="h-32 bg-gray-900 mb-4 flex items-center justify-center"> |
|
|
<i class="fas fa-shield-alt text-4xl text-accent"></i> |
|
|
</div> |
|
|
<p class="text-sm text-gray-300 inter-font"> |
|
|
Builds custom cloaking solutions that extend campaign lifespan by 3-4x compared to commercial solutions. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="flex flex-col md:flex-row items-center gap-12"> |
|
|
<div class="md:w-1/3 flex justify-center"> |
|
|
<div class="w-64 h-64 bg-gray-900 border-2 border-accent relative overflow-hidden"> |
|
|
|
|
|
<div class="absolute inset-0 flex items-center justify-center"> |
|
|
<i class="fas fa-user-tie text-6xl text-accent"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="md:w-2/3"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-6 glow-text">Timur</h2> |
|
|
<p class="text-xl mb-6 inter-font"> |
|
|
Founder of TMT. Architect of high-scale arbitrage systems. Known for structuring teams that convert performance into infrastructure. |
|
|
</p> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="#" class="w-10 h-10 bg-gray-900 flex items-center justify-center border border-gray-800 hover:border-accent transition-all duration-300"> |
|
|
<i class="fab fa-instagram text-accent"></i> |
|
|
</a> |
|
|
<a href="#" class="w-10 h-10 bg-gray-900 flex items-center justify-center border border-gray-800 hover:border-accent transition-all duration-300"> |
|
|
<i class="fab fa-youtube text-accent"></i> |
|
|
</a> |
|
|
<a href="#" class="w-10 h-10 bg-gray-900 flex items-center justify-center border border-gray-800 hover:border-accent transition-all duration-300"> |
|
|
<i class="fab fa-telegram text-accent"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 bg-gradient-to-b from-black to-gray-900 relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-16 text-center glow-text"> |
|
|
<span class="border-b-2 border-accent pb-2">Partners & Verticals</span> |
|
|
</h2> |
|
|
|
|
|
<div class="grid grid-cols-2 md:grid-cols-5 gap-8 mb-16"> |
|
|
|
|
|
<div class="flex items-center justify-center p-6 bg-gray-900 border border-gray-800 partner-logo hover:border-accent"> |
|
|
<span class="text-xl font-bold">GAMBLING</span> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex items-center justify-center p-6 bg-gray-900 border border-gray-800 partner-logo hover:border-accent"> |
|
|
<span class="text-xl font-bold">BETTING</span> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex items-center justify-center p-6 bg-gray-900 border border-gray-800 partner-logo hover:border-accent"> |
|
|
<span class="text-xl font-bold">NUTRA</span> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex items-center justify-center p-6 bg-gray-900 border border-gray-800 partner-logo hover:border-accent"> |
|
|
<span class="text-xl font-bold">FINANCE</span> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="flex items-center justify-center p-6 bg-gray-900 border border-gray-800 partner-logo hover:border-accent"> |
|
|
<span class="text-xl font-bold">UTILITIES</span> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="max-w-3xl mx-auto text-center"> |
|
|
<blockquote class="text-lg italic mb-6 inter-font"> |
|
|
"TMT doesn't just run traffic - they architect complete monetization systems. Their ability to maintain profitability at scale is unmatched in our network." |
|
|
</blockquote> |
|
|
<p class="text-accent font-bold">— Senior Partner Manager, Top 3 CPA Network</p> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-20 relative overflow-hidden"> |
|
|
<div class="container mx-auto px-6 text-center"> |
|
|
<h2 class="text-3xl md:text-4xl font-bold mb-6 glow-text"> |
|
|
Let's not talk theory. Let's talk numbers. |
|
|
</h2> |
|
|
<p class="text-xl mb-10 inter-font max-w-2xl mx-auto"> |
|
|
Have volume? Need control? Connect with our scaling team. |
|
|
</p> |
|
|
<a href="#" class="px-10 py-4 bg-accent text-black font-bold rounded-none hover:bg-transparent hover:text-accent border-2 border-accent transition-all duration-300 inline-block"> |
|
|
<i class="fab fa-telegram mr-2"></i> Connect via Telegram |
|
|
</a> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<footer class="py-10 border-t border-gray-800"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="flex flex-col md:flex-row justify-between items-center"> |
|
|
<div class="mb-4 md:mb-0"> |
|
|
<p class="text-gray-500 inter-font">© TMT — Built for real scale.</p> |
|
|
</div> |
|
|
<div class="flex space-x-6"> |
|
|
<a href="#" class="text-gray-500 hover:text-accent transition-all duration-300"> |
|
|
<i class="fab fa-telegram text-xl"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-500 hover:text-accent transition-all duration-300"> |
|
|
<i class="fab fa-instagram text-xl"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-500 hover:text-accent transition-all duration-300"> |
|
|
<i class="fab fa-youtube text-xl"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
<script> |
|
|
|
|
|
const counters = document.querySelectorAll('.counter'); |
|
|
const speed = 200; |
|
|
|
|
|
function animateCounters() { |
|
|
counters.forEach(counter => { |
|
|
const target = +counter.getAttribute('data-target'); |
|
|
const count = +counter.innerText; |
|
|
const increment = target / speed; |
|
|
|
|
|
if(count < target) { |
|
|
counter.innerText = Math.ceil(count + increment); |
|
|
setTimeout(animateCounters, 1); |
|
|
} else { |
|
|
counter.innerText = target + '+'; |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
function isInViewport(element) { |
|
|
const rect = element.getBoundingClientRect(); |
|
|
return ( |
|
|
rect.top <= (window.innerHeight || document.documentElement.clientHeight) && |
|
|
rect.bottom >= 0 |
|
|
); |
|
|
} |
|
|
|
|
|
|
|
|
window.addEventListener('scroll', function() { |
|
|
const numbersSection = document.querySelector('.counter'); |
|
|
if(isInViewport(numbersSection)) { |
|
|
animateCounters(); |
|
|
|
|
|
window.removeEventListener('scroll', this); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
const cursor = document.getElementById('cursor-trail'); |
|
|
|
|
|
if(cursor) { |
|
|
document.addEventListener('mousemove', function(e) { |
|
|
cursor.style.left = e.clientX + 'px'; |
|
|
cursor.style.top = e.clientY + 'px'; |
|
|
cursor.classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
document.addEventListener('mouseleave', function() { |
|
|
cursor.classList.add('hidden'); |
|
|
}); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
const scrollToTop = document.createElement('div'); |
|
|
scrollToTop.innerHTML = '<i class="fas fa-arrow-up text-accent"></i>'; |
|
|
scrollToTop.style.position = 'fixed'; |
|
|
scrollToTop.style.bottom = '30px'; |
|
|
scrollToTop.style.right = '30px'; |
|
|
scrollToTop.style.width = '50px'; |
|
|
scrollToTop.style.height = '50px'; |
|
|
scrollToTop.style.backgroundColor = 'rgba(11, 11, 15, 0.8)'; |
|
|
scrollToTop.style.border = '1px solid #13FFAA'; |
|
|
scrollToTop.style.borderRadius = '50%'; |
|
|
scrollToTop.style.display = 'flex'; |
|
|
scrollToTop.style.alignItems = 'center'; |
|
|
scrollToTop.style.justifyContent = 'center'; |
|
|
scrollToTop.style.cursor = 'pointer'; |
|
|
scrollToTop.style.zIndex = '999'; |
|
|
scrollToTop.style.opacity = '0'; |
|
|
scrollToTop.style.transition = 'opacity 0.3s'; |
|
|
|
|
|
document.body.appendChild(scrollToTop); |
|
|
|
|
|
window.addEventListener('scroll', function() { |
|
|
if(window.pageYOffset > 300) { |
|
|
scrollToTop.style.opacity = '1'; |
|
|
} else { |
|
|
scrollToTop.style.opacity = '0'; |
|
|
} |
|
|
}); |
|
|
|
|
|
scrollToTop.addEventListener('click', function() { |
|
|
window.scrollTo({ |
|
|
top: 0, |
|
|
behavior: 'smooth' |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=timoon811/tmt0112" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
