/* ==========================================================================
   DEWAN SHIRKANT GARG TRUST — Design System
   Serving Humanity · Promoting Knowledge · Empowerment & Justice · Advancing Healthcare
   Colors sampled directly from the trust's official emblem:
   deep navy (#0E3B70) + heraldic gold (#D6B369)
   ========================================================================== */

:root{
  /* Color — pulled from the logo */
  --ink:        #0A2340;   /* near-black navy for body headings */
  --navy:       #0E3B70;   /* primary — from emblem ring/text */
  --navy-dark:  #0A2C56;
  --navy-light: #E6EDF5;   /* pale navy tint for badges/backgrounds */
  --gold:       #C9A227;   /* primary accent — from emblem laurel */
  --gold-2:     #D6B369;   /* secondary/lighter gold, for gradients */
  --gold-dark:  #A9832064;
  --gold-dark2: #A98320;
  --gold-l:     #FBF3DC;
  --paper:      #FAF9F5;
  --paper-alt:  #F3EEE0;
  --card:       #FFFFFF;
  --text:       #262523;
  --muted:      #6B6A63;
  --border:     #E6E0CE;
  --success:    #1E8E5A;

  /* Type */
  --font-display:'Playfair Display', Georgia, serif;
  --font-heading:'Sora', 'Segoe UI', Arial, sans-serif;
  --font-body:'Inter', 'Segoe UI', Arial, sans-serif;

  /* Shape / motion */
  --radius-lg:22px;
  --radius:14px;
  --radius-sm:9px;
  --shadow-soft:0 4px 22px rgba(10,35,64,0.08);
  --shadow-strong:0 14px 40px rgba(10,35,64,0.18);
  --ease:cubic-bezier(.22,.9,.32,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--paper);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-heading);
  color:var(--ink);
  font-weight:700;
  line-height:1.15;
  margin:0 0 .5em;
}
h1{font-size:clamp(2.1rem,5vw,3.6rem); letter-spacing:-.02em;}
h1 .serif-accent{font-family:var(--font-display); font-style:italic; font-weight:700; color:var(--navy);}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem); letter-spacing:-.01em;}
h3{font-size:1.35rem;}
p{margin:0 0 1em;}
a{color:var(--navy); text-decoration:none;}
img{max-width:100%; display:block;}
.container{max-width:1200px;}

