/* style.css - basic mobile-friendly landing page */
:root{
  --accent:#21c17f;
  --dark:#111;
  --muted:#666;
  --bg:#fff;
  --max-width:760px;
}
*{box-sizing:border-box}
body{font-family: system-ui, -apple-system, Arial, sans-serif; background:#fafafa; color:var(--dark); margin:0; padding:20px; display:flex; justify-content:center;}
.page{width:100%; max-width:var(--max-width); background:var(--bg); border-radius:10px; padding:28px; box-shadow:0 8px 30px rgba(0,0,0,0.06);}
.header{text-align:center; margin-bottom:18px;}
.profile{width:110px; height:110px; object-fit:cover; border-radius:999px; display:block; margin:0 auto 12px; border:4px solid #fff; box-shadow:0 6px 18px rgba(0,0,0,0.08);}
h1{font-size:28px; margin:6px 0;}
.sub{color:var(--muted); margin:6px 0 18px;}
.content h2{font-size:20px; line-height:1.2; margin:6px 0 12px; text-align:center;}
.info{color:var(--muted); text-align:center; margin-bottom:18px;}
.telegram-btn{display:block; text-align:center; width:100%; padding:14px; background:var(--accent); color:#fff; border-radius:10px; text-decoration:none; font-weight:700; box-shadow:0 6px 18px rgba(33,193,127,0.18);}
.footer{margin-top:18px; text-align:center; color:var(--muted); font-size:14px;}
@media(min-width:900px){
  h1{font-size:34px;}
  .profile{width:140px;height:140px;}
}