/* ===========================================
   DEFENCE / TACTICAL THEME — MIL VIBRANT
   Mirrors structure of CIV theme
   =========================================== */

/* -------------------------------------------
   ROOT OVERRIDES
   ------------------------------------------- */

.theme-mil {
  /* Tactical Infrared Palette */
  --theme-accent-strong: #ff6b3d;   /* IR orange */
  --theme-accent-soft:   #ff3b64;   /* IR red-pink */
  --theme-accent-alt:    #5bb7ff;   /* tactical blue */

  --theme-text-hero: #ffffff;
}

/* Logo + nav accent */
.theme-mil .vx-logo-mark {
  color: var(--theme-accent-strong);
}

.theme-mil .vx-nav a::after {
  background: linear-gradient(
    90deg,
    var(--theme-accent-strong),
    var(--theme-accent-alt)
  );
}

/* ===========================================
   BUTTONS
   =========================================== */

.theme-mil .btn-primary {
  background: var(--theme-accent-strong);
  color: #05070b;
  box-shadow: 0 10px 28px rgba(255, 107, 61, 0.45);
}

.theme-mil .btn-primary:hover {
  transform: translateY(-3px);
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.7),
    0 0 26px rgba(255, 107, 61, 0.7);
}

.theme-mil .btn-primary:active {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(255, 107, 61, 0.4);
}

.theme-mil .btn-secondary {
  border: 1px solid rgba(91, 183, 255, 0.7);
  color: var(--theme-accent-alt);
  background: rgba(5, 10, 18, 0.9);
}

.theme-mil .btn-secondary:hover {
  transform: translateY(-2px);
  background: rgba(9, 19, 32, 0.96);
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.75),
    0 0 22px rgba(91, 183, 255, 0.7);
  color: #ffffff;
}

/* ===========================================
   HERO — Tactical Dual-Tone Night
   =========================================== */

.theme-mil .hero--mil {
  position: relative;
  padding: 140px 0 120px;
  overflow: hidden;
  color: #ffffff;
  z-index: 0;

  background:
    /* cool blue fog on left */
    radial-gradient(ellipse 40% 70% at 10% 40%,
      rgba(54, 132, 214, 0.8),
      rgba(54, 132, 214, 0.18),
      transparent 70%
    ),
    /* hot IR orange on right */
    radial-gradient(ellipse 55% 80% at 105% 30%,
      rgba(255, 120, 40, 0.85),
      rgba(255, 120, 40, 0.08),
      transparent 80%
    ),
    /* IR red depth */
    radial-gradient(circle at 70% 80%,
      rgba(152, 32, 64, 0.55),
      transparent 70%
    ),
    /* base deep navy */
    linear-gradient(145deg, #05070c, #131c2f);
}

/* Focus vignette behind text for readability */
.theme-mil .hero--mil::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(ellipse 45% 50% at 24% 42%,
      rgba(3, 7, 18, 0.96),
      rgba(3, 7, 18, 0.6),
      transparent 80%
    );
}

/* Subtle irregular mask for organic feel */
.theme-mil .hero--mil::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;

  -webkit-mask-image:
    radial-gradient(circle at 30% 40%, black 60%, transparent 83%),
    radial-gradient(circle at 75% 30%, black 55%, transparent 85%),
    radial-gradient(circle at 50% 78%, black 70%, transparent 88%);
  -webkit-mask-composite: source-over, xor, xor;

  mask-image:
    radial-gradient(circle at 30% 40%, black 60%, transparent 83%),
    radial-gradient(circle at 75% 30%, black 55%, transparent 85%),
    radial-gradient(circle at 50% 78%, black 70%, transparent 88%);
  mask-composite: exclude;

  background:
    radial-gradient(circle at 65% 20%, rgba(91, 183, 255, 0.35), transparent 70%),
    radial-gradient(circle at 82% 55%, rgba(255, 107, 61, 0.25), transparent 78%);
}

/* Inner layout above masks */
.theme-mil .hero-inner {
  position: relative;
  z-index: 5;
  align-items: center;
}

/* Hero text styling */
.theme-mil .hero--mil h1,
.theme-mil .hero--mil p {
  color: #ffffff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.72);
}

/* ===========================================
   MIL HERO — CIV-LIKE LAYOUT + SLIDESHOW FIX
   =========================================== */

.theme-mil .hero-media .hero-image:nth-child(1)::after {
  background:
    radial-gradient(circle at 80% 20%, rgba(255,120,40,0.45), transparent 70%),
    radial-gradient(circle at 20% 80%, rgba(91,183,255,0.25), transparent 80%);
}

.theme-mil .hero-media .hero-image:nth-child(2)::after {
  background:
    radial-gradient(circle at 10% 20%, rgba(91,183,255,0.45), transparent 72%),
    radial-gradient(circle at 75% 80%, rgba(255,120,40,0.18), transparent 85%);
}


