/* Shared grid aligns the visual, existing booking form and existing reviews.
   No booking markup, data, event handlers or media timing are changed. */
#main:has(> .hero) {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(400px, 1fr);
  align-items: stretch;
}
#main:has(> .hero) > :not(.hero):not(.hotel-reputation) { grid-column: 1 / -1; }
#main > .hero { display: contents; }
#main > .hero > .hero-photo.cinematic-hero.exterior-hero {
  grid-column: 1; grid-row: 1 / 3;
  display: grid; grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(360px, 1fr) auto;
  min-width: 0; min-height: 0; height: auto; align-self: stretch;
}
#main .hero-photo.cinematic-hero.exterior-hero > .cinematic-poster,
#main .hero-photo.cinematic-hero.exterior-hero > .cinematic-video {
  grid-column: 1; grid-row: 1;
  position: relative; inset: auto; display: block;
  width: 100%; height: 100%; min-width: 0; min-height: 0;
  aspect-ratio: auto; contain: size;
  object-fit: cover; object-position: center 30%;
}
#main .hero-photo.cinematic-hero.exterior-hero::after {
  grid-column: 1; grid-row: 1;
  position: relative; inset: auto; width: 100%; height: 100%;
  min-height: 0; aspect-ratio: auto; contain: size;
  background: linear-gradient(180deg, #09120b20, transparent 26%, transparent 78%, #15231d);
}
#main .exterior-hero .cinematic-copy {
  grid-column: 1; grid-row: 2; min-width: 0;
  position: relative; inset: auto; padding: 28px 7% 30px;
}
#main .exterior-hero .cinematic-copy h1 { font-size: clamp(36px, 3.8vw, 58px); }
#main .exterior-hero .cinematic-copy > p { max-width: 660px; }
#main > .hero > .booking-search {
  grid-column: 2; grid-row: 1; align-self: stretch;
  width: 100%; max-width: none; min-width: 0;
  margin: 0; padding: 30px clamp(24px, 3vw, 48px) 24px;
  border: 0; border-left: 1px solid #dedce6; border-radius: 0;
  background: #fff; box-shadow: none;
}
#main > .hotel-reputation {
  grid-column: 2; grid-row: 2; min-width: 0;
  display: block; margin: 0; padding: 0 clamp(24px, 3vw, 48px) 28px;
  border: 0; border-left: 1px solid #dedce6;
  background: #fff;
}
#main > .hotel-reputation .guest-reputation {
  display: grid; grid-template-columns: 80px minmax(0, 1fr) 32px;
  align-items: center; gap: 18px; width: 100%; min-width: 0;
  margin: 0; padding: 22px 0 0; border: 0; border-top: 1px solid #dedce6;
  border-radius: 0; background: transparent; box-shadow: none; color: #1e1852;
}
#main > .hotel-reputation .guest-reputation > strong {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  grid-row: auto; grid-column: auto; gap: 3px;
  width: 80px; min-height: 76px; padding: 9px 6px;
  border: 1px solid #d9cfb9; border-radius: 9px;
  background: #f8f5ee; color: #1e1852;
  font-size: 38px; line-height: 1; font-weight: 400;
}
#main > .hotel-reputation .guest-reputation > strong small {
  color: #706650; font-size: 12px; line-height: 1.25;
}
#main > .hotel-reputation .guest-reputation > span {
  grid-row: auto; grid-column: auto; min-width: 0; gap: 6px;
}
#main > .hotel-reputation .guest-reputation b {
  color: #1e1852; font-size: 15px; line-height: 1.4; font-weight: 600;
}
#main > .hotel-reputation .guest-reputation > span small {
  color: #676275; font-size: 12px; line-height: 1.55;
}
#main > .hotel-reputation .guest-reputation > svg {
  grid-row: auto; grid-column: auto; width: 32px; height: 44px;
  margin: 0; padding: 7px; border: 0; border-radius: 0;
  color: #1e1852;
}
#main > .hotel-reputation .guest-reputation:hover > strong { border-color: #9a865d; }
#main > .hotel-reputation .guest-reputation:focus-visible {
  outline: 2px solid #1e1852; outline-offset: 5px;
}
@media (max-width: 1050px) and (min-width: 961px) {
  #main .exterior-hero .cinematic-copy h1 { font-size: 37px; }
  #main > .hero > .booking-search { padding-inline: 24px; }
  #main > .hotel-reputation { padding-inline: 24px; }
}
@media (max-width: 960px) {
  #main:has(> .hero) { grid-template-columns: minmax(0, 1fr); }
  #main > .hero > .hero-photo.cinematic-hero.exterior-hero {
    grid-column: 1; grid-row: 1;
    grid-template-rows: clamp(210px, 66.667vw, 520px) auto;
  }
  #main > .hero > .booking-search {
    grid-column: 1; grid-row: 2; border-left: 0;
    padding: 32px max(6%, calc((100% - 600px) / 2)) 22px;
  }
  #main > .hotel-reputation {
    grid-column: 1; grid-row: 3; border-left: 0;
    padding: 0 max(6%, calc((100% - 600px) / 2)) 30px;
  }
  #main .exterior-hero .cinematic-copy h1 { font-size: clamp(34px, 6.4vw, 52px); }
}
@media (max-width: 480px) {
  #main > .hero > .booking-search { padding-top: 28px; }
  #main .exterior-hero .cinematic-copy h1 { font-size: clamp(30px, 8.8vw, 38px); }
  #main > .hotel-reputation .guest-reputation {
    grid-template-columns: 68px minmax(0, 1fr) 26px; gap: 12px;
  }
  #main > .hotel-reputation .guest-reputation > strong { width: 68px; min-height: 70px; font-size: 34px; }
  #main > .hotel-reputation .guest-reputation b { font-size: 13px; }
  #main > .hotel-reputation .guest-reputation > span small { font-size: 11px; }
  #main > .hotel-reputation .guest-reputation > svg { width: 26px; padding: 5px; }
}
@media (min-width: 1921px) {
  #main { max-width: 1920px; margin-inline: auto; }
  .header, .footer { padding-inline: calc((100% - 1748px) / 2); }
}