commit a3d370283c21a4046a0ffb152358ea16b68d90bc Author: amitrana01 Date: Thu Jan 22 11:44:52 2026 +0530 feat: Initialize Netcop Technologies website with core pages, styling, scripts, and assets. diff --git a/Netcop Logo.png b/Netcop Logo.png new file mode 100644 index 0000000..829dbf1 Binary files /dev/null and b/Netcop Logo.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..7bf615b --- /dev/null +++ b/index.html @@ -0,0 +1,230 @@ + + + + + + + Netcop Technologies | Make Your Business Systems Smarter + + + + + + + +
+
+ + + +
+
+ +
+ +
+
+

Make Your Business Systems Smarter. Not More Complicated.

+

Netcop helps growing businesses design, connect, and + manage their systems — using automation and AI where it actually makes sense.

+

We take ownership of how your systems work, so you can + focus on running your business.

+
+ 👉 Start with a Free Discovery Call +
+
+
+ + +
+
+
+

Why Technology Feels Like a Burden for Most Businesses

+

Most businesses already use software, tools, and platforms. Yet they still + struggle because:

+
    +
  • Nothing is properly connected
    • +
  • Processes are unclear or undocumented
    • +
  • Teams depend on individuals, not systems
    • +
  • AI tools are used randomly or incorrectly
    • +
  • When something breaks, no one truly owns it
    • +
+

Technology was supposed to help — instead it creates confusion.

+
+
+
+ + +
+
+

We Don’t Sell Software. We Take Responsibility.

+
+

Netcop is a Business Systems & Operations Partner. We don’t push tools, platforms, or buzzwords. +

+

We design and manage systems that support real workflows — and we stay accountable for how they + perform over time.

+

Automation and AI are used + only where they add clarity, speed, or insight.

+
+
+
+ + +
+
+

Our Simple 4-Step Approach

+
+
+

1. Understand

+

We study how your business actually runs — sales, operations, finance, and decision-making. +

+ No assumptions. No generic templates. +
+
+

2. Design

+

We design a clear system flow: What should be automated, what should stay human, and where AI + helps.

+ Business logic first. Technology second. +
+
+

3. Build

+

We connect tools, automate workflows, set up reporting, and ensure everything works in + real-world usage.

+ Practical systems, not demos. +
+
+

4. Run & Improve

+

We take ongoing ownership: Monitoring, Support, Improvements, and AI tuning.

+ One partner. One responsibility. +
+
+
+
+ + +
+
+

What Netcop Helps You Achieve

+
    +
  • ✔ Systems that talk to each other
    • +
  • ✔ Less manual work
    • +
  • ✔ Better visibility & decision-making
    • +
  • ✔ Responsible use of automation & AI
    • +
  • ✔ Reduced dependency on individuals
    • +
  • ✔ Long-term stability as you grow
    • +
+
+
+ + +
+
+

Who Netcop Is Built For

+
+

Netcop works best with:

+
    +
  • Small & mid-sized businesses
    • +
  • Founders overwhelmed by tools & automation
    • +
  • Teams experimenting with AI but lacking structure
    • +
  • Businesses without a dedicated systems owner
    • +
+

If your systems feel fragile, messy, or unclear — we can + help.

+
+
+
+ + +
+
+

Our View on AI + (Honest & Practical)

+
+

AI is powerful — but only when used + responsibly. At Netcop:

+
    +
  • + AI supports people, it doesn’t replace them
    • +
  • + Automation is reviewed, not blindly trusted
    • +
  • + Decisions remain explainable
    • +
  • + Systems stay under human control
    • +
+

AI + should reduce stress, not create new risks.

+
+
+
+ + +
+
+

Why Businesses Choose Netcop

+
+
Platform-agnostic approach
+
Business-first thinking
+
Clear ownership & accountability
+
Simple language, no hype
+
Founder-led engagement
+
+
+

You don’t need more tools.

+

You need systems that work.

+
+
+
+ + +
+
+

Ready to Bring Clarity to Your Systems?

+

Let’s start with a conversation — no sales pitch, no + buzzwords.

