:root{
  --bb-green:#18CA8E;
  --bb-purple:#6453F8;
  --bb-text:#0F172A;
  --bb-muted:#64748B;
  --bb-bg:#ffffff;
  --bb-page:#F6F8FF;
  --bb-border:rgba(15,23,42,.10);
}

body{
  /* Единый белый фон для всего лендинга (как в макете) */
  background: #ffffff;
  color: var(--bb-text);
}

.lz-container{
  width: 100%;
  /* Единая ширина сетки для header/hero/sections */
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 24px;
}

.lz-header{
  background: var(--bb-bg);
  border-bottom: 1px solid var(--bb-border);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
  /* чтобы при скролле шапка не "сливалась" с контентом */
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

/* Header is fixed, so reserve space for it */
body{
  padding-top: 66px;
}
.lz-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 10px 0;
}
.lz-logo{
  display:flex;
  align-items:center;
  gap: 12px;
}
.lz-logo img{
  height: 44px;
  width: auto;
}

.lz-header-right{
  display:flex;
  align-items:center;
  gap: 14px;
}

.lz-socials{
  display:flex;
  align-items:center;
  gap: 10px;
}
.lz-social{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(24,202,142,.12);
  color: var(--bb-green);
  border: 1px solid rgba(24,202,142,.20);
  transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.lz-social:hover{
  transform: translateY(-2px);
  background: rgba(24,202,142,.18);
  box-shadow: 0 14px 28px rgba(24,202,142,.18);
}
.lz-social:active{ transform: translateY(1px); }

.lz-phone{
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 600;
  color: var(--bb-text);
  white-space: nowrap;
}
.lz-phone img{
  width: 18px;
  height: 18px;
}

.lz-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 12px;
  font-weight: 700;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
  user-select:none;
  cursor: pointer;
  will-change: transform;
}
.lz-btn:active{ transform: translateY(1px); }
.lz-btn:hover{ transform: translateY(-2px); }

/* Pulse + wave button animations (как на старом лендинге) */
.pulse{
  width: 7px;
  height: 7px;
  background-color: var(--bb-green);
  border-radius: 50%;
  position: relative;
  margin-right: 4px;
  animation: bb-pulse 1.5s linear infinite;
}
@keyframes bb-pulse{
  0% { box-shadow: 0 0 0 0 rgba(24,202,142,1), 0 0 0 0 rgba(24,202,142,1); }
  40%{ box-shadow: 0 0 0 10px rgba(24,202,142,0), 0 0 0 0 rgba(24,202,142,1); }
  100%{ box-shadow: 0 0 0 10px rgba(24,202,142,0), 0 0 0 0 rgba(24,202,142,0); }
}

.lz-btn-primary{ --wave-color: var(--bb-green); }
.lz-btn-purple{ --wave-color: var(--bb-purple); }
.lz-footer-btn{ --wave-color: rgba(255,255,255,.85); }

.animate-button{
  position: relative;
  z-index: 1;
}
.animate-button::after{
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 100%;
  border: 3px solid var(--wave-color, var(--bb-green));
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: bb-wave 1.5s infinite;
  pointer-events: none;
}
.animate-button:hover::after{
  animation: none;
  display: none;
}
@keyframes bb-wave{
  0% { width: 30px; height: 30px; opacity: 1; }
  100% { width: 200px; height: 200px; opacity: 0; }
}
.lz-btn-primary{
  background: var(--bb-green);
  color: #fff;
  box-shadow: 0 12px 24px rgba(24,202,142,.22);
}
.lz-btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 28px rgba(24,202,142,.26);
}
.lz-btn-ghost{
  background: rgba(100,83,248,.10);
  color: var(--bb-purple);
}
.lz-btn-ghost:hover{
  background: rgba(100,83,248,.14);
}

.lz-btn-purple{
  background: var(--bb-purple);
  color: #fff;
  box-shadow: 0 12px 24px rgba(100,83,248,.22);
}
.lz-btn-purple:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 28px rgba(100,83,248,.26);
}

.lz-hero{
  background: var(--bb-bg);
  /* чтобы следующий блок не "торчал" на первом экране */
  min-height: calc(100vh - 72px);
}
.lz-hero-inner{
  display:grid;
  /* даём картинке больше места справа */
  grid-template-columns: 1fr 1.15fr;
  gap: 32px;
  /* важно: не центрируем по вертикали, иначе текст "проваливается" вниз из-за высокой картинки */
  align-items:flex-start;
  /* нормальный отступ до следующей секции */
  padding: 14px 0 62px;
}

