/* ============================================================
   GLOBAL-BACKGROUND.CSS — AthenaS Premium Dark Theme
   Unified cinematic dark olive/green background system
   ============================================================ */

/* ── DESIGN TOKENS ── */
:root {
  /* Dark green base prevents white browser paint between pages */
  --ath-bg:        #020800;
  --ath-bg2:       #061306;
  --ath-bg3:       #0b1d0b;
  --ath-panel:     rgba(8, 18, 8, 0.88);
  --ath-line:      rgba(180, 255, 60, 0.14);
  --ath-line-soft: rgba(180, 255, 60, 0.06);
  --ath-lime:      #b4ff3c;
  --ath-lime-dim:  rgba(180, 255, 60, 0.12);
  --ath-text:      #ffffff;
  --ath-muted:     rgba(220, 240, 210, 0.74);
  --ath-shadow:    0 18px 48px rgba(0, 0, 0, 0.34);
  --ath-ease:      cubic-bezier(0.22, 1, 0.36, 1);
  --ath-radius:    12px;
  --ath-radius-lg: 18px;
  --ath-nav-h:     80px;
  --ath-container: min(1320px, calc(100% - 3rem));
  --ath-section-py: clamp(56px, 7vw, 120px);
}

/* ── HTML / BODY BASE ── */
html, body {
  height: 100%;
  min-height: 100%;
  background: #020800 !important;
  color: #ffffff;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  font-family: 'Poppins', 'Inter', sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--ath-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Dark full-page gradient keeps the canvas visible during navigation */
  background:
    radial-gradient(ellipse 80% 55% at 18% 0%, rgba(180,255,60,0.06), transparent 62%),
    linear-gradient(135deg, var(--ath-bg) 0%, var(--ath-bg2) 48%, var(--ath-bg3) 100%) !important;
  background-attachment: fixed;
  background-size: cover;
  position: relative;
}

/* ── AMBIENT BACKGROUND GLOW — fixed, subtle, no animation ── */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(ellipse 40% 30% at 10% 15%, rgba(180,255,60,0.07), transparent),
    radial-gradient(ellipse 30% 24% at 85% 12%, rgba(102,217,135,0.05), transparent),
    radial-gradient(ellipse 50% 30% at 50% 90%, rgba(180,255,60,0.035), transparent),
    linear-gradient(180deg, rgba(255,255,255,0.015), transparent 30%);
  background-repeat: no-repeat;
  will-change: transform;
}

body > * { position: relative; z-index: 1; }

/* ── TYPOGRAPHY SYSTEM ── */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Inter', sans-serif;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--ath-text);
}

h1 { font-size: clamp(2.8rem, 5.5vw, 4.5rem); font-weight: 800; }
h2 { font-size: clamp(2rem,   4vw,   3.25rem); font-weight: 800; }
h3 { font-size: clamp(1.4rem, 2.5vw, 2.375rem); font-weight: 700; }
h4 { font-size: clamp(1.1rem, 1.8vw, 1.5rem);  font-weight: 700; }

p, li { color: var(--ath-muted); line-height: 1.78; }

a { color: inherit; text-decoration: none; }

/* ── NAVBAR — premium glass dark ── */
.bx-navbar,
.site-header,
.main-header {
  background: rgba(2, 8, 4, 0.82) !important;
  border-bottom: 1px solid var(--ath-line) !important;
  box-shadow: 0 4px 32px rgba(0, 0, 0, 0.36) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
}

/* ── MAIN CONTENT ── */
main, #main, .page-wrapper, .site-main {
  background: transparent !important;
  animation: athPageIn 0.55s var(--ath-ease) both;
}

