:root {
  /* Theme colors supplied by user */
  --hy-yellow: #f6f3a2;       /* light yellow */
  --hy-primary: #8ecc08;      /* main green */
  --hy-primary-dark: #033707; /* dark green */
  --hy-secondary: #8ecc08;    /* accent (same as primary) */
  --hy-light: #f6f3a2;        /* page background / warm tone */
  --hy-earth: #c69c6d;       /* earthy accent (kept) */
  --hy-dark: #033707;        /* main dark text color */
  --hy-white: #ffffff;
}

/* Global styles */
body {
  font-family: 'Jost', 'Noto Sans Devanagari', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color: var(--hy-dark);
  background: var(--hy-light);
}

.navbar { transition: background .3s, box-shadow .3s, padding .3s; }
.navbar.scrolled { background: rgba(255,255,255,0.96); box-shadow: 0 4px 18px rgba(3,55,7,0.08); }
.navbar .brand-title { font-weight:700; color:var(--hy-dark); }
.navbar .brand-tag { font-size:12px; color:var(--hy-secondary); }
.navbar .logo img{ height:90px; width:auto; display:inline-block; object-fit:contain; margin-right:8px; }
.btn-join { background: linear-gradient(90deg,var(--hy-primary),var(--hy-primary-dark)); color:var(--hy-white); border: 0; }

.hero { min-height:75vh; background-size:cover; background-position:center; position:relative; display:flex; align-items:center; }
.hero-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(3,55,7,0.28), rgba(3,55,7,0.44)); }
.hero-slides{ position:absolute; inset:0; overflow:hidden; }
.hero-slide{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1s ease-in-out; }
.hero-slide.active{ opacity:1; }
.hero .hero-content{ position:relative; max-width:720px; }

.impact-card{ background:var(--hy-white); padding:24px; border-radius:12px; box-shadow:0 6px 24px rgba(17,34,17,0.04); }
.impact-number{ font-weight:800; font-size:28px; color:var(--hy-primary-dark); }
.impact-label{ color:#4b5b47; }

.action-card{ border:0; transition:transform .22s ease, box-shadow .22s ease; }
.action-card:hover{ transform:translateY(-6px); box-shadow:0 10px 30px rgba(15,45,20,0.08); }
.action-card .icon{ font-size:28px; margin-bottom:12px; }

.featured-activity img{ max-height:420px; object-fit:cover; }

.activities-preview .card{ border:0; }
.activity-item{ transition: transform .18s; }
.activity-item:hover{ transform:translateY(-6px); }

.activity-gallery img{ width:100%; height:220px; object-fit:cover; border-radius:8px; }
.activity-gallery .overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0.0), rgba(0,0,0,0.35)); opacity:0; transition:opacity .2s; border-radius:8px; }
.activity-gallery .gallery-card:hover .overlay{ opacity:1; }

/* Gallery grid card styles */
.gallery-card { cursor: pointer; overflow: hidden; border-radius: 8px; }
.gallery-image-wrap img { width: 100%; height: 220px; object-fit: cover; display: block; }
.card-caption h6 { font-size: 1rem; margin: 0; }
.card-caption small { display: block; }

