/* Shop title (TODO 00001.5.14). FINAL design/shop/inspiration/sections/title/r4/f1.png.
   Breadcrumb (section 8), H1 and lead on one row with the margin rule's lead variant (2px navy rule left of the
   lead), then the category index: label caps links between two 1px line hairlines, the current one navy 700
   on a 2px navy bar standing on the lower hairline (section 7). White ground, navy and slate only. */
.p-shop-title {
  box-sizing: border-box; background: var(--wp--preset--color--white);
  padding: var(--wp--preset--spacing--100) var(--wp--custom--gutter--desktop) 0;
}
.p-shop-title *, .p-shop-title *::before, .p-shop-title *::after { box-sizing: border-box; }
.p-shop-title__inner { max-width: var(--wp--custom--layout--wide); margin-inline: auto; }
.p-shop-title .p-shop-title__crumbs, .p-shop-title .woocommerce-breadcrumb {
  margin: 0; color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.5;
}
.p-shop-title .woocommerce-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; row-gap: var(--wp--preset--spacing--20); }
.p-shop-title .woocommerce-breadcrumb a {
  color: var(--wp--preset--color--slate); text-decoration: none; text-underline-offset: 3px;
}
.p-shop-title .norvane-crumb-sep { display: inline-flex; margin-inline: var(--wp--preset--spacing--30); color: var(--wp--preset--color--slate); }
.p-shop-title__head { display: flex; align-items: center; gap: var(--wp--preset--spacing--90); margin-top: var(--wp--preset--spacing--70); }
.p-shop-title .p-shop-title__h1 {
  flex: 0 1 auto; margin: 0; color: var(--wp--preset--color--navy);
  font-size: var(--wp--preset--font-size--h-1); font-weight: var(--wp--custom--font-weight--h-1);
  letter-spacing: var(--wp--custom--letter-spacing--h-1); line-height: 1.1;
}
.p-shop-title__lead {
  flex: 0 1 34rem; margin: 0 0 0 auto; padding-left: var(--wp--preset--spacing--60);
  border-left: 2px solid var(--wp--preset--color--navy);
  color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--body-l); line-height: 1.6;
}
.p-shop-title__index {
  margin-top: var(--wp--preset--spacing--80);
  border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line);
}
.p-shop-title__index ul { display: flex; gap: var(--wp--preset--spacing--90); margin: 0; padding: 0; list-style: none; }
.p-shop-title__index li { flex: none; }
.p-shop-title__index a {
  position: relative; display: flex; align-items: center; min-height: var(--wp--custom--control);
  padding-inline: var(--wp--preset--spacing--50);
  color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--label);
  font-weight: var(--wp--custom--font-weight--label); letter-spacing: var(--wp--custom--letter-spacing--label);
  line-height: 1.3; text-transform: uppercase; text-decoration: none;
}
.p-shop-title__index a[aria-current="page"] { color: var(--wp--preset--color--navy); font-weight: 700; }
.p-shop-title__index a[aria-current="page"]::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--wp--preset--color--navy);
}
.p-shop-title a:focus-visible {
  outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--orange); outline-offset: var(--wp--custom--focus--offset);
}
.p-shop-title__index a:focus-visible { outline-offset: calc(-1 * var(--wp--custom--focus--width)); }
@media (hover: hover) and (pointer: fine) {
  .p-shop-title .woocommerce-breadcrumb a:hover { text-decoration: underline; }
  .p-shop-title__index a:not([aria-current]):hover { color: var(--wp--preset--color--navy); }
}
@media (max-width: 991.98px) {
  .p-shop-title { padding: var(--wp--preset--spacing--90) var(--wp--custom--gutter--tablet) 0; }
  .p-shop-title__head { flex-direction: column; align-items: flex-start; gap: var(--wp--preset--spacing--50); margin-top: var(--wp--preset--spacing--60); }
  .p-shop-title__lead { flex: none; max-width: 40rem; margin: 0; padding-left: 0; border-left: 0; }
  .p-shop-title__index { margin-top: var(--wp--preset--spacing--70); }
  .p-shop-title__index ul { gap: var(--wp--preset--spacing--60); overflow-x: auto; scrollbar-width: none; }
  .p-shop-title__index ul::-webkit-scrollbar { display: none; }
}
@media (max-width: 599.98px) {
  .p-shop-title { padding: var(--wp--preset--spacing--80) var(--wp--custom--gutter--phone) 0; }
  .p-shop-title__index ul { gap: var(--wp--preset--spacing--40); }
}