/*
 * Блок contacts (blocks/contacts.php): четыре карточки-ссылки со способами связи и широкая карточка офиса под ними.
 */

.contacts__head { max-width: 860px; margin-bottom: 40px; }
.contacts__title { color: var(--c-ink); font-size: 48px; font-weight: 700; line-height: 1.1; letter-spacing: -.04em; }
.contacts__lead { margin-top: 20px; color: var(--c-muted); font-size: 20px; line-height: 1.6; }
.contacts__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.contact {
    display: grid; gap: 6px; height: 100%; padding: 30px; border: 1px solid var(--c-line); border-radius: 24px; background: #fff;
    color: var(--c-ink); transition: border-color .15s ease, background-color .15s ease;
}
.contact:hover { border-color: var(--c-primary); background: #f7faff; color: var(--c-ink); }
.contact__ico { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 12px; border-radius: 16px; background: var(--c-soft); color: var(--c-primary); }
.contact__ico .ico { width: 26px; height: 26px; }
.contact__ico img { width: 28px; height: 28px; object-fit: contain; }
.contact__label { color: var(--c-muted); font-size: 15px; }
.contact__value { font-size: 20px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
/* офис: на всю ширину сетки — значок, адрес, график справа */
.contacts__office { grid-column: 1 / -1; }
.contact--office { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 24px; }
.contact--office .contact__ico { margin-bottom: 0; }
.contact__main { display: grid; gap: 6px; }
.contact__hours { display: inline-flex; align-items: center; gap: 10px; color: var(--c-muted); font-size: 16px; white-space: nowrap; }
.contact__hours .ico { width: 20px; height: 20px; color: var(--c-primary); }
.contacts__note { margin-top: 28px; color: var(--c-muted); font-size: 17px; }

@media (max-width: 1024px) { .contacts__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
    .contacts__title { font-size: var(--fs-h2-m); }
    .contacts__grid { grid-template-columns: 1fr; gap: 14px; }
    .contact { padding: 22px; }
    .contact--office { grid-template-columns: 1fr; gap: 6px; }
    .contact--office .contact__ico { margin-bottom: 12px; }
    .contact__hours { margin-top: 6px; white-space: normal; }
}