*{box-sizing:border-box}
:root{
--primary:#247ca5;
--dark:#102b43;
--light:#f3faff;
--white:#fff;
--radius:28px;
}
body{
margin:0;
font-family:Inter,sans-serif;
color:var(--dark);
background:linear-gradient(#fff,#eef8fc);
}
.container{width:min(1180px,92%);margin:auto}
.navbar{
position:sticky;top:0;z-index:10;
background:rgba(255,255,255,.75);
backdrop-filter:blur(18px);
}
.nav-inner{
height:78px;display:flex;align-items:center;justify-content:space-between
}
.logo{font-size:22px;letter-spacing:5px}
.logo span{display:block;font-size:10px;letter-spacing:3px}
nav{display:flex;gap:28px}
nav a{text-decoration:none;color:#486276}
.btn{
display:inline-flex;
padding:15px 30px;
border-radius:999px;
background:var(--primary);
color:white;
text-decoration:none;
transition:.3s;
}
.btn:hover{transform:translateY(-3px)}
.hero{
display:grid;
grid-template-columns:1fr 1fr;
min-height:650px;
align-items:center;
gap:30px
}
.eyebrow{letter-spacing:3px;font-size:12px;color:var(--primary)}
h1,h2{font-family:"Playfair Display",serif}
h1{font-size:72px;line-height:.95;margin:20px 0}
.hero-copy p:not(.eyebrow){font-size:18px;max-width:420px}
.hero-image img,.about img{
width:100%;height:520px;object-fit:cover;border-radius:var(--radius)
}
.features{display:flex;gap:20px;margin-top:35px}
.features div{
background:white;padding:15px;border-radius:18px;
display:flex;gap:10px;align-items:center;font-size:13px
}
.glass{
background:rgba(255,255,255,.75);
backdrop-filter:blur(20px);
border-radius:var(--radius);
padding:35px;
box-shadow:0 20px 50px #b8d2df40
}
.booking{margin-top:-50px;position:relative}
.booking-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
input,select{
padding:18px;border-radius:16px;border:1px solid #d5e4ec;background:white
}
.section{padding:90px 0}
.section-title{display:flex;justify-content:space-between}
.cards{
display:grid;grid-template-columns:repeat(5,1fr);gap:20px
}
.card{
background:white;padding:28px;border-radius:24px;
text-align:center;transition:.3s
}
.card:hover{transform:translateY(-8px)}
.icon{font-size:35px}
.card a{text-decoration:none;color:var(--primary)}
.about{
display:grid;grid-template-columns:1fr 1fr;gap:25px
}
.about-text h2{font-size:45px}
li{margin:15px 0}
.trust{
display:grid;grid-template-columns:repeat(4,1fr);
text-align:center;margin:70px auto
}
.trust strong{display:block;font-size:40px}
.cta{
padding:80px 0;
background:#e5f5fc;
text-align:center
}
footer{padding:30px 0}
.footer{display:flex;justify-content:space-between}

@media(max-width:900px){
nav{display:none}
.hero,.about{grid-template-columns:1fr}
h1{font-size:48px}
.cards{grid-template-columns:1fr 1fr}
.booking-grid,.trust{grid-template-columns:1fr}
.hero-image img,.about img{height:350px}
.footer{flex-direction:column}
}
