htmlacademy-adaptive · keksobot · Dec 23, 2024 · Dec 19, 2024 · Dec 19, 2024
diff --git a/source/catalog.html b/source/catalog.html
diff --git a/source/form.html b/source/form.html
@@ -3,31 +3,32 @@
 <head>
   <meta charset="utf-8">
   <title>HTML Academy: Кэт энерджи</title>
+  <link rel="stylesheet" href="css/style.css">
 </head>
 <body class="page__body">
 <header class="main-header">
   <a class="main-header__logo logo">
-    <img src="img/logo-mobile.svg" width="33" height="38"
-         alt="Функциональное питание для котов «Cat Energy».">
+    <img src="img/logo-mobile.svg" width="33" height="38" alt="Функциональное питание для котов «Cat Energy».">
+    <img src="img/logo-mobile-name.svg" width="101" height="18" alt="Функциональное питание для котов «Cat Energy».">
   </a>
   <nav class="main-nav">
     <button class="main-nav__toggle" type="button">
       <span class="visually-hidden">Открыть меню</span>
     </button>
     <div class="main-nav__wrapper">
-      <ul class="main-nav__list">
-        <li class="site-list__item">
-          <a>
+      <ul class="main-nav__list list">
+        <li class="main-nav__item">
+          <a class="main-nav__item-link" href="index.html">
             Главная
           </a>
         </li>
-        <li class="site-list__item site-list__item--active">
-          <a href="catalog.html">
+        <li class="main-nav__item main-nav__item--active">
+          <a class="main-nav__item-link" href="catalog.html">
             Каталог продукции
           </a>
         </li>
-        <li class="site-list__item">
-          <a href="form.html">
+        <li class="main-nav__item">
+          <a class="main-nav__item-link">
             Подбор программы
           </a>
         </li>
@@ -37,11 +38,11 @@
 </header>
 <main class="main-container">
   <section class="selection">
-    <header class="selection__header">
+    <header class="selection__header container">
       <h1 class="selection__title title">Подбор программы</h1>
       <p class="selection__subtitle">Заполните анкету, и мы подберем программу питания для вашего кота</p>
     </header>
-    <form class="selection__form" action="https://echo.htmlacademy.ru/" method="post">
+    <form class="selection__form container" action="https://echo.htmlacademy.ru/" method="post">
       <div class="selection__form-wrapper">
         <fieldset class="selection__data">
           <legend class="visually-hidden">Данные кота</legend>
@@ -60,7 +61,7 @@ <h1 class="selection__title title">Подбор программы</h1>
         </fieldset>
         <fieldset class="selection__data">
           <legend class="visually-hidden">Выбор программы</legend>
-          <ul class="selection__program-list">
+          <ul class="selection__program-list list">
             <li class="selection__program-item">
               <label class="selection__control">
                 <input class="visually-hidden" type="radio" name="type-of-housing" value="weight-loss" checked>
@@ -100,11 +101,9 @@ <h1 class="selection__title title">Подбор программы</h1>
       </fieldset>
       <fieldset class="selection__data">
         <legend class="selection__legend">Комментарий</legend>
-        <div class="selection__textaria">
-          <label class="visually-hidden" for="comment">Комментарий:</label>
-          <textarea class="selection__items-textarea" name="textarea" id="comment" cols="30" rows="10"
-                    placeholder="Расскажите обо всех повадках кота"></textarea>
-        </div>
+        <label class="visually-hidden" for="comment">Комментарий:</label>
+        <textarea class="selection__textarea" name="textarea" id="comment" cols="30" rows="10"
+                  placeholder="Расскажите обо всех повадках кота"></textarea>
       </fieldset>
       <fieldset class="selection__data">
         <legend class="selection__legend">Дополнительно</legend>
@@ -137,32 +136,56 @@ <h1 class="selection__title title">Подбор программы</h1>
   </section>
 </main>
 <footer class="main-footer">
