.card{
width:380px;
background:white;
border-radius:0px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,0.08);
margin:0 auto;
display:flex;
flex-direction:column;
}

.brand{
padding:15px;
}

.logo{
height:20px;
}

.cover-section{
display:flex;
justify-content:center;
padding:0 15px;
}

.profile{
text-align:center;
margin-top:-45px;
}

.name{
font-size:20px;
margin-top:10px;
font-weight:600;
}

.verified{
width:16px;
vertical-align:middle;
position:relative;
top:-2px;
}

.category{
font-size:14px;
color:#555;
padding:0 20px;
}

.contact{
display:flex;
justify-content:center;
align-items:flex-start;
gap:25px;
padding:20px;
}

.contact-group{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
}

.contact-box{
display:flex;
gap:10px;
background:#E6E6E6;
padding:10px 12px;
border-radius:16px;
margin-left:-4px;
}

.contact-btn img{
width:42px;
height:42px;
border-radius:10px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

.contact-box a:hover img{
transform:scale(1.08);
transition:0.2s;
}

.contact-group a:hover img{
transform:scale(1.08);
transition:0.2s;
}

.big-btn img{
width:50px;
height:50px;
border-radius:13px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

.telefono-icon{
transform:scale(1.3);
margin-top:3px;
}

.sms-icon{
margin-top:4px;
margin-left:10px;
}

.mail-icon{
margin-top:4px;
margin-left:2px;
}

.icon1-btn{
margin-left:-6px;
}

.icon2-btn{
margin-left:-10px;
}

.label{
font-size:13px;
margin-top:6px;
color:#333;
font-weight:500;
}

.label1{
font-size:13px;
margin-top:6px;
margin-left:-9px;
color:#333;
font-weight:500;
}

.label2{
font-size:13px;
margin-top:6px;
margin-left:-10px;
color:#333;
font-weight:500;
}

.lower{
margin-top:14px;
}

.apps{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:flex-start;
gap:25px;
padding:25px 20px;
text-align:center;
}

.apps a{
width:90px;
height:120px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
text-decoration:none;
color:black;
font-size:13px;
font-weight:500;
-webkit-tap-highlight-color: transparent;
}

/* Animación de entrada de apps */

.apps a{
opacity:0;
transform:translateY(20px);
}

/* SOLO cuando se active */
.apps.show a{
animation:appsFade 1.5s ease forwards;
}

/* retraso progresivo */

.apps a:nth-child(1){animation-delay:0.05s;}
.apps a:nth-child(2){animation-delay:0.1s;}
.apps a:nth-child(3){animation-delay:0.15s;}
.apps a:nth-child(4){animation-delay:0.2s;}
.apps a:nth-child(5){animation-delay:0.25s;}
.apps a:nth-child(6){animation-delay:0.3s;}
.apps a:nth-child(7){animation-delay:0.35s;}
.apps a:nth-child(8){animation-delay:0.4s;}
.apps a:nth-child(9){animation-delay:0.45s;}
.apps a:nth-child(10){animation-delay:0.5s;}

@keyframes appsFade{
to{
opacity:1;
transform:translateY(0);
}
}

.apps img{
width:90px;
height:90px;
border-radius:20px;
margin-bottom:0px;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
}

.apps span{
text-align:center;
line-height:1.2;
margin-top:6px;
}

.apps-down{
margin-top:8px;
}

.apps a{
cursor:pointer;
}

.apps a:hover img{
transform:scale(1.08);
transition:0.2s;
}

/* QR MODAL */

.qr-modal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.7);
display:none;
justify-content:center;
align-items:center;
backdrop-filter: blur(8px);
z-index: 2000;
}

.qr-content img{
width:220px;
border-radius:12px;
background:white;
padding:10px;
}

.qr-content{
position:relative;
}

.qr-close{
position:absolute;
top:10px;
right:12px;
font-size:24px;
font-weight:bold;
color:#ffffff;
cursor:pointer;
}

.qr-close:hover{
opacity:0.6;
}

.qr-title{
text-align:center;
font-size:16px;
font-weight:600;
margin-bottom:10px;
color:#ffffff;
}

.down{
margin-top:8px;
}