/* «Продающий набор» для /demo/ — цвета и шрифты берутся из base.css каждого сайта */
.sk-offer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:22px 26px;border-radius:var(--radius);
  background:linear-gradient(100deg,color-mix(in srgb,var(--accent) 22%,transparent),color-mix(in srgb,var(--accent-2) 14%,transparent));
  border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);margin-bottom:16px}
.sk-offer b{font-family:var(--font-display);font-size:clamp(17px,1.8vw,22px);line-height:1.25}
.sk-guar{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:16px}
@media(max-width:860px){.sk-guar{grid-template-columns:1fr}}
.sk-guar>div{padding:26px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);display:grid;gap:8px;align-content:start}
.sk-n{font-family:var(--font-display);font-size:13px;color:var(--accent);letter-spacing:.1em}
.sk-guar b{font-family:var(--font-display);font-size:clamp(18px,1.7vw,22px);line-height:1.2}
.sk-guar p{color:var(--muted);font-size:15px}
.sk-rev{margin-top:0}
.sk-faq{display:grid;gap:10px;max-width:900px}
.sk-faq details{border-radius:var(--radius-sm);background:var(--surface);border:1px solid var(--line);padding:0 22px;transition:border-color .3s}
.sk-faq details[open]{border-color:var(--accent)}
.sk-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-weight:700;font-size:17px}
.sk-faq summary::-webkit-details-marker{display:none}
.sk-faq summary i{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:20px;background:var(--accent);color:var(--on-accent);transition:transform .35s var(--ease)}
.sk-faq details[open] summary i{transform:rotate(45deg)}
.sk-faq details p{color:var(--muted);padding:0 0 20px}
/* нижняя панель на телефоне */
.sk-bar{position:fixed;left:10px;right:10px;bottom:10px;z-index:80;display:none;gap:8px;transform:translateY(140%);transition:transform .45s var(--ease)}
.sk-bar.on{transform:none}
.sk-bar a{display:grid;place-items:center;height:54px;border-radius:999px;font-weight:800;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.sk-bar__call{width:54px;flex:none;background:var(--surface);border:1px solid var(--line);font-size:20px}
.sk-bar__go{flex:1;background:var(--accent);color:var(--on-accent)}
@media(max-width:760px){.sk-bar{display:flex}
  /* плашка портфолио «Хочу такой же» поднимается над панелью */
  .demo-bar{transition:bottom .45s var(--ease)}
  body.sk-on .demo-bar{bottom:78px}
  body.sk-on .toast{bottom:140px}}

.sk-ic{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.2em;margin-right:6px}.sk-bar__call .sk-ic{width:22px;height:22px;margin:0}