/* Constrain hero media to CIV width */
.theme-mil .hero-media {
  position: relative;
  max-width: 540px;        /* CIV EXACT VALUE */
  width: 100%;
  height: 480px;           /* matches CIV hero image height */
  justify-self: end;       /* aligns to right column */
  border-radius: 24px;
  overflow: hidden;        /* ensures slides do not overflow */
  z-index: 6;
}

/* Each hero-image = absolute slide */
.theme-mil .hero-media .hero-image {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.4s ease-out, transform 0.4s ease-out;
  border-radius: 24px;
}

/* Active slide visible */
.theme-mil .hero-media .hero-image.is-active {
  opacity: 1;
  transform: translateY(0);
  z-index: 2;               /* DO NOT change position: absolute */
}

/* Hero images follow CIV's scaling behavior */
.theme-mil .hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;        /* EXACTLY CIV behavior */
  border-radius: 24px;
  display: block;
}

/* CIV-style hero box shadow adapted to MIL palette */
.theme-mil .hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  pointer-events: none;
  z-index: 3;
  background:
    radial-gradient(circle at 65% 45%, rgba(134, 214, 255, 0.16), transparent 60%),
    radial-gradient(circle at 28% 60%, rgba(255, 107, 61, 0.15), transparent 65%);
}


/* Hero toggle styling */
.theme-mil .hero-toggle {
  margin-top: 22px;
  border-radius: 999px;
  background: rgba(3, 7, 16, 0.92);
  border: 1px solid rgba(91, 183, 255, 0.28);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.85);
}

.theme-mil .hero-toggle-btn {
  color: rgba(214, 224, 240, 0.76);
}

.theme-mil .hero-toggle-btn.is-active {
  background: linear-gradient(
    135deg,
    rgba(255, 107, 61, 0.96),
    rgba(91, 183, 255, 0.96)
  );
  color: #05070b;
}

/* ===========================================
   HERO AMBIENT MOTION – tactical blobs
   =========================================== */

.hero-fluid-top {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  overflow: visible !important;
}

.hero-fluid-top .hero-blob {
  position: absolute;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  filter: blur(28px);
  opacity: 0.6;
  mix-blend-mode: lighten;
  pointer-events: none;
}

/* Color + placement tuned for defence hero */
body.theme-mil .hero-fluid-top .hero-blob.blob1 {
  background: rgba(91, 183, 255, 0.85);
  top: 18%;
  left: 10%;
  animation: milBlobFloat1 14s cubic-bezier(.68,-0.55,.27,1.55) infinite alternate;
}

body.theme-mil .hero-fluid-top .hero-blob.blob2 {
  background: rgba(255, 120, 40, 0.85);
  top: 35%;
  left: 58%;
  animation: milBlobFloat2 18s cubic-bezier(.68,-0.55,.27,1.55) infinite alternate-reverse;
}

body.theme-mil .hero-fluid-top .hero-blob.blob3 {
  background: rgba(152, 32, 96, 0.8);
  top: 58%;
  left: 30%;
  animation: milBlobFloat3 22s cubic-bezier(.68,-0.55,.27,1.55) infinite alternate;
}

@keyframes milBlobFloat1 {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(150px, -110px) scale(1.24); }
  100% { transform: translate(0, 0) scale(1); }
}

@keyframes milBlobFloat2 {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(-180px, 130px) scale(1.25); }
  100% { transform: translate(0, 0) scale(1); }
}

@keyframes milBlobFloat3 {
  0%   { transform: translate(0, 0) scale(0.96); }
  50%  { transform: translate(150px, 160px) scale(1.18); }
  100% { transform: translate(0, 0) scale(0.96); }
}

/* ===========================================
   BODY BACKGROUND – strategic night palette
   =========================================== */

body.theme-mil {
  background:
    radial-gradient(ellipse 45% 30% at 18% 16%,
      rgba(91, 183, 255, 0.34),
      transparent 75%
    ),
    radial-gradient(ellipse 40% 28% at 80% 12%,
      rgba(255, 107, 61, 0.32),
      transparent 76%
    ),
    radial-gradient(ellipse 60% 45% at 20% 90%,
      rgba(18, 42, 76, 0.9),
      rgba(11, 24, 46, 0.95)
    ),
    linear-gradient(145deg, #05070c, #0f1a2a);
  color: rgba(225, 235, 248, 0.96);
}

/* Noise overlay */
body.theme-mil::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  /*background: url("../images/noise-4k.png");*/
  opacity: 0.04;
  mix-blend-mode: soft-light;
  z-index: 0;
}

/* Sections – very subtle structure on dark */
.theme-mil .section {
  background: linear-gradient(
    135deg,
    rgba(5, 10, 20, 0.9),
    rgba(7, 14, 26, 0.9)
  );
}

