:root{
--ink:#090908;
--ink2:#15130f;
--paper:#f7f4ed;
--paper2:#ece5d8;
--gold:#b79655;
--gold2:#d3b875;
--muted:#716b60;
--white-muted:rgba(255,255,255,.67);
--max:1240px;
--radius:28px;
--shadow:0 30px 90px rgba(0,0,0,.16)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
margin:0;
background:var(--paper);
color:var(--ink);
font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
-webkit-font-smoothing:antialiased
}
a{color:inherit}
button,input,select{font:inherit}
.skip{position:absolute;left:-9999px}
.skip:focus{
left:20px;top:20px;z-index:9999;
background:#fff;padding:12px 18px
}
.shell{
width:min(calc(100% - 40px),var(--max));
margin-inline:auto
}
.site-header{
position:absolute;
inset:0 0 auto;
z-index:20;
padding:24px 0;
color:#fff
}
.nav{
display:flex;
align-items:center;
justify-content:space-between;
gap:28px
}
.brand{
display:flex;
align-items:center;
gap:12px;
text-decoration:none
}
.brand-mark{
width:46px;height:46px;
border:1px solid rgba(255,255,255,.48);
border-radius:50%;
display:grid;
place-items:center;
font-size:12px;
font-weight:800;
letter-spacing:.08em
}
.brand-copy{display:flex;flex-direction:column}
.brand-copy strong{
font-size:17px;
letter-spacing:.13em;
text-transform:uppercase
}
.brand-copy small{
margin-top:6px;
font-size:9px;
letter-spacing:.15em;
text-transform:uppercase;
opacity:.58
}
.nav-links{
display:flex;
align-items:center;
gap:29px
}
.nav-links a{
font-size:13px;
letter-spacing:.04em;
text-decoration:none
}
.nav-cta{
padding:12px 19px;
border:1px solid rgba(255,255,255,.5);
border-radius:999px
}
.mobile-menu{display:none}
.hero{
min-height:820px;
position:relative;
display:flex;
align-items:center;
overflow:hidden;
color:#fff;
background:
radial-gradient(circle at 82% 18%,rgba(183,150,85,.22),transparent 30%),
radial-gradient(circle at 18% 73%,rgba(255,255,255,.05),transparent 27%),
linear-gradient(135deg,#070706,#17140f 55%,#050504)
}
.hero:before{
content:"";
position:absolute;
inset:0;
opacity:.13;
background-image:
linear-gradient(rgba(255,255,255,.1) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.1) 1px,transparent 1px);
background-size:78px 78px
}
.hero-inner{
position:relative;
z-index:2;
width:100%;
padding:150px 0 135px
}
.kicker{
color:var(--gold2);
font-size:12px;
font-weight:800;
letter-spacing:.24em;
text-transform:uppercase
}
.hero h1{
max-width:980px;
margin:24px 0 28px;
font-family:Georgia,"Times New Roman",serif;
font-size:clamp(58px,8vw,116px);
font-weight:400;
line-height:.91;
letter-spacing:-.055em
}
.hero h1 em{
color:var(--gold2);
font-weight:400
}
.hero-copy{
max-width:650px;
color:var(--white-muted);
font-size:18px;
line-height:1.8
}
.booking-shell{
position:relative;
z-index:5;
margin-top:-64px
}
.booking-panel{
background:#fff;
border-radius:24px;
padding:18px;
box-shadow:var(--shadow);
display:grid;
grid-template-columns:1.5fr 1fr 1fr .9fr auto;
gap:10px;
align-items:end
}
.field{padding:4px 12px}
.field label{
display:block;
margin-bottom:8px;
font-size:10px;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
color:#8c8270
}
.field input,.field select{
width:100%;
border:0;
outline:0;
background:transparent;
padding:5px 0 9px
}
.book-button{
border:0;
border-radius:18px;
min-height:64px;
padding:0 27px;
background:var(--ink);
color:#fff;
font-weight:800;
cursor:pointer
}
.booking-note{
grid-column:1/-1;
margin:0;
padding:3px 12px 0;
font-size:12px;
color:#897f70
}
.section{padding:112px 0}
.section.dark{background:var(--ink);color:#fff}
.section-head{
display:flex;
align-items:end;
justify-content:space-between;
gap:40px;
margin-bottom:50px
}
.section-head h2{
max-width:730px;
margin:12px 0 0;
font-family:Georgia,serif;
font-size:clamp(42px,6vw,72px);
font-weight:400;
line-height:1;
letter-spacing:-.045em
}
.section-head p{
max-width:420px;
line-height:1.75;
color:var(--muted)
}
.dark .section-head p{color:var(--white-muted)}
.hotel-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:22px
}
.hotel-card{
position:relative;
min-height:380px;
padding:30px;
border-radius:var(--radius);
overflow:hidden;
display:flex;
align-items:end;
color:#fff;
background:
radial-gradient(circle at 80% 20%,rgba(184,151,85,.28),transparent 31%),
linear-gradient(145deg,#211f19,#090908)
}
.hotel-card:after{
content:"";
position:absolute;
inset:0;
border:1px solid rgba(255,255,255,.09);
border-radius:inherit
}
.hotel-number{
position:absolute;
top:27px;
right:28px;
font-size:12px;
letter-spacing:.16em;
opacity:.42
}
.hotel-card h3{
position:relative;
z-index:1;
margin:0 0 10px;
font-family:Georgia,serif;
font-size:30px;
font-weight:400
}
.hotel-card p{
position:relative;
z-index:1;
margin:0;
color:var(--white-muted);
line-height:1.6
}
.location-grid{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:1px;
background:#292824
}
.location-item{
background:#121210;
padding:36px 24px;
min-height:150px
}
.location-item span{
display:block;
margin-bottom:23px;
color:var(--gold2);
font-size:10px;
font-weight:800;
letter-spacing:.14em;
text-transform:uppercase
}
.location-item strong{
font-family:Georgia,serif;
font-size:25px;
font-weight:400
}
.experience{
display:grid;
grid-template-columns:1fr 1fr;
min-height:620px;
overflow:hidden;
border-radius:36px;
background:#151410
}
.experience-visual{
min-height:500px;
position:relative;
background:
radial-gradient(circle at 30% 30%,rgba(210,184,122,.35),transparent 25%),
linear-gradient(145deg,#373021,#090908)
}
.experience-visual:before,
.experience-visual:after{
content:"";
position:absolute;
border-radius:50%;
border:1px solid rgba(255,255,255,.2)
}
.experience-visual:before{
width:310px;height:310px;top:15%;left:17%
}
.experience-visual:after{
width:180px;height:180px;top:34%;left:35%
}
.experience-copy{
padding:clamp(42px,7vw,90px);
color:#fff;
display:flex;
flex-direction:column;
justify-content:center
}
.experience-copy h2{
margin:18px 0 24px;
font-family:Georgia,serif;
font-size:clamp(44px,6vw,74px);
font-weight:400;
line-height:.98
}
.experience-copy p{
max-width:520px;
line-height:1.8;
color:var(--white-muted)
}
.text-link{
margin-top:25px;
color:var(--gold2);
text-decoration:none;
font-weight:800
}
.promise-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:22px
}
.promise{
padding:32px;
border:1px solid #ded6c8;
border-radius:24px
}
.promise-number{
margin-bottom:50px;
font-size:12px;
font-weight:800;
color:var(--gold)
}
.promise h3{
font-family:Georgia,serif;
font-size:29px;
font-weight:400
}
.promise p{line-height:1.7;color:var(--muted)}
.site-footer{
padding:80px 0 32px;
background:#070706;
color:#fff
}
.footer-grid{
display:grid;
grid-template-columns:1.7fr 1fr 1fr;
gap:50px
}
.footer-brand h2{
margin:0 0 20px;
font-family:Georgia,serif;
font-size:50px;
font-weight:400
}
.footer-brand p{
max-width:460px;
line-height:1.7;
color:var(--white-muted)
}
.footer-column strong{
display:block;
margin-bottom:20px;
color:var(--gold2);
font-size:11px;
letter-spacing:.15em;
text-transform:uppercase
}
.footer-column a,.footer-column span{
display:block;
margin:11px 0;
color:rgba(255,255,255,.7);
text-decoration:none
}
.footer-bottom{
margin-top:70px;
padding-top:24px;
border-top:1px solid rgba(255,255,255,.12);
display:flex;
justify-content:space-between;
gap:30px;
color:rgba(255,255,255,.42);
font-size:12px
}
@media(max-width:1000px){
.hotel-grid{grid-template-columns:repeat(2,1fr)}
.location-grid{grid-template-columns:repeat(3,1fr)}
.booking-panel{grid-template-columns:repeat(2,1fr)}
.book-button{grid-column:span 2}
}
@media(max-width:760px){
.shell{width:min(calc(100% - 28px),var(--max))}
.nav-links{display:none}
.mobile-menu{
display:block;
border:1px solid rgba(255,255,255,.35);
background:transparent;
color:#fff;
border-radius:999px;
padding:10px 14px
}
.hero{min-height:720px}
.hero-inner{padding-top:135px}
.hero h1{font-size:clamp(54px,17vw,82px)}
.booking-shell{margin-top:-45px}
.booking-panel{grid-template-columns:1fr;padding:16px}
.book-button{grid-column:auto}
.section{padding:82px 0}
.section-head{display:block}
.section-head p{margin-top:25px}
.hotel-grid{grid-template-columns:1fr}
.hotel-card{min-height:310px}
.location-grid{grid-template-columns:repeat(2,1fr)}
.experience{grid-template-columns:1fr}
.experience-visual{min-height:390px}
.promise-grid{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr}
.footer-bottom{display:block}
}
@media(max-width:460px){
.location-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
:focus-visible{
outline:3px solid var(--gold2);
outline-offset:4px
}

/* ==============================================================
   HRR Stage 3B/3C — Public Subpages
   ============================================================== */

.sub-header{
background:#090908;
color:#fff;
padding:22px 0;
position:relative;
z-index:20
}

.page-hero{
background:
radial-gradient(circle at 85% 18%,rgba(183,150,85,.2),transparent 28%),
linear-gradient(135deg,#090908,#1b1711);
color:#fff;
padding:94px 0 82px
}

.breadcrumbs{
display:flex;
gap:8px;
align-items:center;
flex-wrap:wrap;
margin-bottom:26px;
font-size:12px;
color:rgba(255,255,255,.5)
}

.breadcrumbs a{
color:rgba(255,255,255,.72);
text-decoration:none
}

.page-hero h1{
max-width:900px;
margin:14px 0 20px;
font-family:Georgia,serif;
font-size:clamp(50px,7vw,86px);
font-weight:400;
line-height:.96;
letter-spacing:-.05em
}

.page-hero p{
max-width:690px;
font-size:18px;
line-height:1.8;
color:rgba(255,255,255,.66)
}

.content-section{
padding:88px 0
}

.content-section.alt{
background:#eee8dc
}

.content-narrow{
max-width:820px
}

.content-narrow h2,
.editorial-grid h2{
font-family:Georgia,serif;
font-size:clamp(36px,5vw,58px);
font-weight:400;
line-height:1.05
}

.content-narrow p{
font-size:17px;
line-height:1.85;
color:#625d54
}

.editorial-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:start
}

.editorial-grid p{
line-height:1.8;
color:#686258
}

.listing-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:22px
}

.public-hotel-card{
padding:28px;
border-radius:26px;
background:#fff;
border:1px solid #e2dbcf;
min-height:290px;
display:flex;
flex-direction:column
}

.public-hotel-card .code{
color:#aa8950;
font-size:10px;
font-weight:800;
letter-spacing:.16em;
text-transform:uppercase
}

.public-hotel-card h2{
font-family:Georgia,serif;
font-size:30px;
font-weight:400;
margin:35px 0 12px
}

.public-hotel-card p{
color:#6e675c;
line-height:1.7
}

.card-bottom{
margin-top:auto;
padding-top:24px;
display:flex;
justify-content:space-between;
align-items:center;
gap:15px
}

.review-label{
font-size:11px;
text-transform:uppercase;
letter-spacing:.1em;
color:#948979
}

.card-link{
font-weight:800;
text-decoration:none
}

.location-cluster{
padding:30px;
border-radius:24px;
background:#fff;
border:1px solid #ded6c8
}

.location-cluster h2{
font-family:Georgia,serif;
font-size:34px;
font-weight:400;
margin-top:0
}

.location-cluster ul{
margin:22px 0 0;
padding:0;
list-style:none
}

.location-cluster li{
padding:12px 0;
border-top:1px solid #eee8df;
color:#625d55
}

.location-clusters{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:22px
}

.feature-band{
padding:70px 0;
background:#11100d;
color:#fff
}

.feature-band-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px
}

