/* ============================================================
   Lag Badana Community Conservancy Trust
   Glassy pale-blue + greenery theme with bioluminescent icons
   ============================================================ */

:root{
  --green-900:#0d2c1c;
  --green-700:#14522e;
  --green-500:#227843;
  --green-300:#5fbf86;
  --pale-blue:#d6ecf4;
  --pale-blue-2:#eaf6fb;
  --sky:#bfe2f0;
  --gold:#e0aa28;
  --glow:#7ef0c4;       /* bioluminescent */
  --glow-blue:#6fd6ff;
  --ink:#0f2a1c;
  --text:#1d3326;
  --glass:rgba(255,255,255,0.45);
  --glass-strong:rgba(255,255,255,0.62);
  --glass-border:rgba(255,255,255,0.6);
  --shadow:0 8px 32px rgba(13,44,28,0.18);
  --radius:20px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  color:var(--text);
  line-height:1.7;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(126,240,196,0.25), transparent 60%),
    radial-gradient(1000px 500px at 0% 20%, rgba(111,214,255,0.25), transparent 55%),
    linear-gradient(160deg,var(--pale-blue-2) 0%, var(--sky) 45%, var(--pale-blue) 100%);
  background-attachment:fixed;
  min-height:100vh;
}

h1,h2,h3{color:var(--green-700);line-height:1.2;font-weight:800}
h1{font-size:clamp(2rem,5vw,3.4rem)}
h2{font-size:clamp(1.5rem,3vw,2.3rem);margin-bottom:.6rem}
h3{font-size:1.3rem;margin-bottom:.4rem}
p{margin-bottom:1rem}
a{color:var(--green-700);text-decoration:none}
img{max-width:100%;display:block}

.wrap{max-width:1180px;margin:0 auto;padding:0 22px}

/* ---------- NAV ---------- */
.nav{
  position:sticky;top:0;z-index:100;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  background:rgba(214,236,244,0.6);
  border-bottom:1px solid var(--glass-border);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.5rem 22px;max-width:1180px;margin:0 auto}
.brand{display:flex;align-items:center;gap:.7rem;font-weight:800;color:var(--green-700)}
.brand img{height:54px;width:54px;border-radius:50%}
.brand span{font-size:.95rem;line-height:1.1;max-width:200px}
.nav-links{display:flex;flex-wrap:wrap;gap:.2rem;align-items:center}
.nav-links a{
  padding:.5rem .7rem;border-radius:12px;font-weight:600;font-size:.92rem;color:var(--green-700);
  transition:.2s;
}
.nav-links a:hover,.nav-links a.active{
  background:var(--glass-strong);
  box-shadow:0 0 14px rgba(126,240,196,0.7);
}
.menu-btn{display:none;background:var(--glass-strong);border:1px solid var(--glass-border);
  border-radius:12px;padding:.5rem .8rem;font-size:1.3rem;cursor:pointer;color:var(--green-700)}

