updating overview.md

styling, file paths

Author: Jaime-N

docs/agglayer/overview.md

@@ -21,30 +21,30 @@ hide:
    </div>
 </div>
 
-<div class="hero-left" style="text-align: center;">
+<div class="hero-left" style="max-width: 85%; margin: 0 auto; padding: 20px; text-align: left;">
    <p class="hero-subtext">The Agglayer is an in-development interoperability protocol that allows for trustless, cross-chain token transfers and message-passing, as well as more complex operations. The safety of the Agglayer is provided by ZK proofs.</p>
    <p class="hero-subtext">The latest version of the Agglayer (v0.2) connects chains built with Polygon CDK, a developer toolkit for designing ZK-powered Layer 2s. Coming versions will support interoperability among additional blockchain architectures, including existing L2s, appchains, and non-EVM chains.</p>
 </div>
 
 <div class="grid-container">
    <div class="grid-item">
-    <a href="agglayer/architecture/overview.md">
+    <a href="./architecture/overview/">
         <div class="product-list-item-header">
             <div class="feature-card-heading">Agglayer Architecture</div>
         </div>
         <p class="feature-paragraph">A high-level overview of the Agglayer’s components and their functions</p>
     </a>
 </div>
 <div class="grid-item">
-    <a href="../crosschain-interop/crosschain-interop.md">
+    <a href="./crosschain-interop/crosschain-interop/">
         <div class="product-list-item-header">
             <div class="feature-card-heading">Cross-chain Interop</div>
         </div>
         <p class="feature-paragraph">Learn how to use <code>bridgeAndCall()</code> for cross-chain interactions</p>
     </a>
 </div>
 <div class="grid-item">
-    <a href="agglayer/architecture/pessimistic-proof.md">
+    <a href="./architecture/pessimistic-proof/">
         <div class="product-list-item-header">
             <div class="feature-card-heading">Pessimistic Proof</div>
         </div>