/* event hero */

.event-hero-sec {
  background-image: url(../assets/khelmahotsav.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 300px;
  width: 100%;
}
.event-hero-sec .hero-text-container {
  /* width: 37.98611%; */
  width: 547px;
}

.event-hero-sec .hero-head {
  font-family: "Bebas", sans-serif;
  font-size: 89.69px;
  line-height: 86%;
  letter-spacing: 5%;
  text-transform: capitalize;
  color: #fff;
  position: relative;
  padding-top: 69px;
}

.event-hero-sec .hero-head::after {
  content: "";
  width: 120px;
  height: 2px;
  display: inline-flex;
  background-color: #fff;
  position: absolute;
  bottom: 0;
  left: 3px;
}
.event-hero-sec .hero-para {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  text-transform: capitalize;
  color: #fff;
  margin-top: 8px;
}
.event-hero-sec .breadcrumb {
  margin-top: 33px;
  padding-top: 9px;
  border-top: 1px solid #464646;
}
.bread-text {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 150%;
  line-height: normal;
  text-transform: capitalize;
  color: #fff;
}
.bread-text.fade {
  color: #b8b8b8;
}
.bread-arrow img {
  height: 10px;
  width: 10px;
}
.bread-icon img {
  height: 12px;
  width: 12px;
}
.breadcrumb-list {
  list-style: none;
  display: flex;
  gap: 4px;
}
.breadcrumb-itmes {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

/* festival section  */

.festival-wrapper {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 62px 0;
}

.festival-para {
  width: 638px;
}

.festival-para h4 {
  font-family: "Bebas";
  font-weight: 400;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: 0%;
  text-transform: uppercase;
  color: #0a7544;
  margin-bottom: 10px;
}
.festival-para h3 {
  font-family: "Bebas";
  font-weight: 400;
  font-size: 40px;
  line-height: 120%;
  letter-spacing: 0%;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 28px;
}

.festival-para-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
}

.festival-para-text p {
  font-family: "Inter";
  font-weight: 400;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: 0%;
}

.festival-para-text p .bold {
  font-family: "Inter";
  font-weight: 700;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: 0%;
}

/* festival box  */
.festival-box {
  width: 538px;
  background-color: #f5f5f5;
  padding: 37px 24px;
}

.festival-box h6 {
  font-family: "Bebas";
  font-weight: 400;
  font-size: 30px;
  line-height: 120%;
  letter-spacing: 0%;
  text-transform: uppercase;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 32px;
}

.festival-box-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.festival-card {
  width: 100%;
  height: 113px;
  background-color: #ffffff;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 13px;
  padding: 11px;
}

.festival-card img {
  height: 48px;
  width: 48px;
}

.festival-card-content h5 {
  font-family: "Bebas";
  font-weight: 400;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: 0%;
  text-transform: uppercase;
  color: #0a7544;
}

.festival-card-content p {
  font-family: "Inter";
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  letter-spacing: 0%;
}

/* =========================================
   PAST FESTIVAL SECTION
========================================= */

.past-festival-sec {
  width: 100%;
  background-color: #f5f5f5;
  padding: 50px 0;
}

.past-festival-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 45px;
}

/* Section heading */

.past-festival-wrapper h1 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 33px;

  margin: 0;

  font-family: "Bebas", sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 150%;
  letter-spacing: 0;
  text-transform: uppercase;
}

/* Cards wrapper */

.past-festival-cards {
  width: 100%;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;

  gap: 25px;
}

/* Individual card */

.past-festiv-card {
  width: 399px;
  max-width: 100%;

  background-color: #ffffff;

  display: flex;
  flex-direction: column;

  overflow: hidden;
}

.past-festiv-card:hover .past-festival-card-image img {
  transform: scale(1.1);
}

/* Card image */

.past-festival-card-image {
  width: 100%;
  height: 195px;

  position: relative;

  flex-shrink: 0;
  overflow: hidden;
}

.past-festival-card-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
  transition: transform 0.3s ease-in-out;
}

/* Year badge */

