/* ============================================================
   VELARY US — раскладка. ФАЙЛ СГЕНЕРИРОВАН из geometry.py.
   Все отступы и ширины взяты из макета Figma (фрейм 1440px).
   Править нужно geometry.py и пересобирать, а не этот файл.
   ============================================================ */

/* Полотно макета: на ширине 1440 и больше всё совпадает с Figma
   пиксель в пиксель, ниже — плавно сжимается. */
:root { --canvas: 1440px; }

.wrap {
  width: 100%;
  max-width: var(--canvas);
  margin-inline: auto;
}

/* Каркас блока страницы кейса: колонка по центру.
   Конкретные отступы задаются классом секции ниже. */
.b__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: var(--canvas);
  margin-inline: auto;
}
.b__text { width: 100%; }
.b__fig  { width: 100%; margin: 0; }
.b__fig img { display: block; width: 100%; height: auto; }

/* ---------- Главная: герой (4213:30357) ---------- */
.hero { min-height: 900px; }
.hero__content { padding: 112px 40px 228px; }
.hero__stack   { gap: 24px; }
.scribble      { width: 171px; height: 141px; }
.hero__headline{ max-width: 1360px; gap: 23px; }
.hero__hi      { width: 96px; }
.hero__hi svg  { width: 92.217px; height: 69.25px; }
.hero__title   { font-size: 90px; letter-spacing: -3.6px; max-width: 1000px; }
.hero__desc    { padding-top: 40px; font-size: 19px; line-height: 1.33; }
.hero__desc p            { max-width: 848px; }
.hero__desc p:last-child { max-width: 950px; }
.ghost--top svg { width: 807.604px; height: auto; }

/* ---------- Главная: работы (4005:1477) ---------- */
.works        { gap: 100px; padding-bottom: 100px; }
.cards        { max-width: 1291px; column-gap: 39px; row-gap: 79px; }
.card         { gap: 10px; min-height: 510px; }
.card__cover  { height: 282px; border-radius: 18px; }
.card__body   { height: 218px; justify-content: space-between; }
.card__kicker { line-height: 23px; letter-spacing: 0; }   /* в макете у строки-кикера трекинг 0 */
.card--softpay .card__desc,
.card--aurea .card__desc,
.card--parknow .card__desc,
.card--dogportal .card__desc { line-height: 23px; }
.card__text   { gap: 4px; }
.tags         { gap: 8px; }
.tag          { padding: 6px 12px; min-height: 32px; }
.tag--narrow  { padding-inline: 10px; }
.card--dogportal .tags { flex-wrap: nowrap; }   /* в макете ряд не переносится */

/* ---------- Футер (4169:2372) ---------- */
.footer         { padding-block: 27px; }
.footer__inner  { padding-inline: 40px; height: 41px; }
.footer__mark   { width: 49.632px; height: 41px; }   /* выше строки — в макете так же */
.footer__links  { width: 803px; }
.footer__link   { font-size: 25px; line-height: 40px; }

/* ---------- About (4005:1774) ---------- */
.about        { padding-block: 50px; }
.about__grid  { gap: 20px; padding-block: 35px; }
.about       { height: 1075px; }
.about__block, .about__block p, .about__block li, .about__block h2 { line-height: 27px; letter-spacing: -0.17px; }
.about__block--do, .about__block--do p, .about__block--do li, .about__block--do h2 { line-height: 25px; }
.about__text  { max-width: 887px; height: 928px; gap: 27px; }
.about__aside { width: 340px; height: 928px; gap: 27px; }
.about__skills { height: 286px; }
.about__photo { height: 436px; }
.about__skills-title { height: 27px; margin-bottom: 27px; }
.skills       { gap: 8px 11px; }
.skill        { padding: 8px 14px; }
.about__cv    { margin-top: 98px; }
.btn-cv       { max-width: 340px; padding: 15px 28px; }
.about__aside { position: relative; }
/* в макете scribble — верхний слой фрейма, он ложится поверх фото */
.about__hey   { position: absolute; z-index: 3; left: -11.5px; top: -56px;
                width: 163.18px; height: 81.665px; }
.about__hey svg { width: 156px; height: 52px; transform: rotate(11.34deg); }

/* ---------- Кейс AUREA ---------- */
.b-aurea-over { background: var(--case-light); padding: 62px 0 62px;
  min-height: 829px;
  justify-content: center;
}
.b-aurea-over .b__inner { padding-inline: 150px; row-gap: 45px; }
.b-aurea-over .b__text  { max-width: 1140px; }
.o-aurea { background: var(--case-light); padding: 24px 0 24px; gap: 44px; }
.o-aurea .case-author { gap: 44px; }
.o-aurea .case-author__card  { gap: 16px; }
.o-aurea .case-author__lines { gap: 3px; width: 150px; }
.o-aurea .case-author__photo { width: 66px; height: 66px; }

