/* Charte graphique Se loger — surcharge du thème cityscape */
:root {
  --brand-green: #33CC45;
  --brand-green-dark: #28a437;
  --brand-ink: #2C2A29;
  --brand-teal: #0A7C6E;
  --brand-amber: #F59E0B;
  --brand-orange: #FF6B35;
  --brand-bg: #FAFAFA;

  --heading-font: "Maven Pro", "Hind", sans-serif;
  --body-font: "Hind", sans-serif;

  --main-h: 128;
  --main-s: 60%;
  --main-l: 50%;
  --black-h: 20;
  --black-s: 4%;
  --black-l: 17%;
  --main-gradient: linear-gradient(90deg, #33CC45 0%, #2DBE40 50%, #28A437 100%);
  --main-gradient-rev: linear-gradient(270deg, #33CC45 0%, #2DBE40 50%, #28A437 100%);
}
body { background-color: var(--brand-bg); font-family: var(--body-font); }
h1, h2, h3, h4, h5, h6 { font-family: var(--heading-font); font-weight: 700; }
/* Contraste : le blanc sur #33CC45 est insuffisant, on passe en encre sombre */
.btn-main, .btn-main:hover, .btn-main:focus, .btn-main .text, .bg-main, .badge.bg-main { color: var(--brand-ink) !important; }
.btn-main { font-weight: 700; }
.btn-main:hover { color: var(--brand-ink) !important; }
::selection { background: var(--brand-green); color: var(--brand-ink); }
.text-main { color: var(--brand-green-dark) !important; }
.btn-secondary-brand { background: var(--brand-teal); color: #fff; }
.header-logo img, .logo img { max-height: 40px; width: auto; }

/* Navigation mobile (mobile first) */
.sl-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:9997;display:flex;background:#fff;border-top:1px solid #e9e9e9;padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -4px 20px rgba(0,0,0,.06)}
.sl-bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;color:#6b6865;font-size:11px;text-decoration:none;padding:4px 0;font-weight:600}
.sl-bottom-nav a i{font-size:24px;line-height:1}
.sl-bottom-nav a.active{color:var(--brand-green-dark)}
.sl-bottom-nav a.active i{color:var(--brand-green)}
@media (max-width:991.98px){body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}.floating-button,.scroll-top{bottom:84px !important}}
@media (display-mode:standalone){.preloader{display:none !important}}
img{max-width:100%}