* {

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

}



html {

scroll-behavior:smooth;

}



body {

font-family:'Inter',sans-serif;

background:#fff;

color:#111;

overflow-x:hidden;

}



h1,
h2,
h3 {

font-family:'Playfair Display',serif;

}






/* NAV */


nav {

display:flex;

justify-content:space-between;

align-items:center;

padding:30px 8%;

}



.logo {

font-size:40px;

letter-spacing:8px;

color:#111;

text-decoration:none;

}



.menu a {

color:#111;

text-decoration:none;

margin-left:30px;

font-size:15px;

}



.menu a:hover {

color:#888;

}








/* HERO */


.hero {


height:90vh;


background:


linear-gradient(

90deg,

rgba(255,255,255,.95) 0%,

rgba(255,255,255,.65) 45%,

rgba(255,255,255,.15) 100%

),


url("https://images.unsplash.com/photo-1562322140-8baeececf3df")


center/cover;




display:flex;

align-items:center;

padding:50px 8%;


}




.hero-content {


max-width:750px;


background:rgba(255,255,255,.65);


padding:40px;


backdrop-filter:blur(5px);


}




.small {

letter-spacing:6px;

font-size:13px;

margin-bottom:20px;

}




.hero h1 {


font-size:80px;

line-height:1.1;


}




.hero p {


font-size:22px;

color:#333;

margin:30px 0;

line-height:1.6;


}







.button {


display:inline-block;

background:#111;

color:white;

padding:16px 45px;

border-radius:40px;

text-decoration:none;

transition:.3s;


}



.button:hover {


background:#777;


}








section {


padding:100px 8%;


}








/* ABOUT */


.about {


max-width:850px;

margin:auto;

text-align:center;


}



.about h2 {


font-size:55px;

margin:20px 0;


}



.about p:last-child {


font-size:20px;

line-height:1.8;

color:#666;


}








/* SERVICES */


.title {


text-align:center;

margin-bottom:60px;


}



.title h2 {


font-size:50px;


}



.services {


display:grid;

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

gap:30px;


}



.service {


border-top:2px solid #111;

padding-top:30px;


}



.service h3 {


font-size:30px;

margin-bottom:20px;


}



.service p {


color:#666;

line-height:1.7;


}








/* GALLERY */


.gallery {


display:grid;

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

gap:30px;


}



.gallery img {


width:100%;

height:450px;

object-fit:cover;


}



.gallery h3 {


margin-top:15px;

font-size:25px;


}








/* EXPERIENCE */


.experience {


background:#111;

color:white;

display:grid;

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

text-align:center;


}



.experience h2 {


font-size:70px;


}



.experience p {


color:#aaa;


}








/* QUOTE */


.quote {


text-align:center;


}



.quote h2 {


font-size:45px;

max-width:900px;

margin:auto;

font-style:italic;


}








/* CONTACT */


.contact {


background:#f3f3f3;

text-align:center;


}



.contact h2 {


font-size:45px;

margin-bottom:20px;


}



.contact p {


color:#666;

margin-bottom:30px;


}








/* FOOTER */


footer {


background:#111;

color:white;

text-align:center;

padding:30px;


}



footer a {


display:inline-block;

margin-top:15px;

color:#c6a15b;

text-decoration:none;


}








@media(max-width:800px){


nav {


flex-direction:column;

gap:20px;


}



.menu a {


margin:0 8px;


}



.hero {


padding:30px 5%;


}



.hero-content {


padding:25px;


}



.hero h1 {


font-size:45px;


}



.services,
.gallery,
.experience {


grid-template-columns:1fr;


}



.about h2 {


font-size:40px;


}



}