:root { --text:#222; --muted:#767676; --line:#d7d7d7; --soft:#f5f5f5; --blue:#2c6bff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--text); font-family:Inter,Arial,sans-serif; font-size:16px; line-height:1.5; }
button,a { font:inherit; }
button { cursor:pointer; }
.page { max-width:1344px; margin:0 auto; padding:80px 32px; }
.profile { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-bottom:32px; }
.person { display:flex; align-items:flex-start; gap:20px; }
.avatar { width:112px; height:112px; object-fit:cover; border-radius:12px; flex:none; background:var(--soft); }
h1,h2,h3,p { margin:0; }
h1 { font-size:24px; line-height:1.5; font-weight:600; }
.specialty { font-size:20px; line-height:1.6; font-weight:600; }
.tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.tag { display:inline-flex; align-items:center; min-height:36px; padding:6px 12px; background:var(--soft); border-radius:999px; white-space:nowrap; }
.button { border:1px solid var(--line); background:#fff; color:var(--text); min-height:40px; padding:7px 15px 7px 11px; border-radius:12px; display:inline-flex; align-items:center; gap:6px; text-decoration:none; white-space:nowrap; }
.button:hover,.link:hover { color:var(--blue); border-color:var(--blue); }
.button .icon { font-size:22px; line-height:1; }
.button-icon { width:24px; height:24px; flex:none; }
.secondary-button:hover { background:var(--soft); color:var(--text); border-color:var(--line); }
.secondary-button:active { background:#ebebeb; border-color:var(--line); }
.copy-button .button-icon { width:24px; height:24px; opacity:.54; }
.back { padding-left:0; padding-right:0; }
.case-tags { display:flex; flex-wrap:wrap; gap:6px; align-items:flex-start; margin-bottom:12px; }
.case-tags .tags { margin:0; }
.company-tag { display:inline-flex; align-items:center; gap:8px; height:36px; padding:4px 16px 4px 4px; border-radius:9999px; background:var(--soft); }
.company-tag img { width:28px; height:28px; border-radius:9999px; }
.formatted-text ul,.article ol { margin:0; padding-left:24px; }
.formatted-text strong { font-weight:600; }
.intro { max-width:624px; padding-bottom:32px; }
.contacts { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 0 64px; border-top:1px solid var(--line); }
.copy-button { border:0; background:transparent; padding:0; color:var(--muted); display:flex; align-items:center; gap:6px; }
.copy-button:hover { color:var(--text); }
.copy-button:hover .button-icon { opacity:1; }
.copy-button.is-copied,.copy-button.is-copied:hover { color:var(--text); }
.copy-button.is-copied .button-icon,.copy-button.is-copied:hover .button-icon { opacity:1; }
.socials { display:flex; gap:20px; }
.link { color:var(--muted); text-decoration:none; border-bottom:1px solid transparent; }
.cases { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
.case-card { color:inherit; text-decoration:none; min-width:0; }
.case-preview { aspect-ratio:4/3; position:relative; overflow:hidden; background:var(--soft); border-radius:12px; }
.case-preview img { width:84%; height:84%; object-fit:cover; position:absolute; left:8%; top:8%; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.08); transition:transform .25s ease; }
.case-card:hover img { transform:translateY(-4px); }
.case-card .tags { position:absolute; z-index:1; right:16px; top:10px; justify-content:flex-end; margin:0; }
.case-card .tag { background:#fff; border:1px solid var(--line); min-height:32px; padding:4px 11px; }
.case-meta { padding-top:16px; }
.case-description { color:var(--muted); font-size:14px; line-height:1.44; margin-top:4px; }

.case-page { max-width:1344px; margin:0 auto; padding:80px 32px; }
.case-fidelity { position:relative; width:min(100%,1440px); margin:0 auto; line-height:0; }
.case-fidelity > img { display:block; width:100%; height:auto; }
.case-hit { position:absolute; display:block; border:0; background:transparent; cursor:pointer; }
.back-hit { left:4.7%; top:.82%; width:9.8%; height:.42%; }
.telegram-hit { left:41%; bottom:4.9%; width:18%; height:1.1%; }
.next-hit { left:4.7%; bottom:.1%; width:89%; height:.42%; }
.back-wrap { padding-bottom:64px; }
.back { border:0; background:none; color:var(--muted); padding:8px 0; display:flex; align-items:center; gap:6px; border-radius:12px; }
.back:hover { background:transparent; color:var(--text); }
.back .button-icon { opacity:.54; }
.back:hover .button-icon { opacity:1; }
.read-time { color:var(--muted); padding-bottom:32px; }
.case-heading { padding-bottom:64px; }
.case-heading .tags { margin:0 0 12px; }
.case-heading h1 { max-width:624px; }
.role { max-width:624px; margin-top:12px; font-weight:600; }
.lead { max-width:624px; margin-top:12px; }
.article { display:flex; flex-direction:column; gap:64px; padding-bottom:64px; }
.article section { max-width:624px; }
.article h2 { font-size:20px; line-height:1.6; font-weight:600; margin-bottom:24px; }
.article p + p,.article p + ul,.article p + ol,.article ul + p,.article ol + p { margin-top:16px; }
.article ul,.article ol { margin:16px 0 0; padding-left:24px; }
.solutions{max-width:none!important;display:flex;flex-direction:column;gap:24px}.solutions>h2{max-width:624px;margin-bottom:0}.action-blocks{display:flex;flex-direction:column;gap:64px}.action{display:flex;flex-direction:column;gap:32px}.research{max-width:624px;display:flex;flex-direction:column;gap:24px}.research>div{display:flex;flex-direction:column;gap:8px}.result-list{font-weight:600}.shots{width:100%;max-width:1280px;display:grid;gap:32px}.shots.full{grid-template-columns:1fr}.shots.mobile{grid-template-columns:repeat(3,minmax(0,1fr))}.shots.wide-mobile{grid-template-columns:2fr 1fr}.shots img{width:100%;min-width:0;height:auto;object-fit:cover;border:1px solid var(--line);border-radius:12px;background:var(--soft)}.shots.full img{aspect-ratio:auto}.shots.mobile img,.shots.wide-mobile img:not(:first-child){aspect-ratio:360/800}.shots.wide-mobile img:first-child{height:100%}
.cta { min-height:400px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px; padding:32px; text-align:center; background:var(--soft); border-radius:12px; }
.cta .person { align-items:center; flex-direction:column; gap:20px; }
.cta .tags { display:none; }
.accent { color:#fff; background:var(--blue); border-color:var(--blue); padding:8px 12px 8px 16px; }
.accent:hover { color:#fff; background:#1559f7; }
.accent .button-icon { filter:invert(1); }
.next { margin-top:32px; width:100%; justify-content:center; padding:8px 12px 8px 16px; }

@media (max-width:720px) { .page,.case-page{ padding:32px 20px; } .profile,.contacts{ align-items:flex-start; flex-direction:column; } .person{ gap:14px; } .specialty{ font-size:18px; } .contacts{ padding-bottom:40px; } .cases{ grid-template-columns:1fr; gap:28px; } .socials{ gap:16px; } .case-heading,.back-wrap{ padding-bottom:40px; } .article{ gap:40px; } .gallery{ grid-template-columns:1fr; } .gallery img{ min-height:180px; } }