/* ===========================================
   TEXT & HEADINGS
   =========================================== */

.theme-mil .section-header h2 {
  color: var(--theme-accent-alt) !important;
}


.theme-mil h2,
.theme-mil h3 {
  color: var(--theme-accent-alt);
  font-weight: 600;
}

.theme-mil .section p,
.theme-mil .vx-container p {
  color: rgba(214, 224, 240, 0.9);
}

/* Hero hero text */
.theme-mil .hero--mil h1 {
  font-weight: 600;
}

/* ===========================================
   CARDS
   =========================================== */

.theme-mil .capability-card {
  background: rgba(5, 10, 18, 0.92) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  box-shadow:
    0 8px 26px rgba(0,0,0,0.65),
    0 0 22px rgba(91,183,255,0.12);
  color: #f4f7fc !important;
}

.theme-mil .capability-card p {
  color: rgba(228,235,248,0.92) !important;
}


.theme-mil .industry-card--mil {
  background: rgba(7, 13, 24, 0.96);
  border-top: 3px solid rgba(255, 107, 61, 0.9);
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.75),
    0 0 18px rgba(255, 107, 61, 0.28);
  color: rgba(225, 235, 248, 0.98);
}


.theme-mil .industry-card--mil p {
  color: rgba(220,230,244,0.95) !important;
}


.theme-mil .capability-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.9),
    0 0 20px rgba(91, 183, 255, 0.5);
}

.theme-mil .industry-card--mil:hover {
  transform: translateY(-3px);
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.85),
    0 0 18px rgba(255, 107, 61, 0.55);
  border-top-color: rgba(255, 160, 110, 0.98);
}

/* ===========================================
   FINAL CTA
   =========================================== */

.theme-mil .final-cta {
  background:
    radial-gradient(ellipse 70% 40% at 15% 0%,
      rgba(91, 183, 255, 0.22),
      transparent 70%
    ),
    radial-gradient(ellipse 72% 40% at 100% 0%,
      rgba(255, 107, 61, 0.24),
      transparent 72%
    ),
    linear-gradient(
      135deg,
      rgba(8, 16, 28, 0.98),
      rgba(5, 10, 18, 0.98)
    );
}

.theme-mil .final-cta-inner h2,
.theme-mil .final-cta-inner p {
  color: rgba(225, 235, 248, 0.96);
}

/* Buttons in CTA a bit brighter */
.theme-mil .final-cta .btn-primary:hover {
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.9),
    0 0 24px rgba(255, 107, 61, 0.8);
}

.theme-mil .final-cta .btn-secondary:hover {
  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.9),
    0 0 22px rgba(91, 183, 255, 0.8);
}

/* ===========================================
   FOOTER
   =========================================== */

.theme-mil .vx-footer {
  background: rgba(5, 10, 18, 0.98);
  border-top: 1px solid rgba(33, 54, 86, 0.9);
}

.theme-mil .footer-inner {
  color: rgba(158, 174, 198, 0.9);
}
.theme-mil .how-card {
  background: rgba(32, 44, 68, 0.88) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}


.theme-mil .how-card h3,
.theme-mil .how-card p {
  color: rgba(240, 245, 255, 0.95) !important;
}


.theme-mil p {
  color: rgba(225,235,248,0.92) !important;
}
/* =========================================================
   MIL THEME — REFINEMENTS (Option B)
   Cinematic but cleaner, more premium, aligned with CIV
   ========================================================= */

/* --- HERO BACKGROUND REFINEMENT --- */
/* Darker base + slightly softer gradients for clarity */
.theme-mil .hero--mil {
  background:
    radial-gradient(ellipse 35% 60% at 12% 40%,
      rgba(50, 120, 200, 0.55),
      rgba(50, 120, 200, 0.15),
      transparent 70%
    ),
    radial-gradient(ellipse 60% 80% at 110% 30%,
      rgba(255, 120, 40, 0.55),
      rgba(255, 120, 40, 0.05),
      transparent 80%
    ),
    linear-gradient(145deg, #05070b, #0d1421);
}

/* Subtle reduction of cinematic blobs — cleaner + more premium */
body.theme-mil .hero-fluid-top .hero-blob {
  opacity: 0.38;           /* was ~0.6, now more elegant */
  filter: blur(32px);       /* smoother, less noisy */
}

/* --- HERO IMAGE TINT REFINEMENT --- */
/* Keep cinematic moods but reduce "painted" look */
.theme-mil .hero-media .hero-image:nth-child(1)::after {
  background:
    radial-gradient(circle at 80% 20%, rgba(255,120,40,0.22), transparent 75%),
    radial-gradient(circle at 20% 80%, rgba(91,183,255,0.12), transparent 85%);
}

.theme-mil .hero-media .hero-image:nth-child(2)::after {
  background:
    radial-gradient(circle at 10% 20%, rgba(91,183,255,0.22), transparent 75%),
    radial-gradient(circle at 75% 80%, rgba(255,120,40,0.10), transparent 85%);
}

/* --- HERO TEXT IMPROVED CONTRAST & READABILITY --- */
.theme-mil .hero-text h1,
.theme-mil .hero-text p {
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.75);
}

