/* template31 — Hotel showcase. Re-skin a property by overriding the --hx-* tokens. */
:root{
  --hx-bg:#faf7f2; --hx-surface:#ffffff; --hx-ink:#1f2933; --hx-muted:#6b7280;
  --hx-accent:#b08d57; --hx-accent-ink:#ffffff; --hx-dark:#14211f; --hx-dark-ink:#f4efe6;
  --hx-line:#e7e0d3; --hx-radius:6px; --hx-shadow:0 10px 30px rgba(20,33,31,.10);
  --hx-font-head:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --hx-font-body:'Jost',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --hx-nav-h:76px; --hx-gutter:20px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body.hx{margin:0;background:var(--hx-bg);color:var(--hx-ink);font-family:var(--hx-font-body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
.hx img{max-width:100%;height:auto;display:block}
.hx a{color:inherit;text-decoration:none}
.hx h1,.hx h2,.hx h3,.hx h4{font-family:var(--hx-font-head);font-weight:600;line-height:1.15;margin:0 0 .5em;color:inherit}
.hx h1{font-size:clamp(2.4rem,6vw,4.4rem)} .hx h2{font-size:clamp(1.9rem,4vw,2.9rem)} .hx h3{font-size:1.5rem}
.hx p{margin:0 0 1em}
.hx-container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--hx-gutter)}
.hx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hx-rich img{margin:1em 0}.hx-rich ul{padding-left:1.2em}

/* buttons */
.hx-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.85em 1.7em;border:1px solid var(--hx-accent);background:var(--hx-accent);color:var(--hx-accent-ink)!important;font:500 .85rem/1 var(--hx-font-body);letter-spacing:.14em;text-transform:uppercase;border-radius:var(--hx-radius);cursor:pointer;transition:.25s}
.hx-btn:hover{filter:brightness(.92);transform:translateY(-1px)}
.hx-btn--ghost{background:transparent;color:var(--hx-ink)!important;border-color:currentColor}
.hx-btn--light{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.8)}
.hx-btn--block{display:flex;width:100%}

/* nav */
.hx-nav{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--hx-nav-h);display:flex;align-items:center;transition:background .3s,box-shadow .3s;color:#fff}
.hx-nav.is-solid,.hx-nav.is-scrolled{background:var(--hx-dark);color:var(--hx-dark-ink);box-shadow:0 2px 20px rgba(0,0,0,.18)}
.hx-nav .hx-container{display:flex;align-items:center;justify-content:space-between;gap:20px}
.hx-logo{display:flex;align-items:center;gap:12px;font-family:var(--hx-font-head);font-size:1.6rem;font-weight:600;letter-spacing:.02em}
.hx-logo img{max-height:52px;width:auto}
.hx-menu{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:26px}
.hx-menu>li{position:relative}
.hx-menu a{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;padding:8px 0;display:inline-block;opacity:.92}
.hx-menu a:hover,.hx-menu .is-active>a{opacity:1;color:var(--hx-accent)}
.hx-menu .hx-sub{display:none;position:absolute;left:-16px;top:100%;min-width:220px;background:var(--hx-surface);color:var(--hx-ink);border-radius:var(--hx-radius);box-shadow:var(--hx-shadow);padding:10px 0;list-style:none;margin:0}
.hx-menu li:hover>.hx-sub,.hx-menu li:focus-within>.hx-sub{display:block}
.hx-sub a{display:block;padding:8px 20px;text-transform:none;letter-spacing:.02em;font-size:.95rem}
.hx-sub .hx-sub{left:100%;top:0}
.hx-burger{display:none;background:none;border:0;color:inherit;width:44px;height:44px;cursor:pointer;padding:0}
.hx-burger span,.hx-burger span::before,.hx-burger span::after{display:block;width:24px;height:2px;background:currentColor;position:relative;margin:auto;transition:.25s}
.hx-burger span::before,.hx-burger span::after{content:"";position:absolute;left:0}
.hx-burger span::before{top:-7px}.hx-burger span::after{top:7px}
@media(max-width:991px){
  .hx-burger{display:block}
  .hx-nav .hx-btn{display:none}
  .hx-menu{position:fixed;inset:var(--hx-nav-h) 0 0 0;background:var(--hx-dark);color:var(--hx-dark-ink);flex-direction:column;align-items:stretch;gap:0;padding:12px var(--hx-gutter) 90px;overflow:auto;transform:translateX(100%);transition:transform .3s}
  .hx-nav.is-open .hx-menu{transform:none}
  .hx-menu>li{border-bottom:1px solid rgba(255,255,255,.1)}
  .hx-menu a{padding:16px 0;width:100%}
  .hx-menu .hx-sub{display:block;position:static;background:none;color:inherit;box-shadow:none;padding:0 0 10px 14px}
  .hx-sub a{padding:9px 0;opacity:.8}
  body.hx-lock{overflow:hidden}
}

