media queries

frontend/src/pages/addresses/Addresses.css

@@ -28,3 +28,13 @@
   margin-left: 1rem;
   flex-shrink: 0;
 }
+
+/* ── Addresses Responsive ────────────────────────────────── */
+
+@media (max-width: 480px) {
+  .address__remove {
+    margin-left: 0.5rem;
+    padding: 0.25rem 0.5rem;
+    font-size: 0.8rem;
+  }
+}

frontend/src/pages/alerts/Alerts.css

@@ -61,3 +61,54 @@
   gap: 0.75rem;
   margin-top: 1rem;
 }
+
+/* ── Alerts Page Responsive ──────────────────────────────── */
+
+/* Laptop: tighten the gap */
+@media (max-width: 1024px) {
+  .alerts-grid {
+    gap: 1.5rem;
+  }
+}
+
+/* Tablet & below: collapse to single column */
+@media (max-width: 768px) {
+  .alerts-grid {
+    grid-template-columns: 1fr;
+    gap: 2.5rem;
+  }
+}
+
+/* Mobile: compact spacing */
+@media (max-width: 480px) {
+  .alerts-grid {
+    gap: 2rem;
+  }
+
+  .alerts__address-info {
+    padding: 0.75rem;
+    margin-bottom: 1.25rem;
+  }
+
+  .alerts__rule {
+    padding: 0.75rem;
+  }
+
+  .alerts__rule .flex--between {
+    flex-direction: column;
+    gap: 0.75rem;
+  }
+
+  .alerts__save-test {
+    flex-direction: column;
+  }
+
+  .alerts__save-test .btn--lg {
+    width: 100%;
+    text-align: center;
+  }
+
+  .alerts__email-buttons {
+    flex-direction: column;
+  }
+}

frontend/src/pages/login/Login.css

@@ -95,4 +95,22 @@
   opacity: 0;
   animation: fadeIn 2s ease-in-out forwards;
   animation-delay: 6s;
+}
+
+/* ── Login Responsive ────────────────────────────────────── */
+
+@media (max-width: 480px) {
+  .login-card {
+    max-width: 100%;
+    margin: 0 0.75rem;
+    padding: 1.5rem;
+    padding-top: 6rem;
+  }
+
+  .login-tagline {
+    margin-top: 3rem;
+    padding-left: 1rem;
+    padding-right: 1rem;
+    font-size: 1.25rem;
+  }
 }

frontend/src/pages/subscribe/subscribe.css

@@ -235,4 +235,26 @@
   font-size: 0.8rem;
   margin: 0;
   font-style: italic;
+}
+
+/* ── Subscribe Responsive ────────────────────────────────── */
+
+@media (max-width: 480px) {
+  .subscribe {
+    padding-top: 1.5rem;
+  }
+
+  .subscribe__card {
+    padding: 1.25rem;
+  }
+
+  .progress-bar__connector {
+    width: 24px;
+  }
+
+  .progress-bar__dot {
+    width: 26px;
+    height: 26px;
+    font-size: 0.75rem;
+  }
 }