/* ============================================================
   Страница «Контакты» (page-contacts.php)
   Figma: contacts-v1 (1440×2153) + contacts-mobile (390×2083) + contacts-tile (520×434)
   ============================================================ */

.cont-page{background:var(--bg)}

/* ---------- hero: eyebrow + display-заголовок (Figma contacts-v1) ---------- */
.cont-hero{padding:176px var(--pad) 0;background:var(--bg)}
.cont-hero__eyebrow{font-size:16px;color:var(--gray);margin-bottom:20px}
.cont-hero__title{color:var(--text)}
.cont-g{color:var(--green)}

@media(max-width:900px){
	.cont-hero{padding:132px var(--pad) 0}
}

/* ---------- form-cta на контактах: своя композиция (Figma contacts-v1: форма 593px слева,
   контакты в средней колонке x≈677, правая треть пустая),
   партиал template-parts/form-cta.php не редактируем — перекрываем стилями ---------- */
.cont-page .form-cta{padding-top:64px}
.cont-page .form-cta .section__grid{grid-template-columns:1fr}
.cont-page .form-cta .section__label{display:none}
.cont-page .form-cta .section__body{border-left:0;padding-left:0}
.cont-page .form-cta__grid{grid-template-columns:minmax(0,593px) 300px;gap:60px;justify-content:start}
.cont-page .form-cta .contact-left{order:2;padding-top:44px}
.cont-page .form-cta .form-right{order:1;max-width:none}
.cont-page .form-cta .form-right>h2,
.cont-page .form-cta .form-right>.sub{display:none}
.cont-page .form-cta .form-grid{margin-top:0}
/* контакты: зелёный лейбл + разделитель, значение обычным текстом (contacts-v1) */
.cont-page .form-cta .contact-item{margin-bottom:0;padding-bottom:20px;border-bottom:1px solid var(--line-strong,#D6D4D2)}
.cont-page .form-cta .contact-item + .contact-item{padding-top:20px}
.cont-page .form-cta .contact-item .lbl{color:var(--green);margin-bottom:8px}
.cont-page .form-cta .contact-item .val{font-size:18px;font-weight:400}

@media(max-width:900px){
	.cont-page .form-cta__grid{grid-template-columns:1fr}
	.cont-page .form-cta .contact-left{padding-top:0}
}

/* ---------- офис: адрес над картой + карта во всю ширину (Figma contacts-v1: divider сразу
   после формы, без доп. отступа; сама секция и карта — full-bleed, без var(--pad) на контейнере) ---------- */
.cont-office{border-top:1px solid var(--line);padding-top:24px}

/* адрес — в той же средней колонке, что телефон/email (contacts-v1: x≈677) */
.cont-office__addr{display:flex;justify-content:flex-start;padding:0 var(--pad) 0 calc(var(--pad) + 653px);margin-bottom:24px}
.cont-office__addr .inner{max-width:330px}
.cont-office__addr .lbl{font-size:16px;color:var(--green);margin-bottom:12px}
.cont-office__addr .val{font-size:16px;line-height:1.7;color:var(--text)}

/* карта-заглушка (серый фон, паттерн-сетка + пин), full-bleed до края вьюпорта —
   .cont-map лежит прямо в .cont-page/.cont-office без бокового padding у родителей */
.cont-map{position:relative;height:400px;background:#D7D7CE;overflow:hidden}
/* ч/б стилизация Яндекс.Карты: интерактивность сохраняется, цвет убираем фильтром */
.cont-map__frame{display:block;width:100%;height:100%;border:0}   /* карта цветная — правка клиента 14.08 (обесцвечивание убрано) */
.cont-map__grid{position:absolute;inset:0;background-image:
	repeating-linear-gradient(to right,rgba(44,58,43,.1) 0 1px,transparent 1px 25%),
	repeating-linear-gradient(to bottom,rgba(44,58,43,.1) 0 1px,transparent 1px 25%);
}
.cont-map__pin{position:absolute;left:50%;top:50%;width:28px;height:28px;transform:translate(-50%,-100%);background:var(--green);border-radius:50% 50% 50% 0;transform-origin:center;box-shadow:0 4px 10px rgba(0,0,0,.2)}
.cont-map__pin{transform:translate(-50%,-100%) rotate(-45deg)}
.cont-map__pin::after{content:'';position:absolute;left:50%;top:50%;width:10px;height:10px;background:var(--white);border-radius:50%;transform:translate(-50%,-50%) rotate(45deg)}
.cont-map__tip{position:absolute;left:24px;top:24px;background:var(--white);border-radius:4px;padding:10px 14px;box-shadow:0 4px 14px rgba(0,0,0,.08);font-size:13px;line-height:1.3}
.cont-map__tip strong{display:block;font-weight:500;color:var(--text);margin-bottom:2px}
.cont-map__tip span{color:var(--text-3)}

@media(max-width:900px){
	.cont-office{padding-top:32px}
	.cont-office__addr{justify-content:flex-start;padding:0 var(--pad);margin-bottom:20px}
	.cont-office__addr .inner{max-width:none}
	.cont-map{height:280px}
}

/* ---------- плитки: карьера / партнёрство / блог (Figma: сразу после карты, без отступа —
   разделяет только собственный border-top плиток) ---------- */
.cont-tiles{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

.cont-tile{position:relative;padding:56px var(--pad);border-left:1px solid var(--line);transition:background .2s}
.cont-tile:first-child{border-left:0}
.cont-tile__eyebrow{font-size:16px;color:var(--text-3);margin-bottom:22px}
.cont-tile__title{margin-bottom:12px}
.cont-tile__text{font-size:16px;line-height:1.45;color:var(--text-2);max-width:340px;margin-bottom:28px}
.cont-tile__link{display:inline-flex;align-items:center;gap:6px;font-weight:400;font-size:16px;color:var(--green);padding:7px 0;border:1px solid transparent;border-radius:4px;transition:color .2s,border-color .2s,padding .2s}
.cont-tile__link .arr{transition:transform .2s}

.cont-tile:hover{background:var(--white)}
.cont-tile:hover .cont-tile__link{color:var(--dark);border-color:var(--dark);padding:7px 14px}
.cont-tile:hover .cont-tile__link .arr{transform:translateX(3px)}

@media(max-width:900px){
	.cont-tiles{grid-template-columns:1fr}
	.cont-tile{border-left:0;border-top:1px solid var(--line);padding:32px var(--pad)}
	.cont-tile:first-child{border-top:0}
}
