/* Павлово — editorial infographics. All selectors are component-scoped. */
.pvl-visual {
  --pvl-ink: #410818;
  --pvl-orange: #ff803f;
  --pvl-cream: #fff8ee;
  --pvl-paper: #fffdf8;
  --pvl-muted: #6e5053;
  --pvl-line: #e4cec0;
  box-sizing: border-box;
  clear: both;
  margin: 2.5rem 0;
  padding: clamp(22px, 4vw, 48px);
  border: 1px solid var(--pvl-line);
  border-radius: 24px;
  background: var(--pvl-cream);
  color: var(--pvl-ink);
  font-family: 'Geologica', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  text-align: left;
  overflow-wrap: anywhere;
  container-type: inline-size;
}
.pvl-visual *, .pvl-visual *::before, .pvl-visual *::after { box-sizing: border-box; }
.pvl-visual .pvl-visual-header { margin: 0 0 28px; }
.pvl-visual .pvl-visual-eyebrow { margin: 0 0 12px; color: var(--pvl-muted); font-size: 12px; line-height: 1.45; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.pvl-visual .pvl-visual-title { max-width: 880px; margin: 0 0 16px; color: var(--pvl-ink); font-family: inherit; font-size: clamp(25px, 3vw, 40px); font-weight: 700; letter-spacing: -.035em; line-height: 1.14; text-transform: none; }
.pvl-visual .pvl-visual-intro { max-width: 820px; margin: 0; color: var(--pvl-muted); font-size: 16px; line-height: 1.65; }
.pvl-visual .pvl-visual-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.pvl-visual .pvl-visual-card { min-width: 0; position: relative; margin: 0; padding: 24px; border: 1px solid var(--pvl-line); border-radius: 16px; background: var(--pvl-paper); display: flex; flex-direction: column; align-items: flex-start; }
.pvl-visual .pvl-visual-card::marker { content: ''; }
.pvl-visual .pvl-visual-icon-wrap { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 62px; height: 62px; background: #ffe1c9; border-radius: 18px; margin-bottom: 28px; }
.pvl-visual .pvl-visual-icon { display: block; width: 40px; height: 40px; flex: 0 0 auto; color: var(--pvl-ink); }
.pvl-visual .pvl-visual-tag { margin: 0 0 10px; color: var(--pvl-muted); font-size: 12px; font-weight: 700; line-height: 1.5; letter-spacing: .025em; }
.pvl-visual .pvl-visual-card-title { margin: 0 0 12px; color: var(--pvl-ink); font-family: inherit; font-size: clamp(19px, 2vw, 24px); font-weight: 700; letter-spacing: -.025em; line-height: 1.2; text-transform: none; }
.pvl-visual .pvl-visual-card-text { margin: 0 0 18px; color: var(--pvl-muted); font-size: 15px; line-height: 1.65; }
.pvl-visual .pvl-visual-card-text:last-child { margin-bottom: 0; }
.pvl-visual .pvl-visual-link { display: inline-flex; align-items: baseline; gap: 6px; max-width: 100%; min-height: 44px; padding: 10px 0 0; margin-top: auto; color: var(--pvl-ink); font-size: 14px; font-weight: 700; line-height: 1.4; text-decoration: underline; text-decoration-color: var(--pvl-orange); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.pvl-visual a:focus-visible { outline: 3px solid var(--pvl-ink); outline-offset: 5px; border-radius: 2px; }
.pvl-visual a:hover { text-decoration-color: var(--pvl-ink); }
.pvl-visual .pvl-visual-note { margin: 24px 0 0; padding: 16px 0 0 20px; border-left: 3px solid var(--pvl-orange); color: var(--pvl-muted); font-size: 14px; line-height: 1.65; }
.pvl-visual .pvl-visual-sources { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--pvl-line); color: var(--pvl-muted); font-size: 12px; line-height: 1.7; }
.pvl-visual .pvl-visual-sources a { color: var(--pvl-ink); text-decoration: underline; text-underline-offset: 3px; }
.pvl-visual .pvl-visual-source-label { font-weight: 700; }
.pvl-visual .pvl-visual-number { display: block; margin-bottom: 26px; color: var(--pvl-ink); font-size: 38px; font-weight: 700; line-height: 1; letter-spacing: -.06em; }
.pvl-visual--routes .pvl-visual-card:first-child { background: var(--pvl-orange); border-color: var(--pvl-orange); }
.pvl-visual--routes .pvl-visual-card:first-child .pvl-visual-tag,
.pvl-visual--routes .pvl-visual-card:first-child .pvl-visual-card-text { color: var(--pvl-ink); }
.pvl-visual--routes .pvl-visual-card:first-child .pvl-visual-link { text-decoration-color: var(--pvl-ink); }
.pvl-visual--transport .pvl-visual-hub,
.pvl-visual--transport .pvl-visual-destination { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 420px; margin: 0 auto 28px; padding: 18px 24px; border-radius: 99px; border: 1px solid var(--pvl-ink); background: var(--pvl-paper); color: var(--pvl-ink); font-weight: 700; font-size: 18px; text-align: center; line-height: 1.3; }
.pvl-visual--transport .pvl-visual-hub .pvl-visual-icon,
.pvl-visual--transport .pvl-visual-destination .pvl-visual-icon { width: 26px; height: 26px; }
.pvl-visual--transport .pvl-visual-destination { position: relative; margin: 28px auto 0; background: var(--pvl-ink); color: var(--pvl-paper); }
.pvl-visual--transport .pvl-visual-destination .pvl-visual-icon { color: var(--pvl-paper); }
.pvl-visual--transport .pvl-visual-card::before { content: ''; position: absolute; height: 28px; border-left: 1px dashed var(--pvl-line); top: -29px; left: 50%; }
.pvl-visual--transport .pvl-visual-card::after { content: ''; position: absolute; height: 28px; border-left: 1px dashed var(--pvl-line); bottom: -29px; left: 50%; }
.pvl-visual--timeline .pvl-visual-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pvl-visual--timeline .pvl-visual-card { border-top: 4px solid var(--pvl-orange); }
.pvl-visual--timeline .pvl-visual-card-title { font-size: 19px; }
.pvl-visual--care .pvl-visual-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pvl-visual--care .pvl-visual-card-title { font-size: 19px; }
.pvl-visual--process .pvl-visual-grid { gap: 30px; }
.pvl-visual--process .pvl-visual-card:not(:last-child)::after { content: '→'; position: absolute; top: 37px; right: -24px; font-size: 22px; font-weight: 700; color: var(--pvl-ink); }
.pvl-visual--relations .pvl-visual-card { border-top: 4px solid var(--pvl-orange); }
.pvl-visual--evidence .pvl-visual-card:nth-child(2) { border-style: dashed; }
.pvl-visual--evidence .pvl-visual-card:last-child { background: #f0f1dd; border-color: #ced3b5; }
.pvl-visual--evidence .pvl-visual-card:last-child .pvl-visual-icon-wrap { background: #dce3b8; }
.pvl-visual--reading .pvl-visual-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pvl-visual--reading .pvl-visual-card:last-child { grid-column: 1 / -1; background: var(--pvl-ink); }
.pvl-visual--reading .pvl-visual-card:last-child .pvl-visual-tag,
.pvl-visual--reading .pvl-visual-card:last-child .pvl-visual-card-text { color: #e8cfd0; }
.pvl-visual--reading .pvl-visual-card:last-child .pvl-visual-card-title,
.pvl-visual--reading .pvl-visual-card:last-child .pvl-visual-number,
.pvl-visual--reading .pvl-visual-card:last-child .pvl-visual-link { color: var(--pvl-paper); }
.pvl-visual--reading .pvl-visual-card:last-child a:focus-visible { outline-color: var(--pvl-paper); }
/* Article columns can be narrow even on a large screen. */
@container (max-width: 820px) {
  .pvl-visual--timeline .pvl-visual-grid, .pvl-visual--care .pvl-visual-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (max-width: 570px) {
  .pvl-visual .pvl-visual-grid { grid-template-columns: minmax(0, 1fr); }
  .pvl-visual--process .pvl-visual-grid { gap: 28px; }
  .pvl-visual--process .pvl-visual-card:not(:last-child)::after { content: '↓'; top: auto; bottom: -29px; right: calc(50% - 7px); }
  .pvl-visual--transport .pvl-visual-card::before, .pvl-visual--transport .pvl-visual-card::after { display: none; }
}
@media (max-width: 1100px) {
  .pvl-visual--timeline .pvl-visual-grid, .pvl-visual--care .pvl-visual-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pvl-visual .pvl-visual-card { padding: 20px; }
}
@media (max-width: 680px) {
  .pvl-visual { margin: 1.75rem 0; padding: 22px 18px; border-radius: 18px; }
  .pvl-visual .pvl-visual-header { margin-bottom: 22px; }
  .pvl-visual .pvl-visual-title { font-size: 27px; }
  .pvl-visual .pvl-visual-intro { font-size: 15px; }
  .pvl-visual .pvl-visual-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .pvl-visual .pvl-visual-card { padding: 22px; }
  .pvl-visual .pvl-visual-icon-wrap { margin-bottom: 18px; width: 54px; height: 54px; border-radius: 15px; }
  .pvl-visual .pvl-visual-icon { width: 34px; height: 34px; }
  .pvl-visual .pvl-visual-card-title { font-size: 21px; }
  .pvl-visual .pvl-visual-number { margin-bottom: 18px; font-size: 32px; }
  .pvl-visual--timeline .pvl-visual-card { padding-left: 70px; }
  .pvl-visual--timeline .pvl-visual-number { position: absolute; top: 23px; left: 20px; font-size: 28px; }
  .pvl-visual--process .pvl-visual-grid { gap: 28px; }
  .pvl-visual--process .pvl-visual-card:not(:last-child)::after { content: '↓'; top: auto; bottom: -29px; right: calc(50% - 7px); }
  .pvl-visual--transport .pvl-visual-card::before, .pvl-visual--transport .pvl-visual-card::after { display: none; }
  .pvl-visual--transport .pvl-visual-hub { margin-bottom: 18px; }
  .pvl-visual--transport .pvl-visual-destination { margin-top: 18px; }
  .pvl-visual .pvl-visual-source-divider { display: none; }
  .pvl-visual .pvl-visual-sources { align-items: flex-start; flex-direction: column; }
}
@media print {
  .pvl-visual { border-radius: 0; padding: 20px; background: white; }
  .pvl-visual .pvl-visual-card { break-inside: avoid; }
  .pvl-visual .pvl-visual-link { color: var(--pvl-ink); }
}

/* #region PAVLOVO-SEO-27-09 — узкая колонка статьи (571–760px): три карточки в ряд без разрыва слов посередине */
@container (min-width: 571px) and (max-width: 760px) {
  .pvl-visual .pvl-visual-card { padding: 18px; }
  .pvl-visual .pvl-visual-card-title { font-size: 18px; overflow-wrap: normal; word-break: normal; }
  .pvl-visual .pvl-visual-card-text { font-size: 14.5px; }
  .pvl-visual .pvl-visual-icon-wrap { width: 52px; height: 52px; margin-bottom: 20px; }
}
/* #endregion PAVLOVO-SEO-27-09 */

/* #region PAVLOVO-DOVODKA-28-09 — на телефоне «глазки» и метки инфографики 13 px */
@media (max-width: 600px) {
  .pvl-visual .pvl-visual-eyebrow, .pvl-visual .pvl-visual-tag { font-size: 13px; }
}
/* #endregion PAVLOVO-DOVODKA-28-09 */