.atl .chapter .journey{--journey-top: calc(var(--guide-bar-h, 74px) + 16px);--journey-top-sm: var(--guide-bar-h, 74px)}.atl .journey{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 48px;gap:clamp(24px,4vw,64px);margin-top:clamp(40px,6vw,80px)}.atl .journey__stage{position:sticky;top:var(--journey-top, 40px);display:grid;justify-items:center;align-content:center;gap:14px;height:calc(100vh - 120px);max-height:640px}.atl .journey__canvas{position:relative;width:min(100%,440px);aspect-ratio:1}.atl .journey__canvas canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .6s var(--ease)}.atl .journey__canvas.is-ready canvas{opacity:1}.atl .journey__label{margin:0;color:var(--muted);font-size:11px;letter-spacing:.22em;text-transform:uppercase}.atl .journey__panels{margin:0;padding:0;list-style:none}.atl .journey__panel{display:grid;align-content:center;gap:10px;min-height:78vh;opacity:.25;transition:opacity .5s var(--ease)}.atl .journey__panel.is-active{opacity:1}.atl .journey__panel p{margin:0;color:var(--muted);font-size:15.5px;max-width:30rem}.atl .journey__step{display:flex;align-items:center;gap:12px;font-size:11px!important;letter-spacing:.2em;text-transform:uppercase}.atl .journey__step span:first-child{color:var(--accent-deep);font-weight:600}.atl .journey__step span+span:before{content:"";display:inline-block;width:24px;height:1px;margin-right:12px;vertical-align:middle;background:var(--line-strong)}.atl .journey__title{font-family:var(--font-display);font-size:clamp(28px,3.2vw,42px);line-height:1.08}.atl .journey__title em{font-style:normal;color:var(--accent)}.atl .journey__index{position:sticky;top:50vh;align-self:start;display:grid;gap:14px;margin:0;padding:0;list-style:none;transform:translateY(-50%)}.atl .journey__index li{display:flex;align-items:center;justify-content:flex-end;gap:8px;color:var(--muted);font-family:var(--font-display);font-size:14px;opacity:.6;transition:opacity .3s var(--ease),color .3s var(--ease)}.atl .journey__index li:after{content:"";width:14px;height:1px;background:currentColor;transition:width .3s var(--ease)}.atl .journey__index li.is-active{color:var(--accent-deep);opacity:1}.atl .journey__index li.is-active:after{width:28px}.atl .journey__fallback{position:absolute;top:14%;right:14%;bottom:14%;left:14%;display:grid;place-items:center;transition:opacity .6s var(--ease)}.atl .journey__canvas.is-ready .journey__fallback{opacity:0}.atl .journey__fallback span{width:100%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c9c4bc,#9e988f 70%);-webkit-mask:radial-gradient(circle,transparent 0,transparent var(--hole, 0%),#000 calc(var(--hole, 0%) + 1%));mask:radial-gradient(circle,transparent 0,transparent var(--hole, 0%),#000 calc(var(--hole, 0%) + 1%));transition:background .6s var(--ease),--hole .6s var(--ease)}.atl [data-stage="1"] .journey__fallback span{--hole: 52%;background:radial-gradient(circle at 35% 30%,#ebe7df,#cfc9be 70%)}.atl [data-stage="2"] .journey__fallback span{--hole: 52%;background:radial-gradient(circle at 35% 30%,#fff1e9,#f3a07c 75%);box-shadow:0 0 60px #ff8a5c73}.atl [data-stage="3"] .journey__fallback span{--hole: 52%;background:conic-gradient(from 200deg,#8b9099,#f4f6f8,#a3a8b0,#e6e9ed,#8b9099)}@media(max-width:989px){.atl .journey{grid-template-columns:1fr;gap:0}.atl .journey__stage{top:var(--journey-top-sm, 0px);z-index:1;height:auto;max-height:none;padding:12px 0;background:var(--bg)}.atl .journey__canvas{width:min(56vw,240px)}.atl .journey__panel{min-height:70vh;padding-top:34vh;align-content:start;text-align:center;justify-items:center}.atl .journey__index{display:none}}@media(prefers-reduced-motion:reduce){.atl .journey__panel{opacity:1}}.atl .making{background:var(--bg)}.atl .making.atl-space{padding-top:clamp(40px,5vw,72px)}.atl .making__head{display:grid;justify-items:start;gap:14px}.atl .making__head .h2{max-width:16ch}.atl .making__text{max-width:34rem;margin:0;color:var(--muted);font-size:17px;line-height:1.6}.atl .making__link{display:inline-flex;align-items:center;gap:8px;color:var(--accent-deep);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}.atl .making__link:hover{text-decoration:underline;text-underline-offset:4px}.atl .making__link .icon{width:15px;height:15px}.atl .making .journey{margin-top:clamp(16px,3vw,40px)}
/*# sourceMappingURL=/cdn/shop/t/11/assets/atl-journey.css.map */