/* Блок 7 главной маклеров «Z praxe» (#z-praxe) — 03.11 (решения realtors-block7-case-mr-flow-3, realtors-block7-mr-face-ok,
   realtors-marketing-not-video, realtors-block7-reel-frame-his-pick, realtors-block7-anonymous-case; идея «Jeden Instagram, dvě cesty», его «да» 12:18).
   Два настоящих ролика Makers Reality (июнь 2026, архив брата — runs/mr-case-20261103/NOTES.md): путь 1 — Direct вручную
   (серый), путь 2 — бот ManyChat (синий). Одна структура строк у обоих путей (Outcrowd 26659174: два бара одной
   структуры, как 117/56 блока 2); коралла нет (13:18 — тон к MR нейтральный). Вывод — от маркетинга, не от видео (12:12
   его «не видео приводит людей, а маркетинг»). Мобилка 390 первой.
   14:00 (его «кадр уебанский и мокап уебанский» 13:50 → «да, но рилс давай я выберу сам» 13:53 → «2»): телефон прямой и
   крупный в плитке, срезан её нижним краем (Outcrowd 27151963 — «телефон обрезан нижней кромкой плитки»); плашка итога
   лежит на срезе. 14:14 его «Да, делаем анонимно» (запрет конкуренции MR): без имени, Влада и вывески — в телефонах
   экраны Instagram Direct в настоящем масштабе, версия с кадрами рилсов — blok7/mr/. */
@media (max-width:1023px){.b6{margin-bottom:0}}   /* блок 6 больше не последний: место под липкую кнопку — у блока 7 */
.b7{position:relative;margin:12px 12px 96px;padding:32px 20px 28px;border-radius:24px;background:#fff;scroll-margin-top:12px;
  box-shadow:0 0 0 1px var(--rule),0 30px 60px -40px rgba(15,23,42,.25)}
