/*
 # ########*###########################
 Autor: José Luis Rodriguez
 Mail: jrodriguez@bincodex.com
 Web: https://bincodex.com
 Fecha: 2026-07-15 17:50:46
 Archivo: dsp-nr.css
 Codificación: UTF-8
 Editado en: Kate 25.04.3
 ####################################
 */



/*=========================
        TARJETA
==========================*/
.device-card{
    width:min(700px,90%);
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(18px);
    border-radius:30px;
    padding:70px 55px 45px;
    text-align:center;
    position:relative;
    box-shadow: 0 25px 60px rgba(0,0,0,.15);
}

/*=========================
        LOGO
==========================*/

.logo-circle{
    width:250px;
    height:250px;
    background:white;
    border-radius:50%;
    position:absolute;
    left:50%;
    top:-164px;
    transform:translateX(-50%);
    display:flex;
    justify-content:center;
    align-items:center;
    box-shadow: 0 10px 35px rgba(0,0,0,.12);
}

.logo-circle img{
    width:177px;
}

.logo-circle-client {
	width:350px;
    height:176px;
    background:white;
    border-radius:44px;
    position:absolute;
    left:50%;
    top:520px;
    transform:translateX(-50%);
    display:flex;
    justify-content:center;
    align-items:center;
    box-shadow: 0 10px 35px rgba(0,0,0,.12);
}

/*=========================
        TITULOS
==========================*/

h1{
    margin-top:20px;
    font-size:30px;
    color:#1e3768;
    font-weight:700;
}

.subtitle{
    margin-top:18px;
    color:#555;
    font-size:24px;
}

/*=========================
        INPUT
==========================*/

.input-group{
    margin-top:40px;
    height:72px;
    border-radius:20px;
    background:#fff;
    display:flex;
    align-items:center;
    overflow:hidden;
    border:2px solid transparent;
    background-image:
    linear-gradient(#fff,#fff),
    linear-gradient(90deg,#3D73FF,#29C76F);
    background-origin:border-box;
    background-clip:padding-box,border-box;
    box-shadow: 0 8px 30px rgba(0,0,0,.08);
}

.icon{
    width:75px;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#4A78F0;
    font-size:28px;
}

.input-group input{
    flex:1;
    border:none;
    outline:none;
    font-size:35px;
    color:#444;
    padding-right:25px;
    text-align: center;
}

.input-group input::placeholder{
    color:#9da7b5;
}

/*=========================
        BOTON
==========================*/

.btn-register{
    margin-top:35px;
    border:none;
    border-radius:50px;
    padding:18px 50px;
    font-size:19px;
    font-weight:600;
    color:white;
    cursor:pointer;
    background: linear-gradient(90deg,#2F6EEA,#2BC675);
    box-shadow: 0 10px 25px rgba(44,111,234,.35);
    transition:.30s;
}

.btn-register:hover{
    transform:translateY(-3px);
    box-shadow: 0 16px 35px rgba(44,111,234,.45);
}

.btn-register i{
    margin-right:10px;
}

/*=========================
        RESPONSIVE
==========================*/

@media(max-width:700px){
    .device-card{
        padding:65px 25px 35px;
    }

    h1{
        font-size:30px;
    }

    .subtitle{
        font-size:18px;
    }

    .input-group{
        height:62px;
    }

    .input-group input{
        font-size:18px;
    }
}




.card{
	width:871px;
	background:rgba(255,255,255,.90);
	backdrop-filter:blur(18px);
	border-radius:35px;
	padding:88px 54px 37px;
	position:relative;
	text-align:center;
	box-shadow:0 20px 60px rgba(0,0,0,.15);
	margin-top: 109px;
}

.logo-principal{
	position:absolute;
	left:50%;
	top:-90px;
	transform:translateX(-50%);
	width:180px;
	height:180px;
	background:white;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 15px 40px rgba(0,0,0,.15);
}

.logo-principal img{
	width:120px;
}

h1{
	font-size:28px;
	color:#1d3b72;
	font-weight:700;
}

h1 span{
	display:block;
}

.linea{
	width:120px;
	height:4px;
	margin:18px auto;
	background:linear-gradient(90deg,#1e7cff,#34d77a);
	border-radius:10px;
	display: none;
}

.descripcion{
	font-size:15px;
	line-height:30px;
	color:#667085;
	margin-bottom:13px;
}

.campo{
	display:flex;
	align-items:center;
	height:72px;
	border-radius:20px;
	background:white;
	padding:0 25px;
	border:2px solid transparent;
	background-image:
	linear-gradient(#fff,#fff),
	linear-gradient(90deg,#2d6cff,#28d476);
	background-origin:border-box;
	background-clip:padding-box,border-box;
	box-shadow:0 8px 30px rgba(0,0,0,.08);
}

.campo i{
	font-size:28px;
	color:#2d6cff;
	margin-right:18px;
}

.campo input{
	border:none;
	outline:none;
	width:100%;
	font-size:30px;
	color:#607086;
}

button{
	margin-top:35px;
	padding:18px 55px;
	border:none;
	border-radius:50px;
	background:linear-gradient(90deg,#2e6ef4,#2ecc71);
	color:white;
	font-size:22px;
	font-weight:600;
	cursor:pointer;
	box-shadow:0 10px 25px rgba(0,0,0,.18);
	transition:.25s;
}

button:hover{
	transform:translateY(-4px);
}

.seguridad{
	margin-top:30px;
	font-size:15px;
	color:#7d8792;
}

.seguridad i{
	margin-right:8px;
}

hr{
	margin:10px 0;
	border:none;
	height:1px;
	background:#e3e7ee;
}

.cliente{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:15px;
}

.cliente small{
	font-size:20px;
	color:#607086;
}

.cliente img{
	/*! max-width:280px; */
	max-height:108px;
	object-fit:contain;
	border: 1px solid #d2d2d2;
}
