/* step 01: chat-style request -> analyzing -> brief (sized in em off the stage width) */
.s1{position:relative;width:100%;aspect-ratio:720/660;container-type:inline-size;overflow:hidden;background:#3A3A40;border-radius:0;font-family:inherit;line-height:1.5}
.s1 *{box-sizing:border-box}
.s1-layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.s1-in{position:absolute;inset:0;font-size:calc(100cqw / 45);color:#fff}
.s1-bg{position:absolute;inset:0;background:#3A3A40 url('/assets/images/hiw-step-01-bg.jpg') center / cover no-repeat}
.s1-shade{position:absolute;inset:0;background:rgba(16,16,20,.24)}
.s1-input{width:33em;background:#fff;color:#1B1C1B;border-radius:1.15em;padding:1.25em 1.3em 1.1em;display:flex;flex-direction:column;gap:3.6em;box-shadow:0 .6em 2.4em rgba(0,0,0,.22)}
.s1-line{font-size:1.12em;line-height:1.4;min-height:1.4em;white-space:nowrap;overflow:hidden}
.s1-ph{color:#A5A59E}
.s1-caret{display:inline-block;width:.09em;height:1.05em;background:#1B1C1B;vertical-align:-.16em;margin-left:.06em;animation:s1blink 1s steps(1) infinite}
@keyframes s1blink{50%{opacity:0}}
.s1-row{display:flex;justify-content:space-between;align-items:center}
.s1-talk,.s1-send{display:flex;align-items:center;gap:.55em;height:2.5em;padding:0 1.15em;border-radius:9em;font-size:.86em;font-weight:600;letter-spacing:-.01em}
.s1-talk{background:#E6E6E0;color:#1B1C1B}
.s1-send{background:#000;color:#fff}
.s1-talk,.s1-send,.s1-ready{line-height:1}
.s1-talk svg,.s1-send svg,.s1-ready svg{display:block;flex:none}
.s1-talk svg,.s1-send svg{width:1.05em;height:1.05em}
.s1-cursor{position:absolute;left:0;top:0;width:1.35em;height:1.5em;opacity:0}
.s1-steps{position:relative;width:24em;opacity:0}
.s1-head{display:inline-flex;align-items:center;gap:1em;height:3em;padding:0 2.4em 0 1.4em;border-radius:9em;border:1px solid rgba(255,255,255,.38);background:rgba(255,255,255,.14);font-size:1em;font-weight:500}
.s1-head i{width:.6em;height:.6em;background:#fff;display:block}
.s1-rail{position:absolute;left:1.72em;top:3.5em;width:1px;height:12.6em;background:rgba(255,255,255,.35);transform-origin:top}
.s1-list{margin:2.4em 0 0;padding:0 0 0 .92em;list-style:none;display:flex;flex-direction:column;gap:1.75em}
.s1-list li{display:flex;align-items:center;gap:1.25em;font-size:1em;font-weight:500;opacity:0}
.s1-dot{position:relative;width:1.6em;height:1.6em;flex:none}
.s1-spin{position:absolute;inset:0;border-radius:50%;border:.14em solid rgba(255,255,255,.3);border-top-color:#fff;animation:s1spin .8s linear infinite;background:rgba(40,40,46,.55)}
@keyframes s1spin{to{transform:rotate(360deg)}}
.s1-ok{position:absolute;inset:0;border-radius:50%;background:#F1F0EB;display:flex;align-items:center;justify-content:center;opacity:0}
.s1-ok svg{width:.8em;height:.8em}
.s1-brief{width:29em;background:#FDFCF9;color:#1B1C1B;border-radius:1.15em;padding:1.6em 1.7em 1.7em;box-shadow:0 .6em 2.4em rgba(0,0,0,.22);opacity:0;display:flex;flex-direction:column;gap:1.3em}
.s1-btop{display:flex;justify-content:space-between;align-items:center;height:1.7em}
.s1-cap{font-size:.68em;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#62635D}
.s1-ready{display:flex;align-items:center;gap:.5em;height:2.3em;padding:0 .95em;border-radius:9em;background:#E9EEDF;font-size:.68em;font-weight:500;letter-spacing:.08em;text-transform:uppercase;opacity:0}
.s1-ready svg{width:.95em;height:.95em}
.s1-title{font-size:1.55em;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.s1-rows{display:flex;flex-direction:column;border-top:1px solid #E7E6DF}
.s1-r{display:grid;grid-template-columns:6.2em minmax(0,1fr);align-items:start;padding:1.05em 0;border-bottom:1px solid #E7E6DF;opacity:0}
.s1-r:last-child{border-bottom:0;padding-bottom:0}
.s1-v{display:flex;flex-direction:column;gap:.55em;padding-top:.1em}
.s1-v b{display:block;height:.55em;border-radius:9em;background:#E4E3DC;transform-origin:left}
.s1-chips{display:flex;gap:.5em}
.s1-chips span{height:1.9em;padding:0 .85em;border-radius:9em;display:flex;align-items:center;font-size:.8em;font-weight:500;border:1px solid #E2E1DA;color:#62635D}
.s1-chips span.on{background:#EFEEE8;border-color:#EFEEE8;color:#1B1C1B}
@media (prefers-reduced-motion: reduce){.s1-caret,.s1-spin{animation:none}}
