html{scroll-behavior:smooth}body{margin:0;background:#0E1E2D}main{display:block}

/* Ксения Болотова · портфолио. Общие стили сайта: один и тот же блок на каждой странице.
   Цвета и шрифты: тёмно-синий из фото обложки, медный акцент, светлая «бумага» для текстовых разделов. */
.kb{
  --ink:#0E1E2D; --ink2:#15293B; --dline:#22394F;
  --paper:#F3F0EA; --paper2:#EAE4DA; --card:#FBFAF7; --line:#E2DCD2;
  --head:#13202D; --body:#3A4350; --muted:#5E6673;
  --cu:#B4551E; --cud:#E58C52; --tint:#F6E6DA;
  --light:#EEF2F5; --dmuted:#9DB0C2; --soft:#D5DCE3;
  --fd:'Unbounded', 'Arial Black', Arial, sans-serif;
  --fb:'Onest', 'Segoe UI', Arial, sans-serif;
  --fm:'JetBrains Mono', 'Courier New', monospace;
  font-family:var(--fb); font-size:18px; line-height:1.55; color:var(--body);
  -webkit-font-smoothing:antialiased; text-size-adjust:100%;
}
.kb *, .kb *::before, .kb *::after{box-sizing:border-box; margin:0; padding:0}
.kb :where(a){color:inherit; text-decoration:none}
.kb :where(img){display:block; max-width:100%; height:auto}
.kb :where(ul, ol){list-style:none}
.kb a:focus-visible{outline:2px solid var(--cud); outline-offset:3px; border-radius:6px}

/* Раскладка */
.kb-wrap{max-width:1240px; margin:0 auto; padding-inline:32px}
.kb-sec{padding-block:104px; scroll-margin-top:68px}
.kb-dark{background:var(--ink); color:var(--light)}
.kb-light{background:var(--paper)}
.kb-alt{background:var(--paper2)}
.kb-stack{display:flex; flex-direction:column; gap:48px}
.kb-head{display:flex; flex-direction:column; gap:16px; max-width:860px}

/* Текст */
.kb-eyebrow{font-family:var(--fm); font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--cu)}
.kb-dark .kb-eyebrow{color:var(--cud)}
.kb-h2{font-family:var(--fd); font-weight:600; font-size:clamp(28px, 3.4vw, 44px); line-height:1.15; letter-spacing:-.01em; color:var(--head); text-wrap:balance}
.kb-dark .kb-h2{color:var(--light)}
.kb-h3{font-size:20px; font-weight:700; line-height:1.3; color:var(--head)}
.kb-lead{font-size:clamp(17px, 1.35vw, 19px); color:var(--muted); max-width:760px}
.kb-dark .kb-lead{color:var(--dmuted)}
.kb-small{font-size:15px; line-height:1.5; color:var(--muted)}
.kb-num{font-family:var(--fd); font-weight:600; line-height:1.05; letter-spacing:-.01em; color:var(--cu); white-space:nowrap}
.kb-dark .kb-num{color:var(--cud)}

/* Карточки и кнопки */
.kb-card{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:28px}
.kb-card-ink{background:var(--ink); color:var(--light); border-radius:20px; padding:28px}
.kb-btns{display:flex; flex-wrap:wrap; gap:12px}
.kb-btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; font-weight:600; font-size:16px; line-height:1.2; padding:15px 26px; border-radius:999px; transition:transform .2s ease, background-color .2s ease, border-color .2s ease}
.kb-btn:hover{transform:translateY(-2px)}
.kb-btn-cu{background:var(--cud); color:var(--ink)}
.kb-btn-cu:hover{background:#EE9C66}
.kb-btn-ghost{border:1px solid var(--dline); color:var(--light)}
.kb-btn-ghost:hover{border-color:var(--cud)}
.kb-btn-line{border:1px solid var(--line); color:var(--head); background:var(--card)}
.kb-btn-line:hover{border-color:var(--cu)}
.kb-arrow{display:inline-block; transition:transform .2s ease}
a:hover > .kb-arrow, a:hover .kb-arrow{transform:translateX(4px)}

/* Шапка */
.kb-header{position:fixed; top:0; left:0; right:0; z-index:990; padding-top:env(safe-area-inset-top, 0px); background:rgba(14,30,45,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--dline)}
.kb-header-in{height:68px; display:flex; align-items:center; justify-content:space-between; gap:24px}
.kb-logo{display:flex; align-items:baseline; gap:12px; white-space:nowrap}
.kb-logo b{font-family:var(--fd); font-weight:600; font-size:15px; color:var(--light); letter-spacing:.01em}
.kb-logo span{font-family:var(--fm); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--dmuted)}
.kb-nav{display:flex; gap:28px}
.kb-nav a{font-size:15px; color:var(--soft); transition:color .2s}
.kb-nav a:hover{color:var(--cud)}
.kb-header .kb-btn{padding:10px 18px; font-size:14px}
.kb-header-space{height:68px; background:var(--ink)}
.kb-short{display:none}

