:root{--navy:#233b79;--ink:#14161c;--sand:#f4f1ec;--gold:#b89b67;--mute:#7a7d85;--serif:"Cormorant Garamond",Georgia,serif;--sans:Jost,"Helvetica Neue",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:300 16px/1.8 var(--sans);color:var(--ink);background:#fff;overflow-x:hidden}
h1,h2,h3{font-family:var(--serif);font-weight:300;letter-spacing:.01em;margin:.2em 0}a{color:inherit}
.nav{position:fixed;inset:0 0 auto;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:26px 6%;color:#fff;transition:.5s}
.nav.solid{background:rgba(255,255,255,.96);color:var(--ink);padding:14px 6%;box-shadow:0 1px 0 #0000000f}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;font:400 1.5rem var(--serif);letter-spacing:.12em;text-transform:uppercase}.brand img{height:42px;border-radius:50%;background:#fff}
nav a{margin:0 18px;text-decoration:none;font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;position:relative}
nav a:after{content:"";position:absolute;left:0;bottom:-4px;height:1px;width:0;background:currentColor;transition:.4s}nav a:hover:after{width:100%}
nav button{border:1px solid currentColor;background:none;color:inherit;padding:5px 12px;font:400 .7rem var(--sans);letter-spacing:.2em;cursor:pointer}
.hero{position:relative;height:100vh;min-height:560px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:-10% 0 0;background:linear-gradient(rgba(8,12,25,.35),rgba(8,12,25,.6)),image-set(url(../img/hero.webp) type("image/webp"),url(../img/hero.jpg) type("image/jpeg")) center/cover;transform:scale(1.08);animation:zoom 2.4s ease-out both}
@keyframes zoom{from{transform:scale(1.2);opacity:.4}to{transform:scale(1.08);opacity:1}}
.hero-in{position:relative;max-width:900px;padding:20px;animation:up 1.6s .4s ease both}
.hero h1{color:#fff;font-size:clamp(2.6rem,7vw,5.6rem);line-height:1.05;font-style:italic}
.hero p{font-size:1.05rem;max-width:560px;margin:1rem auto 2.4rem}
.eyebrow,.label{font:400 .72rem var(--sans);letter-spacing:.4em;text-transform:uppercase;color:var(--gold)}
.ph-note{position:absolute;bottom:22px;left:6%;font-size:.7rem;letter-spacing:.15em;opacity:.7}
.hero:after{content:"";position:absolute;bottom:28px;left:50%;width:1px;height:60px;background:#fff;animation:line 2.2s infinite}
@keyframes line{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@keyframes up{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.btn{display:inline-block;padding:15px 34px;margin:6px;border:1px solid #fff;color:#fff;background:transparent;text-decoration:none;font:400 .72rem var(--sans);letter-spacing:.3em;text-transform:uppercase;cursor:pointer;transition:.4s}
.btn:hover{background:#fff;color:var(--ink)}.btn.ghost{border-color:#25d366;background:#25d366}
.wrap{position:relative;padding:150px 8%;overflow:hidden}.alt{background:var(--sand)}.dark{background:var(--ink);color:#fff}.dark h2,.dark h3{color:#fff}
h2{text-align:center;font-size:clamp(2.2rem,4.5vw,3.8rem);font-style:italic;color:var(--navy)}.label{text-align:center;margin:0}
#about p:not(.label){max-width:760px;margin:40px auto 0;text-align:center;font:300 clamp(1.25rem,2vw,1.6rem)/1.7 var(--serif);color:#333}
.big-word{position:absolute;top:30px;left:0;white-space:nowrap;font:300 clamp(5rem,16vw,15rem)/1 var(--serif);color:transparent;-webkit-text-stroke:1px #23 3b7922;-webkit-text-stroke:1px rgba(35,59,121,.12);pointer-events:none;text-transform:uppercase}
.big-word.r{left:auto;right:0}
.grid{display:flex;flex-direction:column;gap:140px;margin-top:100px}
.hotel{display:grid;grid-template-columns:1.35fr 1fr;gap:7%;align-items:center}.hotel.flip .ph{order:2}
.hotel .ph{overflow:hidden;aspect-ratio:4/3}.img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}.hotel:hover .img{transform:scale(1.05)}
.hotel picture{display:block;height:100%}
.num{display:block;font:300 4rem/1 var(--serif);color:var(--gold);opacity:.6}
.loc{display:block;font:400 .7rem var(--sans);letter-spacing:.35em;text-transform:uppercase;color:var(--mute);margin:18px 0 6px}
.hotel h3{font-size:clamp(2rem,3.4vw,3rem);color:var(--navy);line-height:1.1}
.tag{display:inline-block;margin:10px 0 16px;font:400 .66rem var(--sans);letter-spacing:.25em;text-transform:uppercase;border:1px solid var(--gold);color:var(--gold);padding:4px 12px}
.hotel p{color:#444;max-width:440px}
.link{display:inline-block;margin-top:14px;text-decoration:none;font:400 .72rem var(--sans);letter-spacing:.3em;text-transform:uppercase;border-bottom:1px solid var(--gold);padding-bottom:6px;transition:.3s}.link:hover{letter-spacing:.38em}
.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;align-items:start;margin-top:70px}.reel h3{text-align:center;font-style:italic;font-size:1.8rem}
.reel-wide{grid-column:1/-1}.reel-wide video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#000}.reel-cap{text-align:center;opacity:.75;margin-top:12px;font-size:.95rem;letter-spacing:.05em}
.reel .instagram-media{min-width:0!important;width:100%!important;border-radius:0!important}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:60px;text-align:center;margin-top:70px}.why>div{border-top:1px solid #e3ded5;padding-top:34px}.why h3{font-size:1.9rem;font-style:italic;color:var(--navy)}.why p{color:#555}
.cinfo{text-align:center;margin:30px 0 50px;font:300 1.3rem var(--serif)}.cinfo a{text-decoration:none;margin:0 10px;border-bottom:1px solid var(--gold)}
form{max-width:720px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:26px 34px}
form input,form select,form textarea{padding:12px 0;border:0;border-bottom:1px solid #bdb7ac;background:transparent;font:300 1rem var(--sans);outline:none;transition:.3s}form input:focus,form select:focus,form textarea:focus{border-color:var(--navy)}
form [name=name],form select,textarea,form button,.note{grid-column:1/-1}form .btn{justify-self:center;background:var(--navy);border-color:var(--navy);margin-top:20px}form .btn:hover{background:transparent;color:var(--navy)}
.note{font-size:.8rem;color:var(--mute);text-align:center}
footer{background:var(--ink);color:#cfd2d8;text-align:center;padding:90px 8% 50px;font-size:.85rem;letter-spacing:.05em}footer img{height:80px;background:#fff;border-radius:50%;margin-bottom:20px}footer a{text-decoration:none;border-bottom:1px solid #ffffff33}
.wa-float{position:fixed;right:24px;bottom:24px;z-index:30;width:56px;height:56px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #0003;transition:.3s}.wa-float:hover{transform:scale(1.08)}
.reveal{opacity:0;transform:translateY(50px);transition:opacity 1.3s ease,transform 1.3s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}
.hotel .b.reveal{transition-delay:.2s}
@media(max-width:900px){nav a{display:none}.wrap{padding:100px 7%}.hotel,.reels,.why{grid-template-columns:1fr}.hotel.flip .ph{order:0}.grid{gap:90px}.reels{max-width:520px;margin:50px auto 0}form{grid-template-columns:1fr}.hero h1{font-size:2.8rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
.burger{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative;z-index:25;color:inherit}
.burger span{position:absolute;left:10px;right:10px;height:1px;background:currentColor;transition:.4s}.burger span:first-child{top:17px}.burger span:last-child{top:26px}
.menu-open .burger span:first-child{top:21px;transform:rotate(45deg)}.menu-open .burger span:last-child{top:21px;transform:rotate(-45deg)}
@media(max-width:900px){
 .nav{padding:14px 5%}.nav.solid{padding:10px 5%}.brand{font-size:1.2rem;gap:10px}.brand img{height:38px}.burger{display:block}
 nav{position:fixed;inset:0;background:var(--ink);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;opacity:0;visibility:hidden;transition:.5s}
 .menu-open nav{opacity:1;visibility:visible}.menu-open .nav{color:#fff}
 nav a{display:block!important;font:300 2rem var(--serif);letter-spacing:.05em;text-transform:none;padding:10px 20px;margin:0}
 nav button{margin-top:24px;min-width:64px;min-height:44px;font-size:.8rem}
 .hero{height:100svh;min-height:540px}.hero h1{font-size:clamp(2.3rem,11vw,3rem)}.hero p{font-size:1rem;margin-bottom:2rem}
 .hero .btn{display:block;width:min(100%,320px);margin:12px auto;padding:16px 20px}.ph-note{left:0;right:0;text-align:center;bottom:12px}.hero:after{display:none}
 .wrap{padding:90px 6%}h2{font-size:clamp(2rem,9vw,2.6rem)}#about p:not(.label){font-size:1.25rem;margin-top:28px}
 .big-word{font-size:5rem;top:20px}.grid{gap:80px;margin-top:60px}.num{font-size:3rem}.hotel .b{padding:0 2px}.hotel p{font-size:1rem}
 .link{display:inline-flex;align-items:center;min-height:48px;padding:12px 0}
 .reels{gap:48px}.why{gap:40px;margin-top:40px}
 .cinfo{display:flex;flex-direction:column;gap:6px;font-size:1.2rem}.cinfo a{padding:10px 0;display:inline-block}
 form{gap:18px}form input,form select,form textarea{font-size:16px;min-height:48px}form textarea{min-height:110px}form .btn{width:100%;padding:18px}
 footer{padding:70px 6% 110px;font-size:.95rem;line-height:2.2}footer a{display:inline-block;padding:4px 0}
 .wa-float{right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:54px;height:54px}
}
@media(max-width:370px){.brand span{font-size:1.05rem}.hero h1{font-size:2.2rem}.eyebrow,.label{letter-spacing:.28em}}
.fl{display:flex;flex-direction:column;font:400 .66rem var(--sans);letter-spacing:.25em;text-transform:uppercase;color:var(--mute)}.fl input{width:100%;letter-spacing:normal;text-transform:none;color:var(--ink)}
.cinfo a+a{margin-left:22px}
@media(max-width:900px){.cinfo{flex-direction:column;align-items:center}.cinfo a+a{margin-left:0}.cinfo a{min-width:240px;border-bottom:1px solid var(--gold)}.fl{grid-column:1/-1}}
.partner{display:block;font:400 .62rem var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--navy);margin-bottom:4px}
/* detail pages */
.dhero{position:relative;height:92vh;min-height:520px;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.dhero .hero-bg{background-size:cover;background-position:center}
.dhero-in{position:relative;padding:0 8% 80px;max-width:1000px;animation:up 1.4s .3s ease both}
.dhero h1{color:#fff;font-size:clamp(2.6rem,7vw,5.4rem);font-style:italic;line-height:1.05}
.back{display:inline-block;margin-bottom:26px;font:400 .72rem var(--sans);letter-spacing:.3em;text-transform:uppercase;text-decoration:none;opacity:.85;padding:8px 0}
.tag.light{color:#fff;border-color:#ffffff99}.partner.light{color:#fff;opacity:.85;margin-top:4px}
.narrow{max-width:980px;margin:auto}.lead{font:300 clamp(1.3rem,2.2vw,1.75rem)/1.65 var(--serif);text-align:center;color:#333;margin-top:30px}
.center{text-align:center;max-width:640px;margin:20px auto 40px;color:#555}
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:60px;border-top:1px solid #ddd6ca}
.room{padding:34px 30px;border-bottom:1px solid #ddd6ca;border-right:1px solid #ddd6ca}.room:nth-child(3n){border-right:0}
.room h3{font-size:1.55rem;color:var(--navy);line-height:1.2}.meta{display:block;font:400 .68rem var(--sans);letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin:8px 0}
.room p{color:#555;margin:0}
.split{display:grid;grid-template-columns:1.2fr 1fr;min-height:80vh}.split.flip .sp-img{order:2}
.sp-img{overflow:hidden}.sp-img picture,.sp-img .img{height:100%;min-height:420px}
.sp-txt{padding:100px 9%;display:flex;flex-direction:column;justify-content:center}.sp-txt h2,.sp-txt .label{text-align:left}
.list{list-style:none;padding:0;margin:24px 0 0}.list li{padding:14px 0;border-bottom:1px solid #e6e1d8}
.sub{font-size:1.6rem;font-style:italic;color:var(--navy);margin-top:30px}
.facs{list-style:none;padding:0;max-width:980px;margin:60px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:0 60px}.facs li{padding:18px 0 18px 34px;border-bottom:1px solid #e6e1d8;position:relative}.facs li:before{content:"";position:absolute;left:0;top:30px;width:18px;height:1px;background:var(--gold)}
.gal{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:300px;gap:10px;margin-top:60px}.g{overflow:hidden;display:block}.g:nth-child(1){grid-column:span 2;grid-row:span 2}.g picture{display:block;height:100%}.g .img{height:100%}.g:hover .img{transform:scale(1.06)}
#bf{grid-template-columns:1fr 1fr 1fr}#bf .wa-btn{grid-column:1/-1;justify-self:center;background:#25d366;border-color:#25d366;color:#fff}#bf .fl{grid-column:auto}
.pn{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #e6e1d8}.pn a{padding:50px 8%;text-decoration:none;font:400 .7rem var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--mute)}.pn a+a{text-align:right;border-left:1px solid #e6e1d8}.pn b{display:block;font:300 2rem var(--serif);letter-spacing:0;text-transform:none;color:var(--navy);margin-top:8px;font-style:italic}
.src{padding:50px 8%;font-size:.8rem;color:var(--mute)}.src .label{text-align:left}.src ul{padding-left:18px}.src a{word-break:break-all}
.lb{position:fixed;inset:0;z-index:50;background:rgba(10,12,18,.95);display:flex;align-items:center;justify-content:center}.lb[hidden]{display:none}.lb img{max-width:92vw;max-height:86vh}
.lb button{position:absolute;background:none;border:0;color:#fff;font-size:2.6rem;cursor:pointer;width:56px;height:56px}.lb-x{top:14px;right:14px}.lb-p{left:10px}.lb-n{right:10px}
.hotel .ph a,.hotel h3 a{display:block;text-decoration:none;color:inherit}.more{margin-right:26px}
.detail .nav:not(.solid){background:linear-gradient(rgba(0,0,0,.35),transparent)}
@media(max-width:900px){
 .dhero{height:88svh}.dhero-in{padding:0 6% 60px}.rooms{grid-template-columns:1fr}.room{border-right:0;padding:26px 4px}
 .split,.split.flip{grid-template-columns:1fr;min-height:0}.split.flip .sp-img{order:0}.sp-img picture,.sp-img .img{min-height:0;aspect-ratio:4/3}.sp-txt{padding:60px 6%}
 .facs{grid-template-columns:1fr}.gal{grid-template-columns:1fr 1fr;grid-auto-rows:160px;gap:6px}.g:nth-child(1){grid-column:span 2;grid-row:span 2}
 #bf{grid-template-columns:1fr}#bf .fl{grid-column:1/-1}.pn{grid-template-columns:1fr}.pn a+a{border-left:0;border-top:1px solid #e6e1d8}.pn a{padding:34px 6%}.pn b{font-size:1.6rem}
}
/* script logo */
.brand img{height:58px!important;width:auto;background:none!important;border-radius:0!important}.brand .lg-n{display:none}
.nav.solid .brand .lg-w{display:none}.nav.solid .brand .lg-n{display:block}
.nav.solid .brand img{height:46px!important}
.menu-open .nav .brand .lg-w{display:block}.menu-open .nav .brand .lg-n{display:none}
.menu-logo{display:none}
footer .flogo{height:110px;background:none;border-radius:0;margin-bottom:26px}
@media(max-width:900px){.brand img{height:48px!important}.nav.solid .brand img{height:40px!important}.menu-open nav .menu-logo{display:block;height:90px;margin-bottom:30px}}
@media(min-width:901px){.brand img{height:78px!important}.nav.solid .brand img{height:56px!important}.nav{padding:18px 6%}}
/* script logo, large */
.nav{padding:14px 5%}.nav.solid{padding:8px 5%}
.brand img.lg-w,.brand img.lg-n{height:124px!important;width:auto;border-radius:0!important;background:none!important;transition:height .4s}
.brand .lg-w{filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
.nav.solid .brand img.lg-n{height:88px!important}
footer .flogo{height:150px;width:auto;border-radius:0}
.menu-open nav .menu-logo{width:auto}
@media(max-width:900px){.nav{padding:10px 4%}.nav.solid{padding:6px 4%}.brand img.lg-w,.brand img.lg-n{height:80px!important}.nav.solid .brand img.lg-n{height:64px!important}.menu-open nav .menu-logo{height:120px}}
@media(min-width:901px){.nav{padding:24px 5% 14px}.nav.solid{padding:8px 5%}}
@media(max-width:900px){.nav{padding:16px 5% 8px}.nav.solid{padding:6px 5%}}
/* HS LUXURY TRAVEL logo */
.brand img.lg-w,.brand img.lg-n{height:128px!important}
.nav.solid .brand img.lg-n{height:88px!important}
.brand .lg-w{filter:drop-shadow(0 2px 8px rgba(0,0,0,.6))}
@media(min-width:901px){.nav{padding:22px 5% 12px}.nav.solid{padding:6px 5%}}
@media(max-width:900px){.brand img.lg-w,.brand img.lg-n{height:80px!important}.nav.solid .brand img.lg-n{height:60px!important}.nav{padding:14px 5% 8px}.nav.solid{padding:5px 5%}}

.vgrid{display:grid;grid-template-columns:1fr;gap:44px;margin:50px auto 0}.vcard h3{text-align:center;font-style:italic;font-size:1.8rem}.vcard video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#000}
@media(min-width:900px){.vgrid{grid-template-columns:1fr 1fr;gap:48px 36px;margin-top:70px}.vcard:last-child{grid-column:1/-1;max-width:calc(50% - 18px);justify-self:center;width:100%}}
/* contrast boost */
:root{--ink:#0e1016;--mute:#4f535c}
body{font-weight:400;color:var(--ink)}
h1,h2,h3{font-weight:400}

.label{color:#8a6f3e}
.big-word{-webkit-text-stroke:1px rgba(35,59,121,.2)}
h2{color:#1a2f66}
.dark h2,.dark h3{color:#fff}
