/* Подача как у mp-quick: тёмный градиент, «стеклянные» кнопки, появление с размытием.
   Анимации услуг — свои, на CSS, без их видео и картинок. */
:root {
  --dark: #0E1525;
  --deep: #080C16;
  --mag: #A8874F;
  --mag-d: #8A6C3A;
  --lav: #F4F3F0;
  --lav2: #EBE8E2;
  --line: #E3DFD7;
  --text: #151821;
  --muted: #5F6370;
  --gold: #FFC107;
}
body {
  font-family: "Golos Text", system-ui, sans-serif;
  background:
    radial-gradient(1100px 520px at -8% -12%, rgba(205, 176, 122, .18), transparent 58%),
    radial-gradient(900px 480px at 108% 6%, rgba(168, 135, 79, .14), transparent 52%),
    radial-gradient(820px 520px at 48% 108%, rgba(205, 176, 122, .12), transparent 52%),
    linear-gradient(180deg, #ECEAE5 0%, #F4F3F0 42%, #F1EFEB 100%);
}
a { color: #8A6C3A; }

.header {
  background: linear-gradient(290deg, #0E1525 20%, #1C2538 100%);
  box-shadow: 0 10px 30px rgba(8, 12, 22, .18);
}
.logo i {
  background: linear-gradient(135deg, #E2CFA6, #A8874F);
  box-shadow: 0 8px 18px rgba(205, 176, 122, .35);
}
.phone:hover { color: #E9DCC0; }

.btn, .btn-ghost {
  position: relative;
  overflow: hidden;
  border: 0;
  text-decoration: none;
  border-radius: 999px;
  min-height: 54px;
  padding: 0 28px;
  transition: transform .25s cubic-bezier(.22, 1, .36, 1), box-shadow .25s;
}
.btn {
  background: linear-gradient(96.51deg, #CDB07A 22%, #A8874F 100%);
  box-shadow: 0 10px 24px rgba(168, 135, 79, .28);
}
.btn-ghost {
  background: linear-gradient(96.51deg, #E9DCC0 22%, #C9AE7C 100%);
  color: #2B2312;
}
.btn::before, .btn-ghost::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent);
  transform: translateX(-130%);
  transition: transform .55s ease;
}
.btn:hover, .btn-ghost:hover { transform: translateY(-2px); color: #fff; }
.btn-ghost:hover { color: #2B2312; }
.btn:hover::before, .btn-ghost:hover::before { transform: translateX(130%); }
.header .btn { min-height: 44px; }

.hero {
  position: relative;
  color: #fff;
  overflow: hidden;
  background:
    radial-gradient(520px 280px at 78% 18%, rgba(205, 176, 122, .28), transparent 60%),
    radial-gradient(420px 240px at 12% 80%, rgba(205, 176, 122, .12), transparent 55%),
    linear-gradient(290deg, #0E1525 28%, #1C2538 95%);
}
/* Рисунки только на тёмных панелях заявки/CTA: корзина, рубль, склад, отзыв, рост */
.shape-draw {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .2;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%20viewBox='0%200%20240%20240'%3E%3Cg%20fill='none'%20stroke='%23ffffff'%20stroke-width='1.3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M38%2022v40'/%3E%3Cpath%20d='M32%2022h15a10%2010%200%200%201%200%2020H32'/%3E%3Cpath%20d='M30%2051h20'/%3E%3Cpath%20d='M128%2058l30-20%2030%2020v30h-60z'/%3E%3Cpath%20d='M146%2088V70h24v18'/%3E%3Cpath%20d='M146%2076h24M146%2082h24'/%3E%3Cpath%20d='M152%2052h12'/%3E%3Cpath%20d='M22%20140h44v28H22z'/%3E%3Cpath%20d='M66%20148h15l9%2010v10H66'/%3E%3Cpath%20d='M70%20151h9l5%206h-14z'/%3E%3Cpath%20d='M30%20168'/%3E%3Cpath%20d='M18%20168h4'/%3E%3Cpath%20d='M134%20128v42h56'/%3E%3Cpath%20d='M140%20162l14-14%2010%208%2020-22'/%3E%3Cpath%20d='M176%20134h8v8'/%3E%3Cpath%20d='M100.0%2097.0L101.9%20101.5L106.7%20101.8L103.0%20105.0L104.1%20109.7L100.0%20107.2L95.9%20109.7L97.0%20105.0L93.3%20101.8L98.1%20101.5z'/%3E%3Cpath%20d='M206.0%20191.0L208.4%20196.7L214.6%20197.2L209.9%20201.3L211.3%20207.3L206.0%20204.1L200.7%20207.3L202.1%20201.3L197.4%20197.2L203.6%20196.7z'/%3E%3Cpath%20d='M116.0%20205.0L117.3%20208.2L120.8%20208.5L118.1%20210.7L118.9%20214.0L116.0%20212.2L113.1%20214.0L113.9%20210.7L111.2%20208.5L114.7%20208.2z'/%3E%3Cpath%20d='M132.0%20205.0L133.3%20208.2L136.8%20208.5L134.1%20210.7L134.9%20214.0L132.0%20212.2L129.1%20214.0L129.9%20210.7L127.2%20208.5L130.7%20208.2z'/%3E%3Cpath%20d='M148.0%20205.0L149.3%20208.2L152.8%20208.5L150.1%20210.7L150.9%20214.0L148.0%20212.2L145.1%20214.0L145.9%20210.7L143.2%20208.5L146.7%20208.2z'/%3E%3Cpath%20d='M98%2034h.01'/%3E%3Cpath%20d='M200%20110h.01'/%3E%3Cpath%20d='M60%20206h.01'/%3E%3Cpath%20d='M216%2040h.01'/%3E%3Ccircle%20cx='32'%20cy='172'%20r='5'/%3E%3Ccircle%20cx='76'%20cy='172'%20r='5'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 240px 240px;
  background-repeat: repeat;
}
.hero .wrap.top > div:first-child {
  position: relative;
  border-radius: 32px;
  padding: 8px;
}
@media (max-width: 900px) {
  .hero .wrap.top > div:first-child {
    padding: 28px 22px 26px;
    background:
      radial-gradient(280px 160px at 90% 0%, rgba(205, 176, 122, .22), transparent 60%),
      linear-gradient(160deg, rgba(28, 37, 56, .55), rgba(8, 12, 22, .35));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1);
    overflow: hidden;
  }
}
/* Раскладка первого экрана: одна и та же на главной и на страницах услуг */
.hero .wrap.top {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 40px;
  align-items: center;
  padding-top: 72px;
  padding-bottom: 72px;
}
.hero h1 { margin: 0 0 18px; font-size: 52px; line-height: 1.08; font-weight: 800; color: #fff; }
.hero p { margin: 0 0 30px; font-size: 19px; max-width: 540px; }
.hero .actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero .crumb { margin: 0 0 14px; font-size: 14px; font-weight: 600; }
.hero .crumb a { color: rgba(255, 255, 255, .72); text-decoration: none; }
.hero .crumb a:hover { color: #fff; }
/* Страницы услуг: справа живая сцена услуги */
.hero.solo .wrap.top { grid-template-columns: 1fr; padding-bottom: 40px; }
.hero.solo h1 { max-width: 880px; }
.hero.solo p { max-width: 700px; }
.hero-stage {
  position: relative;
  width: min(420px, 100%);
  justify-self: end;
  perspective: 900px;
  animation: rise .9s cubic-bezier(.22, 1, .36, 1) both;
  animation-delay: .15s;
}
.hero-stage .scene {
  height: 340px;
  border-radius: 28px;
  box-shadow: 0 28px 56px rgba(0, 8, 40, .4), inset 0 0 0 1px rgba(255, 255, 255, .08);
}
.hero-stage .chip {
  position: absolute;
  z-index: 3;
  background: #fff;
  color: var(--dark);
  font-weight: 800;
  border-radius: 999px;
  padding: 10px 14px;
  box-shadow: 0 12px 30px rgba(0, 8, 40, .22);
  font-size: 14px;
  animation: float 4.2s ease-in-out infinite;
}
.hero-stage .chip.c1 {
  top: 18px;
  left: -18px;
  background: linear-gradient(96deg, #CDB07A, #A8874F);
  color: #fff;
}
.hero-stage .chip.c2 { top: 42%; right: -22px; animation-delay: -1.3s; }
.hero-stage .chip.c3 {
  bottom: 22px;
  left: -12px;
  background: #E9DCC0;
  color: #2B2312;
  max-width: 200px;
  line-height: 1.25;
  animation-delay: -2.4s;
}
@media (max-width: 900px) {
  .hero-stage { justify-self: center; margin-top: 8px; }
  .hero-stage .chip.c1 { left: 0; }
  .hero-stage .chip.c2 { right: 0; }
  .hero-stage .chip.c3 { left: 8px; }
}
.stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  padding-bottom: 56px;
}
.stat { border-radius: 18px; padding: 20px 22px; }
.stat b { display: block; font-size: 30px; font-weight: 800; font-variant-numeric: tabular-nums; }
.stat span { font-size: 15px; }
@media (max-width: 900px) {
  .hero .wrap.top { grid-template-columns: 1fr; }
  .hero h1 { font-size: 36px; }
}
@media (max-width: 700px) {
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.hero h1 { letter-spacing: -.03em; }
.hero h1 span { color: #E2CFA6; }
.hero p { color: rgba(255, 255, 255, .78); }
.hero h1, .hero p, .hero .actions, .mock {
  animation: rise .9s cubic-bezier(.22, 1, .36, 1) both;
}
.hero p { animation-delay: .1s; }
.hero .actions { animation-delay: .18s; }
.mock { animation-delay: .15s; }
@keyframes rise {
  from { opacity: 0; transform: translateY(28px); filter: blur(8px); }
  to { opacity: 1; transform: none; filter: none; }
}

.stat {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .12);
  backdrop-filter: blur(8px);
}
.stat span { color: rgba(255, 255, 255, .75); }

.mock { width: min(380px, 100%); height: 560px; perspective: 900px; }
@media (max-width: 900px) {
  .mock { height: 520px; }
}
.studio-glow {
  position: absolute;
  width: 240px;
  height: 240px;
  right: -10px;
  top: 10px;
  background: radial-gradient(circle, rgba(205, 176, 122, .45), transparent 68%);
  filter: blur(2px);
  animation: glowpulse 4.6s ease-in-out infinite;
}
.studio-floor {
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: 18px;
  height: 28px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, .35), transparent 70%);
}
.mock-card {
  background: #fff;
  box-shadow: 0 30px 50px rgba(0, 8, 40, .35), 0 2px 0 rgba(255, 255, 255, .6) inset;
  transform-origin: 50% 80%;
  animation: cardtilt 7s ease-in-out infinite;
}
.mock-img { background: #fff; color: #5F6370; }
.mock-price { color: #CB11AB; }
.mock-line { background: #E8E5DE; }
.chip {
  border-radius: 999px;
  box-shadow: 0 14px 30px rgba(0, 8, 40, .22);
  animation: float 4.2s ease-in-out infinite;
}
.chip.c1 { background: linear-gradient(96deg, #CDB07A, #A8874F); }
.chip.c3 { background: #E9DCC0; color: #2B2312; max-width: 220px; line-height: 1.25; }
@media (max-width: 700px) {
  .chip.c1 { left: 0; }
  .chip.c2 { right: 0; }
  .chip.c3 { left: 8px; bottom: 18px; max-width: 190px; }
}
@keyframes cardtilt {
  0%, 100% { transform: rotateY(-10deg) rotateX(6deg) translateY(0); }
  50% { transform: rotateY(8deg) rotateX(2deg) translateY(-10px); }
}
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
@keyframes glowpulse {
  0%, 100% { opacity: .75; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.06); }
}

h2, .svc h3, .step b, .pro b, .case h3 { letter-spacing: -.02em; }
.eyebrow { color: #8A6C3A; }
.sec.alt { background: transparent; }
.svc, .case, .step, .pro {
  border: 0;
  box-shadow: 0 16px 40px rgba(16, 24, 64, .06);
  transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s;
}
.svc:hover, .case:hover { transform: translateY(-6px); box-shadow: 0 22px 48px rgba(16, 24, 64, .1); }
.svc li::before { background: #A8874F; box-shadow: inset 0 0 0 4px #F2EEE7; }
.tag { background: #F3F0EA; color: #1A4FBF; }
.step { background: #fff; }

.js .reveal {
  opacity: 0;
  transform: translateY(26px);
  filter: blur(8px);
  transition: opacity .8s cubic-bezier(.22, 1, .36, 1), transform .8s cubic-bezier(.22, 1, .36, 1), filter .8s cubic-bezier(.22, 1, .36, 1);
}
.js .reveal.in { opacity: 1; transform: none; filter: none; }
.js .svc.reveal.in:hover, .js .case.reveal.in:hover { transform: translateY(-6px); }

/* ===== Как работаем: узкий шейп + прямоугольник этапов ===== */
#how.how-sec { padding: 28px 20px 56px; }
.how-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 1200px;
  padding: 0;
  background: none;
  box-shadow: none;
  border-radius: 0;
}
#how > .wrap::before { display: none; }
.how-title-shape,
.how-board-shape {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.how-title-shape {
  border-radius: 22px;
  padding: 20px 32px 22px;
  min-height: 0;
  border: 1px solid rgba(255, 255, 255, .08);
  background: #131929;
  box-shadow: 0 18px 40px -18px rgba(19, 25, 41, .55);
}
.how-title-shape .shape-draw { display: none; }
.how-title-shape .eyebrow {
  position: relative;
  z-index: 1;
  margin: 0 0 6px;
  color: #C9D8F0;
}
.how-title-shape h2 {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: clamp(26px, 3.2vw, 36px);
  line-height: 1.15;
  letter-spacing: -.02em;
  color: #fff;
}
.how-board-shape {
  border-radius: 28px;
  padding: 22px 28px 28px;
  border: 1px solid #E6EAF1;
  background: #fff;
  box-shadow: 0 18px 40px -22px rgba(16, 24, 64, .18);
}
.how-board-shape .how-shape-ink { display: none; }
.how-board-inner { position: relative; z-index: 1; }
.how-shape-ink {
  opacity: .1 !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%20viewBox='0%200%20240%20240'%3E%3Cg%20fill='none'%20stroke='%230E1525'%20stroke-width='1.3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M38%2022v40'/%3E%3Cpath%20d='M32%2022h15a10%2010%200%200%201%200%2020H32'/%3E%3Cpath%20d='M30%2051h20'/%3E%3Cpath%20d='M128%2058l30-20%2030%2020v30h-60z'/%3E%3Cpath%20d='M146%2088V70h24v18'/%3E%3Cpath%20d='M146%2076h24M146%2082h24'/%3E%3Cpath%20d='M152%2052h12'/%3E%3Cpath%20d='M22%20140h44v28H22z'/%3E%3Cpath%20d='M66%20148h15l9%2010v10H66'/%3E%3Cpath%20d='M70%20151h9l5%206h-14z'/%3E%3Cpath%20d='M134%20128v42h56'/%3E%3Cpath%20d='M140%20162l14-14%2010%208%2020-22'/%3E%3Cpath%20d='M176%20134h8v8'/%3E%3Cpath%20d='M100%2097l1.9%204.5%204.8.3-3.7%203.2%201.1%204.7L100%20107.2l-4.1%202.5%201.1-4.7-3.7-3.2%204.8-.3z'/%3E%3C/g%3E%3C/svg%3E") !important;
}
.how-expl {
  margin: 22px 0 14px;
  font-size: 15px;
  color: var(--muted, #5F6370);
  max-width: 640px;
}
.how-board-shape .steps { margin: 0; }
.how-board-shape .pros { margin-top: 0; }
.how-board-shape .step,
.how-board-shape .pro {
  background: #fff;
  border: 1px solid rgba(18, 25, 41, .1);
  box-shadow: 0 16px 34px -20px rgba(18, 25, 41, .55);
}
.how-board-shape .pros { margin-top: 14px; }
.how-board-shape .steps .step:not(:last-child)::after { display: none !important; }

/* Линия готовности: заполняется слева направо, пункты появляются под ней */
.how-ready { margin: 0 6px 18px; }
.how-ready-track {
  display: block;
  height: 4px;
  border-radius: 999px;
  background: #E6EAF1;
  overflow: hidden;
}
.how-ready-track i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #1B4F9A, #3D7AD6);
}
.js .how-board-shape.is-on .how-ready-track i {
  width: 100%;
  transition: width 2.2s cubic-bezier(.22, 1, .36, 1);
}
.js .how-board-shape .step,
.js .how-board-shape .pro,
.js .how-board-shape .how-expl {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .45s ease, transform .45s cubic-bezier(.22, 1, .36, 1);
}
.js .how-board-shape .step { transition-delay: calc(var(--i, 0) * 520ms); }
.js .how-board-shape .how-expl { transition-delay: 2.15s; }
.js .how-board-shape .pro { transition-delay: calc(2.2s + var(--i, 0) * 140ms); }
.js .how-board-shape.is-on .step,
.js .how-board-shape.is-on .pro,
.js .how-board-shape.is-on .how-expl {
  opacity: 1;
  transform: none;
}
.js .how-title-shape {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .55s ease, transform .55s cubic-bezier(.22, 1, .36, 1);
}
.js .how-title-shape.in {
  opacity: 1;
  transform: none;
}
@media (max-width: 700px) {
  .how-title-shape { padding: 18px 20px; border-radius: 18px; }
  .how-board-shape { padding: 16px 12px 18px; border-radius: 20px; }
  .how-expl { margin-top: 18px; }
  .how-board-shape .steps,
  .how-board-shape .pros { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .how-board-shape .step,
  .how-board-shape .pro { padding: 14px 10px 12px !important; }
  .how-board-shape .step b,
  .how-board-shape .pro b { font-size: 15px; }
  .how-board-shape .step > span:last-child,
  .how-board-shape .pro span { font-size: 13px; line-height: 1.35; }
  .how-board-shape .step .step-num { width: 42px; height: 42px; margin-bottom: 10px; font-size: 14px; }
  .how-board-shape .step .ic-pad { top: 14px; right: 10px; width: 30px !important; height: 30px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .js .how-board-shape .step,
  .js .how-board-shape .pro,
  .js .how-board-shape .how-expl,
  .js .how-title-shape {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  .how-ready-track i { width: 100% !important; transition: none !important; }
}

.footer { background: #080C16; }

/* Линия текста по дуге между первым экраном и услугами */
.curve-loop {
  position: relative;
  z-index: 2;
  margin: -4px 0 -56px;
  overflow: visible;
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
}
.curve-loop.is-drag { cursor: grabbing; }
.curve-loop-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.curve-loop-text {
  fill: #121929;
  font-family: "Unbounded", "Onest", sans-serif;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.curve-loop-text .curve-mark { fill: #A8874F; }
@media (max-width: 700px) {
  .curve-loop { margin: 2px 0 -44px; z-index: 4; }
  .curve-loop-text { font-size: 74px; }
}
@media (prefers-reduced-motion: reduce) {
  .curve-loop { cursor: default; }
}

/* Формы на готовых блоках */
.hero { position: relative; }
.hero::before, .hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
}
.hero::before {
  width: 460px; height: 460px; right: -140px; top: -180px;
  border: 1px solid rgba(226, 207, 166, .28);
  box-shadow: inset 0 0 0 48px rgba(205, 176, 122, .05);
}
.hero::after {
  width: 220px; height: 220px; left: -40px; bottom: 20px;
  background: radial-gradient(circle, rgba(205, 176, 122, .16), transparent 68%);
}
.stat { position: relative; overflow: hidden; }
.stat::after {
  content: "";
  position: absolute; width: 92px; height: 92px; right: -30px; top: -38px;
  border-radius: 30px; background: rgba(226, 207, 166, .14); transform: rotate(18deg);
}
.step { overflow: hidden; }
.step::after {
  content: "";
  position: absolute; width: 130px; height: 130px; right: -46px; bottom: -58px;
  border-radius: 42px;
  background: linear-gradient(135deg, rgba(168, 135, 79, .14), transparent 70%);
  transform: rotate(22deg);
}
.pro { position: relative; overflow: hidden; }
.pro::after {
  content: "";
  position: absolute; width: 78px; height: 78px; left: -26px; top: -28px;
  border-radius: 50%; border: 12px solid rgba(205, 176, 122, .16);
}
.case { position: relative; overflow: hidden; }
.case::before {
  content: "";
  position: absolute; width: 160px; height: 160px; right: -56px; top: -62px;
  background: #F2EEE7; border-radius: 42% 58% 64% 36%;
}
.case > * { position: relative; z-index: 1; }
.case-img {
  background:
    radial-gradient(circle at 18% 20%, #fff, transparent 42%),
    linear-gradient(145deg, #E4DED2, #E2D8C4 55%, #EEE6D3);
}
details { position: relative; overflow: hidden; }
details::before {
  content: "";
  position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px;
  border-radius: 3px; background: linear-gradient(#CDB07A, #A8874F);
}
.reach { position: relative; overflow: hidden; }
.reach::before, .reach::after { content: ""; position: absolute; pointer-events: none; }
.reach::before {
  width: 240px; height: 240px; right: -80px; top: -90px; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .2);
}
.reach::after {
  width: 88px; height: 88px; right: 28px; bottom: 18px; border-radius: 26px;
  background: rgba(205, 176, 122, .14); transform: rotate(16deg);
}
.reach > * { position: relative; z-index: 1; }

/* ===== Внутренние страницы услуг и контактов ===== */
.page-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(290.31deg, #0E1525 28.77%, #1C2538 95.35%);
  color: #fff;
  padding: 56px 0 48px;
}
.page-hero::before,
.page-hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
}
.page-hero::before { width: 280px; height: 280px; right: -40px; top: -80px; background: radial-gradient(circle, rgba(205, 176, 122, .35), transparent 70%); }
.page-hero::after { width: 180px; height: 180px; left: 8%; bottom: -70px; background: radial-gradient(circle, rgba(205, 176, 122, .18), transparent 70%); }
.page-hero .wrap { position: relative; z-index: 1; }
.page-hero .crumb { margin: 0 0 14px; font-size: 14px; font-weight: 600; }
.page-hero .crumb a { color: rgba(255, 255, 255, .72); text-decoration: none; }
.page-hero .crumb a:hover { color: #fff; }
.page-hero h1 { margin: 0 0 12px; color: #fff; font-size: 44px; line-height: 1.1; letter-spacing: -0.03em; max-width: 760px; }
.page-hero p { margin: 0; max-width: 640px; color: rgba(255, 255, 255, .78); font-size: 18px; }
.page { padding: 36px 0 72px; }
.page-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 20px; align-items: start; }
.sheet, .price-card {
  background: #fff;
  border-radius: 24px;
  padding: 28px;
  box-shadow: 0 18px 40px rgba(16, 24, 64, .06);
}
.sheet h2, .price-card h2 { margin: 0 0 14px; font-size: 22px; color: var(--dark); }
.sheet ul { margin: 0; padding: 0; list-style: none; }
.sheet li { position: relative; padding: 10px 0 10px 28px; border-bottom: 1px solid var(--line); }
.sheet li:last-child { border-bottom: 0; }
.sheet li::before { content: ""; position: absolute; left: 0; top: 16px; width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(135deg, #CDB07A, #A8874F); }
.steps-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 20px; }
.steps-3 article { background: #fff; border-radius: 22px; padding: 22px; box-shadow: 0 18px 40px rgba(16, 24, 64, .06); }
.steps-3 b { display: block; margin-bottom: 8px; color: var(--mag); font-size: 13px; letter-spacing: .04em; }
.steps-3 h3 { margin: 0 0 6px; font-size: 18px; }
.steps-3 p { margin: 0; color: var(--muted); }
.price-card .sum { font-size: 36px; font-weight: 800; letter-spacing: -0.03em; color: var(--dark); }
.price-card .sum small { font-size: 16px; font-weight: 600; color: var(--muted); }
.price-card p { color: var(--muted); }
.price-card .btn { width: 100%; margin-top: 8px; }
.contact-page { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; }
@media (max-width: 900px) {
  .page-hero h1 { font-size: 32px; }
  .page-grid, .steps-3, .contact-page { grid-template-columns: 1fr; }
}
.contact { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: stretch; }
.reach { background: var(--dark); color: #fff; border-radius: 28px; padding: 36px; display: flex; flex-direction: column; gap: 18px; }
.reach h2 { color: #fff; margin: 0; }
.reach p { margin: 0; color: #E3D3F0; }
.soc { display: flex; flex-wrap: wrap; gap: 12px; }
.soc .btn, .soc .btn-ghost { flex: 1; min-width: 160px; }
.qr-card { display: flex; align-items: center; gap: 18px; background: #fff; color: var(--text); border-radius: 20px; padding: 14px; text-decoration: none; }
.qr-card img { width: 148px; height: 148px; flex: 0 0 auto; border-radius: 12px; background: #fff; }
.qr-card p { margin: 0; color: var(--text); font-weight: 700; font-size: 16px; line-height: 1.35; }
.info { background: var(--lav); border-radius: 28px; padding: 32px; display: flex; flex-direction: column; gap: 18px; }
.info .item small { display: block; color: var(--muted); font-size: 13px; }
.info .item a, .info .item b { font-size: 20px; font-weight: 800; color: var(--dark); text-decoration: none; }
@media (max-width: 900px) { .contact { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .qr-card { flex-direction: column; text-align: center; } }

/* Меню на узком экране — на весь экран */
.nav-check { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.burger {
  display: none;
  position: relative;
  z-index: 60;
  width: 44px; height: 44px; border-radius: 12px;
  background: rgba(255, 255, 255, .12);
  align-items: center; justify-content: center;
  color: transparent; font-size: 0; cursor: pointer;
}
.burger::before,
.burger::after {
  content: "";
  position: absolute;
  left: 13px; right: 13px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: transform .28s ease, top .28s ease, opacity .2s ease;
}
.burger::before { top: 16px; box-shadow: 0 6px 0 #fff; }
.burger::after { top: 28px; }
html.nav-open .burger::before {
  top: 21px;
  box-shadow: none;
  transform: rotate(45deg);
}
html.nav-open .burger::after {
  top: 21px;
  transform: rotate(-45deg);
}
html.nav-open { overflow: hidden; }
html.nav-open .head-right .msg { display: none; }
@media (max-width: 1000px) {
  .header { z-index: 50; }
  .header .wrap { position: relative; }
  .phone { display: none; }
  .burger { display: flex; order: 4; margin-left: 8px; flex: 0 0 44px; }
  .logo { min-width: 0; position: relative; z-index: 60; }
  .head-right { order: 3; margin-left: auto; flex: 0 0 auto; position: relative; z-index: 60; }
  .nav {
    display: flex;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100dvh;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 92px 24px 32px;
    background: #0E1525;
    z-index: 55;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: none;
    overflow-y: auto;
    text-align: left;
    transition: opacity .28s ease, visibility .28s;
  }
  .nav a {
    position: relative;
    z-index: 1;
    padding: 16px 0;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    border-radius: 0;
  }
  .nav a::after { display: none; }
  .nav-check:checked ~ .nav {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }
}

/* Страницы услуг + панели-шейпы */
.band { padding: 16px 20px; background: transparent; }
.hero + .band { padding-top: 28px; }
.band.alt { background: transparent; padding: 16px 20px; }
.band h2, .block-head h2 { margin: 0 0 8px; font-size: 34px; letter-spacing: -.03em; color: var(--dark); }
.block-head { margin-bottom: 22px; max-width: 680px; }
.block-head p, .band .lead { margin: 0; color: var(--muted); font-size: 17px; }
.kicker { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8A6C3A; }

/* Скруглённые блоки с живым фоном */
.band > .wrap:not(.contact),
.sec:not(.partners) > .wrap {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-radius: 36px;
  padding: 40px 36px;
  background:
    radial-gradient(380px 200px at 100% 0%, rgba(205, 176, 122, .14), transparent 62%),
    linear-gradient(165deg, rgba(255, 255, 255, .96) 0%, rgba(247, 249, 253, .94) 100%);
  border: 1px solid rgba(168, 135, 79, .08);
  box-shadow: 0 22px 56px rgba(16, 24, 64, .07);
}
.band.alt > .wrap:not(.contact),
.sec.alt > .wrap {
  background:
    radial-gradient(440px 240px at 100% -10%, rgba(205, 176, 122, .22), transparent 58%),
    radial-gradient(360px 220px at -5% 110%, rgba(168, 135, 79, .12), transparent 55%),
    linear-gradient(160deg, #F1EEE8 0%, #F6F5F2 48%, #F1EEE7 100%);
  border-color: rgba(168, 135, 79, .1);
}
.band > .wrap:not(.contact)::before,
.sec:not(.partners) > .wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .11;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%20viewBox='0%200%20240%20240'%3E%3Cg%20fill='none'%20stroke='%230E1525'%20stroke-width='1.3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M38%2022v40'/%3E%3Cpath%20d='M32%2022h15a10%2010%200%200%201%200%2020H32'/%3E%3Cpath%20d='M30%2051h20'/%3E%3Cpath%20d='M128%2058l30-20%2030%2020v30h-60z'/%3E%3Cpath%20d='M146%2088V70h24v18'/%3E%3Cpath%20d='M146%2076h24M146%2082h24'/%3E%3Cpath%20d='M152%2052h12'/%3E%3Cpath%20d='M22%20140h44v28H22z'/%3E%3Cpath%20d='M66%20148h15l9%2010v10H66'/%3E%3Cpath%20d='M70%20151h9l5%206h-14z'/%3E%3Cpath%20d='M30%20168'/%3E%3Cpath%20d='M18%20168h4'/%3E%3Cpath%20d='M134%20128v42h56'/%3E%3Cpath%20d='M140%20162l14-14%2010%208%2020-22'/%3E%3Cpath%20d='M176%20134h8v8'/%3E%3Cpath%20d='M100.0%2097.0L101.9%20101.5L106.7%20101.8L103.0%20105.0L104.1%20109.7L100.0%20107.2L95.9%20109.7L97.0%20105.0L93.3%20101.8L98.1%20101.5z'/%3E%3Cpath%20d='M206.0%20191.0L208.4%20196.7L214.6%20197.2L209.9%20201.3L211.3%20207.3L206.0%20204.1L200.7%20207.3L202.1%20201.3L197.4%20197.2L203.6%20196.7z'/%3E%3Cpath%20d='M116.0%20205.0L117.3%20208.2L120.8%20208.5L118.1%20210.7L118.9%20214.0L116.0%20212.2L113.1%20214.0L113.9%20210.7L111.2%20208.5L114.7%20208.2z'/%3E%3Cpath%20d='M132.0%20205.0L133.3%20208.2L136.8%20208.5L134.1%20210.7L134.9%20214.0L132.0%20212.2L129.1%20214.0L129.9%20210.7L127.2%20208.5L130.7%20208.2z'/%3E%3Cpath%20d='M148.0%20205.0L149.3%20208.2L152.8%20208.5L150.1%20210.7L150.9%20214.0L148.0%20212.2L145.1%20214.0L145.9%20210.7L143.2%20208.5L146.7%20208.2z'/%3E%3Cpath%20d='M98%2034h.01'/%3E%3Cpath%20d='M200%20110h.01'/%3E%3Cpath%20d='M60%20206h.01'/%3E%3Cpath%20d='M216%2040h.01'/%3E%3Ccircle%20cx='32'%20cy='172'%20r='5'/%3E%3Ccircle%20cx='76'%20cy='172'%20r='5'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 240px 240px;
}
.band > .wrap:not(.contact) > *,
.sec:not(.partners) > .wrap > * { position: relative; z-index: 1; }

/* Тёмный акцентный шейп для коротких смысловых блоков */
.band.ink > .wrap {
  background:
    radial-gradient(420px 240px at 90% 0%, rgba(205, 176, 122, .28), transparent 60%),
    radial-gradient(320px 200px at 10% 100%, rgba(205, 176, 122, .14), transparent 55%),
    linear-gradient(290deg, #0E1525 18%, #1C2538 100%);
  border: 0;
  box-shadow: 0 28px 60px rgba(8, 12, 22, .28);
  color: #fff;
}
.band.ink > .wrap::before {
  opacity: .18;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%20viewBox='0%200%20240%20240'%3E%3Cg%20fill='none'%20stroke='%23ffffff'%20stroke-width='1.3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M38%2022v40'/%3E%3Cpath%20d='M32%2022h15a10%2010%200%200%201%200%2020H32'/%3E%3Cpath%20d='M30%2051h20'/%3E%3Cpath%20d='M128%2058l30-20%2030%2020v30h-60z'/%3E%3Cpath%20d='M146%2088V70h24v18'/%3E%3Cpath%20d='M146%2076h24M146%2082h24'/%3E%3Cpath%20d='M152%2052h12'/%3E%3Cpath%20d='M22%20140h44v28H22z'/%3E%3Cpath%20d='M66%20148h15l9%2010v10H66'/%3E%3Cpath%20d='M70%20151h9l5%206h-14z'/%3E%3Cpath%20d='M30%20168'/%3E%3Cpath%20d='M18%20168h4'/%3E%3Cpath%20d='M134%20128v42h56'/%3E%3Cpath%20d='M140%20162l14-14%2010%208%2020-22'/%3E%3Cpath%20d='M176%20134h8v8'/%3E%3Cpath%20d='M100.0%2097.0L101.9%20101.5L106.7%20101.8L103.0%20105.0L104.1%20109.7L100.0%20107.2L95.9%20109.7L97.0%20105.0L93.3%20101.8L98.1%20101.5z'/%3E%3Cpath%20d='M206.0%20191.0L208.4%20196.7L214.6%20197.2L209.9%20201.3L211.3%20207.3L206.0%20204.1L200.7%20207.3L202.1%20201.3L197.4%20197.2L203.6%20196.7z'/%3E%3Cpath%20d='M116.0%20205.0L117.3%20208.2L120.8%20208.5L118.1%20210.7L118.9%20214.0L116.0%20212.2L113.1%20214.0L113.9%20210.7L111.2%20208.5L114.7%20208.2z'/%3E%3Cpath%20d='M132.0%20205.0L133.3%20208.2L136.8%20208.5L134.1%20210.7L134.9%20214.0L132.0%20212.2L129.1%20214.0L129.9%20210.7L127.2%20208.5L130.7%20208.2z'/%3E%3Cpath%20d='M148.0%20205.0L149.3%20208.2L152.8%20208.5L150.1%20210.7L150.9%20214.0L148.0%20212.2L145.1%20214.0L145.9%20210.7L143.2%20208.5L146.7%20208.2z'/%3E%3Cpath%20d='M98%2034h.01'/%3E%3Cpath%20d='M200%20110h.01'/%3E%3Cpath%20d='M60%20206h.01'/%3E%3Cpath%20d='M216%2040h.01'/%3E%3Ccircle%20cx='32'%20cy='172'%20r='5'/%3E%3Ccircle%20cx='76'%20cy='172'%20r='5'/%3E%3C/g%3E%3C/svg%3E");
}
.band.ink .kicker { color: #E2CFA6; }
.band.ink h2,
.band.ink .block-head h2 { color: #fff; }
.band.ink .block-head p,
.band.ink .lead { color: rgba(255, 255, 255, .76); }

.sec { padding: 28px 20px; background: transparent; }
.sec.partners {
  padding: 28px 0 56px;
  background: transparent;
}

/* Карточки внутри панели — стекло, не второй белый слой */
.band > .wrap .who,
.band > .wrap .tile,
.band > .wrap .more,
.band > .wrap .rate,
.band > .wrap .note,
.band > .wrap .shift article,
.band > .wrap .steps-3 article,
.band > .wrap .ask details,
.sec:not(.partners) > .wrap .svc,
.sec:not(.partners) > .wrap .case,
.sec:not(.partners) > .wrap .step,
.sec:not(.partners) > .wrap .pro,
.sec:not(.partners) > .wrap details {
  background: rgba(255, 255, 255, .78);
  border: 1px solid rgba(168, 135, 79, .07);
  box-shadow: 0 12px 28px rgba(16, 24, 64, .05);
  backdrop-filter: blur(10px);
}
.band > .wrap .shift .now {
  background: linear-gradient(290deg, #0E1525, #1C2538);
  border: 0;
}
.band > .wrap .cta-end {
  margin: 28px 0 0;
}
.band.ink > .wrap .btn {
  box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
}

@media (max-width: 700px) {
  .band,
  .band.alt,
  .sec { padding-left: 12px; padding-right: 12px; }
  #faq.sec { padding-left: 12px; padding-right: 12px; }
  .sec.partners { padding-left: 0; padding-right: 0; }
  .band > .wrap:not(.contact),
  .sec:not(.partners) > .wrap {
    border-radius: 28px;
    padding: 28px 18px;
  }
}
.who-grid, .tile-grid, .more-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
/* Две услуги одного типа и отдельно кнопка заявки — не третья карточка */
.more-row { display: flex; align-items: center; gap: 16px; }
.more-row .more-grid { flex: 1 1 auto; }
.more-grid.more-two { grid-template-columns: 1fr 1fr; }
.more-row .btn { flex: 0 0 auto; }
.ship-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.who, .tile, .more {
  position: relative; overflow: hidden;
  background: #fff; border-radius: 24px; padding: 22px;
  box-shadow: 0 16px 40px rgba(16, 24, 64, .06);
}
.who h3, .tile h3, .more h3 { margin: 0 0 8px; font-size: 18px; color: var(--dark); }
.who p, .tile p, .more p { margin: 0; color: var(--muted); }
.who::after, .tile::after {
  content: "";
  position: absolute; width: 92px; height: 92px; right: -28px; top: -32px;
  border-radius: 28px; background: rgba(205, 176, 122, .16); transform: rotate(18deg);
}
.tile b {
  display: block; margin-bottom: 10px;
  font-size: 13px; letter-spacing: .06em; color: #A8874F;
}
.shift {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 18px; align-items: stretch;
}
.shift article, .note {
  position: relative; overflow: hidden;
  background: #fff; border-radius: 28px; padding: 28px;
  box-shadow: 0 16px 40px rgba(16, 24, 64, .06);
}
.shift small { display: block; color: var(--muted); font-size: 14px; }
.shift b { display: block; margin-top: 6px; font-size: 64px; line-height: 1; letter-spacing: -.04em; color: var(--dark); font-variant-numeric: tabular-nums; }
.shift .now { background: linear-gradient(290deg, #0E1525, #1C2538); }
.shift .now small, .shift .now b { color: #fff; }
.shift .now::after {
  content: "";
  position: absolute; width: 140px; height: 140px; right: -40px; bottom: -50px;
  border-radius: 40px; background: rgba(205, 176, 122, .16); transform: rotate(16deg);
}
.shift i {
  align-self: center; width: 46px; height: 46px; border-radius: 50%;
  background: #fff; box-shadow: 0 10px 24px rgba(16, 24, 64, .08);
  position: relative;
}
.shift i::before {
  content: "";
  position: absolute; left: 14px; top: 21px; width: 16px; height: 2px; background: #A8874F;
}
.shift i::after {
  content: "";
  position: absolute; right: 12px; top: 16px;
  border: 6px solid transparent; border-left: 8px solid #A8874F;
}
.ask details {
  background: #fff; border-radius: 18px; padding: 0 22px; margin-bottom: 8px;
  box-shadow: 0 10px 24px rgba(16, 24, 64, .04);
}
.ask summary { list-style: none; cursor: pointer; padding: 16px 36px 16px 0; font-weight: 700; font-size: 18px; color: var(--dark); position: relative; }
.ask summary::-webkit-details-marker { display: none; }
.ask summary::after { content: "+"; position: absolute; right: 0; top: 12px; font-size: 28px; color: #A8874F; font-weight: 500; }
.ask details[open] summary::after { content: "−"; }
.ask details p { margin: 0 0 16px; color: var(--muted); }
.note .btn { margin-top: 16px; }
.js .more.reveal.in:hover { transform: translateY(-4px); }
.price-row { display: grid; grid-template-columns: .8fr 1.2fr; gap: 16px; align-items: stretch; }
.price-row .sum { font-size: 42px; font-weight: 800; letter-spacing: -.03em; color: var(--dark); }
.price-row .sum small { font-size: 16px; font-weight: 600; color: var(--muted); }
.note ul { margin: 12px 0 0; padding: 0; list-style: none; }
.note li { position: relative; padding: 8px 0 8px 22px; }
.note li::before {
  content: ""; position: absolute; left: 0; top: 14px; width: 8px; height: 8px; border-radius: 50%;
  background: linear-gradient(135deg, #CDB07A, #A8874F);
}
.more { display: block; text-decoration: none; color: inherit; }
.more:hover { transform: translateY(-4px); }
.cta-end {
  position: relative; overflow: hidden;
  margin: 8px 0 72px; border-radius: 32px; padding: 36px;
  background: linear-gradient(290deg, #0E1525, #1C2538); color: #fff;
}
.cta-end h2 { margin: 0 0 8px; color: #fff; font-size: 32px; }
.cta-end p { margin: 0 0 18px; color: rgba(255,255,255,.78); max-width: 560px; }
.cta-end::after {
  content: "";
  position: absolute; width: 180px; height: 180px; right: -30px; top: -50px;
  border: 1px solid rgba(255,255,255,.2); border-radius: 50%;
}
.cta-end .actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 12px; }
.send { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 20px; }
@media (max-width: 900px) {
  .who-grid, .tile-grid, .more-grid, .more-grid.more-two, .ship-grid, .price-row, .send { grid-template-columns: 1fr; }
  .more-row { flex-direction: column; align-items: stretch; }
  .shift { grid-template-columns: 1fr; }
  .shift i { display: none; }
  .shift b { font-size: 48px; }
}
@media (max-width: 640px) {
  .header .head-right .btn { display: none; }
}
@media (max-width: 520px) {
  .page-hero h1 { font-size: 30px; }
  .hero.solo h1 { font-size: 32px; }
}

/* График полок: три линии дорастают до конца, затем всплывает подсказка */
.jam {
  position: relative;
  margin-top: 8px;
  border-radius: 28px;
  padding: 22px 18px 16px;
  background: linear-gradient(180deg, #1A2140, #12182E);
  box-shadow: 0 18px 40px rgba(16, 24, 64, .18);
}
.jam svg { display: block; width: 100%; height: auto; }
.jam .ln {
  fill: none;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 900;
  stroke-dashoffset: 900;
  animation: jamDraw 2.6s cubic-bezier(.22, 1, .36, 1) forwards;
}
.jam .ln-b { animation-delay: .2s; }
.jam .ln-c { animation-delay: .4s; }
.jam .dot {
  opacity: 0;
  animation: jamDot .4s ease forwards;
  animation-delay: 2.5s;
}
.jam-tip {
  position: absolute;
  right: 7%;
  top: 18%;
  min-width: 210px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #2A314C;
  color: #fff;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
  opacity: 0;
  transform: translateY(8px);
  animation: jamTip .45s ease forwards;
  animation-delay: 2.4s;
}
.jam-tip b { display: block; margin-bottom: 8px; font-size: 14px; }
.jam-tip span { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 13px; font-weight: 600; }
.jam-tip i { width: 9px; height: 9px; border-radius: 2px; flex: 0 0 auto; }
.jam-tip .c1 { background: #F0A04B; }
.jam-tip .c2 { background: #E9DCC0; }
.jam-tip .c3 { background: #3DDC78; }
.jam-note { margin: 12px 0 0; color: rgba(255,255,255,.62); font-size: 13px; }
.rate-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.rate { background: #fff; border-radius: 24px; padding: 22px; box-shadow: 0 16px 40px rgba(16, 24, 64, .06); }
.rate h3 { margin: 0; font-size: 18px; color: var(--dark); }
.rate b { display: block; margin: 8px 0 6px; font-size: 32px; letter-spacing: -.03em; color: var(--dark); }
.rate b small { font-size: 15px; font-weight: 600; color: var(--muted); }
.rate p { margin: 0; color: var(--muted); }
@keyframes jamDraw { to { stroke-dashoffset: 0; } }
@keyframes jamDot { to { opacity: 1; } }
@keyframes jamTip { to { opacity: 1; transform: none; } }
@media (max-width: 900px) {
  .rate-grid { grid-template-columns: 1fr; }
  .jam-tip { position: static; margin: 8px 8px 0; animation: none; opacity: 1; transform: none; }
}

/* Мобилка: текст и блоки по центру */
@media (max-width: 700px) {
  .hero:not(.doc-hero) .wrap.top > div:first-child,
  .hero:not(.doc-hero) h1,
  .hero:not(.doc-hero) p,
  .page-hero,
  .page-hero h1,
  .page-hero p,
  .block-head,
  .cta-end,
  .cta-end p {
    text-align: center;
  }
  .doc-hero,
  .doc-hero h1,
  .doc-hero p,
  .doc-hero .crumb,
  .doc-hero .updated {
    text-align: left !important;
  }
  .hero p,
  .page-hero p,
  .hero.solo h1,
  .hero.solo p,
  .block-head,
  .cta-end p,
  .sub {
    margin-left: auto;
    margin-right: auto;
  }
  .hero .actions,
  .cta-end .actions,
  .soc {
    justify-content: center;
  }
  .sec-head {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
  }
  .sec-head h2,
  .sec-head .sub { text-align: left; }
  .sec-head .eyebrow,
  #faq .sec-head .eyebrow { justify-content: flex-start; }
  #how.how-sec { padding-left: 12px; padding-right: 12px; }
  .how-title-shape { padding-left: 18px; padding-right: 18px; }
  .pros .pro,
  .steps .step,
  .who,
  .tile,
  .rate,
  .case {
    text-align: center;
  }
  .pro { flex-direction: column; align-items: center; }
  .steps .step,
  .who,
  .tile { display: flex; flex-direction: column; align-items: center; }
  .stats { text-align: center; }
  .mock { margin-inline: auto; }
}

/* Партнёры: бесконечная лента без кнопок — без теней и без «полосы» фона */
.partners {
  padding-bottom: 72px;
  overflow: hidden;
  background: #F7F6F3;
}
.partners .sec-head { margin-bottom: 28px; }
.partners-rail {
  position: relative;
  overflow: hidden;
  background: transparent;
  mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.partners-track {
  display: flex;
  width: max-content;
  align-items: center;
  animation: partnersRun 42s linear infinite;
  will-change: transform;
}
.partners-set {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 28px;
  padding-right: 28px;
}
.partners-track.is-static { animation: none; }
.partner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.partner-logo {
  min-width: 0;
  width: 96px;
  height: 96px;
  background: transparent;
  box-shadow: none;
}
.partner-logo img {
  display: block;
  width: 96px;
  height: 96px;
  object-fit: contain;
  filter: none;
  box-shadow: none;
}
.partner i {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-style: normal;
  font-weight: 800;
  color: #fff;
  background: var(--p, #A8874F);
}
.partner b { font-size: 15px; color: var(--dark); white-space: nowrap; }
@keyframes partnersRun {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .partners-track { animation: none; }
}

/* Уважение к prefers-reduced-motion. Сцены услуг гасит css/scenes.css */
@media (prefers-reduced-motion: reduce) {
  .hero h1, .hero p, .hero .actions, .mock, .mock-card, .chip, .studio-glow, .hero-stage {
    animation: none !important;
  }
  .js .reveal { opacity: 1; transform: none; filter: none; }
  .jam .ln { stroke-dashoffset: 0; animation: none; }
  .jam .dot, .jam-tip { opacity: 1; transform: none; animation: none; }
}