Merge branch 'development_sasha' of https://github.com/threefoldfoundation/www_threefold_io into development_sasha

build.sh

@@ -12,7 +12,7 @@ fi
 
 # checks os and architecture for correct release
 # https://stackoverflow.com/a/8597411 
-echo "Installing & building tailwind..."
+echo "Download tailwind..."
 ASSET="tailwindcss"
 
 if [[ "$OSTYPE" == "linux-gnu"* ]]; then
@@ -27,6 +27,15 @@ elif [[ "$(uname -m)" == "arm64"* ]]; then
 fi
 
 curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/latest/download/${ASSET}"
+
+# Check if the download size is greater than 20MB
+if [[ $(stat -c%s "$ASSET") -lt 20000000 ]]; then
+    echo "Error: Downloaded file size is less than 20MB, download not ok."
+    echo "Download url was:$ASSET" 
+    rm "$ASSET"
+    exit 1
+fi
+
 chmod +x $ASSET
 mv $ASSET tailwindcss
 
@@ -45,4 +54,4 @@ rm -rf public static/css
 ./tailwindcss -i css/index.css -o ./static/css/index.css --minify
 zola --root $ABS_DIR_OF_SCRIPT build
 
-
+open public/index.html

content/blog/beyond_quick_fixes/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   categories: [tech,grid,community]
 extra:
-    imgPath: beyond_quick_fixes.png
+    imgPath: beyond_quick_fixes1.png
 ---
 
 The Internet is a crucial part of our daily lives, yet it faces many challenges. To name a few, about half of the global population doesn’t have fair or reliable access, data privacy, and cybersecurity threats are greater than ever before, and the current model is unsustainable for our planet. Despite advancements in technology, the Internet has been stuck in a cycle of quick fixes and patchwork solutions, unable to address these fundamental issues truly.

content/blog/cloud_provider/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [grid, tech]
   categories: [grid, tech]
 extra:
-    imgPath: cloud_provider.png
+    imgPath: cloud_internet_provider1.png
 ---
 
 Cloud and Internet service providers form the backbone of our digital experiences. They host data and applications, and facilitate connectivity. Major corporations have long dominated this space. When the Internet started to become mainstream, it was necessary to scale the infrastructure quickly to meet growing demand. Thus, with their vast amounts of resources, big companies were the ones to build this infrastructure and offer services on top.

content/blog/dunia_yetu/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [community, decentralization, event, collaboration, why]
   categories: [community, decentralization, event, collaboration, why]
 extra:
-    imgPath: dy.png
+    imgPath: dunia_yetu1.png
 ---
 
 ### Vision of Collective Empowerment 

content/blog/edge_computing/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [grid, tech]
   categories: [grid, tech]
 extra:
-    imgPath: edge_computing.png
+    imgPath: meeting_digital_demands1.png
     isFeatured: true
 ---
 

content/blog/evolution_of_the_internet/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,community]
   categories: [tech,community]
 extra:
-    imgPath: evloution_of_the_internet.png
+    imgPath: evolution_of_the_internet1.png
     isFeatured: true
 ---
 

content/blog/ground_up_innovations/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [grid,decentralization,tech,why]
   categories: [grid,decentralization,tech,why]
 extra:
-    imgPath: ground_up_innovations.png
+    imgPath: from_the_ground_up1.png
 ---
 
 Building a cloud and internet infrastructure from the ground up is no easy, or quick, task. But if we want a truly different way forward, there is no other way, really. We do what we do, the way we do it, because we cannot continue to put “band-aids” on problems which require a much deeper and thoughtful approach.

content/blog/hatch_podcast/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [community, event, collaboration, why]
   categories: [community, event, collaboration, why]
 extra:
-    imgPath: hatch_podcast.png
+    imgPath: collaborative_innovations1.png
 ---
 
 #### Introduction 

content/blog/how_to_test_the_grid_part_one/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   categories: [tech,grid,community]
 extra:
-    imgPath: testing_main.png
+    imgPath: grid_testing1.png
 ---
 
 Hi there and welcome to ThreeFold Grid Testing: Part One!

content/blog/how_to_test_the_grid_part_two/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid]
   categories: [tech,grid]
 extra:
