feat: added web

2026-06-02 17:45:51 +03:00
parent 709df7eddc
commit 0719b11093
39 changed files with 12450 additions and 0 deletions
--- a/assets/css/main.css
+++ b/assets/css/main.css
--- a/assets/css/main.min.css
+++ b/assets/css/main.min.css
--- a/assets/img/expertise-case-dark.jpg
+++ b/assets/img/expertise-case-dark.jpg
--- a/assets/img/expertise-case-laptop.jpg
+++ b/assets/img/expertise-case-laptop.jpg
--- a/assets/img/expertise-case-web.jpg
+++ b/assets/img/expertise-case-web.jpg
--- a/assets/img/icon-aistudio.svg
+++ b/assets/img/icon-aistudio.svg
@@ -0,0 +1,11 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_26_140)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.2283 5.59465H8.43766C7.48134 5.59465 6.56417 5.97446 5.88783 6.65055C5.21149 7.32664 4.83135 8.24367 4.83099 9.19999V24.3493C4.83099 25.3059 5.21098 26.2232 5.88736 26.8996C6.56374 27.576 7.48111 27.956 8.43766 27.956H23.5883C24.5449 27.956 25.4622 27.576 26.1386 26.8996C26.815 26.2232 27.195 25.3059 27.195 24.3493V18.008L29.359 16.524V24.3507C29.3586 25.881 28.7505 27.3486 27.6684 28.4307C26.5863 29.5129 25.1187 30.121 23.5883 30.1213H8.43766C6.90729 30.121 5.43971 29.5129 4.35757 28.4307C3.27544 27.3486 2.66735 25.881 2.66699 24.3507V9.20132C2.66682 8.44339 2.81595 7.69286 3.10588 6.99257C3.3958 6.29229 3.82084 5.65598 4.35671 5.11998C4.89258 4.58398 5.5288 4.1588 6.22901 3.86871C6.92923 3.57863 7.67973 3.42932 8.43766 3.42932H14.4977L13.2283 5.59465Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M23.76 0C23.9534 0 24.1174 0.138667 24.1587 0.328C24.5373 2.0884 25.4171 3.70168 26.692 4.97333C27.9639 6.24892 29.5777 7.12921 31.3387 7.508C31.528 7.54933 31.6667 7.71333 31.6667 7.908C31.6656 8.00172 31.6324 8.09223 31.5727 8.1645C31.5131 8.23678 31.4305 8.28647 31.3387 8.30533C29.5781 8.68436 27.9648 9.56464 26.6934 10.84C25.4011 12.1281 24.5148 13.7668 24.144 15.5533C24.126 15.6422 24.0781 15.7222 24.0082 15.7799C23.9383 15.8377 23.8507 15.8697 23.76 15.8707C23.6694 15.8697 23.5818 15.8377 23.5119 15.7799C23.442 15.7222 23.394 15.6422 23.376 15.5533C23.0052 13.7668 22.1189 12.1281 20.8267 10.84C19.5385 9.54778 17.8999 8.66147 16.1134 8.29067C16.0245 8.27266 15.9445 8.22471 15.8867 8.15481C15.829 8.08492 15.797 7.99733 15.796 7.90667C15.796 7.72 15.9294 7.56 16.1134 7.52267C17.8999 7.15187 19.5385 6.26555 20.8267 4.97333C22.102 3.70181 22.9823 2.08853 23.3614 0.328C23.3803 0.235974 23.4302 0.153212 23.5027 0.0935225C23.5753 0.0338325 23.6661 0.000822857 23.76 0Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_26_140">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
--- a/assets/img/icon-bitrix.svg
+++ b/assets/img/icon-bitrix.svg
@@ -0,0 +1,6 @@
+<svg width="32" height="6" viewBox="0 0 32 6" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.1328 5.80944H22.4841V5.07127H20.2622C20.5649 3.85328 22.4324 3.58754 22.4324 2.22193C22.4324 1.48375 21.9305 0.952271 20.8897 0.952271C20.2253 0.952271 19.6717 1.15158 19.2804 1.3435L19.5167 2.02262C19.8784 1.86022 20.2696 1.69782 20.7494 1.69782C21.1406 1.69782 21.5023 1.86022 21.5023 2.31051C21.5171 3.31442 19.3321 3.38824 19.1328 5.80944ZM29.1867 4.78338C28.168 4.78338 27.3265 3.94186 27.3265 2.92319C27.3265 1.90451 28.168 1.063 29.1867 1.063C30.2054 1.063 31.0469 1.90451 31.0469 2.92319C31.0469 3.94186 30.2054 4.78338 29.1867 4.78338ZM29.1867 1.39517C28.3452 1.39517 27.6661 2.07429 27.6661 2.91581C27.6661 3.75732 28.3452 4.43644 29.1867 4.43644C30.0282 4.43644 30.7073 3.75732 30.7073 2.91581C30.7073 2.08167 30.0282 1.39517 29.1867 1.39517Z" fill="white"/>
+<path d="M30.2426 2.92314H29.3125V1.99304H29.0615V3.17412H30.2426V2.92314Z" fill="white"/>
+<path d="M0 0.287886H1.60921C2.79029 0.287886 3.32915 0.967004 3.32915 1.68303C3.32915 2.17022 3.09294 2.59836 2.6648 2.8272V2.84196C3.30701 3.00436 3.70562 3.52108 3.70562 4.17067C3.70562 5.03433 3.06341 5.80203 1.77161 5.80203H0V0.287886ZM1.49111 2.59836C2.04473 2.59836 2.35477 2.29571 2.35477 1.86019C2.35477 1.44682 2.08902 1.12202 1.49111 1.12202H1.02606V2.59098C1.01868 2.59836 1.49111 2.59836 1.49111 2.59836ZM1.64612 4.98266C2.31048 4.98266 2.68694 4.73168 2.68694 4.17805C2.68694 3.713 2.32524 3.42511 1.77161 3.42511H1.01868V4.98266H1.64612ZM4.45855 0.612682C4.45855 0.273124 4.7243 0 5.07124 0C5.41818 0 5.69868 0.250978 5.69868 0.612682C5.69868 0.937478 5.43294 1.20322 5.07124 1.20322C4.70953 1.20322 4.45855 0.952241 4.45855 0.612682ZM4.56928 1.84543H5.57319V5.80203H4.56928V1.84543ZM6.91666 4.83502V2.62789H6.20064V1.83805H6.91666V0.922714L7.92058 0.634828V1.83805H9.12379L8.87282 2.62789H7.92058V4.58404C7.92058 4.96051 8.04606 5.086 8.31181 5.086C8.54802 5.086 8.76209 4.99742 8.92449 4.88669L9.22714 5.56581C8.93925 5.76512 8.45944 5.86846 8.06083 5.86846C7.3448 5.89799 6.91666 5.49938 6.91666 4.83502ZM9.766 1.84543H10.6075L10.7182 2.29571C11.0799 1.93401 11.3974 1.75685 11.8107 1.75685C11.9879 1.75685 12.202 1.80852 12.3644 1.91925L12.0027 2.76076C11.8255 2.65003 11.6631 2.63527 11.5524 2.63527C11.2866 2.63527 11.0652 2.746 10.7478 3.0265V5.82417H9.74386V1.84543H9.766ZM12.7556 0.612682C12.7556 0.273124 13.0213 0 13.3683 0C13.7152 0 13.981 0.265742 13.981 0.612682C13.981 0.937478 13.7152 1.20322 13.3535 1.20322C12.9918 1.20322 12.7556 0.952241 12.7556 0.612682ZM12.8663 1.84543H13.8702V5.80203H12.8663C12.8663 5.80941 12.8663 1.84543 12.8663 1.84543ZM15.8928 3.81634L14.4608 1.84543H15.5016L16.4317 3.13723L17.3839 1.84543H18.4248L16.9706 3.81634L18.4395 5.80203H17.3987L16.4465 4.47332L15.4794 5.80203H14.4386C14.4386 5.80941 15.8928 3.81634 15.8928 3.81634Z" fill="white"/>
+<path d="M25.6006 3.9271V0.952271H24.9732L22.5889 4.05259V4.64313H24.7443V5.8242H25.608V4.64313H26.324V3.9271H25.6006ZM24.7443 3.22584V3.90496H24.1686C23.9914 3.90496 23.6666 3.91972 23.5559 3.91972L24.7739 2.2736C24.7812 2.42123 24.7443 2.84937 24.7443 3.22584Z" fill="white"/>
+</svg>
--- a/assets/img/icon-cloudflare.svg
+++ b/assets/img/icon-cloudflare.svg
@@ -0,0 +1,11 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_26_129)">
+<path d="M21.9907 23.2C22.1707 22.5067 22.0973 21.8894 21.776 21.416C21.4893 20.9787 20.9867 20.724 20.376 20.724L8.82533 20.5787C8.78807 20.5793 8.75138 20.5694 8.71953 20.5501C8.68767 20.5307 8.66195 20.5027 8.64533 20.4694C8.60933 20.3974 8.60933 20.324 8.60933 20.252C8.64533 20.1427 8.75333 20.0334 8.86133 20.0334L20.52 19.8867C21.92 19.8147 23.3907 18.6867 23.928 17.304L24.6093 15.5574C24.6453 15.484 24.6453 15.4107 24.6453 15.3387C23.8933 11.88 20.88 9.33337 17.256 9.33337C13.9187 9.33337 11.0853 11.5174 10.0813 14.5374C9.74358 14.2751 9.3573 14.0823 8.94472 13.9699C8.53214 13.8576 8.10141 13.8279 7.67733 13.8827C6.064 14.028 4.80667 15.3387 4.628 16.976C4.592 17.4134 4.628 17.8134 4.7 18.176C2.08 18.2507 0 20.4347 0 23.092C0 23.3454 0.036 23.5654 0.036 23.8187C0.036 23.928 0.142667 24.0014 0.250667 24.0014H21.5613C21.668 24.0014 21.812 23.928 21.848 23.7827L21.9907 23.2Z" fill="#F38020"/>
+<path d="M25.6507 15.6666H25.328C25.256 15.6666 25.184 15.7386 25.148 15.812L24.6813 17.412C24.5027 18.1053 24.5747 18.7226 24.8973 19.196C25.184 19.6333 25.6867 19.8866 26.2973 19.8866L28.7707 20.0333C28.8427 20.0333 28.9147 20.0693 28.9507 20.1426C28.9867 20.2146 28.9867 20.288 28.9867 20.36C28.9507 20.4693 28.8427 20.5786 28.736 20.5786L26.1893 20.7253C24.7893 20.7973 23.3187 21.9253 22.78 23.308L22.6013 23.7813C22.5653 23.8546 22.636 23.964 22.744 23.964H31.5333C31.6413 23.964 31.7493 23.8906 31.7493 23.7813C31.892 23.2346 32 22.6533 32 22.0346C31.964 18.5413 29.1293 15.6653 25.6507 15.6653" fill="#FCAD32"/>
+</g>
+<defs>
+<clipPath id="clip0_26_129">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
--- a/assets/img/icon-docker.svg
+++ b/assets/img/icon-docker.svg
@@ -0,0 +1,10 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 17.1H27C26.5 21.9 22.9 24.7 17.5 24.7H13.8C9.3 24.7 6.4 22.4 5 17.1Z" fill="#2396ED"/>
+<path d="M27.5 14.7C28.6 14 29.8 14 31 14.6C30.2 16.1 29 16.8 27.5 16.7V14.7Z" fill="#2396ED"/>
+<rect x="8" y="12" width="3.3" height="3.3" rx=".4" fill="#2396ED"/>
+<rect x="12" y="12" width="3.3" height="3.3" rx=".4" fill="#2396ED"/>
+<rect x="16" y="12" width="3.3" height="3.3" rx=".4" fill="#2396ED"/>
+<rect x="12" y="8" width="3.3" height="3.3" rx=".4" fill="#2396ED"/>
+<rect x="16" y="8" width="3.3" height="3.3" rx=".4" fill="#2396ED"/>
+<rect x="20" y="12" width="3.3" height="3.3" rx=".4" fill="#2396ED"/>
+</svg>
--- a/assets/img/icon-git.svg
+++ b/assets/img/icon-git.svg
@@ -0,0 +1,8 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 4L28 16L16 28L4 16L16 4Z" fill="white"/>
+<path d="M12.6 10.4L21.8 19.6" stroke="#F05033" stroke-width="2.4" stroke-linecap="round"/>
+<path d="M14.2 12.1V20.3" stroke="#F05033" stroke-width="2.4" stroke-linecap="round"/>
+<circle cx="12.3" cy="10.3" r="2.3" fill="#F05033"/>
+<circle cx="14.2" cy="21.3" r="2.3" fill="#F05033"/>
+<circle cx="22" cy="19.8" r="2.3" fill="#F05033"/>
+</svg>
--- a/assets/img/icon-google.svg
+++ b/assets/img/icon-google.svg
@@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M30.6667 16.3267C30.6667 15.12 30.5667 14.24 30.352 13.3267H16.2987V18.7707H24.5467C24.3814 20.1227 23.484 22.16 21.488 23.5293L21.46 23.7107L25.9027 27.084L26.2094 27.1133C29.0387 24.556 30.6667 20.7907 30.6667 16.3267Z" fill="#4285F4"/>
+<path d="M16.3004 30.6667C20.3404 30.6667 23.7324 29.3627 26.211 27.1134L21.4884 23.5294C20.2244 24.3934 18.5284 24.996 16.3004 24.996C14.4223 24.9962 12.5913 24.4084 11.0642 23.3151C9.5372 22.2219 8.39073 20.678 7.78569 18.9L7.60969 18.9147L2.98969 22.4187L2.92969 22.584C5.39102 27.3747 10.447 30.6667 16.3004 30.6667Z" fill="#34A853"/>
+<path d="M7.78634 18.9C7.4584 17.9681 7.2885 16.9879 7.28367 16C7.28367 14.9893 7.46767 14.012 7.76501 13.1L7.75701 12.904L3.07967 9.34399L2.92634 9.41599C1.88073 11.4533 1.3346 13.71 1.33301 16C1.33301 18.3627 1.91434 20.596 2.92901 22.584L7.78634 18.9Z" fill="#FBBC05"/>
+<path d="M16.3004 7.00404C19.111 7.00404 21.0057 8.19337 22.087 9.18804L26.3097 5.14671C23.7164 2.78404 20.3404 1.33337 16.3004 1.33337C10.4457 1.33337 5.39102 4.62537 2.92969 9.41604L7.76969 13.1C8.37993 11.3223 9.52993 9.77931 11.0592 8.68649C12.5885 7.59367 14.4207 7.0055 16.3004 7.00404Z" fill="#EB4335"/>
+</svg>
--- a/assets/img/icon-modx.svg
+++ b/assets/img/icon-modx.svg
@@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.5 5.5L17.2 12.7L12.7 17.1L5.5 5.5Z" fill="#00A3D7"/>
+<path d="M26.5 5.5L19.3 17.2L14.9 12.7L26.5 5.5Z" fill="#00B4A0"/>
+<path d="M26.5 26.5L14.8 19.3L19.3 14.9L26.5 26.5Z" fill="#F15A24"/>
+<path d="M5.5 26.5L12.7 14.8L17.1 19.3L5.5 26.5Z" fill="#F2A900"/>
+</svg>
--- a/assets/img/icon-mysql.svg
+++ b/assets/img/icon-mysql.svg
@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.5 21.5C10.8 17.9 13.6 13.9 13.3 8.8C17.5 10.7 20.9 13 24.5 16.3C21.7 15.8 19.7 16.4 18.2 18.3C16.2 20.9 12.8 22 7.5 21.5Z" stroke="#111111" stroke-width="1.6" stroke-linejoin="round"/>
+<path d="M20.4 12.5C23.1 10.5 25.2 10.1 27.8 11.3C25.5 11.7 24.2 13.2 23.4 15.5" stroke="#111111" stroke-width="1.6" stroke-linecap="round"/>
+<path d="M12.7 8.9C11.4 10.1 10.1 10.4 8.4 10.1" stroke="#111111" stroke-width="1.6" stroke-linecap="round"/>
+</svg>
--- a/assets/img/icon-n8n.svg
+++ b/assets/img/icon-n8n.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M32 11.2C32 12.9667 30.5307 14.4 28.7173 14.4C27.1893 14.4 25.904 13.38 25.5387 12H20.9573C20.1547 12 19.4707 12.5653 19.3387 13.3373L19.204 14.1267C19.0779 14.8564 18.7006 15.5192 18.1373 16C18.6867 16.472 19.076 17.1253 19.204 17.8733L19.3373 18.6627C19.4062 19.0411 19.6068 19.3829 19.9035 19.6277C20.2003 19.8725 20.574 20.0043 20.9587 20H22.2587C22.6227 18.62 23.908 17.6 25.4373 17.6C27.2507 17.6 28.7187 19.0333 28.7187 20.8C28.7187 22.5667 27.248 24 25.4373 24C23.908 24 22.624 22.98 22.2587 21.6H20.9587C19.3533 21.6 17.9853 20.4693 17.7213 18.9267L17.5867 18.1373C17.5178 17.7594 17.3176 17.4179 17.0215 17.1732C16.7253 16.9285 16.3522 16.7963 15.968 16.8H14.6267C14.216 18.112 12.9653 19.0667 11.4853 19.0667C10.0053 19.0667 8.75467 18.112 8.34533 16.8H6.42267C6.012 18.112 4.76133 19.0667 3.28267 19.0667C1.46933 19.0667 0 17.6333 0 15.8667C0 14.1 1.46933 12.6667 3.28267 12.6667C4.86 12.6667 6.17867 13.7533 6.49333 15.2H8.276C8.59067 13.7533 9.90933 12.6667 11.4867 12.6667C13.0653 12.6667 14.3827 13.7533 14.6973 15.2H15.9667C16.768 15.2 17.4533 14.6347 17.584 13.8627L17.72 13.0733C17.984 11.5307 19.3533 10.4 20.9573 10.4H25.5387C25.904 9.02 27.1893 8 28.7173 8C30.5307 8 32 9.43333 32 11.2ZM30.36 11.2C30.36 12.084 29.624 12.8 28.7173 12.8C27.8107 12.8 27.0773 12.084 27.0773 11.2C27.0773 10.316 27.8107 9.6 28.7173 9.6C29.624 9.6 30.3587 10.316 30.3587 11.2H30.36ZM3.28133 17.4667C4.188 17.4667 4.92133 16.7507 4.92133 15.8667C4.92133 14.9827 4.188 14.2667 3.28133 14.2667C2.37467 14.2667 1.64 14.9827 1.64 15.8667C1.64 16.7507 2.37467 17.4667 3.28133 17.4667ZM11.4853 17.4667C12.392 17.4667 13.1267 16.7507 13.1267 15.8667C13.1267 14.9827 12.3933 14.2667 11.4867 14.2667C10.58 14.2667 9.84533 14.9827 9.84533 15.8667C9.84533 16.7507 10.5787 17.4667 11.4853 17.4667ZM25.4347 22.4C26.3413 22.4 27.0747 21.684 27.0747 20.8C27.0747 19.916 26.3413 19.2 25.4347 19.2C24.528 19.2 23.7947 19.916 23.7947 20.8C23.7947 21.684 24.528 22.4 25.4347 22.4Z" fill="white"/>
+</svg>
--- a/assets/img/icon-nuxt.svg
+++ b/assets/img/icon-nuxt.svg
@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.9 6.6L4.2 23.4H23.5L13.9 6.6Z" stroke="#00DC82" stroke-width="2.2" stroke-linejoin="round"/>
+<path d="M20.8 12.6L14.6 23.4H27L20.8 12.6Z" stroke="#35495E" stroke-width="2.2" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon-openai.svg
+++ b/assets/img/icon-openai.svg
@@ -0,0 +1,10 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_26_118)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.2733 11.544V8.53067C12.2733 8.27733 12.3693 8.08667 12.5907 7.96L18.648 4.472C19.4733 3.996 20.456 3.77467 21.4707 3.77467C25.276 3.77467 27.6867 6.724 27.6867 9.86267C27.6867 10.0853 27.6867 10.3387 27.6547 10.592L21.3747 6.91333C21.2041 6.80477 21.0062 6.7471 20.804 6.7471C20.6018 6.7471 20.4039 6.80477 20.2333 6.91333L12.2733 11.544ZM26.4187 23.2773V16.08C26.4187 15.636 26.228 15.32 25.8467 15.0973L17.8867 10.4667L20.4867 8.976C20.5809 8.914 20.6912 8.88097 20.804 8.88097C20.9168 8.88097 21.0271 8.914 21.1213 8.976L27.1787 12.4653C28.924 13.4787 30.0973 15.636 30.0973 17.7293C30.0973 20.14 28.6707 22.36 26.4173 23.28L26.4187 23.2773ZM10.4027 16.9373L7.80267 15.4147C7.58 15.288 7.484 15.0973 7.484 14.844V7.86533C7.484 4.472 10.084 1.90267 13.6053 1.90267C14.9387 1.90267 16.1747 2.34667 17.2213 3.14L10.9733 6.756C10.5933 6.97733 10.4027 7.29467 10.4027 7.73867V16.936V16.9373ZM16 20.1707L12.2733 18.0773V13.6373L16 11.544L19.7267 13.6373V18.0773L16 20.1707ZM18.3947 29.8107C17.0613 29.8107 15.8253 29.368 14.7787 28.5747L21.0267 24.9587C21.4067 24.7373 21.5973 24.42 21.5973 23.976V14.7787L24.2293 16.3013C24.452 16.428 24.5467 16.6187 24.5467 16.872V23.8493C24.5467 27.2427 21.9147 29.8107 18.3947 29.8107ZM10.8787 22.74L4.82 19.2507C3.076 18.236 1.90267 16.08 1.90267 13.9867C1.89856 12.7972 2.24948 11.6336 2.91053 10.6448C3.57157 9.65595 4.51266 8.88688 5.61333 8.436V15.6667C5.61333 16.1107 5.804 16.428 6.184 16.6507L14.1133 21.2493L11.5133 22.74C11.4192 22.8022 11.3088 22.8353 11.196 22.8353C11.0832 22.8353 10.9728 22.8022 10.8787 22.74ZM10.5293 27.94C6.94533 27.94 4.31333 25.2453 4.31333 21.9147C4.31333 21.6613 4.34533 21.408 4.376 21.1547L10.624 24.768C11.0053 24.9907 11.3853 24.9907 11.7653 24.768L19.7253 20.1707V23.184C19.7253 23.4373 19.632 23.628 19.4093 23.7547L13.352 27.2427C12.5267 27.7187 11.544 27.94 10.5293 27.94ZM18.3947 31.7133C20.2221 31.7135 21.9935 31.0824 23.4092 29.9269C24.8249 28.7714 25.798 27.1624 26.164 25.372C29.716 24.452 32 21.12 32 17.728C32 15.508 31.0493 13.352 29.336 11.7973C29.4947 11.1307 29.5893 10.4653 29.5893 9.8C29.5893 5.26533 25.9107 1.87067 21.6613 1.87067C20.8053 1.87067 19.9813 1.99733 19.1547 2.284C17.6747 0.827212 15.6833 0.00742481 13.6067 8.56554e-09C11.7791 -8.4904e-05 10.0075 0.631154 8.59181 1.78692C7.17607 2.94269 6.20304 4.55203 5.83733 6.34267C2.284 7.26267 0 10.5933 0 13.9867C0 16.208 0.950667 18.364 2.664 19.9173C2.50533 20.584 2.41067 21.2507 2.41067 21.916C2.41067 26.4507 6.08933 29.844 10.3387 29.844C11.1947 29.844 12.0187 29.7173 12.8453 29.432C14.3255 30.8894 16.3175 31.7092 18.3947 31.716V31.7133Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_26_118">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
--- a/assets/img/icon-php.svg
+++ b/assets/img/icon-php.svg
@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 16C4 10.8 8.7 7.1 16 7.1C23.3 7.1 28 10.8 28 16C28 21.2 23.3 24.9 16 24.9C8.7 24.9 4 21.2 4 16Z" stroke="white" stroke-width="2"/>
+<path d="M8.2 18.9L9.4 12.7H13.1C14.9 12.7 15.9 13.6 15.6 15.1C15.3 16.7 14.2 17.5 12.3 17.5H10.8L10.5 18.9H8.2ZM11.2 15.8H12.4C12.9 15.8 13.2 15.6 13.3 15.1C13.4 14.7 13.2 14.5 12.7 14.5H11.5L11.2 15.8Z" fill="white"/>
+<path d="M16.4 18.9L17.6 12.7H19.8L19.4 14.6H21.1C22.7 14.6 23.4 15.4 23.1 16.9L22.7 18.9H20.5L20.8 17.2C21 16.5 20.8 16.2 20.1 16.2H19.1L18.6 18.9H16.4Z" fill="white"/>
+</svg>
--- a/assets/img/icon-placeholder.svg
+++ b/assets/img/icon-placeholder.svg
@@ -0,0 +1,6 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="8" y="8" width="48" height="48" rx="8" stroke="#AFAFAF" stroke-width="4"/>
+  <circle cx="22" cy="22" r="5" stroke="#AFAFAF" stroke-width="4"/>
+  <path d="M12 47L27.5 31.5L43 47" stroke="#AFAFAF" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M34 40L43 31L54 42" stroke="#AFAFAF" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon-react.svg
+++ b/assets/img/icon-react.svg
@@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="16" cy="16" r="2.9" fill="#61DAFB"/>
+<ellipse cx="16" cy="16" rx="12.3" ry="4.6" stroke="#61DAFB" stroke-width="1.8"/>
+<ellipse cx="16" cy="16" rx="12.3" ry="4.6" stroke="#61DAFB" stroke-width="1.8" transform="rotate(60 16 16)"/>
+<ellipse cx="16" cy="16" rx="12.3" ry="4.6" stroke="#61DAFB" stroke-width="1.8" transform="rotate(120 16 16)"/>
+</svg>
--- a/assets/img/icon-shopify.svg
+++ b/assets/img/icon-shopify.svg
@@ -0,0 +1,3 @@
+<svg width="28" height="32" viewBox="0 0 28 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M20.5647 4.66309C21.0891 5.18635 21.6834 5.77901 21.6834 5.77901C21.6834 5.77901 24.1302 5.96099 24.2456 5.97099C24.3621 5.98099 24.5024 6.07 24.5243 6.231C24.5461 6.392 28 29.861 28 29.861L19.5247 31.7033L20.5647 4.66309ZM19.2646 3.77413C19.1997 3.78254 19.1433 3.79536 19.1042 3.80701C19.0833 3.81301 18.733 3.92201 18.1529 4.10201C17.5847 2.46001 16.5827 0.951009 14.8204 0.951009C14.7717 0.951009 14.7209 0.953014 14.6712 0.956014C14.1697 0.290014 13.5487 0 13.0124 0C8.90579 0 6.94353 5.16001 6.32858 7.78101C4.73251 8.27801 3.59914 8.631 3.45485 8.677C2.56328 8.958 2.53542 8.98602 2.419 9.82902C2.33044 10.468 0 28.581 0 28.581L18.1599 32L18.1792 31.9958L19.2646 3.77413ZM14.5368 5.04801C14.5368 5.11101 14.5358 5.16901 14.5358 5.22701C13.5358 5.53801 12.4502 5.87601 11.3616 6.21501C11.9726 3.84501 13.1179 2.69999 14.1199 2.26799C14.3717 2.90399 14.5368 3.81701 14.5368 5.04801ZM12.899 1.10702C13.0771 1.10702 13.2552 1.16801 13.4264 1.28601C12.1099 1.90801 10.6999 3.476 10.1038 6.606C9.23316 6.877 8.38239 7.142 7.5953 7.387C8.29283 4.999 9.94961 1.10702 12.899 1.10702ZM13.6065 15.062C13.6065 15.062 12.5437 14.492 11.2412 14.492C9.33068 14.492 9.23416 15.697 9.23416 16C9.23416 17.657 13.5308 18.292 13.5308 22.172C13.5308 25.224 11.6044 27.19 9.00629 27.19C5.88876 27.19 4.29468 25.24 4.29468 25.24L5.12954 22.469C5.12954 22.469 6.7684 23.883 8.15153 23.883C9.05405 23.883 9.42222 23.168 9.42222 22.646C9.42222 20.485 5.89673 20.388 5.89673 16.837C5.89673 13.849 8.03113 10.957 12.3397 10.957C13.9995 10.957 14.8204 11.435 14.8204 11.435L13.6065 15.062ZM15.6125 4.89201C15.6125 4.78301 15.6135 4.676 15.6135 4.559C15.6135 3.539 15.4722 2.717 15.2463 2.066C16.1548 2.18 16.7598 3.21898 17.1489 4.41398C16.6931 4.55598 16.1747 4.71701 15.6125 4.89201Z" fill="white"/>
+</svg>
--- a/assets/img/icon-star.svg
+++ b/assets/img/icon-star.svg
@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.52 1.29397C10.5638 1.20549 10.6314 1.13101 10.7153 1.07893C10.7992 1.02686 10.8959 0.999268 10.9946 0.999268C11.0934 0.999268 11.1901 1.02686 11.274 1.07893C11.3579 1.13101 11.4255 1.20549 11.4693 1.29397L13.7778 5.96993C13.9299 6.2777 14.1544 6.54396 14.432 6.74588C14.7097 6.94779 15.0322 7.07932 15.3718 7.12917L20.5344 7.88468C20.6323 7.89886 20.7242 7.94012 20.7998 8.00381C20.8754 8.06749 20.9316 8.15106 20.9622 8.24506C20.9928 8.33905 20.9964 8.43973 20.9727 8.5357C20.9491 8.63166 20.899 8.71909 20.8283 8.7881L17.0947 12.4237C16.8485 12.6637 16.6642 12.9599 16.5579 13.2868C16.4515 13.6137 16.4262 13.9616 16.4841 14.3005L17.3655 19.4372C17.3828 19.5349 17.3722 19.6356 17.335 19.7277C17.2978 19.8197 17.2355 19.8995 17.1552 19.9578C17.0749 20.0162 16.9797 20.0508 16.8807 20.0577C16.7816 20.0646 16.6826 20.0435 16.595 19.9968L11.98 17.5704C11.6759 17.4107 11.3376 17.3273 10.9942 17.3273C10.6507 17.3273 10.3124 17.4107 10.0083 17.5704L5.39429 19.9968C5.30668 20.0432 5.20781 20.0641 5.10893 20.057C5.01005 20.05 4.91512 20.0154 4.83495 19.9571C4.75478 19.8987 4.69258 19.8191 4.65543 19.7272C4.61828 19.6353 4.60766 19.5348 4.62479 19.4372L5.50522 14.3015C5.56338 13.9625 5.53818 13.6144 5.43181 13.2872C5.32543 12.9601 5.14107 12.6637 4.89462 12.4237L1.16105 8.7891C1.08969 8.72017 1.03912 8.63259 1.0151 8.53633C0.991088 8.44007 0.994591 8.33901 1.02521 8.24464C1.05584 8.15027 1.11234 8.06641 1.18831 8.00259C1.26427 7.93877 1.35662 7.89757 1.45485 7.88368L6.6165 7.12917C6.95653 7.07971 7.27946 6.94835 7.55747 6.74641C7.83548 6.54447 8.06026 6.278 8.21246 5.96993L10.52 1.29397Z" fill="#111111" stroke="#111111" stroke-width="1.9987" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
--- a/assets/img/icon-tilda.svg
+++ b/assets/img/icon-tilda.svg
@@ -0,0 +1,4 @@
+<svg width="25" height="29" viewBox="0 0 25 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.0675 9.22149V28.1001H10.5459V7.89636L14.0675 9.22149Z" fill="white"/>
+<path d="M0 7.46067C0 2.63211 2.63211 0 5.71803 0C8.80395 0 9.23961 0.435659 12.743 2.19645C16.2465 3.95724 17.1359 4.3929 18.8967 4.3929C20.6575 4.3929 21.5288 3.06777 21.5288 0.435658H24.5966C25.0323 5.69988 21.9645 7.89633 18.8786 7.89633C15.7927 7.89633 14.9213 7.46067 11.8536 5.69988C8.7858 3.93909 7.89632 3.50343 6.13553 3.50343C4.37474 3.50343 3.50343 4.82856 3.06777 7.89633L0 7.46067Z" fill="white"/>
+</svg>
--- a/assets/img/icon-vk.svg
+++ b/assets/img/icon-vk.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19.0626 15.75C18.5626 15.562 18.5626 14.844 18.5316 14.344C18.4066 12.563 19.0316 9.84398 18.2816 8.68798C17.7506 7.99998 15.1876 8.06298 13.6256 8.15698C13.1876 8.21998 12.6566 8.31298 12.2816 8.50098C11.9066 8.68898 11.5316 9.00098 11.5316 9.28198C11.5316 9.68798 12.4696 9.62598 12.8126 10.157C13.1876 10.72 13.1876 11.938 13.1876 12.938C13.1876 14.094 12.9996 15.626 12.5316 15.688C11.8126 15.719 11.4066 15 11.0316 14.469C10.2816 13.438 9.53156 12.156 8.96856 10.906C8.68756 10.25 8.53056 9.53098 8.12456 9.24998C7.49956 8.81198 6.37456 8.78098 5.28056 8.81198C4.28056 8.84298 2.84256 8.71798 2.56156 9.31198C2.34256 9.96798 2.81156 10.593 3.06156 11.125C4.34256 13.906 5.71756 16.344 7.40556 18.656C8.96856 20.812 10.4366 22.531 13.3116 23.437C14.1246 23.687 17.6866 24.406 18.4056 23.437C18.6556 23.062 18.5936 22.218 18.7186 21.593C18.8436 20.968 18.9996 20.343 19.5936 20.312C20.0936 20.281 20.3746 20.718 20.6876 21.031C21.0316 21.375 21.3126 21.656 21.5626 21.969C22.1566 22.563 22.7816 23.375 23.5316 23.688C24.5626 24.126 26.1566 24.001 27.6566 23.938C28.8756 23.907 29.7506 23.657 29.8446 22.938C29.9076 22.375 29.2816 21.563 28.9066 21.094C27.9686 19.938 27.5316 19.594 26.4686 18.531C25.9996 18.062 25.4056 17.562 25.4056 17C25.3746 16.656 25.6556 16.344 25.9056 16C26.9996 14.375 28.0936 13.219 29.0936 11.531C29.3746 11.031 30.0316 9.87498 29.7816 9.31198C29.5006 8.68698 27.9376 8.87398 26.9686 8.87398C25.7186 8.87398 24.0936 8.77998 23.7806 9.02998C23.1866 9.43598 22.9366 10.093 22.6556 10.718C22.0306 12.156 21.1866 13.624 20.3116 14.718C19.9986 15.093 19.4056 15.874 19.0616 15.749L19.0626 15.75Z" fill="white"/>
+</svg>
--- a/assets/img/icon-vue.svg
+++ b/assets/img/icon-vue.svg
@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.5 7H10L16 17.4L22 7H28.5L16 28L3.5 7Z" fill="#41B883"/>
+<path d="M10 7H15.1L16 8.7L16.9 7H22L16 17.4L10 7Z" fill="#35495E"/>
+</svg>
--- a/assets/img/icon-woo.svg
+++ b/assets/img/icon-woo.svg
@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.5 8.8C3.5 6.7 5.2 5 7.3 5H24.7C26.8 5 28.5 6.7 28.5 8.8V18.2C28.5 20.3 26.8 22 24.7 22H17.5L12 27V22H7.3C5.2 22 3.5 20.3 3.5 18.2V8.8Z" fill="#96588A"/>
+<path d="M8 11.2L9.9 17.4L12.1 11.2L14.2 17.4L16.2 11.2" stroke="white" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M18.4 14.4C18.4 12.7 19.7 11.3 21.5 11.3C23.3 11.3 24.6 12.7 24.6 14.4C24.6 16.1 23.3 17.5 21.5 17.5C19.7 17.5 18.4 16.1 18.4 14.4Z" stroke="white" stroke-width="1.8"/>
+</svg>
--- a/assets/img/icon-wordpress.svg
+++ b/assets/img/icon-wordpress.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M32 16C32 7.184 24.816 0 16 0C7.168 0 0 7.184 0 16C0 24.832 7.168 32 16 32C24.816 32 32 24.832 32 16ZM12.448 24.592L6.992 9.952C7.872 9.92 8.864 9.824 8.864 9.824C9.664 9.728 9.568 8.016 8.768 8.048C8.768 8.048 6.448 8.224 4.976 8.224C4.688 8.224 4.384 8.224 4.048 8.208C6.592 4.304 10.992 1.776 16 1.776C19.728 1.776 23.12 3.168 25.68 5.52C24.592 5.344 23.04 6.144 23.04 8.048C23.04 9.232 23.76 10.224 24.48 11.408C25.04 12.384 25.36 13.584 25.36 15.344C25.36 17.728 23.12 23.344 23.12 23.344L18.272 9.952C19.136 9.92 19.584 9.68 19.584 9.68C20.384 9.6 20.288 7.68 19.488 7.728C19.488 7.728 17.184 7.92 15.68 7.92C14.288 7.92 11.952 7.728 11.952 7.728C11.152 7.68 11.056 9.648 11.856 9.68L13.328 9.808L15.344 15.264L12.448 24.592ZM27.856 16C28.24 14.976 29.04 13.008 28.544 9.2C29.664 11.264 30.224 13.536 30.224 16C30.224 21.264 27.456 25.984 23.184 28.448C24.736 24.304 26.288 20.128 27.856 16ZM9.76 28.944C4.992 26.64 1.776 21.648 1.776 16C1.776 13.92 2.144 12.032 2.928 10.256C5.2 16.48 7.472 22.72 9.76 28.944ZM16.208 18.336L20.336 29.504C18.96 29.968 17.52 30.224 16 30.224C14.736 30.224 13.488 30.048 12.336 29.696C13.632 25.888 14.928 22.112 16.208 18.336Z" fill="white"/>
+</svg>
--- a/assets/img/icon-yandex.svg
+++ b/assets/img/icon-yandex.svg
@@ -0,0 +1,3 @@
+<svg width="15" height="28" viewBox="0 0 15 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.0533 0H9.0533C5.0533 0 0.983304 3 0.983304 9.62C0.899674 11.1544 1.24213 12.6821 1.97279 14.034C2.70345 15.3859 3.79382 16.5093 5.1233 17.28L0.173304 26.13C0.0598427 26.3224 0 26.5417 0 26.765C0 26.9883 0.0598427 27.2076 0.173304 27.4C0.275941 27.5762 0.421426 27.7235 0.596251 27.8284C0.771075 27.9333 0.969569 27.9923 1.1733 28H3.6633C3.91594 28.0123 4.1663 27.947 4.38079 27.813C4.59529 27.6789 4.76365 27.4825 4.8633 27.25L9.4533 18.25H9.7933V26.87C9.79444 27.024 9.82679 27.1763 9.8884 27.3175C9.95 27.4587 10.0396 27.5859 10.1517 27.6915C10.2639 27.7971 10.3963 27.8789 10.5409 27.9319C10.6856 27.985 10.8395 28.0081 10.9933 28H13.1733C13.4671 28.0109 13.7534 27.9059 13.9704 27.7076C14.1874 27.5093 14.3178 27.2336 14.3333 26.94V1.22C14.3373 1.06371 14.3104 0.908174 14.2543 0.762267C14.1982 0.61636 14.1138 0.482946 14.0061 0.369648C13.8984 0.256351 13.7694 0.16539 13.6265 0.101964C13.4836 0.0385384 13.3296 0.00389034 13.1733 0H13.0533ZM9.8733 14.28H9.2833C6.9833 14.28 5.6233 12.41 5.6233 9.28C5.6233 5.38 7.3533 3.99 8.9633 3.99H9.9033L9.8733 14.28Z" fill="white"/>
+</svg>
--- a/assets/img/logo.svg
+++ b/assets/img/logo.svg
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -0,0 +1,561 @@
+(function ($) {
+    'use strict';
+
+    $(function () {
+        const $expertise = $('.expertise');
+
+        if (!$expertise.length || typeof Swiper !== 'function') {
+            return;
+        }
+
+        const $slider = $expertise.find('.expertise__cases');
+        const $wrapper = $expertise.find('.expertise__track');
+        const $tabs = $expertise.find('.expertise__tab');
+        const sourceSlides = $wrapper.find('.expertise-card').map(function () {
+            const $slide = $(this);
+
+            return {
+                group: $slide.data('expertise-group'),
+                html: this.outerHTML,
+            };
+        }).get();
+
+        let expertiseSwiper = null;
+        let activeFilter = null;
+
+        const getSlidesByFilter = function (filter) {
+            return sourceSlides.filter(function (slide) {
+                return slide.group === filter;
+            });
+        };
+
+        const updateTabs = function (filter) {
+            $tabs.each(function () {
+                const $tab = $(this);
+                const isActive = $tab.data('expertise-filter') === filter;
+
+                $tab
+                    .toggleClass('is-active', isActive)
+                    .attr({
+                        'aria-selected': String(isActive),
+                        'aria-pressed': String(isActive),
+                    });
+            });
+        };
+
+        const destroySlider = function () {
+            if (!expertiseSwiper) {
+                return;
+            }
+
+            expertiseSwiper.destroy(true, true);
+            expertiseSwiper = null;
+        };
+
+        const getLoopSlidesHtml = function (slides) {
+            // Для loop в Swiper важно, чтобы реальных слайдов было заметно больше,
+            // чем помещается в видимой области. Иначе Swiper отключает loop на широких экранах.
+            const minSlidesForLoop = 24;
+            const repeatCount = Math.max(1, Math.ceil(minSlidesForLoop / slides.length));
+            let html = '';
+
+            for (let i = 0; i < repeatCount; i += 1) {
+                slides.forEach(function (slide) {
+                    html += slide.html;
+                });
+            }
+
+            return html;
+        };
+
+        const initSlider = function () {
+            const slidesCount = $wrapper.children('.swiper-slide').length;
+            const loopEnabled = slidesCount > 1;
+
+            expertiseSwiper = new Swiper($slider[0], {
+                slidesPerView: 'auto',
+                spaceBetween: 16,
+                speed: 650,
+                grabCursor: true,
+                allowTouchMove: true,
+                watchOverflow: false,
+                loop: loopEnabled,
+                loopedSlides: Math.min(12, slidesCount),
+                loopAdditionalSlides: Math.min(12, slidesCount),
+                loopPreventsSliding: false,
+                normalizeSlideIndex: true,
+                observer: true,
+                observeParents: true,
+                breakpoints: {
+                    768: {
+                        spaceBetween: 24,
+                    },
+                    1200: {
+                        spaceBetween: 32,
+                    },
+                },
+            });
+        };
+
+        const renderSlides = function (filter) {
+            const slides = getSlidesByFilter(filter);
+
+            if (!slides.length) {
+                return;
+            }
+
+            destroySlider();
+            $wrapper.html(getLoopSlidesHtml(slides));
+            initSlider();
+        };
+
+        const setActiveFilter = function (filter) {
+            if (activeFilter === filter || !getSlidesByFilter(filter).length) {
+                return;
+            }
+
+            activeFilter = filter;
+            updateTabs(filter);
+            renderSlides(filter);
+        };
+
+        const initialFilter = $tabs.filter('.is-active').first().data('expertise-filter')
+            || $tabs.first().data('expertise-filter');
+
+        setActiveFilter(initialFilter);
+
+        $tabs.on('click', function () {
+            setActiveFilter($(this).data('expertise-filter'));
+        });
+    });
+})(jQuery);
+
+
+(function ($) {
+    'use strict';
+
+    $(function () {
+        const $results = $('.results');
+
+        if (!$results.length) {
+            return;
+        }
+
+        $results.addClass('is-animation-ready');
+
+        const showResults = function (target) {
+            $(target).addClass('is-in-view');
+        };
+
+        if (!('IntersectionObserver' in window)) {
+            $results.each(function () {
+                showResults(this);
+            });
+
+            return;
+        }
+
+        const observer = new IntersectionObserver(function (entries, currentObserver) {
+            entries.forEach(function (entry) {
+                if (!entry.isIntersecting) {
+                    return;
+                }
+
+                showResults(entry.target);
+                currentObserver.unobserve(entry.target);
+            });
+        }, {
+            threshold: 0.24,
+            rootMargin: '0px 0px -12% 0px',
+        });
+
+        $results.each(function () {
+            observer.observe(this);
+        });
+    });
+})(jQuery);
+
+(function ($) {
+    'use strict';
+
+    $(function () {
+        const $faq = $('.faq');
+
+        if (!$faq.length) {
+            return;
+        }
+
+        $faq.on('click', '.faq-item__button', function () {
+            const $button = $(this);
+            const $item = $button.closest('.faq-item');
+            const $panel = $item.find('.faq-item__panel').first();
+            const isOpen = $button.attr('aria-expanded') === 'true';
+
+            $button.attr('aria-expanded', String(!isOpen));
+
+            if (isOpen) {
+                $panel.stop(true, true).slideUp(220, function () {
+                    $panel.attr('hidden', true).removeAttr('style');
+                });
+            } else {
+                $panel.removeAttr('hidden').hide().stop(true, true).slideDown(220, function () {
+                    $panel.removeAttr('style');
+                });
+            }
+        });
+    });
+})(jQuery);
+
+
+(function ($) {
+    'use strict';
+
+    $(function () {
+        const $forms = $('.contact-sentence');
+
+        if (!$forms.length) {
+            return;
+        }
+
+        const options = {
+            task: ['лендинг', 'интернет-магазин', 'интеграцию', 'дизайн', 'доработку сайта'],
+            method: ['Telegram', 'WhatsApp', 'звонок', 'email'],
+            time: ['09:00–12:00', '12:00–15:00', '15:00–18:00', 'любое время'],
+        };
+
+        let $dateInput = $('.contact-date-input');
+
+        if (!$dateInput.length) {
+            $dateInput = $('<input class="contact-date-input" type="date" aria-hidden="true">').appendTo('body');
+        }
+
+        const cleanValue = function ($field) {
+            const text = $.trim($field.text()).replace(/\s+/g, ' ');
+            const placeholder = $.trim($field.data('placeholder') || '');
+            const normalized = text.replace(/[()]/g, '').replace(/▾/g, '').trim();
+
+            if ($field.hasClass('is-placeholder') || normalized === placeholder) {
+                return '';
+            }
+
+            return normalized;
+        };
+
+        const getPlaceholderText = function ($field) {
+            const placeholder = $.trim($field.data('placeholder') || '');
+            const withArrow = $field.hasClass('contact-field--selector');
+
+            return '(' + placeholder + (withArrow ? ' ▾' : '') + ')';
+        };
+
+        const setFieldValue = function ($field, value, isPlaceholder) {
+            const text = isPlaceholder ? getPlaceholderText($field) : value;
+
+            $field
+                .text(text)
+                .toggleClass('is-placeholder', !!isPlaceholder)
+                .toggleClass('is-filled', !isPlaceholder && !!value)
+                .removeClass('is-error');
+
+            updateHidden($field.closest('form'));
+        };
+
+        const updateHidden = function ($form) {
+            $form.find('.contact-field').each(function () {
+                const $field = $(this);
+                const name = $field.data('field');
+
+                if (!name) {
+                    return;
+                }
+
+                $form.find('input[name="' + name + '"]').val(cleanValue($field));
+            });
+        };
+
+        const selectAll = function (el) {
+            const range = document.createRange();
+            const selection = window.getSelection();
+
+            range.selectNodeContents(el);
+            selection.removeAllRanges();
+            selection.addRange(range);
+        };
+
+        const setCaretEnd = function (el) {
+            const range = document.createRange();
+            const selection = window.getSelection();
+
+            range.selectNodeContents(el);
+            range.collapse(false);
+            selection.removeAllRanges();
+            selection.addRange(range);
+        };
+
+        const formatPhone = function (value) {
+            const raw = String(value || '').replace(/\s+/g, '');
+            const hasPlus = raw.indexOf('+') === 0;
+            const digits = raw.replace(/\D/g, '').slice(0, 11);
+
+            if (!digits) {
+                return hasPlus ? '+' : '';
+            }
+
+            let formatted = hasPlus || digits.charAt(0) === '7' ? '+' : '';
+
+            formatted += digits.slice(0, 1);
+
+            if (digits.length > 1) {
+                formatted += ' ' + digits.slice(1, 4);
+            }
+
+            if (digits.length > 4) {
+                formatted += ' ' + digits.slice(4, 7);
+            }
+
+            if (digits.length > 7) {
+                formatted += ' ' + digits.slice(7, 9);
+            }
+
+            if (digits.length > 9) {
+                formatted += ' ' + digits.slice(9, 11);
+            }
+
+            return formatted;
+        };
+
+        const openDropdown = function ($field) {
+            const type = $field.data('type');
+            const values = options[type] || [];
+
+            if (!values.length) {
+                return;
+            }
+
+            $('.contact-dropdown').remove();
+
+            const rect = $field[0].getBoundingClientRect();
+            const $dropdown = $('<ul class="contact-dropdown" role="listbox"></ul>');
+
+            values.forEach(function (value) {
+                $('<li role="option"></li>').text(value).appendTo($dropdown);
+            });
+
+            $('body').append($dropdown);
+
+            const left = Math.min(rect.left + window.pageXOffset - 10, window.pageXOffset + window.innerWidth - $dropdown.outerWidth() - 12);
+
+            $dropdown.css({
+                top: rect.bottom + window.pageYOffset + 8,
+                left: Math.max(12, left),
+            });
+
+            $dropdown.on('click', 'li', function () {
+                setFieldValue($field, $(this).text(), false);
+                $dropdown.remove();
+            });
+        };
+
+        const openDatePicker = function ($field) {
+            const rect = $field[0].getBoundingClientRect();
+            const picker = $dateInput[0];
+
+            $dateInput
+                .val('')
+                .css({
+                    left: rect.left + 'px',
+                    top: rect.top + 'px',
+                    width: Math.max(rect.width, 24) + 'px',
+                    height: Math.max(rect.height, 24) + 'px',
+                })
+                .off('change.contact')
+                .one('change.contact', function () {
+                    if (this.value) {
+                        setFieldValue($field, this.value, false);
+                    }
+                });
+
+            requestAnimationFrame(function () {
+                try {
+                    if (typeof picker.showPicker === 'function') {
+                        picker.showPicker();
+                    } else {
+                        picker.focus();
+                        picker.click();
+                    }
+                } catch (error) {
+                    picker.focus();
+                    picker.click();
+                }
+            });
+        };
+
+        const isEmail = function (value) {
+            return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
+        };
+
+        const validateForm = function ($form) {
+            let valid = true;
+            let $firstError = null;
+
+            const markError = function ($field) {
+                valid = false;
+                $field.addClass('is-error');
+
+                if (!$firstError) {
+                    $firstError = $field;
+                }
+            };
+
+            $form.find('.contact-field').removeClass('is-error');
+
+            const required = ['name', 'task', 'phone', 'email', 'method', 'date', 'time'];
+
+            required.forEach(function (name) {
+                const $field = $form.find('.contact-field[data-field="' + name + '"]');
+                const value = cleanValue($field);
+
+                if (!value) {
+                    markError($field);
+                }
+            });
+
+            const $name = $form.find('.contact-field[data-field="name"]');
+            const $phone = $form.find('.contact-field[data-field="phone"]');
+            const $email = $form.find('.contact-field[data-field="email"]');
+            const name = cleanValue($name);
+            const phone = cleanValue($phone);
+            const email = cleanValue($email);
+
+            if (name && name.length < 2) {
+                markError($name);
+            }
+
+            if (phone && phone.replace(/\D/g, '').length < 10) {
+                markError($phone);
+            }
+
+            if (email && !isEmail(email)) {
+                markError($email);
+            }
+
+            if (!valid && $firstError) {
+                $form.find('.contact-sentence__status')
+                    .removeClass('is-success')
+                    .text('Заполните подсвеченные поля.');
+                $('html, body').animate({ scrollTop: $firstError.offset().top - 120 }, 260);
+            }
+
+            return valid;
+        };
+
+        $forms.each(function () {
+            updateHidden($(this));
+        });
+
+        $(document).on('click keydown', '.contact-field--editable', function (event) {
+            const $field = $(this);
+
+            if ($field.attr('contenteditable')) {
+                return;
+            }
+
+            if (event.type === 'keydown' && event.key !== 'Enter' && event.key !== ' ') {
+                return;
+            }
+
+            event.preventDefault();
+
+            const value = cleanValue($field);
+
+            $field.attr('contenteditable', 'true');
+            $field.text(value);
+            $field.removeClass('is-placeholder is-error');
+            $field.focus();
+            selectAll($field[0]);
+        });
+
+        $(document).on('input', '.contact-field--editable', function () {
+            const $field = $(this);
+
+            if ($field.data('type') === 'phone') {
+                $field.text(formatPhone($field.text()));
+                setCaretEnd(this);
+            }
+
+            updateHidden($field.closest('form'));
+        });
+
+        $(document).on('paste', '.contact-field--editable[data-type="phone"]', function (event) {
+            event.preventDefault();
+
+            const clipboard = event.originalEvent.clipboardData || window.clipboardData;
+            const text = clipboard ? clipboard.getData('text') : '';
+
+            $(this).text(formatPhone(text));
+            setCaretEnd(this);
+            updateHidden($(this).closest('form'));
+        });
+
+        $(document).on('blur keydown', '.contact-field--editable[contenteditable="true"]', function (event) {
+            if (event.type === 'keydown' && event.key !== 'Enter') {
+                return;
+            }
+
+            event.preventDefault();
+
+            const $field = $(this);
+            const value = $.trim($field.text()).replace(/\s+/g, ' ');
+
+            $field.removeAttr('contenteditable');
+
+            if (!value) {
+                setFieldValue($field, '', true);
+            } else {
+                setFieldValue($field, value, false);
+            }
+        });
+
+        $(document).on('click keydown', '.contact-field--selector', function (event) {
+            if (event.type === 'keydown' && event.key !== 'Enter' && event.key !== ' ') {
+                return;
+            }
+
+            event.preventDefault();
+            event.stopPropagation();
+
+            const $field = $(this);
+
+            if ($field.data('type') === 'date') {
+                openDatePicker($field);
+            } else {
+                openDropdown($field);
+            }
+        });
+
+        $(document).on('click', function () {
+            $('.contact-dropdown').remove();
+        });
+
+        $forms.on('submit', function (event) {
+            event.preventDefault();
+
+            const $form = $(this);
+            const $status = $form.find('.contact-sentence__status');
+
+            updateHidden($form);
+
+            if (!validateForm($form)) {
+                return;
+            }
+
+            const payload = Object.fromEntries(new FormData($form[0]).entries());
+
+            console.log('Contact form payload:', payload);
+
+            $status
+                .addClass('is-success')
+                .text('Заявка подготовлена. Подключите обработчик отправки формы.');
+        });
+    });
+})(jQuery);
--- a/assets/scss/_base.scss
+++ b/assets/scss/_base.scss
@@ -0,0 +1,150 @@
+@use "vars" as *;
+@use "mixins" as *;
+
+*,
+*::before,
+*::after {
+    box-sizing: border-box;
+}
+
+html {
+    scroll-behavior: smooth;
+}
+
+body {
+    min-width: 320px;
+    margin: 0;
+    font-family: $font-main;
+    font-size: 16px;
+    font-weight: 400;
+    line-height: 1.4;
+    color: $color-black;
+    background: $color-white;
+    text-rendering: geometricPrecision;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+    color: inherit;
+    text-decoration: none;
+}
+
+button,
+a {
+    -webkit-tap-highlight-color: transparent;
+}
+
+img,
+svg {
+    display: block;
+    max-width: 100%;
+}
+
+.container {
+    width: min($container-width, calc(100% - 32px));
+    margin-inline: auto;
+}
+
+.btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 46px;
+    padding: 0 26px;
+    border: 1px solid transparent;
+    border-radius: $radius-pill;
+    font-size: 14px;
+    font-weight: 600;
+    line-height: 1;
+    white-space: nowrap;
+    transition: transform $transition-fast, border-color $transition-fast, background-color $transition-fast, color $transition-fast;
+
+    @include hover-supported {
+        transform: translateY(-2px);
+    }
+
+    &--dark {
+        min-width: 172px;
+        gap: 12px;
+        color: $color-white;
+        background: $color-black;
+        box-shadow: 0 18px 38px rgba($color-black, 0.12);
+    }
+
+    &--light {
+        min-width: 150px;
+        color: $color-btn-light-text;
+        background: rgba($color-white, 0.78);
+        border-color: rgba($color-black, 0.14);
+    }
+}
+
+.site-header {
+    position: fixed;
+    top: 14px;
+    left: 50%;
+    z-index: 20;
+    width: min(505px, calc(100% - 32px));
+    transform: translateX(-50%);
+
+    &__inner {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        min-height: 50px;
+        padding: 0 20px;
+        border: 1px solid rgba($color-black, 0.06);
+        border-radius: $radius-pill;
+        background: rgba(248, 248, 248, 0.86);
+        backdrop-filter: blur(16px);
+    }
+
+    &__logo {
+        flex: 0 0 auto;
+
+        img {
+            width: 100px;
+            height: auto;
+        }
+    }
+
+    &__nav {
+        display: flex;
+        align-items: center;
+        gap: 22px;
+        color: $color-header-text;
+        font-size: 12px;
+        font-weight: 400;
+        line-height: 1;
+
+        a {
+            transition: color $transition-fast;
+
+            @include hover-supported {
+                color: $color-black;
+            }
+        }
+    }
+}
+
+@include media-down($bp-mobile) {
+    .site-header {
+        top: 10px;
+        width: calc(100% - 20px);
+
+        &__inner {
+            min-height: 46px;
+            padding: 0 16px;
+        }
+
+        &__logo img {
+            width: 92px;
+        }
+
+        &__nav {
+            gap: 12px;
+            font-size: 11px;
+        }
+    }
+}
--- a/assets/scss/_fonts.scss
+++ b/assets/scss/_fonts.scss
@@ -0,0 +1 @@
+/* Nunito Sans is connected in index.html via Google Fonts. */
--- a/assets/scss/_mixins.scss
+++ b/assets/scss/_mixins.scss
@@ -0,0 +1,13 @@
+@mixin hover-supported {
+	@media (hover: hover) and (pointer: fine) {
+		&:hover {
+			@content;
+		}
+	}
+}
+
+@mixin media-down($width) {
+	@media (max-width: $width) {
+		@content;
+	}
+}
--- a/assets/scss/_reset.scss
+++ b/assets/scss/_reset.scss
@@ -0,0 +1,134 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    font: inherit;
+    vertical-align: baseline;
+}
+
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+    display: block;
+}
+
+body {
+    line-height: 1;
+}
+
+ol,
+ul {
+    list-style: none;
+}
+
+blockquote,
+q {
+    quotes: none;
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+    content: '';
+    content: none;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
--- a/assets/scss/_vars.scss
+++ b/assets/scss/_vars.scss
@@ -0,0 +1,29 @@
+$font-main: "Nunito Sans", "Segoe UI", Arial, sans-serif;
+
+$color-black: #111111;
+$color-dark: #333333;
+$color-gray: #C2C2C2;
+$color-light-gray: #c9c9cc;
+$color-border: rgba(15, 15, 16, 0.12);
+$color-white: #ffffff;
+$color-accent: #C7FF4F;
+$color-red: #ff1d25;
+$color-page-start: #fbfff4;
+$color-muted-text: #888888;
+$color-muted-text-soft: #828286;
+$color-header-text: #6f6f73;
+$color-badge-text: #3b3b3e;
+$color-btn-light-text: #202023;
+$color-launch-bg: #0b0b0c;
+$color-section-gray: #f2f2f2;
+
+$container-width: 1200px;
+$radius-pill: 999px;
+$radius-card: 11px;
+
+$bp-desktop-md: 1120px;
+$bp-tablet: 760px;
+$bp-mobile: 520px;
+$bp-mobile-sm: 420px;
+
+$transition-fast: 0.2s ease;
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
--- a/index.html
+++ b/index.html
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,26 @@
+{
+    "name": "adconversion",
+    "version": "1.0.0",
+    "description": "",
+    "main": "index.js",
+    "scripts": {
+        "scss:build": "sass assets/scss/main.scss assets/css/main.css --no-source-map",
+        "css:minify": "postcss assets/css/main.css -o assets/css/main.min.css",
+        "css:build": "npm-run-all scss:build css:minify",
+        "scss:watch": "sass --watch assets/scss:assets/css --no-source-map",
+        "css:watch": "postcss assets/css/main.css -o assets/css/main.min.css --watch",
+        "dev": "npm-run-all --parallel scss:watch css:watch"
+    },
+    "keywords": [],
+    "author": "",
+    "license": "ISC",
+    "type": "commonjs",
+    "devDependencies": {
+        "autoprefixer": "^10.4.27",
+        "cssnano": "^7.1.2",
+        "npm-run-all": "^4.1.5",
+        "postcss": "^8.5.6",
+        "postcss-cli": "^11.0.1",
+        "sass": "^1.97.3"
+    }
+}
--- a/postcss.config.cjs
+++ b/postcss.config.cjs
@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: [
+    require('autoprefixer'),
+    require('cssnano')({ preset: 'default' })
+  ]
+};
				`@@ -0,0 +1 @@`
				`/* Nunito Sans is connected in index.html via Google Fonts. */`