/* journey3d — scroll-driven 3D customer journey for "How a visit goes".
   Self-contained: every class is prefixed j3d-. Reads the site tokens (--cw802fd72432, --rp4c6a89fe1d,
   --gt7e345b2ebc…, --fy90701b757f, --smb327b83dc0, --uxc841ab84f7, --vh3cb8aa26ee) and falls back if they are missing.
   Nothing here may scroll sideways: no overflow-x auto/scroll, every grid/flex child min-width 0. */

.nx1e0abe1c06 {
  --kw1862a2ab5b: var(--vhcf53fffb02, #ECE4D4);  /* the frames are composited on #ECE4D4; a palette re-tints frames and ground together (--ez3cfd5013a5) */
  --uxd0faef988a: var(--vh3cb8aa26ee, 0px);            /* the site header is fixed; the stage pins under it */
  --nxf08d1caf75: 1.2;                       /* frames are 1200 x 1000 */
  --qs030501d28a: var(--ly269526ac20, cubic-bezier(.16, 1, .3, 1));
  background: var(--kw1862a2ab5b);
  color: var(--rp4c6a89fe1d, #141A22);
  padding-block: var(--lyaed9509c95, 96px) 0;
  overflow-x: clip;                       /* the full-bleed stage on phones can never widen the page */
}
.rpf015443aba { width: min(100% - 2 * var(--smb327b83dc0, 16px), var(--uxc841ab84f7, 1320px)); margin-inline: auto; }
.ao8470289834 { max-width: 62ch; margin-bottom: clamp(20px, 4vw, 40px); }
.ao8470289834 .tvf683ee6303 { margin: 0; color: var(--kwc8f99290b6, #2B313A); }
.ao8470289834 .qsad4fbc9f87 { margin-bottom: 14px; }

/* ---------------------------------------------------------------- phone first: stage pinned on top, steps under it */
.pn4d5aa79561 { position: relative; }
.qsb6ac2394e7 {
  position: sticky; top: var(--uxd0faef988a); z-index: 2;
  margin-inline: calc(-1 * var(--smb327b83dc0, 16px));
  background: var(--kw1862a2ab5b);
  padding-bottom: 12px;
}
.qsb6ac2394e7::after {           /* text slides under a soft edge, not a hard cut */
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 16px; pointer-events: none;
  background: linear-gradient(var(--kw1862a2ab5b), transparent);
}
.bl1c895b416f { margin: 0; }
.cw83ae8a28f1 {
  position: relative; overflow: clip;
  width: min(100%, calc((100svh - var(--uxd0faef988a) - 250px) * var(--nxf08d1caf75)));
  min-width: min(100%, 300px);
  aspect-ratio: 6 / 5; margin-inline: auto;
}
.rp5cb0a043b1, .rpb51488f5c3 { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.rp5cb0a043b1 { object-fit: cover; }
.rp5cb0a043b1, .rpb51488f5c3, .ezefc01bdd57 img { filter: var(--ez3cfd5013a5, none); }
.rpb51488f5c3 { opacity: 0; }
.nx1e0abe1c06.vh86c560b95f .rpb51488f5c3 { opacity: 1; }
.nx1e0abe1c06.vh86c560b95f .rp5cb0a043b1 { visibility: hidden; }

/* progress: five numbered segments under the frame */
.irdc6e027324 {
  list-style: none; margin: 10px auto 0; padding: 0 var(--smb327b83dc0, 16px);
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px;
  max-width: 560px;
}
.irdc6e027324 li { min-width: 0; display: grid; gap: 5px; }
.irdc6e027324 b {
  font: 650 .6875rem/1 var(--fy90701b757f, system-ui); letter-spacing: .1em; color: var(--gt1647dd7951, #5B564D);
  font-variant-numeric: tabular-nums; transition: color .3s;
}
.irdc6e027324 i { display: block; height: 3px; border-radius: 2px; background: var(--pn2a8a7f4aab, #DDD1BA); overflow: clip; }
.irdc6e027324 i::before {
  content: ""; display: block; height: 100%; background: var(--gt7e345b2ebc, #BE8F3F);
  transform-origin: left; transform: scaleX(var(--ux8658e431b0, 0));
}
.irdc6e027324 li.fy25c5cf13d4 b { color: var(--gt0c91d84602, #6E4F18); }

/* steps */
.ao095bf4d328 { list-style: none; margin: 0; padding: 0; position: relative; z-index: 1; }
.aoe0b0dfe56d { min-height: 78svh; min-width: 0; }
.aoe0b0dfe56d:last-child { min-height: 96svh; }
.fyad40641672 {
  position: sticky;
  top: calc(var(--uxd0faef988a) + var(--ly7224fc1712, 360px) + 22px);
  padding-block: 4px 24px; max-width: 40ch;
}
.db2246dd1550 {
  font: 650 .8125rem/1 var(--fy90701b757f, system-ui); letter-spacing: .1em; color: var(--gt0c91d84602, #6E4F18);
  font-variant-numeric: tabular-nums; margin: 0 0 8px;
}
.db4c3953aaef { font: 650 1.3125rem/1.22 var(--fy90701b757f, system-ui); letter-spacing: -.01em; margin: 0 0 8px; text-wrap: balance; overflow-wrap: anywhere; }
.fyad40641672 p:last-child { margin: 0; color: var(--kwc8f99290b6, #2B313A); overflow-wrap: break-word; }
.ezefc01bdd57 { display: none; }

/* motion: each step's words arrive as their part of the scroll does (only when JS is running) */
.nx1e0abe1c06.rp685911ff6b .fyad40641672 { opacity: .12; transform: translateY(14px); transition: opacity .5s var(--qs030501d28a), transform .6s var(--qs030501d28a); }
.nx1e0abe1c06.rp685911ff6b .aoe0b0dfe56d.fy25c5cf13d4 .fyad40641672 { opacity: 1; transform: none; }

/* ---------------------------------------------------------------- desktop: graphic pinned on one side */
@media (min-width: 900px), (min-width: 600px) and (max-height: 600px) and (orientation: landscape) {
  .pn4d5aa79561 {
    display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: clamp(32px, 5vw, 80px); align-items: start;
  }
  .qsb6ac2394e7 {
    margin-inline: 0; padding-bottom: 0;
    top: max(calc(var(--uxd0faef988a) + 16px), calc(50vh + var(--uxd0faef988a) / 2 - var(--ly7224fc1712, 560px) / 2));
  }
  .qsb6ac2394e7::after { display: none; }
  .cw83ae8a28f1 { width: min(100%, calc((100vh - var(--uxd0faef988a) - 120px) * var(--nxf08d1caf75))); min-width: 0; }
  .irdc6e027324 { padding: 0; margin-top: 16px; }
  .aoe0b0dfe56d { min-height: 84vh; }
  .aoe0b0dfe56d:last-child { min-height: 100vh; }
  .aoe0b0dfe56d:first-child { padding-top: 12vh; }
  /* each step's words hold at eye level while its part of the picture plays */
  .fyad40641672 { top: calc(50vh + var(--uxd0faef988a) / 2 - 5.5em); padding: 0; }
  .db4c3953aaef { font-size: 1.625rem; }
  .nx1e0abe1c06.rp685911ff6b .fyad40641672 { opacity: .14; }
}

/* ---------------------------------------------------------------- reduced motion: five stills, no scrubbing */
@media (prefers-reduced-motion: reduce) {
  .pn4d5aa79561 { display: block; }
  .qsb6ac2394e7 { display: none; }
  .aoe0b0dfe56d, .aoe0b0dfe56d:last-child, .aoe0b0dfe56d:first-child { min-height: 0; display: block; margin-bottom: 40px; padding-top: 0; }
  .fyad40641672, .nx1e0abe1c06.rp685911ff6b .fyad40641672 { position: static; opacity: 1; transform: none; transition: none; }
  .ezefc01bdd57 { display: block; margin: 0 0 16px; }
  .ezefc01bdd57 img { display: block; width: 100%; height: auto; }
}
@media (prefers-reduced-motion: reduce) and (min-width: 900px) {
  .ao095bf4d328 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 48px; }
  .aoe0b0dfe56d { margin: 0; }
}
/*04d6e55fe8b7*/
