/*==================================================
Large Desktop
==================================================*/

@media (max-width:1400px){

.container{
    max-width:1140px;
}

.rentometer-title h1{
    font-size:52px;
}

.compare-card{
    padding:35px;
}

}

/*==================================================
Laptop
==================================================*/

@media (max-width:1200px){

.container{
    max-width:960px;
}

.hero{
    min-height:420px;
}

.logo{
    width:240px;
}

.rentometer-title h1{
    font-size:46px;
}

.rentometer-title p{
    font-size:20px;
}

.form-card h2{
    font-size:30px;
}

.info-card h3{
    font-size:28px;
}

.compare-card{
    padding:30px;
}

.compare-card h3{
    font-size:24px;
}

.compare-card h4{
    font-size:30px;
}

.compare-card h5{
    font-size:22px;
}

.compare-card h5 span{
    font-size:34px;
}

}

/*==================================================
Tablet Landscape
==================================================*/

@media (max-width:991px){

.hero{

    padding-bottom:180px;

}

.form-wrapper{

    grid-template-columns:1fr;

}

.info-card{

    margin-top:30px;

}

.comparison-wrapper{

    grid-template-columns:1fr;

}

.vs-circle{

    margin:25px auto;

}

.cta-wrapper{

    flex-direction:column;

    text-align:center;

}

.cta-buttons{

    justify-content:center;

}

}

/*==================================================
Tablet
==================================================*/

@media (max-width:768px){

.hero{

    min-height:360px;

    padding-top:30px;

}

.logo{

    width:180px;

    margin:auto;

}

.hero-content{

    justify-content:center;

    text-align:center;

}

.left-content{

    width:100%;

}

.rentometer-title{

    flex-direction:column;

}

.meter-icon{

    width:75px;

    height:75px;

    font-size:35px;

}

.rentometer-title h1{

    font-size:38px;

}

.rentometer-title p{

    font-size:18px;

}

.form-section{

    margin-top:-100px;

}

.form-card{

    padding:25px;

}

.row{

    grid-template-columns:1fr;

    gap:0;

}

.form-card h2{

    font-size:28px;

    text-align:center;

}

.input-box{

    height:58px;

}

.input-box span{

    width:55px;

}

.calculate-btn{

    height:60px;

    font-size:18px;

}

.info-card{

    padding:30px;

}

.info-card img{

    width:75px;

}

.info-card h3{

    font-size:24px;

}

.info-card p{

    font-size:18px;

}

.comparison{

    padding:60px 0;

}

.comparison h2{

    font-size:30px;

    line-height:1.4;

}

.compare-card{

    min-height:auto;

}

.compare-card h3{

    font-size:24px;

}

.compare-card h4{

    font-size:28px;

}

.compare-card h5{

    font-size:22px;

}

.compare-card h5 span{

    font-size:34px;

}

.icon-circle{

    width:90px;

    height:90px;

}

.icon-circle img{

    width:50px;

}

.cta-wrapper{

    padding:30px;

}

.cta-text h3{

    font-size:26px;

}

.cta-btn{

    width:100%;

    justify-content:center;

}

}

/*==================================================
Mobile
==================================================*/

@media (max-width:576px){

.container{

    padding:0 20px;

}

.hero{

    min-height:330px;

}

.logo{

    width:150px;

}

.rentometer-title h1{

    font-size:32px;

}

.rentometer-title p{

    font-size:16px;

}

.form-card{

    padding:20px;

    border-radius:16px;

}

.form-card h2{

    font-size:24px;

}

.form-group label{

    font-size:14px;

}

.input-box{

    height:54px;

}

.input-box input{

    font-size:15px;

}

.input-box select{

    font-size:15px;

}

.input-box span{

    width:50px;

    font-size:18px;

}

.calculate-btn{

    height:56px;

    font-size:16px;

}

.info-card{

    border-radius:16px;

    padding:25px 20px;

}

.info-card h3{

    font-size:21px;

}

.info-card p{

    font-size:16px;

}

.comparison h2{

    font-size:24px;

}

.compare-card{

    padding:25px;

    border-radius:16px;

}

.compare-card h3{

    font-size:22px;

}

.compare-card h4{

    font-size:24px;

}

.compare-card h5{

    font-size:20px;

}

.compare-card h5 span{

    font-size:28px;

}

.compare-card ul li{

    font-size:15px;

}

.vs-circle{

    width:70px;

    height:70px;

    font-size:22px;

}

.cta-wrapper{

    padding:25px 20px;

    border-radius:16px;

}

.cta-text h3{

    font-size:22px;

}

.cta-text p{

    font-size:15px;

}

.cta-btn{

    height:55px;

    font-size:14px;

    padding:0 20px;

}

footer{

    padding-bottom:25px;

}

}

/*==================================================
Small Mobile
==================================================*/

@media (max-width:400px){

.rentometer-title h1{

    font-size:28px;

}

.rentometer-title p{

    font-size:15px;

}

.form-card{

    padding:18px;

}

.info-card{

    padding:20px 15px;

}

.compare-card{

    padding:20px;

}

.cta-text h3{

    font-size:20px;

}

.cta-btn{

    font-size:13px;

}

}