/* Реклама на сайте (/advertising.html), 11.10.2026, шестая итерация.
   Тёмные блоки - поддерево data-theme="dark", форма внутри - data-theme="light":
   токены cf-* переключаются сами. Картинки форматов - настоящие страницы
   сайта с примером рекламы. */

*,*::before,*::after{box-sizing:border-box}
body.mk-body{margin:0;background:var(--cf-canvas);color:var(--cf-ink);font-family:var(--font-sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.mk-body ::selection{background:var(--cf-accent-soft);color:var(--cf-ink)}
html{scroll-padding-top:calc(var(--ad-head, 70px) + 64px);scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.mk{padding-bottom:64px;color:var(--cf-ink)}
.mk-wrap{max-width:var(--cf-content-max);margin:0 auto;padding-left:var(--cf-space-24);padding-right:var(--cf-space-24)}
.mk [hidden],.js .mk [data-hide]{display:none!important}
.mk a:focus-visible,.mk button:focus-visible,.mk [tabindex]:focus-visible,.mk select:focus-visible,.mk summary:focus-visible{outline:2px solid var(--cf-accent);outline-offset:2px}
.mk-press{transition:transform var(--cf-dur-press) var(--cf-ease),background-color var(--cf-dur) ease,color var(--cf-dur) ease}
.mk-press:active{transform:scale(.97)}
.mk .cf-btn svg{margin-left:var(--cf-space-6)}

.mk-h2{margin:0;font-size:30px;line-height:1.15;font-weight:700;letter-spacing:-.03em;text-wrap:balance;color:var(--cf-ink)}
.mk-sub{margin:var(--cf-space-8) 0 0;font-size:15.5px;line-height:1.5;color:var(--cf-ink-2);max-width:68ch}
.mk-head{margin-bottom:var(--cf-space-24)}
.mk-sec{margin-top:72px}
.mk-chips{display:flex;flex-wrap:wrap;gap:var(--cf-space-6)}
.mk-chip{display:inline-flex;align-items:center;min-height:28px;padding:0 var(--cf-space-12);border-radius:var(--cf-radius-pill);
  background:var(--cf-surface-2);font-size:13px;font-weight:600;color:var(--cf-ink-2)}
.mk-scope{display:inline-flex;align-self:flex-start;align-items:center;min-height:24px;padding:0 var(--cf-space-10);border-radius:var(--cf-radius-pill);
  background:var(--cf-accent-soft);color:var(--cf-accent);font-size:12px;font-weight:600}

/* Задача формата (идея Т-Ж): цвет - токены видов */
.mk-task{flex:none;display:inline-flex;align-items:center;min-height:22px;padding:0 var(--cf-space-8);border-radius:var(--cf-radius-pill);font-size:11.5px;font-weight:600}
.mk-task--reach{background:var(--cf-accent-soft);color:var(--cf-accent)}
.mk-task--image{background:var(--cf-violet-soft);color:var(--cf-violet)}
.mk-task--news{background:var(--cf-amber-soft);color:var(--cf-amber)}
.mk-task--leads{background:var(--cf-teal-soft);color:var(--cf-teal)}
.mk-task--idea{background:var(--cf-surface-2);color:var(--cf-ink-2)}

/* ── первый экран ──────────────────────────────────────────────── */
.mk-hero{background:var(--cf-surface);border-bottom:1px solid var(--cf-line);overflow:hidden}
.mk-hero__grid{display:grid;grid-template-columns:minmax(0,11fr) minmax(0,10fr);gap:var(--cf-space-44);align-items:center;
  padding-top:var(--cf-space-24);padding-bottom:56px}
.mk-crumbs{margin-bottom:var(--cf-space-28)}
.mk-hero h1{margin:0;font-size:clamp(34px,3.6vw,48px);line-height:1.06;font-weight:700;letter-spacing:-.035em;text-wrap:balance;color:var(--cf-ink)}
.mk-hero h1 span,.mk-hero h1 em{display:block}
.mk-hero h1 em{font-style:normal;color:var(--cf-accent);white-space:nowrap}
.mk-lead{margin:var(--cf-space-18) 0 0;font-size:17px;line-height:1.55;color:var(--cf-ink-2);max-width:48ch;text-wrap:pretty}
.mk-cta{display:flex;flex-wrap:wrap;gap:var(--cf-space-10);margin-top:var(--cf-space-24)}
.mk-hero__pts{list-style:none;margin:var(--cf-space-28) 0 0;padding:var(--cf-space-20) 0 0;border-top:1px solid var(--cf-line);display:flex;flex-direction:column;gap:var(--cf-space-10)}
.mk-hero__pts li{display:flex;gap:var(--cf-space-10);align-items:flex-start;font-size:14px;line-height:1.45;color:var(--cf-ink-2)}
.mk-hero__pts svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--cf-accent)}
.mk-hero__pts b{color:var(--cf-ink);font-weight:600}

.mk-stage{position:relative;aspect-ratio:1.2;min-width:0}
.mk-shot{position:absolute;overflow:hidden;background:var(--cf-canvas);box-shadow:inset 0 0 0 1px var(--cf-line-strong),var(--cf-shadow-modal)}
.mk-shot img{display:block;width:100%;height:auto}
.mk-shot--desk{top:6%;right:0;width:90%;border-radius:var(--cf-radius-lg)}
.mk-shot__bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 var(--cf-space-12);background:var(--cf-surface-2);border-bottom:1px solid var(--cf-line)}
.mk-shot__bar i{width:8px;height:8px;border-radius:50%;background:var(--cf-line-strong)}
.mk-shot__bar span{margin-left:var(--cf-space-10);font-size:11.5px;color:var(--cf-ink-3)}
.mk-shot--phone{left:0;bottom:0;width:29%;border-radius:22px;box-shadow:0 0 0 6px var(--cf-surface-3),0 0 0 7px var(--cf-line-strong),var(--cf-shadow-modal)}
.mk-pin{position:absolute;display:flex;flex-direction:column;align-items:flex-start;gap:var(--cf-space-6)}
.mk-pin__lbl{display:inline-flex;align-items:center;min-height:26px;padding:0 var(--cf-space-10);border-radius:var(--cf-radius-pill);
  background:var(--cf-tooltip-bg);color:var(--cf-tooltip-ink);font-size:12px;font-weight:600;box-shadow:var(--cf-shadow-popover);white-space:nowrap}
