/* A connected picture-book journey, with the customer's change at its centre. */
.story-scene{position:relative;margin:0;perspective:1100px;isolation:isolate}
.story-scene img{width:100%;height:100%;object-fit:contain;transform-origin:50% 75%;filter:drop-shadow(0 20px 20px #785d3a0b)}
.story-scene:before{content:"";position:absolute;inset:13% 0 1%;z-index:-1;background:radial-gradient(ellipse,#ead5aa45,transparent 67%);border-radius:50%}
.story-scene figcaption{font-size:13px;letter-spacing:.13em;color:var(--muted);text-align:center;padding-top:12px}
.story-scene .chapter-number{color:var(--orange);font-family:Georgia,serif;font-style:italic;margin-right:9px}
.hero-visual{padding:0}
.hero-scene{height:440px}
.hero-scene img{height:390px}
.hero-words{text-align:center;padding:0;margin:0 0 14px;font-size:18px}
.story-welcome-note{position:absolute;top:24%;right:4%;font-family:var(--serif);font-size:20px;line-height:1.9;letter-spacing:.10em;writing-mode:vertical-rl}
.story-welcome-note span{display:block}
.worries .section-intro{display:block}
.worries .section-intro h2{font-size:clamp(30px,3.2vw,44px)}
.worry-story{display:grid;grid-template-columns:.95fr 1.05fr;align-items:center;gap:55px}
.worry-story .worry-list{margin:0}
.worry-story .worry-tag{display:none}
.worry-story .worry-list>a{grid-template-columns:27px 1fr;gap:18px;padding-block:25px}
.worry-scene{height:385px}
.worry-scene img{height:335px}
.worries .worry-end{margin-left:calc(47.5% + 28px)}
.story-chapter-intro{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:60px;margin-bottom:65px}
.story-chapter-intro .section-intro{margin:0}
.story-chapter-intro .story-scene{height:380px}
.story-chapter-intro .story-scene img{height:335px}
.story-chapter-intro .section-intro>p:last-child{max-width:31em}
.story-caption{font-size:14px;color:var(--muted);margin-top:23px;line-height:2}
.approach-scene{margin-top:25px;height:315px}
.approach-scene img{height:275px}
.approach-title{position:relative;top:auto}
.story-guide-note{display:flex;align-items:center;gap:18px;margin-top:22px;padding-top:18px;border-top:1px solid #64726b30}
.story-guide-note img{width:90px;height:90px;object-fit:contain;flex-shrink:0}
.story-guide-note p{font-size:13px;line-height:1.9;color:var(--muted)}
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center;text-align:left}
.contact .contact-story-copy{text-align:left}
.contact .contact-story-copy h2{font-size:clamp(30px,3.15vw,43px)}
.future-scene{height:430px}
.future-scene img{height:370px}
.future-scene figcaption{font-family:var(--serif);font-size:19px;color:var(--ink);letter-spacing:.06em}
.spatial-ready .hero-art{mask-image:none}
@media(min-width:901px){.approach-title{align-self:start}.story-guide-note{max-width:450px}}
@media(max-width:1000px){.worry-story{gap:28px}.story-chapter-intro{gap:32px}.hero-scene{height:355px}.hero-scene img{height:310px}.story-welcome-note{font-size:16px;right:0}.contact .wrap{gap:30px}.future-scene{height:335px}.future-scene img{height:285px}}
@media(max-width:700px){
 .hero h1{font-size:clamp(26px,8.1vw,53px);white-space:nowrap}
 .hero{gap:26px;padding-top:40px}.hero-visual{padding:0}.hero-words{position:static;text-align:center;font-size:15px;margin:0 0 2px}.hero-scene{height:305px}.hero-scene img{height:270px}.story-welcome-note{right:5%;top:24%;font-size:16px}.story-scene figcaption{font-size:12px;letter-spacing:.06em;padding-top:4px}
 .worry-story,.story-chapter-intro{display:flex;flex-direction:column;gap:25px}.worry-story .worry-list{width:100%}.worry-story .story-scene{width:100%;height:260px;max-width:400px}.worry-scene img{height:225px}.worries .worry-end{margin-left:0}.worries .section-intro h2{font-size:30px}.worry-story .worry-list>a{padding-block:21px}
 .story-chapter-intro{align-items:stretch;margin-bottom:32px}.story-chapter-intro .story-scene{height:265px;width:100%;max-width:400px;align-self:center}.story-chapter-intro .story-scene img{height:230px}.story-caption{font-size:14px;margin-top:20px}
 .approach-scene{max-width:420px;height:260px;margin:25px auto 0}.approach-scene img{height:225px}.story-guide-note{display:none}.approach-body{padding-top:32px}
 .contact .wrap{display:flex;flex-direction:column;gap:35px}.contact .contact-story-copy{text-align:center}.contact .contact-story-copy h2{font-size:30px}.future-scene{height:290px;width:100%;max-width:420px}.future-scene img{height:235px}.future-scene figcaption{font-size:17px}
}
@media(prefers-reduced-motion:reduce){.story-scene img,.story-welcome-note{transform:none!important;opacity:1!important}}
.journey-gap{display:none}
.walking-ready .hero-scene>img{opacity:0!important}
.walking-ready .journey-gap{display:block;height:180px}
#walking-guide{position:fixed;left:0;top:0;pointer-events:none;z-index:4;will-change:transform;contain:layout style;visibility:hidden}
/* Keep travelling art above the canvas, but behind all page content. */
.spatial-background{z-index:-2}
#walking-guide.is-travelling{z-index:-1}
#walking-guide[hidden]{display:none}
#walking-guide .walking-idle,#walking-guide .walking-frames{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
#walking-guide .walking-frames{background-image:url("assets/guide-walk-sheet.png");background-repeat:no-repeat;background-size:300% 200%;opacity:0;transform:scaleX(-1)}
@media(min-width:701px){
 .walking-ready .worries{display:grid;grid-template-columns:.95fr 1.05fr;column-gap:55px}
 .walking-ready .worries .section-intro{grid-column:2;grid-row:1;margin-bottom:30px}
 .walking-ready .worry-story{display:contents}
 .walking-ready .worry-scene{grid-column:1;grid-row:1 / span 2;align-self:center;width:100%}
 .walking-ready .worry-list{grid-column:2;grid-row:2}
 .walking-ready .worries .worry-end{grid-column:2;margin-left:0}
}
@media(max-width:700px){.walking-ready .journey-gap{height:65px}.walking-ready .worries .section-intro{padding-left:50px}}
@media(prefers-reduced-motion:reduce){#walking-guide{display:none!important}.journey-gap{display:none!important}}

/* The later chapters share the same travelling guide. */
.delivery-chapter{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px;margin:85px auto 20px;max-width:950px}
.delivery-scene{height:355px}
.delivery-scene>img{height:310px}
.delivery-copy{font-family:var(--serif);font-size:clamp(24px,2.3vw,30px);line-height:1.9}
.delivery-copy>span{display:inline-block}
.delivery-message{position:absolute;z-index:2;font-size:12px;white-space:nowrap;padding:8px 13px;border:1px solid #aebfaa;background:#fffdf4;border-radius:15px;color:var(--ink);box-shadow:0 6px 18px #2143420a}
.message-one{top:12%;left:0;transform:rotate(-5deg)}
.message-two{right:0;top:52%;transform:rotate(4deg)}
.journey-atlas{display:none;position:absolute;pointer-events:none;overflow:visible}
.journey-atlas .atlas-crop{position:absolute;background-repeat:no-repeat}
.journey-art-ready .journey-atlas{display:block}
.journey-art-ready .story-chapter-intro .story-scene>img,.journey-art-ready .approach-scene>img{opacity:0!important}
.journey-art-ready .future-scene>img{opacity:0!important}
.journey-ready .contact{padding-bottom:calc(100px + 42vh)}
.journey-art-ready .delivery-scene>img{opacity:0!important;transform:none!important}
.journey-ready .delivery-message{opacity:var(--delivery-visible,0);translate:0 calc((1 - var(--delivery-progress,0)) * 14px)}
.journey-ready .story-guide-note{display:none}
.journey-ready .story-chapter-intro{margin-bottom:180px}
@media(max-width:1000px){
 .journey-ready .examples>.wrap,.journey-ready .approach>.wrap,.journey-ready .support,.journey-ready .consultation>.wrap,.journey-ready .faq{padding-left:32px}
 .delivery-chapter{gap:30px}
 .delivery-scene{height:290px}.delivery-scene>img{height:245px}
 .delivery-message{font-size:10px;padding:6px 9px}
}
@media(max-width:700px){
 .journey-ready .worry-list,.journey-ready .worry-end{padding-left:32px}
 .journey-ready .story-chapter-intro{margin-bottom:150px}
 .delivery-chapter{display:flex;flex-direction:column;gap:20px;margin:65px auto 25px}
 .delivery-scene{width:100%;height:300px}.delivery-scene>img{height:260px}
 .delivery-copy{font-size:25px;align-self:center}
 .delivery-message{font-size:10px;padding:6px 8px}
 .journey-ready .case-step h3{font-size:clamp(22px,6.7vw,27px)}
 .journey-ready .approach-title h2{font-size:clamp(24px,7.5vw,30px)}
 .journey-ready .approach-title h2 br:first-child{display:initial}
 .journey-ready .case-heading{gap:10px}
 .journey-ready .offer-heading{flex-wrap:wrap}
 .journey-ready .future-scene figcaption{font-size:15px}
}
@media(prefers-reduced-motion:reduce){.journey-art-ready .story-chapter-intro .story-scene>img,.journey-art-ready .approach-scene>img,.journey-art-ready .future-scene>img{opacity:0!important}.delivery-scene>img,.delivery-message{opacity:1!important;transform:none!important;translate:none!important}}