.j-hero { background: radial-gradient(ellipse at 75% 35%, #24354a 0, #121c2b 34%, #090d14 76%); color: #fff; }
.j-hero-inner { position: relative; min-height: 690px; padding-top: 115px; padding-bottom: 80px; }
.j-hero-inner::after { content: ""; position: absolute; right: 8%; top: 110px; width: 1px; height: 250px; background: linear-gradient(#b9d9e9, transparent); opacity: .45; transform: rotate(22deg); pointer-events: none; }
.j-kicker, .j-kind, .j-index, .j-caption-text, .j-hero-bottom a, .j-origin-image figcaption, .j-step-copy > span, .j-steps figcaption, .j-status-grid span { font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 700; letter-spacing: .15em; }
.j-kicker { color: #b9d9e9; font-size: 11px; }
.j-kind { display: inline-block; margin-top: 78px; padding: 7px 11px; border: 1px solid rgba(185,217,233,.62); color: #d7ebf4; font-size: 10px; }
.j-hero h1, .j-section h2, .j-reasons h3, .j-steps h3 { font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-weight: 500; letter-spacing: -.055em; }
.j-hero h1 { margin-top: 24px; font-size: clamp(60px, 7.2vw, 108px); line-height: 1.25; }
.j-hero-lead { margin-top: 26px; color: #e0e9f0; font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-size: clamp(19px, 2vw, 27px); line-height: 1.85; }
.j-hero-bottom { display: flex; justify-content: space-between; align-items: end; gap: 30px; max-width: 970px; margin-top: 55px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.35); }
.j-hero-bottom p { color: #b9c9d5; font-size: 12px; line-height: 1.9; }
.j-hero-bottom a { display: inline-flex; min-height: 44px; align-items: center; gap: 30px; white-space: nowrap; color: #d5e8f1; font-size: 10px; }
.j-section { padding: 110px 0; }
.j-index { margin-bottom: 30px; color: #60798b; font-size: 10px; line-height: 1.6; }
.j-section h2 { font-size: clamp(38px, 4.1vw, 64px); line-height: 1.48; }
.j-section p:not(.j-index):not(.j-caption-text) { line-height: 2; }
.j-copy > p:not(.j-index), .j-narrow > p:not(.j-index), .j-turn-grid > div > p:not(.j-index), .j-herself-grid > div > p:not(.j-index) { max-width: 680px; margin-top: 22px; color: #46545f; font-size: 15px; }
.j-section .j-lead { margin-top: 30px !important; color: #172431 !important; font-size: 19px !important; }
.j-caption-text { color: #6c8495 !important; font-size: 10px !important; line-height: 1.8 !important; }
.j-origin { background: #f5f7f8; }
.j-origin-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 7%; align-items: center; }
.j-origin-image { min-width: 0; }
.j-origin-image img { width: 100%; height: 460px; object-fit: cover; object-position: 61% center; }
.j-origin-image figcaption, .j-steps figcaption { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 12px; margin-top: 10px; color: #567187; font-size: 10px; line-height: 1.7; }
.j-origin-image figcaption span { font-family: "Hiragino Kaku Gothic ProN", sans-serif; letter-spacing: 0; font-weight: 400; }
.j-dream { background: #e8eef1; }
.j-narrow { max-width: 900px; }
.j-turn { background: #192534; color: #fff; }
.j-turn-grid, .j-herself-grid, .j-watch-grid { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 5%; }
.j-turn .j-index, .j-herself .j-index, .j-watch .j-index { color: #a6c7d8; }
.j-turn-grid > div > p:not(.j-index), .j-herself-grid > div > p:not(.j-index) { color: #c9d4dc; }
.j-turn .j-lead, .j-herself .j-lead { color: #fff !important; }
.j-why { background: #f8f9f9; }
.j-why h2 { max-width: 760px; }
.j-reasons { display: grid; grid-template-columns: 1fr 1fr; gap: 5%; margin-top: 60px; border-top: 1px solid #bfcbd2; }
.j-reasons article { padding-top: 26px; }
.j-reasons article > span { color: #6b8899; font-size: 12px; }
.j-reasons h3 { margin-top: 20px; font-size: clamp(33px, 3.2vw, 48px); line-height: 1.45; }
.j-reasons p { max-width: 460px; margin-top: 18px; color: #52616d; font-size: 14px; }
.j-why-note { margin-top: 48px; padding-top: 18px; border-top: 1px solid #d1d8dd; color: #61727e; font-size: 12px; }
.j-herself { background: #0e1724; color: #fff; }
.j-herself .j-caption-text { color: #a6c7d8 !important; }
.j-future { background: #ebeff1; }
.j-future-intro { display: grid; grid-template-columns: 200px 1fr; gap: 5%; }
.j-future-intro p:last-child { max-width: 630px; margin-top: 18px; color: #556874; font-size: 14px; }
.j-steps { margin: 55px 0 0; padding: 0; list-style: none; border-top: 1px solid #adbfc8; }
.j-steps li { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 6%; align-items: center; padding: 35px 0; border-bottom: 1px solid #adbfc8; }
.j-step-copy > span { color: #628298; font-size: 10px; line-height: 1.8; }
.j-steps h3 { margin-top: 18px; font-size: clamp(31px, 3.3vw, 48px); line-height: 1.4; }
.j-steps p { max-width: 430px; margin-top: 13px; color: #586874; font-size: 14px; }
.j-steps figure { min-width: 0; }
.j-steps img { width: 100%; height: 320px; object-fit: cover; }
.j-steps li:nth-child(2) img { object-position: center 60%; }
.j-steps li:nth-child(3) img { object-position: center 30%; }
.j-watch { background: #152337; color: #fff; }
.j-watch-grid > div > p { max-width: 680px; margin-top: 23px; color: #c4d3df; font-size: 15px; }
.j-watch-link { display: inline-flex; min-height: 56px; align-items: center; justify-content: space-between; gap: 45px; max-width: 100%; margin-top: 34px; padding: 12px 20px; border: 1px solid #d6e8f1; color: #fff; font-size: 13px; font-weight: 700; }
.j-watch-link:hover { background: rgba(255,255,255,.12); }
.j-watch .j-caption-text { color: #a6c7d8 !important; }
.j-current { background: #f7f8f8; }
.j-status-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5%; margin-top: 45px; border-top: 1px solid #c7d1d8; }
.j-status-grid > div { padding: 23px 0 10px; }
.j-status-grid span { color: #5a7a8e; font-size: 10px; }
.j-status-grid p { max-width: 440px; margin-top: 13px; color: #354653; font-size: 14px; }
.j-return { display: inline-flex; min-height: 44px; align-items: center; gap: 30px; margin-top: 32px; border-bottom: 1px solid #293e50; color: #293e50; font-size: 12px; font-weight: 700; }
@media (max-width: 900px) { .j-origin-grid { grid-template-columns: 1fr; gap: 35px; } .j-origin-image { max-width: 760px; } .j-origin-image img { height: 400px; } .j-turn-grid, .j-herself-grid, .j-watch-grid, .j-future-intro { grid-template-columns: 1fr; gap: 0; } }
@media (max-width: 699px) { .j-hero-inner { min-height: 0; padding-top: 67px; padding-bottom: 64px; } .j-hero-inner::after { right: 8%; top: 94px; height: 165px; } .j-kind { margin-top: 58px; } .j-hero h1 { font-size: clamp(45px, 12.2vw, 65px); } .j-hero-lead { font-size: 18px; } .j-hero-bottom { display: block; margin-top: 38px; } .j-hero-bottom a { margin-top: 16px; } .j-section { padding: 72px 0; } .j-index { margin-bottom: 19px; } .j-section h2 { font-size: clamp(34px, 9vw, 46px); } .j-copy > p:not(.j-index), .j-narrow > p:not(.j-index), .j-turn-grid > div > p:not(.j-index), .j-herself-grid > div > p:not(.j-index) { font-size: 14px; } .j-section .j-lead { font-size: 17px !important; } .j-origin-image img { height: 240px; object-position: 58% center; } .j-reasons, .j-status-grid { display: block; margin-top: 34px; } .j-reasons article + article, .j-status-grid > div + div { margin-top: 25px; border-top: 1px solid #c5d0d7; } .j-reasons h3 { font-size: 35px; } .j-why-note { margin-top: 32px; } .j-steps { margin-top: 30px; } .j-steps li { display: block; padding: 26px 0; } .j-steps figure { margin-top: 22px; } .j-steps img { height: auto; aspect-ratio: 16 / 10; } .j-steps li:nth-child(3) img { aspect-ratio: 16 / 12; } .j-watch-link { width: 100%; gap: 20px; } }
@media (max-width: 370px) { .j-hero h1 { font-size: 43px; } .j-section h2 { font-size: 33px; } .j-reasons h3 { font-size: 32px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* JOURNEY-only editorial imagery and restrained scroll treatment. */
.j-hero { position: relative; isolation: isolate; overflow: hidden; }
.j-hero-art { position: absolute; inset: 0; z-index: -2; }
.j-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: 78% 44%; }
.j-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5, 9, 16, .99) 0%, rgba(6, 12, 21, .96) 34%, rgba(8, 15, 26, .81) 62%, rgba(8, 15, 26, .52) 100%), linear-gradient(0deg, rgba(5, 9, 16, .8), transparent 60%); pointer-events: none; }
.j-hero-inner { z-index: 1; }
.j-origin { position: relative; }
@media (min-width: 1100px) { .j-origin-image { position: sticky; top: 112px; align-self: start; } }
.j-turn-grid { align-items: center; }
.j-turn-image { grid-column: 2; width: min(72%, 700px); margin: 42px 0 0 auto; }
.j-turn-image img { width: 100%; height: 210px; object-fit: cover; object-position: center 38%; filter: saturate(.72) brightness(.8); }
.j-turn-image figcaption, .j-herself-image figcaption { margin-top: 10px; color: #a6c7d8; font-family: "Helvetica Neue", Arial, sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .12em; }
.j-herself-image { grid-column: 2; width: min(76%, 740px); margin: 43px 0 0 auto; }
.j-herself-image img { display: block; width: 100%; height: 310px; object-fit: cover; object-position: center 36%; }
.j-steps li { min-height: 310px; }
.j-steps li:nth-child(2) img { height: 350px; }
.j-steps li:nth-child(3) { padding-top: 65px; padding-bottom: 65px; }
.j-steps li:nth-child(3) figure { width: min(100%, 760px); }
.j-steps li:nth-child(3) img { height: 450px; }
.j-steps li:nth-child(4) { min-height: 250px; }
.j-watch-link { min-height: 68px; margin-top: 38px; padding-inline: 28px; border-color: #e7f4fb; background: #e7f4fb; color: #132437; font-size: 15px; }
.j-watch-link:hover { background: #fff; color: #132437; }
.j-status-grid h3 { margin-top: 10px; font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-size: 24px; font-weight: 500; }
.j-status-grid ul { margin: 15px 0 0; padding-left: 1.2em; color: #354653; font-size: 13px; line-height: 1.9; }
.j-status-grid li { padding-left: 2px; }
.journey-motion .j-reveal { opacity: 0; transform: translateY(16px); transition: opacity .75s ease, transform .75s ease; }
.journey-motion .j-reveal.is-visible { opacity: 1; transform: none; }
@media (max-width: 900px) { .j-turn-image, .j-herself-image { grid-column: 1; width: min(80%, 700px); margin-left: auto; } }
@media (max-width: 699px) { .j-hero-art img { object-position: 67% center; } .j-hero::before { background: linear-gradient(0deg, rgba(5, 9, 16, .99) 0%, rgba(5, 9, 16, .96) 48%, rgba(5, 9, 16, .76) 100%); } .j-turn-image { width: 78%; margin-top: 31px; } .j-turn-image img { height: 140px; } .j-herself-image { width: 88%; margin-top: 32px; } .j-herself-image img { height: 200px; } .j-steps li { min-height: 0; } .j-steps li:nth-child(2) img { height: auto; } .j-steps li:nth-child(3) { padding-top: 26px; padding-bottom: 26px; } .j-steps li:nth-child(3) img { height: auto; } .j-steps li:nth-child(4) { min-height: 0; } .j-watch-link { min-height: 58px; padding-inline: 17px; font-size: 13px; } .j-status-grid h3 { font-size: 21px; } }
@media (prefers-reduced-motion: reduce) { .journey-motion .j-reveal { opacity: 1 !important; transform: none !important; transition: none !important; } }

/* Two native-scroll story stages. The images crossfade; the document never captures scrolling. */
.j-dream { background: linear-gradient(180deg, #f2eee9, #e9e4de 78%, #c9c5c6); }
.j-hero-art img { transform: translateY(var(--journey-hero-shift, 0px)); }
.j-origin-image img { transform: scale(var(--journey-origin-scale, 1)); transform-origin: 55% 50%; }
.j-scene-intro { padding-bottom: 48px; }
.j-scene-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr); gap: 6%; align-items: start; }
.j-scene-stage { position: sticky; top: 94px; height: min(72vh, 640px); min-height: 430px; overflow: hidden; background: #101720; }
.j-scene-stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.025); transition: opacity .7s ease, transform 2s ease; }
.j-scene-stage img.is-active { opacity: 1; transform: scale(1); }
.j-scene-stage.is-final img { opacity: 0; }
.j-scene-stage-label { position: absolute; left: 18px; bottom: 18px; z-index: 2; padding: 7px 10px; background: rgba(7,12,21,.78); color: #fff; font: 700 10px/1.4 Arial, sans-serif; letter-spacing: .13em; }
.j-scene-track { min-width: 0; }
.j-scene-beat { display: flex; min-height: 76vh; align-items: center; border-top: 1px solid rgba(77,98,111,.28); }
.j-scene-beat:last-child { border-bottom: 1px solid rgba(77,98,111,.28); }
.j-scene-beat > div { padding: 35px 0; }
.j-scene-beat span { color: #58758a; font: 700 10px/1.7 Arial, sans-serif; letter-spacing: .11em; }
.j-scene-beat h3 { margin-top: 15px; font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-size: clamp(27px, 2.6vw, 42px); font-weight: 500; line-height: 1.35; }
.j-scene-beat p { max-width: 290px; margin-top: 16px; font-size: 14px; line-height: 1.9; }
.j-scene-beat figure { display: none; }
.j-turn { background: #101821; }
.j-turn-image { grid-column: auto; width: min(100%, 1180px); margin: 55px auto 0; }
.j-turn-image img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; filter: saturate(.75) brightness(.77); }
.j-turn-image figcaption { text-align: right; }
.j-why { padding-block: 150px; }
.j-reasons { display: block; max-width: 970px; margin-top: 75px; }
.j-reasons article { display: flex; min-height: 48vh; flex-direction: column; justify-content: center; border-bottom: 1px solid #c8d1d7; }
.j-reasons h3 { font-size: clamp(40px, 5vw, 72px); }
.j-herself-image { width: min(100%, 820px); }
.j-herself-image img { height: auto; aspect-ratio: 16 / 7; object-position: center 51%; }
.j-future { background: #0b1420; color: #fff; }
.j-future .j-index, .j-future .j-scene-beat span { color: #accad9; }
.j-future-intro { padding-bottom: 55px; }
.j-future-intro p:last-child { color: #c2d1dc; }
.j-future .j-scene-stage { background: #050911; }
.j-future .j-scene-beat { border-color: rgba(188,209,222,.24); }
.j-future .j-scene-beat p { color: #cbd7df; }
.j-future .j-scene-beat:last-child { min-height: 55vh; }
.j-future .j-scene-stage img:nth-child(3) { object-position: 50% 48%; }
.j-future .j-scene-stage img:nth-child(4) { object-position: 50% 57%; }
.j-current { background: #f7f8f8; }

/* Final local-preview adjustments: linger at the origin, pause on each reason, then clear the future image. */
@media (min-width: 1100px) and (prefers-reduced-motion: no-preference) {
  .journey-scrolly .j-origin-grid { min-height: 150vh; align-items: start; }
  .journey-scrolly .j-origin .j-copy { position: sticky; top: 115px; align-self: start; padding-top: 65px; opacity: var(--journey-origin-copy-opacity, 1); }
  .journey-scrolly .j-origin-image { top: 115px; }
  .journey-scrolly .j-why { min-height: 175vh; }
  .journey-scrolly .j-why > .container { min-height: 145vh; }
  .journey-scrolly .j-reasons { position: sticky; top: 19vh; height: 62vh; max-width: none; }
  .journey-scrolly .j-reasons article { position: absolute; inset: 0; min-height: 0; padding: 3vh 0; border-bottom: 0; background: #f8f9f9; }
  .journey-scrolly .j-reasons article:first-child { opacity: var(--why-first-opacity, 1); }
  .journey-scrolly .j-reasons article:last-child { opacity: var(--why-second-opacity, 0); }
  .journey-scrolly .j-reasons h3 { font-size: clamp(52px, 5.2vw, 76px); }
  .journey-scrolly .j-why-note { margin-top: 54vh; }
}
.j-origin { background: linear-gradient(180deg, #f5f7f8 0%, #f5f7f8 72%, #e8e5e1 100%); }
.j-origin-image img { filter: brightness(var(--journey-origin-brightness, 1)); }
.j-origin-title-first, .j-origin-title-second { display: block; }
.journey-origin-active .j-origin .j-index,
.journey-origin-active .j-origin-title-first,
.journey-origin-active .j-origin-title-second,
.journey-origin-active .j-origin-lead,
.journey-origin-active .j-origin-body,
.journey-origin-active .j-origin-caption { opacity: var(--origin-reveal, 0); transform: translateY(calc((1 - var(--origin-reveal, 0)) * 12px)); transition: opacity .18s linear, transform .18s linear; }
.journey-origin-active .j-origin .j-index { --origin-reveal: var(--origin-index, 0); }
.journey-origin-active .j-origin-title-first { --origin-reveal: var(--origin-first, 0); }
.journey-origin-active .j-origin-title-second { --origin-reveal: var(--origin-second, 0); }
.journey-origin-active .j-origin-lead { --origin-reveal: var(--origin-lead, 0); }
.journey-origin-active .j-origin-body, .journey-origin-active .j-origin-caption { --origin-reveal: var(--origin-body, 0); }
.j-final-vision { display: flex; min-height: 100vh; align-items: center; background: #050911; }
.j-final-vision > .container { max-width: 1120px; }
.j-final-vision span { color: #a9cadb; font: 700 10px/1.7 Arial, sans-serif; letter-spacing: .14em; }
.j-final-vision h3 { margin-top: 24px; font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-size: clamp(50px, 6.6vw, 94px); font-weight: 500; line-height: 1.35; }
.j-final-vision p { max-width: 550px; margin-top: 26px; color: #c9d8e1; font-size: 15px; line-height: 2; }
@media (max-width: 699px) { .j-final-vision { min-height: 85vh; } .j-final-vision h3 { font-size: 46px; } .j-final-vision p { font-size: 14px; } }
@media (max-width: 900px) {
  .j-scene-layout { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 4%; }
  .j-scene-stage { top: 80px; height: min(64vh, 520px); min-height: 340px; }
  .j-scene-beat { min-height: 67vh; }
  .j-herself-image { margin-left: 0; }
}
@media (max-width: 699px) {
  .j-scene-intro { padding-bottom: 15px; }
  .j-scene-layout { display: block; }
  .j-scene-stage { display: none; }
  .j-scene-beat { display: block; min-height: 0; padding: 26px 0 42px; }
  .j-scene-beat > div { padding: 0; }
  .j-scene-beat h3 { font-size: 31px; }
  .j-scene-beat p { max-width: none; }
  .j-scene-beat figure { display: block; margin: 23px 0 0; }
  .j-scene-beat img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
  .j-scene-beat figcaption { margin-top: 8px; color: #567187; font: 700 10px/1.6 Arial, sans-serif; letter-spacing: .1em; }
  .j-future .j-scene-beat figcaption { color: #b5d2df; }
  .j-future .j-scene-beat:nth-child(3) img { object-position: center 42%; }
  .j-final-beat { padding-bottom: 14px; }
  .j-turn-image { width: calc(100% - 36px); margin-top: 35px; }
  .j-turn-image img { height: auto; }
  .j-why { padding-block: 85px; }
  .j-reasons { margin-top: 42px; }
  .j-reasons article { min-height: 0; padding: 32px 0; }
  .j-reasons h3 { font-size: 37px; }
  .j-herself-image { width: 100%; }
  .j-herself-image img { aspect-ratio: 16 / 9; }
}
@media (prefers-reduced-motion: reduce) {
  .j-hero-art img, .j-origin-image img { transform: none !important; filter: none !important; }
  .j-scene-layout { display: block; }
  .j-scene-stage { display: none; }
  .j-scene-beat { display: block; min-height: 0; padding: 28px 0; }
  .j-scene-beat figure { display: block; margin-top: 20px; }
  .j-scene-beat img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
  .j-scene-beat figcaption { margin-top: 8px; font-size: 10px; }
  .j-reasons article { min-height: 0; padding: 35px 0; }
}