/* A compact version of the article hero, shared by catalog and home previews. */
.views-row:has(> .material-preview) + .views-row { margin-top: 26px; }
.view-content:has(.material-preview) { grid-template-columns: minmax(0, 1fr); }
#journal .draft-line { margin-bottom: 26px; }
.material-preview { --preview-paper: #fff; width: 100%; }
.material-preview__link {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: 420px;
  background: var(--preview-paper);
}
.material-preview__visual,
.material-preview__wash {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}
.material-preview__visual .field,
.material-preview__visual .field__item { height: 100%; }
.material-preview__visual img {
  width: 72%;
  height: 100%;
  margin-left: auto;
  object-fit: cover;
  object-position: center 12%;
  transition: transform .35s ease;
  transform-origin: 65% 40%;
}
/* This cover has its subject farther left than the rest of the photo series. */
@media (min-width: 761px) {
  .material-preview__visual img[src*="/chto-takoe-psihosomatika-cover."] {
    position: relative;
    left: 9%;
    mask-image: linear-gradient(90deg, transparent, #000 20%);
  }
}
.material-preview__wash {
  background: linear-gradient(90deg, #fff 0%, #fff 25%, rgb(255 255 255 / .97) 34%, rgb(255 255 255 / .82) 44%, rgb(255 255 255 / .38) 57%, transparent 74%);
}
.material-preview__copy {
  width: 60%;
  padding: 34px 38px 36px;
}
.material-preview__meta {
  margin-bottom: 19px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--clay);
}
.material-preview__meta > span { padding: 0 5px; }
.material-preview__title {
  max-width: 440px;
  font-size: clamp(29px, 2.8vw, 38px);
  line-height: 1.12;
  letter-spacing: -.035em;
  overflow-wrap: break-word;
  transition: color .18s ease;
}
.material-preview__subtitle {
  display: block;
  margin-top: 12px;
  font-size: .68em;
  line-height: 1.23;
  letter-spacing: -.015em;
  font-style: italic;
  color: var(--clay);
}
.material-preview__excerpt {
  max-width: 445px;
  margin-top: 20px;
  font-size: 14px;
  line-height: 1.75;
  color: #536158;
}
.material-preview__read {
  display: inline-flex;
  align-items: center;
  gap: 34px;
  padding: 10px 0;
  margin-top: 15px;
  border-bottom: 1px solid #aeb8ad;
  font-size: 11px;
}
.material-preview__read > span { font-size: 17px; }
.material-preview__link:hover .material-preview__title { color: var(--clay); }
.material-preview__link:hover .material-preview__visual img { transform: scale(1.025); }
.material-preview__link:focus-visible { outline-offset: 4px; }
.material-preview__art { inset-inline-start: 35%; }
.material-preview__art span { left: 30%; top: 21%; width: 200px; height: 210px; }
.material-preview__art i { left: 48%; top: 37%; width: 160px; height: 180px; }
.material-preview__art.art-body::after { left: 47%; top: 41%; width: 90px; height: 90px; }
.material-preview__art.art-pause i { width: 100%; height: 45%; left: 0; top: 64%; }
.material-preview__art.art-meeting span,
.material-preview__art.art-meeting i { height: 130px; }
@media (max-width: 1000px) {
  .material-preview__copy { width: 63%; padding: 30px; }
  .material-preview__title { font-size: 31px; }
  .material-preview__wash {
    background: linear-gradient(90deg, #fff 0%, #fff 23%, rgb(255 255 255 / .97) 35%, rgb(255 255 255 / .84) 48%, rgb(255 255 255 / .32) 66%, transparent 83%);
  }
}
@media (max-width: 760px) {
  .views-row:has(> .material-preview) + .views-row { margin-top: 22px; }
  .material-preview__link { min-height: 0; }
  .material-preview__copy { width: 100%; padding: 205px 23px 25px; }
  .material-preview__visual { bottom: auto; height: 295px; }
  .material-preview__visual img { width: 100%; object-position: center 15%; }
  .material-preview__wash {
    background: linear-gradient(180deg, transparent 0, rgb(255 255 255 / .04) 110px, rgb(255 255 255 / .78) 205px, #fff 290px);
  }
  .material-preview__meta { margin-bottom: 15px; font-size: 9px; }
  .material-preview__title { font-size: 29px; }
  .material-preview__subtitle { font-size: .7em; }
  .material-preview__excerpt { margin-top: 18px; font-size: 13px; line-height: 1.75; }
  .material-preview__read { margin-top: 13px; }
  .material-preview__art { inset-inline-start: 0; }
  .material-preview--illustrated .material-preview__copy { padding-top: 110px; }
  .material-preview--illustrated .material-preview__visual { height: 210px; }
  .material-preview--illustrated .material-preview__wash {
    background: linear-gradient(180deg, rgb(255 255 255 / .12), rgb(255 255 255 / .85) 110px, #fff 205px);
  }
}