@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Montserrat:wght@300;400;500;600&display=swap');

:root{
  --black:#050505;
  --soft:#0d0d0d;
  --gold:#caa86a;
  --champagne:#f1deba;
  --cream:#f7f1e7;
  --muted:#bdb09d;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--black);
  color:var(--cream);
  font-family:Montserrat, sans-serif;
}
img{max-width:100%;display:block}
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:20;
  height:86px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 5%;
  background:rgba(5,5,5,.86);
  border-bottom:1px solid rgba(202,168,106,.22);
  backdrop-filter:blur(10px);
}
.logo-wrap img{width:74px;height:58px;object-fit:cover;object-position:center}
nav{display:flex;gap:30px}
nav a,.header-btn{
  color:var(--cream);
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:12px;
}
.header-btn{
  color:var(--black);
  background:linear-gradient(135deg,var(--champagne),var(--gold));
  padding:14px 22px;
  font-weight:600;
}
.hero{
  min-height:100vh;
  position:relative;
  display:flex;
  align-items:center;
  padding:140px 8% 80px;
  background:url('assets/inspo-4.jpeg') center/cover no-repeat;
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.95),rgba(0,0,0,.72),rgba(0,0,0,.32));
}
.hero-content{position:relative;max-width:680px}
.eyebrow{
  color:var(--gold);
  letter-spacing:3.5px;
  text-transform:uppercase;
  font-size:12px;
  font-weight:600;
}
h1,h2,h3{
  font-family:'Cormorant Garamond',serif;
  font-weight:600;
  margin:0;
}
h1{
  font-size:clamp(64px,10vw,132px);
  color:var(--champagne);
  line-height:.82;
  letter-spacing:2px;
  text-transform:uppercase;
}
h2{
  font-size:clamp(38px,5vw,68px);
  line-height:1;
  color:var(--champagne);
}
.subtitle{
  max-width:520px;
  font-size:18px;
  line-height:1.8;
  color:#e8ddca;
}
.hero-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:34px}
.btn{
  display:inline-block;
  padding:15px 30px;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:12px;
  border:1px solid var(--gold);
  cursor:pointer;
}
.gold{
  background:linear-gradient(135deg,var(--champagne),var(--gold));
  color:var(--black);
  font-weight:700;
}
.outline{color:var(--cream);background:rgba(0,0,0,.25)}
.section{padding:100px 8%}
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:58px;
  align-items:center;
}
.image-card{
  border:1px solid rgba(202,168,106,.35);
  padding:14px;
  background:#080808;
}
.image-card img{height:520px;width:100%;object-fit:cover}
.text-block p{
  color:#d5c9b7;
  line-height:1.9;
  font-size:16px;
}
.light{
  background:var(--cream);
  color:#17120b;
}
.center{text-align:center}
.dark-title{color:#17120b}
.service-grid{
  margin-top:48px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:26px;
}
.service-grid article{
  text-align:center;
}
.service-grid img{
  width:100%;
  height:210px;
  object-fit:cover;
  margin-bottom:22px;
}
.service-grid h3{
  font-size:24px;
  color:#17120b;
  text-transform:uppercase;
  letter-spacing:1px;
}
.service-grid p{
  color:#4c4438;
  line-height:1.7;
  font-size:14px;
}
.gallery-section{
  background:#050505;
}
.gallery-note{
  color:var(--muted);
  max-width:760px;
  margin:18px auto 42px;
  line-height:1.7;
}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}
.gallery-grid img{
  width:100%;
  height:240px;
  object-fit:cover;
  border:1px solid rgba(202,168,106,.24);
}
.inquiry-section{
  background:#f7f1e7;
  color:#17120b;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:56px;
}
.inquiry-section h2{color:#17120b}
.inquiry-intro p{
  line-height:1.8;
  color:#4c4438;
}
form label{
  display:block;
  text-transform:uppercase;
  letter-spacing:1.5px;
  font-size:11px;
  color:#4c4438;
  margin-bottom:18px;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
input,select,textarea{
  width:100%;
  margin-top:8px;
  border:1px solid #c9bda9;
  background:#fffaf2;
  padding:14px;
  font-family:Montserrat,sans-serif;
}
textarea{resize:vertical}
.submit{border:none;margin-top:6px}
.form-note{font-size:12px;color:#766c5d;line-height:1.6}
footer{
  text-align:center;
  padding:52px 8%;
  background:#050505;
  border-top:1px solid rgba(202,168,106,.22);
  color:var(--muted);
}
footer img{
  width:92px;
  height:72px;
  object-fit:cover;
  margin:0 auto 18px;
}
.small{font-size:12px;opacity:.75}

@media(max-width:900px){
  .site-header{position:static;height:auto;flex-direction:column;gap:14px}
  nav{gap:14px;flex-wrap:wrap;justify-content:center}
  .header-btn{display:none}
  .hero{padding-top:90px}
  .about-grid,.inquiry-section,.form-grid{grid-template-columns:1fr}
  .service-grid{grid-template-columns:1fr 1fr}
  .gallery-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .service-grid,.gallery-grid{grid-template-columns:1fr}
  .section{padding:70px 6%}
  .hero-actions{flex-direction:column}
}
