/* V11 only. Existing Poppins and landing/theme tokens remain the source. */
.v11-journeys,
.v11-selector,
.v11-directory {
 font-family: "Poppins", sans-serif;
 font-weight: 400;
 font-synthesis: none;
 color: var(--text);
 line-height: 1.6;
}
.v11-journeys *,
.v11-selector *,
.v11-directory * {
 box-sizing: border-box;
}
.v11-journeys {
 width: min(1200px, calc(100% - 48px));
 margin: 0 auto;
 background:
  radial-gradient(ellipse at 5% 40%, var(--primary-soft), transparent 65%),
  radial-gradient(ellipse at 100% 50%, var(--success-soft), transparent 65%);
}
.v11-journeys__heading {
 display: grid;
 grid-template-columns: 1.3fr 1fr;
 align-items: center;
 gap: 40px;
 margin-bottom: 32px;
}
.v11-journeys h2 {
 font-size: clamp(32px, 3.4vw, 46px);
 font-weight: 700;
 line-height: 1.2;
 letter-spacing: -0.035em;
 margin: 0;
 max-width: 650px;
}
.v11-journeys h2 span {
 display: block;
 background: var(--brand-gradient);
 background-clip: text;
 -webkit-background-clip: text;
 color: transparent;
}
.v11-journeys p {
 font-size: 16px;
 color: var(--text-muted);
 margin: 0;
}
.v11-journeys__cards {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 24px;
}
.v11-journey {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 padding: 32px;
 border: 1px solid var(--border);
 border-radius: 24px;
 background: var(--surface-solid);
 box-shadow: var(--shadow-sm);
 min-width: 0;
}
.v11-journey__icon {
 display: grid;
 place-items: center;
 width: 52px;
 height: 52px;
 border-radius: 16px;
 background: var(--primary-soft);
 color: var(--primary-strong);
 font-size: 28px;
}
.v11-journey--store .v11-journey__icon {
 background: var(--info-soft);
 color: #2563eb;
}
[data-theme="dark"] .v11-journey--store .v11-journey__icon {
 color: #93c5fd;
}
.v11-journey h3 {
 font-size: 22px;
 font-weight: 700;
 line-height: 1.3;
 margin: 18px 0 12px;
}
.v11-journey > p:not(.v11-journey__support) {
 max-width: 440px;
 min-height: 78px;
}
/* Composition follows usable card width, including two-column tablets. */
.v11-diagram {
 container: v11-art-slot / inline-size;
 width: 100%;
 margin: 24px 0;
 display: grid;
 justify-items: center;
 pointer-events: none;
 user-select: none;
}
.v11-diagram--agenda {
 --v11-art-accent: #6d28d9;
 --v11-art-soft: #ede5fc;
 --v11-art-line: #d7c8ee;
 --v11-art-ink: #302345;
 --v11-art-muted: #655478;
 --v11-art-night: #211b30;
 --v11-art-nightsoft: #382650;
 --v11-art-nightline: #60487e;
 --v11-art-bright: #c9acff;
}
.v11-diagram--store {
 --v11-art-accent: #1d4ed8;
 --v11-art-soft: #e3edff;
 --v11-art-line: #c5d6ef;
 --v11-art-ink: #20324e;
 --v11-art-muted: #506582;
 --v11-art-night: #182336;
 --v11-art-nightsoft: #223a5c;
 --v11-art-nightline: #415d84;
 --v11-art-bright: #a6c9ff;
}
.v11-diagram {
 --v11-art-paper: #fff;
 --v11-art-label: var(--v11-art-accent);
}
[data-theme="dark"] .v11-diagram {
 --v11-art-paper: var(--v11-art-night);
 --v11-art-soft: var(--v11-art-nightsoft);
 --v11-art-line: var(--v11-art-nightline);
 --v11-art-ink: #f2f0fa;
 --v11-art-muted: #c1c8da;
 --v11-art-label: var(--v11-art-bright);
}
.v11-diagram .v11-art {
 display: block;
 width: 100%;
 max-width: 280px;
 height: auto;
}
.v11-diagram .v11-art--desktop {
 display: none;
 max-width: 520px;
}
/* Below 460px the 520px composition would make its small labels illegible. */
@container v11-art-slot (min-width: 460px) {
 .v11-diagram .v11-art--desktop {
  display: block;
 }
 .v11-diagram .v11-art--mobile {
  display: none;
 }
}
.v11-art text {
 font-family: "Poppins", sans-serif;
 font-weight: 400;
 font-synthesis: none;
 fill: var(--v11-art-ink);
}
.v11-art .v11-art__bold {
 font-weight: 700;
}
.v11-art .v11-art__muted {
 fill: var(--v11-art-muted);
}
.v11-art .v11-art__white {
 fill: #fff;
}
.v11-art .v11-art__paper {
 fill: var(--v11-art-paper);
 stroke: var(--v11-art-line);
}
.v11-art .v11-art__soft {
 fill: var(--v11-art-soft);
}
.v11-art .v11-art__accent {
 fill: var(--v11-art-accent);
}
.v11-action,
.v11-secondary-action {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 16px;
 min-height: 50px;
 padding: 12px 22px;
 border-radius: 12px;
 font:
  700 16px / 1.5 "Poppins",
  sans-serif;
 text-decoration: none;
 cursor: pointer;
 text-align: center;
}
.v11-action {
 color: #fff;
 background: #6d28d9;
 border: 1px solid #6d28d9;
 width: 100%;
 margin-top: auto;
}
.v11-journey--store .v11-action {
 background: #1d4ed8;
 border-color: #1d4ed8;
}
.v11-action:hover {
 box-shadow: var(--shadow-md);
 border-color: var(--text);
}
.v11-secondary-action {
 color: var(--primary-strong);
 background: var(--surface-solid);
 border: 1px solid var(--border-strong);
}
.v11-secondary-action:hover {
 border-color: var(--primary);
}
.v11-arrow {
 display: block;
 width: 1em;
 height: 1em;
 flex: none;
 fill: none;
 stroke: currentColor;
 stroke-width: 1.75;
 stroke-linecap: round;
 stroke-linejoin: round;
}
.v11-journey .v11-journey__support {
 font-size: 14px;
 margin-top: 14px;
 text-align: center;
 width: 100%;
}
.v11-journeys__secondary {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 16px 32px;
 padding: 24px 0 28px;
}
.v11-journeys__secondary a {
 display: inline-flex;
 gap: 12px;
 align-items: center;
 min-height: 48px;
 font-weight: 700;
 color: var(--primary-strong);
 text-decoration: none;
}
.v11-journeys__directory {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 24px;
 padding-top: 28px;
 border-top: 1px solid var(--border-strong);
}
.v11-journeys__directory h3 {
 font-size: 22px;
 font-weight: 700;
 margin: 0 0 6px;
}
.v11-journeys :is(a, button):focus-visible,
.v11-selector :is(a, button, input):focus-visible,
.v11-directory :is(a, button, input):focus-visible {
 outline: 3px solid var(--primary-strong);
 outline-offset: 4px;
}
.v11-selector {
 width: 660px;
 max-width: calc(100vw - 48px);
 max-height: calc(100dvh - 48px);
 padding: 0;
 margin: auto;
 border: 1px solid var(--border-strong);
 border-radius: 24px;
 background: var(--surface-solid);
 box-shadow: var(--shadow-lg);
 overflow: hidden;
}
.v11-selector::backdrop {
 background: var(--overlay);
}
.v11-selector__shell {
 display: flex;
 flex-direction: column;
 max-height: calc(100dvh - 50px);
}
.v11-selector__header {
 position: relative;
 flex: none;
 padding: 28px 28px 18px;
}
.v11-selector h2 {
 font-size: 26px;
 line-height: 1.3;
 font-weight: 700;
 margin: 0 48px 12px 0;
 outline: none;
}
.v11-selector__header p {
 font-size: 15px;
 color: var(--text-muted);
 margin: 0 0 22px;
}
.v11-selector__close {
 position: absolute;
 right: 16px;
 top: 16px;
 width: 44px;
 height: 44px;
 border: 1px solid var(--border);
 border-radius: 12px;
 background: var(--surface-2);
 color: var(--text);
 font-size: 28px;
 cursor: pointer;
}
.v11-selector label,
.v11-directory label {
 display: block;
 font-size: 15px;
 font-weight: 700;
 margin-bottom: 8px;
}
.v11-selector input,
.v11-directory input {
 width: 100%;
 min-width: 0;
 min-height: 50px;
 padding: 12px 14px;
 border: 1px solid var(--input-border);
 border-radius: 12px;
 background: var(--input-bg);
 color: var(--text);
 font:
  400 16px / 1.5 "Poppins",
  sans-serif;
}
.v11-selector__results {
 min-height: 0;
 overflow-y: auto;
 overscroll-behavior: contain;
 padding: 0 28px 18px;
}
.v11-selector__results ul {
 list-style: none;
 margin: 0;
 padding: 0;
}
.v11-selector__results li + li {
 border-top: 1px solid var(--border);
}
.v11-rubro {
 display: grid;
 grid-template-columns: 40px minmax(0, 1fr) 20px;
 gap: 14px;
 align-items: center;
 padding: 14px 8px;
 border-radius: 12px;
 color: var(--text);
 text-decoration: none;
}
.v11-rubro:hover,
.v11-rubro:focus-visible {
 background: var(--primary-soft);
}
/* Keep the full 3px ring inside the row after native focus scrolling. */
.v11-selector a.v11-rubro:focus-visible {
 outline-offset: -3px;
}
.v11-rubro__icon {
 display: grid;
 place-items: center;
 width: 40px;
 height: 40px;
 border-radius: 12px;
 background: var(--primary-soft);
 color: var(--primary-strong);
 font-size: 22px;
}
.v11-rubro strong {
 font-size: 16px;
 font-weight: 700;
 display: block;
 overflow-wrap: anywhere;
}
.v11-rubro small {
 display: block;
 color: var(--text-muted);
 font-size: 13px;
 line-height: 1.5;
}
.v11-selector__footer {
 flex: none;
 border-top: 1px solid var(--border);
 padding: 16px 28px;
 color: var(--text-muted);
 font-size: 14px;
}
.v11-selector [hidden],
.v11-directory [hidden] {
 display: none !important;
}
html.v11-selector-open {
 overflow: hidden;
}
.v11-directory {
 width: min(1120px, calc(100% - 48px));
 margin: 48px auto 80px;
 min-height: 55vh;
}
.v11-directory__breadcrumb a {
 color: var(--primary-strong);
 display: inline-flex;
 align-items: center;
 min-height: 44px;
}
.v11-directory__hero {
 padding: clamp(28px, 5vw, 64px);
 margin: 20px 0 24px;
 border: 1px solid var(--border);
 border-radius: 28px;
 background:
  radial-gradient(ellipse at 100% 0, var(--success-soft), transparent 60%),
  radial-gradient(ellipse at 0 100%, var(--primary-soft), transparent 70%),
  var(--surface-solid);
}
.v11-directory__eyebrow {
 margin: 0;
 color: var(--primary-strong);
 font-size: 14px;
 font-weight: 700;
 letter-spacing: 0.06em;
 text-transform: uppercase;
}
.v11-directory__hero h1 {
 margin: 18px 0;
}
.v11-directory__hero h1 span {
 color: var(--primary-strong);
}
.v11-directory__hero .v11-directory__intro {
 max-width: 600px;
 margin: 0;
}
.v11-directory [data-v11-directory-count] {
 padding-block: 12px;
 border-bottom: 1px solid var(--border);
 font-weight: 700;
}
.v11-directory__state h2 {
 margin: 0 0 12px;
 font-size: 22px;
 font-weight: 700;
}
.v11-directory__state p {
 max-width: 640px;
}
.v11-directory__state p:last-child {
 margin-bottom: 0;
 color: var(--text-muted);
}
.v11-directory h1 {
 font-size: clamp(30px, 4vw, 52px);
 line-height: 1.2;
 font-weight: 700;
 letter-spacing: -0.035em;
 margin: 32px 0 16px;
 max-width: 850px;
}
.v11-directory__intro {
 color: var(--text-muted);
 margin-bottom: 32px;
}
.v11-directory__form {
 padding: clamp(20px, 3vw, 32px);
 box-shadow: var(--shadow-sm);
 background: var(--surface-solid);
 border: 1px solid var(--border);
 border-radius: 20px;
 margin-bottom: 28px;
}
.v11-directory__search {
 display: flex;
 align-items: center;
 gap: 12px;
}
.v11-directory__search .v11-action {
 width: auto;
 margin: 0;
}
.v11-directory__clear {
 color: var(--primary-strong);
 padding: 12px 4px;
 white-space: nowrap;
}
.v11-directory__list {
 list-style: none;
 padding: 0;
 margin: 20px 0;
}
.v11-directory__row {
 display: flex;
 align-items: center;
 gap: 18px;
 padding: 20px 24px;
 border: 1px solid var(--border);
 border-left: 3px solid var(--primary-strong);
 border-radius: 16px;
 background: var(--surface-solid);
 margin-bottom: 12px;
 transition:
  border-color 180ms ease,
  box-shadow 180ms ease;
}
.v11-directory__row:focus-within {
 border-color: var(--primary-strong);
 box-shadow: var(--shadow-sm);
}
@media (hover: hover) {
 .v11-directory__row:hover {
  border-color: var(--primary-strong);
  box-shadow: var(--shadow-sm);
 }
}
@media (forced-colors: active) {
 .v11-directory__hero {
  background: Canvas;
  border-color: CanvasText;
 }
 .v11-directory__hero h1 span,
 .v11-directory__eyebrow {
  color: CanvasText;
 }
}
.v11-directory__initial {
 display: grid;
 place-items: center;
 flex: none;
 width: 52px;
 height: 52px;
 background: var(--primary-soft);
 color: var(--primary-strong);
 border-radius: 14px;
 font-size: 24px;
 font-weight: 700;
}
.v11-directory__name {
 flex: 1;
 min-width: 0;
}
.v11-directory__name h2 {
 font-size: 18px;
 line-height: 1.4;
 margin: 0;
 font-weight: 700;
 overflow-wrap: anywhere;
}
.v11-directory__name p {
 font-size: 14px;
 color: var(--text-muted);
 margin: 4px 0 0;
 overflow-wrap: anywhere;
}
.v11-directory__pagination {
 display: flex;
 align-items: center;
 justify-content: center;
 flex-wrap: wrap;
 gap: 20px;
 margin-top: 28px;
}
.v11-directory__state {
 padding: 28px;
 border: 1px solid var(--border);
 border-radius: 16px;
 background: var(--surface-solid);
}
@media (max-width: 700px) {
 /* No reserved desktop scrollbar strip beside the fullscreen mobile dialog. */
 html.v11-selector-open {
  scrollbar-gutter: auto;
 }
 .v11-journeys {
  width: calc(100% + 2 * var(--page-gutter) - 40px);
  margin-inline: calc(20px - var(--page-gutter));
 }
 .v11-journeys__heading {
  grid-template-columns: 1fr;
  gap: 16px;
  margin-bottom: 24px;
 }
 .v11-journeys h2 {
  font-size: 32px;
 }
 .v11-journeys__cards {
  grid-template-columns: 1fr;
 }
 .v11-journey {
  padding: 24px;
 }
 .v11-journey h3 {
  font-size: 20px;
 }
 .v11-journey > p:not(.v11-journey__support) {
  min-height: 0;
 }
 .v11-journeys__directory {
  align-items: stretch;
  flex-direction: column;
  gap: 18px;
 }
 .v11-journeys__secondary {
  gap: 4px 20px;
 }
 .v11-selector {
  width: 100vw;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  margin: 0;
  inset: 0;
  border: 0;
  border-radius: 0;
 }
 .v11-selector__shell {
  height: 100%;
  max-height: 100%;
  padding: env(safe-area-inset-top) env(safe-area-inset-right)
   env(safe-area-inset-bottom) env(safe-area-inset-left);
 }
 .v11-selector__header {
  padding: 24px 20px 16px;
 }
 .v11-selector h2 {
  font-size: 22px;
 }
 .v11-selector__results {
  flex: 1;
  padding: 0 20px 16px;
 }
 .v11-selector__footer {
  padding: 14px 20px;
 }
 .v11-directory {
  width: calc(100% - 40px);
  margin-top: 28px;
 }
 .v11-directory__form {
  padding: 20px;
 }
 .v11-directory__search {
  flex-wrap: wrap;
 }
 .v11-directory__search input {
  flex-basis: 100%;
 }
 .v11-directory__row {
  padding: 20px;
  gap: 12px;
  flex-wrap: wrap;
 }
 .v11-directory__row .v11-secondary-action {
  width: 100%;
 }
}
@media (max-height: 500px) {
 .v11-selector__header {
  padding-top: 16px;
  padding-bottom: 10px;
 }
 .v11-selector__header p {
  margin-bottom: 10px;
 }
 .v11-selector h2 {
  font-size: 20px;
  margin-bottom: 8px;
 }
 .v11-selector__footer {
  padding-top: 8px;
  padding-bottom: 8px;
 }
}
@media (forced-colors: active) {
 .v11-journeys h2 span {
  background: none;
  color: CanvasText;
  -webkit-text-fill-color: CanvasText;
 }
 .v11-journeys :is(a, button):focus-visible,
 .v11-selector :is(a, button, input):focus-visible,
 .v11-directory :is(a, button, input):focus-visible {
  outline-color: Highlight;
 }
}
@media (prefers-reduced-motion: reduce) {
 .v11-journeys *,
 .v11-selector *,
 .v11-directory * {
  scroll-behavior: auto;
  animation: none;
  transition: none;
 }
}