diff --git a/src/routes/docs/quick-starts/+page.svelte b/src/routes/docs/quick-starts/+page.svelte
index 0efcc7a48..3b823fac8 100644
--- a/src/routes/docs/quick-starts/+page.svelte
+++ b/src/routes/docs/quick-starts/+page.svelte
@@ -197,8 +197,8 @@
 <main class="web-main-section" id="main">
     <article class="web-article">
         <header class="web-article-header">
-            <div class="web-article-header-start u-flex-vertical web-u-cross-start">
-                <div class="u-position-relative u-flex u-cross-center">
+            <div class="web-article-header-start flex flex-col web-u-cross-start">
+                <div class="relative flex items-center">
                     <h1 class="web-title">Quick start</h1>
                 </div>
             </div>
@@ -206,7 +206,7 @@
         </header>
         <div class="web-article-content web-u-gap-80">
             {#each quickStarts as category}
-                <section class="u-flex-vertical u-gap-24">
+                <section class="flex flex-col gap-6">
                     <h2 class="web-eyebrow">{category.title}</h2>
                     <ul class="web-grid-row-4 web-grid-row-4-mobile-2">
                         {#each category.quickStarts as quickStart}
@@ -215,7 +215,7 @@
                                     href={`/docs/quick-starts/${quickStart.href}`}
                                     class="web-card is-normal"
                                 >
-                                    <header class="u-flex u-cross-baseline u-gap-4">
+                                    <header class="flex items-baseline gap-1">
                                         <span
                                             class="{quickStart.icon} web-u-font-size-24"
                                             aria-hidden="true"
diff --git a/src/routes/docs/references/[version]/[platform]/[service]/(components)/RateLimits.svelte b/src/routes/docs/references/[version]/[platform]/[service]/(components)/RateLimits.svelte
index 1170b86eb..c60882c54 100644
--- a/src/routes/docs/references/[version]/[platform]/[service]/(components)/RateLimits.svelte
+++ b/src/routes/docs/references/[version]/[platform]/[service]/(components)/RateLimits.svelte
@@ -37,9 +37,9 @@
     }
 </script>
 
-<div class="web-card is-normal u-padding-16">
-    <div class="u-flex-vertical u-gap-24">
-        <div class="u-flex-vertical u-gap-16">
+<div class="web-card is-normal p-4">
+    <div class="flex flex-col gap-6">
+        <div class="flex flex-col gap-4">
             {#if platformType === 'CLIENT'}
                 <p class="web-sub-body-400">
                     This endpoint is rate limited. You can only make a limited number of request to
diff --git a/src/routes/docs/references/[version]/[platform]/[service]/(components)/Request.svelte b/src/routes/docs/references/[version]/[platform]/[service]/(components)/Request.svelte
index 35da0de06..a53eabd51 100644
--- a/src/routes/docs/references/[version]/[platform]/[service]/(components)/Request.svelte
+++ b/src/routes/docs/references/[version]/[platform]/[service]/(components)/Request.svelte
@@ -5,13 +5,13 @@
     export let method: SDKMethod;
 </script>
 
-<div class="web-card is-transparent u-padding-16">
-    <ul class="u-flex-vertical">
+<div class="web-card is-transparent p-4">
+    <ul class="flex flex-col">
         {#each method.parameters as parameter, i}
             {@const first = i === 0}
-            <li class:u-padding-block-start-16={!first}>
+            <li class:pt-4={!first}>
                 <article>
-                    <header class="u-flex u-cross-baseline u-gap-8">
+                    <header class="flex items-baseline gap-2">
                         <span class="web-code web-u-color-text-primary">
                             {parameter.name}
                         </span>
@@ -20,7 +20,7 @@
                             <div class="web-tag">required</div>
                         {/if}
                     </header>
-                    <p class="web-sub-body-400 u-margin-block-start-16">
+                    <p class="web-sub-body-400 mt-4">
                         <!-- eslint-disable-next-line svelte/no-at-html-tags -->
                         {@html parse(parameter.description)}
                     </p>
diff --git a/src/routes/docs/references/[version]/[platform]/[service]/(components)/Response.svelte b/src/routes/docs/references/[version]/[platform]/[service]/(components)/Response.svelte
index c1150201d..f1a3fa43d 100644
--- a/src/routes/docs/references/[version]/[platform]/[service]/(components)/Response.svelte
+++ b/src/routes/docs/references/[version]/[platform]/[service]/(components)/Response.svelte
@@ -5,20 +5,20 @@
     export let method: SDKMethod;
 </script>
 
-<div class="web-card is-transparent u-padding-16">
+<div class="web-card is-transparent p-4">
     <ul>
         {#each method.responses as response}
             {#if response.models}
                 <li>
                     <article>
-                        <header class="u-flex u-cross-baseline u-gap-8">
+                        <header class="flex items-baseline gap-2">
                             <span class="web-eyebrow web-u-color-text-primary">
                                 {response.code}
                             </span>
                             <span class="web-caption-400">application/json</span>
                         </header>
                         {#if response.models.length > 0}
-                            <ul class="web-sub-body-400 u-margin-block-start-16">
+                            <ul class="web-sub-body-400 mt-4">
                                 {#each response.models as model}
                                     <li>
                                         <a
diff --git a/src/routes/docs/references/[version]/[platform]/[service]/+page.svelte b/src/routes/docs/references/[version]/[platform]/[service]/+page.svelte
index 82083943f..fd1261d57 100644
--- a/src/routes/docs/references/[version]/[platform]/[service]/+page.svelte
+++ b/src/routes/docs/references/[version]/[platform]/[service]/+page.svelte
@@ -162,7 +162,7 @@
                     <!-- eslint-disable-next-line svelte/no-at-html-tags -->
                     {@html parse(data.service?.description)}
                 </div>
-                <div class="web-article-content-grid-6-4-column-2 flex flex-col gap-8 items-end">
+                <div class="web-article-content-grid-6-4-column-2 flex flex-col gap-8 j-end">
                     <Fence
                         language="text"
                         badge="Base URL"
@@ -211,7 +211,7 @@
                         </Accordion>
                     </div>
                     <div class="web-article-content-grid-6-4-column-2 flex flex-col gap-8">
-                        <div class="u-contents theme-dark">
+                        <div class="contentss theme-dark">
                             <div
                                 class="sticky"
                                 style="--inset-block-start:var(--p-grid-huge-navs-secondary-sticky-position);"
@@ -267,11 +267,8 @@
                             </li>
                         {/each}
                     </ul>
-                    <div class="u-sep-block-start web-u-padding-block-20">
-                        <button
-                            class="web-link u-inline-flex u-cross-center u-gap-8"
-                            use:scrollToTop
-                        >
+                    <div class="border-t border-greyscale-900/[0.04] web-u-padding-block-20">
+                        <button class="web-link inline-flex items-center gap-2" use:scrollToTop>
                             <span class="web-icon-arrow-up" aria-hidden="true" />
                             <span class="web-caption-400">Back to top</span>
                         </button>
diff --git a/src/routes/docs/tutorials/+page.svelte b/src/routes/docs/tutorials/+page.svelte
index feef85d45..3abe16d3b 100644
--- a/src/routes/docs/tutorials/+page.svelte
+++ b/src/routes/docs/tutorials/+page.svelte
@@ -59,8 +59,8 @@
 <main class="web-main-section" id="main">
     <article class="web-article">
         <header class="web-article-header">
-            <div class="web-article-header-start u-flex-vertical web-u-cross-start">
-                <div class="u-position-relative u-flex u-cross-center">
+            <div class="web-article-header-start flex flex-col web-u-cross-start">
+                <div class="relative flex items-center">
                     <h1 class="web-title">Tutorials</h1>
                 </div>
             </div>
@@ -68,7 +68,7 @@
         </header>
         <div class="web-article-content web-u-gap-80">
             {#each data.tutorials as category}
-                <section class="u-flex-vertical u-gap-24">
+                <section class="flex flex-col gap-6">
                     <h2 class="web-eyebrow">{category.title}</h2>
                     <ul class="web-grid-row-4 web-grid-row-4-mobile-2">
                         {#each category.tutorials as tutorial}
@@ -80,7 +80,7 @@
                                         aria-disabled="true"
                                         tabindex="-1"
                                     >
-                                        <header class="u-flex u-cross-baseline u-gap-4">
+                                        <header class="flex items-baseline gap-1">
                                             <span
                                                 class="{getIcon(tutorial)} web-u-font-size-24"
                                                 aria-hidden="true"
@@ -93,7 +93,7 @@
                                     </a>
                                 {:else}
                                     <a href={tutorial.href} class="web-card is-normal">
-                                        <header class="u-flex u-cross-baseline u-gap-4">
+                                        <header class="flex items-baseline gap-1">
                                             <span
                                                 class="{getIcon(tutorial)} web-u-font-size-24"
                                                 aria-hidden="true"
@@ -102,7 +102,7 @@
                                                 {tutorial.framework}
                                             </h3>
                                         </header>
-                                        <p class="web-sub-body-400 u-margin-block-start-4">
+                                        <p class="web-sub-body-400 mt-1">
                                             {tutorial.title}
                                         </p>
                                     </a>
diff --git a/src/routes/pricing/+page.svelte b/src/routes/pricing/+page.svelte
index 83e0b20fc..d70b2dca5 100644
--- a/src/routes/pricing/+page.svelte
+++ b/src/routes/pricing/+page.svelte
@@ -254,7 +254,7 @@
         </div>
         <ComparePlans />
 
-        <div class="theme-dark relative overflow-hidden py-10">
+        <div class="theme-dark relative overflow-hidden pt-10">
             <div class="web-big-padding-section-level-2 relative">
                 <div class="container relative" style:z-index="10">
                     <section class="web-grid-4-6">
@@ -265,7 +265,7 @@
                     </section>
                 </div>
             </div>
-            <div class="web-big-padding-section-level-2 relative">
+            <div class="web-big-padding-section-level-2 !mb-0 relative">
                 <div class="container">
                     <PreFooter />
                     <FooterNav />