/* ADHawk Contact Page — page-scoped styles */
.contact-page {
  --hawk-shield-blue:#00B5E2;
  --teal-accent:#00A6AD;
  --deep-navy:#0A1E33;
  --electric-blue:#009CDE;
  --white:#FFFFFF;
  --graphite:#2D3E50;
  --slate-accent-gray:#3C4F63;

  color: var(--graphite);
  max-width: 900px;
  margin: 0 auto;
  padding: 2.5rem 1rem 4rem;
}

.contact-page .badge{
  display:inline-block;
  font-weight:600;
  color: var(--teal-accent);
  letter-spacing:.02em;
  margin-bottom:.5rem;
}

.contact-page h1{
  font-size: clamp(1.8rem, 2.2vw + 1rem, 2.5rem);
  color: var(--deep-navy);
  margin: 0 0 .5rem;
}

.contact-page .lede{
  max-width: 68ch;
  margin: 0 0 1rem;
  color: #33475b;
}

.contact-page .contact-alt{
  list-style:none; padding:0; margin: 0 0 2rem;
  display:flex; gap:1.25rem; flex-wrap:wrap;
}
.contact-page .contact-alt a{
  color: var(--electric-blue); text-decoration: none; border-bottom: 1px solid rgba(0,156,222,.25);
}
.contact-page .contact-alt a:hover{ border-color: var(--electric-blue); }

.contact-page .contact-form{
  background: linear-gradient(0deg, #ffffff, #fbfdff);
  border: 1px solid rgba(60,79,99,.18);
  border-radius: 1rem;
  padding: 1.5rem;
  box-shadow: 0 10px 30px rgba(10,30,51,.06);
}

.contact-page .grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem 1rem;
}

.contact-page .field{ display:flex; flex-direction:column; gap:.4rem; }
.contact-page .field--full{ grid-column: 1 / -1; }

.contact-page label{
  font-weight:600; color: var(--deep-navy);
}

.contact-page input[type="text"],
.contact-page input[type="email"],
.contact-page select,
.contact-page textarea{
  appearance:none;
  width:100%;
  border:1px solid rgba(60,79,99,.35);
  border-radius:.65rem;
  padding:.7rem .85rem;
  font: inherit;
  background:#fff;
  color:#1d2a38;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}

.contact-page textarea{ resize: vertical; }

.contact-page input:focus,
.contact-page select:focus,
.contact-page textarea:focus{
  border-color: var(--hawk-shield-blue);
  box-shadow: 0 0 0 3px rgba(0,181,226,.18);
}

.contact-page .checkbox label{ font-weight:500; color:#2b3b4d; }
.contact-page .small-note{ margin:.35rem 0 0; font-size:.9rem; color:#56687a; }

.contact-page .button{
  display:inline-block;
  margin-top:1rem;
  padding:.75rem 1.1rem;
  border-radius:.8rem;
  border:1px solid var(--electric-blue);
  background: var(--electric-blue);
  color: var(--white);
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  transition: transform .05s ease, box-shadow .15s ease;
}
.contact-page .button:hover{
  box-shadow: 0 8px 20px rgba(0,156,222,.25);
}
.contact-page .button:active{ transform: translateY(1px); }

/* Anti-bot honeypot */
.contact-page .hp{
  position:absolute !important;
  left:-9999px !important;
  height:0 !important;
  width:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* FAQ block */
.contact-page .contact-faq{
  margin-top:2rem;
}
.contact-page details{
  border:1px solid rgba(60,79,99,.18);
  border-radius:.75rem;
  padding:.85rem 1rem;
  background:#fff;
  box-shadow: 0 8px 18px rgba(10,30,51,.04);
}
.contact-page details + details{ margin-top:.75rem; }
.contact-page summary{
  cursor:pointer;
  font-weight:600;
  color: var(--deep-navy);
}

/* Responsive */
@media (max-width: 720px){
  .contact-page{ padding: 2rem 1rem 3rem; }
  .contact-page .grid{ grid-template-columns: 1fr; }
}

/* --- Visual polish update --- */

/* Overall spacing & contrast */
.contact-page {
  padding-top: 2rem; /* tighten from 2.5–3rem */
  background: var(--deep-navy);
  color: var(--white);
}

/* Header section */
.contact-page .contact-header {
  max-width: 65ch;
  margin: 0 auto 2rem;
  text-align: left;
}

/* Badge and heading */
.contact-page .badge {
  color: var(--hawk-shield-blue);
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

.contact-page h1 {
  color: var(--white);
  font-size: clamp(2rem, 2.5vw + 1rem, 2.75rem);
  margin-top: 0.25rem;
  margin-bottom: 0.75rem;
  line-height: 1.2;
}

/* Lede paragraph */
.contact-page .lede {
  color: rgba(255, 255, 255, 0.85);
  font-size: 1.05rem;
  margin-bottom: 1rem;
}

/* Email list and link */
.contact-page .contact-alt {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
}

.contact-page .contact-alt li {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 500;
}

.contact-page .contact-alt a {
  color: var(--hawk-shield-blue);
  border-bottom: 1px solid rgba(0,181,226,0.4);
  text-decoration: none;
  transition: color .15s ease, border-color .15s ease;
}

.contact-page .contact-alt a:hover {
  color: var(--white);
  border-color: var(--white);
}

/* FAQ body text fix — ensure readable ink on white panels */
.contact-page details > *:not(summary),
.contact-page details[open] p,
.contact-page details[open] li {
  color: var(--graphite); /* #2D3E50 */
}

/* Keep FAQ headers visible on the dark page background */
.contact-page summary {
  color: var(--deep-navy);
}

/* Links inside answers */
.contact-page details a {
  color: var(--hawk-shield-blue);
  text-decoration: underline;
}