:root{
      --green:#006400;
      --green-2:#006d00;
      --green-3:#004d00;
      --accent:#ffd700;
      --accent-2:#ffe600;
      --bg:#f7f7f7;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      font-family: "Segoe UI", Tahoma, sans-serif;
      margin:0;
      background:var(--bg);
      color:#111;
    }

    /* ===== NAV ===== */
    header{
      position:sticky; top:0; z-index:1000;
      box-shadow:0 2px 5px rgba(0,0,0,.08);
    }
    .nav-wrap{
      background:var(--green);
    }
    nav{
      max-width:1200px; margin:0 auto; padding:.5rem 1rem;
      display:flex; align-items:center; justify-content:space-between; gap:1rem;
    }

    .brand{
      color:#fff; font-weight:700; letter-spacing:.3px; display:flex; align-items:center; gap:.5rem;
      text-decoration:none; white-space:nowrap;
    }
    .brand i{color:#a4e26c}

    .nav-toggle{
      display:none; border:0; background:transparent; color:#fff; font-size:1.25rem; cursor:pointer;
    }

    /* menu */
    .menu{
      list-style:none; margin:0; padding:0;
      display:flex; align-items:center; gap:.75rem;
    }
    .menu > li{
      position:relative;
    }
    .menu > li > a{
      display:flex; align-items:center; gap:.5rem;
      padding:.5rem .9rem; border-radius:6px;
      color:#fff; text-decoration:none; font-weight:600; font-size:0.86rem;
      transition:background-color .25s ease, color .25s ease;
    }
    .menu > li > a i{color:#a4e26c}
    .menu > li:hover > a{ background:#fff; color:var(--green); }

    /* ===== HERO / BANNER ===== */
    .banner{
      max-width:1200px; 
      margin: 7% auto;
       padding:0 1rem;
       text-align: center;
    }
    .banner p{
      font-size: 1.3rem;
      color: green;
    }
    /* .banner img{
      display:block;
      width:100%;
      height:50vh;          
      /* object-fit:contain;    */
      /* border-radius:8px;
    } */ */

    /* ===== ADS SLIDER ===== */
    .ads{
      max-width:1200px; margin:1rem auto; padding:0 1rem;
    }
    .ads-track{
      overflow:hidden; border-radius:10px; background:#e9f3e9;
    }
    .ads-slider{
      display:flex; transition:transform .7s ease-in-out; will-change:transform;
    }
    .ads-slide{
      flex:0 0 50%;
       display:flex; 
       align-items:center; 
        max-height:40vh;
       justify-content:center;
      border:1px solid var(--green);
       background:#fff;
    }
    .ads-slide img{
      display:block;
      width:100%;
      height:auto;
      object-fit:contain;
    }

    /* ===== YOUTUBE ROW ===== */
    .youtube-videos{
      max-width:1200px; margin:1rem auto; padding:1rem; background:#87b98733; border-radius:10px;
    }
    .row2{
       display:grid;
       grid-template-columns:repeat(3,1fr); 
       gap:1.2%;
    }
    .row2 iframe{ width:100%;
      height: 20vh;
       aspect-ratio:16/9;
        border:0; 
      }

    /* ===== GALLERY ===== */
    .row3{
      max-width:1200px; margin:1.5rem auto; padding:0 1rem;
      display:grid; grid-template-columns:repeat(2,1fr); gap:0.3%;
    }
    .thumbnail{ border:4px solid var(--green); border-radius:16px; overflow:hidden; background:#fff; }
    .thumbnail img{ width:100%; height:220px; object-fit:cover; display:block; }
    .thumbnail img:hover{ opacity:.8; cursor:pointer; }

    /* lightbox */
    .blurring{
      position:fixed; inset:0; backdrop-filter:blur(8px);
      background:rgba(0,0,0,.25); z-index:900; display:none;
    }
    .gallery-img{
      position:fixed; left:50%; top:50%; transform:translate(-50%,-50%);
      width:min(1000px, 90vw); height:min(80vh, 90vh);
      background:#fff; padding:.5rem; border-radius:10px; box-shadow:0 14px 24px rgba(0,0,0,.35);
      z-index:1000; display:none;
    }
    .gallery-img img{ width:100%; height:calc(100% - 40px); 
      object-fit:contain; 
    }
    .closeBtn{
      position:absolute; right:.75rem; top:.5rem;
      background:none; border:0; font-size:1.1rem; color:#c00; cursor:pointer;
    }
    .renewed-hope{
      width: 90%;
      margin: 2% auto;
      text-align: center;
      color: green;
      line-height: 2;
      
    }


    /* ===== BOTTOM IMAGE ===== */
    .bottom-wide{
      max-width:1200px; margin:1.5rem auto; padding:0 1rem;
    }
    .bottom-wide img{ width:100%;
       height:auto; display:block;
        border-radius:8px; 
      }
         /* FOOTER */
         footer {
            background-color: #0a6b3e;
            color: white;
            text-align: center;
            padding: 1rem;
            font-size: 0.9rem;
        }

    /* ===== RESPONSIVE ===== */
    @media (min-width: 1300px){
      .row2 iframe{
        height:30vh;
      }
       }
    
    @media (max-width: 992px){
      .row3{ 
        grid-template-columns:repeat(3,1fr);
       }
    }
    @media (max-width: 768px){
      .nav-toggle{ display:block; }
      .menu{
        position:absolute; left:0; right:0; top:100%;
        flex-direction:column; align-items:stretch; gap:0;
        background:var(--green); padding:.5rem;
        max-height:0; overflow:hidden; transition:max-height .35s ease;
      }
      .menu.open{ max-height:80vh; }
      .menu > li > a{ border-radius:8px; }
      .menu > li:hover > .submenu{ max-height:0; opacity:0; pointer-events:none; }
      .row2{ grid-template-columns:1fr; gap:.75rem; }
      .row3{ grid-template-columns:repeat(2,1fr); }
      .banner img{ height:auto; }
      .ads-slide img{ max-height:45vh; }
    }
    @media (max-width: 480px){
      .row3{ grid-template-columns:1fr; }
    }
    @media (min-width: 1400px){
      nav, .banner, .ads, .youtube-videos, .row3, .bottom-wide {
        max-width: 1600px;
      }
      .ads-slide img{
        max-height:60vh;
      }
    }



/*=========================================
  CONVENER SECTION
=========================================*/

.convener-section{
    background:#ffffff;
    padding:80px 5%;
}

.convener-container{
    max-width:1200px;
    margin:0 auto;
    display:grid;
    grid-template-columns:40% 60%;
    gap:50px;
    align-items:center;
}

.convener-image{
    overflow:hidden;
    border-radius:20px;
    box-shadow:0 15px 35px rgba(0,0,0,0.15);
}

.convener-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .4s ease;
}

.convener-image:hover img{
    transform:scale(1.05);
}

.convener-content{
    padding:10px;
}

.convener-tag{
    display:inline-block;
    background:#006400;
    color:#fff;
    padding:8px 18px;
    border-radius:30px;
    font-size:0.9rem;
    font-weight:600;
    margin-bottom:15px;
}

.convener-content h2{
    font-size:2.5rem;
    color:#006400;
    margin:0 0 8px;
}

.convener-content h4{
    font-size:1.2rem;
    color:#d4a000;
    margin:0 0 25px;
    font-weight:600;
}

.convener-content p{
    margin-bottom:18px;
    color:#555;
    font-size:1rem;
    line-height:1.9;
    text-align:justify;
}

/*=========================================
  TABLET
=========================================*/

@media screen and (max-width:992px){

    .convener-container{
        grid-template-columns:1fr;
        gap:35px;
    }

    .convener-image{
        max-width:550px;
        margin:auto;
    }

    .convener-content{
        text-align:center;
    }

    .convener-content p{
        text-align:left;
    }

    .convener-content h2{
        font-size:2rem;
    }

}

/*=========================================
  MOBILE
=========================================*/

@media screen and (max-width:768px){

    .convener-section{
        padding:60px 20px;
    }

    .convener-container{
        gap:25px;
    }

    .convener-content h2{
        font-size:1.7rem;
    }

    .convener-content h4{
        font-size:1rem;
    }

    .convener-content p{
        font-size:0.96rem;
        line-height:1.8;
         text-align:justify;
    }

}

/*=========================================
  SMALL PHONES
=========================================*/

@media screen and (max-width:480px){

    .convener-image{
        border-radius:15px;
    }

    .convener-content h2{
        font-size:1.5rem;
    }

    .convener-content h4{
        font-size:0.95rem;
    }

    .convener-tag{
        font-size:0.8rem;
        padding:7px 15px;
    }
     text-align:justify;

}