.mk-pin__card{display:flex;align-items:center;gap:var(--cf-space-10);padding:var(--cf-space-10) var(--cf-space-14);border-radius:var(--cf-radius-md);
  background:var(--cf-accent-fill);color:var(--cf-on-accent);box-shadow:0 0 0 4px var(--cf-accent-ring),var(--cf-shadow-popover)}
.mk-pin__card b{display:block;font-size:13.5px;font-weight:600}
.mk-pin__card small{display:block;font-size:11.5px;opacity:.85}
.mk-pin__logo{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--cf-radius-sm);background:var(--cf-on-accent);color:var(--cf-accent-fill);font-size:10.5px;font-weight:700}
.mk-pin--partner{top:0;right:2%;align-items:flex-end}
.mk-pin--card{left:18%;bottom:44%}
.mk-pin--native{right:4%;bottom:6%;align-items:flex-end}
.mk-pin__card--native{flex-direction:column;align-items:flex-start;gap:3px;min-width:200px;background:var(--cf-surface);color:var(--cf-ink);
  box-shadow:inset 0 0 0 1.5px var(--cf-accent),0 0 0 4px var(--cf-accent-ring),var(--cf-shadow-popover)}
.mk-pin__card--native small{color:var(--cf-ink-2);opacity:1}
.mk-pin__btn{margin-top:var(--cf-space-6);display:inline-flex;align-items:center;min-height:26px;padding:0 var(--cf-space-12);border-radius:var(--cf-radius-pill);
  background:var(--cf-accent-fill);color:var(--cf-on-accent);font-size:11.5px;font-weight:600}
