/*! Vaporex Design · vx-steps */

.vx-steps.steps{padding:var(--vx-sp) 0 0}
.vx-steps .steps__grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(32px,5vw,90px);align-items:stretch}
.vx-steps .steps__cta{display:flex;align-items:center;gap:16px 22px;flex-wrap:wrap;margin-top:clamp(36px,5vw,60px)}
.vx-steps .steps__alt{color:var(--vx-muted);font-size:var(--vx-fz)}
.vx-steps .steps__alt a{color:var(--vx-blue);font-weight:500;border-bottom:1px solid var(--vx-line-blue)}
.vx-steps .chat{position:relative}
.vx-steps .chat__phone{max-width:330px;margin-inline:auto;border:1px solid var(--vx-line);border-radius:22px;overflow:hidden;background:#e9e3db;box-shadow:0 40px 70px -40px rgba(15,35,64,.45)}
.vx-steps .chat__bar{display:flex;align-items:center;gap:10px;padding:11px 14px;background:var(--vx-blue);color:#fff}
.vx-steps .chat__avatar{width:32px;height:32px;border-radius:50%;overflow:hidden;background:#fff;flex:none;display:grid;place-items:center}
.vx-steps .chat__avatar img{width:100%;height:100%;object-fit:contain}
.vx-steps .chat__who{display:grid;line-height:1.2}
.vx-steps .chat__who b{font-size:14.5px;font-weight:600}
.vx-steps .chat__who i{font-style:normal;font-size:11.5px;opacity:.8}
.vx-steps .chat__body{display:grid;gap:8px;padding:14px 12px;min-height:0;align-content:start;background-image:radial-gradient(rgba(0,82,163,.07) 1px,transparent 1px);background-size:16px 16px}
.vx-steps .msg{position:relative;max-width:88%;padding:9px 12px 18px;border-radius:12px;font-size:13.5px;line-height:1.42;opacity:0;transform:translateY(14px) scale(.97);transition:opacity .5s var(--vx-ease),transform .55s var(--vx-ease)}
.vx-steps .msg.is-on{opacity:1;transform:none}
.vx-steps .msg--out{justify-self:end;background:#dcf7c5;border-bottom-right-radius:3px}
.vx-steps .msg--in{justify-self:start;background:#fff;border-bottom-left-radius:3px}
.vx-steps .msg__photo{display:block;margin:-2px -3px 7px;border-radius:8px;overflow:hidden;aspect-ratio:2.3/1}
.vx-steps .msg__photo img{width:100%;height:100%;object-fit:cover}
.vx-steps .msg__time{position:absolute;right:12px;bottom:6px;font-style:normal;font-size:10.5px;color:rgba(15,35,64,.45)}
.vx-steps .chat__typing{justify-self:start;display:none;gap:5px;padding:12px 14px;background:#fff;border-radius:12px;border-bottom-left-radius:3px;opacity:0;transition:opacity .4s}
.vx-steps .chat__typing.is-on{display:flex;opacity:1}
.vx-steps .chat__typing i{width:7px;height:7px;border-radius:50%;background:rgba(15,35,64,.3);animation:vx-type 1.2s ease-in-out infinite}
.vx-steps .chat__typing i:nth-child(2){animation-delay:.2s}
.vx-steps .chat__typing i:nth-child(3){animation-delay:.4s}
@media (prefers-reduced-motion:reduce){
  .vx-steps .chat__typing i{animation:none}
  .vx-steps .msg{opacity:1;transform:none}
}
.vx-steps .chat__input{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:#fff;border-top:1px solid var(--vx-line);font-size:13.5px;color:var(--vx-muted)}
.vx-steps .chat__input svg{width:20px;height:20px;fill:var(--vx-green-deep);flex:none}
@media (max-width:1100px){
  .vx-steps .steps__grid{grid-template-columns:minmax(0,1fr);gap:44px}
  .vx-steps .chat{position:static}
}
.vx-steps.steps--row .steps__row{--g:clamp(20px,3vw,44px);display:grid;grid-template-columns:repeat(4,1fr);gap:var(--g);counter-reset:none}
.vx-steps.steps--row .steps__row li{position:relative;padding-top:6px;opacity:0;transform:translateY(16px);transition:opacity .6s var(--vx-ease),transform .7s var(--vx-ease)}
.vx-steps.steps--row .steps__row li.is-on{opacity:1;transform:none}
.vx-steps.steps--row .steps__row li:not(:last-child)::before,.vx-steps.steps--row .steps__row li:not(:last-child)::after{content:"";position:absolute;top:23px;left:44px;right:calc(-1 * var(--g) - 2px);height:2px}
.vx-steps.steps--row .steps__row li:not(:last-child)::before{background:var(--vx-line)}
.vx-steps.steps--row .steps__row li:not(:last-child)::after{background:var(--vx-blue);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--vx-ease) .25s}
.vx-steps.steps--row .steps__row li.is-on::after{transform:scaleX(1)}
.vx-steps .steps__n{position:relative;display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;border:2px solid var(--vx-line-blue);color:var(--vx-blue);font-size:14.5px;font-weight:600;margin-bottom:16px;transition:background .4s,color .4s,border-color .4s}
.vx-steps.steps--row li.is-on .steps__n{background:var(--vx-blue);border-color:var(--vx-blue);color:#fff;animation:vx-ping .9s var(--vx-ease) .1s}
@media (prefers-reduced-motion:reduce){
  .vx-steps.steps--row .steps__row li{opacity:1;transform:none;transition:none}
  .vx-steps.steps--row .steps__row li::after{transform:none;transition:none}
  .vx-steps.steps--row li.is-on .steps__n{animation:none}
}
.vx-steps.steps--row h3{font-size:1.15rem;font-weight:600;letter-spacing:-.01em;margin-bottom:8px}
.vx-steps.steps--row p{color:var(--vx-muted);font-size:var(--vx-fz);margin:0;max-width:30ch}
@media (max-width:1100px){
  .vx-steps.steps--row .steps__row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:36px}
  .vx-steps.steps--row .steps__row li:nth-child(2)::before,.vx-steps.steps--row .steps__row li:nth-child(2)::after{display:none}
}
@media (max-width:860px){
  .vx-steps.steps--row .steps__row{grid-template-columns:minmax(0,1fr);row-gap:30px}
  .vx-steps.steps--row .steps__row li::before,.vx-steps.steps--row .steps__row li::after{display:none}
  .vx-steps.steps--row .steps__row li{padding-left:52px}
  .vx-steps.steps--row .steps__n{position:absolute;left:0;top:0}
}