/* São Paulo: one visible landscape result, with three explicit process stages. */
.concept-studio{--cx-paper:#f5f5f2;--cx-ink:#191919;--cx-line:#d0d0ca;--cx-muted:#aeb0b2;background:#070809;color:#f5f5f4;border:1px solid #242629;margin-top:48px;overflow:hidden;color-scheme:dark}
.concept-inner{padding:30px}
.concept-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;margin-bottom:26px}
.concept-heading h2{font-size:clamp(26px,2.65vw,39px);font-weight:500;line-height:1.12;letter-spacing:-.035em;text-wrap:balance}
.concept-heading>p{max-width:250px;color:#b9bbbf;font-size:12px;line-height:1.65}
.concept-workspace{display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;align-items:start}
.concept-stage-list{display:grid;gap:9px;position:relative}
.concept-stage-button{min-width:0;display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:13px;padding:10px;border:1px solid #393b3d;border-radius:3px;background:#111214;text-align:left;color:#c3c5c7;position:relative;transition:border-color .2s,background .2s,color .2s}
.concept-stage-button:hover{border-color:#85898e;background:#181a1d;color:#fff}
.concept-stage-button[aria-selected=true]{border-color:#d6d9dd;background:#22252a;color:#fff}
.concept-stage-button:focus-visible{outline:2px solid #fff;outline-offset:4px}
.concept-stage-preview{display:block;position:relative;aspect-ratio:16/10;width:100%;background:#edede8;overflow:hidden;isolation:isolate;border:1px solid #ffffff24}
.concept-stage-preview>svg,.concept-stage-preview>img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;fill:none;stroke:none}
.concept-stage-preview svg{color:#494b4c}
.concept-stage-preview .concept-preview-lines{fill:none;stroke:currentColor;stroke-width:1.6}
.concept-stage-preview .concept-preview-paper{fill:#f5f5f0;stroke:none}
.concept-preview-prototype>img{filter:grayscale(1);opacity:.72}
.concept-preview-prototype::after{content:'SÃO PAULO';font-size:11px;position:absolute;left:8px;top:16px;line-height:1;letter-spacing:-.07em;color:white}
.concept-stage-name{display:grid;gap:5px;font-size:13px;line-height:1.3;font-weight:500}
.concept-stage-number{font-size:11px;line-height:1.2;color:#a2a6ab;letter-spacing:.07em;font-variant-numeric:tabular-nums}
.concept-stage-button[aria-selected=true] .concept-stage-number{color:#e0e3e6}
.concept-stage-connector{height:12px;width:1px;background:#4c5055;justify-self:center;margin:-6px 0;pointer-events:none}
.concept-viewer{min-width:0}
.concept-panel{margin:0;min-width:0}
.concept-stage-frame{position:relative;aspect-ratio:16/9;background:var(--cx-paper);overflow:hidden;border:1px solid #56595d;border-radius:2px;color:var(--cx-ink)}
.concept-stage-frame>svg{display:block;width:100%;height:100%;fill:none;stroke:none;overflow:hidden}
.concept-stage-frame>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;max-width:100%}
.concept-final-frame{background:#0f1416}
.concept-panel-caption{display:grid;grid-template-columns:1fr auto;align-items:start;gap:20px;margin-top:16px}
.concept-panel-caption h3{font-size:17px;line-height:1.35;font-weight:500;letter-spacing:-.02em;margin-bottom:7px}
.concept-panel-caption p{color:#b9bdc1;font-size:12px;line-height:1.7;max-width:600px}
.concept-panel-caption a{font-size:12px;line-height:1.4;display:inline-flex;align-items:center;gap:8px;min-height:36px;white-space:nowrap}
.concept-panel-caption a svg{width:16px;height:16px}
.concept-panel-caption a:hover{text-decoration:underline;text-underline-offset:4px}
.concept-provenance{border-top:1px solid #36393c;color:#aeb2b7;font-size:11px;line-height:1.7;margin-top:25px;padding-top:16px}
.concept-stage-frame .cx-wire{fill:none;stroke:#4d4f50;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.concept-stage-frame .cx-under{stroke:#838482;opacity:.35;stroke-width:.8}
.concept-stage-frame .cx-guide{stroke:#c7c7c1;stroke-width:.7;fill:none}
.concept-stage-frame .cx-text{font-family:Manrope,Arial,sans-serif;fill:#323433;stroke:none;font-size:14px;letter-spacing:.005em}
.concept-stage-frame .cx-tiny{font-size:11px;letter-spacing:.04em}
.concept-stage-frame .cx-note{fill:#616562;font-size:15px}
.concept-stage-frame .cx-display{font-size:94px;font-weight:400;letter-spacing:-7px;fill:#454847}
.concept-stage-frame .cx-label{font-size:13px;font-weight:500;letter-spacing:.06em}
.concept-stage-frame .cx-paper{fill:#f5f5f2;stroke:none}
.concept-stage-frame .cx-soft{fill:#e8e8e2;stroke:none}
.concept-stage-frame .cx-dark{fill:#202322;stroke:none}
.concept-stage-frame .cx-white{fill:#f9faf8;stroke:none}
.concept-stage-frame .cx-prototype-photo{filter:grayscale(1)}
.concept-studio[data-concept-entered=true] .concept-stage-button{animation:concept-stage-entry .7s cubic-bezier(.16,1,.3,1) both}
.concept-studio[data-concept-entered=true] .concept-stage-button:nth-of-type(2){animation-delay:.08s}
.concept-studio[data-concept-entered=true] .concept-stage-button:nth-of-type(3){animation-delay:.16s}
.concept-studio[data-concept-entered=true] .concept-panel:not([hidden]) .concept-stage-frame{animation:concept-result-entry .85s cubic-bezier(.16,1,.3,1) both}
.concept-image-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;color:#d3d6da;font-size:14px;padding:24px;text-align:center;background:#141719}
.concept-image-fallback a{text-decoration:underline;text-underline-offset:4px}
.concept-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;padding:0!important;border:0!important}
@keyframes concept-stage-entry{from{translate:0 5px}to{translate:0 0}}
@keyframes concept-result-entry{from{filter:brightness(.92);translate:0 7px}to{filter:brightness(1);translate:0 0}}
@media(max-width:1100px){.concept-inner{padding:25px}.concept-workspace{grid-template-columns:175px minmax(0,1fr);gap:22px}.concept-stage-button{grid-template-columns:65px minmax(0,1fr);gap:10px;padding:8px}.concept-stage-name{font-size:12px}.concept-panel-caption{grid-template-columns:1fr;gap:6px}}
@media(max-width:760px){.concept-studio{margin-top:32px}.concept-inner{padding:22px}.concept-heading{align-items:start;gap:12px;flex-direction:column;margin-bottom:22px}.concept-heading h2{font-size:29px}.concept-heading>p{max-width:360px}.concept-workspace{grid-template-columns:1fr;gap:20px}.concept-stage-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.concept-stage-button{grid-template-columns:1fr;gap:9px;padding:8px}.concept-stage-preview{aspect-ratio:16/9}.concept-stage-name{display:flex;align-items:center;gap:7px;font-size:12px}.concept-stage-number{font-size:11px}.concept-stage-connector{display:none}.concept-stage-frame{aspect-ratio:16/9}.concept-panel-caption h3{font-size:16px}.concept-panel-caption p{font-size:12px}.concept-panel-caption a{font-size:12px}.concept-provenance{font-size:11px;margin-top:20px;padding-top:14px}}
@media(max-width:420px){.concept-inner{padding:18px 14px}.concept-stage-list{gap:7px}.concept-stage-button{padding:5px;gap:8px}.concept-stage-name{display:grid;gap:3px;font-size:12px}.concept-stage-number{font-size:11px}.concept-heading h2{font-size:27px}.concept-heading>p{font-size:12px}.concept-workspace{gap:17px}.concept-panel-caption{margin-top:14px}.concept-provenance{font-size:11px}.concept-preview-prototype::after{font-size:8px;left:4px;top:12px}}
@media(prefers-reduced-motion:reduce){.concept-studio *, .concept-studio *::before,.concept-studio *::after{animation:none!important;transition:none!important;translate:none!important}}