/* Homepage-style gallery item for gallery page */
.gallery-item { position: relative; }
.gallery-item img { display: block; width: 100%; height: 220px; object-fit: cover; }
.gallery-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.28); opacity: 0; transition: opacity .18s; font-weight:600; }
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-overlay { display:flex; align-items:center; justify-content:center; color:#fff; }
.visually-hidden { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

.quote-section{ background-size:cover; background-position:center; position:relative; }
.quote-section .overlay{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(8,26,12,0.6), rgba(8,26,12,0.4)); }
.quote-section blockquote{ font-style:normal; font-weight:600; }

.footer a{ text-decoration:none; }

/* Responsive tweaks */
@media (max-width:768px){
  .hero { min-height:55vh; }
  .featured-activity img{ max-height:260px; }
}

/* Accessibility focus */
a:focus, button:focus { outline:3px solid rgba(47,128,58,0.18); outline-offset:2px; }

/* Utility */
.hidden { display:none !important; }

/* Links: make anchor text turn primary green on hover across the site */
a:hover, a:focus {
  color: var(--hy-primary) !important;
  text-decoration: none;
}

/* Navbar and nav-link hover state */
.navbar .nav-link:hover, .navbar .nav-link:focus {
  color: var(--hy-primary) !important;
}

/* Ensure card and CTA links that may have stronger specificity also show green on hover */
.card a:hover, .card a:focus, .activity-item .btn:hover, .activity-item .btn:focus {
  color: var(--hy-primary) !important;
  border-color: var(--hy-primary) !important;
}

/* Target activities section specifically to ensure hover color applies to its buttons/links */
#activities a:hover, #activities a:focus,
#activities .btn:hover, #activities .btn:focus,
#activities .btn-outline-secondary:hover, #activities .btn-outline-secondary:focus,
#activities .card .btn:hover, #activities .card .btn:focus {
  color: var(--hy-primary) !important;
  border-color: var(--hy-primary) !important;
  background-color: transparent !important;
}

/* For outline-success buttons in activities make hover use solid primary tint */
#activities .btn-outline-success:hover, #activities .btn-outline-success:focus {
  color: #fff !important;
  background-color: var(--hy-primary) !important;
  border-color: var(--hy-primary) !important;
}

/* Category filter buttons: make hover and active state fill with primary green */
#activity-filters .btn {
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
#activity-filters .btn:hover, #activity-filters .btn:focus {
  background-color: var(--hy-primary) !important;
  color: #fff !important;
  border-color: var(--hy-primary) !important;
  box-shadow: 0 6px 14px rgba(3,55,7,0.12);
}
#activity-filters .btn.active, #activity-filters .btn.active:focus {
  background-color: var(--hy-primary) !important;
  color: #fff !important;
  border-color: var(--hy-primary) !important;
}

/* Override Bootstrap .py-5 to reduce excessive vertical spacing across the Harit Yodha site
   Setting a custom top/bottom padding to make sections less tall while keeping visual rhythm.
   Uses !important to ensure this takes precedence over Bootstrap's utility class. */
.py-5 {
  padding-top: 1rem !important;
  padding-bottom: 3rem !important;
}

/* Ensure Bootstrap .bg-light uses the theme yellow rather than plain white
   and make container backgrounds transparent so section backgrounds (or body) show through.
   This keeps cards and panels (which explicitly set .card or .bg-white) unchanged. */
.bg-light {
  background-color: var(--hy-light) !important;
}

.container {
  background: transparent !important;
}

/* FUTURE: Add theme-specific classes and better typography scaling */

:root {
    --hy-primary: #8ecc08;    /* main green */
    --hy-secondary: #8ecc08;  /* bright leaf green accent */
    --hy-light: #f6f3a2;      /* warm pale yellow */
    --hy-dark: #033707;      /* dark green */
}

/* Global styles */
body.hy-homepage {
    background: var(--hy-light);
    color: #123;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

/* NAVBAR */
#hy-navbar {
    background: #fff;
    transition: box-shadow .3s, background .3s;
}

    #hy-navbar.scrolled {
        box-shadow: 0 6px 18px rgba(3,55,7,0.12);
        background: rgba(255,255,255,0.97);
    }

.hy-logo {
    font-size: 28px;
}

.hy-brand-text .h5 {
    letter-spacing: .6px;
}

.hy-cta-btn {
    background: var(--hy-primary);
    border-color: var(--hy-primary);
    color: #fff;
}

/* HERO */
.hy-hero {
    position: relative;
}

.hy-hero-carousel .carousel-item img {
    height: 60vh;
    object-fit: cover;
    width: 100%;
}

.hy-hero-carousel .carousel-item {
    transition: transform .6s ease;
}

.hy-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8,140,8,0.18), rgba(3,55,7,0.35));
    pointer-events: none;
}

.hy-hero-caption {
    z-index: 3;
}

