/* =========================
   GLOBAL RESETS & THEME VARS
   ========================= */
html, body { margin:0; padding:0; }
*, *::before, *::after { box-sizing:border-box; }

/* Keep these sections from adding accidental spacing */
.brandband, .navbar, .hero-slider { margin-top:0; padding-top:0; }

/* ---- Unified variable registry (union of all your vars) ---- */
:root{
  /* Primary theme */
  --purple:#038a52;          /* agri green */
  --gold:#f0c43d;
  --text:#222;
  --overlay: rgba(18,12,30,.55);
  --container:1240px;

  /* Extended palettes used by sections */
  --purple-2:#01563b;
  --ink:#162033;
  --muted:#647089;
  --card:#ffffff;

  /* ndccb themed vars */
  --ndccb-indigo:#043915;
  --ndccb-gold:#f0c43d;
  --ndccb-bg1:#EFECE3;
  --ndccb-bg2:#FFF8D4;
  --ndccb-text:#1f2233;
  --ndccb-muted:#585d71;

  /* leaf/agri sets */
  --leaf-950:#062d1b;
  --leaf-900:#0c3e25;
  --leaf-800:#145a35;
  --leaf-700:#1f7a4b;
  --leaf-600:#1f7a4b;        /* alias used in a fallback var() */
  --leaf-500:#2fa66e;
  --leaf-400:#52b788;
  --leaf-300:#8be3b4;

  /* extras */
  --bg-top:#f7fff8;
  --cream:#fffdf7;
  --paper:#ffffff;
  --soil:#0f3a1e;
  --leaf:#2f8f57;
  --ink-strong:#10161a;
  --muted-2:#5f6d68;

  /* shadows & rings */
  --shadow-a:0 14px 32px rgba(12,62,37,.10);
  --ring:rgba(31,122,75,.25);
}

/* Base text + links + container */
body{font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#fff;color:var(--text)}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}

/* =================
   TOPBAR
   ================= */
.topbar{background:var(--purple);color:#fff;font-size:14px;border-bottom:2px solid var(--gold)}
.topbar .row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;flex-wrap:wrap}
.topbar a{color:#fff;font-weight:500}
.topbar a:hover{text-decoration:underline;text-underline-offset:3px}
/* Topbar action links look nice on all sizes */
.topbar .stack.actions a{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px; border-radius:20px; font-weight:600;
}

/* On small screens, hide text labels and make round icon buttons */
@media (max-width: 640px){
  .topbar .stack.actions a .label{ display:none; }
  .topbar .stack.actions a{
    padding:6px; width:36px; height:36px; justify-content:center;
  }
  .topbar .stack.actions a i{ font-size:16px; }
  /* optional: reduce the vertical bar separator if you keep any */
  .topbar .stack span{ gap:0; }
}
/* =================
   BRANDBAND (Desktop)
   ================= */
.brandband{
  padding: 20px 0;
  border-bottom: 1px solid rgba(0,0,0,.05);

  /* TOP texture + BOTTOM gradient */
  background-image:
    url("images/arabesque.png"),
    linear-gradient(90deg, hsla(40, 100%, 96%, 1) 0%, hsla(11, 100%, 92%, 1) 100%);
  background-repeat: repeat, no-repeat;
  background-size: 24px 24px, 100% 100%;
  background-position: 0 0, 0 0;
}

.brandband .row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  text-align:center;
}

.brandband img{
  height:80px;
  width:auto;
  display:block;
  border-radius:50%;
  background:#fff;
  padding:4px;
  box-shadow:0 3px 6px rgba(0,0,0,.15);
}

.brandband .title{
  flex:1;
  text-align:center;
  padding:0 10px;
}

.brandband .odia{
  font-weight:700;
  font-size:25px;
  color:var(--purple);
  margin:5px 0;
}

.brandband .eng{
  margin:0;
  font-size:28px;
  font-weight:900;
  color:var(--green);
}


/* ==============================
   MOBILE RESPONSIVE (Below 600px)
   ============================== */
@media (max-width: 600px) {

  .brandband{
    padding: 14px 0;
    background-size: 18px 18px, 100% 100%; /* smaller texture */
  }

  .brandband .row{
    flex-direction:column;
    gap:12px;
  }

  .brandband img{
    height:65px;
    padding:3px;
    box-shadow:0 2px 4px rgba(0,0,0,.12);
  }

  .brandband .odia{
    font-size:20px;
    line-height:1.2;
    margin-top:4px;
  }

  .brandband .eng{
    font-size:22px;
    line-height:1.2;
  }

  .brandband .title{
    padding:0;
  }
}


/* ===================================
   VERY SMALL DEVICES (Below 400px)
   =================================== */
@media (max-width: 400px) {

  .brandband img{
    height:55px;
  }

  .brandband .odia{
    font-size:18px;
  }

  .brandband .eng{
    font-size:20px;
  }
}



/* =================
   NAVBAR
   ================= */
.navbar{
  background:var(--purple);color:#fff;position:sticky;top:0;z-index:999;
  box-shadow:0 3px 10px rgba(0,0,0,.15);transition:box-shadow .3s ease
}
.navbar.scrolled{box-shadow:0 6px 18px rgba(0,0,0,.25)}
.navbar .row{display:flex;justify-content:center;align-items:center;padding:10px 0;flex-wrap:wrap}
.menu{list-style:none;display:flex;align-items:center;gap:18px;margin:0;padding:0;flex-wrap:wrap}
.menu>li{position:relative}
.menu a{display:flex;align-items:center;gap:6px;padding:10px 16px;color:#fff;font-weight:600;border-radius:30px;transition:transform .3s,background .3s}
.menu a:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}
.menu .active>a{background:rgba(255,255,255,.25);border:1px solid rgba(255,255,255,.2)}
.dropdown{display:none;position:absolute;top:100%;left:0;background:#fff;min-width:200px;border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.2);overflow:hidden}
.dropdown a{color:var(--purple)!important;padding:10px 16px;display:block;font-weight:600}
.dropdown a:hover{background:#f7f6fb}
.menu li:hover>.dropdown{display:block}
.cta{background:var(--gold);color:var(--purple)!important;font-weight:700;padding:10px 20px;border-radius:30px}
.cta:hover{filter:brightness(1.05)}
/* Search */
.search{position:relative;display:flex;align-items:center}
.search input{width:0;opacity:0;height:38px;border:none;border-radius:20px;transition:all .35s;padding:0 12px;background:#fff;color:#333;box-shadow:inset 0 0 6px rgba(0,0,0,.2)}
.search.open input{width:200px;opacity:1;margin-left:10px}
.search button{height:40px;width:40px;border:none;border-radius:50%;background:#fff;color:var(--purple);cursor:pointer;transition:all .3s}
.search button:hover{background:var(--gold);color:#fff}
.hamburger{display:none;background:var(--gold);color:var(--purple);border:none;padding:8px 12px;border-radius:8px;font-weight:700}
@media (max-width:980px){
  .hamburger{display:block}
  .navbar .row{flex-direction:column}
  .menu{display:none;flex-direction:column;width:100%;background:var(--purple);padding:10px}
  .menu.show{display:flex}
  .dropdown{position:static;box-shadow:none;border:none;padding:0}
  .menu li.open .dropdown{display:block}
  .search.open input{width:100%}
}

/* =================
   HERO SLIDER
   ================= */
.hero-slider{ position:relative;width:100%;overflow:hidden;background:#000;margin:0;padding:0;display:block; }
.hero-slider figure, .hero-slider .slide { margin:0; padding:0; }
.hero-slider .slides{
  display:flex;width:100%;
  height:70vh;max-height:600px;min-height:380px;
  transition:transform .7s ease;
}
.hero-slider .slide{min-width:100%;height:100%;position:relative;overflow:hidden;display:block}
.hero-slider .slide img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.9)}
.hero-slider .slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25) 0%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.65) 100%);pointer-events:none}
/* Caption */
.hero-slider .caption{
  position:absolute;left:50%;top:15%;transform:translateX(-50%);
  color:#fff;text-align:center;font-weight:800;font-size:clamp(20px,2.6vw,36px);
  padding:14px 28px;border-radius:10px;background:var(--overlay);
  border:2px solid rgba(240,196,61,.7);letter-spacing:.5px;backdrop-filter:saturate(130%) blur(2px);
  animation:capIn .9s ease both;
}
@keyframes capIn{from{opacity:0;transform:translate(-50%,-18px)}to{opacity:1;transform:translate(-50%,0)}}
/* Controls + dots */
.hero-slider .nav{
  position:absolute;top:50%;transform:translateY(-50%);
  height:44px;width:44px;border-radius:50%;border:none;display:grid;place-items:center;
  background:rgba(0,0,0,.4);color:#fff;cursor:pointer;z-index:3;transition:filter .25s,transform .25s
}
.hero-slider .nav:hover{filter:brightness(1.2);transform:translateY(-50%) scale(1.06)}
.hero-slider .nav.prev{left:8px}
.hero-slider .nav.next{right:8px}
.hero-slider .dots{position:absolute;left:50%;transform:translateX(-50%);bottom:18px;display:flex;gap:8px;z-index:3}
.hero-slider .dot{height:10px;width:10px;border-radius:50%;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.85);cursor:pointer;transition:transform .2s}
.hero-slider .dot.active{background:var(--gold);transform:scale(1.2)}
@media (max-width:768px){ .hero-slider .caption{font-size:clamp(16px,4vw,24px);padding:10px 16px} }

