:root{
      --bg-deep:#0b0b12;
      --bg-panel:rgba(255,255,255,.06);
      --txt-main:#e8e8ff;
      --txt-dim:#b9b9d6;
      /* Darker Neon gradient */
      --neon-a:#b1009e; /* darker magenta */
      --neon-b:#1e2aff; /* deep indigo */
      --accent-1:#ff6bd6; /* icon tints */
      --accent-2:#6ea8fe;
      --accent-3:#22e3ff;
      --accent-4:#a98bff;
      --success:#1dd1a1;
      --warning:#ffb142;
      --danger:#ff5e57;
      --info:#00d2ff;
      --glass-border:rgba(255,255,255,.12);
    }

    html,body{ background:#000; color:var(--txt-main); }
    body{
      background: radial-gradient(1200px 600px at 85% -10%, rgba(177,0,158,.5), transparent 70%),
                  radial-gradient(900px 600px at 20% 10%, rgba(30,42,255,.45), transparent 70%),
                  linear-gradient(135deg, #07070c, #0b0b12 60%, #0a0a10);
      overflow-x:hidden;
    }

    /* Navbar */
    .navbar{
      background: linear-gradient(180deg, rgba(0,0,0,.7), rgba(0,0,0,.2));
      backdrop-filter:saturate(140%) blur(10px);
      border-bottom:1px solid var(--glass-border);
    }

    /* Hero */
    .hero{
      position:relative;
      padding-top:120px;
      padding-bottom:80px;
      overflow:hidden;
    }
    .hero .badge-neon{
      background: linear-gradient(135deg, var(--neon-a), var(--neon-b));
      color:white;
      border:1px solid var(--glass-border);
    }
    .hero-title{
      font-weight:800;
      letter-spacing:.3px;
      line-height:1.1;
      background:linear-gradient(135deg, #fff, #d4d4ff 40%, #b3b3ff);
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
      text-shadow:0 0 30px rgba(105,97,255,.25);
    }
    .lead-hero{ color:var(--txt-dim); }

  /* Naujas hero paveiksliuko konteineris */
.showcase-wrap {
  position: relative;
  width: min(700px, 90vw);
  margin-inline: auto;
  filter: drop-shadow(0 20px 60px rgba(0,0,0,.6));
  animation: floaty 8s ease-in-out infinite;
}

    /* --- HERO: Padidintas showcase desktop ekranuose --- */


    
    
    
.showcase {
  border-radius: 24px;
  overflow: hidden;
  background: linear-gradient(145deg, #10101a 0%, #06060c 100%);
  border: 1px solid var(--glass-border);
  position: relative;
}
    
    

.showcase::after {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(177,0,158,.35), rgba(30,42,255,.35));
  filter: blur(14px);
  opacity: .6;
  z-index: -1;
}

.showcase-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
  object-fit: cover;
  filter: saturate(1.05) contrast(1.05);
}


    /* Glass cards */
    .glass{
      background:var(--bg-panel);
      border:1px solid var(--glass-border);
      border-radius:20px;
      backdrop-filter:blur(10px);
      box-shadow:0 10px 30px rgba(0,0,0,.35);
    }

    /* Feature list to the right with dashed SVG lines */
    .hero-features{
      position:relative;
    }
    .feature-item{
      display:flex; align-items:center; gap:12px;
      padding:12px 14px;
      border-radius:14px;
      transition:transform .25s ease, background .25s ease;
    }
    .feature-item:hover{ transform:translateY(-2px); background:rgba(255,255,255,.04); }
    .feature-icon{
      font-size:1.3rem;
      width:40px; height:40px; min-width:40px;
      border-radius:12px; display:grid; place-items:center;
      background:rgba(255,255,255,.08);
      box-shadow:inset 0 0 0 1px var(--glass-border);
    }
    .feature-text{ margin:0; font-weight:600; }

    /* Colored icon helper classes */
    .ic1{ color:var(--accent-1); }
    .ic2{ color:var(--accent-2); }
    .ic3{ color:var(--accent-3); }
    .ic4{ color:var(--accent-4); }
    .icS{ color:var(--success); }
    .icW{ color:var(--warning); }
    .icD{ color:var(--danger); }
    .icI{ color:var(--info); }

    /* CTA buttons */
    .btn-neon{
      border-radius:999px; padding:12px 22px; font-weight:700;
      border:1px solid var(--glass-border);
      background:linear-gradient(135deg, rgba(177,0,158,.9), rgba(30,42,255,.9));
      color:#fff; text-shadow:0 0 12px rgba(0,0,0,.35);
      box-shadow:0 10px 24px rgba(63,75,255,.35), inset 0 0 0 1px rgba(255,255,255,.08);
    }
    .btn-neon:hover{ opacity:.95; transform:translateY(-1px); }
    .btn-ghost{
      border-radius:999px; padding:12px 20px; font-weight:700;
      border:1px solid var(--glass-border); background:rgba(255,255,255,.04);
      color:#fff;
    }

    /* Wavy dashed lines (animated) */
    svg#hero-lines{
      position:absolute; inset:0; width:100%; height:100%; pointer-events:none;
      filter:drop-shadow(0 0 8px rgba(255,255,255,.35));
    }
    .dash{
      stroke:#fff; stroke-width:6; stroke-linecap:round;
      stroke-dasharray:14 14; opacity:.9;
      filter:brightness(1.1);
      animation:dashmove 10s linear infinite;
    }
    @keyframes dashmove{ to{ stroke-dashoffset:-560; } }

    /* Sections spacing */
    section{ padding:72px 0; }

    /* Cards & sections following hero */
    .section-title{ font-weight:800; letter-spacing:.2px; }

    /* Subtle float animation */
    .floaty { animation: floaty 6s ease-in-out infinite; }
    @keyframes floaty{
      0%,100%{ transform:translateY(0) }
      50%{ transform:translateY(-8px) }
    }

    /* Footer */
    footer{
      border-top:1px solid var(--glass-border);
      background:linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.55));
    }

    /* Small tweaks */
    .tag{ font-size:.8rem; color:var(--txt-dim); }
    
    /* Hero responsive fix: prevent image overlap */
