From 9fc5e1cb5f711e261b02fa02828d431af9a46c04 Mon Sep 17 00:00:00 2001
From: Kirill Pet <job.mori.1967@gmail.com>
Date: Thu, 19 Dec 2024 18:53:31 +0300
Subject: [PATCH] =?UTF-8?q?=D1=81=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20=D1=8D?=
 =?UTF-8?q?=D1=84=D1=84=D0=B5=D0=BA=D1=82=D1=8B=20button?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/css/gp-style-core.css    | 36 +++++++++++++++++++++++++++++----
 assets/css/gp-style-desktop.css |  2 ++
 index.html                      |  8 ++++----
 3 files changed, 38 insertions(+), 8 deletions(-)

diff --git a/assets/css/gp-style-core.css b/assets/css/gp-style-core.css
index 24c12ff..e779d4d 100644
--- a/assets/css/gp-style-core.css
+++ b/assets/css/gp-style-core.css
@@ -75,16 +75,23 @@ body{
     height: 100vh;
     width: 100%;
 
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
     background-color: rgba(17, 17, 20, .8);
 
     z-index: 100;
 
-    display: none;
+    pointer-events: none;
+
+    transition: opacity .3s;
+    opacity: 0;
 }
 .modal.active{
-    display: flex;
-    justify-content: center;
-    align-items: center;
+    pointer-events: auto;
+
+    opacity: 1;
 }
 
 .modal__item{
@@ -194,6 +201,9 @@ body{
     border-radius: 4px;
 
     transition: background-color .3s;
+    background-color: rgba(17, 17, 20, 0);
+
+    cursor: pointer;
 }
 .btn-big--border{
     padding: 21px 32px;
@@ -203,12 +213,30 @@ body{
 .btn-big--border--blood{
     border-color: var(--blood);
 }
+.btn-big--border--blood:hover{
+    background-color: var(--red);
+}
+.btn-big--border--blood:active{
+    background-color: var(--blood);
+}
 .btn-big--border--white{
     border-color: var(--text-white);
 }
+.btn-big--border--white:hover{
+    background-color: var(--background-grey-hover);
+}
+.btn-big--border--white:active{
+    background-color: rgba(17, 17, 20, 0);
+}
 .btn-big--blood{
     background-color: var(--blood);
 }
+.btn-big--blood:hover{
+    background-color: var(--red);
+}
+.btn-big--blood:active{
+    background-color: var(--blood);
+}
 
 .btn-big--social{
     padding-right: 66px;
diff --git a/assets/css/gp-style-desktop.css b/assets/css/gp-style-desktop.css
index d487e15..bff2e9a 100644
--- a/assets/css/gp-style-desktop.css
+++ b/assets/css/gp-style-desktop.css
@@ -128,6 +128,8 @@
     overflow: hidden;
 
     border: none;
+
+    cursor: pointer;
 }
 .header-menu__search.active .header-menu-search__open img:first-child{
     display: none;
diff --git a/index.html b/index.html
index 61bea6b..b2a14bb 100644
--- a/index.html
+++ b/index.html
@@ -76,9 +76,9 @@
                         </a>
                     </div>
                     <div class="header-main__item">
-                        <a href="" class="btn-big btn-big--border btn-big--border--blood header-main__btn">
+                        <button href="" class="btn-big btn-big--border btn-big--border--blood header-main__btn">
                             Заказать звонок
-                        </a>
+                        </button>
                         <a href="" class="btn-big btn-big--blood header-main__btn">
                             спецификация
                         </a>
@@ -1092,7 +1092,7 @@
         </footer>
 
         <div class="modal">
-            <div class="modal__item">
+            <div class="modal__item modal-project">
                 <p class="title-1">
                     Получи проект бесплатно
                 </p>
@@ -1146,7 +1146,7 @@
                 </form> 
             </div>
 
-            <div class="modal__item">
+            <div class="modal__item modal-call">
                 <p class="title-1">
                     Обратный звонок
                 </p>