.work-link{padding:92px 6vw;background:#050a0c;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.work-link h2{max-width:980px;font:500 clamp(2.6rem,4.7vw,5.2rem)/.98 "Space Grotesk";letter-spacing:-.05em;margin:30px 0 45px}
.work-link h2 i{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--cyan)}
.work-link .talk{display:inline-block}
.contact-intro{max-width:560px;margin:-16px auto 26px;color:var(--muted);font-size:15px}
.inner-header{position:absolute}
.portfolio-page{min-height:100vh;background:rgba(4,9,11,.94)}
.portfolio-hero{padding:170px 6vw 85px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 78% 24%,rgba(54,183,192,.15),transparent 35%)}
.portfolio-hero h1{font:500 clamp(3.6rem,6.4vw,7rem)/.92 "Space Grotesk";letter-spacing:-.055em;margin:30px 0}
.portfolio-hero h1 i{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--cyan)}
.portfolio-hero>p:last-child{max-width:640px;color:var(--muted);font-size:18px}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 28px;padding:75px 6vw 110px}
.portfolio-card>a{text-decoration:none;display:block}
.mini-browser{background:#0b1518;border:1px solid var(--line);padding:10px;transition:transform .35s,border-color .35s,box-shadow .35s}
.portfolio-card:hover .mini-browser{transform:translateY(-7px);border-color:rgba(116,237,235,.5);box-shadow:0 24px 70px rgba(0,0,0,.35)}
.mini-bar{height:25px;background:#101d21;padding:6px 8px;font-size:8px;color:#607b81}
.mini-bar i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#3f6269;margin-right:3px}
.mini-bar span{display:block;text-align:center;margin-top:-15px}
.mini-bar b{float:right;margin-top:-14px;color:var(--cyan);font-size:11px}
.mini-preview{aspect-ratio:16/10;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;background:radial-gradient(circle at 70% 20%,rgba(64,189,197,.25),transparent 35%),linear-gradient(135deg,#081116,#102c33);overflow:hidden}
.portfolio-card:nth-child(3n+2) .mini-preview{background:radial-gradient(circle at 30% 80%,rgba(60,127,151,.3),transparent 35%),linear-gradient(135deg,#071014,#173841)}
.portfolio-card:nth-child(3n+3) .mini-preview{background:radial-gradient(circle at 70% 75%,rgba(78,202,196,.2),transparent 35%),linear-gradient(135deg,#071113,#0b2529)}
.mini-preview>span{font:400 11px "Space Grotesk";letter-spacing:.25em;color:#4d7b82}
.mini-preview>strong{font:600 clamp(1.3rem,2.2vw,2.4rem)/1 "Space Grotesk";margin:16px 0;color:#dff8f8}
.mini-preview>small{font:500 8px "Space Grotesk";letter-spacing:.16em;color:var(--cyan)}
.mini-preview.has-image{padding:0}
.mini-preview img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.portfolio-card:hover .mini-preview img{transform:scale(1.035)}
.portfolio-meta{display:flex;justify-content:space-between;gap:15px;padding-top:17px;align-items:start}
.portfolio-meta h2{font:500 20px "Space Grotesk";margin:0 0 4px;color:var(--white)}
.portfolio-meta p{font:500 9px "Space Grotesk";letter-spacing:.12em;color:var(--muted);margin:0}
.portfolio-meta>span{font:500 9px "Space Grotesk";letter-spacing:.1em;color:var(--cyan);white-space:nowrap;margin-top:5px}
.portfolio-description{color:var(--muted);font-size:13px;border-top:1px solid var(--line);margin-top:16px;padding-top:13px}
.portfolio-description p{margin:0}
@media(max-width:1000px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.work-link{padding:65px 6vw}.portfolio-hero{padding:130px 6vw 60px}.portfolio-hero>p:last-child{font-size:15px}.portfolio-grid{grid-template-columns:1fr;padding:55px 6vw 80px}.portfolio-meta h2{font-size:18px}}