/* Reduce gap between hero banner and following sections */
.hy-hero, .hy-hero-carousel {
    margin-bottom: 0;
    padding-bottom: 0;
}

    .hy-hero + section {
        padding-top: 1.25rem !important;
    }

    .hy-hero .container {
        position: relative;
        z-index: 2;
    }

.hy-hero-title {
    font-weight: 700;
    letter-spacing: .6px;
}

.hy-hero-sub {
    font-weight: 500;
}

.hy-hero-desc {
    max-width: 680px;
    color: rgba(255,255,255,0.92);
}

.hy-hero-cta {
    box-shadow: 0 6px 18px rgba(3,60,33,0.12);
}

.hy-hero-impact {
    opacity: .95;
}

/* Counters */
.hy-counter-card {
    background: #fff;
}

.hy-counter-value {
    font-size: 28px;
    font-weight: 700;
    color: var(--hy-primary);
}

.hy-counter-label {
    color: #666;
}

/* WHAT WE DO CARDS */
.hy-action-card {
    background: #fff;
    transition: transform .25s ease, box-shadow .25s ease;
}

    .hy-action-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 30px rgba(3,60,33,0.08);
    }

.hy-action-icon {
    font-size: 28px;
}

.hy-learn-more {
    color: var(--hy-primary);
    font-weight: 600;
}

/* FEATURED */
.hy-featured-photo img {
    height: 100%;
    object-fit: cover;
    display: block;
}

.hy-featured-content .hy-meta li {
    margin-bottom: 6px;
    color: #444;
}

/* CATEGORIES/ACTIONS */
.hy-categories .btn.active {
    background: var(--hy-primary);
    color: #fff;
    border-color: var(--hy-primary);
}

/* ACTIVITY CARDS */
.hy-activity-card .card {
    border: none;
    border-radius: 12px;
}

.hy-activity-card img {
    height: 180px;
    object-fit: cover;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

/* GALLERY */
.hy-gallery-item {
    cursor: pointer;
}

    .hy-gallery-item img {
        transition: transform .35s ease;
    }

    .hy-gallery-item:hover img {
        transform: scale(1.05);
    }

.hy-gallery-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: rgba(0,0,0,0.25);
    opacity: 0;
    transition: opacity .2s ease;
    font-weight: 600;
}

.hy-gallery-item:hover .hy-gallery-overlay {
    opacity: 1;
}

/* QUOTE SECTION */
.hy-quote {
    background-size: cover;
    background-position: center;
    min-height: 240px;
    position: relative;
}

.hy-quote-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(3,60,33,0.45), rgba(11,107,58,0.35));
}

.hy-quote h2 {
    font-weight: 700;
}

/* CTA */
.hy-cta {
    background: var(--hy-primary);
    color: #fff;
}

/* FOOTER */
footer a {
    text-decoration: none;
}

/* Responsive tweaks */
@media (max-width: 767px) {
    .hy-hero-carousel .carousel-item img {
        height: 36vh;
    }

    .hy-activity-card img {
        height: 140px;
    }
}

@media (min-width: 1200px) {
    .hy-hero {
        min-height: 0vh;
    }
}

/* Accessibility focus */
.hy-action-card:focus, .hy-learn-more:focus, .hy-activity-card a:focus {
    outline: 3px solid rgba(111,207,151,0.25);
}

/* Small utilities */
.text-white-50 {
    color: rgba(255,255,255,0.75);
}

/* Pinned navbar adjustments */
.hy-pinned {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1060;
}

    .hy-pinned + main {
        padding-top: 76px;
    }

/* Back to top button style override for small screens */
@media (max-width: 575px) {
    #hyBackTop {
        right: 12px;
        bottom: 12px;
        width: 40px;
        height: 40px;
    }
}
.brand-title img{
	height: 60px;
}
.card-img-top{
     width: 40px;
        height: 40px;
}
#activity-details {
    padding-top: 4rem !important;
}
.text-white{
        padding-top: 5.5rem;
}
/* end of file */
