/* ceibapatrimonial.com/tip: one friendly money tip, on jungle green, built for phones scanning a QR */
.tip-page{background:var(--selva); color:var(--caliza)}
.tip-main{max-width:640px; margin:0 auto; min-height:100svh; padding:calc(96px + env(safe-area-inset-top,0px)) 16px 40px; display:flex; flex-direction:column; align-items:stretch}
.tip-eyebrow{font:700 13px/1.3 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--miel-light); text-align:center}
.tip-card{margin-top:18px; background:var(--papel); color:var(--selva); border-radius:24px; padding:28px 24px 22px; box-shadow:0 18px 50px rgba(0,0,0,.25)}
.tip-card.in{animation:tipIn .45s cubic-bezier(.2,.7,.2,1)}
@keyframes tipIn{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
.tip-cat{display:inline-block; font:700 12px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase; color:var(--miel-ink); border:1.5px solid var(--miel); border-radius:999px; padding:8px 14px}
.tip-text{margin-top:18px; font:400 clamp(25px, 6.4vw, 34px)/1.28 var(--serif); color:var(--selva); text-wrap:pretty}
.tip-src{margin-top:16px; font-size:13.5px; line-height:1.4; color:#56635C}
.tip-src a{color:inherit}
.tip-num{margin-top:18px; padding-top:14px; border-top:1px solid rgba(30,74,59,.15); font-size:13.5px; color:#56635C}
.tip-actions{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:18px}
.tip-actions .btn{width:100%}
.tip-actions .btn-ghost{background:transparent}
.tip-copied{margin-top:10px; text-align:center; font-size:14px; color:var(--miel-light)}
.tip-invite{margin-top:40px; text-align:center}
.tip-invite h2{color:var(--caliza); font-size:clamp(26px, 6vw, 34px)}
.tip-invite p{margin-top:10px; color:#DCE8DF; font-size:16.5px; line-height:1.5}
.tip-invite-actions{margin-top:18px; display:flex; flex-direction:column; align-items:center; gap:14px}
.tip-invite .ico{width:20px; height:20px}
.tip-link{color:var(--caliza); font-weight:600; text-underline-offset:3px}
.tip-disclaimer{margin-top:36px; text-align:center; font-size:12.5px; line-height:1.5; color:#A9C4B0}
@media (min-width:720px){ .tip-card{padding:40px 40px 28px} .tip-main{justify-content:center} }
@media (prefers-reduced-motion:reduce){ .tip-card.in{animation:none} }