/* Scroll-led construction study of the supplied brand mark. */
.brand-story{padding:0;height:260svh;position:relative;background:#07131c;color:#eff6f7;isolation:isolate}
.brand-stage{position:sticky;top:0;height:100svh;min-height:540px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at 18% 80%,#173d5055,transparent 58%),#07131c;--p:0;--mx:0;--my:0}
.brand-stage::before{content:"";position:absolute;inset:0;background-image:linear-gradient(#a0c9df08 1px,transparent 1px),linear-gradient(90deg,#a0c9df08 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(ellipse,#000,transparent 75%);opacity:var(--grid,1)}
.brand-stage::after{content:"";position:absolute;width:60vw;height:60vw;border-radius:50%;background:#ab79300a;filter:blur(70px);left:-30%;bottom:-55%;pointer-events:none}
.brand-topline{position:absolute;top:44px;left:6%;right:6%;display:flex;justify-content:space-between;align-items:center;font:500 10px/1.4 "Inter","PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.16em;color:#acc0cc}
.brand-topline strong{font-weight:600;color:#e8f0f2;letter-spacing:.08em}
.brand-topline span{display:flex;align-items:center;gap:9px}
.brand-topline i{width:5px;height:5px;border-radius:50%;background:#d6a66e;box-shadow:0 0 10px #d6a66e88}
.brand-art{position:relative;width:min(76vw,1000px);aspect-ratio:1000/610;transform:translate(calc(var(--mx)*12px),calc(var(--my)*9px)) scale(var(--scale,.76));will-change:transform}
.brand-art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.brand-guides{color:#d9a66c;opacity:var(--guide,1)}
.brand-guides .draft-line{stroke-dasharray:3 5;opacity:.35}
.brand-guides .construction{stroke-dasharray:1400;stroke-dashoffset:var(--dash,1400);opacity:.7}
.brand-guides text{fill:#b7cbd4;stroke:none;font:10px monospace;letter-spacing:2px}
.brand-ghost{opacity:var(--ghost,.12)}
.brand-outline{opacity:var(--outline,0);filter:drop-shadow(0 0 4px #b6d6e24a)}
.brand-solid{opacity:var(--solid,0);filter:drop-shadow(0 12px 35px #0004)}
.brand-art .brand-solid{clip-path:inset(0 var(--wipe,100%) 0 0)}
.brand-message{position:absolute;bottom:13%;text-align:center;opacity:var(--message,0);transform:translateY(calc((1 - var(--message,0))*14px))}
.brand-message h2{font:700 clamp(22px,2.7vw,42px)/1.5 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.12em;margin:0 0 12px}
.brand-message p{font:400 12px/1.6 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;color:#9eb7c5;letter-spacing:.22em;margin:0}
.brand-bottom{position:absolute;bottom:30px;left:6%;right:6%;display:flex;align-items:center;justify-content:space-between;color:#95acbb;font:10px/1.5 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.08em}
.brand-steps{display:flex;gap:24px}
.brand-steps span{opacity:.4;transition:opacity .3s,color .3s}
.brand-steps span.is-current{opacity:1;color:#efc58f}
.brand-scroll{display:flex;align-items:center;gap:10px}
.brand-scroll svg{width:18px;height:18px;stroke:#efc58f;fill:none;animation:brand-down 1.8s ease-in-out infinite}
.brand-track{height:2px;background:#a3c6d314;position:absolute;bottom:0;left:0;right:0}
.brand-track i{display:block;height:100%;width:calc(var(--p)*100%);background:#d5b07d}
@keyframes brand-down{50%{transform:translateY(4px)}}
@media(max-width:600px){.brand-story{height:230svh}.brand-stage{min-height:480px}.brand-topline{top:30px;font-size:8px}.brand-art{width:94vw}.brand-message{bottom:22%;padding:0 18px}.brand-message h2{font-size:22px;letter-spacing:.04em}.brand-message p{font-size:10px;letter-spacing:.08em}.brand-bottom{bottom:24px;align-items:flex-end}.brand-steps{gap:12px;font-size:9px}.brand-scroll{font-size:9px;gap:4px}.brand-guides text{font-size:12px}}
@media(prefers-reduced-motion:reduce){.brand-story{height:100svh}.brand-stage{--solid:1!important;--wipe:0%!important;--scale:.85!important;--message:1!important;--guide:.22!important;--ghost:0!important;--outline:0!important}.brand-art{transform:scale(.85)}.brand-scroll svg{animation:none}}