/* The approved background is a single surface behind the map and booking. */
#top .tz-hero{
  display:block;
  min-height:0;
  padding-bottom:76px;
  border-radius:0;
  background:
    radial-gradient(120% 90% at 85% 112%, #4a2a1e 0%, transparent 55%),
    linear-gradient(180deg, #081019 0%, #0d1b27 55%, #14202a 100%);
}
#top .tz-visual{
  position:relative;
  min-height:clamp(600px,90vh,860px);
}
#top .tz-hero::after{
  content:"";
  display:block;
  position:absolute;
  left:0;right:0;bottom:0;
  height:140px;
  background:linear-gradient(180deg,transparent 0%,#081019 100%);
  z-index:2;
  pointer-events:none;
}
#top .tz-hero>.booking-panel{
  --muted:#566b7b;
  position:relative;
  z-index:6;
  margin:24px auto 0;
}
html[data-appearance=dark] #top .tz-hero>.booking-panel{--muted:#b9c4cc}
html[data-appearance=dark] body.midnight-site{--paper:#081019;background:#081019}
/* Keep the already-supported light appearance readable below the same hero. */
html[data-appearance=light] #top .tz-hero::after{background:linear-gradient(180deg,transparent 0%,#f2f5f7 100%)}

.midnight-site>footer{background:#0b1722;color:#f3ead8}
.midnight-site footer .midnight-footer-logo{display:inline-flex;align-items:center;gap:10px;color:#f3ead8}
.midnight-site footer .midnight-footer-logo>.midnight-word{font:700 29px/1 "Bricolage Grotesque",Arial,sans-serif!important;letter-spacing:-.025em}
.midnight-site footer .midnight-footer-logo .midnight-mark{width:36px;height:36px;--accent:#ffcf8f}
.midnight-site .large-logo{color:#f3ead8}
.midnight-site .large-logo>use{fill:none;stroke-linecap:round}
@media(max-width:860px){
  #top .tz-visual{display:flex;flex-direction:column;min-height:0}
  #top .tz-hero{padding-bottom:65px}
  #top .tz-hero>.booking-panel{margin-top:26px}
}
@media(max-width:700px){
  .midnight-site footer .midnight-footer-logo>.midnight-word{font-size:26px!important}
  .midnight-site footer .midnight-footer-logo .midnight-mark{width:32px;height:32px}
}