.mk-pin__mark{position:absolute;right:var(--cf-space-12);bottom:var(--cf-space-10);font-size:10.5px;color:var(--cf-ink-3)}
@media (prefers-reduced-motion:no-preference){
  .mk-shot,.mk-pin{animation:mk-rise 700ms cubic-bezier(.23,1,.32,1) both}
  .mk-shot--phone{animation-delay:90ms}
  .mk-pin--partner{animation-delay:360ms}.mk-pin--card{animation-delay:460ms}.mk-pin--native{animation-delay:560ms}
}
@keyframes mk-rise{from{opacity:0;transform:translateY(14px);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}

/* ── меню страницы ─────────────────────────────────────────────── */
.mk-nav{position:sticky;top:var(--ad-head, 70px);z-index:30;background:var(--cf-header-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--cf-line)}
.mk-nav__in{display:flex;align-items:center;justify-content:space-between;gap:var(--cf-space-16);min-height:56px}
.mk-nav__links{display:flex;gap:var(--cf-space-4);overflow-x:auto;scrollbar-width:none}
.mk-nav__links::-webkit-scrollbar{display:none}
.mk-nav__links a{flex:none;display:inline-flex;align-items:center;min-height:36px;padding:0 var(--cf-space-14);border-radius:var(--cf-radius-pill);
  color:var(--cf-ink-2);font-size:14px;font-weight:600;text-decoration:none;transition:background-color var(--cf-dur) ease,color var(--cf-dur) ease}
.mk-nav__links a:hover{background:var(--cf-surface-2);color:var(--cf-ink)}
.mk-nav__links a.is-on{background:var(--cf-accent-soft);color:var(--cf-accent)}

/* ── объёмная рамка страницы ───────────────────────────────────── */
.mk-3d{perspective:1800px}
.mk-3d__frame{overflow:hidden;border-radius:var(--cf-radius-lg);background:var(--cf-surface);
  box-shadow:inset 0 0 0 1px var(--cf-line-strong),var(--cf-shadow-modal);
  transform:rotateY(-6deg) rotateX(3deg);transform-origin:60% 50%;transition:transform 700ms cubic-bezier(.23,1,.32,1)}
.mk-3d__bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 var(--cf-space-12);background:var(--cf-surface-2);border-bottom:1px solid var(--cf-line)}
.mk-3d__bar i{width:8px;height:8px;border-radius:50%;background:var(--cf-line-strong)}
.mk-3d__bar span{margin-left:var(--cf-space-10);font-size:11.5px;color:var(--cf-ink-3)}
.mk-3d img{display:block;width:100%;height:auto;aspect-ratio:2.3;object-fit:cover;object-position:top left}
@media (hover:hover) and (pointer:fine){.mk-3d:hover .mk-3d__frame{transform:rotateY(0) rotateX(0)}}

/* ── форматы: проводник ────────────────────────────────────────── */
.mk-x{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--cf-space-24);align-items:stretch;
  padding:var(--cf-space-16);border-radius:var(--cf-radius-xl);background:var(--cf-surface);box-shadow:inset 0 0 0 1px var(--cf-line)}
.mk-x__list{display:flex;flex-direction:column;gap:2px}
.mk-x__list button{flex:1 1 0}
.mk-x__list button{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:var(--cf-space-10);width:100%;
  padding:var(--cf-space-12) var(--cf-space-14);border:0;border-radius:var(--cf-radius-md);background:none;color:var(--cf-ink);
  font:inherit;text-align:left;cursor:pointer;transition:background-color var(--cf-dur) ease}