/* Pakeisti row vertikalų išlygiavimą */
.hero .row.align-items-center {
  align-items: flex-start;
}

/* Nustatymai, kai plotis tarp lg (992px) ir xl (~1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .hero .col-lg-6:nth-child(2) {
    margin-top: 50px; /* pakelia žemyn dešinį bloką */
  }

  .hero .col-lg-6:nth-child(1) .hero-title {
    font-size: 2.5rem; /* sumažina tekstą kairėje */
  }
  .hero .col-lg-6:nth-child(1) p.lead {
    font-size: 1rem;
  }
}

/* Mažesni nei lg ekranai */
@media (max-width: 991.98px) {
  .hero .row {
    align-items: center; /* arba start – kad abu blokai lygiuotųsi pagal tekstą */
  }
  .hero .col-lg-6:nth-child(1) .hero-title {
    font-size: 2rem;
  }
  .showcase-wrap {
    animation: none;
    margin-top: 30px;
  }
}

    /* --- HERO layout fix --- */
.hero .row {
  position: relative;
  z-index: 1;
}

/* Užtikrina, kad dešinys blokas neliptų ant kairiojo */
.hero .col-lg-6 {
  position: relative;
  z-index: 2;
}

/* Ribojame showcase plotį ir užtikriname proporcingą mažėjimą */
.showcase-wrap {
  width: 100%;
  max-width: 520px; /* galima keisti 480–600 pagal dizainą */
  margin-inline: auto;
  transition: max-width 0.3s ease;
}

/* Mažėjant ekranui, paveiksliukas mažėja tolygiai */
@media (max-width: 1199.98px) {
  .showcase-wrap {
    max-width: 440px;
  }
}

@media (max-width: 991.98px) {
  .hero .row {
    flex-direction: column; /* viršus po apačia */
    align-items: center;
    text-align: center;
  }
  .hero .col-lg-6 {
    width: 100%;
  }
  .showcase-wrap {
    max-width: 360px;
    margin-top: 40px;
    animation: none; /* išjungiam float animaciją mažiems ekranams */
  }
  .hero-title {
    font-size: 2rem;
  }
}

    
    /* --- HERO: padidinta showcase versija (apie +10%) --- */
