Fix vars and logo paddings

src/frontend/styles/components/sidebar.pcss

@@ -1,16 +1,14 @@
 .docs-sidebar {
-  --sidebar-width: 100vw;
-
-  width: var(--sidebar-width);
+  width: 100vw;
     
   @media (--desktop) {
-    --sidebar-width: 344px;
+    width: var(--layout-sidebar-width);
   }
 
   &__content {
     border-bottom: 1px solid var(--color-line-gray);
     box-sizing: border-box;
-    padding: var(--layout-padding-vertical) 22px;
+    padding: var(--layout-padding-vertical) var(--layout-padding-horizontal);
     position: sticky;
     top: var(--layout-height-header);
     display: flex;
@@ -192,7 +190,7 @@
     background: white;
     z-index: 2;
     padding-bottom: 20px;
-    padding-top: 10px;
+    padding-top: 60px;
     font-size: 14px;
 
     @media (--desktop) {
@@ -203,10 +201,15 @@
       display: inline-flex;
     }
 
+    &-caption {
+      margin: 0;
+    }
+
     &-wrapper {
       display: flex;
       align-items: center;
       gap: 18px;
+      padding: 8px;
     }
   }
 

src/frontend/styles/vars.pcss

@@ -23,9 +23,9 @@
   /**
    * Site layout sizes
    */
-  --layout-padding-horizontal: 16px;
+  --layout-padding-horizontal: 22px;
   --layout-padding-vertical: 30px;
-  --layout-width-aside: 300px;
+  --layout-sidebar-width: 344px;
   --layout-width-main-col: 650px;
   --layout-height-header: 56px;