https://legateca.com/

1<!doctype html>
2<html lang="en">
3  <head>
4    <meta charset="utf-8" />
5
6    <!-- Viewport -->
7    <meta name="viewport" content="width=device-width, initial-scale=1" />
8
9    <!-- Theme / SEO / -->
10    <meta name="theme-color" content="#000000" />
11    <meta name="author" content="Legateca" />
12    <meta
13      name="google-site-verification"
14      content="nCAAX-kxS0FKn5BwhV_UKqHngqv8BMNMZd5cPzQ4HdI"
15    />
16
17    <title>Legateca</title>
18
19    <!-- Favicon -->
20    <link rel="icon" href="/favicon.ico" />
21    <link rel="apple-touch-icon" href="/logo192.png" />
22
23    <!-- ========================= -->
24    <!-- ✅ LCP-CRITICAL PRECONNECTS -->
25    <!-- ========================= -->
26    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
27    <link
28      rel="preconnect"
29      href="https://legateca-public-files-prod.s3.eu-west-2.amazonaws.com"
30      crossorigin
31    />
32    <link rel="preconnect" href="https://api.legateca.com" crossorigin />
33
34    <!-- ========================= -->
35    <!-- ✅ GOOGLE FONTS (NO CLS) -->
36    <!-- ========================= -->
37    <link
38      rel="stylesheet"
39      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap"
40      media="print"
41      onload="this.media = 'all'"
42    />
43    <noscript>
44      <link
45        rel="stylesheet"
46        href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap"
47      />
48    </noscript>
49
50    <!-- ========================= -->
51    <!-- BASE STYLES (NO CLS) -->
52    <!-- ========================= -->
53    <style>
54      /* ===== HERO LCP CRITICAL CSS (STEP 1 + 2) ===== */
55
56      /* Lock hero height early to prevent CLS */
57      html,
58      body,
59      #root {
60        height: 100%;
61        margin: 0;
62      }
63
64      /* Prevent font swap CLS */
65      body {
66        font-family:
67          "Montserrat",
68          system-ui,
69          -apple-system,
70          BlinkMacSystemFont,
71          "Segoe UI",
72          Roboto,
73          sans-serif;
74      }
75      .background-cls {
76        min-height: 500px;
77        background-position: center;
78        background-size: cover;
79        background-repeat: no-repeat;
80      }
81
82      /* Ensure heading paints immediately (no font blocking) */
83      .background-cls h2,
84      .background-cls > div {
85        color: #ffffff;
86        text-align: center;
87        font-weight: 500;
88        font-size: 32px;
89        line-height: 1.2;
90      }
91
92      /* Prevent layout jump before Tailwind loads */
93      @media (min-width: 768px) {
94        .background-cls h2,
95        .background-cls > div {
96          font-size: 42px;
97        }
98      }
99    </style>
100
101    

101<script>
102      (function () {
103        const links = document.querySelectorAll(
104          'link[rel="stylesheet"][href^="/assets/"]'
105        );
106
107        links.forEach(link => {
108          // Skip Google Fonts etc
109          if (link.href.includes("fonts.googleapis")) return;
110
111          link.media = "print";
112          link.onload = () => {
113            link.media = "all";
114          };
115        });
116      })();
117    </script>

117
118    

118<script type="module" crossorigin src="/assets/index-BLUlY5na.js"></script>

118
119    <link rel="modulepreload" crossorigin href="/assets/vendor-lodash-B3EhnKIF.js">
120    <link rel="modulepreload" crossorigin href="/assets/vendor-CNlRBQKV.js">
121    <link rel="stylesheet" crossorigin href="/assets/vendor-DmE3OEjx.css">
122    <link rel="stylesheet" crossorigin href="/assets/index-kacBJov9.css">
123  </head>
124
125  <body>
126    <!-- GTM noscript -->
127       <div id="ssr-article-shell" hidden>
128    <div class="ssr-hero">
129      <img
130        src="https://legateca-public-files-prod.s3.eu-west-2.amazonaws.com/articles.webp"
131        alt=""
132        width="1200"
133        height="630"
134        fetchpriority="high"
135      />
136      <h1></h1>
137    </div>
138
139    <div class="ssr-content">
140      <p></p>
141    </div>
142  </div>

142
143
144    <noscript>
145      <iframe
146        src="https://www.googletagmanager.com/ns.html?id=

146GTM-WFFXQ5MK

146"
147        height="0"
148        width="0"
149        style="display: none; visibility: hidden"
150      ></iframe>
151    </noscript>
152
153    

153<noscript>You need to enable JavaScript to run this app.</noscript>
154
155    <!-- React root -->
156    <div id="root"></div>
157
158    <!-- ========================= -->
159    <!-- MAIN APP SCRIPT -->
160    <!-- ========================= -->
161
162    <!-- ========================= -->
163    <!-- GTM (IDLE LOAD – SAFE) -->
164    <!-- ========================= -->
165    

165<script>
166      window.dataLayer = window.dataLayer || [];
167      window.dataLayer.push({
168        "gtm.start": new Date().getTime(),
169        event: "gtm.js",
170      });
171
172      function loadGTM() {
173        var gtm = document.createElement("script");
174        gtm.async = true;
175        gtm.src = "https://www.googletagmanager.com/gtm.js?id=GTM-WFFXQ5MK";
176        document.head.appendChild(gtm);
177      }
178
179      if ("requestIdleCallback" in window) {
180        requestIdleCallback(loadGTM);
181      } else {
182        window.addEventListener("load", loadGTM);
183      }
184    </script>

184
185  </body>
186</html>