@media (min-width: 992px) {

  /* dešinysis blokas užima šiek tiek daugiau vietos */
  .hero .col-lg-6.hero-features {
    flex: 0 0 53%;
    max-width: 53%;
  }

  /* kairysis blokas – šiek tiek mažiau vietos */
  .hero .col-lg-6:first-child {
    flex: 0 0 47%;
    max-width: 47%;
  }

  /* paveiksliukas padidintas maždaug 10% */
  .showcase-wrap {
    max-width: none;       /* neberibojam 520px */
    width: 110%;           /* padidinam 10% */
    transform: scale(1.0); /* tikras dydis */
  }

  /* šiek tiek tarpo iš dešinės */
  .hero .col-lg-6.hero-features {
    padding-right: 1rem;
  }

  /* išlaikomas dešinės pusės lygiavimas */
  .hero-features {
    justify-content: flex-end;
  }
}

    .navbar-brand {
  color: #fff !important;
}
.navbar-brand:hover {
  color: #fff !important;
  opacity: 0.85; /* švelnus efektas */
}

    .icon-glow {
  filter: drop-shadow(0 0 6px currentColor);
}

    
    
    /* Išplečiamo teksto efektas */
.expandable-text {
  max-height: 10em; /* ~10 eilučių */
  overflow: hidden;
  position: relative;
  transition: max-height 0.6s ease;
}

/* Subtilus gradientinis „fade“ apačioje */
.expandable-text::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0; right: 0;
  height: 60px;
  background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.7));
  pointer-events: none;
  transition: opacity 0.4s ease;
}

/* Kai išplėsta — atidengiame viską */
.expandable-text.expanded {
  max-height: 1000px;
}
.expandable-text.expanded::after {
  opacity: 0;
}

/* Mygtuko animacija */
.toggle-text-btn {
  transition: all 0.3s ease;
}
.toggle-text-btn:hover {
  color: var(--accent-3);
  box-shadow: 0 0 10px rgba(34,227,255,.3);
}

    /* ===================================================== */
/* --- SUPPORT / JOIN / SHARE / NEWS / ABOUT Sections --- */
/* ===================================================== */

/* Sekcijų fono perėjimai */
#support, #volunteers, #share, #news, #about {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(11,11,18,0.9), rgba(6,6,12,0.95));
}

/* Neoninės aureolės fone */
#support::before, #volunteers::before, #news::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 20%, rgba(177,0,158,.25), transparent 60%),
              radial-gradient(circle at 80% 80%, rgba(30,42,255,.25), transparent 60%);
  z-index: 0;
  opacity: 0.6;
}
#support > *, #volunteers > *, #share > *, #news > *, #about > * {
  position: relative;
  z-index: 1;
}

/* Pagrindiniai mygtukai (donate/invest) – ryškesni, plaukiojantys */
#support .btn-neon, 
#support .btn-ghost {
  transition: transform .25s ease, box-shadow .25s ease;
}
#support .btn-neon:hover,
#support .btn-ghost:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 20px rgba(177,0,158,.35), 0 0 10px rgba(30,42,255,.25);
}

/* Maksimalus teksto plotis */
#support .glass p {
  line-height: 1.7;
}

/* Mokėjimo mygtukų dizainas */
#support .btn-ghost {
  backdrop-filter: blur(8px);
  background: rgba(255,255,255,.06);
  border: 1px solid var(--glass-border);
  border-radius: 999px;
  transition: all .25s ease;
}
#support .btn-ghost:hover {
  background: linear-gradient(135deg, rgba(177,0,158,.4), rgba(30,42,255,.4));
  box-shadow: 0 0 14px rgba(63,75,255,.4);
  color: #fff;
}

/* Volunteer sekcija */
#volunteers .glass {
  background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid var(--glass-border);
}
#volunteers ul li {
  background: rgba(255,255,255,.04);
  border-radius: 10px;
  padding: 8px 14px;
  transition: background .3s ease;
}
#volunteers ul li:hover {
  background: rgba(255,255,255,.07);
}

/* Share mygtukas */
#share .btn-neon {
  font-size: 1.1rem;
  padding: 14px 26px;
}
#share .btn-neon:hover {
  box-shadow: 0 0 25px rgba(34,227,255,.45);
}

/* --- NEWS --- */
#news .glass {
  transition: transform .25s ease, box-shadow .25s ease;
}
#news .glass:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 20px rgba(30,42,255,.25);
}
#news h5 {
  color: var(--txt-main);
  font-weight: 600;
}

/* Modal lango dizainas */
#newsModal .modal-content.glass {
  background: rgba(20,20,30,.85);
  backdrop-filter: blur(16px);
  border-radius: 18px;
  border: 1px solid var(--glass-border);
  box-shadow: 0 0 30px rgba(0,0,0,.6);
}
#newsModal .modal-header h5 {
  color: #fff;
  font-weight: 700;
}
#newsModal .modal-body p {
  border-bottom: 1px solid rgba(255,255,255,.05);
  padding-bottom: 10px;
  margin-bottom: 10px;
}
#newsModal .modal-body p:last-child {
  border-bottom: none;
}

