﻿
:root{--p:#0f766e;--a:#99f6e4;--text:#111;--cardw:405px;--cardh:810px}
*{box-sizing:border-box}html,body{margin:0;background:#edf1f4;font-family:Montserrat,Arial,sans-serif;color:var(--text)}
body{min-height:100vh;display:grid;place-items:center;padding:18px}.page-shell{width:100%;display:grid;place-items:center}
.card{position:relative;width:min(100%,var(--cardw));min-height:var(--cardh);background:#fff;overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.16)}
.shape{position:absolute;pointer-events:none}.shape-a{left:-90px;top:-90px;width:240px;height:240px;background:var(--p);border-radius:50%}.shape-b{right:-40px;top:80px;width:110px;height:110px;background:var(--a);border-radius:50%;opacity:.6}.shape-c{right:40px;bottom:40px;width:150px;height:150px;border:18px solid var(--p);border-radius:50%;opacity:.1}
.watermark{position:absolute;right:10px;top:300px;font-size:180px;color:var(--p);opacity:.055}
.pdf-btn{position:absolute;top:42px;left:20px;border:0;background:transparent;color:var(--a);display:flex;flex-direction:column;align-items:center;font-weight:800;z-index:5;cursor:pointer}
.pdf-btn i{font-size:28px;color:var(--p)}.profile{position:relative;z-index:3;text-align:center;padding:48px 28px 0}
.logo{width:132px;height:108px;object-fit:contain}.profile h1{font-size:22px;margin:10px 0 8px}.profile h2{font-size:15px;margin:0 0 8px}.profile p{font-size:13px;margin:0}
.contact-list{position:relative;z-index:3;margin:62px 38px 0 82px;display:flex;flex-direction:column;gap:10px}
.contact-row{display:flex;align-items:center;gap:12px;text-decoration:none;color:#111;font-size:15px;min-height:40px;border:0;background:transparent;text-align:left;padding:0;cursor:pointer}
.ico{width:36px;height:36px;background:var(--p);color:#fff;display:grid;place-items:center;flex:0 0 36px;box-shadow:0 2px 5px rgba(0,0,0,.14)}
.save-row strong{font-size:15px}.bottom-zone{position:relative;z-index:3;margin:98px 30px 12px}
.socials{display:flex;justify-content:space-between;gap:8px;margin-bottom:17px}.s{width:37px;height:37px;border-radius:8px;display:grid;place-items:center;color:#fff;text-decoration:none;font-size:20px}
.fb{background:#316ff6}.ig{background:linear-gradient(135deg,#6d29ff,#ff2f72)}.yt{background:#ff001e}.tw{background:#000}.in{background:#0077b5}.tg{background:#4aaee8}
.action-bar{height:63px;border-radius:10px;background:var(--p);display:flex;align-items:center;overflow:hidden;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.wa{display:flex;align-items:center;gap:12px;flex:1;text-decoration:none;color:#fff;padding:8px 14px}.wa-badge{width:38px;height:38px;border:2px solid rgba(255,255,255,.65);border-radius:8px;display:grid;place-items:center;font-size:25px;background:#0f9d58}
.wa small,.wa strong{display:block}.wa small{font-size:8px}.wa strong{font-size:11px}.divider{height:40px;width:2px;background:#fff}.upi{border:0;background:transparent;color:#fff;font-style:italic;font-size:28px;font-weight:800;padding:0 28px;cursor:pointer}
.upi span{color:var(--a)}.views{font-size:11px;font-weight:700;margin-top:6px}
@media(max-width:430px){body{padding:0;background:#fff}.card{box-shadow:none;width:100%;min-height:100vh}.contact-list{margin-right:18px}.bottom-zone{margin-top:80px}}
@media print{body{padding:0;background:#fff}.card{box-shadow:none}.pdf-btn{display:none}}
/* CREATIVE-EXISTING */
.profile{text-align:left;padding:44px 25px 0 105px}.logo{width:86px;position:absolute;left:19px;top:35px}.contact-list{margin:72px 21px 0;display:grid;grid-template-columns:1fr 1fr}.contact-row{flex-direction:column;text-align:center;background:#fff;padding:9px 5px;border-radius:17px;box-shadow:0 4px 14px #0001}.contact-row:nth-child(3),.contact-row:nth-child(4),.save-row{grid-column:span 2;flex-direction:row;text-align:left}.bottom-zone{margin:41px 22px 12px}.socials{justify-content:space-around}.s{background:var(--p)!important;border-radius:50%;color:var(--a)}.action-bar{border-radius:22px}
@keyframes cardReveal{from{opacity:0;transform:translateX(-32px)}to{opacity:1;transform:none}}@keyframes logoMove{50%{transform:scale(1.04)}}
@keyframes iconReveal{from{opacity:0;transform:translateY(15px) scale(.7)}to{opacity:1}}@keyframes waGlow{50%{box-shadow:0 0 0 7px transparent}}
.card{animation:cardReveal .7s cubic-bezier(.2,.8,.2,1) both}.logo{animation:logoMove 3.2s ease-in-out .8s infinite}.s{animation:iconReveal .45s ease both;transition:transform .2s ease,filter .2s ease}.s:nth-child(1){animation-delay:.1s}.s:nth-child(2){animation-delay:.18s}.s:nth-child(3){animation-delay:.26s}.s:nth-child(4){animation-delay:.34s}.s:nth-child(5){animation-delay:.42s}.s:nth-child(6){animation-delay:.5s}.s:hover{filter:brightness(1.12);transform:translateY(-4px) scale(1.08)}.wa-badge{animation:waGlow 2s ease-out infinite;box-shadow:0 0 0 0 color-mix(in srgb,var(--a) 45%,transparent)}.contact-row{transition:transform .2s ease,box-shadow .2s ease}.contact-row:hover{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){.card,.logo,.s,.wa-badge{animation:none!important}.s,.contact-row{transition:none!important}}
/* END-CREATIVE-EXISTING */

