/* ═══════════════════════════════════════════════════════════════
RESPONSIVE — append to bottom of style.css
═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
 :root { --pad: 20px; }

 /* Nav left */
 .nav-left { top: 20px; left: 20px; }
 .nav-role  { display: none; }

 /* Nav right */
 .nav-right { top: 22px; right: 20px; }

 /* Footer */
 .site-footer { padding: 40px 20px 28px; }
 .footer-top {
     flex-direction: column;
     align-items: flex-start;
     gap: 20px;
     padding-bottom: 28px;
 }
 .footer-contact { align-items: flex-start; text-align: left; }
 .footer-email   { font-size: 15px; }
}