var first1

assets/css/custom.css

@@ -258,4 +258,34 @@ html.dark .color-swatches [style*="#000000"] + label {
     width: 100%;
     height: 100%;
     object-fit: cover; /* This will crop the image to fit */
+}
+
+/* --- Responsive Design --- */
+@media (max-width: 768px) {
+    .display-3 {
+        font-size: 2.5rem;
+    }
+    .display-4 {
+        font-size: 2rem;
+    }
+    .display-5 {
+        font-size: 1.75rem;
+    }
+
+    .hero-section {
+        height: auto; /* Adjust height for mobile */
+        padding: 100px 0;
+    }
+
+    .product-card .product-info {
+        padding: 15px;
+    }
+
+    .site-footer {
+        text-align: center;
+    }
+
+    .site-footer .col-lg-2, .site-footer .col-lg-3, .site-footer .col-lg-4 {
+        margin-bottom: 30px;
+    }
 }

contact.php

@@ -29,7 +29,6 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
 include 'includes/header.php';
 ?>
 
-<main class="container my-5 py-5">
     <div class="row justify-content-center">
         <div class="col-lg-8 text-center" data-aos="fade-up">
             <h1 class="display-4 fw-bold"><?php echo $page_title; ?></h1>
@@ -79,9 +78,5 @@ include 'includes/header.php';
              <div class="alert alert-info mt-4"><b>توجه:</b> این فرم برای اهداف آزمایشی است. برای دریافت واقعی ایمیل‌ها، باید اطلاعات سرور ایمیل (SMTP) خود را در فایل <code>.env</code> وارد کنید.</div>
         </div>
     </div>
-</main>
 
-<?php include 'includes/footer.php'; ?>
-
-</body>
-</html>
+<?php include 'includes/footer.php'; ?>