/* v7: a single slim breadcrumb strip follows the header on every inner page. */
body > .site-crumbs {
  position: relative;
  z-index: 2;
  width: 100%;
  min-height: 15px;
  background: rgba(19, 43, 66, .5);
  color: #fff;
  font: 500 11px/15px Golos, 'Golos Text', sans-serif;
}
body > .site-crumbs .site-crumbs__inner {
  box-sizing: border-box;
  max-width: 1640px;
  min-height: 15px;
  height: auto;
  margin: 0 auto;
  padding: 0 var(--space);
  display: flex;
  align-items: center;
}
body > .site-crumbs ol {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 6px;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
}
body > .site-crumbs li { min-width: 0; max-width: 100%; gap: 6px; }
body > .site-crumbs li + li::before { color: #fff; }
body > .site-crumbs :is(a, [aria-current='page']) {
  color: #fff;
  overflow-wrap: anywhere;
}
body > .site-crumbs a:hover { color: #fff; }
body > .site-crumbs a:focus-visible { outline-color: #fff; }

/* The cookies template deliberately uses a narrower header than other pages. */
body:has(.pp-cookies-header) > .site-crumbs .site-crumbs__inner {
  width: calc(100% - 40px);
  max-width: 1120px;
}

/* Three older templates repeat the path inside the hero. Keep those layout
   slots invisible so the global BreadcrumbList is the only visible path. */
main .articles-breadcrumb,
main .cashback-breadcrumb,
main.pp-cookies-main > nav[aria-label='Путь'] { visibility: hidden; }

@media (max-width: 600px) {
  body > .site-crumbs { min-height: 24px; font-size: 11px; line-height: 15px; }
  body > .site-crumbs .site-crumbs__inner { min-height: 24px; padding-block: 4px; }
}

/* Review candidate for the public v7 DOM; load after existing styles. */
:root {
  --crumb-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='m9 18 6-6-6-6' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

body > .site-crumbs,
.case-v3 .case-breadcrumb-strip {
  position: relative;
  z-index: 30;
  box-sizing: border-box;
  width: 100%;
  height: 0;
  min-height: 0;
  background: transparent;
  color: #21364c;
  font: 500 13px/18px Golos, 'Golos Text', sans-serif;
}

body > .site-crumbs .site-crumbs__inner,
.case-v3 .case-breadcrumb-strip .rev-breadcrumb.wrap {
  position: absolute;
  top: 16px;
  inset-inline: 0;
  box-sizing: border-box;
  width: 100%;
  max-width: 1640px;
  min-height: 0;
  height: auto;
  margin: 0 auto;
  padding: 0 var(--space);
  background: transparent;
  border: 0;
  border-radius: 0;
}

body > .site-crumbs ol,
.case-v3 .case-breadcrumb-strip .rev-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 9px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding-block: 0;
  background: transparent;
  font: inherit;
  line-height: 18px;
}

body > .site-crumbs li,
.case-v3 .case-breadcrumb-strip [itemprop='itemListElement'] {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  gap: 0;
}

body > .site-crumbs li + li::before,
.case-v3 .case-breadcrumb-strip [itemprop='itemListElement'] ~ [itemprop='itemListElement']::before {
  content: '';
  display: inline-block;
  flex: none;
  width: 10px;
  height: 10px;
  margin-right: 9px;
  background: #839bb0;
  -webkit-mask: var(--crumb-chevron) center / contain no-repeat;
  mask: var(--crumb-chevron) center / contain no-repeat;
}

.case-v3 .case-breadcrumb-strip [aria-hidden='true'] { display: none; }

body > .site-crumbs :is(a, [aria-current='page']),
.case-v3 .case-breadcrumb-strip .rev-breadcrumb :is(a, [aria-current='page']) {
  color: #21364c;
  text-decoration: none;
  overflow-wrap: normal;
}

body > .site-crumbs [aria-current='page'],
.case-v3 .case-breadcrumb-strip [aria-current='page'] { color: #63778a !important; }

body > .site-crumbs a:hover,
.case-v3 .case-breadcrumb-strip a:hover { color: #236fb5 !important; text-decoration: underline; text-underline-offset: 3px; }

body > .site-crumbs a:focus-visible,
.case-v3 .case-breadcrumb-strip a:focus-visible {
  outline: 2px solid #4999fd;
  outline-offset: 3px;
  border-radius: 2px;
}

/* These first screens have dark hero backgrounds; no box is drawn on them. */
body:is(.page-china, .page-cashback, .page-clinics) > .site-crumbs :is(a, [aria-current='page']) {
  color: #fff !important;
  text-shadow: 0 1px 5px rgba(10, 28, 44, .35);
}
body:is(.page-china, .page-cashback, .page-clinics) > .site-crumbs [aria-current='page'] { opacity: .76; }
body:is(.page-china, .page-cashback, .page-clinics) > .site-crumbs li + li::before { background: rgba(255, 255, 255, .8); }
body:is(.page-china, .page-cashback, .page-clinics) > .site-crumbs a:hover { color: #b9dbfb !important; }

@media (max-width: 600px) {
  body > .site-crumbs,
  .case-v3 .case-breadcrumb-strip { height: 0; min-height: 0; font-size: 13px; line-height: 18px; }
  body > .site-crumbs .site-crumbs__inner,
  .case-v3 .case-breadcrumb-strip .rev-breadcrumb.wrap { top: 13px; min-height: 0; padding-block: 0; }
  body > .site-crumbs ol,
  .case-v3 .case-breadcrumb-strip .rev-breadcrumb { gap: 2px 7px; line-height: 18px; }
  body > .site-crumbs li + li::before,
  .case-v3 .case-breadcrumb-strip [itemprop='itemListElement'] ~ [itemprop='itemListElement']::before { margin-right: 7px; }
  .page-dentistry .brand-service-hero > .wrap { padding-top: 10px; }
}

@media (max-width: 374px) {
  .page-dentistry .brand-service-hero > .wrap { padding-top: 26px; }
}

/* Keep wrapped three-step crumbs clear of the service eyebrow. */
@media (max-width: 760px) {
  body.page-blepharoplasty .brand-service-hero-copy,
  body.page-manual-therapy .brand-service-hero-copy { padding-top: 60px; }
}