/* "Every building is a puzzle" — styles for the building assembly stage on the Manufacturing page.
   Lifted from home.css; the sound-button styles are shared with the production sequence. */
/* ---------- interactive building assembly ---------- */
.build-wrap{margin-top:78px;display:grid;grid-template-columns:.92fr 1.08fr;gap:44px;align-items:center}
.build-copy h3{font-family:var(--fd);font-weight:800;text-transform:uppercase;font-size:clamp(30px,3.6vw,48px);color:#fff;line-height:.94;margin:12px 0 12px}
.build-copy h3 span{color:var(--gold)}
.build-copy p{color:#c3c8cb;font-size:15px;max-width:48ch;margin-bottom:20px}
.stage-chips{display:flex;flex-direction:column;gap:8px;margin-bottom:22px}
.stage-chip{display:flex;gap:14px;align-items:center;text-align:left;background:rgba(255,255,255,.03);border:1px solid var(--hairline);padding:12px 14px;cursor:pointer;font-family:var(--fm);font-size:11.5px;letter-spacing:.08em;color:#cfd4d7;transition:all .15s ease}
.stage-chip b{color:var(--gold-bright);font-weight:600}
.stage-chip:hover{border-color:var(--gold);color:#fff}
.stage-chip.on{border-color:var(--gold);background:rgba(217,169,63,.08);color:#fff}
.build-stage{background:linear-gradient(180deg,#1d2125,#16191c);padding:16px;position:relative}
.build-stage svg{width:100%;height:auto;display:block}
.build-label{position:absolute;left:20px;top:16px;font-family:var(--fm);font-size:11px;letter-spacing:.14em;color:var(--gold-bright);z-index:2}
#buildSvg .p{opacity:0;transform-box:fill-box;transform-origin:center;transition:opacity .4s ease, transform .6s cubic-bezier(.2,.85,.25,1)}
#buildSvg .p.on{opacity:1;transform:none}
#buildSvg .drop{transform:translateY(-80px)}
#buildSvg .rise{transform:translateY(60px)}
#buildSvg .slideL{transform:translateX(-90px)}
#buildSvg .slideR{transform:translateX(90px)}
#buildSvg .bolt.on{animation:boltPulse .7s ease}
@keyframes boltPulse{0%{transform:scale(.2)}55%{transform:scale(1.8)}100%{transform:scale(1)}}
#buildSvg .sc{opacity:0;transform-box:view-box;transform-origin:var(--ax) var(--ay);transform:scale(.85);transition:opacity .35s ease,transform .7s cubic-bezier(.3,.7,.25,1)}
#buildSvg .sc.on{opacity:1;transform:scale(1)}
#buildSvg .sc.on.fly{transform:translate(var(--dx),var(--dy)) scale(var(--k));transition:transform .85s cubic-bezier(.55,.06,.35,1)}
#buildSvg .sc.landed{opacity:0;transition:opacity .12s ease}
#buildSvg .sc-cap{opacity:0;transition:opacity .3s ease;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:2px;fill:#e9c565}
#buildSvg .sc-cap.on{opacity:1}
@media (prefers-reduced-motion: reduce){#buildSvg .sc,#buildSvg .sc-cap{display:none}}
@media (max-width:1020px){.build-wrap{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){#buildSvg .p{opacity:1;transform:none;transition:none;animation:none}}

/* sound toggle */
.jn-snd{display:inline-flex;align-items:center;gap:9px;background:transparent;border:1px solid var(--hairline);color:#8f979d;font-family:var(--fm);font-size:10.5px;letter-spacing:.14em;padding:8px 13px;cursor:pointer;transition:.2s}
.jn-snd:hover{border-color:var(--gold);color:var(--gold-bright)}
.jn-snd .ico{display:inline-flex}
.jn-snd .waves{opacity:0}
.jn-snd.on{border-color:var(--gold);color:var(--gold-bright)}
.jn-snd.on .waves{opacity:1}
.jn-snd.on .cross{opacity:0}
.building .jn-snd{display:inline-flex;align-items:center;gap:9px;margin-top:20px;background:transparent;border:1px solid var(--hairline);color:#8f979d;font-family:var(--fm);font-size:10.5px;letter-spacing:.14em;padding:8px 13px;cursor:pointer;transition:.2s}
.building .jn-snd:hover{border-color:var(--gold);color:var(--gold-bright)}
.building .jn-snd .ico{display:inline-flex}
.building .jn-snd .waves{opacity:0}
.building .jn-snd.on{border-color:var(--gold);color:var(--gold-bright)}
.building .jn-snd.on .waves{opacity:1}
.building .jn-snd.on .cross{opacity:0}
.building .build-wrap{margin-top:56px;margin-bottom:24px}