/* =============================================================
   CyberZeus Design Fixes October 2026
   Addresses: box visibility, shadows, padding, icon display,
   button colors, navbar visibility across all affected pages.
   Loaded LAST after cz-contrast-fix.css so it always wins.
   ============================================================= */

/* -----------------------------------------------------------------
   1. SERVICE BOXES Make visible with background, shadow, border
   Affects: software-development, desktop-application-developments,
   highend-application-designs, embedded-firmware, robotics-control-systems,
   dsp-engineering, satellite-engineering, satellite-ground-software,
   satellite-communications
   ----------------------------------------------------------------- */

/* Base iconbox cards give them a visible background + shadow */
.optech-iconbox-wrap4 {
  background-color: #ffffff !important;
  border: 1px solid #e8ecf1 !important;
  border-radius: 12px !important;
  padding: 28px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.optech-iconbox-wrap4:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.1) !important;
  border-color: rgba(226, 31, 54, 0.2) !important;
}

/* Override the transparent background inside core-services-cybersecurity */
.core-services-cybersecurity .optech-iconbox-wrap4 {
  background-color: #ffffff !important;
  border: 1px solid #e8ecf1 !important;
  border-radius: 12px !important;
  padding: 28px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
  margin-bottom: 30px !important;
}

.core-services-cybersecurity .optech-iconbox-wrap4:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.1) !important;
  border-color: rgba(226, 31, 54, 0.2) !important;
}

/* Fix icon container overlap / spacing */
.optech-iconbox-icon4 {
  width: 80px !important;
  height: 80px !important;
  border-radius: 14px !important;
  display: flex !important;
  flex-shrink: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 20px !important;
  background-color: #fff1f2 !important;
  border: 1px solid #fecdd3 !important;
}

.optech-iconbox-icon4 img {
  max-width: 50px !important;
  max-height: 50px !important;
  display: block !important;
}

/* Ensure icon text has proper padding */
.optech-iconbox-data4 {
  padding-top: 4px !important;
}

/* Alt box bg variant */
.altr-ntv-bx-bg .optech-iconbox-wrap4 {
  background-color: #f8f9fb !important;
}

.contrst-wtg .optech-iconbox-wrap4 {
  background-color: #f8f9fb !important;
}

/* Feature pro cybersecurity cards */
.featurepro-cybersecurity .optech-iconbox-wrap4 {
  background-color: #ffffff !important;
  padding: 24px !important;
  border: 1px solid #e0e4ea !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05) !important;
}

/* -----------------------------------------------------------------
   2. MAILGUARD AI Icon display + box shadow
   ----------------------------------------------------------------- */

.mg-feature {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}

