/*
 * acamp — minimal WP-integration overrides on top of acamp-legacy.css.
 *
 * Scoped to the legacy page template (page-template-page-acamp-home) so it
 * doesn't leak onto the rest of the WP site.  All visible design comes from
 * acamp-legacy.css; this file just neutralises Hello Elementor / Gutenberg /
 * Elementor-kit chrome that would otherwise shrink, pad, or repaint the
 * legacy DOM.
 */

/* 1. Body bg — match legacy --green so nothing bleeds through behind sections. */
body.page-template-page-acamp-home {
  background: var(--green) !important;
  color: var(--text) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 2. Hello Elementor's theme.css constrains .site-header:not(.dynamic-header)
 *    and .site-footer:not(.dynamic-footer) to max-width:1140px. We don't load
 *    its stylesheet anymore on this template, but keep this as a belt-and-
 *    braces guard for caches / different theme versions. */
body.page-template-page-acamp-home .site-header,
body.page-template-page-acamp-home .site-footer,
body.page-template-page-acamp-home main {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 3. Hide WP / Hello entry-title / page-header if any builder code injects them. */
body.page-template-page-acamp-home .entry-title,
body.page-template-page-acamp-home .page-header { display: none !important; }

/* 4. WP global-styles dumps padding on body via inline CSS; reset just in case. */
body.page-template-page-acamp-home {
  padding-top: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
}

/* 5. Elementor "kit" base CSS (`elementor-kit-N`) sets `body` font-family /
 *    color from kit settings. Force legacy fonts so headings/paragraphs match
 *    the original design even on first paint before legacy CSS finishes. */
body.page-template-page-acamp-home,
body.page-template-page-acamp-home p,
body.page-template-page-acamp-home a,
body.page-template-page-acamp-home button,
body.page-template-page-acamp-home span,
body.page-template-page-acamp-home li {
  font-family: 'Unbounded','Archivo Black',sans-serif !important;
}
body.page-template-page-acamp-home h1,
body.page-template-page-acamp-home h2,
body.page-template-page-acamp-home h3,
body.page-template-page-acamp-home .hero__headline,
body.page-template-page-acamp-home .section-head h2,
body.page-template-page-acamp-home .bucket-head__title,
body.page-template-page-acamp-home .stat__value {
  font-family: 'Unbounded','Archivo Black',sans-serif !important;
}

/* 6. Belt-and-braces hover restoration. Hello Elementor sets a global
 *    a:hover{color: ...} rule; legacy buttons keep their own colors. */
body.page-template-page-acamp-home .btn--primary,
body.page-template-page-acamp-home .btn--primary:hover,
body.page-template-page-acamp-home .btn--primary:focus {
  background: var(--lime) !important;
  color: var(--green) !important;
}
body.page-template-page-acamp-home .btn--secondary,
body.page-template-page-acamp-home .btn--secondary:focus {
  background: transparent !important;
  color: var(--white) !important;
  border: 1px solid var(--white) !important;
}
body.page-template-page-acamp-home .btn--secondary:hover {
  background: var(--white) !important;
  color: var(--green) !important;
  border-color: var(--white) !important;
}
body.page-template-page-acamp-home .btn--orange,
body.page-template-page-acamp-home .btn--orange:focus {
  background: var(--orange) !important;
  color: var(--white) !important;
}

/* Nav links — Hello Elementor adds underline on hover; we don't want that. */
body.page-template-page-acamp-home .nav-list a,
body.page-template-page-acamp-home .nav-list a:hover,
body.page-template-page-acamp-home .nav-list a:focus,
body.page-template-page-acamp-home .brand-lockup,
body.page-template-page-acamp-home .brand-lockup:hover {
  text-decoration: none !important;
}

/* 7. Hero bg parallax — main.js sets `style.transform = translate3d(0, y*0.25, 0) scale(1.08)`
 *    on every scroll tick. Combined with the fixed header transition this jitters
 *    the moment .is-scrolled flips on. Pin the image at scale(1.08) translate(0,0)
 *    via !important so the inline style is overridden — same look, no movement. */
body.page-template-page-acamp-home .hero__bg img {
  transform: scale(1.08) !important;
  will-change: auto !important;
}

/* 8. Sticky-header jitter — the moment .is-scrolled flips on, backdrop-filter
 *    starts blurring the whole hero through the header on every scroll frame.
 *    Combined with the parallax transform on .hero__bg img, that produces
 *    visible jank. Replace the blur with a solid translucent bg + isolate the
 *    header on its own GPU layer so it composites independently. */
body.page-template-page-acamp-home .site-header,
body.page-template-page-acamp-home .site-header.is-scrolled {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  will-change: transform;
  transform: translateZ(0);
}
body.page-template-page-acamp-home .site-header.is-scrolled {
  background: rgba(2, 40, 43, 0.96) !important;
}