/* Art direction of the photograph only. The four pages reuse the original header,
   text, reservation actions and offer conditions. */
.s139-hero--offers .s139-photos {
  display: block;
  background: radial-gradient(ellipse at 77% 23%, #34332b, transparent 65%),
              linear-gradient(139deg, #191d19 0%, #181c19 43%, #101411 100%);
}
.s139-hero--offers .s139-shot--invitation {
  display: block;
  position: absolute;
  inset: auto;
  inset-inline-end: -.65%;
  inset-block-start: clamp(27px, 5svh, 68px);
  width: min(80%, 147svh);
  height: auto;
  aspect-ratio: 1586 / 992;
  mask-image:
    linear-gradient(var(--towards), transparent, black 20%),
    linear-gradient(to bottom, transparent, black 12%, black 86%, transparent);
  mask-composite: intersect;
}
.s139-hero--offers .s139-shot--invitation img { object-fit: contain; }
[dir="rtl"] .s139-hero--offers .s139-shot--invitation img { transform: scaleX(-1); }
.s139-hero--offers .s139-photos::after {
  background:
    linear-gradient(to bottom, rgb(12 16 13 /.25), transparent 18%, transparent 76%, rgb(7 11 9 /.25)),
    linear-gradient(var(--towards), rgb(11 15 13 /.23) 0%, rgb(12 16 13 /.19) 41%, rgb(12 16 13 /.16) 49%, transparent 65%);
}
@media (min-width: 701px) and (min-aspect-ratio: 1/1) {
  .s139-hero--offers .s139-copy h1 {
    max-inline-size: min(45.2vw, 785px);
    text-wrap: balance;
  }
  .s139-hero--offers .s139-shot--invitation {
    width: min(74.5%, 139svh);
    inset-block-start: clamp(36px, 6.8svh, 80px);
  }
}
@media (max-width: 700px) {
  .s139-hero--offers .s139-photos {
    background: radial-gradient(ellipse at 58% 36%, #2e3029, transparent 53%),
                linear-gradient(to bottom, #151915, #1b1f1b 47%, #111512);
  }
  .s139-hero--offers .s139-shot--invitation {
    width: min(141%, 77svh);
    inset-inline-end: -2%;
    inset-block-start: clamp(61px, 9.3svh, 100px);
    mask-image: linear-gradient(to bottom, transparent 0%, black 11%, black 86%, transparent 100%);
  }
  .s139-hero--offers .s139-photos::after {
    background: linear-gradient(to bottom, rgb(12 16 13 /.21), transparent 17%, transparent 47%, rgb(12 16 13 /.1) 68%);
  }
}
@media (min-width: 701px) and (max-aspect-ratio: 1/1) {
  .s139-hero--offers .s139-shot--invitation { width: 100%; inset-block-start: 8svh; }
}