/* Clean, crisp premium button look (aligned with CIV quality) */
.theme-mil .btn-primary,
.theme-mil .btn-secondary {
  box-shadow:
    0 6px 22px rgba(0, 0, 0, 0.55);
}

/* --- HIGHLIGHT/CTA REFINEMENT --- */
.theme-mil .btn-primary:hover {
  box-shadow:
    0 8px 26px rgba(0, 0, 0, 0.7),
    0 0 24px rgba(255,107,61,0.48);
}

.theme-mil .btn-secondary:hover {
  box-shadow:
    0 8px 26px rgba(0, 0, 0, 0.7),
    0 0 22px rgba(91, 183, 255, 0.45);
}

/* --- SECTION BACKGROUND REFINEMENT --- */
/* Slightly brighter, more like CIV, but still tactical */
.theme-mil .section {
  background: linear-gradient(
    135deg,
    rgba(8, 14, 24, 0.92),
    rgba(5, 10, 18, 0.92)
  );
}

/* --- CARD REFINEMENTS (Premium, less glow, more crisp) --- */

/* Capabilities (dark cards) */
.theme-mil .capability-card {
  background: rgba(8, 14, 22, 0.94) !important;
  box-shadow:
    0 6px 20px rgba(0, 0, 0, 0.55),
    0 0 14px rgba(91,183,255,0.08);
}

/* How-cards (light tactical panels) */
.theme-mil .how-card {
  background: rgba(28, 38, 56, 0.88) !important;
  border: 1px solid rgba(180, 200, 230, 0.16) !important;
  box-shadow:
    0 4px 14px rgba(0,0,0,0.4),
    0 0 8px rgba(91,183,255,0.04);
}

/* Use-case cards (MIL orange accents) */
.theme-mil .industry-card--mil {
  background: rgba(10, 18, 30, 0.95) !important;
  border-top-color: rgba(255, 120, 49, 0.85) !important;
  box-shadow:
    0 6px 20px rgba(0,0,0,0.65),
    0 0 14px rgba(255,107,61,0.12);
}

.theme-mil .industry-card--mil:hover {
  border-top-color: rgba(255, 160, 110, 0.95) !important;
}

/* --- HEADERS: Better balance with CIV --- */
.theme-mil h2,
.theme-mil h3 {
  color: #7FC4FF !important; /* tactical blue, softened */
}

/* --- CTA (Bottom) Refinement --- */
.theme-mil .final-cta {
  background:
    radial-gradient(ellipse 45% 40% at 20% 0%,
      rgba(91,183,255,0.18),
      transparent 70%
    ),
    radial-gradient(ellipse 55% 40% at 90% 20%,
      rgba(255,107,61,0.18),
      transparent 70%
    ),
    linear-gradient(135deg, #08101C, #050A12);
}
/* ===========================================
   MIL THEME — DARK HEADER FOR READABILITY
   =========================================== */

.theme-mil .vx-header {
  background: linear-gradient(
    180deg,
    rgba(5, 12, 22, 0.90),
    rgba(5, 12, 22, 0.88)
  );
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* Nav links on dark header */
.theme-mil .vx-nav a {
  color: rgba(225, 235, 245, 0.92);
}

.theme-mil .vx-nav a:hover {
  color: #ffffff;
}

/* Active link */
.theme-mil .vx-nav a.active {
  color: #ffffff;
}

/* Underline stays subtle but visible */
.theme-mil .vx-nav a::after {
  background: linear-gradient(
    90deg,
    rgba(255, 107, 61, 0.85),
    rgba(255, 153, 80, 0.65)
  );
}
/* ============================================================
   MIL THEME — Fix Contact CTA hover visibility + remove underline
   ============================================================ */

/* Remove underline animation */
.theme-mil .vx-nav .nav-cta::after {
  display: none !important;
}
.theme-mil .vx-nav .nav-cta:hover::after {
  display: none !important;
}

/* Normal state (ensure readable text) */
.theme-mil .nav-cta {
  color: #07121f !important;             /* deep navy text */
  background: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.12);
}

/* Hover state (fix invisible text issue) */
.theme-mil .nav-cta:hover {
  background: #ffffff !important;        /* keep white pill */
  color: #07121f !important;             /* readable text */
  box-shadow: 0 6px 14px rgba(255,107,61,0.32);  /* subtle MIL orange glow */
}
