/* JUNCA HR V3 FINAL IMAGE OVERRIDE */
/* Use this after page CSS to force final V2 images. */

:root {
  --junca-navy: #071A33;
  --junca-deep-navy: #041225;
  --junca-gold: #C7A552;
}

.junca-hero,
.page-hero {
  background-color: var(--junca-deep-navy);
  background-size: cover;
  background-position: center;
  position: relative;
}

/* Apply overlay only when page structure does not already include an overlay */
.junca-hero.has-v3-overlay::after,
.page-hero.has-v3-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(4,18,37,.48);
  pointer-events: none;
}

.page-top .junca-hero,
.top-page .page-hero { background-image: url("../images/webp/top_hero_junca_hr.webp"); }

.page-about .junca-hero,
.about-page .page-hero { background-image: url("../images/webp/about_junca_hr.webp"); }

.page-philosophy .junca-hero,
.philosophy-page .page-hero { background-image: url("../images/webp/philosophy_junca_hr.webp"); }

.page-services .junca-hero,
.services-page .page-hero { background-image: url("../images/webp/services_junca_hr.webp"); }

.page-global .junca-hero,
.global-page .page-hero { background-image: url("../images/webp/global_junca_hr.webp"); }

.page-technology .junca-hero,
.technology-page .page-hero { background-image: url("../images/webp/hr_technology_junca_hr.webp"); }

.page-company .junca-hero,
.company-page .page-hero { background-image: url("../images/webp/company_junca_hr.webp"); }

.page-careers .junca-hero,
.careers-page .page-hero { background-image: url("../images/webp/careers_junca_hr.webp"); }

.page-contact .junca-hero,
.contact-page .page-hero { background-image: url("../images/webp/contact_junca_hr.webp"); }

.site-footer {
  background-image: linear-gradient(rgba(4,18,37,.88), rgba(4,18,37,.94)), url("../images/webp/footer_brand_mood_junca_hr.webp");
  background-size: cover;
  background-position: center;
}

/* Force light background and dark text on services page to resolve body background conflict */
body.page-services {
  background: #ffffff !important;
  color: #263238 !important;
}

body.page-services h1, 
body.page-services h2, 
body.page-services h3 {
  color: #071A33 !important;
}

body.page-services .hero h1,
body.page-services .hero p,
body.page-services .cta h2,
body.page-services .cta p {
  color: #ffffff !important;
}


/* --- SITE-WIDE UNIFIED HEADER STYLES --- */
header.site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 88px !important;
  background: rgba(11, 16, 32, 0.85) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 40px !important;
  color: #ffffff !important;
}

header.site-header a.brand {
  display: flex !important;
  align-items: center !important;
  text-decoration: none !important;
}

header.site-header a.brand img {
  height: 38px !important;
  width: auto !important;
  display: block !important;
}

header.site-header nav.nav,
header.site-header nav {
  display: flex !important;
  gap: 28px !important;
  margin: 0 auto !important; /* Centering the navigation menu */
  align-items: center !important;
}

header.site-header nav a {
  color: rgba(255, 255, 255, 0.85) !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  transition: color 0.25s ease !important;
  opacity: 1 !important;
  margin: 0 !important;
}

header.site-header nav a:hover {
  color: #C7A552 !important; /* Gold hover color */
}

header.site-header .header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

header.site-header .header-actions a.btn-small {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #C7A552, #b0963a) !important;
  color: #111620 !important;
  padding: 10px 22px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 15px rgba(199, 165, 82, 0.2) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

header.site-header .header-actions a.btn-small:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(199, 165, 82, 0.3) !important;
}

/* Hide lang button on subpages to match index, or keep hidden on mobile */
@media (max-width: 900px) {
  header.site-header {
    height: 72px !important;
    padding: 0 20px !important;
  }
  header.site-header nav.nav,
  header.site-header nav {
    display: none !important; /* Hide menu on mobile */
  }
  header.site-header .header-actions {
    display: none !important;
  }
}