/* AVE Design Studio — страница «Контакты»: как нас найти и фото офиса */

.ave-ct {
    --ct-red: #c80000;
    --ct-ink: #17181d;
    --ct-text: #3b3e47;
    --ct-muted: #6f7380;
    --ct-line: #e3e5ea;
    --ct-soft: #f5f6f8;
    padding: 90px 0;
    color: var(--ct-text);
    font-family: 'Open Sans', Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
.ave-ct--find { padding-bottom: 0; }
.ave-ct--soft { background: var(--ct-soft); }
.ave-ct *,
.ave-ct *::before,
.ave-ct *::after { box-sizing: border-box; }
.ave-ct :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
.ave-ct :where(li) { margin: 0; padding: 0; }
.ave-ct :where(li)::before { content: none; }
.ave-ct :where(p, figure) { margin: 0; }

.ave-ct__head { max-width: 760px; margin: 0 0 40px; }
.ave-ct__kicker {
    display: inline-block;
    margin: 0 0 12px;
    color: var(--ct-red);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.ave-ct__title {
    margin: 0 0 14px;
    padding: 0;
    color: var(--ct-ink);
    font: 800 34px/1.18 'Open Sans', Arial, sans-serif;
    letter-spacing: -.015em;
    text-transform: none;
}
.ave-ct__lead { color: var(--ct-muted); font-size: 17px; line-height: 1.6; }
.ave-ct__lead a { color: var(--ct-red); font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(200, 0, 0, .3); }
.ave-ct__lead a:hover { color: #a90000; border-bottom-color: currentColor; }

/* ---------- Как нас найти ---------- */

.ave-ct-find { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 52px; align-items: center; }
.ave-ct-hero { position: relative; }
.ave-ct-hero a { display: block; overflow: hidden; border-radius: 18px; background: var(--ct-line); box-shadow: 0 24px 60px rgba(23, 24, 29, .16); }
.ave-ct-hero img { display: block; width: 100%; height: auto; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.ave-ct-hero a:focus-visible { outline: 2px solid var(--ct-red); outline-offset: 3px; }
.ave-ct-hero__chip {
    position: absolute;
    left: 18px;
    bottom: 18px;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    padding: 9px 16px 9px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 8px 24px rgba(23, 24, 29, .18);
    color: var(--ct-ink);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    pointer-events: none;
}
.ave-ct-hero__chip svg { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--ct-red); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

.ave-ct-find__text .ave-ct__title { margin-bottom: 22px; }
.ave-ct-steps { counter-reset: ct-step; }
.ave-ct-steps li { position: relative; padding: 14px 0 14px 46px; border-top: 1px solid var(--ct-line); font-size: 15px; line-height: 1.6; counter-increment: ct-step; }
.ave-ct-steps li:last-child { border-bottom: 1px solid var(--ct-line); }
.ave-ct-steps li::before {
    content: counter(ct-step);
    position: absolute;
    left: 0;
    top: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--ct-ink);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}
.ave-ct-steps b { color: var(--ct-ink); }

.ave-ct-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.ave-ct-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 22px;
    border: 1px solid var(--ct-line);
    border-radius: 12px;
    background: #fff;
    color: var(--ct-ink);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease;
}
.ave-ct-btn:hover,
.ave-ct-btn:focus { color: var(--ct-ink); text-decoration: none; border-color: rgba(200, 0, 0, .4); }
.ave-ct-btn:focus-visible { outline: 2px solid var(--ct-red); outline-offset: 2px; }
.ave-ct-btn--primary { border-color: var(--ct-red); background: var(--ct-red); color: #fff; }
.ave-ct-btn--primary:hover,
.ave-ct-btn--primary:focus { border-color: #a90000; background: #a90000; color: #fff; }

/* ---------- До встречи в офисе ---------- */

.ave-ct .ave-ct-bento { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; }
.ave-ct .ave-ct-bento > li { display: block; margin: 0; min-height: 0; }
.ave-ct .ave-ct-bento__main { grid-row: span 2; aspect-ratio: 1024 / 579; }

.ave-ct .ave-ct-ph { position: relative; display: block; width: 100%; height: 100%; overflow: hidden; border-radius: 16px; background: var(--ct-line); }
.ave-ct-ph img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.ave-ct-ph__cap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 40px 18px 15px;
    background: linear-gradient(180deg, rgba(23, 24, 29, 0), rgba(23, 24, 29, .8));
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    pointer-events: none;
}
.ave-ct-bento__main .ave-ct-ph__cap { padding: 60px 26px 22px; color: rgba(255, 255, 255, .78); font-size: 14px; font-weight: 400; }
.ave-ct-ph__cap b { display: block; margin-bottom: 2px; color: #fff; font-size: 20px; font-weight: 800; line-height: 1.25; }
.ave-ct-ph:focus-visible { outline: 2px solid var(--ct-red); outline-offset: 3px; }

@media (hover: hover) {
    .ave-ct-hero a:hover img,
    .ave-ct-ph:hover img { transform: scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
    .ave-ct-hero img,
    .ave-ct-ph img,
    .ave-ct-btn { transition: none; }
    .ave-ct-hero a:hover img,
    .ave-ct-ph:hover img { transform: none; }
}

/* ---------- Адаптив ---------- */

@media (max-width: 1199px) {
    .ave-ct-find { gap: 36px; }
    .ave-ct__title { font-size: 30px; }
}
@media (max-width: 991px) {
    .ave-ct { padding: 70px 0; }
    .ave-ct--find { padding-bottom: 0; }
    .ave-ct-find { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 767px) {
    .ave-ct { padding: 56px 0; }
    .ave-ct--find { padding: 44px 0 0; }
    .ave-ct__head { margin-bottom: 26px; }
    .ave-ct__title { font-size: 26px; }
    .ave-ct__lead { font-size: 15px; }
    .ave-ct-find { gap: 26px; }
    .ave-ct-hero a { border-radius: 14px; }
    .ave-ct-hero__chip { left: 12px; bottom: 12px; padding: 7px 13px 7px 10px; font-size: 12px; }
    .ave-ct-steps li { padding-left: 42px; font-size: 14px; }
    .ave-ct-actions { flex-direction: column; }
    .ave-ct-btn { width: 100%; }
    .ave-ct .ave-ct-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; gap: 8px; }
    .ave-ct .ave-ct-bento__main { grid-column: span 2; grid-row: auto; }
    .ave-ct .ave-ct-bento > li:not(.ave-ct-bento__main) { aspect-ratio: 4 / 3; }
    .ave-ct .ave-ct-ph { border-radius: 12px; }
    .ave-ct-bento__main .ave-ct-ph__cap { padding: 40px 16px 14px; font-size: 13px; }
    .ave-ct-ph__cap b { font-size: 17px; }
    .ave-ct-ph__cap { padding: 28px 12px 10px; font-size: 12px; }
}