.insight {
  --insight-paper:#f1eee5;
  --insight-ink:#121313;
  --insight-muted:#5c5b57;
  --insight-coral:#ff5f3c;
  --insight-coral-soft:#ffc6b5;
  --insight-lime:#c4ec24;
  --insight-compare-shift:0px;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:max(820px,100svh);
  color:var(--insight-ink);
  background:var(--insight-paper)
}

.insight:before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:
    radial-gradient(circle at 82% 55%,rgba(255,255,255,.5),transparent 24%),
    linear-gradient(100deg,rgba(250,248,241,.18),rgba(228,224,212,.12));
  pointer-events:none
}

.insight__atmosphere {
  position:absolute;
  z-index:-2;
  inset:0
}

.insight__atmosphere img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  opacity:.88
}

.insight__frame {
  position:relative;
  width:min(1680px,100%);
  min-height:max(820px,100svh);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-template-rows:auto 1fr auto auto;
  column-gap:clamp(16px,1.55vw,28px);
  padding:clamp(34px,3vw,52px) clamp(34px,3.1vw,52px) 24px
}

.insight__intro {
  position:relative;
  z-index:5;
  grid-column:1/8;
  grid-row:1;
  min-width:0
}

.insight__meta {
  min-height:34px
}

.insight__eyebrow {
  margin:0;
  color:var(--insight-coral);
  font-size:clamp(10px,.9vw,14px);
  line-height:1;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase
}

.insight__readtime {
  position:absolute;
  left:calc(100% + 20vw);
  top:20px;
  width:190px;
  display:flex;
  align-items:center;
  gap:16px
}

.insight__readtime strong {
  display:grid;
  place-items:center;
  flex:0 0 74px;
  height:74px;
  border:2px solid var(--insight-coral);
  border-radius:50%;
  font-family:Oswald,Manrope,sans-serif;
  font-size:43px;
  line-height:1;
  font-weight:600
}

.insight__readtime span,
.insight__readtime b {
  display:block
}

.insight__readtime span {
  font-size:15px;
  line-height:1.25
}

.insight__readtime b {
  margin-bottom:3px;
  color:var(--insight-coral);
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase
}

.insight h2 {
  width:120%;
  margin:25px 0 0;
  transform:scaleX(.83);
  transform-origin:left top;
  font-family:Oswald,Manrope,sans-serif;
  font-size:clamp(94px,10.3vw,165px);
  line-height:.92;
  letter-spacing:-.055em;
  font-weight:700;
  text-transform:none
}

.insight h2 span {
  display:block;
  white-space:nowrap
}

.insight__lead {
  max-width:470px;
  margin:12px 0 0;
  font-size:clamp(18px,1.7vw,27px);
  line-height:1.22;
  letter-spacing:-.035em
}

.insight__lead strong {
  color:var(--insight-coral)
}

.insight__audience {
  z-index:5;
  grid-column:11/13;
  grid-row:1;
  align-self:start;
  margin:66px 0 0;
  padding-top:18px;
  color:#565651;
  border-top:1px solid rgba(18,19,19,.22);
  font-size:10px;
  line-height:1.45;
  letter-spacing:.08em;
  text-transform:uppercase
}

.insight__audience:after {
  content:"";
  display:block;
  width:28px;
  height:1px;
  margin-top:25px;
  background:var(--insight-coral)
}

.insight-compare {
  position:absolute;
  z-index:3;
  left:3%;
  top:calc(42% + 24px + var(--insight-compare-shift));
  width:92%;
  height:max(140px,calc(212px - var(--insight-compare-shift)));
  transform:rotate(-5.5deg);
  transform-origin:center;
  pointer-events:none
}

.insight-compare__rail {
  height:100%;
  display:grid;
  grid-template-columns:minmax(0,53%) minmax(170px,15%) minmax(0,32%);
  filter:drop-shadow(0 17px 18px rgba(76,63,41,.11))
}

.insight-compare__channel,
.insight-compare__delta {
  position:relative;
  min-width:0;
  border-top:1px solid rgba(18,19,19,.2);
  border-bottom:1px solid rgba(18,19,19,.2)
}

.insight-compare__channel {
  display:grid;
  align-items:center;
  gap:26px;
  padding:26px 4vw
}

.insight-compare__channel--direct {
  grid-template-columns:130px minmax(0,1fr);
  padding-left:calc(4vw + 60px);
  background:linear-gradient(90deg,rgba(255,91,56,.96),rgba(255,132,100,.68))
}