+
+ 👉 Book a Discovery Call +
+
+
+
+ + + + + + + \ No newline at end of file diff --git a/logo.png b/logo.png new file mode 100644 index 0000000..60546f3 Binary files /dev/null and b/logo.png differ diff --git a/plan.md b/plan.md new file mode 100644 index 0000000..d6f3c6d --- /dev/null +++ b/plan.md @@ -0,0 +1,177 @@ +SECTION 1: HERO (Above the Fold) +Headline + +Take Control of Your Business Systems. + +Sub-headline + +We help growing businesses design, connect, and manage their systems so technology supports growth — not confusion. + +Supporting Line + +One partner. One framework. Full ownership. + +Primary CTA + +👉 Book a Discovery Call + +Secondary CTA + +👉 Talk to Netcop + +SECTION 2: THE PROBLEM (Relatability First) +Headline + +Why Most Business Systems Fail + +Copy + +Most businesses don’t struggle because they lack software. +They struggle because: + +Tools don’t talk to each other + +Processes exist only in people’s heads + +Everything breaks when one person leaves + +No one owns the system end-to-end + +Technology becomes a daily headache + +You end up managing systems instead of running your business. + +SECTION 3: YOUR POSITIONING (DIFFERENTIATION) +Headline + +We Don’t Sell Tools. We Take Ownership. + +Copy + +Netcop is a Business Systems Partner, not a software vendor or IT support desk. + +We take responsibility for how your systems are: + +Understood + +Designed + +Connected + +And run — long-term + +You get clarity, control, and peace of mind — not another tool. + +SECTION 4: HOW NETCOP WORKS (CORE FRAMEWORK) +Headline + +How Netcop Works + +Step 1 — Discover + +We understand how your business actually operates — sales, operations, finance, and support. + +No assumptions. No generic solutions. + +Step 2 — Design + +We design a clear system flow tailored to your business — what to automate, what to simplify, and what to control. + +Business-first, tool-second. + +Step 3 — Implement + +We connect and configure the required systems, train your team, and ensure everything works in real scenarios. + +Practical execution, not theory. + +Step 4 — Own + +We take ongoing responsibility — monitoring, support, improvements, and coordination. + +One call. One owner. Zero chaos. + +SECTION 5: WHO THIS IS FOR +Headline + +Who We Work With + +Copy + +Netcop works best with: + +Small & mid-sized businesses + +Growing companies without an internal systems team + +Founders tired of tool overload + +Businesses that want long-term stability, not quick fixes + +If your systems feel messy or fragile — Netcop is for you. + +SECTION 6: BENEFITS (OUTCOMES, NOT FEATURES) +Headline + +What You Gain + +✔ Clear ownership of systems +✔ Fewer manual errors +✔ Better visibility & reporting +✔ Reduced dependency on individuals +✔ Systems that scale with growth +✔ Less stress, more focus + +Technology should support your business — not slow it down. + +SECTION 7: WHY NETCOP (TRUST & BRAND) +Headline + +Why Netcop + +Platform-agnostic approach + +Business-first thinking + +Founder-led accountability + +Clear processes, simple language + +Long-term partnership mindset + +You call vendors when something breaks. +You call Netcop so it doesn’t. + +SECTION 8: FINAL CTA (CONVERSION) +Headline + +Ready to Take Control of Your Systems? + +Copy + +Let’s start with a simple conversation — no selling, no jargon. + +CTA + +👉 Schedule a Discovery Call +👉 Talk to Netcop + +FOOTER (SIMPLE & CLEAN) + +Netcop Technologies Pvt. Ltd. +Business Systems • Automation • Managed Operations + +📩 Contact | 📞 Call | 🔗 LinkedIn + +🧠 WHY THIS 1-PAGE STRUCTURE WORKS + +Clear positioning in 5 seconds + +No dependency on platforms or tools + +Builds trust before selling + +Works for SMEs and parents (brand maturity) + +Easy to expand later + diff --git a/script.js b/script.js new file mode 100644 index 0000000..e6db8c7 --- /dev/null +++ b/script.js @@ -0,0 +1,73 @@ +document.addEventListener('DOMContentLoaded', () => { + // Mobile Menu Toggle + const mobileMenuBtn = document.querySelector('.mobile-menu-btn'); + const nav = document.querySelector('.nav'); + + // Toggle menu + mobileMenuBtn.addEventListener('click', () => { + mobileMenuBtn.classList.toggle('active'); + nav.classList.toggle('active'); + document.body.classList.toggle('no-scroll'); + }); + + // Close mobile menu when clicking a link + document.querySelectorAll('.nav a').forEach(link => { + link.addEventListener('click', () => { + mobileMenuBtn.classList.remove('active'); + nav.classList.remove('active'); + document.body.classList.remove('no-scroll'); + }); + }); + + // Header Scroll Effect + const header = document.querySelector('.header'); + window.addEventListener('scroll', () => { + if (window.scrollY > 50) { + header.classList.add('scrolled'); + } else { + header.classList.remove('scrolled'); + } + }); + + // Smooth Scrolling for anchor links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + const targetId = this.getAttribute('href'); + if (targetId === '#') return; + + const targetElement = document.querySelector(targetId); + if (targetElement) { + // Adjust offset based on header height + const headerOffset = 90; + const elementPosition = targetElement.getBoundingClientRect().top; + const offsetPosition = elementPosition + window.scrollY - headerOffset; + + window.scrollTo({ + top: offsetPosition, + behavior: 'smooth' + }); + } + }); + }); + + // Intersection Observer for Fade In Animations + const observerOptions = { + root: null, + rootMargin: '0px', + threshold: 0.1 + }; + + const observer = new IntersectionObserver((entries, observer) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('visible'); + observer.unobserve(entry.target); // Animates only once + } + }); + }, observerOptions); + + // Observe elements with fade-in-up class + const animatedElements = document.querySelectorAll('.fade-in-up'); + animatedElements.forEach(el => observer.observe(el)); +}); diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..6a8176a --- /dev/null +++ b/styles.css @@ -0,0 +1,990 @@ +/* Global Styles */ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap'); + +:root { + /* Colors */ + --primary-dark: #0A0E27; + --primary-color: #0F172A; + --primary-light: #1E293B; + --secondary-color: #3B82F6; + --secondary-light: #60A5FA; + --accent-purple: #8B5CF6; + --accent-cyan: #06B6D4; + --accent-color: #94A3B8; + --bg-color: #FAFBFC; + --surface-color: #FFFFFF; + --text-color: #1E293B; + --text-muted: #64748B; + + /* Gradients */ + --gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + --gradient-blue: linear-gradient(135deg, #3B82F6 0%, #1D4ED8 100%); + --gradient-purple: linear-gradient(135deg, #8B5CF6 0%, #6366F1 100%); + --gradient-mesh: radial-gradient(at 40% 20%, hsla(220, 80%, 70%, 0.15) 0px, transparent 50%), + radial-gradient(at 80% 0%, hsla(260, 80%, 70%, 0.15) 0px, transparent 50%), + radial-gradient(at 0% 50%, hsla(200, 80%, 70%, 0.15) 0px, transparent 50%); + + /* Typography */ + --font-heading: 'Poppins', sans-serif; + --font-body: 'Inter', sans-serif; + + /* Spacing */ + --section-padding: 140px; + --container-padding: 32px; + + /* Effects */ + --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04); + --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.06); + --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.08); + --shadow-glow: 0 0 40px rgba(59, 130, 246, 0.3); + --transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; + scroll-padding-top: 100px; +} + +body { + font-family: var(--font-body); + color: var(--text-color); + background: var(--bg-color); + line-height: 1.7; + overflow-x: hidden; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: var(--font-heading); + font-weight: 700; + color: var(--primary-color); + line-height: 1.15; + letter-spacing: -0.03em; +} + +a { + text-decoration: none; + color: inherit; + transition: var(--transition); +} + +ul { + list-style: none; +} + +.container { + max-width: 1280px; + margin: 0 auto; + padding: 0 var(--container-padding); +} + +.section { + padding: var(--section-padding) 0; + position: relative; +} + +.section-headline { + font-size: clamp(2.5rem, 5vw, 3.75rem); + text-align: center; + margin-bottom: 1.5rem; + font-weight: 800; +} + +.section-intro { + text-align: center; + max-width: 700px; + margin: 0 auto 3rem; + font-size: 1.25rem; + color: var(--text-muted); + line-height: 1.7; + font-weight: 400; +} + +/* Buttons */ +.btn { + display: inline-flex; + align-items: center; + justify-content: center; + padding: 18px 36px; + border-radius: 12px; + font-weight: 600; + font-size: 1.0625rem; + letter-spacing: -0.01em; + transition: var(--transition); + cursor: pointer; + border: none; + position: relative; + overflow: hidden; +} + +.btn::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%); + opacity: 0; + transition: opacity 0.3s; +} + +.btn:hover::before { + opacity: 1; +} + +.btn-primary { + background: var(--gradient-blue); + color: var(--surface-color); + box-shadow: 0 8px 24px rgba(59, 130, 246, 0.35); +} + +.btn-primary:hover { + transform: translateY(-3px); + box-shadow: 0 12px 32px rgba(59, 130, 246, 0.45); +} + +.btn-secondary { + background: var(--surface-color); + color: var(--primary-color); + border: 2px solid rgba(15, 23, 42, 0.08); + box-shadow: var(--shadow-sm); +} + +.btn-secondary:hover { + border-color: var(--secondary-color); + color: var(--secondary-color); + box-shadow: var(--shadow-md); + transform: translateY(-2px); +} + +/* Animations */ +.fade-in-up { + opacity: 0; + transform: translateY(40px); + transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), + transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); +} + +.fade-in-up.visible { + opacity: 1; + transform: translateY(0); +} + +.stagger-1 { + transition-delay: 0.1s; +} + +.stagger-2 { + transition-delay: 0.2s; +} + +.stagger-3 { + transition-delay: 0.3s; +} + +/* Header */ +.header { + background: rgba(255, 255, 255, 0.85); + backdrop-filter: blur(20px); + -webkit-backdrop-filter: blur(20px); + border-bottom: 1px solid rgba(15, 23, 42, 0.06); + position: fixed; + top: 0; + left: 0; + width: 100%; + z-index: 1000; + padding: 1.5rem 0; + transition: all 0.3s ease; +} + +.header.scrolled { + padding: 1rem 0; + box-shadow: var(--shadow-md); + background: rgba(255, 255, 255, 0.95); +} + +.header .container { + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo { + display: flex; + align-items: center; + transition: var(--transition); +} + +.logo-img { + height: 70px; + width: auto; + transition: var(--transition); +} + +.logo:hover .logo-img { + transform: scale(1.05); +} + +.nav { + display: flex; + gap: 3rem; + align-items: center; +} + +.nav a { + font-weight: 500; + color: var(--text-color); + font-size: 0.9375rem; + position: relative; +} + +.nav a:not(.btn)::after { + content: ''; + position: absolute; + bottom: -4px; + left: 0; + width: 0; + height: 2px; + background: var(--gradient-blue); + transition: width 0.3s; +} + +.nav a:not(.btn):hover::after { + width: 100%; +} + +.nav a:not(.btn):hover { + color: var(--secondary-color); +} + +.nav .btn { + padding: 12px 28px; + font-size: 0.9375rem; +} + +.mobile-menu-btn { + display: none; + background: none; + border: none; + cursor: pointer; + flex-direction: column; + gap: 6px; + z-index: 1001; +} + +.mobile-menu-btn span { + width: 28px; + height: 2.5px; + background-color: var(--primary-color); + border-radius: 3px; + transition: all 0.3s; +} + +/* Hero Section */ +.hero { + padding: 220px 0 160px; + text-align: center; + background: var(--bg-color); + position: relative; + overflow: hidden; +} + +.hero::before { + content: ''; + position: absolute; + top: -50%; + left: -10%; + width: 120%; + height: 100%; + background: var(--gradient-mesh); + opacity: 0.6; + z-index: 0; +} + +.hero .container { + position: relative; + z-index: 1; +} + +.hero-headline { + font-size: clamp(2.75rem, 7vw, 5.5rem); + line-height: 1.1; + margin-bottom: 2rem; + max-width: 1100px; + margin-left: auto; + margin-right: auto; + font-weight: 800; + background: linear-gradient(135deg, #0F172A 0%, #3B82F6 50%, #8B5CF6 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +.hero-subheadline { + font-size: clamp(1.125rem, 2.5vw, 1.5rem); + color: var(--text-muted); + margin-bottom: 1.5rem; + max-width: 800px; + margin-left: auto; + margin-right: auto; + font-weight: 400; + line-height: 1.6; +} + +.hero-support { + font-size: 1.125rem; + color: var(--secondary-color); + font-weight: 600; + margin-bottom: 3rem; + letter-spacing: -0.01em; +} + +.hero-actions { + display: flex; + justify-content: center; + gap: 1.5rem; + flex-wrap: wrap; +} + +/* Problem Section */ +.problem { + background: var(--surface-color); + border-radius: 48px; + margin: 0 24px; + box-shadow: var(--shadow-lg); + position: relative; +} + +.problem::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + height: 1px; + background: linear-gradient(90deg, transparent, rgba(59, 130, 246, 0.3), transparent); +} + +.problem-content { + background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%); + border-radius: 32px; + padding: 5rem 4rem; + max-width: 950px; + margin: 0 auto; + border: 1px solid rgba(15, 23, 42, 0.05); +} + +.problem-list { + margin: 3rem 0; + display: grid; + gap: 1.25rem; +} + +.problem-list li { + font-size: 1.25rem; + position: relative; + padding: 1.5rem 1.5rem 1.5rem 4rem; + color: var(--text-color); + background: var(--surface-color); + border-radius: 16px; + border-left: 4px solid #EF4444; + box-shadow: var(--shadow-sm); + transition: var(--transition); +} + +.problem-list li:hover { + transform: translateX(8px); + box-shadow: var(--shadow-md); +} + +.problem-list li::before { + content: "❌"; + position: absolute; + left: 1.5rem; + top: 1.5rem; + font-size: 1.25rem; +} + +.problem-conclusion { + text-align: center; + font-weight: 700; + font-size: 1.75rem; + color: var(--primary-color); + margin-top: 3rem; +} + +/* Positioning Section */ +.positioning { + background: var(--primary-dark); + color: var(--surface-color); + margin-top: -48px; + padding-top: 180px; + padding-bottom: 140px; + position: relative; + overflow: hidden; +} + +.positioning::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: radial-gradient(circle at 30% 50%, rgba(59, 130, 246, 0.15) 0%, transparent 60%), + radial-gradient(circle at 70% 50%, rgba(139, 92, 246, 0.15) 0%, transparent 60%); + z-index: 0; +} + +.positioning .container { + position: relative; + z-index: 1; +} + +.positioning .section-headline { + color: var(--surface-color); + background: linear-gradient(135deg, #FFFFFF 0%, #94A3B8 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.positioning-content { + text-align: center; + max-width: 900px; + margin: 0 auto; +} + +.positioning-content>p { + font-size: 1.375rem; + margin-bottom: 2.5rem; + color: #CBD5E1; + font-weight: 300; + line-height: 1.7; +} + +.positioning-conclusion { + font-size: 1.75rem; + font-weight: 700; + background: var(--gradient-purple); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + margin-top: 3rem; +} + +/* How It Works Section */ +.how-it-works { + background: linear-gradient(180deg, #FAFBFC 0%, #FFFFFF 100%); +} + +.process-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 2rem; +} + +.process-step { + background: var(--surface-color); + padding: 3rem 2.5rem; + border-radius: 24px; + box-shadow: var(--shadow-md); + border: 1px solid rgba(15, 23, 42, 0.05); + transition: var(--transition); + display: flex; + flex-direction: column; + position: relative; + overflow: hidden; +} + +.process-step::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 4px; + background: var(--gradient-blue); + transform: scaleX(0); + transform-origin: left; + transition: transform 0.4s; +} + +.process-step:hover::before { + transform: scaleX(1); +} + +.process-step:hover { + transform: translateY(-12px); + box-shadow: var(--shadow-lg); +} + +.process-step h3 { + font-size: 1.625rem; + margin-bottom: 1.25rem; + color: var(--primary-color); + font-weight: 700; +} + +.process-step p { + color: var(--text-muted); + margin-bottom: auto; + font-size: 1.0625rem; + line-height: 1.7; +} + +.step-tag { + display: inline-block; + margin-top: 2rem; + padding: 10px 18px; + background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%); + color: var(--secondary-color); + border-radius: 12px; + font-size: 0.875rem; + font-weight: 600; + border: 1px solid #BFDBFE; +} + +/* Benefits Section */ +.benefits { + background: var(--primary-dark); + color: var(--surface-color); + text-align: center; + border-radius: 48px; + margin: 0 24px; + position: relative; + overflow: hidden; +} + +.benefits::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: radial-gradient(circle at 50% 50%, rgba(59, 130, 246, 0.1) 0%, transparent 70%); +} + +.benefits .container { + position: relative; + z-index: 1; +} + +.benefits .section-headline { + color: var(--surface-color); + background: linear-gradient(135deg, #FFFFFF 0%, #94A3B8 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + margin-bottom: 3.5rem; +} + +.benefits-list { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); + gap: 1.5rem; + max-width: 1100px; + margin: 0 auto 3rem; +} + +.benefits-list li { + font-size: 1.1875rem; + text-align: left; + padding: 2rem; + background: rgba(255, 255, 255, 0.06); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 20px; + backdrop-filter: blur(10px); + transition: var(--transition); +} + +.benefits-list li:hover { + background: rgba(255, 255, 255, 0.12); + transform: translateY(-4px); +} + +/* Who This Is For */ +.who-this-is-for { + background: var(--surface-color); +} + +.audience-list { + max-width: 900px; + margin: 0 auto 3rem; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); + gap: 1.5rem; +} + +.audience-list li { + font-size: 1.1875rem; + padding: 2rem 2.5rem; + background: var(--surface-color); + border-radius: 20px; + border: 2px solid rgba(15, 23, 42, 0.06); + box-shadow: var(--shadow-sm); + display: flex; + align-items: center; + transition: var(--transition); + font-weight: 500; +} + +.audience-list li::before { + content: '→'; + margin-right: 1rem; + font-size: 1.5rem; + color: var(--secondary-color); + font-weight: 700; +} + +.audience-list li:hover { + border-color: var(--secondary-color); + box-shadow: var(--shadow-md); + transform: translateX(8px); +} + +.audience-conclusion { + text-align: center; + font-weight: 700; + font-size: 1.75rem; + color: var(--primary-color); +} + +/* AI Section */ +.ai-section { + background: var(--primary-dark); + color: var(--surface-color); + border-radius: 48px; + margin: 0 24px; + position: relative; + overflow: hidden; +} + +.ai-section::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: radial-gradient(circle at 70% 30%, rgba(139, 92, 246, 0.15) 0%, transparent 60%); +} + +.ai-section .container { + position: relative; + z-index: 1; +} + +.ai-section .section-headline { + color: #FFFFFF !important; + background: none; + -webkit-text-fill-color: #FFFFFF; +} + +.ai-content { + text-align: center; + max-width: 900px; + margin: 0 auto; +} + +.ai-content .section-intro { + color: #E2E8F0; + font-size: 1.375rem; + font-weight: 400; +} + +.ai-list { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 1.5rem; + margin: 3.5rem 0; + list-style: none; +} + +.ai-list li { + background: rgba(255, 255, 255, 0.1); + padding: 2rem; + border-radius: 20px; + border: 1px solid rgba(255, 255, 255, 0.2); + backdrop-filter: blur(10px); + font-size: 1.0625rem; + color: #F1F5F9; + font-weight: 500; + transition: var(--transition); +} + +.ai-list li:hover { + background: rgba(255, 255, 255, 0.18); + transform: translateY(-6px); + border-color: rgba(255, 255, 255, 0.3); +} + +.ai-conclusion { + font-size: 1.75rem; + font-weight: 700; + background: var(--gradient-purple); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +/* Why Netcop Section */ +.why-netcop { + background: var(--bg-color); +} + +.features-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + gap: 2rem; + margin-bottom: 5rem; +} + +.feature-card { + background: var(--surface-color); + padding: 3rem 2rem; + border-radius: 24px; + text-align: center; + font-weight: 600; + box-shadow: var(--shadow-md); + font-size: 1.125rem; + color: var(--primary-color); + border-top: 4px solid var(--secondary-color); + transition: var(--transition); +} + +.feature-card:hover { + transform: translateY(-8px); + box-shadow: var(--shadow-lg); +} + +.why-netcop-quote { + text-align: center; + font-size: clamp(1.75rem, 3vw, 2.25rem); + font-weight: 800; + color: var(--primary-color); + padding-top: 4rem; + max-width: 900px; + margin: 0 auto; + font-family: var(--font-heading); + letter-spacing: -0.03em; + line-height: 1.3; +} + +.why-netcop-quote p:last-child { + background: var(--gradient-blue); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + margin-top: 1rem; +} + +/* Final CTA Section */ +.final-cta { + text-align: center; + padding: 160px 0; + background: linear-gradient(180deg, #EFF6FF 0%, #FFFFFF 100%); + position: relative; +} + +.final-cta::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: var(--gradient-mesh); + opacity: 0.4; +} + +.final-cta .container { + position: relative; + z-index: 1; +} + +.cta-subheadline { + font-size: 1.5rem; + color: var(--text-muted); + margin-bottom: 3rem; + max-width: 650px; + margin-left: auto; + margin-right: auto; +} + +.cta-actions { + display: flex; + justify-content: center; + gap: 1.5rem; + flex-wrap: wrap; +} + +/* Footer */ +.footer { + background: #0A0E27; + color: #94A3B8; + padding: 5rem 0 2.5rem; + font-size: 0.9375rem; +} + +.footer-content { + display: flex; + justify-content: space-between; + align-items: flex-start; + padding-bottom: 3rem; + border-bottom: 1px solid rgba(255, 255, 255, 0.08); + margin-bottom: 2rem; +} + +.footer-brand h3 { + color: var(--surface-color); + font-size: 1.5rem; + margin-bottom: 0.75rem; + font-weight: 800; +} + +.footer-brand p { + color: #64748B; +} + +.footer-contact { + display: flex; + gap: 2.5rem; +} + +.footer-contact a { + color: #E2E8F0; + font-weight: 500; + padding: 8px 0; + position: relative; + transition: var(--transition); +} + +.footer-contact a::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 0; + height: 2px; + background: var(--gradient-blue); + transition: width 0.3s; +} + +.footer-contact a:hover { + color: var(--surface-color); +} + +.footer-contact a:hover::after { + width: 100%; +} + +/* Responsive Design */ +@media (max-width: 900px) { + :root { + --section-padding: 100px; + --container-padding: 24px; + } + + .audience-list { + grid-template-columns: 1fr; + } + + .problem-content { + padding: 3rem 2rem; + } +} + +@media (max-width: 768px) { + .header .nav { + display: none; + position: absolute; + top: 100%; + left: 0; + width: 100%; + background: rgba(255, 255, 255, 0.98); + backdrop-filter: blur(20px); + flex-direction: column; + padding: 2.5rem; + box-shadow: var(--shadow-lg); + z-index: 1000; + gap: 2rem; + text-align: center; + } + + .header .nav.active { + display: flex; + animation: slideDown 0.3s ease-out; + } + + @keyframes slideDown { + from { + opacity: 0; + transform: translateY(-20px); + } + + to { + opacity: 1; + transform: translateY(0); + } + } + + .mobile-menu-btn { + display: flex; + } + + .mobile-menu-btn.active span:nth-child(1) { + transform: rotate(45deg) translate(6px, 6px); + } + + .mobile-menu-btn.active span:nth-child(2) { + opacity: 0; + } + + .mobile-menu-btn.active span:nth-child(3) { + transform: rotate(-45deg) translate(6px, -6px); + } + + .hero { + padding: 160px 0 100px; + } + + .hero-actions, + .cta-actions { + flex-direction: column; + align-items: center; + width: 100%; + } + + .btn { + width: 100%; + max-width: 360px; + } + + .footer-content { + flex-direction: column; + text-align: center; + gap: 3rem; + align-items: center; + } + + .problem, + .benefits, + .ai-section { + margin: 0; + border-radius: 0; + } + + .process-grid { + grid-template-columns: 1fr; + } +} \ No newline at end of file diff --git a/update.md b/update.md new file mode 100644 index 0000000..2967fcb --- /dev/null +++ b/update.md @@ -0,0 +1,183 @@ +SECTION 1: HERO (FIRST 5 SECONDS MATTER) +Headline + +Make Your Business Systems Smarter. Not More Complicated. + +Sub-headline + +Netcop helps growing businesses design, connect, and manage their systems — using automation and AI where it actually makes sense. + +Clarity Line + +We take ownership of how your systems work, so you can focus on running your business. + +CTA + +👉 Start with a Free Discovery Call + +🔹 SECTION 2: THE REAL PROBLEM (VERY RELATABLE) +Headline + +Why Technology Feels Like a Burden for Most Businesses + +Copy + +Most businesses already use software, tools, and platforms. +Yet they still struggle because: + +Nothing is properly connected + +Processes are unclear or undocumented + +Teams depend on individuals, not systems + +AI tools are used randomly or incorrectly + +When something breaks, no one truly owns it + +Technology was supposed to help — instead it creates confusion. + +🔹 SECTION 3: YOUR POSITIONING (THIS IS KEY) +Headline + +We Don’t Sell Software. We Take Responsibility. + +Copy + +Netcop is a Business Systems & Operations Partner. + +We don’t push tools, platforms, or buzzwords. +We design and manage systems that support real workflows — and we stay accountable for how they perform over time. + +Automation and AI are used only where they add clarity, speed, or insight. + +🔹 SECTION 4: HOW NETCOP WORKS (FRAMEWORK, SIMPLIFIED) +Headline + +Our Simple 4-Step Approach + +1. Understand + +We study how your business actually runs — sales, operations, finance, and decision-making. + +No assumptions. No generic templates. + +2. Design + +We design a clear system flow: + +What should be automated + +What should stay human + +Where AI helps — and where it doesn’t + +Business logic first. Technology second. + +3. Build + +We connect tools, automate workflows, set up reporting, and ensure everything works in real-world usage. + +Practical systems, not demos. + +4. Run & Improve + +We take ongoing ownership: + +Monitoring + +Support + +Improvements + +AI tuning & automation checks + +One partner. One responsibility. + +🔹 SECTION 5: WHAT WE ACTUALLY HELP WITH (NO JARGON) +Headline + +What Netcop Helps You Achieve + +✔ Systems that talk to each other +✔ Less manual work +✔ Better visibility & decision-making +✔ Responsible use of automation & AI +✔ Reduced dependency on individuals +✔ Long-term stability as you grow + +🔹 SECTION 6: WHO THIS IS FOR +Headline + +Who Netcop Is Built For + +Netcop works best with: + +Small & mid-sized businesses + +Founders overwhelmed by tools & automation + +Teams experimenting with AI but lacking structure + +Businesses without a dedicated systems owner + +If your systems feel fragile, messy, or unclear — we can help. + +🔹 SECTION 7: AI — WITHOUT THE NOISE +Headline + +Our View on AI (Honest & Practical) + +Copy + +AI is powerful — but only when used responsibly. + +At Netcop: + +AI supports people, it doesn’t replace them + +Automation is reviewed, not blindly trusted + +Decisions remain explainable + +Systems stay under human control + +AI should reduce stress, not create new risks. + +🔹 SECTION 8: WHY NETCOP +Headline + +Why Businesses Choose Netcop + +Platform-agnostic approach + +Business-first thinking + +Clear ownership & accountability + +Simple language, no hype + +Founder-led engagement + +You don’t need more tools. +You need systems that work. + +🔹 SECTION 9: FINAL CTA (STRONG BUT CALM) +Headline + +Ready to Bring Clarity to Your Systems? + +Copy + +Let’s start with a conversation — no sales pitch, no buzzwords. + +CTA + +👉 Book a Discovery Call + +🔹 FOOTER + +Netcop Technologies Pvt. Ltd. +Business Systems • Automation • AI-Enabled Operations + +📧 Contact | 📞 Call | 🔗 LinkedIn \ No newline at end of file