/* Contact dialog: same locally hosted type and warm palette as the landing page. */
/* The email alone defines the group's width; the longer phone may extend past it. */
.contact-channels { display: grid; width: max-content; max-width: 100%; }
.final-details .contact-email-row { grid-template-columns: 94px max-content; }
.final-details .contact-phone-row { contain: inline-size; }
.final-details dd, .final-details dd a, .final-details .contact-note {
  font-family: var(--font-body); font-size: var(--type-body); font-weight: 600; line-height: 1.6;
}
.final-details dd a { white-space: nowrap; }
.final-details .contact-phone-row dd { width: max-content; white-space: nowrap; }
.contact-open {
  position: relative; isolation: isolate; contain: inline-size;
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 44px; margin-top: 10px; padding: 0 8px;
  border: 0; border-radius: 999px;
  color: #fff4dd; text-decoration: none; white-space: nowrap;
  font-family: var(--font-body); font-size: 14px; line-height: 1.3; font-weight: 600;
}
/* A thin visible plate with an unchanged 44px-tall hit target. */
.contact-open::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  left: 0; right: 0; top: 50%; transform: translateY(-50%);
  height: calc(var(--type-body) * 1.6); box-sizing: border-box;
  border: 1px solid #bc925a; border-radius: 999px; background: #2d281c;
  transition: background-color .2s ease, border-color .2s ease;
}
.final-details .contact-open:hover { color: #fff4dd; }
.contact-open:hover::before { background: #403522; border-color: var(--gold); }
@media (max-width: 700px) {
  .final-details .contact-email-row { grid-template-columns: max-content; }
}
html.contact-modal-open { overflow: hidden; }
.contact-dialog {
  width: min(580px, calc(100% - 48px)); max-width: none;
  max-height: 68dvh; margin: auto; padding: 0;
  overflow: auto; overscroll-behavior: contain; scroll-padding-block: 170px 24px;
  border: 1px solid #716348; border-radius: 20px;
  background: #111810; color: var(--white);
  box-shadow: 0 28px 100px rgba(0, 0, 0, .6);
  color-scheme: dark; scrollbar-width: thin; scrollbar-color: #716348 #111810;
}
.contact-dialog:not([open]) { display: none; }
.contact-dialog::backdrop { background: rgba(2, 6, 3, .65); }
.contact-dialog.contact-revealing { transform-origin: center; will-change: transform, opacity; }
.contact-flight-trail {
  position: fixed; inset: 0; z-index: 20; width: 100%; height: 100%; pointer-events: none;
}
.contact-dialog.contact-revealing::backdrop { animation: contact-backdrop-in 1500ms ease-in-out both; }
@keyframes contact-backdrop-in {
  from { background: rgba(2, 6, 3, 0); }
  to { background: rgba(2, 6, 3, .65); }
}
@media (prefers-reduced-motion: reduce) {
  .contact-dialog.contact-revealing::backdrop { animation: none; }
}
.contact-dialog-content { position: relative; }
.contact-dialog-heading {
  position: sticky; top: 0; z-index: 2; padding: 26px 26px 20px;
  background: #111810; border-bottom: 1px solid rgba(188,146,90,.16);
}
.contact-close {
  position: absolute; top: 18px; right: 18px; width: 44px; height: 44px;
  padding: 0; border: 1px solid var(--line); border-radius: 50%;
  background: #1b241a; color: var(--white); font-size: 28px; font-weight: 400; line-height: 1;
  cursor: pointer;
}
.contact-close:hover { background: #2a3224; }
.contact-dialog h2 { padding-right: 50px; font-size: 28px; line-height: 1.2; }
.contact-intro { margin-top: 12px; color: var(--muted); font-size: 16px; line-height: 1.55; }
.contact-direct { padding: 24px 26px 26px; }
.contact-mail-action {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 16px; min-height: 48px; padding: 12px 24px;
  border: 1px solid #f3ce8a; border-radius: 999px;
  background: var(--gold); color: #192012; text-decoration: none;
  font-family: var(--font-body); font-size: 16px; font-weight: 600; line-height: 1.4;
  transition: background-color .2s ease;
}
.contact-mail-action:hover { background: #f2cb87; color: #192012; }
.contact-direct-hint { margin-top: 16px; color: #c7cbbd; font-size: 14px; line-height: 1.6; }
.contact-direct-address {
  display: flex; align-items: center; flex-wrap: wrap; gap: 4px 20px;
  margin-top: 18px; min-width: 0;
}
.contact-direct-address > a, .contact-direct-phone > a {
  display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0 5px;
  min-height: 44px; color: #fbf8ef; font-size: 16px; font-weight: 600;
  line-height: 1.5; text-underline-offset: 4px; overflow-wrap: anywhere;
}
.contact-copy {
  min-height: 44px; padding: 8px 0; border: 0; background: transparent;
  color: #e1bd7f; font: 500 14px/1.5 var(--font-body);
  text-decoration: underline; text-underline-offset: 4px; cursor: pointer;
}
.contact-copy:hover { color: #ffe1a7; }
.contact-copy-status { color: #e1bd7f; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.contact-copy-status:not(:empty) { margin-top: 8px; }
.contact-direct-phone {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0 20px;
  margin-top: 20px; padding-top: 16px; border-top: 1px solid rgba(188,146,90,.24);
}
.contact-direct-phone > span { color: #c7cbbd; font-size: 14px; line-height: 1.5; }
.contact-direct-note { color: #c7cbbd; font-size: 14px; font-weight: 400; }
.contact-dialog :focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width: 600px) {
  .contact-dialog { width: calc(100% - 32px); max-height: 82dvh; border-radius: 16px; scroll-padding-top: 210px; }
  .contact-dialog-heading { padding: 24px 20px 16px; }
  .contact-dialog h2 { font-size: 28px; }
  .contact-close { top: 16px; right: 12px; }
  .contact-direct { padding: 20px 20px 24px; }
  .contact-mail-action { width: 100%; padding-inline: 16px; }
  .contact-direct-address { flex-direction: column; align-items: flex-start; gap: 0; }
  .contact-direct-phone { flex-direction: column; align-items: flex-start; }
}
/* Keep short/landscape screens usable without shrinking the text. */
@media (max-height: 540px) {
  .contact-dialog { max-height: calc(100dvh - 32px); }
  .contact-dialog-heading { padding-block: 14px; }
  .contact-intro { margin-top: 8px; }
}