/* -------------------- Utility -------------------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-heading); font-weight:600; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--navy); background:var(--navy-light); padding:6px 14px; border-radius:999px; margin-bottom:14px;
}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);}
.section{padding:88px 0;}
.section-alt{background:var(--paper-alt);}
.section-ink{background:var(--navy); color:#DCE4F0;}
.section-ink h2, .section-ink h3{color:#fff;}
.text-muted-ngo{color:var(--muted);}
.lead-ngo{font-size:1.15rem; color:var(--muted); max-width:620px;}

/* -------------------- Buttons -------------------- */
.btn{
  font-family:var(--font-heading); font-weight:600; border-radius:999px; padding:.85rem 1.7rem; border:none;
  transition:transform .18s var(--ease), box-shadow .18s var(--ease), background-color .18s var(--ease), color .18s var(--ease);
}
.btn:active{transform:scale(.97);}
.btn-donate{
  background:linear-gradient(135deg, var(--gold-2), var(--gold));
  color:var(--ink);
  box-shadow:0 10px 26px rgba(201,162,39,.4);
}
.btn-donate:hover{background:var(--gold-dark2); color:#fff;}
.btn-primary-ngo{background:var(--navy); color:#fff; box-shadow:0 10px 24px rgba(14,59,112,.28);}
.btn-primary-ngo:hover{background:var(--navy-dark); color:#fff;}
.btn-outline-ngo{background:transparent; border:1.5px solid var(--border); color:var(--ink);}
.btn-outline-ngo:hover{border-color:var(--gold); color:var(--navy);}
.btn-ghost-light{background:rgba(255,255,255,.12); color:#fff; border:1.5px solid rgba(255,255,255,.4);}
.btn-ghost-light:hover{background:rgba(255,255,255,.22); color:#fff;}
.btn-sm-ngo{padding:.55rem 1.2rem; font-size:.9rem;}

/* -------------------- Header / Nav -------------------- */
.topbar{background:var(--ink); color:#CBD6E6; font-size:.82rem;}
.topbar a{color:#CBD6E6;}
.topbar a:hover{color:var(--gold-2);}
.navbar-ngo{
  background:rgba(250,249,245,.95); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border); padding:12px 0;
  position:sticky; top:0; z-index:1030; transition:box-shadow .2s ease;
}
.navbar-ngo.scrolled{box-shadow:var(--shadow-soft);}
.brand-ngo{display:flex; align-items:center; gap:12px; font-family:var(--font-heading); font-weight:800; font-size:1.05rem; color:var(--ink); line-height:1.2;}
.brand-ngo img{height:56px; width:auto;}
.brand-ngo .brand-sub{display:block; font-family:var(--font-body); font-weight:500; font-size:.68rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em;}
.nav-ngo .nav-link{font-family:var(--font-heading); font-weight:600; color:var(--text) !important; padding:.5rem 1rem !important; position:relative;}
.nav-ngo .nav-link::after{content:"";position:absolute;left:1rem;right:1rem;bottom:.2rem;height:2px;background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .2s var(--ease);}
.nav-ngo .nav-link:hover::after, .nav-ngo .nav-link.active::after{transform:scaleX(1);}
.dropdown-menu-ngo{border:1px solid var(--border); border-radius:var(--radius-sm); box-shadow:var(--shadow-strong); padding:8px;}
.dropdown-menu-ngo .dropdown-item{border-radius:8px; padding:.5rem .8rem; font-size:.92rem;}
.dropdown-menu-ngo .dropdown-item:hover{background:var(--navy-light); color:var(--navy-dark);}

/* -------------------- Hero + Slider -------------------- */
.hero-slider{position:relative; overflow:hidden; border-radius:0 0 var(--radius-lg) var(--radius-lg);}
.hero-slider .carousel-item{height:min(74vh,640px); position:relative;}
.hero-slider .carousel-item .slide-media{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.hero-slider .slide-overlay{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(10,35,64,.82) 0%, rgba(10,35,64,.55) 45%, rgba(10,35,64,.15) 80%);
}
.hero-slider .slide-caption{position:absolute; inset:0; display:flex; align-items:center; z-index:3;}
.hero-slider .slide-caption .container{color:#fff;}
.hero-slider .slide-caption h1{color:#fff; max-width:640px;}
.hero-slider .slide-caption p{color:#DCE4F0; max-width:520px;}
.hero-slider .carousel-indicators [data-bs-target]{background-color:var(--gold); width:34px; height:4px; border-radius:2px;}
.hero-slider .carousel-control-prev, .hero-slider .carousel-control-next{width:6%;}
.hero-slider .carousel-control-prev-icon, .hero-slider .carousel-control-next-icon{
  background-color:rgba(255,255,255,.18); border-radius:50%; padding:20px; backdrop-filter:blur(4px);
}
.placeholder-media{
  width:100%;height:100%; display:flex;align-items:center;justify-content:center; color:#fff; text-align:center; padding:20px;
  background:linear-gradient(135deg, var(--navy) 0%, #164a8c 55%, var(--gold) 145%);
  font-family:var(--font-heading); font-weight:700;
}
.placeholder-media i{font-size:2.4rem; display:block; margin-bottom:10px; opacity:.9;}
.placeholder-media.sm{aspect-ratio:1/1; border-radius:var(--radius);}

/* -------------------- Impact counters -------------------- */
.impact-strip{background:var(--ink); border-radius:var(--radius-lg); margin-top:-64px; position:relative; z-index:5; padding:34px 20px; box-shadow:var(--shadow-strong);}
.impact-item{text-align:center; color:#fff; padding:14px 8px; border-right:1px solid rgba(255,255,255,.12);}
.impact-item:last-child{border-right:none;}
.impact-num{font-family:var(--font-heading); font-weight:800; font-size:clamp(1.8rem,3.4vw,2.6rem); color:var(--gold-2);}
.impact-label{font-size:.85rem; color:#B7C3D6; letter-spacing:.03em;}

/* -------------------- Cards -------------------- */
.card-ngo{background:var(--card); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-soft); transition:transform .22s var(--ease), box-shadow .22s var(--ease); overflow:hidden;}
.card-ngo:hover{transform:translateY(-5px); box-shadow:var(--shadow-strong);}
.card-ngo .card-body{padding:22px;}
.card-tag{display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; background:var(--navy-light); color:var(--navy-dark); padding:4px 10px; border-radius:999px; margin-bottom:10px;}
.program-icon{width:56px;height:56px;border-radius:16px; display:flex;align-items:center;justify-content:center; background:var(--navy-light); color:var(--navy); font-size:1.4rem; margin-bottom:14px;}
.progress-ngo{height:8px; border-radius:999px; background:var(--paper-alt); overflow:hidden;}
.progress-ngo .bar{height:100%; background:linear-gradient(90deg, var(--navy), var(--gold)); border-radius:999px;}

/* -------------------- Testimonials -------------------- */
.testimonial-card{background:var(--card); border-radius:var(--radius-lg); padding:30px; box-shadow:var(--shadow-soft); height:100%; border:1px solid var(--border);}
.testimonial-card .quote-mark{font-family:var(--font-display); font-size:2.6rem; color:var(--gold); line-height:.4; display:block; margin-bottom:14px;}
.avatar-round{width:52px;height:52px;border-radius:50%; background:var(--navy-light); color:var(--navy-dark); display:flex;align-items:center;justify-content:center; font-family:var(--font-heading); font-weight:700;}

/* -------------------- Donate section -------------------- */
.donate-panel{background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-strong); padding:34px; border:1px solid var(--border);}
.amount-chip{border:1.5px solid var(--border); background:var(--paper); border-radius:12px; padding:14px; text-align:center; font-family:var(--font-heading); font-weight:700; cursor:pointer; transition:all .15s ease;}
.amount-chip:hover{border-color:var(--gold);}
.amount-chip.active{border-color:var(--gold); background:var(--gold-l); color:var(--gold-dark2); box-shadow:0 0 0 3px rgba(201,162,39,.18);}
.qr-box{border:2px dashed var(--border); border-radius:var(--radius); padding:18px; text-align:center; background:var(--paper);}

/* -------------------- Footer -------------------- */
.footer-ngo{background:var(--ink); color:#B7C3D6; padding:70px 0 0;}
.footer-ngo h6{color:#fff; font-family:var(--font-heading); font-weight:700; margin-bottom:18px; font-size:.95rem; letter-spacing:.03em;}
.footer-ngo a{color:#B7C3D6;}
.footer-ngo a:hover{color:var(--gold-2);}
.footer-ngo .footer-bottom{border-top:1px solid rgba(255,255,255,.1); margin-top:40px; padding:22px 0; font-size:.85rem;}
.footer-ngo .brand-ngo{color:#fff;}
.footer-ngo .brand-ngo .brand-sub{color:#9BAAC2;}
.social-round{width:38px;height:38px;border-radius:50%; display:flex;align-items:center;justify-content:center; background:rgba(255,255,255,.08); color:#fff; transition:all .2s ease;}
.social-round:hover{background:var(--gold); color:var(--ink);}
.newsletter-input{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); color:#fff; border-radius:999px 0 0 999px; padding:.7rem 1.1rem;}
.newsletter-input::placeholder{color:#8496AE;}

/* -------------------- Sticky donate FAB / back-to-top -------------------- */
.donate-fab{position:fixed; right:18px; bottom:18px; z-index:1040; box-shadow:0 12px 28px rgba(201,162,39,.5);}
.back-to-top{position:fixed; left:18px; bottom:18px; z-index:1040; width:44px;height:44px;border-radius:50%; background:var(--ink); color:#fff; display:flex;align-items:center;justify-content:center; opacity:0; pointer-events:none; transition:opacity .25s ease; box-shadow:var(--shadow-strong);}
.back-to-top.show{opacity:1; pointer-events:auto;}

/* -------------------- Reveal-on-scroll -------------------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
.reveal.in{opacity:1; transform:none;}

/* -------------------- Page header (interior pages) -------------------- */
.page-header{background:linear-gradient(120deg, var(--ink) 0%, #123A6B 100%); color:#fff; padding:64px 0 46px; position:relative; overflow:hidden;}
.page-header .breadcrumb-ngo a{color:#B7C3D6;}
.page-header .breadcrumb-ngo a:hover{color:var(--gold-2);}
.page-header .breadcrumb-ngo .current{color:var(--gold-2);}

/* -------------------- Forms -------------------- */
.form-ngo label{font-weight:600; font-size:.9rem; margin-bottom:6px; color:var(--ink);}
.form-ngo .form-control, .form-ngo .form-select{border:1.5px solid var(--border); border-radius:var(--radius-sm); padding:.7rem .9rem; background:#fff;}
.form-ngo .form-control:focus, .form-ngo .form-select:focus{border-color:var(--navy); box-shadow:0 0 0 3px rgba(14,59,112,.14);}

/* -------------------- Responsive -------------------- */
@media (max-width:991px){
  .impact-item{border-right:none; border-bottom:1px solid rgba(255,255,255,.12);}
  .impact-item:last-child{border-bottom:none;}
  .hero-slider .carousel-item{height:78vh;}
}
@media (max-width:576px){
  .section{padding:60px 0;}
  .donate-fab{right:12px; bottom:12px;}
  .brand-ngo img{height:42px;}
}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important; scroll-behavior:auto !important;}
  .reveal{opacity:1; transform:none;}
}