@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@700&display=swap');

:root{
  --green:#176b3a; --green-dark:#0d4b29; --green-soft:#eaf5ed;
  --orange:#f28c28; --cream:#f7fbf5; --text:#173221; --muted:#6b7b70;
}
*{box-sizing:border-box}
body{
  margin:0; min-height:100vh; font-family:'DM Sans',sans-serif; color:var(--text);
  background:
    radial-gradient(circle at 10% 10%, rgba(242,140,40,.16), transparent 28%),
    radial-gradient(circle at 90% 85%, rgba(23,107,58,.16), transparent 32%),
    var(--cream);
}
.page{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:28px 16px}
.card{
  position:relative;overflow:hidden;width:min(100%,520px);padding:42px 28px 24px;
  background:rgba(255,255,255,.94);border:1px solid rgba(23,107,58,.10);
  border-radius:30px;box-shadow:0 20px 60px rgba(20,70,38,.13);text-align:center;
}
.card:before{
  content:"";position:absolute;inset:0 0 auto;height:7px;
  background:linear-gradient(90deg,var(--green),var(--orange),var(--green));
}
.brand-mark{
  width:72px;height:72px;margin:0 auto 17px;border-radius:50%;
  display:grid;place-items:center;font-size:34px;background:var(--green-soft);
  box-shadow:inset 0 0 0 1px rgba(23,107,58,.08);
}
h1{font-family:'Playfair Display',serif;font-size:34px;line-height:1.1;margin:0 0 9px;color:var(--green-dark)}
.tagline{margin:0 auto 10px;font-weight:700;color:var(--orange);font-size:15px}
.intro{margin:0 auto 25px;max-width:390px;color:var(--muted);font-size:14px;line-height:1.55}
.links{display:grid;gap:12px}
.link{
  min-height:58px;padding:10px 15px;display:grid;grid-template-columns:38px 1fr 24px;
  align-items:center;gap:8px;text-decoration:none;color:#fff;border-radius:16px;
  font-weight:700;font-size:15px;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  box-shadow:0 8px 18px rgba(23,107,58,.10);
}
.link:hover{transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 12px 24px rgba(23,107,58,.16)}
.link .icon{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  background:rgba(255,255,255,.18);font-size:20px
}
.link .arrow{opacity:.85;font-size:18px}
.website{background:linear-gradient(135deg,#176b3a,#0d4b29)}
.whatsapp{background:linear-gradient(135deg,#24a95a,#12843f)}
.tiktok{background:linear-gradient(135deg,#151515,#3c3c3c)}
.facebook{background:linear-gradient(135deg,#1877f2,#145bd1)}
.email{background:linear-gradient(135deg,#f28c28,#d96e0e)}
footer{
  display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:24px;
  color:#87958b;font-size:11px;letter-spacing:.08em
}
.leaf{position:absolute;width:110px;height:55px;background:rgba(23,107,58,.05);border-radius:100% 0 100% 0;transform:rotate(25deg)}
.leaf-1{left:-48px;top:110px}.leaf-2{right:-50px;bottom:100px;transform:rotate(205deg)}
@media(max-width:420px){
  .card{padding:36px 18px 20px;border-radius:24px}
  h1{font-size:29px}.link{font-size:14px}
}
