:root {
  --green:  #50A060;
  --gd:     #3a7a48;
  --gl:     #d4ead9;
  --gll:    #eef7f0;
  --white:  #ffffff;
  --cream:  #f7f9f6;
  --dark:   #1e2b21;
  --muted:  #607065;
  --border: rgba(80,160,96,0.14);
  --r:      3px;
  --t:      0.32s cubic-bezier(.4,0,.2,1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Source Sans Pro', sans-serif; font-weight: 300; color: var(--dark); background: var(--white); overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ── NAV ── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 5vw; height: 76px;
  background: rgba(255,255,255,0.97); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  transition: box-shadow var(--t);
}
nav.scrolled { box-shadow: 0 2px 18px rgba(0,0,0,0.07); }
.nav-logo img { height: 56px; width: auto; }
.nav-links { display: flex; gap: 2rem; align-items: center; }
.nav-links a { font-size: 0.76rem; letter-spacing: 0.13em; text-transform: uppercase; color: var(--muted); transition: color var(--t); font-weight: 400; }
.nav-links a:hover { color: var(--green); }
.nav-cta { background: var(--green) !important; color: var(--white) !important; padding: 0.48rem 1.2rem; border-radius: var(--r); font-size: 0.74rem !important; }
.nav-cta:hover { background: var(--gd) !important; }
.hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; padding: 5px; }
.hamburger span { display: block; width: 22px; height: 1.5px; background: var(--green); transition: var(--t); }
.drawer { display: none; position: fixed; top: 76px; left: 0; right: 0; z-index: 199; background: var(--white); border-bottom: 1px solid var(--border); padding: 1.5rem 8vw 2rem; flex-direction: column; gap: 1.3rem; }
.drawer.open { display: flex; }
.drawer a { font-size: 0.88rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); font-weight: 400; }
.drawer .nav-cta { text-align: center; padding: 0.7rem; }

/* ── HERO ── */
.hero { min-height: 100vh; display: flex; flex-direction: column; justify-content: flex-end; position: relative; overflow: hidden; padding-top: 76px; }
.hero-bg { position: absolute; inset: 0; background: linear-gradient(135deg,#2a5535 0%,#50A060 60%,#3c7548 100%); }
.hero-pattern { position: absolute; inset: 0; opacity: 0.055; background-image: url("data:image/svg+xml,%3Csvg width='80' height='40' viewBox='0 0 80 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 20 Q20 5 40 20 Q60 35 80 20' stroke='white' stroke-width='1' fill='none'/%3E%3C/svg%3E"); background-size: 80px 40px; }
.hero-wind { position: absolute; inset: 0; overflow: hidden; }
.wstreak { position: absolute; height: 1px; border-radius: 1px; background: linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent); animation: ws linear infinite; }
@keyframes ws { from{transform:translateX(-100%);opacity:0} 15%{opacity:1} 85%{opacity:1} to{transform:translateX(200%);opacity:0} }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top,rgba(12,30,16,0.74) 0%,rgba(12,30,16,0.12) 55%,transparent 100%); }
.hero-content { position: relative; z-index: 2; padding: 0 8vw 9vh; max-width: 720px; }
.eyebrow { font-size: 0.66rem; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(255,255,255,0.58); margin-bottom: 1.1rem; display: flex; align-items: center; gap: 0.75rem; }
.eyebrow::before { content:''; display:block; width:34px; height:1px; background:rgba(255,255,255,0.32); }
.hero-h1 { font-family:'Source Sans Pro',sans-serif; font-weight:200; font-size:clamp(3rem,8vw,6.2rem); color:var(--white); letter-spacing:0.16em; text-transform:uppercase; line-height:0.98; margin-bottom:1.15rem; }
.hero-tagline { font-size:clamp(0.88rem,1.6vw,1rem); color:rgba(255,255,255,0.68); letter-spacing:0.1em; font-style:italic; font-weight:200; margin-bottom:2.4rem; }
.hero-btns { display:flex; gap:0.9rem; flex-wrap:wrap; }
.btn-w { background:var(--white); color:var(--green); padding:0.78rem 2rem; border-radius:var(--r); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; transition:background var(--t),transform var(--t); }
.btn-w:hover { background:var(--gl); transform:translateY(-2px); }
.btn-ow { border:1px solid rgba(255,255,255,0.42); color:var(--white); padding:0.78rem 2rem; border-radius:var(--r); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:300; transition:border-color var(--t),transform var(--t); }
.btn-ow:hover { border-color:rgba(255,255,255,0.8); transform:translateY(-2px); }
.scroll-hint { position:absolute; bottom:2.3rem; right:8vw; z-index:2; display:flex; flex-direction:column; align-items:center; gap:6px; color:rgba(255,255,255,0.38); font-size:0.56rem; letter-spacing:0.22em; text-transform:uppercase; }
.scroll-line { width:1px; height:36px; background:rgba(255,255,255,0.22); animation:sp 2.2s ease-in-out infinite; }
@keyframes sp { 0%,100%{opacity:.3;transform:scaleY(.65)} 50%{opacity:1;transform:scaleY(1)} }

