/* =============================================================================
   XOGENT.COM — Page-Specific Styles
   Hero background images and page-level overrides.
   Requires main.css to be loaded first.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   Home page
----------------------------------------------------------------------------- */
body.page-home .hero {
  background-image: url('/images/generated-1775077717690.png');
}

/* -----------------------------------------------------------------------------
   IT Foundation
----------------------------------------------------------------------------- */
body.page-it-foundation .hero {
  background-image: url('/images/generated-1775079465864.png');
}

body.page-it-foundation #benefits {
  background-image: url('/images/generated-1775079486682.png');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

body.page-it-foundation #benefits::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(11, 17, 32, 0.72);
  pointer-events: none;
}

body.page-it-foundation #benefits .container {
  position: relative;
  z-index: 1;
}

body.page-it-foundation #benefits .section-eyebrow {
  color: var(--accent-primary);
}

body.page-it-foundation #benefits h2,
body.page-it-foundation #benefits .feature-item {
  color: #ffffff;
}

/* -----------------------------------------------------------------------------
   Advanced Security
----------------------------------------------------------------------------- */
body.page-advanced-security .hero {
  background-image: url('/images/generated-1775079772231.png');
}

body.page-advanced-security #benefits {
  background-image: url('/images/generated-1775079784387.png');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

body.page-advanced-security #benefits::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(11, 17, 32, 0.72);
  pointer-events: none;
}

body.page-advanced-security #benefits .container {
  position: relative;
  z-index: 1;
}

body.page-advanced-security #benefits .section-eyebrow {
  color: var(--accent-primary);
}

body.page-advanced-security #benefits h2,
body.page-advanced-security #benefits .feature-item {
  color: #ffffff;
}

/* -----------------------------------------------------------------------------
   Compliance
----------------------------------------------------------------------------- */
body.page-compliance .hero {
  background-image: url('/images/generated-1775079890142.png');
}

body.page-compliance #outcomes {
  background-image: url('/images/generated-1775079916771.png');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

body.page-compliance #outcomes::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(11, 17, 32, 0.72);
  pointer-events: none;
}

body.page-compliance #outcomes .container {
  position: relative;
  z-index: 1;
}

body.page-compliance #outcomes .section-eyebrow {
  color: var(--accent-primary);
}

body.page-compliance #outcomes h2,
body.page-compliance #outcomes .feature-item {
  color: #ffffff;
}

/* -----------------------------------------------------------------------------
   Software Development
----------------------------------------------------------------------------- */
body.page-software-development .hero {
  background-image: url('/images/generated-1775080009051.png');
}

body.page-software-development #advantages {
  background-image: url('/images/generated-1775080031273.png');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

body.page-software-development #advantages::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(11, 17, 32, 0.72);
  pointer-events: none;
}

body.page-software-development #advantages .container {
  position: relative;
  z-index: 1;
}

body.page-software-development #advantages .section-eyebrow {
  color: var(--accent-primary);
}

body.page-software-development #advantages h2,
body.page-software-development #advantages .feature-item {
  color: #ffffff;
}

/* -----------------------------------------------------------------------------
   AI Automation
----------------------------------------------------------------------------- */
body.page-ai-automation .hero {
  background-image: url('/images/generated-1775080125118.png');
}

body.page-ai-automation #unified-view {
  background-image: url('/images/generated-1775080144475.png');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

body.page-ai-automation #unified-view::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(11, 17, 32, 0.72);
  pointer-events: none;
}

body.page-ai-automation #unified-view .container {
  position: relative;
  z-index: 1;
}

body.page-ai-automation #unified-view .section-eyebrow {
  color: var(--accent-primary);
}

body.page-ai-automation #unified-view h2,
body.page-ai-automation #unified-view p,
body.page-ai-automation #unified-view .feature-item {
  color: #ffffff;
}

