/* ==============================
   Buy Domain & Hosting Page
============================== */


/* Hero Section */

.hosting-hero {
    padding: 100px 0;
    background: linear-gradient(135deg, #0d6efd, #001f54);
    color: #fff;
}


.hosting-hero h1 {
    font-size: 52px;
    font-weight: 800;
    line-height: 1.2;
}


.hosting-hero h1 span {
    color: #ffc107;
}


.hosting-hero p {
    font-size: 18px;
    margin: 25px 0;
    max-width: 600px;
    color: rgba(255,255,255,0.85);
}


.hosting-hero .btn {
    padding: 14px 35px;
    border-radius: 50px;
    font-weight: 600;
}





/* Domain Search Card */

.hosting-card {

    background: #fff;
    color: #333;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);

}


.hosting-card h4 {

    font-size: 24px;
    margin-bottom: 25px;
    font-weight: 700;

}


.hosting-card input {

    height: 55px;
    border-radius: 10px 0 0 10px;

}


.hosting-card button {

    border-radius: 0 10px 10px 0;
    padding: 0 25px;

}





/* Domain Section */

.domain-section {

    padding: 80px 0;
    background: #f8f9fa;

}


.domain-section h2,
.plans-section h2 {

    font-size: 36px;
    font-weight: 800;

}



.domain-box {

    background: #fff;
    padding: 35px 20px;
    text-align: center;
    border-radius: 15px;
    transition: .3s;
    box-shadow: 0 5px 20px rgba(0,0,0,.08);

}


.domain-box:hover {

    transform: translateY(-10px);

}


.domain-box h3 {

    font-size: 40px;
    font-weight: 800;
    color: #0d6efd;

}


.domain-box p {

    color:#666;

}







/* Hosting Plans */

.plans-section {

    padding: 90px 0;

}



.plan-card {

    background:#fff;
    padding:40px 30px;
    border-radius:20px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    position:relative;
    transition:.3s;

}


.plan-card:hover {

    transform:translateY(-10px);

}



.plan-card h3 {

    font-size:28px;
    font-weight:700;

}



.plan-card h2 {

    color:#0d6efd;
    margin:20px 0;

}



.plan-card ul {

    padding:0;
    list-style:none;
    margin:25px 0;

}



.plan-card ul li {

    padding:10px 0;
    border-bottom:1px solid #eee;
    color:#555;

}



.plan-card .btn {

    border-radius:50px;
    padding:12px 35px;

}



.plan-card.popular {

    border:3px solid #0d6efd;

}



.plan-card .badge {

    position:absolute;
    top:-15px;
    left:50%;
    transform:translateX(-50%);
    background:#0d6efd;
    color:#fff;
    padding:8px 25px;
    border-radius:50px;

}







/* Features */

.features-section {

    background:#001f54;
    color:white;
    padding:70px 0;

}



.features-section h4 {

    font-size:25px;
    font-weight:700;
    margin-bottom:15px;

}



.features-section p {

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

}





/* Responsive */

@media(max-width:991px){


    .hosting-hero {

        text-align:center;

    }


    .hosting-hero h1 {

        font-size:38px;

    }


    .hosting-card {

        margin-top:40px;

    }


}



@media(max-width:576px){


    .hosting-hero h1 {

        font-size:32px;

    }


    .domain-section h2,
    .plans-section h2 {

        font-size:28px;

    }


}