/* Обложка */
.kb-hero{position:relative; overflow:hidden; padding-block:96px 88px}
.kb-hero-photo{position:absolute; top:0; right:0; bottom:0; width:min(52%, 760px)}
.kb-hero-photo img{width:100%; height:100%; object-fit:cover; object-position:50% 15%}
.kb-hero-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg, var(--ink) 0%, rgba(14,30,45,0) 38%), linear-gradient(0deg, var(--ink) 0%, rgba(14,30,45,0) 22%)}
.kb-hero-in{position:relative; min-height:560px; display:flex; align-items:center}
.kb-hero-text{max-width:600px; display:flex; flex-direction:column; gap:26px}
.kb-h1{font-family:var(--fd); font-weight:700; font-size:clamp(44px, 6vw, 86px); line-height:1.02; letter-spacing:-.02em; color:var(--light)}
.kb-bar{display:block; width:96px; height:5px; border-radius:3px; background:var(--cud)}
.kb-hero-role{font-size:clamp(20px, 1.8vw, 24px); font-weight:600; color:var(--light)}
.kb-hero-desc{font-size:clamp(17px, 1.4vw, 19px); color:var(--dmuted); max-width:520px}

/* Цифры */
.kb-stats{padding-block:40px 56px}
.kb-stats-in{display:grid; grid-template-columns:repeat(4, 1fr); gap:24px; border-top:1px solid var(--dline); padding-top:40px}
.kb-stat{display:flex; flex-direction:column; gap:8px}
.kb-stat .kb-num{font-size:clamp(28px, 3vw, 40px)}
.kb-stat p:last-child{font-size:15px; color:var(--dmuted)}

