@font-face{font-family:Inter;font-weight:400;font-style:normal;font-display:swap;src:url("/fonts/inter-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:Inter;font-weight:600;font-style:normal;font-display:swap;src:url("/fonts/inter-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:Inter;font-weight:700;font-style:normal;font-display:swap;src:url("/fonts/inter-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-style:normal;font-display:swap;src:url("/fonts/jetbrains-mono-latin-400-normal.woff2") format("woff2")}
*{box-sizing:border-box} html{scroll-behavior:smooth;color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Helvetica Neue",Arial,sans-serif;font-size:var(--fs-md);line-height:var(--lh-normal)}
a{color:var(--primary);text-decoration:none} a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.mono{font-family:"JetBrains Mono",Menlo,Consolas,monospace}
.skip{position:absolute;left:var(--s4);top:-100px;background:var(--primary);color:var(--on-primary);padding:var(--s2) var(--s4);border-radius:var(--r-pill);font-weight:600;z-index:1400}
.skip:focus{top:var(--s3)}
.wrap{max-width:1120px;margin:0 auto;padding:0 var(--s6)}
header{position:sticky;top:0;z-index:1100;background:var(--bg);border-bottom:1px solid var(--border-subtle)}
.bar{display:flex;align-items:center;justify-content:space-between;height:72px}
.bar img{height:32px;width:auto;display:block}
nav{display:flex;align-items:center;gap:var(--s6);font-size:var(--fs-sm)}
nav>a{color:var(--muted)} nav>a:hover{color:var(--text);text-decoration:none}
.lang{display:inline-flex;border:1px solid var(--primary);border-radius:var(--r-pill);overflow:hidden;font-size:var(--fs-xs)}
.lang a{padding:var(--s1) var(--s3);color:var(--primary);min-height:24px;display:flex;align-items:center}
.lang a:hover{text-decoration:none;background:var(--surface)}
.lang a[aria-current=true]{background:var(--primary);color:var(--on-primary)}
.hero{position:relative;overflow:hidden;padding:var(--s16) 0}
.hero .art{position:absolute;right:-40px;top:24px;width:460px;opacity:.1;pointer-events:none}
.kicker{font-size:var(--fs-sm);letter-spacing:.08em;text-transform:uppercase;color:var(--primary)}
h1{text-wrap:balance;font-size:var(--fs-4xl);line-height:var(--lh-tight);letter-spacing:-.02em;margin:var(--s4) 0 var(--s5);max-width:20ch;font-weight:700}
.lead{font-size:var(--fs-lg);line-height:var(--lh-normal);color:var(--muted);max-width:56ch;margin:0 0 var(--s8)}
.btns{display:flex;gap:var(--s3);flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:var(--s3) var(--s6);border-radius:var(--r-pill);font-weight:600;font-size:var(--fs-md);transition:background var(--d-base)}
.btn.primary{background:var(--primary);color:var(--on-primary)} .btn.primary:hover{text-decoration:none;filter:brightness(1.08)}
.btn.ghost{border:1px solid var(--border);color:var(--text)} .btn.ghost:hover{text-decoration:none;background:var(--surface)}
section{padding:var(--s12) 0;border-top:1px solid var(--border-subtle)}
h2{text-wrap:balance;font-size:var(--fs-3xl);line-height:var(--lh-tight);letter-spacing:-.02em;margin:var(--s2) 0 var(--s8);font-weight:700}
.grid{display:grid;gap:var(--s5)} .g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--r-md);padding:var(--s6)}
.card .n{color:var(--accent);font-size:var(--fs-sm)} .card h3{font-size:var(--fs-xl);line-height:var(--lh-snug);margin:var(--s3) 0 var(--s2)} .card p{margin:0;color:var(--muted)}
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.bento .wide{grid-column:span 2}
.tcard{background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--r-md);padding:var(--s6)}
.tcard .k{color:var(--muted);font-size:var(--fs-sm);font-weight:400;margin:0 0 var(--s4)}
.tcard ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--s3)}
.tcard.wide ul{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s3) var(--s5)}
.tcard li{display:flex;align-items:center;gap:var(--s3);font-size:var(--fs-lg);font-weight:600;line-height:var(--lh-snug)}
.tcard li::before{content:"";flex:none;width:8px;height:8px;border-radius:var(--r-pill);background:var(--primary)}
.contact{text-align:center} .contact h2{max-width:20ch;margin:var(--s2) auto var(--s4)} .contact .lead{margin:0 auto var(--s6)}
.mail{display:block;margin-top:var(--s5);font-size:var(--fs-lg)}
footer{border-top:1px solid var(--border-subtle);padding:var(--s8) 0;color:var(--muted);font-size:var(--fs-sm)}
@media (max-width:1024px){.bento{grid-template-columns:repeat(2,1fr)}}
@media (max-width:768px){
  .wrap{padding:0 var(--s5)} h1{font-size:var(--fs-2xl)} h2{font-size:var(--fs-2xl)} .lead{font-size:var(--fs-md)}
  nav>a{display:none} .hero{padding:var(--s10) 0} .hero .art{width:260px;right:-60px;top:8px}
  .g2{grid-template-columns:1fr} .bento{grid-template-columns:1fr} .bento .wide{grid-column:auto} .bar img{height:28px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
