From 9c4f1cbe23ca33390c94f188e8580ed21b352ddf Mon Sep 17 00:00:00 2001
From: Francesco Lorenzo D'Amico <francescodamico448@gmail.com>
Date: Wed, 2 Sep 2026 17:38:41 +0200
Subject: [PATCH] Align hero buttons to the same height and baseline

---
 RazorPagesMovie/Pages/Index.cshtml | 36 +++++++++++++++++++++++++++++-
 1 file changed, 35 insertions(+), 1 deletion(-)

diff --git a/RazorPagesMovie/Pages/Index.cshtml b/RazorPagesMovie/Pages/Index.cshtml
index 8a71c25..25b6e1f 100644
--- a/RazorPagesMovie/Pages/Index.cshtml
+++ b/RazorPagesMovie/Pages/Index.cshtml
@@ -156,17 +156,23 @@
 
         #hero .hero-actions {
             display: flex;
+            align-items: center;
             gap: 12px;
             flex-wrap: wrap;
             margin-top: 25px;
         }
 
+        #hero .slider-button2 a {
+            margin-top: 0;
+        }
+
         #hero .hero-secondary {
             display: inline-block;
-            padding: 16px 28px;
+            padding: 17px 28px;
             border: 2px solid #fff;
             color: #fff;
             font-weight: 700;
+            font-size: 18px;
         }
 
             #hero .hero-secondary:hover {
@@ -174,6 +180,34 @@
                 color: #111;
             }
 
+        @@media (min-width: 992px) and (max-width: 1199px) {
+            #hero .hero-secondary {
+                padding: 13px 26px;
+                font-size: 16px;
+            }
+        }
+
+        @@media (min-width: 768px) and (max-width: 991px) {
+            #hero .hero-secondary {
+                padding: 12px 24px;
+                font-size: 16px;
+            }
+        }
+
+        @@media (min-width: 600px) and (max-width: 767px) {
+            #hero .hero-secondary {
+                padding: 13px 23px;
+                font-size: 15px;
+            }
+        }
+
+        @@media (max-width: 599px) {
+            #hero .hero-secondary {
+                padding: 12px 20px;
+                font-size: 15px;
+            }
+        }
+
         #hero .hero-social {
             margin-top: 25px;
         }