/* A visible chapter rail and a separate invitation to scroll. */
.chapter-nav{top:50%;bottom:auto;inset-inline-end:var(--edge);left:auto;right:auto;transform:translateY(-50%);display:flex;flex-direction:column;align-items:stretch;width:184px;gap:2px;padding:6px;border:1px solid #92704485;border-radius:3px;background:#fff2dcde;backdrop-filter:blur(8px);box-shadow:0 5px 24px #49341e0b;direction:inherit}
html[dir=ltr] .chapter-nav{right:var(--edge)}
html[dir=rtl] .chapter-nav{left:var(--edge)}
.chapter-nav button{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;height:auto;min-height:46px;padding:10px 12px;color:#4b3824;border:1px solid transparent;border-radius:1px;font:400 13px/1.35 var(--mono);text-align:start;transition:background .2s,color .2s,border-color .2s}
.chapter-nav .chapter-name{display:block;flex:1;opacity:1;transform:none;color:inherit;font:inherit;white-space:nowrap}
.chapter-nav .chapter-index{display:block;order:-1;flex:0 0 22px;width:22px;font:400 12px/1 'IBM Plex Mono',monospace;letter-spacing:.03em;text-align:start;color:#8a683d}
.chapter-nav .chapter-tick{display:none}
.chapter-nav button:hover{background:#e8d6b6;border-color:#b89a6660;color:#30261b}
.chapter-nav button[aria-current=step]{background:#173b50;border-color:#9d8050;color:#fff5e3;box-shadow:inset 0 -2px 0 #be9957}
.chapter-nav button[aria-current=step] .chapter-index{color:#e4c68f}
.chapter-nav button:focus-visible{outline:2px solid #173b50;outline-offset:3px}
.chapter-copy{top:auto;bottom:116px;width:min(780px,calc(100% - 420px))}
.chapter-copy>.eyebrow{margin-bottom:10px}
.chapter-copy .text-action{margin-top:18px;gap:16px;min-height:44px;padding:10px 2px;font-size:15px;color:#3e2d1c;border-bottom-color:#866139}
.chapter-copy .text-action:hover{color:#173b50;border-bottom-color:#173b50}
.discover-next{gap:16px;min-height:46px;padding:11px 17px;color:#3d2c1b;border:1px solid #a3824b8c;border-radius:2px;background:#fff3dcce;box-shadow:0 2px 12px #492c0c07;font-size:14px;line-height:1.35}
.discover-next:hover{background:#fff6e5;border-color:#846132}
.discover-next>span:last-child{display:block;width:9px;height:9px;flex:0 0 9px;margin-top:-5px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;font-size:0;transform:rotate(45deg);animation:journey-scroll 2.4s ease-in-out infinite}
body[data-chapter="3"] .discover-next>span:last-child{--cue-angle:225deg;--cue-distance:-4px;transform:rotate(225deg);margin-top:4px}
@keyframes journey-scroll{0%,100%{transform:translateY(-1px) rotate(var(--cue-angle,45deg))}50%{transform:translateY(var(--cue-distance,4px)) rotate(var(--cue-angle,45deg))}}
html[data-motion-paused=true] .discover-next>span:last-child{animation-play-state:paused}
.sculpture-hint{display:block;visibility:hidden;opacity:0;pointer-events:none;top:23%;left:50%;transform:translateX(-50%);padding:7px 12px;border:1px solid #ac8b5760;background:#fff2dcde;border-radius:2px;color:#5c442a;font-size:12px;line-height:1.4;transition:opacity .2s,visibility .2s}
@media(hover:hover) and (min-width:761px) and (min-height:651px){html:not([data-view=services]) body[data-chapter="0"] .room-sculpture:hover + .sculpture-hint{visibility:visible;opacity:1}}
html:lang(ar) .chapter-nav button{font-size:19px;line-height:1.4}
html:lang(ar) .chapter-copy .text-action{font-size:20px}
html:lang(ar) .discover-next{font-size:18px;line-height:1.4}
@media(min-width:761px) and (max-width:1100px){
 .chapter-nav{width:162px;padding:5px}
 .chapter-nav button{padding-inline:10px;gap:8px;font-size:12px}
 .chapter-copy{width:calc(100% - 380px)}
 .chapter-copy h1,.chapter-copy h2{font-size:44px}
 html:lang(ar) .chapter-nav button{font-size:18px}
}
@media(min-width:761px) and (max-height:700px){
 .chapter-copy{bottom:96px}
 .chapter-copy h1,.chapter-copy h2{font-size:36px;line-height:1.02}
 .chapter-copy .text-action{margin-top:10px}
 .chapter-nav{top:44%}
 html:lang(ar) .chapter-copy h1,html:lang(ar) .chapter-copy h2{font-size:27px;line-height:1.4}
}
@media(max-width:760px){
 .chapter-nav,html[dir=ltr] .chapter-nav,html[dir=rtl] .chapter-nav{position:absolute;top:auto;bottom:64px;left:16px;right:16px;inset-inline:16px;width:auto;transform:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0;border-radius:3px;background:#fff1dce8;box-shadow:0 4px 18px #49341e0b;direction:inherit}
 .chapter-nav button{display:flex;flex-direction:column;justify-content:center;gap:5px;min-height:58px;padding:8px 4px;border:0;border-inline-end:1px solid #b7966352;border-radius:0;font-size:11px;line-height:1.25;text-align:center}
 .chapter-nav button:last-child{border-inline-end:0}
 .chapter-nav .chapter-name{display:block;flex:0 0 auto;white-space:normal;text-align:center;color:inherit;font:inherit}
 .chapter-nav .chapter-index{display:block;order:-1;flex:0 0 auto;width:auto;font-size:11px;text-align:center}
 .chapter-nav button[aria-current=step]{box-shadow:inset 0 -2px 0 #d0ac68}
 .chapter-copy,.chapter-copy[data-chapter="0"]{top:auto;bottom:148px;width:calc(100% - 36px)}
 .chapter-copy h1,.chapter-copy h2{font-size:clamp(31px,8.2vw,42px);line-height:1.05;letter-spacing:-.025em}
 .chapter-copy .eyebrow{font-size:12px;line-height:1.4;max-width:100%;margin-bottom:9px}
 .chapter-copy .text-action,.chapter-copy[data-chapter="0"] .text-action{font-size:14px;line-height:1.4;min-height:44px;margin-top:13px;padding:10px 2px}
 .room-sculpture{top:34.5%;width:min(82vw,39svh);height:min(82vw,39svh)}
 .floor-shadow{top:56%;width:48vw}
 .sculpture-hint{display:none}
 .room-footer{inset-inline:16px;bottom:8px;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px}
 .room-footer .place{display:none}
 .room-footer .discover-next{position:static;inset:auto;transform:none;min-height:44px;max-width:calc(100% - 100px);gap:11px;padding:7px 10px;font-size:12px;line-height:1.3;white-space:normal}
 .room-footer .discover-next>span:first-child{text-align:start}
 .room-footer .discover-next>span:last-child{flex-basis:8px;width:8px;height:8px;margin-inline:3px}
 .room-footer .motion-toggle{min-height:44px;padding:8px 0;font-size:11px;line-height:1.35;gap:6px;white-space:nowrap}
 html:lang(ar) .chapter-nav button{font-size:16px;line-height:1.2}
 html:lang(ar) .chapter-copy h1,html:lang(ar) .chapter-copy h2{font-size:28px;line-height:1.45}
 html:lang(ar) .chapter-copy .eyebrow{font-size:16px;line-height:1.4;margin-bottom:7px}
 html:lang(ar) .chapter-copy .text-action{font-size:18px;line-height:1.4;margin-top:11px}
 html:lang(ar) .room-footer .discover-next{font-size:17px;line-height:1.4;max-width:calc(100% - 99px)}
 html:lang(ar) .room-footer .motion-toggle{font-size:15px;line-height:1.4}
}
@media(max-width:760px) and (max-height:740px){
 .room-sculpture{top:36%;width:min(72vw,32svh);height:min(72vw,32svh)}
 .floor-shadow{top:51%}
 .chapter-copy,.chapter-copy[data-chapter="0"]{bottom:142px}
 .chapter-copy h1,.chapter-copy h2,.chapter-copy[data-chapter="0"] h1{font-size:30px;line-height:1.05}
 .chapter-copy[data-chapter="0"]>.eyebrow{font-size:11px;margin-bottom:6px}
 .chapter-copy .text-action,.chapter-copy[data-chapter="0"] .text-action{font-size:13px;min-height:44px;margin-top:8px}
 html:lang(ar) .chapter-copy h1,html:lang(ar) .chapter-copy h2,html:lang(ar) .chapter-copy[data-chapter="0"] h1{font-size:23px;line-height:1.4}
 html:lang(ar) .chapter-copy[data-chapter="0"]>.eyebrow{font-size:14px;margin-bottom:5px}
 html:lang(ar) .chapter-copy .text-action{font-size:17px;min-height:44px;margin-top:8px}
}
@media(max-width:360px){
 .chapter-nav,html[dir=ltr] .chapter-nav,html[dir=rtl] .chapter-nav{inset-inline:12px}
 .chapter-copy,.chapter-copy[data-chapter="0"]{width:calc(100% - 28px)}
 .room-footer{inset-inline:12px;gap:8px}
 .room-footer .discover-next{font-size:11px;padding-inline:9px;gap:9px}
 .room-footer .motion-toggle{font-size:10px}
 html:lang(ar) .chapter-nav button{font-size:15px}
 html:lang(ar) .room-footer .discover-next{font-size:16px}
 html:lang(ar) .room-footer .motion-toggle{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.discover-next>span:last-child{animation:none}.chapter-nav button,.sculpture-hint{transition:none}}

/* Keep the sculpture clear of the headline on desktop as well. */
@media(min-width:761px){
 html:not([data-view=services]) .room-sculpture{top:35%;width:min(43vw,49svh,560px);height:min(43vw,49svh,560px)}
 html:not([data-view=services]) .floor-shadow{top:59%}
}
@media(min-width:761px) and (max-height:780px){
 html:not([data-view=services]) .room-sculpture{top:33.5%;width:46svh;height:46svh}
 html:not([data-view=services]) .floor-shadow{top:54%}
}