/* ---------- Кейс SOFTPAY ---------- */
.b-softpay-over { background: var(--case-white); padding: 62px 0 62px;
  min-height: 829px;
  justify-content: center;
}
.b-softpay-over .b__inner { padding-inline: 150px; row-gap: 50px; }
.b-softpay-over .b__text  { max-width: 1140px; }
.b-softpay-discovery { background: var(--case-white); padding: 40px 0 44px; }
.b-softpay-discovery .b__inner { padding-inline: 150px; }
.b-softpay-discovery .b__text  { max-width: 1140px; }
.b-softpay-discovery { height: 1111px; box-sizing: border-box; }
.b-softpay-discovery .b__inner { row-gap: 31px; }
.b-softpay-discovery .b__text + .b__text { margin-top: 24px; }
.b-softpay-discovery .b__fig { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.b-softpay-discovery .b__fig img { height: 634px; object-fit: cover; }
.b-softpay-userflow { background: var(--case-light); padding: 53.8px 0 53.8px; }
.b-softpay-userflow .b__inner { padding-inline: 150px; }
.b-softpay-userflow .b__text  { max-width: 1140px; }
.b-softpay-userflow { height: 900px; box-sizing: border-box; }
.b-softpay-userflow .b__inner { row-gap: 50px; }
.b-softpay-userflow .b__fig { max-width: 1140px; }
.b-softpay-wireframes { background: var(--case-light); padding: 41px 0 111px; }
.b-softpay-wireframes .b__inner { padding-inline: 150px; }
.b-softpay-wireframes .b__text  { max-width: 1140px; }
.b-softpay-wireframes { height: 1172px; box-sizing: border-box; }
.b-softpay-wireframes .b__inner { row-gap: 50px; }
.b-softpay-wireframes .b__fig { max-width: 1140px; }
.b-softpay-decisions { background: var(--case-light); padding: 0px 0 85px; }
.b-softpay-decisions .b__inner { padding-inline: 150px; }
.b-softpay-decisions .b__text  { max-width: 1140px; }
.b-softpay-decisions { height: 2080px; box-sizing: border-box; }
.b-softpay-decisions .b__inner { row-gap: 75px; }
.b-softpay-decisions .b__text + .b__fig { margin-top: -35px; }
.b-softpay-decisions .b__fig { max-width: 1140px; }
.b-softpay-usability { background: var(--case-light); padding: 0px 0 87px; }
.b-softpay-usability .b__inner { padding-inline: 150px; }
.b-softpay-usability .b__text  { max-width: 1140px; }
.b-softpay-usability { height: 1248px; box-sizing: border-box; }
.b-softpay-usability .b__inner { row-gap: 50px; }
.b-softpay-usability .b__fig { max-width: 720px; }
.b-softpay-investing { background: var(--case-light); padding: 0px 0 72px; }
.b-softpay-investing .b__inner { padding-inline: 150px; }
.b-softpay-investing .b__text  { max-width: 1140px; }
.b-softpay-investing { height: 1078px; box-sizing: border-box; }
.b-softpay-investing .b__fig { width: 1346px; max-width: none; margin-inline: -103px; }
.b-softpay-finaltitle { background: var(--case-mist); padding: 0px 0 0px; }
.b-softpay-finaltitle .b__inner {
  /* The following brand artwork is authored on a 1440 px canvas.
     Keep its HTML heading aligned with the embedded "App Icon" label
     while the viewport grows or contracts. */
  padding-inline: min(10.4166667vw, 150px);
}
.b-softpay-finaltitle .b__text  { max-width: 1140px; }
.b-softpay-finaltitle { height: 59px; box-sizing: border-box; }
.b-softpay-brand { background: var(--case-mist); padding: 0px 0 0px; }
.b-softpay-brand .b__inner { padding-inline: 0px; }
.b-softpay-brand .b__text  { max-width: 1140px; }
.b-softpay-brand { height: 745px; box-sizing: border-box; }
.b-softpay-brand .b__fig {
  width: min(100vw, var(--canvas));
  max-width: var(--canvas);
  margin-inline: auto;
}
.b-softpay-brand .b__fig img { height: 746px; object-fit: cover; }
.b-softpay-screens { background: var(--case-mist); padding: 0px 0 0px; }
.b-softpay-screens .b__inner { padding-inline: 0px; }
.b-softpay-screens .b__text  { max-width: 1140px; }
.b-softpay-screens { height: 1471px; box-sizing: border-box; }
.b-softpay-screens .b__fig { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.b-softpay-screens .b__fig img { height: 1471px; object-fit: cover; }
.b-softpay-cards { background: var(--case-mist); padding: 103px 0 103px; }
.b-softpay-cards .b__inner { padding-inline: 0px; }
.b-softpay-cards .b__text  { max-width: 1140px; }
.b-softpay-cards { height: 935px; box-sizing: border-box; }
.b-softpay-cards .b__fig { max-width: 772px; }
.b-softpay-outcome { background: var(--case-light); padding: 40px 0 50px; }
.b-softpay-outcome .b__inner { padding-inline: 150px; }
.b-softpay-outcome .b__text  { max-width: 1140px; }
.b-softpay-outcome { height: 261px; box-sizing: border-box; }
.b-softpay-final { background: var(--case-light); padding: 0px 0 0px; }
.b-softpay-final .b__inner { padding-inline: 0px; }
.b-softpay-final .b__text  { max-width: 1140px; }
.b-softpay-final { height: 960px; box-sizing: border-box; }
.b-softpay-final .b__fig { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.b-softpay-final .b__fig img { height: 960.5px; object-fit: cover; }
.o-softpay { background: var(--case-light); padding: 43px 0 90px; gap: 64px; }
.o-softpay .case-author { gap: 44px; }
.o-softpay .case-author__card  { gap: 16px; }
.o-softpay .case-author__lines { gap: 3px; width: 150px; }
.o-softpay .case-author__photo { width: 66px; height: 66px; }

/* ---------- Кейс PARKNOW ---------- */
.b-parknow-over { background: var(--case-white); padding: 62px 0 62px;
  min-height: 572px;
  justify-content: center;
}
.b-parknow-over .b__inner { padding-inline: 150px; row-gap: 50px; }
.b-parknow-over .b__text  { max-width: 1140px; }
.b-parknow-discovery { background: var(--case-light); padding: 51px 0 59px; }
.b-parknow-discovery .b__inner { padding-inline: 150px; }
.b-parknow-discovery .b__text  { max-width: 1140px; }
.b-parknow-discovery { height: 1027px; box-sizing: border-box; }
.b-parknow-discovery .b__inner { row-gap: 31px; }
.b-parknow-discovery .b__fig { max-width: 1140px; }
.b-parknow-userflow { background: var(--case-light); padding: 44.5px 0 44.5px; }
.b-parknow-userflow .b__inner { padding-inline: 150px; }
.b-parknow-userflow .b__text  { max-width: 1140px; }
.b-parknow-userflow { height: 668px; box-sizing: border-box; }
.b-parknow-userflow .b__fig { max-width: 1140px; }
.b-parknow-wireframes { background: var(--case-light); padding: 41px 0 102px; }
.b-parknow-wireframes .b__inner { padding-inline: 150px; }
.b-parknow-wireframes .b__text  { max-width: 1140px; }
.b-parknow-wireframes { height: 1419px; box-sizing: border-box; }
.b-parknow-wireframes .b__inner { row-gap: 50px; }
.b-parknow-wireframes .b__fig { max-width: 814px; }
.b-parknow-decisions { background: var(--case-light); padding: 0px 0 131px; }
.b-parknow-decisions .b__inner { padding-inline: 150px; }
.b-parknow-decisions .b__text  { max-width: 1140px; }
.b-parknow-decisions { height: 330px; box-sizing: border-box; }
.b-parknow-confidence { background: var(--case-light); padding: 0px 0 40px; }
.b-parknow-confidence .b__inner { padding-inline: 150px; }
.b-parknow-confidence .b__text  { max-width: 1140px; }
.b-parknow-confidence { height: 129px; box-sizing: border-box; }
.b-parknow-cards { background: var(--case-light); padding: 0px 0 0px; }
.b-parknow-cards .b__inner { padding-inline: 149px; }
.b-parknow-cards .b__text  { max-width: 1142px; }
.b-parknow-cards { height: 1626px; box-sizing: border-box; }
.b-parknow-cards .b__inner { row-gap: 53px; }
.b-parknow-cards .b__fig { max-width: 1142px; }
.b-parknow-errors { background: var(--case-light); padding: 81px 0 50px; }
.b-parknow-errors .b__inner { padding-inline: 150px; }
.b-parknow-errors .b__text  { max-width: 1140px; }
.b-parknow-errors { height: 959px; box-sizing: border-box; }
.b-parknow-errors .b__inner { row-gap: 40px; }
.b-parknow-errors .b__fig { max-width: 1140px; }
.b-parknow-path { background: var(--case-light); padding: 50px 0 53px; }
.b-parknow-path .b__inner { padding-inline: 150px; }
.b-parknow-path .b__text  { max-width: 1140px; }
.b-parknow-path { height: 821px; box-sizing: border-box; }
.b-parknow-path .b__inner { row-gap: 34px; }
.b-parknow-path .b__fig { max-width: 1098px; }
.b-parknow-outcome { background: var(--case-light); padding: 1.5px 0 11.5px; }
.b-parknow-outcome .b__inner { padding-inline: 150px; }
.b-parknow-outcome .b__text  { max-width: 1140px; }
.b-parknow-outcome { height: 327px; box-sizing: border-box; }
.o-parknow { background: var(--case-light); padding: 100px 0 83.3px; gap: 64px; }
.o-parknow .case-author { gap: 44px; }
.o-parknow .case-author__card  { gap: 16px; }
.o-parknow .case-author__lines { gap: 3px; width: 150px; }
.o-parknow .case-author__photo { width: 66px; height: 66px; }

.b-aurea-gallery { background: var(--case-light); padding: 62px 0 177px; }
.b-aurea-gallery > .wrap { display: flex; flex-direction: column; gap: 94px; }
.b-aurea-gallery .b__inner { padding-inline: 150px; }
.b-aurea-gallery .b__text  { max-width: 1140px; }
.b-aurea-gallery .g-discovery { row-gap: 50px; }
.b-aurea-gallery .g-discovery { height: 1008px; box-sizing: border-box; }
.b-aurea-gallery .g-discovery .b__fig { max-width: 966px; }
.b-aurea-gallery .g-userflow { row-gap: 38px; }
.b-aurea-gallery .g-userflow { height: 540px; box-sizing: border-box; }
.b-aurea-gallery .g-userflow .b__fig { max-width: 966px; }
.b-aurea-gallery .g-userflow .b__fig { height: 359px; overflow: hidden; display: flex; align-items: center; }
.b-aurea-gallery .g-userflow .b__fig img { flex: none; }
.b-aurea-gallery .g-wireframes { row-gap: 50px; }
.b-aurea-gallery .g-wireframes { height: 1203px; box-sizing: border-box; }
.b-aurea-gallery .g-wireframes .b__fig { max-width: 692px; }
.b-aurea-gallery .g-decisions { row-gap: 50px; }
.b-aurea-gallery .g-decisions { height: 1346px; box-sizing: border-box; }
.b-aurea-gallery .g-decisions .b__fig { max-width: 966px; }
.b-aurea-gallery .g-decisions .b__text + .b__text { margin-top: 0px; }
.b-aurea-gallery .g-prototype { row-gap: 50px; }
.b-aurea-gallery .g-prototype { height: 818px; box-sizing: border-box; }
.b-aurea-gallery .g-prototype .b__fig { max-width: 966px; }
.b-aurea-gallery .g-usability { row-gap: 61px; }
.b-aurea-gallery .g-usability { height: 1050px; box-sizing: border-box; }
.b-aurea-gallery .g-usability .b__fig { max-width: 966px; }
.b-aurea-gallery .g-booking { row-gap: 38px; }
.b-aurea-gallery .g-booking { height: 552px; box-sizing: border-box; }
.b-aurea-gallery .g-booking .b__fig { max-width: 964px; }
.b-aurea-gallery .g-outcome { height: 283px; box-sizing: border-box; }
.b-aurea-gallery .g-outcome { padding-bottom: 84px; }

.b-aurea-before { background: var(--case-dark); padding: 62px 0 79px; height: 1634px; box-sizing: border-box; }
.b-aurea-before .b__inner { padding-inline: 150px; row-gap: 44px; }
.b-aurea-before .b__text  { max-width: 1140px; }
.b-aurea-before .b__fig   { max-width: 986.2px; }

.case-hero--aurea { background: var(--case-dark); padding: 54px 35px 92px; gap: 48px;
  height: 971px; box-sizing: border-box; overflow: visible; }
/* высота секции задана жёстко — содержимое не должно сжиматься */
.case-hero--aurea > * { flex: none; }
.case-hero--aurea .case-hero__head { width: 268.4px; gap: 15px; }
/* 4124:2328 — заголовок и подпись в одном фрейме без зазора */
.case-hero--aurea .case-hero__sub { margin-top: -15px; }
.case-hero--aurea .case-hero__shot { box-sizing: content-box; width: 956px; height: 664px;
  border: 0; border-radius: 0; background: none; margin-top: -9.898px; }
.case-hero--aurea .case-hero__shot img { width: 100%; height: 100%; object-fit: fill; }

/* Подзаголовки в блоке Before/After: в макете строка 35px, а не 50px */
.b-aurea-before .b__text h3 { line-height: 35px; }

/* Рукописная надпись лежит поверх нижнего поля галереи и не добавляет высоты */
.b-aurea-gallery { position: relative; }
.b-aurea-gallery .case-outro__scribble {
  position: absolute;
  left: 50%;
  bottom: 60px;
  transform: translateX(-50%);
  width: 546px;
}
.b-softpay-seam { height: 1px; background: var(--case-light); }

/* ---------- Обложка SoftPay (4263:24702) ---------- */
.case-hero--softpay {
  position: relative;
  display: block;
  padding: 0;
  aspect-ratio: 1440 / 1222.6;
  min-height: 420px;
  background: #8FBF2A;
  overflow: hidden;
}
.case-hero__meta {
  position: absolute;
  inset: 16px 0 auto;
  left: 50%;
  transform: translateX(-50%);
  padding-inline: 20px;
  display: flex;
  justify-content: space-between;
  z-index: 2;
}
.case-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 51.086px;
  padding-top: 270px;
  pointer-events: none;
}
.case-hero__overlay > * { pointer-events: auto; }
.case-hero__bigtitle {
  font-size: 99.866px;
  line-height: 63.914px;
  letter-spacing: -2.996px;
}

/* ---------- Обложка ParkNow (4299:98035) ---------- */
.case-hero--parknow {
  position: relative;
  display: block;
  padding: 0;
  overflow: hidden;
  background: #E9E9E7;
}
.case-hero--parknow::after { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.75); }

/* ---------- Эффекты, считанные из макета (Plugin API) ---------- */
.glass-btn-aurea {
  position: relative;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.224);
  background: var(--backdrop-subtle);
  backdrop-filter: blur(36.00px);
  -webkit-backdrop-filter: blur(36.00px);
}   /* Figma GLASS radius 100, light 0.8 */