.past-festival-card-image .year {
  position: absolute;

  top: 15px;
  left: 14px;

  width: 56px;
  height: 29px;

  margin: 0;
  padding: 0;

  border-radius: 5px;

  background-color: #0a7544;
  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-family: "Bebas", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* Card content */

.past-festival-card-content {
  width: 100%;

  padding: 20px;

  display: flex;
  flex-direction: column;

  height: auto;
}

/* Card title */

.past-festival-card-content h2 {
  margin: 0 0 30px;

  font-family: "Bebas", sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 120%;
  letter-spacing: 0;
  text-transform: uppercase;
}

/* Date + guest group */

.date-guest {
  width: 100%;
}

/* Date */

.past-card-date {
  display: flex;
  align-items: flex-start;
  gap: 8px;

  margin-bottom: 15px;
}

.past-card-date img {
  width: 16.39px;
  height: 16.39px;

  flex-shrink: 0;
  margin-top: 2px;
}

.past-card-date p {
  margin: 0;

  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 120%;
  letter-spacing: 0;
}

.past-card-date p .bold-date {
  font-weight: 700;
}

/* Chief guest */

.chief-guest {
  margin: 0;
  padding-bottom: 20px;

  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 120%;
  letter-spacing: 0;
}

.chief-guest span {
  font-weight: 700;
}
/* =========================================
   PARTICIPATE SECTION
========================================= */

.participate-section {
  width: 100%;
  background-color: #fff;
  padding: 50px 0;
  overflow: hidden;
}

.participate-wrapper {
  width: 100%;
}

.participate-wrapper h2 {
  width: 100%;
  margin: 0 0 20px;

  display: flex;
  align-items: center;
  gap: 30px;

  font-family: "Bebas", sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 120%;
  text-transform: uppercase;
}

.participate-wrapper .black-line {
  display: block;
  width: 100px;
  height: 1px;
  background-color: #000;
  flex-shrink: 0;
}

/* Main content */

.participate-content {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 60px;
}

.participate-content > p {
  width: 390px;
  flex-shrink: 0;

  margin: 0;

  font-family: "Inter", sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 150%;
}

.participate-content > p span {
  font-weight: 700;
}

/* Steps box */

.participate-box {
  width: 783px;
  min-height: 265px;

  border: 1px solid rgba(0, 0, 0, 0.2);

  display: flex;
  align-items: stretch;
  justify-content: space-between;

  padding:0;
}

/* Individual step */

.participate-box .step {
  flex: 1;
  min-width: 0;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;

  padding: 0 25px;
}

/* Vertical divider between steps */

.participate-box .step + .step {
  border-left: 1px solid rgba(0, 0, 0, 0.15);
}

/* Step icon */

.participate-box .step > img {
  width: 48px;
  height: 48px;

  object-fit: contain;

  margin-bottom: 17px;
}

/* Step content */

.step-content {
  width: 100%;
}

.step-content h3 {
  margin: 0 0 10px;

  font-family: "Bebas", sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 120%;
  text-transform: uppercase;
  color: #0a7544;
}

.step-content p {
  width: 100%;
  margin: 0;

  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%;
}

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

@media (max-width: 1100px) {
  .participate-content {
    flex-direction: column;
    align-items: stretch;
    gap: 35px;
  }

  .participate-content > p {
    width: 100%;
  }

  .participate-box {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .festival-para {
    width: 621px;
    width: 100%;
    flex: 1;
  }
  .festival-box {
    flex: 1;
    width: 100%;
  }
  .event-hero-sec .hero-head {
    font-size: 50px;
  }

  .event-hero-sec .hero-para {
    width: 350px;
  }

  .participate-wrapper h2 {
    font-size: 32px;
    gap: 15px;
  }

  .participate-wrapper .black-line {
    width: 60px;
  }

  .participate-box {
    flex-direction: column;
    padding: 25px 20px;
  }

  .participate-box .step {
    width: 100%;
    padding: 20px 10px;
  }

  .participate-box .step + .step {
    border-left: none;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
  }
  .festival-card-content p {
    font-size: 12px;
  }
}