-  <div class="main-footer__wrapper">
-    <div class="main-footer__contacts contacts">
-      <b class="contacts__title">Приглашаем к сотрудничеству дилеров!</b>
+  <div class="main-footer__contacts contacts">
+    <div class="contacts__text-wrapper container">
+      <p class="contacts__title">Приглашаем к сотрудничеству дилеров!</p>
       <p class="contacts__text">ул. Большая Конюшенная, д. 19/8 Санкт-Петербург</p>
-      <div class="contacts__map"></div>
-    </div>
-    <a class="main-footer__logo logo" href="#">
-      <img src="img/logo-mobile.svg" width="33" height="38"
-           alt="Функциональное питание для котов «Cat Energy».">
-    </a>
-    <div class="main-footer__social social">
-      <ul class="social__list">
-        <li class="social__item">
-          <a class="social__link social__link--vkontakte" href="https://vk.com/htmlacademy">Мы в Вконтакте</a>
-        </li>
-        <li class="social__item">
-          <a class="social__link social__link--youtube" href="https://www.youtube.com/user/htmlacademyru">Мы в Ютубе</a>
-        </li>
-        <li class="social__item">
-          <a class="social__link social__link--telegram" href="https://t.me/htmlacademy">Мы в Телеграме</a>
-        </li>
-      </ul>
-    </div>
-    <div class="main-footer__copyright copyright">
-      <a class="copyright__link" href="https://htmlacademy.ru/intensive/adaptive">HTML Academy</a>
     </div>