.lz-hero-copy{
  /* опускаем только текст относительно шапки */
  padding-top: 42px;
}
.lz-hero h1{
  font-size: 56px;
  line-height: 1.06;
  letter-spacing: -0.02em;
  margin: 0 0 22px;
}
.lz-hero p{
  font-size: 18px;
  line-height: 1.5;
  color: var(--bb-muted);
  margin: 0 0 28px;
  max-width: 620px;
}
.lz-hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap: 14px;
  align-items:center;
}
.lz-hero-art{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  overflow: visible; /* чтобы тень/низ иллюстрации не обрезались */
  /* позволяем иллюстрации "дышать" за пределами контейнера */
  margin-right: -64px;
}
.lz-hero-art img{
  width: 100%;
  max-width: 740px;
  height: auto;
  max-height: 700px; /* делаем иллюстрацию больше, как в примере */
  object-fit: contain;
  /* тень должна "выходить" за рамку как в макете */
  filter: drop-shadow(0 28px 26px rgba(15, 23, 42, 0.12));
  /* чуть приподнимаем картинку, чтобы совпала по уровню с текстом */
  margin-top: -38px;
}

/* Hero PNG illustration (bg1.png) — без лишних сдвигов/теней */
.lz-hero-art img.lz-hero-illustration{
  max-width: none;
  width: 100%;
  max-height: 760px;
  margin-top: -6px;
  filter: none;
  object-fit: contain;
  /* визуально делаем крупнее без поломки сетки */
  transform: scale(1.18);
  transform-origin: top right;
}

.lz-section{
  padding: 72px 0;
}

.lz-section-title{
  font-size: 34px;
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 0 0 10px;
  text-align: left;
  hyphens: none;
}

.lz-section-subtitle{
  margin: 0 0 26px;
  color: var(--bb-muted);
  font-size: 16px;
  line-height: 1.45;
  max-width: 720px;
  hyphens: none;
}

.lz-feature-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.lz-feature-card{
  position: relative;
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 18px;
  padding: 28px 26px 18px;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.06),
    0 16px 36px rgba(15, 23, 42, 0.06);
  display: flex;
  flex-direction: column;
  min-height: 460px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.lz-feature-card::before{
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 14px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(100,83,248,.65), rgba(24,202,142,.65));
  opacity: .9;
}

.lz-feature-card:hover{
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.14);
  box-shadow:
    0 2px 8px rgba(15, 23, 42, 0.08),
    0 22px 46px rgba(15, 23, 42, 0.08);
}

.lz-feature-title{
  font-size: 22px;
  line-height: 1.18;
  font-weight: 800;
  margin: 18px 0 10px; /* место под акцентную полоску */
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
}

.lz-feature-text{
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--bb-muted);
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
}

.lz-feature-ill{
  margin-top: auto;
  padding-top: 18px;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}
.lz-feature-ill img{
  width: 176px;
  height: auto;
  opacity: .95;
  filter: drop-shadow(0 18px 22px rgba(15, 23, 42, 0.10));
}

.lz-promo-card{
  border-radius: 24px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  background: #ffffff;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.06),
    0 18px 46px rgba(15, 23, 42, 0.06);
  padding: 34px 34px;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 22px;
  align-items: center;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.lz-promo-card:hover{
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.14);
  box-shadow:
    0 2px 10px rgba(15, 23, 42, 0.08),
    0 22px 46px rgba(15, 23, 42, 0.08);
}

.lz-promo-title{
  font-size: 44px;
  line-height: 1.06;
  letter-spacing: -0.02em;
  margin: 0 0 18px;
}
.lz-promo-text{
  margin: 0 0 22px;
  color: var(--bb-muted);
  font-size: 18px;
  line-height: 1.5;
  max-width: 680px;
}
.lz-promo-art{
  display:flex;
  justify-content:center;
  align-items:center;
}
.lz-promo-art img{
  width: 360px;
  height: auto;
  filter: drop-shadow(0 22px 32px rgba(15, 23, 42, 0.12));
}

/* Split sections (text + art) */
.lz-split{
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 34px;
  align-items: center;
}