-    imgPath: how_to_test_the_grid_part_two.png
+    imgPath: manual_auto_testing.png
 ---
 
 In our [last post](https://www.threefold.io/blog/how-to-test-the-grid-part-one/), we started to explore what it means to test the ThreeFold Grid by highlighting the key processes and the benefits or reasons. Now, we continue our discovery path through the detailed testing process. In this post, we go deeper into two different ways of testing: Manual and Automation. Each is important, combining to ensure a strong and dependable TF Grid.

content/blog/internet_misconceptions/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [grid,decentralization,tech,why]
   categories: [grid,decentralization,tech,why]
 extra:
-    imgPath: internet_misconceptions.png
+    imgPath: truth_behind_misconceptions.png
 ---
 
 It’s been years that the ThreeFold team has been at this work of evolving the Internet in a fair and just way. We know how the Internet works and the challenges it faces, and because of this, we have been able to do the work of upgrading the Internet with a ground-up solution.

content/blog/reliability/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [decentralization, grid, cloud, tech]
   categories: [decentralization, grid, cloud, tech]
 extra:
-    imgPath: reliability.png
+    imgPath: realiblity_decentralized_internet1.png
 ---
 
 In today's digital landscape, the development of a decentralized open-source Internet infrastructure marks a significant leap forward. However, while the foundational structure of this innovation brings promise, its inherent reliability isn't guaranteed. After more than five years of building and expanding the open-source ThreeFold Grid, it's now time we pivot towards commercialization. Ensuring a robust, dependable, and trustworthy offering becomes paramount. In this post, we'll share the various ways that the ThreeFold Grid is and will become reliable.

content/blog/solar_comparison/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [community, decentralization, farming, grid, cloud]
   categories: [community, decentralization, farming, grid, cloud]
 extra:
-    imgPath: solar_comparison.png
+    imgPath: decentralized_internet.png
 ---
 
 *This article was originally published by Emilie Ouwerx, a former member of the ThreeFold team.*\

content/blog/tf_ecosystem_comes_alive/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [community, why]
   categories: [community, why]
 extra:
-    imgPath: tf_ecosystem_comes_alive.png
+    imgPath: tf_ecosystem1.png
 ---
 
 Collaborative. Self-organizing. Interconnected. Dynamic. Diverse. Resilient. Sustainable.

content/blog/the_farming_community/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,farming,community]
   categories: [tech,grid,farming,community]
 extra:
-    imgPath: the_farming_community.png
+    imgPath: spotlight_farming1.png
 ---
 
 The ThreeFold community consists of many different roles creating a whole [ecosystem](https://www.threefold.io/blog/tf-ecosystem-comes-alive/) that contributes to the growth of the ThreeFold Grid and makes it more reliable and stable. Today, we're spotlighting the farming community, the backbone of the ThreeFold Grid.

content/blog/three_layers/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [decentralization, grid, cloud, tech]
   categories: [decentralization, grid, cloud, tech]
 extra:
-    imgPath: img/three_layers.png
+    imgPath: building_blocks_internet1.png
     isFeatured: true
 ---
 

content/blog/threefold_herdao_dar/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [community, event, collaboration, why]
   categories: [community, event, collaboration, why]
 extra:
-    imgPath: diversitytf.png
+    imgPath: embracing_diversity1.png
 ---
 
 In today's rapidly evolving technological landscape, diversity and inclusion are not just buzzwords; they are essential components for driving innovation and progress. As the tech and IT sectors continue to shape the future, it's crucial to recognize the importance of fostering diverse perspectives and creating inclusive environments where everyone feels valued and empowered to contribute.

content/blog/threefold_impact/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,community]
   categories: [tech,community]
 extra:
-    imgPath: threefold_impact.png
+    imgPath: impacting_the_future1.png
     isFeatured: true
 ---
 

content/blog/tier_s_data_center/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [cloud, tech]
   categories: [cloud, tech]
 extra:
-  imgPath: tier_s_data_center.png
+  imgPath: data_centre_tiers1.png
 ---
 
 In an era where artificial intelligence is reshaping our technological landscape, it is imperative to reconsider how we design and operate data centers. With decades of experience in the Internet and Cloud space and in response to technological evolutions, ThreeFold is proposing a new approach.

content/blog/transformative_impact_summit/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [community]
   categories: [community]
 extra:
-    imgPath: transformative_impact_summit.png
+    imgPath: creating_tranformative1.png
 ---
 
 *“By bringing together those dedicating their lives to making the world a better place, and empowering them with exposure, support, connection, and funding, we not only celebrate transformative impact, we create it.”*

content/header/index.md

@@ -8,7 +8,7 @@ extra:
 ---
 
 - [Why]("/about")
-- [Solutions]("/solutions")
+- [What]("/solutions")
 - [12.12.24]("/action")
 - Info
 

