body[data-pf-focused] .hero.pf-journey-hero {padding:132px 5% 64px !important;background:#070809;min-height:0 !important;text-align:left !important;}
.pf-hero-studio {position:absolute;inset:0;z-index:0;pointer-events:none;}
.pf-hero-studio img {display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
body[data-pf-focused] .pf-journey-hero > .hero-bg {opacity:1 !important;background-image:linear-gradient(90deg,rgba(7,8,9,.92),rgba(7,8,9,.56) 58%,rgba(7,8,9,.30)),linear-gradient(0deg,#070809,transparent 18%) !important;z-index:0;}
.pf-journey-layout {position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);align-items:center;gap:48px;max-width:1200px !important;width:100%;padding:0 !important;}
.pf-journey-copy {min-width:0;}
.pf-journey-eyebrow img {display:block;width:126px;height:40px;max-width:100%;object-fit:contain;object-position:left center;}
body[data-pf-focused] .pf-journey-copy .pf-journey-eyebrow {color:#e2c565 !important;font-size:.85rem !important;font-weight:700;letter-spacing:.16em;line-height:1.5 !important;margin:0 0 14px !important;padding:0;}
body[data-pf-focused] .pf-journey-copy h1 {color:#fff;font-size:clamp(2.6rem,4.4vw,3.9rem) !important;font-weight:800 !important;line-height:1.18 !important;margin:0 0 22px !important;letter-spacing:-.045em;word-break:keep-all;overflow-wrap:anywhere;text-wrap:balance;}
body[data-pf-focused] .pf-journey-copy h1+p {color:#e1e2e6 !important;font-size:1.05rem !important;line-height:1.7 !important;margin:0 0 24px !important;padding:0;}
body[data-pf-focused] .pf-journey-copy .pf-journey-offer {color:#e2c565 !important;font-weight:700;font-size:.88rem !important;line-height:1.5 !important;margin:18px 0 0 !important;padding:0;}
.pf-journey-offer span {white-space:nowrap;color:#e5e7eb;}
.pf-journey-offer .pf-journey-trial {display:block;font-size:1.08rem;line-height:1.6;}
.pf-journey-offer .pf-journey-launch {display:block;white-space:normal;margin-top:4px;font-weight:400;font-size:.85rem;line-height:1.6;}
.pf-journey-copy .pf-hero-actions {display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start !important;}
.pf-journey-copy .pf-hero-actions a {display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:12px;font-size:1rem;font-weight:700;text-decoration:none;line-height:1.4;}
.pf-journey-copy .pf-hero-start {background:#d8b951;color:#11131a;border:1px solid #d8b951;}
body[data-pf-focused] .pf-journey-copy .pf-hero-demo {background:#161a22 !important;color:#f4f5f8 !important;border:1px solid #515665;}
body[data-pf-focused] .pf-journey-copy .pf-hero-demo:hover {background:#252b37 !important;border-color:#717989;}
.pf-journey-copy a:focus-visible,.pf-returning-owner:focus-visible {outline:3px solid #e2c565;outline-offset:4px;}
.pf-journey-screen {min-width:0;margin:0;padding:12px;border:1px solid #bba35b66;border-radius:24px;background:#12151cf2;box-shadow:0 20px 55px #0005;max-width:320px;width:100%;box-sizing:border-box;justify-self:end;}
.pf-hero-slides {aspect-ratio:9/16;border:1px solid #343945;border-radius:16px;background:#080a10;overflow:hidden;box-shadow:0 0 0 4px #080a10;}
/* Keep programmatic screenshot panning without consuming page scroll gestures. */
.pf-hero-slide {height:100%;overflow:hidden;scroll-behavior:auto;touch-action:pan-y pinch-zoom;scrollbar-width:none;}
.pf-hero-slide::-webkit-scrollbar {display:none;}
.pf-hero-slide[hidden],.pf-hero-screen-controls[hidden],.pf-hero-play[hidden],.pf-hero-enlarge[hidden] {display:none;}
.pf-hero-slide img {display:block;width:100%;height:auto;max-height:none;object-fit:initial;object-position:top;}
.pf-journey-screen figcaption {color:#c6cbd5;text-align:left;font-size:.82rem;line-height:1.5;margin-top:12px;}
.pf-journey-screen figcaption strong {display:block;color:#f6f5f1;font-size:1rem;line-height:1.4;margin-bottom:4px;}
.pf-hero-screen-note {display:block;}
.pf-hero-screen-controls {display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:10px;}
.pf-hero-screen-selectors {display:flex;align-items:center;gap:2px;margin-right:auto;}
.pf-hero-screen-controls button {display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:0;border-radius:8px;background:transparent;color:#e2c565;padding:8px;cursor:pointer;font:inherit;font-size:.82rem;line-height:1.35;}
.pf-hero-screen-selectors button span {width:8px;height:8px;border:1px solid #dfcb82;border-radius:50%;background:#50535a;}
.pf-hero-screen-selectors button[aria-pressed="true"] span {background:#e2c565;border-color:#e2c565;}
.pf-hero-screen-controls .pf-hero-play {min-width:44px;background:#242831;}
.pf-hero-screen-controls .pf-hero-enlarge {padding:8px 0 8px 8px;text-decoration:underline;text-underline-offset:3px;}
.pf-hero-screen-controls button:focus-visible,.pf-hero-lightbox button:focus-visible {outline:3px solid #e2c565;outline-offset:2px;}
.pf-hero-lightbox {margin:auto;width:min(580px,94vw);max-height:94dvh;overflow:auto;padding:16px;box-sizing:border-box;border:1px solid #606778;border-radius:16px;background:#11141b;color:#f6f5f1;}
.pf-hero-lightbox::backdrop {background:#000d;}
.pf-hero-lightbox>div {position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;background:#11141b;}
.pf-hero-lightbox h2 {margin:0;font-size:1rem;line-height:1.5;}
.pf-hero-lightbox button {min-height:44px;padding:10px 16px;border:0;border-radius:8px;background:#292f3b;color:#fff;cursor:pointer;}
.pf-hero-lightbox>img {display:block;width:min(424px,100%);height:auto;max-height:none;margin:auto;}
.pf-returning-owner {display:block;width:fit-content;margin:24px auto 0;padding:12px;color:#e2c565;text-underline-offset:4px;}
.pf-migration-help {padding:20px 5%;background:#0c0e13;color:#f6f5f1;}
.pf-migration-help > .container {box-sizing:border-box;max-width:1200px;padding:24px 28px;border:1px solid #49412b;border-radius:16px;background:#14171e;}
.pf-migration-help h2 {font-size:clamp(1.15rem,2.4vw,1.45rem);line-height:1.4;margin:0 0 10px;color:#e0c577;}
.pf-migration-help p {max-width:850px;font-size:.95rem;line-height:1.7;margin:0;color:#c5cad5;}
.pf-owner-cases {padding:48px 5%;background:#0c0e13;color:#f6f5f1;}
.pf-owner-cases>.container {max-width:1200px;}
.pf-owner-cases h2 {font-size:clamp(1.65rem,3vw,2.5rem);line-height:1.35;margin:0 0 14px;letter-spacing:-.04em;}
.pf-owner-cases-lead {max-width:780px;color:#c5cad5;font-size:.92rem;line-height:1.7;margin:0 0 26px;}
.pf-owner-cases-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
.pf-owner-cases-grid article {min-width:0;overflow:hidden;background:#14171e;border:1px solid #414752;border-radius:20px;}
.pf-owner-case-screen {margin:14px;padding:0;overflow:hidden;aspect-ratio:1.8;border-radius:10px;background:#08090d;}
.pf-owner-case-screen img {display:block;width:100%;height:100%;object-fit:cover;object-position:top;}
.pf-owner-case-copy {padding:8px 26px 28px;}
.pf-owner-case-label {color:#e0c577;font-size:.82rem;line-height:1.5;margin:0 0 10px;}
.pf-owner-case-copy h3 {color:#f6f5f1;font-size:1.35rem;line-height:1.4;margin:0 0 12px;letter-spacing:-.02em;}
.pf-owner-case-copy>p:last-child {color:#c5cad5;font-size:.92rem;line-height:1.75;margin:0;}
.pf-owner-case-guide {display:inline-block;margin-top:24px;padding:10px 0;color:#e2c565;font-weight:700;line-height:1.5;text-underline-offset:4px;}
.pf-owner-case-guide:focus-visible {outline:3px solid #e2c565;outline-offset:4px;}
/* Continue the studio atmosphere between the hero and the lower sections.
   Use the existing portrait artwork on phones; leave app screenshots opaque
   and fade each scene into the same dark surface at both section boundaries. */
body[data-pf-focused] .pf-owner-cases {
  background-color:#0c0e13;
  background-image:linear-gradient(180deg,#0c0e13 0%,rgba(12,14,19,.74) 12%,rgba(12,14,19,.66) 52%,rgba(12,14,19,.74) 88%,#0c0e13 100%),var(--pf-section-studio-image);
  background-position:center,center;
  background-size:100% 100%,cover;
  background-repeat:no-repeat;
  background-attachment:scroll;
}
/* Repeating, proportionate scenes avoid a several-screen-tall cover crop once
   every feature is visible. Each scene fades at its tile edges; the upper and
   lower halves use different rooms while the content remains opaque. */
body[data-pf-focused] .pf-feature-gallery-home {position:relative;isolation:isolate;background:#0c0e13;--pf-studio-tile-height:100vw;--pf-studio-scene-top:url('/assets/feature_gym_bg.webp');--pf-studio-scene-bottom:url('/assets/feature_ballet_bg.webp');}
body[data-pf-focused] .pf-feature-gallery-home::before,
body[data-pf-focused] .pf-feature-gallery-home::after {content:"";position:absolute;left:0;right:0;height:50%;z-index:-1;pointer-events:none;background-image:linear-gradient(180deg,#0c0e13 0%,rgba(12,14,19,.76) 12%,rgba(12,14,19,.64) 50%,rgba(12,14,19,.76) 88%,#0c0e13 100%),var(--pf-studio-scene);background-position:center top;background-size:100% var(--pf-studio-tile-height),100% auto;background-repeat:repeat-y;mask-image:linear-gradient(180deg,transparent,#000 3%,#000 97%,transparent);}
body[data-pf-focused] .pf-feature-gallery-home::before {top:0;--pf-studio-scene:var(--pf-studio-scene-top);}
body[data-pf-focused] .pf-feature-gallery-home::after {bottom:0;--pf-studio-scene:var(--pf-studio-scene-bottom);}
body[data-pf-focused] .pf-owner-cases {--pf-section-studio-image:url('/assets/feature_ballet_bg.webp');}
@media(max-width:800px) {
  body[data-pf-focused] .hero.pf-journey-hero {padding:108px 6% 28px !important;}
  .pf-hero-studio img {object-position:center top;}
  body[data-pf-focused] .pf-journey-hero > .hero-bg {background-image:linear-gradient(180deg,rgba(7,8,9,.18),rgba(7,8,9,.25) 44%,rgba(7,8,9,.12) 72%,#070809) !important;}
  .pf-journey-layout {grid-template-columns:1fr;gap:24px;}
  body[data-pf-focused] .pf-journey-copy h1 {font-size:clamp(2.05rem,8.4vw,3rem) !important;margin-bottom:16px !important;}
  body[data-pf-focused] .pf-journey-copy h1+p {max-width:520px;font-size:1rem !important;margin-bottom:20px !important;}
  .pf-journey-screen {justify-self:center;max-width:300px;padding:12px;border-radius:24px;}
  .pf-journey-screen figcaption {margin-top:10px;font-size:.8rem;}
  body[data-pf-focused] .pf-feature-gallery-home {--pf-studio-tile-height:calc(100vw * 1672 / 941);--pf-studio-scene-top:url('/assets/passflow-fitness-mobile-20261005.webp');--pf-studio-scene-bottom:url('/assets/passflow-dance-mobile-20261005.webp');}
  body[data-pf-focused] .pf-owner-cases {--pf-section-studio-image:url('/assets/passflow-dance-mobile-20261005.webp');}
}
@media(max-width:600px) {.pf-owner-cases {padding:34px 5%;}.pf-owner-cases-grid {grid-template-columns:1fr;gap:18px;}.pf-owner-case-copy {padding:8px 20px 24px;}.pf-owner-case-copy h3 {font-size:1.2rem;}}
@media(max-width:480px) {.pf-journey-copy .pf-hero-actions {display:grid;grid-template-columns:1fr;gap:10px;}.pf-journey-copy .pf-hero-actions a {box-sizing:border-box;width:100%;min-height:48px;}.pf-journey-offer span {display:block;}body[data-pf-focused] .pf-journey-copy h1+p {font-size:.96rem !important;}.pf-journey-screen figcaption {font-size:.8rem;}}
@media(prefers-reduced-motion:reduce) {.pf-journey-hero * {animation:none !important;transition:none !important;}}