.sano-breadcrumb {
  background: #ffffff;
  color: #0b1b2b;
  container-name: sano-breadcrumb;
  container-type: inline-size;
  font-family: "Beaufort Classic", sans-serif;
  width: 100vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.sano-breadcrumb, .sano-breadcrumb * { box-sizing: border-box; }
.sano-breadcrumb__inner { display: flex; align-items: center; gap: 10px; list-style: none; margin: 0 auto; max-width: 1140px; padding: 32px 0 0; }
.sano-breadcrumb__item { color: #5a6472; font-size: 16px; font-weight: 400; line-height: 1.55; }
.sano-breadcrumb__item + .sano-breadcrumb__item::before { content: "/"; color: #8a93a0; margin-right: 10px; }
.sano-breadcrumb__item--current { color: #0b1b2b; font-weight: 600; }
.sano-breadcrumb a { color: inherit; text-decoration: none; }
.sano-breadcrumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sano-breadcrumb a:focus-visible { outline: 3px solid #433da5; outline-offset: 3px; }
@container sano-breadcrumb (max-width: 1139px) { .sano-breadcrumb__inner { padding-inline: 24px; } }
@container sano-breadcrumb (max-width: 767px) { .sano-breadcrumb__inner { padding-inline: 32px; } }
@supports not (container-type: inline-size) {
  @media (max-width: 1139px) { .sano-breadcrumb__inner { padding-inline: 24px; } }
  @media (max-width: 767px) { .sano-breadcrumb__inner { padding-inline: 32px; } }
}

/* Mobile spacing and text containment, 2026-09-29. */
@media (max-width: 767px) {
  .sano-breadcrumb__inner { padding-top: 16px; padding-inline: 16px; }
}