/* meta tagline */
.meta {
  font-weight: 600;
  font-size: 14px;
  color: #e11d48;
  letter-spacing: 0.3px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 6px;
  text-shadow: 0 1px 2px rgba(255,255,255,0.6);
}
.meta i { color: #d61540; font-size: 15px; text-shadow: 0 1px 2px rgba(0,0,0,0.15); }

/* =================
   ABOUT (ID version)
   ================= */
#about-ndccb{font-family:Poppins,system-ui,Segoe UI,Roboto,Arial;}
#about-ndccb .container{max-width:var(--container);margin:0 auto;padding:0 20px;}
.about-wrap{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:28px; align-items:stretch;
  margin:48px auto 64px;
}
/* Left gradient About Box */
.about-card{
  background:radial-gradient(140% 140% at 0% 0%, #123524 0%, var(--purple) 50%, var(--purple-2) 100%);
  color:#fff;border-radius:22px;padding:38px 30px 32px;position:relative;
  box-shadow:0 24px 60px rgba(17,14,36,.25);
}
.about-card .crest{
  height:80px;width:80px;border-radius:50%;background:#fff;display:grid;place-items:center;
  position:absolute;left:58px;top:-38px;box-shadow:0 10px 24px rgba(0,0,0,.18);overflow:hidden;
}
.about-card .crest img{height:74px;width:74px;object-fit:contain;}
.about-card h2{font-weight:800;font-size:clamp(16px,2vw,28px);line-height:1.1;margin:20px 0 16px;}
.about-card p{font-size:15px;line-height:1.8;opacity:.95;margin-bottom:14px;}
.about-card .stats{display:flex;gap:14px;flex-wrap:wrap;margin:16px 0 20px;}
.about-card .stat{
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);
  padding:10px 12px;border-radius:12px;font-weight:700;display:flex;align-items:center;gap:8px;
}
.about-card .btn{
  display:inline-flex;align-items:center;gap:10px;background:var(--gold);color:var(--purple);
  font-weight:800;border:none;border-radius:999px;padding:12px 18px;cursor:pointer;
  box-shadow:0 10px 24px rgba(240,196,61,.28);transition:transform .2s ease,filter .2s ease;
}
.about-card .btn:hover{transform:translateY(-2px);filter:brightness(1.05);}

/* Loan cards */
.loan-card{
  background:var(--card);border-radius:18px;padding:16px;
  box-shadow:0 18px 50px rgba(16,20,40,.10);border:1px solid #eef0f5;
  display:flex;flex-direction:column;overflow:hidden;
}
.loan-card .thumb{height:180px;border-radius:14px;overflow:hidden;border:1px solid #e8ebf3;background:#f6f7fb;}
.loan-card .thumb img{height:100%;width:100%;object-fit:cover;transition:transform .5s ease;}
.loan-card:hover .thumb img{transform:scale(1.06);}
.loan-card h3{text-align:center;margin:16px 10px 10px;font-weight:800;color:var(--ink);font-size:clamp(16px,1.8vw,22px);}
.loan-card p{margin:0 8px 14px;color:var(--muted);text-align:center;font-size:14px;line-height:1.7;}
.loan-card .tag{
  align-self:center;margin-top:auto;margin-bottom:8px;font-size:12px;font-weight:700;
  color:#44506b;background:#eef2ff;border:1px solid #dfe6ff;padding:6px 10px;border-radius:999px;
}
@media(max-width:1100px){.about-wrap{grid-template-columns:1fr 1fr;gap:22px;}}
@media(max-width:680px){.about-wrap{grid-template-columns:1fr;gap:18px;}}

/* =================
   ABOUT (Class version – second block)
   ================= */
.about-ndccb{
  background:linear-gradient(180deg,var(--ndccb-bg1) 0%,var(--ndccb-bg2) 100%);
  padding:70px 20px;
  border-top:2px solid #e2def4;
  box-sizing:border-box;
}

/* Main layout */
.about-ndccb .wrap{
  max-width:1250px;
  width:100%;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:42px;
  align-items:start;
  box-sizing:border-box;
}

.about-ndccb .title{
  text-align:center;
  margin-bottom:40px;
}

.about-ndccb .title h2{
  color:var(--ndccb-indigo);
  font-size:clamp(26px,2.8vw,36px);
  font-weight:800;
  letter-spacing:.4px;
}

.about-ndccb .title .underline{
  width:85px;
  height:5px;
  border-radius:6px;
  margin:10px auto 0;
  background:linear-gradient(90deg,var(--ndccb-gold),#ffe380,var(--ndccb-gold));
}
/* =================
   ABOUT (Class version – second block)
   ================= */
.about-ndccb{
  background:linear-gradient(180deg,var(--ndccb-bg1) 0%,var(--ndccb-bg2) 100%);
  padding:70px 20px;
  border-top:2px solid #e2def4;
  overflow-x:hidden;          /* prevent sideways overflow */
}

.about-ndccb .wrap{
  max-width:1250px;
  width:100%;                /* make sure it never exceeds viewport */
  margin:0 auto;
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:42px;
  align-items:start;
}

/* ------ MOBILE TUNING ------ */
@media (max-width: 768px){
  .about-ndccb{
    padding:40px 14px;       /* less side padding on mobile */
  }

  .about-ndccb .wrap{
    grid-template-columns:1fr;
    gap:24px;
  }

  .about-ndccb .title{
    margin-bottom:24px;
  }

  .about-ndccb .title h2{
    font-size:22px;
  }

  .about-ndccb .photo{
    margin:0 auto;
    max-width:360px;         /* keeps the image nicely inside */
    width:100%;
  }

  .about-ndccb .content p{
    font-size:14px;
    line-height:1.6;
  }

  .about-ndccb .box{
    padding:18px 14px;       /* reduce padding so box isn’t too wide */
  }

  .about-ndccb li{
    font-size:14px;
  }
}

/* Image side */
.about-ndccb .photo{
  position:relative;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.12);
  max-width:100%;
  box-sizing:border-box;
}

.about-ndccb .photo img{
  width:100%;
  height:auto;               /* keeps aspect ratio on phones */
  object-fit:cover;
  display:block;
}

.about-ndccb .photo .badge{
  position:absolute;
  top:18px;
  left:18px;
  background:#0a2f1a;
  color:#fff;
  padding:8px 14px;
  border-radius:999px;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:700;
  box-shadow:0 5px 15px rgba(0,0,0,.2);
  max-width:calc(100% - 36px);
  box-sizing:border-box;
}

.about-ndccb .photo .footer{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.6) 100%);
  color:#fff;
  padding:18px;
  font-weight:600;
  letter-spacing:.3px;
  box-sizing:border-box;
}