.mk-x__list button:hover{background:var(--cf-surface-2)}
.mk-x__list button[aria-selected="true"]{background:var(--cf-accent-soft)}
.mk-x__n{font-size:12px;font-weight:600;color:var(--cf-ink-3);font-variant-numeric:tabular-nums}
.mk-x__list button[aria-selected="true"] .mk-x__n{color:var(--cf-accent)}
.mk-x__t b{display:block;font-size:15px;font-weight:600;line-height:1.3}
.mk-x__t small{display:block;margin-top:2px;font-size:13px;color:var(--cf-ink-3)}
.mk-x__stage{min-width:0;padding:var(--cf-space-8) var(--cf-space-8) var(--cf-space-4)}
.js .mk-x__panel.is-in .mk-3d__frame{animation:mk-swap 520ms cubic-bezier(.23,1,.32,1) both}
.js .mk-x__panel.is-in .mk-x__info{animation:mk-in 360ms 60ms cubic-bezier(.23,1,.32,1) both}
@keyframes mk-swap{from{opacity:0;filter:blur(6px);transform:rotateY(-14deg) rotateX(5deg) translateX(18px)}to{opacity:1;filter:blur(0);transform:rotateY(-6deg) rotateX(3deg)}}
.mk-x__info{display:flex;flex-direction:column;gap:var(--cf-space-10);margin-top:var(--cf-space-20)}
.mk-x__head{display:flex;align-items:center;gap:var(--cf-space-10)}
.mk-x__info h3{margin:0;font-size:20px;line-height:1.2;font-weight:700;letter-spacing:-.015em}
.mk-x__info p{margin:0;font-size:15px;line-height:1.55;color:var(--cf-ink-2);max-width:64ch}

/* ── стратегическое партнёрство ───────────────────────────────── */
.mk-strat{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--cf-space-32);align-items:center;
  padding:var(--cf-space-40);border-radius:var(--cf-radius-xl);overflow:hidden;background:var(--cf-surface);
  box-shadow:inset 0 0 0 1px var(--cf-line);color:var(--cf-ink)}
.mk-strat__copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:var(--cf-space-12)}
.mk-strat h2{margin:0;font-size:34px;line-height:1.1;font-weight:700;letter-spacing:-.03em}
.mk-strat p{margin:0;font-size:15.5px;line-height:1.55;color:var(--cf-ink-2)}
.mk-strat__list{list-style:none;margin:var(--cf-space-6) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--cf-space-8) var(--cf-space-16)}
.mk-strat__list li{display:flex;align-items:center;gap:var(--cf-space-8);font-size:14.5px;color:var(--cf-ink)}
.mk-strat__list svg{flex:none;width:18px;height:18px;padding:3px;border-radius:50%;background:var(--cf-accent-soft);color:var(--cf-accent)}
.mk-strat__art{position:static;display:flex;align-items:center;padding-top:var(--cf-space-24)}
.mk-strat__uni{position:absolute;z-index:2;right:-9%;top:-4%;width:34%;height:auto;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,black 62%,transparent 92%);mask-image:linear-gradient(to bottom,black 62%,transparent 92%)}
.mk-3d--strat{position:relative;z-index:1;width:82%}

/* ── вопросы ───────────────────────────────────────────────────── */
.mk-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--cf-space-40);margin-top:var(--cf-space-12)}

/* ── финал: шаги и форма ───────────────────────────────────────── */
.mk-final{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--cf-space-32);align-items:center;
  padding:var(--cf-space-32);border-radius:var(--cf-radius-xl);background:var(--cf-surface);box-shadow:inset 0 0 0 1px var(--cf-line);color:var(--cf-ink)}
