/* ============================================================
   Standalone header/footer for the booking mini-site.
   The full www site carries its own nav/footer; this page is a
   single-purpose subdomain landing, so the chrome stays minimal
   and links nowhere unpublished.
   ============================================================ */

.mini-head {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border-soft);
}
.mini-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-block: 12px;
}
.mini-logo { display: block; height: 34px; width: auto; }
.mini-contact {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
}
.mini-contact a { color: var(--color-secondary); text-decoration: none; }
.mini-contact a:hover { color: var(--color-primary); }
.mini-contact span { color: var(--color-ink-soft); }

.mini-foot {
  /* Same dark surface as the www site's footer; flush against the CTA band above (no gap). */
  background: var(--color-surface-dark);
  color: rgba(255, 255, 255, 0.78);
  padding-block: 40px;
  margin-top: 0;
}
.mini-foot-row { display: flex; flex-direction: column; gap: 12px; max-width: 560px; }
.mini-foot-logo { display: block; width: 200px; height: auto; margin: 0; }
.mini-foot-desc { font-size: var(--text-sm); opacity: 0.85; }
.mini-foot-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid oklch(from currentColor l c h / 0.2);
  font-size: var(--text-xs);
  opacity: 0.85;
}
.mini-foot-bottom a { color: inherit; }

@media (max-width: 540px) {
  .mini-contact span, .mini-contact a:first-child { display: none; }
}