/* A contained, manually selected process route. Plain HTML shows every stage. */
.xf-journey {
  --xf-journey-css: 1;
  --xf-journey-progress: 33.333333%;
  --xf-journey-gold: #aa8753;
  --xf-journey-ink: #302d26;
  --xf-journey-muted: #726c61;
  --xf-journey-line: #dcd3c3;
  padding-block: clamp(64px, 7.5vw, 112px);
  color: var(--xf-journey-ink);
  background: #f4efe5;
  scroll-margin-top: calc(var(--site-header-height, 94px) + 24px);
}
.xf-journey .xf-journey__shell { width: min(1280px, calc(100% - 96px)); margin-inline: auto; }
.xf-journey .xf-journey__intro { display: grid; grid-template-columns: 1.1fr .9fr; gap: 64px; align-items: end; margin-bottom: 52px; }
.xf-journey .xf-journey__eyebrow { margin: 0 0 20px; color: #846638; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.xf-journey h2 { margin: 0; font-size: clamp(32px, 3.6vw, 50px); font-weight: 600; line-height: 1.18; letter-spacing: -.04em; }
.xf-journey .xf-journey__introduction { max-width: 490px; }
.xf-journey .xf-journey__introduction > p { margin: 0; color: var(--xf-journey-muted); font-size: 15px; line-height: 1.85; }
.xf-journey .xf-journey__introduction .xf-journey__route-note { margin-top: 18px; font-size: 12px; line-height: 1.8; }
.xf-journey .xf-journey__navigation { display: grid; grid-template-columns: repeat(var(--xf-journey-count, 3), minmax(0, 1fr)); gap: 0; }
.xf-journey .xf-journey__tab { display: flex; gap: 20px; align-items: center; min-width: 0; padding: 18px 28px 24px; color: var(--xf-journey-muted); border-radius: 2px; text-decoration: none; transition: color 220ms ease, background-color 220ms ease; }
.xf-journey .xf-journey__tab:first-child { padding-left: 0; }
.xf-journey .xf-journey__tab + .xf-journey__tab { border-left: 1px solid var(--xf-journey-line); }
.xf-journey .xf-journey__number { font-size: clamp(40px, 4.5vw, 66px); font-weight: 400; letter-spacing: -.06em; line-height: 1; color: #b6a891; transition: color 220ms ease, transform 300ms ease; }
.xf-journey .xf-journey__tab-copy { display: grid; gap: 9px; min-width: 0; }
.xf-journey .xf-journey__process { color: inherit; font-size: 18px; font-weight: 600; line-height: 1.35; }
.xf-journey .xf-journey__tab-model { font-size: 11px; font-weight: 500; letter-spacing: .04em; overflow-wrap: anywhere; }
.xf-journey .xf-journey__tab-arrow { display: flex; margin-left: auto; color: #a28b68; transition: transform 250ms ease; }
.xf-journey .xf-journey__tab:hover, .xf-journey .xf-journey__tab[aria-selected="true"] { color: #694e29; }
.xf-journey .xf-journey__tab[aria-selected="true"] .xf-journey__number { color: var(--xf-journey-gold); }
.xf-journey .xf-journey__tab:hover .xf-journey__tab-arrow { transform: translateX(4px); }
.xf-journey .xf-journey__track { display: none; height: 2px; margin-bottom: 30px; overflow: hidden; background: var(--xf-journey-line); }
.xf-journey .xf-journey__progress { display: block; width: var(--xf-journey-progress); height: 100%; background: var(--xf-journey-gold); transform-origin: left; transition: width 550ms cubic-bezier(.22, .7, .2, 1); }
.xf-journey .xf-journey__stage { display: grid; gap: 32px; margin-top: 24px; }
.xf-journey .xf-journey__panel { display: grid; grid-template-columns: 1.1fr .9fr; min-width: 0; background: #fffdf8; border: 1px solid #e4ddcf; scroll-margin-top: calc(var(--site-header-height, 94px) + 24px); }
.xf-journey .xf-journey__media { display: grid; grid-template-rows: minmax(280px, 1fr) auto; min-width: 0; margin: 0; padding: 32px 26px 22px; background: #fff; overflow: hidden; }
.xf-journey .xf-journey__image { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 0; }
.xf-journey .xf-journey__image img { display: block; width: 100%; height: 100%; max-height: 420px; object-fit: contain; }
.xf-journey .xf-journey__media figcaption { padding-top: 22px; color: #857c6d; font-size: 10px; font-weight: 500; line-height: 1.7; letter-spacing: .03em; }
.xf-journey .xf-journey__content { min-width: 0; padding: clamp(30px, 3.6vw, 52px); align-self: center; }
.xf-journey .xf-journey__chapter { margin: 0 0 20px; color: #947545; font-size: 11px; font-weight: 600; line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; }
.xf-journey h3 { margin: 0; color: var(--xf-journey-ink); font-size: clamp(25px, 2.5vw, 35px); font-weight: 600; line-height: 1.24; letter-spacing: -.03em; }
.xf-journey .xf-journey__body { margin: 22px 0 0; color: var(--xf-journey-muted); font-size: 14px; line-height: 1.85; }
.xf-journey .xf-journey__specs { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 20px; margin: 28px 0 26px; padding-top: 22px; border-top: 1px solid var(--xf-journey-line); }
.xf-journey .xf-journey__specs dt { margin-bottom: 9px; color: #807767; font-size: 11px; line-height: 1.6; }
.xf-journey .xf-journey__specs dd { margin: 0; color: #4d4230; font-size: 16px; font-weight: 500; line-height: 1.6; }
.xf-journey .xf-journey__link { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; width: fit-content; max-width: 100%; min-height: 44px; padding-block: 9px; color: #6b502c; border-bottom: 1px solid #baa783; font-size: 12px; font-weight: 600; line-height: 1.6; text-decoration: none; transition: color 200ms ease, border-color 200ms ease; }
.xf-journey .xf-journey__link svg { flex: none; transition: transform 250ms ease; }
.xf-journey .xf-journey__link:hover { color: #332819; border-color: #70502c; }
.xf-journey .xf-journey__link:hover svg { transform: translate(3px, -2px); }
.xf-journey a:focus-visible, .xf-journey [role="tabpanel"]:focus-visible { outline: 2px solid #876231; outline-offset: 6px; }
.xf-journey .xf-journey__footer { display: flex; align-items: center; justify-content: space-between; gap: 26px 52px; margin-top: 28px; }
.xf-journey .xf-journey__footer > p { max-width: 660px; margin: 0; color: #817868; font-size: 11px; line-height: 1.85; }
.xf-journey .xf-journey__footer .xf-journey__link { flex: none; }
/* Inactive panels remain in the grid's sizing calculation, without interaction. */
.xf-journey[data-xf-journey-ready="true"] .xf-journey__track { display: block; }
.xf-journey[data-xf-journey-ready="true"] .xf-journey__stage { gap: 0; margin-top: 0; }
.xf-journey[data-xf-journey-ready="true"] .xf-journey__panel { grid-area: 1 / 1; }
.xf-journey[data-xf-journey-ready="true"] .xf-journey__panel[aria-hidden="true"] { visibility: hidden; pointer-events: none; }
.xf-journey[data-xf-journey-ready="true"] .xf-journey__panel[aria-hidden="false"] { visibility: visible; z-index: 1; }
@keyframes xf-journey-image-in { from { opacity: .55; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes xf-journey-track-in { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.xf-journey.xf-journey--replay .xf-journey__panel[aria-hidden="false"] .xf-journey__image img { animation: xf-journey-image-in 700ms cubic-bezier(.22, .7, .2, 1) both; }
.xf-journey.xf-journey--replay .xf-journey__progress { animation: xf-journey-track-in 700ms cubic-bezier(.22, .7, .2, 1) both; }
@media (max-width: 1024px) {
  .xf-journey .xf-journey__shell { width: calc(100% - 64px); }
  .xf-journey .xf-journey__intro { gap: 36px; }
  .xf-journey .xf-journey__tab { padding-inline: 18px; gap: 14px; }
  .xf-journey .xf-journey__tab-arrow { display: none; }
  .xf-journey .xf-journey__process { font-size: 16px; }
  .xf-journey .xf-journey__content { padding: 30px; }
  .xf-journey .xf-journey__specs { grid-template-columns: 1fr; gap: 16px; }
  .xf-journey .xf-journey__specs dt { margin-bottom: 4px; }
}
@media (max-width: 760px) {
  .xf-journey .xf-journey__shell { width: calc(100% - 32px); }
  .xf-journey .xf-journey__intro { grid-template-columns: 1fr; gap: 26px; margin-bottom: 30px; }
  .xf-journey .xf-journey__introduction { max-width: 580px; }
  .xf-journey .xf-journey__introduction > p { font-size: 14px; }
  .xf-journey .xf-journey__tab { display: grid; gap: 14px; align-content: start; padding: 12px 14px 20px; }
  .xf-journey .xf-journey__number { font-size: 44px; }
  .xf-journey .xf-journey__tab-copy { gap: 7px; }
  .xf-journey .xf-journey__process { font-size: 13px; }
  .xf-journey .xf-journey__tab-model { font-size: 9px; }
  .xf-journey .xf-journey__track { margin-bottom: 22px; }
  .xf-journey .xf-journey__panel { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .xf-journey .xf-journey__media { grid-template-rows: 220px auto; padding: 20px 16px 16px; }
  .xf-journey .xf-journey__media figcaption { padding-top: 14px; font-size: 9px; }
  .xf-journey .xf-journey__content { padding: 28px 24px 30px; align-self: start; }
  .xf-journey .xf-journey__chapter { margin-bottom: 15px; }
  .xf-journey .xf-journey__body { margin-top: 18px; }
  .xf-journey .xf-journey__specs { grid-template-columns: 1fr 1fr; gap: 16px; margin-block: 24px 20px; }
  .xf-journey .xf-journey__specs dd { font-size: 14px; }
  .xf-journey .xf-journey__footer { align-items: start; flex-direction: column; gap: 16px; margin-top: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .xf-journey .xf-journey__tab, .xf-journey .xf-journey__number, .xf-journey .xf-journey__tab-arrow,
  .xf-journey .xf-journey__progress, .xf-journey .xf-journey__link, .xf-journey .xf-journey__link svg { transition: none; }
  .xf-journey.xf-journey--replay .xf-journey__panel[aria-hidden="false"] .xf-journey__image img,
  .xf-journey.xf-journey--replay .xf-journey__progress { animation: none; }
  .xf-journey .xf-journey__tab:hover .xf-journey__tab-arrow, .xf-journey .xf-journey__link:hover svg { transform: none; }
}