:root{
  --primary:#F4B000;       /* saffron header feel */
  --maroon:#8E2C2C;
  --accent:#E06C00;
  --beige:#EFE4D3;
  --paper:#FFF8EC;
  --ink:#2E2E2E;
  --purple:#6A1B9A;
  --blue:#1565C0;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:var(--paper);
}

/* Utils */
.container{
  width:min(1100px, 92vw);
  margin-inline:auto;
}
.center{text-align:center}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #f6ecdc;
}


  .head-body {
      margin: 0;
      font-family: 'Khand', sans-serif;
    }
    .header {
      background: #f59e0b; /* Orange background */
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 10px;
      flex-wrap: wrap; /* responsive ke liye */
    }
    .header img {
      height: 80px;
      margin: 0 15px;
    }
    .header-text {
      text-align: center;
      max-width: 700px;
    }
    .header-text h1 {
      margin: 0;
      font-size: 28px;
      color: #7f1d1d;
      font-weight: 700;
    }
    .header-text h2 {
      margin: 5px 0;
      font-size: 20px;
      color: #1e3a8a;
      font-weight: 500;
    }
    .header-text p {
      background: white;
      display: inline-block;
      padding: 3px 8px;
      border-radius: 6px;
      margin: 5px 0 0 0;
      font-size: 16px;
    }

    /* Responsive */
    @media(max-width: 768px) {
      .header {
        flex-direction: column;
      }
      .header img {
        height: 60px;
        margin: 10px 0;
      }
      .header-text h1 {
        font-size: 22px;
      }
      .header-text h2 {
        font-size: 18px;
      }
      .header-text p {
        font-size: 14px;
      }
    }

/* Hero */
.hero{
  background-color: #f6ecdc;
  border-bottom:6px solid #b04632;
  padding:18px 0 10px;
}

/* Countdown */
.countdown{
  display:inline-block;
  margin:16px auto 0; font-size: 30px;
  padding:10px 14px; border-radius:10px;
  background:#fff; border:5px dashed #b0482f; color:#b0482f; font-weight:900;
}