/* Text side */
.about-ndccb .content{
  max-width:100%;
  box-sizing:border-box;
}

.about-ndccb .content p{
  color:var(--ndccb-muted);
  line-height:1.75;
  margin-bottom:16px;
  font-size:16px;
  word-wrap:break-word;
  overflow-wrap:break-word;
}

.about-ndccb .content strong{
  color:var(--ndccb-text);
}

/* Inner box */
.about-ndccb .box{
  background:#fff;
  border:1px solid #e9e6f4;
  border-radius:18px;
  padding:25px;
  box-shadow:0 10px 25px rgba(49,28,87,.08);
  max-width:100%;
  box-sizing:border-box;
}

.about-ndccb h3{
  color:var(--ndccb-indigo);
  font-weight:800;
  font-size:20px;
  margin:0 0 14px 0;
}

.about-ndccb ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}

.about-ndccb li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  color:var(--ndccb-text);
  line-height:1.6;
}

.about-ndccb li i{
  background:#eaf9ef;
  border:2px solid #d7f5e0;
  color:#16a34a;
  width:30px;
  height:30px;
  border-radius:50%;
  display:grid;
  place-items:center;
  flex:0 0 30px;
  font-size:15px;
}

.about-ndccb .note{
  margin-top:12px;
  color:#6a6f85;
  font-size:14px;
  background:#faf8ff;
  border-left:4px solid var(--ndccb-indigo);
  padding:10px 14px;
  border-radius:8px;
}

/* Fade-in */
@media (prefers-reduced-motion:no-preference){
  .about-ndccb [data-fade]{
    opacity:0;
    transform:translateY(30px);
    transition:.6s ease;
  }
  .about-ndccb [data-fade].visible{
    opacity:1;
    transform:none;
  }
}

/* ==============
   RESPONSIVE
   ============== */

/* Tablets & small laptops */
@media (max-width: 980px){
  .about-ndccb{
    padding:50px 12px;
  }
  .about-ndccb .wrap{
    grid-template-columns:1fr;
    gap:26px;
    max-width:100%;
  }
  .about-ndccb .photo{
    margin:0 auto;
  }
}

/* Large phones / small tablets */
@media (max-width: 720px){
  .about-ndccb{
    padding:40px 10px;
  }
  .about-ndccb .wrap{
    gap:22px;
  }
  .about-ndccb .title{
    margin-bottom:22px;
  }
  .about-ndccb .title h2{
    font-size:22px;
  }
  .about-ndccb .photo .badge{
    top:10px;
    left:10px;
    padding:6px 10px;
    font-size:12px;
    max-width:calc(100% - 20px);
  }
  .about-ndccb .photo .footer{
    padding:12px;
    font-size:13px;
  }
  .about-ndccb .content p{
    font-size:15px;
    line-height:1.7;
  }
  .about-ndccb .box{
    padding:18px;
  }
}

/* Small phones */
@media (max-width: 480px){
  .about-ndccb{
    padding:32px 8px;
  }
  .about-ndccb .wrap{
    gap:18px;
  }
  .about-ndccb .title h2{
    font-size:20px;
  }
  .about-ndccb .title .underline{
    width:70px;
    height:4px;
  }
  .about-ndccb .photo{
    border-radius:16px;
    box-shadow:0 14px 40px rgba(0,0,0,.14);
  }
  .about-ndccb li{
    align-items:flex-start;
  }
  .about-ndccb li i{
    width:26px;
    height:26px;
    flex:0 0 26px;
    font-size:13px;
  }
  .about-ndccb .note{
    font-size:13px;
  }
}

/* =================
   CEO WRAP + UPDATES PANEL
   ================= */
/* ==============================
   CEO & ADMIN (equal width/height)
   ============================== */
.ceo-wrap{
  position:relative; isolation:isolate;
  padding:48px 0;
  background:
    radial-gradient(1200px 300px at 50% -100px, rgba(255,255,255,.12) 0%, transparent 60%),
    linear-gradient(180deg, #0e3d22 0%, #0a2f1a 40%, #0f3a21 100%);
  overflow:hidden;
}
.ceo-wrap:before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.06) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 35%, rgba(255,255,255,.05) 0 2px, transparent 3px),
    radial-gradient(circle at 40% 75%, rgba(255,255,255,.05) 0 2px, transparent 3px);
  background-size:140px 140px, 180px 180px, 200px 200px; opacity:.6;
}
.ceo-wrap:after{
  content:"";
  position:absolute; left:0; right:0; bottom:-1px; height:90px; z-index:0;
  background:
    url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="UTF-8"?>\
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 120" preserveAspectRatio="none">\
<path fill="%230a2f1a" d="M0,64 C240,120 480,0 720,40 C960,80 1200,8 1440,56 L1440,120 L0,120 Z"/>\
</svg>') center/cover no-repeat;
  opacity:.9;
}

/* Two equal columns */
.ceo-container{
  max-width:1240px; margin:0 auto; padding:0 20px; position:relative; z-index:1;
  display:grid; grid-template-columns: 1fr 1fr; gap:28px;
}
@media (max-width: 1024px){
  .ceo-container{ grid-template-columns:1fr; }
}