.mg-feature .ic {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.mg-feature .ic i {
  display: inline-block !important;
  font-size: 26px !important;
  line-height: 1 !important;
}

/* -----------------------------------------------------------------
   3. DNA DECEPTOR Button borders, visible boxes, shadow, padding
   ----------------------------------------------------------------- */

/* Contact Sales / licensing buttons add visible borders */
.btn-lic {
  border: 2px solid rgba(226, 31, 54, 0.4) !important;
  border-radius: 10px !important;
  padding: 12px 24px !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.btn-lic-outline {
  border: 2px solid rgba(226, 31, 54, 0.5) !important;
  color: #ff8a80 !important;
  background: transparent !important;
}

.btn-lic-outline:hover {
  background: rgba(226, 31, 54, 0.1) !important;
  border-color: #E21F36 !important;
  color: #fff !important;
}

.btn-lic-primary {
  border: 2px solid #E21F36 !important;
  background: linear-gradient(135deg, #E21F36, #c0101f) !important;
  color: #fff !important;
}

.btn-lic-primary:hover {
  background: linear-gradient(135deg, #ff3a4a, #E21F36) !important;
  box-shadow: 0 8px 24px rgba(226, 31, 54, 0.35) !important;
}

/* DNA Deceptor cards shadow + padding */
.dn-hcard {
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.3) !important;
  padding: 24px 22px !important;
}

/* DNA Deceptor capability cards */
.cap {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.3) !important;
  padding: 26px 22px !important;
}

/* DNA Deceptor mode cards */
.mode-card {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
  padding: 20px 16px !important;
}

/* DNA Deceptor industry cards */
.ind-card {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
  padding: 18px 16px !important;
}

/* Licensing cards */
.lic-card {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
  padding: 32px 26px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 16px !important;
}

.lic-card--featured {
  border-color: rgba(226, 31, 54, 0.4) !important;
}

/* Deployment cards */
.dep {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important;
  padding: 22px 20px !important;
}

/* -----------------------------------------------------------------
   4. NEXUS AI Background + icon fixes
   ----------------------------------------------------------------- */

/* Nexus cap icons */
.cap .ic i,
.pb-card .pi i,
.dn-hcard .hc-icon i {
  display: inline-block !important;
  line-height: 1 !important;
}

/* -----------------------------------------------------------------
   5. NAVBAR VISIBILITY Ensure visible on all pages
   ----------------------------------------------------------------- */

/* Give the header a semi-transparent dark background before scroll */
.cyber-hdr .header {
  background: rgba(8, 10, 16, 0.85) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

/* When sticky (scrolled) solid white background */
.cyber-hdr.sticky-menu .header,
.cyber-hdr .header.active {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Nav links on initial load white on dark bg */
.cyber-hdr .header .menu > ul > li > a {
  color: #ffffff !important;
}

/* Nav links when sticky dark on white bg */
.cyber-hdr.sticky-menu .header .menu > ul > li > a,
.cyber-hdr .header.active .menu > ul > li > a {
  color: #111111 !important;
}

/* -----------------------------------------------------------------
   6. GAME DEVELOPMENT Button background color
   ----------------------------------------------------------------- */

/* Game dev section buttons use brand red instead of generic */
.game-n-develop .optech-default-btn,
body[class*="game"] .optech-default-btn {
  background: linear-gradient(135deg, #E21F36, #b0121f) !important;
  border-color: #E21F36 !important;
  color: #fff !important;
}

/* -----------------------------------------------------------------
   7. PRODUCT PAGE Button color
   ----------------------------------------------------------------- */

/* Product page CTA buttons */
.optech-portfolio-btn {
  border: 2px solid rgba(226, 31, 54, 0.3) !important;
}

.optech-portfolio-btn:hover {
  border-color: #E21F36 !important;
  background: rgba(226, 31, 54, 0.08) !important;
}

/* -----------------------------------------------------------------
   8. AWARDS PAGE Button color
   ----------------------------------------------------------------- */

/* Override the white background / light buttons on awards */
.awards-cta .optech-default-btn,
section[class*="award"] .optech-default-btn {
  background: #E21F36 !important;
  color: #fff !important;
}

section[class*="award"] .optech-default-btn .btn-wraper {
  color: #fff !important;
}

section[class*="award"] .optech-default-btn:hover {
  background: #c0101f !important;
}

/* Fix buttons that have inline white bg + red text to use red bg + white text */
.optech-default-btn[style*="background:#fff"],
.optech-default-btn[style*="background: #fff"],
.optech-default-btn[style*="background:white"] {
  background: #E21F36 !important;
  color: #fff !important;
}

.optech-default-btn[style*="background:#fff"] .btn-wraper,
.optech-default-btn[style*="background: #fff"] .btn-wraper,
.optech-default-btn[style*="background:white"] .btn-wraper {
  color: #fff !important;
}

/* -----------------------------------------------------------------
   9. CZ-FEATURE Make boxes visible (used across several pages)
   ----------------------------------------------------------------- */

.cz-feature {
  background: #ffffff !important;
  border: 1px solid #e8ecf1 !important;
  border-radius: 12px !important;
  padding: 24px 22px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.cz-feature:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.1) !important;
}

/* -----------------------------------------------------------------
   10. GENERAL ICON FIX Ensure Remix Icons render properly
   ----------------------------------------------------------------- */

[class^="ri-"],
[class*=" ri-"] {
  display: inline-block !important;
  font-style: normal !important;
  line-height: 1 !important;
}

/* -----------------------------------------------------------------
   11. DELIVERABLES SECTION Padding inside service boxes
   ----------------------------------------------------------------- */

.deliverables-sec {
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px solid #eef0f4 !important;
}