:root{
  --cream:#F4EEE1;
  --cream-2:#FBF8F1;
  --rust:#A85231;
  --ink:#28221B;
  --ink-soft:#5C5347;
  --line:rgba(40,34,27,.16);
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Work Sans', sans-serif;
  background:#FFFFFF;
  color:var(--ink);
  min-height:100vh;
  overflow-x:hidden;
}
.wrap{
  max-width:420px;
  margin:0 auto;
  padding:56px 24px 60px;
  text-align:center;
}
.logo{
  width:76px;height:76px;
  margin:0 auto 20px;
  border-radius:50%;
  overflow:hidden;
}
.logo img{ width:100%; height:100%; object-fit:contain; }
h1{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:24px;
  margin:0;
}
.sub{
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-top:10px;
  margin-bottom:44px;
}
.links{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.link-btn{
  display:flex;
  align-items:center;
  gap:16px;
  background:var(--cream);
  border:1px solid var(--line);
  border-radius:14px;
  padding:18px 20px;
  text-decoration:none;
  color:var(--ink);
  text-align:left;
  transition:.15s ease;
}
.link-btn:active{
  background:var(--rust);
  color:var(--cream-2);
}
.link-icon{
  width:38px; height:38px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--cream-2);
  border:1px solid var(--rust);
  display:flex; align-items:center; justify-content:center;
}
.link-icon svg{width:18px; height:18px; stroke:var(--rust); fill:none; stroke-width:1.6;}
.link-text{ flex:1; }
.link-title{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:16px;
  margin:0;
}
.link-sub{
  font-size:12px;
  color:var(--ink-soft);
  margin-top:2px;
}
.arrow{ color:var(--rust); font-size:18px; }
footer{
  margin-top:50px;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
}

@media (max-width:360px){
  .wrap{ padding:40px 16px 40px; }
  h1{ font-size:21px; }
  .link-btn{ padding:15px 16px; gap:12px; }
  .link-title{ font-size:14.5px; }
}