/* hero */
.hx-hero{position:relative;height:100vh;min-height:560px;max-height:920px;background:var(--hx-dark);color:#fff;overflow:hidden}
.hx-slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;background-size:cover;background-position:center}
.hx-slide.is-on{opacity:1}
.hx-hero:not(.is-js) .hx-slide:first-child{opacity:1}
.hx-hero:not(.is-js) .inner+.inner{display:none}
.hx-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.25) 45%,rgba(0,0,0,.6))}
.hx-hero-copy{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--hx-nav-h) var(--hx-gutter) 60px}
.hx-hero-copy .inner{max-width:820px}
.hx-eyebrow{display:block;font-size:.8rem;letter-spacing:.32em;text-transform:uppercase;color:var(--hx-accent);margin-bottom:14px}
.hx-hero-copy p{font-size:1.15rem;opacity:.92;margin-bottom:1.6em}
.hx-hero-copy h1{color:#fff}
.hx-dots{position:absolute;z-index:3;bottom:8px;left:0;right:0;display:flex;justify-content:center;gap:10px}
.hx-dots button{width:44px;height:44px;border:0;padding:0;background:none;cursor:pointer;position:relative}
.hx-dots button::before{content:"";position:absolute;left:5px;right:5px;top:50%;height:3px;margin-top:-1.5px;background:rgba(255,255,255,.4)}
.hx-dots button.is-on::before{background:var(--hx-accent)}
.hx-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(0,0,0,.2);color:#fff;cursor:pointer;font-size:20px}
.hx-arrow--prev{left:18px}.hx-arrow--next{right:18px}
@media(max-width:767px){.hx-arrow{display:none}.hx-hero{height:86vh}}

/* page banner (inner pages) */
.hx-banner{padding:calc(var(--hx-nav-h) + 70px) 0 60px;background:var(--hx-dark) center/cover;color:var(--hx-dark-ink);text-align:center;position:relative}
.hx-banner::before{content:"";position:absolute;inset:0;background:rgba(20,33,31,.72)}
.hx-banner .hx-container{position:relative}
.hx-banner h1{font-size:clamp(2.2rem,5vw,3.4rem);color:#fff;margin:0}
.hx-crumbs{list-style:none;margin:14px 0 0;padding:0;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;font-size:.85rem;opacity:.85}
.hx-crumbs li+li::before{content:"/";margin-right:8px;opacity:.6}

/* sections */
.hx-section{padding:clamp(56px,8vw,104px) 0}
.hx-section--alt{background:var(--hx-surface)}
.hx-section--dark{background:var(--hx-dark);color:var(--hx-dark-ink)}
.hx-head{text-align:center;max-width:700px;margin:0 auto 48px}
.hx-head p{color:var(--hx-muted)}.hx-section--dark .hx-head p{color:rgba(244,239,230,.75)}
.hx-head::after{content:"";display:block;width:56px;height:2px;background:var(--hx-accent);margin:20px auto 0}
.hx-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.hx-grid--3{grid-template-columns:repeat(3,1fr)}
@media(max-width:991px){.hx-grid--3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.hx-grid,.hx-grid--3{grid-template-columns:1fr}}
.hx-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
@media(max-width:860px){.hx-split{grid-template-columns:1fr}}
.hx-split img{width:100%;border-radius:var(--hx-radius);box-shadow:var(--hx-shadow)}
.hx-more{text-align:center;margin-top:44px}

/* room card */
.hx-room{background:var(--hx-surface);border-radius:var(--hx-radius);overflow:hidden;box-shadow:0 2px 14px rgba(0,0,0,.05);display:flex;flex-direction:column;transition:.3s}
.hx-room:hover{transform:translateY(-4px);box-shadow:var(--hx-shadow)}
.hx-room-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#e9e3d6}
.hx-room-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.hx-room:hover .hx-room-img img{transform:scale(1.06)}
.hx-badges{position:absolute;top:12px;left:12px;display:flex;gap:6px;flex-wrap:wrap}
.hx-badge{background:var(--hx-accent);color:var(--hx-accent-ink);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:3px}
.hx-room-body{padding:22px;display:flex;flex-direction:column;flex:1}
.hx-room-body h3{margin-bottom:.3em}
.hx-room-body p{color:var(--hx-muted);font-size:.95rem}
.hx-specs{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.85rem;color:var(--hx-muted)}
.hx-specs b{font-weight:500;color:var(--hx-ink)}
.hx-room-foot{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;border-top:1px solid var(--hx-line);padding-top:16px}
.hx-price small{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--hx-muted)}
.hx-price strong{font:600 1.6rem/1.1 var(--hx-font-head)}
.hx-price del{color:var(--hx-muted);font-size:.9rem;margin-left:6px}
.hx-price em{font-style:normal;font-size:.8rem;color:var(--hx-muted)}
.hx-link{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hx-accent);white-space:nowrap;display:inline-block;padding:12px 0}