.glass-btn-softpay {
  position: relative;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.224);
  background: var(--backdrop-subtle);
  backdrop-filter: blur(1.80px);
  -webkit-backdrop-filter: blur(1.80px);
}   /* Figma GLASS radius 5, light 0.8 */

.glass-btn-parknow {
  position: relative;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.224);
  background: var(--backdrop-subtle);
  backdrop-filter: blur(1.80px);
  -webkit-backdrop-filter: blur(1.80px);
}   /* Figma GLASS radius 5, light 0.8 */

.glass-card-badge {
  position: relative;
  box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.224);
  background: var(--backdrop-subtle);
  backdrop-filter: blur(1.27px);
  -webkit-backdrop-filter: blur(1.27px);
}   /* Figma GLASS radius 3.52, light 0.8 */

.btn-cv { filter: drop-shadow(0px 4px 13.6px rgba(0, 0, 0, 0.1)); }


/* Герой ParkNow — координаты из 4299:98035 */
.case-hero--parknow .case-hero__bg {
  position: absolute; inset: 0;
  /* кадр уже обрезан по CROP из макета (весь кадр по ширине, 63.48% по высоте, сдвиг 0.68%).
     cover — чтобы на экранах шире 1440 картинка растягивалась без полей и без обрыва в
     сплошной цвет, как в шапке сайта; на 1440 и уже результат идентичен фиксированному кадру. */
  background-image: url("/assets/img/parknow/hero-bg.jpg?v=202608260100");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.pn-hero { position: relative; z-index: 2; width: 1440px; height: 935px; margin-inline: auto; display: block; }
.pn-hero__logo   { position:absolute; left:157px; top:176px; width:72px; height:72px; }
.pn-hero__logo img { width: 100%; height: 100%; }
.pn-hero__logo-name { position:absolute; left:122px; top:262px; width:143px; height:27px; font-size: 20.9096px; line-height: 27px; text-align: center; }
.pn-hero__lead   { position:absolute; left:146px; top:324px; width:520px; height:102px; font-size: 19px; line-height: 34px; }
.pn-hero__meta { margin: 0; }
.pn-hero__meta dd { margin: 0; }
.pn-hero__meta dt { font-size: 12px; line-height: 18px; }
.pn-hero__meta dd { font-size: 18px; line-height: 26px; }
.pn-m1-lbl { position:absolute; left:146px; top:478px; }
.pn-m1-val { position:absolute; left:146px; top:506px; }
.pn-m2-lbl { position:absolute; left:413px; top:478px; }
.pn-m2-val { position:absolute; left:413px; top:506px; }
.pn-m3-lbl { position:absolute; left:146px; top:573px; }
.pn-m3-val { position:absolute; left:146px; top:601px; }
.pn-hero__cta { position:absolute; left:146px; top:700px; width:300px; height:61px; }
.pn-hero__cta .btn-figma { width: 300px; height: 61px; }
.pn-ph1 { position:absolute; left:763.18px; top:176px; width:270px; height:584.64px; }
.pn-ph2 { position:absolute; left:1075.5px; top:289.68px; width:217.5px; height:470.96px; }
.pn-ph1 { border-radius: 24px; }
.pn-ph2 { border-radius: 22px; }
.pn-ph1, .pn-ph2 { overflow: hidden; box-shadow: 0 18px 32px rgba(0,0,0,.28); }
.pn-ph1 img, .pn-ph2 img { width: 100%; height: 100%; object-fit: fill; display: block; }


/* ============================================================
   Мобильная раскладка. Числа взяты из мобильных макетов Figma
   (ширина 375), а не пересчитаны с десктопа: там другой порядок
   карточек, другие размеры и другой состав текста.
   ============================================================ */
@media (max-width: 767px) {

  /* --- шапка (4272:28842): 51px, поля 15 --- */
  .header { padding-block: 9.5px; }
  .header__inner { padding-inline: 15px; }

  /* --- герой (4215:31697): 812px, жёлтый --- */
  .hero { min-height: 812px; }
  .hero__content { padding: 87px 0 0; }
  .hero__stack { gap: 20px; }

  /* каракуля над заголовком (4215:32399) */
  .hero__shape .scribble { width: 103px; height: 85px; }

  /* заголовок: в макете две строки, «HI,» наложен слева поверх отступа */
  .hero__stack { width: 100%; align-items: center; }
  .hero__headline { position: relative; display: block; width: 100%; max-width: none; }
  .br-mob { display: inline; }
  .hide-mob { display: none; }
  .hero__title {
    font-size: 52px;
    line-height: 100%;
    letter-spacing: -2.08px;
    text-align: center;
    text-indent: 66px;   /* compact first line: the HI artwork and I’M read as one centered phrase */
  }
  .hero__hi {
    position: absolute;
    left: calc(50% - 74.5px);   /* в макете x=113px при ширине 375 */
    top: 0;   /* HI, и I’M начинаются на одной линии */
    width: 51px;
    height: 51px;
    align-self: auto;
  }
  .hero__hi svg { width: 100%; height: 100%; }

  /* описание (4215:31705) */
  .hero__desc {
    width: calc(100% - 54px);   /* на 375 это ровно 321px из макета */
    max-width: none;
    margin-inline: auto;
    padding-top: 55px;
    padding-bottom: 40px;
    font-size: 20px;
    line-height: 133%;
  }
  .hero__desc p, .hero__desc p:last-child { max-width: none; }

  /* Надпись WORKS в макете лежит поверх стыка героя и секции работ
     (4215:31707 + 4215:31712), а не занимает место в потоке. */
  .hero__body { position: relative; }
  .works { position: relative; }
  .ghost--top, .ghost--bottom {
    position: absolute;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: 100%;
    max-width: none;
  }
  .ghost--top    { bottom: 0; }
  .ghost--bottom {
    top: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
  }
  .ghost--top svg {
    width: 337px;
    height: auto;
    margin-inline: auto;
    display: block;
  }
  /* Обе половины используют один масштаб: 337 / 807.604. Нижний SVG хранит
     исходный canvas 1440px, поэтому его точная ширина на mobile — 601px.
     Центрирование общего canvas сохраняет естественное сужение нижней части
     букв и даёт непрерывный контур на линии разделения. */
  .ghost--bottom svg {
    width: 601px;
    max-width: none;
    height: auto;
    flex: none;
    display: block;
  }

  /* --- секция работ (4215:31711) --- */
  .works { padding-top: 145px; padding-bottom: 79px; }
  .cards {
    display: flex;
    flex-direction: column;
    gap: 45px;
    width: calc(100% - 48px);   /* на 375 это ровно 327px из макета */
    max-width: none;
    margin-inline: auto;
  }
  /* SoftPay is the first project in the mobile portfolio order. */
  .card--softpay   { order: 1; }
  .card--aurea     { order: 2; }
  .card--parknow   { order: 3; }
  .card--dogportal { order: 4; }

  /* в мобильном макете у карточек другой состав: свои обложки,
     свой текст и без тегов (4215:31716) */
  .only-desk { display: none; }
  .only-mob  { display: block; }
  .card__cover--m { height: auto; border-radius: 0; }
  .card__cover--m img { display: block; width: 100%; height: auto; }

  /* карточка = обложка + тело вплотную, без зазоров (4215:31716) */
  .card { width: 100%; min-height: 0; gap: 0; }
  .card__body { height: auto; gap: 0; justify-content: flex-start; }
  .card__text { gap: 0; }
  .card__title {
    height: 41px;
    font-size: 16px;
    line-height: 59px;
  }
  .card__desc  { font-size: 14px; line-height: 23px; letter-spacing: 0; }
  .card--softpay .card__cover--m {
    aspect-ratio: 1;
    padding-top: 7px;
    background: #fff;
    overflow: hidden;
  }
  .card--softpay .card__cover--m img {
    height: 100%;
    object-fit: cover;
    object-position: center top;
  }

  /* Touch devices must not retain the desktop hover veil after a tap. */
  .card--link::after { display: none; }

  /* ---------- About (Mobile_About 4315:9316) ----------
     Одна колонка, порядок иной: сначала фото, потом текст,
     в конце Skills и кнопка CV. --------------------------- */
  .about { height: auto; }
  .about__grid { flex-direction: column; align-items: stretch; }
  .about__text, .about__aside { width: auto; height: auto; max-width: none; }
  /* раскрываем правую колонку, чтобы её части можно было переставить */
  .about__aside { display: contents; }
  .about__photo  {
    order: 1;
    width: 353px;
    max-width: calc(100% - 22px);
    height: auto;
    aspect-ratio: 353 / 436;
    margin-inline: auto;
  }
  .about__text   { order: 2; }
  .about__skills { order: 3; height: auto; }
  .about__cv     { order: 4; margin-top: 54px; }

  /* Mobile_About: HEY! sits 8px below the photo's top edge. The aside uses
     display: contents on mobile, so the grid becomes its positioning anchor. */
  .about__grid { position: relative; }
  .about__hey {
    display: flex;
    left: max(24.79px, calc(50% - 162.71px));
    top: 33px;
    width: 117.86px;
    height: 39.59px;
  }
  .about__hey svg {
    width: 100%;
    height: 100%;
    transform: rotate(11.34deg);
    transform-origin: center;
  }

  .about__grid   { row-gap: 20px; padding-block: 25px 0; }
  .about__text   { width: calc(100% - 30px); margin-inline: auto; gap: 20px; }
  .about__block p, .about__block li, .about__block h2 { font-size: 18px; }

  .about__skills { width: calc(100% - 35px); margin-inline: auto; }
  .about__cv {
    width: 340px;
    max-width: calc(100% - 35px);
    margin-inline: auto;
    justify-content: center;
  }
  .about__skills-title { height: 27px; margin-bottom: 27px; }
  .skills { min-height: 0; }
  .btn-cv { height: 46px; padding: 15px 28px; }

  /* ---------- Кейсы (Mobile_Softpay / Mobile_Aurea / Mobile_ParkNow) ----------
     Во всех трёх мобильных макетах одно и то же: колонка 277 с полями 49,
     заголовки 16/59, текст 13/23. Жёсткие десктопные высоты секций снимаем —
     иначе на узком экране содержимое обрежется. ----------------------------- */
  .case [class*="b-"], .case [class*="o-"] { height: auto; min-height: 0; }
  /* селекторы с запасом по весу: десктопные правила заданы через
     .b-<кейс>-<секция> и иначе перебивают мобильные */
  .case [class*="b-"] .b__inner { padding-inline: 49px; row-gap: 24px; }
  .case [class*="b-"] .b__text  { max-width: none; }
  .case [class*="b-"] .b__text h2,
  .case [class*="b-"] .b__text h3 { font-size: 16px; line-height: 41px; }
  .case [class*="b-"] .b__text p,
  .case [class*="b-"] .b__text li { font-size: 13px; line-height: 23px; }
  .case [class*="b-"] .b__text p + p { margin-top: 23px; }

  /* картинки: на всю ширину экрана, высоту не фиксируем */
  .case [class*="b-"] .b__fig {
    width: 309px;
    max-width: none;
    flex: none;
    align-self: center;
    margin-inline: 0;
  }
  .case [class*="b-"] .b__fig img { width: 100%; height: auto; object-fit: fill; }

  /* обложки кейсов: десктопные высоты и полотно 1440 не годятся */
  .case-hero { height: auto; min-height: 0; }
  .case .case-hero--aurea { padding: 40px 16px; gap: 24px; min-height: 503px; }
  .case-hero--aurea .case-hero__sub {
    width: 100%;
    margin-top: -15px;
    font-size: 11px;
    letter-spacing: 4.7px;
    text-indent: 4.7px;
  }
  .case-hero--aurea .case-hero__shot { width: 100%; height: auto; margin-top: 0; }
  .case-hero--aurea .case-hero__shot img { height: auto; }
  /* В Aurea внутренние gallery-блоки имеют собственные desktop-высоты
     (g-discovery, g-userflow и т.д.), поэтому общий селектор b-* их не снимает. */
  .b-aurea-gallery .b__inner { height: auto; }
  .b-aurea-over,
  .b-aurea-before { padding-block: 20px; }
  .b-aurea-gallery { padding: 20px 0 90px; }
  .b-aurea-gallery > .wrap { gap: 24px; }
  .b-aurea-gallery .g-userflow .b__fig { width: 309px; height: 115px; }
  .b-aurea-gallery .g-wireframes .b__fig { width: 209px; }
  .b-aurea-gallery .g-usability .b__fig img { border-radius: 4px; }
  /* Mobile_Aurea: the booking title occupies a 41px two-line frame and the
     screen strip is 277 × 118.71px in Figma. Keeping those exact bounds
     prevents Project Outcome from drifting into the closing inscription. */
  .case .b-aurea-gallery .g-booking { row-gap: 20px; }
  .b-aurea-gallery .g-booking h2 {
    height: 41px;
    line-height: 20.5px;
  }
  .b-aurea-gallery .g-booking .b__fig {
    width: 277px;
    height: 118.71px;
  }
  .b-aurea-gallery .g-booking .b__fig img {
    width: 100%;
    height: 100%;
    object-fit: fill;
  }
  .b-aurea-before .b__fig { height: 289px; overflow: hidden; }
  .b-aurea-before .b__fig img { height: 100%; object-fit: cover; }
  .b-aurea-gallery .g-outcome { padding-bottom: 0; }
  .b-aurea-gallery .case-outro__scribble {
    left: 61px;
    right: 61px;
    width: auto;
    height: 21.58px;
    bottom: 20px;
    transform: none;
  }
  .b-aurea-gallery .case-outro__scribble svg { height: 100%; }
  .case .o-aurea .case-author { gap: 11.541px; }
  .case .o-aurea .case-author__card { gap: 4.197px; }
  .case .o-aurea .case-author__photo { width: 17.311px; height: 17.311px; }
  .case .o-aurea .case-author__lines { gap: .787px; }
  /* Mobile_Softpay (4215:30882): the hero occupies 651px below the 51px header.
     A fixed mobile height keeps the artwork visible instead of collapsing to 0. */
  .case .case-hero--softpay {
    width: 100%;
    height: 651px;
    min-height: 651px;
    aspect-ratio: auto;
  }
  .case-hero--softpay .case-hero__meta { display: none; }
  .case-hero--softpay .case-hero__bg {
    height: 651px;
    object-fit: cover;
    object-position: center top;
  }
  .case-hero--softpay .case-hero__overlay {
    gap: 14px;
    padding-top: 78px;
  }
  .case-hero--softpay .case-hero__bigtitle {
    font-size: 36px;
    line-height: 52px;
    letter-spacing: -1.08px;
  }
  .case-hero--softpay .btn-figma {
    width: 165px;
    height: 32px;
    padding: 4px 10px;
    gap: 4px;
    font-size: 9px;
    line-height: 12px;
  }
  .case-hero--softpay .btn-figma__mark {
    width: 22px;
    height: 22px;
  }
  .case-hero--softpay .btn-figma__mark img {
    width: 10px;
    height: 14px;
  }

  /* Mobile_Softpay content rhythm (4215:30882).
     These rules intentionally override the desktop section heights and the
     generic 309px figure width: the mobile composition uses several distinct
     image sizes and fixed section boundaries. */
  .case .b-softpay-over {
    height: auto;
    min-height: 0;
    padding: 11px 0 29px;
  }
  .case .b-softpay-over .b__inner { row-gap: 24px; }

  .case .b-softpay-seam {
    display: block;
    width: 277px;
    height: 1px;
    min-height: 1px;
    margin-inline: auto;
    background: transparent;
  }

  .case .b-softpay-discovery {
    height: auto;
    min-height: 0;
    padding: 10px 0 67px;
  }
  .case .b-softpay-discovery .b__inner { row-gap: 21px; }
  .case .b-softpay-discovery .b__text + .b__text { margin-top: 0; }

  .case .b-softpay-userflow {
    height: auto;
    min-height: 0;
    padding: 34.823px 0 4px;
  }
  .case .b-softpay-userflow .b__inner { row-gap: 31px; }
  .case .b-softpay-userflow .b__fig {
    width: 277px;
    height: 152px;
  }
  .case .b-softpay-userflow .b__fig img { height: 152px; }

  .case .b-softpay-wireframes {
    height: auto;
    min-height: 0;
    padding: 9px 0 32px;
  }
  .case .b-softpay-wireframes .b__inner { row-gap: 50px; }
  .case .b-softpay-wireframes .b__fig {
    width: 298px;
    height: 224px;
  }
  .case .b-softpay-wireframes .b__fig img { height: 224px; }

  .case .b-softpay-decisions {
    height: auto;
    min-height: 0;
    padding: 0;
  }
  .case .b-softpay-decisions .b__inner { row-gap: 25px; }
  .case .b-softpay-decisions .b__text + .b__fig { margin-top: 32px; }
  .case .b-softpay-decisions .b__fig {
    width: 277px;
    height: 378px;
  }
  .case .b-softpay-decisions .b__fig img { height: 378px; }

  .case .b-softpay-usability {
    height: auto;
    min-height: 0;
    padding: 18.354px 0 0;
  }
  .case .b-softpay-usability .b__inner { row-gap: 29px; }
  .case .b-softpay-usability .b__fig {
    width: 277px;
    height: 373px;
  }
  .case .b-softpay-usability .b__fig img { height: 373px; }

  .case .b-softpay-investing {
    height: auto;
    min-height: 0;
    padding: 16px 0 44.486px;
  }
  .case .b-softpay-investing .b__inner { row-gap: 29px; }
  .case .b-softpay-investing .b__fig {
    width: 277px;
    height: 183.337px;
    margin-inline: 0;
  }
  .case .b-softpay-investing .b__fig img { height: 183.337px; }

  .case .b-softpay-finaltitle {
    height: auto;
    min-height: 41px;
    padding: 0;
  }
  .case .b-softpay-finaltitle .b__inner { padding-inline: 39px; }

  .case .b-softpay-brand {
    height: calc(100vw * 194.01 / 375);
    min-height: 0;
    padding: 0;
  }
  .case .b-softpay-brand .b__inner,
  .case .b-softpay-screens .b__inner,
  .case .b-softpay-cards .b__inner,
  .case .b-softpay-final .b__inner { padding-inline: 0; }
  .case .b-softpay-brand .b__fig {
    width: 100vw;
    height: calc(100vw * 194.01 / 375);
  }
  .case .b-softpay-brand .b__fig img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .case .b-softpay-screens {
    height: calc(100vw * 383.043 / 375);
    min-height: 0;
    padding: 0;
  }
  .case .b-softpay-screens .b__fig {
    width: 100vw;
    height: calc(100vw * 383.043 / 375);
  }
  .case .b-softpay-screens .b__fig img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .case .b-softpay-cards {
    height: auto;
    min-height: 0;
    padding: 0;
  }
  .case .b-softpay-cards .b__fig {
    width: 100vw;
    height: auto;
    aspect-ratio: 375 / 243.573;
    overflow: hidden;
    box-sizing: border-box;
    padding: calc(26.82 / 375 * 100vw) calc(86.98 / 375 * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .case .b-softpay-cards .b__fig img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .case .b-softpay-outcome {
    height: auto;
    min-height: 0;
    padding: 0 0 17px;
  }

  .case .b-softpay-final {
    width: 100%;
    height: auto;
    min-height: 0;
    margin-left: 0;
    padding: 0;
  }
  .case .b-softpay-final .b__fig {
    width: 100vw;
    height: auto;
    aspect-ratio: 375 / 251.832;
  }
  .case .b-softpay-final .b__fig img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .case .o-softpay {
    height: 162.168px;
    min-height: 162.168px;
    padding: 11.279px 0 0;
    gap: 16.787px;
  }
  .case .o-softpay .case-outro__wordmark {
    width: 137.442px;
    max-width: none;
    flex: none;
  }
  .case .o-softpay .case-author {
    gap: 11.541px;
  }
  .case .o-softpay .case-author__card {
    gap: 4.197px;
  }
  .case .o-softpay .case-author__photo {
    width: 17.311px;
    height: 17.311px;
  }
  .case .o-softpay .case-author__lines {
    gap: .787px;
  }
  .case .o-softpay .case-outro__thanks {
    font-size: 7px;
    line-height: 7px;
  }
  .case .case-hero--parknow { height: 741px; min-height: 741px; overflow: hidden; }

  /* Mobile_ParkNow (4301:8305): отдельная 375px-композиция из Figma. */
  .pn-hero {
    position: relative;
    z-index: 2;
    width: 375px;
    max-width: none;
    flex: none;
    height: 741px;
    padding: 0;
    display: block;
  }
  .pn-hero__logo {
    position: absolute;
    left: 258.084px;
    top: 58px;
    width: 52.259px;
    height: 52.259px;
  }
  .pn-hero__logo-name {
    position: absolute;
    left: 232.208px;
    top: 120.913px;
    width: 104.01px;
    height: 20px;
    font-size: 15.221px;
    line-height: 20px;
    font-weight: 700;
    text-align: center;
  }
  .pn-hero__cta {
    position: absolute;
    left: 53px;
    top: 58px;
    width: 136.364px;
    height: 30px;
  }
  .pn-hero__cta .btn-figma {
    width: 136.364px;
    height: 30px;
    gap: 2.459px;
    padding: 4.918px 9.836px;
    font-size: 7.869px;
    line-height: 10.328px;
    letter-spacing: -.236px;
  }
  .pn-hero__cta .btn-figma__mark {
    width: 17.902px;
    height: 17.156px;
  }
  .pn-hero__cta .btn-figma__mark img { width: 8.262px; height: 11.803px; }
  .pn-ph1 {
    position: absolute;
    left: 56.09px;
    top: 137px;
    width: 133.709px;
    height: 289.524px;
    margin: 0;
    border-radius: 11.885px;
    box-shadow: 0 8.914px 15.847px rgba(0,0,0,.28);
  }
  .pn-ph2 {
    position: absolute;
    left: 210.756px;
    top: 193.296px;
    width: 107.71px;
    height: 233.228px;
    margin: 0;
    border-radius: 10.895px;
    box-shadow: 0 8.914px 15.847px rgba(0,0,0,.28);
  }
  .pn-ph1 img, .pn-ph2 img { width: 100%; height: 100%; object-fit: fill; }
  .pn-hero__lead {
    position: absolute;
    left: 56px;
    top: 486px;
    width: 267px;
    height: 92px;
    font-size: 13px;
    line-height: 23px;
  }
  .pn-hero__meta {
    position: absolute;
    left: 56px;
    top: 603px;
    width: 270px;
    height: 91px;
    display: block;
  }
  .pn-hero__meta dt { font-size: 7.842px; line-height: 11.763px; }
  .pn-hero__meta dd { font-size: 11.763px; line-height: 16.99px; white-space: nowrap; }
  .pn-m1-lbl { position: absolute; left: 0; top: 0; }
  .pn-m1-val { position: absolute; left: 0; top: 16px; }
  .pn-m2-lbl { position: absolute; left: 126.091px; top: 0; }
  .pn-m2-val { position: absolute; left: 126.091px; top: 16px; }
  .pn-m3-lbl { position: absolute; left: 0; top: 58px; }
  .pn-m3-val { position: absolute; left: 0; top: 74px; }

  .case .b-parknow-over,
  .case .b-parknow-discovery,
  .case .b-parknow-userflow,
  .case .b-parknow-wireframes,
  .case .b-parknow-decisions,
  .case .b-parknow-confidence,
  .case .b-parknow-cards,
  .case .b-parknow-errors,
  .case .b-parknow-path,
  .case .b-parknow-outcome { padding: 0; box-sizing: border-box; }

  /* Основная колонка ParkNow — 277px, x=49 в мобильном фрейме. */
  .case [class*="b-parknow-"] .b__inner {
    width: 277px;
    padding: 0;
    margin-inline: auto;
    align-items: stretch;
    row-gap: 0;
  }
  .case [class*="b-parknow-"] .b__text h2,
  .case [class*="b-parknow-"] .b__text h3 {
    font-size: 16px;
    line-height: 23px;
  }
  .case [class*="b-parknow-"] .b__text p,
  .case [class*="b-parknow-"] .b__text li {
    font-size: 13px;
    line-height: 23px;
  }
  .case [class*="b-parknow-"] .b__fig {
    width: 277px;
    max-width: none;
    align-self: center;
  }

  .case .b-parknow-over { height: 464px; }
  .case .b-parknow-over .b__inner { padding-top: 11px; }
  .b-parknow-over .b__text h2 { height: 59px; line-height: 59px; }
  .b-parknow-over .b__text p { margin-top: -9px; }
  .b-parknow-over .b__text + .b__text { margin-top: 15px; }

  .case .b-parknow-discovery { height: 368px; }
  .case .b-parknow-discovery .b__inner { padding-top: 11px; }
  .b-parknow-discovery .b__text h2 { height: 59px; line-height: 59px; }
  .b-parknow-discovery .b__text p { margin-top: -9px; }
  .b-parknow-discovery .b__fig { height: 185px; margin-top: 22px; }
  .b-parknow-discovery .b__fig img { height: 185px; }

  .case .b-parknow-userflow { height: 294.744px; }
  .case .b-parknow-userflow .b__inner { padding-top: 20px; }
  .b-parknow-userflow .b__text h2 { height: 59px; line-height: 59px; }
  .b-parknow-userflow .b__text p { margin-top: -9px; }
  .b-parknow-userflow .b__fig { height: 112.744px; margin-top: 0; }
  .b-parknow-userflow .b__fig img { height: 112.744px; }

  .case .b-parknow-wireframes { height: 651.5px; }
  .case .b-parknow-wireframes .b__inner { padding-top: 17.5px; }
  .b-parknow-wireframes .b__text h2 { height: 46px; line-height: 23px; }
  .b-parknow-wireframes .b__text p { margin-top: 13.5px; }
  .b-parknow-wireframes .b__fig { height: 378px; margin-top: 25px; }
  .b-parknow-wireframes .b__fig img { height: 378px; }

  .case .b-parknow-decisions { height: 423.5px; }
  .case .b-parknow-decisions .b__inner { padding-top: 17.5px; }
  .b-parknow-decisions .b__text h2 { height: 59px; line-height: 59px; }
  .b-parknow-decisions .b__text ul {
    margin-top: -9px;
    padding-left: 18px;
  }
  .case .b-parknow-decisions .b__text li { line-height: 28px; }

  .case .b-parknow-confidence { height: 166px; }
  .case .b-parknow-confidence .b__inner { padding-top: 17.5px; }
  .b-parknow-confidence .b__text h2 { height: 46px; line-height: 23px; }
  .b-parknow-confidence .b__text p { margin-top: 13.5px; }

  .case .b-parknow-cards { height: 607.188px; }
  .case .b-parknow-cards .b__inner {
    width: 340.44px;
    gap: 17.142px;
  }
  .case .b-parknow-cards .b__fig { width: 340px; }
  .b-parknow-cards .b__fig:nth-child(1) { width: 340.44px; height: 170.934px; }
  .b-parknow-cards .b__fig:nth-child(2) { height: 170.855px; }
  .b-parknow-cards .b__fig:nth-child(3) { height: 199.109px; }
  .b-parknow-cards .b__fig img { width: 100%; height: 100%; object-fit: fill; }

  .case .b-parknow-errors { height: 424.702px; }
  .case .b-parknow-errors .b__inner { padding-top: 17.5px; }
  .b-parknow-errors .b__text h2 { height: 46px; line-height: 23px; }
  .b-parknow-errors .b__text p { margin-top: 13.5px; }
  .case .b-parknow-errors .b__fig {
    width: 340px;
    height: 203.702px;
    margin-top: 20px;
  }
  .b-parknow-errors .b__fig img { height: 203.702px; }

  .case .b-parknow-path { height: 395.855px; }
  .case .b-parknow-path .b__inner { padding-top: 17.5px; }
  .b-parknow-path .b__text h2 { height: 46px; line-height: 23px; }
  .b-parknow-path .b__text p { margin-top: 13.5px; }
  .case .b-parknow-path .b__fig {
    width: 340px;
    height: 174.855px;
    margin-top: 20px;
  }
  .b-parknow-path .b__fig img { height: 174.855px; }

  .case .b-parknow-outcome { height: 402.511px; }
  .case .b-parknow-outcome .b__inner {
    width: 309px;
    margin-left: calc(50% - 170.22px);
    padding: 29px 16px 0;
  }
  .b-parknow-outcome .b__text h2 { height: 23px; line-height: 23px; }
  .case .b-parknow-outcome .b__text > p:first-of-type { margin-top: 25px; }
  .case .b-parknow-outcome .b__text > p:nth-of-type(2) { margin-top: 16px; }
  .b-parknow-outcome .b__text ul { margin: 0; padding: 0; list-style: none; }

  .case .o-parknow {
    height: 130px;
    min-height: 130px;
    padding: 22px 0 0;
    gap: 16.787px;
    box-sizing: border-box;
  }
  .case .o-parknow .case-author { gap: 11.541px; }
  .case .o-parknow .case-author__card { gap: 4.197px; }
  .case .o-parknow .case-author__photo { width: 18px; height: 18px; }
  .case .o-parknow .case-author__lines { width: 48px; gap: 0; }
  .case .o-parknow .case-author__role--desktop-only { display: none; }
  .case .o-parknow .case-author__lines p,
  .case .o-parknow .case-author__year { font-size: 5px; line-height: 7px; }
  .case .o-parknow .case-outro__thanks { font-size: 10px; line-height: 7px; }

  /* --- футер (4215:31719) --- */
  .case-outro { padding: 15px 0; gap: 16px; }
  .case-outro .case-author { gap: 11px; }
  .case-outro .case-author__card { gap: 4px; }
  .case-outro .case-author__photo { width: 18px; height: 18px; border-radius: 4px; }
  .case-outro .case-author__lines { width: 48px; gap: 1px; }
  .case-outro .case-author__lines p,
  .case-outro .case-author__year { font-size: 7px; line-height: 7px; }

  .footer { padding-block: 13px; }   /* 4215:31719: высота 67 при строке 40 */
  .footer__inner {
    width: 100%;
    height: auto;
    padding-inline: 28px;
    gap: 12px;
  }
  .footer__links {
    width: auto;
    min-width: 0;
    flex: 1;
    gap: 16px;
    justify-content: space-between;
  }
  .footer__link {
    min-width: 0;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: -.3px;
    white-space: nowrap;
  }
}

@media (max-width: 350px) {
  .pn-hero { transform: translateX(calc((100vw - 375px) / 2)); }
  .case .b-parknow-cards,
  .case .b-parknow-errors,
  .case .b-parknow-path { height: auto; }
  .case .b-parknow-cards { padding-bottom: 32px; }
  .case .b-parknow-cards .b__inner,
  .case .b-parknow-cards .b__fig,
  .case .b-parknow-errors .b__fig,
  .case .b-parknow-path .b__fig { width: calc(100vw - 34px); height: auto; }
  .b-parknow-cards .b__fig img,
  .b-parknow-errors .b__fig img,
  .b-parknow-path .b__fig img { height: auto; }
  .case .b-parknow-errors,
  .case .b-parknow-path { padding-bottom: 32px; }
  .case .b-parknow-outcome .b__inner { margin-inline: auto; }
}