*{box-sizing:border-box}
:root{--bg:#0b0c10;--card:#121318;--muted:#9aa4b2;--text:#eaf2ff;--accent:#4ea1ff;--line:rgba(255,255,255,.08)}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:980px;margin:0 auto;padding:0 20px}
header{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(11,12,16,.7);backdrop-filter:saturate(1.2) blur(8px)}
.brand{display:flex;gap:12px;align-items:center;padding:14px 0}
.dot{width:12px;height:12px;border-radius:999px;background:linear-gradient(135deg,#4ea1ff,#78f0c4);box-shadow:0 0 18px rgba(78,161,255,.6)}
h1{font-size:20px;margin:0}.sub{margin:2px 0 0;color:var(--muted);font-size:14px}
nav{display:flex;gap:16px;align-items:center;padding-bottom:12px}
nav a{color:var(--text);opacity:.9}
main{padding:30px 0}
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:center}
.hero h2{margin:.2rem 0 10px;font-size:28px}
.hero p{color:var(--muted)}
.photo img{width:100%;border-radius:16px;border:1px solid var(--line);box-shadow:0 18px 60px rgba(0,0,0,.35)}
.section{margin-top:26px;padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.03)}
.grid{display:grid;gap:16px;grid-template-columns:1fr 1fr}
.card{padding:16px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
ul.clean{list-style:disc;padding-left:20px;color:var(--muted)}
label{display:block;margin:.25rem 0 .25rem}.input,textarea{width:100%;padding:12px;border-radius:12px;background:#0f1117;border:1px solid var(--line);color:var(--text)}
button{margin-top:10px;padding:10px 14px;border-radius:12px;background:linear-gradient(135deg,#4ea1ff,#78f0c4);color:#031226;font-weight:700;border:none;cursor:pointer}
footer{border-top:1px solid var(--line);padding:18px 0 40px;color:var(--muted)}
@media (max-width:860px){.hero{grid-template-columns:1fr}}