/* ============================================================
   NIBRA Solutions — advanced.css
   Trending premium design upgrade:
   Deep space bg · Purple-blue gradient brand · Glassmorphism
   Premium logo display · Advanced hover states
   ============================================================ */

/* ── NEW COLOR PALETTE ── */
:root {
  /* Override core palette to trending purple-blue-cyan */
  --nb-bg:        #03020a;
  --nb-bg2:       #06050f;
  --nb-bg3:       #0a0818;
  --nb-surface:   #0d0b1e;
  --nb-surface2:  #110f25;
  --nb-card:      #0f0d22;
  --nb-card2:     #141230;

  --nb-blue:      #4f6ef7;
  --nb-blue2:     #3b5bdb;
  --nb-blue3:     #2545c4;
  --nb-purple:    #7c3aed;
  --nb-purple2:   #6d28d9;
  --nb-cyan:      #06e8f5;
  --nb-cyan2:     #22d3ee;
  --nb-indigo:    #4338ca;
  --nb-pink:      #ec4899;

  --nb-glow:       rgba(124,58,237,0.35);
  --nb-glow-blue:  rgba(79,110,247,0.3);
  --nb-glow-cyan:  rgba(6,232,245,0.15);
  --nb-blue-a10:   rgba(79,110,247,0.10);
  --nb-blue-a20:   rgba(79,110,247,0.20);
  --nb-border:     rgba(124,58,237,0.15);
  --nb-border2:    rgba(79,110,247,0.28);
  --nb-border3:    rgba(6,232,245,0.35);
  --nb-shadow-blue:0 8px 32px rgba(79,110,247,0.45);

  --nb-text:      #f0eeff;
  --nb-text2:     #c4baff;
  --nb-muted:     #7b70a8;
  --nb-muted2:    #4a4578;

  /* dp- aliases */
  --dp-blue:        var(--nb-blue);
  --dp-blue-dark:   var(--nb-blue3);
  --dp-blue-light:  var(--nb-cyan2);
  --dp-indigo:      var(--nb-purple);
  --dp-accent:      var(--nb-cyan);
  --dp-bg:          var(--nb-bg);
  --dp-bg2:         var(--nb-bg2);
  --dp-surface:     var(--nb-surface);
  --dp-text:        var(--nb-text);
  --dp-text2:       var(--nb-text2);
  --dp-muted:       var(--nb-muted);
  --dp-muted2:      var(--nb-muted2);
  --dp-border:      var(--nb-border);
  --dp-border2:     var(--nb-border2);
  --dp-shadow-blue: var(--nb-shadow-blue);
}

/* ── BODY BACKGROUND — deep space gradient ── */
body {
  background: #03020a;
  background-image:
    radial-gradient(ellipse 80% 50% at 10% 0%, rgba(124,58,237,0.12) 0%, transparent 60%),
    radial-gradient(ellipse 60% 40% at 90% 20%, rgba(79,110,247,0.10) 0%, transparent 55%),
    radial-gradient(ellipse 50% 60% at 50% 100%, rgba(6,232,245,0.06) 0%, transparent 60%);
}

