
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;500;700&display=swap');

*{margin:0;padding:0;box-sizing:border-box;}

body{
font-family:'Inter',sans-serif;
background:#1a1a1a;
color:#e5e5e5;
}

.hero{
height:100vh;
position:relative;
display:flex;
justify-content:center;
align-items:center;
overflow:hidden;
}

.bg-grid{
position:absolute;
inset:0;
background-image:
linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
background-size:60px 60px;
opacity:.3;
}

.hero-content{
position:relative;
text-align:center;
}

#heroLogo{
font-size:6rem;
letter-spacing:8px;
transition:transform .3s, opacity .3s;
}

.tagline{
margin-top:10px;
font-size:.9rem;
letter-spacing:4px;
opacity:.7;
text-transform:uppercase;
}

.arrow{
margin-top:30px;
font-size:2rem;
opacity:.5;
animation:bounce 1.5s infinite;
}

header{
position:fixed;
top:0;
left:0;
width:100%;
padding:20px;
opacity:0;
transition:opacity .3s;
background:linear-gradient(#1a1a1a, rgba(26,26,26,0));
}

#logoSmall{
font-size:1.2rem;
letter-spacing:4px;
}

.booking{
max-width:600px;
margin:auto;
padding:100px 20px;
}

h2{
text-align:center;
margin-bottom:40px;
font-weight:500;
}

form{
display:flex;
flex-direction:column;
gap:15px;
}

input,textarea,select{
background:#262626;
border:1px solid #333;
color:#e5e5e5;
padding:12px;
}

button{
background:#e5e5e5;
color:#1a1a1a;
border:none;
padding:14px;
cursor:pointer;
}

button:hover{
background:#cfcfcf;
}

#budgetDesc{
font-size:.85rem;
opacity:.7;
}

#thankYou{
display:none;
text-align:center;
padding:60px 20px;
border:1px solid #333;
margin-top:40px;
}

footer{
text-align:center;
padding:60px 20px;
border-top:1px solid #333;
}

footer a{
color:#e5e5e5;
text-decoration:none;
}

@keyframes bounce{
0%,100%{transform:translateY(0);}
50%{transform:translateY(10px);}
}
