.browser-bar{height:2.2rem;padding:0 .8rem;display:flex;align-items:center;gap:.35rem;border-bottom:1px solid rgba(11,11,11,.15);background:rgba(255,255,255,.32)}
.browser-bar i{width:.4rem;height:.4rem;border-radius:50%;background:rgba(11,11,11,.35)}
.browser-bar span{margin-left:auto;font-family:var(--font-mono);font-size:.5rem;text-transform:uppercase;letter-spacing:.1em}
.project-thumb,.crm-scene{height:calc(100% - 2.2rem);position:relative;overflow:hidden;color:var(--ink)}
.project-thumb{margin:0;background:#080808;transform-origin:center;backface-visibility:hidden}
.project-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(5,7,9,.32));pointer-events:none}
.project-thumb img{width:100%;height:100%;display:block;object-fit:cover;object-position:center top;transform:scale(1.015);transition:filter .55s var(--ease),transform .75s var(--ease)}
.project-thumb__signal{position:absolute;z-index:2;right:1rem;bottom:1rem;padding:.55rem .75rem;border:1px solid rgba(255,255,255,.32);border-radius:999px;color:#fff;background:rgba(7,9,12,.55);backdrop-filter:blur(10px);font-family:var(--font-mono);font-size:.5rem;text-transform:uppercase;letter-spacing:.08em;opacity:0;transform:translateY(.55rem);transition:opacity .35s var(--ease),transform .45s var(--ease)}
@media(hover:hover) and (pointer:fine){.showcase-card:hover .project-thumb img{filter:saturate(1.08) contrast(1.03);transform:scale(1.055)}.showcase-card:hover .project-thumb__signal{opacity:1;transform:none}}
.browser-bar--dark{background:#10151c;border-color:rgba(255,255,255,.1);color:#dbe8ec!important}
.browser-bar--dark i{background:rgba(126,242,218,.48)}
.crm-scene{display:grid;grid-template-columns:3.5rem 1fr;background:radial-gradient(circle at 82% 18%,rgba(92,235,212,.2),transparent 30%),linear-gradient(145deg,#111820,#080b10);color:#eaf8f5}
.crm-sidebar{padding:.9rem .75rem;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;align-items:center;gap:.8rem;background:rgba(255,255,255,.025)}
.crm-sidebar span{width:2rem;aspect-ratio:1;border:1px solid rgba(126,242,218,.55);border-radius:.55rem;display:grid;place-items:center;color:#7ef2da;font-family:var(--font-mono);font-size:.6rem;font-weight:700}
.crm-sidebar i{width:1.1rem;height:.2rem;border-radius:1rem;background:rgba(234,248,245,.22)}
.crm-dashboard{padding:clamp(1.15rem,3vw,2.2rem);position:relative}
.crm-status{display:inline-flex;padding:.35rem .55rem;border:1px solid rgba(126,242,218,.3);border-radius:999px;color:#7ef2da;font-family:var(--font-mono);font-size:.48rem;text-transform:uppercase;letter-spacing:.08em}
.crm-dashboard>p{margin-top:clamp(1.5rem,4vw,3rem);color:#77918e;font-family:var(--font-mono);font-size:.55rem;text-transform:uppercase;letter-spacing:.08em}
.crm-dashboard>strong{display:block;margin-top:.45rem;font-family:var(--font-display);font-size:clamp(1.55rem,3.6vw,3.15rem);line-height:.92;letter-spacing:-.05em}
.crm-dashboard>strong em{color:#7ef2da;font-family:Georgia,serif;font-weight:400}
.crm-metrics{margin-top:clamp(1.25rem,3vw,2.2rem);display:flex;gap:.55rem}
.crm-metrics span{min-width:4.7rem;padding:.6rem;border:1px solid rgba(255,255,255,.11);border-radius:.65rem;color:#72827f;font-family:var(--font-mono);font-size:.45rem;text-transform:uppercase}
.crm-metrics b{display:block;margin-bottom:.18rem;color:#eaf8f5;font-size:.75rem}
.crm-pipeline{position:absolute;right:5%;top:12%;width:25%;display:grid;gap:.45rem;opacity:.78}
.crm-pipeline i{height:clamp(1.2rem,3vw,2.2rem);border:1px solid rgba(126,242,218,.18);border-left:2px solid #7ef2da;border-radius:.35rem;background:rgba(255,255,255,.035)}
.crm-pipeline i:nth-child(2){transform:translateX(-18%);opacity:.78}.crm-pipeline i:nth-child(3){transform:translateX(8%);opacity:.58}.crm-pipeline i:nth-child(4){transform:translateX(-10%);opacity:.38}
@media(max-width:520px){.crm-scene{grid-template-columns:2.8rem 1fr}.crm-dashboard{padding:1rem}.crm-pipeline{display:none}.crm-metrics{gap:.35rem}.crm-metrics span{min-width:0;flex:1;padding:.45rem}.crm-dashboard>strong{font-size:1.45rem}}
@media(prefers-reduced-motion:reduce){.project-thumb img,.project-thumb__signal{transition:none}.project-thumb img{transform:none}}
