/* ── Contact layout ─────────────────────────────────────────── */
body { background: var(--ivory-d); }

.ct-layout {
  display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh;
}
.ct-panel {
  padding: 10rem clamp(3rem, 6vw, 6rem) 6rem;
  background: var(--ivory-d);
  display: flex; flex-direction: column; justify-content: center;
}
.ct-label {
  font-family: var(--body); font-size: .65rem; letter-spacing: .25em;
  text-transform: uppercase; color: var(--sage-d); display: block; margin-bottom: 1.25rem;
}
.ct-title {
  font-family: var(--display); font-size: clamp(2.4rem, 4.5vw, 3.8rem);
  font-weight: 400; color: var(--bordeaux); line-height: 1.15; margin-bottom: .5rem;
}
.ct-intro {
  font-family: var(--body); font-size: .9rem; font-weight: 300;
  color: var(--muted); line-height: 1.9; max-width: 400px; margin-bottom: 2.5rem;
}
.ct-direct { display: flex; flex-direction: column; gap: .75rem; margin-bottom: 2.75rem; }
.ct-direct-link {
  display: inline-flex; align-items: center; gap: .75rem;
  font-family: var(--body); font-size: .8rem; font-weight: 400;
  color: var(--coal); transition: color .2s; letter-spacing: .02em;
}
.ct-direct-link:hover { color: var(--bordeaux); }
.ct-direct-link svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--bordeaux); }
.ct-signature { margin-bottom: 2.75rem; }
.ct-signature-names {
  font-family: var(--script); font-size: clamp(1.6rem, 2.5vw, 2.1rem);
  color: var(--bordeaux); display: block; line-height: 1.2; margin-bottom: .3rem;
}
.ct-signature-role {
  font-family: var(--body); font-size: .7rem; letter-spacing: .15em;
  text-transform: uppercase; color: var(--muted); font-weight: 300;
}

/* ── Right panel — sticky photo ─────────────────────────────── */
.ct-photo {
  position: sticky; top: 0; height: 100vh; overflow: hidden;
  background: var(--ivory-d); display: flex;
  align-items: center; justify-content: flex-end;
}
.ct-photo img { width: auto; height: 100%; max-width: 100%; object-fit: contain; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 900px) {
  .ct-layout { grid-template-columns: 1fr; }
  .ct-photo {
    position: relative; height: 70vw;
    min-height: 320px; max-height: 520px;
    justify-content: center;
  }
  .ct-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
  .ct-panel { padding-top: 9rem; justify-content: flex-start; }
}
@media (max-width: 640px) {
  .ct-photo { height: 80vw; }
}