content/newsroom/314_upgrade/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   news-category: [tech,grid,community]
 extra:
-    imgPath: 314_upgrade.png
+    imgPath: 314_upgrade1.png
 ---
 
 TF Grid 3.14 is now on Mainnet. This release is focused on stability and reliability and includes improvements and upgrades to Zero OS, TF Chain, Grid-Proxy, Farmerbot, Pulumi, and SDK-Go. Find the details [here](https://forum.threefold.io/t/gep-tf-grid-mainnet-release-3-14/4372).

content/newsroom/315_mainnet_release/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   news-category: [tech,grid,community]
 extra:
-    imgPath: 315_mainnet_release.png
+    imgPath: 315_vote.png
 ---
 
 We are currently testing TF Grid version 3.15 on testnet and preparing to release on mainnet. Farmers, please vote by Tuesday November 12th at 10am CET on the [dashboard](https://dashboard.grid.tf/) under ‘TFChain - DAO.'

content/newsroom/315_notes/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community,event]
   news-category: [tech,grid,community,event]
 extra:
-    imgPath: 315_notes.png
+    imgPath: 315_announcement.png
 
 ---
 

content/newsroom/argentina_event/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community,event]
   news-category: [tech,grid,community,event]
 extra:
-    imgPath: argentina_event.jpg
+    imgPath: argentina_event.png
 
 ---
 

content/newsroom/gep_voting_process/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   news-category: [tech,grid,community]
 extra:
-    imgPath: gep_voting_process.png
+    imgPath: voting_process_gep.png
 
 ---
 

content/newsroom/mainnet_upgrade_314/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   news-category: [tech,grid,community]
 extra:
-    imgPath: mainnet_upgrade_314.png
+    imgPath: 314_vote.png
 
 ---
 

content/newsroom/sept_5_call/index.md

@@ -9,7 +9,7 @@ taxonomies:
   tags: [tech,grid,community]
   news-category: [tech,grid,community]
 extra:
-    imgPath: sept_5_call.jpg
+    imgPath: sept_call.png
 
 ---
 

env.sh

@@ -1 +1,136 @@
 export NAME='threefoldio'
