/* Страницы Мил-специалистов /mily/<slug>/ и каталог /mily/ · 17.10.2026 · Вебмастер · tools/build_mily.py
   База — /assets/dlya/dlya.css (токены, кнопки, сетки, чат). Здесь — только своё: витрина-карточка, задачи, навыки, каталог. */
.mk{--p1:#d9f5ef;--p2:#b5e9df;--ink2:#134e4a;position:relative;width:100%;max-width:400px;margin:0 auto;aspect-ratio:928/1152;border-radius:28px;
 background:linear-gradient(165deg,#fff 0%,var(--p1) 38%,var(--p2) 100%);box-shadow:0 28px 60px -24px rgba(19,78,74,.38),inset 0 0 0 1px rgba(255,255,255,.7);
 display:flex;flex-direction:column;padding:7% 8% 8%;overflow:hidden;transition:transform .5s var(--ez)}
.mk:hover{transform:translateY(-4px) rotate(-.6deg)}
.mk-mint{--p1:#dcf6f0;--p2:#b3eadf}.mk-sand{--p1:#fbefdf;--p2:#f1d9b8}.mk-rose{--p1:#fbe6ec;--p2:#f3c6d3}
.mk-sky{--p1:#e2f0fb;--p2:#bcdcf3}.mk-lilac{--p1:#eee8fa;--p2:#d5c9f1}.mk-lemon{--p1:#fbf6dc;--p2:#f1e5a8}
.mk-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2)}
.mk-head b{color:var(--gold-dark)}
.mk-win{flex:1;margin:7% 0 6%;border-radius:22px;background:rgba(255,255,255,.62);box-shadow:inset 0 0 0 2px rgba(255,255,255,.9),inset 0 14px 26px -16px rgba(19,78,74,.35);
 display:grid;place-items:center;position:relative;overflow:hidden}
.mk-win::after{content:"";position:absolute;inset:-40% auto -40% -30%;width:38%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:rotate(18deg);animation:mkg 6s ease-in-out infinite}
@keyframes mkg{0%,55%{left:-40%}100%{left:130%}}
.mk-ic{font-size:clamp(64px,22cqw,112px);line-height:1;filter:drop-shadow(0 10px 14px rgba(19,78,74,.18));animation:float 5s ease-in-out infinite}
.mk{container-type:inline-size}
.mk-name{font-size:clamp(20px,8cqw,30px);font-weight:850;line-height:1.1;color:var(--ink2);letter-spacing:-.01em}
.mk-role{margin-top:6px;font-size:clamp(12.5px,3.9cqw,15px);color:#3d524f;line-height:1.35}
.mk-sm{max-width:none;border-radius:18px;padding:9% 9% 10%}
.mk-sm .mk-head{font-size:10px}.mk-sm .mk-win{margin:8% 0 7%;border-radius:0;background:none;box-shadow:none;overflow:visible}.mk-sm .mk-win::after{display:none}
.mk-img{display:block;width:100%;max-width:400px;margin:0 auto;height:auto;aspect-ratio:928/1152;object-fit:cover;border-radius:28px;box-shadow:0 28px 60px -24px rgba(19,78,74,.38)}
/* что делает */
.what{margin-top:30px;display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:start}
.what-big{font-size:clamp(19px,2.3vw,24px);font-weight:700;line-height:1.45;color:var(--ink);background:#fff;border-radius:22px;padding:26px;border:1.5px solid var(--teal-line)}
.what ul{list-style:none;display:grid;gap:10px}
.what li{background:#fff;border-radius:14px;padding:12px 14px 12px 44px;position:relative;font-size:15.5px;border:1px solid rgba(153,246,228,.8)}
.what li i{position:absolute;left:14px;top:11px;font-style:normal}
.now{margin-top:18px;font-size:15.5px;color:var(--teal-deep);font-weight:700;display:flex;gap:10px;align-items:flex-start}
/* первые задачи */
.tasks3{list-style:none;display:grid;gap:14px;counter-reset:t}
.tasks3 li{background:#fff;border-radius:18px;padding:18px 18px 18px 66px;position:relative;border:1.5px solid var(--teal-line);font-size:16.5px;font-weight:700;color:var(--teal-deep);line-height:1.4}
.tasks3 li::before{counter-increment:t;content:counter(t);position:absolute;left:18px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:800;font-size:16px}
.tasks3 li:nth-child(3)::before{background:var(--gold-dark)}
/* навыки */
.skills{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.skills .chip{font-size:15px}
.skills span.chip{border-style:dashed;color:var(--ink)}
.skills .chip:hover{transform:none}.skills a.chip:hover{transform:translateY(-2px)}
.snote{margin-top:16px;color:var(--muted);font-size:15px;max-width:70ch}
/* для кого / команды */
.whobox p{font-size:17px;line-height:1.55}
.teams{list-style:none;display:grid;gap:10px}
.teams a{display:flex;gap:10px;align-items:center;font-weight:700;color:var(--teal-deep)}
.teams a::after{content:"→";margin-left:auto;transition:transform .25s var(--ez)}
.teams a:hover::after{transform:translateX(4px)}
.detail{display:inline-flex;margin-top:14px;font-weight:700}
/* бюджет */
.bud{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;justify-content:space-between;background:var(--gold-bg);border-radius:22px;padding:24px 26px;margin-top:8px}
.bud p{max-width:58ch;color:var(--ink);font-size:16px}
/* каталог */
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:18px;margin-top:30px}
.mcard{display:flex;flex-direction:column;background:#fff;border-radius:22px;padding:14px 14px 18px;border:1.5px solid rgba(153,246,228,.9);color:var(--ink);transition:transform .3s var(--ez),box-shadow .3s var(--ez),border-color .3s}
.mcard:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(19,78,74,.12);border-color:var(--teal)}
.mcard:active{transform:scale(.98)}
.mcard .mk,.mcard .mk-img{max-width:none;border-radius:16px;box-shadow:none}
.mcard h3{font-size:19px;color:var(--teal-deep);margin:14px 4px 4px}
.mcard p{font-size:14.5px;color:var(--muted);margin:0 4px;line-height:1.45}
.mcard .more{margin:10px 4px 0;font-size:14px;font-weight:700;color:var(--teal-dark)}
.rel a.hb-x{flex-direction:column;align-items:flex-start;gap:4px}
.rel a.hb-x span{font-size:13.5px;font-weight:400;color:var(--muted);line-height:1.45}
.hwho{margin-top:14px;font-size:16px;color:var(--muted);max-width:52ch}.hwho b{color:var(--teal-deep)}
@media(max-width:960px){.what{grid-template-columns:1fr}.mk{max-width:340px}}
@media(max-width:480px){.mk{max-width:300px}.tasks3 li{font-size:15.5px;padding-left:60px}.bud{padding:20px}}
@media (prefers-reduced-motion:reduce){.mk-win::after{display:none}}