:root{--ink:#242118;--cream:#faf7ef;--muted:#5f5748;--gold:#e4bc6a;--night:#171510;--line:#ded6c6;--serif:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:1.0625rem/1.65 system-ui,sans-serif}a{color:inherit}img,video{display:block;max-width:100%;height:auto}a:focus-visible,summary:focus-visible,video:focus-visible{outline:3px solid #a46c23;outline-offset:5px}h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.08;margin:0 0 .6em;text-wrap:balance}h1{font-size:clamp(2.7rem,6vw,5.6rem);letter-spacing:-.04em}h2{font-size:clamp(2rem,4vw,3.7rem);letter-spacing:-.035em}h3{font-size:1.65rem}p{margin:0 0 1.15rem}p:last-child{margin-bottom:0}.wrap{width:min(1152px,calc(100% - 3rem));margin-inline:auto}.narrow{max-width:740px}.skip{position:absolute;left:1rem;top:-8rem;z-index:3;background:white;color:#000;padding:.7rem}.skip:focus{top:1rem}.header,.footer,.hero,.reserve{background:var(--night);color:var(--cream)}.header{border-bottom:1px solid #41392b}.topbar{display:flex;align-items:center;gap:2rem;justify-content:space-between;min-height:90px;padding-block:.65rem}.brand{display:inline-flex;align-items:center;flex:none}.brand img{width:76px;height:auto}.nav,.actions,.foot-links{display:flex;align-items:center;flex-wrap:wrap;gap:.65rem 1.35rem}.nav a,.foot-links a{font-size:.92rem;text-decoration:none}.nav a:hover,.nav a[aria-current=page],.foot-links a:hover{color:var(--gold);text-decoration:underline;text-underline-offset:.35em}.button{display:inline-flex;align-items:center;justify-content:center;padding:.76rem 1.12rem;min-height:48px;border:1px solid var(--gold);background:var(--gold);color:#21190a;text-decoration:none;font-weight:700;font-size:.92rem;line-height:1.3}.button:hover{background:#f4d18c;color:#20170c}.button.ghost{background:transparent;color:inherit;border-color:currentColor}.button.ghost:hover{background:#ffffff18}.header-cta{white-space:nowrap}.hero{display:grid;grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);align-items:stretch}.hero-copy{padding:clamp(2.5rem,7vw,6.8rem) clamp(1.5rem,5vw,5rem) clamp(2.5rem,7vw,6.8rem) max(1.5rem,calc((100vw - 1152px)/2))}.hero-copy p:not(.eyebrow){max-width:33rem;color:#e8dfcf;font-size:1.12rem}.hero-media{min-height:420px;position:relative;overflow:hidden}.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% center}.eyebrow{font-size:.76rem;font-weight:750;text-transform:uppercase;letter-spacing:.18em;color:#74551f;margin:0 0 1.05rem}.hero .eyebrow,.reserve .eyebrow,.footer .eyebrow{color:var(--gold)}.intro{padding:clamp(3.2rem,8vw,6rem) 0 2.4rem}.intro h1{font-size:clamp(2.6rem,6vw,4.9rem)}.section{padding:clamp(2.8rem,7vw,5.4rem) 0}.section.tight{padding-top:1rem}.shade{background:#f8f6f2}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.35rem}.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.4rem,5vw,4.3rem);align-items:center}.card{border:1px solid var(--line);background:#fffdf6}.card picture img{width:100%;aspect-ratio:4/3;object-fit:cover}.card .text{padding:1.45rem}.card p,.muted{color:var(--muted)}.text-link{font-weight:700;text-underline-offset:.26em}.feature{margin:0}.feature img{width:100%;aspect-ratio:4/3;object-fit:cover}.feature.portrait img{aspect-ratio:4/5;object-position:center}.feature figcaption{font-size:.85rem;color:var(--muted);margin-top:.55rem}.video-box{background:#111;width:100%;aspect-ratio:16/9;object-fit:contain}.facts{display:flex;gap:1rem 2rem;flex-wrap:wrap;padding:1rem 0;margin:0;list-style:none;font-size:.95rem;font-weight:600}.facts li{border-left:2px solid #a78037;padding-left:.7rem}.reserve p:not(.eyebrow){color:#e8dfcf}.footer{border-top:1px solid #41392b;padding:2rem 0 5.2rem}.footer-grid{display:flex;justify-content:space-between;gap:1.5rem;align-items:flex-start;flex-wrap:wrap}.footer p,.footer address{font-size:.92rem;color:#e8dfcf;font-style:normal}.footer .brand{margin-bottom:.65rem}.footer a{overflow-wrap:anywhere}.faq{margin-top:1.5rem}.faq details{border-top:1px solid var(--line);padding:1rem 0}.faq details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;font-weight:700;min-height:32px}summary+p{padding-top:.5rem;color:var(--muted)}.mobile-cta{display:none}.stack>*+*{margin-top:1.2rem}.spot{border-top:1px solid var(--line);padding-top:1.2rem}.spot p{color:var(--muted)}
@media(max-width:850px){.topbar{gap:.65rem 1.5rem;flex-wrap:wrap}.nav{order:3;width:100%;padding:.55rem 0;gap:.65rem 1.15rem}.hero{grid-template-columns:1fr 1fr}.hero-media{min-height:350px}.hero-copy{padding-right:1.5rem}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.wrap{width:calc(100% - 2rem)}.hero,.grid,.split{grid-template-columns:1fr}.hero-copy{padding:2.7rem 1rem 2rem}.hero-media{min-height:0;aspect-ratio:4/3}.hero-media img{object-position:center}.header-cta{display:none}.topbar{padding-block:.65rem .3rem}.nav{gap:.4rem 1rem}.nav a{padding:.23rem 0;font-size:.88rem}.brand img{width:62px}.actions{gap:.65rem}.mobile-cta{display:flex;position:fixed;inset:auto 0 0;z-index:2;justify-content:center;padding:.5rem 1rem max(.5rem,env(safe-area-inset-bottom));background:var(--night);border-top:1px solid #4b3b23}.mobile-cta .button{width:min(100%,460px);min-height:42px}.footer{padding-bottom:6rem}}

/* Aurelia's visual identity */
:root {
  --ink: #292218;
  --cream: #f8f3e9;
  --muted: #65594a;
  --gold: #e4bf76;
  --night: #211b15;
  --line: #d9cbb6;
}
.wrap { width: min(1192px, calc(100% - 7rem)); }
.header { background: #211b15; border-color: #4d3e2e; }
.topbar { min-height: 94px; padding-block: .75rem; }
.brand img { width: 70px; }
.nav { gap: clamp(1.2rem, 2.7vw, 2.6rem); }
.nav a { color: #f5ead8; font-size: .86rem; letter-spacing: .04em; }
.nav a[aria-current=page] { color: var(--gold); text-underline-offset: .6em; }
.header-cta .button { color: #f5dfad; background: transparent; border-color: #8f7449; }
.header-cta .button:hover { color: var(--night); background: var(--gold); }
.button { border-radius: 2px; padding-inline: 1.25rem; }
.eyebrow { display: flex; gap: .72rem; align-items: center; }
.eyebrow span, .hero-media figcaption span { width: 26px; height: 1px; background: currentColor; flex: none; }
.hero {
  grid-template-columns: minmax(0, 47fr) minmax(0, 53fr);
  background: #2a2118;
  color: #fff7e7;
}
.hero-copy {
  display: flex;
  align-items: center;
  padding: clamp(3rem, 7vw, 7rem) clamp(2rem, 4.5vw, 5rem) clamp(3rem, 7vw, 7rem)
    max(3.5rem, calc((100vw - 1192px)/2));
}
.hero-inner { max-width: 530px; }
.hero .eyebrow { color: #f2ce86; margin-bottom: 1.5rem; }
.hero h1 { font-size: clamp(3.3rem, 5.65vw, 6rem); text-wrap: initial; margin-bottom: .35em; letter-spacing: -.053em; }
.hero h1 em { display: block; color: #edcb8b; font-weight: inherit; }
.hero-copy .hero-description { max-width: 365px; color: #f1e3ce; margin-bottom: 1.75rem; font-size: 1rem; line-height: 1.75; }
.hero .actions { gap: .8rem 1.35rem; }
.hero-link { color: #fff2d9; text-decoration-color: #ab9163; text-underline-offset: .32em; font-size: .88rem; font-weight: 650; white-space: nowrap; }
.hero-link:hover { color: var(--gold); }
.hero-link span { margin-left: .18rem; }
.hero-media { margin: 0; min-height: clamp(470px, 42vw, 630px); }
.hero-media img { object-position: 52% 54%; }
.hero-media figcaption { position: absolute; right: 1.5rem; bottom: 1.45rem; padding: .55rem .75rem; display: flex; align-items: center; gap: .55rem; background: #231b15e8; color: #fff0d3; font-size: .68rem; text-transform: uppercase; letter-spacing: .12em; }
.hero-media figcaption span { width: 15px; color: var(--gold); }
.arrival-strip { background: #ede3d1; border-bottom: 1px solid #ded1ba; }
.arrival-inner, .arrival-inner p { display: flex; align-items: center; gap: .8rem 1.25rem; }
.arrival-inner { justify-content: space-between; min-height: 63px; flex-wrap: wrap; padding-block: .55rem; }
.arrival-inner p { margin: 0; flex-wrap: wrap; color: #514535; font-size: .78rem; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; }
.arrival-inner p span { width: 4px; height: 4px; background: #98713e; transform: rotate(45deg); }
.arrival-inner .text-link { font-size: .82rem; }
.welcome { padding-top: clamp(3.2rem, 7vw, 6rem); }
.welcome-intro { max-width: 720px; margin: 0 auto clamp(2.7rem, 6vw, 5rem); text-align: center; }
.welcome-intro .eyebrow, .reviews .eyebrow { justify-content: center; }
.welcome-intro p:last-child { max-width: 490px; margin-inline: auto; color: var(--muted); }
.editorial { display: grid; grid-template-columns: 1.25fr .85fr; align-items: center; gap: clamp(2.5rem, 8vw, 8rem); }
.editorial .feature img { aspect-ratio: 1.35; }
.editorial-copy { max-width: 440px; }
.editorial-copy p:not(.eyebrow) { color: var(--muted); }
.editorial-copy .text-link { display: inline-block; margin-top: .3rem; }
.neighbourhood { background: #eae0cd; }
.neighbourhood-feature { grid-template-columns: 1fr 1.05fr; }
.neighbourhood-feature .feature img { aspect-ratio: 1.2; object-position: center 42%; }
.story { background: #30261e; color: #fcf0da; }
.story .eyebrow, .story .text-link { color: #e9c581; }
.story .editorial-copy p:not(.eyebrow) { color: #e9dcc7; }
.reviews { text-align: center; }
.reviews .actions { justify-content: center; }
.reserve { background: #2c231a; }
.footer { background: #211b15; }
@media(max-width: 920px) {
  .wrap { width: calc(100% - 4rem); }
  .hero-copy { padding-left: 2rem; padding-right: 1.75rem; }
  .hero h1 { font-size: clamp(3rem, 6.15vw, 4.8rem); }
  .hero-media { min-height: 440px; }
  .editorial { gap: 2.3rem; }
}
@media(max-width: 850px) {
  .nav { gap: .5rem 1.5rem; }
  .topbar { min-height: auto; }
}
@media(max-width: 620px) {
  .wrap { width: calc(100% - 2.5rem); }
  .topbar { justify-content: center; gap: .15rem; padding-block: .7rem .4rem; }
  .brand img { width: 55px; }
  .nav { justify-content: center; gap: .2rem 1rem; }
  .nav a { font-size: .76rem; }
  .hero { display: flex; flex-direction: column-reverse; }
  .hero-media { min-height: 0; aspect-ratio: 1.36; }
  .hero-media img { object-position: 51% 45%; }
  .hero-media figcaption { bottom: .65rem; right: .7rem; font-size: .58rem; }
  .hero-copy { padding: 2rem 1.25rem 2.2rem; }
  .hero h1 { font-size: clamp(2.85rem, 11vw, 4rem); }
  .hero .actions .button { display: none; }
  .hero .eyebrow { margin-bottom: 1rem; }
  .hero-copy .hero-description { font-size: .95rem; margin-bottom: 1.25rem; }
  .arrival-inner { justify-content: center; padding-block: .95rem; gap: .4rem; }
  .arrival-inner p { gap: .45rem .6rem; justify-content: center; font-size: .65rem; }
  .arrival-inner .text-link { font-size: .72rem; }
  .editorial, .neighbourhood-feature { grid-template-columns: 1fr; gap: 1.5rem; }
  .neighbourhood-feature .feature { grid-row: 1; }
  .desktop-break { display: none; }
}
.reserve .actions {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  align-items: center;
  gap: .85rem 1.2rem;
}
.reserve .actions .text-link { font-size: .9rem; }
@media(max-width: 360px) {
  .reserve .actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
  .reserve .actions .button { padding-inline: .45rem; }
}

/* A centred first impression and a single-page hotel story. */
.hero-centred {
  display: grid;
  grid-template-columns: 1fr;
  min-height: clamp(510px, 46vw, 670px);
  isolation: isolate;
}
.hero-centred .hero-media, .hero-centred .hero-copy { grid-area: 1 / 1; }
.hero-centred .hero-media { min-height: 0; aspect-ratio: auto; z-index: -2; }
.hero-centred .hero-media img { object-position: center 54%; }
.hero-centred::before {
  content: "";
  grid-area: 1 / 1;
  z-index: -1;
  background: radial-gradient(ellipse at center, #221710df 8%, #21170eb8 45%, #21180f5c 100%);
}
.hero-centred .hero-copy {
  justify-content: center;
  text-align: center;
  padding: 3.8rem 1.25rem;
}
.hero-centred .hero-inner { width: min(100%, 780px); max-width: none; }
.hero-centred .eyebrow, .hero-centred .actions { justify-content: center; }
.hero-centred h1 {
  margin: 0 0 .35em;
  font-size: clamp(3.2rem, 7vw, 6.5rem);
  line-height: 1.03;
}
.hero-centred h1 em { display: inline; }
.hero-centred .hero-description { max-width: 470px; margin: 0 auto 1.65rem; }
.hero-centred .hero-link { padding: .6rem .25rem; }
.hotel-story { grid-template-columns: 1.12fr .88fr; }
.hotel-story .feature img { aspect-ratio: 1.55; }
.room-section { margin-top: clamp(2.75rem, 6vw, 5.75rem); padding-top: 2.5rem; border-top: 1px solid var(--line); }
.room-intro, .room-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 3.5rem); }
.room-intro { align-items: center; }
.room-intro h2 { margin-bottom: .5em; }
.room-intro > p { max-width: 380px; color: var(--muted); }
.room-gallery { gap: clamp(.9rem, 2vw, 1.8rem); margin-top: 1.2rem; }
.room-gallery .feature img { aspect-ratio: 1.48; }
.film-section { background: #30261e; color: #fcf0da; }
.film-section .eyebrow { color: #edcb8b; }
.practical .split { align-items: start; }
.existing { margin-top: 2rem; }
#stay, #rooms, #booking, #hotel-address, #payments { scroll-margin-top: 1rem; }
@media(max-width: 620px) {
  .hero-centred { min-height: 515px; }
  .hero-centred .hero-media img { object-position: center 51%; }
  .hero-centred::before { background: linear-gradient(#241a1260, #21170ddf 72%, #21170dec); }
  .hero-centred .hero-copy { align-items: end; padding: 3.2rem 1.25rem 2.6rem; }
  .hero-centred h1 { font-size: clamp(3.05rem, 13vw, 4.1rem); }
  .hero-centred h1 em { display: block; }
  .hero-centred .hero-description { max-width: 315px; margin-bottom: .7rem; }
  .hotel-story, .room-intro { grid-template-columns: 1fr; gap: .95rem; }
  .room-gallery { gap: .65rem; }
  .room-gallery .feature img { aspect-ratio: 1.18; }
  .room-gallery figcaption { font-size: .74rem; line-height: 1.35; }
}
.breakfast-note {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 1rem 2rem;
  margin-top: clamp(1.65rem, 4vw, 3.2rem);
  padding: clamp(1.2rem, 3vw, 2rem);
  background: #efe6d5;
}
.breakfast-note h3, .breakfast-note > p { margin: 0; }
.breakfast-note > p { color: var(--muted); }
.breakfast-note .eyebrow { margin-bottom: .6rem; }
@media(max-width: 620px) {
  .breakfast-note { grid-template-columns: 1fr; }
}
@media(max-width: 620px) {
  .reserve .split { grid-template-columns: minmax(0, 1fr); }
  .reserve .actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
  .reserve .actions .button { padding-inline: .55rem; }
}

/* Ivory, antique gold and warm timber for the hotel homepage. */
:root { --cream: #fffefa; --ink: #30291f; --gold: #e7c581; }
.header { background: #2b231c; }
.topbar { display: grid; grid-template-columns: 1fr auto 1fr; min-height: 82px; }
.topbar .brand { justify-self: start; }
.topbar .header-cta { justify-self: end; }
.header-cta .button { min-height: 42px; }
.room-led { display: block; background: var(--cream); color: var(--ink); }
.room-led .hero-copy { justify-content: center; padding: clamp(2.75rem, 5vw, 4.4rem) 0 2.15rem; text-align: center; }
.room-led .hero-inner { max-width: 840px; }
.room-led .eyebrow { justify-content: center; color: #74551f; margin-bottom: 1.1rem; }
.room-led .eyebrow span { width: 1.8rem; opacity: .65; }
.room-led h1 { font-size: clamp(3.2rem, 6.55vw, 6.1rem); line-height: 1; margin: 0 0 .26em; }
.room-led h1 em { display: inline; color: #805624; }
.room-led .hero-copy .hero-description { max-width: 510px; margin: 0 auto 1.25rem; color: var(--muted); }
.room-led .actions { justify-content: center; }
.room-led .button { color: #fff6e5; background: #483428; border-color: #483428; }
.room-led .button:hover { background: #644633; }
.room-led .hero-link { color: #563d27; }
.room-led .hero-media { min-height: 0; aspect-ratio: 2.15; }
.room-led .hero-media img { object-position: center 48%; }
.room-led .hero-media figcaption { left: 1.15rem; right: auto; bottom: 1.15rem; background: #281e17e8; }
.room-led .hero-media figcaption span { width: 14px; }
.arrival-strip { background: transparent; border-bottom: 0; }
.arrival-inner { border-bottom: 1px solid var(--line); }
.welcome { padding-top: clamp(2.65rem, 5.5vw, 4.75rem); }
.welcome-intro { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.room-section { border-top: 0; padding-top: 0; margin-top: 0; }
.room-gallery { margin-top: 1.4rem; }
.room-gallery .feature img { aspect-ratio: 1.57; }
.hotel-story { margin-top: clamp(3rem, 7vw, 6rem); }
.hotel-story .feature img { aspect-ratio: 1.55; }
.breakfast-note { background: #f8f3e9; }
.arrival-details { align-items: start; }
.arrival-details .feature img { aspect-ratio: 4/3; }
@media(max-width: 850px) {
  .topbar { display: flex; }
}
@media(max-width: 620px) {
  .topbar { min-height: auto; }
  .room-led .hero-copy { padding: 2.45rem 0 1.45rem; }
  .room-led .eyebrow { font-size: .63rem; gap: .45rem; }
  .room-led .eyebrow span { width: 14px; }
  .room-led h1 { font-size: clamp(2.8rem, 12.4vw, 4.2rem); }
  .room-led h1 em { display: block; }
  .room-led .hero-copy .hero-description { font-size: .93rem; margin-bottom: .55rem; }
  .room-led .hero-media { aspect-ratio: 1.4; }
  .room-led .hero-media img { object-position: center; }
  .room-led .hero-media figcaption { bottom: .55rem; left: .55rem; padding: .4rem .5rem; font-size: .54rem; }
  .room-gallery .feature img { aspect-ratio: 1.18; }
}

/* Three stops, with the waterfront as the visual introduction. */
.walk-guide { padding: .4rem 0 clamp(3rem, 6vw, 5.25rem); }
.walk-banner { position: relative; margin: 0; }
.walk-banner img { width: 100%; aspect-ratio: 2.8; object-fit: cover; object-position: center 58%; }
.walk-banner figcaption { position: absolute; bottom: 1rem; left: 1rem; padding: .4rem .7rem; color: #fff6e5; background: #2b231ce8; font-size: .72rem; }
.walk-heading { display: grid; grid-template-columns: 1.3fr .7fr; gap: 2rem; align-items: end; margin: clamp(2.35rem, 5vw, 4.25rem) 0 1.8rem; }
.walk-heading h2 { margin-bottom: 0; }
.walk-heading > p { color: var(--muted); max-width: 310px; }
.walk-stops { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(.85rem, 2.25vw, 1.9rem); }
.walk-stops li { border: 1px solid #e4ded2; background: #fffefa; }
.walk-stops li > img { width: 100%; aspect-ratio: 1.72; object-fit: cover; }
.walk-stops .darajani-photo { object-position: center 58%; }
.walk-stop-copy { padding: 1.2rem clamp(.9rem, 1.9vw, 1.5rem) 1.35rem; }
.walk-stop-copy .eyebrow { font-size: .66rem; letter-spacing: .11em; margin-bottom: .7rem; }
.walk-stop-copy p:not(.eyebrow) { color: var(--muted); font-size: .93rem; }
.walk-stop-copy .text-link { font-size: .86rem; }
@media(max-width: 680px) {
  .walk-banner img { aspect-ratio: 1.52; }
  .walk-heading { grid-template-columns: 1fr; gap: .75rem; }
  .walk-heading br { display: none; }
  .walk-stops { grid-template-columns: 1fr; }
}

/* Homepage contact details and quick booking links. */
.contact-strip { background: #f8f6f2; border-bottom: 1px solid #e7dfd2; }
.contact-strip-inner, .contact-actions { display: flex; align-items: center; }
.contact-strip-inner { justify-content: space-between; gap: .5rem 1rem; padding-block: .3rem; }
.contact-actions { gap: .25rem; flex-wrap: wrap; }
.contact-strip a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42rem;
  min-height: 44px;
  color: #433224;
  font-size: .82rem;
  font-weight: 650;
  text-decoration: none;
}
.contact-strip a:hover { color: #815621; text-decoration: underline; text-underline-offset: .23em; }
.contact-strip svg { flex: none; }
.contact-call { white-space: nowrap; padding-inline: .5rem; }
.contact-social { min-width: 44px; }
.contact-strip .contact-whatsapp {
  margin-left: .25rem;
  padding-inline: .8rem;
  background: #483428;
  border-radius: 4px;
  color: #fff6e5;
  white-space: nowrap;
}
.contact-strip .contact-whatsapp:hover { background: #644633; color: #fff6e5; }
@media(max-width: 680px) {
  .contact-strip-inner { flex-direction: column; gap: 0; padding-block: .2rem .45rem; }
  .contact-actions { justify-content: center; gap: .05rem; }
  .contact-strip a { font-size: .74rem; }
  .contact-location { text-align: center; }
  .contact-call { padding-inline: .2rem; }
  .contact-strip .contact-whatsapp { padding-inline: .45rem; margin-left: .1rem; }
  .contact-book-label { display: none; }
}