+
+SOURCE=${BASH_SOURCE[0]}
+DIR_OF_THIS_SCRIPT="$( dirname "$SOURCE" )"
+export BASE="$( realpath "$DIR_OF_THIS_SCRIPT" )"
+
+mkdir -p $HOME/hero/bin
+
+get_file_size() {
+    if [[ "$OSTYPE" == "linux-gnu"* ]]; then
+        stat -c%s "$1"
+    elif [[ "$OSTYPE" == "darwin"* ]]; then
+        stat -f%z "$1"
+    else
+        echo "Unsupported operating system."
+        exit 1
+    fi
+}
+
+
+# Add ~/hero/bin to PATH
+export PATH="$HOME/hero/bin:$PATH"
+
+
+# Check if tailwindcss exists in ~/hero/bin
+if [[ ! -f "$HOME/hero/bin/tailwindcss" ]]; then
+    echo "tailwindcss not found in ~/hero/bin. Downloading..."
+    
+    ASSET="tailwindcss"
+
+    if [[ "$OSTYPE" == "linux-gnu"* ]]; then
+        ASSET="$ASSET-linux"
+    elif [[ "$OSTYPE" == "darwin"* ]]; then
+        ASSET="$ASSET-macos"
+    fi
+    if [[ "$(uname -m)" == "x86_64"* ]]; then
+        ASSET="$ASSET-x64"
+    elif [[ "$(uname -m)" == "arm64"* ]]; then
+        ASSET="$ASSET-arm64"
+    fi
+
+    pushd /tmp
+    rm -f $ASSET
+    rm -f tailwindcss
+    curl -sLO "https://github.com/tailwindlabs/tailwindcss/releases/latest/download/${ASSET}"
+
+    FILE_SIZE=$(get_file_size "$ASSET")
+    if [[ $FILE_SIZE -lt 20000000 ]]; then
+        echo "Error: Downloaded file size is less than 20MB, download not ok."
+        echo "Download URL was: $ASSET"
+        rm "$ASSET"
+        exit 1
+    fi    
+
+    chmod +x $ASSET
+    rm -rf "$HOME/hero/bin/tailwindcss"
+    mv $ASSET "$HOME/hero/bin/tailwindcss"
+
+    popd
+fi
+
+check_zola() {
+    if command -v zola &> /dev/null; then
+        echo "Zola is already installed."
+        return 0
+    else
+        echo "Zola is not installed. Proceeding with installation."
+        return 1
+    fi
+}
+
+# Function to install Zola on Ubuntu
+install_zola_ubuntu() {
+    echo "Installing Zola on Ubuntu..."
+    sudo apt update
+    sudo apt install curl -y
+    ZOLA_DEB=$(curl -s https://api.github.com/repos/getzola/zola/releases/latest | grep "browser_download_url.*_amd64.deb" | cut -d '"' -f 4)
+    curl -LO $ZOLA_DEB
+    sudo dpkg -i $(basename $ZOLA_DEB)
+}
+
+# Function to install Zola on Arch Linux
+install_zola_arch() {
+    echo "Installing Zola on Arch Linux..."
+    sudo pacman -Sy zola
+}
+
+# Function to install Zola on macOS
+install_zola_macos() {
+    echo "Installing Zola on macOS..."
+    if command -v brew &> /dev/null; then
+        brew install zola
+    else
+        echo "Homebrew is not installed. Please install Homebrew first."
+        exit 1
+    fi
+}
+
+if ! check_zola; then
+    # Detect OS and install Zola
+    if [[ "$OSTYPE" == "linux-gnu"* ]]; then
+        if command -v apt &> /dev/null; then
+            install_zola_ubuntu
+        elif command -v pacman &> /dev/null; then
+            install_zola_arch
+        else
+            echo "Unsupported Linux distribution."
+            exit 1
+        fi
+    elif [[ "$OSTYPE" == "darwin"* ]]; then
+        install_zola_macos
+    else
+        echo "Unsupported operating system."
+        exit 1
+    fi
+fi
+
+# Kill any running zola process
+if pgrep zola > /dev/null; then
+    echo "Stopping running zola process..."
+    pkill zola
+fi
+
+# Initialize and configure tailwind if not configured
+echo "Initializing tailwind..."
+if [[ ! -f "tailwind.config.js" ]]; then
+    ~/hero/bin/tailwindcss init
+    sed -i '' "s|  content: \\[\\],|  content: \\['./templates/**/*.html'\\],|g" tailwind.config.js
+fi
+
+# Compile tailwindcss for prod & build project
+echo "Compiling tailwindcss and building zola project..."
+rm -rf public static/css
+tailwindcss -i css/index.css -o ./static/css/index.css --minify
+
+

start.sh

@@ -1,25 +1,10 @@
-# builds if executable isn't foound
+#!/bin/bash
-if [[ ! -f "tailwindcss" ]]
+set -ex
-then
-    sh build.sh
-fi
 
-# initialized and configures tailwind if not configured
+export BASE="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
-if [[ ! -f "tailwind.config.js" ]]
+cd "${BASE}"
-then
-    ./tailwindcss init
-    sed -i '' "s|  content: \\[\\],|  content: \\['./templates/**/*.html'\\],|g" tailwind.config.js
-fi
 
-# compiles tailwind css & launches locally
-rm -rf public static/css
-./tailwindcss -i css/index.css -o ./static/css/index.css --watch & zola serve &
 
-# compiles tailwind css for prod & builds project
+source env.sh
-./tailwindcss -i css/index.css -o ./static/css/index.css --minify
-zola build
-
-# kills zola and tw bg processes on interrupt
-trap 'kill $(jobs -p); exit 1' INT
-wait
 
+zola serve

templates/partials/home/faq.html

@@ -1,207 +1,255 @@
-<div class="bg-transparent">
-    <div class="mx-auto max-w-7xl px-6 pb-32 pt-12fa lg:px-8">
-        <div class="mx-auto max-w-4xl divide-y divide-white/10">
-            <h2 class="text-3xl font-normal tracking-tight text-white sm:text-4xl">Frequently Asked Questions</h2>
-            <dl class="mt-10 space-y-6 divide-y divide-white/10">
 
-                <!-- FAQ 1 -->
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
-                <div class="pt-6">
+<script src="https://cdn.tailwindcss.com"></script>
-                    <dt>
+    <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
-                        <button type="button" class="flex w-full border-transparent items-start justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-0" aria-expanded="false">
+    <script>
-                            <span class="text-base font-semibold">Is this a separate new Internet?</span>
+        tailwind.config = {
-                            <span class="ml-6 flex h-7 items-center">
+            theme: {
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                extend: {
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                    fontFamily: {
-                                </svg>
+                        inter: ['Inter', 'sans-serif'],
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                    },
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                },
-                                </svg>
+            },
-                            </span>
+        };
+    </script>
+    <main class="relative flex flex-col justify-center overflow-hidden">
+        <div class="w-full max-w-7xl mx-auto px-4 md:px-6 py-20">
+
+            <h1 class="text-3xl font-normal tracking-tight text-white sm:text-4xl">Frequently Asked Questions</h1>
+
+            <!-- Accordion component -->
+            <div class="divide-y divide-white/50 my-10">
+                <!-- Accordion item -->
+                <div x-data="{ expanded: false }" class="py-2">
+                    <h2>
+                        <button
+                            id="faqs-title-01"
+                            type="button"
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
+                            @click="expanded = !expanded"
+                            :aria-expanded="expanded"
+                            aria-controls="faqs-text-01"
+                        >
+                            <span class="text-xl">Is this a separate new Internet?</span>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-0">
+                    <div
-                        <p class="text-base text-white">No, ThreeFold is a complementary Internet and works alongside the current Internet. It allows you to continue accessing and interacting with the current Internet while offering additional capabilities.</p>
+                        id="faqs-text-01"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-01"
+                        class="grid text-sm text-slate-200 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                            <p class="pb-3 text-gray-300 text-lg">
+                                No, ThreeFold is a complementary Internet and works alongside the current Internet. It allows you to continue accessing and interacting with the current Internet while offering additional capabilities.
+                            </p>
+                        </div>
+                    </div>
                 </div>
-
+                <!-- Accordion item -->
-                <!-- FAQ 2 -->
+                <div x-data="{ expanded: false }" class="py-2">
-                <div class="pt-6">
+                    <h2>
-                    <dt>
+                        <button
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-1" aria-expanded="false">
+                            id="faqs-title-02"
-                            <span class="text-base font-semibold">Why do we need a new Internet?</span>
+                            type="button"
-                            <span class="ml-6 flex h-7 items-center">
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                            @click="expanded = !expanded"
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                            :aria-expanded="expanded"
-                                </svg>
+                            aria-controls="faqs-text-02"
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                        >
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                            <span>Why do we need a new Internet?</span>
-                                </svg>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-                            </span>
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-1">
+                    <div
-                        <p class="text-base text-white">The Internet has become fragile and overly centralized. Issues like authenticity, privacy, security, and sustainability necessitate a fundamental new approach to rebuild its foundation.</p>
+                        id="faqs-text-02"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-02"
+                        class="grid text-sm text-slate-600 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                            <p class="pb-3 text-gray-300 text-lg">
+                                The Internet has become fragile and overly centralized. Issues like authenticity, privacy, security, and sustainability necessitate a fundamental new approach to rebuild its foundation.
+                            </p>
+                        </div>
+                    </div>
                 </div> 
-
+                <!-- Accordion item -->
-                <!-- FAQ 3 -->
+                <div x-data="{ expanded: false }" class="py-2">
-                <div class="pt-6">
+                    <h2>
-                    <dt>
+                        <button
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-2" aria-expanded="false">
+                            id="faqs-title-03"
-                            <span class="text-base font-semibold">This seems too big to be true. Is this real?</span>
+                            type="button"
-                            <span class="ml-6 flex h-7 items-center">
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                            @click="expanded = !expanded"
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                            :aria-expanded="expanded"
-                                </svg>
+                            aria-controls="faqs-text-03"
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                        >
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                            <span>This seems too big to be true. Is this real?</span>
-                                </svg>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-                            </span>
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-2">
+                    <div
-                        <p class="text-base text-white">For over 30 years, we’ve worked toward this vision. ThreeFold is the culmination of our journey, offering a fully operational product and a growing community of users, farmers, and partners. This is real and here to stay.</p>
+                        id="faqs-text-03"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-03"
+                        class="grid text-sm text-slate-600 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                            <p class="pb-3 text-gray-300 text-lg">
+                                For over 30 years, we’ve worked toward this vision. ThreeFold is the culmination of our journey, offering a fully operational product and a growing community of users, farmers, and partners. This is real and here to stay.
+                            </p>
+                        </div>
+                    </div>
                 </div> 
-
+                <!-- Accordion item -->
-                <!-- FAQ 4 -->
+                <div x-data="{ expanded: false }" class="py-2">
-                <div class="pt-6">
+                    <h2>
-                    <dt>
+                        <button
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-3" aria-expanded="false">
+                            id="faqs-title-04"
-                            <span class="text-base font-semibold">You have 2 tokens, TFT and INCA, why?</span>
+                            type="button"
-                            <span class="ml-6 flex h-7 items-center">
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                            @click="expanded = !expanded"
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                            :aria-expanded="expanded"
-                                </svg>
+                            aria-controls="faqs-text-04"
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                        >
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                            <span>You have 2 tokens, TFT and INCA, why?</span>
-                                </svg>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-                            </span>
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-3">
+                    <div
-                        <p class="text-base text-white">TFT is our token which was used to build generation 1, 2 and 3 of the ThreeFold Grid of capacity. TFT is the reward for our loyal community. There can never be more than 1 billion TFT. We are now building generation 4 of the ThreeFold Grid of capacity and we need a new token to build this new generation. There will never be more than 3 billion INCA. Our partners will start selling new ThreeFold Nodes end Nov 2024 with a new reward scheme and ready to grow to millions of nodes.</p>
+                        id="faqs-text-04"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-04"
+                        class="grid text-sm text-slate-600 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                             <p class="pb-3 text-gray-300 text-lg">
+                                TFT is our token which was used to build generation 1, 2 and 3 of the ThreeFold Grid of capacity. TFT is the reward for our loyal community. There can never be more than 1 billion TFT. We are now building generation 4 of the ThreeFold Grid of capacity and we need a new token to build this new generation. There will never be more than 3 billion INCA. Our partners will start selling new ThreeFold Nodes end Nov 2024 with a new reward scheme and ready to grow to millions of nodes.
+                            </p>
+                        </div>
+                    </div>
                 </div> 
-
+                <!-- Accordion item -->
-                <!-- FAQ 5 -->
+                <div x-data="{ expanded: false }" class="py-2">
-                <div class="pt-6">
+                    <h2>
-                    <dt>
+                        <button
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-4" aria-expanded="false">
+                            id="faqs-title-05"
-                            <span class="text-base font-semibold">How can I participate?</span>
+                            type="button"
-                            <span class="ml-6 flex h-7 items-center">
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                            @click="expanded = !expanded"
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                            :aria-expanded="expanded"
-                                </svg>
+                            aria-controls="faqs-text-05"
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                        >
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                            <span>How can I participate?</span>
-                                </svg>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-                            </span>
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-4">
+                    <div
-                        <p class="text-base text-white">You can participate by becoming a farmer, a user, a partner or by developing a web4 app. Provide capacity to the ThreeFold Grid, Use capacity, build solutions, develop applications for Web4, and many more.</p>
+                        id="faqs-text-05"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-05"
+                        class="grid text-sm text-slate-600 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                             <p class="pb-3 text-gray-300 text-lg">
+                                You can participate by becoming a farmer, a user, a partner or by developing a web4 app. Provide capacity to the ThreeFold Grid, Use capacity, build solutions, develop applications for Web4, and many more.
+                            </p>
+                        </div>
+                    </div>
                 </div> 
-
+                <!-- Accordion item -->
-                <!-- FAQ 6 -->
+                <div x-data="{ expanded: false }" class="py-2">
-                <div class="pt-6">
+                    <h2>
-                    <dt>
+                        <button
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-5" aria-expanded="false">
+                            id="faqs-title-06"
-                            <span class="text-base font-semibold">What is Web4?</span>
+                            type="button"
-                            <span class="ml-6 flex h-7 items-center">
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                            @click="expanded = !expanded"
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                            :aria-expanded="expanded"
-                                </svg>
+                            aria-controls="faqs-text-06"
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                        >
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                            <span>What is Web4?</span>
-                                </svg>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-                            </span>
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-5">
+                    <div
-                        <p class="text-base text-white">Web4 is our evolution towards a decentralized, user-controlled, and secure Internet that respects privacy and minimizes environmental impact.</p>
+                        id="faqs-text-06"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-06"
+                        class="grid text-sm text-slate-600 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                             <p class="pb-3 text-gray-300 text-lg">
+                                Web4 is our evolution towards a decentralized, user-controlled, and secure Internet that respects privacy and minimizes environmental impact.
+                            </p>
+                        </div>
+                    </div>
                 </div> 
-
+                <!-- Accordion item -->
-                <!-- FAQ 7 -->
+                <div x-data="{ expanded: false }" class="py-2">
-                <div class="pt-6">
+                    <h2>
-                    <dt>
+                        <button
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-6" aria-expanded="false">
+                            id="faqs-title-07"
-                            <span class="text-base font-semibold">Is this another blockchain?</span>
+                            type="button"
-                            <span class="ml-6 flex h-7 items-center">
+                            class="flex items-center justify-between w-full text-left font-semibold py-2 border-none"
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
+                            @click="expanded = !expanded"
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
+                            :aria-expanded="expanded"
-                                </svg>
+                            aria-controls="faqs-text-07"
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
+                        >
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
+                            <span>Is this another blockchain?</span>
-                                </svg>
+                            <svg class="fill-white shrink-0 ml-8" width="16" height="16" xmlns="http://www.w3.org/2000/svg">
-                            </span>
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                                <rect y="7" width="16" height="2" rx="1" class="transform origin-center rotate-90 transition duration-200 ease-out" :class="{'!rotate-180': expanded}" />
+                            </svg>
                         </button>
-                    </dt>
+                    </h2>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-6">
+                    <div
-                        <p class="text-base text-white">No, we are NOT blockchain. We are using our own technology: Zero State technology combined with Quantum Safe Internetworking.</p>
+                        id="faqs-text-07"
-                    </dd>
+                        role="region"
+                        aria-labelledby="faqs-title-07"
+                        class="grid text-sm text-slate-600 overflow-hidden transition-all duration-300 ease-in-out"
+                        :class="expanded ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'"
+                        >
+                        <div class="overflow-hidden">
+                             <p class="pb-3 text-gray-300 text-lg">
+                                No, we are NOT blockchain. We are using our own technology: Zero State technology combined with Quantum Safe Internetworking.
+                            </p>
+                        </div>
+                    </div>
                 </div>                                                                                                
+            </div>
+            <!-- End: Accordion component -->
 
-                <!-- FAQ 8 -->
-                <div class="pt-6">
-                    <dt>
-                        <button type="button" class="flex w-full items-start border-transparent justify-between text-left text-white px-6 bg-transparent border-none" aria-controls="faq-7" aria-expanded="false">
-                            <span class="text-base font-semibold">Is the ThreeFold Internet regulated?</span>
-                            <span class="ml-6 flex h-7 items-center">
-                                <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-expand">
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v12m6-6H6" />
-                                </svg>
-                                <svg class="hidden size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon-collapse">
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M18 12H6" />
-                                </svg>
-                            </span>
-                        </button>
-                    </dt>
-                    <dd class="mt-2 hidden pr-12 text-white" id="faq-7">
-                        <p class="text-base text-white">Regulations are being considered and addressed. The technology is designed to comply with local laws and operate transparently, fostering trust and reliability.</p>
-                    </dd>
-                </div>
-
-            </dl>
         </div>
-    </div>
+    </main>
-</div>
 
-<script>
-    // Select all FAQ buttons
-const faqButtons = document.querySelectorAll("dt button");
 
-// Add click event listeners to each button
-faqButtons.forEach(button => {
-  button.addEventListener("click", () => {
-    const currentFaq = button.closest("div");
-    const answer = currentFaq.querySelector("dd");
-    const isExpanded = button.getAttribute("aria-expanded") === "true";
 
-    // Collapse all other FAQs
-    faqButtons.forEach(btn => {
-      if (btn !== button) {
-        const otherFaq = btn.closest("div");
-        const otherAnswer = otherFaq.querySelector("dd");
-        btn.setAttribute("aria-expanded", "false");
-        otherAnswer.classList.add("hidden");
-        otherAnswer.classList.remove("block");
-      }
-    });
    
-    // Toggle current FAQ
-    if (isExpanded) {
-      button.setAttribute("aria-expanded", "false");
-      answer.classList.add("hidden");
-      answer.classList.remove("block");
-    } else {
-      button.setAttribute("aria-expanded", "true");
-      answer.classList.remove("hidden");
-      answer.classList.add("block");
-    }
-  });
-});
-
-</script>

templates/partials/home/grid_stats.html

@@ -3,7 +3,7 @@
     <div class="mx-auto max-w-7xl px-6 lg:px-8">
       <div class="mx-auto max-w-2xl lg:max-w-none">
         <div class="text-center">
-          <h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">Proven by a Global Community</h2>
+          <h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-white sm:text-5xl">A Global Community</h2>
           <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">With ThreeFold, individuals, organizations, communities, countries, and network states deploy their own sovereign infrastructure. The ThreeFold Grid has been live and operational since 2017.</p>
           <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Version 3.14 is live on Mainnet.</p>
         </div>
@@ -21,11 +21,14 @@
               <dd class="order-first text-3xl font-semibold tracking-tight text-white">1596</dd>
             </div>
             <div class="fade-in flex flex-col bg-white/5 p-8">
-              <dt class="text-sm/6 font-semibold text-gray-300">Countries</dt>
+              <dt class="text-sm/6 font-semibold text-gray-300">COUNTRIES</dt>
               <dd class="order-first text-3xl font-semibold tracking-tight text-white">40+</dd>
             </div>
           </dl>
       </div>
+
+      <p class="flex items-center justify-center mt-8 text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">To build Web 4, we need +1,000,000 Nodes</p>
+
     </div>
     <div class="mt-12 flex items-center justify-center gap-x-6">
       <a href="https://dashboard.grid.tf/#/tf-grid/node-statistics/" target="_blank" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2 mt-8">Explore Grid Capacity</a>

templates/partials/home/hero.html

@@ -1,12 +1,12 @@
 <div class="relative isolate overflow-hidden bg-transparent">
     <div class="px-6 lg:pt-32 mt-12 pt-24 lg:pb-24 pb-12 sm:px-6 lg:px-8">
       <div class="mx-auto max-w-4xl text-center">
-        <h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">A Self-Healing Data, Network and Cloud Platform</h2>
+        <h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">We are Building Web 4</h2>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Imagine a system built to scale to a planetary level, seamlessly compatible with AI, Cloud, Web2, Web3, and Edge IT workloads. A system that is resilient to unforeseen events, provides 100% uptime, and enables any machine and human to communicate over the shortest, most direct path possible.</p>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">That's <span class="font-semibold">ThreeFold.</span></p>
         <div class="mt-12 flex items-center justify-center gap-x-6">
           <a href="https://docs.threefold.io" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2">Get Started</a>
-          <a href="/solutions" target="_blank" class=" fade-in text-sm/6 font-semibold text-white hover:text-gray-400">See Solutions <span aria-hidden="true">→</span></a>
+          <a href="/solutions" target="_blank" class=" fade-in text-sm/6 font-semibold text-white hover:text-gray-400">What We've Built <span aria-hidden="true">→</span></a>
         </div>
       </div>
     </div>

templates/partials/solutions/hero.html

@@ -1,7 +1,7 @@
 <div class="relative isolate overflow-hidden bg-transparent">
     <div class="px-6 lg:pt-32 mt-12 pt-24 lg:pb-24 pb-12 sm:px-6 lg:px-8">
       <div class="mx-auto max-w-4xl text-center">
-        <h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">A Secure & Sovereign Infrastructure Layer for the Internet</h2>
+        <h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">A Secure & Sovereign Infrastructure Layer for Web 4</h2>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Our unique technology enables a system which can scale to a planetary level, can store data which can never be corrupted nor lost, is compatible with AI, Cloud, Web2, Web3 and Edge IT workloads, has the potential to recover from unforeseen events, and provide 100% uptime.             .</p>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-medium text-gray-200 fade-in">ThreeFold can be used by any Web2, Web3, AI, or Edge IT workload.
         </p>

templates/partials/why/hero.html

@@ -1,7 +1,7 @@
 <div class="relative isolate overflow-hidden bg-transparent">
     <div class="px-6 lg:pt-32 mt-12 pt-24 lg:pb-24 pb-12 sm:px-6 lg:px-8">
       <div class="mx-auto max-w-4xl text-center">
-        <h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">We are building a New Internet</h2>
+        <h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">We are building Web 4</h2>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">The Internet brings the world together, yet much of it is now concentrated in the hands of a few powerful corporations. This wasn't its original purpose. The Internet was envisioned as a decentralized, open space—a tool for freedom, collaboration, and equal access for all.</p>
         <p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-medium text-gray-200 fade-in">ThreeFold has invented a new Data, Network  and Cloud system<br> 
           as an Engine for an Upgraded Internet.</p>

templates/partials/why/timeline.html

@@ -67,11 +67,11 @@
             </div>
             <div class="font-semibold text-lg text-white mb-2">ThreeFold Commercialization</div>
             <div class="text-gray-200 font-light">
-                +1 Million Nodes
+                Launch Web 4
-                <br>Open Source Mode & Commercial Mode
+                <br>Introduce a Web4 Phone & Router
-                <br>Version 3 (TFT) & Version 4 (INCA) 12.12.24
+                <br>Introduce the unbreakable network and storage layer for Web 4
-                <br>Service Levels & Supportability
+                <br>Build a network of commercial farmers for optimal performance and uptime
-                <br>Launch our Gen 4 Token on DePIN ecosystem
+                <br>Expand the network to +1 Million Nodes
             </div>
         </div>
     </div>