/* =========================================================
   Editorial sections and the "Editorial" page layout.

   The idea: photographs and words in balance. Photographs run large
   and words sit beside them or on them, with even, moderate spacing
   between sections so the page reads as one continuous story.

   Loaded only on pages that use these sections.

   1 Layout and shared text   2 Cinematic photograph   3 Quiet statement
   4 Photograph and story     5 Heading with photographs
   6 Photo story              7 Sideways gallery       8 Movement   9 Small screens
   ========================================================= */

/* ---------- 1. Layout and shared text ---------- */
/* Whether the content box is framed or full width is chosen under Appearance → Layout (cms.css, "Width of the website"). */
.page--editorial .sec { --sec: clamp(56px, 6.4vw, 104px); }
.page--editorial .sec:not(.sec--tint) + .sec:not(.sec--tint) { border-top: 0; }

.ed {
  --ed-edge: max(var(--gutter), calc((100vw - var(--ed-max)) / 2));   /* where the words line up */
  --ed-pad: clamp(56px, 6.4vw, 104px);                         /* room above and below a section */
  --ed-h: clamp(2.1rem, 1.3rem + 2.4vw, 3.5rem);
  --ground: var(--sheet);
  position: relative; background: var(--ground); color: var(--ink);
}
.page:not(.page--editorial) .ed { --ed-edge: var(--gutter); --ed-h: clamp(2.2rem, 1.3rem + 2.6vw, 3.6rem); }
/* a cinematic photograph opening an ordinary page: its words line up with the content below it, not with the edge of the screen */
.page:not(.page--editorial) .cine--hero, .page:not(.page--editorial) .cine-show--hero, .page:not(.page--editorial) .cine-show--hero .cine {
  --ed-edge: max(var(--gutter), calc((100% - var(--wrap)) / 2)); }
