﻿
:root{--p:#0f172a;--a:#22d3ee;--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:0;top:0;width:86px;height:100%;background:var(--p)}.shape-b{left:64px;top:0;width:70px;height:100%;background:linear-gradient(180deg,transparent,var(--a),transparent);clip-path:polygon(60% 0,100% 0,40% 100%,0 100%)}.shape-c{right:0;bottom:0;width:170px;height:170px;border:2px solid var(--a);border-radius:50%;opacity:.18}
.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 */
.card{border-radius:5px}.profile{text-align:left;padding:40px 35px 0 125px}.logo{width:94px}.contact-list{margin:52px 28px 0 100px}.contact-row{border-bottom:1px solid color-mix(in srgb,var(--a) 35%,transparent);padding:6px 0}.ico{border-radius:50%}.bottom-zone{margin:58px 24px 12px}.socials{background:color-mix(in srgb,var(--a) 12%,white);padding:11px 14px;border-radius:24px}.action-bar{border-radius:5px}
@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 */

