:root{
  --ndr-red:#F97316;      /* screenshot ke close */
  --ndr-text:#5f5f5f;
  --ndr-dark:#2b2b2b;

  --ndr-white:#ffffff;
  --ndr-black:#0b0b0b;
  --ndr-overlay: rgba(0,0,0,.45);     /* full hero subtle shade */
  --ndr-panel: rgba(0,0,0,.55);       /* dark box behind text */
  
  --nd-red: #F97316;;       /* maroon/red tone */
  --nd-red-dark:#F97316;;
  --nd-text:#5f5f5f;
  --nd-title:#a63a37;
  --nd-line:#d9d9d9;
  --nd-strip-h: 120px;


}

.ndr-hero-cyber .ndr-hero-bg {
  background-image: url("./assets/Support Process/web-design.png") !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* ---------- PORTFOLIO GRID ---------- */
.nd-portfolio{
  background:#fff;
}

/* screenshot-like spacing */
.nd-gallery-grid{
  margin-top: 8px;
}

/* image card button */
.nd-shot{
  width:100%;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  position:relative;
  border-radius: 4px;
  overflow:hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transition: transform .18s ease, box-shadow .18s ease;
}

.nd-shot img{
  width:100%;
  height: 310px;            /* same feel as screenshot tiles */
  object-fit: cover;
  display:block;
  transform: scale(1.01);
  transition: transform .25s ease;
  background:#f2f2f2;
}

/* hover effect like overlay icon */
.nd-shot__overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.08);
  opacity:0;
  transition: opacity .18s ease;
  display:flex;
  align-items:center;
  justify-content:center;
}

.nd-shot__icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius: 6px;
  background: var(--nd-red); /* NetworkDoctor-ish maroon */
  color:#fff;
  font-size: 18px;
  box-shadow: 0 8px 16px rgba(0,0,0,.25);
}

.nd-shot:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0,0,0,.16);
}
.nd-shot:hover img{
  transform: scale(1.04);
}
.nd-shot:hover .nd-shot__overlay{
  opacity:1;
}

/* responsive tile height */
@media (max-width: 992px){
  .nd-shot img{ height: 280px; }
}
@media (max-width: 576px){
  .nd-shot img{ height: 240px; }
}

/* ---------- LIGHTBOX ---------- */
.nd-lightbox .modal-dialog{
  margin: 18px;
}

.nd-lightbox__content{
  background: #0b0b0b;
  border: 0;
  border-radius: 10px;
  overflow:hidden;
}

.nd-lightbox__header{
  border:0;
  padding: 10px 12px;
  background: linear-gradient(to bottom, rgba(0,0,0,.65), rgba(0,0,0,0));
}

.nd-lightbox .carousel-inner{
  background:#0b0b0b;
}

.nd-lightbox .carousel-item{
  text-align:center;
}

.nd-lightbox .carousel-item img{
  width: 100%;
  height: min(78vh, 820px);
  object-fit: contain;
  background:#0b0b0b;
}

/* make controls more visible */
.nd-lightbox .carousel-control-prev,
.nd-lightbox .carousel-control-next{
  width: 9%;
  min-width: 56px;
}