*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial, Helvetica, sans-serif;
}

body{
background:white;
color:#1a1a1a;
}


/* LAYOUT PRINCIPAL */

.container{

min-height:100vh;

display:grid;

grid-template-columns:1fr 420px;

gap:80px;

align-items:center;

max-width:1200px;

margin:auto;

padding:40px;

}


/* LADO IZQUIERDO */

.left h1{

font-size:24px;

line-height:1.2;

font-weight:800;

margin-bottom:18px;

color:#0b1b3f;

}


.left p{

font-size:17px;

line-height:1.6;

color:#555;

max-width:520px;

}


/* TEXTO ACCESO */

.eyebrow{

display:inline-block;

margin-bottom:14px;

font-size:13px;

letter-spacing:2px;

color:#c7a54a;

font-weight:700;

}


/* LOGO SIN RECUADRO */

.brand{

margin-bottom:25px;

}

.brand img{

height:120px;   /* antes 60px */
width:auto;

display:block;

}


/* TARJETA LOGIN */

.card{

background:white;

border-radius:16px;

padding:40px;

box-shadow:0 10px 30px rgba(0,0,0,.12);

border:1px solid #eee;

}


.card h2{

font-size:16px;

margin-bottom:6px;

color:#0b1b3f;

}


.sub{

font-size:14px;

color:#777;

margin-bottom:20px;

}


/* CAMPOS */

.field{

margin-bottom:18px;

}

.field label{

display:block;

margin-bottom:6px;

font-size:14px;

color:#444;

}


.field input{

width:100%;

padding:14px;

border-radius:10px;

border:1px solid #ddd;

font-size:15px;

}


/* BOTON */

.btn{

width:100%;

padding:14px;

border:none;

border-radius:10px;

background:#c7a54a;

font-weight:700;

font-size:16px;

cursor:pointer;

transition:.2s;

}


.btn:hover{

background:#d6b760;

}


/* ALERTA ERROR */

.alert{

background:#8b1d2c;

color:white;

padding:12px;

border-radius:8px;

margin-bottom:15px;

}


/* TEXTO AYUDA */

.help{

margin-top:14px;

font-size:13px;

color:#777;

}


/* FOOTER */

.footer{

text-align:center;

padding:20px;

font-size:13px;

color:#777;

}


/* RESPONSIVE */

@media(max-width:900px){

.container{

grid-template-columns:1fr;

text-align:center;

}

.left p{

margin:auto;

}

.brand{

margin:auto;

}

}