@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap');

:root{
  --black:#11100f; --cream:#f5f1e9; --gold:#c9a96a; --white:#fff;
  --gray:#77736d; --line:#ddd7cd;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"DM Sans",Arial,sans-serif;background:var(--cream);color:var(--black);line-height:1.6}
a{text-decoration:none;color:inherit}
.navbar{height:82px;padding:0 6%;background:var(--black);color:white;display:flex;align-items:center;gap:35px;position:sticky;top:0;z-index:20}
.logo{font-size:20px;font-weight:700;letter-spacing:2px;margin-right:auto}
.logo span{color:var(--gold);font-weight:500;margin-left:5px}
nav{display:flex;gap:28px;font-size:14px}
nav a:hover,.footer-links a:hover{color:var(--gold)}
.nav-button{border:1px solid var(--gold);color:var(--gold);padding:10px 17px;font-size:13px}
.hero{min-height:calc(100vh - 82px);position:relative;background:url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2200&q=85") center/cover;display:flex;align-items:center;padding:8%}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.28))}
.hero-content{position:relative;color:white;max-width:760px}
.eyebrow{font-size:11px;letter-spacing:3px;font-weight:700;color:var(--gold);margin-bottom:14px}
h1,h2{font-family:"Playfair Display",serif;font-weight:500;line-height:1.05}
h1{font-size:clamp(50px,7vw,88px);margin-bottom:25px}
h2{font-size:clamp(40px,5vw,64px)}
em{color:var(--gold);font-style:italic}
.hero-text{font-size:18px;color:#eee;max-width:620px;margin-bottom:32px}
.hero-buttons{display:flex;gap:12px;flex-wrap:wrap}
.button{display:inline-block;padding:14px 23px;border:1px solid transparent;font:600 13px "DM Sans";cursor:pointer}
.gold{background:var(--gold);color:#17130d}
.outline{border-color:#fff;color:#fff}
.outline:hover{background:white;color:#111}
.scroll-note{position:absolute;right:6%;bottom:35px;color:#ddd;font-size:10px;letter-spacing:2px}
.intro{padding:90px 8%;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end;background:white}
.intro>p{max-width:520px;color:var(--gray);font-size:18px}
.section{padding:100px 8%}
.section-title{max-width:650px;margin-bottom:50px}
.section-title>p:last-child{color:var(--gray);margin-top:12px}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.service-card{background:white;border:1px solid var(--line);padding:35px;min-height:220px;transition:.2s}
.service-card:hover{transform:translateY(-4px);border-color:var(--gold)}
.service-card span{color:var(--gold);font-size:12px}
.service-card h3{font-size:21px;margin:35px 0 10px}
.service-card p{color:var(--gray);font-size:14px}
.events{background:var(--black);color:white;padding:100px 8%}
.light>p:last-child{color:#aaa}
.event-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #444}
.event-grid div{padding:25px 5px;border-bottom:1px solid #444;font:22px "Playfair Display";display:flex;justify-content:space-between}
.event-grid small{font:10px "DM Sans";color:var(--gold)}
.booking{padding:100px 8%;display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;background:#eee9df}
.booking-copy>p:last-child{color:var(--gray);max-width:390px;margin-top:20px}
form{max-width:760px}
label{display:block;font-size:12px;font-weight:700;margin-bottom:18px}
input,select{display:block;width:100%;border:1px solid #cfc8bc;background:#fff;padding:14px;margin-top:7px;font:14px "DM Sans";outline:none}
input:focus,select:focus{border-color:var(--gold)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
form .button{margin-top:8px}
#formMessage{margin-top:14px;font-size:13px;font-weight:600}
footer{background:#090909;color:white;padding:45px 8%;display:flex;align-items:center;gap:30px}
footer p{color:#888;font-size:13px;margin-top:5px}
.footer-links{display:flex;gap:22px;margin-left:auto;font-size:13px}
.admin-link{font-size:11px;color:#777}
.admin{min-height:calc(100vh - 82px);padding:80px 8%}
.admin-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.delete-button{border:0;background:#9b3f3f;color:white;padding:10px 16px;cursor:pointer}
.request{background:white;border:1px solid var(--line);padding:25px;margin-bottom:12px}
.request h3{font:22px "Playfair Display";margin-bottom:12px}
.request p{font-size:14px;margin:4px 0}
.request small{color:#888}
.empty{background:white;padding:40px;text-align:center;color:#888}

@media(max-width:850px){
  .navbar{height:auto;padding:18px 5%;flex-wrap:wrap}
  .logo{margin-right:auto}
  nav{order:3;width:100%;justify-content:center;gap:16px;flex-wrap:wrap}
  .nav-button{display:none}
  .hero{min-height:80vh;padding:10% 7%}
  .intro,.booking{grid-template-columns:1fr;gap:40px}
  .service-grid,.event-grid{grid-template-columns:1fr 1fr}
  .scroll-note{display:none}
}
@media(max-width:560px){
  h1{font-size:48px}
  .section,.events,.booking,.intro{padding:65px 6%}
  .service-grid,.event-grid,.two-col{grid-template-columns:1fr}
  footer{flex-wrap:wrap}
  .footer-links{margin-left:0;width:100%;order:3}
}
/* Floating button container styling */
.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease-in-out;
}

/* Subtle pop effect on hover */
.whatsapp-float:hover {
    transform: scale(1.1);
}