.showcase-hero{margin:18px auto 32px;max-width:1600px;min-height:760px;position:relative;isolation:isolate;overflow:hidden;background:#14201c;color:#f0f2e8;display:grid;grid-template-columns:1.08fr 1fr;padding:30px clamp(24px,5vw,80px) 0;column-gap:16px;border:1px solid #7e9e6b40;border-radius:3px 3px 28px 3px}
.showcase-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 78% 43%,#8aaf4726,transparent 53%),linear-gradient(#a2c79108 1px,transparent 1px),linear-gradient(90deg,#a2c79108 1px,transparent 1px);background-size:auto,72px 72px,72px 72px}
.showcase-top,.showcase-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;font:9px/1.5 monospace;letter-spacing:.1em;color:#b1c2b0}
.showcase-top{padding-bottom:22px;border-bottom:1px solid #b5cd9e26}.showcase-top i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#c6ef71;margin-right:8px;box-shadow:0 0 10px #c6ef7155}
.showcase-copy{align-self:center;z-index:2;padding-block:60px 75px}.showcase-kicker{font:10px/1.6 monospace;letter-spacing:.08em;color:#9fbe9e;margin:0 0 26px}
.showcase-copy h1{font-size:clamp(52px,6.4vw,104px);line-height:1.02;letter-spacing:-.065em;font-weight:500;margin:0 0 28px}.showcase-copy h1 em{font-style:normal;color:#c6ef71}
.showcase-intro{font-size:15px;line-height:1.85;max-width:37ch;color:#b9c7b8;margin-bottom:30px}.showcase-actions{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.showcase-cta{display:inline-flex;gap:25px;align-items:center;background:#c6ef71;color:#17221b;padding:14px 20px;text-decoration:none;font-size:12px;font-weight:600;border-radius:2px 2px 10px 2px;transition:background .2s}.showcase-cta:hover{background:#def8a4}.showcase-cta span{font-size:20px}.showcase-secondary{font-size:11px;color:#dce8d5;text-underline-offset:6px}.showcase-disciplines{display:flex;gap:20px;font:9px monospace;letter-spacing:.18em;color:#859980;margin-top:48px}
.showcase-art{min-width:0;position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:24px 0 38px}.showcase-viewport{position:relative;width:100%;height:440px;cursor:grab;touch-action:pan-y;z-index:1}.showcase-viewport:active{cursor:grabbing}.showcase-viewport img,.showcase-viewport canvas{width:100%;height:100%;object-fit:contain;display:block}.showcase-viewport [hidden]{display:none}.showcase-viewport canvas:focus-visible{outline:1px solid #c6ef71;outline-offset:4px}.showcase-orbit{position:absolute;width:90%;aspect-ratio:1;border:1px solid #c6ef7124;border-radius:50%;top:12%;transform:rotateX(55deg) rotate(-25deg);pointer-events:none}.showcase-orbit::after{content:'';position:absolute;inset:24px;border:1px dashed #93ded52a;border-radius:50%}.showcase-word{position:absolute;top:33%;left:0;font-size:clamp(50px,7vw,110px);font-weight:600;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px #bdd99820;pointer-events:none}
.showcase-art-caption{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;font:10px monospace;color:#bad0b0;border-bottom:1px solid #bdd99822;padding:8px 0 13px}.showcase-art-caption button{font:10px monospace;color:#bed5b6;background:none;border:1px solid #bdd99840;padding:6px 9px;border-radius:3px}.showcase-select{display:flex;gap:9px;align-self:flex-start;margin-top:16px}.showcase-select button{display:flex;align-items:center;border:1px solid #bdd99830;background:#253226;color:#92a58a;border-radius:3px;padding:2px 9px 2px 2px;gap:4px;font:9px monospace;transition:border-color .2s,background .2s}.showcase-select button[aria-pressed=true]{border-color:#c6ef71;background:#35452c;color:#e3f6c1}.showcase-select img{object-fit:contain}.showcase-drag{font:9px monospace;color:#8ba181;align-self:flex-start;margin-top:14px}.showcase-bottom{padding:20px 0;border-top:1px solid #b5cd9e26}.showcase-bottom a{color:#c6ef71;text-decoration:none;font-size:9px}.showcase-hero a:focus-visible,.showcase-hero button:focus-visible{outline:2px solid #93ded5;outline-offset:4px}
@media(min-width:1601px){.showcase-hero{margin-inline:auto}}@media(max-width:1000px){.showcase-hero{grid-template-columns:1fr 1fr;min-height:650px;padding-inline:28px}.showcase-copy h1{font-size:clamp(46px,6.5vw,70px)}.showcase-viewport{height:370px}.showcase-top>span:last-child{display:none}.showcase-select img{width:42px;height:42px}}
@media(max-width:700px){.showcase-hero{margin:12px 12px 26px;grid-template-columns:1fr;padding:20px 22px 0;min-height:0}.showcase-copy{padding:38px 0 8px}.showcase-copy h1{font-size:clamp(45px,10vw,72px)}.showcase-kicker{font-size:9px;margin-bottom:20px}.showcase-intro{font-size:13px;max-width:40ch;margin-bottom:22px}.showcase-disciplines{margin-top:24px}.showcase-art{padding-top:6px;padding-bottom:24px}.showcase-viewport{height:340px}.showcase-word{font-size:80px;top:23%}.showcase-select img{width:48px;height:48px}.showcase-bottom{font-size:8px;gap:10px}.showcase-bottom>span:last-child{display:none}.showcase-secondary{font-size:10px}.showcase-cta{font-size:11px;padding:11px 15px}.showcase-actions{gap:16px}}
.showcase-select{flex-wrap:wrap}
.showcase-tools{margin-top:32px;padding-top:21px;border-top:1px solid #b5cd9e30;max-width:440px}
.showcase-tools p{font-size:12px;font-weight:600;color:#e9f2de;margin:0 0 12px}
.showcase-tools>div{display:flex;flex-wrap:wrap;gap:8px}
.showcase-tools>div span{font-size:12px;font-weight:500;padding:7px 11px;border:1px solid #b6d19a55;border-radius:3px;background:#b8dc7410;color:#daf4b6}
.showcase-tools small{display:block;font-size:10px;line-height:1.6;color:#a5baa0;margin-top:12px}
.software-strip{padding-block:32px;border-block:1px solid #91a47c55;gap:20px}
.software-strip>span:not(.technical){font-size:clamp(16px,2.1vw,28px);font-weight:600;letter-spacing:-.035em;color:#263c2f}
.software-strip>.technical{color:#526d43;line-height:1.7}
@media(max-width:700px){.showcase-tools{margin-top:24px}.showcase-tools>div span{font-size:11px;padding:6px 9px}.software-strip{flex-wrap:wrap;justify-content:flex-start}.software-strip>span:not(.technical){font-size:18px}}
@media(prefers-reduced-motion:reduce){.showcase-hero *{transition:none!important}}