/* ============================================================
   PROJECT PAGE — уровень B/C
   Anna Gorodetskaya — Portfolio · 26 августа 2026

   Грузится ПОСЛЕ case.css и только добавляет к нему. Хром общий:
   шапка, блоки, рейка метаданных, дыры аудита — всё то же самое,
   что у уровня A. Разница ровно в двух вещах, и обе структурные:

   1. Герой не уходит в bleed. Полосный кадр во всю ширину — это
      подпись уровня A; здесь кадр живёт внутри сетки.
   2. Текст идёт одной колонкой более узкой мерой, без левой
      рейки ярлыков на каждый блок: у B/C два-три абзаца подряд,
      и ярлык над каждым читался бы как оглавление к абзацу.

   Бейджа «level B» нет намеренно. Иерархия должна читаться
   раскладкой; подписанная словами, она превращается в извинение.
   ============================================================ */

/* ------------------------------------------------------------
   ШАПКА
   ------------------------------------------------------------ */

.brief__head { padding-bottom: var(--s-5); }

/* ------------------------------------------------------------
   ГЕРОЙ — в сетке, не в полосе
   ------------------------------------------------------------ */

.brief__hero { margin-bottom: var(--s-8); }

.brief__hero-gap {
  margin-bottom: var(--s-8);
  aspect-ratio: auto;
  height: clamp(140px, 16vw, 240px);
}

/* ------------------------------------------------------------
   ТЕКСТ
   Подводка из 05_COPY стоит декой под заголовком — на месте
   oneLine, а не отдельным крупным абзацем ниже. Обе строки
   говорят одно: oneLine написан для карточки в стене, lead для
   страницы. Напечатанные подряд, они читались повтором.
   ------------------------------------------------------------ */

.brief__lead { max-width: 52ch; }

.brief__overview p { color: var(--ink-80); }
.brief__overview p + p { margin-top: var(--s-3); }

/* ------------------------------------------------------------
   MY ROLE
   §5 спецификации: самый важный блок на любой странице проекта.
   На уровне A он выделен крупным кеглем; здесь текста меньше и
   он почти всегда список, поэтому вес держит акцентная кромка.
   ------------------------------------------------------------ */

.brief__role-list {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  max-width: 52ch;
}

.brief__role-list li {
  padding-left: var(--s-3);
  border-left: 2px solid var(--accent);
  color: var(--ink);
  line-height: var(--lh-snug);
}

/* world-cannabis-tour: в исходном документе роль написана прозой,
   а не списком. Схема допускает оба вида, и абзац не притворяется
   списком из одного пункта. */
.brief__role-prose {
  color: var(--ink);
  max-width: 60ch;
}

/* ------------------------------------------------------------
   RESULT
   ------------------------------------------------------------ */

.brief__result p {
  color: var(--ink);
  max-width: 58ch;
}

/* ------------------------------------------------------------
   АДАПТИВ
   ------------------------------------------------------------ */

@media (max-width: 720px) {
  .brief__lead { max-width: none; }
}

/* ------------------------------------------------------------
   ВОЗВРАТ В КАТАЛОГ
   ------------------------------------------------------------ */

.brief__back-wall {
  padding-block: var(--s-8);
  margin-top: var(--s-8);
  border-top: 1px solid var(--ink);
}

.brief__back-link {
  font-size: var(--fs-head);
  font-family: var(--font-display);
  font-variation-settings: "wdth" 104, "wght" 620;
  letter-spacing: var(--ls-head);
  line-height: var(--lh-snug);
}