rootedlab-code.github.io/index.html at main · rootedlab-code/rootedlab-code.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<!DOCTYPE html>
<html lang="it">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Rooted Lab – Digital Evolution. AI Powered.</title>
  <meta name="description"
    content="Rooted Lab – Premium IT Solutions, Web Development & AI Implementation. Building the digital future.">

  <!-- Fonts -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link
    href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=JetBrains+Mono:wght@400;700&family=Space+Grotesk:wght@500;700&display=swap"
    rel="stylesheet">

  <!-- Styles -->
  <link rel="stylesheet" href="assets/css/style.css">

  <!-- Favicon -->
  <!-- <link rel="icon" type="image/x-icon" href="assets/img/favicon.ico"> -->
</head>

<body>

  <!-- Background Effects -->
  <div class="bg-canvas"></div>
  <div class="grid-overlay"></div>

  <header class="container">
    <a href="#" class="logo">
      <span class="mono">&lt;/&gt;</span> ROOTED LAB
    </a>
    <nav>
      <a href="https://github.com/rootedlab-code" class="btn btn-secondary" target="_blank">GitHub</a>
    </nav>
  </header>

  <main class="container">
    <!-- Hero Section -->
    <section class="hero">
      <h1>DIGITAL EVOLUTION.<br>AI POWERED.</h1>
      <p>
        Next-Gen IT Solutions.<br>
        High-Performance Web Development. Intelligent AI Implementation.
      </p>
      <div style="display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap;">
        <a href="#services" class="btn btn-primary">
          Our Services
        </a>
        <a href="#contact" class="btn btn-secondary">
          Contact Us
        </a>
      </div>
    </section>

    <!-- Services Section -->
    <section id="services">
      <h2 class="section-title">SOLUTIONS</h2>
      <div class="card-grid">
        <!-- Web Development -->
        <div class="card">
          <div class="card-icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
              stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <polyline points="16 18 22 12 16 6"></polyline>
              <polyline points="8 6 2 12 8 18"></polyline>
            </svg>
          </div>
          <h3>Web Development</h3>
          <p>Building high-performance, modern websites and web applications. From landing pages to complex platforms,
            we code for speed and scalability.</p>
        </div>

        <!-- AI Implementation -->
        <div class="card">
          <div class="card-icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
              stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <path d="M12 2a10 10 0 1 0 10 10H12V2z"></path>
              <path d="M12 2a10 10 0 0 1 10 10"></path>
              <path d="M12 12l9.5-5.5"></path>
              <path d="M12 12l-9.5-5.5"></path>
            </svg>
          </div>
          <h3>AI Integration</h3>
          <p>Leveraging Large Language Models and automation agents to optimize your workflows. We bring intelligence to
            your digital infrastructure.</p>
        </div>

        <!-- IT Consulting -->
        <div class="card">
          <div class="card-icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
              stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
              <line x1="8" y1="21" x2="16" y2="21"></line>
              <line x1="12" y1="17" x2="12" y2="21"></line>
            </svg>
          </div>
          <h3>IT Consulting</h3>
          <p>Strategic technology advice. We help you choose the right stack, secure your systems, and modernize your
            digital presence.</p>
        </div>
      </div>
    </section>

    <!-- Community / Support -->
    <section id="community" style="margin-top: 4rem;">
      <h2 class="section-title">COMMUNITY & GROWTH</h2>
      <div class="card-grid"
        style="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); justify-content: center;">
        <!-- YouTube -->
        <a href="https://youtube.com/@rootedlab" class="card" target="_blank">
          <div class="card-icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
              stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <path
                d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.33 29 29 0 0 0-.46-5.33z" />
              <polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02" />
            </svg>
          </div>
          <h3>Educational Content</h3>
          <p>Free tutorials on AI implementation, coding, and tech trends. We share our knowledge to empower the
            community.</p>
        </a>

        <!-- Ko-fi -->
        <a href="https://ko-fi.com/rootedlab" class="card" target="_blank">
          <div class="card-icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
              stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
              <path
                d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z" />
            </svg>
          </div>
          <h3>Support Our Research</h3>
          <p>Your contributions help us develop open-source tools and maintain our educational platform.</p>
        </a>
      </div>
    </section>

    </section>

    <!-- Contact Section -->
    <section id="contact"
      style="text-align: center; margin: 4rem auto; max-width: 600px; padding: 2rem; border: 1px solid var(--glass-border); background: var(--glass-bg); border-radius: 16px;">
      <h2 class="section-title" style="margin-bottom: 1.5rem;">GET IN TOUCH</h2>
      <p style="font-size: 1.1rem; color: var(--text-primary); margin-bottom: 2rem; line-height: 1.6;">
        Ready to upgrade your digital infrastructure? <br>
        Contact us for a private consultation regarding Web Development, AI Solutions, or Security Audits.
      </p>
      <a href="mailto:rootedlab@proton.me" class="btn btn-primary" style="font-size: 1.2rem; padding: 1rem 3rem;">
        rootedlab@proton.me
      </a>
    </section>

    <!-- About / Mission -->
    <section id="about" style="text-align: center; max-width: 800px; margin: 0 auto; padding-bottom: 4rem;">
      <h2 class="section-title">ABOUT</h2>
      <p style="font-size: 1.1rem; line-height: 1.8; color: var(--text-secondary);">
        Rooted Lab is a forward-thinking digital agency. We fuse cutting-edge web technologies with artificial
        intelligence to build systems that are not just functional, but revolutionary.
        From concept to code, we engineer the future of your business.
      </p>
    </section>
  </main>

  <footer>
    <div class="container">
      <p>&copy; 2026 Rooted Lab. All rights reserved.</p>
      <p style="margin-top: 0.5rem; font-size: 0.9rem; opacity: 0.6;">
        Innovating the Present. Defining the Future.
      </p>
    </div>
  </footer>

  <script src="assets/js/main.js"></script>
</body>

</html>