.lz-split-card{
  border-radius: 24px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  background: #ffffff;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.06),
    0 18px 46px rgba(15, 23, 42, 0.06);
  padding: 34px 34px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.lz-split-card:hover{
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.14);
  box-shadow:
    0 2px 10px rgba(15, 23, 42, 0.08),
    0 22px 46px rgba(15, 23, 42, 0.08);
}
.lz-split-title{
  font-size: 46px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0 0 18px;
}
.lz-split-lead{
  margin: 0 0 16px;
  font-size: 18px;
  line-height: 1.5;
  color: var(--bb-text);
}
.lz-split-text{
  margin: 0 0 12px;
  font-size: 16px;
  line-height: 1.55;
  color: var(--bb-muted);
}
.lz-bullets{
  margin: 0 0 14px;
  padding-left: 22px;
  color: var(--bb-text);
}
.lz-bullets li{
  margin: 6px 0;
}
.lz-split-art{
  display:flex;
  justify-content:center;
  align-items:center;
}
.lz-split-art img{
  width: 420px;
  height: auto;
  filter: drop-shadow(0 22px 32px rgba(15, 23, 42, 0.12));
}

/* Packages */
.lz-packages-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 18px;
}
.lz-plan{
  position: relative;
  background:#fff;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 18px;
  padding: 26px 22px 22px;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.06),
    0 16px 36px rgba(15, 23, 42, 0.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.lz-plan--pro{
  border: 2px solid rgba(100, 83, 248, 0.55);
  box-shadow:
    0 2px 10px rgba(15, 23, 42, 0.08),
    0 26px 56px rgba(100, 83, 248, 0.12);
}
.lz-plan-popular{
  position: absolute;
  top: -14px;
  left: 18px;
  background: var(--bb-green);
  color: #fff;
  font-weight: 900;
  font-size: 12px;
  line-height: 1;
  padding: 9px 12px;
  border-radius: 12px;
  box-shadow: 0 14px 28px rgba(24,202,142,.22);
  z-index: 4;
  pointer-events: none;
}
.lz-plan:hover{
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.14);
  box-shadow:
    0 2px 10px rgba(15, 23, 42, 0.08),
    0 22px 46px rgba(15, 23, 42, 0.08);
}
.lz-plan--pro:hover{
  border-color: rgba(100, 83, 248, 0.75);
  box-shadow:
    0 4px 14px rgba(15, 23, 42, 0.10),
    0 30px 64px rgba(100, 83, 248, 0.16);
}

/* Subtle floating for illustrations */
@keyframes bb-float {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -8px, 0); }
}

.lz-hero-art img.lz-hero-illustration{
  animation: bb-float 6s ease-in-out infinite;
}

.lz-step-ico{
  animation: bb-float 8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce){
  .lz-hero-art img.lz-hero-illustration,
  .lz-step-ico{
    animation: none !important;
  }
  .lz-btn,
  .lz-feature-card,
  .lz-plan,
  .lz-promo-card,
  .lz-split-card{
    transition: none !important;
  }
}

/* Floating contact widget (bottom-right) */
.bb-contact{
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 2000;
  display: flex;
  align-items: center; /* выравниваем плашку по центру относительно круга */
  gap: 12px;
}

.bb-contact__label{
  background: var(--bb-green);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 999px;
  box-shadow: 0 18px 40px rgba(15,23,42,.12);
  position: relative;
  white-space: nowrap;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  height: 40px; /* визуально ровно по центру круга */
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
}

.bb-contact.is-ready .bb-contact__label{
  opacity: 1;
  transform: translateY(0);
}

.bb-contact__btn{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--bb-green);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 18px 34px rgba(24,202,142,.28);
  position: relative;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}
.bb-contact__btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 40px rgba(24,202,142,.34);
}
.bb-contact__btn-ring{
  position: absolute;
  inset: -8px;
  border-radius: 999px;
  border: 2px solid rgba(24,202,142,.35);
  animation: bb-contact-ring 1.8s ease-out infinite;
  pointer-events: none;
}
@keyframes bb-contact-ring{
  0% { transform: scale(.75); opacity: .9; }
  100% { transform: scale(1.35); opacity: 0; }
}
.bb-contact__btn-icon{
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: opacity .16s ease, transform .16s ease;
}
.bb-contact__btn-icon.is-switching{
  opacity: 0;
  transform: scale(.88);
}