@media (min-width: 700px) {
  /* in the framed layout the content sits in a box narrower than the screen: the words follow the content inside it */
  .site--boxed:not(.page--editorial) .cine--hero, .site--boxed:not(.page--editorial) .cine-show--hero, .site--boxed:not(.page--editorial) .cine-show--hero .cine {
    --box-w: min(var(--box-max, 1440px), calc(100% - clamp(24px, 6vw, 96px)));
    --ed-edge: calc((100% - var(--box-w)) / 2 + max(var(--gutter), calc((var(--box-w) - var(--wrap)) / 2))); }
}
.ed--paper { --ground: var(--paper); }
.ed--dark { --ground: var(--green-dark); color: #F3EFE4; }
.ed--dark .ed-eyebrow { color: #CDBD96; }
.ed--dark .ed-p, .ed--dark .show__line, .ed--dark .seq__cap { color: #D9D4C5; }
.ed--dark .seq__title { color: #F3EFE4; }
.ed--dark .round { border-color: #F3EFE4; color: #F3EFE4; }
.ed--dark .round:hover { background: #F3EFE4; color: var(--green-dark); }
.ed figure { margin: 0; }
.ed img { display: block; }

.ed-eyebrow { margin: 0 0 clamp(12px, 1.4vw, 18px); font-size: .9375rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; line-height: 1.5; color: var(--earth); }
.ed-h { font-size: var(--ed-h); line-height: 1.08; text-wrap: balance; }
.ed-p { margin-top: clamp(16px, 1.8vw, 24px); max-width: 36rem; color: var(--ink-soft); line-height: 1.75; text-wrap: pretty; }
.ed-p > * + * { margin-top: 1em; }
.ed-p p { margin-bottom: 0; }
.ed-p a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.ed-more { margin: clamp(18px, 2vw, 28px) 0 0; }
.ed-link { display: inline-flex; align-items: center; gap: 16px; padding-block: 8px; font-size: .9375rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; line-height: 1.4; }
.ed-link--light { color: #fff; }
.ed-arr { width: 40px; height: 12px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s ease; }
.ed-link:hover .ed-arr, .show__item a:hover .ed-arr { transform: translateX(8px); }

/* ---------- 2. Cinematic photograph ---------- */
.cine { --cine-h: clamp(440px, 72svh, 760px); display: grid; align-items: end; min-height: var(--cine-h); overflow: hidden; isolation: isolate; background: var(--green-dark); color: #fff; }
.cine--screen { --cine-h: 100svh; min-height: max(100svh, 560px); }
.cine--tall { --cine-h: clamp(520px, 84svh, 880px); }
.cine--band { --cine-h: clamp(360px, 56svh, 600px); }
.cine--short { --cine-h: clamp(280px, 40svh, 440px); }
.cine__media { position: absolute; inset: 0; z-index: -2; background: var(--sand); }
.cine__media img, .cine__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cine__media video { opacity: 0; transition: opacity 1.4s ease; }
.cine__media video.is-on { opacity: 1; }
/* two soft shades: one rising from the foot for the words, one from the side they sit on */
.cine::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(to top, rgba(10, 13, 10, .74), rgba(10, 13, 10, .2) 44%, rgba(10, 13, 10, 0) 66%), linear-gradient(to right, rgba(10, 13, 10, .4), rgba(10, 13, 10, 0) 56%); }
.cine--hero::before { background: linear-gradient(rgba(10, 13, 10, .52), rgba(10, 13, 10, 0) 24%), linear-gradient(to top, rgba(10, 13, 10, .74), rgba(10, 13, 10, .2) 44%, rgba(10, 13, 10, 0) 66%), linear-gradient(to right, rgba(10, 13, 10, .4), rgba(10, 13, 10, 0) 56%); }
.cine--c::before, .cine--bc::before { background: linear-gradient(rgba(10, 13, 10, .3), rgba(10, 13, 10, .3)), linear-gradient(to top, rgba(10, 13, 10, .5), rgba(10, 13, 10, 0) 50%); }
.cine--c.cine--hero::before, .cine--bc.cine--hero::before { background: linear-gradient(rgba(10, 13, 10, .52), rgba(10, 13, 10, 0) 24%), linear-gradient(rgba(10, 13, 10, .3), rgba(10, 13, 10, .3)), linear-gradient(to top, rgba(10, 13, 10, .5), rgba(10, 13, 10, 0) 50%); }
.cine--strong::after { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(10, 13, 10, .26); pointer-events: none; }
.cine--none::before { display: none; }
.cine--none.cine--hero::before { display: block; background: linear-gradient(rgba(10, 13, 10, .52), rgba(10, 13, 10, 0) 24%); }

.cine__in { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); width: 100%; padding: clamp(96px, 10vw, 140px) var(--ed-edge) clamp(32px, 4.4vw, 64px); }
.cine--c, .cine--l { align-items: center; }
.cine--c .cine__in { padding-bottom: clamp(64px, 8vw, 120px); }
.cine__words { max-width: 46rem; }
.cine--huge .cine__words { max-width: 70rem; }
.cine--c .cine__words, .cine--bc .cine__words { margin-inline: auto; text-align: center; max-width: 60rem; }
.cine__eyebrow { color: #fff; }
.cine__h { font-size: var(--ed-h); line-height: 1.02; text-shadow: 0 1px 32px rgba(0, 0, 0, .3); text-wrap: balance; }
.cine--huge .cine__h { font-size: clamp(2.6rem, 1.4rem + 4vw, 5.25rem); line-height: 1.02; }
.cine__lede { margin: clamp(16px, 2vw, 28px) 0 0; max-width: 34rem; font-size: var(--fs-lede); line-height: 1.45; text-wrap: pretty; text-shadow: 0 1px 18px rgba(0, 0, 0, .35); }
.cine--c .cine__lede, .cine--bc .cine__lede { margin-inline: auto; }
.cine__small { margin: 14px 0 0; font-size: var(--fs-small); font-weight: 500; text-shadow: 0 1px 14px rgba(0, 0, 0, .4); }
.cine__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 36px; margin-top: clamp(24px, 3vw, 40px); }
.cine__acts--btns { gap: 14px; }
.cine--c .cine__acts, .cine--bc .cine__acts { justify-content: center; }
.cine__btn { background: var(--sheet); border-color: var(--sheet); color: var(--ink); }
.cine__btn:hover { background: #fff; border-color: #fff; }
.cine__btn--line { background: transparent; border-color: #fff; color: #fff; }
.cine__btn--line:hover { background: #fff; border-color: #fff; color: var(--ink); }
.cine__film { display: inline-flex; align-items: center; gap: 14px; font-size: .9375rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.cine__play { display: grid; place-items: center; width: 52px; height: 52px; border: 1.5px solid #fff; border-radius: 50%; transition: background .25s, color .25s; }
.cine__play svg { width: 18px; height: 18px; fill: currentColor; }
.cine__film:hover .cine__play { background: #fff; color: var(--ink); }
.cine__strip ul { display: flex; border-top: 1px solid rgba(255, 255, 255, .42); }
.cine__strip li { flex: 1 1 0; text-align: center; }
.cine__strip li + li { position: relative; }
.cine__strip li + li::before { content: ""; position: absolute; left: 0; top: 26px; height: 14px; width: 1px; background: rgba(255, 255, 255, .5); }
.cine__strip a, .cine__strip span { display: block; padding: 22px 14px 4px; font-size: .9375rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; line-height: 1.4; }
.cine__strip a:hover { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.cine__cue { position: absolute; right: var(--ed-edge); bottom: clamp(36px, 5.2vw, 76px); display: grid; justify-items: center; gap: 12px; font-size: .8125rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.cine__cue::after { content: ""; width: 1px; height: 44px; background: #fff; transform-origin: top; }
#after-hero { display: block; scroll-margin-top: var(--header); }

/* ---------- 3. Quiet statement ---------- */
.stmt { padding: clamp(56px, 7vw, 104px) var(--gutter); text-align: center; }
.stmt--more { padding-block: clamp(80px, 10vw, 150px); }
.stmt--less { padding-block: clamp(40px, 5vw, 72px); }
.stmt__in { max-width: 62rem; margin-inline: auto; }
.stmt__h { font-size: clamp(1.8rem, 1.2rem + 2vw, 3rem); line-height: 1.16; text-wrap: balance; }
.stmt--huge .stmt__h { font-size: clamp(2.4rem, 1.2rem + 4vw, 5rem); line-height: 1.04; }
.stmt--small .stmt__h { font-size: clamp(1.5rem, 1.15rem + 1.2vw, 2.2rem); line-height: 1.22; }
.stmt .ed-p { margin-inline: auto; max-width: 36rem; font-size: var(--fs-lede); line-height: 1.6; }
.stmt--left { text-align: left; padding-inline: var(--ed-edge); }
.stmt--left .stmt__in { max-width: none; margin: 0; }
.stmt--left .ed-p { margin-inline: 0; }

/* ---------- 4. Photograph and story: photograph and words side by side, in balance ---------- */
.feat { padding-block: var(--ed-pad); }
.feat__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 5vw, 80px);
  max-width: calc(var(--ed-max) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.feat__text { max-width: 40rem; }
.feat--flip .feat__text { order: 2; }
.feat--text .feat__grid { grid-template-columns: 1fr; }
.feat__media { position: relative; }
.feat__img, .feat__img2 { overflow: hidden; background: var(--sand); border-radius: var(--radius); }
.feat__img { aspect-ratio: 4 / 3; width: 100%; }
.feat--tall .feat__img { aspect-ratio: 4 / 5; }
.feat--square .feat__img { aspect-ratio: 1; }
.feat--wide .feat__img { aspect-ratio: 16 / 9; }
.feat__img img, .feat__img2 img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s cubic-bezier(.2, .6, .2, 1); }
.feat__media:hover .feat__img img { transform: scale(1.03); }
/* "edge" (from 1.3) is now the same balanced pair, held in the content column */
/* a large and a small photograph: the small one overlaps a corner of the large one, just inside it */
.feat--overlap .feat__media { padding: 0 0 clamp(40px, 5vw, 72px) clamp(40px, 5vw, 72px); }
.feat--overlap .feat__img2 { position: absolute; left: 0; bottom: 0; width: 38%; aspect-ratio: 1; border: 6px solid var(--ground); box-shadow: 0 18px 40px -24px rgba(23, 23, 19, .5); }
.feat--overlap.feat--flip .feat__media { padding: 0 clamp(40px, 5vw, 72px) clamp(40px, 5vw, 72px) 0; }
.feat--overlap.feat--flip .feat__img2 { left: auto; right: 0; }
/* a photograph on each side of the words */
.feat--flank .feat__grid { grid-template-columns: minmax(0, 4fr) minmax(0, 4fr) minmax(0, 4fr); gap: clamp(24px, 3.4vw, 56px); }
.feat--flank .feat__img2 { order: 1; aspect-ratio: 4 / 5; }
.feat--flank .feat__text { order: 2; }
.feat--flank .feat__media { order: 3; }
.feat--flank .feat__img { aspect-ratio: 4 / 5; }
.feat--flank.feat--flip .feat__media { order: 1; }
.feat--flank.feat--flip .feat__img2 { order: 3; }

/* a centred block of a section's own heading, shared by the wider sections */
.ed-wrap { max-width: calc(var(--ed-max) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.ed-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px clamp(32px, 5vw, 80px); align-items: end; margin-bottom: clamp(28px, 3.4vw, 48px); }
.ed-head .ed-p { margin-top: 0; }
.ed-head .ed-more { grid-column: 2; margin-top: 0; }
.ed-head > .ed-eyebrow { grid-column: 1 / -1; margin-bottom: 0; }

/* ---------- 5. Heading with photographs ---------- */
.show { padding-block: var(--ed-pad); }
.show__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 9fr); align-items: center; gap: clamp(28px, 4vw, 64px); max-width: calc(var(--ed-max) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.show--top .show__grid { grid-template-columns: 1fr; gap: clamp(24px, 3vw, 40px); }
.show--top .show__text { max-width: 46rem; }
.show__row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: clamp(14px, 1.6vw, 24px); }
.show--n5 .show__row, .show--n6 .show__row { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: clamp(32px, 4vw, 56px); }
.show__item a, .show__item > div { display: block; height: 100%; }
.show__img { aspect-ratio: 4 / 5; overflow: hidden; background: var(--sand); border-radius: var(--radius); }
.show--square .show__img { aspect-ratio: 1; }
.show--land .show__img { aspect-ratio: 4 / 3; }
.show__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s cubic-bezier(.2, .6, .2, 1); }
.show__item a:hover .show__img img { transform: scale(1.045); }
.show__cap { position: relative; padding: 18px 44px 0 0; }
.show__name { font-family: var(--body); font-size: .9375rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; line-height: 1.45; }
.show__line { margin: 8px 0 0; font-size: var(--fs-small); line-height: 1.5; color: var(--ink-soft); }
.show__price { margin: 8px 0 0; font-size: var(--fs-small); font-weight: 600; color: var(--green); }
.ed--dark .show__price { color: #CDBD96; }
.show__item a { transition: transform .4s ease; }
.show__item a:hover { transform: translateY(-4px); }
.show__cap .ed-arr { position: absolute; right: 0; top: 23px; width: 30px; }
.show--labels .show__cap { padding: 16px 0 0; text-align: center; }
.show--icons .show__item > a, .show--icons .show__item > div { padding: clamp(28px, 3.2vw, 48px) clamp(18px, 2vw, 30px); background: var(--paper); text-align: center; }
.show--icons.ed--paper .show__item > a, .show--icons.ed--paper .show__item > div { background: var(--sheet); }
.show--icons.ed--dark .show__item > a, .show--icons.ed--dark .show__item > div { background: rgba(255, 255, 255, .06); }
.show__icon { display: block; width: 52px; height: 52px; margin: 0 auto 22px; fill: none; stroke: var(--earth); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.ed--dark .show__icon { stroke: #CDBD96; }

/* ---------- 6. Photo story: every row inside the content column ---------- */
.seq { display: grid; gap: clamp(28px, 3.6vw, 52px); padding-block: var(--ed-pad); }
.seq > * { width: 100%; max-width: calc(var(--ed-max) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.seq__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 4vw, 64px); }
.seq__img { overflow: hidden; background: var(--sand); border-radius: var(--radius); aspect-ratio: 4 / 3; }
.seq__img img { width: 100%; height: 100%; object-fit: cover; }
.seq__cap { display: grid; gap: 10px; max-width: 34rem; color: var(--ink-soft); line-height: 1.7; }
.seq__title { font-family: var(--display); font-weight: 400; font-size: var(--fs-h3); line-height: 1.15; color: var(--ink); }
.seq__row--right .seq__img { order: 2; }
.seq__row--full, .seq__row--wide { grid-template-columns: 1fr; }
.seq__row--full .seq__img, .seq__row--wide .seq__img { aspect-ratio: 21 / 9; }
.seq__row--bare { grid-template-columns: 1fr; }
.seq__row--bare .seq__img { aspect-ratio: 16 / 9; }
.seq__row--pair { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
.seq__row--pair .seq__img { grid-column: span 1; aspect-ratio: 1; }
.seq__row--pair .seq__cap { grid-column: 3; grid-row: 1; }
.seq__row--centre { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }

/* ---------- 7. Sideways gallery ---------- */
.reel { padding-block: var(--ed-pad); max-width: calc(var(--ed-max) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.ed.reel { background: none; }
.reel.ed--paper, .reel.ed--dark { background: var(--ground); max-width: none; padding-inline: max(var(--gutter), calc((100% - var(--ed-max)) / 2)); }
.reel__head { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: clamp(20px, 2.6vw, 36px); }
.reel__ctrl { display: flex; gap: 10px; flex: none; }
.reel .round:disabled { opacity: .3; cursor: default; }
.reel .round:disabled:hover { background: none; color: inherit; }
.reel__track { display: flex; gap: clamp(12px, 1.6vw, 24px); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; border-radius: var(--radius); scrollbar-width: none; }
.reel__track::-webkit-scrollbar { display: none; }
.reel__item { flex: none; scroll-snap-align: start; }
.reel__item img { border-radius: var(--radius); height: clamp(300px, 52svh, 520px); width: auto; max-width: 86vw; object-fit: cover; background: var(--sand); }
.reel--low .reel__item img { height: clamp(240px, 44svh, 460px); }
.reel__item figcaption, .reel__cap { margin: 12px 0 0; font-size: var(--fs-small); color: var(--ink-soft); }
.reel__zoom { display: block; padding: 0; border: 0; background: none; cursor: zoom-in; border-radius: var(--radius); }
.reel__zoom img { transition: filter .25s; }
.reel__zoom:hover img { filter: brightness(1.06); }
.reel__zoom:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.reel__intro { margin: 10px 0 0; color: var(--ink-soft); }
.reel__item--film { width: min(86vw, clamp(420px, 58vw, 860px)); }
.reel__item--film .film__media { display: block; aspect-ratio: auto; height: clamp(300px, 52svh, 520px); }
.reel--low .reel__item--film .film__media { height: clamp(240px, 44svh, 460px); }
.reel__item--film .film__media img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius); }
.reel--in { padding: 0; max-width: none; }
.reel--gal { padding-block: clamp(40px, 5vw, 80px); }
.sheet > .reel--gal + .reel--gal { padding-top: 0; }
.ed--dark .reel__item figcaption { color: #D9D4C5; }

/* ---------- 7b. Slideshow of cinematic photographs ---------- */
.cine-show { position: relative; display: grid; overflow: hidden; background: var(--green-dark); }
.cine-show > .cine__slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity 1.2s ease, visibility 0s linear 1.2s; }
.cine-show > .cine__slide.is-active { opacity: 1; visibility: visible; transition: opacity 1.2s ease; z-index: 1; }
.cine-show .cine { min-height: var(--cine-h); }
.cine__ctrl { position: absolute; z-index: 3; right: var(--ed-edge); bottom: clamp(32px, 4.4vw, 64px); display: flex; align-items: center; gap: 10px; color: #fff; }
.cine__arrow { display: grid; place-items: center; width: 44px; height: 44px; border: 1.5px solid rgba(255, 255, 255, .8); border-radius: 50%; transition: background .25s, color .25s; }
.cine__arrow svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cine__arrow:hover { background: #fff; color: var(--ink); }
.cine__dots { display: flex; gap: 6px; padding-inline: 6px; }
.cine__dot { display: grid; align-items: center; width: 40px; height: 44px; }
.cine__dot span { display: block; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .4); overflow: hidden; }
.cine__dot span::after { content: ""; display: block; height: 100%; width: 0; background: #fff; }
.cine__dot.is-active span::after { width: 100%; }
.cine-show.is-running .cine__dot.is-active span::after { animation: cineProgress var(--cine-sec, 7s) linear both; }
.cine-show .cine__in { padding-right: calc(var(--ed-edge) + 210px); }
@keyframes cineProgress { from { width: 0; } to { width: 100%; } }

/* ---------- 7c. Rooms and rates ---------- */
.stays { padding-block: var(--ed-pad); }
.stays__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(20px, 2.4vw, 32px); }
.stay { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--radius); background: var(--paper); transition: transform .45s ease, box-shadow .45s ease; }
.ed--paper .stay { background: var(--sheet); }
.stay:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -30px rgba(23, 23, 19, .55); }
.stay__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--sand); }
.stay__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s cubic-bezier(.2, .6, .2, 1); }
.stay:hover .stay__img img { transform: scale(1.05); }
.stay__body { display: flex; flex-direction: column; flex: 1; padding: clamp(20px, 2.2vw, 28px); }
.stay__meta { margin: 0 0 6px; font-size: var(--fs-small); color: var(--earth); }
.stay__name { font-size: var(--fs-h3); line-height: 1.15; }
.stay__text { margin: 10px 0 0; font-size: var(--fs-small); line-height: 1.6; color: var(--ink-soft); }
.stay__rates { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--line); }
.stay__rates dt { font-size: var(--fs-small); color: var(--earth); }
.stay__rates dd { margin: 2px 0 0; font-size: 1.375rem; font-weight: 600; line-height: 1.2; color: var(--ink); }
.stay__unit { margin: 6px 0 0; font-size: var(--fs-small); color: var(--ink-soft); }
.stay__acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: auto 0 0; padding-top: 18px; }
.stay__acts .ed-link { font-size: .875rem; letter-spacing: .12em; }
.btn--sm { min-height: 44px; padding: 8px 20px; font-size: 1rem; }
.stays__note { margin: clamp(18px, 2vw, 26px) 0 0; font-size: var(--fs-small); color: var(--ink-soft); }
.stays__note .ed-link { margin-left: 8px; padding: 0; font-size: .875rem; }
.stays--rows .stays__list { grid-template-columns: 1fr; gap: clamp(24px, 3vw, 40px); }
.stays--rows .stay { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.stays--rows .stay__img { aspect-ratio: auto; min-height: 340px; }
.stays--rows .stay--flip .stay__img { order: 2; }
.stays--rows .stay__body { justify-content: center; padding: clamp(24px, 3.4vw, 48px); }

/* ---------- 8. Movement: slow and quiet, once ---------- */
/* (applies to everyone unless Movement follows the device: then style.css stills it for those who asked) */
  /* the opening of a page: the words arrive after the photograph */
  .js .cine--hero .cine__words > *, .js .cine__slide.is-active .cine__words > * { animation: edRise 1.2s cubic-bezier(.2, .6, .2, 1) both; }
  .js .cine__slide.is-active .cine__words > :nth-child(1) { animation-delay: .35s; }
  .js .cine__slide.is-active .cine__words > :nth-child(2) { animation-delay: .5s; }
  .js .cine__slide.is-active .cine__words > :nth-child(3) { animation-delay: .65s; }
  .js .cine__slide.is-active .cine__words > :nth-child(n+4) { animation-delay: .8s; }
  /* each slide's photograph drifts slowly closer while it is shown */
  .cine__slide .cine__media img { transform: scale(1.0); transition: transform 9s linear; }
  .cine__slide.is-active .cine__media img { transform: scale(1.08); }
  .js .cine--hero .cine__words > :nth-child(1) { animation-delay: .25s; }
  .js .cine--hero .cine__words > :nth-child(2) { animation-delay: .4s; }
  .js .cine--hero .cine__words > :nth-child(3) { animation-delay: .55s; }
  .js .cine--hero .cine__words > :nth-child(4) { animation-delay: .7s; }
  .js .cine--hero .cine__words > :nth-child(n+5) { animation-delay: .85s; }
  .js .cine--hero .cine__media img { animation: edSettle 2.4s cubic-bezier(.2, .6, .2, 1) both; }
  .cine__cue::after { animation: edCue 2.6s ease-in-out infinite; }

  /* photographs and words settle as they come into view */
  .ed-motion .ed [data-rv] { opacity: 0; transform: translateY(18px); transition: opacity .9s cubic-bezier(.2, .6, .2, 1), transform 1s cubic-bezier(.2, .6, .2, 1); }
  .ed-motion .ed .ed-h[data-rv] { transition-delay: .08s; }
  .ed-motion .ed .ed-p[data-rv] { transition-delay: .16s; }
  .ed-motion .ed .ed-more[data-rv] { transition-delay: .24s; }
  .ed-motion .ed [data-rv].is-in { opacity: 1; transform: none; }
  .ed-motion .ed [data-rv="img"] { transform: none; }
  .ed-motion .ed [data-rv="img"] img { transform: scale(1.07); transition: transform 1.9s cubic-bezier(.2, .6, .2, 1); }
  .ed-motion .ed [data-rv="img"].is-in img { transform: none; }

  /* the cinematic photographs drift closer while they are on screen */
  .ed-motion .cine--zoom:not(.cine--hero) .cine__media img { transition: transform 18s cubic-bezier(.25, .4, .35, 1); }
  .ed-motion .cine--zoom.is-playing:not(.cine--hero) .cine__media img { transform: scale(1.09); }
  .ed-motion .cine--zoom.cine--hero .cine__media { transition: transform 22s cubic-bezier(.25, .4, .35, 1); }
  .ed-motion .cine--zoom.cine--hero.is-playing .cine__media { transform: scale(1.07); }

@keyframes edRise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes edSettle { from { opacity: 0; } to { opacity: 1; } }
@keyframes edCue { 0%, 100% { transform: scaleY(.35); opacity: .6; } 50% { transform: scaleY(1); opacity: 1; } }

/* ---------- 9. Small screens ---------- */
@media (max-width: 900px) {
  .feat__grid, .feat--flip .feat__grid, .feat--flank .feat__grid, .feat--flank.feat--flip .feat__grid,
  .feat--edge .feat__grid, .feat--edge.feat--flip .feat__grid { grid-template-columns: 1fr; gap: 24px; padding-inline: var(--gutter); }
  .feat__media, .feat--flank .feat__media, .feat--flank.feat--flip .feat__media { order: 1; }
  .feat__text, .feat--flip .feat__text, .feat--flank .feat__text, .feat--edge .feat__text, .feat--edge.feat--flip .feat__text { order: 2; padding: 0; justify-self: start; }
  .feat--overlap .feat__media, .feat--overlap.feat--flip .feat__media { padding: 0 0 14vw 0; }
  .feat--overlap .feat__img2, .feat--overlap.feat--flip .feat__img2 { left: auto; right: 12px; width: 40%; }
  .feat--flank .feat__img2, .feat--flank.feat--flip .feat__img2 { order: 3; width: 62%; margin-left: auto; }
  .ed-head { grid-template-columns: 1fr; }
  .ed-head .ed-more { grid-column: 1; }
  .stays--rows .stay { grid-template-columns: 1fr; }
  .stays--rows .stay--flip .stay__img { order: 0; }
  .stays--rows .stay__img { min-height: 0; aspect-ratio: 4 / 3; }
  .cine-show .cine__in { padding-right: var(--ed-edge); padding-bottom: 96px; }
  .cine__ctrl { left: var(--ed-edge); right: auto; bottom: 24px; }

  .show__grid { grid-template-columns: 1fr; padding-right: 0; }
  .show__text { padding-right: var(--gutter); }
  .show__row, .show--n5 .show__row, .show--n6 .show__row { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 68vw; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding-right: var(--gutter); scrollbar-width: none; }
  .show__row::-webkit-scrollbar { display: none; }
  .show__item { scroll-snap-align: start; }
  .show--labels .show__row { grid-auto-columns: 52vw; }
  .show--icons .show__grid { padding-right: var(--gutter); }
  .show--icons .show__text { padding-right: 0; }
  .show--icons .show__row { grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; padding-right: 0; }

  .seq__row, .seq__row--pair, .seq__row--centre { grid-template-columns: 1fr; }
  .seq__row--right .seq__img { order: 0; }
  .seq__row--pair .seq__cap { grid-column: 1; grid-row: auto; }
  .seq__row--full .seq__img, .seq__row--wide .seq__img { aspect-ratio: 4 / 3; }

  .cine__strip { margin-inline: calc(-1 * var(--ed-edge)); }
  .cine__strip ul { overflow-x: auto; scrollbar-width: none; padding-inline: var(--ed-edge); }
  .cine__strip ul::-webkit-scrollbar { display: none; }
  .cine__strip li { flex: none; }
  .cine__strip a, .cine__strip span { padding-inline: 18px; white-space: nowrap; }
  .cine__strip li:first-child a, .cine__strip li:first-child span { padding-left: 0; }
  .cine__cue { display: none; }
  .reel__head { align-items: start; }
}
@media (max-width: 560px) {
  .cine--huge .cine__h { font-size: clamp(2.3rem, 10vw, 3.1rem); }
  .cine__acts { gap: 16px 28px; }
  .cine__acts--btns .btn { flex: 1 1 100%; }
  .stmt { padding-block: 56px; }
  .stmt--more { padding-block: 80px; }
}

/* ---------- Contact desk: every way to reach the lodge beside the full enquiry form ---------- */
.desk { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(28px, 4vw, 64px); align-items: start; max-width: 1240px; margin-inline: auto; }
.desk__side { position: sticky; top: calc(var(--header) + 32px); padding: clamp(24px, 3vw, 40px); border-radius: var(--radius); background: var(--green-dark); color: #F3EFE4; }
.desk__title { font-size: var(--fs-h2); line-height: 1.1; }
.desk__lede { margin: 14px 0 0; color: #D9D4C5; }
.desk__ways { display: grid; gap: 18px; margin: 26px 0; }
.desk__way { padding-top: 16px; border-top: 1px solid rgba(243, 239, 228, .2); }
.desk__way dt { font-size: var(--fs-small); color: #CDBD96; }
.desk__way dd { margin: 4px 0 0; font-size: var(--fs-body); line-height: 1.5; }
.desk__way a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.desk__way .ed-link { display: flex; margin-top: 6px; text-decoration: none; font-size: .8125rem; }
.desk__side > .ed-link { color: #fff; }
.desk__social { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0 0 20px; font-weight: 600; }
.desk__form .form { margin: 0; }
.form__req { margin: -12px 0 18px; font-size: var(--fs-small); color: var(--ink-soft); }
.must { display: inline; color: var(--error); text-decoration: none; font-weight: 700; border: 0; cursor: help; }
.form__set { margin: 0 0 8px; padding: 0; border: 0; }
.form__set legend { margin-bottom: 14px; padding: 0; font-family: var(--display); font-size: 1.4rem; }
.form__set + .form__set { margin-top: 10px; }
.form--enquiry .form__row { align-items: start; }
.field__hint { font-size: .9375rem; color: var(--ink-soft); }
.check { display: flex; align-items: flex-start; gap: 12px; margin: 14px 0 20px; font-size: var(--fs-small); line-height: 1.5; }
.check input { width: 22px; height: 22px; flex: none; margin-top: 1px; accent-color: var(--green); }
.check a { text-decoration: underline; }
.field.is-invalid input, .field.is-invalid select, .field.is-invalid textarea { border-color: var(--error); }
.field.is-invalid > span, .check.is-invalid { color: var(--error); }
@media (max-width: 900px) {
  .desk { grid-template-columns: 1fr; }
  .desk__side { position: static; order: 2; }
}
.cine--hero .cine__in, .cine-show--hero .cine__in { padding-top: clamp(140px, 14vw, 190px); }

/* ---------- 10. One hero size, everything else in the content column ---------- */
/* Automatic: one opening height for every page; a chosen Height (whole screen, tall, band, short) is kept. */
.cine--hero.cine--auto, .cine-show--hero .cine.cine--auto { --cine-h: clamp(460px, 72svh, 720px); }
.cine__cue { display: none; }
/* A cinematic photograph further down the page is a panel as wide as the content, with rounded corners. */
.sheet > .ed.cine:not(.cine--hero), .sheet > .cine-show:not(.cine-show--hero) {
  --ed-edge: clamp(24px, 4vw, 56px);
  width: calc(100% - var(--gutter) * 2); max-width: var(--ed-max); margin: clamp(28px, 3.6vw, 52px) auto; border-radius: var(--radius);
}
.sheet > .ed.cine.cine--auto:not(.cine--hero), .sheet > .cine-show:not(.cine-show--hero) .cine.cine--auto { --cine-h: clamp(340px, 52svh, 520px); }
.sheet > .cine-show:not(.cine-show--hero) .cine { border-radius: 0; }

/* ---------- Photograph with options ---------- */
.cine-tabs .cine__in { padding-bottom: calc(clamp(32px, 4.4vw, 64px) + 84px); }
.cine-tabs__strip { position: absolute; z-index: 3; left: var(--ed-edge); right: var(--ed-edge); bottom: clamp(14px, 2vw, 30px); color: #fff; }
.cine-tabs__strip ul { margin: 0; padding: 0; list-style: none; }
.cine-tabs__strip button { display: block; width: 100%; padding: 22px 14px 6px; border: 0; background: none; color: rgba(255, 255, 255, .74); font: inherit; font-size: .9375rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; line-height: 1.4; cursor: pointer; transition: color .25s; }
.cine-tabs__strip button:hover { color: #fff; }
.cine-tabs__strip button.is-active { color: #fff; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 8px; }
.cine-tabs__strip button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 760px) {
  .cine-tabs__strip ul { overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
  .cine-tabs__strip ul::-webkit-scrollbar { display: none; }
  .cine-tabs__strip li { flex: 0 0 auto; scroll-snap-align: start; }
  .cine-tabs__strip li + li::before { top: 24px; }
  .cine-tabs__strip button { padding-inline: 16px; font-size: .875rem; letter-spacing: .1em; white-space: nowrap; }
}

/* ---------- Split section: two halves from edge to edge ---------- */
.halves { --split-min: clamp(380px, 56svh, 620px); display: grid; align-items: stretch; grid-template-columns: 1fr 1fr; min-height: var(--split-min); background: var(--ground); }
.halves--r60 { grid-template-columns: 3fr 2fr; }
.halves--r40 { grid-template-columns: 2fr 3fr; }
.halves--tall { --split-min: clamp(520px, 80svh, 860px); }
.halves--screen { --split-min: max(100svh, 560px); }
.halves--contained { width: calc(100% - var(--gutter) * 2); max-width: var(--ed-max); margin: clamp(28px, 3.6vw, 52px) auto; border-radius: var(--radius); overflow: hidden; }
.halves__half { position: relative; min-width: 0; margin: 0; background: var(--split-bg, transparent); color: inherit; }
.halves__half--img { min-height: var(--split-min); overflow: hidden; background: var(--sand); }
.halves__half--img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.halves__half--text { display: flex; align-items: center; padding: clamp(40px, 6vw, 104px) clamp(24px, 5.6vw, 96px); }
.halves__words { width: 100%; max-width: 34rem; }
.halves--r60 .halves__half--text:first-child .halves__words, .halves--r40 .halves__half--text:last-child .halves__words { max-width: 40rem; }
.halves__h { margin: 0; }
.halves .ed-p { margin-top: clamp(14px, 1.6vw, 22px); }
.halves .ed-more { margin-top: clamp(18px, 2vw, 28px); }
/* backgrounds: the section, then each half */
.halves--ground.halves__bg--white { --ground: #fff; }
.halves--ground.halves__bg--paper { --ground: var(--paper); }
.halves--ground.halves__bg--dark { --ground: var(--green-dark); color: #F3EFE4; }
.halves--ground.halves__bg--custom { --ground: var(--split-bg); }
.halves--ground.is-darkbg { color: #F3EFE4; }
.halves__half.halves__bg--white { --split-bg: #fff; }
.halves__half.halves__bg--paper { --split-bg: var(--paper); }
.halves__half.halves__bg--dark { --split-bg: var(--green-dark); }
.halves__half.is-darkbg { color: #F3EFE4; }
.halves .is-darkbg .ed-eyebrow, .halves.is-darkbg .ed-eyebrow { color: #CDBF9E; }
.halves .is-darkbg .ed-h, .halves.is-darkbg .ed-h { color: #fff; }
.halves .is-darkbg .ed-p, .halves.is-darkbg .ed-p { color: rgba(243, 239, 228, .88); }
.halves .is-darkbg .ed-link, .halves.is-darkbg .ed-link { color: #fff; }
@media (max-width: 800px) {
  .halves, .halves--r60, .halves--r40 { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .halves__half--img { min-height: 0; aspect-ratio: 4 / 3; }
  .halves--phone-right .halves__half:last-child { order: -1; }
  .halves__half--empty { display: none; }
}

/* Split section, 1.7: the words line up with the words of the rest of the page */
.halves { container-type: inline-size; --hv-max: var(--ed-max); }   /* the edge the other editorial sections keep */
.halves:not(.halves--contained) { --hv-edge: max(var(--gutter), calc((100cqw - var(--hv-max)) / 2)); }
@media (min-width: 801px) {
  .halves:not(.halves--contained) .halves__half--text.halves__half--left { padding-left: var(--hv-edge); }
  .halves:not(.halves--contained) .halves__half--text.halves__half--right { padding-right: var(--hv-edge); }
  .halves:not(.halves--contained) .halves__half--text.halves__half--right .halves__words { margin-right: auto; }
}
@media (max-width: 800px) { .halves__half--text { padding-inline: var(--gutter); } }
/* several photographs take turns */
.halves__pic { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease; }
.halves__pic.is-active { opacity: 1; }
.halves__half--img > .halves__pic:only-of-type, .halves__half--img:not(.halves__half--show) > .halves__pic { opacity: 1; }
.halves__pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* links and buttons */
.halves__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 32px; margin-top: clamp(18px, 2vw, 28px); }
.halves__acts--btns { gap: 12px; }
.halves__btn--light { background: #fff; border-color: #fff; color: var(--ink); }
.halves__btn--light.btn--line { background: transparent; color: #fff; }
.halves__over { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 60px clamp(20px, 3vw, 40px) clamp(20px, 3vw, 36px); background: linear-gradient(transparent, rgba(10, 13, 10, .55)); color: #fff; }
.halves__over .halves__acts { margin: 0; }

/* sideways carousels: captions and film titles laid over the bottom of the photograph */
.reel--caps-on .reel__item, .reel--caps-on .reel__item figure { position: relative; }
.reel--caps-on .reel__item figcaption, .reel--caps-on .reel__cap {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; margin: 0; padding: clamp(36px, 5vw, 64px) clamp(16px, 2vw, 24px) clamp(14px, 1.6vw, 20px);
  color: #fff; font-size: var(--fs-small); line-height: 1.4; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); pointer-events: none;
  background: linear-gradient(to top, rgba(15, 15, 12, .72), rgba(15, 15, 12, .38) 55%, rgba(15, 15, 12, 0)); border-radius: 0 0 var(--radius) var(--radius); }
.ed--dark.reel--caps-on .reel__item figcaption { color: #fff; }

.show__item a.enq, .show__item .enq { display: inline-flex; height: auto; margin-top: 16px; transform: none; }
.show__item a.enq:hover { transform: none; }
.ed--dark .enq { border-color: rgba(255, 255, 255, .7); color: #fff; }
.ed--dark .enq:hover { background: #fff; color: var(--ink); }
.glance__second { margin-bottom: 10px; }
