:root{
  --bg:#0f0a1a;
  --card:rgba(28,20,46,0.88);
  --border:rgba(150,120,220,0.16);
  --tile:rgba(150,120,220,0.07);
  --tile-border:rgba(150,120,220,0.12);
  --fg:#f1ecff;
  --muted:#9d8fb8;
  --primary:#b088ff;
  --primary-2:#6a3cd6;
  --gradient:linear-gradient(135deg,#a974ff,#6a3cd6);
  --shadow-glow:0 0 60px rgba(169,116,255,0.4);
  --shadow-card:0 30px 80px -20px rgba(0,0,0,0.65),0 0 0 1px rgba(150,120,220,0.1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{min-height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background:var(--bg);color:var(--fg);
  min-height:100vh;min-height:100dvh;
  padding:64px 20px;
  padding-bottom:max(64px, calc(env(safe-area-inset-bottom, 0px) + 64px));
  position:relative;overflow-x:hidden;
}
.glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0}
.glow-top{top:-160px;left:50%;transform:translateX(-50%);width:500px;height:500px;background:var(--gradient);opacity:.35}
.glow-bottom{bottom:0;right:0;width:300px;height:300px;background:var(--primary-2);opacity:.22}

.card{
  position:relative;z-index:1;width:100%;max-width:560px;margin:0 auto;
  background:var(--card);backdrop-filter:blur(24px);
  border:1px solid var(--border);border-radius:28px;
  padding:44px 36px 40px;box-shadow:var(--shadow-card);
}

.head{text-align:center;padding-bottom:4px}
.avatar{
  width:112px;height:112px;border-radius:50%;margin:0 auto;
  background:var(--gradient);padding:3px;box-shadow:var(--shadow-glow);
}
.avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.head h1{margin-top:18px;font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.sub{margin-top:6px;color:var(--muted);font-size:13px}

.contacts{
  list-style:none;margin-top:24px;
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
.contacts li{min-width:0}
.contacts a,.contacts .static{
  display:flex;align-items:center;gap:10px;
  height:100%;min-height:64px;padding:10px 12px;
  border-radius:14px;background:var(--tile);
  border:1px solid var(--tile-border);
  text-decoration:none;color:inherit;transition:background .2s,border-color .2s,transform .15s;
}
.contacts a:hover{
  background:rgba(150,120,220,0.12);
  border-color:rgba(150,120,220,0.28);
  transform:translateY(-1px);
}
.icn{
  width:36px;height:36px;border-radius:10px;
  background:rgba(150,120,220,0.14);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  color:var(--primary);transition:background .2s,color .2s;
}
.icn svg{width:15px;height:15px;display:block}
.contacts a:hover .icn{background:var(--gradient);color:#fff}
.contacts .info{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.contacts em{
  font-style:normal;font-size:9px;text-transform:uppercase;
  letter-spacing:.12em;color:var(--muted);line-height:1;
}
.contacts b{
  font-weight:500;font-size:12px;line-height:1.35;
  word-break:break-word;color:var(--fg);
}

.section-title{
  font-size:10px;text-align:center;text-transform:uppercase;
  letter-spacing:.18em;color:var(--muted);font-weight:600;
}

.req{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.req h2{margin-bottom:20px}
.req-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 32px;
}
.req-col{
  display:flex;
  flex-direction:column;
  gap:0;
  min-width:0;
}
.req-item{
  display:flex;flex-direction:column;gap:6px;
}
.req-item + .req-item{margin-top:18px}
.req-label{
  font-size:9px;text-transform:uppercase;letter-spacing:.12em;
  color:var(--muted);line-height:1.2;
}
.req-value{
  font-size:13px;line-height:1.4;font-weight:500;
  color:var(--fg);word-break:break-word;
}

footer{
  margin-top:28px;padding-top:22px;
  border-top:1px solid var(--border);text-align:center;
}
footer p{font-size:11px;color:var(--muted);letter-spacing:.02em}

@media (max-width:520px){
  body{padding:40px 16px;padding-bottom:max(40px, calc(env(safe-area-inset-bottom, 0px) + 40px))}
  .card{padding:32px 20px 36px;max-width:100%}
  .head h1{font-size:23px}
  .contacts{grid-template-columns:1fr;gap:8px}
  .contacts a,.contacts .static{min-height:0}
  .req-list{grid-template-columns:1fr;gap:0}
  .req-col + .req-col{margin-top:24px;padding-top:24px;border-top:1px solid var(--border)}
  .req-item + .req-item{margin-top:16px}
}