.bb-contact__panel{
  position: absolute;
  right: 0;
  bottom: 72px;
  width: 300px;
  background: #fff;
  background-color: #fff;
  border: 1px solid rgba(100,83,248,.22);
  border-radius: 18px;
  padding: 12px 12px 12px;
  box-shadow: 0 26px 66px rgba(15,23,42,.18);
  opacity: 0;
  transform: translateY(10px) scale(.98);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.bb-contact__panel::before{
  content: "";
  display: none !important; /* на всякий случай — чтобы ничего не "просвечивало" */
}
.bb-contact.is-open .bb-contact__panel{
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.bb-contact__panel-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  margin: 2px 2px 6px;
}
.bb-contact__panel-title{
  font-weight: 950;
  color: rgba(15,23,42,.92);
  font-size: 18px;
  line-height: 1.15;
  letter-spacing: -0.01em;
}
.bb-contact__panel-close{
  width: 30px;
  height: 30px;
  border-radius: 10px;
  border: 1px solid rgba(100,83,248,.22);
  background: #fff;
  color: rgba(15,23,42,.60);
  cursor: pointer;
  line-height: 28px;
  font-size: 18px;
  padding: 0;
  transition: transform .16s ease, background .16s ease, color .16s ease;
}
.bb-contact__panel-close:hover{
  transform: translateY(-1px);
  background: rgba(100,83,248,.08);
  color: rgba(15,23,42,.86);
}
.bb-contact__panel-actions{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bb-contact__panel-action{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1.5px solid rgba(100,83,248,.40);
  background: #fff;
  background-color: #fff;
  color: rgba(15,23,42,.92);
  font-weight: 800;
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.bb-contact__panel-action{ --accent: var(--bb-purple); }
.bb-contact__panel-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color: var(--bb-purple);
}
.bb-contact__panel-ico svg{ display:block; }
.bb-contact__panel-action:hover{
  transform: translateY(-1px);
  background: #fff; /* остаётся белой, как фон */
  border-color: rgba(100,83,248,.65);
  box-shadow: 0 14px 30px rgba(15,23,42,.12);
}

@media (prefers-reduced-motion: reduce){
  .bb-contact__btn-ring{ animation: none !important; }
  .bb-contact__btn,
  .bb-contact__panel{ transition: none !important; }
  .bb-contact__btn-icon{ transition: none !important; }
  .bb-contact__label{ transition: none !important; }
}
.lz-plan-name{
  font-size: 40px;
  line-height: 1.05;
  margin: 0 0 10px;
  font-weight: 900;
}
.lz-plan-price{
  display:flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 10px;
}
.lz-plan-price-now{
  font-size: 44px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: #0b1220;
}
.lz-plan-price-now--purple{ color: var(--bb-purple); }
.lz-plan-price-now--green{ color: var(--bb-green); }
.lz-plan-price-old{
  font-size: 18px;
  color: rgba(100, 83, 248, 0.65);
  text-decoration: line-through;
}
.lz-plan-price-old--purple{
  color: rgba(100, 83, 248, 0.65);
}
.lz-plan-subtitle{
  margin: 0 0 14px;
  font-size: 18px;
  color: var(--bb-text);
}
.lz-plan-features{
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
}
.lz-plan-features li{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  margin: 10px 0;
  color: var(--bb-text);
  font-size: 18px;
}
.dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  margin-top: 9px;
  flex: 0 0 auto;
}
.dot-green{ background: var(--bb-green); }
.dot-purple{ background: var(--bb-purple); }
.lz-plan-cta{
  width: 100%;
  justify-content:center;
  border-radius: 14px;
  padding: 12px 16px;
}
.lz-plan-badge{
  position:absolute;
  right: 14px;
  bottom: 18px;
  transform: rotate(18deg);
  background: #ff3b30;
  color: #fff;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(255,59,48,.22);
  z-index: 3;          /* чтобы не уходила “за кнопку” */
  pointer-events: none;
}

/* Start easy */
.lz-start-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 26px;
  align-items: center;
}
.lz-start-title{
  font-size: 56px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 0 0 22px;
}
.lz-steps{
  display:flex;
  flex-direction: column;
  gap: 18px;
}
.lz-step{
  display:grid;
  grid-template-columns: 56px 1fr 220px;
  gap: 16px;
  align-items:center;
  padding: 14px 0;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.lz-step:last-child{ border-bottom: none; }
.lz-step-num{
  width: 46px;
  flex: 0 0 auto;
  font-size: 18px;
  color: rgba(15,23,42,.28);
  font-weight: 800;
}
.lz-step-body{ min-width: 0; }
.lz-step-title{
  font-size: 36px;
  line-height: 1.08;
  font-weight: 900;
  margin-bottom: 8px;
}
.lz-step-text{
  font-size: 18px;
  line-height: 1.5;
  color: var(--bb-muted);
  max-width: 680px;
}
.lz-step-art{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.lz-step-ico{
  width: 160px;
  max-width: 100%;
  height: auto;
  display:block;
  filter: drop-shadow(0 16px 22px rgba(15,23,42,.10));
}

/* Footer */
.lz-footer{
  background: #0b0f14;
  color: rgba(255,255,255,.86);
  padding: 62px 0 40px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.lz-footer-cols{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  align-items: stretch; /* одинаковая высота колонок */
}
.lz-footer-col{
  padding: 10px 0;
  display:flex;
  flex-direction: column;
  min-height: 190px; /* чтобы кнопки выровнялись */
}
.lz-footer-col-title{
  font-size: 16px;
  font-weight: 800;
  margin-bottom: 10px;
}
.lz-footer-col-text{
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255,255,255,.72);
  margin-bottom: 16px;
  max-width: 360px;
}
.lz-footer-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 18px;
  border-radius: 12px;
  background: #ffffff;
  color: #0b0f14;
  font-weight: 800;
  min-width: 220px;
  margin-top: auto; /* главное: кнопки на одной линии */
}
.lz-footer-btn:hover{
  background: rgba(255,255,255,.92);
}
.lz-footer-bottom{
  padding-top: 26px;
  display:flex;
  flex-direction: column;
  align-items:center;
  gap: 18px;
}
.lz-footer-brand img{
  height: 42px;
  width: auto;
}
.lz-footer-nav{
  display:flex;
  gap: 28px;
  flex-wrap: wrap;
  justify-content:center;
}
.lz-footer-nav a{
  color: rgba(255,255,255,.78);
  font-weight: 700;
}
.lz-footer-nav a:hover{
  color: #fff;
}
.lz-footer-legal{
  text-align:center;
  color: rgba(255,255,255,.58);
  font-size: 12px;
  line-height: 1.45;
}

@media (max-width: 960px){
  .lz-hero-inner{ grid-template-columns: 1fr; padding: 14px 0 46px; }
  .lz-hero h1{ font-size: 44px; }
  .lz-header-right{ gap: 10px; }
  .lz-hero-art{ justify-content: center; }
  .lz-hero-art img{ max-height: 420px; }
  .lz-hero-copy{ padding-top: 24px; }
  .lz-section{ padding: 52px 0; }
  .lz-feature-grid{ grid-template-columns: repeat(2, 1fr); }
  .lz-section-title{ font-size: 28px; text-align: left; }
  .lz-promo-card{ grid-template-columns: 1fr; padding: 26px 22px; }
  .lz-promo-title{ font-size: 34px; }
  .lz-promo-art{ justify-content:flex-start; }
  .lz-promo-art img{ width: 260px; }
  .lz-split{ grid-template-columns: 1fr; gap: 18px; }
  .lz-split-title{ font-size: 34px; }
  .lz-split-art{ justify-content:flex-start; }
  .lz-split-art img{ width: 280px; }
  .lz-packages-grid{ grid-template-columns: 1fr; }
  .lz-plan-name{ font-size: 34px; }
  .lz-plan-price-now{ font-size: 40px; }
  .lz-start-grid{ grid-template-columns: 1fr; }
  .lz-start-title{ font-size: 40px; }
  .lz-step-title{ font-size: 28px; }
  .lz-split-card{ padding: 26px 22px; }
  .lz-step{ grid-template-columns: 44px 1fr; align-items: start; }
  .lz-step-art{ grid-column: 1 / -1; justify-content: flex-start; margin-top: 10px; }
  .lz-step-ico{ width: 180px; }
  .lz-footer-cols{ grid-template-columns: 1fr; }
}
@media (max-width: 520px){
  .lz-logo img{ height: 38px; }
  .lz-hero h1{ font-size: 36px; }
  .lz-phone{ display:none; }
  .lz-feature-grid{ grid-template-columns: 1fr; }
  .lz-feature-card{ min-height: unset; }
  .lz-promo-title{ font-size: 30px; }
  .lz-promo-text{ font-size: 16px; }
}