Fix Get In Touch section to respond to light/dark theme toggle

Section previously had hardcoded black background/white text regardless
of theme; now defaults to light styling and switches via body.dark like
every other section.

Author: shahidghafoor00

styles.css

@@ -566,7 +566,7 @@ section { padding: 6rem 5%; }
 .team-card p { font-size: 0.825rem; color: var(--gray-600); line-height: 1.6; }
 
 /* ── CONTACT ── */
-#contact { background: var(--black); color: var(--white); }
+#contact { background: var(--white); color: var(--black); }
 
 .contact-grid {
   display: grid;
@@ -575,24 +575,20 @@ section { padding: 6rem 5%; }
   align-items: start;
 }
 
-#contact .section-tag { color: var(--gray-400); }
-#contact .section-title { color: var(--white); }
-#contact .section-subtitle { color: #aaaaaa; }
-
 .contact-details { margin-top: 2.5rem; display: flex; flex-direction: column; gap: 1.25rem; }
 .contact-item { display: flex; align-items: center; gap: 1rem; }
 .contact-item-icon {
   width: 44px; height: 44px;
-  border: 1.5px solid #333;
+  border: 1.5px solid var(--gray-200);
   border-radius: 8px;
   display: flex; align-items: center; justify-content: center;
   font-size: 1.1rem;
   flex-shrink: 0;
 }
 .contact-item-body {}
 .contact-item-label { font-size: 0.7rem; color: var(--gray-400); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600; }
-.contact-item-value { font-size: 0.95rem; color: var(--white); font-weight: 500; }
-.contact-item-value a { color: var(--white); text-decoration: none; }
+.contact-item-value { font-size: 0.95rem; color: var(--black); font-weight: 500; }
+.contact-item-value a { color: var(--black); text-decoration: none; }
 .contact-item-value a:hover { text-decoration: underline; }
 
 .contact-form { display: flex; flex-direction: column; gap: 1rem; }
@@ -737,6 +733,12 @@ body.dark .team-card { background: #111; border-color: #2a2a2a; }
 body.dark .team-card:hover { transform: translateY(-12px); box-shadow: 0 24px 48px rgba(255,255,255,0.08); }
 body.dark .team-card p { color: #888; }
 
+body.dark #contact { background: var(--black); color: var(--white); }
+body.dark #contact .section-subtitle { color: #aaaaaa; }
+body.dark .contact-item-icon { border-color: #333; }
+body.dark .contact-item-value,
+body.dark .contact-item-value a { color: var(--white); }
+
 body.dark #contact iframe {
   filter: invert(1) hue-rotate(180deg);
   border-radius: 8px;