/* ── SHARED ── */
section { padding: 7rem 8vw; }
.lbl { font-size:0.64rem; letter-spacing:0.32em; text-transform:uppercase; color:var(--green); margin-bottom:0.9rem; display:flex; align-items:center; gap:0.65rem; }
.lbl::after { content:''; display:block; width:26px; height:1px; background:var(--green); }
.lbl.c { justify-content:center; }
.lbl.c::before { content:''; display:block; width:26px; height:1px; background:var(--green); }
h2 { font-family:'Source Sans Pro',sans-serif; font-weight:200; font-size:clamp(1.85rem,3.4vw,2.85rem); letter-spacing:0.07em; line-height:1.1; }
.body { font-size:1rem; line-height:1.85; color:var(--muted); font-weight:300; max-width:550px; }
.btn-g { display:inline-block; background:var(--green); color:var(--white); padding:0.78rem 2rem; border-radius:var(--r); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; transition:background var(--t),transform var(--t); }
.btn-g:hover { background:var(--gd); transform:translateY(-2px); }
.btn-go { display:inline-flex; align-items:center; gap:0.45rem; border:1.5px solid var(--green); color:var(--green); padding:0.72rem 1.7rem; border-radius:var(--r); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; transition:background var(--t),color var(--t); }
.btn-go:hover { background:var(--green); color:var(--white); }
.btn-go svg { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; }

/* ── ABOUT ── */
.about { background:var(--white); display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center; }
.photo-frame { aspect-ratio:4/5; border-radius:var(--r); overflow:hidden; position:relative; }
.photo-ph { width:100%; height:100%; background:linear-gradient(155deg,var(--gl) 0%,#b2d8bc 100%); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem; }
.photo-ph svg { stroke:var(--green); fill:none; opacity:0.32; }
.photo-ph p { font-size:0.62rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--green); opacity:0.48; }
.photo-deco { position:absolute; bottom:0; right:0; opacity:0.1; pointer-events:none; }
.stats { display:flex; gap:2.4rem; margin-top:2.2rem; margin-bottom:2.2rem; }
.stat-n { font-family:'Source Sans Pro',sans-serif; font-weight:200; font-size:2.7rem; color:var(--green); line-height:1; letter-spacing:0.04em; }
.stat-l { font-size:0.63rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted); margin-top:0.22rem; }
.about-text h2 { margin-bottom:1.3rem; }
.about-text .body { margin-bottom:1.2rem; }

/* ── AMENITIES ── */
.amenities { background:var(--cream); }
.am-head { margin-bottom:3.2rem; }
.am-head h2 { margin-top:0.4rem; }
.am-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(205px,1fr)); gap:1.1rem; }
.am-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r); padding:1.65rem 1.3rem; transition:border-color var(--t),transform var(--t),box-shadow var(--t); }
.am-card:hover { border-color:var(--green); transform:translateY(-3px); box-shadow:0 8px 26px rgba(80,160,96,0.1); }
.am-icon { width:36px; height:36px; background:var(--gl); border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:1rem; }
.am-icon svg { width:17px; height:17px; stroke:var(--green); fill:none; stroke-width:1.6; }
.am-name { font-size:0.83rem; font-weight:600; margin-bottom:0.3rem; }
.am-desc { font-size:0.75rem; color:var(--muted); line-height:1.65; }