/* Обо мне */
.kb-chain-box{display:flex; flex-direction:column; gap:14px}
.kb-chain{display:flex; flex-wrap:wrap; align-items:center; gap:10px 0; counter-reset:step}
.kb-chain li{display:flex; align-items:center}
.kb-chain li:not(:last-child)::after{content:"→"; padding:0 8px; color:var(--cu); font-weight:700}
.kb-chain span{counter-increment:step; display:flex; align-items:center; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:999px; padding:9px 15px; font-size:15px; font-weight:600; color:var(--head); white-space:nowrap}
.kb-chain span::before{content:counter(step, decimal-leading-zero); font-family:var(--fm); font-size:12px; font-weight:400; color:var(--cu)}
.kb-chain li:last-child span{background:var(--cu); border-color:var(--cu); color:#FFF8F2}
.kb-chain li:last-child span::before{color:#FFE2CF}
.kb-about-grid{display:grid; grid-template-columns:1fr 400px; gap:24px; align-items:stretch}
.kb-skills{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.kb-skills .kb-card{display:flex; flex-direction:column; gap:8px; padding:24px}
.kb-skills p{font-size:16px; color:var(--muted)}
.kb-side{display:flex; flex-direction:column; gap:16px}
.kb-quote{display:flex; flex-direction:column; gap:8px}
.kb-quote p:first-child{font-size:21px; font-weight:700; line-height:1.3}
.kb-quote p:last-child{font-size:15px; color:var(--dmuted)}
.kb-seek{flex:1; display:flex; flex-direction:column; gap:10px}
.kb-seek p{font-size:16px}
.kb-me{display:flex; align-items:center; gap:24px; background:var(--tint); border-radius:20px; padding:24px 28px}
.kb-me img{flex:none; width:96px; height:96px; border-radius:50%; object-fit:cover; border:3px solid var(--cu)}
.kb-me p{font-size:16px; color:var(--body)}
.kb-me b{color:var(--cu)}

/* Опыт */
.kb-exp{display:flex; flex-direction:column; gap:14px}
.kb-exp-row{display:grid; grid-template-columns:200px 330px 1fr; gap:28px; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:28px}
.kb-exp-when{display:flex; flex-direction:column; gap:4px; font-size:15px; color:var(--muted)}
.kb-exp-when b{font-size:16px; color:var(--cu)}
.kb-exp-who{display:flex; flex-direction:column; gap:4px; align-items:flex-start}
.kb-exp-who b{font-size:19px; line-height:1.3; color:var(--head)}
.kb-exp-who span{font-size:15px; color:var(--muted)}
.kb-exp-what{display:flex; flex-direction:column; gap:4px; font-size:16px; min-width:0}
.kb-exp-hi{background:var(--ink); border-color:var(--ink); color:var(--soft)}
.kb-exp-hi .kb-exp-when{color:var(--dmuted)}
.kb-exp-hi .kb-exp-when b{color:var(--cud)}
.kb-exp-hi .kb-exp-who b{color:var(--light)}
.kb-exp-hi .kb-exp-who span:not(.kb-tag){color:var(--dmuted)}
.kb-exp-who .kb-tag{color:var(--ink)}
.kb-tag{display:inline-block; margin-top:8px; background:var(--cud); color:var(--ink); font-size:13px; font-weight:700; border-radius:999px; padding:5px 12px}
.kb-tag-soft{background:var(--tint); color:var(--cu)}
.kb-exp-who .kb-tag-soft{color:var(--cu)}
.kb-more{display:inline-flex; gap:8px; align-items:center; margin-top:10px; font-weight:600; color:var(--cud)}
.kb-exp-row:not(.kb-exp-hi) .kb-more{color:var(--cu)}

/* Инструменты */
.kb-tools{display:grid; grid-template-columns:repeat(3, 1fr); grid-template-areas:"ads ai content" "bots ai auto"; gap:20px}
.kb-tools .kb-card, .kb-tools .kb-card-ink{display:flex; flex-direction:column; gap:16px}
.kb-tools ul{display:flex; flex-direction:column; gap:8px}
.kb-tools li{position:relative; padding-left:20px; font-size:16px; line-height:1.45; color:var(--head)}
.kb-tools li::before{content:""; position:absolute; left:2px; top:.62em; width:7px; height:7px; background:var(--cu); transform:rotate(45deg)}
.kb-tools li span{color:var(--muted)}
.kb-tools .kb-card-ink li{color:var(--light)}
.kb-tools .kb-card-ink li span{color:var(--dmuted)}
.kb-tools .kb-card-ink li::before{background:var(--cud)}
.kb-t-ads{grid-area:ads} .kb-t-ai{grid-area:ai} .kb-t-content{grid-area:content} .kb-t-bots{grid-area:bots} .kb-t-auto{grid-area:auto}

/* Кейсы: список на главной */
.kb-cases{display:flex; flex-direction:column; border-top:1px solid var(--dline)}
.kb-case{display:grid; grid-template-columns:56px minmax(0, 1.15fr) minmax(0, .9fr) minmax(0, 1.2fr) 32px; gap:24px; align-items:center; padding:26px 16px; border-bottom:1px solid var(--dline); border-radius:4px; transition:background-color .2s ease}
.kb-case:hover{background:var(--ink2)}
.kb-case-i{font-family:var(--fm); font-size:14px; color:var(--cud)}
.kb-case-city{display:flex; flex-direction:column; gap:4px; min-width:0}
.kb-case-city b{font-family:var(--fd); font-weight:600; font-size:clamp(20px, 2vw, 26px); line-height:1.2; color:var(--light)}
.kb-case-city span{font-size:15px; color:var(--dmuted)}
.kb-case .kb-num{font-size:clamp(24px, 2.4vw, 34px)}
.kb-case-cap{font-size:16px; color:var(--soft)}
.kb-case .kb-arrow{font-size:24px; color:var(--cud)}

/* Контакты */
.kb-contacts{display:grid; grid-template-columns:1fr 340px; gap:64px; align-items:center}
.kb-contacts-text{display:flex; flex-direction:column; gap:28px}
.kb-contacts-hook{font-size:clamp(19px, 1.7vw, 23px); font-weight:600; color:var(--cud)}
.kb-links{display:flex; flex-direction:column; gap:14px}
.kb-link{display:flex; align-items:center; gap:18px; padding:16px 20px; border:1px solid var(--dline); border-radius:18px; transition:border-color .2s ease, background-color .2s ease}
.kb-link:hover{border-color:var(--cud); background:var(--ink2)}
.kb-link-ico{flex:none; width:48px; height:48px; border-radius:50%; background:var(--ink2); display:flex; align-items:center; justify-content:center; color:var(--cud)}
.kb-link-ico svg{width:22px; height:22px}
.kb-link-txt{display:flex; flex-direction:column; gap:2px; min-width:0}
.kb-link-txt span{font-family:var(--fm); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--dmuted)}
.kb-link-txt b{font-family:var(--fd); font-weight:600; font-size:clamp(18px, 1.8vw, 24px); color:var(--light); overflow-wrap:anywhere}
.kb-qr{display:flex; flex-direction:column; gap:14px; align-items:center}
.kb-qr-card{background:#FFFFFF; border-radius:24px; padding:22px}
.kb-qr p{font-size:14px; text-align:center; color:var(--dmuted)}

/* Подвал */
.kb-footer{background:var(--ink); border-top:1px solid var(--dline); padding-block:28px calc(28px + env(safe-area-inset-bottom, 0px))}
.kb-footer-in{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 32px; font-size:14px; color:var(--dmuted)}
.kb-footer-in nav{display:flex; flex-wrap:wrap; gap:24px}
.kb-footer-in a:hover{color:var(--cud)}


/* ===== Страницы кейсов ===== */
.kb-ch{padding-block:64px 72px; border-bottom:1px solid var(--dline)}
.kb-ch-in{display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr); gap:48px; align-items:end}
.kb-ch-text{display:flex; flex-direction:column; gap:20px; min-width:0}
.kb-back{display:inline-flex; gap:8px; align-items:center; font-size:15px; color:var(--dmuted); transition:color .2s}
.kb-back:hover{color:var(--cud)}
.kb-h1c{font-family:var(--fd); font-weight:700; font-size:clamp(32px, 4.6vw, 60px); line-height:1.08; letter-spacing:-.015em; color:var(--light); text-wrap:balance}
.kb-chips{display:flex; flex-wrap:wrap; gap:8px}
.kb-chips span{font-size:14px; color:var(--soft); border:1px solid var(--dline); border-radius:999px; padding:6px 14px}
.kb-key{display:flex; flex-direction:column; gap:10px; background:var(--ink2); border:1px solid var(--dline); border-radius:24px; padding:32px}
.kb-key .kb-num{font-size:clamp(36px, 4.8vw, 64px); white-space:normal}
.kb-key p:last-child{font-size:16px; color:var(--soft)}
.kb-cbody{display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:24px; align-items:start}
.kb-cbody-wide{grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr)}
.kb-col{display:flex; flex-direction:column; gap:20px; min-width:0}
.kb-col > .kb-card, .kb-col > .kb-tint, .kb-col > .kb-card-ink{display:flex; flex-direction:column; gap:14px}
.kb-tint{background:var(--tint); border-radius:20px; padding:28px}
.kb-p{font-size:17px}
.kb-p + .kb-p{margin-top:2px}
.kb-list{display:flex; flex-direction:column; gap:10px}
.kb-list li{position:relative; padding-left:22px; font-size:17px; line-height:1.5}
.kb-list li::before{content:""; position:absolute; left:2px; top:.62em; width:8px; height:8px; background:var(--cu); transform:rotate(45deg)}
.kb-tiles{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.kb-tiles-3{grid-template-columns:repeat(3, 1fr)}
.kb-tile{display:flex; flex-direction:column; gap:6px; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:22px 24px; min-width:0}
.kb-tile .kb-num{font-size:clamp(26px, 2.6vw, 38px)}
.kb-tile b{font-size:16px; color:var(--head); line-height:1.35}
.kb-tile span{font-size:15px; color:var(--muted); line-height:1.4}
.kb-note{font-size:15px; color:var(--muted)}
.kb-dark .kb-note{color:var(--dmuted)}
.kb-hl{display:flex; flex-direction:column; gap:12px; background:var(--ink); color:var(--light); border-radius:20px; padding:28px}
.kb-hl-big{font-family:var(--fd); font-weight:600; font-size:clamp(22px, 2.2vw, 30px); line-height:1.2; color:var(--light)}
.kb-hl-big em{font-style:normal; color:var(--cud)}
.kb-hl p{font-size:16px; color:var(--dmuted)}
.kb-hl .kb-eyebrow{font-size:13px; color:var(--cud)}
.kb-hl .kb-num{color:var(--cud)}
.kb-cmp{display:flex; flex-direction:column; gap:10px}
.kb-cmp-row{display:grid; grid-template-columns:150px 1fr auto 1fr 70px; gap:12px; align-items:center; font-size:16px; border-bottom:1px solid var(--dline); padding-bottom:10px}
.kb-cmp-row:first-child{font-family:var(--fm); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--dmuted)}
.kb-cmp-row span:nth-child(1){color:var(--dmuted)}
.kb-cmp-row span:nth-child(3){color:var(--dmuted)}
.kb-cmp-row span:nth-child(4){font-weight:700}
.kb-cmp-row span:nth-child(5){text-align:right; font-weight:700; color:var(--cud)}
.kb-bars{display:flex; flex-direction:column; gap:12px}
.kb-bar-row{display:grid; grid-template-columns:1fr auto; grid-template-areas:"l v" "b b"; gap:6px 12px; align-items:center; font-size:15px}
.kb-bar-row span:first-child{grid-area:l; color:var(--muted)}
.kb-bar-row span:nth-child(2){grid-area:b; display:block}
.kb-bar-row i{display:block; height:12px; border-radius:6px; background:#E6CDBB}
.kb-bar-row i.kb-on{background:var(--cu)}
.kb-bar-row b{grid-area:v; text-align:right; color:var(--head); white-space:nowrap}
.kb-hl .kb-bar-row span:first-child{color:var(--dmuted)}
.kb-hl .kb-bar-row i{background:#3A5670}
.kb-hl .kb-bar-row i.kb-on{background:var(--cud)}
.kb-hl .kb-bar-row b{color:var(--light)}
.kb-totals{display:flex; flex-direction:column; gap:10px}
.kb-totals div{display:flex; align-items:baseline; gap:14px}
.kb-totals .kb-num{font-size:clamp(26px, 2.4vw, 34px)}
.kb-totals span{font-size:15px; color:var(--dmuted)}
.kb-shots-wrap{display:grid; grid-template-columns:minmax(0, 1fr) 360px; gap:24px; align-items:start}
.kb-shots-wrap-wide{grid-template-columns:minmax(0, 1.25fr) minmax(0, 1fr)}
.kb-shots{display:grid; grid-template-columns:1fr 1fr; gap:20px; min-width:0}
.kb-shots-1{grid-template-columns:1fr}
.kb-shots-3{grid-template-columns:repeat(3, 1fr)}
.kb-shots-4{grid-template-columns:repeat(4, 1fr)}
.kb-shot{display:flex; flex-direction:column; gap:12px; background:#FFFFFF; border:1px solid var(--line); border-radius:20px; padding:16px; min-width:0}
.kb-shot a{display:block; border-radius:10px; overflow:hidden; background:#F6F4F0}
.kb-shot img{width:100%; height:auto}
.kb-shot figcaption{display:flex; flex-direction:column; gap:2px; font-size:15px; color:var(--muted); padding:0 4px}
.kb-shot figcaption b{font-size:16px; color:var(--head)}
.kb-shot figcaption em{font-style:normal; font-weight:700; color:var(--cu)}
.kb-zoom{font-size:13px; color:var(--muted)}
.kb-aside{display:flex; flex-direction:column; gap:16px}
.kb-funnel{display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; gap:10px; align-items:start}
.kb-funnel div{display:flex; flex-direction:column; gap:4px}
.kb-funnel b{font-family:var(--fd); font-weight:600; font-size:clamp(26px, 2.6vw, 36px); line-height:1.1; color:var(--light)}
.kb-funnel div:last-child b{color:var(--cud)}
.kb-funnel span{font-size:14px; color:var(--dmuted); line-height:1.35}
.kb-funnel i{font-style:normal; color:var(--cud); font-weight:700; padding-top:6px}
.kb-toolstrip{display:grid; grid-template-columns:repeat(4, 1fr); gap:24px; background:var(--ink); border-radius:20px; padding:26px 30px}
.kb-toolstrip b{display:block; font-family:var(--fd); font-weight:600; font-size:18px; color:var(--cud)}
.kb-toolstrip span{font-size:15px; color:var(--soft)}
.kb-pills{display:flex; flex-wrap:wrap; align-items:center; gap:10px}
.kb-pills span{font-size:15px; border-radius:999px; padding:8px 16px; background:var(--card); border:1px solid var(--line); color:var(--body)}
.kb-pills span.kb-on{background:var(--cu); border-color:var(--cu); color:#FFF8F2; font-weight:700}
.kb-pills i{font-style:normal; color:var(--cu); font-weight:700}
.kb-posts{display:grid; grid-template-columns:repeat(5, 1fr); gap:16px}
.kb-post{display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:18px; overflow:hidden; min-width:0}
.kb-post img{width:100%; aspect-ratio:1/1; object-fit:cover}
.kb-post div{display:flex; flex-direction:column; gap:4px; padding:14px 16px 16px}
.kb-post b{font-size:16px; color:var(--head)}
.kb-post .kb-num{font-size:26px}
.kb-post span{font-size:14px; color:var(--muted); line-height:1.4}
.kb-feed{display:flex; flex-direction:column; gap:12px}
.kb-feed .kb-shot img{max-height:620px; width:auto; margin:0 auto}
.kb-stat3{display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; background:var(--ink); border-radius:20px; padding:24px 28px}
.kb-stat3 div{display:flex; flex-direction:column; gap:4px}
.kb-stat3 .kb-num{font-size:clamp(26px, 2.4vw, 34px)}
.kb-stat3 span{font-size:15px; color:var(--dmuted)}
.kb-practice{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.kb-practice .kb-card{display:flex; flex-direction:column; gap:8px; padding:24px}
.kb-practice p{font-size:16px; color:var(--muted)}
.kb-next{padding-block:72px}
.kb-next-in{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:32px}
.kb-next-link{display:flex; flex-direction:column; gap:8px}
.kb-next-link b{font-family:var(--fd); font-weight:600; font-size:clamp(26px, 3.4vw, 44px); line-height:1.1; color:var(--light); transition:color .2s}
.kb-next-link:hover b{color:var(--cud)}
.kb-status{display:inline-flex; align-items:center; gap:10px; align-self:flex-start; font-family:var(--fm); font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--cud); border:1px solid var(--cud); border-radius:999px; padding:7px 14px}
.kb-status::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--cud); animation:kb-pulse 1.6s ease-in-out infinite}
@keyframes kb-pulse{50%{opacity:.25}}
.kb-soon-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:20px}
.kb-soon{display:flex; flex-direction:column; gap:10px; border-style:dashed}
.kb-soon p:last-child{font-size:16px; color:var(--muted)}
.kb-soon-cta{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:20px}
.kb-sub{font-family:var(--fd); font-weight:600; font-size:clamp(22px, 2.4vw, 30px); line-height:1.2; color:var(--head)}
@media (max-width:1100px){
  .kb-ch-in{grid-template-columns:1fr; gap:32px; align-items:start}
  .kb-cbody, .kb-cbody-wide{grid-template-columns:1fr}
  .kb-shots-wrap, .kb-shots-wrap-wide{grid-template-columns:1fr}
  .kb-aside{display:grid; grid-template-columns:1fr 1fr}
  .kb-posts{grid-template-columns:repeat(3, 1fr)}
  .kb-shots-4{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .kb-ch{padding-block:40px 48px}
  .kb-key{padding:24px}
  .kb-tiles{grid-template-columns:1fr 1fr}
  .kb-tiles-3{grid-template-columns:1fr}
  .kb-shots, .kb-shots-3{grid-template-columns:1fr}
  .kb-aside{display:flex}
  .kb-cmp-row{grid-template-columns:1fr auto auto auto; }
  .kb-cmp-row span:nth-child(3){display:none}
  .kb-funnel{grid-template-columns:1fr 1fr; gap:16px}
  .kb-funnel i{display:none}
  .kb-toolstrip{grid-template-columns:1fr 1fr; padding:22px}
  .kb-posts{grid-template-columns:1fr 1fr}
  .kb-practice{grid-template-columns:1fr}
  .kb-soon-grid{grid-template-columns:1fr}
  .kb-stat3{grid-template-columns:1fr; gap:14px}
  .kb-tint, .kb-hl{padding:22px}
}


/* ===== Главная: показатели первого экрана, зоны ответственности, инструменты ===== */
.kb-hcards{display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px; border-top:1px solid var(--dline); padding-top:40px}
.kb-hcard{display:flex; flex-direction:column; gap:8px; background:var(--ink2); border:1px solid var(--dline); border-radius:18px; padding:22px 24px; min-width:0}
.kb-hcard .kb-num{font-size:clamp(24px, 2.4vw, 34px); white-space:normal}
.kb-hcard p:not(.kb-num){font-size:15px; line-height:1.45; color:var(--dmuted)}
.kb-hcard-link{transition:border-color .2s ease, background-color .2s ease}
.kb-hcard-link:hover{border-color:var(--cud); background:#1A3045}
.kb-hcard-more{margin-top:auto; padding-top:4px; font-size:14px; font-weight:600; color:var(--cud)}
.kb-zones{display:grid; grid-template-columns:minmax(0, 1.25fr) auto minmax(0, 1fr); gap:16px; align-items:stretch}
.kb-zone{display:flex; flex-direction:column; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:28px; min-width:0}
.kb-zone > p:not(.kb-eyebrow):not(.kb-small){font-size:17px; color:var(--body)}
.kb-zone-client{background:transparent; border:1px dashed #C9BFB1}
.kb-zone-arrow{align-self:center; font-size:28px; font-weight:700; color:var(--cu)}
.kb-chain-client span{background:transparent; border-style:dashed; color:var(--muted)}
.kb-chain-client span::before{color:var(--muted)}
.kb-chain-client li:last-child span{background:transparent; border-color:#C9BFB1; color:var(--muted)}
.kb-chain-client li:last-child span::before{color:var(--muted)}
.kb-chain-client li:not(:last-child)::after{color:var(--muted)}
.kb-zone .kb-chain li:last-child span{white-space:nowrap}
.kb-tools2{display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:20px}
.kb-tools2 .kb-card{display:flex; flex-direction:column; gap:16px}
.kb-tools2 ul{display:flex; flex-direction:column; gap:8px}
.kb-tools2 li{position:relative; padding-left:20px; font-size:16px; line-height:1.45; color:var(--head)}
.kb-tools2 li::before{content:""; position:absolute; left:2px; top:.62em; width:7px; height:7px; background:var(--cu); transform:rotate(45deg)}
.kb-tools2 li span{color:var(--muted)}
.kb-ai{display:flex; flex-direction:column; gap:10px}
.kb-ai p:not(.kb-eyebrow){font-size:17px; color:var(--soft); max-width:860px}
.kb-ai .kb-ai-list{font-size:15px; color:var(--dmuted)}
.kb-me-sec{padding-block:72px}
@media (max-width:1100px){
  .kb-hcards{grid-template-columns:1fr 1fr}
  .kb-tools2{grid-template-columns:1fr 1fr}
  .kb-zones{grid-template-columns:1fr}
  .kb-zone-arrow{justify-self:center; transform:rotate(90deg)}
}
@media (max-width:760px){
  .kb-hcards{gap:12px; padding-top:28px}
  .kb-hcard{padding:16px}
  .kb-hcard .kb-num{font-size:20px}
  .kb-hcard-link{grid-column:1 / -1}
  .kb-tools2{grid-template-columns:1fr}
  .kb-zone{padding:22px}
  .kb-me-sec{padding-block:48px}
}

/* ===== Кейсы: ключевое решение · опыт: перерыв · формат работы ===== */
.kb-steps-wrap{display:flex; flex-direction:column; gap:16px}
.kb-steps{display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px}
.kb-step{display:flex; flex-direction:column; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:22px 24px; min-width:0}
.kb-step > span{font-family:var(--fm); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--cu)}
.kb-step p{font-size:16px; line-height:1.5; color:var(--body)}
.kb-step-res{background:var(--ink); border-color:var(--ink)}
.kb-step-res > span{color:var(--cud)}
.kb-step-res p{color:var(--light)}
.kb-step-res b{color:var(--cud)}
.kb-exp-gap{background:transparent; border-style:dashed; border-color:#C9BFB1; padding-block:18px}
.kb-exp-gap .kb-exp-who b{font-size:17px; color:var(--muted)}
.kb-seek ul{display:flex; flex-direction:column; gap:6px}
.kb-seek li{position:relative; padding-left:20px; font-size:16px; line-height:1.45; color:var(--head)}
.kb-seek li::before{content:""; position:absolute; left:2px; top:.62em; width:7px; height:7px; background:var(--cu); transform:rotate(45deg)}
@media (max-width:1100px){
  .kb-steps{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .kb-steps{grid-template-columns:1fr}
  .kb-step{padding:20px}
  .kb-exp-gap{padding-block:16px}
}

/* Планшет */
@media (max-width:1100px){
  .kb-about-grid{grid-template-columns:1fr}
  .kb-side{flex-direction:row}
  .kb-side > *{flex:1}
  .kb-exp-row{grid-template-columns:170px 1fr; }
  .kb-exp-what{grid-column:2}
  .kb-tools{grid-template-columns:1fr 1fr; grid-template-areas:"ads content" "ai ai" "bots auto"}
  .kb-contacts{grid-template-columns:1fr 280px; gap:40px}
}
@media (max-width:960px){
  .kb-nav{display:none}
}
/* Телефон */
@media (max-width:760px){
  .kb{font-size:17px}
  .kb-wrap{padding-inline:20px}
  .kb-sec{padding-block:72px}
  .kb-stack{gap:36px}
  .kb-hero{padding-block:0 56px}
  .kb-hero-photo{position:relative; width:auto; height:min(110vw, 460px)}
  .kb-hero-photo img{object-position:50% 12%}
  .kb-hero-photo::after{background:linear-gradient(0deg, var(--ink) 0%, rgba(14,30,45,0) 45%)}
  .kb-hero-in{min-height:0; margin-top:-56px}
  .kb-hero-text{gap:20px}
  .kb-btns .kb-btn{flex:1 1 220px}
  .kb-stats{padding-block:8px 48px}
  .kb-stats-in{grid-template-columns:1fr 1fr; gap:28px 16px; padding-top:32px}
  .kb-side{flex-direction:column}
  .kb-skills{grid-template-columns:1fr}
  .kb-chain{flex-direction:column; align-items:stretch; gap:0}
  .kb-chain li{flex-direction:column; align-items:stretch}
  .kb-chain li:not(:last-child)::after{content:"↓"; padding:4px 0; text-align:center}
  .kb-chain span{border-radius:14px; white-space:normal}
  .kb-me{flex-direction:column; align-items:flex-start; padding:22px}
  .kb-exp-row{grid-template-columns:1fr; gap:14px; padding:22px}
  .kb-exp-what{grid-column:auto}
  .kb-tools{grid-template-columns:1fr; grid-template-areas:"ads" "ai" "content" "bots" "auto"}
  .kb-case{grid-template-columns:40px 1fr; grid-template-areas:"i city" "i num" "i cap"; gap:6px 12px; padding:22px 4px}
  .kb-case-i{grid-area:i; align-self:start; padding-top:6px}
  .kb-case-city{grid-area:city}
  .kb-case .kb-num{grid-area:num; margin-top:6px}
  .kb-case-cap{grid-area:cap}
  .kb-case .kb-arrow{display:none}
  .kb-contacts{grid-template-columns:1fr}
  .kb-qr{display:none}
  .kb-header-in{height:60px}
  .kb-header-space{height:60px}
  .kb-sec{scroll-margin-top:60px}
  .kb-long{display:none}
  .kb-short{display:inline}
}
@media (max-width:420px){
  .kb-logo span{display:none}
}
@media (prefers-reduced-motion:reduce){
  .kb *{transition:none !important; animation:none !important}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Approved revisions, 26 October 2026 */
.kb-hcards{grid-template-columns:repeat(2,minmax(0,1fr))}
.kb-hcard{gap:12px;padding:24px 28px}
.kb-hcard .kb-num{font-size:clamp(24px,2.6vw,34px);white-space:nowrap}
.kb-case{grid-template-columns:40px minmax(0,1.1fr) minmax(0,1fr) minmax(0,1.35fr) 24px;gap:18px}
.kb-case .kb-num{font-size:clamp(23px,2.2vw,30px);white-space:normal}
.kb-case .kb-case-city b{font-size:clamp(20px,1.8vw,24px)}
.kb-funnel{grid-template-columns:1fr auto 1fr auto 1fr}
.kb-quote p:first-child{font-size:20px}
.kb-quote p:last-child{font-size:16px}
@media(min-width:1280px){
 .kb-hcards{grid-template-columns:repeat(4,minmax(0,1fr))}
 .kb-hcard{padding:22px 20px}.kb-hcard .kb-num{font-size:clamp(20px,1.6vw,24px)}
}
@media(max-width:1100px) and (min-width:761px){
 .kb-case{grid-template-columns:40px minmax(0,1fr) minmax(0,1fr);grid-template-areas:"i city num" "i cap cap";gap:12px 18px}
 .kb-case-i{grid-area:i}.kb-case-city{grid-area:city}.kb-case .kb-num{grid-area:num}.kb-case-cap{grid-area:cap}.kb-case>.kb-arrow{display:none}
}
@media(max-width:760px){
 .kb-hcards{grid-template-columns:1fr;gap:12px}.kb-hcard{padding:22px 24px}.kb-hcard-link{grid-column:auto}
 .kb-hcard .kb-num{font-size:clamp(24px,6.6vw,32px)}
 .kb-case{grid-template-columns:30px minmax(0,1fr);gap:8px 12px}.kb-case .kb-num{font-size:27px}
 .kb-funnel{grid-template-columns:1fr;gap:18px}.kb-funnel i{display:none}
}
@media(max-width:480px){.kb-tiles{grid-template-columns:1fr}.kb-h1c{font-size:28px;overflow-wrap:anywhere}}