.mk-final__copy{display:flex;flex-direction:column;gap:var(--cf-space-14);padding:var(--cf-space-8)}
.mk-final h2{margin:0;font-size:32px;line-height:1.1;font-weight:700;letter-spacing:-.03em}
.mk-final__copy>p{margin:0;font-size:15px;line-height:1.55;color:var(--cf-ink-2)}
.mk-final__steps{list-style:none;counter-reset:st;margin:var(--cf-space-4) 0;padding:0;display:flex;flex-direction:column;gap:var(--cf-space-10)}
.mk-final__steps li{counter-increment:st;display:flex;flex-wrap:wrap;align-items:center;gap:var(--cf-space-4) var(--cf-space-8);font-size:14.5px}
.mk-final__steps li::before{content:counter(st);flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;
  background:var(--cf-accent-fill);color:var(--cf-on-accent);font-size:12px;font-weight:700}
.mk-final__steps b{font-weight:600}
.mk-final__steps span{color:var(--cf-ink-3)}
.mk-mail{display:inline-flex;align-self:flex-start;align-items:center;gap:var(--cf-space-8);min-height:40px;padding:0 var(--cf-space-16);border-radius:var(--cf-radius-pill);
  background:var(--cf-surface-2);color:var(--cf-ink);font-size:15px;font-weight:600;text-decoration:none;transition:background-color var(--cf-dur) ease}
.mk-mail:hover{background:var(--cf-surface-3)}
.mk-mail svg{width:18px;height:18px;color:var(--cf-accent)}
.mk-form-box{padding:var(--cf-space-24);border-radius:var(--cf-radius-lg);background:var(--cf-surface);color:var(--cf-ink);box-shadow:var(--cf-shadow-modal)}
.mk-form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--cf-space-14) var(--cf-space-12)}
.mk-opt{font-weight:400;color:var(--cf-ink-3)}
.mk-select{appearance:none;cursor:pointer;padding-right:36px;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 18px) 52%,calc(100% - 13px) 52%;background-size:5px 5px;background-repeat:no-repeat}
.mk-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.mk-form__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--cf-space-14) var(--cf-space-24);margin-top:var(--cf-space-18)}
.mk-consent{align-items:flex-start;line-height:1.4}
.mk-consent-err{display:block;margin-top:var(--cf-space-8)}
.mk-form .cf-input[aria-invalid="true"]{box-shadow:inset 0 0 0 1px var(--cf-down)}
.mk-form__status{margin:var(--cf-space-8) 0 0;font-size:14px;color:var(--cf-ink-2)}
.mk-form__status:empty{display:none}
.mk-form__status[data-state="error"]{color:var(--cf-down)}
.mk-submit[aria-busy="true"]{opacity:.7;cursor:progress}
.mk-done{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cf-space-16);outline:none;animation:mk-in 260ms cubic-bezier(.23,1,.32,1) both}
.mk-done svg{color:var(--cf-up);flex:none}
.mk-done h3{margin:0;font-size:18px;font-weight:600}
.mk-done p{margin:var(--cf-space-4) 0 0;font-size:15px;color:var(--cf-ink-2)}
.mk-done>div{flex:1 1 240px}
@keyframes mk-in{from{opacity:0;filter:blur(4px);transform:translateY(6px)}to{opacity:1;filter:blur(0);transform:none}}
.mk-pick{animation:mk-pick 900ms cubic-bezier(.23,1,.32,1)}
@keyframes mk-pick{0%,100%{box-shadow:var(--cf-shadow-modal)}35%{box-shadow:0 0 0 4px var(--cf-accent-ring),var(--cf-shadow-modal)}}

.mk-dock{display:none}

