/* ==========================================================================
   06 CONTACT US — paper-2 field; replaced the pricing table (2026-10-08).
   Scope every rule under .contact. The FAQ continues the same field below,
   so the bottom padding is trimmed the way the pricing section's was.
   ========================================================================== */

.contact {
  padding-bottom: calc(var(--section-y) * 0.55);
}

.contact .ct-head {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 1.5rem;
  align-items: end;
}
.contact .ct-head-main { grid-column: 1 / span 7; }
.contact .ct-title { margin-top: 1.625rem; }
.contact .ct-side {
  grid-column: 8 / -1;
  display: grid;
  justify-items: start;
  gap: 1.75rem;
  max-width: 27.5rem;
  margin-left: auto;
  padding-bottom: 0.375rem;
}

@media (max-width: 1100px) {
  .contact .ct-head-main,
  .contact .ct-side { grid-column: 1 / -1; }
  .contact .ct-side { max-width: 32.5rem; margin-left: 0; padding-bottom: 0; }
}

/* ==========================================================================
   Book a call — Calendly in a modal <dialog> (js/book.js).
   ========================================================================== */

.book {
  width: min(65rem, 100vw - 2rem);
  height: min(47.5rem, 100vh - 2rem);
  height: min(47.5rem, 100dvh - 2rem);
  max-width: none;
  max-height: none;
  padding: 0;
  border: 0;
  border-radius: var(--r-3);
  background: var(--white);
  color: var(--navy);
  box-shadow: 0 2rem 5rem -1.5rem rgba(11, 13, 16, 0.5);
  overflow: hidden;
}
.book[open] {
  display: flex;
  flex-direction: column;
}
.book::backdrop {
  background: rgba(11, 13, 16, 0.62);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.book-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 0.75rem 0.75rem 1.5rem;
  border-bottom: 1px solid rgba(10, 10, 11, 0.11);
}
.book-title {
  font-size: 1.0625rem;
  font-weight: 640;
  color: var(--navy);
}
.book-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--r-pill);
  color: var(--navy);
  box-shadow: inset 0 0 0 1.5px rgba(10, 10, 11, 0.2);
  transition: box-shadow var(--dur-1) ease;
}
.book-close:hover { box-shadow: inset 0 0 0 1.5px var(--navy); }
.book-close .i { width: 1.125rem; height: 1.125rem; }

.book-body {
  position: relative;
  flex: 1;
  min-height: 0;
}
.book-loading {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 0.9375rem;
  color: #61687a;
}
.book-body iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 760px) {
  .book {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    border-radius: 0;
  }
}