/* ============================================================
   Wolvex — Contact page
   ============================================================ */
.page-contact .contact-page {
    padding: var(--space-8) 0 var(--space-16);
}

.contact-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}

.contact-form-card h1 {
    font-family: var(--font-display);
    font-size: var(--fs-xxl);
    color: var(--navy);
    margin-bottom: var(--space-3);
}

.contact-lead {
    color: var(--ink-soft);
    max-width: 55ch;
    margin-bottom: var(--space-6);
}

/* Honeypot — hidden from sighted users, present for bots to fill in */
.hp-field {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.contact-details {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.contact-detail-card {
    background: var(--cream);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
}

.contact-detail-card h2 {
    font-size: var(--fs-lg);
    margin-bottom: var(--space-3);
}

.contact-detail-card p {
    color: var(--ink-soft);
    margin-bottom: var(--space-4);
}

.contact-detail-card .btn {
    margin-bottom: var(--space-3);
}

.contact-detail-card address {
    font-style: normal;
    color: var(--ink);
    margin-bottom: var(--space-3);
    line-height: 1.6;
}

@media (min-width: 900px) {
    .contact-layout {
        grid-template-columns: 1.4fr 1fr;
    }
}