/* ---------- HERO ---------- */
.hero{
  position:relative;min-height:78vh;display:flex;align-items:center;justify-content:center;
  text-align:center;color:#fff;overflow:hidden;
  background-size:cover;background-position:center;
}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,30,18,.35),rgba(8,30,18,.7))}
.hero-content{position:relative;z-index:2;max-width:820px;padding:2rem}
.hero-content h1{color:#fff;text-shadow:0 2px 30px rgba(0,0,0,.5)}
.hero-content p{font-size:1.15rem;color:#eafff5}
.tagline{display:inline-block;margin-top:.4rem;padding:.35rem 1rem;border-radius:30px;
  background:rgba(126,240,196,.18);border:1px solid var(--glow);color:var(--glow);
  font-weight:700;letter-spacing:.5px;text-shadow:0 0 12px rgba(126,240,196,.8)}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-block;margin-top:1.2rem;padding:.8rem 1.6rem;border-radius:30px;font-weight:700;
  background:linear-gradient(135deg,var(--green-500),var(--green-700));color:#fff;
  box-shadow:0 0 18px rgba(126,240,196,.6);transition:.25s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 28px rgba(126,240,196,.9);color:#fff}

/* ---------- GLASS CARD / SECTIONS ---------- */
.section{padding:4rem 0}
.glass{
  background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid var(--glass-border);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:2rem;
}
.lead{font-size:1.15rem}
.kicker{text-transform:uppercase;letter-spacing:2px;color:var(--green-500);font-weight:700;font-size:.85rem;margin-bottom:.4rem}

/* two-column media+text */
.split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.split.rev .media{order:2}
.media img,.media video{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);object-fit:cover}
@media(max-width:820px){.split{grid-template-columns:1fr}.split.rev .media{order:0}}

/* cards grid */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.4rem;margin-top:1.6rem}
.card{
  background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--glass-border);border-radius:var(--radius);padding:1.6rem;
  box-shadow:var(--shadow);transition:.25s;
}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(13,44,28,.22),0 0 22px rgba(126,240,196,.4)}
.bio-icon{
  font-size:2rem;display:inline-flex;width:60px;height:60px;align-items:center;justify-content:center;
  border-radius:16px;margin-bottom:.7rem;
  background:radial-gradient(circle at 30% 30%,rgba(126,240,196,.35),rgba(111,214,255,.18));
  border:1px solid rgba(126,240,196,.6);
  box-shadow:0 0 18px rgba(126,240,196,.7), inset 0 0 12px rgba(111,214,255,.4);
  color:var(--green-700);
}

/* ---------- SCROLLING BANNER ---------- */
.banner{padding:2.5rem 0 1rem}
.marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-track{display:flex;gap:1rem;width:max-content;animation:scroll 40s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track img{height:230px;width:340px;object-fit:cover;border-radius:16px;
  box-shadow:var(--shadow);border:2px solid rgba(255,255,255,.5)}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- LISTS ---------- */
.feature-list{list-style:none;display:grid;gap:.6rem;margin:1rem 0}
.feature-list li{padding-left:2rem;position:relative}
.feature-list li::before{content:"";position:absolute;left:0;top:.5em;width:12px;height:12px;border-radius:50%;
  background:var(--glow);box-shadow:0 0 10px var(--glow)}

/* ---------- GALLERY ---------- */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.gallery-grid img,.gallery-grid video{width:100%;height:240px;object-fit:cover;border-radius:16px;box-shadow:var(--shadow);
  transition:.25s;border:2px solid rgba(255,255,255,.5)}
.gallery-grid img:hover{transform:scale(1.02);box-shadow:0 0 26px rgba(126,240,196,.6)}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem}
.contact-card{display:flex;gap:1rem;align-items:flex-start}
.contact-card a{font-weight:600;word-break:break-word}

/* video block */
.video-frame{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.video-note{font-size:.85rem;color:#5b7568;margin-top:.4rem;font-style:italic}

/* ---------- FOOTER ---------- */
.footer{margin-top:3rem;background:rgba(13,44,28,.92);color:#cfe8d8;padding:2.5rem 0 1.5rem}
.footer a{color:var(--glow)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}
.footer h4{color:#fff;margin-bottom:.6rem}
.footer .copy{text-align:center;margin-top:1.5rem;font-size:.85rem;color:#9fc0ad;border-top:1px solid rgba(255,255,255,.12);padding-top:1rem}

/* page header (non-home) */
.page-head{position:relative;min-height:42vh;display:flex;align-items:flex-end;color:#fff;
  background-size:cover;background-position:center;overflow:hidden}
.page-head::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,30,18,.2),rgba(8,30,18,.75))}
.page-head .wrap{position:relative;z-index:2;padding-bottom:2rem}
.page-head h1{color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.5)}

@media(max-width:820px){
  .menu-btn{display:block}
  .nav-links{display:none;width:100%;flex-direction:column;align-items:stretch;padding:.5rem 0}
  .nav-links.open{display:flex}
  .nav-inner{flex-wrap:wrap}
  .brand span{display:none}
}
/* LOGO OVERRIDE */
.brand img{content:url('../images/logo.png');object-fit:contain}
