/* One continuous cream canvas, using the documented JUPACH brand palette. */
:root { --jp-canvas: #FFF7E6; }
html, html body { background: var(--jp-canvas); }

html body #jupach-header-root,
html body #jupach-header-root .jp-header-panel,
html body #jupach-home-hero,
html body main > .section,
html body main > .section.container,
html body main > #jupach-news-section,
html body main > .detail,
html body main > .community-finder,
html body main > .jupach-calendar,
html body main > #encuentra-tu-comunidad,
html body main > #coordinaciones,
html body main > #jupach-gallery-section {
  background: var(--jp-canvas) !important;
  border: 0 !important;
  box-shadow: none;
}

/* Keep the original photographic page headers and blue footer intact. */
html body #jupach-header-root::before,
html body main > .jupach-calendar::before { background: none; }
/* Keep these explicit: earlier production rules colour these sections by ID. */
html body main > #encuentra-tu-comunidad { background: var(--jp-canvas) !important; }
html body main > #coordinaciones { background: var(--jp-canvas) !important; }
html body main > #jupach-gallery-section { background: var(--jp-canvas) !important; }
html body main > #jupach-news-section { background: var(--jp-canvas) !important; }
html body main .section .container.detail { background: transparent !important; box-shadow: none; }

/* Restore the exact photographic treatment from the original shared styles.css. */
html body main > .page-hero {
  background-image: linear-gradient(90deg,#102c4def,#102c4d88), url('https://images.unsplash.com/photo-1529156069898-49953e39b3ac?auto=format&fit=crop&w=1800&q=85');
  background-position: center;
  background-size: cover;
  color: #fff;
}

/* A straight four-colour separator at the bottom of the shared header. */
html body #jupach-home-hero::before { content: none; display: none; }
html body #jupach-header-root::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(to right,
    #008000 0%, #008000 25%,
    #ED2100 25%, #ED2100 50%,
    #0F52BA 50%, #0F52BA 75%,
    #F67239 75%, #F67239 100%);
  pointer-events: none;
  z-index: 2;
}


/* The official blue-background logo has white lettering and transparent pixels. */
html body .footer .brand.brand-official img { background: transparent; border-radius: 0; object-fit: contain; }
