.contact-shell {
  min-height: 100vh;
  background: var(--bg-ink);
  display: flex;
  flex-direction: column;
}

.contact-main {
  width: min(1100px, calc(100% - 48px));
  margin: 0 auto;
  padding: 150px 0 100px;
  flex: 1;
}

.contact-hero { text-align: center; max-width: 680px; margin: 0 auto 64px; }
.contact-hero h1 {
  font-family: var(--font-serif);
  color: var(--parchment);
  font-size: clamp(3rem, 7vw, 5.2rem);
  line-height: 1;
  margin: 20px 0 18px;
}
.contact-hero p { color: #c8b189; font-size: 1.1rem; }

.contact-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 70px;
  align-items: start;
}
.contact-label { color: var(--gold); text-transform: uppercase; letter-spacing: 2px; font-size: 0.75rem; font-weight: 700; }
.contact-copy h2 { font-family: var(--font-serif); color: var(--parchment); font-size: 2.5rem; line-height: 1.05; margin: 16px 0; }
.contact-copy > p { color: #c8b189; line-height: 1.8; }
.contact-notes { display: grid; gap: 16px; margin-top: 30px; }
.contact-notes div { display: flex; gap: 12px; align-items: center; color: #c8b189; font-size: 0.9rem; }
.contact-notes i { color: var(--gold); width: 18px; text-align: center; }

.contact-form {
  background: var(--bg-panel);
  border: 1px solid var(--heritage-border);
  border-radius: 8px;
  padding: 32px;
  display: grid;
  gap: 9px;
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.25);
}
.contact-form label { color: var(--text-secondary); font-size: 0.82rem; margin-top: 8px; }
.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  border: 1px solid var(--heritage-border-strong);
  border-radius: 5px;
  background: rgba(20, 13, 8, 0.65);
  color: var(--parchment);
  font: inherit;
  padding: 12px 14px;
}
.contact-form textarea { resize: vertical; }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus { outline: 2px solid var(--gold); outline-offset: 1px; }
.contact-form .cta { border: 0; cursor: pointer; justify-content: center; margin-top: 16px; }
.contact-form .cta:disabled { cursor: wait; opacity: 0.65; }
.form-note { color: var(--text-muted); font-size: 0.75rem; text-align: center; margin-top: 4px; }
.form-status-success { color: #9ac7a0; }
.form-status-error { color: #e6a09a; }
.contact-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 760px) {
  .contact-main { width: min(100% - 32px, 600px); padding-top: 125px; }
  .contact-grid { grid-template-columns: 1fr; gap: 42px; }
  .contact-form { padding: 22px; }
}

/* Match the shared hero rhythm used by the blog and etiquette pages. */
.contact-main { padding-top: 140px; }
.contact-hero { margin-bottom: 48px; }
.contact-hero h1 { font-size: clamp(2.7rem, 5vw, 4.2rem); line-height: 1.1; min-height: 2.2em; display: flex; align-items: center; justify-content: center; }
.contact-hero p { line-height: 1.8; }
@media (max-width: 760px) { .contact-main { padding-top: 110px; } }