/* ── GALLERY ── */
.gallery { background:var(--white); }
.gal-head { margin-bottom:2.2rem; }
.gal-head h2 { margin-top:0.4rem; }
.gal-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:0.7rem; }
.gc { border-radius:var(--r); overflow:hidden; min-height:170px; display:flex; align-items:flex-end; position:relative; cursor:pointer; transition:transform var(--t),box-shadow var(--t); }
.gc:hover { transform:scale(0.988); box-shadow:0 6px 20px rgba(0,0,0,0.1); }
.gc:nth-child(1) { grid-column:span 8; grid-row:span 2; min-height:380px; background:linear-gradient(145deg,#bde3c4,#8fce9a); }
.gc:nth-child(2) { grid-column:span 4; background:linear-gradient(145deg,#aed8b8,#88c492); }
.gc:nth-child(3) { grid-column:span 4; background:linear-gradient(145deg,#c4e8cb,#9dd5a6); }
.gc:nth-child(4) { grid-column:span 4; background:var(--green); }
.gc:nth-child(5) { grid-column:span 4; background:linear-gradient(145deg,#b2debb,#8bca96); }
.gc:nth-child(6) { grid-column:span 4; background:linear-gradient(145deg,#c0e5c7,#98d0a2); }
.gc-lbl { width:100%; padding:0.85rem 1rem; background:linear-gradient(to top,rgba(15,40,18,0.52) 0%,transparent 100%); font-size:0.62rem; letter-spacing:0.18em; text-transform:uppercase; color:rgba(255,255,255,0.85); font-weight:400; }
.gc-ig { align-items:center; justify-content:center; }
.gc-ig a { display:flex; flex-direction:column; align-items:center; gap:0.65rem; width:100%; height:100%; justify-content:center; padding:1.5rem; }
.gc-ig svg { stroke:rgba(255,255,255,0.75); fill:none; stroke-width:1.4; width:26px; height:26px; }
.gc-ig-h { font-size:0.82rem; font-weight:600; color:var(--white); letter-spacing:0.06em; }
.gc-ig-s { font-size:0.62rem; letter-spacing:0.15em; text-transform:uppercase; color:rgba(255,255,255,0.62); }
.gc-ig:hover .gc-ig-h { text-decoration:underline; }

/* ── BOOKING ── */
.booking { background:var(--dark); }
.bk-inner { max-width:800px; margin:0 auto; text-align:center; }
.booking .lbl { justify-content:center; color:rgba(255,255,255,0.4); }
.booking .lbl::after,.booking .lbl::before { background:rgba(255,255,255,0.2); }
.booking h2 { color:var(--white); margin:0.5rem 0 0.7rem; }
.bk-sub { color:rgba(255,255,255,0.42); font-size:0.92rem; margin-bottom:2.8rem; }
.cal-card { background:rgba(255,255,255,0.045); border:1px solid rgba(255,255,255,0.08); border-radius:var(--r); padding:2rem 1.8rem; }
.cal-note { font-size:0.6rem; letter-spacing:0.18em; text-transform:uppercase; color:rgba(255,255,255,0.25); margin-bottom:1.6rem; }
.cal-nav { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.2rem; }
.cal-nav button { background:none; border:1px solid rgba(255,255,255,0.1); color:rgba(255,255,255,0.5); width:28px; height:28px; border-radius:var(--r); cursor:pointer; font-size:0.85rem; transition:border-color var(--t),color var(--t); }
.cal-nav button:hover { border-color:var(--green); color:var(--green); }
.cal-ml { color:var(--white); font-weight:200; letter-spacing:0.12em; font-size:0.82rem; text-transform:uppercase; }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:3px; }
.cal-dn { font-size:0.56rem; letter-spacing:0.14em; text-transform:uppercase; color:rgba(255,255,255,0.25); text-align:center; padding:3px 0 5px; }
.cal-d { aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:0.74rem; color:rgba(255,255,255,0.52); border-radius:2px; cursor:pointer; transition:background var(--t),color var(--t); }
.cal-d:hover:not(.booked):not(.empty) { background:rgba(80,160,96,0.22); color:var(--white); }
.cal-d.available { color:rgba(255,255,255,0.78); }
.cal-d.today { border:1px solid var(--green); color:var(--green); }
.cal-d.booked { color:rgba(255,255,255,0.16); cursor:default; text-decoration:line-through; }
.cal-d.empty { cursor:default; }
.cal-leg { display:flex; gap:1.4rem; justify-content:center; margin-top:1.1rem; flex-wrap:wrap; }
.leg-i { display:flex; align-items:center; gap:0.4rem; font-size:0.66rem; color:rgba(255,255,255,0.32); letter-spacing:0.09em; }
.leg-d { width:8px; height:8px; border-radius:2px; }
.leg-d.av { border:1px solid var(--green); background:rgba(80,160,96,0.32); }
.leg-d.bk { border:1px solid rgba(255,255,255,0.1); background:rgba(255,255,255,0.05); }
.bk-acts { display:flex; gap:0.9rem; justify-content:center; flex-wrap:wrap; margin-top:2rem; }
.btn-gs { background:var(--green); color:var(--white); padding:0.82rem 2.1rem; border-radius:var(--r); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; transition:background var(--t),transform var(--t); }
.btn-gs:hover { background:var(--gd); transform:translateY(-2px); }
.btn-gw { border:1px solid rgba(255,255,255,0.18); color:rgba(255,255,255,0.62); padding:0.82rem 2.1rem; border-radius:var(--r); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase; transition:border-color var(--t),color var(--t),transform var(--t); }
.btn-gw:hover { border-color:var(--white); color:var(--white); transform:translateY(-2px); }

/* ── LOCATION ── */
.location { background:var(--cream); }
.map-wrap { width:100%; height:390px; border-radius:var(--r); overflow:hidden; box-shadow:0 6px 28px rgba(0,0,0,0.1); margin-bottom:4.5rem; position:relative; }
.map-wrap iframe { width:100%; height:100%; border:0; display:block; }
.map-btn { position:absolute; bottom:0.9rem; right:0.9rem; background:var(--white); color:var(--green); padding:0.5rem 1rem; border-radius:var(--r); font-size:0.68rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; display:flex; align-items:center; gap:0.4rem; box-shadow:0 2px 8px rgba(0,0,0,0.12); transition:background var(--t),color var(--t); }
.map-btn svg { width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2; }
.map-btn:hover { background:var(--green); color:var(--white); }
.loc-inner { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:start; }
.loc-inner h2 { margin-bottom:1.1rem; }
.loc-inner .body { margin-bottom:1.6rem; }
.loc-items { display:flex; flex-direction:column; gap:1rem; }
.loc-item { display:flex; gap:0.85rem; align-items:flex-start; }
.loc-ico { width:32px; height:32px; flex-shrink:0; margin-top:2px; background:var(--white); border:1px solid rgba(80,160,96,0.2); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.loc-ico svg { width:13px; height:13px; stroke:var(--green); fill:none; stroke-width:1.8; }
.loc-t strong { display:block; font-size:0.8rem; font-weight:600; margin-bottom:0.12rem; }
.loc-t span { font-size:0.76rem; color:var(--muted); }

/* ── TRIANGLE ── */
.tri-wrap { display:flex; flex-direction:column; gap:0.75rem; }
.tri-badge { display:inline-flex; align-items:center; gap:0.5rem; background:var(--green); color:var(--white); padding:0.42rem 0.9rem; border-radius:100px; font-size:0.63rem; letter-spacing:0.16em; text-transform:uppercase; font-weight:600; width:fit-content; }
.tri-badge svg { width:11px; height:11px; stroke:var(--white); fill:none; stroke-width:2; }
.tri-diag { position:relative; width:100%; aspect-ratio:1/0.9; max-width:390px; }
.tri-diag svg.tri-bg { position:absolute; inset:0; width:100%; height:100%; }
.tri-node { position:absolute; display:flex; flex-direction:column; align-items:center; gap:5px; transform:translate(-50%,-50%); }
.tri-dot { width:46px; height:46px; border-radius:50%; background:var(--white); border:1.5px solid var(--green); display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(80,160,96,0.15); transition:transform var(--t); }
.tri-dot:hover { transform:scale(1.1); }
.tri-dot svg { width:19px; height:19px; stroke:var(--green); fill:none; stroke-width:1.6; }
.tri-lbl { font-size:0.6rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; text-align:center; white-space:nowrap; }
.tri-time { font-size:0.56rem; color:var(--green); background:var(--gl); padding:2px 6px; border-radius:100px; white-space:nowrap; }
.tri-home-node { position:absolute; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:4px; }
.tri-home-dot { width:56px; height:56px; border-radius:50%; background:var(--green); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(80,160,96,0.38); }
.tri-home-dot svg { width:23px; height:23px; stroke:var(--white); fill:none; stroke-width:1.6; }
.tri-home-n { font-size:0.6rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--green); text-align:center; }
.tri-home-s { font-size:0.56rem; color:var(--muted); }
.tri-pills { display:grid; grid-template-columns:1fr 1fr; gap:0.65rem; }
.tri-pill { background:var(--white); border:1px solid var(--border); border-radius:var(--r); padding:0.65rem 0.85rem; display:flex; justify-content:space-between; align-items:center; transition:border-color var(--t); }
.tri-pill:hover { border-color:var(--green); }
.tri-pn { font-size:0.74rem; font-weight:600; }
.tri-pt { font-size:0.66rem; color:var(--green); }

/* ── INSTAGRAM ── */
.instagram { background:var(--white); padding:6rem 8vw; text-align:center; }
.instagram h2 { margin:0.5rem 0 0.4rem; }
.ig-handle { display:inline-flex; align-items:center; gap:0.38rem; font-size:0.86rem; color:var(--green); letter-spacing:0.07em; margin-bottom:2.6rem; }
.ig-handle:hover { text-decoration:underline; }
.ig-handle svg { width:14px; height:14px; stroke:var(--green); fill:none; stroke-width:1.8; }
.ig-grid { display:flex; gap:0.75rem; overflow-x:auto; padding-bottom:0.5rem; scrollbar-width:none; justify-content:center; flex-wrap:wrap; }
.ig-grid::-webkit-scrollbar { display:none; }
.ig-tile { width:190px; height:190px; border-radius:var(--r); flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:transform var(--t); cursor:pointer; overflow:hidden; }
.ig-tile:hover { transform:scale(0.95); }
.ig-tile svg { stroke:var(--green); fill:none; stroke-width:1.2; opacity:0.35; }
.ig-cta { margin-top:2.4rem; }

/* ── FOOTER ── */
footer { background:var(--dark); padding:3.8rem 8vw 2.2rem; }
.ft-top { display:flex; justify-content:space-between; align-items:flex-start; gap:2.5rem; flex-wrap:wrap; padding-bottom:2.2rem; border-bottom:1px solid rgba(255,255,255,0.07); margin-bottom:1.6rem; }
.ft-logo img { height:38px; width:auto; filter:brightness(0) invert(1); opacity:0.65; }
.ft-col-title { font-size:0.62rem; letter-spacing:0.22em; text-transform:uppercase; color:rgba(255,255,255,0.28); margin-bottom:0.9rem; }
.ft-links { display:flex; flex-direction:column; gap:0.6rem; }
.ft-links a { font-size:0.76rem; color:rgba(255,255,255,0.42); transition:color var(--t); letter-spacing:0.04em; }
.ft-links a:hover { color:var(--green); }
.ft-contact { font-size:0.76rem; color:rgba(255,255,255,0.42); display:flex; flex-direction:column; gap:0.6rem; }
.ft-contact a { color:var(--green); transition:opacity var(--t); }
.ft-contact a:hover { opacity:0.75; }
.ft-social a { display:inline-flex; width:34px; height:34px; border:1px solid rgba(255,255,255,0.1); border-radius:50%; align-items:center; justify-content:center; transition:border-color var(--t); }
.ft-social a:hover { border-color:var(--green); }
.ft-social svg { width:14px; height:14px; stroke:rgba(255,255,255,0.42); fill:none; stroke-width:1.8; }
.ft-bottom { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.7rem; font-size:0.66rem; color:rgba(255,255,255,0.26); }
.ft-bottom a { color:var(--green); }
.ft-bottom a:hover { opacity:0.75; }

/* ── RESPONSIVE ── */
@media (max-width:960px) {
  .nav-links { display:none; }
  .hamburger { display:flex; }
  .about { grid-template-columns:1fr; gap:3rem; }
  .loc-inner { grid-template-columns:1fr; gap:3rem; }
  .gc:nth-child(1) { grid-column:span 12; min-height:240px; grid-row:span 1; }
  .gc:nth-child(n+2) { grid-column:span 6; }
  section { padding:5rem 6vw; }
}
@media (max-width:560px) {
  .gc { grid-column:span 12 !important; }
  .tri-pills { grid-template-columns:1fr; }
  .stats { gap:1.4rem; }
  .ig-grid { flex-wrap:nowrap; justify-content:flex-start; }
}

/* ── FADE-UP ── */
/* .fu starts visible — JS adds .js-ready to <body> before animating */
.fu { opacity:1; transform:none; }
body.js-ready .fu { opacity:0; transform:translateY(22px); transition:opacity 0.62s ease,transform 0.62s ease; }
body.js-ready .fu.in { opacity:1; transform:none; }