/* A character in the identity, and one memorable product moment. */
html { scroll-padding-top:125px; }
.header { position:sticky; top:0; z-index:40; width:100%; padding-inline:max(50px,calc((100% - 1180px)/2)); background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:0 1px 0 #253c2510; }
.skip { position:fixed; z-index:60; }
.rook { display:block; width:120px; aspect-ratio:374/480; position:relative; flex-shrink:0; }
.rook-image { display:block; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.header .brand-lockup { display:inline-flex; align-items:center; gap:6px; flex-shrink:0; }
.header .brand-lockup .brand-rook { display:block; width:51px; height:44px; flex:none; position:relative; overflow:hidden; margin:-8px 0; mask-image:linear-gradient(#000 84%,transparent 100%); transition:transform .4s cubic-bezier(.22,1,.36,1); }
.header .brand-rook .rook-image { width:51px; height:auto; max-width:none; position:absolute; top:-1px; left:0; }
.header .brand-lockup .brand-wordmark { font:inherit; display:inline; margin:0; color:inherit; letter-spacing:inherit; }
.brand-wordmark em { font-style:normal; display:inline-block; transition:translate .4s cubic-bezier(.22,1,.36,1); }
.brand-lockup:is(:hover,:focus-visible) .brand-rook { transform:translateY(-3px) rotate(-7deg); }
.brand-lockup:is(:hover,:focus-visible) .brand-wordmark em { translate:2px 0; }
.rook-memory { position:absolute; left:1%; top:72px; width:161px; z-index:6; border:0; background:none; padding:0; cursor:pointer; border-radius:45%; }
.rook-memory:focus-visible { outline:2px solid #3f6754; outline-offset:7px; }
.rook-memory .rook-hint { position:absolute; left:50%; bottom:-27px; transform:translateX(-50%); white-space:nowrap; padding:7px 11px; border:1px solid #e0e8dc; border-radius:20px; font:500 10px var(--sans); color:#5b715f; background:#fff; box-shadow:0 3px 12px #24453506; }
.rook-hint svg { width:12px; height:12px; vertical-align:-2px; margin-left:3px; }
.rook-memory:hover .rook-hint { border-color:#8baf96; color:#2b5545; }
.memory-peek { position:absolute; top:51px; left:2%; z-index:20; width:330px; max-width:96%; max-height:calc(100% - 75px); overflow:auto; padding:22px; border:1px solid #dfe7dc; border-radius:24px; background:#fff; box-shadow:0 18px 65px #163c2520; text-align:left; }
.memory-peek[hidden] { display:none; }
.memory-peek-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:18px; }
.memory-peek-heading small { color:#7a8775; display:block; font-size:10px; margin-bottom:5px; }
.memory-peek h3 { font:400 28px/1.1 var(--serif); color:#314d3b; margin:0; }
.memory-peek-close { border:0; background:#f4f6f1; color:#546750; border-radius:50%; width:30px; height:30px; flex-shrink:0; cursor:pointer; font-size:20px; line-height:1; }
.memory-peek details { padding:15px 0; border-top:1px solid #edf0e8; }
.memory-peek details:last-child { padding-bottom:0; }
.memory-peek summary { cursor:pointer; display:flex; align-items:center; gap:10px; color:#4d654f; font-size:12px; font-weight:500; list-style:none; }
.memory-peek summary::-webkit-details-marker { display:none; }
.memory-peek summary::after { content:'+'; font-size:17px; font-weight:400; color:#819779; margin-left:auto; }
.memory-peek details[open] summary::after { content:'−'; }
.memory-peek summary .icon { width:17px; height:17px; color:#879b79; flex-shrink:0; }
.memory-peek details p { font-size:12px; line-height:1.65; color:#687560; padding-left:27px; margin:11px 0 0; }
.memory-peek details p small { display:block; font-size:10px; color:#8a9580; margin-top:5px; }

.memory-scene { perspective:1000px; }
.memory-scene.in-view .floating,.memory-scene.in-view .bubble { animation:none; }
#memory-quote { border-radius:4px; transition:background .25s,box-shadow .25s; }
.memory-scene.is-reading #memory-quote { background:#d6e4c0; box-shadow:0 0 0 4px #d6e4c0; }
.memory-artifact .memory-line:last-of-type { perspective:500px; }
.memory-artifact .memory-line>span { display:inline-block; }
.memory-artifact .new-timing { display:inline-block; transform-origin:50% 0; }
.memory-scene.is-listening .memory-line del { text-decoration:none; opacity:1; }
.memory-scene.is-listening .new-timing,.memory-scene.is-listening .memory-saved { opacity:0; }
.memory-scene.is-listening .memory-artifact .live-dot { background:#b1bd9a; }
.memory-scene.is-turning .new-timing { opacity:0; }
.memory-scene.is-turning .memory-saved { opacity:0; }
.memory-transfer { position:absolute; z-index:15; top:0; left:0; display:block; padding:9px 14px; white-space:nowrap; background:#e3edcf; border:1px solid #c2d3ab; color:#344e2b; box-shadow:0 8px 24px #3650281c; border-radius:10px; font-size:13px; font-weight:500; opacity:0; pointer-events:none; }
.memory-replay { position:absolute; bottom:0; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:7px; border:0; background:none; padding:10px 12px; border-radius:20px; color:#70806c; font-size:12px; cursor:pointer; }
.memory-replay .icon { width:15px; height:15px; }
.memory-replay:hover { color:#2b5545; background:#edf1e8; }
.memory-scene.is-listening .memory-replay { color:#a5ae9c; }
.followup-scene.is-following .bubble,.followup-scene.is-following .repeat-artifact { animation:none; }
.followup-scene.is-following:not(.has-outreach) .bubble.agent,
.followup-scene.is-following:not(.has-reply) .bubble.customer,
.followup-scene.is-following:not(.has-order) .repeat-artifact { opacity:0; }
.industry-prop { width:52px; height:54px; display:grid; place-items:center; margin-bottom:24px; background:#fff; border:1px solid #e3e9dd; border-radius:16px; color:#8a9f7a; transform:rotate(7deg); box-shadow:0 5px 16px #263a1910; transition:translate .6s,rotate .6s,opacity .6s; }
.industry-prop .icon { width:28px; height:28px; stroke-width:1.3; }
.industry-example.filter-wait .industry-prop { translate:8px 4px; rotate:6deg; opacity:.45; }
.industry-example .industry-order { transition:opacity .35s,translate .35s; }
.industry-example.is-updating .industry-order { opacity:0; translate:0 8px; }
.industry-example.filter-wait .industry-result { color:#4e704e; }
.industry-example.filter-wait #industry-memory { color:#405c43; }
.system-memory-mark { display:grid; place-items:center; width:83px; height:83px; border-radius:27px; color:#fff; background:#37513a; box-shadow:inset 0 2px 1px #ffffff40,0 14px 30px #28431d16; margin:0 auto 14px; }
.system-memory-mark .icon { width:39px; height:39px; stroke-width:1.2; }
.system-hub>span:last-child { display:block; }
.systems-visual.is-connecting .context-preview { opacity:0; }
.journey-step.is-visible .context-preview { animation:none; }
.systems-visual.is-connected .system-lines { stroke:#91aa80; }
.loop-node .loop-icon,.loop-node h3 { transition:color .4s,box-shadow .4s,border-color .4s; }
.loop-node.is-current .loop-icon { border-color:#8ea37c; color:#4b6d3e; box-shadow:0 0 0 7px #e7eddf; }
.loop-node.is-current h3 { color:#3e5c34; }
.growth-loop.is-complete .loop-line { stroke:#8ba37d; }
@media (max-width:1100px) and (min-width:761px) {
 .header { padding-inline:32px; }
 .rook-memory { left:-5%; width:139px; top:87px; }
}
@media (max-width:760px) {
 html { scroll-padding-top:103px; }
 .header { padding-inline:20px; }
 .header .brand-lockup { gap:3px; }
 .header .brand-lockup .brand-rook { width:37px; height:33px; }
 .header .brand-rook .rook-image { width:37px; top:0; }
 .hero { grid-template-columns:minmax(0,1fr); }
 .hero .scene { min-width:0; }
 .rook-memory { left:-3px; top:84px; width:119px; }
 .rook-memory .rook-hint { font-size:9px; bottom:-24px; padding:6px 8px; }
 .memory-peek { top:35px; left:0; max-width:100%; width:330px; padding:20px; max-height:calc(100% - 47px); }
 .memory-peek h3 { font-size:26px; }
 .memory-transfer { font-size:11px; padding:8px 11px; }
 .memory-replay { bottom:0; }
 .system-memory-mark { width:62px; height:62px; border-radius:21px; margin-bottom:10px; }
 .system-memory-mark .icon { width:29px; height:29px; }
}
@media (max-width:370px) {
 .header { padding-inline:16px; }
 .header .brand-lockup { font-size:24px; }
 .header .brand-lockup .brand-rook { width:32px; height:29px; }
 .header .brand-rook .rook-image { width:32px; }
 .hero .scene,.scene.memory-scene,.scene.followup-scene { width:100%; max-width:320px; }
 .rook-memory { width:76px; left:-6px; top:90px; }
 .rook-memory .rook-hint { font-size:8px; padding:5px 7px; }
 .memory-peek { padding:17px; }
}
@media (prefers-reduced-motion:reduce) {
 .rook,.brand-rook,.brand-wordmark em,.memory-peek,.industry-prop { animation:none!important; transition:none!important; }
 .brand-lockup:is(:hover,:focus-visible) .brand-rook { transform:none; }
 .brand-lockup:is(:hover,:focus-visible) .brand-wordmark em { translate:none; }
}