@font-face {
  font-family: "DM Sans";
  src: url(dm-sans.woff2) format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: Playfair;
  src: url(playfair.woff2) format("woff2");
  font-weight: 500 600;
  font-display: swap;
}

@font-face {
  font-family: Playfair;
  src: url(playfair-italic.woff2) format("woff2");
  font-style: italic;
  font-weight: 500;
  font-display: swap;
}

:root {
  --paper: #f8f5ee;
  --white: #fffcf5;
  --ink: #222d23;
  --muted: #4d594b;
  --green: #243a2d;
  --forest: #1b3026;
  --rule: #dcd4c3;
  --gold: #78552d;
  --light-gold: #efcc9d;
  --serif: Playfair, Georgia, serif;
  --sans: "DM Sans", system-ui, sans-serif;
  --call-height: calc(4.15rem + env(safe-area-inset-bottom, 0px));
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-bottom: var(--call-height); }
body {
  margin: 0;
  padding-bottom: var(--call-height);
  background: var(--paper);
  color: var(--ink);
  font: 400 1rem/1.65 var(--sans);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; }
:focus-visible { outline: 3px solid #ad6b36; outline-offset: 3px; }
[id] { scroll-margin-top: 1rem; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 {
  font-family: var(--serif);
  font-weight: 500;
  line-height: 1.09;
  letter-spacing: -.035em;
  text-wrap: balance;
}
h2 { font-size: clamp(2rem, 6.3vw, 4.25rem); }
h3 { font-size: 1.65rem; }
.wrap { width: min(1240px, calc(100% - 2rem)); margin-inline: auto; }
.eyebrow {
  color: var(--gold);
  font-size: .71rem;
  font-weight: 700;
  letter-spacing: .15em;
  line-height: 1.5;
  text-transform: uppercase;
}
.skip {
  position: fixed;
  z-index: 10;
  top: .6rem;
  left: .6rem;
  transform: translateY(-180%);
  background: var(--white);
  padding: .7rem 1rem;
}
.skip:focus { transform: none; }

.header { position: relative; z-index: 2; }
.head-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  padding-block: .65rem;
}
.brand {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  justify-self: start;
  text-decoration: none;
}
.header .brand { width: min(100%, 14.875rem); }
.footer .brand { width: 9rem; }
.brand img { width: 100%; }
.mobile-menu summary {
  display: flex;
  align-items: center;
  gap: .45rem;
  min-height: 44px;
  padding: .4rem .65rem;
  border: 1px solid var(--rule);
  border-radius: 4px;
  font-size: .86rem;
  font-weight: 700;
  cursor: pointer;
}
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu nav {
  position: absolute;
  inset: 100% 0 auto;
  display: grid;
  padding: .35rem max(1rem, calc((100% - 640px) / 2)) .65rem;
  border-block: 1px solid var(--rule);
  background: var(--paper);
  box-shadow: 0 12px 18px #222d2326;
}
.mobile-menu:not([open]) nav, .desktop-nav, .header .head-action { display: none; }
.header nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  min-width: 44px;
  padding: .25rem .32rem;
  font-size: .82rem;
  font-weight: 650;
  text-align: center;
  text-decoration: none;
}
.mobile-menu nav a { justify-content: flex-start; padding-inline: .45rem; }
.mobile-menu nav a + a { border-top: 1px solid var(--rule); }
nav a:hover, nav a[aria-current], .text-link:hover {
  text-decoration: underline;
  text-underline-offset: .28em;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 49px;
  max-width: 100%;
  border: 1px solid transparent;
  border-radius: 4px;
  padding: .65rem 1rem;
  background: var(--green);
  color: var(--white);
  font-size: .88rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
}
.button:hover { background: #375342; }
.head-action { justify-self: end; min-height: 44px; padding-inline: .58rem; font-size: .77rem; }
.button-light { background: var(--white); color: var(--ink); }
.button-light:hover { background: #eee1cb; }
.button-ghost { border-color: #d7d5c4b0; background: #17291e62; }
.button-ghost:hover { background: #17291ebd; }
.arrow { font-size: 1.12rem; line-height: 1; }
.mobile-call {
  position: fixed;
  z-index: 5;
  inset: auto 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  min-height: var(--call-height);
  border-top: 1px solid #52695a;
  padding: .65rem max(1rem, env(safe-area-inset-right, 0px))
    calc(.65rem + env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left, 0px));
  background: var(--forest);
  color: var(--white);
  text-decoration: none;
}
.mobile-call span { font-size: .9rem; font-variant-numeric: tabular-nums; color: var(--light-gold); }
.mobile-call:focus-visible { outline-offset: -5px; }

.hero {
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: 475px;
  align-items: end;
  overflow: hidden;
  background: #283b31;
  color: var(--white);
}
.hero .cover, .hero::after { position: absolute; inset: 0; }
.hero .cover { z-index: -2; }
.hero .cover img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 49%; }
.hero::after {
  content: "";
  z-index: -1;
  background: linear-gradient(0deg, #101d17fa 5%, #12251be8 38%, #12251b5c 74%, #12251b0a 100%);
}
.hero-copy { padding-block: 4.6rem 3.5rem; }
.hero .eyebrow, .quote-panel .eyebrow { color: var(--light-gold); }
.hero h1 { max-width: 14ch; margin: .18em 0 .23em; font-size: clamp(2.7rem, 12vw, 5.5rem); }
.hero h1 em { font-weight: 500; color: #f2d4ac; }
.hero p:not(.eyebrow) { max-width: 33rem; color: #fff7e9; line-height: 1.54; }
.hero-actions, .inline-links { display: flex; align-items: center; gap: .45rem .75rem; flex-wrap: wrap; }
.hero-actions { margin-top: 1.1rem; }
.hero-actions .button { padding-inline: .7rem; }
.facts { border-bottom: 1px solid var(--rule); background: #f2eee3; }
.facts ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-block: 0;
  padding: .7rem 0;
  list-style: none;
  text-align: center;
}
.facts li { padding: .3rem .25rem; font-size: .72rem; font-weight: 650; line-height: 1.3; }
.facts li + li { border-left: 1px solid var(--rule); }

.section { padding-block: clamp(2.7rem, 7vw, 6.5rem); }
.section-head, .split, .detail-layout, .features { display: grid; gap: 1.3rem; }
.section-head { margin-bottom: 1.4rem; }
.section-head h2, .split h2, .detail h1, .plain-head h1, .closing h2 { margin-top: .18em; }
.section-head p:not(.eyebrow), .split p:not(.eyebrow), .detail-copy > p:not(.eyebrow),
.plain-head p:not(.eyebrow), .features p:not(.eyebrow) { color: var(--muted); max-width: 49ch; }
.split p:not(.eyebrow), .features p:not(.eyebrow) { margin: .8rem 0; }
.section-action { margin-top: .7rem; }
.grid, .notes, .guide-grid, .stay-steps { display: grid; gap: 1rem; }
.directory-grid, .guide-grid, .notes { margin-top: 1.45rem; }
.card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--rule);
  border-radius: 5px;
  overflow: hidden;
  background: var(--white);
  text-decoration: none;
}
.card:hover { border-color: #968b74; }
.card-image { overflow: hidden; background: #d7d7bf; }
.card img {
  width: 100%;
  aspect-ratio: 1.52;
  object-fit: cover;
  transition: transform .32s ease;
}
.card:hover img { transform: scale(1.03); }
.card-body { display: grid; gap: .35rem; align-content: start; flex: 1; padding: 1rem 1.12rem; }
.card-body > p:not(.eyebrow) { font-size: .96rem; color: var(--muted); }
.card-body .text-link { min-height: 0; padding-block: .25rem; }
.text-link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 44px;
  color: var(--green);
  font-size: .92rem;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: #9da490;
  text-underline-offset: .24em;
}
.split-bg { background: #ebe8d9; }
.split figure, .detail-layout figure { margin: 0; }
.split figure img, .detail-photo {
  width: 100%;
  aspect-ratio: 1.36;
  object-fit: cover;
  border-radius: 5px;
  background: #d7d7bf;
}
.quote-panel { background: var(--forest); color: var(--white); text-align: center; }
.quote-panel blockquote {
  max-width: 28ch;
  margin: .42em auto;
  color: #f7ead6;
  font: italic 500 clamp(1.8rem, 5vw, 3.3rem)/1.23 var(--serif);
}
.quote-panel cite { color: #dfdfd2; font-size: .84rem; font-style: normal; }
.quote-panel a { display: inline-flex; align-items: center; min-height: 44px; margin-top: .4rem; text-underline-offset: .25em; }
.closing { background: #eae5d5; text-align: center; }
.closing p:not(.eyebrow) { max-width: 42ch; margin: .8rem auto 1rem; color: var(--muted); }
.footer { padding-block: 1.5rem; }
.footer-inner, .footer-links { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem 1rem; }
.footer-inner { justify-content: space-between; }
.footer-links { font-size: .83rem; font-weight: 600; }
.footer-links a { display: inline-flex; align-items: center; min-height: 44px; text-underline-offset: .23em; }

.detail, .plain-head { border-top: 1px solid var(--rule); }
.detail { padding-block: 1.4rem 2.5rem; }
.back { margin-bottom: .5rem; }
.detail h1, .plain-head h1 { margin-bottom: .24em; font-size: clamp(2.55rem, 8.1vw, 5.8rem); }
.detail-copy .inline-links, .plain-head .inline-links, .plain-head .button { margin-top: 1rem; }
.detail-copy > p + p:not(.eyebrow) { margin-top: .65rem; }
.features h2, .gallery h2 { font-size: clamp(2rem, 4vw, 3.3rem); margin: .25em 0 .35em; }
.features ul { margin: 0; padding-left: 1.25rem; color: var(--muted); }
.features li + li { margin-top: .4rem; }
.related {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .6rem;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}
.related a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .35rem;
  min-height: 52px;
  padding: .55rem .65rem;
  border: 1px solid var(--rule);
  background: var(--white);
  color: var(--green);
  font-size: .92rem;
  font-weight: 700;
  text-decoration: none;
}
.related a:hover { text-decoration: underline; text-underline-offset: .25em; }
.gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .6rem; margin-top: 1rem; }
.gallery-link { display: block; overflow: hidden; border-radius: 4px; background: #d7d7bf; }
.gallery-link img { width: 100%; aspect-ratio: 1.35; object-fit: cover; transition: transform .25s; }
.gallery-link:hover img { transform: scale(1.035); }
dialog {
  width: min(54rem, calc(100% - 1.5rem));
  max-width: none;
  max-height: calc(100dvh - 1.5rem);
  border: 0;
  border-radius: 5px;
  padding: .65rem;
  background: var(--paper);
  color: var(--ink);
}
dialog::backdrop { background: #102017e8; }
dialog img { max-height: min(68dvh, 680px); width: auto; margin: auto; object-fit: contain; }
.dialog-bar, .dialog-controls { display: flex; align-items: center; justify-content: space-between; gap: .75rem; font-size: .86rem; }
.dialog-bar { justify-content: flex-end; padding-bottom: .55rem; }
.dialog-controls { justify-content: center; padding-top: .55rem; }
.dialog-bar button, .dialog-controls button {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: var(--white);
  color: var(--ink);
  cursor: pointer;
}
.faqs { max-width: 760px; margin-top: 1rem; }
.faqs details { border-bottom: 1px solid var(--rule); }
.faqs summary { min-height: 48px; padding: .8rem .15rem; font-weight: 700; cursor: pointer; }
.faqs p { margin: 0 0 .9rem; color: var(--muted); }
.stay-steps { counter-reset: step; list-style: none; padding: 0; margin: 1.25rem 0 0; }
.stay-steps li, .guide-card, .note { padding: 1.05rem; border: 1px solid var(--rule); background: var(--white); }
.stay-steps li { counter-increment: step; }
.stay-steps li::before {
  content: "0" counter(step);
  display: block;
  margin-bottom: .4rem;
  color: var(--gold);
  font-weight: 700;
  letter-spacing: .13em;
}
.stay-steps p, .guide-card p:not(.eyebrow) { color: var(--muted); margin-top: .55rem; }
.guide-card h3 { margin-top: .2rem; }
.note { display: flex; flex-direction: column; justify-content: space-between; gap: .85rem; margin: 0; }
.note blockquote { margin: 0; color: var(--green); font: italic 500 1.46rem/1.34 var(--serif); }
.note figcaption { color: var(--muted); font-size: .84rem; }
.note figcaption a { display: inline-flex; align-items: center; min-height: 44px; }

@media (min-width: 600px) {
  .wrap { width: min(1240px, calc(100% - 4rem)); }
  .hero-copy { padding-block: 4.6rem; }
  .facts li { font-size: .86rem; }
  .grid, .notes, .guide-grid, .stay-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-layout, .split { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: center; gap: 1.5rem; }
  .split { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 850px) {
  html { scroll-padding-bottom: 0; }
  body { padding-bottom: 0; }
  .mobile-call { display: none; }
  .wrap { width: min(1240px, calc(100% - 6rem)); }
  .head-inner { grid-template-columns: minmax(0, 1fr) auto minmax(8rem, .65fr); min-height: 96px; padding: 0; gap: 1rem; }
  .header .brand { width: min(100%, 16.875rem); }
  .mobile-menu { display: none; }
  .desktop-nav { display: flex; align-items: center; gap: clamp(.65rem, 1.9vw, 2rem); }
  .header .desktop-nav a { font-size: .9rem; }
  .header .head-action { display: inline-flex; padding-inline: .95rem; font-size: .88rem; }
  .hero { min-height: clamp(510px, 73svh, 710px); align-items: center; }
  .hero .cover img { object-position: center 48%; }
  .hero::after {
    background: linear-gradient(90deg, #101d17ed 0%, #14241ab8 35%, #17271d25 75%, #17271d12 100%),
      linear-gradient(0deg, #18271c86 0%, transparent 31%);
  }
  .hero h1 { font-size: clamp(4.6rem, 7vw, 7.05rem); }
  .hero p:not(.eyebrow) { font-size: 1.16rem; }
  .hero-actions { margin-top: 1.55rem; }
  .hero-actions .button { padding-inline: 1.15rem; }
  .section-head { grid-template-columns: 1.2fr 1fr; align-items: end; gap: 2rem; }
  .grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .card { grid-column: span 2; }
  .card:nth-child(n+4) { grid-column: span 3; }
  .card:nth-child(n+4) img { aspect-ratio: 1.85; }
  .detail { padding-block: 2.75rem 4.15rem; }
  .detail-layout, .split { gap: clamp(2rem, 5vw, 4.5rem); }
  .features { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.25rem; }
  .notes, .guide-grid, .stay-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .related { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  dialog { padding: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* November photo refresh: a steady invitation over changing mountain scenes. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.hero { min-height: 610px; touch-action: pan-y pinch-zoom; }
.hero-slides, .hero-slide { position: absolute; inset: 0; }
.hero-slides { z-index: -2; }
.hero-slide { opacity: 0; transition: opacity 900ms ease; }
.hero-slide.is-active { opacity: 1; }
.hero-slide .cover { z-index: auto; }
.hero .cover img { object-position: center; }
.hero-copy { padding-block: 3.5rem 8.75rem; }
.hero::after { background: linear-gradient(0deg, #101d17f5 0%, #102017de 32%, #12251b80 65%, #12251b12 100%); }
.hero-bottom { position: absolute; left: 0; right: 0; bottom: 1rem; display: flex; gap: .35rem; justify-content: flex-end; align-items: center; }
.slider-controls { display: flex; align-items: center; max-width: 100%; border-radius: 4px; background: #102017a6; padding: .12rem; }
.slider-controls[hidden] { display: none; }
.slider-controls button { min-height: 44px; border: 0; border-radius: 3px; color: var(--white); background: transparent; cursor: pointer; }
.slider-controls button:hover { background: #ffffff1f; }
.slider-controls button:focus-visible { outline: 2px solid var(--light-gold); outline-offset: -3px; }
.slider-toggle { min-width: 60px; padding-inline: .45rem; font-size: .75rem; font-weight: 700; }
.slider-arrow { min-width: 44px; font-size: 1.3rem; }
.slide-dots { display: flex; align-items: center; }
.slide-dot { width: 32px; padding: 0; display: grid; place-items: center; }
.slide-dot span { display: block; width: 8px; height: 8px; border: 1px solid var(--white); border-radius: 50%; background: transparent; }
.slide-dot[aria-current="true"] span { background: var(--white); }
.gallery-photo { margin: 0; min-width: 0; }
.gallery-grid { gap: .75rem; }
.gallery-editorial { display: grid; gap: clamp(2.5rem, 6vw, 5.5rem); margin-top: 1.5rem; }
.gallery-editorial .gallery-link img { height: 100%; aspect-ratio: auto; }
.gallery-opening, .gallery-four, .gallery-duet, .gallery-finale { display: grid; gap: .75rem; min-width: 0; }
.gallery-opening { align-items: center; gap: 1.5rem; }
.gallery-opening .editorial-portrait { width: 83%; margin-inline: auto; }
.editorial-portrait .gallery-link { aspect-ratio: 3 / 4; }
.editorial-wide .gallery-link { aspect-ratio: 3 / 2; }
.gallery-four, .gallery-duet, .gallery-finale { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gallery-four .gallery-link { aspect-ratio: 1 / 1; }
.gallery-duet { align-items: center; gap: 1.25rem; }
.gallery-duet .gallery-link { aspect-ratio: 4 / 3; }
.gallery-duet .gallery-photo:last-child .gallery-link { aspect-ratio: 4 / 5; }
.gallery-finale .gallery-photo:first-child { grid-column: 1 / -1; }
.gallery-finale .gallery-link { aspect-ratio: 4 / 3; }
@media (min-width: 700px) {
  .gallery-opening { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 4rem); }
  .gallery-opening .editorial-portrait { grid-column: span 5; width: 100%; margin-inline: 0; }
  .gallery-opening .editorial-wide { grid-column: span 7; }
  .gallery-duet { gap: clamp(1.5rem, 4vw, 4rem); }
  .gallery-duet .gallery-photo:last-child { width: 82%; margin-left: auto; }
  .gallery-finale { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1rem; }
  .gallery-finale .gallery-photo:first-child { grid-column: 1; grid-row: span 2; }
  .gallery-finale .gallery-photo:first-child .gallery-link { height: 100%; aspect-ratio: auto; }
  .gallery-finale .gallery-photo:not(:first-child) .gallery-link { aspect-ratio: 16 / 9; }
}
@media (min-width: 1000px) {
  .gallery-four { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
}
.gallery-intro { padding-top: 2rem; color: var(--muted); max-width: 64ch; margin-inline: auto; }
.guide-copy { max-width: 65ch; }
.guide-head h1 { max-width: 18ch; font-size: clamp(2.6rem, 5vw, 4.25rem); }
.guide-copy p + p { margin-top: 1rem; }
.guide-links { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin-top: 1rem; font-size: .88rem; }
.guide-links a { display: inline-flex; align-items: center; min-height: 44px; text-underline-offset: .25em; }
.gallery-intro + .gallery { padding-top: 1.4rem; }
.story-photo { margin: 1.5rem 0 0; }
.story-photo img { width: 100%; max-height: 380px; object-fit: cover; object-position: center 46%; border-radius: 4px; }
.cabin-comparison { margin-top: 1.5rem; }
.cabin-comparison table { width: 100%; border-collapse: collapse; text-align: left; font-size: .91rem; }
.cabin-comparison caption { text-align: left; font-weight: 700; margin-bottom: .6rem; }
.cabin-comparison th, .cabin-comparison td { padding: .9rem .6rem; border-bottom: 1px solid #c7c7b5; vertical-align: top; }
.cabin-comparison th:first-child { width: 27%; }
.cabin-comparison a { display: inline-block; padding-block: .3rem; text-underline-offset: .2em; }
.comparison-note { max-width: 70ch; font-size: .88rem; color: var(--muted); margin-top: 1rem; }
body.photo-open { overflow: hidden; }
dialog { overscroll-behavior: contain; }
dialog img { touch-action: pan-y pinch-zoom; }
@media (min-width: 850px) {
  .hero { min-height: clamp(550px, 74svh, 760px); }
  .hero-copy { padding-block: 4rem 7rem; }
  .hero::after { background: linear-gradient(90deg, #101d17ed 0%, #14241acc 34%, #17271d2e 76%, #17271d12 100%), linear-gradient(0deg, #102017c9 0%, transparent 35%); }
  .hero-bottom { flex-direction: row; align-items: center; justify-content: flex-end; bottom: 1.25rem; gap: 1.25rem; }
  .gallery-intro { padding-top: 3.5rem; }
}
@media (max-width: 359px) {
  .hero .eyebrow { font-size: .65rem; letter-spacing: .1em; }
  .hero h1 { font-size: 2.6rem; }
  .hero-copy { padding-bottom: 8.75rem; }
  .slider-toggle { min-width: 56px; }
  .slide-dot { width: 30px; }
}
