/* assets/css/components/modal.css */
:root {
  --modal-bg: #fff;
  --modal-text: #0b2a6b;
  --modal-accent: #0b2a6b; /* primary color for buttons */
}

/* modal base */
#contact-modal{display:none;position:fixed;inset:0;align-items:center;justify-content:center;z-index:2147483646}
#contact-modal.is-open,#contact-modal[aria-hidden="false"]{display:flex!important}
#contact-modal .modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.62);backdrop-filter:blur(4px);z-index:1}
#contact-modal .modal-panel{position:relative;z-index:2;background:var(--modal-bg);width:min(920px,96%);max-height:86vh;overflow:auto;padding:22px;border-radius:10px;box-shadow:0 20px 60px rgba(2,6,23,.35);margin:0 12px;color:var(--modal-text)}
#contact-modal .contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:18px;align-items:start}
#contact-modal .social-icons{list-style:none;padding:0;margin:0 0 12px 0}
#contact-modal .social-icons li{margin:8px 0}
#contact-modal .social-icons a{text-decoration:none;color:var(--modal-text);font-weight:600}
#contact-modal input[type="text"],#contact-modal input[type="email"],#contact-modal textarea{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;box-sizing:border-box;margin-bottom:10px;font-size:14px}
#contact-modal .form-actions{display:flex;gap:10px;margin-top:6px}
#contact-modal .btn-primary{background:var(--modal-accent);color:#fff;border:none;padding:10px 14px;border-radius:6px;cursor:pointer}
#contact-modal .btn-secondary{background:transparent;border:1px solid #ccc;padding:8px 12px;border-radius:6px;cursor:pointer}
@media (max-width:720px){#contact-modal .contact-grid{grid-template-columns:1fr}#contact-modal .modal-panel{padding:14px}}