/* Banner Start */
.banner-body {
      margin: 0;
      padding: 0;
      
      font-family: Arial, sans-serif;
    }

    .banner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      max-width: 1400px;
      margin: auto;
      /* padding: 30px 20px; */
      text-align: center;
    }

    /* Left Section */
    .left {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .left img {
      width: 250px;  /* Camel bada */
      max-width: 100%;
    }

    .dates {
      display: flex;
      gap: 15px;
      margin-top: 15px;
    }

    .date-box {
      background: #fff;
      border-radius: 12px;
      overflow: hidden;
      width: 100px;
      box-shadow: 0 3px 10px rgba(0,0,0,0.25);
      border: 2px solid #e74c3c;
    }

    .date-box .month {
      background: #e74c3c;
      color: #fff;
      font-weight: bold;
      padding: 5px 0;
      font-size: 16px;
    }

    .date-box .day {
      font-size: 28px;
      font-weight: bold;
      padding: 8px 0;
      color: #000;
    }

    .date-box .year {
      background: #0b0b61;
      color: #fff;
      font-size: 16px;
      padding: 5px 0;
    }

    /* Center Logo */
    .center img {
      width: 280px;  /* Logo bada */
      max-width: 100%;
    }

    /* Right Section */
    .right {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .right img {
      width: 250px; /* Camel bada */
      max-width: 100%;
    }

    .venue {
      max-width: 350px;
      color: #0b0b61;
      font-size: 20px; /* text bada */
      font-weight: bold;
      line-height: 1.5;
      margin-bottom: 15px;
    }

    /* Mobile Responsive */
    @media (max-width: 768px) {
      .banner {
        flex-direction: column;
        gap: 25px;
      }
      .left img, .right img {
        width: 180px;
      }
      .center img {
        width: 200px;
      }
      .venue {
        font-size: 16px;
      }
      .date-box {
        width: 85px;
      }
      .date-box .day {
        font-size: 22px;
      }
    }
/* Banner End */

/* Camel body */
:root{
      --bg:#f5eddc;         /* backdrop beige */
      --primary:#6b1fa7;    /* button color */
      --primary-2:#521783;
      --card:#ffffff;
      --ink:#0b0b61;
      --ring: rgba(107,31,167,.25);
    }

    *{box-sizing:border-box}
    body{
      margin:0;
      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      background: var(--bg);
      color:#222;
    }

    /* ====== Layout ====== */
    .wrap{
      max-width: 1400px;
      margin: 0 auto;
      padding: clamp(16px, 2vw, 32px);
      min-height: 70vh;

      display:flex;
      align-items:center;
      justify-content:space-between;
      gap: clamp(12px, 3vw, 28px);
    }

    .camel{
      flex: 0 0 auto;               /* don't stretch */
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .camel img{
      /* width: clamp(120px, 18vw, 320px);   responsive size */
      width: 100%;
      max-width: 350px;   
      height:auto;
      display:block;
      filter: drop-shadow(0 6px 12px rgba(0,0,0,.15));
      user-select:none;
      pointer-events:none;
    }
    .camel.right img{ transform: scaleX(-1); } /* mirror right camel */

    /* ====== Card ====== */
    .card{
      flex: 1 1 520px;                /* center column can grow */
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .panel{
      width: min(520px, 92vw);
      background: var(--card);
      border-radius: 14px;
      padding: 22px 20px;
      box-shadow:
        0 12px 30px rgba(0,0,0,.12),
        0 2px 6px rgba(0,0,0,.06);
      border: 1px solid rgba(0,0,0,.06);
    }
    .panel h2{
      margin: 0 0 14px;
      text-align: center;
      color: #a32a26;
      font-size: clamp(18px, 2.2vw, 22px);
      letter-spacing:.2px;
    }
    .field{
      display:flex;
      gap:10px;
      align-items:center;
      margin-top:10px;
    }
    input[type="tel"]{
      flex:1;
      font-size:16px;
      padding: 12px 14px;
      border-radius: 10px;
      border: 1.5px solid #d9d9e3;
      outline:none;
      transition: border-color .2s, box-shadow .2s;
      background:#f7f7fb;
    }
    input[type="tel"]:focus{
      border-color: var(--primary);
      box-shadow: 0 0 0 6px var(--ring);
      background:#fff;
    }
    button{
      flex:0 0 auto;
      padding: 12px 18px;
      border:0;
      margin-top: 10px;
      width: 100%;
      border-radius: 10px;
      background: #a32a26;
      color:#fff;
      font-weight:600;
      cursor:pointer;
      transition: transform .05s ease, background .2s ease;
      min-width: 130px;
    }
    button:hover{ background: #a32a26; }
    button:active{ transform: translateY(1px); }

    .hint{
      margin-top:10px;
      font-size:13px;
      color:#666;
      text-align:center;
    }

    /* ====== Small screens ====== */
    @media (max-width: 900px){
      .wrap{
        justify-content:center;
      }
      .camel img{
        width: clamp(110px, 22vw, 210px);
      }
    }
    @media (max-width: 640px){
      .wrap{
        gap:14px;
      }
      /* Camels move a bit outward to give card more room */
      .camel{ flex-basis: auto; }
      .camel img{ width: clamp(90px, 26vw, 160px); }

      /* If space is too tight, allow wrap on two rows */
      .wrap{
        flex-wrap: wrap;
      }
      .card{ order: 2; width:100% }
      .camel.left{ order:1 }
      .camel.right{ order:3 }
    }

/* Camel Body End  */


.box-body {
      margin: 0;
      padding: 0;
      font-family: Arial, sans-serif;
    }

    .box-container {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 20px;
      padding: 0 20px;
    }

    .box {
      background: #a42925;
      color: #fff;
      width: 220px;
      min-height: 120px;
      border-radius: 8px;
      padding: 20px;
      text-align: center;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      transition: transform 0.3s ease;
    }

    .box:hover {
      transform: translateY(-5px);
    }

    .icon {
      background: #f6b41a;
      width: 35px;
      height: 35px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      position: absolute;
      top: -18px;
      left: 50%;
      transform: translateX(-50%);
      font-size: 18px;
    }

    .text {
      margin-top: 10px;
      font-size: 16px;
      font-weight: bold;
      line-height: 1.4;
    }

    /* Responsive Design */
    @media (max-width: 1024px) {
      .box {
        width: 200px;
      }
    }

    @media (max-width: 768px) {
      .box-container {
        gap: 15px;
      }
      .box {
        width: 45%;
      }
    }

    @media (max-width: 480px) {
      .box {
        width: 90%;
      }
    }

/* slideshow start */
.slideshow-body {
      margin: 0;
      font-family: Arial, sans-serif;
      background-color: #f4ecd7;
    }

    .event-section {
      text-align: center;
      padding: 40px 20px;
    }

    .event-section h2 {
      font-size: 2rem;
      font-weight: bold;
      color: #b73225;
      position: relative;
      display: inline-block;
      margin-bottom: 20px;
    }

    .event-section h2::after {
      content: "";
      display: block;
      width: 60%;
      height: 3px;
      background-color: #d4a017;
      margin: 5px auto 0;
    }

    .event-box {
      border: 1px solid #333;
      max-width: 900px;
      margin: 0 auto;
      padding: 0;
      background: #fdfaf3;
      overflow: hidden; /* extra image bahar na dikhe */
    }

    .slideshow-container {
      position: relative;
      width: 100%;
      height: 400px; /* box height fix rakhi hai */
    }

    .slideshow-container img {
      width: 100%;
      height: 100%;
      object-fit: cover; /* image ko resize karke fit karega */
      display: none;
    }

    .slideshow-container img.active {
      display: block;
      animation: fade 1s ease-in-out;
    }

    @keyframes fade {
      from {opacity: 0.4;}
      to {opacity: 1;}
    }

    /* Responsive */
    @media (max-width: 768px) {
      .event-section h2 {
        font-size: 1.6rem;
      }
      .slideshow-container {
        height: 250px;
      }
    }

    @media (max-width: 480px) {
      .event-section h2 {
        font-size: 1.4rem;
      }
      .slideshow-container {
        height: 200px;
      }
    }
/* slideshow end */

/* Exhibitor Start */
.exhibitors {
  text-align: center;
  padding: 40px 20px;
}

.exhibitors h2 {
  color: #b22222;
  margin-bottom: 10px;
  font-size: 28px;
}

.exhibitors p {
  max-width: 800px;
  margin: 0 auto 40px;
  font-size: 16px;
  color: #222;
  line-height: 1.6;
}

.exhibitor-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* circles ko horizontal center karega */
  gap: 100px; /* circles ke beech ka gap */
  max-width: 1000px; /* optional - ek proper width set kare */
  margin: 0 auto; /* container ko center kare */
  text-align: center;

  /* display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 1100px;
  margin: 0 auto; */
}

.exhibitor-item {
  background: #fff;
  border-radius: 50%;
  padding: 20px;
  text-align: justify;
  transition: transform 0.3s;
  width: 180px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* .exhibitor-item img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 50%;
} */

.exhibitor-item img {
  width: 100%;
  image-rendering: auto;
  object-fit: cover;
  height: 100px;
  border-radius: 50%;
}

.exhibitor-item h3 {
  margin-top: 15px;
  font-size: 16px;
  color: #000;
}

.exhibitor-item:hover {
  transform: scale(1.05);
}

/* Responsive Design */
@media (max-width: 992px) {
  .exhibitor-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .exhibitor-grid {
    grid-template-columns: 1fr;
  }
  
  .exhibitor-item img {
    height: 150px;
  }
}
/* End Exhibitor */

/* Venue Start */
.venue-body {
      margin: 0;
      padding: 0;
      font-family: Arial, sans-serif;
      text-align: center;
    }

.venue-section {
  padding: 20px;
}

.venue-section h2 {
  color: #a32d21;
  margin-bottom: 10px;
  text-transform: uppercase;
  text-decoration: underline;
}

.venue-section p {
  color: #0b0b61;
  font-size: 18px;
  margin-bottom: 20px;
}

/* Responsive map container */
.map-container {
  display: flex;
      justify-content: center;
      border-radius: 50%;
      align-items: center;
}

.map-container iframe {
  width: 80%;     /* Responsive width (80% of screen) */
  max-width: auto; /* Max size */
  height: 350px;  /* Fixed height */
}
/* Venue End */


/* footer */
/*.footer {*/
/*  background: #f4a300;*/
/*  color: #000;*/
/*  padding: 40px 20px;*/
/*  font-family: Arial, sans-serif;*/
/*}*/

/*.footer-container {*/
/*  display: flex;*/
/*  justify-content: space-between;*/
/*  align-items: flex-start;*/
/*  max-width: 1200px;*/
/*  margin: auto;*/
/*  flex-wrap: wrap;*/
/*  gap: 30px;*/
/*}*/

/*.footer-left {*/
/*  flex: 1;*/
/*  min-width: 250px;*/
/*  text-align: center;*/
/*}*/

/*.footer-left img {*/
/*  max-width: 180px;*/
/*  width: 100%;*/
/*  height: auto;*/
/*  border-radius: 10px;*/
/*}*/

/*.footer-left p {*/
/*  margin-top: 15px;*/
/*  font-size: 16px;*/
/*  line-height: 1.5;*/
/*}*/

/*.footer-right {*/
/*  flex: 2;*/
/*  min-width: 300px;*/
/*}*/

/*.footer-center h2 {*/
/*  color: #b22222;*/
/*  font-size: 28px;*/
/*  font-weight: bold;*/
/*  position: relative;*/
/*  margin-bottom: 20px;*/
/*}*/

/*.footer-right h2::after {*/
/*  content: "";*/
/*  display: block;*/
/*  width: 50px;*/
/*  height: 3px;*/
/*  background: #b22222;*/
/*  margin-top: 5px;*/
/*}*/

/*.footer-right ul {*/
/*  list-style: none;*/
/*  padding: 0;*/
/*}*/

/*.footer-right ul li {*/
/*  margin: 10px 0;*/
/*  font-size: 16px;*/
/*  line-height: 1.4;*/
/*}*/

/*.footer-right i {*/
/*  margin-right: 10px;*/
/*  color: #000;*/
/*}*/

/*.social-icons {*/
/*  margin-top: 20px;*/
/*  text-align: end;*/
/*}*/

/*.social-icons a {*/
/*  color: #000;*/
/*  margin: 0 10px;*/
/*  font-size: 20px;*/
/*  text-decoration: none;*/
/*  transition: color 0.3s ease;*/
/*}*/

/*.social-icons a:hover {*/
/*  color: #b22222;*/
/*}*/

/* ===== Responsive Design ===== */
/*@media (max-width: 900px) {*/
/*  .footer-container {*/
/*    flex-direction: column;*/
/*    text-align: center;*/
/*    align-items: center;*/
/*  }*/

/*  .footer-right h2 {*/
/*    font-size: 24px;*/
/*  }*/

/*  .footer-left img {*/
/*    max-width: 150px;*/
/*  }*/
/*}*/

/*@media (max-width: 600px) {*/
/*  .footer-right h2 {*/
/*    font-size: 22px;*/
/*  }*/

/*  .footer-left p,*/
/*  .footer-right ul li {*/
/*    font-size: 14px;*/
/*  }*/

/*  .footer-left img {*/
/*    max-width: 120px;*/
/*  }*/
/*}*/

/* Responsive */
/*@media (max-width: 992px){*/
/*  .hero-grid{grid-template-columns:1fr}*/
/*  .feature-row{grid-template-columns: repeat(3, 1fr)}*/
/*  .exhibitors-grid{grid-template-columns: repeat(3, 1fr)}*/
/*}*/
/*@media (max-width: 560px){*/
/*  .top-ribbon .container{grid-template-columns: 64px 1fr 64px}*/
/*  .top-ribbon img{height:48px}*/
/*  .title-hindi{font-size:.98rem}*/
/*  .subtitle{font-size:.85rem}*/
/*  .highlight-box{padding:16px}*/
/*  .feature-row{grid-template-columns: repeat(2, 1fr)}*/
/*  .exhibitors-grid{grid-template-columns: repeat(2, 1fr)}*/
/*  .badge{width:104px}*/
/*  .map{height:260px}*/
/*  .visitor-row .btn{padding:10px 12px}*/
/*}*/





.footer {
  background-color: #f0a500;
  color: #000;
  padding: 40px 20px;
  font-family: Arial, sans-serif;
}

.footer-container {
  max-width: 1200px;
  margin: auto;
  display: flex;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}

/* Left */
.footer-left {
  /* flex: 1; */
  min-width: 220px;
  text-align: center;
}
.footer-logo {
  max-width: 170px;
  margin-bottom: 15px;
}
.footer-left p {
  font-size: 16px;
  line-height: 1.6;
}

/* Center (Contact) */
.footer-center {
  /* flex: 1.5; */
  min-width: 260px;
  /* text-align: center; */
}

.footer-center h2{
  color: #b22222;
  font-size: 28px;
  margin-bottom: 15px;
  border-bottom: 2px solid #b22222;
  display: inline-block;
  padding-bottom: 5px;
}

.footer-center ul {
  list-style: none;
  padding: 0;
  margin: 0 0 20px 0;
}
.footer-center ul li {
  margin-bottom: 12px;
  font-size: 15px;
  line-height: 1.6;
}
.footer-center ul li i {
  margin-right: 8px;
  color: #b22222;
}

/* Social Icons */
.social-icons {
  display: flex;
  justify-content: center;
  gap: 15px;
}
.social-icons a {
  font-size: 22px;
  color: #000;
  transition: 0.3s;
}
.social-icons a:hover {
  color: #b22222;
}

/* Right (Know Us) */
.footer-right {
  /* flex: 1; */
  min-width: 220px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.footer-right h2 {
  /* color: #b22222;
  font-size: 28px;
  margin-bottom: 15px;
  border-bottom: 2px solid #b22222;
  display: inline-block;
  padding-bottom: 5px; */

    color: #b22222;
  font-size: 20px;
  margin-bottom: 15px;
  border-bottom: 2px solid #b22222;
  display: inline-block;   /* text जितनी width लेगा */
  padding-bottom: 5px;
}
.footer-right ul {
  list-style: none;
  /* padding-left: 20px; */
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 20px;
}
.footer-right .social-icons {
  margin-top: auto;   /* ensures icons नीचे push हो जाएं */
  display: flex;
  gap: 15px;
}

/* Responsive */
@media (max-width: 768px) {
  .footer-container {
    flex-direction: column;
    text-align: center;
  }
  .footer-right ul {
    text-align: left;
    display: inline-block;
  }
}

footer a {
      display: block;
      margin: 6px 0;
      color: black;
      text-decoration: none;
      cursor: pointer;
    }

    /* Modal styles */
    .modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.6);
  justify-content: center;
  align-items: center;
  padding: 10px;
}

.modal-content {
  background: #fff;
  border-radius: 10px;
  max-width: 600px;
  width: 100%;
  max-height: 80vh;  /* Important: so bada content scroll ho */
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 20px;
}

.modal-body {
  flex: 1;
  overflow-y: auto;  /* scrollable body */
  margin: 10px 0;
  line-height: 1.5;
  font-size: 14px;
}

.close-btn {
  font-size: 22px;
  cursor: pointer;
  float: right;
}

.ok-btn {
  align-self: flex-end;
  background: orange;
  border: none;
  padding: 8px 15px;
  border-radius: 5px;
  cursor: pointer;
}
    @keyframes fadeIn {
      from {opacity: 0; transform: scale(0.9);}
      to {opacity: 1; transform: scale(1);}
    }

    @media(max-width: 600px) {
      .modal-content {
        font-size: 14px;
        padding: 15px;
      }
    }


.terms-scroll::-webkit-scrollbar {
  width: 6px;
}
.terms-scroll::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 4px;
}

.terms-scroll {
  max-height: 400px;
  overflow-y: auto;
  line-height: 1.7;
  padding-right: 10px;
}
.terms-scroll p{
  padding-top: 10px;
}