:root{
  --bg:#faf7f2;
  --card:#ffffff;
  --ink:#2b2724;
  --muted:#6f6862;
  --line:#eae3d9;
  --accent:#c97b52;
  --accent-ink:#ffffff;
  --tick:#3a9d6a;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:"Inter",system-ui,-apple-system,sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

.announce{
  background:var(--ink);
  color:#f6efe6;
  font-size:.82rem;
  letter-spacing:.01em;
  text-align:center;
  padding:.6rem 1rem;
}

.wrap{
  max-width:640px;
  margin:0 auto;
  padding:2.4rem 1.25rem 3rem;
}

.hero{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:20px;
  padding:2.4rem 1.6rem 2.2rem;
  box-shadow:0 12px 40px rgba(60,45,30,.06);
  text-align:center;
}

.eyebrow{
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1rem;
}

h1{
  font-family:"Fraunces",Georgia,serif;
  font-weight:600;
  font-size:1.9rem;
  line-height:1.16;
  letter-spacing:-.01em;
  margin-bottom:1rem;
}

.sub{
  color:var(--muted);
  font-size:1.02rem;
  max-width:32rem;
  margin:0 auto 1.8rem;
}

.portrait{margin:0 auto 1.8rem;width:170px;height:170px}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:50%;border:4px solid var(--bg);box-shadow:0 6px 20px rgba(60,45,30,.14)}
.portrait-ph{
  width:100%;height:100%;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#e9ddcf,#d8c7b4);
  color:#8a7457;font-family:"Fraunces",serif;font-weight:600;font-size:2.6rem;letter-spacing:.04em;
  border:4px solid var(--bg);box-shadow:0 6px 20px rgba(60,45,30,.14);
}

.points{
  list-style:none;
  text-align:left;
  max-width:30rem;
  margin:0 auto 2rem;
  display:grid;
  gap:.85rem;
}
.points li{
  position:relative;
  padding-left:2rem;
  font-size:1rem;
  color:var(--ink);
}
.tick{
  position:absolute;left:0;top:.15rem;
  width:1.25rem;height:1.25rem;border-radius:50%;
  background:var(--tick);
}
.tick::after{
  content:"";position:absolute;left:.42rem;top:.24rem;
  width:.28rem;height:.55rem;border:solid #fff;border-width:0 .14rem .14rem 0;
  transform:rotate(45deg);
}

.cta{
  display:block;
  width:100%;
  background:var(--accent);
  color:var(--accent-ink);
  text-decoration:none;
  font-weight:700;
  font-size:1.12rem;
  padding:1.05rem 1.5rem;
  border-radius:14px;
  box-shadow:0 8px 22px rgba(201,123,82,.32);
  transition:transform .12s ease, box-shadow .12s ease;
}
.cta:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(201,123,82,.4)}
.cta:active{transform:translateY(0)}

.reassure{
  color:var(--muted);
  font-size:.9rem;
  margin-top:1rem;
}

.foot{
  margin-top:1.8rem;
  text-align:center;
  color:#a49a8e;
  font-size:.78rem;
  line-height:1.5;
  padding:0 .5rem;
}
.foot p{max-width:34rem;margin:0 auto}
.foot .copy{margin-top:.9rem}

@media(min-width:560px){
  h1{font-size:2.25rem}
  .hero{padding:2.8rem 2.4rem 2.4rem}
}

@media (prefers-color-scheme:dark){
  :root{
    --bg:#1c1916;--card:#26221e;--ink:#f3ece2;--muted:#b3a999;--line:#39322b;
    --accent:#e08a5c;--tick:#4bb57e;
  }
  .portrait-ph{background:linear-gradient(135deg,#3a3229,#4a3f31);color:#d8c3a5}
}