/* -----------------------------------------------------------------------------
   vCSO / vCTO
----------------------------------------------------------------------------- */
body.page-vcso-vcto .hero {
  background-image: url('/images/generated-1775080256931.png');
}

body.page-vcso-vcto #vcto-section {
  background-image: url('/images/generated-1775080268619.png');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

body.page-vcso-vcto #vcto-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(11, 17, 32, 0.72);
  pointer-events: none;
}

body.page-vcso-vcto #vcto-section .container {
  position: relative;
  z-index: 1;
}

body.page-vcso-vcto #vcto-section .section-eyebrow,
body.page-vcso-vcto #vcto-section h2,
body.page-vcso-vcto #vcto-section p,
body.page-vcso-vcto #vcto-section .vcto-item {
  color: #ffffff;
}

body.page-vcso-vcto #vcto-section .section-eyebrow {
  color: var(--accent-primary);
}

/* -----------------------------------------------------------------------------
   News / Blog
----------------------------------------------------------------------------- */
body.page-news .hero {
  background-image: url('/images/generated-1775060986349.png');
}

/* -----------------------------------------------------------------------------
   Request Info — shorter hero
----------------------------------------------------------------------------- */
body.page-request-info .hero {
  background-image: url('/images/generated-1775080368986.png');
  min-height: 400px;
}

/* -----------------------------------------------------------------------------
   Page-specific layout overrides
----------------------------------------------------------------------------- */

/* Blog / News listing page */
body.page-news .article-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 48px;
}

@media (max-width: 1024px) {
  body.page-news .article-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  body.page-news .article-grid {
    grid-template-columns: 1fr;
  }
}

/* Request Info page — 2-column contact+form layout */
@media (max-width: 900px) {
  body.page-request-info .section .container > div[style*="display:flex"] {
    flex-direction: column;
    gap: 48px;
  }
  body.page-request-info .section .container > div[style*="display:flex"] > div:first-child {
    width: 100% !important;
  }
}

/* Service pages — alternating split layout */
body.page-it-foundation .split-section,
body.page-advanced-security .split-section,
body.page-compliance .split-section,
body.page-software-development .split-section,
body.page-ai-automation .split-section,
body.page-vcso-vcto .split-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}

body.page-it-foundation .split-section.reverse,
body.page-advanced-security .split-section.reverse,
body.page-compliance .split-section.reverse,
body.page-software-development .split-section.reverse,
body.page-ai-automation .split-section.reverse,
body.page-vcso-vcto .split-section.reverse {
  direction: rtl;
}

body.page-it-foundation .split-section.reverse > *,
body.page-advanced-security .split-section.reverse > *,
body.page-compliance .split-section.reverse > *,
body.page-software-development .split-section.reverse > *,
body.page-ai-automation .split-section.reverse > *,
body.page-vcso-vcto .split-section.reverse > * {
  direction: ltr;
}

@media (max-width: 768px) {
  body.page-it-foundation .split-section,
  body.page-advanced-security .split-section,
  body.page-compliance .split-section,
  body.page-software-development .split-section,
  body.page-ai-automation .split-section,
  body.page-vcso-vcto .split-section {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  body.page-it-foundation .split-section.reverse,
  body.page-advanced-security .split-section.reverse,
  body.page-compliance .split-section.reverse,
  body.page-software-development .split-section.reverse,
  body.page-ai-automation .split-section.reverse,
  body.page-vcso-vcto .split-section.reverse {
    direction: ltr;
  }
}

/* Home page — hero eyebrow accent */
body.page-home .hero-eyebrow {
  background: rgba(252, 175, 23, 0.10);
  border-color: rgba(252, 175, 23, 0.35);
}

/* AI Automation — slightly deeper dark overlay for readability */
body.page-ai-automation .hero::before {
  background: rgba(0, 0, 0, 0.78);
}

/* Advanced Security — cooler dark overlay */
body.page-advanced-security .hero::before {
  background: rgba(5, 10, 30, 0.70);
}
