/* Contact page (templates/contact.html). Shared styles in site.css. */

.contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--s-4);
}

@media (min-width: 768px) {
    .contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); }
    .contact-card-wide, .contact-card-full { grid-column: 1 / -1; }
}

@media (min-width: 1200px) {
    .contact-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .contact-card-wide { grid-column: span 2; }
    .contact-card-email { grid-column: auto; }
}

.contact-card-wide p { font-size: var(--fs-md); line-height: 1.7; color: var(--ink-2); }

.contact-card-email {
    background: var(--green-900);
    border-color: var(--green-900);
    color: rgba(255, 255, 255, 0.78);
}

.contact-card-email .info-card-title { color: #fff; }
.contact-card-email p { color: rgba(255, 255, 255, 0.78); }
.contact-card-email .info-card-icon { background: rgba(255, 255, 255, 0.1); color: var(--leaf); }

.contact-email a {
    font-family: var(--font-display);
    font-size: var(--fs-lg);
    font-weight: 700;
    color: #fff;
    overflow-wrap: anywhere;
}

.contact-email a:hover { color: var(--leaf-100); }

@media (min-width: 768px) {
    .contact-card-full { flex-direction: row; align-items: center; gap: var(--s-4); }
}