.hero-layout{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);column-gap:40px}
.hero-art{display:block;min-width:0}
.hero-art img{max-width:none;aspect-ratio:3/2;width:100%}
.hero h1{font-size:clamp(40px,4.4vw,64px)}
.work-demo{margin:16px auto 0;max-width:460px}
.work-demo-label{font-size:13px;color:var(--muted)}
.work-stages{display:flex;align-items:center;gap:10px;margin:10px 0}
.work-stages button{background:transparent;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:8px 4px;min-height:44px;font-size:14px;font-weight:600}
.work-stages button[aria-pressed=true]{color:#174fc5;border-color:var(--blue)}
.work-stages>span{color:var(--muted)}
#work-result{font-size:14px;min-height:48px;color:var(--ink)}
.motion-toggle{background:transparent;border:0;color:var(--muted);text-decoration:underline;text-underline-offset:4px;font-size:12px;min-height:44px;padding:8px 0}
.constructor-mini{display:block;width:76px;height:76px;margin-bottom:12px;background-image:url(etapy.webp);background-size:200% 200%;mix-blend-mode:multiply}
.scene-0{background-position:0 0}.scene-1{background-position:100% 0}.scene-2{background-position:0 100%}.scene-3{background-position:100% 100%}
.journey{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:start}
.journey-art{position:sticky;top:110px;margin:0}
.journey-scenes{position:relative;aspect-ratio:1;max-width:420px;margin:auto;background:var(--soft);isolation:isolate}
.journey-frame{position:absolute;inset:0;background-image:url(etapy.webp);background-size:200% 200%;opacity:0;transition:opacity .55s ease}
.journey-frame.active{opacity:1}
.journey-art figcaption{display:flex;justify-content:space-between;border-top:1px solid #b6bdbf;padding-top:14px;font-weight:600}
#journey-count{font-size:14px;font-variant-numeric:tabular-nums;color:var(--muted)}
.journey-nav{display:flex;flex-direction:row;flex-basis:auto;align-items:center;gap:12px;margin-top:16px;padding-bottom:0}
.journey-nav a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-bottom:2px solid var(--line);text-decoration:none;font-size:14px;padding:0}
.journey-nav a[aria-current=step]{border-color:var(--blue);color:#174fc5}
.journey .steps{display:block;margin:0;padding:0}
.journey-step{min-height:48vh;padding:52px 0 52px 28px!important;border-top:0!important;border-left:1px solid #b6bdbf;scroll-margin-top:150px;position:relative}
.journey-step:before{content:'';position:absolute;width:11px;height:11px;border:2px solid var(--soft);background:#8c98a7;border-radius:50%;left:-6px;top:60px}
.journey-step.is-current:before{background:var(--blue)}
.journey-step.is-current h3{color:#174fc5}
.journey-step h3{font-size:32px;margin-top:14px}
.journey-step p{max-width:36ch;font-size:18px}
.about-email{margin-top:24px;font-size:19px;color:#174fc5;font-weight:600;overflow-wrap:anywhere}
@media(max-width:1000px) and (min-width:761px){.hero-layout{column-gap:24px}.hero h1{font-size:44px}.journey{gap:36px}.work-stages{gap:6px}}
@media(max-width:760px){.hero-layout{grid-template-columns:minmax(0,1fr)}.hero h1{font-size:clamp(36px,9.8vw,52px)}.hero-art img{width:100%}.hero-art{margin-top:32px}.work-demo{margin-top:14px}.journey{display:block}.journey-art{top:72px;background:var(--soft);z-index:2;padding:8px 0 12px}.journey-scenes{width:min(46vw,210px);margin:auto}.journey-art figcaption{font-size:16px;padding-top:8px}.journey-nav{display:flex;justify-content:center;margin-top:4px;gap:12px}.journey-nav a{width:44px;height:44px}.journey .steps{margin-top:20px}.journey-step{min-height:48vh;scroll-margin-top:390px;padding:34px 0 34px 22px!important}.journey-step:before{top:42px}.journey-step h3{font-size:27px}.journey-step p{font-size:17px}.constructor-mini{float:left;width:64px;height:64px;margin:0 16px 8px 0}.dayline article{display:flow-root}}
@media(prefers-reduced-motion:reduce){.journey-frame{transition:none}}
@media(max-height:650px){.journey-art{position:static}.journey-step{min-height:260px;scroll-margin-top:100px}}