*{
box-sizing:border-box;
}


body{

margin:0;

font-family:Arial, sans-serif;

background:#f5f5f5;

color:#333;

}


/* HEADER */

header{

background:#222;

color:white;

text-align:center;

padding:25px 15px;

}


header h1{

margin:0;

font-size:36px;

}


header p{

font-size:18px;

}



nav{

margin-top:20px;

}


nav a{

color:white;

text-decoration:none;

margin:8px;

font-size:16px;

display:inline-block;

}


nav a:hover{

color:#ffc107;

}





/* LIMITED TIME OFFER */


.offer-banner{

background:#ff9800;

color:white;

text-align:center;

padding:20px;

}


.offer-banner h2{

margin:0;

font-size:30px;

}


.offer-banner p{

font-size:20px;

font-weight:bold;

margin:10px;

}


.offer-banner a{

display:inline-block;

background:white;

color:#ff5722;

padding:12px 25px;

border-radius:5px;

text-decoration:none;

font-weight:bold;

}


.offer-banner a:hover{

background:#eee;

}







/* HERO SECTION */


.hero{

position:relative;

}


.hero img{

width:100%;

height:500px;

object-fit:cover;

}



.hero-text{

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

background:rgba(255,255,255,0.92);

padding:35px;

border-radius:15px;

text-align:center;

width:85%;

max-width:550px;

}


.hero-text h2{

font-size:32px;

margin-bottom:15px;

}


.hero-text p{

font-size:18px;

}




.button{

display:inline-block;

background:#007bff;

color:white;

padding:12px 25px;

border-radius:6px;

text-decoration:none;

margin-top:15px;

font-weight:bold;

}


.button:hover{

background:#0056b3;

}







/* SECTIONS */


.section{

padding:45px 20px;

text-align:center;

}


.section h2{

font-size:32px;

margin-bottom:30px;

}







/* CARDS */


.card{

display:inline-block;

vertical-align:top;

background:white;

width:290px;

margin:15px;

padding:20px;

border-radius:12px;

box-shadow:0 3px 12px rgba(0,0,0,0.15);

}



.card img{

width:100%;

height:210px;

object-fit:cover;

border-radius:10px;

}



.card h3{

font-size:22px;

margin:15px 0;

}



.card p{

font-size:16px;

line-height:1.5;

}



/* ROOM PRICE */


.card h3:nth-of-type(2){

color:green;

font-size:24px;

}







/* CONTACT */


#contact a{

color:#007bff;

font-size:22px;

font-weight:bold;

text-decoration:none;

}







/* FOOTER */


footer{

background:#222;

color:white;

text-align:center;

padding:25px;

}







/* MOBILE DESIGN */


@media(max-width:600px){


header h1{

font-size:26px;

}


nav a{

font-size:14px;

margin:5px;

}



.offer-banner h2{

font-size:24px;

}


.offer-banner p{

font-size:17px;

}



.hero img{

height:350px;

}



.hero-text{

width:90%;

padding:20px;

}



.hero-text h2{

font-size:24px;

}



.hero-text p{

font-size:15px;

}



.section h2{

font-size:26px;

}



.card{

width:90%;

margin:12px auto;

}



.card img{

height:200px;

}


}