@import url("../assets/framework-base.css");
.showcase { padding: clamp(28px, 6vw, 68px); }
.showcase-number { display: block; color: var(--accent); font-size: 12px; font-weight: 900; letter-spacing: .18em; }
.showcase > strong { position: relative; z-index: 2; display: block; max-width: 800px; margin-top: 20px; font-size: clamp(48px, 8vw, 105px); line-height: .85; letter-spacing: -.07em; }
.showcase > p { position: relative; z-index: 2; max-width: 420px; margin-top: 25px; color: #b9bec5; line-height: 1.5; }
.showcase-art { position: absolute; pointer-events: none; }

:root { --bg:#ecebe6; --paper:#fffdf8; --ink:#20242c; --muted:#6b707a; --line:#bfc3c9; --accent:#3167ff; --accent-2:#dbe3ff; --dark:#20242c; --width:1240px; }
.nav-links .nav-cta,.button{border-radius:3px}.hero-layout{grid-template-columns:.7fr 1.3fr;min-height:760px}.concept-stage{min-height:650px;border:0;background:#e6e5e0}
.canvas-stage{position:relative;height:100%;min-height:650px}.canvas-grid{position:absolute;inset:0;background-image:radial-gradient(#adb1b8 1px,transparent 1px);background-size:24px 24px}
.note{position:absolute;padding:22px;background:#fff;border:1px solid #20242c;box-shadow:8px 8px 0 rgba(32,36,44,.13)}.note small{display:block;margin-bottom:26px;color:#3167ff;font-size:9px;font-weight:900;letter-spacing:.14em}.note b{font-size:22px;line-height:1.1}
.n1{left:6%;top:10%;width:34%;transform:rotate(-3deg)}.n2{right:6%;top:25%;width:38%;background:#dbe3ff;transform:rotate(4deg)}.n3{left:25%;bottom:8%;width:40%;background:#ffe56b;transform:rotate(-1deg)}
.connector{position:absolute;height:2px;background:#3167ff;transform-origin:left}.c1{left:34%;top:30%;width:35%;transform:rotate(12deg)}.c2{left:45%;top:61%;width:32%;transform:rotate(-18deg)}.pin{position:absolute;width:18px;height:18px;background:#ff5d49;border:4px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #20242c}.p1{left:42%;top:53%}.p2{right:12%;bottom:11%}
.feature-grid{grid-template-columns:.8fr 1.3fr .9fr;align-items:start}.feature:nth-child(2){margin-top:45px;background:#dbe3ff}.feature:nth-child(3){transform:rotate(2deg)}
.about-mark{transform:rotate(-3deg);box-shadow:14px 14px 0 #ffe56b}.showcase{background:#e6e5e0;color:#20242c}.showcase>p{color:#6b707a}.showcase-art{inset:0;background-image:radial-gradient(#777 1px,transparent 1px);background-size:26px 26px;opacity:.4}.showcase:after{content:"THINKING IN PUBLIC";position:absolute;right:5%;bottom:7%;padding:24px;background:#3167ff;color:#fff;font-size:24px;font-weight:900;transform:rotate(-4deg)}
@media(max-width:820px){.feature-grid{grid-template-columns:1fr}.feature:nth-child(2){margin-top:0}.n1,.n2,.n3{width:58%}}