:root{--bg:#090e1a;--bg2:#0e1626;--panel:#121e30;--line:#25344b;--text:#f1f6ff;--muted:#a1b0c4;--blue:#54b6ff;--cyan:#69e1f3}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.7 system-ui,-apple-system,Segoe UI,Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}.shell{width:min(1120px,calc(100% - 44px));margin:auto}.skip{position:absolute;left:-9999px;top:10px;background:white;color:black;padding:10px;z-index:99}.skip:focus{left:10px}.header{position:sticky;top:0;z-index:20;background:#090e1aef;backdrop-filter:blur(18px);border-bottom:1px solid #1a2a40}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:15px;letter-spacing:2px;font-weight:700}.brand b,.brand-mark span{color:var(--blue)}.brand-mark{display:grid;place-items:center;width:39px;height:39px;border:1px solid #3779a7;border-radius:10px;font-size:20px;letter-spacing:0;background:#10233a}.navlinks{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:600}.navlinks a:not(.nav-cta){color:#c7d3e3}.navlinks a:hover,.text-link:hover{color:var(--cyan)}.nav-cta{border:1px solid #4f9bcf;padding:8px 15px;border-radius:8px}.menu{display:none;color:white;border:1px solid var(--line);background:transparent;border-radius:8px;padding:5px 12px;font-size:22px}.hero{min-height:680px;display:grid;grid-template-columns:1.07fr .93fr;align-items:center;gap:42px;padding-top:70px;padding-bottom:95px}.eyebrow,.label,.project-num{font-size:11px;font-weight:800;letter-spacing:2.2px;color:var(--blue)}.eyebrow{display:inline-flex;gap:10px;align-items:center;padding:8px 13px;border:1px solid #2a4e6b;border-radius:30px;background:#0e2136}.pulse{height:7px;width:7px;border-radius:50%;background:#59e3bb;box-shadow:0 0 12px #59e3bb}.kicker{font-size:12px;letter-spacing:4px;color:#9eafc4;margin:32px 0 4px}h1{font-size:clamp(58px,7.5vw,100px);line-height:1.04;letter-spacing:-5px;margin:0 0 24px}h1 span,h2 span{color:var(--blue)}.intro{font-size:18px;max-width:570px;color:#b8c8db}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:13px 20px;border-radius:9px;font-size:14px;font-weight:750;transition:transform .2s,background .2s}.btn:hover{transform:translateY(-2px)}.primary{background:linear-gradient(110deg,#3297ed,#62c5fb);color:#061323}.outline{border:1px solid #3b536d;background:#101c2c}.hero-facts{display:flex;gap:28px;margin-top:62px}.hero-facts span{display:flex;flex-direction:column}.hero-facts b{font-size:14px}.hero-facts small{font-size:11px;color:var(--muted)}.hero-art{min-height:470px;display:grid;place-items:center;position:relative}.orb{position:absolute;width:340px;height:340px;border-radius:50%;background:#167bc1;filter:blur(105px);opacity:.3}.terminal{position:relative;width:100%;max-width:465px;transform:rotate(2deg);border:1px solid #38526c;border-radius:13px;overflow:hidden;background:#0a1220;box-shadow:0 30px 85px #0009}.term-top{height:43px;background:#152439;display:flex;align-items:center;gap:7px;padding:0 15px;border-bottom:1px solid #2a3e55}.term-top i{height:9px;width:9px;border-radius:50%;background:#ef737c}.term-top i:nth-child(2){background:#efc15b}.term-top i:nth-child(3){background:#69d8a6}.term-top span{font:11px ui-monospace,monospace;color:#91a5bc;margin-left:14px}.term-body{padding:21px 24px 28px;font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}.term-body p{margin:6px 0}.term-body em{color:#69e1f3;font-style:normal}.term-body .output{color:#9eb6cc;padding-left:15px}.term-body .success{color:#77e1ae;padding-left:15px}.cursor{color:var(--blue)}.float-tag{position:absolute;background:#162a42;border:1px solid #3a7297;color:#bde7ff;padding:9px 12px;border-radius:8px;font:10px ui-monospace,monospace;letter-spacing:1px;box-shadow:0 8px 24px #0007}.tag-a{top:32px;right:-5px}.tag-b{bottom:32px;left:-8px}.section{padding:105px 0}.section-alt{background:var(--bg2);border-top:1px solid #17283c;border-bottom:1px solid #17283c}.label{margin:0 0 18px}h2{font-size:clamp(35px,4.5vw,54px);line-height:1.18;letter-spacing:-2px;margin:0 0 22px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:90px}.prose{color:#bdcadd}.prose p{margin:0 0 18px}.prose strong{color:white}.text-link{display:inline-block;margin-top:15px;color:var(--blue);font-weight:700}.section-lead{max-width:650px;color:var(--muted);margin-bottom:35px}.skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.skill-card,.project{border:1px solid var(--line);background:linear-gradient(150deg,#142238,#101a2a);border-radius:13px;padding:28px}.skill-icon{font-size:26px;color:var(--blue);margin-bottom:12px}.skill-card h3,.project h3{margin:0 0 9px;font-size:18px}.skill-card p,.project p,.timeline p{color:#aebdd0;margin:0;font-size:14px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:17px}.project{min-height:230px}.project h3{margin-top:14px;font-size:21px}.project.featured{grid-column:1/-1;display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:center;padding:35px}.featured h3{font-size:28px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.chips span{font-size:11px;color:#a8d8ff;border:1px solid #2c5474;background:#142c45;padding:4px 9px;border-radius:5px}.diagram{padding:20px;border:1px dashed #406184;border-radius:12px;text-align:center;background:#0a1627}.node{border:1px solid #427fa7;background:#122a43;border-radius:8px;padding:12px 7px;font-size:11px;font-weight:800;letter-spacing:.4px}.node small{display:block;color:#a4bcd3;font-size:10px;font-weight:400}.node.server{margin:auto;max-width:210px}.node-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.line{height:24px;width:1px;background:#5a9dd0;margin:auto}.node.vpn{max-width:210px;margin:20px auto 0;border-color:#37665f}.timeline{margin-top:35px}.timeline-item{display:grid;grid-template-columns:245px 1fr;gap:35px;border-top:1px solid var(--line);padding:28px 0}.timeline-date{font-size:12px;letter-spacing:1px;color:var(--blue);font-weight:800}.timeline h3{margin:0 0 8px;font-size:19px}.timeline h3 span{font-weight:400;color:var(--muted)}.contact-section{text-align:center}.contact-box{max-width:760px}.contact-box>p:not(.label){color:var(--muted)}.contact-box .actions{justify-content:center}.contact-details{display:flex;justify-content:center;flex-wrap:wrap;gap:20px;margin-top:38px;color:#a6b8cd;font-size:13px}.contact-details a:hover{color:var(--blue)}footer{border-top:1px solid var(--line);padding:25px 0;color:#8c9eb2;font-size:12px}.footer-inner{display:flex;justify-content:space-between}footer a:hover{color:var(--blue)}@media(max-width:850px){.hero{grid-template-columns:1fr;min-height:auto;padding-top:65px}.hero-art{min-height:340px}.terminal{max-width:520px}.two-col{gap:30px}.skill-grid{grid-template-columns:repeat(2,1fr)}.project.featured{grid-template-columns:1fr}.diagram{max-width:450px;width:100%;margin:auto}.navlinks{gap:14px}}@media(max-width:650px){.shell{width:min(100% - 32px,1120px)}.nav{height:66px}.menu{display:block}.navlinks{display:none;position:absolute;top:65px;left:0;right:0;background:#0c1728;border-bottom:1px solid var(--line);padding:20px;flex-direction:column;align-items:stretch}.navlinks.open{display:flex}.navlinks a{padding:6px}.hero{padding-top:44px;padding-bottom:50px;gap:0}.hero h1{letter-spacing:-3px}.intro{font-size:16px}.hero-facts{gap:17px;flex-wrap:wrap;margin-top:40px}.hero-art{min-height:335px}.terminal{transform:none}.float-tag{display:none}.section{padding:72px 0}.two-col,.skill-grid,.projects{grid-template-columns:1fr}.project.featured{grid-column:auto;padding:26px}.project{min-height:auto}.timeline-item{grid-template-columns:1fr;gap:7px}.contact-details{flex-direction:column;gap:9px}.footer-inner{gap:15px;flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}

.brand-logo{width:46px;height:46px;object-fit:contain;display:block;flex:none;filter:drop-shadow(0 0 8px #1e5cf155)}

/* Clickable project cards */
.clickable-project{position:relative;transition:transform .2s ease,border-color .2s ease}
.clickable-project:hover,.clickable-project:focus-within{transform:translateY(-3px);border-color:#59baff}
.project-action{display:inline-flex;align-items:center;gap:6px;margin-top:18px;color:#71c6ff;font-weight:750;text-decoration:none;position:static}
.project-action::after{content:"";position:absolute;inset:0;z-index:1}
.project-action:focus-visible{outline:3px solid #7ecbff;outline-offset:4px}


/* Project directory and screenshot galleries */
.hub-main{padding-top:85px;padding-bottom:90px}.hub-main h1{font-size:clamp(40px,6vw,70px);margin:10px 0}.hub-actions{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 38px}.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px}.hub-card{display:block;padding:25px;border:1px solid #30415b;border-radius:16px;background:#121e30;color:#e8f2ff;text-decoration:none;transition:transform .2s,border-color .2s}.hub-card:hover,.hub-card:focus-visible{transform:translateY(-3px);border-color:#54adff}.hub-card h2{font-size:20px;line-height:1.3;margin:13px 0}.hub-card p{color:#b8cbe0;line-height:1.6}.hub-card span,.hub-number{color:#69baff;font-weight:700;font-size:13px}.hub-note{color:#b8cbe0;margin-top:28px}.screenshots{margin:35px 0 25px}.screenshots h2{font-size:25px}.screenshots>p{color:#b8cbe0}.screenshot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-top:18px}.screenshot-placeholder{min-height:160px;border:1px dashed #55708e;border-radius:12px;background:#12243b;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;text-align:center;padding:18px}.screenshot-placeholder span{font-size:32px;color:#69baff}.screenshot-placeholder small{color:#a5b9ce}.portfolio-hub-link{margin:24px 0}