/* Public site surfaces: keep the brand in accents, give rental content a calm ground.
   Scoped to marketing chrome and named sections; app themes and demos retain their palettes. */
nav#site-nav,
nav#site-nav.nav-over-dark,
nav#site-nav.nav-over-light,
nav#site-nav.nav-flush,
nav#site-nav.nav-flush:not(.nav-scrolled),
nav#site-nav.nav-flush.nav-over-dark:not(.nav-scrolled),
nav#site-nav.nav-flush.nav-over-light:not(.nav-scrolled) {
  background: var(--pastel-purple) !important;
  border-color: var(--ai-border) !important;
}
#site-nav :is(.mega-sheet, .sl-dropdown-grad, .sl-mobile-menu) {
  background: var(--surface) !important;
  border-color: var(--border) !important;
}
#site-nav :is(.nav-top, .pmega-title, .mega-ghost, .pq-link, .sl-v2-row,
 .sl-v2-sub, .sl-v2-t, #mobile-menu-btn),
#site-nav .mega-sheet a:hover .pmega-title {
  color: var(--text) !important;
}
#site-nav :is(.pmega-sub, .pq-label, .sl-v2-d, .sl-v2-subsection, .sl-v2-foot) {
  color: var(--text-muted) !important;
}
#site-nav :is(.pmega-ico, .pq-chip, .pmega-pill, .mega-head, .sl-v2-row-ico, .sl-v2-chip) {
  color: var(--brand-deep-teal) !important;
  border-color: var(--border) !important;
}
#site-nav :is(.pq-strip, .pq-link, .mz-band, .mega-ghost) {
  background: var(--surface-canvas) !important;
  border-color: var(--border) !important;
}
#site-nav .mega-sheet .mz-band :is(.text-slate-900, .text-slate-500, .text-slate-600) {
  color: var(--text-secondary);
}
#site-nav .mega-col a:hover { background: var(--surface-alt) !important; }
#site-nav :is(.sl-glow-purple, .sl-glow-teal) { opacity: .2; }
/* One scroll area keeps account actions above the phone's browser controls. */
#mobile-menu { top:100%; height:calc(100dvh - 80px); overflow:hidden; }
#mobile-menu .sl-mobile-scroll { height:100%; overflow-y:auto; overscroll-behavior:contain; padding-bottom:calc(24px + env(safe-area-inset-bottom)); -webkit-overflow-scrolling:touch; }
#mobile-menu > .sl-brand-hair { position:absolute; top:0; left:0; right:0; }
#mobile-menu .sl-mobile-account { background:var(--surface-canvas); border:1px solid var(--border); }
#mobile-menu .sl-mobile-account .text-white:not(.sl-pill-grad) { color:var(--text); }
#mobile-menu .sl-mobile-account .text-slate-400 { color:var(--text-muted); }
#mobile-menu .sl-mobile-actions a:not(.nav-cta-green) { display:flex; align-items:center; justify-content:center; min-height:48px; color:var(--text); background:var(--surface); border:1px solid var(--border-strong); }
#mobile-menu .sl-mobile-actions a:not(.nav-cta-green):hover { background:var(--surface-canvas); }
#mobile-menu .sl-mobile-actions a i { color:inherit; }
#mobile-menu .sl-acc-body.open { max-height:none; overflow:visible; }
#mobile-menu :is(a,button,summary):focus-visible { outline:2px solid var(--brand-deep-purple); outline-offset:2px; }
#mobile-menu :is(.sl-glow-purple,.sl-glow-teal,.sl-brand-hair) { display:none; }
#mobile-menu .sl-mobile-scroll { padding-top:16px; }
#mobile-menu .sl-mobile-account { padding:14px; margin-bottom:16px; border-radius:12px; }
#mobile-menu .sl-pill-grad { background:var(--pastel-purple); color:var(--brand-deep-purple); }
#mobile-menu .sl-v2-section { border-bottom:1px solid var(--border); }
#mobile-menu .sl-v2-row { gap:12px; padding:13px 2px; font-size:16px; line-height:24px; font-weight:600; }
#mobile-menu .sl-v2-row-ico { width:32px; height:32px; border:0; border-radius:8px; background:var(--pastel-purple); color:var(--brand-deep-purple) !important; }
#mobile-menu .sl-v2-row-chev { font-size:12px; color:var(--text-muted); }
#mobile-menu .sl-mobile-actions a { min-height:48px; border-radius:8px; font-size:14px; font-weight:600; box-shadow:none !important; }
#mobile-menu .sl-v2-foot { border-color:var(--border); margin-top:20px; padding-top:12px; }
#mobile-menu .sl-v2-foot a { display:inline-flex; align-items:center; min-height:44px; color:var(--text-muted); }
@media (max-width:1023px) {
  body.public-menu-open > header { position:fixed; top:0; left:0; right:0; z-index:120; }
  body.public-menu-open nav#site-nav,
  body.public-menu-open nav#site-nav.nav-flush.nav-over-light:not(.nav-scrolled),
  body.public-menu-open nav#site-nav.nav-flush.nav-over-dark:not(.nav-scrolled),
  body.public-menu-open nav#site-nav .nav-shell { background:var(--surface) !important; border-color:var(--border) !important; }
  body.public-menu-open #cookie-consent-banner { visibility:hidden; pointer-events:none; }
}
/* The footer is not repainted here any more: it carries its own surface
   switch (.pf--dark / .pf--light, base.html, 2026-09-11). */
/* Demo booking uses the same light canvas as contact and the walkthrough. */
.dmr-hero { background: var(--surface-canvas); color: var(--text); }
.dmr-hero::before, .dmr-hero::after { opacity: .18; }
.dmr-hero :is(.dmr-pill, .dmr-chip, .dmr-lede) {
  color: var(--text-secondary); border-color: var(--border-strong);
}
.dmr-hero .dmr-chip { background: var(--surface); }
.dmr-hero .dmr-chip i { color: var(--brand-deep-teal); }
.dmr-hero .dmr-h1 .g { background: none; color: var(--brand-deep-teal); }
/* Explicit opt-in for older resource and guide bands, including CTA bands. */
.public-light-section {
  background: var(--surface-canvas);
  color: var(--text);
  border-color: var(--border);
}
.public-light-section :is(h1, h2, h3) { color: var(--text); }
.public-light-section :is(p, li, .text-slate-300, .text-slate-400) {
  color: var(--text-muted);
}
.public-light-section :is(.text-white, .text-blue-400, .text-emerald-400):not(a, button, a *, button *) {
  color: var(--text);
}
.public-light-section a:not([class*="bg-"]) { color: var(--brand-deep-teal); }
nav#site-nav .nav-shell {
  background: var(--pastel-purple) !important;
  border-color: var(--ai-border);
  box-shadow: none;
}