/* «О проекте» page (partials/sections/pages/contacts.html) */

.ab {--ab-ink: #1D1D1F; --ab-muted: #6B7280; --ab-line: #E9EBF0; --ab-bg: #F5F6F8; --ab-red: #EB3752; --ab-dark: #14161B; color: var(--ab-ink); font-size: 16px; line-height: 1.55; padding-top: 64px;}
.ab * {box-sizing: border-box;}
.ab p {margin: 0 0 14px;}
.ab_wrap {max-width: 1180px; margin: 0 auto; padding: 0 30px;}

/* hero */
.ab_hero {position: relative; color: #fff; padding: 96px 0 0;}
.ab_hero_bg {position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,12,16,.55) 0%, rgba(10,12,16,.75) 100%), url('/images/contacts1.jpg') center 40% / cover no-repeat;}
.ab_hero_in {position: relative; max-width: 1180px; padding-bottom: 72px;}
.ab_eyebrow {display: inline-block; padding: 6px 12px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 20px;}
.ab_h1 {font-size: 46px; line-height: 1.12; font-weight: 800; letter-spacing: -.02em; margin: 0 0 18px; max-width: 760px; color: #fff;}
.ab_lead {font-size: 18px; line-height: 1.55; color: rgba(255,255,255,.88); max-width: 640px; margin-bottom: 28px;}
.ab_hero_btns {display: flex; gap: 12px; flex-wrap: wrap;}
.ab_btn {display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 52px; padding: 0 26px; border-radius: 14px; font-size: 15px; font-weight: 700; text-decoration: none; transition: background .15s, transform .1s, box-shadow .15s;}
.ab_btn_main {background: var(--ab-red); color: #fff !important; box-shadow: 0 8px 20px rgba(235,55,82,.3);}
.ab_btn_main:hover {background: #D62E48;}
.ab_btn_main:active {transform: translateY(1px);}
.ab_btn_ghost {background: rgba(255,255,255,.12); color: #fff !important; border: 1px solid rgba(255,255,255,.35); backdrop-filter: blur(6px);}
.ab_btn_ghost:hover {background: rgba(255,255,255,.2);}
.ab_btn_ghost .icon {color: #fff;}
.ab_stats {position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; transform: translateY(44px); margin-top: -8px;}
.ab_stat {background: #fff; color: var(--ab-ink); border-radius: 18px; padding: 20px 22px; box-shadow: 0 12px 34px rgba(17,24,39,.14);}
.ab_stat b {display: block; font-size: 28px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; margin-bottom: 6px; font-variant-numeric: tabular-nums;}
.ab_stat span {font-size: 13px; color: var(--ab-muted); line-height: 1.4; display: block;}

/* sections */
.ab_section {padding: 64px 0;}
.ab_hero + .ab_section {padding-top: 112px;}
.ab_section_gray {background: var(--ab-bg);}
.ab_section_dark {background: var(--ab-dark); color: #E6E8EC;}
.ab_section_dark .ab_h2 {color: #fff;}
.ab_h2 {font-size: 32px; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; margin: 0 0 28px;}

.ab_steps {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;}
.ab_step {position: relative; padding: 26px 24px 20px; border: 1px solid var(--ab-line); border-radius: 18px; background: #fff;}
.ab_step_num {width: 40px; height: 40px; border-radius: 12px; background: var(--ab-red); color: #fff; font-size: 17px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-bottom: 16px;}
.ab_step_title {font-size: 18px; font-weight: 700; margin-bottom: 8px;}
.ab_step p {color: var(--ab-muted); font-size: 15px; margin: 0;}

.ab_grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;}
.ab_card {background: #fff; border-radius: 18px; padding: 24px; border: 1px solid var(--ab-line); transition: transform .2s, box-shadow .2s;}
.ab_card:hover {transform: translateY(-2px); box-shadow: 0 12px 30px rgba(17,24,39,.08);}
.ab_card_icon {width: 44px; height: 44px; border-radius: 12px; background: #FFF1F3; color: var(--ab-red); display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 800; margin-bottom: 14px;}
.ab_card_icon .icon {font-size: 18px;}
.ab_card_title {font-size: 17px; font-weight: 700; margin-bottom: 6px;}
.ab_card p {color: var(--ab-muted); font-size: 15px; margin: 0;}

.ab_split {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center;}
.ab_split_rev .ab_split_img {order: 2;}
.ab_split_img {border-radius: 22px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--ab-bg);}
.ab_split_img img {width: 100%; height: 100%; object-fit: cover; display: block;}
.ab_split_text p {color: var(--ab-muted); font-size: 16px;}
.ab_section_dark .ab_split_text p {color: #B7BCC6;}
.ab_split_text .ab_h2 {margin-bottom: 16px;}
.ab_link {display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; color: var(--ab-ink); font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--ab-red); padding-bottom: 2px;}
.ab_link .icon {font-size: 11px;}
.ab_link:hover {color: var(--ab-red);}
.ab_list {list-style: none; margin: 4px 0 24px; padding: 0; display: grid; gap: 10px;}
.ab_list li {position: relative; padding-left: 28px; color: #E6E8EC; font-size: 15px;}
.ab_list li::before {content: ''; position: absolute; left: 2px; top: 6px; width: 12px; height: 7px; border-left: 2px solid var(--ab-red); border-bottom: 2px solid var(--ab-red); transform: rotate(-45deg);}

/* contacts */
.ab_contacts {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start;}
.ab_contacts_card {background: #fff; border: 1px solid var(--ab-line); border-radius: 22px; padding: 30px 32px;}
.ab_contacts_card .ab_h2 {margin-bottom: 22px;}
.ab_contact {display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; border-top: 1px solid var(--ab-line);}
.ab_contact:first-of-type {border-top: 0; padding-top: 0;}
.ab_contact_icon {flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; background: var(--ab-bg); color: var(--ab-red); display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 800;}
.ab_contact_label {font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ab-muted); margin-bottom: 3px;}
.ab_contact_value {font-size: 17px; font-weight: 600; color: var(--ab-ink); text-decoration: none; line-height: 1.4;}
a.ab_contact_value:hover {color: var(--ab-red);}
.ab_messengers {display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px;}
.ab_msg {display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--ab-line); color: var(--ab-ink); font-size: 14px; font-weight: 600; text-decoration: none; transition: border-color .15s, background .15s;}
.ab_msg .icon {color: var(--ab-red);}
.ab_msg:hover {border-color: var(--ab-ink); background: var(--ab-bg); color: var(--ab-ink);}
.ab_contacts_form .lead_form {max-width: none; margin: 0; padding: 30px 32px; border-radius: 22px;}
.ab_contacts_form .lead_form_title {font-size: 24px;}

@media screen and (max-width: 1100px) {
	.ab_stats {grid-template-columns: repeat(2, minmax(0, 1fr));}
	.ab_grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
	.ab_split {gap: 28px;}
}

@media screen and (max-width: 800px) {
	.ab {padding-top: 114px; font-size: 15px;}
	.ab_wrap {padding: 0 16px;}
	.ab_hero {padding-top: 48px;}
	.ab_hero_in {padding-bottom: 40px;}
	.ab_h1 {font-size: 30px;}
	.ab_lead {font-size: 16px;}
	.ab_hero_btns .ab_btn {flex: 1 1 100%;}
	.ab_stats {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; transform: translateY(28px);}
	.ab_stat {padding: 16px; border-radius: 14px;}
	.ab_stat b {font-size: 22px;}
	.ab_stat span {font-size: 12px;}
	.ab_section {padding: 40px 0;}
	.ab_hero + .ab_section {padding-top: 72px;}
	.ab_h2 {font-size: 24px; margin-bottom: 18px;}
	.ab_steps, .ab_grid {grid-template-columns: 1fr; gap: 12px;}
	.ab_step, .ab_card {padding: 20px;}
	.ab_split {grid-template-columns: 1fr; gap: 20px;}
	.ab_split_rev .ab_split_img {order: 0;}
	.ab_contacts {grid-template-columns: 1fr;}
	.ab_contacts_card, .ab_contacts_form .lead_form {padding: 22px 18px;}
	.ab_contact_value {font-size: 16px;}
}