/* ================================================================
   BACKGROUND — Space Grey Gradient + Subtle Checked Grid
   Dark:  deep Space Grey radial gradient + ultra-fine noise
   Light: cool near-white gradient + noise
   ::after: faint checked grid dissolves at edges
================================================================ */


::selection {
  background-color: #111; /* Your desired background color */
  color: #ffffff;            /* Text color during selection */
}

/* For older Firefox support */
::-moz-selection {
  background-color: #111;
  color: #ffffff;
}

.bg-scene {
  position:       fixed;
  inset:          0;
  z-index:        0;
  pointer-events: none;
  transition:     background 0.4s ease;
}

/* ── Space Grey gradient base ─────────────────────────────── */
[data-theme="dark"] .bg-scene {
  background:#000;
  /*  radial-gradient(ellipse 110% 72% at 74% -6%,
      #252525 0%,
      #171717 38%,
      #0d0d0d 68%,
      #080808 100%); */
}
[data-theme="light"] .bg-scene {
  /* background:#f7f4f2; */
  background: #ece7e3;
    /*radial-gradient(ellipse 120% 80% at 68% -6%,
      #ffffff 0%,
      #f8f8f8 45%,
      #f2f2f2 100%); */
}

/* ── Fine noise grain — anodised aluminium texture ────────── */
.bg-scene::before {
  content:    '';
  position:   absolute;
  inset:      0;
  pointer-events: none;
/*  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:   200px 200px;
  background-repeat: repeat; */
}
[data-theme="dark"]  .bg-scene::before { opacity: 0.14; mix-blend-mode: screen;   }
[data-theme="light"] .bg-scene::before { opacity: 0.16; mix-blend-mode: multiply; }

/* ── Checked grid + vignette — dissolves at edges ─────────── */
.bg-scene::after {
  content:    '';
  position:   absolute;
  inset:      0;
  pointer-events: none;
}

[data-theme="dark"] .bg-scene::after {
  background:
    linear-gradient(rgba(255,255,255,0.030) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.030) 1px, transparent 1px),
    radial-gradient(ellipse 100% 100% at 50% 50%,
      transparent 45%,
      rgba(0,0,0,0.40) 100%);
  background-size: 72px 72px, 72px 72px, 100% 100%;
  -webkit-mask-image: radial-gradient(ellipse 88% 82% at 50% 48%,
    black 0%, rgba(0,0,0,0.25) 55%, transparent 80%);
  mask-image: radial-gradient(ellipse 88% 82% at 50% 48%,
    black 0%, rgba(0,0,0,0.25) 55%, transparent 80%);
}

[data-theme="light"] .bg-scene::after {
/*  background:
    linear-gradient(rgba(0,0,0,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.045) 1px, transparent 1px),
    linear-gradient(180deg, transparent 65%, rgba(0,0,0,0.03) 100%);
  background-size: 72px 72px, 72px 72px, 100% 100%;
  -webkit-mask-image: radial-gradient(ellipse 88% 82% at 50% 48%,
    black 0%, rgba(0,0,0,0.18) 55%, transparent 78%);
  mask-image: radial-gradient(ellipse 88% 82% at 50% 48%,
    black 0%, rgba(0,0,0,0.18) 55%, transparent 78%); */
}

/* ── Legacy bg children — off ────────────────────────────── */
.bg-base-layer, .bg-aurora, .bg-orb, .bg-shard,
.bg-dust, .bg-grain, .bg-gloss, .bg-vignette,
.bg-corners, .bg-grid, .bg-glass,
.bg-glow, .bg-glow-1, .bg-glow-2, .bg-glow-3, .bg-glow-4 { display: none; }


.maxmgtop{margin-top: 40px;}
.mgtop{margin-top:20px !important;}
.left_align{justify-content: unset !important; display: block !important;}
button:disabled {background: none !important; background-image: none !important;}
.prj_details_txt{width: 50%;}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 252px;
    gap: 72px;
    align-items: start;}


.bgtheme{background: #fff !important; margin-top: 80px;}
.bgtheme_dark{background: #f7f4f2 !important; margin-top: 80px;}
.bgtheme_darker{background: #ece7e3 !important; margin-top: 80px;}
.bg_green{background: #0FA484 !important; margin-top: 80px;}
.bg_yellow{background: #e4af21 !important; margin-top: 80px;}
.bg_charcoal{background: #1F1F1F !important; margin-top: 80px;}
.bg_charcoal p{ color: #fff !important;}
.bg_charcoal h2{color: #111 !important; font-size:32px; font-weight: 200 !important;}
.bg_charcoal .btn-primary {color: #fff;}