:root{
  --bg:#eef0f2;
  --bg2:#ffffff;
  --card:#ffffff;
  --ink:#141619;
  --muted:#5b6167;
  --line:rgba(20,22,25,.10);
  --green:#1faa53;
  --radius:18px;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:radial-gradient(900px 500px at 50% -80px,#ffffff 0%,var(--bg) 62%) fixed,var(--bg);
  color:var(--ink);min-height:100vh;
  display:flex;justify-content:center;
  padding:34px 16px 48px;
}
.bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.bg-tag{
  position:absolute;top:44%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);
  font-family:'Archivo',sans-serif;font-weight:900;font-size:22vh;letter-spacing:.02em;
  color:transparent;-webkit-text-stroke:1px rgba(20,22,25,.07);white-space:nowrap;
}
.wrap{width:100%;max-width:480px;position:relative;z-index:1;display:flex;flex-direction:column;gap:18px}
.hero{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.logo-float img{
  width:168px;height:auto;max-height:168px;object-fit:contain;
  background:none!important;border:none!important;border-radius:0!important;box-shadow:none!important;
  filter:drop-shadow(0 14px 24px rgba(20,22,25,.18));
  animation:float 4.5s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.avatar-fallback{
  width:120px;height:120px;border-radius:34px;background:#141619;color:#fff;
  font-family:'Archivo',sans-serif;font-weight:900;font-size:56px;
  display:flex;align-items:center;justify-content:center;
  filter:drop-shadow(0 14px 24px rgba(20,22,25,.20));
  animation:float 4.5s ease-in-out infinite;
}
.pill{
  font-family:'Archivo',sans-serif;font-size:11px;font-weight:800;letter-spacing:.18em;
  border:1px solid var(--line);border-radius:999px;padding:7px 14px;color:#3a4047;
  background:#fff;display:inline-flex;gap:8px;align-items:center;
}
h1{font-family:'Archivo',sans-serif;font-weight:900;font-size:34px;letter-spacing:-.02em;color:var(--ink)}
.handle{color:var(--ink);font-weight:700;text-decoration:none;font-size:15px;opacity:.9}
.handle:hover{text-decoration:underline}
.bio{color:var(--muted);font-size:14px;font-weight:500}
.links{display:flex;flex-direction:column;gap:12px}
.btn{
  display:flex;align-items:center;gap:13px;background:var(--card);color:var(--ink);
  border-radius:var(--radius);padding:13px 15px;text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease;
  box-shadow:0 10px 26px rgba(20,22,25,.10);
  border:1px solid var(--line);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(20,22,25,.16)}
.btn .ico{
  width:46px;height:46px;flex:0 0 46px;border-radius:14px;background:#141619;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;
}
.btn .ico-green{background:var(--green);color:#fff}
.btn .txt{flex:1;display:flex;flex-direction:column;gap:2px;text-align:left}
.btn .txt strong{font-family:'Archivo',sans-serif;font-size:15.5px;font-weight:800}
.btn .txt small{font-size:12.5px;color:#5b6167;font-weight:500}
.btn .arrow{color:#141619;opacity:.35;font-size:14px}
.btn-star{border:2px solid var(--green);position:relative}
.dots{display:flex;gap:8px;justify-content:center;padding:4px 0}
.dots span{width:6px;height:6px;border-radius:50%;background:#c9ced3}
.dots span:nth-child(2){background:#141619}
.store{
  border:1px solid var(--line);border-radius:22px;padding:18px;background:#fff;
  box-shadow:0 10px 26px rgba(20,22,25,.08);
}
.store h2{font-family:'Archivo',sans-serif;font-size:16px;font-weight:800;margin-bottom:4px}
.store h2 i{margin-right:8px}
.store p{color:var(--muted);font-size:13.5px;margin-bottom:12px}
.map{border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.map iframe{width:100%;height:220px;border:0;display:block;filter:grayscale(1) contrast(1.05)}
.btn-visit{margin-top:12px}
.social{display:flex;gap:12px;justify-content:center}
.social a{
  width:48px;height:48px;border-radius:50%;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:var(--ink);font-size:20px;
  background:#fff;text-decoration:none;transition:transform .18s;
}
.social a:hover{transform:translateY(-2px);background:#141619;color:#fff}
footer{text-align:center;color:var(--muted);font-size:12px;padding-top:4px}
.reveal{opacity:0;transform:translateY(16px);animation:up .6s ease forwards}
.links .btn:nth-child(1){animation-delay:.05s}.links .btn:nth-child(2){animation-delay:.12s}
.links .btn:nth-child(3){animation-delay:.19s}.links .btn:nth-child(4){animation-delay:.26s}
.links .btn:nth-child(5){animation-delay:.33s}
@keyframes up{to{opacity:1;transform:none}}
@media(max-width:380px){h1{font-size:29px}.logo-float img{width:140px}}
