:root {
  --aisc-blue: rgba(0, 180, 255, 0.9);
  --aisc-blue-soft: rgba(0, 180, 255, 0.4);
}

/* ===== BASE FIX ===== */
.aisc-content {
  position: relative;
  z-index: 1;
}

/* ===== ABOUT PAGE BACKGROUND ===== */
body.page-id-404 {
  margin: 0 !important;
  padding: 0 !important;

  background-image: url("https://aiscworld.com/wp-content/uploads/2026/02/aisc_background.png") !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* REMOVE THEME WRAPPERS */
body.page-id-404 .site,
body.page-id-404 .site-content,
body.page-id-404 .content-area,
body.page-id-404 #primary,
body.page-id-404 main {
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  background: transparent !important;
}

/* REMOVE ANY BLUR OVERLAY */
body.page-id-404::before {
  content: none !important;
}

/* ===== MAIN PAGE LAYOUT ===== */
body.page-id-404 .aisc-page-wrap {
  width: 100%;
  margin: 0 !important;
  padding-top: 10px !important;

  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ===== CONTENT WRAPPER ===== */
body.page-id-404 .aisc-content {
  width: 100%;
  max-width: 900px;

  margin: 0 auto !important;

  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ===== TITLE ===== */
body.page-id-404 .about-intro {
  text-align: center;
  margin: 5px 0 !important;
}

body.page-id-404 .about-intro h1,
body.page-id-404 .about-intro p {
  margin: 0 !important;
  text-align: center !important;
}

/* ===== SIDE-BY-SIDE LAYOUT (FIXED) ===== */
/* ===== PERFECT ALIGNMENT ===== */
body.page-id-404 .aisc-main {
  display: flex !important;
  flex-direction: row !important;

  justify-content: center !important;
  align-items: center !important;  /* 🔥 THIS FIXES ALIGNMENT */

  gap: 40px;

  width: 100%;
  max-width: 1000px;

  margin: 10px auto !important;
}

/* LEFT: CUBE */
body.page-id-404 .ai-scene {
  margin-top: -5px !important;
}

/* RIGHT: GLASS PANEL */
body.page-id-404 .glass-box {
  background: rgba(10, 30, 60, 0.35);
  border: 1px solid var(--aisc-blue-soft);

  box-shadow:
    0 0 12px var(--aisc-blue-soft),
    0 0 30px rgba(0, 180, 255, 0.2),
    0 10px 30px rgba(0,0,0,0.4);

  transition: all 0.3s ease;
}

  /* 🔥 REMOVED BLUR */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;

  color: #fff;
  text-align: left;

  box-shadow:
    0 0 20px rgba(255,255,255,0.15),
    0 10px 30px rgba(0,0,0,0.3);
}

/* ===== TEXT ===== */
body.page-id-404 #impact-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
}

body.page-id-404 #impact-desc {
  font-size: 15px;
  opacity: 0.9;
  line-height: 1.5;
}

/* ===== ACTIVE FACE ===== */
.ai-face.active-face {
  border: 1.5px solid rgba(0, 200, 255, 0.9);

  background: rgba(0, 180, 255, 0.18);

  box-shadow:
    0 0 18px rgba(0, 200, 255, 0.9),
    0 0 40px rgba(0, 200, 255, 0.4),
    inset 0 0 12px rgba(0, 200, 255, 0.25);
}
/* ===== REMOVE HEADER GAP (CONTROLLED) ===== */
body.page-id-404 .aisc-page-wrap {
  position: relative;
  top: -20px;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  body.page-id-404 .aisc-main {
    flex-direction: column !important;
    align-items: center !important;
  }

  body.page-id-404 .glass-box {
    width: 100%;
    max-width: 320px;
  }
}
/* EXPANDED CONTENT PANEL */
/* ===== GLASS BOX (AISC BLUE STYLE) ===== */
.glass-box {
  width: 340px;
  padding: 22px;

  /* 🔥 TRUE GLASS */
  background: rgba(10, 30, 60, 0.35); /* deep blue glass */
  border: 1px solid rgba(0, 180, 255, 0.6);

  border-radius: 14px;

  /* SOFT BLUR (NOT OPAQUE) */
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  color: #ffffff;
  text-align: left;

  /* 🔥 BLUE AI GLOW */
  box-shadow:
    0 0 12px rgba(0, 180, 255, 0.6),
    0 0 30px rgba(0, 180, 255, 0.25),
    0 10px 30px rgba(0,0,0,0.4);

  transition: all 0.3s ease;
}

/* DETAIL TEXT */
#impact-detail {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.6;
  opacity: 0.9;
}
/* ===== REMOVE ALL TOP SPACING (ABOUT PAGE ONLY) ===== */
/* 🚨 REMOVE THEME PAGE HEADER (CAUSE OF BIG GAP) */
body.page-id-404 .page-header,
body.page-id-404 .entry-header,
body.page-id-404 .hero,
body.page-id-404 .hero-section {
  display: none !important;
}

/* ===== PULL CONTENT DIRECTLY UNDER HEADER ===== */
body.page-id-404 .aisc-page-wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;

  position: relative;
  top: -40px;   /* 🔥 key adjustment */
}

/* ===== REMOVE TITLE SPACING ===== */
body.page-id-404 .about-intro {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ===== REMOVE EXTRA TEXT SPACING ===== */
body.page-id-404 h1,
body.page-id-404 p {
  margin-top: 0 !important;
}

/* ===== KEEP EVERYTHING CENTERED ===== */
body.page-id-404 .aisc-content {
  align-items: center;
}
/* ===== REMOVE FINAL HEADER GAP ===== */
body.page-id-404 header {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* REMOVE HIDDEN TOP SPACING */
/* FORCE CONTENT TO VERY TOP */
body.page-id-404 .site-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* REMOVE BLOCK SPACING */
body.page-id-404 .wp-block-group,
body.page-id-404 .wp-block-post-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* FINAL ALIGN */
body.page-id-404 .aisc-page-wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* REMOVE ANY FIRST ELEMENT GAP */
body.page-id-404 .about-intro {
  margin-top: 0 !important;
}
/* ===== REMOVE LARGE TOP GAP ===== */

/* Pull entire About section upward */
body.page-id-404 .aisc-page-wrap {
  margin-top: -120px !important;   /* 🔥 removes ~1.5 inch gap */
  padding-top: 0 !important;
}

/* Remove hidden wrapper spacing */
body.page-id-404 .site-content,
body.page-id-404 .content-area,
body.page-id-404 #primary {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Remove block/editor spacing */
body.page-id-404 .wp-block-group,
body.page-id-404 .wp-block-post-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* ===== CLEAN TOP SPACING ===== */
body.page-id-404 .aisc-page-wrap {
  margin-top: -90px !important;   /* pulls content up */
  padding-top: 15px !important;   /* adds controlled gap */
}