    :root{
      --bg: #07130b;
      --card: rgba(255,255,255,.08);
      --line: rgba(255,255,255,.12);
      --text: rgba(255,255,255,.86);
      --muted: rgba(255,255,255,.65);
      --brand: #57d27a;
      --brand2: #10b981;
    }

    html, body { font-family: "Poppins","Zain", system-ui, -apple-system, Segoe UI, Roboto, Arial; }
    /* body { background: #0b0f0d; color: #111; font-size: 15px; } */

    /* NAV */
    .nav-blur{
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      background: rgba(8, 12, 10, .70);
      border-bottom: 1px solid rgba(255,255,255,.06);
    }

    /* HERO */
    .hero {
      position: relative;
      min-height: 100vh;
      display: grid;
      place-items: center;
      overflow: hidden;
      background: radial-gradient(1200px 700px at 10% 10%, rgba(87,210,122,.18), transparent 60%),
                  radial-gradient(900px 600px at 90% 20%, rgba(16,185,129,.14), transparent 55%),
                  linear-gradient(180deg, #061009 0%, #0b0f0d 75%);
      color: #fff;
    }

    .hero::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        
        url("../img/main-banner.webp") center/cover no-repeat;
      filter: saturate(1.1) contrast(1.05);
      transform: scale(1.04);
      z-index: 0;
    }

    .hero-content { position: relative; z-index: 1; }

    .pill {
      display:inline-flex;
      gap:.5rem;
      align-items:center;
      padding:.35rem .75rem;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.18);
      background: rgba(255,255,255,.08);
      color: var(--text);
      font-size: .9rem;
    }

    .hero h1{
      font-weight: 800;
      letter-spacing: -0.02em;
      line-height: 1.05;
    }

    .hero-sub{
      color: var(--text);
      max-width: 60ch;
    }

    .hero-card{
      color: var(--bg);
      /* background-color: #fff; */
       backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(255, 255, 255, 0.74);
      background: rgba(255, 255, 255, 0.9); 
      border-radius: 18px;
      padding: 1.25rem;
    }

    .btn-brand{
      background: linear-gradient(135deg, var(--brand), var(--brand2));
      border: 0;
      color: #052010;
      font-weight: 700;
      border-radius: 12px;
      padding: .85rem 1.05rem;
    }
    .btn-brand:hover{ filter: brightness(.95); }
    .btn-ghost{
      border: 1px solid rgba(255,255,255,.22);
      background: rgba(255,255,255,.06);
      color: #fff;
      border-radius: 12px;
      padding: .85rem 1.05rem;
      font-weight: 600;
    }
    .btn-ghost:hover{ background: rgba(255,255,255,.10); color: #fff; }

    /* SECTIONS */
    .section{
      padding: 80px 0;
    }
    .section-title{
      font-weight: 800;
      letter-spacing: -0.02em;
    }
    .section-lead{ color: #556; max-width: 70ch; }

    .glass{
      background: rgba(255,255,255,.70);
      border: 1px solid rgba(0,0,0,.06);
      border-radius: 18px;
      box-shadow: 0 18px 60px rgba(0,0,0,.08);
    }

    .feature{
      border-radius: 18px;
      border: 1px solid rgba(0,0,0,.06);
      background: #fff;
      box-shadow: 0 10px 35px rgba(0,0,0,.06);
      overflow: hidden;
      height: 100%;
    }
    .feature .icon{
     
      display:grid; place-items:center;
      border-radius: 14px;
      background: rgba(87,210,122,.18);
      color: #0b6b3a;
    }

    /* CLOSED BOX */
    .closed{
      border-radius: 22px;
      border: 1px solid rgba(0,0,0,.08);
      background: linear-gradient(135deg, rgba(16,185,129,.14), rgba(87,210,122,.10));
      overflow: hidden;
    }
    .closed .badge{
      background: rgba(16,185,129,.18) !important;
      color: #0b6b3a !important;
    }

    /* GALLERY */
    .gallery a{ display:block; border-radius: 18px; overflow:hidden; }
    .gallery img{
      width: 100%;
      height: 230px;
      object-fit: cover;
      transition: transform .35s ease;
    }
    .gallery a:hover img{ transform: scale(1.05); }

    /* FOOTER */
    footer{
      background: #061009;
      color: rgba(255,255,255,.86);
      border-top: 1px solid rgba(255,255,255,.08);
    }
    footer a{ color: rgba(255,255,255,.78); text-decoration: none; }
    footer a:hover{ color: #fff; }

    /* Animations: elements start hidden, GSAP reveals */
    .reveal { opacity: 0; transform: translateY(16px); }


    .hero-card .form-control,
.hero-card .form-select,
.hero-card .input-group-text{
 border-color: rgba(37, 37, 37, 0.18) !important; 
}
.hero-card .form-control,
.hero-card .form-select{
  background: rgba(255,255,255,.06) !important;
  /* color: #fff !important; */
}
.hero-card .form-control::placeholder{
  /* color: rgba(255,255,255,.55) !important; */
}
.hero-card .btn-outline-light{
  color: var(--brand2);
   border-color:var(--brand2) !important; 
}
.hero-card .btn-check:checked + .btn-outline-light{
  background: rgba(87,210,122) !important;
  border-color: rgb(63, 216, 106) !important;
}
.about-modern {
  background: linear-gradient(180deg, #ffffff 0%, #f7faf8 100%);
}
.bg-light-green {
  background-color: #d2f8df;
}

.about-eyebrow {
  display: inline-flex;
  align-items: center;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #198754;
}

.about-visual {
  min-height: 420px;
}

.about-visual img {
  object-fit: cover;
}

.about-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.15),
    rgba(0,0,0,0.55)
  );
}

.about-badge {
  position: absolute;
  left: 20px;
  bottom: 20px;
  background: rgba(255,255,255,0.9);
  backdrop-filter: blur(6px);
  padding: 10px 16px;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  color: #14532d;
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

.section-title {
  font-weight: 800;
  letter-spacing: -0.02em;
}


    /* Mobile-first hero image sizing */
.hero-date-img{
  width: 100%;
  max-width: 520px;   /* desktop cap */
  height: auto;
}

/* Make pills readable and not too wide on mobile */
.pill{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .9rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .95rem;
  white-space: nowrap;
}

/* On very small screens allow pills to break if needed */
@media (max-width: 360px){
  .pill{ white-space: normal; text-align: center; }
}

/* Optional: reduce top padding on mobile */
@media (max-width: 576px){
  .hero-content{ padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
  .hero {
      position: relative;
      min-height: 100vh;
      display: grid;
      place-items: center;
      overflow: hidden;
      background: radial-gradient(1200px 700px at 10% 10%, rgba(87,210,122,.18), transparent 60%),
                  radial-gradient(900px 600px at 90% 20%, rgba(16,185,129,.14), transparent 55%),
                  linear-gradient(180deg, #061009 0%, #0b0f0d 75%);
      color: #fff;
    }

    .hero::before{
      content:"";
      position:absolute;
      inset:0;
      background:        
        url("../img/main-banner-sm.webp") center/cover no-repeat;
      filter: saturate(1.1) contrast(1.05);
      transform: scale(1.04);
      z-index: 0;
    }
}
.agriSwiper { padding: 10px 2px 50px; }

.agri-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.agri-card__img{
  height: 220px;
  overflow: hidden;
}
.agri-card__img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.agri-card:hover .agri-card__img img{
  transform: scale(1.05);
}

.agri-card__body{
  padding: 18px 18px 20px;
}

.agri-card__title{
  font-weight: 800;
  font-size: 1.05rem;
  margin-bottom: .75rem;
}

.agri-card__text{
  color: #5b6560;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 5;     /* limits text height */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Swiper controls look nicer */
.agriSwiper .swiper-button-prev,
.agriSwiper .swiper-button-next{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.agriSwiper .swiper-button-prev::after,
.agriSwiper .swiper-button-next::after{
  font-size: 16px;
  font-weight: 900;
  color: #111;
}

.agriSwiper .swiper-pagination-bullet{
  width: 10px;
  height: 10px;
  opacity: .35;
}
.agriSwiper .swiper-pagination-bullet-active{
  opacity: 1;
}
.stand-section{
  position: relative;
  background:  url("../img/main-banner.webp") center/cover no-repeat;
  padding: 70px 0;
}

.stand-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 600px at 10% 10%, rgba(71, 255, 138, 0.22), transparent 55%),
    radial-gradient(900px 600px at 90% 25%, rgba(56,189,248,.16), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.70), rgba(5, 141, 57, 0.82));
}

.stand-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.35rem .85rem;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color:#fff;
  font-weight:700;
  letter-spacing:.06em;
  font-size:.85rem;
  text-transform:uppercase;
}

.stand-title{
  color:#fff;
  font-weight:900;
  letter-spacing:-0.02em;
  margin: 0;
}

.stand-sub{
  color: rgba(255,255,255,.72);
  max-width: 70ch;
}

.glass-card{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.text-white-75{ color: rgba(255,255,255,.75) !important; }

.stand-pill{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.45rem .75rem;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color:#fff;
  font-weight:600;
  font-size:.9rem;
}

.stand-input{
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #fff !important;
  border-radius: 14px !important;
}

.stand-input::placeholder{ 
  color: rgba(255,255,255,.55) !important; 
  font-size: medium;
}

.stand-input:focus{
  border-color: rgba(87,210,122,.7) !important;
  box-shadow: 0 0 0 .25rem rgba(34,197,94,.18) !important;
}
.profiles { background: #fff; }

.profiles-eyebrow{
  padding: .4rem .85rem;
  border-radius: 999px;
  background: rgba(25,135,84,.08);
  color: #198754;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .82rem;
}

.profile-block .section-title{
  font-weight: 900;
  letter-spacing: -0.02em;
}

.profile-item{
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: .9rem 1rem;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.06);
  background: #fff;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}

.profile-icon{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(25,135,84,.10);
  color: #198754;
  font-size: 1.1rem;
  flex: 0 0 auto;
}

.profiles-card{
  position: sticky;
  top: 110px;
  border-radius: 22px;
  overflow: hidden;
  color: #fff;
  background: radial-gradient(700px 500px at 20% 20%, rgba(34,197,94,.35), transparent 60%),
              radial-gradient(700px 500px at 80% 30%, rgba(56,189,248,.22), transparent 60%),
              linear-gradient(180deg, #0b2b22, #061a15);
  box-shadow: 0 24px 70px rgba(0,0,0,.30);
  border: 1px solid rgba(255,255,255,.12);
}

.profiles-card__top{
  padding: 24px;
}

.text-white-75{ color: rgba(255,255,255,.75) !important; }

.profiles-stats{
  padding: 0 24px 18px;
  display: grid;
  gap: 14px;
}

.stat{
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}

.stat-icon{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.10);
}

.stat-label{
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgba(255,255,255,.7);
  font-weight: 800;
}

.stat-value{
  font-weight: 700;
}

.profiles-card__img{
  height: 220px;
  background: url("EN/img/feature.jpg") center/cover no-repeat;
  filter: saturate(1.05);
}
.sponsors-static {
  background: #fff;
}

/* Eyebrow */
.eyebrow {
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .85rem;
  color: #198754;
}

/* Sponsor cards */
.sponsor-card {
  position: relative;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  /* box-shadow: 0 18px 45px rgba(0,0,0,.08); */
  padding: 28px 20px;
  /* height: 200px; */
  display: grid;
  place-items: center;
}

.sponsor-card img {
  /* max-width: 100%; */
  /* max-height: 100px; */
  /* object-fit: contain; */
}

.sponsor-tier {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: .35rem .75rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 800;
  text-transform: uppercase;
}

.tier-main {
  background: rgba(34,197,94,.15);
  color: #166534;
}

.tier-elite {
  background: rgba(59,130,246,.15);
  color: #1e3a8a;
}

.tier-bronze {
  background: rgba(245,158,11,.18);
  color: #7c2d12;
}

/* Exhibitors grid */
.exhibitor-card {
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.06);
  background: #fff;
  /* box-shadow: 0 12px 30px rgba(0,0,0,.07); */
  height: 120px;
  display: grid;
  place-items: center;
  padding: 18px;
  transition: transform .25s ease, box-shadow .25s ease;
}

.exhibitor-card img {
  max-width: 100%;
  max-height: 70px;
  object-fit: contain;
}

.exhibitor-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.12);
}
