*{box-sizing:border-box;margin:0;padding:0}
:root{--dark:#171715;--cream:#f4efe5;--gold:#c9a96b;--muted:#aaa49a}
html{scroll-behavior:smooth}
body{font-family:"DM Sans",sans-serif;background:var(--cream);color:var(--dark);line-height:1.6}
a{text-decoration:none;color:inherit}
.header{height:78px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;background:#171715;color:#fff;position:sticky;top:0;z-index:20}
.logo{font-family:"Playfair Display",serif;font-size:25px;letter-spacing:.5px}.logo span{color:var(--gold)}
.nav{display:flex;gap:27px;align-items:center;font-size:14px}.nav a:hover{color:var(--gold)}
.nav-cta{border:1px solid var(--gold);padding:10px 17px!important;color:var(--gold)}
.menu-btn{display:none;background:none;border:0;color:white;font-size:28px}
.hero{min-height:calc(100vh - 78px);position:relative;background:linear-gradient(90deg,#000b,#0003),url("images/hero.jpg") center/cover;display:flex;align-items:center;color:#fff;padding:8%;overflow:hidden}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#000b,transparent)}
.hero-content{position:relative;max-width:720px}.eyebrow{text-transform:uppercase;letter-spacing:3px;color:var(--gold);font-size:12px;font-weight:600;margin-bottom:16px}
h1,h2{font-family:"Playfair Display",serif;font-weight:600;line-height:1.05}h1{font-size:clamp(50px,7vw,88px)}h2{font-size:clamp(42px,5vw,64px)}em{color:var(--gold);font-style:normal}
.hero-text{max-width:540px;color:#ddd;margin:25px 0 32px;font-size:17px}
.hero-buttons{display:flex;gap:14px;flex-wrap:wrap}.btn{display:inline-block;padding:14px 23px;border:1px solid var(--gold);font-size:13px;text-transform:uppercase;letter-spacing:1px;cursor:pointer}.btn-primary{background:var(--gold);color:#171715}.btn-outline{color:#fff}.btn-outline.dark{color:var(--dark)}
.scroll{position:absolute;right:6%;bottom:30px;font-size:10px;letter-spacing:3px;color:#ccc}
.section{padding:100px 8%}.about{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.about-image{min-height:520px}.image-placeholder,.gallery-item{background:linear-gradient(135deg,#c8bda9,#776d5e);display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;letter-spacing:3px;font-size:13px}.about-content p:not(.eyebrow){margin:18px 0;color:#625f58;max-width:560px}.text-link{color:#8e713d;font-weight:600}
.menu-section{background:#1b1b19;color:#fff}.section-heading{text-align:center;max-width:600px;margin:0 auto 50px}.section-heading>p:last-child{color:#aaa;margin-top:10px}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.menu-card{border:1px solid #393832;padding:42px;min-height:250px}.menu-card.featured{border-color:var(--gold)}.menu-card span{color:var(--gold);font-size:12px}.menu-card h3{font-family:"Playfair Display";font-size:30px;margin:28px 0 10px}.menu-card p{color:#aaa}.menu-card a{display:block;color:var(--gold);margin-top:25px;font-size:13px}
.highlights{background:#c9a96b;display:grid;grid-template-columns:repeat(4,1fr);text-align:center;padding:48px 6%;gap:20px}.highlights strong{font-size:25px}.highlights h3{font-family:"Playfair Display";font-size:21px}.highlights p{font-size:13px}
.gallery-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;grid-auto-rows:220px;gap:12px}.gallery-item.tall{grid-row:span 2}.gallery-item.wide{grid-column:2/4}
.reservation{background:#25231e;color:#fff;padding:90px 8%;display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.reservation>div>p:last-child{color:#aaa;max-width:500px;margin-top:20px}.booking-form{display:grid;gap:13px}.booking-form input,.booking-form select{width:100%;padding:15px;background:#fff;border:0;font:inherit}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.contact-list{margin-top:30px;color:#5f5b54}.contact-list p{margin:14px 0}.map-placeholder{min-height:360px;background:#ded7ca;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.map-placeholder>div{font-size:45px}.map-placeholder h3{font-family:"Playfair Display";font-size:28px}.map-placeholder p{margin:5px 0 20px;color:#6c685f}
footer{background:#11110f;color:#aaa;padding:35px 7%;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px}footer a:hover{color:var(--gold)}
@media(max-width:800px){.header{height:68px}.menu-btn{display:block}.nav{display:none;position:absolute;top:68px;left:0;right:0;background:#171715;padding:20px 7%;flex-direction:column;align-items:flex-start}.nav.open{display:flex}.hero{min-height:85vh;padding:12% 7%}.about,.reservation,.contact{grid-template-columns:1fr}.about-image{min-height:360px}.menu-grid,.highlights{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.gallery-item.tall{grid-row:span 2}.gallery-item.wide{grid-column:1/3}footer{flex-direction:column;text-align:center}}
.hero-info {
  display: flex;
  gap: 25px;
  flex-wrap: wrap;
  margin-bottom: 28px;
  color: #f4efe5;
  font-size: 14px;
}

.hero-info span {
  border-left: 2px solid #c9a96b;
  padding-left: 12px;
}
.about-image {
  min-height: 520px;
  overflow: hidden;
}

.about-image img {
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
  display: block;
}
/* Gallery Photos */
.gallery-item {
  height: 300px;
  overflow: hidden;
  border-radius: 8px;
  position: relative;
  background: #222;
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

/* Hover Effect */
.gallery-item:hover img {
  transform: scale(1.06);
}
/* Gallery Lightbox */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 30px;
}

.lightbox img {
  max-width: 90%;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 8px;
}

.lightbox-close {
  position: absolute;
  top: 20px;
  right: 30px;
  color: white;
  font-size: 40px;
  cursor: pointer;
  line-height: 1;
}
.hero-info a {
  color: #f4efe5;
  text-decoration: none;
}

.hero-info a:hover {
  color: #c9a96b;
}
/* Olive background for non-image sections */
.about,
.highlights,
.reservation,
.contact,
footer {
  background: #4b5320;
  color: white;
}

/* White text */
.about h2,
.about p,
.highlights h2,
.highlights h3,
.highlights p,
.reservation h2,
.reservation p,
.contact h2,
.contact p,
footer {
  color: white;
}

/* Keep form fields readable */
.booking-form input,
.booking-form select {
  background: white;
  color: #333;
}
.hero h1,
.hero h2,
.hero p {
  color: white !important;
}
.hero p,
.hero-content p {
  color: #ffffff !important;
  opacity: 1 !important;
}
.contact-card {
  background: white !important;
  color: black !important;
}

.contact-card h3,
.contact-card p,
.contact-card span,
.contact-card a {
  color: black !important;
.contact-card {
  background: white !important;
  color: black !important;
}

.contact-card h3,
.contact-card p,
.contact-card span,
.contact-card a {
  color: black !important;
}
}
.map-placeholder {
  background: white !important;
  color: black !important;
}

.map-placeholder h3,
.map-placeholder p {
  color: black !important;
}

.map-placeholder .btn {
  color: black !important;
}
.social-link {
  color: black;
  text-decoration: none;
  font-weight: bold;
}

.social-link:hover {
  color: #4b5320;
}
.social-link {
  display: inline-block;
  margin-top: 15px;
  padding: 12px 22px;
  background: white;
  color: black !important;
  text-decoration: none;
  border-radius: 6px;
  font-weight: bold;
  border: 1px solid #ddd;
  transition: 0.3s;
}

.social-link:hover {
  background: #f2f2f2;
  color: black !important;
}
footer {
  background: #3f4a32;
  color: white;
  padding: 55px 20px 25px;
  text-align: center;
}

.footer-content {
  max-width: 900px;
  margin: 0 auto;
}

footer .logo {
  font-size: 32px;
  font-weight: bold;
  letter-spacing: 1px;
}

footer .logo span {
  font-weight: normal;
}

.footer-tagline {
  margin: 12px 0 25px;
  font-size: 15px;
  color: #e8e8e8;
}

.footer-info {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  margin-bottom: 25px;
  font-size: 14px;
}

.footer-info a {
  color: white;
  text-decoration: none;
}

.footer-facebook {
  display: inline-block;
  padding: 11px 20px;
  background: white;
  color: black !important;
  text-decoration: none;
  border-radius: 6px;
  font-weight: bold;
  margin-bottom: 35px;
  transition: 0.3s;
}

.footer-facebook:hover {
  background: #eeeeee;
  transform: translateY(-2px);
}

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.25);
  padding-top: 20px;
  font-size: 13px;
  color: #dddddd;
}
.hero h2,
.hero h2 em,
.hero p {
  color: #ffffff !important;
  opacity: 1 !important;
}