+    <div class="contacts__map"></div>
+  </div>
+  <a class="main-footer__logo logo" href="#">
+    <img src="img/logo-mobile-name.svg" width="128" height="24" alt="Функциональное питание для котов «Cat Energy».">
+  </a>
+  <div class="main-footer__social social">
+    <ul class="social__list list">
+      <li class="social__item">
+        <a class="social__link" href="https://vk.com/htmlacademy">
+          <span class="visually-hidden">Мы в Вконтакте</span>
+          <svg class="social__icon" width="28" height="22" viewBox="0 0 28 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M1 5.33876C1 4.48373 1.5151 4.02268 2.54531 3.95562L6.51515 3.98077C6.78158 3.98077 6.95921 4.10651 7.04802 4.35799C7.45655 5.61538 7.91392 6.70094 8.42014 7.61465C8.92637 8.52835 9.58801 9.58038 10.4051 10.7707C10.4761 10.9216 10.5916 10.997 10.7514 10.997C10.8758 10.997 10.9735 10.9384 11.0445 10.821L11.1244 10.5444L11.1511 6.19379C11.1511 5.89201 11.0756 5.69083 10.9246 5.59024C10.7736 5.48965 10.4939 5.4142 10.0853 5.36391C9.76563 5.31361 9.60577 5.12919 9.60577 4.81065C9.60577 4.74359 9.61465 4.69329 9.63241 4.65976C10.0054 3.57002 11.0711 3.02515 12.8296 3.02515L14.3216 3C14.9966 3 15.5561 3.15927 16.0001 3.47781C16.4442 3.79635 16.6662 4.29931 16.6662 4.98669V10.6953C16.7906 10.7791 16.906 10.821 17.0126 10.821C17.279 10.821 17.5099 10.6701 17.7053 10.3683C19.6592 7.78649 20.716 6.05966 20.8759 5.18787C20.8759 5.1711 20.8936 5.12919 20.9291 5.06213C21.0535 4.81065 21.2577 4.5927 21.5419 4.40828C21.8261 4.22387 22.0748 4.09813 22.288 4.03107C22.359 3.99753 22.4389 3.98077 22.5277 3.98077H26.6574L26.9239 4.00592C27.2791 4.00592 27.5544 4.16519 27.7498 4.48373C27.8209 4.58432 27.8697 4.69329 27.8964 4.81065C27.923 4.92801 27.9408 5.04536 27.9496 5.16272C27.9585 5.28008 27.963 5.34714 27.963 5.36391V5.53994C27.8386 6.22732 27.5233 6.9608 27.0171 7.74038C26.5109 8.51997 25.867 9.36243 25.0855 10.2678C24.304 11.1731 23.8155 11.7682 23.6201 12.0533C23.4603 12.2544 23.3803 12.4389 23.3803 12.6065C23.3803 12.7406 23.4514 12.8915 23.5935 13.0592L27.4834 17.6864C27.6965 17.9546 27.8031 18.248 27.8031 18.5666C27.8031 18.9522 27.6432 19.2707 27.3235 19.5222C27.0038 19.7737 26.6219 19.9162 26.1779 19.9497L25.7249 19.9749H21.6752C21.6574 19.9749 21.6219 19.979 21.5686 19.9874C21.5153 19.9958 21.4798 20 21.462 20C21.0712 20 20.7071 19.8407 20.3696 19.5222C20.2453 19.3881 19.4105 18.3989 17.8652 16.5547C17.7764 16.4374 17.652 16.3284 17.4922 16.2278C17.4211 16.4961 17.3279 16.8817 17.2124 17.3846C17.097 17.8876 17.0126 18.248 16.9593 18.466L16.8794 18.8935C16.7018 19.4803 16.3287 19.8323 15.7604 19.9497L15.3874 19.9749H12.7763C11.3021 19.9749 9.83224 19.3378 8.36686 18.0636C6.90148 16.7894 5.58264 15.1423 4.41034 13.122C3.23803 11.1018 2.14566 8.75049 1.13322 6.06805C1.04441 5.8501 1 5.607 1 5.33876ZM17.0126 11.8521C16.6396 11.8521 16.3021 11.7557 16.0001 11.5629C15.6982 11.3701 15.5472 11.106 15.5472 10.7707V4.98669C15.5472 4.65138 15.4584 4.41248 15.2808 4.26997C15.1032 4.12747 14.7923 4.05621 14.3483 4.05621L12.8296 4.10651C12.0658 4.10651 11.4886 4.23225 11.0978 4.48373C11.8793 4.8358 12.2701 5.40582 12.2701 6.19379V10.6198C12.2346 11.039 12.0569 11.3868 11.7372 11.6635C11.4175 11.9401 11.0623 12.0784 10.6715 12.0784C10.1386 12.0784 9.7301 11.8353 9.44591 11.3491C8.06046 9.37081 7.03025 7.4931 6.35529 5.71598L6.1155 5.06213L2.57195 5.03698C2.34104 5.03698 2.21227 5.04956 2.18562 5.0747C2.15898 5.09985 2.14566 5.1711 2.14566 5.28846C2.14566 5.43935 2.16342 5.59862 2.19895 5.76627L2.75845 7.17456C4.25048 10.8126 5.87127 13.6795 7.62085 15.7751C9.37042 17.8708 11.0889 18.9186 12.7763 18.9186H15.4406C15.5472 18.9186 15.6271 18.8893 15.6804 18.8306C15.7337 18.7719 15.7781 18.6588 15.8136 18.4911L15.8669 18.2396L16.3732 16.0266C16.5152 15.7249 16.6396 15.5237 16.7462 15.4231C16.9415 15.2387 17.1725 15.1465 17.4389 15.1465C17.8652 15.1465 18.3003 15.3895 18.7444 15.8757L21.0091 18.5917C21.1512 18.8097 21.3022 18.9186 21.462 18.9186H25.8581C26.391 18.9186 26.6574 18.7929 26.6574 18.5414C26.6574 18.4576 26.6308 18.3738 26.5775 18.2899L22.7142 13.7382C22.4123 13.3861 22.2613 13.0089 22.2613 12.6065C22.2613 12.2041 22.4034 11.8185 22.6876 11.4497C22.9185 11.1144 23.367 10.557 24.0331 9.77737C24.6992 8.99778 25.2809 8.26849 25.7782 7.5895C26.2756 6.9105 26.6042 6.29438 26.764 5.74112L26.8439 5.4142C26.8262 5.38067 26.8173 5.32618 26.8173 5.25074C26.8173 5.1753 26.8084 5.11243 26.7907 5.06213H22.6077C22.3412 5.16272 22.1281 5.31361 21.9682 5.51479L21.8084 5.9926C21.3643 7.14941 20.2009 8.93491 18.3181 11.3491C17.9451 11.6844 17.5099 11.8521 17.0126 11.8521Z" fill="#666666"/>
+          </svg>
+        </a>
+      </li>
+      <li class="social__item">
+        <a class="social__link" href="https://www.youtube.com/user/htmlacademyru">
+          <span class="visually-hidden">Мы в Ютубе</span>
+          <svg class="social__icon" width="28" height="22" viewBox="0 0 28 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M17.8509 10.7927L12.6145 7.30184C12.5159 7.23691 12.4016 7.19985 12.2837 7.19459C12.1657 7.18934 12.0486 7.21608 11.9446 7.27198C11.8406 7.32789 11.7537 7.41087 11.693 7.51215C11.6324 7.61343 11.6002 7.72924 11.6 7.84729V14.8291C11.6001 14.9481 11.6327 15.0648 11.6942 15.1667C11.7557 15.2686 11.8438 15.3518 11.9491 15.4073C12.0524 15.4631 12.1691 15.4895 12.2864 15.4837C12.4037 15.478 12.5172 15.4402 12.6145 15.3746L17.8509 11.8837C17.9409 11.8239 18.0148 11.7429 18.0658 11.6477C18.1169 11.5526 18.1436 11.4462 18.1436 11.3382C18.1436 11.2302 18.1169 11.1239 18.0658 11.0287C18.0148 10.9335 17.9409 10.8525 17.8509 10.7927ZM12.9091 13.6073V9.06911L16.3127 11.3382L12.9091 13.6073ZM25.3891 5.04366C25.2942 4.67547 25.1131 4.33511 24.8609 4.05061C24.6086 3.76611 24.2924 3.54561 23.9382 3.40729C20.2182 1.9782 14.2509 2.00002 14 2.00002C13.7491 2.00002 7.78182 1.9782 4.06182 3.40729C3.70764 3.54561 3.3914 3.76611 3.13914 4.05061C2.88689 4.33511 2.70584 4.67547 2.61091 5.04366C2.32727 6.11275 2 8.07638 2 11.3382C2 14.6 2.32727 16.5637 2.61091 17.6327C2.70584 18.0009 2.88689 18.3413 3.13914 18.6258C3.3914 18.9103 3.70764 19.1308 4.06182 19.2691C7.78182 20.6982 13.7491 20.6764 14 20.6764H14.0764C14.8291 20.6764 20.3927 20.6327 23.9382 19.2691C24.2924 19.1308 24.6086 18.9103 24.8609 18.6258C25.1131 18.3413 25.2942 18.0009 25.3891 17.6327C25.6727 16.5637 26 14.6 26 11.3382C26 8.07638 25.6727 6.11275 25.3891 5.04366ZM24.1236 17.3055C24.0807 17.472 23.999 17.6259 23.8853 17.7548C23.7715 17.8838 23.6289 17.984 23.4691 18.0473C19.9782 19.3891 14.0655 19.3673 14 19.3673C13.9345 19.3673 8.02182 19.3891 4.53091 18.0473C4.37107 17.984 4.22846 17.8838 4.11471 17.7548C4.00096 17.6259 3.91929 17.472 3.87636 17.3055C3.61455 16.3018 3.30909 14.4582 3.30909 11.3382C3.30909 8.2182 3.61455 6.37457 3.87636 5.37093C3.91929 5.20445 4.00096 5.05047 4.11471 4.92156C4.22846 4.79264 4.37107 4.69243 4.53091 4.62911C8.02182 3.28729 13.9345 3.30911 14 3.30911C14.0655 3.30911 19.9782 3.28729 23.4691 4.62911C23.6289 4.69243 23.7715 4.79264 23.8853 4.92156C23.999 5.05047 24.0807 5.20445 24.1236 5.37093C24.3855 6.37457 24.6909 8.2182 24.6909 11.3382C24.6909 14.4582 24.3855 16.3018 24.1236 17.3055Z" fill="#666666"/>
+          </svg>
+        </a>
+      </li>
+      <li class="social__item">
+        <a class="social__link" href="https://t.me/htmlacademy">
+          <span class="visually-hidden">Мы в Телеграме</span>
+          <svg class="social__icon" width="28" height="22" viewBox="0 0 28 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path fill-rule="evenodd" clip-rule="evenodd" d="M23.4608 3.15291C23.6393 3.30222 23.7255 3.5349 23.6872 3.76448L21.0611 19.5214C21.0244 19.7411 20.8789 19.9273 20.6745 20.0159C20.47 20.1045 20.2346 20.0833 20.0493 19.9597L12.1708 14.7074C12.0177 14.6054 11.9145 14.4437 11.8862 14.2619C11.858 14.08 11.9074 13.8947 12.0223 13.751L14.633 10.4877L10.273 13.3944C10.077 13.525 9.82597 13.5407 9.61524 13.4353L4.36293 10.8092C4.12769 10.6915 3.98535 10.4449 4.0012 10.1824C4.01705 9.91983 4.18804 9.6921 4.43573 9.60364L22.8188 3.03826C23.038 2.95998 23.2822 3.00359 23.4608 3.15291ZM6.32626 10.3228L9.86168 12.0905L17.4231 7.0495C17.6925 6.86994 18.0525 6.91349 18.2712 7.1521C18.49 7.3907 18.5022 7.75314 18.3 8.00591L13.495 14.0121L19.9328 18.3039L22.2083 4.65058L6.32626 10.3228Z" fill="#666666"/>
+          </svg>
+        </a>
+      </li>
+    </ul>
+  </div>
+  <div class="main-footer__copyright copyright">
+    <a class="copyright__link link" href="https://htmlacademy.ru/intensive/adaptive">HTML Academy</a>
+    <svg class="copyright__icon" width="27" height="34" viewBox="0 0 27 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <g clip-path="url(#clip0_135765_344)">
+        <path d="M13.6426 0.0157537L13.5 0L0 1.40733V26.0129L13.5 34L27 26.0129V1.40733L13.6426 0.0157537ZM25.2344 25.0151L13.5 31.9573L1.76561 25.0151V14.9293L13.4507 21.8451L13.4701 23.0984L5.45351 18.3548L5.44295 19.5801L13.4894 24.3885L13.5088 25.675L5.46408 20.9174L5.45351 22.1427L13.5 26.9511L21.6239 22.1182V20.8929V16.909L25.2432 14.7595L25.2344 25.0151ZM25.2344 13.4519L22.0147 15.3319L20.5325 16.2071L13.4666 12.0201L13.456 13.2454L19.4957 16.818L19.4429 16.8495L19.3126 16.9247L18.4536 17.4166L13.4666 14.4689L13.456 15.6942L17.3921 18.0222L16.4591 18.6314L16.438 18.6436L13.4666 16.902L13.456 18.1273L15.4029 19.2615L13.4155 20.4483L1.7973 13.5762L13.4349 6.61831L25.2344 13.4519ZM25.2344 12.2266L13.4401 5.31075L1.76561 12.2196V2.9897L13.5 1.76442L25.2344 2.9897V12.2266Z" fill="#666666"/>
+      </g>
+      <defs>
+        <clipPath id="clip0_135765_344">
+          <rect width="27" height="34" fill="white"/>
+        </clipPath>
+      </defs>
+    </svg>
   </div>
 </footer>
 </body>

diff --git a/source/img/gift-background.png b/source/img/gift-background.png
diff --git a/source/img/hero-background.png b/source/img/hero-background.png
diff --git a/source/img/logo-mobile-name.svg b/source/img/logo-mobile-name.svg