/* feature / service tiles */
.hx-tile{background:var(--hx-surface);border:1px solid var(--hx-line);border-radius:var(--hx-radius);padding:30px 26px;transition:.3s;display:block;height:100%}
.hx-tile:hover{border-color:var(--hx-accent);box-shadow:var(--hx-shadow)}
.hx-section--dark .hx-tile{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.12)}
.hx-tile-ico{width:52px;height:52px;border-radius:50%;background:rgba(176,141,87,.14);color:var(--hx-accent);display:grid;place-items:center;margin-bottom:18px}
.hx-tile-ico svg{width:24px;height:24px}
.hx-tile p{color:var(--hx-muted);margin:0 0 12px;font-size:.95rem}.hx-section--dark .hx-tile p{color:rgba(244,239,230,.72)}
.hx-tile--img{padding:0;overflow:hidden}.hx-tile--img img{width:100%;aspect-ratio:16/10;object-fit:cover}.hx-tile--img .body{padding:22px 24px}

/* stats */
.hx-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px;text-align:center}
.hx-stat strong{display:block;font:600 clamp(2.4rem,5vw,3.6rem)/1 var(--hx-font-head);color:var(--hx-accent)}
.hx-stat span{font-size:.8rem;letter-spacing:.18em;text-transform:uppercase}

