@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;1,400&display=swap');

:root{
  --cream:#f3efe2;
  --black:#1a1a1a;
  --white:#ffffff;
  --muted:#6b6558;
  --maxw:1760px;
  --gutter:16px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'EB Garamond', serif;
  color:var(--black);
  background:var(--white);
  font-size:18px;
  line-height:1.6;
}
h1,h2,h3,.logo{
  font-family:'EB Garamond', serif;
  font-weight:400;
  letter-spacing:0.01em;
  margin:0;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);}

/* ---------- NAV ---------- */
.site-nav{
  position:sticky;
  top:0;
  z-index:100;
  width:100%;
  background:var(--white);
}
.nav-inner{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  max-width:var(--maxw);
  margin:0 auto;
  padding:28px var(--gutter);
  flex-wrap:wrap;
  gap:40px;
}
.logo{font-size:2.1rem;margin-right:auto;}
.logo a{display:block;}
.nav-links{
  display:flex;
  align-items:center;
  gap:30px;
  flex-wrap:wrap;
  font-size:1.2rem;
}
.nav-links a{
  padding-bottom:4px;
  border-bottom:1px solid transparent;
}
.nav-links a.active{border-bottom-color:var(--black);}
.nav-links a:hover{border-bottom-color:var(--black);}
.nav-right{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.nav-social{
  display:flex;
  gap:14px;
}
.nav-social a{display:flex;}
.nav-social svg{width:18px;height:18px;}
.btn-book{
  background:var(--black);
  color:var(--white);
  padding:12px 26px;
  font-family:'EB Garamond', serif;
  font-size:0.95rem;
  letter-spacing:0.04em;
  border:none;
  cursor:pointer;
  display:inline-block;
}
.btn-book:hover{opacity:0.85;}

/* ---------- HERO (home) ---------- */
.hero-wrap{
  max-width:var(--maxw);
  margin:0 auto;
  padding:0 var(--gutter);
}
.hero{
  position:relative;
  width:100%;
  overflow:hidden;
}
.hero img{
  width:100%;
  display:block;
}
.hero-book-link{
  position:absolute;
  left:50%;
  top:85.5%;
  transform:translate(-50%,-50%);
  width:18.5%;
  height:13%;
  display:block;
}

.intro-text{
  max-width:820px;
  margin:90px auto;
  text-align:center;
  font-size:1.8rem;
  padding:0 30px;
}

/* ---------- TWO COLUMN CARDS ---------- */
.two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  padding:0 var(--gutter);
  max-width:var(--maxw);
  margin:0 auto;
}
.two-col figure{margin:0;}
.two-col img{width:100%;height:380px;object-fit:cover;}
.card-body{
  text-align:center;
  margin-top:30px;
}
.card-body h2{font-size:2.3rem;margin-bottom:20px;}
.card-body p{color:var(--black);max-width:460px;margin:0 auto 18px;font-size:1.15rem;}
.card-body .learn-more{
  text-decoration:underline;
  font-size:1rem;
}

.full-bleed{
  width:100%;
  margin:80px auto;
}
.full-bleed img{width:100%;height:auto;max-height:480px;object-fit:cover;}

/* ---------- FOOTER ---------- */
.site-footer{
  background:var(--white);
  border-top:1px solid #e7e2d3;
  padding:60px 40px 40px;
  margin-top:60px;
}
.footer-inner{
  max-width:1300px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:40px;
}
.footer-brand h3{font-size:2.1rem;margin-bottom:18px;}
.footer-credit{
  margin-top:14px;
  font-size:0.95rem;
  color:var(--muted);
}
.footer-social{display:flex;gap:16px;}
.footer-social svg{width:18px;height:18px;}
.footer-contact{
  display:flex;
  gap:60px;
  flex-wrap:wrap;
}
.footer-contact div{font-size:1rem;line-height:1.7;}

/* ---------- PAGE HEADER (cream sections) ---------- */
.page-section{
  background:var(--cream);
  padding:60px 40px 80px;
}
.page-title{
  text-align:center;
  font-size:2.8rem;
  margin-bottom:60px;
}

/* ---------- ROOMS GRID ---------- */
.rooms-grid{
  max-width:1080px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px 240px;
}
.room-card{text-align:center;}
.room-card h3{font-size:2.1rem;margin-bottom:20px;}
.room-card img{
  width:100%;
  height:300px;
  object-fit:cover;
  border-radius:14px;
}
.room-card .price{margin-top:18px;font-size:1.1rem;}

/* ---------- GALLERY ---------- */
.gallery-grid{
  max-width:var(--maxw);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px;
}
.gallery-grid img{
  width:100%;
  height:auto;
}

/* ---------- VISIT ---------- */
.visit-info{
  text-align:center;
  max-width:600px;
  margin:0 auto 60px;
}
.visit-info p{margin:4px 0;}
.visit-info h4{
  font-size:1.1rem;
  margin-top:40px;
  margin-bottom:8px;
  font-family:'EB Garamond',serif;
  font-weight:600;
}
.map-frame{
  max-width:var(--maxw);
  margin:0 auto;
  border:0;
}
.map-frame iframe{
  width:100%;
  height:420px;
  border:0;
  display:block;
  filter:grayscale(15%);
}

/* ---------- CONTACT ---------- */
.contact-form{
  max-width:700px;
  margin:0 auto;
}
.contact-intro{
  text-align:center;
  max-width:600px;
  margin:0 auto 50px;
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.field{margin-bottom:28px;}
.field label{
  display:block;
  margin-bottom:8px;
  font-size:1.05rem;
}
.field label .req{color:var(--muted);font-size:0.85rem;}
.field input,
.field textarea{
  width:100%;
  border:1px solid #d8d2c0;
  background:#fafaf5;
  padding:14px;
  font-family:'EB Garamond', serif;
  font-size:1rem;
}
.field textarea{min-height:160px;resize:vertical;}
.submit-btn{
  background:var(--black);
  color:var(--white);
  border:none;
  padding:14px 34px;
  font-family:'EB Garamond', serif;
  font-size:1rem;
  cursor:pointer;
}
.submit-btn:hover{opacity:0.85;}
.form-status{
  margin-top:18px;
  font-size:0.95rem;
  color:var(--muted);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 860px){
  :root{--gutter:24px;}
  .two-col, .rooms-grid, .gallery-grid, .form-row{
    grid-template-columns:1fr;
  }
  .nav-inner{padding:18px 24px;}
  .nav-links{gap:18px;font-size:0.95rem;}
  .wrap, .page-section, .footer-inner{padding-left:24px;padding-right:24px;}
  .hero-book-link{width:40%;height:7%;}
  .page-title{font-size:2.1rem;}
}