/* Card: same min-height and structure to equalize height */
.ceo-card{
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px; padding:22px; color:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(6px);

  display:flex; flex-direction:column;
  min-height: 560px;              /* <- equal height baseline */
}
.ceo-card > .ceo-head { margin-bottom: 14px; }
.ceo-card > .ceo-actions { margin-top:auto; }

/* Head */
.ceo-head{ display:grid; grid-template-columns:120px 1fr; gap:18px; align-items:center; }
.ceo-photo{
  height:120px; width:120px; border-radius:16px; overflow:hidden;
  border:2px solid rgba(255,255,255,.15); box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.ceo-photo img{width:100%; height:100%; object-fit:cover;}
.ceo-meta h3{ margin:0; font-size:28px; font-weight:800; letter-spacing:.3px; }
.ceo-meta p{ margin:2px 0 0; color:#d5e9db; font-weight:600; }
.ceo-badge{
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(242,201,76,.2); color:#ffe99f; border:1px solid rgba(242,201,76,.35);
  padding:6px 10px; border-radius:999px; font-weight:700; margin-top:8px;
}
.ceo-badge i{color:#ffd66e;}

/* Titles */
.ceo-title{ font-size:28px; font-weight:900; margin:14px 0 8px; letter-spacing:.5px; }
.ceo-divider{
  width:110px; height:6px; border-radius:999px;
  background:linear-gradient(90deg,#ffe27a,#fff6c8);
  box-shadow:0 8px 22px rgba(242,201,76,.25);
  margin:10px 0 16px;
}

/* Text */
.ceo-text{ color:#eaf6ee; line-height:1.85; font-size:16px; }

/* Actions */
.ceo-actions{ display:flex; gap:10px; align-items:center; margin-top:18px; flex-wrap:wrap;}
.btn-cta{
  background:linear-gradient(90deg, #f2c94c, #ffe690);
  color:#1a2a1e; border:none; font-weight:800; padding:12px 16px; border-radius:12px;
  box-shadow:0 10px 24px rgba(242,201,76,.25); cursor:pointer;
}
.socials a{
  display:inline-flex; height:42px;width:42px;border-radius:12px; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.18); color:#fff; transition:.2s; background:rgba(255,255,255,.06)
}
.socials a:hover{ transform:translateY(-2px); background:rgba(255,255,255,.16) }

/* Admin tone tweaks */
.admin-card .ceo-badge{
  background:rgba(46, 139, 87, .22);
  border-color:rgba(46,139,87,.38);
  color:#daf5e5;
}
/* =================
   SERVICES
   ================= */
.services-wrap{
  position:relative; isolation:isolate; overflow:hidden;
  background:
    radial-gradient(1400px 260px at 50% -120px, rgba(82,183,136,.12), transparent 60%),
    linear-gradient(180deg, var(--bg-top), #eef9f0 45%, #f6fff8 100%);
  padding:64px 0 84px;
}
.services-wrap::before{
  content:"";
  position:absolute; inset:0; pointer-events:none; opacity:.45;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(82,183,136,.14) 0 2px, transparent 3px),
    radial-gradient(circle at 82% 28%, rgba(242,201,76,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 40% 86%, rgba(82,183,136,.12) 0 2px, transparent 3px);
  background-size:160px 160px, 220px 220px, 200px 200px;
}
.sv-container{max-width:1240px;margin:0 auto;padding:0 20px}
.sv-head{text-align:center;margin-bottom:36px}
.sv-eyebrow{ display:inline-flex;align-items:center;gap:10px; color:var(--leaf-700);font-weight:800;letter-spacing:.25px;margin-bottom:10px }
.sv-eyebrow i{color:var(--gold)}
.sv-title{font-size:clamp(26px,3.8vw,38px);font-weight:900;color:var(--leaf-900);margin:0}
.sv-sub{max-width:900px;margin:10px auto 0;color:var(--muted-2);line-height:1.7}
.sv-divider{width:84px;height:6px;border-radius:12px;margin:16px auto;background:linear-gradient(90deg,var(--gold),#fff1a6)}
.sv-grid{ display:grid;gap:22px; grid-template-columns:repeat(3,1fr); }
@media (max-width: 980px){ .sv-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width: 620px){ .sv-grid{grid-template-columns:1fr;} }
.sv-card{
  position:relative;background:var(--card);border-radius:18px;padding:26px 20px 24px;text-align:center;
  box-shadow:0 16px 36px rgba(13,61,35,.08), inset 0 0 0 1px rgba(13,61,35,.06);
  transition:transform .25s ease, box-shadow .25s ease;
}
.sv-card:hover{ transform:translateY(-4px); box-shadow:0 24px 42px rgba(13,61,35,.12) }
.sv-icon{
  display:grid;place-items:center;
  height:78px;width:78px;margin:-58px auto 8px;border-radius:22px;
  background:#ffffff; border:2px solid rgba(31,122,75,.15);
  box-shadow:0 10px 24px rgba(13,61,35,.12);
}
.sv-icon i{font-size:34px}
.sv-icon.green i{color:#27ae60}
.sv-icon.purple i{color:#8e44ad}
.sv-icon.blue i{color:#2d9cdb}
.sv-icon.orange i{color:#f2994a}
.sv-icon.teal i{color:#14b8a6}
.sv-icon.rose i{color:#e11d48}
.sv-name{ font-size:18px;font-weight:800;color:var(--leaf-900);margin:10px 0 6px }
.sv-underline{ width:50px;height:4px;border-radius:999px;margin:6px auto 10px; background:linear-gradient(90deg,var(--leaf-400),#b5f0cd) }
.sv-desc{ color:var(--ink-strong);opacity:.85;line-height:1.7;font-size:14px }
.sv-card:focus-within{outline:3px solid var(--ring);outline-offset:2px}
@media (prefers-reduced-motion:no-preference){
  .sv-card{opacity:0;transform:translateY(10px);animation:sv-in .6s ease forwards}
  .sv-card:nth-child(2){animation-delay:.06s}
  .sv-card:nth-child(3){animation-delay:.12s}
  .sv-card:nth-child(4){animation-delay:.18s}
  .sv-card:nth-child(5){animation-delay:.24s}
  .sv-card:nth-child(6){animation-delay:.30s}
  @keyframes sv-in{to{opacity:1;transform:none}}
}

/* =================
   RIGHT FLOATING ACTION SIDEBAR (FAB)
   ================= */
.fab-right {
  position: fixed;
  top: 55%;
  right: 0.5rem;
  transform: translateY(-50%);
  z-index: 9999;
  display: grid;
  gap: 12px;
}
.fab-right .fab-item {
  --bg: #0f3a1e;
  --accent: #b7a576;
  --size: 54px;
  position: relative;
  width: var(--size);
  height: var(--size);
  border-radius: 999px;
  background: var(--bg);
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
  isolation: isolate;
  overflow: visible;
}
.fab-right .fab-item i { font-size: 22px; transition: transform .25s ease; }
.fab-right .fab-item .fab-label {
  position: absolute; right: calc(100% + 10px); top: 50%;
  transform: translateY(-50%) translateX(10px);
  background: #124d27; color: #fff; border: 1px solid rgba(183,165,118,.35);
  padding: 10px 14px; border-radius: 12px; font: 600 14px/1.1 system-ui, -apple-system, Segoe UI, Roboto, Arial;
  white-space: nowrap; opacity: 0; pointer-events: none;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.25));
  transition: transform .28s ease, opacity .28s ease;
}
.fab-right .fab-item .fab-label::after {
  content: ""; position: absolute; right: -8px; top: 50%; transform: translateY(-50%) rotate(45deg);
  width: 12px; height: 12px; background: #124d27;
  border-right: 1px solid rgba(183,165,118,.35); border-top: 1px solid rgba(183,165,118,.35);
}
.fab-right .fab-item:hover .fab-label,
.fab-right .fab-item:focus-visible .fab-label{ transform: translateY(-50%) translateX(0); opacity: 1; }
.fab-right .fab-item:hover i { transform: scale(1.08); }
.fab-right .fab-item::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; border: 2px solid var(--accent);
  opacity: .0; transform: scale(.85); transition: .6s;
}
.fab-right .fab-item:hover::before { opacity: .25; transform: scale(1.05); }
.fab-right .fab-item.clicked { background: linear-gradient(135deg, #13602d, #0f3a1e); }
.fab-right .fab-item.clicked .fab-label { transform: translateY(-50%) translateX(0); opacity: 1; }
@media (max-width: 480px) {
  .fab-right { right: .25rem; gap: 10px; }
  .fab-right .fab-item { --size: 50px; }
  .fab-right .fab-item .fab-label { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .fab-right * { transition: none !important; animation: none !important; }
}

/* =================
   CONTACT PRO
   ================= */
#ndccb-contact-pro {
  color:var(--ink-strong);
  position:relative; overflow:hidden; padding:60px 0 86px;
  background:
    radial-gradient(900px 220px at 10% -100px, rgba(47,166,110,.18), transparent 60%),
    radial-gradient(900px 220px at 90% -110px, rgba(139,227,180,.18), transparent 60%),
    linear-gradient(180deg,#f9fff9,#f4fff7);
}
#ndccb-contact-pro::before{
  content:""; position:absolute;inset:0;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60" opacity=".07"><defs><pattern id="p" width="60" height="60" patternUnits="userSpaceOnUse"><circle cx="2" cy="2" r="1" fill="%230c3e25"/><circle cx="30" cy="30" r="1" fill="%230c3e25"/></pattern></defs><rect width="100%" height="100%" fill="url(%23p)"/></svg>');
  pointer-events:none;
}
.ndc-head{text-align:center;margin-bottom:18px;position:relative;z-index:1}
.ndc-eyebrow{ display:inline-flex;align-items:center;gap:10px;color:var(--leaf-700);font-weight:900;letter-spacing:.4px; }
.ndc-title{ font-size:clamp(22px,3.2vw,32px);font-weight:900;color:var(--leaf-900);margin:6px 0 4px }
.ndc-sub{color:var(--muted-2)}
.ndc-divider{width:90px;height:8px;margin:12px auto 0;border-radius:999px;background:linear-gradient(90deg,var(--leaf-300),#b7f3d2)}
.ndc-map{width:100%;height:380px;border:0;display:block;filter:saturate(105%) contrast(97%)}
@media (max-width:768px){ .ndc-map{height:300px} }
.ndc-wrap{max-width:1240px;margin:0 auto;padding:0 20px}
.ndc-grid{display:grid;gap:24px;margin-top:46px;grid-template-columns:1.05fr 1.25fr}
@media (max-width:1024px){ .ndc-grid{grid-template-columns:1fr} }
.ndc-card, .ndc-form {
  background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.82));
  -webkit-backdrop-filter:saturate(140%) blur(8px);
  backdrop-filter:saturate(140%) blur(8px);
  border-radius:20px;padding:22px;
  box-shadow: 0 18px 44px rgba(6,45,27,.14), inset 0 0 0 1px rgba(6,45,27,.06);
}
.ndc-cards{display:grid;gap:16px}
.ndc-card .chip{
  height:58px;width:58px;border-radius:16px;display:grid;place-items:center;
  background:#fff;border:1.5px solid rgba(31,122,75,.18);
  box-shadow:0 12px 28px rgba(6,45,27,.14);
  margin-bottom:10px;color:var(--leaf-700);font-size:24px
}
.ndc-card h4{font-size:16px;font-weight:900;color:var(--leaf-900);margin:0 0 6px}
.ndc-card p,.ndc-card a{color:var(--ink-strong);opacity:.9;line-height:1.65;text-decoration:none}
.ndc-card a:hover{color:var(--leaf-800)}
.ndc-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:600px){ .ndc-split{grid-template-columns:1fr} }
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}

.cta.whatsapp{border-style:solid;background:linear-gradient(90deg,#25d366,#1ebe57);color:#fff}
.cta i{font-size:16px}
.ndc-form h3{margin:4px 0 14px;font-size:18px;font-weight:900;color:var(--leaf-900)}
.ndc-form .row{display:grid;gap:12px;grid-template-columns:1fr 1fr}
@media (max-width:600px){ .ndc-form .row{grid-template-columns:1fr} }
.field{position:relative}
.field i{ position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--leaf-700);opacity:.8;font-size:14px }
.input, .textarea{
  width:100%;border:1.6px solid #e6efe9;border-radius:14px;background:#fff;padding:13px 14px 13px 38px;margin-bottom:5px;
  font-size:14px;outline:none;transition:box-shadow .2s, border-color .2s
}
.input:focus, .textarea:focus{border-color:var(--leaf-300);box-shadow:0 0 0 5px var(--ring)}
.textarea{min-height:150px;resize:vertical;padding-left:14px}
.ndc-submit{
  display:inline-flex;align-items:center;gap:10px;border:none;cursor:pointer;
  background:linear-gradient(90deg,var(--leaf-800), var(--leaf-600, #1f7a4b));
  color:#fff;font-weight:900;border-radius:14px;padding:12px 18px;margin-top:8px;
  box-shadow:0 14px 28px rgba(6,45,27,.20);transition:.18s ease
}
.ndc-submit:hover{transform:translateY(-2px);filter:brightness(1.05)}
.ndc-submit i{font-size:14px}
.socials{display:flex;gap:10px;margin-top:12px}
.socials a{
  height:38px;width:38px;border-radius:10px;display:grid;place-items:center;background:#fff;border:1.2px solid rgba(31,122,75,.22);
  color:var(--leaf-800);text-decoration:none;box-shadow:0 8px 20px rgba(6,45,27,.10)
}
.socials a:hover{background:var(--leaf-700);color:#fff;border-color:transparent}
.keypoints{ display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px }
.keypoints .kp{background:#fff;border-radius:12px;padding:10px;border:1px solid rgba(31,122,75,.12);display:flex;gap:10px;align-items:center}
.keypoints .kp i{color:var(--leaf-700)}
.kp b{color:var(--leaf-900)}

/* =================
   CONTACT STRIP
   ================= */
.ndccb-contact-strip{
  background: linear-gradient(180deg, #043915 0%, #123524 100%);
  color: #ffffff;
  font-family: "Poppins", system-ui, sans-serif;
  padding: 28px 18px;
  position: relative;
  overflow: hidden; /* ensures pattern stays inside */
}

.ndccb-contact-strip::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("images/maze-white.png") repeat;
  background-size: 32px 56px; /* adjust tile size */
  opacity: 0.12; /* balanced visibility */
  pointer-events: none;
  z-index: 0;
}

/* ensure text & icons stay above pattern */
.ndccb-contact-strip * {
  position: relative;
  z-index: 1;
}
.ndccb-contact-strip::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(circle at 15% 10%, rgba(255,255,255,0.05) 0%, transparent 60%),
              radial-gradient(circle at 85% 90%, rgba(255,255,255,0.05) 0%, transparent 60%);
  pointer-events:none;
}
.ndccb-contact-grid{
  position: relative;
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 36px;
  align-items: center;
}
@media (max-width: 980px){ .ndccb-contact-grid{ grid-template-columns: 1fr; gap: 24px; text-align:center; } }
.ndccb-item{
  display: flex; align-items: flex-start; gap: 14px;
  background: rgba(255,255,255,0.06);
  padding: 14px 18px;
  border-radius: 12px;
  transition: background 0.3s, transform 0.3s;
}
@media (max-width: 980px){ .ndccb-item{ justify-content: center; } }
.ndccb-item:hover{ background: rgba(255,255,255,0.10); transform: translateY(-2px); }
.ndccb-icon{
  height:48px;width:48px; flex-shrink:0; border-radius:12px; display:grid;place-items:center;
  background: #ffe100; color:#123524; font-size:22px;
  box-shadow:0 10px 22px rgba(0,0,0,.25), inset 0 0 0 1px rgba(0,0,0,.1);
}
.ndccb-title{ color:#ffe100; font-weight:800; font-size:18px; margin:0 0 6px; letter-spacing:0.5px; }
.ndccb-text{ margin:0; line-height:1.6; color:#d9e6d9; }
.ndccb-link{ color:#fff; text-decoration:none; border-bottom:1px dashed rgba(255,255,255,.25); transition: color 0.2s, border-color 0.2s; }
.ndccb-link:hover{ color:#ffe100; border-color:transparent; }

/* =================
   STATS (SAFE)
   ================= */
.stats-agri.safe{
  padding:120px 18px 88px;
  background:
    radial-gradient(1100px 260px at 50% -120px, rgba(47,143,87,.12), transparent 60%),
    linear-gradient(180deg, #f7fff8 0%, #ffffff 100%);
  overflow:hidden; font-family:Poppins,system-ui,Arial,sans-serif;
  position:relative; isolation:isolate;
}
.agri-wrap{ max-width:1200px; margin:0 auto; position:relative; z-index:1 }
.stats-agri.safe::before,
.stats-agri.safe::after{
  content:""; position:absolute; pointer-events:none; filter:blur(70px); opacity:.22; z-index:0;
  width:min(34vw,420px); height:min(34vw,420px); border-radius:50%;
}
.stats-agri.safe::before{ left:max(-4vw, -30px); top:-80px; background:#b2ffc4; }
.stats-agri.safe::after { right:max(-4vw, -30px); bottom:-120px; background:#ffeaa6; }
.headline{text-align:center;margin:0 0 28px}
.headline h2{margin:0;color:var(--soil);font-weight:900;letter-spacing:.2px;font-size:clamp(22px,2.4vw,30px)}
.headline p{margin:6px 0 0;color:#5a6a64;font-weight:600}
.headline .underline{width:108px;height:6px;border-radius:999px;display:block;margin:14px auto 0;
  background:linear-gradient(90deg,#ffe38b,#fff3c0,#ffe38b);box-shadow:0 14px 26px rgba(255,227,139,.36)}
.stats-grid{display:grid;gap:26px;grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.stats-grid{grid-template-columns:1fr}}
.stat3d{
  position:relative; padding:96px 22px 26px; text-align:center; color:var(--ink-strong);
  border-radius:22px; border:1px solid rgba(15,58,30,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.84));
  box-shadow:0 20px 60px rgba(15,58,30,.18); transform:translateY(10px);
  transition:transform .25s ease, box-shadow .25s ease;
}
.stat3d:hover{ transform:translateY(2px) scale(1.01); box-shadow:0 26px 72px rgba(15,58,30,.22) }
.leaf-deco{
  position:absolute; left:50%; bottom:-3px; transform:translateX(-50%);
  width:70%; height:10px; border-radius:999px;
  background:linear-gradient(90deg, rgba(47,143,87,.25), rgba(255,227,139,.25), rgba(47,143,87,.25));
  filter:blur(8px);
}
.icon{
  position:absolute; left:50%; top:-46px; transform:translateX(-50%);
  width:92px; height:92px; border-radius:30px; display:grid; place-items:center;
  background:#fff; color:#27313a; font-size:38px;
  box-shadow:0 22px 48px rgba(0,0,0,.22), 0 0 0 6px rgba(255,255,255,.9);
  animation:badgeBob 3s ease-in-out infinite;
}
@keyframes badgeBob{0%,100%{transform:translate(-50%,-2px)}50%{transform:translate(-50%,10px)}}
.tint-leaf    { background:linear-gradient(180deg,#edfff0 0%,#d8f8de 100%) }
.tint-terrace { background:linear-gradient(180deg,#f7fff4 0%,#e4f7d3 100%) }
.tint-sky     { background:linear-gradient(180deg,#eefaff 0%,#d6f1ff 100%) }
.tint-wheat   { background:linear-gradient(180deg,#fffaea 0%,#f6eec9 100%) }
.stat3d h3{ margin:2px 0 8px; font-weight:900; letter-spacing:.8px; font-size:clamp(38px,4.6vw,54px); color:#253036 }
.stat3d p { margin:0; font-weight:800; letter-spacing:.4px; color:#586a60; text-transform:capitalize }
[data-reveal]{ opacity:0; transform:translateY(18px) scale(.985) }
[data-reveal].visible{ opacity:1; transform:none; transition:.6s cubic-bezier(.21,.9,.32,1.2) }

/* =================
   ACCESSIBILITY
   ================= */
a:focus-visible,button:focus-visible{ outline:3px solid var(--gold); outline-offset:2px }
/* =======================================================
   Nayagarh DCCB • Gallery Section (Floral Agri Gradient)
   Pattern: Green Gobbler (TransparentTextures)
   ======================================================= */

:root {
  --soil: #082316;
  --canopy: #125835;
  --leaf: #24985b;
  --lime: #69c47f;
  --gold: #f0c43d;
  --cream: #f8fff5;
  --white: #ffffff;
  --shadow-lg: 0 30px 70px rgba(0,0,0,0.25);
  --shadow-md: 0 16px 40px rgba(0,0,0,0.18);
  --transition: all 0.35s ease;
}

/* ======================
   SECTION BACKGROUND
   ====================== */
.ndccb-gallery {
  position: relative;
  overflow: hidden;
  padding: 40px 0 60px;
  color: var(--white);
  background: linear-gradient(135deg, var(--soil) 0%, var(--canopy) 25%, var(--leaf) 60%, var(--lime) 80%, var(--gold) 100%);
  background-attachment: fixed;
}

.ndccb-gallery::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("images/lyonnette.png") repeat;
  background-size: 40px 40px;
  opacity: 0.18;   /* adjust 0.05 – 0.30 */
  pointer-events: none;
}

/* Pattern overlay (floral texture) */
/* ===== GALLERY GRID ===== */
.ndccb-gallery-wrap {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.ndccb-gallery-grid {
  display: grid;
  gap: 12px; /* reduced from 22px → tighter */
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  justify-items: center;
}

/* ===== THUMBNAIL CARDS ===== */
.ndccb-thumb {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1; /* makes the box a perfect square */
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  cursor: pointer;
  transition: all 0.35s ease;
  border: 4px solid #fff; /* white frame */
}

.ndccb-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease, filter 0.4s ease;
  filter: brightness(0.96) saturate(1.05);
}



/* Hover effects */
.ndccb-thumb:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.25);
}

.ndccb-thumb:hover img {
  transform: scale(1.05);
  filter: brightness(1.1) saturate(1.2);
}

/* Overlay gradient + caption */
.ndccb-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(10, 35, 20, 0.9) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.ndccb-thumb:hover::after {
  opacity: 1;
}

.ndccb-thumb figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px 14px;
  color: #fff;
  font-weight: 600;
  font-size: 13px;
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
  z-index: 2;
}

/* Subtle sunlight rays overlay */
.ndccb-gallery::after {
  content: "";
  position: absolute;
  inset: -10%;
  background: conic-gradient(
    from 200deg at 20% 30%,
    rgba(255, 255, 255, 0.25),
    rgba(240, 196, 61, 0.15),
    rgba(255, 255, 255, 0)
  );
  opacity: 0.15;
  animation: sunSweep 18s linear infinite;
  pointer-events: none;
  z-index: 0;
}

@keyframes sunSweep {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(6deg) scale(1.02); }
  100% { transform: rotate(0deg) scale(1); }
}

/* ======================
   HEADING SECTION
   ====================== */
.ndccb-gallery-head {
  position: relative;
  z-index: 2;
  text-align: center;
  color: #fff;
  margin-bottom: 56px;
  padding: 0 20px;
}

.ndccb-gallery-head .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.ndccb-gallery-head .title {
  font-size: clamp(26px, 3vw, 40px);
  font-weight: 900;
  margin-top: 16px;
  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.4);
}

.ndccb-gallery-head .divider {
  width: 150px;
  height: 4px;
  margin: 18px auto;
  background: linear-gradient(90deg, var(--gold), #ffffff);
  border-radius: 10px;
  box-shadow: 0 0 20px rgba(240, 196, 61, 0.5);
}

.ndccb-gallery-head .sub {
  max-width: 740px;
  margin: 0 auto;
  line-height: 1.6;
  color: #f3fff0;
  opacity: 0.9;
}

/* ======================
   GALLERY GRID
   ====================== */
.ndccb-gallery-wrap {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

.ndccb-gallery-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

/* ======================
   THUMBNAIL CARDS
   ====================== */
.ndccb-thumb {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
  cursor: pointer;
  transition: var(--transition);
  background: linear-gradient(180deg, #ffffff, #f6fff8);
  outline: 1px solid rgba(255, 255, 255, 0.15);
}

.ndccb-thumb img {
  width: 100%;
  height: 230px;
  object-fit: cover;
  filter: brightness(0.95) saturate(1.05);
  transition: transform 0.5s ease, filter 0.4s ease;
}

.ndccb-thumb:hover img {
  transform: scale(1.06);
  filter: brightness(1.1) saturate(1.2);
}

.ndccb-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(10, 35, 20, 0.9) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.ndccb-thumb:hover::after { opacity: 1; }

.ndccb-thumb figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 14px 18px;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
  z-index: 2;
}

/* Hover animation */
.ndccb-thumb:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-md);
}
.brandband .meta{
  position: relative;
  margin: 4px 0 0;
  padding-top: 4px;                 /* space between line and text */
  font-size: 13px;
  font-weight: 500;
  color: #455e57;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* gold → soft fade line */
.brandband .meta::before{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(240, 183, 67, 0.95) 0%,
    rgba(246, 220, 166, 0.55) 40%,
    rgba(255, 255, 255, 0) 100%
  );
}

/* icon styling */
.brandband .meta i{
  font-size: 16px;
  color: #038a52;
}

/* ======================
   LIGHTBOX
   ====================== */
.ndccb-lightbox[aria-hidden="true"] { display: none; }

.ndccb-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: linear-gradient(135deg, rgba(8, 35, 22, 0.96), rgba(18, 88, 53, 0.98));
  backdrop-filter: blur(10px);
}

.ndccb-lightbox-frame {
  background: linear-gradient(180deg, #ffffff, #f6fff9);
  border-radius: 20px;
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  max-width: 90%;
  max-height: 82vh;
  display: flex;
  flex-direction: column;
  animation: zoomIn 0.4s ease;
}

#lbImage {
  width: 100%;
  height: 65vh;
  object-fit: contain;
  background: #0b2317;
}

#lbCaption {
  padding: 14px 18px;
  font-size: 15px;
  font-weight: 600;
  color: #0b2317;
  background: #fff;
}

/* Lightbox Buttons */
.lb-btn {
  position: absolute;
  width: 50px;
  height: 50px;
  border-radius: 14px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: var(--transition);
}

.lb-btn:hover {
  background: rgba(240, 196, 61, 0.3);
  transform: scale(1.06);
}

.lb-prev { left: 28px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 28px; top: 50%; transform: translateY(-50%); }
.lb-close { top: 20px; right: 25px; }
.lb-btn i { font-size: 18px; }

/* ======================
   ANIMATIONS
   ====================== */
@keyframes zoomIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

/* ======================
   RESPONSIVE
   ====================== */
@media (max-width: 768px) {
  .ndccb-gallery { padding: 80px 0 100px; }
  .ndccb-thumb img { height: 190px; }
}

@media (max-width: 480px) {
  .ndccb-gallery { padding: 60px 0 80px; }
  .ndccb-thumb img { height: 160px; }
  .ndccb-gallery-head .title { font-size: 26px; }
}

/* =======================================================
   NDCCB • Tri-Deck (Notices / Tenders / Recruitments)
   Palette-aligned with existing theme vars
   ======================================================= */

/* -------- Theme adapters (no new colors, mapped to existing) -------- */
:root{
  --tri-ink: var(--ink-strong, #10161a);
  --tri-muted: var(--muted-2, #5f6d68);
  --tri-card: #fff;
  --tri-brd: #e7efe9;

  /* headers use same agri gradients */
  --tri-green-grad: radial-gradient(1200px 300px at 50% -100px, rgba(255, 255, 255, .12) 0%, transparent 60%), linear-gradient(180deg, #0e3d22 0%, #0a2f1a 40%, #0f3a21 100%);
  --tri-blue-grad:  radial-gradient(1200px 300px at 50% -100px, rgba(255, 255, 255, .12) 0%, transparent 60%), linear-gradient(180deg, #0e3d22 0%, #0a2f1a 40%, #0f3a21 100%);
  --tri-amber-grad: radial-gradient(1200px 300px at 50% -100px, rgba(255, 255, 255, .12) 0%, transparent 60%), linear-gradient(180deg, #0e3d22 0%, #0a2f1a 40%, #0f3a21 100%);

  /* date badges (match headers) */
  --tri-badge-green: linear-gradient(180deg, var(--leaf-700), var(--leaf-500));
  --tri-badge-blue:  linear-gradient(180deg, var(--leaf-700), var(--leaf-500));
  --tri-badge-amber: linear-gradient(180deg, var(--leaf-700), var(--leaf-500));

  /* shadows & focus */
  --tri-shadow: 0 22px 60px rgba(9,45,25,.08), 0 1px 0 rgba(15,75,40,.06) inset;
  --tri-head-shadow: inset 0 10px 28px rgba(0,0,0,.08);
  --tri-ring: 0 0 0 4px rgba(47,166,110,.18);

  /* sizing */
  --tri-rowH: 92px;
  --tri-gap: 12px;

  /* NEW badge */
  --tri-new-bg: #ffc81e;
  --tri-new-br: #ffd85b;
  --tri-new-ink: #1b2a1f;
}

/* -------- Section wrapper (soft texture like site) -------- */
.triDeck{
  padding: 26px 0 8px;
  padding-bottom:40px;
  background:
    radial-gradient(1100px 240px at 50% -120px, rgba(47,143,87,.08), transparent 60%),
    linear-gradient(180deg, var(--bg-top, #f7fff8), #ffffff 50%);
}

/* 3 columns, responsive */
.triDeck-grid{
  max-width: var(--container, 1240px);
  margin: 0 auto; padding: 0 18px;
  display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr);
}
@media (max-width:1100px){ .triDeck-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width:720px){  .triDeck-grid{ grid-template-columns: 1fr; } }

/* -------- Card -------- */
.triDeck-card{
  background: var(--tri-card);
  border: 1px solid var(--tri-brd);
  border-radius: 22px;
  box-shadow: var(--tri-shadow);
  display: flex; flex-direction: column; overflow: hidden;
}

/* Header (uniform height & weight) */
.triDeck-head{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; color:#fff; font-weight:900; letter-spacing:.3px;
  border-radius:22px 22px 0 0; box-shadow: var(--tri-head-shadow);
}
.triDeck-head i{ font-size:20px }
.triDeck-head h3{ margin:0; font-size:20px }

/* Header color variants */
.tri--green .triDeck-head{ background: var(--tri-green-grad); }
.tri--blue  .triDeck-head{ background: var(--tri-blue-grad); }
.tri--amber .triDeck-head{ background: var(--tri-amber-grad); }

/* Visible area shows up to 3 rows; overflow scrolls upward via JS */
.triDeck-viewport{
  padding:12px 12px 0 12px;
  height: calc(var(--tri-rowH) * 3 + var(--tri-gap) * 2);
  overflow: hidden;
}
.triDeck-track{ list-style:none; margin:0; padding:0 }
.triDeck-item + .triDeck-item{ margin-top: var(--tri-gap); }

/* Row link */
.triDeck-link{
  height: var(--tri-rowH);
  display:grid; grid-template-columns: 74px 1fr auto; gap:12px; align-items:center;
  padding:12px; border-radius:16px;
  color: var(--tri-ink); text-decoration:none;
  background:#fff; border:1px solid #edf4f0;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.triDeck-link:hover{
  box-shadow:0 12px 28px rgba(10,45,27,.08);
  transform: translateY(-1px);
  border-color:#dfeae4;
}
.triDeck-link:focus-visible{ outline: var(--tri-ring); outline-offset: 2px; }

/* Date badge */
.triDeck-date{
  width:74px; height:100%;
  display:grid; place-items:center; text-align:center;
  border-radius:14px; color:#fff;
  background: var(--tri-badge-green);
  box-shadow:0 12px 22px rgba(27,138,75,.22);
}
.triDeck-date .d{ font-size:24px; font-weight:900; line-height:1; }
.triDeck-date .m{ font-size:11px; letter-spacing:.8px; margin-top:2px; opacity:.95 }
.triDeck-date .y{ font-size:10px; opacity:.92 }
.tri--blue  .triDeck-date{ background: var(--tri-badge-blue);  box-shadow:0 12px 22px rgba(34,95,217,.22); }
.tri--amber .triDeck-date{ background: var(--tri-badge-amber); box-shadow:0 12px 22px rgba(163,115,30,.22); }

/* Caption & NEW chip */
.triDeck-body{ display:flex; align-items:center; gap:10px; min-width:0 }
.triDeck-cap{
  font-weight:900; color:#b61617; line-height:1.28; font-size:15.5px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.triDeck-badge{
  display:inline-flex; align-items:center; justify-content:center;
  height:22px; padding:0 8px; border-radius:999px;
  font-weight:900; font-size:11px; letter-spacing:.2px;
  color: var(--tri-new-ink); background: var(--tri-new-bg); border:1px solid var(--tri-new-br);
  animation: triBlink 1.1s linear infinite;
}
@keyframes triBlink { 50%{ filter:brightness(1.2) saturate(1.1) } }

/* Right action chip */
.triDeck-go{
  height:40px; width:40px; display:grid; place-items:center;
  border-radius:12px; color: var(--leaf-800);
  background:#eaf6ee; border:1px solid #cfe7d8;
  transition: transform .18s ease, background .18s ease;
}
.triDeck-link:hover .triDeck-go{ background:#dff2e7; transform: translateX(2px); }

/* Empty */
.triDeck-empty{
  margin:12px; padding:18px; text-align:center; color:var(--tri-muted);
  background:#f7fbf8; border:1px dashed #e1ece6; border-radius:16px;
}

/* Footer link */
.triDeck-foot{ padding:14px 16px 16px; margin-top:auto }
.triDeck-foot {
  padding: 18px 0 28px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.triDeck-view {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-weight: 900;
  font-size: 15px;
  color: #ffffff;
  text-decoration: none;
  letter-spacing: 0.4px;
  padding: 12px 22px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--leaf-700, #1f7a4b), var(--leaf-500, #2fa66e));
  box-shadow: 0 10px 22px rgba(6, 45, 27, 0.2), inset 0 0 0 1px rgba(255,255,255,0.2);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

/* subtle animated highlight */
.triDeck-view::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    rgba(255,255,255,0) 30%,
    rgba(255,255,255,0.3) 50%,
    rgba(255,255,255,0) 70%
  );
  transform: translateX(-100%);
  transition: transform 0.6s ease;
}

.triDeck-view:hover::before {
  transform: translateX(100%);
}

.triDeck-view:hover {
  background: linear-gradient(90deg, var(--gold, #f0c43d), #ffec8a);
  color: #1a2a1e;
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(240, 196, 61, 0.3);
}

/* icon styling */
.triDeck-view i {
  font-size: 16px;
  transition: transform 0.3s ease;
}

.triDeck-view:hover i {
  transform: translateX(3px);
}

.triDeck-view:hover{ text-decoration:underline }

/* A11Y helper */
.sr-only{ position:absolute; left:-9999px; }