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

:root{
  --ink:#1D2622;
  --ink-soft:#5B6660;
  --cream:#FBF8F2;
  --cream2:#F1EAD9;
  --teal:#0F4C4A;
  --teal-deep:#0A3230;
  --gold:#C7A15A;
  --gold-soft:#E8DCC0;
  --line:#E4DCC8;
  --white:#FFFFFF;
  --font-serif:'Cormorant Garamond', Georgia, serif;
  --font-sans:'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--cream); color:var(--ink); font-family:var(--font-sans); font-weight:400; -webkit-font-smoothing:antialiased;}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}
h1,h2,h3{font-family:var(--font-serif); font-weight:500; margin:0; letter-spacing:0.005em;}
p{margin:0; line-height:1.75; color:var(--ink-soft); font-weight:300;}
.wrap{max-width:1240px; margin:0 auto; padding-left:64px; padding-right:64px;}
.eyebrow{font-size:11.5px; font-weight:600; letter-spacing:0.32em; text-transform:uppercase; color:var(--gold);}
.italic-accent{font-family:var(--font-serif); font-style:italic; color:var(--gold); font-size:19px;}

/* Buttons */
.btn{display:inline-flex; align-items:center; gap:10px; padding:15px 34px; font-family:var(--font-sans); font-weight:500; font-size:12.5px; letter-spacing:0.14em; text-transform:uppercase; border:1px solid var(--ink); white-space:nowrap; transition:background .25s ease, color .25s ease, border-color .25s ease;}
.btn-dark{background:var(--ink); color:var(--cream); border-color:var(--ink);}
.btn-dark:hover{background:transparent; color:var(--ink);}
.btn-line{background:transparent; color:var(--ink); border-color:var(--ink);}
.btn-line:hover{background:var(--ink); color:var(--cream);}
.btn-white{background:transparent; color:#fff; border-color:rgba(255,255,255,0.65);}
.btn-white:hover{background:#fff; color:var(--ink);}

/* Header */
header.site{position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:26px 64px; transition:background .35s ease, padding .35s ease, box-shadow .35s ease;}
header.site.solid{background:rgba(251,248,242,0.96); backdrop-filter:blur(10px); padding:16px 64px; box-shadow:0 1px 0 var(--line);}
.brand{font-family:var(--font-serif); font-size:22px; letter-spacing:0.03em; color:#fff; display:flex; flex-direction:column; line-height:1.05; transition:color .35s ease;}
.brand small{font-family:var(--font-sans); font-size:9.5px; letter-spacing:0.28em; color:var(--gold); font-weight:500; margin-top:3px;}
header.site.solid .brand{color:var(--ink);}
nav.main{display:flex; align-items:center; gap:38px;}
nav.main a.navlink{font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:#fff; font-weight:500; transition:color .35s ease;}
header.site.solid nav.main a.navlink{color:var(--ink);}
nav.main a.navlink:hover{color:var(--gold) !important;}
.navlink.active{color:var(--gold) !important;}
#navToggle{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}

/* Hero */
.hero{position:relative; height:100vh; min-height:640px; overflow:hidden; display:flex; align-items:flex-end;}
.hero .bg{position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.08); animation:kenburns 22s ease-in-out infinite alternate;}
.hero .scrim{position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,20,18,0.35) 0%, rgba(10,20,18,0.15) 40%, rgba(8,16,14,0.75) 100%);}
@keyframes kenburns{0%{transform:scale(1.08) translate(0,0);}100%{transform:scale(1.16) translate(-1%,-1%);}}
.hero-content{position:relative; padding:0 64px 96px; width:100%; color:#fff;}
.hero-eyebrow{font-size:12px; letter-spacing:0.4em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:22px;}
.hero h1{font-size:clamp(40px,6vw,76px); line-height:1.06; max-width:920px; color:#fff; font-weight:500;}
.hero p.sub{color:#E9E4D6; max-width:520px; margin-top:22px; font-size:16.5px;}
.hero-actions{display:flex; gap:16px; margin-top:36px; flex-wrap:wrap;}
.scrolldown{position:absolute; right:64px; bottom:40px; display:flex; flex-direction:column; align-items:center; gap:10px; color:#fff; opacity:0.8;}
.scrolldown .line{width:1px; height:46px; background:rgba(255,255,255,0.5); position:relative; overflow:hidden;}
.scrolldown .line::after{content:""; position:absolute; top:-100%; left:0; width:100%; height:100%; background:#fff; animation:scrolldown 2.2s ease-in-out infinite;}
@keyframes scrolldown{0%{top:-100%;}50%{top:0;}100%{top:100%;}}

/* Reveal on scroll */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .9s ease, transform .9s ease;}
.reveal.in{opacity:1; transform:translateY(0);}

/* Sections */
section{position:relative;}
.section-pad{padding:120px 0;}
.center{text-align:center;}
.lead{max-width:640px; margin:0 auto;}

/* Split feature blocks */
.split{display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:stretch;}
.split .img-col{position:relative; overflow:hidden; min-height:520px;}
.split .img-col img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0; transition:transform 1.2s ease;}
.split:hover .img-col img{transform:scale(1.05);}
.split .text-col{display:flex; flex-direction:column; justify-content:center; padding:80px;}
.split.reverse{direction:rtl;}
.split.reverse > *{direction:ltr;}

/* Stats */
.stats{display:flex; justify-content:space-between; gap:32px; padding:64px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.stat{text-align:center; flex:1;}
.stat .num{font-family:var(--font-serif); font-size:44px; color:var(--teal);}
.stat .lbl{font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft); margin-top:8px;}

/* Room cards */
.rooms-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line);}
.room-card{border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--white);}
.room-card .photo{position:relative; aspect-ratio:4/3; overflow:hidden;}
.room-card .photo img{width:100%; height:100%; object-fit:cover; transition:transform .8s ease;}
.room-card:hover .photo img{transform:scale(1.06);}
.room-card .body{padding:32px;}
.room-tag{position:absolute; top:16px; left:16px; background:rgba(251,248,242,0.94); color:var(--ink); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; padding:7px 14px;}

/* Gallery */
.masonry{columns:4 220px; column-gap:14px;}
.masonry .item{break-inside:avoid; margin-bottom:14px; position:relative; overflow:hidden;}
.masonry .item img{width:100%; display:block; transition:transform .8s ease;}
.masonry .item:hover img{transform:scale(1.05);}
.masonry .cap{position:absolute; left:0; right:0; bottom:0; padding:14px; background:linear-gradient(to top, rgba(10,20,18,0.75), transparent 70%); color:#fff; font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; opacity:0; transition:opacity .3s ease;}
.masonry .item:hover .cap{opacity:1;}

/* Testimonial */
.quote-card{background:var(--white); border:1px solid var(--line); padding:40px; text-align:center;}
.quote-mark{font-family:var(--font-serif); font-size:52px; color:var(--gold); line-height:1;}

/* Footer */
footer.site{background:var(--teal-deep); color:#CFE0DC;}
footer.site a:hover{color:var(--gold);}
footer.site .foot-grid{display:flex; justify-content:space-between; gap:48px; padding:80px 0 40px; flex-wrap:wrap;}
footer.site .foot-col h4{font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:#7FA69E; margin-bottom:18px; font-family:var(--font-sans); font-weight:600;}
footer.site .foot-links{display:flex; flex-direction:column; gap:11px; font-size:13.5px;}
footer.site .bottom{border-top:1px solid rgba(255,255,255,0.08); padding:22px 0; text-align:center; font-size:12px; color:#6F958E;}

/* Utility band */
.band-teal{background:var(--teal); color:#fff;}
.band-cream2{background:var(--cream2);}

/* Chips */
.chip{font-size:11.5px; padding:6px 13px; border:1px solid var(--line); color:var(--ink-soft); border-radius:2px; display:inline-flex; align-items:center; gap:6px;}

/* Responsive */
@media (max-width:980px){
  .wrap{padding-left:26px; padding-right:26px;}
  header.site{padding:20px 26px;}
  header.site.solid{padding:14px 26px;}
  nav.main{position:fixed; top:0; right:0; height:100vh; height:100dvh; width:78%; max-width:340px; background:var(--cream); flex-direction:column; align-items:flex-start; justify-content:center; gap:26px; padding:0 40px; transform:translateX(100%); transition:transform .4s ease; box-shadow:-10px 0 40px rgba(0,0,0,0.15); z-index:110; overflow-y:auto;}
  nav.main a.navlink, header.site.solid nav.main a.navlink{color:var(--ink) !important;}
  #navToggle:checked ~ header nav.main{transform:translateX(0);}
  .nav-toggle-btn{display:flex !important;}
  .hero h1{font-size:38px;}
  .split, .rooms-grid{grid-template-columns:1fr !important;}
  .split.reverse{direction:ltr;}
  .split .text-col{padding:48px 26px;}
  .stats{flex-wrap:wrap;}
  .stat{flex:1 1 40%;}
  .masonry{columns:2 160px;}
  .foot-grid{flex-direction:column;}
}
.nav-toggle-btn{display:none; width:26px; height:20px; flex-direction:column; justify-content:space-between; cursor:pointer; position:relative; z-index:120; flex:none;}
.nav-toggle-btn span{transition:transform .3s ease, opacity .2s ease;}
#navToggle:focus-visible ~ header .nav-toggle-btn{outline:2px solid var(--gold); outline-offset:6px;}
.nav-toggle-btn span{display:block; height:1.5px; background:#fff; width:100%;}
header.site.solid .nav-toggle-btn span{background:var(--ink);}
#navToggle:checked ~ header .nav-toggle-btn span{background:var(--ink);}
.nav-scrim{display:none;}
@media (max-width:980px){
  #navToggle:checked ~ .nav-scrim{display:block; position:fixed; inset:0; background:rgba(0,0,0,0.35); z-index:99;}
}


/* ---------- Enquiry form ---------- */
.sr-only{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}
.form-note{font-size:13px; color:var(--ink-soft); margin-top:2px;}
.field-error{display:none; font-size:12.5px; color:#A3322B; margin-top:6px;}
.is-invalid .field-error{display:block;}
.is-invalid input, .is-invalid textarea{border-color:#A3322B !important;}
.form-status{display:none; padding:16px 18px; font-size:14.5px; line-height:1.6; margin-bottom:22px; border-left:3px solid;}
.form-status.show{display:block;}
.form-status.success{background:#E7F0E9; border-left-color:var(--teal); color:#14433F;}
.form-status.error{background:#F7E9E7; border-left-color:#A3322B; color:#6E221C;}
.form-status a{color:inherit; font-weight:600;}
button[disabled]{opacity:0.6; cursor:not-allowed;}
.map-frame{width:100%; aspect-ratio:16/9; border:1px solid var(--line); display:block;}
@media (prefers-reduced-motion:reduce){
  nav.main{transition:none;}
  .reveal{transition:none;}
}