/* ── адаптив ───────────────────────────────────────────────────── */
@media (max-width:1100px){
  .mk-hero__grid{grid-template-columns:minmax(0,1fr);gap:var(--cf-space-40)}
  .mk-stage{max-width:720px}
  .mk-nav .cf-btn{display:none}
  .mk-x{grid-template-columns:minmax(0,1fr)}
  .mk-x__list{flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:var(--cf-space-6)}
  .mk-x__list::-webkit-scrollbar{display:none}
  .mk-x__list button{flex:none;width:auto;grid-template-columns:auto auto;border-radius:var(--cf-radius-pill);background:var(--cf-surface-2);padding:var(--cf-space-8) var(--cf-space-14)}
  .mk-x__list .mk-x__n,.mk-x__list small{display:none}
  .mk-x__list button .mk-task{display:none}
  .mk-strat{grid-template-columns:minmax(0,1fr)}
  .mk-strat__art{min-height:0;padding-top:var(--cf-space-20)}
  .mk-strat__uni{width:44%;top:-6%;right:-6%}
  .mk-faq{grid-template-columns:minmax(0,1fr)}
  .mk-final{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
  .mk-wrap{padding-left:var(--cf-space-16);padding-right:var(--cf-space-16)}
  .mk{padding-bottom:96px}
  .mk-hero__grid{padding-top:var(--cf-space-16);padding-bottom:var(--cf-space-32)}
  .mk-crumbs{margin-bottom:var(--cf-space-20)}
  .mk-hero h1{font-size:34px}
  .mk-hero h1 em{white-space:normal}
  .mk-lead{font-size:16px}
  .mk-cta .cf-btn{flex:1 1 100%;justify-content:center}
  .mk-stage{aspect-ratio:1.15}
  .mk-shot--phone,.mk-pin--card{display:none}
  .mk-shot--desk{width:100%;top:13%}
  .mk-pin--native{bottom:0}
  .mk-pin__lbl{font-size:11px;min-height:22px}
  .mk-pin__card{padding:var(--cf-space-8) var(--cf-space-10)}
  .mk-pin__card--native{min-width:0}
  .mk-pin--native .mk-pin__btn,.mk-pin--native small{display:none}
  .mk-nav__in{min-height:50px}
  .mk-h2{font-size:25px}
  .mk-sec{margin-top:52px}
  .mk-x{padding:var(--cf-space-10);margin:0 calc(-1 * var(--cf-space-6))}
  .mk-x__stage{padding:var(--cf-space-4) 0 0}
  .mk-3d__frame{transform:none}
  .mk-x__info{margin-top:var(--cf-space-14);padding:0 var(--cf-space-4)}
  .mk-strat{padding:var(--cf-space-24) var(--cf-space-20)}
  .mk-strat h2{font-size:26px}
  .mk-strat__list{grid-template-columns:minmax(0,1fr)}
  .mk-strat__uni{width:60%;top:-10%;right:-14%}
  .mk-3d--strat{width:100%}
  .mk-final{padding:var(--cf-space-20);gap:var(--cf-space-20)}
  .mk-final h2{font-size:26px}
  .mk-form-box{padding:var(--cf-space-16)}
  .mk-form__grid{grid-template-columns:minmax(0,1fr)}
  .mk-form .cf-input{font-size:16px}
  .mk-submit{flex:1 1 100%;justify-content:center}
  .mk-dock{display:block;position:fixed;left:0;right:0;bottom:0;z-index:var(--cf-z-sticky);
    padding:var(--cf-space-10) var(--cf-space-16) calc(var(--cf-space-10) + env(safe-area-inset-bottom));
    background:var(--cf-header-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--cf-line);
    transform:translateY(110%);transition:transform 220ms cubic-bezier(.23,1,.32,1)}
  .mk-dock.is-on{transform:translateY(0)}
  .mk-dock .cf-btn{width:100%;justify-content:center}
  body.mk-docked .cf-feedback{bottom:calc(72px + env(safe-area-inset-bottom));transition:bottom 220ms cubic-bezier(.23,1,.32,1)}
}
@media (prefers-reduced-motion:reduce){
  .mk-done,.mk-pick,.js .mk-x__panel.is-in .mk-3d__frame,.js .mk-x__panel.is-in .mk-x__info{animation:none}
  .mk-press:active{transform:none}
  .mk-3d__frame{transition:none}
}