/* ── LOGO REDESIGN ── */
.dp-logo-text {
  display: flex;
  align-items: center;
  gap: .75rem;
  text-decoration: none;
  flex-shrink: 0;
}
.dp-logo-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  flex-shrink: 0;
  position: relative;
}
.dp-logo-img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  mix-blend-mode: screen;
  filter: brightness(1.05) saturate(1.1);
  display: block;
}
.dp-logo-text-wrap {
  display: flex;
  flex-direction: column;
  gap: 0;
  line-height: 1;
}
.dp-logo-dev {
  font-family: var(--nb-font-head);
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -.02em;
  background: linear-gradient(135deg, #fff 0%, var(--nb-cyan2) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.dp-logo-pro {
  font-family: var(--nb-font-head);
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -.02em;
  background: linear-gradient(135deg, var(--nb-blue) 0%, var(--nb-purple) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.dp-logo-tagline {
  font-family: var(--nb-font-mono);
  font-size: .52rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--nb-muted);
  margin-top: 2px;
  line-height: 1;
}

/* ── HEADER — premium glassmorphism ── */
.dp-header {
  background: rgba(3, 2, 10, 0.75) !important;
  backdrop-filter: blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
  border-bottom: 1px solid rgba(124,58,237,0.18) !important;
  box-shadow: 0 1px 0 rgba(79,110,247,0.08), 0 8px 32px rgba(3,2,10,0.4);
}
.dp-header.dp-header-scrolled {
  background: rgba(3, 2, 10, 0.92) !important;
  border-bottom-color: rgba(79,110,247,0.25) !important;
  box-shadow: 0 1px 0 rgba(79,110,247,0.12), 0 12px 40px rgba(3,2,10,0.6) !important;
}

/* ── NAV LINKS ── */
.dp-nav-link {
  color: rgba(196,186,255,0.7);
  font-size: .84rem;
  font-weight: 500;
  letter-spacing: .01em;
  border-radius: 8px;
  padding: .48rem .9rem;
  transition: all .25s;
}
.dp-nav-link:hover {
  color: #fff;
  background: rgba(124,58,237,0.12);
}
.dp-nav-link.dp-nav-active {
  color: var(--nb-cyan);
  background: rgba(6,232,245,0.08);
}

/* ── CTA BUTTON ── */
.dp-btn-primary {
  background: linear-gradient(135deg, var(--nb-purple) 0%, var(--nb-blue) 100%);
  border: 1px solid rgba(124,58,237,0.4);
  box-shadow: 0 4px 20px rgba(124,58,237,0.35), 0 0 0 1px rgba(124,58,237,0.15);
}
.dp-btn-primary:hover {
  background: linear-gradient(135deg, #8b46ff 0%, #5b7fff 100%);
  box-shadow: 0 8px 30px rgba(124,58,237,0.5), 0 0 20px rgba(124,58,237,0.2);
  transform: translateY(-2px);
}
.dp-header-cta {
  background: linear-gradient(135deg, var(--nb-purple) 0%, var(--nb-blue) 100%);
  padding: .5rem 1.3rem;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .02em;
}

/* ── HERO SLIDE TITLE HIGHLIGHT ── */
.dp-slide-title-highlight {
  background: linear-gradient(135deg, var(--nb-blue) 0%, var(--nb-purple) 50%, var(--nb-cyan) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-size: 200% 200%;
  animation: gradientShift 4s ease infinite;
}
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ── HERO BADGE ── */
.dp-hero-badge {
  background: rgba(124,58,237,0.12);
  border: 1px solid rgba(124,58,237,0.3);
  color: var(--nb-cyan2);
  backdrop-filter: blur(8px);
}
.dp-badge-dot {
  background: var(--nb-cyan) !important;
  box-shadow: 0 0 8px var(--nb-cyan);
  animation: pulseCyan 2s infinite !important;
}
@keyframes pulseCyan {
  0%,100% { opacity:1; box-shadow:0 0 6px var(--nb-cyan); }
  50%      { opacity:.4; box-shadow:0 0 2px var(--nb-cyan); }
}

/* ── TAG LINE ── */
.dp-tag {
  color: var(--nb-cyan);
  letter-spacing: .15em;
}
.dp-tag::before {
  background: linear-gradient(90deg, var(--nb-purple), var(--nb-cyan));
}

/* ── CARDS ── */
.dp-card {
  background: linear-gradient(145deg, rgba(13,11,34,0.95) 0%, rgba(11,9,25,0.98) 100%);
  border: 1px solid rgba(124,58,237,0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: all .35s cubic-bezier(.4,0,.2,1);
}
.dp-card:hover {
  border-color: rgba(79,110,247,0.35);
  background: linear-gradient(145deg, rgba(20,18,48,0.98) 0%, rgba(13,11,34,0.99) 100%);
  box-shadow: 0 20px 60px rgba(124,58,237,0.15), 0 0 0 1px rgba(79,110,247,0.2), inset 0 1px 0 rgba(255,255,255,0.04);
  transform: translateY(-6px);
}
.dp-card::before {
  background: linear-gradient(90deg, var(--nb-purple), var(--nb-blue), var(--nb-cyan));
}
.dp-card-icon {
  background: rgba(124,58,237,0.1);
  border: 1px solid rgba(124,58,237,0.2);
}
.dp-card:hover .dp-card-icon {
  background: rgba(79,110,247,0.15);
  border-color: rgba(79,110,247,0.35);
}

/* ── FLOATING STAT CARDS ── */
.dp-float-card {
  background: rgba(13,11,34,0.85) !important;
  border: 1px solid rgba(124,58,237,0.25) !important;
  backdrop-filter: blur(20px) !important;
  box-shadow: 0 8px 32px rgba(3,2,10,0.5), 0 0 0 1px rgba(79,110,247,0.1) !important;
}
.dp-fc-icon.blue   { background: rgba(79,110,247,0.15); border-color: rgba(79,110,247,0.3); }
.dp-fc-icon.green  { background: rgba(16,185,129,0.12); border-color: rgba(16,185,129,0.25); }
.dp-fc-icon.orange { background: rgba(245,158,11,0.12); border-color: rgba(245,158,11,0.25); }
.dp-fc-bar-fill    { background: linear-gradient(90deg, var(--nb-blue), var(--nb-cyan)) !important; }

/* ── HERO EYEBROW ── */
.dp-slide-eyebrow {
  color: var(--nb-cyan);
  letter-spacing: .18em;
  font-size: .65rem;
}

/* ── PROCESS STEPS ── */
.dp-step-circle {
  background: rgba(13,11,34,0.95);
  border: 1.5px solid rgba(124,58,237,0.25);
}
.dp-process-step:hover .dp-step-circle {
  border-color: var(--nb-purple);
  box-shadow: 0 0 20px rgba(124,58,237,0.3), 0 8px 30px rgba(124,58,237,0.15);
}
.dp-step-num { color: var(--nb-blue); }

/* ── INDUSTRY ITEMS ── */
.dp-industry-item {
  background: rgba(13,11,34,0.8);
  border: 1px solid rgba(124,58,237,0.12);
  backdrop-filter: blur(8px);
}
.dp-industry-item:hover {
  border-color: rgba(79,110,247,0.3);
  box-shadow: 0 12px 40px rgba(124,58,237,0.15);
}

/* ── TECH PILLS ── */
.dp-tech-pill {
  background: rgba(13,11,34,0.9);
  border: 1px solid rgba(124,58,237,0.15);
  backdrop-filter: blur(8px);
}
.dp-tech-pill:hover {
  border-color: rgba(79,110,247,0.35);
  color: var(--nb-cyan);
}
.dp-tech-dot          { background: var(--nb-blue); }
.dp-tech-dot.dp-td-purple { background: var(--nb-purple); }
.dp-tech-dot.dp-td-green  { background: var(--nb-green); }
.dp-tech-dot.dp-td-orange { background: var(--nb-orange); }

/* ── PROJECT METRIC BADGE ── */
.nibra-metric {
  background: rgba(124,58,237,0.1);
  border: 1px solid rgba(124,58,237,0.2);
  color: var(--nb-cyan);
}

/* ── FILTER PILLS ── */
.nibra-filter.active,
.nibra-filter:hover {
  background: linear-gradient(135deg, var(--nb-purple), var(--nb-blue));
  border-color: transparent;
  box-shadow: 0 4px 16px rgba(124,58,237,0.3);
}

/* ── CTA SECTION ── */
.dp-cta-section {
  background: linear-gradient(135deg,
    #06040f 0%,
    #0e0829 30%,
    #0d0a2a 60%,
    #06040f 100%
  ) !important;
}
.dp-cta-section::after {
  background: radial-gradient(circle,
    rgba(124,58,237,0.2) 0%,
    rgba(79,110,247,0.1) 40%,
    transparent 70%
  ) !important;
}
.dp-cta-section .dp-tag::before {
  background: linear-gradient(90deg, var(--nb-purple), var(--nb-cyan));
}

/* ── CONTACT INFO CARDS ── */
.dp-info-card {
  background: rgba(13,11,34,0.9);
  border: 1px solid rgba(124,58,237,0.15);
  backdrop-filter: blur(12px);
}
.dp-info-card:hover {
  border-color: rgba(79,110,247,0.3);
  box-shadow: 0 12px 40px rgba(124,58,237,0.1);
}
.dp-info-title { color: var(--nb-cyan); }

/* ── FORM INPUTS ── */
.dp-form-input:focus,
.dp-form-textarea:focus,
.dp-form-select:focus {
  border-color: var(--nb-purple);
  box-shadow: 0 0 0 3px rgba(124,58,237,0.18);
}

/* ── DIVIDER ── */
.dp-divider {
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(124,58,237,0.2) 30%,
    rgba(79,110,247,0.3) 50%,
    rgba(124,58,237,0.2) 70%,
    transparent 100%
  );
  height: 1px;
}

/* ── FOOTER ── */
.dp-footer {
  background: rgba(5,3,14,0.98);
  border-top: 1px solid rgba(124,58,237,0.15);
}
.dp-footer-bottom {
  border-top: 1px solid rgba(124,58,237,0.1);
}
.dp-social-link:hover {
  background: linear-gradient(135deg, var(--nb-purple), var(--nb-blue));
  border-color: transparent;
  box-shadow: 0 4px 16px rgba(124,58,237,0.3);
}

/* ── PAGE HERO SECTIONS (inner pages) ── */
.dp-page-hero {
  background: linear-gradient(180deg,
    rgba(13,8,35,0.98) 0%,
    rgba(6,4,18,0.95) 100%
  ) !important;
  border-bottom: 1px solid rgba(124,58,237,0.15);
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar-thumb { background: var(--nb-purple); }

/* ── ABOUT LOGO BLOCK ── */
.nibra-logo-block {
  background: rgba(13,11,34,0.8);
  border: 1px solid rgba(124,58,237,0.2);
}
.nibra-logo-block img {
  mix-blend-mode: screen;
  filter: brightness(1.05);
}

/* ── VALUE CARDS ── */
.nibra-value-card {
  background: rgba(13,11,34,0.9);
  border: 1px solid rgba(124,58,237,0.15);
}
.nibra-value-card h4 { color: var(--nb-cyan); }

/* ── SKILLS ── */
.nibra-skill:hover { color: var(--nb-cyan); border-color: rgba(6,232,245,0.3); }
.nibra-skill-dot { background: var(--nb-blue); }
.nibra-skill-dot.c { background: var(--nb-cyan); }
.nibra-skill-dot.g { background: var(--nb-green); }
.nibra-skill-dot.o { background: var(--nb-orange); }

/* ── ABOUT CARDS ── */
.dp-about-card {
  background: rgba(13,11,34,0.9);
  border-left: 3px solid var(--nb-purple);
}
.dp-about-card-title { color: var(--nb-cyan); }

/* ── BLOG CARDS ── */
.dp-blog-card {
  background: rgba(13,11,34,0.9);
  border: 1px solid rgba(124,58,237,0.12);
  backdrop-filter: blur(8px);
}
.dp-blog-card:hover { border-color: rgba(79,110,247,0.3); }
.dp-blog-title a:hover { color: var(--nb-cyan); }

/* ── MOCKUP ELEMENTS (hero visual) ── */
.dp-mockup-browser {
  background: rgba(13,11,34,0.95) !important;
  border: 1px solid rgba(124,58,237,0.25) !important;
  box-shadow: 0 20px 60px rgba(3,2,10,0.7), 0 0 0 1px rgba(79,110,247,0.1) !important;
}
.dp-mockup-bar {
  background: rgba(20,18,48,0.9) !important;
  border-bottom: 1px solid rgba(124,58,237,0.15) !important;
}
.dp-mockup-dot:nth-child(1) { background: #ff5f57 !important; }
.dp-mockup-dot:nth-child(2) { background: #ffbd2e !important; }
.dp-mockup-dot:nth-child(3) { background: #28ca41 !important; }
.dp-mockup-url {
  background: rgba(124,58,237,0.1) !important;
  border: 1px solid rgba(124,58,237,0.2) !important;
}
.dp-sk-title { background: rgba(79,110,247,0.25) !important; }
.dp-sk-line   { background: rgba(255,255,255,0.06) !important; }
.dp-mini-bar  { background: linear-gradient(180deg, var(--nb-blue), var(--nb-purple)) !important; }

/* ── PHONE MOCKUP ── */
.dp-mockup-phone {
  background: rgba(13,11,34,0.95) !important;
  border: 1px solid rgba(124,58,237,0.2) !important;
}
.dp-phone-notch { background: rgba(124,58,237,0.3) !important; }
.dp-phone-card  { background: rgba(20,18,48,0.8) !important; border-color: rgba(124,58,237,0.15) !important; }
.dp-phone-card-dot.blue   { background: var(--nb-blue) !important; }
.dp-phone-card-dot.green  { background: #10b981 !important; }
.dp-phone-card-dot.orange { background: #f59e0b !important; }
.dp-phone-card-line { background: rgba(255,255,255,0.07) !important; }

/* ── SLIDER DOTS & ARROWS ── */
.dp-dot { background: rgba(124,58,237,0.2) !important; border: 1.5px solid rgba(124,58,237,0.3) !important; }
.dp-dot.dp-dot-active,
.dp-dot:hover { background: var(--nb-purple) !important; border-color: var(--nb-purple) !important; box-shadow: 0 0 10px rgba(124,58,237,0.5) !important; }
.dp-arrow { background: rgba(13,11,34,0.9) !important; border: 1.5px solid rgba(124,58,237,0.25) !important; color: var(--nb-muted) !important; }
.dp-arrow:hover { background: rgba(124,58,237,0.15) !important; border-color: var(--nb-purple) !important; color: #fff !important; }

/* ── GLOW BLOB (hero) ── */
.dp-blob {
  background: linear-gradient(135deg,
    rgba(124,58,237,0.15) 0%,
    rgba(79,110,247,0.10) 50%,
    rgba(6,232,245,0.08) 100%
  ) !important;
}
.dp-blob-sm {
  background: radial-gradient(circle,
    rgba(124,58,237,0.12) 0%,
    transparent 70%
  ) !important;
}

/* ── SCROLL HINT ── */
.dp-scroll-line { background: linear-gradient(180deg, transparent, var(--nb-purple), transparent) !important; }
.dp-scroll-hint { color: var(--nb-muted) !important; }

/* ── NETWORK BG override ── */
.nb-network-sitewide { opacity: .65 !important; }

/* ── PAGE TITLE CAPITALIZE FIX ── */
.dp-page-hero-inner .dp-title { text-transform: capitalize; }
.dp-page-hero-inner .dp-title:first-letter { text-transform: uppercase; }

/* ── SELECTION ── */
::selection { background: rgba(124,58,237,0.35); color: #fff; }

/* ── STAT SUFFIX/NUMBER ── */
.dp-stat-num   { color: #fff; }
.dp-stat-suffix{ color: var(--nb-cyan); }
.dp-stat-label { color: rgba(196,186,255,0.6); }