/*======================================
=          COTIZACIÓN
======================================*/

.cotizacion{
    background:var(--color-primario);
    color:#FFF;
}

.cotizacion__contenido{
	background-color:#000099;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.cotizacion__info h2{

    font-size:2.6rem;

    margin:20px 0;

}

.cotizacion__info p{

    margin-bottom:35px;

    color:rgba(255,255,255,.85);

}

.cotizacion__lista{

    list-style:none;

    padding:0;

    margin:0;

}

.cotizacion__lista li{

    margin-bottom:18px;

    font-size:1.05rem;

}

.cotizacion__formulario{

    background:#FFF;

    padding:40px;

    border-radius:20px;

    box-shadow:var(--sombra-suave);

}

.cotizacion__formulario form{

    display:flex;

    flex-direction:column;

    gap:20px;

}

.cotizacion__formulario input,
.cotizacion__formulario textarea{

    width:100%;

    padding:16px 20px;

    border:1px solid #DDD;

    border-radius:12px;

    font-size:1rem;

    font-family:inherit;

    outline:none;

    transition:.3s;

}

.cotizacion__formulario input:focus,
.cotizacion__formulario textarea:focus{

    border-color:var(--color-secundario);

}

.cotizacion__formulario textarea{

    resize:vertical;

    min-height:160px;

}






/*======================================
=      RESPONSIVE COTIZACIÓN
======================================*/

/*======================================
TABLETS
======================================*/

@media (max-width:1024px){

    .cotizacion__contenido{

        gap:45px;

    }

    .cotizacion__info h2{

        font-size:2.2rem;

    }

    .cotizacion__formulario{

        padding:30px;

    }

}


/*======================================
CELULARES
======================================*/

@media (max-width:768px){

    .cotizacion__contenido{

        grid-template-columns:1fr;
        gap:50px;

    }

    .cotizacion__info{

        text-align:center;

    }

    .cotizacion__lista{

        display:inline-block;
        text-align:left;

    }

    .cotizacion__info h2{

        font-size:2rem;

    }

    .cotizacion__formulario{

        padding:25px;

    }

}


/*======================================
CELULARES PEQUEÑOS
======================================*/

@media (max-width:480px){

    .cotizacion__info h2{

        font-size:1.7rem;

        line-height:1.3;

    }

    .cotizacion__formulario{

        padding:20px;

        border-radius:15px;

    }

    .cotizacion__formulario input,
    .cotizacion__formulario textarea{

        padding:14px 16px;

        font-size:.95rem;

    }

    .cotizacion__lista li{

        font-size:.95rem;

    }

}