@font-face{font-family:"Jost";src:url("../fonts/Jost.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"YC Serif SC";src:url("../fonts/YCSerifSC.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}

:root{
  --bg:#f6f4f0; --paper:#fbfaf7; --stone:#ebe7e0; --line:#ddd7ce;
  --ink:#2b2a28; --soft:#524e49; --muted:#7b756c; --accent:#8a6a4a; --wa:#25d366;
  --geo:"Jost","Futura","Century Gothic","Avenir Next","Helvetica Neue",Arial,"YC Serif SC","Songti SC","STSong","Noto Serif SC","Source Han Serif SC","SimSun",serif;
  --sans:"YC Serif SC","Songti SC","STSong","Noto Serif SC","Source Han Serif SC","SimSun",serif;
  --zh-ls-body:0.01em; --zh-ls-ui:0.08em; --zh-ls-head:0.03em;
  --zh-lh-body:1.75; --zh-lh-copy:1.75;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.65;font-size:16px;font-weight:300;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
[hidden]{display:none!important}
.container{width:min(1240px,90%);margin:0 auto}
.narrow{max-width:900px}
h1,h2,h3{font-family:var(--geo);font-weight:300;line-height:1.28;letter-spacing:var(--zh-ls-head)}
h2{font-size:clamp(1.55rem,2.8vw,2.15rem);margin-bottom:1rem}
h3{font-size:1.05rem}
p,li{letter-spacing:var(--zh-ls-body);line-height:var(--zh-lh-body)}
.eyebrow{font-family:var(--sans);font-size:.74rem;letter-spacing:var(--zh-ls-ui);text-transform:uppercase;color:var(--muted);font-weight:300;margin-bottom:1.1rem}
.eyebrow.center{text-align:center}
.eyebrow.light{color:rgba(255,255,255,.82)}
.muted{color:var(--soft)}
.wordmark{font-family:"Jost","Futura","Century Gothic","Avenir Next",Arial,sans-serif;font-weight:500;font-size:1.05rem;letter-spacing:.28em;white-space:nowrap;color:var(--ink)}
.wordmark small{display:block;font-family:var(--sans);font-size:.62rem;letter-spacing:.18em;font-weight:300;color:var(--muted);margin-top:.15rem}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55rem;justify-content:center;padding:.9rem 1.8rem;font-family:var(--sans);font-size:.8rem;letter-spacing:var(--zh-ls-ui);text-transform:uppercase;font-weight:300;transition:.25s;border:1px solid transparent;cursor:pointer;border-radius:0}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#000}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:#fff}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{filter:brightness(.93)}
.btn-wechat{background:#07c160;color:#fff;position:relative;text-transform:none;letter-spacing:.06em}
.btn-wechat:hover{filter:brightness(.93)}
.btn-white{background:#fff;color:var(--ink)}
.btn-white:hover{background:var(--bg)}
.btn-line-light{border-color:rgba(255,255,255,.8);color:#fff}
.btn-line-light:hover{background:#fff;color:var(--ink)}
.btn.full{width:100%}
.btns{display:flex;gap:1rem;flex-wrap:wrap}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(246,244,240,.9);backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.05)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}
.menu{display:flex;gap:2.2rem}
.menu a{font-family:var(--sans);font-size:.78rem;letter-spacing:var(--zh-ls-ui);text-transform:uppercase;color:var(--soft);transition:.2s;font-weight:300}
.menu a:hover{color:var(--ink)}
.nav-actions{display:flex;align-items:center;gap:1rem}
.burger{display:none;background:none;border:0;cursor:pointer;width:28px}
.burger span{display:block;height:1.5px;background:var(--ink);margin:7px 0}

/* hero full */
.hero-full{position:relative;height:calc(100vh - 74px);min-height:560px;overflow:hidden;color:#fff;display:flex;align-items:flex-end;background:#9d9387}
.hero-full .bleed{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,16,13,.18) 0%,rgba(18,16,13,.04) 40%,rgba(18,16,13,.62) 100%);pointer-events:none}
.hero-inner{position:relative;width:min(1240px,90%);margin:0 auto;padding-bottom:clamp(52px,8vh,84px);pointer-events:none}
.hero-inner a,.hero-inner .btns{pointer-events:auto}
.hero-inner .eyebrow{font-size:.66rem;letter-spacing:.14em;margin-bottom:.55rem;color:rgba(255,255,255,.82)}
.hero-mark{font-family:"Jost",sans-serif;font-weight:400;font-size:clamp(1.9rem,3.6vw,3.2rem);letter-spacing:.22em;line-height:1;margin:0 0 .7rem;text-shadow:0 1px 12px rgba(0,0,0,.25)}
.hero-full h1{font-size:clamp(1.05rem,1.6vw,1.35rem);font-weight:300;margin-bottom:1.3rem;letter-spacing:.08em;line-height:1.45;text-shadow:0 1px 10px rgba(0,0,0,.35);max-width:18em}
.hero-inner .btns{gap:.6rem}
.hero-inner .btn{padding:.6rem 1.2rem;font-size:.72rem;letter-spacing:.1em}
.scroll-cue{position:absolute;left:50%;bottom:22px;width:1px;height:42px;background:rgba(255,255,255,.35);overflow:hidden}
.scroll-cue span{position:absolute;left:0;top:-42px;width:1px;height:42px;background:#fff;animation:cue 2.2s infinite}
@keyframes cue{to{top:42px}}

/* intro */
.intro{padding:7rem 0 5.5rem;text-align:center}
.intro-text{font-family:var(--sans);font-weight:300;font-size:clamp(17px,15px + .55vw,21px);line-height:1.9;letter-spacing:.04em;color:var(--ink);max-width:32em;margin:0 auto}
.intro .sub{margin-top:1.4rem;font-size:.88rem;color:var(--muted);letter-spacing:.06em}

/* sections */
.section{padding:6.5rem 0}
.section-head{text-align:center;max-width:680px;margin:0 auto 2.8rem}
.section-head p.lead{color:var(--soft);font-size:.95rem;margin-top:.4rem}

/* pillars */
.pillars{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.pillar{display:block;background:var(--bg);transition:opacity .3s}
.pillar:hover{opacity:.92}
.pillar-img{aspect-ratio:3/4.8;overflow:hidden;background:var(--stone)}
.pillar-img img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.pillar-body{padding:1.15rem 1rem 1.4rem}
.pillar-body .p-type{font-family:var(--geo);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.pillar-body h3{margin-bottom:.35rem;font-size:1.05rem;letter-spacing:.06em}
.pillar-body p{font-size:.86rem;color:var(--soft);margin:0;line-height:1.75}

/* editorial */
.ed{display:grid;align-items:center;background:var(--paper);overflow:hidden}
.ed-media{display:grid;gap:4px;min-width:0}
.ed-media figure{overflow:hidden;background:var(--stone);aspect-ratio:var(--ar,3/4);margin:0}
.ed-media img{width:100%;height:100%;object-fit:cover;cursor:zoom-in}
.ed-media.single{--ar:4/3}
.ed-media.pair{grid-template-columns:1fr 1fr;--ar:4/3}
.ed-text{padding:clamp(2.2rem,5vw,5.5rem);max-width:34rem;justify-self:center}
.ed-text .eyebrow{margin-bottom:.9rem}
.ed-text h2{font-size:clamp(1.25rem,1rem + .8vw,1.7rem);margin-bottom:1rem}
.ed-copy{font-size:.9rem;line-height:var(--zh-lh-copy);color:var(--soft)}
.ed-copy + .ed-copy{margin-top:1rem}
.ed--left{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}
.ed--right{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr)}
.ed--right .ed-media{order:2}
.ed + .ed{border-top:1px solid var(--line)}

/* rooms gallery */
.rooms{background:var(--bg)}
.room-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.room-grid figure{margin:0;overflow:hidden;background:var(--stone);position:relative}
.room-grid figure.room-wide{grid-column:1/-1}
.room-grid img{width:100%;height:auto;display:block;object-fit:contain;cursor:zoom-in;transition:opacity .3s;vertical-align:bottom}
.room-grid img:hover{opacity:.9}
.room-note{text-align:center;color:var(--muted);font-size:.82rem;margin-top:1.8rem}

/* tennis */
.tennis{background:var(--ink);color:rgba(255,255,255,.78);padding:0}
.tennis-inner{display:grid;grid-template-columns:1.15fr 1fr;min-height:0}
.tennis-media{position:relative;background:#111;min-height:420px}
.tennis-media video,.tennis-media img.poster-fallback{width:100%;height:100%;object-fit:cover;display:block;min-height:420px;max-height:78vh}
.tennis-text{display:flex;flex-direction:column;justify-content:center;padding:clamp(2.4rem,5vw,4.5rem) clamp(1.6rem,5vw,4rem)}
.tennis-text .eyebrow{color:rgba(255,255,255,.55)}
.tennis-text h2{color:#fff;font-size:clamp(1.35rem,1.1rem + .9vw,1.9rem)}
.tennis-text p{font-size:.92rem;line-height:1.85;margin-bottom:1rem}
.tennis-text .btn-line-light{align-self:flex-start;margin-top:.6rem}

/* site gallery */
.site-gal{background:var(--paper);border-top:1px solid var(--line)}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(180px,22vw);gap:10px}
.gallery figure{margin:0;overflow:hidden;background:var(--stone);height:100%}
.gallery img{width:100%;height:100%;object-fit:cover;cursor:zoom-in;transition:opacity .3s}
.gallery img:hover{opacity:.88}
.gallery figure:nth-child(1){grid-row:span 2}
.gallery figure:nth-child(6){grid-column:span 2}
.gallery figure:nth-child(11){grid-column:span 2}
.site-status{display:inline-flex;align-items:center;gap:.55rem;border:1px solid var(--line);padding:.45rem 1rem;font-size:.78rem;letter-spacing:.12em;color:var(--muted);margin:0 auto 2rem;font-family:var(--geo)}
.site-status i{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block}

/* invite */
.invite{background:var(--bg)}
.invite-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.invite p{color:var(--soft);margin-bottom:1.15rem;font-size:.95rem}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line);margin-top:1.5rem}
.why{padding:1.6rem 1.4rem 1.6rem 0;border-bottom:1px solid var(--line)}
.why:nth-child(odd){border-right:1px solid var(--line)}
.why:nth-child(even){padding-left:1.4rem}
.why .num{font-family:var(--geo);font-size:.72rem;color:var(--muted);letter-spacing:.2em}
.why h3{margin:.5rem 0 .35rem;font-size:1rem}
.why p{font-size:.88rem;margin:0}

/* contact */
.contact{background:var(--paper);border-top:1px solid var(--line)}
.contact-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:5rem;align-items:start}
.contact-btns{display:flex;gap:.8rem;margin:1.6rem 0;flex-wrap:wrap}
.contact-list{list-style:none;border-top:1px solid var(--line)}
.contact-list li{display:flex;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--line);font-size:.93rem;align-items:center}
.contact-list b{min-width:72px;color:var(--muted);font-weight:300;font-size:.85rem}
.contact-list a{border-bottom:1px solid var(--line)}
.form{background:var(--bg);padding:2.4rem;border:1px solid var(--line)}
.form label{display:block;margin-bottom:1.2rem;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-family:var(--geo)}
.form label span{display:block;margin-bottom:.45rem}
.form input,.form textarea{width:100%;padding:.75rem 0;border:0;border-bottom:1px solid var(--line);font:inherit;font-size:.95rem;letter-spacing:0;text-transform:none;color:var(--ink);background:transparent;border-radius:0}
.form textarea{border:1px solid var(--line);padding:.75rem;min-height:120px;resize:vertical}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--ink)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.form-note{font-size:.78rem;color:var(--muted);margin-top:1rem;text-align:center}
.copy-btn{position:relative;margin-left:auto;background:none;border:1px solid var(--line);padding:.15rem .75rem;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--soft);cursor:pointer;font-family:var(--geo)}
.copy-btn:hover,.copy-btn.done{border-color:var(--ink);color:var(--ink)}
.wechat-id{font-family:var(--geo);letter-spacing:.06em}

