/* ===== МАСТЕРСКАЯ =====
   Витрина направлений перед анкетой. Режим Persuade: человек выбирает, с чем уйдёт,
   и попадает в анкету с уже выбранным направлением (zayavka.html#код).
   Направления идут строками каталога, как «Что мы создаём» на главной: одинаковые
   карточки «иконка + заголовок + текст» в анти-референсах. Номеров у строк нет,
   порядок тут ничего не значит. Номера остались только у шагов, где он есть.
   Токены, шапка, кнопки и шаги из styles.css, хозяин и подвал из consult.css. */

.ms-hero{padding:clamp(40px,7vw,96px) 0 clamp(36px,5vw,64px)}
/* Заголовок во всю ширину над двумя колонками: рядом с блоком справа «Мастерская»
   на 1024 не помещалась и наезжала на него. */
.ms-hero__in{display:grid;gap:28px 32px;align-items:start}
@media(min-width:980px){
  .ms-hero__in{grid-template-columns:minmax(0,1fr) 320px;column-gap:clamp(40px,6vw,96px)}
  .ms-hero__title{grid-column:1 / -1}
}
.ms-hero__title{
  font-family:var(--fd);font-weight:800;text-transform:uppercase;
  font-size:clamp(40px,9vw,120px);line-height:.92;letter-spacing:-.045em
}
.ms-hero__text .lead{max-width:50ch}
.ms-hero__info{display:grid;gap:18px;align-content:start}
@media(min-width:980px){.ms-hero__info{padding-left:28px;border-left:1px solid var(--line)}}
@media(max-width:979px){.ms-hero__info{padding-top:24px;border-top:1px solid var(--line)}}

/* ── направления ─────────────────────────────────────────────────────────── */
.ms-dirs{padding:clamp(24px,4vw,56px) 0 0}
.ms-dirs__head{margin-bottom:clamp(28px,3.4vw,44px)}
.ms-dirs__head .lead{margin-top:18px}

.dir{list-style:none;border-top:1px solid var(--line)}
.dir__row{
  position:relative;display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr) auto;
  gap:clamp(14px,3vw,48px);align-items:baseline;
  padding:34px 18px 28px;
  border-bottom:1px solid var(--line);border-radius:var(--r);
  transition:background-color .25s
}
.dir__row::after{
  content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:1px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease)
}
.dir__row:hover{background:rgba(255,255,255,.04)}
.dir__row:hover::after,.dir__row:focus-visible::after{transform:scaleX(1)}
.dir__row:focus-visible{outline-offset:-2px;border-radius:var(--r)}

.dir__head{display:grid;gap:8px}
.dir__name{font-family:var(--fd);font-weight:600;font-size:var(--t-h3);letter-spacing:-.02em;line-height:1.1}
.dir__n{font-size:var(--t-label);font-weight:600;font-variant-numeric:tabular-nums;color:var(--muted);transition:color .25s}
.dir__row:hover .dir__n{color:var(--accent)}

.dir__body{display:grid;gap:10px;max-width:58ch}
.dir__res{font-size:var(--t-body);font-weight:500;line-height:1.5;color:var(--text)}
.dir__more{font-size:var(--t-small);font-weight:500;line-height:1.6;color:var(--muted)}
.dir__more b{font-weight:600;color:var(--text)}

.dir__go{
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  font-size:var(--t-small);font-weight:600;color:var(--muted);transition:color .2s
}
.dir__go .i{width:18px;height:18px;transition:transform .22s var(--ease)}
.dir__row:hover .dir__go{color:var(--text)}
.dir__row:hover .dir__go .i{transform:translateX(4px)}

/* «Свой запрос» последний и без «если успеем»: план под задачу пишется после заявки. */
.dir__row--own .dir__name{color:var(--accent)}

@media(max-width:900px){.dir__row{padding:30px 14px 24px}}
@media(max-width:760px){
  .dir__row{grid-template-columns:minmax(0,1fr) auto;row-gap:14px;padding:26px 0 22px}
  .dir__row::after{left:0;right:0}
  .dir__head{grid-column:1;grid-row:1}
  .dir__go{grid-column:2;grid-row:1;align-self:start;padding-top:4px}
  .dir__body{grid-column:1 / -1}
}

/* ── условия ─────────────────────────────────────────────────────────────── */
.ms-terms{display:grid;gap:20px 48px;margin-top:clamp(32px,4vw,52px)}
@media(min-width:760px){.ms-terms{grid-template-columns:1fr 1fr}}
.ms-terms__item{display:grid;gap:8px;padding-top:18px;border-top:1px solid var(--line)}
.ms-terms dt{font-family:var(--fd);font-weight:600;font-size:21px;letter-spacing:-.015em;line-height:1.15}
.ms-terms dd{font-size:var(--t-small);font-weight:500;line-height:1.6;color:var(--muted);max-width:52ch}

/* ── шаги: разметка и стили .process/.steps с главной, без линии прогресса ── */
.ms-steps .steps::after{display:none}

/* ── финальный призыв ────────────────────────────────────────────────────── */
.ms-cta{padding:0 0 var(--gap-section)}
.ms-cta__in{
  display:grid;gap:28px;align-items:end;
  padding-top:clamp(32px,4vw,52px);border-top:1px solid var(--line)
}
@media(min-width:980px){.ms-cta__in{grid-template-columns:minmax(0,1fr) auto}}
.ms-cta .lead{margin-top:16px}
.ms-cta__ways{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:560px){.ms-cta__ways .btn{width:100%;justify-content:center}}