.feature-band article{
padding:28px;
border:1px solid rgba(255,255,255,.1);
border-radius:22px
}

.feature-band h3{
font-family:Georgia,serif;
font-size:28px;
font-weight:400
}

.feature-band p{
color:rgba(255,255,255,.6);
line-height:1.7
}

.cta-panel{
padding:55px;
border-radius:30px;
background:#14120e;
color:#fff
}

.cta-panel h2{
font-family:Georgia,serif;
font-size:clamp(38px,5vw,60px);
font-weight:400;
margin-top:0
}

.cta-panel p{
max-width:670px;
color:rgba(255,255,255,.65);
line-height:1.8
}

.cta-actions{
display:flex;
gap:14px;
flex-wrap:wrap;
margin-top:30px
}

.button-primary,
.button-secondary{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:50px;
padding:0 22px;
border-radius:999px;
text-decoration:none;
font-weight:800
}

.button-primary{
background:#c6a565;
color:#111
}

.button-secondary{
border:1px solid rgba(255,255,255,.3);
color:#fff
}

.property-detail{
display:grid;
grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);
gap:50px
}

.property-sidebar{
padding:28px;
border-radius:24px;
background:#fff;
border:1px solid #ded7cc
}

.property-sidebar strong{
display:block;
font-size:11px;
letter-spacing:.13em;
text-transform:uppercase;
color:#9b8458;
margin-bottom:9px
}

.property-sidebar div+div{
margin-top:22px
}

.room-list{
display:grid;
gap:16px;
margin-top:30px
}

.room-row{
padding:22px;
border:1px solid #ddd6ca;
border-radius:18px
}

.room-row h3{
margin:0;
font-family:Georgia,serif;
font-size:25px;
font-weight:400
}

.empty-note{
padding:22px;
background:#eee8dd;
border-radius:18px;
color:#6c665c
}

@media(max-width:1000px){
.listing-grid{grid-template-columns:repeat(2,1fr)}
.feature-band-grid{grid-template-columns:1fr}
}

@media(max-width:760px){
.editorial-grid,
.property-detail{
grid-template-columns:1fr
}
.listing-grid,
.location-clusters{
grid-template-columns:1fr
}
.page-hero{
padding:70px 0 62px
}
.cta-panel{
padding:34px 26px
}
}