/* COLAINT contact modal and mobile-only refinements.
   The original page stylesheet is intentionally left in place and unchanged. */
.contact-modal-backdrop[hidden],
.contact-success[hidden] { display: none !important; }
.contact-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
  background: rgba(26, 12, 14, .66);
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
  opacity: 0;
  transition: opacity .22s ease;
}
.contact-modal-backdrop.is-visible { opacity: 1; }
.contact-modal {
  width: min(100%, 620px);
  max-height: min(92dvh, 850px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: clamp(1.25rem, 4vw, 2rem);
  border: 1px solid var(--line);
  border-radius: 25px;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 28px 90px rgba(15, 5, 7, .28);
  transform: translateY(14px) scale(.985);
  transition: transform .26s cubic-bezier(.2,.8,.2,1);
  outline: none;
}
.contact-modal-backdrop.is-visible .contact-modal { transform: translateY(0) scale(1); }
.contact-modal__topline { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.15rem; }
.contact-modal__brand { display:inline-flex; align-items:center; gap:.5rem; color:var(--brand); font:700 1rem/1 "Bricolage Grotesque",sans-serif; letter-spacing:.13em; }
.contact-modal__brand svg { width:1.75rem; height:1.75rem; }
.contact-modal__close {
  width:2.45rem; height:2.45rem; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:50%; background:var(--bg); color:var(--muted);
  font:400 1.55rem/1 system-ui,sans-serif; cursor:pointer; transition:background .18s ease,color .18s ease,transform .18s ease;
}
.contact-modal__close:hover { background:var(--soft); color:var(--brand); transform:rotate(90deg); }
.contact-modal__eyebrow { margin:0 0 .5rem; color:var(--brand); font:700 .76rem/1.3 "Source Sans 3",sans-serif; letter-spacing:.15em; }
.contact-modal h2 { margin:0 0 .55rem; font-size:clamp(1.7rem,5vw,2.25rem); }
.contact-modal__intro { max-width:34rem; margin:0 0 1.35rem; color:var(--muted); font-size:1rem; }
.contact-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.95rem 1rem; }
.contact-field { min-width:0; display:flex; flex-direction:column; gap:.35rem; }
.contact-field--full { grid-column:1 / -1; }
.contact-field label { color:var(--ink); font-size:.94rem; font-weight:600; }
.contact-field label > span:not(.contact-optional) { color:var(--brand); }
.contact-optional { margin-left:.25rem; color:var(--muted); font-size:.82rem; font-weight:400; }
.contact-field input, .contact-field select, .contact-field textarea {
  width:100%; min-width:0; padding:.78rem .9rem; border:1px solid var(--line); border-radius:12px;
  background:var(--bg); color:var(--ink); font:400 1rem/1.4 "Source Sans 3",system-ui,sans-serif;
  outline:none; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.contact-field input::placeholder, .contact-field textarea::placeholder { color:var(--muted); opacity:.78; }
.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 14%, transparent); background:var(--surface); }
.contact-field textarea { resize:vertical; min-height:105px; }
.contact-field small { color:var(--muted); font-size:.78rem; line-height:1.35; }
.contact-modal__verification { margin:1rem 0 .8rem; min-height:65px; }
.contact-help { margin:.35rem 0 0; color:var(--muted); font-size:.82rem; }
.contact-privacy { display:flex; align-items:flex-start; gap:.6rem; margin:.75rem 0; color:var(--muted); font-size:.87rem; line-height:1.45; }
.contact-privacy input { flex:none; width:1rem; height:1rem; margin:.2rem 0 0; accent-color:var(--brand); }
.contact-privacy a { color:var(--brand); text-decoration:underline; text-underline-offset:2px; font:inherit; }
.contact-privacy .contact-legal-link { display:inline; margin-inline:.08em; white-space:normal; color:#c8102e !important; text-decoration:underline; text-underline-offset:2px; }
.contact-privacy .contact-legal-link:link,.contact-privacy .contact-legal-link:visited,.contact-privacy .contact-legal-link:hover,.contact-privacy .contact-legal-link:active { color:#c8102e !important; }
.contact-privacy .contact-legal-join { display:inline-block; margin-inline:.3em; }
.contact-form-status { min-height:1.35rem; margin:.35rem 0 .45rem; color:var(--deep); font-size:.9rem; }
.contact-form-status.is-error { color:#b42318; }
.contact-form-status.is-success { color:#18794e; }
.contact-submit { display:inline-flex; align-items:center; justify-content:center; gap:.15rem; min-height:48px; cursor:pointer; font:600 1rem/1.2 "Source Sans 3",system-ui,sans-serif; }
.contact-submit:disabled { cursor:wait; opacity:.7; }
.contact-modal__footnote { margin:.75rem 0 0; color:var(--muted); font-size:.78rem; text-align:center; }
.contact-honeypot { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.contact-success { padding:1rem 0 .25rem; text-align:center; }
.contact-success__icon { width:3.6rem; height:3.6rem; display:grid; place-items:center; margin:0 auto 1.1rem; border-radius:50%; background:var(--soft); color:var(--brand); font-size:1.8rem; font-weight:700; }
.contact-success .contact-modal__intro { margin:0 auto 1.5rem; }
.contact-success .contact-submit { min-width:140px; }
body.contact-modal-open { overflow:hidden; }

/* Responsive corrections apply only at narrower viewports; desktop styling stays as supplied. */
@media (max-width: 900px) {
  .hero-grid > svg { display:block; width:100%; height:auto; max-width:520px; margin-inline:auto; }
}
@media (max-width: 600px) {
  .wrap { padding-inline:1rem; }
  .nav { gap:.8rem; padding-bottom:2.2rem; }
  .nav > a:last-child { max-width:10rem; text-align:right; line-height:1.3; }
  .brand { font-size:1.2rem; }
  .brand .mark { width:1.9rem; height:1.9rem; }
  .hero { padding-bottom:3rem; }
  .hero-grid { gap:1.6rem; }
  .hero p.lead { font-size:1.08rem; }
  .hero .btn { margin:.25rem .35rem .25rem 0; }
  .btn { padding:.78rem 1.2rem; }
  .btn.ghost { margin-left:0; }
  .band { gap:.55rem 1rem; margin-top:1.5rem; }
  .cta { padding:2.6rem 1rem; border-radius:22px; }
  .contact-modal-backdrop { padding:.5rem; align-items:end; }
  .contact-modal { width:100%; max-height:calc(100dvh - 1rem); padding:1.2rem 1rem max(1.2rem, env(safe-area-inset-bottom)); border-radius:21px; }
  .contact-modal-backdrop.is-visible .contact-modal { transform:translateY(0) scale(1); }
}
@media (max-width: 420px) {
  .contact-form-grid { grid-template-columns:1fr; gap:.8rem; }
  .contact-field--full { grid-column:auto; }
  .contact-modal__intro { font-size:.94rem; }
}
@media (prefers-reduced-motion: reduce) {
  .contact-modal-backdrop, .contact-modal, .contact-modal__close, .contact-field input, .contact-field select, .contact-field textarea { transition:none !important; }
}

/* Homepage legal footer: stacked below the COLAINT wordmark, matching the legal pages. */
#site-footer .footer-bottom {
  display:flex !important;
  flex-direction:column !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:.35rem !important;
  text-align:center;
}
#site-footer .footer-legal {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:center !important;
  column-gap:1.25rem !important;
  row-gap:.5rem !important;
  margin-top:.4rem;
}
#site-footer .footer-legal a,
#site-footer .footer-legal a:link,
#site-footer .footer-legal a:visited,
#site-footer .footer-legal a:hover,
#site-footer .footer-legal a:active {
  display:inline-block;
  padding-inline:.12rem;
  color:#c8102e !important;
  text-decoration:underline !important;
  text-decoration-color:#c8102e !important;
  text-underline-offset:3px;
  font-size:.9rem;
}
