.contacts-page {
    --contacts-green: #2a8462;
    --contacts-dark-green: #1d5d44;
    --contacts-ink: #171717;
    --contacts-muted: #626b67;
    --contacts-line: #dfe5e2;
    color: var(--contacts-ink);
    background: #fff;
}

.contacts-page *,
.contacts-page *::before,
.contacts-page *::after {box-sizing: border-box;}

.contacts-page h1,
.contacts-page h2,
.contacts-page p {margin-top: 0;}

.contacts-hero {
    max-width: 1170px;
    min-height: 540px;
    margin: 0 auto;
    padding: 54px 15px 64px;
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(480px, 7fr);
    gap: 62px;
    align-items: stretch;
}

.contacts-hero__content {align-self: center;}

.contacts-hero h1 {
    max-width: 520px;
    margin-bottom: 18px;
    font-size: clamp(42px, 4vw, 62px);
    line-height: .98;
    letter-spacing: -2.5px;
    font-weight: 700;
}

.contacts-hero__lead {
    max-width: 500px;
    margin-bottom: 36px;
    color: var(--contacts-muted);
    font-size: 18px;
    line-height: 1.55;
}

.contacts-actions {border-top: 1px solid var(--contacts-line);}

.contacts-action {
    min-height: 91px;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    border-bottom: 1px solid var(--contacts-line);
}

.contacts-action__icon,
.contacts-detail__icon {
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: var(--contacts-green);
    background: #edf6f2;
}

.contacts-action__icon {width: 54px; height: 54px;}
.contacts-action__icon svg {width: 24px; height: 24px; fill: currentColor;}
.contacts-action__label {display: block; margin-bottom: 2px; color: var(--contacts-muted); font-size: 12px;}
.contacts-action__value {color: var(--contacts-ink); font-size: 20px; font-weight: 600; text-decoration: none;}
.contacts-action__link {color: var(--contacts-dark-green); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap;}
.contacts-action__link:hover {text-decoration: underline;}

.contacts-primary-button,
.contacts-cta__button {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--contacts-green);
    border-radius: 27px;
    background: var(--contacts-green);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: background-color .2s, border-color .2s, transform .2s;
}

.contacts-primary-button {margin-top: 30px; padding: 0 25px;}
.contacts-primary-button:hover,
.contacts-cta__button:hover {background: var(--contacts-dark-green); border-color: var(--contacts-dark-green); color: #fff; transform: translateY(-1px);}

.contacts-map {
    min-height: 420px;
    overflow: hidden;
    border: 1px solid var(--contacts-line);
    border-radius: 14px;
    background: #f2f5f3;
    box-shadow: 0 18px 45px rgba(20, 55, 40, .12);
}

.contacts-map > ymaps,
.contacts-map > div,
.contacts-map iframe {width: 100% !important; height: 100% !important; min-height: 420px;}

.contacts-details {
    padding: 38px max(15px, calc((100vw - 1140px) / 2));
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: #f7f7f7;
    border-top: 1px solid var(--contacts-line);
    border-bottom: 1px solid var(--contacts-line);
}

.contacts-detail {
    min-height: 152px;
    padding: 8px 34px;
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 18px;
    align-items: start;
}

.contacts-detail + .contacts-detail {border-left: 1px solid var(--contacts-line);}
.contacts-detail__icon {width: 48px; height: 48px;}
.contacts-detail__icon svg {width: 23px; height: 23px; fill: currentColor;}
.contacts-detail h2 {margin-bottom: 9px; font-size: 17px; line-height: 1.25;}
.contacts-detail p,
.contacts-detail address {margin: 0 0 12px; color: #343b38; font-size: 14px; line-height: 1.55; font-style: normal;}
.contacts-detail a {color: var(--contacts-dark-green); font-size: 13px; font-weight: 600; text-decoration: none;}
.contacts-detail a:hover {text-decoration: underline;}

.contacts-cta {
    max-width: 1140px;
    margin: 70px auto;
    padding: 42px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    border-radius: 14px;
    background: var(--contacts-dark-green);
    color: #fff;
}

.contacts-cta h2 {margin-bottom: 9px; font-size: 31px; line-height: 1.15;}
.contacts-cta p {max-width: 650px; margin-bottom: 0; color: rgba(255,255,255,.78); font-size: 15px; line-height: 1.55;}
.contacts-cta__button {min-width: 245px; padding: 0 24px; border-color: #fff; background: #fff; color: var(--contacts-dark-green);}

@media (max-width: 1000px) {
    .contacts-hero {grid-template-columns: 1fr 1.15fr; gap: 34px; padding-top: 42px;}
    .contacts-action {grid-template-columns: 48px minmax(0, 1fr); gap: 14px;}
    .contacts-action__link {grid-column: 2; margin-top: -13px; padding-bottom: 12px;}
    .contacts-action__icon {width: 48px; height: 48px;}
    .contacts-details {grid-template-columns: 1fr; padding-top: 18px; padding-bottom: 18px;}
    .contacts-detail {min-height: auto; padding: 24px 15px;}
    .contacts-detail + .contacts-detail {border-left: 0; border-top: 1px solid var(--contacts-line);}
    .contacts-cta {margin: 50px 30px;}
}

@media (max-width: 700px) {
    .contacts-hero {min-height: 0; padding: 34px 15px 48px; grid-template-columns: 1fr; gap: 34px;}
    .contacts-hero h1 {font-size: 39px; letter-spacing: -1.6px;}
    .contacts-hero__lead {font-size: 16px; margin-bottom: 28px;}
    .contacts-action__value {font-size: 18px;}
    .contacts-primary-button {width: 100%;}
    .contacts-map {min-height: 360px; border-radius: 10px;}
    .contacts-map > ymaps,
    .contacts-map > div,
    .contacts-map iframe {min-height: 360px;}
    .contacts-cta {margin: 38px 15px; padding: 32px 24px; align-items: stretch; flex-direction: column; gap: 24px;}
    .contacts-cta h2 {font-size: 27px;}
    .contacts-cta__button {width: 100%; min-width: 0;}
}

@media (max-width: 390px) {
    .contacts-hero h1 {font-size: 34px;}
    .contacts-action {grid-template-columns: 44px minmax(0, 1fr);}
    .contacts-action__icon {width: 44px; height: 44px;}
    .contacts-action__value {font-size: 16px;}
    .contacts-map {min-height: 310px;}
    .contacts-map > ymaps,
    .contacts-map > div,
    .contacts-map iframe {min-height: 310px;}
}

@media (prefers-reduced-motion: reduce) {
    .contacts-primary-button,
    .contacts-cta__button {transition: none;}
}
