/* Contact pages reuse the news hero and customer account components. */
.r27-contact-page { background: var(--r27-soft); }
.r27-contact-hero::after { content: 'CONTACT'; }
.r27-contact-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
    align-items: stretch;
    padding-top: 42px;
    padding-bottom: 72px;
}
.r27-contact-layout > * { min-width: 0; }
.r27-contact-intro {
    margin: 0 0 26px !important;
    color: var(--r27-muted);
    font-size: .82rem;
    line-height: 1.85;
}
.r27-contact-details { margin: 0 0 28px; }
.r27-contact-details > div { padding: 14px 0; border-bottom: 1px solid var(--r27-line); }
.r27-contact-details > div:first-child { padding-top: 0; }
.r27-contact-details dt { margin-bottom: 5px; color: var(--r27-muted); font-size: .7rem; font-weight: 500; }
.r27-contact-details dd { margin: 0; color: var(--r27-ink); font-size: .82rem; line-height: 1.75; overflow-wrap: anywhere; }
.r27-contact-details a { color: var(--r27-gold-dark); font-weight: 500; }
.r27-contact-details a:hover { color: var(--r27-ink); text-decoration: underline; }
.r27-contact-divider { color: var(--r27-muted); }
.r27-contact-map { overflow: hidden; border: 1px solid var(--r27-line); border-radius: var(--r27-radius); background: var(--r27-soft); }
.r27-contact-map iframe { display: block; width: 100% !important; max-width: 100%; height: 320px !important; border: 0; }
.r27-contact-page .r27-user-field textarea {
    display: block;
    width: 100%;
    min-height: 140px;
    padding: 12px 14px;
    border: 1px solid #dcd8d0;
    border-radius: 3px;
    background: #fff;
    color: var(--r27-ink);
    font: .78rem/1.7 'Be Vietnam Pro', Arial, sans-serif;
    resize: vertical;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.r27-contact-page .r27-user-field textarea:focus { border-color: var(--r27-gold); box-shadow: 0 0 0 3px rgba(176,151,109,.14); }
.r27-contact-page .r27-user-panel-title { margin: 0 0 25px; text-align: left; }
/* Outrank the shared shell's button reset without touching other pages. */
.r27-contact-page .r27-user-button {
    gap: 12px;
    border: 1px solid var(--r27-gold);
    background: var(--r27-gold);
    color: #fff;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.4;
}
.r27-contact-page .r27-user-button:hover {
    border-color: var(--r27-gold-dark);
    background: var(--r27-gold-dark);
    color: #fff;
}
.r27-contact-result-details { margin: 0 0 26px; text-align: left; }
.r27-contact-result-details dd { white-space: pre-wrap; }
.r27-contact-result-actions { display: flex; justify-content: center; flex-wrap: wrap; align-items: center; gap: 18px; }
/* Let the taller card define the row height and fill the form's spare space. */
@media (min-width: 992px) {
    .r27-contact-layout > .r27-user-card { display: flex; flex-direction: column; }
    .r27-contact-layout .r27-user-form {
        flex: 1;
        grid-template-rows: repeat(3, auto) minmax(0, 1fr) auto;
    }
    .r27-contact-message { display: flex; flex-direction: column; }
    .r27-contact-message textarea { flex: 1; }
    .r27-contact-map { margin-top: auto; }
}
@media (max-width: 991px) {
    .r27-contact-layout { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 767px) {
    .r27-contact-layout { padding-top: 26px; padding-bottom: 52px; }
    .r27-contact-map iframe { height: 280px !important; }
    .r27-contact-hero::after { display: none; }
}