/* gallery */
.hx-masonry{columns:3 260px;column-gap:14px}
.hx-masonry a{display:block;margin:0 0 14px;break-inside:avoid;overflow:hidden;border-radius:var(--hx-radius);position:relative;cursor:zoom-in}
.hx-masonry img{width:100%;transition:transform .6s}.hx-masonry a:hover img{transform:scale(1.05)}
.hx-lb{position:fixed;inset:0;z-index:100;background:rgba(10,14,13,.94);display:none;align-items:center;justify-content:center}
.hx-lb.is-open{display:flex}
.hx-lb img{max-width:92vw;max-height:84vh;object-fit:contain}
.hx-lb figcaption{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#ddd;font-size:.9rem}
.hx-lb button{position:absolute;background:none;border:0;color:#fff;font-size:34px;cursor:pointer;padding:14px;line-height:1}
.hx-lb .x{top:6px;right:10px}.hx-lb .p{left:6px;top:50%}.hx-lb .n{right:6px;top:50%}

/* reviews */
.hx-reviews{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin}
.hx-review{flex:0 0 min(380px,86%);scroll-snap-align:start;background:var(--hx-surface);border:1px solid var(--hx-line);border-radius:var(--hx-radius);padding:28px}
.hx-review .stars{color:var(--hx-accent);letter-spacing:3px;margin-bottom:10px}
.hx-review blockquote{margin:0 0 18px;font-family:var(--hx-font-head);font-size:1.25rem;line-height:1.45}
.hx-review cite{font-style:normal;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--hx-muted)}

/* faq */
.hx-faq{max-width:820px;margin:0 auto}
.hx-faq details{background:var(--hx-surface);border:1px solid var(--hx-line);border-radius:var(--hx-radius);margin-bottom:12px}
.hx-faq summary{cursor:pointer;padding:18px 22px;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:12px}
.hx-faq summary::-webkit-details-marker{display:none}
.hx-faq summary::after{content:"+";color:var(--hx-accent);font-size:1.4rem;line-height:1}
.hx-faq details[open] summary::after{content:"–"}
.hx-faq .a{padding:0 22px 20px;color:var(--hx-muted)}

/* team / clients */
.hx-person{text-align:center}.hx-person img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--hx-radius);margin-bottom:14px}
.hx-person span{color:var(--hx-muted);font-size:.9rem}
.hx-logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px 48px}.hx-logos img{max-height:56px;width:auto;filter:grayscale(1);opacity:.7}

/* rooms filter bar */
.hx-filters{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;margin-bottom:32px}
.hx-tabs,.hx-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.hx-tabs a,.hx-chips button{display:inline-block;min-height:44px;padding:11px 18px;border:1px solid var(--hx-line);border-radius:999px;background:var(--hx-surface);font:400 .85rem var(--hx-font-body);cursor:pointer}
.hx-tabs .is-active a,.hx-chips button.is-on{background:var(--hx-dark);color:var(--hx-dark-ink);border-color:var(--hx-dark)}
.hx-select{min-height:44px;padding:9px 14px;border:1px solid var(--hx-line);border-radius:var(--hx-radius);background:var(--hx-surface);font:inherit}
.hx-empty{text-align:center;padding:60px 0;color:var(--hx-muted)}

/* room detail */
.hx-detail{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:44px;align-items:start}
@media(max-width:960px){.hx-detail{grid-template-columns:1fr}}
.hx-gal-main{position:relative;border-radius:var(--hx-radius);overflow:hidden;background:#e9e3d6;aspect-ratio:16/10;cursor:zoom-in}
.hx-gal-main img{width:100%;height:100%;object-fit:cover}
.hx-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:10px;margin-top:10px}
.hx-thumbs button{padding:0;border:2px solid transparent;border-radius:4px;overflow:hidden;cursor:pointer;background:none;aspect-ratio:4/3}
.hx-thumbs button.is-on{border-color:var(--hx-accent)}.hx-thumbs img{width:100%;height:100%;object-fit:cover}
.hx-side{position:sticky;top:calc(var(--hx-nav-h) + 20px);background:var(--hx-surface);border:1px solid var(--hx-line);border-radius:var(--hx-radius);padding:28px;box-shadow:var(--hx-shadow)}
.hx-side .hx-price strong{font-size:2.2rem}
.hx-side .hx-btn{margin-top:12px}
.hx-table{width:100%;border-collapse:collapse;margin:0 0 24px}
.hx-table th,.hx-table td{text-align:left;padding:12px 4px;border-bottom:1px solid var(--hx-line);vertical-align:top}
.hx-table th{width:38%;font-weight:500;color:var(--hx-muted)}
.hx-rates{list-style:none;margin:0 0 24px;padding:0}
.hx-rates li{display:flex;justify-content:space-between;gap:14px;padding:12px 16px;border:1px solid var(--hx-line);border-radius:var(--hx-radius);margin-bottom:8px;background:var(--hx-surface)}
.hx-rates strong{font-family:var(--hx-font-head);font-size:1.2rem;white-space:nowrap}