.b7-eye{font-size:14px;font-weight:500;line-height:1.55;color:var(--muted)}
.b7-h{margin-top:8px;font-size:30px;font-weight:500;line-height:1.12;letter-spacing:-.03em;text-wrap:balance}
.b7-h mark{color:var(--ink);background:linear-gradient(transparent 60%,var(--mark) 60%,var(--mark) 90%,transparent 90%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.b7-lead{margin-top:16px;font-size:16px;line-height:1.55;color:var(--muted);text-wrap:pretty}
.b7 .nw{white-space:nowrap}

/* путь: метка, имя кампании, её призыв, плитка с телефоном, строки — у обоих путей одни строки в одном порядке */
.b7-ways{margin-top:28px}
.b7-w+.b7-w{margin-top:36px;padding-top:32px;border-top:1px solid var(--rule)}
.b7-tag{display:inline-block;padding:4px 10px 5px;border-radius:8px;background:#E9EDF4;color:var(--muted);font-size:13px;font-weight:500;
  line-height:1.35}
.b7-w.on .b7-tag{background:var(--tint);color:#1B45B0}
.b7-w h3{margin-top:10px;font-size:22px;font-weight:500;line-height:1.25;letter-spacing:-.02em}
.b7-q{margin-top:6px;font-size:15px;line-height:1.45;color:var(--muted);text-wrap:pretty}   /* призыв кампании — его подпись к ролику и призыв рилса, по-чешски */
.b7-row{margin-top:20px}

/* плитка: телефон по центру, сверху воздух, низ телефона уходит за нижний край плитки — видны верх экрана,
   шапка и главное экрана (две переписки без ответа, второе сообщение бота) — выше плашки на срезе: shoot.py меряет key_gap;
   высота плитки — от масштаба телефона --s (срез на 636 pt экрана — граница строк входящих, аудит apple-design v18) */
.b7-fig{position:relative;--s:.3077}   /* 212 / 689 */
.b7-st{position:relative;height:calc(26px + 1011px * var(--s));overflow:hidden;border-radius:18px;
  background:linear-gradient(180deg,#F3F5F9,#E3E8F0)}
.b7-w.on .b7-st{background:linear-gradient(180deg,#EAF0FD,#D2DFFA)}
/* телефон — фото Silver 17 Pro прямо (ChatGPT, mockups/gpt5/v1.png → prep_mock.py → phone-17pro-front.*), слои как в
   хиро: тень → экран → фото с прозрачным экраном. Экран фото — прямоугольник 628 × 1299 (30, 22) со скруглением 78;
   экран 402 × 834 «точек» (та же пропорция, без растяжения) встаёт в него с запасом 2 px: ×1,5522, скругление 49 —
   13:41 его «обрезка фото кривая»: shoot.py bleed() держит, что за силуэтом корпуса нет ни пикселя экрана */
.b7-ph{position:absolute;left:50%;top:26px;width:calc(689px * var(--s));aspect-ratio:689/1356;margin-left:calc(-344.5px * var(--s))}
.b7-mk{position:absolute;left:0;top:0;width:689px;height:1356px;transform:scale(var(--s));transform-origin:0 0}
.b7-mk>img{position:absolute;left:0;top:0;width:689px;height:1356px}
.b7-mk .msh{opacity:.4;filter:blur(40px);transform:translate(0,32px)}
.b7-mk .mfr{pointer-events:none}
.b7-scr{position:absolute;left:0;top:0;width:402px;height:834px;border-radius:49px;overflow:hidden;background:#fff;
  transform-origin:0 0;transform:translate(32px,24px) scale(1.5522)}

/* экраны Instagram Direct (iOS, светлая тема) — в «точках» экрана 402 × 834, как на телефоне; 14:14 его «Да, делаем
   анонимно»: имён нет — серые полосы на месте имён и аккаунта, аватарки — стандартные серые Instagram. Путь 1 — входящие
   кабинета 23.06 (9 переписок архива: две без ответа сверху, жирным с синей точкой; «Vy: …» — ответы через 1–6 дней);
   путь 2 — что видит человек после комментария «CHCI»: два сообщения бота с кнопками (схема 05-manychat, переведено) */
.ig{position:absolute;inset:0;background:#fff;color:#000;font:400 15px/1.33 -apple-system,"SF Pro Text","Helvetica Neue",Arial,sans-serif}
.ig svg{fill:none;stroke:#000;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ig-sb{position:absolute;left:0;right:0;top:15px;display:flex;justify-content:space-between;align-items:center;padding:0 30px 0 44px}
.ig-sb b{font-size:17px;font-weight:600;letter-spacing:-.01em}
.ig-sb svg{width:72px;height:13px;fill:#000;stroke:none}
.ig-nm{display:block;height:11px;border-radius:6px;background:#DBDBDB}   /* имя скрыто */
.ig-av{flex:none;display:grid;place-items:end center;overflow:hidden;width:56px;height:56px;border-radius:50%;background:#DBDBDB}
.ig-av svg{width:76%;height:76%;fill:#fff;stroke:none}
.ig-hd{position:absolute;left:0;right:0;top:58px;display:flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 10px}
.ig-hd .ig-bk{width:28px;height:28px}
.ig-hd>svg:not(.ig-bk){width:27px;height:27px}
.ig-cv{width:18px!important;height:18px!important;margin-left:-4px}
.ig-me{width:118px;height:13px;background:#CFCFCF}
.ig-ed,.ig-ph{margin-left:auto}
.ig-sr{position:absolute;left:16px;right:16px;top:110px;display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:12px;
  background:#EFEFEF;color:#737373;font-size:16px}
.ig-sr svg{width:18px;height:18px;stroke:#737373}
.ig-tb{position:absolute;left:16px;right:16px;top:166px;display:flex;justify-content:space-between;font-size:16px}
.ig-tb b{font-weight:700}.ig-tb span{color:#0095F6;font-weight:600}
.ig-ls{position:absolute;left:0;right:0;top:204px;margin:0;padding:0;list-style:none}
.ig-row{display:flex;align-items:center;gap:12px;height:72px;padding:0 16px}
.ig-row>span{flex:1;min-width:0}
.ig-row .ig-nm{margin:2px 0 7px}
.ig-row em{display:flex;font-style:normal;color:#737373;white-space:nowrap}   /* текст режется многоточием, время видно всегда */
.ig-row em span{overflow:hidden;min-width:0;text-overflow:ellipsis}
.ig-row em s{flex:none;white-space:pre;text-decoration:none}
.ig-new .ig-nm{background:#BDBDBD}.ig-new em{color:#000;font-weight:600}
.ig-dot{flex:none;width:9px;height:9px;border-radius:50%;background:#0095F6}
.ig-cam{flex:none;width:26px;height:26px;stroke:#737373!important}
/* переписка */
.ig-th .ig-hd{gap:10px;padding-bottom:6px;border-bottom:.5px solid #DBDBDB;height:50px;top:52px}
.ig-th .ig-hd .ig-av{width:34px;height:34px}
.ig-th .ig-hd .ig-ph{margin-left:auto}
.ig-tm{position:absolute;left:0;right:0;top:126px;text-align:center;color:#737373;font-size:12px;font-weight:600}
.ig-cx{position:absolute;left:58px;top:152px;color:#737373;font-size:12px}
.ig-qt{position:absolute;left:58px;top:172px;padding:6px 12px;border-left:3px solid #DBDBDB;color:#737373;font-size:14px}
.ig-g{position:absolute;left:12px;display:flex;align-items:flex-end;gap:8px;width:290px}
.ig-g:nth-of-type(1){top:212px}
.ig-th .ig-g .ig-av{width:28px;height:28px}
.ig-card{overflow:hidden;border-radius:20px;background:#EFEFEF;padding:10px 14px 0}
.ig-card b{display:block;margin:10px -14px 0;padding:11px 0 12px;border-top:.5px solid #D2D2D2;text-align:center;font-weight:600;color:#0095F6}
.ig-me-b{position:absolute;right:12px;top:388px;padding:9px 14px;border-radius:20px;color:#fff;background:linear-gradient(135deg,#7B3CF3,#3B82F6)}
.ig-g.dm-key{top:442px}

/* итог пути — объёмная плашка на нижнем срезе плитки, вылет влево 8 (как плашки блока 2 и хиро); 14:10 — в одну строку
   (цифра и подпись рядом), над срезом ≈ 36 px: v14 в столбик закрывала «10.000.000 KČ»; строки ниже — путь, плашка — итог */
.b7-res{position:absolute;left:-8px;bottom:-20px;z-index:2;display:flex;align-items:center;gap:10px;width:max-content;max-width:220px;
  padding:9px 14px 10px 12px;border-radius:14px;background:linear-gradient(180deg,#fff 40%,#F3F5F9);
  box-shadow:inset 1px 1px 0 #fff,0 0 0 1px var(--rule),1px .4px 0 #CCD5E2,2px .8px 0 #CCD5E2,3px 1.2px 0 #CCD5E2,4px 1.6px 0 #CCD5E2,
  5px 2px 0 #B3BFD0,12px 18px 26px -12px rgba(15,23,42,.38)}
.b7-res b{font-size:30px;font-weight:500;line-height:1.05;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--muted)}
.b7-w.on .b7-res b{color:var(--base2)}
.b7-res span{max-width:118px;font-size:13px;line-height:1.3;color:var(--muted)}

/* строки пути: подпись мелко, значение — тело; у пути 2 значения синие там, где цифра */
.b7-dl{margin:40px 0 0}
.b7-dl>div+div{margin-top:14px;padding-top:14px;border-top:1px solid var(--rule)}
.b7-dl dt{font-size:13px;line-height:1.35;color:var(--muted)}
.b7-dl dd{margin:2px 0 0;font-size:18px;font-weight:500;line-height:1.35;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.b7-dl dd small{display:block;margin-top:2px;font-size:13px;font-weight:400;line-height:1.4;letter-spacing:0;color:var(--muted);text-wrap:pretty}   /* одна главная величина на строку — сравнить пути за 3 с */
.b7-dl dd{color:var(--muted)}   /* аудит v2: путь 1 — нейтральный серый, путь 2 — синий (как 117 / 56 блока 2) */
.b7-w.on .b7-dl dd{color:#1B45B0}.b7-w.on .b7-dl dd small{color:var(--muted)}

/* вывод и путь к шагу 3 (#jak-to-funguje) */
.b7-sum{margin-top:32px;padding-top:28px;border-top:1px solid var(--rule);font-size:18px;font-weight:500;line-height:1.4;letter-spacing:-.01em;
  text-wrap:pretty}
.b7-go{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:12px;color:#1B45B0;font-size:16px;font-weight:500;
  -webkit-tap-highlight-color:transparent}
.b7-go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  transition:transform .2s var(--ease)}
.b7-go:active svg{transform:translateX(3px)}
.b7-go:focus-visible{outline:2px solid var(--base2);outline-offset:3px;border-radius:6px}
@media (hover:hover) and (pointer:fine){.b7-go:hover svg{transform:translateX(3px)}}
.b7-src{margin-top:16px;font-size:13px;line-height:1.5;color:var(--muted);text-wrap:pretty}

/* появление один раз, когда группа в кадре (как блоки 2–6); телефон поднимается из-за среза плитки; без JS и при
   reduced-motion — сразу итог */
@media (prefers-reduced-motion:no-preference){
  .b7-js .b7 .rv{opacity:0;transform:translateY(12px);transition:opacity .44s var(--ease) var(--d,0ms),transform .44s var(--ease) var(--d,0ms)}
  .b7-js .b7 .rv.on{opacity:1;transform:none}
  .b7-js .b7 .b7-ph.rv{opacity:1;transform:translateY(64px);transition:transform .8s var(--ease)}
  .b7-js .b7 .b7-ph.rv.on{transform:none}
  .b7-js .b7 .b7-dl>.rv:nth-child(2){--d:70ms}.b7-js .b7 .b7-dl>.rv:nth-child(3){--d:140ms}.b7-js .b7 .b7-dl>.rv:nth-child(4){--d:210ms}
}

/* планшет 768–1023 — колонка мобилки по центру, как блоки 2–6 */
@media (min-width:768px) and (max-width:1023px){.b7{width:min(640px,calc(100vw - 48px));margin:24px auto 96px;padding:48px 40px 40px}
  .b7-fig{--s:.3774}}   /* 260 / 689 */

/* 03.11 десктоп 1440 (мобилка принята 14:25 его «да»): панель — ширина и скругление хиро и блоков 2–6, шапка сверху (как
   блоки 5–6). Два пути рядом, между ними линия (как пакеты блока 6); метка, имя кампании, призыв, плитка и строки — на
   общих линиях (subgrid), чтобы пути сравнивались по горизонтали. Телефон 260 (как планшет), плитка во всю колонку,
   плашка итога — на срезе у левого края телефона; три строки пути — в ряд под плиткой. 1024–1279 — те же две колонки */
@media (min-width:1024px){
  .b6{margin-bottom:24px}
  .b7{width:min(1360px,calc(100vw - 48px));margin:0 auto 48px;padding:64px 64px 56px;border-radius:28px}
  .b7-eye{font-size:15px}
  .b7-h{max-width:17em;margin-top:16px;font-size:48px;letter-spacing:-.035em;line-height:1.08}
  .b7-h mark{padding:0 .1em;margin:0 -.1em;border-radius:.16em;
    background:linear-gradient(transparent .22em,var(--mark) .22em,var(--mark) calc(100% - .18em),transparent calc(100% - .18em))}
  .b7-lead{max-width:34em;margin-top:24px;font-size:18px}
  .b7-ways{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,auto);column-gap:80px;margin-top:48px;
    padding-top:40px;border-top:1px solid var(--rule)}
  .b7-w{position:relative;display:grid;grid-row:span 4;grid-template-rows:subgrid;align-content:start}
  .b7-w+.b7-w{margin-top:0;padding-top:0;border-top:0}
  .b7-w+.b7-w::before{content:"";position:absolute;top:0;bottom:0;left:-40px;border-left:1px solid var(--rule)}
  .b7-tag{justify-self:start;font-size:14px}
  .b7-w h3{margin-top:14px;font-size:28px;letter-spacing:-.025em}
  .b7-q{margin-top:8px;font-size:17px}
  .b7-row{margin-top:28px}
  .b7-fig{--s:.44}   /* 303 / 689 — аудит design-review d2: 260 в плитке 576 читался иконкой */
  .b7-st{height:calc(36px + 1011px * var(--s));border-radius:22px}
  .b7-ph{top:36px}
  .b7-res{left:calc(50% - 152px - 56px);bottom:-22px;padding:11px 16px 12px 14px}   /* у левого края телефона */
  .b7-res b{font-size:34px}
  .b7-res span{max-width:136px;font-size:14px}   /* «přihlášek do týmu / za 12 dní», как на мобилке */
  .b7-dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin-top:56px}
  .b7-dl>div,.b7-dl>div+div{margin-top:0;padding-top:16px;border-top:1px solid var(--rule)}
  .b7-dl dt{font-size:14px}
  .b7-dl dd{font-size:22px;letter-spacing:-.015em}
  .b7-dl dd small{font-size:14px}
  .b7-sum{margin-top:48px;padding:32px 42% 0 0;font-size:24px;letter-spacing:-.015em}   /* линия — во всю ширину, как над путями; текст ≈ 30em */
  .b7-go{margin-top:20px;font-size:18px}
  .b7-src{max-width:62em;margin-top:24px;font-size:14px}
}
@media (min-width:1024px) and (max-width:1279px){
  .b7{padding:56px 48px 48px}
  .b7-ways{column-gap:64px}.b7-w+.b7-w::before{left:-32px}
  .b7-dl{column-gap:16px}.b7-dl dd{font-size:19px}
  .b7-fig{--s:.3774}.b7-res{left:calc(50% - 130px - 56px)}   /* колонка 408–512: телефон 260, плашка в плитке */
}
