/* The process becomes an unfolding atelier, with native scroll and touch. */
.process{--stage-color:#edb0a4;--stage-wash:#9e645b;--journey-progress:0;overflow:clip;background:#102f2e;transition:background 1.4s}
.process[data-stage="1"]{--stage-color:#cbb8df;--stage-wash:#8a719a;background:#1d3038}.process[data-stage="2"]{--stage-color:#d8ff48;--stage-wash:#8cae22;background:#243b36}.process[data-stage="3"]{--stage-color:#afd1bb;--stage-wash:#6e9d89;background:#123b34}
.process .process-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10%;align-items:start}.process-sticky{top:112px}.process-sticky h2{font-size:clamp(48px,5.1vw,80px);line-height:.94}.process-sticky h2 em{color:var(--stage-color);transition:color 1.2s}
.atelier-scene{position:relative;isolation:isolate;perspective:1200px;height:425px;margin-top:25px;display:grid;place-items:center;--scene-x:0deg;--scene-y:0deg;--lens-x:50%;--lens-y:50%;--scene-light:0;--scene-zoom:1.03}
.atelier-wash{position:absolute;inset:1% -12%;background:radial-gradient(ellipse,var(--stage-wash),transparent 65%);opacity:.48;transition:background 1.2s,scale 1s;pointer-events:none}.atelier-orbit{position:absolute;width:370px;height:360px;max-width:110%;border:1px solid #f7f1df20;border-radius:49% 51% 55% 45%;rotate:calc(var(--journey-progress)*55deg);transition:rotate 1.5s var(--ease);pointer-events:none}
.atelier-paper{position:relative;width:300px;max-width:78%;padding:10px 10px 0;background:var(--paper);color:var(--ink);transform:rotate(-5deg) rotateX(var(--scene-x)) rotateY(var(--scene-y));box-shadow:0 24px 60px #0004;transition:transform .8s var(--ease),box-shadow .6s;transform-style:preserve-3d}
.atelier-window{position:relative;overflow:hidden;aspect-ratio:1/1.09;background:#c8c6ae}.atelier-window>img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;scale:var(--scene-zoom);transition:scale 1.5s var(--ease)}.atelier-paper figcaption{font:italic 21px/1.2 var(--serif);padding:12px 4px 13px;text-align:center;min-height:51px}
.atelier-sheen{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--lens-x) var(--lens-y),#fff6da70,transparent 62%);mix-blend-mode:soft-light;opacity:var(--scene-light);transition:opacity .5s}.atelier-lens{position:absolute;inset:0;opacity:0;clip-path:circle(25% at var(--lens-x) var(--lens-y));transition:opacity .7s;pointer-events:none}.atelier-lens img{width:100%;height:100%;object-fit:cover;transform:scale(1.55);transform-origin:var(--lens-x) var(--lens-y)}.process[data-stage="2"] .atelier-scene.is-pointed .atelier-lens{opacity:1}
.atelier-spark{position:absolute;font:48px/1 var(--serif);color:var(--stage-color);transition:rotate 1.1s,scale 1.1s;pointer-events:none}.spark-a{left:5%;top:10%}.spark-b{right:5%;bottom:18%;font-size:32px}.atelier-scene-label{position:absolute;bottom:6px;left:0;font-size:12px;letter-spacing:1.5px;color:var(--stage-color)}.atelier-progress{position:absolute;bottom:10px;right:0;height:1px;width:31%;background:#f7f1df30}.atelier-progress>span{display:block;width:100%;height:2px;background:var(--stage-color);transform:scaleX(var(--journey-progress));transform-origin:left;transition:transform 1.2s var(--ease),background 1s}
.process-chapters{display:flex;gap:7px;margin-top:18px}.process-chapters button{min-height:48px;flex:1;display:flex;gap:7px;align-items:center;justify-content:center;border:1px solid #f7f1df27;color:#e7e7d9;font-size:12px;transition:background .5s,color .5s,border-color .5s}.process-chapters button>span:first-child{font:italic 19px var(--serif)}.process-chapters button[aria-pressed="true"]{background:var(--stage-color);border-color:var(--stage-color);color:var(--ink)}.process-chapters button:hover{border-color:var(--stage-color)}.process-invitation{font:italic 20px var(--serif);color:#d3d7c9;margin-top:14px}
.process .steps article{min-height:405px;padding:36px 0 68px;gap:24px;opacity:1;transform:none;isolation:isolate;--step-light-x:50%;--step-light-y:40%;--local-progress:0;scroll-margin-top:18px}.process .steps article:before{transform:scaleX(var(--local-progress));height:2px;background:var(--stage-color);transition:transform .2s linear,background 1s}.process .steps article:after{content:'';position:absolute;inset:-18px -25px 24px;border-radius:8px;background:radial-gradient(ellipse at var(--step-light-x) var(--step-light-y),color-mix(in srgb,var(--stage-wash) 29%,transparent),transparent 68%);opacity:0;z-index:-1;transition:opacity .8s;pointer-events:none}.process .steps article.is-current:after{opacity:1}.process .steps article>span{color:var(--stage-color);font-size:25px;transform:none;transition:color 1s,translate .8s}.process .steps article.is-current>span{translate:0 -4px}
.process .steps article h3{margin:0 0 22px;font-size:clamp(37px,3.6vw,60px)}.process-step-copy{min-width:0;flex:1}.process-step-button{font:inherit;line-height:.98;letter-spacing:-.035em;text-align:left;position:relative;display:block;width:100%;color:#d7ddd2;padding-right:24px;transition:color .6s,translate .8s}.is-current .process-step-button{color:var(--paper)}.process-step-arrow{position:absolute;right:0;top:5px;font:25px var(--sans);opacity:.2;transform:rotate(0);transition:opacity .6s,transform .6s,color .6s}.is-current .process-step-arrow{opacity:1;transform:rotate(45deg);color:var(--stage-color)}.process .steps article p{font-size:16px;line-height:1.65;max-width:380px}.process-inkline{display:flex;align-items:center;gap:17px;margin-top:30px;color:var(--stage-color);font-size:12px;letter-spacing:1.4px;opacity:.55;transition:opacity .5s}.is-current .process-inkline{opacity:1}.process-inkline i{display:block;width:38px;height:1px;background:currentColor;transform-origin:left;transform:scaleX(.45);transition:transform 1s var(--ease)}.is-current .process-inkline i{transform:scaleX(1)}.process-mobile-art{display:none}.process .unique{margin-top:30px}
@media(hover:hover) and (pointer:fine){.atelier-scene.is-pointed .atelier-paper{transform:rotate(-1deg) translateY(-9px) rotateX(var(--scene-x)) rotateY(var(--scene-y));box-shadow:0 35px 65px #0005}.atelier-scene.is-pointed .atelier-wash{scale:1.15}.atelier-scene.is-pointed .spark-a{rotate:90deg;scale:1.15}.atelier-scene.is-pointed .spark-b{rotate:-90deg;scale:.85}.process-step-button:hover{translate:4px 0}}
.sound-dock{position:fixed;bottom:22px;left:22px;z-index:31;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 90px);background:#123532ec;color:var(--paper);border:1px solid #f7f1df40;border-radius:28px;backdrop-filter:blur(10px);box-shadow:0 5px 20px #0002;padding-right:0}.sound-dock button{display:flex;align-items:center;gap:10px;min-height:44px;padding:10px 16px;font-size:12px;white-space:nowrap}.sound-waves{display:flex;gap:3px;align-items:center;height:16px}.sound-waves i{display:block;height:4px;width:2px;background:var(--blush);border-radius:2px;transform-origin:center}.sound-waves i:nth-child(2){height:12px}.sound-waves i:nth-child(3){height:16px}.sound-waves i:nth-child(4){height:8px}.sound-dock[data-playing="true"] .sound-waves i{animation:sound-wave 1.8s ease-in-out infinite alternate}.sound-waves i:nth-child(2){animation-delay:-.4s!important}.sound-waves i:nth-child(3){animation-delay:-.9s!important}.sound-waves i:nth-child(4){animation-delay:-1.3s!important}@keyframes sound-wave{to{transform:scaleY(.25)}}.sound-volume:not([hidden]){display:flex;align-items:center;padding-right:15px}.sound-volume input{width:65px;accent-color:var(--blush);height:30px}.sound-dock[data-playing="true"] button{padding-right:2px}body:has(dialog[open]) .sound-dock{visibility:hidden}
@media(min-width:701px) and (max-height:800px){.process-sticky{top:100px}.process-sticky h2{font-size:48px}.atelier-scene{height:300px;margin-top:14px}.atelier-paper{width:226px}.atelier-paper figcaption{font-size:17px;min-height:40px;padding:9px 0}.atelier-orbit{width:270px;height:270px}.atelier-scene-label{font-size:11px}.process-invitation{display:none}}
@media(min-width:701px) and (max-width:1000px){.process .process-layout{gap:7%}.process-sticky h2{font-size:48px}.atelier-scene{height:350px}.atelier-paper{max-width:86%;width:250px}.atelier-orbit{max-width:100%}.atelier-spark{font-size:34px}.spark-a{left:0}.spark-b{right:0}.process-chapters button>span:last-child{display:none}.process .steps article{gap:15px;min-height:370px}.process .steps article h3{font-size:36px}.process .steps article p{font-size:15px}.process .steps article:after{inset:0 -8px 24px}.process-step-button{padding-right:14px}.process-step-arrow{font-size:19px}}
@media(max-width:700px){.process{padding-top:56px}.process .process-layout{display:block}.process-sticky{position:relative;top:0}.process-sticky h2{font-size:clamp(55px,14.8vw,78px)}.atelier-scene{display:none}.process-chapters{margin:26px 0 12px;gap:8px}.process-chapters button{min-height:8px;height:8px;padding:0;border:0;border-radius:8px;background:#f7f1df35;font-size:0;overflow:hidden}.process-chapters button>span{display:none}.process-chapters button[aria-pressed="true"]{background:var(--stage-color)}.process-chapters button>span:last-child{display:none}.process-invitation{display:none}.process .steps article{display:block;position:relative;min-height:0;padding:28px 0 32px;text-align:center;scroll-margin-top:15px}.process .steps article h3{font-size:clamp(34px,9.5vw,52px);margin-bottom:21px}.process .steps article p{max-width:34ch;margin:0 auto;font-size:16px;line-height:1.65}.process .steps article>span{position:absolute;top:31px;left:0;font-size:18px}.process-step-button{padding:0 30px;text-align:center}.process-step-arrow{font-size:20px;top:2px}.process .steps article:after{inset:0 -20px 30px}.process-mobile-art{display:block;position:relative;width:100%;max-width:480px;margin:20px auto 0;background:var(--paper);color:var(--ink);padding:7px;transform:rotate(calc((1 - var(--local-progress))*-5deg));transition:transform .4s;box-shadow:0 20px 35px #0003}.process-mobile-art img{width:100%;aspect-ratio:1/1.08;object-fit:cover;clip-path:inset(calc((1 - var(--local-progress))*24%) 0 0);transition:clip-path .3s}.process-mobile-art figcaption{font:italic 19px/1.2 var(--serif);text-align:center;padding:10px 0 4px}.process-inkline{display:none}.process .unique{margin-top:0}.sound-dock{left:18px;bottom:82px;max-width:calc(100vw - 83px)}.sound-dock button{padding:10px 13px;font-size:12px}.sound-volume input{width:56px}.sound-volume:not([hidden]){padding-right:12px}.sound-dock{gap:7px}}
html[data-motion="off"] .atelier-paper,html[data-motion="off"] .process-mobile-art{transform:none!important}html[data-motion="off"] .process-mobile-art img{clip-path:none!important}html[data-motion="off"] .atelier-lens,html[data-motion="off"] .atelier-sheen{display:none}html[data-motion="off"] .process-step-button,html[data-motion="off"] .process-number{translate:none!important}html[data-motion="off"] .atelier-window>img{scale:1!important}
@media(prefers-reduced-motion:reduce){.atelier-paper,.process-mobile-art{transform:none!important}.process-mobile-art img{clip-path:none!important}.atelier-lens,.atelier-sheen{display:none}.process-step-button,.process-number{translate:none!important}.atelier-window>img{scale:1!important}}

@media(min-width:701px) and (max-height:700px){.process-sticky{position:relative;top:0}.atelier-scene{height:300px}.process-sticky h2{font-size:48px}}