/* contact */
.hx-contact{display:grid;grid-template-columns:1fr 1.2fr;gap:48px}
@media(max-width:900px){.hx-contact{grid-template-columns:1fr}}
.hx-info{list-style:none;margin:0;padding:0}
.hx-info li{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--hx-line)}
.hx-info svg{flex:0 0 22px;width:22px;height:22px;color:var(--hx-accent);margin-top:3px}
.hx-info small{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hx-muted)}
.hx-form{background:var(--hx-surface);border:1px solid var(--hx-line);border-radius:var(--hx-radius);padding:30px}
.hx-form label{display:block;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--hx-muted);margin-bottom:6px}
.hx-form input,.hx-form textarea,.hx-form select{width:100%;padding:13px 14px;border:1px solid var(--hx-line);border-radius:var(--hx-radius);font:inherit;background:#fff;margin-bottom:16px}
.hx-form input:focus,.hx-form textarea:focus{outline:2px solid var(--hx-accent);outline-offset:0}
.hx-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:560px){.hx-form .row2{grid-template-columns:1fr}}
.hx-msg{margin-top:14px;padding:12px 16px;border-radius:var(--hx-radius);display:none}
.hx-msg.ok{display:block;background:#e7f4ea;color:#1d5a2a}.hx-msg.err{display:block;background:#fbeaea;color:#8a1f1f}
.hx-map{margin-top:48px;border-radius:var(--hx-radius);overflow:hidden;border:1px solid var(--hx-line)}
.hx-map iframe{display:block;width:100%;height:380px;border:0}

/* CTA band */
.hx-cta{text-align:center;background:linear-gradient(rgba(20,33,31,.86),rgba(20,33,31,.86)) ,var(--hx-dark);color:#fff}
.hx-cta h2{color:#fff}.hx-cta .hx-btn{margin:6px}

/* footer */
.hx-footer{background:var(--hx-dark);color:rgba(244,239,230,.8);padding:72px 0 0;font-size:.95rem}
.hx-foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px}
@media(max-width:900px){.hx-foot-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.hx-foot-grid{grid-template-columns:1fr}}
.hx-footer h4{color:#fff;font-size:1.25rem;margin-bottom:16px}
.hx-footer ul{list-style:none;margin:0;padding:0}.hx-footer li{margin-bottom:8px}
.hx-footer a:hover{color:var(--hx-accent)}
.hx-social{display:flex;gap:10px;margin-top:16px}
.hx-social a{width:38px;height:38px;border:1px solid rgba(255,255,255,.25);border-radius:50%;display:grid;place-items:center}.hx-social svg{width:17px;height:17px}
.hx-copy{margin-top:56px;border-top:1px solid rgba(255,255,255,.12);padding:22px 0;font-size:.82rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}

/* mobile sticky action bar */
.hx-sticky{display:none}
@media(max-width:767px){
  .hx-sticky{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--hx-dark);box-shadow:0 -4px 20px rgba(0,0,0,.2)}
  .hx-sticky a{padding:14px 6px;text-align:center;color:#fff;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}
  .hx-sticky a:first-child{background:var(--hx-accent)}
  body.hx{padding-bottom:50px}
}
.hx-404{text-align:center;padding:calc(var(--hx-nav-h) + 90px) 0 90px}
.hx-404 h1{font-size:clamp(4rem,14vw,8rem);color:var(--hx-accent);margin:0}
.hx-js .hx-reveal{opacity:0;transform:translateY(22px);transition:.8s}.hx-js .hx-reveal.is-in{opacity:1;transform:none}
@media(max-width:767px){.hx-btn{min-height:46px}.hx-form input,.hx-form textarea{font-size:16px}}
@media(prefers-reduced-motion:reduce){.hx-js .hx-reveal{opacity:1;transform:none;transition:none}.hx-slide{transition:none}html{scroll-behavior:auto}}