:root{

--navy:#061826;
--navy2:#0b2638;
--gold:#d6b15e;
--gold-light:#f0d58a;
--cream:#faf6ef;
--white:#ffffff;
--text:#18252d;
--gray:#777;

}


*{

margin:0;
padding:0;
box-sizing:border-box;

}


html{

scroll-behavior:smooth;

}


body{

font-family:'Poppins',sans-serif;
background:var(--cream);
color:var(--text);
overflow-x:hidden;

}


img{

width:100%;
display:block;

}


a{

text-decoration:none;
color:inherit;

}


.container{

width:min(1200px,90%);
margin:auto;

}


.section{

padding:110px 0;

}


.soft-bg{

background:#f3eee5;

}





/* NAVBAR */


.navbar{

position:fixed;
top:0;
left:0;
width:100%;
padding:25px 0;
z-index:999;

background:rgba(6,24,38,.65);

backdrop-filter:blur(15px);

}



.nav-container{

width:min(1200px,90%);
margin:auto;

display:flex;
align-items:center;
justify-content:space-between;

}



.logo{

display:flex;
flex-direction:column;

font-family:'Cormorant Garamond',serif;

}



.logo span{

font-size:42px;
letter-spacing:8px;
color:var(--gold-light);

}



.logo small{

font-family:'Poppins';
font-size:10px;
letter-spacing:5px;
color:white;

}



nav{

display:flex;
gap:35px;

}



nav a{

color:white;
font-size:14px;
transition:.3s;

}



nav a:hover{

color:var(--gold-light);

}





.btn{

display:inline-block;

padding:15px 35px;

border-radius:50px;

background:
linear-gradient(
135deg,
var(--gold),
var(--gold-light)
);

color:#111;

font-weight:600;

transition:.4s;

}



.btn:hover{

transform:translateY(-5px);

box-shadow:
0 15px 40px rgba(214,177,94,.3);

}





/* HERO */


.hero{

height:100vh;

position:relative;

display:flex;

align-items:center;

justify-content:center;

text-align:center;

overflow:hidden;

color:white;

}



#three-area{

position:absolute;
inset:0;
z-index:1;

}



.hero-image{

position:absolute;
inset:0;

background:

linear-gradient(
rgba(6,24,38,.55),
rgba(6,24,38,.75)
),

url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=1600");

background-size:cover;
background-position:center;

}



.hero-content{

position:relative;
z-index:2;

max-width:850px;

}



.etiket{

font-size:12px;
letter-spacing:5px;

color:var(--gold);

margin-bottom:25px;

}



.hero h1{

font-family:'Cormorant Garamond',serif;

font-size:120px;

line-height:.85;

}



.hero h1 span{

color:var(--gold-light);

font-style:italic;

}



.hero p{

font-size:18px;

line-height:1.8;

margin:35px auto;

max-width:650px;

}


/* BAŞLIK */

.baslik{

text-align:center;
margin-bottom:60px;

}


.baslik h2{

font-family:'Cormorant Garamond',serif;

font-size:65px;

color:var(--navy);

}





/* OTEL HAKKINDA */


.iki{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}



.resim{

border-radius:35px;

overflow:hidden;

box-shadow:
0 30px 70px rgba(0,0,0,.15);

}



.resim img{

height:600px;

object-fit:cover;

}



.istatistik{

display:flex;

gap:20px;

margin-top:40px;

}



.istatistik div{

background:white;

padding:25px;

border-radius:20px;

box-shadow:
0 15px 30px rgba(0,0,0,.08);

}



.istatistik strong{

display:block;

font-family:'Cormorant Garamond';

font-size:45px;

color:#b18a38;

}



.istatistik span{

font-size:13px;

}




/* ODALAR */


.kartlar{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}



.kart{

background:white;

border-radius:30px;

overflow:hidden;

transition:.4s;

box-shadow:
0 15px 40px rgba(0,0,0,.08);

}



.kart:hover{

transform:translateY(-12px);

}



.kart img{

height:280px;

object-fit:cover;

}



.kart h3{

font-family:'Cormorant Garamond';

font-size:38px;

padding:25px 30px 10px;

}



.kart p{

padding:0 30px;

color:var(--gray);

line-height:1.7;

}



.kart strong{

display:block;

padding:25px 30px;

color:#b18a38;

}





/* DENEYİMLER */


.deneyimler{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}



.deneyimler div{

background:white;

padding:35px;

border-radius:25px;

border:1px solid #eee;

transition:.3s;

}



.deneyimler div:hover{

background:var(--navy);

color:white;

}



.deneyimler h3{

font-family:'Cormorant Garamond';

font-size:30px;

margin-bottom:15px;

}





/* GALERİ */


.galeri{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}



.galeri img{

height:350px;

object-fit:cover;

border-radius:25px;

transition:.5s;

}



.galeri img:hover{

transform:scale(1.05);

}





/* REZERVASYON */


.rezervasyon-box{

background:white;

border-radius:40px;

padding:60px;

display:grid;

grid-template-columns:1fr 1fr;

gap:60px;

box-shadow:
0 30px 80px rgba(0,0,0,.1);

}



.rezervasyon-box h2{

font-family:'Cormorant Garamond';

font-size:60px;

}



form{

display:flex;

flex-direction:column;

gap:15px;

}



input,
select,
textarea{

padding:18px;

border-radius:15px;

border:1px solid #ddd;

font-family:inherit;

}



textarea{

height:130px;

resize:none;

}





/* FOOTER */


footer{

background:var(--navy);

color:white;

text-align:center;

padding:60px 20px;

}



footer h3{

font-family:'Cormorant Garamond';

font-size:45px;

color:var(--gold-light);

}







/* MOBİL */


@media(max-width:900px){


nav{

display:none;

}


.hero h1{

font-size:70px;

}



.iki,
.rezervasyon-box{

grid-template-columns:1fr;

}



.kartlar{

grid-template-columns:1fr;

}



.deneyimler{

grid-template-columns:1fr;

}



.galeri{

grid-template-columns:1fr 1fr;

}


.istatistik{

flex-direction:column;

}



}




@media(max-width:500px){


.hero h1{

font-size:55px;

}



.baslik h2{

font-size:45px;

}



.galeri{

grid-template-columns:1fr;

}



.rezervasyon-box{

padding:30px;

}



}