/* Страница «О студии» (/about/, /ru/about/): компактная раскладка как у dissembargo.com/info, тёмная тема сайта.
   Разметку собирает scripts/about.mjs; шапка, кнопки и подвал — из daruma-blog.css, переключатель языка — из daruma-lang.css. */

/* цвета, фон (#0b0b0b) и зерно — общие со всем сайтом (daruma-blog.css); здесь только то, что свойственно этой странице */
body.da {
  --da-line: #4a4a46;
}

.da-main { padding: 0 var(--db-side); }
.da-hero { padding: clamp(72px, 14vw, 200px) 0 clamp(40px, 5vw, 56px); }
.da-lead { margin: 0; font-size: clamp(21px, 2vw, 28px); line-height: 1.25; letter-spacing: -.02em; font-weight: 400; }
.da-lead strong { font-weight: 700; }

.da-cols { display: grid; grid-template-columns: 196fr 392fr 267fr; gap: 32px 0; padding: 32px 0 40px; border-top: 1px solid var(--da-line); border-bottom: 1px solid var(--da-line); }
.da-label { margin: 0 0 20px; font-size: 13px; font-weight: 400; letter-spacing: .02em; text-transform: uppercase; color: var(--db-fg); }
.da-list { list-style: none; margin: 0; padding: 0; }
.da-list li { font-size: 16px; line-height: 1.5; }
.da-list li:nth-child(odd) { font-weight: 700; }
.da-clients-col { padding-right: 32px; }
.da-clients { margin: 0; max-width: 420px; font-size: 16px; line-height: 1.5; }
.da-clients span:nth-child(even) { font-weight: 700; }

.da-mail { font-size: 20px; font-weight: 700; letter-spacing: -.01em; color: var(--db-fg); text-decoration: none; border-bottom: 1px solid var(--db-fg); padding-bottom: 1px; word-break: break-word; transition: color .2s ease, border-color .2s ease; }
.da-mail:hover { color: var(--db-red); border-color: var(--db-red); }
.da-mail--small { font-size: 16px; }

.da-team { padding: 40px 0 56px; border-bottom: 1px solid var(--da-line); }
.da-team__lead { margin: 0 0 36px; max-width: 460px; font-size: clamp(20px, 1.8vw, 26px); line-height: 1.2; letter-spacing: -.02em; font-weight: 400; text-wrap: balance; }
.da-team__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.da-team__grid img { display: block; width: 100%; height: auto; border-radius: 4px; }
.da-team__grid b { display: block; margin-top: 14px; font-size: 16px; font-weight: 700; line-height: 1.3; }
.da-team__grid span { display: block; margin-top: 4px; font-size: 15px; line-height: 1.4; color: var(--db-faint); }

.da-awards { padding: 40px 0 56px; border-bottom: 1px solid var(--da-line); }
.da-awards .da-label { margin-bottom: 28px; }
.da-awards__row { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 20px; }
.da-awards__row img { display: block; width: 88px; height: 88px; opacity: .85; transition: opacity .2s ease; }
.da-awards__row img:hover { opacity: 1; }

.da-careers { display: grid; grid-template-columns: 588fr 267fr; gap: 32px 0; padding: 40px 0 clamp(80px, 12vw, 160px); }
.da-careers__title { margin: 0; max-width: 460px; font-size: clamp(20px, 1.8vw, 26px); line-height: 1.2; letter-spacing: -.02em; font-weight: 400; text-wrap: balance; }
.da-careers__label { margin: 0 0 6px; font-size: 16px; font-weight: 700; }
.da-careers__text { margin: 0 0 10px; font-size: 15px; line-height: 1.55; }

@media (max-width: 760px) {
  .da-cols, .da-careers { grid-template-columns: minmax(0, 1fr); }
  .da-team__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; }
  .da-team__grid b { font-size: 15px; }
  .da-team__grid span { font-size: 13px; }
  .da-clients-col { padding-right: 0; }
  .da-awards__row { gap: 14px; }
  .da-awards__row img { width: 72px; height: 72px; }
}