/* footer */
.footer{background:var(--ink);color:rgba(255,255,255,.6);padding:3.2rem 0}
.footer-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.footer .wordmark{color:#fff;letter-spacing:.28em}
.footer .wordmark small{color:rgba(255,255,255,.45)}
.footer p{font-size:.82rem;margin-top:.7rem}
.foot-links{display:flex;gap:1.4rem;flex-wrap:wrap;font-size:.78rem;letter-spacing:.08em}
.foot-links a{border-bottom:1px solid transparent}
.foot-links a:hover{border-color:rgba(255,255,255,.35);color:#fff}

.wa-float{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.2);z-index:60;transition:.25s}
.wa-float:hover{transform:scale(1.07)}
.wa-float svg{width:26px;height:26px}

/* lightbox */
.lightbox{position:fixed;inset:0;background:rgba(20,19,18,.94);z-index:100;display:flex;align-items:center;justify-content:center}
.lightbox img{max-width:88vw;max-height:88vh;object-fit:contain}
.lb-close,.lb-nav{position:absolute;background:none;border:0;color:#fff;font-size:2.4rem;cursor:pointer;opacity:.7;padding:1rem}
.lb-close:hover,.lb-nav:hover{opacity:1}
.lb-close{top:.5rem;right:1rem}
.lb-nav.prev{left:1rem}.lb-nav.next{right:1rem}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .85s,transform .85s}
.reveal.in{opacity:1;transform:none}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

@media (max-width:1000px){
  .pillar-grid{grid-template-columns:1fr 1fr}
  .ed--left,.ed--right{grid-template-columns:1fr}
  .ed--right .ed-media{order:0}
  .room-grid{grid-template-columns:1fr 1fr}
  .tennis-inner{grid-template-columns:1fr}
  .invite-grid,.contact-grid{grid-template-columns:1fr;gap:2.5rem}
  .gallery{grid-template-columns:repeat(3,1fr);grid-auto-rows:28vw}
}
@media (max-width:760px){
  .menu{position:fixed;top:74px;left:0;right:0;background:var(--bg);flex-direction:column;gap:0;padding:0 5%;max-height:0;overflow:hidden;transition:max-height .35s;border-bottom:1px solid var(--line)}
  .menu.open{max-height:480px}
  .menu a{padding:1.05rem 0;border-bottom:1px solid var(--line)}
  .burger{display:block}
  .wordmark{font-size:.92rem;letter-spacing:.22em}
  .hero-full{height:calc(100svh - 74px);min-height:520px}
  .hero-mark{font-size:8vw;letter-spacing:.16em}
  .hero-full h1{font-size:.95rem}
  .hero-inner .btn{padding:.55rem 1rem;font-size:.7rem}
  .intro{padding:4rem 0 3.2rem}
  .section{padding:4.2rem 0}
  .pillar-grid{grid-template-columns:1fr 1fr;gap:.7rem}
  .pillar-body{padding:.85rem .7rem 1.1rem}
  .pillar-body h3{font-size:.95rem}
  .ed-text{padding:1rem 1.2rem 2.2rem;max-width:none}
  .room-grid{grid-template-columns:1fr;gap:10px}
  .gallery{grid-template-columns:1fr 1fr;grid-auto-rows:52vw;gap:6px}
  .gallery figure:nth-child(1){grid-row:auto}
  .gallery figure:nth-child(6),.gallery figure:nth-child(11){grid-column:span 2}
  .why-grid{grid-template-columns:1fr}
  .why,.why:nth-child(even){padding:1.3rem 0;border-right:0}
  .row2{grid-template-columns:1fr}
  .form{padding:1.5rem}
  .footer-inner{flex-direction:column;align-items:flex-start}
  .tennis-media video,.tennis-media img.poster-fallback{min-height:280px;max-height:55vh}
}


/* floor plans */
.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.2rem;margin-top:1rem}
.plan-card{background:var(--paper);border:1px solid var(--line);overflow:hidden}
.plan-card img{width:100%;height:auto;display:block;cursor:zoom-in;background:#fff}
.plan-card figcaption{padding:1.1rem 1.3rem 1.35rem;display:flex;flex-direction:column;gap:.35rem}
.plan-card figcaption b{font-family:var(--geo);font-weight:500;letter-spacing:.06em}
.plan-card figcaption span{font-size:.9rem;color:var(--soft)}
@media (max-width:760px){.plan-grid{grid-template-columns:1fr}}


/* location + map */
.location{background:var(--paper);border-top:1px solid var(--line)}
.loc-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:2.4rem;align-items:stretch;margin-top:.5rem}
.loc-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
.loc-points li{padding:1.15rem 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:.35rem}
.loc-points b{font-family:var(--geo);font-weight:500;letter-spacing:.06em;font-size:.95rem}
.loc-points span{color:var(--soft);font-size:.92rem;line-height:1.7}
.map-wrap{display:flex;flex-direction:column;gap:.7rem;min-height:320px}
.map-wrap iframe{width:100%;flex:1;min-height:320px;border:1px solid var(--line);background:var(--stone)}
.map-cap{margin:0;font-size:.82rem;letter-spacing:.04em}
.map-cap a{color:var(--ink);border-bottom:1px solid var(--line)}
.map-cap a:hover{border-color:var(--ink)}
@media (max-width:1000px){
  .loc-grid{grid-template-columns:1fr;gap:1.6rem}
  .map-wrap iframe{min-height:280px}
}


