/* SayRaye Phase 2 — conversation/contact experience */
.conversation-routes,
.contact-message-section,
.contact-faq,
.conversation-closing {
  background: var(--paper);
  color: var(--ink);
}
.conversation-routes .section-heading { margin-bottom: clamp(2.5rem, 6vw, 5rem); }
.conversation-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:rgba(11,11,11,.2); border:1px solid rgba(11,11,11,.2); }
.conversation-card { min-height:34rem; display:flex; flex-direction:column; padding:clamp(1.5rem,3vw,2.5rem); background:var(--paper); }
.conversation-card-featured { background:var(--ink); color:var(--paper); }
.conversation-card-number { color:var(--gold); font:2.8rem var(--font-display); }
.conversation-card-kicker { margin-top:3rem; color:#7a6b55; font-size:.65rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.conversation-card-featured .conversation-card-kicker { color:var(--gold-light); }
.conversation-card h3 { margin:.8rem 0 1.2rem; font:clamp(2rem,3.3vw,3.5rem)/.96 var(--font-display); }
.conversation-card > p:not(.conversation-card-kicker) { color:#625b52; }
.conversation-card-featured > p:not(.conversation-card-kicker) { color:#b7afa5; }
.conversation-card .button { margin-top:auto; align-self:flex-start; }
.conversation-email-stack { display:grid; gap:.25rem; }
.conversation-email { margin-top:1.1rem; color:#73582d; font-size:.75rem; text-decoration:none; }
.conversation-card-featured .conversation-email { color:var(--gold-light); }

.contact-message-section { display:grid; grid-template-columns:minmax(16rem,.42fr) minmax(0,.58fr); gap:clamp(3rem,8vw,8rem); border-top:1px solid rgba(11,11,11,.15); }
.contact-message-copy { align-self:start; position:sticky; top:7rem; }
.contact-message-copy > p:not(.section-label) { max-width:31rem; color:#61594f; }
.contact-routing-list { margin-top:2.5rem; border-top:1px solid rgba(11,11,11,.18); }
.contact-routing-list div { display:flex; justify-content:space-between; gap:1rem; padding:.85rem 0; border-bottom:1px solid rgba(11,11,11,.18); }
.contact-routing-list dt { color:#756b5e; font-size:.62rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.contact-routing-list dd { font-family:var(--font-display); }

.topic-choice { margin:0 0 2rem; padding:0; border:0; }
.topic-choice legend { margin-bottom:1rem; font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.topic-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
.topic-choice label { cursor:pointer; }
.topic-choice input { position:absolute; opacity:0; pointer-events:none; }
.topic-choice span { min-height:3rem; display:flex; align-items:center; padding:.8rem 1rem; border:1px solid rgba(11,11,11,.22); background:transparent; transition:.2s ease; }
.topic-choice input:checked + span { border-color:var(--ink); background:var(--ink); color:var(--paper); }
.topic-choice input:focus-visible + span { outline:2px solid var(--gold); outline-offset:2px; }

.contact-faq { display:grid; grid-template-columns:minmax(15rem,.35fr) minmax(0,.65fr); gap:clamp(3rem,8vw,8rem); border-top:1px solid rgba(11,11,11,.15); }
.contact-faq-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:rgba(11,11,11,.18); border:1px solid rgba(11,11,11,.18); }
.contact-faq-grid article { min-height:15rem; padding:1.5rem; background:var(--paper); }
.contact-faq-grid h3 { margin-bottom:.8rem; font:1.6rem var(--font-display); }
.contact-faq-grid p { color:#625b52; }

.conversation-closing { display:grid; grid-template-columns:minmax(0,.68fr) minmax(16rem,.32fr); gap:clamp(3rem,8vw,8rem); align-items:end; border-top:1px solid rgba(11,11,11,.15); }
.conversation-closing h2 { max-width:13ch; }
.conversation-closing .button { margin-top:1.5rem; }

@media (max-width: 62rem) {
  .conversation-card-grid { grid-template-columns:1fr; }
  .conversation-card { min-height:26rem; }
  .contact-message-section, .contact-faq, .conversation-closing { grid-template-columns:1fr; }
  .contact-message-copy { position:static; }
}
@media (max-width: 40rem) {
  .topic-choice-grid, .contact-faq-grid { grid-template-columns:1fr; }
  .conversation-card { min-height:23rem; }
}