*{
box-sizing:border-box;
font-family:tahoma,Arial,sans-serif;
}



body{

margin:0;

background:#f7f7f7;

padding:30px;

}



.calculator{

max-width:700px;

margin:auto;

background:white;

border-radius:18px;

padding:30px;

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

border-top:5px solid #A40B0B;

}





h1{

text-align:center;

color:#A40B0B;

font-size:26px;

margin-bottom:10px;

}




.desc{

text-align:center;

color:#555;

margin-bottom:25px;

}






.form-box{

display:flex;

flex-direction:column;

gap:12px;

}




label{

font-weight:bold;

color:#333;

margin-top:8px;

}





input,
select{


width:100%;

padding:14px;

border-radius:10px;

border:1px solid #ddd;

font-size:15px;

background:#fff;

}



input:focus,
select:focus{

outline:none;

border-color:#A40B0B;

}





button{


margin-top:25px;

background:#A40B0B;

color:white;

border:none;

padding:15px;

border-radius:12px;

font-size:17px;

cursor:pointer;

transition:.3s;


}




button:hover{

background:#7d0808;

}






.result{


margin-top:25px;

background:#fafafa;

border-right:5px solid #A40B0B;

padding:20px;

border-radius:12px;

line-height:2;

font-size:16px;

color:#333;

}





#productBox{

display:block;

}






@media(max-width:600px){


body{

padding:15px;

}


.calculator{

padding:20px;

}



h1{

font-size:21px;

}


.result{

font-size:14px;

}


}