/* ==========================================================================================================
   RV Resources Canada — custom.css
   Small look-and-feel changes live in this ONE file. Edit it, upload it to the /css/ folder on your site
   (it replaces the old copy) and every page changes — no other file needs to be touched.
   Visitors may need up to ~5 minutes (or a hard refresh: Ctrl+F5) to see a change.
   ========================================================================================================== */

/* ---- brand colours: change these and the whole site follows wherever the colour variables are used ---- */
:root {
  --forest: #a3150d;   /* deep red (headings, dark panels) */
  --pine:   #c02419;   /* mid red */
  --sage:   #d9382c;   /* light red */
  --trail:  #D52B1E;   /* Canadian flag red: buttons, accent line */
  --sky:    #fdecea;   /* very light red tint: hover backgrounds */
}

/* ---- header: white bar, full-colour logo, red accent line ---- */
.site-header { background: #fff; color: #222; border-bottom: 4px solid var(--trail); box-shadow: 0 2px 10px rgba(0,0,0,.10); }
.header-inner { padding: 8px 20px; }
.site-logo { gap: 0; }
.logo-img { display: block; height: 56px; width: auto; }          /* logo height on desktop */
.primary-nav a { color: #2a2a2a; }
.primary-nav a:hover, .primary-nav a:focus { background: var(--sky); color: var(--forest); }
.primary-nav a.nav-lang { border: 2px solid var(--trail); color: var(--forest); font-weight: 600; padding: 3px 11px; border-radius: 6px; background: #fff; margin-left: 4px; }
.primary-nav a.nav-lang:hover { background: var(--sky); }
.primary-nav a.nav-cta { background: var(--trail) !important; color: #fff !important; }   /* the "Add Listing" button */
.primary-nav a.nav-cta:hover { background: var(--forest) !important; }
.nav-more summary { color: #2a2a2a; }
.nav-more summary:hover, .nav-more[open] summary { background: var(--sky); color: var(--forest); }
.nav-more-menu { box-shadow: 0 10px 28px rgba(0,0,0,.2); border: 1px solid #eee; }
.menu-toggle { color: var(--forest); border: 2px solid var(--trail); border-radius: 6px; background: #fff; }

/* tablets and phones: the menu opens as a white panel */
@media (max-width: 1060px) {
  .primary-nav { background: #fff; border-top: 1px solid #eee; padding: 6px 0; }
  .primary-nav a { color: #2a2a2a; }
  .primary-nav a.nav-lang { margin: 6px 14px; text-align: center; justify-content: center; }
  .primary-nav a.nav-cta  { margin: 6px 14px; text-align: center; justify-content: center; }
}
@media (max-width: 520px) { .logo-img { height: 44px; } }       /* phones show the small leaf-and-RV mark */

/* ---- page heroes without their own photo: the default photo with the same green tint as the photo banners ----
   To change it, replace /images/photos/default-hero.jpg (keep the file name). Pages with .has-photo keep their own photo. */
.page-hero:not(.has-photo) {
  background-image: linear-gradient(135deg, rgba(26,58,42,.84) 0%, rgba(45,92,62,.62) 60%, rgba(26,58,42,.55) 100%), url(/images/photos/default-hero.jpg);
  background-size: cover; background-position: center 52%;
  padding-top: 64px; padding-bottom: 56px;
}
.page-hero:not(.has-photo)::before { display: none; }
.page-hero:not(.has-photo) h1 { text-shadow: 0 2px 14px rgba(0,0,0,.35); }
