.channels { display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: 64px; padding-top: 80px; padding-bottom: 96px; scroll-margin-top: 90px; }
.channels__eyebrow { color: var(--soft); text-transform: uppercase; letter-spacing: .12em; font-size: 12px; margin-bottom: 16px; }
.channels h2 { font-size: clamp(30px, 3.2vw, 42px); line-height: 1.15; font-weight: 500; letter-spacing: -.035em; margin-bottom: 20px; }
.channels__intro { color: var(--soft); font-size: 16px; }
.channels__list { display: grid; gap: 22px; margin: 30px 0; }
.channels__list li { display: flex; align-items: flex-start; gap: 16px; }
.channels__icon { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line-2); border-radius: 12px; }
.channels__icon svg { width: 25px; height: 25px; }
.channels__icon--mail, .channels__icon--phone { color: var(--text); background: var(--hover); }
.channels__list h3 { font-size: 15px; font-weight: 600; margin-bottom: 3px; }
.channels__list p { color: var(--soft); font-size: 14px; line-height: 1.55; }
.channels__number { font-size: 12px; color: var(--soft); margin-top: 12px; }
.channels__media { min-width: 0; }
.channels__bar { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-2); border-bottom: 0; border-radius: 14px 14px 0 0; padding: 14px 16px; background: var(--raise); font-size: 12px; }
.channels__bar > span:last-child { margin-left: auto; color: var(--soft); }
.channels__dot { width: 6px; height: 6px; border-radius: 50%; background: #b4c58b; }
.channels video { display: block; width: 100%; height: auto; aspect-ratio: 1724/1220; border: 1px solid var(--line-2); border-radius: 0 0 14px 14px; background: #101419; }
.channels figcaption { margin-top: 18px; font-size: 14px; color: var(--soft); }
.channels__open { display: inline-block; font-size: 13px; margin-top: 12px; text-underline-offset: 4px; }
.channels__retry { margin: 12px 12px 0 0; padding: 8px 14px; background: #b4c58b; color: #172018; border: 0; border-radius: 8px; }
@media(max-width: 900px) { .channels { gap: 32px; grid-template-columns: 1fr 1fr; } }
@media(max-width: 700px) { .channels { grid-template-columns: 1fr; gap: 36px; padding-top: 48px; padding-bottom: 56px; } }
