fix: correct header alignment on mobile

styles.css

@@ -133,14 +133,13 @@ textarea {
     position: relative;
     display: flex;
     align-items: center;
-    justify-content: flex-start;
+    justify-content: space-between;
     gap: 14px;
     min-height: 74px;
 }
 
 .menu-toggle {
-    order: 3;
-    margin-right: auto;
+    flex: 0 0 auto;
     width: 52px;
     height: 52px;
     display: inline-flex;
@@ -183,14 +182,15 @@ textarea {
 }
 
 .brand {
-    order: 1;
     display: inline-flex;
     align-items: center;
     gap: 12px;
     color: var(--text-main);
+    margin-inline-start: auto;
 }
 
 .brand-logo {
+    order: 2;
     width: 52px;
     height: 52px;
     border-radius: 16px;
@@ -198,10 +198,12 @@ textarea {
 }
 
 .brand-copy {
+    order: 1;
     display: flex;
     flex-direction: column;
     line-height: 1.1;
-    align-items: flex-start;
+    align-items: flex-end;
+    text-align: right;
 }
 
 .brand-name {