Contact has been added

README.md

@@ -24,7 +24,7 @@ Create a static site resource for this repository and set its publish/root direc
 
 ## Before launch
 
-Replace the clearly marked contact email placeholder in the Contact section with the company's preferred contact details. The small brand favicon is embedded in the HTML; replace its data URI if a final brand mark becomes available.
+The Contact section uses a `mailto:` link for the supplied company email. The small brand favicon is embedded in the HTML; replace its data URI if a final brand mark becomes available.
 
 ## Assets
 

index.html

@@ -152,8 +152,8 @@
           </div>
           <div class="contact-card" id="contact-details">
             <span class="contact-card-label">START A CONVERSATION</span>
-            <span class="contact-placeholder">[Add preferred company contact email]</span>
-            <span class="contact-card-note">Contact details to be provided by EssDeeBee Tech LLC.</span>
+            <a class="contact-placeholder" href="mailto:sergei.dzeboev@essdeebee.com">sergei.dzeboev@essdeebee.com</a>
+            <span class="contact-card-note">Reach out to discuss your project or technical needs.</span>
             <span class="contact-card-mark" aria-hidden="true">↗</span>
           </div>
         </div>

style.css

@@ -135,7 +135,8 @@ h1, h2, h3, p { margin-top: 0; }
 .contact-description { max-width: 380px; margin: 20px 0 0; color: var(--muted); font-size: 12px; line-height: 1.9; }
 .contact-card { position: relative; display: flex; min-height: 125px; flex-direction: column; justify-content: center; padding: 24px 25px; border: 1px solid rgba(131, 230, 195, .24); border-radius: 4px; background: rgba(14, 23, 25, .77); box-shadow: 0 18px 48px rgba(0, 0, 0, .12); }
 .contact-card-label { margin-bottom: 12px; color: var(--accent); font: 9px/1.4 var(--mono); letter-spacing: .12em; }
-.contact-placeholder { color: #d7e1dd; font-size: 13px; }
+.contact-placeholder { width: fit-content; color: #d7e1dd; font-size: 13px; text-decoration: underline; text-decoration-color: rgba(131, 230, 195, .38); text-underline-offset: 4px; transition: color .2s ease, text-decoration-color .2s ease; }
+.contact-placeholder:hover { color: var(--accent); text-decoration-color: var(--accent); }
 .contact-card-note { margin-top: 8px; color: #788887; font-size: 10px; }
 .contact-card-mark { position: absolute; top: 21px; right: 21px; color: var(--accent); font-size: 16px; }
 .site-footer { background: #090c10; }.footer-inner { display: flex; min-height: 85px; align-items: center; justify-content: space-between; gap: 25px; }