/* social core */
.social{background:var(--bg);border-top:1px solid var(--line)}
.social-story{max-width:40em;margin:0 auto 2.2rem;text-align:center}
.social-lead{font-size:clamp(1.02rem,0.95rem + .35vw,1.2rem);line-height:1.85;color:var(--ink);font-weight:300;letter-spacing:.03em;margin:0}
.social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.social-card{padding:1.7rem 1.35rem 1.9rem;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}
.social-card:nth-child(4n){border-right:0}
.social-card .num{font-family:var(--geo);font-size:.72rem;letter-spacing:.18em;color:var(--muted);margin:0 0 .55rem}
.social-card h3{font-size:1.02rem;margin:0 0 .55rem;font-weight:500}
.social-card p{font-size:.9rem;line-height:1.75;color:var(--soft);margin:0}
.social-note{text-align:center;color:var(--muted);font-size:.84rem;letter-spacing:.04em;margin:2rem auto 0;max-width:36em}
@media (max-width:1000px){
  .social-grid{grid-template-columns:1fr 1fr}
  .social-card:nth-child(2n){border-right:0}
  .social-card:nth-child(4n){border-right:0}
}
@media (max-width:760px){
  .social-grid{grid-template-columns:1fr}
  .social-card{border-right:0;padding:1.35rem 0}
}