PageSourceSearch

https://blutui.com/articles

html blutui.com collected 2026-10-02 14:58:21 UTC 178,549 bytes, 2,486 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en-NZ" class="js">
3  <head>
4    <meta charset="UTF-8" />
5    <meta name="viewport" content="width=device-width, initial-scale=1" />
6
7        <title>Agency Web Production Articles: Economics, AI and the Web · Blutui</title>
8<meta name="description" content="Articles from Blutui on agency economics, AI and the way the web gets made. Practical thinking on web production for agencies and the teams they work with." /><meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
9<link rel="canonical" href="https://blutui.com/articles" />
10
11<meta property="og:type" content="website" />
12<meta property="og:site_name" content="Blutui" />
13<meta property="og:locale" content="en_NZ" />
14<meta property="og:url" content="https://blutui.com/articles" />
15<meta property="og:title" content="Agency Web Production Articles: Economics, AI and the Web" />
16<meta property="og:description" content="Articles from Blutui on agency economics, AI and the way the web gets made. Practical thinking on web production for agencies and the teams they work with." />
17<meta property="og:image" content="https://cdn.blutui.com/uploads/blutui_27/opengraph/articles.jpg?width=1200" />
18<meta property="og:image:width" content="1200" />
19<meta property="og:image:height" content="630" />
20<meta property="og:image:alt" content="Blutui Articles: thinking on agency economics, AI and the web" />
21<meta name="twitter:card" content="summary_large_image" />
22<meta name="twitter:site" content="@blutui" />
23<meta name="twitter:title" content="Agency Web Production Articles: Economics, AI and the Web" />
24<meta name="twitter:description" content="Articles from Blutui on agency economics, AI and the way the web gets made. Practical thinking on web production for agencies and the teams they work with." />
25<meta name="twitter:image" content="https://cdn.blutui.com/uploads/blutui_27/opengraph/articles.jpg?width=1200" />
26<meta name="twitter:image:alt" content="Blutui Articles: thinking on agency economics, AI and the web" />
27<script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://blutui.com/#organization","name":"Blutui","url":"https://blutui.com/","description":"Blutui is the website platform for digital agencies: build in code, let clients edit in place and manage hosting, domains and delivery from one project.","logo":{"@type":"ImageObject","url":"https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/favicons/apple-touch-icon.png?v=1790637625","width":180,"height":180},"sameAs":["https://x.com/blutui","https://www.linkedin.com/company/blutui","https://discord.gg/VZZnQeeEv6","https://www.youtube.com/@useBlutui","https://github.com/blutui"]},{"@type":"WebSite","@id":"https://blutui.com/#website","url":"https://blutui.com/","name":"Blutui","inLanguage":"en-NZ","publisher":{"@id":"https://blutui.com/#organization"}},{"@type":"CollectionPage","@id":"https://blutui.com/articles#webpage","url":"https://blutui.com/articles","name":"Agency Web Production Articles: Economics, AI and the Web","description":"Articles from Blutui on agency economics, AI and the way the web gets made. Practical thinking on web production for agencies and the teams they work with.","inLanguage":"en-NZ","isPartOf":{"@id":"https://blutui.com/#website"},"publisher":{"@id":"https://blutui.com/#organization"},"image":"https://cdn.blutui.com/uploads/blutui_27/opengraph/articles.jpg?width=1200","primaryImageOfPage":{"@type":"ImageObject","url":"https://cdn.blutui.com/uploads/blutui_27/opengraph/articles.jpg?width=1200"},"dateModified":"2026-09-29"}]}</script>
27
28
29<script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","@id":"https://blutui.com/articles#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://blutui.com/"},{"@type":"ListItem","position":2,"name":"Articles","item":"https://blutui.com/articles"}]}</script>
29
30            <meta name="theme-color" content="#000b5a" />
31
32        <link rel="icon" href="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/favicons/favicon.ico?v=1790637625" sizes="32x32" />
33    <link rel="icon" href="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/favicons/favicon.svg?v=1790637626" type="image/svg+xml" />
34    <link rel="apple-touch-icon" href="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/favicons/apple-touch-icon.png?v=1790637625" />
35    <link rel="manifest" href="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/favicons/site.webmanifest?v=1790637626" />
36
37        
37<script>
38      if (/[?&]blutui_editor=true/.test(location.search)) document.documentElement.classList.add("canopy-edit");
39      else document.documentElement.classList.add("reveal");
40    </script>
40
41
42        <link rel="preload" href="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/fonts/space-grotesk-latin.woff2?v=1790712779" as="font" type="font/woff2" crossorigin />
43    <style>
44      @font-face { font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap; src: url(https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/fonts/space-grotesk-latin.woff2?v=1790712779) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2190-2199,U+2212,U+2215,U+FEFF,U+FFFD; }
45      @font-face { font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap; src: url(https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/fonts/space-grotesk-latin-ext.woff2?v=1790712779) format("woff2"); unicode-range: U+0100-0130,U+0132-0151,U+0154-0180,U+018F,U+0192,U+01A0-01A1,U+01AF-01B0,U+01C4-01DC,U+01E6-01E7,U+01EA-01EB,U+01FA-021B,U+022A-022D,U+0230-0233,U+0237,U+0243,U+0251,U+0259,U+02B9-02BA,U+02BE-02BF,U+02C7-02CC,U+02D8-02D9,U+02DB,U+02DD,U+0300-0303,U+0306-0307,U+0309-030C,U+030F,U+0311-0312,U+031B,U+0323-0324,U+0326-0328,U+032E,U+0331,U+0335-0338,U+0394,U+03A9,U+03C0,U+0E3F,U+1E08-1E09,U+1E0C-1E0F,U+1E14-1E17,U+1E1C-1E1D,U+1E20-1E21,U+1E24-1E25,U+1E2A-1E2B,U+1E2E-1E2F,U+1E36-1E3B,U+1E42-1E49,U+1E4C-1E53,U+1E5A-1E69,U+1E6C-1E6F,U+1E78-1E7B,U+1E80-1E85,U+1E8E-1E8F,U+1E92-1E93,U+1E97,U+1E9E,U+1EA0-1EF9,U+2070-2071,U+2074-2079,U+207D-2089,U+208D-208E,U+2094,U+20A1,U+20A3-20A4,U+20A6-20A7,U+20A9,U+20AB,U+20AD,U+20B1-20B2,U+20B5,U+20B9-20BA,U+20BC-20BD,U+20BF,U+2113,U+2116,U+2120,U+2126,U+212E,U+2153-2154,U+215B-215E,U+2202,U+2205-2206,U+220F,U+2211,U+2219-221A,U+221E,U+222B,U+2248,U+2260,U+2264-2265,U+25CA,U+27E8-27E9,U+FB00-FB04; }
46    </style>
47    <link href="https://fonts.bunny.net/css?family=inter:400,500,600,700&display=swap" rel="stylesheet" media="print" onload="this.media='all'" />
48    <noscript><link href="https://fonts.bunny.net/css?family=inter:400,500,600,700&display=swap" rel="stylesheet" /></noscript>
49
50    <link href="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/styles/global.css?v=1790889131" rel="stylesheet" type="text/css" media="all" />
51
52      <link rel="preconnect" href="https://www.googletagmanager.com">
53<link rel="dns-prefetch" href="https://www.googletagmanager.com">
54<link rel="preconnect" href="https://www.google-analytics.com/">
55<link rel="dns-prefetch" href="https://www.google-analytics.com/">
56
57<script>
vendor: 334 bytes, lines 57-61
57(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
58	new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
59  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
60  'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
61  })(window,document,'script','dataLayer','
61GTM-MQL227F
vendor: 4 bytes, line 61
61');
62</script>
62</head>
63  <body class="relative min-h-svh font-sans antialiased bg-navy-950">
vendor: 69 bytes, lines 63-64
63<noscript>
64	<iframe src="https://www.googletagmanager.com/ns.html?id=
64GTM-MQL227F
vendor: 92 bytes, lines 64-66
64" height="0" width="0" style="display:none;visibility:hidden"></iframe>
65</noscript>
66        
66<div
67  data-hero-shader
68    aria-hidden="true"
69  class="pointer-events-none absolute inset-x-0 top-0 -z-10 select-none"
70></div>
71
72    
73<header data-header class="fixed top-0 z-50 w-full">
74  <div class="container-site relative flex items-center justify-between pt-4 pb-3">
75
76        <div class=" flex h-12 items-center gap-10 wip-frame bg-midnight border border-white/15 px-5 lg:pr-3">
77      <a href="/" aria-label="Blutui home" class="flex shrink-0 items-center text-white">
78        <svg class="h-6 w-auto" viewBox="0 0 123 34" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Blutui">
79<path d="M21.8963 17.0008C22.7384 16.2765 23.4493 15.4068 23.9966 14.4315C24.821 12.9736 25.255 11.3199 25.255 9.63659C25.255 7.95327 24.8209 6.29959 23.9964 4.8417C23.1719 3.3838 21.986 2.17304 20.5578 1.33105C19.1297 0.489064 17.5096 0.0454993 15.8603 0.0449219H0.558237C0.459989 0.0454288 0.363594 0.0722577 0.278695 0.122725C0.193795 0.173192 0.123369 0.245528 0.0744601 0.332497C0.0255513 0.419465 -0.000124805 0.518016 4.56131e-07 0.618292C0.000125718 0.718568 0.0260478 0.817052 0.0751737 0.903893L7.72618 14.4315C8.27256 15.4075 8.98358 16.2773 9.82646 17.0008C8.98302 17.7246 8.27193 18.5953 7.72618 19.5724L0.0751737 33.0962C0.0259541 33.1832 2.98221e-05 33.2819 3.88981e-06 33.3824C-2.20424e-05 33.4828 0.0258514 33.5815 0.0750261 33.6686C0.124201 33.7556 0.194946 33.8279 0.280158 33.8782C0.365369 33.9285 0.462049 33.955 0.560488 33.9551H15.8625C17.5141 33.9661 19.1387 33.5279 20.5695 32.6858C22.0002 31.8437 23.1854 30.6279 24.0033 29.1634C25.7038 26.1578 25.7038 22.5726 24.0033 19.5724C23.4543 18.5956 22.7411 17.7251 21.8963 17.0008ZM15.738 29.5079H7.59416C7.54812 29.5073 7.50305 29.4944 7.46342 29.4705C7.42378 29.4466 7.39096 29.4125 7.36821 29.3716C7.34547 29.3308 7.33359 29.2845 7.33375 29.2375C7.33391 29.1905 7.34611 29.1444 7.36913 29.1037L11.5037 21.7963C12.0606 20.8205 12.9166 20.0587 13.9396 19.6283C14.9626 19.1978 16.0959 19.1227 17.1649 19.4145C18.2338 19.7063 19.1791 20.3487 19.855 21.2429C20.531 22.137 20.9001 23.2332 20.9054 24.3625C20.9033 25.3031 20.6485 26.2251 20.1688 27.0283C19.2409 28.5977 17.5322 29.5079 15.738 29.5079ZM7.36613 4.89788C7.34305 4.85724 7.33082 4.81114 7.33064 4.76417C7.33046 4.7172 7.34234 4.671 7.36511 4.63019C7.38788 4.58937 7.42073 4.55535 7.46039 4.53153C7.50006 4.50771 7.54514 4.49492 7.59116 4.49442H15.8573C16.7416 4.49393 17.6105 4.73107 18.3767 5.18199C19.1428 5.63291 19.7791 6.28172 20.2216 7.06321C20.6641 7.84469 20.8973 8.73131 20.8977 9.63392C20.898 10.5365 20.6655 11.4233 20.2236 12.2052C19.7817 12.987 19.1459 13.6364 18.3802 14.0879C17.6144 14.5395 16.7457 14.7773 15.8613 14.7776C14.9769 14.7778 14.1081 14.5404 13.3421 14.0893C12.5761 13.6382 11.94 12.9892 11.4977 12.2076L7.36613 4.89788Z" fill="url(#logo-header)"/>
80<path d="M55.5704 21.2543C55.5704 27.0561 50.8537 31.7727 45.052 31.7727C44.2689 31.7727 43.3873 31.6679 42.5179 31.4706C41.1738 31.1685 40.3292 29.8306 40.6374 28.4803C40.9396 27.1362 42.2836 26.2916 43.6277 26.5998C44.1333 26.7108 44.6389 26.7786 45.0581 26.7786C48.1039 26.7786 50.5824 24.3001 50.5824 21.2543C50.5824 18.2085 48.1039 15.73 45.0581 15.73C42.0124 15.73 39.54 18.2085 39.54 21.2543C39.54 22.6354 38.424 23.7514 37.0429 23.7514C35.6619 23.7514 34.5459 22.6354 34.5459 21.2543V5.02048C34.5459 3.6394 35.6619 2.52344 37.0429 2.52344C38.424 2.52344 39.54 3.6394 39.54 5.02048V12.302C41.1492 11.3093 43.0358 10.7359 45.0581 10.7359C50.8599 10.7359 55.5765 15.4526 55.5765 21.2543H55.5704Z" fill="currentColor"/>
81<path d="M60.539 31.7657C59.158 31.7657 58.042 30.6497 58.042 29.2686V7.12204C58.042 5.74096 59.158 4.625 60.539 4.625C61.9201 4.625 63.0361 5.74096 63.0361 7.12204V29.2748C63.0361 30.6559 61.9201 31.7718 60.539 31.7718V31.7657Z" fill="currentColor"/>
82<path d="M74.9733 31.7673C70.1457 31.7673 66.0703 27.8706 66.0703 23.2527V13.2275C66.0703 11.8464 67.1863 10.7305 68.5673 10.7305C69.9484 10.7305 71.0644 11.8464 71.0644 13.2275V23.2527C71.0644 25.0962 72.9264 26.767 74.9733 26.767C77.0203 26.767 78.8823 25.09 78.8823 23.2527V13.2275C78.8823 11.8464 79.9982 10.7305 81.3793 10.7305C82.7604 10.7305 83.8764 11.8464 83.8764 13.2275V23.2527C83.8764 27.8645 79.8009 31.7673 74.9733 31.7673Z" fill="currentColor"/>
83<path d="M113.557 13.2328V23.258C113.557 27.8759 109.476 31.7726 104.654 31.7726C99.8328 31.7726 95.7512 27.8759 95.7512 23.258V15.7298H91.6943V29.2755C91.6943 30.6566 90.5783 31.7726 89.1972 31.7726C87.8162 31.7726 86.7002 30.6566 86.7002 29.2755V6.83914C86.7002 5.45806 87.8162 4.33594 89.1972 4.33594C90.5783 4.33594 91.6943 5.4519 91.6943 6.83914V10.7358H98.0694C98.0694 10.7358 98.1311 10.7358 98.1558 10.7358C98.1866 10.7358 98.2174 10.7358 98.2421 10.7358C99.6231 10.7358 100.745 11.8517 100.745 13.2328V23.258C100.745 25.1014 102.607 26.7785 104.654 26.7785C106.701 26.7785 108.563 25.1014 108.563 23.258V13.2328C108.563 11.8517 109.679 10.7358 111.06 10.7358C112.441 10.7358 113.563 11.8517 113.563 13.2328H113.557Z" fill="currentColor"/>
84<path d="M118.902 31.7673C117.521 31.7673 116.405 30.6513 116.405 29.2702V13.2275C116.405 11.8464 117.521 10.7305 118.902 10.7305C120.283 10.7305 121.399 11.8464 121.399 13.2275V29.2702C121.399 30.6513 120.283 31.7673 118.902 31.7673Z" fill="currentColor"/>
85<path d="M118.933 8.73161C120.493 8.73161 121.757 7.46735 121.757 5.9078C121.757 4.34825 120.493 3.08398 118.933 3.08398C117.374 3.08398 116.109 4.34825 116.109 5.9078C116.109 7.46735 117.374 8.73161 118.933 8.73161Z" fill="currentColor"/>
86<defs>
87<linearGradient id="logo-header" x1="-0.00433668" y1="17" x2="25.2747" y2="
8717" gradientUnits="userSpaceOnUse">
88<stop stop-color="#247BFF"/>
89<stop offset="1" stop-color="#65BADB"/>
90</linearGradient>
91</defs>
92</svg>
93
94      </a>
95
96      <nav class="hidden items-center lg:flex" aria-label="Main">
97                                        <button
98              type="button"
99              data-nav-toggle="platform"
100              data-roll-trigger
101              aria-expanded="false"
102              aria-controls="nav-panel-platform"
103              class="group flex items-center gap-1.5 px-3 py-2 text-xs font-bold tracking-wide uppercase text-white transition hover:text-neutral-400 aria-expanded:text-neutral-400"
104            >
105              <span data-text-roll>Platform</span>
106              <svg class="size-2.5 transition-transform duration-200 group-aria-expanded:rotate-180" viewBox="0 0 12 12" fill="none" aria-hidden="true">
107                <path d="M2.5 4.5L6 8l3.5-3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
108              </svg>
109            </button>
110                                                  <button
111              type="button"
112              data-nav-toggle="solutions"
113              data-roll-trigger
114              aria-expanded="false"
115              aria-controls="nav-panel-solutions"
116              class="group flex items-center gap-1.5 px-3 py-2 text-xs font-bold tracking-wide uppercase text-white transition hover:text-neutral-400 aria-expanded:text-neutral-400"
117            >
118              <span data-text-roll>Solutions</span>
119              <svg class="size-2.5 transition-transform duration-200 group-aria-expanded:rotate-180" viewBox="0 0 12 12" fill="none" aria-hidden="true">
120                <path d="M2.5 4.5L6 8l3.5-3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
121              </svg>
122            </button>
123                                                  <button
124              type="button"
125              data-nav-toggle="resources"
126              data-roll-trigger
127              aria-expanded="false"
128              aria-controls="nav-panel-resources"
129              class="group flex items-center gap-1.5 px-3 py-2 text-xs font-bold tracking-wide uppercase text-white transition hover:text-neutral-400 aria-expanded:text-neutral-400"
130            >
131              <span data-text-roll>Resources</span>
132              <svg class="size-2.5 transition-transform duration-200 group-aria-expanded:rotate-180" viewBox="0 0 12 12" fill="none" aria-hidden="true">
133                <path d="M2.5 4.5L6 8l3.5-3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
134              </svg>
135            </button>
136                                                  <a
137              href="/pricing"
138              data-roll-trigger
139              class="px-3 py-2 text-xs font-bold tracking-wide uppercase text-white transition hover:text-neutral-400"
140            >
141              <span data-text-roll>Pricing</span>
142            </a>
143                        </nav>
144    </div>
145
146        <div class="hidden items-center gap-7 lg:flex">
147              <a
148          href="https://console.blutui.com/login"
149          data-roll-trigger
150          class="text-xs font-bold tracking-wide uppercase text-white transition hover:text-neutral-400"
151        >
152          <span data-text-roll>Login</span>
153        </a>
154                    <div class="wip-frame ">
155          <a
156            href="https://console.blutui.com/register"
157            data-roll-trigger
158            class="block bg-citron-400 px-6 py-3 text-xs font-bold tracking-wide uppercase text-navy-900 transition hover:bg-citron-300"
159          >
160            <span data-text-roll>Start creating</span>
161          </a>
162        </div>
163          </div>
164
165        <div class="flex items-center lg:hidden">
166      <button
167        type="button"
168        data-mobile-toggle
169        aria-expanded="false"
170        aria-controls="mobile-menu"
171        aria-label="Open menu"
172        class="-mr-2 p-2 text-white"
173      ><svg class="size-6" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" aria-hidden="true">
174          <path d="M4 7h16" />
175          <path d="M4 12h16" />
176          <path d="M4 17h16" />
177        </svg>
178      </button>
179    </div>
180
181                            <div
182          id="nav-panel-platform"
183          data-nav-panel="platform"
184          hidden
185          class="absolute top-full left-4 w-max max-w-[calc(100vw-2rem)] sm:left-6 lg:left-8 lg:max-w-[calc(var(--container-site)-4rem)]"
186        >
187          <div class="flex max-w-full flex-wrap gap-x-8 gap-y-6 border border-white/15 bg-midnight p-6 shadow-2xl shadow-black/40">
188                          <div class="w-[34rem]" data-menu-group style="--stagger: 0">
189                                <ul class="grid grid-cols-2 gap-x-8">
190                                      <li>
191                      <a href="/platform/agency" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
192                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
193                          Agency
194                                                  </span>
195                                                  <span class="mt-px block text-xs text-neutral-400">Projects, team, roles &amp; permissions, branding, domains, billing</span>
196                                              </a>
197                    </li>
198                                      <li>
199                      <a href="/platform/build" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
200                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
201                          Build
202                                                  </span>
203                                                  <span class="mt-px block text-xs text-neutral-400">Canvas, Courier, Cassettes, Context</span>
204                                              </a>
205                    </li>
206                                      <li>
207                      <a href="/platform/manage" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
208                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
209                          Manage
210                                                  </span>
211                                                  <span class="mt-px block text-xs text-neutral-400">Collections, forms, blogs, pages, assets, SEO, webhooks, route patterns</span>
212                                              </a>
213                    </li>
214                                      <li>
215                      <a href="/platform/edit" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
216                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
217                          Edit
218                                                  </span>
219                                                  <span class="mt-px block text-xs text-neutral-400">Canopy, blocks, in-page editing, review &amp; publish</span>
220                                              </a>
221                    </li>
222                                      <li>
223                      <a href="/platform/deliver" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
224                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
225                          Deliver
226                                                  </span>
227                                                  <span class="mt-px block text-xs text-neutral-400">Hosting, CDN, image optimisation, domains, SSL, password protection</span>
228                                              </a>
229                    </li>
230                                      <li>
231                      <a href="/platform/integrate" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
232                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
233                          Integrate
234                                                  </span>
235                                                  <span class="mt-px block text-xs text-neutral-400">Headless, webhooks, Context &amp; MCP</span>
236                                              </a>
237                    </li>
238                                  </ul>
239              </div>
240                      </div>
241        </div>
242                              <div
243          id="nav-panel-solutions"
244          data-nav-panel="solutions"
245          hidden
246          class="absolute top-full left-4 w-max max-w-[calc(100vw-2rem)] sm:left-6 lg:left-8 lg:max-w-[calc(var(--container-site)-4rem)]"
247        >
248          <div class="flex max-w-full flex-wrap gap-x-8 gap-y-6 border border-white/15 bg-midnight p-6 shadow-2xl shadow-black/40">
249                          <div class="w-40" data-menu-group style="--stagger: 0">
250                                  <p class="mb-2.5 text-[10px] font-bold tracking-widest uppercase text-neutral-400">By agency</p>
251                                <ul class="">
252                                      <li>
253                      <a href="/solutions/boutique-agency" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
254                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
255                          Boutique agency
256                                                  </span>
257                                              </a>
258                    </li>
259                                      <li>
260                      <a href="/solutions/mid-market-digital-agency" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
261                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
262                          Mid-market digital agency
263                                                  </span>
264                                                  <span class="mt-px block text-xs text-neutral-400">15–75 people</span>
265                                              </a>
266                    </li>
267                                      <li>
268                      <a href="/solutions/enterprise-and-full-service-agency" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
269                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
270                          Enterprise &amp; full-service agency
271                                                  </span>
272                                                  <span class="mt-px block text-xs text-neutral-400">75+ people</span>
273                                              </a>
274                    </li>
275                                      <li>
276                      <a href="/solutions/large-and-agency-groups" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
277                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
278                          Large &amp; agency groups
279                                                  </span>
280                                              </a>
281                    </li>
282                                      <li>
283                      <a href="/solutions/network-and-multi-region" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
284                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
285                          Network &amp; multi-region
286                                                  </span>
287                                              </a>
288                    </li>
289                                      <li>
290                      <a href="/solutions/in-house-brand" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
291                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
292                          In-house brand
293                                                  </span>
294                                              </a>
295                    </li>
296                                  </ul>
297              </div>
298                          <div class="w-40" data-menu-group style="--stagger: 1">
299                                  <p class="mb-2.5 text-[10px] font-bold tracking-widest uppercase text-neutral-400">By role</p>
300                                <ul class="">
301                                      <li>
302                      <a href="/solutions/engineering" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
303                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
304                          Engineering
305                                                  </span>
306                                              </a>
307                    </li>
308                                      <li>
309                      <a href="/solutions/agency-leadership" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
310                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
311                          Agency leadership
312                                                  </span>
313                                              </a>
314                    </li>
315                                      <li>
316                      <a href="/solutions/design" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
317                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
318                          Design
319                                                  </span>
320                                              </a>
321                    </li>
322                                      <li>
323                      <a href="/solutions/content-and-copywriting" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
324                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
325                          Content &amp; copywriting
326                                                  </span>
327                                              </a>
328                    </li>
329                                      <li>
330                      <a href="/solutions/marketing-and-seo" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
331                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
332                          Marketing &amp; SEO
333                                                  </span>
334                                              </a>
335                    </li>
336                                      <li>
337                      <a href="/solutions/project-management" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
338                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
339                          Project Management
340                                                  </span>
341                                              </a>
342                    </li>
343                                  </ul>
344              </div>
345                          <div class="w-40" data-menu-group style="--stagger: 2">
346                                  <p class="mb-2.5 text-[10px] font-bold tracking-widest uppercase text-neutral-400">By challenge</p>
347                                <ul class="">
348                                      <li>
349                      <a href="/solutions/resource-and-capacity" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
350                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
351                          Resource &amp; capacity
352                                                  </span>
353                                              </a>
354                    </li>
355                                      <li>
356                      <a href="/solutions/profitability-and-tracking" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
357                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
358                          Profitability &amp; tracking
359                                                  </span>
360                                              </a>
361                    </li>
362                                      <li>
363                      <a href="/solutions/scale-an-agency" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
364                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
365                          Scale an agency
366                                                  </span>
367                                              </a>
368                    </li>
369                                  </ul>
370              </div>
371                      </div>
372        </div>
373                              <div
374          id="nav-panel-resources"
375          data-nav-panel="resources"
376          hidden
377          class="absolute top-full left-4 w-max max-w-[calc(100vw-2rem)] sm:left-6 lg:left-8 lg:max-w-[calc(var(--container-site)-4rem)]"
378        >
379          <div class="flex max-w-full flex-wrap gap-x-8 gap-y-6 border border-white/15 bg-midnight p-6 shadow-2xl shadow-black/40">
380                          <div class="w-40" data-menu-group style="--stagger: 0">
381                                  <p class="mb-2.5 text-[10px] font-bold tracking-widest uppercase text-neutral-400">Developers</p>
382                                <ul class="">
383                                      <li>
384                      <a href="https://docs.blutui.com/docs" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
385                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
386                          Documentation
387                                                  </span>
388                                              </a>
389                    </li>
390                                      <li>
391                      <a href="https://docs.blutui.com" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
392                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
393                          Developer resources
394                                                  </span>
395                                              </a>
396                    </li>
397                                      <li>
398                      <a href="https://docs.blutui.com/guides" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
399                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
400                          Guides
401                                                  </span>
402                                              </a>
403                    </li>
404                                  </ul>
405              </div>
406                          <div class="w-40" data-menu-group style="--stagger: 1">
407                                  <p class="mb-2.5 text-[10px] font-bold tracking-widest uppercase text-neutral-400">Community</p>
408                                <ul class="">
409                                      <li>
410                      <a href="/articles" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
411                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
412                          Blog
413                                                  </span>
414                                              </a>
415                    </li>
416                                      <li>
417                      <a href="/transform" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
418                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
419                          Transform
420                                                  </span>
421                                              </a>
422                    </li>
423                                      <li>
424                      <a href="/changelog" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
425                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
426                          Changelog
427                                                  </span>
428                                              </a>
429                    </li>
430                                      <li>
431                      <a href="/ambassadors" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
432                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
433                          Ambassadors
434                                                  </span>
435                                              </a>
436                    </li>
437                                      <li>
438                      <a href="/labs" class="group -mx-2.5 block px-2.5 py-1.5 transition hover:bg-white/5">
439                        <span class="flex items-baseline gap-1.5 text-sm font-semibold text-white">
440                          Blutui Labs
441                                                  </span>
442                                              </a>
443                    </li>
444                                  </ul>
445              </div>
446                      </div>
447        </div>
448                            </div>
449
450    <div id="mobile-menu" data-mobile-menu hidden class="fixed inset-0 -z-10 flex flex-col bg-midnight pt-19 lg:hidden">
451    <nav class="min-h-0 flex-1 overflow-y-auto overscroll-contain border-t border-white/15" aria-label="Main">
452      <ul class="container-site">
453                            <li data-mobile-row class="border-b border-white/15" style="--stagger: 0">
454                          <details name="mobile-menu" class="group">
455                <summary class="flex cursor-pointer list-none items-center justify-between py-5 text-2xl font-bold tracking-tight uppercase text-white [&::-webkit-details-marker]:hidden">
456                  Platform
457                  <svg class="size-4 text-neutral-400 transition-transform duration-300 group-open:rotate-180" viewBox="0 0 12 12" fill="none" aria-hidden="true">
458                    <path d="M2.5 4.5L6 8l3.5-3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
459                  </svg>
460                </summary>
461                <div class="grid gap-x-8 gap-y-6 pb-7 sm:grid-cols-2">
462                  <div class="sm:col-span-2">
463                                            <ul class="grid gap-x-8 sm:grid-cols-2">
464                                                  <li>
465                            <a href="/platform/agency" class="block py-2 text-neutral-300 transition hover:text-white">
466                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
467                                Agency
468                                                              </span>
469                                                              <span class="mt-0.5 block text-sm text-neutral-400">Projects, team, roles &amp; permissions, branding, domains, billing</span>
470                                                          </a>
471                          </li>
472                                                  <li>
473                            <a href="/platform/build" class="block py-2 text-neutral-300 transition hover:text-white">
474                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
475                                Build
476                                                              </span>
477                                                              <span class="mt-0.5 block text-sm text-neutral-400">Canvas, Courier, Cassettes, Context</span>
478                                                          </a>
479                          </li>
480                                                  <li>
481                            <a href="/platform/manage" class="block py-2 text-neutral-300 transition hover:text-white">
482                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
483                                Manage
484                                                              </span>
485                                                              <span class="mt-0.5 block text-sm text-neutral-400">Collections, forms, blogs, pages, assets, SEO, webhooks, route patterns</span>
486                                                          </a>
487                          </li>
488                                                  <li>
489                            <a href="/platform/edit" class="block py-2 text-neutral-300 transition hover:text-white">
490                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
491                                Edit
492                                                              </span>
493                                                              <span class="mt-0.5 block text-sm text-neutral-400">Canopy, blocks, in-page editing, review &amp; publish</span>
494                                                          </a>
495                          </li>
496                                                  <li>
497                            <a href="/platform/deliver" class="block py-2 text-neutral-300 transition hover:text-white">
498                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
499                                Deliver
500                                                              </span>
501                                                              <span class="mt-0.5 block text-sm text-neutral-400">Hosting, CDN, image optimisation, domains, SSL, password protection</span>
502                                                          </a>
503                          </li>
504                                                  <li>
505                            <a href="/platform/integrate" class="block py-2 text-neutral-300 transition hover:text-white">
506                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
507                                Integrate
508                                                              </span>
509                                                              <span class="mt-0.5 block text-sm text-neutral-400">Headless, webhooks, Context &amp; MCP</span>
510                                                          </a>
511                          </li>
512                                              </ul>
513                    </div>
514                                  </div>
515              </details>
516                      </li>
517                            <li data-mobile-row class="border-b border-white/15" style="--stagger: 1">
518                          <details name="mobile-menu" class="group">
519                <summary class="flex cursor-pointer list-none items-center justify-between py-5 text-2xl font-bold tracking-tight uppercase text-white [&::-webkit-details-marker]:hidden">
520                  Solutions
521                  <svg class="size-4 text-neutral-400 transition-transform duration-300 group-open:rotate-180" viewBox="0 0 12 12" fill="none" aria-hidden="true">
522                    <path d="M2.5 4.5L6 8l3.5-3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
523                  </svg>
524                </summary>
525                <div class="grid gap-x-8 gap-y-6 pb-7 sm:grid-cols-2">
526                  <div class="">
527                                              <p class="mb-2 text-[10px] font-bold tracking-widest uppercase text-neutral-400">By agency</p>
528                                            <ul class="">
529                                                  <li>
530                            <a href="/solutions/boutique-agency" class="block py-2 text-neutral-300 transition hover:text-white">
531                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
532                                Boutique agency
533                                                              </span>
534                                                          </a>
535                          </li>
536                                                  <li>
537                            <a href="/solutions/mid-market-digital-agency" class="block py-2 text-neutral-300 transition hover:text-white">
538                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
539                                Mid-market digital agency
540                                                              </span>
541                                                              <span class="mt-0.5 block text-sm text-neutral-400">15–75 people</span>
542                                                          </a>
543                          </li>
544                                                  <li>
545                            <a href="/solutions/enterprise-and-full-service-agency" class="block py-2 text-neutral-300 transition hover:text-white">
546                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
547                                Enterprise &amp; full-service agency
548                                                              </span>
549                                                              <span class="mt-0.5 block text-sm text-neutral-400">75+ people</span>
550                                                          </a>
551                          </li>
552                                                  <li>
553                            <a href="/solutions/large-and-agency-groups" class="block py-2 text-neutral-300 transition hover:text-white">
554                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
555                                Large &amp; agency groups
556                                                              </span>
557                                                          </a>
558                          </li>
559                                                  <li>
560                            <a href="/solutions/network-and-multi-region" class="block py-2 text-neutral-300 transition hover:text-white">
561                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
562                                Network &amp; multi-region
563                                                              </span>
564                                                          </a>
565                          </li>
566                                                  <li>
567                            <a href="/solutions/in-house-brand" class="block py-2 text-neutral-300 transition hover:text-white">
568                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
569                                In-house brand
570                                                              </span>
571                                                          </a>
572                          </li>
573                                              </ul>
574                    </div>
575                  <div class="">
576                                              <p class="mb-2 text-[10px] font-bold tracking-widest uppercase text-neutral-400">By role</p>
577                                            <ul class="">
578                                                  <li>
579                            <a href="/solutions/engineering" class="block py-2 text-neutral-300 transition hover:text-white">
580                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
581                                Engineering
582                                                              </span>
583                                                          </a>
584                          </li>
585                                                  <li>
586                            <a href="/solutions/agency-leadership" class="block py-2 text-neutral-300 transition hover:text-white">
587                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
588                                Agency leadership
589                                                              </span>
590                                                          </a>
591                          </li>
592                                                  <li>
593                            <a href="/solutions/design" class="block py-2 text-neutral-300 transition hover:text-white">
594                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
595                                Design
596                                                              </span>
597                                                          </a>
598                          </li>
599                                                  <li>
600                            <a href="/solutions/content-and-copywriting" class="block py-2 text-neutral-300 transition hover:text-white">
601                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
602                                Content &amp; copywriting
603                                                              </span>
604                                                          </a>
605                          </li>
606                                                  <li>
607                            <a href="/solutions/marketing-and-seo" class="block py-2 text-neutral-300 transition hover:text-white">
608                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
609                                Marketing &amp; SEO
610                                                              </span>
611                                                          </a>
612                          </li>
613                                                  <li>
614                            <a href="/solutions/project-management" class="block py-2 text-neutral-300 transition hover:text-white">
615                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
616                                Project Management
617                                                              </span>
618                                                          </a>
619                          </li>
620                                              </ul>
621                    </div>
622                  <div class="">
623                                              <p class="mb-2 text-[10px] font-bold tracking-widest uppercase text-neutral-400">By challenge</p>
624                                            <ul class="">
625                                                  <li>
626                            <a href="/solutions/resource-and-capacity" class="block py-2 text-neutral-300 transition hover:text-white">
627                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
628                                Resource &amp; capacity
629                                                              </span>
630                                                          </a>
631                          </li>
632                                                  <li>
633                            <a href="/solutions/profitability-and-tracking" class="block py-2 text-neutral-300 transition hover:text-white">
634                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
635                                Profitability &amp; tracking
636                                                              </span>
637                                                          </a>
638                          </li>
639                                                  <li>
640                            <a href="/solutions/scale-an-agency" class="block py-2 text-neutral-300 transition hover:text-white">
641                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
642                                Scale an agency
643                                                              </span>
644                                                          </a>
645                          </li>
646                                              </ul>
647                    </div>
648                                  </div>
649              </details>
650                      </li>
651                            <li data-mobile-row class="border-b border-white/15" style="--stagger: 2">
652                          <details name="mobile-menu" class="group">
653                <summary class="flex cursor-pointer list-none items-center justify-between py-5 text-2xl font-bold tracking-tight uppercase text-white [&::-webkit-details-marker]:hidden">
654                  Resources
655                  <svg class="size-4 text-neutral-400 transition-transform duration-300 group-open:rotate-180" viewBox="0 0 12 12" fill="none" aria-hidden="true">
656                    <path d="M2.5 4.5L6 8l3.5-3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
657                  </svg>
658                </summary>
659                <div class="grid gap-x-8 gap-y-6 pb-7 sm:grid-cols-2">
660                  <div class="">
661                                              <p class="mb-2 text-[10px] font-bold tracking-widest uppercase text-neutral-400">Developers</p>
662                                            <ul class="">
663                                                  <li>
664                            <a href="https://docs.blutui.com/docs" class="block py-2 text-neutral-300 transition hover:text-white">
665                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
666                                Documentation
667                                                              </span>
668                                                          </a>
669                          </li>
670                                                  <li>
671                            <a href="https://docs.blutui.com" class="block py-2 text-neutral-300 transition hover:text-white">
672                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
673                                Developer resources
674                                                              </span>
675                                                          </a>
676                          </li>
677                                                  <li>
678                            <a href="https://docs.blutui.com/guides" class="block py-2 text-neutral-300 transition hover:text-white">
679                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
680                                Guides
681                                                              </span>
682                                                          </a>
683                          </li>
684                                              </ul>
685                    </div>
686                  <div class="">
687                                              <p class="mb-2 text-[10px] font-bold tracking-widest uppercase text-neutral-400">Community</p>
688                                            <ul class="">
689                                                  <li>
690                            <a href="/articles" class="block py-2 text-neutral-300 transition hover:text-white">
691                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
692                                Blog
693                                                              </span>
694                                                          </a>
695                          </li>
696                                                  <li>
697                            <a href="/transform" class="block py-2 text-neutral-300 transition hover:text-white">
698                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
699                                Transform
700                                                              </span>
701                                                          </a>
702                          </li>
703                                                  <li>
704                            <a href="/changelog" class="block py-2 text-neutral-300 transition hover:text-white">
705                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
706                                Changelog
707                                                              </span>
708                                                          </a>
709                          </li>
710                                                  <li>
711                            <a href="/ambassadors" class="block py-2 text-neutral-300 transition hover:text-white">
712                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
713                                Ambassadors
714                                                              </span>
715                                                          </a>
716                          </li>
717                                                  <li>
718                            <a href="/labs" class="block py-2 text-neutral-300 transition hover:text-white">
719                              <span class="flex items-baseline gap-1.5 text-base font-semibold text-white">
720                                Blutui Labs
721                                                              </span>
722                                                          </a>
723                          </li>
724                                              </ul>
725                    </div>
726                                  </div>
727              </details>
728                      </li>
729                            <li data-mobile-row class="border-b border-white/15" style="--stagger: 3">
730                          <a href="/pricing" class="flex items-center justify-between py-5 text-2xl font-bold tracking-tight uppercase text-white">
731                Pricing
732                <svg class="size-4 text-neutral-400" viewBox="0 0 12 12" fill="none" aria-hidden="true">
733                  <path d="M2.5 6h7M6.5 3l3 3-3 3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
734                </svg>
735              </a>
736                      </li>
737              </ul>
738    </nav>
739
740    <div data-mobile-row class="container-site grid grid-cols-2 gap-3 border-t border-white/15 pt-4 pb-[max(1rem,env(safe-area-inset-bottom))]" style="--stagger: 4">
741              <a href="https://console.blutui.com/register" class="bg-citron-400 px-5 py-4 text-center text-xs font-bold tracking-wide uppercase text-navy-900">
742          Start creating
743        </a>
744                    <a href="https://console.blutui.com/login" class="border border-white/20 px-5 py-4 text-center text-xs font-bold tracking-wide uppercase text-white">
745          Login
746        </a>
747          </div>
748  </div>
749</header>
750
751
752    <main class="relative">
753            <div data-grid-lines aria-hidden="true" class="pointer-events-none absolute inset-0 z-0 hidden select-none lg:block">
754  <div class="container-site h-full">
755    <div class="grid h-full grid-cols-6 *:border-l *:border-dashed *:border-white/15">
756      <span></span>
757      <span></span>
758      <span></span>
759      <span></span>
760      <span></span>
761      <span class="border-r"></span>
762    </div>
763  </div>
764</div>
765
766
767          <section class="container-site flex flex-col items-start gap-5 pt-44 pb-16 sm:pb-20 lg:pb-25">
768    <p data-reveal="block" class="flex items-center gap-2 lg:px-gutter">
769    <span class="size-1.5 shrink-0 rounded-full bg-citron-400" aria-hidden="true"></span>
770    <span class="text-[11px] leading-none font-bold tracking-[0.05em] uppercase text-white/40">Resources / Articles</span>
771  </p>
772
773
774  <div class="flex w-full flex-col gap-5 lg:flex-row lg:items-start lg:gap-0">
775    <h1 data-reveal class="text-4xl leading-[1.08] font-bold tracking-[-0.02em] text-white sm:text-5xl lg:w-3/6 lg:px-gutter lg:text-[48px] lg:leading-[52px] text-balance">Articles</h1>
776
777
778          <p data-reveal="block" class="text-lg leading-[1.25] font-medium tracking-[-0.01em] text-white/60 sm:text-xl lg:w-3/6 lg:px-gutter lg:text-2xl lg:leading-[30px]">
779        Thinking on agency economics, AI and the way the web gets made.
780      </p>
781      </div>
782</section>
783
784
785<div
786  aria-hidden="true"
787  class="pointer-events-none relative h-0 select-none"
788  style="--grad-h: 487px; --grad-top: -0px"
789><div class="absolute inset-x-0 -z-10 h-[min(var(--grad-h),60svh)] overflow-hidden top-[var(--grad-top)] sm:h-[var(--grad-h)] [mask-image:linear-gradient(to_bottom,#000_0%,#000_58%,rgb(0_0_0/0.35)_84%,transparent_100%)]">
790    <div data-mesh-gradient-host class="absolute inset-0">
791  <div
792    data-mesh-gradient-fallback
793    class="absolute inset-0"
794    style="opacity: 0.7; background-color: #247bff; background-image:
795      radial-gradient(ellipse 70% 90% at 8% 0%, #1f00f6 0%, transparent 62%),
796      radial-gradient(ellipse 55% 75% at 20% 48%, #700cf1 0%, transparent 70%),
797      radial-gradient(ellipse 80% 60% at 92% 12%, #08125c 0%, transparent 72%),
798      linear-gradient(to bottom, transparent 30%, #000631 100%)"
799  ></div>
800
801  <canvas
802    data-mesh-gradient
803    data-mesh="content"
804    data-palette="indigo"
805    data-opacity="0.7"
806        class="absolute inset-0 h-full w-full opacity-0"
807  ></canvas>
808</div>
809
810  </div>
811</div>
812<section class="relative scroll-mt-28 overflow-x-clip py-16 sm:py-20 lg:py-25"
813>
814  <div class="container-site">
815    <div class="relative flex flex-col gap-16 sm:gap-20 lg:gap-37">
816              <div class="flex flex-col gap-6 lg:gap-[21px]">
817                      <h2 data-reveal class="text-3xl leading-[1.1] font-bold tracking-[-0.02em] text-white sm:text-[36px] sm:leading-10 lg:px-gutter">
818              Latest
819            </h2>
820          
821          <div class="flex flex-col gap-12 lg:flex-row lg:gap-0">
822  <div class="lg:w-3/6">
823    <a href="/articles/don-t-let-your-web-platform-become-your-ai-landlord" class="group flex flex-col gap-8 lg:gap-[39px]">
824  <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-full rounded-[10px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-0095.png?format=webp&amp;width=1440" alt="" aria-hidden="true" loading="lazy" decoding="async" />
825    <img
826      data-journal-image
827      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
828      src="https://cdn.blutui.com/uploads/blutui_27/img-0095.png?format=webp&amp;width=1440"
829      alt=""
830      decoding="async"
831    /></div>
832
833
834  <div data-reveal="block" class="flex flex-col gap-3 lg:px-gutter">
835    <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-09-08T22:33:00+00:00">8 Sep 2026</time>
836    <span aria-hidden="true">·</span>  <span>8 min read</span>
837</p>
838
839    <h3 class="text-xl leading-[1.25] font-medium tracking-[-0.01em] text-white transition-colors group-hover:text-white/70 lg:text-2xl lg:leading-[30px]">
840      Don&#039;t Let Your Web Builder Become Your AI Landlord
841    </h3>
842    <p class="text-base leading-6 font-bold tracking-[-0.01em] text-white lg:text-lg">AI freedom and cost control: What happens when tokens spiral?</p>
843  </div>
844</a>
845
846  </div>
847
848      <div class="flex flex-col gap-5 lg:w-3/6 lg:px-gutter">
849              <p data-reveal="block" class="flex items-center gap-2 text-[10px] leading-none font-bold tracking-[0.1em] uppercase text-white">
850          <span class="size-1.5 shrink-0 rounded-full bg-citron-400" aria-hidden="true"></span>
851          Featured articles
852        </p>
853      
854      <ul class="flex flex-1 flex-col justify-between gap-4">
855                            <li data-reveal="block">
856            <a href="/articles/cold-cola-wars" class="group flex items-start gap-4 sm:gap-5">
857  <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[10px] sm:w-[156px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-0081.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
858    <img
859      data-journal-image
860      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
861      src="https://cdn.blutui.com/uploads/blutui_27/img-0081.png?format=webp&amp;width=320"
862      alt=""
863      loading="lazy" decoding="async"
864    /></div>
865
866  <div class="flex min-w-0 flex-1 flex-col gap-1.5">
867    <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-09-01T07:54:00+00:00">1 Sep 2026</time>
868    <span aria-hidden="true">·</span>  <span>8 min read</span>
869</p>
870
871    <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Ice Cold Cola Wars</span>
872    <p class="hidden text-sm leading-5 text-white/60 sm:line-clamp-2">The Coke, Pepsi and Agency Clusterf**k Nobody Can Get Back in the Studio Fridge</p>
873  </div>
874  <span aria-hidden="true" class="-mt-2 text-[25px] leading-[39px] text-white transition-transform duration-200 group-hover:translate-x-1">→</span>
875</a>
876
877          </li>
878                  <li aria-hidden="true" class="h-px shrink-0 bg-white/15"></li>          <li data-reveal="block">
879            <a href="/articles/built-by-an-agency-for-agencies-see-blutui-in-action" class="group flex items-start gap-4 sm:gap-5">
880  <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[10px] sm:w-[156px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/webinar-blog-hero.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
881    <img
882      data-journal-image
883      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
884      src="https://cdn.blutui.com/uploads/blutui_27/webinar-blog-hero.png?format=webp&amp;width=320"
885      alt=""
886      loading="lazy" decoding="async"
887    /></div>
888
889  <div class="flex min-w-0 flex-1 flex-col gap-1.5">
890    <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-08-20T01:41:00+00:00">20 Aug 2026</time>
891    <span aria-hidden="true">·</span>  <span>1 min read</span>
892</p>
893
894    <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Built by an agency, for agencies: see Blutui in action</span>
895    <p class="hidden text-sm leading-5 text-white/60 sm:line-clamp-2">We took a prototype design and turned it into a working website, live. Here&#039;s the full recording.</p>
896  </div>
897  <span aria-hidden="true" class="-mt-2 text-[25px] leading-[39px] text-white transition-transform duration-200 group-hover:translate-x-1">→</span>
898</a>
899
900          </li>
901                  <li aria-hidden="true" class="h-px shrink-0 bg-white/15"></li>          <li data-reveal="block">
902            <a href="/articles/lions-beats-the-booze-ban-by-the-skin-of-its-ros-stained-lips" class="group flex items-start gap-4 sm:gap-5">
903  <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[10px] sm:w-[156px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9920.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
904    <img
905      data-journal-image
906      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
907      src="https://cdn.blutui.com/uploads/blutui_27/img-9920.png?format=webp&amp;width=320"
908      alt=""
909      loading="lazy" decoding="async"
910    /></div>
911
912  <div class="flex min-w-0 flex-1 flex-col gap-1.5">
913    <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-06-26T11:39:00+00:00">26 Jun 2026</time>
914    <span aria-hidden="true">·</span>  <span>2 min read</span>
915</p>
916
917    <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Lions Beats the Booze Ban by the Skin of Its Rosé-Stained Lips</span>
918    <p class="hidden text-sm leading-5 text-white/60 sm:line-clamp-2">There are close calls, and then there is whatever happened on the French Riviera this week.</p>
919  </div>
920  <span aria-hidden="true" class="-mt-2 text-[25px] leading-[39px] text-white transition-transform duration-200 group-hover:translate-x-1">→</span>
921</a>
922
923          </li>
924                  <li aria-hidden="true" class="h-px shrink-0 bg-white/15"></li>          <li data-reveal="block">
925            <a href="/articles/world-cup-fever-adlands-fleeting-escape-from-ai" class="group flex items-start gap-4 sm:gap-5">
926  <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[10px] sm:w-[156px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9916.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
927    <img
928      data-journal-image
929      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
930      src="https://cdn.blutui.com/uploads/blutui_27/img-9916.jpeg?format=webp&amp;width=320"
931      alt=""
932      loading="lazy" decoding="async"
933    /></div>
934
935  <div class="flex min-w-0 flex-1 flex-col gap-1.5">
936    <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-06-25T17:22:00+00:00">25 Jun 2026</time>
937    <span aria-hidden="true">·</span>  <span>3 min read</span>
938</p>
939
940    <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">World Cup Fever, Adlands Fleeting Escape from AI</span>
941    <p class="hidden text-sm leading-5 text-white/60 sm:line-clamp-2">For one glorious week on the French Riviera, something pleasantly unexpected happened.</p>
942  </div>
943  <span aria-hidden="true" class="-mt-2 text-[25px] leading-[39px] text-white transition-transform duration-200 group-hover:translate-x-1">→</span>
944</a>
945
946          </li>
947              </ul>
948    </div>
949  </div>
950
951        </div>
952      
953              <div class="flex flex-col gap-6">
954                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
955  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
956    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
957    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2026</span>
958  </h3>
959
960  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
961          <li>
962        <a href="/articles/vietsoft-vision-blutui-agency-web-ecosystem" class="group flex items-start gap-4 sm:gap-5">
963          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/stanley-x-gb.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
964    <img
965      data-journal-image
966      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
967      src="https://cdn.blutui.com/uploads/blutui_27/stanley-x-gb.png?format=webp&amp;width=320"
968      alt=""
969      loading="lazy" decoding="async"
970    /></div>
971
972          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
973            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-06-22T12:18:00+00:00">22 Jun 2026</time>
974    <span aria-hidden="true">·</span>  <span>1 min read</span>
975</p>
976
977            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">VietSoft Vision เข้าร่วม Blutui Agency Web Ecosystem</span>
978            <p class="line-clamp-2 text-sm leading-5 text-white/60">VSV ได้รับการแต่งตั้งเป็นพันธมิตรระดับภูมิภาคสำหรับเวียดนาม สิงคโปร์ และประเทศไทย เพื่อเร่งศักยภาพการส่งมอบงานดิจิทัลสำหรับเอเจนซี แบรนด์ และนักการตลาด</p>
979          </div>
980        </a>
981      </li>
982          <li>
983        <a href="/articles/vietsoft-vision-gia-nh-p-h-sinh-th-i-web-i-l-blutui" class="group flex items-start gap-4 sm:gap-5">
984          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/stanley-x-gb.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
985    <img
986      data-journal-image
987      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
988      src="https://cdn.blutui.com/uploads/blutui_27/stanley-x-gb.png?format=webp&amp;width=320"
989      alt=""
990      loading="lazy" decoding="async"
991    /></div>
992
993          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
994            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-06-22T12:15:00+00:00">22 Jun 2026</time>
995    <span aria-hidden="true">·</span>  <span>9 min read</span>
996</p>
997
998            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">VietSoft Vision Gia Nhập Hệ Sinh Thái Web Đại Lý Blutui</span>
999            <p class="line-clamp-2 text-sm leading-5 text-white/60">VSV được bổ nhiệm làm đối tác khu vực tại Việt Nam, Singapore và Thái Lan nhằm đẩy nhanh quá trình chuyển đổi số cho các đại lý, thương hiệu và nhà tiếp thị</p>
1000          </div>
1001        </a>
1002      </li>
1003          <li>
1004        <a href="/articles/code-the-new-kingmaker" class="group flex items-start gap-4 sm:gap-5">
1005          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9883.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1006    <img
1007      data-journal-image
1008      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1009      src="https://cdn.blutui.com/uploads/blutui_27/img-9883.png?format=webp&amp;width=320"
1010      alt=""
1011      loading="lazy" decoding="async"
1012    /></div>
1013
1014          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1015            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-06-09T09:10:00+00:00">9 Jun 2026</time>
1016    <span aria-hidden="true">·</span>  <span>1 min read</span>
1017</p>
1018
1019            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Code the New Kingmaker</span>
1020            <p class="line-clamp-2 text-sm leading-5 text-white/60">Your Front-End Developer Might Be Your Most Valuable Employee</p>
1021          </div>
1022        </a>
1023      </li>
1024          <li>
1025        <a href="/articles/blutui-doesn-t-give-a-shit-about-design" class="group flex items-start gap-4 sm:gap-5">
1026          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9758.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1027    <img
1028      data-journal-image
1029      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1030      src="https://cdn.blutui.com/uploads/blutui_27/img-9758.png?format=webp&amp;width=320"
1031      alt=""
1032      loading="lazy" decoding="async"
1033    /></div>
1034
1035          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1036            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-05-31T07:54:00+00:00">31 May 2026</time>
1037    <span aria-hidden="true">·</span>  <span>2 min read</span>
1038</p>
1039
1040            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Blutui Does Not Give a Shit About Design</span>
1041            <p class="line-clamp-2 text-sm leading-5 text-white/60">The Agency Web Ecosystem That Delivers, and Never Judges</p>
1042          </div>
1043        </a>
1044      </li>
1045          <li>
1046        <a href="/articles/the-greenest-hour-is-the-one-you-never-burn" class="group flex items-start gap-4 sm:gap-5">
1047          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-8308.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1048    <img
1049      data-journal-image
1050      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1051      src="https://cdn.blutui.com/uploads/blutui_27/img-8308.jpeg?format=webp&amp;width=320"
1052      alt=""
1053      loading="lazy" decoding="async"
1054    /></div>
1055
1056          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1057            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-05-28T06:06:00+00:00">28 May 2026</time>
1058    <span aria-hidden="true">·</span>  <span>3 min read</span>
1059</p>
1060
1061            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">The Greenest Hour Is the One You Never Burn</span>
1062            <p class="line-clamp-2 text-sm leading-5 text-white/60">No factories. No smokestacks. No shipping containers crossing oceans. No warehouses full of plastic waste.</p>
1063          </div>
1064        </a>
1065      </li>
1066          <li>
1067        <a href="/articles/what-97-represents-for-agencies" class="group flex items-start gap-4 sm:gap-5">
1068          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9828.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1069    <img
1070      data-journal-image
1071      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1072      src="https://cdn.blutui.com/uploads/blutui_27/img-9828.jpeg?format=webp&amp;width=320"
1073      alt=""
1074      loading="lazy" decoding="async"
1075    /></div>
1076
1077          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1078            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-05-26T10:42:00+00:00">26 May 2026</time>
1079    <span aria-hidden="true">·</span>  <span>2 min read</span>
1080</p>
1081
1082            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">What 400% Actually Looks Like</span>
1083            <p class="line-clamp-2 text-sm leading-5 text-white/60">The Agency Production Model Is Changing Faster Than Most Agencies Realise</p>
1084          </div>
1085        </a>
1086      </li>
1087          <li>
1088        <a href="/articles/fix-what-s-f-d" class="group flex items-start gap-4 sm:gap-5">
1089          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9825.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1090    <img
1091      data-journal-image
1092      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1093      src="https://cdn.blutui.com/uploads/blutui_27/img-9825.jpeg?format=webp&amp;width=320"
1094      alt=""
1095      loading="lazy" decoding="async"
1096    /></div>
1097
1098          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1099            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-05-26T09:53:00+00:00">26 May 2026</time>
1100    <span aria-hidden="true">·</span>  <span>3 min read</span>
1101</p>
1102
1103            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">We Fix’d What’s F@#%’d</span>
1104            <p class="line-clamp-2 text-sm leading-5 text-white/60">Don&#039;t have time to fix your clients issues let alone your own systems. That&#039;s exactly the problem.</p>
1105          </div>
1106        </a>
1107      </li>
1108          <li>
1109        <a href="/articles/who-does-blutui-competes-with" class="group flex items-start gap-4 sm:gap-5">
1110          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9757.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1111    <img
1112      data-journal-image
1113      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1114      src="https://cdn.blutui.com/uploads/blutui_27/img-9757.png?format=webp&amp;width=320"
1115      alt=""
1116      loading="lazy" decoding="async"
1117    /></div>
1118
1119          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1120            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-04-30T18:53:00+00:00">30 Apr 2026</time>
1121    <span aria-hidden="true">·</span>  <span>3 min read</span>
1122</p>
1123
1124            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Who Does Blutui Compete With for Your Agency?</span>
1125            <p class="line-clamp-2 text-sm leading-5 text-white/60">How a Kiwi Creative Ops Team Reframed an Entire AgencyTech Category</p>
1126          </div>
1127        </a>
1128      </li>
1129          <li>
1130        <a href="/articles/tds-is-beyond-tedious" class="group flex items-start gap-4 sm:gap-5">
1131          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9751.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1132    <img
1133      data-journal-image
1134      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1135      src="https://cdn.blutui.com/uploads/blutui_27/img-9751.jpeg?format=webp&amp;width=320"
1136      alt=""
1137      loading="lazy" decoding="async"
1138    /></div>
1139
1140          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1141            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-04-29T00:18:00+00:00">29 Apr 2026</time>
1142    <span aria-hidden="true">·</span>  <span>2 min read</span>
1143</p>
1144
1145            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">TDS is Beyond Tedious</span>
1146            <p class="line-clamp-2 text-sm leading-5 text-white/60">Agencies Can Now Optimise to Avoid the Costly Token Death Spiral (TDS)</p>
1147          </div>
1148        </a>
1149      </li>
1150          <li>
1151        <a href="/articles/blutui-x-wow-group-launch-blutui-labs-uk" class="group flex items-start gap-4 sm:gap-5">
1152          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9708.jpg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1153    <img
1154      data-journal-image
1155      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1156      src="https://cdn.blutui.com/uploads/blutui_27/img-9708.jpg?format=webp&amp;width=320"
1157      alt=""
1158      loading="lazy" decoding="async"
1159    /></div>
1160
1161          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1162            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-04-22T02:49:00+00:00">22 Apr 2026</time>
1163    <span aria-hidden="true">·</span>  <span>2 min read</span>
1164</p>
1165
1166            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Blutui x Wow Group Launch Blutui Labs UK</span>
1167            <p class="line-clamp-2 text-sm leading-5 text-white/60">A new production model built exclusively for digital, brand, creative, &amp; ad agencies</p>
1168          </div>
1169        </a>
1170      </li>
1171          <li>
1172        <a href="/articles/blutui-backs-best-of-the-best-in-britain" class="group flex items-start gap-4 sm:gap-5">
1173          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9507.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1174    <img
1175      data-journal-image
1176      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1177      src="https://cdn.blutui.com/uploads/blutui_27/img-9507.jpeg?format=webp&amp;width=320"
1178      alt=""
1179      loading="lazy" decoding="async"
1180    /></div>
1181
1182          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1183            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-03-17T22:09:00+00:00">17 Mar 2026</time>
1184    <span aria-hidden="true">·</span>  <span>2 min read</span>
1185</p>
1186
1187            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Blutui Backs Best of British</span>
1188            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui Sponsors Best Development Agency at the National Digital Awards</p>
1189          </div>
1190        </a>
1191      </li>
1192          <li>
1193        <a href="/articles/creativity-isnt-the-commercial-problem-negotiation-is" class="group flex items-start gap-4 sm:gap-5">
1194          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/codementor-an-advertising-executive-in-a-board-room-negotiatio-e8746e61-54d5-450e-9a62-9e318d8efed9.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1195    <img
1196      data-journal-image
1197      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1198      src="https://cdn.blutui.com/uploads/blutui_27/codementor-an-advertising-executive-in-a-board-room-negotiatio-e8746e61-54d5-450e-9a62-9e318d8efed9.jpeg?format=webp&amp;width=320"
1199      alt=""
1200      loading="lazy" decoding="async"
1201    /></div>
1202
1203          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1204            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-02-06T20:45:00+00:00">6 Feb 2026</time>
1205    <span aria-hidden="true">·</span>  <span>4 min read</span>
1206</p>
1207
1208            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Adland Trapped in a Wet Paper Bag</span>
1209            <p class="line-clamp-2 text-sm leading-5 text-white/60">Creativity Isn’t the Performance Issue. Negotiation Is.</p>
1210          </div>
1211        </a>
1212      </li>
1213          <li>
1214        <a href="/articles/is-leadership-weakening-in-the-modern-c-suite-workforce" class="group flex items-start gap-4 sm:gap-5">
1215          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9392.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1216    <img
1217      data-journal-image
1218      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1219      src="https://cdn.blutui.com/uploads/blutui_27/img-9392.jpeg?format=webp&amp;width=320"
1220      alt=""
1221      loading="lazy" decoding="async"
1222    /></div>
1223
1224          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1225            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-01-26T12:03:00+00:00">26 Jan 2026</time>
1226    <span aria-hidden="true">·</span>  <span>4 min read</span>
1227</p>
1228
1229            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Is Leadership Weakening in the Modern C-Suite Workforce?</span>
1230            <p class="line-clamp-2 text-sm leading-5 text-white/60">January ‘26 Founders’ Circle Summary</p>
1231          </div>
1232        </a>
1233      </li>
1234          <li>
1235        <a href="/articles/prototype-to-production-pronto" class="group flex items-start gap-4 sm:gap-5">
1236          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9356.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1237    <img
1238      data-journal-image
1239      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1240      src="https://cdn.blutui.com/uploads/blutui_27/img-9356.png?format=webp&amp;width=320"
1241      alt=""
1242      loading="lazy" decoding="async"
1243    /></div>
1244
1245          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1246            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2026-01-12T08:25:00+00:00">12 Jan 2026</time>
1247    <span aria-hidden="true">·</span>  <span>2 min read</span>
1248</p>
1249
1250            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Prototype to Production Pronto</span>
1251            <p class="line-clamp-2 text-sm leading-5 text-white/60">BlutuiMCP+ takes Figma Outputs to Production Deployment in seconds</p>
1252          </div>
1253        </a>
1254      </li>
1255      </ul>
1256</div>
1257
1258                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
1259  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
1260    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
1261    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2025</span>
1262  </h3>
1263
1264  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
1265          <li>
1266        <a href="/articles/adpit-stealing-your-margin-before-govt-gets-its-shot" class="group flex items-start gap-4 sm:gap-5">
1267          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/codementor-a-thief-stealing-money-from-a-mountain-of-cash-left-c9c70c58-68c4-49bc-b415-d414def109a7.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1268    <img
1269      data-journal-image
1270      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1271      src="https://cdn.blutui.com/uploads/blutui_27/codementor-a-thief-stealing-money-from-a-mountain-of-cash-left-c9c70c58-68c4-49bc-b415-d414def109a7.jpeg?format=webp&amp;width=320"
1272      alt=""
1273      loading="lazy" decoding="async"
1274    /></div>
1275
1276          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1277            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-12-09T12:48:00+00:00">9 Dec 2025</time>
1278    <span aria-hidden="true">·</span>  <span>1 min read</span>
1279</p>
1280
1281            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">ADPIT Stealing Your Margin Before Govt Gets a Chance</span>
1282            <p class="line-clamp-2 text-sm leading-5 text-white/60">Is the Agency Digital Project Inefficiency Tax quietly stealing your margin?</p>
1283          </div>
1284        </a>
1285      </li>
1286          <li>
1287        <a href="/articles/with-great-power-comes-great-responsibility" class="group flex items-start gap-4 sm:gap-5">
1288          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/codementor-create-a-split-screen-with-voltaire-facing-off-spid-f4a33a56-06e9-45eb-8283-76ac555354b5.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1289    <img
1290      data-journal-image
1291      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1292      src="https://cdn.blutui.com/uploads/blutui_27/codementor-create-a-split-screen-with-voltaire-facing-off-spid-f4a33a56-06e9-45eb-8283-76ac555354b5.png?format=webp&amp;width=320"
1293      alt=""
1294      loading="lazy" decoding="async"
1295    /></div>
1296
1297          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1298            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-12-02T13:38:00+00:00">2 Dec 2025</time>
1299    <span aria-hidden="true">·</span>  <span>2 min read</span>
1300</p>
1301
1302            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">With Great Power Comes Great Responsibility</span>
1303            <p class="line-clamp-2 text-sm leading-5 text-white/60">AI in the hands of creative, craft-centric professionals</p>
1304          </div>
1305        </a>
1306      </li>
1307          <li>
1308        <a href="/articles/advertisers-want-capability-not-corporate-framework" class="group flex items-start gap-4 sm:gap-5">
1309          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9241.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1310    <img
1311      data-journal-image
1312      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1313      src="https://cdn.blutui.com/uploads/blutui_27/img-9241.jpeg?format=webp&amp;width=320"
1314      alt=""
1315      loading="lazy" decoding="async"
1316    /></div>
1317
1318          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1319            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-12-01T09:01:00+00:00">1 Dec 2025</time>
1320    <span aria-hidden="true">·</span>  <span>2 min read</span>
1321</p>
1322
1323            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Advertisers want capability, not corporate framework</span>
1324            <p class="line-clamp-2 text-sm leading-5 text-white/60">HoldCo structure is a distraction, brands want velocity wherever they can get it</p>
1325          </div>
1326        </a>
1327      </li>
1328          <li>
1329        <a href="/articles/londons-calling" class="group flex items-start gap-4 sm:gap-5">
1330          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9110.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1331    <img
1332      data-journal-image
1333      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1334      src="https://cdn.blutui.com/uploads/blutui_27/img-9110.jpeg?format=webp&amp;width=320"
1335      alt=""
1336      loading="lazy" decoding="async"
1337    /></div>
1338
1339          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1340            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-11-23T19:32:00+00:00">23 Nov 2025</time>
1341    <span aria-hidden="true">·</span>  <span>1 min read</span>
1342</p>
1343
1344            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">London’s Calling</span>
1345            <p class="line-clamp-2 text-sm leading-5 text-white/60">Welcome David Mayo to the Blutui Ambassador Team</p>
1346          </div>
1347        </a>
1348      </li>
1349          <li>
1350        <a href="/articles/julia-arenson-in-da-house" class="group flex items-start gap-4 sm:gap-5">
1351          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9157.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1352    <img
1353      data-journal-image
1354      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1355      src="https://cdn.blutui.com/uploads/blutui_27/img-9157.jpeg?format=webp&amp;width=320"
1356      alt=""
1357      loading="lazy" decoding="async"
1358    /></div>
1359
1360          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1361            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-11-23T19:26:00+00:00">23 Nov 2025</time>
1362    <span aria-hidden="true">·</span>  <span>1 min read</span>
1363</p>
1364
1365            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Julia Arenson In-the-House</span>
1366            <p class="line-clamp-2 text-sm leading-5 text-white/60">In-House Agency Specialist Julia Arenson Appointed Blutui Ambassador</p>
1367          </div>
1368        </a>
1369      </li>
1370          <li>
1371        <a href="/articles/emma-turner-in-da-house" class="group flex items-start gap-4 sm:gap-5">
1372          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/img-9160.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1373    <img
1374      data-journal-image
1375      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1376      src="https://cdn.blutui.com/uploads/blutui_27/img-9160.jpeg?format=webp&amp;width=320"
1377      alt=""
1378      loading="lazy" decoding="async"
1379    /></div>
1380
1381          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1382            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-11-23T19:22:00+00:00">23 Nov 2025</time>
1383    <span aria-hidden="true">·</span>  <span>1 min read</span>
1384</p>
1385
1386            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Emma Turner In-the-House</span>
1387            <p class="line-clamp-2 text-sm leading-5 text-white/60">In-House Agency Specialist Emma Turner Appointed Blutui Ambassador</p>
1388          </div>
1389        </a>
1390      </li>
1391          <li>
1392        <a href="/articles/mfa-policy" class="group flex items-start gap-4 sm:gap-5">
1393          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-8895.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1394    <img
1395      data-journal-image
1396      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1397      src="https://cdn.blutui.com/uploads/curation/img-8895.jpeg?format=webp&amp;width=320"
1398      alt=""
1399      loading="lazy" decoding="async"
1400    /></div>
1401
1402          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1403            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-09-28T21:46:00+00:00">28 Sep 2025</time>
1404    <span aria-hidden="true">·</span>  <span>1 min read</span>
1405</p>
1406
1407            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Blutui Anti MFA Policy</span>
1408            <p class="line-clamp-2 text-sm leading-5 text-white/60">Zero Tolerance for Made-For-Advertising Sites</p>
1409          </div>
1410        </a>
1411      </li>
1412          <li>
1413        <a href="/articles/here-lies-the-hourly-rate" class="group flex items-start gap-4 sm:gap-5">
1414          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-8805.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1415    <img
1416      data-journal-image
1417      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1418      src="https://cdn.blutui.com/uploads/curation/img-8805.jpeg?format=webp&amp;width=320"
1419      alt=""
1420      loading="lazy" decoding="async"
1421    /></div>
1422
1423          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1424            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-09-04T14:12:00+00:00">4 Sep 2025</time>
1425    <span aria-hidden="true">·</span>  <span>3 min read</span>
1426</p>
1427
1428            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Here Lies the Hourly Rate</span>
1429            <p class="line-clamp-2 text-sm leading-5 text-white/60">400% Better or 1,000% Gone: Why Blutui Agencies Are Winning in Adland v2.0</p>
1430          </div>
1431        </a>
1432      </li>
1433          <li>
1434        <a href="/articles/ai-ethics-in-adland" class="group flex items-start gap-4 sm:gap-5">
1435          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/blutui_27/codementor-ethics-and-the-scales-of-justice-2aa0709f-0615-46ae-9964-766e64e6b55f.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1436    <img
1437      data-journal-image
1438      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1439      src="https://cdn.blutui.com/uploads/blutui_27/codementor-ethics-and-the-scales-of-justice-2aa0709f-0615-46ae-9964-766e64e6b55f.jpeg?format=webp&amp;width=320"
1440      alt=""
1441      loading="lazy" decoding="async"
1442    /></div>
1443
1444          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1445            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-07-31T10:41:00+00:00">31 Jul 2025</time>
1446    <span aria-hidden="true">·</span>  <span>2 min read</span>
1447</p>
1448
1449            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">AI Ethics in Adland</span>
1450            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui Makes the Case for Consideration in AI Adoption</p>
1451          </div>
1452        </a>
1453      </li>
1454          <li>
1455        <a href="/articles/the-pasech-lattin-interview" class="group flex items-start gap-4 sm:gap-5">
1456          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-8626.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1457    <img
1458      data-journal-image
1459      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1460      src="https://cdn.blutui.com/uploads/curation/img-8626.jpeg?format=webp&amp;width=320"
1461      alt=""
1462      loading="lazy" decoding="async"
1463    /></div>
1464
1465          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1466            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-07-27T16:38:00+00:00">27 Jul 2025</time>
1467    <span aria-hidden="true">·</span>  <span>1 min read</span>
1468</p>
1469
1470            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">The Pasech Lattin Interview - The ADOTAT Show</span>
1471            <p class="line-clamp-2 text-sm leading-5 text-white/60">The ADOTAT Show! Features Graeme Blake Interview in Season Seven</p>
1472          </div>
1473        </a>
1474      </li>
1475          <li>
1476        <a href="/articles/panic-at-the-disco" class="group flex items-start gap-4 sm:gap-5">
1477          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-trendy-disco-with-dry-ice-lasers-and-disco-balls-at-5e8578f6-f685-4b4d-9a96-134785d8f787.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1478    <img
1479      data-journal-image
1480      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1481      src="https://cdn.blutui.com/uploads/curation/codementor-trendy-disco-with-dry-ice-lasers-and-disco-balls-at-5e8578f6-f685-4b4d-9a96-134785d8f787.png?format=webp&amp;width=320"
1482      alt=""
1483      loading="lazy" decoding="async"
1484    /></div>
1485
1486          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1487            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-07-27T16:24:00+00:00">27 Jul 2025</time>
1488    <span aria-hidden="true">·</span>  <span>2 min read</span>
1489</p>
1490
1491            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Panic at the Disco</span>
1492            <p class="line-clamp-2 text-sm leading-5 text-white/60">How Adland’s Tech Anxiety Undermines Its Own Value</p>
1493          </div>
1494        </a>
1495      </li>
1496          <li>
1497        <a href="/articles/exploring-change-where-chaos-reigns" class="group flex items-start gap-4 sm:gap-5">
1498          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-a-sailboat-changing-course-ahead-of-a-dark-storm-e91c7c9d-6412-4956-bc07-c17dbb10b502.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1499    <img
1500      data-journal-image
1501      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1502      src="https://cdn.blutui.com/uploads/curation/codementor-a-sailboat-changing-course-ahead-of-a-dark-storm-e91c7c9d-6412-4956-bc07-c17dbb10b502.jpeg?format=webp&amp;width=320"
1503      alt=""
1504      loading="lazy" decoding="async"
1505    /></div>
1506
1507          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1508            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-06-29T14:46:00+00:00">29 Jun 2025</time>
1509    <span aria-hidden="true">·</span>  <span>6 min read</span>
1510</p>
1511
1512            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Exploring Change Where Chaos Reigns</span>
1513            <p class="line-clamp-2 text-sm leading-5 text-white/60">The True Cost of Maintaining Your Current Course</p>
1514          </div>
1515        </a>
1516      </li>
1517          <li>
1518        <a href="/articles/bites-banter" class="group flex items-start gap-4 sm:gap-5">
1519          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-8386.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1520    <img
1521      data-journal-image
1522      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1523      src="https://cdn.blutui.com/uploads/curation/img-8386.jpeg?format=webp&amp;width=320"
1524      alt=""
1525      loading="lazy" decoding="async"
1526    /></div>
1527
1528          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1529            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-05-20T09:51:00+00:00">20 May 2025</time>
1530    <span aria-hidden="true">·</span>  <span>1 min read</span>
1531</p>
1532
1533            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Best of British Bites + Banter</span>
1534            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui CEO Graeme Blake Hits LDN &amp; Cannes to Fill Founder’s Circle Roster</p>
1535          </div>
1536        </a>
1537      </li>
1538          <li>
1539        <a href="/articles/agency-clients-made-stickier" class="group flex items-start gap-4 sm:gap-5">
1540          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-a-large-group-of-advertising-agency-creatives-and-e-6ebc90c0-5a2a-43f8-b375-ee86535897c8.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1541    <img
1542      data-journal-image
1543      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1544      src="https://cdn.blutui.com/uploads/curation/codementor-a-large-group-of-advertising-agency-creatives-and-e-6ebc90c0-5a2a-43f8-b375-ee86535897c8.jpeg?format=webp&amp;width=320"
1545      alt=""
1546      loading="lazy" decoding="async"
1547    /></div>
1548
1549          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1550            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-05-18T09:42:00+00:00">18 May 2025</time>
1551    <span aria-hidden="true">·</span>  <span>2 min read</span>
1552</p>
1553
1554            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Agency Clients Made Sticky-er</span>
1555            <p class="line-clamp-2 text-sm leading-5 text-white/60">Why Blutui Continuum Is Your Agency’s Secret Weapon for Long-Term Client Relationships</p>
1556          </div>
1557        </a>
1558      </li>
1559          <li>
1560        <a href="/articles/percent-put-in-context-for-agency-founders" class="group flex items-start gap-4 sm:gap-5">
1561          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-8327.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1562    <img
1563      data-journal-image
1564      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1565      src="https://cdn.blutui.com/uploads/curation/img-8327.jpeg?format=webp&amp;width=320"
1566      alt=""
1567      loading="lazy" decoding="async"
1568    /></div>
1569
1570          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1571            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-04-27T11:11:00+00:00">27 Apr 2025</time>
1572    <span aria-hidden="true">·</span>  <span>2 min read</span>
1573</p>
1574
1575            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">400% [Put in context for agency founders]</span>
1576            <p class="line-clamp-2 text-sm leading-5 text-white/60">The Impact and the Intent of Blutui Platform Development</p>
1577          </div>
1578        </a>
1579      </li>
1580          <li>
1581        <a href="/articles/blutui-continuum" class="group flex items-start gap-4 sm:gap-5">
1582          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7998.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1583    <img
1584      data-journal-image
1585      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1586      src="https://cdn.blutui.com/uploads/curation/img-7998.jpeg?format=webp&amp;width=320"
1587      alt=""
1588      loading="lazy" decoding="async"
1589    /></div>
1590
1591          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1592            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-03-22T14:36:00+00:00">22 Mar 2025</time>
1593    <span aria-hidden="true">·</span>  <span>1 min read</span>
1594</p>
1595
1596            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Blutui Continuum</span>
1597            <p class="line-clamp-2 text-sm leading-5 text-white/60">Agencies Future-Proof With Hybrid CMS/Headless</p>
1598          </div>
1599        </a>
1600      </li>
1601          <li>
1602        <a href="/articles/your-creativity-on-roids-with-blutui-headless" class="group flex items-start gap-4 sm:gap-5">
1603          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7779.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1604    <img
1605      data-journal-image
1606      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1607      src="https://cdn.blutui.com/uploads/curation/img-7779.jpeg?format=webp&amp;width=320"
1608      alt=""
1609      loading="lazy" decoding="async"
1610    /></div>
1611
1612          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1613            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-02-26T14:15:00+00:00">26 Feb 2025</time>
1614    <span aria-hidden="true">·</span>  <span>1 min read</span>
1615</p>
1616
1617            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Your Creativity on ‘Roids with Blutui Headless</span>
1618            <p class="line-clamp-2 text-sm leading-5 text-white/60">Agencies Unleash Your Creativity and Delivery with Blutui Headless</p>
1619          </div>
1620        </a>
1621      </li>
1622          <li>
1623        <a href="/articles/blutui-cares-deeply" class="group flex items-start gap-4 sm:gap-5">
1624          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-a-retro-television-set-with-rabbit-ear-antennae-in-a1380cc6-2223-4b4f-b047-17e895a24972.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1625    <img
1626      data-journal-image
1627      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1628      src="https://cdn.blutui.com/uploads/curation/codementor-a-retro-television-set-with-rabbit-ear-antennae-in-a1380cc6-2223-4b4f-b047-17e895a24972.jpeg?format=webp&amp;width=320"
1629      alt=""
1630      loading="lazy" decoding="async"
1631    /></div>
1632
1633          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1634            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-14T08:43:00+00:00">14 Jan 2025</time>
1635    <span aria-hidden="true">·</span>  <span>2 min read</span>
1636</p>
1637
1638            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Advertising: Who Cares? Blutui Cares.</span>
1639            <p class="line-clamp-2 text-sm leading-5 text-white/60">HNY, Here’s to a Happier, Healthier Adland With Blutui &amp; AWC</p>
1640          </div>
1641        </a>
1642      </li>
1643          <li>
1644        <a href="/articles/think-vs-know" class="group flex items-start gap-4 sm:gap-5">
1645          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7715.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1646    <img
1647      data-journal-image
1648      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1649      src="https://cdn.blutui.com/uploads/curation/img-7715.jpeg?format=webp&amp;width=320"
1650      alt=""
1651      loading="lazy" decoding="async"
1652    /></div>
1653
1654          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1655            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-13T11:49:00+00:00">13 Jan 2025</time>
1656    <span aria-hidden="true">·</span>  <span>3 min read</span>
1657</p>
1658
1659            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Thinking vs Knowing</span>
1660            <p class="line-clamp-2 text-sm leading-5 text-white/60">What Big Tech Execs Think Agencies Want vs. What Blutui Knows They Need</p>
1661          </div>
1662        </a>
1663      </li>
1664          <li>
1665        <a href="/articles/where-once-twas-chaos" class="group flex items-start gap-4 sm:gap-5">
1666          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-zen-54f8b6bc-6e8d-43a5-8975-648528b034b8.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1667    <img
1668      data-journal-image
1669      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1670      src="https://cdn.blutui.com/uploads/curation/codementor-zen-54f8b6bc-6e8d-43a5-8975-648528b034b8.jpeg?format=webp&amp;width=320"
1671      alt=""
1672      loading="lazy" decoding="async"
1673    /></div>
1674
1675          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1676            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-09T11:08:00+00:00">9 Jan 2025</time>
1677    <span aria-hidden="true">·</span>  <span>3 min read</span>
1678</p>
1679
1680            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Quietly. Confidently. It’s 9am.</span>
1681            <p class="line-clamp-2 text-sm leading-5 text-white/60">A Day in the Life of a Blutui-Powered Agency</p>
1682          </div>
1683        </a>
1684      </li>
1685          <li>
1686        <a href="/articles/headroom-vs-headcount" class="group flex items-start gap-4 sm:gap-5">
1687          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-max-headroom-wearing-beats-by-dre-headphones-with-a-db5d351b-0cb6-4e3b-9da6-f942308bcb65.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1688    <img
1689      data-journal-image
1690      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1691      src="https://cdn.blutui.com/uploads/curation/codementor-max-headroom-wearing-beats-by-dre-headphones-with-a-db5d351b-0cb6-4e3b-9da6-f942308bcb65.jpeg?format=webp&amp;width=320"
1692      alt=""
1693      loading="lazy" decoding="async"
1694    /></div>
1695
1696          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1697            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-05T09:48:00+00:00">5 Jan 2025</time>
1698    <span aria-hidden="true">·</span>  <span>2 min read</span>
1699</p>
1700
1701            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Headroom vs. Headcount</span>
1702            <p class="line-clamp-2 text-sm leading-5 text-white/60">Scaling Studio Capacity Sans More Heads</p>
1703          </div>
1704        </a>
1705      </li>
1706          <li>
1707        <a href="/articles/meta-takes-aim" class="group flex items-start gap-4 sm:gap-5">
1708          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7750.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1709    <img
1710      data-journal-image
1711      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1712      src="https://cdn.blutui.com/uploads/curation/img-7750.jpeg?format=webp&amp;width=320"
1713      alt=""
1714      loading="lazy" decoding="async"
1715    /></div>
1716
1717          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1718            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-05T07:14:00+00:00">5 Jan 2025</time>
1719    <span aria-hidden="true">·</span>  <span>3 min read</span>
1720</p>
1721
1722            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">‘Liv’ Ain’t Livin’ and Neither is ‘Grandpa Brian’</span>
1723            <p class="line-clamp-2 text-sm leading-5 text-white/60">Deeply Disturbing Deep Fake Audience Discovered as Meta Forced to U-Turn</p>
1724          </div>
1725        </a>
1726      </li>
1727          <li>
1728        <a href="/articles/the-catch-multiplication-theory" class="group flex items-start gap-4 sm:gap-5">
1729          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7656.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1730    <img
1731      data-journal-image
1732      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1733      src="https://cdn.blutui.com/uploads/curation/img-7656.png?format=webp&amp;width=320"
1734      alt=""
1735      loading="lazy" decoding="async"
1736    /></div>
1737
1738          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1739            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-05T01:45:00+00:00">5 Jan 2025</time>
1740    <span aria-hidden="true">·</span>  <span>2 min read</span>
1741</p>
1742
1743            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Compounding Chaos Theory</span>
1744            <p class="line-clamp-2 text-sm leading-5 text-white/60">Too busy to explore Blutui? That’s not a reason, it’s precisely why you should.</p>
1745          </div>
1746        </a>
1747      </li>
1748          <li>
1749        <a href="/articles/one-for-the-c-suite" class="group flex items-start gap-4 sm:gap-5">
1750          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/codementor-a-modern-office-building-elevator-doors-with-up-and-08552e7f-60eb-41db-b8fb-38a15e7298a2.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1751    <img
1752      data-journal-image
1753      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1754      src="https://cdn.blutui.com/uploads/curation/codementor-a-modern-office-building-elevator-doors-with-up-and-08552e7f-60eb-41db-b8fb-38a15e7298a2.jpeg?format=webp&amp;width=320"
1755      alt=""
1756      loading="lazy" decoding="async"
1757    /></div>
1758
1759          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1760            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2025-01-02T03:09:00+00:00">2 Jan 2025</time>
1761    <span aria-hidden="true">·</span>  <span>2 min read</span>
1762</p>
1763
1764            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">One for the C-Suite</span>
1765            <p class="line-clamp-2 text-sm leading-5 text-white/60">How To Boost Your Agency’s Dev Productivity by 244%-400%</p>
1766          </div>
1767        </a>
1768      </li>
1769      </ul>
1770</div>
1771
1772                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
1773  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
1774    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
1775    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2024</span>
1776  </h3>
1777
1778  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
1779          <li>
1780        <a href="/articles/focused-on-our-foundations-in-s-about-growth" class="group flex items-start gap-4 sm:gap-5">
1781          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7722.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1782    <img
1783      data-journal-image
1784      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1785      src="https://cdn.blutui.com/uploads/curation/img-7722.jpeg?format=webp&amp;width=320"
1786      alt=""
1787      loading="lazy" decoding="async"
1788    /></div>
1789
1790          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1791            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-12-17T13:13:00+00:00">17 Dec 2024</time>
1792    <span aria-hidden="true">·</span>  <span>2 min read</span>
1793</p>
1794
1795            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Foundations the Focus of ‘24, Growth for ‘25</span>
1796            <p class="line-clamp-2 text-sm leading-5 text-white/60">The year in review from Graeme Blake, CEO of Blutui</p>
1797          </div>
1798        </a>
1799      </li>
1800          <li>
1801        <a href="/articles/advertising-in-the-age-of-snackable-value-a-ride-share-reality-check" class="group flex items-start gap-4 sm:gap-5">
1802          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7651.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1803    <img
1804      data-journal-image
1805      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1806      src="https://cdn.blutui.com/uploads/curation/img-7651.jpeg?format=webp&amp;width=320"
1807      alt=""
1808      loading="lazy" decoding="async"
1809    /></div>
1810
1811          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1812            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-12-15T12:29:00+00:00">15 Dec 2024</time>
1813    <span aria-hidden="true">·</span>  <span>3 min read</span>
1814</p>
1815
1816            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Advertising in an Age of Snackable Value: A Ride-Share Reality Check</span>
1817            <p class="line-clamp-2 text-sm leading-5 text-white/60">The advertising industry is in crisis, and it’s one of its own making—or so it seems at first glance.</p>
1818          </div>
1819        </a>
1820      </li>
1821          <li>
1822        <a href="/articles/former-tribe-leader-turns-blutui-ambassador" class="group flex items-start gap-4 sm:gap-5">
1823          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-7687.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1824    <img
1825      data-journal-image
1826      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1827      src="https://cdn.blutui.com/uploads/curation/img-7687.jpeg?format=webp&amp;width=320"
1828      alt=""
1829      loading="lazy" decoding="async"
1830    /></div>
1831
1832          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1833            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-11-21T10:52:00+00:00">21 Nov 2024</time>
1834    <span aria-hidden="true">·</span>  <span>1 min read</span>
1835</p>
1836
1837            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Former Tribe Leader Turns Blutui Ambassador</span>
1838            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui Welcomes Former Tribe Global MD, Ian Wright as Blutui Ambassador</p>
1839          </div>
1840        </a>
1841      </li>
1842          <li>
1843        <a href="/articles/global-digital-delivery-chief-supercharges-blutuir" class="group flex items-start gap-4 sm:gap-5">
1844          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/curation/img-6604.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1845    <img
1846      data-journal-image
1847      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1848      src="https://cdn.blutui.com/uploads/curation/img-6604.jpeg?format=webp&amp;width=320"
1849      alt=""
1850      loading="lazy" decoding="async"
1851    /></div>
1852
1853          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1854            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-04-21T14:00:00+00:00">21 Apr 2024</time>
1855    <span aria-hidden="true">·</span>  <span>2 min read</span>
1856</p>
1857
1858            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Global Digital Delivery Chief Supercharges Blutui®</span>
1859            <p class="line-clamp-2 text-sm leading-5 text-white/60">Amir Mireskandari gets onboard with Blutui Universal Digital Delivery Platform</p>
1860          </div>
1861        </a>
1862      </li>
1863          <li>
1864        <a href="/articles/a-call-for-holistic-integration" class="group flex items-start gap-4 sm:gap-5">
1865          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/img-6338.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1866    <img
1867      data-journal-image
1868      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1869      src="https://cdn.blutui.com/uploads/articles/img-6338.jpeg?format=webp&amp;width=320"
1870      alt=""
1871      loading="lazy" decoding="async"
1872    /></div>
1873
1874          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1875            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-03-06T11:35:08+00:00">6 Mar 2024</time>
1876    <span aria-hidden="true">·</span>  <span>1 min read</span>
1877</p>
1878
1879            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">A Call for Holistic Integration</span>
1880            <p class="line-clamp-2 text-sm leading-5 text-white/60">Navigating the Fragmented Landscape of AI Development</p>
1881          </div>
1882        </a>
1883      </li>
1884          <li>
1885        <a href="/articles/supercharge-your-digital-studio-productivity-with-blutuir-ai-components" class="group flex items-start gap-4 sm:gap-5">
1886          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/img-6327.gif?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1887    <img
1888      data-journal-image
1889      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1890      src="https://cdn.blutui.com/uploads/articles/img-6327.gif?format=webp&amp;width=320"
1891      alt=""
1892      loading="lazy" decoding="async"
1893    /></div>
1894
1895          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1896            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-02-17T21:01:00+00:00">17 Feb 2024</time>
1897    <span aria-hidden="true">·</span>  <span>1 min read</span>
1898</p>
1899
1900            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Supercharge Your Digital Studio Productivity with Blutui® AI Components</span>
1901            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui leverages AI to help front-end developers shine brighter than ever.</p>
1902          </div>
1903        </a>
1904      </li>
1905          <li>
1906        <a href="/articles/the-ai-pendulum-swings" class="group flex items-start gap-4 sm:gap-5">
1907          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/codementor-banksy-inspired-artwork-depicting-the-rise-of-gener-d51d7842-382e-4773-bb60-ab56c3c6b207.webp?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1908    <img
1909      data-journal-image
1910      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1911      src="https://cdn.blutui.com/uploads/articles/codementor-banksy-inspired-artwork-depicting-the-rise-of-gener-d51d7842-382e-4773-bb60-ab56c3c6b207.webp?format=webp&amp;width=320"
1912      alt=""
1913      loading="lazy" decoding="async"
1914    /></div>
1915
1916          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1917            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2024-01-19T21:02:18+00:00">19 Jan 2024</time>
1918    <span aria-hidden="true">·</span>  <span>3 min read</span>
1919</p>
1920
1921            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">As the AI Pendulum Swings</span>
1922            <p class="line-clamp-2 text-sm leading-5 text-white/60">Embracing the Crafted-by-Human Touch in this Age of AI-Generated Content</p>
1923          </div>
1924        </a>
1925      </li>
1926      </ul>
1927</div>
1928
1929                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
1930  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
1931    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
1932    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2023</span>
1933  </h3>
1934
1935  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
1936          <li>
1937        <a href="/articles/unleashing-ai" class="group flex items-start gap-4 sm:gap-5">
1938          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/code-mentor-mid-thirties-creative-professional-woman-stares-dir-4a5bf2d7-b197-4146-b3fd-6cf9aa62694e.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1939    <img
1940      data-journal-image
1941      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1942      src="https://cdn.blutui.com/uploads/articles/code-mentor-mid-thirties-creative-professional-woman-stares-dir-4a5bf2d7-b197-4146-b3fd-6cf9aa62694e.png?format=webp&amp;width=320"
1943      alt=""
1944      loading="lazy" decoding="async"
1945    /></div>
1946
1947          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1948            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-06-02T13:35:05+00:00">2 Jun 2023</time>
1949    <span aria-hidden="true">·</span>  <span>3 min read</span>
1950</p>
1951
1952            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Unleashing AI</span>
1953            <p class="line-clamp-2 text-sm leading-5 text-white/60">Actual Intelligence: Blutui&#039;s Revolutionary Approach to Digital Delivery</p>
1954          </div>
1955        </a>
1956      </li>
1957          <li>
1958        <a href="/articles/im-sorry-but-i-am-waaaaay-too-snowed-under" class="group flex items-start gap-4 sm:gap-5">
1959          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/code-mentor-stunning-dark-skinned-woman-executive-looks-disheve-c6aea656-09e5-4fc6-b277-f642f64656ce.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1960    <img
1961      data-journal-image
1962      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1963      src="https://cdn.blutui.com/uploads/articles/code-mentor-stunning-dark-skinned-woman-executive-looks-disheve-c6aea656-09e5-4fc6-b277-f642f64656ce.png?format=webp&amp;width=320"
1964      alt=""
1965      loading="lazy" decoding="async"
1966    /></div>
1967
1968          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1969            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-05-17T13:36:06+00:00">17 May 2023</time>
1970    <span aria-hidden="true">·</span>  <span>1 min read</span>
1971</p>
1972
1973            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">I’m sorry but I am waaaaay too snowed under.</span>
1974            <p class="line-clamp-2 text-sm leading-5 text-white/60">A project managers cry for help</p>
1975          </div>
1976        </a>
1977      </li>
1978          <li>
1979        <a href="/articles/blutui-strengthens-global-presence" class="group flex items-start gap-4 sm:gap-5">
1980          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/img-5408.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
1981    <img
1982      data-journal-image
1983      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
1984      src="https://cdn.blutui.com/uploads/articles/img-5408.jpeg?format=webp&amp;width=320"
1985      alt=""
1986      loading="lazy" decoding="async"
1987    /></div>
1988
1989          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
1990            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-05-15T13:38:14+00:00">15 May 2023</time>
1991    <span aria-hidden="true">·</span>  <span>2 min read</span>
1992</p>
1993
1994            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Blutui Strengthens Global Adland Presence</span>
1995            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui Appoints Carl Witton as Business Advisor</p>
1996          </div>
1997        </a>
1998      </li>
1999          <li>
2000        <a href="/articles/agency-project-managers-your-struggle-is-real" class="group flex items-start gap-4 sm:gap-5">
2001          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/code-mentor-photo-realism-sharp-focus-on-a-modern-day-female-ad-5be0a91e-be06-43af-b79b-148bcbb25667.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2002    <img
2003      data-journal-image
2004      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2005      src="https://cdn.blutui.com/uploads/articles/code-mentor-photo-realism-sharp-focus-on-a-modern-day-female-ad-5be0a91e-be06-43af-b79b-148bcbb25667.png?format=webp&amp;width=320"
2006      alt=""
2007      loading="lazy" decoding="async"
2008    /></div>
2009
2010          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2011            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-05-11T13:36:58+00:00">11 May 2023</time>
2012    <span aria-hidden="true">·</span>  <span>2 min read</span>
2013</p>
2014
2015            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Agency project managers, the struggle is real</span>
2016            <p class="line-clamp-2 text-sm leading-5 text-white/60">Viva la digital studio revolución - a Blutui story of hope</p>
2017          </div>
2018        </a>
2019      </li>
2020          <li>
2021        <a href="/articles/what-if-you-could-create-control" class="group flex items-start gap-4 sm:gap-5">
2022          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/99120bf0-c0c2-41a1-abd2-73c6978ac9a6.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2023    <img
2024      data-journal-image
2025      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2026      src="https://cdn.blutui.com/uploads/articles/99120bf0-c0c2-41a1-abd2-73c6978ac9a6.png?format=webp&amp;width=320"
2027      alt=""
2028      loading="lazy" decoding="async"
2029    /></div>
2030
2031          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2032            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-05-10T13:39:07+00:00">10 May 2023</time>
2033    <span aria-hidden="true">·</span>  <span>3 min read</span>
2034</p>
2035
2036            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">If you could create control</span>
2037            <p class="line-clamp-2 text-sm leading-5 text-white/60">The advantages of a universal approach to project delivery</p>
2038          </div>
2039        </a>
2040      </li>
2041          <li>
2042        <a href="/articles/capt-universal-defies-fragmentor-the-margin-killer" class="group flex items-start gap-4 sm:gap-5">
2043          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/7fbdaa63-e104-418b-b94e-bc5d55da1e0a.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2044    <img
2045      data-journal-image
2046      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2047      src="https://cdn.blutui.com/uploads/articles/7fbdaa63-e104-418b-b94e-bc5d55da1e0a.jpeg?format=webp&amp;width=320"
2048      alt=""
2049      loading="lazy" decoding="async"
2050    /></div>
2051
2052          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2053            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-05-03T13:40:14+00:00">3 May 2023</time>
2054    <span aria-hidden="true">·</span>  <span>3 min read</span>
2055</p>
2056
2057            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Capt. Universal defies Fragmentor - the margin killer</span>
2058            <p class="line-clamp-2 text-sm leading-5 text-white/60">Defend your studio bottom line from the perils of technical fragmentation</p>
2059          </div>
2060        </a>
2061      </li>
2062          <li>
2063        <a href="/articles/global-vision-for-blutui-cco" class="group flex items-start gap-4 sm:gap-5">
2064          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/978bedbf-45a8-403d-898c-a3953641a6ec.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2065    <img
2066      data-journal-image
2067      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2068      src="https://cdn.blutui.com/uploads/articles/978bedbf-45a8-403d-898c-a3953641a6ec.jpeg?format=webp&amp;width=320"
2069      alt=""
2070      loading="lazy" decoding="async"
2071    /></div>
2072
2073          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2074            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-05-01T13:41:22+00:00">1 May 2023</time>
2075    <span aria-hidden="true">·</span>  <span>1 min read</span>
2076</p>
2077
2078            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Global vision for Blutui CCO</span>
2079            <p class="line-clamp-2 text-sm leading-5 text-white/60">Christy Fung takes Blutui® to Adland</p>
2080          </div>
2081        </a>
2082      </li>
2083          <li>
2084        <a href="/articles/actual-vs-artificial" class="group flex items-start gap-4 sm:gap-5">
2085          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/0824665e-1556-41ad-89a6-a57676c10ca5.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2086    <img
2087      data-journal-image
2088      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2089      src="https://cdn.blutui.com/uploads/articles/0824665e-1556-41ad-89a6-a57676c10ca5.png?format=webp&amp;width=320"
2090      alt=""
2091      loading="lazy" decoding="async"
2092    /></div>
2093
2094          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2095            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2023-02-27T13:42:08+00:00">27 Feb 2023</time>
2096    <span aria-hidden="true">·</span>  <span>1 min read</span>
2097</p>
2098
2099            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Actual vs Artificial</span>
2100            <p class="line-clamp-2 text-sm leading-5 text-white/60">We ask ChatGPT “What are the undesirable aspects of AI powered digital development” and here’s what the machines had to say:</p>
2101          </div>
2102        </a>
2103      </li>
2104      </ul>
2105</div>
2106
2107                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
2108  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
2109    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
2110    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2022</span>
2111  </h3>
2112
2113  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
2114          <li>
2115        <a href="/articles/digital-that-dont-get-talked-about" class="group flex items-start gap-4 sm:gap-5">
2116          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/16766f35-69b4-4f43-bcf0-57ae199ac0bd.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2117    <img
2118      data-journal-image
2119      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2120      src="https://cdn.blutui.com/uploads/articles/16766f35-69b4-4f43-bcf0-57ae199ac0bd.jpeg?format=webp&amp;width=320"
2121      alt=""
2122      loading="lazy" decoding="async"
2123    /></div>
2124
2125          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2126            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-11-18T14:06:28+00:00">18 Nov 2022</time>
2127    <span aria-hidden="true">·</span>  <span>2 min read</span>
2128</p>
2129
2130            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Digital that don’t get talked about</span>
2131            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui keeping Mum on who uses in Adland</p>
2132          </div>
2133        </a>
2134      </li>
2135          <li>
2136        <a href="/articles/the-best-time-was-then-yada-yada-you-get
2136-it" class="group flex items-start gap-4 sm:gap-5">
2137          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/4c67c3f0-c52f-4bef-9212-9fa97e16cef8.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2138    <img
2139      data-journal-image
2140      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2141      src="https://cdn.blutui.com/uploads/articles/4c67c3f0-c52f-4bef-9212-9fa97e16cef8.jpeg?format=webp&amp;width=320"
2142      alt=""
2143      loading="lazy" decoding="async"
2144    /></div>
2145
2146          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2147            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-11-14T14:05:28+00:00">14 Nov 2022</time>
2148    <span aria-hidden="true">·</span>  <span>2 min read</span>
2149</p>
2150
2151            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">The best time was then, you know the story right?</span>
2152            <p class="line-clamp-2 text-sm leading-5 text-white/60">Blutui injects recession beating resilience into your digital studio.</p>
2153          </div>
2154        </a>
2155      </li>
2156          <li>
2157        <a href="/articles/flight-plans-v-yul-h8" class="group flex items-start gap-4 sm:gap-5">
2158          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/eee7077b-77b8-499b-aae9-72f6b400a7cf.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2159    <img
2160      data-journal-image
2161      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2162      src="https://cdn.blutui.com/uploads/articles/eee7077b-77b8-499b-aae9-72f6b400a7cf.jpeg?format=webp&amp;width=320"
2163      alt=""
2164      loading="lazy" decoding="async"
2165    /></div>
2166
2167          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2168            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-10-01T14:02:36+00:00">1 Oct 2022</time>
2169    <span aria-hidden="true">·</span>  <span>3 min read</span>
2170</p>
2171
2172            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Flight Plan v1.23.8</span>
2173            <p class="line-clamp-2 text-sm leading-5 text-white/60">Top secret flight plans for Blutui platform development</p>
2174          </div>
2175        </a>
2176      </li>
2177          <li>
2178        <a href="/articles/hey-adland-youve-left-something-behind" class="group flex items-start gap-4 sm:gap-5">
2179          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/9ccc1d41-de65-4ce9-8e92-63c7c1d94a6f.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2180    <img
2181      data-journal-image
2182      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2183      src="https://cdn.blutui.com/uploads/articles/9ccc1d41-de65-4ce9-8e92-63c7c1d94a6f.jpeg?format=webp&amp;width=320"
2184      alt=""
2185      loading="lazy" decoding="async"
2186    /></div>
2187
2188          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2189            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-09-28T14:01:48+00:00">28 Sep 2022</time>
2190    <span aria-hidden="true">·</span>  <span>3 min read</span>
2191</p>
2192
2193            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Hey Adland, you’ve left something behind</span>
2194            <p class="line-clamp-2 text-sm leading-5 text-white/60">It’s completely unnatural for any agency to leave so much client cash on the table.</p>
2195          </div>
2196        </a>
2197      </li>
2198          <li>
2199        <a href="/articles/the-gift-of-time-in-a-digital-agency" class="group flex items-start gap-4 sm:gap-5">
2200          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/5fe8a432-9004-40e0-8f7e-53c4124a2dd1.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2201    <img
2202      data-journal-image
2203      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2204      src="https://cdn.blutui.com/uploads/articles/5fe8a432-9004-40e0-8f7e-53c4124a2dd1.jpeg?format=webp&amp;width=320"
2205      alt=""
2206      loading="lazy" decoding="async"
2207    /></div>
2208
2209          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2210            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-09-27T13:54:43+00:00">27 Sep 2022</time>
2211    <span aria-hidden="true">·</span>  <span>2 min read</span>
2212</p>
2213
2214            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">The gift of time in your digital agency</span>
2215            <p class="line-clamp-2 text-sm leading-5 text-white/60">Your guide to comparing A]: Drupal or Wordpress project set up with B]: Blutui®</p>
2216          </div>
2217        </a>
2218      </li>
2219          <li>
2220        <a href="/articles/what-were-up-to-and-why" class="group flex items-start gap-4 sm:gap-5">
2221          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/1711fe64-9798-400d-a4bc-6690046414c8.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2222    <img
2223      data-journal-image
2224      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2225      src="https://cdn.blutui.com/uploads/articles/1711fe64-9798-400d-a4bc-6690046414c8.jpeg?format=webp&amp;width=320"
2226      alt=""
2227      loading="lazy" decoding="async"
2228    /></div>
2229
2230          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2231            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-09-09T13:53:07+00:00">9 Sep 2022</time>
2232    <span aria-hidden="true">·</span>  <span>3 min read</span>
2233</p>
2234
2235            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">What we’re up to and why</span>
2236            <p class="line-clamp-2 text-sm leading-5 text-white/60">Our teams motivation for changing development in Adland</p>
2237          </div>
2238        </a>
2239      </li>
2240          <li>
2241        <a href="/articles/the-cookie-cutter-creative-economy" class="group flex items-start gap-4 sm:gap-5">
2242          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/93512c45-5bd1-418e-a475-cfb06b7f9397.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2243    <img
2244      data-journal-image
2245      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2246      src="https://cdn.blutui.com/uploads/articles/93512c45-5bd1-418e-a475-cfb06b7f9397.jpeg?format=webp&amp;width=320"
2247      alt=""
2248      loading="lazy" decoding="async"
2249    /></div>
2250
2251          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2252            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2022-05-10T13:51:06+00:00">10 May 2022</time>
2253    <span aria-hidden="true">·</span>  <span>3 min read</span>
2254</p>
2255
2256            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">The Cookie Cutter Creative Economy</span>
2257            <p class="line-clamp-2 text-sm leading-5 text-white/60">In a sea of sameness it’s getting easier to stand out as an amazing creative talent.</p>
2258          </div>
2259        </a>
2260      </li>
2261      </ul>
2262</div>
2263
2264                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
2265  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
2266    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
2267    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2021</span>
2268  </h3>
2269
2270  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
2271          <li>
2272        <a href="/articles/champions-of-creativity-in-digital-design" class="group flex items-start gap-4 sm:gap-5">
2273          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/blutui-article.png?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2274    <img
2275      data-journal-image
2276      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2277      src="https://cdn.blutui.com/uploads/articles/blutui-article.png?format=webp&amp;width=320"
2278      alt=""
2279      loading="lazy" decoding="async"
2280    /></div>
2281
2282          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2283            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2021-06-23T13:47:50+00:00">23 Jun 2021</time>
2284    <span aria-hidden="true">·</span>  <span>3 min read</span>
2285</p>
2286
2287            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Champions Of Creativity In Digital Design</span>
2288            <p class="line-clamp-2 text-sm leading-5 text-white/60">Open Letter To Creative Agencies Everywhere</p>
2289          </div>
2290        </a>
2291      </li>
2292          <li>
2293        <a href="/articles/creativity-and-the-democratisation-of-web-development" class="group flex items-start gap-4 sm:gap-5">
2294          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/mail.jpeg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2295    <img
2296      data-journal-image
2297      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2298      src="https://cdn.blutui.com/uploads/articles/mail.jpeg?format=webp&amp;width=320"
2299      alt=""
2300      loading="lazy" decoding="async"
2301    /></div>
2302
2303          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2304            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2021-03-25T13:46:18+00:00">25 Mar 2021</time>
2305    <span aria-hidden="true">·</span>  <span>3 min read</span>
2306</p>
2307
2308            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Creativity and the democratisation of web development</span>
2309            <p class="line-clamp-2 text-sm leading-5 text-white/60">Post-Covid Adland represents a fractured and frail shadow of its former self.</p>
2310          </div>
2311        </a>
2312      </li>
2313      </ul>
2314</div>
2315
2316                      <div data-reveal="block" class="flex flex-col border border-white/15 bg-panel lg:flex-row">
2317  <h3 class="flex flex-col gap-2.5 border-b border-white/15 px-5 py-6 sm:px-10 lg:w-2/6 lg:border-r lg:border-b-0 lg:py-[50px]">
2318    <span class="text-xs leading-4 font-bold tracking-[0.05em] uppercase text-white">Articles</span>
2319    <span class="text-3xl leading-[38px] font-bold tracking-[-0.02em] text-neutral-200 lg:text-[36px]">2020</span>
2320  </h3>
2321
2322  <ul class="grid content-start gap-x-10 gap-y-8 p-5 sm:grid-cols-2 sm:p-[30px] lg:w-4/6 lg:p-10">
2323          <li>
2324        <a href="/articles/will-agencies-thrive-or-dive-in-the-new-economy" class="group flex items-start gap-4 sm:gap-5">
2325          <div data-journal-frame class="relative isolate aspect-[4/3] overflow-hidden bg-navy-800 w-24 shrink-0 rounded-[6px] sm:w-[140px]">    <img data-journal-backdrop src="https://cdn.blutui.com/uploads/articles/remote_office_enhanced.jpg?format=webp&amp;width=320" alt="" aria-hidden="true" loading="lazy" decoding="async" />
2326    <img
2327      data-journal-image
2328      class="size-full transition-transform duration-500 ease-out group-hover:scale-[1.03]"
2329      src="https://cdn.blutui.com/uploads/articles/remote_office_enhanced.jpg?format=webp&amp;width=320"
2330      alt=""
2331      loading="lazy" decoding="async"
2332    /></div>
2333
2334          <div class="flex min-w-0 flex-1 flex-col gap-1.5">
2335            <p class="flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] leading-4 font-bold tracking-[0.04em] uppercase text-white/55 sm:tracking-[0.08em] ">    <time datetime="2020-04-21T13:44:01+00:00">21 Apr 2020</time>
2336    <span aria-hidden="true">·</span>  <span>2 min read</span>
2337</p>
2338
2339            <span class="text-base leading-[22px] font-medium text-white transition-colors group-hover:text-white/70">Will agencies thrive or dive in the new economy?</span>
2340            <p class="line-clamp-2 text-sm leading-5 text-white/60">3 minutes with James Star</p>
2341          </div>
2342        </a>
2343      </li>
2344      </ul>
2345</div>
2346
2347                  </div>
2348          </div>
2349  </div>
2350</section>
2351
2352    
2353    </main>
2354
2355        
2356
2357    
2358
2359<footer class="relative overflow-clip bg-navy-950">
2360    <canvas data-footer-gradient aria-hidden="true" class="pointer-events-none absolute inset-x-0 bottom-0 h-[93%] w-full opacity-0"></canvas>
2361  <img
2362    data-footer-gradient-fallback
2363    src="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/images/footer-gradient.webp?v=1789938902"
2364    alt=""
2365    aria-hidden="true"
2366    loading="lazy"
2367    decoding="async"
2368    class="pointer-events-none absolute inset-x-0 bottom-0 h-[93%] w-full select-none"
2369  />
2370
2371    <div data-grid-lines aria-hidden="true" class="pointer-events-none absolute inset-0 z-0 hidden select-none lg:block">
2372  <div class="container-site h-full">
2373    <div class="grid h-full grid-cols-6 *:border-l *:border-dashed *:border-white/15">
2374      <span></span>
2375      <span></span>
2376      <span></span>
2377      <span></span>
2378      <span></span>
2379      <span class="border-r"></span>
2380    </div>
2381  </div>
2382</div>
2383
2384
2385  <div class="container-site relative pt-16 sm:pt-24"><nav aria-label="Footer" class="grid grid-cols-2 gap-x-8 gap-y-10 sm:grid-cols-3 lg:grid-cols-6 lg:gap-x-0 lg:*:px-gutter">
2386                                            <div>
2387              <p class="text-sm leading-none font-bold text-white">Platform</p>
2388              <ul class="mt-3 space-y-2.5">
2389                                  <li><a href="/platform/agency" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Agency</a></li>
2390                                  <li><a href="/platform/build" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Build</a></li>
2391                                  <li><a href="/platform/manage" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Manage</a></li>
2392                                  <li><a href="/platform/edit" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Edit</a></li>
2393                                  <li><a href="/platform/deliver" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Deliver</a></li>
2394                                  <li><a href="/platform/integrate" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Integrate</a></li>
2395                              </ul>
2396            </div>
2397                                                                            <div>
2398                <p class="flex flex-wrap items-end gap-x-1.5 gap-y-1 text-sm leading-none font-bold tracking-tight text-white">
2399                  Solutions
2400                  <span class="text-xs leading-none tracking-normal text-white/50">by agency</span>                </p>
2401                <ul class="mt-3 space-y-2.5">
2402                                      <li><a href="/solutions/boutique-agency" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Boutique agency</a></li>
2403                                      <li><a href="/solutions/mid-market-digital-agency" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Mid-market digital agency</a></li>
2404                                      <li><a href="/solutions/enterprise-and-full-service-agency" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Enterprise &amp; full-service agency</a></li>
2405                                      <li><a href="/solutions/large-and-agency-groups" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Large &amp; agency groups</a></li>
2406                                      <li><a href="/solutions/network-and-multi-region" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Network &amp; multi-region</a></li>
2407                                      <li><a href="/solutions/in-house-brand" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">In-house brand</a></li>
2408                                  </ul>
2409              </div>
2410                          <div>
2411                <p class="flex flex-wrap items-end gap-x-1.5 gap-y-1 text-sm leading-none font-bold tracking-tight text-white">
2412                  Solutions
2413                  <span class="text-xs leading-none tracking-normal text-white/50">by role</span>                </p>
2414                <ul class="mt-3 space-y-2.5">
2415                                      <li><a href="/solutions/engineering" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Engineering</a></li>
2416                                      <li><a href="/solutions/agency-leadership" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Agency leadership</a></li>
2417                                      <li><a href="/solutions/design" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Design</a></li>
2418                                      <li><a href="/solutions/content-and-copywriting" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Content &amp; copywriting</a></li>
2419                                      <li><a href="/solutions/marketing-and-seo" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Marketing &amp; SEO</a></li>
2420                                      <li><a href="/solutions/project-management" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Project Management</a></li>
2421                                  </ul>
2422              </div>
2423                          <div>
2424                <p class="flex flex-wrap items-end gap-x-1.5 gap-y-1 text-sm leading-none font-bold tracking-tight text-white">
2425                  Solutions
2426                  <span class="text-xs leading-none tracking-normal text-white/50">by challenge</span>                </p>
2427                <ul class="mt-3 space-y-2.5">
2428                                      <li><a href="/solutions/resource-and-capacity" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Resource &amp; capacity</a></li>
2429                                      <li><a href="/solutions/profitability-and-tracking" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Profitability &amp; tracking</a></li>
2430                                      <li><a href="/solutions/scale-an-agency" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Scale an agency</a></li>
2431                                  </ul>
2432              </div>
2433                                                                          <div>
2434              <p class="text-sm leading-none font-bold text-white">Resources</p>
2435              <ul class="mt-3 space-y-2.5">
2436                                  <li><a href="https://docs.blutui.com/docs" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Documentation</a></li>
2437                                  <li><a href="https://docs.blutui.com" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Developer resources</a></li>
2438                                  <li><a href="https://docs.blutui.com/guides" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Guides</a></li>
2439                                  <li><a href="/articles" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Blog</a></li>
2440                                  <li><a href="/transform" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Transform</a></li>
2441                                  <li><a href="/changelog" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Changelog</a></li>
2442                                  <li><a href="/ambassadors" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Ambassadors</a></li>
2443                                  <li><a href="/labs" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Blutui Labs</a></li>
2444                              </ul>
2445            </div>
2446                                              
2447                                <div>
2448            <p class="text-sm leading-none font-bold text-white">Company</p>
2449            <ul class="mt-3 space-y-2">
2450                              <li><a href="/brand" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Brand</a></li>
2451                              <li><a href="/pricing" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Pricing</a></li>
2452                              <li><a href="/enterprise" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Enterprise</a></li>
2453                              <li><a href="/contact" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Contact</a></li>
2454                              <li><a href="/legal" class="block text-sm leading-[1.3] text-white transition hover:text-white/60">Legal</a></li>
2455                          </ul>
2456          </div>
2457                  </nav>
2458
2459    <div class="mt-12 flex flex-wrap items-center gap-x-6 gap-y-3 text-white/60 lg:px-gutter">
2460      <p class="text-[11px] font-medium uppercase">© 2026 Blutui. All rights reserved</p>
2461      <ul class="flex flex-1 gap-4 text-xs">
2462                  <li><a href="https://x.com/blutui" target="_blank" rel="noopener" class="transition hover:text-white">X</a></li>
2463                  <li><a href="https://www.linkedin.com/company/blutui" target="_blank" rel="noopener" class="transition hover:text-white">LinkedIn</a></li>
2464                  <li><a href="https://discord.gg/VZZnQeeEv6" target="_blank" rel="noopener" class="transition hover:text-white">Discord</a></li>
2465                  <li><a href="https://www.youtube.com/@useBlutui" target="_blank" rel="noopener" class="transition hover:text-white">YouTube</a></li>
2466                  <li><a href="https://github.com/blutui" target="_blank" rel="noopener" class="transition hover:text-white">GitHub</a></li>
2467              </ul>
2468      <p class="text-[11px] font-medium uppercase">Made in Blutui</p>
2469    </div>
2470
2471        <div data-footer-logo class="mt-14 -mb-[1.5%] sm:mt-20">
2472      <canvas class="block aspect-[1200/404.3] w-full translate-y-4" role="img" aria-label="blutui"></canvas>
2473    </div>
2474  </div>
2475</footer>
2476
2477
2478        <div data-overscroll data-overscroll-text="Start creating" hidden aria-hidden="true" class="pointer-events-none fixed inset-0 z-[60] bg-citron-400 select-none">
2479  <canvas class="block size-full text-navy-900"></canvas>
2480</div>
2481
2482
2483            
2483<script src="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/js/app.js?v=1790803265" fetchpriority="high"></script>
2483
2484    
2484<script src="https://cdn.blutui.com/s/blutui_27/c/01a0ad02-cf2f-701b-8730-43166c7e59f6/js/hero-shader.js?v=1790640569"></script>
2484
2485  
2485<script type="text/javascript"> _linkedin_partner_id = "4372508"; window._linkedin_data_partner_ids = window._linkedin_data_partner_ids || []; window._linkedin_data_partner_ids.push(_linkedin_partner_id); </script>
2485<script type="text/javascript"> (function(l) { if (!l){window.lintrk = function(a,b){window.lintrk.q.push([a,b])}; window.lintrk.q=[]} var s = document.getElementsByTagName("script")[0]; var b = document.createElement("script"); b.type = "text/javascript";b.async = true; b.src = "https://snap.licdn.com/li.lms-analytics/insight.min.js"; s.parentNode.insertBefore(b, s);})(window.lintrk); </script>
2485 <noscript> <img height="1" width="1" style="display:none;" alt="" src="https://px.ads.linkedin.com/collect/?pid=4372508&fmt=gif" /> </noscript></body>
2486</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.