:root {
  --bg: #080b14;
  --bg-2: #10172a;
  --panel: rgba(255,255,255,.075);
  --panel-strong: rgba(255,255,255,.12);
  --text: #f6f8ff;
  --muted: #c3c9de;
  --line: rgba(255,255,255,.18);
  --accent: #5264ff;
  --accent-2: #29d4e8;
  --paper: #f6f8ff;
  --ink: #0d1324;
  --ink-muted: #4a546c;
  --radius: 22px;
  --shadow: 0 24px 80px rgba(0,0,0,.28);
  --max: 1160px;
  color-scheme: dark light;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .22em; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--accent-2); outline-offset: 4px; }
img { max-width: 100%; height: auto; display: block; }
.skip-link { position:absolute; left:-999px; top: 1rem; padding:.7rem 1rem; background:#fff; color:#000; z-index:999; border-radius:.6rem; }
.skip-link:focus { left:1rem; }
.site-header {
  position: sticky; top: 0; z-index: 50;
  border-bottom: 1px solid var(--line);
  background: rgba(8,11,20,.82);
  backdrop-filter: blur(18px);
}
.nav {
  max-width: var(--max); margin: 0 auto; padding: .75rem 1.2rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.brand { display:flex; align-items:center; gap:.75rem; text-decoration:none; font-weight:800; letter-spacing:.02em; }
.brand img { width: 44px; height:44px; object-fit:contain; }
.nav-links { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:.55rem; }
.nav-links a { padding:.45rem .65rem; border-radius:999px; text-decoration:none; font-size:.95rem; color:var(--muted); }
.nav-links a:hover { color:var(--text); background:var(--panel); }
.lang { border:1px solid var(--line); color:var(--text)!important; }
.section { position:relative; overflow:hidden; }
.container { max-width: var(--max); margin:0 auto; padding: 6.5rem 1.2rem; position:relative; z-index:2; }
.hero { min-height: 88svh; display:grid; align-items:center; background:
  radial-gradient(circle at 82% 22%, rgba(82,100,255,.25), transparent 34rem),
  radial-gradient(circle at 18% 80%, rgba(41,212,232,.16), transparent 32rem),
  linear-gradient(135deg, #060914, #121b34 55%, #090b14); }
.hero-grid { display:grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap:4rem; align-items:center; }
.kicker { color: var(--accent-2); font-weight: 800; letter-spacing:.14em; text-transform:uppercase; font-size:.82rem; }
h1, h2, h3 { line-height:1.08; margin:0; }
h1 { font-size: clamp(2.7rem, 7vw, 6.6rem); letter-spacing:-.07em; margin-top: .6rem; }
h2 { font-size: clamp(2.1rem, 4vw, 4rem); letter-spacing:-.045em; }
h3 { font-size:1.35rem; letter-spacing:-.02em; }
.lead { font-size: clamp(1.12rem, 2.2vw, 1.5rem); max-width: 70ch; color: var(--muted); margin:1.4rem 0 0; }
.actions { display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; border-radius:999px; padding:.86rem 1.15rem; border:1px solid var(--line); text-decoration:none; font-weight:750; }
.btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color:#050714; border-color:transparent; }
.btn.ghost { background: rgba(255,255,255,.06); }
.hero-card { background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.04)); border:1px solid var(--line); border-radius: calc(var(--radius) + 12px); padding:2rem; box-shadow: var(--shadow); }
.hero-card img { width:min(270px,70%); margin:0 auto 1.2rem; }
.hero-card ul { margin:1rem 0 0; padding-left:1.1rem; color:var(--muted); }
.light { background: var(--paper); color:var(--ink); }
.light .kicker { color:#364bef; }
.light .lead, .light .muted { color:var(--ink-muted); }
.light .card { background:#fff; border-color:#dbe1f2; }
.light .btn.ghost { background:#fff; border-color:#dbe1f2; }
.section-title { max-width:780px; margin-bottom:2.4rem; }
.grid { display:grid; gap:1.05rem; }
.grid.two { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.card { background: var(--panel); border:1px solid var(--line); border-radius: var(--radius); padding:1.35rem; box-shadow: 0 8px 32px rgba(0,0,0,.13); }
.card p { color:var(--muted); margin:.75rem 0 0; }
.light .card p { color:var(--ink-muted); }
.badges { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1rem; }
.badge { font-size:.82rem; padding:.35rem .55rem; border-radius:999px; background:rgba(82,100,255,.14); color:inherit; border:1px solid rgba(82,100,255,.25); }
.split { display:grid; grid-template-columns: .85fr 1.15fr; gap:2rem; align-items:start; }
.consulting { background:
  linear-gradient(120deg, rgba(8,11,20,.98), rgba(15,25,48,.95)),
  radial-gradient(circle at 20% 20%, rgba(41,212,232,.18), transparent 30rem); }
.lab { background:#050710; }
.project { min-height: 520px; display:grid; align-items:end; background-size: cover; background-position:center; isolation:isolate; }
.project::before { content:""; position:absolute; inset:0; z-index:0; background: linear-gradient(90deg, rgba(5,7,16,.97), rgba(5,7,16,.76) 48%, rgba(5,7,16,.34)); }
.project.chatavion { background-image:url('../assets/chatavion-bg.webp'); }
.project.placardistan { background-image:url('../assets/placardistan-bg.webp'); background-position:center; }
.project .container { padding-top:5rem; padding-bottom:5rem; }
.project-content { max-width:700px; background:rgba(5,7,16,.68); border:1px solid var(--line); border-radius:calc(var(--radius) + 8px); padding:1.8rem; backdrop-filter: blur(10px); }
.project-content p { color:var(--muted); }
.publications { background: linear-gradient(180deg, #f8f9ff, #eef2ff); }
.profile { background:
  radial-gradient(circle at 85% 5%, rgba(82,100,255,.2), transparent 35rem),
  linear-gradient(135deg, #0b1020, #050710); }
.contact { background: linear-gradient(135deg, #eef2ff, #ffffff); color:var(--ink); }
.contact-box { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; background:#fff; border:1px solid #dbe1f2; border-radius: calc(var(--radius) + 8px); padding:1.5rem; box-shadow:0 20px 60px rgba(20,30,60,.12); }
.email-display { font-size: clamp(1.15rem, 3vw, 1.85rem); font-weight:800; letter-spacing:-.02em; word-break:break-word; }
button.btn { cursor:pointer; font:inherit; }
.footer { background:#050710; color:var(--muted); border-top:1px solid var(--line); }
.footer .container { padding-top:2rem; padding-bottom:2rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; }
.legal-main { background:#f8f9ff; color:var(--ink); min-height:100svh; }
.legal-main .container { max-width:900px; }
.legal-main h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
.legal-main dl { display:grid; grid-template-columns: 180px 1fr; gap:.65rem 1rem; }
.legal-main dt { font-weight:800; }
.legal-main dd { margin:0; color:var(--ink-muted); }
@media (max-width: 900px) {
  .hero-grid, .split, .grid.two, .grid.three { grid-template-columns:1fr; }
  .container { padding-top:4.6rem; padding-bottom:4.6rem; }
  .nav { align-items:flex-start; }
  .nav-links { gap:.2rem; }
  .nav-links a { font-size:.88rem; padding:.35rem .45rem; }
  .project { min-height:unset; }
  .project::before { background: linear-gradient(180deg, rgba(5,7,16,.92), rgba(5,7,16,.72)); }
}
@media (max-width: 620px) {
  .brand span { display:none; }
  .hero-card { padding:1.2rem; }
  .contact-box { display:block; }
  .contact-box .btn { margin-top:1rem; width:100%; }
  .legal-main dl { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } * { transition:none!important; animation:none!important; } }
