/* Главная: светлая творческая среда и живые примеры пользовательского контента. */
.cp-home { --home-ink:var(--portal-color-ink); --home-muted:var(--portal-color-muted); --home-line:var(--portal-color-line); --home-blue:var(--portal-color-blue); --home-purple:var(--portal-color-purple); --home-paper:var(--portal-color-paper); --home-ease:cubic-bezier(.22,1,.36,1); color:var(--home-ink); background:var(--home-paper); }
.cp-home .shell { width:min(91vw,80rem); }
.cp-home :is(a,button,summary):focus-visible { outline:3px solid var(--home-blue); outline-offset:5px; }
.cp-home :is(section[id],main[id]) { scroll-margin-top:6rem; }
.cp-home h2 { font:650 clamp(1.65rem,3.15vw,2.8rem)/1.24 'Unbounded',sans-serif; letter-spacing:-.055em; }
.cp-home h2>span { color:var(--home-purple); }
.cp-home #tools-title { font-size:clamp(1.155rem,2.205vw,1.96rem); }
.cp-home h3 { letter-spacing:-.03em; }
.cp-home .cp-section { padding-block:clamp(3.75rem,6.8vw,6.5rem); }
.cp-home .cp-kicker { margin-bottom:1.35rem; color:var(--home-purple); font-size:.78rem; font-weight:700; }
.cp-home .cp-muted { color:var(--home-muted); font-size:.82rem; }
.cp-home .cp-small-label { font-size:.75rem; font-weight:650; }
.cp-home .cp-skip { position:fixed; z-index:100; top:.5rem; left:.5rem; padding:1rem; color:#f7f8fc; background:var(--home-blue); transform:translateY(-160%); }
.cp-home .cp-skip:focus { transform:translateY(0); }
.cp-home .site-header { padding-block:.9rem; background:var(--home-paper); border-bottom:1px solid transparent; transition:border-color 180ms; }
.cp-home .site-header.is-scrolled { padding-block:.9rem; box-shadow:none; backdrop-filter:none; border-color:var(--home-line); }
.cp-home .brand { font-size:.94rem; letter-spacing:-.055em; }
.cp-home .brand .brand-pack { color: var(--home-blue); }
.cp-home .brand-mark { width:2.35rem; height:2.35rem; }
.cp-home .site-nav { gap:clamp(1.1rem,2.2vw,2rem); font-weight:550; }
.cp-home .nav-cta { min-height:2.8rem; padding:.65rem 1rem; border-radius:.5rem; color:#f7f8fc; background:var(--home-blue); font-size:.8rem; font-weight:600; }
.cp-home .nav-cta:hover { background:#095dbb; transform:none; box-shadow:none; }
.cp-home .cp-button { display:inline-flex; gap:1.1rem; align-items:center; justify-content:space-between; min-height:3.4rem; border-radius:.55rem; padding:.9rem 1.3rem; font-size:.92rem; font-weight:650; transition:background-color 180ms,transform 220ms var(--home-ease); }
.cp-home .cp-button>span { font-size:1.2rem; }
.cp-home .cp-button:hover { transform:translateY(-2px); }
.cp-home .cp-button-white { color:#171a2b; background:#f7f8fc; }
.cp-home .cp-button-white:hover { background:#e9edf5; }
.cp-home .cp-button-blue { color:#f7f8fc; background:var(--home-blue); }
.cp-home .cp-button-blue:hover { background:#095dbb; }
.cp-home .cp-text-link { display:inline-flex; align-items:center; gap:1.5rem; min-height:2.75rem; font-size:.9rem; font-weight:600; }
.cp-home .cp-text-link>span { color:var(--home-blue); font-size:1.25rem; }
.cp-home .cp-text-link:hover { color:var(--home-blue); }
/* Надпись занимает свободную область сцены «Глубина», как в редакторе. */
.cp-home .cp-hero { padding-top:6.3rem; }
.cp-home .cp-stage { position:relative; min-height:clamp(36rem,47vw,43rem); overflow:hidden; border-radius:1rem; isolation:isolate; color:#f7f8fc; background:#152039 url('/static/landing/images/homepage-depth.webp') center/cover; }
.cp-home .cp-hero-canvas { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
.cp-home .cp-stage::after { content:''; position:absolute; z-index:-1; inset:55% 0 0; background:linear-gradient(0deg,rgba(14,22,40,.85),rgba(14,22,40,0)); pointer-events:none; }
.cp-home .cp-stage-top { position:absolute; top:1.8rem; inset-inline:2rem; display:flex; justify-content:space-between; gap:2rem; font-size:.7rem; color:#dce4f3; }
.cp-home .cp-stage-top>span:first-child { display:flex; align-items:center; gap:.6rem; }
.cp-home .cp-stage-top i { width:.4rem; height:.4rem; background:#ff9418; border-radius:50%; }
.cp-home .cp-stage-copy { position:absolute; top:20%; left:9%; right:9%; text-align:center; }
.cp-home .cp-stage-kicker { font-size:.8rem; color:#d2dcec; margin-bottom:1.5rem; }
.cp-home .cp-stage h1 { font:700 clamp(2rem,4.7vw,4.3rem)/1.16 'Unbounded',sans-serif; letter-spacing:-.065em; margin:0; color:#f7f8fc; }
.cp-home .cp-stage h1>span { display:block; }
.cp-home .cp-title-dot { color:#ff9418; }
.cp-home .cp-stage-bottom { position:absolute; inset-inline:2rem; bottom:3.5rem; text-align:center; }
.cp-home .cp-stage-bottom>p { margin-bottom:1.45rem; color:#dce4f3; font-size:.95rem; line-height:1.6; }
.cp-home .cp-actions { display:flex; justify-content:center; align-items:center; gap:1.8rem; }
.cp-home .cp-stage-link { display:inline-flex; gap:1rem; align-items:center; min-height:2.75rem; font-size:.88rem; }
.cp-home .cp-stage-link:hover { color:#ffb355; }
.cp-home .cp-stage-corner { position:absolute; bottom:1.3rem; right:1.7rem; font-size:.55rem; letter-spacing:.1em; color:#b1bdd2; }
.cp-home .cp-stage.cp-is-marquee .cp-stage-copy { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.cp-home .cp-scene-bar { display:flex; align-items:center; gap:1.5rem; padding-block:1.2rem; border-bottom:1px solid var(--home-line); }
.cp-home .cp-scene-caption { flex:1; }
.cp-home .cp-scene-caption p { margin:.1rem 0 0; font-size:.72rem; color:var(--home-muted); }
.cp-home .cp-scene-controls { display:flex; padding:.25rem; gap:.25rem; background:#e9edf5; border-radius:.65rem; }
.cp-home .cp-scene-button { display:flex; align-items:center; justify-content:center; gap:.6rem; border:1px solid transparent; min-height:2.8rem; border-radius:.45rem; padding:.55rem 1rem; background:transparent; color:var(--home-muted); font-size:.8rem; font-weight:550; cursor:pointer; }
.cp-home .cp-scene-button>span { font-size:1.1rem; }
.cp-home .cp-scene-button[aria-pressed='true'] { color:var(--home-ink); background:#fdfdff; border-color:#d7dce7; }
.cp-home .cp-scene-button:hover { color:var(--home-purple); }
.cp-home .cp-pause { flex:0 0 2.8rem; height:2.8rem; border:1px solid var(--home-line); border-radius:.5rem; background:transparent; cursor:pointer; color:var(--home-ink); }
.cp-home .cp-pause:hover { background:#e9edf5; }
.cp-home .cp-hero-note { font-size:.72rem; color:var(--home-muted); margin:.8rem 0 0; }
.cp-home .cp-intro { display:grid; grid-template-columns:1.25fr 1fr; align-items:center; gap:6%; }
.cp-home .cp-intro h2 { font-size:clamp(1.6rem,2.6vw,2.3rem); }
.cp-home .cp-intro-copy>p { max-width:31rem; color:var(--home-muted); font-size:1.02rem; }
.cp-home .cp-section-heading { display:flex; justify-content:space-between; align-items:end; gap:3rem; margin-bottom:2.7rem; }
.cp-home .cp-section-heading h2 { margin-bottom:0; }
@media (min-width:833px) { .cp-home .cp-tools .cp-section-heading>p { max-width:26rem; } }
.cp-home .cp-section-heading>p { margin-bottom:.3rem; max-width:21rem; color:var(--home-muted); font-size:.95rem; }
.cp-home .cp-tools { background:var(--portal-color-surface-secondary); border-block:1px solid var(--home-line); }
.cp-home .cp-tool-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:2.2rem 1.25rem; }
.cp-home .cp-tool { grid-column:span 3; display:block; min-width:0; border-radius:.8rem; }
.cp-home .cp-tool-background,.cp-home .cp-tool-type { grid-column:span 6; }
.cp-home .cp-tool-art { position:relative; height:13rem; border-radius:.75rem; overflow:hidden; isolation:isolate; transition:transform 350ms var(--home-ease); }
.cp-home .cp-tool-background .cp-tool-art,.cp-home .cp-tool-type .cp-tool-art { height:18rem; }
.cp-home .cp-tool:hover .cp-tool-art { transform:translateY(-4px); }
.cp-home .cp-art-top { position:absolute; z-index:2; top:1rem; inset-inline:1.1rem; display:flex; align-items:center; justify-content:space-between; gap:.5rem; font-size:.5rem; letter-spacing:.09em; opacity:.7; }
.cp-home .cp-art-top>span:last-child { font-size:1.2rem; line-height:1; }
.cp-home .cp-tool-info { padding:1rem .2rem 0; }
.cp-home .cp-tool-info h3 { display:flex; justify-content:space-between; align-items:center; gap:.8rem; font-size:1.12rem; font-weight:650; margin-bottom:.4rem; }
.cp-home .cp-tool-info h3>span { color:var(--home-blue); font-size:1.3rem; transition:transform 180ms; }
.cp-home .cp-tool:hover h3>span { transform:translate(2px,-2px); }
.cp-home .cp-tool-info p { font-size:.82rem; color:var(--home-muted); margin:0; max-width:30rem; line-height:1.55; }
.cp-home .cp-tool-background .cp-tool-art { color:#f7f8fc; background:#232541; }
.cp-home [data-tool-canvas] { position:absolute; inset:0; width:100%; height:100%; z-index:-1; }
.cp-home .cp-art-background-copy { position:absolute; inset:27% 1rem auto; text-align:center; }
.cp-home .cp-art-background-copy small { font-size:.65rem; color:#d9d3f0; }
.cp-home .cp-art-background-copy strong { display:block; font:650 clamp(1.8rem,3.2vw,2.65rem)/1.15 'Unbounded',sans-serif; margin-top:.65rem; letter-spacing:-.05em; }
.cp-home .cp-tool-type .cp-tool-art { color:#442408; background:#f6aa53; }
.cp-home .cp-art-type { position:absolute; inset:24% 7% auto; }
.cp-home .cp-art-type>span { display:block; font:650 clamp(1.6rem,2.7vw,2.5rem)/1.25 'Unbounded',sans-serif; letter-spacing:-.06em; }
.cp-home .cp-art-type strong { display:flex; align-items:center; justify-content:space-between; font:750 clamp(2rem,3.8vw,3.2rem)/1.25 'Unbounded',sans-serif; letter-spacing:-.075em; }
.cp-home .cp-art-type strong>span { font-size:1.2em; color:#fff0d5; }
.cp-home .cp-art-type small { display:block; font-size:.72rem; margin-top:1.15rem; }
.cp-home .cp-tool-chapter .cp-tool-art { background:#e3dcf9; color:#3b168f; }
.cp-home .cp-art-chapter { position:absolute; inset:34% 9% auto; display:flex; align-items:center; gap:1.1rem; }
.cp-home .cp-art-chapter>span { font:700 clamp(2rem,3vw,3rem)/1 'Unbounded',sans-serif; letter-spacing:-.07em; }
.cp-home .cp-art-chapter small { display:block; font-size:.48rem; letter-spacing:.04em; margin-bottom:.55rem; }
.cp-home .cp-art-chapter strong { font-size:1.05rem; line-height:1.25; }
.cp-home .cp-art-chapter>i { position:absolute; width:150%; height:1px; background:#7e56d0; bottom:-1.2rem; left:-10%; }
.cp-home .cp-tool-lower .cp-tool-art { background:#e9e6df; color:#28392f; }
.cp-home .cp-art-orbit { position:absolute; width:11rem; height:11rem; border:1px solid #b7bcb1; border-radius:50%; top:-3rem; right:-3rem; box-shadow:0 0 0 1.5rem #d4d7ce,0 0 0 1.56rem #b7bcb1; }
.cp-home .cp-lower-caption { position:absolute; display:flex; align-items:center; gap:.6rem; bottom:2rem; inset-inline:1.2rem; background:#28392f; padding:.85rem .7rem; color:#f2f0e6; border-radius:.35rem; animation:cp-caption 8s var(--home-ease) infinite; }
.cp-home .cp-lower-caption>span { display:grid; width:2rem; height:2rem; flex:0 0 2rem; place-items:center; border-radius:50%; color:#28392f; background:#dfe5b1; font-size:.9rem; }
.cp-home .cp-lower-caption strong { display:block; font-size:.75rem; font-weight:550; }
.cp-home .cp-lower-caption small { display:block; font-size:.52rem; color:#c5ccbf; margin-top:.15rem; }
.cp-home .cp-lower-caption>i { font-style:normal; margin-left:auto; color:#dfe5b1; }
.cp-home .cp-tool-data .cp-tool-art { color:#144975; background:#dce9f3; }
.cp-home .cp-art-data { position:absolute; inset:30% 10% 10%; }
.cp-home .cp-art-data>small { font-size:.48rem; letter-spacing:.025em; }
.cp-home .cp-chart { height:6rem; display:flex; align-items:end; gap:8%; padding-inline:4%; border-bottom:1px solid currentColor; }
.cp-home .cp-chart>i { width:11%; background:#0b6edc; border-radius:.2rem .2rem 0 0; transform-origin:bottom; animation:cp-chart 8s var(--home-ease) infinite; }
.cp-home .cp-chart>i:nth-child(1) { height:30%; animation-delay:.05s; }
.cp-home .cp-chart>i:nth-child(2) { height:48%; animation-delay:.1s; }
.cp-home .cp-chart>i:nth-child(3) { height:41%; animation-delay:.15s; }
.cp-home .cp-chart>i:nth-child(4) { height:65%; animation-delay:.2s; }
.cp-home .cp-chart>i:nth-child(5) { height:83%; animation-delay:.25s; }
.cp-home .cp-chart>i:nth-child(6) { height:100%; animation-delay:.3s; background:#f69229; }
.cp-home .cp-chart-labels { display:flex; justify-content:space-between; font-size:.55rem; margin-top:.35rem; }
.cp-home .cp-tool-subscribe .cp-tool-art { color:#f3edf9; background:#49367c; }
.cp-home .cp-art-subscribe { position:absolute; inset:30% .8rem 10%; text-align:center; }
.cp-home .cp-subscribe-star { position:absolute; top:-1.25rem; right:6%; font-size:2.6rem; color:#c3abea; animation:cp-turn 18s linear infinite; }
.cp-home .cp-subscribe-button { position:relative; display:inline-flex; align-items:center; gap:1.5rem; padding:.85rem 1.1rem; margin-top:1.1rem; background:#f4effc; color:#49367c; border-radius:.4rem; font-size:.95rem; font-weight:700; }
.cp-home .cp-subscribe-button>span { color:#b06c1a; }
.cp-home .cp-art-subscribe small { display:block; font-size:.6rem; margin-top:.8rem; color:#d6c7eb; }
.cp-home .cp-tools-foot { display:flex; align-items:center; justify-content:space-between; gap:2rem; border-top:1px solid #d8dde7; margin-top:2.5rem; padding-top:1.2rem; }
.cp-home .cp-tools-foot>span { color:var(--home-muted); font-size:.85rem; }
/* Переключение палитры показывает общую систему оформления. */
.cp-home [data-project-palette]:not([data-palette-ready]) .cp-palette-picker { display:none; }
.cp-home .cp-palette-picker { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.8rem; }
.cp-home .cp-palette-picker button { display:flex; align-items:center; gap:.6rem; min-height:3rem; border:1px solid var(--home-line); border-radius:.5rem; padding:.5rem .75rem; color:var(--home-muted); background:transparent; font-size:.78rem; cursor:pointer; }
.cp-home .cp-palette-picker button[aria-pressed='true'] { background:#ebf4ff; color:var(--home-blue); border-color:var(--home-blue); }
.cp-home .cp-swatch { width:1.25rem; height:1.25rem; border-radius:50%; }
.cp-home .cp-swatch-studio { background:linear-gradient(135deg,#0b6edc 50%,#ffad42 50%); }
.cp-home .cp-swatch-terra { background:linear-gradient(135deg,#ac4d32 50%,#f4c57d 50%); }
.cp-home .cp-swatch-forest { background:linear-gradient(135deg,#27634c 50%,#c9d79d 50%); }
.cp-home .cp-brand-board { --demo-bg:#182b43; --demo-fg:#eef3fb; --demo-accent:#ffad42; --demo-secondary:#4586da; --demo-soft:#e3ebf6; min-width:0; background:#fdfdff; border:1px solid var(--home-line); border-radius:.9rem; padding:1rem; }
.cp-home .cp-board-banner { position:relative; overflow:hidden; min-height:15.5rem; padding:2rem 2rem 2rem 5.8rem; color:var(--demo-fg); background:var(--demo-bg); border-radius:.4rem; transition:background-color 300ms; }
.cp-home .cp-board-logo { position:absolute; left:1.5rem; top:2.2rem; font:700 2.7rem/1 'Unbounded',sans-serif; letter-spacing:-.07em; color:var(--demo-accent); }
.cp-home .cp-board-logo>span { position:absolute; top:-.3rem; right:-.6rem; font:700 1.1rem 'Onest',sans-serif; }
.cp-home .cp-board-banner>div { position:relative; z-index:1; }
.cp-home .cp-board-banner small { font-size:.48rem; letter-spacing:.09em; }
.cp-home .cp-board-banner strong { display:block; font:600 clamp(1.4rem,2.7vw,2.4rem)/1.2 'Unbounded',sans-serif; letter-spacing:-.065em; margin-top:1.2rem; }
.cp-home .cp-board-banner strong>span { color:var(--demo-accent); }
.cp-home .cp-board-ring { position:absolute; width:12rem; height:12rem; border:1.4rem solid var(--demo-secondary); border-radius:50%; right:-5rem; top:-4rem; transform:rotate(-25deg) scaleX(.65); opacity:.7; }
.cp-home .cp-board-tag { position:absolute; bottom:.65rem; right:.8rem; color:var(--demo-fg); opacity:.65; font-size:.55rem; }
.cp-home .cp-board-row { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin-block:.6rem; }
.cp-home .cp-board-chapter { position:relative; min-height:9rem; padding:1.2rem; border-radius:.3rem; color:var(--demo-bg); background:var(--demo-accent); transition:background-color 300ms; }
.cp-home .cp-board-chapter small,.cp-home .cp-board-data small { display:block; font-size:.5rem; letter-spacing:.08em; }
.cp-home .cp-board-chapter strong { display:block; margin-top:1rem; font:600 1rem/1.3 'Unbounded',sans-serif; letter-spacing:-.06em; }
.cp-home .cp-board-chapter>span { position:absolute; bottom:1rem; right:1rem; font-size:1.5rem; }
.cp-home .cp-board-data { padding:1.2rem; border-radius:.3rem; background:var(--demo-soft); color:var(--demo-bg); transition:background-color 300ms; }
.cp-home .cp-board-data .cp-chart { height:5.6rem; }
.cp-home .cp-board-data .cp-chart>i { width:15%; background:var(--demo-secondary); }
.cp-home .cp-board-data .cp-chart>i:last-child { background:var(--demo-accent); }
.cp-home .cp-board-lower { display:flex; align-items:center; gap:.9rem; background:var(--demo-bg); color:var(--demo-fg); padding:.9rem 1.2rem; border-radius:.3rem; transition:background-color 300ms; }
.cp-home .cp-board-lower>span { color:var(--demo-accent); font:700 1.2rem 'Unbounded',sans-serif; letter-spacing:-.07em; }
.cp-home .cp-board-lower strong { display:block; font-size:.85rem; font-weight:550; }
.cp-home .cp-board-lower small { display:block; font-size:.6rem; opacity:.65; }
.cp-home .cp-board-lower>i { margin-left:auto; font-style:normal; opacity:.6; font-size:.5rem; }
.cp-home .cp-board-footer { padding:.65rem 0 0; }
.cp-home .cp-board-footer>div { display:flex; width:100%; height:2rem; }
.cp-home .cp-board-footer i { flex:1; height:100%; background:var(--demo-bg); }
.cp-home .cp-board-footer i:nth-child(2) { background:var(--demo-secondary); }
.cp-home .cp-board-footer i:nth-child(3) { background:var(--demo-accent); }
.cp-home .cp-board-footer i:nth-child(4) { background:var(--demo-soft); }
.cp-home .cp-ai { background:#edf0f7; }
.cp-home .cp-ai-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:12%; }
.cp-home .cp-ai h2 { margin-bottom:1.7rem; }
.cp-home .cp-ai-copy>p:not(.cp-kicker) { color:var(--home-muted); font-size:.95rem; max-width:25rem; }
.cp-home .cp-ai-copy .cp-button { margin-top:.8rem; }
.cp-home .cp-ai-copy .cp-text-link { display:flex; width:fit-content; margin-top:.8rem; }
.cp-home .cp-ai-copy .cp-ai-note { font-size:.72rem; margin-top:1.5rem; }
.cp-home .cp-capabilities article { display:flex; gap:1.3rem; padding-block:1.45rem; border-top:1px solid #d5dbe7; }
.cp-home .cp-capabilities article>span { font-size:.65rem; color:var(--home-purple); padding-top:.15rem; }
.cp-home .cp-capabilities h3 { font-size:1.25rem; margin-bottom:.45rem; font-weight:600; }
.cp-home .cp-capabilities article p { color:var(--home-muted); font-size:.87rem; margin:0; max-width:27rem; }
.cp-home .cp-real-styles { margin-top:.8rem; }
.cp-home .cp-real-styles>span { display:block; color:var(--home-muted); font-size:.65rem; margin-bottom:.8rem; }
.cp-home .cp-real-styles>div { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; }
.cp-home .cp-real-styles img { width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:.4rem; }
.cp-home .cp-steps { list-style:none; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:3.5rem; counter-reset:none; margin:0; }
.cp-home .cp-steps>li { border-top:2px solid #c8d3e7; padding-top:1.5rem; }
.cp-home .cp-steps>li>span { color:var(--home-purple); font-size:.63rem; font-weight:650; letter-spacing:.035em; }
.cp-home .cp-steps h3 { font-size:1.3rem; font-weight:650; margin-block:1.5rem .6rem; }
.cp-home .cp-steps p { color:var(--home-muted); font-size:.9rem; margin-bottom:0; }
.cp-home .cp-guides { border-block:1px solid var(--home-line); background:var(--portal-color-surface-secondary); }
.cp-home .cp-guide-list { display:grid; grid-template-columns:1fr 1fr; column-gap:3.5rem; }
.cp-home .cp-guide-list>a { display:flex; align-items:center; gap:1.1rem; min-height:6.5rem; padding-block:1.3rem; border-top:1px solid #d9dfeb; }
.cp-home .cp-guide-list>a>span { color:var(--home-muted); font-size:.6rem; }
.cp-home .cp-guide-list h3 { font-size:1rem; font-weight:600; margin:0 0 .2rem; }
.cp-home .cp-guide-list p { margin:0; font-size:.78rem; color:var(--home-muted); }
.cp-home .cp-guide-list b { margin-left:auto; font-size:1.3rem; font-weight:400; color:var(--home-blue); }
.cp-home .cp-guide-list>a:hover h3 { color:var(--home-blue); }
.cp-home .cp-faq { display:grid; grid-template-columns:.65fr 1fr; gap:12%; }
.cp-home .cp-faq-list details { border-top:1px solid var(--home-line); }
.cp-home .cp-faq-list details:last-child { border-bottom:1px solid var(--home-line); }
.cp-home .cp-faq-list summary { display:flex; gap:1.2rem; align-items:center; justify-content:space-between; min-height:4.3rem; padding-block:1rem; font-size:1rem; font-weight:550; cursor:pointer; list-style:none; }
.cp-home .cp-faq-list summary::-webkit-details-marker { display:none; }
.cp-home .cp-faq-list summary>span { color:var(--home-purple); font-size:1.4rem; transition:transform 180ms; }
.cp-home .cp-faq-list details[open] summary>span { transform:rotate(45deg); }
.cp-home .cp-faq-list details>p { color:var(--home-muted); font-size:.9rem; padding-right:2rem; margin:0 0 1.4rem; }
.cp-home .cp-final { position:relative; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:6%; padding:clamp(2rem,5vw,4.5rem); background:#e9e3f7; border-radius:.8rem; margin-bottom:5rem; }
.cp-home .cp-final h2 { font-size:clamp(2rem,3.7vw,3.4rem); }
.cp-home .cp-final p:not(.cp-kicker) { font-size:.9rem; color:#655c7a; margin-bottom:1.8rem; }
.cp-home .cp-final-art { font:750 clamp(1.4rem,3.25vw,3rem)/1.3 'Unbounded',sans-serif; letter-spacing:-.065em; transform:rotate(-7deg); color:#bcabd9; }
.cp-home .cp-final-art>span { display:block; }
.cp-home .cp-final-art>strong { display:flex; align-items:center; gap:1rem; color:#5122c5; font-size:1.7em; }
.cp-home .cp-final-art strong>span { font-size:.75em; color:#c78027; }
.cp-home .site-footer { padding:0 0 1.5rem; color:var(--home-ink); background:var(--home-paper); }
.cp-home .footer-main { padding-block:2rem; gap:2rem; border-top:1px solid var(--home-line); }
.cp-home .footer-main>p { color:var(--home-muted); font-size:.78rem; }
.cp-home .footer-bottom { border-top:1px solid var(--home-line); padding-top:1.4rem; gap:1rem; color:var(--home-muted); font-size:.65rem; }
.cp-home .footer-bottom>a { margin-left:auto; min-height:2.75rem; display:inline-flex; align-items:center; }
.cp-home [data-motion-surface] * { animation-play-state:paused!important; }
.cp-home [data-motion-surface][data-motion-active='true'] * { animation-play-state:running!important; }
@keyframes cp-turn { to { transform:rotate(360deg); } }
@keyframes cp-caption { 0%,65%,100% { opacity:1; transform:translateX(0); } 75%,85% { opacity:0; transform:translateX(-1.2rem); } }
@keyframes cp-chart { 0%,65%,100% { transform:scaleY(1); } 80%,85% { transform:scaleY(.12); } }
@media (min-width:1600px) { .cp-home .cp-stage { min-height:43rem; } }
@media (max-width:1100px) {
    .cp-home .site-nav { gap:1.1rem; font-size:.75rem; }
    .cp-home .brand { font-size:.82rem; }
    .cp-home .cp-tool { grid-column:span 6; }
    .cp-home .cp-tool-art { height:15rem; }
    .cp-home .cp-ai-grid { gap:7%; }
    .cp-home .cp-board-banner { padding-left:4.9rem; }
    .cp-home .cp-board-logo { left:1rem; }
}
@media (max-width:832px) {
    .cp-home .site-nav { top:4.7rem; color:var(--home-ink); background:var(--home-paper); border-color:var(--home-line); box-shadow:none; font-size:1rem; }
    .cp-home .site-nav .nav-cta { width:100%; }
    .cp-home .menu-toggle { min-width:2.75rem; min-height:2.75rem; }
    .cp-home .menu-toggle[aria-expanded="true"] { color:var(--home-ink); border-color:var(--home-line); }
    .cp-home .cp-hero { padding-top:5.5rem; }
    .cp-home .cp-stage { min-height:36.5rem; }
    .cp-home .cp-stage-copy { top:24%; inset-inline:5%; }
    .cp-home .cp-stage h1 { font-size:clamp(1.9rem,4.7vw,2.7rem); }
    .cp-home .cp-stage-bottom { bottom:3rem; }
    .cp-home .cp-stage-top { inset-inline:1.3rem; }
    .cp-home .cp-scene-caption p { max-width:10rem; }
    .cp-home .cp-intro { grid-template-columns:1fr; gap:.6rem; }
    .cp-home .cp-intro-copy>p { max-width:40rem; }
    .cp-home .cp-section-heading { gap:1.5rem; align-items:start; }
    .cp-home .cp-section-heading>p { font-size:.85rem; max-width:16rem; }
    .cp-home .cp-brand-board { max-width:42rem; width:100%; }
    .cp-home .cp-board-banner { min-height:16.5rem; padding-left:6rem; }
    .cp-home .cp-board-banner strong { font-size:2.3rem; }
    .cp-home .cp-board-logo { left:1.5rem; }
    .cp-home .cp-ai-grid { grid-template-columns:1fr 1fr; gap:5%; }
    .cp-home .cp-ai h2 { font-size:1.8rem; }
    .cp-home .cp-steps { gap:1.5rem; }
    .cp-home .cp-steps h3 { font-size:1.1rem; }
    .cp-home .cp-guide-list { column-gap:1.5rem; }
    .cp-home .cp-faq { grid-template-columns:1fr; gap:1.5rem; }
    .cp-home .cp-final { padding:2rem; }
    .cp-home .footer-main { flex-wrap:wrap; }
}
@media (max-width:600px) {
    .cp-home .shell { width:calc(100% - 2rem); }
    .cp-home .cp-hero { width:calc(100% - 1.25rem); }
    .cp-home .brand { font-size:.84rem; }
    .cp-home .cp-stage { min-height:35.7rem; border-radius:.7rem; }
    .cp-home .cp-stage-top { top:1.2rem; inset-inline:1.2rem; font-size:.65rem; }
    .cp-home .cp-stage-top>span:last-child { display:none; }
    .cp-home .cp-stage-copy { top:24%; inset-inline:.9rem; }
    .cp-home .cp-stage-kicker { font-size:.67rem; margin-bottom:1.25rem; }
    .cp-home .cp-stage h1 { font-size:clamp(1.5rem,6.4vw,2.35rem); line-height:1.24; letter-spacing:-.065em; }
    .cp-home .cp-stage-bottom { inset-inline:1.2rem; bottom:2.8rem; }
    .cp-home .cp-stage-bottom>p { font-size:.78rem; margin-bottom:1.2rem; }
    .cp-home .cp-stage-bottom br { display:none; }
    .cp-home .cp-actions { flex-direction:column; gap:.5rem; }
    .cp-home .cp-button { min-height:3.25rem; padding:.9rem 1rem; font-size:.82rem; }
    .cp-home .cp-stage .cp-button { width:100%; max-width:23rem; justify-content:center; gap:.8rem; }
    .cp-home .cp-stage-link { font-size:.78rem; }
    .cp-home .cp-stage-corner { bottom:1rem; right:1.2rem; font-size:.48rem; }
    .cp-home .cp-scene-bar { position:relative; flex-wrap:wrap; gap:.75rem; padding:1rem .3rem; }
    .cp-home .cp-scene-caption { flex:0 0 100%; }
    .cp-home .cp-scene-caption p { max-width:none; }
    .cp-home .cp-scene-controls { flex:1; min-width:0; }
    .cp-home .cp-scene-button { padding:.5rem .6rem; gap:.4rem; font-size:.72rem; flex:1; }
    .cp-home .cp-scene-button>span { font-size:.95rem; }
    .cp-home .cp-pause { position:absolute; top:.95rem; right:.3rem; width:2.75rem; }
    .cp-home .cp-hero-note { padding-inline:.3rem; font-size:.66rem; }
    .cp-home h2 { font-size:1.65rem; }
    .cp-home .cp-kicker { font-size:.7rem; margin-bottom:1rem; }
    .cp-home .cp-section-heading { flex-direction:column; gap:1.1rem; margin-bottom:2rem; }
    .cp-home .cp-section-heading>p { max-width:none; }
    .cp-home .cp-intro-copy>p { font-size:.9rem; }
    .cp-home .cp-tool-grid { grid-template-columns:1fr; gap:1.8rem; }
    .cp-home .cp-tool,.cp-home .cp-tool-background,.cp-home .cp-tool-type { grid-column:auto; }
    .cp-home .cp-tool-art,.cp-home .cp-tool-background .cp-tool-art,.cp-home .cp-tool-type .cp-tool-art { height:14.5rem; }
    .cp-home .cp-art-type { inset:28% 7% auto; }
    .cp-home .cp-art-type>span { font-size:1.75rem; }
    .cp-home .cp-art-type strong { font-size:2.25rem; }
    .cp-home .cp-art-background-copy strong { font-size:2rem; }
    .cp-home .cp-art-chapter>span { font-size:3.5rem; }
    .cp-home .cp-art-chapter strong { font-size:1.4rem; }
    .cp-home .cp-art-chapter small { font-size:.6rem; }
    .cp-home .cp-lower-caption { bottom:2.7rem; inset-inline:1.3rem; padding:1rem; }
    .cp-home .cp-lower-caption strong { font-size:.95rem; }
    .cp-home .cp-lower-caption small { font-size:.6rem; }
    .cp-home .cp-art-data { inset:29% 10% 10%; }
    .cp-home .cp-art-data>small { font-size:.55rem; }
    .cp-home .cp-art-data .cp-chart { height:7rem; }
    .cp-home .cp-art-subscribe { inset:30% 1.5rem 10%; }
    .cp-home .cp-subscribe-button { font-size:1.15rem; padding:1rem 1.5rem; }
    .cp-home .cp-tool-info h3 { font-size:1.15rem; }
    .cp-home .cp-tools-foot { align-items:start; flex-direction:column; gap:.4rem; margin-top:2rem; }
    .cp-home .cp-brand-board { padding:.65rem; }
    .cp-home .cp-board-banner { min-height:13rem; padding:1.5rem 1rem 1.5rem 4.2rem; }
    .cp-home .cp-board-logo { left:1rem; top:1.5rem; font-size:2rem; }
    .cp-home .cp-board-banner strong { font-size:1.65rem; margin-top:1rem; }
    .cp-home .cp-board-banner small { font-size:.4rem; letter-spacing:.04em; }
    .cp-home .cp-board-ring { width:9rem; height:9rem; border-width:1rem; }
    .cp-home .cp-board-chapter,.cp-home .cp-board-data { padding:.9rem; min-height:8rem; }
    .cp-home .cp-board-chapter strong { font-size:.77rem; }
    .cp-home .cp-board-chapter small,.cp-home .cp-board-data small { font-size:.42rem; }
    .cp-home .cp-board-chapter>span { bottom:.6rem; right:.6rem; }
    .cp-home .cp-board-data .cp-chart { height:5rem; }
    .cp-home .cp-board-lower { gap:.75rem; padding:.8rem; }
    .cp-home .cp-board-lower strong { font-size:.72rem; }
    .cp-home .cp-board-lower small { font-size:.5rem; }
    .cp-home .cp-board-lower>i { display:none; }
    .cp-home .cp-ai-grid { grid-template-columns:1fr; gap:2.5rem; }
    .cp-home .cp-ai h2 { font-size:2rem; }
    .cp-home .cp-ai-copy>p:not(.cp-kicker) { max-width:none; font-size:.9rem; }
    .cp-home .cp-ai-copy .cp-ai-note { font-size:.72rem; }
    .cp-home .cp-capabilities article { gap:1rem; }
    .cp-home .cp-capabilities h3 { font-size:1.15rem; }
    .cp-home .cp-steps { grid-template-columns:1fr; gap:2rem; }
    .cp-home .cp-steps h3 { margin-top:1rem; font-size:1.25rem; }
    .cp-home .cp-guide-list { grid-template-columns:1fr; }
    .cp-home .cp-guide-list>a { min-height:6rem; padding-block:1.2rem; }
    .cp-home .cp-faq-list summary { font-size:.9rem; }
    .cp-home .cp-faq-list details>p { font-size:.85rem; padding-right:.5rem; }
    .cp-home .cp-final { grid-template-columns:1fr; padding:2rem 1.5rem; gap:3rem; margin-bottom:3rem; }
    .cp-home .cp-final h2 { font-size:2.15rem; }
    .cp-home .cp-final-art { font-size:1.6rem; padding:.5rem; }
    .cp-home .cp-final-art>strong { font-size:1.7em; }
    .cp-home .footer-main { align-items:start; flex-direction:column; gap:1.2rem; }
    .cp-home .footer-main>p { margin:0; }
    .cp-home .footer-bottom { align-items:start; flex-wrap:wrap; gap:.5rem 1rem; }
    .cp-home .footer-bottom>span:nth-child(2) { flex-basis:100%; order:3; }
}
@media (prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    .cp-home *,.cp-home *::before,.cp-home *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
    .cp-home .cp-lower-caption { opacity:1; transform:none; }
    .cp-home .cp-chart>i { transform:none; }
}
.cp-home:not([data-homepage-ready]) :is(.cp-scene-controls,.cp-pause) { display:none; }
.cp-home .cp-art-type strong { animation:cp-text 10s var(--home-ease) infinite; }
@keyframes cp-text { 0%,60%,100% { opacity:1; transform:translateY(0); } 72% { opacity:0; transform:translateY(-.75rem); } 73%,80% { opacity:0; transform:translateY(.75rem); } }

/* Главная показывает реальные каталожные шаблоны с лёгкими превью. */
.cp-home .cp-stage .cp-pause { position:absolute; left:1.3rem; bottom:1rem; top:auto; right:auto; width:2.8rem; color:#f7f8fc; border-color:#ffffff38; background:#14213b80; }
.cp-home .cp-stage .cp-pause:hover { background:#14213b; }
.cp-home .cp-tool-lower,.cp-home .cp-tool-data,.cp-home .cp-tool-subscribe { grid-column:span 4; }
.cp-home .cp-tool-palette { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); align-items:center; gap:1.25rem; }
.cp-home .cp-tool-palette .cp-tool-info { padding:0; }
.cp-home .cp-tool-palette .cp-tool-art { height:clamp(9rem,17vw,10rem); background:#eee7f7; color:#5122c5; }
.cp-home .cp-recolor-preview { position:absolute; inset:2.5rem 1.1rem 2rem; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:.6rem; }
.cp-home .cp-recolor-preview svg { display:block; width:100%; height:100%; min-height:0; object-fit:contain; }
.cp-home .cp-recolor-preview>span { text-align:center; font-size:1rem; }
.cp-home .cp-template-label { position:absolute; bottom:1rem; left:1.1rem; font-size:.6rem; opacity:.8; z-index:2; }
.cp-home .cp-camera-text { position:absolute; inset:12% 0 7%; }
.cp-home .cp-camera-text>span { display:block; padding:3rem; font:700 2rem Unbounded,sans-serif; }
.cp-home .cp-camera-text svg { width:100%; height:100%; }
.cp-home .cp-camera-text svg text { font-family:Unbounded,sans-serif; }
.cp-home .cp-tool-lower .cp-tool-art { background:#e5eaf5; color:#171a2b; }
.cp-home .cp-template-strip { position:absolute; top:50%; left:5%; width:90%; height:auto; transform:translateY(-50%); animation:cp-native-strip 7s var(--home-ease) infinite; }
@keyframes cp-native-strip { 0%,8% { opacity:0; transform:translate(-18%, -50%); } 20%,80% { opacity:1; transform:translate(0, -50%); } 94%,100% { opacity:0; transform:translate(12%, -50%); } }
.cp-home .cp-tool-subscribe .cp-tool-art { background:#e5def5; color:#5122c5; }
.cp-home .cp-subscribe-preview { position:absolute; inset-inline:7%; top:44%; transform:translateY(-50%); }
.cp-home .cp-subscribe-preview>img { display:block; width:100%; height:auto; }
.cp-home .cp-subscribe-preview .cp-subscribe-done { position:absolute; inset:0; opacity:0; animation:cp-subscribe-state 7s steps(1,end) infinite; }
.cp-home .cp-subscribe-cursor { position:absolute; width:1.8rem; height:2.2rem; top:54%; left:72%; filter:drop-shadow(0 2px 2px #171a2b30); opacity:0; animation:cp-subscribe-click 7s var(--home-ease) infinite; }
@keyframes cp-subscribe-state { 0%,46% { opacity:0; } 47%,84% { opacity:1; } 85%,100% { opacity:0; } }
@keyframes cp-subscribe-click { 0%,12% { opacity:0; transform:translate(3rem,2rem); } 29%,43% { opacity:1; transform:translate(0,0); } 46% { opacity:1; transform:scale(.8); } 50%,60% { opacity:1; transform:scale(1); } 73%,100% { opacity:0; transform:translate(1rem,1rem); } }
.cp-home .cp-board-banner { padding:0; min-height:0; aspect-ratio:16/9; }
.cp-home .cp-board-banner>img { display:block; width:100%; height:100%; object-fit:cover; }
.cp-home .cp-board-tag { padding:.3rem .5rem; background:#171a2bb3; color:#f7f8fc; border-radius:.25rem; }
.cp-home .cp-board-lower { position:relative; display:block; padding:.6rem .6rem 1.4rem; background:var(--demo-soft); }
.cp-home .cp-board-lower>img { display:block; width:100%; height:auto; }
.cp-home .cp-board-lower>span { position:absolute; bottom:.35rem; right:.65rem; font:400 .5rem Onest,sans-serif; color:var(--demo-bg); letter-spacing:0; }
@media(max-width:600px) {
    .cp-home .cp-tool-lower,.cp-home .cp-tool-data,.cp-home .cp-tool-subscribe { grid-column:auto; }
    .cp-home .cp-tool-palette { grid-column:auto; grid-template-columns:1fr; gap:1.1rem; order:6; }
    .cp-home .cp-tool-palette .cp-tool-info { padding:0 .2rem; }
    .cp-home .cp-tool-palette .cp-tool-art { height:8rem; }
    .cp-home .cp-recolor-preview { inset:2.3rem .9rem 1.8rem; gap:.4rem; }
}
@media(prefers-reduced-motion:reduce) { .cp-home .cp-template-strip { opacity:1; transform:translateY(-50%); } .cp-home .cp-subscribe-cursor,.cp-home .cp-subscribe-done { opacity:0; } }
.cp-home .cp-tool-background .cp-tool-art { background:#25213e url('/static/landing/images/homepage-marquee.webp') center/cover; }
.cp-home .cp-board-lower>img { height:6.2rem; object-fit:contain; }
.cp-home:not([data-homepage-ready]) .cp-template-strip { animation:none; opacity:1; transform:translateY(-50%); }
@media(max-width:600px) { .cp-home .cp-board-lower>img { height:5.3rem; } }

@font-face { font-family:HomePreviewInter; src:url('/fonts/inter-variable.ttf') format('truetype'); font-weight:100 900; font-style:normal; font-display:swap; }
.cp-home .cp-board-lower { background:#101721; padding:.75rem .65rem 1.65rem; }
.cp-home .cp-board-lower>span { color:#dce4f3; }
.cp-home .cp-native-preview { position:relative; height:6.2rem; overflow:hidden; }
.cp-home .cp-native-scene { position:absolute; top:0; left:0; transform-origin:0 0; }
.cp-home .cp-native-scene[hidden] { display:none!important; }
.cp-home:not([data-homepage-ready]) .cp-native-scene { transform:scale(.3); top:.75rem; }
@media(max-width:600px) {
    .cp-home .cp-native-preview { height:5.3rem; }
    .cp-home:not([data-homepage-ready]) .cp-native-scene { transform:scale(.2); }
}

/* Проект: реальная последовательность работы с чередованием текста и примеров. */
.cp-home .cp-stage .cp-pause { display:grid; place-items:center; width:44px; height:44px; min-width:44px; min-height:44px; padding:10px; border:0; border-radius:0; background:transparent; }
.cp-home .cp-stage .cp-pause svg { display:block; width:24px; height:24px; }
.cp-home .cp-stage .cp-pause:hover:not(:disabled) { background:#2586eb; }
.cp-home .cp-stage .cp-pause:focus-visible { outline:2px solid #ff9418; outline-offset:-3px; }
.cp-home .cp-board-lower { padding:.75rem .65rem; }
.cp-home .cp-project-section { background:#edf0f7; }
.cp-home .cp-project-heading { display:grid; grid-template-columns:1.1fr 1fr; gap:8%; align-items:end; margin-bottom:5rem; }
.cp-home .cp-project-heading h2 { font-size:clamp(2rem,3.5vw,3.25rem); margin:0; }
.cp-home .cp-project-heading>div>p:not(.cp-kicker) { color:var(--home-muted); font-size:1rem; max-width:30rem; margin-bottom:1.8rem; }
.cp-home .cp-project-journey { list-style:none; margin:0; padding:0; display:grid; gap:5rem; }
.cp-home .cp-project-journey>li { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:8%; min-width:0; }
.cp-home .cp-project-journey>li:nth-child(even) .cp-journey-copy { grid-column:2; grid-row:1; }
.cp-home .cp-project-journey>li:nth-child(even) .cp-journey-art { grid-column:1; grid-row:1; }
.cp-home .cp-journey-copy { min-width:0; padding:.5rem 0; }
.cp-home .cp-journey-number { display:flex; align-items:center; gap:1rem; color:var(--home-purple); font:600 1.7rem Unbounded,sans-serif; margin-bottom:1.5rem; }
.cp-home .cp-journey-number>span { padding-left:1rem; border-left:1px solid #c9bddf; font:500 .7rem Onest,sans-serif; text-transform:uppercase; letter-spacing:.07em; }
.cp-home .cp-journey-copy h3 { font:600 clamp(1.3rem,2.5vw,2.2rem)/1.3 Unbounded,sans-serif; letter-spacing:-.055em; margin:0 0 1.4rem; }
.cp-home .cp-journey-copy>p:not(.cp-journey-number) { font-size:.93rem; line-height:1.65; color:var(--home-muted); max-width:30rem; }
.cp-home .cp-journey-copy .cp-journey-result { padding:1rem 0 0 1rem; border-left:2px solid var(--home-purple); color:var(--home-ink)!important; font-size:.8rem!important; }
.cp-home .cp-journey-art { position:relative; min-width:0; height:22rem; padding:1.7rem 1.7rem 3.2rem; border-radius:.85rem; overflow:hidden; }
.cp-home .cp-journey-caption { position:absolute; bottom:1rem; left:1.7rem; right:1.7rem; font-size:.62rem; opacity:.75; }
.cp-home .cp-demo-eyebrow { font-size:.5rem; letter-spacing:.1em; }
.cp-home .cp-journey-brief { background:#e2d9f4; color:#372161; }
.cp-home .cp-brief-sheet { background:#fdfcff; padding:1.5rem; box-shadow:0 .75rem 1.5rem #3721610d; transform:rotate(-2deg); }
.cp-home .cp-brief-sheet>strong { display:block; font:600 clamp(.95rem,1.6vw,1.4rem)/1.3 Unbounded,sans-serif; letter-spacing:-.06em; margin:1rem 0 1.2rem; }
.cp-home .cp-brief-sheet>strong>span { color:#fe8502; }
.cp-home .cp-brief-field { padding:.55rem 0; border-top:1px solid #e6e0f0; }
.cp-home .cp-brief-field>small { display:block; font-size:.52rem; color:#777087; }
.cp-home .cp-brief-field>span { font-size:.66rem; }
.cp-home .cp-brief-chips { display:flex; gap:.35rem; flex-wrap:wrap; margin-top:.6rem; }
.cp-home .cp-brief-chips>span { padding:.3rem .45rem; font-size:.48rem; background:#f1ecff; border-radius:.2rem; }
.cp-home .cp-journey-directions { background:#dce6f3; color:#182b43; }
.cp-home .cp-direction-sample { position:absolute; width:47%; height:14.5rem; padding:1rem; box-shadow:0 .7rem 1.5rem #182b4312; }
.cp-home .cp-direction-sample>small { font-size:.45rem; letter-spacing:.04em; }
.cp-home .cp-direction-sample>strong { display:block; font:650 clamp(1rem,1.6vw,1.5rem)/1.2 Unbounded,sans-serif; letter-spacing:-.07em; margin-top:2.5rem; }
.cp-home .cp-direction-sample>span { position:absolute; bottom:1rem; left:1rem; font-size:.6rem; letter-spacing:.2rem; }
.cp-home .cp-direction-first { left:5%; top:14%; background:#f1d7af; transform:rotate(-9deg); }
.cp-home .cp-direction-second { left:28%; top:8%; background:#5122c5; color:#f7f8fc; transform:rotate(5deg); z-index:1; }
.cp-home .cp-direction-second strong>span { display:block; color:#ffad42; font-size:2rem; }
.cp-home .cp-direction-third { right:-6%; top:19%; background:#f7f8fc; transform:rotate(13deg); }
.cp-home .cp-journey-style { background:#182b43; color:#eef3fb; }
.cp-home .cp-style-sheet { height:100%; border:1px solid #eef3fb38; padding:1.3rem; }
.cp-home .cp-style-sheet-top,.cp-home .cp-style-sheet-bottom { display:flex; justify-content:space-between; gap:.5rem; font-size:.47rem; letter-spacing:.06em; }
.cp-home .cp-style-sheet>strong { display:flex; justify-content:space-between; align-items:center; font:600 clamp(3rem,6vw,5rem)/1.2 Unbounded,sans-serif; letter-spacing:-.07em; margin-top:1rem; }
.cp-home .cp-style-sheet>strong>span { font-size:2.3rem; color:#ffad42; }
.cp-home .cp-style-sheet>p { font-size:.7rem; margin:.25rem 0 1rem; }
.cp-home .cp-style-colors { display:flex; height:2.2rem; margin-bottom:.8rem; }
.cp-home .cp-style-colors>i { flex:1; background:#4586da; }
.cp-home .cp-style-colors>i:nth-child(2) { background:#ffad42; }
.cp-home .cp-style-colors>i:nth-child(3) { background:#eef3fb; }
.cp-home .cp-style-colors>i:nth-child(4) { background:#304763; }
.cp-home .cp-journey-logo { background:#f1dfc6; color:#472d27; }
.cp-home .cp-logo-main { height:75%; display:flex; flex-direction:column; align-items:center; justify-content:center; background:#fff6e9; }
.cp-home .cp-logo-main>span { font:750 6rem/1 Unbounded,sans-serif; letter-spacing:-.1em; }
.cp-home .cp-logo-main sup { color:#bc6244; font-size:2.8rem; vertical-align:top; }
.cp-home .cp-logo-main>small { font-size:.5rem; letter-spacing:.15em; margin-top:1rem; }
.cp-home .cp-logo-versions { display:flex; gap:.7rem; margin-top:.7rem; height:25%; }
.cp-home .cp-logo-versions>span { flex:1; display:grid; place-items:center; background:#472d27; color:#fff0dc; font:700 1.7rem Unbounded,sans-serif; letter-spacing:-.1em; }
.cp-home .cp-logo-versions>span:nth-child(2) { background:#bc6244; }
.cp-home .cp-logo-versions>span:nth-child(3) { background:#fff6e9; color:#472d27; }
.cp-home .cp-journey-assets { background:#dce8e1; color:#193b32; }
.cp-home .cp-assets-banner { position:relative; height:54%; padding:1rem 1.1rem 1rem 3.8rem; background:#193b32; color:#f1efdf; overflow:hidden; }
.cp-home .cp-assets-banner>span { position:absolute; top:1.1rem; left:1rem; color:#c9d79d; font:700 1.5rem Unbounded,sans-serif; letter-spacing:-.1em; }
.cp-home .cp-assets-banner>strong { font:600 clamp(1.1rem,1.7vw,1.6rem)/1.2 Unbounded,sans-serif; letter-spacing:-.06em; }
.cp-home .cp-assets-banner strong>span { color:#c9d79d; }
.cp-home .cp-assets-banner>small { display:block; margin-top:.6rem; font-size:.4rem; letter-spacing:.1em; }
.cp-home .cp-assets-bottom { display:grid; grid-template-columns:1.2fr 1fr; gap:.7rem; height:43%; margin-top:.7rem; }
.cp-home .cp-assets-cover { background:#c9d79d; padding:.85rem; }
.cp-home .cp-assets-cover>span { font-size:.45rem; }
.cp-home .cp-assets-cover>strong { display:block; font:600 clamp(.9rem,1.2vw,1.1rem)/1.3 Unbounded,sans-serif; letter-spacing:-.05em; margin-top:.5rem; }
.cp-home .cp-assets-sticker { display:grid; place-items:center; background:#f1efdf; }
.cp-home .cp-assets-sticker>span { font:750 clamp(.9rem,1.4vw,1.3rem)/1.1 Unbounded,sans-serif; letter-spacing:-.07em; transform:rotate(-8deg); background:#193b32; color:#c9d79d; padding:.65rem; }
.cp-home .cp-assets-sticker>span>span { color:#f1efdf; }
.cp-home .cp-journey-motion { background:#20263c; color:#f7f8fc; }
.cp-home .cp-motion-screen { position:relative; background:#5122c5; height:62%; padding:1rem 1.25rem; }
.cp-home .cp-motion-screen>small { font-size:.5rem; }
.cp-home .cp-motion-screen>strong { display:block; font:650 clamp(1.1rem,2vw,1.9rem)/1.2 Unbounded,sans-serif; letter-spacing:-.06em; margin-top:.8rem; }
.cp-home .cp-motion-screen strong>span { color:#ffad42; }
.cp-home .cp-motion-play { position:absolute; right:1.2rem; top:50%; color:#f7f8fc; font-size:1.2rem; }
.cp-home .cp-motion-timeline { position:relative; padding-top:.8rem; }
.cp-home .cp-motion-ruler { display:flex; justify-content:space-between; color:#a8b0c4; font-size:.42rem; margin-bottom:.45rem; }
.cp-home .cp-motion-track { display:flex; gap:.3rem; margin-bottom:.3rem; padding-right:15%; }
.cp-home .cp-motion-track>span { flex:1; padding:.45rem .55rem; font-size:.52rem; background:#4586da; }
.cp-home .cp-motion-track>span:nth-child(2) { flex:1.5; background:#7250e5; }
.cp-home .cp-motion-track-second { padding-left:15%; padding-right:0; }
.cp-home .cp-motion-track-second>span { background:#568b6d; }
.cp-home .cp-motion-track-second>span:nth-child(2) { background:#bc6244; }
.cp-home .cp-motion-timeline>i { position:absolute; top:.6rem; bottom:0; left:43%; width:1px; background:#ffad42; }
.cp-home .cp-project-end { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding-top:3rem; margin-top:5rem; border-top:1px solid #d5dbe7; }
.cp-home .cp-project-end h3 { font:600 clamp(1.3rem,2.2vw,2rem)/1.3 Unbounded,sans-serif; letter-spacing:-.05em; margin:0 0 1rem; }
.cp-home .cp-project-end p:not(.cp-kicker) { color:var(--home-muted); font-size:.75rem; }
.cp-home .cp-project-end-actions { display:grid; gap:1.3rem; justify-items:start; flex-shrink:0; }
@media(max-width:1100px) { .cp-home .cp-project-journey>li { gap:5%; } .cp-home .cp-journey-art { padding:1.3rem 1.3rem 3.2rem; height:21rem; } .cp-home .cp-journey-caption { left:1.3rem; right:1.3rem; } }
@media(max-width:700px) {
    .cp-home .cp-project-heading { grid-template-columns:1fr; gap:1.5rem; margin-bottom:3.5rem; }
    .cp-home .cp-project-heading h2 { font-size:clamp(1.8rem,6vw,2.5rem); }
    .cp-home .cp-project-heading>div>p:not(.cp-kicker) { font-size:.9rem; }
    .cp-home .cp-project-journey { gap:3.5rem; }
    .cp-home .cp-project-journey>li { grid-template-columns:1fr; gap:1.5rem; }
    .cp-home .cp-project-journey>li:nth-child(even) .cp-journey-copy,.cp-home .cp-project-journey>li:nth-child(even) .cp-journey-art { grid-column:auto; grid-row:auto; }
    .cp-home .cp-journey-copy h3 { font-size:1.7rem; }
    .cp-home .cp-journey-copy>p:not(.cp-journey-number) { font-size:.88rem; }
    .cp-home .cp-journey-number { margin-bottom:1.1rem; }
    .cp-home .cp-journey-art { height:22rem; }
    .cp-home .cp-brief-sheet>strong { font-size:1.3rem; }
    .cp-home .cp-direction-sample>strong { font-size:1.3rem; }
    .cp-home .cp-assets-banner>strong { font-size:1.5rem; }
    .cp-home .cp-motion-screen>strong { font-size:1.7rem; }
    .cp-home .cp-assets-cover>strong { font-size:1.1rem; }
    .cp-home .cp-assets-sticker>span { font-size:1.2rem; }
    .cp-home .cp-project-end { flex-direction:column; align-items:start; margin-top:3.5rem; padding-top:2rem; }
}
.cp-home:not([data-homepage-ready]) .cp-stage .cp-pause { display:none; }


.cp-home .cp-style-thread { display:flex; align-items:center; justify-content:space-between; gap:2rem; margin:-1.5rem 0 4.5rem; padding:1.7rem 2rem; border-left:3px solid var(--home-purple); background:#fdfdff; }
.cp-home .cp-style-thread .cp-kicker { margin-bottom:.75rem; font-size:.65rem; }
.cp-home .cp-style-thread strong { display:block; font:600 clamp(1rem,1.8vw,1.5rem)/1.4 Unbounded,sans-serif; letter-spacing:-.045em; }
.cp-home .cp-style-thread p:not(.cp-kicker) { margin:.8rem 0 0; max-width:45rem; font-size:.83rem; color:var(--home-muted); }
.cp-home .cp-style-thread-sample { flex:0 0 10rem; }
.cp-home .cp-style-thread-sample>div { display:flex; height:1.6rem; }
.cp-home .cp-style-thread-sample i { flex:1; background:#182b43; }
.cp-home .cp-style-thread-sample i:nth-child(2) { background:#4586da; }
.cp-home .cp-style-thread-sample i:nth-child(3) { background:#ffad42; }
.cp-home .cp-style-thread-sample i:nth-child(4) { background:#e3ebf6; }
.cp-home .cp-style-thread-sample>span { display:flex; align-items:center; justify-content:space-between; gap:.7rem; margin-top:.65rem; font:600 2.2rem Unbounded,sans-serif; letter-spacing:-.07em; }
.cp-home .cp-style-thread-sample small { font:400 .6rem Onest,sans-serif; letter-spacing:0; color:var(--home-muted); }
@media(max-width:700px) { .cp-home .cp-style-thread { flex-direction:column; align-items:start; padding:1.2rem; gap:1.2rem; margin:-.5rem 0 3.5rem; } .cp-home .cp-style-thread-sample { flex-basis:auto; width:10rem; } .cp-home .cp-style-thread strong { font-size:1.05rem; } }
.cp-home .cp-board-background-copy { position:absolute; inset:0; display:grid; place-content:center; padding:1rem; text-align:center; color:var(--demo-fg); font:650 clamp(1.1rem,2.3vw,2rem)/1.25 Unbounded,sans-serif; letter-spacing:-.055em; text-shadow:0 2px 16px #10172155; pointer-events:none; }

/* Компактная шапка и основная идея стиля сразу после знакомства с порталом. */
.cp-home .site-header { height:4.7rem; padding-block:0; transition:height 200ms var(--home-ease),border-color 180ms; }
.cp-home .site-header .header-inner { height:100%; }
.cp-home .site-header.is-scrolled { height:3.29rem; padding-block:0; }
.cp-home .site-header.is-scrolled .nav-cta { min-height:44px; height:44px; padding:.55rem 1rem; }
.cp-home .cp-hero { padding-top:5.2rem; }
.cp-home .cp-intro .cp-style-thread { grid-column:1/-1; margin:1.8rem 0 0; padding:2.1rem; border:0; border-radius:.8rem; background:#f1ecff; gap:2.5rem; }
.cp-home .cp-intro .cp-style-thread strong { font-size:clamp(1.2rem,2.2vw,1.85rem); }
.cp-home .cp-intro .cp-style-thread p:not(.cp-kicker) { font-size:.9rem; max-width:40rem; }
.cp-home .cp-intro .cp-style-thread-sample { flex-basis:18rem; padding:1.1rem; background:#fdfdff; border-radius:.5rem; box-shadow:0 .75rem 2rem #5122c509; }
.cp-home .cp-style-thread-formats { display:grid; grid-template-columns:1fr 1fr 1fr; gap:.45rem; margin-top:.9rem; }
.cp-home .cp-style-thread-formats>span { display:flex; flex-direction:column; justify-content:space-between; gap:.8rem; min-width:0; padding:.6rem .5rem; background:#182b43; color:#eef3fb; }
.cp-home .cp-style-thread-formats b { font:650 .68rem/1.3 Unbounded,sans-serif; letter-spacing:-.04em; }
.cp-home .cp-style-thread-formats>span:first-child b { color:#ffad42; font-size:1rem; }
.cp-home .cp-style-thread-formats>span:nth-child(2) { background:#4586da; }
.cp-home .cp-style-thread-formats>span:nth-child(3) b>span { color:#ffad42; }
.cp-home .cp-style-thread-formats small { font-size:.5rem; color:inherit; opacity:.8; }
@media(max-width:832px) { .cp-home .site-nav { top:4.7rem; } .cp-home .site-header.is-scrolled .site-nav { top:3.29rem; } .cp-home .cp-intro .cp-style-thread { gap:1.5rem; padding:1.5rem; } .cp-home .cp-intro .cp-style-thread-sample { flex-basis:15rem; } }
@media(max-width:700px) { .cp-home .cp-intro .cp-style-thread { margin-top:1.5rem; padding:1.3rem; gap:1.3rem; } .cp-home .cp-intro .cp-style-thread-sample { flex-basis:auto; width:100%; max-width:22rem; } .cp-home .cp-intro .cp-style-thread strong { font-size:1.15rem; } }
.cp-home .cp-style-thread-sample>.cp-style-thread-formats { display:grid; height:auto; }

/* Более компактная шапка и первый экран ближе к ней. */
.cp-home .site-header { height:4rem; }
.cp-home .site-header.is-scrolled { height:2.9rem; }
.cp-home .cp-hero { padding-top:4.25rem; }
@media(max-width:832px) { .cp-home .site-nav { top:4rem; } .cp-home .site-header.is-scrolled .site-nav { top:2.9rem; } }
/* Доступность отделена от количества оформлений общей строкой плашек. */
.cp-home .cp-tool-meta { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin:.15rem 0 .6rem; }
.cp-home .cp-tool-count,.cp-home .cp-tool-free,.cp-home .cp-tool-project-badge { display:inline-flex; padding:.22rem .6rem; border:1px solid transparent; border-radius:2rem; font-size:.72rem; font-weight:600; }
.cp-home .cp-tool-count { background:#e8e1fa; color:var(--home-purple); }
.cp-home .cp-tool-free { border-color:currentColor; background:#ebf4ff; color:#095dbb; }
.cp-home .cp-tool-project-badge { border-color:currentColor; background:#f1ecff; color:var(--home-purple); }

/* HTML-превью и асимметричная сетка инструментов. */
.cp-home .cp-tool-lower { grid-column:1 / span 4; grid-row:2; }
.cp-home .cp-tool-subscribe { grid-column:1 / span 4; grid-row:3; }
.cp-home .cp-tool-data { grid-column:5 / span 8; grid-row:2 / span 2; display:flex; flex-direction:column; }
.cp-home .cp-tool-lower .cp-tool-art,.cp-home .cp-tool-subscribe .cp-tool-art { height:8.5rem; }
.cp-home .cp-tool-data .cp-tool-art { flex:1; min-height:25rem; background:#dceaf5; color:#182b43; }
.cp-home .cp-color-strip { position:absolute; left:7%; right:7%; top:45%; display:flex; align-items:stretch; transform:translateY(-50%); box-shadow:0 3px 5px #182b4320; font-family:HomePreviewInter,sans-serif; animation:cp-native-strip 7s var(--home-ease) infinite; }
.cp-home .cp-color-icon { flex:0 0 17%; background:#ff9200; color:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:.35rem; }
.cp-home .cp-color-icon svg { width:1.4rem; height:1.4rem; fill:none; stroke:currentColor; stroke-width:2.3; stroke-linecap:round; }
.cp-home .cp-color-icon small { font-size:.36rem; font-weight:600; }
.cp-home .cp-color-name { flex:1; min-width:0; background:#0876e6; color:#fff; padding:.4rem .45rem; text-align:left; }
.cp-home .cp-color-name strong { display:block; font-size:clamp(.62rem,1.5vw,1.15rem); line-height:1.1; font-weight:900; white-space:nowrap; letter-spacing:-.035em; }
.cp-home .cp-color-name small { display:block; font-size:clamp(.28rem,.48vw,.4rem); margin-top:.13rem; }
.cp-home .cp-subscribe-preview { top:45%; }
.cp-home .cp-outline-card { display:flex; align-items:center; justify-content:space-between; gap:.4rem; padding:.6rem; border:1px solid #8056ed; border-radius:.25rem; background:#f7f8fc; color:#171a2b; text-align:left; font-family:HomePreviewInter,sans-serif; }
.cp-home .cp-outline-copy { flex:1; min-width:0; }
.cp-home .cp-outline-copy strong { display:block; font-size:.78rem; letter-spacing:-.04em; font-weight:800; }
.cp-home .cp-outline-copy i { display:block; width:1.1rem; height:1px; background:#5122c5; margin:.25rem 0; }
.cp-home .cp-outline-copy small { display:block; font-size:.38rem; line-height:1.25; }
.cp-home .cp-outline-action { position:relative; display:grid; place-items:center; flex:0 0 45%; min-height:1.5rem; border-radius:.2rem; background:#5122c5; color:#fff; font-size:.46rem; font-weight:700; overflow:hidden; }
.cp-home .cp-outline-before { display:flex; align-items:center; gap:.2rem; }
.cp-home .cp-outline-before svg { width:.6rem; height:.5rem; }
.cp-home .cp-outline-action .cp-subscribe-done { display:grid; place-items:center; position:absolute; inset:0; background:#171a2b; color:#fff; opacity:0; animation:cp-subscribe-state 7s steps(1,end) infinite; }
.cp-home .cp-kpi-preview { position:absolute; inset:3.4rem 1.8rem 3rem; text-align:left; display:flex; flex-direction:column; }
.cp-home .cp-kpi-heading { font-size:.8rem; font-weight:600; margin:0 0 1.4rem; color:#182b43; }
.cp-home .cp-kpi-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,1fr); gap:1.4rem 1.2rem; flex:1; }
.cp-home .cp-kpi-item { position:relative; border-top:1px solid #182b4330; padding-top:.65rem; display:flex; flex-direction:column; justify-content:flex-start; gap:.35rem; align-items:flex-start; color:#0876e6; }
.cp-home .cp-kpi-item::before { content:""; position:absolute; left:0; top:-2px; width:2rem; height:3px; background:currentColor; }
.cp-home .cp-kpi-item:nth-child(2),.cp-home .cp-kpi-item:nth-child(5) { color:#5122c5; }
.cp-home .cp-kpi-item:nth-child(3) { color:#182b43; }
.cp-home .cp-kpi-item span { font-size:.64rem; line-height:1.4; min-height:2.7em; }
.cp-home .cp-kpi-item strong { font-family:Unbounded,sans-serif; font-size:clamp(2rem,4.5vw,3.6rem); font-weight:650; letter-spacing:-.06em; line-height:1.2; }
.cp-home .cp-kpi-total { color:#ff9418; }
.cp-home:not([data-homepage-ready]) .cp-color-strip { animation:none; opacity:1; transform:translateY(-50%); }
@media(max-width:832px) and (min-width:601px) {
    .cp-home .cp-tool-lower,.cp-home .cp-tool-subscribe { grid-column:1 / span 5; }
    .cp-home .cp-tool-data { grid-column:6 / span 7; }
    .cp-home .cp-kpi-preview { inset-inline:1.1rem; }
    .cp-home .cp-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(3,1fr); gap:1rem; }
    .cp-home .cp-kpi-item strong { font-size:2.1rem; }
}
@media(max-width:600px) {
    .cp-home .cp-tool-lower,.cp-home .cp-tool-subscribe,.cp-home .cp-tool-data { grid-column:auto; grid-row:auto; }
    .cp-home .cp-tool-subscribe { order:4; }
    .cp-home .cp-tool-data { order:5; }
    .cp-home .cp-tool-lower .cp-tool-art,.cp-home .cp-tool-subscribe .cp-tool-art { height:8.5rem; }
    .cp-home .cp-tool-data .cp-tool-art { flex:auto; height:25rem; min-height:25rem; }
    .cp-home .cp-kpi-preview { inset:3.3rem 1.2rem 3rem; }
    .cp-home .cp-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(3,1fr); gap:1rem; }
    .cp-home .cp-kpi-item strong { font-size:2.1rem; }
    .cp-home .cp-color-name strong { font-size:1rem; }
    .cp-home .cp-color-name small { font-size:.38rem; }
}
@media(prefers-reduced-motion:reduce) {
    .cp-home .cp-color-strip { animation:none; opacity:1; transform:translateY(-50%); }
    .cp-home .cp-outline-action .cp-subscribe-done { animation:none; opacity:0; }
}
/* Воздух под номером карточки перед HTML-превью. */
.cp-home .cp-color-strip,.cp-home .cp-tool-subscribe .cp-subscribe-preview { top:calc(45% + .65rem); }

/* Общий блок создания проекта: одна палитра и последовательность действий. */
.cp-home .cp-intro.cp-mission { display:block; }
.cp-home .cp-mission-main { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; gap:clamp(2rem,3vw,3rem); }
.cp-home .cp-mission .cp-kicker { font-size:.7rem; margin-bottom:1.2rem; }
.cp-home .cp-mission h2 { margin:0 0 1.3rem; font-size:clamp(1.65rem,3.1vw,2.6rem); line-height:1.35; }
.cp-home .cp-mission-copy>p:not(.cp-kicker) { margin:0; max-width:35rem; font-size:.94rem; line-height:1.7; }
.cp-home .cp-mission-visual { margin:0; min-width:0; }
.cp-home .cp-mission .cp-brand-board { width:100%; padding:.85rem; background:var(--portal-color-surface); }
.cp-home .cp-mission .cp-board-banner { aspect-ratio:4; }
.cp-home .cp-mission .cp-board-background-copy { font-size:clamp(1rem,1.5vw,1.4rem); }
.cp-home .cp-mission .cp-board-tag { font-size:.45rem; bottom:.4rem; right:.5rem; }
.cp-home .cp-mission .cp-board-row { gap:.5rem; margin-block:.5rem; }
.cp-home .cp-mission .cp-board-chapter,.cp-home .cp-mission .cp-board-data { min-height:4.5rem; padding:.65rem; }
.cp-home .cp-mission .cp-board-chapter strong { margin-top:.5rem; font-size:.8rem; }
.cp-home .cp-mission .cp-board-chapter>span { font-size:1.1rem; bottom:.4rem; right:.6rem; }
.cp-home .cp-mission .cp-board-data .cp-chart { height:2.5rem; }
.cp-home .cp-mission .cp-board-lower { padding:.4rem; }
.cp-home .cp-mission .cp-native-preview { height:3.5rem; }
.cp-home .cp-mission[data-palette-ready] .cp-native-scene { top:0; }
.cp-home .cp-mission-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; margin:2.5rem 0 0; padding:0; list-style:none; }
.cp-home .cp-mission-steps>li { display:flex; flex-direction:column; align-items:flex-start; border-top:1px solid var(--home-line); padding-top:1.25rem; }
.cp-home .cp-mission-steps .cp-mission-details { margin-top:auto; padding-top:.6rem; font-size:.78rem; min-height:44px; gap:.65rem; }
.cp-home .cp-mission-number { display:block; color:var(--home-purple); font:600 .95rem/1.5 Unbounded,sans-serif; margin-bottom:.8rem; }
.cp-home .cp-mission-steps h3 { margin:0 0 .65rem; font:600 .88rem/1.5 Unbounded,sans-serif; letter-spacing:-.04em; }
.cp-home .cp-mission-steps p { margin:0; color:var(--home-muted); font-size:.8rem; line-height:1.7; }
.cp-home .cp-mission-foot { display:flex; justify-content:space-between; align-items:center; gap:2rem; margin-top:2.25rem; }
.cp-home .cp-mission-actions { display:flex; align-items:center; gap:1.5rem; flex-shrink:0; }
.cp-home .cp-mission-foot p { margin:0; max-width:27rem; color:var(--home-muted); font-size:.75rem; line-height:1.6; }
.cp-home .cp-mission-foot .cp-text-link { font-size:.8rem; }
/* На широком экране баннер заполняет высоту рядом с текстом и переключателями. */
@media(min-width:901px) {
    .cp-home .cp-mission-visual { display:flex; align-self:stretch; }
    .cp-home .cp-mission .cp-brand-board { display:flex; flex-direction:column; flex:1; }
    .cp-home .cp-mission .cp-board-banner { flex:1; aspect-ratio:auto; min-height:10rem; }
    .cp-home .cp-mission .cp-board-banner>img { position:absolute; inset:0; }
    .cp-home .cp-mission :is(.cp-board-row,.cp-board-lower,.cp-board-footer) { flex-shrink:0; }
}
@media(max-width:900px) {
    .cp-home .cp-mission-main { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.7rem; }
    .cp-home .cp-mission h2 { font-size:clamp(1.55rem,3vw,2rem); }
    .cp-home .cp-mission-steps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; }
    .cp-home .cp-mission-foot { flex-direction:column; align-items:flex-start; gap:1rem; }
}
@media(max-width:600px) {
    .cp-home .cp-mission-main { grid-template-columns:1fr; gap:1.7rem; }
    .cp-home .cp-mission h2 { font-size:1.55rem; }
    .cp-home .cp-mission .cp-kicker { max-width:18rem; line-height:1.6; }
    .cp-home .cp-mission-copy>p:not(.cp-kicker) { font-size:.88rem; }
    .cp-home .cp-mission-visual { width:100%; max-width:28rem; }
    .cp-home .cp-mission .cp-board-banner { aspect-ratio:3; }
    .cp-home .cp-mission-steps { grid-template-columns:1fr; gap:1.5rem; margin-top:1.8rem; }
    .cp-home .cp-mission-steps h3 { font-size:.9rem; }
    .cp-home .cp-mission-number { margin-bottom:.4rem; }
    .cp-home .cp-mission-actions { flex-wrap:wrap; gap:.6rem 1.5rem; }
}

.cp-home .cp-tool-lower [data-tool-lower-native] { position:absolute; left:7%; right:7%; top:calc(45% + .65rem); height:5rem; transform:translateY(-50%); }
.cp-home [data-tool-lower-color][hidden] { display:none; }
.cp-home .cp-tools-description {  color:var(--home-muted); font-size:.9rem; line-height:1.65; }
.cp-home .cp-tools-description p { margin:0 0 .7rem; }
.cp-home .cp-tools-foot .cp-text-link { flex-shrink:0; }
/* Палитра сайта для третьей плашки в карточке инструмента. */
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] .lt-card { background-color:var(--home-paper)!important; }
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] .lt-compact-panel { background-color:var(--home-blue)!important; }
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] .lt-copy + .lt-compact-panel,
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] .lt-end { background-color:var(--home-purple)!important; }
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] :is(.lt-name,.lt-role) { color:var(--home-ink)!important; }
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] :is(.lt-compact-text,.lt-native-icon) { color:var(--home-paper)!important; }
.cp-home [data-tool-lower-native] [data-lower-variant="forest"] .lt-native-icon :is(svg,path,circle,line,polyline,ellipse) { stroke:var(--home-paper)!important; }
/* Парные карточки сохраняют общую высоту, широкая сетка отдаёт больше места изображениям. */
.cp-home .cp-tool-images,.cp-home .cp-tool-nickname,.cp-home .cp-tool-project { grid-column:span 6; }
.cp-home .cp-tool-banner { grid-column:span 7; }
.cp-home .cp-tool-logo { grid-column:span 5; }
.cp-home .cp-tool-intro { grid-column:span 5; }
.cp-home .cp-tool-stickers { grid-column:span 7; }
.cp-home .cp-tool-images .cp-tool-art,.cp-home .cp-tool-nickname .cp-tool-art,.cp-home .cp-tool-project .cp-tool-art { height:18rem; }
.cp-home .cp-tool-images .cp-tool-art { background:#e8edf7; }
.cp-home .cp-image-catalog-preview { position:absolute; inset:3rem 1rem; display:flex; align-items:center; justify-content:center; gap:.5rem; }
.cp-home .cp-image-catalog-preview img { display:block; width:30%; height:100%; object-fit:contain; }
.cp-home .cp-nickname-preview { position:absolute; inset:3rem 1rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.55rem; font-size:clamp(1.15rem,2.6vw,1.9rem); line-height:1.3; }
.cp-home [data-fancy-count][hidden],.cp-home .cp-nickname-preview [hidden] { display:none; }

/* Статичные примеры проектных возможностей продолжают оформление этапов ниже. */
.cp-home .cp-tool-banner .cp-tool-art { background:#e7edf7; color:#182b43; }
.cp-home .cp-channel-banner-preview { display:block; width:100%; height:100%; object-fit:cover; }
.cp-home .cp-tool-banner .cp-art-top,.cp-home .cp-tool-banner .cp-template-label { opacity:1; text-shadow:0 1px 3px #f7f8fc; }
.cp-home .cp-tool-banner .cp-template-label { padding:.3rem .45rem; border-radius:.25rem; background:#f7f8fce6; }
.cp-home .cp-tool-logo .cp-tool-art { background:#ebf0f9; color:#171a2b; }
.cp-home .cp-tool-intro .cp-tool-art { background:#20263c; color:#f7f8fc; }
.cp-home .cp-tool-project.cp-tool-intro .cp-tool-art { height:auto; aspect-ratio:16/9; container-type:inline-size; }
.cp-home .cp-tool-stickers .cp-tool-art { background:#e5def5; color:#372161; }
.cp-home .cp-tool-project .cp-project-preview { position:absolute; inset:3rem 1.5rem; height:auto; }
.cp-home .cp-site-logo-preview { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; }
.cp-home .cp-site-logo-preview>img { width:8rem; height:8rem; object-fit:contain; }
.cp-home .cp-site-logo-preview>span { font:700 1.05rem Unbounded,sans-serif; letter-spacing:-.055em; }
.cp-home .cp-site-logo-preview>span>span { color:var(--home-blue); }
.cp-home .cp-tool-intro .cp-tool-art .cp-motion-screen { inset:0; padding:15cqw 6cqw 11cqw; }
.cp-home .cp-tool-intro .cp-motion-screen>small { font-size:1.8cqw; }
.cp-home .cp-tool-intro .cp-motion-screen>strong { font-size:6cqw; line-height:1.1; margin-top:2cqw; }
.cp-home .cp-intro-frames { display:flex; gap:.3rem; margin-top:1.2rem; }
.cp-home .cp-intro-frames>i { height:.2rem; flex:1; background:#f7f8fc40; }
.cp-home .cp-intro-frames>i:first-child { background:#ffad42; }
.cp-home .cp-tool-intro .cp-intro-frames { gap:1cqw; margin-top:3cqw; }
.cp-home .cp-tool-intro .cp-intro-frames>i { height:.5cqw; }
.cp-home .cp-text-sticker-preview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); align-items:center; justify-items:center; gap:.6rem 1rem; }
.cp-home .cp-text-sticker-preview>img { display:block; width:100%; height:100%; object-fit:contain; }
.cp-home .cp-text-sticker-preview>img:first-child { transform:rotate(-6deg); }
.cp-home .cp-text-sticker-preview>img:nth-child(2) { transform:rotate(6deg); }
@media(min-width:1200px) {
    .cp-home .cp-tool-images { grid-column:span 8; }
    .cp-home .cp-tool-nickname { grid-column:span 4; }
    .cp-home .cp-channel-banner-preview { object-position:center 65%; }
}
@media(min-width:601px) and (max-width:832px) {
    .cp-home .cp-tool-project .cp-project-preview { inset-inline:1rem; }
    .cp-home .cp-text-sticker-preview { gap:.5rem; }
}
@media(max-width:600px) {
    .cp-home .cp-tool-images,.cp-home .cp-tool-nickname,.cp-home .cp-tool-project { grid-column:auto; }
    .cp-home .cp-tool-images { order:7; }
    .cp-home .cp-tool-nickname { order:8; }
    .cp-home .cp-tool-project { order:9; }
    .cp-home .cp-tool-images .cp-tool-art,.cp-home .cp-tool-nickname .cp-tool-art,.cp-home .cp-tool-project .cp-tool-art { height:14.5rem; }
    .cp-home .cp-tool-project .cp-project-preview { inset:2.5rem 1rem; }
    .cp-home .cp-site-logo-preview>img { width:6.5rem; height:6.5rem; }
    .cp-home .cp-text-sticker-preview { gap:.5rem; }
}