/* --- ABOUT section --- */
#about .glass {
  background: rgba(255,255,255,.05);
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  box-shadow: 0 8px 25px rgba(0,0,0,.35);
}
#about p {
  line-height: 1.8;
  color: var(--txt-dim);
}
#about .toggle-text-btn {
  margin-top: 10px;
}

/* --- Animacijos --- */
@keyframes neonPulse {
  0%, 100% { box-shadow: 0 0 10px rgba(177,0,158,.4), 0 0 20px rgba(30,42,255,.25); }
  50% { box-shadow: 0 0 25px rgba(177,0,158,.5), 0 0 35px rgba(30,42,255,.35); }
}
.btn-neon.pulsing {
  animation: neonPulse 3s ease-in-out infinite;
}

/* --- Responsive tweaks --- */
@media (max-width: 767.98px) {
  #support .d-flex.flex-wrap.justify-content-center.gap-3.mb-3 a {
    width: 100%;
  }
  #support .btn-ghost {
    font-size: 0.9rem;
    padding: 10px 16px;
  }
  #news .col-12.col-md-6.col-lg-4 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  #volunteers ul li {
    text-align: center;
  }
}

    /* ===================================================== */
/* --- "More reasons" subtle transparent gradient block --- */
/* ===================================================== */

#features .glass.mt-4.text-center {
  position: relative;
  background: linear-gradient(
    145deg,
    rgba(30, 42, 255, 0.08) 0%,
    rgba(177, 0, 158, 0.08) 100%
  );
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.35);
  transition: all 0.35s ease;
  overflow: hidden;
}

/* Hover efektas — švelnesnis švytėjimas ir šiek tiek daugiau kontrasto */
#features .glass.mt-4.text-center:hover {
  background: linear-gradient(
    145deg,
    rgba(30, 42, 255, 0.12) 0%,
    rgba(177, 0, 158, 0.12) 100%
  );
  transform: translateY(-3px);
  box-shadow: 0 0 30px rgba(63, 75, 255, 0.25), inset 0 0 20px rgba(255, 255, 255, 0.05);
}

/* „More reasons“ heading — subtiliai švytinti */
#features .glass.mt-4.text-center h5 {
  color: var(--accent-3);
  font-weight: 700;
  letter-spacing: 0.4px;
  text-shadow: 0 0 12px rgba(34, 227, 255, 0.25);
}

/* Turinio tekstas */
#projectText {
  color: var(--txt-dim);
}

/* „Read more“ mygtukas — minimalistinis, derantis prie naujo tono */
#features .glass.mt-4.text-center .toggle-text-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 999px;
  padding: 10px 20px;
  font-weight: 600;
  transition: all 0.3s ease;
}

#features .glass.mt-4.text-center .toggle-text-btn:hover {
  background: linear-gradient(
    135deg,
    rgba(34, 227, 255, 0.4),
    rgba(177, 0, 158, 0.4)
  );
  color: #fff;
  box-shadow: 0 0 14px rgba(34, 227, 255, 0.3);
}

/* Soft inner glow effect (gradient breathing) */
#features .glass.mt-4.text-center::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle at 30% 20%,
    rgba(177, 0, 158, 0.1),
    transparent 70%
  ),
  radial-gradient(
    circle at 80% 80%,
    rgba(30, 42, 255, 0.1),
    transparent 70%
  );
  pointer-events: none;
  opacity: 0.6;
  transition: opacity 0.4s ease;
}

#features .glass.mt-4.text-center:hover::before {
  opacity: 0.9;
}

@keyframes gradientFlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

#fundingBar::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 50%, rgba(255,255,255,.35), transparent 70%);
  mix-blend-mode: overlay;
  animation: pulseGlow 2s infinite ease-in-out;
}

@keyframes pulseGlow {
  0%, 100% { opacity: .7; }
  50% { opacity: 1; }
}

/* === Funding progress alignment fix === */
#funding2 .funding-values {
  display: flex;
  justify-content: space-between;
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #bbb;
}

#funding2 .funding-values span:first-child {
  text-align: left;
}

#funding2 .funding-values span:last-child {
  text-align: right;
}