/* =========================
   ECAR PRO PREMIUM FINAL
   DISEÑO SUNARP MTC MULTAS LUNAS
========================= */

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

body{
background:#f4f7fb;
min-height:100vh;
color:#101828;
}


/* CONTENEDORES */

.contenedor,
.panel{

width:90%;
max-width:1250px;
margin:35px auto;
background:white;
padding:35px;
border-radius:14px;

box-shadow:
0 8px 25px rgba(0,0,0,.08);

}


/* CABECERA */

.cabecera{

display:flex;
justify-content:center;
align-items:center;
gap:35px;
margin-bottom:25px;

}


.logo{

width:130px;

}


.whatsapp{

width:65px;
height:65px;

animation:pulso 1.3s infinite;

}


.whatsapp img{

width:100%;
height:100%;

}


@keyframes pulso{

0%{transform:scale(1);}
50%{transform:scale(1.15);}
100%{transform:scale(1);}

}




/* TITULOS */

h1,h2{

text-align:center;
letter-spacing:4px;
margin-bottom:25px;

}


h3{

font-size:20px;
margin:25px 0 15px;

}



/* FORMULARIOS */


input,
textarea{

width:100%;
height:55px;

padding:15px;

border:1px solid #d0d7e2;
border-radius:8px;

font-size:15px;

margin-bottom:14px;

}


textarea{

height:90px;
resize:none;

}



button{

background:#0057d9;

color:white;

height:55px;

padding:0 45px;

border:none;

border-radius:8px;

font-weight:bold;

font-size:16px;

cursor:pointer;

box-shadow:
0 5px 15px rgba(0,0,0,.25);

}


button:hover{

background:#003c9c;

}





/* RESULTADOS */

.panelConsulta{

margin-top:40px;

}


.gridResultado{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:25px;

}




/* TARJETAS GENERALES */

.tarjeta{

background:white;

border-radius:12px;

padding-bottom:20px;

overflow:hidden;

min-height:260px;

box-shadow:
0 5px 18px rgba(0,0,0,.08);

}


.tarjeta h3{

padding:18px 25px;

margin:0 0 20px;

font-size:18px;

border-bottom:2px solid currentColor;

}


.tarjeta p{

font-size:16px;

margin:12px 25px;

font-weight:600;

}


.tarjeta img{

width:260px;

max-height:170px;

object-fit:contain;

display:block;

float:right;

margin:-120px 25px 15px 20px;

border-radius:8px;

}




/* =====================
   COLORES OFICIALES
===================== */


/* SUNARP */

.azul{

border:2px solid #0066ff;

}


.azul h3{

color:#0066ff;

}



/* MTC */

.verde{

border:2px solid #009846;

}


.verde h3{

color:#009846;

}




/* MULTAS SAT */

.rojo{

border:2px solid #e00025;

}


.rojo h3{

color:#e00025;

}




/* LUNAS POLARIZADAS VERDE OSCURO */

.morado{

border:2px solid #0b4f35;

}


.morado h3{

color:#0b4f35;

}





/* =========================
   TABLA LUNAS POLARIZADAS
========================= */


.tablaLunas{

margin-top:30px;

background:white;

border-radius:12px;

padding:25px;

box-shadow:
0 5px 18px rgba(0,0,0,.08);

}


.tablaLunas h3{

color:#0b4f35;

border-bottom:3px solid #0b4f35;

padding-bottom:12px;

}



table{

width:100%;

border-collapse:collapse;

}


th{

background:#0b4f35;

color:white;

padding:15px;

font-size:14px;

}


td{

padding:15px;

border:1px solid #ddd;

text-align:center;

}



.propietario{

margin-top:20px;

padding:18px;

background:#eef8f3;

border-radius:8px;

text-align:center;

font-size:18px;

font-weight:bold;

color:#0b4f35;

}




/* MENSAJE NO REGISTRADO */

.mensajeConsulta{

padding:30px;

text-align:center;

font-size:18px;

line-height:30px;

}



/* CELULAR */

@media(max-width:850px){


.contenedor,
.panel{

width:95%;

padding:18px;

}


.gridResultado{

grid-template-columns:1fr;

}


.tarjeta img{

float:none;

width:85%;

margin:20px auto;

}


.logo{

width:110px;

}


.whatsapp{

width:55px;

height:55px;

}


.tablaLunas{

overflow-x:auto;

}


.tablaLunas table{

min-width:700px;

}


}