@keyframes athPageIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── INNER PAGE BODY — dark green, NOT white ── */
body:not(:has(#rv-hero)) {
  background:
    radial-gradient(ellipse 80% 55% at 18% 0%, rgba(180,255,60,0.06), transparent 62%),
    linear-gradient(135deg, var(--ath-bg) 0%, var(--ath-bg2) 48%, var(--ath-bg3) 100%) !important;
  color: var(--ath-text) !important;
  padding-top: var(--ath-nav-h);
}

/* ── HOMEPAGE BODY ── */
body:has(#rv-hero),
body.rv-page {
  background:
    radial-gradient(ellipse 80% 55% at 18% 0%, rgba(180,255,60,0.06), transparent 62%),
    linear-gradient(135deg, var(--ath-bg) 0%, var(--ath-bg2) 48%, var(--ath-bg3) 100%) !important;
  color: var(--ath-text) !important;
  padding-top: 0;
}

/* ── SECTIONS — transparent, let body bg show through ── */
section,
.section,
.hp-section,
.ab-section,
.sv-section,
.cr-section,
.ct-section,
.blg-meta-section,
.blg-cards-section,
.blg-bottom-section {
  position: relative;
  background-color: transparent !important;
  isolation: isolate;
  overflow: hidden;
}

/* ── SECTION SPACING ── */
.hp-section,
.ab-section,
.sv-section,
.cr-section,
.ct-section {
  padding-top:    var(--ath-section-py);
  padding-bottom: var(--ath-section-py);
}

/* Alternating section tint for depth */
.hp-section:nth-of-type(even),
.hp-dark,
.hp-testi-section {
  background: rgba(4, 14, 6, 0.60) !important;
}

/* ── HERO BANNERS — inner pages ── */
.ab-banner,
.sv-banner,
.sm-banner,
.cr-hero,
.ct-hero {
  position: relative;
  padding: clamp(100px, 12vw, 160px) 0 clamp(60px, 7vw, 100px);
  background:
    radial-gradient(ellipse 70% 80% at 15% 50%, rgba(184, 255, 57, 0.12), transparent),
    radial-gradient(ellipse 50% 60% at 85% 20%, rgba(49, 204, 120, 0.10), transparent),
    linear-gradient(180deg, rgba(2, 10, 4, 0.90), rgba(3, 14, 6, 0.95)) !important;
  overflow: hidden;
  min-height: 0;
}

/* ── CONTAINER ── */
.hp-wrap,
.ab-wrap,
.sv-wrap,
.cr-wrap,
.ct-wrap,
.blg-wrap,
.container,
.bx-container {
  width: var(--ath-container);
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}

/* ── CARDS — glassmorphism ── */
.hp-svc-card,
.hp-testi-card,
.hp-blog-card,
.hp-wf-card,
.hp-why-card,
.wad-card,
.cr-job-card,
.cr-why-card,
.cr-step-card,
.cr-search-card,
.ct-info-card,
.ct-form-card,
.blg-card,
.blg-widget,
.sv-rvx-card,
.ab-mv-card,
.ab-why-card {
  background: linear-gradient(145deg, rgba(14, 36, 14, 0.80), rgba(5, 14, 6, 0.72)) !important;
  border: 1px solid var(--ath-line) !important;
  box-shadow: 0 18px 56px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  border-radius: var(--ath-radius-lg) !important;
  transition: transform 0.36s var(--ath-ease), border-color 0.36s ease, box-shadow 0.36s ease !important;
}

.hp-svc-card:hover,
.hp-testi-card:hover,
.hp-blog-card:hover,
.hp-wf-card:hover,
.hp-why-card:hover,
.wad-card:hover,
.cr-job-card:hover,
.cr-why-card:hover,
.cr-step-card:hover,
.sv-rvx-card:hover,
.ab-mv-card:hover,
.ab-why-card:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(184, 255, 57, 0.32) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.44), 0 0 32px rgba(184, 255, 57, 0.10) !important;
}

