:root {
  --service-ink: #24143f;
  --service-violet: #6f45d9;
  --service-cyan: #20bfc7;
  --service-orange: #f19a5b;
  --service-line: rgba(78, 50, 129, .14);
  --service-soft: #f7f3ff;
}

.service-page { color: var(--service-ink); overflow-x: clip; }
.service-page .section-pad { padding-block: clamp(58px, 7vw, 96px); }
.service-page .section-heading { max-width: 760px; }
.service-page .section-heading h2 { font-size: clamp(2rem, 4.2vw, 3.55rem); line-height: 1.04; overflow-wrap: anywhere; }
.service-page h3 { overflow-wrap: anywhere; }
.service-page .header-cta { white-space: nowrap; }

.service-hero { position: relative; padding: clamp(54px, 7vw, 94px) 0 clamp(62px, 8vw, 110px); overflow: hidden; }
.service-hero::before { content: ""; position: absolute; width: 520px; height: 520px; border-radius: 50%; right: -160px; top: -170px; background: radial-gradient(circle, rgba(52, 210, 205, .22), rgba(118, 76, 220, .12) 55%, transparent 72%); pointer-events: none; }
.service-hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr); gap: clamp(36px, 7vw, 92px); align-items: center; }
.service-hero-copy { min-width: 0; }
.service-hero h1 { max-width: 820px; margin: 18px 0 22px; font-size: clamp(2.65rem, 5.3vw, 5.6rem); line-height: .98; letter-spacing: -.055em; overflow-wrap: anywhere; }
.service-hero .hero-lead { max-width: 760px; font-size: clamp(1.08rem, 1.7vw, 1.35rem); line-height: 1.58; }
.service-hero .actions { margin-top: 30px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.hero-proof span { padding: 9px 13px; border: 1px solid var(--service-line); border-radius: 999px; background: rgba(255,255,255,.78); font-size: .88rem; font-weight: 750; }

.about-portrait { position: relative; max-width: 440px; margin-inline: auto; }
.about-portrait::before { content: ""; position: absolute; inset: 9% -6% -5% 8%; border-radius: 44% 56% 48% 52%; background: linear-gradient(145deg, rgba(127,85,224,.28), rgba(35,201,199,.28)); transform: rotate(4deg); }
.about-portrait img { position: relative; z-index: 1; display: block; width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; border-radius: 42% 42% 28px 28px; box-shadow: 0 28px 70px rgba(72,42,122,.2); }
.portrait-note { position: absolute; z-index: 2; right: -24px; bottom: 28px; max-width: 230px; padding: 14px 17px; border-radius: 18px; background: #fff; box-shadow: 0 16px 40px rgba(61,39,99,.16); font-weight: 800; }
.about-page .service-hero-grid { grid-template-columns: minmax(0, 1.18fr) minmax(280px, .82fr); }
.about-page .about-portrait { width: min(100%, 360px); }
.about-page .about-portrait img { height: auto; aspect-ratio: auto; object-fit: contain; border-radius: 34px 34px 22px 22px; }
.hero-service-image { margin: 0; padding: 10px; border: 1px solid var(--service-line); border-radius: 32px; background: rgba(255,255,255,.72); box-shadow: 0 28px 70px rgba(66,39,106,.14); overflow: hidden; }
.hero-service-image img { width: 100%; aspect-ratio: 3/2; object-fit: cover; border-radius: 23px; }

.principle-panel { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 32px; align-items: start; padding: clamp(28px, 4vw, 52px); border: 1px solid var(--service-line); border-radius: 34px; background: linear-gradient(135deg, #f6f0ff, #edfffe); }
.principle-panel blockquote { margin: 0; font-size: clamp(1.65rem, 3.1vw, 2.7rem); line-height: 1.15; font-weight: 850; color: #432276; }
.principle-panel p { margin: 0 0 16px; font-size: 1.05rem; line-height: 1.7; }

.value-grid, .direction-grid, .case-preview-grid, .platform-grid, .vk-tool-grid { display: grid; gap: 18px; }
.value-grid { grid-template-columns: repeat(3, minmax(0,1fr)); margin-top: 34px; }
.value-card, .direction-card, .platform-card, .vk-tool-card { min-width: 0; padding: 26px; border: 1px solid var(--service-line); border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: 0 16px 42px rgba(64,38,106,.07); }
.value-card:nth-child(2n), .direction-card:nth-child(3n) { background: #f5f0ff; }
.value-card:nth-child(3n), .direction-card:nth-child(3n+1) { background: #edfffd; }
.card-number { display: inline-grid; place-items: center; width: 42px; height: 42px; margin-bottom: 18px; border-radius: 14px; color: #fff; background: linear-gradient(145deg, var(--service-violet), var(--service-cyan)); font-weight: 850; }
.value-card h3, .direction-card h3, .platform-card h3, .vk-tool-card h3 { margin: 0 0 10px; font-size: 1.28rem; line-height: 1.2; }
.value-card p, .direction-card p, .platform-card p, .vk-tool-card p { margin: 0; line-height: 1.62; }

.work-path { display: grid; gap: 0; margin-top: 36px; counter-reset: path; }
.work-step { position: relative; display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 22px; padding: 0 0 34px; counter-increment: path; }
.work-step::before { content: counter(path, decimal-leading-zero); position: relative; z-index: 1; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; color: #fff; background: #542b91; font-weight: 850; }
.work-step:not(:last-child)::after { content: ""; position: absolute; left: 28px; top: 58px; bottom: 0; width: 2px; background: linear-gradient(var(--service-violet), var(--service-cyan)); opacity: .4; }
.work-step h3 { margin: 5px 0 8px; font-size: 1.3rem; }
.work-step p { margin: 0; max-width: 780px; line-height: 1.65; }

.direction-grid { grid-template-columns: repeat(3, minmax(0,1fr)); margin-top: 34px; }
.direction-card { min-height: 190px; }
.direction-card strong { display: block; margin-bottom: 12px; color: #563092; font-size: 1.05rem; }
.education-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 34px; }
.credential-card { min-width: 0; padding: 28px; border: 1px solid var(--service-line); border-radius: 24px; background: #fff; box-shadow: 0 16px 42px rgba(64,38,106,.07); }
.credential-card:nth-child(2) { background: #f5f0ff; }
.credential-card:nth-child(3) { background: #edfffd; }
.credential-card h3 { margin: 0 0 10px; font-size: 1.3rem; }
.credential-card p { line-height: 1.65; }
.about-page .education-heading { max-width: 940px; }
.about-page .education-heading h2 { max-width: 21ch; overflow-wrap: normal; word-break: normal; text-wrap: balance; }
.document-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 24px; }
.document-card { min-width: 0; padding: 14px 14px 20px; border: 1px solid var(--service-line); border-radius: 24px; background: #fff; box-shadow: 0 16px 42px rgba(64,38,106,.08); }
.document-preview { position: relative; width: 100%; height: 310px; display: grid; place-items: center; overflow: hidden; padding: 12px; border: 0; border-radius: 16px; background: #f7f4fb; cursor: zoom-in; }
.document-preview img { width: 100%; height: 100%; object-fit: contain; }
.document-preview span { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); width: max-content; max-width: calc(100% - 24px); padding: 8px 12px; border-radius: 999px; background: rgba(45,29,70,.88); color: #fff; font-size: .78rem; font-weight: 780; opacity: 0; transition: opacity .2s; }
.document-preview:hover span, .document-preview:focus-visible span { opacity: 1; }
.document-card h3 { margin: 17px 5px 0; font-size: 1.08rem; line-height: 1.28; }
.document-card p { margin: 8px 5px 0; color: var(--muted); font-size: .88rem; line-height: 1.5; }
.document-lightbox { width: min(94vw, 1180px); max-width: 1180px; height: min(92vh, 900px); padding: 52px 18px 18px; border: 0; border-radius: 24px; background: #f9f7fc; box-shadow: 0 28px 90px rgba(31,18,51,.35); }
.document-lightbox::backdrop { background: rgba(25,15,39,.78); backdrop-filter: blur(5px); }
.document-lightbox img { width: 100%; height: 100%; object-fit: contain; }
.document-lightbox-close { position: absolute; top: 12px; right: 14px; width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #49257d; color: #fff; font-size: 1.65rem; line-height: 1; cursor: pointer; }
.about-method .section-heading { max-width: 950px; }
.about-method .section-heading h2 { max-width: 20ch; overflow-wrap: normal; text-wrap: balance; }
.method-panel { max-width: 1040px; margin-top: 32px; padding: clamp(26px,4vw,44px); border: 1px solid var(--service-line); border-radius: 30px; background: linear-gradient(135deg,#f7f2ff,#effdfc); box-shadow: 0 16px 42px rgba(64,38,106,.07); }
.method-panel p { max-width: 860px; margin: 0; font-size: clamp(1.03rem,1.4vw,1.16rem); line-height: 1.72; }
.method-panel p + p { margin-top: 18px; }
.platform-pills { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.platform-pills span { padding: 13px 20px; border: 1px solid var(--service-line); border-radius: 999px; background: #fff; box-shadow: 0 8px 22px rgba(47,35,67,.06); font-weight: 820; }
.platform-pills span:nth-child(even) { color: #fff; background: #342442; border-color: #342442; }
.platform-summary { margin: 20px 0 0; font-size: 1.05rem; line-height: 1.6; }
.about-tools-section { position: relative; overflow: hidden; }
.about-tools-section::before { content: ""; position: absolute; z-index: -1; width: 520px; aspect-ratio: 1; right: -230px; top: -170px; border-radius: 50%; background: radial-gradient(circle, rgba(193,246,238,.32), rgba(220,207,255,.18) 58%, transparent 72%); }
.about-tools-layout { display: grid; grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr); align-items: center; gap: clamp(42px,7vw,96px); }
.about-tools-layout .section-heading { max-width: 510px; }
.about-tools-layout .section-heading h2 { max-width: 14ch; }
.about-tools-layout .platform-summary { max-width: 430px; margin-top: 30px; padding-left: 19px; border-left: 3px solid var(--service-cyan); color: var(--service-ink); font-size: clamp(1.04rem,1.45vw,1.2rem); font-weight: 650; }
.about-tools-layout .platform-pills { position: relative; isolation: isolate; min-height: 268px; margin: 0; padding: 34px 24px; align-content: center; align-items: center; justify-content: center; gap: 15px; }
.about-tools-layout .platform-pills::before { content: ""; position: absolute; z-index: -1; inset: 5% 0 2% 3%; border-radius: 58% 42% 48% 52% / 43% 55% 45% 57%; background: linear-gradient(145deg, rgba(232,222,255,.78), rgba(215,250,245,.8) 62%, rgba(252,233,244,.68)); transform: rotate(2deg); }
.about-tools-layout .platform-pills span { padding: 15px 21px; box-shadow: 0 12px 28px rgba(57,36,89,.09); }
.about-tools-layout .platform-pills span:nth-child(3n) { transform: rotate(1.5deg) translateY(-4px); }
.about-tools-layout .platform-pills span:nth-child(4n + 2) { transform: rotate(-1.5deg) translateY(5px); }
.about-tools-layout .platform-pills span:nth-child(5n) { transform: rotate(.8deg) translateY(-7px); }
.tool-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-top: 34px; }
.tool-grid article { min-width: 0; padding: 24px; border: 1px solid var(--service-line); border-radius: 22px; background: linear-gradient(145deg,#fff,#f5f0ff); }
.tool-grid strong { display: block; margin-bottom: 9px; color: #542b91; font-size: 1.2rem; }
.tool-grid p { margin: 0; line-height: 1.6; }
.social-logo-box { flex: 0 0 auto; display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; overflow: visible; }
.social-logo { display: block; max-width: none; max-height: none; object-fit: contain; object-position: center; }
.social-logo-telegram { width: 54px; height: 54px; }
.social-logo-max { width: 56px; height: 56px; }
.social-logo-vk { width: 54px; height: 54px; }
.service-link-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 34px; }
.service-link-grid a { display: flex; min-width: 0; min-height: 142px; padding: 25px; flex-direction: column; justify-content: space-between; gap: 18px; border: 1px solid var(--service-line); border-radius: 22px; background: #fff; transition: transform .2s,border-color .2s,box-shadow .2s; }
.about-page .service-link-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.about-page .service-link-grid a { min-height: 210px; justify-content: flex-start; background: linear-gradient(145deg,#fff,#f8f4ff); }
.about-page .service-link-grid a:nth-child(3n+2) { background: linear-gradient(145deg,#fff,#edfffd); }
.about-page .service-link-grid i { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 0; color: #7445db; background: none; font-style: normal; font-size: .86rem; font-weight: 880; }
.about-page .service-link-grid i.brand-icon.social-logo-box { width:56px; height:56px; }
.about-page .service-link-grid strong { margin-top: 1px; line-height: 1.25; }
.about-page .service-link-grid span { margin-top: auto; line-height: 1.55; }
.about-page .credential-card,
.about-page .document-card,
.about-page .platform-pills span { transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.about-page .document-preview img { transition: transform .45s ease; }
.about-page .document-card:hover,
.about-page .document-card:focus-within { transform: translateY(-4px); border-color: rgba(111,69,217,.34); box-shadow: 0 22px 52px rgba(64,38,106,.12); }
.about-page .document-card:hover .document-preview img,
.about-page .document-card:focus-within .document-preview img { transform: scale(1.018); }
.about-page .platform-pills span:hover,
.about-page .platform-pills span.is-tapped { transform: translateY(-3px) scale(1.025); border-color: rgba(111,69,217,.48); box-shadow: 0 13px 28px rgba(80,48,132,.16); }
.about-page .platform-pills span:nth-child(even):hover,
.about-page .platform-pills span:nth-child(even).is-tapped { border-color: #20bfc7; box-shadow: 0 13px 30px rgba(32,191,199,.2); }
.about-motion-ready .about-page .credential-card,
.about-motion-ready .about-page .service-link-grid a { opacity: 0; transform: translateY(30px); }
.about-motion-ready .about-page .credential-card.is-shown,
.about-motion-ready .about-page .service-link-grid a.is-shown { opacity: 1; transform: translateY(0); transition: opacity 1.05s ease, transform 1.05s cubic-bezier(.2,.75,.25,1), border-color .2s, box-shadow .2s; }
.about-motion-ready .about-page .service-link-grid a.is-shown:hover,
.about-motion-ready .about-page .service-link-grid a.is-shown:focus-visible { transform: translateY(-3px); }
.service-link-grid a:hover, .service-link-grid a:focus-visible { transform: translateY(-3px); border-color: rgba(111,69,217,.45); box-shadow: 0 16px 42px rgba(64,38,106,.1); }
.service-link-grid strong { color: #432276; font-size: 1.18rem; }
.service-link-grid span { color: var(--muted); }

.case-preview-grid { grid-template-columns: repeat(3, minmax(0,1fr)); margin-top: 34px; }
.case-preview { overflow: hidden; border: 1px solid var(--service-line); border-radius: 24px; background: #fff; box-shadow: 0 16px 42px rgba(64,38,106,.08); }
.case-preview img { display: block; width: 100%; aspect-ratio: 16/10; object-fit: contain; background: #f6f2fb; }
.case-preview div { padding: 22px; }
.case-preview h3 { margin: 0 0 9px; font-size: 1.25rem; }
.case-preview p { margin: 0 0 14px; line-height: 1.55; }
.about-page .case-preview-actions { margin-top: 28px; }

.messenger-visual { position: relative; min-height: 480px; display: grid; place-items: center; }
.messenger-orbit { position: absolute; width: 420px; height: 420px; border: 1px solid rgba(112,69,217,.2); border-radius: 50%; animation: service-spin 22s linear infinite; }
.messenger-orbit::before, .messenger-orbit::after { content: ""; position: absolute; width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(145deg, var(--service-violet), var(--service-cyan)); box-shadow: 0 5px 18px rgba(71,49,117,.22); }
.messenger-orbit::before { top: 25px; left: 82px; }
.messenger-orbit::after { right: 15px; bottom: 100px; }
.channel-card { position: relative; z-index: 1; width: min(100%, 390px); padding: 24px; border-radius: 30px; background: rgba(255,255,255,.92); border: 1px solid var(--service-line); box-shadow: 0 28px 70px rgba(66,39,106,.16); backdrop-filter: blur(12px); }
.channel-top { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--service-line); font-weight: 850; }
.channel-logo { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; color: #fff; background: linear-gradient(145deg, var(--service-violet), var(--service-cyan)); }
.chat-line { width: 85%; margin-top: 14px; padding: 12px 14px; border-radius: 16px 16px 16px 5px; background: #f3effb; line-height: 1.45; }
.chat-line.user { width: 73%; margin-left: auto; border-radius: 16px 16px 5px 16px; color: #fff; background: #563092; }
.channel-actions { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin-top: 16px; }
.channel-actions span { padding: 10px; border-radius: 12px; text-align: center; color: #4c2684; background: #e9fbfa; font-size: .85rem; font-weight: 800; }
@keyframes service-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .messenger-orbit { animation: none; } }

.platform-grid { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 34px; }
.platform-card { position: relative; padding: 30px; }
.platform-card.telegram { background: linear-gradient(145deg, #eef9ff, #fff); }
.platform-card.max { background: linear-gradient(145deg, #f4efff, #fff); }
.platform-badge { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; padding: 8px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--service-line); font-weight: 850; }
.platform-card ul, .scope-list { margin: 16px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.platform-card li, .scope-list li { position: relative; padding-left: 22px; line-height: 1.5; }
.platform-card li::before, .scope-list li::before { content: ""; position: absolute; left: 0; top: .52em; width: 9px; height: 9px; border-radius: 50%; background: var(--service-cyan); }
.platform-note { margin-top: 18px; padding: 17px 20px; border-radius: 18px; background: #fff5ed; line-height: 1.55; }
.service-note { margin-top: 22px; }

.telegram-max-page .service-hero-grid { grid-template-columns: minmax(0,1.08fr) minmax(330px,.92fr); }
.telegram-hero-art { position: relative; isolation: isolate; width: min(100%,560px); margin: 0 auto; }
.telegram-hero-art::before { content: ""; position: absolute; z-index: -1; inset: 12% 4% 8%; border-radius: 48%; background: radial-gradient(circle,rgba(47,205,201,.28),rgba(116,74,218,.18) 56%,transparent 74%); filter: blur(28px); }
.telegram-hero-art img { position: relative; z-index: 1; display: block; width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 24px 34px rgba(67,40,111,.14)); }
.telegram-value-section { padding-top: clamp(40px,5vw,72px); }
.telegram-value-panel { position: relative; padding: clamp(25px,3vw,36px) clamp(24px,4vw,46px) clamp(25px,3vw,36px) clamp(48px,5vw,66px); border: 1px solid var(--service-line); border-radius: 26px; background: linear-gradient(135deg,#f6f0ff,#edfffe); }
.telegram-value-panel::before { content: ""; position: absolute; left: clamp(21px,2.5vw,31px); top: 20%; bottom: 20%; width: 4px; border-radius: 999px; background: linear-gradient(#58d8c7,#18a997); box-shadow: 0 0 0 5px rgba(40,190,173,.08); }
.telegram-value-panel h2 { max-width: 26ch; margin: 0 0 18px; color: #432276; line-height: 1.1; }
.telegram-value-panel p { max-width: 980px; margin: 0; font-size: clamp(1rem,1.35vw,1.12rem); line-height: 1.7; }
.channel-service-card { margin-top: 34px; padding: clamp(22px,4vw,40px); border: 1px solid var(--service-line); border-radius: 30px; background: linear-gradient(145deg,#f7f2ff,#effcfb 58%,#fff6ef); box-shadow: 0 20px 54px rgba(64,38,106,.09); }
.channel-service-path { display: flex; align-items: center; justify-content: center; gap: clamp(10px,2vw,22px); max-width: 920px; margin: 0 auto 28px; padding: 18px clamp(14px,3vw,28px); border-radius: 22px; color: #fff; background: linear-gradient(115deg,#342442,#6a3fab 58%,#179f96); box-shadow: 0 16px 35px rgba(71,42,119,.16); }
.channel-service-path span { padding: 9px 15px; border: 1px solid rgba(255,255,255,.26); border-radius: 999px; background: rgba(255,255,255,.1); font-weight: 850; }
.channel-service-path i { color: #6ce2d5; font-style: normal; font-size: 1.25rem; font-weight: 900; }
.channel-service-list { display: grid; grid-template-columns: minmax(0,1fr); gap: 14px; max-width: 920px; margin: 0 auto; padding: 0; list-style: none; counter-reset: channel-service; }
.channel-service-list li { position: relative; min-width: 0; display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 13px; align-items: center; padding: 14px 18px; border: 1px solid rgba(92,58,147,.1); border-radius: 18px; background: rgba(255,255,255,.84); box-shadow: 0 9px 24px rgba(68,42,110,.05); line-height: 1.58; counter-increment: channel-service; }
.channel-service-list li::before { content: counter(channel-service, decimal-leading-zero); display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; color: #fff; background: linear-gradient(145deg,var(--service-violet),var(--service-cyan)); box-shadow: 0 7px 18px rgba(83,52,139,.14); font-size: .78rem; font-weight: 850; }
.channel-service-list li:not(:last-child)::after { content: ""; position: absolute; z-index: 2; left: 34px; bottom: -15px; width: 2px; height: 15px; background: linear-gradient(var(--service-violet),var(--service-cyan)); opacity: .48; }
.channel-service-card > .platform-note { max-width: 920px; margin: 22px auto 0; }
.telegram-bot-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 36px; }
.telegram-bot-card { min-width: 0; padding: 24px; border: 1px solid var(--service-line); border-radius: 23px; background: linear-gradient(145deg,#fff,#f5f0ff); box-shadow: 0 14px 36px rgba(64,38,106,.06); transition: transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.telegram-bot-card:nth-child(4n+2) { background: linear-gradient(145deg,#fff,#edf8ff); }
.telegram-bot-card:nth-child(4n+3) { background: linear-gradient(145deg,#fff,#eafffa); }
.telegram-bot-card:nth-child(4n) { background: linear-gradient(145deg,#fff,#f8f7fa); }
.telegram-bot-card:hover { transform: translateY(-3px); border-color: rgba(111,69,217,.34); box-shadow: 0 20px 44px rgba(64,38,106,.1); }
.telegram-bot-icon { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 17px; border-radius: 14px; color: #fff; background: linear-gradient(145deg,var(--service-violet),var(--service-cyan)); font-size: .92rem; font-weight: 900; }
.telegram-bot-card h3 { margin: 0 0 10px; font-size: 1.2rem; line-height: 1.25; }
.telegram-bot-card p { margin: 0; line-height: 1.58; }
.telegram-motion-ready .telegram-bot-card { opacity: 0; transform: translateY(34px) scale(.985); transition: opacity .85s ease,transform .85s cubic-bezier(.22,.8,.28,1),border-color .22s ease,box-shadow .22s ease; }
.telegram-motion-ready .telegram-bot-card.is-shown { opacity: 1; transform: translateY(0) scale(1); }
.telegram-motion-ready .telegram-bot-card.is-shown:hover { transform: translateY(-3px) scale(1); }
.telegram-implementation-note { max-width: 900px; margin: 24px 0 0; padding: 16px 19px; border-radius: 17px; background: #fff5ed; line-height: 1.58; }
.telegram-journey-section { overflow: hidden; }
.telegram-max-page .telegram-journey-section .scenario-flow { gap: 16px; margin-top: 40px; }
.telegram-max-page .telegram-journey-section .scenario-node { min-height: 190px; padding: 25px 22px; border-radius: 24px; box-shadow: 0 14px 36px rgba(64,38,106,.06); transition: border-color .25s ease,box-shadow .25s ease,transform .82s cubic-bezier(.22,.8,.28,1),opacity .82s ease; }
.telegram-max-page .telegram-journey-section .scenario-node:nth-child(2) { background: linear-gradient(145deg,#fff,#f5efff); }
.telegram-max-page .telegram-journey-section .scenario-node:nth-child(3) { background: linear-gradient(145deg,#fff,#e8fbf8); }
.telegram-max-page .telegram-journey-section .scenario-node:nth-child(4) { background: linear-gradient(145deg,#fff7f0,#fff); }
.telegram-max-page .telegram-journey-section .scenario-node:is(:hover,:focus-visible,.is-active) { outline: none; border-color: rgba(111,69,217,.48); box-shadow: 0 19px 45px rgba(73,42,123,.13); }
.journey-icon { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 16px; border-radius: 13px; color: #fff; background: linear-gradient(145deg,var(--service-violet),var(--service-cyan)); font-size: .78rem; font-weight: 900; }
.telegram-max-page .telegram-journey-section .scenario-node strong { font-size: 1.03rem; line-height: 1.3; }
.telegram-motion-ready .telegram-journey-section .scenario-node { opacity: 0; transform: translateY(42px); }
.telegram-motion-ready .telegram-journey-section .scenario-node.is-shown { opacity: 1; transform: translateY(0); }
.telegram-motion-ready .telegram-journey-section .scenario-node::after { opacity: 0; transition: opacity .38s ease .42s; }
.telegram-motion-ready .telegram-journey-section .scenario-node.is-shown::after { opacity: 1; }
.telegram-price-panel h2 { color: #432276; }
.journey-line { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; margin-top: 36px; }
.journey-line div { position: relative; min-width: 0; padding: 20px 16px; border: 1px solid var(--service-line); border-radius: 19px; background: #fff; }
.journey-line div:not(:last-child)::after { content: "→"; position: absolute; z-index: 2; top: 50%; right: -16px; width: 22px; height: 22px; display: grid; place-items: center; transform: translateY(-50%); border-radius: 50%; color: #fff; background: #6d43d3; font-size: .8rem; }
.journey-line span { display: block; margin-bottom: 8px; color: var(--service-cyan); font-weight: 850; }
.journey-line strong { line-height: 1.35; }
.journey-explanation { max-width: 850px; margin: 24px 0 0; font-size: 1.05rem; line-height: 1.7; }

.scenario-flow { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-top: 36px; }
.scenario-node { position: relative; min-width: 0; padding: 22px 18px; border-radius: 20px; background: #fff; border: 1px solid var(--service-line); }
.scenario-node:not(:last-child)::after { content: "→"; position: absolute; z-index: 2; right: -19px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: #fff; background: #6d43d3; }
.scenario-node strong { display: block; margin-bottom: 8px; color: #542b91; }
.scenario-node p { margin: 0; font-size: .95rem; line-height: 1.5; }

.vk-hero-visual { position: relative; min-height: 480px; display: grid; place-items: center; }
.vk-window { position: relative; z-index: 1; width: min(100%, 440px); overflow: hidden; border-radius: 30px; background: #fff; border: 1px solid var(--service-line); box-shadow: 0 28px 70px rgba(66,39,106,.16); }
.vk-window-cover { height: 125px; background: linear-gradient(125deg, #6f45d9, #35c9c6); }
.vk-window-body { padding: 0 24px 24px; }
.vk-avatar { width: 86px; height: 86px; margin-top: -43px; border: 7px solid #fff; border-radius: 26px; background: linear-gradient(145deg,#f6b074,#6f45d9); display: grid; place-items: center; color: #fff; font-size: 1.4rem; font-weight: 900; }
.vk-window h3 { margin: 14px 0 6px; }
.vk-menu { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 18px; }
.vk-menu span { padding: 11px 7px; border-radius: 12px; text-align: center; background: #f4effd; color: #4e287f; font-size: .8rem; font-weight: 800; }
.vk-action { margin-top: 14px; padding: 13px; border-radius: 13px; text-align: center; color: #fff; background: #542b91; font-weight: 850; }
.vk-float { position: absolute; z-index: 2; padding: 11px 14px; border-radius: 14px; background: #fff; box-shadow: 0 12px 30px rgba(65,38,106,.14); font-weight: 800; }
.vk-float.one { left: 0; top: 72px; }
.vk-float.two { right: -10px; bottom: 60px; }

.vkontakte-page .service-hero-grid { grid-template-columns: minmax(0,1.05fr) minmax(340px,.95fr); gap: clamp(30px,5vw,72px); }
.vkontakte-page .service-hero h1 { max-width: 16ch; font-size: clamp(2.55rem,4.4vw,4.65rem); line-height: 1.03; overflow-wrap: normal; word-break: normal; hyphens: none; }
.vk-ecosystem-art { position: relative; width: min(100%, 520px); margin: 0 auto; }
.vk-ecosystem-art::before { content: ""; position: absolute; inset: 13% 8% 8%; border-radius: 45%; background: radial-gradient(circle,rgba(95,220,217,.25),rgba(123,81,224,.18) 55%,transparent 72%); filter: blur(24px); }
.vk-ecosystem-art img { position: relative; z-index: 1; display: block; width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 22px 30px rgba(72,43,120,.12)); animation: vk-art-float 6s ease-in-out infinite; }
.vk-ecosystem-art.is-interactive { --vk-shift-x: 0px; --vk-shift-y: 0px; --vk-rotate-x: 0deg; --vk-rotate-y: 0deg; transform: perspective(900px) translate3d(var(--vk-shift-x),var(--vk-shift-y),0) rotateX(var(--vk-rotate-x)) rotateY(var(--vk-rotate-y)); transform-style: preserve-3d; transition: transform .28s ease-out; will-change: transform; }
.vk-ecosystem-art.is-interactive::before { transform: translate3d(var(--vk-shift-x),var(--vk-shift-y),0); transition: transform .35s ease-out; }
.vk-ecosystem-art.is-tapped { transform: perspective(900px) translateY(-4px) scale(.985); }
@keyframes vk-art-float { 50% { transform: translateY(-7px); } }
@media (prefers-reduced-motion: reduce) { .vk-ecosystem-art img { animation: none; } .vk-ecosystem-art.is-interactive { transform: none; transition: none; } }

/* Shared hero orbit for the VKontakte and Telegram/MAX service pages. */
.service-orbit-visual { position: relative; isolation: isolate; min-height: 480px; margin: 0; display: grid; place-items: center; }
.service-orbit-visual::before { content: ""; position: absolute; z-index: -1; width: min(470px, 96%); aspect-ratio: 1; border-radius: 56% 44% 39% 61% / 43% 42% 58% 57%; background: linear-gradient(145deg, rgba(227,216,255,.92), rgba(198,246,238,.82) 62%, rgba(253,228,241,.76)); box-shadow: 0 30px 72px rgba(97,73,162,.09); transform: rotate(3deg); }
.service-orbit { width: min(370px, 94%); background: radial-gradient(circle at 48% 48%, rgba(255,255,255,.8), rgba(220,249,246,.24) 42%, rgba(221,208,255,.27) 72%, transparent); }
.service-orbit .orbit-track-outer { --orbit-diameter: 326px; }
.service-orbit .orbit-track-middle { --orbit-diameter: 274px; }
.service-orbit .orbit-track-inner { --orbit-diameter: 230px; }
.service-orbit-core { width: 102px; padding: 0; background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(234,239,255,.94) 54%, rgba(216,250,246,.9)); box-shadow: 0 18px 42px rgba(76,44,135,.24); }
.service-orbit-core img { display: block; width: 54px; height: 54px; object-fit: contain; }
.messenger-orbit-core { width: 116px; }
.messenger-orbit-core > span { display: flex; align-items: center; justify-content: center; gap: 7px; }
.messenger-orbit-core img { width: 42px; height: 42px; }
.vk-orbit-core img { width: 58px; height: 58px; }

@media (max-width: 640px) {
  .service-orbit-visual { min-height: 320px; }
  .service-orbit-visual::before { width: min(316px, 96%); }
  .service-orbit { width: min(288px, calc(100vw - 30px)); }
  .service-orbit .orbit-track-outer { --orbit-diameter: 248px; }
  .service-orbit .orbit-track-middle { --orbit-diameter: 212px; }
  .service-orbit .orbit-track-inner { --orbit-diameter: 196px; }
  .service-orbit-core { width: 78px; }
  .service-orbit-core img { width: 44px; height: 44px; }
  .messenger-orbit-core { width: 94px; }
  .messenger-orbit-core img { width: 34px; height: 34px; }
}
.vk-intro-panel { position: relative; padding: clamp(24px,3vw,34px) clamp(24px,4vw,46px) clamp(24px,3vw,34px) clamp(42px,5vw,62px); border: 1px solid var(--service-line); border-radius: 26px; background: linear-gradient(135deg,#f6f0ff,#edfffe); }
.vk-intro-panel::before { content: ""; position: absolute; left: clamp(20px,2.5vw,30px); top: 24%; bottom: 24%; width: 3px; border-radius: 999px; background: linear-gradient(var(--service-violet),var(--service-cyan)); }
.vk-intro-panel p { max-width: 1020px; margin: 0; color: #432276; font-size: clamp(1.05rem,1.45vw,1.24rem); line-height: 1.62; font-weight: 500; }
.vk-path-note { max-width: 780px; margin: 24px 0 0; color: var(--muted); font-size: .95rem; line-height: 1.55; }
.vkontakte-page .case-preview { display: flex; flex-direction: column; }
.vkontakte-page .case-preview > div { display: flex; flex: 1; flex-direction: column; }
.vkontakte-page .case-preview .text-link { margin-top: auto; }
.case-links { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: auto; padding: 0; }
.case-links .text-link { margin-top: 0; }

.vk-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 34px; }
.vk-tool-card { display: grid; grid-template-columns: 52px minmax(0,1fr); gap: 16px; align-items: start; }
.vk-tool-card .card-number { margin: 0; }
.vk-tool-card h3 { margin-top: 3px; }
.scope-group-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 34px; }
.scope-group { min-width: 0; padding: 28px; border: 1px solid var(--service-line); border-radius: 26px; background: #fff; box-shadow: 0 16px 42px rgba(64,38,106,.07); }
.scope-group:nth-child(2) { background: #fff5ed; }
.scope-group:nth-child(3) { background: #edfffd; }
.scope-group h3 { margin: 0 0 14px; font-size: 1.35rem; line-height: 1.2; }
.vkontakte-page .section-pad { padding-block: clamp(48px,5.5vw,76px); }
.vkontakte-page .section-heading { max-width: 820px; }
.vkontakte-page .section-heading h2 { max-width: 17ch; text-wrap: balance; }
.vkontakte-page .section-heading > p { max-width: 720px; margin: 0; font-size: 1.05rem; line-height: 1.65; }
.vkontakte-page .scope-group-grid { align-items: stretch; gap: 20px; margin-top: 38px; }
.vkontakte-page .scope-group { position: relative; display: flex; min-height: 100%; flex-direction: column; overflow: hidden; padding: clamp(25px,3vw,36px); border-radius: 28px; transition: transform .22s,border-color .22s,box-shadow .22s; }
.vkontakte-page .scope-group::after { content: none; }
.vkontakte-page .scope-group:hover { transform: translateY(-4px); border-color: rgba(111,69,217,.36); box-shadow: 0 24px 58px rgba(64,38,106,.12); }
.vkontakte-page .scope-group:nth-child(1) { color: #fff; border-color: transparent; background: linear-gradient(145deg,#342442,#5e318d); }
.vkontakte-page .scope-group:nth-child(2) { background: linear-gradient(145deg,#fff,#fff1e7); }
.vkontakte-page .scope-group:nth-child(3) { background: linear-gradient(145deg,#f5f0ff,#ddfaf6); }
.vkontakte-page .scope-group:nth-child(1) h3,
.vkontakte-page .scope-group:nth-child(1) p,
.vkontakte-page .scope-group:nth-child(1) li { color: #fff; }
.vkontakte-page .scope-group:nth-child(1) .scope-lead { color: rgba(255,255,255,.78); }
.vkontakte-page .scope-group:nth-child(1) .scope-list li::before { background: #64ded5; }
.vkontakte-page .scope-group .card-number { position: relative; z-index: 1; flex: 0 0 auto; }
.vkontakte-page .scope-group:nth-child(1) .card-number { color: #342442; background: #fff; }
.vkontakte-page .scope-group h3 { position: relative; z-index: 1; margin-bottom: 13px; font-size: clamp(1.34rem,1.8vw,1.58rem); }
.vkontakte-page .scope-lead { position: relative; z-index: 1; min-height: 5em; margin: 0; line-height: 1.6; }
.vkontakte-page .scope-list { position: relative; z-index: 1; margin-top: 22px; gap: 12px; }
.vkontakte-page .scope-list li { color: var(--service-ink); }
.vkontakte-page .scope-list li::before { transition: transform .22s ease,box-shadow .22s ease; }
.vkontakte-page .scope-group:hover .scope-list li::before { transform: scale(1.3); box-shadow: 0 0 0 5px rgba(32,191,199,.12); }
.vkontakte-page .scope-group:hover .scope-list li:nth-child(2)::before { transition-delay: 45ms; }
.vkontakte-page .scope-group:hover .scope-list li:nth-child(3)::before { transition-delay: 90ms; }
.vkontakte-page .scope-group:hover .scope-list li:nth-child(4)::before { transition-delay: 135ms; }
.vkontakte-page .scope-group:hover .scope-list li:nth-child(5)::before { transition-delay: 180ms; }
.vkontakte-page .scope-group:hover .scope-list li:nth-child(6)::before { transition-delay: 225ms; }
.vk-journey-section { overflow: hidden; }
.vk-journey-section::before { content: ""; position: absolute; z-index: -1; width: 500px; height: 500px; left: -260px; top: -160px; border-radius: 50%; background: radial-gradient(circle,rgba(117,77,218,.11),transparent 70%); }
.vkontakte-page .scenario-flow { gap: 16px; margin-top: 40px; }
.vkontakte-page .scenario-node { min-height: 176px; padding: 27px 23px; border-radius: 24px; box-shadow: 0 14px 36px rgba(64,38,106,.06); }
.vkontakte-page .scenario-node:nth-child(2) { background: linear-gradient(145deg,#fff,#f5efff); }
.vkontakte-page .scenario-node:nth-child(3) { background: linear-gradient(145deg,#fff,#e8fbf8); }
.vkontakte-page .scenario-node:nth-child(4) { background: linear-gradient(145deg,#fff7f0,#fff); }
.vkontakte-page .scenario-node strong { font-size: 1.03rem; line-height: 1.3; }
.vk-motion-ready .vk-journey-section .scenario-node { opacity: 0; transform: translateY(42px); transition: opacity .82s ease,transform .82s cubic-bezier(.22,.8,.28,1),box-shadow .22s; }
.vk-motion-ready .vk-journey-section .scenario-node.is-shown { opacity: 1; transform: translateY(0); }
.vk-motion-ready .vk-journey-section .scenario-node::after { opacity: 0; transition: opacity .38s ease .42s; }
.vk-motion-ready .vk-journey-section .scenario-node.is-shown::after { opacity: 1; }
.vkontakte-page .case-preview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; margin-top: 38px; }
.vkontakte-page .case-preview { border-radius: 26px; transition: transform .22s,border-color .22s,box-shadow .22s; }
.vkontakte-page .case-preview img { transition: transform .5s ease; }
.vkontakte-page .case-preview h3 { text-wrap: balance; }
.vkontakte-page .case-preview:hover { transform: translateY(-4px); border-color: rgba(111,69,217,.34); box-shadow: 0 22px 52px rgba(64,38,106,.11); }
.vkontakte-page .case-preview:hover img { transform: scale(1.025); }
.vkontakte-page .case-preview .text-link { transition: transform .2s,color .2s; }
.vkontakte-page .case-preview:hover .text-link { transform: translateX(4px); }
.vkontakte-page .case-preview:nth-child(2) { background: linear-gradient(145deg,#fff,#f7f2ff); }
.vkontakte-page .case-preview:nth-child(3) { background: linear-gradient(145deg,#fff,#edfffd); }
.vkontakte-page .service-final .final-panel { background: linear-gradient(135deg,#2e2237,#5e318d 62%,#168f87); border-radius: 44px; }
.tool-purpose { display: grid; grid-template-columns: .55fr 1.45fr; gap: 28px; margin-top: 24px; padding: 28px; border-radius: 24px; background: #f5f0ff; }
.tool-purpose h3 { margin: 0; color: #542b91; }
.tool-purpose div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 24px; }
.tool-purpose p { margin: 0; }

.price-composition { display: grid; grid-template-columns: minmax(0,1fr) minmax(290px,.65fr); gap: 26px; align-items: stretch; margin-top: 36px; }
.price-main, .price-side { padding: clamp(26px,4vw,42px); border-radius: 28px; }
.price-main { color: #fff; background: linear-gradient(135deg,#542b91,#7650d7 55%,#21bfc2); }
.price-main .price { display: block; margin: 12px 0 18px; font-size: clamp(2.5rem,5vw,4.7rem); line-height: 1; font-weight: 900; }
.price-main ul { margin: 0; padding-left: 22px; line-height: 1.75; }
.price-side { background: #fff4ec; border: 1px solid rgba(241,154,91,.28); }
.price-side h3 { margin-top: 0; }
.price-side strong { display: block; margin-top: 18px; color: #6a359f; font-size: 1.4rem; }

.service-final { padding-bottom: clamp(60px,8vw,110px); }
.service-final .final-panel { overflow-wrap: anywhere; }

@media (max-width: 980px) {
  .service-hero-grid, .principle-panel { grid-template-columns: 1fr; }
  .telegram-max-page .service-hero-grid { grid-template-columns: minmax(0,1fr); }
  .telegram-hero-art { width: min(76vw,540px); }
  .about-page .service-hero-grid { grid-template-columns: minmax(0,1fr); }
  .service-hero-copy { max-width: 800px; }
  .about-portrait { max-width: 390px; }
  .value-grid, .direction-grid, .case-preview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .education-grid, .scope-group-grid { grid-template-columns: 1fr; }
  .document-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .about-page .service-link-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .journey-line { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .journey-line div:nth-child(3)::after { display: none; }
  .scenario-flow { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .scenario-node:nth-child(2)::after { display: none; }
  .telegram-bot-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .telegram-max-page .telegram-journey-section .scenario-flow { grid-template-columns: minmax(0,1fr); gap: 36px; }
  .telegram-max-page .telegram-journey-section .scenario-node { min-height: 0; }
  .telegram-max-page .telegram-journey-section .scenario-node::after,
  .telegram-max-page .telegram-journey-section .scenario-node:nth-child(2)::after { content: "↓"; display: grid; right: auto; left: 50%; top: auto; bottom: -31px; transform: translateX(-50%); }
  .telegram-max-page .telegram-journey-section .scenario-node:last-child::after { display: none; }
  .telegram-price-panel { grid-template-columns: minmax(0,1fr); }
  .vkontakte-page .service-hero-grid { grid-template-columns: minmax(0,1fr); }
  .vk-ecosystem-art { width: min(76vw,500px); }
  .vkontakte-page .scope-lead { min-height: 0; }
}

@media (max-width: 700px) {
  .service-page .section-pad { padding-block: 50px; }
  .service-hero { padding-top: 42px; }
  .service-hero-grid { grid-template-columns: minmax(0,1fr); gap: 34px; }
  .service-hero h1 { font-size: clamp(2.35rem, 12vw, 3.65rem); line-height: 1.02; }
  .value-grid, .direction-grid, .case-preview-grid, .platform-grid, .vk-tool-grid, .price-composition, .education-grid, .tool-grid, .service-link-grid, .scope-group-grid { grid-template-columns: minmax(0,1fr); }
  .document-gallery, .about-page .service-link-grid { grid-template-columns: minmax(0,1fr); }
  .about-page .about-portrait { width: min(76vw, 280px); }
  .document-preview { height: 290px; }
  .hero-service-image { max-width: 620px; margin-inline: auto; padding: 7px; border-radius: 25px; }
  .hero-service-image img { border-radius: 18px; }
  .telegram-hero-art { width: min(88vw,480px); }
  .telegram-value-panel, .channel-service-card { border-radius: 24px; }
  .telegram-bot-grid { grid-template-columns: minmax(0,1fr); }
  .channel-service-path { gap: 8px; padding: 14px 10px; border-radius: 18px; }
  .channel-service-path span { padding: 8px 10px; font-size: .82rem; }
  .channel-service-path i { font-size: 1rem; }
  .tool-purpose { grid-template-columns: 1fr; }
  .tool-purpose div { grid-template-columns: 1fr; }
  .journey-line { grid-template-columns: 1fr; }
  .journey-line div:not(:last-child)::after, .journey-line div:nth-child(3)::after { display: grid; top: auto; right: auto; left: 50%; bottom: -16px; transform: translateX(-50%) rotate(90deg); }
  .messenger-visual, .vk-hero-visual { min-height: 420px; }
  .messenger-orbit { width: 340px; height: 340px; }
  .portrait-note { right: -6px; bottom: 16px; max-width: 205px; font-size: .86rem; }
  .scenario-flow { grid-template-columns: minmax(0,1fr); }
  .scenario-node::after, .scenario-node:nth-child(2)::after { right: auto; left: 50%; top: auto; bottom: -19px; transform: translateX(-50%) rotate(90deg); }
  .scenario-node:last-child::after { display: none; }
  .vkontakte-page .service-hero h1 { max-width: 17ch; font-size: clamp(2.1rem,9.6vw,3.25rem); line-height: 1.06; overflow-wrap: normal; word-break: normal; hyphens: none; }
  .vkontakte-page .case-preview-grid { grid-template-columns: minmax(0,1fr); }
  .vkontakte-page .scenario-flow { gap: 36px; }
  .vkontakte-page .scenario-node::after,
  .vkontakte-page .scenario-node:nth-child(2)::after { content: "↓"; display: grid; right: auto; left: 50%; top: auto; bottom: -31px; transform: translateX(-50%); }
  .vkontakte-page .scenario-node:last-child::after { display: none; }
  .vk-float { font-size: .8rem; }
  .vk-float.one { left: -4px; top: 36px; }
  .vk-float.two { right: -4px; bottom: 32px; }
  .vk-ecosystem-art { width: min(92vw,430px); }
}

@media (max-width: 390px) {
  .service-hero h1, .service-page .section-heading h2 { overflow-wrap: anywhere; word-break: normal; }
  .service-hero .actions, .service-final .actions { display: grid; grid-template-columns: 1fr; }
  .service-hero .button, .service-final .button { width: 100%; justify-content: center; }
  .channel-card, .vk-window { border-radius: 23px; }
  .messenger-visual, .vk-hero-visual { min-height: 390px; }
  .messenger-orbit { width: 292px; height: 292px; }
  .channel-actions { grid-template-columns: 1fr; }
  .about-portrait { max-width: 270px; }
  .portrait-note { position: relative; right: auto; bottom: auto; margin: -18px 10px 0 auto; }
  .principle-panel, .value-card, .direction-card, .platform-card, .vk-tool-card { padding: 22px; }
  .credential-card, .scope-group, .tool-purpose, .tool-grid article, .service-link-grid a { padding: 21px; }
  .vkontakte-page .scope-group { padding: 23px 21px; border-radius: 23px; }
  .vkontakte-page .scope-list { margin-top: 18px; gap: 10px; }
  .vkontakte-page .scenario-node { min-height: 0; padding: 23px 21px; }
  .vkontakte-page .service-hero h1 { font-size: clamp(2rem,9.4vw,2.35rem); overflow-wrap: normal; word-break: normal; }
  .work-step { grid-template-columns: 56px minmax(0,1fr); gap: 14px; }
  .work-step::before { width: 48px; height: 48px; }
  .work-step:not(:last-child)::after { left: 23px; top: 48px; }
  .vk-menu { grid-template-columns: 1fr; }
  .vk-float { display: none; }
  .about-page .education-heading h2, .about-method .section-heading h2 { font-size: clamp(1.82rem,9.4vw,2.3rem); line-height: 1.08; }
  .document-gallery { gap: 14px; }
  .document-preview { height: 228px; }
  .document-card { padding: 10px 10px 16px; }
  .document-card h3 { margin-top: 14px; }
  .platform-pills { gap: 9px; }
  .platform-pills span { padding: 11px 15px; }
  .about-tools-layout { grid-template-columns: 1fr; gap: 24px; }
  .about-tools-layout .section-heading h2 { max-width: none; }
  .about-tools-layout .platform-summary { margin-top: 22px; font-size: 1rem; }
  .about-tools-layout .platform-pills { min-height: 0; padding: 27px 9px; gap: 10px; }
  .about-tools-layout .platform-pills::before { inset: 0 -4px; transform: rotate(1deg); }
  .about-tools-layout .platform-pills span { padding: 11px 14px; }
  .about-tools-layout .platform-pills span:nth-child(3n) { transform: rotate(.8deg) translateY(-2px); }
  .about-tools-layout .platform-pills span:nth-child(4n + 2) { transform: rotate(-.8deg) translateY(2px); }
  .about-tools-layout .platform-pills span:nth-child(5n) { transform: rotate(.5deg) translateY(-3px); }
  .about-page .service-link-grid a { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .about-motion-ready .about-page .credential-card,
  .about-motion-ready .about-page .service-link-grid a { opacity: 1; transform: none; transition: none; }
  .about-page .credential-card,
  .about-page .document-card,
  .about-page .document-preview img,
  .about-page .platform-pills span { transition: none; }
  .vk-motion-ready .vk-journey-section .scenario-node { opacity: 1; transform: none; transition: none; }
  .vk-motion-ready .vk-journey-section .scenario-node::after { opacity: 1; transition: none; }
  .telegram-motion-ready .telegram-journey-section .scenario-node { opacity: 1; transform: none; transition: none; }
  .telegram-motion-ready .telegram-journey-section .scenario-node::after { opacity: 1; transition: none; }
  .telegram-motion-ready .telegram-bot-card { opacity: 1; transform: none; transition: none; }
  .telegram-bot-card { transition: none; }
  .vkontakte-page .scope-list li::before,
  .vkontakte-page .case-preview,
  .vkontakte-page .case-preview img,
  .vkontakte-page .case-preview .text-link { transition: none; }
}