.insight-compare__channel--avito {
  grid-template-columns:minmax(90px,.72fr) minmax(130px,1fr);
  background:linear-gradient(90deg,rgba(208,239,53,.68),rgba(201,235,49,.84) 58%,rgba(224,242,140,.5))
}

.insight-compare__copy b,
.insight-compare__copy span {
  display:block
}

.insight-compare__copy b {
  font-size:20px;
  line-height:1
}

.insight-compare__copy span {
  margin-top:6px;
  font-size:10px
}

.insight-compare__bar {
  display:block;
  height:42px;
  border-radius:13px;
  transform-origin:left center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22)
}

.insight-compare__channel--direct .insight-compare__bar {
  width:90%;
  background:linear-gradient(90deg,#ff6b49,#e84c2d)
}

.insight-compare__channel--avito .insight-compare__bar {
  width:58%;
  background:linear-gradient(90deg,#a9d900,#8fbd00)
}

.insight-compare__delta {
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:rgba(244,241,232,.92);
  border-inline:1px solid rgba(18,19,19,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7)
}

.insight-compare__delta strong,
.insight-compare__delta span {
  display:block
}

.insight-compare__delta strong {
  font-family:Oswald,Manrope,sans-serif;
  font-size:clamp(62px,6vw,96px);
  font-weight:700;
  line-height:.82;
  letter-spacing:-.06em
}

.insight-compare__delta span {
  margin-top:11px;
  font-size:11px
}

.insight-compare__medallions {
  position:absolute;
  z-index:4;
  right:6%;
  top:-118px;
  width:400px;
  height:400px;
  object-fit:cover;
  mix-blend-mode:multiply;
  -webkit-mask-image:radial-gradient(ellipse 58% 72% at 73% 51%,#000 34%,rgba(0,0,0,.78) 56%,transparent 80%);
  mask-image:radial-gradient(ellipse 58% 72% at 73% 51%,#000 34%,rgba(0,0,0,.78) 56%,transparent 80%);
  opacity:.95;
  filter:contrast(1.02)
}

.insight__points {
  z-index:6;
  grid-column:1/8;
  grid-row:3;
  align-self:end;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  min-height:178px;
  margin:0;
  padding:20px 26px;
  border:1px solid rgba(255,255,255,.9);
  border-radius:0 16px 0 0;
  background:rgba(247,244,236,.7);
  box-shadow:0 14px 35px rgba(66,57,42,.08),inset 0 1px 0 rgba(255,255,255,.72);
  -webkit-backdrop-filter:blur(17px);
  backdrop-filter:blur(17px)
}

.insight__points li {
  position:relative;
  min-width:0;
  padding:0 24px;
  border-right:1px solid rgba(18,19,19,.2);
  transition:transform .2s ease
}

.insight__points li:first-child {
  padding-left:0
}

.insight__points li:last-child {
  padding-right:0;
  border-right:0
}

.insight__points li:hover {
  transform:translateY(-2px)
}

.insight__points li>span {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  margin-bottom:14px;
  border:1px solid var(--insight-coral);
  border-radius:50%;
  color:var(--insight-coral);
  font-family:Oswald,Manrope,sans-serif;
  font-size:15px;
  font-weight:600
}

.insight__points h3 {
  margin:0 0 9px;
  font-size:15px;
  line-height:1.1;
  letter-spacing:-.035em
}

.insight__points p {
  margin:0;
  color:#4f4e4a;
  font-size:9px;
  line-height:1.55
}

.insight__points li>i {
  display:none
}

.insight__cta {
  position:relative;
  z-index:7;
  grid-column:9/13;
  grid-row:3;
  align-self:end;
  min-height:154px;
  display:grid;
  grid-template-columns:82px minmax(0,1fr) 48px;
  align-items:center;
  gap:24px;
  padding:22px 26px 18px 22px;
  color:var(--insight-ink);
  text-decoration:none;
  border:1px solid rgba(255,255,255,.95);
  border-radius:12px;
  background:rgba(248,246,240,.82);
  box-shadow:0 16px 30px rgba(65,56,42,.16),inset 0 1px 0 white;
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
  transition:transform .2s ease,box-shadow .2s ease
}

.insight__cta:after {
  content:"";
  position:absolute;
  left:22px;
  right:22px;
  bottom:16px;
  height:1px;
  background:rgba(18,19,19,.25)
}

.insight__cta:hover {
  transform:translateY(-2px);
  box-shadow:0 21px 42px rgba(65,56,42,.19),inset 0 1px 0 white
}

.insight__cta:focus-visible {
  outline:3px solid var(--insight-coral);
  outline-offset:4px
}

.insight__telegram {
  display:grid;
  place-items:center;
  width:76px;
  height:76px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#ff6e49,#ff4f2e)
}

.insight__telegram svg {
  width:42px;
  height:42px;
  fill:currentColor
}

.insight__cta>span:nth-child(2) b,
.insight__cta>span:nth-child(2) small {
  display:block;
  font-family:Oswald,Manrope,sans-serif;
  font-size:clamp(22px,2.05vw,33px);
  font-weight:700;
  line-height:.95;
  letter-spacing:-.045em
}

.insight__cta>span:nth-child(2) small {
  font-weight:700
}

.insight__cta>i {
  font-size:38px;
  line-height:1;
  font-style:normal;
  transition:transform .2s ease
}

.insight__cta:hover>i {
  transform:translateX(4px)
}

.insight__footer {
  z-index:6;
  grid-column:1/13;
  grid-row:4;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  min-height:44px;
  padding-top:16px;
  border-bottom:1px solid rgba(18,19,19,.24);
  color:#5a5955;
  font-size:7px;
  letter-spacing:.2em;
  text-transform:uppercase
}

@media (max-width:1180px) and (min-width:901px) {
  .insight__frame {
    padding:30px 28px 20px
  }

  .insight h2 {
    margin-top:18px;
    font-size:112px
  }

  .insight__lead {
    font-size:20px
  }

  .insight__readtime {
    left:calc(100% + 16vw)
  }

  .insight-compare {
    left:2%;
    top:calc(40% + 24px + var(--insight-compare-shift));
    width:96%;
    height:max(140px,calc(174px - var(--insight-compare-shift)))
  }

  .insight-compare__rail {
    grid-template-columns:minmax(0,51%) minmax(150px,17%) minmax(0,32%)
  }

  .insight-compare__channel {
    gap:16px;
    padding-inline:3vw
  }

  .insight-compare__channel--direct {
    grid-template-columns:100px minmax(0,1fr);
    padding-left:calc(3vw + 55px)
  }

  .insight-compare__medallions {
    right:0;
    top:-115px;
    width:350px;
    height:350px
  }

  .insight__points {
    grid-column:1/9;
    min-height:152px;
    padding:16px 18px
  }

  .insight__points li {
    padding-inline:14px
  }

  .insight__points h3 {
    font-size:13px
  }

  .insight__points p {
    font-size:8px
  }

  .insight__cta {
    grid-column:9/13;
    min-height:142px;
    grid-template-columns:62px minmax(0,1fr) 30px;
    gap:13px;
    padding:18px
  }

  .insight__telegram {
    width:60px;
    height:60px
  }

  .insight__telegram svg {
    width:33px;
    height:33px
  }
}

@media (max-width:900px) {
  .insight {
    min-height:0
  }

  .insight:before {
    background:linear-gradient(rgba(247,244,236,.18),rgba(237,232,220,.08))
  }

  .insight__atmosphere img {
    opacity:.92
  }

  .insight__frame {
    min-height:0;
    display:block;
    padding:34px clamp(18px,5vw,38px) 30px
  }

  .insight__intro {
    display:block
  }

  .insight__meta {
    min-height:72px;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px
  }

  .insight__eyebrow {
    padding-top:15px;
    font-size:11px
  }

  .insight__readtime {
    position:static;
    width:auto;
    flex:0 0 auto;
    gap:10px
  }

  .insight__readtime strong {
    flex-basis:58px;
    height:58px;
    font-size:34px
  }

  .insight__readtime span {
    padding-top:7px;
    font-size:11px
  }

  .insight__readtime b {
    font-size:10px
  }

  .insight h2 {
    width:112.5%;
    margin:25px 0 0;
    transform:scaleX(.889);
    transform-origin:left top;
    font-size:clamp(75px,17vw,128px);
    line-height:.94;
    letter-spacing:-.06em
  }

  .insight h2 span {
    white-space:normal
  }

  .insight__lead {
    max-width:620px;
    margin-top:23px;
    font-size:clamp(23px,5.8vw,34px);
    line-height:1.22
  }

  .insight__audience {
    display:none
  }

  .insight-compare {
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:auto;
    min-height:448px;
    margin-top:36px;
    overflow:hidden;
    transform:none;
    border:1px solid rgba(255,255,255,.9);
    border-radius:20px;
    background:rgba(248,245,237,.7);
    box-shadow:0 18px 34px rgba(68,58,43,.18),inset 0 1px 0 white;
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px)
  }

  .insight-compare__rail {
    position:relative;
    z-index:2;
    height:auto;
    display:flex;
    flex-direction:column;
    filter:none
  }

  .insight-compare__channel,
  .insight-compare__delta {
    border-inline:0;
    border-top:1px dashed rgba(18,19,19,.22);
    border-bottom:0
  }

  .insight-compare__delta {
    order:-1;
    min-height:166px;
    align-items:flex-start;
    padding:26px 24px;
    background:rgba(248,245,237,.56)
  }

  .insight-compare__delta strong {
    font-size:94px
  }

  .insight-compare__delta span {
    margin-top:8px;
    font-size:15px
  }

  .insight-compare__channel {
    min-height:135px;
    display:grid;
    grid-template-columns:minmax(130px,.7fr) minmax(0,1fr);
    gap:12px;
    padding:22px 24px
  }

  .insight-compare__channel--direct {
    padding-left:24px;
    background:linear-gradient(90deg,rgba(255,161,137,.34),rgba(255,187,169,.18))
  }

  .insight-compare__channel--avito {
    background:linear-gradient(90deg,rgba(212,239,80,.28),rgba(219,240,116,.16))
  }

  .insight-compare__channel--avito .insight-compare__copy {
    order:-1
  }

  .insight-compare__copy b {
    font-size:22px
  }

  .insight-compare__copy span {
    font-size:10px
  }

  .insight-compare__bar {
    height:46px
  }

  .insight-compare__channel--direct .insight-compare__bar {
    width:92%
  }

  .insight-compare__channel--avito .insight-compare__bar {
    width:44%
  }

  .insight-compare__medallions {
    z-index:3;
    right:0;
    top:92px;
    width:325px;
    height:325px;
    transform:none;
    opacity:.93
  }

  .insight__points {
    display:block;
    min-height:0;
    margin-top:30px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    -webkit-backdrop-filter:none;
    backdrop-filter:none
  }

  .insight__points li,
  .insight__points li:first-child,
  .insight__points li:last-child {
    min-height:130px;
    display:grid;
    grid-template-columns:76px minmax(0,1fr) 26px;
    align-items:center;
    gap:17px;
    padding:21px 6px;
    border-right:0;
    border-bottom:1px solid rgba(18,19,19,.28)
  }

  .insight__points li:last-child {
    border-bottom:0
  }

  .insight__points li:hover {
    transform:none
  }

  .insight__points li>span {
    width:62px;
    height:62px;
    margin:0;
    border-width:2px;
    font-size:25px
  }

  .insight__points h3 {
    margin-bottom:8px;
    font-size:21px
  }

  .insight__points p {
    max-width:560px;
    font-size:13px;
    line-height:1.5
  }

  .insight__points li>i {
    display:block;
    font-family:Manrope,Arial,sans-serif;
    font-size:46px;
    line-height:1;
    font-weight:400;
    font-style:normal
  }

  .insight__cta {
    position:relative;
    min-height:104px;
    display:grid;
    grid-template-columns:74px minmax(0,1fr) 24px;
    gap:18px;
    margin-top:20px;
    padding:15px 22px 15px 15px;
    color:#fff;
    border:1px solid rgba(255,255,255,.48);
    border-radius:14px;
    background:linear-gradient(105deg,#ff6845,#ff4e2d);
    box-shadow:0 15px 28px rgba(171,65,39,.23),inset 0 1px 0 rgba(255,255,255,.35)
  }

  .insight__cta:after {
    display:none
  }

  .insight__telegram {
    width:70px;
    height:70px;
    border:2px solid #fff;
    background:rgba(255,255,255,.04)
  }

  .insight__telegram svg {
    width:38px;
    height:38px
  }

  .insight__cta>span:nth-child(2) b,
  .insight__cta>span:nth-child(2) small {
    display:inline;
    font-size:clamp(22px,5.4vw,34px);
    line-height:1
  }

  .insight__cta>span:nth-child(2) small:before {
    content:" "
  }

  .insight__cta>i {
    font-size:26px
  }

  .insight__footer {
    display:none
  }
}

@media (max-width:520px) {
  .insight__frame {
    padding:28px 18px 24px
  }

  .insight__meta {
    min-height:64px
  }

  .insight__eyebrow {
    max-width:180px;
    font-size:10px
  }

  .insight__readtime strong {
    flex-basis:52px;
    height:52px;
    font-size:30px
  }

  .insight__readtime span {
    font-size:10px
  }

  .insight__readtime b {
    font-size:9px
  }

  .insight h2 {
    margin-top:28px;
    font-size:clamp(69px,18.2vw,86px)
  }

  .insight__lead {
    font-size:23px
  }

  .insight-compare {
    min-height:425px;
    margin-top:30px
  }

  .insight-compare__delta {
    min-height:155px;
    padding:24px 20px
  }

  .insight-compare__delta strong {
    font-size:84px
  }

  .insight-compare__delta span {
    font-size:14px
  }

  .insight-compare__channel {
    min-height:134px;
    grid-template-columns:minmax(120px,.78fr) minmax(0,1fr);
    padding:22px 20px
  }

  .insight-compare__channel--direct {
    padding-left:20px
  }

  .insight-compare__copy b {
    font-size:20px
  }

  .insight-compare__copy span {
    font-size:9px
  }

  .insight-compare__bar {
    height:42px
  }

  .insight-compare__medallions {
    right:0;
    top:83px;
    width:min(74vw,285px);
    height:min(74vw,285px)
  }

  .insight__points {
    margin-top:23px
  }

  .insight__points li,
  .insight__points li:first-child,
  .insight__points li:last-child {
    min-height:126px;
    grid-template-columns:66px minmax(0,1fr) 18px;
    gap:12px;
    padding:18px 2px
  }

  .insight__points li>span {
    width:56px;
    height:56px;
    font-size:22px
  }

  .insight__points h3 {
    font-size:18px
  }

  .insight__points p {
    font-size:11px
  }

  .insight__points li>i {
    font-size:38px
  }

  .insight__cta {
    min-height:94px;
    grid-template-columns:60px minmax(0,1fr);
    gap:14px;
    padding:12px 16px 12px 12px
  }

  .insight__telegram {
    width:58px;
    height:58px
  }

  .insight__telegram svg {
    width:32px;
    height:32px
  }

  .insight__cta>span:nth-child(2) b,
  .insight__cta>span:nth-child(2) small {
    font-size:20px
  }

  .insight__cta>i {
    display:none
  }
}

.insight--motion:not(.is-visible) .insight__eyebrow,
.insight--motion:not(.is-visible) .insight__readtime,
.insight--motion:not(.is-visible) .insight__lead,
.insight--motion:not(.is-visible) .insight__audience,
.insight--motion:not(.is-visible) .insight__points,
.insight--motion:not(.is-visible) .insight__cta {
  opacity:0;
  transform:translateY(18px)
}

.insight--motion:not(.is-visible) h2 span {
  opacity:0;
  transform:translateY(48px);
  clip-path:inset(100% 0 0)
}

.insight--motion:not(.is-visible) .insight-compare {
  opacity:0
}

.insight--motion:not(.is-visible) .insight-compare__bar {
  transform:scaleX(0)
}

.insight--motion .insight__eyebrow,
.insight--motion .insight__readtime,
.insight--motion .insight__lead,
.insight--motion .insight__audience,
.insight--motion .insight__points,
.insight--motion .insight__cta,
.insight--motion h2 span,
.insight--motion .insight-compare,
.insight--motion .insight-compare__bar {
  transition-property:opacity,transform,clip-path;
  transition-duration:.48s;
  transition-timing-function:cubic-bezier(.22,.8,.25,1)
}

.insight--motion h2 span:nth-child(2) {
  transition-delay:.07s
}

.insight--motion .insight__lead,
.insight--motion .insight__readtime {
  transition-delay:.16s
}

.insight--motion .insight-compare {
  transition-delay:.24s
}

.insight--motion .insight-compare__bar {
  transition-duration:.7s;
  transition-delay:.42s
}

.insight--motion .insight__points {
  transition-delay:.55s
}

.insight--motion .insight__cta {
  transition-delay:.64s
}

@media (prefers-reduced-motion:reduce) {
  .insight *,
  .insight *:before,
  .insight *:after {
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important
  }
}