/* ── LOGO CARDS — white bg for visibility ── */
.logo-card {
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* ── FORM INPUTS ── */
input, textarea, select {
  background: rgba(4, 14, 6, 0.72) !important;
  border-color: var(--ath-line) !important;
  color: var(--ath-text) !important;
}

input::placeholder, textarea::placeholder {
  color: rgba(226, 243, 215, 0.40) !important;
}

/* ── FOOTER ── */
.atf, footer, .site-footer {
  background:
    radial-gradient(ellipse 60% 50% at 15% 10%, rgba(184, 255, 57, 0.08), transparent),
    radial-gradient(ellipse 50% 40% at 85% 80%, rgba(49, 204, 120, 0.07), transparent),
    linear-gradient(180deg, rgba(2, 8, 4, 0.96), rgba(1, 4, 2, 0.99)) !important;
  border-top: 1px solid var(--ath-line) !important;
  margin-top: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* ── EYEBROW LABELS ── */
.hp-eyebrow,
.ab-eyebrow,
.sv-eyebrow,
.cr-eyebrow,
.ct-eyebrow,
.sm-eyebrow,
.rv-label {
  color: rgba(220, 255, 157, 0.88) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

/* ── OUTLINE ACCENT TEXT ── */
.hp-outline,
.ab-outline,
.sv-outline,
.cr-outline,
.ct-outline,
.sm-outline {
  color: transparent !important;
  -webkit-text-stroke: 1.5px var(--ath-lime) !important;
  text-stroke: 1.5px var(--ath-lime) !important;
}

/* ── ICON WRAPPERS ── */
.hp-svc-icon,
.hp-wf-icon,
.hp-why-icon,
.wad-card__icon-wrap,
.cr-job-card__icon,
.cr-why-card__icon,
.cr-step-icon,
.ct-info-icon,
.ab-mv-card__icon,
.ab-why-card__icon {
  background: rgba(184, 255, 57, 0.10) !important;
  border: 1px solid rgba(184, 255, 57, 0.18) !important;
  color: var(--ath-lime) !important;
  border-radius: var(--ath-radius) !important;
}

/* ── BUTTONS ── */
.rv-btn-primary,
.ab-btn-primary,
.sv-btn-primary,
.cr-apply-btn,
.ct-submit-btn,
.sm-btn--solid,
.atf-btn--solid {
  background: linear-gradient(135deg, #d4ff6a 0%, #b8ff39 50%, #8fd420 100%) !important;
  color: #061006 !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  box-shadow: 0 8px 28px rgba(184, 255, 57, 0.28) !important;
  transition: transform 0.28s var(--ath-ease), box-shadow 0.28s ease !important;
}

.rv-btn-primary:hover,
.ab-btn-primary:hover,
.sv-btn-primary:hover,
.cr-apply-btn:hover,
.ct-submit-btn:hover,
.sm-btn--solid:hover,
.atf-btn--solid:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 14px 40px rgba(184, 255, 57, 0.40) !important;
}

.rv-btn-outline,
.ab-btn-outline,
.sv-btn-outline,
.atf-btn--ghost {
  background: transparent !important;
  color: var(--ath-lime) !important;
  border: 1.5px solid rgba(184, 255, 57, 0.40) !important;
  border-radius: 999px !important;
  transition: background 0.28s ease, border-color 0.28s ease, transform 0.28s var(--ath-ease) !important;
}

.rv-btn-outline:hover,
.ab-btn-outline:hover,
.sv-btn-outline:hover,
.atf-btn--ghost:hover {
  background: rgba(184, 255, 57, 0.10) !important;
  border-color: var(--ath-lime) !important;
  transform: translateY(-3px) !important;
}

/* ── SECTION HEADINGS ── */
.hp-section-head,
.wad-head,
.ab-section-head,
.sv-section-head,
.cr-section-head,
.ct-section-head {
  text-align: center;
  max-width: 760px;
  margin: 0 auto clamp(40px, 5vw, 64px);
}

/* ── STATS BAND ── */
.hp-stats-band {
  background: linear-gradient(90deg, rgba(184, 255, 57, 0.10), rgba(49, 204, 120, 0.06)) !important;
  border-top: 1px solid var(--ath-line) !important;
  border-bottom: 1px solid var(--ath-line) !important;
  padding: 32px 0 !important;
}

.hp-stat-num { color: var(--ath-lime) !important; }
.hp-stat-lbl { color: rgba(226, 243, 215, 0.65) !important; }

/* ── MARQUEE ── */
.rv-marquee {
  background: rgba(184, 255, 57, 0.92) !important;
  padding: 14px 0 !important;
}

.rv-marquee-track span { color: #061006 !important; }

/* ── ABOUT PAGE ── */
.ab-page { background: transparent !important; color: var(--ath-text) !important; }
.ab-img-frame {
  border: 1px solid rgba(184, 255, 57, 0.20) !important;
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.44), 0 0 40px rgba(184, 255, 57, 0.08) !important;
  border-radius: var(--ath-radius-lg) !important;
  overflow: hidden !important;
}
.ab-exp-badge {
  background: rgba(4, 14, 6, 0.88) !important;
  border: 1px solid rgba(184, 255, 57, 0.28) !important;
}
.ab-exp-badge strong { color: var(--ath-lime) !important; }
.ab-stat-bar__track { background: rgba(184, 255, 57, 0.10) !important; }
.ab-stat-bar__fill  { background: linear-gradient(90deg, #b8ff39, #7fb516) !important; }
.ab-stat-bar__val   { color: var(--ath-lime) !important; }

/* ── SERVICES PAGE ── */
.sv-page { background: transparent !important; color: var(--ath-text) !important; }
.sv-img-frame {
  border: 1px solid rgba(184, 255, 57, 0.20) !important;
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.44) !important;
  border-radius: var(--ath-radius-lg) !important;
  overflow: hidden !important;
}
.sv-why__badge {
  background: rgba(4, 14, 6, 0.88) !important;
  border: 1px solid rgba(184, 255, 57, 0.24) !important;
}

/* ── CAREERS PAGE ── */
.cr-page { background: transparent !important; color: var(--ath-text) !important; min-height: 0 !important; }
.cr-job-badge {
  background: rgba(184, 255, 57, 0.10) !important;
  color: var(--ath-lime) !important;
  border: 1px solid rgba(184, 255, 57, 0.20) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
}
.cr-field input,
.cr-field select {
  background: rgba(4, 14, 6, 0.72) !important;
  border: 1px solid var(--ath-line) !important;
  color: var(--ath-text) !important;
  border-radius: 8px !important;
}
.cr-search-btn {
  background: linear-gradient(135deg, #b8ff39, #7fb516) !important;
  color: #061006 !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}
.cr-chip {
  border-color: rgba(184, 255, 57, 0.20) !important;
  color: rgba(226, 243, 215, 0.60) !important;
}
.cr-chip--active,
.cr-chip:hover {
  background: rgba(184, 255, 57, 0.12) !important;
  border-color: var(--ath-lime) !important;
  color: var(--ath-lime) !important;
}

/* ── CONTACT PAGE ── */
.ct-page { background: transparent !important; color: var(--ath-text) !important; min-height: 0 !important; }
.ct-info-icon {
  background: rgba(184, 255, 57, 0.10) !important;
  border: 1px solid rgba(184, 255, 57, 0.20) !important;
  color: var(--ath-lime) !important;
}
.ct-form input,
.ct-form textarea,
.ct-form select {
  background: rgba(4, 14, 6, 0.72) !important;
  border: 1px solid var(--ath-line) !important;
  color: var(--ath-text) !important;
  border-radius: 10px !important;
}
.ct-form input::placeholder,
.ct-form textarea::placeholder { color: rgba(226, 243, 215, 0.38) !important; }

/* ── BLOG PAGE ── */
.sm-page,
.blg-page { background: transparent !important; color: var(--ath-text) !important; }
.blg-widget__title {
  color: var(--ath-lime) !important;
  border-bottom: 1px solid var(--ath-line) !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
}
.blg-widget__list a { color: var(--ath-muted) !important; }
.blg-widget__list a:hover { color: var(--ath-lime) !important; }
.blg-card__cat { background: var(--ath-lime) !important; color: #061006 !important; }
.blg-card__cta { color: var(--ath-lime) !important; }

/* ── BLOG DETAIL / CATEGORY ── */
body:has(.blg-page),
body:has(.bcat-page),
body:has(.blog-detail-page),
body:has(.single-blog-page) {
  background: var(--ath-bg) !important;
  color: var(--ath-text) !important;
}

.blog-detail-page,
.bcat-page {
  background: transparent !important;
  color: var(--ath-text) !important;
}

.blog-detail-page .bd-widget,
.blog-detail-page .latest-posts-card,
.bcat-page .bcat-card {
  background: linear-gradient(145deg, rgba(14, 36, 14, 0.80), rgba(5, 14, 6, 0.72)) !important;
  border: 1px solid var(--ath-line) !important;
  border-radius: var(--ath-radius-lg) !important;
}

/* ── FLOATING CONTACT BAR ── */
.floating-contact-bar {
  position: fixed !important;
  right: 24px !important;
  bottom: 100px !important;
  top: auto !important;
  transform: none !important;
  z-index: 9990 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.scroll-to-top {
  position: fixed !important;
  right: 24px !important;
  bottom: 28px !important;
  z-index: 9985 !important;
  background: var(--ath-lime) !important;
  color: #061006 !important;
  border-radius: 50% !important;
  width: 48px !important;
  height: 48px !important;
  box-shadow: 0 8px 24px rgba(184, 255, 57, 0.30) !important;
}

@media (max-width: 768px) {
  .floating-contact-bar { right: 14px !important; bottom: 80px !important; }
  .scroll-to-top { right: 14px !important; bottom: 20px !important; }
}

/* ── ABOUT TEAM CMS CARDS ── */
.ab-team__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.ab-team-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(184, 255, 57, 0.14);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(184, 255, 57, 0.055), rgba(255, 255, 255, 0.025));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
  transition: transform .32s cubic-bezier(.22, 1, .36, 1), border-color .32s ease, box-shadow .32s ease;
}

.ab-team-card:hover {
  transform: translate3d(0, -8px, 0);
  border-color: rgba(184, 255, 57, 0.44);
  box-shadow: 0 0 0 1px rgba(184, 255, 57, 0.22), 0 22px 58px rgba(0, 0, 0, 0.36);
}

.ab-team-card__img {
  aspect-ratio: 4 / 4.5;
  background: rgba(255, 255, 255, 0.04);
  overflow: hidden;
}

.ab-team-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .42s cubic-bezier(.22, 1, .36, 1), filter .32s ease;
}

.ab-team-card:hover .ab-team-card__img img {
  transform: scale(1.045);
  filter: drop-shadow(0 0 18px rgba(184, 255, 57, 0.16));
}

.ab-team-card__body {
  padding: 22px;
}

.ab-team-card__body h3 {
  margin: 0 0 6px;
  color: #fff;
  font-size: 1.15rem;
  line-height: 1.25;
}

.ab-team-card__body span {
  display: block;
  color: var(--ath-lime, #b8ff39);
  font-size: .88rem;
  font-weight: 700;
  margin-bottom: 12px;
}

.ab-team-card__body p {
  color: rgba(255, 255, 255, 0.72);
  font-size: .94rem;
  line-height: 1.7;
  margin: 0;
}

.ab-team-card__links {
  display: flex;
  gap: 10px;
  margin-top: 16px;
}

.ab-team-card__links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(184, 255, 57, 0.18);
  color: var(--ath-lime, #b8ff39);
  background: rgba(184, 255, 57, 0.07);
  transition: transform .24s ease, box-shadow .24s ease, background-color .24s ease;
}

.ab-team-card__links a:hover {
  transform: translate3d(0, -3px, 0);
  background: rgba(184, 255, 57, 0.14);
  box-shadow: 0 0 20px rgba(184, 255, 57, 0.22);
}

@media (max-width: 1100px) {
  .ab-team__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .ab-team__grid { grid-template-columns: 1fr; }
  .ab-team-card__body { padding: 20px; }
}

/* ── GLOBAL MOTION PERFORMANCE ── */
.reveal,
.reveal-up,
.reveal-left,
.reveal-right,
.reveal-scale,
[data-animate],
[data-aos],
.sm-fade-up,
.sv-fade-up,
.sv-fade-left,
.sv-fade-right,
.ab-fade-up,
.ab-reveal-up,
.ab-reveal-left,
.ab-reveal-right,
.blg-card,
.hp-svc-card,
.hp-wf-card,
.hp-portfolio-card,
.hp-why-card,
.hp-testi-card,
.hp-blog-card,
.wad-card,
.clx-card,
.ab-team-card {
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}

@media (max-width: 768px) {
  .reveal,
  .reveal-up,
  .reveal-left,
  .reveal-right,
  .reveal-scale,
  [data-animate],
  [data-aos],
  .sm-fade-up,
  .sv-fade-up,
  .sv-fade-left,
  .sv-fade-right,
  .ab-fade-up,
  .ab-reveal-up,
  .ab-reveal-left,
  .ab-reveal-right {
    transition-duration: .42s !important;
  }
}

/* ── REDUCED MOTION ── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  body::before { display: none; }
}