html { background:#111; scroll-padding-top:0; scroll-snap-type:y proximity; }
.journey-site { background:#111; color:#fff9ef; }
.journey-header { position:fixed; z-index:40; inset:0 0 auto; display:flex; align-items:center; justify-content:space-between; padding:26px 4vw; background:linear-gradient(#1010109c,transparent); }
.journey-header .wordmark { font-size:46px; color:#fff9ef; }
.wordmark span { display:block; margin-top:13px; font:500 10px/1 var(--sans); letter-spacing:.14em; }
.journey-header nav { display:flex; align-items:center; gap:30px; }
.journey-header nav a,.journey-header nav button { font:400 13px var(--sans); color:inherit; text-decoration:none; background:none; border:0; padding:12px 0; cursor:pointer; }
.journey-header nav .journey-book { padding:14px 22px; background:#fff9ef; color:#161512; border-radius:30px; }
.journey-scene { position:relative; min-height:800px; min-height:100svh; isolation:isolate; scroll-snap-align:start; overflow:hidden; background:var(--scene-colour); }
.scene-glow { position:absolute; inset:0; background:linear-gradient(90deg,#0007,transparent 55%,#0005); z-index:-1; }
.scene-photo { position:absolute; top:0; bottom:0; left:32%; width:48%; margin:0; overflow:hidden; z-index:-1; }
.scene-photo img { width:100%; height:100%; object-fit:cover; object-position:center; }
.scene-photo:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#0008,transparent 35%),linear-gradient(90deg,#0002,transparent 45%); }
.scene-topline { position:absolute; top:145px; left:4vw; right:4vw; display:flex; justify-content:space-between; font-size:12px; text-transform:uppercase; letter-spacing:.16em; }
.scene-topline > span:last-child { opacity:.65; }
.scene-copy { position:relative; width:66%; margin-left:9vw; padding-top:clamp(240px,32vh,420px); padding-bottom:200px; pointer-events:none; }
.scene-kicker { font-size:12px; letter-spacing:.2em; text-transform:uppercase; margin:0 0 20px; }
.scene-copy h1,.scene-copy h2 { font:400 clamp(76px,9.7vw,165px)/.88 var(--serif); letter-spacing:-.05em; margin:0; text-shadow:0 3px 40px #0002; }
.scene-copy em,.end-content em { font-weight:400; }
.scene-description { max-width:270px; font-size:15px; line-height:1.6; margin:28px 0 0; text-shadow:0 1px 12px #000; }
.scene-caption { position:absolute; right:4vw; bottom:160px; width:180px; font-size:13px; line-height:1.6; }
.caption-line { display:block; width:32px; height:1px; background:#fff9ef; }
.scene-caption p { margin:18px 0; }
.scene-caption button,.scene-caption a { font:400 13px var(--sans); color:#fff9ef; background:none; border:1px solid #fff8; border-radius:30px; padding:12px 16px; cursor:pointer; text-decoration:none; display:inline-block; }
.scene-caption button[aria-pressed=true] { background:#fff9ef; color:#151515; }
.scene-next { position:absolute; bottom:74px; left:9vw; display:flex; gap:24px; align-items:center; color:inherit; text-decoration:none; font-size:12px; letter-spacing:.04em; }
.scene-next > span:last-child { font-size:24px; }
.journey-rail { position:fixed; z-index:20; right:28px; top:45%; display:grid; gap:4px; }
.journey-rail a { width:26px; height:20px; display:grid; place-items:center; }
.journey-rail a:after { content:''; width:4px; height:4px; border-radius:10px; background:#fff8; transition:height .3s,background .3s; }
.journey-rail a[aria-current=true]:after { height:16px; background:#fff; }
.journey-rail span { position:absolute; opacity:0; pointer-events:none; }
.journey-bottom { position:fixed; bottom:0; left:0; right:0; z-index:20; display:flex; justify-content:space-between; padding:22px 4vw; font-size:11px; letter-spacing:.06em; background:linear-gradient(transparent,#1119); pointer-events:none; }
.journey-end .scene-photo { left:0; width:100%; }
.journey-end .scene-photo:after { background:#111b; }
.end-content { position:relative; text-align:center; padding:180px 24px 95px; }
.end-content h2 { font:400 clamp(65px,8vw,120px)/.95 var(--serif); letter-spacing:-.04em; margin:20px 0 36px; }
.end-book { display:inline-block; padding:18px 30px; border-radius:50px; background:#fff9ef; color:#171717; text-decoration:none; font-size:15px; }
.end-content > p:not(.scene-kicker) { margin-top:30px; font-size:14px; line-height:1.8; }
.end-links { display:flex; gap:24px; justify-content:center; flex-wrap:wrap; margin-top:24px; font-size:13px; }
.end-links a { text-decoration:none; border-bottom:1px solid #fff6; padding-bottom:4px; }
.end-services { background:none; border:0; border-bottom:1px solid #fff6; color:inherit; font-size:14px; padding:10px 0; margin:20px 0; cursor:pointer; }
.end-content small { display:block; font-size:11px; opacity:.7; }
.services-dialog { position:fixed; inset:0 0 0 auto; width:min(760px,100%); max-width:100%; height:100%; max-height:100%; margin:0; border:0; padding:0; background:var(--paper); color:var(--ink); overscroll-behavior:contain; }
.services-dialog::backdrop { background:#000b; backdrop-filter:blur(12px); }
.services-dialog .services { padding:76px 36px 50px; }
.services-dialog .page-width { width:100%; }
.services-dialog .services-grid { display:block; }
.services-dialog .service-panel { margin-top:30px; }
.services-dialog .reveal { opacity:1!important; transform:none!important; }
.services-dialog .services-intro h2 { font-size:48px; }
.dialog-close { position:sticky; z-index:2; float:right; top:16px; margin:16px 20px -60px; width:44px; height:44px; border:1px solid #999; border-radius:50%; font:28px var(--sans); background:var(--paper); cursor:pointer; }
.journey-site:has(.services-dialog[open]) { overflow:hidden; }
@media(min-width:1600px) { .scene-photo { width:43%;left:35%; } }
@media(max-width:1000px) and (min-width:768px) { .scene-caption { right:5vw;width:135px; } .scene-copy { margin-left:5vw; } .journey-header nav { gap:18px; } }
@media(max-width:767px) {
  .journey-header { padding:20px; align-items:start; }
  .journey-header .wordmark { font-size:36px; }
  .wordmark span { font-size:8px; letter-spacing:.1em; margin-top:9px; }
  .journey-header nav { gap:13px; }
  .journey-header nav > a:first-child { display:none; }
  .journey-header nav a,.journey-header nav button { font-size:12px; }
  .journey-header nav .journey-book { padding:11px 14px; }
  .journey-header nav button[data-services-open] { position:fixed; bottom:21px; right:20px; z-index:50; font-size:12px; background:#191919b3; border:1px solid #fff5; padding:10px 15px; border-radius:25px; backdrop-filter:blur(12px); }
  .journey-scene { min-height:760px; min-height:100svh; }
  .scene-photo { inset:0; width:100%; }
  .scene-photo:after { background:linear-gradient(0deg,#000e 0%,#0007 32%,transparent 68%,#0004); }
  .scene-topline { top:112px; left:22px; right:22px; font-size:10px; }
  .scene-topline > span:last-child { display:none; }
  .scene-copy { position:absolute; left:22px; bottom:185px; margin:0; width:calc(100% - 55px); padding:0; }
  .scene-copy h1,.scene-copy h2 { font-size:clamp(58px,16vw,94px); line-height:.9; }
  .scene-kicker { font-size:10px; margin-bottom:14px; }
  .scene-description { font-size:14px; line-height:1.45; max-width:285px; margin-top:18px; }
  .scene-caption { left:22px; right:40px; bottom:100px; width:auto; display:flex; gap:14px; align-items:center; justify-content:space-between; font-size:11px; }
  .caption-line { display:none; }
  .scene-caption p { max-width:160px; margin:0; }
  .scene-caption button,.scene-caption a { font-size:11px; padding:11px 13px; flex-shrink:0; }
  .scene-next { left:22px; bottom:60px; font-size:10px; gap:14px; }
  .scene-next > span:last-child { font-size:18px; }
  .journey-rail { right:8px; top:40%; gap:0; }
  .journey-rail a { width:20px; height:21px; }
  .journey-bottom { padding:24px 22px; font-size:10px; height:60px; }
  .journey-bottom > span:first-child,.journey-counter { display:none; }
  .end-content { padding:160px 24px 110px; }
  .end-content h2 { font-size:64px; }
  .end-content .scene-kicker { font-size:11px; }
  .services-dialog .services { padding:80px 22px 40px; }
  .services-dialog .services-intro h2 { font-size:39px; }
}
@media(max-height:700px) and (min-width:768px) { .journey-scene { min-height:720px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-snap-type:none; } }

.take-home-link { display:block; width:fit-content; margin:22px auto 0; font-size:14px; text-underline-offset:5px; }
@media(max-width:767px) { .journey-header nav .take-home-nav { position:fixed; bottom:21px; left:20px; z-index:50; font-size:12px; background:#191919d9; border:1px solid #fff5; padding:10px 15px; border-radius:25px; } .journey-bottom [data-saved-status] { display:none; } }
