:root{
  --green: #157a52;
  --green-dark: #0e3b2e;
  --green-tint: #e8f4ee;
  --pink: #ec7f95;
  --pink-tint: #fdeef1;
  --ink: #1c2b23;
  --ink-soft: #6b7d73;
  --paper: #f7f6f2;
  --line: #e7e5df;
}

*{ box-sizing:border-box; }

html,body{
  margin:0;
  overflow-x:hidden;
}

body{
  font-family:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
  color:var(--ink);
  background:var(--paper);
  padding:56px 20px 40px;
}

h1{ font-family:"Sora","Plus Jakarta Sans",sans-serif; margin:0; }

a{ color:var(--green-dark); text-decoration:none; }

.bg{
  position:fixed;
  inset:0;
  z-index:-1;
  overflow:hidden;
}
.blob{ position:absolute; border-radius:50%; filter: blur(6px); }
.blob-a{ bottom:-220px; right:-180px; width:560px; height:560px; background: radial-gradient(circle, rgba(21,122,82,0.10), transparent 70%); }
.blob-b{ top:-160px; left:-160px; width:420px; height:420px; background: radial-gradient(circle, rgba(236,127,149,0.10), transparent 70%); }

.page{
  width:100%;
  max-width:420px;
  margin:0 auto;
}

.brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:6px;
}

.avatar{
  width:104px;
  height:104px;
  border-radius:50%;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  border:1px solid var(--line);
  box-shadow: 0 0 0 6px var(--green-tint), 0 0 0 8px var(--line), 0 16px 30px -14px rgba(14,59,46,0.35);
  margin-bottom:16px;
}
.avatar img{ width:100%; height:100%; object-fit:contain; }

h1{ font-size:26px; font-weight:800; letter-spacing:-0.01em; color:var(--green-dark); }

.kicker{
  font-size:11.5px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom:6px;
}

.tagline{
  margin:2px 0 4px;
  font-size:14.5px;
  line-height:1.55;
  color:var(--ink-soft);
  max-width:320px;
}
.tagline strong{ color:var(--ink); font-weight:700; }

.verified{
  width:22px; height:22px;
  border-radius:50%;
  background:var(--green);
  display:flex; align-items:center; justify-content:center;
  margin:6px 0 14px;
}

.social-row{
  display:flex;
  gap:10px;
  margin-bottom:34px;
}
.social-btn{
  width:44px; height:44px;
  border-radius:50%;
  background:#fff;
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  color:var(--green-dark);
  box-shadow: 0 6px 16px -10px rgba(14,59,46,0.3);
  transition: transform 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
.social-btn:hover{ transform:translateY(-2px); color:var(--pink); box-shadow: 0 10px 20px -10px rgba(14,59,46,0.4); }

.section-label{
  display:flex;
  align-items:center;
  gap:14px;
  justify-content:center;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom:18px;
}
.section-label span{ width:34px; height:1px; background:var(--line); }

.links{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.link-row{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  border-radius:18px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow: 0 6px 18px -14px rgba(14,59,46,0.25);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
a.link-row:hover{
  transform:translateY(-2px);
  box-shadow: 0 14px 26px -14px rgba(14,59,46,0.3);
  border-color: var(--green-tint);
}
.link-row.featured{
  background: linear-gradient(135deg, var(--green-tint), #fff 60%);
  border-color: var(--green-tint);
}
.link-row.plain{ cursor:default; }

.badge{
  width:42px; height:42px;
  flex-shrink:0;
  border-radius:12px;
  background:var(--green-tint);
  display:flex; align-items:center; justify-content:center;
}

.link-text{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  flex:1;
}
.link-title{
  font-weight:700;
  font-size:15px;
  color:var(--ink);
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.link-sub{
  font-size:13px;
  color:var(--ink-soft);
}

.star-tag{
  font-size:10px;
  font-weight:700;
  letter-spacing:0.04em;
  color:var(--green-dark);
  background:#fff;
  border:1px solid var(--green-tint);
  padding:3px 8px;
  border-radius:999px;
}

.chev{ color:var(--ink-soft); flex-shrink:0; }

.foot{
  text-align:center;
  margin-top:36px;
  font-size:12.5px;
  color:var(--ink-soft);
}

@media (max-width:480px){
  body{ padding:40px 16px 32px; }
  .avatar{ width:92px; height:92px; }
  h1{ font-size:23px; }
}