Added new content

css/main.css

@@ -41,9 +41,9 @@ body[data-theme=dark] {
 p,
 strong {
   font-size: 0.9rem;
-  max-width: 65ch;
+  max-width: 70ch;
   line-height: 1.7;
-  color: rgba(var(--text-color), 0.9);
+  color: rgba(var(--text-color), 0.8);
 }
 
 img {
@@ -183,7 +183,7 @@ article > * {
   transition: width 0.3s;
   margin: auto;
 }
-#main_header ul a.active::after, #main_header ul a:hover::after {
+#main_header ul a.active::after {
   width: 1rem;
 }
 #main_header ul .icon {
@@ -252,7 +252,7 @@ section:nth-of-type(4) p {
 
 #el_salvador_map {
   position: absolute;
-  opacity: 0.1;
+  opacity: 0.06;
   top: 0;
   width: max(100vh, 90vw);
   height: auto;
@@ -428,7 +428,6 @@ section:nth-of-type(4) p {
 #news_list {
   display: grid;
   gap: 0.5rem;
-  grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
 }
 #news_list li {
   container: news-item/inline-size;
@@ -517,6 +516,11 @@ section:nth-of-type(4) p {
     display: none !important;
   }
 }
+@media screen and (any-hover: hover) {
+  #main_header ul a:hover::after {
+    width: 1rem;
+  }
+}
 .hidden {
   display: none;
 }

css/main.scss

@@ -39,9 +39,9 @@ body[data-theme="dark"] {
 p,
 strong {
   font-size: 0.9rem;
-  max-width: 65ch;
+  max-width: 70ch;
   line-height: 1.7;
-  color: rgba(var(--text-color), 0.9);
+  color: rgba(var(--text-color), 0.8);
 }
 img {
   width: 100%;
@@ -151,8 +151,7 @@ article {
         transition: width 0.3s;
         margin: auto;
       }
-      &.active,
+      &.active {
-      &:hover {
         &::after {
           width: 1rem;
         }
@@ -220,7 +219,7 @@ section {
 }
 #el_salvador_map {
   position: absolute;
-  opacity: 0.1;
+  opacity: 0.06;
   top: 0;
   width: max(100vh, 90vw);
   height: auto;
@@ -394,7 +393,6 @@ section {
 #news_list {
   display: grid;
   gap: 0.5rem;
-  grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
   li {
     container: news-item / inline-size;
   }
@@ -474,6 +472,17 @@ section {
   }
 }
 
+@media screen and (any-hover: hover) {
+  #main_header {
+    ul {
+      a:hover {
+        &::after {
+          width: 1rem;
+        }
+      }
+    }
+  }
+}
 .hidden {
   display: none;
 }

index.html

@@ -52,9 +52,31 @@
         </section>
         <section id="el_salvador_section">
             <img src="assets/svg/el-salvador.svg" alt="" id="el_salvador_map">
-            <div class="grid">
+            <div class="grid gap-2">
-                <h4>Why</h4>
+                <div class="grid">
-                <h2>El Salvador?</h2>
+                    <h4>Why</h4>
+                    <h2>El Salvador?</h2>
+                </div>
+                <div class="grid gap-1">
+                    <p>
+                        El Salvador is the first country to fully legalize Bitcoin with constitutional protections and
+                        no
+                        taxes on capital gains. They have established a comprehensive regulatory system for digital
+                        assets
+                        and aim to become a physical base for incubating and scaling new digital ideas using blockchain
+                        technology.
+                    </p>
+                    <p>
+                        By being an early adopter, El Salvador is gaining a first mover advantage in the crypto space
+                        for
+                        itself and its entrepreneurs.
+                    </p>
+                    <p>
+                        They are also creating a global community of crypto enthusiasts
+                        and
+                        becoming a focal point for crypto infrastructure worldwide.
+                    </p>
+                </div>
             </div>
         </section>
         <section>
@@ -87,6 +109,34 @@
 
             </div>
         </section>
+        <section>
+            <h4 class="section-header">
+                Methodology
+            </h4>
+            <div class="grid gap-1 justify-content-center text-center">
+                <p>
+                    The process involves identifying a token project and creating an initial white paper. The economic
+                    system is designed to ensure the token gains valuation through regular operations without relying
+                    solely
+                    on consistent investments.
+                </p>
+                <p>
+                    A core group of individuals knowledgeable in business and technology is
+                    formed. A small pilot is conducted to test the technology and address financial issues.
+                    Regulatory
+                    infrastructure and permissions are established. Market proof of concept is created to attract more
+                    participants over time.
+                </p>
+                <p>
+                    Once the proof of concept is successful, the initial token system is upgraded to
+                    a larger system with bigger investors.
+                </p>
+                <p>
+                    Finally, as the token gains critical mass and becomes
+                    self-sufficient, the core management is decentralized.
+                </p>
+            </div>
+        </section>
         <section>
             <h4 class="section-header">
                 Structure